:root{--bg: #070916;--bg-elevated: #101320;--bg-card: #151823;--bg-card-soft: #1a1d2b;--text: #f4f6ff;--text-muted: #b9bfd6;--text-soft: #d7dbeb;--border: rgba(255, 255, 255, .09);--border-strong: rgba(255, 255, 255, .16);--primary: #7357ff;--primary-hover: #8b73ff;--primary-soft: rgba(115, 87, 255, .18);--accent: #8f7cff;--accent-cyan: #7ddcff;--shadow: 0 18px 60px rgba(0, 0, 0, .28);--radius: 18px;--page-width: 1720px}*{box-sizing:border-box}html{min-height:100%;color-scheme:dark;background:var(--bg)}body{min-height:100vh;margin:0;background:radial-gradient(circle at top right,rgba(115,87,255,.18),transparent 34rem),radial-gradient(circle at top left,rgba(45,95,255,.14),transparent 30rem),var(--bg);color:var(--text);font-family:Inter,Arial,Helvetica,sans-serif;line-height:1.5}a{color:inherit;text-decoration:none}img,video,iframe{display:block;max-width:100%}button,input,textarea,select{font:inherit}h1,h2,h3,h4,p,figure{margin-top:0}p{color:var(--text-muted)}router-outlet{display:none}.page-shell{width:min(var(--page-width),calc(100% - 96px));margin-inline:auto}.page-stack{display:grid;gap:14px;padding-block:18px 40px}.section-eyebrow{margin-bottom:6px;color:var(--primary-hover);font-size:.8rem;font-weight:900;letter-spacing:.13em;text-transform:uppercase}.section-title{margin-bottom:14px;color:var(--text);font-size:clamp(1.8rem,3vw,3rem);line-height:1;letter-spacing:-.05em}.section-copy{color:var(--text-muted);font-size:1rem;line-height:1.65}.card{background:linear-gradient(145deg,#161c36d1,#090d1cdb),var(--bg-card);color:var(--text);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow)}.section-card{padding:22px}.card h1,.card h2,.card h3,.card h4{color:var(--text)}.card p{color:var(--text-muted)}.button,.btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:160px;gap:10px;padding:14px 24px;border:1px solid var(--border);border-radius:10px;font-weight:900;line-height:1;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease,background .15s ease,border-color .15s ease}.button:hover,.btn:hover{transform:translateY(-1px);box-shadow:0 8px 18px #00000038}.button-primary,.btn-primary{color:#fff;background:var(--primary);border-color:var(--primary)}.button-primary:hover,.btn-primary:hover{background:var(--primary-hover);border-color:var(--primary-hover)}.button-secondary,.btn-secondary{color:#fff;background:#ffffff0a;border-color:var(--border-strong)}.button-secondary:hover,.btn-secondary:hover{background:#ffffff14}.badge-row,.button-row,.link-grid{display:flex;flex-wrap:wrap;gap:14px}.badge-row{align-items:center;margin-bottom:15px}.tech-badge,.badge{display:inline-flex;align-items:center;justify-content:center;min-height:42px;min-width:92px;gap:8px;padding:10px 14px;border:1px solid var(--border);border-radius:12px;background:#ffffff0a;color:var(--text);font-weight:800}.badge-muted{color:var(--text-muted);background:#ffffff09}.content-grid{display:grid;gap:14px}.content-grid-about,.content-grid-process{grid-template-columns:1fr 2fr}.media-grid{display:grid;grid-template-columns:1.2fr 1fr 1.2fr;gap:14px}.feature-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.screenshot-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.lesson-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.media-card{overflow:hidden;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius)}.video-frame,.video-shell{position:relative;overflow:hidden;border-radius:12px;background:#000}.video-frame iframe,.video-shell iframe{width:100%;aspect-ratio:16 / 9;border:0}.text-muted{color:var(--text-muted)}.text-soft{color:var(--text-soft)}.text-primary{color:var(--primary-hover)}.full-width{width:100%}.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;white-space:nowrap;clip:rect(0 0 0 0);clip-path:inset(50%)}@media(max-width:1100px){.hero,.content-grid-about,.content-grid-process,.media-grid{grid-template-columns:1fr}.feature-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:900px){.page-shell{width:min(100% - 32px,var(--page-width))}}@media(max-width:700px){.page-shell{width:min(100% - 24px,var(--page-width))}.page-stack{padding-block:14px 28px}.feature-grid,.screenshot-grid,.lesson-grid{grid-template-columns:1fr}.button,.btn{width:100%}}