/* KixScan v4 — sneaker editorial, designed from the small screen out. */
:root {
  --ink:#111923; --muted:#596473; --blue:#2357eb; --blue-deep:#1641c0;
  --paper:#f8f9fb; --line:#dce1e8; --night:#030e1d; --ice:#acd7ff;
  --gold:#f4cd86; --nav-h:68px; --gutter:clamp(20px,5vw,32px); --radius:20px;
  font-family:-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Noto Sans KR","Malgun Gothic","Segoe UI",sans-serif;
  font-synthesis:none; color-scheme:light;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--nav-h) + 24px);background:var(--paper)}
body{margin:0;color:var(--ink);background:var(--paper);line-height:1.65;-webkit-font-smoothing:antialiased}
body.modal-open{overflow:hidden}
button,input,a,summary{-webkit-tap-highlight-color:transparent}
button,input{font:inherit}
button,a,summary{touch-action:manipulation}
button,summary{cursor:pointer}
a{color:inherit}
button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid #d98c2b;outline-offset:4px}
[hidden]{display:none!important}
h1,h2,h3,p,figure{margin:0}
h1,h2,h3{word-break:keep-all;overflow-wrap:anywhere;text-wrap:balance}
p,strong,span{overflow-wrap:anywhere}
img,video{max-width:100%}
svg{flex:0 0 auto}
.wrap{width:min(100% - var(--gutter)*2,1200px);margin-inline:auto}
.skip-link{position:fixed;z-index:200;top:8px;left:16px;padding:10px 18px;border-radius:8px;background:var(--ink);color:white;transform:translateY(-180%)}
.skip-link:focus{transform:translateY(0)}
.scroll-progress{position:fixed;inset:0 0 auto;height:3px;z-index:110;background:var(--blue);transform:scaleX(0);transform-origin:left;pointer-events:none}
.nav{position:sticky;top:0;z-index:90;background:rgba(248,249,251,.96);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);padding-top:env(safe-area-inset-top,0px);border-bottom:1px solid transparent;transition:border-color .2s}
.nav.scrolled{border-color:var(--line)}
.nav-inner{min-height:var(--nav-h);display:flex;align-items:center;justify-content:space-between;gap:16px}
.brand{min-height:44px;display:inline-flex;align-items:center;flex:0 0 auto}
.brand-logo{display:block;width:clamp(122px,29vw,154px);height:auto}
.nav-links{display:none}
.nav-actions{display:flex;align-items:center;gap:22px}
.beta-mini{display:none;font-size:.8125rem;font-weight:700}
.lang-toggle{display:inline-flex;padding:3px;background:#e9edf3;border-radius:30px}
.lang-toggle button{min-height:44px;min-width:44px;padding:0 12px;border:0;border-radius:24px;background:transparent;color:#516070;font-size:.875rem;font-weight:750;transition:background .2s,color .2s}
.lang-toggle button.active{background:var(--ink);color:white}

/* Immersive product opening. The complete sneaker stays in frame on mobile. */
.hero-stage{background:var(--night);color:white;overflow:clip}
.hero{display:grid;gap:24px;padding-top:32px;padding-bottom:28px}
.hero-copy{min-width:0;position:relative;z-index:2}
.eyebrow{display:flex;align-items:center;flex-wrap:wrap;gap:10px;font-size:.8125rem;font-weight:650;color:#c2d5eb;line-height:1.5;margin-bottom:21px}
.beta-label{font-size:.75rem;font-weight:800;letter-spacing:.07em;background:#c3e2ff;color:#081629;border-radius:4px;padding:5px 8px}
h1{font-size:clamp(2.05rem,9vw,4rem);font-weight:850;line-height:1.2;letter-spacing:-.045em}
.gradient-text{color:var(--blue)}
.hero-stage .gradient-text{color:var(--ice)}
.hero-promise{font-size:1rem;line-height:1.8;color:#bbcadc;word-break:keep-all;margin-top:21px;max-width:510px}
.cta-row{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-top:25px}
.cta{display:inline-flex;justify-content:center;align-items:center;gap:18px;min-height:56px;padding:14px 22px;border-radius:10px;text-decoration:none;font-size:1rem;font-weight:750;line-height:1.4;border:1px solid transparent;transition:background .2s,transform .2s}
.cta svg{width:20px;height:20px}
.cta-primary{background:var(--blue);color:white}
.cta-primary:active{transform:scale(.98)}
.hero-copy .cta-primary{background:#e3f1ff;color:#092346;flex:1 1 100%}
.cta-secondary{color:#e0e9f4;padding-inline:8px;font-size:.875rem;min-height:44px}
.hero-copy .cta-secondary{margin-inline:auto}
.micro-note{font-size:.8125rem;color:var(--muted);margin-top:14px;line-height:1.6}
.hero-copy .micro-note{color:#9eafc3;text-align:center}
.hero-media{min-width:0;position:relative;margin-top:-6px}
.hero-image.video-shell{aspect-ratio:608 / 496;background:var(--night);margin-bottom:18px}
.hero-media figcaption{display:flex;flex-wrap:wrap;justify-content:space-between;gap:7px;font-size:.75rem;line-height:1.5;letter-spacing:.035em;color:#97adc6;padding-bottom:8px}
.hero-visual-label{color:#d6e4f4;font-weight:750}
.hero-bottom{display:flex;align-items:center;gap:24px;padding-top:22px;border-top:1px solid #27374b}
.hero-motto{font-size:1.3rem;font-weight:850;line-height:1.12;letter-spacing:-.025em;white-space:nowrap}
.hero-motto span{color:var(--ice)}
.hero-bottom>p:not(.hero-motto){font-size:.8125rem;line-height:1.7;color:#a8b9ce;max-width:230px}
.scroll-cue{min-width:44px;min-height:44px;display:none;align-items:center;justify-content:center;border:1px solid #33465d;border-radius:50%;margin-left:auto}
.scroll-cue svg{width:22px;height:22px}

/* Every character film has a complete, permanently visible media frame. */
.guide-section{padding-block:64px;background:#edf2f8;border-bottom:1px solid #e0e7ee}
.guide-row{display:grid;grid-template-columns:minmax(0,1fr);align-items:center;gap:28px}
.guide-film{min-width:0;order:2}
.guide-copy{min-width:0;order:1}
.eyebrow-text{font-size:.75rem;letter-spacing:.07em;font-weight:750;color:var(--blue-deep);display:block;margin-bottom:6px}
.guide-copy h2{font-size:clamp(1.85rem,7.7vw,3.05rem);line-height:1.35;letter-spacing:-.03em;font-weight:800}
.guide-copy p{font-size:1rem;color:var(--muted);line-height:1.8;margin-top:16px;word-break:keep-all}

/* Photography, clear copy, and always-visible story films. */
.story{padding-block:64px}
.editorial-grid{display:grid;gap:28px;align-items:start}
.story-copy{min-width:0}
.section-kicker{display:flex;align-items:baseline;gap:12px;margin-bottom:19px;color:var(--blue-deep);font-size:.875rem;font-weight:750;line-height:1.5}
.section-no{font-size:.75rem;font-variant-numeric:tabular-nums;color:#657184;padding-bottom:4px;border-bottom:1px solid #9eacbf;flex:0 0 auto}
h2{font-size:clamp(1.85rem,7.7vw,3.05rem);line-height:1.3;letter-spacing:-.038em;font-weight:850}
.story-copy>p{margin-top:22px;font-size:1rem;line-height:1.9;color:var(--muted);word-break:keep-all}
.callout{border-left:2px solid #a8bfdc;padding-left:16px;margin-top:26px;font-size:.9375rem;line-height:1.8;color:var(--muted);word-break:keep-all}
.callout strong{display:block;color:var(--ink);font-weight:750;margin-bottom:5px}
.lifestyle-carousel{border-radius:var(--radius);background:#e5e3df;overflow:hidden}
.carousel-viewport{position:relative;aspect-ratio:2 / 3;touch-action:pan-y}
.carousel-slide{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .65s ease,visibility .65s;pointer-events:none}
.carousel-slide.is-active{opacity:1;visibility:visible;pointer-events:auto}
.carousel-slide img{display:block;width:100%;height:100%;object-fit:contain}
.carousel-controls{display:flex;align-items:center;justify-content:space-between;gap:4px;padding:8px 12px;background:white;border:1px solid var(--line);border-top:0;border-radius:0 0 var(--radius) var(--radius)}
.carousel-count{font-size:.75rem;font-variant-numeric:tabular-nums;letter-spacing:.035em;color:var(--muted);white-space:nowrap}
.carousel-count>span{font-weight:800;color:var(--ink)}
.carousel-dots{display:flex}
.carousel-dots button,.carousel-toggle{width:44px;height:44px;display:grid;place-items:center;border:0;background:transparent;border-radius:50%;color:var(--ink);padding:0;flex-shrink:0}
.carousel-dots button>span{width:7px;height:7px;border-radius:5px;background:#aab4c1;transition:width .25s,background .25s}
.carousel-dots button[aria-current="true"]>span{width:22px;background:var(--blue)}
.carousel-toggle{background:#edf2f8}
.carousel-toggle svg{width:16px;height:16px}
.carousel-toggle .pause-icon,.carousel-toggle.playing .play-icon{display:none}
.carousel-toggle.playing .pause-icon{display:block}
.lifestyle-media figcaption,.mission-media figcaption{display:flex;justify-content:space-between;flex-wrap:wrap;gap:6px;font-size:.75rem;line-height:1.6;color:#657386;margin-top:13px}
.lifestyle-media figcaption>span:first-child,.mission-media figcaption>span:first-child{font-weight:750;letter-spacing:.035em}
.story-film{width:100%;margin-top:28px}
.film-caption{font-size:.8125rem;margin-top:10px;color:var(--muted)}
.video-shell{position:relative;overflow:hidden;isolation:isolate;background:#e3eaf4;border-radius:var(--radius)}
.video-shell video{display:block;width:100%;height:100%;object-fit:contain}
.video-square{aspect-ratio:1}
.video-wide{aspect-ratio:736 / 400}
.video-how{aspect-ratio:736 / 416}
.video-toggle{position:absolute;z-index:4;right:12px;bottom:12px;width:44px;height:44px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.5);border-radius:50%;background:rgba(8,20,39,.86);color:white;backdrop-filter:blur(8px)}
.video-toggle svg{width:17px;height:17px}
.video-toggle .pause-icon{display:none}
.video-toggle.playing .play-icon{display:none}
.video-toggle.playing .pause-icon{display:block}
.video-error{position:absolute;bottom:64px;right:12px;left:12px;border-radius:8px;padding:8px 12px;background:var(--ink);color:white;font-size:.875rem}
.media-caption{font-size:.75rem;font-weight:750;letter-spacing:.06em;color:#5f6c7c;margin-top:14px}

/* Four steps, one clear path to accepted contributions. */
.story--how{background:#edf1f7}
.section-heading{max-width:660px;margin-bottom:30px}
.section-subtitle{font-size:1rem;color:var(--muted);margin-top:16px}
.how-grid{display:grid;gap:28px}
.how-media{min-width:0}
.how-body{font-size:1rem;line-height:1.9;color:var(--muted);word-break:keep-all;margin-top:22px}
.steps{display:grid;gap:0}
.step{display:flex;align-items:flex-start;gap:18px;padding:22px 0;border-top:1px solid #cbd5e3;min-width:0}
.step:last-child{border-bottom:1px solid #cbd5e3}
.step-num{font-size:.8125rem;color:var(--blue);font-weight:750;line-height:1.8;min-width:24px;padding-top:3px}
.step>div{flex:1;min-width:0}
.step h3{font-size:1.125rem;font-weight:800;line-height:1.5}
.step p{font-size:.9375rem;line-height:1.7;color:var(--muted);margin-top:5px;word-break:keep-all}
.step-direction{font-size:1.35rem;line-height:1.6;color:#7084a0}
.step:last-child .step-direction{color:var(--blue)}
.story--missions{background:white}
.mission-photo{aspect-ratio:1360 / 1456;overflow:hidden;border-radius:var(--radius);background:#dee4e9}
.mission-photo img{display:block;width:100%;height:100%;object-fit:contain}
.mission-media figcaption{color:#566678}

/* Economic rewards and gamification have separate, explicit panels. */
.story--rewards{background:var(--night);color:white}
.reward-heading{max-width:700px;margin-bottom:32px}
.story--rewards .section-kicker{color:#a5c8f4}
.story--rewards .section-no{color:#8aa8c9;border-color:#506985}
.story--rewards h2{font-size:clamp(2.15rem,9.2vw,3.7rem)}
.story--rewards .gradient-text{color:var(--gold)}
.reward-grid{display:grid;gap:20px}
.points-panel,.sparx-panel{min-width:0;padding:24px 22px;border-radius:var(--radius)}
.points-panel{background:#132238;border:1px solid #293c53}
.sparx-panel{background:#0a182c;border:1px solid #23344d;align-self:start}
.currency-head{display:flex;align-items:center;gap:15px}
.currency-symbol{width:46px;height:46px;flex-shrink:0;display:grid;place-items:center;border-radius:50%;background:#f3d6a2;color:#31220c;font-size:1.375rem;font-weight:850}
.sparx-symbol{background:#28355b;color:#c4bcff;font-size:2rem;font-weight:500}
.currency-category{font-size:.8125rem;color:#b4c4da;margin-bottom:5px;line-height:1.5}
.currency-head h3{font-size:1.5rem;line-height:1.2;letter-spacing:-.025em;font-weight:800}
.points-body{font-size:1rem;line-height:1.9;color:#c5d1e1;word-break:keep-all;margin-top:24px}
.points-flow{margin-top:28px}
.flow-card{display:flex;align-items:center;gap:13px;min-height:77px;border-top:1px solid #35465d;padding-block:14px}
.flow-count{color:#91a6c1;font-size:.75rem}
.flow-card>div{flex:1}
.flow-card b{display:block;font-size:1rem;line-height:1.6;color:#e8eff9}
.flow-card>div>span{display:block;font-size:.75rem;color:#9cafc8;margin-top:3px}
.flow-card:last-child b{color:var(--gold)}
.flow-arrow{color:#8ca7c7}
.story--rewards .film-caption{color:#aabbd2}
.sparx-lead{font-size:1.5rem;color:#e3e4ff;line-height:1.4;letter-spacing:-.025em;font-weight:750;margin-top:34px;word-break:keep-all}
.sparx-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.sparx-tags span{font-size:.8125rem;line-height:1.5;border:1px solid #40506a;color:#bfcde0;border-radius:6px;padding:6px 10px}
.currency-note{margin-top:28px;font-size:.9375rem;line-height:1.9;word-break:keep-all}
.currency-note strong{display:block;color:#c7d1e3;font-weight:500}
.currency-note>span{display:block;color:#97aac5;margin-top:15px}
.currency-separation{margin-top:30px;padding-top:19px;border-top:1px solid #293953;color:#c5bcff;font-size:.75rem;font-weight:750;letter-spacing:.055em}

/* Collection and contribution stay distinct within the community story. */
.story--community{background:#f1f3f7}
.community-grid{display:grid;gap:26px}
.collection-panel,.contributors-panel{min-width:0;padding:28px 22px;border:1px solid #e0e5ec;border-radius:var(--radius);background:white}
.community-grid h2{font-size:clamp(1.65rem,7vw,2.4rem)}
.community-grid .story-copy>p{font-size:.9375rem;line-height:1.85}
.community-grid .section-kicker{font-size:.8125rem}
.collection-media{width:100%;margin:26px 0 0}
.rank-rule{margin-top:28px;padding:22px 18px;border-radius:12px;background:#edf2f9}
.rank-rule-label{display:block;font-size:.75rem;letter-spacing:.04em;font-weight:800;color:var(--blue);margin-bottom:13px}
.rank-rule strong{display:block;font-size:1rem;line-height:1.6;font-weight:750}
.rank-rule p{font-size:.9375rem;line-height:1.85;color:var(--muted);margin-top:12px;word-break:keep-all}
.story--discover{background:var(--paper)}
.map-media{width:100%}
.discover-content{min-width:0}
.discover-content .map-media{margin-top:28px}
.discover-photo{min-width:0;aspect-ratio:2 / 3;overflow:hidden;border-radius:var(--radius);background:#e4e7eb}
.discover-photo img{display:block;width:100%;height:100%;object-fit:contain}

/* Final invitation: honest limited capacity, no invented remaining count. */
.beta-section{background:var(--paper);padding:0 0 40px}
.beta-card{padding:34px 24px;border-radius:24px;background:#2357eb;color:white;display:grid;gap:38px;overflow:hidden}
.beta-cap{font-size:.8125rem;font-weight:750;margin-bottom:20px;color:#e6edff}
.beta-card h2{font-size:clamp(1.75rem,7.7vw,2.8rem)}
.beta-copy>p:not(.micro-note):not(.beta-waitlist-note){font-size:1rem;line-height:1.9;word-break:keep-all;color:#e0e8ff;margin-top:20px;max-width:590px}
.beta-card .cta-primary{background:white;color:#12369b;width:100%}
.beta-waitlist-note{font-size:.8125rem;line-height:1.7;margin-top:17px;color:#d8e4ff;word-break:keep-all}
.beta-card .micro-note{font-size:.75rem;color:#d2deff}
.beta-number{font-size:clamp(4rem,18vw,7rem);font-weight:850;letter-spacing:-.07em;line-height:1.05;padding-top:28px;border-top:1px solid #6489f5}
.beta-number span{display:block;font-size:.75rem;letter-spacing:.14em;color:#e1edff;font-weight:700;line-height:1.5}
.beta-number span:first-child{margin-bottom:9px}
.beta-number span:last-child{margin-top:9px}

/* Footer and persistent mobile entry point. */
.footer{background:var(--paper);padding-block:28px calc(32px + env(safe-area-inset-bottom,0px))}
.footer-row{display:flex;flex-direction:column;gap:20px;padding-bottom:28px;border-bottom:1px solid var(--line)}
.footer-brand{display:block;width:142px;height:auto;margin-bottom:10px}
.footer-row p{font-size:.8125rem;color:var(--muted)}
.footer-links{font-size:.875rem;color:var(--muted);max-width:350px}
.company-details{font-size:.8125rem;line-height:1.9;color:#626d7a;margin-top:24px}
.company-details>p{margin-top:4px}
.company-details strong{color:var(--ink)}
.legal-links{display:flex;flex-wrap:wrap;gap:10px 18px;margin-top:20px;font-size:.875rem;color:var(--ink)}
.mobile-cta{position:fixed;inset:auto 0 0;z-index:80;padding:12px max(18px,env(safe-area-inset-right,0px)) calc(12px + env(safe-area-inset-bottom,0px)) max(18px,env(safe-area-inset-left,0px));background:rgba(248,249,251,.97);border-top:1px solid var(--line);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);transform:translateY(120%);visibility:hidden;transition:transform .25s,visibility .25s}
.mobile-cta.visible{transform:translateY(0);visibility:visible}
.mobile-cta .cta{width:100%;min-height:52px}
body.modal-open .mobile-cta{transform:translateY(120%);visibility:hidden}

/* Native dialog: focus trapping, Escape and inert background supplied by the browser. */
.signup-modal { padding: 0; border: 0; width: min(100%, 520px); max-width: 100%; max-height: min(90dvh, 860px); margin: auto auto 0; background: white; color: var(--ink); border-radius: 26px 26px 0 0; box-shadow: 0 -10px 60px rgba(0,0,0,.18); overflow: auto; overscroll-behavior: contain; }
.signup-modal::backdrop { background: rgba(7, 16, 38, .64); backdrop-filter: blur(5px); }
.modal-card { position: relative; padding: 36px 24px calc(30px + env(safe-area-inset-bottom, 0px)); }
.modal-close { position: absolute; top: 10px; right: 10px; width: 44px; height: 44px; border: 0; border-radius: 50%; background: #eef2f8; color: var(--ink); display: grid; place-items: center; font-size: 1.75rem; line-height: 1; }
.modal-cap { color: var(--blue); font-size: .8125rem; font-weight: 750; padding-right: 32px; margin-bottom: 22px; }
.modal-card h2 { font-size: 1.85rem; line-height: 1.3; }
.modal-copy { margin-top: 14px; font-size: 1rem; line-height: 1.8; color: var(--muted); word-break: keep-all; }
.waitlist-form { margin-top: 24px; display: grid; gap: 10px; }
.form-label { font-weight: 750; font-size: .9375rem; }
.email-input { width: 100%; min-height: 56px; padding: 14px 16px; border: 1px solid #b8c6dc; border-radius: 12px; font-size: 1rem; color: var(--ink); background: #fbfcff; }
.email-input:focus { border-color: var(--blue); }
.consent-row { display: flex; gap: 12px; align-items: flex-start; min-height: 44px; margin-block: 7px 12px; cursor: pointer; }
.consent-row input { width: 22px; height: 22px; margin: 3px 0 0; flex-shrink: 0; accent-color: var(--blue); }
.consent-row span { font-size: .875rem; line-height: 1.7; color: #59667c; }
.submit-button { min-height: 56px; padding: 14px 20px; border: 0; border-radius: 12px; background: var(--blue); color: white; font-size: 1rem; font-weight: 800; }
.submit-button:disabled { opacity: .6; cursor: wait; }
.honeypot { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.form-status { font-size: .9375rem; line-height: 1.7; }
.form-status:empty { display: none; }
.form-status.error { background: #fff0f0; color: #a62630; padding: 12px; border-radius: 10px; }
.form-status.success { color: #11613f; }
.signup-success { padding-top: 10px; }
.success-mark { width: 56px; height: 56px; border-radius: 50%; display: grid; place-items: center; background: #e7f7ef; color: #137144; font-size: 1.7rem; margin-bottom: 24px; }
.signup-success .submit-button { width: 100%; margin-top: 24px; }
.launch-links { display: grid; gap: 12px; margin-top: 24px; }
.launch-link { display: flex; justify-content: space-between; align-items: center; min-height: 60px; padding: 15px 18px; background: #f1f4fb; border: 1px solid var(--line); border-radius: 12px; text-decoration: none; font-weight: 750; }
.launch-link[aria-disabled="true"] { opacity: .45; cursor: not-allowed; }
.launch-note { margin-top: 14px; font-size: .875rem; color: var(--muted); }
.noscript-note { display: block; padding: 18px; font-size: .875rem; background: #fff5d7; color: #58400a; }



/* Enhancement-only motion; native content remains available without scripting. */
@media(prefers-reduced-motion:no-preference){
  .reveal.pending{opacity:0;transform:translateY(20px)}
  .reveal{transition:opacity .65s ease,transform .65s cubic-bezier(.2,.7,.2,1)}
  .reveal.in{opacity:1;transform:none}
  .signup-modal[open]{animation:sheet-in .25s cubic-bezier(.2,.7,.2,1)}
  @keyframes sheet-in{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:translateY(0)}}
}
@media(hover:hover){
  .cta-primary:hover{background:var(--blue-deep);transform:translateY(-2px)}
  .hero-copy .cta-primary:hover{background:white}
  .beta-card .cta-primary:hover{background:#e3efff}
  .cta-secondary:hover{text-decoration:underline;text-underline-offset:5px}
  .nav-links a:hover{color:var(--blue)}
  .video-toggle:hover{background:var(--blue)}
  .carousel-dots button:hover,.carousel-toggle:hover{background:#dce8fa}
  .launch-link:not([aria-disabled="true"]):hover{border-color:var(--blue)}
}
@media(min-width:520px){
  .hero{max-width:700px;padding-top:44px}
  .hero-copy .cta-primary{flex:0 1 auto}
  .hero-copy .cta-secondary{margin-inline:0}
  .hero-copy .micro-note{text-align:left}
  .beta-mini{display:inline}
  .scroll-cue{display:inline-flex}
  .lifestyle-media,.mission-media{max-width:660px;width:100%;margin-inline:auto}
  .signup-modal{margin:auto;border-radius:24px;width:min(100% - 40px,520px)}
  .modal-card{padding:36px}
  .points-panel,.sparx-panel,.collection-panel,.contributors-panel{padding:32px}
  .beta-card{padding:42px 34px}
  .beta-card .cta-primary{width:auto}
}
@media(min-width:900px){
  :root{--nav-h:80px;--radius:24px}
  .nav-links{display:flex;gap:24px;font-size:.875rem;font-weight:700}
  .nav-links a{min-height:44px;display:flex;align-items:center;text-decoration:none}
  .beta-mini{display:none}
  .hero{max-width:1200px;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:24px 28px;align-items:center;padding-block:44px 34px}
  .hero-copy{grid-column:1;grid-row:1}
  h1{font-size:clamp(3.1rem,4.5vw,4rem);line-height:1.19}
  .hero-promise{font-size:1.0625rem}
  .hero-media{grid-column:2;grid-row:1;margin:0 -14px 0 0}
  .hero-media figcaption{padding-inline:26px}
  .hero-bottom{grid-column:1 / -1;gap:50px;padding-top:26px}
  .hero-motto{font-size:1.05rem;line-height:1.5;letter-spacing:.035em}
  .hero-motto br{display:none}
  .hero-motto br::after{content:" "}
  .hero-bottom>p:not(.hero-motto){font-size:.875rem;max-width:none}
  .guide-section{padding-block:80px}
  .guide-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(42px,6vw,92px)}
  .guide-film{order:1}
  .guide-copy{order:2}
  .guide-copy{max-width:510px}
  .story{padding-block:96px}
  .editorial-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(42px,6vw,92px);align-items:center}
  .story--everyday .lifestyle-media{grid-column:1;grid-row:1}
  .story--everyday .story-copy{grid-column:2;grid-row:1}
  .section-heading{margin-bottom:40px}
  .how-grid{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:64px;align-items:start}
  .how-media{position:sticky;top:calc(var(--nav-h) + 30px)}
  .step{padding-block:21px}
  .reward-heading{margin-bottom:44px}
  .reward-grid{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:28px;align-items:start}
  .points-panel,.sparx-panel{padding:38px}
  .sparx-panel{position:sticky;top:calc(var(--nav-h) + 28px)}
  .community-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px;align-items:start}
  .collection-panel,.contributors-panel{padding:38px}
  .contributors-panel{position:sticky;top:calc(var(--nav-h) + 28px)}
  .beta-card{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);align-items:center;gap:58px;padding:52px 50px}
  .beta-number{border-top:0;border-left:1px solid #6489f5;padding:10px 0 10px 40px;font-size:clamp(4.5rem,8vw,7rem)}
  .beta-number span{font-size:.8125rem}
  .footer-row{flex-direction:row;align-items:center;justify-content:space-between}
  .mobile-cta{display:none}
}
@media(min-width:1150px){.beta-mini{display:inline}.hero-stage .cta-row{gap:16px}.story-copy>p{font-size:1.0625rem}}
@media(max-width:359px){
  :root{--gutter:18px}
  .nav-inner{gap:8px}
  .brand-logo{width:114px}
  .lang-toggle button{padding-inline:10px}
  h1{font-size:1.95rem}
  .hero{padding-top:28px}
  .hero-copy .cta-primary{padding-inline:16px}
  .points-panel,.sparx-panel,.collection-panel,.contributors-panel{padding-inline:19px}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .hero-media{transform:none!important}
}
