.home { --bg:#e6eae6; --bg2:#dbe2dd; --ink:#101512; --muted:#4c5750; --line:#9aa59d; --accent:#0644d4; }
.home header.top { border:0; }
.home header.top .wrap { height:92px; }
.home .logo-slash { color:var(--ink); font-weight:400; margin-left:8px; }
.home nav.main { margin-left:auto; gap:42px; }
.home nav.main .nav-start { margin-left:100px; border-left:1px solid var(--line); padding:20px 0 20px 60px; color:var(--accent); text-decoration:underline; text-underline-offset:5px; }
.home .hero { padding:30px 0 48px; }
.home .hero-layout { grid-template-columns:45% 55%; gap:0; align-items:center; }
.home h1,.home .editorial-intro h2 { font-family:Impact,'Arial Narrow',sans-serif; font-weight:400; letter-spacing:-.025em; }
.home h1 { font-size:clamp(70px,7.4vw,110px); line-height:.98; margin:0 0 36px; }
.home .hero-lead { font-size:21px; max-width:440px; color:var(--ink); line-height:1.42; }
.home .hero .cta { margin:34px 0 0; }
.home .btn { font:15px ui-monospace,Consolas,monospace; padding:17px 25px; }
.home .btn span { padding-left:12px; }
.home .hero-diagram { display:flex; align-items:stretch; min-width:0; }
.home .hero-diagram svg { width:100%; height:auto; color:var(--ink); overflow:visible; }
.home .hero-diagram text { fill:var(--ink); font:14px 'Arial Narrow',Arial,sans-serif; font-weight:600; }
.home .hero-diagram .diagram-title { font-size:16px; }
.home .hero-diagram .diagram-small { font-size:12px; font-weight:400; }
.home .hero-diagram .node { fill:var(--bg); stroke:var(--ink); stroke-width:1.3; }
.home .hero-diagram .zone { fill:none; stroke:var(--ink); stroke-width:.8; stroke-dasharray:2 3; }
.home .hero-diagram .customer-zone { fill:#dce4e5; stroke:var(--ink); stroke-width:.8; stroke-dasharray:2 3; }
.home .hero-diagram .line { fill:none; stroke:var(--ink); stroke-width:1.2; }
.home .hero-diagram .arrow { marker-end:url(#arrow); }
.home .hero-diagram .tunnel { stroke-dasharray:5 4; }
.home .diagram-index { border-left:1px solid var(--line); padding-left:12px; margin-left:14px; font:12px ui-monospace,monospace; }
.home .diagram-index span { display:block; writing-mode:vertical-rl; margin-top:24px; }
.home .editorial-intro { padding:48px 0 25px; border:0; }
.home .editorial-grid { border-top:1px solid var(--ink); padding-top:48px; display:grid; grid-template-columns:125px 1fr; }
.home .margin-label { border-right:1px solid var(--line); margin-right:35px; font:12px ui-monospace,monospace; }
.home .margin-label span { display:block; margin-top:30px; }
.home .editorial-intro h2 { font-size:clamp(54px,6vw,88px); line-height:1.02; max-width:none; margin:0 0 22px; }
.home .editorial-intro p { font:18px/1.75 ui-monospace,Consolas,monospace; max-width:850px; }
.home .workflow { padding:0 0 55px; }
.home .workflow-grid { display:grid; grid-template-columns:60% 40%; border-top:1px solid var(--ink); padding-top:25px; }
.home .terminal { border:1px solid var(--ink); margin-right:30px; }
.home .terminal-head { display:flex; justify-content:space-between; border-bottom:1px solid var(--line); padding:8px 15px; font:11px ui-monospace,monospace; letter-spacing:.08em; }
.home .terminal pre { background:transparent; padding:20px; margin:0; line-height:1.6; font-size:14px; }
.home .terminal .comment,.home .terminal-note { color:var(--muted); }
.home .terminal .command { color:var(--accent); font-weight:bold; }
.home .terminal-note { font:12px/1.5 ui-monospace,monospace; padding:0 20px; }
.home .workflow-steps { border-left:1px solid var(--line); padding-left:28px; }
.home .workflow-steps > div { display:grid; grid-template-columns:55px 1fr; border-bottom:1px solid var(--line); padding:0 0 18px; margin-bottom:18px; }
.home .workflow-steps > div > span { font:30px Impact,sans-serif; color:var(--accent); }
.home .workflow-steps section { border:0; padding:0; }
.home .workflow-steps h3 { margin:0 0 8px; }
.home .workflow-steps p { font:13px/1.5 ui-monospace,monospace; margin:0; }
.home .workflow-note { border:1px solid var(--line); padding:13px 20px; margin:30px 0 0; font:13px/1.5 ui-monospace,monospace; }
@media(max-width:900px) { .home nav.main .nav-start { margin-left:0; padding-left:20px; } .home .hero-layout { grid-template-columns:1fr; gap:35px; } .home .hero-diagram { max-width:700px; } .home .workflow-grid { grid-template-columns:1fr; gap:30px; } .home .terminal { margin:0; } }
@media(max-width:640px) { .home nav.main { gap:14px; } .home nav.main .nav-start { border:0; padding:0; } .home .hero { padding-top:45px; } .home h1 { font-size:clamp(65px,14vw,90px); } .home .hero-diagram { overflow:hidden; } .home .diagram-index { display:none; } .home .editorial-grid { grid-template-columns:55px 1fr; } .home .margin-label { font-size:9px; margin-right:15px; } .home .editorial-intro h2 { font-size:clamp(43px,10vw,65px); } .home .editorial-intro p { font-size:14px; } .home .workflow-steps { padding-left:15px; } }