/* Layout concept: one phone-width illustrated scroll — palace door → invitation → date → story → events → guest info → RSVP → farewell.
   A single deliberate light palette (a printed invitation), so no dark-theme override. */
:root{
  --burgundy:#741F32; --burgundy-deep:#4E1220; --burgundy-soft:#8E2A3D;
  --gold:#C6A15B; --gold-light:#E7CF95; --gold-deep:#8F6A2E;
  --ivory:#F8F0E3; --ivory-2:#FBF6EC; --blush:#E9C9C5; --sand:#D8B6A0;
  --terracotta:#B86E59; --ink:#49342E; --ink-soft:#6E5649; --marigold:#E8902A; --marigold-2:#F2B33D;
  --script:"Pinyon Script","Great Vibes",cursive;
  --serif:"Cormorant Garamond","Cormorant",Georgia,"Times New Roman",serif;
  --deva:"Tiro Devanagari Hindi","Noto Serif Devanagari","Mangal",serif;
  --w:min(100vw,440px);
  --gutter:30px; /* right/left rail kept clear for the floating lotus */
  color-scheme:light;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
html.locked,html.locked body{overflow:hidden;height:100%}
body{margin:0;font-variant-numeric:lining-nums;background:#3a0e18;color:var(--ink);font-family:var(--serif);font-size:18px;line-height:1.55;
  background-image:radial-gradient(circle at 50% 0,#6a1a2c 0,#3a0e18 70%);background-attachment:fixed;overflow-x:hidden}
img,svg{max-width:100%;display:block}
a{color:var(--burgundy)}
button,input,textarea,select{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--gold-deep);outline-offset:3px;border-radius:6px}
[hidden]{display:none!important}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* phone frame */
.phone{position:relative;width:var(--w);margin:0 auto;background:var(--ivory);overflow:hidden;
  box-shadow:0 0 0 1px rgba(198,161,91,.35),0 30px 80px rgba(0,0,0,.45)}
.paper{background-color:var(--ivory);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .45 0 0 0 0 .32 0 0 0 0 .2 0 0 0 .07 0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E")}

section{position:relative}
.wrap{padding-left:var(--gutter);padding-right:var(--gutter)}
.eyebrow{font-family:var(--serif);font-size:12.5px;letter-spacing:.28em;text-transform:uppercase;color:var(--gold-deep);font-weight:600;text-align:center;margin:0}
.h-script{font-family:var(--script);font-weight:400;color:var(--burgundy);font-size:44px;line-height:1.15;margin:.1em 0 .2em;text-align:center;text-wrap:balance}
.h-deva{font-family:var(--deva);color:var(--burgundy);font-size:24px;margin:0;text-align:center;line-height:1.5}
.lead{font-size:18px;color:var(--ink-soft);text-align:center;text-wrap:pretty;margin:0}
.center{text-align:center}

/* reveal */
.rv{opacity:0;transform:translateY(14px);transition:opacity .9s ease,transform .9s ease;transition-delay:var(--d,0s)}
.rv.in{opacity:1;transform:none}
.no-js .rv{opacity:1;transform:none}

/* ornament divider */
.divider{display:block;width:210px;height:26px;margin:18px auto}

/* ============ HERO / PALACE ============ */
.hero{min-height:max(100svh,700px);height:100svh;max-height:920px;position:relative;overflow:hidden;
  background:radial-gradient(120% 70% at 50% 38%,#FFF9EF 0,#F8EEDD 55%,#EBD9BF 100%)}
.hero-sky{position:absolute;inset:auto 0 0 0;height:46%;pointer-events:none}
.hero-sky svg{width:100%;height:100%}
.hero-frame{position:absolute;inset:0;pointer-events:none;z-index:3}
.hero.closed .scroll-cue{display:none}
.hero-arch{position:absolute;top:0;left:0;width:100%}
.pillar{position:absolute;top:0;bottom:0;width:26px;
  background:linear-gradient(90deg,#4E1220 0,#8E2A3D 35%,#A33A4C 50%,#8E2A3D 65%,#4E1220 100%)}
.pillar::before{content:"";position:absolute;inset:0 6px;border-left:1.5px solid rgba(231,207,149,.75);border-right:1.5px solid rgba(231,207,149,.75);
  background:repeating-linear-gradient(180deg,transparent 0 22px,rgba(231,207,149,.55) 22px 24px,transparent 24px 46px)}
.pillar.l{left:0}.pillar.r{right:0}
.garland{position:absolute;top:58px;width:22px;height:62%}
.garland.l{left:24px}.garland.r{right:24px}
.garland svg{width:100%;height:100%}
.hero-content{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;
  padding:118px 56px 0;text-align:center}
.ganesh{width:62px;height:70px;margin:0 auto 4px}
.blessing{font-family:var(--deva);color:var(--burgundy);font-size:17px;margin:0;letter-spacing:.02em}
.shubh{font-family:var(--deva);color:var(--gold-deep);font-size:22px;margin:4px 0 10px}
.mono{width:92px;height:92px;margin:0 auto 6px}
.names{font-family:var(--script);color:var(--burgundy);font-size:50px;line-height:1.05;margin:4px 0 0}
.names .amp{display:block;font-size:30px;color:var(--gold-deep);margin:2px 0}
.place{font-size:13px;letter-spacing:.32em;text-transform:uppercase;color:var(--ink-soft);margin:14px 0 0;font-weight:600}
.scroll-cue{position:absolute;bottom:22px;left:50%;transform:translateX(-50%);z-index:4;display:flex;flex-direction:column;align-items:center;gap:4px;
  font-size:12px;letter-spacing:.25em;text-transform:uppercase;color:#fff;text-decoration:none;font-weight:600;
  background:rgba(78,18,32,.55);padding:8px 16px 6px;border-radius:999px;backdrop-filter:blur(3px)}
.scroll-cue svg{width:14px;height:14px;animation:bob 2s ease-in-out infinite}
@keyframes bob{50%{transform:translateY(4px)}}

/* doors */
.doors{position:absolute;inset:0;z-index:2;perspective:1400px;display:flex;cursor:pointer}
.door{position:relative;width:50%;height:100%;transition:transform 2.3s cubic-bezier(.6,.02,.2,1),filter 2.3s;will-change:transform;backface-visibility:hidden}
.door.l{transform-origin:0 50%}
.door.r{transform-origin:100% 50%}
.door svg{width:100%;height:100%}
.doors.open .door.l{transform:rotateY(-108deg);filter:brightness(.65)}
.doors.open .door.r{transform:rotateY(108deg);filter:brightness(.65)}
.doors.gone{display:none}
.door-arch{position:absolute;top:0;left:0;right:0;z-index:6;pointer-events:none;transition:opacity 1.4s 1s}
.doors.open + .door-arch{opacity:0}
.door-garland{position:absolute;top:0;width:24px;height:78%;z-index:7;pointer-events:none;transition:opacity 1.2s .8s}
.door-garland.l{left:6px}.door-garland.r{right:6px}
.doors.open ~ .door-garland{opacity:0}
.door-seal{position:absolute;left:50%;top:44%;width:96px;height:96px;transform:translate(-50%,-50%);z-index:8;pointer-events:none;transition:opacity .6s}
.doors.open ~ .door-seal{opacity:0}
.door-blessing{position:absolute;left:0;right:0;top:76px;z-index:8;text-align:center;font-family:var(--deva);color:var(--gold-light);font-size:16px;pointer-events:none;text-shadow:0 1px 2px rgba(0,0,0,.5);transition:opacity .6s}
.doors.open ~ .door-blessing{opacity:0}
.door-tap{position:absolute;left:50%;bottom:calc(46px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:9;border:1px solid var(--gold-light);color:var(--ivory);
  background:rgba(78,18,32,.72);padding:10px 22px;border-radius:999px;font-size:13px;letter-spacing:.22em;text-transform:uppercase;font-weight:600;cursor:pointer;
  box-shadow:0 0 0 4px rgba(198,161,91,.18);animation:glow 2.4s ease-in-out infinite;white-space:nowrap}
@keyframes glow{50%{box-shadow:0 0 0 8px rgba(198,161,91,.06)}}
.doors.open ~ .door-tap{opacity:0;pointer-events:none;transition:opacity .4s}

/* ============ INVITATION ============ */
.invite{padding:56px 0 64px;background:linear-gradient(180deg,#EBD9BF 0,var(--ivory) 90px)}
.jharokha-bg{position:absolute;inset:0;opacity:.5;pointer-events:none}
.card-arch{position:relative;margin:0 auto;max-width:340px;background:var(--ivory-2);border-radius:170px 170px 16px 16px;padding:64px 26px 40px;text-align:center;
  box-shadow:0 1px 0 rgba(255,255,255,.8) inset,0 18px 40px rgba(116,31,50,.14);border:1.5px solid var(--gold)}
.card-arch::before{content:"";position:absolute;inset:7px;border-radius:163px 163px 11px 11px;border:1px solid rgba(198,161,91,.6);pointer-events:none}
.card-arch .kalash{width:56px;height:62px;margin:0 auto 8px}
.card-arch .together{font-style:italic;font-size:19px;color:var(--ink);margin:0 0 14px}
.parents{font-size:17.5px;font-weight:600;color:var(--burgundy-deep);margin:0;line-height:1.45}
.and{font-family:var(--script);color:var(--gold-deep);font-size:26px;margin:6px 0;line-height:1}
.invite-line{font-size:17px;margin:18px 0 8px;color:var(--ink)}
.couple-name{font-family:var(--script);color:var(--burgundy);font-size:40px;line-height:1.1;margin:0}
.couple-name small{display:block;font-family:var(--serif);font-size:13px;letter-spacing:.24em;text-transform:uppercase;color:var(--gold-deep);font-weight:600;margin-top:2px}
.card-arch .note{font-size:16.5px;color:var(--ink-soft);font-style:italic;margin:18px 0 0}
.corner{position:absolute;width:64px;height:64px;pointer-events:none}
.corner.bl{left:-6px;bottom:-6px}.corner.br{right:-6px;bottom:-6px;transform:scaleX(-1)}

/* ============ SAVE THE DATE ============ */
.date{padding:56px 0 60px;background:var(--ivory)}
.scratch{position:relative;width:300px;max-width:100%;aspect-ratio:300/230;margin:22px auto 0;border-radius:18px;overflow:hidden;
  box-shadow:0 14px 34px rgba(116,31,50,.18);background:var(--ivory-2);border:1px solid var(--gold)}
.scratch-under{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:16px;
  background:radial-gradient(circle at 50% 40%,#FFF9F0,#F5E6D0)}
.scratch-under .wd{font-size:13px;letter-spacing:.3em;text-transform:uppercase;color:var(--gold-deep);font-weight:700}
.scratch-under .dd{font-family:var(--script);font-size:46px;color:var(--burgundy);line-height:1.05;margin:2px 0}
.scratch-under .yy{font-size:24px;letter-spacing:.3em;color:var(--burgundy-deep);font-weight:600}
.scratch-under .kt{font-size:13px;color:var(--ink-soft);margin-top:6px;letter-spacing:.06em}
.scratch canvas{position:absolute;inset:0;width:100%;height:100%;touch-action:none;cursor:grab;transition:opacity .8s}
.scratch.done canvas{opacity:0;pointer-events:none}
.scratch-hint{font-size:14px;color:var(--ink-soft);font-style:italic;text-align:center;margin:12px 0 0}
.scratch-skip{display:block;margin:6px auto 0;background:none;border:0;color:var(--gold-deep);text-decoration:underline;font-size:14px;cursor:pointer;padding:6px}
.countdown{margin:26px auto 0;max-width:330px;display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid rgba(198,161,91,.6);border-bottom:1px solid rgba(198,161,91,.6)}
.countdown[hidden]{display:none}
.countdown div{text-align:center;padding:12px 0 10px}
.countdown div+div{border-left:1px solid rgba(198,161,91,.45)}
.countdown b{display:block;font-size:30px;font-weight:600;color:var(--burgundy);font-variant-numeric:tabular-nums;line-height:1.1}
.countdown span{font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--ink-soft)}
.until{font-family:var(--script);font-size:30px;color:var(--burgundy);text-align:center;margin:20px 0 0}
.cal-row{display:flex;justify-content:center;gap:10px;margin-top:16px;flex-wrap:wrap}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:10px 22px;border-radius:999px;border:1px solid var(--burgundy);
  background:var(--burgundy);color:var(--ivory);font-size:14px;letter-spacing:.16em;text-transform:uppercase;font-weight:600;text-decoration:none;cursor:pointer;
  box-shadow:0 6px 16px rgba(116,31,50,.22);transition:transform .2s,background .2s}
.btn:hover{background:var(--burgundy-deep)}
.btn:active{transform:translateY(1px)}
.btn.ghost{background:transparent;color:var(--burgundy);box-shadow:none}
.btn.gold{background:linear-gradient(180deg,#E3C67F,#C6A15B 60%,#A9843F);border-color:#A9843F;color:var(--burgundy-deep)}
.btn[aria-disabled="true"]{opacity:.55;cursor:not-allowed;box-shadow:none}
.btn svg{width:16px;height:16px}

/* ============ STORY ============ */
.story{padding:60px 0 70px;background:linear-gradient(180deg,var(--ivory),#F6E7DA 50%,var(--ivory))}
.globes{width:100%;max-width:330px;margin:16px auto 6px}
.chapter{position:relative;display:grid;grid-template-columns:52px 1fr;gap:14px;margin-top:26px}
.chapter .ic{width:52px;height:52px;border-radius:50%;background:var(--ivory-2);border:1px solid var(--gold);display:grid;place-items:center;box-shadow:0 4px 10px rgba(116,31,50,.1)}
.chapter .ic svg{width:30px;height:30px}
.chapter h3{font-family:var(--serif);font-size:21px;color:var(--burgundy);margin:2px 0 4px;font-weight:600}
.chapter p{margin:0;font-size:17px;color:var(--ink);min-width:0}
.chapters{position:relative;max-width:340px;margin:0 auto}
.chapters::before{content:"";position:absolute;left:25px;top:30px;bottom:30px;border-left:1px dashed var(--gold)}
.forever{font-family:var(--script);font-size:34px;color:var(--burgundy);text-align:center;margin:34px 0 0;line-height:1.2;text-wrap:balance}

/* ============ EVENTS ============ */
.events-head{padding:60px 0 6px;background:var(--ivory)}
.event{padding:30px 0 56px;background:var(--ivory)}
.event.alt{background:linear-gradient(180deg,var(--ivory),#F3E3D6 30%,#F3E3D6 70%,var(--ivory))}
.scene{position:relative;margin:0 auto;max-width:340px;border-radius:170px 170px 14px 14px;overflow:hidden;border:2px solid var(--gold);
  box-shadow:0 0 0 5px var(--ivory-2),0 0 0 6px rgba(198,161,91,.55),0 22px 40px rgba(116,31,50,.2);aspect-ratio:340/420;background:#F1E2CC}
.scene svg,.scene img{width:100%;height:100%;object-fit:cover;display:block}
.ev-body{text-align:center;max-width:330px;margin:22px auto 0}
.ev-num{font-size:12px;letter-spacing:.3em;text-transform:uppercase;color:var(--gold-deep);font-weight:700}
.ev-body .h-deva{font-size:26px;margin-top:2px}
.ev-body h3{font-family:var(--script);font-weight:400;font-size:38px;color:var(--burgundy);margin:0;line-height:1.2}
.facts{list-style:none;padding:0;margin:16px auto 0;display:grid;gap:10px;text-align:left;max-width:300px}
.facts li{display:grid;grid-template-columns:22px 1fr;gap:10px;align-items:start;font-size:17px;line-height:1.4}
.facts svg{width:20px;height:20px;margin-top:2px;color:var(--gold-deep)}
.facts b{display:block;font-size:11.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-deep);font-weight:700}
.ev-body .words{font-style:italic;color:var(--ink-soft);font-size:17px;margin:18px 0 0}
.ev-body .tip{font-size:15.5px;margin:12px auto 0;color:var(--ink);background:rgba(233,201,197,.45);border:1px solid rgba(184,110,89,.3);border-radius:12px;padding:10px 14px;max-width:310px}
.ev-actions{margin-top:18px;display:flex;justify-content:center;gap:10px;flex-wrap:wrap}
.placeholder{display:inline-block;border:1px dashed var(--terracotta);color:var(--terracotta);border-radius:8px;padding:2px 8px;font-size:14px;font-style:normal;background:rgba(184,110,89,.06)}

/* ============ INFO ============ */
.info{padding:60px 0 56px;background:var(--ivory)}
.info.tint{background:#F4E6DA}
.prose{max-width:340px;margin:16px auto 0}
.prose p{margin:0 0 12px;font-size:17.5px}
.hotels{display:grid;gap:14px;max-width:340px;margin:22px auto 0}
.hotel{background:var(--ivory-2);border:1px solid rgba(198,161,91,.55);border-radius:14px;padding:16px 18px;position:relative}
.hotel h3{margin:0;font-size:20px;color:var(--burgundy);font-weight:600;line-height:1.25}
.hotel .area{font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-deep);font-weight:700;margin:4px 0 6px}
.hotel p{margin:0 0 10px;font-size:16px;color:var(--ink-soft)}
.hotel .links{display:flex;gap:16px;flex-wrap:wrap}
.hotel .links a{font-size:14px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;text-decoration:none;border-bottom:1px solid var(--gold);padding:4px 0}
.small-note{font-size:14.5px;color:var(--ink-soft);font-style:italic;text-align:center;max-width:320px;margin:16px auto 0}
.travel-list{display:grid;gap:12px;max-width:340px;margin:20px auto 0}
.travel-item{display:grid;grid-template-columns:40px 1fr;gap:12px;align-items:start;background:var(--ivory-2);border-radius:14px;padding:14px 16px;border:1px solid rgba(198,161,91,.4)}
.travel-item svg{width:34px;height:34px}
.travel-item h3{margin:0 0 2px;font-size:18.5px;color:var(--burgundy);font-weight:600}
.travel-item p{margin:0;font-size:16px;min-width:0}

/* FAQ */
.faq{max-width:340px;margin:20px auto 0}
.faq details{border-bottom:1px solid rgba(198,161,91,.55)}
.faq summary{list-style:none;cursor:pointer;padding:14px 30px 14px 0;font-size:18.5px;font-weight:600;color:var(--burgundy-deep);position:relative;line-height:1.35}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";position:absolute;right:6px;top:50%;width:9px;height:9px;border-right:1.5px solid var(--gold-deep);border-bottom:1.5px solid var(--gold-deep);transform:translateY(-70%) rotate(45deg);transition:transform .3s}
.faq details[open] summary::after{transform:translateY(-30%) rotate(-135deg)}
.faq details p{margin:0 0 14px;font-size:17px;color:var(--ink)}

/* ============ RSVP ============ */
.rsvp{padding:60px 0 64px;background:var(--burgundy);color:var(--ivory);
  background-image:radial-gradient(circle at 50% -10%,#8E2A3D,transparent 60%),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='44' height='44'%3E%3Cg fill='none' stroke='%23C6A15B' stroke-opacity='.18'%3E%3Cpath d='M22 6c4 6 4 10 0 16c-4-6-4-10 0-16zM22 38c4-6 4-10 0-16c-4 6-4 10 0 16zM6 22c6-4 10-4 16 0c-6 4-10 4-16 0zM38 22c-6-4-10-4-16 0c6 4 10 4 16 0z'/%3E%3C/g%3E%3C/svg%3E")}
.rsvp .eyebrow{color:var(--gold-light)}
.rsvp .h-script{color:var(--ivory)}
.rsvp .lead{color:#F0DCCF}
.form-card{background:var(--ivory-2);color:var(--ink);border-radius:18px;padding:22px 20px;max-width:340px;margin:22px auto 0;box-shadow:0 18px 40px rgba(0,0,0,.25);border:1px solid var(--gold)}
.field{display:grid;gap:6px;margin-bottom:16px}
.field label,.field legend{font-size:12.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-deep);font-weight:700;padding:0}
.field input[type=text],.field input[type=tel],.field input[type=number],.field textarea,.field select{width:100%;border:1px solid rgba(143,106,46,.45);background:#fff;border-radius:10px;padding:11px 12px;font-size:17px;min-height:46px}
.field textarea{min-height:120px;resize:vertical;line-height:1.45}
.field input:focus,.field textarea:focus,.field select:focus{outline:2px solid var(--gold);border-color:var(--gold)}
fieldset.field{border:0;margin:0 0 16px;padding:0;min-width:0}
.ev-choice{border:1px solid rgba(143,106,46,.35);border-radius:12px;padding:10px 12px;margin-top:8px;background:#fff}
.ev-choice .t{font-weight:600;color:var(--burgundy);font-size:17px;line-height:1.3}
.ev-choice .s{font-size:14px;color:var(--ink-soft)}
.seg{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:8px}
.seg label{display:flex;align-items:center;justify-content:center;gap:6px;min-height:42px;border:1px solid rgba(143,106,46,.45);border-radius:999px;cursor:pointer;font-size:15.5px;letter-spacing:0;text-transform:none;color:var(--ink);font-weight:600}
.seg input{position:absolute;opacity:0;pointer-events:none}
.seg input:checked + span{color:var(--ivory)}
.seg label:has(input:checked){background:var(--burgundy);border-color:var(--burgundy);color:var(--ivory)}
.seg label:has(input:focus-visible){outline:2px solid var(--gold-deep);outline-offset:2px}
.hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.counter{font-size:13px;color:var(--ink-soft);text-align:right}
.status{min-height:24px;margin:10px 0 0;font-size:16px;text-align:center}
.status.ok{color:#2f6b3a;font-weight:600}
.status.err{color:#a3262f}
.status.big{font-family:var(--script);font-size:32px;color:var(--burgundy);font-weight:400}
.form-card .btn{width:100%}

/* ============ FINALE ============ */
.finale{padding:64px 0 40px;background:var(--ivory);text-align:center}
.finale .floral-top{width:100%;max-width:360px;margin:0 auto -6px}
.families{display:grid;grid-template-columns:1fr 1fr;gap:12px;max-width:340px;margin:24px auto 0}
.families div{min-width:0}
.families h3{font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-deep);margin:0 0 6px;font-weight:700}
.families p{margin:0;font-size:16.5px;font-weight:600;color:var(--burgundy-deep);line-height:1.4}
.finale .sign{font-family:var(--script);font-size:48px;color:var(--burgundy);margin:28px 0 0;line-height:1.1}
.finale .tag{font-size:14px;letter-spacing:.28em;text-transform:uppercase;color:var(--gold-deep);font-weight:700;margin:6px 0 0}
.blessing-card{margin:34px auto 0;text-align:left}
.blessing-card h3{font-family:var(--script);font-weight:400;font-size:36px;color:var(--burgundy);text-align:center;margin:0 0 4px;line-height:1.2}
.blessing-card .sub{text-align:center;font-size:16px;color:var(--ink-soft);margin:0 0 16px;font-style:italic}
.share-row{display:flex;justify-content:center;gap:10px;margin-top:30px;flex-wrap:wrap}
.foot{padding:26px var(--gutter) calc(30px + env(safe-area-inset-bottom,0px));font-size:13px;color:var(--ink-soft);text-align:center;background:var(--ivory)}
.foot svg{width:120px;margin:0 auto 10px}

/* ============ FIXED LAYERS ============ */
#petals{position:fixed;top:0;left:50%;transform:translateX(-50%);width:var(--w);height:100%;pointer-events:none;z-index:40}
.lotus{position:fixed;left:calc(50% + var(--w)/2 - 27px);top:0;width:24px;height:24px;z-index:41;pointer-events:none;opacity:0;transition:opacity .8s;will-change:transform}
.lotus.on{opacity:.9}
.lotus svg{width:100%;height:100%;animation:float 4.5s ease-in-out infinite}
@keyframes float{50%{transform:translateY(-5px) rotate(4deg)}}

/* toast */
.toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom,0px));transform:translate(-50%,20px);background:var(--burgundy-deep);color:var(--ivory);padding:10px 18px;border-radius:999px;font-size:15px;opacity:0;transition:.3s;z-index:60;pointer-events:none;max-width:calc(var(--w) - 40px);text-align:center}
.toast.show{opacity:1;transform:translate(-50%,0)}

@media (min-width:480px){ body{padding:24px 0} .phone{border-radius:28px} }
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .rv{opacity:1;transform:none}
}

/* photo gallery */
.gallery{display:grid;grid-template-columns:1fr 1fr;gap:18px 14px;max-width:340px;margin:18px auto 0}
.polaroid{margin:0;background:#fff;padding:7px 7px 0;box-shadow:0 10px 22px rgba(73,52,46,.18);border-radius:3px;transform:rotate(var(--r,0deg));min-width:0}
.polaroid:nth-child(4n+1){--r:-2.5deg}.polaroid:nth-child(4n+2){--r:2deg;margin-top:18px}.polaroid:nth-child(4n+3){--r:1.5deg}.polaroid:nth-child(4n){--r:-2deg;margin-top:18px}
.polaroid.rv{transform:translateY(14px) rotate(var(--r,0deg))}.polaroid.rv.in{transform:rotate(var(--r,0deg))}
.polaroid img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;display:block}
.polaroid figcaption{font-family:var(--script);color:var(--burgundy);font-size:21px;text-align:center;padding:4px 2px 8px;line-height:1.2}

/* ================= v2 palace entrance + invitation page ================= */
.palace{position:relative;overflow:hidden;background:radial-gradient(120% 70% at 50% 36%,#FFFAF0 0,#F8EEDD 55%,#EEDDC2 100%)}
.hero{z-index:0}
.hero-sky{z-index:0}
.hero-sky.soft{opacity:.75;height:34%}
.hero-content{z-index:1;padding:136px 64px 0}
.glow{position:absolute;inset:0;z-index:2;pointer-events:none;opacity:0;background:radial-gradient(60% 50% at 50% 48%,#FFF7DC 0,rgba(255,236,190,.85) 35%,rgba(255,220,150,0) 75%)}
.hero.opened .glow{animation:flash 2.8s ease-out forwards}
@keyframes flash{0%{opacity:0}30%{opacity:1}100%{opacity:0}}
.doors{z-index:3;perspective:1300px}
.door{transition:transform 2.6s cubic-bezier(.55,.02,.2,1),filter 2.6s}
.doors.open .door.l{transform:rotateY(-100deg);filter:brightness(.8)}
.doors.open .door.r{transform:rotateY(100deg);filter:brightness(.8)}
.door-deco{position:absolute;inset:0;z-index:4;pointer-events:none;transition:opacity 1.2s .6s}
.hero.opened .door-deco{opacity:0}
.door-deco .leaves{position:absolute;bottom:-6px;width:104px;height:174px}
.door-deco .leaves.l{left:-14px}.door-deco .leaves.r{right:-14px;transform:scaleX(-1)}
.door-deco .lamp{position:absolute;bottom:4px;width:52px;height:150px}
.door-deco .lamp.l{left:20px}.door-deco .lamp.r{right:20px}
.flame{transform-origin:35px 28px;animation:flick 1.3s ease-in-out infinite alternate}
.halo{animation:halo 1.9s ease-in-out infinite alternate}
@keyframes flick{0%{transform:scale(1,1)}50%{transform:scale(.92,1.08) skewX(2deg)}100%{transform:scale(1.04,.95) skewX(-2deg)}}
@keyframes halo{to{opacity:.6}}

.frame{position:absolute;inset:0;z-index:5;pointer-events:none}
.frame .arch{position:absolute;top:0;left:0;width:100%}
.frame .drape{position:absolute;top:0;bottom:0;width:56px;transition:opacity 1.4s .9s}
.frame .drape.l{left:0}.frame .drape.r{right:0}
.frame .drape svg{width:100%;height:100%}
.hero .frame .drape{opacity:0}
.hero.opened .frame .drape{opacity:1}
.frame .strand{position:absolute;top:64px;width:24px;height:66%}
.frame .strand svg{width:100%;height:100%}
.frame .strand.l{left:34px}.frame .strand.r{right:34px}
.hero:not(.opened) .frame .strand.l{left:4px}.hero:not(.opened) .frame .strand.r{right:4px}
.frame .strand{transition:left 1.4s .9s,right 1.4s .9s}

.plaque{position:absolute;z-index:6;left:50%;top:31%;transform:translate(-50%,-50%);width:250px;padding:18px 16px 16px;text-align:center;pointer-events:none;
  background:radial-gradient(120% 120% at 50% 0,#8E2A3D,#5E1526);border-radius:18px;border:2px solid #C6A15B;
  box-shadow:0 0 0 4px rgba(94,21,38,.85),0 0 0 5px #C6A15B,0 18px 40px rgba(0,0,0,.45);transition:opacity .7s,transform .9s}
.plaque::before{content:"";position:absolute;inset:6px;border:1px dashed rgba(231,207,149,.55);border-radius:12px}
.pl-bless{margin:0;font-family:var(--deva);color:var(--gold-light);font-size:15px}
.pl-names{margin:2px 0 0;font-family:var(--script);color:#FBEFD6;font-size:40px;line-height:1.15;text-shadow:0 2px 6px rgba(0,0,0,.35)}
.pl-names span{color:var(--gold-light);font-size:28px}
.pl-sub{margin:4px 0 0;font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-light);font-weight:600}
.hero.opened .plaque{opacity:0;transform:translate(-50%,-50%) scale(.92)}
.door-tap{z-index:7;bottom:calc(30px + env(safe-area-inset-bottom,0px));background:rgba(70,16,10,.75);border-color:#E7CF95}
.hero.opened .door-tap{opacity:0;pointer-events:none;transition:opacity .4s}
.scroll-cue{z-index:7}

/* second page */
.invite.palace{padding:0;min-height:max(100svh,760px)}
.invite-content{position:relative;z-index:6;padding:132px 62px 230px;text-align:center}
.ganesh.sm{width:50px;height:56px;margin:0 auto}
.getting{font-style:italic;font-size:22px;color:var(--burgundy);margin:4px 0 12px}
.veil{background:radial-gradient(closest-side,rgba(255,252,244,.92),rgba(255,252,244,.55) 80%,rgba(255,252,244,0));padding:14px 4px 10px;border-radius:40%}
.invite .together{font-style:italic;font-size:18px;color:var(--ink);margin:0 0 12px}
.invite .parents{font-size:17px;font-weight:600;color:var(--burgundy-deep);margin:0;line-height:1.45}
.invite .and{font-family:var(--script);color:var(--gold-deep);font-size:26px;margin:4px 0;line-height:1}
.invite .invite-line{font-size:17px;margin:16px 0 6px;color:var(--ink);font-weight:600}
.invite .couple-name{font-family:var(--script);color:var(--burgundy);font-size:36px;white-space:nowrap;line-height:1.1;margin:0}
.invite .note{font-size:16.5px;color:var(--ink-soft);font-style:italic;margin:14px 0 0}
.begin{display:inline-flex;align-items:center;gap:6px;margin-top:20px;padding:10px 20px;border-radius:999px;border:1px solid var(--burgundy);color:var(--burgundy);text-decoration:none;
  font-size:13px;letter-spacing:.22em;text-transform:uppercase;font-weight:700;background:rgba(255,250,240,.8)}
.begin svg{width:14px;height:14px;animation:bob 2s ease-in-out infinite}

/* polaroids without captions */
.polaroid{padding:7px 7px 24px}

/* ================= v3 polish: one palace language from top to bottom ================= */
.toran{position:absolute;top:0;left:0;right:0;height:46px;pointer-events:none;z-index:1}
.toran svg{width:100%;height:100%}
.date,.story,.events-head,.info,.rsvp{padding-top:84px}
.date{overflow:hidden}
.rsvp .toran{filter:saturate(1.05)}
.h-script + [data-art="divider"] .divider{margin:6px auto 14px}

/* save the date: carved mandala behind the foil card */
.scratch-stage{position:relative;margin-top:8px}
.mandala{position:absolute;left:50%;top:50%;width:440px;height:440px;transform:translate(-50%,-50%);opacity:.32;pointer-events:none;z-index:0}
.mandala svg{width:100%;height:100%;animation:spin 160s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.scratch{z-index:1;margin-top:30px;margin-bottom:30px}

/* event photos: arch with kalash finial and hanging garlands, details on an overlapping card */
.scene-wrap{position:relative;max-width:340px;margin:30px auto 0}
.scene-wrap .scene{margin:0}
.finial{position:absolute;left:50%;top:-30px;width:70px;height:52px;transform:translateX(-50%);z-index:3}
.sstrand{position:absolute;top:44px;width:20px;height:52%;z-index:3}
.sstrand svg{width:100%;height:100%}
.sstrand.l{left:-12px}.sstrand.r{right:-12px}
.event .ev-body{position:relative;z-index:2;margin:-38px auto 0;max-width:316px;background:var(--ivory-2);border:1px solid var(--gold);border-radius:18px;padding:24px 18px 24px;
  box-shadow:0 16px 34px rgba(116,31,50,.16)}
.event .ev-body::before{content:"";position:absolute;inset:5px;border:1px solid rgba(198,161,91,.45);border-radius:14px;pointer-events:none}
.event .facts{max-width:270px}
.event .ev-actions .btn{position:relative}

/* final page: the same palace frame as the opening, closing the story */
.finale.palace{padding:0;min-height:max(100svh,800px);text-align:center;background:radial-gradient(120% 70% at 50% 36%,#FFFAF0 0,#F8EEDD 55%,#EEDDC2 100%)}
.finale-content{position:relative;z-index:6;padding:136px 62px 250px}
.finale-content .kalash{width:50px;height:56px;margin:0 auto 4px}
.finale-content .h-script{font-size:40px}
.fin-lead{font-size:17px;color:var(--ink-soft);font-style:italic;margin:6px 0 0;text-wrap:pretty}
.finale-content .families{grid-template-columns:1fr;gap:14px;margin:22px auto 0}
.finale-content .sign{font-size:44px;margin-top:6px}
.blessings{padding:84px 0 0;background:var(--ivory)}
.blessings .blessing-card{margin-top:0}
.lotus-top{width:64px;height:42px;margin:0 auto 2px}

/* heart scratch card */
.scratch{width:300px;max-width:100%;aspect-ratio:300/270;border:0;border-radius:0;box-shadow:none;background:transparent;overflow:visible;
  filter:drop-shadow(0 14px 22px rgba(116,31,50,.28))}
.scratch-under,.scratch canvas{-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 270'%3E%3Cpath d='M150,258 C150,258 10,170 10,88 C10,40 46,10 88,10 C116,10 138,26 150,48 C162,26 184,10 212,10 C254,10 290,40 290,88 C290,170 150,258 150,258Z'/%3E%3C/svg%3E") center/100% 100% no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 270'%3E%3Cpath d='M150,258 C150,258 10,170 10,88 C10,40 46,10 88,10 C116,10 138,26 150,48 C162,26 184,10 212,10 C254,10 290,40 290,88 C290,170 150,258 150,258Z'/%3E%3C/svg%3E") center/100% 100% no-repeat}
.scratch-under{background:radial-gradient(circle at 50% 38%,#FFFBF3,#F6E5CF);padding:0 50px 40px}
.scratch-under .dd{font-size:40px}
.scratch-under .yy{font-size:22px}
.heart-rim{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:2}

/* ================= v4: finished door scene + first page ================= */
/* door scene */
.vignette{position:absolute;inset:0;background:radial-gradient(85% 70% at 50% 45%,rgba(255,200,120,.16) 0,rgba(0,0,0,0) 45%,rgba(30,6,2,.55) 100%)}
.rangoli{position:absolute;left:50%;bottom:-118px;width:250px;height:250px;transform:translateX(-50%)}
.door-deco .leaves{width:118px;height:196px;bottom:-8px}
.door-deco .lamp{width:56px;height:162px;bottom:10px}
.door-deco .lamp.l{left:30px}.door-deco .lamp.r{right:30px}
.plaque{top:29%;width:262px;padding:30px 26px 22px;background:none;border:0;box-shadow:none;filter:drop-shadow(0 16px 24px rgba(20,4,0,.55))}
.plaque::before{display:none}
.pl-bg{position:absolute;inset:0;z-index:-1}
.pl-bg svg{width:100%;height:100%}
.plaque > p,.pl-flourish{position:relative}
.pl-bless{font-size:15px;color:#E7CF95}
.pl-names{font-size:42px;margin:4px 0 0;color:#FBEFD6}
.pl-flourish{width:170px;height:20px;margin:2px auto 0}
.pl-flourish svg{width:100%;height:100%}
.pl-sub{font-size:12.5px;letter-spacing:.32em;margin-top:6px}
.door-tap{font-size:12.5px;letter-spacing:.28em;padding:11px 26px;background:linear-gradient(180deg,#E9CD86,#C6A15B 55%,#9E7A38);color:#4E1220;border:1px solid #F4E2A8;
  box-shadow:0 8px 20px rgba(0,0,0,.4),0 0 0 4px rgba(231,207,149,.18);font-weight:700}

/* first page */
.blossom{position:absolute;bottom:96px;width:118px;height:190px;z-index:1;pointer-events:none}
.blossom.l{left:26px}.blossom.r{right:26px;transform:scaleX(-1)}
.blossom svg{width:100%;height:100%}
@media (max-height:760px){.blossom{display:none}}
.hero-content{padding-top:128px}
.ganesh-wrap{position:relative;width:96px;height:84px;margin:0 auto;display:grid;place-items:center}
.ganesh-wrap::before{content:"";position:absolute;inset:-14px;border-radius:50%;background:radial-gradient(circle,rgba(255,226,160,.75),rgba(255,226,160,0) 68%)}
.ganesh-wrap .ganesh{position:relative;width:70px;height:78px;margin:0}
.hero .blessing{font-size:16px;margin-top:2px}
.hero .shubh{display:flex;align-items:center;justify-content:center;gap:10px;font-size:23px;color:var(--gold-deep);margin:2px 0 8px}
.shubh .tick{display:block;width:34px;height:1px;background:linear-gradient(90deg,transparent,var(--gold))}
.shubh .tick:last-child{transform:scaleX(-1)}
.hero .mono{width:74px;height:74px;margin-bottom:4px}
.hero .names{font-size:54px;line-height:1;text-shadow:0 2px 0 rgba(255,255,255,.6)}
.hero .names .amp{font-size:28px;margin:4px 0}
.flourish{width:200px;height:24px;margin:6px auto 0}
.flourish svg{width:100%;height:100%}
.hero .place{margin-top:8px;letter-spacing:.36em}

/* door: just a gold seal on the seam, nothing that gives the surprise away */
.door-seal{position:absolute;left:50%;top:34%;width:84px;height:84px;transform:translate(-50%,-50%);z-index:6;pointer-events:none;
  filter:drop-shadow(0 6px 12px rgba(20,4,0,.5));transition:opacity .5s,transform .8s}
.door-seal svg{width:100%;height:100%}
.hero.opened .door-seal{opacity:0;transform:translate(-50%,-50%) scale(.85)}

/* ================= v5: content never collides with the skyline ================= */
.hero{height:auto;max-height:none;min-height:max(100svh,720px)}
.hero-content{position:relative;inset:auto;padding-bottom:190px}
.hero-sky{height:300px}
.hero-sky.soft{height:260px}
.door-wall{display:none}

/* ================= laptop & desktop: full-width palace, multi-column content ================= */
@media (min-width:900px){
  :root{--w:100vw}
  body{padding:0;font-size:19px}
  .phone{width:100%;border-radius:0;box-shadow:none}
  .h-script{font-size:56px}
  .eyebrow{font-size:13.5px}

  /* doors become a portal set in a carved palace wall */
  .door-wall{display:block;position:absolute;inset:0;z-index:2;transition:opacity 1.4s .8s;
    background:radial-gradient(60% 70% at 50% 45%,rgba(255,190,120,.18),rgba(0,0,0,0) 60%),
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='52' height='52'%3E%3Cg fill='none' stroke='%23E7CF95' stroke-opacity='.28'%3E%3Cpath d='M26 4c6 9 6 15 0 22c-6-7-6-13 0-22zM26 48c6-9 6-15 0-22c-6 7-6 13 0 22zM4 26c9-6 15-6 22 0c-7 6-13 6-22 0zM48 26c-9-6-15-6-22 0c7 6 13 6 22 0z'/%3E%3Ccircle cx='26' cy='26' r='3'/%3E%3C/g%3E%3C/svg%3E"),
      linear-gradient(90deg,#3E0E18,#6A1A2C 30%,#7A2234 50%,#6A1A2C 70%,#3E0E18)}
  .door-wall::after{content:"";position:absolute;inset:0;background:radial-gradient(90% 80% at 50% 50%,rgba(0,0,0,0) 40%,rgba(20,4,8,.55))}
  .hero.opened .door-wall{opacity:0;pointer-events:none}
  .doors{left:50%;right:auto;width:min(640px,62vw);transform:translateX(-50%);box-shadow:0 0 0 10px #C6A15B,0 0 0 16px #5E1526,0 30px 80px rgba(0,0,0,.6)}
  .hero.opened .doors{box-shadow:none}
  .door-deco .lamp{width:72px;height:208px}
  .door-deco .lamp.l{left:calc(50% - min(320px,31vw) - 110px)}.door-deco .lamp.r{right:calc(50% - min(320px,31vw) - 110px)}
  .door-deco .leaves{width:170px;height:280px}
  .door-deco .leaves.l{left:calc(50% - min(320px,31vw) - 230px)}.door-deco .leaves.r{right:calc(50% - min(320px,31vw) - 230px)}
  .rangoli{width:340px;height:340px;bottom:-160px}
  .door-seal{width:104px;height:104px}

  .frame .drape{width:88px}
  .frame .strand{width:28px}
  .frame .strand.l{left:74px}.frame .strand.r{right:74px}
  .hero:not(.opened) .frame .strand.l{left:calc(50% - min(320px,31vw) - 44px)}
  .hero:not(.opened) .frame .strand.r{right:calc(50% - min(320px,31vw) - 44px)}
  .blossom{width:180px;height:290px;bottom:90px}
  .blossom.l{left:110px}.blossom.r{right:110px}
  .hero-sky{height:360px}
  .hero-content{padding:150px 120px 230px}
  .hero .names{font-size:84px}
  .hero .names .amp{display:inline;font-size:44px;margin:0 14px}
  .hero .mono{width:88px;height:88px}
  .flourish{width:280px;height:30px}
  .scroll-cue{bottom:28px}

  /* second page and final page: centred column inside the full-width frame */
  .invite-content,.finale-content{max-width:680px;margin:0 auto;padding:170px 40px 290px}
  .invite .couple-name{font-size:52px}
  .finale-content .families{grid-template-columns:1fr 1fr}

  /* content sections */
  .wrap{max-width:1120px;margin:0 auto;padding-left:56px;padding-right:56px}
  .date,.story,.events-head,.info,.rsvp{padding-top:110px;padding-bottom:90px}
  .mandala{width:620px;height:620px}
  .scratch{width:360px}
  .countdown{max-width:460px}
  .countdown b{font-size:38px}
  .globes{max-width:460px}
  .chapters{max-width:680px}
  .gallery{grid-template-columns:repeat(3,1fr);max-width:900px;gap:34px 28px}
  .polaroid:nth-child(4n+2),.polaroid:nth-child(4n){margin-top:0}
  .polaroid:nth-child(3n+2){margin-top:26px}
  .event{padding:60px 0 80px}
  .event .wrap{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center;max-width:1040px}
  .event.alt .scene-wrap{order:2}
  .scene-wrap{max-width:420px;width:100%;margin:40px auto}
  .event .ev-body{margin:0;max-width:460px;justify-self:center}
  .prose{max-width:680px}
  .hotels{grid-template-columns:1fr 1fr;max-width:900px;gap:20px}
  .travel-list{grid-template-columns:1fr 1fr;max-width:900px;gap:16px}
  .faq{max-width:760px}
  .form-card{max-width:580px;padding:30px 32px}
  .lead{max-width:640px;margin-left:auto;margin-right:auto}
  .foot{padding:36px 56px 44px}
}
.scene-wrap .scene{width:100%;max-width:none}
@media (min-width:900px){.invite .together,.invite .parents,.invite .invite-line{font-size:19px}.invite .note{font-size:18px}}
/* music toggle */
.music-btn{position:fixed;z-index:45;left:calc(50% - var(--w)/2 + 12px + env(safe-area-inset-left,0px));bottom:calc(16px + env(safe-area-inset-bottom,0px));width:44px;height:44px;border-radius:50%;
  border:1px solid var(--gold);background:rgba(94,21,38,.88);color:var(--gold-light);display:grid;place-items:center;cursor:pointer;box-shadow:0 6px 16px rgba(0,0,0,.3)}
.music-btn svg{width:20px;height:20px}
.music-btn .bars{display:none}
.music-btn.playing svg{display:none}
.music-btn.playing .bars{display:flex;gap:3px;align-items:flex-end;height:16px}
.music-btn .bars i{width:3px;background:var(--gold-light);border-radius:2px;animation:eq 1s ease-in-out infinite}
.music-btn .bars i:nth-child(2){animation-delay:.2s}.music-btn .bars i:nth-child(3){animation-delay:.4s}
@keyframes eq{0%,100%{height:4px}50%{height:16px}}

/* ================= v6: big-screen polish ================= */
.medal,.pilaster{display:none}
@media (min-width:900px){

  /* first page: content centred in the sky above the skyline, scaled to the screen */
  .hero{display:flex;flex-direction:column;min-height:100vh}
  .hero-content{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:150px 140px 320px}
  .hero .names{font-size:clamp(68px,6.6vw,124px)}
  .hero .names .amp{font-size:clamp(36px,3vw,56px)}
  .ganesh-wrap{width:clamp(96px,7vw,130px);height:clamp(84px,6.2vw,116px)}
  .ganesh-wrap .ganesh{width:clamp(70px,5.2vw,98px);height:clamp(78px,5.8vw,110px)}
  .hero .blessing{font-size:clamp(16px,1.25vw,21px)}
  .hero .shubh{font-size:clamp(23px,1.8vw,32px)}
  .shubh .tick{width:clamp(34px,4vw,70px)}
  .hero .mono{width:clamp(80px,6vw,112px);height:clamp(80px,6vw,112px)}
  .flourish{width:clamp(260px,24vw,420px);height:clamp(28px,2.4vw,42px)}
  .hero .place{font-size:clamp(13px,1vw,17px)}
  .hero-sky{height:clamp(320px,34vh,420px)}

  /* door screen: taller portal, carved pillars and gold medallions on the palace wall */
  .doors{top:96px;width:min(600px,56vw)}
  .medal{display:block;position:absolute;top:52%;width:min(360px,24vw);height:min(360px,24vw);opacity:.5;transform:translate(-50%,-50%)}
  .medal svg{width:100%;height:100%;animation:spin 200s linear infinite}
  .medal.l{left:calc((50% - min(300px,28vw)) / 2)}.medal.r{left:calc(100% - (50% - min(300px,28vw)) / 2)}
  .pilaster{display:block;position:absolute;top:120px;bottom:0;width:38px;
    background:repeating-linear-gradient(180deg,transparent 0 30px,rgba(94,21,38,.25) 30px 32px),linear-gradient(90deg,#9E7A38,#F1DCA3 30%,#E3C67F 55%,#B88A45 80%,#8F6A2E);
    box-shadow:0 0 0 2px #5E1526,0 10px 30px rgba(0,0,0,.5)}
  .pilaster::before{content:"";position:absolute;left:-10px;right:-10px;top:-18px;height:20px;border-radius:4px 4px 0 0;background:linear-gradient(180deg,#F1DCA3,#B88A45);box-shadow:0 0 0 2px #5E1526}
  .pilaster.l{left:calc(50% - min(300px,28vw) - 44px)}.pilaster.r{left:calc(50% + min(300px,28vw) + 6px)}
  .hero:not(.opened) .frame .strand.l{left:calc(50% - min(300px,28vw) - 86px)}
  .hero:not(.opened) .frame .strand.r{right:calc(50% - min(300px,28vw) - 86px)}
  .door-deco .lamp.l{left:calc(50% - min(300px,28vw) - 150px)}.door-deco .lamp.r{right:calc(50% - min(300px,28vw) - 150px)}
  .door-deco .leaves.l{left:calc(50% - min(300px,28vw) - 290px)}.door-deco .leaves.r{right:calc(50% - min(300px,28vw) - 290px)}
  .door-tap{font-size:14px;padding:13px 32px}

  /* second page: larger type in the wide frame */
  .invite-content{max-width:760px}
  .invite .couple-name{font-size:60px}
  .getting{font-size:26px}
  .ganesh.sm{width:64px;height:72px}
}
@media (min-width:900px) and (max-height:820px){
  .hero-content{padding:104px 140px 236px}
  .hero .mono{display:none}
  .hero .names{font-size:clamp(60px,min(6.6vw,11vh),124px)}
  .ganesh-wrap{width:84px;height:74px}.ganesh-wrap .ganesh{width:62px;height:70px}
  .flourish{margin-top:2px}
  .hero-sky{height:270px}
  .blossom{display:block;width:140px;height:220px;bottom:70px}
}

/* ================= v7: design pass ================= */
/* rhythm: alternate grounds so sections read as distinct pages */
.story{background:linear-gradient(180deg,#F6E7DA,#F3E1D3)}
.story{padding-top:72px}
#stay{padding-top:72px}
.info.tint{background:#F1E0D2}
#faq{padding-top:72px;background:var(--ivory-2)}
.events-head{padding-bottom:0}
.events-head + .event{padding-top:10px}
/* hairline section openers where the garland was removed */
#story::before,#stay::before,#faq::before{content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);width:min(560px,70%);height:1px;background:linear-gradient(90deg,transparent,var(--gold),transparent)}

/* type: a touch larger and darker for readability */
.lead,.prose p{color:var(--ink)}
.chapter p,.travel-item p,.hotel p{color:#5A443B}
.facts li{font-size:17.5px}
.field label,.field legend{font-size:12px;letter-spacing:.18em}

/* RSVP choice pills: equal, roomy, clear selected state */
.seg label{min-height:46px;font-size:15px;padding:0 8px;text-align:center;line-height:1.15;background:#fff;transition:background .2s,color .2s}
.seg label:hover{border-color:var(--burgundy)}
.form-card .btn{min-height:52px;font-size:14.5px}
.ev-choice{padding:12px 14px}

/* travel: five cards → last card spans full row so nothing sits alone */
.travel-list .travel-item:last-child:nth-child(odd){grid-column:1/-1}

/* floating RSVP shortcut */
.rsvp-fab{position:fixed;z-index:45;right:calc(50% - var(--w)/2 + 14px + env(safe-area-inset-right,0px));bottom:calc(16px + env(safe-area-inset-bottom,0px));
  height:44px;padding:0 20px;display:inline-flex;align-items:center;border-radius:999px;text-decoration:none;font-size:13px;letter-spacing:.24em;font-weight:700;
  background:linear-gradient(180deg,#E9CD86,#C6A15B 55%,#9E7A38);color:var(--burgundy-deep);border:1px solid #F4E2A8;box-shadow:0 8px 20px rgba(73,20,30,.3);animation:fabIn .4s ease}
@keyframes fabIn{from{opacity:0;transform:translateY(10px)}}
.lotus{display:none}

@media (min-width:900px){
  body{font-size:20px}
  .lead{font-size:20px}
  .prose p{font-size:19px}
  .chapter h3{font-size:24px}.chapter p{font-size:18.5px}
  .chapters{max-width:760px}.chapter{grid-template-columns:64px 1fr;gap:22px;margin-top:34px}
  .chapter .ic{width:64px;height:64px}.chapters::before{left:31px}
  .hotel h3{font-size:22px}.hotel p,.travel-item p{font-size:17.5px}
  .travel-item h3{font-size:20px}
  .faq summary{font-size:20px;padding:18px 34px 18px 0}.faq details p{font-size:18.5px}
  .facts li{font-size:19px}.event .ev-body .words{font-size:18.5px}
  .event .ev-body{max-width:480px;padding:32px 30px}
  .event .ev-body h3{font-size:46px}
  .invite .together,.invite .parents,.invite .invite-line{font-size:21px}
  .invite .note{font-size:19.5px}
  .fin-lead{font-size:20px}.finale-content .families p{font-size:19px}
  .finale-content .sign{font-size:60px}.finale-content .h-script{font-size:56px}
  .seg label{font-size:16px}
  .travel-list{grid-template-columns:1fr 1fr 1fr;max-width:1040px}
  .travel-list .travel-item:last-child:nth-child(odd){grid-column:auto}
  .travel-list .travel-item:nth-child(4){grid-column:1/2}
  .travel-list{grid-template-areas:none}
  .rsvp-fab{right:28px;bottom:28px;height:50px;padding:0 26px}
  .music-btn{left:28px;bottom:28px;width:50px;height:50px}
  .events-head{padding-bottom:10px}
}
/* 5 travel cards on desktop: 3 + 2 centred */
@media (min-width:900px){
  .travel-list{display:flex;flex-wrap:wrap;justify-content:center}
  .travel-list .travel-item{flex:0 1 calc((100% - 32px)/3)}
}
.field .seg label{letter-spacing:.02em;text-transform:none;font-size:15.5px;color:var(--ink);white-space:nowrap}
.field .seg label:has(input:checked){color:var(--ivory)}

/* ================= v8: invitation + countdown in the reference's serif style ================= */
.getting{font-family:var(--serif);font-style:italic;font-size:22px;color:var(--ink-soft);margin:6px 0 10px}
.bigname{font-family:var(--serif);font-weight:500;color:var(--burgundy);font-size:58px;line-height:1;margin:6px 0 4px;letter-spacing:.01em}
.lineage{font-family:var(--serif);font-style:italic;font-size:16px;color:var(--ink-soft);margin:0 auto;max-width:300px;line-height:1.4}
.with{font-family:var(--serif);font-style:italic;font-size:22px;color:var(--gold-deep);margin:14px 0 6px}
.invite .note{margin-top:22px;font-size:16.5px}
.kath{margin:16px 0 0;font-size:12.5px;letter-spacing:.32em;text-transform:uppercase;color:var(--gold-deep);font-weight:700}
.invite-content{padding-top:120px}

.until-eyebrow{margin-top:26px}
.until{font-family:var(--serif);font-weight:500;font-size:40px;color:var(--ink);margin:4px 0 0;line-height:1.15}
.countdown{border-top:1px solid rgba(143,106,46,.45);border-bottom:1px solid rgba(143,106,46,.45);margin-top:22px}
.countdown div{padding:18px 0 14px}
.countdown b{font-family:var(--serif);font-weight:500;font-size:40px;color:var(--burgundy)}
.countdown span{font-size:11px;letter-spacing:.28em;margin-top:4px;display:block}
@media (min-width:900px){
  .bigname{font-size:96px}
  .lineage{font-size:20px;max-width:520px}
  .with{font-size:28px}
  .getting{font-size:28px}
  .until{font-size:60px}
  .countdown{max-width:620px}.countdown b{font-size:58px}
}
/* names: bold, big, burgundy */
.bigname{font-weight:700;color:var(--burgundy);font-size:64px;text-shadow:0 1px 0 rgba(255,255,255,.7)}
@media (min-width:900px){.bigname{font-size:104px}}
.bigname{background:linear-gradient(180deg,#9E1B32 0%,#C2263B 45%,#7A1428 100%);-webkit-background-clip:text;background-clip:text;color:transparent;
  text-shadow:none;filter:drop-shadow(0 1px 0 rgba(231,207,149,.9)) drop-shadow(0 6px 12px rgba(116,31,50,.18))}
/* names: elegant high-contrast serif, a step above the rest of the page */
.bigname{font-family:"Playfair Display","Cormorant Garamond",Georgia,serif;font-weight:600;font-size:44px;letter-spacing:.02em;line-height:1.1;margin:8px 0 4px}
@media (min-width:900px){.bigname{font-size:62px}}
/* photos inside the love-story timeline */
.story-photo{margin:12px 0 0;background:#fff;padding:6px 6px 6px;border-radius:4px;box-shadow:0 10px 22px rgba(73,52,46,.16);transform:rotate(-1.2deg);max-width:300px}
.chapter:nth-child(even) .story-photo{transform:rotate(1.2deg)}
.story-photo img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;display:block;border-radius:2px}
@media (min-width:900px){.story-photo{max-width:380px}}
/* Save the Date heading swaps to "Until we say I do" once the heart is scratched */
.date-head{display:grid;text-align:center}
.date-head .dh{grid-area:1/1;transition:opacity .8s ease,transform .8s ease}
.date-head .after{opacity:0;transform:translateY(8px);align-self:center}
.date-head.revealed .before{opacity:0;transform:translateY(-8px);pointer-events:none}
.date-head.revealed .after{opacity:1;transform:none}
.date-head .until{margin-top:6px}
#afterReveal .countdown{margin-top:28px}
.polaroid.wide{grid-column:1/-1;--r:.8deg;margin-top:6px;justify-self:center;width:92%}
.polaroid.wide img{aspect-ratio:4/3}
@media (min-width:900px){.polaroid.wide{width:62%}}
@media (min-width:900px){
  .gallery{grid-template-columns:repeat(4,1fr);max-width:1040px;gap:30px 24px}
  .polaroid:nth-child(3n+2){margin-top:0}
  .polaroid:nth-child(even):not(.wide){margin-top:22px}
  .polaroid.wide{width:52%}
}