/* Serein — sage, kabut biru, ivory, dan ritme visual yang hening. */
.t-serein {
    --bg: #eff5f1; --bg-2: #dcebe5; --card: #f9fcfa; --ink: #29433d; --muted: #6a817a;
    --accent: #6b9a8b; --accent-2: #9fc5b5; --on-accent: #fff; --line: rgba(107,154,139,.25);
    --hero-rgb: 239,245,241; --tint-a: .82; --hero-ink: #29433d;
    --serif-r: 'Cormorant Garamond', Georgia, serif;
    color-scheme: light;
}
.t-serein::before { content: ''; position: fixed; inset: 0; z-index: -1; pointer-events: none; background: radial-gradient(ellipse at 18% 18%, rgba(255,255,255,.8), transparent 32%), radial-gradient(ellipse at 84% 78%, rgba(107,154,139,.12), transparent 36%); }
.t-serein .page { background: linear-gradient(130deg, rgba(107,154,139,.06) 1px, transparent 1px) 0 0 / 28px 28px, var(--bg); }
.t-serein .cover, .t-serein .hero, .t-serein .aside { background-image: linear-gradient(var(--hero-tint), var(--hero-tint)), var(--cover, none), radial-gradient(circle at 50% 8%, rgba(255,255,255,.86), transparent 50%), linear-gradient(145deg, #f9fcfa, #dcebe5); }
.t-serein .cover::before { inset: 20px; border: 1px solid rgba(107,154,139,.5); border-radius: 34px; }
.t-serein .cover::after { inset: auto 18% 11%; height: 84px; border: 0; border-top: 1px solid rgba(107,154,139,.4); border-radius: 50%; transform: rotate(-5deg); opacity: .7; }
.t-serein .cover__inner { gap: 1rem; }
.t-serein .kicker { font: 600 .68rem 'DM Sans', sans-serif; letter-spacing: .36em; color: var(--accent); }
.t-serein .names, .t-serein .names i, .t-serein .sec__title, .t-serein .event h3,
.t-serein .lstory__title, .t-serein .quote, .t-serein .wishes__title, .t-serein .thanks { font-family: var(--serif-r); }
.t-serein .names { font-weight: 500; letter-spacing: -.02em; color: var(--hero-ink); }
.t-serein .names i { color: var(--accent); }
.t-serein .cover .names { font-size: clamp(3.6rem, 15vw, 5.4rem); line-height: .95; }
.t-serein .cover__date, .t-serein .hero__date, .t-serein .aside__date { font: 500 1.08rem var(--serif-r); letter-spacing: .14em; color: var(--accent); }
.t-serein .cover__to strong { font: 500 1.5rem var(--serif-r); }
.t-serein .sec { padding-block: 4.8rem; }
.t-serein .sec--tint { background: linear-gradient(180deg, rgba(220,235,229,.7), rgba(220,235,229,.95)); }
.t-serein .sec__title { font-weight: 600; font-size: 2.45rem; color: var(--ink); }
.t-serein .sec__title::after { content: '⌁'; margin-top: .25rem; font-size: 1.8rem; font-weight: 400; color: var(--accent); }
.t-serein .lead-txt, .t-serein .person__parents, .t-serein .event__addr, .t-serein .story, .t-serein .lstory__text { color: var(--muted); }
.t-serein .quote { font-size: 1.35rem; line-height: 1.6; color: var(--ink); }
.t-serein .ornament { font-size: 0; }
.t-serein .ornament::before { content: '◌'; font: 2rem/1 var(--serif-r); color: var(--accent); }
.t-serein .event, .t-serein .lstory__card, .t-serein .gift, .t-serein .rsvp, .t-serein .wish { border-radius: 28px; background: rgba(249,252,250,.84); border-color: var(--line); box-shadow: 0 24px 50px -35px rgba(41,67,61,.42); }
.t-serein .event::before { inset: 8px; border-radius: 21px; border-color: rgba(107,154,139,.18); }
.t-serein .event h3, .t-serein .lstory__title, .t-serein .gift__bank { color: var(--accent); }
.t-serein .divider { width: 52px; background: linear-gradient(90deg, transparent, var(--accent), transparent); }
.t-serein .ibtn { border-radius: 999px; border-color: var(--accent); letter-spacing: .04em; }
.t-serein .ibtn--solid { background: var(--accent); box-shadow: 0 12px 24px -16px var(--accent); }
.t-serein .pframe { padding: 10px; }
.t-serein .pframe::before { border-radius: 999px; border-color: var(--accent); }
.t-serein .pframe::after { width: 9px; height: 9px; border-radius: 50%; background: var(--accent-2); box-shadow: 0 0 0 4px var(--bg); }
.t-serein .pframe__arch { border-radius: 999px 999px 24px 24px; background: var(--bg-2); }
.t-serein .pframe__init { font-family: var(--serif-r); color: var(--accent); background: radial-gradient(circle at 50% 35%, #fff, var(--bg-2)); }
.t-serein .countdown div { border-radius: 20px; background: rgba(249,252,250,.8); border-color: var(--line); }
.t-serein .countdown b { font-family: var(--serif-r); font-size: 1.9rem; color: var(--accent); }
.t-serein .music { border-radius: 50%; background: var(--accent); color: var(--on-accent); border-color: var(--accent); }
.t-serein .ifoot { border-top-color: var(--line); }
.t-serein .ifld input, .t-serein .ifld textarea, .t-serein .ifld select { border-color: var(--line); background: rgba(255,255,255,.7); color: var(--ink); }
.t-serein .lstory::before { background: linear-gradient(var(--accent), rgba(107,154,139,.12)); }
.t-serein .lstory__dot { background: var(--accent); box-shadow: 0 0 0 4px var(--bg), 0 0 0 5px var(--line); }
@keyframes sereinFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-4px); } }
.t-serein .sec__title, .t-serein .ornament { animation: sereinFloat 7s ease-in-out infinite; }
@media (prefers-reduced-motion: reduce) { .t-serein .sec__title, .t-serein .ornament { animation: none; } }
