:root{--bg:#020617;--panel:#0b1220;--panel2:#0f172a;--line:#1e293b;--text:#f8fafc;--muted:#94a3b8;--green:#84cc16;--cyan:#06b6d4;--cyan2:#67e8f9;--danger:#fb7185;--shadow:0 24px 80px rgba(0,0,0,.35);--radius:22px}
*{box-sizing:border-box}html{scroll-behavior:smooth;background:var(--bg)}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif;overflow-x:hidden}a{color:inherit;text-decoration:none}img,video{max-width:100%;display:block}button,input,select,textarea{font:inherit}.mono{font-family:"Fira Code",monospace}.container{width:min(1180px,calc(100% - 36px));margin:auto}.muted{color:var(--muted)}.green{color:var(--green)}.cyan{color:var(--cyan)}.eyebrow{display:inline-flex;align-items:center;gap:8px;padding:7px 11px;border:1px solid #243148;border-radius:999px;background:rgba(15,23,42,.72);color:#a7b5c9;font:600 11px "Fira Code",monospace;letter-spacing:.03em}.eyebrow i{width:7px;height:7px;background:var(--green);border-radius:50%;box-shadow:0 0 14px var(--green)}
.topbar{position:fixed;inset:0 0 auto;z-index:1000;background:rgba(2,6,23,.76);backdrop-filter:blur(18px);border-bottom:1px solid rgba(148,163,184,.12)}.nav{height:78px;display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{display:flex;align-items:center;gap:12px;min-width:max-content}.brand img{width:62px;height:42px;object-fit:contain}.brandcopy{padding-left:12px;border-left:1px solid #273449;line-height:1}.brandcopy strong{display:block;font:700 16px "Fira Code",monospace;letter-spacing:.03em}.brandcopy span{display:block;margin-top:7px;color:var(--cyan);font:600 9px "Fira Code",monospace;letter-spacing:.15em}.navlinks{display:flex;align-items:center;gap:24px;color:#9aa8bc;font:500 12px "Fira Code",monospace}.navlinks a:hover{color:var(--cyan2)}.navcta,.btn{border:1px solid var(--green);color:var(--green);background:transparent;border-radius:10px;padding:12px 16px;font:700 11px "Fira Code",monospace;cursor:pointer;transition:.25s}.navcta:hover,.btn:hover{background:var(--green);color:#071006;box-shadow:0 0 28px rgba(132,204,22,.22)}.btn.cyanbtn{border-color:var(--cyan);color:#00141a;background:var(--cyan);box-shadow:0 0 30px rgba(6,182,212,.22)}.btn.cyanbtn:hover{background:#a5f3fc;border-color:#a5f3fc}.btn.ghost{border-color:#314057;color:#c8d4e5}.btn.ghost:hover{background:#172033;color:white}
.hero{min-height:94vh;position:relative;display:flex;align-items:center;padding:130px 0 80px;overflow:hidden}.hero-media{position:absolute;inset:0}.hero-media video{width:100%;height:100%;object-fit:cover;opacity:.26;mix-blend-mode:screen}.hero-media:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 70% 30%,rgba(6,182,212,.12),transparent 34%),linear-gradient(180deg,rgba(2,6,23,.20),rgba(2,6,23,.82) 63%,#020617 100%)}.gridfx{position:absolute;inset:0;opacity:.13;background-image:linear-gradient(rgba(6,182,212,.35) 1px,transparent 1px),linear-gradient(90deg,rgba(6,182,212,.35) 1px,transparent 1px);background-size:48px 48px;mask-image:linear-gradient(to bottom,black,transparent 90%)}.hero-content{position:relative;z-index:2;display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:center}.hero h1{font-size:clamp(42px,6vw,78px);line-height:.98;letter-spacing:-.055em;margin:19px 0 23px;max-width:820px}.hero h1 .accent{background:linear-gradient(90deg,#fff 12%,#67e8f9 70%,#84cc16);-webkit-background-clip:text;background-clip:text;color:transparent}.hero p{font-size:18px;line-height:1.75;color:#aab6c7;max-width:720px}.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}.terminal{background:rgba(7,13,27,.82);border:1px solid rgba(103,232,249,.18);border-radius:18px;box-shadow:var(--shadow),inset 0 0 50px rgba(6,182,212,.03);overflow:hidden}.terminal-head{height:44px;padding:0 15px;display:flex;align-items:center;justify-content:space-between;background:#0c1423;border-bottom:1px solid #1b2a3e;color:#63738a;font:10px "Fira Code",monospace}.dots{display:flex;gap:7px}.dots i{width:8px;height:8px;border-radius:50%;background:#334155}.terminal-body{padding:22px;font:12px/1.8 "Fira Code",monospace;color:#91a2b9;min-height:360px}.terminal-body .cmd{color:#e2e8f0}.terminal-body .ok{color:var(--green)}.terminal-body .info{color:var(--cyan2)}.terminal-line{opacity:0;transform:translateY(4px);animation:terminalLine .42s forwards}.terminal-line:nth-child(2){animation-delay:.35s}.terminal-line:nth-child(3){animation-delay:.7s}.terminal-line:nth-child(4){animation-delay:1.05s}.terminal-line:nth-child(5){animation-delay:1.4s}.terminal-line:nth-child(6){animation-delay:1.75s}.terminal-line:nth-child(7){animation-delay:2.1s}@keyframes terminalLine{to{opacity:1;transform:none}}
.section{padding:96px 0}.section.alt{background:#06101f;border-block:1px solid #122037}.section-head{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:42px}.section-head h2{font-size:clamp(30px,4vw,48px);line-height:1.05;letter-spacing:-.04em;margin:10px 0 0}.section-head p{max-width:580px;color:var(--muted);line-height:1.75;margin:0}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.card{position:relative;min-height:270px;padding:25px;background:linear-gradient(155deg,rgba(15,23,42,.85),rgba(5,11,24,.95));border:1px solid #1c2a40;border-radius:var(--radius);overflow:hidden;transition:.25s}.card:hover{transform:translateY(-4px);border-color:rgba(132,204,22,.5);box-shadow:0 20px 55px rgba(0,0,0,.32)}.card:after{content:"";position:absolute;width:170px;height:170px;right:-90px;top:-90px;background:radial-gradient(circle,rgba(6,182,212,.18),transparent 70%)}.card .num{font:700 10px "Fira Code",monospace;color:#526279}.card h3{font-size:21px;margin:28px 0 11px}.card p{color:#95a5ba;font-size:14px;line-height:1.72}.card .link{position:absolute;bottom:23px;left:25px;color:var(--cyan2);font:600 11px "Fira Code",monospace}.card.featured{border-color:rgba(132,204,22,.3)}
.challenge{display:grid;grid-template-columns:.9fr 1.1fr;gap:34px;align-items:stretch}.problem-list{display:grid;gap:10px;margin-top:28px}.problem{display:flex;gap:13px;align-items:flex-start;padding:13px 15px;border:1px solid #1c2b41;border-radius:12px;background:#08101d;color:#b2bfd0;font-size:14px}.problem:before{content:">";color:var(--green);font:700 13px "Fira Code",monospace}.challenge-media{position:relative;border-radius:22px;overflow:hidden;border:1px solid #20314a;min-height:470px}.challenge-media video{position:absolute;width:100%;height:100%;object-fit:cover;opacity:.35}.challenge-media .overlay{position:absolute;inset:0;background:linear-gradient(180deg,transparent,#020617 90%)}.challenge-media .copy{position:absolute;left:28px;right:28px;bottom:28px}.challenge-media h3{font-size:35px;line-height:1.08;margin:0 0 12px}.challenge-media p{color:#9aacbf;line-height:1.7}
.case-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}.case{padding:28px;border-radius:22px;border:1px solid #1a2940;background:#08111f}.case .tag{font:600 10px "Fira Code",monospace;color:var(--green)}.case h3{font-size:25px;margin:14px 0 10px}.case p{color:#9aa9bd;line-height:1.72;font-size:14px}.case .flow{margin-top:18px;display:flex;gap:7px;flex-wrap:wrap}.chip{padding:6px 9px;border:1px solid #2a3a52;border-radius:999px;color:#a9b8ca;font:500 9px "Fira Code",monospace;background:#0c1524}
.compiler-wrap{display:grid;grid-template-columns:1fr 1fr;gap:22px}.compiler{border:1px solid #1c2b41;background:#08111f;border-radius:22px;overflow:hidden}.compiler-head{padding:14px 18px;background:#0d1727;border-bottom:1px solid #1c2b41;display:flex;justify-content:space-between;color:#6f8097;font:10px "Fira Code",monospace}.compiler-body{padding:24px}.question{margin-bottom:22px}.question label{display:block;color:#d7e0ec;font:600 12px "Fira Code",monospace;margin-bottom:10px}.choice-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.choice{padding:11px 12px;border:1px solid #26354b;background:#0b1423;color:#aab8c9;border-radius:10px;cursor:pointer;font-size:12px;text-align:left}.choice.active{border-color:var(--green);color:white;background:rgba(132,204,22,.08);box-shadow:inset 0 0 0 1px rgba(132,204,22,.12)}.compiler-output{padding:26px;background:#050c17;border:1px solid #1c2b41;border-radius:22px;min-height:100%;display:flex;flex-direction:column}.compiler-output pre{white-space:pre-wrap;color:#a4b3c7;font:11px/1.8 "Fira Code",monospace;flex:1}.compiler-output strong{color:#fff}.compiler-output .result{color:var(--green)}
.techbar{border-block:1px solid #152238;background:#050b15;padding:23px 0}.techs{display:flex;gap:12px;flex-wrap:wrap;justify-content:center}.techs span{padding:8px 11px;border:1px solid #192940;border-radius:8px;color:#64748b;font:600 10px "Fira Code",monospace}
.cta-band{padding:88px 0;background:radial-gradient(circle at 20% 20%,rgba(132,204,22,.08),transparent 30%),radial-gradient(circle at 80% 40%,rgba(6,182,212,.12),transparent 35%),#07101d;border-top:1px solid #18283e}.cta-box{text-align:center;max-width:870px;margin:auto}.cta-box h2{font-size:clamp(34px,5vw,62px);line-height:1.02;letter-spacing:-.045em;margin:15px 0}.cta-box p{color:#9eacbf;font-size:17px;line-height:1.7;margin:0 auto 25px;max-width:730px}
.footer{padding:55px 0 30px;border-top:1px solid #14223a;background:#020617}.footer-grid{display:grid;grid-template-columns:1.2fr .8fr .8fr;gap:40px}.footer p,.footer a{color:#74849a;font-size:12px;line-height:1.8}.footer a:hover{color:var(--cyan2)}.footer-title{font:700 11px "Fira Code",monospace;color:#d5deeb;margin-bottom:12px}.signature{margin-top:34px;padding-top:24px;border-top:1px solid #132138;display:flex;align-items:center;justify-content:space-between;color:#55657b;font:10px "Fira Code",monospace}.signature img{width:160px;opacity:.75}
.floating-wa{position:fixed;right:22px;bottom:22px;z-index:900;width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:var(--green);color:#061006;font-weight:900;box-shadow:0 0 28px rgba(132,204,22,.30);transition:.25s}.floating-wa:hover{transform:scale(1.08)}
.subhero{padding:145px 0 72px;background:radial-gradient(circle at 78% 15%,rgba(6,182,212,.11),transparent 32%),linear-gradient(180deg,#07101d,#020617);border-bottom:1px solid #16243a}.breadcrumbs{color:#64748b;font:500 10px "Fira Code",monospace;margin-bottom:24px}.breadcrumbs a{color:#7dd3fc}.subhero h1{font-size:clamp(38px,5.8vw,70px);max-width:980px;line-height:1.02;letter-spacing:-.05em;margin:12px 0 20px}.subhero p{max-width:810px;color:#a7b4c6;font-size:18px;line-height:1.75}.subhero .hero-actions{margin-top:26px}.metric-row{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:36px}.metric{border:1px solid #1b2a40;background:rgba(8,17,31,.74);padding:15px;border-radius:14px}.metric b{display:block;color:#eef5ff;font-size:13px}.metric span{display:block;color:#718198;font:9px "Fira Code",monospace;margin-top:7px;text-transform:uppercase}.twocol{display:grid;grid-template-columns:1fr 1fr;gap:28px}.content-block{border:1px solid #1b2b42;background:#08111f;border-radius:22px;padding:27px}.content-block h2,.content-block h3{margin-top:0}.content-block p,.content-block li{color:#9baabd;line-height:1.78;font-size:14px}.content-block ul{padding-left:19px}.steps{counter-reset:step;display:grid;gap:12px}.step{counter-increment:step;border:1px solid #1d2d44;background:#07101d;border-radius:15px;padding:17px 18px 17px 58px;position:relative}.step:before{content:counter(step,decimal-leading-zero);position:absolute;left:17px;top:17px;color:var(--green);font:700 11px "Fira Code",monospace}.step b{font-size:14px}.step p{margin:7px 0 0;color:#8999ad;font-size:13px;line-height:1.65}.solution-nav{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.solution-nav a{padding:14px;border:1px solid #1b2b42;border-radius:12px;color:#9dadc1;font-size:12px;background:#07101d}.solution-nav a:hover{border-color:#36577a;color:white}.faq details{border:1px solid #1b2b42;border-radius:13px;background:#08111f;margin:9px 0;padding:15px 17px}.faq summary{cursor:pointer;color:#dbe5f2;font-weight:600}.faq p{color:#92a2b6;font-size:13px;line-height:1.7}.hub-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.hub-card{padding:22px;border-radius:18px;border:1px solid #1b2a40;background:#07111f;min-height:205px}.hub-card h3{margin:12px 0 8px;font-size:19px}.hub-card p{color:#8fa0b5;font-size:13px;line-height:1.65}.hub-card span{color:var(--cyan2);font:600 9px "Fira Code",monospace}.notice{border-left:3px solid var(--cyan);padding:13px 16px;background:rgba(6,182,212,.06);color:#9fb0c4;font-size:13px;line-height:1.7}.mobile-toggle{display:none;background:transparent;border:1px solid #26364d;color:#cbd5e1;border-radius:8px;padding:9px 11px}
@media(max-width:980px){.navlinks{display:none}.mobile-toggle{display:block}.hero-content,.challenge,.compiler-wrap,.twocol{grid-template-columns:1fr}.hero{min-height:auto}.hero-content{gap:34px}.cards,.hub-grid{grid-template-columns:repeat(2,1fr)}.metric-row,.solution-nav{grid-template-columns:repeat(2,1fr)}.footer-grid{grid-template-columns:1fr 1fr}.terminal-body{min-height:300px}.challenge-media{min-height:420px}}
@media(max-width:640px){.container{width:min(100% - 26px,1180px)}.nav{height:68px}.brand img{width:48px}.brandcopy strong{font-size:13px}.brandcopy span{font-size:8px}.navcta{display:none}.hero{padding:112px 0 58px}.hero h1{font-size:43px}.hero p,.subhero p{font-size:15px}.terminal-body{padding:17px;font-size:10px;min-height:290px}.section{padding:68px 0}.section-head{display:block}.section-head p{margin-top:15px}.cards,.hub-grid,.case-grid,.metric-row,.solution-nav,.footer-grid{grid-template-columns:1fr}.choice-grid{grid-template-columns:1fr}.card{min-height:250px}.subhero{padding:115px 0 58px}.subhero h1{font-size:41px}.challenge-media{min-height:360px}.signature{align-items:flex-start;gap:18px;flex-direction:column}.floating-wa{right:15px;bottom:15px}.footer{padding-bottom:90px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}.hero-media video,.challenge-media video{display:none}}


/* V2.1 refinements */
.hero h1 .type-prefix,.hero h1 .type-accent{display:inline}
.typing-cursor{display:inline-block;min-width:.55ch;margin-left:2px;color:var(--green);animation:blinkCursor 1s steps(1,end) infinite}
.hero h1.is-typing .typing-cursor{opacity:1}
.hero h1.is-typed .typing-cursor{opacity:.9}
@keyframes blinkCursor{50%{opacity:0}}

.signature img{width:220px;max-width:100%;opacity:.92}
.hero .eyebrow,.cta-box .eyebrow{box-shadow:0 0 24px rgba(6,182,212,.08)}
.hero-actions .btn,.cta-box .btn{letter-spacing:.02em}

@media(max-width:980px){
  .hero-content{gap:26px}
  .section{padding:78px 0}
  .section-head{text-align:left}
}
@media(max-width:640px){
  .hero{padding:100px 0 34px}
  .hero-content{gap:18px}
  .hero .eyebrow,.section-head .eyebrow,.challenge .eyebrow,.cta-box .eyebrow,.subhero .eyebrow{margin-inline:auto}
  .hero,.section-head,.subhero,.cta-box,.challenge > div:first-child,.footer-grid > div,.signature{text-align:center}
  .hero h1{font-size:37px;line-height:1.02;max-width:none;margin:14px auto 14px}
  .hero p,.subhero p{font-size:15px;line-height:1.65;max-width:none;margin-inline:auto}
  .hero-actions,.subhero .hero-actions{justify-content:center}
  .terminal{margin-inline:auto}
  .terminal-body{min-height:0;padding:15px;font-size:10px;display:flex;flex-direction:column;gap:5px}
  .terminal-line{line-height:1.45}
  .section{padding:54px 0}
  .section-head{margin-bottom:24px}
  .section-head h2{margin-top:12px}
  .section-head p{margin-top:12px;max-width:none}
  .cards,.hub-grid,.case-grid,.metric-row,.solution-nav,.footer-grid{gap:14px}
  .card{min-height:auto;padding:22px 20px 58px}
  .card h3{margin-top:20px}
  .challenge{gap:18px}
  .problem-list{margin-top:16px}
  .problem{font-size:13px;line-height:1.55;text-align:left}
  .challenge-media{min-height:310px}
  .challenge-media .copy{left:18px;right:18px;bottom:18px;text-align:center}
  .challenge-media h3{font-size:27px}
  .compiler-wrap{gap:14px}
  .compiler-body{padding:18px}
  .compiler-output{padding:18px}
  .compiler-output .compiler-head{margin:-18px -18px 16px!important}
  .compiler-output pre{font-size:10px;line-height:1.7;min-height:220px}
  .question{margin-bottom:18px}
  .techbar{padding:18px 0}
  .techs{gap:8px}
  .cta-band{padding:68px 0}
  .cta-box h2{font-size:34px}
  .cta-box p{font-size:15px}
  .subhero{padding:108px 0 50px}
  .subhero h1{font-size:36px;max-width:none;margin-left:auto;margin-right:auto}
  .breadcrumbs{margin-bottom:18px}
  .metric{padding:14px}
  .metric b,.content-block h2,.content-block h3,.hub-card h3,.case h3{word-break:break-word}
  .notice{text-align:left}
  .footer{padding-top:46px;padding-bottom:100px}
  .footer .brand{justify-content:center}
  .footer p{max-width:none!important}
  .signature{align-items:center;justify-content:center;gap:14px;flex-direction:column}
  .signature img{width:min(100%,340px);margin-inline:auto}
}