/*
Theme Name: Photuris
Theme URI: https://photuris.co.uk
Author: Photuris
Description: Custom theme for Photuris Fire & Security — Apple-inspired aesthetic with Syne + DM Sans.
Version: 1.0.0
License: GPL v2 or later
Text Domain: photuris
*/

@import url('https://fonts.googleapis.com/css2?family=Syne:wght@600;700&family=DM+Sans:opsz,wght@9..40,300;9..40,400;9..40,500&display=swap');

/* ─── TOKENS ─── */
:root {
  color-scheme: light dark;
  --bg:      #ffffff;
  --bg-2:    #f5f5f7;
  --bg-3:    #e8e8ed;
  --text-1:  #1d1d1f;
  --text-2:  #6e6e73;
  --text-3:  #aeaeb2;
  --nav-bg:  rgba(255,255,255,0.82);
  --divide:  rgba(0,0,0,0.08);
  --blue:    #005CB9;
  --amber:   #FFB71B;
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg:      #000000;
    --bg-2:    #0a0a0a;
    --bg-3:    #1c1c1e;
    --text-1:  #f5f5f7;
    --text-2:  #98989d;
    --text-3:  #636366;
    --nav-bg:  rgba(0,0,0,0.82);
    --divide:  rgba(255,255,255,0.08);
  }
}

/* ─── RESET ─── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: 'DM Sans', system-ui, -apple-system, sans-serif;
  background: var(--bg);
  color: var(--text-1);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
img { display: block; max-width: 100%; }

/* ─── TYPOGRAPHY UTILITIES ─── */
.label {
  font-size: .72rem;
  font-weight: 500;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--text-2);
  margin-bottom: .85rem;
}
.title {
  font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Helvetica Neue', sans-serif;
  font-weight: 700;
  letter-spacing: -.025em;
  line-height: 1.07;
  color: var(--text-1);
}
.body-copy {
  font-size: 1.05rem;
  font-weight: 300;
  line-height: 1.75;
  color: var(--text-2);
  margin-top: .9rem;
}

/* ─── LAYOUT ─── */
.section { padding: 8rem max(24px, 5vw); }
.section-sm { padding: 5rem max(24px, 5vw); }
.inner { max-width: 1180px; margin: 0 auto; }
.divide { border-top: 1px solid var(--divide); }

.reveal {
  opacity: 0; transform: translateY(24px);
  transition: opacity .7s ease, transform .7s ease;
}
.reveal.in { opacity: 1; transform: none; }

/* ─── NAV ─── */
#nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 200;
  height: 56px;
  padding: 0 max(24px, 5vw);
  display: flex; align-items: center; justify-content: space-between;
  transition: background .4s ease, backdrop-filter .4s ease, border-color .4s ease;
  border-bottom: 1px solid transparent;
}
#nav.solid {
  background: var(--nav-bg);
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
  border-bottom-color: var(--divide);
}

/* WP admin bar offset so the site nav isn't hidden behind it */
body.admin-bar #nav { top: 32px; }
@media (max-width: 782px) { body.admin-bar #nav { top: 46px; } }
@media (max-width: 600px) { body.admin-bar #nav { top: 0; } }
/* Push the hero down under the admin bar to avoid overlap with content */
body.admin-bar #hero { margin-top: 32px; }
@media (max-width: 782px) { body.admin-bar #hero { margin-top: 46px; } }
@media (max-width: 600px) { body.admin-bar #hero { margin-top: 0; } }
.nav-logo { display: flex; align-items: center; text-decoration: none; }
.nav-logo img {
  height: 38px; width: auto;
  opacity: 0;
  filter: brightness(1.5);
  transition: opacity .4s ease, filter .4s ease;
}
/* Inner pages (non-hero) always show logo */
body.has-no-hero .nav-logo img { opacity: 1; }
body.has-no-hero #nav { background: var(--nav-bg); backdrop-filter: blur(24px); -webkit-backdrop-filter: blur(24px); border-bottom-color: var(--divide); }
@media (prefers-color-scheme: light) { #nav.solid .nav-logo img, body.has-no-hero .nav-logo img { filter: none; } }
@media (prefers-color-scheme: dark)  { #nav.solid .nav-logo img, body.has-no-hero .nav-logo img { filter: brightness(1.25); } }

.nav-links { display: flex; align-items: center; gap: 2rem; list-style: none; }
.nav-links a {
  font-size: .875rem; font-weight: 400; text-decoration: none;
  transition: color .2s;
}
#nav:not(.solid) .nav-links a { color: rgba(255,255,255,.72); }
#nav:not(.solid) .nav-links a:hover { color: #fff; }
#nav.solid .nav-links a,
body.has-no-hero #nav .nav-links a { color: var(--text-2); }
#nav.solid .nav-links a:hover,
body.has-no-hero #nav .nav-links a:hover { color: var(--text-1); }
.nav-current,
#nav.solid .nav-current,
body.has-no-hero #nav .nav-current { color: var(--amber) !important; }
#nav:not(.solid) .nav-current { color: var(--amber) !important; }

.nav-toggle { display: none; background: none; border: none; cursor: pointer; padding: 4px; }
.nav-toggle span {
  display: block; width: 18px; height: 1px; background: currentColor; margin: 5px 0;
  transition: .3s;
}
#nav:not(.solid) .nav-toggle { color: #fff; }
#nav.solid .nav-toggle,
body.has-no-hero #nav .nav-toggle { color: var(--text-1); }

/* ─── NAV DROPDOWN ─── */
.nav-dropdown { position: relative; }
.nav-dropdown > a::after {
  content: '';
  display: inline-block;
  width: 0; height: 0;
  border-left: 3px solid transparent;
  border-right: 3px solid transparent;
  border-top: 4px solid currentColor;
  margin-left: 5px;
  vertical-align: middle;
  opacity: .5;
  transition: transform .2s;
}
.nav-dropdown:hover > a::after { transform: rotate(180deg); opacity: 1; }
.nav-dropdown-menu {
  position: absolute; top: calc(100% + 14px); left: 50%;
  transform: translateX(-50%) translateY(-6px);
  background: var(--nav-bg); backdrop-filter: blur(24px); -webkit-backdrop-filter: blur(24px);
  border: 1px solid var(--divide);
  border-radius: 14px; padding: .4rem;
  min-width: 185px;
  opacity: 0; visibility: hidden; pointer-events: none;
  transition: opacity .18s ease, transform .18s ease, visibility .18s;
  list-style: none;
  z-index: 300;
  box-shadow: 0 8px 32px rgba(0,0,0,.12);
}
.nav-dropdown::before {
  content: '';
  position: absolute;
  top: 100%; left: -20px; right: -20px;
  height: 18px;
}
.nav-dropdown:hover .nav-dropdown-menu,
.nav-dropdown:focus-within .nav-dropdown-menu {
  opacity: 1; visibility: visible; pointer-events: all;
  transform: translateX(-50%) translateY(0);
}
.nav-dropdown-menu li a {
  display: block; padding: .45rem .9rem; border-radius: 8px;
  font-size: .8rem; font-weight: 400;
  color: var(--text-2) !important;
  text-decoration: none; white-space: nowrap;
  transition: background .15s, color .15s;
}
.nav-dropdown-menu li a:hover { background: var(--bg-3); color: var(--text-1) !important; }

/* ─── HERO (home) ─── */
#hero {
  position: relative; height: 100vh; min-height: 640px;
  display: flex; align-items: center; justify-content: flex-start;
  text-align: left; overflow: hidden;
}
.hero-bg {
  position: absolute; inset: -50% 0;
  background-size: cover;
  background-position: center 40%;
  background-repeat: no-repeat;
  will-change: transform;
}
.hero-scrim {
  position: absolute; inset: 0;
  background: linear-gradient(to bottom, rgba(0,0,0,.18) 0%, rgba(0,0,0,.28) 50%, rgba(0,0,0,.42) 100%);
}
#hero.hero-dc .hero-bg { inset: 0; background-position: center; }
#hero.hero-dc .hero-scrim {
  background: linear-gradient(105deg, rgba(0,4,16,.88) 0%, rgba(0,8,28,.78) 55%, rgba(0,0,0,.3) 100%);
}
.hero-body {
  position: relative; z-index: 2;
  padding: 0 max(24px, 8vw);
  max-width: 700px;
  will-change: opacity, transform;
}
#hero.hero-dc .hero-body { padding: 0 max(48px, 10vw); max-width: 820px; }
.hero-logo {
  position: absolute;
  top: 80px;
  left: max(24px, 8vw);
  z-index: 2;
  opacity: 0; transform: translateY(12px);
  animation: fadeUp .7s ease .1s forwards;
}
#hero.hero-dc .hero-logo { left: max(48px, 10vw); }
.hero-logo img {
  height: 88px; width: auto;
  filter: brightness(0) invert(1);
}
@media (max-width: 600px) { .hero-logo img { height: 64px; } }

.hero-label {
  font-size: .7rem; font-weight: 500; letter-spacing: .22em; text-transform: uppercase;
  color: rgba(255,255,255,.55); margin-bottom: 1.1rem;
  opacity: 0; transform: translateY(12px);
  animation: fadeUp .7s ease .25s forwards;
}
.hero-h1 {
  font-family: 'Syne', system-ui, sans-serif;
  font-size: clamp(2.75rem, 7.5vw, 5.75rem);
  font-weight: 700;
  line-height: 1.04; letter-spacing: -.02em; color: #fff;
  margin-bottom: 1.4rem;
  opacity: 0; transform: translateY(16px);
  animation: fadeUp .8s ease .4s forwards;
}
#hero.hero-dc .hero-h1 { font-size: clamp(2.5rem, 6.5vw, 5rem); }
.hero-h1 em { color: var(--amber); font-style: normal; }
.hero-sub {
  font-size: clamp(.95rem, 1.4vw, 1.1rem); font-weight: 300;
  color: rgba(255,255,255,.65); line-height: 1.72;
  max-width: 480px; margin: 0 0 2.5rem;
  opacity: 0; transform: translateY(12px);
  animation: fadeUp .8s ease .55s forwards;
}
#hero.hero-dc .hero-sub { max-width: 460px; }
.hero-btns {
  display: flex; gap: 12px; justify-content: flex-start; flex-wrap: wrap;
  opacity: 0; transform: translateY(10px);
  animation: fadeUp .8s ease .7s forwards;
}
@keyframes fadeUp { to { opacity: 1; transform: none; } }

/* ─── BUTTONS ─── */
.btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: .75rem 1.75rem; border-radius: 980px;
  font-size: .9rem; font-weight: 500; text-decoration: none;
  letter-spacing: .01em;
  transition: opacity .2s, transform .15s;
}
.btn:hover { opacity: .82; transform: translateY(-1px); }
.btn-blue  { background: var(--blue); color: #fff; }
.btn-ghost { background: rgba(255,255,255,.1); color: #fff; backdrop-filter: blur(8px); border: 1px solid rgba(255,255,255,.22); }
.btn-solid { background: var(--blue); color: #fff; }

/* Scroll cue */
.hero-cue {
  position: absolute; bottom: 2rem; left: 50%; transform: translateX(-50%);
  z-index: 2; display: flex; flex-direction: column; align-items: center; gap: 8px;
  opacity: 0; animation: fadeUp .8s ease 1.1s forwards;
}
#hero.hero-dc .hero-cue { left: max(48px, 10vw); transform: none; }
.hero-cue-line {
  width: 1px; height: 36px;
  background: linear-gradient(to bottom, rgba(255,255,255,.5), transparent);
  animation: cueAnim 2s ease-in-out infinite;
}
@keyframes cueAnim {
  0%   { opacity: 0; transform: scaleY(0); transform-origin: top; }
  50%  { opacity: 1; transform: scaleY(1); }
  100% { opacity: 0; transform: scaleY(1); transform-origin: bottom; }
}

/* ─── CUSTOMERS STRIP ─── */
#customers {
  background: #fff;
  border-top: 1px solid rgba(0,0,0,.07);
  border-bottom: 1px solid rgba(0,0,0,.07);
  padding: 3.5rem 0;
  overflow: hidden;
}
@media (prefers-color-scheme: dark) {
  #customers { background: #0a0a0a; border-color: rgba(255,255,255,.07); }
}
.customers-label {
  text-align: center;
  font-size: .8rem; font-weight: 600; letter-spacing: .2em; text-transform: uppercase;
  color: var(--text-2);
  margin-bottom: 2.5rem;
  padding: 0 max(24px, 5vw);
}
.marquee-wrap { position: relative; overflow: hidden; }
.marquee-wrap::before,
.marquee-wrap::after {
  content: ''; position: absolute; top: 0; bottom: 0; width: 160px; z-index: 2; pointer-events: none;
}
.marquee-wrap::before { left:  0; background: linear-gradient(to right, #fff, transparent); }
.marquee-wrap::after  { right: 0; background: linear-gradient(to left,  #fff, transparent); }
@media (prefers-color-scheme: dark) {
  .marquee-wrap::before { background: linear-gradient(to right, #0a0a0a, transparent); }
  .marquee-wrap::after  { background: linear-gradient(to left,  #0a0a0a, transparent); }
}
.marquee-track {
  display: flex; align-items: center;
  width: max-content;
  animation: marquee 90s linear infinite;
}
@keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
.marquee-item {
  flex-shrink: 0;
  width: 260px; height: 200px;
  display: flex; align-items: center; justify-content: center;
  padding: 0 40px;
}
.marquee-item img {
  max-height: 160px; max-width: 200px;
  width: auto; height: auto;
  object-fit: contain;
}

/* ─── SERVICES ─── */
#services { background: var(--bg); }
.services-head { margin-bottom: 3rem; }
.services-head .title { font-size: clamp(2rem, 4vw, 3rem); max-width: 640px; }

.disc-grid {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 10px;
  margin-top: 2.5rem;
}
.disc-grid .scard { grid-column: span 2; }
.scard-sm { aspect-ratio: 1/1; }
.disc-grid .scard .scard-body { padding: 14px; }
.disc-grid .scard .scard-tag { font-size: .58rem; letter-spacing: .12em; margin-bottom: 4px; }
.disc-grid .scard .scard-title {
  font-size: clamp(.82rem, 1.05vw, .98rem);
  letter-spacing: -.01em; line-height: 1.2;
}

/* ─── SECTORS / SCARDS ─── */
#sectors { background: var(--bg-2); }
.card-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.scard {
  position: relative; border-radius: 20px; overflow: hidden;
  aspect-ratio: 3/4;
  background: #141414;
  cursor: pointer;
  transition: transform .4s cubic-bezier(.25,.46,.45,.94);
}
.scard:hover { transform: scale(1.018); }
.scard-photo {
  position: absolute; inset: 0;
  background-size: cover; background-position: center;
  opacity: .82;
  transition: opacity .5s ease, transform .6s ease;
}
.scard:hover .scard-photo { opacity: .92; transform: scale(1.04); }
.scard-veil {
  position: absolute; inset: 0;
  background: linear-gradient(180deg,
    rgba(0,0,0,.65) 0%, rgba(0,0,0,.3) 35%,
    rgba(0,0,0,.0) 65%, rgba(0,0,0,.3) 100%);
}
.scard-body {
  position: relative; z-index: 2;
  padding: 22px; height: 100%;
  display: flex; flex-direction: column; justify-content: space-between;
}
.scard-tag {
  font-size: .65rem; font-weight: 500; letter-spacing: .13em; text-transform: uppercase;
  color: rgba(255,255,255,.5); margin-bottom: 6px;
}
.scard-title {
  font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Helvetica Neue', sans-serif;
  font-size: clamp(1.15rem, 1.6vw, 1.45rem);
  font-weight: 700; letter-spacing: -.02em; line-height: 1.12; color: #fff;
}
.scard-foot { display: flex; flex-direction: column; gap: 6px; }
.scard-desc { font-size: .8rem; font-weight: 400; color: rgba(255,255,255,.82); line-height: 1.6; text-shadow: 0 1px 2px rgba(0,0,0,.3); }
.scard-link { font-size: .78rem; font-weight: 500; color: rgba(255,255,255,.9); text-decoration: none; letter-spacing: .01em; transition: color .2s; text-shadow: 0 1px 2px rgba(0,0,0,.3); }
.scard-link:hover { color: #fff; }

/* ─── FEATURES ─── */
.frow {
  display: grid; grid-template-columns: 1fr 1fr;
  min-height: 620px;
  height: 620px;
  border-top: 1px solid var(--divide);
  align-items: stretch;
}
@media (max-width: 900px) { .frow { height: auto; } }
.frow.flip { direction: rtl; }
.frow.flip > * { direction: ltr; }
.ftext {
  background: var(--bg-2);
  padding: 6rem max(24px, 5vw);
  display: flex; flex-direction: column; justify-content: center;
}
.ftext .title { font-size: clamp(1.6rem, 2.5vw, 2.25rem); margin-top: .5rem; }
.ftext p { font-size: .95rem; font-weight: 300; color: var(--text-2); line-height: 1.8; margin-top: 1rem; max-width: 400px; }
.flist { list-style: none; margin-top: 1.75rem; display: flex; flex-direction: column; gap: .75rem; }
.flist li {
  font-size: .875rem; color: var(--text-2);
  display: flex; align-items: flex-start; gap: 10px; line-height: 1.5;
}
.flist li::before {
  content: ''; flex-shrink: 0;
  width: 4px; height: 4px; border-radius: 50%;
  background: var(--text-3); margin-top: 7px;
}
.fimg { position: relative; overflow: hidden; }
.fimg img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .8s ease; }
.frow:hover .fimg img { transform: scale(1.03); }

.ftext { transition: opacity .85s ease, transform .9s cubic-bezier(.16,1,.3,1); opacity: 0; transform: translateY(28px); }
.frow.fold-in .ftext { opacity: 1; transform: none; }
.fimg::after {
  content: ''; position: absolute; inset: 0;
  background: var(--bg); transform-origin: right;
  transition: transform 1.1s cubic-bezier(.77,0,.175,1) .2s;
}
.frow.flip .fimg::after { transform-origin: left; }
.frow.fold-in .fimg::after { transform: scaleX(0); }

/* ─── STATS ─── */
#stats {
  background: var(--bg-2);
  border-top: 1px solid var(--divide);
  border-bottom: 1px solid var(--divide);
}
.stats-row { display: grid; grid-template-columns: repeat(3,1fr); max-width: 860px; margin: 0 auto; }
.stat { padding: 4rem 2rem; text-align: center; position: relative; }
.stat + .stat::before {
  content: ''; position: absolute; left: 0; top: 30%; bottom: 30%;
  width: 1px; background: var(--divide);
}
.stat-num {
  font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Helvetica Neue', sans-serif;
  font-size: clamp(2.8rem, 5vw, 4rem);
  font-weight: 700; letter-spacing: -.04em; color: var(--amber);
  line-height: 1; margin-bottom: .5rem;
}
.stat-label { font-size: .78rem; font-weight: 400; color: var(--text-2); letter-spacing: .04em; text-transform: uppercase; }

/* ─── ACCREDITATIONS ─── */
#accreditations { background: var(--bg); }
.accred-intro { text-align: center; margin-bottom: 4rem; }
.accred-block { margin-bottom: 3.5rem; }
.accred-block:last-child { margin-bottom: 0; }
.accred-group-label { font-size: .68rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--text-3); margin-bottom: 2rem; text-align: center; }
.accred-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 2rem 3rem; padding: 2rem 0; border-top: 1px solid var(--divide); }
.accred-item { position: relative; display: inline-flex; flex-direction: column; align-items: center; padding-bottom: 1.6rem; }
.accred-item img { height: 64px; width: auto; max-width: 180px; object-fit: contain; filter: none; transition: transform .35s ease; }
.accred-item:hover img { transform: scale(1.06); }
.accred-item::after {
  content: attr(data-label);
  position: absolute; bottom: 0; left: 50%; transform: translateX(-50%);
  background: var(--text-1); color: var(--bg);
  font-size: .6rem; font-weight: 500; letter-spacing: .04em;
  padding: .18rem .5rem; border-radius: 4px;
  white-space: nowrap; pointer-events: none;
  opacity: 0; transition: opacity .2s ease;
  z-index: 10;
}
.accred-item:hover::after { opacity: 1; }

/* ─── CTA ─── */
#cta { background: var(--bg); border-top: 1px solid var(--divide); text-align: center; }
#cta .title { font-size: clamp(2rem, 4vw, 3rem); margin-bottom: 1rem; }
#cta .body-copy { max-width: 420px; margin-left: auto; margin-right: auto; }

/* ─── DATACENTRE-SPECIFIC BLOCKS ─── */
.services-head-row { display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; align-items: start; margin-bottom: 3rem; }
.services-head-row .title { font-size: clamp(1.8rem, 3vw, 2.5rem); margin-top: .5rem; }
.services-head-row .body-col { font-size: .95rem; font-weight: 300; color: var(--text-2); line-height: 1.8; padding-top: .5rem; }

.service-icon-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 1px; background: var(--divide); border: 1px solid var(--divide); border-radius: 20px; overflow: hidden; }
.service-icon-item { background: var(--bg); padding: 2rem 1.5rem; display: flex; flex-direction: column; align-items: center; gap: .75rem; text-align: center; transition: background .2s; }
.service-icon-item:hover { background: var(--bg-2); }
.service-icon-item svg { color: var(--blue); flex-shrink: 0; }
.service-icon-label { font-size: .78rem; font-weight: 500; color: var(--text-2); line-height: 1.4; }

.stats-inline { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: var(--divide); border: 1px solid var(--divide); border-radius: 20px; overflow: hidden; margin-top: 1rem; }
.stat-inline-item { background: var(--bg); padding: 2rem 1.5rem; text-align: center; }
.stat-inline-num { font-size: clamp(1.6rem, 3vw, 2.25rem); font-weight: 700; letter-spacing: -.04em; color: var(--amber); line-height: 1; margin-bottom: .35rem; }
.stat-inline-label { font-size: .72rem; font-weight: 400; color: var(--text-2); text-transform: uppercase; letter-spacing: .06em; line-height: 1.45; }

.who-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; margin-top: 2.5rem; }
.who-item { border: 1px solid var(--divide); border-radius: 16px; padding: 1.75rem 1.25rem; display: flex; flex-direction: column; align-items: center; text-align: center; gap: .9rem; transition: border-color .2s, background .2s; }
.who-item:hover { border-color: var(--blue); background: var(--bg-2); }
.who-icon { color: var(--blue); }
.who-title { font-size: .8rem; font-weight: 500; color: var(--text-2); line-height: 1.45; }

#approach { background: var(--bg-2); }
.approach-head { max-width: 640px; margin-bottom: 4rem; }
.approach-head .title { font-size: clamp(1.8rem, 3vw, 2.75rem); margin-top: .5rem; }
.stages-wrap { display: grid; grid-template-columns: repeat(3, 1fr); gap: 3rem; position: relative; }
.stages-wrap::before {
  content: ''; position: absolute; top: 2.1rem;
  left: calc(100% / 6 + 0px); right: calc(100% / 6 + 0px);
  height: 1px; background: var(--divide); z-index: 0;
}
.stage { position: relative; z-index: 1; display: flex; flex-direction: column; gap: .75rem; }
.stage-circle {
  width: 50px; height: 50px; border-radius: 50%;
  border: 1.5px solid var(--divide);
  display: flex; align-items: center; justify-content: center;
  background: var(--bg-2);
  color: var(--blue); flex-shrink: 0;
}
.stage.active .stage-circle { border-color: var(--amber); color: var(--amber); }
.stage-num { font-size: .65rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--blue); margin-top: 1rem; }
.stage.active .stage-num { color: var(--amber); }
.stage-title { font-size: 1.1rem; font-weight: 700; letter-spacing: -.02em; color: var(--text-1); }
.stage-desc { font-size: .875rem; font-weight: 300; color: var(--text-2); line-height: 1.72; }
.stage-link { font-size: .78rem; font-weight: 500; color: var(--text-2); text-decoration: none; transition: color .2s; align-self: flex-start; }
.stage-link:hover { color: var(--text-1); }

#commitment { background: #06101e; padding: 7rem max(24px, 5vw); }
#commitment .label { color: rgba(255,255,255,.35); }
#commitment .title { color: #fff; }
.commitment-head { max-width: 540px; margin-bottom: 4rem; }
.commitment-head .title { font-size: clamp(2rem, 4vw, 3rem); }
.commitment-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2.5rem; border-top: 1px solid rgba(255,255,255,.07); padding-top: 3rem; }
.commitment-item { display: flex; flex-direction: column; gap: .9rem; }
.commitment-icon { width: 44px; height: 44px; border-radius: 50%; border: 1px solid rgba(255,255,255,.15); display: flex; align-items: center; justify-content: center; color: rgba(255,255,255,.65); flex-shrink: 0; }
.commitment-title { font-size: 1rem; font-weight: 600; color: #fff; line-height: 1.3; }
.commitment-desc { font-size: .82rem; font-weight: 300; color: rgba(255,255,255,.42); line-height: 1.7; }

/* ─── SECTOR PAGE BUILDING BLOCKS ─── */

/* Pull quote — used on public-spaces, housing */
.pullquote {
  font-family: 'Syne', system-ui, sans-serif;
  font-size: clamp(1.5rem, 3vw, 2.4rem);
  font-weight: 600; letter-spacing: -.01em; line-height: 1.2;
  color: var(--text-1);
  max-width: 880px; margin: 0 auto;
  padding: 2rem 0 2rem 2.5rem;
  border-left: 3px solid var(--amber);
}
.pullquote-author {
  display: block; margin-top: 1.25rem;
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: .78rem; font-weight: 500;
  letter-spacing: .12em; text-transform: uppercase;
  color: var(--text-3);
}

/* Compact stats strip (manufacturing, rolling-stock) */
.stats-strip {
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: 0;
  border-top: 1px solid var(--divide);
  border-bottom: 1px solid var(--divide);
  background: var(--bg-2);
}
.stats-strip .stat { padding: 3rem 1.5rem; }
@media (max-width: 768px) { .stats-strip { grid-template-columns: repeat(2, 1fr); } }

/* Risk panel (dark with icon bullets, energy-storage) */
.risk-panel { background: #06101e; padding: 7rem max(24px, 5vw); }
.risk-panel .label { color: rgba(255,255,255,.35); }
.risk-panel .title { color: #fff; }
.risk-panel .head { max-width: 640px; margin-bottom: 3.5rem; }
.risk-panel .head .title { font-size: clamp(1.9rem, 3.5vw, 2.75rem); }
.risk-panel .head .body-copy { color: rgba(255,255,255,.55); }
.risk-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2rem; border-top: 1px solid rgba(255,255,255,.08); padding-top: 3rem; }
.risk-item { display: flex; flex-direction: column; gap: .75rem; }
.risk-item .n {
  font-family: 'Syne', sans-serif; font-size: 2rem; font-weight: 700;
  color: var(--amber); line-height: 1; letter-spacing: -.04em;
}
.risk-item h3 { font-size: 1rem; font-weight: 600; color: #fff; line-height: 1.3; }
.risk-item p { font-size: .82rem; font-weight: 300; color: rgba(255,255,255,.5); line-height: 1.7; }
@media (max-width: 900px) { .risk-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .risk-grid { grid-template-columns: 1fr; } }

/* Grade grid — BS 5839-6 category cards (housing) */
.grade-grid {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px;
  margin-top: 3rem;
}
.grade-card {
  border: 1px solid var(--divide); border-radius: 18px;
  padding: 1.75rem 1.5rem;
  display: flex; flex-direction: column; gap: .85rem;
  transition: border-color .25s, background .25s, transform .25s;
}
.grade-card:hover { border-color: var(--blue); background: var(--bg-2); transform: translateY(-2px); }
.grade-card .grade-tag {
  font-family: 'Syne', sans-serif;
  font-size: 1.75rem; font-weight: 700; letter-spacing: -.03em;
  color: var(--blue); line-height: 1;
}
.grade-card h3 { font-size: .95rem; font-weight: 600; color: var(--text-1); line-height: 1.3; }
.grade-card p { font-size: .82rem; font-weight: 300; color: var(--text-2); line-height: 1.65; }
@media (max-width: 900px) { .grade-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .grade-grid { grid-template-columns: 1fr; } }

.values-grid { grid-template-columns: repeat(5, 1fr); }
.values-grid .grade-tag { font-size: 1.35rem; }
@media (max-width: 1000px) { .values-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 720px)  { .values-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 460px)  { .values-grid { grid-template-columns: 1fr; } }

/* Partner spotlight — Fogtec dominant section on rolling-stock */
.partner-spotlight {
  background: linear-gradient(135deg, #030d1e 0%, #0a1f3a 70%, #061225 100%);
  color: #fff;
  padding: 7rem max(24px, 5vw);
  position: relative;
  overflow: hidden;
}
.partner-spotlight::before {
  content: ''; position: absolute; inset: 0;
  background: radial-gradient(ellipse at 25% 30%, rgba(0,92,185,.18) 0%, transparent 60%);
  pointer-events: none;
}
.partner-spotlight > .inner { position: relative; z-index: 1; }
.partner-spotlight .ps-head {
  display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; align-items: end;
  margin-bottom: 4rem;
  padding-bottom: 3rem;
  border-bottom: 1px solid rgba(255,255,255,.1);
}
.partner-spotlight .ps-head .label { color: rgba(255,255,255,.4); }
.partner-spotlight .ps-head .title { color: #fff; font-size: clamp(2rem, 4.5vw, 3.25rem); }
.partner-spotlight .ps-head .body-col {
  font-size: .95rem; font-weight: 300;
  color: rgba(255,255,255,.6); line-height: 1.85; padding-bottom: .5rem;
}
.partner-spotlight .ps-logo {
  display: inline-flex; align-items: center; gap: .85rem;
  padding: .55rem 1rem; border-radius: 980px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);
  font-size: .7rem; font-weight: 500; letter-spacing: .14em; text-transform: uppercase;
  color: rgba(255,255,255,.75);
  margin-bottom: 1.5rem;
}
.partner-spotlight .ps-logo img { height: 22px; width: auto; filter: brightness(0) invert(1); opacity: .9; }
.ps-points {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 2rem;
  margin-bottom: 4rem;
}
.ps-point { display: flex; flex-direction: column; gap: .85rem; }
.ps-point .n {
  font-family: 'Syne', sans-serif; font-size: 2.25rem; font-weight: 700;
  color: var(--amber); line-height: 1; letter-spacing: -.03em;
}
.ps-point h3 { font-size: 1.1rem; font-weight: 600; color: #fff; line-height: 1.3; }
.ps-point p { font-size: .85rem; font-weight: 300; color: rgba(255,255,255,.55); line-height: 1.75; }
.ps-feature {
  display: grid; grid-template-columns: 1.1fr 1fr; gap: 0;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 24px; overflow: hidden;
  background: rgba(0,0,0,.25);
}
.ps-feature .ps-ftext { padding: 4rem 3rem; display: flex; flex-direction: column; justify-content: center; }
.ps-feature .ps-ftext p { color: rgba(255,255,255,.65); font-size: .95rem; font-weight: 300; line-height: 1.85; margin-top: 1rem; }
.ps-feature .ps-ftext h3 {
  font-family: 'Syne', sans-serif;
  font-size: clamp(1.5rem, 2.5vw, 2rem);
  font-weight: 700; letter-spacing: -.02em; line-height: 1.15; color: #fff; margin-top: .5rem;
}
.ps-feature .ps-ftext .label { color: rgba(255,255,255,.4); }
.ps-feature ul { list-style: none; margin-top: 2rem; display: flex; flex-direction: column; gap: .75rem; }
.ps-feature li {
  font-size: .88rem; font-weight: 300; color: rgba(255,255,255,.7);
  display: flex; align-items: flex-start; gap: 10px; line-height: 1.55;
}
.ps-feature li::before { content: ''; flex-shrink: 0; width: 4px; height: 4px; border-radius: 50%; background: var(--amber); margin-top: 8px; }
.ps-feature .ps-fimg { background-size: cover; background-position: center; min-height: 400px; }
@media (max-width: 900px) {
  .partner-spotlight .ps-head { grid-template-columns: 1fr; gap: 1.5rem; align-items: start; }
  .ps-points { grid-template-columns: 1fr; gap: 2rem; }
  .ps-feature { grid-template-columns: 1fr; }
  .ps-feature .ps-ftext { padding: 3rem 2rem; }
  .ps-feature .ps-fimg { min-height: 260px; order: -1; }
}

/* Accreditation strip — compact row for inline use on sector pages */
.accred-strip {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: center;
  gap: 2rem 3rem;
  padding: 3rem 0;
  margin: 0 auto;
  max-width: 960px;
  border-top: 1px solid var(--divide);
  border-bottom: 1px solid var(--divide);
}
.accred-strip img { height: 56px; width: auto; max-width: 160px; object-fit: contain; opacity: .9; transition: opacity .2s; }
.accred-strip img:hover { opacity: 1; }

/* Two-column intro block (variant used on manufacturing, rail, education) */
.intro-split {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 4rem; align-items: start;
  padding: 7rem max(24px, 5vw);
  border-top: 1px solid var(--divide);
}
.intro-split.inverted { background: var(--bg-2); }
.intro-split .title { font-size: clamp(1.8rem, 3.5vw, 2.75rem); }
.intro-split .body-col { padding-top: .25rem; }
.intro-split .body-col p { font-size: .95rem; font-weight: 300; color: var(--text-2); line-height: 1.85; margin-bottom: 1rem; }
.intro-split .body-col a { color: var(--blue); font-weight: 500; text-decoration: none; }
@media (max-width: 900px) { .intro-split { grid-template-columns: 1fr; gap: 1.5rem; padding: 5rem max(24px, 5vw); } }

/* ─── VERIFY / ID CARD (Apple-style) ─── */
.verify-hero {
  padding: 9rem max(24px, 5vw) 5rem;
  background: var(--bg);
  text-align: center;
  overflow: hidden;
}
.verify-hero .inner {
  max-width: 760px;
  margin: 0 auto;
}
.verify-hero .label {
  display: inline-block;
  font-size: .72rem; font-weight: 500;
  letter-spacing: .2em; text-transform: uppercase;
  color: var(--text-3);
  margin-bottom: 1.25rem;
}

.verify-hero-title {
  font-family: 'Syne', system-ui, -apple-system, sans-serif;
  font-size: clamp(3.5rem, 10vw, 7.5rem);
  font-weight: 700;
  letter-spacing: -.04em;
  line-height: .95;
  color: var(--text-1);
  margin: 0 0 1rem;
}
.verify-hero-title em { font-style: normal; }
.verify-valid   .verify-hero-title em { color: #16a34a; }
.verify-expired .verify-hero-title em,
.verify-voided  .verify-hero-title em { color: #dc2626; }

.verify-hero-sub {
  font-size: clamp(1.05rem, 1.4vw, 1.25rem);
  font-weight: 300;
  color: var(--text-2);
  line-height: 1.55;
  max-width: 520px;
  margin: 0 auto 4rem;
}

/* ── Stage for the floating card ── */
.verify-stage {
  position: relative;
  max-width: 440px;
  margin: 0 auto 3rem;
  perspective: 1200px;
}
.verify-card-shadow {
  position: absolute;
  left: 10%; right: 10%;
  bottom: -20px; height: 40px;
  background: radial-gradient(ellipse 50% 100% at 50% 50%, rgba(0,0,0,.25) 0%, transparent 70%);
  filter: blur(8px);
  z-index: 0;
  pointer-events: none;
}

.verify-card {
  position: relative;
  background: linear-gradient(135deg, #005CB9 0%, #003a7a 45%, #062553 100%);
  border-radius: 26px;
  padding: 1.6rem 1.6rem 1.4rem;
  color: #fff;
  box-shadow:
    0 50px 100px -40px rgba(0,40,95,.45),
    0 20px 40px -15px rgba(0,40,95,.3),
    inset 0 0 0 1px rgba(255,255,255,.12);
  overflow: hidden;
  isolation: isolate;
  animation: verifyCardIn .9s cubic-bezier(.16,1,.3,1) both;
}
@keyframes verifyCardIn {
  from { opacity: 0; transform: translateY(24px) scale(.96); }
  to   { opacity: 1; transform: none; }
}
.verify-expired .verify-card,
.verify-voided  .verify-card {
  background: linear-gradient(135deg, #6b7280 0%, #374151 45%, #1f2937 100%);
  box-shadow:
    0 50px 100px -40px rgba(17,24,39,.4),
    0 20px 40px -15px rgba(17,24,39,.3),
    inset 0 0 0 1px rgba(255,255,255,.12);
}

.verify-card-sheen {
  position: absolute; inset: 0;
  background:
    radial-gradient(circle at 85% 10%, rgba(255,255,255,.22) 0%, transparent 38%),
    radial-gradient(circle at 10% 100%, rgba(255,183,27,.18) 0%, transparent 50%);
  pointer-events: none;
  z-index: 1;
}
.verify-expired .verify-card-sheen,
.verify-voided .verify-card-sheen {
  background: radial-gradient(circle at 85% 10%, rgba(255,255,255,.18) 0%, transparent 38%);
}
.verify-card-grid {
  position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px);
  background-size: 20px 20px;
  mask-image: radial-gradient(ellipse 80% 60% at 50% 50%, #000 0%, transparent 70%);
  -webkit-mask-image: radial-gradient(ellipse 80% 60% at 50% 50%, #000 0%, transparent 70%);
  pointer-events: none;
  z-index: 1;
}

.verify-card-head {
  position: relative; z-index: 2;
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 1.75rem;
}
.verify-card-brand img {
  height: 28px; width: auto;
  filter: brightness(0) invert(1);
  opacity: .95;
}
.verify-card-chip { opacity: .7; }

.verify-card-body {
  position: relative; z-index: 2;
  display: grid;
  grid-template-columns: 104px 1fr;
  gap: 1.25rem;
  align-items: center;
  margin-bottom: 1.75rem;
}
.verify-card-photo {
  width: 104px; height: 136px;
  border-radius: 16px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.2);
  overflow: hidden;
  display: flex; align-items: center; justify-content: center;
  font-family: 'Syne', sans-serif;
  font-size: 2rem; font-weight: 700;
  color: rgba(255,255,255,.5);
}
.verify-card-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }

.verify-card-details { min-width: 0; }
.verify-label {
  font-size: .62rem; font-weight: 500;
  letter-spacing: .16em; text-transform: uppercase;
  color: rgba(255,255,255,.55);
  margin: 0 0 .35rem;
}
.verify-name {
  font-family: 'Syne', system-ui, sans-serif;
  font-size: clamp(1.2rem, 3vw, 1.4rem);
  font-weight: 700; letter-spacing: -.01em; line-height: 1.15;
  color: #fff;
  margin: 0 0 .35rem;
  word-break: break-word;
}
.verify-title {
  font-size: .88rem; font-weight: 400;
  color: rgba(255,255,255,.78); margin: 0;
  line-height: 1.4;
}

.verify-card-foot {
  position: relative; z-index: 2;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 1rem;
  padding-top: 1.2rem;
  border-top: 1px solid rgba(255,255,255,.14);
}
.verify-card-foot > div:last-child { text-align: right; }
.verify-value {
  font-family: 'Syne', system-ui, sans-serif;
  font-size: 1rem; font-weight: 700;
  letter-spacing: .02em;
  color: #fff; margin: 0;
  font-variant-numeric: tabular-nums;
}

/* ── Small status indicator below the card ── */
.verify-indicator {
  display: inline-flex; align-items: center; gap: .6rem;
  padding: .55rem 1.1rem;
  background: var(--bg-2);
  border: 1px solid var(--divide);
  border-radius: 980px;
  font-size: .82rem; font-weight: 500;
  color: var(--text-2);
  margin: 0 auto;
  animation: verifyIndicatorIn .6s ease .4s both;
}
@keyframes verifyIndicatorIn {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: none; }
}
.verify-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: #16a34a;
  box-shadow: 0 0 0 4px rgba(22,163,74,.15);
  animation: verifyDotPulse 2.4s ease-in-out infinite;
}
@keyframes verifyDotPulse {
  0%,100% { box-shadow: 0 0 0 4px rgba(22,163,74,.15); }
  50%     { box-shadow: 0 0 0 8px rgba(22,163,74,.08); }
}
.verify-expired .verify-dot,
.verify-voided  .verify-dot {
  background: #dc2626;
  box-shadow: 0 0 0 4px rgba(220,38,38,.15);
  animation: verifyDotPulseRed 2.4s ease-in-out infinite;
}
@keyframes verifyDotPulseRed {
  0%,100% { box-shadow: 0 0 0 4px rgba(220,38,38,.15); }
  50%     { box-shadow: 0 0 0 8px rgba(220,38,38,.08); }
}

/* ── Details section ── */
.verify-details-section {
  padding: 5rem max(24px, 5vw) 7rem;
  background: var(--bg-2);
  border-top: 1px solid var(--divide);
}
.verify-details-section .inner { max-width: 820px; margin: 0 auto; }
.verify-details-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  background: var(--divide);
  border: 1px solid var(--divide);
  border-radius: 20px;
  overflow: hidden;
}
.verify-detail {
  background: var(--bg);
  padding: 1.75rem 1.5rem;
}
.verify-detail-label {
  font-size: .66rem; font-weight: 500;
  letter-spacing: .14em; text-transform: uppercase;
  color: var(--text-3);
  margin: 0 0 .5rem;
}
.verify-detail-value {
  font-size: 1.02rem; font-weight: 500;
  color: var(--text-1);
  margin: 0; line-height: 1.4;
  word-break: break-word;
}
.verify-mono { font-variant-numeric: tabular-nums; letter-spacing: .01em; }
.verify-status-valid   { color: #16a34a !important; }
.verify-status-expired { color: #dc2626 !important; }
.verify-status-voided  { color: #dc2626 !important; }

.verify-footnote {
  margin: 3rem auto 0;
  max-width: 560px;
  text-align: center;
  font-size: .88rem; font-weight: 300;
  color: var(--text-2); line-height: 1.7;
}
.verify-footnote a {
  color: var(--blue);
  text-decoration: none;
  border-bottom: 1px solid rgba(0,92,185,.3);
  transition: border-color .2s;
}
.verify-footnote a:hover { border-color: var(--blue); }

@media (max-width: 720px) {
  .verify-hero { padding: 7rem max(20px, 4vw) 3.5rem; }
  .verify-hero-sub { margin-bottom: 3rem; }
  .verify-details-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 460px) {
  .verify-card-body { grid-template-columns: 86px 1fr; gap: 1rem; }
  .verify-card-photo { width: 86px; height: 114px; }
  .verify-card { padding: 1.35rem 1.35rem 1.25rem; }
  .verify-details-grid { grid-template-columns: 1fr; }
}

/* ─── CONTACT PAGE ─── */
.contact-phone-banner {
  padding: 5rem max(24px, 5vw);
  background: var(--bg);
  text-align: center;
  border-bottom: 1px solid var(--divide);
}
.contact-phone-label {
  font-size: .72rem; font-weight: 500;
  letter-spacing: .18em; text-transform: uppercase;
  color: var(--text-3); margin-bottom: 1.25rem;
}
.contact-phone-number {
  font-family: 'Syne', system-ui, sans-serif;
  display: inline-block;
  font-size: clamp(2.5rem, 7vw, 5rem);
  font-weight: 700;
  letter-spacing: -.03em;
  color: var(--blue);
  text-decoration: none;
  line-height: 1;
  transition: color .2s;
}
.contact-phone-number:hover { color: var(--amber); }
.contact-phone-note {
  font-size: .85rem; font-weight: 300; color: var(--text-2);
  margin-top: 1.5rem; max-width: 520px; margin-left: auto; margin-right: auto;
  line-height: 1.6;
}

.contact-grid {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px;
  margin-top: 2.5rem;
}
.contact-card {
  position: relative;
  display: block;
  border: 1px solid var(--divide);
  border-radius: 18px;
  padding: 1.75rem 1.75rem 1.75rem 1.75rem;
  background: var(--bg);
  color: inherit;
  text-decoration: none;
  transition: border-color .25s, background .25s, transform .25s;
}
.contact-card:hover { border-color: var(--blue); background: #fff; transform: translateY(-2px); }
@media (prefers-color-scheme: dark) { .contact-card:hover { background: var(--bg-3); } }
.contact-card-label {
  font-size: .68rem; font-weight: 600;
  letter-spacing: .14em; text-transform: uppercase;
  color: var(--blue);
  margin: 0 0 .65rem;
}
.contact-card h3 {
  font-family: system-ui, -apple-system, sans-serif;
  font-size: 1.25rem; font-weight: 700;
  letter-spacing: -.015em; line-height: 1.3;
  color: var(--text-1); margin: 0 0 .75rem;
  word-break: break-word;
}
.contact-card p {
  font-size: .88rem; font-weight: 300;
  color: var(--text-2); line-height: 1.65; margin: 0;
}
.contact-card-arrow {
  position: absolute; top: 1.75rem; right: 1.75rem;
  width: 32px; height: 32px; border-radius: 50%;
  background: var(--bg-2); color: var(--text-3);
  display: flex; align-items: center; justify-content: center;
  font-size: 1.1rem; font-weight: 400;
  transition: background .2s, color .2s;
}
.contact-card:hover .contact-card-arrow { background: var(--blue); color: #fff; }
@media (max-width: 720px) { .contact-grid { grid-template-columns: 1fr; } }

.office-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; margin-top: 2.5rem; }
.office-card {
  border: 1px solid var(--divide);
  border-radius: 18px;
  padding: 2rem 2rem 2rem;
  background: var(--bg-2);
  transition: border-color .25s, transform .25s;
}
.office-card:hover { border-color: var(--blue); transform: translateY(-2px); }
.office-tag {
  font-size: .68rem; font-weight: 600;
  letter-spacing: .14em; text-transform: uppercase;
  color: var(--text-3); margin: 0 0 .6rem;
}
.office-card h3 {
  font-family: 'Syne', system-ui, sans-serif;
  font-size: clamp(1.4rem, 2.2vw, 1.85rem);
  font-weight: 700; letter-spacing: -.02em;
  color: var(--text-1); margin: 0 0 1.25rem;
}
.office-card address {
  font-size: .95rem; font-weight: 400;
  color: var(--text-2); font-style: normal;
  line-height: 1.75; margin-bottom: 1.5rem;
}
.office-map-link {
  font-size: .82rem; font-weight: 500; color: var(--blue);
  text-decoration: none;
  transition: color .2s;
}
.office-map-link:hover { color: var(--amber); }
@media (max-width: 720px) { .office-grid { grid-template-columns: 1fr; } }

.emergency-banner {
  background: #06101e;
  color: #fff;
  padding: 3.5rem max(24px, 5vw);
}
.emergency-banner .inner {
  max-width: 1100px;
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 2rem;
  align-items: center;
}
.emergency-icon {
  width: 64px; height: 64px; border-radius: 50%;
  background: rgba(255,183,27,.12);
  border: 1px solid rgba(255,183,27,.3);
  display: flex; align-items: center; justify-content: center;
  color: var(--amber);
  flex-shrink: 0;
}
.emergency-body h3 {
  font-size: 1.15rem; font-weight: 700;
  color: #fff; margin: 0 0 .3rem;
}
.emergency-body p {
  font-size: .9rem; font-weight: 300;
  color: rgba(255,255,255,.6); margin: 0; line-height: 1.6;
}
.emergency-body a {
  color: var(--amber); text-decoration: none;
  border-bottom: 1px solid rgba(255,183,27,.3);
  transition: border-color .2s;
}
.emergency-body a:hover { border-color: var(--amber); }
.emergency-cta { background: var(--amber) !important; color: #000 !important; white-space: nowrap; }
@media (max-width: 720px) {
  .emergency-banner .inner { grid-template-columns: 1fr; text-align: center; gap: 1.25rem; }
  .emergency-icon { margin: 0 auto; }
  .emergency-cta { justify-self: center; }
}

/* ─── CAREERS: BENEFITS GRID ─── */
.benefits-grid {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px;
  margin-top: 3rem;
}
.benefit-card {
  border: 1px solid var(--divide); border-radius: 18px;
  padding: 1.75rem 1.5rem;
  display: flex; flex-direction: column; gap: .85rem;
  transition: border-color .25s, background .25s, transform .25s;
  background: var(--bg);
}
.benefit-card:hover { border-color: var(--amber); background: var(--bg-2); transform: translateY(-2px); }
.benefit-emoji { font-size: 2rem; line-height: 1; }
.benefit-card h3 { font-size: .95rem; font-weight: 600; color: var(--text-1); line-height: 1.3; }
.benefit-card p { font-size: .82rem; font-weight: 300; color: var(--text-2); line-height: 1.65; }
@media (max-width: 1000px) { .benefits-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 720px)  { .benefits-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 460px)  { .benefits-grid { grid-template-columns: 1fr; } }

/* ─── SINGLE JOB PAGE ─── */
.job-header {
  position: relative;
  background: linear-gradient(135deg, #030d1e 0%, #0a1f3a 60%, #061225 100%);
  color: #fff;
  padding: 9rem max(24px, 5vw) 5rem;
  overflow: hidden;
}
body.admin-bar .job-header { padding-top: calc(9rem + 32px); }
@media (max-width: 782px) { body.admin-bar .job-header { padding-top: calc(9rem + 46px); } }
@media (max-width: 600px) { body.admin-bar .job-header { padding-top: 9rem; } }
.job-header::before {
  content: ''; position: absolute; inset: 0;
  background: radial-gradient(ellipse at 20% 30%, rgba(0,92,185,.25) 0%, transparent 55%);
  pointer-events: none;
}
.job-header > .inner { position: relative; z-index: 1; }
.job-breadcrumb { font-size: .78rem; letter-spacing: .1em; text-transform: uppercase; margin-bottom: 2rem; }
.job-breadcrumb a { color: rgba(255,255,255,.55); text-decoration: none; transition: color .2s; }
.job-breadcrumb a:hover { color: var(--amber); }

.job-header-main { max-width: 820px; }
.job-logo {
  width: 72px; height: 72px;
  object-fit: contain;
  border-radius: 14px;
  background: #fff;
  padding: 10px;
  margin-bottom: 1.75rem;
  border: 1px solid rgba(255,255,255,.15);
}
.job-title {
  font-family: 'Syne', system-ui, sans-serif;
  font-size: clamp(2rem, 5vw, 3.5rem);
  font-weight: 700; letter-spacing: -.02em; line-height: 1.05;
  color: #fff; margin: 0 0 .75rem;
}
.job-company {
  font-size: 1.05rem; font-weight: 400;
  color: rgba(255,255,255,.75);
  margin: 0 0 1.75rem;
}
.job-meta-row {
  display: flex; flex-wrap: wrap; gap: .5rem .85rem;
  align-items: center;
  margin-bottom: 2.25rem;
}
.job-meta-item {
  display: inline-flex; align-items: center; gap: .4rem;
  font-size: .82rem; font-weight: 400;
  color: rgba(255,255,255,.7);
}
.job-meta-item svg { flex-shrink: 0; opacity: .65; }
.job-meta-pill {
  padding: .3rem .8rem;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 980px;
  font-size: .68rem; font-weight: 500;
  letter-spacing: .1em; text-transform: uppercase;
  color: rgba(255,255,255,.85);
}
.job-meta-pill.job-type { background: var(--blue); border-color: transparent; color: #fff; }
.job-meta-item.job-posted { color: rgba(255,255,255,.45); font-size: .78rem; }

.job-header-cta { display: flex; flex-wrap: wrap; gap: 10px; }
.job-header-cta .btn-blue { background: var(--amber); color: #111; }
.job-header-cta .btn-blue:hover { opacity: .92; }
.job-btn-ghost { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.18); }

.job-filled-banner {
  display: inline-block;
  padding: .7rem 1.5rem; border-radius: 980px;
  background: rgba(255,255,255,.1);
  border: 1px solid rgba(255,255,255,.18);
  font-size: .85rem; font-weight: 500;
  color: rgba(255,255,255,.85);
  letter-spacing: .02em;
}

/* Body grid: article + sidebar */
.job-body-section { padding: 5rem max(24px, 5vw) 6rem; background: var(--bg); }
.job-body-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 4rem;
  align-items: start;
}
.job-body {
  font-size: 1rem;
  line-height: 1.8;
  color: var(--text-2);
  min-width: 0;
}
.job-body h1, .job-body h2, .job-body h3, .job-body h4 {
  font-family: system-ui, -apple-system, sans-serif;
  font-weight: 700;
  color: var(--text-1);
  letter-spacing: -.015em;
  line-height: 1.25;
}
.job-body h2 { font-size: 1.6rem; margin: 2.75rem 0 1rem; }
.job-body h3 { font-size: 1.2rem; margin: 2rem 0 .75rem; }
.job-body h4 { font-size: 1rem; margin: 1.5rem 0 .5rem; }
.job-body p { margin-bottom: 1.1rem; }
.job-body ul, .job-body ol { margin: .75rem 0 1.5rem 1.25rem; }
.job-body li { margin-bottom: .45rem; }
.job-body strong { color: var(--text-1); font-weight: 600; }
.job-body a { color: var(--blue); text-decoration: none; border-bottom: 1px solid rgba(0,92,185,.3); transition: border-color .2s; }
.job-body a:hover { border-color: var(--blue); }
.job-body hr { border: none; border-top: 1px solid var(--divide); margin: 2.5rem 0; }
.job-body img { border-radius: 12px; margin: 1.5rem 0; }

.job-sidebar { position: sticky; top: 90px; }
body.admin-bar .job-sidebar { top: 122px; }
.job-side-card {
  background: var(--bg-2);
  border: 1px solid var(--divide);
  border-radius: 18px;
  padding: 1.75rem;
}
.job-side-card .label { margin-bottom: 1.25rem; }
.job-side-list {
  list-style: none; padding: 0; margin: 0 0 1.75rem;
  display: flex; flex-direction: column; gap: .9rem;
}
.job-side-list li {
  display: flex; flex-direction: column; gap: .15rem;
  padding-bottom: .9rem;
  border-bottom: 1px solid var(--divide);
}
.job-side-list li:last-child { border-bottom: none; padding-bottom: 0; }
.job-side-list li span {
  font-size: .66rem; font-weight: 500;
  letter-spacing: .12em; text-transform: uppercase;
  color: var(--text-3);
}
.job-side-list li strong {
  font-size: .92rem; font-weight: 500;
  color: var(--text-1);
  line-height: 1.4;
}
.job-side-apply {
  display: block; text-align: center; width: 100%;
  padding: .9rem 1rem;
}
.job-side-link { margin-top: 1.25rem; text-align: center; }
.job-side-link a {
  font-size: .82rem; color: var(--text-2);
  text-decoration: none; transition: color .2s;
}
.job-side-link a:hover { color: var(--text-1); }

@media (max-width: 900px) {
  .job-body-grid { grid-template-columns: 1fr; gap: 2.5rem; }
  .job-sidebar { position: static; top: auto; order: -1; }
  .job-side-card { padding: 1.5rem; }
}
@media (max-width: 600px) {
  .job-header { padding: 7rem max(24px, 5vw) 4rem; }
  .job-logo { width: 56px; height: 56px; margin-bottom: 1.25rem; }
  .job-body-section { padding: 3.5rem max(24px, 5vw) 5rem; }
}

/* ─── WP JOB MANAGER LISTINGS ─── */
/* Hide filters/search UI, we list jobs directly. */
.job_filters, .job-manager-info { display: none !important; }

/* Outer UL becomes a grid of image cards. */
ul.job_listings {
  list-style: none !important;
  margin: 2.5rem 0 0 !important;
  padding: 0 !important;
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 12px !important;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
}
ul.job_listings li.no_job_listings_found,
.no_job_listings_found {
  list-style: none !important;
  padding: 3rem 2rem !important;
  text-align: center !important;
  color: var(--text-2) !important;
  font-size: .95rem !important;
  font-weight: 300 !important;
  background: var(--bg) !important;
  border: 1px solid var(--divide) !important;
  border-radius: 18px !important;
  margin: 0 !important;
  grid-column: 1 / -1 !important;
}

li.job-card,
ul.job_listings li.job-card,
ul.job_listings li.job_listing.job-card {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  border-radius: 20px !important;
  overflow: hidden !important;
  background: #0a1a2e !important;
  aspect-ratio: 4 / 3 !important;
  box-shadow: none !important;
  position: relative !important;
  transition: transform .4s cubic-bezier(.25,.46,.45,.94) !important;
}
li.job-card:hover { transform: scale(1.018) !important; }
li.job-card.job-card-filled { opacity: .55; }

.job-card-link,
ul.job_listings li.job-card a.job-card-link,
ul.job_listings li.job_listing.job-card > a {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: visible !important;
  line-height: normal !important;
  color: inherit !important;
  text-decoration: none !important;
  background: transparent !important;
}
ul.job_listings li.job-card a.job-card-link:hover,
ul.job_listings li.job_listing.job-card > a:hover,
ul.job_listings li.job-card a.job-card-link:focus,
ul.job_listings li.job_listing.job-card > a:focus { background: transparent !important; }

.job-card-bg {
  position: absolute; inset: 0;
  background-size: cover; background-position: center;
  opacity: .6;
  transition: opacity .5s ease, transform .6s ease;
}
li.job-card:hover .job-card-bg { opacity: .75; transform: scale(1.04); }

.job-card-veil {
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,.15) 0%, rgba(0,0,0,.55) 55%, rgba(0,0,0,.85) 100%);
}

.job-card-body {
  position: relative; z-index: 2;
  padding: 1.75rem;
  height: 100%;
  display: flex; flex-direction: column; justify-content: space-between;
  color: #fff;
}

.job-card-tag {
  font-size: .62rem; font-weight: 600;
  letter-spacing: .14em; text-transform: uppercase;
  color: var(--amber);
  margin: 0 0 .5rem;
}
.job-card-title {
  font-family: 'Syne', system-ui, sans-serif;
  font-size: clamp(1.25rem, 1.8vw, 1.6rem);
  font-weight: 700; letter-spacing: -.02em; line-height: 1.15;
  color: #fff;
  margin: 0;
}

.job-card-foot {
  display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem;
}
.job-card-meta {
  display: flex; flex-direction: column; gap: .4rem;
  font-size: .82rem; font-weight: 400;
  color: rgba(255,255,255,.82);
  text-shadow: 0 1px 2px rgba(0,0,0,.3);
}
.job-card-meta-item {
  display: inline-flex; align-items: center; gap: .45rem;
}
.job-card-meta-item svg { opacity: .7; flex-shrink: 0; }

.job-card-arrow {
  width: 36px; height: 36px; border-radius: 50%;
  border: 1px solid rgba(255,255,255,.25);
  display: flex; align-items: center; justify-content: center;
  color: rgba(255,255,255,.7);
  flex-shrink: 0;
  transition: border-color .2s, background .2s, color .2s;
}
li.job-card:hover .job-card-arrow { border-color: var(--amber); background: var(--amber); color: #000; }

.load_more_jobs {
  display: block !important;
  margin: 1.75rem auto 0 !important;
  padding: .75rem 1.75rem !important;
  background: var(--blue) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 980px !important;
  font-size: .9rem !important;
  font-weight: 500 !important;
  cursor: pointer !important;
  transition: opacity .2s !important;
}
.load_more_jobs:hover { opacity: .82 !important; }

@media (max-width: 900px) {
  ul.job_listings { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 560px) {
  ul.job_listings { grid-template-columns: 1fr !important; }
  li.job-card { aspect-ratio: 5 / 3 !important; }
  .job-card-body { padding: 1.25rem; }
}

/* ─── CASE STUDIES (cards + listing) ─── */
#cases { background: #06101e; }
#cases .label { color: rgba(255,255,255,.35); }
#cases .title { color: #fff; }
.cases-head { margin-bottom: 3rem; }
.cases-head .title { font-size: clamp(1.8rem, 3vw, 2.75rem); max-width: 520px; }
.case-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.case-card {
  border-radius: 20px; overflow: hidden;
  position: relative; aspect-ratio: 4/3;
  background: #0a1a2e; cursor: pointer;
  transition: transform .4s cubic-bezier(.25,.46,.45,.94);
  text-decoration: none; display: block;
}
.case-card:hover { transform: scale(1.018); }
.case-card-bg { position: absolute; inset: 0; background-size: cover; background-position: center; opacity: .45; transition: opacity .5s ease, transform .6s ease; }
.case-card:hover .case-card-bg { opacity: .65; transform: scale(1.04); }
.case-card-veil { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,.15) 0%, rgba(0,0,0,.78) 100%); }
.case-card-body { position: relative; z-index: 2; padding: 1.75rem; height: 100%; display: flex; flex-direction: column; justify-content: space-between; }
.case-tag { font-size: .62rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--amber); }
.case-title { font-size: 1.15rem; font-weight: 700; color: #fff; line-height: 1.25; margin-top: .35rem; }
.case-desc { font-size: .78rem; color: rgba(255,255,255,.5); line-height: 1.6; margin-top: .4rem; }
.case-arrow { width: 34px; height: 34px; border-radius: 50%; border: 1px solid rgba(255,255,255,.2); display: flex; align-items: center; justify-content: center; color: rgba(255,255,255,.55); align-self: flex-start; transition: border-color .2s, background .2s, color .2s; }
.case-card:hover .case-arrow { border-color: var(--amber); background: var(--amber); color: #000; }

/* ─── CASE STUDY ARCHIVE / SINGLE ─── */
.page-head {
  padding: 10rem max(24px, 5vw) 4rem;
  background: var(--bg);
  border-bottom: 1px solid var(--divide);
}
.page-head .inner { text-align: center; }
.page-head .title { font-size: clamp(2.2rem, 5vw, 3.5rem); margin-top: .5rem; }
.page-head .body-copy { max-width: 560px; margin: 1.25rem auto 0; }

.case-archive { padding: 5rem max(24px, 5vw) 8rem; background: var(--bg); }
.case-archive .case-grid { grid-template-columns: repeat(3, 1fr); }

.case-single {
  padding: 10rem max(24px, 5vw) 6rem;
  background: var(--bg);
}
.case-single .inner { max-width: 820px; }
.case-single .case-meta {
  display: flex; align-items: center; gap: 1rem;
  font-size: .75rem; font-weight: 500; letter-spacing: .14em; text-transform: uppercase;
  color: var(--text-2); margin-bottom: 1.25rem;
}
.case-single .case-meta span + span::before {
  content: '·'; margin-right: 1rem; color: var(--text-3);
}
.case-single h1 {
  font-family: 'Syne', system-ui, sans-serif;
  font-size: clamp(2rem, 5vw, 3.5rem);
  font-weight: 700; letter-spacing: -.02em; line-height: 1.07;
  color: var(--text-1); margin-bottom: 1.5rem;
}
.case-single .case-lede {
  font-size: 1.15rem; font-weight: 300; color: var(--text-2);
  line-height: 1.72; margin-bottom: 3rem;
}
.case-single .case-hero-img {
  width: 100%; aspect-ratio: 16/9;
  object-fit: cover; border-radius: 20px;
  margin: 0 0 4rem;
}
.case-body { font-size: 1rem; line-height: 1.8; color: var(--text-2); }
.case-body h2 { font-family: system-ui, -apple-system, sans-serif; font-weight: 700; letter-spacing: -.02em; color: var(--text-1); font-size: 1.75rem; margin: 3rem 0 1rem; }
.case-body h3 { font-family: system-ui, -apple-system, sans-serif; font-weight: 700; color: var(--text-1); font-size: 1.25rem; margin: 2.25rem 0 .85rem; }
.case-body p { margin-bottom: 1.25rem; }
.case-body ul, .case-body ol { margin: 1rem 0 1.5rem 1.5rem; }
.case-body li { margin-bottom: .5rem; }
.case-body a { color: var(--blue); text-decoration: none; border-bottom: 1px solid rgba(0,92,185,.3); transition: border-color .2s; }
.case-body a:hover { border-color: var(--blue); }
.case-body img { border-radius: 14px; margin: 2rem 0; }
.case-body blockquote {
  margin: 2rem 0;
  padding: 1.5rem 2rem;
  border-left: 3px solid var(--amber);
  background: var(--bg-2);
  border-radius: 0 14px 14px 0;
  font-size: 1.1rem; font-style: normal; color: var(--text-1);
}

.case-nav {
  border-top: 1px solid var(--divide);
  padding: 4rem max(24px, 5vw);
  background: var(--bg-2);
}
.case-nav .inner { max-width: 820px; display: flex; justify-content: space-between; gap: 2rem; flex-wrap: wrap; }
.case-nav a { color: var(--text-2); font-size: .9rem; text-decoration: none; transition: color .2s; }
.case-nav a:hover { color: var(--text-1); }
.case-nav .case-nav-label { font-size: .7rem; letter-spacing: .14em; text-transform: uppercase; color: var(--text-3); margin-bottom: .35rem; display: block; }

/* ─── GENERIC WP PAGE / VERIFY CPT PAGE ─── */
.wp-page { padding: 10rem max(24px, 5vw) 6rem; background: var(--bg); }
.wp-page .inner { max-width: 820px; }
.wp-page h1 {
  font-family: 'Syne', system-ui, sans-serif;
  font-size: clamp(2rem, 5vw, 3.5rem);
  font-weight: 700; letter-spacing: -.02em; line-height: 1.07;
  color: var(--text-1); margin-bottom: 2rem;
}
.wp-page .page-content { font-size: 1rem; line-height: 1.8; color: var(--text-2); }
.wp-page .page-content h2, .wp-page .page-content h3 { color: var(--text-1); font-weight: 700; margin: 2rem 0 1rem; letter-spacing: -.02em; }
.wp-page .page-content h2 { font-size: 1.75rem; }
.wp-page .page-content h3 { font-size: 1.25rem; }
.wp-page .page-content p { margin-bottom: 1.25rem; }
.wp-page .page-content ul, .wp-page .page-content ol { margin: 1rem 0 1.5rem 1.5rem; }
.wp-page .page-content a { color: var(--blue); text-decoration: none; border-bottom: 1px solid rgba(0,92,185,.3); }

/* ─── FOOTER ─── */
footer {
  background: var(--bg-2);
  border-top: 1.5px solid var(--amber);
  padding: 4.5rem max(24px, 5vw) 2.5rem;
}
.foot-grid { display: grid; grid-template-columns: 1.6fr 1fr 1fr; gap: 3rem; margin-bottom: 3.5rem; }
.foot-logo { margin-bottom: 1.1rem; }
.foot-logo img { height: 34px; width: auto; }
@media (prefers-color-scheme: dark) { .foot-logo img { filter: brightness(1.3); } }
.foot-tag { font-size: .875rem; font-weight: 300; color: var(--text-2); line-height: 1.72; max-width: 280px; }
.foot-col h4 { font-size: .68rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--text-1); margin-bottom: 1.1rem; }
.foot-col ul { list-style: none; display: flex; flex-direction: column; gap: .6rem; }
.foot-col a { font-size: .875rem; font-weight: 300; color: var(--text-2); text-decoration: none; transition: color .2s; }
.foot-col a:hover { color: var(--text-1); }
.foot-bottom { border-top: 1px solid var(--divide); padding-top: 1.5rem; display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px; }
.foot-bottom p { font-size: .78rem; color: var(--text-3); }

/* ─── RESPONSIVE ─── */
@media (max-width: 1200px) { .card-grid { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 1000px) {
  .who-grid { grid-template-columns: repeat(3, 1fr); }
  .commitment-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 900px) {
  .card-grid { grid-template-columns: repeat(2, 1fr); }
  .disc-grid { grid-template-columns: repeat(12, 1fr); }
  .disc-grid .scard { grid-column: span 3; }
  .dc-inner { grid-template-columns: 1fr !important; gap: 2.5rem !important; }
  .frow, .frow.flip { grid-template-columns: 1fr; direction: ltr; }
  .fimg { min-height: 300px; }
  .ftext { padding: 4rem max(24px, 5vw); }
  .ftext p { max-width: 100%; }
  .foot-grid { grid-template-columns: 1fr; gap: 2rem; }
  .services-head-row { grid-template-columns: 1fr; gap: 1.5rem; }
  .case-grid { grid-template-columns: repeat(2, 1fr); }
  .case-archive .case-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
  .nav-links { display: none; }
  .nav-toggle { display: block; }
  .nav-links.open {
    display: flex; flex-direction: column; align-items: flex-start;
    position: absolute; top: 56px; left: 0; right: 0;
    background: var(--nav-bg); backdrop-filter: blur(24px);
    padding: 1.5rem max(24px, 5vw) 2rem; gap: 1.5rem;
    border-bottom: 1px solid var(--divide);
  }
  .nav-links.open a { font-size: 1rem; color: var(--text-1) !important; }
  .nav-links.open .nav-dropdown-menu {
    position: static; transform: none; opacity: 1; visibility: visible;
    pointer-events: all; background: transparent; border: none;
    box-shadow: none; padding: 0; min-width: 0;
  }
  .nav-links.open .nav-dropdown-menu li a { font-size: .9rem !important; padding-left: 1rem; }
  .stats-row { grid-template-columns: 1fr; }
  .stat + .stat::before { top: 0; left: 15%; right: 15%; width: auto; height: 1px; bottom: auto; }
  .stages-wrap { grid-template-columns: 1fr; gap: 2.5rem; }
  .stages-wrap::before { display: none; }
  .service-icon-grid { grid-template-columns: repeat(3, 1fr); }
  .stats-inline { grid-template-columns: repeat(2, 1fr); }
  .section { padding: 5.5rem max(24px, 5vw); }
}
@media (max-width: 560px) {
  .card-grid { grid-template-columns: repeat(2, 1fr); }
  .disc-grid { grid-template-columns: repeat(4, 1fr); }
  .disc-grid .scard { grid-column: span 2; }
  .scard { aspect-ratio: 4/3; }
  .scard-desc { display: none; }
  .service-icon-grid { grid-template-columns: repeat(2, 1fr); }
  .who-grid { grid-template-columns: repeat(2, 1fr); }
  .case-grid { grid-template-columns: 1fr; }
  .case-archive .case-grid { grid-template-columns: 1fr; }
  .commitment-grid { grid-template-columns: 1fr; }
  .hero-btns { flex-direction: column; align-items: flex-start; }
}
