/* Showstopper Invites (sub-brand page at /invitations). Velvet theater: wine, champagne, gold.
   Own look on purpose: does not use the agency's styles.css. CSP-safe: no inline styles. */
@font-face{font-family:Bodoni;src:url(/invite/fonts/bodoni.woff2) format('woff2');font-weight:400 900;font-display:swap}
@font-face{font-family:Bodoni;src:url(/invite/fonts/bodoni-italic.woff2) format('woff2');font-weight:400 900;font-style:italic;font-display:swap}
@font-face{font-family:Jost;src:url(/invite/fonts/jost.woff2) format('woff2');font-weight:300 600;font-display:swap}
@font-face{font-family:Pinyon;src:url(/invite/fonts/pinyon.woff2) format('woff2');font-display:swap}
@font-face{font-family:Shoulders;src:url(/invite/fonts/bigshoulders.woff2) format('woff2');font-weight:500 900;font-display:swap}

:root{
  --wine:#2a0812; --wine-2:#3a0c1a; --velvet:#6e1328; --velvet-d:#430a18;
  --champ:#f6ecdb; --champ-2:#efe0c6; --ss-ink:#33091a; --gold:#d9ae5f; --gold-l:#f3d48f; --bulb:#ffe7a6;
  --mute-d:#d9c3b4; --mute-l:#6b4a4f;
  --display:"Instrument Serif",Bodoni,Didot,Georgia,serif; --body:Jost,system-ui,-apple-system,sans-serif;
  --script:Pinyon,"Snell Roundhand",cursive; --marq:Shoulders,Impact,"Arial Narrow",sans-serif;
  --gut:max(16px,env(safe-area-inset-left,0px));
  color-scheme:dark;
}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body.ss{margin:0;background:var(--wine);color:var(--champ);font:300 17px/1.6 var(--body);overflow-x:hidden}
img,video{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3,p,ul,ol{margin:0}
ul,ol{padding:0;list-style:none}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:8px;z-index:50;background:var(--gold);color:var(--ss-ink);padding:10px 14px;border-radius:8px}
.skip:focus{left:12px}
:focus-visible{outline:2px solid var(--gold-l);outline-offset:3px;border-radius:6px}

/* Bar */
.ss-bar{position:sticky;top:0;z-index:40;display:flex;align-items:center;gap:10px 14px;padding:10px var(--gut);background:rgba(42,8,18,.86);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid rgba(217,174,95,.22)}
.ss-mark{display:flex;align-items:baseline;gap:4px;text-decoration:none;line-height:1}
.ss-mark-a{font:800 20px/1 var(--marq);letter-spacing:.08em;text-transform:uppercase;color:var(--bulb)}
.ss-mark-b{font:400 24px/1 var(--script);color:var(--gold)}
.ss-by{font-size:12px;letter-spacing:.06em;color:var(--mute-d);text-decoration:none;white-space:nowrap}
.ss-by:hover{color:var(--gold-l)}
.ss-nav{margin-left:auto;display:flex;align-items:center;gap:18px}
.ss-nav a:not(.ss-btn){display:none;font-size:14px;text-decoration:none;color:var(--mute-d)}
.ss-nav a:not(.ss-btn):hover{color:var(--gold-l)}
@media (max-width:420px){.ss-by{display:none}}
@media (min-width:760px){.ss-nav a:not(.ss-btn){display:inline}}

/* Shared site header and footer come from /styles.css. Extras for this page: */
.nav-ss{white-space:nowrap}
.nav-ss svg{flex:none}
.ss-sub{display:flex;align-items:center;gap:6px;overflow-x:auto;scrollbar-width:none;padding:8px var(--gut);background:linear-gradient(90deg,#3a0c1a,#2a0812);border-bottom:1px solid rgba(217,174,95,.25);font-size:14px}
.ss-sub::-webkit-scrollbar{display:none}
.ss-sub a{flex:none;text-decoration:none;color:var(--mute-d);padding:8px 12px;border-radius:999px;white-space:nowrap}
.ss-sub a:hover{color:var(--gold-l);background:rgba(255,255,255,.06)}
.ss-sub-home{color:var(--champ)!important;font-weight:500}
.ss-sub-cta{margin-left:auto;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.28);color:#fff!important}
.ss-sitefoot .ss-foot-mark{display:flex;align-items:center;justify-content:flex-start;gap:6px;margin-bottom:14px;padding-bottom:16px;border-bottom:1px solid rgba(217,174,95,.25)}
.ss-sitefoot .ss-foot-mark svg{flex:none}

/* Buttons */
.ss-btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:12px 24px;border-radius:999px;background:linear-gradient(180deg,var(--gold-l),var(--gold));color:var(--ss-ink);font:600 15px/1.1 var(--body);letter-spacing:.04em;text-decoration:none;border:1px solid var(--gold-l);box-shadow:0 8px 26px rgba(217,174,95,.28);transition:transform .2s,box-shadow .2s}
.ss-btn:hover{transform:translateY(-2px);box-shadow:0 12px 32px rgba(217,174,95,.42)}
/* Glass secondary button, same as the agency site's ghost button */
.ss-btn-line{background:rgba(255,255,255,.1);color:#fff;border-color:rgba(255,255,255,.3);box-shadow:none;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.ss-btn-line:hover{background:rgba(255,255,255,.18);box-shadow:none}
.ss-btn-sm{min-height:38px;padding:8px 16px;font-size:13px}
.ss-light .ss-btn-line{background:rgba(51,9,26,.04);color:var(--ss-ink);border-color:rgba(51,9,26,.4)}

/* Hero: the stage */
.ss-hero{position:relative;overflow:hidden;isolation:isolate;padding:clamp(70px,12vw,120px) max(var(--gut),calc(6.2% + 10px)) clamp(40px,6vw,64px);background:radial-gradient(120% 70% at 50% 0%,#5a1024 0%,var(--wine) 60%)}
.ss-spot{position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(40% 55% at 50% 38%,rgba(255,226,160,.20),transparent 70%)}
.ss-hero-in{max-width:1100px;margin:0 auto;text-align:center;display:flex;flex-direction:column;align-items:center}

/* Curtains part once on load, then stay bunched at the sides. CSS only. */
.ss-curtain{position:absolute;inset:0;z-index:5;pointer-events:none}
.ss-c{position:absolute;top:0;bottom:0;width:51%;background:
  linear-gradient(180deg,rgba(0,0,0,.25),transparent 30%,transparent 75%,rgba(0,0,0,.45)),
  repeating-linear-gradient(90deg,var(--velvet-d) 0,var(--velvet) 2.2%,#8a1c35 3.2%,var(--velvet) 4.4%,var(--velvet-d) 6.6%);
  box-shadow:inset 0 0 60px rgba(0,0,0,.5)}
.ss-cl{left:0;transform-origin:0 50%;animation:ss-open-l 2.1s cubic-bezier(.75,0,.2,1) .45s both}
.ss-cr{right:0;transform-origin:100% 50%;animation:ss-open-r 2.1s cubic-bezier(.75,0,.2,1) .45s both}
.ss-valance{position:absolute;left:0;right:0;top:0;height:clamp(26px,5vw,44px);background:
  radial-gradient(60% 100% at 50% 0,#8a1c35 0 60%,transparent 62%) 0 0/clamp(60px,10vw,110px) 100% repeat-x,
  linear-gradient(var(--velvet-d),var(--velvet-d)) 0 0/100% 40% no-repeat;
  filter:drop-shadow(0 4px 6px rgba(0,0,0,.5))}
.ss-valance::after{content:"";position:absolute;left:0;right:0;bottom:-4px;height:6px;background:repeating-linear-gradient(90deg,var(--gold) 0 2px,transparent 2px 6px);opacity:.75}
@keyframes ss-open-l{from{transform:scaleX(1)}to{transform:scaleX(.12)}}
@keyframes ss-open-r{from{transform:scaleX(1)}to{transform:scaleX(.12)}}
@media (max-width:600px){.ss-cl,.ss-cr{animation-name:ss-open-m}}
@keyframes ss-open-m{from{transform:scaleX(1)}to{transform:scaleX(.08)}}

/* Marquee sign with chasing bulbs */
.ss-sign{position:relative;display:inline-flex;flex-direction:column;align-items:center;padding:clamp(18px,3vw,28px) clamp(22px,5vw,48px) clamp(12px,2vw,18px);border:3px solid var(--gold);border-radius:20px;background:linear-gradient(180deg,#46101f,#2c0913);box-shadow:0 0 0 6px var(--wine-2),0 0 0 8px rgba(217,174,95,.5),0 30px 80px rgba(0,0,0,.5),inset 0 0 40px rgba(255,200,120,.10);animation:ss-rise 1s ease-out 1.6s both}
.ss-bulbs{position:absolute;inset:7px;border-radius:14px;pointer-events:none;background:
  radial-gradient(circle,var(--bulb) 0 2.6px,transparent 3.6px) 0 0/18px 10px repeat-x,
  radial-gradient(circle,var(--bulb) 0 2.6px,transparent 3.6px) 0 100%/18px 10px repeat-x,
  radial-gradient(circle,var(--bulb) 0 2.6px,transparent 3.6px) 0 0/10px 18px repeat-y,
  radial-gradient(circle,var(--bulb) 0 2.6px,transparent 3.6px) 100% 0/10px 18px repeat-y;
  filter:drop-shadow(0 0 4px #ffc85a) drop-shadow(0 0 10px rgba(255,190,80,.6));animation:ss-chase .9s steps(2) infinite}
@keyframes ss-chase{to{background-position:18px 0,-18px 100%,0 -18px,100% 18px}}
.ss-sign-a{font:900 clamp(40px,12.5vw,108px)/.9 var(--marq);letter-spacing:.04em;text-transform:uppercase;color:#fff3d2;text-shadow:0 0 6px rgba(255,214,140,.9),0 0 22px rgba(255,180,70,.55),0 3px 0 #8a5a1e}
.ss-sign-b{font:400 clamp(40px,10vw,84px)/.8 var(--script);color:var(--gold-l);margin-top:-.08em;transform:rotate(-5deg);text-shadow:0 0 14px rgba(243,212,143,.45)}
@keyframes ss-rise{from{opacity:0;transform:translateY(16px) scale(.96)}to{opacity:1;transform:none}}

.ss-h1{margin-top:clamp(28px,5vw,44px);font:400 clamp(38px,8vw,76px)/1.02 var(--display);letter-spacing:-.01em;text-wrap:balance;max-width:16ch}
.ss-h1 em,.ss-h2 em{font-style:italic;color:var(--gold-l)}
.ss-lead{margin-top:16px;max-width:52ch;color:var(--mute-d);font-size:clamp(16px,2vw,19px)}
.ss-hero .ss-lead{margin-inline:auto}
.ss-ctas{margin-top:26px;display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
.ss-hero .ss-h1,.ss-hero .ss-lead,.ss-hero .ss-ctas{animation:ss-rise .9s ease-out 1.9s both}

/* Three phones on stage */
.ss-phones{margin-top:clamp(36px,6vw,60px);display:grid;grid-template-columns:1fr 1.18fr 1fr;align-items:end;gap:clamp(8px,2.4vw,28px);width:min(100%,780px);animation:ss-rise 1s ease-out 2.1s both}
.ss-ph{display:block;border-radius:clamp(16px,3vw,34px);padding:clamp(3px,.7vw,7px);background:linear-gradient(160deg,#5b4632,#1e1611 40%,#4a3826);box-shadow:0 30px 60px rgba(0,0,0,.55),0 0 0 1px rgba(243,212,143,.25);transition:transform .35s}
.ss-ph video{width:100%;aspect-ratio:360/750;object-fit:cover;object-position:top;border-radius:clamp(13px,2.5vw,28px);background:#000}
.ss-ph-1{transform:rotate(-4deg) translateY(10px)}
.ss-ph-3{transform:rotate(4deg) translateY(10px)}
.ss-ph:hover{transform:translateY(-6px)}
.ss-cap{margin-top:18px;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}

/* Ticker */
.ss-ticker{overflow:hidden;background:var(--gold);color:var(--ss-ink);border-block:1px solid var(--gold-l)}
.ss-tick-track{display:flex;width:max-content;animation:ss-tick 38s linear infinite}
.ss-tick{display:flex;flex:none}
.ss-tick li{font:800 clamp(18px,3vw,26px)/1 var(--marq);text-transform:uppercase;letter-spacing:.08em;padding:14px 0;white-space:nowrap}
.ss-tick li::after{content:"\2726";margin:0 22px;font-size:.7em;vertical-align:.12em}
@keyframes ss-tick{to{transform:translateX(-50%)}}

/* Sections */
.ss-sec{position:relative;padding:clamp(64px,10vw,120px) var(--gut)}
.ss-in{max-width:1120px;margin:0 auto}
.ss-narrow{max-width:760px}
.ss-center{text-align:center}
.ss-light{background:var(--champ);color:var(--ss-ink)}
.ss-light .ss-h2 em{color:var(--velvet)}
.ss-dark{background:var(--wine)}
.ss-k{font-size:12px;letter-spacing:.28em;text-transform:uppercase;color:var(--gold)}
.ss-light .ss-k{color:var(--velvet)}
.ss-h2{margin-top:12px;font:400 clamp(34px,6.4vw,62px)/1.04 var(--display);letter-spacing:-.01em;text-wrap:balance;max-width:20ch}
.ss-center .ss-h2{margin-inline:auto}
.ss-big{font-size:clamp(44px,9vw,96px)}
.ss-note{margin-top:28px;color:var(--mute-l)}
.ss-light .ss-lead{color:var(--mute-l)}

/* Tickets */
.ss-tickets{margin-top:clamp(32px,5vw,52px);display:grid;gap:22px;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr))}
.ss-ticket{display:flex;flex-direction:column;height:100%;text-decoration:none;color:var(--champ);background:var(--wine-2);border-radius:18px;overflow:hidden;box-shadow:0 18px 40px rgba(51,9,26,.22);transition:transform .3s,box-shadow .3s}
.ss-ticket:hover{transform:translateY(-6px) rotate(-.4deg);box-shadow:0 26px 50px rgba(51,9,26,.3)}
.ss-t-img{display:block;aspect-ratio:540/620;overflow:hidden;background:#140509}
.ss-t-img img{width:100%;height:100%;object-fit:cover;object-position:50% 28%;transition:transform .6s}
.ss-ticket:hover .ss-t-img img{transform:scale(1.04)}
.ss-stub{position:relative;display:flex;flex-direction:column;gap:6px;padding:22px 22px 24px;border-top:2px dashed rgba(217,174,95,.55);
  -webkit-mask:radial-gradient(circle 12px at 0 0,transparent 98%,#000) top left/51% 100% no-repeat,radial-gradient(circle 12px at 100% 0,transparent 98%,#000) top right/51% 100% no-repeat;
  mask:radial-gradient(circle 12px at 0 0,transparent 98%,#000) top left/51% 100% no-repeat,radial-gradient(circle 12px at 100% 0,transparent 98%,#000) top right/51% 100% no-repeat}
.ss-admit{font:700 12px/1 var(--marq);letter-spacing:.24em;text-transform:uppercase;color:var(--gold)}
.ss-t-name{font:400 30px/1.05 var(--display)}
.ss-t-txt{color:var(--mute-d);font-size:15px;line-height:1.5}
.ss-t-go{margin-top:8px;font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-l)}
.ss-t-go::after{content:" \2192"}

/* Features */
.ss-feats{margin-top:clamp(32px,5vw,52px);display:grid;gap:0 40px;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));counter-reset:f}
.ss-feats li{display:flex;align-items:baseline;gap:18px;padding:20px 0;border-bottom:1px solid rgba(217,174,95,.22);font:400 clamp(21px,2.6vw,27px)/1.25 var(--display)}
.ss-num{flex:none;font:700 13px/1 var(--marq);letter-spacing:.14em;color:var(--gold)}

/* Program (how it works) */
.ss-program .ss-in{position:relative}
.ss-acts{margin-top:clamp(32px,5vw,52px);display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr))}
.ss-acts li{padding:26px 22px 28px;border:1px solid rgba(51,9,26,.22);border-radius:16px;background:#fbf5ea}
.ss-act{font:400 30px/1 var(--script);color:var(--velvet)}
.ss-acts h3{margin-top:12px;font:400 24px/1.2 var(--display)}
.ss-acts p{margin-top:8px;color:var(--mute-l);font-size:15.5px}

/* Grand Opening Kit spotlight */
.ss-kit{background:radial-gradient(70% 120% at 80% 50%,rgba(255,214,140,.16),transparent 60%),linear-gradient(120deg,var(--velvet-d),var(--wine) 70%);border-block:1px solid rgba(217,174,95,.3)}
.ss-kit-in{display:grid;gap:28px;align-items:center}
.ss-kit-p{margin-top:14px;max-width:46ch;color:var(--mute-d)}
.ss-kit-buy{display:flex;flex-direction:column;align-items:flex-start;gap:10px;padding:26px;border:2px solid var(--gold);border-radius:18px;background:rgba(42,8,18,.6);box-shadow:0 0 0 6px rgba(217,174,95,.12)}
.ss-kit-price{font:400 clamp(44px,7vw,64px)/1 var(--display);color:var(--gold-l);font-variant-numeric:tabular-nums}
.ss-kit-price small{font:400 18px/1 var(--body);color:var(--champ)}
.ss-kit-small{font-size:14px;color:var(--mute-d)}
@media (min-width:860px){.ss-kit-in{grid-template-columns:1.4fr 1fr}}

/* Prices */
.ss-launch{margin-top:16px;display:inline-block;padding:8px 14px;border-radius:999px;background:var(--ss-ink);color:var(--champ);font-size:14px}
.ss-launch b{color:var(--gold-l);font-weight:600}
.ss-plans{margin-top:clamp(32px,5vw,52px);display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr))}
.ss-plan{position:relative;display:flex;flex-direction:column;gap:10px;padding:28px 24px;border-radius:18px;background:#fbf5ea;border:1px solid rgba(51,9,26,.2)}
.ss-plan h3{font:400 30px/1.1 var(--display)}
.ss-plan p{color:var(--mute-l);font-size:15.5px}
.ss-price{margin-top:auto;padding-top:14px;font:400 30px/1.1 var(--display)!important;color:var(--ss-ink)!important;font-variant-numeric:tabular-nums}
.ss-price s{font-size:.6em;color:var(--mute-l);margin-right:4px}
.ss-pick{background:var(--wine-2);border:2px solid var(--gold);color:var(--champ);box-shadow:0 20px 50px rgba(51,9,26,.3)}
.ss-pick p{color:var(--mute-d)}
.ss-pick .ss-price{color:var(--gold-l)!important}
.ss-pick .ss-price s{color:var(--mute-d)}
.ss-tag{position:absolute;top:-13px;left:22px;padding:6px 12px;border-radius:999px;background:var(--gold);color:var(--ss-ink)!important;font:800 12px/1 var(--marq)!important;letter-spacing:.16em;text-transform:uppercase}
.ss-pass{margin-top:28px;max-width:72ch;color:var(--mute-l)}
.ss-pass b{color:var(--ss-ink);font-weight:600}

/* Planners */
.ss-split{display:grid;gap:28px;align-items:end}
@media (min-width:860px){.ss-split{grid-template-columns:1.5fr auto}}

/* FAQ */
.ss-faq{margin-top:28px}
.ss-faq details{border-bottom:1px solid rgba(51,9,26,.18);padding:18px 0}
.ss-faq summary{cursor:pointer;font:400 21px/1.3 var(--display);list-style:none;display:flex;justify-content:space-between;gap:16px}
.ss-faq summary::-webkit-details-marker{display:none}
.ss-faq summary::after{content:"+";flex:none;font:400 24px/1 var(--body);color:var(--velvet);transition:transform .2s}
.ss-faq details[open] summary::after{transform:rotate(45deg)}
.ss-faq p{margin-top:10px;color:var(--mute-l);max-width:64ch}

/* Final */
.ss-final{overflow:hidden;isolation:isolate;background:radial-gradient(120% 80% at 50% 100%,#5a1024,var(--wine) 65%)}
.ss-final .ss-spot{background:radial-gradient(45% 60% at 50% 45%,rgba(255,226,160,.16),transparent 70%)}
.ss-final .ss-lead{margin-inline:auto}

/* Footer */
.ss-foot{padding:40px var(--gut) calc(40px + env(safe-area-inset-bottom,0px));background:#1e050c;color:var(--mute-d);font-size:14px;text-align:center;display:grid;gap:10px;border-top:1px solid rgba(217,174,95,.2)}
.ss-foot a{color:var(--champ)}
.ss-foot-mark{margin-bottom:6px}

/* Reveal on view (only once JS has run) */
.js .rv{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s ease}
.js .rv.in{opacity:1;transform:none}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .ss-curtain .ss-c{display:none}
  .ss-sign,.ss-hero .ss-h1,.ss-hero .ss-lead,.ss-hero .ss-ctas,.ss-phones{animation:none}
  .ss-bulbs,.ss-tick-track{animation:none}
  .js .rv{opacity:1;transform:none;transition:none}
  .ss-ticket,.ss-ph,.ss-btn,.ss-t-img img{transition:none}
}
.ss-sitefoot{font-family:var(--sans)}