:root{
  --neutral-0:#ffffff;--neutral-50:#f7f6f3;--neutral-200:#e4e2dc;--neutral-500:#6b6b67;
  --neutral-800:#26282b;--neutral-950:#111214;
  --brand:#0d4a57;--brand-deep:#0a3843;--brand-tint:#e9f0f1;
  --accent:#e07b2c;--accent-ink:#b4551a;
  --ink:#14171a;--ink-muted:#5a5f64;--rule:#e4e2dc;
  --bg:#f7f6f3;--surface:#ffffff;
  /* Register: institutional / regulatory, NOT editorial-boutique.
     Grotesque display + serif reading voice INVERTS the AI default
     (serif display + sans body) that made this read machine-made. */
  --font-display:'Archivo','Helvetica Neue',Arial,sans-serif;
  --font-body:'Source Serif 4',Georgia,serif;
  --font-mono:'JetBrains Mono',ui-monospace,monospace;
  --s1:.25rem;--s2:.5rem;--s3:1rem;--s4:1.5rem;--s5:2.5rem;--s6:4rem;--s7:6.5rem;--s8:9rem;
  --maxw:1180px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font-family:var(--font-body);font-size:1.0625rem;hanging-punctuation:first;line-height:1.6;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--s4)}
a{color:inherit;text-decoration:none}
h1,h2,h3{font-family:var(--font-display);font-weight:600;letter-spacing:-.028em;line-height:1.02;font-optical-sizing:auto}
.eyebrow{font-family:var(--font-mono);font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-muted)}
.eyebrow .tick{color:var(--ink-muted)}

header{position:sticky;top:0;z-index:50;background:rgba(247,246,243,.86);backdrop-filter:blur(8px);border-bottom:1px solid var(--rule)}
.nav{display:flex;align-items:center;justify-content:space-between;height:70px}
.brandmark{display:flex;align-items:center;gap:.7rem;font-family:var(--font-display);font-weight:600;font-size:1.15rem;letter-spacing:-.02em}
.brandmark .glyph{width:30px;height:30px;flex:0 0 30px}
.brandmark small{display:block;font-family:var(--font-mono);font-size:.58rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-muted);font-weight:400;margin-top:1px}
.navlinks{display:flex;gap:2rem;align-items:center}
.navlinks a{font-size:.92rem;color:var(--ink-muted);transition:color .15s}
.navlinks a:hover{color:var(--ink)}
.navcta{font-family:var(--font-mono);font-size:.78rem;letter-spacing:.04em;padding:.55rem .9rem;border:1px solid var(--ink);border-radius:4px;color:var(--ink)!important;transition:.18s}
.navcta:hover{background:var(--ink);color:var(--neutral-0)!important}
@media(max-width:820px){.navlinks a:not(.navcta){display:none}}

/* hero */
.hero{position:relative;background:var(--neutral-950);color:#eef0ef;overflow:hidden}
.hero .photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 62%;z-index:0;filter:grayscale(.18) contrast(1.06) brightness(.58)}
.hero .photoscrim{position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(17,18,20,.95) 0%,rgba(17,18,20,.78) 44%,rgba(17,18,20,.30) 100%),linear-gradient(0deg,rgba(17,18,20,.96) 0%,rgba(17,18,20,.10) 58%,transparent 100%)}
.hero .blueprint{z-index:1;opacity:.16}
.hero .blueprint{position:absolute;inset:0;opacity:.5;pointer-events:none}
.hero .glow{position:absolute;right:-12%;top:-25%;width:70%;height:150%;background:radial-gradient(closest-side,rgba(13,74,87,.42),transparent);pointer-events:none;z-index:1}
.hero .wrap{position:relative;z-index:2;padding:var(--s8) var(--s4) var(--s7)}
.hero .eyebrow{color:#9aa3a6}
.hero h1{font-size:clamp(2.8rem,6.6vw,5.6rem);color:#fff;font-weight:500;max-width:15ch;margin:1.5rem 0 0;line-height:.98;letter-spacing:-.035em}
.hero h1 em{font-style:normal;font-weight:700;color:#fff;position:relative;padding-bottom:.06em;box-shadow:inset 0 -.09em 0 var(--accent)}
.hero .lede{font-size:clamp(1.05rem,1.7vw,1.3rem);color:#c4cacb;max-width:56ch;margin-top:1.7rem;line-height:1.55}
.hero .herofoot{display:flex;flex-wrap:wrap;gap:1rem 2.4rem;align-items:center;margin-top:var(--s5)}
.btn{display:inline-flex;align-items:center;gap:.6rem;font-family:var(--font-mono);font-size:.85rem;letter-spacing:.03em;padding:.85rem 1.35rem;border-radius:5px;background:var(--accent);color:#1a1206;font-weight:500;transition:.18s;border:1px solid var(--accent)}
.btn:hover{background:#ed8b41;transform:translateY(-1px)}
.btn.ghost{background:transparent;color:#dfe4e4;border-color:#3a4145}
.btn.ghost:hover{border-color:#7d8790;background:rgba(255,255,255,.03)}
.hero .caption{font-family:var(--font-mono);font-size:.72rem;color:#7d8790;letter-spacing:.03em}

/* credential rail */
.rail{background:var(--brand-deep);color:#dfeef1}
.rail .grid{display:grid;grid-template-columns:repeat(4,1fr)}
.rail .cell{padding:1.7rem var(--s4);border-left:1px solid rgba(255,255,255,.09)}
.rail .cell:first-child{border-left:0}
.rail .k{font-family:var(--font-display);font-size:2.1rem;font-weight:500;line-height:1;color:#fff}
.rail .k b{color:inherit;font-weight:600}
.rail .l{font-family:var(--font-mono);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:#8fb6bd;margin-top:.5rem}
@media(max-width:820px){.rail .grid{grid-template-columns:1fr 1fr}.rail .cell:nth-child(3){border-left:0}}

/* ===== STRUCTURAL SYSTEM (art-direction pass 2026-07-27) =====
   Concept: the page behaves like an inspection document — heavy struck rules,
   stamped numerals, redline annotation, extreme type-scale contrast.
   Scale ratio target ~12x (meta 10px ↔ display 120px), per blessed refs
   frerejones.com / studiodumbar.com / portorocha.com. */
.bleed{width:100vw;margin-left:calc(50% - 50vw)}
.gutter{max-width:var(--maxw);margin:0 auto;padding:0 var(--s4)}
.meta{font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.18em;text-transform:uppercase;line-height:1.6}
.display{font-family:var(--font-display);font-weight:400;letter-spacing:-.04em;line-height:.92}
.rule-heavy{height:3px;background:var(--ink);transform-origin:left center;margin-top:var(--s5)}
.stamp{font-family:var(--font-display);font-weight:400;color:transparent;-webkit-text-stroke:1.2px currentColor;letter-spacing:-.045em;line-height:.82}
/* signature motion — struck rules draw across on entry. Decorative ONLY:
   content opacity is never animated, so nothing can be hidden off-screen. */
@supports (animation-timeline:view()){
  @media(prefers-reduced-motion:no-preference){
    .strike{animation:strike-in linear both;animation-timeline:view();animation-range:entry 10% cover 22%}
    @keyframes strike-in{from{transform:scaleX(0)}to{transform:scaleX(1)}}
  }
}
.tick{display:inline-block;width:1.4rem;height:1px;background:var(--accent);vertical-align:middle;margin-right:.7rem}

/* section scaffold */
section{padding:var(--s7) 0}
.stmt{padding:var(--s8) 0}
#resources{padding:var(--s6) 0}
.sechead{display:grid;grid-template-columns:2.6rem 1fr;gap:1.4rem;align-items:start;margin-bottom:var(--s5)}
.sechead .num{font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.18em;color:var(--ink-muted);line-height:1;padding-top:.9rem}
.sechead h2{font-size:clamp(2.2rem,5vw,4rem);line-height:.98;max-width:17ch;letter-spacing:-.03em}
.sechead .sub{font-size:1.05rem;color:var(--ink-muted);max-width:52ch;margin-top:1.05rem;line-height:1.55}
.pjhead{font-size:clamp(2.2rem,5vw,4rem);line-height:.98;max-width:17ch;letter-spacing:-.03em}
@media(max-width:680px){.sechead{grid-template-columns:1fr;gap:.5rem}.sechead .num{padding-top:0}}

/* 324 statement */
.stmt{background:var(--surface);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.stmt-in{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:var(--s6);align-items:center}
.bignum{font-family:var(--font-display);font-weight:400;font-size:clamp(6rem,15vw,12.5rem);line-height:.82;letter-spacing:-.04em;color:var(--brand)}
.bignum sup{font-size:.28em;vertical-align:top;color:var(--ink-muted);font-family:var(--font-mono);letter-spacing:0;top:-.2em;position:relative}
.stmt-in .rule{width:64px;height:2px;background:var(--accent);margin:0 0 1.4rem}
.stmt-in h2{font-size:clamp(1.7rem,3.2vw,2.6rem);font-weight:500;margin-bottom:1.2rem;line-height:1.18;letter-spacing:-.015em}
.stmt-in p{color:var(--ink-muted);font-size:1.08rem;max-width:46ch}
.stmt-in p+p{margin-top:1rem}
@media(max-width:780px){.stmt-in{grid-template-columns:1fr;gap:var(--s4)}}

/* ===== sectors — dominant flagship panel + 4-column practice index ===== */
.flagship{position:relative;background:var(--brand);color:#eaf6f8;border-radius:0;border-top:3px solid var(--accent);overflow:hidden;display:grid;grid-template-columns:1.3fr .7fr;gap:var(--s5);padding:var(--s5);align-items:center}
.flagship .bpgrid{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;opacity:.55}
.flagship .txt{position:relative;z-index:1}
.flagship .flag{font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.18em;text-transform:uppercase;color:#8fd0da}
.flagship h3{font-family:var(--font-display);font-size:clamp(2.1rem,4.4vw,3.4rem);font-weight:600;color:#fff;margin:.9rem 0 .85rem;letter-spacing:-.035em;line-height:.98}
.flagship p{color:#c3e0e5;font-size:1.02rem;max-width:46ch;line-height:1.55}
.flagship .figs{position:relative;z-index:1;display:grid;gap:1.7rem;border-left:1px solid rgba(255,255,255,.18);padding-left:var(--s5)}
.flagship .figs b{display:block;font-family:var(--font-display);font-size:clamp(2.6rem,4.6vw,4rem);color:#fff;font-weight:600;line-height:.9;letter-spacing:-.04em}
.flagship .figs span{display:block;font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.18em;text-transform:uppercase;color:#8fd0da;margin-top:.5rem;line-height:1.5}
@media(max-width:860px){.flagship{grid-template-columns:1fr;gap:var(--s4);padding:var(--s4)}.flagship .figs{border-left:0;border-top:1px solid rgba(255,255,255,.18);padding-left:0;padding-top:var(--s4);grid-template-columns:1fr 1fr;gap:1rem}}

.pindex{display:grid;grid-template-columns:repeat(4,1fr);border-top:0}
.pcell{padding:1.6rem var(--s4) .2rem;border-left:1px solid var(--rule)}
.pcell:first-child{border-left:0;padding-left:0}
.pcell:last-child{padding-right:0}
.pcell .i{display:block;font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.18em;color:var(--ink-muted);line-height:1}
.pcell h4{font-family:var(--font-display);font-weight:600;font-size:1.5rem;letter-spacing:-.026em;margin:.9rem 0 .6rem;line-height:1.06}
.pcell p{font-size:.9rem;color:var(--ink-muted);line-height:1.5}
@media(max-width:860px){.pindex{grid-template-columns:1fr 1fr}.pcell:nth-child(3){border-left:0;padding-left:0}.pcell:nth-child(2){padding-right:0}}
@media(max-width:520px){.pindex{grid-template-columns:1fr}.pcell{border-left:0;border-top:1px solid var(--rule);padding:1.4rem 0 .2rem}.pcell:first-child{border-top:0}}

/* ===== projects — image-led roster with a weighted current entry ===== */
.pjtop{display:grid;grid-template-columns:1fr auto;gap:var(--s6);align-items:end;margin-bottom:var(--s5)}
.pjtop p{color:var(--ink-muted);max-width:46ch;margin-top:1.1rem;font-size:1.05rem;line-height:1.55}
.pjnote{font-family:var(--font-mono);font-size:.73rem;color:var(--ink-muted);letter-spacing:.02em;line-height:1.8;width:34ch;padding-left:1.2rem;text-indent:-1.2rem;padding-bottom:.35rem}
.pjnote .dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--accent);margin-right:.55rem;vertical-align:middle}
.wfig{position:relative;margin:0 0 var(--s5);border-radius:8px;overflow:hidden;line-height:0}
.wfig img{width:100%;height:clamp(230px,25vw,370px);object-fit:cover;object-position:center 62%;filter:grayscale(.42) contrast(1.06) brightness(.94)}
.wfig figcaption{position:absolute;left:0;right:0;bottom:0;padding:1.25rem var(--s4);background:linear-gradient(0deg,rgba(17,18,20,.86),transparent);font-family:var(--font-mono);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:#fff;line-height:1.5}
.wfig figcaption b{color:var(--accent);font-weight:400;margin-right:.6rem}
.roster{display:grid;grid-template-columns:1fr 1fr;column-gap:var(--s6);border-top:0}
.pit{display:grid;grid-template-columns:2.4rem 1fr;gap:1.2rem;padding:1.35rem 0;border-bottom:1px solid var(--rule);align-items:baseline}
.pit .idx{font-family:var(--font-mono);font-size:.73rem;color:var(--ink-muted);line-height:2}
.pit .pn{font-family:var(--font-display);font-size:1.42rem;font-weight:600;line-height:1.1;letter-spacing:-.026em}
.pit .pc{font-size:.9rem;color:var(--ink-muted);margin-top:.28rem}
.pit .tag{display:inline-block;font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-muted);margin-top:.65rem}
.pit.live{grid-column:1/-1;background:var(--brand-tint);border-left:3px solid var(--brand);border-bottom-color:var(--brand);padding:1.7rem 1.5rem;margin-bottom:.5rem;grid-template-columns:2.4rem 1fr auto;align-items:center}
.pit.live .idx{color:var(--brand)}
.pit.live .pn{font-size:clamp(1.5rem,2.6vw,2rem);color:var(--brand)}
.pit.live .pc{font-size:.98rem;color:var(--ink)}
.pit.live .now{font-family:var(--font-mono);font-size:.65rem;letter-spacing:.15em;text-transform:uppercase;color:#fff;background:var(--accent-ink);border-radius:3px;padding:.5rem .75rem;white-space:nowrap;line-height:1.45;text-align:center}
@media(max-width:820px){.roster{grid-template-columns:1fr;column-gap:0}.pjtop{grid-template-columns:1fr;gap:var(--s4);align-items:start}.pit.live{grid-template-columns:2.4rem 1fr;padding:1.3rem 1.1rem}.pit.live .now{grid-column:2;justify-self:start;margin-top:.8rem}}

/* ===== services — drawing-sheet quadrants ===== */
.svcgrid{display:grid;grid-template-columns:1fr 1fr;border-top:0}
.svq{position:relative;padding:var(--s5) var(--s5) var(--s4);border-bottom:1px solid var(--rule);background:var(--surface);transition:background .2s}
.svq:nth-child(odd){border-right:1px solid var(--rule)}
.svq:hover{background:var(--neutral-50)}
.svq .top{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;margin-bottom:var(--s4)}
.svq .ico{width:32px;height:32px;flex:0 0 32px;stroke:var(--brand);fill:none;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
.svq .n{font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.18em;color:var(--ink-muted);line-height:2.4}
.svq h3{font-size:1.85rem;font-weight:600;line-height:1.06;letter-spacing:-.028em;max-width:18ch}
.svq .kw{font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.18em;text-transform:uppercase;color:var(--accent-ink);margin-top:.65rem}
.svq p{color:var(--ink-muted);font-size:.97rem;line-height:1.6;margin-top:1.15rem;max-width:46ch}
@media(max-width:820px){.svcgrid{grid-template-columns:1fr}.svq{padding:var(--s4) 0}.svq:nth-child(odd){border-right:0}}

/* full-bleed field band */
.band{padding:0}
.bandfig{position:relative;margin:0;line-height:0}
.bandfig img{width:100%;height:clamp(320px,42vw,520px);object-fit:cover;object-position:center 45%;filter:grayscale(.12) contrast(1.04)}
.bandfig figcaption{position:absolute;left:0;right:0;bottom:0;padding:1.5rem var(--s4);background:linear-gradient(0deg,rgba(17,18,20,.86),transparent);color:#dfe4e4;font-family:var(--font-mono);font-size:.72rem;letter-spacing:.06em;line-height:1.6}
.bandfig figcaption span{color:var(--accent);text-transform:uppercase;letter-spacing:.14em;margin-right:.7rem}
@media(max-width:680px){.bandfig figcaption{font-size:.66rem}}

/* quote — subtle animated architectural lines */
.quote{position:relative;background:var(--neutral-950);color:#eef0ef;overflow:hidden}
.quote .arch{z-index:1}
.quote .arch{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;opacity:.5}
.quote .arch path{stroke:#2c4249;stroke-width:1;fill:none;stroke-dasharray:1600;stroke-dashoffset:1600;animation:qdraw 3.6s cubic-bezier(.4,0,.2,1) forwards}
.quote .arch .a2{animation-delay:.6s;stroke:#33565f}
.quote .arch circle{fill:none;stroke:var(--accent);stroke-width:1.3;opacity:0;animation:qnode 1s ease 1s forwards}
@keyframes qdraw{to{stroke-dashoffset:0}}@keyframes qnode{to{opacity:.85}}
@media(prefers-reduced-motion:reduce){.quote .arch path{stroke-dashoffset:0;animation:none}.quote .arch circle{opacity:.85;animation:none}}
.quote .wrap{position:relative;padding:var(--s7) var(--s4)}
.quote blockquote{font-family:var(--font-display);font-style:italic;font-weight:400;font-size:clamp(1.9rem,4.4vw,3.5rem);line-height:1.28;max-width:22ch;color:#fff}
.quote blockquote b{color:#5fb8c9;font-weight:400;font-style:normal}
.quote .attr{font-family:var(--font-mono);font-size:.8rem;letter-spacing:.06em;color:#8fb6bd;margin-top:1.8rem}

/* ===== reference desk — open ledger (no cards, no boxes) ===== */
.refhead{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;padding-bottom:1.1rem;border-bottom:3px solid var(--ink)}
.refhead h3{font-family:var(--font-display);font-size:1.32rem;font-weight:500;letter-spacing:-.012em}
.refhead .tt{font-family:var(--font-mono);font-size:.65rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-muted)}
.refrow{display:grid;grid-template-columns:3.4rem minmax(0,21ch) minmax(0,1fr) 10.5rem;gap:var(--s4);align-items:center;padding:2rem 0;border-bottom:1px solid var(--rule)}
.refrow .rn{font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.18em;color:var(--ink-muted);line-height:1.8}
.refrow .code{display:block;font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.18em;text-transform:uppercase;color:var(--accent-ink);margin-bottom:.45rem}
.refrow h4{font-family:var(--font-display);font-size:1.55rem;font-weight:600;line-height:1.06;letter-spacing:-.026em}
.refrow p{font-size:.94rem;color:var(--ink-muted);line-height:1.55;max-width:52ch}
.refrow .arw{font-family:var(--font-mono);font-size:.72rem;letter-spacing:.04em;color:var(--brand);text-align:right;white-space:nowrap;transition:transform .18s,color .18s}
.refrow:hover .arw{color:var(--accent-ink);transform:translateX(4px)}
@media(max-width:900px){.refrow{grid-template-columns:3.4rem 1fr;gap:.3rem 1.2rem;align-items:start;padding:1.6rem 0}.refrow .rn{font-size:2rem}.refrow p{grid-column:2;margin-top:.55rem}.refrow .arw{grid-column:2;text-align:left;margin-top:.8rem}}

/* contact */
.contact{position:relative;background:var(--brand);color:#eaf6f8;overflow:hidden;padding:0}
.contact .bpgrid{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;opacity:.5}
.contact .wrap{position:relative;z-index:1;padding:var(--s6) var(--s4)}
.contact-in{display:grid;grid-template-columns:1.15fr .85fr;gap:var(--s6);align-items:start}
.contact .kick{font-family:var(--font-mono);font-size:.67rem;letter-spacing:.16em;text-transform:uppercase;color:#8fd0da;margin-bottom:1.1rem}
.contact h2{color:#fff;font-size:clamp(2.1rem,4.4vw,3.15rem);max-width:16ch;letter-spacing:-.022em;line-height:1.05}
.contact p{color:#bfe0e6;margin-top:1.3rem;max-width:44ch;font-size:1.05rem;line-height:1.6}
.contact .cta-row{display:flex;flex-wrap:wrap;gap:1rem 1.7rem;align-items:center;margin-top:var(--s4)}
.contact .alt{font-family:var(--font-mono);font-size:.79rem;color:#a9d2da}
.contact .alt a{color:#fff;border-bottom:1px solid rgba(255,255,255,.4)}
.contact .alt a:hover{border-bottom-color:var(--accent)}
.spec{border-top:1px solid rgba(255,255,255,.3)}
.spec .r{display:grid;grid-template-columns:6.2rem 1fr;gap:1rem;align-items:baseline;padding:1rem 0;border-bottom:1px solid rgba(255,255,255,.15)}
.spec .lab{font-family:var(--font-mono);font-size:.63rem;letter-spacing:.15em;text-transform:uppercase;color:#8fc4cd}
.spec .val{font-family:var(--font-mono);font-size:.95rem;color:#fff;letter-spacing:.01em;line-height:1.5}
.spec .val a{color:#fff}
.spec .val a:hover{color:var(--accent)}
@media(max-width:820px){.contact-in{grid-template-columns:1fr;gap:var(--s5);align-items:start}}

/* ===== footer ===== */
footer{position:relative;background:var(--neutral-950);color:#8b9296}
footer::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--brand),#5fb8c9 52%,transparent)}
.fclose{display:grid;grid-template-columns:1fr auto;gap:var(--s5);align-items:end;padding:var(--s5) 0 var(--s5);font-family:var(--font-display);font-size:clamp(1.5rem,2.8vw,2.15rem);font-weight:500;color:#e6ebec;line-height:1.14}
.fclose span{max-width:22ch;display:block}
.fclose b{color:#5fb8c9;font-weight:500}
.fclose .lic{font-family:var(--font-mono);font-size:.66rem;letter-spacing:.15em;text-transform:uppercase;color:#6f777b;line-height:1.9;text-align:right;padding-bottom:.4rem}
.fclose .lic em{display:block;font-style:normal;color:#c9cfd2}
.fmain{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:var(--s5);padding:var(--s5) 0 var(--s5);border-top:1px solid #23262a}
@media(max-width:680px){.fclose{grid-template-columns:1fr;gap:1.4rem;align-items:start}.fclose .lic{text-align:left}}
.fmain .brandmark{color:#eef0ef}
.fmain .brandmark small{color:#6f777b}
.fbrand p{font-size:.92rem;color:#7f868a;max-width:34ch;margin-top:1.1rem;line-height:1.55}
.fcol h5{font-family:var(--font-mono);font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:#6f777b;margin-bottom:1rem}
.fcol a,.fcol div{display:block;font-size:.92rem;color:#aeb4b7;padding:.28rem 0;transition:color .15s}
.fcol a:hover{color:#fff}
.fbar{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.6rem;align-items:center;padding:1.3rem 0;border-top:1px solid #23262a;font-family:var(--font-mono);font-size:.72rem;letter-spacing:.03em;color:#6f777b}
.fbar b{color:#c9cfd2;font-weight:500}
@media(max-width:760px){.fmain{grid-template-columns:1fr 1fr}.fbrand{grid-column:1/-1}}

/* presentation-safe: content is ALWAYS visible (no scroll-reveal dependency, no blank-flash risk). */
.js .fade{opacity:1;transform:none}
/* ===== MATERIAL (Gemini round-2: "flat and digital, missing physical tactile weight") ===== */
body{position:relative}
body::after{content:"";position:fixed;inset:0;z-index:9999;pointer-events:none;opacity:.055;
  background-image:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E");
  mix-blend-mode:multiply}
/* Inspection stamp — a physical artifact, rotated and inked, not a UI chip. */
.ins-stamp{position:absolute;z-index:2;right:1.6rem;top:1.6rem;background:rgba(247,246,243,.93);transform:rotate(-8deg);
  border:2px solid var(--accent-ink);color:var(--accent-ink);padding:.55rem .9rem .5rem;
  font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.18em;text-transform:uppercase;
  line-height:1.5;text-align:center;opacity:.72;border-radius:2px}
.ins-stamp b{display:block;font-weight:500;letter-spacing:.24em}
.ins-stamp i{display:block;font-style:normal;font-size:.6rem;opacity:.8;margin-top:.15rem}
@media(max-width:900px){.ins-stamp{display:none}}
#sectors,#projects,#services{position:relative}

/* ============ INNER PAGES ============ */
.phero{background:var(--brand);color:#eef0ef;padding:calc(var(--s7) + 3rem) 0 var(--s6);position:relative;overflow:hidden}
.phero::after{content:"";position:absolute;inset:auto -10% -60% 55%;height:120%;background:radial-gradient(closest-side,rgba(95,184,201,.18),transparent 70%);pointer-events:none}
.phero .crumb{font-family:var(--font-mono);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:#8fc9d4;margin:0 0 var(--s3)}
.phero .crumb a{color:#8fc9d4;text-decoration:none}
.phero .crumb a:hover{color:#fff}
.phero h1{font-family:var(--font-display);font-weight:600;font-size:clamp(2.1rem,5vw,3.6rem);line-height:1.05;letter-spacing:-.02em;margin:0 0 var(--s3);max-width:20ch;color:#fff}
.phero h1 em{font-style:normal;color:#f0a463}
.phero .plede{font-size:clamp(1.05rem,1.6vw,1.22rem);max-width:64ch;color:#cfdcdd;margin:0}
.phero .pmeta{display:flex;flex-wrap:wrap;gap:var(--s3) var(--s5);margin-top:var(--s4);font-family:var(--font-mono);font-size:.76rem;letter-spacing:.09em;text-transform:uppercase;color:#8fc9d4}

.psec{padding:var(--s6) 0;border-top:1px solid var(--rule)}
.psec:first-of-type{border-top:none}
.psec .num{font-family:var(--font-mono);font-size:.74rem;letter-spacing:.18em;color:var(--accent-ink);margin:0 0 var(--s2)}
.psec h2{font-family:var(--font-display);font-weight:600;font-size:clamp(1.55rem,3vw,2.3rem);letter-spacing:-.015em;line-height:1.1;margin:0 0 var(--s3);max-width:24ch}
.psec h3{font-family:var(--font-display);font-weight:600;font-size:1.16rem;margin:0 0 var(--s2)}
.psec p{max-width:70ch;margin:0 0 var(--s3)}
.psec p:last-child{margin-bottom:0}
.two{display:grid;grid-template-columns:1fr 1fr;gap:var(--s5)}
.sidebar-grid{display:grid;grid-template-columns:1.35fr .9fr;gap:var(--s6)}
@media(max-width:860px){.two,.sidebar-grid{grid-template-columns:1fr}}

.cardgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(265px,1fr));gap:var(--s4);margin-top:var(--s4)}
.pcard{border:1px solid var(--rule);border-radius:10px;padding:var(--s4);background:var(--surface);transition:transform .18s,box-shadow .18s,border-color .18s}
.pcard:hover{transform:translateY(-3px);box-shadow:0 20px 44px -30px rgba(13,74,87,.4);border-color:#cfd6d2}
.pcard .k{font-family:var(--font-mono);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--accent-ink);display:block;margin-bottom:var(--s2)}
.pcard p{font-size:.95rem;color:var(--ink-muted);margin:0}
.pcard a.more{display:inline-block;margin-top:var(--s3);font-family:var(--font-mono);font-size:.76rem;letter-spacing:.08em;color:var(--brand);text-decoration:none;border-bottom:1px solid var(--brand-tint)}
.pcard a.more:hover{border-color:var(--brand)}

.deflist{border-top:1px solid var(--rule);margin-top:var(--s4)}
.deflist .row{display:grid;grid-template-columns:200px 1fr;gap:var(--s4);padding:var(--s4) 0;border-bottom:1px solid var(--rule);align-items:start}
@media(max-width:760px){.deflist .row{grid-template-columns:1fr;gap:var(--s2)}}
.deflist dt,.deflist .t{font-family:var(--font-display);font-weight:600;font-size:1.02rem;color:var(--ink)}
.deflist .t small{display:block;font-family:var(--font-mono);font-weight:400;font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-muted);margin-top:4px}
.deflist .d{color:var(--ink-muted);font-size:.97rem}

.statrow{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:1px;background:var(--rule);border:1px solid var(--rule);border-radius:10px;overflow:hidden;margin-top:var(--s4)}
.statrow div{background:var(--surface);padding:var(--s4)}
.statrow .v{font-family:var(--font-display);font-weight:700;font-size:1.7rem;color:var(--brand);line-height:1}
.statrow .l{font-family:var(--font-mono);font-size:.7rem;letter-spacing:.13em;text-transform:uppercase;color:var(--ink-muted);margin-top:var(--s2)}

.pullbox{background:var(--brand-tint);border-left:3px solid var(--brand);border-radius:0 10px 10px 0;padding:var(--s4) var(--s5);margin:var(--s5) 0}
.pullbox p{margin:0;font-size:1.05rem;color:var(--neutral-800)}
.draftnote{background:#fdf4ea;border:1px dashed var(--accent);border-radius:10px;padding:var(--s4);margin-top:var(--s4)}
.draftnote p{margin:0;font-size:.93rem;color:var(--accent-ink)}
.draftnote b{color:var(--accent-ink)}

.reslist{margin-top:var(--s4);border-top:1px solid var(--rule)}
.reslist a.res{display:grid;grid-template-columns:44px 1fr auto;gap:var(--s4);align-items:center;padding:var(--s4) var(--s3);border-bottom:1px solid var(--rule);text-decoration:none;color:inherit;transition:background .15s}
.reslist a.res:hover{background:var(--neutral-50)}
.reslist .n{font-family:var(--font-mono);font-size:.76rem;color:var(--ink-muted)}
.reslist .ttl{font-family:var(--font-display);font-weight:600;font-size:1.02rem;color:var(--ink)}
.reslist .sub{font-size:.9rem;color:var(--ink-muted);margin-top:2px}
.reslist .go{font-family:var(--font-mono);font-size:.74rem;letter-spacing:.1em;color:var(--brand)}
@media(max-width:620px){.reslist a.res{grid-template-columns:1fr;gap:var(--s1)}.reslist .go{display:none}}

.projtable{width:100%;border-collapse:collapse;margin-top:var(--s4);font-size:.96rem}
.projtable th{text-align:left;font-family:var(--font-mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-muted);font-weight:400;padding:0 var(--s3) var(--s3) 0;border-bottom:1px solid var(--rule)}
.projtable td{padding:var(--s3) var(--s3) var(--s3) 0;border-bottom:1px solid var(--rule);vertical-align:top}
.projtable td:first-child{font-family:var(--font-mono);font-size:.78rem;color:var(--ink-muted);width:44px}
.projtable .nm{font-family:var(--font-display);font-weight:600;color:var(--ink)}
.tblwrap{overflow-x:auto}
.tag{display:inline-block;font-family:var(--font-mono);font-size:.66rem;letter-spacing:.11em;text-transform:uppercase;padding:3px 8px;border-radius:99px;background:var(--brand-tint);color:var(--brand-deep);white-space:nowrap}
.tag.hot{background:#fdeadb;color:var(--accent-ink)}

.endcta{background:var(--neutral-950);color:#eef0ef;border-radius:12px;padding:var(--s6) var(--s5);margin:var(--s6) 0 0;text-align:center}
.endcta h2{font-family:var(--font-display);font-weight:600;font-size:clamp(1.5rem,2.8vw,2.1rem);color:#fff;margin:0 0 var(--s3);max-width:26ch;margin-left:auto;margin-right:auto}
.endcta p{color:#b9c3c4;max-width:56ch;margin:0 auto var(--s4)}
.endcta .btn{background:var(--accent);color:#231202;border:none;font-weight:600}
.endcta .btn:hover{background:#f0a463;color:#231202}

.navlinks a.on{color:var(--brand);position:relative}
.navlinks a.on::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;background:var(--accent);border-radius:2px}


/* Review-only notes: hidden unless the page is opened with the review token. */
.draftnote{display:none}
body.review-mode .draftnote{display:block}
body.review-mode .draftnote::before{content:"Review note — not part of the site";display:block;font-family:var(--font-mono);font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-ink);margin-bottom:.5rem}

/* Skip link */
.skip{position:absolute;left:-9999px;top:0;background:var(--brand);color:#fff;padding:.7rem 1.1rem;z-index:999;border-radius:0 0 6px 0;font-family:var(--font-mono);font-size:.8rem}
.skip:focus{left:0}

/* Mobile navigation: a real disclosure instead of hiding six links */
.navtoggle{display:none;background:none;border:1px solid var(--rule);border-radius:7px;padding:.5rem .8rem;font-family:var(--font-mono);font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;color:var(--brand);cursor:pointer}
@media(max-width:820px){
  .navtoggle{display:inline-block}
  .navlinks{display:none;position:absolute;left:0;right:0;top:100%;background:var(--surface);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);flex-direction:column;align-items:stretch;padding:.5rem 0;box-shadow:0 18px 40px -30px rgba(13,74,87,.5);z-index:60}
  .navlinks.open{display:flex}
  .navlinks a{padding:.85rem clamp(1.25rem,4vw,2.5rem);border-bottom:1px solid var(--neutral-50);font-size:1rem}
  .navlinks a:last-child{border-bottom:none}
  .navlinks a.navcta{margin:.5rem clamp(1.25rem,4vw,2.5rem);text-align:center}
  header .nav{position:relative}
}
