/* OneAct AI site. Visual system from design reference "V3 · Glass pills in hero + header CTA". */

body{margin:0;background:#000}
.oa{--accent:#0190fe;--text:#f5f5f3;--muted:#adadad;--soft:#8c8c8c;--line:#262626;container-type:inline-size;container-name:oa;position:relative;background:#000;color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,'Segoe UI',Arial,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:clip;box-sizing:border-box}
.oa *,.oa *::before,.oa *::after{box-sizing:border-box}
.oa ::selection{background:var(--accent);color:#fff}
.oa a{color:inherit;text-decoration:none}
.oa img{display:block;max-width:100%}
.oa button{font:inherit;color:inherit;cursor:pointer}
.oa :focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:6px}
.oa .container{width:min(calc(100% - 64px),960px);margin-inline:auto}
.oa .wide{width:min(calc(100% - 64px),1120px);margin-inline:auto}
.oa .mono{font-family:'DM Mono','Geist Mono',ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.11em;text-transform:uppercase}
.oa .eyebrow{margin:0;font-size:13px;line-height:1.6;color:#aaa}
.oa .skip{position:absolute;left:16px;top:-120px;z-index:100;padding:12px 16px;border-radius:999px;background:var(--text);color:#080808;font-size:12px;font-weight:600}
.oa .skip:focus{top:16px}

/* pills */
.oa .pill{height:44px;display:inline-flex;align-items:center;justify-content:space-between;gap:32px;padding:0 21px;border-radius:999px;border:0;font-size:12px;font-weight:600;letter-spacing:-.01em;white-space:nowrap;transition:background-color .25s ease,color .25s ease,transform .1s cubic-bezier(.2,0,0,1)}
.oa .pill:active{transform:scale(.97)}
.oa .pill .arr{font-size:13px;line-height:1}
.oa .pill-white{background:var(--text);color:#080808}
.oa .pill-white:hover,.oa .pill-white:focus-visible{background:var(--accent);color:#000}
.oa .pill-glass{background:rgba(255,255,255,.12);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);color:#fff}
.oa .pill-glass:hover{background:rgba(255,255,255,.2)}
.oa .pill-dark{background:#1c1c1c;color:#fff}
.oa .pill-dark:hover{background:#2a2a2a}

/* header */
.oa .site-header{position:absolute;top:0;left:0;right:0;z-index:40}
.oa .header-inner{position:relative;height:94px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.oa .brand{display:inline-flex;align-items:center;gap:10px;font-size:21px;font-weight:700;letter-spacing:-.055em;white-space:nowrap}
.oa .brand img{height:30px;width:auto}
.oa .desktop-nav{position:absolute;left:50%;transform:translateX(-50%);display:flex;gap:2px;padding:5px;border-radius:60px;background:rgba(35,35,35,.57);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}
.oa .desktop-nav a{padding:13px 15px;border-radius:50px;font-size:13px;font-weight:600;color:#ddd;transition:background-color .2s ease,color .2s ease}
.oa .desktop-nav a:hover{background:rgba(255,255,255,.13);color:#fff}
.oa .nav-cta{font-size:12px}
.oa .menu-button,.oa .mobile-nav{display:none}

/* hero */
.oa .hero{position:relative;min-height:clamp(700px,100svh,calc(20cqi + 720px));display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;background:#000}
.oa .hero-art{position:absolute;z-index:0;top:50%;right:max(0px,calc((100cqi - 1120px) / 2 - 150px));width:min(76cqi,1040px);transform:translateY(-52%);pointer-events:none}
.oa .hero-art img{width:100%;height:auto;opacity:.9;filter:brightness(1.15);transform-origin:60% 50%}
.oa .hero-shade{position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,#000 0%,rgba(0,0,0,.8) 22%,rgba(0,0,0,.2) 65%,transparent 100%),linear-gradient(0deg,#000 0%,transparent 32%)}
.oa .hero-inner{position:relative;z-index:2;padding-top:170px;padding-bottom:112px}
.oa .hero-top{margin-bottom:44px}
.oa .hero-bottom{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:48px;align-items:end}
.oa .hero h1{margin:0;font-size:clamp(64px,7.4cqi,106px);line-height:.91;letter-spacing:-.078em;font-weight:600;text-transform:uppercase}
.oa .hero h1 .period{color:var(--accent)}
.oa .w{display:inline-block}
.oa .hero-aside{max-width:360px}
.oa .hero-intro{margin:0;font-size:17px;line-height:1.6;letter-spacing:-.02em;color:#e6e6e4}
.oa .hero-goal{margin:22px 0 0;padding-top:18px;border-top:1px solid #2a2a2a;font-size:13px;line-height:1.6;color:#a3a3a3}
.oa .hero-goal .mono{display:block;margin-bottom:6px;font-size:10px;color:var(--accent)}
.oa .actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:28px}
.oa .hero-foot{position:absolute;z-index:2;left:0;right:0;bottom:30px;display:flex;justify-content:space-between;gap:16px;font-size:13px;color:#b0b0b0}
.oa .hero-foot a{transition:color .2s ease}
.oa .hero-foot a:hover{color:#fff}

/* sections */
.oa .section{padding:120px 0}
.oa .section-head{max-width:760px;margin:0 auto 56px;text-align:center}
.oa .section-head h2,.oa .contact h2{margin:22px 0 24px;font-size:clamp(42px,5.2cqi,70px);line-height:1.02;letter-spacing:-.065em;font-weight:600;text-transform:uppercase}
.oa .section-sub{max-width:560px;margin:0 auto;font-size:16px;line-height:1.7;color:var(--muted)}
.oa .footnote{margin:28px auto 0;max-width:620px;text-align:center;font-size:10px;line-height:1.7;color:#8a8a8a}

/* problem */
.oa .problem-list{display:grid;gap:12px}
.oa .problem-card{display:grid;grid-template-columns:40% minmax(0,1fr);min-height:268px;border-radius:20px;overflow:hidden;background:#111}
.oa .problem-card figure{margin:0;position:relative;min-height:220px;background:#0b0b0b}
.oa .problem-card figure img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.oa .problem-body{display:flex;flex-direction:column;align-items:flex-start;padding:34px 40px}
.oa .num{font-size:11px;color:var(--accent)}
.oa .problem-body h3{margin:auto 0 12px;padding-top:28px;font-size:clamp(24px,2.6cqi,32px);line-height:1.1;letter-spacing:-.05em;font-weight:600}
.oa .problem-body p{margin:0;max-width:440px;font-size:15px;line-height:1.65;color:var(--muted)}
.oa .tags{margin-top:22px;font-size:10px;color:#8c8c8c}

/* how it works */
.oa .step-stack{display:flex;flex-direction:column;padding-bottom:24px}
.oa .step-card{position:sticky;top:120px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);height:400px;border-radius:20px;overflow:hidden;background:#141414;transform-origin:50% 0;will-change:transform}
.oa .step-card + .step-card{margin-top:120px}
.oa .step-card.s2{top:140px;background:#171717}
.oa .step-card.s3{top:160px;background:#1b1b1b}
.oa .step-copy{display:flex;flex-direction:column;align-items:flex-start;padding:44px 48px}
.oa .step-num{margin:0;font-size:11px;color:var(--accent)}
.oa .step-copy h3{margin:auto 0 16px;font-size:clamp(28px,3.3cqi,44px);line-height:1.04;letter-spacing:-.06em;font-weight:600}
.oa .step-copy p{margin:0;max-width:380px;font-size:15px;line-height:1.65;color:#b0b0b0}
.oa .step-copy .later{margin-top:12px;font-size:13px;color:#8c8c8c}
.oa .step-meta{margin-top:28px;font-size:10px;color:#8c8c8c}
.oa .step-visual{position:relative;min-width:0;background:#0a0a0a}
.oa .step-visual>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.oa .panel{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(78%,300px);display:flex;flex-direction:column;gap:12px;padding:24px;border-radius:12px;background:rgba(16,16,16,.85);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}
.oa .panel .mono{display:flex;align-items:center;gap:8px;font-size:10px;color:#9a9a9a}
.oa .dot{width:6px;height:6px;border-radius:50%;background:var(--accent);box-shadow:0 0 10px rgba(1,144,254,.7);flex:none}
.oa .panel b{font-size:17px;letter-spacing:-.04em;font-weight:600;color:#fff}
.oa .panel small{font-size:12px;color:#aaa}
.oa .concept{position:absolute;right:16px;bottom:14px;font-size:9px;color:#8a8a8a}

/* roadmap */
.oa .roadmap-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.oa .roadmap-card{position:relative;display:flex;flex-direction:column;min-height:500px;padding:28px 24px 26px;border-radius:18px;border:1px solid transparent;background:#151515}
.oa .roadmap-card.current{border-color:var(--accent);background:#171717}
.oa .roadmap-label{font-size:12px;color:var(--accent)}
.oa .chip{position:absolute;top:22px;right:18px;padding:7px 10px;border-radius:999px;border:1px solid var(--accent);font-size:9px;color:var(--accent)}
.oa .roadmap-card h3{margin:60px 0 14px;font-size:42px;letter-spacing:-.07em;font-weight:600;line-height:1}
.oa .roadmap-card>p{margin:0 0 28px;min-height:66px;font-size:14px;line-height:1.65;color:var(--muted)}
.oa .roadmap-card ul{list-style:none;margin:auto 0 0;padding:20px 0 0;border-top:1px solid var(--line)}
.oa .roadmap-card li{position:relative;padding:0 0 13px 18px;font-size:13px;line-height:1.55;color:#c2c2c2}
.oa .roadmap-card li::before{content:'\2212';position:absolute;left:0;color:#8c8c8c}

/* contact */
.oa .contact{text-align:center;max-width:720px;margin:0 auto}
.oa .contact h2{margin-top:22px}
.oa .contact-copy{max-width:500px;margin:0 auto;font-size:16px;line-height:1.7;color:var(--muted)}
.oa .contact .pill{margin-top:34px;text-transform:none}
.oa .contact-note{margin:14px 0 0;font-size:10px;color:#8a8a8a}

/* footer */
.oa .site-footer{padding:74px 0 26px;background:#080808}
.oa .footer-main{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:45px;padding-bottom:90px}
.oa .footer-brand p{max-width:300px;margin:24px 0;font-size:13px;line-height:1.65;color:#9c9c9c}
.oa .footer-stage{font-size:10px;color:#8a8a8a}
.oa .footer-col{display:flex;flex-direction:column;align-items:flex-start;gap:13px}
.oa .footer-col h3{margin:4px 0 12px;font-size:12px;font-weight:600}
.oa .footer-col a{font-size:13px;color:#9c9c9c;transition:color .2s ease}
.oa .footer-col a:hover{color:#fff}
.oa .footer-bottom{display:flex;justify-content:space-between;gap:20px;padding-top:24px;border-top:1px solid var(--line);font-size:12px;color:#8a8a8a}
.oa .footer-bottom a:hover{color:#fff}

/* ---------- motion (progressive: only when .js is on the root) ---------- */
@keyframes oaWord{from{opacity:0;transform:translateY(12px);filter:blur(4px)}to{opacity:1;transform:none;filter:blur(0)}}
@keyframes oaSoft{from{opacity:0;transform:translateY(10px);filter:blur(10px)}to{opacity:1;transform:none;filter:blur(0)}}
@keyframes oaUp{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@keyframes oaDrift{from{transform:scale(1)}to{transform:scale(1.04)}}
.oa.js .hero h1 .w{animation:oaWord .62s cubic-bezier(.2,.7,.2,1) both}
.oa.js .hero-intro .w{animation:oaSoft .6s cubic-bezier(.2,.7,.2,1) both}
.oa.js .hero .up{animation:oaUp .7s cubic-bezier(0,.18,0,.98) both}
.oa.js .hero-art img{animation:oaDrift 18s ease-in-out infinite alternate}
.oa.js .rv{opacity:0;transform:translateY(40px);transition:opacity .75s cubic-bezier(0,.18,0,.98),transform .75s cubic-bezier(0,.18,0,.98)}
.oa.js .rv.in{opacity:1;transform:none}
.oa.js .rv-words .w{opacity:0;transform:translateY(12px);filter:blur(4px);transition:opacity .6s cubic-bezier(.2,.7,.2,1),transform .6s cubic-bezier(.2,.7,.2,1),filter .6s cubic-bezier(.2,.7,.2,1)}
.oa.js .rv-words.in .w{opacity:1;transform:none;filter:blur(0)}
.oa.js .rv-words{opacity:1;transform:none}
.oa.js .sl{opacity:0;transform:translateY(35px)}

/* ---------- responsive (container queries on the page root) ---------- */
@container oa (max-width:1000px){
.oa .desktop-nav a{padding:12px 11px}
.oa .hero-bottom{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:36px}
.oa .hero h1{font-size:clamp(60px,7.6cqi,80px)}
.oa .roadmap-card{padding:26px 20px 22px}
}
@container oa (max-width:760px){
.oa .container,.oa .wide{width:min(calc(100% - 40px),960px)}
.oa .header-inner{height:72px}
.oa .desktop-nav,.oa .nav-cta{display:none}
.oa .menu-button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;width:46px;height:46px;border:0;border-radius:50%;background:rgba(36,36,36,.67);-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px)}
.oa .menu-button span{width:17px;height:1px;background:#fff;transition:transform .25s ease}
.oa .menu-button[aria-expanded="true"] span:first-child{transform:translateY(3.5px) rotate(45deg)}
.oa .menu-button[aria-expanded="true"] span:last-child{transform:translateY(-3.5px) rotate(-45deg)}
.oa .mobile-nav.open{display:flex;flex-direction:column;position:absolute;top:66px;left:0;right:0;padding:10px;border-radius:16px;background:rgba(27,27,27,.96);-webkit-backdrop-filter:blur(25px);backdrop-filter:blur(25px)}
.oa .mobile-nav a{padding:14px 15px;border-radius:10px;font-size:14px;font-weight:600}
.oa .mobile-nav a:hover{background:#2c2c2c}
.oa .hero{min-height:clamp(680px,100svh,calc(20cqi + 720px))}
.oa .hero-art{top:64px;right:auto;left:50%;width:120cqi;transform:translateX(-50%)}
.oa .hero-art img{opacity:.85;filter:brightness(1.35)}
.oa .hero-shade{background:linear-gradient(0deg,#000 0%,#000 34%,rgba(0,0,0,.3) 66%,rgba(0,0,0,.45) 100%)}
.oa .hero-inner{padding-top:120px;padding-bottom:90px}
.oa .hero-top{margin-bottom:26px}
.oa .hero-bottom{display:block}
.oa .hero h1{font-size:clamp(56px,15cqi,84px);line-height:.93}
.oa .hero-aside{max-width:420px;margin-top:30px}
.oa .hero-intro{font-size:16px}
.oa .hero-foot{bottom:26px;font-size:12px}
.oa .section{padding:80px 0}
.oa .section-head{margin-bottom:40px}
.oa .section-head h2,.oa .contact h2{font-size:clamp(32px,8.6cqi,62px)}
.oa .section-sub,.oa .contact-copy{font-size:15px}
.oa .problem-card{grid-template-columns:1fr;min-height:0;border-radius:16px}
.oa .problem-card figure{aspect-ratio:16/10;min-height:0}
.oa .problem-body{padding:24px 24px 26px}
.oa .problem-body h3{margin-top:14px;padding-top:0;font-size:24px}
.oa .problem-body p{font-size:14px}
.oa .step-card,.oa .step-card.s2,.oa .step-card.s3{position:relative;top:auto;height:auto;grid-template-columns:1fr;transform:none!important;filter:none!important}
.oa .step-card + .step-card{margin-top:12px}
.oa .step-copy{padding:30px 26px}
.oa .step-copy h3{margin:30px 0 14px;font-size:34px}
.oa .step-copy p{font-size:14px}
.oa .step-visual{height:280px}
.oa .roadmap-grid{grid-template-columns:1fr}
.oa .roadmap-card{min-height:0;padding:28px 24px}
.oa .roadmap-card h3{margin:36px 0 14px}
.oa .roadmap-card>p{min-height:0}
.oa .footer-main{grid-template-columns:1fr;gap:36px;padding-bottom:56px}
}
@container oa (max-width:460px){
.oa .hero h1{font-size:clamp(48px,15.4cqi,60px)}
.oa .hero-foot .foot-left{display:none}
.oa .hero-foot{justify-content:flex-end}
.oa .pill{gap:18px;padding:0 18px}
.oa .footer-bottom{flex-direction:column;gap:8px}
}
@media (prefers-reduced-motion:reduce){
.oa.js .hero h1 .w,.oa.js .hero-intro .w,.oa.js .hero .up,.oa.js .hero-art img{animation:none}
.oa.js .rv,.oa.js .rv-words .w,.oa.js .sl{opacity:1;transform:none;filter:none;transition:none}
.oa .step-card{transform:none!important;filter:none!important}
.oa .pill,.oa .desktop-nav a{transition:none}
}

/* ===== shared v2 additions ===== */
.oa .brand-lockup{display:inline-flex;align-items:center}
.oa .brand-lockup img{height:32px;width:auto}
.oa .stat{display:flex;align-items:baseline;gap:12px;margin-top:22px;padding-top:18px;border-top:1px solid var(--line);width:100%}
.oa .stat b{font-size:26px;letter-spacing:-.04em;font-weight:600;color:var(--accent);white-space:nowrap}
.oa .stat span{font-size:12px;line-height:1.5;color:#a0a0a0}
.oa .stat cite{display:block;margin-top:3px;font-style:normal;font-size:9px;color:#8a8a8a}
.oa .sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@keyframes oaLock{from{opacity:0;transform:scale(.965);filter:blur(14px)}to{opacity:1;transform:none;filter:blur(0)}}
@keyframes oaFloat{0%{transform:translate3d(0,0,0) rotate(0deg)}50%{transform:translate3d(0,-18px,0) rotate(2deg)}100%{transform:translate3d(0,0,0) rotate(0deg)}}
@keyframes oaGlow{from{opacity:.55}to{opacity:.9}}

/* ===== A. Signature: centered giant lockup on a blue glow ===== */
.oa.t-a .hero{justify-content:center;text-align:center}
.oa.t-a .hero-glow{position:absolute;z-index:0;left:50%;top:44%;width:min(1100px,110cqi);aspect-ratio:1.6;transform:translate(-50%,-50%);background:radial-gradient(closest-side,rgba(1,144,254,.34),rgba(1,100,210,.12) 55%,transparent 75%);filter:blur(10px);pointer-events:none}
.oa.t-a .hero-ring{position:absolute;z-index:0;left:50%;top:44%;width:min(1180px,120cqi);aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;border:1px solid rgba(1,144,254,.14);pointer-events:none}
.oa.t-a .hero-ring.r2{width:min(820px,84cqi);border-color:rgba(1,144,254,.1)}
.oa.t-a .hero-inner{padding-top:150px;padding-bottom:120px;display:flex;flex-direction:column;align-items:center}
.oa.t-a .hero-top{margin-bottom:34px}
.oa.t-a .lock{margin:0;width:min(560px,64cqi)}
.oa.t-a .lock img{width:100%;height:auto;filter:drop-shadow(0 0 40px rgba(1,144,254,.28))}
.oa.t-a .tagline{margin:34px 0 0;font-size:clamp(40px,4.8cqi,66px);line-height:1;letter-spacing:-.06em;font-weight:600;text-transform:uppercase}
.oa.t-a .tagline .period{color:var(--accent)}
.oa.t-a .hero-intro{max-width:560px;margin:22px auto 0;color:#cfd6df}
.oa.t-a .hero-goal{max-width:520px;margin:18px auto 0;border-top:0;padding-top:0}
.oa.t-a .hero-goal .mono{display:inline;margin:0 8px 0 0}
.oa.t-a .actions{justify-content:center}

.oa.t-a.js .lock img{animation:oaLock 1.1s cubic-bezier(.2,.7,.2,1) .1s both}
.oa.t-a.js .hero-glow{animation:oaGlow 6s ease-in-out infinite alternate}
.oa.t-a .roadmap-card.current{background:linear-gradient(180deg,rgba(1,144,254,.12),rgba(1,144,254,0) 55%),#151515}
.oa.t-a .step-num,.oa.t-a .num{font-size:12px}
.oa.t-a .section-head .eyebrow{color:var(--accent)}
.oa.t-a .site-footer{background:#050a12;border-top:1px solid rgba(1,144,254,.25)}

/* ===== B. Deep navy field (NanoForge-style ambient logo) ===== */
.oa.t-b{--line:#172a48;--muted:#a9b6c9;background:linear-gradient(180deg,#02060f 0%,#051126 22%,#040d1d 48%,#061530 72%,#02060f 100%)}
.oa.t-b .hero{background:transparent}
.oa.t-b .hero-shade{background:linear-gradient(90deg,rgba(2,6,15,.95) 0%,rgba(2,6,15,.55) 45%,transparent 75%),linear-gradient(0deg,rgba(4,13,29,1) 0%,transparent 30%)}
.oa.t-b .mark{position:absolute;z-index:0;pointer-events:none;opacity:.5}
.oa.t-b .mark img{width:100%;height:auto;filter:drop-shadow(0 0 60px rgba(1,144,254,.45)) saturate(1.2)}
.oa.t-b .mark.m-hero{right:max(-120px,calc((100cqi - 1120px) / 2 - 180px));top:50%;width:min(760px,62cqi);transform:translateY(-50%);opacity:.36}
.oa.t-b .mark.m-hero img{opacity:.85}
.oa.t-b .mark.m-left{left:-220px;top:120px;width:520px;opacity:.12}
.oa.t-b .mark.m-right{right:-200px;top:200px;width:560px;opacity:.1;transform:rotate(-18deg)}
.oa.t-b .mark.m-small{left:8%;bottom:14%;width:150px;opacity:.16;transform:rotate(24deg)}
.oa.t-b.js .mark.m-hero img{animation:oaFloat 14s ease-in-out infinite}
.oa.t-b.js .mark.m-small img{animation:oaFloat 11s ease-in-out -3s infinite}
.oa.t-b .section{position:relative;overflow:hidden}
.oa.t-b .section>.container{position:relative;z-index:1}
.oa.t-b .hero-lock{margin:0 0 30px;width:min(560px,70cqi)}
.oa.t-b .hero-lock img{width:100%;height:auto}
.oa.t-b .hero h1{font-size:clamp(56px,6.4cqi,92px);text-shadow:0 0 42px rgba(1,144,254,.35)}
.oa.t-b .hero-top .eyebrow{color:#8fb8e8}
.oa.t-b .hero-goal{border-top-color:#1b3257}
.oa.t-b .section-head h2,.oa.t-b .contact h2{text-shadow:0 0 36px rgba(1,144,254,.28)}
.oa.t-b .problem-card{background:rgba(9,24,48,.78);border:1px solid #13284a}
.oa.t-b .problem-card figure{background:#030a17}
.oa.t-b .step-card{background:#081630}
.oa.t-b .step-card.s2{background:#0a1a38}
.oa.t-b .step-card.s3{background:#0c1f42}
.oa.t-b .step-visual{background:#030a17}
.oa.t-b .panel{background:rgba(6,16,34,.86)}
.oa.t-b .roadmap-card{background:rgba(9,24,48,.78)}
.oa.t-b .roadmap-card.current{background:rgba(12,34,70,.9)}
.oa.t-b .pill-glass{background:rgba(120,170,255,.14)}
.oa.t-b .pill-white:hover{background:var(--accent);color:#000}
.oa.t-b .desktop-nav{background:rgba(20,40,75,.55)}
.oa.t-b .site-footer{background:#02060f;border-top:1px solid #13284a}

/* ===== C. Blueprint: blue linework + full-bleed wordmark ===== */
.oa.t-c .grid-bg{position:absolute;inset:0;z-index:0;pointer-events:none;background-image:linear-gradient(rgba(1,144,254,.075) 1px,transparent 1px),linear-gradient(90deg,rgba(1,144,254,.075) 1px,transparent 1px);background-size:56px 56px;-webkit-mask-image:radial-gradient(ellipse at 60% 40%,#000 20%,transparent 75%);mask-image:radial-gradient(ellipse at 60% 40%,#000 20%,transparent 75%)}
.oa.t-c .hero-art img{opacity:1;filter:none}
.oa.t-c .hero-lock{display:block;margin:0 0 26px;width:min(330px,60cqi)}
.oa.t-c .hero-lock img{width:100%;height:auto}
.oa.t-c .hero-top{margin-bottom:28px}
.oa.t-c .section{position:relative}
.oa.t-c .section-head .eyebrow{display:inline-block;padding:7px 12px;border:1px solid rgba(1,144,254,.45);border-radius:999px;color:#7cc4ff}
.oa.t-c .num,.oa.t-c .step-num,.oa.t-c .roadmap-label{color:#4fb2ff}
.oa.t-c .problem-card,.oa.t-c .roadmap-card{background:#0b0f14;border:1px solid #13233a}
.oa.t-c .roadmap-card.current{border-color:var(--accent);box-shadow:inset 0 3px 0 var(--accent)}
.oa.t-c .step-card{box-shadow:inset 0 2px 0 rgba(1,144,254,.8);background:#0d1117}
.oa.t-c .step-card.s2{background:#10151c}
.oa.t-c .step-card.s3{background:#131a23}
.oa.t-c .dot{border-radius:1px}
.oa.t-c .site-footer{position:relative;overflow:hidden;background:#000;border-top:1px solid #13233a}
.oa.t-c .big-mark{width:min(calc(100% - 48px),1400px);margin:0 auto;padding:70px 0 10px}
.oa.t-c .big-mark img{width:100%;height:auto}
.oa.t-c .big-mark-cap{display:flex;justify-content:space-between;width:min(calc(100% - 48px),1400px);margin:0 auto 40px;font-size:10px;color:#6f9ccc}

@container oa (max-width:760px){
.oa.t-a .lock{width:78cqi}
.oa.t-a .hero-inner{padding-top:120px;padding-bottom:96px}
.oa.t-a .tagline{font-size:clamp(26px,8cqi,40px)}
.oa.t-b .mark.m-hero{top:90px;right:-24cqi;width:92cqi;transform:none;opacity:.45}
.oa.t-b .hero-lock{width:82cqi}
.oa.t-b .hero h1{font-size:clamp(46px,13.4cqi,72px)}
.oa .brand-lockup img{height:28px}
}
@media (prefers-reduced-motion:reduce){
.oa.t-a.js .lock img,.oa.t-a.js .hero-glow,.oa.t-b.js .mark img{animation:none}
}
.oa.t-a.js .hero .tagline .w{animation:oaWord .62s cubic-bezier(.2,.7,.2,1) both}
.oa.t-a .hd0{animation-delay:700ms}.oa.t-a .hd1{animation-delay:780ms}.oa.t-a .hd2{animation-delay:860ms}.oa.t-a .hd3{animation-delay:940ms}
@media (prefers-reduced-motion:reduce){.oa.t-a.js .hero .tagline .w{animation:none}}

/* ===== D. Light editorial: true logo colors on warm white ===== */
.oa.t-d{--text:#0c1a2b;--muted:#4a5566;--line:#d9dce2;background:#f4f4f1;color:#0c1a2b}
.oa.t-d ::selection{color:#fff}
.oa.t-d .eyebrow{color:#5b6573}
.oa.t-d .desktop-nav{background:rgba(255,255,255,.72);box-shadow:0 0 0 1px #e1e3e8}
.oa.t-d .desktop-nav a{color:#1c2a3a}
.oa.t-d .desktop-nav a:hover{background:rgba(12,26,43,.07);color:#0c1a2b}
.oa.t-d .pill-white{background:#0c1a2b;color:#fff}
.oa.t-d .pill-white:hover,.oa.t-d .pill-white:focus-visible{background:var(--accent);color:#000}
.oa.t-d .pill-glass{background:rgba(12,26,43,.07);color:#0c1a2b}
.oa.t-d .pill-glass:hover{background:rgba(12,26,43,.13)}
.oa.t-d .hero{background:#f4f4f1}
.oa.t-d .hero-art img{filter:invert(1);opacity:.85}
.oa.t-d .hero-shade{background:linear-gradient(90deg,#f4f4f1 0%,rgba(244,244,241,.82) 24%,rgba(244,244,241,.2) 65%,transparent 100%),linear-gradient(0deg,#f4f4f1 0%,transparent 32%)}
.oa.t-d .hero-lock{margin:0 0 26px;width:min(330px,62cqi)}
.oa.t-d .hero-lock img{width:100%;height:auto}
.oa.t-d .hero-intro{color:#1c2a3a}
.oa.t-d .hero-goal{color:#4a5566;border-top-color:#d9dce2}
.oa.t-d .hero-foot{color:#6b7480}
.oa.t-d .hero-foot a:hover{color:#0c1a2b}
.oa.t-d .footnote{color:#6b7480}
.oa.t-d .problem-card,.oa.t-d .step-card{--muted:#adadad;--line:#262626;color:#f5f5f3;background:#0e131a}
.oa.t-d .step-card.s2{background:#121820}
.oa.t-d .step-card.s3{background:#161d26}
.oa.t-d .roadmap-card{background:#fff;box-shadow:0 0 0 1px #e1e3e8;border-color:transparent}
.oa.t-d .roadmap-card.current{border-color:var(--accent);box-shadow:none}
.oa.t-d .roadmap-card li{color:#33404f}
.oa.t-d .roadmap-card li::before{color:#8a93a0}
.oa.t-d .roadmap-label,.oa.t-d .num,.oa.t-d .step-num{color:#0172d6}
.oa.t-d .chip{color:#0172d6;border-color:#0172d6}
.oa.t-d .site-footer{background:#ebece8}
.oa.t-d .footer-brand p,.oa.t-d .footer-col a{color:#4a5566}
.oa.t-d .footer-col a:hover{color:#0c1a2b}
.oa.t-d .footer-stage,.oa.t-d .footer-bottom{color:#6b7480}
@container oa (max-width:760px){
.oa.t-d .hero-shade{background:linear-gradient(0deg,#f4f4f1 0%,#f4f4f1 34%,rgba(244,244,241,.35) 66%,rgba(244,244,241,.5) 100%)}
.oa.t-d .hero-art img{filter:invert(1)}
}

/* ===== E. Navy split: logo-navy panel + black diagram ===== */
.oa.t-e .hero-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);min-height:clamp(700px,100svh,calc(20cqi + 720px));justify-content:stretch}
.oa.t-e .split-l{position:relative;background:linear-gradient(160deg,#04284d 0%,#022040 45%,#011833 100%);display:flex;align-items:flex-end;justify-content:flex-end}
.oa.t-e .split-inner{width:100%;padding:150px 56px 80px max(32px,calc((100cqi - 1120px) / 2))}
.oa.t-e .split-lock{margin:0 0 30px;width:min(360px,100%)}
.oa.t-e .split-lock img{width:100%;height:auto}
.oa.t-e .hero h1{font-size:clamp(48px,4.8cqi,72px)}
.oa.t-e .split-l .eyebrow{color:#8fb2d6}
.oa.t-e .hero-intro{margin-top:30px;max-width:440px;color:#e3ebf3}
.oa.t-e .hero-goal{max-width:440px;border-top-color:rgba(255,255,255,.16);color:#a9bccf}
.oa.t-e .hero-goal .mono{color:#7cc4ff}
.oa.t-e .split-r{position:relative;background:#000;display:flex;align-items:center;justify-content:center;overflow:hidden}
.oa.t-e .split-r img{width:100%;max-width:none;height:auto;opacity:.92;transform:translateX(-4%)}
.oa.t-e .split-cap{position:absolute;left:28px;bottom:26px;font-size:9px;color:#8a8a8a}
.oa.t-e .roadmap-card.current{background:#03213f}
.oa.t-e .site-footer{background:#011833}
.oa.t-e .desktop-nav{background:rgba(10,30,55,.6)}
@container oa (max-width:760px){
.oa.t-e .hero-split{grid-template-columns:1fr;min-height:0}
.oa.t-e .split-r{order:-1;height:360px;padding-top:60px}
.oa.t-e .split-r img{width:130%}
.oa.t-e .split-inner{padding:44px 20px 56px}
.oa.t-e .hero h1{font-size:clamp(46px,13cqi,70px)}
}

/* ===== F. Centered stack: lockup, headline, diagram below ===== */
.oa.t-f .hero-stack{min-height:0;display:block;text-align:center;padding-top:150px}
.oa.t-f .stack-inner{display:flex;flex-direction:column;align-items:center}
.oa.t-f .stack-lock{margin:0 0 28px;width:min(300px,60cqi)}
.oa.t-f .stack-lock img{width:100%;height:auto}
.oa.t-f .hero h1{margin-top:26px;font-size:clamp(56px,6.8cqi,98px)}
.oa.t-f .hero-intro{max-width:580px;margin:28px auto 0;color:#dedede}
.oa.t-f .hero-goal{max-width:540px;margin:16px auto 0;border-top:0;padding-top:0;color:#9a9a9a}
.oa.t-f .hero-goal .mono{display:inline;margin-right:8px}
.oa.t-f .actions{justify-content:center}
.oa.t-f .stack-art{position:relative;width:min(1100px,100%);height:clamp(320px,44cqi,600px);margin:30px auto 0;overflow:hidden;-webkit-mask-image:linear-gradient(180deg,transparent 0%,#000 18%,#000 70%,transparent 100%);mask-image:linear-gradient(180deg,transparent 0%,#000 18%,#000 70%,transparent 100%)}
.oa.t-f .stack-art img{position:absolute;left:50%;top:-6%;width:100%;transform:translateX(-50%);opacity:.9}
.oa.t-f .stack-rule{width:min(calc(100% - 64px),1120px);margin:0 auto;height:1px;background:linear-gradient(90deg,transparent,rgba(1,144,254,.6),transparent)}
@container oa (max-width:760px){
.oa.t-f .hero-stack{padding-top:112px}
.oa.t-f .hero h1{font-size:clamp(44px,12.6cqi,68px)}
.oa.t-f .stack-art{height:300px}
.oa.t-f .stack-art img{width:150%}
}

/* ===== C variants: headline scale + glass cards ===== */
.oa.t-c1 .section,.oa.t-c2 .section,.oa.t-c3 .section{position:relative;overflow:hidden}
.oa.t-c1 .section>.container,.oa.t-c2 .section>.container,.oa.t-c3 .section>.container{position:relative;z-index:1}
.oa .glow{position:absolute;z-index:0;pointer-events:none;border-radius:50%;filter:blur(20px)}
.oa .glow.gl-a{left:6%;top:30%;width:620px;height:520px;background:radial-gradient(closest-side,rgba(1,144,254,.2),transparent)}
.oa .glow.gl-b{right:4%;bottom:6%;width:680px;height:560px;background:radial-gradient(closest-side,rgba(40,110,220,.17),transparent)}
/* images: white-on-black art blends into glass */
.oa.t-c1 .problem-card figure,.oa.t-c2 .problem-card figure,.oa.t-c3 .problem-card figure,
.oa.t-c1 .step-visual,.oa.t-c2 .step-visual,.oa.t-c3 .step-visual{background:transparent}
.oa.t-c1 .problem-card figure img,.oa.t-c2 .problem-card figure img,.oa.t-c3 .problem-card figure img,
.oa.t-c1 .step-visual>img,.oa.t-c2 .step-visual>img,.oa.t-c3 .step-visual>img{mix-blend-mode:screen}

/* C1 Refined: smaller headline, subtle frosted glass */
.oa.t-c1 .problem-card,.oa.t-c1 .roadmap-card{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}
.oa.t-c1 .step-card,.oa.t-c1 .step-card.s2,.oa.t-c1 .step-card.s3{background:rgba(16,20,26,.66);border:1px solid rgba(255,255,255,.08);box-shadow:none;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}
.oa.t-c1 .roadmap-card.current{border-color:var(--accent);box-shadow:none}

/* C2 Statement: full-width two-line headline, blue-edged glass */
.oa.t-c2 .hero-inner{width:min(calc(100% - 64px),1120px)}
.oa.t-c2 .hero-bottom{display:block}
.oa.t-c2 .hero-art img{opacity:.6}
.oa.t-c2 .hero h1{font-size:clamp(64px,9.2cqi,132px);line-height:.9;letter-spacing:-.075em;white-space:nowrap}
.oa.t-c2 .hero-aside{max-width:none;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:40px;align-items:end;margin-top:40px;padding-top:26px;border-top:1px solid rgba(255,255,255,.12)}
.oa.t-c2 .hero-goal{margin:0;padding:0;border:0}
.oa.t-c2 .actions{margin:0;flex-wrap:nowrap}
.oa.t-c2 .hero-shade{background:linear-gradient(90deg,#000 0%,rgba(0,0,0,.7) 30%,rgba(0,0,0,.15) 70%,transparent 100%),linear-gradient(0deg,#000 0%,rgba(0,0,0,.6) 38%,transparent 62%)}
.oa.t-c2 .problem-card,.oa.t-c2 .roadmap-card{background:rgba(110,170,255,.045);border:1px solid rgba(1,144,254,.22);box-shadow:inset 0 1px 0 rgba(255,255,255,.07);-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px)}
.oa.t-c2 .step-card,.oa.t-c2 .step-card.s2,.oa.t-c2 .step-card.s3{background:rgba(10,18,30,.66);border:1px solid rgba(1,144,254,.24);box-shadow:inset 0 1px 0 rgba(255,255,255,.07);-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px)}
.oa.t-c2 .roadmap-card.current{border-color:var(--accent);box-shadow:inset 0 1px 0 rgba(255,255,255,.07)}

/* C3 Glass: medium lighter headline, classic glassmorphism */
.oa.t-c3 .hero h1{font-size:clamp(56px,6.3cqi,90px);font-weight:500;letter-spacing:-.07em;line-height:.93}
.oa.t-c3 .problem-card,.oa.t-c3 .roadmap-card{background:linear-gradient(135deg,rgba(255,255,255,.085),rgba(255,255,255,.02) 60%);border:1px solid rgba(255,255,255,.13);box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 24px 60px rgba(0,0,0,.35);-webkit-backdrop-filter:blur(24px) saturate(140%);backdrop-filter:blur(24px) saturate(140%)}
.oa.t-c3 .step-card,.oa.t-c3 .step-card.s2,.oa.t-c3 .step-card.s3{background:linear-gradient(135deg,rgba(40,48,60,.72),rgba(14,18,24,.7) 60%);border:1px solid rgba(255,255,255,.13);box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 24px 60px rgba(0,0,0,.4);-webkit-backdrop-filter:blur(24px) saturate(140%);backdrop-filter:blur(24px) saturate(140%)}
.oa.t-c3 .roadmap-card.current{border-color:rgba(1,144,254,.8);box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 0 0 1px rgba(1,144,254,.25),0 24px 60px rgba(0,0,0,.35)}
.oa.t-c3 .panel{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12)}
.oa.t-c3 .problem-card .stat{border-top-color:rgba(255,255,255,.1)}

@container oa (max-width:760px){
.oa.t-c2 .hero h1{white-space:normal;font-size:clamp(44px,12.4cqi,70px)}
.oa.t-c2 .hero-aside{display:block;border-top:0;padding-top:0;margin-top:30px}
.oa.t-c2 .hero-goal{margin-top:18px}
.oa.t-c2 .actions{margin-top:24px;flex-wrap:wrap}
.oa.t-c3 .hero h1{font-size:clamp(46px,13.4cqi,70px)}
}

/* C1: Apple-style clear glass panel over the step illustrations */
.oa.t-c1 .panel{background:linear-gradient(145deg,rgba(255,255,255,.10),rgba(255,255,255,.02) 55%,rgba(255,255,255,.06));border:1px solid rgba(255,255,255,.28);box-shadow:inset 0 1px 0 rgba(255,255,255,.45),inset 0 -1px 0 rgba(255,255,255,.08),inset 1px 0 0 rgba(255,255,255,.12),0 10px 30px rgba(0,0,0,.25);-webkit-backdrop-filter:blur(3px) saturate(160%) brightness(1.15);backdrop-filter:blur(3px) saturate(160%) brightness(1.15);border-radius:18px}
.oa.t-c1 .panel .mono{color:#d6dde6}
.oa.t-c1 .panel b{text-shadow:0 1px 8px rgba(0,0,0,.55)}
.oa.t-c1 .panel small{color:#e2e6ea;text-shadow:0 1px 6px rgba(0,0,0,.6)}

/* ===== Final candidate variants (c4/c5/c6 inherit c1) ===== */
.oa .step-tag{display:none}
/* shared: Apple-style glass nav + glass secondary button */
.oa.t-c4 .desktop-nav,.oa.t-c5 .desktop-nav,.oa.t-c6 .desktop-nav{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);box-shadow:inset 0 1px 0 rgba(255,255,255,.18);-webkit-backdrop-filter:blur(18px) saturate(170%);backdrop-filter:blur(18px) saturate(170%)}
.oa.t-c4 .pill-glass,.oa.t-c5 .pill-glass,.oa.t-c6 .pill-glass{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.2);box-shadow:inset 0 1px 0 rgba(255,255,255,.25)}
/* hero aside as a glass card floating over the diagram */
.oa.t-c4 .hero-aside,.oa.t-c5 .hero-aside,.oa.t-c6 .hero-aside{max-width:430px;padding:26px 26px 24px;border-radius:24px}
.oa.t-c4 .actions,.oa.t-c5 .actions,.oa.t-c6 .actions{flex-wrap:nowrap}
.oa.t-c4 .hero-bottom,.oa.t-c5 .hero-bottom,.oa.t-c6 .hero-bottom{grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:40px}
.oa.t-c4 .hero h1,.oa.t-c5 .hero h1,.oa.t-c6 .hero h1{white-space:nowrap}
.oa.t-c4 .hero-aside .pill,.oa.t-c5 .hero-aside .pill,.oa.t-c6 .hero-aside .pill{gap:20px;padding:0 18px}
.oa.t-c4 .hero-aside,.oa.t-c6 .hero-aside{background:linear-gradient(150deg,rgba(255,255,255,.09),rgba(255,255,255,.015) 55%,rgba(120,180,255,.05));border:1px solid rgba(255,255,255,.2);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),inset 1px 0 0 rgba(255,255,255,.08),0 24px 60px rgba(0,0,0,.35);-webkit-backdrop-filter:blur(6px) saturate(170%) brightness(1.1);backdrop-filter:blur(6px) saturate(170%) brightness(1.1)}
.oa.t-c5 .hero-aside{background:rgba(22,28,38,.42);border:1px solid rgba(255,255,255,.14);box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 30px 70px rgba(0,0,0,.45);-webkit-backdrop-filter:blur(24px) saturate(160%);backdrop-filter:blur(24px) saturate(160%)}
.oa.t-c4 .hero-goal,.oa.t-c5 .hero-goal,.oa.t-c6 .hero-goal{border-top-color:rgba(255,255,255,.14)}
.oa.t-c4 .hero-shade,.oa.t-c5 .hero-shade,.oa.t-c6 .hero-shade{background:linear-gradient(90deg,#000 0%,rgba(0,0,0,.8) 22%,rgba(0,0,0,.1) 60%,transparent 100%),linear-gradient(0deg,#000 0%,transparent 28%)}
/* c5: glass eyebrow chip */
.oa.t-c5 .hero-top .eyebrow{display:inline-block;padding:8px 14px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.16);box-shadow:inset 0 1px 0 rgba(255,255,255,.2);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);color:#cfd8e2}
/* c6: glass dock along the hero foot */
.oa.t-c6 .hero-inner{padding-bottom:130px}
.oa.t-c6 .hero-foot{bottom:26px;padding:14px 22px;border-radius:999px;width:min(calc(100% - 64px),960px);background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);box-shadow:inset 0 1px 0 rgba(255,255,255,.2);-webkit-backdrop-filter:blur(16px) saturate(160%);backdrop-filter:blur(16px) saturate(160%);color:#c4ccd6}

/* ---- How it works: stop covering the illustration ---- */
/* c4: panel becomes a glass caption strip along the bottom edge */
.oa.t-c4 .panel{left:14px;right:14px;top:auto;bottom:14px;width:auto;transform:none;flex-direction:row;flex-wrap:wrap;align-items:center;column-gap:14px;row-gap:4px;padding:12px 16px;border-radius:14px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.18);box-shadow:inset 0 1px 0 rgba(255,255,255,.3);-webkit-backdrop-filter:blur(12px) saturate(160%);backdrop-filter:blur(12px) saturate(160%)}
.oa.t-c4 .panel b{font-size:14px;text-shadow:none}
.oa.t-c4 .panel small{margin-left:auto;font-size:11px;text-shadow:none}
.oa.t-c4 .concept{top:14px;bottom:auto}
.oa.t-c4 .step-visual>img{object-position:center 30%}
/* c5: panel shrinks to a compact glass chip in the top-left corner */
.oa.t-c5 .panel{left:16px;top:16px;transform:none;width:auto;max-width:78%;gap:5px;padding:11px 15px;border-radius:14px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.2);box-shadow:inset 0 1px 0 rgba(255,255,255,.3);-webkit-backdrop-filter:blur(12px) saturate(160%);backdrop-filter:blur(12px) saturate(160%)}
.oa.t-c5 .panel b{font-size:14px;text-shadow:none}
.oa.t-c5 .panel small{display:none}
/* c6: panel removed from the image; the label moves into the copy column as a glass tag */
.oa.t-c6 .step-visual .panel{display:none}
.oa.t-c6 .step-tag{display:inline-flex;align-items:center;gap:8px;margin-top:22px;padding:8px 13px;border-radius:999px;font-size:10px;color:#d3dbe4;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.16);box-shadow:inset 0 1px 0 rgba(255,255,255,.22)}
.oa.t-c6 .step-tag+.step-meta{margin-top:14px}
@container oa (max-width:760px){
.oa.t-c4 .hero-aside,.oa.t-c5 .hero-aside,.oa.t-c6 .hero-aside{max-width:none;padding:22px 20px}
.oa.t-c6 .hero-foot{width:calc(100% - 40px);padding:12px 16px}
}

/* ===== V3 (c6) hero reset: glass ONLY on the pill shapes ===== */
.oa.t-c6 .hero-aside{max-width:360px;padding:0;border-radius:0;background:none;border:0;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}
.oa.t-c6 .hero-bottom{grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:48px}
.oa.t-c6 .hero-goal{border-top-color:#2a2a2a}
.oa.t-c6 .hero-aside .pill{gap:32px;padding:0 21px}
.oa.t-c6 .actions{flex-wrap:wrap}
.oa.t-c6 .hero-shade{background:linear-gradient(90deg,#000 0%,rgba(0,0,0,.8) 22%,rgba(0,0,0,.2) 65%,transparent 100%),linear-gradient(0deg,#000 0%,transparent 32%)}
.oa.t-c6 .hero-inner{padding-bottom:112px}
.oa.t-c6 .hero-foot{bottom:30px;padding:0;border-radius:0;width:min(calc(100% - 64px),960px);background:none;border:0;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;color:#999}
/* dark rounded pills: nav + secondary button */
.oa.t-c6 .desktop-nav,.oa.t-c6 .hero .pill-glass{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);box-shadow:inset 0 1px 0 rgba(255,255,255,.28),inset 0 -1px 0 rgba(255,255,255,.05),0 8px 24px rgba(0,0,0,.25);-webkit-backdrop-filter:blur(20px) saturate(180%);backdrop-filter:blur(20px) saturate(180%)}
.oa.t-c6 .hero .pill-glass:hover{background:rgba(255,255,255,.14)}
/* white rounded pills: header CTA + primary hero button */
.oa.t-c6 .nav-cta,.oa.t-c6 .hero .pill-white{background:linear-gradient(180deg,rgba(255,255,255,.94),rgba(238,242,247,.84));border:1px solid rgba(255,255,255,.7);box-shadow:inset 0 1px 0 #fff,inset 0 -1px 0 rgba(0,0,0,.06),0 8px 24px rgba(0,0,0,.28);-webkit-backdrop-filter:blur(20px) saturate(180%);backdrop-filter:blur(20px) saturate(180%);color:#080808}
.oa.t-c6 .nav-cta:hover,.oa.t-c6 .hero .pill-white:hover{background:var(--accent);border-color:var(--accent);color:#000}
@container oa (max-width:760px){
.oa.t-c6 .hero-aside{padding:0}
.oa.t-c6 .hero-foot{width:calc(100% - 40px);padding:0}
}

/* ===== Final candidate (c1): glass on nav pill + hero pills (per comments) ===== */
.oa.t-c1 .desktop-nav,.oa.t-c1 .hero .pill-glass{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);box-shadow:inset 0 1px 0 rgba(255,255,255,.28),inset 0 -1px 0 rgba(255,255,255,.05),0 8px 24px rgba(0,0,0,.25);-webkit-backdrop-filter:blur(20px) saturate(180%);backdrop-filter:blur(20px) saturate(180%)}
.oa.t-c1 .hero .pill-glass:hover{background:rgba(255,255,255,.14)}
.oa.t-c1 .hero .pill-white{background:linear-gradient(180deg,rgba(255,255,255,.94),rgba(238,242,247,.84));border:1px solid rgba(255,255,255,.7);box-shadow:inset 0 1px 0 #fff,inset 0 -1px 0 rgba(0,0,0,.06),0 8px 24px rgba(0,0,0,.28);-webkit-backdrop-filter:blur(20px) saturate(180%);backdrop-filter:blur(20px) saturate(180%);color:#080808}
.oa.t-c1 .hero .pill-white:hover{background:var(--accent);border-color:var(--accent);color:#000}

/* more transparent glass pills (c1 + c6) */
.oa.t-c1 .desktop-nav,.oa.t-c1 .hero .pill-glass,.oa.t-c6 .desktop-nav,.oa.t-c6 .hero .pill-glass{background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.18);box-shadow:inset 0 1px 0 rgba(255,255,255,.32),inset 0 -1px 0 rgba(255,255,255,.04);-webkit-backdrop-filter:blur(8px) saturate(170%);backdrop-filter:blur(8px) saturate(170%)}
.oa.t-c1 .hero .pill-white,.oa.t-c6 .hero .pill-white,.oa.t-c6 .nav-cta{background:linear-gradient(180deg,rgba(255,255,255,.62),rgba(255,255,255,.4));border:1px solid rgba(255,255,255,.55);box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 6px 20px rgba(0,0,0,.25);-webkit-backdrop-filter:blur(8px) saturate(170%);backdrop-filter:blur(8px) saturate(170%);color:#050505}

/* page 3 (c1 + c6): art shifted up-right, text panel back on the art at bottom-left */
.oa.t-c1 .step-visual .panel,.oa.t-c6 .step-visual .panel{display:flex;left:18px;top:auto;bottom:18px;transform:none;width:min(64%,290px)}
.oa.t-c6 .step-tag{display:none}
.oa.t-c1 .concept,.oa.t-c6 .concept{top:14px;bottom:auto}

/* hero white pills -> clear transparent glass (c1 + c6), header CTA included */
.oa.t-c1 .hero .pill-white,.oa.t-c1 .nav-cta,.oa.t-c6 .hero .pill-white,.oa.t-c6 .nav-cta{background:linear-gradient(180deg,rgba(255,255,255,.14),rgba(255,255,255,.04));border:1px solid rgba(255,255,255,.34);box-shadow:inset 0 1px 0 rgba(255,255,255,.5),inset 0 -1px 0 rgba(255,255,255,.06),0 6px 20px rgba(0,0,0,.2);-webkit-backdrop-filter:blur(8px) saturate(170%);backdrop-filter:blur(8px) saturate(170%);color:#fff}
.oa.t-c1 .hero .pill-white:hover,.oa.t-c1 .nav-cta:hover,.oa.t-c6 .hero .pill-white:hover,.oa.t-c6 .nav-cta:hover{background:rgba(255,255,255,.2);border-color:rgba(255,255,255,.5);color:#fff}

/* hero white buttons -> 20% white glass (c1 + c6) */
.oa.t-c1 .hero .pill-white,.oa.t-c1 .nav-cta,.oa.t-c6 .hero .pill-white,.oa.t-c6 .nav-cta{background:rgba(255,255,255,.2);border:1px solid rgba(255,255,255,.35);box-shadow:inset 0 1px 0 rgba(255,255,255,.45),0 6px 20px rgba(0,0,0,.2);-webkit-backdrop-filter:blur(14px) saturate(170%);backdrop-filter:blur(14px) saturate(170%);color:#fff}
.oa.t-c1 .hero .pill-white:hover,.oa.t-c1 .nav-cta:hover,.oa.t-c6 .hero .pill-white:hover,.oa.t-c6 .nav-cta:hover{background:rgba(255,255,255,.3);border-color:rgba(255,255,255,.5);color:#fff}

.oa .hd0{animation-delay:150ms}
.oa .hd1{animation-delay:230ms}
.oa .hd2{animation-delay:310ms}
.oa .hd3{animation-delay:390ms}
.oa .hd4{animation-delay:470ms}
.oa .hd5{animation-delay:550ms}
.oa .hd6{animation-delay:630ms}
.oa .hd7{animation-delay:710ms}
.oa .hd8{animation-delay:790ms}
.oa .hd9{animation-delay:870ms}
.oa .hd10{animation-delay:950ms}
.oa .hd11{animation-delay:1030ms}
.oa .id0{animation-delay:560ms}
.oa .id1{animation-delay:582ms}
.oa .id2{animation-delay:604ms}
.oa .id3{animation-delay:626ms}
.oa .id4{animation-delay:648ms}
.oa .id5{animation-delay:670ms}
.oa .id6{animation-delay:692ms}
.oa .id7{animation-delay:714ms}
.oa .id8{animation-delay:736ms}
.oa .id9{animation-delay:758ms}
.oa .id10{animation-delay:780ms}
.oa .id11{animation-delay:802ms}
.oa .id12{animation-delay:824ms}
.oa .id13{animation-delay:846ms}
.oa .id14{animation-delay:868ms}
.oa .id15{animation-delay:890ms}
.oa .id16{animation-delay:912ms}
.oa .id17{animation-delay:934ms}
.oa .id18{animation-delay:956ms}
.oa .id19{animation-delay:978ms}
.oa .id20{animation-delay:1000ms}
.oa .id21{animation-delay:1022ms}
.oa .id22{animation-delay:1044ms}
.oa .id23{animation-delay:1066ms}
.oa .id24{animation-delay:1088ms}
.oa .id25{animation-delay:1110ms}
.oa .id26{animation-delay:1132ms}
.oa .id27{animation-delay:1154ms}
.oa .id28{animation-delay:1176ms}
.oa .id29{animation-delay:1198ms}
.oa .id30{animation-delay:1220ms}
.oa .id31{animation-delay:1242ms}
.oa .id32{animation-delay:1264ms}
.oa .id33{animation-delay:1286ms}
.oa .td0{transition-delay:0ms}
.oa .td1{transition-delay:70ms}
.oa .td2{transition-delay:140ms}
.oa .td3{transition-delay:210ms}
.oa .td4{transition-delay:280ms}
.oa .td5{transition-delay:350ms}
.oa .td6{transition-delay:420ms}
.oa .td7{transition-delay:490ms}
.oa .td8{transition-delay:560ms}
.oa .td9{transition-delay:630ms}
.oa .td10{transition-delay:700ms}
.oa .td11{transition-delay:770ms}
.oa .u1{animation-delay:60ms}.oa .u2{animation-delay:1150ms}.oa .u3{animation-delay:1300ms}.oa .u4{animation-delay:1450ms}

/* ---- additions for the site build ---- */
.oa .lang{height:36px;padding:0 14px;gap:0;font-size:12px;letter-spacing:.06em}
.oa .header-actions{display:flex;align-items:center;gap:8px}
.oa .statement{max-width:900px;margin:0 auto;text-align:center}
.oa .statement h2{margin:22px 0 0;font-size:clamp(28px,3.4cqi,46px);line-height:1.22;letter-spacing:-.04em;font-weight:500;text-transform:none;color:var(--text)}
.oa .statement h2 em{font-style:normal;color:#7cc4ff}
.oa .approach .roadmap-card{min-height:380px}
.oa .approach .roadmap-card h3{margin-top:48px}
.oa .card-sub{margin:0 0 12px;font-size:13px;color:#a3a3a3}
.oa .contact .contact-mail{margin-top:34px;text-transform:none;letter-spacing:0;font-size:15px;font-weight:500}
.oa .footer-loc{display:block;margin-top:8px;font-size:12px;color:#8c8c8c}
@container oa (max-width:760px){.oa .header-actions .nav-cta{display:none}.oa .approach .roadmap-card{min-height:0}.oa .statement h2{font-size:clamp(24px,6.4cqi,34px)}}
/* hero headline about 15% smaller than the design reference */
.oa .hero h1{font-size:clamp(54px,6.2cqi,88px)}
@container oa (max-width:1000px){.oa .hero h1{font-size:clamp(52px,6.6cqi,68px)}}
@container oa (max-width:760px){.oa .hero h1{font-size:clamp(48px,12.8cqi,70px)}}
@container oa (max-width:460px){.oa .hero h1{font-size:clamp(42px,13cqi,52px)}}
/* Korean */
html[lang=ko] .oa{font-family:Pretendard,'Pretendard Variable',Inter,ui-sans-serif,system-ui,sans-serif;word-break:keep-all}
html[lang=ko] .oa .hero h1{letter-spacing:-.045em;line-height:1.02}
html[lang=ko] .oa .section-head h2,html[lang=ko] .oa .contact h2{letter-spacing:-.04em;line-height:1.12}
html[lang=ko] .oa .statement h2{letter-spacing:-.025em;line-height:1.4}
html[lang=ko] .oa .roadmap-card h3{letter-spacing:-.04em}
html[lang=ko] .oa .mono{font-family:Pretendard,'Pretendard Variable','DM Mono',ui-monospace,monospace;letter-spacing:.04em}
html[lang=ko] .oa .hero-intro,html[lang=ko] .oa .section-sub,html[lang=ko] .oa .contact-copy{letter-spacing:-.01em}