:root{
  --green-900:#06281d; --green-800:#0b3d2e; --green-700:#125340; --green-600:#1b6b54;
  --gold:#d9b25f; --gold-light:#f3dc9b; --gold-deep:#a8802f; --cream:#f7efd9; --ink:#f3ead2;
  --serif:'Cormorant Garamond',Georgia,serif; --caps:'Cinzel','Times New Roman',serif; --script:'Great Vibes','Brush Script MT',cursive;
  --goldgrad:linear-gradient(135deg,#a8802f,#f3dc9b 45%,#c9993f 70%,#f3dc9b);
  box-sizing:border-box; padding-top:env(safe-area-inset-top,0px); padding-bottom:env(safe-area-inset-bottom,0px);
}
html{scroll-padding-top:env(safe-area-inset-top,0px);background:var(--green-900)}
*,*::before,*::after{box-sizing:inherit}
body{margin:0;background:radial-gradient(ellipse at top,var(--green-700),var(--green-900) 70%);color:var(--ink);font-family:var(--serif);font-size:20px;line-height:1.6;text-align:center;overflow-x:hidden}
body.locked{overflow:hidden}
.gold-text{background:var(--goldgrad);-webkit-background-clip:text;background-clip:text;color:transparent}
.wrap{max-width:560px;margin:0 auto;padding:0 24px}
h1,h2,h3,p{margin:0}
.caps{font-family:var(--caps);letter-spacing:.22em;font-size:12px;color:var(--gold)}

/* ---------- closed card ---------- */
#cover{position:fixed;inset:0;z-index:50;display:flex;align-items:center;justify-content:center;overflow:hidden}
.door{position:absolute;top:0;bottom:0;width:50.2%;background:
  radial-gradient(circle at 50% 50%,rgba(217,178,95,.14) 0 2px,transparent 3px) 0 0/34px 34px,
  linear-gradient(160deg,var(--green-700),var(--green-900));
  transition:transform 1.5s cubic-bezier(.7,0,.2,1);will-change:transform}
.door.l{left:0;border-right:1px solid var(--gold)}
.door.r{right:0;border-left:1px solid var(--gold)}
.door::after{content:"";position:absolute;inset:18px;border:1px solid rgba(217,178,95,.55);pointer-events:none}
.door.l::after{border-right:0}.door.r::after{border-left:0}
#cover.open .l{transform:translateX(-101%)}
#cover.open .r{transform:translateX(101%)}
#cover.open .cover-ui{opacity:0;transform:scale(1.15);pointer-events:none}
.cover-ui{position:relative;z-index:2;transition:all .7s ease;padding:24px}
.cover-ui .caps{display:block;margin-bottom:18px}
.cover-ui .nm{font-family:var(--script);font-size:clamp(54px,17vw,84px);line-height:1.05;margin:0}
.cover-ui .amp{font-family:var(--serif);font-style:italic;font-size:26px;color:var(--gold);display:block}
.seal{margin:34px auto 14px;width:104px;height:104px;border-radius:50%;border:0;cursor:pointer;background:radial-gradient(circle at 35% 30%,#fbe9ae,#d9b25f 55%,#a8802f);color:var(--green-900);font-family:var(--script);font-size:40px;box-shadow:0 0 0 7px rgba(217,178,95,.22),0 14px 34px rgba(0,0,0,.5);animation:pulse 2.2s ease-in-out infinite}
.seal:focus-visible{outline:3px solid #fff;outline-offset:6px}
@keyframes pulse{50%{box-shadow:0 0 0 16px rgba(217,178,95,.08),0 14px 34px rgba(0,0,0,.5)}}
.hint{font-family:var(--caps);font-size:11px;letter-spacing:.3em;color:var(--gold-light)}

/* ---------- hero ---------- */
.hero{position:relative;padding:0 0 40px;min-height:100vh;overflow:hidden}
.toran{display:block;width:100%;height:auto;max-height:130px}
.hero .caps{margin-top:18px;display:block}
.hero h1{font-family:var(--script);font-weight:400;font-size:clamp(58px,19vw,92px);line-height:1.05;margin-top:6px}
.hero .weds{font-style:italic;color:var(--gold);font-size:24px;display:block;margin:-4px 0}
.date{margin:14px auto 0;display:inline-flex;gap:18px;align-items:center;font-family:var(--caps);letter-spacing:.2em;font-size:15px;color:var(--gold-light)}
.date i{width:36px;height:1px;background:var(--gold);display:block}
.date b{font-size:30px;font-weight:600;letter-spacing:.1em}
.couple{width:min(78vw,330px);margin:14px auto 0;display:block;filter:drop-shadow(0 18px 24px rgba(0,0,0,.45))}
.petal{position:absolute;top:-20px;width:11px;height:15px;border-radius:70% 0 70% 0;background:var(--gold);opacity:.7;animation:fall linear infinite}
@keyframes fall{to{transform:translateY(110vh) rotate(540deg)}}

/* ---------- sections ---------- */
section{padding:62px 0}
.divider{display:block;margin:0 auto 22px;width:150px;height:18px}
h2{font-family:var(--script);font-weight:400;font-size:46px;line-height:1.1;margin-bottom:6px}
.sub{color:var(--cream);opacity:.8;font-style:italic;margin-bottom:34px}
.person{background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.015));border:1px solid rgba(217,178,95,.5);border-radius:200px 200px 18px 18px;padding:34px 24px 30px;position:relative}
.person::after{content:"";position:absolute;inset:7px;border:1px solid rgba(217,178,95,.22);border-radius:194px 194px 12px 12px;pointer-events:none}
.avatar{width:128px;height:128px;border-radius:50%;margin:0 auto 14px;border:2px solid var(--gold);background:var(--green-800);overflow:hidden}
.avatar svg{display:block;width:100%;height:100%}
.person h3{font-family:var(--caps);font-weight:600;letter-spacing:.14em;font-size:24px;margin:8px 0 4px}
.person .par{font-size:19px;color:var(--cream)}
.person .par span{display:block;font-size:14px;font-style:italic;color:var(--gold);margin-top:8px}
.and{font-family:var(--script);font-size:60px;line-height:1;margin:14px 0}

.rituals{display:grid;gap:14px;text-align:left}
.rit{display:grid;grid-template-columns:76px 1fr;gap:18px;align-items:center;padding:16px 18px;border:1px solid rgba(217,178,95,.4);border-radius:14px;background:rgba(6,40,29,.5)}
.rit.main{border-color:var(--gold);background:linear-gradient(135deg,rgba(217,178,95,.2),rgba(6,40,29,.5))}
.rit .d{text-align:center;font-family:var(--caps);border-right:1px solid rgba(217,178,95,.4);padding-right:14px}
.rit .d b{display:block;font-size:30px;line-height:1;color:var(--gold-light)}
.rit .d small{font-size:12px;letter-spacing:.2em;color:var(--gold)}
.rit h3{font-family:var(--caps);font-size:16px;letter-spacing:.12em;font-weight:600}
.rit p{font-size:17px;opacity:.85;line-height:1.35;margin-top:3px}

.count{display:flex;justify-content:center;gap:12px;margin-bottom:6px}
.count div{min-width:68px;padding:12px 6px;border:1px solid rgba(217,178,95,.5);border-radius:12px}
.count b{display:block;font-family:var(--caps);font-size:26px;color:var(--gold-light)}
.count small{font-size:12px;letter-spacing:.16em;color:var(--gold);font-family:var(--caps)}

.venue h3{font-family:var(--caps);font-size:20px;letter-spacing:.14em;font-weight:600}
.venue p{margin:6px 0 20px;opacity:.9}
.map{position:relative;height:250px;border-radius:16px;overflow:hidden;border:1px solid var(--gold);background:
  linear-gradient(90deg,transparent 48%,rgba(217,178,95,.28) 49% 51%,transparent 52%),
  linear-gradient(0deg,transparent 58%,rgba(217,178,95,.2) 59% 61%,transparent 62%),
  linear-gradient(35deg,transparent 40%,rgba(217,178,95,.16) 41% 42.5%,transparent 43.5%),
  var(--green-800);display:flex;align-items:center;justify-content:center}
.map svg{width:46px;height:62px;filter:drop-shadow(0 6px 8px rgba(0,0,0,.5))}
.btn{display:inline-block;margin-top:20px;padding:14px 30px;border-radius:40px;background:var(--goldgrad);color:var(--green-900);font-family:var(--caps);font-weight:600;font-size:13px;letter-spacing:.16em;text-decoration:none}
.btn:focus-visible{outline:3px solid #fff;outline-offset:4px}
footer{padding:46px 24px calc(60px + env(safe-area-inset-bottom,0px))}
footer .nm{font-family:var(--script);font-size:46px}
footer p{opacity:.8;font-style:italic}
@media (prefers-reduced-motion:reduce){.petal,.seal{animation:none}.door{transition-duration:.01s}}
