:root{
    --ink:#14202B;
    --paper:#F3F5F1;
    --green:#4CA771;
    --slate:#3B4A57;
    --manifest:#8B95A1;
    --line: rgba(20,32,43,0.14);
    --serif: Georgia, 'Times New Roman', serif;
    --sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
    --mono: 'SF Mono', 'Courier New', monospace;
  }
  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    margin:0;
    background:var(--paper);
    color:var(--ink);
    font-family:var(--sans);
    -webkit-font-smoothing:antialiased;
  }
  a{color:inherit;}

  /* ---------- NAV ---------- */
  nav{
    display:flex; align-items:center; justify-content:space-between;
    padding:28px 6vw;
    position:sticky; top:0; z-index:50;
    background:rgba(243,245,241,0.86);
    backdrop-filter: blur(8px);
    border-bottom:1px solid var(--line);
  }
  .brand{ display:flex; align-items:center; gap:12px; font-family:var(--serif); font-size:20px; letter-spacing:0.3px;}
  .brand .dot{color:var(--green);}
  .brand-mark{ flex-shrink:0; }
  nav ul{ list-style:none; display:flex; gap:34px; margin:0; padding:0; font-size:14px; letter-spacing:0.4px;}
  nav ul li a{ text-decoration:none; opacity:0.75; transition:opacity .2s;}
  nav ul li a:hover{ opacity:1;}
  .navcta{
    border:1px solid var(--ink); padding:9px 18px; border-radius:2px; font-size:13px;
    text-decoration:none; letter-spacing:0.5px; transition: background .2s, color .2s;
  }
  .navcta:hover{ background:var(--ink); color:var(--paper);}
  @media(max-width:820px){ nav ul{display:none;} }

  /* ---------- HERO ---------- */
  .hero{
    padding:9vw 6vw 6vw;
    display:grid; grid-template-columns: 1.1fr 0.9fr; gap:40px;
    align-items:center;
    max-width:1400px; margin:0 auto;
  }
  .eyebrow{
    font-family:var(--mono); font-size:12px; letter-spacing:2px; color:var(--green);
    text-transform:uppercase; margin-bottom:18px; display:flex; align-items:center; gap:10px;
  }
  .eyebrow::before{ content:''; width:26px; height:1px; background:var(--green);}
  h1{
    font-family:var(--serif); font-weight:400;
    font-size:clamp(36px,4.8vw,64px); line-height:1.06; margin:0 0 22px; letter-spacing:-0.5px;
  }
  h1 em{ font-style:italic; color:var(--slate);}
  .lede{ font-size:18px; line-height:1.6; color:var(--slate); max-width:52ch; margin:0 0 34px;}
  .hero-cta{ display:flex; gap:16px; flex-wrap:wrap; }
  .btn-primary{
    background:var(--ink); color:var(--paper); padding:14px 26px; border-radius:2px;
    text-decoration:none; font-size:14px; letter-spacing:0.4px; display:inline-flex; align-items:center; gap:8px;
    transition: transform .2s, box-shadow .2s;
  }
  .btn-primary:hover{ transform:translateY(-2px); box-shadow:0 10px 24px rgba(20,32,43,0.18);}
  .btn-secondary{
    padding:14px 6px; text-decoration:none; font-size:14px; letter-spacing:0.4px;
    border-bottom:1px solid var(--ink);
  }

  /* ---------- ROUTE SIGNATURE ---------- */
  .route-wrap{ position:relative; height:420px; }
  .route-svg{ width:100%; height:100%; }
  .tile{ stroke:var(--ink); stroke-width:5; }
  .tile-green{ fill:var(--green); }
  .tile-navy{ fill:var(--ink); }
  .tile-symbol-dark{ font-family:var(--serif); font-weight:bold; fill:var(--ink); }
  .tile-symbol-light{ font-family:var(--serif); font-weight:bold; fill:var(--paper); }
  .tile-num-dark{ font-family:var(--sans); font-weight:bold; fill:var(--ink); }
  .tile-num-light{ font-family:var(--sans); font-weight:bold; fill:var(--green); }
  .tile-rule{ stroke-width:2.5; }
  .connector{ fill:none; stroke:var(--ink); stroke-width:2.5; }
  .node-label{
    font-family:var(--mono); font-size:10.5px; fill:var(--slate); letter-spacing:0.5px;
  }
  .node-sub{ font-family:var(--mono); font-size:9px; fill:var(--manifest); }
  .tile-pulse{ transform-origin:40px 40px; animation:pulse 2.6s ease-in-out infinite; transform-box:fill-box; }
  @keyframes pulse{
    0%,100%{ transform:scale(1); }
    50%{ transform:scale(1.045); }
  }
  @media(max-width:820px){
    .hero{ grid-template-columns:1fr; }
    .route-wrap{ height:280px; order:-1;}
  }

  /* ---------- MANIFEST STRIP ---------- */
  .manifest{
    border-top:1px solid var(--line); border-bottom:1px solid var(--line);
    padding:20px 6vw; display:flex; gap:0; overflow-x:auto;
    font-family:var(--mono); font-size:12px; color:var(--slate); letter-spacing:0.3px;
  }
  .manifest span{ white-space:nowrap; padding:0 28px; border-right:1px solid var(--line); }
  .manifest span:last-child{ border-right:none;}
  .manifest strong{ color:var(--ink);}

  /* ---------- SECTIONS ---------- */
  section{ padding:100px 6vw; max-width:1400px; margin:0 auto; }
  .section-head{ max-width:640px; margin-bottom:56px; }
  .section-eyebrow{
    font-family:var(--mono); font-size:12px; letter-spacing:2px; color:var(--green); text-transform:uppercase; margin-bottom:14px;
  }
  h2{ font-family:var(--serif); font-weight:400; font-size:clamp(28px,3.2vw,42px); margin:0 0 16px; letter-spacing:-0.3px;}
  .section-desc{ color:var(--slate); font-size:16px; line-height:1.65; }

  /* services */
  .services-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line);}
  .service-card{ background:var(--paper); padding:38px 32px; }
  .service-index{ font-family:var(--mono); font-size:12px; color:var(--manifest); margin-bottom:22px;}
  .service-card h3{ font-family:var(--serif); font-weight:400; font-size:22px; margin:0 0 14px;}
  .service-card ul{ margin:0; padding:0; list-style:none; }
  .service-card li{
    font-size:14.5px; line-height:1.7; color:var(--slate); padding-left:16px; position:relative;
  }
  .service-card li::before{ content:'—'; position:absolute; left:0; color:var(--green); }
  @media(max-width:820px){ .services-grid{ grid-template-columns:1fr; } }

  /* about / founder */
  .about{
    display:grid; grid-template-columns: 0.85fr 1.15fr; gap:60px; align-items:start;
    padding:100px 6vw; max-width:1400px; margin:0 auto; border-top:1px solid var(--line);
  }
  .about-mark{
    width:120px; height:120px;
    display:flex; align-items:center; justify-content:center;
  }
  .about h2{ margin-top:24px; }
  .about p{ color:var(--slate); font-size:16.5px; line-height:1.75; max-width:60ch; }
  @media(max-width:820px){ .about{ grid-template-columns:1fr; } }

  /* CTA band */
  .cta-band{
    background:var(--ink); color:var(--paper);
    padding:90px 6vw; text-align:center;
  }
  .cta-band h2{ color:var(--paper); }
  .cta-band .lede{ color:rgba(243,245,241,0.72); margin:0 auto 34px; }
  .cta-band .btn-primary{ background:var(--green); color:var(--ink); }

  footer{
    padding:40px 6vw; display:flex; justify-content:space-between; align-items:center;
    font-size:13px; color:var(--manifest); flex-wrap:wrap; gap:16px;
  }
