:root{
    --paper:#FAFAF7; --surface:#FFFFFF; --sunken:#F4F2EC;
    --rule:#E5E2D8; --rule-strong:#C9C4B3;
    --ink:#1A1A1A; --ink-2:#4A4845; --ink-3:#7A7770; --charcoal:#2B2B2B;
    --green:#4A7A3F; --green-soft:#EAF1E6; --gold:#B8842E; --gold-soft:#F5ECDA;
    --san:'Inter',-apple-system,Segoe UI,Helvetica,Arial,sans-serif;
    --mono:'JetBrains Mono',ui-monospace,Menlo,monospace;
    --rail:184px; --gap:56px; --maxw:1200px;
  }
  *{box-sizing:border-box}
  html{scroll-behavior:smooth;color-scheme:light}
  body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--san);
       font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
  a{color:inherit}
  .wrap{max-width:var(--maxw);margin:0 auto;padding:0 32px}

  .sx{font-family:var(--mono);font-weight:600;font-size:11px;letter-spacing:.12em;color:var(--ink)}
  .rl{font-family:var(--mono);font-weight:500;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3)}

  .btn{display:inline-flex;align-items:center;gap:9px;font-family:var(--san);font-size:14px;
       padding:12px 20px;border-radius:2px;background:none;cursor:pointer;text-decoration:none;
       transition:background .15s,color .15s,border-color .15s,transform .15s}
  .btn .ar{transition:transform .15s}
  .btn:hover .ar{transform:translateX(3px)}
  .btn-primary{border:1.5px solid var(--ink);color:var(--ink);font-weight:700}
  .btn-primary:hover{background:var(--ink);color:var(--paper);transform:translateY(-1px)}
  .btn-ghost{border:1px solid var(--rule-strong);color:var(--ink-2);font-weight:500}
  .btn-ghost:hover{border-color:var(--ink);color:var(--ink);transform:translateY(-1px)}
  .cta-row{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:30px}

  header{position:sticky;top:0;z-index:50;background:color-mix(in srgb,var(--paper) 90%,transparent);
         backdrop-filter:saturate(1.05) blur(8px);border-bottom:1px solid var(--rule)}
  .bar{display:flex;align-items:center;justify-content:space-between;height:66px}
  .wm{font-family:var(--san);font-weight:700;letter-spacing:-.01em;color:var(--ink);white-space:nowrap;font-size:15px}
  .wm .sl{color:var(--ink-3);font-weight:400;margin:0 7px}
  .wm .tag{font-weight:400;color:var(--ink-2)}
  .nav{display:flex;align-items:center;gap:26px;font-size:14px}
  .nav a.lnk{color:var(--ink-2);text-decoration:none}
  .nav a.lnk:hover{color:var(--ink)}
  .nav .tel{font-family:var(--mono);font-size:13px;color:var(--ink-2);text-decoration:none}
  .nav-toggle{display:none;flex-direction:column;justify-content:center;gap:4px;background:none;
              border:1px solid var(--rule-strong);border-radius:2px;padding:9px 11px;cursor:pointer}
  .nav-toggle span{display:block;width:16px;height:1.5px;background:var(--ink)}

  .sec{border-top:1px solid var(--rule)}
  .sec .wrap{display:grid;grid-template-columns:var(--rail) 1fr;gap:var(--gap);padding-top:84px;padding-bottom:84px}
  .rail{display:flex;flex-direction:column;gap:8px}
  .rail .rule-tick{width:24px;height:2px;background:var(--green);margin-bottom:8px}
  .col{min-width:0}

  h1{font-family:var(--san);font-weight:600;font-size:clamp(42px,7vw,84px);line-height:.98;
     letter-spacing:-.035em;margin:0;max-width:15ch}
  h1 .l2{color:var(--ink-3);font-weight:500}
  h2{font-family:var(--san);font-weight:600;font-size:clamp(28px,3.6vw,40px);line-height:1.08;
     letter-spacing:-.025em;margin:0;max-width:18ch}
  h2 .l2{color:var(--ink-3);font-weight:500}
  .lede{font-size:19px;line-height:1.5;color:var(--ink-2);max-width:46ch;margin:22px 0 0}
  p.body{font-size:16px;line-height:1.62;color:var(--ink-2);max-width:54ch;margin:0}

  /* hero — content + live console panel */
  .hero{border-bottom:1px solid var(--rule)}
  .hero .wrap{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;padding-top:80px;padding-bottom:80px}
  .herohead .eyebrow{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-weight:600;
       font-size:10px;letter-spacing:.15em;text-transform:uppercase;color:var(--ink-2);
       border:1px solid var(--rule-strong);border-radius:2px;padding:6px 10px}
  .herohead h1{margin-top:20px}
  .spec{display:flex;flex-wrap:wrap;gap:9px 13px;margin-top:30px;font-family:var(--mono);
        font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2)}
  .spec .d{color:var(--rule-strong)}

  .dot{width:8px;height:8px;border-radius:50%;background:var(--green)}
  @media (prefers-reduced-motion: no-preference){
    .dot{box-shadow:0 0 0 0 rgba(74,122,63,.5);animation:pulse 2.4s ease-out infinite}
    @keyframes pulse{0%{box-shadow:0 0 0 0 rgba(74,122,63,.5)}70%{box-shadow:0 0 0 8px transparent}100%{box-shadow:0 0 0 0 transparent}}
  }

  /* ── Console interface mockup ───────────────────────────── */
  .app{border:1px solid var(--rule-strong);border-radius:8px;overflow:hidden;background:var(--surface);
       box-shadow:0 40px 80px -40px rgba(26,26,26,.28),0 8px 24px -12px rgba(26,26,26,.12)}
  .app-bar{display:flex;align-items:center;gap:7px;padding:11px 14px;background:var(--sunken);border-bottom:1px solid var(--rule)}
  .app-bar .tl{width:9px;height:9px;border-radius:50%;background:var(--rule-strong)}
  .app-bar .addr{margin-left:10px;font-family:var(--mono);font-size:11px;color:var(--ink-3)}
  .app-body{display:grid;grid-template-columns:172px 1fr}
  .app-side{background:var(--sunken);border-right:1px solid var(--rule);padding:16px 12px;min-width:0}
  .app-side .biz{font-weight:700;font-size:13px;letter-spacing:-.01em}
  .app-side .biz small{display:block;font-family:var(--mono);font-weight:500;font-size:9px;letter-spacing:.12em;
       text-transform:uppercase;color:var(--ink-3);margin-top:3px}
  .app-nav{margin-top:16px;display:flex;flex-direction:column;gap:1px}
  .app-nav a{font-size:12.5px;color:var(--ink-2);text-decoration:none;padding:7px 9px;border-radius:3px}
  .app-nav a.on{background:var(--ink);color:var(--paper);font-weight:500}
  .app-main{padding:18px 20px;min-width:0}
  .app-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
  .app-top .ttl{font-weight:600;font-size:15px}
  .pill{display:inline-flex;align-items:center;gap:7px;font-family:var(--mono);font-size:10px;letter-spacing:.1em;
        text-transform:uppercase;color:var(--green);border:1px solid var(--green);border-radius:2px;padding:4px 8px}
  .strip{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--rule);border-radius:4px;overflow:hidden}
  .strip .c{padding:12px 14px;border-left:1px solid var(--rule)}
  .strip .c:first-child{border-left:0}
  .strip .n{font-family:var(--mono);font-weight:700;font-size:18px;letter-spacing:-.01em;color:var(--ink)}
  .strip .n.good{color:var(--green)}
  .strip .k{font-family:var(--mono);font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);margin-top:5px}
  .log{margin-top:16px;border:1px solid var(--rule);border-radius:4px;overflow:hidden}
  .log .lh,.log .lrw{display:grid;grid-template-columns:52px 1fr 92px 48px 84px 56px;gap:8px;align-items:center;
       padding:9px 12px;font-size:12px}
  .log .lh{background:var(--sunken);border-bottom:1px solid var(--rule);font-family:var(--mono);
       font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3)}
  .log .lrw{border-bottom:1px solid var(--rule)}
  .log .lrw:last-child{border-bottom:0}
  .log .t,.log .du,.log .co{font-family:var(--mono);color:var(--ink-2)}
  .log .num{font-family:var(--mono);color:var(--ink)}
  .log .rt{font-family:var(--mono);font-size:11px;color:var(--ink-2)}
  .tg{font-family:var(--mono);font-size:9px;letter-spacing:.06em;text-transform:uppercase;padding:3px 6px;border-radius:2px;font-weight:600;text-align:center}
  .tg.booked{color:var(--green);background:var(--green-soft)}
  .tg.routed{color:var(--gold);background:var(--gold-soft)}
  .tg.captured{color:var(--ink-2);background:var(--sunken)}
  .app-cap{font-family:var(--mono);font-size:10px;letter-spacing:.05em;color:var(--ink-3);margin-top:12px;text-align:center}

  /* deep console section · multi-panel */
  .panels{display:grid;grid-template-columns:1.1fr .9fr;gap:18px;margin-top:14px}
  .panel{border:1px solid var(--rule);border-radius:6px;background:var(--surface);padding:18px 18px}
  .panel .ph{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
  .panel .ph .pt{font-weight:600;font-size:14px}
  .panel .ph .pm{font-family:var(--mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3)}
  .score{display:flex;align-items:baseline;gap:8px}
  .score .v{font-family:var(--san);font-weight:700;font-size:44px;letter-spacing:-.03em}
  .score .o{font-family:var(--mono);font-size:12px;color:var(--ink-3)}
  .dims{margin-top:14px;display:flex;flex-direction:column;gap:10px}
  .dim{display:grid;grid-template-columns:96px 1fr 30px;gap:10px;align-items:center;font-size:12px}
  .dim .dl{font-family:var(--mono);font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2)}
  .dim .bar{height:5px;background:var(--sunken);border-radius:3px;overflow:hidden}
  .dim .bar i{display:block;height:100%;background:var(--green);border-radius:3px}
  .dim .dv{font-family:var(--mono);font-size:11px;color:var(--ink);text-align:right}
  .pipe{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--rule);border:1px solid var(--rule);border-radius:4px;overflow:hidden;margin-bottom:16px}
  .pipe .pc{background:var(--surface);padding:12px 10px}
  .pipe .pn{font-family:var(--mono);font-weight:700;font-size:20px}
  .pipe .pn.win{color:var(--green)}
  .pipe .pk{font-family:var(--mono);font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);margin-top:4px}
  .ledg{font-family:var(--mono);border-top:1px solid var(--rule)}
  .ledg .lg{display:flex;justify-content:space-between;align-items:baseline;padding:9px 0;border-bottom:1px solid var(--rule);font-size:12px}
  .ledg .lk{color:var(--ink-2)}
  .ledg .lv{color:var(--ink)}
  .ledg .lv.pos{color:var(--green)}
  .ledg .lv.neg{color:var(--ink-2)}
  .route{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px}
  .route .r{font-family:var(--mono);font-size:11px;border:1px solid var(--rule);border-radius:2px;padding:6px 9px;color:var(--ink-2)}
  .route .r b{color:var(--ink);font-weight:600}
  .route .r.hot{border-color:var(--gold);color:var(--gold)}
  .route .r.hot b{color:var(--gold)}

  /* monumental figures */
  .figures{display:grid;grid-template-columns:1fr 1fr;border-top:2px solid var(--ink);margin-top:6px}
  .fig{padding:34px 0 8px}
  .fig:last-child{padding-left:40px;border-left:1px solid var(--rule)}
  .fig .big{font-family:var(--san);font-weight:600;font-size:clamp(72px,13vw,168px);line-height:.84;letter-spacing:-.05em;color:var(--ink)}
  .fig .big em{font-style:normal;color:var(--green)}
  .fig .cap{font-family:var(--mono);font-size:12px;letter-spacing:.04em;color:var(--ink-2);margin-top:18px;line-height:1.5;max-width:30ch}
  .fig .cap b{color:var(--ink);font-weight:600}

  .index{margin-top:36px;border-top:1px solid var(--ink)}
  .ix{display:grid;grid-template-columns:54px 1fr;gap:24px;padding:22px 0;border-bottom:1px solid var(--rule);align-items:start}
  .ix .ixn{font-family:var(--mono);font-weight:600;font-size:13px;color:var(--ink-3);padding-top:3px}
  .ix .ixv{font-family:var(--mono);font-weight:500;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--green)}
  .ix h3{font-family:var(--san);font-weight:600;font-size:19px;letter-spacing:-.01em;margin:6px 0 6px}
  .ix p{font-size:14.5px;color:var(--ink-2);margin:0;line-height:1.55;max-width:60ch}

  .statement{font-family:var(--san);font-weight:600;font-size:clamp(40px,7vw,84px);line-height:.98;letter-spacing:-.035em;color:var(--ink);margin:36px 0 0}
  .statement em{font-style:normal;color:var(--green)}

  .ledger{margin-top:32px;border-top:2px solid var(--ink);font-family:var(--mono)}
  .lr{display:flex;justify-content:space-between;align-items:baseline;gap:24px;padding:16px 0;border-bottom:1px solid var(--rule)}
  .lr .k{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
  .lr .v{font-size:15px;color:var(--ink);text-align:right}
  .lr.total .k{color:var(--ink)}
  .lr.total .v{font-weight:700;font-size:20px;color:var(--green)}

  .demo-intro .tel{display:block;margin-top:18px;font-family:var(--mono);font-size:13px;color:var(--ink-2)}
  .demo-intro .tel a{color:var(--ink);text-decoration:none;border-bottom:1px solid var(--rule-strong)}

  .close{border-top:1px solid var(--rule)}
  .close .wrap{padding-top:96px;padding-bottom:96px;text-align:center;display:block}
  .close h2{margin:0 auto;max-width:20ch;font-size:clamp(30px,4.4vw,52px)}
  .close .cta-row{justify-content:center}

  footer{background:var(--charcoal);color:#E8E6E0}
  footer .wrap{padding-top:60px;padding-bottom:44px}
  footer .wm{color:#F4F2EC;font-size:18px}
  footer .wm .sl{color:#8C8980}
  footer .wm .tag{color:#B9B6AE}
  .foot-tag{color:#B9B6AE;margin:14px 0 0;max-width:42ch;font-size:14px}
  .foot-cols{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:32px;margin-top:42px;border-top:1px solid rgba(255,255,255,.12);padding-top:32px}
  .foot-cols h4{font-family:var(--mono);font-weight:600;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:#8C8980;margin:0 0 14px}
  .foot-cols ul{margin:0;padding:0;list-style:none}
  .foot-cols a,.foot-cols li{color:#CBC8C0;text-decoration:none;font-size:14px;line-height:2}
  .foot-cols a:hover{color:#F4F2EC}
  .foot-cols .mono{font-family:var(--mono);font-size:13px}
  .copy{margin-top:34px;font-family:var(--mono);font-size:11px;letter-spacing:.04em;color:#8C8980}

  :focus-visible{outline:2px solid var(--green);outline-offset:2px;border-radius:2px}

  @media (prefers-reduced-motion: no-preference){
    [data-reveal]{opacity:0;transform:translateY(16px);transition:opacity .6s ease,transform .6s ease}
    [data-reveal].in{opacity:1;transform:none}
  }

  @media (max-width:900px){ :root{--gap:32px;--rail:140px} h1{font-size:clamp(40px,9vw,64px)} }
  @media (max-width:820px){
    .hero .wrap{grid-template-columns:1fr;gap:40px}
    .panels{grid-template-columns:1fr}
  }
  @media (max-width:760px){
    .sec .wrap{grid-template-columns:1fr;gap:18px;padding-top:56px;padding-bottom:56px}
    .rail{flex-direction:row;align-items:center;gap:12px}
    .rail .rule-tick{display:none}
    .figures{grid-template-columns:1fr}
    .fig:last-child{padding-left:0;border-left:0;border-top:1px solid var(--rule);margin-top:8px}
    .nav .lnk,.nav .tel{display:none}
    .nav.open{position:absolute;top:66px;left:0;right:0;flex-direction:column;align-items:flex-start;gap:0;
              background:var(--paper);border-bottom:1px solid var(--rule);padding:8px 32px 16px}
    .nav.open .lnk,.nav.open .tel{display:block;padding:12px 0;border-bottom:1px solid var(--rule);width:100%}
    .nav.open .btn{margin-top:12px}
    .nav-toggle{display:inline-flex}
    .log .lh,.log .lrw{grid-template-columns:46px 1fr 64px 56px;}
    .log .rt,.log .du{display:none}
  }
  @media (max-width:520px){ .wrap{padding:0 20px} .strip{grid-template-columns:1fr 1fr} .strip .c:nth-child(3){border-left:0} }

/* ── multi-page additions ───────────────────────────── */
.nav a.lnk.on{color:var(--ink)}
.wm{cursor:pointer;text-decoration:none}
.pagehero{border-bottom:1px solid var(--rule)}
.pagehero .wrap{padding-top:84px;padding-bottom:60px;display:block}
.pagehero .eyebrow{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-weight:600;
     font-size:10px;letter-spacing:.15em;text-transform:uppercase;color:var(--ink-2);
     border:1px solid var(--rule-strong);border-radius:2px;padding:6px 10px}
.pagehero h1{margin-top:20px;font-size:clamp(38px,6vw,72px);max-width:16ch}
.pagehero .lede{max-width:56ch}
.linkmore{display:inline-flex;align-items:center;gap:8px;margin-top:28px;font-family:var(--mono);
     font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink);text-decoration:none;
     border-bottom:1px solid var(--ink);padding-bottom:2px}
.linkmore:hover{color:var(--green);border-color:var(--green)}
.faq{margin-top:32px;border-top:1px solid var(--ink)}
.faq details{border-bottom:1px solid var(--rule)}
.faq summary{list-style:none;cursor:pointer;padding:18px 0;font-weight:600;font-size:17px;
     display:flex;justify-content:space-between;align-items:center;gap:16px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:'+';font-family:var(--mono);color:var(--ink-3);font-size:18px}
.faq details[open] summary::after{content:'\00d7'}
.faq .fa{padding:0 0 20px;color:var(--ink-2);font-size:15px;line-height:1.6;max-width:62ch}

/* embedded live console (animated walkthrough) */
.console-frame{width:100%;height:600px;border:1px solid var(--rule-strong);border-radius:8px;background:var(--surface);
  box-shadow:0 40px 80px -40px rgba(26,26,26,.28),0 8px 24px -12px rgba(26,26,26,.12);display:block;overflow:hidden}
.console-cap{font-family:var(--mono);font-size:10px;letter-spacing:.05em;color:var(--ink-3);margin-top:12px;text-align:center}
@media(max-width:760px){.console-frame{height:520px}}
