:root{
  --ink:#070806;
  --ink-2:#0e100c;
  --green-900:#06231a;
  --green-800:#0a3324;
  --green-700:#0f4a33;
  --green-500:#1f7a4f;
  --gold:#e9b92f;
  --gold-hi:#ffdc72;
  --gold-lo:#a87607;
  --cream:#f6e7bd;
  --muted:#b9ae8c;
  --radius:14px;
  --display:'Anton','Impact',sans-serif;
  --marker:'Permanent Marker','Marker Felt',cursive;
  --body:'Archivo',system-ui,-apple-system,'Segoe UI',sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--ink);color:var(--cream);font-family:var(--body);font-size:17px;line-height:1.55;
  background-image:
    radial-gradient(1200px 700px at 85% -10%,rgba(31,122,79,.45),transparent 60%),
    radial-gradient(900px 600px at -10% 30%,rgba(15,74,51,.5),transparent 60%),
    radial-gradient(900px 700px at 110% 75%,rgba(233,185,47,.10),transparent 60%);
  background-attachment:fixed;
  overflow-x:hidden;
}
img,video,svg{max-width:100%}
a{color:inherit}
.wrap{width:min(1120px,100% - 40px);margin-inline:auto}

/* film grain over everything */
.grain{
  position:fixed;inset:0;z-index:50;pointer-events:none;opacity:.07;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 .9 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
}

/* top bar */
.topbar{
  position:sticky;top:0;z-index:40;display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:10px max(16px,env(safe-area-inset-right)) 10px max(16px,env(safe-area-inset-left));
  background:linear-gradient(#070806f2,#070806c8);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  border-bottom:1px solid rgba(233,185,47,.22);
}
.brand{display:flex;align-items:center;gap:8px;text-decoration:none;color:var(--gold);font-family:var(--display);font-size:24px;letter-spacing:.04em}
.brand b{color:var(--cream);font-weight:400}
.mini-count{font-family:var(--display);letter-spacing:.08em;font-size:15px;color:var(--muted);text-transform:uppercase;white-space:nowrap}
.mini-count span{color:var(--cream)}

/* buttons */
.btn{
  --h:52px;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:var(--h);padding:0 26px;border-radius:999px;
  font-family:var(--display);font-size:19px;letter-spacing:.07em;text-transform:uppercase;text-decoration:none;cursor:pointer;
  border:2px solid transparent;transition:transform .15s ease,box-shadow .2s ease,background .2s ease,color .2s ease;
  -webkit-tap-highlight-color:transparent;
}
.btn:active{transform:translateY(1px) scale(.985)}
.btn-gold{
  color:#1a1200;background:linear-gradient(180deg,var(--gold-hi),var(--gold) 55%,#c98f12);
  box-shadow:0 0 0 1px #5b3d00 inset,0 8px 24px -6px rgba(233,185,47,.55),0 2px 0 #7a5200;
}
.btn-gold:hover{box-shadow:0 0 0 1px #5b3d00 inset,0 12px 34px -6px rgba(233,185,47,.8),0 2px 0 #7a5200;transform:translateY(-1px)}
.btn-ghost{color:var(--cream);background:rgba(246,231,189,.06);border-color:rgba(246,231,189,.38)}
.btn-ghost:hover{background:rgba(246,231,189,.14);border-color:var(--gold)}
.btn-sm{--h:38px;padding:0 20px;font-size:16px}
.btn-xl{--h:64px;width:100%;font-size:26px;margin-top:6px}
.btn:focus-visible,.chip input:focus-visible+span,input:focus-visible,textarea:focus-visible,.sound:focus-visible,.stepper button:focus-visible,.linkbtn:focus-visible{
  outline:3px solid var(--gold-hi);outline-offset:3px;
}

/* hero */
.hero{padding:28px 0 46px}
.hero-inner{width:min(1120px,100% - 40px);margin-inline:auto;display:grid;gap:34px;align-items:center}
.poster{position:relative;margin:0 0 30px;justify-self:center;width:min(100%,560px);transform:rotate(-1.2deg)}
.poster-frame{
  position:relative;border-radius:10px;overflow:hidden;background:#000;aspect-ratio:5/4;
  border:3px solid var(--gold);
  box-shadow:0 0 0 6px #0b0c09,0 0 0 8px rgba(233,185,47,.55),0 30px 70px -20px rgba(0,0,0,.9),0 0 90px -10px rgba(233,185,47,.28);
}
/* Hero crop: the 4:5 invitation video lives in a .stage scaled 1.5x and shifted so the frame shows
   x 30-96.7% / y 19-61.7% of the source (whole head, smoke, cigar hand). Raw video, no overlays. */
.stage{position:absolute;width:150%;aspect-ratio:4/5;left:-45%;top:-44.5%}
.stage video{position:absolute;inset:0;display:block;width:100%;height:100%;max-width:none}
.sound,.playbtn{z-index:3}
.sound{
  position:absolute;left:50%;bottom:-23px;transform:translateX(-50%);z-index:3;display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 14px;border-radius:999px;
  font:600 14px var(--body);letter-spacing:.04em;color:var(--cream);background:rgba(7,8,6,.72);border:1px solid rgba(246,231,189,.4);cursor:pointer;
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
}
.sound[aria-pressed="true"]{color:#1a1200;background:var(--gold);border-color:var(--gold)}
.playbtn{position:absolute;inset:0;margin:auto;width:84px;height:84px;border-radius:50%;border:2px solid var(--gold);background:rgba(7,8,6,.7);color:var(--gold);display:grid;place-items:center;cursor:pointer}
.playbtn[hidden]{display:none}
.tape{position:absolute;width:92px;height:28px;background:rgba(233,205,120,.78);box-shadow:0 2px 6px rgba(0,0,0,.45);z-index:2;top:-12px;mix-blend-mode:normal;
  background-image:repeating-linear-gradient(90deg,rgba(255,255,255,.18) 0 3px,transparent 3px 7px)}
.tape-l{left:-24px;transform:rotate(-38deg)}
.tape-r{right:-24px;transform:rotate(36deg)}

.kicker{margin:0 0 6px;font-family:var(--marker);font-size:clamp(16px,4.7vw,26px);color:var(--gold);letter-spacing:.01em;transform:rotate(-1.5deg);display:inline-block;white-space:nowrap}
.kicker i{font-style:normal;color:var(--cream);margin:0 .25em}
h1{
  margin:0;font-family:var(--display);font-weight:400;text-transform:uppercase;line-height:.92;letter-spacing:.01em;
  font-size:clamp(56px,15.5vw,124px);color:var(--cream);text-shadow:4px 4px 0 #000,0 0 40px rgba(0,0,0,.4);
}
h1 span{display:block;white-space:nowrap}
h1 em{
  display:block;font-style:normal;color:transparent;
  background:linear-gradient(180deg,#fff0a8 0%,var(--gold) 45%,var(--gold-lo) 100%);-webkit-background-clip:text;background-clip:text;
  text-shadow:none;filter:drop-shadow(4px 4px 0 #000);
}
.when{list-style:none;margin:26px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,auto);justify-content:start;gap:0;border:2px solid rgba(233,185,47,.55);border-radius:var(--radius);overflow:hidden;width:fit-content;max-width:100%;background:rgba(6,35,26,.7)}
.when li{padding:12px 18px;border-right:1px solid rgba(233,185,47,.35)}
.when li:last-child{border-right:0}
.when small{display:block;font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.when strong{display:block;font-family:var(--display);font-weight:400;font-size:clamp(20px,5.2vw,28px);letter-spacing:.04em;color:var(--gold-hi);text-transform:uppercase;white-space:nowrap}
.lede{max-width:34ch;margin:22px 0 0;font-size:clamp(18px,4.4vw,21px);color:#eadcae}
.cta-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
.going{display:flex;align-items:center;gap:10px;margin:20px 0 0;font-weight:600;color:var(--cream);font-size:15px;letter-spacing:.03em}
.going[hidden]{display:none}
.going .dot{width:10px;height:10px;border-radius:50%;background:#3fe08a;box-shadow:0 0 0 0 rgba(63,224,138,.7);animation:pulse 2s infinite}
@keyframes pulse{70%{box-shadow:0 0 0 12px rgba(63,224,138,0)}100%{box-shadow:0 0 0 0 rgba(63,224,138,0)}}

/* marquee */
.marquee{overflow:hidden;background:var(--gold);color:#140e00;transform:rotate(-1.2deg) scale(1.03);margin:10px 0 40px;border-block:3px solid #000;box-shadow:0 10px 40px -10px rgba(0,0,0,.8)}
.marquee-track{display:flex;width:max-content;white-space:nowrap;animation:slide 38s linear infinite;padding:12px 0}
.marquee span{font-family:var(--display);font-size:clamp(22px,5vw,30px);letter-spacing:.07em;text-transform:uppercase;padding:0 .6em}
.marquee i{font-style:normal;font-size:20px;display:grid;place-items:center;color:var(--green-800)}
@keyframes slide{to{transform:translateX(-25%)}}

/* section label */
.section-label{margin:0 0 22px;font-family:var(--marker);font-weight:400;font-size:clamp(24px,5vw,34px);color:var(--gold);text-align:center;transform:rotate(-1deg)}

/* countdown */
.countdown{padding:12px 0 56px}
.clock{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;max-width:640px;margin-inline:auto}
.tile{
  position:relative;text-align:center;padding:16px 4px 12px;border-radius:12px;background:linear-gradient(#0c1a13,#050905);
  border:2px solid rgba(233,185,47,.5);box-shadow:inset 0 0 24px rgba(31,122,79,.25),0 10px 30px -12px #000;
}
.tile::after{content:"";position:absolute;left:0;right:0;top:50%;height:2px;background:rgba(0,0,0,.65)}
.tile b{display:block;font-family:var(--display);font-weight:400;font-size:clamp(40px,12vw,76px);line-height:1;color:var(--gold-hi);text-shadow:0 0 22px rgba(255,220,114,.45);font-variant-numeric:tabular-nums}
.tile span{display:block;margin-top:6px;font-size:11px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--muted)}
.clock-done{margin:0;text-align:center;font-family:var(--display);font-size:clamp(34px,9vw,60px);text-transform:uppercase;color:var(--gold-hi)}
.clock-done em{display:block;font-style:normal;color:var(--cream)}
.clock-done[hidden]{display:none}

/* legend */
.legend{padding:10px 0 64px;overflow-x:clip}
.legend-grid{display:grid;gap:40px;align-items:center}
.polaroid{position:relative;margin:0 0 20px;justify-self:center;width:min(66%,290px);transform:rotate(-4deg)}
.polaroid img{position:relative;z-index:1;display:block;width:100%;height:auto;box-sizing:border-box;background:#f4ecd6;padding:12px 12px 46px;border-radius:3px;box-shadow:0 24px 36px -8px rgba(0,0,0,.75),0 0 0 1px rgba(0,0,0,.4)}
.tape-c{top:-14px;left:50%;margin-left:-46px;transform:rotate(3deg);z-index:3}
.marker{margin:0;font-family:var(--marker);font-size:clamp(22px,5vw,30px);color:var(--gold);transform:rotate(-1.5deg);display:inline-block}
.legend-copy h2{margin:6px 0 14px;font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:clamp(44px,11vw,84px);line-height:.95;text-shadow:3px 3px 0 #000}
.legend-copy h2 span{display:block;color:var(--gold-hi)}
.legend-copy p:not(.marker){max-width:42ch;color:#e2d4a6;font-size:18px}
.vinyl{
  position:absolute;z-index:0;right:-38%;bottom:-9%;width:72%;aspect-ratio:1;border-radius:50%;animation:spin 5.5s linear infinite;
  background:
    conic-gradient(from 20deg,rgba(255,255,255,0),rgba(255,255,255,.28) 12%,rgba(255,255,255,0) 28%,rgba(255,255,255,0) 50%,rgba(255,255,255,.24) 62%,rgba(255,255,255,0) 80%),
    repeating-radial-gradient(circle,#232323 0 1px,#0a0a0a 1px 3px);
  box-shadow:0 14px 28px -8px #000,0 0 0 3px #000,inset 0 0 0 6px #161616;
}
.vinyl-label{position:absolute;inset:0;margin:auto;width:34%;height:34%;border-radius:50%;background:radial-gradient(circle at 40% 35%,var(--gold-hi),var(--gold) 50%,var(--gold-lo));display:grid;place-items:center;box-shadow:0 0 0 2px #000}
.vinyl-label b{font-family:var(--display);font-weight:400;font-size:clamp(14px,4vw,22px);color:#1a1200}
@keyframes spin{to{transform:rotate(360deg)}}

/* rsvp */
.rsvp{padding:10px 0 90px}
.rsvp-card{
  max-width:680px;margin-inline:auto;padding:30px 22px 28px;border-radius:18px;
  background:linear-gradient(170deg,#0f2a1f 0%,#08130d 100%);border:3px solid var(--gold);
  box-shadow:0 0 0 6px #070806,0 0 0 8px rgba(233,185,47,.5),0 40px 80px -30px #000,0 0 80px -20px rgba(233,185,47,.3);
}
.rsvp-card .marker{display:block;margin:0 0 4px}
.rsvp-card h2{margin:0 0 20px;font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:clamp(64px,18vw,112px);line-height:.9;color:var(--gold-hi);text-shadow:4px 4px 0 #000}
.field{margin:0 0 20px;padding:0;border:0;min-width:0}
.field label,.field legend{display:block;margin-bottom:8px;padding:0;font-weight:700;font-size:15px;letter-spacing:.06em;text-transform:uppercase;color:var(--cream)}
.field label em,.field legend em{font-style:normal;font-weight:500;text-transform:none;letter-spacing:0;color:var(--muted);font-size:14px}
input[type=text],textarea{
  width:100%;min-height:54px;padding:14px 16px;border-radius:12px;border:2px solid rgba(246,231,189,.28);background:rgba(0,0,0,.45);color:var(--cream);
  font:500 17px/1.3 var(--body);transition:border-color .2s,background .2s;
}
textarea{resize:vertical;min-height:96px}
input::placeholder,textarea::placeholder{color:#7e775f}
input[type=text]:focus,textarea:focus{border-color:var(--gold);background:rgba(0,0,0,.65)}
.field.invalid input[type=text]{border-color:#ff7a6b}
.err{min-height:0;margin:6px 0 0;font-size:14px;font-weight:600;color:#ff9c90}
.err:empty{display:none}

.chips{display:grid;gap:10px}
.chip{display:block;margin:0!important;text-transform:none!important;letter-spacing:0!important;cursor:pointer}
.chip input{position:absolute;opacity:0;pointer-events:none}
.chip span{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:15px 18px;border-radius:12px;border:2px solid rgba(246,231,189,.28);background:rgba(0,0,0,.35);transition:all .15s}
.chip b{font-family:var(--display);font-weight:400;font-size:24px;letter-spacing:.05em;text-transform:uppercase;color:var(--cream)}
.chip small{font-size:14px;color:var(--muted);font-weight:500}
.chip:hover span{border-color:var(--gold)}
.chip input:checked+span{background:linear-gradient(180deg,var(--gold-hi),var(--gold));border-color:#fff1b0;box-shadow:0 8px 24px -8px rgba(233,185,47,.7)}
.chip input:checked+span b,.chip input:checked+span small{color:#1a1200}
.field.invalid .chip span{border-color:#ff7a6b}

.stepper{display:inline-flex;align-items:center;border:2px solid rgba(246,231,189,.28);border-radius:12px;overflow:hidden;background:rgba(0,0,0,.45)}
.stepper button{width:60px;height:56px;border:0;background:transparent;color:var(--gold-hi);font:400 40px/1 var(--body);font-weight:600;cursor:pointer}
.stepper button:hover{background:rgba(233,185,47,.15)}
.stepper input{width:64px!important;min-height:56px!important;border:0!important;border-inline:2px solid rgba(246,231,189,.2)!important;border-radius:0!important;text-align:center;font:400 32px var(--display)!important;background:transparent!important;color:var(--cream)!important;padding:0!important}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-status{margin:14px 0 0;min-height:1.4em;text-align:center;font-weight:600;color:#ff9c90}
.form-status.ok{color:#8ff0b7}
.btn[disabled]{opacity:.7;cursor:wait}

.thanks{text-align:center}
.thanks[hidden]{display:none}
.thanks h2{font-size:clamp(48px,13vw,92px)}
.thanks p:not(.marker){max-width:40ch;margin:0 auto 4px;font-size:19px;color:#eadcae}
.thanks .cta-row{justify-content:center;margin-top:24px}
.thanks .addr{margin:14px auto 0;padding:12px 16px;max-width:40ch;border:2px dashed rgba(233,185,47,.6);border-radius:12px;font-size:18px;color:var(--cream)}
.thanks .addr a{color:var(--gold-hi)}
.linkbtn{margin-top:20px;background:none;border:0;color:var(--muted);text-decoration:underline;text-underline-offset:4px;font:500 15px var(--body);cursor:pointer}
.linkbtn:hover{color:var(--gold-hi)}
form[hidden]{display:none}

/* footer */
.foot{position:relative;margin-top:30px;padding-top:0;background:linear-gradient(180deg,transparent,#050a07 55%)}
.skyline{display:block;width:100%;height:clamp(70px,14vw,160px);margin-bottom:-1px}
.foot-inner{text-align:center;padding:22px 0 calc(110px + env(safe-area-inset-bottom));background:#050605;width:100%;max-width:none}
.foot-big{margin:0;font-family:var(--display);font-size:clamp(46px,12vw,92px);line-height:1;color:var(--cream);text-transform:uppercase;letter-spacing:.03em}
.foot-big span{color:var(--gold-hi)}
.foot-inner p{margin:6px 0}
.foot-inner .small{color:var(--muted);font-size:14px;letter-spacing:.12em;text-transform:uppercase}
.foot-inner i{font-style:normal;color:var(--gold);margin:0 .4em}

/* sticky mobile rsvp */
.sticky-rsvp{
  position:fixed;z-index:45;right:max(16px,env(safe-area-inset-right));bottom:max(16px,env(safe-area-inset-bottom));
  display:inline-flex;align-items:center;gap:8px;min-height:56px;padding:0 24px;border-radius:999px;text-decoration:none;
  font-family:var(--display);font-size:22px;letter-spacing:.08em;color:#1a1200;background:linear-gradient(180deg,var(--gold-hi),var(--gold));
  border:2px solid #000;box-shadow:0 10px 30px -6px rgba(233,185,47,.7),4px 4px 0 #000;
  transform:translateY(140%);opacity:0;transition:transform .35s cubic-bezier(.2,.9,.3,1.2),opacity .25s;
}
.sticky-rsvp.show{transform:none;opacity:1}

#confetti{position:fixed;inset:0;width:100%;height:100%;z-index:60;pointer-events:none}

/* reveal */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.8,.2,1)}
.reveal.in{opacity:1;transform:none}
.poster.reveal{transform:translateY(22px) rotate(-1.2deg)}
.poster.reveal.in{transform:rotate(-1.2deg)}
.polaroid.reveal{transform:translateY(22px) rotate(-4deg)}
.polaroid.reveal.in{transform:rotate(-4deg)}
.no-js .reveal{opacity:1;transform:none}

/* tablet / desktop */
@media (min-width:760px){
  body{font-size:18px}
  .hero{padding:44px 0 70px}
  .legend-grid{grid-template-columns:minmax(260px,340px) 1fr;gap:70px}
  .polaroid{width:min(100%,300px)}
  .chips{grid-template-columns:repeat(3,1fr)}
  .chip span{flex-direction:column;align-items:flex-start;gap:2px;height:100%}
  .rsvp-card{padding:42px 44px 38px}
  .sticky-rsvp{display:none}
  .foot-inner{padding-bottom:50px}
}
@media (min-width:980px){
  h1{font-size:clamp(64px,7.4vw,100px)}
  .hero-inner{grid-template-columns:minmax(420px,560px) 1fr;gap:56px}
  .poster{width:100%;justify-self:start}
}
@media (max-width:420px){
  .when li{padding:10px 12px}
  .btn{padding:0 20px;font-size:18px}
  .cta-row .btn{flex:1 1 100%}
  .tile{padding-inline:2px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .marquee-track,.vinyl,.going .dot{animation:none}
  .reveal{opacity:1;transform:none;transition:none}
  .poster.reveal,.poster.reveal.in{transform:rotate(-1.2deg)}
  .polaroid.reveal,.polaroid.reveal.in{transform:rotate(-4deg)}
}

/* WhatsApp */
.btn-wa{color:#04210f;background:linear-gradient(180deg,#52f08f,#25d366 60%,#1aa851);box-shadow:0 0 0 1px #0b5a2a inset,0 8px 24px -6px rgba(37,211,102,.55),0 2px 0 #0b5a2a}
.btn-wa:hover{transform:translateY(-1px);box-shadow:0 0 0 1px #0b5a2a inset,0 12px 34px -6px rgba(37,211,102,.8),0 2px 0 #0b5a2a}
.wa-fallback{width:100%;margin-top:12px}
.wa-fallback[hidden]{display:none}
.prefer-wa{margin:18px 0 0;text-align:center;font-size:15px;color:var(--muted)}
.prefer-wa a,.inline-wa{color:var(--gold-hi);font-weight:700;text-underline-offset:3px;cursor:pointer}
#rsvpHead[hidden]{display:none}

/* Casa Loma venue banner */
.venue{padding:0 0 64px}
.venue-inner{text-align:center;padding:40px 22px 44px;border-radius:18px;max-width:900px;
  background:radial-gradient(600px 260px at 50% 0%,rgba(233,185,47,.16),transparent 70%),linear-gradient(170deg,#0d3a28,#07160f);
  border:3px solid var(--gold);box-shadow:8px 8px 0 #000}
.venue h2{margin:4px 0 8px;font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:clamp(64px,19vw,150px);line-height:.92;color:var(--cream);text-shadow:4px 4px 0 #000;letter-spacing:.01em}
.venue h2 span{color:transparent;background:linear-gradient(180deg,#fff0a8,var(--gold) 50%,var(--gold-lo));-webkit-background-clip:text;background-clip:text;text-shadow:none;filter:drop-shadow(4px 4px 0 #000)}
.venue-sub{max-width:34ch;margin:0 auto;font-size:19px;color:#eadcae}
.venue-house{display:block;margin:20px auto 4px;color:var(--gold)}
.venue .cta-row{justify-content:center}
.venue .btn[hidden]{display:none}

.legend-copy{position:relative;z-index:2}
.vinyl{right:-34%;bottom:-3%}

main{overflow-x:clip}

/* hero copy: RSVP button sits right under the date box, copy follows */
.hero-copy{display:flex;flex-direction:column;align-items:flex-start}
.hero-copy .when{order:3}.hero-copy .cta-row{order:4}.hero-copy .lede{order:5}.hero-copy .going{order:6}
.hero-copy .kicker{order:1}.hero-copy h1{order:2}
.hero-copy .cta-row{margin-top:22px}
.hero-copy .lede{margin-top:22px}
@media (max-width:420px){.hero-copy .cta-row,.hero-copy .when{width:100%}.hero-copy .when{justify-content:stretch}}

/* Casa Loma block now carries date + questions */
.venue-when{margin:0 0 6px;font-family:var(--display);font-size:clamp(17px,5.2vw,34px);letter-spacing:.05em;white-space:nowrap;text-transform:uppercase;color:var(--gold-hi)}
.venue-q{margin:20px 0 0;font-size:16px;color:var(--muted)}
.know{list-style:none;margin:18px auto 0;padding:0;max-width:34ch;text-align:left;display:grid;gap:8px}
.know[hidden]{display:none}
.know li{position:relative;padding-left:24px;color:#eadcae}
.know li::before{content:"\2726";position:absolute;left:0;color:var(--gold)}

.btn[hidden]{display:none!important}

/* Bigger hero video: edge-to-edge on phones, much wider on tablet/desktop */
@media (max-width:759px){
  .hero{padding-top:12px}
  .poster{width:calc(100% + 24px);margin-inline:-12px;margin-bottom:34px}
  .poster.reveal{transform:translateY(22px)}
  .poster.reveal.in{transform:none}
  .poster-frame{border-radius:12px}
}
@media (min-width:760px) and (max-width:979px){
  .poster{width:min(100%,800px)}
}
@media (min-width:980px){
  .hero-inner{width:min(1320px,100% - 48px);grid-template-columns:minmax(520px,1.35fr) minmax(0,1fr);gap:56px}
  .poster{width:100%;max-width:780px;justify-self:start}
}
@media (prefers-reduced-motion:reduce) and (max-width:759px){.poster.reveal,.poster.reveal.in{transform:none}}

/* ---- Tap-to-enter splash ---- */
body.splash-open{overflow:hidden}
.splash{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:24px;text-align:center;background:#050605;
  transition:opacity .6s ease,visibility .6s}
.splash.leaving{opacity:0;visibility:hidden}
.splash[hidden]{display:none}
.splash-bg{position:absolute;inset:0;background:
  radial-gradient(900px 600px at 80% 0%,rgba(31,122,79,.55),transparent 60%),
  radial-gradient(700px 500px at 0% 100%,rgba(233,185,47,.16),transparent 60%),
  linear-gradient(180deg,#07130d,#050605)}
.splash-inner{position:relative;max-width:520px;width:100%;display:flex;flex-direction:column;align-items:center}
.splash-crown{color:var(--gold);margin-bottom:6px;filter:drop-shadow(0 0 18px rgba(233,185,47,.5))}
.splash .marker{margin-bottom:2px}
.splash-title{margin:0;font-family:var(--display);font-weight:400;text-transform:uppercase;line-height:.9;font-size:clamp(70px,22vw,150px);color:var(--cream);text-shadow:4px 4px 0 #000}
.splash-title span{display:block}
.splash-title em{display:block;font-style:normal;color:transparent;background:linear-gradient(180deg,#fff0a8,var(--gold) 50%,var(--gold-lo));-webkit-background-clip:text;background-clip:text;text-shadow:none;filter:drop-shadow(4px 4px 0 #000)}
.splash-sub{margin:14px 0 30px;font-family:var(--display);font-size:clamp(20px,5vw,28px);letter-spacing:.14em;text-transform:uppercase;color:var(--gold-hi)}
.splash-btn{width:min(100%,360px);animation:enterpulse 2.2s ease-in-out infinite}
@keyframes enterpulse{0%,100%{box-shadow:0 0 0 1px #5b3d00 inset,0 8px 24px -6px rgba(233,185,47,.55),0 2px 0 #7a5200}50%{box-shadow:0 0 0 1px #5b3d00 inset,0 0 44px 4px rgba(255,220,114,.75),0 2px 0 #7a5200}}
.splash-note{margin:18px 0 0;font-size:15px;color:var(--muted)}
.splash-note .linkbtn{margin:0 0 0 6px}

/* Hidden audio-only YouTube player: stays in the page (so the browser keeps playing) but is invisible and untouchable */
.yt-host{position:fixed;left:0;bottom:0;width:200px;height:113px;opacity:0;pointer-events:none;z-index:-1;overflow:hidden}
.yt-host iframe,.yt-host #ytPlayer{width:200px;height:113px;border:0}

/* ---- Floating music button (bottom-left) ---- */
.music-btn{position:fixed;z-index:45;left:max(16px,env(safe-area-inset-left));bottom:max(16px,env(safe-area-inset-bottom));display:inline-flex;align-items:center;gap:8px;min-height:48px;padding:0 18px;border-radius:999px;
  font:700 14px var(--body);letter-spacing:.06em;text-transform:uppercase;color:var(--cream);background:rgba(7,8,6,.82);border:2px solid rgba(246,231,189,.45);cursor:pointer;
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);box-shadow:3px 3px 0 #000}
.music-btn[hidden]{display:none}
.music-btn[aria-pressed="true"]{color:#1a1200;background:linear-gradient(180deg,var(--gold-hi),var(--gold));border-color:#000}
.music-btn.attn{animation:enterpulse 1.6s ease-in-out infinite;border-color:var(--gold)}
@media (min-width:760px){.music-btn{bottom:24px;left:24px}}
@media (prefers-reduced-motion:reduce){.splash-btn,.music-btn.attn{animation:none}.splash{transition:none}}

.thanks .send-hint{max-width:40ch;margin:14px auto 0;font-size:16px;color:var(--gold-hi);font-weight:600}

/* ---- Language toggle (EN | ES) ---- */
.lang{display:inline-flex;border:2px solid rgba(233,185,47,.55);border-radius:999px;overflow:hidden;background:rgba(0,0,0,.4);flex:none}
.lang button{min-width:40px;min-height:34px;padding:0 10px;border:0;background:transparent;color:var(--cream);font:700 13px var(--body);letter-spacing:.08em;cursor:pointer}
.lang button[aria-pressed="true"]{background:linear-gradient(180deg,var(--gold-hi),var(--gold));color:#1a1200}
.lang button:focus-visible{outline:3px solid var(--gold-hi);outline-offset:-3px}
.lang-splash{position:absolute;top:max(16px,env(safe-area-inset-top));right:max(16px,env(safe-area-inset-right));z-index:2}
.topbar{gap:8px}
@media (max-width:439px){.mini-count{display:none}}
.i18n-pending body{visibility:hidden}

/* Music button: compact round icon on phones (label returns when the phone needs a nudge to start the song) */
@media (max-width:639px){
  .music-btn{width:50px;height:50px;min-height:50px;padding:0;justify-content:center;gap:0}
  .music-btn span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .music-btn.attn{width:auto;padding:0 18px;gap:8px}
  .music-btn.attn span{position:static;width:auto;height:auto;overflow:visible;clip:auto}
}

.sticky-rsvp{text-transform:uppercase}

/* ---- BIG "bring your own chair" callout ---- */
.chair{display:flex;align-items:center;gap:14px;width:fit-content;max-width:100%;margin:22px 0 0;padding:12px 20px;border:3px solid #000;border-radius:14px;
  font-family:var(--display);font-size:clamp(26px,7.4vw,42px);line-height:1.05;letter-spacing:.05em;text-transform:uppercase;color:#1a1200;
  background:linear-gradient(180deg,var(--gold-hi),var(--gold) 60%,#c98f12);box-shadow:5px 5px 0 #000,0 0 36px -6px rgba(233,185,47,.55);transform:rotate(-1deg)}
.chair svg{flex:none;width:clamp(30px,8vw,44px);height:auto}
.chair[hidden]{display:none}
.hero-copy .chair{order:4}
.hero-copy .cta-row{order:5}.hero-copy .lede{order:6}.hero-copy .going{order:7}
.hero-copy .chair{margin-top:20px}
.hero-copy .cta-row{margin-top:20px}
.chair-venue{margin:26px auto 0;transform:rotate(-1deg)}
.chair-thanks{margin:18px auto 0;font-size:clamp(22px,6vw,32px);padding:10px 16px}
@media (max-width:420px){.hero-copy .chair{width:100%;justify-content:center}}
.thanks .chair.chair-thanks{color:#1a1200;max-width:100%}
.hero-copy .chair{font-size:clamp(22px,6.3vw,42px);padding:11px 18px;gap:12px}