/* ============================================================
     37 FORGE | APP STYLES
     ============================================================ */
  * { box-sizing: border-box; }
  html, body { margin: 0; padding: 0; min-height: 100%; background: #15191B; color: #EAF1EA; }
  body { overflow-x: hidden; }

  /* Tweakable variables */
  :root {
    --accent: #27E06A;
    --accent-bright: #33FF7A;
    --accent-deep: #06210F;
    --grid-opacity: 0.12;
    --scanline-opacity: 0.35;
    --section-padding: 96px;
  }

  /* Background grid + scanlines */
  .canvas {
    position: relative;
    background:
      linear-gradient(to right, rgba(39,224,106,var(--grid-opacity)) 1px, transparent 1px) 0 0 / 48px 48px,
      linear-gradient(to bottom, rgba(39,224,106,var(--grid-opacity)) 1px, transparent 1px) 0 0 / 48px 48px,
      #15191B;
  }
  .canvas-deep {
    background: #0A0D0A;
  }

  /* Subtle scanline overlay on hero */
  .scanlines::after {
    content: ""; position: absolute; inset: 0; pointer-events: none;
    background: repeating-linear-gradient(
      to bottom,
      transparent 0px,
      transparent 3px,
      rgba(39,224,106,calc(var(--scanline-opacity) * 0.04)) 3px,
      rgba(39,224,106,calc(var(--scanline-opacity) * 0.04)) 4px
    );
    z-index: 0;
  }
  .scanlines > * { position: relative; z-index: 1; }

  /* ============ Utility bar ============ */
  .util {
    background: #0A0D0A; height: 36px;
    display: flex; align-items: center; justify-content: space-between;
    padding: 0 32px;
    font: 500 11px/1 "JetBrains Mono", monospace;
    text-transform: uppercase; letter-spacing: 0.14em;
    color: #8A938C;
    border-bottom: 1px solid #262B27;
    overflow: hidden;
  }
  .util .grp { display: flex; align-items: center; gap: 22px; }
  .util .pulse-dot { width: 6px; height: 6px; background: #4ade80; border-radius: 50%; box-shadow: 0 0 8px #4ade80; display: inline-block; margin-right: 8px; animation: pulse 2.4s ease-in-out infinite; }
  .util .ticker { display: flex; gap: 32px; animation: ticker 40s linear infinite; white-space: nowrap; }
  .util .ticker span { color: #5a635c; }
  .util .ticker span b { color: var(--accent-bright); font-weight: 500; }
  @keyframes pulse { 0%,100% { opacity: 1; } 50% { opacity: 0.4; } }
  @keyframes ticker { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }

  /* ============ Top nav ============ */
  .nav {
    background: rgba(6,33,15,0.92); backdrop-filter: blur(8px);
    height: 72px;
    display: flex; align-items: center; padding: 0 32px; gap: 32px;
    border-bottom: 1px solid #262B27;
    position: sticky; top: 0; z-index: 100;
  }
  .nav .brand { display: flex; align-items: center; gap: 12px; cursor: pointer; }
  .nav .brand img { height: 38px; }
  .nav .links { display: flex; gap: 4px; flex: 1; margin-left: 24px; }
  .nav .links a {
    color: #EAF1EA; font: 600 13px/1 "Inter", sans-serif;
    text-decoration: none; border: 0; cursor: pointer;
    padding: 10px 14px;
    text-transform: uppercase; letter-spacing: 0.1em;
    position: relative;
    white-space: nowrap;
    transition: color 120ms;
  }
  .nav .links a:hover { color: var(--accent-bright); }
  .nav .links a.active { color: var(--accent-bright); }
  .nav .links a.active::before {
    content: ""; position: absolute; left: 8px; top: 50%; transform: translateY(-50%);
    width: 4px; height: 4px; background: var(--accent-bright);
    box-shadow: 0 0 6px var(--accent-bright);
  }
  .nav .links a.active { padding-left: 22px; }
  .nav .phone {
    display: flex; align-items: center; gap: 10px;
    color: #EAF1EA; font: 600 14px/1.2 "JetBrains Mono", monospace;
    padding-right: 16px; border-right: 1px solid #262B27;
    text-decoration: none;
    white-space: nowrap; flex-shrink: 0;
  }
  .nav .phone .lab { font-size: 10px; color: #5a635c; letter-spacing: 0.18em; display: block; margin-bottom: 4px; }
  
  .nav .links a.nav-download {
    color: var(--accent-bright);
    border: 1px solid rgba(39,224,106,0.35);
    padding: 8px 14px;
    margin-left: 4px;
    border-radius: 2px;
    transition: background 120ms, border-color 120ms;
  }
  .nav .links a.nav-download::before { display: none !important; }
  .nav .links a.nav-download { padding-left: 14px !important; }
  .nav .links a.nav-download:hover {
    background: rgba(39,224,106,0.08);
    border-color: var(--accent-bright);
    color: var(--accent-bright);
  }
  .nav .links a.nav-download.active {
    background: rgba(39,224,106,0.12);
    border-color: var(--accent-bright);
  }

  /* ============ Industries dropdown ============ */
  .has-dropdown { position: relative; display: flex; align-items: center; }
  .nav .links .dd-trigger {
    display: inline-flex; align-items: center; gap: 6px;
    cursor: pointer; user-select: none;
  }
  .dd-trigger .dd-caret {
    color: #5a635c; transition: transform 180ms ease, color 120ms;
  }
  .has-dropdown:hover .dd-trigger .dd-caret,
  .nav .links .dd-trigger.active .dd-caret { color: var(--accent-bright); }
  .has-dropdown.open .dd-trigger .dd-caret { transform: rotate(180deg); color: var(--accent-bright); }

  .dropdown {
    position: absolute; top: calc(100% + 6px); left: -8px;
    min-width: 320px;
    background: #15191B;
    border: 1px solid #262B27;
    padding: 8px;
    opacity: 0; pointer-events: none;
    transform: translateY(-6px);
    transition: opacity 180ms ease, transform 180ms ease;
    z-index: 200;
    box-shadow: 0 24px 60px -10px rgba(0,0,0,0.6), 0 0 0 1px rgba(39,224,106,0.08);
  }
  .dropdown::before, .dropdown::after {
    content: ""; position: absolute; width: 10px; height: 10px;
    border: 2px solid var(--accent-bright);
    pointer-events: none;
  }
  .dropdown::before { top: -1px; left: -1px; border-right: 0; border-bottom: 0; }
  .dropdown::after { bottom: -1px; right: -1px; border-left: 0; border-top: 0; }
  .has-dropdown.open .dropdown { opacity: 1; pointer-events: auto; transform: translateY(0); }

  .dropdown .dd-eyebrow {
    font: 500 9px/1 "JetBrains Mono", monospace;
    color: #5a635c; text-transform: uppercase; letter-spacing: 0.18em;
    padding: 12px 14px 10px;
    border-bottom: 1px solid #262B27;
    margin-bottom: 4px;
  }
  .nav .links .dropdown a.dd-item {
    display: flex; align-items: center; gap: 14px;
    padding: 12px 14px;
    color: #EAF1EA; font: 600 14px/1.2 "Inter", sans-serif;
    border-radius: 0;
    position: static;
    transition: background 120ms, color 120ms;
  }
  .nav .links .dropdown a.dd-item::before { display: none; }
  .nav .links .dropdown a.dd-item { padding-left: 14px; }
  .nav .links .dropdown a.dd-item:hover,
  .nav .links .dropdown a.dd-item.active {
    background: rgba(39,224,106,0.06);
    color: var(--accent-bright);
  }
  .dropdown .dd-num {
    font: 500 10px/1 "JetBrains Mono", monospace;
    color: #5a635c; letter-spacing: 0.12em;
    width: 24px; flex-shrink: 0;
  }
  .nav .links .dropdown a.dd-item:hover .dd-num,
  .nav .links .dropdown a.dd-item.active .dd-num { color: var(--accent-bright); }
  .dropdown .dd-label { flex: 1; }

  .dropdown .dd-sep {
    height: 1px; background: #262B27; margin: 4px 0;
  }
  .nav .links .dropdown a.dd-other {
    display: flex; flex-direction: column; gap: 4px;
    padding: 12px 14px 14px;
    color: #EAF1EA;
    border-radius: 0;
    position: static;
    transition: background 120ms, color 120ms;
  }
  .nav .links .dropdown a.dd-other::before { display: none; }
  .nav .links .dropdown a.dd-other { padding-left: 14px; }
  .nav .links .dropdown a.dd-other:hover,
  .nav .links .dropdown a.dd-other.active { background: rgba(39,224,106,0.06); }
  .dropdown .dd-other-l {
    font: 600 13px/1.2 "Inter", sans-serif;
    color: #EAF1EA;
  }
  .nav .links .dropdown a.dd-other:hover .dd-other-l,
  .nav .links .dropdown a.dd-other.active .dd-other-l { color: var(--accent-bright); }
  .dropdown .dd-other-s {
    font: 500 10px/1 "JetBrains Mono", monospace;
    color: var(--accent-bright); letter-spacing: 0.12em;
    text-transform: uppercase;
  }

  
  
  /* ============ Lead-gen page (resources/m365-audit) ============ */
  .leadgen-grid {
    display: grid;
    grid-template-columns: 1.1fr 1fr;
    gap: 56px;
    align-items: start;
  }
  .leadgen-info {
    padding-top: 8px;
  }
  .leadgen-list {
    list-style: none; padding: 0; margin: 0;
    display: flex; flex-direction: column; gap: 18px;
  }
  .leadgen-list li {
    font: 400 14px/1.6 "Inter", sans-serif;
    color: #8A938C;
    padding-left: 26px;
    position: relative;
  }
  .leadgen-list li strong {
    color: #EAF1EA; font-weight: 600;
  }
  .leadgen-list li::before {
    content: ""; position: absolute; left: 0; top: 9px;
    width: 14px; height: 1px; background: var(--accent-bright);
  }
  .leadgen-list li::after {
    content: ""; position: absolute; left: 12px; top: 7px;
    width: 4px; height: 4px; background: var(--accent-bright);
    transform: rotate(45deg);
  }

  .size-grid {
    display: grid; grid-template-columns: repeat(4, 1fr);
    gap: 6px;
  }
  .size-chip {
    padding: 12px 8px;
    background: transparent;
    border: 1px solid #333A35;
    color: #EAF1EA;
    font: 500 12px/1 "JetBrains Mono", monospace;
    letter-spacing: 0.08em;
    cursor: pointer;
    transition: background 120ms, border-color 120ms, color 120ms;
    border-radius: 2px;
  }
  .size-chip:hover {
    border-color: var(--accent-bright);
    background: rgba(39,224,106,0.04);
  }
  .size-chip.selected {
    background: var(--accent);
    border-color: var(--accent-bright);
    color: #06210F;
    font-weight: 700;
  }

  /* Thank-you state */
  .leadgen-thanks {
    text-align: center;
    padding: 16px 0;
  }
  .lg-check {
    width: 64px; height: 64px;
    margin: 0 auto 24px;
    border: 1px solid var(--accent);
    background: rgba(39,224,106,0.08);
    display: flex; align-items: center; justify-content: center;
    position: relative;
  }
  .lg-check::before, .lg-check::after {
    content: ""; position: absolute; width: 12px; height: 12px;
    border: 2px solid var(--accent-bright);
  }
  .lg-check::before { top: -1px; left: -1px; border-right: 0; border-bottom: 0; }
  .lg-check::after { bottom: -1px; right: -1px; border-left: 0; border-top: 0; }
  .lg-eyebrow {
    font: 500 11px/1 "JetBrains Mono", monospace;
    color: var(--accent-bright);
    letter-spacing: 0.18em; text-transform: uppercase;
    margin-bottom: 16px;
  }
  .lg-title {
    font: 700 28px/1.2 "Space Grotesk", sans-serif;
    color: #EAF1EA; margin: 0 0 16px;
    letter-spacing: -0.015em;
  }
  .lg-msg {
    font: 400 15px/1.6 "Inter", sans-serif;
    color: #8A938C; margin: 0;
  }

  /* Inline CTA banner on home */
  .leadgen-cta {
    background: #0A0D0A;
    border: 1px solid #262B27;
    padding: 48px 56px;
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 40px;
    align-items: center;
    position: relative;
  }
  .leadgen-cta::before, .leadgen-cta::after {
    content: ""; position: absolute; width: 14px; height: 14px;
    border: 2px solid var(--accent-bright);
  }
  .leadgen-cta::before { top: -1px; left: -1px; border-right: 0; border-bottom: 0; }
  .leadgen-cta::after { bottom: -1px; right: -1px; border-left: 0; border-top: 0; }
  .leadgen-cta .lc-eye {
    font: 500 11px/1 "JetBrains Mono", monospace;
    color: var(--accent-bright); letter-spacing: 0.18em; text-transform: uppercase;
    margin-bottom: 14px;
  }
  .leadgen-cta h3 {
    font: 700 32px/1.15 "Space Grotesk", sans-serif;
    color: #EAF1EA; margin: 0 0 12px;
    letter-spacing: -0.02em;
  }
  .leadgen-cta h3 .accent { color: var(--accent-bright); }
  .leadgen-cta p {
    font: 400 15px/1.6 "Inter", sans-serif;
    color: #8A938C; margin: 0; max-width: 560px;
  }

  @media (max-width: 920px) {
    .leadgen-grid { grid-template-columns: 1fr; gap: 40px; }
    .leadgen-cta {
      grid-template-columns: 1fr;
      gap: 24px;
      padding: 32px 28px;
    }
  }
  @media (max-width: 540px) {
    .size-grid { grid-template-columns: 1fr 1fr; }
  }


  /* ============ Mobile nav (hamburger + overlay) ============ */
  .nav-hamburger {
    display: none;
    width: 44px; height: 44px;
    background: transparent;
    border: 1px solid #262B27;
    border-radius: 2px;
    padding: 0;
    cursor: pointer;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 4px;
    flex-shrink: 0;
  }
  .nav-hamburger span {
    display: block;
    width: 18px; height: 2px;
    background: var(--accent-bright);
    transition: transform 220ms, opacity 220ms;
    transform-origin: center;
  }
  .nav-hamburger.open span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
  .nav-hamburger.open span:nth-child(2) { opacity: 0; }
  .nav-hamburger.open span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
  /* Bumped z-index + safety overrides */
  .nav-mobile {
    z-index: 9999 !important;
    display: block !important;
  }
  .nav-hamburger {
    position: relative;
    z-index: 10000;
  }


  .nav-mobile {
    position: fixed;
    top: 72px; left: 0;
    width: 100vw;
    height: calc(100vh - 72px);
    height: calc(100dvh - 72px);
    background: #15191B;
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
    z-index: 9998;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    transform: translateZ(0);
    will-change: transform;
    animation: navFade 220ms ease-out;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
  @keyframes navFade {
    from { opacity: 0; }
    to   { opacity: 1; }
  }
  .nav-mobile-inner {
    max-width: 480px;
    margin: 0 auto;
    padding: 24px 24px 48px;
    display: flex;
    flex-direction: column;
    gap: 0;
  }
  .nav-mobile-link {
    display: block;
    padding: 16px 14px;
    color: #EAF1EA;
    font: 600 17px/1.3 "Inter", sans-serif;
    text-decoration: none;
    border-bottom: 1px solid rgba(31, 51, 88, 0.5);
    cursor: pointer;
    transition: color 120ms, background 120ms;
  }
  .nav-mobile-link:hover,
  .nav-mobile-link.active {
    color: var(--accent-bright);
    background: rgba(176, 136, 40, 0.04);
  }
  .nav-mobile-link.nav-mobile-sub {
    padding-left: 28px;
    font-weight: 500;
    font-size: 15px;
  }
  .nav-mobile-link.nav-mobile-resource {
    color: var(--accent-bright);
    margin-top: 4px;
  }
  .nav-mobile-eye {
    font: 500 10px/1 "JetBrains Mono", monospace;
    color: #5a635c;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    padding: 20px 14px 8px;
    border-bottom: 1px solid rgba(31, 51, 88, 0.5);
  }
  .nav-mobile-foot {
    margin-top: 28px;
    padding: 20px 14px 0;
    border-top: 1px solid #262B27;
    display: flex;
    flex-direction: column;
    gap: 14px;
  }
  .nav-mobile-phone {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 14px;
    border: 1px solid #262B27;
    color: var(--accent-bright);
    font: 500 16px/1 "JetBrains Mono", monospace;
    text-decoration: none;
  }
  .nav-mobile-phone i { font-size: 13px; }

  /* Show hamburger on mobile, hide desktop links/phone/book button */
  @media (max-width: 1024px) {
    .nav-hamburger { display: flex; margin-left: auto; }
    .nav .links,
    .nav .phone,
    .nav .nav-book { display: none; }
    .nav { gap: 12px; padding: 0 16px; }
  }

  /* ============ Home stats grid (override inline 3-col on mobile) ============ */
  @media (max-width: 880px) {
    .stats-grid[style*="repeat(3"] { grid-template-columns: repeat(2, 1fr) !important; }
  }
  @media (max-width: 540px) {
    .stats-grid[style*="repeat(3"] { grid-template-columns: 1fr !important; }
  }

  /* ============ Footer (5 cols → 3 → 2 → 1) ============ */
  @media (max-width: 1080px) {
    .foot-grid { grid-template-columns: 1.4fr 1fr 1fr; }
    .foot-grid > :nth-child(n+4) { /* push extra cols to next row */ }
  }
  @media (max-width: 760px) {
    .foot-grid { grid-template-columns: 1fr 1fr; gap: 32px; }
  }
  @media (max-width: 480px) {
    .foot-grid { grid-template-columns: 1fr; gap: 28px; }
  }

  /* ============ Section padding scales on small phones ============ */
  @media (max-width: 480px) {
    section, .page-head { padding: 48px 16px !important; }
    .container { padding: 0 !important; }
    .hero { padding: 48px 16px 64px !important; }
    .hero h1, .page-head h1 { font-size: 28px !important; line-height: 1.1 !important; }
    .hero .sub, .page-head .lede { font-size: 15px !important; }
    .leadgen-cta { padding: 28px 20px !important; }
    .leadgen-cta h3 { font-size: 24px !important; }
  }

  /* ============ Industry cards (home) — better mobile grid ============ */
  @media (max-width: 880px) {
    .ind-grid { grid-template-columns: repeat(3, 1fr) !important; }
  }
  @media (max-width: 600px) {
    .ind-grid { grid-template-columns: repeat(2, 1fr) !important; }
  }
  @media (max-width: 380px) {
    .ind-grid { grid-template-columns: 1fr !important; }
  }

  /* ============ Touch-friendly tap targets ============ */
  @media (max-width: 880px) {
    .btn-primary, .btn-outline { min-height: 48px; }
    .size-chip { min-height: 48px; }
  }

  /* ============ Utility bar — compact on mobile ============ */
  @media (max-width: 640px) {
    .util { font-size: 10px; padding: 0 16px; height: 32px; }
    .util .grp:last-child { display: none; }
  }

  /* ============ Lead-gen page — smaller form padding on mobile ============ */
  @media (max-width: 540px) {
    .form-card { padding: 24px 20px !important; }
    .leadgen-grid { gap: 32px !important; }
  }

  /* ============ Heart monitor (Medical Offices hero) ============ */
  .heart-monitor {
    position: absolute;
    top: 80px; right: 32px;
    width: 380px; height: 140px;
    overflow: hidden;
    z-index: 2;
    pointer-events: none;
    /* No background, no border, no corner brackets — just the trace floating on the page-head. */
  }
  .heart-monitor .hm-svg {
    display: block;
    width: 100%; height: 100%;
  }
  /* The trace path is 4 cycles wide (960 units) inside a 480-unit viewBox.
     Translate it leftward by exactly one cycle (240) so the loop is seamless. */
  .hm-trace-group {
    transform-origin: 0 0;
    animation: hm-scroll 5.2s linear infinite;
  }
  @keyframes hm-scroll {
    from { transform: translateX(0); }
    to   { transform: translateX(-240px); }
  }

  @media (max-width: 1100px) {
    .heart-monitor { width: 300px; height: 120px; }
  }
  @media (max-width: 820px) {
    .heart-monitor { display: none; }
  }

  /* ============ Finance ticker (Financial Services hero) ============ */
  .finance-ticker {
    position: absolute;
    top: 80px; right: 32px;
    width: 380px; height: 140px;
    overflow: hidden;
    z-index: 2;
    pointer-events: none;
  }
  .finance-ticker .ft-svg {
    display: block;
    width: 100%; height: 100%;
  }
  .ft-trace-group {
    transform-origin: 0 0;
    animation: ft-scroll 5.2s linear infinite;
  }
  @keyframes ft-scroll {
    from { transform: translateX(0); }
    to   { transform: translateX(-240px); }
  }
  @media (max-width: 1100px) {
    .finance-ticker { width: 300px; height: 120px; }
  }
  @media (max-width: 820px) {
    .finance-ticker { display: none; }
  }

  /* ============ Property skyline (Property Management hero) ============ */
  .property-skyline {
    position: absolute;
    top: 80px; right: 32px;
    width: 380px; height: 140px;
    overflow: hidden;
    z-index: 2;
    pointer-events: none;
  }
  .property-skyline .ps-svg {
    display: block;
    width: 100%; height: 100%;
  }
  .ps-trace-group {
    transform-origin: 0 0;
    animation: ps-scroll 5.2s linear infinite;
  }
  @keyframes ps-scroll {
    from { transform: translateX(0); }
    to   { transform: translateX(-240px); }
  }
  @media (max-width: 1100px) {
    .property-skyline { width: 300px; height: 120px; }
  }
  @media (max-width: 820px) {
    .property-skyline { display: none; }
  }



  /* Compliance grid: lock to 3 cols on desktop so 6 items = 2 clean rows */
  .compliance-grid {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 1px;
    background: #262B27;
    border: 1px solid #262B27;
    margin-top: 48px;
  }
  @media (max-width: 900px) {
    .compliance-grid { grid-template-columns: repeat(2, 1fr) !important; }
  }
  @media (max-width: 540px) {
    .compliance-grid { grid-template-columns: 1fr !important; }
  }

  .verticals-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1px;
    background: #262B27;
    border: 1px solid #262B27;
  }
  @media (max-width: 1080px) {
    .verticals-grid { grid-template-columns: repeat(3, 1fr); }
  }
  @media (max-width: 720px) {
    .verticals-grid { grid-template-columns: repeat(2, 1fr); }
  }
  @media (max-width: 460px) {
    .verticals-grid { grid-template-columns: 1fr; }
  }


  @media (max-width: 1100px) {
    .heart-monitor { width: 280px; }
  }
  @media (max-width: 900px) {
    .heart-monitor {
      position: relative;
      top: auto; right: auto;
      width: 100%; max-width: 480px;
      margin-top: 32px;
    }
  }

  /* Industry page responsive */
  @media (max-width: 880px) {
    .ind-cta-grid { grid-template-columns: 1fr !important; gap: 32px !important; }
  }
  @media (max-width: 640px) {
    .dropdown { position: fixed; left: 16px; right: 16px; top: 72px; min-width: 0; }
  }


  /* ============ Navigation directory — neon cards (home) ============ */
  .navq-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 18px;
  }
  .navq-card {
    --neon: #33FF7A;
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    text-align: left;
    padding: 24px 22px 22px;
    border-radius: 5px;
    cursor: pointer;
    font-family: inherit;
    color: inherit;
    background:
      linear-gradient(165deg,
        color-mix(in oklab, var(--neon) 7%, #1A1F1C) 0%,
        #15191B 70%);
    border: 1px solid color-mix(in oklab, var(--neon) 34%, transparent);
    box-shadow:
      0 0 22px -8px color-mix(in oklab, var(--neon) 35%, transparent),
      inset 0 0 0 1px color-mix(in oklab, var(--neon) 7%, transparent),
      inset 0 1px 0 0 color-mix(in oklab, var(--neon) 22%, transparent);
    transition: transform 220ms cubic-bezier(.6,.05,.25,1),
                border-color 220ms, box-shadow 220ms, background 220ms;
  }
  /* neon corner brackets */
  .navq-card::before, .navq-card::after {
    content: "";
    position: absolute;
    width: 11px; height: 11px;
    border: 1.5px solid var(--neon);
    opacity: 0.65;
    transition: opacity 220ms, width 220ms, height 220ms;
    pointer-events: none;
  }
  .navq-card::before { top: 6px; left: 6px; border-right: 0; border-bottom: 0; }
  .navq-card::after  { bottom: 6px; right: 6px; border-left: 0; border-top: 0; }
  .navq-card:hover,
  .navq-card:focus-visible {
    outline: none;
    transform: translateY(-4px);
    border-color: color-mix(in oklab, var(--neon) 75%, transparent);
    background:
      linear-gradient(165deg,
        color-mix(in oklab, var(--neon) 13%, #1A1F1C) 0%,
        #15191B 72%);
    box-shadow:
      0 0 40px -6px color-mix(in oklab, var(--neon) 60%, transparent),
      0 14px 36px -18px rgba(0,0,0,0.8),
      inset 0 0 0 1px color-mix(in oklab, var(--neon) 14%, transparent),
      inset 0 1px 0 0 color-mix(in oklab, var(--neon) 40%, transparent);
  }
  .navq-card:hover::before, .navq-card:focus-visible::before,
  .navq-card:hover::after,  .navq-card:focus-visible::after { opacity: 1; width: 16px; height: 16px; }

  .navq-top {
    display: flex; align-items: center; justify-content: space-between;
    margin-bottom: 18px;
  }
  .navq-num {
    font: 700 22px/1 "JetBrains Mono", monospace;
    color: var(--neon);
    font-feature-settings: "tnum";
    letter-spacing: -0.02em;
    text-shadow: 0 0 12px color-mix(in oklab, var(--neon) 45%, transparent);
  }
  .navq-ic {
    position: relative;
    width: 42px; height: 42px;
    display: flex; align-items: center; justify-content: center;
    border: 1px solid color-mix(in oklab, var(--neon) 48%, transparent);
    background: color-mix(in oklab, var(--neon) 9%, transparent);
    color: var(--neon);
    font-size: 17px;
    border-radius: 4px;
    box-shadow:
      0 0 16px -6px color-mix(in oklab, var(--neon) 60%, transparent),
      inset 0 0 12px -7px color-mix(in oklab, var(--neon) 55%, transparent);
    transition: border-color 220ms, background 220ms, box-shadow 220ms;
  }
  .navq-card:hover .navq-ic,
  .navq-card:focus-visible .navq-ic {
    border-color: var(--neon);
    background: color-mix(in oklab, var(--neon) 18%, transparent);
    box-shadow:
      0 0 24px -4px color-mix(in oklab, var(--neon) 78%, transparent),
      inset 0 0 16px -7px color-mix(in oklab, var(--neon) 65%, transparent);
  }
  .navq-watermark {
    position: absolute;
    right: -14px; bottom: -16px;
    font-size: 128px; line-height: 1;
    color: var(--neon);
    opacity: 0.07;
    pointer-events: none;
    z-index: 0;
    transition: opacity 240ms, transform 240ms;
  }
  .navq-card:hover .navq-watermark,
  .navq-card:focus-visible .navq-watermark {
    opacity: 0.14;
    transform: translateY(-6px) rotate(-4deg) scale(1.05);
  }
  .navq-top, .navq-q, .navq-go { position: relative; z-index: 1; }
  .navq-q h3 {
    font: 700 25px/1.2 "Space Grotesk", sans-serif;
    color: #EAF1EA;
    letter-spacing: -0.015em;
    margin: 0 0 10px;
    text-wrap: balance;
  }
  .navq-desc {
    font: 400 13.5px/1.55 "Inter", sans-serif;
    color: #8A938C;
    margin: 0 0 20px;
    text-wrap: pretty;
  }
  .navq-go {
    display: flex; align-items: center; justify-content: space-between;
    gap: 12px;
    margin-top: auto;
    padding-top: 16px;
    border-top: 1px solid color-mix(in oklab, var(--neon) 18%, transparent);
  }
  .navq-dest {
    font: 700 16px/1.25 "JetBrains Mono", monospace;
    color: color-mix(in oklab, var(--neon) 82%, #ffffff);
    text-transform: uppercase;
    letter-spacing: 0.08em;
  }
  .navq-arrow {
    flex-shrink: 0;
    color: var(--neon);
    font-size: 13px;
    transition: transform 220ms cubic-bezier(.6,.05,.25,1);
  }
  .navq-card:hover .navq-arrow,
  .navq-card:focus-visible .navq-arrow { transform: translateX(4px); }

  @media (max-width: 1080px) {
    .navq-grid { grid-template-columns: repeat(3, 1fr); }
  }
  @media (max-width: 760px) {
    .navq-grid { grid-template-columns: repeat(2, 1fr); gap: 14px; }
  }
  @media (max-width: 440px) {
    .navq-grid { grid-template-columns: 1fr; }
  }

  .navq-callbar {
    display: flex; align-items: center; justify-content: space-between;
    gap: 24px; flex-wrap: wrap;
    margin-top: 48px;
    padding: 28px 36px;
    border: 1px solid #262B27;
    background: #0A0D0A;
    position: relative;
  }
  .navq-callbar::before, .navq-callbar::after {
    content: ""; position: absolute; width: 12px; height: 12px;
    border: 2px solid var(--accent-bright);
  }
  .navq-callbar::before { top: -1px; left: -1px; border-right: 0; border-bottom: 0; }
  .navq-callbar::after { bottom: -1px; right: -1px; border-left: 0; border-top: 0; }
  .navq-callbar .ncb-txt {
    font: 600 17px/1.4 "Space Grotesk", sans-serif;
    color: #EAF1EA;
  }
  .navq-callbar .ncb-txt span {
    display: block;
    font: 500 11px/1 "JetBrains Mono", monospace;
    color: #5a635c; text-transform: uppercase; letter-spacing: 0.16em;
    margin-bottom: 8px;
  }
  .navq-callbar a.ncb-phone {
    display: inline-flex; align-items: center; gap: 12px;
    font: 700 22px/1 "JetBrains Mono", monospace;
    color: var(--accent-bright);
    text-decoration: none;
    letter-spacing: 0.02em;
  }
  .navq-callbar a.ncb-phone i { font-size: 16px; }

  @media (max-width: 760px) {
    .navq-callbar { padding: 24px 20px; }
  }

  /* ============ Why Us — positioning + pillars ============ */
  .why-lead {
    display: grid; grid-template-columns: 1.15fr 0.85fr; gap: 56px; align-items: start;
  }
  .why-lead .why-lead-body p {
    font: 400 17px/1.7 "Inter", sans-serif; color: #c2cfe3; margin: 0 0 18px; text-wrap: pretty;
  }
  .why-lead .why-lead-body p strong { color: #EAF1EA; font-weight: 600; }
  .why-creds { display: flex; flex-direction: column; gap: 14px; }
  .why-cred {
    display: flex; align-items: center; gap: 16px;
    border: 1px solid color-mix(in oklab, var(--accent-bright) 24%, #262B27);
    background: linear-gradient(165deg, color-mix(in oklab, var(--accent-bright) 6%, #0A0D0A), #0A0D0A 72%);
    padding: 16px 18px; position: relative; overflow: hidden;
    box-shadow: 0 0 20px -12px color-mix(in oklab, var(--accent-bright) 48%, transparent), inset 0 1px 0 0 color-mix(in oklab, var(--accent-bright) 12%, transparent);
    transition: border-color 220ms, box-shadow 220ms, transform 220ms;
  }
  .why-cred::before {
    content: ""; position: absolute; top: 6px; left: 6px; width: 10px; height: 10px;
    border: 1.5px solid var(--accent-bright); border-right: 0; border-bottom: 0; opacity: 0.6;
  }
  .why-cred:hover {
    transform: translateX(3px);
    border-color: color-mix(in oklab, var(--accent-bright) 60%, transparent);
    box-shadow: 0 0 30px -8px color-mix(in oklab, var(--accent-bright) 62%, transparent), inset 0 1px 0 0 color-mix(in oklab, var(--accent-bright) 18%, transparent);
  }
  .why-cred i {
    width: 42px; height: 42px; flex-shrink: 0;
    display: flex; align-items: center; justify-content: center;
    border: 1px solid color-mix(in oklab, var(--accent-bright) 42%, transparent);
    background: color-mix(in oklab, var(--accent-bright) 10%, transparent); color: var(--accent-bright); font-size: 16px; border-radius: 4px;
    box-shadow: 0 0 16px -6px color-mix(in oklab, var(--accent-bright) 55%, transparent), inset 0 0 12px -8px color-mix(in oklab, var(--accent-bright) 50%, transparent);
  }
  .why-cred .wc-main { font: 600 14px/1.3 "Inter", sans-serif; color: #EAF1EA; }
  .why-cred .wc-sub {
    font: 500 10px/1.4 "JetBrains Mono", monospace; color: #5a635c;
    text-transform: uppercase; letter-spacing: 0.12em; margin-top: 4px;
  }

  .why-pillars { display: flex; flex-direction: column; gap: 22px; margin-top: 8px; }
  .why-feat {
    display: grid; grid-template-columns: 1fr 1fr;
    border: 1px solid color-mix(in oklab, var(--accent-bright) 34%, #262B27);
    background: #15191B; position: relative; overflow: hidden;
    box-shadow: 0 0 38px -18px color-mix(in oklab, var(--accent-bright) 68%, transparent);
  }
  .why-feat::before {
    content: ""; position: absolute; top: -1px; left: -1px; width: 16px; height: 16px;
    border: 2px solid var(--accent-bright); border-right: 0; border-bottom: 0; z-index: 3;
  }
  .why-feat::after {
    content: ""; position: absolute; bottom: -1px; right: -1px; width: 16px; height: 16px;
    border: 2px solid var(--accent-bright); border-left: 0; border-top: 0; z-index: 3;
  }
  .why-feat-text { padding: 52px 48px; display: flex; flex-direction: column; }
  .why-feat-pill {
    font: 500 11px/1 "JetBrains Mono", monospace; color: var(--accent-bright);
    text-transform: uppercase; letter-spacing: 0.18em; margin-bottom: 22px;
    display: inline-flex; align-items: center; gap: 12px;
  }
  .why-feat-pill::before { content: ""; width: 28px; height: 1px; background: var(--accent-bright); }
  .why-feat-text h3 {
    font: 700 32px/1.12 "Space Grotesk", sans-serif; color: #EAF1EA;
    letter-spacing: -0.02em; margin: 0 0 18px; text-wrap: balance;
  }
  .why-feat-text h3 .accent { color: var(--accent-bright); }
  .why-feat-text > p {
    font: 400 15.5px/1.65 "Inter", sans-serif; color: #8A938C; margin: 0 0 26px; text-wrap: pretty;
  }
  .why-list { list-style: none; padding: 0; margin: 0 0 4px; display: flex; flex-direction: column; gap: 13px; }
  .why-list li {
    position: relative; padding-left: 26px;
    font: 400 14.5px/1.5 "Inter", sans-serif; color: #c2cfe3;
  }
  .why-list li::before {
    content: ""; position: absolute; left: 0; top: 8px; width: 14px; height: 1px; background: var(--accent-bright);
  }
  .why-list li::after {
    content: ""; position: absolute; left: 12px; top: 6px; width: 4px; height: 4px;
    background: var(--accent-bright); transform: rotate(45deg);
  }
  .why-feat-foot {
    margin-top: 28px; padding-top: 20px; border-top: 1px solid #262B27;
    font: 500 11px/1.5 "JetBrains Mono", monospace; color: #5a635c;
    text-transform: uppercase; letter-spacing: 0.1em;
  }
  .why-feat-foot b { color: var(--accent-bright); font-weight: 500; }

  /* visual side */
  .why-feat-viz {
    position: relative; border-left: 1px solid color-mix(in oklab, var(--accent-bright) 22%, #262B27);
    background: #0A0D0A;
    padding: 44px 40px;
    display: flex; flex-direction: column; justify-content: center; gap: 22px;
    overflow: hidden;
  }
  .why-feat-viz::after { content: none; }
  .why-feat.rev .why-feat-text { order: 2; border-left: 1px solid color-mix(in oklab, var(--accent-bright) 22%, #262B27); }
  .why-feat.rev .why-feat-viz { order: 1; border-left: 0; }
  .viz-cap {
    position: relative; z-index: 1;
    font: 500 10px/1 "JetBrains Mono", monospace; color: #5a635c;
    text-transform: uppercase; letter-spacing: 0.16em;
  }

  /* cost-down bars */
  .viz-bars { position: relative; z-index: 1; display: flex; align-items: flex-end; gap: 28px; height: 188px; }
  .viz-bar { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 12px; height: 100%; justify-content: flex-end; }
  .viz-bar .col {
    width: 100%; max-width: 84px; position: relative; border-radius: 3px 3px 0 0;
  }
  .viz-bar.before .col { background: linear-gradient(180deg, #333A35, #16284a); height: 100%; border: 1px solid #333A35; }
  .viz-bar.after .col {
    background: linear-gradient(180deg, var(--accent-bright), var(--accent));
    border: 1px solid var(--accent-bright);
    box-shadow: 0 0 28px -6px color-mix(in oklab, var(--accent-bright) 55%, transparent);
  }
  .viz-bar .bval { font: 700 18px/1 "JetBrains Mono", monospace; color: #EAF1EA; }
  .viz-bar.after .bval { color: var(--accent-bright); }
  .viz-bar .blab { font: 500 10px/1 "JetBrains Mono", monospace; color: #5a635c; text-transform: uppercase; letter-spacing: 0.12em; }
  .viz-delta {
    position: absolute; top: 6px; right: 0; z-index: 2;
    display: inline-flex; align-items: center; gap: 7px;
    font: 700 14px/1 "JetBrains Mono", monospace; color: #4ade80;
    border: 1px solid rgba(74,222,128,0.4); background: rgba(74,222,128,0.08);
    padding: 7px 11px; border-radius: 3px;
  }
  .viz-chips { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: 10px; }
  .viz-chip {
    display: inline-flex; align-items: center; gap: 8px;
    font: 500 11px/1 "JetBrains Mono", monospace; color: #c2cfe3;
    border: 1px solid #262B27; background: #0A0D0A; padding: 9px 12px; border-radius: 3px;
    text-transform: uppercase; letter-spacing: 0.08em;
  }
  .viz-chip i { color: var(--accent-bright); font-size: 12px; }

  /* CIO role card */
  .viz-role {
    position: relative; z-index: 1;
    border: 1px solid #333A35; background: #0A0D0A; padding: 22px 22px 20px;
  }
  .viz-role::before, .viz-role::after {
    content: ""; position: absolute; width: 11px; height: 11px; border: 1.5px solid var(--accent-bright); opacity: 0.7;
  }
  .viz-role::before { top: -1px; left: -1px; border-right: 0; border-bottom: 0; }
  .viz-role::after { bottom: -1px; right: -1px; border-left: 0; border-top: 0; }
  .viz-role-top { display: flex; align-items: center; gap: 14px; margin-bottom: 18px; }
  .viz-role-ic {
    width: 46px; height: 46px; flex-shrink: 0; border: 1px solid var(--accent);
    background: rgba(39,224,106,0.1); display: flex; align-items: center; justify-content: center;
    color: var(--accent-bright); font-size: 20px;
  }
  .viz-role-badge { font: 500 10px/1 "JetBrains Mono", monospace; color: var(--accent-bright); text-transform: uppercase; letter-spacing: 0.16em; margin-bottom: 6px; }
  .viz-role-name { font: 700 17px/1.1 "Space Grotesk", sans-serif; color: #EAF1EA; letter-spacing: -0.01em; }
  .viz-road { margin-top: 6px; }
  .viz-track {
    position: relative; display: grid; grid-template-columns: repeat(4, 1fr); align-items: center;
  }
  .viz-track::before {
    content: ""; position: absolute; left: 12.5%; right: 12.5%; top: 50%;
    transform: translateY(-50%); height: 1px; background: #333A35; z-index: 0;
  }
  .viz-track .dot {
    width: 13px; height: 13px; border-radius: 50%; justify-self: center;
    border: 2px solid var(--accent); background: #0A0D0A; position: relative; z-index: 1;
  }
  .viz-track .dot.on { background: var(--accent-bright); border-color: var(--accent-bright); box-shadow: 0 0 10px var(--accent-bright); }
  .viz-qlabels { display: grid; grid-template-columns: repeat(4, 1fr); margin-top: 9px; }
  .viz-qlabels .ql { text-align: center; font: 500 9px/1 "JetBrains Mono", monospace; color: #5a635c; letter-spacing: 0.1em; }
  .viz-qlabels .ql.on { color: var(--accent-bright); }

  @media (max-width: 900px) {
    .why-lead { grid-template-columns: 1fr; gap: 36px; }
    .why-feat, .why-feat.rev { grid-template-columns: 1fr; }
    .why-feat-viz, .why-feat.rev .why-feat-viz { order: 2; border-left: 0; border-top: 1px solid #262B27; }
    .why-feat.rev .why-feat-text { order: 1; border-left: 0; }
    .why-feat-text { padding: 40px 28px; }
    .why-feat-viz { padding: 36px 28px; }
    .why-feat-text h3 { font-size: 26px; }
  }

  /* ============ Why Us — comparison ============ */
  .vs-wrap {
    position: relative;
    border: 1px solid color-mix(in oklab, var(--accent-bright) 34%, #262B27);
    background: #15191B; overflow: hidden;
    box-shadow: 0 0 38px -18px color-mix(in oklab, var(--accent-bright) 68%, transparent);
  }
  .vs-wrap::before {
    content: ""; position: absolute; top: -1px; left: -1px; width: 16px; height: 16px;
    border: 2px solid var(--accent-bright); border-right: 0; border-bottom: 0; z-index: 3; pointer-events: none;
  }
  .vs-wrap::after {
    content: ""; position: absolute; bottom: -1px; right: -1px; width: 16px; height: 16px;
    border: 2px solid var(--accent-bright); border-left: 0; border-top: 0; z-index: 3; pointer-events: none;
  }
  .vs-row { display: grid; grid-template-columns: 1.25fr 1fr 1fr; border-bottom: 1px solid #262B27; }
  .vs-row:last-child { border-bottom: 0; }
  .vs-cell { padding: 20px 24px; display: flex; align-items: center; gap: 12px; }
  .vs-cell.dim { font: 600 14px/1.4 "Inter", sans-serif; color: #EAF1EA; }
  .vs-cell.them { color: #8A938C; border-left: 1px solid #262B27; font: 400 14px/1.45 "Inter", sans-serif; }
  .vs-cell.us { color: #c2cfe3; border-left: 1px solid #262B27; background: rgba(39,224,106,0.05); font: 400 14px/1.45 "Inter", sans-serif; }
  .vs-cell.them i { color: #5a6a85; font-size: 13px; flex-shrink: 0; }
  .vs-cell.us i { color: #4ade80; font-size: 13px; flex-shrink: 0; }
  .vs-head .vs-cell { padding: 16px 24px; font: 500 11px/1 "JetBrains Mono", monospace; text-transform: uppercase; letter-spacing: 0.14em; }
  .vs-head .vs-cell.dim { color: #5a635c; }
  .vs-head .vs-cell.them { color: #8A938C; }
  .vs-head .vs-cell.us { color: var(--accent-bright); background: rgba(39,224,106,0.08); }
  @media (max-width: 760px) {
    .vs-row { grid-template-columns: 1fr; }
    .vs-cell.them, .vs-cell.us { border-left: 0; }
    .vs-cell.dim { padding-bottom: 4px; font-size: 13px; }
    .vs-head { display: none; }
    .vs-cell.them::before { content: "TYPICAL MSP — "; font: 500 9px/1 "JetBrains Mono", monospace; color: #5a6a85; letter-spacing: 0.1em; margin-right: 4px; }
    .vs-cell.us::before { content: "37 FORGE — "; font: 500 9px/1 "JetBrains Mono", monospace; color: var(--accent-bright); letter-spacing: 0.1em; margin-right: 4px; }
  }

  /* ============ Buttons ============ */
  .btn-primary {
    display: inline-flex; align-items: center; justify-content: center; gap: 10px;
    height: 46px; padding: 0 24px;
    background: var(--accent); color: #06210F;
    font: 600 13px/1 "Inter", sans-serif; text-transform: uppercase; letter-spacing: 0.12em;
    border: 1px solid var(--accent-bright); border-radius: 2px;
    cursor: pointer; text-decoration: none;
    transition: background 120ms, box-shadow 120ms;
    position: relative;
  }
  .btn-primary:hover { background: var(--accent-bright); box-shadow: 0 0 24px rgba(39,224,106,0.35); }
  .btn-primary:active { background: var(--accent-deep); }
  .btn-primary i { font-size: 12px; }

  .btn-outline {
    display: inline-flex; align-items: center; justify-content: center; gap: 10px;
    height: 46px; padding: 0 24px;
    background: transparent; color: var(--accent-bright);
    font: 600 13px/1 "Inter", sans-serif; text-transform: uppercase; letter-spacing: 0.12em;
    border: 1px solid var(--accent); border-radius: 2px;
    cursor: pointer; text-decoration: none;
    transition: background 120ms;
  }
  .btn-outline:hover { background: rgba(39,224,106,0.1); border-color: var(--accent-bright); }
  .btn-outline i { font-size: 12px; }

  .btn-ghost {
    display: inline-flex; align-items: center; gap: 8px;
    background: transparent; border: none; padding: 0;
    color: var(--accent-bright);
    font: 500 11px/1 "JetBrains Mono", monospace; text-transform: uppercase; letter-spacing: 0.16em;
    cursor: pointer;
  }

  /* ============ Cards w/ gold brackets ============ */
  .card {
    position: relative;
    background: #1A1F1C;
    border: 1px solid #262B27;
    border-radius: 2px;
    padding: 32px;
    transition: border-color 200ms;
  }
  .card::before, .card::after {
    content: ""; position: absolute; width: 14px; height: 14px;
    border: 2px solid var(--accent-bright); border-radius: 0;
    transition: width 200ms, height 200ms, border-color 200ms;
  }
  .card::before { top: -1px; left: -1px; border-right: 0; border-bottom: 0; }
  .card::after { bottom: -1px; right: -1px; border-left: 0; border-top: 0; }
  .card:hover::before, .card:hover::after { width: 20px; height: 20px; }

  /* ============ Hero ============ */
  .hero {
    position: relative; padding: 80px 32px 96px;
    overflow: hidden;
    border-bottom: 1px solid #262B27;
  }
  .hero::before {
    content: ""; position: absolute; inset: 0;
    background:
      radial-gradient(ellipse at 80% 50%, rgba(39,224,106,0.09), transparent 60%),
      linear-gradient(to right, rgba(39,224,106,var(--grid-opacity)) 1px, transparent 1px) 0 0 / 48px 48px,
      linear-gradient(to bottom, rgba(39,224,106,var(--grid-opacity)) 1px, transparent 1px) 0 0 / 48px 48px,
      #15191B;
    z-index: 0;
  }
  .hero-inner { max-width: 1280px; margin: 0 auto; display: grid; grid-template-columns: 1.1fr 1fr; gap: 64px; align-items: center; position: relative; z-index: 1; }

  .eyebrow {
    font: 500 11px/1 "JetBrains Mono", monospace;
    color: var(--accent-bright);
    text-transform: uppercase; letter-spacing: 0.18em;
    margin-bottom: 20px;
    display: inline-flex; align-items: center; gap: 12px;
  }
  .eyebrow::before { content: ""; width: 28px; height: 1px; background: var(--accent-bright); }
  .eyebrow.no-line::before { display: none; }

  .hero h1 {
    font: 700 60px/1.05 "Space Grotesk", sans-serif;
    letter-spacing: -0.025em; color: #EAF1EA;
    margin: 0 0 28px;
  }
  .hero h1 .accent { color: var(--accent-bright); }
  .hero h1 .gloss {
    background: linear-gradient(120deg, #EAF1EA 0%, #EAF1EA 40%, var(--accent-bright) 50%, #EAF1EA 60%, #EAF1EA 100%);
    background-size: 200% 100%; background-clip: text; -webkit-background-clip: text;
    color: transparent; -webkit-text-fill-color: transparent;
    animation: gloss 6s ease-in-out infinite;
  }
  @keyframes gloss { 0%,100% { background-position: 100% 0; } 50% { background-position: 0 0; } }

  .hero .sub { font: 400 18px/1.6 "Inter", sans-serif; color: #8A938C; max-width: 540px; margin: 0 0 36px; }
  .hero .ctas { display: flex; gap: 12px; margin-bottom: 48px; flex-wrap: wrap; }
  .hero .strip {
    display: grid; grid-template-columns: repeat(3, 1fr);
    padding-top: 28px; border-top: 1px solid #262B27;
    gap: 16px;
  }
  .hero .strip .stat .n {
    font: 700 32px/1 "JetBrains Mono", monospace;
    color: #EAF1EA; font-feature-settings: "tnum";
  }
  .hero .strip .stat .l {
    font: 500 11px/1.4 "JetBrains Mono", monospace;
    color: #5a635c; text-transform: uppercase; letter-spacing: 0.14em;
    margin-top: 10px;
  }

  /* Tactical ops console (right side of hero) */
  .console {
    position: relative;
    background: #0A0D0A;
    border: 1px solid #333A35;
    padding: 0;
  }
  .console::before, .console::after {
    content: ""; position: absolute; width: 16px; height: 16px;
    border: 2px solid var(--accent-bright);
  }
  .console::before { top: -1px; left: -1px; border-right: 0; border-bottom: 0; }
  .console::after { bottom: -1px; right: -1px; border-left: 0; border-top: 0; }
  .console-head {
    display: flex; justify-content: space-between; align-items: center;
    padding: 14px 18px;
    border-bottom: 1px solid #262B27;
    background: linear-gradient(to right, rgba(39,224,106,0.08), transparent);
  }
  .console-head .t {
    font: 500 11px/1 "JetBrains Mono", monospace;
    color: var(--accent-bright); text-transform: uppercase; letter-spacing: 0.18em;
    display: flex; align-items: center; gap: 10px;
  }
  .console-head .t::before {
    content: ""; width: 6px; height: 6px; background: #4ade80; border-radius: 50%;
    box-shadow: 0 0 8px #4ade80; animation: pulse 2s infinite;
  }
  .console-head .ts { font: 500 10px/1 "JetBrains Mono", monospace; color: #5a635c; letter-spacing: 0.14em; }
  .console-body { padding: 0; }
  .console-row {
    display: flex; justify-content: space-between; align-items: center;
    padding: 14px 18px;
    border-bottom: 1px solid rgba(31,51,88,0.6);
    font: 500 12px/1 "JetBrains Mono", monospace;
  }
  .console-row:last-child { border-bottom: none; }
  .console-row .k {
    color: #5a635c; text-transform: uppercase; letter-spacing: 0.12em;
    display: flex; align-items: center; gap: 10px;
  }
  .console-row .k i { color: var(--accent); width: 12px; }
  .console-row .v { color: #EAF1EA; font-feature-settings: "tnum"; font-weight: 500; }
  .console-row .v.ok { color: #4ade80; }
  .console-row .v.warn { color: #f5b342; }

  .ascii-bar {
    height: 4px; background: linear-gradient(to right, var(--accent) var(--bar, 60%), #262B27 var(--bar, 60%));
    margin-top: 6px; width: 100%; max-width: 80px;
  }

  /* ============ Sections ============ */
  section { padding: var(--section-padding) 32px; position: relative; }
  .container { max-width: 1280px; margin: 0 auto; }
  .section-head {
    display: grid; grid-template-columns: 1.4fr 1fr;
    gap: 48px; align-items: end;
    margin-bottom: 56px;
  }
  .section-head h2 {
    font: 700 44px/1.1 "Space Grotesk", sans-serif;
    letter-spacing: -0.02em; margin: 0 0 0 0;
  }
  .section-head h2 .accent { color: var(--accent-bright); }
  .section-head .desc { font: 400 16px/1.6 "Inter", sans-serif; color: #8A938C; margin: 0; }
  .section-head .eyebrow { margin-bottom: 18px; }

  /* ============ Service detail rows ============ */
  .svc-list { display: flex; flex-direction: column; gap: 0; }
  .svc-row {
    display: grid; grid-template-columns: 100px 1.3fr 1.4fr 100px;
    gap: 32px;
    padding: 56px 0;
    border-top: 1px solid #262B27;
    align-items: start;
    position: relative;
    transition: background 200ms;
  }
  .svc-row:hover { background: linear-gradient(to right, rgba(39,224,106,0.04), transparent 60%); }
  .svc-row:last-child { border-bottom: 1px solid #262B27; }
  .svc-row .num {
    font: 700 56px/0.9 "JetBrains Mono", monospace;
    color: var(--accent-bright); font-feature-settings: "tnum";
    letter-spacing: -0.02em;
  }
  .svc-row .ic {
    position: relative;
    width: 64px; height: 64px;
    background: rgba(39,224,106,0.1);
    border: 1px solid var(--accent);
    display: flex; align-items: center; justify-content: center;
    color: var(--accent-bright); font-size: 24px;
    margin-top: 8px;
  }
  .svc-row .ic::before, .svc-row .ic::after {
    content: ""; position: absolute; width: 8px; height: 8px;
    border: 2px solid var(--accent-bright);
  }
  .svc-row .ic::before { top: -1px; left: -1px; border-right: 0; border-bottom: 0; }
  .svc-row .ic::after { bottom: -1px; right: -1px; border-left: 0; border-top: 0; }
  .svc-row .body .tag {
    font: 500 11px/1 "JetBrains Mono", monospace;
    color: var(--accent-bright); text-transform: uppercase; letter-spacing: 0.18em;
    margin-bottom: 14px; display: block;
  }
  .svc-row h3 {
    font: 700 28px/1.2 "Space Grotesk", sans-serif;
    color: #EAF1EA; margin: 0 0 14px;
    letter-spacing: -0.01em;
  }
  .svc-row .body p { font: 400 15px/1.6 "Inter", sans-serif; color: #8A938C; margin: 0; max-width: 460px; }
  .svc-row ul {
    list-style: none; padding: 0; margin: 0;
    display: flex; flex-direction: column; gap: 12px;
  }
  .svc-row li {
    font: 400 14px/1.4 "Inter", sans-serif; color: #EAF1EA;
    padding-left: 26px; position: relative;
  }
  .svc-row li::before {
    content: ""; position: absolute; left: 0; top: 8px;
    width: 14px; height: 1px; background: var(--accent-bright);
  }
  .svc-row li::after {
    content: ""; position: absolute; left: 12px; top: 6px;
    width: 4px; height: 4px; background: var(--accent-bright);
    transform: rotate(45deg);
  }
  .svc-row li.metric { color: var(--accent-bright); font-family: "JetBrains Mono", monospace; font-feature-settings: "tnum"; font-size: 12px; text-transform: uppercase; letter-spacing: 0.12em; }
  .svc-row .meta {
    font: 500 10px/1.5 "JetBrains Mono", monospace;
    color: #5a635c; text-transform: uppercase; letter-spacing: 0.14em;
    text-align: right;
  }
  .svc-row .meta .pill {
    display: inline-block;
    padding: 4px 8px;
    background: rgba(74,222,128,0.1);
    border: 1px solid rgba(74,222,128,0.4);
    color: #4ade80;
    margin-bottom: 8px;
  }

  /* ============ Stats grid ============ */
  .stats-grid {
    display: grid; grid-template-columns: repeat(4, 1fr);
    gap: 1px; background: #262B27;
    border: 1px solid #262B27;
  }
  .stat-cell {
    background: #15191B; padding: 36px 28px;
    position: relative;
  }
  .stat-cell .stat-eyebrow {
    font: 500 10px/1 "JetBrains Mono", monospace;
    color: #5a635c; text-transform: uppercase; letter-spacing: 0.14em;
    margin-bottom: 16px;
  }
  .stat-cell .n {
    font: 700 56px/1 "JetBrains Mono", monospace;
    color: var(--accent-bright); font-feature-settings: "tnum";
    letter-spacing: -0.02em;
  }
  .stat-cell .n .unit { font-size: 24px; color: #8A938C; margin-left: 4px; }
  .stat-cell .l {
    font: 600 15px/1.4 "Space Grotesk", sans-serif;
    color: #EAF1EA; margin-top: 16px;
  }
  .stat-cell .d {
    font: 400 13px/1.55 "Inter", sans-serif;
    color: #8A938C; margin-top: 8px;
  }
  .stat-cell .bar { height: 2px; background: rgba(39,224,106,0.2); margin-top: 16px; overflow: hidden; }
  .stat-cell .bar > span { display: block; height: 100%; background: var(--accent-bright); width: 0; transition: width 1.6s cubic-bezier(.2,.8,.2,1); }
  .stat-cell.in-view .bar > span { width: var(--w, 80%); }

  /* ============ Industries ============ */
  .ind-grid {
    display: grid; grid-template-columns: repeat(6, 1fr);
    gap: 1px; background: #262B27;
    border: 1px solid #262B27;
  }

  /* ============ Industry cards (simplified, no flip) ============ */
  .industry-card {
    background: #1A1F1C;
    border: 1px solid #262B27;
    padding: 28px 20px;
    display: flex; flex-direction: column; align-items: center;
    text-align: center; gap: 12px;
    transition: border-color 200ms, transform 200ms;
    position: relative;
  }
  .industry-card:hover {
    border-color: var(--accent);
    transform: translateY(-2px);
  }
  .industry-icon {
    width: 52px; height: 52px;
    display: flex; align-items: center; justify-content: center;
    border: 1px solid var(--accent);
    background: rgba(39,224,106,0.08);
    position: relative;
  }
  .industry-icon::before, .industry-icon::after {
    content: ""; position: absolute; width: 6px; height: 6px;
    border: 1.5px solid var(--accent-bright);
  }
  .industry-icon::before { top: -1px; left: -1px; border-right: 0; border-bottom: 0; }
  .industry-icon::after  { bottom: -1px; right: -1px; border-left: 0; border-top: 0; }
  .industry-icon i {
    color: var(--accent-bright);
    font-size: 22px;
  }
  .industry-label {
    font: 600 14px/1.3 "Space Grotesk", sans-serif;
    color: #EAF1EA;
    letter-spacing: -0.005em;
    margin-top: 4px;
  }
  .industry-tag {
    font: 400 12px/1.5 "Inter", sans-serif;
    color: #8A938C;
    max-width: 200px;
  }

  .ind {
    position: relative;
    background: transparent;
    min-height: 240px;
    perspective: 1100px;
    cursor: pointer;
    outline: none;
  }
  .ind:focus-visible { outline: 1px solid var(--accent-bright); outline-offset: -1px; }
  .ind-inner {
    position: absolute; inset: 0;
    transform-style: preserve-3d;
    transition: transform 540ms cubic-bezier(.6,.05,.25,1);
    will-change: transform;
  }
  .ind:hover .ind-inner,
  .ind.flipped .ind-inner { transform: rotateY(180deg); }

  .ind-face {
    position: absolute; inset: 0;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    padding: 18px 14px;
    display: flex; flex-direction: column;
    box-sizing: border-box;
    background: #15191B;
    overflow: hidden;
  }
  .ind-front {
    align-items: center; justify-content: center; text-align: center; gap: 14px;
  }
  .ind-front i { color: var(--accent-bright); font-size: 28px; }
  .ind-front .l {
    font: 500 11px/1.3 "JetBrains Mono", monospace;
    color: #EAF1EA; text-transform: uppercase; letter-spacing: 0.14em;
  }
  .ind-front .ind-hint {
    position: absolute; bottom: 10px; left: 0; right: 0;
    font: 500 8px/1 "JetBrains Mono", monospace;
    color: #5a635c; text-transform: uppercase; letter-spacing: 0.20em;
    opacity: 0.55;
  }
  .ind-back {
    transform: rotateY(180deg);
    background: #1A1F1C;
    justify-content: flex-start;
    text-align: left;
    padding: 18px 14px 14px;
    gap: 12px;
  }
  .ind-back .ind-block + .ind-block { margin-top: 0; }
  .ind-back .ind-metric { margin-top: auto; }
  .ind-back::before, .ind-back::after {
    content: ""; position: absolute; width: 8px; height: 8px;
    border: 1.5px solid var(--accent-bright);
  }
  .ind-back::before { top: 4px; left: 4px; border-right: 0; border-bottom: 0; }
  .ind-back::after { bottom: 4px; right: 4px; border-left: 0; border-top: 0; }
  .ind-block { display: flex; flex-direction: column; }
  .ind-eye {
    font: 600 9.5px/1 "JetBrains Mono", monospace;
    color: var(--accent-bright); text-transform: uppercase; letter-spacing: 0.16em;
    margin-bottom: 6px;
    display: flex; align-items: center; gap: 6px;
  }
  .ind-eye::before {
    content: ""; width: 4px; height: 4px; background: var(--accent-bright); border-radius: 50%;
  }
  .ind-eye.fix { color: #4ade80; }
  .ind-eye.fix::before { background: #4ade80; box-shadow: 0 0 6px #4ade80; }
  .ind-text {
    font: 400 12px/1.4 "Inter", sans-serif;
    color: #EAF1EA;
    text-wrap: pretty;
  }
  .ind-metric {
    font: 600 10px/1.3 "JetBrains Mono", monospace;
    color: #4ade80; text-transform: uppercase; letter-spacing: 0.12em;
    padding-top: 8px;
    border-top: 1px solid rgba(74,222,128,0.25);
    text-align: right;
  }

  /* ============ Process ============ */
  .timeline { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
  .step { position: relative; padding-top: 36px; }
  .step::before {
    content: ""; position: absolute; top: 0; left: 0; right: 0;
    height: 2px; background: linear-gradient(to right, var(--accent-bright) 0%, var(--accent-bright) 40%, #262B27 40%, #262B27 100%);
  }
  .step::after {
    content: ""; position: absolute; top: -4px; left: 0;
    width: 10px; height: 10px; background: var(--accent-bright);
    box-shadow: 0 0 10px var(--accent-bright);
    border-radius: 50%;
  }
  .step .num {
    font: 500 11px/1 "JetBrains Mono", monospace;
    color: var(--accent-bright); text-transform: uppercase; letter-spacing: 0.16em;
    margin-bottom: 14px;
  }
  .step h4 { font: 700 20px/1.3 "Space Grotesk", sans-serif; color: #EAF1EA; margin: 0 0 10px; }
  .step p { font: 400 14px/1.6 "Inter", sans-serif; color: #8A938C; margin: 0; }
  .step .meta { font: 500 10px/1 "JetBrains Mono", monospace; color: #5a635c; text-transform: uppercase; letter-spacing: 0.16em; margin-top: 14px; }

  /* ============ Page chrome (sub-page heads) ============ */
  .page-head {
    padding: 80px 32px 64px;
    position: relative;
    background:
      radial-gradient(ellipse at 90% 50%, rgba(39,224,106,0.07), transparent 55%),
      linear-gradient(to right, rgba(39,224,106,var(--grid-opacity)) 1px, transparent 1px) 0 0 / 48px 48px,
      linear-gradient(to bottom, rgba(39,224,106,var(--grid-opacity)) 1px, transparent 1px) 0 0 / 48px 48px,
      #15191B;
    border-bottom: 1px solid #262B27;
    overflow: hidden;
  }
  .page-head .container { max-width: 1280px; margin: 0 auto; position: relative; z-index: 1; }
  .crumb {
    font: 500 11px/1 "JetBrains Mono", monospace;
    color: #5a635c; text-transform: uppercase; letter-spacing: 0.14em;
    margin-bottom: 28px;
    display: flex; align-items: center; gap: 12px;
  }
  .crumb a { color: #5a635c; border: 0; text-decoration: none; cursor: pointer; }
  .crumb a:hover { color: var(--accent-bright); }
  .crumb .sep { color: #262B27; }
  .crumb .cur { color: var(--accent-bright); }
  .page-head h1 {
    font: 700 56px/1.05 "Space Grotesk", sans-serif;
    letter-spacing: -0.025em; margin: 0 0 20px;
    max-width: 900px;
  }
  .page-head h1 .accent { color: var(--accent-bright); }
  .page-head .lede {
    font: 400 19px/1.6 "Inter", sans-serif;
    color: #8A938C; max-width: 680px; margin: 0;
  }

  /* ============ About styles ============ */
  .story {
    display: grid; grid-template-columns: 1fr 1.4fr; gap: 80px; align-items: start;
  }
  .story h2 { font: 700 38px/1.15 "Space Grotesk", sans-serif; margin: 0 0 24px; letter-spacing: -0.015em; }
  .story h2 .accent { color: var(--accent-bright); }
  .story .body p { font: 400 17px/1.7 "Inter", sans-serif; color: #8A938C; margin: 0 0 20px; }
  .story .body p:last-child { margin: 0; }
  .story .body strong { color: #EAF1EA; font-weight: 600; }

  .principles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
  .principle {
    position: relative;
    background: #1A1F1C;
    border: 1px solid #262B27;
    padding: 32px 28px;
    min-height: 260px;
    display: flex; flex-direction: column;
    transition: border-color 200ms;
  }
  .principle::before, .principle::after {
    content: ""; position: absolute; width: 14px; height: 14px;
    border: 2px solid var(--accent-bright);
    transition: width 200ms, height 200ms;
  }
  .principle::before { top: -1px; left: -1px; border-right: 0; border-bottom: 0; }
  .principle::after { bottom: -1px; right: -1px; border-left: 0; border-top: 0; }
  .principle:hover::before, .principle:hover::after { width: 20px; height: 20px; }
  .principle .pnum {
    font: 500 11px/1 "JetBrains Mono", monospace;
    color: var(--accent-bright); text-transform: uppercase; letter-spacing: 0.18em;
    margin-bottom: 28px;
  }
  .principle h3 {
    font: 700 22px/1.25 "Space Grotesk", sans-serif;
    color: #EAF1EA; margin: 0 0 12px;
  }
  .principle p {
    font: 400 14px/1.6 "Inter", sans-serif;
    color: #8A938C; margin: 0 0 auto;
  }
  .principle .footer-line {
    margin-top: 28px;
    font: 500 10px/1.4 "JetBrains Mono", monospace;
    color: #5a635c; text-transform: uppercase; letter-spacing: 0.14em;
    border-top: 1px solid #262B27; padding-top: 16px;
  }

  /* Team grid */
  .team-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
  .team-card {
    position: relative;
    background: #1A1F1C;
    border: 1px solid #262B27;
    padding: 0;
    overflow: hidden;
  }
  .team-card::before, .team-card::after {
    content: ""; position: absolute; width: 12px; height: 12px;
    border: 2px solid var(--accent-bright); z-index: 2;
  }
  .team-card::before { top: -1px; left: -1px; border-right: 0; border-bottom: 0; }
  .team-card::after { bottom: -1px; right: -1px; border-left: 0; border-top: 0; }
  .team-photo {
    aspect-ratio: 1; background: #0A0D0A;
    position: relative; overflow: hidden;
    border-bottom: 1px solid #262B27;
  }
  .team-photo .placeholder-grid {
    position: absolute; inset: 0;
    background:
      linear-gradient(to right, rgba(39,224,106,0.08) 1px, transparent 1px) 0 0 / 16px 16px,
      linear-gradient(to bottom, rgba(39,224,106,0.08) 1px, transparent 1px) 0 0 / 16px 16px,
      #15191B;
  }
  .team-photo .ph-icon {
    position: absolute; inset: 0;
    display: flex; align-items: center; justify-content: center;
    color: rgba(39,224,106,0.3); font-size: 64px;
  }
  .team-photo .ph-tag {
    position: absolute; top: 12px; right: 12px;
    font: 500 9px/1 "JetBrains Mono", monospace;
    color: var(--accent-bright); text-transform: uppercase; letter-spacing: 0.16em;
    background: rgba(6,33,15,0.8); padding: 5px 8px;
    border: 1px solid var(--accent);
  }
  .team-photo .ph-id {
    position: absolute; bottom: 12px; left: 12px;
    font: 500 9px/1 "JetBrains Mono", monospace;
    color: #5a635c; text-transform: uppercase; letter-spacing: 0.14em;
  }
  .team-info { padding: 18px 20px; }
  .team-info .name { font: 700 16px/1.3 "Space Grotesk", sans-serif; color: #EAF1EA; margin: 0; }
  .team-info .role { font: 500 11px/1.3 "JetBrains Mono", monospace; color: var(--accent-bright); text-transform: uppercase; letter-spacing: 0.14em; margin-top: 6px; }
  .team-info .specs { font: 400 12px/1.5 "Inter", sans-serif; color: #5a635c; margin-top: 10px; }

  /* DFW map */
  .map-section { background: #0A0D0A; }
  .map-wrap {
    position: relative;
    background: #15191B;
    border: 1px solid #262B27;
    aspect-ratio: 3 / 2;
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
    overflow: hidden;
  }
  .map-wrap::before, .map-wrap::after {
    content: ""; position: absolute; width: 16px; height: 16px;
    border: 2px solid var(--accent-bright); z-index: 5;
  }
  .map-wrap::before { top: -1px; left: -1px; border-right: 0; border-bottom: 0; }
  .map-wrap::after { bottom: -1px; right: -1px; border-left: 0; border-top: 0; }
  .map-wrap .map-grid {
    position: absolute; inset: 0;
    background:
      linear-gradient(to right, rgba(39,224,106,0.08) 1px, transparent 1px) 0 0 / 32px 32px,
      linear-gradient(to bottom, rgba(39,224,106,0.08) 1px, transparent 1px) 0 0 / 32px 32px;
  }
  .map-wrap svg { display: block; width: 100%; height: 100%; }
  .map-wrap .map-overlay {
    position: absolute; top: 24px; left: 24px;
    background: rgba(5,13,26,0.92); border: 1px solid #333A35;
    padding: 16px 20px; min-width: 240px;
  }
  .map-wrap .map-overlay::before {
    content: ""; position: absolute; top: -1px; left: -1px;
    width: 12px; height: 12px; border: 2px solid var(--accent-bright);
    border-right: 0; border-bottom: 0;
  }
  .map-wrap .map-overlay h4 {
    font: 500 10px/1 "JetBrains Mono", monospace;
    color: var(--accent-bright); text-transform: uppercase; letter-spacing: 0.18em;
    margin: 0 0 12px;
  }
  .map-wrap .map-overlay .row {
    display: flex; justify-content: space-between;
    font: 500 12px/1.6 "JetBrains Mono", monospace;
  }
  .map-wrap .map-overlay .row .k { color: #5a635c; }
  .map-wrap .map-overlay .row .v { color: #EAF1EA; font-feature-settings: "tnum"; }
  .map-wrap .map-overlay .row .v.ok { color: #4ade80; }
  .map-wrap .map-readout {
    position: absolute; bottom: 24px; right: 24px;
    background: rgba(5,13,26,0.92); border: 1px solid #333A35;
    padding: 12px 16px;
    font: 500 10px/1.4 "JetBrains Mono", monospace;
    color: #8A938C; text-transform: uppercase; letter-spacing: 0.14em;
  }
  .map-wrap .map-readout .pulse-dot {
    width: 6px; height: 6px; background: #4ade80; border-radius: 50%;
    box-shadow: 0 0 8px #4ade80; display: inline-block; margin-right: 8px;
    animation: pulse 2s infinite;
  }

  /* Map dots */
  .city-dot {
    fill: var(--accent-bright);
    filter: drop-shadow(0 0 4px var(--accent-bright));
  }
  .city-dot.hq {
    fill: #4ade80;
    filter: drop-shadow(0 0 8px #4ade80);
  }
  .city-pulse {
    fill: none; stroke: var(--accent-bright); stroke-width: 1;
    transform-origin: center;
    animation: ringpulse 2.6s ease-out infinite;
  }
  .city-pulse.hq { stroke: #4ade80; }
  @keyframes ringpulse {
    0% { r: 4; opacity: 0.8; }
    100% { r: 36; opacity: 0; }
  }

  /* Radar sweep */
  .radar-sweep {
    transform-origin: 0 0;
    animation: radarSpin 10s linear infinite;
  }
  @keyframes radarSpin {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
  }
  @media (prefers-reduced-motion: reduce) {
    .radar-sweep { animation: none; opacity: 0.35; }
  }

  /* ============ Contact page ============ */
  .contact-grid {
    display: grid; grid-template-columns: 1fr 1.2fr; gap: 64px;
    align-items: start;
  }
  .contact-info-panel {
    position: relative;
    background: #0A0D0A;
    border: 1px solid #333A35;
    padding: 36px;
  }
  .contact-info-panel::before, .contact-info-panel::after {
    content: ""; position: absolute; width: 16px; height: 16px;
    border: 2px solid var(--accent-bright);
  }
  .contact-info-panel::before { top: -1px; left: -1px; border-right: 0; border-bottom: 0; }
  .contact-info-panel::after { bottom: -1px; right: -1px; border-left: 0; border-top: 0; }
  .contact-info-panel .label {
    font: 500 10px/1 "JetBrains Mono", monospace;
    color: var(--accent-bright); text-transform: uppercase; letter-spacing: 0.18em;
    margin-bottom: 10px;
  }
  .contact-info-panel .v {
    font: 600 22px/1.3 "Space Grotesk", sans-serif;
    color: #EAF1EA; margin-bottom: 28px;
  }
  .contact-info-panel .v.mono { font-family: "JetBrains Mono", monospace; font-feature-settings: "tnum"; letter-spacing: 0.02em; }
  .contact-info-panel .v.small { font-size: 16px; line-height: 1.5; }
  .contact-info-panel .v a { color: #EAF1EA; border: 0; }
  .contact-info-panel .v a:hover { color: var(--accent-bright); }

  .form-card {
    position: relative;
    background: #1A1F1C;
    border: 1px solid #262B27;
    padding: 40px;
  }
  .form-card::before, .form-card::after {
    content: ""; position: absolute; width: 16px; height: 16px;
    border: 2px solid var(--accent-bright);
  }
  .form-card::before { top: -1px; left: -1px; border-right: 0; border-bottom: 0; }
  .form-card::after { bottom: -1px; right: -1px; border-left: 0; border-top: 0; }
  .form-card .head {
    display: flex; justify-content: space-between; align-items: center;
    margin-bottom: 28px;
    padding-bottom: 16px; border-bottom: 1px solid #262B27;
  }
  .form-card .head .t {
    font: 500 11px/1 "JetBrains Mono", monospace;
    color: var(--accent-bright); text-transform: uppercase; letter-spacing: 0.18em;
    display: flex; align-items: center; gap: 10px;
  }
  .form-card .head .t::before {
    content: ""; width: 6px; height: 6px; background: var(--accent-bright); border-radius: 50%;
    box-shadow: 0 0 8px var(--accent-bright);
  }
  .form-card .head .id { font: 500 10px/1 "JetBrains Mono", monospace; color: #5a635c; letter-spacing: 0.14em; }

  .form-row { margin-bottom: 18px; }
  .form-row.two { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 0; }
  .form-row.two > * { margin-bottom: 18px; }
  .form-row label {
    display: flex; align-items: center; justify-content: space-between;
    font: 500 10px/1 "JetBrains Mono", monospace;
    color: #8A938C; text-transform: uppercase; letter-spacing: 0.16em;
    margin-bottom: 8px;
  }
  .form-row label .req { color: var(--accent-bright); }
  .form-row input, .form-row textarea, .form-row select {
    display: block; width: 100%; box-sizing: border-box;
    padding: 12px 14px; min-height: 46px;
    background: #0A0D0A; color: #EAF1EA;
    font: 400 14px/1.5 "Inter", sans-serif;
    border: 1px solid #333A35; border-radius: 2px; outline: none;
    transition: border-color 120ms;
  }
  .form-row textarea { min-height: 120px; resize: vertical; font-family: "Inter", sans-serif; }
  .form-row input:focus, .form-row textarea:focus, .form-row select:focus {
    border-color: var(--accent-bright);
    box-shadow: 0 0 0 1px var(--accent-bright);
  }
  .form-row input::placeholder, .form-row textarea::placeholder { color: #5a635c; }
  .form-row.error input, .form-row.error textarea { border-color: #ef4444; }
  .form-row .err {
    font: 500 10px/1 "JetBrains Mono", monospace;
    color: #ef4444; text-transform: uppercase; letter-spacing: 0.14em;
    margin-top: 6px; display: none;
  }
  .form-row.error .err { display: block; }
  .form-row select {
    appearance: none; -webkit-appearance: none;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path d='M1 1L6 6L11 1' stroke='%23d4a73a' stroke-width='1.5' fill='none'/></svg>");
    background-repeat: no-repeat; background-position: right 14px center;
    padding-right: 36px;
  }

  .form-confirm {
    position: relative;
    background: rgba(74,222,128,0.08);
    border: 1px solid #4ade80;
    padding: 20px 24px;
    margin-bottom: 24px;
    display: none;
  }
  .form-confirm.show { display: block; animation: slidein 300ms ease-out; }
  @keyframes slidein { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: translateY(0); } }
  .form-confirm::before {
    content: ""; position: absolute; top: -1px; left: -1px;
    width: 12px; height: 12px; border: 2px solid #4ade80;
    border-right: 0; border-bottom: 0;
  }
  .form-confirm .h {
    font: 500 11px/1 "JetBrains Mono", monospace;
    color: #4ade80; text-transform: uppercase; letter-spacing: 0.16em;
    margin-bottom: 8px; display: flex; align-items: center; gap: 8px;
  }
  .form-confirm .b { font: 400 14px/1.55 "Inter", sans-serif; color: #EAF1EA; }
  .form-confirm .b strong { color: var(--accent-bright); font-weight: 500; }

  /* Scheduler */
  .scheduler {
    margin-top: 64px;
  }
  .scheduler-card {
    position: relative;
    background: #0A0D0A;
    border: 1px solid #333A35;
    padding: 0;
    overflow: hidden;
  }
  .scheduler-card::before, .scheduler-card::after {
    content: ""; position: absolute; width: 16px; height: 16px;
    border: 2px solid var(--accent-bright); z-index: 2;
  }
  .scheduler-card::before { top: -1px; left: -1px; border-right: 0; border-bottom: 0; }
  .scheduler-card::after { bottom: -1px; right: -1px; border-left: 0; border-top: 0; }
  .scheduler-head {
    padding: 24px 32px;
    border-bottom: 1px solid #262B27;
    display: flex; justify-content: space-between; align-items: center;
  }
  .scheduler-head .t {
    font: 700 22px/1.2 "Space Grotesk", sans-serif;
    color: #EAF1EA; margin: 0;
    letter-spacing: -0.01em;
  }
  .scheduler-head .sub {
    font: 500 11px/1 "JetBrains Mono", monospace;
    color: var(--accent-bright); text-transform: uppercase; letter-spacing: 0.14em;
    margin-top: 8px;
  }
  .scheduler-body { display: grid; grid-template-columns: 1.2fr 1fr; }
  .scheduler-cal {
    padding: 32px;
    border-right: 1px solid #262B27;
  }
  .cal-head {
    display: flex; justify-content: space-between; align-items: center;
    margin-bottom: 20px;
  }
  .cal-head .month {
    font: 600 14px/1 "JetBrains Mono", monospace;
    color: #EAF1EA; text-transform: uppercase; letter-spacing: 0.14em;
  }
  .cal-head .nav-btn {
    width: 28px; height: 28px;
    background: transparent; border: 1px solid #333A35;
    color: var(--accent-bright); cursor: pointer;
    display: inline-flex; align-items: center; justify-content: center;
    font: 500 12px/1 "JetBrains Mono", monospace;
  }
  .cal-head .nav-btn:hover { border-color: var(--accent-bright); background: rgba(39,224,106,0.08); }
  .cal-head .nav-grp { display: flex; gap: 8px; }
  .cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; }
  .cal-grid .dow {
    font: 500 9px/1 "JetBrains Mono", monospace;
    color: #5a635c; text-transform: uppercase; letter-spacing: 0.14em;
    text-align: center; padding: 6px 0; margin-bottom: 4px;
  }
  .cal-day {
    aspect-ratio: 1;
    background: transparent;
    border: 1px solid transparent;
    color: #8A938C;
    font: 500 13px/1 "JetBrains Mono", monospace; font-feature-settings: "tnum";
    cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    transition: all 120ms;
    position: relative;
  }
  .cal-day:hover:not(.disabled):not(.empty) {
    background: rgba(39,224,106,0.08);
    border-color: var(--accent);
    color: #EAF1EA;
  }
  .cal-day.empty { cursor: default; }
  .cal-day.disabled { color: #333A35; cursor: not-allowed; }
  .cal-day.today {
    color: var(--accent-bright);
    font-weight: 700;
  }
  .cal-day.today::before {
    content: ""; position: absolute; bottom: 4px; left: 50%; transform: translateX(-50%);
    width: 4px; height: 4px; background: var(--accent-bright); border-radius: 50%;
  }
  .cal-day.selected {
    background: var(--accent);
    border-color: var(--accent-bright);
    color: #06210F !important;
    font-weight: 700;
  }
  .cal-day.selected::before { background: #15191B; }

  .scheduler-times {
    padding: 32px;
    background: #15191B;
  }
  .scheduler-times .t-head {
    font: 500 11px/1 "JetBrains Mono", monospace;
    color: var(--accent-bright); text-transform: uppercase; letter-spacing: 0.16em;
    margin-bottom: 6px;
  }
  .scheduler-times .t-date {
    font: 600 16px/1.3 "Space Grotesk", sans-serif;
    color: #EAF1EA; margin-bottom: 24px;
  }
  .time-grid {
    display: grid; grid-template-columns: 1fr 1fr; gap: 8px;
    max-height: 220px; overflow-y: auto;
    padding-right: 8px;
  }
  .time-grid::-webkit-scrollbar { width: 6px; }
  .time-grid::-webkit-scrollbar-track { background: #0A0D0A; }
  .time-grid::-webkit-scrollbar-thumb { background: #333A35; }
  .time-slot {
    padding: 10px 12px;
    background: transparent;
    border: 1px solid #333A35;
    color: #EAF1EA;
    font: 500 12px/1 "JetBrains Mono", monospace; font-feature-settings: "tnum";
    cursor: pointer;
    text-align: center;
    transition: all 120ms;
  }
  .time-slot:hover { border-color: var(--accent-bright); background: rgba(39,224,106,0.08); }
  .time-slot.selected { background: var(--accent); border-color: var(--accent-bright); color: #06210F; font-weight: 700; }
  .time-slot.taken { opacity: 0.3; cursor: not-allowed; text-decoration: line-through; }
  .time-slot.taken:hover { border-color: #333A35; background: transparent; }

  .scheduler-confirm {
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px solid #262B27;
  }
  .scheduler-confirm .summary {
    font: 400 13px/1.6 "Inter", sans-serif;
    color: #8A938C; margin-bottom: 16px;
  }
  .scheduler-confirm .summary strong { color: #EAF1EA; font-weight: 500; }

  .booked-overlay {
    display: none;
    background: rgba(74,222,128,0.06);
    border: 1px solid #4ade80;
    padding: 24px;
    margin-top: 24px;
    position: relative;
  }
  .booked-overlay.show { display: block; animation: slidein 300ms ease-out; }
  .booked-overlay::before {
    content: ""; position: absolute; top: -1px; left: -1px;
    width: 12px; height: 12px; border: 2px solid #4ade80;
    border-right: 0; border-bottom: 0;
  }
  .booked-overlay .h {
    font: 500 11px/1 "JetBrains Mono", monospace;
    color: #4ade80; text-transform: uppercase; letter-spacing: 0.16em;
    margin-bottom: 10px;
    display: flex; align-items: center; gap: 8px;
  }
  .booked-overlay .h::before {
    content: ""; width: 6px; height: 6px; background: #4ade80; border-radius: 50%;
    box-shadow: 0 0 8px #4ade80;
  }
  .booked-overlay .b { font: 400 14px/1.6 "Inter", sans-serif; color: #EAF1EA; }
  .booked-overlay .b strong { color: var(--accent-bright); font-weight: 500; }

  /* ============ CTA strip ============ */
  .cta-strip {
    padding: 72px 32px;
    background: #0A0D0A;
    border-top: 1px solid #262B27; border-bottom: 1px solid #262B27;
    position: relative;
  }
  .cta-strip::before {
    content: ""; position: absolute; inset: 0;
    background:
      linear-gradient(to right, rgba(39,224,106,0.06) 1px, transparent 1px) 0 0 / 48px 48px,
      linear-gradient(to bottom, rgba(39,224,106,0.06) 1px, transparent 1px) 0 0 / 48px 48px;
  }
  .cta-strip .container { display: grid; grid-template-columns: 1.5fr 1fr; gap: 48px; align-items: center; position: relative; z-index: 1; }
  .cta-strip h2 { font: 700 36px/1.15 "Space Grotesk", sans-serif; color: #EAF1EA; margin: 0; letter-spacing: -0.015em; }
  .cta-strip h2 .accent { color: var(--accent-bright); }
  .cta-strip .actions { display: flex; gap: 12px; justify-content: flex-end; flex-wrap: wrap; }

  /* ============ Footer ============ */
  footer { background: #0A0D0A; padding: 80px 32px 32px; border-top: 1px solid #262B27; }
  .foot-grid {
    max-width: 1280px; margin: 0 auto;
    display: grid; grid-template-columns: 1.5fr 1fr 1fr 1.2fr 1fr;
    gap: 48px; padding-bottom: 56px;
    border-bottom: 1px solid #262B27;
  }
  .foot-col h5 {
    font: 500 11px/1 "JetBrains Mono", monospace;
    color: var(--accent-bright); text-transform: uppercase; letter-spacing: 0.18em;
    margin: 0 0 20px;
  }
  .foot-col a, .foot-col span.foot-line {
    display: block; color: #8A938C;
    font: 400 14px/1.8 "Inter", sans-serif;
    text-decoration: none; border: 0; padding: 2px 0;
    cursor: pointer;
  }
  .foot-col a:hover { color: var(--accent-bright); }
  .foot-col p { font: 400 13px/1.6 "Inter", sans-serif; color: #8A938C; margin: 16px 0 0; max-width: 280px; }
  .foot-col img { height: 42px; }
  .foot-bot {
    max-width: 1280px; margin: 0 auto; padding-top: 24px;
    display: flex; justify-content: space-between; gap: 24px; flex-wrap: wrap;
    font: 500 11px/1.5 "JetBrains Mono", monospace;
    color: #5a635c; text-transform: uppercase; letter-spacing: 0.14em;
  }
  .badge-status {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 6px 10px;
    background: rgba(74,222,128,0.08);
    border: 1px solid rgba(74,222,128,0.4);
    color: #4ade80;
    font: 500 10px/1 "JetBrains Mono", monospace;
    text-transform: uppercase; letter-spacing: 0.14em;
  }
  .badge-status::before {
    content: ""; width: 6px; height: 6px; background: #4ade80; border-radius: 50%;
    box-shadow: 0 0 8px #4ade80; animation: pulse 2s infinite;
  }

  /* Page switching */
  .page { display: none; }
  /* No persisted transform after entry — a transformed ancestor would trap position:fixed
     modals (they'd anchor to .page instead of the viewport and scroll away). */
  .page.active { display: block; animation: pagein 240ms ease-out; }
  @keyframes pagein { from { opacity: 0.4; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }

  /* Responsive */
  @media (max-width: 1024px) {
    .hero-inner { grid-template-columns: 1fr; gap: 48px; }
    .stats-grid { grid-template-columns: 1fr 1fr; }
    .ind-grid { grid-template-columns: repeat(3, 1fr); }
    .timeline { grid-template-columns: 1fr 1fr; }
    .principles { grid-template-columns: 1fr; }
    .team-grid { grid-template-columns: 1fr 1fr; }
    .story { grid-template-columns: 1fr; gap: 32px; }
    .contact-grid { grid-template-columns: 1fr; }
    .scheduler-body { grid-template-columns: 1fr; }
    .foot-grid { grid-template-columns: 1fr 1fr; }
    .section-head { grid-template-columns: 1fr; }
    .cta-strip .container { grid-template-columns: 1fr; }
    .cta-strip .actions { justify-content: flex-start; }
    .hero h1, .page-head h1 { font-size: 40px; }
    .util .grp:last-child { display: none; }
    .nav .links a { padding: 10px 12px; }
    .svc-row { grid-template-columns: 1fr; gap: 20px; }
    .svc-row .meta { text-align: left; }
  }
  @media (max-width: 640px) {
    section, .page-head { padding: 64px 20px; }
    .nav { padding: 0 16px; gap: 16px; }
    .nav .links { display: none; }
    .nav .phone { display: none; }
    .ind-grid { grid-template-columns: 1fr 1fr; }
    .timeline { grid-template-columns: 1fr; }
    .stats-grid { grid-template-columns: 1fr; }
    .form-row.two { grid-template-columns: 1fr; }
    .hero h1, .page-head h1 { font-size: 32px; }
    .foot-grid { grid-template-columns: 1fr; gap: 32px; }
    .util { padding: 0 16px; }
  }

  /* ============================================================
     SERVICE PAGES · Managed IT (full) · Co-Managed · Automation
     ============================================================ */

  /* Page-head shared bits */
  .ph-eyebrow {
    font: 500 11px/1 "JetBrains Mono", monospace;
    color: var(--accent-bright); text-transform: uppercase; letter-spacing: 0.18em;
    margin-bottom: 24px;
  }
  .ph-cta { display: flex; gap: 12px; margin-top: 36px; flex-wrap: wrap; }

  /* ---- Page hero with side visual ---- */
  .page-hero-grid { display: grid; grid-template-columns: 1.05fr 0.95fr; gap: 56px; align-items: center; margin-top: 4px; }
  .page-hero-viz { min-width: 0; }
  .page-viz-console { max-width: 520px; margin-left: auto; }
  @media (max-width: 1000px) {
    .page-hero-grid { grid-template-columns: 1fr; gap: 40px; }
    .page-hero-viz { display: none; }
  }

  /* ---- Diagram visuals (Co-Managed / Automation) ---- */
  .viz-body { padding: 20px 22px 16px; }
  .viz-svg { display: block; width: 100%; height: auto; }
  .viz-lbl { font: 600 9px/1 "JetBrains Mono", monospace; fill: #8A938C; letter-spacing: 2px; }
  .viz-lbl-r { fill: var(--accent-bright); }
  .viz-lbl-c { font: 500 8.5px/1 "JetBrains Mono", monospace; fill: #5a635c; letter-spacing: 1.5px; }
  .viz-line { stroke: #333A35; stroke-width: 1.4; }
  .viz-flow { stroke-dasharray: 3 6; animation: vizFlow 1s linear infinite; }
  @keyframes vizFlow { to { stroke-dashoffset: -18; } }
  .viz-travel { fill: var(--accent-bright); filter: drop-shadow(0 0 4px var(--accent-bright)); }
  .viz-travel-g { fill: #4ade80; filter: drop-shadow(0 0 4px #4ade80); }
  .viz-node { fill: #15191B; stroke: #EAF1EA; stroke-width: 1.5; }
  .viz-node-g { stroke: var(--accent-bright); }
  .viz-ring { fill: none; stroke: #EAF1EA; stroke-width: 1; opacity: 0.5; transform-box: fill-box; transform-origin: center; animation: vizPulse 2.6s ease-out infinite; }
  .viz-ring-g { stroke: var(--accent-bright); }
  @keyframes vizPulse { 0% { transform: scale(1); opacity: 0.6; } 100% { transform: scale(2.2); opacity: 0; } }
  .viz-hub-bg { fill: rgba(39,224,106,0.12); }
  .viz-hub { fill: none; stroke: var(--accent-bright); stroke-width: 1.5; }
  .viz-hub-ic { font: 700 13px/1 "JetBrains Mono", monospace; fill: var(--accent-bright); }
  .viz-box { fill: #15191B; }
  .viz-box-br { fill: none; stroke: var(--accent); stroke-width: 1.2; }
  .viz-boxnum { font: 700 16px/1 "JetBrains Mono", monospace; fill: var(--accent-bright); }
  .viz-step { font: 600 8.5px/1 "JetBrains Mono", monospace; fill: #8A938C; letter-spacing: 1.5px; }
  @media (prefers-reduced-motion: reduce) {
    .viz-flow, .viz-ring, .viz-travel animateMotion { animation: none; }
  }

  /* ---- Full service blocks (Services page) ---- */
  .svc-full {
    display: grid; grid-template-columns: 88px 1fr; gap: 36px;
    padding: 52px 0; border-top: 1px solid #262B27; align-items: start;
    transition: background 200ms;
  }
  .svc-full:hover { background: linear-gradient(to right, rgba(39,224,106,0.04), transparent 60%); }
  .svc-full:last-child { border-bottom: 1px solid #262B27; }
  .svc-full-rail { display: flex; flex-direction: column; align-items: center; gap: 14px; }
  .svc-full-ic {
    position: relative; width: 64px; height: 64px;
    background: rgba(39,224,106,0.1); border: 1px solid var(--accent);
    display: flex; align-items: center; justify-content: center;
    color: var(--accent-bright); font-size: 24px;
  }
  .svc-full-ic::before, .svc-full-ic::after {
    content: ""; position: absolute; width: 8px; height: 8px; border: 2px solid var(--accent-bright);
  }
  .svc-full-ic::before { top: -1px; left: -1px; border-right: 0; border-bottom: 0; }
  .svc-full-ic::after { bottom: -1px; right: -1px; border-left: 0; border-top: 0; }
  .svc-full-num {
    font: 700 22px/1 "JetBrains Mono", monospace; color: var(--accent-bright);
    font-feature-settings: "tnum"; letter-spacing: -0.02em;
  }
  .svc-full-tag {
    font: 500 11px/1 "JetBrains Mono", monospace; color: var(--accent-bright);
    text-transform: uppercase; letter-spacing: 0.18em; display: block; margin-bottom: 14px;
  }
  .svc-full-body h3 {
    font: 700 30px/1.15 "Space Grotesk", sans-serif; color: #EAF1EA; margin: 0 0 16px;
    letter-spacing: -0.015em;
  }
  .svc-full-lede {
    font: 400 16px/1.65 "Inter", sans-serif; color: #8A938C; margin: 0 0 28px; max-width: 760px;
  }
  .svc-full-list {
    list-style: none; padding: 0; margin: 0 0 28px;
    display: grid; grid-template-columns: 1fr 1fr; gap: 14px 40px;
  }
  .svc-full-list li {
    font: 400 14px/1.5 "Inter", sans-serif; color: #EAF1EA;
    padding-left: 26px; position: relative;
  }
  .svc-full-list li::before {
    content: ""; position: absolute; left: 0; top: 8px; width: 14px; height: 1px; background: var(--accent-bright);
  }
  .svc-full-list li::after {
    content: ""; position: absolute; left: 12px; top: 6px; width: 4px; height: 4px;
    background: var(--accent-bright); transform: rotate(45deg);
  }
  .svc-full-meta { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
  .svc-full-pill {
    display: inline-block; padding: 5px 10px;
    background: rgba(74,222,128,0.1); border: 1px solid rgba(74,222,128,0.4); color: #4ade80;
    font: 500 10px/1 "JetBrains Mono", monospace; text-transform: uppercase; letter-spacing: 0.14em;
  }
  .svc-full-metric {
    font: 500 10px/1 "JetBrains Mono", monospace; color: #5a635c;
    text-transform: uppercase; letter-spacing: 0.14em;
  }
  .svc-full-metric b { color: var(--accent-bright); font-weight: 700; }

  /* ---- Shared service CTA band ---- */
  .svc-cta-grid {
    display: grid; grid-template-columns: 1.4fr 1fr; gap: 64px; align-items: center;
  }
  .svc-cta-eye {
    font: 500 11px/1 "JetBrains Mono", monospace; color: var(--accent-bright);
    text-transform: uppercase; letter-spacing: 0.18em; margin-bottom: 20px;
  }
  .svc-cta-h {
    font: 700 44px/1.1 "Space Grotesk", sans-serif; color: #EAF1EA;
    letter-spacing: -0.025em; margin: 0 0 20px;
  }
  .svc-cta-h .accent { color: var(--accent-bright); }
  .svc-cta-p { font: 400 17px/1.65 "Inter", sans-serif; color: #8A938C; margin: 0; max-width: 560px; }
  .svc-cta-actions { display: flex; flex-direction: column; gap: 12px; }
  .svc-cta-call {
    font: 500 12px/1 "JetBrains Mono", monospace; color: #5a635c; text-align: center;
    letter-spacing: 0.14em; text-decoration: none; padding: 14px; border: 1px solid #262B27;
    text-transform: uppercase;
  }
  .svc-cta-call:hover { color: var(--accent-bright); border-color: var(--accent); }

  /* ---- Co-Managed: intro ---- */
  .comgr-intro { display: grid; grid-template-columns: 0.8fr 1.2fr; gap: 56px; align-items: start; }
  .comgr-h { font: 700 38px/1.15 "Space Grotesk", sans-serif; color: #EAF1EA; margin: 0; letter-spacing: -0.015em; }
  .comgr-p { font: 400 17px/1.75 "Inter", sans-serif; color: #8A938C; margin: 0; }
  .comgr-p strong { color: #EAF1EA; font-weight: 600; }

  /* ---- Co-Managed: division of labor ---- */
  .collab-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 48px; }
  .collab-col {
    position: relative; background: #1A1F1C; border: 1px solid #262B27; padding: 32px 28px;
    display: flex; flex-direction: column;
  }
  .collab-col.collab-shared { background: #0A0D0A; border-color: #333A35; }
  .collab-col::before, .collab-col::after {
    content: ""; position: absolute; width: 14px; height: 14px; border: 2px solid var(--accent-bright);
  }
  .collab-col::before { top: -1px; left: -1px; border-right: 0; border-bottom: 0; }
  .collab-col::after { bottom: -1px; right: -1px; border-left: 0; border-top: 0; }
  .collab-ic {
    width: 48px; height: 48px; border: 1px solid var(--accent); background: rgba(39,224,106,0.08);
    display: flex; align-items: center; justify-content: center; color: var(--accent-bright);
    font-size: 20px; margin-bottom: 22px;
  }
  .collab-shared .collab-ic { color: #4ade80; border-color: rgba(74,222,128,0.5); background: rgba(74,222,128,0.08); }
  .collab-head {
    font: 600 12px/1 "JetBrains Mono", monospace; color: var(--accent-bright);
    text-transform: uppercase; letter-spacing: 0.16em; margin-bottom: 20px;
    padding-bottom: 16px; border-bottom: 1px solid #262B27;
  }
  .collab-shared .collab-head { color: #4ade80; }
  .collab-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 14px; }
  .collab-list li {
    font: 400 14px/1.5 "Inter", sans-serif; color: #EAF1EA; padding-left: 26px; position: relative;
  }
  .collab-list li::before {
    content: ""; position: absolute; left: 0; top: 8px; width: 14px; height: 1px; background: var(--accent-bright);
  }
  .collab-list li::after {
    content: ""; position: absolute; left: 12px; top: 6px; width: 4px; height: 4px;
    background: var(--accent-bright); transform: rotate(45deg);
  }
  .collab-shared .collab-list li::before { background: #4ade80; }
  .collab-shared .collab-list li::after { background: #4ade80; }

  /* ---- Automation: type cards ---- */
  .auto-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-top: 48px; }
  .auto-card {
    position: relative; background: #1A1F1C; border: 1px solid #262B27; padding: 28px 24px;
    display: flex; flex-direction: column; transition: border-color 200ms, transform 200ms;
  }
  .auto-card::before, .auto-card::after {
    content: ""; position: absolute; width: 12px; height: 12px; border: 2px solid var(--accent-bright);
    transition: width 200ms, height 200ms;
  }
  .auto-card::before { top: -1px; left: -1px; border-right: 0; border-bottom: 0; }
  .auto-card::after { bottom: -1px; right: -1px; border-left: 0; border-top: 0; }
  .auto-card:hover { border-color: var(--accent); transform: translateY(-2px); }
  .auto-card:hover::before, .auto-card:hover::after { width: 18px; height: 18px; }
  .auto-card-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; }
  .auto-ic {
    width: 46px; height: 46px; border: 1px solid var(--accent); background: rgba(39,224,106,0.08);
    display: flex; align-items: center; justify-content: center; color: var(--accent-bright); font-size: 19px;
  }
  .auto-num { font: 700 18px/1 "JetBrains Mono", monospace; color: #5a635c; font-feature-settings: "tnum"; }
  .auto-card h3 { font: 700 18px/1.25 "Space Grotesk", sans-serif; color: #EAF1EA; margin: 0 0 10px; letter-spacing: -0.01em; }
  .auto-d { font: 400 13px/1.55 "Inter", sans-serif; color: #8A938C; margin: 0 0 18px; }
  .auto-ex { list-style: none; padding: 16px 0 0; margin: 0; border-top: 1px solid #262B27; display: flex; flex-direction: column; gap: 10px; }
  .auto-ex li { font: 400 12.5px/1.5 "Inter", sans-serif; color: #c2cfe3; padding-left: 18px; position: relative; }
  .auto-ex li::before {
    content: ""; position: absolute; left: 0; top: 7px; width: 5px; height: 5px;
    background: var(--accent-bright); transform: rotate(45deg);
  }

  /* ---- Automation: tools row ---- */
  .auto-tools {
    margin-top: 48px; padding: 28px 32px; background: #0A0D0A; border: 1px solid #262B27;
    display: flex; align-items: center; gap: 28px; flex-wrap: wrap;
  }
  .auto-tools-lab {
    font: 500 10px/1 "JetBrains Mono", monospace; color: #5a635c;
    text-transform: uppercase; letter-spacing: 0.18em; flex-shrink: 0;
  }
  .auto-tools-row { display: flex; gap: 10px; flex-wrap: wrap; }
  .auto-tool {
    font: 500 12px/1 "JetBrains Mono", monospace; color: #EAF1EA;
    padding: 9px 14px; border: 1px solid #333A35; background: rgba(44,70,117,0.15);
    letter-spacing: 0.04em;
  }

  /* ---- Responsive ---- */
  @media (max-width: 1080px) {
    .auto-grid { grid-template-columns: repeat(2, 1fr); }
  }
  @media (max-width: 900px) {
    .collab-grid { grid-template-columns: 1fr; }
    .comgr-intro { grid-template-columns: 1fr; gap: 24px; }
    .svc-cta-grid { grid-template-columns: 1fr; gap: 32px; }
    .principles[style] { grid-template-columns: 1fr !important; }
  }
  @media (max-width: 760px) {
    .svc-full { grid-template-columns: 1fr; gap: 20px; }
    .svc-full-rail { flex-direction: row; gap: 18px; }
    .svc-full-list { grid-template-columns: 1fr; }
    .svc-cta-h, .comgr-h { font-size: 30px; }
  }
  @media (max-width: 560px) {
    .auto-grid { grid-template-columns: 1fr; }
  }

  /* ============================================================
     CONTACT · DISCOVERY QUESTIONNAIRE
     ============================================================ */
  .discovery {
    margin: 26px 0 22px;
    padding-top: 26px;
    border-top: 1px solid #262B27;
  }
  .discovery-head { margin-bottom: 22px; }
  .discovery-head .dh-eye {
    font: 500 10px/1 "JetBrains Mono", monospace;
    color: var(--accent-bright); text-transform: uppercase; letter-spacing: 0.18em;
    display: flex; align-items: center; gap: 12px; margin-bottom: 12px;
  }
  .discovery-head .dh-eye::before { content: ""; width: 24px; height: 1px; background: var(--accent-bright); }
  .discovery-head .dh-sub {
    font: 400 13px/1.6 "Inter", sans-serif; color: #8A938C; margin: 0; max-width: 460px;
  }
  .qn {
    position: relative;
    padding: 18px 0 4px 44px;
  }
  .qn + .qn { margin-top: 6px; }
  .qn .qn-num {
    position: absolute; left: 0; top: 18px;
    width: 28px; height: 28px;
    border: 1px solid var(--accent);
    background: rgba(39,224,106,0.08);
    color: var(--accent-bright);
    font: 700 11px/1 "JetBrains Mono", monospace; font-feature-settings: "tnum";
    display: flex; align-items: center; justify-content: center;
    letter-spacing: 0.04em;
  }
  .qn .qn-q {
    display: block;
    font: 600 15px/1.4 "Space Grotesk", sans-serif;
    color: #EAF1EA; letter-spacing: -0.005em;
    margin-bottom: 4px;
  }
  .qn .qn-q .req { color: var(--accent-bright); font-family: "JetBrains Mono", monospace; }
  .qn .qn-q .opt { font: 500 9px/1 "JetBrains Mono", monospace; color: #5a635c; letter-spacing: 0.16em; text-transform: uppercase; margin-left: 8px; vertical-align: middle; }
  .qn .qn-hint {
    font: 400 12px/1.55 "Inter", sans-serif; color: #5a635c; margin: 0 0 12px;
  }
  .qn textarea {
    display: block; width: 100%; box-sizing: border-box;
    padding: 12px 14px; min-height: 88px; resize: vertical;
    background: #15191B; border: 1px solid #333A35; border-radius: 2px;
    color: #EAF1EA; font: 400 14px/1.5 "Inter", sans-serif;
    transition: border-color 120ms, box-shadow 120ms;
  }
  .qn textarea::placeholder { color: #5a635c; }
  .qn textarea:focus { border-color: var(--accent-bright); box-shadow: 0 0 0 1px var(--accent-bright); outline: none; }
  .qn.error textarea { border-color: #ef4444; }
  .qn .err {
    font: 500 10px/1 "JetBrains Mono", monospace;
    color: #ef4444; text-transform: uppercase; letter-spacing: 0.14em;
    margin-top: 6px; display: none;
  }
  .qn.error .err { display: block; }

  /* ============================================================
     KNOWLEDGE BASE
     ============================================================ */
  .kb-search {
    position: relative; display: flex; align-items: center;
    margin-top: 36px; max-width: 760px;
    background: #0A0D0A; border: 1px solid #333A35;
    transition: border-color 120ms, box-shadow 120ms;
  }
  .kb-search:focus-within { border-color: var(--accent-bright); box-shadow: 0 0 0 1px var(--accent-bright); }
  .kb-search-ic { position: absolute; left: 20px; color: var(--accent-bright); font-size: 16px; pointer-events: none; }
  .kb-search input {
    flex: 1; min-width: 0; background: transparent; border: 0; outline: none;
    padding: 20px 16px 20px 52px;
    color: #EAF1EA; font: 400 17px/1.3 "Inter", sans-serif;
  }
  .kb-search input::placeholder { color: #5a635c; }
  .kb-search-clear {
    background: transparent; border: 0; cursor: pointer; color: #5a635c;
    padding: 8px; font-size: 15px; transition: color 120ms;
  }
  .kb-search-clear:hover { color: var(--accent-bright); }
  .kb-search-btn { height: 100%; border-radius: 0; align-self: stretch; padding: 0 22px; white-space: nowrap; }
  @media (max-width: 560px) { .kb-search-btn span, .kb-search-btn { display: none; } }

  .kb-popular { display: flex; align-items: center; gap: 16px; margin-top: 20px; flex-wrap: wrap; }
  .kb-popular-lab {
    font: 500 10px/1 "JetBrains Mono", monospace; color: #5a635c;
    text-transform: uppercase; letter-spacing: 0.18em;
  }
  .kb-chips { display: flex; gap: 8px; flex-wrap: wrap; }
  .kb-chip {
    background: rgba(39,224,106,0.06); border: 1px solid #333A35; color: #c2cfe3;
    padding: 8px 14px; border-radius: 999px; cursor: pointer;
    font: 400 13px/1 "Inter", sans-serif; transition: border-color 120ms, color 120ms, background 120ms;
  }
  .kb-chip:hover { border-color: var(--accent-bright); color: var(--accent-bright); background: rgba(39,224,106,0.08); }

  .kb-head-cta { display: flex; align-items: center; gap: 20px; margin-top: 32px; flex-wrap: wrap; }
  .kb-count-note {
    font: 500 11px/1 "JetBrains Mono", monospace; color: #5a635c;
    text-transform: uppercase; letter-spacing: 0.12em;
  }

  /* Audience segmented control */
  .kb-seg {
    display: inline-flex; background: #0A0D0A; border: 1px solid #333A35;
    padding: 4px; gap: 4px; margin: 34px 0 14px;
  }
  .kb-seg-btn {
    display: inline-flex; align-items: center; gap: 9px;
    background: transparent; border: 0; cursor: pointer; padding: 12px 20px;
    color: #8A938C; font: 600 12px/1 "Inter", sans-serif;
    text-transform: uppercase; letter-spacing: 0.1em;
    transition: background 120ms, color 120ms;
  }
  .kb-seg-btn i { font-size: 12px; }
  .kb-seg-btn .kb-seg-c {
    font: 700 10px/1 "JetBrains Mono", monospace; padding: 3px 6px;
    border: 1px solid #333A35; color: #5a635c;
  }
  .kb-seg-btn:hover { color: #EAF1EA; }
  .kb-seg-btn.active { background: var(--accent); color: #06210F; }
  .kb-seg-btn.active .kb-seg-c { border-color: rgba(6,33,15,0.3); color: #06210F; }
  .kb-seg-note { font: 400 13px/1.5 "Inter", sans-serif; color: #5a635c; margin: 0 0 4px; max-width: 580px; }

  /* Landing chooser — two library buttons */
  .kb-choose { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 36px; max-width: 1080px; }
  .kb-choice {
    position: relative; text-align: left; cursor: pointer;
    background: #1A1F1C; border: 1px solid #262B27; padding: 34px 32px 26px;
    display: flex; flex-direction: column; transition: border-color 200ms, transform 200ms;
  }
  .kb-choice::before, .kb-choice::after {
    content: ""; position: absolute; width: 14px; height: 14px; border: 2px solid var(--accent-bright);
    opacity: 0; transition: opacity 200ms;
  }
  .kb-choice::before { top: -1px; left: -1px; border-right: 0; border-bottom: 0; }
  .kb-choice::after { bottom: -1px; right: -1px; border-left: 0; border-top: 0; }
  .kb-choice:hover { border-color: var(--accent); transform: translateY(-3px); }
  .kb-choice:hover::before, .kb-choice:hover::after { opacity: 1; }
  .kb-choice-tag {
    position: absolute; top: 16px; right: 16px;
    display: inline-flex; align-items: center; gap: 5px; padding: 5px 9px; border-radius: 3px;
    font: 600 9px/1 "JetBrains Mono", monospace; letter-spacing: 0.1em;
  }
  .kb-choice-tag i { font-size: 8px; }
  .kb-choice-tag.is-client { color: var(--accent-bright); background: rgba(39,224,106,0.1); border: 1px solid rgba(39,224,106,0.4); }
  .kb-choice-tag.is-free { color: #4ade80; background: rgba(74,222,128,0.1); border: 1px solid rgba(74,222,128,0.4); }
  .kb-choice-ic {
    width: 56px; height: 56px; border: 1px solid var(--accent); background: rgba(39,224,106,0.08);
    display: flex; align-items: center; justify-content: center; color: var(--accent-bright); font-size: 24px; margin-bottom: 22px;
  }
  .kb-choice h3 { font: 700 26px/1.15 "Space Grotesk", sans-serif; color: #EAF1EA; margin: 0 0 12px; letter-spacing: -0.02em; }
  .kb-choice p { font: 400 14px/1.6 "Inter", sans-serif; color: #8A938C; margin: 0 0 24px; flex: 1; }
  .kb-choice-foot {
    display: flex; align-items: center; justify-content: space-between; padding-top: 18px; border-top: 1px solid #262B27;
    font: 500 11px/1 "JetBrains Mono", monospace; color: #5a635c; letter-spacing: 0.12em; text-transform: uppercase;
  }
  .kb-choice-go { color: var(--accent-bright); display: inline-flex; align-items: center; gap: 8px; }
  .kb-choice-go i { transition: transform 160ms; }
  .kb-choice:hover .kb-choice-go i { transform: translateX(4px); }
  @media (max-width: 980px) { .kb-choose { grid-template-columns: 1fr 1fr; } }
  @media (max-width: 680px) { .kb-choose { grid-template-columns: 1fr; } }

  /* Colored card variants + faint glow */
  .kb-choice-green { border-color: rgba(74,222,128,0.5); box-shadow: 0 0 20px rgba(74,222,128,0.16); }
  .kb-choice-green:hover { border-color: #4ade80; box-shadow: 0 0 30px rgba(74,222,128,0.3); }
  .kb-choice-green .kb-choice-ic { border-color: rgba(74,222,128,0.6); background: rgba(74,222,128,0.08); color: #4ade80; }
  .kb-choice-green .kb-choice-go { color: #4ade80; }
  .kb-choice-green::before, .kb-choice-green::after { border-color: #4ade80; }

  .kb-choice-blue { border-color: rgba(79,155,245,0.5); box-shadow: 0 0 20px rgba(79,155,245,0.16); }
  .kb-choice-blue:hover { border-color: #4f9bf5; box-shadow: 0 0 30px rgba(79,155,245,0.32); }
  .kb-choice-blue .kb-choice-ic { border-color: rgba(79,155,245,0.6); background: rgba(79,155,245,0.1); color: #6fb0ff; }
  .kb-choice-blue .kb-choice-go { color: #6fb0ff; }
  .kb-choice-blue::before, .kb-choice-blue::after { border-color: #6fb0ff; }

  .kb-choice-gold { border-color: rgba(39,224,106,0.5); box-shadow: 0 0 20px rgba(39,224,106,0.16); }
  .kb-choice-gold:hover { border-color: var(--accent-bright); box-shadow: 0 0 30px rgba(39,224,106,0.3); }
  .kb-choice-gold .kb-choice-ic { color: var(--accent-bright); }

  .kb-choice-tag.is-blue { color: #6fb0ff; background: rgba(79,155,245,0.1); border: 1px solid rgba(79,155,245,0.4); }

  /* Library switcher (after a library is chosen) */
  .kb-switch { display: flex; align-items: center; gap: 16px; margin: 34px 0 12px; flex-wrap: wrap; }
  .kb-switch .kb-seg { margin: 0; }
  .kb-back {
    background: transparent; border: 1px solid #262B27; color: #8A938C; cursor: pointer;
    padding: 12px 16px; display: inline-flex; align-items: center; gap: 8px;
    font: 500 11px/1 "JetBrains Mono", monospace; text-transform: uppercase; letter-spacing: 0.12em;
    transition: border-color 120ms, color 120ms;
  }
  .kb-back:hover { border-color: var(--accent); color: var(--accent-bright); }
  .kb-reveal { animation: kbReveal 280ms ease-out both; }
  @keyframes kbReveal { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
  @media (max-width: 560px) {
    .kb-seg { display: flex; width: 100%; }
    .kb-seg-btn { flex: 1; justify-content: center; padding: 12px 8px; }
    .kb-seg-btn .kb-seg-c { display: none; }
  }

  /* Article badges (client vs free) */
  .kb-art-badge {
    display: inline-flex; align-items: center; gap: 5px; padding: 3px 8px; border-radius: 3px;
    font: 600 9px/1 "JetBrains Mono", monospace; letter-spacing: 0.1em;
  }
  .kb-art-badge i { font-size: 8px; }
  .kb-art-badge.is-client { color: var(--accent-bright); background: rgba(39,224,106,0.1); border: 1px solid rgba(39,224,106,0.4); }
  .kb-art-badge.is-free { color: #4ade80; background: rgba(74,222,128,0.1); border: 1px solid rgba(74,222,128,0.4); }

  /* Public guide rows (with summary) */
  .kb-art-public { align-items: flex-start; }
  .kb-art-public .kb-art-ic { margin-top: 2px; }
  .kb-art-public .kb-art-arrow { align-self: center; }
  .kb-art-sum { font: 400 13.5px/1.6 "Inter", sans-serif; color: #8A938C; margin: 8px 0 12px; max-width: 760px; }

  /* Public reader modal */
  .kb-reader { max-width: 560px; }
  .kb-reader-meta {
    display: flex; gap: 8px; align-items: center; margin-bottom: 18px;
    font: 500 11px/1 "JetBrains Mono", monospace; color: #5a635c; text-transform: uppercase; letter-spacing: 0.1em;
  }
  .kb-reader-lead { font: 400 16px/1.7 "Inter", sans-serif; color: #c2cfe3; margin: 0 0 20px; }
  .kb-reader-note {
    display: flex; gap: 12px; align-items: flex-start;
    background: #0A0D0A; border: 1px solid #262B27; padding: 14px 16px;
    font: 400 13px/1.55 "Inter", sans-serif; color: #8A938C;
  }
  .kb-reader-note i { color: var(--accent-bright); margin-top: 2px; }
  .kb-steps { counter-reset: kbs; list-style: none; padding: 0; margin: 0 0 22px; display: flex; flex-direction: column; gap: 14px; }
  .kb-steps li { counter-increment: kbs; position: relative; padding-left: 42px; font: 400 14.5px/1.6 "Inter", sans-serif; color: #c2cfe3; }
  .kb-steps li::before { content: counter(kbs); position: absolute; left: 0; top: 0; width: 28px; height: 28px; border: 1px solid var(--accent); background: rgba(39,224,106,0.08); color: var(--accent-bright); font: 700 12px/28px "JetBrains Mono", monospace; text-align: center; }
  .kb-teaser { position: relative; max-height: 84px; overflow: hidden; }
  .kb-teaser-fade { position: absolute; left: 0; right: 0; bottom: 0; height: 56px; background: linear-gradient(to bottom, rgba(17,35,63,0), #1A1F1C); }
  .kb-reader-hint {
    display: flex; align-items: center; gap: 9px; margin-top: 18px; padding: 11px 14px;
    background: #0A0D0A; border: 1px solid #262B27;
    font: 500 11px/1.4 "JetBrains Mono", monospace; color: #5a635c; letter-spacing: 0.04em; text-transform: uppercase;
  }
  .kb-reader-hint i { color: var(--accent-bright); }
  .kb-reader-hint.is-joined { border-color: rgba(74,222,128,0.4); color: #4ade80; }
  .kb-reader-hint.is-joined i { color: #4ade80; }
  .kb-gate-help { display: flex; gap: 7px; align-items: flex-start; margin-top: 8px; font: 400 11px/1.5 "Inter", sans-serif; color: #5a635c; }
  .kb-gate-help i { color: var(--accent-bright); margin-top: 2px; }

  /* Category grid */
  .kb-cat-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; margin-top: 48px; }
  .kb-cat {
    position: relative; text-align: left; cursor: pointer;
    background: #1A1F1C; border: 1px solid #262B27; padding: 24px 26px;
    display: flex; align-items: center; gap: 20px;
    transition: border-color 200ms, transform 200ms;
  }
  .kb-cat::before, .kb-cat::after {
    content: ""; position: absolute; width: 12px; height: 12px; border: 2px solid var(--accent-bright);
    opacity: 0; transition: opacity 200ms;
  }
  .kb-cat::before { top: -1px; left: -1px; border-right: 0; border-bottom: 0; }
  .kb-cat::after { bottom: -1px; right: -1px; border-left: 0; border-top: 0; }
  .kb-cat:hover { border-color: var(--accent); transform: translateY(-2px); }
  .kb-cat:hover::before, .kb-cat:hover::after { opacity: 1; }
  .kb-cat-ic {
    width: 48px; height: 48px; flex-shrink: 0;
    border: 1px solid var(--accent); background: rgba(39,224,106,0.08);
    display: flex; align-items: center; justify-content: center; color: var(--accent-bright); font-size: 19px;
  }
  .kb-cat-body { flex: 1; min-width: 0; }
  .kb-cat-label { font: 600 16px/1.25 "Space Grotesk", sans-serif; color: #EAF1EA; letter-spacing: -0.01em; }
  .kb-cat-blurb { font: 400 13px/1.5 "Inter", sans-serif; color: #8A938C; margin-top: 5px; }
  .kb-cat-count { font: 700 16px/1 "JetBrains Mono", monospace; color: #5a635c; flex-shrink: 0; }
  .kb-cat:hover .kb-cat-count { color: var(--accent-bright); }

  /* Library / results */
  .kb-lib-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 32px; flex-wrap: wrap; }
  .kb-lib-title { font: 700 34px/1.1 "Space Grotesk", sans-serif; color: #EAF1EA; letter-spacing: -0.02em; margin: 0; }
  .kb-lib-q { color: var(--accent-bright); }
  .kb-reset {
    background: transparent; border: 1px solid #262B27; cursor: pointer; color: #8A938C;
    padding: 10px 16px; display: inline-flex; align-items: center; gap: 8px;
    font: 500 11px/1 "JetBrains Mono", monospace; text-transform: uppercase; letter-spacing: 0.12em;
    transition: border-color 120ms, color 120ms;
  }
  .kb-reset:hover { border-color: var(--accent); color: var(--accent-bright); }

  .kb-lib { border: 1px solid #262B27; border-bottom: 0; }
  .kb-art {
    display: flex; align-items: center; gap: 20px; cursor: pointer;
    padding: 22px 24px; border-bottom: 1px solid #262B27; background: #15191B;
    text-decoration: none; transition: background 160ms, padding-left 160ms;
  }
  .kb-art:hover { background: #1A1F1C; padding-left: 30px; }
  .kb-art-ic {
    width: 40px; height: 40px; flex-shrink: 0;
    border: 1px solid #333A35; background: rgba(44,70,117,0.2);
    display: flex; align-items: center; justify-content: center; color: var(--accent-bright); font-size: 16px;
    transition: border-color 160ms;
  }
  .kb-art:hover .kb-art-ic { border-color: var(--accent); }
  .kb-art-main { flex: 1; min-width: 0; }
  .kb-art-title { font: 600 16px/1.35 "Inter", sans-serif; color: #EAF1EA; }
  .kb-art-meta {
    display: flex; align-items: center; gap: 8px; margin-top: 6px; flex-wrap: wrap;
    font: 500 11px/1 "JetBrains Mono", monospace; color: #5a635c; letter-spacing: 0.06em; text-transform: uppercase;
  }
  .kb-art-cat { color: var(--accent-bright); }
  .kb-art-dot { color: #333A35; }
  .kb-art-arrow { color: #333A35; font-size: 14px; flex-shrink: 0; transition: color 160ms, transform 160ms; }
  .kb-art:hover .kb-art-arrow { color: var(--accent-bright); transform: translateX(4px); }

  .kb-empty {
    border: 1px solid #262B27; background: #0A0D0A; padding: 56px 32px; text-align: center;
  }
  .kb-empty-ic {
    width: 56px; height: 56px; margin: 0 auto 22px;
    border: 1px solid var(--accent); background: rgba(39,224,106,0.08);
    display: flex; align-items: center; justify-content: center; color: var(--accent-bright); font-size: 22px;
  }
  .kb-empty h3 { font: 700 22px/1.3 "Space Grotesk", sans-serif; color: #EAF1EA; margin: 0 0 10px; }
  .kb-empty p { font: 400 15px/1.6 "Inter", sans-serif; color: #8A938C; margin: 0 0 28px; }
  .kb-empty-cta { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }

  /* Subscribe wall modal */
  .kb-modal-overlay {
    position: fixed; inset: 0; z-index: 1000;
    background: rgba(5,9,15,0.82);
    -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
    display: flex; align-items: flex-start; justify-content: center;
    padding: 48px 20px; overflow-y: auto;
    animation: kbFade 160ms ease-out;
  }
  @keyframes kbFade { from { opacity: 0; } to { opacity: 1; } }
  .kb-modal {
    position: relative; width: 100%; max-width: 480px;
    background: #1A1F1C; border: 1px solid #333A35;
    padding: 40px; margin: auto;
    animation: kbModalIn 220ms cubic-bezier(.2,.8,.2,1);
  }
  @keyframes kbModalIn { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: translateY(0); } }
  .kb-modal::before, .kb-modal::after {
    content: ""; position: absolute; width: 16px; height: 16px; border: 2px solid var(--accent-bright);
  }
  .kb-modal::before { top: -1px; left: -1px; border-right: 0; border-bottom: 0; }
  .kb-modal::after { bottom: -1px; right: -1px; border-left: 0; border-top: 0; }
  .kb-modal-close {
    position: absolute; top: 14px; right: 14px;
    width: 34px; height: 34px; border: 1px solid #333A35; background: transparent;
    color: #8A938C; cursor: pointer; font-size: 15px;
    display: flex; align-items: center; justify-content: center;
    transition: border-color 120ms, color 120ms;
  }
  .kb-modal-close:hover { border-color: var(--accent-bright); color: var(--accent-bright); }
  .kb-modal-eye {
    font: 500 10px/1 "JetBrains Mono", monospace; color: var(--accent-bright);
    text-transform: uppercase; letter-spacing: 0.18em; margin-bottom: 14px; padding-right: 36px;
  }
  .kb-modal-title {
    font: 700 26px/1.2 "Space Grotesk", sans-serif; color: #EAF1EA;
    letter-spacing: -0.02em; margin: 0 0 22px;
  }
  .kb-req {
    display: flex; align-items: center; gap: 16px;
    background: #0A0D0A; border: 1px solid #262B27; padding: 16px 18px; margin-bottom: 20px;
  }
  .kb-req-ic {
    width: 42px; height: 42px; flex-shrink: 0;
    border: 1px solid var(--accent); background: rgba(39,224,106,0.08);
    display: flex; align-items: center; justify-content: center; color: var(--accent-bright); font-size: 17px;
  }
  .kb-req-main { min-width: 0; }
  .kb-req-lab {
    font: 500 9px/1 "JetBrains Mono", monospace; color: #5a635c;
    text-transform: uppercase; letter-spacing: 0.16em; margin-bottom: 6px;
  }
  .kb-req-title { font: 600 15px/1.3 "Inter", sans-serif; color: #EAF1EA; }
  .kb-req-meta { font: 500 10px/1 "JetBrains Mono", monospace; color: var(--accent-bright); letter-spacing: 0.08em; text-transform: uppercase; margin-top: 7px; }
  .kb-modal-sub { font: 400 14px/1.6 "Inter", sans-serif; color: #8A938C; margin: 0 0 24px; }
  .kb-modal-fine {
    margin-top: 16px; text-align: center;
    font: 500 9px/1.4 "JetBrains Mono", monospace; color: #5a635c;
    text-transform: uppercase; letter-spacing: 0.14em;
  }
  .kb-thanks { text-align: center; padding: 8px 0; }
  .kb-thanks-ic {
    width: 60px; height: 60px; margin: 0 auto 22px;
    border: 1px solid #4ade80; background: rgba(74,222,128,0.08);
    display: flex; align-items: center; justify-content: center; color: #4ade80; font-size: 24px;
  }
  .kb-thanks-cta { margin-top: 28px; display: flex; justify-content: center; }
  @media (max-width: 540px) {
    .kb-modal { padding: 28px 22px; }
    .kb-modal-title { font-size: 22px; }
    .kb-modal-overlay { padding: 20px 14px; }
  }

  @media (max-width: 720px) {
    .kb-cat-grid { grid-template-columns: 1fr; }
    .kb-lib-title { font-size: 26px; }
    .kb-art-arrow { display: none; }
  }

  /* ============================================================
     MOBILE — clean, conversion-focused (≤600px). Desktop untouched.
     ============================================================ */
  .m-cta { display: none; }
  @media (max-width: 600px) {
    /* Cut noisy chrome */
    .util { display: none !important; }

    /* Hero: tight + CTA-forward */
    .hero { padding: 34px 18px 40px !important; }
    .hero h1 { font-size: 29px !important; line-height: 1.12 !important; }
    .hero .sub { font-size: 15px !important; }
    .hero .ctas { flex-direction: column; align-items: stretch; gap: 10px; }
    .hero .ctas > * { width: 100%; }
    .hero .console { display: none !important; }
    .hero .strip { gap: 16px; flex-wrap: wrap; }
    .hero .stat .n { font-size: 26px; }

    /* Nav cards → compact tappable menu */
    #start { padding: 44px 18px !important; }
    .navq-grid { gap: 12px; }
    .navq-card { padding: 18px 16px 16px; }
    .navq-watermark, .navq-desc { display: none; }
    .navq-top { margin-bottom: 14px; }
    .navq-q h3 { font-size: 21px; margin-bottom: 0; }
    .navq-go { margin-top: 14px; padding-top: 12px; }
    .navq-dest { font-size: 14px; }
    .navq-callbar { margin-top: 28px; }

    /* Sticky conversion bar */
    body { padding-bottom: 78px; }
    .m-cta {
      display: flex; gap: 10px;
      position: fixed; left: 0; right: 0; bottom: 0; z-index: 999;
      padding: 10px 14px calc(10px + env(safe-area-inset-bottom, 0px));
      background: rgba(6,13,26,0.96); backdrop-filter: blur(10px);
      border-top: 1px solid #262B27;
    }
    .m-cta a, .m-cta button {
      display: inline-flex; align-items: center; justify-content: center; gap: 8px;
      height: 50px; border-radius: 4px; border: 1px solid;
      font: 700 13px/1 "Inter", sans-serif; text-transform: uppercase; letter-spacing: 0.07em;
      text-decoration: none; cursor: pointer;
    }
    .m-cta .m-call { flex: 0 0 33%; background: transparent; color: var(--accent-bright); border-color: var(--accent); }
    .m-cta .m-book { flex: 1; background: var(--accent); color: #06210F; border-color: var(--accent-bright); }
    .m-cta i { font-size: 14px; }
    /* iOS Safari zooms in (and scrolls the form off-screen) when a focused input is <16px — that reads as "the form is broken" */
    .form-row input, .form-row textarea, .form-row select { font-size: 16px; }
  }
  /* On the contact page the sticky bar is redundant and its z-index:999 overlays the Submit button — hide it there so the form is tappable */
  body:has(.contact-grid) .m-cta { display: none !important; }

  /* ===== Mobile-simplified landing: Services → Pricing → Contact (phones only) ===== */
  .m-landing { display: none; }
  @media (max-width: 768px) {
    .m-landing { display: block; }
    #start { display: none !important; }
    .hero .console { display: none !important; }
    .hero .ctas a[href="#start"] { display: none !important; }
    .hero { padding-bottom: 12px !important; }
  }
  .m-sec { padding: 40px 20px; border-top: 1px solid #262B27; }
  .m-sec.m-sec-alt { background: #15191B; }
  .m-sec-eye { font: 600 11px/1 "JetBrains Mono", monospace; letter-spacing: 0.18em; color: var(--accent-bright); text-transform: uppercase; margin-bottom: 10px; }
  .m-sec-title { font: 600 26px/1.15 "Space Grotesk", sans-serif; color: #EAF1EA; margin: 0 0 20px; letter-spacing: -0.01em; text-wrap: balance; }

  .m-svc-list { display: flex; flex-direction: column; gap: 10px; margin-bottom: 18px; }
  .m-svc { display: grid; grid-template-columns: 36px 1fr 16px; align-items: center; gap: 14px; width: 100%; text-align: left; background: #0A0D0A; border: 1px solid #262B27; border-radius: 8px; padding: 14px 16px; color: inherit; cursor: pointer; min-height: 64px; transition: border-color 160ms, background 160ms; }
  .m-svc:hover, .m-svc:active { border-color: var(--accent); background: #0c1b30; }
  .m-svc > i:first-child { font-size: 18px; color: var(--accent-bright); justify-self: center; }
  .m-svc-t { font: 600 16px/1.2 "Space Grotesk", sans-serif; color: #EAF1EA; margin-bottom: 3px; }
  .m-svc-d { font: 400 13px/1.45 "Inter", sans-serif; color: #8A938C; }
  .m-svc-go { color: #5a635c; font-size: 13px; }
  .m-wide { width: 100%; justify-content: center; }

  .m-price-grid { display: flex; flex-direction: column; gap: 16px; margin-bottom: 18px; }
  .m-plan { position: relative; background: #0A0D0A; border: 1px solid #262B27; border-radius: 10px; padding: 20px; }
  .m-plan.feat { border-color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent); }
  .m-plan-badge { position: absolute; top: -10px; left: 20px; background: var(--accent); color: #06210F; font: 700 9px/1 "JetBrains Mono", monospace; letter-spacing: 0.12em; padding: 5px 9px; border-radius: 3px; }
  .m-plan-name { font: 700 19px/1 "Space Grotesk", sans-serif; color: #EAF1EA; margin-bottom: 6px; }
  .m-plan-tag { font: 400 13px/1.45 "Inter", sans-serif; color: #8A938C; margin-bottom: 14px; }
  .m-plan-price { font: 400 15px/1.2 "Inter", sans-serif; color: #8A938C; margin-bottom: 16px; }
  .m-plan-price strong { font: 700 22px/1 "Space Grotesk", sans-serif; color: var(--accent-bright); }
  .m-plan-sub { font: 400 12px/1.4 "Inter", sans-serif; color: #5a635c; margin: 0 0 15px; }
  .m-plan-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 9px; }
  .m-plan-list li { position: relative; padding-left: 22px; font: 400 13px/1.45 "Inter", sans-serif; color: #c9d2c9; }
  .m-plan-list li::before { content: "\2713"; position: absolute; left: 0; top: 0; color: var(--accent-bright); font-weight: 700; }

  .m-contact-sub { font: 400 14px/1.55 "Inter", sans-serif; color: #8A938C; margin: 0 0 18px; }
  .m-contact-actions { display: flex; flex-direction: column; gap: 10px; }


  /* ===== Brand logo lockup (flame replaces the O) ===== */
  .forge-logo{ display:inline-flex; flex-direction:column; align-items:center; gap:0; font-family:'Space Grotesk',Arial,sans-serif; font-weight:700; letter-spacing:1px; font-size:28px; color:#EAF1EA; text-decoration:none; line-height:1; white-space:nowrap; }
.forge-logo .row{ display:inline-flex; align-items:center; line-height:1; }
.forge-logo svg{ flex:0 0 auto; width:.90em; height:.90em; margin:0 -.12em; position:relative; top:-.04em; }
.forge-logo .flame{ stroke:#27E06A; fill:none; }
.forge-logo .sub{ font-family:'JetBrains Mono',monospace; font-weight:500; font-size:.34em; letter-spacing:.55em; text-transform:uppercase; padding-left:.55em; margin-top:-.04em; opacity:.6; }
  .forge-logo.on-light{color:#0A0D0A;}


/* ===== Violet secondary accent — brand brief (~10%) ===== */
.eyebrow, .section-head .eyebrow, .stat-eyebrow, .dd-eyebrow, .m-sec-eye, .lg-eyebrow,
.leadgen-cta .lc-eye, .why-feat-pill, .svc-row .body .tag, .ind-eye, .step .num,
.console-head .t, .contact-info-panel .label, .form-card .head .t { color: #A78BFA !important; }
.eyebrow::before, .why-feat-pill::before, .ind-eye::before { background: #A78BFA !important; }
.console-head .t::before, .form-card .head .t::before { background: #A78BFA !important; box-shadow: 0 0 8px #A78BFA !important; }
.badge { background: rgba(167,139,250,0.12) !important; border-color: rgba(167,139,250,0.5) !important; color: #A78BFA !important; }
.badge .dot { background: #A78BFA !important; box-shadow: 0 0 6px #A78BFA !important; }
.nav .links a.active { color: #A78BFA !important; }
.nav .links a.active::before { background: #A78BFA !important; box-shadow: 0 0 6px #A78BFA !important; }
.m-plan.feat { border-color: #A78BFA !important; box-shadow: inset 0 0 0 1px #A78BFA !important; }
.m-plan.feat .m-plan-badge { background: #A78BFA !important; color: #2A1A5E !important; }
.btn-outline:hover, .btn-ghost:hover { color: #C4B2FF !important; border-color: #A78BFA !important; }

/* Featured plan: violet outline so it doesn't fight the green CTA (brief) */
.pr-plan.feat { border-color: #A78BFA !important; box-shadow: 0 0 44px -18px rgba(167,139,250,0.65) !important; }
.pr-plan.feat .pr-plan-bracket::before, .pr-plan.feat .pr-plan-bracket::after { border-color: #A78BFA !important; }
.pr-plan-badge, .pr-result-badge { background: #A78BFA !important; color: #2A1A5E !important; }

/* ===== Violet decorative icons (balance green; feature-card icons per brief) ===== */
.svc-row .ic, .industry-icon, .viz-role-ic { border-color: #A78BFA !important; background: rgba(167,139,250,0.10) !important; }
.svc-row .ic > i, .industry-icon i, .ind-front i, .why-cred i, .viz-role-ic { color: #A78BFA !important; }
.svc-row .ic::before, .svc-row .ic::after, .industry-icon::before, .industry-icon::after { border-color: #C4B2FF !important; }
.why-cred i { border-color: rgba(167,139,250,0.42) !important; background: rgba(167,139,250,0.10) !important; box-shadow: 0 0 16px -6px rgba(167,139,250,0.55) !important; }
.industry-card:hover { border-color: #A78BFA !important; }

/* ===== Section rhythm — Ash bands on select non-home sections ===== */
:is(.page:not([data-screen-label="Home"])) section:has(.timeline),
section:has(.pr-faq),
section:has(.principles) {
  background: #262B27 !important;
  border-top: 1px solid #333A35 !important;
}

/* Keep this section on the base Graphite surface (overrides Ash band) */
.page:not([data-screen-label="Home"]) section.sec-graphite:has(.timeline){background:#15191B !important;border-top:1px solid #262B27 !important;}


/* ============================================================
   SERVICE AREAS (overview + per-city)
   ============================================================ */
.sa-sec { padding: 52px 32px; }
.sa-sec > .container { max-width: 1280px; margin: 0 auto; }
.sa-center { text-align: center; }
.sa-center p { margin-left: auto; margin-right: auto; }
.sa-sec .sec-head { margin-bottom: 34px; }
.sa-sec .sec-head .eyebrow { margin-bottom: 13px; }
.sa-sec .sec-head h2 { font: 700 32px/1.12 "Space Grotesk", sans-serif; color: #EAF1EA; margin: 0; letter-spacing: -0.02em; }
.sa-sec .sec-head p { font: 400 16px/1.6 "Inter", sans-serif; color: #8A938C; margin: 11px 0 0; max-width: 620px; }

.sa-local { display: grid; grid-template-columns: 1.05fr 0.95fr; gap: 48px; align-items: center; }
.sa-local-body h2 { font: 700 30px/1.15 "Space Grotesk", sans-serif; color: #EAF1EA; margin: 13px 0 14px; letter-spacing: -0.02em; }
.sa-local-body p { font: 400 16px/1.7 "Inter", sans-serif; color: #8A938C; margin: 0; }
.sa-districts { display: flex; flex-direction: column; gap: 12px; }
.sa-district { display: flex; gap: 14px; align-items: flex-start; padding: 18px 20px; border: 1px solid #262B27; border-radius: 11px; background: rgba(255,255,255,0.015); }
.sa-district i { color: var(--accent-bright); font-size: 15px; margin-top: 2px; }
.sa-district strong { display: block; font: 700 15px/1.3 "Space Grotesk", sans-serif; color: #EAF1EA; }
.sa-district span { display: block; font: 400 13px/1.4 "Inter", sans-serif; color: #8A938C; margin-top: 3px; }

.hoods { display: flex; flex-wrap: wrap; gap: 10px; }
.hood { display: inline-flex; align-items: center; gap: 9px; padding: 11px 16px; border: 1px solid #262B27; border-radius: 8px; background: rgba(255,255,255,0.02); font: 500 14px/1 "Inter", sans-serif; color: #cdd6cd; }
.hood i { color: var(--accent); font-size: 11px; }

.svc-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 14px; }
.svc-card { border: 1px solid #262B27; border-radius: 12px; padding: 26px 24px; background: rgba(255,255,255,0.015); transition: border-color .16s, background .16s; }
.svc-card:hover { border-color: color-mix(in oklab, var(--accent-bright) 40%, #262B27); background: rgba(39,224,106,0.03); }
.svc-card i { font-size: 20px; color: var(--accent-bright); }
.svc-card h3 { font: 700 18px/1.25 "Space Grotesk", sans-serif; color: #EAF1EA; margin: 14px 0 7px; }
.svc-card p { font: 400 14px/1.55 "Inter", sans-serif; color: #8A938C; margin: 0; }

.sa-creds { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 16px; }
.sa-creds .why-cred { display: flex; gap: 14px; align-items: flex-start; padding: 22px; border: 1px solid #262B27; border-radius: 12px; }
.sa-creds .why-cred i { color: var(--accent-bright); font-size: 20px; }
.sa-creds .wc-main { font: 700 15px/1.3 "Space Grotesk", sans-serif; color: #EAF1EA; }
.sa-creds .wc-sub { font: 400 13px/1.4 "Inter", sans-serif; color: #8A938C; margin-top: 4px; }

.faq { border-top: 1px solid #262B27; max-width: 880px; }
.faq-item { border-bottom: 1px solid #262B27; }
.faq-q { width: 100%; text-align: left; cursor: pointer; appearance: none; background: none; border: 0; padding: 22px 0; display: flex; align-items: center; justify-content: space-between; gap: 20px; font: 600 17px/1.4 "Space Grotesk", sans-serif; color: #EAF1EA; }
.faq-q .pm { color: var(--accent-bright); font-size: 15px; transition: transform .2s; flex-shrink: 0; }
.faq-item.open .faq-q .pm { transform: rotate(45deg); }
.faq-a { max-height: 0; overflow: hidden; transition: max-height .26s ease; }
.faq-a p { font: 400 15px/1.65 "Inter", sans-serif; color: #8A938C; margin: 0 0 22px; max-width: 740px; }

.cta-band { border: 1px solid color-mix(in oklab, var(--accent-bright) 28%, #262B27); border-radius: 18px; padding: 44px; background: linear-gradient(120deg, rgba(39,224,106,0.08), rgba(39,224,106,0.01)); display: flex; align-items: center; justify-content: space-between; gap: 32px; flex-wrap: wrap; }
.cta-band h2 { font: 700 30px/1.15 "Space Grotesk", sans-serif; color: #EAF1EA; margin: 0; letter-spacing: -0.02em; max-width: 560px; }
.cta-band p { font: 400 15px/1.6 "Inter", sans-serif; color: #8A938C; margin: 10px 0 0; max-width: 560px; }
.cta-actions { display: flex; gap: 12px; flex-wrap: wrap; }

.sa-city-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(258px, 1fr)); gap: 14px; }
.sa-city-card { display: block; border: 1px solid #262B27; border-radius: 13px; padding: 26px 24px; background: rgba(255,255,255,0.015); transition: border-color .16s, background .16s, transform .16s; }
.sa-city-card:hover { border-color: color-mix(in oklab, var(--accent-bright) 45%, #262B27); background: rgba(39,224,106,0.04); transform: translateY(-2px); }
.sa-city-top { display: flex; align-items: center; justify-content: space-between; }
.sa-city-name { font: 700 22px/1 "Space Grotesk", sans-serif; color: #EAF1EA; letter-spacing: -0.01em; }
.sa-city-top i { color: var(--accent-bright); font-size: 14px; transition: transform .16s; }
.sa-city-card:hover .sa-city-top i { transform: translateX(4px); }
.sa-city-card p { font: 400 14px/1.5 "Inter", sans-serif; color: #8A938C; margin: 12px 0 16px; }
.sa-city-meta { font: 600 11px/1 "JetBrains Mono", monospace; color: #5a635c; text-transform: uppercase; letter-spacing: 0.12em; }

.cov-map { position: relative; border: 1px solid #262B27; border-radius: 16px; background: radial-gradient(circle at 56% 40%, rgba(39,224,106,0.08), transparent 60%), #0e1211; height: 440px; overflow: hidden; }
.cov-dots { position: absolute; inset: 0; background-image: radial-gradient(rgba(120,130,120,0.22) 1.1px, transparent 1.1px); background-size: 26px 26px; -webkit-mask-image: radial-gradient(circle at 56% 40%, #000 30%, transparent 78%); mask-image: radial-gradient(circle at 56% 40%, #000 30%, transparent 78%); }
.cov-rings { position: absolute; left: 56%; top: 40%; }
.cov-rings span { position: absolute; border: 1px solid rgba(39,224,106,0.24); border-radius: 50%; left: 0; top: 0; transform: translate(-50%,-50%); }
.cov-map .pin { position: absolute; transform: translate(-50%,-50%); font: 600 12px/1 "JetBrains Mono", monospace; color: #8A938C; display: flex; flex-direction: column; align-items: center; gap: 6px; white-space: nowrap; }
.cov-map .pin .dot { width: 9px; height: 9px; border-radius: 50%; background: #5a635c; }
.cov-map .pin.hot { color: #EAF1EA; font-size: 14px; z-index: 2; }
.cov-map .pin.hot .dot { width: 15px; height: 15px; background: var(--accent); box-shadow: 0 0 0 5px rgba(39,224,106,0.18), 0 0 16px var(--accent); }

@media (max-width: 960px) { .sa-local { grid-template-columns: 1fr; gap: 30px; } }
@media (max-width: 760px) { .sa-sec { padding: 40px 20px; } .cta-band { padding: 32px 26px; } .cov-map { height: 360px; } }


/* Service Areas — fun fact callout */
.sa-fun-sec { padding-top: 8px; }
.sa-fun { display: flex; gap: 22px; align-items: center; border: 1px solid color-mix(in oklab, var(--accent-bright) 22%, #262B27); border-radius: 16px; padding: 26px 30px; background: linear-gradient(120deg, rgba(39,224,106,0.06), rgba(255,255,255,0.01)); }
.sa-fun-ic { flex-shrink: 0; width: 58px; height: 58px; border-radius: 13px; display: flex; align-items: center; justify-content: center; background: rgba(39,224,106,0.10); border: 1px solid color-mix(in oklab, var(--accent-bright) 30%, #262B27); }
.sa-fun-ic i { font-size: 24px; color: var(--accent-bright); }
.sa-fun-body .eyebrow { margin-bottom: 8px; }
.sa-fun-body p { font: 500 18px/1.5 "Space Grotesk", sans-serif; color: #EAF1EA; margin: 0; max-width: 780px; }
@media (max-width: 600px) { .sa-fun { flex-direction: column; align-items: flex-start; gap: 16px; padding: 22px; } }


/* ============================================================
   COVERAGE MAP (CountyMap) — mobile: give the box height back and
   stop the overlay/readout panels from colliding on a narrow screen.
   ============================================================ */
@media (max-width: 640px) {
  .map-wrap { aspect-ratio: 4 / 3 !important; }
  .map-wrap .map-overlay {
    top: 12px !important; left: 12px !important; right: auto !important;
    min-width: 0 !important; padding: 11px 13px !important;
  }
  .map-wrap .map-overlay h4 { margin-bottom: 8px !important; }
  .map-wrap .map-overlay .row { font-size: 11px !important; gap: 20px; }
  .map-wrap .map-readout {
    bottom: 12px !important; right: 12px !important; left: auto !important;
    padding: 8px 11px !important; font-size: 9px !important;
  }
}
@media (max-width: 430px) {
  .map-wrap { aspect-ratio: 1 / 1 !important; }
  .map-wrap .map-readout { left: 12px !important; right: auto !important; }
}