/*
Theme Name:   Ashridge Group
Theme URI:    https://ashridge-group.com
Description:  Editorial brand-led child theme of html5blank. Maps Ashridge Group brand guidelines (Design_Guidelines_3.html) to web. Hairline rules, near-zero radius, serif headings, Söhne body, photo-led heroes with scrim overlays.
Author:       Ashridge Group
Template:     html5blank
Version:      1.0.0
Text Domain:  ashridge-group
Tags:         brand, editorial, responsive
*/

/* =============================================================
   TOKENS — sourced from Design_Guidelines_3.html
   ============================================================= */
:root {
  /* Brand artwork colours — match SVG fills */
  --logo-mark-grey:  #939598;
  --logo-mark-berry: #97005D;

  /* Primary palette (UI tokens, WCAG-tuned) */
  --berry:        #862759;
  --berry-dark:   #5A1A3A;
  --berry-mid:    #6E2049;
  --berry-light:  #F9EFF4;

  --near-black:   #1A1A1A;
  --white:        #FFFFFF;
  --warm-white:   #F8F5F6;
  --logo-grey:    #737373;
  --mid-grey:     #6B6B6B;
  --nav-grey:     #A5A4A4;

  --border:        #DDD8D9;
  --border-subtle: #EDE8EA;

  /* Divisional accents */
  --fac-green: #007A22;
  --sec-gold:  #C8962A;
  --cog-cyan:  #0094CD;

  /* Status */
  --status-ok:    #16A34A;
  --status-warn:  #D97706;
  --status-error: #DC2626;
  --status-info:  #2563EB;

  /* Type stack — Test fonts ship per user direction (EULA risk acknowledged) */
  --font-heading: 'Source Serif 4', 'Source Serif Pro', Georgia, 'Times New Roman', serif;
  --font-body:    'Söhne', 'TestSohne', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-label:   var(--font-body);
  --font-italic:  Georgia, 'Times New Roman', serif;
  --font-mono:    'Söhne Mono', 'TestSohneMono', 'JetBrains Mono', 'Courier New', monospace;

  /* Borders + radius */
  --border-thin: 0.5px solid var(--border);
  --border-std:  1px solid var(--border);
  --radius:    3px;
  --radius-sm: 2px;

  /* Spacing */
  --space-4:  4px;   --space-8:  8px;   --space-12: 12px;
  --space-16: 16px;  --space-24: 24px;  --space-32: 32px;
  --space-40: 40px;  --space-48: 48px;  --space-64: 64px;
  --space-80: 80px;

  /* Layout */
  --content-width: 1200px;
  --prose-width:    720px;
  --nav-height:     52px;

  /* Motion */
  --ease:     cubic-bezier(0.2, 0.7, 0.2, 1);
  --dur-fast: 150ms;
  --dur-std:  200ms;
}

/* =============================================================
   FONT FACE — Söhne Test fonts (local install for development;
   replace with licensed woff2 before production launch)
   ============================================================= */
@font-face {
  font-family: 'TestSohne';
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  src: local('Söhne'), local('Sohne');
}
@font-face {
  font-family: 'TestSohne';
  font-weight: 600;
  font-style: normal;
  font-display: swap;
  src: local('Söhne Halbfett'), local('Sohne Halbfett');
}
@font-face {
  font-family: 'TestSohne';
  font-weight: 700;
  font-style: normal;
  font-display: swap;
  src: local('Söhne Kräftig'), local('Sohne Kraftig');
}

/* =============================================================
   RESET — minimal, brand-aware
   ============================================================= */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; }
body {
  background: var(--warm-white);
  color: var(--near-black);
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}
img, svg, picture { max-width: 100%; display: block; }
button { border: 0; background: transparent; font: inherit; color: inherit; cursor: pointer; }
a { color: var(--berry); text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1px; transition: color var(--dur-fast) var(--ease); }
a:hover { color: var(--berry-dark); }
::selection { background: var(--berry); color: var(--white); }

/* Reset html5blank parent rule that adds margin to every main child */
main * + * { margin-top: 0; }

/* =============================================================
   ACCESSIBILITY
   ============================================================= */
.visually-hidden {
  position: absolute; width: 1px; height: 1px; padding: 0;
  margin: -1px; overflow: hidden; clip: rect(0,0,0,0); border: 0;
}
a.skip-link {
  position: absolute; left: -9999px; top: 0; z-index: 1000;
  background: var(--berry); color: var(--white);
  padding: 12px 20px; text-decoration: none;
}
a.skip-link:focus { left: 0; }

:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(134, 39, 89, 0.35);
  border-radius: var(--radius-sm);
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* =============================================================
   TYPOGRAPHY
   ============================================================= */
h1, h2, h3, h4, h5, h6 { font-family: var(--font-heading); color: var(--near-black); font-weight: 700; letter-spacing: -0.01em; line-height: 1.15; }

h1 { font-size: clamp(40px, 5.5vw, 72px); font-weight: 400; letter-spacing: -0.02em; line-height: 1.05; }
h2 { font-size: clamp(28px, 3.4vw, 40px); font-weight: 700; letter-spacing: -0.02em; }
h3 { font-size: clamp(22px, 2.2vw, 26px); font-weight: 600; }
h4 { font-size: 18px; font-weight: 600; }

p { font-size: 16px; line-height: 1.65; }
.lede { font-size: clamp(18px, 1.6vw, 22px); line-height: 1.5; color: var(--near-black); }
.small { font-size: 13px; color: var(--mid-grey); }
.mono  { font-family: var(--font-mono); }

/* Brand-signature pattern: eyebrow / kicker label */
.eyebrow {
  font-family: var(--font-label);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--logo-grey);
  display: inline-block;
}
.eyebrow--berry { color: var(--berry); }
.eyebrow--white { color: rgba(255, 255, 255, 0.7); }
.eyebrow--green { color: var(--fac-green); }
.eyebrow--gold  { color: var(--sec-gold); }
.eyebrow--cyan  { color: var(--cog-cyan); }

/* Pull quote — Georgia italic per brand */
.pull-quote {
  font-family: var(--font-italic);
  font-style: italic;
  font-size: clamp(20px, 2.2vw, 28px);
  line-height: 1.4;
  color: var(--near-black);
  border-left: 2px solid var(--berry);
  padding-left: var(--space-24);
  max-width: var(--prose-width);
}
.pull-quote cite {
  display: block;
  font-family: var(--font-label);
  font-style: normal;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--logo-grey);
  margin-top: var(--space-16);
}

/* =============================================================
   LAYOUT — sections + wrappers
   ============================================================= */
.section { padding: clamp(48px, 7vw, 80px) clamp(20px, 4vw, 40px); }
.section + .section { border-top: var(--border-thin); }
.section--alt { background: var(--warm-white); }
.section--white { background: var(--white); }
.section--dark { background: var(--near-black); color: rgba(255,255,255,0.85); }
.section--berry { background: var(--berry); color: var(--white); }

.wrap { max-width: var(--content-width); margin: 0 auto; }
.wrap--prose { max-width: var(--prose-width); margin: 0 auto; }

.section-header { display: flex; flex-direction: column; gap: var(--space-12); margin-bottom: var(--space-48); }

.stack-8  > * + * { margin-top: var(--space-8); }
.stack-12 > * + * { margin-top: var(--space-12); }
.stack-16 > * + * { margin-top: var(--space-16); }
.stack-24 > * + * { margin-top: var(--space-24); }
.stack-32 > * + * { margin-top: var(--space-32); }
.stack-48 > * + * { margin-top: var(--space-48); }

.hairline { height: 0.5px; background: var(--border); border: 0; margin: var(--space-48) 0; }
.hairline--white { background: rgba(255,255,255,0.2); }

/* =============================================================
   NAV — slim fixed berry bar, single header (mobile + desktop)
   ============================================================= */
.site-header {
  position: fixed; top: 0; left: 0; right: 0;
  height: var(--nav-height);
  background: var(--berry);
  color: var(--white);
  z-index: 100;
  display: flex; align-items: center;
  border-bottom: 0.5px solid rgba(255,255,255,0.1);
}
.site-header__inner {
  width: 100%; max-width: var(--content-width); margin: 0 auto;
  padding: 0 clamp(16px, 3vw, 32px);
  display: flex; align-items: center; justify-content: space-between; gap: var(--space-24);
}
.site-header__logo { display: block; height: 28px; flex-shrink: 0; }
.site-header__logo img, .site-header__logo svg { height: 100%; width: auto; filter: brightness(0) invert(1); }

.site-nav { display: none; }
.site-nav ul { list-style: none; display: flex; gap: var(--space-24); align-items: center; }
.site-nav a {
  font-family: var(--font-label);
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.7);
  text-decoration: none;
  padding: 8px 0;
  transition: color var(--dur-fast) var(--ease);
}
.site-nav a:hover { color: var(--white); }
.site-nav .current-menu-item > a { color: var(--white); }

.nav-toggle {
  width: 40px; height: 40px;
  display: flex; align-items: center; justify-content: center;
  position: relative;
}
.nav-toggle span,
.nav-toggle span::before,
.nav-toggle span::after {
  display: block; width: 22px; height: 1.5px; background: var(--white);
  transition: transform var(--dur-std) var(--ease), top var(--dur-std) var(--ease);
}
.nav-toggle span { position: relative; }
.nav-toggle span::before, .nav-toggle span::after { content: ''; position: absolute; left: 0; }
.nav-toggle span::before { top: -7px; }
.nav-toggle span::after  { top:  7px; }
.nav-toggle[aria-expanded="true"] span { background: transparent; }
.nav-toggle[aria-expanded="true"] span::before { top: 0; transform: rotate(45deg); }
.nav-toggle[aria-expanded="true"] span::after  { top: 0; transform: rotate(-45deg); }

.nav-overlay {
  position: fixed; inset: 0;
  background: var(--berry);
  z-index: 99;
  padding: calc(var(--nav-height) + var(--space-32)) var(--space-24) var(--space-32);
  display: flex; flex-direction: column;
  transform: translateY(-100%);
  transition: transform var(--dur-std) var(--ease);
  overflow-y: auto;
}
.nav-overlay[data-open="true"] { transform: translateY(0); }
.nav-overlay ul { list-style: none; }
.nav-overlay li + li { border-top: 0.5px solid rgba(255,255,255,0.15); }
.nav-overlay a {
  display: block;
  padding: var(--space-16) 0;
  font-family: var(--font-heading);
  font-size: 24px;
  font-weight: 400;
  color: var(--white);
  text-decoration: none;
}

@media (min-width: 768px) {
  .site-nav { display: block; }
  .nav-toggle { display: none; }
  .nav-overlay { display: none; }
}

/* =============================================================
   FOOTER
   ============================================================= */
.site-footer {
  position: relative;
  background: var(--near-black);
  color: rgba(255,255,255,0.75);
  padding: var(--space-80) clamp(20px, 4vw, 40px) var(--space-32);
  isolation: isolate;
  overflow: hidden;
}
/* Heritage footer-woman.jpg as full-bleed bg ≥768px, w/ dark scrim for legibility */
@media (min-width: 768px) {
  .site-footer::before {
    content: '';
    position: absolute; inset: 0; z-index: -2;
    background: url('/wp-content/uploads/2019/05/footer-woman.jpg') no-repeat center center / cover;
    opacity: 0.5;
  }
  .site-footer::after {
    content: '';
    position: absolute; inset: 0; z-index: -1;
    background: linear-gradient(110deg,
      var(--near-black) 0%,
      rgba(26,26,26,0.95) 38%,
      rgba(26,26,26,0.72) 60%,
      rgba(134,39,89,0.35) 100%);
  }
}
.site-footer > * { position: relative; z-index: 1; }
.site-footer__grid {
  max-width: var(--content-width);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-48);
}
@media (min-width: 768px) {
  .site-footer__grid { grid-template-columns: 1.5fr 1fr 1fr 1fr; }
}
.site-footer__logo { display: block; max-width: 220px; margin-bottom: var(--space-24); }
.site-footer__logo img, .site-footer__logo svg { width: 100%; height: auto; filter: brightness(0) invert(1); }
.site-footer address { font-style: normal; font-size: 14px; line-height: 1.7; }
.site-footer h4 {
  font-family: var(--font-label);
  color: var(--nav-grey);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  margin-bottom: var(--space-16);
}
.site-footer ul { list-style: none; display: flex; flex-direction: column; gap: var(--space-8); }
.site-footer a {
  color: rgba(255,255,255,0.75);
  text-decoration: none;
  font-size: 14px;
  transition: color var(--dur-fast) var(--ease);
}
.site-footer a:hover { color: var(--white); }

.site-footer__bottom {
  max-width: var(--content-width);
  margin: var(--space-48) auto 0;
  padding-top: var(--space-24);
  border-top: 0.5px solid rgba(255,255,255,0.15);
  font-size: 12px;
  color: rgba(255,255,255,0.5);
  line-height: 1.6;
}

#back-to-top {
  position: fixed; bottom: 24px; right: 24px;
  width: 44px; height: 44px;
  border: 1px solid var(--berry);
  background: var(--berry);
  color: var(--white);
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  opacity: 0; pointer-events: none;
  transition: opacity var(--dur-std) var(--ease), background var(--dur-fast) var(--ease);
  z-index: 50;
}
#back-to-top[data-visible="true"] { opacity: 1; pointer-events: auto; }
#back-to-top:hover { background: var(--berry-dark); }
#back-to-top::before {
  content: ''; width: 10px; height: 10px;
  border-top: 1.5px solid currentColor; border-left: 1.5px solid currentColor;
  transform: rotate(45deg) translate(2px, 2px);
}

/* =============================================================
   HERO — photo-led with scrim
   ============================================================= */
.photo-hero {
  position: relative;
  margin-top: var(--nav-height);
  min-height: clamp(440px, 70vh, 720px);
  display: flex; align-items: flex-end;
  overflow: hidden;
  isolation: isolate;
  color: var(--white);
}
.photo-hero--short { min-height: clamp(320px, 50vh, 480px); }
.photo-hero__img {
  position: absolute; inset: 0; z-index: -2;
}
.photo-hero__img img, .photo-hero__img picture, .photo-hero__img source {
  width: 100%; height: 100%; object-fit: cover; object-position: var(--obj-pos, center);
}
.photo-hero__scrim {
  position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(135deg,
    rgba(26, 26, 26, 0.7) 0%,
    rgba(134, 39, 89, 0.45) 55%,
    rgba(26, 26, 26, 0.15) 100%
  );
}
.photo-hero__scrim--light { background: linear-gradient(135deg, rgba(26,26,26,0.45), rgba(134,39,89,0.25) 60%, transparent); }
.photo-hero__scrim--dark  { background: linear-gradient(135deg, rgba(26,26,26,0.85), rgba(134,39,89,0.6) 60%, rgba(26,26,26,0.4)); }

.photo-hero__content {
  position: relative; z-index: 1;
  width: 100%; max-width: var(--content-width); margin: 0 auto;
  padding: var(--space-48) clamp(20px, 4vw, 40px);
}
.photo-hero h1 { color: var(--white); max-width: 800px; margin-bottom: var(--space-24); }
.photo-hero .lede { color: rgba(255,255,255,0.85); max-width: 600px; }
.photo-hero .eyebrow { margin-bottom: var(--space-16); }

.hero-meta {
  margin-top: var(--space-48);
  padding-top: var(--space-32);
  border-top: 0.5px solid rgba(255,255,255,0.4);
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: var(--space-24);
}
.hero-meta__item label {
  display: block;
  font-family: var(--font-label);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.85);
  margin-bottom: var(--space-8);
  text-shadow: 0 1px 2px rgba(0,0,0,0.35);
}
.hero-meta__item p {
  color: var(--white);
  font-size: 14px;
  font-weight: 500;
  text-shadow: 0 1px 2px rgba(0,0,0,0.4);
}

.hero-cta-row { margin-top: var(--space-32); display: flex; flex-wrap: wrap; gap: var(--space-16); }

/* Fallback hero — no photo, solid berry */
.solid-hero {
  background: var(--berry); color: var(--white);
  margin-top: var(--nav-height);
  padding: var(--space-80) clamp(20px, 4vw, 40px);
  min-height: clamp(360px, 55vh, 540px);
  display: flex; align-items: center;
}
.solid-hero h1 { color: var(--white); }
.solid-hero .lede { color: rgba(255,255,255,0.85); margin-top: var(--space-24); }
.solid-hero .eyebrow { margin-bottom: var(--space-16); }

/* =============================================================
   BUTTONS — per brand spec
   ============================================================= */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--space-8);
  font-family: var(--font-body);
  font-size: 14px; font-weight: 600; letter-spacing: 0.02em;
  padding: 12px 22px;
  border-radius: var(--radius-sm);
  border: 1px solid transparent;
  cursor: pointer;
  text-decoration: none;
  line-height: 1;
  min-height: 44px;
  transition: background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease), transform var(--dur-fast) var(--ease);
}
.btn--primary { background: var(--berry); color: var(--white); border-color: var(--berry); }
.btn--primary:hover { background: var(--berry-dark); border-color: var(--berry-dark); color: var(--white); }
.btn--primary:active { background: var(--berry-mid); transform: translateY(0.5px); }

.btn--secondary { background: transparent; color: var(--berry); border-color: var(--berry); }
.btn--secondary:hover { background: var(--berry-light); color: var(--berry-dark); border-color: var(--berry-dark); }

.btn--ghost { background: transparent; color: var(--white); border-color: rgba(255,255,255,0.4); }
.btn--ghost:hover { border-color: var(--white); background: rgba(255,255,255,0.08); color: var(--white); }

.btn--tertiary {
  background: transparent; color: var(--berry); border: 0; padding: 8px 0; min-height: 32px;
  text-decoration: none; font-weight: 600; gap: 6px;
}
.btn--tertiary::after { content: '→'; transition: transform var(--dur-fast) var(--ease); }
.btn--tertiary:hover { color: var(--berry-dark); }
.btn--tertiary:hover::after { transform: translateX(3px); }

/* =============================================================
   FORMS
   ============================================================= */
.field { margin-bottom: var(--space-24); }
.field label {
  display: block;
  font-family: var(--font-body);
  font-size: 13px; font-weight: 600;
  color: var(--near-black);
  margin-bottom: var(--space-8);
}
.field input,
.field textarea,
.field select {
  width: 100%;
  font-family: var(--font-body);
  font-size: 15px;
  color: var(--near-black);
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 12px 14px;
  min-height: 44px;
  line-height: 1.4;
  transition: border-color var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease);
}
.field input:focus,
.field textarea:focus,
.field select:focus {
  outline: none;
  border-color: var(--berry);
  box-shadow: 0 0 0 3px rgba(134, 39, 89, 0.18);
}
.field input::placeholder, .field textarea::placeholder { color: var(--nav-grey); }

/* =============================================================
   SERVICE CARDS (3-up)
   ============================================================= */
.service-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-32);
}
@media (min-width: 768px) { .service-grid { grid-template-columns: repeat(3, 1fr); } }

.service-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
  display: flex; flex-direction: column;
  transition: border-color var(--dur-fast) var(--ease), box-shadow var(--dur-std) var(--ease);
}
.service-card:hover { border-color: var(--logo-grey); box-shadow: 0 12px 32px rgba(0,0,0,0.06); }
.service-card__img {
  aspect-ratio: 4 / 3;
  background: var(--warm-white);
  overflow: hidden;
}
.service-card__img img { width: 100%; height: 100%; object-fit: cover; transition: transform 500ms var(--ease); }
.service-card:hover .service-card__img img { transform: scale(1.03); }
.service-card__body { padding: var(--space-24); display: flex; flex-direction: column; flex: 1; gap: var(--space-12); }
.service-card__accent { height: 3px; }
.service-card--facilities .service-card__accent { background: var(--fac-green); }
.service-card--security   .service-card__accent { background: var(--sec-gold); }
.service-card--cognitious .service-card__accent { background: var(--cog-cyan); }
.service-card__title { font-size: 22px; font-weight: 600; }
.service-card__copy { color: var(--mid-grey); font-size: 15px; flex: 1; }
.service-card__cta { margin-top: var(--space-8); }

/* =============================================================
   TESTIMONIAL BAND — editorial 2-col w/ featured + satellites
   ============================================================= */
.testimonial-band {
  background: var(--warm-white);
  position: relative;
}
.testimonial-band::before {
  content: '';
  position: absolute; left: 50%; top: 0;
  width: 1px; height: 48px;
  background: var(--berry);
  transform: translateX(-50%);
  display: none;
}

.testimonial-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-48);
  align-items: start;
}
@media (min-width: 960px) {
  .testimonial-grid {
    grid-template-columns: 1.6fr 1fr;
    gap: var(--space-64);
  }
}

/* FEATURED quote — large, editorial */
.testimonial-featured {
  position: relative;
  background: var(--white);
  border: 1px solid var(--border);
  padding: clamp(32px, 5vw, 56px);
  margin: 0;
}
.testimonial-mark {
  position: absolute;
  top: 16px; left: 24px;
  font-family: var(--font-italic);
  font-size: 120px;
  line-height: 0.8;
  color: var(--berry-light);
  user-select: none;
  pointer-events: none;
}
.testimonial-featured__quote {
  position: relative;
  margin: 0 0 var(--space-48);
}
.testimonial-featured__quote p {
  font-family: var(--font-italic);
  font-style: italic;
  font-size: clamp(22px, 2.4vw, 30px);
  line-height: 1.4;
  color: var(--near-black);
  letter-spacing: -0.005em;
}

.testimonial-attribution {
  border-top: 0.5px solid var(--border);
  padding-top: var(--space-24);
  font-style: normal;
}
.testimonial-attribution__meta {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-24);
}
@media (min-width: 640px) {
  .testimonial-attribution__meta { grid-template-columns: repeat(4, 1fr); }
}

.testimonial-attribution {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-24);
  align-items: end;
}
@media (min-width: 768px) {
  .testimonial-attribution { grid-template-columns: 1fr auto; }
}
.testimonial-featured__logo {
  background: var(--warm-white);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-sm);
  padding: var(--space-12);
  width: 140px;
  height: 64px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.testimonial-featured__logo img {
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
  filter: grayscale(1);
  opacity: 0.8;
  transition: filter var(--dur-std) var(--ease), opacity var(--dur-std) var(--ease), transform var(--dur-std) var(--ease);
}
.testimonial-featured:hover .testimonial-featured__logo img,
.testimonial-featured__logo:hover img,
.testimonial-featured__logo img:focus-visible {
  filter: grayscale(0);
  opacity: 1;
  transform: scale(1.04);
}
.testimonial-attribution__label {
  display: block;
  font-family: var(--font-label);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--logo-grey);
  margin-bottom: var(--space-8);
}
.testimonial-attribution__name {
  font-family: var(--font-heading);
  font-size: 16px;
  font-weight: 600;
  color: var(--near-black);
  line-height: 1.3;
}
.testimonial-attribution__role,
.testimonial-attribution__org,
.testimonial-attribution__since {
  font-size: 14px;
  color: var(--near-black);
  line-height: 1.4;
}

/* SATELLITE quotes — slim, hairline-separated */
.testimonial-satellites {
  display: flex;
  flex-direction: column;
}
.testimonial-satellites > .eyebrow {
  margin-bottom: var(--space-24);
}
.testimonial-satellite {
  padding: var(--space-24) 0;
  border-top: 0.5px solid var(--border);
}
.testimonial-satellite:last-child { border-bottom: 0.5px solid var(--border); }
.testimonial-satellite__quote {
  margin: 0 0 var(--space-12);
}
.testimonial-satellite__quote p {
  font-family: var(--font-body);
  font-size: 15px;
  line-height: 1.55;
  color: var(--near-black);
  font-weight: 400;
}
.testimonial-satellite__quote p::before { content: '“'; color: var(--berry); margin-right: 1px; }
.testimonial-satellite__quote p::after  { content: '”'; color: var(--berry); margin-left: 1px; }
.testimonial-satellite__cite {
  font-style: normal;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.testimonial-satellite__name {
  font-family: var(--font-label);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.05em;
  color: var(--near-black);
}
.testimonial-satellite__org {
  font-family: var(--font-label);
  font-size: 11px;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--logo-grey);
}

/* FOOTER strip — context line + CTA */
.testimonial-footer {
  margin-top: var(--space-64);
  padding-top: var(--space-32);
  border-top: 0.5px solid var(--border);
  display: flex;
  flex-direction: column;
  gap: var(--space-16);
  align-items: flex-start;
}
@media (min-width: 640px) {
  .testimonial-footer {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-32);
  }
}

/* =============================================================
   PHOTO BAND — full-bleed mid-page image
   ============================================================= */
.photo-band {
  position: relative;
  min-height: clamp(320px, 50vh, 480px);
  display: flex; align-items: center;
  overflow: hidden;
  isolation: isolate;
}
.photo-band__img { position: absolute; inset: 0; z-index: -2; }
.photo-band__img img { width: 100%; height: 100%; object-fit: cover; }
.photo-band__card {
  position: relative; z-index: 1;
  max-width: 420px;
  background: var(--white);
  padding: var(--space-32);
  border: 1px solid var(--border);
  margin: var(--space-48) clamp(20px, 4vw, 40px);
}

/* =============================================================
   LOGO WALL
   ============================================================= */
.logo-wall {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--space-32) var(--space-48);
  align-items: center;
}
@media (min-width: 640px) { .logo-wall { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 960px) { .logo-wall { grid-template-columns: repeat(6, 1fr); } }
.logo-wall img {
  max-height: 56px;
  width: auto;
  margin: 0 auto;
  filter: grayscale(1);
  opacity: 0.7;
  transition: filter var(--dur-std) var(--ease), opacity var(--dur-std) var(--ease);
}
.logo-wall a:hover img { filter: grayscale(0); opacity: 1; }

/* =============================================================
   ABOUT PAGE — stats, values, leadership, covenant
   ============================================================= */

/* Stats strip */
.about-stats { padding-top: var(--space-48); padding-bottom: var(--space-48); }
.stats-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0;
  border-top: 0.5px solid var(--border);
  border-bottom: 0.5px solid var(--border);
}
@media (min-width: 768px) { .stats-grid { grid-template-columns: repeat(4, 1fr); } }
.stat-item {
  padding: var(--space-32) var(--space-24);
  border-right: 0.5px solid var(--border-subtle);
  border-bottom: 0.5px solid var(--border-subtle);
}
.stat-item:last-child { border-right: 0; }
@media (min-width: 768px) { .stat-item { border-bottom: 0; } }
.stat-item__value {
  font-family: var(--font-heading);
  font-size: clamp(40px, 5vw, 56px);
  font-weight: 700;
  color: var(--berry);
  line-height: 1;
  letter-spacing: -0.02em;
  margin-bottom: var(--space-12);
}
.stat-item__label {
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 600;
  color: var(--near-black);
  margin-bottom: 4px;
}
.stat-item__sub {
  font-family: var(--font-label);
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--logo-grey);
}

/* 2-col intro */
.intro-2col {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-32);
}
@media (min-width: 768px) {
  .intro-2col { grid-template-columns: 1fr 1.4fr; gap: var(--space-64); align-items: start; }
}

/* Values pillars */
.values-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
  border-top: 0.5px solid var(--border);
}
@media (min-width: 640px) { .values-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 960px) { .values-grid { grid-template-columns: repeat(4, 1fr); } }
.value-pillar {
  padding: var(--space-40) var(--space-24);
  border-bottom: 0.5px solid var(--border);
  border-right: 0.5px solid var(--border);
  position: relative;
}
.value-pillar:last-child { border-right: 0; }
@media (min-width: 960px) {
  .value-pillar:nth-last-child(-n+4) { border-bottom: 0; }
}
.value-pillar__num {
  display: block;
  font-family: var(--font-label);
  font-size: 12px;
  letter-spacing: 0.18em;
  color: var(--berry);
  margin-bottom: var(--space-24);
  font-weight: 500;
}
.value-pillar h3 {
  font-size: 22px;
  font-weight: 600;
  letter-spacing: -0.01em;
  margin-bottom: var(--space-12);
}
.value-pillar p {
  font-size: 14px;
  line-height: 1.6;
  color: var(--mid-grey);
}

/* Leadership card */
.leadership-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: clamp(32px, 5vw, 56px);
  max-width: 880px;
  margin: 0 auto;
  position: relative;
}
.leadership-card__quote { margin-bottom: var(--space-32); }
.leadership-card__quote .eyebrow { margin-bottom: var(--space-16); }
.leadership-card__quote blockquote {
  font-family: var(--font-italic);
  font-style: italic;
  font-size: clamp(20px, 2.2vw, 26px);
  line-height: 1.45;
  color: var(--near-black);
  border: 0;
  padding: 0;
}
.leadership-card__quote blockquote p + p { margin-top: var(--space-16); }
.leadership-card__cite {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-24);
  padding-top: var(--space-24);
  border-top: 0.5px solid var(--border);
}
.leadership-card__label {
  display: block;
  font-family: var(--font-label);
  font-size: 10px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--logo-grey);
  margin-bottom: 4px;
}
.leadership-card__name {
  font-family: var(--font-heading);
  font-size: 16px;
  font-weight: 600;
  color: var(--near-black);
}
.leadership-card__role {
  font-size: 14px;
  color: var(--near-black);
}

/* =============================================================
   CASE STUDIES PAGE — narrative entries w/ brief/response/outcome
   ============================================================= */
.case-list {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.case-study {
  padding: var(--space-64) 0;
  border-top: 0.5px solid var(--border);
}
.case-study:first-child { padding-top: var(--space-32); }
.case-study:last-child { border-bottom: 0.5px solid var(--border); }

.case-study__head {
  display: grid;
  grid-template-columns: 56px 1fr;
  gap: var(--space-24);
  align-items: start;
  margin-bottom: var(--space-32);
  padding-bottom: var(--space-24);
  border-bottom: 0.5px solid var(--border-subtle);
}
@media (min-width: 768px) {
  .case-study__head { grid-template-columns: 56px 1fr auto; gap: var(--space-32); }
}
.case-study__num {
  font-family: var(--font-heading);
  font-size: clamp(40px, 4vw, 56px);
  font-weight: 700;
  line-height: 1;
  color: var(--berry);
  letter-spacing: -0.04em;
}
.case-study__head-text { display: flex; flex-direction: column; gap: var(--space-8); min-width: 0; }
.case-study__head-text h3 {
  font-family: var(--font-heading);
  font-size: clamp(22px, 2.4vw, 28px);
  font-weight: 600;
  letter-spacing: -0.01em;
  line-height: 1.2;
  color: var(--near-black);
}
.case-study__logo {
  width: 120px;
  height: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--warm-white);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-sm);
  padding: var(--space-8);
  flex-shrink: 0;
}
.case-study__logo img {
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
  filter: grayscale(1);
  opacity: 0.8;
  transition: filter var(--dur-std) var(--ease), opacity var(--dur-std) var(--ease);
}
.case-study:hover .case-study__logo img { filter: grayscale(0); opacity: 1; }

.case-study__body {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-32);
  max-width: var(--prose-width);
  margin: 0 auto 0 0;
}
.case-block { display: flex; flex-direction: column; gap: var(--space-12); }
.case-block__label {
  display: inline-block;
  font-family: var(--font-label);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--logo-grey);
  padding-bottom: var(--space-8);
  border-bottom: 0.5px solid var(--border-subtle);
  width: fit-content;
}
.case-block__body { color: var(--near-black); font-size: 16px; line-height: 1.65; }
.case-block__body p { margin: 0 0 var(--space-12); }
.case-block__body p:last-child { margin-bottom: 0; }

.case-block--result {
  background: var(--berry-light);
  padding: var(--space-24);
  border-radius: var(--radius-sm);
  border-left: 3px solid var(--berry);
}
.case-block--result .case-block__label {
  color: var(--berry);
  border-bottom-color: var(--berry);
}

/* =============================================================
   ACCREDITATIONS PAGE — cards w/ logo, cert#, verify CTA
   ============================================================= */
.accreditations-layout { padding-top: var(--space-32); }

.accred-group { padding: var(--space-64) 0; border-top: 0.5px solid var(--border); }
.accred-group:first-of-type { border-top: 0; padding-top: var(--space-32); }
.accred-group__header { margin-bottom: var(--space-32); }
.accred-group__header h2 {
  font-size: clamp(24px, 2.6vw, 32px);
  margin-top: var(--space-8);
}

.accred-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-24);
}
@media (min-width: 640px) { .accred-grid { grid-template-columns: repeat(2, 1fr); } }

.accred-card {
  display: grid;
  grid-template-columns: 88px 1fr;
  gap: var(--space-20, var(--space-24));
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: var(--space-24);
  transition: border-color var(--dur-fast) var(--ease), box-shadow var(--dur-std) var(--ease);
}
.accred-card:hover { border-color: var(--logo-grey); box-shadow: 0 8px 20px rgba(0,0,0,0.05); }
.accred-card__logo {
  width: 80px; height: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--warm-white);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-sm);
  flex-shrink: 0;
}
.accred-card__logo img {
  max-width: 60px;
  max-height: 60px;
  width: auto;
  height: auto;
  object-fit: contain;
}
.accred-card__body {
  display: flex;
  flex-direction: column;
  gap: var(--space-12);
  min-width: 0;
}
.accred-card h3 {
  font-family: var(--font-heading);
  font-size: 18px;
  font-weight: 600;
  line-height: 1.25;
  letter-spacing: -0.005em;
  margin: 0;
}
.accred-card__issuer,
.accred-card__cert {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin: 0;
  font-size: 13px;
  color: var(--near-black);
}
.accred-card__issuer .eyebrow,
.accred-card__cert .eyebrow { font-size: 10px; }
.accred-card__cert code {
  font-family: var(--font-mono);
  background: var(--berry-light);
  color: var(--berry-dark);
  padding: 2px 8px;
  border-radius: var(--radius-sm);
  font-size: 12px;
  align-self: flex-start;
  letter-spacing: 0.02em;
}
.accred-card__desc {
  font-size: 14px;
  line-height: 1.55;
  color: var(--mid-grey);
  margin: 0;
}
.accred-card .btn--tertiary {
  margin-top: var(--space-8);
  align-self: flex-start;
  font-size: 13px;
}

/* Mobile: stack logo above body */
@media (max-width: 480px) {
  .accred-card { grid-template-columns: 1fr; gap: var(--space-16); }
  .accred-card__logo { width: 64px; height: 64px; }
  .accred-card__logo img { max-width: 48px; max-height: 48px; }
}

/* Award feature photo */
.award-feature {
  position: relative;
  margin: 0 0 var(--space-32);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
  isolation: isolate;
}
.award-feature img {
  width: 100%;
  height: auto;
  display: block;
  aspect-ratio: 700 / 459;
  object-fit: cover;
}
.award-feature figcaption {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  padding: var(--space-24);
  background: linear-gradient(0deg, rgba(26,26,26,0.85), rgba(26,26,26,0.35) 70%, transparent);
  color: var(--white);
}
.award-feature__title {
  font-family: var(--font-heading);
  font-size: clamp(20px, 2.4vw, 28px);
  font-weight: 600;
  margin-top: var(--space-8);
}
.award-feature__year {
  font-family: var(--font-label);
  font-size: 12px;
  letter-spacing: 0.2em;
  color: rgba(255,255,255,0.75);
  text-transform: uppercase;
  margin-top: 4px;
}

/* Awards timeline */
.awards-timeline {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
}
.award-row {
  display: grid;
  grid-template-columns: 80px 1fr;
  gap: var(--space-24);
  padding: var(--space-16) 0;
  border-top: 0.5px solid var(--border-subtle);
}
.award-row:last-child { border-bottom: 0.5px solid var(--border-subtle); }
.award-row__year {
  font-family: var(--font-label);
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.05em;
  color: var(--berry);
}
.award-row__detail { display: flex; flex-direction: column; gap: 4px; }
.award-row__detail strong {
  font-family: var(--font-heading);
  font-size: 16px;
  font-weight: 600;
  color: var(--near-black);
}
.award-row__org {
  font-family: var(--font-label);
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--logo-grey);
}

/* Foundation cross-link */
.foundation-callout {
  margin-top: var(--space-64);
  padding: var(--space-32);
  background: var(--berry-light);
  border-radius: var(--radius);
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-24);
  align-items: center;
}
@media (min-width: 640px) {
  .foundation-callout { grid-template-columns: 1fr auto; gap: var(--space-32); }
}
.foundation-callout h3 {
  font-family: var(--font-heading);
  font-size: 22px;
  font-weight: 600;
  margin-top: var(--space-8);
}

/* =============================================================
   TESTIMONIALS PAGE — "On Record" magazine issue layout
   ============================================================= */

/* MASTHEAD */
.t-masthead {
  margin-top: var(--nav-height);
  background: var(--warm-white);
  padding: clamp(56px, 8vw, 96px) clamp(20px, 4vw, 40px) clamp(40px, 6vw, 64px);
  border-bottom: 1px solid var(--border);
  position: relative;
}
.t-masthead::after {
  content: '';
  position: absolute;
  left: 50%; bottom: -1px;
  width: 88px;
  height: 1px;
  background: var(--berry);
  transform: translateX(-50%);
}
.t-masthead__top {
  font-family: var(--font-label);
  font-size: 11px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--logo-grey);
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-12);
  margin-bottom: var(--space-24);
  align-items: center;
}
.t-masthead__brand { color: var(--berry); font-weight: 600; }
.t-masthead__sep { color: var(--border); }

.t-masthead__title {
  font-family: var(--font-heading);
  font-size: clamp(56px, 9vw, 120px);
  font-weight: 700;
  line-height: 0.95;
  letter-spacing: -0.03em;
  color: var(--near-black);
  margin-bottom: var(--space-24);
}

.t-masthead__sub {
  font-family: var(--font-italic);
  font-style: italic;
  font-size: clamp(18px, 2vw, 22px);
  line-height: 1.5;
  color: var(--mid-grey);
  max-width: 760px;
}

.t-sector-chips {
  margin-top: var(--space-32);
  padding-top: var(--space-24);
  border-top: 0.5px solid var(--border);
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-12);
  align-items: center;
}
.t-sector-chips__label {
  font-family: var(--font-label);
  font-size: 10px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--logo-grey);
  margin-right: var(--space-8);
}
.t-sector-chip {
  display: inline-flex;
  align-items: center;
  padding: 6px 14px;
  font-family: var(--font-label);
  font-size: 12px;
  letter-spacing: 0.05em;
  color: var(--near-black);
  background: transparent;
  border: 1px solid var(--border);
  border-radius: 999px;
  text-decoration: none;
  transition: background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease);
}
.t-sector-chip:hover { background: var(--berry); color: var(--white); border-color: var(--berry); }

/* ISSUE BODY — prose column per brand (--prose-width: 720px) */
.t-issue {
  max-width: var(--prose-width);
  margin: 0 auto;
  padding: clamp(48px, 7vw, 96px) clamp(20px, 4vw, 40px);
}

.t-sector-anchor {
  display: block;
  visibility: hidden;
  position: relative;
  top: calc(-1 * var(--nav-height) - var(--space-16));
}

/* ENTRY — variable layout based on length */
.t-entry { position: relative; }
.t-entry + .t-entry { margin-top: var(--space-64); }

.t-entry__head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-12);
  margin-bottom: var(--space-24);
  font-family: var(--font-label);
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}
.t-entry__num {
  font-family: var(--font-heading);
  font-weight: 700;
  font-size: 14px;
  color: var(--berry);
  letter-spacing: 0.05em;
}
.t-entry__sector {
  color: var(--near-black);
  padding-left: var(--space-12);
  border-left: 0.5px solid var(--border);
}
.t-entry__tenure {
  color: var(--logo-grey);
  padding-left: var(--space-12);
  border-left: 0.5px solid var(--border);
}

.t-entry__pull {
  font-family: var(--font-italic);
  font-style: italic;
  font-size: clamp(24px, 3.4vw, 36px);
  font-weight: 400;
  line-height: 1.25;
  letter-spacing: -0.005em;
  color: var(--near-black);
  margin: 0 0 var(--space-32);
  text-wrap: balance;
}

.t-entry__body {
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.7;
  color: var(--near-black);
  max-width: 680px;
}
.t-entry__body p { margin: 0 0 var(--space-16); }
.t-entry__body p:last-child { margin-bottom: 0; }

/* Drop cap on first paragraph */
.t-entry__dropcap {
  float: left;
  font-family: var(--font-heading);
  font-weight: 400;
  font-size: 4.2em;
  line-height: 0.85;
  margin: 8px 12px 0 -4px;
  color: var(--berry);
  letter-spacing: -0.04em;
}

/* Short entries — feature-card treatment, berry surface */
.t-entry--short {
  background: var(--berry);
  color: var(--white);
  padding: clamp(40px, 5vw, 64px);
  border-radius: var(--radius);
  margin-left: calc(-1 * clamp(20px, 4vw, 40px));
  margin-right: calc(-1 * clamp(20px, 4vw, 40px));
}
.t-entry--short .t-entry__head {
  color: rgba(255,255,255,0.7);
}
.t-entry--short .t-entry__num { color: rgba(255,255,255,0.95); }
.t-entry--short .t-entry__sector,
.t-entry--short .t-entry__tenure {
  color: rgba(255,255,255,0.75);
  border-left-color: rgba(255,255,255,0.25);
}
.t-entry--short .t-entry__body {
  font-family: var(--font-italic);
  font-style: italic;
  font-size: clamp(22px, 3vw, 34px);
  line-height: 1.3;
  color: var(--white);
  max-width: 100%;
}
.t-entry--short .t-entry__signoff { border-top-color: rgba(255,255,255,0.25); }
.t-entry--short .t-entry__sig-mark { color: rgba(255,255,255,0.7); }
.t-entry--short .t-entry__sig-name { color: var(--white); }
.t-entry--short .t-entry__sig-meta { color: rgba(255,255,255,0.75); }
.t-entry--short .t-entry__sig-logo img { filter: brightness(0) invert(1); opacity: 0.9; }

/* Long entries — wider, with drop cap shown */
.t-entry--long .t-entry__body { font-size: 17px; }

/* Signature block */
.t-entry__signoff {
  margin-top: var(--space-32);
  padding-top: var(--space-24);
  border-top: 0.5px solid var(--border);
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: var(--space-16);
  align-items: center;
  font-style: normal;
}
.t-entry__sig-mark {
  font-family: var(--font-heading);
  font-size: 24px;
  color: var(--berry);
  line-height: 1;
}
.t-entry__sig-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.t-entry__sig-name {
  font-family: var(--font-heading);
  font-size: 16px;
  font-weight: 600;
  color: var(--near-black);
}
.t-entry__sig-meta {
  font-family: var(--font-label);
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--logo-grey);
}
.t-entry__sig-logo {
  height: 32px;
  display: flex;
  align-items: center;
  flex-shrink: 0;
}
.t-entry__sig-logo img {
  max-height: 100%;
  max-width: 120px;
  width: auto;
  height: auto;
  object-fit: contain;
  filter: grayscale(1);
  opacity: 0.7;
  transition: filter var(--dur-std) var(--ease), opacity var(--dur-std) var(--ease), transform var(--dur-std) var(--ease);
}
.t-entry:hover .t-entry__sig-logo img,
.t-entry__sig-logo:hover img,
.t-entry__sig-logo img:focus-visible {
  filter: grayscale(0);
  opacity: 1;
  transform: scale(1.02);
}
/* Berry short-card variant — keep white wash on hover, just bump opacity */
.t-entry--short:hover .t-entry__sig-logo img {
  filter: brightness(0) invert(1);
  opacity: 1;
  transform: scale(1.02);
}

/* Thread between entries — decorative */
.t-thread {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: var(--space-48) 0;
  position: relative;
}
.t-thread::before,
.t-thread::after {
  content: '';
  flex: 1;
  height: 0.5px;
  background: var(--border);
}
.t-thread__node {
  width: 6px;
  height: 6px;
  margin: 0 var(--space-16);
  background: var(--berry);
  transform: rotate(45deg);
}

.t-thread:last-of-type { display: none; }

/* Mobile */
@media (max-width: 640px) {
  .t-entry__signoff {
    grid-template-columns: auto 1fr;
    grid-template-rows: auto auto;
  }
  .t-entry__sig-logo { grid-column: 1 / -1; margin-top: var(--space-12); height: 24px; }
  .t-entry__dropcap { font-size: 3.5em; }
}
.testimonial-featured-band { padding-top: var(--space-48); padding-bottom: var(--space-48); }

/* Shared attribution typography */
.t-attr-label {
  display: block;
  font-family: var(--font-label);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--logo-grey);
  margin-bottom: 4px;
}
.t-attr-name {
  font-family: var(--font-heading);
  font-size: 16px;
  font-weight: 600;
  color: var(--near-black);
  line-height: 1.3;
}
.t-attr-role,
.t-attr-org,
.t-attr-tenure {
  font-size: 14px;
  color: var(--near-black);
}
.t-attr-meta {
  font-family: var(--font-label);
  font-size: 11px;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--logo-grey);
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  margin-top: 4px;
}
.t-attr-sep { color: var(--border); }

/* Featured */
.t-featured {
  position: relative;
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: clamp(32px, 5vw, 64px);
  margin: 0;
  overflow: hidden;
}
.t-featured::before {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 4px;
  height: 100%;
  background: var(--berry);
}
.t-featured__mark {
  position: absolute;
  top: -8px; left: 24px;
  font-family: var(--font-italic);
  font-size: 200px;
  line-height: 0.8;
  color: var(--berry-light);
  user-select: none;
  pointer-events: none;
  z-index: 0;
}
.t-featured__quote {
  position: relative;
  margin: 0 0 var(--space-48);
  z-index: 1;
}
.t-featured__quote p {
  font-family: var(--font-italic);
  font-style: italic;
  font-size: clamp(20px, 2.4vw, 28px);
  line-height: 1.45;
  color: var(--near-black);
  max-width: 820px;
}
.t-featured__quote p + p { margin-top: var(--space-20, var(--space-24)); }

.t-featured__cite {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-32);
  align-items: end;
  padding-top: var(--space-32);
  border-top: 0.5px solid var(--border);
  font-style: normal;
}
@media (min-width: 768px) {
  .t-featured__cite { grid-template-columns: 1fr auto; }
}
.t-featured__cite-meta {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-24);
}
@media (min-width: 768px) {
  .t-featured__cite-meta { grid-template-columns: repeat(4, 1fr); gap: var(--space-32); }
}
.t-featured__logo {
  background: var(--warm-white);
  padding: var(--space-16);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-sm);
  width: 160px;
  height: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.t-featured__logo img {
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
  filter: grayscale(1);
  opacity: 0.85;
}

/* Card grid */
.t-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-24);
}
@media (min-width: 768px) { .t-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1200px) { .t-grid { grid-template-columns: repeat(3, 1fr); } }

.t-card {
  position: relative;
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: var(--space-32);
  display: flex;
  flex-direction: column;
  gap: var(--space-16);
  overflow: hidden;
  transition: border-color var(--dur-fast) var(--ease), box-shadow var(--dur-std) var(--ease), transform var(--dur-std) var(--ease);
}
.t-card:hover {
  border-color: var(--berry);
  box-shadow: 0 12px 32px rgba(0,0,0,0.06);
  transform: translateY(-2px);
}
.t-card--short {
  background: var(--berry);
  color: var(--white);
  border-color: var(--berry);
}
.t-card--short:hover { background: var(--berry-dark); border-color: var(--berry-dark); }
.t-card--short .t-card__mark { color: rgba(255,255,255,0.18); }
.t-card--short .t-card__quote p { color: var(--white); font-size: clamp(18px, 1.8vw, 22px); }
.t-card--short .t-card__cite { border-top-color: rgba(255,255,255,0.2); }
.t-card--short .t-attr-name { color: var(--white); }
.t-card--short .t-attr-meta { color: rgba(255,255,255,0.7); }
.t-card--short .t-attr-sep { color: rgba(255,255,255,0.3); }

.t-card__mark {
  position: absolute;
  top: -10px; right: 20px;
  font-family: var(--font-italic);
  font-size: 100px;
  line-height: 0.8;
  color: var(--berry-light);
  user-select: none;
  pointer-events: none;
  z-index: 0;
}

.t-card__pull {
  position: relative;
  z-index: 1;
  font-family: var(--font-heading);
  font-size: clamp(18px, 1.6vw, 20px);
  font-weight: 600;
  line-height: 1.3;
  color: var(--berry);
  letter-spacing: -0.01em;
  margin: 0;
  padding-bottom: var(--space-12);
  border-bottom: 0.5px solid var(--border-subtle);
}

.t-card__quote {
  position: relative;
  z-index: 1;
  margin: 0;
  flex: 1;
}
.t-card__quote p {
  font-family: var(--font-body);
  font-size: 15px;
  line-height: 1.6;
  color: var(--near-black);
}
.t-card__quote p + p { margin-top: var(--space-12); }

.t-card__cite {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--space-16);
  padding-top: var(--space-16);
  border-top: 0.5px solid var(--border);
  font-style: normal;
  margin-top: auto;
}
.t-card__cite-text { min-width: 0; flex: 1; }
.t-card__logo {
  width: 80px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.t-card__logo img {
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
  filter: grayscale(1);
  opacity: 0.7;
  transition: filter var(--dur-fast) var(--ease), opacity var(--dur-fast) var(--ease);
}
.t-card:hover .t-card__logo img { filter: grayscale(0); opacity: 1; }
.t-card--short .t-card__logo img { filter: brightness(0) invert(1); opacity: 0.9; }

/* =============================================================
   CARBON REDUCTION PLAN
   ============================================================= */
.carbon-intro {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-48);
  align-items: start;
}
@media (min-width: 960px) {
  .carbon-intro { grid-template-columns: 1.6fr 1fr; gap: var(--space-64); }
}
.carbon-doc-card {
  background: var(--warm-white);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: var(--space-24);
}

/* =============================================================
   LEGAL / POLICY PAGE
   ============================================================= */
.legal-hero {
  background: var(--warm-white);
  margin-top: var(--nav-height);
  padding: clamp(40px, 6vw, 64px) clamp(20px, 4vw, 40px);
  border-bottom: 0.5px solid var(--border);
}
.legal-hero h1 {
  font-size: clamp(32px, 4vw, 48px);
  margin-top: var(--space-12);
  margin-bottom: var(--space-16);
}
.legal-hero__meta {
  font-family: var(--font-label);
  font-size: 13px;
  color: var(--mid-grey);
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-12);
}
.legal-hero__meta strong { color: var(--near-black); font-weight: 600; }
.legal-hero__sep { color: var(--border); }

.legal-layout { padding-top: var(--space-48); padding-bottom: var(--space-64); }
.legal-body { max-width: 720px; }
.legal-body h2 {
  font-size: clamp(22px, 2.4vw, 28px);
  margin-top: var(--space-48);
  scroll-margin-top: calc(var(--nav-height) + var(--space-16));
}
.legal-body h3 {
  font-size: 18px;
  font-weight: 600;
  margin-top: var(--space-32);
  scroll-margin-top: calc(var(--nav-height) + var(--space-16));
}
.legal-body p, .legal-body ul, .legal-body ol { margin-top: var(--space-16); }
.legal-body table {
  width: 100%;
  border-collapse: collapse;
  margin-top: var(--space-24);
  font-size: 13px;
}
.legal-body table th,
.legal-body table td {
  text-align: left;
  padding: var(--space-12);
  border-bottom: 0.5px solid var(--border-subtle);
}
.legal-body table th, .legal-body table b {
  font-family: var(--font-label);
  font-weight: 600;
  color: var(--near-black);
  background: var(--warm-white);
}

/* =============================================================
   THANK YOU PAGE
   ============================================================= */
.thankyou-band {
  margin-top: var(--nav-height);
  padding: clamp(48px, 7vw, 96px) clamp(20px, 4vw, 40px);
  background: var(--warm-white);
}
.thankyou-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-48);
  align-items: start;
}
@media (min-width: 960px) {
  .thankyou-grid { grid-template-columns: 1.4fr 1fr; gap: var(--space-64); }
}
.thankyou-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: clamp(32px, 5vw, 56px);
}
.thankyou-card__icon {
  width: 48px; height: 48px;
  color: var(--berry);
  margin-bottom: var(--space-24);
}
.thankyou-card h1 {
  font-size: clamp(28px, 3.4vw, 40px);
  margin-top: var(--space-8);
  margin-bottom: var(--space-16);
  letter-spacing: -0.02em;
}
.thankyou-card .lede { color: var(--mid-grey); }
.thankyou-content { margin-top: var(--space-24); color: var(--mid-grey); }
.thankyou-content h1 { display: none; } /* hide duplicate "Thank you" h1 from raw page content */

.thankyou-next {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: var(--space-32);
}
.thankyou-steps {
  list-style: none;
  padding: 0;
  margin: var(--space-16) 0 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-24);
}
.thankyou-steps li {
  display: grid;
  grid-template-columns: 40px 1fr;
  gap: var(--space-16);
  padding-bottom: var(--space-24);
  border-bottom: 0.5px solid var(--border-subtle);
}
.thankyou-steps li:last-child { border-bottom: 0; padding-bottom: 0; }
.thankyou-steps__num {
  font-family: var(--font-label);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.12em;
  color: var(--berry);
  align-self: start;
  padding-top: 4px;
}
.thankyou-steps strong {
  display: block;
  font-family: var(--font-heading);
  font-size: 16px;
  font-weight: 600;
  color: var(--near-black);
  margin-bottom: 4px;
}
.thankyou-steps p {
  font-size: 14px;
  color: var(--mid-grey);
  line-height: 1.55;
}

/* Foundation page */
.foundation-intro {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-32);
  align-items: start;
}
@media (min-width: 768px) {
  .foundation-intro { grid-template-columns: 200px 1fr; gap: var(--space-48); }
}
.foundation-intro__logo {
  margin: 0;
  background: var(--white);
  padding: var(--space-16);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  max-width: 220px;
  justify-self: start;
}
.foundation-intro__logo img {
  width: 100%;
  height: auto;
  display: block;
}
.foundation-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
  border-top: 0.5px solid var(--border);
}
@media (min-width: 640px) { .foundation-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 960px) { .foundation-grid { grid-template-columns: repeat(4, 1fr); } }
.foundation-pillar {
  padding: var(--space-32) var(--space-24);
  border-bottom: 0.5px solid var(--border);
  border-right: 0.5px solid var(--border);
}
.foundation-pillar:last-child { border-right: 0; }
@media (min-width: 960px) {
  .foundation-pillar:nth-last-child(-n+4) { border-bottom: 0; }
}
.foundation-pillar__num {
  display: block;
  font-family: var(--font-label);
  font-size: 12px;
  letter-spacing: 0.18em;
  color: var(--berry);
  margin-bottom: var(--space-16);
  font-weight: 500;
}
.foundation-pillar h3 {
  font-size: 20px;
  font-weight: 600;
  margin-bottom: var(--space-12);
}
.foundation-pillar p {
  font-size: 14px;
  line-height: 1.6;
  color: var(--mid-grey);
}

.charity-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-24);
}
@media (min-width: 640px) { .charity-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 960px) { .charity-grid { grid-template-columns: repeat(4, 1fr); } }
.charity-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: var(--space-24);
  display: flex;
  flex-direction: column;
  gap: var(--space-12);
  transition: border-color var(--dur-fast) var(--ease), box-shadow var(--dur-std) var(--ease);
}
.charity-card:hover { border-color: var(--logo-grey); box-shadow: 0 8px 20px rgba(0,0,0,0.04); }
.charity-card__name {
  font-family: var(--font-heading);
  font-size: 18px;
  font-weight: 600;
  color: var(--near-black);
}
.charity-card__desc {
  font-size: 14px;
  line-height: 1.55;
  color: var(--mid-grey);
  flex: 1;
}

/* Covenant band */
.covenant-band {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-32);
  align-items: center;
}
@media (min-width: 768px) {
  .covenant-band { grid-template-columns: 240px 1fr; gap: var(--space-48); }
}
.covenant-band__badge {
  margin: 0;
  background: var(--white);
  padding: var(--space-16);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
}
.covenant-band__badge img {
  width: 100%;
  height: auto;
  display: block;
}

/* =============================================================
   404 PAGE — dog portrait + branded content
   ============================================================= */
.error-404 {
  margin-top: var(--nav-height);
  padding: clamp(48px, 7vw, 96px) clamp(20px, 4vw, 40px);
  background: var(--warm-white);
  min-height: 70vh;
}
.error-404__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-48);
  align-items: center;
}
@media (min-width: 768px) {
  .error-404__grid {
    grid-template-columns: 1fr 1.4fr;
    gap: var(--space-64);
  }
}
.error-404__figure {
  margin: 0;
  border-radius: var(--radius);
  overflow: hidden;
  border: 1px solid var(--border);
  background: var(--white);
  max-width: 420px;
  width: 100%;
  justify-self: center;
}
.error-404__figure img {
  width: 100%;
  height: auto;
  display: block;
  aspect-ratio: 610 / 1000;
  object-fit: cover;
}
.error-404__content h1 {
  font-size: clamp(32px, 4.2vw, 52px);
  margin-top: var(--space-16);
  margin-bottom: var(--space-24);
  letter-spacing: -0.02em;
  line-height: 1.1;
}
.error-404__content .lede { color: var(--mid-grey); max-width: 540px; }
.error-404__links {
  margin-top: var(--space-48);
  padding-top: var(--space-24);
  border-top: 0.5px solid var(--border);
}
.error-404__links ul {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-16) var(--space-24);
}
.error-404__links a {
  color: var(--berry);
  font-family: var(--font-label);
  font-size: 13px;
  font-weight: 500;
  text-decoration: none;
  border-bottom: 1px solid var(--berry-light);
  padding-bottom: 2px;
  transition: border-color var(--dur-fast) var(--ease);
}
.error-404__links a:hover { border-bottom-color: var(--berry); color: var(--berry-dark); }
.error-404__search {
  margin-top: var(--space-32);
  display: flex;
  gap: var(--space-12);
  max-width: 480px;
}
.error-404__search input {
  flex: 1;
  padding: 12px 14px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  min-height: 44px;
  font-family: var(--font-body);
  font-size: 15px;
  background: var(--white);
}
.error-404__search input:focus {
  outline: none;
  border-color: var(--berry);
  box-shadow: 0 0 0 3px rgba(134, 39, 89, 0.18);
}

/* =============================================================
   BREADCRUMBS — schema-compatible, hairline-separated
   ============================================================= */
.breadcrumbs {
  font-family: var(--font-label);
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--logo-grey);
}
.breadcrumbs ol {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-8);
  align-items: center;
}
.breadcrumbs li { display: flex; align-items: center; gap: var(--space-8); }
.breadcrumbs li + li::before {
  content: '/';
  color: var(--border);
  font-weight: 400;
}
.breadcrumbs a {
  color: var(--logo-grey);
  text-decoration: none;
  transition: color var(--dur-fast) var(--ease);
}
.breadcrumbs a:hover { color: var(--berry); }
.breadcrumbs li[aria-current="page"] span { color: var(--near-black); font-weight: 500; }

/* =============================================================
   SINGLE POST — editorial layout with sidebar
   ============================================================= */
.post-layout {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-48);
  max-width: var(--content-width);
  margin: 0 auto;
  padding: 0 clamp(20px, 4vw, 40px);
}
@media (min-width: 1024px) {
  .post-layout {
    grid-template-columns: 1fr 260px;
    gap: var(--space-64);
  }
  .post-layout .breadcrumbs { grid-column: 1 / -1; }
}
.post-article { min-width: 0; }
.post-body { max-width: var(--prose-width); margin: 0 auto; }

/* Byline */
.post-byline {
  display: flex;
  align-items: center;
  gap: var(--space-16);
  padding: var(--space-24) 0;
  margin-bottom: var(--space-32);
  border-top: 0.5px solid var(--border);
  border-bottom: 0.5px solid var(--border);
}
.post-byline__avatar {
  width: 48px; height: 48px;
  border-radius: 50%;
  flex-shrink: 0;
  border: 1px solid var(--border);
}
.post-byline__meta { min-width: 0; }
.post-byline__author {
  font-family: var(--font-heading);
  font-size: 16px;
  color: var(--near-black);
  margin-bottom: 4px;
}
.post-byline__author a {
  color: var(--near-black);
  text-decoration: none;
  font-weight: 600;
}
.post-byline__author a:hover { color: var(--berry); }
.post-byline__label {
  font-family: var(--font-label);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--logo-grey);
  margin-right: var(--space-8);
}
.post-byline__dates {
  font-size: 13px;
  color: var(--mid-grey);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-8);
}
.post-byline__sep { color: var(--border); }
.post-byline__dates a { color: var(--mid-grey); text-decoration: none; }
.post-byline__dates a:hover { color: var(--berry); }

/* TL;DR + Key Takeaways */
.post-tldr,
.post-key-takeaways {
  background: var(--berry-light);
  border-left: 3px solid var(--berry);
  padding: var(--space-24) var(--space-32);
  margin: var(--space-32) auto;
  max-width: var(--prose-width);
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
}
.post-tldr .eyebrow,
.post-key-takeaways .eyebrow { margin-bottom: var(--space-12); }
.post-tldr p, .post-tldr div {
  font-family: var(--font-italic);
  font-style: italic;
  font-size: 17px;
  line-height: 1.5;
  color: var(--near-black);
}
.post-key-takeaways ul {
  list-style: none;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-8);
}
.post-key-takeaways li {
  position: relative;
  padding-left: var(--space-24);
  font-size: 15px;
  line-height: 1.55;
  color: var(--near-black);
}
.post-key-takeaways li::before {
  content: '→';
  position: absolute;
  left: 0;
  color: var(--berry);
  font-weight: 700;
}

/* Tags */
.post-tags {
  margin-top: var(--space-48);
  padding-top: var(--space-24);
  border-top: 0.5px solid var(--border);
  max-width: var(--prose-width);
}
.post-tags .eyebrow { margin-bottom: var(--space-12); }
.post-tags ul {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-8);
}
.post-tags a {
  display: inline-block;
  padding: 4px 12px;
  font-size: 12px;
  font-family: var(--font-body);
  color: var(--berry);
  background: var(--berry-light);
  border: 1px solid var(--berry-light);
  border-radius: 999px;
  text-decoration: none;
  transition: background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease);
}
.post-tags a:hover { background: var(--berry); color: var(--white); }

/* Sidebar (share + meta) */
.post-sidebar { min-width: 0; }
@media (min-width: 1024px) {
  .post-sidebar__inner {
    position: sticky;
    top: calc(var(--nav-height) + var(--space-24));
    display: flex;
    flex-direction: column;
    gap: var(--space-24);
  }
}
@media (max-width: 1023px) {
  .post-sidebar__inner { display: flex; flex-direction: column; gap: var(--space-24); }
}

/* Share buttons */
.post-share { background: var(--white); border: 1px solid var(--border); border-radius: var(--radius); padding: var(--space-16); }
.post-share .eyebrow { margin-bottom: var(--space-12); }
.post-share__list {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: var(--space-8);
}
.post-share__btn {
  display: flex;
  align-items: center;
  gap: var(--space-12);
  padding: 10px 12px;
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 500;
  color: var(--near-black);
  background: transparent;
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-sm);
  text-decoration: none;
  text-align: left;
  width: 100%;
  cursor: pointer;
  transition: background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease);
}
.post-share__btn:hover {
  background: var(--berry-light);
  color: var(--berry-dark);
  border-color: var(--berry);
}
.post-share__btn svg { color: var(--logo-grey); flex-shrink: 0; transition: color var(--dur-fast) var(--ease); }
.post-share__btn:hover svg { color: var(--berry); }
.post-share__copy.is-copied { background: var(--berry); color: var(--white); border-color: var(--berry); }
.post-share__copy.is-copied svg { color: var(--white); }

/* Meta card */
.post-meta-card {
  background: var(--warm-white);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: var(--space-16);
}
.post-meta-card .eyebrow { margin-bottom: var(--space-12); }
.post-meta-card dl { display: flex; flex-direction: column; gap: var(--space-8); margin: 0; }
.post-meta-card dl > div {
  display: grid;
  grid-template-columns: 100px 1fr;
  gap: var(--space-12);
  font-size: 13px;
  padding: 6px 0;
  border-bottom: 0.5px solid var(--border-subtle);
}
.post-meta-card dl > div:last-child { border-bottom: 0; }
.post-meta-card dt {
  font-family: var(--font-label);
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--logo-grey);
  font-weight: 500;
}
.post-meta-card dd { color: var(--near-black); margin: 0; }
.post-meta-card dd a { color: var(--berry); text-decoration: none; }
.post-meta-card dd a:hover { text-decoration: underline; }

/* News filters / chips */
.post-filters__list {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-8);
}
.post-filter-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  font-family: var(--font-label);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.04em;
  color: var(--near-black);
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: 999px;
  text-decoration: none;
  transition: background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease);
}
.post-filter-chip:hover {
  background: var(--berry);
  color: var(--white);
  border-color: var(--berry);
}
.post-filter-chip__count {
  font-size: 10px;
  color: var(--logo-grey);
  font-weight: 400;
}
.post-filter-chip:hover .post-filter-chip__count { color: rgba(255,255,255,0.7); }
.post-filter-chip--rss { color: var(--berry); border-color: var(--berry-light); }
.post-filter-chip--rss:hover { background: var(--berry); color: var(--white); }

/* Author bio band */
.post-author-bio { padding: var(--space-48) clamp(20px, 4vw, 40px); }

/* Pagination */
.navigation.pagination .nav-links {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-8);
  align-items: center;
  justify-content: center;
}
.navigation.pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  height: 44px;
  padding: 0 12px;
  font-family: var(--font-label);
  font-size: 13px;
  color: var(--near-black);
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  text-decoration: none;
  transition: background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease);
}
.navigation.pagination .page-numbers:hover {
  background: var(--berry);
  color: var(--white);
  border-color: var(--berry);
}
.navigation.pagination .page-numbers.current {
  background: var(--berry);
  color: var(--white);
  border-color: var(--berry);
  font-weight: 600;
}
.navigation.pagination .page-numbers.dots { border: 0; background: transparent; color: var(--logo-grey); }

/* Print styles for single posts */
@media print {
  .site-header, .site-footer, #back-to-top, .nav-overlay,
  .post-sidebar, .cta-band, .post-author-bio, .breadcrumbs,
  .photo-hero__scrim, .post-tags { display: none !important; }
  .photo-hero { min-height: auto; margin-top: 0; }
  .photo-hero__img img { max-height: 200px; }
  .post-layout { display: block; grid-template-columns: none; }
  .post-body { max-width: 100% !important; }
  body { background: white; color: black; }
  a { color: black; text-decoration: underline; }
}

/* =============================================================
   LEGACY CLASS COMPAT — content pasted in WP editor with old markup
   Maps parent theme's class names onto brand patterns so pages
   built before the redesign still render correctly.
   ============================================================= */
.featured-logos { padding: var(--space-32) 0 var(--space-48); }
.featured-logos .logos-container {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--space-32) var(--space-48);
  align-items: center;
  justify-items: center;
}
@media (min-width: 640px) { .featured-logos .logos-container { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 960px) { .featured-logos .logos-container { grid-template-columns: repeat(4, 1fr); } }
.featured-logos .logo-single { display: flex; align-items: center; justify-content: center; min-height: 100px; }
.featured-logos .logo-single img {
  max-height: 80px; max-width: 160px;
  width: auto; height: auto;
  margin: 0 !important;
  filter: grayscale(1);
  opacity: 0.75;
  transition: filter var(--dur-std) var(--ease), opacity var(--dur-std) var(--ease);
}
.featured-logos .logo-single a { display: flex; align-items: center; justify-content: center; }
.featured-logos .logo-single a:hover img,
.featured-logos .logo-single:hover img { filter: grayscale(0); opacity: 1; }

/* Inline images dropped via WP editor inside .prose — give them brand treatment */
.prose figure.wp-block-image { margin: var(--space-32) 0; }
.prose figure.wp-block-image img { border-radius: var(--radius-sm); border: 1px solid var(--border); max-width: 100%; height: auto; }
.prose figure.wp-block-image figcaption { font-size: 13px; color: var(--mid-grey); margin-top: var(--space-8); text-align: center; }
.prose .wp-block-list { padding-left: 1.2em; }
.prose .wp-block-heading { margin-top: var(--space-48); }

/* Old vacancy detail list (icon + value rows) — used by legacy single-vacancies */
.vacancy-detail { list-style: none; display: flex; flex-direction: column; gap: var(--space-12); padding: 0; margin: var(--space-24) 0; }
.vacancy-detail li { display: flex; align-items: center; gap: var(--space-12); font-size: 14px; color: var(--near-black); }
.vacancy-detail li span { color: var(--berry); font-size: 14px; min-width: 18px; }

/* =============================================================
   SINGLE VACANCY — two-col with sticky role-detail card
   ============================================================= */
.vacancy-layout {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-48);
}
@media (min-width: 960px) {
  .vacancy-layout { grid-template-columns: 320px 1fr; gap: var(--space-64); }
}

.vacancy-detail-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: var(--space-24);
}
@media (min-width: 960px) {
  .vacancy-detail-card {
    position: sticky;
    top: calc(var(--nav-height) + var(--space-24));
    align-self: start;
  }
}

.vacancy-meta {
  display: flex;
  flex-direction: column;
  margin: var(--space-16) 0 var(--space-24);
}
.vacancy-meta__row {
  display: grid;
  grid-template-columns: 88px 1fr;
  gap: var(--space-16);
  padding: var(--space-12) 0;
  border-bottom: 0.5px solid var(--border-subtle);
  align-items: baseline;
}
.vacancy-meta__row:last-child { border-bottom: 0; }
.vacancy-meta dt {
  font-family: var(--font-label);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--logo-grey);
  margin: 0;
}
.vacancy-meta dd {
  font-size: 14px;
  color: var(--near-black);
  margin: 0;
  font-weight: 500;
}

.vacancy-detail-card__cta {
  padding-top: var(--space-16);
  border-top: 0.5px solid var(--border);
}

.vacancy-body .wp-block-list { padding-left: 1.2em; }
.vacancy-body .wp-block-list li + li { margin-top: var(--space-8); }
.vacancy-body p > strong:only-child {
  display: block;
  font-family: var(--font-heading);
  font-weight: 600;
  font-size: 20px;
  color: var(--near-black);
  margin-top: var(--space-32);
}

.vacancy-apply-cta {
  background: var(--warm-white);
  padding: var(--space-32);
  border-radius: var(--radius);
  border: 1px solid var(--border);
  margin-top: var(--space-32);
}

/* Mobile sticky apply bar */
.mobile-apply-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-16);
  position: fixed;
  bottom: 0; left: 0; right: 0;
  background: var(--white);
  border-top: 1px solid var(--border);
  padding: var(--space-12) var(--space-16);
  z-index: 90;
  box-shadow: 0 -4px 16px rgba(0,0,0,0.08);
}
.mobile-apply-bar .btn { min-height: 40px; padding: 10px 18px; font-size: 13px; flex-shrink: 0; }
@media (min-width: 960px) {
  .mobile-apply-bar { display: none; }
}
/* Pad page bottom so sticky bar doesn't cover footer content on mobile */
@media (max-width: 959px) {
  .single-vacancy { padding-bottom: 72px; }
}

/* =============================================================
   CONTACT FORM 7 — brand-styled
   ============================================================= */
.wpcf7 { font-family: var(--font-body); }
.wpcf7-form { display: flex; flex-direction: column; gap: var(--space-16); }
.wpcf7-form-control-wrap { display: block; }
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 input[type="url"],
.wpcf7 textarea,
.wpcf7 select {
  width: 100%;
  font-family: var(--font-body);
  font-size: 15px;
  color: var(--near-black);
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 12px 14px;
  min-height: 44px;
  line-height: 1.4;
  transition: border-color var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease);
  -webkit-appearance: none;
  appearance: none;
}
.wpcf7 textarea { min-height: 140px; resize: vertical; }
.wpcf7 input::placeholder,
.wpcf7 textarea::placeholder { color: var(--nav-grey); }
.wpcf7 input:focus,
.wpcf7 textarea:focus,
.wpcf7 select:focus {
  outline: none;
  border-color: var(--berry);
  box-shadow: 0 0 0 3px rgba(134, 39, 89, 0.18);
}
.wpcf7 .select-wrapper { position: relative; }
.wpcf7 .select-wrapper::after {
  content: ''; position: absolute; right: 16px; top: 50%;
  width: 8px; height: 8px;
  border-right: 1.5px solid var(--logo-grey);
  border-bottom: 1.5px solid var(--logo-grey);
  transform: translateY(-70%) rotate(45deg);
  pointer-events: none;
}
.wpcf7 select { padding-right: 36px; }
.wpcf7-submit {
  display: inline-flex; align-items: center; justify-content: center;
  font-family: var(--font-body); font-size: 14px; font-weight: 600; letter-spacing: 0.02em;
  padding: 12px 28px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--berry);
  background: var(--berry);
  color: var(--white);
  cursor: pointer;
  min-height: 44px;
  width: auto;
  align-self: flex-start;
  transition: background var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease);
}
.wpcf7-submit:hover { background: var(--berry-dark); border-color: var(--berry-dark); }
.wpcf7-not-valid-tip { font-size: 12px; color: var(--status-error); margin-top: 4px; display: block; }
.wpcf7-response-output { margin-top: var(--space-16); padding: var(--space-12) var(--space-16); border-radius: var(--radius-sm); font-size: 14px; border-left: 3px solid var(--border); background: var(--warm-white); }
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output { border-left-color: var(--status-error); color: var(--status-error); }
.wpcf7 form.sent .wpcf7-response-output { border-left-color: var(--status-ok); color: var(--status-ok); }
.wpcf7-spinner { display: inline-block; vertical-align: middle; margin-left: 8px; }

/* Hide the validates-as-required asterisks Wpcf7 injects — placeholder already carries hint */
.wpcf7 .hidden-fields-container { display: none; }

/* Map embed wrapper */
.embed-map {
  margin-top: var(--space-32);
  border-radius: var(--radius);
  overflow: hidden;
  border: 1px solid var(--border);
  aspect-ratio: 16 / 9;
  position: relative;
}
.embed-map iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; display: block; }

/* =============================================================
   CONTACT PAGE — quick chips, emergency band, dept cards, SLA, FAQ
   ============================================================= */

/* Quick-contact bar */
.quick-contact {
  background: var(--warm-white);
  border-bottom: 1px solid var(--border);
  padding: var(--space-24) clamp(20px, 4vw, 40px);
}
.quick-contact__inner {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-12);
}
@media (min-width: 640px) { .quick-contact__inner { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 960px) { .quick-contact__inner { grid-template-columns: repeat(4, 1fr); } }

.quick-contact__chip {
  display: flex;
  align-items: center;
  gap: var(--space-12);
  padding: var(--space-16) var(--space-20, var(--space-24));
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  text-decoration: none;
  color: var(--near-black);
  transition: border-color var(--dur-fast) var(--ease), background var(--dur-fast) var(--ease);
}
.quick-contact__chip:hover { border-color: var(--berry); background: var(--white); }
.quick-contact__chip svg { color: var(--berry); flex-shrink: 0; }
.quick-contact__chip__label,
.quick-contact__label {
  display: block;
  font-family: var(--font-label);
  font-size: 10px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--logo-grey);
  margin-bottom: 2px;
}
.quick-contact__chip strong {
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 600;
  color: var(--near-black);
  display: block;
  line-height: 1.2;
  word-break: break-word;
}
.quick-contact__chip--static { cursor: default; }
.quick-contact__chip--static:hover { border-color: var(--border); }

/* Emergency band */
.emergency-band {
  background: var(--berry);
  color: var(--white);
  padding: var(--space-24) clamp(20px, 4vw, 40px);
  border-bottom: 1px solid var(--berry-dark);
}
.emergency-band__inner {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-16);
  align-items: center;
}
@media (min-width: 768px) {
  .emergency-band__inner { grid-template-columns: 1fr auto; gap: var(--space-32); }
}
.emergency-band__copy {
  font-size: 15px;
  color: rgba(255,255,255,0.95);
  line-height: 1.5;
}
.emergency-band__cta { flex-shrink: 0; }

/* Department cards */
.dept-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-16);
}
@media (min-width: 640px) { .dept-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .dept-grid { grid-template-columns: repeat(4, 1fr); } }
.dept-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: var(--space-24);
  display: flex;
  flex-direction: column;
  gap: var(--space-12);
  transition: border-color var(--dur-fast) var(--ease), box-shadow var(--dur-std) var(--ease);
}
.dept-card:hover { border-color: var(--berry); box-shadow: 0 8px 20px rgba(0,0,0,0.04); }
.dept-card__label {
  font-family: var(--font-heading);
  font-size: 17px;
  font-weight: 600;
  color: var(--near-black);
  line-height: 1.25;
}
.dept-card__desc {
  font-size: 13px;
  line-height: 1.55;
  color: var(--mid-grey);
  flex: 1;
}
.dept-card__email {
  font-family: var(--font-body);
  font-size: 13px;
  color: var(--berry);
  text-decoration: none;
  font-weight: 500;
  word-break: break-word;
  border-bottom: 1px solid var(--berry-light);
  padding-bottom: 2px;
  width: fit-content;
  transition: border-color var(--dur-fast) var(--ease);
}
.dept-card__email:hover { border-bottom-color: var(--berry); }
.dept-card__tel {
  font-size: 12px;
  color: var(--mid-grey);
}
.dept-card__tel a { color: var(--near-black); text-decoration: none; font-weight: 600; }
.dept-card__tel a:hover { color: var(--berry); }

/* SLA card (sidebar) */
.sla-card {
  background: var(--berry-light);
  border-left: 3px solid var(--berry);
  padding: var(--space-24);
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
}
.sla-card .eyebrow { margin-bottom: var(--space-12); }
.sla-list {
  display: flex;
  flex-direction: column;
  gap: var(--space-8);
}
.sla-list > div {
  display: grid;
  grid-template-columns: 110px 1fr;
  gap: var(--space-12);
  padding: 6px 0;
  border-bottom: 0.5px solid rgba(134, 39, 89, 0.15);
  font-size: 13px;
}
.sla-list > div:last-child { border-bottom: 0; }
.sla-list dt {
  font-family: var(--font-label);
  font-size: 10px;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--berry);
  font-weight: 500;
}
.sla-list dd { color: var(--near-black); font-weight: 500; margin: 0; }

/* Trust strip (sidebar) */
.contact-trust-strip {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: var(--space-12);
  align-items: center;
  margin-top: var(--space-12);
}
.contact-trust-strip img {
  max-height: 40px;
  width: auto;
  margin: 0 auto;
  filter: grayscale(1);
  opacity: 0.7;
  transition: filter var(--dur-fast) var(--ease), opacity var(--dur-fast) var(--ease);
}
.contact-trust-strip img:hover { filter: grayscale(0); opacity: 1; }

/* Map actions row */
.map-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-12);
}

/* what3words tag — brand-coloured chip linking to what3words page */
.w3w-tag {
  display: inline-flex;
  align-items: baseline;
  gap: 4px;
  padding: 6px 12px;
  font-family: var(--font-mono);
  font-size: 13px;
  line-height: 1.2;
  color: var(--near-black);
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  text-decoration: none;
  transition: background var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease);
}
.w3w-tag:hover {
  background: var(--berry-light);
  border-color: var(--berry);
  color: var(--berry-dark);
}
.w3w-tag__mark {
  font-weight: 700;
  color: #E11F26;
}
.w3w-tag__words {
  font-weight: 500;
  letter-spacing: -0.005em;
}
.w3w-tag--inline {
  font-size: 12px;
  padding: 4px 10px;
}

/* =============================================================
   VIDEO BAND
   ============================================================= */
.video-band { padding: var(--space-80) clamp(20px, 4vw, 40px); background: var(--warm-white); }
.video-band__inner { max-width: var(--content-width); margin: 0 auto; }
.video-band__frame {
  position: relative; aspect-ratio: 16 / 9;
  border: 1px solid var(--border); border-radius: var(--radius);
  overflow: hidden;
  background: var(--near-black);
}
.video-band__frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* =============================================================
   ACCORDION — WAI-ARIA disclosure
   ============================================================= */
.accordion { max-width: var(--prose-width); margin: 0 auto; }
.accordion-item { border-top: 0.5px solid var(--border); }
.accordion-item:last-child { border-bottom: 0.5px solid var(--border); }
.accordion-item__trigger {
  display: flex; align-items: center; justify-content: space-between; width: 100%;
  padding: var(--space-24) 0;
  text-align: left;
  font-family: var(--font-heading);
  font-size: 20px; font-weight: 600;
  color: var(--near-black);
}
.accordion-item__icon { width: 16px; height: 16px; position: relative; flex-shrink: 0; margin-left: var(--space-16); }
.accordion-item__icon::before, .accordion-item__icon::after {
  content: ''; position: absolute; background: var(--berry);
  transition: transform var(--dur-std) var(--ease);
}
.accordion-item__icon::before { top: 50%; left: 0; width: 100%; height: 1.5px; transform: translateY(-50%); }
.accordion-item__icon::after  { left: 50%; top: 0; height: 100%; width: 1.5px; transform: translateX(-50%); }
.accordion-item[data-open="true"] .accordion-item__icon::after { transform: translateX(-50%) scaleY(0); }
.accordion-item__panel {
  max-height: 0; overflow: hidden;
  transition: max-height var(--dur-std) var(--ease);
}
.accordion-item[data-open="true"] .accordion-item__panel { max-height: 1000px; }
.accordion-item__panel-inner { padding: 0 0 var(--space-24); color: var(--mid-grey); font-size: 16px; line-height: 1.7; }

/* =============================================================
   PROSE — long-form article styling
   ============================================================= */
.prose { max-width: var(--prose-width); margin: 0 auto; }
.prose > * + * { margin-top: var(--space-24); }
.prose h2 { margin-top: var(--space-48); }
.prose h3 { margin-top: var(--space-32); }
.prose ul, .prose ol { padding-left: 1.2em; }
.prose li + li { margin-top: var(--space-8); }
.prose a:not(.btn) { color: var(--berry); }
.prose a.btn { text-decoration: none; }
.prose blockquote {
  border-left: 2px solid var(--berry);
  padding-left: var(--space-24);
  font-family: var(--font-italic);
  font-style: italic;
  font-size: 20px;
  color: var(--near-black);
}

/* =============================================================
   SIDEBAR LAYOUT — sticky in-page nav for division/about pages
   ============================================================= */
.sidebar-layout {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-48);
  max-width: var(--content-width);
  margin: 0 auto;
  padding: clamp(48px, 7vw, 80px) clamp(20px, 4vw, 40px);
}
@media (min-width: 960px) {
  .sidebar-layout { grid-template-columns: 240px 1fr; gap: var(--space-64); }
}
.sidebar-nav { position: sticky; top: calc(var(--nav-height) + var(--space-24)); align-self: start; }
.sidebar-nav h4 { font-family: var(--font-label); color: var(--logo-grey); font-size: 11px; font-weight: 500; letter-spacing: 0.2em; text-transform: uppercase; margin-bottom: var(--space-16); }
.sidebar-nav ul { list-style: none; display: flex; flex-direction: column; gap: var(--space-8); border-left: 0.5px solid var(--border); }
.sidebar-nav a {
  display: block; padding: var(--space-8) var(--space-16);
  font-size: 14px; color: var(--mid-grey); text-decoration: none;
  border-left: 2px solid transparent; margin-left: -1px;
  transition: color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease);
}
.sidebar-nav a:hover, .sidebar-nav a[aria-current="true"] { color: var(--berry); border-left-color: var(--berry); }

/* =============================================================
   CTA BAND
   ============================================================= */
.cta-band {
  background: var(--berry); color: var(--white);
  padding: clamp(56px, 8vw, 96px) clamp(20px, 4vw, 40px);
  text-align: center;
}
.cta-band__inner { max-width: 720px; margin: 0 auto; }
.cta-band h2 { color: var(--white); margin-bottom: var(--space-24); }
.cta-band p { color: rgba(255,255,255,0.85); margin-bottom: var(--space-32); }

/* =============================================================
   REVEAL ANIMATION
   ============================================================= */
.reveal { opacity: 0; transform: translateY(12px); transition: opacity 500ms var(--ease), transform 500ms var(--ease); }
.reveal[data-visible="true"] { opacity: 1; transform: none; }

/* =============================================================
   UTILITIES
   ============================================================= */
.text-center { text-align: center; }
.text-berry  { color: var(--berry); }
.text-white  { color: var(--white); }
.mt-0  { margin-top: 0; }
.mt-16 { margin-top: var(--space-16); }
.mt-24 { margin-top: var(--space-24); }
.mt-32 { margin-top: var(--space-32); }
.mt-48 { margin-top: var(--space-48); }
.mb-0  { margin-bottom: 0; }
.mb-16 { margin-bottom: var(--space-16); }
.mb-24 { margin-bottom: var(--space-24); }
.mb-32 { margin-bottom: var(--space-32); }