/* ═══════════════════════════════════════════════════════════════════
   ADM DEVELOPER — SECTION STYLES
   Light/dark section system only. No coloured backgrounds.
   ACF bg_colour values map to either light (default) or dark.
   ═══════════════════════════════════════════════════════════════════ */

/* ══════════════════════════════
   BASE SECTION WRAPPER
   ══════════════════════════════ */

.adm-section {
  position: relative;
  padding: var(--section-padding-y) 0;
  overflow: clip;  /* clip (not hidden) so it doesn't form a scroll container that breaks position:sticky descendants */
  /* Apply the section's own --color-text as the inherited colour. Without this, elements that only
     inherit `color` (stat labels, accordion questions, etc.) pick up the BODY colour — which is #fff
     in dark mode — so White/forced-light sections render white-on-white. */
  color: var(--color-text);
}

/* Prevent empty sections from taking space */
.adm-section:empty,
.adm-section > .container:empty {
  padding: 0;
  margin: 0;
  min-height: 0;
}

.adm-section > .container {
  position: relative;
  z-index: 1;
}

/* ── Spacing variants ── */
.adm-section.section--sm { padding: var(--space-16) 0; }
.adm-section.section--lg { padding: var(--space-32) 0; }
.adm-section.section--none { padding: 0; }
/* Full viewport: fill the screen below the fixed header, content vertically centred.
   (svh keeps it correct on mobile browser chrome.) */
.adm-section--vh { --adm-vh-margin: 0px; min-height: calc(100svh - var(--adm-header-h, 84px) - var(--adm-announce-h, 0px) - var(--adm-vh-margin)); display: flex; flex-direction: column; justify-content: center; padding-block: var(--space-8); }
.adm-section--vh > .container { width: 100%; }
/* Card style adds the card gutter top + bottom — subtract BOTH so the box still fills exactly one
   screen. --adm-card-gutter is set by ADM Control from the real gutter (falls back to 8px). */
.adm-section--vh.adm-section--card { --adm-vh-margin: calc(2 * var(--adm-card-gutter, 8px)); }
@supports not (height: 100svh) { .adm-section--vh { min-height: calc(100vh - var(--adm-header-h, 84px) - var(--adm-announce-h, 0px) - var(--adm-vh-margin)); } }
/* Logged-in: subtract the WP admin bar so the section still fills exactly one screen. */
.admin-bar .adm-section--vh { min-height: calc(100svh - var(--adm-header-h, 84px) - var(--adm-announce-h, 0px) - var(--adm-vh-margin) - 32px); }
@media screen and (max-width: 782px) { .admin-bar .adm-section--vh { min-height: calc(100svh - var(--adm-header-h, 84px) - var(--adm-announce-h, 0px) - var(--adm-vh-margin) - 46px); } }

/* ── Header block centring (driven by data-align = HEADER alignment) ──
   Only centres the .section-header block; the SECTION-wide text-align is driven by
   content_align (.text-center/.text-right) so content can align independently. */
.adm-section[data-align="center"] .section-header { margin-left: auto; margin-right: auto; }
.adm-section[data-align="center"] .section-header__actions { justify-content: center; }
/* Right header alignment is handled by .adm-ha-right .section-header (header only). This must NOT
   set section-wide text-align, or it re-couples content alignment to the heading (the split bug). */
.adm-section[data-align="right"] .section-header { margin-left: auto; margin-right: 0; }

/* ── Grid column override (driven by data-columns) ── */
.adm-section[data-columns="2"] .grid { grid-template-columns: repeat(2, 1fr); }
.adm-section[data-columns="3"] .grid { grid-template-columns: repeat(3, 1fr); }
.adm-section[data-columns="4"] .grid { grid-template-columns: repeat(4, 1fr); }
.adm-section[data-columns="auto"] .grid { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }

/* ── Reverse layout ── */
.adm-section--reverse .split { direction: rtl; }
.adm-section--reverse .split > * { direction: ltr; }

/* Split layout fallback — if one child is empty, go single column */
.split:has(> *:only-child) {
  grid-template-columns: 1fr;
}

/* Ensure images inside split don't overflow */
.split img {
  max-width: 100%;
  height: auto;
}

/* ── MagicUI section-level effect: animated border wraps the whole section ── */
.magic-border-section {
  border: 1px solid transparent;
  background-clip: padding-box;
}

/* Prose content (WYSIWYG output) */
.prose { line-height: var(--line-height-relaxed); }
.prose p { margin-bottom: var(--space-4); color: var(--color-text-secondary); }
.prose p:last-child { margin-bottom: 0; }
.prose ul, .prose ol { margin-bottom: var(--space-4); padding-left: var(--space-6); }
.prose li { margin-bottom: var(--space-2); color: var(--color-text-secondary); }
.prose ul li { list-style-type: disc; }
.prose ol li { list-style-type: decimal; }
.prose h2, .prose h3, .prose h4 { margin-top: var(--space-8); margin-bottom: var(--space-4); }
.prose a { color: var(--color-brand); text-decoration: underline; text-underline-offset: 2px; }
.prose strong { font-weight: var(--font-weight-semibold); color: var(--color-text); }
.prose img { border-radius: var(--radius-md); margin: var(--space-6) 0; }
.prose blockquote { border-left: 3px solid var(--color-brand); padding-left: var(--space-4); margin: var(--space-6) 0; font-style: italic; color: var(--color-text-secondary); }


/* ══════════════════════════════
   LIGHT SECTIONS (default)
   No data-bg, or Grey
   ══════════════════════════════ */

.adm-section:not([data-bg]),
.adm-section[data-bg=""] {
  background: transparent;
}

.adm-section[data-bg="Grey"] {
  background: var(--color-surface-2);
}

/* ══════════════════════════════
   NEUTRAL BACKGROUND STEPS — White · Light · Dark · Black
   ══════════════════════════════ */

/* White — pure #fff, dark text (default text colour) */
.adm-section.adm-section--white,
.adm-section[data-bg="White"] {
  background: #ffffff;
  /* White is an always-light surface. Force the full light-mode token set so a
     White section looks identical in light and dark mode — otherwise in dark
     mode the text is white (invisible) and cards/borders stay dark. */
  --color-text: #1a1a1a;
  --color-text-secondary: #6b6b6b;
  --color-text-muted: #999999;
  --color-bg: #ffffff;
  --color-surface-1: #ffffff;
  --color-surface-2: #f0f0f2;
  --color-surface-3: #e5e5ea;
  --color-border: rgba(0, 0, 0, 0.08);
  --color-border-strong: rgba(0, 0, 0, 0.15);
  --color-brand-dim: rgba(229, 0, 109, 0.08);
  /* Pin the glass tokens too, so a glass container effect stays a LIGHT frosted card
     here in dark mode (otherwise the card frosts dark while the text is forced dark). */
  --glass-bg: rgba(255, 255, 255, 0.72);
  --glass-bg-strong: rgba(255, 255, 255, 0.85);
  --glass-border: rgba(255, 255, 255, 0.5);
}

/* Light — subtle off-white (the page tone) */
.adm-section[data-bg="Light"] {
  background: var(--color-bg);
}

/* Black — pure #000 (inherits the --dark light-text treatment below) */
.adm-section.adm-section--black,
.adm-section[data-bg="Black"] {
  background: #000000;
}


/* ══════════════════════════════
   BACKGROUND IMAGE SECTIONS
   ══════════════════════════════ */

.adm-section--has-bg-image {
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
}


/* ══════════════════════════════
   DARK SECTIONS
   Any "coloured" ACF value (Magenta, Purple, Black) renders as dark.
   Clean, consistent dark treatment.
   ══════════════════════════════ */

/* All dark section styles use the .adm-section--dark class (added by PHP) */
.adm-section.adm-section--dark,
.adm-section[data-bg="Dark"] {
  background: #0a0a0a;
  color: #ffffff;
}

.adm-section--dark p,
.adm-section--dark .card__desc,
.adm-section--dark .label,
.adm-section--dark .section-header__desc,
.adm-section--dark .lead,
.adm-section--dark .prose p {
  color: rgba(255, 255, 255, 0.7);
}

.adm-section--dark h1,
.adm-section--dark h2,
.adm-section--dark h3,
.adm-section--dark h4,
.adm-section--dark h5,
.adm-section--dark h6,
.adm-section--dark .card__title {
  color: #ffffff;
}

.adm-section--dark .card {
  background: rgba(255, 255, 255, 0.05);
  border-color: rgba(255, 255, 255, 0.08);
}

.adm-section--dark .card:hover {
  border-color: rgba(255, 255, 255, 0.15);
}

.adm-section--dark .btn--primary {
  background: var(--color-brand);
  color: #ffffff;
  border-color: var(--color-brand);
}

.adm-section--dark .btn--secondary {
  border-color: rgba(255, 255, 255, 0.2);
  color: #ffffff;
}

.adm-section--dark .btn--secondary:hover {
  border-color: var(--color-brand);
  color: var(--color-brand);
  background: rgba(229, 0, 109, 0.1);
}

.adm-section--dark .btn--ghost {
  color: rgba(255, 255, 255, 0.7);
}

.adm-section--dark .kpi {
  background: rgba(255, 255, 255, 0.04);
  border-color: rgba(255, 255, 255, 0.08);
}

.adm-section--dark .kpi__value {
  color: #ffffff;
}

.adm-section--dark .kpi__label {
  color: rgba(255, 255, 255, 0.5);
}

.adm-section--dark .badge--neutral {
  background: rgba(255, 255, 255, 0.08);
  color: rgba(255, 255, 255, 0.7);
  border-color: rgba(255, 255, 255, 0.12);
}

.adm-section--dark .section-header__overline {
  color: var(--color-brand);
}

.adm-section--dark .magic-line-grid::before {
  background-image:
    linear-gradient(rgba(229, 0, 109, 0.02) 1px, transparent 1px),
    linear-gradient(90deg, rgba(229, 0, 109, 0.02) 1px, transparent 1px);
}

/* Magenta bg-effects: brand-tinted patterns are invisible on the brand bg.
   Re-tint to translucent white (compound selectors — the effect class sits on
   the same <section> element as adm-section--magenta, not a descendant). */
.adm-section--magenta.magic-dot-grid::before {
  background-image: radial-gradient(rgba(255, 255, 255, 0.18) 1px, transparent 1px);
}
.adm-section--magenta.magic-line-grid::before {
  background-image:
    linear-gradient(rgba(255, 255, 255, 0.10) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.10) 1px, transparent 1px);
}
.adm-section--magenta .magic-line-grid__square {
  background: rgba(255, 255, 255, 0.10);
  border-color: rgba(255, 255, 255, 0.18);
}
.adm-section--magenta.magic-mesh-bg::before {
  background:
    radial-gradient(circle at 20% 80%, rgba(255, 255, 255, 0.10) 0%, transparent 50%),
    radial-gradient(circle at 80% 20%, rgba(255, 255, 255, 0.07) 0%, transparent 50%),
    radial-gradient(circle at 50% 50%, rgba(255, 255, 255, 0.05) 0%, transparent 50%);
}

.adm-section--dark .border,
.adm-section--dark hr {
  border-color: rgba(255, 255, 255, 0.08);
}

.adm-section--dark .input,
.adm-section--dark .textarea {
  background: rgba(255, 255, 255, 0.05);
  border-color: rgba(255, 255, 255, 0.1);
  color: #ffffff;
}

/* Marquee fade edges now use CSS mask (in magic-ui.css) — works on all backgrounds */


/* ══════════════════════════════
   DOT PATTERN OVERLAYS
   ══════════════════════════════ */

.adm-section__dots {
  position: absolute;
  width: 200px;
  height: 200px;
  background-image: radial-gradient(circle, currentColor 1.5px, transparent 1.5px);
  background-size: 16px 16px;
  opacity: 0.06;
  pointer-events: none;
  z-index: 0;
}

.adm-section__dots[data-dot-color="White"] { color: #ffffff; }
.adm-section__dots[data-dot-color="Black"] { color: #000000; }
.adm-section__dots[data-dot-color="Grey"] { color: #888888; }

.adm-section__dots[data-dot-pos~="top"] { top: -40px; }
.adm-section__dots[data-dot-pos~="bottom"] { bottom: -40px; top: auto; }
.adm-section__dots[data-dot-pos~="center"] { top: 50%; transform: translateY(-50%); }
.adm-section__dots[data-dot-pos~="left"] { left: -40px; }
.adm-section__dots[data-dot-pos~="right"] { right: -40px; left: auto; }

.adm-section__dots:not([data-dot-pos]) {
  top: var(--space-8);
  right: var(--space-8);
}


/* ══════════════════════════════
   ACCENT COLOUR (links within section)
   ══════════════════════════════ */

.adm-section a:not(.btn) {
  color: var(--color-brand);
}


/* ══════════════════════════════
   SECTION HEADER
   ══════════════════════════════ */

.section-header {
  max-width: 680px;
  margin-bottom: var(--space-12);
}

.section-header--center {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}

.section-header__overline {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--font-size-sm);
  font-family: var(--font-mono);
  font-weight: var(--font-weight-medium);
  color: var(--color-brand);
  letter-spacing: var(--letter-spacing-wider);
  text-transform: uppercase;
  margin-bottom: var(--space-4);
}

.section-header__overline::before {
  content: '';
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--color-brand);
  box-shadow: 0 0 8px var(--color-brand);
  animation: adm-pulse 2s ease-in-out infinite;
}

.section-header__title {
  margin-bottom: var(--space-4);
}

/* Optional sub-heading (sits between heading and description) */
.section-header__sub {
  font-size: clamp(var(--font-size-lg), 2.2vw, var(--font-size-2xl));
  font-weight: var(--font-weight-medium);
  color: var(--color-text-secondary);
  line-height: var(--line-height-snug, 1.25);
  margin: calc(-1 * var(--space-2)) 0 var(--space-4);
  max-width: 52ch;
}
.section-header--center .section-header__sub { margin-left: auto; margin-right: auto; }

/* ── Split alignment: header (eyebrow/heading/sub/intro) is independent of content alignment ──
   content_align sets .text-center/.text-right on the section (cascades to the cards/grids);
   header_align sets .adm-ha-* and overrides just the .section-header so you can, e.g., centre the
   heading while forcing the cards left. */
.adm-ha-center .section-header { text-align: center; margin-left: auto; margin-right: auto; }
.adm-ha-center .section-header__sub { margin-left: auto; margin-right: auto; }
.adm-ha-center .section-header__actions { justify-content: center; }
.adm-ha-left .section-header { text-align: left; margin-left: 0; margin-right: auto; }
.adm-ha-left .section-header__sub { margin-left: 0; margin-right: auto; }
.adm-ha-left .section-header__actions { justify-content: flex-start; }
.adm-ha-right .section-header { text-align: right; margin-left: auto; margin-right: 0; }
.adm-ha-right .section-header__sub { margin-left: auto; margin-right: 0; }
.adm-ha-right .section-header__actions { justify-content: flex-end; }

.section-header__desc {
  font-size: var(--font-size-lg);
  color: var(--color-text-secondary);
  line-height: var(--line-height-relaxed);
}

.section-header__actions {
  display: flex;
  gap: var(--space-3);
  margin-top: var(--space-6);
}

.section-header--center .section-header__actions {
  justify-content: center;
}


/* ══════════════════════════════
   SECTION DIVIDER
   ══════════════════════════════ */

.section-divider {
  height: 1px;
  background: var(--color-border);
  margin: 0;
}

.section-divider--brand {
  background: linear-gradient(90deg, transparent, var(--color-brand), transparent);
  opacity: 0.3;
}

/* ══════════════════════════════
   DARK SECTIONS — accordion / FAQ adapt (was white-on-dark)
   ══════════════════════════════ */
.adm-section--dark .adm-accordion__item { border-color: rgba(255, 255, 255, 0.12); }
.adm-section--dark .adm-accordion__trigger { background: rgba(255, 255, 255, 0.05); color: #ffffff; }
.adm-section--dark .adm-accordion__trigger:hover { background: rgba(255, 255, 255, 0.09); }
.adm-section--dark .adm-accordion__trigger i { color: rgba(255, 255, 255, 0.6); }
.adm-section--dark .adm-accordion__panel,
.adm-section--dark .adm-accordion__panel p { color: rgba(255, 255, 255, 0.7); }

/* ══════════════════════════════
   NUMBERED STEPS — circle (refactored from inline styles, adapts per bg)
   ══════════════════════════════ */
.adm-step { position: relative; text-align: left; }
.adm-step__num {
  width: 40px; height: 40px; border-radius: 50%;
  background: var(--color-brand-dim);
  border: 1px solid var(--color-border-brand);
  display: flex; align-items: center; justify-content: center;
  margin-bottom: var(--space-4);
}
.adm-step__num span {
  font-family: var(--font-mono);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-brand);
}

/* ══════════════════════════════
   INVERTED-SCOPE TOKEN REMAP
   Dark / Black / Magenta sections invert the colour scheme. Remap the design
   tokens *within these scopes* so that any inline `style="color:var(--color-…)"`
   (addresses, dates, icon circles, borders, etc.) adapts automatically instead
   of rendering dark-on-dark. This is the root-cause fix for inline-colour
   contrast bugs — selector rules below can't override inline styles, but a
   token remap changes what those inline vars resolve to.
   ══════════════════════════════ */
.adm-section--dark,
.adm-section--black,
.adm-section--magenta {
  --color-text: #ffffff;
  --color-text-secondary: rgba(255, 255, 255, 0.85);
  --color-text-muted: rgba(255, 255, 255, 0.7);
  --color-border: rgba(255, 255, 255, 0.18);
  --color-border-brand: rgba(255, 255, 255, 0.35);
  --color-surface-1: rgba(255, 255, 255, 0.10);
  --color-surface-2: rgba(255, 255, 255, 0.06);
}
/* On magenta, the brand tint is invisible against brand bg → use white tint.
   (Dark/Black keep --color-brand-dim, which reads fine against near-black.) */
.adm-section--magenta {
  --color-brand-dim: rgba(255, 255, 255, 0.15);
}
/* On magenta, brand-as-TEXT (phone links, quote icons, step numbers) is
   magenta-on-magenta → force white. Buttons set their own colours so are
   excluded. !important is required to beat the element's inline style. */
.adm-section--magenta a[style*="--color-brand"]:not(.btn),
.adm-section--magenta i[style*="--color-brand"],
.adm-section--magenta span[style*="--color-brand"] {
  color: #ffffff !important;
}

/* ══════════════════════════════
   MAGENTA SECTIONS — brand-colour background, white content
   ══════════════════════════════ */
.adm-section--magenta { background: var(--color-brand); color: #ffffff; }
.adm-section--magenta p,
.adm-section--magenta .card__desc,
.adm-section--magenta .label,
.adm-section--magenta .section-header__desc,
.adm-section--magenta .lead,
.adm-section--magenta .prose p { color: rgba(255, 255, 255, 0.9); }
.adm-section--magenta h1, .adm-section--magenta h2, .adm-section--magenta h3,
.adm-section--magenta h4, .adm-section--magenta h5, .adm-section--magenta h6,
.adm-section--magenta .card__title,
.adm-section--magenta .section-header__title { color: #ffffff; }
.adm-section--magenta .section-header__overline { color: rgba(255, 255, 255, 0.8); }
.adm-section--magenta .card { background: rgba(255, 255, 255, 0.1); border-color: rgba(255, 255, 255, 0.18); color: #ffffff; }
.adm-section--magenta .card:hover { border-color: rgba(255, 255, 255, 0.35); }
.adm-section--magenta .btn--primary { background: #ffffff; color: var(--color-brand); border-color: #ffffff; }
.adm-section--magenta .btn--secondary { border-color: rgba(255, 255, 255, 0.4); color: #ffffff; }
/* step circle reads white-on-white-tint instead of magenta-on-magenta */
.adm-section--magenta .adm-step__num { background: rgba(255, 255, 255, 0.15); border-color: rgba(255, 255, 255, 0.35); }
.adm-section--magenta .adm-step__num span { color: #ffffff; }
/* accordion adapts like dark */
.adm-section--magenta .adm-accordion__item { border-color: rgba(255, 255, 255, 0.2); }
.adm-section--magenta .adm-accordion__trigger { background: rgba(255, 255, 255, 0.12); color: #ffffff; }
.adm-section--magenta .adm-accordion__trigger:hover { background: rgba(255, 255, 255, 0.18); }
.adm-section--magenta .adm-accordion__trigger i { color: rgba(255, 255, 255, 0.8); }
.adm-section--magenta .adm-accordion__panel,
.adm-section--magenta .adm-accordion__panel p { color: rgba(255, 255, 255, 0.9); }

/* Magenta: inline links + brand-coloured icons must read white (not magenta-on-magenta) */
.adm-section--magenta a:not(.btn):not(.cs-card__link):not(.service-card__link):not(.adm-stats__cell--proof) { color: #ffffff; text-decoration: underline; }
.adm-section--magenta a:not(.btn):hover { color: rgba(255, 255, 255, 0.8); }
.adm-section--magenta i,
.adm-section--magenta .section-header__overline { color: rgba(255, 255, 255, 0.9); }
.adm-section--magenta .cs-card__cta,
.adm-section--magenta .award-card__result { /* badges already have own bg; keep readable */ }

/* ══════════════════════════════
   DARK + MAGENTA — vertical tabs adapt (were white-on-colour)
   ══════════════════════════════ */
.adm-section--dark .adm-tabs--vertical,
.adm-section--magenta .adm-tabs--vertical { background: rgba(255, 255, 255, 0.06); border-color: rgba(255, 255, 255, 0.16); }
.adm-section--dark .adm-tabs--vertical .adm-tabs__nav,
.adm-section--magenta .adm-tabs--vertical .adm-tabs__nav { background: rgba(255, 255, 255, 0.05); border-right-color: rgba(255, 255, 255, 0.14); }
.adm-section--dark .adm-tabs--vertical .adm-tabs__tab,
.adm-section--magenta .adm-tabs--vertical .adm-tabs__tab { color: rgba(255, 255, 255, 0.7); }
.adm-section--dark .adm-tabs--vertical .adm-tabs__tab:hover,
.adm-section--magenta .adm-tabs--vertical .adm-tabs__tab:hover { background: rgba(255, 255, 255, 0.08); color: #fff; }
.adm-section--dark .adm-tabs--vertical .adm-tabs__tab.is-active,
.adm-section--magenta .adm-tabs--vertical .adm-tabs__tab.is-active { background: rgba(255, 255, 255, 0.1); color: #fff; }
.adm-section--dark .adm-tabs__panel-title, .adm-section--magenta .adm-tabs__panel-title,
.adm-section--dark .adm-tabs__panel-lead, .adm-section--magenta .adm-tabs__panel-lead,
.adm-section--dark .adm-tabs__panel-bullets li, .adm-section--magenta .adm-tabs__panel-bullets li { color: #fff; }
.adm-section--magenta .adm-tabs__serial,
.adm-section--magenta .adm-tabs__panel-serial { color: #fff; }

/* ── Case study / award cards translucent on magenta (mirror dark treatment) ── */
.adm-section--magenta .cs-card,
.adm-section--magenta .award-card { background: rgba(255, 255, 255, 0.1); border-color: rgba(255, 255, 255, 0.2); }
.adm-section--magenta .cs-card:hover,
.adm-section--magenta .award-card:hover { border-color: rgba(255, 255, 255, 0.35); }
.adm-section--magenta .cs-card__title,
.adm-section--magenta .cs-card__excerpt,
.adm-section--magenta .cs-card__cta,
.adm-section--magenta .award-card__summary,
.adm-section--magenta .award-card__title { color: #fff; }

/* ── Magenta: form_section fixes (inputs, CF7 labels, overline dot, contact links) ── */
.adm-section--magenta .adm-form input:not([type="checkbox"]),
.adm-section--magenta .adm-form textarea,
.adm-section--magenta .iti__selected-dial-code { color: var(--color-text); }

/* intl-tel-input country dropdown is ALWAYS a white popup. The inverted-scope
   token remap (--color-text:#fff on dark/magenta sections) would otherwise make
   its country names white-on-white. Force its own light palette everywhere. */
.iti__dropdown-content,
.iti__search-input { background: #ffffff; }
.iti__country-name,
.iti__search-input { color: #1a1a1a !important; }
.iti__dial-code { color: #6b6b6b !important; }
.iti__country.iti__highlight,
.iti__country:hover { background-color: #f0f0f2 !important; }
.adm-section--magenta .adm-form__consent,
.adm-section--magenta .adm-form__consent *,
.adm-section--magenta .wpcf7-list-item-label,
.adm-section--magenta .adm-form label { color: #ffffff; }
.adm-section--magenta .section-header__overline::before { background: #ffffff; }
.adm-section--magenta a[href^="tel:"],
.adm-section--magenta a[href^="mailto:"] { color: #ffffff !important; }
.adm-section--magenta address { color: rgba(255,255,255,0.85); }

/* ── Opt-in card container (section styling option: "Rounded card container") ──
   Off by default. When enabled, the section becomes a rounded, hairline-bordered
   card inset from the page edges. The border uses the section's own --color-border
   token, so it adapts to dark/light mode and to dark/magenta section scopes. */
.adm-section--card {
    margin: 8px auto;
    max-width: calc(100% - 16px);
    border: 1px solid var(--color-border);
    border-radius: 20px;
    overflow: clip;
}
.adm-section--card + .adm-section--card { margin-top: 0; }

/* ── Consolidated Cards block ── */
/* Grid layout — column count driven by --cols (set per block) */
.adm-cards-grid { display: grid; grid-template-columns: repeat(var(--cols, 3), 1fr); gap: var(--space-5); align-items: stretch; }

/* Generic feature card (manual / posts) */
.adm-card {
    display: flex; flex-direction: column;
    background: var(--color-surface-1);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    overflow: clip;
    text-decoration: none; color: inherit;
    transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}
a.adm-card:hover { transform: translateY(-4px); border-color: var(--color-border-brand); box-shadow: 0 18px 40px -24px rgba(229,0,109,.45); }
.adm-card__media { aspect-ratio: 16 / 10; overflow: hidden; }
.adm-card__media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .4s ease; }
a.adm-card:hover .adm-card__media img { transform: scale(1.04); }
.adm-card__ic { display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; margin: var(--space-6) var(--space-6) 0; border-radius: var(--radius-md); background: var(--color-brand-dim); color: var(--color-brand); font-size: 26px; }
.adm-card__body { display: flex; flex-direction: column; gap: var(--space-2); padding: var(--space-6); }
.adm-card__tag { font-family: var(--font-mono); font-size: var(--font-size-2xs); text-transform: uppercase; letter-spacing: .08em; color: var(--color-brand); }
.adm-card__title { font-size: var(--font-size-lg); font-weight: var(--font-weight-medium); margin: 0; text-wrap: balance; }
/* Sector / service / industry link cards: smaller title so long names ("SEO for Competitions")
   sit on one line and every card in the row reads at a uniform size. */
.adm-block--cards-service_children .adm-card__title,
.adm-block--cards-service .adm-card__title,
.adm-block--cards-industry .adm-card__title { font-size: var(--font-size-base); line-height: 1.3; }
.adm-card__text { font-size: var(--font-size-sm); color: var(--color-text-secondary); margin: 0; }
.adm-card__link { display: inline-flex; align-items: center; gap: 6px; margin-top: var(--space-2); color: var(--color-brand); font-weight: var(--font-weight-medium); font-size: var(--font-size-sm); }
/* The icon box and CTA are flex items, so the section's text-align can't move them — follow content alignment via align-self. */
.text-center .adm-card__ic, .text-center .adm-card__link { align-self: center; }
.text-right  .adm-card__ic, .text-right  .adm-card__link { align-self: flex-end; }

/* Container-level container-effect: for blocks that don't apply the effect to inner cards, the
   .container itself becomes a bordered surface so the chosen effect (beam/border/glow/shimmer/glass)
   always renders. The magic-* class already adds position:relative + the animated layer. */
.container.adm-container-fx { background: var(--color-surface-1); border: 1px solid var(--color-border); border-radius: var(--radius-xl); padding: clamp(var(--space-8), 4vw, var(--space-16)); }
.container.adm-container-fx.magic-glass { background: var(--glass-bg-strong); border-color: var(--color-border); box-shadow: var(--shadow-sm); }
.adm-section--magenta .container.adm-container-fx, .adm-section--dark .container.adm-container-fx, .adm-section--black .container.adm-container-fx { background: rgba(255,255,255,0.06); }
/* Award card: image ALWAYS on white (badges aren't theme-adaptive) */
.adm-card--award .adm-card__media--badge { aspect-ratio: 4 / 3; background: #fff; display: flex; align-items: center; justify-content: center; padding: var(--space-6); }
.adm-card--award .adm-card__media--badge img { width: 100%; height: 100%; object-fit: contain; }

/* ── Blog cards (post source) — image top, category tags, title, Read More + date footer ── */
.adm-card--blog { height: 100%; }
.adm-card--blog .adm-card__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.adm-card--blog .adm-card__body { gap: var(--space-3); flex: 1; }
.adm-card__tags { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.adm-card__tags .adm-card__tag { display: inline-flex; align-items: center; font-family: var(--font-sans); font-size: var(--font-size-xs); font-weight: var(--font-weight-medium); text-transform: none; letter-spacing: 0; color: var(--color-brand); background: var(--color-brand-dim); border-radius: var(--radius-sm); padding: 5px 12px; }
.adm-card--blog .adm-card__title { font-size: var(--font-size-xl); }
.adm-card__foot { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); margin-top: auto; padding-top: var(--space-4); }
/* Blog card date sits on its own line, pushed to the bottom above the full-width CTA. */
.adm-card--blog .adm-card__date { font-family: var(--font-mono); font-size: var(--font-size-sm); color: var(--color-text-muted); margin-top: auto; }
.adm-card__date { font-family: var(--font-mono); font-size: var(--font-size-sm); color: var(--color-text-muted); }
/* Blog card full-width Read More CTA: default surface-2 + brand text, hover inverts to ink/bg. */
.adm-card__cta { display: flex; align-items: center; justify-content: center; gap: var(--space-2); width: 100%; padding: var(--space-4); border-radius: var(--radius-md); background: var(--color-surface-2); color: var(--color-brand); font-weight: var(--font-weight-medium); font-size: var(--font-size-sm); transition: background var(--duration-fast) ease, color var(--duration-fast) ease; }
a.adm-card--blog:hover .adm-card__cta { background: var(--color-text); color: var(--color-bg); }
.adm-card__cta svg { width: 18px; height: 18px; transition: transform var(--duration-fast) ease; }
a.adm-card--blog:hover .adm-card__cta svg { transform: translateX(3px); }
/* Featured-first layout: one large card on top (image left), then the grid */
.adm-blog { display: flex; flex-direction: column; gap: var(--space-5); margin-top: var(--space-6); }
/* Fixed compact height so the wide hero image can't inflate the card; the image
   cover-crops to fill the left column, the body is vertically centred with padding. */
.adm-card--blog-feat { display: grid; grid-template-columns: 1.15fr 1fr; align-items: stretch; height: 340px; }
.adm-card--blog-feat .adm-card__media { aspect-ratio: auto; height: 100%; min-height: 0; overflow: hidden; }
.adm-card--blog-feat .adm-card__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
/* Compact featured body: centred, clear padding, smaller title, 2-line excerpt, inline CTA. */
.adm-card--blog-feat .adm-card__body { padding: var(--space-6); justify-content: center; gap: var(--space-3); }
.adm-card--blog-feat .adm-card__title { font-size: var(--font-size-2xl); line-height: 1.25; }
.adm-card--blog-feat .adm-card__text { font-size: var(--font-size-sm); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.adm-card--blog-feat .adm-card__date { margin-top: var(--space-1); }
.adm-card--blog-feat .adm-card__cta { width: auto; align-self: flex-start; padding: var(--space-3) var(--space-5); }

/* Compact grid cards: shorter media, smaller title, 2-line excerpt, smaller CTA. */
.adm-card--blog:not(.adm-card--blog-feat) .adm-card__media { aspect-ratio: 16 / 9; }
.adm-card--blog:not(.adm-card--blog-feat) .adm-card__body { padding: var(--space-6); gap: var(--space-3); }
.adm-card--blog:not(.adm-card--blog-feat) .adm-card__title { font-size: var(--font-size-lg); line-height: 1.35; }
.adm-card--blog:not(.adm-card--blog-feat) .adm-card__text { font-size: var(--font-size-sm); line-height: 1.55; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.adm-card--blog:not(.adm-card--blog-feat) .adm-card__cta { padding: var(--space-3) var(--space-4); font-size: var(--font-size-sm); }

@media (max-width: 760px) { .adm-card--blog-feat { grid-template-columns: 1fr; height: auto; } .adm-card--blog-feat .adm-card__media { height: 180px; min-height: 180px; } .adm-card--blog-feat .adm-card__body { padding: var(--space-5); } }

@media (max-width: 900px) { .adm-cards-grid { grid-template-columns: repeat(2, 1fr); } }

/* ── Mobile layout option: turn grids into a swipe carousel (opt-in via section "Mobile layout = Carousel") ── */
@media (max-width: 680px) {
  .adm-section--m-carousel .adm-cards-grid,
  .adm-section--m-carousel .adm-features__grid,
  .adm-section--m-carousel .adm-m-counters,
  .adm-section--m-carousel .adm-m-rings {
    display: flex; grid-template-columns: none; overflow-x: auto; scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch; scrollbar-width: none; gap: var(--space-4);
    margin-inline: calc(var(--space-4) * -1); padding: 0 var(--space-4) var(--space-3);
  }
  .adm-section--m-carousel .adm-cards-grid::-webkit-scrollbar,
  .adm-section--m-carousel .adm-features__grid::-webkit-scrollbar { display: none; }
  /* Cards / features: 82% width with a left-snap so the next card peeks (hints more content). */
  .adm-section--m-carousel .adm-cards-grid > *,
  .adm-section--m-carousel .adm-features__grid > * {
    flex: 0 0 82%; scroll-snap-align: start;
  }
  /* Stats counters / rings: ONE per view, full width, centre-snapped so the big number sits dead
     centre under the nav (82% left-snap made it look shoved to one side). */
  .adm-section--m-carousel .adm-m-counters > *,
  .adm-section--m-carousel .adm-m-rings > * {
    flex: 0 0 100%; scroll-snap-align: center; text-align: center;
  }
}
@media (max-width: 560px) { .adm-cards-grid { grid-template-columns: 1fr; } }

/* Dots + prev/next nav for the mobile "Carousel / swipe" layout (markup built by carousel.js). */
.adm-mcar__controls { display: none; }
@media (max-width: 680px) {
  .adm-section--m-carousel .adm-mcar__controls { display: flex; align-items: center; justify-content: center;
    gap: var(--space-4); margin-top: var(--space-5); }
  .adm-mcar__btn { flex: 0 0 auto; width: 44px; height: 44px; border-radius: 50%;
    border: 1px solid var(--color-border-strong); background: transparent; color: var(--color-text);
    display: grid; place-items: center; cursor: pointer;
    transition: background .15s ease, opacity .15s ease, transform .1s ease; }
  .adm-mcar__btn:not(:disabled):hover { background: var(--color-surface-2); }
  .adm-mcar__btn:not(:disabled):active { transform: scale(.94); }
  .adm-mcar__btn:disabled { opacity: .3; cursor: default; }
  .adm-mcar__dots { display: flex; align-items: center; justify-content: center; gap: 8px; }
  .adm-mcar__dot { width: 8px; height: 8px; padding: 0; border: 0; border-radius: 999px; cursor: pointer;
    background: var(--color-border-strong); transition: width .2s ease, background .2s ease; }
  .adm-mcar__dot.is-active { width: 28px; background: var(--color-brand); }

  /* Legibility on dark / black / magenta sections — controls go white (magenta => white, not brand). */
  .adm-section--dark .adm-mcar__btn, .adm-section--black .adm-mcar__btn, .adm-section--magenta .adm-mcar__btn {
    border-color: rgba(255,255,255,.55); color: #fff; }
  .adm-section--dark .adm-mcar__btn:not(:disabled):hover, .adm-section--black .adm-mcar__btn:not(:disabled):hover, .adm-section--magenta .adm-mcar__btn:not(:disabled):hover {
    background: rgba(255,255,255,.14); }
  .adm-section--dark .adm-mcar__dot, .adm-section--black .adm-mcar__dot, .adm-section--magenta .adm-mcar__dot {
    background: rgba(255,255,255,.4); }
  .adm-section--dark .adm-mcar__dot.is-active, .adm-section--black .adm-mcar__dot.is-active, .adm-section--magenta .adm-mcar__dot.is-active {
    background: #fff; }
}

/* Motion treatments — applied as a wrapper around any card design */
.adm-cards-grid--tilt { perspective: 1200px; }
.adm-tilt { height: 100%; transform-style: preserve-3d; transition: transform .18s ease; will-change: transform; }
.adm-tilt > * { height: 100%; }
.adm-spotlight { position: relative; height: 100%; border-radius: var(--radius-lg); overflow: hidden; transition: transform .25s var(--ease-out), box-shadow .25s ease; }
.adm-spotlight > * { height: 100%; }
/* The wrapper clips its glow (overflow:hidden), so a lift on the INNER card would be clipped at the top.
   Lift the wrapper instead and neutralise the inner card's own lift — they move together, nothing clips. */
.adm-cards-grid .adm-spotlight:hover { transform: translateY(-4px); }
.adm-cards-grid .adm-spotlight:hover > * { transform: none; }
.adm-spotlight::after {
  content: ''; position: absolute; inset: 0; z-index: 2; pointer-events: none;
  border-radius: inherit; opacity: 0; transition: opacity .35s ease;
  background: radial-gradient(260px circle at var(--mx, 50%) var(--my, 50%), rgba(229,0,109,.20), transparent 60%);
}
.adm-spotlight:hover::after { opacity: 1; }
@media (prefers-reduced-motion: reduce) { .adm-tilt { transition: none; } }

/* ── Consolidated blocks: Hero / Content / CTA ── */
.adm-block .split { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-10); }
@media (max-width: 820px) { .adm-block .split { grid-template-columns: 1fr; } }
/* Alternating rows: image-left rows stack image-first by default; on mobile flip them so the
   copy sits on top and the image underneath (matching the image-right rows). */
@media (max-width: 820px) {
  .adm-content__row--img-left .adm-content__row-copy { order: 1; }
  .adm-content__row--img-left .adm-content__media { order: 2; }
}

.adm-hero-compact__inner { max-width: 760px; }
.text-center .adm-hero-compact__inner, .adm-hero-compact.text-center .adm-hero-compact__inner { margin-inline: auto; }
.adm-hero-compact__ctas { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3); margin-top: var(--space-6); }
/* The CTA sits inside the .section-header, so it follows HEADER alignment (not content_align).
   Compound selector (.adm-hero-compact.adm-ha-*) raises specificity to 0,3,0 so it beats the
   Customizer's broad `.adm-hero-short div:has(.btn){justify-content:center}` (0,2,1) override. */
.adm-hero-compact.adm-ha-left .adm-hero-compact__ctas { justify-content: flex-start; }
.adm-hero-compact.adm-ha-center .adm-hero-compact__ctas { justify-content: center; }
.adm-hero-compact.adm-ha-right .adm-hero-compact__ctas { justify-content: flex-end; }

.adm-content__media img { width: 100%; height: auto; display: block; border-radius: var(--radius-lg); }
.adm-content__rows { display: flex; flex-direction: column; gap: var(--space-12); margin-top: var(--space-10); }
.adm-content__row { margin: 0; }
.adm-content__body h3 { font-size: var(--font-size-2xl); font-weight: var(--font-weight-medium); margin: 0 0 var(--space-3); }
/* Alternating rows use their own copy wrapper so the title escapes the 2xl cap above and honours the plugin H3 size. */
.adm-content__row-eyebrow { display: block; font-family: var(--font-mono); font-size: var(--font-size-2xs); text-transform: uppercase; letter-spacing: .12em; color: var(--color-brand); margin: 0 0 var(--space-3); }
.adm-content__row-title { font-weight: var(--font-weight-medium); margin: 0 0 var(--space-3); }
.adm-content__row-copy .prose { margin: 0; }
/* Founder bio / LinkedIn / website links line ("who runs it" section) */
.prose .adm-bio-links { margin-top: var(--space-5); font-weight: var(--font-weight-medium); display: flex; flex-wrap: wrap; gap: var(--space-3); align-items: center; }
.adm-content__row-copy .btn { margin-top: var(--space-5); }
/* Contained rows: image + copy each sit in a bordered surface card. */
.adm-content__rows--boxed .adm-content__row-copy { background: var(--color-surface-1); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: var(--space-8); }
.adm-content__rows--boxed .adm-content__media { border: 1px solid var(--color-border); border-radius: var(--radius-lg); overflow: hidden; }
.adm-content__rows--boxed .adm-content__media img { display: block; width: 100%; height: 100%; object-fit: cover; }
/* Width is controlled by the backend container_width setting (.container--narrow/wide/full on the wrapper) — do not hardcode here. */
.adm-content__rich { margin-inline: auto; }
.text-center .adm-content__split, .text-center .adm-content__rows { text-align: left; } /* keep body copy left even if header centred */

.adm-cta__inner { max-width: 760px; margin-inline: auto; text-align: center; }
.adm-cta__title { font-size: clamp(var(--font-size-3xl), 4vw, var(--font-size-5xl)); font-weight: var(--font-weight-medium); margin: var(--space-3) 0; }
.adm-cta__text { color: var(--color-text-secondary); font-size: var(--font-size-lg); margin: 0 auto var(--space-6); max-width: 56ch; }
.adm-cta__actions { display: flex; gap: var(--space-3); justify-content: center; flex-wrap: wrap; }
.adm-cta__form { display: flex; gap: var(--space-2); max-width: 480px; margin: var(--space-2) auto 0; flex-wrap: wrap; }
.adm-cta__form input { flex: 1 1 220px; padding: 12px 18px; border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-surface-1); color: var(--color-text); font-size: var(--font-size-base); }
.adm-cta__contact { display: flex; gap: var(--space-8); justify-content: center; margin-top: var(--space-5); flex-wrap: wrap; }
.adm-cta__contact a { display: inline-flex; align-items: center; gap: 8px; color: var(--color-text); font-weight: var(--font-weight-medium); text-decoration: none; background-image: linear-gradient(currentColor, currentColor); background-position: 0 100%; background-repeat: no-repeat; background-size: 0% 1.5px; transition: background-size 0.35s var(--ease-out), color var(--duration-fast) ease; }
.adm-cta__contact a:hover { color: var(--color-brand); background-size: 100% 1.5px; }
.adm-cta__calendly { margin-top: var(--space-6); border-radius: var(--radius-lg); overflow: hidden; border: 1px solid var(--color-border); }
/* Magenta CTA: keep secondary text legible */
.adm-section--magenta .adm-cta__text { color: rgba(255,255,255,.85); }

/* Magenta primary button — force magenta text on the white button (var could be remapped per-scope) */
.adm-section--magenta .btn--primary { background: #ffffff !important; color: #e5006d !important; border-color: #ffffff !important; }
.adm-section--magenta .btn--primary svg, .adm-section--magenta .btn--primary path { color: #e5006d; stroke: currentColor; }

/* Stats — column control, split-sticky layout, full-width bars */
.adm-stats .adm-m-counters, .adm-stats .adm-m-rings { grid-template-columns: repeat(var(--cols, 4), 1fr); }
/* Stat labels (the sub-text under each figure) in Geist Mono per brand */
.adm-stats .adm-m-counters__l, .adm-stats .adm-m-ring__lbl, .adm-stats .adm-m-race__lbl { font-family: var(--font-mono); letter-spacing: .01em; }
.adm-stats--bars .adm-m-race { max-width: none; width: 100%; }
.adm-stats__splitgrid { display: grid; grid-template-columns: 0.85fr 1.15fr; gap: var(--space-12); align-items: start; }
.adm-stats__head { position: sticky; top: 100px; }
.adm-stats__head .section-header { margin: 0; }
.adm-stats--split .adm-m-counters, .adm-stats--split .adm-m-rings { grid-template-columns: repeat(2, 1fr); gap: var(--space-8); }
@media (max-width: 820px) { .adm-stats__splitgrid { grid-template-columns: 1fr; } .adm-stats__head { position: static; } }

/* Container effect on stat figures.
   The magic-* effect classes (beam / animated border / glow / shimmer) are pure effect
   LAYERS — they need a surface to render on. Stat figures are bare by default, so when an
   effect is chosen we promote each figure to a card (surface + stroke). No effect = clean,
   borderless figures (the default). Glass brings its own translucent surface. */
.adm-stats :is(.adm-stats__cell, .adm-m-ring, .adm-m-race__row):is(.magic-beam, .magic-border, .magic-glow, .magic-shimmer, .magic-glass) {
  background: var(--color-surface-1);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: var(--space-8) var(--space-6);
  transition: transform var(--duration-base) var(--ease-out), border-color var(--duration-base) var(--ease-out), box-shadow var(--duration-base) var(--ease-out);
}
/* Slight hover lift, matching the card convention site-wide. */
.adm-stats :is(.adm-stats__cell, .adm-m-ring, .adm-m-race__row):is(.magic-beam, .magic-border, .magic-glow, .magic-shimmer, .magic-glass):hover {
  transform: translateY(-3px);
  border-color: var(--color-border-brand);
}
/* Soft shadow on hover — excluded for glow so it doesn't fight the pulsing glow shadow. */
.adm-stats :is(.adm-stats__cell, .adm-m-ring, .adm-m-race__row):is(.magic-beam, .magic-border, .magic-shimmer, .magic-glass):hover {
  box-shadow: var(--shadow-lg);
}
.adm-stats .adm-m-race__row:is(.magic-beam, .magic-border, .magic-glow, .magic-shimmer, .magic-glass) { padding: var(--space-5) var(--space-6); }
/* Glass: keep a frosted translucent fill, but use the themed border + a soft shadow so the card
   stays visible on LIGHT sections too (the raw --glass-border is white and vanishes on light). */
.adm-stats :is(.adm-stats__cell, .adm-m-ring, .adm-m-race__row).magic-glass {
  background: var(--glass-bg-strong);
  border-color: var(--color-border);
  box-shadow: var(--shadow-sm);
}

/* Hero — Compact: feature variant — true 50/50 split-screen. The section's own vertical padding
   is removed so the image is full-height edge-to-edge; the spacing setting is applied to the COPY
   instead (so the overall height still responds to compact/standard/spacious), and the image fills
   the whole media column flush to the section's top & bottom. */
/* Split-screen: the grid STRETCHES to fill the section height (incl. brand-hero's 78vh),
   so the image is flush top-to-bottom. The copy column carries the vertical spacing. */
.adm-hero-compact--feature { padding-block: 0 !important; display: flex !important; align-items: stretch !important; }
.adm-hero-compact--feature > .container { max-width: none !important; width: 100%; padding-left: 0; padding-right: 0; display: flex; align-items: stretch; }
.adm-hero-compact__feature { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 0 !important; align-items: stretch !important; justify-items: stretch !important; text-align: left !important; flex: 1 1 auto; width: 100%; }
.adm-hero-compact__copy { display: flex; flex-direction: column; justify-content: center; padding: var(--space-24) clamp(24px, 5.5vw, 96px); }
.adm-hero-compact--feature.section--sm .adm-hero-compact__copy { padding-block: var(--space-16); }
.adm-hero-compact--feature.section--lg .adm-hero-compact__copy { padding-block: var(--space-32); }
.adm-hero-compact--feature.section--none .adm-hero-compact__copy { padding-block: var(--space-10); }
.adm-hero-compact--feature .adm-hero-compact__copy .section-header__sub { margin-inline: 0; }
/* The eyebrow pill must hug its text, not stretch to the flex-column width. */
.adm-hero-compact__copy .section-header__overline { align-self: flex-start; }
.adm-hero-compact.text-center .adm-hero-compact__copy .section-header__overline,
.text-center .adm-hero-compact__copy .section-header__overline { align-self: center; }
.adm-hero-compact--feature .adm-hero-compact__media { position: relative; align-self: stretch; min-height: 340px; }
/* Image fills the entire media column, flush to the section's top & bottom (full-height split). */
.adm-hero-compact__img { position: absolute; inset: 0; overflow: hidden; }
.adm-hero-compact__img img { width: 100%; height: 100%; object-fit: cover; display: block; }
/* Stat badge — colour is set inline from the section's selected bg colour (see template). */
.adm-hero-compact__stat { position: absolute; z-index: 2; left: var(--space-8); bottom: var(--space-8); padding: var(--space-4) var(--space-6); border-radius: var(--radius-lg); box-shadow: 0 24px 50px -18px rgba(0,0,0,.45); }
.adm-hero-compact__stat b { display: block; font-size: clamp(var(--font-size-3xl), 3vw, var(--font-size-5xl)); font-weight: var(--font-weight-medium); line-height: 1; }
.adm-hero-compact__stat span { font-size: var(--font-size-sm); opacity: .92; }
.adm-hero-compact__media:not(:has(.adm-hero-compact__img)) .adm-hero-compact__stat { position: static; display: inline-block; }
@media (max-width: 860px) {
  .adm-hero-compact__feature { grid-template-columns: 1fr !important; min-height: 0; }
  .adm-hero-compact__copy { padding: var(--space-12) var(--space-6); order: 2; }
  .adm-hero-compact--feature .adm-hero-compact__media { order: 1; min-height: 56vw; }
}

/* Breadcrumbs (inner-page hero) */
.adm-breadcrumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: var(--space-5); font-family: var(--font-mono); font-size: var(--font-size-xs); letter-spacing: .02em; }
.adm-breadcrumbs a { color: var(--color-text-muted); text-decoration: none; transition: color var(--duration-fast) ease; }
.adm-breadcrumbs a:hover { color: var(--color-brand); }
.adm-breadcrumbs span[aria-current] { color: var(--color-text); }
.adm-breadcrumbs__sep { color: var(--color-text-muted); opacity: .55; font-style: normal; }
.text-center .adm-breadcrumbs { justify-content: center; }
/* Breadcrumbs follow the header alignment option (they sit inside the header). */
.adm-ha-left .adm-breadcrumbs { justify-content: flex-start; }
.adm-ha-center .adm-breadcrumbs { justify-content: center; }
.adm-ha-right .adm-breadcrumbs { justify-content: flex-end; }
/* Blog post / archive hero head alignment (ADM Control Template Layouts) drives the crumbs too. */
.adm-post__head--a-left .adm-breadcrumbs { justify-content: flex-start; }
.adm-post__head--a-center .adm-breadcrumbs { justify-content: center; }
.adm-post__head--a-right .adm-breadcrumbs { justify-content: flex-end; }

/* Category filter bar (archive + blog cards block) — links to category archives. */
.adm-card-filters { display: flex; flex-wrap: wrap; gap: var(--space-2); justify-content: center; margin: 0 0 var(--space-8); }
.adm-card-filter { display: inline-flex; align-items: center; padding: 8px 16px; border-radius: var(--radius-full, 999px); border: 1px solid var(--color-border); background: var(--color-bg); color: var(--color-text); font-size: var(--font-size-sm); font-weight: 500; text-decoration: none; transition: background var(--duration-fast) ease, color var(--duration-fast) ease, border-color var(--duration-fast) ease; }
.adm-card-filter:hover { border-color: var(--color-brand); color: var(--color-brand); }
.adm-card-filter.is-active { background: var(--color-brand); border-color: var(--color-brand); color: #fff; }

/* Swept gradient accent words in hero headings — wrap words in <u> in the heading field.
   Canonical effect = .home-gradient-text: text-coloured words with a magenta shimmer sweeping across.
   Uses var(--color-text) so it adapts in light/dark sections. */
.home-gradient-text,
.adm-hero-short h1 u, .adm-hero-compact h1 u, .adm-hero-big h1 u, .hero-banner h1 u,
.adm-hero-short.adm-section--magicgrid h1 u, .adm-hero-short.adm-section--brandhero h1 u,
.adm-hero-home__title--sweep u,
.section-header__title u, .adm-cta__title u,
.adm-post__title,
.tech-stack__copy h2 u, .adm-logos__copy-title u {
  text-decoration: none;
  background: linear-gradient(90deg, var(--color-text) 0%, var(--color-text) 40%, #e5006d 50%, var(--color-text) 60%, var(--color-text) 100%);
  color: transparent;
  background-size: 200% 100%;
  -webkit-background-clip: text; background-clip: text;
  animation: homeShimmer 6s linear infinite;
}
@keyframes homeShimmer { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } }
.adm-reduce-motion .home-gradient-text, .reduce-motion .home-gradient-text { animation: none; }
@media (prefers-reduced-motion: reduce) { .home-gradient-text, .adm-hero-short h1 u, .adm-hero-compact h1 u, .adm-hero-big h1 u, .adm-hero-home__title--sweep u, .section-header__title u, .adm-cta__title u, .adm-post__title, .tech-stack__copy h2 u, .adm-logos__copy-title u { animation: none; } }

/* Scroll-driven horizontal layout — full-bleed, header stays visible while the track travels */
.adm-cards-scroll { position: relative; width: 100vw; margin-left: calc(50% - 50vw); }
/* Pin is CONTENT height (not a forced 100svh) so there's no empty space below the cards and the
   section isn't taller than it needs to be. JS sizes the section to pin + scroll distance. */
/* Pin fills the viewport and centres its content vertically so the eyebrow/header
   never slips under the fixed site header (was top-heavy). */
/* Pin fills the viewport and centres its content vertically, so the content stays pinned to the
   MIDDLE of the screen regardless of how tall the header/cards are (an 80vh box let taller
   sections exceed it and stick to the top). Uses vh (robust) — svh was computing inconsistently. */
.adm-cards-scroll__pin { position: sticky; top: 0; min-height: 100vh; display: flex; flex-direction: column; justify-content: center; gap: var(--space-8); overflow: hidden; padding-block: var(--space-8); }
/* The site's global `* { transition-duration: .3s !important }` (Customizer CSS) makes the pin's
   min-height ANIMATE when the JS flips [data-ready] (0 -> 100vh). It never settles at 100vh and the
   pin collapses to content height — invisible with tall cards, but with short cards (process
   horizontal: 4 text steps) the pin ends up shorter than the viewport, so the content sits at the top
   instead of centred in a full-height pin. Killing transitions on the pin lets 100vh apply instantly.
   Higher specificity (0,1,0) + !important beats the universal `*` !important rule. */
.adm-cards-scroll__pin { transition: none !important; }
/* GSAP lab page ONLY: GSAP (scroll-gsap.js) owns pinning there, so drop the CSS sticky and let it
   set position:fixed for the pinned range. The homepage/normal pages keep the sticky vanilla pin. */
body.gsap-lab .adm-cards-scroll__pin { position: relative; top: auto; }
.adm-cards-scroll__head { position: relative; z-index: 2; width: 100%; max-width: var(--container-max, 1200px); margin: 0 auto; padding-inline: clamp(var(--space-4), 5vw, 80px); }
/* The pinned scroll breaks out to 100vw, so re-cap the heading to the section's chosen container
   width — full-bleed sections get a full-width heading, not a centred 1200px one. */
.container--full .adm-cards-scroll__head { max-width: none; }
.container--wide .adm-cards-scroll__head { max-width: var(--container-wide); }
/* CTA renders inside the pin, directly beneath the track. The pin's flex `gap` already spaces it,
   so drop the default top margin to avoid a doubled, oversized gap under the cards. */
.adm-cards-scroll__pin .adm-block-cta { margin-top: 0; }
/* Scroll layout: CTA sits under the intro in the header (not at the bottom) */
.adm-cards-scroll__head .adm-block-cta { margin-top: var(--space-5); }
.container--narrow .adm-cards-scroll__head { max-width: var(--container-narrow); }
.adm-cards-scroll__head .section-header { margin: 0; }
.adm-cards-scroll__track { display: flex; gap: var(--space-5); padding-inline: clamp(var(--space-4), 5vw, 80px); will-change: transform; }
.adm-cards-scroll__track > * { flex: 0 0 clamp(280px, 24vw, 360px); }
.adm-cards-scroll .adm-card__media { aspect-ratio: 4 / 3; }
/* Fallback before JS-ready / reduced motion: native swipe row, header above */
.adm-cards-scroll:not([data-ready]) .adm-cards-scroll__pin { position: static; min-height: 0; }
.adm-cards-scroll:not([data-ready]) .adm-cards-scroll__track { overflow-x: auto; scroll-snap-type: x mandatory; }
.adm-cards-scroll:not([data-ready]) .adm-cards-scroll__track > * { scroll-snap-align: start; }
@media (prefers-reduced-motion: reduce) {
  .adm-cards-scroll__pin { position: static; min-height: 0; }
  .adm-cards-scroll__track { transform: none !important; overflow-x: auto; }
}

/* ── Cards: ARC reveal layout (card_style=arc). Native CSS position:sticky pin + GSAP-driven arc
   (assets/js/cards-arc.js). Cards start in a line, sweep up on an arc entering from the right, then
   level into a straight line ending at the container's right edge. Full-bleed like the scroll layout;
   the section bg (block bg_colour) shows through. ── */
.adm-cards-arc { position: relative; width: 100vw; margin-left: calc(50% - 50vw); }
/* Pin is a flex column whose content (header + card band) is CENTRED in the viewport, with the cards
   sitting just below the header. The stage gets an explicit height (= tallest card, set by JS) so it
   doesn't absorb the leftover space and open a gap when the header is short. Top padding keeps the
   centred group clear of the fixed site header. */
/* Pinned band is sized + centred by JS (measure()): it fits the actual header+cards height, capped at
   the viewport, then centres via a dynamic `top`. Short content → tight centred band (no dead gap);
   tall content → fills the viewport (no overflow into the next section). The top/height below are
   only the pre-JS / no-arc fallback. overflow visible so arc-dipping cards aren't clipped (the page
   already clips horizontal overflow at .site-main / .adm-section). */
.adm-cards-arc__pin { position: sticky; top: 0; height: 100vh; box-sizing: border-box; overflow: visible; display: flex; flex-direction: column; justify-content: center; gap: clamp(1.5rem, 4vh, 3rem); }
.adm-cards-arc__head { position: relative; z-index: 3; flex: 0 0 auto; width: 100%; max-width: var(--container-max, 1200px); margin: 0 auto; padding: 0 clamp(var(--space-4), 5vw, 80px); }
.container--full .adm-cards-arc__head { max-width: none; }
.container--wide .adm-cards-arc__head { max-width: var(--container-wide); }
.container--narrow .adm-cards-arc__head { max-width: var(--container-narrow); }
.adm-cards-arc__head .section-header { margin: 0; }
.adm-cards-arc__stage { position: relative; z-index: 2; flex: 0 0 auto; }
.adm-cards-arc__card { position: absolute; top: 50%; left: 0; width: clamp(300px, 23vw, 350px); opacity: 0; will-change: transform; }
/* GSAP sets these transforms every frame via the ticker — a CSS transition (forced site-wide by the
   Customizer's `* { transition-duration:.3s !important }`) makes each frame lag ~0.3s, so fast trackpad
   scroll slides/snaps the cards leftward as they chase the target. Must be transition-free. */
.adm-cards-arc__card { transition: none !important; }
.adm-cards-arc__card > * { width: 100%; height: auto; }
/* Hide the native scrollbar on the horizontal swipe row (fallback / mobile) — swipe is the interaction. */
.adm-cards-arc__stage { scrollbar-width: none; -ms-overflow-style: none; }
.adm-cards-arc__stage::-webkit-scrollbar { width: 0; height: 0; display: none; }
/* Desktop fallback before JS-ready / no GSAP: a native-swipe row (no pin). Scoped to >900px so it
   never fights the mobile rules below (which would otherwise lose on specificity). */
@media (min-width: 901px) {
  .adm-cards-arc:not([data-ready]) .adm-cards-arc__pin { position: static; height: auto; overflow: visible; }
  .adm-cards-arc:not([data-ready]) .adm-cards-arc__head { position: static; max-width: none; margin-bottom: var(--space-6); }
  .adm-cards-arc:not([data-ready]) .adm-cards-arc__stage { position: static; display: flex; gap: var(--space-5); overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-inline: clamp(var(--space-4), 5vw, 80px); padding: 0 clamp(var(--space-4), 5vw, 80px); }
  .adm-cards-arc:not([data-ready]) .adm-cards-arc__card { position: static; opacity: 1; transform: none !important; flex: 0 0 clamp(280px, 24vw, 340px); scroll-snap-align: start; }
}
/* Mobile: always a native swipe row (the JS deactivates the arc ≤900px). Cards ~82% so the next
   card peeks; gutter padding keeps them off the viewport edge; scrollbar hidden (see base rule). */
@media (max-width: 900px) {
  .adm-cards-arc__pin { position: static; height: auto; overflow: visible; }
  .adm-cards-arc__head { position: static; max-width: none; margin-bottom: var(--space-6); }
  .adm-cards-arc__stage { position: static; display: flex; gap: var(--space-4); overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-inline: var(--space-5); padding: 0 var(--space-5) var(--space-2); }
  .adm-cards-arc__card { position: static; opacity: 1; transform: none !important; flex: 0 0 82%; scroll-snap-align: start; }
  .adm-cards-arc__card:last-child { margin-right: var(--space-5); }
}
@media (prefers-reduced-motion: reduce) {
  .adm-cards-arc__pin { position: static !important; height: auto !important; overflow: visible; }
  .adm-cards-arc__head { position: static !important; max-width: none; }
  .adm-cards-arc__card { position: static !important; opacity: 1 !important; transform: none !important; }
}

/* ═══════════════════════════════════════════════════════════════════
   Consolidated blocks wave 3 — Logos · Testimonials · Process · Accordion
   · Features/Bento · Media. Token-driven (adapt to bg/dark/magenta scopes).
   ═══════════════════════════════════════════════════════════════════ */

/* ── Logos / clients ── */
.adm-logos { align-items: center; }
.adm-logos--grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: var(--space-8) var(--space-10); }
.adm-logos__item { display: flex; align-items: center; justify-content: center; padding: var(--space-3); }
.adm-logos__img { max-height: 46px; width: auto; max-width: 100%; object-fit: contain; }
.adm-logos--gray .adm-logos__img { filter: grayscale(1); opacity: .6; transition: filter var(--duration-fast) ease, opacity var(--duration-fast) ease; }
.adm-logos--gray .adm-logos__item:hover .adm-logos__img { filter: none; opacity: 1; }
.adm-logos--marquee .magic-marquee__track { align-items: center; gap: var(--space-12); }
.adm-logos--marquee .adm-logos__item { flex-shrink: 0; }
/* Marquee full-bleed: break out of the container and run edge-to-edge */
.adm-logos--marquee.adm-logos--bleed { width: 100vw; margin-left: calc(50% - 50vw); }

/* Content split — optional stat row beneath the copy (above the CTA) */
.adm-content__stats { display: flex; flex-wrap: wrap; gap: var(--space-8) var(--space-10); margin-top: var(--space-8); }
.adm-content__stat { display: flex; flex-direction: column; gap: var(--space-1); }
.adm-content__stat-v { font-size: clamp(var(--font-size-3xl), 3.4vw, var(--font-size-5xl)); font-weight: var(--font-weight-medium); line-height: 1; color: var(--color-brand); }
.adm-content__stat-l { font-family: var(--font-mono); font-size: var(--font-size-sm); color: var(--color-text-secondary); letter-spacing: .01em; }
/* CTA row — primary + optional 2nd/3rd buttons side by side */
.adm-content__ctas { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3); margin-top: var(--space-5); }

/* ── Testimonials ── */
.adm-tcards { display: grid; grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); gap: var(--space-6); align-items: stretch; }
.adm-tcard { position: relative; display: flex; flex-direction: column; gap: var(--space-5); padding: var(--space-8); padding-top: var(--space-10); background: var(--color-surface-1); border: 1px solid var(--color-border); border-radius: var(--radius-xl); text-align: left; height: 100%; transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.adm-tcard:hover { transform: translateY(-4px); border-color: var(--color-border-brand); box-shadow: 0 26px 52px -32px rgba(229,0,109,.4); }
/* Large decorative quotation mark as a subtle brand watermark (replaces the cheap inline quote). */
.adm-tcard::before { content: '\201C'; position: absolute; top: 4px; left: var(--space-6); font-family: Georgia, 'Times New Roman', serif; font-size: 92px; line-height: 1; color: color-mix(in srgb, var(--color-brand) 18%, transparent); pointer-events: none; z-index: 0; }
.adm-tcard > * { position: relative; z-index: 1; }
.adm-tcard__avatar img { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; display: block; }
/* Cover image on a (non-video) testimonial card — a media strip above the quote. */
.adm-tcard__media { width: 100%; height: 200px; border-radius: var(--radius-md); overflow: hidden; }
.adm-tcard__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.adm-tcard__quote { margin: 0; font-size: var(--font-size-lg); line-height: 1.65; color: var(--color-text); font-weight: 500; }
.adm-tcard__quote::before { content: none; }
.adm-tcard__foot { display: flex; flex-direction: row; align-items: center; gap: var(--space-3); margin-top: auto; }
.adm-tcard__meta { display: flex; flex-direction: column; gap: 2px; }
.adm-tcard__foot .adm-tcard__avatar img { width: 48px; height: 48px; border-radius: 50%; object-fit: cover; display: block; }
.adm-tcard__name { font-weight: var(--font-weight-medium); font-size: var(--font-size-base); color: var(--color-text); }
.adm-tcard__role { font-size: var(--font-size-sm); color: var(--color-text-secondary); }
.adm-tcard--video::before, .adm-tcard--single::before { content: none; }
/* Single feature — large, centred. Fills the section's container (honours the Wide/Standard width);
   the quote keeps a readable measure so a wide card doesn't produce over-long lines. */
.adm-tcard--single { margin-inline: auto; align-items: center; text-align: center; gap: var(--space-6); padding: var(--space-12); }
.adm-tcard--single .adm-tcard__quote { font-size: clamp(var(--font-size-2xl), 2.6vw, var(--font-size-4xl)); line-height: 1.4; max-width: 40ch; margin-inline: auto; }
.adm-tcard--single .adm-tcard__foot { align-items: center; }

/* Spotlight SLIDER — the active card expands and shows its image + quote together as one unit;
   the rest are knocked back. JS auto-advances + click to select (no hover-to-change). */
/* Spotlight = a one-at-a-time auto-play carousel. Every slide is the SAME fixed-size big card
   (image + quote side by side), so advancing slides never grows/shrinks anything. */
.adm-tspot .adm-carousel__track { align-items: stretch; }
.adm-tspot__card { display: flex; flex-direction: row; align-items: stretch; gap: var(--space-8); min-height: 240px; padding: var(--space-6); text-align: left; background: var(--color-surface-1); border: 1px solid var(--color-border); border-radius: var(--radius-xl); box-shadow: 0 20px 50px -30px rgba(0,0,0,.18); overflow: hidden; }
.adm-tspot__media { border-radius: var(--radius-lg); }
.adm-tspot__media { flex: 0 0 50%; align-self: center; height: 460px; max-height: 460px; border-radius: var(--radius-md); overflow: hidden; }
.adm-tspot__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.adm-tspot__body { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; gap: var(--space-4); justify-content: center; }
.adm-tspot__avatar { width: 68px; height: 68px; border-radius: 50%; overflow: hidden; flex-shrink: 0; }
.adm-tspot__avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }
.adm-tspot__quote { margin: 0; font-size: var(--font-size-xl); line-height: 1.55; font-weight: 500; color: var(--color-text); }
.adm-tspot__quote::before { content: '\201C'; font-family: Georgia, 'Times New Roman', serif; font-size: 2.4em; line-height: 0; color: var(--color-brand); margin-right: .06em; vertical-align: -0.4em; }
.adm-tspot__foot { display: flex; flex-direction: column; gap: 2px; }
.adm-tspot__name { color: var(--color-brand); font-weight: var(--font-weight-medium); }
.adm-tspot__role { font-family: var(--font-mono); font-size: var(--font-size-sm); color: var(--color-text-secondary); }
.adm-tspot__logo-link { display: inline-flex; margin-top: var(--space-5); opacity: .85; }
.adm-tspot__logo { max-height: 56px; width: auto; object-fit: contain; }
/* "Visit website" button — left-aligned under the logo (was: clickable logo only) */
.adm-tspot__visit { align-self: flex-start; margin-top: var(--space-4); }
@media (max-width: 820px) {
  .adm-tspot__card { flex-direction: column; min-height: 0; gap: var(--space-5); }
  .adm-tspot__media { flex: none; aspect-ratio: 16 / 10; height: auto; max-height: none; }
  .adm-tspot__quote { font-size: var(--font-size-xl); }
}
/* Video / featured card */
.adm-tcard--video { position: relative; min-height: 460px; justify-content: flex-end; background-color: #0a0a0a; background-size: cover; background-position: center; color: #fff; border: none; overflow: hidden; }
/* A featured/video card always carries white text + a dark gradient scrim, so it needs a dark
   base even when no cover image is set or a glass effect would otherwise frost it white. */
.adm-tcard--video.magic-glass, .adm-tcard--video.magic-border, .adm-tcard--video.magic-spotlight { background-color: #0a0a0a; }
.adm-tcard--video::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,.05), rgba(0,0,0,.78)); z-index: 0; }
.adm-tcard--video > * { position: relative; z-index: 1; }
.adm-tcard__avatar--corner { position: absolute; top: var(--space-5); left: var(--space-5); }
.adm-tcard__avatar--corner img { border: 2px solid rgba(255,255,255,.85); }
.adm-tcard--video .adm-tcard__name { color: #fff; }
.adm-tcard--video .adm-tcard__role { color: rgba(255,255,255,.82); }
.adm-tcard__play { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 66px; height: 66px; border-radius: 50%; background: rgba(255,255,255,.92); color: var(--color-brand); display: flex; align-items: center; justify-content: center; font-size: 22px; z-index: 2; transition: transform .2s ease; }
.adm-tcard__play:hover { transform: translate(-50%, -50%) scale(1.08); }
/* Pinned horizontal scroll track */
.adm-tmonials__track { display: flex; gap: var(--space-6); padding: 0; align-items: stretch; }
.adm-tmonials__track .adm-tcard { flex: 0 0 clamp(420px, 38vw, 560px); min-height: 440px; height: auto; padding: var(--space-10); }
.adm-tmonials__track .adm-tcard--video { flex: 0 0 clamp(440px, 40vw, 580px); }
/* Quote fills the space; name/role pinned to the bottom; all cards equal height */
.adm-tmonials__track .adm-tcard__quote { flex: 1 1 auto; font-size: var(--font-size-2xl); line-height: 1.4; }
/* Pin the pinned-testimonials content to the middle of the viewport (less top-heavy). */
.adm-tmonials__scroll .adm-cards-scroll__pin { min-height: 100vh; }

/* ── Process / steps ── */
.adm-process__list { list-style: none; margin: 0; padding: 0; }
.adm-process--numbered .adm-process__list { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: var(--space-6); }
.adm-process--numbered .adm-process__step { background: var(--color-surface-1); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: var(--space-6); }
.adm-process__marker { margin-bottom: var(--space-4); }
.adm-process__num { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 12px; background: var(--color-brand-dim); color: var(--color-brand); font-family: var(--font-mono); font-weight: var(--font-weight-medium); font-size: var(--font-size-lg); }
.adm-process__icon { width: 40px; height: 40px; object-fit: contain; }
.adm-process__icon--hgi { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 12px; background: var(--color-brand-dim); }
.adm-process__icon--hgi i { font-size: 24px; color: var(--color-brand); line-height: 1; }
.adm-process__cta { display: inline-flex; align-items: center; gap: 6px; margin-top: var(--space-4); color: var(--color-brand); font-weight: var(--font-weight-medium); text-decoration: none; transition: gap var(--duration-fast) ease; }
.adm-process__cta:hover { gap: 10px; }
.adm-process__eyebrow { display: block; font-family: var(--font-mono); font-size: var(--font-size-2xs); text-transform: uppercase; letter-spacing: .12em; color: var(--color-brand); margin: 0 0 var(--space-2); }
.adm-process__cta svg { width: 15px; height: 15px; }
.adm-process__title { font-size: var(--font-size-lg); font-weight: var(--font-weight-medium); margin: 0 0 var(--space-2); }
.adm-process__text { color: var(--color-text-secondary); margin: 0; }
/* Timeline */
.adm-process--timeline .adm-process__list { max-width: 760px; margin-inline: auto; }
.adm-process--timeline .adm-process__step { position: relative; display: grid; grid-template-columns: 56px 1fr; gap: var(--space-5); padding-bottom: var(--space-8); }
.adm-process--timeline .adm-process__step::before { content: ''; position: absolute; left: 27px; top: 48px; bottom: 0; width: 2px; background: var(--color-border); }
.adm-process--timeline .adm-process__step:last-child::before { display: none; }
/* Horizontal scroll */
.adm-process--horizontal .adm-process__list { display: flex; gap: var(--space-6); overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: var(--space-4); }
.adm-process--horizontal .adm-process__step { flex: 0 0 300px; scroll-snap-align: start; background: var(--color-surface-1); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: var(--space-6); }

/* ── Accordion / FAQ ── */
.adm-accordion__list { max-width: 820px; margin-inline: auto; display: flex; flex-direction: column; gap: var(--space-3); }
.adm-accordion__item { border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-surface-1); overflow: hidden; }
.adm-accordion__q { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); padding: var(--space-5) var(--space-6); cursor: pointer; font-weight: var(--font-weight-medium); font-size: var(--font-size-lg); list-style: none; }
.adm-accordion__q::-webkit-details-marker { display: none; }
.adm-accordion__chev { flex-shrink: 0; display: inline-flex; font-size: 20px; color: var(--color-text-secondary); transition: transform var(--duration-fast) ease, color var(--duration-fast) ease; }
.adm-accordion__item[open] .adm-accordion__chev { transform: rotate(180deg); color: var(--color-brand); }
.adm-accordion__a { padding: 0 var(--space-6) var(--space-6); color: var(--color-text-secondary); line-height: var(--line-height-relaxed); }
/* Accordion content is always left-aligned, even when the section header is centred. */
.adm-accordion__list, .adm-accordion__q, .adm-accordion__a { text-align: left; }
.adm-accordion--tabs .adm-accordion__list { max-width: none; }
/* FAQ = soft filled cards in a single column (distinct from the bordered plain accordion); opens to a white card */
.adm-accordion--faq .adm-accordion__item { background: var(--color-surface-2); border-color: transparent; }
.adm-accordion--faq .adm-accordion__item[open] { background: var(--color-surface-1); border-color: var(--color-border); }

/* ── Features / bento ── */
.adm-features__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: var(--space-6); }
.adm-feature { display: flex; flex-direction: column; gap: var(--space-3); padding: var(--space-6); background: var(--color-surface-1); border: 1px solid var(--color-border); border-radius: var(--radius-lg); text-decoration: none; color: inherit; transition: transform var(--duration-fast) ease, border-color var(--duration-fast) ease; }
a.adm-feature:hover { transform: translateY(-3px); border-color: var(--color-border-brand); }
.adm-feature__icon { display: inline-flex; flex-shrink: 0; }
.adm-feature__icon img { width: 40px; height: 40px; object-fit: contain; }
.adm-feature__body { display: flex; flex-direction: column; gap: var(--space-2); }
.adm-feature__title { display: block; font-size: var(--font-size-lg); font-weight: var(--font-weight-medium); }
.adm-feature__text { display: block; color: var(--color-text-secondary); }
/* Alternating = roomy rows: [icon] [body] */
.adm-features__rows { display: flex; flex-direction: column; gap: var(--space-4); max-width: 880px; margin-inline: auto; }
.adm-feature--row { flex-direction: row; align-items: flex-start; gap: var(--space-5); text-align: left; }
.adm-feature--row .adm-feature__body { flex: 1; }

/* ── Media ── */
.adm-media__frame { border-radius: var(--radius-lg); overflow: hidden; border: 1px solid var(--color-border); }
.adm-media__video { position: relative; aspect-ratio: 16 / 9; }
.adm-media__video iframe, .adm-media__video video { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.adm-media__image img { display: block; width: 100%; height: auto; }
.adm-media__map { position: relative; aspect-ratio: 2 / 1; border-radius: var(--radius-lg); overflow: hidden; border: 1px solid var(--color-border); background: var(--color-surface-1); }
/* Dotted backdrop (equirectangular grid of dots) */
.adm-media__map-dots { position: absolute; inset: 0; background-image: radial-gradient(currentColor 1.1px, transparent 1.3px); background-size: 22px 22px; color: rgba(var(--color-brand-rgb), .18); -webkit-mask-image: linear-gradient(to bottom, transparent, #000 12%, #000 88%, transparent); mask-image: linear-gradient(to bottom, transparent, #000 12%, #000 88%, transparent); }
.adm-media__pin { position: absolute; transform: translate(-50%, -50%); z-index: 2; }
.adm-media__pin i { display: block; width: 12px; height: 12px; border-radius: 50%; background: var(--color-brand); box-shadow: 0 0 0 4px rgba(var(--color-brand-rgb), .25), 0 0 14px 2px var(--color-brand); animation: adm-pin-pulse 2.4s ease-out infinite; }
.adm-media__pin b { position: absolute; left: 16px; top: 50%; transform: translateY(-50%); white-space: nowrap; font-family: var(--font-mono); font-size: var(--font-size-2xs); font-weight: var(--font-weight-medium); color: var(--color-text); background: var(--color-surface-1); border: 1px solid var(--color-border); border-radius: 999px; padding: 3px 9px; opacity: 0; transition: opacity var(--duration-fast) ease; pointer-events: none; }
.adm-media__pin:hover b { opacity: 1; }
@keyframes adm-pin-pulse { 0% { box-shadow: 0 0 0 0 rgba(var(--color-brand-rgb), .45), 0 0 14px 2px var(--color-brand); } 70% { box-shadow: 0 0 0 12px rgba(var(--color-brand-rgb), 0), 0 0 14px 2px var(--color-brand); } 100% { box-shadow: 0 0 0 0 rgba(var(--color-brand-rgb), 0), 0 0 14px 2px var(--color-brand); } }
/* Globe = circular crop of the same projection */
.adm-media__map--globe { aspect-ratio: 1 / 1; max-width: 540px; margin-inline: auto; border-radius: 50%; background: radial-gradient(circle at 38% 32%, var(--color-surface-2), var(--color-surface-1) 70%); }
.adm-media__map--globe .adm-media__map-dots { border-radius: 50%; -webkit-mask-image: radial-gradient(circle, #000 64%, transparent 70%); mask-image: radial-gradient(circle, #000 64%, transparent 70%); }

/* ── Process: horizontal scroller (snap, hidden scrollbar, full row) ── */
.adm-process__hscroll { overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; -ms-overflow-style: none; }
.adm-process__hscroll::-webkit-scrollbar { display: none; }
/* Uses the SAME driver + pin as the cards "horizontal scroll" layout (.adm-cards-scroll). Inherit the
   shared __track padding-inline + gap so the row starts inset and spaces identically. The cards are
   intentionally WIDER than the case-study cards-scroll: this block only has ~4 steps, so narrow cards
   would leave the track no wider than the viewport and the pin would have nothing to scrub. Wider
   cards give the same pin+scrub effect meaningful horizontal travel. */
.adm-process__htrack { list-style: none; margin: 0; padding-block: 0 var(--space-2); }
.adm-process__htrack .adm-process__hcard { flex: 0 0 clamp(340px, 40vw, 560px); scroll-snap-align: start; display: flex; flex-direction: column; background: var(--color-surface-1); border: 1px solid var(--color-border); border-radius: var(--radius-lg); overflow: hidden; }
.adm-process__hcard-media { aspect-ratio: 16 / 10; overflow: hidden; background: var(--color-surface-2); }
.adm-process__hcard-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.adm-process__hcard-body { padding: var(--space-8); display: flex; flex-direction: column; }
.adm-process__htrack .adm-process__marker { margin-bottom: var(--space-4); }

/* Glow container effect: subtle on a full-width section (was a huge pulsing halo) */
.container.magic-glow { box-shadow: 0 0 0 1px var(--color-border-brand), 0 18px 50px -20px rgba(var(--color-brand-rgb), 0.30); animation: none; border-radius: var(--radius-lg); padding-block: var(--space-10); }

/* Dotted world map section: pull up so it overlaps the section above and the map's
   top fade blends in; keep the section header above the overlap. */
/* Dotted map: the header pulls the map up under it (its own -100px bottom margin) so the header
   overlaps the map's faded top. Header stays on top; tooltips stay above everything. */
.adm-section.adm-media--world_map { position: relative; }
.adm-section.adm-media--world_map .section-header { position: relative; z-index: 3; margin-bottom: -100px; }
/* The reveal class leaves transform:translateY(0), which creates a stacking context that
   traps the tooltip below the header. Clearing the transform on the map wrapper lets the
   tooltip's z-index compete with (and beat) the header, while the map bg stays below it. */
.adm-section.adm-media--world_map .adm-media__worldmap { transform: none; }
.adm-section.adm-media--world_map .world-map__tooltip { z-index: 50; }

/* ── Media: real MagicUI world map + globe wrappers ── */
.adm-media__worldmap { position: relative; width: 100%; aspect-ratio: 2 / 1; }
.adm-media__worldmap .world-map__bg { position: absolute; inset: 0; }
.adm-media__worldmap .world-map__bg svg { width: 100%; height: 100%; }
.adm-media__worldmap .world-map__overlay { position: absolute; inset: 0; width: 100%; height: 100%; }
.adm-media__worldmap .world-map__clients { position: absolute; inset: 0; }
.adm-media__globe { position: relative; width: 100%; max-width: 560px; aspect-ratio: 1 / 1; margin-inline: auto; }
.adm-media__globe .global-clients__canvas { width: 100%; height: 100%; display: block; }

/* ── FAQ: two-column grid (distinct from the stacked accordion) ── */
.adm-accordion__list--grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--space-3) var(--space-5); max-width: 1040px; align-items: start; }
@media (max-width: 760px) { .adm-accordion__list--grid { grid-template-columns: 1fr; } }

/* ── Tabs: real tabbed panel (horizontal + vertical) ── */
.admb-tabs { display: flex; flex-direction: column; gap: var(--space-6); text-align: left; }
.admb-tabs__list { display: flex; flex-wrap: wrap; gap: var(--space-1); border-bottom: 1px solid var(--color-border); }
.admb-tabs__tab { appearance: none; background: none; border: 0; border-bottom: 2px solid transparent; margin-bottom: -1px; padding: var(--space-3) var(--space-5); font: inherit; font-weight: var(--font-weight-medium); font-size: var(--font-size-base); color: var(--color-text-secondary); cursor: pointer; transition: color .15s ease, border-color .15s ease; white-space: nowrap; }
.admb-tabs__tab:hover { color: var(--color-text); }
.admb-tabs__tab.is-active { color: var(--color-brand); border-bottom-color: var(--color-brand); }
.admb-tabs__panels { background: var(--color-surface-1); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: var(--space-8); }
.admb-tabs__panel[hidden] { display: none; }
.admb-tabs__panel-inner--split { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-10); align-items: center; }
.admb-tabs__panel-inner--solo { max-width: 760px; }
.admb-tabs__media img { width: 100%; height: auto; border-radius: var(--radius-md); display: block; }
.admb-tabs__copy > :first-child { margin-top: 0; }
.admb-tabs__copy h2, .admb-tabs__copy h3 { font-weight: var(--font-weight-medium); margin: 0 0 var(--space-3); font-size: var(--font-size-2xl); }
.admb-tabs__copy p { color: var(--color-text-secondary); margin: 0 0 var(--space-3); }
/* Vertical: tab rail left, panel right */
.admb-tabs--vertical .admb-tabs { flex-direction: row; align-items: stretch; gap: var(--space-8); }
.admb-tabs--vertical .admb-tabs__list { flex-direction: column; flex-wrap: nowrap; border-bottom: 0; border-right: 1px solid var(--color-border); flex: 0 0 230px; gap: 2px; }
.admb-tabs--vertical .admb-tabs__tab { text-align: left; border-bottom: 0; border-right: 2px solid transparent; margin: 0 -1px 0 0; border-radius: var(--radius-sm) 0 0 var(--radius-sm); }
.admb-tabs--vertical .admb-tabs__tab.is-active { border-right-color: var(--color-brand); background: var(--color-surface-1); }
.admb-tabs--vertical .admb-tabs__panels { flex: 1; }

/* Timed (Framer-style): content panel on top, auto-advancing tab cards (title + description) with a progress bar on top of each */
.admb-tabs__bar { display: none; }
.admb-tabs--timed .admb-tabs { flex-direction: column; gap: var(--space-8); }
.admb-tabs--timed .admb-tabs__panels { order: 0; }
.admb-tabs--timed .admb-tabs__list { order: 1; border: 0; flex-wrap: nowrap; gap: var(--space-8); }
.admb-tabs--timed .admb-tabs__tab { flex: 1 1 0; min-width: 0; display: block; text-align: left; white-space: normal; border: 0; margin: 0; padding: var(--space-5) 0 0; position: relative; }
/* grey progress track across the full tab width */
.admb-tabs--timed .admb-tabs__tab::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: var(--color-border); border-radius: 3px; }
/* magenta fill, animated 0→100% by JS over the duration */
.admb-tabs--timed .admb-tabs__bar { display: block; position: absolute; top: 0; left: 0; height: 3px; width: 100%; transform: scaleX(0); transform-origin: left center; background: var(--color-brand); border-radius: 3px; z-index: 1; }
@keyframes admb-fill { from { transform: scaleX(0); } to { transform: scaleX(1); } }
.admb-tabs--timed .admb-tabs__tab-label { display: block; font-size: var(--font-size-lg); font-weight: var(--font-weight-medium); color: var(--color-text-secondary); margin-bottom: var(--space-2); transition: color .2s ease; }
.admb-tabs--timed .admb-tabs__tab.is-active .admb-tabs__tab-label { color: var(--color-text); }
.admb-tabs--timed .admb-tabs__tab-desc { display: block; font-size: var(--font-size-sm); line-height: 1.5; color: var(--color-text-secondary); opacity: .8; }
@media (max-width: 760px) {
  .admb-tabs--timed .admb-tabs__list { flex-wrap: wrap; gap: var(--space-5); }
  .admb-tabs--timed .admb-tabs__tab { flex: 1 1 100%; }
}
@media (max-width: 760px) {
  .admb-tabs__panel-inner--split { grid-template-columns: 1fr; }
  .admb-tabs--vertical .admb-tabs { flex-direction: column; }
  .admb-tabs--vertical .admb-tabs__list { flex-direction: row; flex-wrap: wrap; border-right: 0; border-bottom: 1px solid var(--color-border); flex-basis: auto; }
  .admb-tabs--vertical .admb-tabs__tab { border-right: 0; border-bottom: 2px solid transparent; border-radius: 0; }
}

/* ── Features: alternating image + text rows ── */
.adm-features__alt { display: flex; flex-direction: column; gap: var(--space-16); }
.adm-feature-row { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-12); align-items: center; }
/* Explicit column placement so the image side flips reliably (direction:rtl didn't reorder). */
.adm-feature-row__media { grid-column: 1; grid-row: 1; }
.adm-feature-row__copy  { grid-column: 2; grid-row: 1; }
.adm-feature-row--rev .adm-feature-row__media { grid-column: 2; }
.adm-feature-row--rev .adm-feature-row__copy  { grid-column: 1; }
.adm-feature-row__media img { width: 100%; height: auto; border-radius: var(--radius-lg); display: block; }
.adm-feature-row__media:empty { display: none; }
.adm-feature-row__copy .adm-feature__icon { margin-bottom: var(--space-4); }
.adm-feature-row__copy .adm-feature__icon img { width: 44px; height: 44px; object-fit: contain; }
.adm-feature-row__eyebrow { display: block; font-family: var(--font-mono); font-size: var(--font-size-2xs); text-transform: uppercase; letter-spacing: .12em; color: var(--color-brand); margin: 0 0 var(--space-3); }
.adm-feature-row__title { font-size: var(--font-size-3xl); font-weight: var(--font-weight-medium); margin: 0 0 var(--space-3); }
.adm-feature-row__text { color: var(--color-text-secondary); margin: 0 0 var(--space-4); font-size: var(--font-size-lg); }
.adm-feature-row__link { display: inline-flex; align-items: center; gap: 6px; color: var(--color-brand); font-weight: var(--font-weight-medium); text-decoration: none; }
.adm-feature-row__copy .btn { margin-top: var(--space-2); }
@media (max-width: 760px) {
  .adm-feature-row { grid-template-columns: 1fr; }
  .adm-feature-row__media, .adm-feature-row__copy,
  .adm-feature-row--rev .adm-feature-row__media, .adm-feature-row--rev .adm-feature-row__copy { grid-column: 1; grid-row: auto; }
}

/* ── Process timeline: sticky scrollytelling (reuses .adm-m-feat) ── */
.adm-process__feat-steps { display: flex; flex-direction: column; }
/* Timeline rail + dots — ONLY the timeline variant; the 'sticky' variant reuses the same scrollytelling without them */
.adm-process--timeline .adm-m-feat__step { border-left: 2px solid var(--color-border); padding-left: var(--space-6); position: relative; }
.adm-process--timeline .adm-m-feat__step::before { content: ''; position: absolute; left: -7px; top: 6px; width: 12px; height: 12px; border-radius: 50%; background: var(--color-border); transition: background var(--duration-fast) ease, box-shadow var(--duration-fast) ease; }
.adm-process--timeline .adm-m-feat__step.on { border-left-color: var(--color-brand); }
.adm-process--timeline .adm-m-feat__step.on::before { background: var(--color-brand); box-shadow: 0 0 0 4px var(--color-brand-dim); }
.adm-process__feat .adm-m-feat__step__n { color: var(--color-brand); font-family: var(--font-mono); }
/* Sticky (no timeline): give the steps a touch more breathing room since there's no rail indent */
.adm-process--sticky .adm-m-feat__step { padding-left: 0; }
/* Image on the other side (reverse_layout) */
.adm-process--timeline.adm-section--reverse .adm-m-feat,
.adm-process--sticky.adm-section--reverse .adm-m-feat { direction: rtl; }
.adm-process--sticky.adm-section--reverse .adm-m-feat > * { direction: ltr; }
.adm-process--timeline.adm-section--reverse .adm-m-feat > * { direction: ltr; }

/* ── Logos orbit: two rings + centre (reuses .magic-orbit + magic-ui.js positioning) ── */
.adm-logos--orbit { display: flex; justify-content: center; }
.adm-logos__orbit { position: relative; margin-inline: auto; }
.adm-logos__ring--inner { inset: 24%; }
.adm-logos__orbit-item { width: 60px; height: 60px; background: var(--color-surface-1); border: 1px solid var(--color-border); border-radius: 50%; display: flex; align-items: center; justify-content: center; padding: 12px; box-shadow: 0 6px 18px -8px rgba(0,0,0,.25); }
.adm-logos__orbit-item img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; }
.adm-logos--gray .adm-logos__orbit-item img { filter: grayscale(1); opacity: .75; }
.adm-logos__orbit-center { width: 104px; height: 104px; background: var(--color-surface-1); border: 1px solid var(--color-border); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-weight: var(--font-weight-medium); box-shadow: 0 14px 34px -12px rgba(0,0,0,.35); }
.adm-logos__orbit-center img { max-width: 62%; max-height: 62%; object-fit: contain; }
.adm-logos__cta { display: flex; }
.text-center .adm-logos__cta, .adm-logos-section.text-center .adm-logos__cta { justify-content: center; }

/* ── Logos grid: legacy client-grid look, standalone (override the split height:100%) ── */
/* Grid = the legacy boxed logo wall: equal bordered tiles, logo centred, tidy multi-row grid. */
.adm-logos.client-logos-grid { height: auto; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); grid-auto-rows: 1fr; gap: var(--space-5); }
.adm-logos.client-logos-grid .client-logo-card { aspect-ratio: 16 / 10; min-height: 150px; padding: var(--space-8); transition: border-color var(--duration-base) ease, box-shadow var(--duration-base) ease, transform var(--duration-base) ease; }
.adm-logos.client-logos-grid .client-logo-card:hover { border-color: var(--color-border-strong); box-shadow: var(--shadow-md); transform: translateY(-3px); }
.adm-logos.client-logos-grid .client-logo-card__img { max-width: 82%; max-height: 78%; width: auto; height: auto; object-fit: contain; }
.adm-logos--gray.client-logos-grid .client-logo-card__img { filter: grayscale(1); opacity: .6; transition: all var(--duration-fast) ease; }
.adm-logos--gray.client-logos-grid .client-logo-card:hover .client-logo-card__img { filter: none; opacity: 1; }
/* Orbit centre text fallback (no centre logo) sits on the magenta disc */
.tech-stack__center-text { color: #fff; font-weight: var(--font-weight-medium); font-size: var(--font-size-sm); text-align: center; line-height: 1.1; }

/* ── Rich text: read more / less ── */
.adm-richmore { position: relative; }
.adm-richmore__inner { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; line-clamp: 3; overflow: hidden; }
.adm-richmore.is-open .adm-richmore__inner { display: block; -webkit-line-clamp: unset; line-clamp: unset; overflow: visible; }
.adm-richmore__btn { margin-top: var(--space-5); }

/* ── Tabs robustness ── */
.admb-tabs { width: 100%; }
.admb-tabs__copy { text-align: left; }
.admb-tabs--vertical .admb-tabs__panels { min-width: 0; }

/* ── Process timeline: sticky visual takes most of the viewport (image was too small/cut off) ── */
.adm-process__feat .adm-m-feat__sticky { height: 46vh; top: 24vh; }
.adm-process__feat .adm-m-feat__step { min-height: 52vh; display: flex; flex-direction: column; justify-content: center; }
/* Per-step image: hidden on desktop (the single sticky image handles the scrollytelling). */
.adm-m-feat__step-img { display: none; }

@media (max-width: 860px) {
  /* Scrollytelling doesn't run on mobile — drop the single sticky image and show every
     step fully legible in a clean stack, each with its own image. */
  .adm-process__feat .adm-m-feat__sticky { display: none; }
  .adm-process__feat .adm-m-feat__step { min-height: 0; opacity: 1; }
  .adm-process__feat .adm-process__feat-steps { display: flex; flex-direction: column; gap: var(--space-10); margin-top: var(--space-6); }
  .adm-m-feat__step-img { display: block; margin-bottom: var(--space-5); border-radius: var(--radius-lg); overflow: hidden; }
  .adm-m-feat__step-img img { display: block; width: 100%; height: auto; border-radius: var(--radius-lg); }
  /* Timeline rail: mark every dot active on mobile since there's no scroll highlight. */
  .adm-process--timeline .adm-m-feat__step::before { background: var(--color-brand); }
  .adm-process--timeline .adm-m-feat__step { border-left-color: var(--color-brand); }
}

/* ── Stats: number colour option (counters value, ring figure, bar value) ── */
.adm-stats--num-brand .adm-m-counters__v,
.adm-stats--num-brand .adm-m-ring,
.adm-stats--num-brand .adm-m-race__val { color: var(--color-brand); }
.adm-stats--num-accent .adm-m-counters__v,
.adm-stats--num-accent .adm-m-ring,
.adm-stats--num-accent .adm-m-race__val { color: var(--color-accent); }
.adm-stats--num-accent .adm-m-ring__bar { stroke: var(--color-accent); }
.adm-stats--num-accent .adm-m-race__fill { background: var(--color-accent); }
.adm-stats--num-gradient .adm-m-counters__v {
  background: linear-gradient(96deg, var(--color-brand) 10%, #ff7ab8 90%);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
}
.adm-stats--num-gradient .adm-m-ring,
.adm-stats--num-gradient .adm-m-race__val { color: var(--color-brand); }
/* On a Magenta section the brand-coloured figures vanish (magenta-on-magenta) — force white.
   NB: the num-* and --magenta modifiers sit on the SAME section element, so these must be
   descendant selectors of --magenta alone (not chained to num-*, which would never match). */
.adm-section--magenta .adm-m-counters__v,
.adm-section--magenta .adm-m-ring,
.adm-section--magenta .adm-m-race__val { color: #fff; -webkit-text-fill-color: #fff; background: none; }

/* ── Container effects on a full-width section container ──
   The base magic-border/beam assume a tight card with an inner content layer; on a padded
   .container they bleed. Re-render them here as a clean thin animated gradient border. */
.container.magic-border, .container.magic-beam { padding-top: var(--space-10); padding-bottom: var(--space-10); border-radius: var(--radius-lg); }
.container.magic-border::before,
.container.magic-beam::before {
  inset: 0; padding: 2px; border-radius: inherit; z-index: 0;
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  mask-composite: exclude;
}
.container.magic-border > *, .container.magic-beam > * { position: relative; z-index: 1; }

/* ── Container effect applied PER INNER ITEM (not the whole section) ── */
/* Stat counters are borderless text → give them a padded box so the beam/border has a shape. */
.adm-stats__cell.magic-border, .adm-stats__cell.magic-beam, .adm-stats__cell.magic-glow,
.adm-stats__cell.magic-glass, .adm-stats__cell.magic-shimmer { padding: var(--space-6) var(--space-5); border-radius: var(--radius-lg); }

/* ── Proof-enriched stat tiles: client logo + case-study link + client contact/quote ── */
.adm-stats__cell--proof { display:flex; flex-direction:column; gap:var(--space-2); padding:clamp(var(--space-6),2.5vw,var(--space-8)); background:var(--color-surface-1); border:1px solid var(--color-border); border-radius:var(--radius-xl); text-align:left; text-decoration:none; color:inherit; transition:transform .25s ease, border-color .25s ease, box-shadow .25s ease; }
a.adm-stats__cell--proof:hover { transform:translateY(-4px); border-color:var(--color-border-brand); box-shadow:0 24px 50px -30px rgba(229,0,109,.4); }
.adm-stats__logo { display:block; height:32px; margin-bottom:var(--space-2); }
.adm-stats__logo-img { height:100%; width:auto; max-width:150px; object-fit:contain; filter:grayscale(1); opacity:.7; transition:filter var(--duration-fast) ease, opacity var(--duration-fast) ease; }
a.adm-stats__cell--proof:hover .adm-stats__logo-img { filter:none; opacity:1; }
.adm-stats__cell--proof .adm-m-counters__v { font-size:clamp(var(--font-size-3xl),3.5vw,var(--font-size-5xl)); }
.adm-stats__cell--proof .adm-m-counters__l { color:var(--color-text-secondary); }
.adm-stats__client { display:flex; align-items:center; gap:var(--space-3); margin-top:var(--space-4); padding-top:var(--space-4); border-top:1px solid var(--color-border); }
.adm-stats__client-photo img { width:40px; height:40px; border-radius:50%; object-fit:cover; display:block; }
.adm-stats__client-meta { display:flex; flex-direction:column; gap:2px; min-width:0; }
.adm-stats__client-quote { font-size:var(--font-size-sm); color:var(--color-text); line-height:1.4; }
.adm-stats__client-name { font-size:var(--font-size-xs); color:var(--color-text-muted); font-family:var(--font-mono); }
.adm-stats__cs-link { display:inline-flex; align-items:center; gap:.4em; margin-top:var(--space-3); font-size:var(--font-size-sm); font-weight:500; color:var(--color-brand); text-decoration:none; }
/* Never underline the text inside the tile-as-link. */
.adm-stats__cell--proof, .adm-stats__cell--proof * { text-decoration:none !important; }
/* Adaptive card so proof tiles read on Magenta / Dark / Black sections (glass panel + light ink). */
.adm-section--magenta .adm-stats__cell--proof,
.adm-section--dark .adm-stats__cell--proof,
.adm-section--black .adm-stats__cell--proof,
.adm-section--magicgrid .adm-stats__cell--proof { background:rgba(255,255,255,.10); border-color:rgba(255,255,255,.24); }
.adm-section--magenta .adm-stats__cs-link,
.adm-section--dark .adm-stats__cs-link,
.adm-section--black .adm-stats__cs-link,
.adm-section--magicgrid .adm-stats__cs-link { color:#fff; }
.adm-section--magenta .adm-stats__logo-img,
.adm-section--dark .adm-stats__logo-img,
.adm-section--black .adm-stats__logo-img { background:#fff; padding:6px 8px; border-radius:var(--radius-sm,6px); filter:none; opacity:1; }
.adm-m-ring.magic-border, .adm-m-ring.magic-beam, .adm-m-ring.magic-glow, .adm-m-ring.magic-glass { padding: var(--space-5); border-radius: var(--radius-lg); }
.adm-m-race__row.magic-border, .adm-m-race__row.magic-beam { padding: var(--space-4) var(--space-5); border-radius: var(--radius-md); }

/* ── Reviews — Clutch-style review widget (ADM branding) ── */
/* Live Clutch embed (type 4 carousel): wrap the third-party iframe in our card so it picks up the
   theme radius/border/shadow. overflow:hidden clips the iframe's square corners to our radius; the
   iframe is a cross-origin frame so its INTERNAL layout stays Clutch's — we only style the frame. */
.adm-reviews__embed { margin-inline: auto; max-width: 100%; border-radius: var(--radius-lg);
  overflow: hidden; border: 1px solid var(--color-border); box-shadow: var(--shadow-md);
  background: var(--color-surface-1); }
.adm-reviews__embed iframe,
.adm-reviews__embed .clutch-widget { display: block; width: 100% !important; border: 0; margin: 0 auto !important; }

/* Widget source — each platform's own native embed (Clutch / Trustpilot / Google). Single = a row
   of badges; slider = one per carousel slide. Never wrapped in .reveal (embeds self-measure). */
.adm-reviews__widgets { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: var(--space-8); }
.adm-reviews__widget { max-width: 100%; }
.adm-reviews__wslider .adm-carousel__slide { display: flex; align-items: center; justify-content: center; }

/* ── Trustpilot & Google CPT cards — two-column layout so they fill the same wide
   container as the detailed Clutch card (identity aside | review body, divided). The
   compound .adm-review.adm-review--* (0,2,0) beats the base .adm-review grid (0,1,0). ── */
.adm-review.adm-review--trustpilot,
.adm-review.adm-review--google {
	display: grid;
	grid-template-columns: minmax(230px, 0.8fr) 2fr;
	gap: 0;
	align-items: stretch;
	text-align: left;
	max-width: none;
	margin-inline: 0;
	min-height: 280px;
}
.adm-tp__aside, .adm-g__aside { display: flex; flex-direction: column; justify-content: center; gap: var(--space-5); padding-right: clamp(var(--space-8), 4vw, var(--space-12)); }
.adm-tp__body, .adm-g__body { display: flex; flex-direction: column; justify-content: center; gap: var(--space-4); padding-left: clamp(var(--space-8), 4vw, var(--space-12)); border-left: 1px solid var(--color-border); }
.adm-tp__body .adm-review__lbl, .adm-g__body .adm-review__lbl { margin-bottom: 0; }

/* Trustpilot — green square stars, verified footer */
.adm-tp__stars { display: inline-flex; gap: 4px; }
.adm-tp__star { width: 30px; height: 30px; display: inline-flex; align-items: center; justify-content: center; background: #dcdce6; color: #fff; font-size: 17px; border-radius: 4px; }
.adm-tp__star.is-on { background: #00b67a; }
.adm-tp__title { margin: 0; font-size: var(--font-size-xl); font-weight: var(--font-weight-medium); line-height: 1.3; color: var(--color-text); }
.adm-tp__foot { display: flex; flex-direction: column; gap: var(--space-1); font-size: var(--font-size-sm); color: var(--color-text-muted); }
.adm-tp__name { font-weight: var(--font-weight-medium); color: var(--color-text); }
.adm-tp__verified { display: inline-flex; align-items: center; gap: 4px; color: #00b67a; }
.adm-tp__verified svg { width: 15px; height: 15px; }
.adm-tp__link { display: inline-flex; align-items: center; gap: 6px; margin-top: var(--space-2); color: var(--color-brand); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); text-decoration: none; }
.adm-tp__link svg { width: 15px; height: 15px; }

/* Google — avatar, gold stars */
.adm-g__head { display: flex; align-items: center; gap: var(--space-3); }
.adm-g__avatar { flex: 0 0 auto; width: 48px; height: 48px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-weight: var(--font-weight-medium); font-size: 20px; background: var(--color-brand-dim, rgba(229,0,109,.10)); color: var(--color-brand); }
.adm-g__who { display: flex; flex-direction: column; line-height: 1.25; }
.adm-g__name { font-weight: var(--font-weight-medium); color: var(--color-text); }
.adm-g__date { font-size: var(--font-size-xs); color: var(--color-text-muted); }
.adm-g__stars { display: inline-flex; gap: 2px; }
.adm-g__star { color: #dadce0; font-size: 22px; line-height: 1; }
.adm-g__star.is-on { color: #fbbc05; }
/* Review body text (Trustpilot + Google): regular weight, comfortable for multi-paragraph reviews. */
.adm-tp__quote, .adm-g__quote { margin: 0; font-size: var(--font-size-base); font-weight: var(--font-weight-normal); line-height: var(--line-height-relaxed); color: var(--color-text-secondary); border: 0; padding: 0; }
.adm-tp__quote p, .adm-g__quote p { margin: 0 0 0.7em; }
.adm-tp__quote p:last-child, .adm-g__quote p:last-child { margin-bottom: 0; }

/* Collapsible long reviews — clamp to ~7 lines with a fade, toggled by JS "Read more". */
.adm-review__clamp { position: relative; max-height: 11em; overflow: hidden; }
.adm-review__clamp.is-open { max-height: none; }
.adm-review__clamp.is-clamped:not(.is-open)::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 2.6em; background: linear-gradient(to bottom, transparent, var(--color-surface-1)); pointer-events: none; }
.adm-review__more { align-self: flex-start; margin-top: calc(var(--space-2) * -1); padding: 0; background: none; border: 0; cursor: pointer; color: var(--color-brand); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); }
.adm-review__more:hover { text-decoration: underline; }

/* Keep muted greys legible on dark/black/magenta sections */
.adm-section--dark .adm-g__star, .adm-section--black .adm-g__star, .adm-section--magenta .adm-g__star { color: rgba(255,255,255,.28); }
.adm-section--dark .adm-tp__star:not(.is-on), .adm-section--black .adm-tp__star:not(.is-on), .adm-section--magenta .adm-tp__star:not(.is-on) { background: rgba(255,255,255,.22); }

/* Stack to a single column on narrow viewports */
@media (max-width: 768px) {
	.adm-review.adm-review--trustpilot,
	.adm-review.adm-review--google { grid-template-columns: 1fr; min-height: 0; gap: var(--space-6); }
	.adm-tp__aside, .adm-g__aside { padding-right: 0; }
	.adm-tp__body, .adm-g__body { padding-left: 0; border-left: 0; border-top: 1px solid var(--color-border); padding-top: var(--space-6); }
}

.adm-reviews__single, .adm-reviews__slider { }
.adm-review { display: grid; grid-template-columns: 1fr 0.9fr 1.5fr 1fr; gap: 0; align-items: start; background: var(--color-surface-1); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: var(--space-10); text-align: left; }
/* The review card is always left-aligned on desktop regardless of the section content_align. */
.adm-reviews .adm-review, .adm-reviews .adm-review__col { text-align: left; }
.adm-review__col { padding: 0 var(--space-6); }
.adm-review__col + .adm-review__col { border-left: 1px solid var(--color-border); }
.adm-review__lbl { display: block; font-family: var(--font-mono); font-size: var(--font-size-2xs); text-transform: uppercase; letter-spacing: .1em; color: var(--color-text-muted); margin: 0 0 var(--space-3); }
.adm-review__col .adm-review__lbl:not(:first-child) { margin-top: var(--space-5); }
.adm-review__proj { font-weight: var(--font-weight-medium); margin: 0; }
.adm-review__meta, .adm-review__date { font-family: var(--font-mono); font-size: var(--font-size-sm); color: var(--color-text-secondary); margin: var(--space-2) 0 0; }
.adm-review__sum, .adm-review__fb { font-size: var(--font-size-sm); color: var(--color-text-secondary); line-height: 1.55; margin: 0; }
.adm-review__quote { font-size: var(--font-size-lg); font-weight: var(--font-weight-medium); line-height: 1.45; margin: 0; }
/* Score box */
.adm-review__scorebox { border: 1px solid var(--color-border); border-radius: var(--radius-md); padding: var(--space-5); text-align: center; }
.adm-review__score { font-size: var(--font-size-4xl); font-weight: var(--font-weight-medium); line-height: 1; display: block; }
.adm-review__stars { display: inline-flex; gap: 2px; margin: var(--space-3) 0 var(--space-4); font-size: 18px; }
.adm-review__star { color: var(--color-border-strong); display: inline-flex; }
.adm-review__star.is-on { color: var(--color-brand); }
.adm-review__rates { text-align: left; display: flex; flex-direction: column; gap: var(--space-2); border-top: 1px solid var(--color-border); padding-top: var(--space-3); }
.adm-review__rate { display: flex; justify-content: space-between; gap: var(--space-3); font-size: var(--font-size-sm); color: var(--color-text-secondary); }
.adm-review__rate-v { font-weight: var(--font-weight-medium); color: var(--color-text); }
/* Reviewer */
.adm-review__rrole { font-weight: var(--font-weight-medium); margin: 0; }
.adm-review__rname { display: flex; align-items: center; gap: var(--space-2); color: var(--color-text-secondary); margin: var(--space-2) 0 0; }
.adm-review__facts { list-style: none; margin: var(--space-4) 0 0; padding: 0; display: flex; flex-direction: column; gap: var(--space-2); font-size: var(--font-size-sm); color: var(--color-text-secondary); }
.adm-review__facts li { display: flex; align-items: center; gap: var(--space-2); }
.adm-review__facts i, .adm-review__rname i { color: var(--color-text-muted); font-size: 17px; }
.adm-review__verified { color: #15a34a; }
.adm-review__verified i { color: #15a34a; }
/* Action */
.adm-review__action { grid-column: 1 / -1; display: flex; justify-content: center; margin-top: var(--space-10); padding: var(--space-10) var(--space-6) 0; border-top: 1px solid var(--color-border); }
.adm-reviews__slider .adm-review { border: 0; padding: var(--space-8) var(--space-10); }
/* Logos — Grid + content (split): client logo grid on one side, rich copy on the other. */
.adm-logos__split { display: grid; grid-template-columns: 1.05fr 1fr; }
.adm-logos--gridsplit { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-3); }
.adm-logos--gridsplit .adm-logos__item { display: flex; align-items: center; justify-content: center; padding: var(--space-6); min-height: 116px; border-radius: var(--radius-md); transition: background .2s ease; }
.adm-logos--gridsplit .adm-logos__item:hover { background: var(--color-surface-2); }
.adm-logos--gridsplit .adm-logos__img { max-width: 100%; max-height: 56px; width: auto; height: auto; object-fit: contain; }
.adm-logos__copy-title { margin: var(--space-3) 0 0; }
.adm-logos__copy-body { margin-top: var(--space-5); }
.adm-logos__copy-cta { margin-top: var(--space-8); }
@media (max-width: 900px) { .adm-logos__split { grid-template-columns: 1fr; gap: var(--space-8); } }
@media (max-width: 520px) { .adm-logos--gridsplit { grid-template-columns: repeat(2, 1fr); } }
/* Clutch brand logo — light variant (dark ink) on light surfaces, white variant on dark ones. */
.adm-clutch-logo { display: flex; justify-content: center; align-items: center; margin-top: var(--space-5); }
.adm-clutch-logo__img { height: 34px; width: auto; display: inline-block; }
.adm-clutch-logo__img--ondark { display: none; }
[data-theme="dark"] .adm-clutch-logo__img--onlight,
.adm-section--dark .adm-clutch-logo__img--onlight,
.adm-section--black .adm-clutch-logo__img--onlight,
.adm-section--magenta .adm-clutch-logo__img--onlight { display: none; }
[data-theme="dark"] .adm-clutch-logo__img--ondark,
.adm-section--dark .adm-clutch-logo__img--ondark,
.adm-section--black .adm-clutch-logo__img--ondark,
.adm-section--magenta .adm-clutch-logo__img--ondark { display: inline-block; }
/* A White section stays light even under the dark-mode toggle → keep the dark-ink logo. */
[data-theme="dark"] .adm-section--white .adm-clutch-logo__img--onlight { display: inline-block; }
[data-theme="dark"] .adm-section--white .adm-clutch-logo__img--ondark { display: none; }

/* ── Reviews platform tabs (Clutch / Trustpilot / Google) ── */
.adm-rtabs__bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: clamp(var(--space-6), 5vw, var(--space-12)); }
.adm-rtabs__tab { position: relative; display: inline-flex; align-items: center; justify-content: center; background: none; border: 0; padding: var(--space-3) var(--space-1); cursor: pointer; filter: grayscale(1); opacity: .4; transition: filter var(--duration-base) ease, opacity var(--duration-base) ease; }
.adm-rtabs__tab:hover { opacity: .75; filter: grayscale(.3); }
.adm-rtabs__tab.is-active { filter: grayscale(0); opacity: 1; }
.adm-rtabs__tab.is-active::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: var(--color-brand); border-radius: 2px; }
.adm-rtabs__logo { display: block; height: 30px; width: auto; }
/* Optical sizing/alignment — each wordmark carries different visual weight & baseline. */
.adm-rtabs__tab[data-rtab="trustpilot"] .adm-rtabs__logo { height: 38px; }
.adm-rtabs__tab[data-rtab="google"] .adm-rtabs__logo { transform: translateY(4px); }
.adm-rtabs__logo--ondark { display: none; }
.adm-rtabs__txt { font-family: var(--font-mono); font-size: var(--font-size-lg); font-weight: var(--font-weight-medium); color: var(--color-text); }
.adm-rtabs__panel { margin-top: var(--space-8); transition: opacity var(--duration-base, .28s) var(--ease-out, ease); }
.adm-rtabs__panel[hidden] { display: none; }
/* Fade IN via a CSS keyframe (reliable in background tabs, unlike rAF). Applied whenever a panel
   becomes active; JS re-triggers it by removing/re-adding .is-active with a reflow between. */
.adm-rtabs__panel.is-active { animation: admRtabIn var(--duration-base, .28s) var(--ease-out, ease); }
@keyframes admRtabIn { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .adm-rtabs__panel.is-active { animation: none; } }
.adm-rtabs { transition: min-height var(--duration-base, .28s) var(--ease-out, ease); }
.adm-rtabs__list { display: flex; flex-direction: column; gap: var(--space-6); }
.adm-rtabs__more, .adm-rtabs__empty { margin-top: var(--space-6); text-align: center; color: var(--color-text-secondary); font-size: var(--font-size-sm); }
.adm-rtabs__more a, .adm-rtabs__empty a { display: inline-flex; align-items: center; gap: 6px; color: var(--color-brand); font-weight: var(--font-weight-medium); text-decoration: none; }
.adm-rtabs__more svg, .adm-rtabs__empty svg { width: 15px; height: 15px; }
/* Swap logo ink for dark backgrounds (same rule as the Clutch logo) */
[data-theme="dark"] .adm-rtabs__logo--onlight,
.adm-section--dark .adm-rtabs__logo--onlight,
.adm-section--black .adm-rtabs__logo--onlight,
.adm-section--magenta .adm-rtabs__logo--onlight { display: none; }
[data-theme="dark"] .adm-rtabs__logo--ondark,
.adm-section--dark .adm-rtabs__logo--ondark,
.adm-section--black .adm-rtabs__logo--ondark,
.adm-section--magenta .adm-rtabs__logo--ondark { display: block; }
[data-theme="dark"] .adm-section--white .adm-rtabs__logo--onlight { display: block; }
[data-theme="dark"] .adm-section--white .adm-rtabs__logo--ondark { display: none; }
@media (max-width: 900px) {
  .adm-review { grid-template-columns: 1fr 1fr; gap: var(--space-6); padding: var(--space-6); }
  .adm-review__col { padding: var(--space-2) 0; border-left: 0 !important; }
}
@media (max-width: 560px) {
  .adm-reviews .adm-review, .adm-reviews .adm-review__col { text-align: center; }
  .adm-review__rates, .adm-review__facts { align-items: center; }
  .adm-review__rname, .adm-review__facts li { justify-content: center; }
}
@media (max-width: 560px) { .adm-review { grid-template-columns: 1fr; } }

/* ── Hero — Home (form + glass refraction + awards) ── */
.adm-hero-home { position: relative; overflow: clip; padding-block: var(--space-10) var(--space-8); } /* reduced so the client logos sit in view without scrolling */
.adm-hero-home__inner, .adm-hero-home__awards { position: relative; z-index: 1; }
.adm-hero-home__title { font-size: clamp(var(--font-size-4xl), 5.5vw, var(--font-size-7xl)); font-weight: var(--font-weight-medium); line-height: 1.04; margin: var(--space-4) 0 0; }
/* All heroes share the homepage hero heading size (the compact heroes otherwise inherit the
   larger base h1 and look bigger than the homepage). */
.adm-hero-compact .section-header__title,
.adm-hero-short .section-header__title { font-size: clamp(var(--font-size-4xl), 5.5vw, var(--font-size-7xl)); line-height: 1.04; }
.adm-hero-home__sub { font-size: var(--font-size-lg); color: var(--color-text-secondary); max-width: 46ch; margin: var(--space-6) 0 0; }
.adm-hero-home__ctas { display: flex; flex-wrap: wrap; gap: var(--space-4); margin-top: var(--space-8); }
/* Lead form panel (frosted) */
.adm-hero-home__form { background: rgba(255,255,255,.72); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); border: 1px solid rgba(255,255,255,.6); border-radius: var(--radius-lg); padding: var(--space-8); box-shadow: 0 30px 80px -40px rgba(0,0,0,.3); color: #1a1a1a; }
.adm-hero-home__form-title { color: #1a1a1a; }
.adm-hero-home__form .wpcf7-list-item-label { color: #4a4a4a; }
/* The lead-form card FOLLOWS the active theme: dark frosted card + light text whenever the
   page is in dark mode OR the section colour is a dark one. A White section stays light. */
[data-theme="dark"] .adm-hero-home__form,
.adm-section--dark .adm-hero-home__form,
.adm-section--black .adm-hero-home__form,
.adm-section--magenta .adm-hero-home__form { background: rgba(22,22,28,.62); border-color: rgba(255,255,255,.14); color: #fff; }
[data-theme="dark"] .adm-hero-home__form-title,
[data-theme="dark"] .adm-hero-home__form label,
[data-theme="dark"] .adm-hero-home__form .wpcf7-form,
.adm-section--dark .adm-hero-home__form-title,
.adm-section--black .adm-hero-home__form-title,
.adm-section--magenta .adm-hero-home__form-title { color: #fff; }
[data-theme="dark"] .adm-hero-home__form .wpcf7-list-item-label,
.adm-section--dark .adm-hero-home__form .wpcf7-list-item-label,
.adm-section--black .adm-hero-home__form .wpcf7-list-item-label,
.adm-section--magenta .adm-hero-home__form .wpcf7-list-item-label { color: rgba(255,255,255,.72); }
/* A White section is always light, even under the dark-mode toggle. */
[data-theme="dark"] .adm-section--white .adm-hero-home__form { background: rgba(255,255,255,.72); border-color: rgba(255,255,255,.6); color: #1a1a1a; }
[data-theme="dark"] .adm-section--white .adm-hero-home__form-title,
[data-theme="dark"] .adm-section--white .adm-hero-home__form .wpcf7-form { color: #1a1a1a; }
[data-theme="dark"] .adm-section--white .adm-hero-home__form .wpcf7-list-item-label { color: #4a4a4a; }
.adm-hero-home__form-title { font-size: var(--font-size-2xl); font-weight: var(--font-weight-medium); margin: 0 0 var(--space-5); text-align: center; }
/* Hero lead-form CTA = brand yellow (not magenta) — higher specificity to beat .wpcf7-form .wpcf7-submit */
.adm-hero-home__form .wpcf7-form .wpcf7-submit { background: var(--color-yellow); border-color: var(--color-yellow); color: #0a0a0a; }
.adm-hero-home__form .wpcf7-form .wpcf7-submit:hover { background: #f2c800; border-color: #f2c800; color: #0a0a0a; box-shadow: 0 12px 30px -12px rgba(255,212,0,.6); transform: translateY(-1px); }
/* Awards marquee */
.adm-hero-home__awards { margin-top: var(--space-8); }
.adm-hero-home__awards-head { position: relative; z-index: 2; display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); margin-bottom: var(--space-5); }
.adm-hero-home__awards-lbl { display: block; font-family: var(--font-mono); font-size: var(--font-size-2xs); text-transform: uppercase; letter-spacing: .12em; color: var(--color-text); }
.adm-hero-home__awards-more { display: inline-flex; align-items: center; gap: 6px; font-size: var(--font-size-xs); font-weight: var(--font-weight-medium); color: var(--color-text); text-decoration: none; white-space: nowrap; transition: opacity var(--duration-fast) ease; }
.adm-hero-home__awards-more:hover { opacity: .7; }
.adm-hero-home__awards-more svg { width: 14px; height: 14px; }
/* Award chips keep a constant white background so every badge shows in its true colour
   (a dark/mono badge would otherwise vanish on the theme-coloured surface). */
.adm-hero-home__award { overflow: hidden; flex-shrink: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 124px; padding: var(--space-3) var(--space-8); background: #ffffff; border: 1px solid rgba(0,0,0,.08); border-radius: var(--radius-md); }
.adm-hero-home__award img { max-height: 88px; width: auto; object-fit: contain; }
/* Robust fade + upward-grow: the marquee box is TALLER than a resting card (reserves room at the top),
   with normal overflow:hidden and the standard edge-fade mask (base rule). The scrolling row is pinned to
   the bottom, so a hovered card grows UP into the reserved space — staying INSIDE the box, so the mask
   fades the edges and nothing clips. No no-clip / overflow-y tricks. */
.adm-hero-home__awards .magic-marquee { position: relative; height: 168px; overflow: hidden; margin-top: -44px; /* cancel the reserved top room visually (168 - 124) so there's no rest gap; the space is still there for the card to grow up into */ }
.adm-hero-home__awards .magic-marquee__track { position: absolute; left: 0; bottom: 0; align-items: flex-end; }
.adm-hero-home__award-win { max-height: 0; opacity: 0; overflow: hidden; text-align: center; margin-top: 0; pointer-events: none; transition: max-height var(--duration-base) var(--ease-out), opacity var(--duration-base) ease, margin-top var(--duration-base) var(--ease-out); }
.adm-hero-home__award:hover .adm-hero-home__award-win { max-height: 46px; opacity: 1; margin-top: var(--space-2); }
.adm-hero-home__award-win-cap { display: block; font-size: var(--font-size-2xs); font-weight: var(--font-weight-medium); color: #0a0a0a; line-height: 1.15; }
.adm-hero-home__award-win-sub { display: block; font-size: 10px; color: #6b6b6b; margin-top: 1px; line-height: 1.1; }

/* ══ Awards rendered inside the Logos block (Logo source = Awards) ══
   Mirrors the homepage hero awards marquee, kept self-contained so the hero is untouched. */
.adm-logos__award { overflow: hidden; flex-shrink: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 124px; padding: var(--space-3) var(--space-8); background: #ffffff; border: 1px solid rgba(0,0,0,.08); border-radius: var(--radius-md); }
.adm-logos__award img { max-height: 88px; width: auto; object-fit: contain; }
.adm-logos__award--laurel { background: transparent; border: 0; padding: 0 var(--space-5); }
/* Hover reveal: the marquee reserves vertical room and cards grow up from the bottom (no clipping). */
.adm-logos--awardhover.magic-marquee { position: relative; height: 168px; overflow: hidden; }
.adm-logos--awardhover .magic-marquee__track { position: absolute; left: 0; bottom: 0; align-items: flex-end; }
.adm-logos__award-win { max-height: 0; opacity: 0; overflow: hidden; text-align: center; margin-top: 0; pointer-events: none; transition: max-height var(--duration-base) var(--ease-out), opacity var(--duration-base) ease, margin-top var(--duration-base) var(--ease-out); }
.adm-logos__award:hover .adm-logos__award-win { max-height: 46px; opacity: 1; margin-top: var(--space-2); }
.adm-logos__award-win-cap { display: block; font-size: var(--font-size-2xs); font-weight: var(--font-weight-medium); color: #0a0a0a; line-height: 1.15; }
.adm-logos__award-win-sub { display: block; font-size: 10px; color: #6b6b6b; margin-top: 1px; line-height: 1.1; }
/* Award grid: laurel cards sit frameless; image cards keep the white logo-card frame. */
.adm-logos--awards .client-logo-card.adm-logos__award--laurel { background: transparent; border: 0; box-shadow: none; }
@media (max-width: 860px) { .adm-hero-home__lens { width: 380px; height: 380px; transform: translate(calc(var(--mx,75%) - 190px), calc(var(--my,25%) - 190px)); } .adm-hero-home__inner.split { grid-template-columns: 1fr; } }

/* ── Soft gradient (mesh) background — bg_colour "Gradient" ──────────────────────────────
   A subtle, slowly-drifting magenta/peach/yellow mesh on TRANSPARENT, so it tints whatever
   the section sits on and honours light & dark mode. Kept low-opacity for text legibility. */
.adm-section--gradient { position: relative; isolation: isolate; overflow: clip; }
.adm-section--gradient::before {
  content: ''; position: absolute; inset: -25%; z-index: -1; pointer-events: none;
  background:
    radial-gradient(38% 48% at 18% 28%, rgba(229,0,109,.28), transparent 70%),
    radial-gradient(34% 42% at 82% 22%, rgba(255,212,0,.22), transparent 70%),
    radial-gradient(44% 50% at 72% 82%, rgba(255,122,90,.26), transparent 72%),
    radial-gradient(40% 46% at 26% 86%, rgba(229,0,109,.20), transparent 72%);
  filter: blur(38px);
  animation: adm-gradient-flow 26s ease-in-out infinite alternate;
}
/* A touch more presence in dark mode so the tint reads against the dark base. */
[data-theme="dark"] .adm-section--gradient::before {
  background:
    radial-gradient(38% 48% at 18% 28%, rgba(229,0,109,.26), transparent 70%),
    radial-gradient(34% 42% at 82% 22%, rgba(255,212,0,.16), transparent 70%),
    radial-gradient(44% 50% at 72% 82%, rgba(255,122,90,.22), transparent 72%),
    radial-gradient(40% 46% at 26% 86%, rgba(229,0,109,.20), transparent 72%);
}
@keyframes adm-gradient-flow {
  0%   { transform: translate3d(-3%, 2%, 0) scale(1.05); }
  50%  { transform: translate3d(3%, -2%, 0) scale(1.12); }
  100% { transform: translate3d(-2%, 3%, 0) scale(1.07); }
}
@media (prefers-reduced-motion: reduce) { .adm-section--gradient::before { animation: none; } }

/* ── Award Event single page ── */
.adm-event-hero__logo { display: inline-flex; margin-bottom: var(--space-6); }
.adm-event-hero__logo img { max-height: 96px; width: auto; object-fit: contain; }
.adm-event-wins { list-style: none; margin: var(--space-8) auto 0; padding: 0; max-width: 840px; display: flex; flex-direction: column; gap: var(--space-4); }
.adm-event-win { display: flex; gap: var(--space-6); padding: var(--space-6); background: var(--color-surface-1); border: 1px solid var(--color-border); border-radius: var(--radius-lg); }
.adm-event-win__year { font-family: var(--font-mono); font-size: var(--font-size-2xl); font-weight: var(--font-weight-medium); color: var(--color-brand); flex: 0 0 auto; min-width: 60px; }
.adm-event-win__body { flex: 1; }
.adm-event-win__result { display: inline-block; font-family: var(--font-mono); font-size: var(--font-size-2xs); text-transform: uppercase; letter-spacing: .1em; padding: 3px 9px; border-radius: var(--radius-full); background: var(--color-brand-dim); color: var(--color-brand); margin-bottom: var(--space-2); }
.adm-event-win__result--finalist, .adm-event-win__result--shortlisted, .adm-event-win__result--nominee { background: var(--color-surface-3); color: var(--color-text-secondary); }
.adm-event-win__cat { font-size: var(--font-size-lg); font-weight: var(--font-weight-medium); margin: 0 0 var(--space-1); }
.adm-event-win__summary { color: var(--color-text-secondary); margin: 0; }
.adm-event-win__link { display: inline-flex; align-items: center; gap: 6px; margin-top: var(--space-3); color: var(--color-brand); font-weight: var(--font-weight-medium); font-size: var(--font-size-sm); }
@media (max-width: 560px) { .adm-event-win { flex-direction: column; gap: var(--space-2); } }

/* Feature/bento icons chosen via the HugeIcons picker (adm_icon() → <i class="hgi-*">) */
.adm-feature__icon--hgi { display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: var(--radius-md); background: var(--color-brand-dim); }
.adm-feature__icon--hgi i { font-size: 26px; color: var(--color-brand); line-height: 1; }
.adm-m-tile__eye--hgi i { font-size: 28px; color: var(--color-brand); line-height: 1; }

/* CTA — Lead form variant: the form uses the exact legacy .card.adm-form-card (frosted magic-glass),
   NOT a heavy solid box. The card's own look comes from components.css .adm-form-card + magic-glass. */
/* Form variant = a faithful port of the legacy form section: fills the container, award laurel on top,
   office/contact cards below the form, yellow submit. */
.adm-cta--form .adm-cta__inner { max-width: none; }
.adm-cta--form .adm-form-card { margin-top: var(--space-8); text-align: left; }
@media (max-width: 600px) { .adm-cta--form .adm-form-card { padding: var(--space-6) !important; } }
.adm-cta__offices { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-4); margin: var(--space-8) auto 0; text-align: left; }
.adm-cta__office { background: var(--color-surface-1); border: 1px solid var(--color-border); border-radius: var(--radius-md); padding: var(--space-5); }
.adm-cta__office-h { display: flex; align-items: center; gap: var(--space-2); font-weight: var(--font-weight-medium); font-size: var(--font-size-sm); margin-bottom: var(--space-2); }
.adm-cta__office address { font-style: normal; font-size: var(--font-size-sm); line-height: var(--line-height-relaxed); color: var(--color-text-secondary); }
.adm-cta__office a { display: block; width: fit-content; font-size: var(--font-size-sm); color: var(--color-brand); text-decoration: none; background-image: linear-gradient(currentColor, currentColor); background-position: 0 100%; background-repeat: no-repeat; background-size: 0% 1.5px; transition: background-size 0.35s var(--ease-out); }
.adm-cta__office a:hover { background-size: 100% 1.5px; }
@media (max-width: 760px) { .adm-cta__offices { grid-template-columns: 1fr; } }
/* On magenta the office cards read as translucent white tiles (matches the legacy). */
.adm-section--magenta .adm-cta__office { background: rgba(255,255,255,0.08); border-color: rgba(255,255,255,0.16); }
.adm-section--magenta .adm-cta__office address { color: rgba(255,255,255,0.82); }
/* Force the lead-form submit YELLOW even on magenta (beats .adm-section--magenta .btn--primary !important). */
.adm-cta--form .adm-form-card .wpcf7-submit, .adm-section--magenta .adm-cta--form .adm-form-card .wpcf7-submit,
.adm-cta--form .adm-form-card input[type="submit"], .adm-section--magenta .adm-cta--form .adm-form-card input[type="submit"] {
  background: var(--color-yellow) !important; color: #000 !important; border-color: var(--color-yellow) !important; }

/* Hero review-badge row (Clutch now; Google/Trustpilot later) — sit side by side under the intro. */
/* Reviews-widget tray: gives third-party widgets (Clutch/Google/Trustpilot) a light card so they
   stay legible on dark/black/magenta heroes. Kept light in BOTH modes — these widgets are built for
   a light background. Hugs its content (width:max-content) so it sits under the copy, not full-bleed. */
/* Reviews tray = a plain ROW; each badge (Clutch / Google / Trustpilot) is its own card. */
.adm-hero-home__reviews { display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; gap: var(--space-5); margin-top: var(--space-4); }
/* Static review badge images (Google / Trustpilot / Clutch) — interim until live widgets. Each badge
   sits in its own card container (surface + border + radius); uniform box height so the three platforms
   align regardless of their individual artwork aspect ratios. Padding on the <img> is the card inset. */
.adm-hero-home__reviews .adm-hero-home__badge {
  height: 66px; box-sizing: border-box; padding: var(--space-2) var(--space-4);
  background: var(--color-bg); border: 1px solid var(--color-border); border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm); width: auto; max-width: 210px; object-fit: contain; display: block;
}
@media (max-width: 560px) { .adm-hero-home__reviews .adm-hero-home__badge { height: 56px; padding: var(--space-1) var(--space-3); } }
/* Theme-aware badge artwork: show the light variant in light mode, the dark variant in dark mode. */
.adm-hero-home__reviews .adm-hero-home__badge--dark { display: none; }
[data-theme="dark"] .adm-hero-home__reviews .adm-hero-home__badge--light { display: none; }
[data-theme="dark"] .adm-hero-home__reviews .adm-hero-home__badge--dark { display: block; }
/* Home hero fills the viewport tightly — trim the block padding so the reviews tray doesn't push
   the content past one screen. */
.adm-hero-home.adm-section--vh { padding-block: var(--space-5); }
/* Clutch renders its badge in a fixed-layout iframe wider than its content, leaving a big empty
   area. Crop it by capping the widget/iframe width to the badge (~230px). Content is left-aligned
   inside the iframe, so only the empty right is cut. Bump the value if the badge ever clips. */
.adm-hero-home__reviews .clutch-widget { margin: 0 !important; width: 230px !important; max-width: 230px !important; overflow: hidden; }
/* Clutch injects/replaces the div with an iframe that isn't a child of .clutch-widget, so target ANY
   iframe in the tray — the earlier .clutch-widget iframe selector never matched, which is why the
   width cap didn't land. Cap + crop the empty right of the badge. Bump 240px if the badge ever clips. */
.adm-hero-home__reviews iframe { width: 230px !important; max-width: 230px !important; min-width: 0 !important; display: block; }
/* Centre-aligned heroes: keep the tray centred under the copy. */
.adm-ha-center .adm-hero-home__reviews { align-self: center; }

/* Bento tiles: optional image + CTA per box (fills the larger feature/wide tiles). */
.adm-m-tile__content { display: flex; flex-direction: column; }
.adm-m-tile__link { display: inline-flex; align-items: center; gap: 6px; margin-top: var(--space-3); color: var(--color-brand); font-weight: var(--font-weight-medium); font-size: var(--font-size-sm); text-decoration: none; }
.adm-m-tile__link svg { width: 16px; height: 16px; }
.adm-m-tile__media { margin-top: auto; padding-top: var(--space-5); }
.adm-m-tile__media img { display: block; width: 100%; height: auto; border-radius: var(--radius-md); }
.adm-m-tile--feature .adm-m-tile__media img { max-height: 340px; object-fit: cover; }

/* CTA lead-form — split layout: copy left, form card right (like the hero). */
.adm-cta--form-split .adm-cta__inner { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-10); align-items: center; text-align: left; }
.adm-cta--form-split .adm-cta__copy { max-width: 48ch; }
.adm-cta--form-split .adm-form-card { margin-top: 0; }
@media (max-width: 900px) { .adm-cta--form-split .adm-cta__inner { grid-template-columns: 1fr; gap: var(--space-8); } }

/* Static Clutch trust badge (replaces the live iframe in the hero — identical look, no empty space). */
.adm-clutch-badge { display: inline-flex; align-items: center; gap: var(--space-4); }
.adm-clutch-badge__brand { display: flex; flex-direction: column; gap: 4px; }
.adm-clutch-badge__label { font-family: var(--font-mono); font-size: var(--font-size-2xs); text-transform: uppercase; letter-spacing: .1em; color: var(--color-text-muted); }
.adm-clutch-badge__logo { height: 24px; width: auto; display: block; }
.adm-clutch-badge__score { display: flex; flex-direction: column; gap: 4px; }
.adm-clutch-badge__stars { color: #e62415; font-size: 17px; letter-spacing: 3px; line-height: 1; }
.adm-clutch-badge__count { font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); color: var(--color-text); }

/* Optional section-level CTA on blocks (Button text / link / style). */
.adm-block-cta { margin-top: var(--space-8); display: flex; justify-content: center; }
.adm-ha-left .adm-block-cta, .text-left .adm-block-cta { justify-content: flex-start; }
.adm-block-cta__link { display: inline-flex; align-items: center; gap: 6px; color: var(--color-brand); font-weight: var(--font-weight-medium); text-decoration: none; }
.adm-block-cta__link svg { width: 16px; height: 16px; }
.btn--outline { background: transparent; color: var(--color-brand); border: 1.5px solid var(--color-brand); }
.btn--outline:hover { background: var(--color-brand); color: #fff; border-color: var(--color-brand); }

/* Bulletproof the Clutch badge logo size (a global img reset was winning somehow). */
.adm-hero-home__reviews .adm-clutch-badge__logo { height: 26px !important; width: auto !important; max-height: 26px !important; max-width: 120px !important; }
.adm-hero-home__reviews .adm-clutch-badge__stars { font-size: 18px; letter-spacing: 2px; }

/* Cards block — per-card colour theme (independent of the section bg) + size/density.
   Remaps the surface/text/border tokens so the standard card types adapt. */
.adm-cards--theme-white  { --color-surface-1:#ffffff; --color-text:#0a0a0a; --color-text-secondary:#6b6b6b; --color-border:rgba(10,10,25,.09); }
.adm-cards--theme-light  { --color-surface-1:#f5f5f7; --color-text:#0a0a0a; --color-text-secondary:#5c5c66; --color-border:rgba(10,10,25,.08); }
.adm-cards--theme-dark   { --color-surface-1:#16161c; --color-text:#ffffff; --color-text-secondary:rgba(255,255,255,.72); --color-border:rgba(255,255,255,.12); --cs-surface:#16161c; }
.adm-cards--theme-black  { --color-surface-1:#0a0a0a; --color-text:#ffffff; --color-text-secondary:rgba(255,255,255,.68); --color-border:rgba(255,255,255,.1); --cs-surface:#0a0a0a; }
.adm-cards--theme-magenta{ --color-surface-1:var(--color-brand); --color-text:#ffffff; --color-text-secondary:rgba(255,255,255,.85); --color-border:rgba(255,255,255,.22); --cs-surface:var(--color-brand); }
.adm-cards--theme-magenta .adm-card__tag { background:rgba(255,255,255,.16); color:#fff; }
/* Size / density */
.adm-cards--size-compact .adm-card, .adm-cards--size-compact .cs-card__body, .adm-cards--size-compact .adm-card__body { padding: var(--space-4); }
.adm-cards--size-compact .adm-card__title, .adm-cards--size-compact .cs-card__title { font-size: var(--font-size-base); }
.adm-cards--size-large .adm-card, .adm-cards--size-large .adm-card__body { padding: var(--space-10); }
.adm-cards--size-large .adm-card__title { font-size: var(--font-size-xl); }

/* ============================================================
   Single Team Member profile (single-team.php)
   ============================================================ */
.adm-team-profile { padding-block: var(--space-16) var(--space-10); }
.adm-team-profile__crumbs { display:flex; gap:var(--space-2); align-items:center; font-size:var(--font-size-sm); color:var(--color-text-muted); margin-bottom:var(--space-8); flex-wrap:wrap; }
.adm-team-profile__crumbs a { color:var(--color-text-muted); text-decoration:none; }
.adm-team-profile__crumbs a:hover { color:var(--color-brand); }
.adm-team-profile__grid { display:grid; grid-template-columns: 340px 1fr; gap: var(--space-12); align-items:start; }
.adm-team-profile__media { position:sticky; top:var(--space-12); display:flex; flex-direction:column; gap:var(--space-4); }
.adm-team-profile__photo { width:100%; aspect-ratio:4/5; object-fit:cover; border-radius:var(--radius-xl); border:1px solid var(--color-border); box-shadow:var(--shadow-md); background:var(--color-surface-2); }
.adm-team-profile__photo--placeholder { display:flex; align-items:center; justify-content:center; font-size:var(--font-size-5xl); font-weight:500; color:var(--color-text-muted); }
.adm-team-profile__socials { display:flex; gap:var(--space-3); }
.adm-team-profile__social { display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; border-radius:var(--radius-lg); border:1px solid var(--color-border); background:var(--color-bg); color:var(--color-text); font-size:1.25rem; transition:background var(--duration-fast) ease, color var(--duration-fast) ease; }
.adm-team-profile__social:hover { background:var(--color-brand); color:#fff; border-color:var(--color-brand); }
.adm-team-profile__eyebrow { display:inline-block; font-size:var(--font-size-sm); letter-spacing:.08em; text-transform:uppercase; color:var(--color-brand); font-weight:500; margin-bottom:var(--space-3); }
.adm-team-profile__name { font-size:clamp(var(--font-size-3xl), 4vw, var(--font-size-5xl)); font-weight:500; line-height:1.05; margin:0 0 var(--space-2); }
.adm-team-profile__role { font-size:var(--font-size-xl); color:var(--color-text-muted); margin:0 0 var(--space-6); }
.adm-team-profile__facts { list-style:none; margin:0 0 var(--space-8); padding:var(--space-5) 0; display:flex; gap:var(--space-8); flex-wrap:wrap; border-block:1px solid var(--color-border); }
.adm-team-profile__facts li { display:flex; flex-direction:column; gap:2px; }
.adm-team-profile__facts span { font-size:var(--font-size-xs); text-transform:uppercase; letter-spacing:.06em; color:var(--color-text-muted); }
.adm-team-profile__facts strong { font-size:var(--font-size-base); font-weight:500; }
.adm-team-profile__bio { font-size:var(--font-size-lg); line-height:1.6; margin-bottom:var(--space-8); max-width:60ch; }
.adm-team-profile__group { margin-bottom:var(--space-6); }
.adm-team-profile__group-title { font-size:var(--font-size-sm); text-transform:uppercase; letter-spacing:.06em; color:var(--color-text-muted); font-weight:500; margin:0 0 var(--space-3); }
.adm-team-profile__chips { list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:var(--space-2); }
.adm-team-profile__chips li { font-size:var(--font-size-sm); padding:var(--space-2) var(--space-4); border-radius:var(--radius-full); border:1px solid var(--color-border); background:var(--color-surface-2); color:var(--color-text); }
.adm-team-profile__chips--brand li { border-color:color-mix(in srgb, var(--color-brand) 30%, transparent); background:color-mix(in srgb, var(--color-brand) 8%, transparent); color:var(--color-brand); }
.adm-team-cta__inner { text-align:center; max-width:640px; margin-inline:auto; }
.adm-team-cta__title { font-size:var(--font-size-3xl); font-weight:500; margin:0 0 var(--space-3); }
.adm-team-cta__text { color:var(--color-text-muted); font-size:var(--font-size-lg); margin:0 0 var(--space-6); }
.adm-team-cta__actions { display:flex; gap:var(--space-3); justify-content:center; flex-wrap:wrap; }
@media (max-width: 860px) {
  .adm-team-profile__grid { grid-template-columns:1fr; gap:var(--space-8); }
  .adm-team-profile__media { position:static; max-width:320px; }
}

/* ============================================================
   Blog cards pagination (cards block, post source)
   ============================================================ */
.adm-cards-more { display:flex; flex-direction:column; align-items:center; gap:var(--space-4); margin-top:var(--space-10); }
.adm-cards-more__btn.is-loading { opacity:.6; pointer-events:none; }

/* Optional newsletter band under a cards block (toggle: show_newsletter). */
.adm-cards-newsletter { display:flex; align-items:center; justify-content:space-between; gap:var(--space-8) var(--space-12); flex-wrap:wrap; margin-top:var(--space-12); padding:clamp(var(--space-6),4vw,var(--space-10)); border:1px solid var(--color-border); border-radius:var(--radius-xl); background:var(--color-surface-1); }
.adm-cards-newsletter__copy { flex:1 1 320px; min-width:min(100%,320px); }
.adm-cards-newsletter__title { font-size:var(--font-size-2xl); font-weight:500; margin:var(--space-2) 0 var(--space-2); }
.adm-cards-newsletter__text { color:var(--color-text-muted); margin:0; max-width:52ch; }
.adm-cards-newsletter__form { flex:1 1 360px; display:flex; gap:var(--space-3); flex-wrap:wrap; }
.adm-cards-newsletter__form input[type="email"] { flex:1 1 220px; min-width:0; padding:var(--space-3) var(--space-4); border:1px solid var(--color-border); border-radius:var(--radius-full,999px); background:var(--color-bg); color:var(--color-text); font-size:var(--font-size-base); }
.adm-cards-newsletter__form .adm-newsletter-hp { position:absolute; left:-9999px; width:1px; height:1px; }
/* CF7 newsletter (#18180): email + Subscribe share one row — space them, and the consent line. */
.adm-cards-newsletter__form .adm-form__row { display:flex; flex-direction:column; gap:var(--space-3); }
.adm-cards-newsletter__form .adm-form__consent { margin-top:var(--space-3); }
.adm-cards-more__sentinel { width:100%; height:1px; }
.adm-cards-more__status { font-size:var(--font-size-sm); color:var(--color-text-muted); min-height:1.2em; }
.adm-cards-more__pages { display:flex; flex-wrap:wrap; gap:var(--space-2); justify-content:center; }
.adm-cards-more__page { min-width:44px; height:44px; padding:0 var(--space-3); border-radius:var(--radius-md); border:1px solid var(--color-border); background:var(--color-bg); color:var(--color-text); font-size:var(--font-size-sm); font-weight:500; cursor:pointer; transition:background var(--duration-fast) ease, color var(--duration-fast) ease, border-color var(--duration-fast) ease; }
.adm-cards-more__page:hover { border-color:var(--color-brand); color:var(--color-brand); }
.adm-cards-more__page.is-active { background:var(--color-brand); border-color:var(--color-brand); color:#fff; }
.adm-cards-more__page[disabled] { opacity:.4; pointer-events:none; }
.adm-cards-more__nav { font-size:1.25rem; line-height:1; }
.adm-cards-more__ellipsis { min-width:32px; height:44px; display:inline-flex; align-items:flex-end; justify-content:center; padding-bottom:var(--space-2); color:var(--color-text-muted); user-select:none; }

/* ============================================================
   Single blog post — editorial layout (single.php)
   ============================================================ */
.adm-post { padding-block: 0 var(--space-16); }
.adm-post .container { max-width: 1120px; }

/* Top band — soft gradient mesh on a light base; the hero image straddles its bottom edge. */
/* Rounded glass-refraction hero card — full-width (breaks out of the reading container), with small
   page gutters and a wide cap; the article/sidebar below stay in the narrow .container.
   Bottom padding is an EMPTY straddle allowance the featured image overlaps into; keep the hero's
   negative margin <= this so the image never covers the title. */
/* Hero band = full width; featured image = content width (matches the reading container below). */
/* Match the site's full-width rounded card (.adm-section--card): 8px gutter, 20px radius. */
.adm-post__top { max-width: calc(100% - 16px); margin: var(--space-6) auto 0; border: 1px solid var(--color-border); border-radius: 20px; padding: var(--space-16) var(--space-8) 150px; overflow: hidden; }
.adm-post .adm-post__top--h-compact { margin-top: 0; }
.adm-post__top > .adm-post__head { position: relative; z-index: 2; }  /* above the glass layers */
.adm-post__top > .container { position: relative; z-index: 2; }  /* archive heads sit inside .container — keep above the glass layers */
.adm-post__hero.adm-post__hero--overlap { width: calc(100% - 2 * var(--space-6)); max-width: 1120px; margin-inline: auto; margin-top: -120px; position: relative; z-index: 1; }

/* Header — centred */
.adm-post__head { max-width: 1200px; margin-inline: auto; text-align: center; }
/* Category chip — a branded pill, not a plain link. */
.adm-post__eyebrow { display:inline-flex; align-items:center; gap:8px; font-size:var(--font-size-sm); font-weight:500; letter-spacing:.02em; color:var(--color-brand); text-decoration:none; margin-bottom:var(--space-5); padding:6px 14px; border-radius:var(--radius-full, 999px); background:color-mix(in srgb, var(--color-brand) 10%, transparent); border:1px solid color-mix(in srgb, var(--color-brand) 22%, transparent); transition:background var(--duration-fast) ease, border-color var(--duration-fast) ease; }
.adm-post__eyebrow::before { content:''; width:7px; height:7px; border-radius:50%; background:var(--color-brand); flex:none; }
.adm-post__eyebrow:hover { text-decoration:none; background:color-mix(in srgb, var(--color-brand) 18%, transparent); border-color:color-mix(in srgb, var(--color-brand) 40%, transparent); }
.adm-post__title { font-size:clamp(var(--font-size-3xl), 4vw, var(--font-size-5xl)); font-weight:500; line-height:1.12; text-wrap:balance; margin:0 0 var(--space-4); }
/* Hero alignment control (post_hero_align) drives text alignment; default is centre. */
.adm-post__head--a-left { text-align:left; margin-inline:0; }
.adm-post__head--a-right { text-align:right; }
.adm-post__deck { font-size:var(--font-size-lg); line-height:1.6; color:var(--color-text-muted); margin:0; }

/* Hero image */
.adm-post__hero { margin:0; }
.adm-post__hero-img { display:block; width:100%; height:auto; aspect-ratio:16/9; object-fit:cover; border-radius:var(--radius-xl); border:1px solid var(--color-border); box-shadow:var(--shadow-lg); }

/* Author + share bar */
.adm-post__meta { display:flex; align-items:center; justify-content:space-between; gap:var(--space-4); flex-wrap:wrap; margin:var(--space-6) 0 var(--space-10); padding-block:var(--space-5); border-block:1px solid var(--color-border); }
/* Meta bar under the title (in the hero card): centred, no dividers. */
.adm-post__meta--head { justify-content:center; gap:var(--space-6); margin:var(--space-8) 0 0; padding-block:0; border-block:0; }
.adm-post__author { display:flex; align-items:center; gap:var(--space-3); text-align:left; }
.adm-post__avatar { width:48px; height:48px; border-radius:50%; object-fit:cover; }
.adm-post__byline { display:flex; flex-direction:column; align-items:flex-start; text-align:left; }
.adm-post__author-name { font-weight:500; color:var(--color-text); }
.adm-post__author-meta { font-size:var(--font-size-sm); color:var(--color-text); }
/* Rich author byline: larger photo, role, short bio + profile link. Spans the full head width
   (same as the featured image below it), left-aligned. */
.adm-post__author--rich { align-items:flex-start; gap:var(--space-4); justify-content:flex-start; width:100%; }
.adm-post__author--rich .adm-post__byline { flex:1 1 auto; min-width:0; }
.adm-post__author--rich .adm-post__avatar { width:64px; height:64px; flex:0 0 auto; }
.adm-post__author-role { font-size:var(--font-size-sm); color:var(--color-brand); font-weight:500; }
.adm-post__author-bio { margin:var(--space-2) 0 0; font-size:var(--font-size-sm); line-height:1.55; color:var(--color-text-secondary); max-width:none; }
.adm-post__author-link { display:inline-flex; align-items:center; gap:.4em; margin-top:var(--space-2); font-size:var(--font-size-sm); font-weight:500; color:var(--color-brand); text-decoration:none; }
.adm-post__author-link:hover { text-decoration:underline; }
/* Share bar — sits beneath the featured image, right-aligned, above the article. */
.adm-post__share-row { display:flex; justify-content:flex-end; margin:var(--space-8) 0 var(--space-4); padding-bottom:var(--space-6); border-bottom:1px solid var(--color-border); }
.adm-post__share { display:flex; align-items:center; gap:var(--space-2); }
.adm-post__share-btn { display:inline-flex; align-items:center; gap:var(--space-2); height:40px; padding:0 var(--space-4); border:1px solid var(--color-border); border-radius:var(--radius-lg); background:var(--color-bg); color:var(--color-text); font-size:var(--font-size-sm); font-weight:500; cursor:pointer; text-decoration:none; transition:background var(--duration-fast) ease, border-color var(--duration-fast) ease, color var(--duration-fast) ease; }
.adm-post__share-btn--icon { padding:0; width:40px; justify-content:center; font-size:1.1rem; }
.adm-post__share-btn:hover { border-color:var(--color-brand); color:var(--color-brand); }
.adm-post__share-btn.is-copied { border-color:var(--color-brand); color:var(--color-brand); }

/* Two-column body */
.adm-post__layout { display:grid; grid-template-columns:260px minmax(0,1fr); gap:var(--space-12); align-items:start; }
.adm-post__sidebar { position:sticky; top:var(--space-12); display:flex; flex-direction:column; gap:var(--space-8); }

/* Sidebar search */
.adm-post__search { position:relative; }
.adm-post__search-ic { position:absolute; left:14px; top:0; bottom:0; display:flex; align-items:center; color:var(--color-text-muted); font-size:1.05rem; line-height:1; pointer-events:none; }
.adm-post__search input[type="search"] { width:100%; height:46px; padding:0 16px 0 44px; border:1px solid var(--color-border); border-radius:var(--radius-lg); background:var(--color-bg); color:var(--color-text); font:inherit; font-size:var(--font-size-sm); box-sizing:border-box; -webkit-appearance:none; appearance:none; }
.adm-post__search input[type="search"]::-webkit-search-decoration, .adm-post__search input[type="search"]::-webkit-search-cancel-button { -webkit-appearance:none; }
.adm-post__search input[type="search"]:focus { outline:none; border-color:var(--color-brand); }

/* Table of contents */
.adm-post__toc-title { display:block; font-size:var(--font-size-xs); text-transform:uppercase; letter-spacing:.06em; color:var(--color-text-muted); font-weight:500; margin-bottom:var(--space-3); }
.adm-post__toc-list { list-style:none; margin:0; padding:0; border-left:2px solid var(--color-border); }
.adm-post__toc-list li { margin:0; }
.adm-post__toc-list a { display:block; padding:var(--space-2) var(--space-4); margin-left:-2px; border-left:2px solid transparent; font-size:var(--font-size-sm); line-height:1.4; color:var(--color-text-muted); text-decoration:none; transition:color var(--duration-fast) ease, border-color var(--duration-fast) ease; }
.adm-post__toc-list a:hover { color:var(--color-text); }
.adm-post__toc-list a.is-active { color:var(--color-brand); border-left-color:var(--color-brand); font-weight:500; }
.adm-post__toc-list a.adm-post__toc-sub { padding-left:var(--space-6); font-size:var(--font-size-xs); }

/* Newsletter */
.adm-post__newsletter { padding:var(--space-5); border:1px solid var(--color-border); border-radius:var(--radius-xl); background:var(--color-surface-2); }
/* Sidebar conversion CTA — sticky lead capture while reading. */
.adm-post__cta { margin-top:var(--space-5); padding:var(--space-6); border-radius:var(--radius-xl); background:linear-gradient(155deg, color-mix(in srgb, var(--color-brand) 12%, var(--color-surface-1)) 0%, var(--color-surface-1) 70%); border:1px solid color-mix(in srgb, var(--color-brand) 22%, var(--color-border)); }
.adm-post__cta-title { display:block; font-size:var(--font-size-lg); font-weight:500; color:var(--color-text); margin-bottom:var(--space-2); }
.adm-post__cta-text { margin:0 0 var(--space-4); font-size:var(--font-size-sm); line-height:1.5; color:var(--color-text-secondary); }
.adm-post__cta .btn { width:100%; justify-content:center; }
.adm-post__newsletter-title { display:block; font-weight:500; margin-bottom:var(--space-3); }
.adm-post__newsletter-form { display:flex; flex-direction:column; gap:var(--space-2); }
.adm-post__newsletter-form input { height:44px; padding:0 var(--space-3); border:1px solid var(--color-border); border-radius:var(--radius-lg); background:var(--color-bg); color:var(--color-text); font:inherit; font-size:var(--font-size-sm); }
.adm-post__newsletter-form input:focus { outline:none; border-color:var(--color-brand); }
.adm-post__newsletter-form .btn { width:100%; justify-content:center; }

/* Article body / prose polish */
.adm-post__body { max-width:none; font-size:var(--font-size-lg); line-height:1.7; color:var(--color-text); }
.adm-post__body > h2 { font-size:var(--font-size-xl); font-weight:500; line-height:1.3; margin:var(--space-9) 0 var(--space-3); scroll-margin-top:120px; }
.adm-post__body > h3 { font-size:var(--font-size-lg); font-weight:500; line-height:1.35; margin:var(--space-7) 0 var(--space-3); scroll-margin-top:120px; }
.adm-post__body p { margin:0 0 var(--space-5); }
/* House style: no bold. Imported content uses <b>/<span> at 700 and inline 600/700 for
   emphasis and pseudo-subheadings — pull all of it down to medium (500) across every post. */
.adm-post__body strong, .adm-post__body b, .adm-post__body b span, .adm-post__body strong span { font-weight:500; }
.adm-post__body [style*="font-weight: 700"], .adm-post__body [style*="font-weight:700"],
.adm-post__body [style*="font-weight: 600"], .adm-post__body [style*="font-weight:600"],
.adm-post__body [style*="font-weight: bold"], .adm-post__body [style*="font-weight:bold"] { font-weight:500 !important; }
.adm-post__body a { color:var(--color-brand); text-decoration:underline; text-underline-offset:2px; }
.adm-post__body ul, .adm-post__body ol { margin:0 0 var(--space-5) var(--space-5); display:flex; flex-direction:column; gap:var(--space-2); }
.adm-post__body img { width:100%; height:auto; border-radius:var(--radius-xl); border:1px solid var(--color-border); margin:var(--space-6) 0; }
.adm-post__body figure { margin:var(--space-6) 0; }
.adm-post__body figcaption { font-size:var(--font-size-sm); color:var(--color-text-muted); text-align:center; margin-top:var(--space-2); }
.adm-post__body blockquote { margin:var(--space-6) 0; padding:var(--space-2) 0 var(--space-2) var(--space-6); border-left:3px solid var(--color-brand); font-size:var(--font-size-xl); line-height:1.5; font-weight:500; color:var(--color-text); }
.adm-post__faqs { margin-top:var(--space-12); }
.adm-post__faqs > h2 { font-size:var(--font-size-2xl); font-weight:500; margin-bottom:var(--space-6); }

/* Article tags */
.adm-post__tags { display:flex; flex-wrap:wrap; align-items:center; gap:var(--space-2); margin-top:var(--space-10); padding-top:var(--space-6); border-top:1px solid var(--color-border); }
.adm-post__tags-label { font-size:var(--font-size-xs); text-transform:uppercase; letter-spacing:.06em; color:var(--color-text-muted); font-weight:500; margin-right:var(--space-2); }
.adm-post__tag { display:inline-flex; align-items:center; font-size:var(--font-size-sm); padding:var(--space-2) var(--space-4); border-radius:var(--radius-full); border:1px solid var(--color-border); background:var(--color-surface-2); color:var(--color-text); text-decoration:none; transition:background var(--duration-fast) ease, color var(--duration-fast) ease, border-color var(--duration-fast) ease; }
.adm-post__tag:hover { border-color:var(--color-brand); background:color-mix(in srgb, var(--color-brand) 8%, transparent); color:var(--color-brand); }

/* Prev / next — with featured images */
.adm-post__nav { display:grid; grid-template-columns:1fr 1fr; gap:var(--space-6); margin-top:var(--space-16); padding-top:var(--space-8); border-top:1px solid var(--color-border); }
.adm-post__nav-link { display:flex; align-items:center; gap:var(--space-4); text-decoration:none; color:var(--color-text); border:1px solid var(--color-border); border-radius:var(--radius-xl); padding:var(--space-3); transition:border-color var(--duration-fast) ease, background var(--duration-fast) ease; }
.adm-post__nav-link:hover { border-color:var(--color-brand); background:var(--color-surface-2); }
.adm-post__nav-cell--next .adm-post__nav-link { text-align:right; }
.adm-post__nav-thumb { flex:0 0 84px; }
.adm-post__nav-thumb img { display:block; width:84px; height:64px; object-fit:cover; border-radius:var(--radius-md); }
.adm-post__nav-text { flex:1; min-width:0; display:flex; flex-direction:column; gap:var(--space-1); }
.adm-post__nav-label { display:inline-flex; align-items:center; gap:var(--space-2); font-size:var(--font-size-xs); text-transform:uppercase; letter-spacing:.06em; color:var(--color-text-muted); }
.adm-post__nav-cell--next .adm-post__nav-label { flex-direction:row-reverse; align-self:flex-end; }
.adm-post__nav-title { font-size:var(--font-size-base); font-weight:500; line-height:1.35; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.adm-post__nav-link:hover .adm-post__nav-title { color:var(--color-brand); }

@media (max-width: 900px) {
  .adm-post__layout { grid-template-columns:1fr; gap:var(--space-8); }
  .adm-post__sidebar { position:static; order:2; }
  .adm-post__body { order:1; }
  .adm-post__toc { display:none; } /* TOC is desktop-only; on mobile it's noise */
  .adm-post__nav { grid-template-columns:1fr; }
  .adm-post__nav-cell--next .adm-post__nav-link { text-align:left; flex-direction:row-reverse; }
  .adm-post__nav-cell--next .adm-post__nav-label { flex-direction:row; align-self:flex-start; }
}

/* ============================================================
   Legacy imported-content styling — maps old Bootstrap/theme classes in blog post bodies
   (single.php .adm-post__body) to the ADM brand. Fixes ~235 posts at once with no content edits.
   Stylesheet !important beats the non-important inline styles the old CMS left behind.
   ============================================================ */
/* Old "Book A Meeting" CTA box */
.adm-post__body .cta-gradient {
  background: linear-gradient(120deg, var(--color-brand) 0%, #ff6a3d 100%) !important;
  border-radius: var(--radius-xl) !important;
  padding: var(--space-8) !important;
  margin: var(--space-8) 0 !important;
}
.adm-post__body .cta-gradient .d-lg-flex { display:flex; align-items:center; justify-content:space-between; gap:var(--space-6); flex-wrap:wrap; }
.adm-post__body .cta-gradient h2, .adm-post__body .cta-gradient .cta-header { color:#fff !important; margin:0; font-size:var(--font-size-2xl); font-weight:500; line-height:1.15; }
.adm-post__body .cta-gradient .text-yellow { color:#ffd400 !important; }
.adm-post__body .cta-gradient .btn, .adm-post__body .cta-gradient .btn-primary, .adm-post__body .cta-gradient a.text-black {
  display:inline-flex; align-items:center; background:#fff !important; color:var(--color-brand) !important;
  padding:var(--space-3) var(--space-5); border-radius:var(--radius-lg); font-weight:500; text-decoration:none; white-space:nowrap; border:0;
}
.adm-post__body .cta-gradient .btn:hover, .adm-post__body .cta-gradient .btn-primary:hover { background:#0a0a0a !important; color:#fff !important; }

/* Generic legacy utility classes that may appear in body copy */
.adm-post__body .d-lg-flex, .adm-post__body .d-flex { display:flex; gap:var(--space-4); flex-wrap:wrap; }
.adm-post__body .text-center { text-align:center; }

/* Tables in imported content (~150 posts) */
.adm-post__body table { width:100%; border-collapse:collapse; margin:var(--space-6) 0; font-size:var(--font-size-base); display:block; overflow-x:auto; }
.adm-post__body table th, .adm-post__body table td { border:1px solid var(--color-border); padding:var(--space-3) var(--space-4); text-align:left; vertical-align:top; }
.adm-post__body table th { background:var(--color-surface-2); font-weight:500; }
.adm-post__body table tr:nth-child(even) td { background:color-mix(in srgb, var(--color-surface-2) 45%, transparent); }

/* Embeds (iframes / videos) responsive */
.adm-post__body iframe, .adm-post__body video { max-width:100%; border:0; border-radius:var(--radius-lg); }
.adm-post__body .wp-video, .adm-post__body .wp-block-embed { max-width:100%; margin:var(--space-6) 0; }

/* ============================================================
   Blog archive (archive.php) — matches /insights/ layout
   ============================================================ */
.adm-post-archive { padding-block: 0 var(--space-16); }
.adm-post-archive .container:not(.container--full):not(.container--wide):not(.container--narrow) { max-width: 1120px; }
.adm-post-archive__body { padding-top: var(--space-12); }
.adm-post-archive__body--sectioned { padding-top: 0; }        /* section wrapper (archive-works) already supplies vertical spacing */

.adm-404 { min-height: 60vh; display: flex; align-items: center; }   /* 404 vertical-centre (was inline) */

/* ── Static-section card-colour controls (ADM Control → Static Sections: team articles + case-study archive) ── */
.adm-card--bg-white   { background: #fff; }
.adm-card--bg-glass   { background: var(--glass-bg-strong); backdrop-filter: blur(12px) saturate(140%); -webkit-backdrop-filter: blur(12px) saturate(140%); }
.adm-card--bg-dark    { background: var(--color-ink, #0a0a0a); border-color: rgba(255,255,255,.12); }
.adm-card--bg-black   { background: #000; border-color: rgba(255,255,255,.12); }
.adm-card--bg-magenta { background: var(--color-brand, #e5006d); border-color: transparent; }
.adm-card--bg-dark, .adm-card--bg-black, .adm-card--bg-magenta { color: #fff; }
:is(.adm-card--bg-dark, .adm-card--bg-black, .adm-card--bg-magenta) :is(.adm-card__title, .adm-card__text, .adm-card__date, .adm-card__meta, .adm-card__tag, .adm-card__link, .cs-card__title, .cs-card__excerpt, .cs-card__meta) { color: #fff; }
:is(.adm-card--bg-dark, .adm-card--bg-black, .adm-card--bg-magenta) .adm-card__date { opacity: .8; }
.adm-post__eyebrow--static { cursor: default; }               /* archive eyebrow is a label, not a link */
.adm-post__eyebrow--static:hover { text-decoration: none; }
.adm-post-archive__empty { text-align: center; color: var(--color-text-muted); padding: var(--space-12) 0; }
/* Numbered pagination — same pill look as the Insights pager (.adm-cards-more__page) */
.adm-post-archive__pager { display: flex; flex-wrap: wrap; gap: var(--space-2); justify-content: center; margin-top: var(--space-12); }
.adm-post-archive__pager .page-numbers { min-width: 44px; height: 44px; display: inline-flex; align-items: center; justify-content: center; padding: 0 var(--space-3); border-radius: var(--radius-md); border: 1px solid var(--color-border); background: var(--color-bg); color: var(--color-text); font-size: var(--font-size-sm); font-weight: 500; text-decoration: none; transition: background var(--duration-fast) ease, color var(--duration-fast) ease, border-color var(--duration-fast) ease; }
.adm-post-archive__pager a.page-numbers:hover { border-color: var(--color-brand); color: var(--color-brand); }
.adm-post-archive__pager .page-numbers.current { background: var(--color-brand); border-color: var(--color-brand); color: #fff; }
.adm-post-archive__pager .page-numbers.dots { border: 0; background: transparent; min-width: 24px; color: var(--color-text-muted); }

/* ============================================================
   Awards page (page-awards.php) — sticky event rail + year wins
   ============================================================ */
.adm-awardspage { padding-block: 0 var(--space-16); }
.adm-awards { display: grid; grid-template-columns: 260px minmax(0,1fr); gap: var(--space-12); align-items: start; padding-top: var(--space-12); }
.adm-awards__rail { position: sticky; top: var(--space-12); display: flex; flex-direction: column; gap: var(--space-3); }
.adm-awards__rail-title { font-family: var(--font-mono); font-size: var(--font-size-xs); text-transform: uppercase; letter-spacing: .08em; color: var(--color-text-muted); }
.adm-awards__rail-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; border-left: 1px solid var(--color-border); }
.adm-awards__rail-link { display: block; padding: 8px 14px; margin-left: -1px; border-left: 2px solid transparent; color: var(--color-text-muted); text-decoration: none; font-size: var(--font-size-sm); line-height: 1.3; transition: color var(--duration-fast) ease, border-color var(--duration-fast) ease; }
.adm-awards__rail-link:hover { color: var(--color-text); }
.adm-awards__rail-link.is-active { color: var(--color-brand); border-left-color: var(--color-brand); font-weight: 500; }
.adm-awards__list { display: flex; flex-direction: column; gap: var(--space-8); }
.adm-awards__event { background: var(--color-surface-2); border: 1px solid var(--color-border); border-radius: var(--radius-xl); padding: var(--space-8); scroll-margin-top: 100px; }
.adm-awards__event-head { display: flex; align-items: center; gap: var(--space-4); margin-bottom: var(--space-6); }
.adm-awards__event-logo { flex: 0 0 auto; width: 72px; height: 72px; display: flex; align-items: center; justify-content: center; }
.adm-awards__event-img { max-width: 100%; max-height: 72px; width: auto; height: auto; object-fit: contain; }
.adm-awards__event-title { font-size: var(--font-size-xl); font-weight: 500; margin: 0; }
.adm-awards__years { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: var(--space-5); }
.adm-awards__win { display: flex; flex-direction: column; gap: var(--space-4); padding: var(--space-6); background: var(--color-surface-1); border: 1px solid var(--color-border); border-radius: var(--radius-lg); }
.adm-awards__win-logo { display: flex; align-items: center; justify-content: center; height: 140px; padding: var(--space-5); background: var(--color-surface-2); border-radius: var(--radius-md); }
.adm-awards__win-img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; }
.adm-awards__win-meta { display: flex; flex-direction: column; gap: 4px; }
.adm-awards__win-title { font-size: var(--font-size-lg); font-weight: 500; line-height: 1.25; color: var(--color-text); }
.adm-awards__win-sub { font-size: var(--font-size-sm); color: var(--color-text-secondary); }
.adm-awards__win-inner { display: flex; flex-direction: column; gap: var(--space-4); height: 100%; text-decoration: none; color: inherit; }
.adm-awards__win-cta { display: inline-flex; align-items: center; gap: 6px; margin-top: var(--space-2); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium, 500); color: var(--color-brand); }
.adm-awards__win--link { transition: border-color var(--duration-fast) ease, box-shadow var(--duration-fast) ease, transform var(--duration-fast) ease; }
.adm-awards__win--link:hover { border-color: color-mix(in srgb, var(--color-brand) 45%, transparent); box-shadow: var(--shadow-md); transform: translateY(-2px); }
.adm-awards__stats { display: flex; flex-wrap: wrap; gap: var(--space-5); justify-content: center; margin-top: var(--space-6); }
.adm-post__head--a-left .adm-awards__stats  { justify-content: flex-start; }   /* stats follow hero alignment */
.adm-post__head--a-right .adm-awards__stats { justify-content: flex-end; }
.adm-awards__stat { font-size: var(--font-size-sm); color: var(--color-text-secondary); }
.adm-awards__stat strong { color: var(--color-brand); font-weight: 600; }
@media (max-width: 860px) {
  .adm-awards { grid-template-columns: 1fr; }
  .adm-awards__rail { position: static; }
  .adm-awards__rail-list { flex-direction: row; flex-wrap: wrap; border-left: 0; }
  .adm-awards__rail-link { border-left: 0; border: 1px solid var(--color-border); border-radius: 999px; margin: 0; }
  .adm-awards__rail-link.is-active { border-color: var(--color-brand); }
}

/* Proof / case-study archive follows the services-hub hero: left-aligned, solid content-colour heading (no gradient sweep). */
.adm-post-archive--works .adm-post__title { background: none; background-image: none; -webkit-text-fill-color: var(--color-text); color: var(--color-text); animation: none; }
.adm-post-archive--works .adm-card-filters { justify-content: flex-start; }

/* ── Single vacancy (careers) ───────────────────────────────────────────── */
.adm-vacancy-hero .adm-vacancy__inner { max-width: 900px; }
.adm-vacancy-hero .section-header__title { margin-top: var(--space-2); }
.adm-vacancy__deck { font-size: var(--font-size-lg); color: var(--color-text-secondary); max-width: 60ch; margin-top: var(--space-4); }
/* Meta chips (hero) */
.adm-vacancy__chips { list-style: none; margin: var(--space-8) 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--space-3); }
.adm-vacancy__chips li { display: inline-flex; align-items: center; gap: var(--space-2); padding: var(--space-2) var(--space-4); border: 1px solid var(--color-border); border-radius: var(--radius-full); background: var(--glass-bg-strong, var(--color-surface-1)); backdrop-filter: blur(8px); font-size: var(--font-size-sm); font-weight: 500; }
.adm-vacancy__chips .adm-vacancy__chip-k { font-family: var(--font-mono); font-size: var(--font-size-xs); text-transform: uppercase; letter-spacing: .05em; color: var(--color-text-muted); }
.adm-vacancy__cta { display: flex; flex-wrap: wrap; gap: var(--space-3); margin-top: var(--space-8); }
/* Two-column body */
.adm-vacancy__layout { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: var(--space-12); align-items: start; }
.adm-vacancy__main .prose { max-width: 68ch; }
.adm-vacancy__aside { position: sticky; top: calc(var(--header-height, 88px) + var(--space-6)); display: flex; flex-direction: column; gap: var(--space-5); }
.adm-vacancy__card { border: 1px solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-surface-1); padding: var(--space-8); }
.adm-vacancy__summary h2 { font-size: var(--font-size-base); font-weight: 500; margin: 0 0 var(--space-5); }
.adm-vacancy__summary dl { display: grid; grid-template-columns: 1fr; gap: var(--space-4); margin: 0; }
.adm-vacancy__summary dt { font-family: var(--font-mono); font-size: var(--font-size-xs); text-transform: uppercase; letter-spacing: .05em; color: var(--color-text-muted); margin: 0; }
.adm-vacancy__summary dd { margin: 2px 0 0; font-weight: 500; color: var(--color-text); }
.adm-vacancy__summary .btn { width: 100%; justify-content: center; margin-top: var(--space-6); }
.adm-vacancy__back { display: inline-flex; align-items: center; gap: var(--space-2); font-size: var(--font-size-sm); color: var(--color-text-muted); text-decoration: none; }
.adm-vacancy__back:hover { color: var(--color-brand); }
/* Newsletter card (sidebar) */
.adm-vacancy__news h3 { font-size: var(--font-size-base); font-weight: 500; margin: 0 0 var(--space-2); }
.adm-vacancy__news p { font-size: var(--font-size-sm); color: var(--color-text-secondary); margin: 0 0 var(--space-4); }
.adm-vacancy__news .wpcf7-form-control-wrap, .adm-vacancy__news input[type="email"] { width: 100%; }
/* Apply section — divider at top, content-left (sticky) / form-right */
.adm-vacancy__apply { border-top: 1px solid var(--color-border); }
.adm-vacancy__apply-grid { display: grid; grid-template-columns: minmax(0, 400px) minmax(0, 1fr); gap: var(--space-12); align-items: start; }
.adm-vacancy__apply-copy { position: sticky; top: calc(var(--header-height, 88px) + var(--space-6)); }
.adm-vacancy__apply-copy .section-header__desc { margin-top: var(--space-4); }
.adm-vacancy__form { margin: 0; }
/* Make every field fill the form container */
.adm-vacancy__form .wpcf7-form-control-wrap, .adm-vacancy__form input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]), .adm-vacancy__form select, .adm-vacancy__form textarea { width: 100%; }
@media (max-width: 920px) {
	.adm-vacancy__layout, .adm-vacancy__apply-grid { grid-template-columns: 1fr; gap: var(--space-8); }
	.adm-vacancy__aside, .adm-vacancy__apply-copy { position: static; }
}

/* ── HTML sitemap ── */
.adm-sitemap__intro { max-width: 760px; margin-bottom: var(--space-10); }
.adm-sitemap__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: var(--space-8) var(--space-6); }
.adm-sitemap__h { font-size: var(--font-size-lg); font-weight: 500; margin: 0 0 var(--space-4); padding-bottom: var(--space-3); border-bottom: 1px solid var(--color-border); }
.adm-sitemap__list, .adm-sitemap__sub { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--space-2); }
.adm-sitemap__sub { margin: var(--space-2) 0 var(--space-2) var(--space-4); padding-left: var(--space-4); border-left: 1px solid var(--color-border); }
.adm-sitemap__list a { color: var(--color-text); text-decoration: none; transition: color var(--duration-fast) ease; }
.adm-sitemap__list a:hover { color: var(--color-brand); }
.adm-sitemap__sep { font-family: var(--font-mono); font-size: var(--font-size-xs); text-transform: uppercase; letter-spacing: .06em; color: var(--color-text-muted); margin-top: var(--space-4); }

/* ── Legal / terms document download list ── */
.adm-doc-list { list-style: none; margin: var(--space-6) 0 0; padding: 0; display: flex; flex-direction: column; gap: var(--space-3); }
/* Beat .prose ul/li defaults (disc bullets + left padding) when the list is inside rich content. */
.prose .adm-doc-list { padding-left: 0; list-style: none; }
.prose .adm-doc-list li { list-style: none; margin-bottom: 0; color: inherit; }
/* Cancel the .prose "chasing underline" link treatment (background-image + padding-bottom:1px) on the
   card-style download items — it broke their vertical padding and drew a stray underline. (0,3,1) wins. */
.prose .adm-doc-list a.adm-doc-list__item { padding: var(--space-5) var(--space-6); background-image: none; }
.adm-doc-list__item { display: flex; align-items: center; gap: var(--space-3); padding: var(--space-5) var(--space-6); border: 1px solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-surface-1); color: var(--color-text); text-decoration: none; font-weight: 500; transition: border-color var(--duration-fast) ease, transform var(--duration-fast) ease; }
.adm-doc-list__item::before { content: "PDF"; font-family: var(--font-mono); font-size: var(--font-size-xs); font-weight: 600; letter-spacing: .05em; color: var(--color-brand); border: 1px solid var(--color-brand); border-radius: var(--radius-sm); padding: 2px 6px; flex: none; }
.adm-doc-list__item:hover { border-color: var(--color-brand); transform: translateY(-1px); }
/* Legal prose: keep long policies readable + tables scrollable */
.prose p:empty { display: none; } /* drop stray empty <p> (ACF wysiwyg/wpautop) that add gaps in long content */
.prose table { width: 100%; border-collapse: collapse; margin: var(--space-5) 0; font-size: var(--font-size-sm); }
.prose thead td, .prose tr:first-child td, .prose th { background: var(--color-surface-2); font-weight: 500; }
.prose th, .prose td { border: 1px solid var(--color-border); padding: var(--space-3); text-align: left; vertical-align: top; }
.prose td a { word-break: break-word; }
/* Long tables (e.g. cookie declaration) scroll horizontally on narrow viewports instead of forcing page overflow. */
@media (max-width: 720px) { .prose table { display: block; overflow-x: auto; white-space: normal; } }

/* Vacancy (careers) card meta line */
.adm-vacancy-card__meta { font-family: var(--font-mono); font-size: var(--font-size-xs); text-transform: uppercase; letter-spacing: .04em; color: var(--color-text-muted); margin: var(--space-1) 0 var(--space-3); }
.adm-card--vacancy { text-decoration: none; }

/* Cards block: CTA positioned after the intro — give it room above (from intro) and below (before cards). */
.adm-cards__intro-cta { margin-bottom: var(--space-10); }
.adm-cards__intro-cta .adm-block-cta { margin-top: var(--space-6); }

/* Feature grid card: explicit CTA button (card stays a div, not a whole-card link) */
.adm-feature__cta { display: inline-flex; align-items: center; gap: var(--space-2); margin-top: var(--space-5); align-self: flex-start; }

/* Hero heading → intro breathing room (homepage hero_home + hero_compact) */
.adm-hero-home__title + .adm-hero-home__content,
.adm-hero-home__sub + .adm-hero-home__content { margin-top: var(--space-6); }
.adm-hero-compact .section-header__title + .section-header__sub,
.adm-hero-compact .section-header__title + .section-header__desc,
.adm-hero-compact .section-header__sub + .section-header__desc { margin-top: var(--space-5); }

/* Minimal/flat blog hero image: centre it like the overlap variant (was left-aligned + overflowing). */
.adm-post__hero.adm-post__hero--flat { width: calc(100% - 2 * var(--space-6)); max-width: 1120px; margin-inline: auto; }

/* Home hero: vertical alignment of the left copy column (align-self within the split grid) + breadcrumbs */
.adm-hero-home__copy--v-top { align-self: flex-start; }
.adm-hero-home__copy--v-bottom { align-self: flex-end; }
.adm-hero-home__copy--v-center { align-self: center; }
.adm-hero-home__copy .adm-breadcrumbs { margin-bottom: var(--space-4); }

/* ─────────────────────────────────────────────────────────────────────────
   Team member profile — EEAT rebuild (single-team.php)
   ───────────────────────────────────────────────────────────────────────── */
.adm-team-hero { display:grid; grid-template-columns: 320px 1fr; gap: var(--space-12); align-items:center; }
.adm-team-hero__media { display:flex; flex-direction:column; gap:var(--space-4); }
.adm-team-hero__photo { width:100%; aspect-ratio:4/5; object-fit:cover; border-radius:var(--radius-xl); border:1px solid var(--color-border); box-shadow:var(--shadow-md); background:var(--color-surface-2); }
.adm-team-hero__photo--placeholder { display:flex; align-items:center; justify-content:center; font-size:var(--font-size-5xl); font-weight:500; color:var(--color-text-muted); }
.adm-team-hero__socials { display:flex; gap:var(--space-3); }
.adm-team-hero__social { display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; border-radius:var(--radius-lg); border:1px solid var(--color-border); background:var(--color-bg); color:var(--color-text); font-size:1.25rem; transition:background var(--duration-fast) ease, color var(--duration-fast) ease, border-color var(--duration-fast) ease; }
.adm-team-hero__social:hover { background:var(--color-brand); color:#fff; border-color:var(--color-brand); }
.adm-team-hero__name { font-size:clamp(var(--font-size-4xl), 5vw, var(--font-size-6xl)); font-weight:500; line-height:1.03; margin:var(--space-2) 0 var(--space-2); }
.adm-team-hero__role { font-size:var(--font-size-xl); color:var(--color-text-muted); margin:0 0 var(--space-6); }
.adm-team-hero__stats { list-style:none; margin:0 0 var(--space-8); padding:var(--space-5) 0; display:flex; gap:var(--space-8); flex-wrap:wrap; border-block:1px solid var(--color-border); }
.adm-team-hero__stats li { display:flex; flex-direction:column; gap:2px; }
.adm-team-hero__stats strong { font-size:var(--font-size-2xl); font-weight:500; line-height:1; color:var(--color-brand); }
.adm-team-hero__stats span { font-size:var(--font-size-xs); text-transform:uppercase; letter-spacing:.06em; color:var(--color-text-muted); }
.adm-team-hero__ctas { display:flex; gap:var(--space-3); flex-wrap:wrap; }
/* When a hero pull-quote is set, the intro splits into body (left) + quote (right) to use the space. */
.adm-team-hero__intro--has-quote { display:grid; grid-template-columns: minmax(0,1.25fr) minmax(0,1fr); gap: clamp(var(--space-12), 6vw, var(--space-20)); align-items:center; }
.adm-team-hero__quote { position:relative; margin:0; padding-left:var(--space-8); border-left:3px solid var(--color-brand); font-size:clamp(var(--font-size-xl), 1.9vw, var(--font-size-3xl)); line-height:1.4; font-weight:500; color:var(--color-text); }
.adm-team-hero__quote-mark { position:absolute; left:6px; top:-.35em; font-family:Georgia,'Times New Roman',serif; font-size:3.4em; line-height:1; color:color-mix(in srgb, var(--color-brand) 26%, transparent); pointer-events:none; }
@media (max-width: 980px) { .adm-team-hero__intro--has-quote { grid-template-columns:1fr; gap:var(--space-8); } }

/* Content blocks (experience / role / recognition / values) */
.adm-team-block__prose { font-size:var(--font-size-lg); line-height:1.7; margin-top:var(--space-6); }
.adm-team-block__brands { margin-top:var(--space-8); }
.adm-team-block__brands-label { display:block; font-size:var(--font-size-xs); text-transform:uppercase; letter-spacing:.06em; color:var(--color-text-muted); margin-bottom:var(--space-3); }

/* Shared chips */
.adm-team-chips { list-style:none; display:flex; flex-wrap:wrap; gap:var(--space-2); margin:0; padding:0; }
.adm-team-chips li { padding:8px 16px; border-radius:var(--radius-full,999px); background:var(--color-surface-1); border:1px solid var(--color-border); font-size:var(--font-size-sm); }
.adm-team-chips--brand li { background:color-mix(in srgb, var(--color-brand) 10%, transparent); border-color:color-mix(in srgb, var(--color-brand) 22%, transparent); color:var(--color-brand); }

/* Expertise two-col — top-aligned panels, modest titles (NOT giant h2s) */
.adm-team-expertise .section-header { margin-bottom:var(--space-8); }
.adm-team-expertise__grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:var(--space-6); align-items:stretch; }
.adm-team-expertise__col { padding:clamp(var(--space-6),3vw,var(--space-8)); background:var(--color-surface-1); border:1px solid var(--color-border); border-radius:var(--radius-xl); }
.adm-team-expertise__title { font-size:var(--font-size-lg); font-weight:500; margin:0 0 var(--space-5); padding-bottom:var(--space-3); border-bottom:1px solid var(--color-border); color:var(--color-text); }
.adm-team-expertise__title::before { content:""; display:inline-block; width:8px; height:8px; border-radius:999px; background:var(--color-brand); margin-right:.6em; vertical-align:middle; }

/* Featured In logo strip */
.adm-team-featured__grid { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:var(--space-8) var(--space-12); margin-top:var(--space-6); }
.adm-team-featured__item { display:inline-flex; align-items:center; }
.adm-team-featured__logo { max-height:38px; width:auto; opacity:.65; filter:grayscale(1); transition:opacity var(--duration-fast) ease, filter var(--duration-fast) ease; }
.adm-team-featured__item:hover .adm-team-featured__logo { opacity:1; filter:none; }
/* Featured-in marquee: bigger logos than the default 46px client marquee. */
.adm-team-featured__marquee .adm-logos__img { max-height:80px; }
.adm-team-featured__marquee .adm-logos__item { padding-inline:var(--space-4); }

/* Connect / closing CTA */
/* Connect CTA now reuses the .adm-cta / .adm-cta--form-split look; only the meta row is bespoke. */
.adm-team-connect__meta { display:flex; align-items:center; gap:var(--space-4); flex-wrap:wrap; margin-top:var(--space-5); }
.adm-cta--form-split .adm-team-connect__meta { justify-content:flex-start; }
.adm-team-connect__role { font-family:var(--font-mono, monospace); font-size:var(--font-size-sm); letter-spacing:.04em; text-transform:uppercase; color:var(--color-text-muted); }
.adm-team-connect__li { display:inline-flex; align-items:center; gap:.4em; font-weight:500; color:var(--color-brand); text-decoration:none; }
.adm-team-connect__li:hover { text-decoration:underline; }
.adm-team-connect__li svg { width:1.1em; height:1.1em; }

@media (max-width: 860px) {
  .adm-team-hero { grid-template-columns:1fr; gap:var(--space-8); }
  .adm-team-hero__media { max-width:280px; }
}

/* Testimonial CPT extras — LinkedIn + linked case study on cards */
.adm-tcard__links { display:flex; align-items:center; gap:var(--space-4); margin-top:var(--space-4); padding-top:var(--space-4); border-top:1px solid var(--color-border); }
.adm-tcard__cs { font-size:var(--font-size-sm); font-weight:500; color:var(--color-brand); text-decoration:none; display:inline-flex; align-items:center; gap:6px; }
.adm-tcard__cs:hover { text-decoration:underline; }
.adm-tcard__li, .adm-tspot__li { display:inline-flex; align-items:center; justify-content:center; width:34px; height:34px; border-radius:var(--radius-md,8px); border:1px solid var(--color-border); color:var(--color-text-muted); margin-left:auto; flex:none; transition:background var(--duration-fast) ease, color var(--duration-fast) ease, border-color var(--duration-fast) ease; }
.adm-tcard__li:hover, .adm-tspot__li:hover { color:#fff; background:var(--color-brand); border-color:var(--color-brand); }
.adm-tspot__li { margin-top:var(--space-3); }

/* Hero intro/deck legibility on glass heroes (grey → ink) */
.adm-section--glass .adm-post__deck, .adm-awards-hero .adm-post__deck, .adm-section--glass .section-header__desc { color: var(--color-text); }

/* Team profile — wide image + text feature rows (Experience / Role / Recognition / Values) */
.adm-team-feature__grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(var(--space-8), 5vw, var(--space-16)); align-items: center; }
.adm-team-feature--rev .adm-team-feature__media { order: 2; }
.adm-team-feature__img { width: 100%; height: auto; border-radius: var(--radius-xl); border: 1px solid var(--color-border); box-shadow: var(--shadow-md); display: block; aspect-ratio: 4 / 3; object-fit: cover; }
.adm-team-feature__body .section-header__title { margin: var(--space-2) 0 var(--space-4); }
.adm-team-feature__prose { font-size: var(--font-size-lg); line-height: 1.7; }
.adm-team-feature__brands { margin-top: var(--space-6); }
.adm-team-feature--noimg .adm-team-feature__grid { grid-template-columns: 1fr; max-width: 760px; margin-inline: auto; }

/* ── Stat-led + pull-quote treatment ── */
.adm-team-feature__media { position: relative; }
/* Stat card floats over the supporting image (bottom, on the body-facing edge). */
.adm-team-feature__statcard {
  position: absolute; bottom: var(--space-5); left: var(--space-5);
  display: flex; flex-direction: column; gap: 2px;
  padding: var(--space-4) var(--space-5); border-radius: var(--radius-lg);
  background: var(--color-surface-1); border: 1px solid var(--color-border);
  box-shadow: var(--shadow-lg); backdrop-filter: blur(6px);
}
.adm-team-feature--rev .adm-team-feature__statcard { left: auto; right: var(--space-5); }
.adm-team-feature__statval { font-family: var(--font-mono, monospace); font-weight: 500; font-size: clamp(1.9rem, 3.4vw, 2.9rem); line-height: 1; letter-spacing: -.02em; color: var(--color-brand); }
.adm-team-feature__statlabel { font-size: var(--font-size-sm); color: var(--color-text-muted); max-width: 15ch; }
/* When there's no image, the stat becomes the whole media column as a big panel. */
.adm-team-feature__media--solostat { display: flex; }
.adm-team-feature__media--solostat .adm-team-feature__statcard {
  position: static; width: 100%; align-items: flex-start; gap: var(--space-2);
  padding: clamp(var(--space-8), 5vw, var(--space-12));
  background: linear-gradient(150deg, color-mix(in srgb, var(--color-brand) 8%, var(--color-surface-1)) 0%, var(--color-surface-1) 70%);
  backdrop-filter: none;
}
.adm-team-feature__media--solostat .adm-team-feature__statval { font-size: clamp(3rem, 6vw, 4.5rem); }
.adm-team-feature__media--solostat .adm-team-feature__statlabel { font-size: var(--font-size-base); max-width: 22ch; }
/* Pull-quote sits above the prose, with a magenta rule + oversized quote mark. */
.adm-team-feature__quote {
  position: relative; margin: 0 0 var(--space-5); padding: 0 0 0 var(--space-6);
  border-left: 3px solid var(--color-brand);
  font-size: clamp(1.15rem, 1.8vw, 1.4rem); line-height: 1.5; font-weight: 500;
  color: var(--color-text);
}
.adm-team-feature__quote-mark { position: absolute; left: -2px; top: -.35em; font-size: 3.2em; line-height: 1; color: color-mix(in srgb, var(--color-brand) 30%, transparent); pointer-events: none; }
/* Chips → pills already; nudge the label. */
.adm-team-feature .adm-team-block__brands-label { display:block; font-size: var(--font-size-sm); color: var(--color-text-muted); text-transform: uppercase; letter-spacing: .05em; margin-bottom: var(--space-3); }

@media (max-width: 860px) {
  .adm-team-feature__grid { grid-template-columns: 1fr; gap: var(--space-6); }
  .adm-team-feature--rev .adm-team-feature__media { order: 0; }
  .adm-team-feature__statcard { bottom: var(--space-3); left: var(--space-3); padding: var(--space-3) var(--space-4); }
  .adm-team-feature--rev .adm-team-feature__statcard { right: var(--space-3); }
}