/* ==========================================================
   DInvite — Tema "Samudra" (koleksi Alam)
   Biru laut dalam, mutiara & emas pasir. Pembuka: ombak tergulung ke
   atas; sinar matahari menembus air, gelembung naik, ubur-ubur
   berdenyut, kerang mutiara, karang & rumput laut bergoyang di dasar.
   Gerak dimatikan otomatis bila perangkat meminta gerak minimal.
   ========================================================== */
.t-samudra {
    --bg: #0a3946; --bg-2: #0d4452; --card: rgba(12,74,90,.7); --ink: #eef7f5; --muted: #a9cfd0;
    --accent: #e2c48a; --accent-2: #f3efe6; --on-accent: #0a3946; --line: rgba(191,239,240,.24);
    --hero-rgb: 10,57,70; --tint-a: .82; --hero-ink: #f3efe6;
    --pattern: url(../../img/themes/samudra/pola.svg) 0 0 / 60px 30px;
    color-scheme: dark;
}
@keyframes smRise { from { opacity: 0; transform: translateY(24px) scale(.97); } }
@keyframes smFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
@keyframes smRays { 0%, 100% { opacity: .55; transform: translateX(-2%) skewX(-8deg); } 50% { opacity: .85; transform: translateX(2%) skewX(-8deg); } }
@keyframes smCaustic { from { background-position: 0 0, 0 0; } to { background-position: 240px 120px, -180px 90px; } }

.t-samudra .names { font-family: 'Great Vibes', cursive; font-weight: 400; color: var(--accent-2); text-shadow: 0 2px 14px rgba(0,30,40,.5); }
.t-samudra .names i { font-family: 'Cormorant Garamond', serif; font-style: italic; font-size: .45em; color: var(--accent); vertical-align: middle; }
.t-samudra .cover .names { font-size: clamp(3.1rem, 13vw, 4.6rem); line-height: 1.15; }
.t-samudra .names--md { color: var(--accent-2); }
.t-samudra .kicker { font-family: 'Cormorant Garamond', serif; font-weight: 600; font-size: .84rem; letter-spacing: .4em; color: var(--accent); }
.t-samudra .sec__title { font-family: 'Cormorant Garamond', serif; font-weight: 600; font-size: 2rem; color: var(--accent-2); }
.t-samudra .sec__title::after { content: ''; display: block; width: 220px; height: 36px; margin: .35rem auto 0; background: url(../../img/themes/samudra/pembatas.svg) center / contain no-repeat; }
.t-samudra .reveal .sec__title::after { transform: scaleX(.2); opacity: 0; transition: transform 1.2s cubic-bezier(.2,.7,.2,1) .25s, opacity 1s ease .25s; }
.t-samudra .reveal.is-visible .sec__title::after { transform: none; opacity: 1; }
.t-samudra .cover__date, .t-samudra .hero__date, .t-samudra .aside__date, .t-samudra .thanks, .t-samudra .countdown__date { font-family: 'Cormorant Garamond', serif; font-style: italic; font-weight: 600; color: var(--accent); }
.t-samudra .cover__to strong { font-family: 'Cormorant Garamond', serif; font-weight: 600; color: var(--accent-2); }
.t-samudra .quote { font-family: 'Cormorant Garamond', serif; font-style: italic; font-size: 1.22rem; line-height: 1.75; }

/* Laut: gradasi dalam, sinar matahari & pantulan cahaya bergerak */
.t-samudra .am-panel::before { background: url(../../img/themes/samudra/ombak.svg) center bottom / 100% 100% no-repeat, #0f5566; }
.t-samudra .cover, .t-samudra .hero, .t-samudra .aside {
    background: linear-gradient(var(--hero-tint), var(--hero-tint)), var(--cover, none) center / cover no-repeat,
        linear-gradient(180deg, #1d7f8c 0%, #0f5566 45%, #0a3946 100%);
    overflow: hidden;
}
.t-samudra .cover > .tm-frame::after, .t-samudra .hero > .tm-frame::after, .t-samudra .aside > .tm-frame::after {
    content: ''; position: absolute; inset: -10% 0 auto; height: 80%; pointer-events: none; transform-origin: top;
    background: repeating-linear-gradient(100deg, rgba(255,255,240,0) 0 40px, rgba(255,255,240,.09) 40px 70px, rgba(255,255,240,0) 70px 130px);
    -webkit-mask-image: linear-gradient(#000, transparent); mask-image: linear-gradient(#000, transparent); animation: smRays 9s ease-in-out infinite;
}
.t-samudra .hero::after, .t-samudra .aside::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: clamp(90px, 22vw, 140px); pointer-events: none; z-index: 0;
    background: url(../../img/themes/samudra/dasar.svg) center bottom / auto 100% repeat-x; }
.t-samudra .cover::before { inset: 18px; border: 1px solid var(--line); border-radius: 0 0 160px 160px; z-index: 1; }
.t-samudra .cover::after { inset: 26px; border: 1px solid rgba(226,196,138,.22); border-radius: 0 0 150px 150px; z-index: 1; opacity: 1; }
.t-samudra .cover__inner { padding: 1.4rem 1.2rem; border-radius: 26px; background: radial-gradient(ellipse at center, rgba(8,48,60,.86) 0%, rgba(8,48,60,.66) 55%, rgba(8,48,60,0) 78%); }
.t-samudra .tm-band { display: none; }
.t-samudra .tm-corner { width: clamp(60px, 17vw, 100px); }
.t-samudra .tm-frame { z-index: 1; }
.t-samudra .cover .tm-house { width: min(170px, 46vw); animation: smRise 1.4s ease both, smFloat 6s ease-in-out 1.4s infinite; filter: drop-shadow(0 14px 24px rgba(0,20,30,.5)); }
.t-samudra .hero .tm-house { width: min(230px, 62vw); filter: none; }
.t-samudra .aside .tm-house { width: 270px; filter: none; }
.t-samudra .tm-house--sm { width: 130px; }
.t-samudra .hero .hero__inner, .t-samudra .aside .aside__inner { z-index: 2; }
.t-samudra .cover .kicker { animation: smRise 1.1s ease .35s both; }
.t-samudra .cover .names { animation: smRise 1.2s ease .55s both; }
.t-samudra .cover__date { animation: smRise 1.1s ease .8s both; }
.t-samudra .cover__to { animation: smRise 1.1s ease 1s both; }
.t-samudra .cover .ibtn { animation: smRise 1.1s ease 1.2s both; }
.t-samudra .am-rise i { width: calc(16px * var(--s)); height: calc(16px * var(--s)); }

/* Kartu kaca laut dengan pantulan cahaya bergerak */
.t-samudra .event, .t-samudra .gift, .t-samudra .rsvp, .t-samudra .wish, .t-samudra .qr-card, .t-samudra .lstory__card {
    border-radius: 18px; border: 1px solid var(--line); background: var(--card);
    -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); box-shadow: 0 18px 34px -22px rgba(0,0,0,.7);
}
.t-samudra .event { position: relative; overflow: hidden; }
.t-samudra .event::before { inset: 0; border: 0; border-radius: 0; opacity: .5; pointer-events: none;
    background: radial-gradient(60px 18px at 20% 30%, rgba(191,239,240,.18), transparent), radial-gradient(80px 22px at 70% 60%, rgba(191,239,240,.14), transparent);
    background-size: 240px 120px, 180px 90px; animation: smCaustic 14s linear infinite; }
.t-samudra .event h3 { font-family: 'Cormorant Garamond', serif; font-weight: 600; font-size: 1.6rem; color: var(--accent); }
.t-samudra .event > * { position: relative; }
.t-samudra .reveal .event, .t-samudra .reveal .gift, .t-samudra .reveal .person { opacity: 0; transform: translateY(22px); transition: opacity 1s ease, transform 1s cubic-bezier(.2,.7,.2,1); }
.t-samudra .reveal.is-visible .event, .t-samudra .reveal.is-visible .gift, .t-samudra .reveal.is-visible .person { opacity: 1; transform: none; }
.t-samudra .reveal.is-visible .event:nth-child(2), .t-samudra .reveal.is-visible .gift:nth-child(2), .t-samudra .reveal.is-visible .person:nth-of-type(2) { transition-delay: .25s; }
.t-samudra .countdown div { border-radius: 50% 50% 46% 46%; background: rgba(12,74,90,.7); border-color: var(--line); box-shadow: inset -4px -6px 12px rgba(0,0,0,.18), inset 4px 4px 10px rgba(255,255,255,.08); }
.t-samudra .countdown b { font-family: 'Cormorant Garamond', serif; color: var(--accent-2); }
.t-samudra .divider { background: var(--accent); }
.t-samudra .ibtn { border-radius: 999px; }
.t-samudra .ibtn--solid { background: linear-gradient(180deg, #f6ecd8, #e2c48a); border-color: #f3efe6; color: #0a3946; box-shadow: 0 0 22px -6px rgba(243,239,230,.55); }
.t-samudra .ibtn--solid:hover { background: linear-gradient(180deg, #fffaf0, #ecd2a0); color: #0a3946; }
.t-samudra .pframe::before { border-color: var(--accent); }
.t-samudra .pframe::after { box-shadow: 0 0 0 4px var(--bg); }
.t-samudra .lstory__dot { background: var(--accent-2); box-shadow: 0 0 0 4px var(--bg), 0 0 12px 2px rgba(191,239,240,.5); }
.t-samudra .lstory__title, .t-samudra .tale__title { font-family: 'Cormorant Garamond', serif; color: var(--accent-2); }
.t-samudra .page { background: linear-gradient(180deg, #0c4554, #0a3946 30%, #08303c); }
.t-samudra .sec--tint { background-color: rgba(255,255,255,.03); background-image: var(--pattern); }
.t-samudra .amp { font-family: 'Great Vibes', cursive; color: var(--accent); }
.t-samudra .ifoot { border-top: 1px solid var(--line); }

@media (prefers-reduced-motion: reduce) {
    .t-samudra .reveal .event, .t-samudra .reveal .gift, .t-samudra .reveal .person { opacity: 1; transform: none; }
    .t-samudra .reveal .sec__title::after { transform: none; opacity: 1; }
}