:root{
    --navy: #040025;
    --navy-soft: #0c0a3e;
    --slate: #23234a;
    --gold: #b98a2e;
    --gold-bright: #d6a94a;
    --gold-deep: #7c5a1e;
    --cream: #fbf8f1;
    --paper: #f1e9da;
    --ink: #040025;
    --max-w: 1180px;
    --radius: 2px;
  }

  *{ box-sizing: border-box; }
  html{ scroll-behavior: smooth; }
  body{
    margin:0;
    background: var(--cream);
    color: var(--navy);
    font-family: 'Aptos Display', 'Hanken Grotesk', system-ui, sans-serif;
    font-size: 17px;
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
  }
  h1,h2,h3,.display{
    font-family: 'Aptos Black', 'Hanken Grotesk', system-ui, sans-serif;
    font-weight: 800;
    letter-spacing: -0.01em;
    margin: 0;
  }
  .eyebrow{
    font-family: 'IBM Plex Mono', monospace;
    font-size: 0.72rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    font-weight: 600;
  }
  a{ color: inherit; }
  img,svg{ display:block; max-width:100%; }
  .wrap{ max-width: var(--max-w); margin: 0 auto; padding: 0 32px; }
  section{ padding: 108px 0; }
  @media (max-width: 720px){
    section{ padding: 72px 0; }
    .wrap{ padding: 0 22px; }
    body{ font-size: 16px; }
  }

  /* reveal on scroll */
  .reveal{ opacity: 0; transform: translateY(18px); transition: opacity .7s ease, transform .7s ease; }
  .reveal.in{ opacity: 1; transform: none; }
  @media (prefers-reduced-motion: reduce){
    .reveal{ opacity:1; transform:none; transition:none; }
    html{ scroll-behavior:auto; }
  }

  /* ---------- NAV ---------- */
  header{
    position: sticky; top:0; z-index: 50;
    background: rgba(4,0,37,0.92);
    backdrop-filter: blur(6px);
    border-bottom: 1px solid rgba(185,138,46,0.25);
  }
  nav.wrap{
    display:flex; align-items:center; justify-content:space-between;
    height: 76px;
  }
  .logo{ display:flex; align-items:center; gap:10px; color: var(--cream); text-decoration:none; }
  .logo-icon{ height: 40px; width:auto; }
  .logo-word{ font-family:'Aptos Black','Hanken Grotesk',sans-serif; font-weight:800; font-size:1.18rem; letter-spacing:0.01em; }
  .logo-word b{ color: var(--gold-bright); font-weight:700; }
  .navlinks{ display:flex; gap: 34px; list-style:none; margin:0; padding:0; }
  .navlinks a{
    color: rgba(251,248,241,0.78); text-decoration:none;
    font-size:0.92rem; font-weight:500; letter-spacing:0.01em;
    transition: color .2s ease;
  }
  .navlinks a:hover{ color: var(--gold-bright); }
  .nav-cta{
    color: var(--navy) !important; background: var(--gold-bright);
    padding: 9px 18px; border-radius: var(--radius); font-weight:600 !important;
  }
  .nav-cta:hover{ background: var(--cream) !important; }
  .navtoggle{ display:none; }
  @media (max-width: 860px){
    .navlinks{ display:none; }
  }

  /* ---------- HERO ---------- */
  .hero{
    position: relative;
    background: var(--navy);
    color: var(--cream);
    padding: 120px 0 96px;
    overflow: hidden;
  }
  .board-texture{
    position:absolute; inset:0; opacity: 0.5;
    background-image:
      repeating-linear-gradient(90deg, rgba(185,138,46,0.05) 0 96px, transparent 96px 192px),
      repeating-linear-gradient(0deg, rgba(185,138,46,0.05) 0 96px, transparent 96px 192px);
    mask-image: radial-gradient(ellipse at 70% 30%, black 0%, transparent 72%);
  }
  .hero-grid{
    position: relative;
    display:grid; grid-template-columns: 1.15fr 0.85fr; gap: 56px; align-items:center;
  }
  @media (max-width: 900px){ .hero-grid{ grid-template-columns: 1fr; } }

  .hero .eyebrow{ color: var(--gold-bright); margin-bottom: 18px; }
  .hero h1{
    font-size: clamp(2.5rem, 4.4vw, 3.6rem);
    line-height: 1.06;
    color: var(--cream);
  }
  .hero h1 em{ font-style: normal; font-weight: 900; color: var(--gold-bright); }
  .hero p.lede{
    font-size: 1.12rem; color: rgba(251,248,241,0.82); max-width: 46ch;
    margin-top: 22px;
  }
  .cta-row{ display:flex; gap:16px; margin-top: 36px; flex-wrap: wrap; }
  .btn{
    display:inline-flex; align-items:center; gap:8px;
    padding: 13px 24px; border-radius: var(--radius);
    font-weight: 600; font-size: 0.96rem; text-decoration:none;
    transition: transform .18s ease, background .18s ease, color .18s ease;
    border: 1px solid transparent;
  }
  .btn-gold{ background: var(--gold-bright); color: var(--navy); }
  .btn-gold:hover{ transform: translateY(-2px); background: var(--cream); }
  .btn-ghost{ border-color: rgba(251,248,241,0.4); color: var(--cream); }
  .btn-ghost:hover{ border-color: var(--gold-bright); color: var(--gold-bright); transform: translateY(-2px); }

  .credentials{ display:flex; gap: 34px; margin-top: 54px; flex-wrap: wrap; }
  .credentials div{ border-left: 2px solid var(--gold); padding-left: 14px; }
  .credentials .num{ font-family:'Aptos Black','Hanken Grotesk',sans-serif; font-size:1.7rem; font-weight:800; color: var(--gold-bright); }
  .credentials .lbl{ font-size: 0.82rem; color: rgba(251,248,241,0.68); margin-top: 2px; }

  /* hero board graphic */
  .hero-board{
    position: relative; aspect-ratio: 1/1; max-width: 420px; margin: 0 auto;
  }
  .board-grid{
    display:grid; grid-template-columns: repeat(5,1fr); grid-template-rows: repeat(5,1fr);
    gap: 5px; width:100%; height:100%;
  }
  .sq{
    background: rgba(251,248,241,0.05);
    border: 1px solid rgba(185,138,46,0.14);
    position: relative;
  }
  .sq.lit{
    background: rgba(185,138,46,0.16);
    border-color: rgba(214,169,74,0.55);
    animation: glow 3.6s ease-in-out infinite;
  }
  .sq.lit:nth-child(3n){ animation-delay: .6s; }
  .sq.lit:nth-child(4n){ animation-delay: 1.3s; }
  @keyframes glow{
    0%,100%{ box-shadow: 0 0 0 rgba(214,169,74,0); }
    50%{ box-shadow: 0 0 18px rgba(214,169,74,0.35) inset; }
  }
  @media (prefers-reduced-motion: reduce){ .sq.lit{ animation:none; } }

  /* ---------- SERVICES ---------- */
  /* ---------- PROBLEM ---------- */
  .problem{ background: var(--paper); }
  .problem-row{ display:grid; grid-template-columns: 1fr 1fr; gap: 24px; }
  @media (max-width: 800px){ .problem-row{ grid-template-columns: 1fr; } }
  .problem-card{
    background:#fff; border: 1px solid rgba(4,0,37,0.1); border-radius: var(--radius);
    padding: 30px 28px;
  }
  .problem-card .eyebrow{ color: var(--gold-deep); }
  .problem-card h3{ font-size: 1.3rem; margin-top: 10px; }
  .problem-card p{ color:#4a4460; font-size:0.96rem; margin-top: 12px; }

  .specialization-card{
    margin-top: 24px; background: var(--navy); border-radius: var(--radius);
    padding: 30px 32px;
  }
  .specialization-card .eyebrow{ color: var(--gold-bright); }
  .specialization-card h3{ color: var(--cream); font-size: 1.4rem; margin-top: 10px; }
  .specialization-card p{ color: rgba(251,248,241,0.8); margin-top: 10px; font-size: 0.96rem; max-width: 780px; }

  .services{ background: var(--cream); }
  .audit{ background: var(--paper); }
  .services-row{
    display:grid; grid-template-columns: 1fr auto 1fr auto 1.15fr; gap: 20px; align-items:stretch;
  }
  @media (max-width: 980px){
    .services-row{ grid-template-columns: 1fr; }
    .service-op{ margin: 0 auto; }
  }
  .service-op{
    display:flex; align-items:center; justify-content:center;
    font-family:'Aptos Black','Hanken Grotesk',sans-serif; font-weight:900; font-size: 1.8rem;
    color: var(--gold-deep);
  }
  .service-card{
    border: 1px solid rgba(4,0,37,0.12); border-radius: var(--radius);
    padding: 30px 26px; background:#fff;
    display:flex; flex-direction:column;
  }
  .service-card .eyebrow{ color: var(--gold-deep); }
  .service-card h3{ font-size: 1.5rem; margin-top: 10px; }
  .service-card p{ color:#4a4460; font-size:0.94rem; margin-top: 10px; }
  .service-card--sum{
    background: var(--navy); border-color: var(--navy);
  }
  .service-card--sum .eyebrow{ color: var(--gold-bright); }
  .service-card--sum h3{ color: var(--cream); }
  .service-card--sum p{ color: rgba(251,248,241,0.78); }

  /* ---------- POSITIONING ---------- */
  .positioning{ background: var(--cream); text-align:center; padding: 88px 0; }
  .positioning .statement{
    max-width: 780px; margin: 0 auto;
    font-family:'Aptos Black','Hanken Grotesk',sans-serif; font-weight:700; font-size: clamp(1.4rem, 2.6vw, 1.9rem);
    line-height: 1.42; color: var(--navy);
  }
  .positioning .statement span{ color: var(--gold-deep); }

  /* ---------- FRAMEWORK ---------- */
  .framework{
    background: var(--paper);
    background-image:
      linear-gradient(45deg, rgba(4,0,37,0.035) 25%, transparent 25%),
      linear-gradient(-45deg, rgba(4,0,37,0.035) 25%, transparent 25%),
      linear-gradient(45deg, transparent 75%, rgba(4,0,37,0.035) 75%),
      linear-gradient(-45deg, transparent 75%, rgba(4,0,37,0.035) 75%);
    background-size: 64px 64px;
    background-position: 0 0, 0 32px, 32px -32px, -32px 0px;
  }
  .section-head{ max-width: 640px; margin-bottom: 56px; }
  .section-head .eyebrow{ color: var(--gold-deep); margin-bottom: 12px; }
  .section-head h2{ font-size: clamp(1.9rem, 3.4vw, 2.6rem); }
  .section-head p{ margin-top: 14px; color: #4a4460; font-size: 1.02rem; }
  .framework-teaser{
    font-family:'Aptos Black','Hanken Grotesk',sans-serif; font-weight:700 !important;
    color: var(--gold-bright) !important; max-width: 560px; margin: 14px auto 0 !important;
  }
  .crisp-statement{
    font-family:'Aptos Black','Hanken Grotesk',sans-serif; font-weight: 800 !important;
    font-size: clamp(1.4rem, 2.6vw, 1.9rem) !important; color: var(--navy) !important;
    margin-top: 16px !important;
  }

  .piece-row{
    display:grid; grid-template-columns: repeat(3, 1fr); gap: 22px;
  }
  @media (max-width: 860px){ .piece-row{ grid-template-columns: 1fr; max-width: 520px; } }

  .flip-card{ perspective: 1400px; height: 320px; }
  .flip-inner{
    position:relative; width:100%; height:100%;
    transform-style: preserve-3d;
    transition: transform .65s cubic-bezier(.2,.7,.3,1);
  }
  .flip-card:hover .flip-inner, .flip-card:focus-within .flip-inner{ transform: rotateY(180deg); }
  .flip-face{
    position:absolute; inset:0; backface-visibility:hidden;
    border-radius: var(--radius); padding: 22px 20px;
    display:flex; flex-direction:column;
  }
  .flip-front{
    background: var(--navy); color: var(--cream);
    border: 1px solid var(--gold-deep);
    justify-content: space-between;
  }
  .flip-front .rank{ font-family:'IBM Plex Mono',monospace; font-size:0.68rem; letter-spacing:0.14em; color: var(--gold-bright); text-transform:uppercase; }
  .flip-front .piece-name{ font-family:'Aptos Black','Hanken Grotesk',sans-serif; font-size:1.6rem; line-height:1.15; font-weight:800; }
  .flip-front .piece-role{ font-size:0.92rem; line-height:1.4; color: rgba(251,248,241,0.75); margin-top:12px; }
  .flip-front .hint{ font-size: 0.75rem; color: rgba(214,169,74,0.75); margin-top: auto; }
  .scan-link{
    display:inline-block; margin-top: 12px; font-family:'IBM Plex Mono',monospace; font-size: 0.76rem;
    color: var(--gold-deep); text-decoration:none; border-bottom: 1px dashed var(--gold-deep);
  }
  .scan-link:hover{ color: var(--navy); border-color: var(--navy); }
  .flip-back{
    background: var(--gold-bright); color: var(--navy);
    transform: rotateY(180deg);
    justify-content:flex-start; overflow-y:auto;
  }
  .flip-back .pillar{ font-family:'IBM Plex Mono',monospace; font-size:0.68rem; letter-spacing:0.1em; text-transform:uppercase; opacity:0.7; }
  .flip-back p{ margin: 8px 0 0; font-size: 0.86rem; line-height:1.42; }
  .flip-back .topic-list{ list-style:none; margin: 8px 0 0; padding:0; }
  .flip-back .topic-list li{
    font-size: 0.78rem; line-height: 1.35; color: var(--navy);
    padding: 5px 0 5px 16px; position:relative;
  }
  .flip-back .topic-list li strong{ font-weight: 800; }
  .flip-back .topic-list li::before{
    content:''; position:absolute; left:0; top:12px; width:5px; height:5px;
    background: var(--navy); border-radius:50%;
  }

  .framework-cta{
    margin-top: 48px; padding: 40px 36px; background: var(--slate); border-radius: var(--radius);
    text-align:center;
  }
  .framework-cta h3{ color: var(--cream); font-size: clamp(1.4rem, 2.6vw, 1.9rem); font-family:'Aptos Black','Hanken Grotesk',sans-serif; font-weight:800; }
  .framework-cta p{ color: rgba(251,248,241,0.78); margin: 12px auto 0; max-width: 520px; font-size: 0.98rem; }
  .framework-cta .btn{ margin-top: 24px; }
  .levels{
    list-style:none; margin: 28px auto 0; padding:0; max-width: 900px;
    display:grid; grid-template-columns: repeat(4, 1fr); gap: 12px; text-align:left;
  }
  @media (max-width: 860px){ .levels{ grid-template-columns: repeat(2, 1fr); } }
  @media (max-width: 480px){ .levels{ grid-template-columns: 1fr; } }
  .levels li{
    display:flex; flex-direction:column; gap:4px; padding: 16px 16px 18px;
    border:1px solid rgba(214,169,74,0.35); border-top: 3px solid var(--gold-bright); border-radius: var(--radius);
  }
  .levels li:nth-child(1){ border-top-color: rgba(214,169,74,0.35); }
  .levels li:nth-child(2){ border-top-color: rgba(214,169,74,0.6); }
  .levels li:nth-child(3){ border-top-color: rgba(214,169,74,0.82); }
  .lv-num{ font-size: 0.78rem; color: rgba(251,248,241,0.6); }
  .levels strong{ color: var(--gold-bright); font-size: 1.08rem; }
  .lv-desc{ color: rgba(251,248,241,0.8); font-size: 0.88rem; line-height:1.4; }
  .cta-levels-caption{ font-size: 0.9rem !important; margin-top: 20px !important; max-width: 560px !important; }

  /* maturity report preview */
  .report{ margin-top: 40px; display:grid; grid-template-columns: 0.8fr 1.2fr; gap: 48px; align-items:start; }
  @media (max-width: 980px){ .report{ grid-template-columns: 1fr; gap: 32px; } }
  .report-intro h3{ font-size: clamp(1.4rem, 2.4vw, 1.75rem); line-height:1.2; }
  .report-intro > p{ color:#4a4460; margin: 12px 0 0; }
  .report-contents{ margin: 18px 0 28px; padding-left: 20px; color:#4a4460; font-size: 0.96rem; }
  .report-contents li{ margin-bottom: 8px; }
  .report-pages{ display:grid; grid-template-columns: 1fr 1fr; gap: 16px; }
  @media (max-width: 640px){ .report-pages{ grid-template-columns: 1fr; } }
  .page{
    margin:0; background:#fff; border:1px solid rgba(4,0,37,0.14); border-radius: var(--radius);
    padding: 20px 18px 22px; font-size: 0.8rem; line-height:1.4; color: var(--navy);
    border-top: 5px solid var(--navy);
  }
  .page:nth-child(2){ border-top-color: var(--gold); }
  .page-stamp{
    display:inline-block; margin:0 0 12px; padding: 3px 8px; font-size: 0.7rem; font-weight:600;
    color: var(--gold-deep); border:1px solid rgba(124,90,30,0.4); border-radius: var(--radius);
  }
  .page-kicker{ margin:0; font-size:0.72rem; font-weight:700; color: var(--gold-deep); }
  .page-title{ margin: 4px 0 14px; font-weight:800; font-size: 0.92rem; line-height:1.3; }
  .page-sub{ margin: 14px 0 6px; font-weight:700; font-size:0.74rem; color: var(--navy); }
  .overall{ background: var(--paper); padding: 10px 12px; border-radius: var(--radius); }
  .overall-score span{ font-size: 1.7rem; font-weight:900; line-height:1; }
  .overall-score small{ display:block; font-size:0.7rem; color:#4a4460; margin-top:2px; }
  .scale{ position:relative; display:grid; grid-template-columns: repeat(4,1fr); margin-top: 10px; padding-top: 10px; }
  .scale::before{ content:''; position:absolute; left:0; right:0; top:0; height:4px; background: rgba(4,0,37,0.12); }
  .scale i{ position:absolute; top:-3px; left: var(--at); width:10px; height:10px; background: var(--gold); transform: translateX(-50%) rotate(45deg); }
  .scale{ column-gap: 6px; }
  .scale{ grid-template-columns: repeat(4, minmax(0,1fr)); }
  .scale b{ font-size: 0.56rem; font-weight:600; color:#4a4460; white-space:nowrap; letter-spacing:-0.01em; }
  .scale b:first-of-type{ color: var(--navy); }
  .pillars, .items, .themes{ list-style:none; margin: 12px 0 0; padding:0; }
  .pillars li, .items li{ display:grid; grid-template-columns: 1fr auto; gap: 2px 8px; align-items:center; margin-bottom: 8px; }
  .pillars span{ font-weight:600; }
  .bar{ grid-column: 1 / -1; display:block; height:5px; background: rgba(4,0,37,0.1); position:relative; }
  .bar::after{ content:''; position:absolute; inset:0 auto 0 0; width: var(--v); background: var(--navy); }
  .bar::before{ content:''; position:absolute; top:-2px; bottom:-2px; left:75%; width:1px; background: var(--gold); }
  .themes li{ margin-bottom: 9px; }
  .themes strong{ display:block; font-size: 0.78rem; margin-bottom: 4px; }
  .rx{ display:block; height: 7px; width: var(--w); margin: 4px 0; background: rgba(4,0,37,0.13); border-radius: 1px; }
  .items .rx{ height: 9px; margin:0; }
  .inplace{ display:grid; grid-template-columns: 1fr 1fr; gap: 12px; }
  .masked-note{ margin: 14px 0 0; font-size: 0.72rem; color:#4a4460; font-style: italic; }

  /* ---------- PROOF ---------- */
  .proof{ background: var(--navy); color: var(--cream); }
  .proof-grid{ display:grid; grid-template-columns: 0.9fr 1.1fr; gap: 64px; align-items:center; }
  @media (max-width: 900px){ .proof-grid{ grid-template-columns:1fr; gap:36px; } }
  .proof .eyebrow{ color: var(--gold-bright); }
  .proof h2{ color: var(--cream); font-size: clamp(1.9rem, 3.2vw, 2.4rem); margin-top:14px; }
  .proof p{ color: rgba(251,248,241,0.78); margin-top: 16px; }
  .proof-stats{ display:grid; grid-template-columns: repeat(2,1fr); gap: 24px; }
  .stat-card{
    border: 1px solid rgba(185,138,46,0.3); padding: 26px 22px; border-radius: var(--radius);
    background: rgba(251,248,241,0.03);
  }
  .stat-card .stat-num{ font-family:'Aptos Black','Hanken Grotesk',sans-serif; font-size:2.1rem; font-weight:800; color:var(--gold-bright); }
  .stat-card .stat-lbl{ font-size:0.86rem; color: rgba(251,248,241,0.65); margin-top:6px; }

  /* ---------- PARTNER ---------- */
  .partner{ background: var(--cream); }
  .direct-card{
    background: var(--navy); color: var(--cream); border-radius: var(--radius);
    padding: 30px 32px; margin-bottom: 44px; max-width: 720px;
  }
  .direct-card .eyebrow{ color: var(--gold-bright); }
  .direct-card h3{ color: var(--cream); font-size: 1.4rem; margin-top: 10px; }
  .direct-card p:last-child{ color: rgba(251,248,241,0.8); margin-top: 10px; font-size: 0.96rem; }
  .subhead-agencies{
    font-family:'IBM Plex Mono',monospace; font-size:0.78rem; letter-spacing:0.1em; text-transform:uppercase;
    color: var(--gold-deep); margin: 0 0 18px;
  }
  .model-row{ display:grid; grid-template-columns: repeat(3,1fr); gap: 22px; }
  @media (max-width: 900px){ .model-row{ grid-template-columns:1fr; } }
  .model-card{
    border: 1px solid rgba(4,0,37,0.12); border-radius: var(--radius);
    padding: 30px 26px; background: #fff;
    transition: border-color .2s ease, transform .2s ease;
  }
  .model-card:hover{ border-color: var(--gold); transform: translateY(-4px); }
  .model-card .eyebrow{ color: var(--gold-deep); }
  .model-card h3{ font-size: 1.28rem; margin-top: 10px; }
  .model-card p{ color:#4a4460; font-size:0.94rem; margin-top: 10px; }
  .model-card ul{ margin: 16px 0 0; padding-left: 18px; color:#4a4460; font-size:0.9rem; }
  .model-card li{ margin-bottom:6px; }

  /* ---------- INNOVATION ---------- */
  .innovation{ background: var(--cream); border-top: 1px solid rgba(4,0,37,0.08); }
  .innovation-grid{ display:grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items:start; }
  @media (max-width: 900px){ .innovation-grid{ grid-template-columns: 1fr; gap: 40px; } }
  .innovation .eyebrow{ color: var(--gold-deep); margin-bottom: 12px; }
  .innovation h2{ font-size: clamp(1.9rem, 3.4vw, 2.6rem); line-height: 1.12; }
  .innovation-intro p{ color:#4a4460; margin: 16px 0 0; max-width: 52ch; }
  .innovation-links{ display:flex; align-items:center; flex-wrap:wrap; gap: 14px 26px; margin-top: 30px; }
  .btn-navy{ background: var(--navy); color: var(--cream); }
  .btn-navy:hover{ background: var(--gold-deep); transform: translateY(-2px); }
  .text-link{ color: var(--gold-deep); font-weight: 600; font-size: 0.96rem; text-decoration: underline; text-underline-offset: 4px; }
  .text-link:hover{ color: var(--navy); }
  .innovation-uses{ display:grid; gap: 18px; }
  .use-card{ border: 1px solid rgba(4,0,37,0.12); border-radius: var(--radius); padding: 26px 26px 28px; background:#fff; }
  .use-card h3{ font-size: 1.25rem; }
  .use-card p{ color:#4a4460; font-size: 0.95rem; margin: 10px 0 0; }
  .use-card--angle{ background: var(--navy); border-color: var(--navy); }
  .use-card--angle h3{ color: var(--cream); }
  .use-card--angle p{ color: rgba(251,248,241,0.8); }
  .use-card--angle .use-label{ color: var(--gold-bright); font-weight: 600; font-size: 0.86rem; margin: 0 0 8px; }

  /* ---------- ABOUT ---------- */
  .about{ background: var(--paper); }
  .about-grid{ display:grid; grid-template-columns: 0.8fr 1.2fr; gap: 56px; align-items:center; }
  @media (max-width: 900px){ .about-grid{ grid-template-columns:1fr; gap: 32px; } }
  .about h2{ font-size: clamp(1.9rem, 3.4vw, 2.6rem); }
  .about .eyebrow{ color: var(--gold-deep); margin-bottom: 12px; }
  .about p{ color:#4a4460; margin-top:14px; }
  .about-photo{ margin:0; position:relative; max-width: 420px; }
  @media (max-width: 900px){ .about-photo{ max-width: 320px; } }
  .about-photo::before{ content:''; position:absolute; inset: 14px -14px -14px 14px; border: 2px solid var(--gold); border-radius: var(--radius); }
  .about-photo img{ position:relative; display:block; width:100%; height:auto; border-radius: var(--radius); }

  /* ---------- CONTACT ---------- */
  .contact{ background: var(--navy); color: var(--cream); text-align:center; }
  .contact h2{ color: var(--cream); font-size: clamp(2rem, 3.6vw, 2.8rem); }
  .contact p{ color: rgba(251,248,241,0.78); max-width: 540px; margin: 18px auto 0; }
  .contact .btn{ margin-top: 34px; }
  .contact .email-link{
    display:block; margin-top: 22px; font-family:'IBM Plex Mono',monospace;
    color: var(--gold-bright); font-size: 1rem; text-decoration:none;
  }
  .contact .email-link:hover{ text-decoration: underline; }

  .contact-grid{
    display:grid; grid-template-columns: 0.85fr 1.15fr; gap: 64px;
    align-items:start; text-align:left;
  }
  @media (max-width: 900px){ .contact-grid{ grid-template-columns: 1fr; gap: 40px; } }
  .contact-intro p{ margin: 18px 0 0; max-width: 44ch; }
  .contact-intro .email-link{ margin-top: 10px; }
  .contact-form{
    border: 1px solid rgba(185,138,46,0.35); border-radius: var(--radius);
    background: rgba(251,248,241,0.03); padding: 32px 30px;
  }
  @media (max-width: 560px){ .contact-form{ padding: 24px 18px; } }
  .contact-form fieldset{ border:0; margin:0 0 22px; padding:0; min-width:0; }
  .contact-form legend, .contact-form .field label{
    font-size: 0.9rem; font-weight: 600; color: var(--cream); padding:0;
  }
  .contact-form .opt{ font-weight: 400; color: rgba(251,248,241,0.55); }
  .topic-options{ display:flex; flex-wrap:wrap; gap: 8px; margin-top: 10px; }
  .topic-options input{ position:absolute; opacity:0; width:1px; height:1px; pointer-events:none; }
  .topic-options label{
    font-size: 0.86rem; color: var(--gold-bright); cursor:pointer;
    border: 1px solid rgba(214,169,74,0.45); border-radius: 999px; padding: 7px 15px;
    transition: background .15s ease, color .15s ease, border-color .15s ease;
  }
  .topic-options label:hover{ border-color: var(--gold-bright); }
  .topic-options input:checked + label{ background: var(--gold-bright); color: var(--navy); border-color: var(--gold-bright); }
  .topic-options input:focus-visible + label{ outline: 2px solid var(--cream); outline-offset: 2px; }
  .field-row{ display:grid; grid-template-columns: 1fr 1fr; gap: 16px; }
  @media (max-width: 560px){ .field-row{ grid-template-columns: 1fr; gap: 0; } }
  .field{ display:flex; flex-direction:column; gap: 6px; margin-bottom: 18px; }
  .field input, .field textarea{
    font: inherit; font-size: 0.96rem; color: var(--cream);
    background: rgba(251,248,241,0.06); border: 1px solid rgba(251,248,241,0.22);
    border-radius: var(--radius); padding: 11px 13px; width: 100%;
  }
  .field textarea{ resize: vertical; min-height: 120px; }
  .field input:focus, .field textarea:focus{ outline: 2px solid var(--gold-bright); outline-offset: 1px; border-color: var(--gold-bright); }
  .field input[aria-invalid="true"], .field textarea[aria-invalid="true"]{ border-color: #f0a898; }
  .hp{ position:absolute !important; left:-10000px; width:1px; height:1px; overflow:hidden; }
  .contact .contact-form .btn{ margin-top: 6px; font-family: inherit; cursor: pointer; }
  .contact .contact-form .btn:disabled{ opacity: .6; cursor: default; transform:none; }
  .contact .form-status{ margin: 14px 0 0; max-width:none; font-size: 0.92rem; min-height: 1.4em; }
  .contact .form-status.ok{ color: var(--gold-bright); }
  .contact .form-status.err{ color: #f3b8aa; }
  .contact .form-note{ margin: 10px 0 0; max-width:none; font-size: 0.82rem; color: rgba(251,248,241,0.55); }
  .contact .form-note a{ color: rgba(251,248,241,0.8); }
  .footer-meta{ display:flex; gap: 22px; align-items:center; flex-wrap:wrap; }
  .footer-meta a{ color: rgba(251,248,241,0.7); font-size: 0.82rem; }
  .footer-meta a:hover{ color: var(--gold-bright); }

  footer{ background: var(--navy); border-top: 1px solid rgba(185,138,46,0.2); padding: 34px 0; }
  .footer-inner{ display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:18px; }
  .footer-brand{ display:flex; align-items:center; }
  .footer-lockup{ height: 74px; width:auto; }
  .footer-copy{ color: rgba(251,248,241,0.5); font-size: 0.82rem; margin:0; }

  /* ---------- SERVICE CARDS ON TOUCH SCREENS ---------- */
  .hint-tap{ display:none; }
  @media (hover: none){
    .hint-hover{ display:none; }
    .hint-tap{ display:inline; }
  }
  .flip-card.flipped .flip-inner{ transform: rotateY(180deg); }
  @media (hover: none){
    .flip-back::after{ content:'Tap again to close'; display:block; margin-top:auto; padding-top:10px; font-size:0.75rem; opacity:0.7; }
  }

  /* ---------- AUDIT (brief on homepage) ---------- */
  .audit-actions{ display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap: 14px 26px; margin-top: 26px; }
  .framework-cta .audit-actions .btn{ margin-top:0; }
  .audit-link{ color: var(--gold-bright); font-weight:600; font-size:0.96rem; text-underline-offset:4px; }
  .audit-link:hover{ color: var(--cream); }

  /* ---------- FORK: companies / agencies ---------- */
  .fork{ background: var(--paper); }
  .fork-row{ display:grid; grid-template-columns: 1fr 1fr; gap: 20px; }
  @media (max-width: 820px){ .fork-row{ grid-template-columns: 1fr; } }
  .fork-card{
    display:flex; flex-direction:column; gap: 10px; text-decoration:none;
    padding: 30px 28px; border-radius: var(--radius); border:1px solid transparent;
    transition: transform .18s ease, border-color .18s ease;
  }
  .fork-card:hover{ transform: translateY(-3px); }
  @media (prefers-reduced-motion: reduce){ .fork-card, .fork-card:hover{ transition:none; transform:none; } }
  .fork-card:focus-visible{ outline: 2px solid var(--gold-deep); outline-offset: 3px; }
  .fork-who{ font-weight:600; font-size:0.95rem; }
  .fork-what{ font-family:'Aptos Black','Hanken Grotesk',sans-serif; font-weight:800; font-size: clamp(1.35rem, 2.4vw, 1.7rem); line-height:1.2; }
  .fork-card ul{ margin: 6px 0 10px; padding-left: 18px; font-size: 0.95rem; }
  .fork-card li{ margin-bottom: 6px; }
  .fork-go{ margin-top:auto; font-weight:700; }
  .fork-card--company{ background: var(--gold-bright); color: var(--navy); }
  .fork-card--company ul{ color: rgba(4,0,37,0.78); }
  .fork-card--agency{ background: var(--navy); color: var(--cream); }
  .fork-card--agency .fork-who, .fork-card--agency .fork-go{ color: var(--gold-bright); }
  .fork-card--agency ul{ color: rgba(251,248,241,0.8); }
  .fork-card--agency:hover{ border-color: var(--gold-bright); }

  /* ---------- SUBPAGES (companies / agencies) ---------- */
  .navlinks a[aria-current="page"]{ color: var(--gold-bright); }
  .sub-hero{ padding: 104px 0 84px; }
  .sub-hero-inner{ position:relative; max-width: 820px; }
  .sub-hero .lede{ font-size: 1.12rem; color: rgba(251,248,241,0.82); max-width: 54ch; margin-top: 22px; }
  .starting{ background: var(--paper); }

  .services-detail{ background: var(--cream); }
  .svc{
    display:grid; grid-template-columns: 0.75fr 1.25fr; gap: 12px 56px;
    padding: 40px 0; border-top: 1px solid rgba(4,0,37,0.12);
  }
  .svc:last-child{ padding-bottom: 0; }
  @media (max-width: 900px){ .svc{ grid-template-columns: 1fr; } }
  .svc-head{ align-self:start; }
  .svc-q{ color:#4a4460; margin: 10px 0 0; font-size: 1.04rem; max-width: 32ch; }
  .svc h3{ font-size: clamp(1.6rem, 2.8vw, 2.1rem); }
  .svc-main{ display:flex; flex-direction:column; gap: 16px; min-width:0; }
  .svc-label{ margin:0 0 6px; font-weight:700; font-size: 0.92rem; color: var(--gold-deep); }
  /* problem -> solution, one row per audit item */
  .pairs-head, .pairs li{ display:grid; grid-template-columns: 1fr 1fr; gap: 28px; }
  .pairs-head span{ font-weight:700; font-size: 0.92rem; color: var(--gold-deep); padding-bottom: 8px; }
  .pairs{ list-style:none; margin:0; padding:0; }
  .pairs li{ padding: 12px 0; border-top: 1px solid rgba(4,0,37,0.1); font-size: 0.96rem; }
  .pairs .pr{ color:#4a4460; }
  .pairs .so{ color: var(--navy); position:relative; }
  .pairs .so::before{ content:'→'; position:absolute; left:-20px; color: var(--gold); font-weight:700; }
  @media (max-width: 640px){
    .pairs-head{ display:none; }
    .pairs li{ grid-template-columns: 1fr; gap: 6px; }
    .pairs .so{ padding-left: 20px; }
    .pairs .so::before{ left:0; }
  }
  .svc-scenarios{ display:grid; grid-template-columns: 1fr 1fr; gap: 14px; }
  @media (max-width: 640px){ .svc-scenarios{ grid-template-columns: 1fr; } }
  .svc-scenarios > div{ background:#fff; border:1px solid rgba(4,0,37,0.12); border-radius: var(--radius); padding: 16px 18px; }
  .svc-scenarios p{ margin:0; color:#4a4460; font-size: 0.94rem; }
  .svc-scenarios .svc-label{ color: var(--navy); }
  .svc-note{ margin:0; color: var(--navy); font-weight:600; font-size: 0.98rem; }
  .svc-result{ margin: 6px 0 0; padding: 14px 18px; background: var(--paper); border-left: 3px solid var(--gold); font-size: 0.98rem; }
  .svc-proof{ margin: 0; color:#4a4460; font-size: 0.92rem; }
  .transform{
    display:grid; grid-template-columns: 0.75fr 1.25fr; gap: 12px 56px; margin-top: 48px;
    background: var(--navy); color: var(--cream); padding: 36px 36px; border-radius: var(--radius);
  }
  @media (max-width: 900px){ .transform{ grid-template-columns: 1fr; padding: 28px 22px; } }
  .transform .eyebrow{ color: var(--gold-bright); margin-bottom: 10px; }
  .transform h3{ color: var(--cream); font-size: clamp(1.35rem, 2.4vw, 1.7rem); }
  .transform p, .transform li{ color: rgba(251,248,241,0.82); font-size: 0.97rem; }
  .transform p{ margin:0; }
  .transform ul{ margin: 12px 0 0; padding-left: 18px; }
  .transform li{ margin-bottom: 8px; }
  .transform strong{ color: var(--gold-bright); }
  .svc-cta{ justify-self:start; align-self:flex-start; color: var(--gold-deep); font-weight:700; text-underline-offset:4px; }
  .svc-cta:hover{ color: var(--navy); }

  .process{ background: var(--cream); }
  .steps{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
  @media (max-width: 900px){ .steps{ grid-template-columns: 1fr; } }
  .steps li{ background:#fff; border:1px solid rgba(4,0,37,0.12); border-radius: var(--radius); padding: 28px 26px; position:relative; }
  .step-num{
    display:inline-flex; align-items:center; justify-content:center; width: 36px; height: 36px;
    background: var(--navy); color: var(--gold-bright); font-weight:800; border-radius: var(--radius);
  }
  .steps h3{ font-size: 1.25rem; margin-top: 14px; }
  .steps p{ color:#4a4460; font-size: 0.95rem; margin: 10px 0 0; }

  .why{ background: var(--paper); }
  .why-grid{ display:grid; grid-template-columns: repeat(4, 1fr); gap: 28px; }
  @media (max-width: 980px){ .why-grid{ grid-template-columns: repeat(2, 1fr); } }
  @media (max-width: 560px){ .why-grid{ grid-template-columns: 1fr; } }
  .why-grid > div{ border-top: 3px solid var(--gold); padding-top: 16px; }
  .why-grid h3{ font-size: 1.15rem; }
  .why-grid p{ color:#4a4460; font-size: 0.95rem; margin: 8px 0 0; }

  .model-sub{ margin: 18px 0 0; font-weight:700; font-size: 0.88rem; color: var(--gold-deep); }
  .model-card .model-sub + ul{ margin-top: 8px; }
  .model-fit{ margin-top: 14px !important; padding-top: 14px; border-top: 1px solid rgba(4,0,37,0.1); }

  .agency-audit{ text-align:left; }
  .agency-audit h3, .agency-audit .framework-teaser{ text-align:center; }
  .offer-steps{
    list-style:none; margin: 28px auto 0; padding:0; max-width: 900px; counter-reset: os;
    display:grid; grid-template-columns: repeat(4, 1fr); gap: 16px;
  }
  @media (max-width: 860px){ .offer-steps{ grid-template-columns: 1fr 1fr; } }
  @media (max-width: 480px){ .offer-steps{ grid-template-columns: 1fr; } }
  .offer-steps li{ counter-increment: os; display:flex; flex-direction:column; gap: 6px; }
  .offer-steps li::before{ content: counter(os); color: var(--gold-bright); font-weight:800; font-size: 1.3rem; }
  .offer-steps strong{ color: var(--cream); font-size: 1rem; }
  .offer-steps span{ color: rgba(251,248,241,0.78); font-size: 0.9rem; line-height:1.45; }
  .levels--compact{ margin-top: 28px; }
  .levels--compact li{ padding: 10px 14px 12px; }

  .offer{ background: var(--cream); }
  .offer-grid{ display:grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
  @media (max-width: 900px){ .offer-grid{ grid-template-columns: 1fr; } }
  .offer-card{ background:#fff; border:1px solid rgba(4,0,37,0.12); border-radius: var(--radius); padding: 28px 26px; }
  .offer-card h3{ font-size: 1.35rem; }
  .offer-q{ color: var(--gold-deep); font-weight:600; margin: 8px 0 0; }
  .offer-card p:last-child{ color:#4a4460; font-size: 0.95rem; margin: 10px 0 0; }

  /* agencies: Pega partners + offer lists */
  .pega{ background: var(--paper); }
  .pega-box{ background: var(--slate); color: var(--cream); border-radius: var(--radius); padding: 40px 36px; }
  @media (max-width: 600px){ .pega-box{ padding: 28px 20px; } }
  .pega-grid{ display:grid; grid-template-columns: 1fr 1fr; gap: 20px; }
  @media (max-width: 860px){ .pega-grid{ grid-template-columns: 1fr; } }
  .pega-card{ border:1px solid rgba(214,169,74,0.35); border-radius: var(--radius); padding: 26px 26px; }
  .pega-card h3{ color: var(--gold-bright); font-size: 1.2rem; }
  .pega-card ul{ margin: 12px 0 0; padding-left: 18px; }
  .pega-card li{ color: rgba(251,248,241,0.85); font-size: 0.96rem; margin-bottom: 8px; }
  .pega-proof{ margin: 26px 0 0; color: rgba(251,248,241,0.75); font-size: 0.95rem; max-width: 72ch; }
  .pega-actions{ margin-top: 26px; }
  .offer-card ul{ margin: 12px 0 0; padding-left: 18px; color:#4a4460; font-size: 0.95rem; }
  .offer-card li{ margin-bottom: 7px; }
  .offer-note{ margin: 24px 0 0; color: var(--navy); font-weight:600; max-width: 72ch; }

  /* Pega CDH profile page */
  .facts{ margin:0; display:grid; grid-template-columns: repeat(2, 1fr); gap: 0 40px; }
  @media (max-width: 760px){ .facts{ grid-template-columns: 1fr; } }
  .facts > div{ display:grid; grid-template-columns: 140px 1fr; gap: 16px; padding: 14px 0; border-top: 1px solid rgba(4,0,37,0.12); }
  @media (max-width: 480px){ .facts > div{ grid-template-columns: 1fr; gap: 2px; } }
  .facts dt{ font-weight:700; color: var(--gold-deep); font-size: 0.92rem; }
  .facts dd{ margin:0; color:#4a4460; font-size: 0.97rem; }
  .offer-grid--2{ grid-template-columns: repeat(2, 1fr); }
  @media (max-width: 860px){ .offer-grid--2{ grid-template-columns: 1fr; } }
  .timeline{ list-style:none; margin:0; padding:0; display:grid; gap: 0; max-width: 760px; }
  .timeline li{ display:grid; grid-template-columns: 160px 1fr; gap: 4px 28px; padding: 22px 0; border-top: 1px solid rgba(4,0,37,0.12); }
  @media (max-width: 600px){ .timeline li{ grid-template-columns: 1fr; } }
  .timeline .tl-when{ margin:0; grid-row: span 2; font-weight:700; color: var(--gold-deep); font-size: 0.92rem; }
  @media (max-width: 600px){ .timeline .tl-when{ grid-row:auto; } }
  .timeline h3{ font-size: 1.2rem; }
  .timeline p{ margin: 0; color:#4a4460; font-size: 0.96rem; }
  .pega-link{ margin: 14px 0 0; }
  .pega-link a{ color: var(--gold-bright); font-weight:700; text-underline-offset:4px; }
  .pega-link a:hover{ color: var(--cream); }
  .footer-meta .footer-links{ display:flex; flex-wrap:wrap; gap: 6px 18px; }
  .pega-actions{ display:flex; flex-wrap:wrap; align-items:center; gap: 14px 26px; }
  .pega-link-inline{ color: var(--gold-bright); font-weight:600; text-underline-offset:4px; }
  .pega-link-inline:hover{ color: var(--cream); }
  .proof .text-link{ color: var(--gold-bright); }
  .proof .text-link:hover{ color: var(--cream); }

  /* keep anchor targets clear of the sticky header */
  html{ scroll-padding-top: 116px; }
  @media (max-width: 900px){ html{ scroll-padding-top: 96px; } }
  .hero-pega{ margin: 22px 0 0; color: rgba(251,248,241,0.75); font-size: 0.97rem; }
  .hero-pega a{ color: var(--gold-bright); font-weight:600; text-underline-offset:4px; }
  .hero-pega a:hover{ color: var(--cream); }

  /* personal touch */
  .hero-person{ display:inline-flex; align-items:center; gap: 14px; margin-top: 30px; text-decoration:none; color: var(--cream); }
  .hero-person img{ width:56px; height:56px; border-radius:50%; border: 2px solid var(--gold-bright); object-fit:cover; flex-shrink:0; }
  .hero-person span{ display:flex; flex-direction:column; font-size: 0.92rem; color: rgba(251,248,241,0.75); line-height:1.35; }
  .hero-person strong{ color: var(--cream); font-weight:700; }
  .hero-person:hover strong{ color: var(--gold-bright); }
  .credentials{ margin-top: 40px; }

  .offboard{ margin-top: 72px; }
  .offboard-title{ font-family:'IBM Plex Mono',monospace; font-size: 0.78rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--gold-deep); font-weight:600; margin:0 0 18px; }
  .offboard-grid{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
  @media (max-width: 980px){ .offboard-grid{ grid-template-columns: repeat(2, 1fr); } }
  @media (max-width: 560px){ .offboard-grid{ grid-template-columns: 1fr; } }
  .offboard-grid li{ background:#fff; border:1px solid rgba(4,0,37,0.1); border-radius: var(--radius); padding: 22px 20px; }
  .ob-icon{ display:inline-flex; width:42px; height:42px; align-items:center; justify-content:center; background: var(--navy); border-radius: var(--radius); }
  .ob-icon svg{ width:22px; height:22px; fill:none; stroke: var(--gold-bright); stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
  .offboard-grid h3{ font-size: 1.08rem; margin-top: 14px; }
  .offboard-grid p{ margin: 6px 0 0; color:#4a4460; font-size: 0.93rem; }

  .contact-person{ display:flex; align-items:center; gap: 14px; margin-top: 26px; }
  .contact-person img{ width:64px; height:64px; border-radius:50%; border: 2px solid var(--gold-bright); object-fit:cover; flex-shrink:0; }
  .contact-person p{ margin:0; display:flex; flex-direction:column; font-size: 0.92rem; color: rgba(251,248,241,0.75); line-height:1.4; text-align:left; }
  .contact-person strong{ color: var(--cream); }

  .sub-hero-person{ position:relative; display:grid; grid-template-columns: 1fr auto; gap: 48px; align-items:center; }
  @media (max-width: 900px){ .sub-hero-person{ grid-template-columns: 1fr; gap: 32px; } }
  .sub-hero-photo{ margin:0; }
  .sub-hero-photo img{ display:block; width: 260px; height:260px; border-radius:50%; border: 3px solid var(--gold-bright); object-fit:cover; }
  @media (max-width: 900px){ .sub-hero-photo{ order:-1; } .sub-hero-photo img{ width:120px; height:120px; } }
  .credentials > div > div{ border:0; padding:0; }