/* =========================================================
   Gala WINgs 2026 — Landing · Waiting list
   Fonts: Playfair Display (display) + DM Sans (text)  → 2 fonts
   Sizes: --fs-display / --fs-lead / --fs-body         → 3 sizes
   ========================================================= */

:root{
  --cream:#FAF0E4;
  --cream-2:#F4E3D1;
  --orange:#F26018;
  --orange-deep:#C7461A;
  --orange-soft:#F7B48C;
  --ink:#1A0A02;
  --ink-2:#2A1407;
  --muted:#8A5236;      /* warm sienna for secondary text — no greys anywhere */
  --line:rgba(242,96,24,.24);   /* hairlines on light backgrounds */
  --line-dark:rgba(242,96,24,.32); /* hairlines on the dark sections */
  --white:#FFFFFF;

  --font-display:'Playfair Display', Georgia, serif;
  --font-text:'DM Sans', system-ui, -apple-system, sans-serif;

  --fs-display:clamp(1.9rem, .9rem + 3.1vw, 3.6rem); /* titles: calmer, more refined scale */
  --fs-lead:clamp(1.04rem, .84rem + .76vw, 1.48rem);
  --fs-body:clamp(.85rem, .8rem + .2vw, .96rem);

  --radius:22.4px;
  --gutter:clamp(16px, 4vw, 57.6px);
  --max:992px;
  --ease:cubic-bezier(.22,1,.36,1);
  --shadow-orange:0 14.4px 40px -9.6px rgba(242,96,24,.55);
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  font-family:var(--font-text);
  font-size:var(--fs-body);
  line-height:1.6;
  color:var(--ink);
  background:var(--cream);
  overflow-x:hidden;
  font-weight:400;
}
img,video,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
::selection{background:var(--orange);color:var(--cream)}

/* ---------- Type ---------- */
.display{
  font-family:var(--font-display);
  font-size:var(--fs-display);
  line-height:1.02;
  font-weight:700;
  letter-spacing:-.015em;
}
.lead em{font-style:italic;font-weight:600;color:var(--orange)}
/* titles: the accent words only change colour — same upright weight as the rest of the title */
.display em,h1 em,h2 em,h3 em{font-style:normal;font-weight:inherit;color:var(--orange)}
.lead{font-size:var(--fs-lead);line-height:1.35;font-weight:400}
.lead.serif{font-family:var(--font-display);font-style:italic;font-weight:500}
.label{
  font-size:var(--fs-body);
  text-transform:uppercase;
  letter-spacing:.28em;
  font-weight:700;
  color:var(--orange);
  display:inline-flex;align-items:center;gap:11.2px;
}
.label::before{content:"";width:27.2px;height:2px;background:currentColor;flex:none}
.label.center::after{content:"";width:27.2px;height:2px;background:currentColor;flex:none}
.on-dark{color:var(--cream)}
.on-dark .label{color:var(--orange)}
.on-orange .label{color:var(--ink)}
strong{font-weight:700}

/* ---------- Layout ---------- */
.wrap{width:min(var(--max),100% - 2*var(--gutter));margin-inline:auto}
.section{position:relative;padding-block:clamp(50px,6.4vw,88px);overflow:hidden} /* tighter rhythm between sections (was 67–120px) */
.section.dark{background:var(--ink);color:var(--cream)}
.section.orange{background:var(--orange);color:var(--ink)}
.section.cream2{background:var(--cream-2)}
.stack>*+*{margin-top:1.25em}
.narrow{max-width:608px}
.center{text-align:center;margin-inline:auto}

/* ---------- Monogram-style pattern (decorative, behind content, fades under the text) ---------- */
.pattern{position:absolute;inset:0;pointer-events:none;z-index:0;background-repeat:repeat;background-size:208px 240px;background-position:center top;opacity:.13;
  -webkit-mask-image:radial-gradient(ellipse 60% 70% at 50% 50%,transparent 0 38%,#000 92%);mask-image:radial-gradient(ellipse 60% 70% at 50% 50%,transparent 0 38%,#000 92%)}
.pattern.orange{background-image:url("../img/pattern-orange.svg")}
.pattern.cream{background-image:url("../img/pattern-cream.svg")}
.pattern+.pattern{display:none}
.dark .pattern{opacity:.085}
.orange .pattern{opacity:.13}
.cream2 .pattern{opacity:.12}
.hero .pattern{opacity:.09;-webkit-mask-image:linear-gradient(180deg,transparent 0 45%,#000 100%);mask-image:linear-gradient(180deg,transparent 0 45%,#000 100%)}
.poem .pattern{opacity:.3;background-position:0 0;-webkit-mask-image:linear-gradient(90deg,transparent 0 18%,#000 62%);mask-image:linear-gradient(90deg,transparent 0 18%,#000 62%);animation:drift 36s linear infinite}
@keyframes drift{to{background-position:208px 240px}}
/* dynamic card: brushed-metal plate, gentle cursor tilt and a diagonal light streak that glides across on its own */
.poem .plate::after,.card::after,.step::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:0;border-radius:inherit;
  background:
    linear-gradient(112deg,transparent 41%,rgba(255,255,255,.06) 45%,rgba(255,255,255,.32) 49.2%,rgba(255,255,255,.55) 50%,rgba(255,255,255,.32) 50.8%,rgba(255,255,255,.06) 55%,transparent 59%),
    linear-gradient(112deg,transparent 30%,rgba(255,255,255,.10) 46%,rgba(255,255,255,.14) 50%,rgba(255,255,255,.10) 54%,transparent 70%);
  background-size:300% 100%;background-repeat:no-repeat;background-position:100% 0}
/* the streak sweeps left → right every few seconds, staggered so the plates catch the light one after another */
@keyframes shine{0%{background-position:100% 0}24%,100%{background-position:0% 0}}
.poem .plate::after,.card::after,.step::after{animation:shine 7s cubic-bezier(.45,0,.25,1) infinite}
.poem .plate::after{animation-delay:.6s}
.card:nth-child(2)::after{animation-delay:.45s}
.step:nth-child(2)::after{animation-delay:.35s}
.step:nth-child(3)::after{animation-delay:.7s}
@media (prefers-reduced-motion:reduce){.poem .plate::after,.card::after,.step::after{animation:none}}
@media (prefers-reduced-motion:reduce){.poem,.poem .pattern{animation:none}}
.video-frame .pattern{display:none}
.page-center .pattern{opacity:.11}
.thanks .pattern{opacity:.11}
.section>.wrap{position:relative;z-index:1}
.footer{position:relative}
.footer .pattern{opacity:.07;-webkit-mask-image:none;mask-image:none}
.footer .wrap{position:relative;z-index:1}

/* ---------- Soft glows ---------- */
.glow{position:absolute;pointer-events:none;border-radius:50%;filter:blur(72px);opacity:.55;z-index:0}
.hero::before,.hero::after,.final::before,.secret::before,.story::before{content:"";position:absolute;pointer-events:none;border-radius:50%;filter:blur(88px);z-index:0}
.hero::before{width:48vw;height:48vw;max-width:656px;max-height:656px;right:-16vw;top:-24vw;background:rgba(242,96,24,.16)}
.hero::after{width:32vw;height:32vw;max-width:448px;max-height:448px;left:-14.4vw;top:30%;background:rgba(242,96,24,.10)}
.story::before{width:40vw;height:40vw;max-width:560px;max-height:560px;right:-16vw;bottom:-16vw;background:rgba(242,96,24,.10)}
.secret::before{width:40vw;height:40vw;max-width:560px;max-height:560px;left:-16vw;bottom:-20vw;background:rgba(242,96,24,.12)}
.final::before{width:56vw;height:56vw;max-width:720px;max-height:720px;left:50%;top:50%;transform:translate(-50%,-50%);background:rgba(242,96,24,.14)}
.section>.wrap{position:relative;z-index:1}

/* ---------- Button ---------- */
@property --a{syntax:'<angle>';inherits:false;initial-value:0deg}
.btn{
  position:relative;display:inline-flex;align-items:center;gap:12.8px;
  padding:1.05em 1.9em 1.05em 2.1em;border-radius:799.2px;
  /* layer 1: diagonal light streak (moved by --sh), layer 2: the orange body (shifted by --bp on hover) */
  background-image:
    linear-gradient(112deg,transparent 40%,rgba(255,236,220,0) 43%,rgba(255,240,228,.5) 50%,rgba(255,236,220,0) 57%,transparent 60%),
    linear-gradient(100deg,var(--orange-deep) 0%,var(--orange) 45%,#FF7E3F 100%);
  background-size:250% 100%,200% 100%;background-repeat:no-repeat;background-position:var(--sh) 0,var(--bp) 50%;
  color:var(--cream);font-weight:700;letter-spacing:.01em;line-height:1.15;
  box-shadow:var(--shadow-orange),inset 0 1px 0 rgba(255,255,255,.22);
  isolation:isolate;white-space:nowrap;--a:0deg;
  transition:transform .55s var(--ease),box-shadow .55s var(--ease),--bp .9s var(--ease),letter-spacing .55s var(--ease);
  animation:btnshine 6s cubic-bezier(.45,0,.25,1) 1.8s infinite;
}
@property --sh{syntax:'<percentage>';inherits:false;initial-value:110%}
@property --bp{syntax:'<percentage>';inherits:false;initial-value:0%}
/* the streak glides left → right across the button, then rests for a few seconds */
@keyframes btnshine{0%{--sh:110%}26%,100%{--sh:-10%}}
@media (prefers-reduced-motion:reduce){.btn{animation:none}}
.btn .ic{
  width:2.2em;height:2.2em;border-radius:50%;flex:none;
  display:grid;place-items:center;background:var(--cream);color:var(--orange);
  transition:transform .55s var(--ease),background .4s,color .4s,box-shadow .55s var(--ease);
}
.btn .ic svg{width:1.05em;height:1.05em;stroke:currentColor;fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;transition:transform .55s var(--ease)}
/* rotating contour */
.btn::before{
  content:"";position:absolute;inset:-3.2px;border-radius:inherit;z-index:-1;
  background:conic-gradient(from var(--a),transparent 0 58%,var(--cream) 76%,var(--orange-soft) 86%,transparent 96%);
  padding:3.2px;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;
  opacity:0;transition:opacity .45s;
}
/* soft halo */
.btn::after{
  content:"";position:absolute;inset:-8px;border-radius:inherit;z-index:-2;
  background:radial-gradient(closest-side,rgba(242,96,24,.55),rgba(242,96,24,0));
  opacity:0;transform:scale(.9);transition:opacity .6s var(--ease),transform .6s var(--ease);
}
.btn:hover,.btn:focus-visible{
  transform:translateY(-2.4px);outline:none;--bp:100%;letter-spacing:.035em;
  box-shadow:0 0 0 1.5px rgba(250,240,228,.65),0 0 0 6.4px rgba(242,96,24,.16),0 22.4px 48px -12.8px rgba(242,96,24,.9),inset 0 1px 0 rgba(255,255,255,.25);
}
.btn:hover::before,.btn:focus-visible::before{opacity:1;animation:spin 1.8s linear infinite}
.btn:hover::after,.btn:focus-visible::after{opacity:1;transform:scale(1.08)}
.btn:hover .ic{transform:translateX(6.4px) scale(1.08);box-shadow:0 0 0 3.2px rgba(250,240,228,.35),0 6.4px 14.4px -4.8px rgba(26,10,2,.35)}
.btn:hover .ic svg{transform:translateX(2px)}
.btn:active{transform:translateY(-1px) scale(.99)}
.btn.big{padding:1.2em 2.1em 1.2em 2.4em}
.btn.small{padding:.8em 1.3em .8em 1.5em}
.btn.small .ic{width:1.9em;height:1.9em}
.btn.on-dark-bg{box-shadow:0 14.4px 40px -8px rgba(242,96,24,.8),inset 0 1px 0 rgba(255,255,255,.22)}
.btn.ink{background-image:linear-gradient(112deg,transparent 40%,rgba(255,236,220,0) 43%,rgba(255,226,204,.28) 50%,rgba(255,236,220,0) 57%,transparent 60%),linear-gradient(100deg,#0F0500,var(--ink) 50%,#3A1C0C);color:var(--cream)}
.btn.ink .ic{background:var(--orange);color:var(--cream)}
.btn.ink::before{background:conic-gradient(from var(--a),transparent 0 62%,var(--orange) 78%,var(--orange-soft) 86%,transparent 94%)}
.btn.ink:hover{box-shadow:0 0 0 1.5px rgba(242,96,24,.6),0 0 0 6.4px rgba(242,96,24,.14),0 22.4px 48px -12.8px rgba(26,10,2,.8)}

@keyframes spin{to{--a:360deg}}
.cta-note{display:flex;align-items:center;gap:9.6px;font-weight:500}
.cta-note .dot{width:8px;height:8px;border-radius:50%;background:var(--orange);box-shadow:0 0 0 4.8px rgba(242,96,24,.18);animation:blink 1.8s ease-in-out infinite;flex:none}

@keyframes blink{0%,100%{opacity:1}50%{opacity:.45}}

/* ---------- Header ---------- */
.header{
  position:fixed;inset:0 0 auto 0;z-index:50;
  padding-block:14.4px;transition:background .5s,box-shadow .5s,padding .5s;
}
.header .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px}
.header.scrolled{background:rgba(250,240,228,.82);backdrop-filter:blur(11.2px);-webkit-backdrop-filter:blur(11.2px);box-shadow:0 1px 0 rgba(26,10,2,.08);padding-block:8px}
.logo img{height:96px;width:auto;transition:height .5s,opacity .4s}
.logo img.light{filter:drop-shadow(0 3.2px 11.2px rgba(26,10,2,.45)) drop-shadow(0 1px 2px rgba(26,10,2,.35))}
.logo img.dark{display:none}
.header.scrolled .logo img{height:72px}
.header.scrolled .logo img.light{display:none}
.header.scrolled .logo img.dark{display:block}
.footer img{filter:drop-shadow(0 2px 8px rgba(0,0,0,.35))}
.header .when{display:inline-flex;align-items:center;gap:9.6px;white-space:nowrap;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--ink)}
.header .when i{width:4.8px;height:4.8px;border-radius:50%;background:var(--orange)}

/* header over the hero video: light text until the bar appears */
.header.has-cta:not(.scrolled) .when{color:var(--cream);text-shadow:0 1px 8px rgba(26,10,2,.45)}

/* mobile-only header CTA (hidden on desktop) */
.head-cta{display:none}

/* ---------- Hero ---------- */
@property --g{syntax:'<percentage>';inherits:false;initial-value:0%}
.hero{
  padding-top:0;padding-bottom:clamp(57.6px,7.2vw,96px);
  background:linear-gradient(180deg,var(--cream) 0%,var(--cream) 55%,#F7E2CF 100%);
}
.hero::before{background:rgba(242,96,24,.2)}
.hero::after{background:rgba(242,96,24,.14)}
.hero .intro{display:grid;grid-template-columns:minmax(0,1fr);gap:20.8px;max-width:784px;margin-inline:auto;text-align:center;justify-items:center}
.hero .label.pill{border:1.5px solid rgba(242,96,24,.45);border-radius:799.2px;padding:.55em 1.3em;background:rgba(255,255,255,.55);backdrop-filter:blur(4.8px);-webkit-backdrop-filter:blur(4.8px);gap:9.6px}
.hero .label.pill::before,.hero .label.pill::after{width:14.4px}
/* date + city as a quiet line right under the sign-up button */
.hero .date{display:inline-flex;align-items:center;gap:.9em;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--ink)}
.hero .date i{width:4.8px;height:4.8px;border-radius:50%;background:var(--orange);flex:none}
.hero .display{max-width:16ch}
.hero .display .w{display:inline-block;overflow:hidden;vertical-align:bottom;padding:.12em .32em .4em;margin:-.12em -.32em -.4em}
.hero.settled .display .w{overflow:visible}
.hero .display .w span{display:inline-block;transform:translateY(110%);transition:transform 1.1s var(--ease)}
.hero.in .display .w span{transform:none}
.hero .display .w:nth-child(2) span{transition-delay:.08s}
.hero .display .w:nth-child(3) span{transition-delay:.16s}
.hero .display .w:nth-child(4) span{transition-delay:.24s}
.hero .display .w:nth-child(5) span{transition-delay:.32s}
.hero .display .win{position:relative;display:inline-block;font-style:normal;font-weight:inherit;padding:.08em .18em .08em .06em;margin:-.08em -.18em -.08em -.06em;
  background:linear-gradient(100deg,var(--orange-deep) 0%,var(--orange) 35%,#FF9A5C 50%,var(--orange) 65%,var(--orange-deep) 100%);
  background-size:220% 100%;background-position:var(--g) 50%;
  -webkit-background-clip:text;background-clip:text;color:transparent;animation:sheen 5s ease-in-out infinite}
.hero .display .win svg{position:absolute;left:.04em;right:.16em;bottom:-.22em;width:auto;height:.2em;overflow:visible}
.hero .display .win svg path{fill:none;stroke:var(--orange);stroke-width:5;stroke-linecap:round;stroke-dasharray:420;stroke-dashoffset:420;transition:stroke-dashoffset 1.4s var(--ease) 1s}
.hero.in .display .win svg path{stroke-dashoffset:0}
@keyframes sheen{0%,100%{--g:0%}50%{--g:100%}}
.hero .lead{max-width:30ch}
.hero .cta-stack{display:grid;justify-items:center;gap:14.4px;margin-top:4.8px}
/* WINgs Spotlight note: a small centred pearl card — star on top, copy centred beneath */
.spotlight{
  display:grid;justify-items:center;gap:12px;text-align:center;
  background:linear-gradient(135deg,#FFFFFF 0%,#FCF8F3 50%,#F6EDE3 100%);border:1px solid rgba(242,96,24,.22);border-radius:var(--radius);
  padding:22px clamp(20px,4vw,36px) 24px;max-width:440px;margin-inline:auto;line-height:1.6;
  box-shadow:inset 0 1px 0 #fff,0 20px 44px -30px rgba(90,40,10,.35);
}
.spotlight p{max-width:34ch}
.spotlight .star{flex:none;width:36px;height:36px;box-shadow:0 8px 18px -8px rgba(242,96,24,.7);border-radius:50%;background:var(--orange);display:grid;place-items:center;color:var(--cream)}
.spotlight .star svg{width:16px;height:16px;fill:currentColor}
.spotlight strong{color:var(--orange-deep)}

@media (min-width:761px){.hero .display{margin-bottom:.22em}}

/* countdown: one airy row, no boxes — big serif numerals divided by hairlines */
.countdown{display:grid;justify-items:center;gap:12px;margin-top:8px}
.countdown .cells{display:flex;justify-content:center}
.countdown .cell{display:grid;justify-items:center;gap:6px;padding:2px clamp(16px,3.2vw,40px);border-left:1px solid var(--line)}
.countdown .cell:first-child{border-left:0}
.countdown .num{font-family:var(--font-display);font-size:var(--fs-display);font-weight:600;line-height:1;letter-spacing:-.01em;color:var(--ink);font-variant-numeric:tabular-nums lining-nums}
.countdown .cell:last-child .num{color:var(--orange)}
.countdown .num.tick{animation:tick .7s cubic-bezier(.16,1,.3,1)}
@keyframes tick{from{opacity:.25;transform:translateY(-.12em);filter:blur(2px)}to{opacity:1;transform:none;filter:none}}
.countdown .unit{font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--ink)}
@media (prefers-reduced-motion:reduce){.countdown .num.tick{animation:none}}

/* ---------- Video frames ---------- */
.hero .video-frame .caption{inset:0;justify-content:center;align-items:center;text-align:center}
.hero .video-frame .caption .label{color:var(--cream);font-size:var(--fs-lead);letter-spacing:.3em;gap:17.6px;text-shadow:0 2px 19.2px rgba(26,10,2,.45)}
.hero .video-frame .caption .label::before,.hero .video-frame .caption .label::after{width:clamp(32px,6.4vw,96px);height:2px;background:currentColor;content:""}
.video-frame{
  position:relative;overflow:hidden;background:var(--ink);
  border-radius:var(--radius);aspect-ratio:21/9;isolation:isolate;
  box-shadow:0 48px 96px -40px rgba(199,70,26,.6);
}
.video-frame video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 30%}
.video-frame .tint{position:absolute;inset:0;background:linear-gradient(160deg,rgba(242,96,24,.9),rgba(199,70,26,.7) 55%,rgba(242,96,24,.85));mix-blend-mode:color;z-index:1;opacity:.75}
.video-frame .veil{position:absolute;inset:0;z-index:2;
  background:
    linear-gradient(180deg,rgba(26,10,2,.0) 0%,rgba(26,10,2,.0) 45%,rgba(26,10,2,.7) 100%),
    linear-gradient(120deg,rgba(242,96,24,.28),transparent 55%);
}
.video-frame .grain{position:absolute;inset:0;z-index:3;opacity:.08;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence baseFrequency='.9' numOctaves='2'/></filter><rect width='160' height='160' filter='url(%23n)' opacity='.8'/></svg>")}
.video-frame .caption{position:absolute;left:clamp(16px,3.2vw,38.4px);right:clamp(16px,3.2vw,38.4px);bottom:clamp(16px,3.2vw,35.2px);z-index:4;color:var(--cream);display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap}
.video-frame .caption .display{font-size:var(--fs-lead);font-style:italic;font-weight:600}
.video-frame .caption .label{color:var(--cream)}
.video-frame .sound{
  position:absolute;right:clamp(12.8px,2.4vw,25.6px);top:clamp(12.8px,2.4vw,25.6px);z-index:5;
  width:41.6px;height:41.6px;border-radius:50%;background:rgba(250,240,228,.92);color:var(--orange-deep);
  display:grid;place-items:center;box-shadow:0 8px 24px -8px rgba(0,0,0,.5);transition:transform .4s var(--ease),background .3s;
}
.video-frame .sound:hover{transform:scale(1.08);background:var(--cream)}
.video-frame .sound svg{width:17.6px;height:17.6px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.video-frame .sound .on{display:none}
.video-frame .sound[aria-pressed="true"] .on{display:block}
.video-frame .sound[aria-pressed="true"] .off{display:none}
/* full-bleed hero video fading into the section */
.hero .hero-video{border-radius:0;width:100%;aspect-ratio:21/9;max-height:82vh;min-height:336px;box-shadow:none;background:var(--cream);margin:0;
  /* dissolve the whole frame (video, grain, tint) into the section so no edge shows under the headline */
  -webkit-mask-image:linear-gradient(180deg,#000 72%,transparent 100%);mask-image:linear-gradient(180deg,#000 72%,transparent 100%)}
.hero .hero-video video{object-position:center 40%;will-change:transform} /* JS keeps it fixed while the hero scrolls away */
.hero .hero-video .veil{background:
  linear-gradient(180deg,rgba(250,240,228,0) 0%,rgba(250,240,228,0) 44%,rgba(250,240,228,.06) 48%,rgba(250,240,228,.16) 53%,rgba(250,240,228,.3) 58%,rgba(250,240,228,.46) 63%,rgba(250,240,228,.62) 68%,rgba(250,240,228,.76) 73%,rgba(250,240,228,.87) 79%,rgba(250,240,228,.95) 86%,var(--cream) 93%),
  linear-gradient(180deg,rgba(26,10,2,.82) 0%,rgba(26,10,2,.74) 12%,rgba(26,10,2,.64) 24%,rgba(26,10,2,.55) 34%,rgba(26,10,2,.47) 44%,rgba(26,10,2,.38) 52%,rgba(26,10,2,.29) 60%,rgba(26,10,2,.2) 68%,rgba(26,10,2,.12) 76%,rgba(26,10,2,.05) 84%,rgba(26,10,2,0) 92%),
  linear-gradient(120deg,rgba(242,96,24,.22),transparent 55%)}
.hero .hero-video .tint{opacity:.7}
.hero .hero-video .sound{top:auto;bottom:clamp(22.4px,8vh,96px);right:clamp(16px,3.2vw,38.4px);background:rgba(250,240,228,.7)}
.hero .hero-video .sound{display:none}
.hero .intro{position:relative;z-index:2;margin-top:clamp(-520px,-32vw,-64px)} /* raised so the white logo sits on the darker part of the video */


.band-video{padding:0;background:var(--ink)}
.band-video .video-frame{border-radius:0;aspect-ratio:21/9;max-height:82vh;width:100%;box-shadow:none}
.band-video .video-frame video{object-position:center 35%}
.band-video .veil{background:radial-gradient(ellipse 60% 70% at 50% 55%,rgba(26,10,2,.55),rgba(26,10,2,.15) 70%,rgba(26,10,2,0)),linear-gradient(180deg,rgba(26,10,2,.25),rgba(26,10,2,.0) 30%,rgba(26,10,2,.0) 70%,rgba(26,10,2,.35))}
.band-video .caption{justify-content:center;text-align:center;flex-direction:column;align-items:center;bottom:50%;transform:translateY(50%)}
.band-video .caption .display{font-size:var(--fs-display);font-weight:700;font-style:normal}
.band-video .caption .display em{color:var(--cream);font-style:normal;font-weight:inherit}

/* ---------- Marquee ---------- */
.marquee{background:var(--orange);color:var(--cream);padding-block:14.4px;overflow:hidden;border-block:1px solid rgba(26,10,2,.1)}
.marquee .track{display:flex;gap:0;width:max-content;animation:marquee 32s linear infinite}
.marquee .item{display:inline-flex;align-items:center;gap:.28em;padding-inline:11.2px;font-family:var(--font-display);font-size:var(--fs-lead);font-weight:700;letter-spacing:.02em;white-space:nowrap}
.marquee .item em{font-style:italic;font-weight:500}
.marquee .item .star{width:.72em;height:.72em;background:var(--ink);opacity:.9;margin-left:19.2px;
  clip-path:polygon(50% 0,58% 42%,100% 50%,58% 58%,50% 100%,42% 58%,0 50%,42% 42%)} /* four-pointed star */
@keyframes marquee{to{transform:translateX(-50%)}}

/* ---------- Story section ---------- */
/* story copy: one calm editorial column — drop cap, generous leading, an ornament, then the italic promise centred */
.story .text{max-width:600px;margin:clamp(40px,5.6vw,72px) auto 0;line-height:1.8;color:var(--ink)}
.story .text p+p{margin-top:1.1em}
.story .text strong{color:var(--ink);font-weight:700}
.story .text .open::first-letter{float:left;font-family:var(--font-display);font-weight:700;font-size:var(--fs-display);line-height:.8;margin:.06em .1em 0 0;color:var(--orange)}
.story .text .orn{display:flex;align-items:center;justify-content:center;gap:14px;margin:2.2em auto}
.story .text .orn::before,.story .text .orn::after{content:"";width:56px;height:1px;background:linear-gradient(90deg,rgba(242,96,24,0),rgba(242,96,24,.6))}
.story .text .orn::after{transform:scaleX(-1)}
.story .text .orn i{width:6px;height:6px;border-radius:50%;background:var(--orange);transform:rotate(45deg);border-radius:1px}
.story .text .big{margin-top:1.8em;padding-top:1.6em;border-top:1px solid rgba(242,96,24,.22);text-align:center;font-family:var(--font-display);font-size:var(--fs-lead);font-style:italic;font-weight:600;color:var(--orange);line-height:1.45}
/* ---------- Story: pinned card + typed copy (main.js drives both) ---------- */
.mbr{display:none}
.section.story{overflow:clip} /* clip (not hidden) so the sticky card can pin */
/* The pinned block (title + pill) sticks centred on screen; JS sets its top and the pin length */
.poem-pin{position:relative}
.poem-pin.shrinking{transition:height 1s cubic-bezier(.65,0,.35,1) 1.1s} /* same timing as the title fold */
.poem-stick{position:sticky;top:var(--stick-top,15vh)}
/* The pill: an ink copy of the line sits on the page; above it an orange plate (with its own cream/ink copy)
   is clipped by a circle. Closing shrinks the circle to nothing, so letters turn ink as the plate leaves them. */
.poem{position:relative;width:fit-content;max-width:100%;margin:clamp(28px,4vw,48px) auto 0;border-radius:999px;text-align:center}
/* the shadow lives on a wrapper as a drop-shadow, so it follows the plate's shrinking circle instead of outlining an empty pill */
.poem .plate-wrap{position:absolute;inset:0;z-index:1;border-radius:inherit;filter:drop-shadow(0 24px 30px rgba(120,38,8,.28))}
.poem .plate{position:absolute;inset:0;border-radius:inherit;overflow:hidden;isolation:isolate;
  background:linear-gradient(128deg,#F6793A 0%,var(--orange) 32%,#EC5A16 58%,#D94E16 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28),inset 0 -1px 0 rgba(90,25,0,.18);
  clip-path:circle(75% at 50% 50%);transition:clip-path 1.5s cubic-bezier(.65,0,.35,1)}
.poem .plate .line{position:absolute;inset:0;z-index:1}
.poem.closed .plate{clip-path:circle(0% at 50% 50%)}
.poem .line{display:flex;justify-content:center;align-items:center;gap:.24em;white-space:nowrap;
  padding:clamp(18px,2.6vw,30px) clamp(26px,4vw,52px);
  font-family:var(--font-display);font-size:calc(var(--fs-display) * var(--k,1));line-height:1.12;font-weight:700;letter-spacing:-.02em;color:var(--ink)}
.poem .plate .line .ph{color:var(--cream)}
/* closing: "Every" takes the same italic as the rest of the line so the sentence reads as one title */
.poem.final .ev{font-style:italic;font-weight:500}
/* after the plate has shrunk away, the section title dissolves (blur + fade) and folds shut;
   the sentence rises into its place and the copy below follows close beneath it */
.title-fold{display:grid;grid-template-rows:1fr;transition:grid-template-rows 1s cubic-bezier(.65,0,.35,1),opacity .7s ease,filter .7s ease,transform 1s cubic-bezier(.65,0,.35,1)}
.title-fold>.center{min-height:0;overflow:hidden}
.poem{opacity:0;transform:translateY(22px) scale(.96);filter:blur(8px);
  transition:margin 1s cubic-bezier(.65,0,.35,1),opacity 1s cubic-bezier(.16,1,.3,1) .9s,transform 1.2s cubic-bezier(.16,1,.3,1) .9s,filter 1s cubic-bezier(.16,1,.3,1) .9s}
.poem.in{opacity:1;transform:none;filter:none} /* .9s delay: the title above lands first */
.poem .line{transition:font-size .8s cubic-bezier(.65,0,.35,1),padding 1s cubic-bezier(.65,0,.35,1)}
.poem-stick.done .title-fold{grid-template-rows:0fr;opacity:0;filter:blur(14px);transform:translateY(-18px) scale(.98);
  transition-delay:1.1s,1.1s,1.1s,1.1s}
/* closing line: the pill rises to the centre of the screen (in place of the faded title); once the title folds shut it no longer needs the lift */
.poem{translate:0 0}
.poem-stick .poem{transition:margin 1s cubic-bezier(.65,0,.35,1),opacity 1s cubic-bezier(.16,1,.3,1) .9s,transform 1.2s cubic-bezier(.16,1,.3,1) .9s,filter 1s cubic-bezier(.16,1,.3,1) .9s,translate .8s cubic-bezier(.45,0,.2,1)}
.poem-stick.ending:not(.done) .poem{translate:0 calc(var(--lift,0px) * -1)}
.poem-stick.done .poem{transition-delay:1.1s,0s,0s,0s,1.1s;transition-duration:1s,1s,1.2s,1s,1s}
/* the title already dissolves in place as the closing line arrives, so it is gone before the pill shrinks */
.poem-stick.ending:not(.done) .title-fold{opacity:0;filter:blur(14px);transform:translateY(-18px) scale(.98);transition-delay:0s,.15s,.15s,.15s;transition-duration:1s,.6s,.6s,.8s}
.poem-stick.done .poem{margin-top:0;transition-delay:1.1s,0s,0s,0s,1.1s}
.poem-stick.done .poem .line{padding-block:0;transition-delay:0s,1.1s}
@media (prefers-reduced-motion:reduce){.poem-stick.done .title-fold{grid-template-rows:1fr;opacity:1;filter:none;transform:none}}
/* phrase stack: the box eases to each phrase's width (in em, so it follows the line size); phrases rise in from a blur */
.poem .rot{display:block;position:relative;height:1.12em;overflow:clip;overflow-clip-margin:.28em;transition:width .7s cubic-bezier(.65,0,.35,1)}
.poem .ph{position:absolute;left:0;top:0;font-style:italic;font-weight:500;opacity:0;transform:translateY(.45em);filter:blur(8px);
  transition:opacity .8s cubic-bezier(.16,1,.3,1),transform 1s cubic-bezier(.16,1,.3,1),filter .8s cubic-bezier(.16,1,.3,1)}
.poem .ph:not(.on):not(.out){visibility:hidden}
.poem .ph.on{opacity:1;transform:none;filter:none;transition-delay:.45s} /* lands once the pill has mostly resized */
.poem .ph.out{opacity:0;transform:translateY(-.4em);filter:blur(8px);transition-duration:.6s;transition-delay:0s}
.story .text{margin-top:clamp(40px,5vw,64px)}
.sr-only{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* typing: letters are laid out from the start (no reflow) and fade in one by one behind a thin orange caret */
.story .typing .wd{white-space:nowrap}
.story .typing .ch{opacity:0;transition:opacity .35s ease}
.story .typing .ch.on{opacity:1}
.story .caret{display:inline-block;width:2px;height:1.05em;margin:0 -2px -.15em 0;background:var(--orange);animation:caret .9s steps(1) infinite}
@keyframes caret{50%{opacity:0}}
@media (prefers-reduced-motion:reduce){.poem-pin{height:auto!important}.poem-stick{position:static}}
.story .pull{
  position:relative;margin-top:clamp(44.8px,6.4vw,88px);text-align:center;
  font-family:var(--font-display);font-size:var(--fs-display);font-weight:700;letter-spacing:-.02em;line-height:1.1;
}
.story .pull em{color:var(--orange);font-style:normal;font-weight:inherit}
.story .pull .ul{display:inline-block;position:relative}
.story .pull .ul::after{content:"";position:absolute;left:0;right:0;bottom:-.04em;height:.06em;background:var(--orange);transform:scaleX(0);transform-origin:left;transition:transform 1.2s var(--ease) .3s}
.story .pull.in .ul::after{transform:scaleX(1)}

/* ---------- Evening section (dark) ---------- */
.evening .head{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(22.4px,4vw,64px);align-items:end}
.evening .head .lead{color:var(--cream)}
.evening .list{margin-top:clamp(38.4px,5.6vw,76.8px);border-top:1px solid var(--line-dark)}
.evening .row{
  display:grid;grid-template-columns:72px 1fr;gap:clamp(12.8px,2.4vw,38.4px);
  padding:clamp(17.6px,2.4vw,27.2px) 0;
  background:linear-gradient(var(--line-dark),var(--line-dark)) no-repeat left bottom/100% 1px;
  align-items:start;position:relative;
}
/* hover: the row lights up as a warm plate and a diagonal streak sweeps across it once */
.evening .row::before{content:"";position:absolute;left:-12.8px;right:-12.8px;top:0;bottom:0;border-radius:14.4px;z-index:-1;
  background-color:rgba(242,96,24,0);
  background-image:linear-gradient(112deg,transparent 40%,rgba(255,190,140,.08) 45%,rgba(255,224,200,.26) 50%,rgba(255,190,140,.08) 55%,transparent 60%);
  background-size:300% 100%;background-repeat:no-repeat;background-position:100% 0;transition:background-color .5s}
.evening .row:hover::before{background-color:rgba(242,96,24,.12);background-position:0 0;
  transition:background-color .5s,background-position 1.4s cubic-bezier(.45,0,.25,1)}
.evening .num{font-family:var(--font-display);font-size:var(--fs-lead);font-style:italic;color:var(--orange);font-weight:500;line-height:1.3}
.evening .row p{color:var(--white)}
.evening .row p strong{color:var(--orange);display:block;font-family:var(--font-display);font-size:var(--fs-lead);font-weight:600;line-height:1.3;margin-bottom:.35em}
/* rows reveal one after another (JS sets --d per row) with a single soft shine across each title;
   afterwards a quiet glint runs along the dividers now and then, row after row, so it travels diagonally down the list */
/* entrance: the divider draws itself left → right, the number settles, then the copy rises out of a soft blur */
.evening .row.reveal{opacity:1;transform:none;background-size:0% 1px;transition:background-size 1.8s cubic-bezier(.65,0,.35,1) var(--d,0s)}
.evening .row.reveal.in{background-size:100% 1px}
.evening .row.reveal .num,.evening .row.reveal p{opacity:0;transform:translateY(22px);filter:blur(8px);
  transition:opacity 1.4s cubic-bezier(.16,1,.3,1),transform 1.6s cubic-bezier(.16,1,.3,1),filter 1.4s cubic-bezier(.16,1,.3,1)}
.evening .row.reveal .num{transform:translateY(10px);transition-delay:calc(var(--d,0s) + .15s)}
.evening .row.reveal p{transition-delay:calc(var(--d,0s) + .3s)}
.evening .row.reveal.in .num,.evening .row.reveal.in p{opacity:1;transform:none;filter:none}
@media (prefers-reduced-motion:reduce){.evening .row.reveal .num,.evening .row.reveal p{opacity:1;transform:none;filter:none}.evening .row.reveal{background-size:100% 1px}}
.evening .row .num,.evening .row p strong{
  background:linear-gradient(112deg,var(--orange) 0 42%,#FFD2B2 50%,var(--orange) 58% 100%);
  background-size:300% 100%;background-position:100% 0;-webkit-background-clip:text;background-clip:text;color:transparent}
.evening .row::after{content:"";position:absolute;bottom:-1px;left:-28%;width:28%;height:1px;pointer-events:none;opacity:0;
  background:linear-gradient(90deg,rgba(255,200,160,0),rgba(255,226,204,.8),rgba(255,200,160,0))}
@keyframes textshine{from{background-position:100% 0}to{background-position:0 0}}
@keyframes lineglint{0%{left:-28%;opacity:0}3%{opacity:1}17%{opacity:1}20%,100%{left:100%;opacity:0}}
.evening .row.in p strong{animation:textshine 2s cubic-bezier(.45,0,.25,1) calc(var(--d,0s) + 1.1s) backwards}
/* the lettering catches the same streak as it passes over (number first, then the title) */
.evening .row.in:hover .num{background-position:0 0;transition:background-position 1.1s cubic-bezier(.45,0,.25,1) .05s}
.evening .row.in:hover p strong{background-position:0 0;transition:background-position 1.3s cubic-bezier(.45,0,.25,1) .2s}
.evening .row.in::after{animation:lineglint 11s cubic-bezier(.45,0,.25,1) calc(4s + var(--d,0s) * .5) infinite}
@media (prefers-reduced-motion:reduce){.evening .row p strong,.evening .row::after{animation:none!important}}
.evening .more{margin-top:clamp(28.8px,4vw,51.2px);font-family:var(--font-display);font-style:italic;font-size:var(--fs-lead);color:var(--orange);font-weight:500}

/* ---------- Secret section ---------- */

.secret .cards{display:grid;grid-template-columns:1fr 1fr;gap:clamp(14.4px,2.4vw,25.6px);margin-top:clamp(32px,4.8vw,57.6px)}
.card{
  position:relative;border-radius:var(--radius);padding:clamp(22.4px,3.2vw,38.4px);
  background:linear-gradient(135deg,#FFFFFF 0%,#FCF8F3 48%,#F5ECE2 100%);border:1px solid rgba(242,96,24,.22);
  box-shadow:inset 0 1px 0 #fff;
  display:flex;flex-direction:column;overflow:hidden;isolation:isolate;
  transition:transform .8s var(--ease),box-shadow .8s var(--ease);
}
.card>*{position:relative;z-index:1}
.card:hover{transform:translateY(-3.2px);box-shadow:inset 0 1px 0 #fff,0 28px 56px -36px rgba(90,40,10,.35)}
/* on light plates the streak needs warm, slightly darker flanks to read as polished metal */
.card::after,.step::after{background:
    linear-gradient(112deg,transparent 38%,rgba(190,110,50,.07) 44%,rgba(190,110,50,.12) 47.5%,rgba(255,255,255,.95) 50%,rgba(190,110,50,.12) 52.5%,rgba(190,110,50,.07) 56%,transparent 62%),
    linear-gradient(112deg,transparent 28%,rgba(242,160,100,.08) 50%,transparent 72%);
  background-size:300% 100%;background-repeat:no-repeat;background-position:100% 0}

.card .lock{width:51.2px;height:51.2px;border-radius:16px;background:var(--ink);color:var(--orange);display:grid;place-items:center;margin-bottom:17.6px}
.card .lock svg{width:22.4px;height:22.4px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.card h3{font-family:var(--font-display);font-size:var(--fs-lead);font-weight:700;margin-bottom:.5em;line-height:1.2}
.card .soon{display:inline-flex;align-items:center;gap:8px;margin-top:auto;padding-top:22.4px;color:var(--orange-deep);font-weight:700;letter-spacing:.18em;text-transform:uppercase}
.card .soon i{width:6.4px;height:6.4px;border-radius:50%;background:var(--orange);animation:blink 1.6s infinite}
/* ---------- Journey: "pas cu pas" timeline (horizontal on desktop, vertical on phones) ---------- */
.journey{list-style:none;position:relative;display:grid;grid-template-columns:repeat(5,1fr);margin-top:clamp(40px,5.6vw,72px)}
/* the track draws in as the section enters; an orange fill then follows the scroll (--fill, set by main.js) */
.journey::before,.journey::after{content:"";position:absolute;top:27.5px;left:10%;right:10%;height:1px;transform-origin:left}
.journey::before{background:var(--line);transform:scaleX(0);transition:transform 2.4s cubic-bezier(.65,0,.35,1) .2s}
.journey.in::before{transform:none}
.journey::after{height:2px;margin-top:-.5px;background:linear-gradient(90deg,var(--orange-deep),var(--orange));transform:scaleX(var(--fill,0))}
.jstep{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;padding:0 clamp(8px,1.4vw,18px)}
.jstep .dot{position:relative;z-index:1;width:56px;height:56px;border-radius:50%;display:grid;place-items:center;flex:none;
  background:linear-gradient(135deg,#FFFFFF,#FBF4EC 55%,#F2E4D5);border:1px solid var(--line);color:var(--ink);transition:border-color .5s ease,color .5s ease,box-shadow .5s ease;
  box-shadow:inset 0 1px 0 #fff,0 12px 24px -16px rgba(90,40,10,.45)}
.jstep .dot svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.jstep.now .dot{background:linear-gradient(135deg,#F6793A,var(--orange) 45%,#D94E16);border-color:transparent;color:var(--cream);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 16px 32px -14px rgba(242,96,24,.75);transition:transform .5s var(--ease)}
.jstep.now .dot:hover{transform:scale(1.06)}
.jstep.now .dot::after{content:"";position:absolute;inset:-7px;border-radius:50%;border:1px solid rgba(242,96,24,.5);animation:halo 3.4s cubic-bezier(.16,1,.3,1) 2.6s infinite;opacity:0}
@keyframes halo{0%{transform:scale(.8);opacity:0}15%{opacity:.9}100%{transform:scale(1.45);opacity:0}}
.jstep.gala .dot{background:linear-gradient(135deg,#3A1C0C,var(--ink) 60%);border-color:transparent;color:var(--orange);
  box-shadow:inset 0 0 0 1px rgba(242,96,24,.18),0 12px 24px -14px rgba(26,10,2,.55)} /* no white top highlight on the dark marker */
.jstep.gala .dot svg{fill:currentColor;stroke:none}
/* when the orange fill reaches the gala, its marker pops: a happy little shake, then it settles slightly larger with a warm glow */
.jstep.gala.reached .dot{animation:joyzoom 1s cubic-bezier(.34,1.56,.64,1) forwards}
.jstep.gala.reached .dot svg{animation:joyshake .9s ease-in-out .1s}
@keyframes joyzoom{0%{transform:scale(1)}40%{transform:scale(1.2)}100%{transform:scale(1.08);box-shadow:inset 0 0 0 1px rgba(242,96,24,.35),0 0 0 6px rgba(242,96,24,.14),0 14px 28px -12px rgba(199,70,26,.6)}}
@keyframes joyshake{0%,100%{transform:rotate(0)}15%{transform:rotate(-16deg) scale(1.1)}30%{transform:rotate(13deg) scale(1.15)}45%{transform:rotate(-9deg)}60%{transform:rotate(6deg)}75%{transform:rotate(-3deg)}}
@media (prefers-reduced-motion:reduce){.jstep.gala.reached .dot,.jstep.gala.reached .dot svg{animation:none}}
.jlabel{margin-top:18px;font-weight:700;letter-spacing:.12em;white-space:nowrap;text-transform:uppercase;color:var(--ink);transition:color .5s ease}
.jstep.now .jlabel,.jstep.gala .jlabel,.jstep.reached .jlabel{color:var(--orange-deep)}
/* a step lights up as the orange fill reaches it */
.jstep.reached:not(.now):not(.gala) .dot{border-color:rgba(242,96,24,.7);color:var(--orange);box-shadow:inset 0 1px 0 #fff,0 0 0 4px rgba(242,96,24,.12),0 12px 24px -16px rgba(199,70,26,.55)}
.jstep h3{font-family:var(--font-display);font-size:var(--fs-lead);font-weight:700;line-height:1.2;margin:.45em 0 .4em}
.jstep p{line-height:1.55;color:var(--ink);max-width:24ch}
/* entrance: each step lands as the line reaches it */
.journey .jstep>*{opacity:0;transform:translateY(16px);filter:blur(6px);
  transition:opacity 1.2s cubic-bezier(.16,1,.3,1),transform 1.4s cubic-bezier(.16,1,.3,1),filter 1.2s cubic-bezier(.16,1,.3,1);
  transition-delay:calc(var(--i) * .45s + .35s)}
.journey .jstep .dot{transform:scale(.6)}
.journey .jstep>:nth-child(n+2){transition-delay:calc(var(--i) * .45s + .5s)}
.journey.in .jstep>*{opacity:1;transform:none;filter:none}
.journey.in .jstep.now .dot{transition:opacity 1.2s cubic-bezier(.16,1,.3,1) .35s,transform .5s var(--ease),filter 1.2s .35s}
@media (prefers-reduced-motion:reduce){.journey::before,.journey::after{transform:none}.journey .jstep>*{opacity:1;transform:none;filter:none}.jstep.now .dot::after{animation:none}}
@media (max-width:860px){
  /* phones: a centred column — marker, label, title, text — with a short hairline leading down to the next step */
  .journey{grid-template-columns:1fr;max-width:420px;margin-inline:auto}
  .journey::before,.journey::after{display:none}
  .jstep{display:flex;flex-direction:column;align-items:center;text-align:center;padding:0 8px 84px}
  .jstep:last-of-type{padding-bottom:0} /* last-of-type: the spark and embers are appended after the steps */
  .jlabel{margin-top:16px}
  .jstep p{max-width:30ch}
  .jstep:not(:last-of-type)::after{content:"";position:absolute;left:50%;bottom:18px;width:1px;height:48px;margin-left:-.5px;
    background:linear-gradient(var(--orange-deep),var(--orange)) top/100% calc(var(--seg,0) * 100%) no-repeat,var(--line);
    transform:scaleY(0);transform-origin:top;transition:transform .8s cubic-bezier(.65,0,.35,1) calc(var(--i) * .45s + .9s)}
  .journey.in .jstep::after{transform:none}
}
.secret .cta{display:flex;justify-content:center;margin-top:clamp(32px,4.8vw,51.2px)}

/* ---------- Why section (orange) ---------- */
.why .wrap{text-align:center}
.why .display{margin-inline:auto}
.why .closing{margin-inline:auto}
.step{text-align:center}
.step .bar{margin-inline:auto}
.why .steps{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14.4px,2.4vw,25.6px);margin-top:clamp(32px,4.8vw,57.6px)}
.step{
  background:linear-gradient(135deg,#FDF7F0 0%,var(--cream) 45%,#F1E2D2 100%);color:var(--ink);border-radius:var(--radius);padding:clamp(20.8px,2.8vw,33.6px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8);
  position:relative;overflow:hidden;isolation:isolate;transition:transform .8s var(--ease)
}
.step>*{position:relative;z-index:1}
.step:hover{transform:translateY(-3.2px)}
.step .n{font-family:var(--font-display);font-size:var(--fs-display);line-height:1;color:var(--orange);font-weight:700;font-style:italic;letter-spacing:-.03em}
.step .n small{font-size:var(--fs-body);font-family:var(--font-text);font-style:normal;text-transform:uppercase;letter-spacing:.24em;vertical-align:middle;margin-left:8px;color:var(--ink);font-weight:700}
.step h3{font-family:var(--font-display);font-size:var(--fs-lead);font-weight:700;margin:.6em 0 .4em;line-height:1.25}
.step .bar{height:3.2px;background:var(--orange);width:38.4px;border-radius:2px;margin-bottom:14.4px;transform-origin:left;transition:width .8s var(--ease)}
.step:hover .bar{width:100%}
.why .closing{margin-top:clamp(32px,4vw,44.8px);font-family:var(--font-display);font-size:var(--fs-lead);font-style:italic;font-weight:500;max-width:688px}

/* ---------- Final section (dark) ---------- */
.final{text-align:center}
.final .display{color:var(--cream);max-width:20ch;margin-inline:auto;margin-top:.7em!important;line-height:1.1}
.final .lead{color:var(--cream);max-width:576px;margin-inline:auto;margin-top:1.6em;line-height:1.5}
.final .lead strong{color:var(--orange)}
.final .cta-stack{display:grid;justify-items:center;gap:17.6px;margin-top:clamp(35.2px,4.8vw,57.6px)}
.final .cta-note{color:var(--cream)}

/* ---------- Footer ---------- */
.footer{background:var(--ink);color:var(--cream);padding:32px 0 calc(32px + env(safe-area-inset-bottom));border-top:1px solid var(--line-dark)}
.footer .wrap{display:flex;align-items:center;justify-content:space-between;gap:19.2px;flex-wrap:wrap}
.footer img{height:73.6px}
.footer .meta{display:flex;gap:17.6px;flex-wrap:wrap;align-items:center;font-weight:500}
.footer .meta a:hover{color:var(--orange)}
.footer .meta .sep{width:4px;height:4px;border-radius:50%;background:var(--orange)}

/* ---------- Reveal ---------- */
.reveal{opacity:0;transform:translateY(27.2px);transition:opacity 1s var(--ease),transform 1.1s var(--ease)}
.reveal.in{opacity:1;transform:none}
.reveal.d1{transition-delay:.1s}.reveal.d2{transition-delay:.2s}.reveal.d3{transition-delay:.3s}.reveal.d4{transition-delay:.4s}

/* ---------- Form page (single centred card) ---------- */
.page-center{min-height:100vh;display:grid;place-items:center;padding:clamp(19.2px,3.2vw,38.4px) var(--gutter);position:relative;overflow:hidden;
  background:radial-gradient(ellipse 70% 50% at 50% 0%,rgba(242,96,24,.18),rgba(242,96,24,0) 70%),var(--cream)}
.page-center .rings{opacity:.34}
.form-card .top{display:grid;justify-items:center;text-align:center;gap:4.8px;margin-bottom:3.2px}
.form-card .top img{height:49.6px}
.form-card .top h1{margin:.15em 0 0;max-width:22ch}
.form-card .top p{max-width:40ch}
.form-card .back{position:absolute;left:clamp(12.8px,2.4vw,22.4px);top:clamp(12.8px,2.4vw,19.2px);display:inline-flex;align-items:center;gap:6.4px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--orange-deep);transform:scale(.8);transform-origin:left top}
.form-card .back svg{width:12.8px;height:12.8px;stroke:currentColor;fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.form-card .back:hover{color:var(--ink)}
.form-card{
  position:relative;z-index:1;width:min(448px,100%);background:var(--white);border-radius:var(--radius);
  padding:clamp(27.2px,3.2vw,35.2px) clamp(17.6px,3.2vw,32px) clamp(16px,2.4vw,22.4px);border:1px solid rgba(242,96,24,.25);box-shadow:0 40px 80px -40px rgba(199,70,26,.45);
}
.form-card h1{font-family:var(--font-display);font-size:var(--fs-lead);font-weight:700;line-height:1.2;margin:.5em 0 .3em}
.form-grid{display:grid;gap:8px;margin-top:11.2px}
.form-grid .two{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.field{display:grid;gap:2.4px}
.field label{font-weight:700;letter-spacing:.02em}
.field label span{color:var(--orange-deep);font-weight:500}
.field input{
  font:inherit;color:var(--ink);background:var(--cream);border:2px solid transparent;border-radius:12.8px;
  padding:.62em .95em;width:100%;transition:border-color .3s,background .3s,box-shadow .3s;outline:none;
}
.field input::placeholder{color:var(--muted);opacity:.8}
.field input:focus{border-color:var(--orange);background:var(--white);box-shadow:0 0 0 4px rgba(242,96,24,.15)}
.field input:user-invalid,.field.invalid input{border-color:var(--orange-deep)}
.field .err{color:var(--orange-deep);font-weight:700;display:none}
.field.invalid .err{display:block}
.check{display:flex;gap:9.6px;align-items:flex-start;cursor:pointer;line-height:1.4}
.check input{appearance:none;width:20.8px;height:20.8px;border-radius:6.4px;border:2px solid var(--orange);background:var(--cream);flex:none;margin-top:2px;display:grid;place-items:center;cursor:pointer;transition:background .3s}
.check input::after{content:"";width:9.6px;height:5.6px;border-left:2.4px solid var(--cream);border-bottom:2.4px solid var(--cream);transform:rotate(-45deg) translate(1px,-1px);opacity:0;transition:opacity .2s}
.check input:checked{background:var(--orange)}
.check input:checked::after{opacity:1}
.check span a{color:var(--orange-deep);font-weight:700;text-decoration:underline;text-underline-offset:2.4px}
.form-card .btn{width:100%;justify-content:center;margin-top:3.2px}
.form-card .btn[disabled]{opacity:.7;pointer-events:none}
.form-card .fine{margin-top:8px;text-align:center;font-weight:500}
.form-card .fine strong{color:var(--orange-deep)}
.form-card .counter{display:flex;align-items:center;gap:8px;background:var(--cream);border-radius:9.6px;padding:6.4px 9.6px;font-weight:700;margin-top:6.4px;justify-content:center;text-align:center}
.form-card .counter i{width:8px;height:8px;border-radius:50%;background:var(--orange);animation:blink 1.6s infinite;flex:none}
.form-card .counter b{color:var(--orange-deep)}

/* ---------- Thank you ---------- */
.thanks .ribbon{width:clamp(120px,17.6vw,184px);filter:drop-shadow(0 17.6px 27.2px rgba(242,96,24,.35));animation:pop 1s var(--ease) both,sway 6s ease-in-out 1s infinite;transform-origin:50% 55%}
.thanks .ribbon svg{width:100%;height:auto;display:block}
@keyframes sway{0%,100%{rotate:-2.5deg}50%{rotate:2.5deg}}
.thanks .gown{width:clamp(152px,17.6vw,224px);justify-self:center;filter:drop-shadow(0 16px 24px rgba(0,0,0,.5))}
.thanks .gown svg{width:100%;height:auto;display:block}
/* boxes: centred text, no dash before labels */
.card,.step,.form-card .top{text-align:center}
.card .label::before,.step .label::before,.form-card .top .label::before,.form-card .top .label::after{display:none}
.card .lock{margin-inline:auto}
.card .soon{justify-content:center}
.thanks .name{display:inline-block;background:var(--orange);color:var(--cream);padding:.02em .4em .06em;border-radius:.35em;font-style:normal;box-shadow:0 11.2px 24px -11.2px rgba(242,96,24,.8)}
.thanks .top .display{max-width:none}
.thanks{min-height:100vh;display:grid;align-content:start;position:relative;overflow:hidden;padding:clamp(96px,11.2vw,136px) 0 clamp(64px,8vw,96px)}
.thanks .top{text-align:center;display:grid;justify-items:center;gap:17.6px}
.thanks .top .display{max-width:14ch}
/* ---------- thank-you page: same system as the landing — title / subtitle / body, centred, generous rhythm ---------- */
.thanks .intro{max-width:36ch;margin-inline:auto}
.thanks .next{margin-top:clamp(64px,8vw,104px);text-align:center}
.thanks .next .journey{margin-top:clamp(32px,4vw,52px)}
@media (min-width:861px){ /* three-step variant (thank-you page); below 861px it stacks like the landing journey */
  .journey.three{grid-template-columns:repeat(3,1fr);max-width:880px;margin-inline:auto}
  .journey.three::before,.journey.three::after{left:16.67%;right:16.67%}
}
.dress-card{position:relative;overflow:hidden;isolation:isolate;margin-top:clamp(64px,8vw,104px);
  background:var(--ink);color:var(--cream);border-radius:var(--radius);
  display:grid;grid-template-columns:1fr auto;align-items:center;gap:clamp(24px,4vw,64px);
  padding:clamp(36px,5vw,72px) clamp(28px,6vw,96px)}
.dress-card .pattern{opacity:.08;-webkit-mask-image:none;mask-image:none}
.dress-card .copy{position:relative;z-index:1;display:grid;gap:20px;justify-items:start}
.dress-card .label{color:var(--orange)}
.dress-card .display{color:var(--cream);max-width:13ch;margin:0}
.dress-card .gown{position:relative;z-index:1;width:clamp(152px,17.6vw,224px);filter:drop-shadow(0 16px 24px rgba(0,0,0,.5))}
.dress-card .gown svg{width:100%;height:auto;display:block}
.thanks .soon{text-align:center;margin-top:clamp(56px,7vw,88px);color:var(--ink);font-weight:500}
.thanks .actions{display:flex;justify-content:center;margin-top:20px}
.thanks .top .display em{color:var(--orange);font-style:normal;font-weight:inherit}
.thanks .badge{width:73.6px;height:73.6px;border-radius:50%;background:var(--orange);display:grid;place-items:center;color:var(--cream);box-shadow:var(--shadow-orange);animation:pop 1s var(--ease) both}
.thanks .badge svg{width:35.2px;height:35.2px;fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.thanks .badge svg path{stroke-dasharray:60;stroke-dashoffset:60;animation:draw 1s var(--ease) .5s forwards}
@keyframes pop{from{transform:scale(.3);opacity:0}to{transform:scale(1);opacity:1}}
@keyframes draw{to{stroke-dashoffset:0}}
.confetti{position:fixed;inset:0;pointer-events:none;z-index:60}

/* ---------- Responsive ---------- */
@media (max-width:1000px){
  .evening .head{grid-template-columns:1fr}
  .why .steps{grid-template-columns:1fr}
}
@media (max-width:760px){
  /* keep text readable on phones after the 80% desktop scale-down */
  :root{--fs-body:.94rem;--fs-lead:1.14rem}
  .secret .cards{grid-template-columns:1fr}
      .evening .row{grid-template-columns:1fr;gap:6.4px}
  /* evening section reads centred on phones */
  .evening .head,.evening .row{text-align:center;justify-items:center}
  /* thank-you page: dress card stacks and centres */
  .dress-card{grid-template-columns:1fr;justify-items:center;text-align:center;padding:40px 22px 32px}
  .dress-card .copy{justify-items:center}
  .dress-card .gown{width:140px}
  .evening .head .display,.evening .head .lead{margin-inline:auto}
  .evening .more{text-align:center}
  .form-grid .two{grid-template-columns:1fr}
  .header .when{letter-spacing:.1em;flex-direction:column;align-items:flex-end;gap:2px;line-height:1.3}
  .header .when i{display:none}
  .hero .date{letter-spacing:.16em}
  .hero .hero-video .sound{bottom:30%}
  /* buttons always stay on one row: tighter padding on phones instead of wrapping */
  .btn.big{padding:1em 1.1em 1em 1.5em;gap:.75em}
  .btn:hover,.btn:focus-visible{letter-spacing:.01em}
  .logo img{height:51.2px}
  .header.scrolled .logo img{height:52px}
  /* Videos: full portrait ratio on phones */
  .video-frame{aspect-ratio:9/16;border-radius:208px 208px var(--radius) var(--radius)}
  .video-frame video{object-position:center center}
  .band-video .video-frame{aspect-ratio:9/16;max-height:none;border-radius:0}
  .video-frame .caption{flex-direction:column;align-items:flex-start;padding-right:57.6px}
  .hero .hero-video{aspect-ratio:9/16;max-height:none;min-height:0;border-radius:0}
  .hero .intro{margin-top:-72px}
  .video-frame .sound{top:auto;bottom:clamp(16px,3.2vw,35.2px)}
  .band-video .caption{align-items:center;text-align:center;padding-right:0;justify-content:center}
  .band-video .caption .label{justify-content:center;text-align:center;white-space:normal}
  .hero .display .w span{transform:none}
  .countdown .cell{padding:2px clamp(12px,4vw,18px)}
  .countdown .unit{letter-spacing:.08em}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  .reveal{opacity:1;transform:none}
  .hero .display .w span{transform:none;opacity:1}
}

/* ---------- Mobile-only refinements ---------- */
@media (max-width:760px){
  /* 1. shorter videos */
  .hero .hero-video{aspect-ratio:1/1}
  .band-video .video-frame{aspect-ratio:4/5}
  .hero .intro{margin-top:-46vw;gap:22px}
  .hero .countdown{margin-top:4px}
  /* calmer hero on phones: spaced capitals read larger than they are, so tighten them and lighten the weight;
     the intro drops to body size so the hero uses just title + body */
  .label{letter-spacing:.2em;font-weight:600}
  .hero .label.pill{padding:.5em 1.2em}
  .hero .date{letter-spacing:.1em;font-weight:600}
  .countdown .unit{letter-spacing:.06em;font-weight:600}
  .hero .lead{font-size:var(--fs-body);line-height:1.6;max-width:34ch}

  /* 2. on load: white logo centred over the hero. Once the hero button has scrolled away (JS adds .show-cta),
        the logo cross-fades into a sticky register bar */
  .header.has-cta{background:transparent;box-shadow:none;padding-block:12px}
  .header.has-cta:not(.show-cta){-webkit-backdrop-filter:none;backdrop-filter:none;pointer-events:none} /* no empty frosted bar before the register bar appears */
  .header.has-cta .when{display:none}
  .header.has-cta .wrap{display:grid;place-items:center;justify-content:center}
  .header.has-cta .wrap>*{grid-area:1/1}
  .header.has-cta .logo{display:none} /* the logo lives in the hero on phones too */
  .header.has-cta .logo img{height:60px}
  .header.has-cta .logo img.light{display:block}
  .header.has-cta .logo img.dark{display:none}
  .header.has-cta.show-cta{background:rgba(250,240,228,.9);backdrop-filter:blur(11.2px);-webkit-backdrop-filter:blur(11.2px);box-shadow:0 1px 0 rgba(26,10,2,.08);padding-block:8px}
  .header.has-cta.show-cta .logo{opacity:0;transform:translateY(-8px);pointer-events:none}
  .header.has-cta .head-cta{opacity:0;transform:translateY(-10px);pointer-events:none;transition:opacity .45s var(--ease),transform .45s var(--ease)}
  .header.has-cta.show-cta .head-cta{opacity:1;transform:none;pointer-events:auto}
  .head-cta{display:inline-flex;white-space:nowrap;padding:.7em 1.1em .7em 1.4em;letter-spacing:.01em}
  .head-cta{background:var(--ink);background-image:none;color:var(--orange);box-shadow:0 8px 19.2px -11.2px rgba(26,10,2,.6);animation:none}
  .head-cta .ic{width:1.9em;height:1.9em;background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.65)}
  .head-cta::before,.head-cta::after{display:none}
  .head-cta:hover,.head-cta:focus-visible{background:var(--ink);color:var(--orange);transform:none;letter-spacing:.01em;box-shadow:0 8px 19.2px -11.2px rgba(26,10,2,.6)}
  .head-cta:hover .ic{background:transparent;color:#fff;transform:none;box-shadow:none}
  .head-cta:active{background:linear-gradient(100deg,var(--orange-deep) 0%,var(--orange) 45%,#FF7E3F 100%);color:var(--cream);transform:scale(.98)}
  .head-cta:active .ic{background:var(--cream);color:var(--orange);border-color:var(--cream)}
  .hero .hero-video .veil{background:linear-gradient(180deg,rgba(26,10,2,.5) 0%,rgba(26,10,2,.2) 13%,rgba(26,10,2,0) 26%),linear-gradient(180deg,rgba(250,240,228,0) 0%,rgba(250,240,228,0) 22%,rgba(250,240,228,.22) 36%,rgba(250,240,228,.55) 48%,rgba(250,240,228,.82) 60%,rgba(250,240,228,.95) 70%,var(--cream) 80%),linear-gradient(120deg,rgba(242,96,24,.22),transparent 55%)}
  .mbr{display:inline}
  /* 4. no dashes beside headlines */
  .label::before,.label::after{display:none!important}
  .label{gap:0}
  /* 5. centred footer */
  .footer .wrap{flex-direction:column;justify-content:center;text-align:center;gap:14.4px}
  .footer .meta{flex-direction:column;justify-content:center;gap:8px}
  .footer .meta .sep{display:none} /* no dots once the rows stack */
}

/* desktop: no dash before these three labels */
@media (min-width:761px){
  .band-video .caption .label::before,
  .story>.wrap>.label::before,
  .evening .head .label::before{display:none}
  .band-video .caption .label,.story>.wrap>.label,.evening .head .label{gap:0}
}
/* story: the orange promise and the closing line wait until the copy above has finished typing */
.reveal.hold{opacity:0;transform:translateY(27px)}
.story .pull.hold .ul::after{transform:scaleX(0)}
/* while the story copy types, the page holds still (JS); keep the scrollbar slot so nothing shifts */
html.typing-lock{scrollbar-gutter:stable}
html.typing-lock body{overflow:hidden} /* on body, not html: it still hands scrolling to the viewport, so the sticky pin is unaffected */
/* very narrow phones: trim the button padding further so the label still fits on one row */
@media (max-width:360px){.btn.big,.btn{padding-left:.95em;padding-right:.55em;gap:.5em}.btn.big .ic{width:2em;height:2em}}
/* ---------- thank-you page: larger header logo, dress-code button, paper-flip card ---------- */
.header.logo-lg .logo img{height:84px}
@media (max-width:760px){.header.logo-lg .logo img{height:58px}}
.thanks .next-cta{display:flex;justify-content:center;margin-top:clamp(28px,3.6vw,44px)}
.thanks .next .journey{margin-top:clamp(48px,6vw,80px)}
/* ---------- dress-code popup: a sheet of paper that rises face down, then turns over and bends like paper ---------- */
html.modal-open body{overflow:hidden}
.paper-modal{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:clamp(16px,4vw,48px)}
.paper-modal[hidden]{display:none}
.pm-backdrop{position:absolute;inset:0;background:rgba(26,10,2,.58);-webkit-backdrop-filter:blur(16px) saturate(1.1);backdrop-filter:blur(16px) saturate(1.1);opacity:0;transition:opacity .8s ease}
.paper-modal.on .pm-backdrop{opacity:1}
/* the sheet slides up from below the screen, a touch tilted like paper caught on air, and eases to rest;
   on close it drops back down, quicker */
.pm-stage{position:relative;width:min(880px,100%);perspective:2400px;opacity:0;transform:translateY(75vh) rotate(-4deg);
  transition:opacity .5s ease,transform .6s cubic-bezier(.55,0,.75,.4)}
.paper-modal.on .pm-stage{opacity:1;transform:none;
  transition:opacity .45s ease,transform 1.3s cubic-bezier(.2,.85,.25,1.04)}
.pm-close{position:absolute;right:0;top:-60px;width:44px;height:44px;border-radius:50%;border:1px solid rgba(250,240,228,.35);background:rgba(250,240,228,.08);
  color:var(--cream);display:grid;place-items:center;cursor:pointer;transition:background .3s,transform .4s var(--ease)}
.pm-close:hover{background:rgba(250,240,228,.18);transform:rotate(90deg)}
.pm-close svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
.pm-shadow{position:absolute;left:8%;right:8%;bottom:-26px;height:46px;border-radius:50%;background:radial-gradient(closest-side,rgba(0,0,0,.45),rgba(0,0,0,0));filter:blur(6px);transform:scaleX(var(--sh,1));opacity:var(--sho,1)}
.paper{position:relative;transform-style:preserve-3d}
.paper .flipwrap{position:absolute;inset:0;transform-style:preserve-3d}
.paper .seg{position:absolute;top:0;height:100%;transform-origin:0 50%;transform-style:preserve-3d}
.paper .f{position:absolute;inset:0;overflow:hidden;-webkit-backface-visibility:hidden;backface-visibility:hidden}
.paper .f.b{transform:rotateY(180deg)}
.paper .slice{position:absolute;top:0;height:100%}
.paper .f .shade{position:absolute;inset:0;pointer-events:none}
.paper .slice>.dress-card,.paper .slice>.paper-back{height:100%;margin:0}
/* the face-down side: light paper with the WIN mark */
.paper-back{position:relative;overflow:hidden;isolation:isolate;display:grid;place-items:center;align-content:center;gap:16px;border-radius:var(--radius);
  background:linear-gradient(135deg,#FFFDF9 0%,#FBF3EA 55%,#F3E5D6 100%);box-shadow:inset 0 0 0 1px var(--line);text-align:center}
.paper-back .pattern{opacity:.1;-webkit-mask-image:none;mask-image:none}
.paper-back>*:not(.pattern){position:relative;z-index:1}
.paper-back img{height:76px;width:auto}
.paper-back .label{color:var(--orange-deep)}
.paper-back .label::before,.paper-back .label::after{display:none}

/* hero note: the first sentence sits on its own row */
.ticket-note strong{display:block}
/* ---------- landing (desktop): the white logo opens the hero; the header bar — larger logo + date — appears once it has scrolled away ---------- */
/* the white mark reads because the top of the hero video is deeper (see the hero veil), not from a halo of its own */
.hero-mark{position:relative;display:inline-block;margin-bottom:clamp(22px,3.6vw,56px)} /* the logo stays up in the dark part of the video */
.hero-logo{display:block;height:clamp(150px,14vw,200px);width:auto;filter:drop-shadow(0 6px 24px rgba(26,10,2,.3))}
@media (min-width:761px){
  .header.has-cta .logo,.header.has-cta .when{transition:opacity .5s ease,transform .5s var(--ease)}
  .header.has-cta:not(.past-hero){background:transparent;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}
  .header.has-cta:not(.past-hero) .logo,.header.has-cta:not(.past-hero) .when{opacity:0;transform:translateY(-8px);pointer-events:none}
  .header.has-cta.past-hero{padding-block:12px;background:rgba(250,240,228,.88);-webkit-backdrop-filter:blur(11.2px);backdrop-filter:blur(11.2px);box-shadow:0 1px 0 rgba(242,96,24,.14)}
  .header.has-cta.past-hero .logo img{height:84px}
  .header.has-cta.past-hero .logo img.light{display:none}
  .header.has-cta.past-hero .logo img.dark{display:block}
}

/* "pas cu pas" (desktop): the section holds still, centred, while the fill runs to the gala (JS adds .pinned + scroll room) */
.section.secret.pinned{overflow:clip}
.section.secret.pinned>.wrap{position:sticky;top:var(--pin-top,15vh)}
/* timeline spark: a bright point at the head of the orange fill, a faint twinkle, a few embers shed as it travels */
.journey .spark{position:absolute;top:27.5px;left:0;width:10px;height:10px;margin:-5px 0 0 -5px;border-radius:50%;z-index:1;pointer-events:none;
  background:#FFF4EA;box-shadow:0 0 0 2px rgba(255,180,130,.6),0 0 12px 4px rgba(242,96,24,.85),0 0 34px 10px rgba(242,96,24,.35);
  opacity:0;transform:scale(.4);transition:opacity .35s ease,transform .35s var(--ease)}
.journey .spark.on{opacity:1;transform:none}
.journey .spark.on.rest{transform:scale(.72)} /* paused: a touch smaller, still alive */
.journey .spark::before,.journey .spark::after{content:"";position:absolute;left:50%;top:50%;width:30px;height:1px;margin:-.5px 0 0 -15px;
  background:linear-gradient(90deg,rgba(255,244,234,0),#FFF4EA 50%,rgba(255,244,234,0));animation:twinkle 1.1s ease-in-out infinite}
.journey .spark::after{transform:rotate(90deg);animation-delay:-.55s}
@keyframes twinkle{0%,100%{opacity:.25;scale:.6}50%{opacity:1;scale:1}}
.journey .ember{position:absolute;top:27.5px;width:3.5px;height:3.5px;margin:-1.75px 0 0 -1.75px;border-radius:50%;z-index:1;pointer-events:none;
  background:var(--orange);box-shadow:0 0 6px 1px rgba(242,96,24,.7);animation:emberfly .75s cubic-bezier(.16,1,.3,1) forwards}
.journey .ember.cream{background:#FFF4EA;box-shadow:0 0 6px 1px rgba(255,200,160,.8)}
@keyframes emberfly{from{opacity:1;transform:translate(0,0) scale(1)}to{opacity:0;transform:translate(var(--dx),var(--dy)) scale(.3)}}
/* a marker zooms for a moment as the fill passes it */
.jstep.pop .dot{animation:steppop .65s cubic-bezier(.34,1.56,.64,1)}
@keyframes steppop{0%{transform:scale(1)}40%{transform:scale(1.2)}100%{transform:scale(1)}}
@media (prefers-reduced-motion:reduce){.journey .spark,.journey .ember{display:none}.jstep.pop .dot{animation:none}}
.journey .ember.soft{width:2.5px;height:2.5px;margin:-1.25px 0 0 -1.25px;animation-duration:.9s}
/* layering on the timeline: line < spark & embers < markers */
.journey::after{z-index:0}
.jstep .dot{z-index:2}
/* passed steps unlock: the padlock's shackle springs up and tilts open (it closes again if the fill goes back) */
.jstep:not(.now):not(.gala) .dot svg path{transform-box:fill-box;transform-origin:0% 100%;transition:transform .55s cubic-bezier(.34,1.56,.64,1)}
.jstep.reached:not(.now):not(.gala) .dot svg path{transform:rotate(-30deg)} /* pivots on its left leg, which stays in the lock */
.jstep .dot svg{overflow:visible} /* let the open shackle draw outside the icon box instead of being cropped */
/* after the timeline reaches the gala, the sign-up button nudges: two soft pulses, a slight wiggle, a warm glow */
.secret .cta.nudge{animation:ctanudge 1.7s cubic-bezier(.34,1.56,.64,1)}
.secret .cta.nudge .btn::after{animation:ctaglow 1.7s ease-out}
@keyframes ctanudge{0%{transform:none}12%{transform:scale(1.07) rotate(-1.4deg)}24%{transform:scale(1.07) rotate(1.4deg)}36%{transform:scale(1.04) rotate(-.6deg)}50%{transform:none}66%{transform:scale(1.05)}82%,100%{transform:none}}
@keyframes ctaglow{0%{opacity:0;transform:scale(.9)}20%{opacity:1;transform:scale(1.12)}55%{opacity:.6;transform:scale(1.04)}70%{opacity:1;transform:scale(1.1)}100%{opacity:0;transform:scale(1)}}
@media (prefers-reduced-motion:reduce){.secret .cta.nudge,.secret .cta.nudge .btn::after{animation:none}}
/* ---------- phones & tablets (touch): lighter rendering. iPhone Safari can paint the page black when heavy effects stack
   on a playing video (colour blend + mask + big blur filters), so touch devices get equivalent, cheaper versions ---------- */
@media (hover:none),(max-width:760px){
  /* soft glows: gradients instead of a large blur filter */
  .hero::before,.hero::after,.final::before,.secret::before,.story::before{filter:none;background:radial-gradient(closest-side,rgba(242,96,24,.16),rgba(242,96,24,0))!important}
  /* video colouring: a filter on the video itself instead of a colour-blend layer over it */
  .video-frame .tint{display:none}
  .video-frame video{filter:sepia(.55) saturate(1.5) hue-rotate(-10deg) brightness(.96)}
  /* no mask on the hero frame: the cream fade in the veil already dissolves it */
  .hero .hero-video{-webkit-mask-image:none;mask-image:none}
  .hero .label.pill{-webkit-backdrop-filter:none;backdrop-filter:none;background:rgba(255,255,255,.8)}
  .hero .hero-video video{will-change:auto}
}
/* phones: the white logo opens the hero (as on desktop), larger, on a deeper top fade */
@media (max-width:760px){
  .hero .intro{margin-top:-82vw}
  .hero-logo{height:118px}
  .hero-mark{margin-bottom:10px}
  .hero .hero-video .veil{background:
    linear-gradient(180deg,rgba(250,240,228,0) 0%,rgba(250,240,228,0) 40%,rgba(250,240,228,.12) 46%,rgba(250,240,228,.34) 53%,rgba(250,240,228,.6) 60%,rgba(250,240,228,.82) 67%,rgba(250,240,228,.95) 73%,var(--cream) 79%), /* the fade completes higher, so hard edges in the footage (screens, tables) never show as a line behind the title */
    linear-gradient(180deg,rgba(26,10,2,.62) 0%,rgba(26,10,2,.5) 18%,rgba(26,10,2,.42) 32%,rgba(26,10,2,.32) 44%,rgba(26,10,2,.18) 56%,rgba(26,10,2,.07) 68%,rgba(26,10,2,0) 80%),
    linear-gradient(120deg,rgba(242,96,24,.22),transparent 55%)}
}
/* hero (all sizes): one title size + body; calmer capitals, intro at body size on a wider measure, note joined to it */
.hero .label.pill{letter-spacing:.2em;font-weight:600}
.hero .date{letter-spacing:.12em;font-weight:600}
.countdown .unit{letter-spacing:.1em;font-weight:600}
.hero .lead{font-size:var(--fs-body);line-height:1.65;max-width:58ch}
.hero .intro>p.narrow:not(.lead){max-width:58ch}
@media (min-width:761px){.spotlight{max-width:600px}.spotlight p{max-width:52ch}} /* matches the wider intro column */
/* phones: the story copy reads centred; the drop cap becomes an inline orange serif initial */
@media (max-width:760px){
  .story .text{text-align:center}
  .story .text .open::first-letter{float:none;font-family:inherit;font-weight:inherit;font-size:inherit;line-height:inherit;margin:0;color:var(--orange)}
}

/* failsafe: if a script fails (or never finishes) on some phone, show everything plainly instead of leaving it hidden */
html.safe .reveal,html.safe .reveal.hold,html.safe .poem,html.safe .pull,html.safe .story .text *,html.safe .evening .row.reveal .num,html.safe .evening .row.reveal p{opacity:1!important;transform:none!important;filter:none!important;visibility:visible!important}
html.safe body,html.safe.typing-lock body{overflow:visible!important}

/* diagnostic lite mode (?lite=1): no video, no textures, no motion */
html.lite video,html.lite .pattern,html.lite .grain{display:none!important}
html.lite *,html.lite *::before,html.lite *::after{animation:none!important;transition:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;filter:none!important}
html.lite .reveal,html.lite .reveal.hold{opacity:1!important;transform:none!important}

/* the opening sentence of the story carries the accent colour */
.story .text .open .lede{color:var(--orange)}

/* story: a fine-line icon for each phrase, drawn above the label once the section holds (space is reserved, so nothing shifts) */
.poem-icons{position:relative;display:block;margin:0 auto clamp(16px,1.8vw,26px);width:clamp(78px,7vw,108px);aspect-ratio:1;pointer-events:none;opacity:0;transition:opacity .7s var(--ease)}
.poem-stick.icons:not(.done) .poem-icons{opacity:1;transition-delay:.1s}
.poem-icons .pi{position:absolute;inset:0;width:100%;height:100%;overflow:visible;fill:none;stroke:var(--orange);stroke-width:1;stroke-linecap:round;stroke-linejoin:round;
  opacity:0;scale:.92;transition:opacity .45s ease,scale .6s var(--ease)}
.poem-icons .pi *{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset .4s ease}
.poem-stick.icons .poem-icons .pi.on{opacity:1;scale:1;transition:opacity .35s ease .05s,scale .8s var(--ease) .05s}
.poem-stick.icons .poem-icons .pi.on *{stroke-dashoffset:0;transition:stroke-dashoffset .75s cubic-bezier(.65,0,.35,1) .1s}
.poem-stick.icons .poem-icons .pi.on *+*{transition-delay:.25s}
@media (prefers-reduced-motion:reduce){.poem-icons .pi *{stroke-dashoffset:0!important}}

/* story pacing: a brief rest while a phrase and its icon finish forming */
html.story-brake{scrollbar-gutter:stable}
html.story-brake body{overflow:hidden}

/* thank-you page: the dark logo opens the page (no header bar); date + place sit under the intro */
.thanks{padding-top:clamp(48px,6vw,88px)}
.thanks-logo{display:block;margin-bottom:clamp(8px,1.2vw,16px);animation:pop 1s var(--ease) both}
.thanks-logo img{display:block;height:clamp(120px,11vw,160px);width:auto}
.thanks .date{display:inline-flex;align-items:center;gap:.9em;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--ink)}
.thanks .date i{width:5px;height:5px;border-radius:50%;background:var(--orange);flex:none}
.thanks .label.pill{border:1.5px solid rgba(242,96,24,.45);border-radius:999px;padding:.55em 1.3em;background:rgba(255,255,255,.55);gap:9.6px;letter-spacing:.2em;font-weight:600}
.thanks .label.pill::before,.thanks .label.pill::after{width:14.4px}
.thanks .next{margin-top:clamp(36px,4.4vw,56px)}

/* dress popup performance: strips skip the gown's drop-shadow (drawn once on the flat card instead); phones skip the live blur */
.paper .seg .gown{filter:none}
.paper .seg,.paper .flipwrap{will-change:transform}
.paper .flat,.paper .flat>.dress-card{height:100%;margin:0}
@media (max-width:760px){
  .pm-backdrop{-webkit-backdrop-filter:none;backdrop-filter:none;background:rgba(26,10,2,.82)}
}

/* the spark riding each stroke's tip: a short bright dash moving with the draw (same duration and curve), fading at the end */
.poem-icons .pi .spk{stroke:#FFF6EC;stroke-width:1.5;stroke-dasharray:.02 2;stroke-dashoffset:.02;opacity:0;transition:none}
.poem-stick.icons .poem-icons .pi.on .spk{animation:pispark .75s cubic-bezier(.65,0,.35,1) both,pisparkfade 1s ease-in-out both;transition:none}
@keyframes pispark{from{stroke-dashoffset:.02}to{stroke-dashoffset:-.98}}
@keyframes pisparkfade{0%{opacity:0}30%{opacity:.7}55%{opacity:.7}100%{opacity:0}} /* ignites softly, glows, then goes out just after the stroke completes */
@media (prefers-reduced-motion:reduce){.poem-icons .pi .spk{display:none}}

/* closing line: the pill opens and the sentence lands in one quick, fluid move while centred (nothing waits on anything) */
.poem.final .rot{transition:width .55s cubic-bezier(.22,1,.36,1)}
.poem.final .line{transition:font-size .55s cubic-bezier(.22,1,.36,1),padding 1s cubic-bezier(.65,0,.35,1)}
.poem.final .ph.on{transition-delay:.1s;transition-duration:.5s,.6s,.5s}

/* the icon's space above "Povestea" only matters once the section holds; before that the title sits close under the strip */
.poem-pin{margin-top:calc(-1 * (clamp(78px,7vw,108px) + clamp(16px,1.8vw,26px)) - 30px)}

/* phones: the hero frame itself dissolves into the page (as on desktop) instead of painting cream over the video —
   no seam where the frame ends, nothing of the video or grain can peek out, and the glow behind stays continuous */
@media (max-width:760px){
  .hero .hero-video{background:transparent;-webkit-mask-image:linear-gradient(180deg,#000 0%,#000 46%,rgba(0,0,0,.72) 56%,rgba(0,0,0,.38) 65%,rgba(0,0,0,.12) 73%,transparent 80%);mask-image:linear-gradient(180deg,#000 0%,#000 46%,rgba(0,0,0,.72) 56%,rgba(0,0,0,.38) 65%,rgba(0,0,0,.12) 73%,transparent 80%)}
  .hero .hero-video .veil{background:
    linear-gradient(180deg,rgba(250,240,228,0) 0%,rgba(250,240,228,0) 38%,rgba(250,240,228,.25) 50%,rgba(250,240,228,.5) 62%,rgba(250,240,228,.7) 75%),
    linear-gradient(180deg,rgba(26,10,2,.62) 0%,rgba(26,10,2,.5) 18%,rgba(26,10,2,.42) 32%,rgba(26,10,2,.32) 44%,rgba(26,10,2,.18) 56%,rgba(26,10,2,.07) 68%,rgba(26,10,2,0) 80%),
    linear-gradient(120deg,rgba(242,96,24,.22),transparent 55%)}
}

/* the gala marker: WINgs. When reached, the wings give one graceful beat (up, a softer second lift, settle)
   (the left wing is a mirrored copy, so one animation drives both; the box is centred on the wings' own bounds) */
.jstep.gala .dot svg.wings{width:36px;height:36px;overflow:visible}
.jstep.gala .wings .w{transform-box:view-box;transform-origin:12.9px 13.2px}
.jstep.gala.reached .dot svg.wings{animation:none}
.jstep.gala.reached .wings .w{animation:flap 1.7s cubic-bezier(.45,0,.3,1) .4s both}
@keyframes flap{0%{rotate:0deg}22%{rotate:-26deg}42%{rotate:5deg}62%{rotate:-11deg}80%{rotate:2deg}100%{rotate:0deg}}
@media (prefers-reduced-motion:reduce){.jstep.gala.reached .wings .w{animation:none}}

/* desktop: tighter still between sections */
@media (min-width:761px){.section:not(.hero):not(.band-video){padding-block:clamp(50px,4.8vw,68px)}} /* the hero and the video band stay flush */


/* =========================================================
   Gala WINgs 2026 — ticket landing (v300): the same system, extended.
   Hero (taller video, embers), story pacing, evening moments, dress row with gown,
   fading video band, sticky trophy awards, cheerful gallery + carousel, cropped reels,
   ticket tiers, partner gains / levels / ladder / call, sticky FAQ venue, grand finale,
   form choices, thank-you pages.
   ========================================================= */
.dbr{display:inline}
@media (max-width:760px){.dbr{display:none}}
.section .cta{display:flex;justify-content:center;margin-top:clamp(32px,4.8vw,51.2px)}
.small-note{font-weight:500;color:var(--ink);max-width:46ch;text-align:center;margin-inline:auto}
.on-dark .small-note{color:var(--cream)}
.intro-copy{max-width:62ch;margin:1.4em auto 0;line-height:1.7}
.closing-line{margin:clamp(32px,4vw,48px) auto 0;max-width:36ch;text-align:center;font-family:var(--font-display);font-size:var(--fs-lead);font-weight:600;line-height:1.4}
.closing-line em{display:block;font-style:italic;font-weight:500;color:var(--orange)}
.on-dark .closing-line{color:var(--cream)}
/* a title that must sit on one line: it scales with the viewport (never past the title size) and may use the full page width */
.one-row{white-space:nowrap;font-size:min(var(--fs-display),calc(var(--fit,4) * 1vw));width:100vw;max-width:100vw;margin-left:calc(50% - 50vw);padding-inline:var(--gutter)}
@media (max-width:760px){.one-row{white-space:normal;font-size:var(--fs-display);width:auto;margin-left:0;padding-inline:0}}
/* fine-line icons drawn in once their card is revealed */
.mi svg,.gi svg,.ri svg,.t-icon svg{fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;overflow:visible}
.mi svg *,.gi svg *,.ri svg *,.t-icon svg *{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.2s cubic-bezier(.65,0,.35,1) calc(var(--k,0) * .1s + .35s)}
.in .mi svg *,.in .gi svg *,.in .ri svg *,.in .t-icon svg *,.in.moment .mi svg *{stroke-dashoffset:0}
html.safe .mi svg *,html.safe .gi svg *,html.safe .ri svg *,html.safe .t-icon svg *{stroke-dashoffset:0}
@media (prefers-reduced-motion:reduce){.mi svg *,.gi svg *,.ri svg *,.t-icon svg *{stroke-dashoffset:0}}
.orn{display:flex;align-items:center;justify-content:center;gap:14px;margin:2em auto}
.orn::before,.orn::after{content:"";width:56px;height:1px;background:linear-gradient(90deg,rgba(242,96,24,0),rgba(242,96,24,.6))}
.orn::after{transform:scaleX(-1)}
.orn i{width:6px;height:6px;background:var(--orange);transform:rotate(45deg);border-radius:1px}

/* ---------- embers: small warm lights drifting upwards ---------- */
.motes{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden}
.motes i{position:absolute;bottom:-12px;border-radius:50%;background:#FFC9A0;box-shadow:0 0 10px 2px rgba(242,96,24,.55);opacity:0;animation:moterise 13s linear infinite}
@keyframes moterise{0%{transform:translate(0,0);opacity:0}12%{opacity:.85}80%{opacity:.55}100%{transform:translate(var(--dx,0),-95vh);opacity:0}}
@media (prefers-reduced-motion:reduce){.motes{display:none}}
html.lite .motes{display:none}

/* ---------- 1 · Hero: a taller video, more air between the lines, gentle life ---------- */
.hero.tall{--vh-h:clamp(620px,100vh,1000px)}
.hero.tall .hero-video{aspect-ratio:auto;height:var(--vh-h);max-height:none;min-height:0}
.hero.tall .hero-video video{animation:kenburns 24s ease-in-out infinite alternate;transform-origin:50% 40%}
@keyframes kenburns{from{scale:1}to{scale:1.09}}
@media (prefers-reduced-motion:reduce){.hero.tall .hero-video video{animation:none}}
.hero.tall .intro{margin-top:calc(var(--vh-h) * -.76);gap:26px}
.hero.tall .hero-mark{margin-bottom:clamp(40px,8vh,96px)}
.hero.tall .hero-logo{animation:logofloat 7s ease-in-out infinite}
@keyframes logofloat{0%,100%{translate:0 0}50%{translate:0 -6px}}
.hero.tall .motes{z-index:1}
.hero .date.place{flex-wrap:wrap;justify-content:center;row-gap:.35em}
.hero .hero-sub{font-size:var(--fs-lead);line-height:1.45;max-width:44ch;font-family:var(--font-display);font-style:italic;font-weight:500}
.hero .hero-text{max-width:64ch;line-height:1.75}
.hero .hero-text strong{color:var(--orange-deep)}
.hero .cta-stack{margin-top:8px}
.hero .countdown{margin-top:clamp(10px,2vw,22px)}
/* the date line is underscored by a hairline that draws itself */
.hero .date.place{position:relative;padding-bottom:14px}
.hero .date.place::after{content:"";position:absolute;left:50%;bottom:0;width:120px;height:1px;margin-left:-60px;background:linear-gradient(90deg,rgba(242,96,24,0),var(--orange),rgba(242,96,24,0));transform:scaleX(0);transition:transform 1.4s var(--ease) .6s}
.hero .date.place.in::after{transform:none}
@media (max-width:760px){
  .hero.tall .hero-video{height:auto;aspect-ratio:4/5}
  .hero.tall .intro{margin-top:-104vw;gap:22px}
  .hero.tall .hero-mark{margin-bottom:26px}
  .hero .hero-sub{max-width:28ch}
  .hero .date.place{flex-direction:column;gap:.15em;line-height:1.5}
  .hero .date.place i{display:none}
}

/* ---------- 2 · Story: warmer ground, a breathing glow behind the pill, quicker pacing (main.js) ---------- */
.story{background:radial-gradient(ellipse 80% 55% at 50% 30%,#FCE4CF 0%,rgba(250,240,228,0) 70%),var(--cream)}
.story>.pattern{opacity:.14}
.poem-stick .story-glow{position:absolute;left:50%;top:55%;width:min(900px,90vw);aspect-ratio:1;translate:-50% -50%;border-radius:50%;z-index:-1;pointer-events:none;
  background:radial-gradient(closest-side,rgba(242,96,24,.2),rgba(247,180,140,.12) 45%,rgba(242,96,24,0));animation:breathe 6s ease-in-out infinite}
@keyframes breathe{0%,100%{scale:.92;opacity:.75}50%{scale:1.06;opacity:1}}
.poem-stick{isolation:isolate}
.story .story-cta{margin-top:clamp(28px,3.6vw,44px)}
/* 3 · the copy no longer types: each paragraph is unveiled by a soft ink wipe, quickly, one after another */
html[data-typing="off"] .story .text .reveal{opacity:0;transform:translateY(10px);filter:blur(4px);
  -webkit-mask-image:linear-gradient(90deg,#000 46%,transparent 54%);mask-image:linear-gradient(90deg,#000 46%,transparent 54%);
  -webkit-mask-size:220% 100%;mask-size:220% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:100% 0;mask-position:100% 0;
  transition:-webkit-mask-position .9s cubic-bezier(.65,0,.35,1),mask-position .9s cubic-bezier(.65,0,.35,1),opacity .45s ease,filter .9s ease,transform .9s var(--ease)}
html[data-typing="off"] .story .text .reveal.in{opacity:1;transform:none;filter:none;-webkit-mask-position:0 0;mask-position:0 0}
html[data-typing="off"] .story .text>:nth-child(2){transition-delay:.08s}
html[data-typing="off"] .story .text>:nth-child(3){transition-delay:.16s}
html.safe .story .text .reveal{-webkit-mask-image:none!important;mask-image:none!important}
@media (prefers-reduced-motion:reduce){html[data-typing="off"] .story .text .reveal{-webkit-mask-image:none;mask-image:none;opacity:1;filter:none;transform:none}}

/* ---------- 4 · The evening: centred title, moments as lit tiles ---------- */
.evening2{text-align:center}
.evening2 .lead{max-width:58ch;margin:1em auto 0;color:var(--cream);line-height:1.5}
.evening2 .lead strong{color:var(--orange);font-weight:500}
.evening2::before{content:"";position:absolute;width:60vw;height:60vw;max-width:820px;max-height:820px;left:50%;top:38%;transform:translate(-50%,-50%);border-radius:50%;pointer-events:none;
  background:radial-gradient(closest-side,rgba(242,96,24,.16),rgba(242,96,24,0))}
.moments{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(12px,1.8vw,20px);margin-top:clamp(40px,5.4vw,68px);text-align:center}
.moment{position:relative;display:grid;justify-items:center;align-content:start;gap:10px;padding:clamp(26px,2.8vw,34px) clamp(18px,2vw,26px) clamp(24px,2.6vw,30px);border-radius:var(--radius);
  background:linear-gradient(160deg,rgba(250,240,228,.075),rgba(250,240,228,.015) 60%);border:1px solid rgba(242,96,24,.22);overflow:hidden;isolation:isolate;
  transition:transform .7s var(--ease),border-color .6s ease,background .6s ease,box-shadow .7s var(--ease)}
.moment.reveal{transition:opacity 1s var(--ease) calc(var(--k) * 90ms),transform 1.1s var(--ease) calc(var(--k) * 90ms),border-color .6s ease,background .6s ease,box-shadow .7s var(--ease)}
.moment::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(112deg,transparent 40%,rgba(255,190,140,.06) 45%,rgba(255,224,200,.2) 50%,rgba(255,190,140,.06) 55%,transparent 60%);background-size:300% 100%;background-repeat:no-repeat;background-position:100% 0;transition:background-position 1.4s cubic-bezier(.45,0,.25,1)}
.moment:hover{transform:translateY(-6px);border-color:rgba(242,96,24,.6);background:linear-gradient(160deg,rgba(242,96,24,.16),rgba(250,240,228,.02) 70%);box-shadow:0 30px 60px -36px rgba(242,96,24,.6)}
.moment:hover::after{background-position:0 0}
.moment .mi{position:relative;width:62px;height:62px;border-radius:50%;display:grid;place-items:center;color:var(--orange);margin-bottom:6px;
  background:radial-gradient(circle at 35% 30%,rgba(242,96,24,.22),rgba(242,96,24,.04) 70%);box-shadow:inset 0 0 0 1px rgba(242,96,24,.45)}
.moment .mi::after{content:"";position:absolute;inset:-6px;border-radius:50%;background:conic-gradient(from var(--a),transparent 0 70%,rgba(255,180,120,.9) 85%,transparent 100%);
  -webkit-mask:radial-gradient(closest-side,transparent calc(100% - 1.5px),#000 calc(100% - 1px));mask:radial-gradient(closest-side,transparent calc(100% - 1.5px),#000 calc(100% - 1px));animation:spin 5s linear infinite;opacity:.8}
.moment .mi svg{width:28px;height:28px}
.moment .mn{position:absolute;top:12px;right:16px;font-family:var(--font-display);font-style:italic;font-size:var(--fs-lead);color:rgba(242,96,24,.55)}
.moment h3{font-family:var(--font-display);font-size:var(--fs-lead);font-weight:600;line-height:1.3;color:var(--orange)}
.moment p{color:var(--cream);line-height:1.6;max-width:30ch}
/* the seventh moment — the gifts — closes the set as a wide orange plate */
.moment:nth-child(7){grid-column:1/-1;grid-template-columns:auto 1fr;justify-items:start;align-items:center;text-align:left;column-gap:22px;
  background:linear-gradient(120deg,rgba(242,96,24,.28),rgba(199,70,26,.12) 60%,rgba(250,240,228,.03));border-color:rgba(242,96,24,.5)}
.moment:nth-child(7) .mi{grid-row:span 2;margin:0}
.moment:nth-child(7) p{max-width:none}
@media (max-width:1000px){.moments{grid-template-columns:1fr 1fr}}
@media (max-width:640px){.moments{grid-template-columns:1fr}.moment:nth-child(7){grid-template-columns:1fr;justify-items:center;text-align:center}.moment:nth-child(7) .mi{grid-row:auto}}

/* ---------- 5 · Surprises + dress code, the gown on the right ---------- */
.dress-row{display:grid;grid-template-columns:1.25fr .75fr;gap:clamp(24px,5vw,72px);align-items:center;margin-top:clamp(56px,7vw,96px);text-align:left}
.dress-copy .more{margin:0;font-family:var(--font-display);font-style:italic;font-size:var(--fs-lead);color:var(--orange);font-weight:500;max-width:30ch;line-height:1.45}
.dress-line{display:inline-flex;align-items:center;gap:16px;margin-top:clamp(24px,3vw,34px);padding:12px 24px 12px 12px;border:1px solid var(--line-dark);border-radius:999px;
  background:linear-gradient(120deg,rgba(242,96,24,.14),rgba(242,96,24,0) 75%)}
.dress-line .dl-label{padding:.55em 1.1em;border-radius:999px;background:var(--orange);color:var(--cream);font-weight:700;letter-spacing:.18em;text-transform:uppercase;white-space:nowrap}
.dress-line p{color:var(--cream)}
.dress-line em{font-style:normal;color:var(--orange);font-weight:700}
.dress-copy .cta{justify-content:flex-start;margin-top:clamp(26px,3.4vw,38px)}
.gown-stage{position:relative;justify-self:center;width:clamp(170px,19vw,250px)}
.gown-stage svg{width:100%;height:auto;filter:drop-shadow(0 26px 30px rgba(0,0,0,.55));animation:gownsway 7s ease-in-out infinite;transform-origin:50% 12%}
@keyframes gownsway{0%,100%{rotate:-1.6deg;translate:0 0}50%{rotate:1.6deg;translate:0 -6px}}
.gown-stage .tail{transform-box:fill-box;transform-origin:50% 0;animation:ribbon 3.4s ease-in-out infinite}
@keyframes ribbon{0%,100%{rotate:-6deg}50%{rotate:7deg}}
.gown-stage .sparkle{position:absolute;width:14px;height:14px;background:#FFD2B0;clip-path:polygon(50% 0,58% 42%,100% 50%,58% 58%,50% 100%,42% 58%,0 50%,42% 42%);animation:twinkle2 2.6s ease-in-out infinite}
.gown-stage .s1{left:6%;top:18%}.gown-stage .s2{right:2%;top:40%;animation-delay:-.9s;scale:.7}.gown-stage .s3{left:16%;bottom:16%;animation-delay:-1.7s;scale:.85}
@keyframes twinkle2{0%,100%{opacity:.15;transform:scale(.5) rotate(0)}50%{opacity:1;transform:scale(1) rotate(45deg)}}
@media (prefers-reduced-motion:reduce){.gown-stage svg,.gown-stage .tail,.gown-stage .sparkle{animation:none}}
@media (max-width:760px){
  .dress-row{grid-template-columns:1fr;text-align:center;justify-items:center}
  .dress-copy .more{margin-inline:auto}
  .dress-line{flex-direction:column;border-radius:var(--radius);padding:14px 20px 16px}
  .dress-copy .cta{justify-content:center}
  .gown-stage{grid-row:1;width:150px}
}

/* ---------- 6 · Video band: dissolves into the dark above and the cream below ---------- */
.band-video.fade{background:linear-gradient(180deg,var(--ink) 0 50%,var(--cream-2) 50% 100%)}
.band-video.fade .video-frame{-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 14%,#000 60%,rgba(0,0,0,.55) 78%,transparent 100%);mask-image:linear-gradient(180deg,transparent 0,#000 14%,#000 60%,rgba(0,0,0,.55) 78%,transparent 100%);background:transparent}
.band-video.fade .veil{background:radial-gradient(ellipse 60% 70% at 50% 50%,rgba(26,10,2,.5),rgba(26,10,2,.12) 70%,rgba(26,10,2,0))}
.band-video.fade .caption{bottom:52%}

/* ---------- 7 · Awards: orange names, ink "Move", the trophy holds the centre while the list scrolls ---------- */
.section.awards{overflow:clip}
.awards .intro-copy{max-width:60ch}
.awards-grid{display:grid;grid-template-columns:minmax(220px,300px) 1fr;gap:clamp(28px,5vw,72px);align-items:start;margin-top:clamp(36px,5vw,64px)}
.trophy-col{align-self:stretch}
.awards .trophy{position:sticky;top:calc(50vh - 200px);aspect-ratio:3/4;display:grid;place-items:center}
.awards .trophy img{object-fit:contain;padding:22% 6% 12%;animation:float 6s ease-in-out infinite}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@media (prefers-reduced-motion:reduce){.awards .trophy img{animation:none}}
.award-table{position:relative;z-index:0;border-top:1px solid var(--line)}
.arow{display:grid;grid-template-columns:52px 1fr auto;gap:clamp(12px,2vw,28px);align-items:baseline;padding:16px 0;position:relative;
  background:linear-gradient(var(--line),var(--line)) no-repeat left bottom/100% 1px}
.arow.ahead{padding:10px 0;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--orange-deep)}
.arow .num{font-family:var(--font-display);font-style:italic;font-weight:500;color:var(--orange)}
.arow .name{font-family:var(--font-display);font-size:var(--fs-lead);font-weight:700;line-height:1.25;color:var(--orange)}
.arow .name em{color:var(--ink);font-style:normal}
.arow .cat{font-weight:700;letter-spacing:.14em;text-transform:uppercase;text-align:right}
.arow:not(.ahead)::before{content:"";position:absolute;left:-12px;right:-12px;top:0;bottom:0;border-radius:12px;z-index:-1;background-color:rgba(242,96,24,0);
  background-image:linear-gradient(112deg,transparent 40%,rgba(255,255,255,0) 45%,rgba(255,255,255,.8) 50%,rgba(255,255,255,0) 55%,transparent 60%);
  background-size:300% 100%;background-repeat:no-repeat;background-position:100% 0;transition:background-color .5s}
.arow:not(.ahead):hover::before{background-color:rgba(242,96,24,.08);background-position:0 0;transition:background-color .5s,background-position 1.4s cubic-bezier(.45,0,.25,1)}
.arow:not(.ahead) .name{transition:letter-spacing .6s var(--ease)}
.arow:not(.ahead):hover .name{letter-spacing:.01em}
.arow.reveal{opacity:1;transform:none;background-size:0% 1px;transition:background-size 1.6s cubic-bezier(.65,0,.35,1) var(--d,0s)}
.arow.reveal.in{background-size:100% 1px}
.arow.reveal>*{opacity:0;transform:translateY(14px);filter:blur(6px);transition:opacity 1.2s cubic-bezier(.16,1,.3,1) calc(var(--d,0s) + .2s),transform 1.4s cubic-bezier(.16,1,.3,1) calc(var(--d,0s) + .2s),filter 1.2s cubic-bezier(.16,1,.3,1) calc(var(--d,0s) + .2s)}
.arow.reveal.in>*{opacity:1;transform:none;filter:none}
.awards .stage-note{margin-top:clamp(28px,3.6vw,40px);text-align:center;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--orange-deep)}
.awards .closing-line{margin-top:14px;max-width:40ch}
@media (max-width:860px){
  .awards-grid{grid-template-columns:1fr;justify-items:center}
  .awards .trophy{position:relative;top:auto;width:min(240px,70vw)}
  .award-table{width:100%}
}
@media (max-width:760px){
  .arow.ahead{display:none}
  .arow{grid-template-columns:1fr;justify-items:center;text-align:center;gap:2px;padding:14px 0}
  .arow .cat{text-align:center;letter-spacing:.1em}
  .award-table{border-top:0}
}

/* ---------- 8 · Gallery: a warmer, livelier section; badges for the figures; a drifting outlined filmstrip ---------- */
.gallery{background:radial-gradient(ellipse 55% 45% at 12% 18%,rgba(247,180,140,.38),rgba(247,180,140,0) 70%),radial-gradient(ellipse 50% 45% at 90% 62%,rgba(242,96,24,.16),rgba(242,96,24,0) 70%),var(--cream)}
.twinkles{position:absolute;inset:0;pointer-events:none;z-index:0}
.twinkles i{position:absolute;width:16px;height:16px;background:var(--orange);opacity:.5;clip-path:polygon(50% 0,58% 42%,100% 50%,58% 58%,50% 100%,42% 58%,0 50%,42% 42%);animation:twinkle2 3.2s ease-in-out infinite}
.gallery-copy{max-width:64ch;margin:1.6em auto 0;text-align:center;line-height:1.8}
.gallery-copy .orn{margin:1.8em auto}
.stats{display:flex;justify-content:center;gap:clamp(18px,4vw,56px);margin:clamp(44px,5.6vw,72px) auto 0;flex-wrap:wrap}
.stat{position:relative;width:clamp(170px,17vw,210px);aspect-ratio:1;border-radius:50%;display:grid;align-content:center;justify-items:center;gap:2px;text-align:center;
  background:radial-gradient(circle at 35% 28%,#FFFFFF,#FCF2E8 55%,#F6E2D0);box-shadow:inset 0 1px 0 #fff,0 26px 50px -30px rgba(199,70,26,.55)}
.stat .ring{position:absolute;inset:-10px;border-radius:50%;border:1.5px dashed rgba(242,96,24,.55);animation:ringspin 26s linear infinite}
.stat:nth-child(2) .ring{animation-direction:reverse}
@keyframes ringspin{to{rotate:360deg}}
.stat.reveal{transform:scale(.7);transition:opacity .8s ease,transform 1.1s cubic-bezier(.34,1.56,.64,1)}
.stat.reveal.in{transform:none}
.stat.d1{transition-delay:.12s}.stat.d2{transition-delay:.24s}
.stat:hover{animation:statbob .9s cubic-bezier(.34,1.56,.64,1)}
@keyframes statbob{0%{scale:1}40%{scale:1.06}100%{scale:1}}
.stat .pre,.stat .u{font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.stat .pre{color:var(--orange-deep)}
.stat .n{font-family:var(--font-display);font-size:var(--fs-display);font-weight:700;line-height:1;color:var(--orange);font-variant-numeric:lining-nums}
.stat .n b{font-weight:inherit}
.stat .n i{font-style:italic;font-weight:500}
.stat .u{max-width:12ch}
.carousel{position:relative;z-index:1;margin-top:clamp(48px,6vw,80px);overflow:hidden;padding-block:30px;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.ctrack{display:flex;gap:clamp(18px,2.4vw,32px);width:max-content;animation:driftright 70s linear infinite}
.carousel:hover .ctrack{animation-play-state:paused}
@keyframes driftright{from{transform:translateX(-50%)}to{transform:translateX(0)}}
.frame{flex:none;width:clamp(230px,25vw,340px);padding:10px;border-radius:20px;background:#fff;outline:1.5px solid rgba(242,96,24,.55);outline-offset:6px;
  box-shadow:0 24px 44px -26px rgba(120,40,8,.5);rotate:-2deg;transition:rotate .7s var(--ease),scale .7s var(--ease),outline-color .5s,outline-offset .5s;cursor:pointer}
.frame:nth-child(even){rotate:2deg;translate:0 14px}
.frame img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:12px;display:block}
.frame:hover{rotate:0deg;scale:1.06;outline-color:var(--orange);outline-offset:3px;z-index:2}
@media (prefers-reduced-motion:reduce){.ctrack{animation:none}.stat .ring,.twinkles i{animation:none}}

/* ---------- 9 · Reels: the embed is cropped to the video; our own orange link below ---------- */
.testimonials .lead{color:var(--cream);max-width:40ch;margin:1em auto 0}
.testimonials::before{content:"";position:absolute;width:56vw;height:56vw;max-width:720px;max-height:720px;left:50%;top:60%;transform:translate(-50%,-50%);border-radius:50%;
  background:radial-gradient(closest-side,rgba(242,96,24,.16),rgba(242,96,24,0));pointer-events:none}
.reels{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,2.2vw,26px);margin-top:clamp(36px,5vw,60px)}
.reel-card{display:grid;justify-items:center;gap:18px}
.reel{--ig-top:54px;position:relative;width:100%;aspect-ratio:4/5;overflow:hidden;border-radius:var(--radius);background:#000;
  box-shadow:0 0 0 1px rgba(242,96,24,.4),0 30px 70px -40px rgba(242,96,24,.6);transition:transform .7s var(--ease),box-shadow .7s var(--ease)}
.reel:hover{transform:translateY(-4px);box-shadow:0 0 0 1.5px var(--orange),0 40px 80px -40px rgba(242,96,24,.8)}
.reel iframe{position:absolute;left:-1px;top:calc(-1 * var(--ig-top));width:calc(100% + 2px);height:calc(100% + var(--ig-top) + 320px);border:0;display:block}
.ig-link{display:inline-flex;align-items:center;gap:10px;padding:.8em 1.4em;border-radius:999px;border:1.5px solid rgba(242,96,24,.6);color:var(--orange);font-weight:700;letter-spacing:.04em;
  transition:background .4s,color .4s,border-color .4s,transform .5s var(--ease)}
.ig-link svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;transition:transform .5s var(--ease)}
.ig-link:hover{background:var(--orange);color:var(--cream);border-color:var(--orange);transform:translateY(-2px)}
.ig-link:hover svg{transform:translateX(4px)}
@media (max-width:860px){.reels{grid-template-columns:1fr;max-width:400px;margin-inline:auto}}

/* ---------- shared: tilt + spotlight for the premium cards (main.js sets --rx/--ry/--mx/--my) ---------- */
[data-tilt]{transform:perspective(1100px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateY(var(--ty,0px)) scale(var(--sc,1));transition:transform .6s var(--ease),box-shadow .7s var(--ease)}
[data-tilt].tilting{transition:transform .12s linear,box-shadow .7s var(--ease)}
[data-tilt]:hover{--ty:-8px}
.spot{position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:0;opacity:0;transition:opacity .5s;
  background:radial-gradient(420px circle at var(--mx,50%) var(--my,0%),rgba(255,255,255,.35),rgba(255,255,255,0) 45%)}
[data-tilt]:hover .spot{opacity:1}
.glints{position:absolute;inset:0;pointer-events:none;z-index:1}
.glints i{position:absolute;width:12px;height:12px;background:#FFE0B8;clip-path:polygon(50% 0,58% 42%,100% 50%,58% 58%,50% 100%,42% 58%,0 50%,42% 42%);animation:twinkle2 2.8s ease-in-out infinite}
.glints i:nth-child(1){left:10%;top:14%}.glints i:nth-child(2){right:12%;top:30%;animation-delay:-.8s}.glints i:nth-child(3){left:16%;top:52%;animation-delay:-1.6s;scale:.7}
.glints i:nth-child(4){right:8%;bottom:22%;animation-delay:-2.1s;scale:.8}.glints i:nth-child(5){left:46%;top:6%;animation-delay:-1.2s;scale:.6}

/* ---------- 10 · Tickets: three plates rising in value — cream, orange, and a black Ultra VIP with a living gold border ---------- */
.tickets{background:radial-gradient(ellipse 60% 40% at 50% 100%,rgba(242,96,24,.12),rgba(242,96,24,0) 70%),var(--cream)}
.tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,2vw,24px);margin-top:clamp(44px,5.8vw,76px);align-items:stretch}
.tier-wrap{display:flex}
.tier{position:relative;flex:1;display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center;border-radius:var(--radius);padding:clamp(34px,3.4vw,42px) clamp(20px,2.4vw,30px) clamp(26px,2.8vw,32px);
  background:linear-gradient(150deg,#FFFFFF 0%,#FCF8F3 48%,#F3E6D8 100%);border:1px solid rgba(242,96,24,.22);box-shadow:inset 0 1px 0 #fff,0 30px 60px -44px rgba(90,40,10,.45);isolation:isolate}
.tier>*{position:relative;z-index:1}
.tier>.pattern{position:absolute;z-index:0;opacity:.1;-webkit-mask-image:none;mask-image:none;border-radius:inherit}
.tier .t-icon{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;color:var(--orange);background:radial-gradient(circle at 35% 30%,#fff,#FBEADB);box-shadow:inset 0 0 0 1px rgba(242,96,24,.4),0 12px 24px -14px rgba(199,70,26,.6)}
.tier .t-icon svg{width:26px;height:26px;stroke-width:1.5}
.tier h3{font-family:var(--font-display);font-size:var(--fs-lead);font-weight:700;line-height:1.2}
.tier .price{display:grid;justify-items:center;gap:2px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--orange-deep);padding-bottom:16px;border-bottom:1px solid var(--line);width:100%}
.tier .price b{font-family:var(--font-display);font-size:var(--fs-display);font-weight:700;letter-spacing:-.02em;line-height:1;color:var(--orange);font-variant-numeric:lining-nums}
.tier .for{line-height:1.6;max-width:34ch}
.tier .plus{font-family:var(--font-display);font-style:italic;font-weight:500;color:var(--orange-deep)}
.ticks{list-style:none;display:grid;gap:10px;justify-items:center}
.ticks li{display:block;line-height:1.5;max-width:34ch}
.ticks li>svg{display:inline-block;vertical-align:-3px;width:18px;height:18px;margin-right:7px;fill:none;stroke:var(--orange);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;background:rgba(242,96,24,.12);border-radius:50%;padding:3px}
.ticks .bonus strong{color:var(--orange)}
.tier .btn{margin-top:auto;align-self:stretch;justify-content:center}
.tier .seats{position:absolute;top:-15px;left:50%;translate:-50% 0;z-index:3;display:inline-flex;align-items:center;gap:7px;padding:.5em 1.05em;border-radius:999px;white-space:nowrap;
  font-weight:700;letter-spacing:.14em;text-transform:uppercase;box-shadow:0 12px 26px -10px rgba(26,10,2,.55)}
.tier .seats i{width:6px;height:6px;border-radius:50%;background:currentColor;animation:blink 1.6s infinite}
/* VIP: the orange plate */
.tier.vip{background:linear-gradient(150deg,#F7843F 0%,var(--orange) 42%,#D24C16 100%);border-color:transparent;color:var(--ink);box-shadow:0 40px 80px -42px rgba(199,70,26,.85)}
.tier.vip .seats{background:var(--ink);color:var(--orange)}
.tier.vip .t-icon{color:var(--cream);background:rgba(26,10,2,.18);box-shadow:inset 0 0 0 1px rgba(250,240,228,.5)}
.tier.vip .price{color:var(--ink);border-color:rgba(26,10,2,.18)}
.tier.vip .price b{color:var(--cream)}
.tier.vip .plus{color:var(--cream)}
.tier.vip .ticks li>svg{stroke:var(--ink);background:rgba(250,240,228,.5)}
.tier.vip .ticks .bonus strong{color:var(--cream)}
/* Ultra VIP: black plate, rotating gold-orange border, gilded price, glints — the most premium of the three */
.tier.ultra{background:radial-gradient(ellipse 90% 60% at 50% 0%,#4A2410 0%,#1E0C04 55%,#0A0400 100%);color:var(--cream);border-color:transparent;--sc:1.035;
  box-shadow:0 0 0 1px rgba(255,190,120,.18),0 50px 100px -40px rgba(242,96,24,.75),0 0 80px -20px rgba(242,96,24,.35)}
.tier.ultra:hover{--sc:1.05}
.tier.ultra::after{content:"";position:absolute;inset:0;border-radius:inherit;padding:2px;z-index:2;pointer-events:none;
  background:conic-gradient(from var(--a),#F26018,#FFE2B0,#C7461A,#FFB46B,#8A3410,#FFE2B0,#F26018);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;animation:spin 6s linear infinite}
.tier.ultra .seats{background:linear-gradient(100deg,#FFD9A0,#F7B48C 40%,#F26018);color:var(--ink)}
.tier.ultra .t-icon{color:#FFD9A0;background:radial-gradient(circle at 35% 30%,rgba(255,217,160,.25),rgba(255,217,160,.03));box-shadow:inset 0 0 0 1px rgba(255,217,160,.55),0 0 30px -6px rgba(242,96,24,.7)}
.tier.ultra h3{color:#FFE7C7}
.tier.ultra .price{color:#F7B48C;border-color:rgba(255,190,120,.22)}
.tier.ultra .price b{background:linear-gradient(100deg,#FFE2B0 0%,#F7B48C 25%,#F26018 50%,#FFE2B0 75%,#F7B48C 100%);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:goldsheen 5s ease-in-out infinite}
@keyframes goldsheen{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
.tier.ultra .plus{color:#F7B48C}
.tier.ultra strong{color:#FFD9A0}
.tier.ultra .ticks li>svg{stroke:#FFD9A0;background:rgba(255,217,160,.14)}
.tier.ultra .spot{background:radial-gradient(420px circle at var(--mx,50%) var(--my,0%),rgba(255,190,120,.22),rgba(255,190,120,0) 45%)}
@media (prefers-reduced-motion:reduce){.tier.ultra::after,.tier.ultra .price b{animation:none}}
@media (max-width:1000px){.tiers{grid-template-columns:1fr;max-width:520px;margin-inline:auto;gap:34px}.tier.ultra{--sc:1}}

/* ---------- 11 · Partners (orange): what the brand receives — icon medallions with numbers ---------- */
.partners .partner-copy{max-width:62ch;margin:1.4em auto 0;line-height:1.75}
.partners .partner-copy p+p{margin-top:1.1em}
.partners .partner-copy .big{margin-top:1.5em;padding-top:1.3em;border-top:1px solid rgba(26,10,2,.18);font-family:var(--font-display);font-size:var(--fs-lead);font-style:italic;font-weight:500;line-height:1.45;color:var(--cream)}
.sub-title{margin-top:clamp(48px,6vw,72px);font-family:var(--font-display);font-size:var(--fs-display);font-weight:700;line-height:1.1}
.gains{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,2vw,22px);margin-top:clamp(28px,3.6vw,44px)}
.gain{position:relative;display:grid;justify-items:center;gap:8px;padding:clamp(30px,3vw,38px) clamp(18px,2.2vw,26px) clamp(26px,2.6vw,32px);border-radius:var(--radius);text-align:center;
  background:linear-gradient(150deg,#FFFAF4 0%,var(--cream) 45%,#F3E1CF 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.85),0 26px 50px -30px rgba(90,25,0,.55);overflow:hidden;isolation:isolate;
  transition:transform .7s var(--ease),box-shadow .7s var(--ease)}
.gain.reveal{transition:opacity 1s var(--ease) calc(var(--k) * 90ms),transform 1.1s var(--ease) calc(var(--k) * 90ms),box-shadow .7s var(--ease)}
.gain::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:-1;
  background:linear-gradient(112deg,transparent 38%,rgba(190,110,50,.07) 44%,rgba(255,255,255,.95) 50%,rgba(190,110,50,.07) 56%,transparent 62%);background-size:300% 100%;background-repeat:no-repeat;background-position:100% 0;
  animation:shine 8s cubic-bezier(.45,0,.25,1) calc(var(--k) * .5s) infinite}
.gain:hover{transform:translateY(-8px);box-shadow:inset 0 1px 0 rgba(255,255,255,.85),0 40px 70px -34px rgba(90,25,0,.7)}
.gain .gn{position:absolute;top:8px;right:16px;font-family:var(--font-display);font-style:italic;font-weight:700;font-size:var(--fs-display);line-height:1;color:rgba(242,96,24,.17);transition:color .6s,transform .8s var(--ease)}
.gain:hover .gn{color:rgba(242,96,24,.35);transform:translateY(-4px)}
.gain .gi{position:relative;width:70px;height:70px;border-radius:50%;display:grid;place-items:center;margin-bottom:6px;color:var(--cream);
  background:radial-gradient(circle at 32% 28%,#FF9F63,var(--orange) 52%,var(--orange-deep));box-shadow:0 16px 30px -14px rgba(199,70,26,.8),inset 0 1px 0 rgba(255,255,255,.35)}
.gain .gi::after{content:"";position:absolute;inset:-7px;border-radius:50%;border:1px solid rgba(242,96,24,.45);animation:halo 3.4s cubic-bezier(.16,1,.3,1) calc(var(--k) * .4s + 1s) infinite;opacity:0}
.gain .gi svg{width:30px;height:30px;stroke-width:1.5}
.gain:hover .gi{animation:medal .9s cubic-bezier(.34,1.56,.64,1)}
@keyframes medal{0%{rotate:0deg;scale:1}35%{rotate:-10deg;scale:1.12}70%{rotate:6deg;scale:1.05}100%{rotate:0deg;scale:1}}
.gain h4{font-family:var(--font-display);font-size:var(--fs-lead);font-weight:700;line-height:1.2}
.gain p{line-height:1.6;max-width:28ch}
@media (max-width:1000px) and (min-width:761px){.gains{grid-template-columns:1fr 1fr}}
@media (max-width:760px){.gains{grid-template-columns:1fr}}

/* ---------- 12 · Partner levels: each card wears its trophy's metal ---------- */
.partner-levels .journey{margin-top:clamp(40px,5.4vw,68px)}
.partner-levels .jstep p{max-width:28ch}
.levels-head{margin-top:clamp(72px,9vw,120px)}
.levels{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(18px,2.4vw,30px);margin-top:clamp(40px,5.4vw,64px)}
.level-wrap{display:flex}
.level{--t1:#C9CED6;--t2:#7E8794;--t3:#F2F4F7;--glow:rgba(126,135,148,.55);
  position:relative;flex:1;display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center;border-radius:calc(var(--radius) * 1.2);padding:22px clamp(18px,2.4vw,32px) clamp(28px,3vw,36px);
  background:linear-gradient(160deg,#FFFFFF 0%,var(--t3) 55%,#EFE7DE 100%);box-shadow:0 34px 70px -44px var(--glow);isolation:isolate}
.level.gold{--t1:#E8BC52;--t2:#A6761A;--t3:#FFF6DF;--glow:rgba(201,148,40,.65)}
.level.platinum{--t1:#EDEFF2;--t2:#9AA0A8;--t3:#FBFCFD;--glow:rgba(160,166,175,.6)}
.level.diamond{--t1:#F26018;--t2:#FFB46B;--t3:#2A1407;--glow:rgba(242,96,24,.8);background:radial-gradient(ellipse 90% 55% at 50% 0%,#4A2410,#1E0C04 60%,#0A0400);color:var(--cream)}
.level>*{position:relative;z-index:1}
.level::after{content:"";position:absolute;inset:0;border-radius:inherit;padding:2px;z-index:2;pointer-events:none;
  background:conic-gradient(from var(--a),var(--t1),var(--t3),var(--t2),var(--t1),var(--t3),var(--t2),var(--t1));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;animation:spin 9s linear infinite}
.level.diamond::after{animation-duration:5s}
.level:hover{box-shadow:0 50px 90px -40px var(--glow)}
.lv-tag{display:inline-block;padding:.45em 1.1em;border-radius:999px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--t2);box-shadow:inset 0 0 0 1px var(--t1);background:rgba(255,255,255,.55)}
.level.diamond .lv-tag{color:var(--t2);background:rgba(242,96,24,.12)}
.level .arch{width:min(240px,62%);height:auto;aspect-ratio:397/421;margin:6px auto 4px;border-radius:999px 999px calc(var(--radius) * .6) calc(var(--radius) * .6);box-shadow:0 26px 44px -26px rgba(26,10,2,.75),0 0 0 1px var(--t1)}
.level .arch::after{border-color:var(--t1);opacity:.7}
.level .arch img{object-fit:cover;padding:0;animation:float 6s ease-in-out infinite}
.level-wrap:nth-child(2) .arch img{animation-delay:-1.5s}.level-wrap:nth-child(3) .arch img{animation-delay:-3s}.level-wrap:nth-child(4) .arch img{animation-delay:-4.5s}
.level h3{font-family:var(--font-display);font-size:var(--fs-display);font-weight:700;line-height:1;margin-top:6px}
.level h3 span{font-size:var(--fs-lead);font-style:italic;font-weight:500;color:var(--t2)}
.level .price{font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--t2);padding-bottom:14px;width:100%;border-bottom:1.5px solid var(--t1)}
.level .price b{font-family:var(--font-display);font-size:var(--fs-lead);letter-spacing:0;color:var(--ink);margin-right:.2em}
.level.diamond .price b,.level.diamond h3{color:var(--cream)}
.level .for{line-height:1.6;max-width:36ch}
.level .for strong{display:block;font-family:var(--font-display);font-size:var(--fs-lead);color:var(--orange);text-transform:uppercase;letter-spacing:.03em;margin-bottom:.15em}
.level .plus{font-family:var(--font-display);font-style:italic;font-weight:500;color:var(--t2)}
.level .ticks li>svg{stroke:var(--t2);background:color-mix(in srgb,var(--t1) 28%,transparent)}
.level.diamond .ticks li>svg{stroke:var(--t2);background:rgba(242,96,24,.18)}
.level .spot{background:radial-gradient(420px circle at var(--mx,50%) var(--my,0%),rgba(255,255,255,.45),rgba(255,255,255,0) 45%)}
.level.diamond .spot{background:radial-gradient(420px circle at var(--mx,50%) var(--my,0%),rgba(255,180,110,.2),rgba(255,180,110,0) 45%)}
@media (prefers-reduced-motion:reduce){.level::after,.level .arch img{animation:none}}
@media (max-width:860px){.levels{grid-template-columns:1fr;max-width:520px;margin-inline:auto}}

/* ---------- 13 · Partner close (dark): build your experience + a rising ladder of early benefits ---------- */
.partner-close{text-align:center}
.partner-close::before{content:"";position:absolute;width:60vw;height:60vw;max-width:820px;max-height:820px;left:50%;top:62%;transform:translate(-50%,-50%);border-radius:50%;pointer-events:none;
  background:radial-gradient(closest-side,rgba(242,96,24,.18),rgba(242,96,24,0))}
.partner-close .build{max-width:780px}
.partner-close .build .lead,.early-head .lead{margin:1em auto 0;max-width:54ch;color:var(--cream);line-height:1.5}
.partner-close .build .lead strong{color:var(--orange);font-weight:500}
.early-head{margin-top:clamp(80px,9vw,124px)}
.early-head .lead{font-family:var(--font-display);font-style:italic;color:var(--orange-soft)}
.ladder{list-style:none;display:grid;grid-template-columns:repeat(5,1fr);gap:clamp(10px,1.4vw,16px);align-items:end;margin-top:clamp(44px,5.6vw,72px);position:relative}
.rung{position:relative;display:grid;justify-items:center;align-content:start;gap:10px;min-height:calc(200px + var(--k) * 38px);padding:26px 14px 24px;border-radius:22px 22px 6px 6px;
  background:linear-gradient(180deg,rgba(242,96,24,calc(.16 + var(--k) * .07)) 0%,rgba(242,96,24,.03) 100%);border-top:2px solid var(--orange);
  box-shadow:inset 0 1px 0 rgba(255,200,160,.2);transform-origin:50% 100%}
.rung.reveal{opacity:0;transform:scaleY(.4) translateY(20px);transition:opacity .7s ease calc(var(--k) * .14s),transform 1.1s cubic-bezier(.34,1.3,.64,1) calc(var(--k) * .14s)}
.rung.reveal.in{opacity:1;transform:none}
.rung .ri{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;color:var(--orange);background:rgba(26,10,2,.55);box-shadow:inset 0 0 0 1px rgba(242,96,24,.55)}
.rung .ri svg{width:24px;height:24px}
.rung .rn{font-family:var(--font-display);font-style:italic;font-weight:700;font-size:var(--fs-display);line-height:1;color:var(--orange)}
.rung p{font-weight:700;color:var(--cream);line-height:1.45;max-width:18ch}
.rung:last-child{background:linear-gradient(180deg,rgba(242,96,24,.55) 0%,rgba(242,96,24,.06) 100%);box-shadow:0 0 60px -20px rgba(242,96,24,.7)}
.rung:last-child .rn{color:var(--cream)}
.rung:hover .ri{background:var(--orange);color:var(--cream);transition:background .4s,color .4s}
.sold{margin-top:clamp(40px,5vw,60px);display:flex;justify-content:center}
.sold span{display:inline-block;padding:1em 2em;border-radius:999px;border:1px solid rgba(242,96,24,.55);font-family:var(--font-display);font-style:italic;font-size:var(--fs-lead);color:var(--cream);
  background:linear-gradient(120deg,rgba(242,96,24,.22),rgba(242,96,24,.04));box-shadow:0 0 50px -18px rgba(242,96,24,.7)}
@media (max-width:860px){
  .ladder{grid-template-columns:1fr;max-width:420px;margin-inline:auto;gap:12px}
  .rung{min-height:0;grid-template-columns:auto auto 1fr;align-items:center;text-align:left;justify-items:start;border-radius:18px;margin-left:calc(var(--k) * 10px);padding:16px 18px}
  .rung p{max-width:none}
  .rung.reveal{transform:translateX(-24px)}
}
@media (max-width:520px){.rung{margin-left:0}.sold span{border-radius:var(--radius);padding:1em 1.4em}}

/* ---------- 14 · The partnership call: four trophies fan out above the question ---------- */
#devino-partener.section{padding-block:clamp(80px,10vw,144px);text-align:center;color:var(--cream);
  background:radial-gradient(ellipse 70% 60% at 50% 18%,#5A2A10 0%,#2A1407 45%,var(--ink) 80%)}
#devino-partener .pattern{opacity:.07}
#devino-partener::after{content:"";position:absolute;left:50%;bottom:-30%;width:90vw;height:60vw;max-width:1200px;max-height:700px;translate:-50% 0;border-radius:50%;pointer-events:none;
  background:radial-gradient(closest-side,rgba(242,96,24,.35),rgba(242,96,24,0))}
.pcta{position:relative;z-index:1;max-width:820px;margin-inline:auto}
.pcta .lead{color:var(--cream);max-width:48ch;margin:1.1em auto 0;line-height:1.55}
.pcta .lead strong{color:var(--orange);font-weight:500}
.pcta .cta-stack{display:grid;justify-items:center;gap:18px;margin-top:clamp(32px,4vw,48px)}
.pcta .btn.big{animation:btnshine 6s cubic-bezier(.45,0,.25,1) 1.8s infinite,ctaglow2 3.2s ease-in-out infinite}
@keyframes ctaglow2{0%,100%{box-shadow:0 14.4px 40px -8px rgba(242,96,24,.8),inset 0 1px 0 rgba(255,255,255,.22)}50%{box-shadow:0 18px 60px -6px rgba(242,96,24,1),0 0 0 6px rgba(242,96,24,.12),inset 0 1px 0 rgba(255,255,255,.22)}}
.fan{position:relative;height:clamp(150px,16vw,200px);margin-bottom:clamp(28px,3.6vw,44px)}
.ft{position:absolute;left:50%;top:0;width:clamp(86px,9vw,120px);aspect-ratio:397/521;margin-left:calc(clamp(86px,9vw,120px) / -2);border-radius:999px 999px 14px 14px;overflow:hidden;background:#1E0D06;
  box-shadow:0 24px 40px -20px rgba(0,0,0,.8),0 0 0 1px var(--c,rgba(242,96,24,.5));opacity:0;translate:0 30px;rotate:0deg;
  transition:translate 1.2s cubic-bezier(.34,1.3,.64,1),rotate 1.2s cubic-bezier(.34,1.3,.64,1),opacity .6s ease}
.ft img{width:100%;height:100%;object-fit:cover;object-position:50% 40%;animation:float 5s ease-in-out infinite}
.ft.t1{--c:#C9CED6}.ft.t2{--c:#E8BC52}.ft.t3{--c:#EDEFF2}.ft.t4{--c:#F26018;scale:1.14;z-index:2;box-shadow:0 24px 50px -16px rgba(242,96,24,.7),0 0 0 1.5px #F26018}
.ft.t2 img{animation-delay:-1.2s}.ft.t3 img{animation-delay:-2.4s}.ft.t4 img{animation-delay:-3.6s}
.fan.in .ft{opacity:1}
.fan.in .t1{translate:-180% 34px;rotate:-14deg;transition-delay:.15s}
.fan.in .t2{translate:-62% 6px;rotate:-5deg;transition-delay:.05s}
.fan.in .t3{translate:62% 6px;rotate:5deg;transition-delay:.1s}
.fan.in .t4{translate:180% 34px;rotate:14deg;transition-delay:.2s}
html.safe .ft{opacity:1}
@media (max-width:520px){.fan.in .t1{translate:-150% 30px}.fan.in .t4{translate:150% 30px}}

/* ---------- 15 · FAQ: the venue holds the centre while the questions scroll ---------- */
.section.faq{overflow:clip}
.faq-grid{display:grid;grid-template-columns:minmax(220px,330px) 1fr;gap:clamp(32px,5.6vw,80px);align-items:start}
.venue-col{align-self:stretch}
.faq .venue{position:sticky;top:calc(50vh - 245px);aspect-ratio:700/1036}
.faq .venue::after{border-color:rgba(250,240,228,.5)}
.qa-list{margin-top:clamp(24px,3vw,36px);border-top:1px solid var(--line)}
.qa{border-bottom:1px solid var(--line)}
.qa summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:22px 0;
  font-family:var(--font-display);font-size:var(--fs-lead);font-weight:700;line-height:1.3;transition:color .4s}
.qa summary::-webkit-details-marker{display:none}
.qa summary:hover{color:var(--orange-deep)}
.qa summary i{position:relative;flex:none;width:34px;height:34px;border-radius:50%;border:1px solid var(--line);background:linear-gradient(135deg,#fff,#FBF4EC);transition:background .5s,border-color .5s,transform .6s var(--ease)}
.qa summary i::before,.qa summary i::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:1.6px;margin:-.8px 0 0 -6px;background:var(--orange);border-radius:2px;transition:transform .6s var(--ease),background .4s}
.qa summary i::after{transform:rotate(90deg)}
.qa[open] summary i{background:var(--orange);border-color:transparent;transform:rotate(180deg)}
.qa[open] summary i::before,.qa[open] summary i::after{background:var(--cream)}
.qa[open] summary i::after{transform:rotate(0deg)}
.qa .ans{overflow:hidden}
.qa .ans p{padding:0 52px 22px 0;line-height:1.75}
@media (max-width:860px){
  .faq-grid{grid-template-columns:1fr;text-align:center}
  .faq .venue{position:relative;top:auto;width:min(220px,60vw);margin-inline:auto}
  .qa summary{text-align:left}
  .qa .ans p{text-align:left;padding-right:0}
}

/* ---------- 16 · The finale: more air, a glowing trophy behind, embers, a bigger last line ---------- */
#final.section{padding-block:clamp(100px,12vw,180px)}
.final.grand{background:radial-gradient(ellipse 70% 50% at 50% 0%,#3A1B0B,var(--ink) 70%)}
.final-wings{position:absolute;left:50%;top:clamp(20px,3vw,50px);width:min(560px,80vw);translate:-50% 0;z-index:0;pointer-events:none;opacity:.42;
  -webkit-mask-image:radial-gradient(closest-side,#000 40%,transparent 100%);mask-image:radial-gradient(closest-side,#000 40%,transparent 100%)}
.final-wings img{width:100%;height:auto;animation:float 7s ease-in-out infinite}
.final .display{color:var(--cream);max-width:22ch;margin-inline:auto;line-height:1.1}
.final .final-copy{max-width:58ch;margin:clamp(36px,4.4vw,56px) auto 0;line-height:1.85;color:var(--cream)}
.final .final-copy p+p{margin-top:1.5em}
.final .final-copy strong{color:var(--orange)}
.final .final-copy .duo{font-family:var(--font-display);font-style:italic;font-size:var(--fs-lead);line-height:1.5;padding:1.1em 0;border-block:1px solid var(--line-dark)}
.final .final-copy .duo strong{display:block;font-style:normal;font-weight:700}
.final .orn{margin:clamp(36px,4.4vw,52px) auto}
.final .final-line{font-family:var(--font-display);font-size:var(--fs-display);font-weight:700;line-height:1.15;color:var(--cream)}
.final .final-line em{display:block;font-style:italic;font-weight:500;color:var(--orange)}
.final .cta-stack{display:grid;justify-items:center;gap:22px;margin-top:clamp(36px,4.8vw,60px)}
.final .cta-stack .btn.big{animation:btnshine 6s cubic-bezier(.45,0,.25,1) 1.8s infinite,ctaglow2 3.2s ease-in-out infinite}
.final .date{display:inline-flex;align-items:center;flex-wrap:wrap;justify-content:center;gap:.4em .9em;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--cream)}
.final .date i{width:4.8px;height:4.8px;border-radius:50%;background:var(--orange);flex:none}
.footer{padding-block:44px calc(44px + env(safe-area-inset-bottom))}
@media (max-width:760px){.final .date{flex-direction:column;gap:.2em}.final .date i{display:none}}

/* failsafe additions */
html.safe .arow.reveal>*,html.safe .reveal.hold,html.safe .rung,html.safe .stat{opacity:1!important;transform:none!important;filter:none!important}
html.lite .arch::before,html.lite .ctrack{animation:none!important}

/* ---------- arches (from the deck): trophy, venue ---------- */
.arch{position:relative;overflow:hidden;isolation:isolate;border-radius:999px 999px var(--radius) var(--radius);background:#1E0D06;box-shadow:0 40px 80px -44px rgba(120,38,8,.6)}
.arch img{width:100%;height:100%;object-fit:cover;display:block}
.arch::after{content:"";position:absolute;inset:10px;border-radius:inherit;border:1px solid rgba(242,96,24,.45);pointer-events:none}
.arch::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(112deg,transparent 41%,rgba(255,220,190,.08) 46%,rgba(255,236,220,.28) 50%,rgba(255,220,190,.08) 54%,transparent 59%);
  background-size:300% 100%;background-repeat:no-repeat;background-position:100% 0;animation:shine 8s cubic-bezier(.45,0,.25,1) 1.5s infinite}
@media (prefers-reduced-motion:reduce){.arch::before{animation:none}}

/* ---------- form page: ticket / partner choice ---------- */
.choice{display:grid;gap:6px;border:0}
.choice legend{font-weight:700;letter-spacing:.02em;margin-bottom:4px}
.choice .opts{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.choice label{position:relative;cursor:pointer}
.choice input{position:absolute;opacity:0;pointer-events:none}
.choice .o{display:grid;justify-items:center;gap:1px;text-align:center;padding:.6em .4em;border-radius:12.8px;background:var(--cream);border:2px solid transparent;transition:border-color .3s,background .3s,box-shadow .3s,transform .4s var(--ease)}
.choice .o b{font-weight:700;line-height:1.2}
.choice .o small{font-size:inherit;color:var(--orange-deep);font-weight:500;white-space:nowrap}
.choice label:hover .o{transform:translateY(-1px)}
.choice input:checked+.o{border-color:var(--orange);background:var(--white);box-shadow:0 0 0 4px rgba(242,96,24,.15)}
.choice input:focus-visible+.o{outline:2px solid var(--orange-deep);outline-offset:2px}
.choice.invalid .o{border-color:rgba(199,70,26,.5)}
.choice .err{color:var(--orange-deep);font-weight:700;display:none}
.choice.invalid .err{display:block}
.field select,.field textarea{font:inherit;color:var(--ink);background:var(--cream);border:2px solid transparent;border-radius:12.8px;padding:.62em .95em;width:100%;outline:none;transition:border-color .3s,background .3s,box-shadow .3s}
.field select:focus,.field textarea:focus{border-color:var(--orange);background:var(--white);box-shadow:0 0 0 4px rgba(242,96,24,.15)}
.form-card .approval{text-align:center;font-weight:500}
.form-card .approval[hidden]{display:none}
[data-mode="partener"] .only-ticket,[data-mode="bilet"] .only-partner{display:none!important}
@media (max-width:420px){.choice .opts{grid-template-columns:1fr}.choice .o{grid-template-columns:auto auto;justify-content:center;gap:.5em}}

/* =========================================================
   Thank-you pages (v300): a cinematic dark opening over the video, then warm colour blocks
   ========================================================= */
.thanks.ty{display:block;min-height:0;padding:0;overflow:visible}
.ty-hero{position:relative;min-height:min(94vh,880px);display:grid;place-items:center;text-align:center;overflow:hidden;color:var(--cream);background:var(--ink);padding:clamp(70px,9vw,120px) 0 clamp(90px,10vw,140px)}
.ty-hero .video-frame{position:absolute;inset:0;border-radius:0!important;aspect-ratio:auto!important;box-shadow:none;z-index:0;background:var(--ink)}
.ty-hero .video-frame video{animation:kenburns 24s ease-in-out infinite alternate}
.ty-hero .video-frame .veil{background:linear-gradient(180deg,rgba(26,10,2,.62) 0%,rgba(26,10,2,.42) 45%,rgba(26,10,2,.88) 100%),radial-gradient(ellipse 60% 50% at 50% 55%,rgba(242,96,24,.28),rgba(242,96,24,0) 70%)}
.ty-hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:90px;z-index:1;background:linear-gradient(180deg,rgba(242,96,24,0),var(--orange));pointer-events:none}
.ty-hero.to-cream::after{background:linear-gradient(180deg,rgba(250,240,228,0),var(--cream))}
.ty-hero .wrap{position:relative;z-index:2;display:grid;justify-items:center;gap:22px}
.ty-logo{display:block;animation:pop 1s var(--ease) both}
.ty-logo img{height:clamp(110px,10vw,150px);width:auto;filter:drop-shadow(0 6px 24px rgba(0,0,0,.4))}
.ty-hero .label.pill{border:1.5px solid rgba(250,240,228,.5);border-radius:999px;padding:.6em 1.3em;background:rgba(26,10,2,.35);color:var(--cream);letter-spacing:.18em;font-weight:600;gap:9.6px;text-align:center}
.ty-hero .label.pill::before,.ty-hero .label.pill::after{width:14.4px}
.ty-hero .display{color:var(--cream);max-width:20ch}
.ty-hero .display em{color:var(--orange)}
.ty-hero .lead{max-width:36ch;line-height:1.45;color:var(--cream)}
@media (max-width:760px){.ty-hero .label.pill{letter-spacing:.1em;padding:.55em 1.1em}}
/* the letter, on orange: warm paper with a wax seal */
.ty-letter{text-align:center}
.letter{position:relative;max-width:660px;margin:30px auto 0;padding:clamp(52px,5.6vw,68px) clamp(22px,4.6vw,60px) clamp(32px,4vw,44px);text-align:center;
  background:linear-gradient(160deg,#FFFDF9 0%,#FCF4EA 55%,#F4E5D4 100%);border-radius:var(--radius);color:var(--ink);
  box-shadow:inset 0 1px 0 #fff,0 50px 90px -40px rgba(90,25,0,.75);rotate:-.6deg}
.letter::after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;
  background:linear-gradient(112deg,transparent 38%,rgba(190,110,50,.07) 44%,rgba(255,255,255,.95) 50%,rgba(190,110,50,.07) 56%,transparent 62%);
  background-size:300% 100%;background-repeat:no-repeat;background-position:100% 0;animation:shine 8s cubic-bezier(.45,0,.25,1) 1s infinite}
.letter .seal{position:absolute;top:-36px;left:50%;translate:-50% 0;width:76px;height:76px;border-radius:50%;display:grid;place-items:center;
  background:radial-gradient(circle at 35% 30%,#FF9F63,var(--orange) 48%,var(--orange-deep));box-shadow:0 14px 28px -10px rgba(120,30,0,.7),inset 0 0 0 4px rgba(255,255,255,.18)}
.letter .seal img{width:46px;height:auto}
.letter .label{margin-bottom:1.2em}
.letter .label::before,.letter .label::after{display:none}
.letter p{line-height:1.85;max-width:50ch;margin-inline:auto}
.letter p+p{margin-top:1em}
.letter .see{font-family:var(--font-display);font-style:italic;font-weight:500;font-size:var(--fs-lead);color:var(--orange)}
.letter .sign{display:grid;justify-items:center;gap:2px;margin-top:1.4em;padding-top:1.2em;border-top:1px solid var(--line)}
.letter .sign b{font-family:var(--font-display);font-size:var(--fs-lead);font-style:italic;font-weight:600}
.letter .sign span{font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--orange-deep)}
/* what happens next, on cream with a peach glow */
.ty-next{text-align:center;background:radial-gradient(ellipse 60% 60% at 50% 40%,#FCE4CF,rgba(250,240,228,0) 70%),var(--cream)}
.ty-next .journey{margin-top:clamp(36px,4.6vw,56px)}
@media (min-width:861px){
  .journey.two{grid-template-columns:repeat(2,1fr);max-width:760px;margin-inline:auto}
  .journey.two::before,.journey.two::after{left:25%;right:25%}
  .journey.two .jstep p{max-width:32ch}
}
.next-copy{max-width:58ch;margin:1.2em auto 0;line-height:1.8}
.next-sub{margin-top:clamp(28px,3.6vw,40px);font-family:var(--font-display);font-size:var(--fs-lead);font-style:italic;font-weight:500;color:var(--orange-deep)}
/* moments: six on the thank-you page */
.moments.six .moment:nth-child(7){display:none}
/* how to prepare */
.prep{text-align:center}
.prep .journey{margin-top:clamp(40px,5.4vw,64px)}
.jstep .dress-dot{cursor:pointer;transition:transform .5s var(--ease),border-color .5s ease,color .5s ease,box-shadow .5s ease}
.jstep .dress-dot:hover{transform:scale(1.08)}
.jstep .dress-dot::after{content:"";position:absolute;inset:-7px;border-radius:50%;border:1px solid rgba(242,96,24,.5);animation:halo 3.4s cubic-bezier(.16,1,.3,1) 3.4s infinite;opacity:0}
.journey.in .jstep .dress-dot{transition:opacity 1.2s cubic-bezier(.16,1,.3,1) .8s,transform .5s var(--ease),filter 1.2s .8s,border-color .5s,color .5s,box-shadow .5s}
/* invite: a dark card glowing orange */
.ty-invite{background:var(--cream-2)}
.invite-card{position:relative;overflow:hidden;isolation:isolate;max-width:900px;margin-inline:auto;text-align:center;color:var(--cream);border-radius:calc(var(--radius) * 1.3);
  padding:clamp(48px,6vw,80px) clamp(22px,5vw,72px);background:radial-gradient(ellipse 80% 70% at 50% 110%,rgba(242,96,24,.55),rgba(242,96,24,0) 60%),linear-gradient(160deg,#3A1C0C,var(--ink) 60%);
  box-shadow:0 60px 100px -50px rgba(26,10,2,.8)}
.invite-card .pattern{opacity:.08;-webkit-mask-image:none;mask-image:none}
.invite-card>*:not(.pattern):not(.motes){position:relative;z-index:2}
.invite-card .display{color:var(--cream);max-width:18ch;margin-inline:auto}
.invite-card .display em{color:var(--orange)}
.invite-card p{max-width:50ch;margin:1.2em auto 0;line-height:1.75}
.invite-card .cta{margin-top:clamp(26px,3.4vw,40px)}
.invite-card .btn.big{animation:btnshine 6s cubic-bezier(.45,0,.25,1) 1.8s infinite,ctaglow2 3.2s ease-in-out infinite}
/* the final word, on a full orange gradient */
.ty-final{text-align:center;color:var(--ink);background:linear-gradient(135deg,#F7843F 0%,var(--orange) 45%,#C7461A 100%)}
#tyfinal.section{padding-block:clamp(80px,10vw,140px)}
.ty-final .motes i{background:#FFF4EA;box-shadow:0 0 10px 2px rgba(255,240,228,.6)}
.ty-final .pull-final{font-family:var(--font-display);font-size:var(--fs-display);font-weight:700;letter-spacing:-.02em;line-height:1.1;color:var(--cream)}
.ty-final .pull-final em{color:var(--ink);font-style:normal}
.ty-final .pull-final .ul{display:inline-block;position:relative}
.ty-final .pull-final .ul::after{content:"";position:absolute;left:0;right:0;bottom:-.04em;height:.06em;background:var(--ink);transform:scaleX(0);transform-origin:left;transition:transform 1.2s var(--ease) .5s}
.ty-final .pull-final.in .ul::after{transform:scaleX(1)}
.ty-final .lead{margin-top:.9em}
.ty-final .lead strong{color:var(--cream)}
/* partner thank-you: the deck card on orange, the note on dark, the signature on the orange finale */
.ty-deck{text-align:center}
.deck-card{position:relative;overflow:hidden;isolation:isolate;margin:0 auto;max-width:920px;
  display:grid;grid-template-columns:1.1fr 1fr;align-items:center;gap:clamp(24px,4vw,52px);padding:clamp(20px,3vw,36px);
  background:linear-gradient(150deg,#3A1C0C 0%,var(--ink) 55%,#120600 100%);color:var(--cream);border-radius:var(--radius);box-shadow:0 50px 90px -50px rgba(26,10,2,.8);text-align:left}
.deck-card .pattern{opacity:.08;-webkit-mask-image:none;mask-image:none}
.deck-card>*:not(.pattern){position:relative;z-index:1}
.deck-card .cover{position:relative;display:block;border-radius:calc(var(--radius) * .6);overflow:hidden;box-shadow:0 30px 50px -24px rgba(0,0,0,.7);
  transform:perspective(1200px) rotateY(8deg) rotateX(2deg);transition:transform 1s var(--ease)}
.deck-card .cover:hover{transform:perspective(1200px) rotateY(0) rotateX(0) translateY(-4px)}
.deck-card .cover img{width:100%;height:auto}
.deck-card .cover::after{content:"";position:absolute;inset:0;background:linear-gradient(112deg,transparent 41%,rgba(255,236,220,0) 45%,rgba(255,236,220,.4) 50%,rgba(255,236,220,0) 55%,transparent 59%);
  background-size:300% 100%;background-repeat:no-repeat;background-position:100% 0;animation:shine 7s cubic-bezier(.45,0,.25,1) 1.2s infinite}
.deck-card .pdf{position:absolute;left:12px;bottom:12px;z-index:1;padding:.3em .8em;border-radius:999px;background:var(--orange);color:var(--cream);font-weight:700;letter-spacing:.18em}
.deck-card .copy{display:grid;gap:18px;justify-items:start}
.deck-card .copy p{line-height:1.7}
.deck-card .copy strong{color:var(--orange)}
.deck-card .label::after{display:none}
@media (max-width:760px){
  .deck-card{grid-template-columns:1fr;text-align:center;padding:16px 16px 28px}
  .deck-card .copy{justify-items:center}
  .deck-card .cover{transform:none}
}
.know{text-align:center}
.know .know-lead{max-width:40ch;margin:.9em auto 0;font-family:var(--font-display);font-size:var(--fs-lead);font-weight:700;line-height:1.45;color:var(--cream)}
.know .know-lead em{display:block;color:var(--orange);font-style:italic;font-weight:500;margin-top:.3em}
.know .closing{max-width:52ch;margin:1.6em auto 0;line-height:1.8;color:var(--cream)}
.sign-off .regards{font-family:var(--font-display);font-style:italic;font-weight:500;font-size:var(--fs-lead);color:var(--cream)}
.sign-off .sig{font-family:var(--font-display);font-size:var(--fs-display);font-weight:700;line-height:1.1;color:var(--ink);margin:.15em 0 .5em}
.sign-off .label{color:var(--cream)}
.sign-off .contact{max-width:48ch;margin:clamp(28px,3.6vw,40px) auto 18px;line-height:1.75}
.sign-off .contact a{color:var(--cream);font-weight:700;border-bottom:1px solid rgba(250,240,228,.6);transition:border-color .3s,color .3s;white-space:nowrap}
.sign-off .contact a:hover{color:var(--ink);border-color:var(--ink)}
.sign-off .date{display:inline-flex;align-items:center;flex-wrap:wrap;justify-content:center;gap:.4em .9em;font-weight:600;letter-spacing:.12em;text-transform:uppercase}
.sign-off .date i{width:4.8px;height:4.8px;border-radius:50%;background:var(--cream);flex:none}
@media (max-width:760px){.sign-off .date{flex-direction:column;gap:.2em}.sign-off .date i{display:none}}
.motes i:nth-child(1){left:44%;width:3px;height:3px;--dx:-54px;animation-duration:16.6s;animation-delay:-6.3s}
.motes i:nth-child(2){left:71%;width:3.5px;height:3.5px;--dx:56px;animation-duration:9.8s;animation-delay:-9.3s}
.motes i:nth-child(3){left:7%;width:3px;height:3px;--dx:-30px;animation-duration:9.7s;animation-delay:-6.7s}
.motes i:nth-child(4){left:73%;width:3.5px;height:3.5px;--dx:-45px;animation-duration:12.4s;animation-delay:-13.2s}
.motes i:nth-child(5){left:83%;width:5px;height:5px;--dx:13px;animation-duration:14.0s;animation-delay:-15.2s}
.motes i:nth-child(6){left:9%;width:3.5px;height:3.5px;--dx:49px;animation-duration:16.8s;animation-delay:-0.7s}
.motes i:nth-child(7){left:40%;width:4px;height:4px;--dx:13px;animation-duration:12.4s;animation-delay:-8.7s}
.motes i:nth-child(8){left:74%;width:3.5px;height:3.5px;--dx:14px;animation-duration:15.5s;animation-delay:-2.9s}
.motes i:nth-child(9){left:50%;width:3px;height:3px;--dx:12px;animation-duration:9.8s;animation-delay:-11.4s}
.motes i:nth-child(10){left:82%;width:4px;height:4px;--dx:-6px;animation-duration:10.6s;animation-delay:-10.9s}
.motes i:nth-child(11){left:62%;width:3.5px;height:3.5px;--dx:-22px;animation-duration:13.7s;animation-delay:-7.3s}
.motes i:nth-child(12){left:26%;width:4px;height:4px;--dx:13px;animation-duration:14.6s;animation-delay:-3.9s}
.motes i:nth-child(13){left:70%;width:4px;height:4px;--dx:-3px;animation-duration:13.0s;animation-delay:-5.5s}
.motes i:nth-child(14){left:80%;width:3.5px;height:3.5px;--dx:-7px;animation-duration:16.8s;animation-delay:-1.9s}
.twinkles i:nth-child(1){left:6%;top:12%;animation-delay:-0.7s;scale:1}
.twinkles i:nth-child(2){left:92%;top:8%;animation-delay:-1.4s;scale:0.7}
.twinkles i:nth-child(3){left:14%;top:46%;animation-delay:-2.1s;scale:1}
.twinkles i:nth-child(4){left:88%;top:40%;animation-delay:-2.8s;scale:1}
.twinkles i:nth-child(5){left:4%;top:78%;animation-delay:-3.5s;scale:0.7}
.twinkles i:nth-child(6){left:95%;top:72%;animation-delay:-4.2s;scale:1.3}
.twinkles i:nth-child(7){left:30%;top:4%;animation-delay:-4.9s;scale:0.7}
.twinkles i:nth-child(8){left:70%;top:92%;animation-delay:-5.6s;scale:1.3}
/* Ultra VIP: the twenty seats, lit one after another */
.seatmap{display:grid;grid-template-columns:repeat(10,1fr);gap:9px;width:min(240px,90%);margin-block:auto;padding:18px 0}
.seatmap i{aspect-ratio:1;border-radius:50% 50% 35% 35%;border:1px solid rgba(255,217,160,.5);background:rgba(255,217,160,.06);animation:seatglow 4.2s ease-in-out calc(var(--n) * .12s) infinite}
@keyframes seatglow{0%,60%,100%{background:rgba(255,217,160,.06);box-shadow:none}20%{background:#FFD9A0;box-shadow:0 0 12px 2px rgba(242,96,24,.7)}}
.tier.ultra .btn{margin-top:0}
@media (prefers-reduced-motion:reduce){.seatmap i{animation:none}}
/* partner levels: a bolder metal outline and a soft halo in the trophy's colour */
.level::after{padding:3px}
.level.silver{--t1:#AEB6C2;--t2:#6B7482;--t3:#E8ECF1}
.level.platinum{--t1:#D5D9DE;--t2:#8A9099;--t3:#FFFFFF}
.level{box-shadow:0 0 0 6px color-mix(in srgb,var(--t1) 22%,transparent),0 34px 70px -44px var(--glow)}
.level:hover{box-shadow:0 0 0 8px color-mix(in srgb,var(--t1) 30%,transparent),0 50px 90px -40px var(--glow)}
.final-wings{opacity:.32}

/* =========================================================
   v310 — evening timeline, dress-code card on the landing, FAQ dress, levels entrance,
   finale with stage lights, softer thank-you colours
   ========================================================= */

/* ---------- the evening, unfolding along a line ---------- */
.unfold-sec{text-align:center;background:linear-gradient(180deg,var(--ink) 0%,#24100A 45%,#1C0B04 100%);overflow:clip}
.unfold-sec .lead{max-width:58ch;margin:1em auto 0;color:var(--cream);line-height:1.5}
.unfold-sec .lead strong{font-weight:500;color:#F7C9A6}
.unfold-sec .display em{background:linear-gradient(100deg,#FFE2C4 0%,#F7B48C 30%,#F26018 55%,#FFE2C4 80%,#F7B48C 100%);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:goldsheen 7s ease-in-out infinite}
/* aurora: three slow warm lights drifting behind everything */
.aurora{position:absolute;inset:0;pointer-events:none;z-index:0;overflow:hidden}
.aurora i{position:absolute;border-radius:50%;width:70vw;height:70vw;max-width:1000px;max-height:1000px}
.aurora i:nth-child(1){left:-20%;top:5%;background:radial-gradient(closest-side,rgba(242,96,24,.2),rgba(242,96,24,0));animation:aurA 19s ease-in-out infinite alternate}
.aurora i:nth-child(2){right:-25%;top:35%;background:radial-gradient(closest-side,rgba(199,70,26,.18),rgba(199,70,26,0));animation:aurB 23s ease-in-out infinite alternate}
.aurora i:nth-child(3){left:20%;bottom:-25%;background:radial-gradient(closest-side,rgba(255,214,180,.1),rgba(255,214,180,0));animation:aurA 27s ease-in-out -8s infinite alternate-reverse}
@keyframes aurA{from{translate:0 0;scale:1}to{translate:18vw 10vh;scale:1.25}}
@keyframes aurB{from{translate:0 0;scale:1.1}to{translate:-16vw -12vh;scale:.9}}
@media (prefers-reduced-motion:reduce){.aurora i,.unfold-sec .display em{animation:none}}
.unfold{position:relative;max-width:980px;margin:clamp(48px,6vw,80px) auto 0}
.uline{position:absolute;left:50%;top:var(--ut,40px);height:var(--uh,calc(100% - 80px));width:2px;margin-left:-1px;background:rgba(250,240,228,.12);border-radius:2px;z-index:0}
.ufill{position:absolute;inset:0;border-radius:inherit;background:linear-gradient(180deg,#FFE2C4,#F7B48C 30%,var(--orange));transform-origin:top;transform:scaleY(var(--p,0))}
.uspark{position:absolute;left:50%;top:calc(var(--p,0) * 100%);width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:#FFF4EA;
  box-shadow:0 0 0 3px rgba(255,180,130,.35),0 0 16px 6px rgba(242,96,24,.8),0 0 40px 12px rgba(242,96,24,.35);opacity:var(--so,0);transition:opacity .4s}
.usteps{list-style:none;position:relative;z-index:1}
.ustep{display:grid;grid-template-columns:1fr 92px 1fr;align-items:center}
.ustep+.ustep{margin-top:-34px}
.umed{grid-column:2;grid-row:1;justify-self:center;position:relative;width:62px;height:62px;border-radius:50%;display:grid;place-items:center;color:#F7C9A6;
  background:radial-gradient(circle at 35% 30%,#3A1C0C,#1E0C04);box-shadow:inset 0 0 0 1px rgba(250,240,228,.22),0 10px 24px -10px rgba(0,0,0,.6);
  transition:background .6s ease,color .6s ease,box-shadow .6s ease,transform .7s cubic-bezier(.34,1.56,.64,1)}
.umed svg{width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;overflow:visible}
.umed svg *{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.1s cubic-bezier(.65,0,.35,1) .15s}
.ustep.lit .umed{color:var(--cream);transform:scale(1.08);background:radial-gradient(circle at 32% 28%,#FF9F63,var(--orange) 52%,var(--orange-deep));
  box-shadow:0 0 0 6px rgba(242,96,24,.14),0 0 34px -4px rgba(242,96,24,.75)}
.ustep.lit .umed svg *{stroke-dashoffset:0}
.ucard{grid-row:1;position:relative;padding:22px 26px 24px;border-radius:var(--radius);max-width:400px;
  background:linear-gradient(135deg,rgba(250,240,228,.075),rgba(250,240,228,.015));border:1px solid rgba(250,240,228,.1);box-shadow:0 24px 50px -36px rgba(0,0,0,.8);
  opacity:.28;filter:blur(1.5px);transition:opacity .8s ease,transform 1s var(--ease),filter .8s ease,border-color .8s ease,background .8s ease}
.ustep:nth-child(odd) .ucard{grid-column:1;justify-self:end;text-align:right;transform:translateX(-34px)}
.ustep:nth-child(even) .ucard{grid-column:3;justify-self:start;text-align:left;transform:translateX(34px)}
.ustep.lit .ucard{opacity:1;filter:none;transform:none;border-color:rgba(247,180,140,.32);background:linear-gradient(135deg,rgba(247,180,140,.13),rgba(250,240,228,.025) 70%)}
/* a connector from the card to its medallion */
.ucard::after{content:"";position:absolute;top:50%;width:30px;height:1px;background:linear-gradient(90deg,rgba(247,180,140,0),rgba(247,180,140,.6));opacity:0;transition:opacity .8s ease .2s}
.ustep:nth-child(odd) .ucard::after{left:100%}
.ustep:nth-child(even) .ucard::after{right:100%;transform:scaleX(-1)}
.ustep.lit .ucard::after{opacity:1}
.unum{display:block;font-family:var(--font-display);font-style:italic;color:#F7B48C;margin-bottom:.2em}
.ucard h3{font-family:var(--font-display);font-size:var(--fs-lead);font-weight:600;line-height:1.3;color:var(--cream)}
.ucard p{margin-top:.45em;line-height:1.6;color:#EBDCCB}
.ucard:hover{border-color:rgba(247,180,140,.55)}
html.safe .ucard{opacity:1;filter:none;transform:none}
@media (prefers-reduced-motion:reduce){.ucard{opacity:1;filter:none;transform:none!important}.umed svg *{stroke-dashoffset:0}}
@media (max-width:760px){
  .uline{left:31px}
  .ustep{grid-template-columns:62px 1fr;column-gap:14px}
  .ustep+.ustep{margin-top:16px}
  .umed{grid-column:1}
  .ustep:nth-child(n) .ucard{grid-column:2;justify-self:stretch;text-align:left;transform:translateX(24px);max-width:none}
  .ustep.lit .ucard{transform:none}
  .ucard::after{display:none}
}
/* dress row (button versions) */
.unfold-sec .dress-row{text-align:left}
button.dress-line{font:inherit;cursor:pointer;color:inherit;transition:border-color .4s,background .4s,transform .5s var(--ease),box-shadow .5s}
button.dress-line:hover{border-color:var(--orange);transform:translateY(-2px);box-shadow:0 18px 36px -20px rgba(242,96,24,.7)}
.dress-line .dl-text{color:var(--cream)}
.dress-line .dl-ic{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:rgba(250,240,228,.1);color:var(--cream);transition:background .4s,transform .5s var(--ease)}
.dress-line .dl-ic svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
button.dress-line:hover .dl-ic{background:var(--orange);transform:translateX(3px)}
button.gown-stage{cursor:pointer;transition:transform .6s var(--ease)}
button.gown-stage:hover{transform:translateY(-6px) scale(1.03)}
@media (max-width:760px){.unfold-sec .dress-row{text-align:center}}

/* ---------- the dress-code card, centred (landing + thank-you) ---------- */
.dress-card{grid-template-columns:1fr;justify-items:center;text-align:center;gap:clamp(16px,2.4vw,26px);padding:clamp(36px,5vw,60px) clamp(24px,5vw,72px)}
.dress-card .copy{justify-items:center}
.dress-card .display{max-width:16ch;margin-inline:auto}
.dress-card .gown{order:-1;width:clamp(110px,12vw,150px)}
.dress-card .label::after{content:"";width:27.2px;height:2px;background:currentColor;flex:none}
.pm-stage{width:min(620px,100%)}

/* ---------- FAQ: the dress code, illustrated ---------- */
.qa-dress{background:linear-gradient(120deg,rgba(242,96,24,.1),rgba(242,96,24,0) 75%);border-radius:16px;padding-inline:18px;margin-inline:-18px;border-bottom-color:transparent}
.qa-dress summary>span{display:inline-flex;align-items:center;gap:12px}
.qd-ic{flex:none;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--ink);color:var(--orange)}
.qd-ic svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.dress-ans{display:flex;align-items:center;gap:20px;padding:4px 0 22px}
.dress-ans p{padding:0!important;font-family:var(--font-display);font-style:italic;font-size:var(--fs-lead);line-height:1.35}
.mini-dress{flex:none;width:48px;transform-origin:50% 8%;animation:gownsway 5s ease-in-out infinite}
.mini-dress svg{width:100%;height:auto;overflow:visible;filter:drop-shadow(0 10px 10px rgba(26,10,2,.25))}
.mini-dress .tail{transform-box:fill-box;transform-origin:50% 0;animation:ribbon 3s ease-in-out infinite}
.swatches{display:flex;align-items:center;gap:8px;flex:none}
.sw{width:30px;height:30px;border-radius:50%;box-shadow:0 8px 16px -8px rgba(26,10,2,.5),inset 0 0 0 2px rgba(255,255,255,.35)}
.sw.ink{background:radial-gradient(circle at 35% 30%,#3A1C0C,#0B0502)}
.sw.orange{background:radial-gradient(circle at 35% 30%,#FF9F63,var(--orange) 55%,var(--orange-deep))}
.sw-plus{position:relative;width:12px;height:12px}
.sw-plus::before,.sw-plus::after{content:"";position:absolute;left:0;top:5px;width:12px;height:2px;border-radius:2px;background:var(--orange-deep)}
.sw-plus::after{transform:rotate(90deg)}
.qa-dress[open] .mini-dress{animation:dressin .9s cubic-bezier(.34,1.56,.64,1) both,gownsway 5s ease-in-out .9s infinite}
.qa-dress[open] .sw{animation:swpop .7s cubic-bezier(.34,1.56,.64,1) both}
.qa-dress[open] .sw.orange{animation-delay:.18s}
@keyframes dressin{from{opacity:0;transform:translateY(16px) scale(.7)}to{opacity:1;transform:none}}
@keyframes swpop{from{transform:scale(0)}to{transform:scale(1)}}
@media (max-width:860px){.dress-ans{justify-content:center;flex-wrap:wrap;text-align:center}.qa-dress{margin-inline:0}}

/* ---------- partner levels: the cards rise and turn in, the trophies land ---------- */
.level-wrap.reveal{opacity:0;transform:perspective(1300px) translateY(70px) rotateX(16deg) scale(.94);filter:blur(6px);transform-origin:50% 100%;
  transition:opacity 1s ease,transform 1.4s cubic-bezier(.2,.9,.25,1),filter 1s ease}
.level-wrap.reveal.in{opacity:1;transform:none;filter:none}
.level-wrap.reveal:nth-child(2){transition-delay:.14s}.level-wrap.reveal:nth-child(3){transition-delay:.08s}.level-wrap.reveal:nth-child(4){transition-delay:.22s}
.level-wrap .arch img{opacity:0}
.level-wrap.in .arch img{animation:trophyland 1.1s cubic-bezier(.34,1.4,.64,1) .45s both,float 6s ease-in-out 1.6s infinite}
@keyframes trophyland{from{opacity:0;transform:translateY(-36px) scale(.75)}to{opacity:1;transform:none}}
.level-wrap.in .arch{animation:archflash 1.6s ease .6s}
@keyframes archflash{0%{box-shadow:0 26px 44px -26px rgba(26,10,2,.75),0 0 0 1px var(--t1)}35%{box-shadow:0 26px 44px -26px rgba(26,10,2,.75),0 0 0 1px var(--t1),0 0 50px 6px var(--glow)}100%{box-shadow:0 26px 44px -26px rgba(26,10,2,.75),0 0 0 1px var(--t1)}}
html.safe .level-wrap .arch img,html.safe .level-wrap.reveal{opacity:1!important;transform:none!important;filter:none!important}
@media (prefers-reduced-motion:reduce){.level-wrap .arch img{opacity:1}}

/* ---------- the finale: stage lights, highlighted lines, the photo duo ---------- */
.final.grand2{background:radial-gradient(ellipse 80% 55% at 50% 0%,#3A1B0B,var(--ink) 65%),var(--ink)}
.beams{position:absolute;inset:0;pointer-events:none;z-index:0;overflow:hidden}
.beams i{position:absolute;top:-8%;width:46vw;max-width:640px;height:118%;transform-origin:50% 0;
  background:linear-gradient(180deg,rgba(255,214,180,.2),rgba(255,214,180,.05) 55%,rgba(255,214,180,0) 85%);clip-path:polygon(47% 0,53% 0,100% 100%,0 100%)}
.beams i:nth-child(1){left:-6%;animation:beamL 11s ease-in-out infinite alternate}
.beams i:nth-child(2){right:-6%;animation:beamR 13s ease-in-out infinite alternate}
.beams i:nth-child(3){left:50%;margin-left:-20vw;width:40vw;opacity:.6;background:linear-gradient(180deg,rgba(242,96,24,.22),rgba(242,96,24,0) 70%);animation:beamC 9s ease-in-out infinite alternate}
@keyframes beamL{from{rotate:-28deg}to{rotate:4deg}}
@keyframes beamR{from{rotate:28deg}to{rotate:-6deg}}
@keyframes beamC{from{rotate:-8deg;opacity:.35}to{rotate:8deg;opacity:.7}}
@media (prefers-reduced-motion:reduce){.beams i{animation:none}}
.final .final-copy{max-width:58ch;margin:clamp(36px,4.4vw,56px) auto 0;line-height:1.85;color:var(--cream)}
.final .final-copy p+p{margin-top:1.4em}
.mark{color:var(--cream);font-weight:700;background:linear-gradient(transparent 60%,rgba(242,96,24,.55) 60%,rgba(242,96,24,.55) 92%,transparent 92%) no-repeat 0 0/0% 100%;transition:background-size 1.3s var(--ease) .5s}
.in .mark{background-size:100% 100%}
.duo2{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:clamp(18px,3vw,40px);max-width:880px;margin:clamp(48px,6vw,80px) auto 0}
.duo2 figure{display:grid;justify-items:center;gap:22px}
.duo2 figcaption{font-family:var(--font-display);font-style:italic;font-size:var(--fs-lead);line-height:1.4;max-width:22ch}
.others figcaption{color:#D9C4AE}
.you figcaption strong{font-style:normal;color:var(--orange)}
.pstack{position:relative;width:min(300px,100%);aspect-ratio:4/3}
.pstack img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:12px;border:8px solid #EFE3D5;filter:sepia(.75) saturate(.55) brightness(.72);
  box-shadow:0 20px 40px -20px rgba(0,0,0,.8);transition:rotate .8s var(--ease),translate .8s var(--ease)}
.pstack img:nth-child(1){rotate:-9deg;translate:-14px 6px}
.pstack img:nth-child(2){rotate:6deg;translate:12px -4px}
.pstack img:nth-child(3){rotate:-2deg}
.others:hover .pstack img:nth-child(1){rotate:-16deg;translate:-40px 10px}
.others:hover .pstack img:nth-child(2){rotate:13deg;translate:40px -6px}
.duo-mid{position:relative;width:1px;height:160px;background:linear-gradient(180deg,rgba(242,96,24,0),rgba(242,96,24,.7),rgba(242,96,24,0))}
.duo-mid i{position:absolute;left:50%;top:50%;width:14px;height:14px;margin:-7px 0 0 -7px;background:var(--orange);clip-path:polygon(50% 0,58% 42%,100% 50%,58% 58%,50% 100%,42% 58%,0 50%,42% 42%);animation:twinkle2 2.6s ease-in-out infinite}
.pyou{position:relative;width:min(330px,100%);aspect-ratio:4/3;border-radius:16px;padding:8px;background:linear-gradient(135deg,#FFE2B0,var(--orange) 50%,#C7461A);
  box-shadow:0 0 60px -10px rgba(242,96,24,.75),0 30px 60px -30px rgba(0,0,0,.8);rotate:2deg;transition:rotate .8s var(--ease),scale .8s var(--ease);animation:youglow 3.6s ease-in-out infinite}
.pyou img{width:100%;height:100%;object-fit:cover;border-radius:10px;display:block}
.you:hover .pyou{rotate:0deg;scale:1.04}
@keyframes youglow{0%,100%{box-shadow:0 0 50px -14px rgba(242,96,24,.6),0 30px 60px -30px rgba(0,0,0,.8)}50%{box-shadow:0 0 80px -6px rgba(242,96,24,.9),0 30px 60px -30px rgba(0,0,0,.8)}}
.final .limited{margin:clamp(44px,5.4vw,64px) auto 0;max-width:40ch;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#F7C9A6;line-height:1.7}
.final .cta-stack{gap:0;margin-top:clamp(36px,4.8vw,56px)}
.final .date{margin-top:clamp(34px,4vw,48px);padding-top:clamp(22px,2.6vw,30px);border-top:1px solid var(--line-dark);letter-spacing:.22em;gap:.6em 1.4em;min-width:min(560px,100%)}
@media (max-width:760px){
  .duo2{grid-template-columns:1fr;gap:28px}
  .duo-mid{width:160px;height:1px;margin-inline:auto;background:linear-gradient(90deg,rgba(242,96,24,0),rgba(242,96,24,.7),rgba(242,96,24,0))}
  .final .date{letter-spacing:.14em;min-width:0}
}

/* ---------- thank-you pages: no solid orange — warm creams and a deep, glowing dark ---------- */
.ty-hero::after,.ty-hero.to-cream::after{height:240px;background:linear-gradient(180deg,rgba(250,240,228,0) 0%,rgba(250,240,228,.18) 30%,rgba(250,240,228,.55) 62%,rgba(250,240,228,.88) 85%,var(--cream) 100%)}
.ty-letter{background:radial-gradient(ellipse 60% 55% at 50% 45%,rgba(247,180,140,.45),rgba(247,180,140,0) 70%),linear-gradient(180deg,var(--cream) 0%,#F7E3D0 100%)}
.ty-letter .letter{box-shadow:inset 0 1px 0 #fff,0 50px 90px -40px rgba(120,45,10,.45),0 0 0 1px rgba(242,96,24,.15)}
.ty-next{background:radial-gradient(ellipse 60% 60% at 50% 40%,rgba(252,228,207,.9),rgba(250,240,228,0) 70%),#F7E3D0}
.ty-final{color:var(--cream);background:radial-gradient(ellipse 70% 70% at 50% 115%,rgba(242,96,24,.5),rgba(242,96,24,0) 62%),radial-gradient(ellipse 50% 40% at 15% 0%,rgba(199,70,26,.25),rgba(199,70,26,0) 70%),linear-gradient(160deg,#3A1C0C 0%,var(--ink) 60%)}
.ty-final .pull-final{color:var(--cream)}
.ty-final .pull-final em{color:var(--orange)}
.ty-final .pull-final .ul::after{background:var(--orange)}
.ty-final .lead{color:var(--cream)}
.ty-final .lead strong{color:#F7B48C}
.ty-final .motes i{background:#FFC9A0;box-shadow:0 0 10px 2px rgba(242,96,24,.55)}
.ty-deck{background:radial-gradient(ellipse 60% 60% at 50% 50%,rgba(247,180,140,.5),rgba(247,180,140,0) 70%),var(--cream-2)}
.sign-off .regards{color:#F7B48C}
.sign-off .sig{color:var(--cream)}
.sign-off .label{color:var(--orange)}
.sign-off .contact{color:var(--cream)}
.sign-off .contact a{color:var(--orange);border-bottom-color:rgba(242,96,24,.5)}
.sign-off .contact a:hover{color:var(--cream);border-color:var(--cream)}
.sign-off .date{color:var(--cream)}
.sign-off .date i{background:var(--orange)}
.know{background:linear-gradient(180deg,var(--ink),#24100A)}
/* the thank-you "moments" read in cream, not orange */
.moment h3{color:var(--cream)}
.moment .mi{color:#F7C9A6}
.moment .mn{color:rgba(247,180,140,.6)}
.know{color:var(--ink);background:radial-gradient(ellipse 60% 70% at 50% 50%,rgba(247,180,140,.32),rgba(247,180,140,0) 70%),var(--cream)}
.know .know-lead{color:var(--ink)}
.know .know-lead em{color:var(--orange)}
.know .closing{color:var(--ink)}
.final .final-copy .mark{color:var(--cream)}
.unfold-sec .dress-copy .more{color:#F7C9A6}

/* ---------- v320 · Partners, dark and editorial (no orange ground): gilded promise + glass benefits ---------- */
.partners2{background:radial-gradient(ellipse 70% 50% at 50% 0%,#3A1B0B,rgba(58,27,11,0) 70%),linear-gradient(180deg,var(--ink),#200D05 60%,var(--ink));overflow:clip}
.partners2 .label{color:#F7B48C}
.partners2 .display{color:var(--cream)}
.partners2 .display em{background:linear-gradient(100deg,#FFE2C4 0%,#F7B48C 30%,#F26018 55%,#FFE2C4 80%,#F7B48C 100%);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:goldsheen 7s ease-in-out infinite}
.p-split{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(28px,5vw,72px);align-items:center;margin-top:clamp(44px,5.6vw,72px);text-align:left}
.p-copy p{line-height:1.85;color:#EBDCCB}
.p-copy p+p{margin-top:1.3em}
.p-copy strong{color:var(--cream);font-weight:700}
.p-promise{position:relative;margin:0;padding:clamp(34px,4vw,48px) clamp(26px,3.4vw,40px) clamp(30px,3.4vw,40px);border-radius:calc(var(--radius) * 1.2);text-align:center;
  background:radial-gradient(ellipse 90% 60% at 50% 0%,#4A2410,#1E0C04 60%,#0A0400);box-shadow:0 50px 100px -50px rgba(242,96,24,.6),0 0 0 1px rgba(255,190,120,.12)}
.p-promise::after{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.5px;pointer-events:none;
  background:conic-gradient(from var(--a),rgba(242,96,24,.9),#FFE2B0,rgba(199,70,26,.6),#FFB46B,rgba(138,52,16,.5),#FFE2B0,rgba(242,96,24,.9));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;animation:spin 8s linear infinite}
.pp-trophy{display:block;width:110px;aspect-ratio:397/421;margin:0 auto 18px;border-radius:999px 999px 14px 14px;overflow:hidden;box-shadow:0 0 0 1px rgba(242,96,24,.5),0 20px 40px -20px rgba(242,96,24,.7)}
.pp-trophy img{width:100%;height:100%;object-fit:cover;animation:float 6s ease-in-out infinite}
.p-promise p{font-family:var(--font-display);font-style:italic;font-size:var(--fs-lead);line-height:1.5;color:var(--cream)}
.p-promise strong{display:block;margin-top:.6em;font-style:normal;font-weight:600;color:#F7C9A6}
.sub-title2{margin-top:clamp(64px,8vw,104px);text-align:center;font-family:var(--font-display);font-size:var(--fs-display);font-weight:700;line-height:1.1;color:var(--cream)}
.sub-title2 em{color:#F7B48C;font-style:normal}
.gains2{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,2vw,22px);margin-top:clamp(32px,4.2vw,52px)}
.g2{position:relative;display:grid;justify-items:center;gap:8px;text-align:center;padding:clamp(30px,3vw,38px) clamp(18px,2.2vw,26px) clamp(26px,2.6vw,32px);border-radius:var(--radius);
  background:linear-gradient(160deg,rgba(250,240,228,.08),rgba(250,240,228,.015) 65%);border:1px solid rgba(250,240,228,.1);overflow:hidden;isolation:isolate;
  transition:transform .7s var(--ease),border-color .6s ease,background .6s ease,box-shadow .7s var(--ease)}
.g2.reveal{transition:opacity 1s var(--ease) calc(var(--k) * 90ms),transform 1.1s var(--ease) calc(var(--k) * 90ms),border-color .6s ease,background .6s ease,box-shadow .7s var(--ease)}
.g2::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(112deg,transparent 40%,rgba(255,214,180,.05) 45%,rgba(255,226,200,.16) 50%,rgba(255,214,180,.05) 55%,transparent 60%);
  background-size:300% 100%;background-repeat:no-repeat;background-position:100% 0;animation:shine 9s cubic-bezier(.45,0,.25,1) calc(var(--k) * .6s) infinite}
.g2:hover{transform:translateY(-6px);border-color:rgba(247,180,140,.45);background:linear-gradient(160deg,rgba(247,180,140,.14),rgba(250,240,228,.02) 70%);box-shadow:0 34px 60px -36px rgba(242,96,24,.55)}
.g2n{position:absolute;top:10px;right:16px;font-family:var(--font-display);font-style:italic;font-size:var(--fs-lead);color:rgba(247,180,140,.45)}
.g2i{position:relative;width:64px;height:64px;border-radius:50%;display:grid;place-items:center;color:#F7C9A6;margin-bottom:6px;
  background:radial-gradient(circle at 35% 30%,rgba(247,180,140,.18),rgba(247,180,140,.02) 70%);box-shadow:inset 0 0 0 1px rgba(247,180,140,.35)}
.g2i::after{content:"";position:absolute;inset:-6px;border-radius:50%;background:conic-gradient(from var(--a),transparent 0 70%,rgba(255,200,150,.9) 85%,transparent 100%);
  -webkit-mask:radial-gradient(closest-side,transparent calc(100% - 1.5px),#000 calc(100% - 1px));mask:radial-gradient(closest-side,transparent calc(100% - 1.5px),#000 calc(100% - 1px));animation:spin 6s linear infinite}
.g2i svg{width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;overflow:visible}
.g2i svg *{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.2s cubic-bezier(.65,0,.35,1) calc(var(--k) * .1s + .35s)}
.g2.in .g2i svg *,html.safe .g2i svg *{stroke-dashoffset:0}
.g2:hover .g2i{color:var(--cream);background:radial-gradient(circle at 32% 28%,#FF9F63,var(--orange) 52%,var(--orange-deep));box-shadow:0 0 30px -6px rgba(242,96,24,.7);transition:background .5s,color .5s,box-shadow .5s}
.g2 h4{font-family:var(--font-display);font-size:var(--fs-lead);font-weight:600;line-height:1.2;color:var(--cream)}
.g2 p{line-height:1.6;max-width:28ch;color:#EBDCCB}
@media (prefers-reduced-motion:reduce){.g2i svg *{stroke-dashoffset:0}.partners2 .display em,.p-promise::after,.g2i::after{animation:none}}
@media (max-width:1000px) and (min-width:761px){.gains2{grid-template-columns:1fr 1fr}}
@media (max-width:760px){.p-split{grid-template-columns:1fr;text-align:center}.gains2{grid-template-columns:1fr}}

/* ---------- v330 · finale: luminous emphasis instead of underlines; the split photo ---------- */
.final .final-copy .glow-txt{display:block;margin-top:.35em;font-family:var(--font-display);font-style:italic;font-weight:600;font-size:var(--fs-lead);line-height:1.35;
  background:linear-gradient(100deg,#FFE2C4 0%,#F7B48C 35%,#FF8A4C 55%,#FFE2C4 80%);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;
  text-shadow:none;animation:goldsheen 6s ease-in-out infinite;filter:drop-shadow(0 0 18px rgba(242,96,24,.35))}
@media (prefers-reduced-motion:reduce){.final .final-copy .glow-txt{animation:none}}
.split-photo{max-width:820px;margin:clamp(52px,6.4vw,84px) auto 0;--x:96%}
.sp-frame{position:relative;aspect-ratio:637/298;border-radius:calc(var(--radius) * 1.1);overflow:hidden;isolation:isolate;
  box-shadow:0 0 0 1px rgba(247,180,140,.25),0 50px 100px -50px rgba(242,96,24,.55),0 30px 60px -30px rgba(0,0,0,.8)}
.sp-frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.sp-base{filter:sepia(.8) saturate(.4) brightness(.55) blur(1.5px);transform:scale(1.02)}
.sp-live{clip-path:inset(0 0 0 var(--x));transition:clip-path .25s linear}
.sp-frame::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(180deg,rgba(26,10,2,0) 55%,rgba(26,10,2,.55) 100%)}
.sp-line{position:absolute;top:0;bottom:0;left:var(--x);width:2px;margin-left:-1px;z-index:3;background:linear-gradient(180deg,rgba(255,226,196,0),#FFE2C4 20%,var(--orange) 80%,rgba(242,96,24,0));
  box-shadow:0 0 18px 3px rgba(242,96,24,.7);transition:left .25s linear}
.sp-line i{position:absolute;left:50%;top:50%;width:16px;height:16px;margin:-8px 0 0 -8px;background:#FFF4EA;clip-path:polygon(50% 0,58% 42%,100% 50%,58% 58%,50% 100%,42% 58%,0 50%,42% 42%);animation:twinkle2 2.4s ease-in-out infinite}
.split-photo .glints{z-index:3}
.split-photo .glints i:nth-child(1){left:auto;right:8%;top:16%}.split-photo .glints i:nth-child(3){left:auto;right:30%;top:60%}
.sp-caps{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:22px;align-items:start}
.sp-others{text-align:left;font-family:var(--font-display);font-style:italic;font-size:var(--fs-lead);line-height:1.4;color:#CDB7A2;max-width:24ch}
.sp-you{text-align:right;justify-self:end;font-family:var(--font-display);font-size:var(--fs-lead);font-weight:700;line-height:1.3;
  background:linear-gradient(100deg,#FFE2C4,#F7B48C 40%,#FF8A4C 60%,#FFE2C4);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:goldsheen 6s ease-in-out infinite}
@media (max-width:760px){.sp-caps{grid-template-columns:1fr;text-align:center;gap:12px}.sp-others,.sp-you{text-align:center;justify-self:center;max-width:none}.sp-frame{aspect-ratio:4/3}}

/* ---------- v330 · "Ce primește brandul tău": colour at rest, not only on hover ---------- */
.g2{background:radial-gradient(ellipse 85% 55% at 50% 0%,rgba(242,96,24,.3),rgba(242,96,24,0) 70%),linear-gradient(165deg,rgba(74,36,16,.75),rgba(30,12,4,.9) 70%);
  border:1px solid rgba(247,180,140,.28);box-shadow:inset 0 1px 0 rgba(255,214,180,.15),0 30px 60px -38px rgba(242,96,24,.55)}
.g2::before{content:"";position:absolute;left:18%;right:18%;top:0;height:2px;border-radius:2px;background:linear-gradient(90deg,rgba(242,96,24,0),#FFB46B,rgba(242,96,24,0))}
.g2:nth-child(3n+2){background:radial-gradient(ellipse 85% 55% at 50% 0%,rgba(255,180,110,.26),rgba(255,180,110,0) 70%),linear-gradient(165deg,rgba(86,40,14,.75),rgba(30,12,4,.9) 70%)}
.g2:nth-child(3n){background:radial-gradient(ellipse 85% 55% at 50% 0%,rgba(199,70,26,.34),rgba(199,70,26,0) 70%),linear-gradient(165deg,rgba(70,28,10,.75),rgba(30,12,4,.9) 70%)}
.g2i{color:var(--cream);background:radial-gradient(circle at 32% 28%,#FF9F63,var(--orange) 52%,var(--orange-deep));box-shadow:0 16px 30px -12px rgba(242,96,24,.75),inset 0 1px 0 rgba(255,255,255,.3)}
.g2i::before{content:"";position:absolute;inset:-14px;border-radius:50%;z-index:-1;background:radial-gradient(closest-side,rgba(242,96,24,.45),rgba(242,96,24,0));animation:breathe 4s ease-in-out calc(var(--k) * .5s) infinite}
.g2n{color:#F7B48C;opacity:.85}
.g2 h4{color:#FFE7CF}
.g2 p{color:#F0E2D2}
.g2:hover{transform:translateY(-8px);border-color:rgba(255,190,130,.6);box-shadow:inset 0 1px 0 rgba(255,214,180,.2),0 44px 80px -36px rgba(242,96,24,.8)}
.g2:hover .g2i{animation:medal .9s cubic-bezier(.34,1.56,.64,1)}
/* v340 · the split photo pins in the centre while the colour sweeps across it */
#final.section{overflow:clip}
.sp-pin{position:relative;margin-top:clamp(52px,6.4vw,84px)}
.sp-pin .split-photo{position:sticky;top:var(--sp-top,15vh);margin-top:0;--x:100%}
.sp-live,.sp-line{transition:none}
.split-photo .sp-line{opacity:1;transition:opacity .6s ease}
.split-photo.done .sp-line{opacity:0}
.split-photo.done .sp-frame{box-shadow:0 0 0 1px rgba(247,180,140,.4),0 50px 110px -40px rgba(242,96,24,.8),0 30px 60px -30px rgba(0,0,0,.8);transition:box-shadow 1s ease}
@media (prefers-reduced-motion:reduce){.sp-pin .split-photo{position:relative;top:auto}}
html.safe .sp-pin{height:auto!important}
html.safe .sp-pin .split-photo{position:relative;top:auto}
/* the colour layer opens by its left edge (a layout change every browser repaints), the picture inside stays put */
.sp-frame .sp-live{position:absolute;top:0;bottom:0;right:0;left:var(--x);overflow:hidden;clip-path:none;z-index:1}
.sp-frame .sp-live img{position:absolute;top:0;right:0;left:auto;height:100%;width:var(--fw,820px);max-width:none;object-fit:cover}
/* thank-you finale: the same hand-drawn curve as under the hero's WIN, drawing itself in */
.pull-final .ul.curve::after{display:none}
.pull-final .ul.curve svg{position:absolute;left:.04em;right:.06em;bottom:-.24em;width:auto;max-width:none;height:.22em;overflow:visible}
.pull-final .ul.curve svg path{fill:none;stroke:var(--orange);stroke-width:5;stroke-linecap:round;stroke-dasharray:420;stroke-dashoffset:420;transition:stroke-dashoffset 1.4s var(--ease) .5s}
.pull-final.in .ul.curve svg path,html.safe .pull-final .ul.curve svg path{stroke-dashoffset:0}
.pull-final .ul.curve svg{left:.04em;right:auto;width:calc(100% - .1em)}

/* =========================================================
   v400 · PARTNER PAGE + PARTNER THANK-YOU — dark, elite, metallic
   ========================================================= */
.pro-body{background:#0E0602}
.pro{color:var(--cream)}
.pro .label{color:#F7B48C}
.pro .display{color:var(--cream)}
.pro .display em{background:linear-gradient(100deg,#FFE2C4 0%,#F7B48C 30%,#F26018 55%,#FFE2C4 80%,#F7B48C 100%);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:goldsheen 7s ease-in-out infinite}
.pro .section.p-sec{padding-block:clamp(84px,9.5vw,136px);border-top:1px solid rgba(247,180,140,.07)}
.pro .p-sec .lead{color:#EBDCCB}
@media (prefers-reduced-motion:reduce){.pro .display em{animation:none}}

/* header: a dark bar, white mark, gold hairline */
.pro-header .logo img.dark{display:none!important}
.pro-header .logo img.light{display:block!important}
.pro-header.scrolled{background:rgba(14,6,2,.84);box-shadow:0 1px 0 rgba(247,180,140,.16)}
.pro-header .when,.pro-header.scrolled .when{color:var(--cream);text-shadow:none}
@media (min-width:761px){.pro-header.has-cta.past-hero{background:rgba(14,6,2,.86);box-shadow:0 1px 0 rgba(247,180,140,.18)}}
@media (max-width:760px){
  .pro-header.has-cta.show-cta{background:rgba(14,6,2,.9);box-shadow:0 1px 0 rgba(247,180,140,.16)}
  .pro-header .head-cta,.pro-header .head-cta:hover{background:linear-gradient(100deg,var(--orange-deep),var(--orange));color:var(--cream)}
}

/* 1 · hero */
.p-hero{position:relative;min-height:100vh;min-height:100svh;display:grid;place-items:center;text-align:center;overflow:hidden;background:#0E0602;color:var(--cream);padding:clamp(100px,10vw,140px) 0 clamp(90px,9vw,130px)}
.p-hero .video-frame{position:absolute;inset:0;border-radius:0!important;aspect-ratio:auto!important;box-shadow:none;z-index:0;background:#0E0602}
.p-hero .video-frame video{animation:kenburns 26s ease-in-out infinite alternate}
.p-hero .video-frame .veil{background:linear-gradient(180deg,rgba(14,6,2,.74) 0%,rgba(14,6,2,.5) 40%,rgba(14,6,2,.94) 100%),radial-gradient(ellipse 55% 45% at 50% 55%,rgba(242,96,24,.24),rgba(242,96,24,0) 70%)}
.p-hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:160px;z-index:1;pointer-events:none;background:linear-gradient(180deg,rgba(14,6,2,0),#0E0602)}
.p-hero .wrap{position:relative;z-index:2;display:grid;justify-items:center;gap:24px}
.p-hero .hero-mark{margin-bottom:6px}
.p-logo{height:clamp(104px,9.5vw,144px);width:auto;filter:drop-shadow(0 6px 24px rgba(0,0,0,.5));animation:logofloat 7s ease-in-out infinite}
.p-hero .label.pill{border:1.5px solid rgba(247,180,140,.45);border-radius:999px;padding:.62em 1.4em;background:rgba(14,6,2,.45);color:#F7C9A6;letter-spacing:.2em;font-weight:600;gap:9.6px;text-align:center}
.p-hero .label.pill::before,.p-hero .label.pill::after{width:14.4px}
.p-title{max-width:18ch;line-height:1.05}
.p-title .w{display:inline-block;overflow:hidden;vertical-align:bottom;padding:.12em .22em .32em;margin:-.12em -.22em -.32em}
.p-title .w>span{display:inline-block;transform:translateY(112%);transition:transform 1.15s var(--ease)}
.p-title .w:nth-child(2)>span{transition-delay:.1s}.p-title .w:nth-child(4)>span{transition-delay:.2s}
.p-hero.in .p-title .w>span,html.safe .p-title .w>span{transform:none}
.p-hero .lead{max-width:56ch;font-size:var(--fs-body);line-height:1.85;color:#EBDCCB}
.p-hero .lead strong{color:var(--cream)}
.p-hero .cta-stack{display:grid;justify-items:center;gap:16px;margin-top:6px}
.p-hero .small-note{color:#D9C4AE;max-width:44ch}
.scroll-cue{width:24px;height:38px;border-radius:14px;border:1.5px solid rgba(247,180,140,.5);position:relative;margin-top:14px}
.scroll-cue i{position:absolute;left:50%;top:8px;width:4px;height:8px;margin-left:-2px;border-radius:2px;background:#F7B48C;animation:cue 2s ease-in-out infinite}
@keyframes cue{0%{opacity:0;transform:translateY(-4px)}30%{opacity:1}100%{opacity:0;transform:translateY(12px)}}
@media (max-width:760px){.p-hero{min-height:0}.p-hero .label.pill{letter-spacing:.1em}}

/* 2 · exclusivity */
.p-exclusive{background:linear-gradient(180deg,#0E0602,#1A0A02);overflow:clip}
.p-exclusive .p-split{margin-top:0}
.p-quote{font-family:var(--font-display);font-size:var(--fs-lead);line-height:1.5;color:var(--cream)}
.p-quote::before{content:"“";display:block;font-size:var(--fs-display);line-height:.7;color:rgba(247,180,140,.55);margin-bottom:.15em}
.p-quote em{display:block;margin-top:.6em;font-style:italic;font-weight:600;background:linear-gradient(100deg,#FFE2C4,#F7B48C 40%,#FF8A4C 60%,#FFE2C4);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:goldsheen 6s ease-in-out infinite}

/* 3 · gains */
.p-gains{background:radial-gradient(ellipse 60% 50% at 50% 0%,rgba(242,96,24,.13),rgba(242,96,24,0) 70%),#140803}

/* 4 · journey, dark */
.p-journey,.pro-next{background:#0E0602}
.dark-j::before{background:rgba(247,180,140,.18)}
.dark-j .jstep:not(.now):not(.gala) .dot{background:radial-gradient(circle at 35% 30%,#3A1C0C,#1E0C04);border-color:rgba(247,180,140,.3);color:#F7C9A6;box-shadow:0 12px 24px -14px rgba(0,0,0,.7)}
.dark-j .jstep.gala .dot{background:linear-gradient(135deg,#FFE2B0,#F7B48C 45%,#C7461A);color:#1A0A02;box-shadow:0 0 30px -6px rgba(242,96,24,.6)}
.dark-j .jstep.reached:not(.now):not(.gala) .dot{border-color:var(--orange);color:var(--orange)}
.dark-j .jlabel,.dark-j .jstep.now .jlabel,.dark-j .jstep.gala .jlabel,.dark-j .jstep.reached .jlabel{color:#F7B48C}
.dark-j .jstep h3{color:var(--cream)}
.dark-j .jstep p{color:#EBDCCB}
.p-journey .journey{margin-top:clamp(48px,6vw,80px)}

/* 5 · the four levels */
.p-tiers{background:linear-gradient(180deg,#140803 0%,#0A0401 50%,#140803 100%);overflow:clip}
.tn.silver,.stage.silver{--t1:#C9CED6;--t2:#8E96A3;--t3:#F2F4F7;--glow:rgba(170,180,195,.3);--m1:#7E8794;--m2:#E9EDF2;--m3:#FFFFFF}
.tn.gold,.stage.gold{--t1:#E8BC52;--t2:#A6761A;--t3:#FFE7A3;--glow:rgba(232,188,82,.3);--m1:#9C6B12;--m2:#F2CE6B;--m3:#FFF4D2}
.tn.platinum,.stage.platinum{--t1:#E6E9ED;--t2:#A9AFB8;--t3:#FFFFFF;--glow:rgba(220,226,235,.24);--m1:#9AA0A8;--m2:#F7F8FA;--m3:#D5D9DE}
.tn.diamond,.stage.diamond{--t1:#F26018;--t2:#FFB46B;--t3:#FFE2C4;--glow:rgba(242,96,24,.42);--m1:#C7461A;--m2:#FFB46B;--m3:#FFE7CF}
/* navigator */
.tnav{display:flex;justify-content:center;gap:clamp(14px,3vw,44px);margin-top:clamp(40px,5vw,64px);flex-wrap:wrap}
.tn{display:grid;justify-items:center;gap:8px;text-align:center;transition:transform .6s var(--ease)}
.tn-arch{position:relative;width:clamp(78px,8vw,100px);aspect-ratio:397/421;border-radius:999px 999px 12px 12px;overflow:hidden;background:#1E0D06;
  box-shadow:0 0 0 1.5px var(--t1),0 18px 34px -18px var(--glow);transition:box-shadow .6s ease}
.tn-arch img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.tn b{font-family:var(--font-display);font-size:var(--fs-lead);font-weight:700;background:linear-gradient(100deg,var(--m1),var(--m2) 30%,var(--m3) 50%,var(--m2) 70%,var(--m1));background-size:250% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:metal 6s ease-in-out infinite}
.tn small{font-size:inherit;font-weight:700;letter-spacing:.14em;color:var(--t2)}
.tn:hover{transform:translateY(-8px)}
.tn:hover .tn-arch{box-shadow:0 0 0 2px var(--t3),0 0 0 8px color-mix(in srgb,var(--t1) 20%,transparent),0 26px 44px -16px var(--glow)}
.tn:hover .tn-arch img{transform:scale(1.08)}
@keyframes metal{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
/* stages */
.stages{display:grid;gap:clamp(100px,12vw,170px);margin-top:clamp(80px,9vw,130px)}
.stage{position:relative;display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(30px,5vw,80px);align-items:center;scroll-margin-top:110px}
.stage:nth-child(even){grid-template-columns:1.1fr .9fr}
.stage:nth-child(even) .st-visual{order:2}
.stage::before{content:"";position:absolute;inset:-18% -30%;z-index:0;pointer-events:none;background:radial-gradient(ellipse 38% 50% at 22% 50%,var(--glow),rgba(0,0,0,0) 72%)}
.stage:nth-child(even)::before{background:radial-gradient(ellipse 38% 50% at 78% 50%,var(--glow),rgba(0,0,0,0) 72%)}
.stage>*{position:relative;z-index:1}
.st-visual{position:relative;justify-self:center;width:min(400px,100%);aspect-ratio:1/1.08;display:grid;place-items:center}
.st-ring{position:absolute;inset:3%;border-radius:50%;opacity:0;scale:.6;transition:opacity 1s ease .15s,scale 1.4s cubic-bezier(.2,.9,.25,1) .15s}
.st-ring::before{content:"";position:absolute;inset:0;border-radius:50%;padding:2px;
  background:conic-gradient(from var(--a),var(--t1),rgba(0,0,0,0) 25%,var(--t3) 45%,rgba(0,0,0,0) 65%,var(--t2) 85%,var(--t1));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;animation:spin 9s linear infinite}
.st-ring::after{content:"";position:absolute;inset:10%;border-radius:50%;background:radial-gradient(closest-side,var(--glow),rgba(0,0,0,0));animation:breathe 5s ease-in-out infinite}
.st-orbit{position:absolute;inset:-3%;border-radius:50%;opacity:0;transition:opacity 1s ease .9s;animation:orbit 22s linear infinite}
.st-orbit i{position:absolute;width:14px;height:14px;margin:-7px 0 0 -7px;background:var(--t3);clip-path:polygon(50% 0,58% 42%,100% 50%,58% 58%,50% 100%,42% 58%,0 50%,42% 42%);filter:drop-shadow(0 0 6px var(--t1));animation:twinkle2 2.6s ease-in-out infinite}
.st-orbit i:nth-child(1){left:50%;top:0}.st-orbit i:nth-child(2){left:100%;top:50%;animation-delay:-.7s;scale:.7}.st-orbit i:nth-child(3){left:50%;top:100%;animation-delay:-1.4s}.st-orbit i:nth-child(4){left:0;top:50%;animation-delay:-2s;scale:.6}
@keyframes orbit{to{rotate:360deg}}
.stage.diamond .st-orbit{animation-duration:14s}
.st-arch{position:relative;z-index:2;width:62%;aspect-ratio:397/421;border-radius:999px 999px calc(var(--radius) * .7) calc(var(--radius) * .7);
  box-shadow:0 0 0 1.5px var(--t1),0 40px 70px -30px var(--glow),0 30px 50px -30px rgba(0,0,0,.9);opacity:0;transform:translateY(70px) scale(.84);
  transition:opacity 1s ease .3s,transform 1.4s cubic-bezier(.2,1.25,.3,1) .3s}
.st-arch::after{border-color:var(--t1);opacity:.6}
.st-arch img{animation:float 6s ease-in-out 1.8s infinite}
.st-floor{position:absolute;left:18%;right:18%;bottom:4%;height:30px;border-radius:50%;background:radial-gradient(closest-side,var(--glow),rgba(0,0,0,0));opacity:0;transition:opacity 1.2s ease .7s}
.st-visual.in .st-ring{opacity:1;scale:1}
.st-visual.in .st-orbit,.st-visual.in .st-floor{opacity:1}
.st-visual.in .st-arch{opacity:1;transform:none}
.st-visual.in .st-ring::after{animation:ringflash 1.6s ease .5s,breathe 5s ease-in-out 2.1s infinite}
@keyframes ringflash{0%{opacity:0;scale:.6}40%{opacity:1;scale:1.25}100%{opacity:.8;scale:1}}
html.safe .st-arch,html.safe .st-ring,html.safe .st-orbit,html.safe .st-floor{opacity:1!important;transform:none!important;scale:1!important}
.st-num{font-family:var(--font-display);font-style:italic;color:var(--t2);font-size:var(--fs-lead)}
.st-num i{font-style:inherit;opacity:.55}
.st-name{margin-top:.15em;font-family:var(--font-display);font-size:var(--fs-display);font-weight:700;line-height:1.02;
  background:linear-gradient(100deg,var(--m1) 0%,var(--m2) 22%,var(--m3) 42%,var(--m2) 58%,var(--m1) 78%,var(--m2) 100%);background-size:260% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;
  animation:metal 6s ease-in-out infinite;filter:drop-shadow(0 0 22px color-mix(in srgb,var(--t1) 25%,transparent))}
.st-name span{font-size:var(--fs-lead);font-style:italic;font-weight:500}
.st-price{position:relative;margin-top:16px;padding-bottom:16px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--t1)}
.st-price b{font-family:var(--font-display);font-size:var(--fs-lead);letter-spacing:0;color:var(--cream);margin-right:.25em;font-variant-numeric:lining-nums}
.st-price::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:1.5px;background:linear-gradient(90deg,var(--t1),rgba(0,0,0,0));transform:scaleX(0);transform-origin:left;transition:transform 1.4s var(--ease) .5s}
.st-price.in::after{transform:none}
.st-for{margin-top:18px;line-height:1.7;color:#EBDCCB;max-width:44ch}
.st-for strong{display:block;font-family:var(--font-display);font-size:var(--fs-lead);font-style:italic;font-weight:600;color:var(--t3);margin-bottom:.15em}
.st-plus{margin-top:14px;font-family:var(--font-display);font-style:italic;color:var(--t2)}
.st-list{list-style:none;margin-top:22px;columns:2;column-gap:28px}
.st-list li{break-inside:avoid;display:grid;grid-template-columns:20px 1fr;gap:10px;align-items:start;line-height:1.5;color:var(--cream);margin-bottom:11px}
.st-list li svg{width:20px;height:20px;margin-top:1px;fill:none;stroke:var(--t3);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;background:color-mix(in srgb,var(--t1) 22%,transparent);border-radius:50%;padding:3.5px}
.st-list li.reveal{transform:translateX(-16px);transition:opacity .8s ease calc(var(--k) * 55ms),transform 1s var(--ease) calc(var(--k) * 55ms)}
.stage:nth-child(even) .st-list li.reveal{transform:translateX(16px)}
.st-list li.reveal.in{transform:none}
.stage.silver .st-list,.stage.diamond .st-list{columns:1}
@media (prefers-reduced-motion:reduce){.st-name,.tn b,.st-orbit,.st-ring::before{animation:none}}
@media (max-width:860px){
  .stage,.stage:nth-child(even){grid-template-columns:1fr;text-align:center}
  .stage:nth-child(even) .st-visual{order:0}
  .st-visual{width:min(300px,80vw)}
  .st-price::after{background:linear-gradient(90deg,rgba(0,0,0,0),var(--t1),rgba(0,0,0,0))}
  .st-for{margin-inline:auto}
  .st-list{columns:1;text-align:left;max-width:440px;margin-inline:auto}
  .stage::before{inset:-10% -10%;background:radial-gradient(ellipse 60% 35% at 50% 22%,var(--glow),rgba(0,0,0,0) 72%)!important}
}

/* 6 · build your own experience */
.p-build{background:#1A0A02;overflow:clip;text-align:center}
.xp-strip{position:relative;z-index:1;margin:clamp(40px,5vw,60px) 0;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.xp-track{display:flex;gap:16px;width:max-content;animation:marquee 46s linear infinite}
.xp-strip:hover .xp-track{animation-play-state:paused}
.xp-track span{display:inline-flex;align-items:center;gap:14px;white-space:nowrap;padding:.85em 1.6em;border-radius:999px;font-family:var(--font-display);font-style:italic;font-size:var(--fs-lead);color:var(--cream);
  background:linear-gradient(135deg,rgba(74,36,16,.8),rgba(26,10,2,.9));box-shadow:inset 0 0 0 1px rgba(247,180,140,.32),0 18px 36px -24px rgba(242,96,24,.6)}
.xp-track span::before{content:"";width:12px;height:12px;background:#F7B48C;clip-path:polygon(50% 0,58% 42%,100% 50%,58% 58%,50% 100%,42% 58%,0 50%,42% 42%)}
.build-lead{max-width:56ch;margin-inline:auto;line-height:1.55}
.build-lead strong{color:#F7C9A6;font-weight:500}
@media (prefers-reduced-motion:reduce){.xp-track{animation:none}}

/* 7 · why early */
.p-early{background:linear-gradient(180deg,#0E0602,#1C0B04)}

/* 8 · the call + the form */
.p-final{background:radial-gradient(ellipse 80% 55% at 50% 0%,#3A1B0B,#0E0602 70%);overflow:clip;text-align:center}
.p-final .pcta{max-width:820px}
.pro-form{position:relative;z-index:1;width:min(660px,100%);margin:clamp(40px,5vw,60px) auto 0;text-align:left;color:var(--cream);
  background:linear-gradient(160deg,rgba(58,28,12,.92),rgba(16,7,2,.97));border:0;box-shadow:0 70px 130px -60px rgba(242,96,24,.6),0 30px 60px -30px rgba(0,0,0,.8);padding:clamp(28px,3.6vw,44px)}
.pro-form::after{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.5px;pointer-events:none;
  background:conic-gradient(from var(--a),rgba(242,96,24,.8),#FFE2B0,rgba(199,70,26,.4),#FFB46B,rgba(138,52,16,.4),#FFE2B0,rgba(242,96,24,.8));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;animation:spin 10s linear infinite}
.pro-form .form-grid{gap:14px;margin-top:0}
.pro-form .form-grid .two{gap:14px}
.pro-form .field{gap:6px}
.pro-form .field label{color:#F7C9A6;font-weight:600;letter-spacing:.04em}
.pro-form .field input,.pro-form .field select{background:rgba(250,240,228,.06);color:var(--cream);border:1.5px solid rgba(247,180,140,.2);padding:.8em 1em}
.pro-form .field input::placeholder{color:rgba(247,201,166,.5)}
.pro-form .field input:focus,.pro-form .field select:focus{border-color:var(--orange);background:rgba(250,240,228,.1);box-shadow:0 0 0 4px rgba(242,96,24,.18)}
.pro-form select option{color:#1A0A02}
.pro-form .field .err{color:#FFB46B}
.pro-form .check{color:#EBDCCB}
.pro-form .check input{background:transparent}
.pro-form .btn{margin-top:8px}
@media (max-width:760px){.pro-form{text-align:left}}

/* ---------- partner thank-you (pro) ---------- */
.ty-hero.to-ink::after{height:220px;background:linear-gradient(180deg,rgba(14,6,2,0),#0E0602)}
.thanks.pro .ty-hero{background:#0E0602}
.thanks.pro .ty-hero .label.pill{border-color:rgba(247,180,140,.45);color:#F7C9A6}
.receipt{display:grid;grid-template-columns:repeat(3,auto);margin-top:16px;border-radius:18px;overflow:hidden;background:rgba(14,6,2,.6);box-shadow:inset 0 0 0 1px rgba(247,180,140,.3),0 30px 60px -30px rgba(0,0,0,.8)}
.receipt[hidden]{display:none}
.receipt>div{padding:14px 24px;text-align:center}
.receipt>div+div{border-left:1px solid rgba(247,180,140,.18)}
.receipt dt{font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#F7B48C}
.receipt dd{margin-top:4px;font-family:var(--font-display);font-size:var(--fs-lead);color:var(--cream)}
@media (max-width:760px){.receipt{grid-template-columns:1fr}.receipt>div+div{border-left:0;border-top:1px solid rgba(247,180,140,.18)}}
.pro-next{text-align:center}
.pro-next .next-copy{color:#EBDCCB}
.pro-next .next-copy strong{color:var(--cream)}
.pro-next .next-sub{color:#F7B48C}
.pro-next .journey{margin-top:clamp(36px,4.6vw,56px)}
.pro-deck{background:#140803;overflow:clip}
.pro-deckcard{background:linear-gradient(150deg,#2A1407 0%,#120600 70%);box-shadow:0 60px 110px -50px rgba(242,96,24,.55)}
.pro-deckcard::after{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.5px;pointer-events:none;z-index:2;
  background:conic-gradient(from var(--a),rgba(242,96,24,.8),#FFE2B0,rgba(199,70,26,.4),#FFB46B,rgba(138,52,16,.4),#FFE2B0,rgba(242,96,24,.8));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;animation:spin 10s linear infinite}
.pro-deckcard .label{color:#F7B48C}
.pro-deckcard .copy p{color:#EBDCCB}
.pro-deckcard .copy strong{color:var(--cream)}
.pro-know{background:#0E0602;text-align:center}
.know-card{position:relative;max-width:780px;margin-inline:auto;padding:clamp(40px,5vw,64px) clamp(24px,5vw,72px);border-radius:calc(var(--radius) * 1.2);
  background:radial-gradient(ellipse 80% 60% at 50% 0%,rgba(242,96,24,.16),rgba(242,96,24,0) 70%),linear-gradient(160deg,#24100A,#120600);box-shadow:inset 0 0 0 1px rgba(247,180,140,.22),0 50px 100px -50px rgba(0,0,0,.9)}
.know-card .know-lead{margin:.9em auto 0;max-width:40ch;font-family:var(--font-display);font-size:var(--fs-lead);font-weight:600;line-height:1.5;color:var(--cream)}
.know-card .know-lead em{display:block;margin-top:.4em;font-style:italic;font-weight:600;background:linear-gradient(100deg,#FFE2C4,#F7B48C 40%,#FF8A4C 60%,#FFE2C4);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:goldsheen 6s ease-in-out infinite}
.know-card .closing{max-width:52ch;margin:1.6em auto 0;line-height:1.8;color:#EBDCCB}
.pro-sign{text-align:center;background:radial-gradient(ellipse 70% 70% at 50% 115%,rgba(242,96,24,.4),rgba(242,96,24,0) 62%),linear-gradient(160deg,#2A1407 0%,#0E0602 60%);overflow:clip}
.pro-sign .regards{font-family:var(--font-display);font-style:italic;font-size:var(--fs-lead);color:#F7B48C}
.pro-sign .sig{font-family:var(--font-display);font-size:var(--fs-display);font-weight:700;line-height:1.1;color:var(--cream);margin:.15em 0 .5em}
.pro-sign .label{color:var(--orange)}
.contact-q{max-width:60ch;margin:clamp(32px,4vw,48px) auto 0;line-height:2.4;color:#EBDCCB}
.chip{display:inline-flex;align-items:center;gap:9px;padding:.5em 1.1em;margin:0 .2em;border-radius:999px;color:var(--cream);font-weight:700;white-space:nowrap;line-height:1.2;
  background:rgba(250,240,228,.05);box-shadow:inset 0 0 0 1px rgba(247,180,140,.4);transition:background .4s,box-shadow .4s,transform .5s var(--ease)}
.chip svg{width:16px;height:16px;fill:none;stroke:#F7B48C;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.chip:hover{background:var(--orange);box-shadow:none;transform:translateY(-2px)}
.chip:hover svg{stroke:var(--cream)}
.pro-sign .date{display:inline-flex;align-items:center;flex-wrap:wrap;justify-content:center;gap:.6em 1.4em;margin-top:clamp(36px,4.4vw,52px);padding-top:24px;border-top:1px solid rgba(247,180,140,.18);
  font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:#D9C4AE}
.pro-sign .date i{width:4.8px;height:4.8px;border-radius:50%;background:var(--orange);flex:none}
@media (max-width:760px){.pro-sign .date{flex-direction:column;gap:.2em}.pro-sign .date i{display:none}}
@media (max-width:760px){
  .tnav{flex-wrap:nowrap;gap:10px}
  .tn-arch{width:min(70px,20vw)}
  .tn b{font-size:var(--fs-body)}
  .tn small{letter-spacing:.04em}
}

/* v402 · partner pages: no repeating monogram — a fine film grain and soft vignettes give the dark its depth */
.pro-body .pattern{display:none!important}
.pro-body::before{content:"";position:fixed;inset:0;z-index:40;pointer-events:none;opacity:.055;
  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='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 .92  0 0 0 0 .85  0 0 0 .9 0'/></filter><rect width='220' height='220' filter='url(%23n)'/></svg>")}
.pro .p-sec{background-image:radial-gradient(ellipse 120% 80% at 50% 50%,rgba(0,0,0,0) 55%,rgba(0,0,0,.35) 100%)}
.pro .p-exclusive{background:radial-gradient(ellipse 60% 70% at 85% 50%,rgba(242,96,24,.12),rgba(242,96,24,0) 70%),linear-gradient(180deg,#0E0602,#1A0A02)}
.pro .p-journey,.pro .pro-next{background:radial-gradient(ellipse 70% 60% at 50% 30%,rgba(247,180,140,.07),rgba(247,180,140,0) 70%),#0E0602}
.pro .p-build{background:radial-gradient(ellipse 70% 70% at 50% 40%,rgba(242,96,24,.12),rgba(242,96,24,0) 70%),#1A0A02}
.pro .pro-know{background:radial-gradient(ellipse 60% 60% at 50% 50%,rgba(247,180,140,.07),rgba(247,180,140,0) 70%),#0E0602}
@media (hover:none),(max-width:760px){.pro-body::before{opacity:.04}}
html.lite .pro-body::before{display:none}

/* v403 · partner pages: more air above the logo; the monogram returns, larger and much fainter,
   fading in only toward the edges of each section, with a different strength per section */
.p-hero{padding-top:clamp(150px,15vw,220px)}
@media (max-width:760px){.p-hero{padding-top:120px}}
.pro-body .pattern{display:block!important;background-size:340px 392px;opacity:.035;
  -webkit-mask-image:radial-gradient(ellipse 75% 70% at 50% 50%,transparent 0 35%,#000 95%);mask-image:radial-gradient(ellipse 75% 70% at 50% 50%,transparent 0 35%,#000 95%)}
.pro .p-exclusive .pattern{opacity:.05;-webkit-mask-image:linear-gradient(90deg,#000,transparent 55%);mask-image:linear-gradient(90deg,#000,transparent 55%)}
.pro .p-gains .pattern{opacity:.03}
.pro .p-journey .pattern{opacity:.045;-webkit-mask-image:linear-gradient(180deg,#000,transparent 70%);mask-image:linear-gradient(180deg,#000,transparent 70%)}
.pro .p-tiers .pattern{opacity:.022}
.pro .p-build .pattern{opacity:.05;-webkit-mask-image:linear-gradient(90deg,transparent 30%,#000);mask-image:linear-gradient(90deg,transparent 30%,#000)}
.pro .p-early .pattern{opacity:.035;-webkit-mask-image:linear-gradient(0deg,#000,transparent 65%);mask-image:linear-gradient(0deg,#000,transparent 65%)}
.pro .p-final .pattern{opacity:.03}
.pro .pro-deck .pattern,.pro .pro-know .pattern{opacity:.04}
.pro .pro-sign .pattern{opacity:.03}
.pro .deck-card .pattern,.pro .know-card .pattern{opacity:.05;-webkit-mask-image:none;mask-image:none}
.pro-body .footer .pattern{opacity:.03;-webkit-mask-image:none;mask-image:none}
.pro-body::before{opacity:.04}

/* =====================================================================
   TYPOGRAPHY & COLOUR SYSTEM — enforced (same rules as the tickets site)
   Title    · Playfair Display 700, upright · --fs-display
   Subtitle · Playfair Display 700, upright · --fs-lead
   Body     · DM Sans 400 / 700             · --fs-body
   Colour   · cream on dark, ink on light, ONE accent: --orange. No pale oranges, no gradient text, no grey text.
   Metals (silver, gold, platinum, diamond) live in the trophy art and borders, never in text. No ranking numbers.
   ===================================================================== */
body *{font-style:normal!important}
/* no gradient text: accents are the one orange */
.display em,h2 em,.p-quote em,.st-name,.tn b,.sub-title2 em{background:none!important;-webkit-text-fill-color:currentColor!important;animation:none!important}
.display em,h2 em,.p-quote em,.sub-title2 em{color:var(--orange)!important}
/* text on dark is cream */
.on-dark .lead,.lead,.small-note,.p-quote,.p-promise p,.g2 h4,.g2 p,.jstep p,.st-for,.st-price,.st-name,.tn b,.build-lead,.pcta .lead,label.check span,.field>label,.rung p{color:var(--cream)!important}
/* kickers, labels, accents: orange */
.label,.label.center,.label.pill,.jlabel,.tn small,.st-name span,.st-for strong,.p-promise strong,p strong,.lead strong,.build-lead strong{color:var(--orange)!important}
/* weights: DM Sans 400 / 700; Playfair 700 */
.label,.label.pill,.jlabel,.field>label,.st-for strong,.lead strong,.build-lead strong,p strong,.st-plus,.early-head .lead,.tn small{font-weight:700!important}
.small-note,.meta span,label.check span{font-weight:400!important}
h1,h2,h3,h4,.display,.p-quote,.p-quote em,.p-promise p,.st-name,.st-name span,.st-price b,.g2 h4,.xp-track span,.sold span,.tn b{font-weight:700!important}
/* the brand line on the levels ("Fii văzut.") and kickers are body text, bold */
.st-for strong{font-family:var(--font-text)}
.st-plus,.early-head .lead{font-family:var(--font-text)!important;font-size:var(--fs-body)!important;color:var(--cream)!important;line-height:1.6}
.sold span{font-family:var(--font-display);font-size:var(--fs-lead)}
/* hero pill: white fill, orange text (as on the tickets site) */
.p-hero .label.pill{background:#fff!important;border-color:rgba(242,96,24,.55)!important;box-shadow:0 6px 18px rgba(26,10,2,.18)}

/* ladder without numbers: shorter steps that still climb; on desktop each grows taller on hover, from its base */
.rung{min-height:calc(150px + var(--k) * 30px);gap:14px;padding:26px 16px 24px;transform-origin:50% 100%}
@media (max-width:860px){.rung{grid-template-columns:auto 1fr;min-height:0}}
@media (min-width:861px){
  .rung.reveal,.rung.reveal.in{transition:opacity .7s ease calc(var(--k) * .14s),transform 1.1s cubic-bezier(.34,1.3,.64,1) calc(var(--k) * .14s),min-height .6s cubic-bezier(.22,1,.36,1),box-shadow .5s var(--ease)}
  .rung:hover{min-height:calc(150px + var(--k) * 30px + 34px);box-shadow:0 30px 60px -30px rgba(242,96,24,.75)}
}
/* thank-you page */
dt,.next-sub,.regards,.know-lead em{color:var(--orange)!important}
.next-copy,.copy p,.closing,.contact-q,.date span,.know-lead{color:var(--cream)!important}
.know-lead em{background:none!important;-webkit-text-fill-color:currentColor!important}
.next-sub,.regards,.know-lead,.know-lead em{font-weight:700!important}
.date span{font-weight:700!important}

/* any section out of view stops its looping animations (resumes as it comes back) */
.offscreen,.offscreen *,.offscreen *::before,.offscreen *::after{animation-play-state:paused!important}
@media (hover:none),(max-width:760px){.twinkles{display:none}}

/* TOUCH DEVICES · rendering diet: reveals travel + fade (no animated blur), no backdrop blur, no drop-shadow filters on animated art */
@media (hover:none){
  .reveal,.journey .jstep>*,.arow.reveal>*,.level-wrap.reveal,.ucard,.st-copy>*,.stage,.xp-track span{filter:none!important}
  *,*::before,*::after{-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
  .header.scrolled,.header.has-cta.show-cta,.header.has-cta.past-hero{background:rgba(14,6,2,.96)!important}
  .motes i:nth-child(2n){display:none}
}
@media (hover:none){.cells .num,.num.tick{filter:none!important}}

/* TOUCH DEVICES · playing videos carry no per-frame effects (no blend layers, no filter, no slow zoom) */
@media (hover:none){
  .video-frame .grain{display:none!important}
  .video-frame video,.p-hero video{filter:none!important;animation:none!important}
  .video-frame .tint{display:block!important;mix-blend-mode:normal!important;opacity:.22!important}
}