:root{
      --bg:#1b1917;
      --bg-panel:#242220;
      --bg-panel-2:#2b2825;
      --line:#3a362f;
      --line-soft:#302c27;
      --ember:#ff5a1f;
      --ember-dim:#c6431a;
      --ember-glow:rgba(255,90,31,.16);
      --steel:#7c93a6;
      --steel-dim:#546b7c;
      --text:#f3eee4;
      --text-muted:#aba298;
      --text-faint:#726b60;
      --radius:2px;
      --nameplate-shadow:0 1px 0 rgba(255,255,255,.04) inset, 0 12px 30px rgba(0,0,0,.35);
    }
    *{box-sizing:border-box;}
    html{scroll-behavior:smooth;}
    body{
      margin:0;
      background:
        radial-gradient(1200px 600px at 15% -10%, rgba(255,90,31,.07), transparent 60%),
        radial-gradient(900px 500px at 100% 0%, rgba(124,147,166,.08), transparent 55%),
        var(--bg);
      color:var(--text);
      font-family:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
      -webkit-font-smoothing:antialiased;
      line-height:1.6;
    }
    h1,h2,h3,.display{
      font-family:'Oswald',sans-serif;
      text-transform:uppercase;
      letter-spacing:.02em;
      margin:0;
      font-weight:600;
    }
    .mono{font-family:'IBM Plex Mono',monospace;}
    a{color:inherit;text-decoration:none;}
    img{max-width:100%;display:block;}
    :focus-visible{outline:2px solid var(--ember);outline-offset:3px;}
    @media (prefers-reduced-motion: reduce){
      *{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important;scroll-behavior:auto !important;}
    }

    .wrap{max-width:1120px;margin:0 auto;padding:0 24px;}

    /* ---------- nameplate corners (signature rivet motif) ---------- */
    .plate{
      position:relative;
      background:var(--bg-panel);
      border:1px solid var(--line);
      border-radius:var(--radius);
      box-shadow:var(--nameplate-shadow);
    }
    .plate::before,.plate::after,
    .plate .rivet-tl,.plate .rivet-br{
      content:"";
      position:absolute;
      width:5px;height:5px;
      border-radius:50%;
      background:var(--line);
      box-shadow:inset 0 1px 1px rgba(0,0,0,.5), 0 1px 0 rgba(255,255,255,.03);
    }
    .plate::before{top:8px;left:8px;}
    .plate::after{top:8px;right:8px;}
    .plate .rivet-tl{bottom:8px;left:8px;}
    .plate .rivet-br{bottom:8px;right:8px;}

    /* ---------- header / control-panel nav ---------- */
    header.topbar{
      position:sticky;top:0;z-index:40;
      background:rgba(27,25,23,.88);
      backdrop-filter:blur(8px);
      border-bottom:1px solid var(--line);
    }
    .topbar-inner{
      display:flex;align-items:center;justify-content:space-between;
      height:74px;
    }
    .brand{display:flex;align-items:center;gap:12px;}
    .brand-mark{
      width:38px;height:38px;flex:none;
      border:1px solid var(--line);
      border-radius:50%;
      display:grid;place-items:center;
      background:conic-gradient(from 210deg, var(--steel-dim), var(--line) 40%, var(--ember-dim) 75%, var(--ember));
      position:relative;
    }
    .brand-mark::after{
      content:"";position:absolute;inset:5px;border-radius:50%;background:var(--bg-panel);
    }
    .brand-mark svg{position:relative;width:18px;height:18px;color:var(--ember);}
    .brand-text{display:flex;flex-direction:column;line-height:1.1;}
    .brand-text .b1{font-family:'Oswald',sans-serif;font-weight:700;letter-spacing:.06em;font-size:16px;}
    .brand-text .b2{font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:.14em;color:var(--text-faint);text-transform:uppercase;}

    nav.mainnav{display:flex;align-items:center;gap:2px;}
    nav.mainnav a{
      font-family:'IBM Plex Mono',monospace;
      font-size:12px;letter-spacing:.1em;text-transform:uppercase;
      color:var(--text-muted);
      padding:10px 14px;border-radius:2px;
      border:1px solid transparent;
      transition:color .15s ease, border-color .15s ease, background .15s ease;
    }
    nav.mainnav a:hover{color:var(--text);border-color:var(--line);}
    nav.mainnav a.active{color:var(--ember);border-color:var(--ember-dim);background:var(--ember-glow);}
    .call-btn{
      font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:.08em;
      color:var(--bg);background:var(--ember);
      padding:10px 16px;border-radius:2px;font-weight:600;
      border:1px solid var(--ember);
      transition:filter .15s ease, transform .15s ease;
      white-space:nowrap;
    }
    .call-btn:hover{filter:brightness(1.08);transform:translateY(-1px);}
    .navtoggle{display:none;background:none;border:1px solid var(--line);color:var(--text);width:38px;height:38px;border-radius:2px;align-items:center;justify-content:center;}

    @media (max-width:860px){
      nav.mainnav{
        position:fixed;inset:74px 0 auto 0;
        flex-direction:column;align-items:stretch;
        background:var(--bg-panel);border-bottom:1px solid var(--line);
        padding:8px;gap:4px;
        transform:translateY(-8px);opacity:0;pointer-events:none;
        transition:opacity .15s ease, transform .15s ease;
      }
      nav.mainnav.open{transform:translateY(0);opacity:1;pointer-events:auto;}
      nav.mainnav a{padding:14px;}
      .navtoggle{display:grid;}
      .call-btn.desktop-only{display:none;}
    }

    /* ---------- dimension-line section divider (structural, not decorative) ---------- */
    .dimline{
      display:flex;align-items:center;gap:14px;
      margin:0 0 40px;
      color:var(--text-faint);
    }
    .dimline .cap{width:1px;height:14px;background:var(--line);}
    .dimline .rule{flex:1;height:1px;background:var(--line);}
    .dimline .label{
      font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.18em;
      text-transform:uppercase;color:var(--text-faint);white-space:nowrap;
    }

    /* ---------- buttons ---------- */
    .btn{
      display:inline-flex;align-items:center;gap:8px;
      font-family:'IBM Plex Mono',monospace;font-size:13px;letter-spacing:.06em;
      padding:13px 22px;border-radius:2px;border:1px solid var(--line);
      transition:border-color .15s ease, color .15s ease, background .15s ease, transform .15s ease;
    }
    .btn-primary{background:var(--ember);border-color:var(--ember);color:#1b1917;font-weight:600;}
    .btn-primary:hover{filter:brightness(1.08);transform:translateY(-1px);}
    .btn-ghost{color:var(--text);}
    .btn-ghost:hover{border-color:var(--steel);color:var(--steel);}

    /* ---------- hero ---------- */
    .hero{padding:64px 0 56px;}
    .hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:center;}
    .eyebrow{
      font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:.2em;
      color:var(--ember);text-transform:uppercase;margin-bottom:16px;display:flex;align-items:center;gap:10px;
    }
    .eyebrow::before{content:"";width:22px;height:1px;background:var(--ember);}
    h1.headline{font-size:clamp(34px,5vw,58px);line-height:1.04;color:var(--text);}
    h1.headline em{font-style:normal;color:var(--ember);}
    .lede{margin:22px 0 30px;color:var(--text-muted);font-size:17px;max-width:52ch;}
    .hero-actions{display:flex;gap:12px;flex-wrap:wrap;}
    .stat-strip{
      display:grid;grid-template-columns:repeat(3,1fr);
      margin-top:52px;border-top:1px solid var(--line);
    }
    .stat{padding:22px 4px 0;border-left:1px solid var(--line);padding-left:20px;}
    .stat:first-child{border-left:none;padding-left:0;}
    .stat .num{font-family:'Oswald',sans-serif;font-size:32px;color:var(--text);font-weight:600;}
    .stat .num span{color:var(--ember);}
    .stat .cap{font-family:'IBM Plex Mono',monospace;font-size:11px;color:var(--text-faint);letter-spacing:.08em;text-transform:uppercase;margin-top:4px;}

    /* ---------- gauge (signature element) ---------- */
    .gauge-wrap{position:relative;padding:20px;}
    .gauge-readout{
      position:absolute;bottom:34px;left:50%;transform:translateX(-50%);
      text-align:center;font-family:'IBM Plex Mono',monospace;
    }
    .gauge-readout .v{font-size:26px;color:var(--ember);font-weight:600;}
    .gauge-readout .u{font-size:10px;letter-spacing:.16em;color:var(--text-faint);text-transform:uppercase;display:block;margin-top:2px;}
    .needle{transform-origin:100px 100px;transform:rotate(-90deg);transition:transform 1.4s cubic-bezier(.2,.8,.2,1);}
    .gauge-wrap.in-view .needle{transform:rotate(38deg);}
    .hub{fill:var(--bg-panel-2);stroke:var(--line);stroke-width:1;}

    @media (max-width:860px){
      .hero-grid{grid-template-columns:1fr;}
      .stat-strip{grid-template-columns:1fr;}
      .stat{border-left:none;border-top:1px solid var(--line);padding:18px 0 0;}
      .stat:first-child{border-top:none;}
    }

    /* ---------- section shells ---------- */
    section{padding:64px 0;}
    section.tight{padding:48px 0;}
    .section-head{max-width:60ch;margin-bottom:44px;}
    .section-head h2{font-size:clamp(26px,3.4vw,36px);color:var(--text);}
    .section-head p{color:var(--text-muted);margin-top:14px;font-size:15.5px;}

    /* ---------- cards ---------- */
    .grid{display:grid;gap:18px;}
    .grid-3{grid-template-columns:repeat(3,1fr);}
    .grid-2{grid-template-columns:repeat(2,1fr);}
    @media (max-width:860px){.grid-3,.grid-2{grid-template-columns:1fr;}}

    .card{padding:26px 24px 24px;position:relative;}
    .card .code{
      font-family:'IBM Plex Mono',monospace;font-size:11px;color:var(--text-faint);
      letter-spacing:.12em;margin-bottom:16px;display:block;
    }
    .card .icon{
      width:42px;height:42px;border:1px solid var(--line);border-radius:50%;
      display:grid;place-items:center;margin-bottom:18px;color:var(--ember);
      background:var(--bg-panel-2);
    }
    .card h3{font-size:18px;color:var(--text);margin-bottom:10px;}
    .card p{color:var(--text-muted);font-size:14.5px;margin:0;}
    .card:hover{border-color:var(--ember-dim);}

    /* ---------- process rail (real sequence -> ordered) ---------- */
    .rail{position:relative;padding-left:2px;}
    .rail-item{display:grid;grid-template-columns:64px 1fr;gap:20px;padding:22px 0;border-top:1px solid var(--line);}
    .rail-item:first-child{border-top:none;}
    .rail-num{font-family:'IBM Plex Mono',monospace;color:var(--ember);font-size:13px;padding-top:3px;}
    .rail-item h3{font-size:17px;color:var(--text);margin-bottom:6px;}
    .rail-item p{color:var(--text-muted);font-size:14.5px;margin:0;max-width:56ch;}

    /* ---------- CTA band ---------- */
    .cta-band{
      padding:46px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);
      background:linear-gradient(180deg, var(--bg-panel), var(--bg));
    }
    .cta-inner{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;}
    .cta-inner h2{font-size:24px;}
    .cta-inner p{color:var(--text-muted);margin-top:8px;font-size:14.5px;}

    /* ---------- footer ---------- */
    footer{border-top:1px solid var(--line);padding:48px 0 28px;}
    .foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:32px;}
    .foot-title{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.14em;color:var(--text-faint);text-transform:uppercase;margin-bottom:14px;}
    .foot-links a{display:block;color:var(--text-muted);font-size:14px;padding:5px 0;transition:color .15s ease;}
    .foot-links a:hover{color:var(--ember);}
    .foot-bottom{
      margin-top:36px;padding-top:20px;border-top:1px solid var(--line-soft);
      display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;
      font-family:'IBM Plex Mono',monospace;font-size:11.5px;color:var(--text-faint);
    }
    @media (max-width:860px){.foot-grid{grid-template-columns:1fr;gap:26px;}}

    .placeholder-note{
      font-family:'IBM Plex Mono',monospace;font-size:11.5px;color:var(--steel);
      background:rgba(124,147,166,.08);border:1px dashed var(--steel-dim);
      padding:10px 14px;border-radius:2px;margin-top:18px;
    }

    /* reveal on scroll */
    .reveal{opacity:0;transform:translateY(14px);transition:opacity .6s ease, transform .6s ease;}
    .reveal.in-view{opacity:1;transform:translateY(0);}