:root{
  --ink:#0B0B0C;
  --ink-72:rgba(11,11,12,.72);
  --ink-60:rgba(11,11,12,.60);
  --ink-40:rgba(11,11,12,.40);
  --ink-12:rgba(11,11,12,.12);
  --ink-06:rgba(11,11,12,.06);
  --paper:#FFFFFF;
  --paper-alt:#F5F5F3;
  --r-lg:28px;
  --r-md:20px;
  --pad:clamp(72px,9vw,128px);
  --gut:clamp(20px,4vw,24px);
}

/* ---------- fonts: self-hosted, latin subset (OFL licences in assets/fonts/) ---------- */
@font-face{font-family:"Archivo Condensed";src:url("fonts/archivo-condensed-600.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Archivo Condensed";src:url("fonts/archivo-condensed-700.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Sans";src:url("fonts/ibm-plex-sans-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Sans";src:url("fonts/ibm-plex-sans-500.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Sans";src:url("fonts/ibm-plex-sans-600.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:"IBM Plex Sans",system-ui,sans-serif;
  font-size:16px;
  line-height:1.5;
  letter-spacing:-.006em;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4,p{margin:0}
ul{margin:0;padding:0;list-style:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}

.wrap{width:100%;max-width:1320px;margin:0 auto;padding-inline:var(--gut)}

/* ---------- type ---------- */
/* headings, eyebrows and stats use the condensed face; everything else inherits Plex from body */
.display,.h2,.h3,.statement,.hero__h1,.hero__word,.hero__hail,.phero h1,.ctab h2,.foot__word,
.scard__t,.mcard b,.relc b,.step__t,.faq__q,.cap h4,.cred h4,.capstat__hd h1,.capstat__b h2,
.label,.hero__eyebrow,.phero__eyebrow,.scard__no,.stat__k,.cinfo__k,.foot h5,.dtable th,
.gcard b,.stat b,.step__n{font-family:"Archivo Condensed","Arial Narrow",sans-serif}
.display{
  font-weight:600;
  line-height:.92;
  letter-spacing:-.035em;
  text-transform:uppercase;
}
.h2{
  font-size:clamp(30px,4.1vw,54px);
  font-weight:500;
  line-height:1.06;
  letter-spacing:-.032em;
}
.h3{
  font-size:clamp(20px,2vw,26px);
  font-weight:500;
  line-height:1.15;
  letter-spacing:-.026em;
}
.lede{
  font-size:clamp(15px,1.15vw,17px);
  line-height:1.55;
  color:var(--ink-60);
  letter-spacing:-.008em;
}
.small{font-size:13px;line-height:1.5;color:var(--ink-60)}

.label{
  display:flex;
  align-items:center;
  gap:10px;
  font-size:10px;
  font-weight:600;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--ink-60);
  white-space:nowrap;
}
.label::before{
  content:"";
  width:16px;
  height:1px;
  background:var(--ink-40);
  flex:none;
}
.label span{display:block}

/* ---------- pill button ---------- */
.pill{
  display:inline-flex;
  align-items:center;
  gap:14px;
  padding:7px 7px 7px 22px;
  border-radius:999px;
  background:var(--ink);
  color:#fff;
  font-size:13.5px;
  font-weight:500;
  letter-spacing:-.01em;
  transition:opacity .22s ease;
}
.pill:hover{opacity:.82}
.pill .disc{
  width:30px;height:30px;
  border-radius:999px;
  background:#fff;
  display:grid;
  place-items:center;
  flex:none;
}
.pill .disc::after{
  content:"";
  width:8px;height:8px;
  border-top:1.5px solid var(--ink);
  border-right:1.5px solid var(--ink);
  transform:rotate(45deg) translate(-1px,1px);
}
.pill--ghost{
  background:transparent;
  color:var(--ink);
  border:1px solid var(--ink-12);
  padding-left:22px;
}
.pill--ghost .disc{background:var(--ink)}
.pill--ghost .disc::after{border-color:#fff}

/* ---------- image frame / placeholder slate ---------- */
.frame{
  position:relative;
  overflow:hidden;
  border-radius:var(--r-lg);
  background-color:var(--paper-alt);
  background-image:
    radial-gradient(var(--ink-12) 1px, transparent 1.1px);
  background-size:14px 14px;
  background-position:center;
  isolation:isolate;
}
.frame > .ph{
  position:absolute;
  left:14px;bottom:12px;
  font-size:9.5px;
  font-weight:600;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--ink-40);
  z-index:0;
}
.frame > .shot{
  position:absolute;
  inset:0;
  background-size:cover;
  background-position:center;
  z-index:1;
}

/* ---------- nav ---------- */
.nav{
  position:fixed;
  top:0;left:0;right:0;
  z-index:60;
  background:rgba(255,255,255,.78);
  -webkit-backdrop-filter:saturate(180%) blur(18px);
  backdrop-filter:saturate(180%) blur(18px);
  border-bottom:1px solid var(--ink-12);
}
.nav__in{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  height:64px;
}
.mark{
  display:flex;
  align-items:center;
  gap:9px;
  font-size:13px;
  font-weight:600;
  letter-spacing:-.02em;
}
.mark em{font-style:normal;text-transform:uppercase;letter-spacing:.01em;white-space:nowrap}
.mark b{
  display:grid;
  place-items:center;
  width:26px;height:26px;
  border-radius:8px;
  background:var(--ink);
  color:#fff;
  font-size:12px;
  font-weight:600;
  letter-spacing:0;
  line-height:1;
  flex:none;
}
.nav__links{
  display:flex;
  align-items:center;
  gap:30px;
  font-size:13.5px;
  font-weight:450;
  letter-spacing:-.008em;
}
.nav__links a{transition:opacity .2s ease}
.nav__links a:hover{opacity:.5}
.nav__cta{display:flex;align-items:center;gap:16px}
.nav__tel{font-size:13.5px;font-weight:500}
.nav__tel:hover{opacity:.5}
.burger{display:none;width:26px;height:26px;position:relative}
.burger i{
  position:absolute;left:3px;right:3px;height:1.5px;background:var(--ink);
  transition:transform .25s ease,opacity .2s ease;
}
.burger i:nth-child(1){top:9px}
.burger i:nth-child(2){top:15px}
body.menu .burger i:nth-child(1){transform:translateY(3px) rotate(45deg)}
body.menu .burger i:nth-child(2){transform:translateY(-3px) rotate(-45deg)}

@media(max-width:1120px){
  .nav__links{display:none}
  .nav__tel{display:inline-flex;align-items:center;min-height:44px}
  .burger{display:block}
  .nav__in{gap:12px}
  .nav__links.open{
    display:flex;
    position:fixed;
    top:64px;left:0;right:0;
    flex-direction:column;
    align-items:flex-start;
    gap:0;
    padding:10px var(--gut) 26px;
    background:var(--paper);
    border-bottom:1px solid var(--ink-12);
    font-size:22px;
    letter-spacing:-.03em;
  }
  .nav__links.open a{padding:11px 0;width:100%}
}
@media(max-width:600px){
  .mark em{display:none}
  .mark{font-size:0}
}

/* ---------- hero ---------- */
.hero{padding:64px 0 0}
.hero__stage{
  position:relative;
  margin-inline:var(--gut);
  border-radius:var(--r-lg);
  overflow:hidden;
  min-height:clamp(520px,80vh,780px);
  background-color:#101214;
  background-image:radial-gradient(rgba(255,255,255,.10) 1px,transparent 1.1px);
  background-size:16px 16px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}
.hero__scrim{
  position:absolute;inset:0;z-index:1;
  background:
    linear-gradient(180deg,rgba(6,8,10,.22) 0%,rgba(6,8,10,0) 30%),
    linear-gradient(0deg,rgba(6,8,10,.48) 0%,rgba(6,8,10,0) 46%);
}
.hero__top,.hero__btm{position:relative;z-index:2}
.hero__top{padding:clamp(16px,2.2vw,30px) clamp(22px,3.4vw,46px) 0}
/* handshake line: CONNECTING with three dots that cycle like a link coming up */
.hero__hail{
  display:grid;
  margin-bottom:0;
  color:rgba(255,255,255,.72);
  font-size:clamp(15px,1.35vw,20px);
  font-weight:600;
  letter-spacing:.2em;
  text-transform:uppercase;
}
.hero__hail > span{
  grid-area:1/1;
  justify-self:start;
  display:flex;
  align-items:center;
  gap:clamp(7px,.7vw,10px);
}
.hero__hail em{font-style:normal;margin-right:4px}

/* state 1, handshake: three dots cycling */
.hail__a i{
  width:clamp(4px,.42vw,6px);
  aspect-ratio:1;
  border-radius:50%;
  background:currentColor;
  opacity:.24;
}
.js .hail__a i{animation:hail .9667s cubic-bezier(.4,0,.3,1) infinite}
.js .hail__a i:nth-child(3){animation-delay:.097s}
.js .hail__a i:nth-child(4){animation-delay:.193s}
@keyframes hail{
  0%,58%,100%{opacity:.24;transform:translateY(0)}
  26%{opacity:1;transform:translateY(-3.5px)}
}

/* state 2, link is up: green status light, breathing */
.hail__b{color:#fff}
.hail__b b{
  position:relative;
  width:clamp(6px,.55vw,8px);
  aspect-ratio:1;
  border-radius:50%;
  background:#3FD07E;
  box-shadow:0 0 10px rgba(63,208,126,.55);
}
.hail__b b::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:50%;
  background:#3FD07E;
}
.js .hail__b b::after{animation:ping 2.4s cubic-bezier(.2,.6,.3,1) 3.35s infinite}
@keyframes ping{
  0%{transform:scale(1);opacity:.5}
  70%,100%{transform:scale(3.2);opacity:0}
}

/* the swap, timed to land just after the last letter of WALDRON settles */
.hail__a{opacity:0}
.hail__b{opacity:1}
.js .hail__a{opacity:1;animation:hailOut .35s ease 2.85s forwards}
.js .hail__b{opacity:0;animation:hailIn .50s ease 2.90s forwards}
@keyframes hailOut{to{opacity:0;transform:translateY(-4px)}}
@keyframes hailIn{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}

.hero__word{
  margin-top:-.12em;
  color:#fff;
  /* one rule from 320 to 1920: fills the stage's inner width (3.8 = "WALDRON" width in em) until it reaches 232px */
  font-size:clamp(48px,calc((100vw - 2*var(--gut) - 2*clamp(22px,3.4vw,46px)) / 3.8),232px);
  font-weight:600;
  line-height:.82;
  letter-spacing:-.045em;
  text-transform:uppercase;
  white-space:nowrap;
}
.hw__line,.hw__sub{display:block}
/* the mask box leaves ~.2em of air under the baseline; pull the second line up into it
   so the two read as one lockup rather than two stacked lines */
.hw__line{margin-bottom:-.11em}
/* set to span exactly from the W's first bottom vertex to the foot of the L.
   both values are em of the wordmark, so the span holds at every viewport width. */
.hw__sub{
  font-size:.168em;
  margin-left:1em;
  font-weight:500;
  letter-spacing:.111em;
  line-height:1;
  color:rgba(255,255,255,.55);
}

/* each letter rolls up out of its own mask once the handshake has run.
   the wordmark's negative tracking makes each box narrower than its glyph, so the mask
   is padded outward and pulled back by the same amount: wider clip, identical layout. */
.hero__word i{
  display:inline-block;
  overflow:hidden;
  font-style:normal;
  line-height:1;
  vertical-align:bottom;
  padding-inline:.07em;
  margin-inline:-.07em;
}
.js .hero__word i span{
  display:block;
  transform:translateY(106%);
  animation:letter .85s cubic-bezier(.19,.78,.22,1) forwards;
}
@keyframes letter{to{transform:none}}
.js .hw__line i:nth-child(1) span{animation-delay:1.500s}
.js .hw__line i:nth-child(2) span{animation-delay:1.575s}
.js .hw__line i:nth-child(3) span{animation-delay:1.650s}
.js .hw__line i:nth-child(4) span{animation-delay:1.725s}
.js .hw__line i:nth-child(5) span{animation-delay:1.800s}
.js .hw__line i:nth-child(6) span{animation-delay:1.875s}
.js .hw__line i:nth-child(7) span{animation-delay:1.950s}
/* the second line rolls as one piece, so it reads as a lockup and not a second alphabet */
.js .hw__sub i span{animation-duration:1.05s;animation-delay:2.90s}
.hero__btm{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:32px;
  padding:0 clamp(22px,3.4vw,46px) clamp(24px,3.2vw,44px);
  flex-wrap:wrap;
}
.hero__copy{max-width:620px}
.hero__eyebrow{
  color:rgba(255,255,255,.7);
  font-size:10px;font-weight:600;
  letter-spacing:.16em;text-transform:uppercase;
  margin-bottom:18px;
}
.hero__h1{
  color:#fff;
  font-size:clamp(30px,4.6vw,60px);
  font-weight:600;
  line-height:.98;
  letter-spacing:-.038em;
  text-transform:uppercase;
}
.hero__sub{
  color:rgba(255,255,255,.76);
  font-size:clamp(14px,1.1vw,16px);
  line-height:1.5;
  max-width:420px;
  margin-top:18px;
}
.hero__acts{margin-top:26px;display:flex;gap:12px;flex-wrap:wrap}
.hero__acts .pill{background:#fff;color:var(--ink)}
.hero__acts .pill .disc{background:var(--ink)}
.hero__acts .pill .disc::after{border-color:#fff}

.hero__cards{display:flex;gap:12px;flex-wrap:wrap}
.gcard{
  width:212px;
  padding:16px 18px 18px;
  border-radius:var(--r-md);
  background:rgba(255,255,255,.13);
  border:1px solid rgba(255,255,255,.2);
  -webkit-backdrop-filter:blur(14px);
  backdrop-filter:blur(14px);
  color:#fff;
}
.gcard b{
  display:block;
  font-size:30px;font-weight:600;
  letter-spacing:-.035em;line-height:1;
  margin-bottom:9px;
}
.gcard span{
  display:block;
  font-size:11px;line-height:1.4;
  color:rgba(255,255,255,.72);
}
@media(max-width:860px){
  /* keep the dark left of the frame under the headline; let the dish sit at the right edge */
  .hero__scrim{background:linear-gradient(0deg,rgba(6,8,10,.68) 0%,rgba(6,8,10,.12) 58%)}
}
@media(max-width:760px){
  .hero__cards{width:100%}
  .gcard{flex:1 1 0;width:auto;min-width:0}
}

/* ---------- generic section ---------- */
.sec{padding:var(--pad) 0}
.sec--tight{padding-top:0}
.grid{
  display:grid;
  grid-template-columns:repeat(12,1fr);
  gap:clamp(20px,2.4vw,32px);
}
.split{grid-column:1/4}
.body{grid-column:5/13}
@media(max-width:900px){
  .split,.body{grid-column:1/-1}
  .split{margin-bottom:26px}
}

.statement{
  font-size:clamp(21px,2.5vw,33px);
  font-weight:450;
  line-height:1.24;
  letter-spacing:-.028em;
  max-width:min(880px,100%);
}
.statement em{font-style:normal;color:var(--ink-40)}
.after{margin-top:28px;display:flex;gap:12px;flex-wrap:wrap;align-items:center}

/* ---------- stat band ---------- */
.band{
  display:grid;
  grid-template-columns:1fr 1.62fr 1fr;
  gap:12px;
  align-items:stretch;
}
.stat{
  border:1px solid var(--ink-12);
  border-radius:var(--r-lg);
  padding:26px 26px 24px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  min-height:290px;
  background:var(--paper);
}
.stat b{
  display:block;
  font-size:clamp(42px,5vw,68px);
  font-weight:600;
  line-height:.9;
  letter-spacing:-.045em;
}
.stat b.stat--word{font-size:clamp(32px,3.6vw,48px);letter-spacing:-.038em}
/* founding year: each digit rolls up from its own mask, staggered */
.stat b.odo{display:flex}
.odo i{display:block;overflow:hidden;font-style:normal;line-height:1;padding-top:.08em}
.js .odo i span{display:block;transform:translateY(108%);transition:transform .8s cubic-bezier(.22,.78,.2,1)}
.js .odo.roll i span{transform:none}
.js .odo.roll i:nth-child(2) span{transition-delay:.10s}
.js .odo.roll i:nth-child(3) span{transition-delay:.20s}
.js .odo.roll i:nth-child(4) span{transition-delay:.30s}
.stat .stat__k{
  font-size:10px;font-weight:600;
  letter-spacing:.13em;text-transform:uppercase;
  color:var(--ink-40);
  margin-bottom:auto;
}
.stat p{margin-top:14px;font-size:13px;line-height:1.5;color:var(--ink-60)}
.band .frame{min-height:290px}
@media(max-width:900px){
  .band{grid-template-columns:1fr 1fr}
  .band .frame{grid-column:1/-1;min-height:240px;order:-1}
  .stat{min-height:220px}
}
@media(max-width:560px){
  .band{grid-template-columns:1fr}
}

/* the .svc alternating service blocks and .tags pill list lived here; they were replaced
   by the .slist / .scard grid below when services went from three to six linked pages. */

/* ---------- process ---------- */
.proc{border-top:1px solid var(--ink-12)}
.step{
  display:grid;
  grid-template-columns:96px 1fr 1.15fr;
  gap:clamp(16px,3vw,40px);
  padding:clamp(26px,3vw,38px) 0;
  border-bottom:1px solid var(--ink-12);
  align-items:baseline;
}
.step__n{
  font-size:clamp(26px,3vw,40px);
  font-weight:600;
  letter-spacing:-.04em;
  line-height:1;
  color:var(--ink);
}
.step__t{
  font-size:clamp(18px,1.9vw,24px);
  font-weight:500;
  letter-spacing:-.028em;
  line-height:1.15;
}
.step__d{font-size:14.5px;line-height:1.55;color:var(--ink-60);max-width:52ch}
@media(max-width:760px){
  .step{grid-template-columns:56px 1fr;row-gap:10px}
  .step__d{grid-column:2/3}
}

/* ---------- safety ---------- */
.safety{
  background:var(--paper-alt);
  border-radius:var(--r-lg);
  padding:clamp(30px,4vw,58px);
}
.creds{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:0;
  margin-top:clamp(30px,4vw,52px);
  border-top:1px solid var(--ink-12);
}
.cred{
  padding:24px 24px 4px 0;
  border-right:1px solid var(--ink-12);
}
.cred:last-child{border-right:0}
.cred h4{font-size:14.5px;font-weight:600;letter-spacing:-.018em;margin-bottom:8px}
.cred p{font-size:13px;line-height:1.5;color:var(--ink-60);max-width:26ch}
@media(max-width:820px){
  .creds{grid-template-columns:1fr 1fr}
  .cred:nth-child(2){border-right:0}
  .cred:nth-child(3),.cred:nth-child(4){border-top:1px solid var(--ink-12)}
}
@media(max-width:520px){
  .creds{grid-template-columns:1fr}
  .cred{border-right:0;border-top:1px solid var(--ink-12);padding-right:0}
  .cred:first-child{border-top:0}
}

/* ---------- contact ---------- */
.contact{
  display:grid;
  grid-template-columns:1.1fr 1fr;
  gap:clamp(24px,4vw,56px);
  align-items:end;
}
.contact .frame{aspect-ratio:16/11}
.cinfo{display:grid;gap:0}
.cinfo__row{
  padding:20px 0;
  border-top:1px solid var(--ink-12);
  display:grid;
  grid-template-columns:120px 1fr;
  gap:20px;
  align-items:baseline;
}
.cinfo__k{
  font-size:10px;font-weight:600;
  letter-spacing:.13em;text-transform:uppercase;
  color:var(--ink-40);
}
.cinfo__v{font-size:16px;letter-spacing:-.015em;line-height:1.45;min-width:0;overflow-wrap:anywhere}
.cinfo__v a{transition:opacity .2s ease}
.cinfo__v a:hover{opacity:.5}
@media(max-width:860px){
  .contact{grid-template-columns:1fr}
  .cinfo__row{grid-template-columns:100px 1fr}
}

/* ---------- footer ---------- */
.foot{border-top:1px solid var(--ink-12);padding-top:clamp(40px,5vw,64px);padding-bottom:26px}
.foot__cols{
  display:grid;
  grid-template-columns:1.4fr repeat(3,1fr);
  gap:clamp(24px,3vw,40px);
  padding-bottom:clamp(40px,6vw,80px);
}
.foot h5{
  font-size:10px;font-weight:600;
  letter-spacing:.13em;text-transform:uppercase;
  color:var(--ink-40);margin:0 0 16px;
}
.foot__cols > div{min-width:0}
.foot li{margin-bottom:10px;font-size:13.5px;overflow-wrap:anywhere}
.foot li a{transition:opacity .2s ease}
.foot li a:hover{opacity:.5}
.foot__word{
  font-size:clamp(52px,15.3vw,232px);
  font-weight:600;
  line-height:.78;
  letter-spacing:-.048em;
  text-transform:uppercase;
  white-space:nowrap;
  color:var(--ink);
}
.foot__base{
  display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;
  padding-top:22px;font-size:12px;color:var(--ink-40);
}
@media(max-width:820px){
  .foot__cols{grid-template-columns:1fr 1fr}
}

/* ---------- reveal ---------- */
.js .rv{opacity:0;transform:translateY(12px);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1)}
.js .rv.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){
  .js .rv{opacity:1;transform:none;transition:none}
  .js .odo i span{transform:none;transition:none}
  .js .hero__word i span{transform:none;animation:none}
  .js .hail__a{opacity:0;animation:none}
  .js .hail__b{opacity:1;animation:none}
  .js .hail__b b::after{animation:none;opacity:0}
  *{scroll-behavior:auto!important}
}
html{scroll-behavior:smooth;scroll-padding-top:80px}

/* ============================================================
   MULTI-PAGE COMPONENTS
   Added when the site went from one page to seven.
   ============================================================ */

/* ---------- creds: 3 confirmed credentials (the 4th was retired) ---------- */
.creds--2{grid-template-columns:repeat(2,1fr)}
.creds--3{grid-template-columns:repeat(3,1fr)}
.creds--3 .cred:nth-child(3){border-right:0}
@media(max-width:820px){
  .creds--3{grid-template-columns:1fr 1fr}
  .creds--3 .cred:nth-child(2){border-right:0}
  .creds--3 .cred:nth-child(3){border-top:1px solid var(--ink-12);border-right:0}
}
@media(max-width:520px){
  .creds--3{grid-template-columns:1fr}
  .creds--3 .cred{border-right:0;border-top:1px solid var(--ink-12);padding-right:0}
  .creds--3 .cred:first-child{border-top:0}
}

/* ---------- service card grid ---------- */
.slist{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:clamp(14px,1.6vw,20px);
}
.scard{
  display:flex;
  flex-direction:column;
  border:1px solid var(--ink-12);
  border-radius:var(--r-lg);
  overflow:hidden;
  background:var(--paper);
  transition:border-color .25s ease,transform .25s ease;
}
.scard:hover{border-color:var(--ink-40);transform:translateY(-3px)}
.scard__media{
  position:relative;
  aspect-ratio:4/3;
  overflow:hidden;
  background-color:var(--paper-alt);
  background-image:radial-gradient(var(--ink-12) 1px,transparent 1.1px);
  background-size:14px 14px;
  flex:none;
}
.scard__media .shot{position:absolute;inset:0;background-size:cover;background-position:center;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.scard:hover .scard__media .shot{transform:scale(1.035)}
.scard__media .ph{
  position:absolute;left:14px;bottom:12px;
  font-size:9.5px;font-weight:600;letter-spacing:.1em;
  text-transform:uppercase;color:var(--ink-40);
}
.scard__in{padding:22px 22px 24px;display:flex;flex-direction:column;flex:1}
.scard__no{font-size:10px;font-weight:600;letter-spacing:.13em;color:var(--ink-40);margin-bottom:14px}
.scard__t{font-size:clamp(19px,1.75vw,23px);font-weight:500;line-height:1.1;letter-spacing:-.028em}
.scard__d{margin-top:11px;font-size:14px;line-height:1.55;color:var(--ink-60)}
.scard__go{
  margin-top:20px;
  padding-top:16px;
  border-top:1px solid var(--ink-12);
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  font-size:12.5px;font-weight:500;letter-spacing:-.005em;
}
.scard__go::after{
  content:"";
  width:7px;height:7px;
  border-top:1.5px solid var(--ink);
  border-right:1.5px solid var(--ink);
  transform:rotate(45deg);
  flex:none;
  transition:transform .25s ease;
}
.scard:hover .scard__go::after{transform:rotate(45deg) translate(2px,-2px)}
@media(max-width:980px){.slist{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.slist{grid-template-columns:1fr}}
/* seven services as 2 / 3 / 2: half-width cards get a wider image so every row's media is the same height */
.slist--232{grid-template-columns:repeat(6,1fr)}
.slist--232 .scard{grid-column:span 2}
.slist--232 .scard:nth-child(-n+2),.slist--232 .scard:nth-child(n+6){grid-column:span 3}
.slist--232 .scard:nth-child(-n+2) .scard__media,.slist--232 .scard:nth-child(n+6) .scard__media{aspect-ratio:2/1}
@media(max-width:640px){
  .slist--232{grid-template-columns:1fr}
  .slist--232 .scard,.slist--232 .scard:nth-child(-n+2),.slist--232 .scard:nth-child(n+6){grid-column:auto}
  .slist--232 .scard:nth-child(-n+2) .scard__media,.slist--232 .scard:nth-child(n+6) .scard__media{aspect-ratio:4/3}
}

/* ---------- interior page hero ---------- */
/* the breadcrumb above carries the fixed-nav clearance, so this only needs breathing room */
.phero{padding:18px 0 0}
.phero__stage{
  position:relative;
  margin-inline:var(--gut);
  border-radius:var(--r-lg);
  overflow:hidden;
  min-height:clamp(400px,56vh,560px);
  background-color:#101214;
  background-image:radial-gradient(rgba(255,255,255,.10) 1px,transparent 1.1px);
  background-size:16px 16px;
  display:flex;
  align-items:flex-end;
}
.phero__shot{position:absolute;inset:0;background-size:cover;background-position:center;z-index:0}
.phero__scrim{
  position:absolute;inset:0;z-index:1;
  background:
    linear-gradient(180deg,rgba(6,8,10,.30) 0%,rgba(6,8,10,0) 34%),
    linear-gradient(0deg,rgba(6,8,10,.72) 0%,rgba(6,8,10,.05) 66%);
}
/* phones: the lede sits mid-frame, where the desktop scrim is thinnest; darken the whole frame */
@media(max-width:760px){
  .phero__scrim{background:linear-gradient(0deg,rgba(6,8,10,.86) 0%,rgba(6,8,10,.66) 55%,rgba(6,8,10,.42) 100%)}
}
.phero__in{
  position:relative;z-index:2;
  width:100%;
  padding:clamp(28px,4vw,56px) clamp(22px,3.4vw,52px);
}
.phero__eyebrow{
  color:rgba(255,255,255,.66);
  font-size:10px;font-weight:600;
  letter-spacing:.16em;text-transform:uppercase;
  margin-bottom:16px;
}
.phero h1{
  color:#fff;
  font-size:clamp(34px,5.4vw,72px);
  font-weight:600;line-height:.96;
  letter-spacing:-.04em;text-transform:uppercase;
  max-width:16ch;
}
.phero__sub{
  color:rgba(255,255,255,.78);
  font-size:clamp(15px,1.2vw,17.5px);
  line-height:1.55;max-width:56ch;margin-top:20px;
}
.phero__acts{margin-top:26px;display:flex;gap:12px;flex-wrap:wrap}
.phero__acts .pill{background:#fff;color:var(--ink)}
.phero__acts .pill .disc{background:var(--ink)}
.phero__acts .pill .disc::after{border-color:#fff}
.phero__acts .pill--ghost{
  background:transparent;color:#fff;border-color:rgba(255,255,255,.32);
}
.phero__acts .pill--ghost .disc{background:#fff}
.phero__acts .pill--ghost .disc::after{border-color:var(--ink)}

/* ---------- breadcrumb ---------- */
.crumb{
  /* 64px clears the fixed nav, +18px breathing room */
  padding:82px 0 0;
  font-size:12px;color:var(--ink-40);
  display:flex;gap:8px;flex-wrap:wrap;align-items:center;
}
.crumb a{transition:opacity .2s ease}
.crumb a:hover{opacity:.55}
.crumb span[aria-current]{color:var(--ink-72)}

/* ---------- capability list ---------- */
.caps{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:0 clamp(24px,4vw,56px);
  border-top:1px solid var(--ink-12);
}
.cap{padding:24px 0;border-bottom:1px solid var(--ink-12)}
.cap h4{font-size:15.5px;font-weight:600;letter-spacing:-.02em;margin-bottom:9px}
.cap p{font-size:13.5px;line-height:1.55;color:var(--ink-60);max-width:44ch}
@media(max-width:760px){.caps{grid-template-columns:1fr}}

/* ---------- FAQ (answer-engine surface) ---------- */
.faq{border-top:1px solid var(--ink-12)}
.faq__i{
  display:grid;
  grid-template-columns:1fr 1.35fr;
  gap:clamp(14px,3vw,44px);
  padding:clamp(22px,2.6vw,32px) 0;
  border-bottom:1px solid var(--ink-12);
}
.faq__q{
  font-size:clamp(17px,1.7vw,21px);
  font-weight:500;line-height:1.2;letter-spacing:-.026em;
}
.faq__a{font-size:14.5px;line-height:1.62;color:var(--ink-60)}
.faq__a p + p{margin-top:12px}
@media(max-width:760px){.faq__i{grid-template-columns:1fr;gap:10px}}

/* ---------- related services ---------- */
.rel{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:clamp(12px,1.4vw,18px);
}
.relc{
  border:1px solid var(--ink-12);
  border-radius:var(--r-md);
  padding:22px 22px 20px;
  display:flex;flex-direction:column;justify-content:space-between;gap:26px;
  min-height:150px;
  transition:border-color .25s ease;
}
.relc:hover{border-color:var(--ink-40)}
.relc b{font-size:17px;font-weight:500;letter-spacing:-.024em;line-height:1.15}
.relc span{font-size:12.5px;color:var(--ink-40)}
@media(max-width:820px){.rel{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.rel{grid-template-columns:1fr}}

/* ---------- closing CTA band ---------- */
.ctab{
  background:var(--ink);
  color:#fff;
  border-radius:var(--r-lg);
  padding:clamp(34px,5vw,68px);
  display:grid;
  grid-template-columns:1.25fr 1fr;
  gap:clamp(24px,4vw,56px);
  align-items:end;
}
.ctab h2{
  font-size:clamp(26px,3.4vw,44px);
  font-weight:500;line-height:1.06;letter-spacing:-.032em;
  max-width:18ch;
}
.ctab p{margin-top:18px;font-size:15px;line-height:1.55;color:rgba(255,255,255,.66);max-width:46ch}
.ctab .pill{background:#fff;color:var(--ink)}
.ctab .pill .disc{background:var(--ink)}
.ctab .pill .disc::after{border-color:#fff}
.ctab__acts{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.ctab__tel{font-size:15px;font-weight:500;color:#fff}
.ctab__tel:hover{opacity:.7}
@media(max-width:820px){.ctab{grid-template-columns:1fr}}

/* ---------- nav current-page marker ---------- */
.nav__links a[aria-current]{opacity:.45}

/* ============================================================
   Added with the site expansion: company, markets, procurement
   ============================================================ */

/* ---------- proof strip: client names, text only ---------- */
.proof{border-top:1px solid var(--ink-12);border-bottom:1px solid var(--ink-12);padding:18px 0 20px}
.proof__list{display:flex;flex-wrap:wrap;row-gap:6px;margin-top:12px;font-size:16px;line-height:1.5;color:var(--ink-72)}
/* each name carries its own trailing divider, so a wrapped line never starts with one */
.proof__list li{white-space:nowrap}
.proof__list li:not(:last-child)::after{content:"";display:inline-block;width:1px;height:.9em;margin:0 14px;vertical-align:-.12em;background:var(--ink-40)}
.capstat .proof{margin-top:22px}

/* ---------- coming soon (section with no content yet) ---------- */
.soon{border-top:1px solid var(--ink-12);padding-top:18px}
.soon__d{margin-top:12px;max-width:66ch}
.soon__d a{color:var(--ink);text-decoration:underline;text-underline-offset:3px}

/* ---------- review markers (must be gone before launch) ---------- */
.tbd{
  display:inline;
  background:#FFF3D6;
  border-bottom:1px solid #C79A1E;
  box-shadow:0 0 0 2px #FFF3D6;
  border-radius:2px;
  color:#6B4E00;
  font-style:normal;
}
.tbd::before{content:"\26A0 \FE0E  "}

/* ---------- data table (prequal / company facts) ---------- */
.dtable{
  border-top:1px solid var(--ink-12);
  overflow-x:auto;
}
.dtable table{width:100%;border-collapse:collapse;min-width:520px}
.dtable th,.dtable td{
  text-align:left;
  vertical-align:top;
  padding:18px 20px 18px 0;
  border-bottom:1px solid var(--ink-12);
  font-size:14.5px;
  line-height:1.55;
}
.dtable th{
  width:230px;
  font-size:10px;font-weight:600;
  letter-spacing:.13em;text-transform:uppercase;
  color:var(--ink-40);
  padding-top:22px;
}
.dtable td{color:var(--ink-72)}
@media(max-width:640px){
  .dtable th{width:170px}
  .dtable th,.dtable td{font-size:13.5px;padding-right:12px}
}
/* phones: one row = label over value, hairline between rows, no sideways scroll */
@media screen and (max-width:540px){
  .dtable{overflow-x:visible}
  .dtable table{min-width:0}
  .dtable table,.dtable tbody,.dtable tr,.dtable th,.dtable td{display:block;width:auto}
  .dtable tr{padding:16px 0;border-bottom:1px solid var(--ink-12)}
  .dtable th,.dtable td{border-bottom:0;padding:0}
  .dtable th{padding-bottom:6px}
  .dtable td{font-size:15px}
}

/* ---------- markets grid (homepage) ---------- */
.mgrid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:clamp(12px,1.4vw,18px);
}
.mcard{
  border:1px solid var(--ink-12);
  border-radius:var(--r-md);
  padding:clamp(24px,2.6vw,34px);
  display:flex;flex-direction:column;gap:14px;
  transition:border-color .25s ease;
}
.mcard:hover{border-color:var(--ink-40)}
.mcard b{font-size:clamp(19px,1.9vw,24px);font-weight:500;letter-spacing:-.026em;line-height:1.14}
.mcard span{font-size:14px;line-height:1.55;color:var(--ink-60);max-width:46ch}
.mcard i{font-style:normal;font-size:12.5px;color:var(--ink-40);margin-top:auto;padding-top:10px}
@media(max-width:760px){.mgrid{grid-template-columns:1fr}}

/* ---------- chips (service-area city list) ---------- */
.chips{
  display:flex;flex-wrap:wrap;gap:8px;
}
.chips li{
  border:1px solid var(--ink-12);
  border-radius:999px;
  padding:7px 15px;
  font-size:13px;
  color:var(--ink-72);
}

/* ---------- notice block (scaffold / editorial note) ---------- */
.notice{
  border:1px solid var(--ink-12);
  border-left:3px solid var(--ink);
  border-radius:var(--r-md);
  padding:clamp(24px,3vw,36px);
  margin-bottom:clamp(24px,3vw,40px);
  background:var(--paper-alt);
}
.notice h2{font-size:clamp(19px,2vw,25px);font-weight:500;letter-spacing:-.026em;line-height:1.15}
.notice p{margin-top:14px;font-size:14.5px;line-height:1.62;color:var(--ink-72);max-width:74ch}
.notice code{font-size:13px;background:var(--ink-06);padding:2px 6px;border-radius:4px}

/* ---------- project scaffold cards ---------- */
.pgrid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:clamp(12px,1.4vw,18px);
}
.pcard{
  border:1px dashed var(--ink-12);
  border-radius:var(--r-md);
  padding:clamp(22px,2.4vw,30px);
  min-height:190px;
  display:flex;flex-direction:column;gap:12px;
}
.pcard__k{
  font-size:10px;font-weight:600;
  letter-spacing:.13em;text-transform:uppercase;
  color:var(--ink-40);
}
.pcard h3{font-size:19px;font-weight:500;letter-spacing:-.024em;color:var(--ink-40)}
.pcard p{font-size:13.5px;line-height:1.55;color:var(--ink-40);margin-top:auto}
@media(max-width:860px){.pgrid{grid-template-columns:1fr}}

/* ---------- bid request form ---------- */
.contact--form{align-items:start}
.contact--form .cinfo{padding-top:6px}
.cform{
  border:1px solid var(--ink-12);
  border-radius:var(--r-lg);
  padding:clamp(24px,3vw,40px);
  display:grid;
  gap:18px;
}
.cform__note{font-size:13px;line-height:1.5}
.cform__two{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.cform__row{display:grid;gap:8px}
.cform label{
  font-size:10px;font-weight:600;
  letter-spacing:.13em;text-transform:uppercase;
  color:var(--ink-40);
}
.cform label span{color:var(--ink-40);margin-left:3px}
.cform input,.cform select,.cform textarea{
  font:inherit;
  font-size:15px;
  color:var(--ink);
  background:var(--paper);
  border:1px solid var(--ink-12);
  border-radius:12px;
  padding:12px 14px;
  width:100%;
  transition:border-color .2s ease;
}
.cform textarea{resize:vertical;line-height:1.5}
.cform input:focus,.cform select:focus,.cform textarea:focus{
  outline:none;
  border-color:var(--ink);
}
.cform input::placeholder,.cform textarea::placeholder{color:var(--ink-40)}
.cform__acts{
  display:flex;align-items:center;gap:18px;flex-wrap:wrap;
  margin-top:6px;
}
@media(max-width:760px){
  .cform__two{grid-template-columns:1fr}
  .contact--form{grid-template-columns:1fr}
}

/* ---------- capability statement (screen + print) ---------- */
.capstat{
  border:1px solid var(--ink-12);
  border-radius:var(--r-lg);
  padding:clamp(28px,3.4vw,48px);
}
.capstat__hd{
  display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;
  padding-bottom:22px;
  border-bottom:2px solid var(--ink);
}
.capstat__hd h1{font-size:clamp(26px,3vw,38px);font-weight:600;letter-spacing:-.032em;line-height:1.05}
.capstat__tag{margin-top:8px;font-size:14px;color:var(--ink-60)}
.capstat__nap{font-size:12.5px;line-height:1.5;color:var(--ink-72);display:flex;gap:28px;flex-wrap:wrap}
.capstat__grid{
  display:grid;grid-template-columns:1fr 1fr;
  gap:clamp(20px,2.6vw,36px);
  padding-top:24px;
}
.capstat__b h2{
  font-size:10px;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink-40);
  padding-bottom:8px;margin-bottom:12px;
  border-bottom:1px solid var(--ink-12);
}
.capstat__b ul{display:grid;gap:9px}
.capstat__b li{
  font-size:13px;line-height:1.5;color:var(--ink-72);
  padding-left:14px;position:relative;
}
.capstat__b li::before{
  content:"";position:absolute;left:0;top:8px;
  width:5px;height:5px;border-radius:999px;background:var(--ink-40);
}
.capstat__b li b{color:var(--ink);font-weight:600}
.capstat__dl{display:grid;grid-template-columns:auto 1fr;gap:7px 16px;margin:0}
.capstat__dl dt{font-size:12px;color:var(--ink-40)}
.capstat__dl dd{font-size:12.5px;color:var(--ink-72);margin:0}
@media screen and (max-width:540px){
  .capstat__dl{grid-template-columns:1fr;gap:0}
  .capstat__dl dt{font-family:"Archivo Condensed","Arial Narrow",sans-serif;font-size:10px;font-weight:600;letter-spacing:.13em;text-transform:uppercase;padding-top:12px}
  .capstat__dl dd{font-size:14px;padding:4px 0 12px;border-bottom:1px solid var(--ink-12)}
}
.capstat__note{font-size:13px;line-height:1.55}
.capstat__ft{
  margin-top:26px;padding-top:14px;
  border-top:1px solid var(--ink-12);
  font-size:11px;color:var(--ink-40);
}
@media(max-width:760px){.capstat__grid{grid-template-columns:1fr}}

/* the negative tracking above was set for a wide sans; the condensed face needs its word spaces back */
.h2,.h3,.statement,.hero__h1,.phero h1,.ctab h2,.scard__t,.mcard b,.relc b,.step__t,.faq__q,
.cap h4,.cred h4,.capstat__hd h1,.capstat__b h2,.gcard b,.stat b,.stat b.stat--word,.step__n{letter-spacing:-.005em}

/* ---------- responsive audit (Step 9) ---------- */
.nav__call{display:none}
/* 44px hit area, same 26px visual */
.burger{width:44px;height:44px;margin:-9px -9px -9px -8px}
.burger i{left:12px;right:12px}
.burger i:nth-child(1){top:18px}
.burger i:nth-child(2){top:24px}
.mark{min-height:44px}
.crumb a{display:inline-block;padding:13px 0;margin:-13px 0}
span.small a{padding:13px 0!important;margin:-13px 0!important}
.ctab__tel,.cinfo__v a,span.small a{display:inline-block;padding:12px 0;margin:-12px 0;max-width:100%;overflow-wrap:anywhere}
/* phones: tap-to-call in the header */
@media(max-width:767px){
  .nav__cta{gap:8px}
  .nav__tel{display:inline-flex;align-items:center;height:44px;padding:0 14px;border:1px solid var(--ink-12);border-radius:999px;font-size:13.5px;font-weight:500}
  .nav__num{display:none}
  .nav__call{display:inline}
}
@media(max-width:400px){.nav__cta .pill{padding-left:16px;gap:10px}}
/* touch widths: footer links get a full 44px row */
@media(max-width:1024px){
  .foot li{margin-bottom:0}
  .foot li a{display:block;padding:12px 0}
  .foot li:not(:has(a)){padding:3px 0}
}
/* phones: body text at 16px; inputs at 16px also stop iOS zooming the form */
@media screen and (max-width:760px){
  .lede,.phero__sub,.hero__sub,.faq__a,.step__d,.scard__d,.cap p,.cred p,.mcard span,.small,.chips li,.stat p,.ctab p,.soon__d,.dtable td,
  .cform input,.cform select,.cform textarea,.cform__note,
  .capstat__tag,.capstat__nap,.capstat__b li,.capstat__dl dd,.capstat__ft,.foot li,.relc span{font-size:16px}
}

@media print{
  .nav,.foot,.crumb,.ctab,.sec--tight .grid,.pill{display:none !important}
  body{font-size:11px}
  .sec{padding:0 !important}
  .wrap{max-width:none;padding:0}
  .capstat{border:0;padding:0}
  .capstat__grid{grid-template-columns:1fr 1fr;gap:14px}
  .capstat__b li{font-size:9.5px;line-height:1.35}
  .capstat__dl dt,.capstat__dl dd{font-size:9.5px}
  .capstat .proof{margin-top:12px;padding:8px 0 10px}
  .capstat .proof__list{font-size:9.5px;margin-top:6px;row-gap:2px}
  .capstat .proof__list li:not(:last-child)::after{margin:0 8px}
  .rv{opacity:1 !important;transform:none !important}
  .tbd{box-shadow:none;background:none;color:#000;text-decoration:underline}
  @page{margin:12mm}
}

/* ---------- flat page hero (no photo emphasis) ---------- */
.phero--flat .phero__stage{min-height:clamp(320px,42vh,420px)}

/* honeypot: hidden from people, visible to bots */
.cform__hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}