@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500;600&display=swap');

:root {
    --primary: #5b21b6;
    --primary-2: #7c3aed;
    --primary-3: #a855f7;
    --cyan: #06b6d4;
    --pink: #ec4899;
    --blue: #3b82f6;
    --ink: #111827;
    --muted: #64748b;
    --soft: #f6f7ff;
    --surface: #ffffff;
    --surface-2: #f8fafc;
    --border: #e5e7eb;
    --heading: #172554;
    --text: #334155;
    --text-muted: #64748b;
    --bg: #ffffff;
    --bg-secondary: #f8fafc;
    --shadow-sm: 0 6px 18px rgba(30, 41, 59, .06);
    --shadow: 0 18px 50px rgba(30, 41, 59, .09);
    --shadow-lg: 0 30px 90px rgba(76, 29, 149, .16);
    --radius-sm: 12px;
    --radius: 18px;
    --radius-lg: 28px;
    --max-width: 1180px;
    --transition: .28s cubic-bezier(.2,.75,.25,1);
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { font-family: Inter, Arial, sans-serif; background: var(--bg); color: var(--text); line-height: 1.65; overflow-x: hidden; transition: background .3s, color .3s; }
body.dark-mode { --bg: #090b18; --bg-secondary: #111427; --surface: #12162a; --surface-2: #171b31; --heading: #f8fafc; --ink: #f8fafc; --text: #cbd5e1; --text-muted: #94a3b8; --muted: #94a3b8; --border: #272d45; --soft: #101326; --shadow: 0 20px 60px rgba(0,0,0,.28); }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
button { border: 0; cursor: pointer; }
pre, code { font-family: 'JetBrains Mono', monospace; }
.site-progress { position: fixed; top: 0; left: 0; width: 0; height: 3px; background: linear-gradient(90deg,var(--primary-2),var(--cyan),var(--pink)); z-index: 2000; }

.topbar { position: sticky; top: 0; z-index: 1000; background: rgba(255,255,255,.84); border-bottom: 1px solid rgba(229,231,235,.8); backdrop-filter: blur(18px); }
body.dark-mode .topbar { background: rgba(9,11,24,.84); border-color: var(--border); }
.topbar-inner { width: min(calc(100% - 40px),var(--max-width)); min-height: 78px; margin: auto; display: flex; align-items: center; gap: 28px; }
.brand { display: inline-flex; align-items: center; gap: 10px; flex-shrink: 0; }
.brand-icon { width: 42px; height: 42px; border-radius: 13px; display: grid; place-items: center; color: #fff; font-size: 23px; background: linear-gradient(135deg,var(--primary-2),var(--cyan)); box-shadow: 0 10px 25px rgba(91,33,182,.24); }
.brand-copy { display: grid; line-height: 1; gap: 5px; }
.brand-copy strong { font-size: 21px; letter-spacing: -.8px; color: var(--heading); }
.brand-copy small { font-size: 7px; letter-spacing: 3px; color: var(--muted); font-weight: 800; }
.main-navigation { margin: auto; display: flex; align-items: center; gap: 4px; }
.main-navigation a { position: relative; padding: 9px 12px; color: var(--muted); font-size: 13px; font-weight: 700; transition: color var(--transition); }
.main-navigation a::after { content: ''; position: absolute; left: 12px; right: 12px; bottom: 1px; height: 2px; transform: scaleX(0); transform-origin: center; background: linear-gradient(90deg,var(--primary-2),var(--cyan)); border-radius: 5px; transition: transform var(--transition); }
.main-navigation a:hover, .main-navigation a.active { color: var(--heading); }
.main-navigation a:hover::after, .main-navigation a.active::after { transform: scaleX(1); }
.topbar-actions { display: flex; align-items: center; gap: 8px; }
.search-trigger { display: flex; align-items: center; gap: 8px; padding: 9px 11px; min-width: 180px; color: var(--muted); background: var(--surface); border: 1px solid var(--border); border-radius: 999px; font-size: 11px; box-shadow: var(--shadow-sm); }
.search-trigger kbd { margin-left: auto; padding: 2px 6px; border: 1px solid var(--border); border-radius: 5px; font-size: 9px; }
.icon-button { width: 39px; height: 39px; display: grid; place-items: center; border-radius: 50%; color: var(--heading); background: var(--surface); border: 1px solid var(--border); transition: transform var(--transition), background var(--transition), color var(--transition); }
.icon-button:hover { transform: translateY(-2px); color: var(--primary-2); background: var(--soft); }
.mobile-menu-button, .mobile-navigation { display: none; }

.hero-section { position: relative; min-height: 650px; display: flex; align-items: center; overflow: hidden; background: linear-gradient(135deg,#fff 0%,#f8f7ff 52%,#eefbff 100%); }
body.dark-mode .hero-section { background: radial-gradient(circle at 80% 20%,rgba(124,58,237,.2),transparent 35%), #090b18; }
.hero-container { width: min(calc(100% - 40px),var(--max-width)); margin: auto; padding: 88px 0 95px; display: grid; grid-template-columns: 1fr .98fr; gap: 70px; align-items: center; }
.hero-glow { position: absolute; border-radius: 50%; filter: blur(5px); pointer-events: none; }
.hero-glow-one { width: 390px; height: 390px; right: 5%; top: 5%; background: rgba(168,85,247,.13); }
.hero-glow-two { width: 260px; height: 260px; left: -80px; bottom: -100px; background: rgba(6,182,212,.1); }
.hero-label, .section-label { display: inline-flex; align-items: center; gap: 8px; color: var(--primary-2); font-size: 11px; font-weight: 800; letter-spacing: 1.1px; text-transform: uppercase; }
.hero-label { padding: 8px 13px; border-radius: 999px; background: rgba(124,58,237,.08); border: 1px solid rgba(124,58,237,.14); }
.hero-content h1 { margin: 19px 0 20px; color: var(--heading); font-size: clamp(48px,6vw,74px); line-height: .99; letter-spacing: -3.8px; font-weight: 800; }
.hero-content h1 span, .section-heading h2 span, .why-copy h2 span, .practice-copy h2 span { color: var(--primary-2); }
.hero-description { max-width: 600px; color: var(--muted); font-size: 17px; line-height: 1.8; }
.hero-buttons { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.primary-button, .secondary-button, .cta-button { display: inline-flex; align-items: center; justify-content: center; gap: 10px; border-radius: 999px; font-weight: 800; font-size: 13px; transition: transform var(--transition), box-shadow var(--transition), background var(--transition); }
.primary-button { padding: 14px 21px; color: #fff; background: linear-gradient(135deg,var(--primary-2),#4f46e5); box-shadow: 0 14px 30px rgba(109,40,217,.24); }
.primary-button:hover { transform: translateY(-3px); box-shadow: 0 18px 35px rgba(109,40,217,.3); }
.secondary-button { padding: 13px 19px; color: var(--heading); border: 1px solid #c7d2fe; background: rgba(255,255,255,.7); }
.secondary-button:hover { transform: translateY(-3px); border-color: var(--primary-2); color: var(--primary-2); }
.hero-features { display: flex; flex-wrap: wrap; gap: 17px; margin-top: 30px; color: var(--muted); font-size: 11px; font-weight: 700; }
.hero-features span { display: inline-flex; align-items: center; gap: 7px; }
.hero-features i { color: var(--primary-2); }
.hero-visual { position: relative; min-height: 450px; display: grid; place-items: center; }
.code-window { width: min(100%,540px); position: relative; z-index: 2; border-radius: 22px; overflow: hidden; background: #0d1224; border: 1px solid rgba(129,140,248,.3); box-shadow: 0 35px 90px rgba(49,46,129,.25); transform: rotate(1.3deg); animation: floatCode 6s ease-in-out infinite; }
.code-window-header { height: 58px; display: flex; align-items: center; gap: 14px; padding: 0 18px; color: #9ca3af; background: #12182d; border-bottom: 1px solid #26304d; font-size: 12px; }
.code-window-header i { margin-left: auto; color: #38bdf8; font-size: 25px; }
.window-dots { display: flex; gap: 6px; }.window-dots span { width: 10px; height: 10px; border-radius: 50%; background: #475569; }.window-dots span:first-child{background:#fb7185}.window-dots span:nth-child(2){background:#fbbf24}.window-dots span:nth-child(3){background:#34d399}
.code-window-body { padding: 23px 18px; font-size: 13px; line-height: 1.95; color: #dbeafe; }
.code-window-body .line { display: grid; grid-template-columns: 27px 1fr; }.code-window-body b { color: #475569; font-weight: 500; }.code-window-body strong{color:#c084fc}.code-window-body i{color:#67e8f9;font-style:normal}.code-window-body em{color:#64748b}.code-window-body mark{background:none;color:#86efac}
.terminal-bar { display:flex; gap:10px; align-items:center; padding:13px 18px; color:#94a3b8; background:#080c19; border-top:1px solid #202944; font:11px 'JetBrains Mono',monospace; }.terminal-bar span{color:#67e8f9}.terminal-bar strong{margin-left:auto;color:#86efac;font-weight:500}
.floating-pill { position: absolute; z-index: 3; display: flex; align-items: center; gap: 8px; padding: 11px 15px; border-radius: 999px; background: rgba(255,255,255,.88); border: 1px solid rgba(199,210,254,.9); color: var(--heading); font-size: 11px; font-weight: 800; box-shadow: var(--shadow); backdrop-filter: blur(12px); }.floating-pill i{color:var(--primary-2)}.pill-top{top:34px;right:2px;animation:floatPill 5s ease-in-out infinite}.pill-bottom{left:-18px;bottom:40px;animation:floatPill 5s ease-in-out infinite reverse}.visual-orbit{position:absolute;border:1px solid rgba(124,58,237,.12);border-radius:50%}.orbit-one{width:430px;height:430px}.orbit-two{width:540px;height:540px}
@keyframes floatCode{0%,100%{transform:rotate(1.3deg) translateY(0)}50%{transform:rotate(-.6deg) translateY(-9px)}} @keyframes floatPill{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}

.stats-section { border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); background: var(--surface); }.stats-container{width:min(calc(100% - 40px),var(--max-width));margin:auto;display:grid;grid-template-columns:repeat(4,1fr)}.stat-item{padding:23px 15px;display:grid;grid-template-columns:auto 1fr;column-gap:12px;align-items:center;border-right:1px solid var(--border)}.stat-item:last-child{border-right:0}.stat-item i{grid-row:span 2;color:var(--primary-2);font-size:22px}.stat-item strong{color:var(--heading);font-size:21px}.stat-item span{color:var(--muted);font-size:10px;font-weight:700}

.section-block { padding: 100px 0; }.section-container{width:min(calc(100% - 40px),var(--max-width));margin:auto}.section-heading{max-width:690px;margin-bottom:38px}.section-heading.centered{text-align:center;margin-left:auto;margin-right:auto}.section-heading h2{margin:10px 0 14px;color:var(--heading);font-size:clamp(35px,4.3vw,52px);line-height:1.08;letter-spacing:-2px}.section-heading p{color:var(--muted);font-size:15px;line-height:1.8}
.learning-system{background:var(--surface-2)}.learning-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.learning-card{position:relative;min-height:235px;padding:25px;border:1px solid var(--border);border-radius:20px;background:var(--surface);box-shadow:var(--shadow-sm);overflow:hidden;transition:transform var(--transition),box-shadow var(--transition),border-color var(--transition)}.learning-card::after{content:'';position:absolute;width:100px;height:100px;right:-45px;bottom:-50px;border-radius:50%;background:rgba(124,58,237,.07)}.learning-card:hover{transform:translateY(-7px);box-shadow:var(--shadow);border-color:rgba(124,58,237,.25)}.learning-number{position:absolute;right:20px;top:18px;color:#c4b5fd;font:700 12px 'JetBrains Mono',monospace}.learning-icon,.project-icon{width:45px;height:45px;display:grid;place-items:center;border-radius:13px;margin-bottom:20px;font-size:17px}.purple{background:#f3e8ff;color:#7e22ce}.cyan{background:#cffafe;color:#0891b2}.pink{background:#fce7f3;color:#db2777}.blue{background:#dbeafe;color:#2563eb}.learning-card h3{color:var(--heading);font-size:18px;margin-bottom:8px}.learning-card p{color:var(--muted);font-size:12px;line-height:1.7}

.roadmap-section{background:linear-gradient(180deg,#fff 0%,#fafaff 100%)}body.dark-mode .roadmap-section{background:var(--bg)}.roadmap-heading{max-width:760px}.course-progress{display:grid;grid-template-columns:auto 1fr;gap:4px 20px;align-items:center;padding:18px 20px;margin-bottom:25px;background:var(--surface);border:1px solid var(--border);border-radius:16px;box-shadow:var(--shadow-sm)}.course-progress>div:first-child{display:flex;align-items:baseline;gap:8px}.course-progress strong{font-size:19px;color:var(--primary-2)}.course-progress span{font-size:11px;color:var(--muted)}.progress-track{grid-column:1/-1;height:7px;border-radius:99px;background:#e2e8f0;overflow:hidden}.progress-bar{width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--primary-2),var(--cyan));transition:width .4s ease}.roadmap-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:start}.roadmap-column{display:grid;gap:20px}.roadmap-level{background:var(--surface);border:1px solid var(--border);border-radius:22px;overflow:hidden;box-shadow:var(--shadow-sm)}.level-header{display:flex;gap:15px;padding:22px;background:linear-gradient(135deg,rgba(124,58,237,.06),rgba(6,182,212,.04));border-bottom:1px solid var(--border)}.level-number{width:40px;height:40px;display:grid;place-items:center;flex-shrink:0;border-radius:12px;color:#fff;background:linear-gradient(135deg,var(--primary-2),var(--cyan));font:800 12px 'JetBrains Mono',monospace}.level-header span:not(.level-number){color:var(--primary-2);font-size:9px;font-weight:800;letter-spacing:1px}.level-header h3{margin:3px 0 4px;color:var(--heading);font-size:18px}.level-header p{color:var(--muted);font-size:11px}.lesson-list{padding:7px 10px 10px}.lesson{display:grid;grid-template-columns:30px 1fr auto;gap:10px;align-items:center;padding:12px 10px;border-radius:12px;transition:background var(--transition),transform var(--transition)}.lesson:hover{background:var(--soft);transform:translateX(3px)}.lesson>span{color:#a78bfa;font:700 10px 'JetBrains Mono',monospace}.lesson h4{color:var(--heading);font-size:12px;margin-bottom:1px}.lesson p{color:var(--muted);font-size:10px;line-height:1.45}.lesson-status{min-width:54px;padding:6px 8px;border-radius:999px;color:var(--primary-2);background:#f3e8ff;font-size:9px;font-weight:800}.lesson.completed{background:rgba(16,185,129,.06)}.lesson-status.completed{color:#047857;background:#d1fae5}

.why-section{background:var(--surface-2)}.why-grid{display:grid;grid-template-columns:1.02fr .98fr;gap:70px;align-items:center}.why-copy h2,.practice-copy h2{margin:10px 0 14px;color:var(--heading);font-size:clamp(35px,4.5vw,53px);line-height:1.08;letter-spacing:-2px}.why-copy>p,.practice-copy>p{color:var(--muted);font-size:15px;line-height:1.8;max-width:600px}.benefit-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px 20px;margin-top:34px}.benefit-grid div{display:grid;grid-template-columns:36px 1fr;column-gap:10px}.benefit-grid i{grid-row:span 2;width:36px;height:36px;display:grid;place-items:center;border-radius:50%;color:var(--primary-2);background:#ede9fe}.benefit-grid h3{color:var(--heading);font-size:13px}.benefit-grid p{color:var(--muted);font-size:10px;line-height:1.5}.try-card{overflow:hidden;border-radius:20px;background:#0d1224;box-shadow:var(--shadow-lg);border:1px solid #2c3554}.try-header{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;color:#cbd5e1;background:#131a31;font-size:11px}.try-header i{margin-right:6px;color:#67e8f9}.run-badge{padding:5px 9px;border-radius:6px;background:#2563eb;color:#fff;font-size:9px}.try-card pre{padding:24px 22px;color:#dbeafe;font-size:12px;line-height:1.9;overflow:auto}.syntax-purple{color:#c084fc}.syntax-cyan{color:#67e8f9}.syntax-green{color:#86efac}.try-output{display:flex;flex-direction:column;gap:3px;padding:15px 20px;color:#86efac;background:#071b1a;border-top:1px solid #134e4a;font:11px 'JetBrains Mono',monospace}.try-output span{color:#5eead4;font-size:9px}

.practice-preview{background:linear-gradient(135deg,#f8f7ff,#effcff)}body.dark-mode .practice-preview{background:var(--bg-secondary)}.practice-preview-grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:75px;align-items:center}.practice-code-card{border-radius:20px;overflow:hidden;background:#0d1224;box-shadow:var(--shadow-lg);transform:rotate(-1deg)}.mini-top{display:flex;align-items:center;gap:6px;padding:13px 16px;background:#151b31;color:#94a3b8;font-size:10px}.mini-top span{width:8px;height:8px;border-radius:50%;background:#64748b}.mini-top span:first-child{background:#fb7185}.mini-top span:nth-child(2){background:#fbbf24}.mini-top span:nth-child(3){background:#34d399}.mini-top b{margin-left:auto;font-weight:500}.practice-code-card pre{padding:30px 24px;color:#dbeafe;font-size:13px;line-height:1.9}.practice-code-card mark{background:none;color:#86efac}.practice-code-card span{color:#64748b}.mini-run{padding:14px 18px;color:#67e8f9;border-top:1px solid #26304d;font-size:10px;font-weight:700}.practice-points{display:grid;gap:11px;margin:24px 0}.practice-points span{color:var(--muted);font-size:12px;font-weight:700}.practice-points i{color:#10b981;margin-right:8px}

.projects-section{background:var(--surface)}.projects-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.project-card{padding:24px;border:1px solid var(--border);border-radius:20px;background:var(--surface);box-shadow:var(--shadow-sm);transition:transform var(--transition),box-shadow var(--transition)}.project-card:hover{transform:translateY(-7px);box-shadow:var(--shadow)}.project-card>span{color:var(--primary-2);font-size:9px;font-weight:800;letter-spacing:1px}.project-card h3{margin:8px 0;color:var(--heading);font-size:18px}.project-card p{min-height:74px;color:var(--muted);font-size:11px;line-height:1.7}.project-card a{display:inline-flex;gap:8px;align-items:center;color:var(--primary-2);font-size:10px;font-weight:800}.project-card a i{transition:transform var(--transition)}.project-card a:hover i{transform:translateX(4px)}

.reviews-section{background:var(--surface-2)}.review-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.review-card{padding:24px;border:1px solid var(--border);border-radius:20px;background:var(--surface);box-shadow:var(--shadow-sm)}.stars{color:#f59e0b;letter-spacing:2px;font-size:13px;margin-bottom:14px}.review-card p{color:var(--text);font-size:12px;line-height:1.8;min-height:90px}.review-card strong{display:block;color:var(--heading);font-size:11px;margin-top:14px}.review-card>span{color:var(--muted);font-size:9px}

.cta-section{padding:0 0 85px;background:var(--surface-2)}.cta-container{width:min(calc(100% - 40px),var(--max-width));margin:auto;padding:27px 32px;display:grid;grid-template-columns:auto 1fr auto;gap:20px;align-items:center;border-radius:22px;color:#fff;background:linear-gradient(110deg,#6d28d9,#4f46e5 52%,#0891b2);box-shadow:0 25px 60px rgba(79,70,229,.25)}.cta-icon{width:58px;height:58px;display:grid;place-items:center;border-radius:16px;background:rgba(255,255,255,.16);font-size:29px}.cta-container>div:nth-child(2)>span{font-size:9px;font-weight:800;letter-spacing:1px;color:#ddd6fe}.cta-container h2{font-size:25px;letter-spacing:-.8px;margin:2px 0}.cta-container p{font-size:11px;color:#e0e7ff}.cta-button{padding:13px 18px;color:#312e81;background:#fff}.cta-button:hover{transform:translateY(-2px)}

.footer{padding:65px 0 0;background:#0d1224;color:#94a3b8}.footer-container{width:min(calc(100% - 40px),var(--max-width));margin:auto;display:grid;grid-template-columns:1.8fr repeat(3,1fr);gap:45px;padding-bottom:45px}.footer .brand-copy strong{color:#fff}.footer-brand p{max-width:320px;margin-top:17px;font-size:11px;line-height:1.8}.footer-column{display:grid;align-content:start;gap:9px}.footer-column h4{color:#fff;font-size:11px;margin-bottom:6px}.footer-column a{font-size:10px;transition:color var(--transition),transform var(--transition)}.footer-column a:hover{color:#fff;transform:translateX(3px)}.footer-bottom{width:min(calc(100% - 40px),var(--max-width));margin:auto;padding:18px 0;border-top:1px solid #252d47;display:flex;justify-content:space-between;font-size:9px}.footer-bottom i{color:#ec4899}

.search-overlay{position:fixed;inset:0;z-index:1500;display:none;align-items:flex-start;justify-content:center;padding:12vh 20px;background:rgba(15,23,42,.55);backdrop-filter:blur(10px)}.search-overlay.open{display:flex}.search-container{width:min(700px,100%);position:relative;padding:10px}.search-close{position:absolute;right:15px;top:-34px;width:34px;height:34px;border-radius:50%;color:#fff;background:rgba(255,255,255,.15)}.search-box{display:flex;align-items:center;gap:12px;padding:16px 18px;background:var(--surface);border:1px solid var(--border);border-radius:16px;box-shadow:var(--shadow-lg)}.search-box>i{color:var(--primary-2)}.search-box input{width:100%;border:0;outline:0;color:var(--heading);background:transparent;font-size:14px}.search-box kbd{font-size:9px;color:var(--muted);border:1px solid var(--border);padding:4px 7px;border-radius:5px}.search-results{margin-top:10px;max-height:55vh;overflow:auto;background:var(--surface);border:1px solid var(--border);border-radius:16px;box-shadow:var(--shadow)}.search-result{padding:15px 17px;border-bottom:1px solid var(--border);cursor:pointer}.search-result:last-child{border:0}.search-result:hover{background:var(--soft)}.search-result strong{display:block;color:var(--heading);font-size:12px}.search-result span{display:block;margin-top:3px;color:var(--muted);font-size:10px}

.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s ease}.reveal.visible{opacity:1;transform:none}.reveal-delay{transition-delay:.08s}.reveal-delay-2{transition-delay:.16s}.reveal-delay-3{transition-delay:.24s}

@media(max-width:1000px){.main-navigation{display:none}.search-trigger{min-width:auto}.search-trigger span,.search-trigger kbd{display:none}.mobile-menu-button{display:grid}.hero-container{grid-template-columns:1fr;gap:35px}.hero-content{text-align:center}.hero-description{margin:auto}.hero-buttons,.hero-features{justify-content:center}.hero-visual{min-height:390px}.learning-grid,.projects-grid{grid-template-columns:1fr 1fr}.roadmap-grid{grid-template-columns:1fr}.why-grid,.practice-preview-grid{grid-template-columns:1fr;gap:45px}.footer-container{grid-template-columns:1.5fr 1fr 1fr 1fr}}
@media(max-width:700px){.topbar-inner{min-height:68px}.brand-icon{width:38px;height:38px}.brand-copy strong{font-size:18px}.hero-container,.section-container,.stats-container,.topbar-inner,.cta-container,.footer-container,.footer-bottom{width:min(calc(100% - 28px),var(--max-width))}.hero-container{padding:65px 0 75px}.hero-content h1{font-size:48px;letter-spacing:-2.6px}.hero-description{font-size:14px}.hero-features{gap:10px 14px}.hero-visual{min-height:320px}.code-window{font-size:11px}.code-window-body{font-size:10px}.pill-top{right:-3px;top:8px}.pill-bottom{left:-4px;bottom:12px}.floating-pill{font-size:9px;padding:8px 11px}.stats-container{grid-template-columns:1fr 1fr}.stat-item{border-bottom:1px solid var(--border)}.stat-item:nth-child(2){border-right:0}.section-block{padding:72px 0}.section-heading h2,.why-copy h2,.practice-copy h2{font-size:37px}.learning-grid,.projects-grid,.review-grid{grid-template-columns:1fr}.roadmap-level{border-radius:17px}.lesson{grid-template-columns:26px 1fr auto}.lesson p{display:none}.lesson-status{min-width:48px}.benefit-grid{gap:20px}.cta-container{grid-template-columns:auto 1fr;padding:23px}.cta-button{grid-column:1/-1;width:100%}.footer-container{grid-template-columns:1fr 1fr;gap:30px}.footer-brand{grid-column:1/-1}.footer-bottom{display:grid;gap:8px}.mobile-navigation{padding:10px 14px;border-top:1px solid var(--border);background:var(--surface)}.mobile-navigation.open{display:grid}.mobile-navigation a{padding:12px;border-radius:10px;color:var(--muted);font-size:12px;font-weight:700}.mobile-navigation a:hover{background:var(--soft);color:var(--primary-2)}.mobile-navigation i{width:24px}.search-overlay{padding-top:10vh}}