/* ---------- home: hero ---------- */
.hero { padding-block: clamp(32px, 5vw, 64px) clamp(56px, 7vw, 88px); }
.hero__grid { align-items: center; }
.hero__copy { grid-column: 1 / span 5; }
.hero__chart { grid-column: 6 / span 7; margin: 0; }
.hero__where { text-wrap: balance; color: var(--ink-2); font-size: var(--fs-sm); font-weight: 500; margin-bottom: var(--s5); }
.hero h1 { max-width: 15ch; }
.hero .lead { margin-top: var(--s5); }
.hero__actions { display: flex; flex-wrap: wrap; gap: var(--s3) var(--s4); align-items: center; margin-top: var(--s6); }
.hero__facts {
  display: grid;
  margin: var(--s7) 0 0;
  border-top: 1px solid var(--rule);
  max-width: 440px;
}
.hero__facts div {
  display: flex; justify-content: space-between; gap: var(--s4);
  padding: 10px 0;
  border-bottom: 1px solid var(--rule);
  font-size: var(--fs-small);
}
.hero__facts dt { color: var(--ink-2); }
.hero__facts dd { margin: 0; font-family: var(--font-mono); font-size: var(--fs-xs); font-weight: 500; color: var(--ink); text-align: right; }

@media (max-width: 1000px) {
  .hero__copy, .hero__chart { grid-column: 1 / -1; }
  .hero__facts { max-width: none; }
}
@media (max-width: 480px) {
  .hero__facts div { display: grid; gap: 2px; }
  .hero__facts dd { text-align: left; }
}

/* ---------- home: trust rail (credentials as a record, ISO leads) ---------- */
.trust { background: var(--surface); border-block: 1px solid var(--rule); }
.trust__grid { display: grid; grid-template-columns: 5fr 7fr; }
.trust__iso {
  display: grid; align-content: start; gap: var(--s3);
  padding: var(--s6) var(--s6) var(--s6) 0;
  border-right: 1px solid var(--rule);
}
.trust__label { color: var(--ink-3); }
.trust__mark { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 var(--s3); color: var(--navy); line-height: 0.9; }
.trust__iso-word {
  font-size: clamp(3.5rem, 7vw, 5.5rem); letter-spacing: -0.02em;
}
.trust__std { font-size: clamp(1.5rem, 2.6vw, 2.125rem); font-weight: 700; font-variation-settings: "wdth" 112; letter-spacing: -0.01em; }
.trust__record { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s3); margin: var(--s2) 0 0; padding-top: var(--s3); border-top: 1px solid var(--rule-soft); }
.trust__record div { display: grid; align-content: start; gap: 4px; }
.trust__record dt { color: var(--ink-3); }
.trust__record dd { margin: 0; font-size: var(--fs-small); line-height: 1.45; color: var(--ink); }
.trust__more { justify-self: start; }

.trust__cells { list-style: none; display: grid; grid-template-columns: 1fr 1fr; }
.trust__cell {
  position: relative;
  display: grid; align-content: start; gap: 6px;
  padding: var(--s5) var(--s6);
}
.trust__cell:nth-child(-n+2) { border-bottom: 1px solid var(--rule); }
.trust__cell:nth-child(odd) { border-right: 1px solid var(--rule); }
.trust__key { color: var(--ink-3); }
.trust__val { color: var(--navy); font-size: clamp(1.25rem, 2vw, 1.625rem); font-weight: 650; line-height: 1.1; letter-spacing: -0.015em; font-variation-settings: "wdth" 108; }
.trust__sub { color: var(--ink-2); font-size: var(--fs-sm); line-height: 1.4; max-width: 34ch; }

@media (max-width: 1000px) {
  .trust__grid { grid-template-columns: 1fr; }
  .trust__iso { padding: var(--s6) 0 var(--s5); border-right: 0; border-bottom: 1px solid var(--rule); }
  .trust__cell { padding: var(--s5) var(--s5) var(--s5) 0; }
  .trust__cell:nth-child(even) { padding-left: var(--s5); padding-right: 0; }
}
@media (max-width: 520px) {
  .trust__record { grid-template-columns: 1fr; gap: var(--s2); }
  .trust__record div { grid-template-columns: 9.5rem 1fr; align-items: baseline; }
  .trust__cell { padding: var(--s4) var(--s3) var(--s4) 0; }
  .trust__cell:nth-child(even) { padding-left: var(--s3); }
  .trust__sub { font-size: var(--fs-xs); }
}

.photo-band--shafts img { object-position: 50% 40%; }

/* ---------- home: process codes (index only; the full register lives on processes/) ---------- */
.codes {
  list-style: none;
  display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 15rem), 1fr));
  border-top: 1px solid var(--rule); border-left: 1px solid var(--rule);
}
.codes li { border-right: 1px solid var(--rule); border-bottom: 1px solid var(--rule); }
.codes a {
  display: grid; align-content: start; gap: var(--s2);
  height: 100%; padding: var(--s5);
  color: var(--ink); text-decoration: none;
  transition: background-color 200ms var(--ease-out);
}
.codes__code {
  color: var(--navy); font-size: clamp(2rem, 3.4vw, 2.75rem); line-height: 0.95; letter-spacing: -0.01em;
}
.codes__name { color: var(--ink-2); font-size: var(--fs-sm); line-height: 1.4; }
.codes a:hover { background: var(--surface); }
.codes a:hover .codes__name { color: var(--ink); }
.codes a:focus-visible { outline-offset: -3px; }
.section-more { margin-top: var(--s5); }
@media (max-width: 520px) {
  .codes { grid-template-columns: 1fr 1fr; }
  .codes a { padding: var(--s4); }
  .codes__code { font-size: 1.75rem; }
}

/* ---------- home: quality and plant ---------- */
.control { background: var(--surface); border-block: 1px solid var(--rule); }
.control__grid { align-items: start; }
.control__copy { grid-column: 1 / span 5; }
.control__side { grid-column: 7 / span 6; }
.control .lead { margin-top: var(--s5); }
.control__list { list-style: none; border-top: 1px solid var(--rule); }
.control__list li { padding: 14px 0; border-bottom: 1px solid var(--rule); color: var(--ink-2); font-size: var(--fs-small); }
.control__list strong { color: var(--ink); font-weight: 600; }
.control__links { display: flex; flex-wrap: wrap; gap: var(--s3) var(--s6); margin-top: var(--s6); }
/* quality page: the release table in the same grid */
.control__table { grid-column: 7 / span 6; }
.control__table .ledger td.mono { width: 5.5rem; color: var(--navy); }
.control__table .ledger .ledger__result, .control__table .ledger .ledger__result-h { width: 5rem; text-align: right; padding-right: 0; }
.control__table .ledger tbody th { font-weight: 500; }
@media (max-width: 900px) {
  .control__copy, .control__side, .control__table { grid-column: 1 / -1; }
  .control__side, .control__table { margin-top: var(--s5); }
}

.quote-band__photo figcaption { margin-top: var(--s2); color: var(--ink-3); }

/* ---------- home: portal band ---------- */
.portal-lot {
  margin: 0;
  padding: var(--s5) var(--s5) var(--s6);
  border: 1px solid var(--on-navy-rule);
  border-radius: var(--r-sm);
  background: var(--navy-deep);
}
.portal-lot__head { display: flex; justify-content: space-between; gap: var(--s3); margin-bottom: var(--s6); color: var(--on-navy); }
/* dashed tag; the border takes the text colour */
.portal-lot__tag, .report__tag { padding: 1px 6px; border: 1px dashed; border-radius: var(--r-xs); }
.portal-lot__tag { color: var(--on-navy-2); }
.portal-band__actions { display: flex; flex-wrap: wrap; gap: var(--s3); margin-top: var(--s6); }
@media (max-width: 600px) {
  .portal-lot { padding: var(--s4); }
}

/* ---------- home: quote band ---------- */
.quote-band__grid { display: grid; grid-template-columns: 8fr 4fr; gap: var(--s7); align-items: center; }
.quote-band h2 { max-width: 16ch; }
.quote-band .lead { margin-top: var(--s5); }
.quote-band__photo { margin: 0; justify-self: end; width: min(100%, 300px); }
.quote-band__photo img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; border-radius: var(--r-sm); }
@media (max-width: 760px) {
  .quote-band__grid { grid-template-columns: 1fr; }
  .quote-band__photo { justify-self: start; width: min(100%, 260px); }
}

.site-footer__note { margin-top: var(--s4); }
/* Footer badges are inline SVG drawn in currentColor: they take the colour of the ground
   they sit on (white on the navy footer, navy on a light ground), so one drawing serves both. */
.site-footer__badges { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s5); margin-top: var(--s5); color: var(--on-navy); }
.site-footer__badges svg { height: 96px; width: auto; flex: none; }
.badge text { font-family: var(--font-sans); }

/* =====================================================================
   Inner pages
   ===================================================================== */

/* ---------- breadcrumb ---------- */
.crumbs { display: flex; flex-wrap: wrap; gap: 0 var(--s2); list-style: none; margin-bottom: var(--s5); color: var(--ink-3); }
.crumbs li + li::before { content: "/"; margin-right: var(--s2); color: var(--rule); }
.crumbs a { color: var(--ink-2); text-decoration: none; }
.crumbs a:hover { color: var(--navy); text-decoration: underline; }
.field-navy .crumbs { color: var(--on-navy-2); }
.field-navy .crumbs li + li::before { color: var(--on-navy-rule); }
.field-navy .crumbs a { color: var(--on-navy-2); }
.field-navy .crumbs a:hover { color: var(--on-navy); }

/* ---------- page head (light) ---------- */
.page-head { padding-block: clamp(32px, 5vw, 64px) clamp(48px, 6vw, 80px); border-bottom: 1px solid var(--rule); }
.page-head__grid { align-items: end; }
.page-head__copy { grid-column: 1 / span 8; }
.page-head__copy h1 { max-width: 16ch; }
.page-head__copy .lead { margin-top: var(--s5); max-width: 52ch; }
.page-head__aside { grid-column: 9 / span 4; }
.page-head__actions { display: flex; flex-wrap: wrap; gap: var(--s3) var(--s4); align-items: center; margin-top: var(--s6); }
@media (max-width: 900px) {
  .page-head__copy, .page-head__aside { grid-column: 1 / -1; }
  .page-head__aside { margin-top: var(--s5); }
}

/* key facts as a ruled record (used in heads and asides) */
.facts { display: grid; margin: 0; border-top: 1px solid var(--rule); }
.facts > div { display: grid; grid-template-columns: minmax(8rem, 2fr) 3fr; align-items: baseline; gap: var(--s4); padding: 10px 0; border-bottom: 1px solid var(--rule); }
.facts dt { color: var(--ink-3); }
.facts dd { margin: 0; color: var(--ink); font-size: var(--fs-small); }
.facts dd.mono { font-size: var(--fs-xs); }
.field-navy .facts { border-top-color: var(--on-navy-rule); }
.field-navy .facts > div { border-bottom-color: var(--on-navy-rule); }
.field-navy .facts dt { color: var(--on-navy-2); }
.field-navy .facts dd { color: var(--on-navy); }

/* ---------- process head: navy field, the plant-wall code ---------- */
.proc-head { padding-block: clamp(28px, 4vw, 48px) clamp(48px, 6vw, 88px); overflow: hidden; }
.proc-head__grid { align-items: end; }
.proc-head__copy { grid-column: 1 / span 7; }
.proc-head__code {
  display: block;
  margin: 0 0 var(--s4) -0.04em;
  color: var(--on-navy);
  font-size: var(--fs-wall); line-height: 0.82;
  letter-spacing: -0.02em;
}
.proc-head h1 { font-size: var(--fs-h2); line-height: 1.05; max-width: 20ch; }
.proc-head .lead { margin-top: var(--s4); max-width: 50ch; }
.proc-head__aside { grid-column: 9 / span 4; }
.proc-head__source { margin-top: var(--s3); color: var(--on-navy-2); }
@media (max-width: 900px) {
  .proc-head__copy, .proc-head__aside { grid-column: 1 / -1; }
  .proc-head__aside { margin-top: var(--s4); }
}
.motion .proc-head__code.rv { transform: none; font-variation-settings: "wdth" 80; letter-spacing: 0.04em; transition: font-variation-settings 1200ms var(--ease-out), letter-spacing 1200ms var(--ease-out), opacity 700ms var(--ease-out); }
.motion .proc-head__code.rv.is-in { font-variation-settings: "wdth" 125; letter-spacing: -0.02em; }

/* ---------- split: heading column + body column ---------- */
.split__head { grid-column: 1 / span 4; }
.split__body { grid-column: 6 / span 7; }
.split__body > * + * { margin-top: var(--s5); }
.split__head .muted { margin-top: var(--s4); font-size: var(--fs-small); }
@media (max-width: 900px) {
  .split__head, .split__body { grid-column: 1 / -1; }
  .split__body { margin-top: var(--s4); }
}
.bullets { list-style: none; border-top: 1px solid var(--rule); }
.bullets li { padding: 12px 0 12px var(--s5); border-bottom: 1px solid var(--rule); position: relative; color: var(--ink-2); }
.bullets li::before { content: ""; position: absolute; left: 2px; top: 1.3em; width: 8px; height: 1px; background: var(--ink-3); }
.bullets strong { color: var(--ink); font-weight: 600; }

.band { background: var(--surface); border-block: 1px solid var(--rule); }

/* single-cycle chart on a process page */
.cycle-wrap { max-width: 1040px; margin-inline: 0; }

/* ---------- specifications we control ---------- */
.spec-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0; border-top: 1px solid var(--rule); }
.spec-list > div { display: grid; align-content: start; gap: 6px; padding: var(--s5) var(--s5) var(--s5) 0; border-bottom: 1px solid var(--rule); }
.spec-list > div:nth-child(odd) { border-right: 1px solid var(--rule); }
.spec-list > div:nth-child(even) { padding-left: var(--s5); }
.spec-list dt { color: var(--ink); font-weight: 600; }
.spec-list dd { margin: 0; color: var(--ink-2); font-size: var(--fs-small); }
.spec-list .spec-how { color: var(--ink-3); }
@media (max-width: 640px) {
  .spec-list { grid-template-columns: 1fr; }
  .spec-list > div, .spec-list > div:nth-child(even) { padding: var(--s4) 0; border-right: 0; }
}

/* ---------- case-depth traverse (illustrative) ---------- */
.traverse { margin: 0; background: var(--surface); border: 1px solid var(--rule); border-radius: var(--r-sm); }
.traverse__head { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--s2); padding: var(--s4) var(--s5) 0; }
.traverse__head strong { color: var(--navy); font-weight: 600; }
.traverse__plot { height: clamp(240px, 26vw, 320px); padding: 0 var(--s2); }
.traverse__plot svg { width: 100%; height: 100%; overflow: visible; }
.traverse__plot text { font-family: var(--font-mono); font-size: var(--fs-2xs); font-weight: 500; fill: var(--ink-3); }
.traverse__plot .grid line { stroke: var(--rule-soft); shape-rendering: crispEdges; }
.traverse__plot .axis-line { stroke: var(--rule); shape-rendering: crispEdges; }
.traverse__plot .curve { fill: none; stroke: var(--navy); stroke-width: 2.5; stroke-linejoin: round; }
.traverse__plot .dot { fill: var(--surface); stroke: var(--navy); stroke-width: 1.5; transition: opacity 300ms var(--ease-out); }
.traverse__plot .limit { stroke: var(--data); stroke-dasharray: 4 3; shape-rendering: crispEdges; }
.traverse__plot .limit-label { fill: var(--data); }
.traverse__plot .ecd { stroke: var(--navy-2); stroke-dasharray: 2 3; }
.traverse__plot .ecd-label { fill: var(--navy); font-weight: 600; paint-order: stroke; stroke: var(--surface); stroke-width: 4px; }
.traverse__plot .curve.is-drawing { transition: stroke-dashoffset 1.6s var(--ease-out); }
.traverse__foot { padding: var(--s3) var(--s5) var(--s4); border-top: 1px solid var(--rule-soft); color: var(--ink-3); }

.spec-grid { align-items: start; }
.spec-grid__list { grid-column: 1 / span 6; }
.spec-grid__chart { grid-column: 7 / span 6; position: sticky; top: 100px; }
@media (max-width: 1000px) {
  .spec-grid__list, .spec-grid__chart { grid-column: 1 / -1; position: static; }
}

/* ---------- route through the plant (PIR operations) ---------- */
.route { list-style: none; border-top: 1px solid var(--rule); }
.route li {
  position: relative;
  display: grid; grid-template-columns: 4.5rem minmax(0, 4fr) minmax(0, 5fr) minmax(0, 3fr); gap: var(--s4);
  align-items: baseline;
  padding: 14px 0;
  border-bottom: 1px solid var(--rule);
  color: var(--ink-2);
  font-size: var(--fs-small);
}
.route__op { color: var(--ink-3); font-size: var(--fs-xs); }
.route__name { color: var(--ink); font-weight: 600; font-size: 1rem; }
.route__eq { color: var(--ink-3); text-align: right; }
.route li.is-key .route__op { color: var(--on-navy); }
.route li.is-key .route__op span { background: var(--navy); padding: 2px 6px; border-radius: var(--r-xs); }
.route li.is-key .route__name { color: var(--navy); }
.route__legend { display: flex; align-items: center; gap: var(--s2); margin-top: var(--s4); color: var(--ink-3); }
.route__legend span { background: var(--navy); color: var(--on-navy); padding: 2px 6px; border-radius: var(--r-xs); }
@media (max-width: 760px) {
  .route li { grid-template-columns: 3.5rem 1fr; gap: 2px var(--s3); }
  .route__desc, .route__eq { grid-column: 2; text-align: left; }
}

/* ---------- two ruled lists side by side ---------- */
.pair { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s7); }
.pair h3 { margin-bottom: var(--s4); }
.pair .note { margin-top: var(--s3); color: var(--ink-3); font-size: var(--fs-sm); }
@media (max-width: 760px) { .pair { grid-template-columns: 1fr; gap: var(--s6); } }
.chips { display: flex; flex-wrap: wrap; gap: var(--s2); list-style: none; }
.chips li { padding: 6px 10px; border: 1px solid var(--rule); border-radius: var(--r-xs); background: var(--surface); color: var(--ink); }

/* ---------- FAQ ---------- */
.faq { border-top: 1px solid var(--rule); }
.faq details { border-bottom: 1px solid var(--rule); }
.faq summary {
  display: flex; justify-content: space-between; align-items: baseline; gap: var(--s4);
  padding: var(--s4) 0;
  color: var(--ink); font-weight: 600; font-size: var(--fs-body);
  cursor: pointer; list-style: none;
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after {
  content: "+"; flex: none;
  font-family: var(--font-mono); font-weight: 500; color: var(--navy);
  transition: transform 260ms var(--ease-out);
}
.faq details[open] summary::after { transform: rotate(45deg); }
.faq summary:hover { color: var(--navy); }
.faq details > div { padding: 0 0 var(--s5); color: var(--ink-2); max-width: 68ch; }

/* ---------- closing call to action ---------- */
.cta__grid { display: grid; grid-template-columns: 7fr 5fr; gap: var(--s7); align-items: end; }
.cta h2 { max-width: 18ch; }
.cta .lead { margin-top: var(--s4); }
.cta__actions { display: flex; flex-wrap: wrap; gap: var(--s3) var(--s4); align-items: center; justify-content: flex-end; }
@media (max-width: 760px) {
  .cta__grid { grid-template-columns: 1fr; gap: var(--s5); }
  .cta__actions { justify-content: flex-start; }
}

/* ---------- previous / next process ---------- */
.prevnext { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--rule); }
.prevnext a {
  display: grid; gap: 2px;
  padding: var(--s5) 0;
  color: var(--ink); text-decoration: none;
}
.prevnext a + a { text-align: right; border-left: 1px solid var(--rule); padding-left: var(--s5); }
.prevnext .dir { color: var(--ink-3); }
.prevnext .code { color: var(--navy); font-size: clamp(1.75rem, 3vw, 2.5rem); line-height: 1; transition: font-variation-settings 400ms var(--ease-out); }
.prevnext .name { color: var(--ink-2); font-size: var(--fs-small); }
.prevnext a:hover .code { font-variation-settings: "wdth" 110; }
.prevnext a:hover .name { color: var(--navy); text-decoration: underline; }

/* ---------- steps (numbered, ruled) ---------- */
.steps { list-style: none; display: grid; grid-template-columns: repeat(var(--n, 3), minmax(0, 1fr)); counter-reset: step; }
.steps > li { counter-increment: step; padding: var(--s5) var(--s5) 0 0; border-top: 2px solid var(--rule); }
.steps > li::before { content: counter(step, decimal-leading-zero); display: block; margin-bottom: var(--s3); font: 500 0.8125rem/1 var(--font-mono); color: var(--navy); }
.steps h3 { margin-bottom: var(--s2); }
.steps p { color: var(--ink-2); font-size: var(--fs-small); max-width: 34ch; }
@media (max-width: 760px) { .steps { grid-template-columns: 1fr; } .steps > li { padding-bottom: var(--s5); } }

/* ---------- plant: equipment register ---------- */
.equip { list-style: none; border-top: 1px solid var(--rule); }
.equip > li {
  display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 4fr) minmax(0, 5fr); gap: var(--s5);
  padding: var(--s6) 0; border-bottom: 1px solid var(--rule);
}
.equip__codes { color: var(--navy); font-size: clamp(1.75rem, 3.4vw, 2.75rem); line-height: 0.95; letter-spacing: -0.01em; }
.equip__codes small { display: block; margin-top: var(--s2); color: var(--ink-3); font: 500 var(--fs-data)/1.3 var(--font-mono); letter-spacing: 0.02em; }
.equip__body h3 { margin-bottom: var(--s2); }
.equip__body p { color: var(--ink-2); font-size: var(--fs-small); }
.equip .facts { align-self: start; }
@media (max-width: 900px) {
  .equip > li { grid-template-columns: 1fr 1fr; }
  .equip .facts { grid-column: 1 / -1; }
}
@media (max-width: 560px) { .equip > li { grid-template-columns: 1fr; gap: var(--s3); } }

/* about: a photo under the body of a split section */
.about__photo { margin: var(--s6) 0 0; }
.about__photo img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; border-radius: var(--r-sm); }
.about__photo figcaption { margin-top: var(--s2); color: var(--ink-3); }

.gallery { gap: var(--s4); }
.gallery figure { margin: 0; }
.gallery img { width: 100%; height: 100%; object-fit: cover; border-radius: var(--r-sm); }
.gallery figcaption { margin-top: var(--s2); color: var(--ink-3); }
.gallery__a { grid-column: 1 / span 7; }
.gallery__a img { aspect-ratio: 7 / 5; }
.gallery__b { grid-column: 8 / span 5; }
.gallery__b img { aspect-ratio: 5 / 5; }
@media (max-width: 760px) { .gallery__a, .gallery__b { grid-column: 1 / -1; } .gallery__b img { aspect-ratio: 3 / 2; } }

/* ---------- quality: certificate record (page-head aside) ---------- */
.cert__doc { background: var(--surface); border: 1px solid var(--rule); border-radius: var(--r-sm); padding: var(--s6); }
.cert__mark { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 var(--s3); color: var(--navy); line-height: 0.9; margin-bottom: var(--s5); }
.cert__mark .trust__iso-word { font-size: clamp(3rem, 6vw, 4.5rem); }
.cert__record { display: grid; grid-template-columns: 1fr 1fr; margin: 0; border-top: 1px solid var(--rule); }
.cert__record > div { display: grid; gap: 4px; padding: var(--s3) var(--s4) var(--s3) 0; border-bottom: 1px solid var(--rule-soft); }
.cert__record dt { color: var(--ink-3); }
.cert__record dd { margin: 0; color: var(--ink); font-size: var(--fs-small); }
@media (max-width: 520px) { .cert__doc { padding: var(--s4); } .cert__record { grid-template-columns: 1fr; } }

/* ---------- quality: anatomy of a test report ---------- */
.report { align-items: start; }
.report__sheet {
  grid-column: 1 / span 7; position: relative;
  background: var(--surface); border: 1px solid var(--rule); border-radius: var(--r-sm);
  padding: var(--s5); font-size: var(--fs-xs);
}
.report__sheet header { display: flex; justify-content: space-between; align-items: start; gap: var(--s4); padding-bottom: var(--s3); border-bottom: 2px solid var(--navy); }
.report__sheet header img { width: 84px; height: 42px; object-fit: contain; flex: none; }
.report__sheet h3 { font-size: 1rem; }
.report__tag { color: var(--ink-3); }
.report__part { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s2) var(--s4); margin: var(--s3) 0; }
.report__part div { display: grid; gap: 2px; }
.report__part dt { color: var(--ink-3); }
.report__part dd { margin: 0; color: var(--ink); }
.report__block { position: relative; padding: var(--s3) 0; border-top: 1px solid var(--rule-soft); }
.report__block h4 { margin: 0 0 var(--s2); color: var(--ink-2); font: 600 var(--fs-data)/1.3 var(--font-mono); text-transform: uppercase; letter-spacing: 0.06em; }
.report__block table th, .report__block table td { padding: 4px 8px 4px 0; border-bottom: 1px solid var(--rule-soft); text-align: left; font-weight: 500; }
.report__block table thead th { color: var(--ink-3); }
.report__pin {
  position: absolute; right: 0; top: var(--s3);
  display: grid; place-items: center; width: 22px; height: 22px;
  border-radius: 50%; background: var(--navy); color: var(--on-navy);
  font: 600 0.6875rem/1 var(--font-mono);
}
.report__sign { display: flex; justify-content: space-between; gap: var(--s3); padding-top: var(--s3); border-top: 1px solid var(--rule-soft); color: var(--ink-3); }
.report__keys { grid-column: 9 / span 4; list-style: none; counter-reset: key; border-top: 1px solid var(--rule); }
.report__keys li { counter-increment: key; display: grid; grid-template-columns: 30px 1fr; gap: var(--s3); padding: var(--s4) 0; border-bottom: 1px solid var(--rule); color: var(--ink-2); font-size: var(--fs-small); }
.report__keys li::before { content: counter(key); display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: var(--navy); color: var(--on-navy); font: 600 0.6875rem/1 var(--font-mono); }
.report__keys strong { display: block; color: var(--ink); font-weight: 600; }
@media (max-width: 1000px) { .report__sheet, .report__keys { grid-column: 1 / -1; } }
@media (max-width: 520px) { .report__part { grid-template-columns: 1fr 1fr; } .report__sheet { padding: var(--s4); } }

/* ---------- industries: one row per sector, photo alternates side ---------- */
.sector {
  align-items: center;
  padding-block: var(--s7); border-top: 1px solid var(--rule);
}
.sector:first-child { border-top: 0; padding-top: 0; }
.sector:last-child { padding-bottom: 0; }
.sector__photo { grid-column: 1 / span 6; margin: 0; }
.sector__photo img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--r-sm); background: var(--surface); }
.sector__photo figcaption { margin-top: var(--s2); color: var(--ink-3); }
.sector__main { grid-column: 8 / span 5; }
.sector:nth-child(even) .sector__photo { grid-column: 7 / span 6; grid-row: 1; }
.sector:nth-child(even) .sector__main { grid-column: 1 / span 5; grid-row: 1; }
.sector__status { display: inline-block; margin-top: var(--s3); }
.sector__status--next { background: transparent; color: var(--navy); border: 1px solid var(--navy); }
.sector__body { margin-top: var(--s5); }
.sector__body p { color: var(--ink-2); }
.sector__body p + .bullets { margin-top: var(--s4); }
.sector__parts { margin-top: var(--s5); }
.sector__parts h3 { font-size: var(--fs-small); color: var(--ink-2); margin-bottom: var(--s3); }
@media (max-width: 900px) {
  .sector .sector__photo, .sector .sector__main,
  .sector:nth-child(even) .sector__photo, .sector:nth-child(even) .sector__main { grid-column: 1 / -1; grid-row: auto; }
  .sector__photo img { aspect-ratio: 16 / 10; }
}

/* ---------- contact + quote form ---------- */
.contact-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }  /* page-head already draws the rule above */
.contact-cards > div { padding: 0 var(--s5) var(--s5) 0; border-bottom: 1px solid var(--rule); }
.contact-cards > div + div { padding-left: var(--s5); border-left: 1px solid var(--rule); }
.contact-cards h2 { font-size: var(--fs-h3); margin-bottom: var(--s3); }
.contact-cards address, .contact-cards p { font-style: normal; color: var(--ink-2); font-size: var(--fs-small); }
.contact-cards a { font-weight: 600; }
@media (max-width: 900px) {
  .contact-cards { grid-template-columns: 1fr; }
  .contact-cards > div + div { padding-top: var(--s5); padding-left: 0; border-left: 0; }
}

.quote { align-items: start; }
.quote__intro { grid-column: 1 / span 4; position: sticky; top: 100px; }
.quote__intro .lead { margin-top: var(--s4); }
.quote__intro .bullets { margin-top: var(--s6); }
.quote__form { grid-column: 6 / span 7; }
@media (max-width: 1000px) { .quote__intro, .quote__form { grid-column: 1 / -1; position: static; } }

.form { background: var(--surface); border: 1px solid var(--rule); border-radius: var(--r-sm); padding: clamp(var(--s4), 3vw, var(--s6)); }
.form fieldset { border: 0; margin: 0; padding: 0; }
.form fieldset + fieldset { margin-top: var(--s6); padding-top: var(--s5); border-top: 1px solid var(--rule); }
/* float pulls the legend off the fieldset's top border so every section head sits below its rule */
.form legend { float: left; width: 100%; display: flex; align-items: baseline; gap: var(--s3); padding: 0; margin-bottom: var(--s4); color: var(--navy); font-weight: 650; font-size: 1.125rem; }
.form legend .mono { color: var(--ink-3); font-weight: 500; }
.form legend + * { clear: both; }
.form__row { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s4); }
.form__row + .form__row, .form__row + .field { margin-top: var(--s4); }
.form__row--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 640px) { .form__row, .form__row--3 { grid-template-columns: 1fr; } }
.field { display: grid; gap: 6px; align-content: start; min-width: 0; }
.field label, .field .label { color: var(--ink); font-size: var(--fs-small); font-weight: 600; }
.field .opt { color: var(--ink-3); font-weight: 400; }
.field .hint { color: var(--ink-3); font-size: var(--fs-xs); }
.field input, .field select, .field textarea {
  width: 100%; min-height: 46px;
  padding: 11px 13px;
  border: 1px solid var(--rule); border-radius: var(--r-xs);
  background: var(--surface); color: var(--ink);
  font: 400 1rem/1.35 var(--font-sans);
  transition: border-color 160ms var(--ease-out), box-shadow 160ms var(--ease-out);
}
.field textarea { min-height: 112px; resize: vertical; }
.field select { appearance: none; background-image: linear-gradient(45deg, transparent 50%, var(--ink-2) 50%), linear-gradient(135deg, var(--ink-2) 50%, transparent 50%); background-position: calc(100% - 18px) 50%, calc(100% - 13px) 50%; background-size: 5px 5px; background-repeat: no-repeat; padding-right: 36px; }
.field input:hover, .field select:hover, .field textarea:hover { border-color: var(--ink-3); }
.field input:focus, .field select:focus, .field textarea:focus { outline: none; border-color: var(--navy-2); box-shadow: 0 0 0 3px var(--rule-soft), 0 0 0 1px var(--navy-2); }
.field .unit { position: relative; }
.field .unit input { padding-right: 64px; }
.field .unit span { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); color: var(--ink-3); pointer-events: none; }
.field.is-invalid input, .field.is-invalid select, .field.is-invalid textarea { border-color: var(--red-press); box-shadow: 0 0 0 1px var(--red-press); }
.form__note { margin-top: var(--s4); padding-top: var(--s3); border-top: 1px solid var(--rule-soft); color: var(--ink-2); font-size: var(--fs-sm); line-height: 1.5; max-width: 64ch; }
.form__note strong { color: var(--ink); font-weight: 600; }
.field .error { display: none; color: var(--red-press); font-size: var(--fs-xs); font-weight: 600; }
.field.is-invalid .error { display: block; }
.checks-inline { display: flex; flex-wrap: wrap; gap: var(--s2); }
.checks-inline label { display: inline-flex; align-items: center; gap: var(--s2); min-height: 40px; padding: 0 12px; border: 1px solid var(--rule); border-radius: var(--r-xs); font-weight: 600; font-size: var(--fs-sm); cursor: pointer; transition: border-color 160ms var(--ease-out), background-color 160ms var(--ease-out); }
.checks-inline label:hover { border-color: var(--ink-3); }
.checks-inline input { width: 16px; height: 16px; min-height: 0; margin: 0; accent-color: var(--navy); }
.checks-inline label:has(input:checked) { border-color: var(--navy); background: var(--ground); color: var(--navy); }
.checks-inline label:has(input:focus-visible) { box-shadow: var(--focus); }
.form__foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--s4); margin-top: var(--s6); padding-top: var(--s5); border-top: 1px solid var(--rule); }
.form__foot p { color: var(--ink-3); font-size: var(--fs-xs); max-width: 44ch; }
.form__summary { margin-bottom: var(--s5); padding: var(--s3) var(--s4); border: 1px solid var(--red-press); border-radius: var(--r-xs); color: var(--ink); font-size: var(--fs-small); }
.form__summary strong { color: var(--red-press); }
.form__done { text-align: left; scroll-margin-top: var(--s5); }
/* focus is moved here by script so screen readers announce it; the panel is not a control, so no ring */
.form__done:focus-visible { box-shadow: none; }
.form__done h3 { margin: var(--s3) 0 var(--s2); font-size: var(--fs-h2); }
.form__done p { color: var(--ink-2); max-width: 52ch; }
.form__done .facts { margin-top: var(--s5); }
.form__done .page-head__actions { margin-top: var(--s5); }
.motion .form__done:not([hidden]) { animation: done-in 600ms var(--ease-out); }
@keyframes done-in { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }


/* ---------- careers / about ---------- */
.timeline { list-style: none; border-top: 1px solid var(--rule); }
.timeline li { display: grid; grid-template-columns: 8rem 1fr; gap: var(--s5); padding: var(--s4) 0; border-bottom: 1px solid var(--rule); }
.timeline .when { color: var(--navy); font-size: var(--fs-sm); }
.timeline p { color: var(--ink-2); }
.timeline strong { color: var(--ink); font-weight: 600; }
@media (max-width: 520px) { .timeline li { grid-template-columns: 1fr; gap: 2px; } }

/* ---------- 404 ---------- */
.lost { min-height: 62vh; display: grid; align-content: center; }
.lost__code { color: var(--navy); font-size: var(--fs-wall); line-height: 0.82; letter-spacing: -0.02em; }
.lost h1 { margin-top: var(--s5); font-size: var(--fs-h2); max-width: 20ch; }
.lost .lead { margin-top: var(--s4); }
.lost__links { display: flex; flex-wrap: wrap; gap: var(--s2) var(--s5); margin-top: var(--s6); list-style: none; }
.lost__links a { font-weight: 600; }
.spec-grid__intro { margin-block: var(--s4) var(--s6); }
.report__meta { margin-top: var(--s2); }

/* ---------- home: numbers + customer logos (trust bar) ---------- */
.numbers__grid {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s6);
  margin: var(--s7) 0 0; padding-top: var(--s6); border-top: 1px solid var(--rule);
}
.numbers__grid > div { display: flex; flex-direction: column-reverse; justify-content: flex-end; gap: var(--s3); }
.numbers__n {
  margin: 0; color: var(--navy); line-height: 0.95;
  font-size: clamp(3.25rem, 7.5vw, 6rem); font-weight: 700;
  letter-spacing: -0.02em; font-variation-settings: "wdth" 112;
}
.numbers__label { color: var(--ink-2); font-size: var(--fs-small); max-width: 24ch; }
@media (max-width: 640px) {
  .numbers__grid { grid-template-columns: 1fr; gap: var(--s5); }
  .numbers__grid > div + div { padding-top: var(--s5); border-top: 1px solid var(--rule-soft); }
}

.clients { background: var(--ground-2); border-block: 1px solid var(--rule); padding-block: var(--s8); }
.clients[hidden] { display: none; }
.clients__label { color: var(--ink-3); margin-bottom: var(--s5); }
.clients__grid { list-style: none; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--s5); }
.clients__grid li { display: grid; place-items: center; aspect-ratio: 3 / 1; }
.clients__grid img { max-width: 100%; max-height: 56px; width: auto; object-fit: contain; filter: grayscale(1); opacity: 0.85; }
.clients__slot {
  border: 1px dashed var(--rule); border-radius: var(--r-sm);
  color: var(--ink-3); font: 500 var(--fs-data) / 1 var(--font-mono);
}
@media (max-width: 900px) { .clients__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 560px) { .clients__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s3); } }