:root{
  --deep: #7A0E1E;
  --red: #B3122A;
  --red-mid: #C21B34;
  --cream: #F3E6D2;
  --cream-deep: #EADFC6;
  --paper: #FBF6EC;
  --gold: #C9A227;
  --gold-soft: #D9B75E;
  --ink: #2A2018;
}
*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{ margin:0; background:var(--cream); color:var(--ink); font-family:'EB Garamond', serif; overflow-x:hidden; }
@media (prefers-reduced-motion: reduce){ *{ animation:none !important; transition:none !important; } }

section{ position:relative; padding:90px 24px; display:flex; flex-direction:column; align-items:center; justify-content:center; }

.section-label{ font-family:'Playfair Display', serif; font-style:italic; letter-spacing:0.15em; text-transform:uppercase; font-size:0.72rem; color:var(--red-mid); margin-bottom:10px; }
.section-title{ font-family:'Playfair Display', serif; font-weight:600; font-size:clamp(1.6rem,4vw,2.2rem); color:var(--deep); margin:0 0 40px; text-align:center; }

/* ===================== COVER ===================== */
#cover{
  position:fixed; inset:0; z-index:100;
  background: linear-gradient(180deg, var(--cream) 0%, var(--cream-deep) 100%);
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  text-align:center; transition: opacity 0.8s ease, visibility 0.8s ease;
}
#cover.hidden{ opacity:0; visibility:hidden; pointer-events:none; }
.cover-badge{
  width:min(340px,82vw); height:min(340px,82vw);
  filter: drop-shadow(0 18px 40px rgba(122,14,30,0.25));
}
#open-btn{
  margin-top:28px; font-family:'Playfair Display', serif; font-style:italic; font-size:1rem;
  padding:12px 34px; border:1px solid var(--red); background:transparent; color:var(--red);
  cursor:pointer; letter-spacing:0.05em; transition:all 0.3s ease;
}
#open-btn:hover{ background:var(--red); color:var(--paper); }

#audio-toggle{
  position:fixed; top:16px; right:16px; z-index:60; width:42px; height:42px; border-radius:50%;
  border:1px solid var(--gold-soft); background:var(--deep); color:var(--gold-soft); font-size:1rem; cursor:pointer;
}

/* ===================== HERO ===================== */
#hero{
  height: 50vh; text-align:center;
  background: radial-gradient(ellipse at 50% 20%, rgba(179,18,42,0.06), transparent 60%), var(--paper);
}
.floral{ width:100%; max-width:900px; height:auto; }
.floral-top{ position:absolute; top:0; left:50%; transform:translateX(-50%); width:100%; max-width:1100px; }
.hero-badge{
  width:min(340px,80vw); height:min(340px,80vw); margin-top:70px;
  filter: drop-shadow(0 18px 40px rgba(122,14,30,0.2));
}

/* ===================== VERSE ===================== */
#verse{ background:var(--cream); text-align:center; padding:70px 24px; }
#verse blockquote{ max-width:560px; margin:0; font-family:'Playfair Display', serif; font-style:italic; font-size:clamp(1rem,2.2vw,1.25rem); line-height:1.8; color:var(--deep); }
#verse cite{ display:block; margin-top:16px; font-style:normal; font-size:0.7rem; letter-spacing:0.2em; text-transform:uppercase; color:var(--gold); }

/* ===================== SCRATCH / SAVE THE DATE ===================== */
#savedate{ background:var(--deep); color:var(--paper); text-align:center; padding:90px 24px 110px; }
#savedate .section-label{ color:var(--gold-soft); }
#savedate .section-title{ color:var(--paper); }
.scroll-wrap{ position:relative; width:min(260px,70vw); height:190px; }
.scroll-rod{ position:absolute; left:-14px; right:-14px; height:16px; background: linear-gradient(90deg,var(--gold-soft),var(--gold),var(--gold-soft)); border-radius:8px; }
.scroll-rod.top{ top:-8px; }
.scroll-rod.bottom{ bottom:-8px; }
.scratch-wrap{ position:relative; width:100%; height:100%; background:var(--cream-deep); overflow:hidden; }
.scratch-reveal{ position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; }
.scratch-reveal .rmonth{ font-family:'Playfair Display', serif; letter-spacing:0.25em; font-size:0.8rem; color:var(--red-mid); }
.scratch-reveal .rday{ font-family:'Playfair Display', serif; font-weight:600; font-size:2.6rem; color:var(--deep); }
.scratch-reveal .ryear{ font-size:1rem; color:var(--red-mid); }
.scratch-reveal .rtime{ font-size:0.8rem; color:var(--ink); margin-top:6px; }
#scratch-canvas{ position:absolute; inset:0; cursor:pointer; touch-action:none; }
.scratch-hint{ margin-top:44px; font-size:0.72rem; letter-spacing:0.2em; text-transform:uppercase; color:var(--gold-soft); }

/* ===================== COUPLE CARD ===================== */
#couple{ background:var(--cream); }
.couple-card{
  background:var(--paper); max-width:440px; width:100%; padding:40px 34px;
  text-align:center; border:1px solid var(--cream-deep); box-shadow:0 20px 50px -30px rgba(179,18,42,0.35);
}
.couple-card p.intro{ font-size:0.92rem; line-height:1.7; color:var(--ink); opacity:0.85; margin-bottom:26px; }
.couple-row{ display:flex; gap:16px; margin-bottom:22px; }
.person{ flex:1; background:var(--cream); padding:18px 12px; }
.person .role{ font-size:0.65rem; letter-spacing:0.2em; text-transform:uppercase; color:var(--red-mid); margin-bottom:6px; }
.person .pname{ font-family:'Alex Brush', cursive; font-size:1.7rem; color:var(--red); margin:0 0 6px; }
.person .parents{ font-size:0.78rem; color:var(--ink); opacity:0.75; line-height:1.4; }
.info-row{ background:var(--cream); padding:14px 16px; margin-bottom:12px; text-align:center; }
.info-row .ilabel{ font-size:0.62rem; letter-spacing:0.2em; text-transform:uppercase; color:var(--red-mid); margin-bottom:4px; }
.info-row .ival{ font-size:0.92rem; color:var(--ink); }

/* ===================== TIMELINE ===================== */
#timeline{ background:var(--cream); }
.tl-list{ list-style:none; margin:0; padding:0; max-width:320px; width:100%; position:relative; }
.tl-list::before{ content:""; position:absolute; left:9px; top:8px; bottom:8px; width:1px; background:var(--red-mid); opacity:0.4; }
.tl-item{ position:relative; padding:0 0 30px 34px; }
.tl-item:last-child{ padding-bottom:0; }
.tl-item::before{ content:""; position:absolute; left:2px; top:3px; width:16px; height:16px; border-radius:50%; border:2px solid var(--red); background:var(--paper); }
.tl-item h3{ margin:0 0 4px; font-family:'Playfair Display', serif; font-size:1.05rem; color:var(--deep); }
.tl-item span{ font-size:0.82rem; color:var(--ink); opacity:0.7; }

/* ===================== VENUE / MAP ===================== */
#venue{ background:var(--paper); text-align:center; }
.map-frame{ width:min(500px,90vw); height:260px; border:1px solid var(--cream-deep); overflow:hidden; margin-bottom:20px; }
.map-frame iframe{ width:100%; height:100%; border:0; }
.map-btn{ display:inline-block; font-family:'Playfair Display', serif; font-style:italic; font-size:0.9rem; padding:11px 30px; background:var(--red); color:var(--paper); text-decoration:none; letter-spacing:0.03em; }
.map-btn:hover{ background:var(--deep); }

/* ===================== COUNTDOWN ===================== */
#countdown{ background:var(--deep); color:var(--paper); }
#countdown .section-label{ color:var(--gold-soft); }
#countdown .section-title{ color:var(--paper); }
.clock{ display:flex; gap:14px; flex-wrap:wrap; justify-content:center; }
.clock-cell{ width:76px; padding:14px 0; background:rgba(255,255,255,0.06); text-align:center; }
.clock-num{ font-family:'Playfair Display', serif; font-weight:600; font-size:1.7rem; color:var(--paper); }
.clock-unit{ margin-top:6px; font-size:0.6rem; letter-spacing:0.18em; text-transform:uppercase; color:var(--gold-soft); }

/* ===================== POLAROID GALLERY ===================== */
#memories{ background:var(--cream); }
.polaroid-strip{ display:flex; gap:16px; flex-wrap:wrap; justify-content:center; max-width:760px; }
.polaroid{ width:130px; background:#fff; padding:8px 8px 22px; box-shadow:0 10px 24px -14px rgba(179,18,42,0.45); transform:rotate(var(--r,0deg)); }
.polaroid:nth-child(odd){ --r:-3deg; }
.polaroid:nth-child(even){ --r:2deg; }
.polaroid .ph{ width:100%; height:130px; background:var(--cream-deep); display:flex; align-items:center; justify-content:center; }
.polaroid .ph svg{ width:36%; opacity:0.5; }
.polaroid .pcap{ margin-top:8px; text-align:center; font-family:'Alex Brush', cursive; font-size:1.15rem; color:var(--red); }

/* ===================== RSVP ===================== */
#rsvp{ background:var(--paper); text-align:center; }
.rsvp-org{ font-family:'Playfair Display', serif; font-style:italic; font-size:1rem; color:var(--deep); margin:0 0 8px; }
.rsvp-numbers{ font-family:'Playfair Display', serif; font-weight:700; font-size:1.02rem; line-height:1.8; margin:0 0 28px; }
.rsvp-numbers a{ color:var(--ink); text-decoration:none; }
.rsvp-numbers a:hover{ color:var(--red); }
form{ display:flex; flex-direction:column; gap:18px; width:100%; max-width:380px; }
.field{ display:flex; flex-direction:column; align-items:flex-start; gap:6px; text-align:left; }
label{ font-size:0.65rem; letter-spacing:0.18em; text-transform:uppercase; color:var(--red-mid); }
input, select{ width:100%; font-family:'EB Garamond', serif; font-size:1rem; padding:9px 4px; border:none; border-bottom:1px solid var(--cream-deep); background:transparent; color:var(--ink); outline:none; }
input:focus, select:focus{ border-bottom-color:var(--red); }
button{ margin-top:10px; align-self:center; font-family:'Playfair Display', serif; font-style:italic; letter-spacing:0.05em; font-size:0.9rem; background:var(--red); color:var(--paper); border:1px solid var(--red); padding:12px 36px; cursor:pointer; transition:all 0.25s ease; }
button:hover{ background:transparent; color:var(--red); }
#rsvp-note{ margin-top:16px; font-size:0.85rem; color:var(--red); min-height:1.2em; }

.floral-bottom-strip{ width:100%; max-width:1100px; display:block; margin:0 auto; }

footer{ background:var(--cream); text-align:center; padding:50px 24px 60px; }
footer .fmsg{ max-width:460px; margin:0 auto 18px; font-size:0.95rem; line-height:1.7; color:var(--ink); opacity:0.85; }
footer .fname{ font-family:'Alex Brush', cursive; font-size:1.8rem; color:var(--red); }
footer .ffam{ margin-top:6px; font-size:0.7rem; letter-spacing:0.2em; text-transform:uppercase; color:var(--red-mid); }
