/*
Theme Name: NTA Consulting Engineers
Theme URI: https://ntaengineers.co.za
Author: The Colour Blue
Description: Bespoke classic theme for NTA Consulting Engineers (Pty) Ltd, built from the approved Claude Design pages. Custom post types for Projects and Services; no page builder.
Version: 2.0.0
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
License: Proprietary
Text Domain: nta
*/

/* ==================================================================
   FONTS — self-hosted (SIL Open Font Licence). No third-party request.
   Newsreader carries the serif ledes; IBM Plex Sans is used only for
   the logo lockup. Headings and body use the Helvetica Neue system
   stack the design specifies, which needs no download.
   ================================================================== */
@font-face{
  font-family:'Newsreader';
  src:url('assets/fonts/newsreader-var-latin.woff2') format('woff2');
  font-weight:300 400;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:'IBM Plex Sans';
  src:url('assets/fonts/ibm-plex-sans-var-latin.woff2') format('woff2');
  font-weight:400 600;
  font-style:normal;
  font-display:swap;
}

/* ==================================================================
   TOKENS — every colour, size and spacing value in the theme.
   No raw colour value appears anywhere below this block.
   ================================================================== */
:root{
  /* colour — ground and ink */
  --nta-ground:#E8E4D8;            /* page ground, as designed. Do not change. */
  --nta-ink:#15171A;
  --nta-charcoal:#23262B;
  --nta-paper:#F6F5F2;

  /* colour — gold */
  --nta-gold:#C9A227;              /* brand gold: dark grounds and button fills */
  --nta-deep-gold:#8A6E14;         /* brand deep gold: LINES, underlines, dots only.
                                      As small text on --nta-ground it is 3.82:1 and fails AA. */
  --nta-gold-text:#735B11;         /* gold TEXT on light grounds: same hue, darkened to pass AA.
                                      5.11:1 on ground, 4.51:1 on the hovered card,
                                      5.96:1 with paper text on it. */

  /* colour — text on light */
  --nta-text-lede:#2A2E34;         /* 10.74:1 */
  --nta-text-2:#343941;            /*  9.14:1 */
  --nta-text-3:#4A505A;            /*  6.39:1 */
  --nta-steel:#5C636E;             /*  4.77:1 — labels */

  /* colour — text on dark */
  --nta-on-dark-muted:#AFACA2;     /* 6.68:1 on charcoal */
  --nta-on-dark-soft:#B9B6AC;      /* 8.85:1 on ink */

  /* colour — surfaces and rules */
  --nta-frame:#D6D2C4;             /* photograph frame ground */
  --nta-card-hover:#DCD7C7;
  --nta-header-bg:rgba(232,228,216,0.92);
  --nta-hatch:rgba(21,23,26,0.05);
  --nta-tint:rgba(21,23,26,0.04);
  --nta-rule-faint:rgba(21,23,26,0.10);
  --nta-rule-soft:rgba(21,23,26,0.12);
  --nta-rule:rgba(21,23,26,0.14);
  --nta-rule-strong:rgba(21,23,26,0.20);
  --nta-rule-filter:rgba(21,23,26,0.22);
  --nta-rule-btn:rgba(21,23,26,0.25);
  --nta-rule-input:rgba(21,23,26,0.28);
  --nta-rule-dark:rgba(246,245,242,0.22);
  --nta-lockup-rule:rgba(35,38,43,0.30);
  --nta-label-bg:rgba(21,23,26,0.74);   /* credit label over photographs: paper text on it is >= 8:1 */
  --nta-error:#A8322A;             /* 5.24:1 on ground */

  /* type — families */
  --nta-sans:'Helvetica Neue',Helvetica,Arial,sans-serif;
  --nta-serif:'Newsreader',Georgia,serif;
  --nta-mono:ui-monospace,'SF Mono',Menlo,Consolas,monospace;
  --nta-brand:'IBM Plex Sans','Helvetica Neue',Helvetica,Arial,sans-serif;

  /* type — sizes */
  --fs-display:clamp(40px,7vw,88px);
  --fs-title:clamp(38px,6vw,76px);
  --fs-h2-xl:clamp(30px,4.2vw,52px);
  --fs-h2-lg:clamp(30px,3.8vw,48px);
  --fs-h2-home-split:clamp(30px,3.6vw,44px);
  --fs-h2:clamp(28px,3.4vw,44px);
  --fs-h2-service:clamp(28px,3.4vw,42px);
  --fs-h2-sm:clamp(28px,3.2vw,40px);
  --fs-lede-hero:clamp(19px,2vw,23px);
  --fs-lede:clamp(18px,1.8vw,22px);
  --fs-24:24px; --fs-23:23px; --fs-22:22px; --fs-21:21px; --fs-20:20px;
  --fs-19:19px; --fs-18:18px; --fs-17:17px; --fs-16-5:16.5px; --fs-16:16px;
  --fs-15-5:15.5px; --fs-15:15px; --fs-14-5:14.5px; --fs-14:14px; --fs-13-5:13.5px;
  --fs-13:13px; --fs-12-5:12.5px; --fs-12:12px; --fs-11-5:11.5px; --fs-11:11px;
  --fs-lockup-name:17px; --fs-lockup-desc:9.5px;

  /* type — weights */
  --fw-light:300; --fw-regular:400; --fw-medium:500; --fw-semi:600;

  /* space */
  --s-2:2px;  --s-4:4px;  --s-5:5px;  --s-6:6px;  --s-7:7px;  --s-8:8px;
  --s-9:9px;  --s-10:10px; --s-11:11px; --s-12:12px; --s-13:13px; --s-14:14px;
  --s-16:16px; --s-17:17px; --s-18:18px; --s-20:20px; --s-22:22px; --s-24:24px;
  --s-26:26px; --s-28:28px; --s-32:32px; --s-36:36px; --s-40:40px; --s-44:44px;
  --s-48:48px; --s-56:56px; --s-64:64px; --s-72:72px; --s-80:80px; --s-88:88px;
  --s-96:96px; --s-104:104px; --s-112:112px;

  /* structure */
  --nta-max:1360px;
  --nta-gutter:32px;
  --nta-clear:13px;               /* lockup clear space: 37% of the 34px mark = 12.6px */
  --nta-mark-h:34px;
  --nta-mark-w:63px;
  --nta-dot:6px;
  --nta-tap:44px;
  --nta-card-min:300px;
  --ease-out:cubic-bezier(0.22,1,0.36,1);
}

/* ==================================================================
   BASE
   ================================================================== */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;background:var(--nta-ground);color:var(--nta-ink);
  font-family:var(--nta-sans);font-size:var(--fs-16);line-height:normal;  /* as designed: roles set their own line-height */
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none}
a:hover{color:var(--nta-gold-text)}
::selection{background:var(--nta-gold);color:var(--nta-charcoal)}
img{max-width:100%;height:auto;display:block}
[hidden]{display:none !important}   /* component display rules must never defeat the hidden attribute */
h1,h2,h3{font-weight:var(--fw-medium);margin:0;overflow-wrap:break-word;hyphens:manual}
p{margin:0}
dl,dd{margin:0}
ul{margin:0;padding:0;list-style:none}
button{font:inherit}
.site{overflow-x:hidden}
.wrap{max-width:var(--nta-max);margin-inline:auto;padding-inline:var(--nta-gutter)}

/* focus — visible everywhere, never just the browser default */
:focus-visible{outline:2px solid var(--nta-deep-gold);outline-offset:3px}
.dark :focus-visible,.cta :focus-visible{outline-color:var(--nta-gold)}

.skip-link{position:absolute;left:var(--s-16);top:calc(-1 * var(--s-112));z-index:100;
  background:var(--nta-ink);color:var(--nta-paper);padding:var(--s-12) var(--s-20);
  min-height:var(--nta-tap);display:inline-flex;align-items:center;
  font-size:var(--fs-13);letter-spacing:.08em;text-transform:uppercase}
.skip-link:focus{top:var(--s-12);color:var(--nta-paper)}
.screen-reader-text{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ==================================================================
   TYPE ROLES
   ================================================================== */
.eyebrow{font-size:var(--fs-11-5);letter-spacing:.16em;text-transform:uppercase;color:var(--nta-gold-text);margin:0 0 var(--s-22)}
.eyebrow--steel{color:var(--nta-steel)}
.eyebrow--28{margin-bottom:var(--s-28)}
.dark .eyebrow{color:var(--nta-gold)}
.kicker{font-size:var(--fs-12-5);letter-spacing:.18em;text-transform:uppercase;color:var(--nta-steel);margin:0 0 var(--s-40)}
.crumbs{font-family:var(--nta-mono);font-size:var(--fs-11-5);letter-spacing:.1em;text-transform:uppercase;color:var(--nta-steel);margin:0 0 var(--s-40)}
.num{font-family:var(--nta-mono);font-size:var(--fs-11-5);color:var(--nta-gold-text)}
.dark .num{color:var(--nta-gold)}

.display{font-size:var(--fs-display);line-height:1.02;letter-spacing:-.03em;max-width:17ch;text-wrap:pretty}
.title{font-size:var(--fs-title);line-height:1.04;letter-spacing:-.03em;text-wrap:pretty}
.measure-14{max-width:14ch}.measure-15{max-width:15ch}.measure-16{max-width:16ch}
.measure-18{max-width:18ch}.measure-20{max-width:20ch}.measure-22{max-width:22ch}

.h2-lg{font-size:var(--fs-h2-lg);line-height:1.08;letter-spacing:-.025em}
.h2{font-size:var(--fs-h2);line-height:1.1;letter-spacing:-.025em}
.h2-sm{font-size:var(--fs-h2-sm);line-height:1.12;letter-spacing:-.025em}

.serif{font-family:var(--nta-serif);font-weight:var(--fw-light);color:var(--nta-text-lede)}
.serif--19{font-size:var(--fs-19);line-height:1.55;max-width:44ch}
.serif--20{font-size:var(--fs-20);line-height:1.5;max-width:40ch}
.dark .serif{color:var(--nta-ground)}

/* ==================================================================
   HEADER
   ================================================================== */
.site-header{position:sticky;top:0;z-index:50;background:var(--nta-header-bg);
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  border-bottom:1px solid var(--nta-rule-faint)}
.admin-bar .site-header{top:32px}
@media (max-width:782px){.admin-bar .site-header{top:46px}}
@media (max-width:600px){.admin-bar .site-header{top:0}}
.site-header__inner{max-width:var(--nta-max);margin:0 auto;padding:var(--s-18) var(--nta-gutter);
  display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-24) var(--s-40)}
.brand{display:flex;align-items:center;margin-right:auto;flex:none;color:var(--nta-charcoal)}
.brand:hover{color:var(--nta-charcoal)}

.lockup{display:flex;align-items:center;gap:var(--nta-clear)}
.lockup__mark{display:block;flex:none;width:var(--nta-mark-w);height:var(--nta-mark-h);color:var(--nta-charcoal)}
.lockup__rule{width:1px;height:var(--nta-mark-h);background:var(--nta-lockup-rule);flex:none}
.lockup__text{display:flex;flex-direction:column;gap:var(--s-5);line-height:1;color:var(--nta-charcoal);font-family:var(--nta-brand);white-space:nowrap}
.lockup__name{font-size:var(--fs-lockup-name);font-weight:var(--fw-semi);letter-spacing:.02em}
.lockup__desc{font-size:var(--fs-lockup-desc);font-weight:var(--fw-regular);letter-spacing:.28em;text-transform:uppercase}

.nav{display:flex;flex-wrap:wrap;gap:var(--s-8) var(--s-32);font-size:var(--fs-13-5);letter-spacing:.04em}
.nav__link{position:relative;padding-bottom:var(--s-4)}
.nav__link[aria-current="page"]::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--nta-deep-gold)}

/* ==================================================================
   BUTTONS AND LINKS
   ================================================================== */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s-8);
  font-family:inherit;font-size:var(--fs-13);letter-spacing:.08em;text-transform:uppercase;line-height:normal;
  padding:var(--s-16) var(--s-26);border:0;cursor:pointer;
  transition:background-color .25s ease,color .25s ease,border-color .25s ease}
.btn--gold{background:var(--nta-gold);color:var(--nta-charcoal)}
.btn--gold:hover{background:var(--nta-ink);color:var(--nta-paper)}
.btn--line{background:transparent;color:var(--nta-ink);border:1px solid var(--nta-rule-btn)}
.btn--line:hover{border-color:var(--nta-ink);background:var(--nta-tint);color:var(--nta-ink)}
.btn--ink{padding:var(--s-11) var(--s-20);background:var(--nta-ink);color:var(--nta-paper)}
.btn--ink:hover{background:var(--nta-gold-text);color:var(--nta-paper)}
.btn--paper{padding:var(--s-18) var(--s-28);background:var(--nta-paper);color:var(--nta-ink);align-self:flex-start}
.btn--paper:hover{background:var(--nta-gold);color:var(--nta-charcoal)}
.btn--submit{padding:var(--s-17) var(--s-28);align-self:flex-start}

.link-arrow{font-size:var(--fs-13);letter-spacing:.08em;text-transform:uppercase;color:var(--nta-gold-text);
  border-bottom:1px solid var(--nta-deep-gold);padding-bottom:var(--s-5)}
.link-arrow:hover{color:var(--nta-ink);border-color:var(--nta-ink)}

/* ==================================================================
   PHOTOGRAPH FRAMES
   ================================================================== */
.frame{position:relative;overflow:hidden;display:flex;align-items:flex-end;justify-content:space-between;gap:var(--s-24);
  padding:var(--s-20);background-color:var(--nta-frame);
  background-image:repeating-linear-gradient(112deg,var(--nta-hatch) 0 2px,transparent 2px 13px)}
.frame--16x7{aspect-ratio:16/7;padding:var(--s-28) var(--s-32)}
.frame--16x10{aspect-ratio:16/10}
.frame--8x5{aspect-ratio:8/5}
.frame--4x3{aspect-ratio:4/3;padding:var(--s-22)}
.frame--filled{background-image:none}
.frame__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.frame__caption,.frame__num{font-family:var(--nta-mono);font-size:var(--fs-11);letter-spacing:.08em;text-transform:uppercase;color:var(--nta-text-3)}
.frame--16x7 .frame__caption,.frame--16x7 .frame__num{font-size:var(--fs-11-5);letter-spacing:.09em}
.frame--filled .frame__num{display:none}
.frame__credit{position:relative;z-index:1;align-self:flex-end;max-width:100%;background:var(--nta-label-bg);color:var(--nta-paper);
  font-family:var(--nta-mono);font-size:var(--fs-11);line-height:1.4;letter-spacing:.04em;padding:var(--s-6) var(--s-9)}

/* ==================================================================
   SECTIONS
   ================================================================== */
.section{padding-top:var(--s-104)}
.section--96{padding-top:var(--s-96)}
.section--88{padding-top:var(--s-88)}
.section--72{padding-top:var(--s-72)}
.section--48{padding-top:var(--s-48)}
.section--28{padding-top:var(--s-28)}

.dark{background:var(--nta-charcoal);color:var(--nta-paper);margin-top:var(--s-112)}
.dark--104{margin-top:var(--s-104)}
.dark__inner{padding-block:var(--s-104)}
.dark__inner--96{padding-block:var(--s-96)}

.head{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:var(--s-48);align-items:start}
.head--projects{display:flex;flex-wrap:wrap;gap:var(--s-32);align-items:flex-end;justify-content:space-between}
.head__aside{font-size:var(--fs-14-5);line-height:1.6;color:var(--nta-text-3);max-width:38ch}

.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:var(--s-48);margin-top:var(--s-80)}
.steps--practice{margin-top:var(--s-72)}
.steps--stages{grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr));gap:var(--s-40);margin-top:var(--s-72)}
.step{border-top:1px solid var(--nta-rule-dark);padding-top:var(--s-24);display:flex;flex-direction:column;gap:var(--s-14)}
.steps--stages .step{padding-top:var(--s-22);gap:var(--s-12)}
.step__title{font-size:var(--fs-23);line-height:1.18;letter-spacing:-.02em}
.steps--stages .step__title{font-size:var(--fs-19);line-height:1.2;letter-spacing:-.015em}
.step__body{font-size:var(--fs-15);line-height:1.65;color:var(--nta-on-dark-muted)}
.steps--stages .step__body{font-size:var(--fs-14-5);line-height:1.6}

/* ==================================================================
   INNER PAGE INTRO
   ================================================================== */
.intro{padding-top:var(--s-88)}
.intro__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:var(--s-48);align-items:end;
  padding-bottom:var(--s-56);border-bottom:1px solid var(--nta-rule)}
.intro__lede{font-family:var(--nta-serif);font-size:var(--fs-lede);line-height:1.5;font-weight:var(--fw-light);color:var(--nta-text-lede);max-width:44ch}

/* ==================================================================
   HOMEPAGE
   ================================================================== */
.hero{padding-top:var(--s-96)}
.hero__row{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:var(--s-48);align-items:end;margin-top:var(--s-56)}
.hero__lede{font-family:var(--nta-serif);font-size:var(--fs-lede-hero);line-height:1.5;font-weight:var(--fw-light);color:var(--nta-text-lede);max-width:46ch}
.hero__actions{display:flex;flex-wrap:wrap;gap:var(--s-12)}

.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));border-bottom:1px solid var(--nta-rule)}
.fact{padding:var(--s-32) var(--s-24) var(--s-32) 0}
.fact__label{font-size:var(--fs-11-5);letter-spacing:.16em;text-transform:uppercase;color:var(--nta-steel);margin:0 0 var(--s-10)}
.fact__value{font-size:var(--fs-17);letter-spacing:-.01em;color:var(--nta-ink)}

.service-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));margin-top:var(--s-64);border-top:1px solid var(--nta-rule)}
.service-card{background:var(--nta-ground);padding:var(--s-36) var(--s-28) var(--s-40);display:flex;flex-direction:column;gap:var(--s-16);
  min-height:var(--nta-card-min);border-bottom:1px solid var(--nta-rule);transition:background-color .4s ease}
.service-card:hover{background:var(--nta-card-hover)}
.service-card__title{font-size:var(--fs-21);line-height:1.2;letter-spacing:-.015em}
.service-card__body{font-size:var(--fs-14-5);line-height:1.6;color:var(--nta-text-3)}
.service-card__list{margin-top:auto;border-top:1px solid var(--nta-rule-soft);padding-top:var(--s-16);display:flex;flex-direction:column;gap:var(--s-7)}
.service-card__list li{font-size:var(--fs-13);letter-spacing:.01em;color:var(--nta-steel)}

.split{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:var(--s-64);align-items:center}
.split__title{font-size:var(--fs-h2-home-split);line-height:1.1;letter-spacing:-.025em;margin:0 0 var(--s-28)}
.split__text{font-size:var(--fs-16);line-height:1.7;color:var(--nta-text-2);max-width:48ch;margin:0 0 var(--s-18)}
.split__text:last-of-type{margin-bottom:var(--s-32)}

/* ==================================================================
   PROJECT CARDS AND FILTER
   ================================================================== */
.project-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:var(--s-28);margin-top:var(--s-56)}
.project-grid--page{grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:var(--s-40) var(--s-28);margin-top:0}
.project-card{display:flex;flex-direction:column;gap:var(--s-18)}
.project-card[hidden]{display:none}
a.project-card:hover{color:var(--nta-ink)}
a.project-card:hover .project-card__title{text-decoration:underline;text-decoration-color:var(--nta-deep-gold);text-underline-offset:4px}
.project-card__text{display:flex;flex-direction:column;gap:var(--s-8)}
.project-grid--page .project-card__text{gap:var(--s-10)}
.project-card__discipline{font-size:var(--fs-11-5);letter-spacing:.14em;text-transform:uppercase;color:var(--nta-gold-text)}
.project-card__title{font-size:var(--fs-22);line-height:1.18;letter-spacing:-.02em}
.project-card__note{font-size:var(--fs-14);line-height:1.55;color:var(--nta-text-3)}
.project-grid--page .project-card__note{font-size:var(--fs-14-5);line-height:1.6}
.project-card__facts{margin:auto 0 0;padding-top:var(--s-16);border-top:1px solid var(--nta-rule);
  display:grid;grid-template-columns:auto 1fr;gap:var(--s-8) var(--s-20);font-size:var(--fs-13)}
.project-card__facts dt{color:var(--nta-steel);letter-spacing:.04em}
.project-card__facts dd{margin:0;color:var(--nta-text-2);text-align:right}

.filters{display:flex;flex-wrap:wrap;gap:var(--s-10);align-items:center;padding-bottom:var(--s-28);border-bottom:1px solid var(--nta-rule)}
.filters__group{display:contents}
.filters__label{font-size:var(--fs-11-5);letter-spacing:.16em;text-transform:uppercase;color:var(--nta-steel);margin-right:var(--s-12)}
.filter{font-size:var(--fs-13);letter-spacing:.02em;padding:var(--s-9) var(--s-16);border:1px solid var(--nta-rule-filter);
  background:transparent;color:var(--nta-text-2);cursor:pointer;transition:border-color .25s ease,color .25s ease}
.filter:hover{border-color:var(--nta-ink);color:var(--nta-ink)}
.filter[aria-pressed="true"]::before{content:"";display:inline-block;width:var(--nta-dot);height:var(--nta-dot);
  background:var(--nta-deep-gold);margin-right:var(--s-9);vertical-align:middle}
.filters__count{font-family:var(--nta-mono);font-size:var(--fs-11-5);color:var(--nta-steel);margin-left:auto}
.filters__empty{font-size:var(--fs-15);color:var(--nta-text-3);padding-top:var(--s-24)}

.note-row{margin-top:var(--s-96);border-top:1px solid var(--nta-rule);padding-top:var(--s-40);
  display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:var(--s-48);align-items:start}
.note-row__text{font-size:var(--fs-15);line-height:1.7;color:var(--nta-text-3);max-width:46ch}

/* ==================================================================
   SERVICES PAGE
   ================================================================== */
.service-index{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));gap:var(--s-24);
  padding:var(--s-28) 0;border-bottom:1px solid var(--nta-rule)}
.service-index__link{display:flex;gap:var(--s-12);align-items:baseline;font-size:var(--fs-14-5);letter-spacing:-.01em}
.service-block{padding-top:var(--s-96);scroll-margin-top:var(--s-96)}
.service-block__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:var(--s-56);align-items:start}
.service-block__num{letter-spacing:.1em;margin:0 0 var(--s-20)}
.service-block__title{font-size:var(--fs-h2-service);line-height:1.1;letter-spacing:-.025em;margin:0 0 var(--s-24);max-width:18ch}
.service-block__lead{font-size:var(--fs-16-5);line-height:1.7;color:var(--nta-text-2);margin:0 0 var(--s-32);max-width:46ch}
.lists{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:var(--s-48)}
.list-title{font-weight:var(--fw-regular);font-size:var(--fs-11-5);letter-spacing:.16em;text-transform:uppercase;color:var(--nta-steel);
  margin:0 0 var(--s-20);padding-bottom:var(--s-14);border-bottom:1px solid var(--nta-rule)}
.list{display:flex;flex-direction:column;gap:var(--s-16)}
.list li{font-size:var(--fs-15);line-height:1.5;color:var(--nta-text-2)}

/* ==================================================================
   PRACTICE PAGE
   ================================================================== */
.two-col{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:var(--s-64);align-items:start}
.sub-title{font-size:var(--fs-24);line-height:1.2;letter-spacing:-.02em;margin:0 0 var(--s-22)}
.sub-title + .sub-title,.body-text + .sub-title{margin-top:var(--s-44)}
.body-text{font-size:var(--fs-16-5);line-height:1.75;color:var(--nta-text-2);max-width:50ch;margin:0 0 var(--s-18)}
.body-text:last-child{margin-bottom:0}
.split .body-text{max-width:48ch}
.split__title--practice{font-size:var(--fs-h2-sm);line-height:1.12;margin-bottom:var(--s-26)}

.details{margin:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));border-top:1px solid var(--nta-rule)}
.details__item{padding:var(--s-22) var(--s-24) var(--s-22) 0;border-bottom:1px solid var(--nta-rule)}
.details dt{font-size:var(--fs-11-5);letter-spacing:.14em;text-transform:uppercase;color:var(--nta-steel);margin-bottom:var(--s-9)}
.details dd{margin:0;font-size:var(--fs-16);letter-spacing:-.01em;color:var(--nta-ink)}
.fine{font-family:var(--nta-mono);font-size:var(--fs-11-5);line-height:1.7;letter-spacing:.04em;color:var(--nta-steel);margin:var(--s-28) 0 0}

.values{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:var(--s-40)}
.value{border-top:1px solid var(--nta-rule-strong);padding-top:var(--s-22)}
.value__title{font-size:var(--fs-20);line-height:1.2;letter-spacing:-.015em;margin:0 0 var(--s-12)}
.value__body{font-size:var(--fs-15);line-height:1.6;color:var(--nta-text-3)}
.values-title{margin-bottom:var(--s-56)}

/* ==================================================================
   CONTACT PAGE
   ================================================================== */
.contact-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:var(--s-72);align-items:start}
.form{display:flex;flex-direction:column;gap:var(--s-26)}
.form__row{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));gap:var(--s-26)}
.field{display:flex;flex-direction:column;gap:var(--s-10)}
.field__label{font-size:var(--fs-12);letter-spacing:.12em;text-transform:uppercase;color:var(--nta-steel)}
.field__input{font-family:var(--nta-sans);font-size:var(--fs-16);color:var(--nta-ink);background:transparent;border:0;
  border-bottom:1px solid var(--nta-rule-input);border-radius:0;padding:var(--s-10) 0;
  transition:border-color .25s ease;-webkit-appearance:none;appearance:none}
.field__input::placeholder{color:var(--nta-steel);opacity:1}
.field__input:focus{border-color:var(--nta-deep-gold)}
.field__input:focus-visible{outline:2px solid var(--nta-deep-gold);outline-offset:2px}
.field__input[aria-invalid="true"]{border-color:var(--nta-error)}
.field__area{border:1px solid var(--nta-rule-input);padding:var(--s-14);line-height:1.6;resize:vertical}
.select{position:relative;display:block}
.select::after{content:"";position:absolute;right:var(--s-4);top:50%;width:var(--s-7);height:var(--s-7);
  border-right:1px solid var(--nta-ink);border-bottom:1px solid var(--nta-ink);transform:translateY(-70%) rotate(45deg);pointer-events:none}
.select .field__input{width:100%;padding-right:var(--s-28)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form__errors{border-left:2px solid var(--nta-error);padding:var(--s-4) 0 var(--s-4) var(--s-16);font-size:var(--fs-15);color:var(--nta-error)}
.form__errors ul{margin-top:var(--s-6)}
.sent{border:1px solid var(--nta-rule-strong);padding:var(--s-40)}
.sent__title{font-size:var(--fs-24);line-height:1.2;letter-spacing:-.02em;margin:0 0 var(--s-14)}
.sent__text{font-size:var(--fs-15-5);line-height:1.7;color:var(--nta-text-3);margin:0 0 var(--s-24);max-width:42ch}
.btn--again{padding:var(--s-13) var(--s-22)}

.aside{display:flex;flex-direction:column;gap:var(--s-56)}
.aside__title{font-weight:var(--fw-regular);font-size:var(--fs-11-5);letter-spacing:.16em;text-transform:uppercase;color:var(--nta-steel);
  margin:0 0 var(--s-22);padding-bottom:var(--s-14);border-bottom:1px solid var(--nta-rule)}
.direct{display:flex;flex-direction:column;gap:var(--s-22)}
.direct__label{font-size:var(--fs-12);letter-spacing:.12em;text-transform:uppercase;color:var(--nta-steel);margin:0 0 var(--s-8)}
.direct__value{font-size:var(--fs-19);letter-spacing:-.015em;color:var(--nta-ink)}
a.direct__value:hover{color:var(--nta-gold-text)}
.include{display:flex;flex-direction:column;gap:var(--s-14)}
.include li{font-size:var(--fs-15);line-height:1.55;color:var(--nta-text-2)}
.response{background:var(--nta-charcoal);color:var(--nta-paper);padding:var(--s-36)}
.response .eyebrow{color:var(--nta-gold);margin-bottom:var(--s-16)}
.response__text{font-family:var(--nta-serif);font-size:var(--fs-20);line-height:1.5;font-weight:var(--fw-light);color:var(--nta-ground)}

/* ==================================================================
   SINGLE PROJECT AND GENERIC PAGES (derived from the design system)
   ================================================================== */
.project-facts{margin:var(--s-48) 0 0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));
  border-top:1px solid var(--nta-rule)}
.project-facts .details__item{padding-right:var(--s-24)}
.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:var(--s-28);margin-top:var(--s-56)}
.prose{max-width:68ch;font-size:var(--fs-16-5);line-height:1.75;color:var(--nta-text-2)}
.prose > * + *{margin-top:var(--s-18)}
.prose h2{font-size:var(--fs-24);line-height:1.2;letter-spacing:-.02em;color:var(--nta-ink);margin-top:var(--s-44)}
.prose h3{font-size:var(--fs-20);line-height:1.25;color:var(--nta-ink);margin-top:var(--s-32)}
.prose a{color:var(--nta-gold-text);text-decoration:underline;text-decoration-color:var(--nta-deep-gold);text-underline-offset:3px}
.prose ul{list-style:disc;padding-left:var(--s-20)}
.prose ol{padding-left:var(--s-20)}
.back{margin-top:var(--s-56)}

/* ==================================================================
   FOOTER
   ================================================================== */
.cta-wrap{margin-top:var(--s-112)}
.cta{background:var(--nta-ink);color:var(--nta-paper);padding:clamp(48px,7vw,96px);
  display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:var(--s-48);align-items:end}
.cta__title{font-size:var(--fs-h2-xl);line-height:1.06;letter-spacing:-.03em;margin:0 0 var(--s-24);max-width:18ch}
.cta__text{font-size:var(--fs-17);line-height:1.6;color:var(--nta-on-dark-soft);max-width:42ch}
.cta__actions{display:flex;flex-direction:column;gap:var(--s-22)}
.cta__lines{display:flex;flex-direction:column;gap:var(--s-6);font-size:var(--fs-15);color:var(--nta-on-dark-soft)}
.cta__lines a:hover{color:var(--nta-paper)}

.site-footer{padding-top:var(--s-96);padding-bottom:var(--s-40)}   /* longhands: .wrap supplies the gutters */
.site-footer__top{display:flex;flex-wrap:wrap;gap:var(--s-56);padding-bottom:var(--s-48);border-bottom:1px solid var(--nta-rule)}
.site-footer__brand{flex:1 1 280px;min-width:0}
.site-footer__brand .lockup{margin-bottom:var(--s-16)}
.site-footer__blurb{font-family:var(--nta-serif);font-size:var(--fs-18);line-height:1.5;font-weight:var(--fw-light);color:var(--nta-text-3);max-width:34ch}
.site-footer__cols{flex:2 1 480px;min-width:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,170px),1fr));gap:var(--s-40)}
.site-footer__title{font-size:var(--fs-11-5);letter-spacing:.16em;text-transform:uppercase;color:var(--nta-steel);margin:0 0 var(--s-18)}
.site-footer__list{display:flex;flex-direction:column;gap:var(--s-10)}
.site-footer__list li{font-size:var(--fs-14-5);color:var(--nta-text-2)}
.site-footer__legal{font-family:var(--nta-mono);font-size:var(--fs-11);letter-spacing:.1em;text-transform:uppercase;color:var(--nta-steel);margin:var(--s-24) 0 0}

/* ==================================================================
   REVEAL — only under html.js, so nothing is hidden without scripts
   ================================================================== */
.js .reveal{opacity:0;transform:translateY(16px);transition:opacity .9s ease,transform .9s var(--ease-out)}
.js .reveal--late{transition-delay:.1s}
.js .reveal--later{transition-delay:.2s}
.js .reveal.is-in{opacity:1;transform:none}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .js .reveal{opacity:1;transform:none;transition:none}
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}
}

/* ==================================================================
   SMALL SCREENS AND TOUCH
   ================================================================== */
@media (max-width:479px){
  :root{--nta-gutter:20px}
  .cta{padding:var(--s-40) var(--s-24)}
}
@media (pointer:coarse){
  .nav__link,.site-footer__list a,.crumbs a,.service-index__link,.cta__lines a{
    display:inline-flex;align-items:center;min-height:var(--nta-tap)}
  .nav{gap:0 var(--s-24)}
  .site-footer__list{gap:0}
  .filter{min-height:var(--nta-tap)}
  .field__input{min-height:var(--nta-tap)}
  .btn--ink{min-height:var(--nta-tap)}
  .brand{min-height:var(--nta-tap)}
  a.direct__value{display:inline-flex;align-items:center;min-height:var(--nta-tap)}
}

/* ==================================================================
   PRINT — a print page is about 794px wide, which would otherwise
   collapse the auto-fit grids unpredictably. Layouts are set explicitly.
   ================================================================== */
@media print{
  *,*::before,*::after{background:transparent !important;color:var(--nta-ink) !important;box-shadow:none !important}
  body{font-size:11pt}
  .site-header,.skip-link,.cta-wrap,.filters,.hero__actions,.nav,.form,.frame{display:none !important}
  .site{overflow:visible}
  .section,.intro,.hero,.service-block{padding-top:12pt}
  .dark{margin-top:12pt}
  .dark__inner,.dark__inner--96{padding-block:12pt}
  .head,.hero__row,.intro__grid,.two-col,.split,.contact-grid,.service-block__grid,.note-row{grid-template-columns:1fr 1fr !important;gap:12pt !important}
  .service-cards,.project-grid,.project-grid--page,.steps,.values,.lists,.details,.facts{grid-template-columns:1fr 1fr !important;gap:10pt !important}
  .steps--stages{grid-template-columns:repeat(3,1fr) !important}
  .display,.title{font-size:28pt}
  a[href^="http"]::after{content:" (" attr(href) ")";font-size:8pt}
  .project-card,.service-card,.step,.value,.service-block{break-inside:avoid}
  h1,h2,h3{break-after:avoid}
  @page{margin:16mm}
}