/* ==========================================================================
   PhysioFirst theme ("Where It Hurts" direction)

   DESIGN PLAN
   Concept   A well-made health guide. Most patients don't know what their
             condition is called, but they know where it hurts, so the page is
             organised around eight body areas plus pre/post-op rehab. Light,
             clean and practical; the region system is the loud part.

   WordPress The section after the responsive rules maps core block markup
             (buttons, query loop, details, image, video) onto this design.

   Palette roles
     white      #FFFFFF  page ground, form surfaces
     warm grey  #E8E6E1  bands (pricing, booking), hero backdrop, panel footer
     warm light #F4F3F0  quiet surfaces (approach, location, hovers)
     navy       #0F172A  all text, rules, footer ground
     teal       #5FA6AE  fills only: primary buttons, active index row, body-map dots
     dark teal  #3E7E86  the rare small teal detail on white
     slate      #4A5361  secondary text (AA on white and both warm greys)
     grey       #8C96A0  hairlines and decorative strokes only

   Type      Brand fonts from the logo pack: Poppins (the wordmark face) for
             headings, numbers, buttons and navigation; Montserrat for body
             text. Scale: display 72/1.02 700 · answer 28/1.3 500 ·
             h2 44/1.12 600 · panel h3 28/1.2 600 · h3 20/1.25 600 ·
             lead 18/1.6 · body 16/1.65 · small 15 · label 13 600.

   Logo      ../assets/brand/*.svg, cleaned from the client's .ai files.
             Header uses the horizontal lockup without the tagline (too small
             to read at header size); the tagline is set as text in the footer.

   Layout    1280 container, two-column splits, hairline rules instead of cards.
             Square corners everywhere. The hero video frame is the ONLY rounded
             object (24px), deliberately, so it reads as a window into the clinic.

   Memorable The region system. Six body-map buttons in the hero (a small
             pictogram with a teal dot on the area) jump to and open the matching
             row of a numbered index (01 Neck ... 06 Ankle & foot) that reads
             like the contents page of a health guide, typical session counts
             set in the margin. Each panel: conditions, treatment, sessions,
             photo, "Book a [region] assessment".
   ========================================================================== */

:root {
  --color-navy: #0F172A;
  --color-teal: #5FA6AE;
  --color-teal-hover: #4E959D;
  --color-teal-dark: #3E7E86;
  --color-teal-tint: #E1EEEF;
  --color-grey: #8C96A0;
  --color-warm: #E8E6E1;
  --color-warm-light: #F4F3F0;
  --color-line: #DCD9D2;
  --color-line-strong: #B9B4AA;
  --color-field: #6B7480;
  --color-slate: #4A5361;
  --color-white: #FFFFFF;
  --color-footer-text: #D3D8DF;
  --color-footer-muted: #A9B2BD;

  --font-main: "Montserrat", "Helvetica Neue", Arial, sans-serif;
  --font-head: "Poppins", "Helvetica Neue", Arial, sans-serif;

  --text-display: clamp(2.5rem, 1.8rem + 3vw, 4.5rem);
  --text-answer: clamp(1.25rem, 1.05rem + 0.8vw, 1.75rem);
  --text-h2: clamp(1.875rem, 1.4rem + 1.7vw, 2.75rem);
  --text-panel: clamp(1.5rem, 1.25rem + 0.8vw, 1.75rem);
  --text-h3: 1.25rem;
  --text-lead: 1.125rem;
  --text-body: 1rem;
  --text-small: 0.9375rem;
  --text-label: 0.8125rem;

  --container: 1280px;
  --gutter: clamp(1.25rem, 4vw, 3rem);
  --section-space: clamp(4.5rem, 2.8rem + 5vw, 7.5rem);
  --header-height: 76px;
  --bar-height: 66px;
  --radius-frame: 24px;
  --shadow-panel: 0 24px 48px -28px rgba(15, 23, 42, 0.28);
}

/* ---------- Global base (tags only here) ---------- */
* { box-sizing: border-box; }
[hidden] { display: none !important; }

html {
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
}

body {
  margin: 0;
  font-family: var(--font-main);
  font-size: var(--text-body);
  line-height: 1.65;
  color: var(--color-navy);
  background: var(--color-white);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

body.is-locked { overflow: hidden; }

h1, h2, h3, h4, h5, h6 {
  margin: 0;
  font-family: var(--font-head);
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -0.01em;
  text-wrap: balance;
}

/* Poppins for UI text, names and numbers, so they match the wordmark */
.button,
.nav-toggle,
.nav-link,
.header-whatsapp,
.mobile-group-toggle,
.mobile-link,
.mega-heading,
.mega-link-name,
.hero-question,
.hero-answer,
.hero-regions-label,
.region-button-name,
.region-tab-num,
.region-tab-name,
.region-tab-sessions,
.region-plan-number,
.region-elsewhere-title,
.mega-foot-text strong,
.step-num,
.rating-score,
.filter-button,
.action-bar-link,
.text-link,
.footer-tagline {
  font-family: var(--font-head);
}

[id] { scroll-margin-top: calc(var(--header-height) + 1.25rem); }

p { margin: 0; }

a {
  color: inherit;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.2em;
}

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

button,
input {
  font: inherit;
  color: inherit;
}

button { cursor: pointer; }

:focus-visible {
  outline: 3px solid var(--color-navy);
  outline-offset: 3px;
}

/* ---------- Layout helpers ---------- */
.container {
  width: 100%;
  max-width: calc(var(--container) + (var(--gutter) * 2));
  margin-inline: auto;
  padding-inline: var(--gutter);
}

.skip-link {
  position: absolute;
  left: 1rem;
  top: -120px;
  z-index: 1000;
  padding: 0.75rem 1.125rem;
  background: var(--color-navy);
  color: var(--color-white);
  font-weight: 600;
  text-decoration: none;
}

.skip-link:focus { top: 1rem; }

.section-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 1.25rem 4rem;
  align-items: end;
  margin-bottom: clamp(2.5rem, 4vw, 3.75rem);
}

.section-title {
  font-size: var(--text-h2);
  line-height: 1.12;
  letter-spacing: -0.02em;
  max-width: 18ch;
}

.section-lead {
  font-size: var(--text-lead);
  line-height: 1.55;
  color: var(--color-slate);
  max-width: 50ch;
}

/* ---------- Buttons & links ---------- */
.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.625rem;
  min-height: 52px;
  padding: 0.875rem 1.5rem;
  background: var(--color-teal);
  border: 1px solid var(--color-teal);
  color: var(--color-navy);
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
  transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.button:hover {
  background: var(--color-teal-hover);
  border-color: var(--color-teal-hover);
}

.button.is-secondary {
  background: var(--color-white);
  border-color: var(--color-navy);
}

.button.is-secondary:hover {
  background: var(--color-navy);
  color: var(--color-white);
}

.button.is-header {
  min-height: 44px;
  padding: 0.625rem 1.125rem;
  font-size: var(--text-small);
}

.button.is-light {
  background: var(--color-white);
  border-color: var(--color-white);
  box-shadow: var(--shadow-panel);
}

.button.is-light:hover {
  background: var(--color-navy);
  border-color: var(--color-navy);
  color: var(--color-white);
}

.button.is-submit { width: 100%; }

.button-icon {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
}

.text-link {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  font-weight: 600;
  color: var(--color-navy);
  text-decoration: underline;
  text-decoration-color: var(--color-teal);
  text-decoration-thickness: 2px;
  text-underline-offset: 0.3em;
}

.text-link:hover { text-decoration-color: var(--color-navy); }

/* ---------- Header ---------- */
.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: var(--color-white);
  border-bottom: 1px solid transparent;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.site-header.is-scrolled,
.site-header.is-menu-open {
  border-bottom-color: var(--color-line);
  box-shadow: 0 10px 30px -24px rgba(15, 23, 42, 0.45);
}

.header-inner {
  position: relative;
  display: flex;
  align-items: center;
  gap: 1.5rem;
  max-width: calc(var(--container) + (var(--gutter) * 2));
  height: var(--header-height);
  margin-inline: auto;
  padding-inline: var(--gutter);
}

.brand {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-shrink: 0;
  min-height: 44px;
  color: var(--color-navy);
  text-decoration: none;
}

.brand-logo {
  width: auto;
  height: 50px;
}

.main-nav { margin-left: 1rem; }

.nav-list {
  display: flex;
  align-items: center;
  margin: 0;
  padding: 0;
  list-style: none;
}

.nav-dropdown {
  position: relative;
  display: flex;
  align-items: center;
  height: var(--header-height);
}

.nav-dropdown.is-mega { position: static; }

.nav-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  min-height: 44px;
  padding: 0 clamp(0.5rem, 0.9vw, 0.875rem);
  background: none;
  border: 0;
  font-size: var(--text-small);
  font-weight: 500;
  color: var(--color-navy);
}

.nav-toggle:hover { color: var(--color-teal-dark); }

.nav-link {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0 clamp(0.5rem, 0.9vw, 0.875rem);
  font-size: var(--text-small);
  font-weight: 500;
  color: var(--color-navy);
  text-decoration: none;
}

.nav-link:hover { color: var(--color-teal-dark); }

.nav-link[aria-current="page"],
.dropdown-link[aria-current="page"],
.mobile-link[aria-current="page"],
.mobile-sublink[aria-current="page"] {
  color: var(--color-teal-dark);
  text-decoration: underline;
  text-decoration-color: var(--color-teal);
  text-decoration-thickness: 2px;
  text-underline-offset: 0.4em;
}

.nav-chevron {
  width: 10px;
  height: 10px;
  transition: transform 0.2s ease;
}

.nav-dropdown.is-open .nav-chevron { transform: rotate(180deg); }

.nav-dropdown-panel {
  position: absolute;
  top: 100%;
  left: -0.5rem;
  z-index: 10;
  min-width: 290px;
  padding: 0.75rem;
  background: var(--color-white);
  border: 1px solid var(--color-line);
  border-top: 2px solid var(--color-navy);
  box-shadow: var(--shadow-panel);
  opacity: 0;
  visibility: hidden;
  transform: translateY(6px);
  transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s ease;
}

.nav-dropdown-panel.is-mega {
  left: var(--gutter);
  right: var(--gutter);
  padding: 2rem;
}

.nav-dropdown.is-open .nav-dropdown-panel {
  opacity: 1;
  visibility: visible;
  transform: none;
}

.dropdown-list {
  display: grid;
  gap: 2px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.dropdown-link {
  display: flex;
  align-items: center;
  min-height: 44px;
  padding: 0.5rem 0.75rem;
  font-size: var(--text-small);
  color: var(--color-navy);
  text-decoration: none;
}

.dropdown-link:hover { background: var(--color-warm-light); }

.mega-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(0, 1.55fr);
  gap: 1.5rem;
}

.mega-group {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.mega-heading {
  padding: 0 0.75rem 0.625rem;
  border-bottom: 1px solid var(--color-line);
  font-size: var(--text-label);
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--color-slate);
}

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

.mega-list {
  display: grid;
  gap: 2px;
}

.mega-link {
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
  padding: 0.625rem 0.75rem;
  color: var(--color-navy);
  text-decoration: none;
}

.mega-link:hover { background: var(--color-warm-light); }

.mega-link-name {
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.3;
}

.mega-link:hover .mega-link-name { color: var(--color-teal-dark); }

.mega-link-text {
  font-size: var(--text-label);
  line-height: 1.45;
  color: var(--color-slate);
}

.mega-surgery-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 0.5rem;
}

.mega-surgery-link {
  display: flex;
  align-items: center;
  min-height: 36px;
  padding: 0.25rem 0.75rem;
  font-size: var(--text-small);
  line-height: 1.3;
  color: var(--color-navy);
  text-decoration: none;
}

.mega-surgery-link:hover {
  background: var(--color-warm-light);
  color: var(--color-teal-dark);
}

.mega-foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.25rem 1.5rem;
  margin-top: 1.5rem;
  padding: 0.5rem 1.25rem;
  background: var(--color-warm);
}

.mega-foot-text {
  font-size: var(--text-small);
  color: var(--color-slate);
}

.mega-foot-text strong {
  font-weight: 600;
  color: var(--color-navy);
}

.header-actions {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  margin-left: auto;
}

.header-whatsapp {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  min-height: 44px;
  padding: 0 0.875rem;
  border: 1px solid var(--color-line-strong);
  font-size: var(--text-small);
  font-weight: 600;
  color: var(--color-navy);
  text-decoration: none;
  transition: border-color 0.15s ease;
}

.header-whatsapp:hover { border-color: var(--color-navy); }

.header-whatsapp-icon {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
}

.menu-burger {
  display: none;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  width: 44px;
  height: 44px;
  padding: 0;
  background: var(--color-white);
  border: 1px solid var(--color-line-strong);
}

.burger-line {
  display: block;
  width: 20px;
  height: 2px;
  background: var(--color-navy);
  transition: transform 0.2s ease, opacity 0.2s ease;
}

.menu-burger.is-open .burger-line.is-top { transform: translateY(7px) rotate(45deg); }
.menu-burger.is-open .burger-line.is-middle { opacity: 0; }
.menu-burger.is-open .burger-line.is-bottom { transform: translateY(-7px) rotate(-45deg); }

/* Mobile menu (shown only at <=991px when open) */
.mobile-menu {
  display: none;
  position: fixed;
  top: var(--header-height);
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 90;
  flex-direction: column;
  gap: 1.75rem;
  padding: 0.5rem var(--gutter) calc(2rem + var(--bar-height) + env(safe-area-inset-bottom, 0px));
  background: var(--color-white);
  overflow-y: auto;
}

.mobile-nav {
  display: flex;
  flex-direction: column;
}

.mobile-group { border-bottom: 1px solid var(--color-line); }

.mobile-group-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  min-height: 60px;
  padding: 0;
  background: none;
  border: 0;
  font-size: 1.25rem;
  font-weight: 600;
  text-align: left;
  color: var(--color-navy);
}

.mobile-chevron {
  width: 14px;
  height: 14px;
  transition: transform 0.2s ease;
}

.mobile-group.is-open .mobile-chevron { transform: rotate(180deg); }

.mobile-group-panel {
  display: none;
  padding-bottom: 1rem;
}

.mobile-group.is-open .mobile-group-panel { display: block; }

.mobile-sublist {
  margin: 0;
  padding: 0;
  list-style: none;
}

.mobile-subheading {
  margin-top: 0.75rem;
  font-size: var(--text-label);
  font-weight: 600;
  color: var(--color-slate);
}

.mobile-sublink {
  display: flex;
  align-items: center;
  min-height: 44px;
  font-size: 1rem;
  color: var(--color-navy);
  text-decoration: none;
}

.mobile-sublink.has-text {
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  padding-block: 0.5rem;
  font-weight: 600;
  line-height: 1.3;
}

.mobile-sublink-text {
  font-size: var(--text-label);
  font-weight: 400;
  color: var(--color-slate);
}

.mobile-sublist.is-compact .mobile-sublink {
  min-height: 40px;
  font-size: var(--text-small);
}

.mobile-link {
  display: flex;
  align-items: center;
  min-height: 60px;
  border-bottom: 1px solid var(--color-line);
  font-size: 1.25rem;
  font-weight: 600;
  color: var(--color-navy);
  text-decoration: none;
}

.mobile-menu-actions {
  display: grid;
  gap: 0.75rem;
}

/* ---------- Hero ---------- */
.hero {
  position: relative;
  overflow: hidden;
  background: var(--color-white);
}

.hero-backdrop {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 33%;
  background: var(--color-warm);
}

.hero-inner {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.18fr) minmax(0, 0.82fr);
  gap: clamp(2rem, 5vw, 5rem);
  align-items: center;
  max-width: calc(var(--container) + (var(--gutter) * 2));
  margin-inline: auto;
  padding: clamp(1.75rem, 3.5vw, 3rem) var(--gutter) clamp(2.5rem, 4.5vw, 4rem);
}

.hero-content {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.hero-title {
  display: flex;
  flex-direction: column;
  gap: 0.875rem;
}

.hero-question {
  font-size: var(--text-display);
  font-weight: 700;
  line-height: 1.02;
  letter-spacing: -0.022em;
}

.hero-answer {
  max-width: 30ch;
  font-size: var(--text-answer);
  font-weight: 500;
  line-height: 1.3;
  letter-spacing: -0.01em;
}

.hero-answer-keep { white-space: nowrap; }

.hero-lead {
  max-width: 48ch;
  font-size: var(--text-lead);
  line-height: 1.55;
  color: var(--color-slate);
}

.hero-regions {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.hero-regions-label {
  font-size: var(--text-small);
  font-weight: 600;
}

.region-buttons {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.5rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.region-buttons-item { display: flex; }

.region-button {
  display: flex;
  flex: 1;
  align-items: center;
  gap: 0.625rem;
  min-height: 74px;
  padding: 0.625rem 0.75rem 0.625rem 0.625rem;
  background: var(--color-white);
  border: 1px solid var(--color-line-strong);
  color: var(--color-navy);
  text-decoration: none;
  transition: border-color 0.15s ease, background-color 0.15s ease, box-shadow 0.15s ease;
}

.region-button:hover {
  background: var(--color-warm-light);
  border-color: var(--color-navy);
  box-shadow: inset 0 -3px 0 var(--color-teal);
}

.region-figure {
  width: 28px;
  height: 45px;
  flex-shrink: 0;
}

.region-button-text {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.region-button-name {
  font-size: 1.0625rem;
  font-weight: 600;
  line-height: 1.2;
}

.hero-surgery-link {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0 0.5rem;
  align-self: flex-start;
  min-height: 44px;
  font-size: var(--text-small);
  color: var(--color-slate);
  text-decoration: none;
}

.hero-surgery-cta {
  font-family: var(--font-head);
  font-weight: 600;
  color: var(--color-navy);
  text-decoration: underline;
  text-decoration-color: var(--color-teal);
  text-decoration-thickness: 2px;
  text-underline-offset: 0.3em;
}

.hero-surgery-link:hover .hero-surgery-cta { text-decoration-color: var(--color-navy); }

.region-button-meta {
  font-size: var(--text-label);
  line-height: 1.3;
  color: var(--color-slate);
}

.hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  padding-top: 0.25rem;
}

.hero-proof {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 1rem;
}

.stars {
  width: 92px;
  height: 16px;
  flex-shrink: 0;
  color: var(--color-navy);
}

.hero-proof-text {
  font-size: var(--text-small);
  color: var(--color-slate);
}

.hero-proof-score {
  font-weight: 700;
  color: var(--color-navy);
}

.hero-proof-link {
  color: inherit;
  text-decoration: underline;
  text-decoration-color: var(--color-line-strong);
}

.hero-proof-link:hover { text-decoration-color: var(--color-navy); }

.hero-proof-divider {
  width: 1px;
  height: 18px;
  background: var(--color-line-strong);
}

.hero-media {
  position: relative;
  isolation: isolate;
  height: min(calc(88vh - var(--header-height) - 4rem), 760px);
  min-height: 500px;
  overflow: hidden;
  border-radius: var(--radius-frame);
  background: var(--color-warm);
}

.hero-video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 36% 50%;
}

.hero-media-caption {
  position: absolute;
  left: 1.25rem;
  top: 1.25rem;
  max-width: calc(100% - 2.5rem);
  padding: 0.5rem 0.75rem;
  background: rgba(255, 255, 255, 0.95);
  font-size: var(--text-label);
  font-weight: 600;
  line-height: 1.35;
  color: var(--color-navy);
}

.video-toggle {
  position: absolute;
  right: 1.25rem;
  bottom: 1.25rem;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  min-height: 44px;
  padding: 0 1rem 0 0.875rem;
  background: rgba(15, 23, 42, 0.86);
  border: 0;
  font-size: var(--text-small);
  font-weight: 600;
  color: var(--color-white);
}

.video-toggle:hover { background: var(--color-navy); }

.video-toggle:focus-visible {
  outline: 3px solid var(--color-white);
  outline-offset: 2px;
}

.video-icon {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
}

.video-icon.is-play { display: none; }
.video-toggle.is-paused .video-icon.is-play { display: block; }
.video-toggle.is-paused .video-icon.is-pause { display: none; }

/* ---------- Region finder (the memorable element) ---------- */
.regions {
  padding-block: var(--section-space);
  border-top: 1px solid var(--color-line);
}

.regions-layout {
  display: grid;
  grid-template-columns: minmax(0, 400px) minmax(0, 1fr);
  gap: 1.5rem clamp(1.5rem, 3vw, 3rem);
  align-items: start;
  scroll-margin-top: calc(var(--header-height) + 1.5rem);
}

.region-index {
  grid-row: span 2;
  display: flex;
  flex-direction: column;
}

.region-index-head {
  display: flex;
  justify-content: space-between;
  padding: 0 1rem 0.75rem 0.75rem;
  border-bottom: 2px solid var(--color-navy);
  font-size: var(--text-label);
  font-weight: 600;
  color: var(--color-slate);
}

.region-tablist {
  display: flex;
  flex-direction: column;
}

.region-tab {
  position: relative;
  display: grid;
  grid-template-columns: 2rem minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.25rem 0.875rem;
  width: 100%;
  min-height: 72px;
  padding: 0.75rem 1rem 0.75rem 0.875rem;
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--color-line);
  text-align: left;
  color: var(--color-navy);
  transition: background-color 0.15s ease;
}

.region-tab:hover { background: var(--color-warm-light); }

.region-tab.is-active,
.region-tab.is-active:hover { background: var(--color-teal); }

.region-tab:focus-visible {
  outline: 3px solid var(--color-navy);
  outline-offset: -3px;
}

.region-tab-marker {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 4px;
  background: transparent;
}

.region-tab.is-active .region-tab-marker { background: var(--color-navy); }

.region-tab-num {
  align-self: start;
  padding-top: 0.45rem;
  font-size: var(--text-label);
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.02em;
  color: var(--color-slate);
}

.region-tab-main {
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
  min-width: 0;
}

.region-tab-name {
  font-size: 1.3125rem;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -0.01em;
}

.region-tab-hint {
  font-size: var(--text-small);
  line-height: 1.35;
  color: var(--color-slate);
}

.region-tab-plan {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  text-align: right;
}

.region-tab-sessions {
  font-size: 1.125rem;
  font-weight: 700;
  line-height: 1.2;
  font-variant-numeric: tabular-nums;
}

.region-tab-unit {
  font-size: var(--text-label);
  color: var(--color-slate);
}

.region-tab.is-active .region-tab-num,
.region-tab.is-active .region-tab-hint,
.region-tab.is-active .region-tab-unit { color: var(--color-navy); }

.region-elsewhere {
  grid-column: 2;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem 2rem;
  padding: 1.125rem 1.5rem;
  background: var(--color-warm-light);
}

.region-elsewhere-copy {
  max-width: 52ch;
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
}

.region-elsewhere-title { font-weight: 600; }

.region-elsewhere-text {
  font-size: var(--text-small);
  color: var(--color-slate);
}

.region-panel {
  border: 1px solid var(--color-line);
  background: var(--color-white);
}

.region-panel-inner {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr);
  grid-template-areas:
    "body media"
    "footer footer";
}

.region-panel-body {
  grid-area: body;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  padding: clamp(1.5rem, 2.8vw, 2.5rem);
}

.region-panel-heading {
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
}

.region-panel-title {
  font-size: var(--text-panel);
  line-height: 1.15;
  letter-spacing: -0.022em;
}

.region-panel-intro { color: var(--color-slate); }

.region-panel-media {
  grid-area: media;
  position: relative;
  min-height: 320px;
  background: var(--color-warm);
}

.region-panel-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.region-panel-img.is-neck { object-position: 58% 50%; }
.region-panel-img.is-shoulder { object-position: 52% 50%; }
.region-panel-img.is-back { object-position: 22% 50%; }
.region-panel-img.is-hip { object-position: 30% 50%; }
.region-panel-img.is-knee { object-position: 66% 50%; }
.region-panel-img.is-ankle { object-position: 55% 50%; }
.region-panel-img.is-elbow { object-position: 45% 50%; }
.region-panel-img.is-wrist { object-position: 50% 50%; }
.region-panel-img.is-surgery { object-position: 40% 50%; }

.region-block {
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
}

.region-block-title {
  font-size: var(--text-label);
  font-weight: 600;
  letter-spacing: 0;
  color: var(--color-slate);
}

.condition-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1.5rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.condition-list.is-columns {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.5rem 1.25rem;
}

.condition-item {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  font-weight: 600;
  line-height: 1.3;
}

.condition-list.is-columns .condition-item { font-size: var(--text-small); }

.condition-marker {
  width: 8px;
  height: 8px;
  flex-shrink: 0;
  background: var(--color-teal);
}

.region-block-text { line-height: 1.6; }

.region-panel-footer {
  grid-area: footer;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1rem 1.5rem;
  padding: 1.25rem clamp(1.5rem, 2.8vw, 2.5rem);
  background: var(--color-warm);
}

.region-plan {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.region-plan-number {
  white-space: nowrap;
  font-size: 2.5rem;
  font-weight: 600;
  line-height: 1;
  letter-spacing: -0.03em;
  font-variant-numeric: tabular-nums;
}

.region-plan-text {
  display: flex;
  flex-direction: column;
  line-height: 1.35;
}

.region-plan-label { font-weight: 600; }

.region-plan-note {
  font-size: var(--text-small);
  color: var(--color-slate);
}

/* ---------- Values & promise ---------- */
.values {
  padding-block: var(--section-space);
  background: var(--color-white);
  border-top: 1px solid var(--color-line);
}

.values-grid {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  gap: 2rem clamp(2rem, 6vw, 6rem);
  align-items: start;
}

.values-intro {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.values-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 2.5rem 2rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.value-item {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  padding-top: 1.25rem;
  border-top: 2px solid var(--color-navy);
}

.value-title {
  font-size: var(--text-h3);
  font-weight: 600;
}

.value-text { color: var(--color-slate); }

.promise-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: clamp(3rem, 6vw, 5rem) 0 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid var(--color-line);
  border-bottom: 1px solid var(--color-line);
}

.promise-item {
  display: flex;
  align-items: center;
  gap: 0.875rem;
  padding: 1.375rem 1.5rem;
  border-left: 1px solid var(--color-line);
  font-weight: 600;
  line-height: 1.3;
}

.promise-item:first-child {
  padding-left: 0;
  border-left: 0;
}

.promise-icon {
  width: 28px;
  height: 28px;
  flex-shrink: 0;
  color: var(--color-teal-dark);
}

/* ---------- Approach ---------- */
.approach {
  padding-block: var(--section-space);
  background: var(--color-warm-light);
}

.steps {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 2.5rem 0;
  margin: 0;
  padding: 0;
  list-style: none;
}

.step {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  padding-right: 2rem;
  border-top: 2px solid var(--color-navy);
}

.step-num {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  margin-top: -23px;
  margin-bottom: 0.5rem;
  background: var(--color-teal);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

.step-title {
  font-size: 1.5rem;
  font-weight: 700;
}

.step-text { color: var(--color-slate); }

.step-meta {
  font-size: var(--text-small);
  font-weight: 600;
}

/* ---------- Services ---------- */
.services {
  padding-block: var(--section-space);
  background: var(--color-white);
}

.services-grid {
  display: grid;
  grid-template-columns: minmax(0, 4fr) minmax(0, 8fr);
  gap: 2.5rem clamp(2rem, 5vw, 5rem);
  align-items: start;
}

.services-intro {
  position: sticky;
  top: calc(var(--header-height) + 2rem);
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.services-img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  object-position: 45% 50%;
  margin-top: 0.75rem;
}

.services-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 2.5rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.service-item {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  padding: 1.5rem 0 2.25rem;
  border-top: 1px solid var(--color-line-strong);
}

.service-title {
  font-size: var(--text-h3);
  font-weight: 600;
}

.service-text { color: var(--color-slate); }

.service-areas {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-top: 0.25rem;
  font-size: var(--text-small);
  font-weight: 600;
}

.service-areas-marker {
  width: 8px;
  height: 8px;
  flex-shrink: 0;
  background: var(--color-teal);
}

/* ---------- Inner page head (team, FAQ, blog) ---------- */
.page-head {
  padding-block: clamp(3rem, 2rem + 4vw, 5.5rem) clamp(2.5rem, 1.75rem + 3vw, 4rem);
  background: var(--color-warm-light);
  border-bottom: 1px solid var(--color-line);
}

.page-head-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 1.25rem 4rem;
  align-items: end;
}

.page-title {
  max-width: 20ch;
  font-size: clamp(2.25rem, 1.6rem + 2.6vw, 3.75rem);
  font-weight: 700;
  line-height: 1.05;
  letter-spacing: -0.03em;
}

/* ---------- Team profiles (team page) ---------- */
.profiles { padding-block: var(--section-space); }

.profile-list {
  display: grid;
  gap: clamp(3rem, 6vw, 5rem);
  margin: 0;
  padding: 0;
  list-style: none;
}

.profile {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  gap: 2rem clamp(2rem, 5vw, 5rem);
  align-items: start;
}

.profile + .profile {
  padding-top: clamp(3rem, 6vw, 5rem);
  border-top: 1px solid var(--color-line);
}

.profile-photo {
  width: 100%;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  object-position: 50% 18%;
  background: var(--color-warm);
}

.profile-body {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.75rem;
  padding-top: 0.5rem;
}

.profile-role {
  font-size: var(--text-label);
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--color-teal-dark);
}

.profile-name {
  font-size: clamp(2.25rem, 1.8rem + 1.6vw, 3.25rem);
  font-weight: 700;
  line-height: 1.05;
  letter-spacing: -0.03em;
}

.profile-reg {
  font-size: var(--text-small);
  color: var(--color-slate);
}

.profile-bio {
  max-width: 56ch;
  margin-top: 0.5rem;
  font-size: var(--text-lead);
  line-height: 1.6;
}

.profile-block {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  width: 100%;
  max-width: 56ch;
  margin-top: 0.5rem;
  padding-top: 1rem;
  border-top: 2px solid var(--color-navy);
}

.profile-block-title {
  font-size: var(--text-label);
  font-weight: 600;
  color: var(--color-slate);
}

.profile-block-text { font-weight: 500; }

.profile-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 1.25rem;
}

.profile-note {
  font-size: var(--text-label);
  color: var(--color-slate);
}

/* ---------- CTA band (inner pages) ---------- */
.cta-band {
  padding-block: clamp(3rem, 2rem + 4vw, 5rem);
  background: var(--color-warm);
}

.cta-band-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem 3rem;
}

.cta-band-copy {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  max-width: 52ch;
}

.cta-band-title {
  font-size: clamp(1.625rem, 1.3rem + 1.2vw, 2.25rem);
  letter-spacing: -0.02em;
}

.cta-band-text { color: var(--color-slate); }

.cta-band-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}

/* ---------- Blog (blog page) ---------- */
.blog-section { padding-block: clamp(2.5rem, 2rem + 3vw, 4rem) var(--section-space); }

.blog-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.filter-button {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0 1.125rem;
  background: var(--color-white);
  border: 1px solid var(--color-line-strong);
  font-size: var(--text-small);
  font-weight: 500;
  color: var(--color-navy);
  transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.filter-button:hover { border-color: var(--color-navy); }

.filter-button[aria-pressed="true"] {
  background: var(--color-navy);
  border-color: var(--color-navy);
  color: var(--color-white);
}

.blog-count {
  margin-top: 1.25rem;
  font-size: var(--text-small);
  color: var(--color-slate);
}

.post-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 3rem 2rem;
  margin: 2rem 0 0;
  padding: 0;
  list-style: none;
}

.post-card {
  display: flex;
  flex-direction: column;
  gap: 1.125rem;
}

.post-img {
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  background: var(--color-warm);
}

.post-body {
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
}

.post-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.375rem;
}

.post-tag {
  padding: 0.125rem 0.5rem;
  background: var(--color-teal-tint);
  font-size: var(--text-label);
  font-weight: 600;
  color: var(--color-navy);
}

.post-title {
  font-size: 1.25rem;
  line-height: 1.3;
}

.post-excerpt { color: var(--color-slate); }

.post-meta {
  font-size: var(--text-label);
  font-weight: 600;
  color: var(--color-slate);
}

.blog-empty {
  margin-top: 2rem;
  color: var(--color-slate);
}

.blog-reset {
  padding: 0;
  background: none;
  border: 0;
  font-weight: 600;
  color: var(--color-navy);
  text-decoration: underline;
  text-decoration-color: var(--color-teal);
  text-decoration-thickness: 2px;
  text-underline-offset: 0.3em;
}

/* ---------- Pricing (hidden at client request: section removed from the page, styles kept) ---------- */
.pricing {
  padding-block: var(--section-space);
  background: var(--color-warm);
}

.pricing-grid {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  gap: 2.5rem clamp(2rem, 6vw, 6rem);
  align-items: start;
}

.pricing-intro {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.pricing-notes {
  display: grid;
  gap: 0.75rem;
  margin: 0.75rem 0 0;
  padding: 0;
  list-style: none;
}

.pricing-note {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  font-weight: 600;
}

.check-icon {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  color: var(--color-navy);
}

.price-list {
  margin: 0;
  padding: 0.5rem clamp(1.25rem, 3vw, 2.25rem);
  list-style: none;
  background: var(--color-white);
}

.price-row {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1.25rem 0;
  border-bottom: 1px solid var(--color-line);
}

.price-row:last-child { border-bottom: 0; }

.price-name {
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-size: 1.125rem;
  font-weight: 600;
  line-height: 1.3;
}

.price-detail {
  font-size: var(--text-small);
  font-weight: 400;
  color: var(--color-slate);
}

.price-leader {
  flex: 1;
  min-width: 1rem;
  border-bottom: 1px dotted var(--color-grey);
}

.price-amount {
  font-size: 1.375rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.pricing-footnote {
  margin-top: 1rem;
  font-size: var(--text-label);
  color: var(--color-slate);
}

/* ---------- Reviews (summary left, three reviews right, more scroll in from the right) ---------- */
.reviews {
  padding-block: var(--section-space);
  background: var(--color-white);
}

.reviews-grid {
  display: grid;
  grid-template-columns: minmax(0, 4fr) minmax(0, 8fr);
  gap: 2.5rem clamp(2rem, 5vw, 5rem);
  align-items: start;
}

.reviews-summary {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1rem;
}

.rating {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-top: 0.5rem;
}

.rating-score {
  font-size: 4.25rem;
  font-weight: 600;
  line-height: 1;
  letter-spacing: -0.04em;
}

.rating-detail {
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
}

.rating-stars {
  width: 112px;
  height: 20px;
  color: var(--color-navy);
}

.rating-text {
  font-size: var(--text-small);
  color: var(--color-slate);
}

.carousel-controls {
  display: flex;
  gap: 0.5rem;
  margin-top: 0.5rem;
}

.carousel-button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  padding: 0;
  background: var(--color-white);
  border: 1px solid var(--color-navy);
  color: var(--color-navy);
  transition: background-color 0.15s ease, color 0.15s ease;
}

.carousel-button:hover:not(:disabled) {
  background: var(--color-navy);
  color: var(--color-white);
}

.carousel-button:disabled {
  border-color: var(--color-line-strong);
  color: var(--color-grey);
  cursor: default;
}

/* Both arrows disabled = everything fits, so hide them */
.carousel-controls.is-static { display: none; }

.carousel-icon {
  width: 20px;
  height: 20px;
}

.review-track {
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
}

.review-track::-webkit-scrollbar { display: none; }

.review-track:focus-visible {
  outline: 3px solid var(--color-navy);
  outline-offset: 3px;
}

/* Exactly three cards fill the column; the fourth onwards sit off to the right */
.review-list {
  --review-gap: 2rem;
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: calc((100% - var(--review-gap) * 2) / 3);
  gap: var(--review-gap);
  margin: 0;
  padding: 0;
  list-style: none;
}

.review {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding-top: 1.25rem;
  border-top: 2px solid var(--color-navy);
  scroll-snap-align: start;
}

.review-tag {
  align-self: flex-start;
  padding: 0.25rem 0.5rem;
  background: var(--color-warm);
  font-size: var(--text-label);
  font-weight: 600;
}

.review-quote { margin: 0; }

.review-text {
  font-size: 1.125rem;
  font-weight: 500;
  line-height: 1.5;
}

/* Long reviews: six lines, then "Read more" (only once theme.js has shown the button) */
.review-quote:has(+ .review-more[aria-expanded="false"]:not([hidden])) .review-text {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 6;
  line-clamp: 6;
  overflow: hidden;
}

.review-more {
  align-self: flex-start;
  min-height: 44px;
  margin-top: -0.75rem;
  padding: 0;
  border: 0;
  background: none;
  font: inherit;
  font-size: var(--text-small);
  font-weight: 600;
  color: var(--color-navy);
  text-decoration: underline;
  text-decoration-color: var(--color-teal);
  text-decoration-thickness: 2px;
  text-underline-offset: 0.3em;
  cursor: pointer;
}

.review-more:hover { text-decoration-color: var(--color-navy); }

.review-author {
  margin-top: auto;
  font-size: var(--text-small);
  color: var(--color-slate);
}

/* ---------- Location ---------- */
.location {
  padding-block: var(--section-space);
  background: var(--color-warm-light);
}

.location-grid {
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  gap: 2.5rem clamp(2rem, 5vw, 4.5rem);
  align-items: stretch;
}

.map-block {
  position: relative;
  display: flex;
  align-items: flex-end;
  min-height: 480px;
  padding: 1.5rem;
  overflow: hidden;
  background: #E9E7E2;
}

.map-frame {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.map-link {
  position: relative;
  z-index: 1;
}

.location-details {
  display: flex;
  flex-direction: column;
  gap: 2rem;
}

.location-intro {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.detail-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.25rem 1.5rem;
  margin: 0;
}

.detail-row {
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
}

.detail-row.is-wide { grid-column: 1 / -1; }

.detail-term {
  font-size: var(--text-label);
  font-weight: 600;
  color: var(--color-slate);
}

.detail-value {
  margin: 0;
  font-weight: 500;
}

.detail-link {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  font-weight: 600;
  color: var(--color-navy);
}

.hours {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.hours-title {
  font-size: var(--text-h3);
  font-weight: 600;
}

.hours-list {
  margin: 0;
  border-top: 2px solid var(--color-navy);
}

.hours-row {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.8125rem 0;
  border-bottom: 1px solid var(--color-line-strong);
}

.hours-day { font-weight: 500; }

.hours-time {
  margin: 0;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  text-align: right;
}

.hours-time.is-closed {
  font-weight: 500;
  color: var(--color-slate);
}

/* ---------- FAQ ---------- */
.faq {
  padding-block: var(--section-space);
  background: var(--color-white);
}

.faq-grid {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  gap: 2.5rem clamp(2rem, 6vw, 6rem);
  align-items: start;
}

.faq-intro {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.faq-list { border-top: 2px solid var(--color-navy); }

.faq-item { border-bottom: 1px solid var(--color-line-strong); }

.faq-heading {
  font-size: inherit;
  letter-spacing: 0;
}

.faq-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  width: 100%;
  min-height: 68px;
  padding: 1.125rem 0;
  background: none;
  border: 0;
  font-size: 1.1875rem;
  font-weight: 600;
  line-height: 1.35;
  text-align: left;
  color: var(--color-navy);
}

.faq-toggle:hover { color: var(--color-teal-dark); }

.faq-icon {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  flex-shrink: 0;
  border: 1px solid var(--color-line-strong);
}

.faq-icon-bar {
  position: absolute;
  width: 12px;
  height: 2px;
  background: var(--color-navy);
  transition: transform 0.2s ease;
}

.faq-icon-bar.is-vertical { transform: rotate(90deg); }
.faq-item.is-open .faq-icon-bar.is-vertical { transform: rotate(0deg); }
.faq-item.is-open .faq-icon { background: var(--color-teal); border-color: var(--color-teal); }

.faq-panel {
  display: none;
  padding: 0 3.5rem 1.5rem 0;
}

.faq-item.is-open .faq-panel { display: block; }

.faq-answer {
  max-width: 60ch;
  color: var(--color-slate);
}

.faq-answer a {
  font-weight: 600;
  color: var(--color-navy);
  text-decoration-color: var(--color-teal);
  text-decoration-thickness: 2px;
}

.faq.is-page { padding-block: clamp(2.5rem, 2rem + 3vw, 4rem) var(--section-space); }

.faq-page-list { max-width: 860px; }

/* ---------- Booking ---------- */
.booking {
  padding-block: var(--section-space);
  background: var(--color-warm);
}

.booking-grid {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  gap: 2.5rem clamp(2rem, 6vw, 6rem);
  align-items: start;
}

.booking-intro {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.booking-online {
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
  margin-top: 0.5rem;
  padding: 1.5rem;
  background: var(--color-white);
  border-left: 4px solid var(--color-teal);
}

.booking-online-title {
  font-family: var(--font-head);
  font-size: 1.125rem;
  font-weight: 600;
}

.booking-online-text {
  font-size: var(--text-small);
  color: var(--color-slate);
}

.booking-online-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 0.75rem;
}

.booking-online-actions .button {
  min-height: 48px;
  padding: 0.625rem 1.125rem;
  font-size: var(--text-small);
}

.booking-online-actions .button-icon {
  width: 16px;
  height: 16px;
}

.booking-points {
  display: grid;
  gap: 1rem;
  margin: 0.75rem 0 0;
  padding: 1.5rem 0 0;
  list-style: none;
  border-top: 1px solid var(--color-line-strong);
}

.booking-point {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
}

.booking-point-icon {
  width: 20px;
  height: 20px;
  margin-top: 3px;
  flex-shrink: 0;
}

.booking-point-text { font-weight: 500; }

.booking-form {
  padding: clamp(1.5rem, 4vw, 3rem);
  background: var(--color-white);
}

.form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.25rem;
}

.form-field {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  min-width: 0;
}

.form-field.is-full { grid-column: 1 / -1; }

.form-label {
  font-size: var(--text-small);
  font-weight: 600;
}

.form-optional {
  font-weight: 400;
  color: var(--color-slate);
}

.form-input {
  width: 100%;
  min-height: 52px;
  padding: 0.75rem 1rem;
  background: var(--color-white);
  border: 1px solid var(--color-field);
  border-radius: 0;
  font-size: 1rem;
}

.form-select {
  width: 100%;
  min-height: 52px;
  padding: 0.75rem 2.75rem 0.75rem 1rem;
  background-color: var(--color-white);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230F172A' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 1rem center;
  background-size: 14px;
  border: 1px solid var(--color-field);
  border-radius: 0;
  font-family: inherit;
  font-size: 1rem;
  color: var(--color-navy);
  appearance: none;
}

.form-textarea {
  width: 100%;
  min-height: 120px;
  padding: 0.75rem 1rem;
  background: var(--color-white);
  border: 1px solid var(--color-field);
  border-radius: 0;
  font-family: inherit;
  font-size: 1rem;
  line-height: 1.5;
  color: var(--color-navy);
  resize: vertical;
}

.form-input:hover,
.form-select:hover,
.form-textarea:hover { border-color: var(--color-navy); }

.form-consent {
  grid-column: 1 / -1;
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
}

.form-checkbox {
  width: 22px;
  height: 22px;
  margin: 2px 0 0;
  flex-shrink: 0;
  accent-color: var(--color-navy);
}

.form-consent-label {
  font-size: var(--text-small);
  line-height: 1.5;
  color: var(--color-slate);
}

.form-submit {
  grid-column: 1 / -1;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.form-help {
  font-size: var(--text-label);
  color: var(--color-slate);
}

.form-success {
  padding: 1.5rem;
  background: var(--color-teal-tint);
  border-left: 4px solid var(--color-teal);
  font-size: var(--text-lead);
  font-weight: 600;
  line-height: 1.45;
}

.booking-form.is-sent .form-grid { display: none; }

/* ---------- Footer ---------- */
.site-footer {
  padding-top: clamp(3.5rem, 6vw, 5rem);
  background: var(--color-navy);
  color: var(--color-footer-text);
}

.footer-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) repeat(3, minmax(0, 1fr));
  gap: 2.5rem;
  padding-bottom: 3rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.14);
}

.footer-brand {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1.25rem;
}

.footer-logo {
  display: flex;
  align-items: center;
  min-height: 44px;
  text-decoration: none;
}

.footer-logo-img {
  width: auto;
  height: 72px;
}

.footer-tagline {
  margin-top: -0.25rem;
  font-size: var(--text-label);
  font-weight: 500;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--color-teal);
}

.footer-line {
  max-width: 30ch;
  line-height: 1.55;
  color: var(--color-white);
}

.footer-social {
  display: flex;
  gap: 0.5rem;
}

.social-link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border: 1px solid rgba(255, 255, 255, 0.25);
  color: var(--color-white);
  transition: border-color 0.15s ease, background-color 0.15s ease;
}

.social-link:hover {
  background: rgba(255, 255, 255, 0.08);
  border-color: var(--color-white);
}

.social-icon {
  width: 18px;
  height: 18px;
}

.footer-col {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.footer-heading {
  font-size: var(--text-label);
  font-weight: 600;
  color: var(--color-footer-muted);
}

.footer-text {
  font-size: var(--text-small);
  line-height: 1.7;
}

.footer-links {
  display: flex;
  flex-direction: column;
  margin: -0.5rem 0 0;
  padding: 0;
  list-style: none;
}

.footer-link {
  display: inline-flex;
  align-items: center;
  min-height: 40px;
  font-size: var(--text-small);
  color: var(--color-footer-text);
  text-decoration: none;
}

.footer-link:hover {
  color: var(--color-white);
  text-decoration: underline;
}

.footer-link:focus-visible,
.social-link:focus-visible,
.footer-logo:focus-visible {
  outline-color: var(--color-teal);
}

.footer-bottom {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem 1.5rem;
  padding-block: 1.25rem 1.5rem;
}

.footer-legal {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0 1.25rem;
}

.footer-small {
  font-size: var(--text-label);
  color: var(--color-footer-muted);
}

/* ---------- Mobile action bar (shown <=767px) ---------- */
.action-bar { display: none; }

.action-bar-link {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  min-height: 50px;
  border: 1px solid var(--color-line-strong);
  font-size: var(--text-small);
  font-weight: 600;
  color: var(--color-navy);
  text-decoration: none;
}

.action-bar-link.is-primary {
  background: var(--color-teal);
  border-color: var(--color-teal);
}

.action-bar-icon {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .nav-dropdown-panel,
  .nav-chevron,
  .burger-line,
  .mobile-chevron,
  .faq-icon-bar,
  .region-tab,
  .region-button,
  .button { transition: none; }
}

/* Narrow desktop: header WhatsApp shrinks to its icon (the text stays as the accessible name) */
@media (min-width: 992px) and (max-width: 1150px) {
  .header-whatsapp {
    gap: 0;
    padding: 0 0.75rem;
    font-size: 0;
  }

  .main-nav { margin-left: 0; }
}

.button.is-header { white-space: nowrap; }

/* ==========================================================================
   Tablet (<=991px)
   ========================================================================== */
@media (max-width: 991px) {
  .main-nav,
  .header-whatsapp { display: none; }

  .menu-burger { display: flex; }

  .mobile-menu.is-open { display: flex; }

  .section-head {
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
  }

  .hero-inner {
    grid-template-columns: minmax(0, 1fr);
    gap: 2.5rem;
  }

  .hero-backdrop {
    top: auto;
    width: 100%;
    height: 28%;
  }

  .hero-media {
    height: auto;
    min-height: 0;
    aspect-ratio: 16 / 10;
  }

  .hero-video { object-position: 40% 50%; }

  .regions-layout { grid-template-columns: minmax(0, 1fr); }

  .region-index-head { display: none; }

  .region-tablist {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.5rem;
  }

  .region-tab {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    min-height: 0;
    padding: 0.875rem 0.875rem 0.875rem 1rem;
    border: 1px solid var(--color-line-strong);
  }

  .region-tab.is-active { border-color: var(--color-teal); }

  .region-tab-num {
    grid-column: 1 / -1;
    padding-top: 0;
  }

  .region-tab-name { font-size: 1.25rem; }

  .region-tab-hint { display: none; }

  .region-tab-plan { align-self: end; }

  .region-tab-sessions { font-size: 1rem; }

  .region-index { grid-row: auto; }

  .region-elsewhere { grid-column: auto; }

  .region-panel-inner {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas:
      "media"
      "body"
      "footer";
  }

  .region-panel-media {
    min-height: 0;
    aspect-ratio: 16 / 9;
  }

  .values-grid,
  .services-grid,
  .pricing-grid,
  .reviews-grid,
  .location-grid,
  .faq-grid,
  .booking-grid { grid-template-columns: minmax(0, 1fr); }

  .promise-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  .promise-item:nth-child(3) {
    padding-left: 0;
    border-left: 0;
  }

  .promise-item:nth-child(n + 3) { border-top: 1px solid var(--color-line); }

  .steps {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 3.5rem 0;
  }

  .services-intro { position: static; }

  .services-img { aspect-ratio: 16 / 8; }

  .page-head-grid { grid-template-columns: minmax(0, 1fr); }

  .review-list { grid-auto-columns: calc((100% - var(--review-gap)) / 2); }

  .profile { grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); }

  .post-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  .mobile-sublink { min-height: 40px; }

  .map-block { min-height: 400px; }

  .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ==========================================================================
   Mobile (<=767px)
   ========================================================================== */
@media (max-width: 767px) {
  :root {
    --header-height: 64px;
    --text-lead: 1.0625rem;
  }

  body { padding-bottom: calc(var(--bar-height) + env(safe-area-inset-bottom, 0px)); }

  .button.is-header { display: none; }

  .brand-logo { height: 44px; }

  .hero-inner {
    gap: 2rem;
    padding-top: 1.25rem;
  }

  .hero-content { gap: 1.125rem; }

  .hero-lead {
    font-size: 1rem;
    line-height: 1.5;
  }

  .hero-title { gap: 0.625rem; }

  .hero-regions { gap: 0.625rem; }

  .region-button {
    flex-direction: column;
    justify-content: center;
    gap: 0.375rem;
    min-height: 84px;
    padding: 0.5rem 0.375rem;
    text-align: center;
  }

  .region-button-name { font-size: 1rem; }

  .region-button-meta { display: none; }

  .region-figure {
    width: 26px;
    height: 42px;
  }

  .hero-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.5rem;
  }

  .button.is-block {
    width: 100%;
    padding-inline: 0.75rem;
  }

  .hero-proof-divider,
  .hero-proof-text.is-referral { display: none; }

  .hero-proof { gap: 0.375rem 0.75rem; }

  .hero-media { aspect-ratio: 4 / 3; }

  .hero-media-caption {
    left: 0.875rem;
    top: 0.875rem;
  }

  .video-toggle {
    right: 0.875rem;
    bottom: 0.875rem;
  }

  .region-panel-footer {
    flex-direction: column;
    align-items: stretch;
  }

  .condition-list { grid-template-columns: minmax(0, 1fr); }

  .values-list,
  .services-list,
  .form-grid { grid-template-columns: minmax(0, 1fr); }

  .promise-strip { grid-template-columns: minmax(0, 1fr); }

  .promise-item,
  .promise-item:nth-child(3) {
    padding: 1rem 0;
    border-left: 0;
  }

  .promise-item:nth-child(n + 2) { border-top: 1px solid var(--color-line); }

  .steps {
    grid-template-columns: minmax(0, 1fr);
    gap: 3rem;
  }

  .step { padding-right: 0; }

  .services-img { display: none; }

  .profile { grid-template-columns: minmax(0, 1fr); }

  .profile-photo {
    max-width: 360px;
    aspect-ratio: 1 / 1;
  }

  .profile-actions .button { width: 100%; }

  .post-grid { grid-template-columns: minmax(0, 1fr); }

  .condition-list.is-columns { grid-template-columns: minmax(0, 1fr); }

  .rating-score { font-size: 3.5rem; }

  .review-list { grid-auto-columns: 82%; --review-gap: 1.25rem; }

  .price-row {
    flex-wrap: wrap;
    gap: 0.25rem 1rem;
  }

  .price-leader { display: none; }

  .price-name { flex: 1; }

  .map-block {
    min-height: 340px;
    padding: 1rem;
  }

  .detail-list { grid-template-columns: minmax(0, 1fr); }

  .faq-toggle { font-size: 1.0625rem; }

  .faq-panel { padding-right: 0; }

  .footer-grid { grid-template-columns: minmax(0, 1fr); }

  .action-bar {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 95;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.5rem;
    padding: 0.5rem 0.75rem calc(0.5rem + env(safe-area-inset-bottom, 0px));
    background: var(--color-white);
    border-top: 1px solid var(--color-line);
    box-shadow: 0 -10px 30px -20px rgba(15, 23, 42, 0.4);
  }
}

/* ==========================================================================
   Small mobile (<=479px)
   ========================================================================== */
@media (max-width: 479px) {
  .hero-answer { max-width: none; }

  .region-buttons { gap: 0.375rem; }

  .region-tablist { gap: 0.375rem; }

  .region-tab { padding: 0.75rem 0.625rem 0.75rem 0.75rem; }

  .region-tab-name { font-size: 1.0625rem; }

  .region-tab-plan { display: none; }

  .region-plan-number { font-size: 2.25rem; }

  .region-buttons { grid-template-columns: repeat(4, minmax(0, 1fr)); }

  .region-button-name { font-size: 0.875rem; }

  .hero-actions .button {
    gap: 0.375rem;
    padding-inline: 0.5rem;
    font-size: 0.875rem;
  }

  .hero-actions .button-icon {
    width: 18px;
    height: 18px;
  }
}

/* ==========================================================================
   WordPress layer: maps core block markup onto the design above.
   ========================================================================== */

/* Sticky header: the template part wrapper is what sits in the page flow */
.header-part {
  position: sticky;
  top: var(--wp-admin--admin-bar--height, 0px);
  z-index: 100;
}

.site-header { position: relative; }

.mobile-menu { top: calc(var(--header-height) + var(--wp-admin--admin-bar--height, 0px)); }

.wp-site-blocks > * { margin-block: 0; }

/* Core buttons look like .button */
.wp-block-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}

.wp-block-button__link,
.wp-element-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.625rem;
  min-height: 52px;
  border-radius: 0;
  text-align: center;
  text-decoration: none;
  transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.wp-block-button__link:hover {
  background: var(--color-teal-hover);
  border-color: var(--color-teal-hover);
}

.wp-block-button.is-style-outline-navy .wp-block-button__link {
  background: var(--color-white);
  border-color: var(--color-navy);
  color: var(--color-navy);
}

.wp-block-button.is-style-outline-navy .wp-block-button__link:hover {
  background: var(--color-navy);
  color: var(--color-white);
}

.wp-block-button.has-whatsapp-icon .wp-block-button__link::before {
  content: "";
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  background: currentColor;
  -webkit-mask: var(--icon-whatsapp) center / contain no-repeat;
  mask: var(--icon-whatsapp) center / contain no-repeat;
}

.wp-block-button.has-external-icon .wp-block-button__link::after {
  content: "";
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  background: currentColor;
  -webkit-mask: var(--icon-external) center / contain no-repeat;
  mask: var(--icon-external) center / contain no-repeat;
}

:root {
  --icon-whatsapp: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M17.47 14.38c-.3-.15-1.76-.87-2.03-.97-.27-.1-.47-.15-.67.15-.2.3-.77.97-.94 1.16-.17.2-.35.22-.64.07-.3-.15-1.26-.46-2.39-1.47-.88-.79-1.48-1.76-1.65-2.06-.17-.3-.02-.46.13-.6.13-.14.3-.35.45-.52.15-.17.2-.3.3-.5.1-.2.05-.37-.03-.52-.07-.15-.67-1.61-.92-2.2-.24-.58-.49-.5-.67-.51h-.57c-.2 0-.52.07-.79.37-.27.3-1.04 1.02-1.04 2.48s1.07 2.88 1.21 3.07c.15.2 2.1 3.2 5.08 4.49.71.31 1.26.49 1.7.63.71.22 1.36.19 1.87.12.57-.09 1.76-.72 2-1.41.25-.7.25-1.29.18-1.41-.08-.13-.27-.2-.57-.35zM12.05 21.79h-.01a9.87 9.87 0 0 1-5.03-1.38l-.36-.21-3.74.98 1-3.65-.24-.37a9.86 9.86 0 0 1-1.51-5.26c0-5.45 4.44-9.88 9.89-9.88 2.64 0 5.12 1.03 6.99 2.9a9.82 9.82 0 0 1 2.89 6.99c0 5.45-4.44 9.88-9.88 9.88zm8.41-18.3A11.82 11.82 0 0 0 12.05 0C5.5 0 .16 5.34.16 11.89c0 2.1.55 4.14 1.59 5.95L.06 24l6.31-1.65a11.88 11.88 0 0 0 5.68 1.45h.01c6.55 0 11.89-5.34 11.89-11.89a11.82 11.82 0 0 0-3.48-8.41z'/%3E%3C/svg%3E");
  --icon-external: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 4h6v6M20 4l-9 9M18 14v6H4V6h6'/%3E%3C/svg%3E");
}

/* Hero: core Video block as the rounded frame */
.wp-block-video.hero-media { margin: 0; }

.hero-media figcaption,
.hero-media .wp-element-caption {
  position: absolute;
  left: 1.25rem;
  top: 1.25rem;
  max-width: calc(100% - 2.5rem);
  margin: 0;
  padding: 0.5rem 0.75rem;
  background: rgba(255, 255, 255, 0.95);
  font-size: var(--text-label);
  font-weight: 600;
  line-height: 1.35;
  color: var(--color-navy);
  text-align: left;
}

.hero-proof a {
  color: inherit;
  text-decoration-color: var(--color-line-strong);
}

/* Body-area panel content (written in the block editor) */
.region-panel-content > * { margin: 0; }
.region-panel-content > h3 { font-size: var(--text-panel); line-height: 1.2; letter-spacing: -0.02em; }
.region-panel-content > h3 + p { margin-top: 0.625rem; color: var(--color-slate); }
.region-panel-content > h4 {
  margin-top: 1.5rem;
  font-family: var(--font-main);
  font-size: var(--text-label);
  font-weight: 600;
  letter-spacing: 0;
  color: var(--color-slate);
}
.region-panel-content > h4 + * { margin-top: 0.625rem; }
.region-panel-content > ul {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1.5rem;
  padding: 0;
  list-style: none;
}
.region-panel-content > ul:has(> li:nth-child(7)) {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.5rem 1.25rem;
  font-size: var(--text-small);
}
.region-panel-content > ul > li {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  font-weight: 600;
  line-height: 1.3;
}
.region-panel-content > ul > li::before {
  content: "";
  width: 8px;
  height: 8px;
  flex-shrink: 0;
  background: var(--color-teal);
}
.region-panel-media img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.region-panel { scroll-margin-top: calc(var(--header-height) + 1.5rem); }

/* Review stars per review (partial when fewer than 5) */
.review-stars {
  display: block;
  width: calc(var(--stars, 5) * 17.2px);
  height: 15px;
  overflow: hidden;
  color: var(--color-navy);
}
.review-stars-icon { width: 86px; height: 15px; }
.review-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

/* Location section head sits above the details block */
.location-details .clinic-details {
  display: flex;
  flex-direction: column;
  gap: 2rem;
}

/* Booking intro "book online" box: core buttons inside */
.booking-online .wp-block-buttons { margin-top: 0.75rem; gap: 0.5rem; }
.booking-online .wp-block-button__link { min-height: 48px; padding: 0.625rem 1.125rem; font-size: var(--text-small); }
.booking-points .booking-point::before {
  content: "";
  width: 20px;
  height: 20px;
  margin-top: 3px;
  flex-shrink: 0;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / contain no-repeat;
}
.booking-points { padding-left: 0; }
.booking-points a { font-weight: 600; }

/* Team profiles: core Image block */
.profile-photo { margin: 0; }
.profile-photo img {
  width: 100%;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  object-position: 50% 18%;
  background: var(--color-warm);
}
.profile-body .wp-block-buttons { margin-top: 1.25rem; }
.profile-body > * { margin: 0; }

/* FAQ page: core Details blocks */
.faq-list > * { margin: 0; }
.wp-block-details.faq-item { border-bottom: 1px solid var(--color-line-strong); }
.wp-block-details.faq-item > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  min-height: 68px;
  padding: 1.125rem 0;
  font-family: var(--font-head);
  font-size: 1.1875rem;
  font-weight: 600;
  line-height: 1.35;
  list-style: none;
  cursor: pointer;
}
.wp-block-details.faq-item > summary::-webkit-details-marker { display: none; }
.wp-block-details.faq-item > summary:hover { color: var(--color-teal-dark); }
.wp-block-details.faq-item > summary::after {
  content: "+";
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  flex-shrink: 0;
  border: 1px solid var(--color-line-strong);
  font-family: var(--font-main);
  font-size: 1.25rem;
  font-weight: 400;
  color: var(--color-navy);
}
.wp-block-details.faq-item[open] > summary::after {
  content: "–";
  background: var(--color-teal);
  border-color: var(--color-teal);
}
.wp-block-details.faq-item > :not(summary) {
  max-width: 60ch;
  margin: 0;
  padding: 0 3.5rem 1.5rem 0;
  color: var(--color-slate);
}
.wp-block-details.faq-item a {
  font-weight: 600;
  color: var(--color-navy);
  text-decoration-color: var(--color-teal);
  text-decoration-thickness: 2px;
}

/* Blog listing: core Query Loop */
.blog-filters a.filter-button { text-decoration: none; }
.filter-button[aria-current="page"] {
  background: var(--color-navy);
  border-color: var(--color-navy);
  color: var(--color-white);
}
.blog-query { margin-top: 2rem; }
.wp-block-post-template.post-grid { margin: 0; }
.post-card > * { margin: 0; }
.post-card .wp-block-post-featured-image { margin: 0; }
.post-card .wp-block-post-featured-image img {
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  background: var(--color-warm);
}
.post-card .wp-block-post-featured-image a { display: block; }
.post-card .post-body > * { margin: 0; }
.post-card .wp-block-post-terms a,
.post-tags a {
  display: inline-block;
  margin: 0 0.375rem 0.375rem 0;
  padding: 0.125rem 0.5rem;
  background: var(--color-teal-tint);
  font-size: var(--text-label);
  font-weight: 600;
  color: var(--color-navy);
  text-decoration: none;
}
.post-card .wp-block-post-terms a:hover,
.post-tags a:hover { background: var(--color-teal); }
.post-card .wp-block-post-terms__separator { display: none; }
.post-card .post-title a { text-decoration: none; }
.post-card .post-title a:hover { text-decoration: underline; text-decoration-color: var(--color-teal); text-decoration-thickness: 2px; }
.post-card .post-excerpt p { margin: 0; color: var(--color-slate); }
.post-card .wp-block-post-excerpt__more-text { display: none; }
.post-meta { display: flex; gap: 0.75rem; }
.blog-empty-query { margin-top: 2rem; color: var(--color-slate); }

.wp-block-query-pagination {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  margin-top: 3rem;
  font-family: var(--font-head);
  font-weight: 600;
}
.wp-block-query-pagination a,
.wp-block-query-pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  min-height: 44px;
  padding: 0 0.75rem;
  border: 1px solid var(--color-line-strong);
  text-decoration: none;
}
.wp-block-query-pagination .page-numbers.current {
  background: var(--color-navy);
  border-color: var(--color-navy);
  color: var(--color-white);
}

/* Single blog post */
.post-head {
  padding-block: clamp(2.5rem, 2rem + 3vw, 4.5rem) 2rem;
  background: var(--color-warm-light);
}
.post-head-inner {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  max-width: 820px;
}
.post-head-inner > * { margin: 0; }
.post-head .post-page-title {
  font-size: clamp(2rem, 1.5rem + 2vw, 3.25rem);
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: -0.025em;
}
.post-head .post-meta { font-size: var(--text-small); color: var(--color-slate); }
.post-hero-image { margin: 0; }
.post-hero-image img { width: 100%; max-height: 560px; object-fit: cover; }
.post-body-wrap { padding-block: clamp(2.5rem, 2rem + 3vw, 4rem) var(--section-space); }
.prose { max-width: 720px; font-size: 1.0625rem; line-height: 1.75; }
.prose > * { margin: 0 0 1.25rem; }
.prose > h2 { margin-top: 2.5rem; font-size: 1.75rem; letter-spacing: -0.015em; }
.prose > h3 { margin-top: 2rem; font-size: 1.3125rem; }
.prose ul, .prose ol { padding-left: 1.25rem; }
.prose li + li { margin-top: 0.375rem; }
.prose a { color: var(--color-navy); text-decoration-color: var(--color-teal); text-decoration-thickness: 2px; }
.prose img { height: auto; }
.prose blockquote {
  padding: 0.25rem 0 0.25rem 1.25rem;
  border-left: 4px solid var(--color-teal);
  font-size: 1.1875rem;
  font-weight: 500;
}
.post-disclaimer {
  max-width: 720px;
  margin-top: 2.5rem;
  padding: 1.25rem 1.5rem;
  background: var(--color-warm-light);
  font-size: var(--text-small);
  color: var(--color-slate);
}
.related-posts { padding-block: var(--section-space); border-top: 1px solid var(--color-line); }
.related-posts .section-title { margin-bottom: 2rem; }

/* Plain pages (privacy policy etc.) */
.page-body { padding-block: clamp(2.5rem, 2rem + 3vw, 4rem) var(--section-space); }
.page-body .prose > h1 { margin-bottom: 1.5rem; font-size: clamp(2rem, 1.5rem + 2vw, 3rem); }

/* 404 */
.not-found { padding-block: var(--section-space); }
.not-found > .container > * { margin: 0 0 1rem; }

@media (max-width: 991px) {
  .header-part { top: 0; }
}

@media (max-width: 767px) {
  .wp-block-details.faq-item > summary { font-size: 1.0625rem; }
  .wp-block-details.faq-item > :not(summary) { padding-right: 0; }
  .region-panel-content > ul:has(> li:nth-child(7)) { grid-template-columns: minmax(0, 1fr); }
  .profile-photo img { aspect-ratio: 1 / 1; }
  .profile-photo { max-width: 360px; }
  .profile-body .wp-block-button { width: 100%; }
  .profile-body .wp-block-button__link { width: 100%; }
}

/* Homepage sections built from core blocks */
.hero::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 33%;
  background: var(--color-warm);
}
.hero-content > * { margin: 0; }
.hero-question + .hero-answer { margin-top: -0.625rem; }
.hero-proof { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 1rem; }
.hero-proof > * { margin: 0; }
.hero-proof-text.has-stars { display: inline-flex; align-items: center; gap: 1rem; }
.hero-proof-text.has-stars::before {
  content: "";
  width: 92px;
  height: 16px;
  flex-shrink: 0;
  background: var(--color-navy);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 92 16'%3E%3Cpath d='M8 .8l2.2 4.6 5 .7-3.6 3.5.9 5-4.5-2.4-4.5 2.4.9-5L.8 6.1l5-.7zM27 .8l2.2 4.6 5 .7-3.6 3.5.9 5-4.5-2.4-4.5 2.4.9-5-3.6-3.5 5-.7zM46 .8l2.2 4.6 5 .7-3.6 3.5.9 5-4.5-2.4-4.5 2.4.9-5-3.6-3.5 5-.7zM65 .8l2.2 4.6 5 .7-3.6 3.5.9 5-4.5-2.4-4.5 2.4.9-5-3.6-3.5 5-.7zM84 .8l2.2 4.6 5 .7-3.6 3.5.9 5-4.5-2.4-4.5 2.4.9-5-3.6-3.5 5-.7z'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 92 16'%3E%3Cpath d='M8 .8l2.2 4.6 5 .7-3.6 3.5.9 5-4.5-2.4-4.5 2.4.9-5L.8 6.1l5-.7zM27 .8l2.2 4.6 5 .7-3.6 3.5.9 5-4.5-2.4-4.5 2.4.9-5-3.6-3.5 5-.7zM46 .8l2.2 4.6 5 .7-3.6 3.5.9 5-4.5-2.4-4.5 2.4.9-5-3.6-3.5 5-.7zM65 .8l2.2 4.6 5 .7-3.6 3.5.9 5-4.5-2.4-4.5 2.4.9-5-3.6-3.5 5-.7zM84 .8l2.2 4.6 5 .7-3.6 3.5.9 5-4.5-2.4-4.5 2.4.9-5-3.6-3.5 5-.7z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.hero-proof-text.has-stars a { color: inherit; text-decoration-color: var(--color-line-strong); }
.hero-proof-text.has-stars strong { color: var(--color-navy); }
.hero-proof-text.is-referral { padding-left: 1rem; border-left: 1px solid var(--color-line-strong); }

.section-head > *,
.values-intro > *,
.services-intro > *,
.location-intro > *,
.booking-intro > *,
.booking-online > *,
.value-item > *,
.step > *,
.service-item > *,
.cta-band-copy > *,
.page-head-grid > * { margin: 0; }

.step-num { font-family: var(--font-head); }

.service-areas::before {
  content: "";
  width: 8px;
  height: 8px;
  flex-shrink: 0;
  background: var(--color-teal);
}
.services-img { margin: 0.75rem 0 0; }
.services-img img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  object-position: 45% 50%;
}

.promise-item,
.promise-strip > li {
  display: flex;
  align-items: center;
  gap: 0.875rem;
  padding: 1.375rem 1.5rem;
  border-left: 1px solid var(--color-line);
  font-weight: 600;
  line-height: 1.3;
}
.promise-strip > li:first-child { padding-left: 0; border-left: 0; }
.promise-strip > li::before {
  content: "";
  width: 28px;
  height: 28px;
  flex-shrink: 0;
  background: var(--color-teal-dark);
  -webkit-mask: var(--promise-icon) center / contain no-repeat;
  mask: var(--promise-icon) center / contain no-repeat;
}
.promise-strip > li:nth-child(1) { --promise-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round'%3E%3Ccircle cx='10.5' cy='10.5' r='7'/%3E%3Cpath d='M15.5 15.5 21 21'/%3E%3C/svg%3E"); }
.promise-strip > li:nth-child(2) { --promise-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round'%3E%3Ccircle cx='12' cy='7' r='4'/%3E%3Cpath d='M4 21v-1a6 6 0 0 1 6-6h4a6 6 0 0 1 6 6v1'/%3E%3C/svg%3E"); }
.promise-strip > li:nth-child(3) { --promise-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round'%3E%3Cpath d='M4 20h16M6 16v-3M10 16V9M14 16v-5M18 16V5'/%3E%3C/svg%3E"); }
.promise-strip > li:nth-child(4) { --promise-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='m8 12.5 2.5 2.5L16 9.5'/%3E%3C/svg%3E"); }

.profiles .profile-list { display: grid; }

@media (max-width: 991px) {
  .hero::before { top: auto; width: 100%; height: 28%; }
  .promise-strip > li:nth-child(3) { padding-left: 0; border-left: 0; }
  .promise-strip > li:nth-child(n + 3) { border-top: 1px solid var(--color-line); }
}

@media (max-width: 767px) {
  .hero-proof-text.is-referral { display: none; }
  .promise-strip > li,
  .promise-strip > li:nth-child(3) { padding: 1rem 0; border-left: 0; }
  .promise-strip > li:nth-child(n + 2) { border-top: 1px solid var(--color-line); }
}

/* Core's .wp-block-video video { height: auto } would shrink the hero clip */
.wp-block-video.hero-media video.hero-video { width: 100%; height: 100%; }
.hero-answer { text-wrap: balance; }
.post-hero-image { margin: 0 0 clamp(2rem, 4vw, 3rem); }
.post-hero-image img { aspect-ratio: 16 / 7; max-height: none; }

/* ---------- QA fixes (2026-10-15) ---------- */

/* Finder panel: content flows with its own margins (the demo's flex gap doubled them) */
.region-panel-body.region-panel-content { display: block; }

/* Tag chips: never show the comma separator core puts between terms */
.wp-block-post-terms.post-tags .wp-block-post-terms__separator { display: none; }

/* Service "often for" line: marker sits on the first line when the text wraps */
.service-areas { align-items: flex-start; }
.service-areas::before { margin-top: 0.4em; }

/* Map: keep our button clear of Google's own controls (bottom-left map type, bottom-right zoom) */
.map-block { align-items: flex-start; justify-content: flex-end; }

/* Footer legal links match the small print next to them */
.footer-legal .footer-link { font-size: var(--text-label); min-height: 32px; }

/* Search results page */
.search-form-inline { display: flex; flex-wrap: wrap; gap: 0.5rem; max-width: 520px; }
.search-form-inline .wp-block-search__inside-wrapper { display: flex; gap: 0.5rem; width: 100%; }
.search-form-inline .wp-block-search__input {
  flex: 1;
  min-height: 52px;
  padding: 0.75rem 1rem;
  border: 1px solid var(--color-field);
  border-radius: 0;
  font: inherit;
}
.search-form-inline .wp-block-search__button { margin: 0; }

@media (max-width: 767px) {
  /* Hero buttons: two equal columns, as in the demo (core's flex layout would win otherwise) */
  .wp-block-buttons.hero-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.5rem;
  }
  .hero-actions .wp-block-button,
  .hero-actions .wp-block-button__link { width: 100%; }
  .hero-actions .wp-block-button__link { padding-inline: 0.5rem; font-size: 0.875rem; gap: 0.375rem; }
  .cta-band-actions .wp-block-button,
  .cta-band-actions .wp-block-button__link { width: 100%; }
  .cta-band-actions { width: 100%; }
}
.post-card.type-page .wp-block-post-time-to-read,
.type-page .post-meta { display: none; }

/* ==========================================================================
   Round 2 feedback (2026-10-18): About page, read-more links, blog filters,
   sample article
   ========================================================================== */
.visually-hidden {
  position: absolute !important;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

/* Read more links under services and body-area panels */
.service-more,
.region-more { align-self: flex-start; margin-top: 0.25rem; }
.region-more { margin-top: 0.75rem; }

/* Reviews: "Read all reviews on Google" as a button */
.reviews-more { margin-top: 0.5rem; }

/* About page: on-this-page bar, sticky under the header */
.page-jump {
  position: sticky;
  top: var(--header-height);
  z-index: 50;
  background: var(--color-white);
  border-bottom: 1px solid var(--color-line);
}
.page-jump-list {
  display: flex;
  gap: clamp(1.25rem, 3vw, 2.5rem);
  margin: 0;
  padding: 0;
  list-style: none;
  overflow-x: auto;
  scrollbar-width: none;
}
.page-jump-list::-webkit-scrollbar { display: none; }
.page-jump-list li { flex-shrink: 0; }
.page-jump-link {
  display: flex;
  align-items: center;
  min-height: 56px;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
  font-family: var(--font-head);
  font-size: var(--text-small);
  font-weight: 500;
  color: var(--color-slate);
  text-decoration: none;
  white-space: nowrap;
  transition: color 0.15s ease, border-color 0.15s ease;
}
.page-jump-link:hover { color: var(--color-navy); }
.page-jump-link.is-active {
  color: var(--color-navy);
  font-weight: 600;
  border-bottom-color: var(--color-teal);
}
.page-jump-link:focus-visible { outline-offset: -3px; }
#team, #process, #contact, #faq, #book { scroll-margin-top: calc(var(--header-height) + 56px); }
.profiles .section-head { margin-bottom: clamp(2.5rem, 4vw, 3.5rem); }
.profile-name { font-size: clamp(2rem, 1.6rem + 1.4vw, 2.75rem); }
.location.is-plain { background: var(--color-white); }
.faq.is-tinted { background: var(--color-warm-light); }

/* Blog filters: Services | Conditions tabs, then a Type row */
.blog-filters-panel {
  display: grid;
  gap: 1rem;
  padding-bottom: 1.5rem;
  border-bottom: 1px solid var(--color-line);
}
.browse-switch {
  display: flex;
  gap: 1.75rem;
  border-bottom: 2px solid var(--color-line);
}
.browse-tab {
  margin-bottom: -2px;
  padding: 0.5rem 0 0.75rem;
  background: none;
  border: 0;
  border-bottom: 2px solid transparent;
  font-family: var(--font-head);
  font-size: 1.125rem;
  font-weight: 600;
  color: var(--color-slate);
}
.browse-tab:hover { color: var(--color-navy); }
.browse-tab[aria-selected="true"] { color: var(--color-navy); border-bottom-color: var(--color-teal); }
.filter-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
}
.filter-row.is-type { padding-top: 0.25rem; }
.filter-label {
  margin-right: 0.5rem;
  font-family: var(--font-head);
  font-size: var(--text-label);
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--color-slate);
}
.blog-count { margin-top: 1.25rem; }

@media (max-width: 767px) {
  .browse-tab { font-size: 1rem; }
  .filter-label { width: 100%; }
  .page-jump-link { min-height: 48px; }
  #team, #process, #contact, #faq, #book { scroll-margin-top: calc(var(--header-height) + 48px); }
}

@media (max-width: 767px) {
  /* Filter pills: one swipeable row each instead of a tall stack */
  .filter-row {
    flex-wrap: nowrap;
    overflow-x: auto;
    margin-inline: calc(var(--gutter) * -1);
    padding-inline: var(--gutter);
    scrollbar-width: none;
  }
  .filter-row::-webkit-scrollbar { display: none; }
  .filter-row .filter-button { flex-shrink: 0; white-space: nowrap; }
  .filter-label { width: auto; flex-shrink: 0; }
}

/* ==========================================================================
   Round 2b (2026-10-19): hero buttons drive the condition panel (no duplicate
   list), team side by side, About page bar (above)
   ========================================================================== */

/* Finder: panel only, one column; the hero buttons are its controls */
.regions { padding-block: clamp(3rem, 2rem + 3vw, 4.5rem) var(--section-space); }
.regions-layout { grid-template-columns: minmax(0, 1fr); gap: 1rem; }
.region-elsewhere { grid-column: auto; }
.region-panel { scroll-margin-top: calc(var(--header-height) + 1rem); }
.region-panel:focus { outline: none; }
.region-panel:focus-visible { outline: 3px solid var(--color-navy); outline-offset: 3px; }

.region-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem 1.5rem;
}
.region-toolbar-label {
  font-family: var(--font-head);
  font-size: var(--text-lead);
  color: var(--color-slate);
}
.region-toolbar-label strong { color: var(--color-navy); font-weight: 600; }
.region-toolbar-actions { display: flex; align-items: center; gap: 0.5rem 1rem; }
.region-toolbar .carousel-button { width: 44px; height: 44px; }
#region-finder { scroll-margin-top: calc(var(--header-height) + 1.25rem); }

/* Hero button for the area on show */
.region-button.is-active {
  background: var(--color-teal-tint);
  border-color: var(--color-teal-dark);
  box-shadow: inset 0 -3px 0 var(--color-teal);
}
.hero-surgery-link.is-active .hero-surgery-cta { text-decoration-color: var(--color-navy); }

/* Team: the two partners side by side */
.profile-list {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 3rem clamp(2rem, 4vw, 3.5rem);
}
.profile {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}
.profile + .profile { padding-top: 0; border-top: 0; }
.profile-photo { aspect-ratio: 1 / 1; }
.profile-body { padding-top: 0; }
.profile-bio { font-size: var(--text-body); }

@media (max-width: 767px) {
  .profile-list { grid-template-columns: minmax(0, 1fr); }
  .profile + .profile { padding-top: 3rem; border-top: 1px solid var(--color-line); }
  .region-toolbar-label { font-size: 1rem; }
}
.profile-photo { aspect-ratio: 4 / 3; object-position: 50% 20%; }

/* ---------- WordPress mapping for round 2 (2026-10-21) ---------- */

/* Body-area panel content: the panel heading is H2, sub-headings H3 */
.region-panel-content > h2 { font-size: var(--text-panel); line-height: 1.2; letter-spacing: -0.02em; margin: 0; }
.region-panel-content > h2 + p { margin-top: 0.625rem; color: var(--color-slate); }
.region-panel-content > h3 {
  margin-top: 1.5rem;
  font-family: var(--font-main);
  font-size: var(--text-label);
  font-weight: 600;
  letter-spacing: 0;
  color: var(--color-slate);
}
.region-panel-content > h3 + * { margin-top: 0.625rem; }
.region-panel-content > .region-more-wrap { margin-top: 1.25rem; }

/* Services: "Read more" paragraph under each service */
.service-item .service-more { margin-top: 0.25rem; }
.service-more a { font-family: var(--font-head); font-weight: 600; color: var(--color-navy); text-decoration-color: var(--color-teal); text-decoration-thickness: 2px; text-underline-offset: 0.3em; }
.service-more a:hover { text-decoration-color: var(--color-navy); }

/* Blog cards (Query Loop), Glyde style: image, type label, title, date */
.post-card { gap: 1rem; }
.post-card .post-body { gap: 0.5rem; }
.post-card .post-label a,
.post-head .post-label a {
  display: inline-block;
  padding: 0.125rem 0.5rem;
  background: var(--color-teal-tint);
  font-family: var(--font-head);
  font-size: var(--text-label);
  font-weight: 600;
  color: var(--color-navy);
  text-decoration: none;
}
.post-card .post-label .wp-block-post-terms__separator,
.post-head .post-label .wp-block-post-terms__separator { display: none; }
.post-card .wp-block-post-date { font-size: var(--text-small); color: var(--color-slate); }
.post-card .wp-block-post-featured-image img { transition: opacity 0.2s ease; }
.post-card .wp-block-post-featured-image a:hover img { opacity: 0.88; }
.blog-reset { font-weight: 600; color: var(--color-navy); text-decoration-color: var(--color-teal); text-decoration-thickness: 2px; text-underline-offset: 0.3em; }
.blog-filters-panel .filter-button { text-decoration: none; }
.blog-section .blog-query { margin-top: 2rem; }

/* Single post: topics line under the title */
.post-topics { display: flex; flex-wrap: wrap; gap: 0.25rem 0.625rem; font-size: var(--text-small); color: var(--color-slate); }
.post-topics a { color: var(--color-navy); font-weight: 600; }
.post-topics .wp-block-post-terms__separator { color: var(--color-slate); }

/* About: page-jump block is full width under the page head */
.page-jump .container { padding-block: 0; }
.profiles { padding-block: var(--section-space); }
.faq.is-tinted .faq-intro > * { margin: 0; }
.faq.is-tinted .faq-intro { display: flex; flex-direction: column; gap: 1rem; }

/* Team photos are core Image blocks (figure > img): crop the image, not the figure */
.profile-photo { aspect-ratio: auto; max-width: none; }
.profile-photo img { aspect-ratio: 4 / 3; object-position: 50% 20%; }
@media (max-width: 767px) {
  .profile-photo { max-width: none; }
  .profile-photo img { aspect-ratio: 4 / 3; }
}