  :root{
    --ink:#0F1B2D;
    --ink-soft:#2B3A4F;
    --paper:#F6F7F9;
    --paper-raised:#FFFFFF;
    --slate:#5B6472;
    --line:#DCE0E6;
    --amber:#D98E2E;
    --amber-soft:#F3D9AE;
    --green:#2F7E63;
    --shadow: 0 1px 2px rgba(15,27,45,0.04), 0 8px 24px rgba(15,27,45,0.06);
    --radius: 3px;
  }

  *{margin:0;padding:0;box-sizing:border-box;}

  html{scroll-behavior:smooth;}

  body{
    background:var(--paper);
    color:var(--ink);
    font-family:'IBM Plex Sans', sans-serif;
    font-size:16px;
    line-height:1.6;
    -webkit-font-smoothing:antialiased;
  }

  @media (prefers-reduced-motion: reduce){
    html{scroll-behavior:auto;}
    *{animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important;}
  }

  .wrap{max-width:1180px;margin:0 auto;padding:0 32px;}

  h1,h2,h3,h4{
    font-family:'Fraunces', serif;
    font-weight:500;
    line-height:1.12;
    letter-spacing:-0.01em;
  }

  .eyebrow{
    font-family:'IBM Plex Mono', monospace;
    font-size:12px;
    letter-spacing:0.14em;
    text-transform:uppercase;
    color:var(--amber);
    display:flex;
    align-items:center;
    gap:10px;
  }
  .eyebrow::before{
    content:"";
    width:16px;height:1px;
    background:var(--amber);
    display:inline-block;
  }

  a{color:inherit;}

  ::selection{background:var(--amber-soft); color:var(--ink);}

  :focus-visible{
    outline:2px solid var(--amber);
    outline-offset:3px;
  }

  /* ---------- NAV ---------- */
  header{
    position:sticky; top:0; z-index:100;
    background:rgba(246,247,249,0.86);
    backdrop-filter:blur(10px);
    border-bottom:1px solid var(--line);
  }
  nav{
    display:flex; align-items:center; justify-content:space-between;
    padding:20px 32px;
    max-width:1180px; margin:0 auto;
  }
  .logo{
    display:flex; align-items:center; gap:10px;
    font-family:'Fraunces', serif;
    font-size:19px;
    font-weight:500;
    letter-spacing:-0.01em;
    text-decoration:none;
    color:var(--ink);
  }
  .logo svg{width:26px;height:26px;flex-shrink:0;}
  .nav-links{
    display:flex; align-items:center; gap:36px;
    list-style:none;
    font-size:14.5px;
  }
  .nav-links a{
    text-decoration:none;
    color:var(--ink-soft);
    position:relative;
    padding-bottom:2px;
  }
  .nav-links a:hover{color:var(--ink);}
  .nav-cta{
    font-family:'IBM Plex Mono', monospace;
    font-size:13px;
    text-decoration:none;
    color:var(--ink);
    border:1px solid var(--ink);
    padding:9px 18px;
    border-radius:var(--radius);
    transition:background 0.2s ease, color 0.2s ease;
    white-space:nowrap;
  }
  .nav-cta:hover{background:var(--ink); color:var(--paper);}
  .nav-toggle{display:none;}

  @media (max-width:860px){
    .nav-links{display:none;}
    .nav-toggle{
      display:block; background:none; border:none; cursor:pointer;
      font-family:'IBM Plex Mono',monospace; font-size:13px; color:var(--ink);
      border:1px solid var(--line); padding:8px 14px; border-radius:var(--radius);
    }
  }

  /* ---------- HERO ---------- */
  .hero{
    padding:100px 0 90px;
    position:relative;
    overflow:hidden;
  }
  .hero .wrap{
    display:grid;
    grid-template-columns:1.15fr 0.85fr;
    gap:40px;
    align-items:center;
  }
  .hero-copy .eyebrow{margin-bottom:22px;}
  .hero h1{
    font-size:clamp(38px, 5vw, 60px);
    margin-bottom:24px;
  }
  .hero h1 .focus-line{
    display:block;
    filter:blur(9px);
    opacity:0.3;
    animation:snapFocus 1.1s cubic-bezier(.2,.7,.3,1) forwards;
  }
  .hero h1 .focus-line:nth-child(1){animation-delay:0.05s;}
  .hero h1 .focus-line:nth-child(2){animation-delay:0.28s; color:var(--slate); font-style:italic; font-weight:400;}
  .hero h1 .focus-line:nth-child(3){animation-delay:0.51s;}
  @keyframes snapFocus{
    to{filter:blur(0); opacity:1;}
  }
  @media (prefers-reduced-motion: reduce){
    .hero h1 .focus-line{filter:none;opacity:1;animation:none;}
  }

  .hero p.lede{
    max-width:46ch;
    color:var(--slate);
    font-size:17px;
    margin-bottom:36px;
  }
  .hero-ctas{display:flex; gap:14px; flex-wrap:wrap;}
  .btn{
    font-family:'IBM Plex Mono', monospace;
    font-size:13.5px;
    text-decoration:none;
    padding:13px 22px;
    border-radius:var(--radius);
    display:inline-flex; align-items:center; gap:8px;
    transition:transform 0.18s ease, background 0.18s ease, border-color .18s ease, color .18s ease;
  }
  .btn-primary{background:var(--ink); color:var(--paper); border:1px solid var(--ink);}
  .btn-primary:hover{background:var(--ink-soft); border-color:var(--ink-soft); transform:translateY(-1px);}
  .btn-ghost{border:1px solid var(--line); color:var(--ink);}
  .btn-ghost:hover{border-color:var(--ink); transform:translateY(-1px);}

  /* Aperture graphic */
  .aperture-wrap{
    position:relative;
    aspect-ratio:1/1;
    display:flex; align-items:center; justify-content:center;
  }
  .aperture-wrap svg{width:100%; height:100%; max-width:380px;}
  .ring-rotate{
    transform-origin:200px 200px;
    animation:slowRotate 60s linear infinite;
  }
  .ring-rotate-rev{
    transform-origin:200px 200px;
    animation:slowRotateRev 90s linear infinite;
  }
  @keyframes slowRotate{ to{ transform:rotate(360deg); } }
  @keyframes slowRotateRev{ to{ transform:rotate(-360deg); } }
  @media (prefers-reduced-motion: reduce){
    .ring-rotate, .ring-rotate-rev{animation:none;}
  }

  /* ---------- FORK ---------- */
  .fork{
    padding:80px 0 100px;
    border-top:1px solid var(--line);
  }
  .section-head{
    max-width:640px;
    margin-bottom:56px;
  }
  .section-head .eyebrow{margin-bottom:18px;}
  .section-head h2{font-size:clamp(28px,3.4vw,38px);}
  .section-head p{color:var(--slate); margin-top:14px; font-size:16px;}

  .fork-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:24px;
  }
  .fork-card{
    background:var(--paper-raised);
    border:1px solid var(--line);
    border-radius:var(--radius);
    padding:40px;
    filter:blur(2.5px) saturate(0.85);
    opacity:0.82;
    transition:filter 0.35s ease, opacity 0.35s ease, box-shadow .35s ease, border-color .35s ease;
    position:relative;
  }
  .fork-card:hover, .fork-card:focus-within{
    filter:blur(0) saturate(1);
    opacity:1;
    box-shadow:var(--shadow);
    border-color:#c9cfd8;
  }
  .fork-card .tag{
    font-family:'IBM Plex Mono', monospace;
    font-size:11.5px;
    letter-spacing:0.1em;
    text-transform:uppercase;
    color:var(--slate);
    margin-bottom:16px;
    display:block;
  }
  .fork-card h3{font-size:25px; margin-bottom:14px;}
  .fork-card .lead{color:var(--ink-soft); margin-bottom:26px; font-size:15.5px;}
  .fork-card ul{list-style:none; margin-bottom:30px;}
  .fork-card li{
    display:flex; align-items:baseline; gap:10px;
    padding:9px 0;
    border-top:1px solid var(--line);
    font-size:14.5px;
    color:var(--ink-soft);
  }
  .fork-card li:first-child{border-top:none;}
  .fork-card li::before{
    content:"—";
    color:var(--amber);
    flex-shrink:0;
  }
  .fork-card .btn-ghost{width:fit-content;}

  @media (max-width:860px){
    .fork-grid{grid-template-columns:1fr;}
    .hero .wrap{grid-template-columns:1fr;}
    .aperture-wrap{max-width:260px; margin:0 auto;}
  }

  /* ---------- PHILOSOPHY ---------- */
  .philosophy{
    background:var(--ink);
    color:var(--paper);
    padding:96px 0;
  }
  .philosophy .section-head p{color:#9AA7B8;}
  .philosophy .eyebrow{color:var(--amber);}
  .philosophy .eyebrow::before{background:var(--amber);}
  .philosophy h2{color:var(--paper);}

  .phi-grid{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:1px;
    background:rgba(255,255,255,0.12);
    border:1px solid rgba(255,255,255,0.12);
  }
  .phi-card{
    background:var(--ink);
    padding:40px 34px;
  }
  .phi-fstop{
    font-family:'IBM Plex Mono', monospace;
    font-size:14px;
    color:var(--amber);
    margin-bottom:22px;
  }
  .phi-card h3{
    font-size:23px;
    color:var(--paper);
    margin-bottom:14px;
    font-weight:400;
    font-style:italic;
  }
  .phi-card p{color:#9AA7B8; font-size:15px;}
  .phi-visual{
    width:44px; height:44px;
    margin-bottom:20px;
    opacity:0.9;
  }

  @media (max-width:860px){
    .phi-grid{grid-template-columns:1fr;}
  }

  /* ---------- SERVICES / PROGRAMS ---------- */
  .stack-section{padding:96px 0; border-top:1px solid var(--line);}

  .card-grid{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:1px;
    background:var(--line);
    border:1px solid var(--line);
  }
  .item-card{
    background:var(--paper-raised);
    padding:32px 28px;
    transition:background 0.2s ease;
  }
  .item-card:hover{background:#FBFAF7;}
  .item-card .num{
    font-family:'IBM Plex Mono', monospace;
    font-size:12px;
    color:var(--amber);
    margin-bottom:14px;
    display:block;
  }
  .item-card h4{font-size:18px; margin-bottom:10px; font-weight:500;}
  .item-card p{color:var(--slate); font-size:14.5px;}

  @media (max-width:860px){
    .card-grid{grid-template-columns:1fr;}
  }

  .section-cta{
    margin-top:44px;
  }

  /* Academy programs / track split */
  .academy-split{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:48px;
    margin-top:56px;
    padding-top:48px;
    border-top:1px solid var(--line);
  }
  .split-col .kicker{
    font-family:'IBM Plex Mono', monospace;
    font-size:12px;
    letter-spacing:0.1em;
    text-transform:uppercase;
    color:var(--slate);
    margin-bottom:18px;
    display:block;
  }
  .split-col h3{font-size:22px; margin-bottom:18px;}
  .track-list{list-style:none;}
  .track-list li{
    padding:14px 0;
    border-top:1px solid var(--line);
    display:flex; justify-content:space-between; align-items:baseline;
    font-size:15px;
  }
  .track-list li span.tick{
    font-family:'IBM Plex Mono', monospace;
    font-size:12px;
    color:var(--amber);
  }

  @media (max-width:860px){
    .academy-split{grid-template-columns:1fr;}
  }

  /* ---------- APPROACH / PROOF ---------- */
  .approach{
    background:#EFEEE8;
    padding:96px 0;
    border-top:1px solid var(--line);
    border-bottom:1px solid var(--line);
  }
  .approach-steps{
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    gap:24px;
    margin-top:20px;
  }
  .astep{position:relative; padding-top:24px;}
  .astep::before{
    content:"";
    position:absolute; top:0; left:0;
    width:100%; height:2px;
    background:var(--line);
  }
  .astep::after{
    content:"";
    position:absolute; top:-2px; left:0;
    width:22%; height:2px;
    background:var(--amber);
  }
  .astep .fnum{
    font-family:'IBM Plex Mono', monospace;
    font-size:12px; color:var(--slate); margin-bottom:12px; display:block;
  }
  .astep h4{font-size:16.5px; margin-bottom:8px; font-weight:500;}
  .astep p{font-size:14px; color:var(--slate);}

  @media (max-width:860px){
    .approach-steps{grid-template-columns:1fr 1fr;}
  }
  @media (max-width:520px){
    .approach-steps{grid-template-columns:1fr;}
  }

  /* ---------- ABOUT ---------- */
  .about{padding:96px 0; border-bottom:1px solid var(--line);}
  .about-grid{
    display:grid;
    grid-template-columns:0.9fr 1.1fr;
    gap:56px;
    align-items:start;
  }
  .about-grid h2{font-size:clamp(26px,3vw,34px); margin-bottom:20px;}
  .about-grid p{color:var(--slate); margin-bottom:16px; max-width:52ch;}
  .cred-list{list-style:none; margin-top:8px;}
  .cred-list li{
    display:flex; gap:14px; align-items:flex-start;
    padding:16px 0;
    border-top:1px solid var(--line);
  }
  .cred-list li:first-child{border-top:none;}
  .cred-list .mark{
    font-family:'IBM Plex Mono', monospace;
    color:var(--amber);
    font-size:13px;
    margin-top:2px;
  }
  .cred-list h5{font-size:15.5px; font-weight:500; margin-bottom:4px;}
  .cred-list span.desc{font-size:14px; color:var(--slate);}

  @media (max-width:860px){
    .about-grid{grid-template-columns:1fr;}
  }

  /* ---------- CLOSING CTA ---------- */
  .closing{
    padding:100px 0;
    text-align:center;
    background:var(--ink);
    color:var(--paper);
  }
  .closing h2{
    font-size:clamp(28px,4vw,44px);
    max-width:16ch;
    margin:0 auto 30px;
    color:var(--paper);
  }
  .closing .eyebrow{justify-content:center; color:var(--amber); margin-bottom:20px;}
  .closing .eyebrow::before{background:var(--amber);}
  .closing-ctas{display:flex; gap:16px; justify-content:center; flex-wrap:wrap;}
  .closing .btn-primary{background:var(--amber); border-color:var(--amber); color:var(--ink);}
  .closing .btn-primary:hover{background:#c47f24; border-color:#c47f24;}
  .closing .btn-ghost{border-color:rgba(255,255,255,0.3); color:var(--paper);}
  .closing .btn-ghost:hover{border-color:var(--paper);}

  /* ---------- CONTACT ---------- */
  .contact{padding:96px 0; border-bottom:1px solid var(--line);}
  .contact-form{
    max-width:640px;
    margin-top:8px;
  }
  .form-row{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:20px;
  }
  .form-field{margin-bottom:20px;}
  .form-field label{
    display:block;
    font-family:'IBM Plex Mono', monospace;
    font-size:12px;
    letter-spacing:0.06em;
    text-transform:uppercase;
    color:var(--slate);
    margin-bottom:8px;
  }
  .form-field input,
  .form-field select,
  .form-field textarea{
    width:100%;
    background:var(--paper-raised);
    border:1px solid var(--line);
    border-radius:var(--radius);
    padding:12px 14px;
    font-family:'IBM Plex Sans', sans-serif;
    font-size:15px;
    color:var(--ink);
    transition:border-color 0.2s ease;
  }
  .form-field input:focus,
  .form-field select:focus,
  .form-field textarea:focus{
    border-color:var(--amber);
    outline:none;
  }
  .form-field textarea{resize:vertical; min-height:120px;}
  .contact-form button{
    border:none;
    cursor:pointer;
    margin-top:6px;
  }
  .contact-form button:disabled{opacity:0.6; cursor:default;}
  .form-status{
    margin-top:18px;
    font-size:14.5px;
    min-height:1.2em;
  }
  .form-status.success{color:var(--green);}
  .form-status.error{color:#B4402A;}

  @media (max-width:600px){
    .form-row{grid-template-columns:1fr;}
  }

  /* ---------- FOOTER ---------- */
  footer{padding:56px 0 40px; background:var(--paper);}
  .footer-grid{
    display:grid;
    grid-template-columns:1.3fr 1fr 1fr;
    gap:40px;
    padding-bottom:36px;
    border-bottom:1px solid var(--line);
  }
  footer .logo{margin-bottom:14px;}
  footer p{color:var(--slate); font-size:14px; max-width:32ch;}
  footer h6{
    font-family:'IBM Plex Mono', monospace;
    font-size:12px; letter-spacing:0.08em; text-transform:uppercase;
    color:var(--slate); margin-bottom:16px;
  }
  footer ul{list-style:none;}
  footer li{margin-bottom:10px;}
  footer a{text-decoration:none; color:var(--ink-soft); font-size:14.5px;}
  footer a:hover{color:var(--ink);}
  .footer-bottom{
    display:flex; justify-content:space-between; align-items:center;
    padding-top:24px;
    font-size:13px;
    color:var(--slate);
    font-family:'IBM Plex Mono', monospace;
    flex-wrap:wrap; gap:10px;
  }

  @media (max-width:700px){
    .footer-grid{grid-template-columns:1fr; gap:28px;}
  }

  section[id]{scroll-margin-top:84px;}
