@font-face{font-family:Space;src:url("assets/space-bold.ttf") format("truetype");font-weight:700;font-display:swap}
@font-face{font-family:Archivo;src:url("assets/archivo-latin-standard-normal.woff2") format("woff2-variations");font-weight:100 900;font-stretch:62% 125%;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Archivo;src:url("assets/archivo-latin-ext-standard-normal.woff2") format("woff2-variations");font-weight:100 900;font-stretch:62% 125%;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}

:root{--gutter:3.2vw;--display:Archivo,Space,Arial,sans-serif}
*{box-sizing:border-box}html{background:#e2668a;color:#fff;scroll-behavior:smooth}body{position:relative;margin:0;font-family:Space,Arial,sans-serif;-webkit-font-smoothing:antialiased}
main{position:relative;z-index:1}
a{color:inherit;text-decoration:none;display:inline-flex;align-items:center;gap:12px;padding:8px 0;border-bottom:1px solid #ffffff70}a:hover{border-color:#fff}a:focus-visible{outline:2px solid white;outline-offset:6px}
svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.7}::selection{background:#fff;color:#794e9f}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Animated background spans the whole page and scrolls with it; nothing is pinned to the screen edges, so Safari floats its toolbar over the page instead of drawing a solid bar. */
.backgrounds{position:absolute;top:0;left:0;width:100%;height:100%;z-index:0;pointer-events:none;overflow:hidden;transform-origin:center;will-change:transform}
.color{position:absolute;inset:-80px;filter:blur(40px);background-position:center;background-size:cover;background-repeat:no-repeat;opacity:0;will-change:opacity}.color-one{background-image:url("assets/boost-brand-background.jpeg");opacity:1}.color-two{background-image:url("assets/boost-background-2.jpeg")}.color-three{background-image:url("assets/boost-background-3.jpeg")}.color-four{background-image:url("assets/boost-background-4.jpeg")}
.fluid-colors{position:absolute;inset:0;width:100%;height:100%;display:block;pointer-events:none}

/* Hero */
.teaser{position:relative;min-height:100vh;min-height:100svh;display:grid;place-items:center;padding:env(safe-area-inset-top) 0 env(safe-area-inset-bottom)}
.corners,.hero-footer{position:absolute;left:var(--gutter);right:var(--gutter);display:flex;justify-content:space-between;align-items:center;gap:20px;font-size:11px;font-weight:700;letter-spacing:.035em;line-height:1.3}
.corners{top:calc(env(safe-area-inset-top) + 22px)}.hero-footer{bottom:calc(env(safe-area-inset-bottom) + 30px)}
.corners p,.hero-footer p{margin:0}.soon{position:absolute;left:50%;transform:translateX(-50%)}
.corners a svg{width:14px;height:14px;animation:nudge 2.4s ease-in-out infinite}
@keyframes nudge{0%,100%{transform:translateY(-1px)}50%{transform:translateY(3px)}}
h1{position:relative;width:40%;max-width:760px;margin:0;line-height:0}h1 img{display:block;width:100%;height:auto;filter:brightness(0) invert(1)}

/* Teaser section: one quiet "slide" in the deck's style */
.about{position:relative;min-height:100vh;min-height:100svh;display:flex;flex-direction:column;justify-content:space-between;gap:clamp(48px,9vh,110px);padding:calc(env(safe-area-inset-top) + 22px) var(--gutter) calc(env(safe-area-inset-bottom) + 30px)}
.about::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,#0000 0%,#1a0b3326 60%,#1a0b3340 100%);pointer-events:none}
.rule,.end{display:flex;justify-content:space-between;align-items:center;gap:20px;font-size:11px;font-weight:700;letter-spacing:.035em;line-height:1.3}
.rule{padding-bottom:14px;border-bottom:1px solid #ffffff80}
.end{padding-top:14px;border-top:1px solid #ffffff80}.end p{margin:0}
.those{list-style:none;margin:auto 0;padding:0;display:flex;flex-direction:column;gap:clamp(30px,5vh,64px)}
.those li{font-family:var(--display);font-stretch:125%;font-weight:800;text-transform:uppercase;font-size:clamp(34px,4.8vw,84px);line-height:.96;letter-spacing:-.005em;opacity:0;transform:translateY(32px);transition:opacity 1s ease,transform 1s cubic-bezier(.2,.7,.2,1)}
.those li span{display:block;font-weight:300}
.those li.in{opacity:1;transform:none}

/* Countdown */
.countdown::before{background:linear-gradient(180deg,#1a0b3340 0%,#1a0b3326 100%)}
.clock{margin:auto 0}
.clock-kicker{margin:0 0 clamp(22px,4vh,40px);font-family:var(--display);font-stretch:125%;font-weight:300;text-transform:uppercase;font-size:clamp(16px,1.6vw,24px);letter-spacing:.02em}
.units{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr}
.unit{display:flex;flex-direction:column;gap:14px;padding:0 clamp(12px,2vw,32px);border-left:1px solid #ffffff60}.unit:first-child{padding-left:0;border-left:0}
.n{font-family:var(--display);font-stretch:112%;font-weight:800;font-size:clamp(58px,9.4vw,168px);line-height:.9;font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.n.tick{animation:tick .45s cubic-bezier(.2,.7,.2,1)}
@keyframes tick{from{opacity:.35;transform:translateY(-.08em)}to{opacity:1;transform:none}}
.l{font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;opacity:.85}
.tick-bar{margin-top:clamp(28px,5vh,56px);height:2px;background:#ffffff30;overflow:hidden}.tick-bar span{display:block;height:100%;background:#fff;transform-origin:left;transform:scaleX(0)}

/* Hidden date: scrambling, blurred letters and digits until the date is announced */
.redact{display:inline-block;min-width:6.4ch;padding:0 .45em;border-radius:3px;background:#ffffff22;color:transparent;text-shadow:0 0 4px #fff,0 0 1px #fffc;text-align:center;animation:redact 2.6s ease-in-out infinite}
@keyframes redact{50%{background:#ffffff38}}
.scrambled .n{filter:blur(.06em);opacity:.92}
.scrambled + .tick-bar span{animation:sweep 2.2s cubic-bezier(.6,0,.4,1) infinite}
@keyframes sweep{0%{transform:scaleX(0);transform-origin:left}50%{transform:scaleX(1);transform-origin:left}50.01%{transform-origin:right}100%{transform:scaleX(0);transform-origin:right}}

/* Boost interaction */
.boost-logo{--charge:0;--energy:0}.boost-trigger{display:block;width:100%;padding:15px 0;margin:-15px 0;border:0;background:transparent;cursor:pointer;touch-action:none;-webkit-touch-callout:none;user-select:none;-webkit-user-select:none;transform:translate3d(0,0,0);transform-origin:center;will-change:transform;backface-visibility:hidden}.boost-trigger img{pointer-events:none;filter:brightness(0) invert(1)}.boost-trigger:focus-visible{outline:1px solid #fff;outline-offset:16px;border-radius:2px}.boost-meter{position:absolute;top:calc(100% + 40px);left:50%;width:110px;height:2px;transform:translateX(-50%);background:#ffffff25;opacity:0;transition:opacity .25s}.boost-meter span{display:block;width:100%;height:100%;background:#fff;transform-origin:left;transform:scaleX(var(--charge))}.charging .boost-meter{opacity:1}

@media(max-width:700px){
  :root{--gutter:22px}
  h1{width:72%}
  .corners,.hero-footer{font-size:9px;letter-spacing:.01em}.corners{top:calc(env(safe-area-inset-top) + 18px)}.hero-footer{bottom:calc(env(safe-area-inset-bottom) + 25px)}
  .soon{display:none}a{gap:9px}svg{width:14px;height:14px}
  .units{grid-template-columns:1fr 1fr;row-gap:34px}.unit:nth-child(3){padding-left:0;border-left:0}.n{font-size:clamp(64px,19vw,96px)}.those{gap:34px}.those li{font-size:clamp(28px,8.4vw,40px)}.rule,.end{font-size:9px;letter-spacing:.01em}.boost-meter{top:calc(100% + 30px)}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.corners a svg{animation:none}.those li{opacity:1;transform:none}.n.tick{animation:none}.redact,.scrambled + .tick-bar span{animation:none}}
