
  :root {
    --ink: #081513;
    --marine: #0E2A29;
    --deep: #123733;
    --paper: #EFF1EC;
    --paper-soft: #E4E7DF;
    --stone: #ECEEE8;
    --muted: #9AAAA3;
    --field: #D5DDD2;
    --copper: #A85F38;
    --gold: #C58A2E;
    --blue: #6E9BB0;
    --line: rgba(236,238,232,.18);
    --paper-line: rgba(14,42,41,.18);
    --serif: "Fraunces", Georgia, serif;
    --mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
    --termH: 30px;
    --hdrH: 68px;
  }

  * { box-sizing: border-box }

  html {
    scroll-behavior: smooth;
    scroll-padding-top: calc(var(--termH) + var(--hdrH) + 24px);
  }

  body {
    margin: 0;
    background: var(--ink);
    color: var(--stone);
    font-family: var(--serif);
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    overflow-x: hidden;
  }

  body::after {
    content: "";
    position: fixed;
    inset: 0;
    z-index: 200;
    pointer-events: none;
    opacity: .04;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  }

  ::selection { background: var(--gold); color: #211706 }

  a { color: inherit }
  p { margin: 0 }

  .skip-link {
    position: fixed;
    top: 8px; left: 8px;
    z-index: 300;
    transform: translateY(-140%);
    background: var(--paper);
    color: var(--ink);
    padding: 10px 14px;
    font-family: var(--mono);
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .08em;
  }
  .skip-link:focus { transform: none }

  /* ── Terminal bar ── */
  .term {
    position: fixed;
    top: 0; left: 0; right: 0;
    z-index: 120;
    height: var(--termH);
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 18px;
    background: #020303;
    color: #6f8880;
    border-bottom: 1px solid rgba(255,255,255,.06);
    font-family: var(--mono);
    font-size: 11px;
    letter-spacing: .04em;
  }
  .term strong { font-weight: 500; color: var(--gold) }
  .cursor {
    display: inline-block;
    width: 7px; height: 13px;
    background: var(--gold);
    animation: blink 1.1s steps(1) infinite;
  }
  @keyframes blink { 50% { opacity: 0 } }

  /* ── Header ── */
  .site-header {
    position: fixed;
    top: var(--termH);
    left: 0; right: 0;
    z-index: 110;
    min-height: var(--hdrH);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 14px clamp(22px, 5vw, 70px);
    background: linear-gradient(180deg, rgba(8,21,19,.96), rgba(8,21,19,.72));
    border-bottom: 1px solid rgba(236,238,232,.07);
    backdrop-filter: blur(10px);
  }

  .mark {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 1.48rem;
    font-weight: 500;
    letter-spacing: .01em;
    text-decoration: none;
    white-space: nowrap;
  }
  .mark-symbol { width: 26px; height: 26px; flex-shrink: 0 }
  .mark b { color: var(--gold); font-weight: 500 }

  .nav {
    display: flex;
    align-items: center;
    gap: clamp(14px, 2.2vw, 32px);
    font-family: var(--mono);
    font-size: 11px;
    letter-spacing: .1em;
    text-transform: uppercase;
  }
  .nav a {
    color: rgba(236,238,232,.7);
    text-decoration: none;
    padding: 7px 0;
    border-bottom: 1px solid transparent;
    transition: color .2s, border-color .2s;
  }
  .nav a:hover, .nav a:focus-visible { color: var(--stone); border-color: var(--gold) }
  .nav .nav-cta { color: var(--stone); border-color: var(--gold) }

  /* ── Section base ── */
  .section {
    position: relative;
    scroll-margin-top: calc(var(--termH) + var(--hdrH) + 24px);
    padding: clamp(86px, 12vw, 150px) clamp(22px, 7vw, 96px);
    overflow: hidden;
  }
  .section:first-of-type {
    padding-top: calc(var(--termH) + var(--hdrH) + clamp(54px, 9vw, 100px));
  }

  .section--marine { background: radial-gradient(110% 95% at 78% 0%, #16443e 0%, var(--marine) 46%, var(--ink) 100%) }
  .section--ink    { background: linear-gradient(145deg, #0a1816 0%, #102d2a 48%, #07100f 100%) }
  .section--paper  { background: linear-gradient(180deg, var(--paper), var(--paper-soft)); color: var(--marine) }
  .section--quiet  { background: #0b1715; padding-top: clamp(56px, 7vw, 110px); padding-bottom: clamp(56px, 7vw, 110px) }
  .section--dark   { background: #060e0d }

  .inner {
    position: relative;
    z-index: 2;
    width: 100%;
    max-width: 1180px;
    margin: 0 auto;
  }

  .grid {
    display: grid;
    grid-template-columns: minmax(0,1.05fr) minmax(280px,.95fr);
    gap: clamp(42px, 7vw, 94px);
    align-items: center;
  }
  .grid--top { align-items: start }

  /* ── Typography ── */
  .eyebrow {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 24px;
    color: var(--gold);
    font-family: var(--serif);
    font-size: clamp(1.25rem, 1.95vw, 1.8rem);
    font-weight: 500;
    letter-spacing: 0;
    text-transform: uppercase;
  }
  .eyebrow::before { display: none }
  .eyebrow--center { justify-content: center }
  /* Hero typography hierarchy: main title > subtitle > lead > labels */
  .hero-title {
    max-width: none;
    font-family: var(--serif);
    font-size: clamp(1.25rem, 1.95vw, 1.8rem);
    font-weight: 500;
    line-height: 1.1;
    letter-spacing: 0;
    text-transform: uppercase;
    color: var(--gold);
  }
  .hero-subtitle {
    max-width: 24ch;
    margin-top: 22px;
    font-family: var(--serif);
    font-size: clamp(1.6rem, 2.8vw, 2.4rem);
    line-height: 1.18;
    color: var(--stone);
  }
  .eyebrow--center::before { display: none }
  .section--paper .eyebrow { color: #8B611C }

  h1, h2, h3, h4 { margin: 0; font-weight: 400; letter-spacing: 0 }
  h1 {
    max-width: 11ch;
    font-size: clamp(3rem, 7.7vw, 7rem);
    line-height: .98;
  }
  h2 {
    max-width: 16ch;
    font-size: clamp(2.15rem, 5vw, 4.8rem);
    line-height: 1.04;
  }
  h3 { font-size: clamp(1.35rem, 2.2vw, 2rem); line-height: 1.14 }

  .gold   { color: var(--gold) }
  .copper { color: var(--copper) }

  .lead {
    max-width: 58ch;
    margin-top: 28px;
    color: var(--field);
    font-family: var(--mono);
    font-size: clamp(.86rem, 1.15vw, .98rem);
    line-height: 1.75;
    letter-spacing: .01em;
  }
  .section--paper .lead { color: #42534d }

  .plain {
    color: rgba(236,238,232,.76);
    font-family: var(--mono);
    font-size: .86rem;
    line-height: 1.8;
  }
  .section--paper .plain { color: #4f625b }

  /* ── Buttons ── */
  .actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 16px;
    margin-top: 38px;
  }

  .button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 14px 24px;
    border: 1px solid rgba(236,238,232,.34);
    color: var(--stone);
    font-family: var(--mono);
    font-size: 12px;
    font-weight: 500;
    letter-spacing: .13em;
    text-transform: uppercase;
    text-decoration: none;
    transition: background .25s, color .25s, border-color .25s;
  }
  .button:hover, .button:focus-visible {
    background: var(--gold);
    border-color: var(--gold);
    color: #241a08;
  }
  .button--ghost {
    border-color: transparent;
    color: var(--muted);
    padding-left: 0; padding-right: 0;
  }
  .button--ghost:hover, .button--ghost:focus-visible {
    background: transparent;
    color: var(--stone);
    border-color: transparent;
  }
  .section--paper .button { color: var(--marine); border-color: rgba(14,42,41,.3) }
  .section--paper .button:hover, .section--paper .button:focus-visible {
    background: var(--marine); border-color: var(--marine); color: var(--stone);
  }

  /* ── Hero proof strip ── */
  .proof-strip {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1px;
    margin-top: clamp(48px, 8vw, 88px);
    background: var(--line);
    border: 1px solid var(--line);
  }
  .proof-item {
    min-height: 118px;
    padding: 22px;
    background: rgba(8,21,19,.54);
  }
  .proof-item b {
    display: block;
    margin-bottom: 10px;
    color: var(--stone);
    font-size: clamp(1.4rem, 2.5vw, 2.25rem);
    font-weight: 400;
    line-height: 1;
  }
  .proof-item span {
    color: var(--muted);
    font-family: var(--mono);
    font-size: 11px;
    letter-spacing: .08em;
    text-transform: uppercase;
  }

  /* ── Hero field map ── */
  .field-map {
    position: relative;
    min-height: 520px;
    border-left: 1px solid var(--line);
    border-right: 1px solid var(--line);
    background:
      linear-gradient(rgba(236,238,232,.055) 1px, transparent 1px),
      linear-gradient(90deg, rgba(236,238,232,.055) 1px, transparent 1px);
    background-size: 42px 42px;
  }
  .field-map canvas { position: absolute; inset: 0; width: 100%; height: 100% }
  .map-label {
    position: absolute;
    max-width: 170px;
    color: rgba(236,238,232,.78);
    font-family: var(--mono);
    font-size: 11px;
    line-height: 1.55;
    letter-spacing: .07em;
    text-transform: uppercase;
  }
  .map-label.one   { top: 12%;  left: 8%;  color: var(--copper) }
  .map-label.two   { right: 7%; top: 29%;  color: var(--blue) }
  .map-label.three { left: 18%; bottom: 11% }
  .map-label.four  { right: 12%; bottom: 19%; color: var(--gold) }
  .map-label.five  { left: 42%; top: 46%; color: var(--blue) }

  /* ── Practice manifesto ── */
  .manifesto {
    max-width: 720px;
    margin: 0;
    text-align: left;
  }
  .manifesto-text {
    font-family: var(--mono);
    font-size: clamp(1.05rem, 2.1vw, 1.6rem);
    line-height: 1.7;
    color: var(--stone);
    font-weight: 400;
    letter-spacing: 0;
    font-style: normal;
    margin-top: 20px;
  }
  .manifesto-text em { font-style: normal; color: var(--gold) }
  .manifesto .eyebrow {
    font-family: var(--serif);
    font-size: clamp(1.25rem, 1.95vw, 1.8rem);
    font-weight: 500;
    letter-spacing: 0;
    text-transform: uppercase;
    color: var(--gold);
  }
  .manifesto .eyebrow::before { display: none }

  /* ── Domains ── */
  .domain-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1px;
    margin-top: 56px;
    background: var(--line);
    border: 1px solid var(--line);
  }

  .domain {
    padding: 36px 30px 40px;
    background: rgba(8,21,19,.6);
    transition: background .3s;
  }
  .domain:hover { background: rgba(13,30,28,.82) }

  .domain-num {
    display: block;
    margin-bottom: 20px;
    font-family: var(--mono);
    font-size: 11px;
    letter-spacing: .2em;
    color: var(--muted);
  }

  .domain-name {
    font-size: clamp(1.28rem, 2vw, 1.75rem);
    line-height: 1.1;
    margin-bottom: 20px;
  }
  .domain--indigenous .domain-name { color: var(--copper) }
  .domain--blue       .domain-name { color: var(--blue) }
  .domain--global     .domain-name { color: var(--gold) }

  .domain-desc {
    color: rgba(236,238,232,.7);
    font-family: var(--mono);
    font-size: .82rem;
    line-height: 1.78;
    margin-bottom: 28px;
  }

  .domain-caps {
    list-style: none;
    margin: 0; padding: 0;
    display: grid;
    gap: 8px;
  }
  .domain-caps li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    color: var(--muted);
    font-family: var(--mono);
    font-size: .78rem;
    line-height: 1.6;
    letter-spacing: .03em;
  }
  .domain-caps li::before { content: "→"; flex-shrink: 0; margin-top: 1px }
  .domain--indigenous .domain-caps li::before { color: var(--copper) }
  .domain--blue       .domain-caps li::before { color: var(--blue) }
  .domain--global     .domain-caps li::before { color: var(--gold) }

  /* ── Selected Work ── */
  .work-list {
    display: grid;
    gap: 1px;
    margin-top: 56px;
    background: var(--line);
    border: 1px solid var(--line);
  }

  .work-item {
    display: grid;
    grid-template-columns: 56px 1fr 1fr;
    gap: 32px;
    padding: 36px 32px;
    background: rgba(8,21,19,.58);
    transition: background .25s;
  }
  .work-item:hover { background: rgba(13,30,28,.76) }

  .work-num {
    color: var(--muted);
    font-family: var(--mono);
    font-size: 11px;
    letter-spacing: .14em;
    padding-top: 4px;
  }

  .work-sector {
    display: inline-flex;
    align-items: center;
    margin-bottom: 16px;
    padding: 5px 10px;
    border: 1px solid;
    font-family: var(--mono);
    font-size: 10px;
    letter-spacing: .12em;
    text-transform: uppercase;
  }
  .work-sector--indigenous  { color: var(--copper); border-color: rgba(168,95,56,.4) }
  .work-sector--blue        { color: var(--blue);   border-color: rgba(110,155,176,.4) }
  .work-sector--global      { color: var(--gold);   border-color: rgba(197,138,46,.4) }
  .work-sector--innovation  { color: var(--muted);  border-color: rgba(154,170,163,.3) }

  .work-title {
    font-size: clamp(1.1rem, 1.8vw, 1.5rem);
    line-height: 1.15;
    margin-bottom: 14px;
  }

  .work-context {
    color: rgba(236,238,232,.66);
    font-family: var(--mono);
    font-size: .82rem;
    line-height: 1.75;
  }

  .work-output-label {
    display: block;
    margin-bottom: 16px;
    color: var(--gold);
    font-family: var(--mono);
    font-size: 10px;
    letter-spacing: .18em;
    text-transform: uppercase;
  }

  .work-outputs {
    list-style: none;
    margin: 0; padding: 0;
    display: grid;
    gap: 10px;
  }
  .work-outputs li {
    color: var(--field);
    font-family: var(--mono);
    font-size: .8rem;
    line-height: 1.6;
    padding-left: 16px;
    position: relative;
  }
  .work-outputs li::before {
    content: "\00B7";
    position: absolute;
    left: 0;
    color: var(--muted);
  }

  /* ── Insights ── */
  .insights-list {
    display: grid;
    gap: 1px;
    margin-top: 48px;
    background: var(--paper-line);
    border: 1px solid var(--paper-line);
  }

  .insight-item {
    display: grid;
    grid-template-columns: 120px 1fr;
    gap: 28px;
    padding: 28px;
    background: rgba(255,255,255,.32);
    transition: background .25s;
    text-decoration: none;
    color: inherit;
  }
  .insight-item:hover { background: rgba(255,255,255,.46) }

  .insight-type {
    color: #8B611C;
    font-family: var(--mono);
    font-size: 10px;
    letter-spacing: .14em;
    text-transform: uppercase;
    padding-top: 4px;
  }

  .insight-title {
    display: block;
    font-size: clamp(1rem, 1.6vw, 1.3rem);
    line-height: 1.2;
    color: var(--marine);
    margin-bottom: 10px;
  }

  .insight-desc {
    color: #50625b;
    font-family: var(--mono);
    font-size: .8rem;
    line-height: 1.72;
  }

  /* ── Track Record ── */
  .record-grid {
    display: grid;
    grid-template-columns: 1fr 1.4fr;
    gap: clamp(48px, 8vw, 110px);
    align-items: start;
  }

  .record-stats {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1px;
    background: var(--paper-line);
    border: 1px solid var(--paper-line);
    margin-bottom: 36px;
  }
  .record-stat {
    padding: 22px;
    background: rgba(255,255,255,.3);
  }
  .record-stat b {
    display: block;
    margin-bottom: 8px;
    color: var(--marine);
    font-size: clamp(1.6rem, 3vw, 2.6rem);
    font-weight: 400;
    line-height: 1;
  }
  .record-stat span {
    color: #62756d;
    font-family: var(--mono);
    font-size: .78rem;
    line-height: 1.55;
    letter-spacing: .04em;
  }

  .client-logos-label {
    color: #8a9e98;
    font-family: var(--mono);
    font-size: 10px;
    letter-spacing: .18em;
    text-transform: uppercase;
    margin-bottom: 14px;
  }
  .logo-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1px;
    background: var(--paper-line);
    border: 1px solid var(--paper-line);
  }
  .logo-item {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 54px;
    padding: 12px 14px;
    background: rgba(255,255,255,.25);
    color: #6d807a;
    font-family: var(--mono);
    font-size: .72rem;
    letter-spacing: .06em;
    text-align: center;
    text-transform: uppercase;
  }

  .record-detail-list {
    display: grid;
    gap: 1px;
    background: var(--paper-line);
    border: 1px solid var(--paper-line);
  }
  .record-detail-item {
    display: grid;
    grid-template-columns: 155px 1fr;
    gap: 24px;
    padding: 24px;
    background: rgba(255,255,255,.3);
  }
  .record-detail-item b {
    color: var(--marine);
    font-size: 1.35rem;
    font-weight: 400;
    line-height: 1.1;
  }
  .record-detail-item span {
    color: #50625b;
    font-family: var(--mono);
    font-size: .82rem;
    line-height: 1.75;
  }

  /* ── Approach ── */
  .approach-intro {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: clamp(40px, 7vw, 90px);
    align-items: start;
    margin-bottom: 56px;
  }

  .principles {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1px;
    background: var(--line);
    border: 1px solid var(--line);
  }
  .principle {
    padding: 32px;
    background: rgba(8,21,19,.5);
  }
  .principle .num {
    display: block;
    margin-bottom: 20px;
    color: var(--gold);
    font-family: var(--mono);
    font-size: 12px;
    letter-spacing: .14em;
  }
  .principle h3 { max-width: 16ch; margin-bottom: 16px }

  /* ── Contact ── */
  .closing { text-align: center }
  .closing h2 { max-width: 14ch; margin: 0 auto }
  .closing .lead { margin-left: auto; margin-right: auto }

  .conversation-types {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    max-width: 800px;
    margin: 34px auto 0;
  }
  .conversation-types span {
    border: 1px solid rgba(236,238,232,.2);
    padding: 9px 13px;
    color: var(--muted);
    font-family: var(--mono);
    font-size: 11px;
    letter-spacing: .08em;
    text-transform: uppercase;
  }

  /* ── Footer ── */
  footer {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    padding: 24px clamp(22px, 7vw, 96px);
    background: #020303;
    color: #6f8880;
    font-family: var(--mono);
    font-size: 11px;
    letter-spacing: .08em;
    text-transform: uppercase;
  }
  footer a { color: #8fa49d; text-decoration: none }
  footer a:hover { color: var(--gold) }

  /* ── Reveal animation ── */
  .reveal {
    opacity: 0;
    transform: translateY(22px);
    transition: opacity .8s cubic-bezier(.2,.7,.2,1), transform .8s cubic-bezier(.2,.7,.2,1);
  }
  .reveal.in { opacity: 1; transform: none }

  .nav-toggle { display: none }

  /* Unified type scale: one size for every title, one for every subtitle */
  h2, h3, .domain-name, .work-title, .insight-title {
    font-size: clamp(1.25rem, 1.95vw, 1.8rem);
  }
  h2 { max-width: none }
  .hero-subtitle {
    font-size: clamp(1.1rem, 1.8vw, 1.5rem);
  }

  /* ── Responsive ── */
  @media (max-width: 960px) {
    .site-header { align-items: flex-start }
    .nav { justify-content: flex-end; flex-wrap: wrap; gap: 10px 18px }
    .grid { grid-template-columns: 1fr }
    .field-map { min-height: 420px }
    .proof-strip { grid-template-columns: 1fr 1fr }
    .domain-grid { grid-template-columns: 1fr 1fr }
    .work-item { grid-template-columns: 40px 1fr; }
    .work-item > div:last-child { grid-column: 2 }
    .record-grid { grid-template-columns: 1fr }
    .approach-intro { grid-template-columns: 1fr }
    .principles { grid-template-columns: 1fr 1fr }
  }

  @media (max-width: 640px) {
    :root { --hdrH: 88px }
    .term { padding: 0 12px; font-size: 10px }
    .site-header { padding: 12px 20px }
    .nav-toggle {
      display: inline-flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 5px;
      width: 44px;
      height: 44px;
      background: none;
      border: 1px solid rgba(236,238,232,.28);
      border-radius: 6px;
      cursor: pointer;
    }
    .nav-toggle__bar {
      display: block;
      width: 20px;
      height: 2px;
      background: var(--stone);
      transition: transform .2s, opacity .2s;
    }
    .site-header.nav-open .nav-toggle__bar:nth-child(1) { transform: translateY(7px) rotate(45deg) }
    .site-header.nav-open .nav-toggle__bar:nth-child(2) { opacity: 0 }
    .site-header.nav-open .nav-toggle__bar:nth-child(3) { transform: translateY(-7px) rotate(-45deg) }
    .nav {
      position: absolute;
      top: 100%;
      left: 0;
      right: 0;
      display: none;
      flex-direction: column;
      align-items: stretch;
      gap: 0;
      background: #020303;
      border-bottom: 1px solid var(--line);
      padding: 10px 20px 16px;
    }
    .site-header.nav-open .nav { display: flex }
    .nav a { padding: 14px 4px; font-size: 12px }
    .nav a:not(.nav-cta) { display: block }
    .nav .nav-cta { margin-top: 12px; text-align: center }
    .section { padding-left: 22px; padding-right: 22px }
    .hero-title { font-size: clamp(1.5rem, 6vw, 2rem); max-width: 12ch }
    .hero-subtitle { font-size: clamp(1.15rem, 4.8vw, 1.6rem) }
    .proof-strip, .domain-grid, .principles { grid-template-columns: 1fr }
    .proof-item { min-height: auto }
    .work-item { grid-template-columns: 1fr; gap: 20px }
    .work-num { display: none }
    .record-stats { grid-template-columns: 1fr 1fr }
    .logo-grid { grid-template-columns: 1fr 1fr }
    .record-detail-item { grid-template-columns: 1fr; gap: 10px }
    .insight-item { grid-template-columns: 1fr; gap: 10px }
    .insight-type { padding-top: 0 }
    footer { display: block }
    footer span { display: block; margin-top: 8px }
  }

  @media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto }
    .cursor { animation: none }
    .reveal { opacity: 1; transform: none; transition: none }
  }

  .mark{gap:7px}
  .mark-word{white-space:nowrap}
  /* Moving marquee */
  .marquee{position:relative;overflow:hidden;background:#0b1715;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:16px 0}
  .marquee__track{display:flex;width:max-content;animation:marquee 42s linear infinite}
  .marquee__item{display:inline-flex;align-items:baseline;gap:10px;padding:0 clamp(20px,3vw,38px);white-space:nowrap;border-right:1px solid rgba(197,138,46,.16)}
  .marquee__item b{font-family:var(--serif);font-size:clamp(1.15rem,1.8vw,1.55rem);font-weight:500;color:var(--gold);line-height:1}
  .marquee__item span{font-family:var(--mono);font-size:11px;letter-spacing:.13em;text-transform:uppercase;color:var(--muted)}
  @keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
  .marquee:hover .marquee__track{animation-play-state:paused}
  @media (prefers-reduced-motion:reduce){.marquee__track{animation:none;flex-wrap:wrap;gap:8px 0}}
  /* Currently / desk faces the Pacific */
  .now-grid{display:grid;grid-template-columns:1.25fr .9fr;gap:clamp(40px,7vw,80px);align-items:center}
  .now-term{border:1px solid var(--line);background:#0a1614;font-family:var(--mono);font-size:.82rem;line-height:1.95;color:var(--field);padding:26px 24px;border-radius:2px}
  .now-term .tprompt{color:var(--gold)}
  .now-term .tline{display:block;white-space:nowrap}
  @media (max-width:960px){.now-grid{grid-template-columns:1fr}}
  /* About (personal) */
  .about-grid{display:grid;grid-template-columns:1.35fr 1fr;gap:clamp(40px,7vw,90px);align-items:start}
  .about-statement{font-size:clamp(1.45rem,3vw,2.35rem);line-height:1.3;font-weight:300;font-style:italic;color:var(--stone);letter-spacing:-.01em}
  .about-statement em{font-style:normal;color:var(--gold)}
  .about-body{margin-top:26px;display:grid;gap:20px}
  .about-heritage{margin-top:28px;padding:22px 26px;border-left:2px solid var(--gold);background:rgba(197,138,46,.06)}
  .about-facts{display:grid;gap:1px;background:var(--line);border:1px solid var(--line)}
  .about-fact{padding:20px 22px;background:rgba(8,21,19,.5)}
  .about-fact b{display:block;color:var(--stone);font-size:1.12rem;font-weight:400;margin-bottom:6px}
  .about-fact span{color:var(--muted);font-family:var(--mono);font-size:.8rem;line-height:1.6}

  .about-photo {
    display: flex;
    justify-content: center;
    align-items: flex-start;
  }
  .about-photo img {
    width: 100%;
    max-width: 300px;
    height: auto;
    border-radius: 16px;
    border: 2px solid rgba(197, 138, 46, .45);
    box-shadow: 0 8px 36px rgba(0, 0, 0, .45);
    display: block;
  }
  @media (max-width: 960px) {
    .about-photo {
      justify-content: flex-start;
    }
    .about-photo img {
      max-width: 240px;
    }
  }
  @media (max-width: 640px) {
    .about-photo img {
      max-width: 180px;
    }
  }

  /* Legacy projects (paper) */
  .legacy-head{margin-top:clamp(58px,8vw,92px)}
  .legacy-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin-top:34px;background:var(--paper-line);border:1px solid var(--paper-line)}
  .legacy-card{padding:26px 24px;background:rgba(255,255,255,.3)}
  .legacy-era{display:block;font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:#8B611C;margin-bottom:14px}
  .legacy-name{font-size:1.18rem;line-height:1.16;color:var(--marine);margin-bottom:12px}
  .legacy-desc{color:#50625b;font-family:var(--mono);font-size:.8rem;line-height:1.7}
  .legacy-metric{margin-top:14px;font-family:var(--mono);font-size:.72rem;letter-spacing:.05em;color:#8B611C;text-transform:uppercase}
  @media (max-width:960px){.about-grid{grid-template-columns:1fr}.legacy-grid{grid-template-columns:1fr 1fr}}
  @media (max-width:640px){.legacy-grid{grid-template-columns:1fr}}

  /* ── Write to me ── */
  .write-section { background: var(--paper); color: var(--ink) }
  .write-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr);
    gap: clamp(40px, 6vw, 80px);
    align-items: start;
  }
  .write-intro h2 {
    color: var(--ink);
    margin-bottom: 18px;
  }
  .write-intro p {
    max-width: 46ch;
    color: #42534d;
    font-family: var(--mono);
    font-size: .86rem;
    line-height: 1.8;
  }
  .write-form { width: 100% }
  .write-field { margin-bottom: 20px }
  .write-field label {
    display: block;
    margin-bottom: 8px;
    color: #8b611c;
    font-family: var(--mono);
    font-size: 11px;
    font-weight: 500;
    letter-spacing: .14em;
    text-transform: uppercase;
  }
  .write-field label .opt {
    color: #6b7a73;
    letter-spacing: 0;
    text-transform: none;
  }
  .write-field input,
  .write-field textarea {
    width: 100%;
    padding: 14px 16px;
    background: #fff;
    border: 1px solid rgba(14, 42, 41, .18);
    border-radius: 2px;
    color: var(--ink);
    font-family: var(--mono);
    font-size: .92rem;
    line-height: 1.5;
    transition: border-color .2s;
  }
  .write-field input::placeholder,
  .write-field textarea::placeholder { color: #8a9e98 }
  .write-field input:focus,
  .write-field textarea:focus {
    border-color: var(--copper);
    outline: none;
  }
  .write-field textarea { min-height: 150px; resize: vertical }
  .write-field input.is-error,
  .write-field textarea.is-error { border-color: #c0392b }
  .write-field__error {
    margin-top: 6px;
    color: #c0392b;
    font-family: var(--mono);
    font-size: .74rem;
    line-height: 1.5;
  }
  .write-submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 14px 32px;
    background: var(--copper);
    border: 1px solid var(--copper);
    border-radius: 2px;
    color: #fff;
    font-family: var(--mono);
    font-size: 12px;
    font-weight: 500;
    letter-spacing: .13em;
    text-transform: uppercase;
    cursor: pointer;
    transition: background .25s, border-color .25s;
  }
  .write-submit:hover { background: #7a4528; border-color: #7a4528 }
  .write-submit:disabled { opacity: .55; cursor: wait }
  .write-foot {
    margin-top: 16px;
    color: #6b7a73;
    font-family: var(--mono);
    font-size: .7rem;
    line-height: 1.6;
  }
  .write-status {
    margin-top: 14px;
    color: #c0392b;
    font-family: var(--mono);
    font-size: .78rem;
    line-height: 1.6;
  }
  .write-success {
    border: 1px solid rgba(14, 42, 41, .18);
    background: #fff;
    padding: 44px 28px;
    text-align: center;
  }
  .write-success .ok {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    margin-bottom: 18px;
    border: 1px solid var(--gold);
    border-radius: 50%;
    color: var(--gold);
    font-size: 24px;
  }
  .write-success h3 {
    color: var(--ink);
    font-family: var(--serif);
    font-size: 1.5rem;
    font-weight: 400;
    margin-bottom: 10px;
  }
  .write-success p {
    color: #42534d;
    font-family: var(--mono);
    font-size: .85rem;
    line-height: 1.7;
  }
  @media (max-width: 760px) {
    .write-grid { grid-template-columns: 1fr }
  }

  .write-intro p + p {
    margin-top: 16px;
  }

  .contact-tags {
    margin-top: 28px;
    color: #8a9e98;
    font-family: var(--mono);
    font-size: 11px;
    letter-spacing: .1em;
    text-transform: uppercase;
    line-height: 1.9;
  }

  .scroll-anchor {
    display: block;
    height: 0;
    overflow: hidden;
  }


  /* Stage two additions */
  .domain-grid--two { grid-template-columns: 1fr 1fr }
  .domain-status {
    display: inline-block; margin-bottom: 18px; padding: 4px 10px;
    border: 1px solid var(--gold); color: var(--gold);
    font-family: var(--mono); font-size: 10px; letter-spacing: .14em; text-transform: uppercase;
  }
  .domain-status--dev { border-color: var(--line); color: var(--stone); opacity: .8 }
  .section-more { margin-top: 36px }
  .nav a[aria-current="page"] { color: var(--stone); border-color: var(--gold) }
  @media (max-width: 640px) { .domain-grid--two { grid-template-columns: 1fr } }
  .map { margin-top: 56px }
  .map-root {
    width: max-content; margin: 0 auto; padding: 10px 24px;
    border: 1px solid var(--gold); color: var(--gold);
    font-family: var(--mono); font-size: 11px; letter-spacing: .16em; text-transform: uppercase;
  }
  .map-stem { width: 1px; height: 34px; margin: 0 auto; background: var(--gold); opacity: .55 }
  .map-branches { display: grid; grid-template-columns: repeat(4, 1fr) }
  .map-node {
    position: relative; display: block; padding: 46px 20px 8px; text-align: center;
    color: inherit; text-decoration: none;
  }
  .map-node::before { content: ""; position: absolute; top: 0; left: 50%; width: 1px; height: 26px; background: var(--gold); opacity: .55 }
  .map-node::after { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 1px; background: var(--gold); opacity: .55 }
  .map-node:first-child::after { left: 50% }
  .map-node:last-child::after { right: 50% }
  .map-name { display: block; font-family: var(--serif); font-size: 1.3rem; line-height: 1.2; color: var(--stone); margin-bottom: 16px }
  .map-node:hover .map-name, .map-node:focus-visible .map-name { color: var(--gold) }
  .map-line { display: block; font-family: var(--mono); font-size: .8rem; line-height: 1.7; color: rgba(236,238,232,.68); margin-bottom: 12px }
  .map-line b { display: block; font-weight: 400; font-size: 10px; letter-spacing: .14em; text-transform: uppercase; color: var(--gold); margin-bottom: 2px }
  .map-go { display: inline-block; margin-top: 6px; font-family: var(--mono); font-size: 10px; letter-spacing: .14em; text-transform: uppercase; color: var(--stone); border-bottom: 1px solid var(--gold); padding-bottom: 3px }
  @media (max-width: 960px) {
    .map-root { margin: 0 }
    .map-stem { margin: 0 0 0 28px; height: 22px }
    .map-branches { grid-template-columns: 1fr; margin-left: 28px; border-left: 1px solid rgba(197,138,46,.55) }
    .map-node { text-align: left; padding: 22px 0 22px 34px }
    .map-node::before { top: 34px; left: 0; width: 22px; height: 1px }
    .map-node::after { display: none }
  }
