/**
 * Component Styles
 *
 * Styles for PHP-rendered template components.
 * This file is loaded directly (no build step needed).
 */

/* ==========================================================================
   CSS Variables (can be overridden via Theme Customizer)
   ========================================================================== */

:root {
  /* Colors - AMFM Healthcare Brand (from Figma)
     ACF Global Settings (Brand Styles tab) overrides all color variables
     and --border-radius via enqueue.php */
  --color-primary: #035d67;
  --color-primary-dark: #024950;
  --color-primary-light: #0897a6;
  --color-secondary: #e2e7f3;
  --color-accent: #B97727;
  --color-text: #4d4d4d;
  --color-text-light: #6b7280;
  --color-text-muted: #999999;
  --color-gray-accessibility: #a3a3a3;
  --color-white: #ffffff;
  --color-black: #000000;
  --color-gray: #f8f5f5;
  --color-cream: var(--color-gray); /* Legacy alias. */
  --color-link: var(--color-primary);
  --color-link-on-dark: #edb776;
  --color-on-primary: var(--color-white);
  --color-on-primary-dark: var(--color-white);
  --color-on-secondary: var(--color-text);
  --color-on-accent: var(--color-text);
  --color-on-white: var(--color-text);
  --color-on-gray: var(--color-text);
  --color-on-cream: var(--color-on-gray);
  --color-on-transparent: var(--color-text);

  /* Neutral Grays
     Used for subtle backgrounds, borders, and UI chrome.
     Replaces hardcoded #f5f5f5, #f3f4f6, #f1f1f1, #ddd, #eee, etc. */
  --color-neutral: #f5f5f5;
  --color-border: #d0cece;

  /* Semantic Colors */
  --color-star: #ffc107;
  --color-map-green: #03b292;
  --color-map-pink: #991a65;

  /* Styling */
  --border-radius: 4px;
  --button-rounded-radius: 4px;
  --border-radius-pill: 999px;
  --border-radius-form-progress: 10px;
  --border-radius-drawer: 16px;
  --box-shadow: 0 4px 8px 1px rgb(12 12 13 / 25%);

  /* Typography - Mada (body) + Murecho (headings)
     ACF Global Settings can override --font-family-primary and --font-family-secondary via enqueue.php */
  --font-family-primary: 'Mada', sans-serif;
  --font-family-secondary: 'Murecho', sans-serif;
  --font-family-body: var(--font-family-primary);
  --font-family-heading: var(--font-family-secondary);
  --font-size-base: 16px;
  --font-size-sm: 0.875rem;
  --font-size-lg: 1.125rem;
  --font-size-xl: 1.25rem;
  --font-size-2xl: 1.5rem;
  --font-size-3xl: 1.875rem;
  --font-size-4xl: 2.25rem;
  --line-height-base: 1.5;
  --line-height-heading: 1.2;
  --font-weight-normal: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;

  /* Layout */
  --container-max-width: 1280px;
  --container-padding-top: 0px;
  --container-padding-right: 40px;
  --container-padding-bottom: 0px;
  --container-padding-left: 40px;
  --container-padding-mobile-top: 0px;
  --container-padding-mobile-right: 16px;
  --container-padding-mobile-bottom: 0px;
  --container-padding-mobile-left: 16px;
  --content-blurb-narrow-max-width: 680px;
  --content-blurb-default-max-width: 1200px;
  --spacing-4: 1rem;

  /* Header — ACF overrides via enqueue.php */
  --header-text-color: var(--color-on-white);
  --header-border-color: transparent;
  --header-border-width: 0;
  --header-min-height: 70px;
  --header-padding-y: 0;
  --header-nav-font-size: 0.875rem;
  --header-logo-width: 180px;
  --header-logo-width-mobile: 140px;

  /* Utility Bar — ACF overrides via enqueue.php */
  --utility-bar-bg-color: transparent;
  --utility-bar-text-color: var(--color-on-transparent);
  --utility-bar-padding-y: 0.5rem;
  --utility-bar-height: 0px;

  /* Mobile Menu — ACF overrides via enqueue.php */
  --mobile-menu-top: 90px;
  --mobile-menu-cta-bg: transparent;
  --mobile-menu-cta-text: var(--color-on-transparent);
  --mobile-menu-phone-bg: transparent;
  --mobile-menu-phone-text: var(--color-on-transparent);

  /* Footer — ACF overrides via enqueue.php */
  --footer-bg-color: transparent;
  --footer-text-color: var(--color-on-transparent);
  --footer-heading-color: inherit;
  --footer-link-color: var(--color-link);
  --footer-link-hover-color: var(--color-link);
  --footer-padding-top: 48px;
  --footer-padding-bottom: 48px;
  --footer-bottom-bg-color: transparent;
  --footer-bottom-text-color: var(--color-on-transparent);
  --footer-bottom-padding-y: 16px;
  --footer-accreditations-bg: transparent;
  --footer-accreditations-padding-y: 16px;
}

/* ==========================================================================
   Generic Layout and Press Release Carousel Shortcodes
   ========================================================================== */

.amfm-section {
  --amfm-section-gap: 16px;
  --amfm-section-padding-y: 32px;
  width: 100%;
}

.amfm-section--bg-transparent { background: transparent; }
.amfm-section--bg-primary { background: var(--color-primary); }
.amfm-section--bg-primary-dark { background: var(--color-primary-dark); }
.amfm-section--bg-secondary { background: var(--color-secondary); }
.amfm-section--bg-white { background: var(--color-white); }
.amfm-section--bg-gray,
.amfm-section--bg-cream { background: var(--color-gray); }
.amfm-section--text-light { color: var(--color-white); }
.amfm-section--text-dark { color: var(--color-text); }

.amfm-section--padding-none { --amfm-section-padding-y: 0px; }
.amfm-section--padding-small { --amfm-section-padding-y: 16px; }
.amfm-section--padding-medium { --amfm-section-padding-y: 32px; }
.amfm-section--padding-large { --amfm-section-padding-y: 48px; }

.amfm-section--gap-none { --amfm-section-gap: 0px; }
.amfm-section--gap-small { --amfm-section-gap: 8px; }
.amfm-section--gap-medium { --amfm-section-gap: 16px; }
.amfm-section--gap-large { --amfm-section-gap: 32px; }

.amfm-section__container {
  display: flex;
  width: 100%;
  flex-direction: column;
  gap: var(--amfm-section-gap);
  margin: 0 auto;
  padding: var(--amfm-section-padding-y) 16px;
}

.amfm-section--width-boxed .amfm-section__container {
  max-width: var(--container-max-width);
}

.amfm-section--width-full .amfm-section__container {
  max-width: none;
}

.amfm-title {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.amfm-title--align-left { align-items: flex-start; text-align: left; }
.amfm-title--align-center { align-items: center; text-align: center; }
.amfm-title--align-right { align-items: flex-end; text-align: right; }

.amfm-title__text {
  margin: 0;
  font-family: var(--font-family-heading);
  font-weight: var(--font-weight-semibold);
}

.amfm-title--size-small .amfm-title__text { font-size: 18px; line-height: 26px; }
.amfm-title--size-medium .amfm-title__text { font-size: 21px; line-height: 30px; }
.amfm-title--size-large .amfm-title__text { font-size: 30px; line-height: 36px; }
.amfm-title--size-xlarge .amfm-title__text { font-size: 37px; line-height: 43px; }

.amfm-title.amfm-title--color-heading > .amfm-title__text { color: var(--color-primary) !important; }
.amfm-title.amfm-title--color-accent > .amfm-title__text { color: var(--color-accent) !important; }
.amfm-title.amfm-title--color-text > .amfm-title__text { color: var(--color-text) !important; }
.amfm-title.amfm-title--color-white > .amfm-title__text { color: var(--color-white) !important; }
.amfm-title.amfm-title--color-inherit > .amfm-title__text { color: inherit !important; }

.amfm-title__accent {
  display: block;
  width: 50px;
  height: 2px;
  flex: 0 0 auto;
}

.amfm-title__accent--accent { background: var(--color-accent); }
.amfm-title__accent--primary { background: var(--color-primary); }
.amfm-title__accent--secondary { background: var(--color-secondary); }

.amfm-title--accent-bottom .amfm-title__accent {
  order: 2;
}

.amfm-title--accent-left {
  flex-direction: row;
  align-items: center;
}

.amfm-title--accent-left .amfm-title__accent {
  width: 2px;
  height: 30px;
}

.press-carousel-groups {
  display: grid;
  gap: 40px;
}

.press-carousel {
  --press-carousel-gap: 16px;
  --press-carousel-grid: 3;
  --press-carousel-grid-tablet: var(--press-carousel-grid);
  --press-carousel-grid-mobile: var(--press-carousel-grid);
  --press-carousel-visible: var(--press-carousel-grid-mobile);
  position: relative;
  width: 100%;
}

.press-carousel__group-heading {
  margin: 0 0 16px;
  color: var(--color-primary);
  font-family: var(--font-family-heading);
  font-size: 1.5rem;
  line-height: 1.25;
  text-align: center;
}

.press-carousel__viewport {
  width: 100%;
  overflow: hidden;
  cursor: grab;
  touch-action: pan-y;
  user-select: none;
}

.press-carousel.is-dragging .press-carousel__viewport {
  cursor: grabbing;
}

.press-carousel.is-dragging .press-carousel__track {
  transition: none;
}

.press-carousel .press-carousel__track {
  display: flex;
  gap: var(--press-carousel-gap);
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
  transition: transform 0.5s ease;
  will-change: transform;
}

.press-carousel .press-carousel__item {
  flex: 0 0 calc(
    (100% - (var(--press-carousel-visible) - 1) * var(--press-carousel-gap)) /
    var(--press-carousel-visible)
  );
  min-width: 0;
  margin: 0;
}

.press-carousel__link {
  display: flex;
  width: 100%;
  aspect-ratio: 672 / 362;
  align-items: center;
  justify-content: center;
  padding: 2px;
  background: var(--color-white);
  overflow: hidden;
  position: relative;
}

.press-carousel__link::after {
  position: absolute;
  inset: 2px;
  background: color-mix(in srgb, var(--color-white) 15%, transparent);
  content: '';
  pointer-events: none;
}

.press-carousel__link:focus-visible {
  outline: 2px solid var(--color-primary);
  outline-offset: -2px;
}

.press-carousel .press-carousel__logo {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
}

.press-carousel__controls {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 16px;
}

.press-carousel__pagination {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

.press-carousel__dot {
  width: 8px;
  height: 8px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: var(--color-gray-accessibility);
  cursor: pointer;
  transition: background-color 0.2s ease;
}

.press-carousel__dot:hover,
.press-carousel__dot:focus-visible {
  background: var(--color-primary);
  outline: 2px solid var(--color-white);
  outline-offset: 2px;
}

.press-carousel__dot.is-active {
  background: var(--color-primary);
}

@media (min-width: 768px) {
  .press-carousel {
    --press-carousel-visible: var(--press-carousel-grid-tablet);
  }
}

@media (min-width: 980px) {
  .amfm-section__container {
    padding-right: 80px;
    padding-left: 80px;
  }

  .press-carousel__group-heading {
    text-align: left;
  }

  .press-carousel {
    --press-carousel-visible: var(--press-carousel-grid);
  }
}

@media (prefers-reduced-motion: reduce) {
  .press-carousel__track {
    transition: none;
  }
}

/* ==========================================================================
   CSS RESET / NORMALIZE
   ========================================================================== */

*,
*::before,
*::after {
  box-sizing: border-box;
}

body {
  margin: 0;
  padding: 0;
  font-family: var(--font-family-primary);
  font-size: var(--font-size-base);
  line-height: var(--line-height-base);
  color: var(--color-text);
  background-color: var(--color-white);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-family-heading);
  line-height: var(--line-height-heading);
  font-weight: var(--font-weight-bold);
  color: var(--color-primary);
  margin-top: 0;
}

/* Headings inherit text color in dark-background contexts */
.hero--text-light .hero__headline,
.hero--text-light .hero__form-headline,
.content-blurb--text-light h2,
.content-blurb--text-light h3,
.footer-cta--text-light .footer-cta__headline,
.banner-cta--text-light .banner-cta__headline,
.form-cta--text-light .form-cta__headline,
.outcomes-cta--text-light .outcomes-cta__headline,
.site-footer :is(h1, h2, h3, h4, h5, h6) {
  color: inherit;
}

p {
  margin-top: 0;
}

a {
  color: var(--color-link);
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}

img {
  max-width: 100%;
  height: auto;
  display: block;
}

button,
input,
select,
textarea {
  font-family: inherit;
}

/* ==========================================================================
   SHARED BUTTON UTILITIES
   ========================================================================== */

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 32px;
  font-size: 0.875rem;
  font-weight: 600;
  font-family: inherit;
  text-decoration: none;
  border-radius: var(--border-radius);
  border: 1px solid transparent;
  transition: all 0.2s ease;
  cursor: pointer;
}

.btn--primary {
  background-color: var(--color-primary);
  color: var(--color-white);
}
.btn--primary:hover {
  background-color: var(--color-primary-dark);
}

.btn--secondary {
  background-color: transparent;
  color: var(--color-primary);
  border-color: var(--color-primary);
}
.btn--secondary:hover {
  background-color: var(--color-primary);
  color: var(--color-white);
}

.btn--outline {
  background-color: transparent;
  border-color: currentColor;
}

/* Public [button] shortcode variants use Global Brand Styles colors. */
.btn.btn-primary {
  background-color: var(--color-primary);
  border-color: var(--color-primary);
  border-radius: 0;
  color: var(--color-white);
}
.btn.btn-primary:hover {
  background-color: var(--color-accent) !important;
  border-color: var(--color-accent) !important;
  color: var(--color-black);
  text-decoration: none;
}

.btn.btn-primary-dark {
  background-color: var(--color-primary-dark);
  border-color: var(--color-primary-dark);
  border-radius: 0;
  color: var(--color-white);
}
.btn.btn-primary-dark:hover {
  background-color: var(--color-secondary) !important;
  border-color: var(--color-secondary) !important;
  color: var(--color-primary-dark);
  text-decoration: none;
}

.btn.btn-secondary {
  background-color: var(--color-secondary);
  border-color: var(--color-secondary);
  border-radius: 0;
  color: var(--color-primary);
}
.btn.btn-secondary:hover {
  background-color: var(--color-primary) !important;
  border-color: var(--color-primary) !important;
  color: var(--color-secondary);
  text-decoration: none;
}

.btn.btn-accent {
  background-color: var(--color-accent);
  border-color: var(--color-accent);
  border-radius: 0;
  color: var(--color-black);
}
.btn.btn-accent:hover {
  background-color: var(--color-primary-dark) !important;
  border-color: var(--color-primary-dark) !important;
  color: var(--color-white);
  text-decoration: none;
}

.btn.btn-primary.btn-outline {
  background-color: transparent;
  border: 1px solid var(--color-primary);
  color: var(--color-primary);
}

.btn.btn-primary-dark.btn-outline {
  background-color: transparent;
  border: 1px solid var(--color-primary-dark);
  color: var(--color-primary-dark);
}

.btn.btn-secondary.btn-outline {
  background-color: transparent;
  border: 1px solid var(--color-secondary);
  color: var(--color-primary);
}

.btn.btn-accent.btn-outline {
  background-color: transparent;
  border: 1px solid var(--color-accent);
  color: var(--color-black);
}

.btn.btn-primary.btn-outline:hover {
  color: var(--color-black) !important;
}

.btn.btn-primary-dark.btn-outline:hover {
  color: var(--color-primary-dark) !important;
}

.btn.btn-secondary.btn-outline:hover {
  color: var(--color-secondary) !important;
}

.btn.btn-accent.btn-outline:hover {
  color: var(--color-white) !important;
}

.btn.btn-hover-primary:hover {
  background-color: var(--color-primary) !important;
  border-color: var(--color-primary) !important;
  color: var(--color-secondary) !important;
}

.btn.btn-outline.btn-hover-primary:hover {
  background-color: var(--color-primary) !important;
  border-color: var(--color-primary) !important;
  color: var(--color-secondary) !important;
}

.btn.btn-hover-primary-dark:hover {
  background-color: var(--color-primary-dark) !important;
  border-color: var(--color-primary-dark) !important;
  color: var(--color-secondary) !important;
}

.btn.btn-outline.btn-hover-primary-dark:hover {
  background-color: var(--color-primary-dark) !important;
  border-color: var(--color-primary-dark) !important;
  color: var(--color-secondary) !important;
}

.btn.btn-hover-secondary:hover {
  background-color: var(--color-secondary) !important;
  border-color: var(--color-secondary) !important;
  color: var(--color-primary) !important;
}

.btn.btn-outline.btn-hover-secondary:hover {
  background-color: var(--color-secondary) !important;
  border-color: var(--color-secondary) !important;
  color: var(--color-primary) !important;
}

.btn.btn-hover-accent:hover {
  background-color: var(--color-accent) !important;
  border-color: var(--color-accent) !important;
  color: var(--color-black) !important;
}

.btn.btn-outline.btn-hover-accent:hover {
  background-color: var(--color-accent) !important;
  border-color: var(--color-accent) !important;
  color: var(--color-black) !important;
}

.btn.btn-rounded {
  border-radius: var(--button-rounded-radius);
}

.btn.btn-primary:focus-visible,
.btn.btn-primary-dark:focus-visible,
.btn.btn-secondary:focus-visible,
.btn.btn-accent:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 2px;
}

/* ==========================================================================
   LAYOUT - FULL WIDTH / BOXED
   ========================================================================== */

.site {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

.site-main {
  flex: 1;
}

/* ==========================================================================
   LAYOUT MODES (Boxed / Full-Width)
   ==========================================================================
   Boxed (default): Section wrappers are full-width (backgrounds bleed).
   Only __container elements are constrained to --container-max-width.
   Full-width: __container max-width is removed so content spans edge-to-edge.
   ========================================================================== */

/* --- Boxed Header (container-level) --- */
.site--header-boxed .utility-bar__container,
.site--header-boxed .site-header__container,
.site--header-boxed .site-header__inner {
  max-width: var(--container-max-width);
  margin-left: auto;
  margin-right: auto;
}

/* --- Boxed Content --- */
/* Default behavior: all __container elements already have max-width from
   their component styles. No extra CSS needed for boxed content mode. */

/* --- Boxed Footer (container-level) --- */
.site--footer-boxed .site-footer__container {
  max-width: var(--container-max-width);
  margin-left: auto;
  margin-right: auto;
}

/* Bottom bar follows same boxed/full-width rules as footer */

/* --- Boxed Utility Nav --- */
.site--utility-nav-boxed .utility-bar__container {
  max-width: var(--container-max-width);
  margin-left: auto;
  margin-right: auto;
}

/* --- Full-Width Header --- */
.site--header-full-width .utility-bar__container,
.site--header-full-width .site-header__container,
.site--header-full-width .site-header__inner {
  max-width: none;
}

/* --- Full-Width Content --- */
.site--content-full-width .hero__container,
.site--content-full-width .content-hero__container,
.site--content-full-width .content-blurb__container,
.site--content-full-width .cards__container,
.site--content-full-width .content-tabs__container,
.site--content-full-width .footer-cta__container,
.site--content-full-width .banner-cta__container,
.site--content-full-width .slim-phone-cta__container,
.site--content-full-width .form-cta__container,
.site--content-full-width .locations-cta__container,
.site--content-full-width .what-we-treat-cta__container,
.site--content-full-width .outcomes-cta__container,
.site--content-full-width .form-section__container,
.site--content-full-width .google-map__container,
.site--content-full-width .error-404__container,
.site--content-full-width .single-post__container,
.site--content-full-width .archive-header__container,
.site--content-full-width .archive-content__container,
.site--content-full-width .content-page__container,
.site--content-full-width .archive-posts__container,
.site--content-full-width .locations-cta-multi__container,
.site--content-full-width .photo-gallery__container,
.site--content-full-width .related-articles__container,
.site--content-full-width .staff-archive__container,
.site--content-full-width .video-embed__container,
.site--content-full-width .inline-link-bank__container,
.site--content-full-width .compare-map__container {
  max-width: none;
}

/* --- Full-Width Utility Nav --- */
.site--utility-nav-full-width .utility-bar__container {
  max-width: none;
}

/* --- Full-Width Footer --- */
.site--footer-full-width .site-footer__container {
  max-width: none;
}

/* --- Full-Width Exception Components ---
   These are ALWAYS unconstrained regardless of boxed/full-width setting.
   Google Map always spans full viewport. */
.google-map__container {
  max-width: none !important;
}

/* ==========================================================================
   HERO
   ========================================================================== */

.hero {
  position: relative;
  padding: 4rem 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  overflow: hidden;
}

.hero--has-bg-image {
  min-height: 400px;
  display: flex;
  align-items: center;
}

.hero__overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  pointer-events: none;
}

.hero__container {
  position: relative;
  z-index: 1;
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 0;
}

.hero--text-dark { color: var(--color-text); }
.hero--text-light { color: var(--color-white); }
.hero--text-light .hero__breadcrumbs a { color: rgba(255, 255, 255, 0.8); }
.hero--text-light .hero__breadcrumbs a:hover { color: var(--color-white); }
.hero--text-light .hero__subtitle,
.hero--text-light .hero__blurb { color: rgba(255, 255, 255, 0.9); }

.hero__breadcrumbs { margin-bottom: 0; }
.hero__breadcrumbs-list {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  list-style: none;
  padding: 0;
  margin: 0;
  font-size: 0.6875rem;
  font-weight: var(--font-weight-semibold);
  text-transform: uppercase;
  letter-spacing: 0.44px;
}
.hero__breadcrumbs-item { display: flex; align-items: center; }
.hero__breadcrumbs-item:not(:last-child)::after {
  content: '/';
  margin-left: 4px;
  opacity: 0.7;
  font-size: 0.75rem;
  text-transform: none;
  letter-spacing: 0;
}
.hero__breadcrumbs a {
  color: var(--color-link);
  text-decoration: none;
  transition: color 0.2s ease;
}
.hero__breadcrumbs a:hover { text-decoration: underline; }

.hero__content { display: flex; flex-direction: column; gap: 16px; }
@media (min-width: 768px) {
  .hero__content { display: grid; grid-template-columns: 1fr; gap: 2rem; }
  .hero--has-form .hero__content { grid-template-columns: 1fr 400px; align-items: start; }
  .hero--has-media:not(.hero--has-form) .hero__content { grid-template-columns: minmax(0, 1fr) minmax(320px, 1fr); align-items: stretch; }
}

.hero__text { max-width: 800px; display: flex; flex-direction: column; gap: 16px; }
.hero__headline {
  font-size: 1.875rem;
  font-weight: var(--font-weight-semibold);
  line-height: normal;
  margin: 0;
}
.hero__subtitle {
  font-size: clamp(1.125rem, 2vw, 1.5rem);
  font-weight: 500;
  margin: 0;
  opacity: 0.9;
}
.hero__blurb { font-size: 1rem; line-height: 1.5; margin: 0; }
.hero__blurb p { margin: 0; }
/* Hero Byline - Structured */
.hero__byline {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  margin: 0 0 1.5rem;
}

.hero__byline-avatar {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
  margin-top: 2px;
}

.hero__byline-text {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.hero__byline-dates {
  font-size: 0.625rem;
  font-weight: var(--font-weight-semibold);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--color-accent);
  margin: 0;
}

.hero__byline-credits {
  font-size: 0.6875rem;
  color: var(--color-text);
  margin: 0;
}

.hero__byline-separator {
  margin: 0 0.5rem;
  opacity: 0.5;
}

.hero__byline-link {
  color: inherit;
  text-decoration: none;
}

.hero__byline-link:hover {
  text-decoration: underline;
}

/* Preserve dark/light text overrides */
.hero--text-light .hero__byline-dates { color: rgba(255, 255, 255, 0.9); }
.hero--text-light .hero__byline-credits { color: rgba(255, 255, 255, 0.8); }

.hero__buttons { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 1.5rem; }
.hero__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 8px 32px;
  font-size: 0.875rem;
  font-weight: 600;
  text-decoration: none;
  border-radius: var(--border-radius);
  transition: all 0.2s ease;
  cursor: pointer;
  border: 1px solid transparent;
  height: 40px;
}
.hero__button--primary { background-color: var(--color-primary); color: var(--color-white); }
.hero__button--primary:hover { background-color: var(--color-primary-dark); }
.hero__button--secondary { background-color: transparent; color: var(--color-primary); border-color: var(--color-primary); }
.hero__button--secondary:hover { background-color: var(--color-primary); color: var(--color-white); }
.hero__button--outline { background-color: transparent; border-color: currentColor; }
.hero--text-dark .hero__button--outline { color: var(--color-primary); }
.hero--text-light .hero__button--outline { color: var(--color-white); }

.hero__form {
  position: relative;
  padding: 32px 24px 24px;
  border-radius: var(--border-radius);
  overflow: hidden;
}

/* Light variant (default): lavender card, dark text */
.hero__form--light {
  background: var(--color-secondary);
  color: var(--color-text);
  box-shadow: none;
}
.hero__form--light .hero__form-headline {
  color: var(--color-primary);
}

/* Dark variant: teal card, light text */
.hero__form--dark {
  background: var(--color-primary);
  color: var(--color-gray);
  box-shadow: 0 16px 32px -8px rgba(12, 12, 13, 0.4);
}
.hero__form--dark .hero__form-headline {
  color: var(--color-gray);
}

.hero__form-headline {
  font-family: var(--font-family-heading);
  font-weight: var(--font-weight-semibold, 600);
  font-size: 1.3125rem;
  line-height: 30px;
  text-align: center;
  margin: 0 0 8px;
}
/* Break GF positioning context so progress bar can anchor to .hero__form */
.hero__form .gform_wrapper { position: static !important; }
/* Pull progress bar to top edge of form card (3-class specificity beats global 2-class rule) */
.hero__form .gform_wrapper .gf_progressbar_wrapper {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  z-index: 1;
}
.hero__form .gform_heading { display: none !important; }
.form-cta__form .gform_heading { display: none !important; }
/* Hide GF internal HTML "title" fields — hero/form-cta already provide their own headlines */
.hero__form .gform_fields > .gfield--type-html:first-child,
.form-cta__form .gform_fields > .gfield--type-html:first-child { display: none !important; }

.hero__page-nav { margin-top: 2.5rem; padding-top: 1.5rem; border-top: 1px solid color-mix(in srgb, var(--color-text) 20%, transparent); }
.hero__page-nav-list { display: flex; flex-wrap: wrap; gap: 0.5rem; list-style: none; padding: 0; margin: 0; }
.hero__page-nav--jump_bar .hero__page-nav-list { gap: 1rem; }
.hero__page-nav--jump_bar .hero__page-nav-link {
  display: inline-flex;
  padding: 0.5rem 1rem;
  font-size: 0.875rem;
  font-weight: 500;
  text-decoration: none;
  color: inherit;
  background: color-mix(in srgb, var(--color-primary) 10%, transparent);
  border-radius: var(--border-radius);
  transition: all 0.2s ease;
}
.hero__page-nav--jump_bar .hero__page-nav-link:hover { background: var(--color-primary); color: var(--color-white); }

.hero__page-nav--tabs .hero__page-nav-list { border-bottom: 2px solid color-mix(in srgb, var(--color-text) 20%, transparent); gap: 0; }
.hero__page-nav--tabs .hero__page-nav-item { margin-bottom: -2px; }
.hero__page-nav--tabs .hero__page-nav-link {
  display: inline-flex;
  padding: 0.75rem 1.5rem;
  font-size: 0.9375rem;
  font-weight: 500;
  text-decoration: none;
  color: inherit;
  border-bottom: 2px solid transparent;
  transition: all 0.2s ease;
}
.hero__page-nav--tabs .hero__page-nav-link:hover { border-bottom-color: var(--color-primary); color: var(--color-primary); }

.hero__decoration {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 168px;
  height: 168px;
  pointer-events: none;
}
.hero__decoration img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

@media (max-width: 767px) {
  .hero { padding: 48px 24px; }
  .hero--has-bg-image { min-height: 300px; }
  .hero__decoration { width: 168px; height: 168px; }
  .hero__container { padding: 0; }
  .hero .hero__text { min-width: 0; }
}

@media (min-width: 768px) {
  .hero__container { padding: var(--container-padding-top) var(--container-padding-right) var(--container-padding-bottom) var(--container-padding-left); }
}

/* Tablet: hero */
@media (min-width: 768px) {
  .hero { padding: 48px 0; }
  .hero__container { padding: 0 var(--container-padding-right) 0 var(--container-padding-left); max-width: var(--container-max-width); }
  .hero__headline { font-size: 2.0625rem; }
  .hero__decoration { width: 200px; height: 200px; }
  .hero--has-form .hero__content { align-items: center; }
  .hero--has-form .hero__text { max-width: 600px; }
  .hero__form { padding: 32px; }
}

/* Desktop: hero */
@media (min-width: 1024px) {
  .hero { padding: 64px 0; min-height: 400px; display: flex; align-items: center; }
  .hero--compact { min-height: auto; }
  .hero__container { width: 100%; padding: 24px 80px; max-width: var(--container-max-width); }
  .hero__headline { font-size: 2rem; }
  .hero__blurb { font-size: 1.125rem; line-height: 1.11; }
  .hero--text-dark .hero__breadcrumbs-item span[aria-current="page"] { color: var(--color-text-light); }
  .hero--text-light .hero__breadcrumbs-item span[aria-current="page"] { color: rgba(255, 255, 255, 0.6); }
  .hero__decoration { width: 248px; height: 248px; }
  .hero--has-form .hero__content { justify-content: space-between; }
}

/* Hub Hero media: mobile-first bottom area, desktop right column. */
.hero__media {
  position: relative;
  z-index: 1;
  width: 100%;
  min-width: 0;
}

.hero__media-frame {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 10;
  overflow: hidden;
  border-radius: var(--border-radius);
  background: var(--color-secondary);
}

.hero__media-image {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.hero__media--form .hero__form {
  width: 100%;
}

.hero__media-gallery-nav {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px;
  pointer-events: none;
}

.hero__media-gallery-button {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  padding: 8px;
  color: var(--color-white);
  background: color-mix(in srgb, var(--color-text) 65%, transparent);
  border: 0;
  border-radius: 50%;
  cursor: pointer;
  pointer-events: auto;
  transition: background-color 0.2s ease;
}

.hero__media-gallery-button:hover,
.hero__media-gallery-button:focus-visible {
  background: var(--color-primary);
}

.hero__media-gallery-dots {
  position: absolute;
  right: 0;
  bottom: 12px;
  left: 0;
  z-index: 3;
  display: flex;
  justify-content: center;
  gap: 8px;
}

.hero__media-gallery-dot {
  width: 10px;
  height: 10px;
  padding: 0;
  background: color-mix(in srgb, var(--color-white) 65%, transparent);
  border: 1px solid var(--color-white);
  border-radius: 50%;
  cursor: pointer;
}

.hero__media-gallery-dot.is-active {
  background: var(--color-white);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--color-text) 35%, transparent);
}

.hero__media-video .video-embed__overlay {
  border-radius: inherit;
}

.hero__media-video .video-embed__play-icon {
  color: var(--color-primary);
}

.hero__media-video iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.hero__media-video.video-embed__wrapper--playing .hero__media-image,
.hero__media-video.video-embed__wrapper--playing .video-embed__overlay,
.hero__media-video.video-embed__wrapper--playing .video-embed__play {
  display: none;
}

@media (min-width: 768px) {
  .hero--has-media .hero__container { width: 100%; }
  .hero--has-media .hero__content { gap: 48px; }
  .hero--has-media .hero__text { max-width: 600px; justify-content: center; }
  .hero__media { display: flex; align-items: stretch; min-height: 250px; }
  .hero__media-frame { min-height: 250px; aspect-ratio: auto; }
}

/* ==========================================================================
   CONTENT BLURB
   ========================================================================== */

.content-blurb { position: relative; }
.content-blurb--padding-none { padding: 0; }
.content-blurb--padding-small { padding: 1.5rem 0; }
.content-blurb--padding-default { padding: 3rem 0; }
.content-blurb--padding-large { padding: 5rem 0; }

.content-blurb__container {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 0 16px;
}

@media (min-width: 768px) {
  .content-blurb__container {
    padding: var(--container-padding-top) var(--container-padding-right) var(--container-padding-bottom) var(--container-padding-left);
  }
}

.content-blurb--width-narrow .content-blurb__content { max-width: var(--content-blurb-narrow-max-width); margin-left: auto; margin-right: auto; }
.content-blurb--width-default .content-blurb__content { max-width: var(--content-blurb-default-max-width); margin-left: auto; margin-right: auto; }
.content-blurb--width-wide .content-blurb__content { max-width: 100%; }

.content-blurb--align-left .content-blurb__content { text-align: left; }
.content-blurb--align-center .content-blurb__content { text-align: center; }
.content-blurb--align-right .content-blurb__content { text-align: right; }

.content-blurb--bg-secondary,
.content-blurb--bg-light { background-color: var(--color-secondary); }
.content-blurb--bg-primary { background-color: var(--color-primary); }
.content-blurb--bg-primary-dark,
.content-blurb--bg-dark { background-color: var(--color-primary-dark); }

.content-blurb--text-dark { color: var(--color-text); }
.content-blurb--text-light { color: var(--color-white); }
.content-blurb--text-light a { color: var(--color-link-on-dark); }
.content-blurb--text-light a:hover { color: var(--color-white); }

.content-blurb__content { line-height: 1.5; }
.content-blurb__content h2 { font-size: 1.5625rem; font-weight: var(--font-weight-semibold, 600); margin: 0 0 1rem; line-height: 36px; }
.content-blurb__content h3 { font-size: 1.5rem; font-weight: 600; margin: 2rem 0 0.75rem; }
.content-blurb__content p { margin: 0 0 1.25rem; }
.content-blurb__content p:last-child { margin-bottom: 0; }
.content-blurb__content ul, .content-blurb__content ol { margin: 0 0 1.25rem; padding-left: 1.5rem; }
.content-blurb__content li ul, .content-blurb__content li ol { margin-bottom: 0; }
.content-blurb__content a { color: var(--color-link); text-decoration: none; }
.content-blurb--text-light .content-blurb__content a { color: var(--color-link-on-dark); }
.content-blurb--text-light .content-blurb__content a:hover { color: var(--color-white); }
.content-blurb__content img { max-width: 100%; height: auto; display: block; }
.content-blurb__content iframe { display: block; width: 100%; max-width: 100%; height: auto; aspect-ratio: 16 / 9; border: 0; margin: 1.5rem 0; }

/* Content Blurb — Image layout */
.content-blurb__body { display: flex; flex-direction: column; gap: 2rem; }
.content-blurb--img-mobile-top .content-blurb__body { flex-direction: column-reverse; }
.content-blurb--img-mobile-bottom .content-blurb__body { flex-direction: column; }

.content-blurb__image { width: 100%; flex-shrink: 0; position: relative; }
.content-blurb__image img { width: 100%; height: auto; display: block; border-radius: var(--border-radius); object-fit: cover; }
.content-blurb__image img[src$=".svg"] { object-fit: contain; }

@media (min-width: 768px) {
  .content-blurb--has-image .content-blurb__body { flex-direction: row; gap: 2rem; align-items: center; }
  .content-blurb--img-desktop-left .content-blurb__body { flex-direction: row-reverse; }
  .content-blurb--img-desktop-right .content-blurb__body { flex-direction: row; }
  .content-blurb--has-image .content-blurb__content { flex: 1; min-width: 0; }
  .content-blurb--has-image .content-blurb__image { flex: 1; min-width: 0; }
  .content-blurb--has-image .content-blurb__content { max-width: none; }
  /* Media width variants — image gets explicit flex-basis, content fills remainder */
  .content-blurb--media-3 .content-blurb__image { flex: 0 0 25%; }
  .content-blurb--media-4 .content-blurb__image { flex: 0 0 33.333%; }
  .content-blurb--media-5 .content-blurb__image { flex: 0 0 41.667%; }
  .content-blurb--media-7 .content-blurb__image { flex: 0 0 58.333%; }
  .content-blurb--media-8 .content-blurb__image { flex: 0 0 66.667%; }
  .content-blurb--media-9 .content-blurb__image { flex: 0 0 75%; }
  .content-blurb__content h2 { color: var(--color-primary); }
  .content-blurb--text-light .content-blurb__content h2 { color: var(--color-white); }
}

/* Content Blurb — Buttons */
.content-blurb__buttons { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-top: 1.5rem; }

/* Override .content-blurb__content a color for .btn links */
.content-blurb__content .btn--primary { color: var(--color-white); }
.content-blurb__content .btn--secondary { color: var(--color-primary); }
.content-blurb__content .btn--secondary:hover { background-color: var(--color-primary); color: var(--color-white); }

/* Light text mode — invert button colors */
.content-blurb--text-light .content-blurb__content .btn--primary { background-color: var(--color-white); color: var(--color-primary); }
.content-blurb--text-light .content-blurb__content .btn--primary:hover { color: var(--color-white); background-color: var(--color-primary-dark); }
.content-blurb--text-light .content-blurb__content .btn--secondary { background-color: transparent; color: var(--color-white); border-color: var(--color-white); }
.content-blurb--text-light .content-blurb__content .btn--secondary:hover { background-color: rgba(255, 255, 255, 0.1); }

/* Dark bg variations — secondary/primary color scheme */
.content-blurb--bg-primary .content-blurb__content .btn--primary,
.content-blurb--bg-dark .content-blurb__content .btn--primary { background-color: var(--color-secondary); color: var(--color-primary); }
.content-blurb--bg-primary .content-blurb__content .btn--primary:hover,
.content-blurb--bg-dark .content-blurb__content .btn--primary:hover { color: var(--color-white); background-color: var(--color-primary-dark); }
.content-blurb--bg-primary .content-blurb__content .btn--secondary,
.content-blurb--bg-dark .content-blurb__content .btn--secondary { background-color: transparent; color: var(--color-white); border-color: var(--color-white); }
.content-blurb--bg-primary .content-blurb__content .btn--secondary:hover,
.content-blurb--bg-dark .content-blurb__content .btn--secondary:hover { background-color: rgba(255, 255, 255, 0.1); }

/* Desktop: content-blurb */
@media (min-width: 1024px) {
  .content-blurb--padding-default { padding: 48px 0; }
  .content-blurb--padding-large { padding: 64px 0; }

  .content-blurb__container {
    padding: 0 var(--container-padding-right) 0 var(--container-padding-left);
  }

  .content-blurb__content h2 { font-size: 1.875rem; line-height: 36px; color: var(--color-primary); }
  .content-blurb--text-light .content-blurb__content h2 { color: var(--color-white); }

  .content-blurb--has-image .content-blurb__body { gap: 64px; }
  .content-blurb--has-image .content-blurb__content { padding: 24px 0; }
}

/* Content Blurb — Shortcode embed aside */
.content-blurb__shortcode-wrapper { width: 100%; }
.content-blurb__shortcode-wrapper .service-area-map { padding: 0; }
.content-blurb__shortcode-wrapper .service-area-map__container { max-width: none; padding: 0; display: block; }

/* Content Blurb — Video embed aside */
.content-blurb__video-wrapper {
  position: relative;
  width: 100%;
  padding-bottom: 56.25%; /* 16:9 */
  overflow: hidden;
  cursor: pointer;
  background: var(--color-black);
  border-radius: var(--border-radius);
}

.content-blurb__video-wrapper .video-embed__poster {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: var(--border-radius);
}

.content-blurb__video-wrapper .video-embed__overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.35);
  transition: background 0.2s ease;
  border-radius: var(--border-radius);
}

.content-blurb__video-wrapper:hover .video-embed__overlay {
  background: rgba(0, 0, 0, 0.45);
}

.content-blurb__video-wrapper .video-embed__play {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  border: none;
  background: none;
  padding: 0;
  cursor: pointer;
  z-index: 2;
  transition: transform 0.2s ease;
}

.content-blurb__video-wrapper .video-embed__play:hover {
  transform: translate(-50%, -50%) scale(1.1);
}

.content-blurb__video-wrapper .video-embed__play-icon {
  width: 68px;
  height: 48px;
  filter: drop-shadow(0 4px 12px rgba(0, 0, 0, 0.3));
}

.content-blurb__video-wrapper.video-embed__wrapper--playing .video-embed__poster,
.content-blurb__video-wrapper.video-embed__wrapper--playing .video-embed__overlay,
.content-blurb__video-wrapper.video-embed__wrapper--playing .video-embed__play {
  display: none;
}

.content-blurb__video-wrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
  border-radius: var(--border-radius);
}

@media (min-width: 768px) {
  .content-blurb__video-wrapper .video-embed__play-icon {
    width: 84px;
    height: 60px;
  }

  .content-blurb--media-only .content-blurb__body { display: block; }
  .content-blurb--media-only .content-blurb__image { max-width: 680px; margin: 0 auto; }
}

/* ==========================================================================
   CARDS
   ========================================================================== */

.cards { padding: 3rem 16px; }
.cards__container { max-width: var(--container-max-width); margin: 0 auto; padding: 0; }
@media (min-width: 768px) {
  .cards__container { padding: var(--container-padding-top) var(--container-padding-right) var(--container-padding-bottom) var(--container-padding-left); }
}

.cards__card {
  display: flex;
  flex-direction: column;
  background: var(--color-white);
  border: 1px solid var(--color-secondary);
  border-radius: var(--border-radius);
  padding: 8px;
  overflow: hidden;
  box-shadow: var(--box-shadow);
  transition: box-shadow 0.2s ease;
}

.cards--style-default .cards__card { /* uses base card styles */ }
.cards--style-default .cards__card:hover { box-shadow: 0 20px 20px -8px rgba(12, 12, 13, 0.15), 0 6px 6px -4px rgba(12, 12, 13, 0.08); }
.cards--style-bordered .cards__card { border: 1px solid rgba(0, 0, 0, 0.1); }
.cards--style-bordered .cards__card:hover { border-color: var(--color-primary); }
.cards--style-minimal .cards__card { background: transparent; }
.cards--style-minimal .cards__card-content { padding: 1rem 0; }

.cards__card-image { position: relative; height: 120px; overflow: hidden; border-radius: var(--border-radius); }
.cards__card-image img {
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  object-fit: cover;
}

/* Contain mode — show full image (logos, icons) */
.cards--imgfit-contain .cards__card-image { background: transparent; }
.cards--imgfit-contain .cards__card-image img { object-fit: contain; padding: 12px; }

.cards__card-content { flex: 1; display: flex; flex-direction: column; padding: 16px 16px 24px 16px; }
.cards__card-headline { font-size: 1.3125rem; font-weight: var(--font-weight-semibold); line-height: 30px; margin: 0 0 0.75rem; color: var(--color-primary); }
.cards__card-blurb {
  flex: 1;
  font-size: 0.8125rem;
  line-height: 1.5;
  color: var(--color-text);
  margin: 0 0 1rem;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.cards__card-link {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  font-size: 0.6875rem;
  font-weight: var(--font-weight-semibold);
  color: var(--color-primary);
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-top: auto;
  transition: gap 0.2s ease;
}
.cards__card-link:hover { gap: 0.5rem; }
.cards__card-link-icon { flex-shrink: 0; }

/* ==========================================================================
   CONTENT TABS / ACCORDION
   ========================================================================== */

.content-tabs { padding: 48px 16px; }
.content-tabs__container { max-width: var(--container-max-width); margin: 0 auto; padding: 0; }
@media (min-width: 768px) {
  .content-tabs__container { padding: var(--container-padding-top) var(--container-padding-right) var(--container-padding-bottom) var(--container-padding-left); }
}
.content-tabs__content { line-height: 1.5; color: var(--color-text); }
.content-tabs__content h3 { font-size: 1.25rem; font-weight: 600; margin: 1.5rem 0 0.75rem; }
.content-tabs__content h3:first-child { margin-top: 0; }
.content-tabs__content p { margin: 0 0 1rem; }
.content-tabs__content p:last-child { margin-bottom: 0; }
.content-tabs__content a { color: var(--color-link); }

/* Tabs Mode */
.content-tabs--mode-tabs .content-tabs__tab-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
  border-bottom: 2px solid rgba(0, 0, 0, 0.1);
}
.content-tabs__tab {
  padding: 0.875rem 1.5rem;
  font-size: 0.9375rem;
  font-weight: 500;
  color: var(--color-text-light);
  background: transparent;
  border: none;
  border-bottom: 2px solid transparent;
  margin-bottom: -2px;
  cursor: pointer;
  transition: all 0.2s ease;
}
.content-tabs__tab:hover { color: var(--color-text); }
.content-tabs__tab.is-active { color: var(--color-primary); border-bottom-color: var(--color-primary); }
.content-tabs__panels { padding-top: 1.5rem; }
.content-tabs__panel { display: none; }
.content-tabs__panel.is-active { display: block; animation: fadeIn 0.2s ease; }

@keyframes fadeIn {
  from { opacity: 0; transform: translateY(-4px); }
  to { opacity: 1; transform: translateY(0); }
}

/* Accordion Mode */
.content-tabs__accordion { border: 1px solid var(--color-primary); border-radius: var(--border-radius); overflow: hidden; background: var(--color-white); }
.content-tabs__accordion-item { border-bottom: 1px solid var(--color-secondary); }
.content-tabs__accordion-item:last-child { border-bottom: none; }
.content-tabs__accordion-trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 1rem;
  font-size: 1.125rem;
  font-weight: var(--font-weight-semibold);
  line-height: 25.2px;
  text-align: left;
  color: var(--color-primary);
  background: var(--color-white);
  border: none;
  cursor: pointer;
  transition: background-color 0.2s ease, color 0.2s ease;
}
.content-tabs__accordion-trigger:hover { background: rgba(0, 0, 0, 0.02); }
.content-tabs__accordion-item[open] .content-tabs__accordion-trigger { background: var(--color-primary); color: var(--color-white); }
.content-tabs__accordion-title { flex: 1; }
.content-tabs__accordion-content { display: flow-root; padding: 1rem; background: var(--color-white); }

/* Content Tabs Section Header */
.content-tabs__header {
  margin-bottom: 2rem;
}

.content-tabs__headline {
  font-family: var(--font-family-heading);
  font-size: 1.5625rem;
  font-weight: var(--font-weight-semibold);
  color: var(--color-primary);
  margin: 0 0 1rem;
  line-height: 36px;
}

.content-tabs__description {
  font-family: var(--font-family-body);
  font-size: 1rem;
  color: var(--color-text);
  margin: 0;
  line-height: 1.5;
}

/* Tablet: content-tabs */
@media (min-width: 768px) {
  .content-tabs { padding: 48px 40px; }
  .content-tabs__header { max-width: 1120px; }
  .content-tabs__headline { font-size: 1.75rem; }
  .content-tabs__accordion { max-width: 1120px; margin-left: auto; margin-right: auto; }
  .content-tabs--mode-tabs .content-tabs__tab-list { max-width: 1120px; margin-left: auto; margin-right: auto; }
  .content-tabs__panels { max-width: 1120px; margin-left: auto; margin-right: auto; }
}

/* Desktop: content-tabs */
@media (min-width: 1024px) {
  .content-tabs { padding: 48px 0; }
  .content-tabs__header { max-width: none; }
  .content-tabs__accordion { max-width: none; }
  .content-tabs--mode-tabs .content-tabs__tab-list { max-width: none; }
  .content-tabs__panels { max-width: none; }
  .content-tabs__headline { font-size: 1.875rem; line-height: 36px; }
  .content-tabs__description { font-size: 1rem; line-height: 1.5; }
}

/* ==========================================================================
   CTA SECTION FLOAT CLEARING
   ========================================================================== */

.footer-cta,
.banner-cta,
.slim-phone-cta,
.form-cta,
.locations-cta,
.locations-cta-multi,
.what-we-treat-cta,
.outcomes-cta {
  clear: both;
}

/* ==========================================================================
   FOOTER CTA
   ========================================================================== */

.footer-cta {
  position: relative;
  padding: 4rem 0;
  background-color: var(--color-primary);
  background-size: cover;
  background-position: center;
}
.footer-cta__overlay { position: absolute; top: 0; left: 0; right: 0; bottom: 0; pointer-events: none; }
.footer-cta__container { position: relative; z-index: 1; max-width: var(--container-max-width); margin: 0 auto; padding: var(--container-padding-top) var(--container-padding-right) var(--container-padding-bottom) var(--container-padding-left); }
.footer-cta__inner { display: flex; align-items: center; gap: 3rem; justify-content: center; text-align: center; }
.footer-cta__content { max-width: 700px; }

.footer-cta--text-dark { color: var(--color-text); }
.footer-cta--text-light { color: var(--color-white); }

.footer-cta__headline { font-size: clamp(1.75rem, 4vw, 2.5rem); font-weight: 700; margin: 0 0 1rem; line-height: 1.2; }
.footer-cta__copy { font-size: 1.125rem; line-height: 1.5; margin-bottom: 1.5rem; }
.footer-cta__copy p { margin: 0; }
.footer-cta--text-light .footer-cta__copy { opacity: 0.9; }

.footer-cta__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 1rem 2rem;
  font-size: 1rem;
  font-weight: 600;
  text-decoration: none;
  border-radius: var(--border-radius);
  transition: all 0.2s ease;
}
.footer-cta--text-light .footer-cta__button { background-color: var(--color-white); color: var(--color-primary); }
.footer-cta--text-light .footer-cta__button:hover { background-color: rgba(255, 255, 255, 0.9); transform: translateY(-2px); }
.footer-cta--text-dark .footer-cta__button { background-color: var(--color-primary); color: var(--color-white); }

/* Footer CTA - Foreground Image Layout */
.footer-cta--has-fg .footer-cta__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3rem;
  align-items: center;
  text-align: left;
}
.footer-cta--has-fg .footer-cta__content { max-width: none; }
.footer-cta__fg-image img {
  width: 100%;
  height: auto;
  border-radius: var(--border-radius);
  display: block;
}

@media (max-width: 767px) {
  .footer-cta { padding: 3rem 0; }
  .footer-cta__inner { flex-direction: column; }
  .footer-cta--has-fg .footer-cta__inner {
    grid-template-columns: 1fr;
    text-align: center;
  }
  .footer-cta__fg-image { order: -1; }
}

/* ==========================================================================
   BANNER CTA
   ========================================================================== */

/* Banner CTA - CSS Custom Properties (Figma mobile defaults) */
.banner-cta {
  --banner-padding-y: 24px;
  --banner-padding-x: 16px;
  --banner-gap: 16px;
  --banner-content-gap: 16px;
  --banner-text-gap: 8px;
  --banner-headline-size: 18px;
  --banner-headline-weight: 500;
  --banner-headline-line-height: 1.2;
  --banner-copy-size: 13px;
  --banner-copy-weight: 400;
  --banner-copy-line-height: 1.5;
  --banner-button-radius: 4px;
  --banner-button-gap: 4px;
  --banner-button-font-size: 14px;
  --banner-button-font-weight: 600;
  --banner-fg-width: 147px;
  --banner-fg-radius: 16px;
  --banner-fg-border-width: 4px;
  --banner-overlay-opacity: 0.6;
  --banner-bg-color: var(--color-primary);

  /* Figma color tokens (scoped — do NOT use global --color-text-light which is gray) */
  --banner-text-light: var(--color-gray);
  --banner-btn-primary-bg: var(--color-secondary);
  --banner-btn-primary-text: var(--color-primary);

  position: relative;
  overflow: hidden;
}

/* Background variants */
.banner-cta--has-bg {
  background-size: cover;
  background-position: center;
}
.banner-cta--solid {
  background-color: var(--banner-bg-color);
}
.banner-cta__overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, var(--banner-overlay-opacity));
  pointer-events: none;
}

/* Layout */
.banner-cta__container {
  position: relative;
  z-index: 1;
  max-width: var(--container-max-width);
  margin: 0 auto;
}
.banner-cta__inner {
  display: flex;
  align-items: center;
  gap: var(--banner-gap);
  padding: var(--banner-padding-y) var(--banner-padding-x);
}

/* Content */
.banner-cta__content {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: var(--banner-content-gap);
  justify-content: center;
  padding: var(--banner-padding-x) 0;
}
.banner-cta__text {
  display: flex;
  flex-direction: column;
  gap: var(--banner-text-gap);
}

/* Typography */
.banner-cta__headline {
  font-family: var(--font-family-heading);
  font-size: var(--banner-headline-size);
  font-weight: var(--banner-headline-weight);
  line-height: var(--banner-headline-line-height);
  margin: 0;
  word-wrap: break-word;
}
.banner-cta__copy {
  font-family: var(--font-family-body);
  font-size: var(--banner-copy-size);
  font-weight: var(--banner-copy-weight);
  line-height: var(--banner-copy-line-height);
}
.banner-cta .banner-cta__copy p { margin: 0; word-wrap: break-word; }

/* Foreground image */
.banner-cta__fg-image {
  flex-shrink: 0;
  width: var(--banner-fg-width);
  align-self: stretch;
  border-radius: var(--banner-fg-radius);
  overflow: hidden;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}
.banner-cta--solid .banner-cta__fg-image {
  border: var(--banner-fg-border-width) solid var(--banner-bg-color);
}

/* Injected Banner CTAs live inside a narrow editor column, not a full-width section. */
.content-page__content .banner-cta {
  --banner-padding-y: 24px;
  --banner-gap: 1.25rem;
  --banner-content-gap: 16px;
  --banner-headline-size: 18px;
  --banner-headline-line-height: 1.2;
  --banner-copy-size: 13px;
  --banner-fg-width: clamp(132px, 36%, 210px);
  --banner-fg-radius: 16px;
}
.content-page__content .banner-cta__container {
  padding: 0;
}
.content-page__content .banner-cta__inner {
  flex-direction: row;
  align-items: center;
  min-height: 0;
  padding: var(--banner-padding-y) var(--container-padding-right) var(--banner-padding-y) var(--container-padding-left);
}
.content-page__content .banner-cta__content {
  flex: 1 1 0;
  min-width: 0;
  max-width: none;
  padding: 0;
}
.content-page__content .banner-cta__fg-image {
  width: var(--banner-fg-width);
  height: auto;
  aspect-ratio: 147 / 174;
  align-self: center;
}
.content-page__content .banner-cta__buttons {
  flex-wrap: nowrap;
  gap: var(--banner-button-gap);
}
.content-page__content .banner-cta__button {
  flex: 1 1 0;
  min-width: 0;
  height: 33px;
  padding: 4px 8px;
  white-space: normal;
}

@media (max-width: 767px) {
  .content-page__content .banner-cta__inner {
    flex-direction: column;
    align-items: stretch;
  }
  .content-page__content .banner-cta__fg-image {
    width: 100%;
    max-width: 360px;
    aspect-ratio: 16 / 9;
  }
  .content-page__content .banner-cta__buttons {
    flex-direction: column;
  }
  .content-page__content .banner-cta__button {
    flex-basis: auto;
    width: 100%;
    min-height: 40px;
    height: auto;
  }
}

/* Buttons */
.banner-cta__buttons {
  display: flex;
  gap: var(--banner-button-gap);
  width: 100%;
}
.banner-cta__button {
  flex: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 16px;
  text-align: center;
  font-family: var(--font-family-body);
  font-size: var(--banner-button-font-size);
  font-weight: var(--banner-button-font-weight);
  line-height: 1.2;
  text-decoration: none;
  border-radius: var(--banner-button-radius);
  border: 1px solid transparent;
  transition: all 0.2s ease;
  white-space: nowrap;
  cursor: pointer;
}

/* Text color modes */
.banner-cta--text-light { color: var(--banner-text-light); }
.banner-cta--text-dark { color: var(--color-text); }

/* Light text button styles (Figma design) */
.banner-cta--text-light .banner-cta__button--primary {
  background-color: var(--banner-btn-primary-bg);
  color: var(--banner-btn-primary-text);
  border-color: transparent;
}
.banner-cta--text-light .banner-cta__button--primary:hover { opacity: 0.9; }
.banner-cta--text-light .banner-cta__button--secondary {
  background: transparent;
  border-color: var(--banner-text-light);
  color: var(--banner-text-light);
}
.banner-cta--text-light .banner-cta__button--secondary:hover { background-color: rgba(255, 255, 255, 0.1); }

/* Dark text button styles (TBD — pending Figma design) */
.banner-cta--text-dark .banner-cta__button--primary {
  background-color: var(--color-primary);
  color: var(--color-white);
  border-color: transparent;
}
.banner-cta--text-dark .banner-cta__button--primary:hover { opacity: 0.9; }
.banner-cta--text-dark .banner-cta__button--secondary {
  background: transparent;
  border-color: var(--color-primary);
  color: var(--color-primary);
}
.banner-cta--text-dark .banner-cta__button--secondary:hover { background-color: rgba(3, 93, 103, 0.08); }

/* Tablet: banner-cta */
@media (min-width: 768px) {
  .banner-cta {
    --banner-padding-y: 40px;
    --banner-padding-x: 40px;
    --banner-gap: 40px;
    --banner-content-gap: 20px;
    --banner-text-gap: 12px;
    --banner-headline-size: 26px;
    --banner-headline-weight: 600;
    --banner-headline-line-height: 1.2;
    --banner-copy-size: 15px;
    --banner-copy-line-height: 1.5;
    --banner-fg-width: 340px;
    --banner-fg-radius: 8px;
    --banner-fg-border-width: 0;
  }
  .banner-cta__container {
    max-width: var(--container-max-width, 1280px);
    padding: 0 var(--container-padding-right) 0 var(--container-padding-left);
  }
  .banner-cta__inner {
    min-height: 300px;
  }
  .banner-cta__content {
    max-width: 380px;
  }
  .banner-cta__buttons {
    gap: 16px;
  }
  .banner-cta__button {
    height: 33px;
    padding: 8px 16px;
    font-size: 0.875rem;
  }
}

/* Desktop: banner-cta */
@media (min-width: 1024px) {
  .banner-cta {
    --banner-padding-y: 48px;
    --banner-padding-x: 64px;
    --banner-gap: 64px;
    --banner-content-gap: 24px;
    --banner-text-gap: 16px;
    --banner-headline-size: 30px;
    --banner-headline-weight: 600;
    --banner-headline-line-height: 36px;
    --banner-copy-size: 16px;
    --banner-copy-line-height: 1.5;
    --banner-fg-width: 500px;
    --banner-fg-radius: 8px;
    --banner-fg-border-width: 0;
  }
  .banner-cta__container {
    max-width: var(--container-max-width, 1280px);
  }
  .banner-cta__inner {
    min-height: 350px;
    justify-content: center;
  }
  .banner-cta__content {
    max-width: 400px;
  }
  .banner-cta__fg-image {
    height: 350px;
    align-self: center;
  }
  .banner-cta__buttons {
    gap: 16px;
  }
  .banner-cta__button {
    height: 33px;
    padding: 8px 16px;
    font-size: 0.875rem;
  }
}

/* ==========================================================================
   SLIM PHONE CTA
   ========================================================================== */

.slim-phone-cta {
  --slim-phone-cta-background: var(--color-primary);

  padding: 1rem 0;
  background-color: var(--slim-phone-cta-background);
}
.slim-phone-cta__container { max-width: var(--container-max-width); margin: 0 auto; padding: var(--container-padding-top) var(--container-padding-right) var(--container-padding-bottom) var(--container-padding-left); }
.slim-phone-cta__inner { display: flex; align-items: center; gap: 1.25rem; }
.slim-phone-cta .slim-phone-cta__copy { flex: 1; min-width: 0; margin: 0; font-size: 1rem; font-weight: 500; }

.slim-phone-cta--text-light { color: var(--color-white); }
.slim-phone-cta--text-dark { color: var(--color-text); }
.slim-phone-cta--text-light .slim-phone-cta__copy { opacity: 0.95; }

.slim-phone-cta__button {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.625rem 1.25rem;
  font-size: 0.9375rem;
  font-weight: 600;
  text-decoration: none;
  border-radius: var(--border-radius);
  transition: all 0.2s ease;
  white-space: nowrap;
}
.slim-phone-cta--text-light .slim-phone-cta__button { background-color: var(--color-white); color: var(--color-primary); }
.slim-phone-cta--text-light .slim-phone-cta__button:hover { background-color: rgba(255, 255, 255, 0.9); transform: scale(1.02); }
.slim-phone-cta--text-dark .slim-phone-cta__button { background-color: var(--color-white); color: var(--color-primary); }
.slim-phone-cta--text-dark .slim-phone-cta__button:hover { background-color: rgba(255, 255, 255, 0.9); transform: scale(1.02); }

.slim-phone-cta__icon { flex-shrink: 0; }
.slim-phone-cta__button-number { font-weight: 700; letter-spacing: 0.025em; }

@media (max-width: 767px) {
  .slim-phone-cta__inner {
    flex-direction: column;
    align-items: stretch;
  }
  .slim-phone-cta__button {
    width: 100%;
    justify-content: center;
    white-space: normal;
  }
}

/* Tablet: slim-phone-cta */
@media (min-width: 768px) {
  .slim-phone-cta__copy {
    font-size: 1.125rem;
    font-weight: 500;
    line-height: 1.5;
  }
}

/* Desktop: slim-phone-cta */
@media (min-width: 1024px) {
  .slim-phone-cta__copy {
    font-size: 1.125rem;
    line-height: 1.5;
  }
}

/* ==========================================================================
   FORM CTA
   ========================================================================== */

.form-cta {
  --form-cta-background: var(--color-primary);
  --form-cta-card-background: var(--color-secondary);

  position: relative;
  padding: 48px 0;
  background-color: var(--form-cta-background);
  background-size: cover;
  background-position: center;
}
.form-cta__container { position: relative; z-index: 1; max-width: var(--container-max-width); margin: 0 auto; padding: 0 16px; }
@media (min-width: 768px) {
  .form-cta__container { padding: var(--container-padding-top) var(--container-padding-right) var(--container-padding-bottom) var(--container-padding-left); }
}
.form-cta__inner { display: flex; flex-direction: column; gap: 24px; align-items: stretch; }
@media (min-width: 768px) {
  .form-cta__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; align-items: center; }
}
.form-cta__content { text-align: center; }
@media (min-width: 768px) { .form-cta__content { max-width: 500px; text-align: left; } }

.form-cta--text-light { color: var(--color-white); }
.form-cta--text-dark { color: var(--color-text); }

.form-cta__headline { font-size: 1.5625rem; font-weight: var(--font-weight-semibold, 600); margin: 0 0 8px; line-height: 36px; }
.form-cta__copy { font-size: 1rem; line-height: 1.5; }
.form-cta__copy p { margin: 0; }
.form-cta--text-light .form-cta__copy { opacity: 0.9; }

.form-cta__form {
  position: relative;
  background: var(--form-cta-card-background);
  padding: 24px;
  border-radius: var(--border-radius);
  box-shadow: none;
  overflow: hidden;
  color: var(--color-text);
}
.form-cta__form-placeholder { color: var(--color-text-light); text-align: center; margin: 2rem 0; }

@media (max-width: 767px) {
  .form-cta__content { max-width: 100%; }
}

/* Desktop: form-cta — color inversion (light outer, teal form card) */
@media (min-width: 768px) {
  .form-cta {
    --form-cta-background: var(--color-secondary);
    --form-cta-card-background: var(--color-primary);

    background-image: none;
    padding: 48px 0 80px;
  }
  .form-cta__container {
    max-width: 1280px;
    padding: 0 80px;
  }
  .form-cta--desktop-text-light { color: var(--color-white); }
  .form-cta--desktop-text-dark { color: var(--color-text); }
  .form-cta__headline {
    color: var(--color-primary);
  }
  .form-cta__copy {
    opacity: 1;
  }
  .form-cta__headline {
    margin-bottom: 0;
  }
  /* Accent line between headline and copy */
  .form-cta__headline::after {
    content: "";
    display: block;
    width: 48px;
    height: 2px;
    background: var(--color-accent);
    margin-top: 16px;
  }
  .form-cta__form {
    background: var(--form-cta-card-background);
    color: var(--color-white);
    padding: 32px;
  }
  /* GF overrides for teal form card at desktop */
  .form-cta__form .gform_wrapper .gfield_label {
    color: var(--color-white) !important;
  }
  .form-cta__form .gform_wrapper .gsection_title,
  .form-cta__form .gform_wrapper .gfield.gfield_html_formatted {
    color: var(--color-white) !important;
  }
  .form-cta__form .gform_wrapper .gf_progressbar_title {
    color: rgba(255, 255, 255, 0.8) !important;
  }
  .form-cta__form .gform_wrapper .gfield_consent_label {
    color: var(--color-white) !important;
  }
  .form-cta__form .gform_wrapper .gchoice label {
    color: var(--color-white) !important;
  }
  .form-cta__form .gform_wrapper .gfield_description:not(.gfield_consent_description) {
    color: rgba(255, 255, 255, 0.8) !important;
  }
  .form-cta__form .gform_wrapper input:not([type="submit"]):not([type="button"]):not([type="hidden"]):not([type="checkbox"]):not([type="radio"]),
  .form-cta__form .gform_wrapper textarea,
  .form-cta__form .gform_wrapper select {
    border-color: var(--color-primary-light) !important;
  }
  .form-cta__form .gform_wrapper .gform_next_button,
  .form-cta__form .gform_wrapper .gform_button {
    background-color: transparent !important;
    border: 1px solid var(--color-white) !important;
    color: var(--color-white) !important;
  }
  .form-cta__form .gform_wrapper .gform_next_button:hover,
  .form-cta__form .gform_wrapper .gform_button:hover {
    background-color: var(--color-white) !important;
    color: var(--color-primary) !important;
  }
  .form-cta__form .gform_wrapper .gform_previous_button {
    color: var(--color-white) !important;
    border-color: var(--color-white) !important;
  }
  .form-cta__form .gform_wrapper .gform_previous_button:hover {
    background-color: var(--color-white) !important;
    color: var(--color-primary) !important;
  }
}
@media (min-width: 1024px) {
  .form-cta__inner { gap: 80px; grid-template-columns: 1fr 400px; }
  .form-cta__headline { font-size: 1.875rem; line-height: 36px; }
  .form-cta__content { max-width: none; }
}

/* Keep injected Form CTAs readable in the narrow content column beside a sidebar. */
.content-page--has-sidebar .content-page__content .form-cta__inner {
  grid-template-columns: 1fr;
}

/* ==========================================================================
   GRAVITY FORMS — Global Theme Overrides
   Styles all GF forms site-wide to match the Figma design system.
   Two form types: multi-step (stepper) and single-page (regular).
   ========================================================================== */

/* Reset GF theme variables */
.gform_wrapper {
  --gf-color-primary: var(--color-primary) !important;
  --gf-color-primary-rgb: 3, 93, 103 !important;
  --gf-color-in-ctrl: var(--color-white) !important;
  --gf-color-in-ctrl-contrast: var(--color-text) !important;
  --gf-ctrl-border-color: var(--color-border) !important;
  --gf-ctrl-border-radius: 4px !important;
  --gf-ctrl-size-md: 40px !important;
  font-family: var(--font-family-primary);
  position: relative;
}

/* Hide GF required legend ("* indicates required fields") */
.gform_wrapper .gform_required_legend {
  display: none;
}

/* --- Progress Bar (multi-step forms) --- */
.gform_wrapper .gf_progressbar_wrapper {
  display: flex !important;
  flex-direction: column-reverse !important;
  margin: -24px -24px 16px !important;
  padding: 0 !important;
}

/* Step text: "STEP X/Y" — right-aligned below the bar */
/* !important needed on font-size/text-transform to beat GF theme-framework cascade */
.gform_wrapper .gf_progressbar_title {
  font-family: var(--font-family-primary) !important;
  font-weight: var(--font-weight-semibold, 600) !important;
  font-size: 0.625rem !important;
  line-height: 13.2px !important;
  letter-spacing: 0.4px !important;
  text-transform: uppercase !important;
  text-align: right !important;
  color: var(--color-text) !important;
  margin: 8px 24px 0 !important;
  padding: 0 !important;
}

/* Progress bar track — flush to top edge of card */
.gform_wrapper .gf_progressbar {
  background: transparent !important;
  border: 1px solid var(--color-accent) !important;
  border-radius: 0 !important;
  height: 6px !important;
  overflow: hidden;
  padding: 0 !important;
  margin: 0 !important;
  width: 100% !important;
}

/* Progress bar fill */
.gform_wrapper .gf_progressbar_percentage {
  background: var(--color-accent) !important;
  height: 6px !important;
  border-radius: 0 !important;
  line-height: 0 !important;
  font-size: 0 !important;
  padding: 0 !important;
  transition: width 0.3s ease;
}
.gform_wrapper .gf_progressbar_percentage span {
  display: none;
}

/* --- Section Title (Form Title from Figma) --- */
.gform_wrapper .gsection_title,
.gform_wrapper .gfield.gfield_html_formatted {
  font-family: var(--font-family-heading) !important;
  font-weight: var(--font-weight-semibold, 600) !important;
  font-size: 1.3125rem !important;
  line-height: 30px !important;
  color: var(--color-primary) !important;
  text-align: center !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* --- Field Labels --- */
.gform_wrapper .gfield_label {
  font-family: var(--font-family-heading) !important;
  font-weight: var(--font-weight-medium, 500) !important;
  font-size: 1rem !important;
  line-height: 21.6px !important;
  color: var(--color-primary) !important;
  margin-bottom: 8px !important;
}

/* Required asterisk — copper */
.gform_wrapper .gfield_required {
  color: var(--color-accent) !important;
}

/* --- Input Fields --- */
.gform_wrapper input:not([type="submit"]):not([type="button"]):not([type="hidden"]):not([type="checkbox"]):not([type="radio"]),
.gform_wrapper textarea,
.gform_wrapper select {
  background-color: var(--color-white) !important;
  border: 1px solid var(--color-border) !important;
  border-radius: var(--border-radius) !important;
  padding: 8px !important;
  font-family: var(--font-family-primary) !important;
  font-weight: var(--font-weight-normal, 400) !important;
  font-size: 0.8125rem !important;
  line-height: 15.6px !important;
  color: var(--color-text) !important;
  height: auto !important;
  box-shadow: none !important;
  transition: border-color 0.2s ease;
}
.gform_wrapper input:focus,
.gform_wrapper textarea:focus,
.gform_wrapper select:focus {
  border-color: var(--color-primary) !important;
  outline: none !important;
}

/* --- Field Spacing --- */
.gform_wrapper .gfield {
  margin-bottom: 8px !important;
  padding: 0 !important;
}
.gform_wrapper .gfield--type-html {
  margin-bottom: 0 !important;
}

/* --- Buttons (Next / Previous / Submit) --- */
.gform_wrapper .gform_next_button,
.gform_wrapper .gform_button {
  display: block !important;
  width: 100% !important;
  height: 40px !important;
  background-color: var(--color-primary) !important;
  color: var(--color-white) !important;
  border: none !important;
  border-radius: var(--border-radius) !important;
  font-family: var(--font-family-primary) !important;
  font-weight: var(--font-weight-semibold, 600) !important;
  font-size: 0.875rem !important;
  line-height: 16.8px !important;
  letter-spacing: 0 !important;
  cursor: pointer;
  padding: 0 32px !important;
  transition: background-color 0.2s ease;
  -webkit-appearance: none;
  appearance: none;
}
.gform_wrapper .gform_next_button:hover,
.gform_wrapper .gform_button:hover {
  background-color: var(--color-primary-dark) !important;
}

.gform_wrapper .gform_previous_button {
  display: block !important;
  width: 100% !important;
  height: 40px !important;
  background-color: transparent !important;
  color: var(--color-primary) !important;
  border: 1px solid var(--color-primary) !important;
  border-radius: var(--border-radius) !important;
  font-family: var(--font-family-primary) !important;
  font-weight: var(--font-weight-semibold, 600) !important;
  font-size: 0.875rem !important;
  line-height: 16.8px !important;
  cursor: pointer;
  padding: 0 32px !important;
  margin-bottom: 8px !important;
  transition: background-color 0.2s ease, color 0.2s ease;
  -webkit-appearance: none;
  appearance: none;
}
.gform_wrapper .gform_previous_button:hover {
  background-color: var(--color-primary) !important;
  color: var(--color-white) !important;
}

/* Page footer spacing */
.gform_wrapper .gform_page_footer {
  margin-top: 16px !important;
  padding: 0 !important;
  border: none !important;
}

/* --- Hide hidden fields and admin markup --- */
.gform_wrapper .gfield_visibility_hidden,
.gform_wrapper .admin-hidden-markup {
  display: none !important;
}

/* --- Consent field --- */
.gform_wrapper .gfield--type-consent .gfield_consent_description {
  font-size: 0.6875rem;
  line-height: 1.4;
  color: var(--color-text-light);
  max-height: 80px;
  overflow-y: auto;
  margin-bottom: 8px;
  border: 1px solid var(--color-border);
  border-radius: var(--border-radius);
  padding: 8px;
  background: var(--color-white);
}
.gform_wrapper .gfield_consent_label {
  font-size: 0.8125rem !important;
  color: var(--color-text) !important;
}

/* --- CAPTCHA placeholder --- */
.gform_wrapper .gfield--type-captcha {
  margin-bottom: 8px !important;
}

/* --- GF inside dark-background form cards (teal bg) --- */
/* Affects: hero dark form + form-section light-bg variant (both use teal card) */
.hero__form--dark .gform_wrapper .gfield_label,
.bd-contact-form--dark .gform_wrapper .gfield_label,
.form-section--bg-light .form-section__form .gform_wrapper .gfield_label {
  color: var(--color-white) !important;
}
.hero__form--dark .gform_wrapper .gsection_title,
.hero__form--dark .gform_wrapper .gfield.gfield_html_formatted,
.bd-contact-form--dark .gform_wrapper .gsection_title,
.bd-contact-form--dark .gform_wrapper .gfield.gfield_html_formatted,
.form-section--bg-light .form-section__form .gform_wrapper .gsection_title,
.form-section--bg-light .form-section__form .gform_wrapper .gfield.gfield_html_formatted {
  color: var(--color-white) !important;
}
.hero__form--dark .gform_wrapper .gf_progressbar_title,
.bd-contact-form--dark .gform_wrapper .gf_progressbar_title,
.form-section--bg-light .form-section__form .gform_wrapper .gf_progressbar_title {
  color: rgba(255, 255, 255, 0.8) !important;
}
.hero__form--dark .gform_wrapper .gfield_consent_label,
.bd-contact-form--dark .gform_wrapper .gfield_consent_label,
.form-section--bg-light .form-section__form .gform_wrapper .gfield_consent_label {
  color: var(--color-white) !important;
}
.hero__form--dark .gform_wrapper .gchoice label,
.bd-contact-form--dark .gform_wrapper .gchoice label,
.form-section--bg-light .form-section__form .gform_wrapper .gchoice label {
  color: var(--color-white) !important;
}
.hero__form--dark .gform_wrapper .gfield_description:not(.gfield_consent_description),
.bd-contact-form--dark .gform_wrapper .gfield_description:not(.gfield_consent_description),
.form-section--bg-light .form-section__form .gform_wrapper .gfield_description:not(.gfield_consent_description) {
  color: rgba(255, 255, 255, 0.8) !important;
}
.hero__form--dark .gform_wrapper .gform_previous_button,
.bd-contact-form--dark .gform_wrapper .gform_previous_button,
.form-section--bg-light .form-section__form .gform_wrapper .gform_previous_button {
  color: var(--color-white) !important;
  border-color: var(--color-white) !important;
}
.hero__form--dark .gform_wrapper .gform_previous_button:hover,
.bd-contact-form--dark .gform_wrapper .gform_previous_button:hover,
.form-section--bg-light .form-section__form .gform_wrapper .gform_previous_button:hover {
  background-color: var(--color-white) !important;
  color: var(--color-primary) !important;
}
.hero__form--dark .gform_wrapper .gform_next_button,
.hero__form--dark .gform_wrapper .gform_button,
.bd-contact-form--dark .gform_wrapper .gform_next_button,
.bd-contact-form--dark .gform_wrapper .gform_button,
.form-section--bg-light .form-section__form .gform_wrapper .gform_next_button,
.form-section--bg-light .form-section__form .gform_wrapper .gform_button {
  background-color: var(--color-accent) !important;
}
.hero__form--dark .gform_wrapper .gform_next_button:hover,
.hero__form--dark .gform_wrapper .gform_button:hover,
.bd-contact-form--dark .gform_wrapper .gform_next_button:hover,
.bd-contact-form--dark .gform_wrapper .gform_button:hover,
.form-section--bg-light .form-section__form .gform_wrapper .gform_next_button:hover,
.form-section--bg-light .form-section__form .gform_wrapper .gform_button:hover {
  background-color: color-mix(in srgb, var(--color-accent) 85%, black) !important;
}

/* --- GF Orbital theme overrides (high specificity) --- */
.gform_wrapper.gform-theme--orbital .gform_fields {
  gap: 8px !important;
}
.gform_wrapper.gform-theme--orbital .gfield {
  --gf-field-pg: 0 !important;
}
.gform_wrapper.gform-theme--orbital .gform-body {
  padding: 0 !important;
}
.gform_wrapper.gform-theme--orbital .gform_heading {
  padding: 0 !important;
  margin-bottom: 0 !important;
}
.gform_wrapper.gform-theme--orbital .gform_page {
  padding: 0 !important;
}
.gform_wrapper.gform-theme--orbital .gform_page_fields {
  padding: 0 !important;
}

/* --- Force full-width on date inputs and VerifyTx search --- */
.gform_wrapper .ginput_container_date input,
.gform_wrapper .ginput_container_date select,
.gform_wrapper .gf-verifytx-payer-search {
  width: 100% !important;
  box-sizing: border-box !important;
}

/* --- VerifyTx payer dropdown overlay fix --- */
.gf-verifytx-payer-container {
  position: relative !important;
}
.gform_wrapper .gf-verifytx-payer-dropdown {
  position: absolute !important;
  top: 100% !important;
  left: 0 !important;
  z-index: 999 !important;
  width: 100% !important;
  background: var(--color-white) !important;
  border: 1px solid rgba(0, 0, 0, 0.15) !important;
  border-radius: var(--border-radius) !important;
  box-shadow: var(--box-shadow) !important;
  margin-top: 0 !important;
  color: var(--color-text) !important;
  font-size: 0.875rem !important;
}
.gform_wrapper .gf-verifytx-payer-option {
  padding: 10px !important;
}
.gform_wrapper .gf-verifytx-payer-option:hover {
  background: var(--color-secondary) !important;
}

/* ==========================================================================
   LOCATIONS CTA
   ========================================================================== */

.locations-cta { padding: 4rem 0; background-color: var(--color-secondary); }
.locations-cta__container { max-width: var(--container-max-width); margin: 0 auto; padding: var(--container-padding-top) var(--container-padding-right) var(--container-padding-bottom) var(--container-padding-left); }
.locations-cta__header { text-align: center; max-width: 600px; margin: 0 auto 2.5rem; }
.locations-cta__headline { font-size: clamp(1.75rem, 4vw, 2.25rem); font-weight: 700; margin: 0 0 0.75rem; }
.locations-cta__copy { font-size: 1.125rem; line-height: 1.6; color: var(--color-text-light); margin: 0; }

.locations-cta__carousel { position: relative; }
.locations-cta__track {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 1.5rem;
}

.locations-cta__item {
  background: var(--color-white);
  border-radius: var(--border-radius);
  overflow: hidden;
  box-shadow: var(--box-shadow);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.locations-cta__item:hover { transform: translateY(-4px); box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1); }

.locations-cta__image { position: relative; padding-top: 56.25%; overflow: hidden; }
.locations-cta__image img {
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform 0.3s ease;
}
.locations-cta__item:hover .locations-cta__image img { transform: scale(1.05); }

.locations-cta__item-content { padding: 1.25rem; }
.locations-cta__state {
  display: inline-block;
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--color-primary);
  margin-bottom: 0.5rem;
}
.locations-cta__name { font-size: 1.125rem; font-weight: 600; color: var(--color-text); margin: 0 0 0.5rem; }
.locations-cta__address { font-size: 0.875rem; color: var(--color-text-light); margin: 0 0 1rem; line-height: 1.5; }
.locations-cta__link {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--color-primary);
  text-decoration: none;
  transition: gap 0.2s ease;
}
.locations-cta__link:hover { gap: 0.5rem; }

.locations-cta__nav { display: flex; justify-content: center; gap: 0.75rem; margin-top: 2rem; }
.locations-cta__nav-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px; height: 48px;
  background: var(--color-white);
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 50%;
  color: var(--color-text);
  cursor: pointer;
  transition: all 0.2s ease;
}
.locations-cta__nav-btn:hover { background: var(--color-primary); color: var(--color-white); border-color: var(--color-primary); }

/* Layout: Side (1 state) — header left, carousel right */
@media (min-width: 1024px) {
  .locations-cta--layout-side .locations-cta__container {
    display: grid;
    grid-template-columns: 1fr 2fr;
    gap: 3rem;
    align-items: start;
  }
  .locations-cta--layout-side .locations-cta__header {
    text-align: left;
    max-width: none;
    margin: 0;
    position: sticky;
    top: 6rem;
  }
}

/* Layout: Stacked (2+ states) — header top, filter + carousel below */
.locations-cta--layout-stacked .locations-cta__header {
  text-align: center;
  margin-bottom: 1.5rem;
}

/* State Filter Buttons */
.locations-cta__state-filter {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.5rem;
  margin-bottom: 2rem;
}
.locations-cta__state-btn {
  padding: 0.5rem 1.25rem;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--color-text-light);
  background: transparent;
  border: 2px solid rgba(0, 0, 0, 0.1);
  border-radius: var(--border-radius-pill);
  cursor: pointer;
  transition: all 0.2s ease;
}
.locations-cta__state-btn:hover {
  border-color: var(--color-primary);
  color: var(--color-primary);
}
.locations-cta__state-btn.is-active {
  background: var(--color-primary);
  border-color: var(--color-primary);
  color: var(--color-white);
}

/* Hidden state for filtered items */
.locations-cta__item[hidden] {
  display: none;
}

/* Tablet: locations-cta */
@media (min-width: 768px) {
  .locations-cta {
    padding: 3rem 0;
  }
  .locations-cta__track {
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem;
  }
  .locations-cta__header {
    max-width: 700px;
  }
  .locations-cta__headline {
    font-size: 1.875rem;
  }
}

/* Desktop: locations-cta */
@media (min-width: 1024px) {
  .locations-cta {
    padding: 3rem 0;
  }
  .locations-cta__track {
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
  }
  .locations-cta__header {
    max-width: 800px;
    margin-bottom: 2.5rem;
  }
  .locations-cta__headline {
    font-size: 2.25rem;
  }
  .locations-cta__copy {
    font-size: 1rem;
  }
}

/* ==========================================================================
   LOCATIONS CTA - MULTI COLUMN
   ========================================================================== */

/* --- Section & Container --- */
.locations-cta-multi {
  background: var(--color-primary);
  padding: 48px 16px;
}
.locations-cta-multi__container {
  max-width: var(--container-max-width, 1200px);
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 32px;
}

/* --- Section Header --- */
.locations-cta-multi__header {
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: center;
  text-align: center;
  color: var(--color-bg, var(--color-gray));
  margin-bottom: 32px;
}
.locations-cta-multi__heading {
  font-family: var(--font-family-heading);
  font-weight: 600;
  font-size: 1.5625rem;
  line-height: 36px;
  color: var(--color-white);
  margin: 0 0 1rem;
}
.locations-cta-multi__subheading {
  font-family: var(--font-family-body);
  font-weight: 400;
  font-size: 1rem;
  line-height: 19.2px;
  margin: 0;
}

/* --- Mobile filter (hidden on desktop) --- */
.locations-cta-multi__mobile-filter {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.locations-cta-multi__filter-label {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
  color: var(--color-bg, var(--color-gray));
}
.locations-cta-multi__filter-label span {
  font-family: var(--font-family-body);
  font-weight: 600;
  font-size: 0.6875rem;
  line-height: 13.2px;
  text-transform: uppercase;
  letter-spacing: 0.44px;
}
.locations-cta-multi__filter-icon {
  width: 24px;
  height: 24px;
  flex-shrink: 0;
}

/* Pills container — horizontal scroll */
.locations-cta-multi__pills {
  display: flex;
  gap: 4px;
  overflow-x: auto;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
  margin-right: 4px;
}
.locations-cta-multi__pills::-webkit-scrollbar { display: none; }

/* Individual pill */
.locations-cta-multi__pill {
  flex-shrink: 0;
  white-space: nowrap;
  padding: 8px 16px;
  border-radius: var(--border-radius-pill);
  font-family: var(--font-family-heading);
  font-weight: 500;
  font-size: 1rem;
  line-height: 21.6px;
  cursor: pointer;
  transition: all 0.2s ease;
  /* Inactive state (default) */
  background: transparent;
  border: 1px solid var(--color-secondary);
  color: var(--color-secondary);
}
.locations-cta-multi__pill.is-active {
  background: var(--color-secondary);
  border-color: var(--color-secondary);
  color: var(--color-primary);
}

/* --- Mobile: columns are transparent wrappers --- */
.locations-cta-multi__column-header { display: none; }
.locations-cta-multi__col-nav { display: none; }
.locations-cta-multi__column {
  background: transparent;
  border-radius: 0;
  padding-bottom: 0;
}
.locations-cta-multi__col-carousel { padding: 0; }
.locations-cta-multi__column.is-mobile-hidden { display: none; }

/* --- Card (shared between mobile & desktop) --- */
.locations-cta-multi__card {
  background: var(--color-bg, var(--color-gray));
  border-top: 5px solid var(--color-accent);
  border-radius: var(--border-radius);
  overflow: hidden;
  box-shadow: 0 16px 32px -8px rgba(12, 12, 13, 0.4);
}
a.locations-cta-multi__card {
  display: block;
  color: inherit;
  text-decoration: none;
}
.locations-cta-multi__card[hidden] { display: none; }

/* Card image wrapper */
.locations-cta-multi__image-wrap {
  position: relative;
  height: 120px;
  overflow: hidden;
  border-radius: var(--border-radius);
  margin: 24px 24px 0;
}
.locations-cta-multi__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: var(--border-radius);
}
.locations-cta-multi__overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.15);
  border-radius: var(--border-radius);
  pointer-events: none;
  opacity: 0;
}
.locations-cta-multi__overlay.is-active {
  opacity: 1;
}

/* Badges on image */
.locations-cta-multi__badges {
  position: absolute;
  top: 6px;
  right: 5px;
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.locations-cta-multi__badge {
  padding: 6px;
  border-radius: var(--border-radius-pill);
  background: var(--color-primary-dark);
  color: var(--color-bg, var(--color-gray));
  font-family: var(--font-family-body);
  font-weight: 600;
  font-size: 0.5rem;
  line-height: normal;
  text-transform: uppercase;
  letter-spacing: 0.32px;
  white-space: nowrap;
}
.locations-cta-multi__badge--gender {
  background: var(--color-map-pink);
}

/* Card body */
.locations-cta-multi__card-body {
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: center;
  text-align: center;
  padding: 24px;
  min-height: 180px;
}
.locations-cta-multi__card-body--compact {
  padding: 20px 24px 22px;
  min-height: 120px;
}

/* Decorative line */
.locations-cta-multi__line {
  width: 50px;
  height: 2px;
  background: var(--color-accent);
}

/* Title */
.locations-cta-multi__title {
  font-family: var(--font-family-heading);
  font-weight: 600;
  font-size: 1.3125rem;
  line-height: 30px;
  color: var(--color-primary);
  margin: 0;
}
.locations-cta-multi__title a {
  color: inherit;
  text-decoration: none;
}
.locations-cta-multi__title a:hover {
  text-decoration: underline;
}

/* Description */
.locations-cta-multi__desc {
  font-family: var(--font-family-body);
  font-weight: 400;
  font-size: 1rem;
  line-height: 19.2px;
  color: var(--color-text);
  margin: 0;
}

/* City/State */
.locations-cta-multi__city-state {
  font-family: var(--font-family-body);
  font-weight: 600;
  font-size: 1rem;
  line-height: 19.2px;
  color: var(--color-primary);
  margin: 0;
  padding: 0;
}

/* --- Pagination (mobile) --- */
.locations-cta-multi__pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
}
.locations-cta-multi__nav-btn {
  background: none;
  border: none;
  color: var(--color-white);
  cursor: pointer;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
}
.locations-cta-multi__counter {
  font-family: var(--font-family-heading);
  font-weight: 500;
  font-size: 1rem;
  color: var(--color-white);
  text-align: center;
  user-select: none;
}

/* --- Mobile: grid is a block (single column, transparent columns) --- */
.locations-cta-multi__grid {
  display: block;
}

@media (min-width: 768px) {
  /* Hide mobile controls, show desktop grid */
  .locations-cta-multi__mobile-filter { display: none; }
  .locations-cta-multi [data-mobile-nav] { display: none; }

  .locations-cta-multi__grid { display: grid; gap: 2rem; grid-template-columns: 1fr; }

  .locations-cta-multi { padding: 48px 0; }
  .locations-cta-multi__container { padding: 0 var(--container-padding-right) 0 var(--container-padding-left); }

  /* Restore column visual styles for desktop */
  .locations-cta-multi__column-header { display: block; }
  .locations-cta-multi__col-nav { display: flex; }
  .locations-cta-multi__column {
    background: rgba(255, 255, 255, 0.08);
    border-radius: var(--border-radius);
    padding-bottom: 1.5rem;
  }
  .locations-cta-multi__column.is-mobile-hidden { display: block; }
  .locations-cta-multi__col-carousel { padding: 0 1rem; }

  .locations-cta-multi__grid--cols-2,
  .locations-cta-multi__grid--cols-3 {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (min-width: 1024px) {
  .locations-cta-multi { padding: 48px 0; }
  .locations-cta-multi__container { max-width: var(--container-max-width, 1280px); padding: 0 var(--container-padding-right) 0 var(--container-padding-left); }
  .locations-cta-multi__heading { font-size: 1.875rem; line-height: 36px; }
  .locations-cta-multi__grid { gap: 4px; }
  .locations-cta-multi__grid--cols-2 { grid-template-columns: repeat(2, 1fr); }
  .locations-cta-multi__grid--cols-3 { grid-template-columns: repeat(3, 1fr); }
  .locations-cta-multi__grid--cols-4 { grid-template-columns: repeat(4, 1fr); }
  .locations-cta-multi__grid--cols-5 { grid-template-columns: repeat(5, 1fr); }
  .locations-cta-multi__grid--cols-6 { grid-template-columns: repeat(6, 1fr); }
}

.locations-cta-multi.is-compact-carousel .locations-cta-multi__mobile-filter,
.locations-cta-multi.is-compact-carousel [data-mobile-nav] {
  display: flex;
}
.locations-cta-multi.is-compact-carousel .locations-cta-multi__grid {
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(var(--locations-compact-card-count, 1), minmax(0, 1fr));
}
.locations-cta-multi.is-compact-carousel .locations-cta-multi__column-header,
.locations-cta-multi.is-compact-carousel .locations-cta-multi__col-nav {
  display: none;
}
.locations-cta-multi.is-compact-carousel .locations-cta-multi__column {
  background: transparent;
  border-radius: 0;
  padding-bottom: 0;
}
.locations-cta-multi.is-compact-carousel .locations-cta-multi__column:not(.is-mobile-hidden),
.locations-cta-multi.is-compact-carousel .locations-cta-multi__col-carousel,
.locations-cta-multi.is-compact-carousel .locations-cta-multi__col-viewport {
  display: contents;
}
.locations-cta-multi.is-compact-carousel .locations-cta-multi__column.is-mobile-hidden {
  display: none;
}

/* Column & carousel — typography and layout (structural visibility set in MQ above) */
.locations-cta-multi__column { overflow: visible; }
.locations-cta-multi__column-header {
  padding: 2rem 1.5rem 1rem;
  text-align: center;
  color: var(--color-bg, var(--color-gray));
}
.locations-cta-multi__col-headline {
  font-family: var(--font-family-heading);
  font-weight: 600;
  font-size: clamp(1.25rem, 2.5vw, 1.5rem);
  margin: 0 0 0.5rem;
  color: inherit;
}
.locations-cta-multi__col-copy {
  font-family: var(--font-family-body);
  font-size: 0.875rem;
  line-height: 1.4;
  color: rgb(248, 245, 245);
  margin: 0;
}

/* Desktop carousel (per-column) */
.locations-cta-multi__col-nav {
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin-top: 1rem;
}
.locations-cta-multi__col-nav .locations-cta-multi__nav-btn {
  width: 32px;
  height: 32px;
}
.locations-cta-multi__col-nav .locations-cta-multi__counter {
  font-size: 0.875rem;
  color: rgb(248, 245, 245);
}

/* ==========================================================================
   WHAT WE TREAT CTA
   ========================================================================== */

.what-we-treat-cta { padding: 4rem 0; }
.what-we-treat-cta__container { max-width: var(--container-max-width); margin: 0 auto; padding: var(--container-padding-top) var(--container-padding-right) var(--container-padding-bottom) var(--container-padding-left); }
.what-we-treat-cta__header { text-align: center; max-width: 600px; margin: 0 auto 2.5rem; }
.what-we-treat-cta__headline { font-size: clamp(1.75rem, 4vw, 2.25rem); font-weight: 700; margin: 0 0 0.75rem; }
.what-we-treat-cta__copy { font-size: 1.125rem; line-height: 1.6; color: var(--color-text-light); margin: 0; }

/* Tabs Mode */
.what-we-treat-cta__tabs {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.5rem;
  margin-bottom: 2rem;
}
.what-we-treat-cta__tab {
  padding: 0.75rem 1.5rem;
  font-size: 0.9375rem;
  font-weight: 500;
  color: var(--color-text-light);
  background: transparent;
  border: 2px solid rgba(0, 0, 0, 0.1);
  border-radius: var(--border-radius-pill);
  cursor: pointer;
  transition: all 0.2s ease;
}
.what-we-treat-cta__tab:hover { border-color: var(--color-primary); color: var(--color-primary); }
.what-we-treat-cta__tab.is-active { background: var(--color-primary); border-color: var(--color-primary); color: var(--color-white); }

.what-we-treat-cta__panel { display: none; }
.what-we-treat-cta__panel.is-active { display: block; animation: fadeIn 0.2s ease; }

/* Accordion Mode */
.what-we-treat-cta__accordion { border: 1px solid rgba(0, 0, 0, 0.1); border-radius: var(--border-radius); overflow: hidden; max-width: 800px; margin: 0 auto; }
.what-we-treat-cta__accordion-item { border-bottom: 1px solid rgba(0, 0, 0, 0.1); }
.what-we-treat-cta__accordion-item:last-child { border-bottom: none; }
.what-we-treat-cta__accordion-trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 1rem 1.25rem;
  font-size: 1rem;
  font-weight: 500;
  text-align: left;
  color: var(--color-text);
  background: var(--color-white);
  border: none;
  cursor: pointer;
  transition: background-color 0.2s ease;
}
.what-we-treat-cta__accordion-trigger:hover { background: rgba(0, 0, 0, 0.02); }
.what-we-treat-cta__accordion-item[open] .what-we-treat-cta__accordion-trigger { background: rgba(0, 0, 0, 0.02); }
.what-we-treat-cta__accordion-title { flex: 1; }
.what-we-treat-cta__accordion-content { display: flow-root; padding: 0 1.25rem 1.25rem; background: var(--color-white); }

/* Shared shortcode/component Accordion controls */
.custom-accordion-container[class*="custom-accordion-container--symbol-"] summary {
  position: relative;
  list-style: none;
}
.custom-accordion-container[class*="custom-accordion-container--symbol-"] summary::-webkit-details-marker { display: none; }
.custom-accordion-container.custom-accordion-container--symbol-plus-minus summary::after,
.custom-accordion-container.custom-accordion-container--symbol-caret summary::after {
  position: absolute;
  top: 50%;
  color: currentColor;
}
.custom-accordion-container.custom-accordion-container--symbol-plus-minus summary::after {
  content: '+';
  transform: translateY(-50%);
}
.custom-accordion-container.custom-accordion-container--symbol-plus-minus details[open] summary::after { content: '−'; }
.custom-accordion-container.custom-accordion-container--symbol-caret summary::after {
  content: '';
  width: 0.55rem;
  height: 0.55rem;
  border: 0;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: translateY(-65%) rotate(45deg);
  transition: transform 0.2s ease;
}
.custom-accordion-container.custom-accordion-container--symbol-caret details[open] summary::after {
  content: '';
  transform: translateY(-35%) rotate(225deg);
}
.custom-accordion-container.custom-accordion-container--position-left summary { padding-left: 3rem; }
.custom-accordion-container.custom-accordion-container--position-left summary::after { right: auto; left: 1rem; }
.custom-accordion-container.custom-accordion-container--position-right summary { padding-right: 3rem; }
.custom-accordion-container.custom-accordion-container--position-right summary::after { right: 1rem; left: auto; }

/* Conditions List */
.what-we-treat-cta__conditions {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 0.5rem 1.5rem;
  list-style: none;
  padding: 0;
  margin: 0;
}
.what-we-treat-cta__condition a {
  display: block;
  padding: 0.5rem 0;
  font-size: 0.9375rem;
  color: var(--color-text);
  text-decoration: none;
  transition: color 0.2s ease;
}
.what-we-treat-cta__condition a:hover { color: var(--color-primary); }

/* ==========================================================================
   OUTCOMES CTA
   ========================================================================== */

.outcomes-cta { padding: 4rem 0; }
.outcomes-cta__container { max-width: var(--container-max-width); margin: 0 auto; padding: var(--container-padding-top) var(--container-padding-right) var(--container-padding-bottom) var(--container-padding-left); text-align: center; }

.outcomes-cta--bg-primary { background-color: var(--color-primary); }
.outcomes-cta--bg-primary-dark { background-color: var(--color-primary-dark); }
.outcomes-cta--bg-secondary { background-color: var(--color-secondary); }
.outcomes-cta--bg-light { background-color: var(--color-secondary); }
.outcomes-cta--bg-dark { background-color: var(--color-primary); }

.outcomes-cta--text-light { color: var(--color-white); }
.outcomes-cta--text-dark { color: var(--color-text); }

.outcomes-cta__header { max-width: 600px; margin: 0 auto 2.5rem; }
.outcomes-cta__headline { font-size: clamp(1.75rem, 4vw, 2.25rem); font-weight: 700; margin: 0 0 0.75rem; line-height: 1.2; }
.outcomes-cta__copy { font-size: 1.125rem; line-height: 1.6; margin: 0; }
.outcomes-cta--text-light .outcomes-cta__copy { opacity: 0.9; }

.outcomes-cta__stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 2rem;
  max-width: 1000px;
  margin: 0 auto;
}
.outcomes-cta__stat { padding: 1.5rem; }
.outcomes-cta__stat-value {
  display: block;
  font-size: clamp(2.5rem, 6vw, 4rem);
  font-weight: 700;
  line-height: 1;
  margin-bottom: 0.5rem;
}
.outcomes-cta__stat-label {
  display: block;
  font-size: 1rem;
  font-weight: 600;
  margin-bottom: 0.25rem;
}
.outcomes-cta__stat-desc {
  display: block;
  font-size: 0.875rem;
  opacity: 0.8;
}

.outcomes-cta__action { margin-top: 2.5rem; }
.outcomes-cta__link {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 1rem;
  font-weight: 600;
  text-decoration: none;
  padding: 0.875rem 1.75rem;
  border-radius: var(--border-radius);
  transition: all 0.2s ease;
}
.outcomes-cta--text-light .outcomes-cta__link { background: var(--color-white); color: var(--color-primary); }
.outcomes-cta--text-light .outcomes-cta__link:hover { background: rgba(255, 255, 255, 0.9); transform: translateY(-2px); }
.outcomes-cta--text-dark .outcomes-cta__link { background: var(--color-primary); color: var(--color-white); }
.outcomes-cta--text-dark .outcomes-cta__link:hover { background: var(--color-primary-dark); }

@media (max-width: 767px) {
  .outcomes-cta { padding: 3rem 0; }
  .outcomes-cta__stats { gap: 1rem; }
  .outcomes-cta__stat { padding: 1rem; }
}

/* ==========================================================================
   FORM SECTION
   ========================================================================== */

.form-section { padding: 4rem 0; }
.form-section__container { max-width: var(--container-max-width); margin: 0 auto; padding: var(--container-padding-top) var(--container-padding-right) var(--container-padding-bottom) var(--container-padding-left); }

.form-section--bg-secondary,
.form-section--bg-light { background-color: var(--color-secondary); }
.form-section--bg-primary,
.form-section--bg-dark { background-color: var(--color-primary); }
.form-section--bg-primary-dark { background-color: var(--color-primary-dark); }

.form-section--text-light { color: var(--color-white); }
.form-section--text-dark { color: var(--color-text); }

/* Centered Layout */
.form-section--layout-centered .form-section__inner { max-width: 700px; margin: 0 auto; text-align: center; }
.form-section--layout-centered .form-section__content { margin-bottom: 2rem; }
.form-section--layout-centered .form-section__form { text-align: left; }

/* Side Layouts */
.form-section--layout-side-left .form-section__inner,
.form-section--layout-side-right .form-section__inner {
  display: grid;
  gap: 3rem;
  align-items: start;
}
@media (min-width: 768px) {
  .form-section--layout-side-left .form-section__inner,
  .form-section--layout-side-right .form-section__inner {
    grid-template-columns: 1fr 1fr;
  }
}
.form-section--layout-side-right .form-section__form { order: -1; }
@media (min-width: 768px) {
  .form-section--layout-side-right .form-section__form { order: 0; }
  .form-section--layout-side-right .form-section__content { order: 1; }
}

.form-section__headline { color: inherit; font-size: clamp(1.75rem, 4vw, 2.5rem); font-weight: 700; margin: 0 0 1rem; line-height: 1.2; }
.form-section__copy { font-size: 1.125rem; line-height: 1.5; }
.form-section__copy p { margin: 0 0 1rem; }
.form-section__copy p:last-child { margin-bottom: 0; }
.form-section--text-light .form-section__copy { opacity: 0.9; }

.form-section__form { padding: 2rem; border-radius: var(--border-radius); position: relative; }

/* Light variant: teal form card with light text */
.form-section--bg-light .form-section__form {
  background: var(--color-primary);
  color: var(--color-gray);
  box-shadow: 0 16px 32px -8px rgba(12, 12, 13, 0.4);
}

/* Dark variant: lavender form card with dark text */
.form-section--bg-dark .form-section__form {
  background: var(--color-secondary);
  color: var(--color-text);
  box-shadow: none;
}

.form-section__placeholder { color: var(--color-text-light); text-align: center; padding: 2rem; }

@media (max-width: 767px) {
  .form-section { padding: 3rem 0; }
  .form-section__form { padding: 1.5rem; }
}

/* ==========================================================================
   GOOGLE MAP
   ========================================================================== */

.google-map { position: relative; }
.google-map__container { max-width: var(--container-max-width); margin: 0 auto; padding: var(--container-padding-top) var(--container-padding-right) var(--container-padding-bottom) var(--container-padding-left); }

.google-map__header { padding: 2rem 0; text-align: center; }
.google-map__headline { font-size: clamp(1.5rem, 3vw, 2rem); font-weight: 700; margin: 0; }

.google-map__wrapper { position: relative; width: 100%; background: var(--color-secondary); }
.google-map__wrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.google-map__interactive { width: 100%; height: 100%; }
.google-map__loading {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  color: var(--color-text-light);
  font-size: 0.875rem;
}

/* Tablet: google-map */
@media (min-width: 768px) {
  .google-map__wrapper { min-height: 350px; }
}

/* Desktop: google-map */
@media (min-width: 1024px) {
  .google-map__wrapper { min-height: 400px; }
}


/* ==========================================================================
   BREADCRUMBS
   ========================================================================== */

.breadcrumbs {
  font-size: 0.875rem;
  color: var(--color-text-light);
}

.breadcrumbs__list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  list-style: none;
  padding: 0;
  margin: 0;
}

.breadcrumbs__item {
  display: flex;
  align-items: center;
}

.breadcrumbs__item:not(:last-child)::after {
  content: '/';
  margin-left: 0.5rem;
  opacity: 0.5;
}

.breadcrumbs__link {
  color: var(--color-primary);
  text-decoration: none;
  transition: color 0.2s ease;
}

.breadcrumbs__link:hover {
  text-decoration: underline;
}

.breadcrumbs__current {
  color: var(--color-text-light);
}

/* ==========================================================================
   404 ERROR PAGE
   ========================================================================== */

.error-404 {
  padding: 6rem 0;
  text-align: center;
}

.error-404__container {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: var(--container-padding-top) var(--container-padding-right) var(--container-padding-bottom) var(--container-padding-left);
}

.error-404__content {
  max-width: 600px;
  margin: 0 auto;
}

.error-404__code {
  display: block;
  font-size: clamp(6rem, 20vw, 12rem);
  font-weight: 800;
  line-height: 1;
  color: var(--color-primary);
  opacity: 0.15;
  margin-bottom: -1rem;
}

.error-404__title {
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  font-weight: 700;
  margin: 0 0 1rem;
}

.error-404__description {
  font-size: 1.125rem;
  line-height: 1.5;
  color: var(--color-text-light);
  margin: 0 0 2rem;
}

.error-404__actions {
  margin-bottom: 3rem;
}

.error-404__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.875rem 2rem;
  font-size: 1rem;
  font-weight: 600;
  color: var(--color-white);
  background-color: var(--color-primary);
  text-decoration: none;
  border-radius: var(--border-radius);
  transition: all 0.2s ease;
}

.error-404__button:hover {
  background-color: var(--color-primary-dark);
  transform: translateY(-2px);
}

.error-404__search {
  padding-top: 2rem;
  border-top: 1px solid rgba(0, 0, 0, 0.1);
}

.error-404__search-label {
  font-size: 0.9375rem;
  color: var(--color-text-light);
  margin: 0 0 1rem;
}

.error-404__search .search-form {
  display: flex;
  max-width: 400px;
  margin: 0 auto;
  gap: 0.5rem;
}

.error-404__search .search-field {
  flex: 1;
  padding: 0.75rem 1rem;
  font-size: 1rem;
  border: 1px solid rgba(0, 0, 0, 0.15);
  border-radius: var(--border-radius);
  outline: none;
  transition: border-color 0.2s ease;
}

.error-404__search .search-field:focus {
  border-color: var(--color-primary);
}

.error-404__search .search-submit {
  padding: 0.75rem 1.5rem;
  font-size: 1rem;
  font-weight: 600;
  color: var(--color-white);
  background-color: var(--color-primary);
  border: none;
  border-radius: var(--border-radius);
  cursor: pointer;
  transition: background-color 0.2s ease;
}

.error-404__search .search-submit:hover {
  background-color: var(--color-primary-dark);
}

/* ==========================================================================
   SINGLE POST
   ========================================================================== */

.single-post {
  padding-bottom: 3rem;
}

.single-post__container {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: var(--container-padding-top) var(--container-padding-right) var(--container-padding-bottom) var(--container-padding-left);
}

.single-post__container--narrow {
  max-width: 720px;
}

/* Header */
.single-post__header {
  padding: 3rem 0 2rem;
}

.single-post__breadcrumbs {
  margin-bottom: 1.5rem;
}

.single-post__categories {
  margin-bottom: 1rem;
}

.single-post__category {
  display: inline-block;
  padding: 0.25rem 0.75rem;
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--color-primary);
  background-color: rgba(37, 99, 235, 0.1);
  text-decoration: none;
  border-radius: var(--border-radius-pill);
  transition: all 0.2s ease;
}

.single-post__category:hover {
  background-color: var(--color-primary);
  color: var(--color-white);
}

.single-post__title {
  font-size: clamp(2rem, 5vw, 3rem);
  font-weight: 700;
  line-height: 1.2;
  margin: 0 0 1.5rem;
}

.single-post__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem;
  font-size: 0.9375rem;
  color: var(--color-text-light);
}

.single-post__meta a {
  color: var(--color-link);
  text-decoration: none;
}

.single-post__meta a:hover {
  text-decoration: underline;
}

.single-post__date,
.single-post__author,
.single-post__reading-time {
  display: flex;
  align-items: center;
}

.single-post__date::after,
.single-post__author::after {
  content: '·';
  margin-left: 1rem;
  color: var(--color-text-light);
  opacity: 0.5;
}

.single-post__reading-time::before {
  content: none;
}

/* Featured Image */
.single-post__featured-image {
  margin-bottom: 2.5rem;
}

.single-post__image {
  width: 100%;
  height: auto;
  border-radius: var(--border-radius);
}

/* Content */
.single-post__content {
  padding-bottom: 2.5rem;
}

.single-post__content p {
  font-size: 1.125rem;
  line-height: 1.5;
  margin: 0 0 1.5rem;
  color: var(--color-text);
}

.single-post__content h2 {
  font-size: 1.75rem;
  font-weight: 700;
  margin: 2.5rem 0 1rem;
  color: var(--color-text);
}

.single-post__content h3 {
  font-size: 1.375rem;
  font-weight: 600;
  margin: 2rem 0 0.75rem;
  color: var(--color-text);
}

.single-post__content h4 {
  font-size: 1.125rem;
  font-weight: 600;
  margin: 1.5rem 0 0.5rem;
  color: var(--color-text);
}

.single-post__content a {
  color: var(--color-link);
  text-decoration: underline;
}

.single-post__content a:hover {
  text-decoration: none;
}

.single-post__content ul,
.single-post__content ol {
  margin: 0 0 1.5rem;
  padding-left: 1.5rem;
}

.single-post__content li {
  font-size: 1.125rem;
  line-height: 1.5;
  margin-bottom: 0.5rem;
}

.single-post__content blockquote {
  margin: 2rem 0;
  padding: 1.5rem 2rem;
  background-color: var(--color-secondary);
  border-left: 4px solid var(--color-primary);
  font-size: 1.25rem;
  font-style: italic;
  color: var(--color-text);
}

.single-post__content blockquote p:last-child {
  margin-bottom: 0;
}

.single-post__content img {
  max-width: 100%;
  height: auto;
  border-radius: var(--border-radius);
}

/* WordPress image alignment — mobile-first (full-width, no float) */
.single-post__content .alignleft,
.single-post__content .alignright,
.single-post__content .aligncenter,
.single-post__content .alignnone {
  display: block;
  width: 100%;
  height: auto;
  margin: 1rem 0;
  float: none;
}
.single-post__content .aligncenter {
  margin-left: auto;
  margin-right: auto;
}

/* Desktop: WordPress image alignment — float with text wrap */
@media (min-width: 768px) {
  .single-post__content .alignleft {
    float: left;
    width: auto;
    max-width: 50%;
    margin: 0.25rem 1.5rem 1rem 0;
  }
  .single-post__content .alignright {
    float: right;
    width: auto;
    max-width: 50%;
    margin: 0.25rem 0 1rem 1.5rem;
  }
  .single-post__content .aligncenter {
    width: auto;
    max-width: 100%;
  }
  .single-post__content .alignnone {
    width: auto;
    max-width: 100%;
  }
}

.single-post__content figure {
  margin: 2rem 0;
}

.single-post__content figcaption {
  font-size: 0.875rem;
  color: var(--color-text-light);
  text-align: center;
  margin-top: 0.5rem;
}

/* Footer - Tags */
.single-post__footer {
  padding: 2rem 0;
  border-top: 1px solid rgba(0, 0, 0, 0.1);
}

.single-post__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.single-post__tag {
  display: inline-block;
  padding: 0.375rem 1rem;
  font-size: 0.875rem;
  color: var(--color-text-light);
  background-color: var(--color-neutral);
  text-decoration: none;
  border-radius: var(--border-radius);
  transition: all 0.2s ease;
}

.single-post__tag:hover {
  background-color: var(--color-primary);
  color: var(--color-white);
}

/* Author Box */
.author-box {
  padding: 3rem 2rem;
  background-color: var(--color-secondary);
}

.author-box__inner {
  display: flex;
  gap: 1.5rem;
  align-items: flex-start;
}

.author-box__avatar img {
  width: 80px;
  height: 80px;
  border-radius: 50%;
}

.author-box__content {
  flex: 1;
}

.author-box__name {
  font-size: 1.25rem;
  font-weight: 600;
  margin: 0 0 0.5rem;
}

.author-box__name a {
  color: var(--color-text);
  text-decoration: none;
}

.author-box__name a:hover {
  color: var(--color-primary);
}

.author-box__bio {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: var(--color-text);
  margin: 0;
}

.author-box__bio > :last-child {
  margin-bottom: 0;
}

/* Post Navigation */
.post-navigation {
  padding: 2.5rem 0;
  border-top: 1px solid rgba(0, 0, 0, 0.1);
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.post-navigation__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem;
}

.post-navigation__link {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  text-decoration: none;
  padding: 1rem;
  border-radius: var(--border-radius);
  transition: background-color 0.2s ease;
}

.post-navigation__link:hover {
  background-color: var(--color-secondary);
}

.post-navigation__link--next {
  text-align: right;
}

.post-navigation__label {
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--color-text-light);
}

.post-navigation__title {
  font-size: 1rem;
  font-weight: 600;
  color: var(--color-text);
  line-height: 1.4;
}

.post-navigation__link:hover .post-navigation__title {
  color: var(--color-primary);
}

/* Comments Section */
.single-post__comments {
  padding: 3rem 0;
}

@media (max-width: 767px) {
  .single-post__header {
    padding: 2rem 0 1.5rem;
  }

  .single-post__meta {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.5rem;
  }

  .single-post__date::after,
  .single-post__author::after {
    display: none;
  }

  .author-box__inner {
    flex-direction: column;
    text-align: center;
    align-items: center;
  }

  .post-navigation__inner {
    grid-template-columns: 1fr;
  }

  .post-navigation__link--next {
    text-align: left;
  }
}

/* ==========================================================================
   ARCHIVE / BLOG INDEX
   ========================================================================== */

.archive-header {
  padding: 3rem 0 2rem;
  background-color: var(--color-secondary);
}

.archive-header__container {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: var(--container-padding-top) var(--container-padding-right) var(--container-padding-bottom) var(--container-padding-left);
}

.archive-header__breadcrumbs {
  margin-bottom: 1rem;
}

.archive-header__title {
  font-size: clamp(2rem, 5vw, 3rem);
  font-weight: 700;
  margin: 0;
}

.archive-header__description {
  font-size: 1.125rem;
  line-height: 1.5;
  color: var(--color-text-light);
  margin: 1rem 0 0;
  max-width: 700px;
}

.archive-header__description p {
  margin: 0;
}

/* Archive Content */
.archive-content {
  padding: 3rem 0;
}

.archive-content__container {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: var(--container-padding-top) var(--container-padding-right) var(--container-padding-bottom) var(--container-padding-left);
}

/* Legacy index/archive card grid. Keep this separate from the Archive Page component wrapper. */
.archive-posts--legacy-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 2rem;
}

/* Archive Post Card */
.archive-post {
  display: flex;
  flex-direction: column;
  background: var(--color-white);
  border-radius: var(--border-radius);
  overflow: hidden;
  box-shadow: var(--box-shadow);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.archive-post:hover {
  transform: translateY(-4px);
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
}

.archive-post__image-link {
  display: block;
}

.archive-post__image {
  position: relative;
  padding-top: 56.25%;
  overflow: hidden;
}

.archive-post__image img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s ease;
}

.archive-post:hover .archive-post__image img {
  transform: scale(1.05);
}

.archive-post__content {
  flex: 1;
  display: flex;
  flex-direction: column;
  padding: 1.5rem;
}

.archive-post__category {
  display: inline-block;
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--color-primary);
  text-decoration: none;
  margin-bottom: 0.75rem;
}

.archive-post__category:hover {
  text-decoration: underline;
}

.archive-post__title {
  font-size: 1.25rem;
  font-weight: 600;
  line-height: 1.3;
  margin: 0 0 0.75rem;
}

.archive-post__title a {
  color: var(--color-text);
  text-decoration: none;
  transition: color 0.2s ease;
}

.archive-post__title a:hover {
  color: var(--color-primary);
}

.archive-post__excerpt {
  flex: 1;
  font-size: 0.9375rem;
  line-height: 1.6;
  color: var(--color-text-light);
  margin-bottom: 1rem;
}

.archive-post__excerpt p {
  margin: 0;
}

.archive-post__meta {
  display: flex;
  align-items: center;
  gap: 1rem;
  font-size: 0.8125rem;
  color: var(--color-text-light);
  padding-top: 1rem;
  border-top: 1px solid rgba(0, 0, 0, 0.05);
  margin-top: auto;
}

/* Pagination */
.navigation.pagination {
  margin-top: 3rem;
  padding-top: 2rem;
  border-top: 1px solid rgba(0, 0, 0, 0.1);
}

.nav-links {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  height: 40px;
  padding: 0 0.75rem;
  font-size: 0.9375rem;
  font-weight: 500;
  color: var(--color-text);
  text-decoration: none;
  background: var(--color-white);
  border: 1px solid rgba(0, 0, 0, 0.15);
  border-radius: var(--border-radius);
  transition: all 0.2s ease;
}

.page-numbers:hover {
  border-color: var(--color-primary);
  color: var(--color-primary);
}

.page-numbers.current {
  background: var(--color-primary);
  border-color: var(--color-primary);
  color: var(--color-white);
}

.page-numbers.dots {
  border: none;
  background: transparent;
}

.page-numbers.prev,
.page-numbers.next {
  font-size: 1.25rem;
}

/* Empty Archive */
.archive-empty {
  text-align: center;
  padding: 4rem 0;
}

.archive-empty p {
  font-size: 1.125rem;
  color: var(--color-text-light);
  margin: 0;
}

@media (max-width: 767px) {
  .archive-header {
    padding: 2rem 0 1.5rem;
  }

  .archive-content {
    padding: 2rem 0;
  }

  .archive-posts--legacy-grid {
    grid-template-columns: 1fr;
  }
}

/* ==========================================================================
   UTILITY BAR
   ========================================================================== */

.utility-bar {
  font-size: 0.8125rem;
  line-height: 1.4;
  background-color: var(--utility-bar-bg-color);
  color: var(--utility-bar-text-color);
  position: sticky;
  top: 0;
  z-index: 101;
}

.utility-bar--bg-dark,
.utility-bar--bg-light,
.utility-bar--bg-primary,
.utility-bar--bg-custom {
  background-color: var(--utility-bar-bg-color);
  color: var(--utility-bar-text-color);
}

.utility-bar__container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: var(--utility-bar-padding-y) var(--container-padding-right) var(--utility-bar-padding-y) var(--container-padding-left);
  gap: 1rem;
}

.utility-bar__left {
  display: flex;
  align-items: center;
  gap: 1.5rem;
}

.utility-bar__right {
  display: flex;
  align-items: center;
  gap: 1.5rem;
}

.utility-bar__text {
  opacity: 0.9;
}

.utility-bar__menu {
  display: flex;
  align-items: center;
  gap: 1rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.utility-bar__menu a {
  color: inherit;
  text-decoration: none;
  opacity: 0.9;
  transition: opacity 0.2s ease;
}

.utility-bar__menu a:hover {
  opacity: 1;
  text-decoration: underline;
}

.utility-bar__link {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  color: inherit;
  text-decoration: none;
  opacity: 0.9;
  transition: opacity 0.2s ease;
}

.utility-bar__link:hover {
  opacity: 1;
}

.utility-bar__icon {
  flex-shrink: 0;
}

/* Utility Bar Social Links */
.utility-bar__social {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.utility-bar__social-link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  color: inherit;
  opacity: 0.8;
  transition: opacity 0.2s ease;
}

.utility-bar__social-link:hover {
  opacity: 1;
}

/* Utility Bar CTA Button */
.utility-bar__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.375rem 1rem;
  font-size: 0.8125rem;
  font-weight: 600;
  text-decoration: none;
  border-radius: var(--border-radius);
  transition: all 0.2s ease;
}

.utility-bar--bg-dark .utility-bar__cta {
  background-color: var(--color-primary);
  color: var(--color-white);
}

.utility-bar--bg-dark .utility-bar__cta:hover {
  background-color: var(--color-primary-dark);
}

.utility-bar--bg-primary .utility-bar__cta {
  background-color: var(--color-white);
  color: var(--color-primary);
}

.utility-bar--bg-light .utility-bar__cta {
  background-color: var(--color-primary);
  color: var(--color-white);
}

/* Utility Bar Phone */
.utility-bar__phone {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  color: inherit;
  text-decoration: none;
  font-weight: 500;
  transition: opacity 0.2s ease;
}

.utility-bar__phone:hover {
  opacity: 0.8;
}

.utility-bar__phone-icon {
  flex-shrink: 0;
  opacity: 0.9;
}

.utility-bar__phone-label {
  opacity: 0.9;
}

.utility-bar__phone-number {
  font-weight: 600;
}

/* Utility Bar Divider */
.utility-bar__divider {
  width: 1px;
  height: 1rem;
  background-color: currentColor;
  opacity: 0.3;
}

@media (max-width: 767px) {
  .utility-bar {
    position: sticky;
    top: 0;
    z-index: 300;
  }

  .utility-bar__menu,
  .utility-bar__divider,
  .utility-bar__cta,
  .utility-bar__social {
    display: none;
  }

  .utility-bar__container {
    padding: 0.75rem 1rem;
  }

  .utility-bar__left {
    flex: 1;
    justify-content: space-between;
  }

  .utility-bar__right {
    display: none;
  }

  .utility-bar__phone {
    margin-left: auto;
  }

  .utility-bar__phone-label {
    display: none;
  }
}

/* ==========================================================================
   SITE HEADER
   ========================================================================== */

.site-header {
  position: relative;
  background-color: var(--color-white);
  color: var(--header-text-color);
  border-bottom: var(--header-border-width) solid var(--header-border-color);
  z-index: 100;
}

.site-header--sticky-always {
  position: sticky;
  top: var(--utility-bar-height);
}

.site-header--sticky-scroll {
  position: sticky;
  top: var(--utility-bar-height);
  transition: transform 0.3s ease;
}

.site-header--sticky-scroll.is-hidden {
  transform: translateY(-100%);
}

.site-header--transparent {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  background-color: transparent;
}

.site-header--transparent:not(.is-scrolled) {
  color: var(--color-white);
}

.site-header--transparent.is-scrolled {
  position: fixed;
  background-color: var(--color-white);
  box-shadow: var(--box-shadow);
}

.site-header__container {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: var(--container-padding-top) var(--container-padding-right) var(--container-padding-bottom) var(--container-padding-left);
}

.site-header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: var(--header-min-height);
  padding-top: var(--header-padding-y);
  padding-bottom: var(--header-padding-y);
  gap: 2rem;
}

/* Centered nav layout */
.site-header--nav-centered .site-header__inner {
  flex-direction: column;
  padding: 1rem 0;
  gap: 1rem;
}

.site-header--nav-centered .site-header__top {
  width: 100%;
  text-align: center;
}

.site-header--nav-centered .site-header__bottom {
  width: 100%;
  display: flex;
  justify-content: center;
}

/* Logo */
.site-header__branding {
  flex-shrink: 0;
}

.site-header__logo-link {
  display: block;
  text-decoration: none;
}

.site-header__logo {
  display: block;
  max-width: var(--header-logo-width);
  height: auto;
}

.site-header__logo--mobile {
  display: none;
}

.site-header__site-name {
  font-size: 1.5rem;
  font-weight: 700;
  color: inherit;
}

.site-header__logo-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.5rem 1rem;
  background-color: var(--color-primary);
  color: var(--color-white);
  font-size: 1.25rem;
  font-weight: 700;
  border-radius: var(--border-radius);
}

/* Navigation */
.site-header__nav {
  flex: 1;
  display: flex;
  justify-content: center;
}

.site-header__menu {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.site-header__menu > li {
  position: relative;
  display: flex;
  align-items: center;
}

.site-header__menu > li > a {
  display: flex;
  align-items: center;
  padding: 0.75rem 0.75rem;
  font-size: 0.9375rem;
  font-weight: 500;
  color: inherit;
  text-decoration: none;
  transition: color 0.2s ease;
}

.site-header__menu > li > a:hover,
.site-header__menu > li.current-menu-item > a {
  color: var(--color-primary);
}

/* Dropdown arrow via CSS */
.site-header__menu > li.menu-item-has-children > a::after {
  content: '';
  display: inline-block;
  width: 0;
  height: 0;
  margin-left: 0.375rem;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 5px solid currentColor;
  opacity: 0.6;
  transition: transform 0.2s ease;
}

.site-header__menu > li.menu-item-has-children:hover > a::after {
  transform: rotate(180deg);
}

/* Dropdown menus */
.site-header__menu .sub-menu {
  position: absolute;
  top: 100%;
  left: 0;
  min-width: 200px;
  background: var(--color-white);
  border-radius: var(--border-radius);
  box-shadow: var(--box-shadow);
  list-style: none;
  margin: 0;
  padding: 0.5rem 0;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-10px);
  transition: all 0.2s ease;
}

.site-header__menu > li:hover > .sub-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.site-header__menu .sub-menu a {
  display: block;
  padding: 0.625rem 1.25rem;
  font-size: var(--header-nav-font-size);
  color: var(--color-text);
  text-decoration: none;
  transition: background-color 0.2s ease;
}

.site-header__menu .sub-menu a:hover {
  background-color: var(--color-neutral);
  color: var(--color-primary);
}

/* ==========================================================================
   MEGA MENU
   ========================================================================== */

.site-header--mega-menu .menu-item--has-mega-menu {
  position: static;
}

.mega-menu {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  background: var(--color-white);
  box-shadow: var(--box-shadow);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-10px);
  transition: all 0.25s ease;
  z-index: 1000;
}

/* Dropdown animations */
.site-header--dropdown-fade .mega-menu,
.site-header--dropdown-fade .sub-menu {
  transform: none;
  transition: opacity 0.2s ease, visibility 0.2s ease;
}

.site-header--dropdown-slide-down .mega-menu,
.site-header--dropdown-slide-down .sub-menu {
  transform: translateY(-10px);
  transition: all 0.25s ease;
}

.site-header--dropdown-none .mega-menu,
.site-header--dropdown-none .sub-menu {
  transition: none;
}

.menu-item--has-mega-menu:hover > .mega-menu,
.menu-item--has-mega-menu.is-open > .mega-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.mega-menu__inner {
  max-width: var(--container-max-width, 1200px);
  margin: 0 auto;
  padding: 2rem 1rem;
}

.mega-menu__columns {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 2rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.mega-menu__column {
  display: flex;
  flex-direction: column;
}

.mega-menu__column-title {
  display: block;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--color-primary);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 1rem;
  padding-bottom: 0.5rem;
  border-bottom: 2px solid var(--color-primary);
}

.mega-menu__column-link {
  display: block;
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--color-text);
  text-decoration: none;
  margin-bottom: 0.75rem;
  transition: color 0.2s ease;
}

.mega-menu__column-link:hover {
  color: var(--color-primary);
}

.mega-menu__links {
  list-style: none;
  margin: 0;
  padding: 0;
}

.mega-menu__links li {
  margin-bottom: 0;
}

.mega-menu__link {
  display: block;
  font-size: 0.875rem;
  color: var(--color-text-light);
  text-decoration: none;
  padding: 0.375rem 0;
  transition: color 0.2s ease;
}

.mega-menu__link:hover {
  color: var(--color-primary);
}


/* Header Actions */
.site-header__actions {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-shrink: 0;
}

.site-header__phone-btn {
  display: none;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  color: var(--color-primary);
  border: 1px solid var(--color-primary);
  border-radius: 50%;
  transition: all 0.2s ease;
}

.site-header__phone-btn:hover {
  background-color: var(--color-primary);
  color: var(--color-white);
}

.site-header__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.625rem 1.25rem;
  font-size: 0.875rem;
  font-weight: 600;
  text-decoration: none;
  border-radius: var(--border-radius);
  transition: all 0.2s ease;
}

.site-header__cta--primary {
  background-color: var(--color-primary);
  color: var(--color-white);
}

.site-header__cta--primary:hover {
  background-color: var(--color-primary-dark);
}

.site-header__cta--outline {
  background-color: transparent;
  color: var(--color-primary);
  border: 2px solid var(--color-primary);
}

.site-header__cta--outline:hover {
  background-color: var(--color-primary);
  color: var(--color-white);
}

/* Menu Toggle */
.site-header__menu-toggle {
  display: none;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  padding: 0;
  background: none;
  border: none;
  color: inherit;
  cursor: pointer;
  gap: 5px;
}

.site-header__menu-toggle-bar {
  display: block;
  width: 24px;
  height: 2px;
  background-color: currentColor;
  transition: all 0.2s ease;
}

.site-header__menu-toggle[aria-expanded="true"] .site-header__menu-toggle-bar:nth-child(1) {
  transform: rotate(45deg) translate(5px, 5px);
}

.site-header__menu-toggle[aria-expanded="true"] .site-header__menu-toggle-bar:nth-child(2) {
  opacity: 0;
}

.site-header__menu-toggle[aria-expanded="true"] .site-header__menu-toggle-bar:nth-child(3) {
  transform: rotate(-45deg) translate(5px, -5px);
}

@media (max-width: 767px) {
  .site-header {
    z-index: 270;
  }

  .site-header--sticky-always {
    position: sticky;
    top: var(--utility-bar-height);
  }

  .site-header--sticky-scroll {
    position: sticky;
    top: var(--utility-bar-height);
  }

  .site-header__nav {
    display: none;
  }

  .site-header__cta {
    display: none;
  }

  .site-header__phone-btn {
    display: none;
  }

  .site-header__menu-toggle {
    display: flex;
  }

  .site-header__logo {
    max-width: var(--header-logo-width-mobile);
  }

  .site-header__logo--desktop {
    display: none;
  }

  .site-header__logo--mobile {
    display: block;
  }

  /* If no mobile logo, show desktop on mobile */
  .site-header__branding:not(:has(.site-header__logo--mobile)) .site-header__logo--desktop {
    display: block;
    max-width: var(--header-logo-width-mobile);
  }
}

@media (min-width: 768px) {
  /* Desktop Utility Bar — Figma: 16px text */
  .utility-bar {
    font-size: 1rem;
  }

  .utility-bar__container {
    max-width: none;
    padding: 12px 16px;
  }

  /* Desktop Header — Figma: teal border + shadow */
  .site-header {
    border-bottom: 1px solid var(--color-primary);
    box-shadow: var(--box-shadow);
  }

  /* Desktop Header container — reset base constraints, let inner handle width */
  .site-header__container {
    max-width: none;
    padding-left: 0;
    padding-right: 0;
  }

  /* Desktop Header inner — constrained with padding, matching footer */
  .site-header__inner {
    max-width: var(--container-max-width);
    margin: 0 auto;
    padding: 16px var(--container-padding-right) 16px var(--container-padding-left);
  }

  /* Desktop Nav Items */
  .site-header__menu > li > a {
    font-size: var(--header-nav-font-size);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.44px;
    color: var(--color-primary);
    padding: 0.5rem 0;
    white-space: nowrap;
  }

  .site-header__menu {
    gap: clamp(0.75rem, 1.5vw, 1.5rem);
  }

  /* Dropdown arrow smaller to match nav text */
  .site-header__menu > li.menu-item-has-children > a::after {
    border-left-width: 3px;
    border-right-width: 3px;
    border-top-width: 4px;
  }

  /* Desktop CTA — outline style per Figma */
  .site-header__cta {
    background-color: transparent;
    color: var(--color-primary);
    border: 1px solid var(--color-primary);
    border-radius: var(--border-radius);
    padding: 8px 32px;
    font-size: 0.875rem;
    font-weight: 600;
  }

  .site-header__cta:hover {
    background-color: var(--color-primary);
    color: var(--color-white);
  }

  /* Override filled primary style on desktop */
  .site-header__cta--primary {
    background-color: transparent;
    color: var(--color-primary);
  }

  .site-header__cta--primary:hover {
    background-color: var(--color-primary);
    color: var(--color-white);
  }

  /* Logo sizing per Figma */
  .site-header__logo {
    max-width: 120px;
  }
}

/* ==========================================================================
   MOBILE MENU
   ========================================================================== */

.mobile-menu {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 260;
  visibility: hidden;
}

.mobile-menu.is-open {
  visibility: visible;
}

.mobile-menu__overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  opacity: 0;
  transition: opacity 0.3s ease;
}

.mobile-menu.is-open .mobile-menu__overlay {
  opacity: 1;
}

.mobile-menu__panel {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 80%;
  max-width: 314px;
  background-color: var(--color-white);
  display: flex;
  flex-direction: column;
  transform: translateX(-100%);
  transition: transform 0.3s ease;
  padding-top: var(--mobile-menu-top);
}

.mobile-menu.is-open .mobile-menu__panel {
  transform: translateX(0);
}

/* Slide variations */
.mobile-menu--slide-right .mobile-menu__panel {
  left: auto;
  right: 0;
  transform: translateX(100%);
}

.mobile-menu--slide-right.is-open .mobile-menu__panel {
  transform: translateX(0);
}

.mobile-menu--fullscreen .mobile-menu__panel {
  max-width: 100%;
  transform: translateY(-100%);
}

.mobile-menu--fullscreen.is-open .mobile-menu__panel {
  transform: translateY(0);
}

/* Navigation area */
.mobile-menu__nav {
  flex: 1;
  overflow: hidden;
  position: relative;
}

/* Slider container for main menu + submenu drill-down */
.mobile-menu__nav-slider {
  display: flex;
  width: 200%;
  height: 100%;
  transition: transform 0.3s ease;
}

.mobile-menu__nav-slider.is-submenu-open {
  transform: translateX(-50%);
}

.mobile-menu__nav-main,
.mobile-menu__nav-sub {
  width: 50%;
  overflow-y: auto;
}

.mobile-menu__nav-sub {
  visibility: hidden;
}

.mobile-menu__nav-slider.is-submenu-open .mobile-menu__nav-sub {
  visibility: visible;
}

/* Menu items */
.mobile-menu__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.mobile-menu__list > li {
  border-bottom: 1px solid var(--color-secondary);
}

.mobile-menu__list > li > a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 1.5rem;
  font-size: 1.125rem;
  font-weight: 500;
  line-height: 1.4;
  color: var(--color-primary);
  text-decoration: none;
  transition: background-color 0.2s ease;
}

.mobile-menu__list > li > a:hover,
.mobile-menu__list > li > a:active {
  background-color: var(--color-secondary);
}

.mobile-menu__list .current-menu-item > a {
  color: var(--color-primary);
  font-weight: 600;
}

/* Parent items: flex layout for split link / toggle button */
.mobile-menu__list > li.menu-item-has-children,
.mobile-menu__submenu-list > li.menu-item-has-children {
  display: flex;
  align-items: stretch;
}

.mobile-menu__list > li.menu-item-has-children > a,
.mobile-menu__submenu-list > li.menu-item-has-children > a {
  flex: 1;
  min-width: 0;
}

/* Submenu toggle button — only on items with children */
.mobile-menu__submenu-toggle {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  padding: 0;
  background: none;
  border: none;
  border-left: 1px solid var(--color-secondary);
  cursor: pointer;
  flex-shrink: 0;
  color: var(--color-primary);
  transition: background-color 0.2s ease;
}

.mobile-menu__submenu-toggle:hover,
.mobile-menu__submenu-toggle:active {
  background-color: var(--color-secondary);
}

.mobile-menu__submenu-toggle::after {
  content: '';
  display: block;
  width: 8px;
  height: 8px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(-45deg);
}

/* Hide nested submenus in main list (shown via drill-down) */
.mobile-menu__list .sub-menu {
  display: none;
}

/* Submenu panel (drill-down view) */
.mobile-menu__submenu-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.mobile-menu__submenu-list > li {
  border-bottom: 1px solid var(--color-secondary);
}

.mobile-menu__submenu-list > li > a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 1.5rem;
  font-size: 1.125rem;
  font-weight: 500;
  line-height: 1.4;
  color: var(--color-primary);
  text-decoration: none;
  transition: background-color 0.2s ease;
}

.mobile-menu__submenu-list > li > a:hover,
.mobile-menu__submenu-list > li > a:active {
  background-color: var(--color-secondary);
}

/* Hide nested sub-menus in submenu list (shown via drill-down) */
.mobile-menu__submenu-list .sub-menu {
  display: none;
}

/* Back button in submenu */
.mobile-menu__back {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  width: 100%;
  padding: 1rem 0.75rem;
  background: none;
  border: none;
  border-bottom: 1px solid var(--color-secondary);
  font-size: 1.3125rem;
  font-weight: 600;
  line-height: 1.875rem;
  color: var(--color-text);
  cursor: pointer;
  text-align: left;
}

.mobile-menu__back-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  flex-shrink: 0;
}

.mobile-menu__back-icon::before {
  content: '';
  display: block;
  width: 10px;
  height: 10px;
  border-left: 2.5px solid currentColor;
  border-bottom: 2.5px solid currentColor;
  transform: rotate(45deg);
}

/* Footer CTAs */
.mobile-menu__footer {
  padding: 0.125rem;
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
}

.mobile-menu__cta {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.375rem;
  padding: 1rem;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--mobile-menu-cta-text);
  background-color: var(--mobile-menu-cta-bg);
  text-decoration: none;
  transition: background-color 0.2s ease;
}

.mobile-menu__cta:hover {
  filter: brightness(0.9);
  text-decoration: none;
}

.mobile-menu__cta-icon {
  flex-shrink: 0;
}

.mobile-menu__phone {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.375rem;
  padding: 1rem;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--mobile-menu-phone-text);
  background-color: var(--mobile-menu-phone-bg);
  text-decoration: none;
  transition: background-color 0.2s ease;
}

.mobile-menu__phone:hover {
  filter: brightness(0.95);
  text-decoration: none;
}

.mobile-menu__phone-icon {
  flex-shrink: 0;
}

/* ==========================================================================
   FLOATING PHONE BUTTON (mobile only)
   ========================================================================== */

.floating-phone-btn {
  display: none;
}

/* ==========================================================================
   SITE FOOTER
   Figma spec: bg #035d67, text #f8f5f5, body font Mada, heading font Murecho
   ========================================================================== */

.site-footer {
  margin-top: auto;
  background-color: var(--footer-bg-color);
  color: var(--footer-text-color);
  font-family: var(--font-family-primary);
}

.site-footer a {
  color: var(--footer-link-color);
}

.site-footer a:hover {
  color: var(--footer-link-hover-color);
}

/* Footer Container */
.site-footer__container {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding-left: 16px;
  padding-right: 16px;
}

/* Footer Main */
.site-footer__main {
  padding-top: var(--footer-padding-top);
  padding-bottom: var(--footer-padding-bottom);
}

.site-footer__main > .site-footer__container {
  display: flex;
  flex-direction: column;
  gap: 32px;
}

/* ==========================================================================
   Info Section: Logo, Contact, Social, Phone CTA
   ========================================================================== */

.site-footer__info {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
}

/* Logo */
.site-footer__logo-wrap {
  text-align: center;
}

.site-footer__logo-link {
  display: inline-block;
}

.site-footer__logo {
  max-width: 173px;
  height: auto;
  filter: brightness(0) invert(1);
}

.site-footer__logo-placeholder {
  display: inline-block;
  font-size: 1.5rem;
  font-weight: 700;
  text-decoration: none;
  color: inherit;
}

/* Contact List with Icons */
.site-footer__contact-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.site-footer__contact-item {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.2;
  color: inherit;
}

.site-footer__contact-icon {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  color: inherit;
}

.site-footer__contact-item address {
  font-style: normal;
  line-height: 1.2;
}

.site-footer__contact-item a {
  color: inherit;
  text-decoration: none;
}

.site-footer__contact-item a:hover {
  text-decoration: underline;
  color: var(--footer-link-hover-color);
}

/* Social Icons Row */
.site-footer__social-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding-top: 8px;
}

.site-footer__social-link {
  display: flex;
  align-items: center;
  justify-content: center;
  color: inherit;
  transition: opacity 0.2s ease;
}

.site-footer__social-link:hover {
  opacity: 0.7;
}

/* Desktop social row in quick-links — hidden on mobile by default */
.site-footer__social-row--desktop {
  display: none;
}

/* Phone CTA Button */
.site-footer a.site-footer__phone-cta {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  padding: 8px 32px;
  background-color: var(--color-secondary);
  border: 1px solid var(--color-primary);
  border-radius: var(--border-radius);
  color: var(--color-primary);
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1.2;
  text-decoration: none;
  transition: filter 0.2s ease;
}

.site-footer a.site-footer__phone-cta:hover {
  filter: brightness(0.95);
  color: var(--color-primary);
}

.site-footer__phone-cta svg {
  flex-shrink: 0;
  color: var(--color-primary);
}

/* ==========================================================================
   Quick Links Section
   ========================================================================== */

.site-footer__quick-links {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  padding: 0 24px;
}

.site-footer__section-title {
  font-family: var(--font-family-secondary);
  font-size: 1.125rem;
  font-weight: 500;
  line-height: 1.4;
  margin: 0;
  text-align: center;
  color: var(--footer-heading-color);
}

.site-footer__quick-links-grid {
  display: flex;
  gap: 16px;
  width: 100%;
}

.site-footer__quick-links-col {
  flex: 1;
  min-width: 0;
}

.site-footer__quick-links-col--left {
  text-align: right;
}

.site-footer__quick-links-col--right {
  text-align: left;
}

.site-footer__quick-links-divider {
  width: 1px;
  align-self: stretch;
  background-color: rgba(255, 255, 255, 0.3);
}

/* Menu (shared) */
.site-footer__menu {
  list-style: none;
  margin: 0;
  padding: 0;
}

.site-footer__menu li {
  margin-bottom: 7px;
}

.site-footer__menu li:last-child {
  margin-bottom: 0;
}

.site-footer__menu a {
  color: var(--color-gray);
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.2;
  text-decoration: none;
  transition: opacity 0.2s ease;
}

.site-footer__menu a:hover {
  opacity: 0.7;
}

/* ==========================================================================
   Accreditations Section
   ========================================================================== */

.site-footer__accreditations {
  padding: var(--footer-accreditations-padding-y) 0;
  background-color: var(--footer-accreditations-bg);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}

.site-footer__accreditations > .site-footer__container {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
}

.site-footer__accreditations-grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 16px;
}

.site-footer__accreditation {
  display: flex;
  align-items: center;
  justify-content: center;
}

.site-footer__accreditation a {
  display: flex;
  align-items: center;
  justify-content: center;
  transition: opacity 0.2s ease;
}

.site-footer__accreditation a:hover {
  opacity: 0.8;
}

.site-footer__accreditation-image {
  height: 50px;
  width: auto;
  object-fit: contain;
}

.site-footer__accreditation-name {
  font-size: 0.875rem;
  font-weight: 500;
}

/* Placeholder accreditation badges */
.site-footer__accreditation--placeholder {
  padding: 0.625rem 1.25rem;
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: var(--border-radius);
  background-color: transparent;
}

.site-footer__accreditation--placeholder span {
  font-size: 0.8125rem;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: inherit;
}

/* Footer Divider (desktop-only) */
.site-footer__divider {
  display: none;
}

/* ==========================================================================
   Bottom Bar (Legal Links + Copyright)
   ========================================================================== */

.site-footer__bottom {
  padding: var(--footer-bottom-padding-y) var(--container-padding-mobile-right);
  background-color: var(--footer-bottom-bg-color);
  color: var(--footer-bottom-text-color);
}

.site-footer__bottom > .site-footer__container {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}

/* Legal Links */
.site-footer__legal {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 6px;
}

.site-footer__legal-link {
  display: inline-block;
  color: var(--color-gray);
  font-size: 0.8125rem;
  font-weight: 400;
  line-height: 1;
  text-decoration: none;
  background: rgba(255, 255, 255, 0.15);
  padding: 6px 12px;
  border-radius: var(--border-radius);
  transition: background 0.2s ease, opacity 0.2s ease;
}

.site-footer__legal-link:hover {
  background: rgba(255, 255, 255, 0.25);
}

.site-footer__legal-separator {
  display: none;
}

/* Copyright */
.site-footer__copyright {
  color: var(--color-gray);
  font-size: 0.8125rem;
  font-weight: 400;
  line-height: 1.2;
  text-align: center;
}

/* ==========================================================================
   Footer Desktop Layout (768px+)
   ========================================================================== */

@media (min-width: 768px) {
  /* Reset main section padding — container handles it */
  .site-footer__main {
    padding-top: 0;
    padding-bottom: 0;
  }

  /* 3-column layout */
  .site-footer__main > .site-footer__container {
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-start;
    gap: 32px;
    padding: 48px var(--container-padding-right) 48px var(--container-padding-left);
  }

  .site-footer__container {
    padding-left: var(--container-padding-left);
    padding-right: var(--container-padding-right);
    max-width: var(--container-max-width);
  }

  /* Info column — left-aligned */
  .site-footer__info {
    align-items: flex-start;
    gap: 24px;
    flex-shrink: 0;
  }

  .site-footer__logo {
    max-width: 173px;
  }

  /* Figma: section titles 21px Murecho Medium */
  .site-footer__section-title {
    font-size: 1.3125rem;
  }

  /* Figma: contact icons 20px on desktop */
  .site-footer__contact-icon {
    width: 20px;
    height: 20px;
  }

  /* Phone CTA fixed width for its column */
  .site-footer a.site-footer__phone-cta {
    width: 229px;
  }

  /* Hide info social on desktop, show quick-links social */
  .site-footer__social-row:not(.site-footer__social-row--desktop) {
    display: none;
  }

  .site-footer__social-row--desktop {
    display: flex;
    justify-content: flex-end;
    padding-top: 8px;
  }

  /* Accreditations — center column, capped at 30% so badges wrap 2×2 */
  .site-footer__accreditations {
    flex: 0 0 30%;
    max-width: 30%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    padding: 0;
  }

  .site-footer__accreditations-grid {
    gap: 16px;
  }

  .site-footer__accreditation-image {
    height: 55px;
  }

  /* Quick Links — keep 2-menu layout like mobile */
  .site-footer__quick-links {
    align-items: center;
    padding: 0;
    flex-shrink: 0;
  }

  /* Bottom bar — horizontal, full-width with desktop padding */
  .site-footer__bottom {
    padding-left: 0;
    padding-right: 0;
  }

  .site-footer__bottom > .site-footer__container {
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
  }

  /* Figma: divider line between main and bottom — always full width */
  .site-footer__divider {
    display: block;
    height: 1px;
    background-color: rgba(255, 255, 255, 0.3);
  }

  /* Legal links — keep pill style, add underline on desktop per Figma */
  .site-footer__legal-link {
    text-decoration: underline;
  }

  .site-footer__legal {
    gap: 8px;
  }
}

/* ==========================================================================
   PAGE CONTENT (Default Template)
   ========================================================================== */

.page-content {
  padding: 3rem 0;
}

.page-content__container {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: var(--container-padding-top) var(--container-padding-right) var(--container-padding-bottom) var(--container-padding-left);
}

.page-content__entry {
  max-width: 800px;
}

.page-content__entry > *:first-child {
  margin-top: 0;
}

.page-content__entry > *:last-child {
  margin-bottom: 0;
}

.page-content__entry h1,
.page-content__entry h2,
.page-content__entry h3,
.page-content__entry h4,
.page-content__entry h5,
.page-content__entry h6 {
  margin-top: 2rem;
  margin-bottom: 1rem;
}

.page-content__entry p {
  margin-bottom: 1.5rem;
  line-height: 1.5;
}

.page-content__entry ul,
.page-content__entry ol {
  margin-bottom: 1.5rem;
  padding-left: 1.5rem;
}

.page-content__entry li {
  margin-bottom: 0.5rem;
}

.page-content__entry img {
  max-width: 100%;
  height: auto;
}

.page-content__entry blockquote {
  margin: 2rem 0;
  padding: 1.5rem 2rem;
  border-left: 4px solid var(--color-primary);
  background-color: var(--color-secondary);
  font-style: italic;
}

.page-content__entry a {
  color: var(--color-link);
  text-decoration: underline;
}

.page-content__entry a:hover {
  color: var(--color-primary-dark);
}

/* Full width page content */
.site--content-full-width .page-content__container {
  max-width: none;
}

.site--content-full-width .page-content__entry {
  max-width: none;
}

/* ==========================================================================
   CONTENT HERO
   ========================================================================== */

.content-hero {
  position: relative;
  background: var(--color-secondary);
  padding: 48px 0;
}

.content-hero__bg-image {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  pointer-events: none;
}

.content-hero__overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: var(--color-secondary);
  opacity: 0.8;
  pointer-events: none;
}

/* When no featured image, overlay is fully opaque (solid color) */
.content-hero:not(.content-hero--has-bg-image) .content-hero__overlay {
  opacity: 1;
}

.content-hero__container {
  position: relative;
  z-index: 1;
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 0 16px;
}

.content-hero__text {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

/* Breadcrumbs — reuse existing breadcrumbs function, override styles */
.content-hero__breadcrumbs { margin-bottom: 0; }
.content-hero__breadcrumbs__list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  list-style: none;
  padding: 0;
  margin: 0;
  font-family: var(--font-family-secondary);
  font-size: 0.6875rem;
  font-weight: var(--font-weight-semibold);
  text-transform: uppercase;
  letter-spacing: 0.44px;
}
.content-hero__breadcrumbs__item {
  display: flex;
  align-items: center;
  gap: 8px;
}
.content-hero__breadcrumbs__item:not(:last-child)::after {
  content: '>';
  font-size: 0.75rem;
  color: var(--color-text);
  text-transform: none;
  letter-spacing: 0;
}
.content-hero__breadcrumbs__link {
  color: var(--color-primary);
  text-decoration: none;
}
.content-hero__breadcrumbs__link:hover { text-decoration: underline; }
.content-hero__breadcrumbs__current {
  color: var(--color-text);
}

/* Title */
.content-hero__title {
  font-family: var(--font-family-heading);
  font-size: 1.875rem;
  font-weight: var(--font-weight-semibold);
  line-height: normal;
  color: var(--color-primary);
  margin: 0;
}

/* Byline block */
.content-hero__byline {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.content-hero__byline-dates {
  font-family: var(--font-family-secondary);
  font-size: 0.625rem;
  font-weight: var(--font-weight-semibold);
  text-transform: uppercase;
  letter-spacing: 0.4px;
  line-height: 13.2px;
  color: var(--color-accent);
}

.content-hero__byline-credits {
  font-family: var(--font-family-secondary);
  font-size: 0.6875rem;
  font-weight: var(--font-weight-semibold);
  line-height: normal;
  color: var(--color-text);
}

.content-hero__byline-separator {
  margin: 0 4px;
  opacity: 0.5;
}

.content-hero__byline-reviewer {
  display: flex;
  align-items: center;
  gap: 4px;
  font-family: var(--font-family-secondary);
  font-size: 0.6875rem;
  font-weight: var(--font-weight-semibold);
  line-height: normal;
  color: var(--color-text);
}

.content-hero__byline-reviewer-trigger {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  appearance: none;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  cursor: pointer;
}

.content-hero__byline-reviewer-trigger:hover,
.content-hero__byline-reviewer-trigger:focus-visible {
  text-decoration: underline;
}

.content-hero__byline-link {
  color: inherit;
  text-decoration: none;
}

.content-hero__byline-link:hover {
  text-decoration: underline;
}

.content-hero__byline-reviewer-icon {
  flex-shrink: 0;
  color: var(--color-primary);
  object-fit: contain;
}

/* Medical review tooltip */
.medical-review-tooltip[hidden] {
  display: none;
}

.medical-review-tooltip--tooltip {
  position: fixed;
  z-index: 2147483647;
  width: min(calc(100vw - 32px), 440px);
}

.medical-review-tooltip--modal {
  position: fixed;
  inset: 0;
  z-index: 2147483647;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
}

.medical-review-tooltip__backdrop {
  position: absolute;
  inset: 0;
  background: color-mix(in srgb, var(--color-text) 55%, transparent);
}

.medical-review-tooltip__dialog {
  position: relative;
  z-index: 1;
  max-height: calc(100vh - 32px);
  overflow-y: auto;
  background: var(--color-white);
  color: var(--color-text);
  box-shadow: var(--box-shadow);
}

.medical-review-tooltip--tooltip .medical-review-tooltip__dialog {
  width: 100%;
  padding: 24px 20px;
  border: 1px solid color-mix(in srgb, var(--color-text) 18%, transparent);
}

.medical-review-tooltip--modal .medical-review-tooltip__dialog {
  width: min(100%, 1100px);
  padding: 32px 24px;
}

.medical-review-tooltip__close {
  position: absolute;
  top: 20px;
  right: 20px;
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--color-text);
  cursor: pointer;
}

.medical-review-tooltip__close:hover,
.medical-review-tooltip__close:focus-visible {
  color: var(--color-primary);
}

.medical-review-tooltip__icon {
  display: grid;
  place-items: center;
  width: 56px;
  height: 56px;
  margin: 0 48px 20px 0;
  border-radius: 50%;
  background: color-mix(in srgb, var(--color-primary) 18%, var(--color-white));
  color: var(--color-primary-dark);
}

.medical-review-tooltip__icon img {
  width: 34px;
  height: 34px;
  object-fit: contain;
}

.medical-review-tooltip__content {
  font-family: var(--font-family-primary);
  font-size: 0.9375rem;
  font-weight: var(--font-weight-medium);
  line-height: 1.45;
}

.medical-review-tooltip__content p {
  margin: 0 0 1.25em;
}

.medical-review-tooltip__content p:last-child {
  margin-bottom: 0;
}

.medical-review-tooltip__content a {
  color: var(--color-accent);
}

@media (min-width: 768px) {
  .medical-review-tooltip--modal {
    padding: 32px;
  }

  .medical-review-tooltip--modal .medical-review-tooltip__dialog {
    max-height: calc(100vh - 64px);
    padding: 64px 68px;
  }

  .medical-review-tooltip--modal .medical-review-tooltip__icon {
    width: 72px;
    height: 72px;
    margin-bottom: 28px;
  }

  .medical-review-tooltip--modal .medical-review-tooltip__icon img {
    width: 44px;
    height: 44px;
  }

  .medical-review-tooltip--modal .medical-review-tooltip__content {
    font-size: 1.75rem;
  }
}

/* Decoration — geometric stripes */
.content-hero__decoration {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 168px;
  height: 168px;
  pointer-events: none;
  z-index: 0;
}
.content-hero__decoration img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/* Featured image — hidden on mobile, shown on desktop as side-by-side */
.content-hero__featured-image {
  display: none;
}

/* Tablet: content-hero — two-column layout */
@media (min-width: 768px) {
  .content-hero {
    padding: 64px 0;
    overflow: visible;
  }
  .content-hero__container {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 48px;
    padding: 0 var(--container-padding-right) 0 var(--container-padding-left);
  }
  /* Hide the background image when we have the side-by-side featured image */
  .content-hero--has-bg-image .content-hero__bg-image {
    display: none;
  }
  .content-hero--has-bg-image .content-hero__overlay {
    opacity: 1;
  }
  .content-hero__text {
    flex: 1 1 0%;
    max-width: 600px;
    gap: 16px;
  }
  .content-hero__featured-image {
    display: flex;
    flex: 1 1 0%;
    align-items: center;
    align-self: stretch;
    position: relative;
    z-index: 1;
    border-radius: var(--border-radius);
    overflow: hidden;
  }
  .content-hero__featured-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: var(--border-radius);
  }
  .content-hero__title {
    font-size: 2.25rem;
  }
  .content-hero__decoration {
    width: 248px;
    height: 248px;
  }
}

/* ==========================================================================
   TABLE OF CONTENTS
   ========================================================================== */

.toc {
  position: relative;
  background: var(--color-white);
  border-radius: var(--border-radius);
  border-right: 4px solid var(--color-primary);
  border-bottom: 4px solid var(--color-primary);
}

.toc__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 16px;
  border: none;
  background: none;
  cursor: pointer;
  font-family: var(--font-family-secondary);
  font-size: 0.8125rem;
  font-weight: 400;
  line-height: 15.6px;
  color: var(--color-text);
}

.toc__icon {
  flex-shrink: 0;
  transition: transform 0.2s ease;
  color: var(--color-text);
}

.toc--expanded {
  border-bottom-color: transparent;
  border-radius: 4px 4px 0 0;
}

.toc--expanded .toc__icon {
  transform: rotate(180deg);
}

.toc__body {
  position: absolute;
  top: 100%;
  left: 0;
  right: -4px;
  z-index: 10;
  padding: 0 0 8px;
  background: var(--color-white);
  border-radius: 0 0 4px 4px;
  border-right: 4px solid var(--color-primary);
  border-bottom: 4px solid var(--color-primary);
  opacity: 0;
  transform: translateY(-8px);
  transition: opacity 0.2s ease, transform 0.2s ease;
  pointer-events: none;
}

.toc--expanded .toc__body {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

.toc__list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
}

.toc__link {
  display: block;
  padding: 8px 16px;
  font-family: var(--font-family-secondary);
  font-size: 0.8125rem;
  font-weight: 400;
  line-height: 15.6px;
  color: var(--color-primary);
  text-decoration: none;
  transition: background-color 0.15s ease;
}

.toc__link:hover {
  background-color: rgba(0, 0, 0, 0.05);
}

/* Hide TOC when JS determines no headings exist */
.toc--empty {
  display: none;
}

/* ==========================================================================
   KEY TAKEAWAYS
   ========================================================================== */

.key-takeaways {
  position: relative;
}

.key-takeaways__container {
  max-width: var(--container-max-width);
  margin: 0 auto;
}

.key-takeaways__inner {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.key-takeaways--compact {
  width: 100%;
}

.key-takeaways--section {
  padding: 40px 0;
  background: var(--color-primary);
}

.key-takeaways--section .key-takeaways__container {
  padding: 0 var(--container-padding-mobile-right) 0 var(--container-padding-mobile-left);
}

.key-takeaways__content {
  align-self: start;
  width: 100%;
  min-width: 0;
}

.toc--key-takeaways {
  background: var(--color-primary);
  border-right-color: var(--color-white);
  border-bottom-color: var(--color-white);
}

.toc--key-takeaways .key-takeaways__header {
  color: var(--color-white);
}

.toc--key-takeaways .key-takeaways__title {
  margin: 0;
  color: var(--color-white);
  font: inherit;
}

.toc--key-takeaways .key-takeaways__body {
  position: static;
  inset: auto;
  z-index: auto;
  padding: 0 0 8px;
  background: var(--color-primary);
  border: 0;
  border-radius: 0;
  opacity: 1;
  transform: none;
  transition: none;
  pointer-events: auto;
}

.toc--key-takeaways .key-takeaways__item-text {
  color: var(--color-white);
  cursor: default;
  white-space: normal;
}

.toc--key-takeaways .key-takeaways__item-text:hover {
  background-color: var(--color-primary-dark);
}

.toc--key-takeaways .key-takeaways__legacy-copy {
  padding: 8px 16px;
  color: var(--color-white);
  font-family: var(--font-family-secondary);
  font-size: 0.8125rem;
  font-weight: 400;
  line-height: 1.5;
}

.toc--key-takeaways .key-takeaways__legacy-copy > :first-child {
  margin-top: 0;
}

.toc--key-takeaways .key-takeaways__legacy-copy > :last-child {
  margin-bottom: 0;
}

.key-takeaways__media,
.key-takeaways__video {
  position: relative;
  width: 100%;
  min-width: 0;
  overflow: hidden;
  border-radius: var(--border-radius);
  aspect-ratio: 16 / 9;
  background: var(--color-primary-dark);
}

.key-takeaways__image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.key-takeaways__play {
  color: var(--color-white);
}

@media (min-width: 768px) {
  .key-takeaways--has-media .key-takeaways__inner {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: center;
    gap: 48px;
  }

  .key-takeaways--section {
    padding: 48px 0;
  }

  .key-takeaways--section .key-takeaways__container {
    padding: 0 var(--container-padding-right) 0 var(--container-padding-left);
  }

}

/* ==========================================================================
   CONTENT PAGE — TWO-COLUMN LAYOUT
   ========================================================================== */

.content-page {
  padding: 2rem 0 3rem;
}
.content-page__container {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: var(--container-padding-top) var(--container-padding-right) var(--container-padding-bottom) var(--container-padding-left);
}
.content-page__main {
  min-width: 0;
}

/* Two-column grid when sidebar is enabled — tablet */
@media (min-width: 768px) {
  .content-page {
    padding: 48px 0;
  }
  .content-page--has-sidebar .content-page__container {
    display: grid;
    grid-template-columns: 1fr 280px;
    gap: 2rem;
    align-items: start;
  }
  .content-page__sidebar {
    margin-top: 0;
  }
}

/* Two-column grid when sidebar is enabled — desktop */
@media (min-width: 1024px) {
  .content-page--has-sidebar .content-page__container {
    grid-template-columns: 1fr 333px;
    gap: 64px;
  }
}

/* Main content area (the_content) */
.content-page__content {
  font-size: 1.0625rem;
  line-height: 1.75;
  color: var(--color-text);
}
.content-page__content h2 { font-size: 1.5rem; font-weight: 700; margin: 2rem 0 1rem; }
.content-page__content h3 { font-size: 1.25rem; font-weight: 600; margin: 1.75rem 0 0.75rem; }
.content-page__content h4 { font-size: 1.125rem; font-weight: 600; margin: 1.5rem 0 0.75rem; }
.content-page__content p { margin: 0 0 1.25rem; }
.content-page__content ul,
.content-page__content ol { margin: 0 0 1.25rem; padding-left: 1.5rem; }
.content-page__content li { margin-bottom: 0.5rem; }
.content-page__content blockquote {
  margin: 1.5rem 0;
  padding: 1rem 1.5rem;
  border-left: 4px solid var(--color-primary);
  background: rgba(0, 0, 0, 0.02);
  font-style: italic;
}
.content-page__content img {
  max-width: 100%;
  height: auto;
  border-radius: var(--border-radius);
}

/* ==========================================================================
   BANNER CTA COMPARE FIXTURE
   ========================================================================== */

.banner-cta-compare {
  background: var(--color-background);
}
.banner-cta-compare__header {
  padding: 48px 0 24px;
}
.banner-cta-compare__container {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 0 var(--container-padding-right) 0 var(--container-padding-left);
}
.banner-cta-compare__container--narrow {
  max-width: 760px;
}
.banner-cta-compare__title {
  margin: 0;
  font-size: clamp(2rem, 5vw, 3.5rem);
  line-height: 1.1;
}
.banner-cta-compare__section {
  padding: 24px 0 48px;
}
.banner-cta-compare__label {
  margin: 0 0 12px;
  font-size: 0.8125rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--color-primary-dark);
}
.banner-cta-compare__content-column {
  max-width: 640px;
  margin: 0 auto;
}

/* WordPress image alignment — mobile-first (full-width, no float) */
.content-page__content .alignleft,
.content-page__content .alignright,
.content-page__content .aligncenter,
.content-page__content .alignnone {
  display: block;
  width: 100%;
  height: auto;
  margin: 1rem 0;
  float: none;
}
.content-page__content .aligncenter {
  margin-left: auto;
  margin-right: auto;
}

.content-page__content a { color: var(--color-link); }
.content-page__content a:hover { text-decoration: underline; }

/* Desktop: content typography */
@media (min-width: 1024px) {
  .content-page__content {
    font-size: 1rem;
    line-height: 1.2;
  }
  .content-page__content h2 {
    font-size: 1.875rem;
    font-weight: var(--font-weight-semibold);
    line-height: 25.2px;
    font-family: var(--font-family-heading);
    color: var(--color-primary);
  }
}

/* Desktop: WordPress image alignment — float with text wrap */
@media (min-width: 768px) {
  .content-page__content .alignleft {
    float: left;
    width: auto;
    max-width: 50%;
    margin: 0.25rem 1.5rem 1rem 0;
  }
  .content-page__content .alignright {
    float: right;
    width: auto;
    max-width: 50%;
    margin: 0.25rem 0 1rem 1.5rem;
  }
  .content-page__content .aligncenter {
    width: auto;
    max-width: 100%;
  }
  .content-page__content .alignnone {
    width: auto;
    max-width: 100%;
  }
}

/* Sidebar */
.content-page__sidebar {
  margin-top: 2rem;
}
@media (min-width: 768px) {
  .content-page__sidebar {
    margin-top: 0;
    position: sticky;
    top: 6rem;
    display: flex;
    flex-direction: column;
    gap: 32px;
  }
}

/* ==========================================================================
   LINK BANK SIDEBAR
   ========================================================================== */

.link-bank__section {
  background: var(--color-secondary);
  border-radius: var(--border-radius);
  padding: 1.5rem;
  margin-bottom: 1.5rem;
}
.link-bank__section--spacing-none { margin-bottom: 0; }
.link-bank__section--spacing-small { margin-bottom: 0.75rem; }
.link-bank__section--spacing-default { margin-bottom: 1.5rem; }
.link-bank__section--spacing-large { margin-bottom: 2.5rem; }
.link-bank__title {
  font-family: var(--font-family-heading);
  font-size: 1.875rem;
  font-weight: 600;
  line-height: 1.26;
  color: var(--color-primary);
  margin: 0 0 1rem;
  padding-bottom: 0;
  border-bottom: none;
}
.link-bank__title::after {
  content: '';
  display: block;
  width: 43px;
  height: 2px;
  background: var(--color-primary);
  margin-top: 1rem;
}
.link-bank__list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.link-bank__item {
  border-bottom: none;
}
.link-bank__item:last-child { border-bottom: 0; }
.link-bank__link {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 4px 0;
  font-family: var(--font-family-body);
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1.2;
  color: var(--color-primary);
  text-decoration: none;
  transition: opacity 0.2s ease;
}
.link-bank__link:hover { opacity: 0.7; }
.link-bank__arrow {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  color: var(--color-primary);
}

/* ==========================================================================
   ARCHIVE PAGE
   ========================================================================== */

.archive-page__content {
  padding: 2rem 0;
}
.archive-page__content-container {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: var(--container-padding-top) var(--container-padding-right) var(--container-padding-bottom) var(--container-padding-left);
  font-size: 1.0625rem;
  line-height: 1.75;
  color: var(--color-text);
}
.archive-page__content-container p { margin: 0 0 1.25rem; }
.archive-page__content-container a { color: var(--color-link); }

/* Archive Page — sidebar layout (hidden on mobile, shown on desktop) */
.archive-page__sidebar {
  display: none;
}

/* Tablet: archive-page layout */
@media (min-width: 768px) {
  .archive-page__layout {
    max-width: var(--container-max-width);
    margin: 0 auto;
    padding: 0 var(--container-padding-right) 0 var(--container-padding-left);
    display: grid;
    grid-template-columns: 270px 1fr;
    gap: 2rem;
    align-items: start;
  }

  .archive-page__sidebar {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    position: sticky;
    top: 6rem;
  }

  .archive-page__layout .archive-posts {
    padding-top: 0;
  }

  .archive-page__layout .archive-posts__container {
    padding-left: 0;
    padding-right: 0;
    max-width: none;
  }

  /* Hide filter dropdown when sidebar categories are visible */
  .archive-page__layout .archive-posts__filter {
    display: none;
  }
}

/* Desktop: archive-page layout */
@media (min-width: 1024px) {
  .archive-page__layout {
    padding-left: 80px;
    padding-right: 80px;
    gap: 2rem;
    padding-top: 3rem;
    padding-bottom: 3rem;
  }
}

/* ==========================================================================
   ARCHIVE POSTS
   ========================================================================== */

.archive-posts {
  width: 100%;
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 1rem;
}
.site--content-full-width .archive-posts {
  max-width: none;
}
.archive-posts__container {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: var(--container-padding-top) var(--container-padding-right) var(--container-padding-bottom) var(--container-padding-left);
}

/* Category Filter Dropdown */
.archive-posts__filter {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin-bottom: 1.5rem;
}
.archive-posts__filter-label {
  font-size: 0.6875rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--color-primary);
}
.archive-posts__filter-select-wrapper {
  position: relative;
  width: 100%;
}

@media (min-width: 640px) {
  .archive-posts__filter-select-wrapper {
    max-width: 320px;
  }
}
.archive-posts__filter-select {
  appearance: none;
  -webkit-appearance: none;
  width: 100%;
  padding: 0.875rem 3rem 0.875rem 1rem;
  font-size: 0.8125rem;
  font-family: inherit;
  color: var(--color-text);
  background: var(--color-white);
  border: 1px solid var(--color-primary);
  border-radius: var(--border-radius);
  cursor: pointer;
  box-shadow: inset 0 -10px 16px rgba(0, 0, 0, 0.05);
  transition: border-color 0.2s ease;
}
.archive-posts__filter-select:focus {
  outline: 2px solid var(--color-primary);
  outline-offset: 2px;
}
.archive-posts__filter-caret {
  position: absolute;
  right: 1rem;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
  color: var(--color-primary);
}

/* Press Release view and sorting controls */
.archive-posts__press-controls {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 1rem;
  margin-bottom: 1.5rem;
}
.archive-posts__press-control {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  font-size: 0.6875rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--color-primary);
}
.archive-posts__press-control select {
  appearance: none;
  width: 100%;
  min-height: 44px;
  padding: 0.75rem 2.5rem 0.75rem 1rem;
  font: inherit;
  text-transform: none;
  letter-spacing: normal;
  color: var(--color-text);
  background: var(--color-white);
  border: 1px solid var(--color-primary);
  border-radius: var(--border-radius);
}
.archive-posts__press-control select:focus {
  outline: 2px solid var(--color-primary);
  outline-offset: 2px;
}
.archive-posts__press-submit {
  min-height: 44px;
  padding: 0.75rem 1.5rem;
  color: var(--color-white);
  background: var(--color-primary);
  border: 1px solid var(--color-primary);
  border-radius: var(--border-radius);
  font: inherit;
  font-weight: 600;
  cursor: pointer;
}
.archive-posts__group-heading {
  grid-column: 1 / -1;
  margin: 1rem 0 0;
  padding-bottom: 0.75rem;
  border-bottom: 2px solid var(--color-primary);
  color: var(--color-primary);
}
.archive-posts__card-source {
  margin: 0;
  color: var(--color-primary-dark);
  font-size: 0.6875rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

/* Post Grid — mobile-first */
.archive-posts__grid {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

@media (min-width: 640px) {
  .archive-posts__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem;
  }
}
/* Blog Card */
.archive-posts__card {
  background: var(--color-white);
  border-radius: var(--border-radius);
  overflow: hidden;
  box-shadow: var(--box-shadow);
  display: flex;
  flex-direction: column;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.archive-posts__card:hover {
  transform: translateY(-4px);
  box-shadow: 0 20px 20px -8px rgba(12, 12, 13, 0.15), 0 6px 6px -4px rgba(12, 12, 13, 0.08);
}

/* Card Image */
.archive-posts__card-image {
  display: block;
  height: 120px;
  overflow: hidden;
}
.archive-posts__card-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s ease;
}
.archive-posts__card:hover .archive-posts__card-image img {
  transform: scale(1.05);
}
.archive-posts--press-release .archive-posts__card-image img {
  object-fit: contain;
  padding: 1rem;
  background: var(--color-white);
}

/* Card Body */
.archive-posts__card-body {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  padding: 1rem 1rem 1.5rem;
}

/* Byline Area */
.archive-posts__card-byline {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
.archive-posts__card-dates {
  font-size: 0.625rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--color-accent);
  margin: 0;
  line-height: 1.3;
}
.archive-posts__card-credits {
  font-size: 0.625rem;
  font-weight: 500;
  color: var(--color-primary-dark);
  margin: 0;
  line-height: 1.3;
}

/* Title */
.archive-posts__card-title {
  font-size: 1.125rem;
  font-weight: 500;
  margin: 0;
  line-height: 1.4;
}
.archive-posts__card-title a {
  color: var(--color-primary);
  text-decoration: none;
}
.archive-posts__card-title a:hover {
  text-decoration: underline;
}

/* Excerpt */
.archive-posts__card-excerpt {
  font-size: 0.8125rem;
  color: var(--color-text);
  line-height: 1.5;
  margin: 0;
}

/* Learn More Link */
.archive-posts__card-link {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  font-size: 0.6875rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--color-primary);
  text-decoration: none;
  transition: color 0.2s ease;
}
.archive-posts__card-link:hover {
  text-decoration: underline;
}
.archive-posts__card-link svg {
  flex-shrink: 0;
  transition: transform 0.2s ease;
}
.archive-posts__card-link:hover svg {
  transform: translateX(2px);
}

/* Compact Card Style */
.archive-posts__card--compact {
  box-shadow: none;
  border: 1px solid rgba(0, 0, 0, 0.08);
}
.archive-posts__card--compact .archive-posts__card-body {
  padding: 1rem;
}

/* Featured Card Style */
.archive-posts__card--featured .archive-posts__card-image {
  height: 200px;
}
.archive-posts__card--featured .archive-posts__card-body {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  padding: 1.5rem;
  background: linear-gradient(transparent, rgba(0, 0, 0, 0.8));
  color: var(--color-white);
}
.archive-posts__card--featured .archive-posts__card-title a { color: var(--color-white); }
.archive-posts__card--featured .archive-posts__card-dates { color: rgba(255, 255, 255, 0.8); }
.archive-posts__card--featured .archive-posts__card-credits { color: rgba(255, 255, 255, 0.7); }
.archive-posts__card--featured {
  position: relative;
}

/* No Results */
.archive-posts--empty { padding: 3rem 0; }
.archive-posts__no-results {
  text-align: center;
  font-size: 1.125rem;
  color: var(--color-text-light);
}

/* Pagination — text style */
.archive-posts__pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
  margin-top: 2rem;
  flex-wrap: wrap;
}
.archive-posts__pagination a,
.archive-posts__pagination span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.25rem;
  font-size: 0.8125rem;
  font-weight: 400;
  text-decoration: none;
  transition: color 0.2s ease;
  border: none;
  background: transparent;
  border-radius: 0;
  min-width: auto;
  height: auto;
}
.archive-posts__pagination a {
  color: var(--color-link);
}
.archive-posts__pagination a:hover {
  text-decoration: underline;
  background: transparent;
}
.archive-posts__pagination .current {
  color: var(--color-text);
  background: transparent;
  border: none;
  font-weight: 600;
}
.archive-posts__pagination .dots {
  color: var(--color-text);
}
.archive-posts__pagination .prev,
.archive-posts__pagination .next {
  color: var(--color-text);
  font-weight: 400;
}

/* Tablet: archive-posts */
@media (min-width: 768px) {
  .archive-posts {
    padding: 3rem 0 4rem;
  }

  .archive-posts__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
  }

  .archive-posts__filter {
    margin-bottom: 2rem;
  }

  .archive-posts__press-controls {
    flex-direction: row;
    align-items: flex-end;
    margin-bottom: 2rem;
  }

  .archive-posts__press-control {
    min-width: 220px;
  }

  .archive-posts__pagination {
    margin-top: 2rem;
  }
}

/* Desktop: archive-posts */
@media (min-width: 1024px) {
  .archive-posts__container {
    padding-left: var(--container-padding-left);
    padding-right: var(--container-padding-right);
  }

  .archive-posts__grid {
    gap: 2rem 1.25rem;
  }

  .archive-posts__grid--cols-3 {
    grid-template-columns: repeat(3, 1fr);
  }

  .archive-posts__grid--cols-4 {
    grid-template-columns: repeat(4, 1fr);
  }

  .archive-posts__card-body {
    gap: 1rem;
  }

  .archive-posts__card-title {
    line-height: 1.25;
  }

  .archive-posts__pagination {
    margin-top: 2rem;
    gap: 0.5rem;
  }
}

/* ==========================================================================
   STAFF ARCHIVE
   Figma: node 561-333
   ========================================================================== */

.staff-archive {
  padding: 2rem 0 4rem;
}
.staff-archive__container {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: var(--container-padding-top) var(--container-padding-right) var(--container-padding-bottom) var(--container-padding-left);
}

/* Filter Pills */
.staff-archive__filters {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: center;
  margin-bottom: 1.5rem;
}
.staff-archive__filter-pill {
  appearance: none;
  border: none;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 40px;
  padding: 0.5rem 1rem;
  border-radius: var(--border-radius);
  font-family: var(--font-family-body);
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1.2;
  background: var(--color-secondary);
  color: var(--color-primary);
  transition: background-color 0.2s ease, color 0.2s ease;
}
.staff-archive__filter-pill:hover {
  opacity: 0.85;
}
.staff-archive__filter-pill--active {
  background: var(--color-primary);
  color: var(--color-gray);
}

/* Section Headers */
.staff-archive__section {
  margin-bottom: 2rem;
}
.staff-archive__section-header {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-bottom: 1.5rem;
}
.staff-archive__section-title {
  font-family: var(--font-family-heading);
  font-size: 1.3125rem;
  font-weight: 600;
  line-height: 1.43;
  color: var(--color-primary);
  margin: 0;
  white-space: nowrap;
}
.staff-archive__section-line {
  flex: 1;
  height: 2px;
  background: var(--color-primary);
  display: block;
}

/* Staff Grid — driven by --grid-cols custom properties from archive settings */
.staff-archive__grid {
  display: grid;
  grid-template-columns: repeat(var(--grid-cols, 2), 1fr);
  gap: 2rem 1rem;
}

@media (min-width: 640px) {
  .staff-archive__grid {
    grid-template-columns: repeat(var(--grid-cols-tablet, 3), 1fr);
  }
}
@media (min-width: 1024px) {
  .staff-archive__grid {
    grid-template-columns: repeat(var(--grid-cols-desktop, 4), 1fr);
  }
}

/* Staff Card */
.staff-archive__card {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  align-items: center;
}

/* Card Photo */
.staff-archive__card-photo {
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 1;
  border-radius: var(--border-radius);
  overflow: visible;
}
.staff-archive__card-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: var(--border-radius);
  display: block;
}
.staff-archive__card-photo a {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: var(--border-radius);
  overflow: hidden;
}
.staff-archive__card-photo-placeholder {
  display: block;
  width: 100%;
  height: 100%;
  background: var(--color-border);
  border-radius: var(--border-radius);
}

/* Content Team — uniform rounded-square photos */
.staff-archive--content-team .staff-archive__card-photo {
  background: var(--color-border);
}

/* Credential Badge */
.staff-archive__card-badge {
  position: absolute;
  bottom: -8px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 1;
  background: var(--color-primary);
  color: var(--color-gray);
  font-family: var(--font-family-body);
  font-size: 0.75rem;
  font-weight: 500;
  line-height: normal;
  padding: 2px 8px;
  border-radius: var(--border-radius);
  white-space: nowrap;
  box-shadow: var(--box-shadow);
}

/* Card Info */
.staff-archive__card-info {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  text-align: center;
  width: 100%;
}
.staff-archive__card-name {
  font-family: var(--font-family-heading);
  font-size: 1.125rem;
  font-weight: 500;
  line-height: 1.4;
  color: var(--color-primary);
  margin: 0;
  text-align: center;
}
.staff-archive__card-name a {
  color: inherit;
  text-decoration: none;
}
.staff-archive__card-name a:hover {
  text-decoration: underline;
}
.staff-archive__card-role {
  font-family: var(--font-family-body);
  font-size: 0.75rem;
  font-weight: 500;
  line-height: normal;
  color: var(--color-text);
  margin: 0;
  text-align: center;
}

/* Tablet: staff-archive */
@media (min-width: 768px) {
  .staff-archive {
    padding: 3rem 0 4rem;
  }

  /* Hide filter pills on tablet — closer to desktop layout */
  .staff-archive__filters {
    display: none;
  }

  .staff-archive__grid {
    grid-template-columns: repeat(4, 1fr);
    gap: 2rem 1.5rem;
  }

  .staff-archive__section {
    margin-bottom: 3rem;
    padding-bottom: 3rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  }

  .staff-archive__section:last-child {
    border-bottom: none;
    padding-bottom: 0;
  }

  .staff-archive__section-title {
    font-size: 1.5rem;
  }

  .staff-archive__card-name {
    font-size: 1.25rem;
    font-weight: 600;
    line-height: 1.2;
  }

  .staff-archive__card-badge {
    font-size: 0.875rem;
  }
}

/* Desktop: staff-archive */
@media (min-width: 1024px) {
  .staff-archive {
    padding: 3rem 0 4rem;
  }

  .staff-archive__container {
    padding-left: 80px;
    padding-right: 80px;
  }

  /* Hide filter pills on desktop — Figma desktop shows no region filters */
  .staff-archive__filters {
    display: none;
  }

  .staff-archive__grid {
    grid-template-columns: repeat(6, 1fr);
    gap: 2rem 1.5rem;
  }

  .staff-archive__section {
    margin-bottom: 3rem;
    padding-bottom: 3rem;
    border-bottom: none;
    position: relative;
  }

  /* Full-width divider between sections — extends beyond container padding */
  .staff-archive__section:not(:last-child)::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: -80px;
    right: -80px;
    height: 1px;
    background: rgba(0, 0, 0, 0.1);
  }

  .staff-archive__section:last-child {
    border-bottom: none;
    padding-bottom: 0;
  }

  .staff-archive__section-header {
    margin-bottom: 1.5rem;
  }

  .staff-archive__section-title {
    font-size: 1.875rem;
    line-height: 1.2;
  }

  .staff-archive__section-line {
    display: none;
  }

  .staff-archive__card-name {
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.3;
  }

  .staff-archive__card-role {
    font-size: 0.75rem;
    line-height: 1.2;
  }

  .staff-archive__card-badge {
    font-size: 0.75rem;
  }
}

/* ==========================================================================
   STAFF PROFILE (single-staff.php)
   Figma: node 807-3041
   ========================================================================== */

.staff-profile {
  position: relative;
  padding: 0;
  overflow: hidden;
}

.staff-profile__container {
  max-width: 960px;
  margin: 0 auto;
  padding: 48px 24px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  position: relative;
}

/* Breadcrumbs */
.staff-profile__breadcrumbs {
  position: relative;
  z-index: 1;
  width: 100%;
}

.staff-profile__breadcrumbs .breadcrumbs__list {
  justify-content: center;
}

/* Photo */
.staff-profile__photo-wrapper {
  position: relative;
  z-index: 1;
  width: 100%;
}

.staff-profile__photo {
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 1;
  border-radius: var(--border-radius-pill);
  overflow: hidden;
  z-index: 1;
}

.staff-profile__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.staff-profile__decoration {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 168px;
  height: 168px;
  z-index: 0;
}

.staff-profile__decoration svg {
  width: 100%;
  height: 100%;
  display: block;
}

/* Name & Title */
.staff-profile__heading {
  position: relative;
  z-index: 1;
  width: 100%;
  text-align: center;
}

.staff-profile__name {
  font-family: var(--font-family-heading);
  font-size: 1.875rem;
  font-weight: 600;
  line-height: 43.2px;
  color: var(--color-primary);
  text-align: center;
  margin: 0;
  width: 100%;
}

.staff-profile__title {
  font-family: var(--font-family-heading);
  font-size: 1.3125rem;
  font-weight: 600;
  line-height: 30px;
  color: var(--color-accent);
  text-align: center;
  margin: 0;
  width: 100%;
}

/* Badges */
.staff-profile__badges {
  position: relative;
  z-index: 1;
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  justify-content: center;
  width: 100%;
}

.staff-profile__badge {
  display: inline-flex;
  align-items: center;
  padding: 4px 8px;
  background: var(--color-primary);
  color: var(--color-gray);
  font-size: 0.875rem;
  font-weight: 500;
  border-radius: var(--border-radius);
  box-shadow: var(--box-shadow);
}

/* Contact Buttons */
.staff-profile__contact {
  display: flex;
  flex-direction: column;
  gap: 4px;
  width: 100%;
  position: relative;
  z-index: 1;
}

.staff-profile__contact-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  height: 40px;
  background: var(--color-secondary);
  border: none;
  border-radius: var(--border-radius);
  color: var(--color-primary);
  font-family: var(--font-family-body);
  font-size: 0.875rem;
  font-weight: 600;
  text-decoration: none;
  transition: background-color 0.2s ease;
}

.staff-profile__contact-btn:hover {
  background: var(--color-primary);
  color: var(--color-white);
}

/* Social / LinkedIn */
.staff-profile__social {
  position: relative;
  z-index: 1;
}

.staff-profile__social a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--color-accent);
  transition: opacity 0.2s ease;
}

.staff-profile__social a:hover {
  opacity: 0.7;
}

/* Bio Section */
.staff-profile__bio {
  padding: 48px 0;
}

.staff-profile__bio-container {
  max-width: 960px;
  margin: 0 auto;
  padding: 0 16px;
  font-family: var(--font-family-body);
  font-size: 1rem;
  line-height: 1.2;
  color: var(--color-text);
}

.staff-profile__bio-container p {
  margin: 0 0 1rem;
}

.staff-profile__bio-container p:last-child {
  margin-bottom: 0;
}

/* --- Legacy column-grid utilities used inside BD rep bio HTML ---
   The bio field stores hand-authored markup like:
     <div class="col-container">
       <div class="col-3 bordered"><img><h3>...</h3><p>...</p><a>...</a></div>
       ...
     </div>
   Mobile: stacked cards. Desktop (768+): 3-column grid. */
.staff-profile__bio-container .col-container {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 24px 0;
}

.staff-profile__bio-container .col-3 {
  flex: 0 0 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.staff-profile__bio-container .col-3.bordered {
  padding: 16px;
  background-color: var(--color-gray);
  border: 1px solid #efefef;
  border-radius: var(--border-radius);
}

.staff-profile__bio-container .col-3 img {
  max-width: 85%;
  width: auto;
  height: 77px;
  object-fit: contain;
  margin: 0 auto 16px;
}

.staff-profile__bio-container .col-3 h3 {
  font-family: var(--font-family-heading);
  font-size: 1.125rem;
  line-height: 1.2;
  font-weight: 700;
  color: var(--color-primary);
  text-align: center;
  margin: 0 0 12px;
}

.staff-profile__bio-container .col-3 p {
  text-align: center;
  margin: 0 0 16px;
}

.staff-profile__bio-container .col-3 a {
  color: var(--color-link);
  text-decoration: underline;
}

.staff-profile__bio-container .col-3 a:hover {
  text-decoration: none;
}

@media (min-width: 768px) {
  .staff-profile__bio-container .col-3 {
    flex: 1 1 calc(33.333% - 10px);
    max-width: calc(33.333% - 10px);
  }
}

/* Featured In */
.staff-profile__featured {
  background-color: var(--color-secondary);
  padding: 48px 0;
}

.staff-profile__featured-container {
  max-width: 960px;
  margin: 0 auto;
  padding: 0 16px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: center;
}

.staff-profile__featured-header {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}

.staff-profile__featured-line {
  width: 50px;
  height: 2px;
  background: var(--color-accent);
  border-radius: 1px;
}

.staff-profile__featured-heading {
  font-family: var(--font-family-heading);
  font-size: 1.3125rem;
  font-weight: 600;
  line-height: 30px;
  color: var(--color-primary);
  text-align: center;
  margin: 0;
}

.staff-profile__featured-carousel {
  width: 100%;
  overflow: hidden;
}

.staff-profile__featured-track {
  display: flex;
  gap: 16px;
  transition: transform 0.4s ease;
}

.staff-profile__featured-logo {
  flex-shrink: 0;
  border-radius: var(--border-radius);
  overflow: hidden;
}

.staff-profile__featured-logo a {
  display: block;
}

.staff-profile__featured-logo img {
  width: 100%;
  aspect-ratio: 672 / 362;
  object-fit: contain;
  display: block;
  border-radius: var(--border-radius);
}

.staff-profile__featured-dots {
  display: flex;
  gap: 8px;
  justify-content: center;
  padding-top: 16px;
}

.staff-profile__featured-dot {
  width: 8px;
  height: 8px;
  border-radius: var(--border-radius-pill);
  background: var(--color-border);
  border: none;
  padding: 0;
  cursor: pointer;
  transition: background-color 0.2s ease;
}

.staff-profile__featured-dot--active {
  background: var(--color-primary);
}

/* Articles (Published & Reviewed) */
.staff-profile__articles {
  background-color: var(--color-white);
  padding: 32px 0;
}

.staff-profile__articles-container {
  max-width: 960px;
  margin: 0 auto;
  padding: 0 16px;
}

.staff-profile__articles-heading {
  font-family: var(--font-family-heading);
  font-size: 1.3125rem;
  font-weight: 600;
  line-height: 30px;
  color: var(--color-primary);
  margin: 0 0 1rem;
}

.staff-profile__articles-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.staff-profile__articles-item {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 32px;
}

.staff-profile__articles-item svg {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  color: var(--color-primary);
  transform: rotate(-90deg);
}

.staff-profile__articles-item a {
  font-size: 0.8125rem;
  line-height: 1.2;
  color: var(--color-link);
  text-decoration: underline;
}

.staff-profile__articles-item a:hover {
  text-decoration: none;
}

/* Articles Section Wrapper (for desktop side-by-side) */
.staff-profile__articles-section {
  background-color: var(--color-white);
  padding: 32px 0;
}

.staff-profile__articles-grid {
  max-width: 960px;
  margin: 0 auto;
  padding: 0 16px;
  display: flex;
  flex-direction: column;
}

.staff-profile__articles-section .staff-profile__articles {
  background-color: transparent;
  padding: 0;
}

.staff-profile__articles-section .staff-profile__articles-container {
  max-width: none;
  padding: 0;
}

/* ---------- Staff Profile — Desktop (768px+) ---------- */
@media (min-width: 768px) {

  /* Hero: CSS Grid — text left, photo right */
  .staff-profile {
    background-color: var(--color-gray);
    box-shadow: var(--box-shadow);
  }

  .staff-profile__container {
    max-width: 1280px;
    padding: 64px 80px;
    display: grid;
    grid-template-columns: 1fr 444px;
    grid-template-areas:
      "breadcrumbs photo"
      "heading     photo"
      "badges      photo"
      "contact     photo"
      "social      photo";
    column-gap: 48px;
    row-gap: 16px;
    align-items: start;
    align-content: center;
  }

  .staff-profile__breadcrumbs {
    grid-area: breadcrumbs;
    align-self: end;
  }

  .staff-profile__breadcrumbs .breadcrumbs__list {
    justify-content: flex-start;
  }

  .staff-profile__photo-wrapper {
    grid-area: photo;
    width: 444px;
    align-self: center;
  }

  .staff-profile__photo {
    border-radius: var(--border-radius-drawer);
  }

  .staff-profile__decoration {
    right: 0;
    width: 248px;
    height: 248px;
  }

  .staff-profile__heading {
    grid-area: heading;
    text-align: left;
  }

  .staff-profile__name {
    font-size: 2.25rem;
    text-align: left;
  }

  .staff-profile__title {
    font-size: 1.5625rem;
    text-align: left;
  }

  .staff-profile__badges {
    grid-area: badges;
    justify-content: flex-start;
  }

  .staff-profile__contact {
    grid-area: contact;
    flex-direction: row;
  }

  .staff-profile__contact-btn {
    flex: 1 1 0%;
  }

  .staff-profile__social {
    grid-area: social;
  }

  /* Bio — wider container */
  .staff-profile__bio-container {
    max-width: 1280px;
    padding: 0 80px;
  }

  /* Featured In — wider, 3 logos in a static row */
  .staff-profile__featured-container {
    max-width: 1280px;
    padding: 0 80px;
  }

  .staff-profile__featured-track {
    gap: 16px;
  }

  .staff-profile__featured-logo {
    flex: 1 0 0%;
    width: auto;
  }

  /* Articles — side by side, 48px vertical padding */
  .staff-profile__articles-section {
    padding: 48px 0;
  }

  .staff-profile__articles-grid {
    max-width: 1280px;
    padding: 0 80px;
    flex-direction: row;
    gap: 0;
  }

  .staff-profile__articles-section .staff-profile__articles {
    flex: 1 1 50%;
  }

  .staff-profile__articles-heading {
    font-size: 1.3125rem;
  }

  .staff-profile__articles-item a {
    font-size: 0.8125rem;
  }
}

/* ==========================================================================
   BD REP PROFILE (single-bd_rep.php)
   Layout: client spec — left column: profile info + service area map stacked;
   right column: contact form (full-height). Mobile: everything stacks in
   DOM order (info → form → map). Scoped to .staff-profile--bd-rep so the
   shared staff-profile layout stays untouched for single-staff.
   ========================================================================== */

/* Mobile base — stack everything. Info-row and details are both plain
   flex columns so the DOM order renders as:
   breadcrumbs → photo → heading → badges → contact → form → map. */
.staff-profile--bd-rep .staff-profile__container {
  gap: 24px;
}

.staff-profile--bd-rep .staff-profile__info-row {
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 100%;
}

.staff-profile--bd-rep .staff-profile__details {
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 100%;
  align-items: center;
}

.staff-profile--bd-rep .staff-profile__form-col,
.staff-profile--bd-rep .staff-profile__map-col {
  position: relative;
  z-index: 1;
  width: 100%;
}

/* Reset service-area-map chrome when it lives inside the hero grid */
.staff-profile--bd-rep .staff-profile__map-col .service-area-map {
  padding: 0;
}
.staff-profile--bd-rep .staff-profile__map-col .service-area-map__header {
  margin-bottom: 12px;
}

/* --- BD Contact Form component --- */
.bd-contact-form {
  position: relative;
  padding: 32px 24px 24px;
  border-radius: var(--border-radius);
  overflow: hidden;
}

.bd-contact-form--dark {
  background: var(--color-primary);
  color: var(--color-gray);
  box-shadow: 0 16px 32px -8px rgba(12, 12, 13, 0.4);
}

.bd-contact-form--light {
  background: var(--color-secondary);
  color: var(--color-text);
}

.bd-contact-form__headline {
  font-family: var(--font-family-heading);
  font-weight: var(--font-weight-semibold, 600);
  font-size: 1.3125rem;
  line-height: 30px;
  margin: 0 0 16px;
  text-align: left;
}

.bd-contact-form--dark .bd-contact-form__headline {
  color: var(--color-gray);
}

.bd-contact-form--light .bd-contact-form__headline {
  color: var(--color-primary);
}

/* GF wrapper reset so BD form matches hero form spacing */
.bd-contact-form .gform_wrapper { position: static !important; }
.bd-contact-form .gform_heading { display: none !important; }
.bd-contact-form .gform_fields > .gfield--type-html:first-child { display: none !important; }

/* Desktop (768px+): two-column hero.
   Left column: photo → heading → badges → contact → map stacked.
   Right column: form spans full height. */
@media (min-width: 768px) {
  .staff-profile--bd-rep .staff-profile__container {
    grid-template-columns: 7fr 3fr;
    grid-template-areas:
      "breadcrumbs breadcrumbs"
      "info        form"
      "map         form";
    column-gap: 48px;
    row-gap: 24px;
    align-items: start;
  }

  /* Info row = 2 sub-cols: photo | details (heading/badges/contact stacked) */
  .staff-profile--bd-rep .staff-profile__info-row {
    grid-area: info;
    display: grid;
    grid-template-columns: 200px minmax(0, 1fr);
    column-gap: 24px;
    row-gap: 0;
    align-items: start;
  }

  .staff-profile--bd-rep .staff-profile__photo-wrapper {
    /* Reset inherited grid-area from base single-staff rule — photo-wrapper
       now lives inside .staff-profile__info-row (nested grid), not the
       container grid, so it auto-places in the nested grid's first column. */
    grid-area: auto;
    width: 100%;
    max-width: 200px;
    align-self: start;
  }

  .staff-profile--bd-rep .staff-profile__photo {
    aspect-ratio: 1 / 1;
    border-radius: var(--border-radius);
  }

  .staff-profile--bd-rep .staff-profile__details {
    align-items: flex-start;
  }

  .staff-profile--bd-rep .staff-profile__heading {
    text-align: left;
  }

  .staff-profile--bd-rep .staff-profile__name,
  .staff-profile--bd-rep .staff-profile__title {
    text-align: left;
  }

  .staff-profile--bd-rep .staff-profile__badges {
    justify-content: flex-start;
  }

  .staff-profile--bd-rep .staff-profile__contact {
    flex-direction: row;
    justify-content: flex-start;
  }

  .staff-profile--bd-rep .staff-profile__contact-btn {
    flex: 0 1 auto;
    width: auto;
    padding: 0 20px;
  }

  .staff-profile--bd-rep .staff-profile__form-col {
    grid-area: form;
    align-self: start;
    display: flex;
  }

  .staff-profile--bd-rep .staff-profile__form-col .bd-contact-form {
    flex: 0 0 auto;
    width: 100%;
  }

  .staff-profile--bd-rep .staff-profile__map-col {
    grid-area: map;
    margin-top: 8px;
  }

  .bd-contact-form {
    padding: 32px;
  }
}

/* ==========================================================================
   SCREEN READER TEXT
   ========================================================================== */

.screen-reader-text {
  border: 0;
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
  word-wrap: normal !important;
}

.screen-reader-text:focus {
  background-color: var(--color-neutral);
  border-radius: var(--border-radius);
  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
  clip: auto !important;
  clip-path: none;
  color: var(--color-primary);
  display: block;
  font-size: 0.875rem;
  font-weight: 700;
  height: auto;
  left: 5px;
  line-height: normal;
  padding: 15px 23px 14px;
  text-decoration: none;
  top: 5px;
  width: auto;
  z-index: 100000;
}

.skip-link {
  position: fixed;
  top: -100px;
  left: 6px;
  z-index: 999999;
  padding: 15px 23px 14px;
  background-color: var(--color-neutral);
  color: var(--color-primary);
  font-size: 0.875rem;
  font-weight: 700;
  text-decoration: none;
  border-radius: var(--border-radius);
  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
  transition: top 0.2s ease;
}

.skip-link:focus {
  top: 6px;
}

/* ==========================================================================
   RESPONSIVE CONTAINER PADDING
   ========================================================================== */

@media (max-width: 767px) {
  :root {
    --container-padding-top: var(--container-padding-mobile-top);
    --container-padding-right: var(--container-padding-mobile-right);
    --container-padding-bottom: var(--container-padding-mobile-bottom);
    --container-padding-left: var(--container-padding-mobile-left);
  }
}

/* ==========================================================================
   COMPARE MAP — Two-Column Layout
   Left panel: dark navy bg with headline + filters (scrollable)
   Right panel: Google Map filling full height
   ========================================================================== */

.compare-map {
  --compare-map-panel-bg: var(--color-primary);
}

.compare-map__container {
  max-width: var(--container-max-width);
  margin: 0 auto;
}

/* Two-column grid */
.compare-map__layout {
  display: grid;
  grid-template-columns: 45% 55%;
  min-height: var(--map-height, 600px);
}

/* Left panel */
.compare-map__panel {
  background: var(--compare-map-panel-bg);
  color: var(--color-white);
  padding: 3rem 2.5rem;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: var(--color-primary) rgba(255, 255, 255, 0.1);
}

.compare-map__panel::-webkit-scrollbar {
  width: 8px;
}

.compare-map__panel::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.08);
  border-radius: var(--border-radius);
}

.compare-map__panel::-webkit-scrollbar-thumb {
  background: var(--color-primary);
  border-radius: var(--border-radius);
}

/* Panel header: headline + separator + copy */
.compare-map__panel-header {
  margin-bottom: 16px;
  text-align: center;
}

.compare-map__headline {
  font-family: var(--font-family-heading);
  font-size: 2.5rem;
  font-weight: var(--font-weight-semibold, 600);
  color: var(--color-white);
  margin: 0 0 8px;
  line-height: 36px;
}

.compare-map__separator {
  width: 50px;
  height: 3px;
  background: var(--color-accent);
  margin: 0 auto 1.5rem;
}

.compare-map__copy {
  color: var(--color-white);
  font-size: 1rem;
  line-height: 1.5;
  margin: 0;
}

/* Filter panel (inside left panel) */
.compare-map__filters {
  display: flex;
  flex-direction: column;
  gap: 1.75rem;
}

.compare-map__filter-group {
  /* no special positioning needed */
}

.compare-map__filter-group-label {
  font-size: 1rem;
  font-weight: 700;
  color: var(--color-white);
  margin: 0 0 0.75rem;
}

.compare-map__filter-group-options {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

/* Filter Chips — rounded pill buttons */
.compare-map__filter-chip {
  padding: 0.5rem 1.25rem;
  background: transparent;
  border: 1.5px solid rgba(255, 255, 255, 0.4);
  border-radius: var(--border-radius-pill);
  cursor: pointer;
  font-size: 0.875rem;
  font-family: inherit;
  color: var(--color-white);
  transition: background 0.15s, border-color 0.15s, color 0.15s;
  white-space: nowrap;
}

.compare-map__filter-chip:hover {
  border-color: rgba(255, 255, 255, 0.75);
  background: rgba(255, 255, 255, 0.08);
}

.compare-map__filter-chip--active {
  background: var(--color-white);
  border-color: var(--color-white);
  color: var(--compare-map-panel-bg, var(--color-primary-dark));
}

.compare-map__filter-chip--active:hover {
  background: rgba(255, 255, 255, 0.9);
  border-color: rgba(255, 255, 255, 0.9);
  color: var(--compare-map-panel-bg, var(--color-primary-dark));
}

/* Clear all link */
.compare-map__filter-clear {
  padding: 0;
  margin-top: 0.5rem;
  background: none;
  border: none;
  cursor: pointer;
  font-size: 0.8125rem;
  color: rgba(255, 255, 255, 0.55);
  text-decoration: underline;
  text-underline-offset: 2px;
  transition: color 0.2s;
}

.compare-map__filter-clear:hover {
  color: var(--color-white);
}

/* Right column: map */
.compare-map__map-col {
  position: relative;
  min-height: 400px;
}

/* Map Wrapper */
.compare-map__map-wrap {
  position: relative;
  width: 100%;
  height: 100%;
}

.compare-map__map-error {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  background: var(--color-neutral);
  color: var(--color-text-muted);
  font-size: 0.875rem;
}

/* Mobile Filter Button — hidden on desktop, overlaid on map on mobile */
.compare-map__mobile-filter-btn {
  display: none;
  align-items: center;
  gap: 0.5rem;
  padding: 0.625rem 1rem;
  background: var(--color-secondary);
  border: none;
  border-radius: var(--border-radius);
  cursor: pointer;
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--color-text);
  position: absolute;
  top: 18px;
  left: 20px;
  z-index: 10;
}

.compare-map__mobile-filter-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.25rem;
  height: 1.25rem;
  padding: 0 0.375rem;
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--color-white);
  background: var(--color-primary);
  border-radius: var(--border-radius-form-progress);
}

/* Location Drawer */
.compare-map__drawer-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.4);
  z-index: 999;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s, visibility 0.3s;
}

.compare-map__drawer-overlay--visible {
  opacity: 1;
  visibility: visible;
}

.compare-map__drawer {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  max-height: 85vh;
  background: var(--color-white);
  z-index: 1000;
  transform: translateY(100%);
  transition: transform 0.3s ease, visibility 0.3s;
  overflow-y: auto;
  border-radius: var(--border-radius-drawer) var(--border-radius-drawer) 0 0;
  visibility: hidden;
}

.compare-map__drawer--open {
  transform: translateY(0);
  visibility: visible;
}

.compare-map__drawer-content {
  display: flex;
  flex-direction: column;
}

.compare-map__drawer-photo {
  width: 100%;
  aspect-ratio: 16 / 10;
  overflow: hidden;
}

.compare-map__drawer-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.compare-map__drawer-info {
  padding: 1.5rem;
}

.compare-map__drawer-name {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--color-text);
  margin-bottom: 0.5rem;
}

.compare-map__drawer-address {
  font-size: 0.875rem;
  color: var(--color-text-light);
  margin-bottom: 0.75rem;
}

.compare-map__drawer-rating {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  font-size: 0.875rem;
}

.compare-map__drawer-rating-num {
  font-weight: 600;
  color: var(--color-text);
}

.compare-map__drawer-rating-stars {
  color: var(--color-star);
}

.compare-map__drawer-actions {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  padding: 0 1.5rem 1.5rem;
}

.compare-map__drawer-btn {
  display: block;
  padding: 0.75rem 1.5rem;
  border-radius: var(--border-radius);
  text-align: center;
  text-decoration: none;
  font-size: 0.9375rem;
  font-weight: 600;
  transition: opacity 0.2s;
}

.compare-map__drawer-btn:hover {
  opacity: 0.9;
}

.compare-map__drawer-btn--website {
  background: var(--color-primary);
  color: var(--color-white);
}

.compare-map__drawer-btn--phone {
  background: var(--color-neutral);
  color: var(--color-text);
  border: 1px solid var(--color-border);
}

/* Mobile Filter Drawer */
.compare-map__mobile-drawer {
  display: none;
}

/* Overlay behind mobile filter bottom sheet */
.compare-map__mobile-drawer-overlay {
  display: none;
}

.compare-map__mobile-drawer-overlay--visible {
  display: block;
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.3);
  z-index: 1000;
}

.compare-map__mobile-drawer--open {
  display: flex;
  flex-direction: column;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  height: 50vh;
  z-index: 1001;
  background: var(--color-white);
  border-radius: var(--border-radius-drawer) var(--border-radius-drawer) 0 0;
  box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.15);
}

.compare-map__mobile-drawer-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 1.25rem;
  border-bottom: 1px solid var(--color-border);
}

.compare-map__mobile-drawer-title {
  font-size: 1.125rem;
  font-weight: 700;
  margin: 0;
}

.compare-map__mobile-drawer-close {
  background: none;
  border: none;
  cursor: pointer;
  padding: 0.25rem;
  color: var(--color-text);
}

.compare-map__mobile-drawer-body {
  flex: 1;
  overflow-y: auto;
  padding: 1rem 1.25rem;
}

.compare-map__mobile-drawer-body .compare-map__filter-group {
  margin-bottom: 1.5rem;
}

.compare-map__mobile-drawer-body .compare-map__filter-group-label {
  color: var(--color-text);
}

.compare-map__mobile-drawer-body .compare-map__filter-chip {
  background: var(--color-neutral);
  border-color: var(--color-border);
  color: var(--color-text);
}

.compare-map__mobile-drawer-body .compare-map__filter-chip:hover {
  border-color: var(--color-primary);
  color: var(--color-primary);
  background: var(--color-neutral);
}

.compare-map__mobile-drawer-body .compare-map__filter-chip--active {
  background: var(--color-primary);
  border-color: var(--color-primary);
  color: var(--color-white);
}

.compare-map__mobile-drawer-footer {
  display: flex;
  gap: 0.75rem;
  padding: 1rem 1.25rem;
  border-top: 1px solid var(--color-border);
}

.compare-map__mobile-drawer-clear {
  flex: 0 0 auto;
  padding: 0.75rem 1.25rem;
  background: none;
  border: 1px solid var(--color-border);
  border-radius: var(--border-radius);
  cursor: pointer;
  font-size: 0.875rem;
  color: var(--color-text-light);
}

.compare-map__mobile-drawer-apply {
  flex: 1;
  padding: 0.75rem 1.25rem;
  background: var(--color-primary);
  border: none;
  border-radius: var(--border-radius);
  cursor: pointer;
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--color-white);
}

/* Responsive — stack on mobile */
@media (max-width: 767px) {
  .compare-map__layout {
    grid-template-columns: 1fr;
    grid-template-rows: auto 1fr;
    height: var(--map-height, 600px);
    overflow: hidden;
  }

  .compare-map__panel {
    padding: 24px 16px;
    overflow: visible;
  }

  .compare-map__map-col {
    min-height: 0;
  }

  .compare-map__headline {
    font-size: 1.5625rem;
  }

  .compare-map__filters {
    display: none;
  }

  .compare-map__mobile-filter-btn {
    display: flex;
  }

  .compare-map__drawer {
    width: 100%;
    max-width: 100%;
  }
}

/* Tablet: compare-map */
@media (min-width: 768px) {
  .compare-map {
    display: flex;
    justify-content: center;
  }

  .compare-map__layout {
    max-width: var(--container-max-width, 1280px);
    border-radius: var(--border-radius);
  }

  .compare-map__panel {
    padding: 2.5rem 2rem;
  }

  .compare-map__panel-header {
    text-align: left;
  }

  .compare-map__separator {
    margin: 0 0 1rem;
  }

  .compare-map__headline {
    font-size: 1.75rem;
  }

  .compare-map__map-wrap {
    border-radius: var(--border-radius);
    overflow: hidden;
  }
}

/* Desktop: compare-map */
@media (min-width: 1024px) {
  .compare-map {
    padding: 80px;
    background: var(--compare-map-panel-bg);
  }

  .compare-map__layout {
    grid-template-columns: 1fr 1fr;
    gap: 80px;
    background: transparent;
    max-width: calc(var(--container-max-width, 1280px) - 160px);
    min-height: 0;
    align-items: stretch;
  }

  .compare-map__panel {
    padding: 0;
    background: transparent;
  }

  .compare-map__panel-header {
    text-align: left;
    margin-bottom: 24px;
  }

  .compare-map__separator {
    margin: 0 0 1.5rem;
  }

  .compare-map__headline {
    font-size: 1.875rem;
    line-height: 36px;
  }

  .compare-map__copy {
    font-size: 1rem;
    line-height: 1.2;
  }

  .compare-map__filters {
    background: rgba(248, 245, 245, 0.15);
    padding: 2rem;
    border-radius: var(--border-radius);
    gap: 1.5rem;
    max-height: 55vh;
    overflow-y: scroll;
    scrollbar-width: thin;
    scrollbar-color: var(--color-text-light) transparent;
  }

  .compare-map__filters::-webkit-scrollbar {
    width: 15px;
    background-color: transparent;
    border-radius: var(--border-radius);
  }

  .compare-map__filters::-webkit-scrollbar-button {
    display: none;
  }

  .compare-map__filters::-webkit-scrollbar-thumb {
    background-color: var(--color-text-light);
    border-radius: 10px;
    background-clip: padding-box;
  }

  .compare-map__filter-group-label {
    font-size: 1.125rem;
    font-weight: 500;
    font-family: var(--font-family-heading);
  }

  .compare-map__map-col {
    position: relative;
    overflow: hidden;
  }

  .compare-map__map-wrap {
    border-radius: var(--border-radius);
    overflow: hidden;
  }

  /* Location drawer: horizontal card pinned to bottom of map */
  .compare-map__drawer-overlay {
    position: absolute;
    border-radius: var(--border-radius);
    z-index: 11;
  }

  .compare-map__drawer {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    max-height: none;
    border-radius: 0 0 var(--border-radius) var(--border-radius);
    box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.15);
    z-index: 12;
    overflow: hidden;
  }

  .compare-map__drawer-content {
    flex-direction: row;
    align-items: stretch;
  }

  .compare-map__drawer-photo {
    width: 180px;
    min-width: 180px;
    aspect-ratio: auto;
  }

  .compare-map__drawer-info {
    flex: 1;
    padding: 1rem 1.25rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }

  .compare-map__drawer-name {
    font-size: 1.1rem;
    margin-bottom: 0.25rem;
  }

  .compare-map__drawer-address {
    margin-bottom: 0.5rem;
  }

  .compare-map__drawer-actions {
    padding: 1rem 1.25rem;
    gap: 0.5rem;
  }

  .compare-map__drawer-btn {
    padding: 0.5rem 1rem;
    font-size: 0.8125rem;
  }
}

/* ==========================================================================
   INLINE LINK BANK
   ========================================================================== */

/* ── Inline Link Bank ── */

.inline-link-bank {
  width: 100%;
}

/* ==========================================================================
   JUMP TO BAR
   ========================================================================== */

.inline-link-bank--jump-to-bar {
  background: var(--color-primary-dark);
  position: sticky;
  top: var(--inline-link-bank-offset, 0px);
  z-index: 99;
}

.inline-link-bank__toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 0.875rem 1rem;
  background: none;
  border: none;
  color: var(--color-white);
  font-family: var(--font-family-heading);
  font-size: 1.125rem;
  font-weight: 500;
  cursor: pointer;
  max-width: var(--container-max-width);
  margin: 0 auto;
}

.inline-link-bank__toggle-icon {
  transition: transform 0.3s ease;
  flex-shrink: 0;
}

.inline-link-bank--jump-to-bar.is-open .inline-link-bank__toggle-icon {
  transform: rotate(180deg);
}

.inline-link-bank__dropdown {
  background: var(--color-primary-dark);
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.inline-link-bank--jump-to-bar .inline-link-bank__list {
  list-style: none;
  margin: 0;
  padding: 0;
  max-width: var(--container-max-width);
  margin: 0 auto;
}

.inline-link-bank--jump-to-bar .inline-link-bank__item {
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.inline-link-bank--jump-to-bar .inline-link-bank__item:last-child {
  border-bottom: none;
}

.inline-link-bank--jump-to-bar .inline-link-bank__link {
  display: block;
  padding: 0.875rem 1rem;
  color: rgba(255, 255, 255, 0.7);
  text-decoration: none;
  font-size: var(--font-size-sm);
  transition: color 0.2s ease, background 0.2s ease;
}

.inline-link-bank--jump-to-bar .inline-link-bank__link:hover {
  color: var(--color-white);
  background: rgba(255, 255, 255, 0.05);
  text-decoration: none;
}

.inline-link-bank--jump-to-bar .inline-link-bank__item--active .inline-link-bank__link {
  color: var(--color-link-on-dark);
  font-weight: var(--font-weight-semibold);
}

/* ==========================================================================
   ICON CARDS
   ========================================================================== */

.inline-link-bank--icon-cards {
  padding: 2rem 0;
  border-bottom: 1px solid var(--color-secondary);
}

.inline-link-bank__container {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 0 16px;
}

.inline-link-bank__header {
  text-align: center;
  margin-bottom: 1rem;
}

.inline-link-bank__headline {
  font-family: var(--font-family-heading);
  font-size: 1.125rem;
  font-weight: var(--font-weight-medium);
  color: var(--color-primary);
  margin: 0;
  line-height: 1.4;
}

.inline-link-bank__subtitle {
  font-family: var(--font-family-secondary);
  font-size: 0.6875rem;
  font-weight: var(--font-weight-semibold);
  color: var(--color-primary);
  text-transform: uppercase;
  letter-spacing: 0.44px;
  line-height: 1.2;
  margin: 0.25rem 0 0;
}

.inline-link-bank__grid {
  display: flex;
  gap: 0.25rem;
  overflow-x: auto;
  flex-wrap: nowrap;
  padding: 0 1rem;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}

.inline-link-bank__grid::-webkit-scrollbar {
  display: none;
}

.inline-link-bank__card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
  text-decoration: none;
  color: var(--color-text);
  cursor: pointer;
  transition: transform 0.2s ease;
  flex: 1 0 0;
  min-width: 0;
  position: relative;
}

a.inline-link-bank__card:hover {
  transform: translateY(-2px);
  text-decoration: none;
}

.inline-link-bank__icon {
  width: 80px;
  height: 80px;
  border-radius: var(--border-radius);
  background: var(--color-bg-secondary, var(--color-secondary));
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}

.inline-link-bank__icon img {
  width: 32px;
  height: 32px;
  object-fit: contain;
}

.inline-link-bank__badge {
  position: absolute;
  top: 4px;
  right: 4px;
  color: var(--color-primary);
  pointer-events: none;
}

.inline-link-bank__card--active .inline-link-bank__icon {
  background: var(--color-accent);
  box-shadow: 0 4px 12px rgba(185, 119, 39, 0.3);
}

.inline-link-bank__card--active .inline-link-bank__badge {
  color: var(--color-white);
}

.inline-link-bank__card--active .inline-link-bank__label {
  color: var(--color-accent);
}

.inline-link-bank__label {
  font-family: var(--font-family-secondary);
  font-size: 0.875rem;
  font-weight: var(--font-weight-semibold);
  text-align: center;
  line-height: 1.2;
  color: var(--color-primary);
}

.inline-link-bank__desktop-label {
  display: none;
}

/* Scroll offset for anchor targets below sticky header + link bank */
.site-main [id] {
  scroll-margin-top: var(--scroll-offset-total, 120px);
}

[id].inline-link-bank {
  scroll-margin-top: var(--scroll-offset-total, 120px);
}

/* Tablet: inline-link-bank */
@media (min-width: 768px) {

  /* == Icon Cards (tablet) == */

  .inline-link-bank--icon-cards {
    padding: 2.5rem 0;
  }

  .inline-link-bank__container {
    padding: 0 var(--container-padding-right) 0 var(--container-padding-left);
  }

  .inline-link-bank__header {
    margin-bottom: 1.5rem;
  }

  .inline-link-bank__headline {
    font-size: 1.625rem;
  }

  .inline-link-bank__grid {
    flex-wrap: nowrap;
    overflow-x: visible;
    gap: 1rem;
    padding: 0;
  }

  .inline-link-bank__card {
    flex: 1 1 0;
    flex-direction: row;
    align-items: center;
    gap: 10px;
    background: var(--color-bg-secondary, var(--color-secondary));
    padding: 1.25rem;
    border-radius: var(--border-radius);
    min-width: 0;
  }

  .inline-link-bank__card--active {
    background: var(--color-accent);
  }

  .inline-link-bank__icon {
    width: 32px;
    height: 32px;
    background: transparent;
    flex-shrink: 0;
    position: static;
  }

  .inline-link-bank__icon img {
    width: 32px;
    height: 32px;
  }

  .inline-link-bank__badge {
    top: 4px;
    right: 4px;
    width: 20px;
    height: 20px;
  }

  /* Reposition badge relative to card, not icon */
  .inline-link-bank__card {
    position: relative;
  }

  .inline-link-bank__card .inline-link-bank__badge {
    position: absolute;
    top: 4px;
    right: 4px;
  }

  .inline-link-bank__card--active .inline-link-bank__icon {
    background: transparent;
    box-shadow: none;
  }

  .inline-link-bank__card--active .inline-link-bank__icon img {
    filter: brightness(0) invert(1);
  }

  .inline-link-bank__card--active .inline-link-bank__label {
    color: var(--color-gray);
  }

  .inline-link-bank__label {
    font-family: var(--font-family-heading);
    font-size: 1.125rem;
    font-weight: 500;
    text-align: center;
  }
}

/* Tablet: inline-link-bank jump-to-bar */
@media (min-width: 915px) {

  .inline-link-bank--jump-to-bar {
    box-shadow: var(--box-shadow);
  }

  .inline-link-bank__toggle {
    display: none;
  }

  .inline-link-bank__desktop-label {
    display: block;
    font-family: var(--font-family-heading);
    font-size: 0.9375rem;
    font-weight: 500;
    color: var(--color-border);
    white-space: nowrap;
    flex-shrink: 0;
  }

  .inline-link-bank--jump-to-bar .inline-link-bank__dropdown {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;
    border-top: none;
    max-width: var(--container-max-width);
    margin: 0 auto;
    padding: 1.25rem var(--container-padding-right) 1.25rem var(--container-padding-left);
    width: 100%;
  }

  .inline-link-bank--jump-to-bar .inline-link-bank__list {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 1.25rem;
    padding: 0;
  }

  .inline-link-bank--jump-to-bar .inline-link-bank__item {
    border-bottom: none;
  }

  .inline-link-bank--jump-to-bar .inline-link-bank__link {
    display: inline;
    padding: 0 0 8px 0;
    color: var(--color-border);
    font-size: 0.9375rem;
    font-weight: 500;
    white-space: nowrap;
  }

  .inline-link-bank--jump-to-bar .inline-link-bank__link:hover {
    background: none;
    color: var(--color-gray);
  }

  .inline-link-bank--jump-to-bar .inline-link-bank__item--active .inline-link-bank__link {
    color: var(--color-gray);
    font-weight: 700;
    border-bottom: 4px solid var(--color-accent);
    padding-bottom: 8px;
  }
}

/* Desktop: inline-link-bank */
@media (min-width: 1024px) {

  /* == Jump to Bar (desktop) == */

  .inline-link-bank__dropdown {
    max-width: var(--container-max-width);
    padding: 24px var(--container-padding-right) 24px var(--container-padding-left);
  }

  .inline-link-bank__desktop-label {
    font-size: 1rem;
  }

  .inline-link-bank--jump-to-bar .inline-link-bank__list {
    gap: 2rem;
  }

  .inline-link-bank--jump-to-bar .inline-link-bank__link {
    font-size: 1rem;
  }

  /* == Icon Cards (desktop) == */

  .inline-link-bank--icon-cards {
    padding: 48px 0;
  }

  .inline-link-bank__container {
    padding: 0 var(--container-padding-right) 0 var(--container-padding-left);
  }

  .inline-link-bank__header {
    text-align: center;
  }

  .inline-link-bank__headline {
    font-size: 1.875rem;
    font-weight: var(--font-weight-semibold);
    line-height: 36px;
  }

  .inline-link-bank__subtitle {
    font-size: 0.6875rem;
    letter-spacing: 0.44px;
    line-height: 13.2px;
  }

  .inline-link-bank__grid {
    gap: 16px;
    justify-content: center;
  }

  .inline-link-bank__card {
    padding: 24px;
    gap: 10px;
    justify-content: center;
  }

  .inline-link-bank__label {
    font-size: 1.3125rem;
    line-height: 25.2px;
  }
}

/* Wide desktop: inline-link-bank jump-to-bar */
@media (min-width: 1280px) {
  .inline-link-bank--jump-to-bar .inline-link-bank__list {
    gap: 48px;
  }
}

/* Anchor scroll offset for sticky header */
[id].compare-map,
[id].photo-gallery,
[id].video-embed,
[id].content-tabs,
[id].cards,
[id].form-cta,
[id].google-map {
  scroll-margin-top: var(--scroll-offset-total, 120px);
}

/* ==========================================================================
   PHOTO GALLERY
   ========================================================================== */

.photo-gallery {
  padding: 48px 16px;
  background: var(--color-secondary);
}

.photo-gallery__container {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 0;
}

.photo-gallery__headline {
  font-size: 1.5625rem;
  font-weight: var(--font-weight-semibold, 600);
  color: var(--color-primary);
  text-align: center;
  margin: 0 0 1rem;
  line-height: 36px;
}

.photo-gallery__description {
  text-align: center;
  color: var(--color-text);
  max-width: none;
  margin: 0 0 2rem;
  line-height: 1.2;
}

.photo-gallery__viewer {
  position: relative;
  margin-bottom: 8px;
}

.photo-gallery__main-image {
  width: 100%;
  aspect-ratio: 16 / 10;
  border-radius: var(--border-radius);
  overflow: hidden;
  background: var(--color-secondary);
}

.photo-gallery__main-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: opacity 0.3s ease;
}

.photo-gallery__nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 36px;
  height: 36px;
  border-radius: 4px;
  background: var(--color-accent);
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 4px 3px 10px 0px rgba(87, 48, 0, 0.7);
  transition: opacity 0.2s ease;
  z-index: 2;
  color: var(--color-white);
  padding: 6px;
}

.photo-gallery__nav:hover {
  opacity: 0.8;
}

.photo-gallery__nav--prev { left: 0.75rem; }
.photo-gallery__nav--next { right: 0.75rem; }

.photo-gallery__thumbnails {
  display: flex;
  gap: 10px;
  overflow-x: auto;
  flex-wrap: nowrap;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}

.photo-gallery__thumbnails::-webkit-scrollbar {
  display: none;
}

.photo-gallery__thumb {
  width: 100px;
  min-width: 100px;
  height: 72px;
  border-radius: var(--border-radius);
  overflow: hidden;
  border: 2px solid transparent;
  cursor: pointer;
  padding: 0;
  background: none;
  transition: border-color 0.2s ease, opacity 0.2s ease;
  opacity: 0.6;
}

.photo-gallery__thumb:hover {
  opacity: 0.9;
}

.photo-gallery__thumb.is-active {
  border-color: var(--color-primary);
  opacity: 1;
}

.photo-gallery__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Desktop: 2-column layout — text left, gallery right */
@media (min-width: 768px) {
  .photo-gallery__container {
    padding: 0 var(--container-padding-right) 0 var(--container-padding-left);
    display: flex;
    gap: 40px;
    align-items: center;
  }

  .photo-gallery__text {
    flex: 1 1 35%;
    min-width: 0;
  }

  .photo-gallery__headline {
    text-align: left;
  }

  .photo-gallery__description {
    text-align: left;
  }

  .photo-gallery__gallery {
    flex: 1 1 65%;
    min-width: 0;
    max-width: 65%;
  }
}

/* Mobile */
@media (max-width: 767px) {
  .photo-gallery__container {
    padding: 0;
  }

  .photo-gallery__nav {
    width: 36px;
    height: 36px;
  }

  .photo-gallery__nav--prev { left: 0.5rem; }
  .photo-gallery__nav--next { right: 0.5rem; }

  .photo-gallery__thumb {
    width: 80px;
    min-width: 80px;
    height: 80px;
  }

  .photo-gallery__thumbnails {
    gap: 10px;
  }
}

/* ==========================================================================
   CARDS - CAROUSEL MODE
   ========================================================================== */

/* Section backgrounds */
.cards--bg-primary { background: var(--color-primary); padding: 48px 16px; }
.cards--bg-primary-dark,
.cards--bg-dark { background: var(--color-primary-dark); padding: 48px 16px; }
.cards--bg-secondary,
.cards--bg-light { background: var(--color-secondary); padding: 48px 16px; }

/* Text color overrides */
.cards--text-light { --cards-section-text-color: var(--color-white); }
.cards--text-dark { --cards-section-text-color: var(--color-text); }

.cards__header {
  text-align: center;
  margin-bottom: 2rem;
}

.cards__section-headline {
  color: var(--cards-section-text-color, inherit);
  font-size: 1.5625rem;
  font-weight: var(--font-weight-semibold);
  line-height: 36px;
  margin: 0 0 1rem;
}

.cards__section-description {
  color: var(--cards-section-text-color, inherit);
  font-size: var(--font-size-base);
  max-width: 700px;
  margin: 0 auto;
  line-height: 1.2;
}

/* Carousel Track */
.cards__carousel {
  position: relative;
}

.cards__track {
  display: flex;
  gap: 1.5rem;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  -ms-overflow-style: none;
  padding-bottom: 0.5rem;
}

.cards__track::-webkit-scrollbar { display: none; }

.cards__card {
  flex-shrink: 0;
  scroll-snap-align: start;
}

/* Dot Indicators */
.cards__dots {
  display: flex;
  justify-content: center;
  gap: 0.5rem;
  margin-top: 1.5rem;
}

.cards__dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  border: none;
  background: var(--color-border);
  cursor: pointer;
  padding: 0;
  transition: background 0.2s ease;
}

.cards--text-dark .cards__dot { background: rgba(0, 0, 0, 0.2); }
.cards--text-dark .cards__dot.is-active { background: var(--color-primary); }

.cards__dot.is-active {
  background: var(--color-white);
}

.cards__dot:hover {
  background: rgba(255, 255, 255, 0.7);
}

.cards--text-dark .cards__dot:hover { background: rgba(0, 0, 0, 0.4); }

/* Navigation arrows — visible on mobile, overlaid on card image area */
.cards__nav-arrow {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 112px;
  width: 32px;
  height: 32px;
  border-radius: var(--border-radius-pill);
  background: rgba(0, 0, 0, 0.45);
  border: none;
  cursor: pointer;
  padding: 0;
  color: var(--color-white);
  z-index: 2;
  transition: background 0.2s ease;
}
.cards__nav-arrow svg {
  width: 18px;
  height: 18px;
}
.cards__nav-arrow--prev {
  left: 8px;
}
.cards__nav-arrow--next {
  right: 8px;
}

/* Tablet: cards */
@media (min-width: 768px) {
  .cards { padding: 56px 40px; }
  .cards--bg-primary,
  .cards--bg-dark,
  .cards--bg-light { padding: 56px 40px; }
  .cards__section-headline { font-size: 1.75rem; }

  /* Keep carousel layout — show 3 cards per view */
  .cards__carousel {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: center;
  }
  .cards .cards__track {
    display: flex;
    gap: 2rem;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    -ms-overflow-style: none;
    padding-bottom: 0;
    flex: 1;
    min-width: 0;
  }
  .cards .cards__track::-webkit-scrollbar { display: none; }
  .cards .cards__card {
    flex-shrink: 0;
    scroll-snap-align: start;
    min-width: calc((100% - 4rem) / 3);
    max-width: calc((100% - 4rem) / 3);
  }
  .cards--cols-2 .cards__card {
    min-width: calc((100% - 2rem) / 2);
    max-width: calc((100% - 2rem) / 2);
  }
  .cards--cols-4 .cards__card {
    min-width: calc((100% - 4rem) / 3);
    max-width: calc((100% - 4rem) / 3);
  }

  /* Dots stay visible — full width to center below carousel row */
  .cards .cards__dots {
    display: flex;
    margin-top: 1rem;
    width: 100%;
    justify-content: center;
  }

  /* Card refinements */
  .cards__card-blurb {
    font-size: 1rem;
    line-height: 1.2;
    display: block;
    -webkit-line-clamp: none;
    -webkit-box-orient: initial;
    overflow: visible;
  }

  /* Arrow buttons — static flow on tablet/desktop (flex siblings of track) */
  .cards__nav-arrow {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: var(--border-radius-pill);
    background: rgba(0, 0, 0, 0.25);
    border: none;
    cursor: pointer;
    flex-shrink: 0;
    padding: 0;
    color: var(--color-white);
    transition: background 0.2s ease;
    position: static;
    z-index: auto;
  }
  .cards__nav-arrow:hover {
    background: rgba(0, 0, 0, 0.4);
  }
  .cards__nav-arrow svg {
    width: 24px;
    height: 24px;
  }
}

/* Desktop: cards */
@media (min-width: 1024px) {
  .cards { padding: 64px 80px; }
  .cards--bg-primary,
  .cards--bg-dark,
  .cards--bg-light { padding: 64px 80px; }
  .cards__header { margin-bottom: 3rem; }
  .cards__section-headline { font-size: 1.875rem; line-height: 36px; }
  .cards__section-description { max-width: 800px; }
  .cards__card-headline { font-size: 1.3125rem; line-height: 25.2px; }
  .cards__card-blurb {
    font-size: 1rem;
    line-height: 1.2;
    display: block;
    -webkit-line-clamp: none;
    -webkit-box-orient: initial;
    overflow: visible;
  }
  /* Cards still show 3 per view */
  .cards .cards__card {
    min-width: calc((100% - 4rem) / 3);
    max-width: calc((100% - 4rem) / 3);
  }
  .cards--cols-2 .cards__card {
    min-width: calc((100% - 2rem) / 2);
    max-width: calc((100% - 2rem) / 2);
  }
  .cards--cols-4 .cards__card {
    min-width: calc((100% - 6rem) / 4);
    max-width: calc((100% - 6rem) / 4);
  }
  /* Card border-radius per Figma */
  .cards .cards__card { border-radius: var(--border-radius); }
  .cards__card-image { border-radius: var(--border-radius); }
}

/* Mobile — single full-width carousel */
@media (max-width: 767px) {
  .cards .cards__card {
    flex-shrink: 0;
    scroll-snap-align: start;
    scroll-snap-stop: always;
    min-width: 100%;
    max-width: 100%;
  }
}

/* ==========================================================================
   VIDEO EMBED
   ========================================================================== */

.video-embed {
  width: 100%;
}

.video-embed__container {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 0 16px;
}

.video-embed__header {
  padding: 0 0 1rem;
}

.video-embed__title {
  font-family: var(--font-family-heading);
  font-size: 1.3125rem;
  font-weight: var(--font-weight-semibold);
  color: var(--color-primary);
  margin: 0;
  line-height: 1.43;
}

.video-embed__wrapper {
  position: relative;
  width: 100%;
  padding-bottom: 56.25%; /* 16:9 aspect ratio */
  overflow: hidden;
  cursor: pointer;
  background: var(--color-black);
}

.video-embed__poster {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.video-embed__overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.35);
  transition: background 0.2s ease;
}

.video-embed__wrapper:hover .video-embed__overlay {
  background: rgba(0, 0, 0, 0.45);
}

.video-embed__play {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  border: none;
  background: none;
  padding: 0;
  cursor: pointer;
  z-index: 2;
  transition: transform 0.2s ease;
}

.video-embed__play:hover {
  transform: translate(-50%, -50%) scale(1.1);
}

.video-embed__play-icon {
  width: 96px;
  height: 68px;
  filter: drop-shadow(0 4px 12px rgba(0, 0, 0, 0.3));
}

.video-embed__wrapper--playing .video-embed__poster,
.video-embed__wrapper--playing .video-embed__overlay,
.video-embed__wrapper--playing .video-embed__play {
  display: none;
}

.video-embed__wrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

/* Tablet: video-embed */
@media (min-width: 768px) {
  .video-embed {
    background: var(--color-secondary);
    border-top: 1px solid var(--color-border);
    border-bottom: 1px solid var(--color-border);
    padding: 48px 0;
  }

  .video-embed__container {
    padding: 0 var(--container-padding-right) 0 var(--container-padding-left);
  }

  .video-embed__wrapper {
    border-radius: var(--border-radius-drawer);
  }

  .video-embed__poster {
    border-radius: var(--border-radius-drawer);
  }

  .video-embed__overlay {
    border-radius: var(--border-radius-drawer);
  }

  .video-embed__wrapper iframe {
    border-radius: var(--border-radius-drawer);
  }

  .video-embed__play-icon {
    width: 120px;
    height: 85px;
  }
}

/* Desktop: video-embed */
@media (min-width: 1024px) {
  .video-embed {
    padding: 64px 0;
  }
}

/* ==========================================================================
   RELATED ARTICLES
   ========================================================================== */

.related-articles {
  background: var(--bg-primary, var(--color-gray));
  padding: 3rem 0;
}

.related-articles__container {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 0 1rem;
}

.related-articles__headline {
  font-family: var(--font-family-heading);
  font-size: 1.3125rem;
  font-weight: var(--font-weight-semibold);
  color: var(--color-primary);
  margin: 0 0 1rem;
  line-height: 1.43;
}

.related-articles__list {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.related-articles__card {
  display: flex;
  align-items: center;
  background: var(--color-secondary);
  border-radius: var(--border-radius);
  overflow: hidden;
  text-decoration: none;
  color: var(--color-text);
  transition: opacity 0.2s ease;
}

.related-articles__card:hover {
  opacity: 0.85;
  text-decoration: none;
}

.related-articles__card-image {
  flex-shrink: 0;
  width: 80px;
  min-height: 80px;
  align-self: stretch;
  position: relative;
  overflow: hidden;
}

.related-articles__card-image img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.related-articles__card-image::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.15);
}

.related-articles__card-content {
  flex: 1;
  min-width: 0;
  padding: 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.related-articles__card-title {
  font-family: var(--font-family-secondary);
  font-size: 0.8125rem;
  font-weight: var(--font-weight-regular);
  color: var(--color-primary);
  margin: 0;
  line-height: 1.2;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.related-articles__card-link {
  font-family: var(--font-family-secondary);
  font-size: 0.6875rem;
  font-weight: var(--font-weight-semibold);
  color: var(--color-primary);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.related-articles__card-link svg {
  width: 16px;
  height: 16px;
}

/* Tablet: related-articles */
@media (min-width: 768px) {
  .related-articles {
    padding: 48px 40px;
  }
  .related-articles__container {
    padding: 0 var(--container-padding-right) 0 var(--container-padding-left);
  }
  .related-articles__headline {
    font-size: 1.75rem;
    line-height: 36px;
  }
  .related-articles__list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(3, auto);
    gap: 4px;
  }
  .related-articles__card {
    border-radius: var(--border-radius);
  }
}

/* Desktop: related-articles */
@media (min-width: 1024px) {
  .related-articles {
    padding: 48px 80px;
  }
  .related-articles__headline {
    font-size: 1.875rem;
    line-height: 36px;
  }
}

/* ==========================================================================
   COMPONENTS DEMO PAGE
   ========================================================================== */

.components-demo__section {
  position: relative;
}

.components-demo__label {
  padding: 4px 16px;
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--color-text-muted);
  background: var(--color-neutral);
  border-bottom: 1px solid var(--color-border);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

/* ==========================================================================
   Shortcode Styles
   ========================================================================== */

/* --- Row and Column --- */

.amfm-row {
  --amfm-row-columns: 1;
  --amfm-row-gutter-x: 20px;
  --amfm-row-gutter-y: 20px;
  box-sizing: border-box;
  display: flex;
  flex-wrap: wrap;
  column-gap: var(--amfm-row-gutter-x);
  row-gap: var(--amfm-row-gutter-y);
  width: 100%;
  margin: 20px 0;
  padding: 0;
}

.amfm-row--flex > .amfm-col {
  box-sizing: border-box;
  flex: 1 0 0%;
  min-width: 0;
  max-width: 100%;
}

.amfm-row--flex > .amfm-col--wide {
  flex-grow: 2;
}

.amfm-row--grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
}

.amfm-row--grid > .amfm-col {
  grid-column: span var(--amfm-col-span);
  min-width: 0;
}

.amfm-row--style-primary {
  padding: 20px;
  color: var(--color-white);
  background: var(--color-primary);
}

.amfm-row--style-bordered {
  padding: 20px;
  border: 1px solid var(--color-border);
}

.amfm-row--style-brands {
  align-items: stretch;
}

.amfm-row--style-cards {
  gap: 0;
}

.amfm-col {
  --amfm-col-span: 1;
}

[class*="amfm-col--span-"] > * {
  width: 100%;
}

.amfm-col--style-primary {
  padding: 20px;
  color: var(--color-white);
  background: var(--color-primary);
}

.amfm-col--style-bordered,
.amfm-col--style-brand {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 20px;
  text-align: center;
  background: var(--color-white);
  border: 1px solid var(--color-border);
}

.amfm-col--style-brand img,
.amfm-row--style-brands .amfm-col img {
  width: 100%;
  max-width: 100%;
  height: auto;
  margin: 0 auto 16px;
  object-fit: contain;
}

.amfm-col--style-card {
  padding: 20px;
}

.amfm-col--style-bordered-card {
  padding: 20px;
  background: var(--color-secondary);
  border-top: 5px solid var(--color-primary);
}

.amfm-row--style-cards .amfm-col + .amfm-col {
  border-top: 1px solid color-mix(in srgb, var(--color-white) 50%, transparent);
}

.amfm-col > :first-child {
  margin-top: 0;
}

.amfm-col > :last-child {
  margin-bottom: 0;
}

@media (min-width: 768px) {
  .amfm-row--grid {
    grid-template-columns: repeat(var(--amfm-row-columns), minmax(0, 1fr));
  }

  .amfm-row--style-cards {
    gap: 20px;
  }

  .amfm-row--style-cards .amfm-col + .amfm-col {
    border-top: 0;
  }
}

/* --- Callout --- */

.callout.amfm-callout--bordered {
  padding: 20px 0;
  background: none;
  outline: 0;
  border-top: 2px solid var(--color-primary);
  border-bottom: 2px solid var(--color-primary);
}

/* --- Citations Bibliography --- */

.amfm-citations-shortcode {
  margin: 20px 0;
}

.amfm-citations-shortcode .amfm-citations-title {
  margin-bottom: 15px;
}

.amfm-citations-shortcode .amfm-citations-list {
  list-style-position: inside;
  padding: 0;
  margin: 0;
}

.amfm-citations-shortcode .amfm-citation-item {
  padding-left: 1em;
  text-indent: -1em;
  margin-bottom: 0.5em;
  line-height: 1.6;
}

.amfm-citations-shortcode .amfm-citation-item:last-child {
  margin-bottom: 0;
}

.amfm-citations-shortcode .amfm-citation-url {
  text-decoration: none;
  word-break: break-all;
}

.amfm-citations-shortcode .amfm-citation-url:hover {
  text-decoration: underline;
}

/* --- Related Posts --- */

.amfm-related-posts-shortcode {
  margin: 20px 0;
}

.amfm-related-posts-shortcode .amfm-related-posts-title {
  margin-bottom: 20px;
  font-size: 1.5em;
  font-weight: bold;
}

.amfm-related-posts-shortcode.amfm-layout-grid .amfm-related-posts-grid {
  display: grid;
  gap: 20px;
}

.amfm-related-posts-shortcode.amfm-layout-grid .amfm-related-post-card {
  background: var(--color-white);
  overflow: hidden;
  transition: transform 0.3s ease;
  display: flex;
  flex-direction: column;
  height: 100%;
}

.amfm-related-posts-shortcode.amfm-layout-grid .amfm-related-post-card:hover {
  transform: translateY(-5px);
}

.amfm-related-posts-shortcode.amfm-layout-grid .amfm-post-image img {
  width: 100%;
  height: 150px;
  object-fit: cover;
}

.amfm-related-posts-shortcode.amfm-layout-grid .amfm-post-content {
  padding: 15px;
  flex-grow: 1;
}

.amfm-related-posts-shortcode.amfm-layout-horizontal .amfm-related-posts-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
}

.amfm-related-posts-shortcode.amfm-layout-horizontal .amfm-related-post-card {
  background: var(--color-white);
  overflow: hidden;
  transition: transform 0.3s ease;
  display: flex;
  flex-direction: row;
  align-items: center;
  height: 100%;
}

.amfm-related-posts-shortcode.amfm-layout-horizontal .amfm-related-post-card:hover {
  transform: translateX(5px);
}

.amfm-related-posts-shortcode.amfm-layout-horizontal .amfm-post-image {
  flex-shrink: 0;
  width: 80px;
  height: 80px;
}

.amfm-related-posts-shortcode.amfm-layout-horizontal .amfm-post-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.amfm-related-posts-shortcode.amfm-layout-horizontal .amfm-post-content {
  padding: 15px;
  flex-grow: 1;
}

.amfm-related-posts-shortcode .amfm-post-title {
  margin: 0;
  font-size: 1.1em;
  line-height: 1.4;
}

.amfm-related-posts-shortcode .amfm-post-title a {
  text-decoration: none;
  color: inherit;
}

.amfm-related-posts-shortcode .amfm-post-title a:hover {
  color: var(--color-primary);
}

@media (max-width: 767px) {
  .amfm-related-posts-shortcode .amfm-related-posts-grid {
    grid-template-columns: 1fr !important;
  }

  .amfm-related-posts-shortcode.amfm-layout-horizontal .amfm-related-post-card {
    flex-direction: row;
    align-items: center;
  }

  .amfm-related-posts-shortcode.amfm-layout-horizontal .amfm-post-title {
    font-size: 0.9em;
  }
}

/* --- Staff Grid Shortcode — reuses .staff-archive__* BEM classes --- */

.staff-archive--shortcode {
  padding: 0;
}
.staff-archive--shortcode .staff-archive__card-info p {
  margin: 0;
}

/* --- Featured Images --- */

.amfm-featured-images-shortcode {
  margin: 20px 0;
}

.amfm-featured-images-shortcode .amfm-featured-images-vertical {
  display: flex;
  flex-direction: column;
}

.amfm-featured-images-shortcode .amfm-featured-image-item {
  text-align: center;
  margin-bottom: 20px;
}

.amfm-featured-images-shortcode .amfm-featured-image-item:last-child {
  margin-bottom: 0;
}

.amfm-featured-images-shortcode .amfm-featured-image img {
  width: 100%;
  height: auto;
  display: block;
}

.amfm-featured-images-shortcode .amfm-featured-image-title {
  margin-top: 10px;
  font-size: 1em;
}

.amfm-featured-images-shortcode .amfm-featured-image-title a {
  text-decoration: none;
  color: inherit;
}

.amfm-featured-images-shortcode .amfm-featured-image-title a:hover {
  text-decoration: underline;
}

/* --- Shared Pagination --- */

.amfm-shortcode-pagination {
  margin-top: 15px;
  text-align: center;
}

.amfm-shortcode-pagination .amfm-load-more {
  display: inline-block;
  padding: 10px 24px;
  background: var(--color-primary);
  color: var(--color-white);
  border: none;
  border-radius: var(--border-radius);
  cursor: pointer;
  font-size: 0.875rem;
  transition: background 0.2s ease;
}

.amfm-shortcode-pagination .amfm-load-more:hover {
  background: var(--color-primary-dark);
}

.amfm-shortcode-pagination .amfm-load-more:disabled {
  background: var(--color-border);
  cursor: not-allowed;
}

.amfm-shortcode-pagination .amfm-load-more.amfm-loading {
  opacity: 0.7;
  pointer-events: none;
}

/* ==========================================================================
   Service Area Map
   ========================================================================== */

.service-area-map {
  padding: 24px 0;
}

.service-area-map__container {
  position: relative;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 16px;
}

.service-area-map__header {
  margin-bottom: 16px;
}

.service-area-map__headline {
  font-size: 1.5rem;
  font-weight: 700;
  margin: 0 0 8px;
  color: var(--color-primary);
}

.service-area-map__copy {
  font-size: 0.9375rem;
  color: var(--color-text);
  margin: 0;
  line-height: 1.5;
}

.service-area-map__map-col {
  position: relative;
}

.service-area-map__map {
  width: 100%;
  border-radius: 8px;
  overflow: hidden;
  background: var(--color-secondary);
}

/* Drawer overlay */

.service-area-map__drawer-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.4);
  z-index: 999;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s, visibility 0.3s;
}

.service-area-map__drawer-overlay--visible {
  opacity: 1;
  visibility: visible;
}

/* Drawer */

.service-area-map__drawer {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  max-height: 85vh;
  background: var(--color-white);
  border-radius: 16px 16px 0 0;
  box-shadow: 0 -4px 24px rgba(0, 0, 0, 0.15);
  z-index: 1000;
  overflow-y: auto;
  padding: 20px;
  transform: translateY(100%);
  transition: transform 0.3s ease, visibility 0.3s;
  visibility: hidden;
}

.service-area-map__drawer--open {
  transform: translateY(0);
  visibility: visible;
}

.service-area-map__drawer-close {
  position: absolute;
  top: 12px;
  right: 16px;
  background: none;
  border: none;
  font-size: 1.5rem;
  cursor: pointer;
  color: var(--color-text-light);
  line-height: 1;
  padding: 4px 8px;
}

.service-area-map__drawer-close:hover {
  color: var(--color-text);
}

.service-area-map__drawer-content {
  padding-top: 8px;
}

/* Rep Card */

.service-area-map__card {
  padding: 12px 0;
  border-bottom: 1px solid var(--color-secondary);
  display: grid;
  grid-template-columns: 72px 1fr;
  column-gap: 16px;
}

.service-area-map__card:last-child {
  border-bottom: none;
}

.service-area-map__card-top {
  display: contents;
}

.service-area-map__card-photo {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  object-fit: cover;
  align-self: start;
}

.service-area-map__card-photo--placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--color-primary);
  color: var(--color-white);
  font-size: 1.25rem;
  font-weight: 700;
}

.service-area-map__card-info {
  flex: 1;
  min-width: 0;
}

.service-area-map .service-area-map__card-name {
  font-size: 1.125rem;
  font-weight: 700;
  margin: 0;
  color: var(--color-primary);
}

.service-area-map__card-title {
  font-size: 0.8125rem;
  color: var(--color-text-light);
  margin: 0;
}

.service-area-map__card-credentials {
  font-style: italic;
}

.service-area-map__card-locality {
  font-size: 0.8125rem;
  color: var(--color-text-light);
  margin: 0;
}

.service-area-map__card-email {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 0.8125rem;
  color: var(--color-primary);
  text-decoration: none;
  margin-top: 2px;
}

.service-area-map__card-email:hover {
  text-decoration: underline;
}

.service-area-map__card-email svg {
  flex-shrink: 0;
}

.service-area-map__card-actions {
  display: flex;
  gap: 8px;
  margin-top: 6px;
  grid-column: 2;
}

.service-area-map .service-area-map__card-btn {
  display: inline-block;
  padding: 0.5rem 1rem;
  border-radius: 4px;
  text-align: center;
  text-decoration: none;
  font-size: 0.8125rem;
  font-weight: 600;
  transition: opacity 0.2s;
}

.service-area-map .service-area-map__card-btn:hover {
  opacity: 0.9;
}

.service-area-map .service-area-map__card-btn--phone {
  background: var(--color-primary);
  color: var(--color-white);
}

.service-area-map .service-area-map__card-btn--profile {
  background: var(--color-white);
  color: var(--color-primary);
  border: 1px solid var(--color-primary);
}

/* BD pages — map base overrides */

.single-bd_rep .service-area-map { padding-bottom: 0; }
.single-bd_rep .service-area-map__container { display: block; }
.single-bd_rep .service-area-map__map { height: 450px !important; }

.post-type-archive-bd_rep .service-area-map { padding: 0; }

/* BD Archive — Map + Copy row */

.bd-archive__map-row {
  padding: 24px 0;
}

.bd-archive__map-row-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 16px;
}

.bd-archive__map-copy {
  margin-bottom: 24px;
  font-size: 0.9375rem;
  line-height: 1.6;
  color: var(--color-text);
}

.bd-archive__map-copy-title {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--color-primary);
  margin: 0 0 12px;
}

.bd-archive__map-copy p:last-child {
  margin-bottom: 0;
}

.bd-archive__map-col .service-area-map {
  padding: 0;
}

.bd-archive__map-col .service-area-map__container {
  max-width: none;
  padding: 0;
}

.bd-archive__map-col .service-area-map__map {
  border-radius: 8px;
}

/* Map layout: full width (shared modifier) */
.service-area-map--full_width .service-area-map__container { max-width: none; padding: 0; }
.service-area-map--full_width .service-area-map__map { border-radius: 0; }
.service-area-map--full_width .service-area-map__map-col { position: relative; }

/* Title layout: boxed (content width) */
.service-area-map__header--boxed { max-width: 960px; margin: 0 auto; padding: 0 16px; }

/* Title layout: full width */
.service-area-map__header--full_width { padding: 0; }

/* Title layout: map overlay */
.service-area-map__header--overlay { position: absolute; top: 0; left: 0; right: 0; z-index: 10; padding: 16px; background: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), transparent); }
.service-area-map__header--overlay .service-area-map__headline { color: var(--color-white); }

/* Desktop */

@media (min-width: 768px) {
  .service-area-map__container {
    display: grid;
    grid-template-columns: 1fr 2fr;
    gap: 32px;
    align-items: start;
  }

  /* When header is absent (shortcode mode), map-col is the only child — span full width */
  .service-area-map__map-col:first-child:last-child {
    grid-column: 1 / -1;
  }

  .service-area-map__header {
    margin-bottom: 0;
    padding-top: 24px;
  }

  .service-area-map__headline {
    font-size: 2rem;
  }

  .service-area-map__map-col {
    overflow: hidden;
  }

  .service-area-map__drawer-overlay {
    position: absolute;
    border-radius: 8px;
    z-index: 11;
  }

  .service-area-map__drawer {
    position: absolute;
    top: auto;
    left: 0;
    right: 0;
    bottom: 0;
    width: auto;
    max-height: none;
    border-radius: 8px 8px 0 0;
    box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.15);
    z-index: 12;
    overflow: hidden;
    transform: translateY(100%);
    transition: transform 0.3s ease, visibility 0.3s;
  }

  .service-area-map__drawer--open {
    transform: translateY(0);
  }

  .single-bd_rep .service-area-map__container { display: block; }
  .single-bd_rep .service-area-map__map { height: 500px !important; }

  /* BD Archive — Map + Copy row (desktop: 50/50 grid) */
  .bd-archive__map-row-container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px;
    align-items: start;
    max-width: 1280px;
    padding: 0 40px;
  }

  .bd-archive__map-copy {
    margin-bottom: 0;
    padding-top: 24px;
    font-size: 1rem;
  }

  /* Map layout: full width (desktop) */
  .service-area-map--full_width .service-area-map__container { max-width: none; padding: 0; }
  .service-area-map--full_width .service-area-map__map { border-radius: 0; }

  /* Title layout: boxed (desktop) */
  .service-area-map__header--boxed { max-width: 1280px; padding: 0 80px; }

  /* Title layout: full width (desktop) */
  .service-area-map__header--full_width { padding: 0; }

  /* Title layout: overlay (desktop) */
  .service-area-map__header--overlay { padding: 24px 32px; }
}