/* ===== TOKEN ALIASES (theme.json is source of truth) ===== */
:root {
  --primary: var(--wp--preset--color--primary);
  --primary-light: var(--wp--preset--color--primary-light);
  --primary-deep: var(--wp--preset--color--primary-deep);
  --ink: var(--wp--preset--color--ink);
  --ink-soft: var(--wp--preset--color--ink-soft);
  --ink-mute: var(--wp--preset--color--ink-mute);
  --paper: var(--wp--preset--color--paper);
  --paper-warm: var(--wp--preset--color--paper-warm);
  --rule: var(--wp--preset--color--rule);
  --rule-strong: var(--wp--preset--color--rule-strong);
  --accent: var(--wp--preset--color--accent);
  --accent-light: var(--wp--preset--color--accent-light);
  --container: 1280px;
  --pad-x: clamp(1rem, 4vw, 2.5rem);
  --gutter: 24px;
  --section-y: clamp(5rem, 9vw, 9rem);
  /* Reading-flow sections (acri/prose) sit closer than full bands so the page
     reads as one document; roughly the page-hero's scale, not --section-y. */
  --prose-y: clamp(2.75rem, 4.5vw, 4.25rem);
  --font-display: var(--wp--preset--font-family--display);
  --font-body: var(--wp--preset--font-family--body);
  --font-mono: var(--wp--preset--font-family--mono);
  --ease: cubic-bezier(.2,.7,.2,1);
  /* On-dark text roles. One alpha per role; all pass WCAG AA on both dark
     surfaces (--ink and --primary-deep). Use these instead of ad-hoc
     rgba(255,255,255,x) so the roles can't drift. */
  --on-dark-strong: #fff;
  --on-dark-body: rgba(255,255,255,0.78);
  --on-dark-mute: rgba(255,255,255,0.6);
  --on-dark-faint: rgba(255,255,255,0.45); /* decorative only, not for text */
}

/* ============ RESET / BASE ============ */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--font-body);
  font-weight: 400;
  font-size: 17px;
  line-height: 1.6;
}
img, svg { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { font: inherit; cursor: pointer; border: 0; background: none; color: inherit; }
h1, h2, h3, h4 { margin: 0; font-family: var(--font-display); }

.container {
  width: 100%;
  max-width: var(--container);
  margin: 0 auto;
  padding-inline: var(--pad-x);
}

/* ============ TYPE PRIMITIVES ============ */
.mono { font-family: var(--font-mono); }

.kicker {
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-soft);
}
.kicker.on-dark { color: var(--on-dark-mute); }
.kicker .acc { color: var(--accent); }

.section-num {
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 500;
  color: var(--accent);
  letter-spacing: 0.08em;
  display: inline-block;
  padding-top: 6px;
  border-top: 1px solid var(--accent);
  min-width: 24px;
}

.h-display {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: clamp(2.5rem, 5vw, 4.5rem);
  line-height: 1.05;
  letter-spacing: -0.025em;
  text-wrap: balance;
}
.h-section {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: clamp(2rem, 3.5vw, 3.25rem);
  line-height: 1.1;
  letter-spacing: -0.02em;
  text-wrap: balance;
}
.h-sub {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: 1.375rem;
  line-height: 1.3;
  letter-spacing: -0.01em;
}
.body-lg {
  font-size: 1.125rem;
  line-height: 1.55;
  color: var(--ink-soft);
  max-width: 56ch;
  text-wrap: pretty;
}
.body { color: var(--ink-soft); max-width: 56ch; text-wrap: pretty; }
.body-sm { font-size: 0.9375rem; color: var(--ink-soft); }
.on-dark { color: var(--on-dark-body); }

/* ============ BUTTONS / LINKS ============ */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  height: 48px;
  padding: 0 22px;
  font-family: var(--font-display);
  font-weight: 500;
  font-size: 14px;
  border-radius: 2px;
  transition: background-color .15s ease, color .15s ease, border-color .15s ease;
  white-space: nowrap;
}
.btn .arrow { transition: transform .2s var(--ease); }
.btn:hover .arrow { transform: translateX(3px); }
.btn-primary { background: var(--primary); color: #fff; }
.btn-primary:hover { background: var(--primary-light); }
.btn-ghost {
  background: transparent;
  color: var(--primary);
  border: 1px solid var(--primary);
}
.btn-ghost:hover { background: var(--primary); color: #fff; }
.btn-on-dark.btn-primary { background: #fff; color: var(--primary); }
.btn-on-dark.btn-primary:hover { background: var(--paper-warm); }
.btn-on-dark.btn-ghost { color: #fff; border-color: rgba(255,255,255,0.4); }
.btn-on-dark.btn-ghost:hover { background: rgba(255,255,255,0.08); border-color: #fff; }

.link-primary {
  display: inline-flex; align-items: center; gap: 8px;
  color: var(--primary);
  font-weight: 500;
  padding-bottom: 2px;
  border-bottom: 1px solid transparent;
  transition: border-color .15s ease, color .15s ease;
}
.link-primary:hover { border-bottom-color: var(--accent); color: var(--primary-light); }
.link-primary .arrow { transition: transform .2s var(--ease); }
.link-primary:hover .arrow { transform: translateX(3px); }
.link-primary.on-dark { color: #fff; }
.link-primary.on-dark:hover { border-bottom-color: var(--accent-light); color: var(--accent-light); }

/* ============ SITE ROOT LAYOUT ============ */
/* The theme owns all vertical rhythm via each section's own padding, so the
   top-level template parts (header, main, cta-band, footer) must sit flush.
   WordPress's root flow layout injects a 24px block-gap between .wp-site-blocks
   children; zero it so the sections touch (per design). */
.wp-site-blocks > * { margin-block-start: 0; }

/* The header template part renders inside a <header class="wp-block-template-part">
   wrapper that is only as tall as the header itself, leaving the sticky .header no
   room to travel — so it scrolled away. display:contents drops that wrapper box,
   making .header a flow child of the full-height .wp-site-blocks so sticky works. */
header.wp-block-template-part { display: contents; }

/* ============ HEADER ============ */
.header {
  position: sticky; top: 0; z-index: 50;
  background: rgba(255,255,255,0.92);
  backdrop-filter: saturate(160%) blur(10px);
  -webkit-backdrop-filter: saturate(160%) blur(10px);
  border-bottom: 1px solid var(--rule);
  transition: box-shadow .2s ease;
}
.header.scrolled { box-shadow: 0 1px 12px -6px rgba(15,20,25,0.18); }
.header__inner {
  display: flex; align-items: center; justify-content: space-between;
  height: 72px; gap: 32px;
}
.brand {
  display: inline-flex; align-items: center; gap: 10px;
  font-family: var(--font-display);
  font-weight: 700;
}
.brand__mark {
  width: 28px; height: 28px;
  background: var(--primary); color: #fff;
  display: grid; place-items: center;
  border-radius: 2px;
}
.brand__mark svg { width: 14px; height: 14px; }
.brand__word { font-size: 16px; line-height: 1; color: var(--ink); }
.brand__word small {
  display: block;
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 400;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-soft);
  margin-top: 2px;
}
.brand--logo img {
  display: block;
  height: 46px;
  width: auto;
}
@media (max-width: 640px) {
  .brand--logo img { height: 38px; }
}

.nav { display: none; gap: 2px; align-items: center; }
@media (min-width: 1024px) { .nav { display: flex; } }
.nav__item {
  position: relative;
  display: inline-flex; align-items: center; gap: 6px;
  padding: 10px 14px;
  font-family: var(--font-body);
  font-size: 14px; font-weight: 500;
  color: var(--ink-soft);
  transition: color .15s ease;
}
.nav__item:hover { color: var(--primary); }
.nav__item.is-active { color: var(--primary); }
.nav__item svg.caret { width: 10px; height: 10px; opacity: .6; }
.nav__item.has-dropdown:hover svg.caret { transform: rotate(180deg); }

.dropdown {
  position: absolute; top: calc(100% + 4px); left: 0;
  min-width: 300px;
  background: var(--paper); border: 1px solid var(--rule);
  box-shadow: 0 16px 48px -16px rgba(15,20,25,0.18);
  padding: 8px;
  opacity: 0; transform: translateY(-4px); pointer-events: none;
  transition: opacity .15s ease, transform .15s ease;
}
.has-dropdown:hover .dropdown,
.has-dropdown:focus-within .dropdown {
  opacity: 1; transform: translateY(0); pointer-events: auto;
}
.dropdown a {
  display: block;
  padding: 12px 14px;
  color: var(--ink);
  font-weight: 500;
  border-radius: 2px;
  transition: background-color .12s ease;
}
.dropdown a:hover { background: var(--paper-warm); }
.dropdown a small {
  display: block;
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--ink-soft);
  font-weight: 400;
  letter-spacing: 0.04em;
  margin-top: 2px;
}

.header__cta {
  display: none;
  height: 40px;
  padding: 0 8px 0 16px;
  font-family: var(--font-display);
  font-weight: 500; font-size: 13px;
  color: var(--ink);
  background: transparent;
  border: 1px solid var(--ink);
  border-radius: 2px;
  align-items: center; gap: 14px;
  transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}
@media (min-width: 768px) { .header__cta { display: inline-flex; } }
.header__cta__arrow {
  width: 28px; height: 28px;
  display: inline-grid; place-items: center;
  background: var(--primary);
  color: #fff;
  border-radius: 1px;
  flex-shrink: 0;
  transition: background-color .15s ease, transform .2s var(--ease);
}
.header__cta__arrow svg { width: 12px; height: 12px; }
.header__cta:hover { background: var(--ink); color: #fff; border-color: var(--ink); }
.header__cta:hover .header__cta__arrow { background: var(--accent); }
.header__cta:hover .header__cta__arrow svg { transform: translateX(2px); transition: transform .2s var(--ease); }

.menu-btn {
  display: inline-flex; align-items: center; gap: 8px;
  height: 40px; padding: 0 12px;
  border: 1px solid var(--rule); border-radius: 2px;
  font-size: 13px; font-weight: 500;
}
@media (min-width: 1024px) { .menu-btn { display: none; } }

/* ============ HERO (animated SCADA SVG) ============ */
.hero {
  position: relative;
  background: linear-gradient(180deg, #FBFCFD 0%, #F4F6F9 100%);
  border-bottom: 1px solid var(--rule);
  overflow: hidden;
}
.hero__bg {
  position: absolute; inset: 0;
  z-index: 0;
  background-image:
    linear-gradient(rgba(11,61,145,0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(11,61,145,0.03) 1px, transparent 1px);
  background-size: 48px 48px;
}
.hero__svg {
  position: absolute; inset: 0; z-index: 1;
  width: 100%; height: 100%;
  pointer-events: none;
  opacity: 0.55;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, transparent 45%, rgba(0,0,0,0.4) 60%, rgba(0,0,0,0.9) 75%, #000 88%);
          mask-image: linear-gradient(90deg, transparent 0%, transparent 45%, rgba(0,0,0,0.4) 60%, rgba(0,0,0,0.9) 75%, #000 88%);
}
@media (max-width: 900px) {
  .hero__svg {
    opacity: 0.18;
    -webkit-mask-image: none;
            mask-image: none;
  }
}
.hero__inner {
  position: relative; z-index: 2;
  padding-top: clamp(4rem, 8vw, 7rem);
  padding-bottom: clamp(3rem, 5vw, 4.5rem);
}
.hero__kicker {
  display: flex; flex-wrap: wrap; gap: 14px 24px;
  align-items: center;
  margin-bottom: 32px;
}
.hero__kicker .led {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--accent);
  box-shadow: 0 0 0 3px rgba(33,128,122,0.18);
  display: inline-block;
  margin-right: 6px;
  vertical-align: middle;
}
.hero__h1 {
  max-width: 18ch;
}
.hero__h1 .accent {
  color: var(--accent);
}
.hero__body {
  margin-top: 28px;
  max-width: 56ch;
  font-size: 1.0625rem;
  line-height: 1.6;
  color: var(--ink-soft);
}
.hero__ctas {
  margin-top: 36px;
  display: flex; flex-wrap: wrap; gap: 12px;
}

/* hero stat band below */
.hero__stats {
  position: relative; z-index: 2;
  border-top: 1px solid var(--rule);
  background: rgba(255,255,255,0.6);
  backdrop-filter: blur(6px);
}
.hero__stats-inner {
  display: grid;
  grid-template-columns: 1fr;
  gap: 32px;
  padding-block: 32px;
}
@media (min-width: 768px) {
  .hero__stats-inner { grid-template-columns: 1fr 1fr; gap: 64px; }
}
.stat {
  display: grid; gap: 6px;
}
.stat__num {
  font-family: var(--font-mono);
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 500;
  color: var(--ink);
  line-height: 1;
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
}
.stat__label {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 400;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ink-soft);
  line-height: 1.5;
}

/* hero SVG animations */
@keyframes drift1 { from { transform: translateX(0); } to { transform: translateX(-160px); } }
@keyframes drift2 { from { transform: translateX(0); } to { transform: translateX(120px); } }
@keyframes nodeBlink {
  0%, 92%, 100% { opacity: 1; }
  94% { opacity: 0.3; }
}
.hero__svg .drift-a { animation: drift1 60s linear infinite; }
.hero__svg .drift-b { animation: drift2 80s linear infinite; }
.hero__svg .node-blink { animation: nodeBlink 4s steps(40) infinite; }
.hero__svg .node-blink-2 { animation: nodeBlink 5.2s steps(40) infinite; animation-delay: 1.3s; }
.hero__svg .node-blink-3 { animation: nodeBlink 6.1s steps(40) infinite; animation-delay: 0.6s; }

@keyframes dashFlow { to { stroke-dashoffset: -120; } }
.hero__svg .flow-line {
  stroke-dasharray: 6 8;
  animation: dashFlow 9s linear infinite;
}

/* ============ BREADCRUMB / PAGE HERO ============ */
.page-hero {
  position: relative;
  background: linear-gradient(180deg, #FBFCFD 0%, #F4F6F9 100%);
  border-bottom: 1px solid var(--rule);
  overflow: hidden;
}
.page-hero__bg {
  position: absolute; inset: 0;
  z-index: 0;
  background-image:
    linear-gradient(rgba(11,61,145,0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(11,61,145,0.03) 1px, transparent 1px);
  background-size: 48px 48px;
}
.page-hero__inner {
  position: relative; z-index: 2;
  padding-top: clamp(3rem, 5vw, 4rem);
  padding-bottom: clamp(3rem, 5vw, 4.5rem);
}
.breadcrumb {
  display: flex; align-items: center; gap: 10px;
  margin-bottom: 32px;
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-soft);
}
.breadcrumb a:hover { color: var(--primary); }
.breadcrumb .arrow {
  color: var(--rule-strong);
}
.breadcrumb .current { color: var(--ink); }
/* Current-page crumb rendered from the Post Title block (page.html) */
.breadcrumb .breadcrumb__current { margin: 0; color: var(--ink); font-weight: 400; }

.page-hero__meta {
  display: flex; align-items: center; gap: 16px;
  margin-bottom: 24px;
}

.page-hero__h1 {
  max-width: 22ch;
  margin-bottom: 28px;
}
.page-hero__h1 .accent { color: var(--accent); }
.page-hero__body {
  max-width: 60ch;
  font-size: 1.125rem;
  line-height: 1.6;
  color: var(--ink-soft);
}
.page-hero__body p { margin: 0; }
.page-hero__body p + p, .page-hero__body ul + p, .page-hero__body p + ul { margin-top: 0.9em; }
/* Multi-paragraph hero bodies open with a lede line */
.page-hero__body > p:first-child:not(:only-child) {
  font-size: 1.3125rem;
  color: var(--ink);
  margin-bottom: 1.1em;
}
.page-hero__body ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 8px;
}
.page-hero__body ul li {
  display: grid;
  grid-template-columns: 16px 1fr;
  gap: 10px;
  align-items: start;
}
.page-hero__body ul li::before {
  content: "+";
  color: var(--accent);
  font-family: var(--font-mono);
  font-weight: 500;
  font-size: 15px;
}

.page-hero__nav {
  margin-top: 48px;
  padding-top: 24px;
  border-top: 1px solid var(--rule);
  display: flex; flex-wrap: wrap; gap: 8px 28px;
  font-family: var(--font-mono);
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-soft);
}
.page-hero__nav a {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 4px 0;
  transition: color .15s ease;
}
.page-hero__nav a:hover { color: var(--primary); }
.page-hero__nav a::before {
  content: ""; width: 8px; height: 1px;
  background: var(--accent);
}

/* Page featured image: renders as a mounted print in the hero's open
   grid-paper zone — right of the body on desktop, below it on mobile. */
.page-hero__media {
  margin: 32px 0 0;
  background: #fff;
  border: 1px solid var(--rule);
  padding: 10px;
  box-shadow: 0 24px 48px -32px rgba(15, 20, 25, 0.35);
}
.page-hero__media img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}
@media (min-width: 1024px) {
  .page-hero--has-media .page-hero__inner {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 0.9fr);
    column-gap: clamp(48px, 6vw, 88px);
  }
  .page-hero--has-media .breadcrumb,
  .page-hero--has-media .page-hero__meta,
  .page-hero--has-media .page-hero__h1 { grid-column: 1 / -1; }
  .page-hero--has-media .page-hero__body,
  .page-hero--has-media .page-hero__nav { grid-column: 1; }
  /* Rows 1-3 are breadcrumb/meta/h1; the figure sits beside body + nav */
  .page-hero__media {
    grid-column: 2;
    grid-row: 4 / span 2;
    align-self: end;
    margin-top: 0;
  }
}

/* ============ SECTION HEAD (reusable) ============ */
.sec-head {
  display: grid;
  grid-template-columns: 1fr;
  gap: 24px;
  padding-bottom: 56px;
  border-bottom: 1px solid var(--rule);
  margin-bottom: 64px;
}
@media (min-width: 900px) {
  .sec-head { grid-template-columns: 1.05fr 0.95fr; gap: 80px; align-items: end; }
}
.sec-head__title { display: grid; gap: 16px; }
.sec-head__title .meta { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.sec-head__title h2 { margin-top: 8px; }
.sec-head__copy { color: var(--ink-soft); max-width: 48ch; }
.sec-head__copy p { margin: 0; }
.sec-head__copy p + p { margin-top: 0.9em; }
.sec-head.on-dark { border-bottom-color: rgba(255,255,255,0.12); }
.sec-head.on-dark h2 { color: #fff; }
.sec-head.on-dark .sec-head__copy { color: var(--on-dark-body); }
/* Teal at 12px needs the light step on dark ink to clear 4.5:1. */
.sec-head.on-dark .section-num { color: var(--accent-light); border-top-color: var(--accent-light); }
.kicker.on-dark .acc { color: var(--accent-light); }

/* ============ SERVICES ============ */
.services {
  padding-block: var(--section-y);
  background: var(--paper);
}
.services__grid {
  display: grid;
  grid-template-columns: 1fr;
  border-top: 1px solid var(--ink);
}
@media (min-width: 900px) {
  .services__grid {
    grid-template-columns: repeat(3, 1fr);
  }
}
.service {
  padding: 40px 32px 36px;
  position: relative;
  border-bottom: 1px solid var(--rule);
  background: var(--paper);
  display: flex;
  flex-direction: column;
}
.service > .link-primary { margin-top: auto; align-self: flex-start; }
@media (min-width: 900px) {
  .service { border-right: 1px solid var(--rule); padding-right: 40px; }
  .service:last-child { border-right: 0; padding-right: 0; padding-left: 40px; }
  .service:first-child { padding-left: 0; }
  .service:nth-child(2) { padding-left: 40px; padding-right: 40px; }
}
.service__num {
  font-family: var(--font-mono);
  font-size: 12px;
  color: var(--accent);
  letter-spacing: 0.08em;
  margin-bottom: 28px;
  display: block;
}
.service__icon {
  width: 32px; height: 32px;
  margin-bottom: 24px;
  color: var(--primary);
}
.service__icon svg { width: 100%; height: 100%; }
.service h3 { margin-bottom: 14px; }
.service__desc {
  color: var(--ink-soft);
  font-size: 1rem;
  line-height: 1.6;
  margin-bottom: 24px;
}
.service__bullets {
  list-style: none;
  padding: 0;
  margin: 0 0 28px 0;
  display: grid;
  gap: 10px;
  font-size: 0.9375rem;
  color: var(--ink-soft);
}
.service__bullets li {
  display: grid;
  grid-template-columns: 16px 1fr;
  gap: 10px;
  align-items: start;
  line-height: 1.5;
}
.service__bullets li::before {
  content: "+";
  color: var(--accent);
  font-family: var(--font-mono);
  font-weight: 500;
  font-size: 14px;
  line-height: 1.5;
}

/* ============ INDUSTRIES (dark, duotone) ============ */
.industries {
  padding-block: var(--section-y);
  background: var(--ink);
  color: var(--on-dark-body);
  position: relative;
  overflow: hidden;
}
.industries__bg {
  position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(255,255,255,0.02) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.02) 1px, transparent 1px);
  background-size: 56px 56px;
  pointer-events: none;
}
.industries .container { position: relative; }

.industries__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}
@media (min-width: 768px) {
  .industries__grid {
    grid-template-columns: repeat(5, 1fr);
    gap: 1px;
    background: rgba(255,255,255,0.08);
    border: 1px solid rgba(255,255,255,0.08);
  }
}

.ind {
  position: relative;
  background: var(--primary-deep);
  min-height: 320px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  isolation: isolate;
  transition: transform .3s var(--ease);
}
.ind:hover { z-index: 2; }
/* .ind__img is now a core/image block (figure > img) so editors set it
   from the Media Library. The img fills the card and carries the duotone. */
.ind .ind__img {
  position: absolute; inset: 0;
  margin: 0;
  overflow: hidden;
}
.ind .ind__img img {
  display: block;
  width: 100%; height: 100%;
  object-fit: cover; object-position: center;
  opacity: 0.95;
  /* Pre-duotone contrast spreads the tonal range so low-contrast photos
     (e.g. the bright Hospitals shot) keep visible detail after the map. */
  filter: contrast(1.2) url(#duotone-blue-ink) brightness(0.95) contrast(1.05);
  transition: transform .8s var(--ease);
}
.ind:hover .ind__img img { transform: scale(1.04); }
.ind__overlay {
  position: absolute; inset: 0;
  background:
    linear-gradient(180deg, rgba(9,52,121,0.55) 0%, rgba(15,20,25,0.55) 60%, rgba(15,20,25,0.92) 100%);
  pointer-events: none;
}
.ind__content {
  position: relative; z-index: 2;
  padding: 24px 22px 22px;
  display: flex; flex-direction: column; justify-content: space-between;
  flex: 1;
}
.ind__top {
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: 8px;
}
.ind__num {
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--on-dark-mute);
  letter-spacing: 0.1em;
}
.pill {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 8px;
  border-radius: 2px;
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  white-space: nowrap;
}
.pill--active {
  color: #fff;
  border: 1px solid var(--primary-light);
  background: rgba(30,91,198,0.18);
}
.pill--active::before {
  content: "";
  width: 5px; height: 5px; border-radius: 50%;
  background: var(--primary-light);
}
.pill--emerging {
  color: var(--accent-light);
  border: 1px solid var(--accent);
  background: rgba(33,128,122,0.12);
}
.pill--emerging::before {
  content: "";
  width: 5px; height: 5px; border-radius: 50%;
  background: var(--accent-light);
  animation: pulse 2.2s ease-in-out infinite;
}
@keyframes pulse {
  0%, 100% { transform: scale(1); opacity: 1; }
  50% { transform: scale(1.4); opacity: 0.5; }
}

.ind__name {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: 1.375rem;
  color: #fff;
  letter-spacing: -0.01em;
  line-height: 1.15;
}
.ind__meta {
  font-family: var(--font-mono);
  font-size: 10px;
  color: var(--on-dark-mute);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin-top: 6px;
}

/* emerging treatment — keeps the teal duotone so the card still reads as
   distinct, but brightness/opacity are tuned up so the photo stays plainly
   legible (the Hospitals shot was crushed to near-black by the old 0.7/0.55). */
.ind--emerging .ind__img {
  filter: url(#duotone-teal-ink) brightness(0.95) contrast(1.05) saturate(0.9);
  opacity: 0.92;
}
.ind--emerging .ind__overlay {
  background: linear-gradient(180deg, rgba(15,20,25,0.32) 0%, rgba(15,20,25,0.58) 55%, rgba(15,20,25,0.92) 100%);
}

/* ============ FEATURED PROJECT (editorial spread) ============ */
.feature {
  padding-block: var(--section-y);
  background: var(--paper);
  position: relative;
  overflow: hidden;
}
.feature__kicker {
  display: flex; flex-wrap: wrap; align-items: center; gap: 16px 28px;
  padding-bottom: 24px;
  border-bottom: 1px solid var(--ink);
  margin-bottom: 40px;
}
.feature__kicker-meta {
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px;
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--ink-soft);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-left: auto;
}
.feature__kicker-meta strong { color: var(--ink); font-weight: 500; }
.feature__kicker-meta .sep { color: var(--rule-strong); }

.feature__display {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: clamp(2.25rem, 5.2vw, 4.25rem);
  line-height: 1.02;
  letter-spacing: -0.03em;
  text-wrap: balance;
  margin-bottom: 64px;
  max-width: 22ch;
}
.feature__display em {
  font-style: italic;
  color: var(--accent);
  font-weight: 500;
}

/* primary editorial split */
.feature__split {
  display: grid;
  grid-template-columns: 1fr;
  gap: 32px;
  margin-bottom: 56px;
}
@media (min-width: 900px) {
  .feature__split {
    grid-template-columns: 1.55fr 1fr;
    gap: 48px;
    align-items: stretch;
  }
}

/* contained schematic */
.feature__schematic {
  position: relative;
  width: 100%;
  background: var(--ink);
  aspect-ratio: 16 / 10;
  overflow: hidden;
  border: 1px solid var(--ink);
}
.feature__schematic svg.plan {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
}
.feature__schematic-stamp {
  position: absolute;
  top: 20px; left: 24px;
  display: flex; align-items: center; gap: 10px;
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--on-dark-body);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  z-index: 3;
}
.feature__schematic-stamp .led {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--accent-light);
  box-shadow: 0 0 0 4px rgba(33,128,122,0.25);
}
.feature__schematic-tag {
  position: absolute;
  top: 20px; right: 24px;
  z-index: 3;
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--on-dark-body);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.feature__schematic-caption {
  position: absolute;
  bottom: 16px; left: 24px; right: 24px;
  display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px;
  font-family: var(--font-mono);
  font-size: 10px;
  color: var(--on-dark-body);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-shadow: 0 1px 3px rgba(0,0,0,0.6); /* legible over editor-chosen photos */
  z-index: 3;
}
/* draw-in animation */
.feature__schematic .draw-path {
  stroke-dasharray: 1200;
  stroke-dashoffset: 1200;
  transition: stroke-dashoffset 1200ms cubic-bezier(.55,.05,.25,1);
}
.feature__schematic.is-in .draw-path { stroke-dashoffset: 0; }
.feature__schematic .fade-in {
  opacity: 0;
  transition: opacity 600ms ease 800ms;
}
.feature__schematic.is-in .fade-in { opacity: 1; }

/* project sheet */
.feature__sheet {
  display: grid;
  grid-template-rows: auto 1fr;
  background: var(--paper-warm);
  border: 1px solid var(--rule);
  padding: 28px 28px 24px;
  position: relative;
}
.feature__sheet::before {
  content: "";
  position: absolute;
  top: -1px; left: -1px;
  width: 18px; height: 18px;
  border-top: 2px solid var(--accent);
  border-left: 2px solid var(--accent);
}
.feature__sheet-head {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px;
  padding-bottom: 16px;
  margin-bottom: 18px;
  border-bottom: 1px solid var(--rule);
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-soft);
}
.feature__sheet-head .title { color: var(--ink); font-weight: 500; }
.feature__sheet-rows {
  display: grid;
  gap: 0;
}
.feature__sheet-row {
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: 16px;
  padding: 14px 0;
  border-bottom: 1px dashed var(--rule);
  align-items: baseline;
}
.feature__sheet-row:last-child { border-bottom: 0; }
/* dt/dd = dynamic [acri_project_detail]; .sheet-label/.sheet-value = editable block version */
.feature__sheet-row dt,
.feature__sheet-row .sheet-label {
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--ink-soft);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin: 0;
}
.feature__sheet-row dd,
.feature__sheet-row .sheet-value {
  font-family: var(--font-mono);
  font-size: 14px;
  color: var(--ink);
  margin: 0;
  font-variant-numeric: tabular-nums;
  line-height: 1.4;
}

/* outcomes band */
.feature__outcomes {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1px;
  background: var(--rule);
  border: 1px solid var(--rule);
  margin-bottom: 64px;
}
@media (min-width: 768px) {
  .feature__outcomes { grid-template-columns: repeat(4, 1fr); }
}
.outcome {
  background: var(--paper);
  padding: 28px 24px 24px;
  position: relative;
}
.outcome::before {
  content: "";
  position: absolute;
  top: 0; left: 0; width: 24px; height: 1px;
  background: var(--accent);
}
.outcome__num {
  font-family: var(--font-mono);
  font-weight: 500;
  font-size: clamp(1.75rem, 3.2vw, 2.5rem);
  line-height: 1;
  color: var(--ink);
  letter-spacing: -0.02em;
  margin-bottom: 12px;
  font-variant-numeric: tabular-nums;
}
.outcome__label {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-soft);
  line-height: 1.5;
  max-width: 22ch;
}

/* body copy */
.feature__body {
  display: grid;
  grid-template-columns: 1fr;
  gap: 48px;
  align-items: start;
}
@media (min-width: 900px) {
  .feature__body {
    grid-template-columns: 1.1fr 1fr;
    gap: 80px;
  }
}
.feature__body-headline {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: 1.5rem;
  line-height: 1.3;
  letter-spacing: -0.01em;
  max-width: 22ch;
}
.feature__body-text p {
  font-size: 1.0625rem;
  line-height: 1.65;
  color: var(--ink-soft);
  max-width: 56ch;
  margin: 0;
}
.feature__body-text p + p { margin-top: 18px; }
/* Project pages: client-authored long-form summary reads as one prose column
   (h4 subheads, lists) instead of the split editorial layout. */
.feature__body--prose { display: block; }
.feature__body--prose .feature__body-headline { margin-bottom: 24px; }
.feature__body-text > * + p,
.feature__body-text > * + ul,
.feature__body-text > * + ol,
.feature__body-text > * + h4 { margin-top: 1.05em; }
.feature__body-text > h4:not(:first-child) { margin-top: 2.2em; }
.feature__body-text h4 {
  font-size: 1.0625rem;
  font-weight: 600;
  color: var(--ink);
  line-height: 1.3;
}
.feature__body-text ul, .feature__body-text ol {
  margin: 0;
  padding-left: 1.25em;
  font-size: 1.0625rem;
  line-height: 1.65;
  color: var(--ink-soft);
  max-width: 56ch;
}
.feature__body-text li { margin-top: 0.4em; }
.feature__body-text li::marker { color: var(--accent); }
.feature__body-text strong { color: var(--ink); }
.feature__cta { margin-top: 28px; }

/* ============ LOGO WALL ============ */
.logos {
  padding-block: var(--section-y);
  background: var(--paper-warm);
  border-top: 1px solid var(--rule);
  border-bottom: 1px solid var(--rule);
}
.logos__head {
  display: flex; align-items: end; justify-content: space-between;
  gap: 32px; flex-wrap: wrap;
  margin-bottom: 48px;
  padding-bottom: 24px;
  border-bottom: 1px solid var(--rule);
}
.logos__head-l { display: grid; gap: 14px; }
.logos__head-l h2 { font-size: clamp(1.5rem, 2.4vw, 2rem); font-weight: 500; }
.logos__counts {
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--ink-soft);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  display: flex; flex-wrap: wrap; gap: 20px;
}
.logos__counts strong { color: var(--ink); font-weight: 500; }

.logos__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1px;
  background: var(--rule);
  border: 1px solid var(--rule);
}
@media (min-width: 640px) { .logos__grid { grid-template-columns: repeat(4, 1fr); } }

.logo-cell {
  background: var(--paper);
  padding: 28px 22px 22px;
  aspect-ratio: 5/3;
  display: flex; flex-direction: column; justify-content: space-between;
  transition: background-color .18s ease;
  opacity: 0.6;
  filter: grayscale(1);
}
.logo-cell:hover { opacity: 1; filter: none; background: var(--paper-warm); }
.logo-cell__lockup {
  display: flex; align-items: center; gap: 12px;
}
.logo-cell__mark {
  width: 28px; height: 28px;
  color: var(--ink);
  flex-shrink: 0;
}
.logo-cell__mark svg { width: 100%; height: 100%; }
.logo-cell__name {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 15px;
  line-height: 1.1;
  color: var(--ink);
  letter-spacing: -0.005em;
}
.logo-cell__caption {
  font-family: var(--font-mono);
  font-size: 10px;
  color: var(--ink-soft);
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

/* ============ ABOUT (dark) ============ */
.about {
  padding-block: var(--section-y);
  background: var(--ink);
  color: var(--on-dark-body);
  position: relative;
  overflow: hidden;
}
.about__bg {
  position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(255,255,255,0.02) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.02) 1px, transparent 1px);
  background-size: 64px 64px;
  pointer-events: none;
}
.about .container { position: relative; }

.about__grid {
  display: grid; grid-template-columns: 1fr; gap: 64px;
}
@media (min-width: 1024px) {
  .about__grid { grid-template-columns: 1fr 1fr; gap: 96px; align-items: start; }
}
.about__h {
  margin-top: 24px;
  margin-bottom: 24px;
  color: #fff;
}
.about__copy p { color: var(--on-dark-body); max-width: 60ch; font-size: 1.0625rem; line-height: 1.65; }
.about__copy p + p { margin-top: 16px; }
.about__cta { margin-top: 32px; }

.team {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px 32px;
}
@media (max-width: 480px) { .team { grid-template-columns: 1fr; } }
.team__card { display: grid; gap: 12px; align-content: start; }
.team__card p { margin: 0; }
.team__block {
  width: 90px; height: 90px;
  background: var(--primary);
  color: #fff;
  display: grid; place-items: center;
  font-family: var(--font-display);
  font-weight: 600;
  font-size: 24px;
  letter-spacing: -0.01em;
  border-radius: 2px;
  position: relative;
}
.team__block::after {
  content: "";
  position: absolute;
  top: 0; right: 0; width: 12px; height: 1px;
  background: var(--accent);
}
.team__city {
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--on-dark-mute);
}
.team__name {
  font-family: var(--font-body);
  font-weight: 500;
  color: #fff;
  font-size: 15px;
}
.team__role {
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--on-dark-mute);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.team__edu {
  font-size: 12.5px;
  color: var(--on-dark-mute);
  line-height: 1.5;
  max-width: 36ch;
}
/* About-page team grid only (home teaser nests .team inside .about__grid):
   the first member — the President — gets a centered full-width row. */
.about > .container > .team > .team__card:first-child {
  grid-column: 1 / -1;
  justify-items: center;
  text-align: center;
  padding-bottom: 24px;
  margin-bottom: 8px;
  border-bottom: 1px solid rgba(255,255,255,0.1);
}

/* ============ SERVICE PILLARS (large cards) ============ */
.pillars {
  padding-block: var(--section-y);
  background: var(--paper);
}
.pillars__list {
  display: grid; gap: 1px;
  background: var(--rule);
  border: 1px solid var(--rule);
  border-top: 1px solid var(--ink);
}

.pillar {
  display: grid;
  grid-template-columns: 1fr;
  background: var(--paper);
  padding: 48px 32px;
  gap: 32px;
  position: relative;
  transition: background-color .25s ease;
}
@media (min-width: 900px) {
  .pillar {
    grid-template-columns: minmax(120px, 0.4fr) 1.4fr 1fr;
    padding: 56px 40px;
    gap: 56px;
    align-items: start;
  }
}
.pillar:hover { background: var(--paper-warm); }

.pillar__left {
  display: flex; flex-direction: column; gap: 20px;
}
.pillar__num {
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 500;
  color: var(--accent);
  letter-spacing: 0.08em;
  padding-top: 6px;
  border-top: 1px solid var(--accent);
  display: inline-block;
  align-self: flex-start;
}
.pillar__icon {
  width: 48px; height: 48px;
  color: var(--primary);
}
.pillar__icon svg { width: 100%; height: 100%; }

.pillar__main { display: grid; gap: 18px; }
.pillar__main h3 {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: clamp(1.625rem, 2.6vw, 2rem);
  line-height: 1.15;
  letter-spacing: -0.02em;
}
.pillar__lead {
  font-size: 1.0625rem;
  line-height: 1.6;
  color: var(--ink-soft);
  max-width: 52ch;
}
.pillar__cta {
  margin-top: 10px;
  display: flex; flex-wrap: wrap; align-items: center; gap: 20px;
}
.pillar__cta .mono-tag {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-mute);
}

.pillar__bullets {
  display: grid; gap: 14px;
  align-content: start;
  border-left: 1px solid var(--rule);
  padding-left: 32px;
}
.pillar__bullets h4 {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-mute);
  margin-bottom: 4px;
}
.pillar__bullets ul {
  list-style: none;
  padding: 0; margin: 0;
  display: grid; gap: 12px;
}
.pillar__bullets li {
  display: grid;
  grid-template-columns: 18px 1fr;
  gap: 12px;
  font-size: 0.9375rem;
  color: var(--ink-soft);
  line-height: 1.5;
}
.pillar__bullets li::before {
  content: "+";
  color: var(--accent);
  font-family: var(--font-mono);
  font-weight: 500;
  font-size: 14px;
}

/* ============ PROCESS (dark) ============ */
.process {
  padding-block: var(--section-y);
  background: var(--ink);
  color: var(--on-dark-body);
  position: relative;
  overflow: hidden;
}
.process__bg {
  position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(255,255,255,0.02) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.02) 1px, transparent 1px);
  background-size: 56px 56px;
  pointer-events: none;
}
.process .container { position: relative; }

.process__steps {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1px;
  background: rgba(255,255,255,0.1);
  border: 1px solid rgba(255,255,255,0.1);
}
@media (min-width: 768px) {
  .process__steps { grid-template-columns: repeat(4, 1fr); }
}
.step {
  padding: 32px 28px 28px;
  background: var(--ink);
  position: relative;
  min-height: 240px;
  display: flex; flex-direction: column; justify-content: space-between;
}
.step__num {
  font-family: var(--font-mono);
  font-size: 12px;
  color: var(--accent-light);
  letter-spacing: 0.08em;
  padding-top: 6px;
  border-top: 1px solid var(--accent);
  display: inline-block;
  align-self: flex-start;
  margin-bottom: 20px;
}
.step__name {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: 1.25rem;
  color: #fff;
  margin-bottom: 12px;
  letter-spacing: -0.015em;
}
.step__body {
  color: var(--on-dark-body);
  font-size: 0.9375rem;
  line-height: 1.55;
}
.step__deliverable {
  margin-top: 24px;
  padding-top: 16px;
  border-top: 1px solid rgba(255,255,255,0.1);
  font-family: var(--font-mono);
  font-size: 10px;
  color: var(--on-dark-mute);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  line-height: 1.5;
}

/* ---- Process "circle graph" layout (layout: circle, 4 steps) ---- */
.process__cycle {
  display: grid;
  grid-template-columns: minmax(0, 1fr) clamp(220px, 26vw, 320px) minmax(0, 1fr);
  grid-template-areas:
    ".  n  ."
    "w  c  e"
    ".  s  .";
  align-items: center;
  justify-items: center;
  gap: clamp(20px, 3vw, 40px);
  max-width: 980px;
  margin-inline: auto;
}
.process__ring { grid-area: c; width: 100%; height: auto; }
.step--cyc {
  background: none;
  padding: 0;
  min-height: 0;
  max-width: 300px;
}
.step--cyc-1 { grid-area: n; text-align: center; }
.step--cyc-2 { grid-area: e; justify-self: start; }
.step--cyc-3 { grid-area: s; text-align: center; }
.step--cyc-4 { grid-area: w; justify-self: end; text-align: right; }
.step--cyc-1 .step__num, .step--cyc-3 .step__num { align-self: center; }
.step--cyc-4 .step__num { align-self: flex-end; }
.step--cyc .step__deliverable { margin-top: 16px; }
@media (max-width: 767px) {
  .process__cycle {
    grid-template-columns: 1fr;
    grid-template-areas: "n" "e" "s" "w";
    justify-items: start;
    gap: 32px;
  }
  .process__ring { display: none; }
  .step--cyc, .step--cyc-1, .step--cyc-3, .step--cyc-4 { text-align: left; justify-self: start; max-width: 60ch; }
  .step--cyc-1 .step__num, .step--cyc-3 .step__num, .step--cyc-4 .step__num { align-self: flex-start; }
}

/* ============ ENGAGEMENT MODELS ============ */
.models {
  padding-block: var(--section-y);
  background: var(--paper-warm);
  border-top: 1px solid var(--rule);
  border-bottom: 1px solid var(--rule);
}
.models__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1px;
  background: var(--rule);
  border: 1px solid var(--rule);
}
@media (min-width: 900px) {
  .models__grid { grid-template-columns: repeat(3, 1fr); }
}
.model {
  background: var(--paper);
  padding: 36px 28px 32px;
  display: flex; flex-direction: column;
}
.model__tag {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 10px;
  align-self: flex-start;
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink);
  border: 1px solid var(--rule);
  background: var(--paper-warm);
  border-radius: 2px;
  margin-bottom: 24px;
}
.model__tag::before {
  content: ""; width: 5px; height: 5px;
  background: var(--accent);
}
.model__name {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: 1.375rem;
  letter-spacing: -0.015em;
  line-height: 1.2;
  margin-bottom: 12px;
}
.model__desc {
  color: var(--ink-soft);
  font-size: 0.9375rem;
  line-height: 1.55;
  margin-bottom: 28px;
  flex: 1;
}
.model__meta {
  display: grid; gap: 0;
  border-top: 1px solid var(--rule);
}
.model__meta-row {
  display: flex; justify-content: space-between;
  padding: 12px 0;
  border-bottom: 1px dashed var(--rule);
  font-family: var(--font-mono);
  font-size: 12px;
}
.model__meta-row:last-child { border-bottom: 0; }
.model__meta-row dt,
.model__meta-row .sheet-label {
  color: var(--ink-mute);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  font-size: 10px;
}
.model__meta-row dd,
.model__meta-row .sheet-value {
  margin: 0;
  color: var(--ink);
  font-variant-numeric: tabular-nums;
}

/* ============ CONTACT ============ */
.contact {
  padding-block: clamp(3rem, 5vw, 5rem);
  border-bottom: 1px solid var(--rule);
}
.contact__grid {
  display: grid;
  gap: clamp(2.5rem, 5vw, 5rem);
  align-items: start;
}
@media (min-width: 920px) {
  .contact__grid { grid-template-columns: 1.4fr 1fr; }
}

.form {
  display: grid;
  gap: 22px;
}
.form__row {
  display: grid;
  gap: 22px;
}
@media (min-width: 560px) {
  .form__row--2 { grid-template-columns: 1fr 1fr; }
}
.field { display: grid; gap: 8px; }
.field__label {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-mute);
}
.field__label .req { color: var(--accent); }
.field input,
.field textarea {
  width: 100%;
  font-family: var(--font-body);
  font-size: 1rem;
  color: var(--ink);
  background: var(--paper);
  border: 1px solid var(--ink-mute); /* >=3:1 boundary (SC 1.4.11) */
  border-radius: 0;
  padding: 14px 16px;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.field input::placeholder,
.field textarea::placeholder { color: var(--ink-mute); }
.field input:focus,
.field textarea:focus {
  outline: none;
  border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(30,91,198,0.35);
}
.field textarea { resize: vertical; min-height: 130px; line-height: 1.6; }
.form__actions {
  display: flex; align-items: center; gap: 20px; flex-wrap: wrap;
  margin-top: 4px;
}
.form__note {
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--ink-mute);
  max-width: 30ch;
  line-height: 1.6;
}
.form__success {
  display: none;
  border: 1px solid var(--primary);
  background: rgba(30,91,198,0.06);
  padding: 18px 20px;
  font-size: 0.95rem;
  color: var(--ink);
}
.form__success.show { display: block; }

/* contact aside */
.contact__aside { display: grid; gap: 36px; }
.contact-block__label {
  font-family: var(--font-mono);
  font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--ink-mute);
  padding-bottom: 12px; margin-bottom: 20px;
  border-bottom: 1px solid var(--rule);
}
.offices { display: grid; gap: 4px; }
.office {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  padding: 16px 0;
  border-bottom: 1px solid var(--rule);
}
.office--hq { padding-top: 0; }
.office__city {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: 1.0625rem;
  color: var(--ink);
}
.office__tag {
  font-family: var(--font-mono);
  font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--accent);
  border: 1px solid var(--rule-strong);
  padding: 3px 7px;
  align-self: center;
}
.office__addr {
  flex-basis: 100%;
  font-size: 0.9375rem;
  color: var(--ink-soft);
  line-height: 1.6;
}
.contact-direct { display: grid; gap: 10px; }
.contact-direct a {
  display: flex; align-items: center; gap: 12px;
  font-family: var(--font-mono);
  font-size: 0.9375rem;
  color: var(--ink);
}
.contact-direct a:hover { color: var(--primary); }
.contact-direct .dot {
  width: 6px; height: 6px; flex: none; background: var(--accent);
}

/* ============ INDUSTRY DETAIL ROWS ============ */
.ind-detail {
  padding-block: clamp(3.5rem, 6vw, 6rem);
  border-bottom: 1px solid var(--rule);
}
.ind-detail:nth-of-type(even) { background: var(--paper-warm); }
.ind-detail__grid {
  display: grid;
  gap: clamp(2rem, 4vw, 4.5rem);
  align-items: center;
}
@media (min-width: 880px) {
  .ind-detail__grid { grid-template-columns: 1.05fr 1fr; }
  .ind-detail--flip .ind-detail__media { order: -1; }
}
.ind-detail__head {
  display: flex; align-items: center; gap: 16px;
  margin-bottom: 22px;
}
.ind-detail__name {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: clamp(1.9rem, 3.4vw, 2.75rem);
  line-height: 1.05;
  letter-spacing: -0.01em;
  margin-bottom: 14px;
}
.ind-detail__lead {
  font-size: 1.0625rem;
  line-height: 1.7;
  color: var(--ink-soft);
  max-width: 52ch;
  margin-bottom: 28px;
}
.ind-detail__sub {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-mute);
  margin-bottom: 12px;
}
.ind-detail__list {
  list-style: none; padding: 0; margin: 0 0 28px 0;
  display: grid; gap: 0;
  border-top: 1px solid var(--rule);
}
.ind-detail__list li {
  display: flex; align-items: baseline; gap: 12px;
  padding: 11px 0;
  border-bottom: 1px solid var(--rule);
  font-size: 0.95rem;
  color: var(--ink);
}
.ind-detail__list li::before {
  content: ""; flex: none;
  width: 6px; height: 6px; margin-top: 7px;
  background: var(--accent);
}
.ind-detail__media {
  position: relative;
  aspect-ratio: 4 / 3.1;
  overflow: hidden;
  border: 1px solid var(--rule);
  background: var(--ink);
}
/* .ind-detail__img is a core/image block (figure > img) — Media-Library editable. */
.ind-detail__img {
  position: absolute; inset: 0;
  margin: 0;
  overflow: hidden;
}
.ind-detail__img img {
  display: block;
  width: 100%; height: 100%;
  object-fit: cover; object-position: center;
  filter: grayscale(0.32) contrast(1.04);
  transition: transform .9s var(--ease);
}
.ind-detail:hover .ind-detail__img img { transform: scale(1.04); }
.ind-detail__media-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(160deg, rgba(11,22,38,0.04) 0%, rgba(11,22,38,0.42) 100%);
}
.ind-detail__tag {
  position: absolute; left: 16px; bottom: 16px;
  display: flex; align-items: center; gap: 10px;
  font-family: var(--font-mono);
  font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase;
  color: #fff;
  background: var(--ink);
  border: 1px solid rgba(255,255,255,0.25);
  padding: 7px 12px;
}

/* ============ INDUSTRIES STRIP ============ */
.ind-strip {
  padding-block: clamp(4rem, 7vw, 6rem);
  background: var(--paper);
}
.ind-strip__head {
  display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between;
  gap: 24px;
  padding-bottom: 32px;
  border-bottom: 1px solid var(--rule);
  margin-bottom: 40px;
}
.ind-strip__head h2 {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: clamp(1.5rem, 2.4vw, 2rem);
  letter-spacing: -0.015em;
  line-height: 1.2;
  margin-top: 12px;
}
.ind-strip__head .copy {
  color: var(--ink-soft);
  max-width: 42ch;
  font-size: 0.9375rem;
  line-height: 1.55;
}
.ind-strip__row {
  display: grid; gap: 12px;
  grid-template-columns: repeat(2, 1fr);
}
@media (min-width: 640px) { .ind-strip__row { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 900px) { .ind-strip__row { grid-template-columns: repeat(5, 1fr); } }

.ind-chip {
  border: 1px solid var(--rule);
  background: var(--paper);
  padding: 18px 18px 16px;
  display: flex; flex-direction: column; justify-content: space-between;
  min-height: 130px;
  transition: border-color .15s ease, background-color .15s ease;
}
.ind-chip:hover { border-color: var(--ink); background: var(--paper-warm); }
.ind-chip__top {
  display: flex; align-items: center; justify-content: space-between;
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ink-mute);
}
.ind-chip__name {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: 1.0625rem;
  letter-spacing: -0.01em;
  color: var(--ink);
  margin-top: 8px;
}
.ind-chip__meta {
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-mute);
  margin-top: 2px;
}
.ind-chip .pill {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 2px 6px;
  border-radius: 2px;
  font-family: var(--font-mono);
  font-size: 9px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-weight: 500;
}

/* ============ CTA BAND ============ */
.cta-band {
  background: var(--primary-deep);
  color: #fff;
  position: relative;
  overflow: hidden;
  padding-block: clamp(4rem, 8vw, 6rem);
  border-top: 1px solid var(--accent);
}
.cta-band__topo {
  position: absolute; inset: 0;
  opacity: 0.06;
  pointer-events: none;
}
.cta-band__topo svg { width: 100%; height: 100%; }
.cta-band__inner {
  position: relative;
  display: grid; gap: 32px; align-items: end;
  grid-template-columns: 1fr;
}
@media (min-width: 900px) {
  .cta-band__inner { grid-template-columns: 1.4fr 1fr; gap: 64px; }
}
.cta-band h2 { color: #fff; margin-top: 16px; }
.cta-band p {
  margin-top: 18px;
  color: var(--on-dark-body);
  max-width: 50ch;
  font-size: 1.0625rem;
  line-height: 1.6;
}
.cta-band__actions {
  display: flex; flex-wrap: wrap; align-items: center; gap: 20px;
}
@media (min-width: 900px) {
  .cta-band__actions { justify-content: flex-end; }
}
.cta-band__phone {
  font-family: var(--font-mono);
  font-size: 15px;
  color: #fff;
  border-bottom: 1px solid transparent;
  transition: border-color .15s ease;
}
.cta-band__phone:hover { border-bottom-color: var(--accent-light); }

/* ============ FOOTER ============ */
.footer {
  background: var(--ink);
  color: var(--on-dark-body);
  padding-block: 80px 32px;
}
.footer__grid {
  display: grid; grid-template-columns: 1fr; gap: 48px;
}
@media (min-width: 768px) {
  .footer__grid { grid-template-columns: 1.4fr 1fr 1fr 1.1fr; gap: 56px; }
}
/* Desktop: Company's link labels are short, so an even 1fr track left a dead gap
   before Contact. Widen Services (long labels) and narrow Company so column 3
   sits closer to Contact and the row reads balanced. */
@media (min-width: 1024px) {
  .footer__grid { grid-template-columns: 1.4fr 1.35fr 0.65fr 1.1fr; }
}
/* The supplied logo PNG is opaque black; screen-blend drops the black box
   into the footer ink so only the white artwork shows. */
.footer__logo { display: block; width: 216px; max-width: 100%; height: auto; mix-blend-mode: screen; }
.footer__about {
  margin-top: 22px;
  font-size: 14px;
  color: var(--on-dark-mute);
  max-width: 42ch;
  line-height: 1.65;
}
.footer__col h4 {
  font-family: var(--font-mono);
  font-size: 11px; font-weight: 500;
  letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--on-dark-mute);
  margin: 0 0 20px 0;
}
.footer__col ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 12px; font-size: 14px; }
.footer__col a { color: var(--on-dark-body); transition: color .15s ease; display: inline-block; padding-block: 4px; }
.footer__col a:hover { color: #fff; }
/* Services/Company columns are core/navigation blocks (editable in the Site Editor).
   Core forces nav links to color:inherit via a (0,3,0) selector, so match the original
   footer link color + hover with a higher-specificity rule. */
.footer .footer__col .wp-block-navigation .wp-block-navigation-item__content { color: var(--on-dark-body); display: inline-block; padding-block: 4px; }
.footer .footer__col .wp-block-navigation .wp-block-navigation-item__content:hover,
.footer .footer__col .wp-block-navigation .wp-block-navigation-item__content:focus { color: #fff; }
.footer__offices {
  display: grid; gap: 14px;
  font-size: 14px;
  color: var(--on-dark-body);
}
.footer__office { display: grid; gap: 2px; }
.footer__office-city {
  font-family: var(--font-mono);
  font-size: 10px;
  color: var(--on-dark-mute);
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.footer__contact-links {
  margin-bottom: 18px;
  font-family: var(--font-mono);
  font-size: 12px;
  line-height: 1.7;
}
.footer__contact-links a {
  color: var(--on-dark-body);
  border-bottom: 1px solid rgba(255,255,255,0.18);
}
.footer__contact-links a:hover { border-color: var(--accent-light); }
.footer__locator {
  margin-top: 64px; padding-top: 24px;
  border-top: 1px solid rgba(255,255,255,0.1);
  text-align: center;
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.12em;
  color: var(--on-dark-mute);
  text-transform: uppercase;
}
.footer__locator .sep { color: rgba(255,255,255,0.2); margin: 0 12px; }
.footer__locator a { color: inherit; transition: color .15s ease; }
.footer__locator a:hover,
.footer__locator a:focus-visible { color: var(--on-dark-strong); text-decoration: underline; text-underline-offset: 3px; }
.footer__copyright {
  margin-top: 18px;
  text-align: center;
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--on-dark-mute);
  letter-spacing: 0.06em;
}

/* ============ REVEAL ============ */
/* Hidden start states are gated on html.js (set by an inline head script) so
   content stays visible when JS is unavailable. */
.js .reveal {
  opacity: 0; transform: translateY(32px);
  transition: opacity 600ms ease, transform 600ms ease;
}
.reveal.in { opacity: 1; transform: translateY(0); }
.reveal[data-d="1"] { transition-delay: 80ms; }
.reveal[data-d="2"] { transition-delay: 160ms; }
.reveal[data-d="3"] { transition-delay: 240ms; }
.reveal[data-d="4"] { transition-delay: 320ms; }

.js .reveal-stagger > * {
  opacity: 0; transform: translateY(20px);
  transition: opacity 500ms ease, transform 500ms ease;
}
.reveal-stagger.in > *:nth-child(1) { opacity: 1; transform: translateY(0); transition-delay: 0ms; }
.reveal-stagger.in > *:nth-child(2) { opacity: 1; transform: translateY(0); transition-delay: 80ms; }
.reveal-stagger.in > *:nth-child(3) { opacity: 1; transform: translateY(0); transition-delay: 160ms; }
.reveal-stagger.in > *:nth-child(4) { opacity: 1; transform: translateY(0); transition-delay: 240ms; }
.reveal-stagger.in > *:nth-child(5) { opacity: 1; transform: translateY(0); transition-delay: 320ms; }
.reveal-stagger.in > *:nth-child(6) { opacity: 1; transform: translateY(0); transition-delay: 400ms; }
.reveal-stagger.in > *:nth-child(7) { opacity: 1; transform: translateY(0); transition-delay: 480ms; }
.reveal-stagger.in > *:nth-child(8) { opacity: 1; transform: translateY(0); transition-delay: 560ms; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
  }
  .reveal, .reveal-stagger > *,
  .js .reveal, .js .reveal-stagger > * { opacity: 1; transform: none; }
  .feature__schematic .draw-path { stroke-dashoffset: 0; }
  .feature__schematic .fade-in { opacity: 1; }
}

::selection { background: var(--primary); color: #fff; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }

/* ============ WP-MANAGED PRIMARY NAV (core/navigation styled to ACRI design) ============ */
.header .header__inner { gap: 32px; }
.header .wp-block-navigation { font-family: var(--font-body); flex: 0 1 auto; }
.header .wp-block-navigation > .wp-block-navigation__container { gap: 2px; align-items: center; }
.header .wp-block-navigation .wp-block-navigation-item__content {
  padding: 10px 14px;
  font-size: 14px;
  font-weight: 500;
  color: var(--ink-soft);
  transition: color .15s ease;
}
.header .wp-block-navigation .wp-block-navigation-item__content:hover,
.header .wp-block-navigation .wp-block-navigation-item.current-menu-item > .wp-block-navigation-item__content,
.header .wp-block-navigation .wp-block-navigation-item.current-menu-ancestor > .wp-block-navigation-item__content {
  color: var(--primary);
}
.header .wp-block-navigation .wp-block-navigation-submenu__toggle { padding: 0 0 0 4px; color: var(--ink-mute); }
.header .wp-block-navigation .wp-block-navigation__submenu-icon svg { width: 10px; height: 10px; }

/* dropdown panel */
.header .wp-block-navigation .wp-block-navigation__submenu-container {
  width: 360px !important;
  min-width: 360px !important;
  max-width: 360px !important;
  background: var(--paper);
  border: 1px solid var(--rule);
  box-shadow: 0 16px 48px -16px rgba(15,20,25,0.18);
  padding: 8px;
  gap: 0;
  border-radius: 2px;
}
.header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item { width: 100%; }
.header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 3px;
  width: 100%;
  padding: 12px 14px;
  color: var(--ink);
  font-weight: 500;
  border-radius: 2px;
}
.header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__label { display: block; }
.header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover {
  background: var(--paper-warm);
  color: var(--ink);
}
.header .wp-block-navigation .wp-block-navigation-item__description {
  display: block;
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--ink-soft);
  font-weight: 400;
  letter-spacing: 0.04em;
  margin-top: 2px;
}

/* mobile overlay toggle */
.header .wp-block-navigation__responsive-container-open,
.header .wp-block-navigation__responsive-container-close {
  color: var(--ink);
  /* Core renders a 24px icon button; pad the hit area to 44px without shifting layout. */
  width: 44px; height: 44px;
  display: flex; align-items: center; justify-content: center;
  margin: -10px;
}
.header .wp-block-navigation__responsive-container-close { margin: 0; }
@media (min-width: 1024px) {
  .header .wp-block-navigation__responsive-container-open { display: none !important; }
}

/* mobile overlay menu (full-screen, on-brand) */
@media (max-width: 1023.98px) {
  .header .wp-block-navigation__responsive-container.is-menu-open {
    position: fixed !important;
    inset: 0 !important;
    height: 100dvh !important;
    background: var(--paper) !important;
    z-index: 200 !important;
    padding: 20px var(--pad-x) 40px !important;
    display: flex !important; flex-direction: column !important;
    overflow-y: auto !important;
  }
  .header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-close,
  .header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog,
  .header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
    width: 100% !important; max-width: none !important; height: auto !important; display: block !important; position: static !important;
  }
  .header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content { margin-top: 48px !important; }
  .header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
    display: flex !important; flex-direction: column !important; gap: 0 !important; align-items: stretch !important; width: 100% !important;
  }
  .header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item { border-bottom: 1px solid var(--rule); width: 100%; }
  .header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { padding: 18px 0 !important; font-size: 18px; }
  .header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
    position: static !important; opacity: 1 !important; visibility: visible !important; transform: none !important;
    border: 0 !important; box-shadow: none !important; padding: 0 0 8px 16px !important; min-width: 0 !important; background: transparent !important; width: 100% !important;
  }
  .header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item { border-bottom: 0; }
  .header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content { padding: 10px 0 !important; font-size: 15px; color: var(--ink-soft); }
  .header .wp-block-navigation__responsive-container-close { position: absolute !important; top: 20px; right: var(--pad-x); z-index: 1; }
}

/* ============ RESULTS LISTING (project cards) ============ */
.projects { padding-block: var(--section-y); background: var(--paper); }
.projects__grid {
  display: grid; gap: 1px;
  grid-template-columns: 1fr;
  background: var(--rule);
  border: 1px solid var(--rule);
  border-top: 1px solid var(--ink);
}
@media (min-width: 640px) { .projects__grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 980px) { .projects__grid { grid-template-columns: repeat(3, 1fr); } }
/* Fill leftover tracks so the hairline-grid background doesn't show as a gray slab. */
.projects__grid::after { content: ""; grid-column: auto / -1; background: var(--paper); }
.project-card {
  background: var(--paper);
  padding: 28px 26px 24px;
  display: flex; flex-direction: column; gap: 14px;
  min-height: 260px;
  transition: background-color .18s ease;
}
.project-card:hover { background: var(--paper-warm); }
.project-card__top {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  font-family: var(--font-mono); font-size: 11px;
  letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink-mute);
}
.project-card__num { color: var(--accent); }
.project-card__title {
  font-family: var(--font-display); font-weight: 500;
  font-size: 1.25rem; line-height: 1.2; letter-spacing: -0.015em; color: var(--ink);
}
.project-card__excerpt { color: var(--ink-soft); font-size: 0.9375rem; line-height: 1.55; flex: 1; }
.project-card__foot {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding-top: 14px; border-top: 1px solid var(--rule);
  font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.06em;
  text-transform: uppercase; color: var(--ink-soft);
}
.project-card__arrow { color: var(--primary); transition: transform .2s var(--ease); }
.project-card:hover .project-card__arrow { transform: translateX(3px); }

/* ============ CAREERS LISTING (job rows) ============ */
.jobs { padding-block: var(--section-y); background: var(--paper); }
.jobs-list { border-top: 1px solid var(--ink); }
.jobs-empty { padding-block: clamp(2rem,5vw,4rem); }
.job-row {
  display: grid; gap: 18px 32px;
  grid-template-columns: 1fr;
  align-items: center;
  padding: 28px 0;
  border-bottom: 1px solid var(--rule);
}
@media (min-width: 760px) { .job-row { grid-template-columns: 1.6fr 0.8fr auto; } }
.job-row__title {
  font-family: var(--font-display); font-weight: 500;
  font-size: 1.25rem; letter-spacing: -0.015em; color: var(--ink); margin-bottom: 8px;
}
.job-row__summary { color: var(--ink-soft); font-size: 0.9375rem; line-height: 1.55; max-width: 52ch; }
.job-row__summary p { margin: 0; }
.job-row__meta { display: flex; flex-wrap: wrap; gap: 8px; }
.job-row__tag {
  font-family: var(--font-mono); font-size: 10px;
  letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink);
  border: 1px solid var(--rule-strong); padding: 5px 9px; border-radius: 2px;
}
.job-row__apply { align-self: start; }

/* team photo (dynamic) */
.team__photo {
  width: 90px; height: 90px; object-fit: cover;
  border-radius: 2px; display: block;
}

/* ============ GRAVITY FORMS -> ACRI form design ============ */
.gform_wrapper form { margin: 0; }
.gform_wrapper .gform_fields {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 22px;
  list-style: none; margin: 0; padding: 0;
}
.gform_wrapper .gfield { grid-column: 1 / -1; display: grid; gap: 8px; }
@media (min-width: 560px) {
  .gform_wrapper .gfield--width-half  { grid-column: span 6; }
  .gform_wrapper .gfield--width-third { grid-column: span 4; }
  .gform_wrapper .gfield--width-two-thirds { grid-column: span 8; }
}
.gform_wrapper .gfield_label {
  font-family: var(--font-mono);
  font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--ink-mute); font-weight: 400; margin: 0;
}
.gform_wrapper .gfield_required { color: var(--accent); margin-left: 4px; }
.gform_wrapper .ginput_container { margin: 0; }
.gform_wrapper input[type="text"],
.gform_wrapper input[type="email"],
.gform_wrapper input[type="tel"],
.gform_wrapper input[type="url"],
.gform_wrapper textarea {
  width: 100%;
  font-family: var(--font-body); font-size: 1rem; color: var(--ink);
  background: var(--paper); border: 1px solid var(--ink-mute); border-radius: 0; /* >=3:1 boundary (SC 1.4.11) */
  padding: 14px 16px;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.gform_wrapper input::placeholder,
.gform_wrapper textarea::placeholder { color: var(--ink-mute); }
.gform_wrapper input:focus,
.gform_wrapper textarea:focus {
  outline: none; border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(30,91,198,0.35);
}
.gform_wrapper textarea { resize: vertical; min-height: 130px; line-height: 1.6; }
.gform_wrapper .gform_footer { margin: 4px 0 0; padding: 0; display: flex; }
.gform_wrapper .gform_button {
  display: inline-flex; align-items: center; gap: 10px;
  height: 48px; padding: 0 22px;
  font-family: var(--font-display); font-weight: 500; font-size: 14px;
  border: 0; border-radius: 2px; background: var(--primary); color: #fff; cursor: pointer;
  transition: background-color .15s ease;
}
.gform_wrapper .gform_button:hover { background: var(--primary-light); }
.gform_wrapper .gfield_validation_message,
.gform_wrapper .validation_message,
.gform_wrapper .gform_validation_errors {
  font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.04em;
  color: #b00020; margin-top: 4px; background: none; border: 0; padding: 0;
}
.gform_wrapper .gfield_error input,
.gform_wrapper .gfield_error textarea { border-color: #b00020; }
.gform_confirmation_message {
  border: 1px solid var(--primary); background: rgba(30,91,198,0.06);
  padding: 18px 20px; font-size: 0.95rem; color: var(--ink); line-height: 1.6;
}

/* ============================================================
   BUILDER: block style variations
   ============================================================ */
.wp-block-button.is-style-acri-primary > .wp-block-button__link,
.wp-block-button.is-style-acri-ghost > .wp-block-button__link {
  display: inline-flex; align-items: center; gap: 10px; height: 48px; padding: 0 22px;
  font-family: var(--font-display); font-weight: 500; font-size: 14px; border-radius: 2px;
}
.wp-block-button.is-style-acri-primary > .wp-block-button__link { background: var(--primary); color: #fff; border: 0; }
.wp-block-button.is-style-acri-primary > .wp-block-button__link:hover { background: var(--primary-light); }
.wp-block-button.is-style-acri-ghost > .wp-block-button__link { background: transparent; color: var(--primary); border: 1px solid var(--rule-strong); }
.wp-block-button.is-style-acri-ghost > .wp-block-button__link:hover { background: var(--primary); color: #fff; }

.wp-block-group.is-style-acri-section {
  padding-block: var(--section-y);
}
.wp-block-group.is-style-acri-section > * {
  width: 100%; max-width: var(--container); margin-inline: auto; padding-inline: var(--pad-x);
}
.wp-block-group.is-style-acri-prose { max-width: 68ch; margin-inline: auto; }
.wp-block-group.is-style-acri-prose > * + * { margin-top: 1.1em; }
/* Long-form prose: readable hierarchy for client-authored content */
.is-style-acri-prose { color: var(--ink-soft); line-height: 1.7; }
/* In-text links must not rely on color alone (SC 1.4.1). */
.is-style-acri-prose a:not(.link-primary):not(.btn),
.prose-row__body a:not(.link-primary):not(.btn),
.feature__body-text a:not(.link-primary):not(.btn),
.page-hero__body a:not(.link-primary):not(.btn),
.about__copy a:not(.link-primary):not(.btn) {
  color: var(--primary);
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
}
.is-style-acri-prose h2, .is-style-acri-prose h3, .is-style-acri-prose h4 { color: var(--ink); line-height: 1.25; letter-spacing: -0.01em; }
.is-style-acri-prose h2 { font-size: 1.75rem; font-weight: 600; }
.is-style-acri-prose h3 { font-size: 1.375rem; font-weight: 600; }
.is-style-acri-prose h4 { font-size: 1.0625rem; font-weight: 600; }
.wp-block-group.is-style-acri-prose > h2:not(:first-child),
.wp-block-group.is-style-acri-prose > h3:not(:first-child),
.wp-block-group.is-style-acri-prose > h4:not(:first-child) { margin-top: 2.2em; }
.is-style-acri-prose strong { color: var(--ink); }
.is-style-acri-prose ul, .is-style-acri-prose ol { padding-left: 1.25em; }
.is-style-acri-prose li { margin-top: 0.4em; }
.is-style-acri-prose li::marker { color: var(--accent); }

.wp-block-heading.is-style-acri-kicker {
  font-family: var(--font-mono); font-size: 13px; letter-spacing: .08em; text-transform: uppercase;
  color: var(--primary); font-weight: 500;
}

/* ============================================================
   BUILDER: on-brand defaults for LOOSE core blocks
   Type-specific selectors + child combinator so ONLY top-level
   loose core blocks are affected. Section wrappers (.wp-block-group)
   and the raw [acri_*] shortcode are deliberately NOT matched, so
   existing pages (whose sections sit at post-content's top level)
   are untouched.
   ============================================================ */
.wp-block-post-content > .wp-block-heading,
.wp-block-post-content > p,
.wp-block-post-content > .wp-block-list,
.wp-block-post-content > .wp-block-image,
.wp-block-post-content > .wp-block-buttons,
.wp-block-post-content > .wp-block-details,
.wp-block-post-content > .wp-block-separator {
  max-width: var(--container); margin-inline: auto; padding-inline: var(--pad-x);
}
.wp-block-post-content > .wp-block-heading {
  font-family: var(--font-display); font-weight: 600; line-height: 1.15; margin-block: .6em .4em;
}
.wp-block-post-content > p { color: var(--ink-soft); line-height: 1.6; }
.wp-block-post-content > .wp-block-list { color: var(--ink-soft); }
.wp-block-post-content > .wp-block-image img { border-radius: 2px; }
.wp-block-post-content > .wp-block-buttons { margin-block: 1em; }

/* ============================================================
   BUILDER: new essential sections
   ============================================================ */
.stats { padding-block: var(--section-y); }
.stats__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 32px; }
.stat__value { font-family: var(--font-display); font-size: clamp(2.5rem, 5vw, 4rem); font-weight: 600; color: var(--primary); line-height: 1; }
.stat__label { font-size: 15px; color: var(--ink-mute); margin-top: 8px; }

.media-text { padding-block: var(--section-y); }
.media-text .wp-block-columns { gap: clamp(32px, 5vw, 72px); align-items: center; }
.media-text__img img { width: 100%; height: auto; border-radius: 2px; }

.cta-inline { padding-block: var(--section-y); background: var(--paper-warm); }
.cta-inline__inner { text-align: center; max-width: 720px; }
.cta-inline__body { color: var(--ink-soft); margin: 12px auto 24px; }
.cta-inline .wp-block-buttons { justify-content: center; }
.wp-block-separator.is-style-acri-rule { border: 0; border-top: 1px solid var(--rule); opacity: 1; max-width: var(--container); }

.logos { padding-block: clamp(3rem, 5vw, 5rem); }
.logos__grid { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: clamp(28px, 5vw, 64px); }
.logos__item { margin: 0; }
.logos__item img { max-height: 40px; width: auto; filter: grayscale(1); opacity: .6; transition: opacity .2s var(--ease), filter .2s var(--ease); }
.logos__item img:hover { opacity: 1; filter: grayscale(0); }

.prose-section { padding-block: var(--prose-y); }
/* Consecutive prose sections read as one article — collapse the doubled gap */
.prose-section + .prose-section { padding-top: 0; }

/* ---- Prose rows: h2-led chunks carry the designed sections' rail-and-rule
   grammar (hairline rule across the container, heading in a left rail, copy
   right) so client-authored copy reads as part of the same system. ---- */
.prose-section--rows { padding-block: calc(var(--prose-y) * 0.5); }
.prose-row {
  display: grid;
  grid-template-columns: 1fr;
  gap: 24px 80px;
  border-top: 1px solid var(--rule);
  padding-block: 44px;
}
@media (min-width: 900px) {
  .prose-row { grid-template-columns: minmax(0, 0.58fr) minmax(0, 1fr); padding-block: 56px 64px; }
}
/* Row bottom padding separates consecutive rows; on the last row it only
   stacks onto the section + next-section padding, so drop it. */
.prose-row:last-child { padding-bottom: 0; }
.prose-row__rail h2 {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: clamp(1.75rem, 2.8vw, 2.625rem);
  line-height: 1.12;
  letter-spacing: -0.02em;
  color: var(--ink);
  text-wrap: balance;
  margin: 0;
}
.prose-row__rail h2::before {
  content: "";
  display: block;
  width: 26px;
  height: 1px;
  background: var(--accent);
  margin-bottom: 18px;
}
@media (min-width: 900px) {
  /* Long chunks: the heading keeps you oriented while the copy scrolls */
  .prose-row__rail h2 { position: sticky; top: 104px; }
}
.prose-row .prose-row__body { max-width: 68ch; margin-inline: 0; }
/* Scope-style lists (same treatment as the capability cards) */
.prose-row__body ul { list-style: none; padding-left: 0; }
.prose-row__body ul li { position: relative; padding-left: 30px; margin-top: 0.7em; line-height: 1.6; }
.prose-row__body ul li::before {
  content: "+";
  position: absolute;
  left: 0;
  top: 0.05em;
  color: var(--accent);
  font-family: var(--font-mono);
  font-weight: 500;
  font-size: 14px;
}
.prose-row__body ol li::marker { font-family: var(--font-mono); color: var(--accent); }

.faq { padding-block: var(--section-y); }
.faq__list { max-width: 760px; margin-top: 32px; }
.faq__item { border-bottom: 1px solid var(--rule); padding: 18px 0; }
.faq__item summary { font-family: var(--font-display); font-weight: 600; cursor: pointer; font-size: 1.125rem; list-style: none; }
.faq__item summary::-webkit-details-marker { display: none; }
.faq__item p { color: var(--ink-soft); margin-top: 12px; }

/* ============================================================
   Feature Result — editable plan photo (item 8)
   When the ACF `plan_image` field is set, a real photo fills the
   .feature__schematic box in place of the built-in SVG drawing.
   The box keeps its 16/10 aspect-ratio, so the Project Sheet aside
   beside it is unaffected. object-fit: cover crops any aspect to fit.
   ============================================================ */
.feature__schematic-photo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}