/* =============================================================
   SEED — site system (v3 sitemap). Editorial, drafting-table.
   Source Serif 4 / Manrope / IBM Plex Mono · warm graphite ·
   Garrison maroon signal (<2% of view). Hairlines, not cards.
   ============================================================= */
:root{
  --paper:       oklch(0.985 0.003 80);
  --neutral-050: oklch(0.95 0.004 78);
  --neutral-200: oklch(0.88 0.005 75);
  --neutral-400: oklch(0.70 0.005 72);
  --neutral-600: oklch(0.45 0.005 68);
  --neutral-800: oklch(0.28 0.006 65);
  --ink:         oklch(0.14 0.006 65);
  --signal:      oklch(0.42 0.100 22);
  --signal-ink:  oklch(0.34 0.095 22);
  --display: 'Source Serif 4', Georgia, 'Times New Roman', serif;
  --body:    'Manrope', system-ui, -apple-system, sans-serif;
  --mono:    'IBM Plex Mono', ui-monospace, SFMono-Regular, monospace;
  --ease: cubic-bezier(0.16, 1, 0.3, 1);
  --maxw: 1280px;
  --pad: clamp(20px, 5vw, 64px);
}
*{ box-sizing:border-box; margin:0; padding:0; }
html{ -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; scroll-behavior:smooth; }
body{ font-family:var(--body); font-size:16px; line-height:1.6; color:var(--neutral-800); background:var(--paper); }
img{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }
::selection{ background:var(--signal); color:var(--paper); }

.wrap{ max-width:var(--maxw); margin-inline:auto; padding-inline:var(--pad); }
.mono{ font-family:var(--mono); font-variant-numeric:tabular-nums; }
.skip{ position:absolute; left:8px; top:-60px; background:var(--ink); color:var(--paper); padding:10px 14px; font:600 12px/1 var(--mono); z-index:200; transition:top .15s; }
.skip:focus{ top:8px; }
:focus-visible{ outline:2px solid var(--signal); outline-offset:3px; }

/* ---- type ---- */
.eyebrow{ font-family:var(--body); font-weight:700; font-size:11px; letter-spacing:0.18em; text-transform:uppercase; color:var(--neutral-600); }
h1,h2,h3,h4{ font-family:var(--display); color:var(--ink); font-weight:700; letter-spacing:-0.015em; line-height:1.06; }
.display{ font-size:clamp(40px,6vw,76px); }
h1{ font-size:clamp(34px,4.6vw,60px); }
h2{ font-size:clamp(26px,3vw,40px); }
h3{ font-size:clamp(20px,2.2vw,27px); letter-spacing:-0.012em; line-height:1.12; }
.lead{ font-family:var(--display); font-weight:400; font-size:clamp(18px,2vw,23px); line-height:1.5; color:var(--neutral-600); max-width:60ch; }
p{ max-width:72ch; }
strong{ font-weight:600; color:var(--ink); }
.sig{ color:var(--signal); }

/* ---- links in body ---- */
.tlink{ color:var(--signal); border-bottom:1px solid color-mix(in oklch, var(--signal) 40%, transparent); transition:border-color .18s var(--ease); }
.tlink:hover{ border-bottom-color:var(--signal); }

/* ---- buttons (square; signal fill is the one CTA) ---- */
.btn{ display:inline-flex; align-items:center; gap:10px; font-family:var(--body); font-weight:600; font-size:15px; padding:14px 24px; background:var(--signal); color:var(--paper); border:1px solid var(--signal); cursor:pointer; transition:background .22s var(--ease); }
.btn:hover{ background:var(--signal-ink); border-color:var(--signal-ink); }
.btn-ghost{ background:transparent; color:var(--ink); border:1px solid var(--neutral-400); }
.btn-ghost:hover{ background:var(--neutral-050); border-color:var(--ink); }
.btn .ic{ width:18px; height:18px; }
.arrow{ font-family:var(--mono); transition:transform .2s var(--ease); }
.btn:hover .arrow, .ilink:hover .arrow{ transform:translateX(3px); }

/* ---- inline arrow link ---- */
.ilink{ display:inline-flex; align-items:center; gap:8px; font-weight:600; font-size:14px; color:var(--ink); border-bottom:1px solid var(--ink); padding-bottom:3px; transition:color .18s var(--ease); }
.ilink:hover{ color:var(--signal); border-bottom-color:var(--signal); }

/* ---- icons ---- */
.ic{ width:24px; height:24px; color:var(--neutral-600); flex:none; }
.ic-16{ width:16px; height:16px; } .ic-20{ width:20px; height:20px; } .ic-32{ width:32px; height:32px; }
.ic-ink{ color:var(--ink); } .ic-sig{ color:var(--signal); }

/* ---- header ---- */
.site-head{ position:sticky; top:0; z-index:100; background:color-mix(in oklch, var(--paper) 88%, transparent); backdrop-filter:saturate(1.1) blur(6px); border-bottom:1px solid transparent; transition:border-color .2s, background .2s; }
.site-head.is-scrolled{ border-bottom-color:var(--neutral-200); }
.site-head .bar{ max-width:var(--maxw); margin-inline:auto; padding:18px var(--pad); display:flex; align-items:center; justify-content:space-between; gap:32px; }
.brand{ display:inline-flex; align-items:center; }
.brand img{ height:42px; width:auto; display:block; }
.nav{ display:flex; gap:28px; }
.nav a{ font-weight:500; font-size:14px; color:var(--neutral-600); padding:6px 0; border-bottom:1.5px solid transparent; transition:color .18s, border-color .18s; }
.nav a:hover{ color:var(--ink); }
.nav a[aria-current="page"]{ color:var(--signal); border-bottom-color:var(--signal); }
@media (max-width:860px){ .nav{ display:none; } }

/* ---- generic section ---- */
.sec{ padding:clamp(56px,9vh,120px) 0; border-top:1px solid var(--neutral-200); }
.sec:first-of-type{ border-top:0; }
.sec-head{ display:flex; flex-direction:column; gap:14px; margin-bottom:48px; }
.sec-head .eyebrow{ margin-bottom:2px; }

/* ---- page hero (typographic, no photo dependency) ---- */
.phero{ padding:clamp(72px,12vh,160px) 0 clamp(40px,6vh,72px); border-bottom:1px solid var(--neutral-200); }
.phero .eyebrow{ margin-bottom:20px; }
.phero .lead{ margin-top:24px; }

/* ---- editorial index rows (Work, project lists) ---- */
.idx{ border-top:1px solid var(--neutral-200); }
.idx-row{ display:grid; grid-template-columns:1.4fr 1fr auto; gap:32px; align-items:center; padding:26px 0; border-bottom:1px solid var(--neutral-200); transition:background .18s var(--ease); }
.idx-row:hover{ background:var(--neutral-050); }
.idx-row .ttl{ font-family:var(--display); font-weight:700; font-size:clamp(20px,2vw,26px); color:var(--ink); letter-spacing:-0.01em; }
.idx-row .ttl .cl{ display:block; margin-top:6px; font:500 11px/1.4 var(--mono); letter-spacing:0.1em; text-transform:uppercase; color:var(--neutral-400); }
.idx-row .tags{ display:flex; flex-wrap:wrap; gap:6px 14px; font:500 12px/1.3 var(--mono); color:var(--neutral-600); }
.idx-row .yr{ font:600 13px/1 var(--mono); color:var(--neutral-600); text-align:right; justify-self:end; }
@media (max-width:760px){ .idx-row{ grid-template-columns:1fr; gap:12px; } .idx-row .yr{ text-align:left; justify-self:start; } }

/* ---- capability lines (division pages) ---- */
.caps{ border-top:1px solid var(--neutral-200); }
.cap{ display:flex; gap:18px; align-items:flex-start; padding:22px 0; border-bottom:1px solid var(--neutral-200); }
.cap .ic{ margin-top:2px; }
.cap h4{ font-size:18px; letter-spacing:-0.01em; }
.cap p{ margin-top:6px; color:var(--neutral-600); font-size:15px; }

/* ---- specimen plate (division outlink) ---- */
.specimen{ display:block; border-top:1px solid var(--ink); padding:36px 0 30px; transition:transform .24s var(--ease); }
.specimen .row{ display:flex; align-items:flex-end; justify-content:space-between; gap:24px; }
.specimen .nm{ font-family:var(--display); font-weight:700; font-size:clamp(26px,3.4vw,44px); letter-spacing:-0.015em; color:var(--ink); line-height:1; }
.specimen .meta{ font:600 12px/1.4 var(--mono); letter-spacing:0.08em; text-transform:uppercase; color:var(--neutral-600); display:inline-flex; align-items:center; gap:8px; }
.specimen .meta .ic{ width:18px; height:18px; }
a.specimen:hover{ transform:translateY(-4px); }
a.specimen:hover .nm{ color:var(--ink); }
.specimen.is-pending{ cursor:default; }
.specimen.is-pending .nm{ color:var(--neutral-400); }
.specimen.is-pending .meta{ color:var(--neutral-400); }

/* ---- specimen plate variant on dark not used; keep light ---- */

/* ---- proof / charter ---- */
.charter{ padding:clamp(64px,12vh,140px) 0; border-top:1px solid var(--neutral-200); }
.charter p{ font-family:var(--display); font-weight:600; font-size:clamp(24px,3.2vw,40px); line-height:1.28; letter-spacing:-0.012em; color:var(--ink); max-width:24ch; }
.proofquote{ font-family:var(--display); font-weight:400; font-style:normal; font-size:clamp(19px,2.2vw,26px); line-height:1.45; color:var(--neutral-800); max-width:42ch; border-top:2px solid var(--signal); padding-top:18px; }
.proofquote .src{ display:block; margin-top:14px; font:600 11px/1.4 var(--mono); letter-spacing:0.1em; text-transform:uppercase; color:var(--neutral-400); }

/* ---- trust row (mono inline) ---- */
.trust{ display:flex; flex-wrap:wrap; gap:10px 22px; font:500 12.5px/1.4 var(--mono); color:var(--neutral-600); letter-spacing:0.02em; }
.trust span{ display:inline-flex; align-items:center; gap:8px; }
.trust .dot{ width:5px; height:5px; border-radius:50%; background:var(--neutral-400); }

/* ---- two-column ---- */
.two{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(32px,5vw,72px); align-items:start; }
@media (max-width:860px){ .two{ grid-template-columns:1fr; gap:32px; } }

/* ---- timeline ---- */
.tl{ border-top:1px solid var(--neutral-200); }
.tl-row{ display:grid; grid-template-columns:120px 1fr; gap:28px; padding:22px 0; border-bottom:1px solid var(--neutral-200); }
.tl-row .yr{ font:600 14px/1 var(--mono); color:var(--signal); }
.tl-row p{ color:var(--neutral-800); font-size:15.5px; max-width:62ch; }
@media (max-width:560px){ .tl-row{ grid-template-columns:1fr; gap:6px; } }

/* ---- credentials (mono list) ---- */
.creds{ display:grid; gap:0; border-top:1px solid var(--neutral-200); }
.creds .c{ display:flex; gap:14px; padding:14px 0; border-bottom:1px solid var(--neutral-200); font:500 13px/1.5 var(--mono); color:var(--neutral-800); letter-spacing:0.01em; }
.creds .c .k{ color:var(--neutral-400); min-width:0; }

/* ---- leadership / profiles ---- */
.profiles{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(32px,5vw,64px); }
@media (max-width:860px){ .profiles{ grid-template-columns:1fr; } }
.profile .port{ aspect-ratio:4/5; max-width:280px; background:var(--neutral-050); border:1px solid var(--neutral-200); position:relative; overflow:hidden; margin-bottom:20px; }
.profile .port img{ width:100%; height:100%; object-fit:cover; filter:grayscale(1) contrast(1.03); }
.profile .port .ph{ position:absolute; inset:0; display:flex; align-items:flex-end; padding:16px; font:600 11px/1.4 var(--mono); letter-spacing:0.12em; text-transform:uppercase; color:var(--neutral-400); }
.profile h3{ margin-bottom:4px; }
.profile .role{ font:600 12px/1.4 var(--mono); letter-spacing:0.1em; text-transform:uppercase; color:var(--signal-ink); margin-bottom:16px; }
.profile p{ color:var(--neutral-600); font-size:15px; }

/* ---- team grid (text-first) ---- */
.team{ display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid var(--neutral-200); border-left:1px solid var(--neutral-200); }
.team .m{ padding:24px; border-right:1px solid var(--neutral-200); border-bottom:1px solid var(--neutral-200); }
.team .m .nm{ font-family:var(--display); font-weight:700; font-size:18px; color:var(--ink); letter-spacing:-0.01em; }
.team .m .dz{ margin-top:8px; font:500 11.5px/1.5 var(--mono); letter-spacing:0.04em; color:var(--neutral-600); }
.team .m .dv{ color:var(--signal-ink); }
.team .m .note{ margin-top:10px; font-size:13px; line-height:1.55; color:var(--neutral-600); }
@media (max-width:1100px){ .team{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:860px){ .team{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:520px){ .team{ grid-template-columns:1fr; } }

/* ---- clients roster ---- */
.roster{ display:flex; flex-wrap:wrap; gap:0; border-top:1px solid var(--neutral-200); }
.roster span{ font-family:var(--display); font-weight:700; font-size:clamp(18px,2vw,24px); color:var(--ink); padding:18px 28px 18px 0; margin-right:28px; letter-spacing:-0.01em; }

/* ---- value points (careers) ---- */
.vals{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--neutral-200); border:1px solid var(--neutral-200); }
.vals .v{ background:var(--paper); padding:28px; }
.vals .v .n{ font:600 12px/1 var(--mono); color:var(--signal); }
.vals .v h4{ margin:14px 0 8px; font-size:18px; }
.vals .v p{ color:var(--neutral-600); font-size:14.5px; }
@media (max-width:760px){ .vals{ grid-template-columns:1fr; } }

/* ---- spec block (project detail) ---- */
.specblock{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--neutral-200); border:1px solid var(--neutral-200); }
.specblock .cell{ background:var(--paper); padding:22px; }
.specblock .cell .k{ font:600 10px/1 var(--mono); letter-spacing:0.16em; text-transform:uppercase; color:var(--neutral-400); }
.specblock .cell .v{ margin-top:10px; font-family:var(--display); font-weight:700; font-size:24px; color:var(--ink); }
@media (max-width:640px){ .specblock{ grid-template-columns:1fr 1fr; } }

/* ---- image placeholder (pending photography) ---- */
.imgslot{ aspect-ratio:16/10; background:repeating-linear-gradient(45deg,var(--neutral-050) 0 12px,var(--paper) 12px 24px); border:1px solid var(--neutral-200); display:flex; align-items:center; justify-content:center; }
.imgslot span{ font:500 11px/1.4 var(--mono); letter-spacing:0.16em; text-transform:uppercase; color:var(--neutral-400); }
.imgslot img{ width:100%; height:100%; object-fit:cover; filter:grayscale(1) contrast(1.03); }

/* ---- form ---- */
.form{ display:grid; grid-template-columns:1fr 1fr; gap:18px; max-width:680px; }
.form .full{ grid-column:1/-1; }
.field label{ display:block; font:600 11px/1.4 var(--mono); letter-spacing:0.12em; text-transform:uppercase; color:var(--neutral-600); margin-bottom:8px; }
.field input,.field select,.field textarea{ width:100%; font-family:var(--body); font-size:15px; color:var(--ink); background:var(--paper); border:1px solid var(--neutral-400); border-radius:2px; padding:12px 14px; }
.field textarea{ min-height:120px; resize:vertical; }
.field input:focus,.field select:focus,.field textarea:focus{ outline:2px solid var(--signal); outline-offset:1px; border-color:var(--signal); }
@media (max-width:560px){ .form{ grid-template-columns:1fr; } }

/* ---- footer ---- */
.site-foot{ border-top:1px solid var(--ink); padding:clamp(48px,8vh,88px) 0 36px; }
.site-foot .boiler{ font-family:var(--display); font-weight:400; font-size:clamp(16px,1.7vw,20px); line-height:1.5; color:var(--neutral-600); max-width:64ch; }
.site-foot .cols{ display:grid; grid-template-columns:2fr 1fr 1fr; gap:32px; margin-top:48px; padding-top:32px; border-top:1px solid var(--neutral-200); }
.site-foot .cols h5{ font:700 11px/1 var(--body); letter-spacing:0.16em; text-transform:uppercase; color:var(--neutral-400); margin-bottom:14px; }
.site-foot .cols a, .site-foot .cols p{ display:block; font-size:14px; color:var(--neutral-800); margin-bottom:8px; }
.site-foot .cols a:hover{ color:var(--signal); }
.site-foot .cols .mono{ font-size:13px; color:var(--neutral-600); }
.site-foot .sig-row{ display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px; margin-top:40px; padding-top:20px; border-top:1px solid var(--neutral-200); font:500 12px/1.5 var(--mono); letter-spacing:0.04em; color:var(--neutral-400); }
@media (max-width:760px){ .site-foot .cols{ grid-template-columns:1fr 1fr; } }

/* ---- content reveals: visible by default; animated only when JS confirms (html.js) ---- */
[data-reveal]{ opacity:1; transform:none; }
html.js [data-reveal]{ opacity:0; transform:translateY(16px); transition:opacity .65s var(--ease), transform .65s var(--ease); transition-delay:var(--d, 0ms); }
html.js [data-reveal].is-in{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){ html.js [data-reveal]{ opacity:1; transform:none; transition:none; } html{ scroll-behavior:auto; } }


/* =============================================================
   LIVEN-UP PASS — depth, rhythm, imagery, signal touches
   ============================================================= */
body{ background-image:
    linear-gradient(to right, color-mix(in oklch, var(--ink) 3.5%, transparent) 1px, transparent 1px),
    linear-gradient(to bottom, color-mix(in oklch, var(--ink) 3.5%, transparent) 1px, transparent 1px);
  background-size:34px 34px; }
.wrap{ position:relative; }
/* eyebrow gets a maroon tick */
.eyebrow{ display:inline-flex; align-items:center; gap:12px; }
.eyebrow::before{ content:''; width:28px; height:2px; background:var(--signal); display:inline-block; flex:none; }
.sec-head .eyebrow, .trust, .roster{ }
/* section rhythm: tint alternate content sections */
main .sec:nth-of-type(even){ background:color-mix(in oklch, var(--neutral-050) 55%, var(--paper)); }
/* dark image hero (consistency with home) */
.phero.dark{ position:relative; background:var(--ink); color:var(--paper); border-bottom:1px solid var(--ink); overflow:hidden; }
.phero.dark .eyebrow{ color:color-mix(in oklch, var(--paper) 74%, transparent); }
.phero.dark .eyebrow::before{ background:var(--signal); }
.phero.dark h1, .phero.dark .display, .phero.dark h2{ color:var(--paper); }
.phero.dark .lead{ color:color-mix(in oklch, var(--paper) 84%, transparent); }
.phero-bg{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.30; filter:grayscale(.5) contrast(1.06) brightness(.9); z-index:0; }
.phero.dark .wrap{ z-index:1; }
.phero.dark .lockup-strip{ filter:none; }
/* imgslot shows real imagery richly */
.imgslot{ aspect-ratio:16/10; }
.imgslot img{ transition:transform .5s var(--ease), filter .4s var(--ease); }
a.specimen .meta .ic, .imgslot:hover img{ }
/* specimen hover arrow shift */
a.specimen .meta .ic{ transition:transform .2s var(--ease); }
a.specimen:hover .meta .ic{ transform:translate(3px,-3px); }
/* idx rows: maroon left tick on hover */
.idx-row{ position:relative; padding-left:22px; transition:background .18s var(--ease), padding-left .18s var(--ease); }
.idx-row::before{ content:''; position:absolute; left:0; top:50%; transform:translateY(-50%) scaleY(0); transform-origin:center; width:3px; height:60%; background:var(--signal); transition:transform .2s var(--ease); }
.idx-row:hover{ padding-left:30px; }
.idx-row:hover::before{ transform:translateY(-50%) scaleY(1); }
@media (max-width:760px){ .idx-row{ padding-left:0; } .idx-row::before{ display:none; } }
/* team photo cards */
.team .m{ padding:0; display:flex; flex-direction:column; }
.team .m .pic{ aspect-ratio:1/1; background:var(--neutral-050); overflow:hidden; border-bottom:1px solid var(--neutral-200); position:relative; }
.team .m .pic img{ width:100%; height:100%; object-fit:cover; object-position:center top; filter:grayscale(1) contrast(1.04); transition:filter .35s var(--ease), transform .5s var(--ease); }
.team .m:hover .pic img{ filter:grayscale(0) contrast(1.03); transform:scale(1.03); }
.team .m .pic.ph{ display:flex; align-items:center; justify-content:center; }
.team .m .pic.ph span{ font-family:var(--display); font-weight:700; font-size:30px; color:var(--neutral-400); }
.team .m .body{ padding:16px 18px 20px; }
/* profile portrait richer */
.profile .port img{ filter:grayscale(1) contrast(1.05); transition:filter .35s var(--ease); }
.profile:hover .port img{ filter:grayscale(0) contrast(1.03); }
/* charter gets a faint signal rule */
.charter .wrap::before{ content:''; display:block; width:48px; height:3px; background:var(--signal); margin-bottom:28px; }

/* =============================================================
   COHERENCE PASS — one dark chrome on every page; b-roll home
   ============================================================= */
/* fixed, transparent header that sits over the dark hero, solidifies on scroll */
.site-head{ position:fixed; top:0; left:0; right:0; background:transparent; backdrop-filter:none; border-bottom:1px solid transparent; }
.site-head.is-scrolled{ background:color-mix(in oklch, var(--ink) 90%, transparent); backdrop-filter:saturate(1.1) blur(8px); border-bottom-color:color-mix(in oklch, var(--paper) 14%, transparent); }
.site-head .brand img{ filter:brightness(0) invert(1); }
.site-head .nav a{ color:color-mix(in oklch, var(--paper) 76%, transparent); }
.site-head .nav a:hover{ color:var(--paper); }
.site-head .nav a[aria-current="page"]{ color:var(--paper); border-bottom-color:var(--signal); }
/* neutralise auto-tint for predictable, coherent bands */
main .sec:nth-of-type(even){ background:transparent; }
/* dark footer everywhere (matches landing) */
.site-foot{ background:var(--ink); color:color-mix(in oklch, var(--paper) 74%, transparent); border-top:0; }
.site-foot .boiler{ color:color-mix(in oklch, var(--paper) 74%, transparent); }
.site-foot .cols{ border-top-color:color-mix(in oklch, var(--paper) 14%, transparent); }
.site-foot .cols h5{ color:color-mix(in oklch, var(--paper) 48%, transparent); }
.site-foot .cols a, .site-foot .cols p{ color:color-mix(in oklch, var(--paper) 86%, transparent); }
.site-foot .cols a:hover{ color:var(--paper); }
.site-foot .sig-row{ border-top-color:color-mix(in oklch, var(--paper) 14%, transparent); color:color-mix(in oklch, var(--paper) 50%, transparent); }
/* full-screen b-roll arrival hero (home) */
.home-hero{ position:relative; min-height:100vh; display:flex; align-items:flex-end; color:var(--paper); overflow:hidden; background:var(--ink); }
.home-hero video, .home-hero .bg{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; opacity:.6; filter:grayscale(.4) contrast(1.05) brightness(.66); }
/* the source b-roll has ~7.8% black pillarbox bars baked in on L/R — scale up to crop them off */
.home-hero video{ transform:scale(1.2); transform-origin:center; }
.home-hero .veil{ position:absolute; inset:0; z-index:1; background:linear-gradient(180deg, rgba(18,16,14,.42) 0%, rgba(18,16,14,.30) 48%, rgba(18,16,14,.88) 100%); }
.home-hero .inner{ position:relative; z-index:2; width:100%; padding-block:clamp(48px,10vh,120px); }
.home-hero .eyebrow{ color:color-mix(in oklch, var(--paper) 76%, transparent); }
.home-hero h1{ color:var(--paper); max-width:17ch; }
.home-hero .tag{ margin-top:22px; font-family:var(--display); font-weight:400; font-size:clamp(18px,2.4vw,28px); line-height:1.4; color:color-mix(in oklch, var(--paper) 88%, transparent); max-width:42ch; }
.home-hero .cta{ margin-top:34px; }

/* =============================================================
   HOME ENRICHMENT PASS — claim infographic, division plates,
   dark charter band, client grid
   ============================================================= */
/* ---- delivery meter (ground-break → commissioning) ---- */
.meter{ border:1px solid var(--neutral-200); background:color-mix(in oklch, var(--neutral-050) 55%, var(--paper)); padding:clamp(22px,3vw,32px); }
.meter .mhead{ display:flex; justify-content:space-between; align-items:baseline; gap:16px; margin-bottom:24px; }
.meter .mhead .k{ font:600 11px/1.5 var(--mono); letter-spacing:0.14em; text-transform:uppercase; color:var(--neutral-600); max-width:22ch; }
.meter .mhead .v{ font-family:var(--display); font-weight:700; font-size:clamp(30px,3.4vw,44px); color:var(--ink); line-height:1; white-space:nowrap; }
.meter .mruler{ position:relative; height:36px; border:1px solid var(--neutral-400); background:
    repeating-linear-gradient(to right, transparent 0, transparent calc(10% - 1px), var(--neutral-400) calc(10% - 1px), var(--neutral-400) 10%); }
.meter .mruler .mfill{ position:absolute; left:0; top:0; bottom:0; width:100%; background:linear-gradient(to right, color-mix(in oklch, var(--signal) 14%, transparent), color-mix(in oklch, var(--signal) 30%, transparent)); }
.meter .mruler .mtick-end{ position:absolute; right:0; top:-6px; bottom:-6px; width:3px; background:var(--signal); }
.meter .mlabels{ display:flex; justify-content:space-between; gap:16px; margin-top:10px; font:600 10.5px/1.5 var(--mono); letter-spacing:0.1em; color:var(--neutral-600); }
.meter .mlabels span:last-child{ color:var(--signal-ink); text-align:right; }
.meter .mcap{ margin-top:18px; font-size:14px; line-height:1.55; color:var(--neutral-600); }
.mstats{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--neutral-200); border:1px solid var(--neutral-200); border-top:0; }
.mstats .cell{ background:var(--paper); padding:18px 20px 20px; }
.mstats .cell .v{ font-family:var(--display); font-weight:700; font-size:clamp(24px,2.6vw,34px); color:var(--ink); line-height:1; }
.mstats .cell .k{ margin-top:8px; font:600 10.5px/1.5 var(--mono); letter-spacing:0.12em; text-transform:uppercase; color:var(--neutral-600); }
@media (max-width:560px){ .mstats{ grid-template-columns:1fr; } }

/* ---- division plates (photo cards) ---- */
.divgrid{ display:grid; grid-template-columns:repeat(6,1fr); gap:1px; background:var(--neutral-200); border:1px solid var(--neutral-200); }
.divcard{ grid-column:span 2; background:var(--paper); display:flex; flex-direction:column; }
.divcard:nth-child(4), .divcard:nth-child(5){ grid-column:span 3; }
.divcard .shot{ aspect-ratio:16/10; overflow:hidden; border-bottom:1px solid var(--neutral-200); background:var(--neutral-050); }
.divcard .shot img{ width:100%; height:100%; object-fit:cover; filter:grayscale(1) contrast(1.04); transition:filter .35s var(--ease), transform .5s var(--ease); }
a.divcard:hover .shot img{ filter:grayscale(0) contrast(1.02); transform:scale(1.03); }
.divcard .shot.ph{ display:flex; align-items:center; justify-content:center; background:repeating-linear-gradient(45deg,var(--neutral-050) 0 12px,var(--paper) 12px 24px); }
.divcard .shot.ph span{ font:500 10.5px/1.4 var(--mono); letter-spacing:0.16em; text-transform:uppercase; color:var(--neutral-400); }
.divcard .body{ padding:20px 22px 26px; display:flex; flex-direction:column; gap:10px; flex:1; }
.divcard .no{ font:600 11px/1 var(--mono); letter-spacing:0.16em; color:var(--signal); }
.divcard .nm{ font-family:var(--display); font-weight:700; font-size:clamp(21px,2.1vw,27px); letter-spacing:-0.012em; color:var(--ink); line-height:1.1; display:flex; align-items:center; justify-content:space-between; gap:12px; }
.divcard .nm .ic{ width:18px; height:18px; flex:none; color:var(--neutral-400); transition:transform .2s var(--ease), color .2s var(--ease); }
a.divcard:hover .nm .ic{ transform:translate(3px,-3px); color:var(--signal); }
.divcard .ds{ font-size:14px; line-height:1.5; color:var(--neutral-600); }
@media (max-width:980px){ .divcard{ grid-column:span 3 !important; } }
@media (max-width:620px){ .divcard{ grid-column:span 6 !important; } }

/* ---- charter dark band ---- */
.charter.dark{ position:relative; background:var(--ink); overflow:hidden; border-top:0; }
.charter.dark .bg{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.30; filter:grayscale(.55) contrast(1.06) brightness(.85); }
.charter.dark .wrap{ position:relative; z-index:1; }
.charter.dark p{ color:var(--paper); }
.charter.dark .eyebrow{ color:color-mix(in oklch, var(--paper) 70%, transparent); margin-bottom:24px; }
.charter.dark .wrap::before{ display:none; }

/* ---- client grid ---- */
.clientgrid{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--neutral-200); border:1px solid var(--neutral-200); }
.clientgrid .c{ background:var(--paper); padding:20px 22px 24px; }
.clientgrid .c .ab{ font-family:var(--display); font-weight:700; font-size:clamp(19px,2vw,25px); letter-spacing:-0.01em; color:var(--ink); line-height:1.1; }
.clientgrid .c .ds{ margin-top:8px; font:500 11px/1.5 var(--mono); letter-spacing:0.04em; color:var(--neutral-600); }
@media (max-width:860px){ .clientgrid{ grid-template-columns:repeat(2,1fr); } }

/* =============================================================
   PROJECTS PAGE — featured plate, numbered index, field strip
   ============================================================= */
.featplate{ display:grid; grid-template-columns:1.15fr 1fr; border:1px solid var(--neutral-200); background:var(--paper); }
.featplate .img{ position:relative; overflow:hidden; min-height:340px; border-right:1px solid var(--neutral-200); }
.featplate .img img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; filter:grayscale(.35) contrast(1.04); transition:filter .35s var(--ease), transform .5s var(--ease); }
a.featplate:hover .img img{ filter:grayscale(0) contrast(1.02); transform:scale(1.02); }
.featplate .fbody{ padding:clamp(24px,3.4vw,44px); display:flex; flex-direction:column; gap:16px; align-items:flex-start; }
.featplate .fk{ font:600 11px/1 var(--mono); letter-spacing:0.16em; text-transform:uppercase; color:var(--signal); }
.featplate h3{ font-size:clamp(26px,3vw,38px); }
.featplate .fcl{ font:500 11px/1.4 var(--mono); letter-spacing:0.1em; text-transform:uppercase; color:var(--neutral-400); }
.featplate p{ color:var(--neutral-600); font-size:15.5px; }
.featplate .specrow{ display:flex; flex-wrap:wrap; gap:8px 22px; font:500 12px/1.4 var(--mono); color:var(--neutral-600); border-top:1px solid var(--neutral-200); padding-top:14px; width:100%; }
@media (max-width:860px){ .featplate{ grid-template-columns:1fr; } .featplate .img{ min-height:240px; border-right:0; border-bottom:1px solid var(--neutral-200); } }

.idx.numbered .idx-row{ grid-template-columns:44px 1.35fr 1fr auto; }
.idx .no{ font:600 12px/1 var(--mono); color:var(--neutral-400); }
.idx-row:hover .no{ color:var(--signal); }
@media (max-width:760px){ .idx.numbered .idx-row{ grid-template-columns:1fr; } .idx.numbered .idx-row .no{ display:none; } }

.fieldstrip{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--neutral-200); border:1px solid var(--neutral-200); }
.fieldstrip figure{ margin:0; background:var(--paper); }
.fieldstrip .ph{ aspect-ratio:16/10; overflow:hidden; }
.fieldstrip .ph img{ width:100%; height:100%; object-fit:cover; filter:grayscale(1) contrast(1.04); transition:filter .35s var(--ease); }
.fieldstrip figure:hover .ph img{ filter:grayscale(0) contrast(1.02); }
.fieldstrip figcaption{ padding:12px 16px 14px; font:500 11px/1.5 var(--mono); letter-spacing:0.08em; text-transform:uppercase; color:var(--neutral-600); border-top:1px solid var(--neutral-200); }
@media (max-width:760px){ .fieldstrip{ grid-template-columns:1fr; } }

/* =============================================================
   ART PASS — drafting-table details, hero drift, premium chrome
   ============================================================= */
/* one-time slow settle on dark hero photography (no loops) */
@media (prefers-reduced-motion:no-preference){
  .phero.dark .phero-bg{ animation:seedDrift 6.5s var(--ease) both; }
  @keyframes seedDrift{ from{ transform:scale(1.05); } to{ transform:scale(1); } }
  .home-hero .inner .wrap > *{ animation:seedRise .9s var(--ease) both; }
  .home-hero .inner .wrap > *:nth-child(2){ animation-delay:.12s; }
  .home-hero .inner .wrap > *:nth-child(3){ animation-delay:.24s; }
  .home-hero .inner .wrap > *:nth-child(4){ animation-delay:.36s; }
  @keyframes seedRise{ from{ opacity:0; transform:translateY(18px); } to{ opacity:1; transform:none; } }
}
/* corner brackets — engineering-drawing register on key plates */
.meter, .featplate{ position:relative; }
.meter::after, .featplate::after{ content:''; position:absolute; inset:7px; pointer-events:none; opacity:.85;
  background:
    linear-gradient(var(--neutral-600),var(--neutral-600)) no-repeat left top/16px 1.5px,
    linear-gradient(var(--neutral-600),var(--neutral-600)) no-repeat left top/1.5px 16px,
    linear-gradient(var(--neutral-600),var(--neutral-600)) no-repeat right top/16px 1.5px,
    linear-gradient(var(--neutral-600),var(--neutral-600)) no-repeat right top/1.5px 16px,
    linear-gradient(var(--neutral-600),var(--neutral-600)) no-repeat left bottom/16px 1.5px,
    linear-gradient(var(--neutral-600),var(--neutral-600)) no-repeat left bottom/1.5px 16px,
    linear-gradient(var(--neutral-600),var(--neutral-600)) no-repeat right bottom/16px 1.5px,
    linear-gradient(var(--neutral-600),var(--neutral-600)) no-repeat right bottom/1.5px 16px; }
/* footer brand mark */
.site-foot .foot-mark{ height:44px; width:auto; filter:brightness(0) invert(1); opacity:.92; margin-bottom:30px; display:block; }
/* tabular figures hold steady while counters run */
[data-count]{ font-variant-numeric:tabular-nums; }

/* =============================================================
   ICONS — SEED locked set (Lucide base + SEED Industrial supplement,
   DESIGN.md §7). Stroke-only, currentColor, one token per context.
   ============================================================= */
.ico{ width:20px; height:20px; flex:none; stroke-width:1.6; vertical-align:-0.18em; }
.ico-sm{ width:16px; height:16px; }
.eyebrow .ico{ width:15px; height:15px; vertical-align:-0.16em; margin-right:7px; color:var(--signal); }
.page-green .eyebrow .ico{ color:var(--green, oklch(0.50 0.105 150)); }
/* inline contact rows */
.icorow{ display:flex; align-items:center; gap:11px; }
.icorow .ico{ color:var(--neutral-400); }

/* =============================================================
   LABS NAV LINK — distinct register: mono, uppercase, bracketed.
   Reads as the experiment tag at the end of the nav.
   ============================================================= */
.nav a.nav-labs{ font-family:var(--mono); font-weight:600; font-size:12px; letter-spacing:0.13em; text-transform:uppercase; }
.nav a.nav-labs::before{ content:"[\00a0"; opacity:.55; }
.nav a.nav-labs::after{ content:"\00a0]"; opacity:.55; }
.site-head.is-scrolled .nav a.nav-labs{ color:color-mix(in oklch, var(--paper) 84%, transparent); }
.site-head.is-scrolled .nav a.nav-labs::before,
.site-head.is-scrolled .nav a.nav-labs::after{ color:color-mix(in oklch, var(--signal) 58%, var(--paper)); opacity:1; }

/* =============================================================
   MOBILE NAV — disclosure menu below 860px (nav previously
   disappeared entirely on small screens)
   ============================================================= */
.nav-toggle{ display:none; }
@media (max-width:860px){
  .nav-toggle{ display:inline-flex; flex-direction:column; justify-content:center; gap:6px; background:none; border:0; padding:10px 6px; cursor:pointer; }
  .nav-toggle span{ width:22px; height:2px; background:var(--paper); transition:transform .22s var(--ease); }
  .site-head.nav-open .nav-toggle span:first-child{ transform:translateY(4px) rotate(45deg); }
  .site-head.nav-open .nav-toggle span:last-child{ transform:translateY(-4px) rotate(-45deg); }
  .site-head.nav-open{ background:color-mix(in oklch, var(--ink) 96%, transparent); backdrop-filter:saturate(1.1) blur(8px); }
  .nav{ display:none; position:absolute; top:100%; left:0; right:0; flex-direction:column; gap:0; padding:6px var(--pad) 18px; background:color-mix(in oklch, var(--ink) 96%, transparent); backdrop-filter:saturate(1.1) blur(8px); border-bottom:1px solid color-mix(in oklch, var(--paper) 14%, transparent); }
  .site-head.nav-open .nav{ display:flex; }
  .nav a{ padding:13px 0; font-size:16px; border-bottom:1px solid color-mix(in oklch, var(--paper) 10%, transparent); }
  .nav a[aria-current="page"]{ border-bottom-color:var(--signal); }
}

/* =============================================================
   CLIENT REGISTERS — labelled sub-grids (defence/govt + private),
   three-up on desktop. Mono register label with a signal tick.
   ============================================================= */
.clabel{ display:flex; align-items:center; gap:10px; font:600 11px/1.5 var(--mono); letter-spacing:0.14em; text-transform:uppercase; color:var(--signal-ink); margin-bottom:14px; }
.clabel::before{ content:''; width:18px; height:2px; background:var(--signal); flex:none; }
.clientgrid.cg3{ grid-template-columns:repeat(3,1fr); }
.clientgrid.cg2{ grid-template-columns:repeat(2,1fr); }
@media (max-width:860px){ .clientgrid.cg3, .clientgrid.cg2{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:520px){ .clientgrid.cg2{ grid-template-columns:1fr; } }

/* footer office address sub-line under each office name */
.site-foot .cols p .adr{ display:block; margin-top:3px; font:500 12px/1.45 var(--mono); letter-spacing:0.01em; color:color-mix(in oklch, var(--paper) 55%, transparent); }

/* footer credentials strip — verified registrations & accreditations as chips */
.site-foot .foot-creds{ display:flex; flex-wrap:wrap; gap:9px 10px; margin-top:36px; padding-top:26px; border-top:1px solid color-mix(in oklch, var(--paper) 14%, transparent); }
.site-foot .foot-creds .cmark{ display:inline-flex; align-items:center; padding:6px 12px; border:1px solid color-mix(in oklch, var(--paper) 18%, transparent); font:600 10.5px/1.4 var(--mono); letter-spacing:0.09em; text-transform:uppercase; color:color-mix(in oklch, var(--paper) 66%, transparent); }
.site-foot .foot-creds .cmark.iso{ color:var(--paper); border-color:color-mix(in oklch, var(--signal) 62%, var(--paper)); }