/* ==========================================================================
   TACC refresh (13 Sep 2026): global identity. Loaded after tacc.css on index.html and privacy.html.
   Owner: identity agent. Replaces the North Post Group signatures inherited with the engine:
   type (Fraunces + Hanken Grotesk, TACC's own faces), surfaces (stone ivory + deep navy), the kicker,
   the header wordmark, the meridian (now a gold beam that refracts a ray at each section), the cursor
   (a small prism), grain, and the footer (a beam through the prism into an engraved rope; no giant wordmark).
   Token NAMES are unchanged; other files and prism.js depend on them.
   ========================================================================== */
@font-face{font-family:"Fraunces";src:url(../fonts/fraunces-latin-opsz-normal.woff2) format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"Fraunces";src:url(../fonts/fraunces-latin-opsz-italic.woff2) format("woff2");font-weight:100 900;font-style:italic;font-display:swap}
@font-face{font-family:"Hanken Grotesk";src:url(../fonts/hanken-grotesk-latin-wght-normal.woff2) format("woff2");font-weight:100 900;font-style:normal;font-display:swap}

:root{
  --serif:"Fraunces",Georgia,"Times New Roman",serif;
  --sans:"Hanken Grotesk","Helvetica Neue",Arial,sans-serif;
  /* surfaces: --abyss stays #0A1017 (the WebGL field paints it); the section navies deepen and turn bluer */
  --deep:#0C1727; --ink-bg:#0E1A2B;
  --paper:#EEEBE3; --mist:#F6F4EF; --card-l:#FBFAF6;
  --rule-l:#D5CFC2; --on-light:#18202B; --on-light-2:#4A515C;
  /* TACC accents */
  --gold-deep:#7A602E;        /* gold text on the stone ground (AA) */
  --beam:#CDA85E;             /* the meridian beam: reads on navy and on stone */
  --em:var(--sand-lt);        /* italic accent in display headings (was the NPG glow blue) */
  --tacc-mark:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='2 10 60 42'%3E%3Cpath d='M4 40 20.74 32.5H43.26L60 37.5' fill='none' stroke='%23EAF0F6' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M32 13 53.65 50.5H10.35Z' fill='none' stroke='%23D1AD68' stroke-width='3' stroke-linejoin='round'/%3E%3C/svg%3E");
  --facet-rule:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 42 9'%3E%3Cpath d='M0 4.5H32.6' stroke='%23000' stroke-width='1'/%3E%3Cpath d='M37.5 1.4 40.6 4.5 37.5 7.6 34.4 4.5Z' fill='none' stroke='%23000' stroke-width='1'/%3E%3C/svg%3E");
  --cur-prism:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M16 .99 29 23.51H3Z' fill='none' stroke='%23000' stroke-width='1.3' stroke-linejoin='round'/%3E%3C/svg%3E");
  --cur-prism-lg:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M16 .99 29 23.51H3Z' fill='none' stroke='%23000' stroke-width='.8' stroke-linejoin='round'/%3E%3C/svg%3E");
  --arrow-up:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 20V5' stroke='%23000' stroke-width='2' stroke-linecap='round' fill='none'/%3E%3Cpath d='M6 11l6-6 6 6' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' fill='none'/%3E%3C/svg%3E");
  --cur-prism-fill:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M16 .99 29 23.51H3Z' fill='%23000'/%3E%3C/svg%3E");
}

/* ---------- type ---------- */
body{font-weight:400;letter-spacing:.002em}
::selection{background:rgba(209,173,104,.9);color:#0A1017}
:focus-visible{outline-color:var(--sand-lt)}
.sec--paper :focus-visible,.legal :focus-visible{outline-color:var(--gold-deep)}
/* display serif: Fraunces is wider than Playfair, so the display sizes step down ~7% and the weight lightens */
.statement{font-size:clamp(2.15rem,5.25vw,5.35rem);line-height:1.04;letter-spacing:-.024em;font-weight:340}
.head h2,.flow__title{font-size:clamp(2.1rem,4.4vw,4.25rem);line-height:1.05;letter-spacing:-.022em;font-weight:340}
.page-hero h1{font-weight:320;letter-spacing:-.018em}
/* Fraunces at opsz 144 is already tightly fitted: the NPG tracking (-.028em) made the cover and interlude lines touch.
   Type defaults only; the cover and interlude owners size and place these. */
.hero__title{letter-spacing:-.012em;font-weight:330}
.interlude__line{letter-spacing:-.014em;font-weight:330}
.ledger dd{font-size:clamp(1.18rem,1.5vw,1.5rem);line-height:1.22;letter-spacing:-.006em}
.card h3,.tile h3,.pr h3,.cp-card h3,.step h4,.sel__h,.legal__body h2{letter-spacing:-.014em;font-weight:380}
.tile h3{font-size:clamp(1.6rem,2.15vw,2.1rem)}
.step h4{font-size:clamp(1.5rem,2.4vw,2.2rem)}
.pr h3{font-size:clamp(1.45rem,2.3vw,2.15rem)}
.sel__h{font-size:clamp(1.32rem,1.95vw,1.8rem)}
.enq__mail{font-weight:340;letter-spacing:-.016em}
.menu__panel a{font-weight:340;letter-spacing:-.01em}
/* smallest phones: balance cannot re-break text after a <br>, so "Capitalize from Asia." must fit one line at 320
   (it needs <= 31.8px there); tile titles step down so "Frontier Technology" stays together */
@media (max-width:359px){
  .head h2,.flow__title{font-size:1.9rem}
  .tile h3{font-size:1.45rem}
  .legal__body h2{font-size:1.58rem}
}
/* no single orphan word on a heading's last line; body copy avoids one-word last lines where supported */
h1,h2,h3,h4,.statement,.ledger dd,.flow__now-t{text-wrap:balance}
.lead,.firm__text p,.tile__text,.step p,.pr p,.sel__item p,.cp-card p,.legal__body p,.ftr__disc{text-wrap:pretty}
/* italic accent in display headings: gold (NPG used a pale blue) */
.hl em,.interlude__line em,.page-hero h1 em,.plat h2 em,.enq h2 em,.teamlink h2 em{color:var(--em)}
/* the privacy contents arrow: neither Fraunces nor Hanken carries U+2193, Geist Mono does (no emoji fallback on iOS) */
.legal__toc a::after{font-family:var(--mono);font-size:.9em}

/* ---------- kicker: a gold rule that ends in a facet ---------- */
.kicker{font-size:.7rem;letter-spacing:.2em;color:var(--sand-lt);gap:14px}
.kicker::before{width:42px;height:9px;opacity:1;background:currentColor;
  -webkit-mask:var(--facet-rule) left center/42px 9px no-repeat;mask:var(--facet-rule) left center/42px 9px no-repeat}
.sec--paper .kicker{color:var(--gold-deep)}

/* ---------- header: the prism mark + the wordmark; the nav set in the display serif, sentence case ---------- */
.hdr__brand{display:inline-flex;align-items:center;gap:13px;text-decoration:none}
.hdr__brand::before{content:"";flex:none;width:31px;height:22px;background:var(--tacc-mark) center/contain no-repeat;transform:translateY(-1px)}
.hdr__brand .wordmark{font-weight:430;font-size:clamp(.98rem,1.12vw,1.12rem);letter-spacing:.24em}
.hdr__nav a{font-family:var(--serif);font-size:1.02rem;font-weight:380;letter-spacing:0;text-transform:none;padding:10px 13px;color:#DCE3EC}
.hdr__nav a:hover,.hdr__nav a:focus-visible{font-weight:380;color:#fff}
.hdr__nav a::after{left:13px;right:13px;bottom:6px}
.hdr.is-solid{background:rgba(10,17,28,.9)}   /* .74 read as a muddy grey bar over the stone sections */
.menu__panel{background:rgba(10,17,28,.97)}

/* ---------- surfaces ---------- */
/* paper: stone ivory with an engraved double rule at its top edge (a print grain was tried and dropped: invisible at 1:1) */
.sec--paper,.legal{background:var(--paper);box-shadow:inset 0 1px 0 rgba(168,132,63,.42),inset 0 4px 0 var(--paper),inset 0 5px 0 rgba(168,132,63,.18)}
.card,.cp-card{background:var(--card-l)}
.cp-card:hover,.card:hover{border-color:#BDB39F;box-shadow:0 30px 70px -42px rgba(24,32,43,.38)}
.flow__dots button:hover,.cp__arrow:hover:not(:disabled),.cp__arrow:focus-visible{border-color:var(--gold-deep);color:var(--gold-deep)}
/* dark: deep navy. Only the section under the cover starts from the cover's near-black; the others open in navy */
.sec--dark{background:linear-gradient(180deg,var(--deep) 0%,var(--ink-bg) 100%)}
.hero + .sec--dark{background:linear-gradient(180deg,var(--abyss) 0%,var(--deep) 55%,var(--ink-bg) 100%)}
/* the grain is finer and quieter than the NPG film grain */
.hero::after,.sec--dark::before,.sec--ink::before,.ftr::before,.interlude::before,.page-hero::after{background-size:150px 150px;opacity:.3}

/* ---------- the meridian, recast as a beam: a dotted track, a gold beam that fills with the scroll, and at each
   section node the beam refracts a ray out to the kicker (site.js builds the path, nodes and ticks) ---------- */
.meridian__base{stroke:rgba(196,160,92,.4);stroke-width:1.1;stroke-dasharray:.1 6;stroke-linecap:round}
.meridian__line{stroke:var(--beam);stroke-width:1.3;stroke-linecap:round}
.meridian .m-node{fill:rgba(205,168,94,.14);stroke:rgba(205,168,94,.9);stroke-width:1.1;stroke-dasharray:5.38 3;transform-box:fill-box;transform-origin:center;
  transition:fill .5s,stroke .5s,stroke-width .6s var(--ease),transform .9s var(--ease)}
.meridian .m-node.is-on{fill:var(--sand-lt);stroke:rgba(209,173,104,.32);stroke-width:6;stroke-dasharray:none;transform:rotate(120deg)}
.meridian .m-tick{stroke:var(--beam);stroke-width:1.1;stroke-linecap:round;stroke-dasharray:70;stroke-dashoffset:70;transition:stroke-dashoffset .9s var(--ease) .12s}
.meridian .m-tick:has(+ .m-node.is-on){stroke-dashoffset:0}

/* ---------- cursor: a small prism with a gold point (difference blend keeps it legible on navy and on stone) ---------- */
.cursor{mix-blend-mode:difference}
.cursor__ring{width:30px;height:30px;margin:-15px 0 0 -15px;border:0;border-radius:0;mix-blend-mode:normal}
.cursor__ring::before,.cursor__ring::after{content:"";position:absolute;inset:0;background:#D8B56E;transition:transform .7s var(--ease),opacity .4s}
.cursor__ring::before{-webkit-mask:var(--cur-prism) center/contain no-repeat;mask:var(--cur-prism) center/contain no-repeat}
.cursor__ring::after{opacity:0;-webkit-mask:var(--cur-prism-fill) center/contain no-repeat;mask:var(--cur-prism-fill) center/contain no-repeat}
.cursor.is-link .cursor__ring{width:54px;height:54px;margin:-27px 0 0 -27px;background:none}
.cursor.is-link .cursor__ring::before{-webkit-mask-image:var(--cur-prism-lg);mask-image:var(--cur-prism-lg);transform:rotate(180deg)}
.cursor.is-link .cursor__ring::after{opacity:.14;transform:rotate(180deg)}
.cursor.is-tile .cursor__ring{width:70px;height:70px;margin:-35px 0 0 -35px;border-style:none}
.cursor.is-tile .cursor__ring::before{-webkit-mask-image:var(--cur-prism-lg);mask-image:var(--cur-prism-lg);animation:tacc-turn 9s linear infinite}
.cursor__dot{width:6px;height:6px;margin:-3px 0 0 -3px;border-radius:0;background:none}
.cursor__dot::before{content:"";position:absolute;inset:0;background:#D8B56E;transform:rotate(45deg) scale(.82)}
@keyframes tacc-turn{to{transform:rotate(360deg)}}

/* ==========================================================================
   Footer: the TACC colophon. A beam of three braided strands enters the prism and leaves as an engraved
   guilloche rope (share-certificate engraving); below it, the lockup, a numbered index, correspondence, and the
   legal line between gold rules. site.js drawables() draws the band's paths on reveal (.ftr__horizon svg).
   ========================================================================== */
.ftr{background:linear-gradient(180deg,var(--ink-bg) 0,var(--ink-bg) 170px,var(--deep) 55%,var(--abyss) 100%)}
/* home: the footer rises into the enquiries section's bottom padding (same navy), so the band sits nearer the card */
.home .ftr{margin-top:calc(clamp(96px,13vw,190px) * -.45)}
.ftr__band{position:relative;z-index:1;height:clamp(84px,8.4vw,120px);margin-top:clamp(8px,1.4vw,20px)}
.ftr__band .ftr__braid{position:absolute;inset:0;width:100%;height:100%;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 11%,#000 89%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 11%,#000 89%,transparent 100%)}
.fb-beam path{fill:none;stroke:rgba(234,240,246,.66);stroke-width:1;vector-effect:non-scaling-stroke}
.fb-rope path{fill:none;stroke:rgba(209,173,104,.5);stroke-width:.8;vector-effect:non-scaling-stroke}
.fb-rail{fill:none;stroke:rgba(209,173,104,.3);stroke-width:.8;vector-effect:non-scaling-stroke}
.ftr__band .ftr__prism{position:absolute;left:50%;top:50%;width:clamp(54px,4.6vw,68px);height:auto;transform:translate(-50%,-50%);overflow:visible}
.fp-body{fill:var(--ink-bg);stroke:rgba(234,240,246,.7);stroke-width:1.2;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.fp-ray{fill:none;stroke:rgba(234,240,246,.42);stroke-width:1;stroke-linecap:round;vector-effect:non-scaling-stroke}
.fp-edge{fill:none;stroke:var(--sand-lt);stroke-width:1.9;stroke-linecap:round;vector-effect:non-scaling-stroke}
/* the draw: beam first, then the prism, then the rope (dash 1.5x: non-scaling strokes on a stretched band run long) */
.js:not(.rm) .ftr__band [data-drawable] path{stroke-dasharray:1.5 1.53;stroke-dashoffset:1.53;transition:stroke-dashoffset 2.8s cubic-bezier(.45,.05,.3,1)}
.js:not(.rm) .ftr__band [data-drawable].is-drawn path{stroke-dashoffset:0}
.js:not(.rm) .ftr__band .ftr__prism path{transition-duration:1.6s;transition-delay:.8s}
.js:not(.rm) .ftr__band .fb-rope path,.js:not(.rm) .ftr__band path.fb-rail{transition-delay:1.3s}

.ftr__plate{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) minmax(0,.9fr);gap:clamp(36px,5vw,84px);padding-block:clamp(44px,5.4vw,80px) clamp(44px,5vw,72px)}
.ftr__brand{display:inline-flex;flex-direction:column;align-items:flex-start;gap:16px;text-decoration:none;color:#F4F7FB}
.ftr__tacc{font-family:var(--serif);font-weight:300;font-size:clamp(3.6rem,7vw,6.6rem);line-height:.82;letter-spacing:.035em;margin-left:-.04em}
.ftr__partners{font-family:var(--mono);font-size:.7rem;letter-spacing:.56em;text-transform:uppercase;color:var(--sand-lt);padding-left:.1em}
.ftr__desc{margin-top:clamp(24px,2.6vw,34px);font-family:var(--serif);font-style:italic;font-weight:320;font-size:clamp(1.15rem,1.4vw,1.32rem);line-height:1.4;color:var(--on-dark-2)}
.ftr__loc{margin-top:10px;font-family:var(--mono);font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--on-dark-3)}
.ftr__h{font-family:var(--mono);font-size:.64rem;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--sand-lt);padding-bottom:14px;border-bottom:1px solid rgba(209,173,104,.3)}
.ftr__index ol{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:clamp(20px,2.4vw,34px)}
.ftr__index li{border-bottom:1px solid var(--rule-d)}
.ftr__index a{display:flex;align-items:baseline;gap:12px;min-height:46px;padding:12px 0;text-decoration:none;font-size:.98rem;line-height:1.3;color:var(--on-dark-2);transition:color .35s}
.ftr__n{flex:none;width:1.9rem;font-family:var(--serif);font-style:italic;font-size:.95rem;color:var(--sand-lt);opacity:.7;transition:opacity .35s,transform .5s var(--ease)}
.ftr__index a:hover,.ftr__index a:focus-visible{color:#fff}
.ftr__index a:hover .ftr__n,.ftr__index a:focus-visible .ftr__n{opacity:1;transform:translateX(3px)}
.ftr__desk{display:flex;flex-direction:column;min-width:0}
.ftr__desk .ftr__h + *{margin-top:18px}
.ftr__desk .ftr__h:not(:first-child){margin-top:clamp(30px,3vw,40px)}
.ftr__mail{align-self:flex-start;max-width:100%;overflow-wrap:anywhere;font-family:var(--serif);font-weight:340;font-size:clamp(1.3rem,1.75vw,1.62rem);line-height:1.2;letter-spacing:-.012em;color:#F4F7FB;text-decoration:none;padding-bottom:6px;
  background:linear-gradient(var(--sand-lt),var(--sand-lt)) 0 100%/100% 1px no-repeat;transition:background-size .6s var(--ease)}
.ftr__mail:hover,.ftr__mail:focus-visible{background-size:0 1px;background-position:100% 100%}
.ftr__ext{align-self:flex-start;display:inline-flex;align-items:center;gap:12px;font-family:var(--serif);font-style:italic;font-weight:340;font-size:clamp(1.2rem,1.5vw,1.4rem);line-height:1.2;color:#F4F7FB;text-decoration:none;padding-block:4px}
.ftr__ext::after{content:"";flex:none;width:.62rem;height:.62rem;background-color:var(--sand-lt);-webkit-mask:var(--arrow-ne) center/contain no-repeat;mask:var(--arrow-ne) center/contain no-repeat;transition:transform .5s var(--ease)}
.ftr__ext:hover::after,.ftr__ext:focus-visible::after{transform:translate(3px,-3px)}

.ftr__legal{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px 56px;align-items:end;padding-block:28px 36px;border-top:1px solid rgba(209,173,104,.34)}
.ftr__legal::before{content:"";position:absolute;left:0;right:0;top:3px;border-top:1px solid rgba(209,173,104,.13)}
.ftr__disc{max-width:78ch;font-size:.84rem;line-height:1.62;color:var(--on-dark-3)}
.ftr__meta2{display:flex;align-items:center;flex-wrap:wrap;gap:6px 26px;font-family:var(--mono);font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--on-dark-3);white-space:nowrap}
.ftr__meta2 a{display:inline-flex;align-items:center;gap:10px;min-height:40px;color:var(--on-dark-2);text-decoration:none;transition:color .3s}
.ftr__meta2 a:hover,.ftr__meta2 a:focus-visible,.ftr__meta2 a[aria-current="page"]{color:#fff}
.ftr__up{position:relative;flex:none;width:26px;height:26px;margin-inline:2px 6px;border:1px solid rgba(209,173,104,.5);transform:rotate(45deg);transition:background-color .4s,border-color .4s}
.ftr__up::before{content:"";position:absolute;inset:0;background:var(--sand-lt);transform:rotate(-45deg);
  -webkit-mask:var(--arrow-up) center/50% 50% no-repeat;mask:var(--arrow-up) center/50% 50% no-repeat}
.ftr__meta2 a:hover .ftr__up,.ftr__meta2 a:focus-visible .ftr__up{border-color:var(--sand-lt);background:rgba(209,173,104,.14)}

@media (max-width:1080px){
  .ftr__plate{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"lockup desk" "index index";row-gap:clamp(40px,5vw,56px)}
  .ftr__lockup{grid-area:lockup}.ftr__desk{grid-area:desk}.ftr__index{grid-area:index}
  .ftr__index ol{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:720px){
  .ftr__plate{grid-template-columns:minmax(0,1fr);grid-template-areas:"lockup" "index" "desk";gap:40px}
  .ftr__index ol{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ftr__legal{grid-template-columns:minmax(0,1fr);gap:16px;padding-block:24px 30px}
  .ftr__meta2{justify-content:space-between;gap:4px 18px}
  .ftr__meta2 li:first-child{flex-basis:100%}
}
@media (max-width:360px){
  .ftr__index a{font-size:.92rem;gap:8px}
  .ftr__n{width:1.6rem}
  .ftr__partners{letter-spacing:.44em}
}

/* privacy page: its calm field sits on the field poster, not the cover's globe poster (integration, 13 Sep 2026) */
.page-hero .hero__art{background-image:url(../img/field-poster.jpg)}

/* smallest phones (<=360px): the prism mark + wordmark + Menu must fit one row (integration, 13 Sep 2026: header was 342px wide at 320) */
@media (max-width:360px){
  .hdr__in{gap:10px}
  .hdr__brand{gap:9px}
  .hdr__brand::before{width:24px;height:17px}
  .hdr__brand .wordmark{font-size:.86rem;letter-spacing:.16em}
  .menu summary{gap:8px}
}
/* interlude captions under the clocks: balance the two lines so no word sits alone */
.city__role{text-wrap:balance}

/* the house statement on the smallest phones: slightly smaller so "coveted opportunities" stays together without widening the page (integration, 13 Sep 2026) */
@media (max-width:360px){.firm .statement{font-size:1.95rem}}