/* =========================================================
   Garner Chiropractic NY - site styles
   Design reference: Figma "Garner Chiropractic-Website design" (1600px frame)
   ========================================================= */

:root {
  --navy: #042544;
  --navy-2: #042340;
  --blue: #10A8E5;
  --blue-soft: #7DD0F0;
  --green: #94CB54;
  --green-dark: #75AD48;
  --mint: #E8F7F1;
  --green-bg: #F2F9EA;
  --green-card: #E8F4DA;
  --bg-soft: #F3F7FB;
  --text: #54667A;
  --text-hero: #334557;
  --muted: #9BA7B3;
  --line: #E3E9EF;
  --yellow: #FBBC04;
  --grad-blue: linear-gradient(125deg, #042544 0%, #0A4F86 52%, #0E6FB1 100%);

  --f-head: "Rajdhani", "Arial Narrow", sans-serif;
  --f-body: "Poppins", Arial, sans-serif;
  --f-serif: "Playfair Display", Georgia, serif;

  --gutter: 64px;
  --h2: 52px;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: var(--f-body);
  font-size: 16px;
  line-height: 1.6;
  color: var(--navy);
  background: #fff;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
h1, h2, h3, p, ul, dl, dd, blockquote { margin: 0; }
ul { padding: 0; list-style: none; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
svg { display: block; flex-shrink: 0; }

.container {
  width: 100%;
  max-width: 1600px;
  margin-inline: auto;
  padding-inline: var(--gutter);
}

.h2 {
  font-family: var(--f-head);
  font-weight: 600;
  font-size: var(--h2);
  line-height: 1.154;
  color: var(--navy);
  letter-spacing: -0.4px;
}

/* ---------- Eyebrow pill ---------- */
.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 40px;
  padding: 0 17px;
  border: 1px solid #DCEBCB;
  border-radius: 20px;
  background: #fff;
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
  color: var(--navy);
}
.eyebrow::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--green);
}
.eyebrow--dark {
  background: rgba(255, 255, 255, .1);
  border-color: rgba(255, 255, 255, .22);
  color: #fff;
}
.eyebrow--mint {
  height: 37px;
  padding: 0 16px;
  border: 0;
  background: var(--mint);
  color: var(--green-dark);
  font-weight: 600;
}
.eyebrow--mint::before { background: var(--green-dark); }

/* ---------- Buttons ---------- */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  height: 46.6px;
  padding: 0 23px;
  border-radius: 8px;
  font-size: 17px;
  font-weight: 600;
  line-height: 24px;
  white-space: nowrap;
  transition: background-color .2s, color .2s, border-color .2s, transform .2s, box-shadow .2s;
}
.btn svg { width: 19px; height: 19px; }
.btn:hover { transform: translateY(-1px); }
.btn--green { background: var(--green); color: var(--navy); }
.btn--green:hover { background: #87BF46; box-shadow: 0 8px 20px rgba(148, 203, 84, .35); }
.btn--navy { background: var(--navy); color: #fff; }
.btn--navy svg { color: var(--green); }
.btn--navy:hover { background: #0A3A66; }
.btn--outline {
  border: 1px solid var(--blue-soft);
  background: rgba(255, 255, 255, .6);
  color: var(--blue);
  font-size: 16px;
  font-weight: 500;
}
.btn--outline svg { width: 18px; height: 18px; }
.btn--outline:hover { background: var(--blue); border-color: var(--blue); color: #fff; }
.btn--ghost {
  height: 57.8px;
  padding: 0 35px;
  border: 1.5px solid rgba(255, 255, 255, .85);
  border-radius: 29px;
  color: #fff;
  font-size: 17px;
  font-weight: 500;
}
.btn--ghost:hover { background: #fff; color: var(--navy); }
.btn--lg { height: 58px; padding: 0 28px; border-radius: 12px; font-size: 17px; }

/* =========================================================
   HEADER
   ========================================================= */
.site-header { position: relative; z-index: 50; }

.topbar {
  background: linear-gradient(90deg, var(--navy) 50%, var(--blue) 50%);
  color: #fff;
}
.topbar__inner {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  max-width: 1600px;
  height: 36px;
  margin-inline: auto;
  padding-left: var(--gutter);
  background: var(--navy);
}
.topbar__reviews {
  display: flex;
  align-items: center;
  gap: 0;
  font-size: 16px;
  line-height: 19px;
}
.topbar__reviews .g-logo { width: 27.5px; height: 27.5px; margin-right: 13.8px; }
.topbar__reviews strong { font-weight: 700; margin-right: 4px; }
.stars { display: inline-flex; gap: 3.4px; color: var(--yellow); margin-right: 9px; }
.stars svg { width: 18.35px; height: 18.35px; }
.topbar__cta {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 412px;
  padding: 0 64px 0 48px;
  background: var(--blue);
  font-size: 17px;
  font-weight: 500;
  line-height: 24px;
  white-space: nowrap;
  transition: background-color .2s;
}
.topbar__cta svg { width: 21px; height: 24px; }
.topbar__cta:hover { background: #0B97CF; }

.navbar { background: #fff; }
.navbar__inner {
  display: flex;
  align-items: center;
  height: 92px;
}
.logo { flex-shrink: 0; margin-top: -2px; }
.logo img { width: 157px; height: 87px; object-fit: contain; }

.nav { margin-left: 92px; margin-right: auto; }
.nav ul { display: flex; align-items: center; gap: 40px; }
.nav li:first-child { margin-right: 10px; }
.nav a {
  display: block;
  padding: 10px;
  border-radius: 6px;
  font-size: 14.5px;
  font-weight: 500;
  line-height: 22px;
  color: var(--navy);
  transition: background-color .2s, color .2s;
}
.nav a:hover { color: var(--green-dark); }
.nav a.is-active { background: #E9F5DE; }
.nav a.is-active:hover { color: var(--navy); }

/* Services dropdown */
.nav .has-sub { position: relative; display: flex; align-items: center; }
.sub-toggle {
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  margin-left: -6px;
  border-radius: 50%;
  color: var(--navy);
  transition: transform .2s, color .2s;
}
.sub-toggle svg { width: 14px; height: 14px; }
/* active state wraps the label and the chevron together */
.nav .has-sub.is-current { padding-right: 6px; border-radius: 6px; background: #E9F5DE; }
.nav .has-sub.is-current > a.is-active { background: transparent; }
.has-sub:hover .sub-toggle,
.has-sub.is-open .sub-toggle { color: var(--green-dark); }
.nav .subnav {
  position: absolute;
  top: calc(100% + 12px);
  left: -12px;
  z-index: 60;
  display: block;
  min-width: 270px;
  padding: 10px;
  border: 1px solid #E3EEDA;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 18px 40px rgba(4, 37, 68, .12);
  opacity: 0;
  visibility: hidden;
  transform: translateY(6px);
  transition: opacity .2s, transform .2s, visibility .2s;
}
/* invisible bridge so the menu stays open while the pointer moves down to it */
.nav .subnav::before { content: ""; position: absolute; left: 0; right: 0; top: -14px; height: 14px; }
.nav .subnav li { margin: 0; }
.nav .subnav a { padding: 10px 14px; border-radius: 10px; white-space: nowrap; }
.nav .subnav a:hover { background: #E9F5DE; color: var(--navy); }
.has-sub:hover .subnav,
.has-sub:focus-within .subnav,
.has-sub.is-open .subnav { opacity: 1; visibility: visible; transform: none; }
.has-sub:hover .sub-toggle svg,
.has-sub.is-open .sub-toggle svg { transform: rotate(180deg); }
.sub-toggle svg { transition: transform .2s; }
.book-pill {
  display: flex;
  align-items: center;
  gap: 0;
  height: 60.5px;
  padding: 0 20px 0 20.7px;
  margin-right: -20px;
  border: 1.5px solid #DFEDD0;
  border-radius: 31px;
  background: #fff;
  box-shadow: 0 6px 18px rgba(4, 37, 68, .04);
  white-space: nowrap;
  transition: border-color .2s, box-shadow .2s;
}
.book-pill:hover { border-color: var(--green); box-shadow: 0 8px 22px rgba(148, 203, 84, .2); }
.book-pill__icon {
  display: grid;
  place-items: center;
  width: 35.3px;
  height: 35.3px;
  margin-right: 12.6px;
  border-radius: 50%;
  background: var(--green);
  color: #fff;
}
.book-pill__icon svg { width: 18px; height: 18px; }
.book-pill__label { font-size: 15px; font-weight: 500; line-height: 21px; color: var(--navy); margin-right: 13px; }
.book-pill__num { font-family: var(--f-body); font-size: 18px; font-weight: 600; line-height: 26px; color: var(--green); letter-spacing: -.2px; }
.nav .book-pill--mobile { display: none; }

.nav-toggle {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 44px;
  height: 44px;
  margin-left: 16px;
  padding: 10px;
  border-radius: 8px;
  background: #E9F5DE;
}
.nav-toggle span { display: block; height: 2px; border-radius: 2px; background: var(--navy); transition: transform .25s, opacity .25s; }
.nav-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.nav-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* =========================================================
   HERO
   ========================================================= */
.hero {
  position: relative;
  overflow: hidden;
  background: #fff;
}
.hero__media {
  position: absolute;
  inset: 0 0 0 auto;
  width: min(880px, calc(100% - var(--gutter) - 655px));
}
.hero__media img {
  position: relative;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: left center;
}
/* Extends the photo's left edge into a soft white fade, as in the design */
.hero__media::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: 100%;
  width: 420px;
  background: url("../images/hero-car.jpg") left top / 369600px 100% no-repeat;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 100%);
          mask-image: linear-gradient(90deg, transparent 0, #000 100%);
}
.hero__inner { position: relative; }
.hero__content {
  max-width: 639px;
  padding: 61px 0 62px;
}
.hero__eyebrow {
  display: inline-flex;
  align-items: center;
  height: 46.2px;
  padding: 0 20px;
  border: 1px solid var(--blue);
  border-radius: 23px;
  background: rgba(255, 255, 255, .7);
  font-size: 18px;
  line-height: 21px;
  letter-spacing: .8px;
  text-transform: uppercase;
  color: var(--blue);
}
.hero__title {
  margin-top: 15px;
  font-family: var(--f-head);
  font-weight: 600;
  font-size: 64px;
  line-height: 67px;
  letter-spacing: -.3px;
  color: var(--navy);
}
.hero__text {
  max-width: 602px;
  margin-top: 19px;
  font-size: 16px;
  line-height: 28px;
  color: var(--text-hero);
}

/* Accident desk card (hero + CTA) */
/* Design: fill #FFF 19%, radius 16.95, 3px inside stroke (horizontal green gradient), drop shadow 0 12.71 29.67 -10.59 #000 14.9% */
.desk-card {
  position: relative;
  margin-top: 35px;
  padding: 26px 28px 22px;
  border-radius: 16.95px;
  background: rgba(255, 255, 255, .19);
  box-shadow: 0 12.71px 29.67px -10.59px rgba(0, 0, 0, .149);
}
/* the stroke fades out toward the sides, so it only shows along the top and bottom edges */
.desk-card::before,
.desk-card::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(90deg, rgba(148, 203, 84, 0), var(--green) 50%, rgba(148, 203, 84, 0));
  pointer-events: none;
}
.desk-card::before { top: 0; }
.desk-card::after { bottom: 0; }
.desk-card__lead { font-size: 15.2px; line-height: 24px; color: var(--navy); }
.desk-card__ctas { display: flex; gap: 12px; margin-top: 18px; }
.desk-card__ctas:first-child { margin-top: 0; }
.desk-card__ctas .btn--green { width: 281.5px; }
.desk-card__ctas .btn--outline { width: 289.5px; }
/* Buttons sized to their labels (custom CTA text) */
.desk-card--auto .desk-card__ctas .btn--green { width: auto; padding: 0 17px; font-size: 16px; }
.desk-card--auto .desk-card__ctas .btn--outline { width: auto; padding: 0 5px; font-size: 15px; }
/* Wider hero card (717px) with two near-equal buttons */
.desk-card--wide { max-width: 717px; }
.desk-card--wide .desk-card__note { letter-spacing: -0.1px; }
.desk-card--wide .desk-card__ctas { display: grid; grid-template-columns: 320.45fr 328.55fr; }
.desk-card--wide .desk-card__ctas .btn { width: auto; }
.desk-card__note { margin-top: 18px; font-size: 10.5px; line-height: 16px; color: var(--navy); }
.desk-card--dark { background: rgba(255, 255, 255, .19); }
.desk-card--dark .desk-card__lead,
.desk-card--dark .desk-card__note { color: #fff; }
.desk-card--dark .btn--outline { background: transparent; border-color: var(--blue); }
.desk-card--dark .btn--outline:hover { background: var(--blue); color: #fff; }

/* =========================================================
   TRUST BAR
   ========================================================= */
.trust-wrap {
  position: relative;
  z-index: 2;
  background: linear-gradient(#fff 0 68px, var(--bg-soft) 68px);
}
.trust {
  display: grid;
  grid-template-columns: 307.25fr 364.25fr 364.25fr 364.25fr;
  padding: 32px 36px;
  border-radius: 24px;
  background: var(--navy);
  box-shadow: 0 30px 60px rgba(4, 37, 68, .14);
  color: #fff;
}
.trust__item {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 16px;
  padding: 0 28px 0 29px;
}
.trust__item:first-child { padding-left: 0; padding-right: 19px; }
.trust__item + .trust__item::before {
  content: "";
  position: absolute;
  left: 0;
  top: 5.5px;
  width: 1px;
  height: 76px;
  background: rgba(255, 255, 255, .22);
}
.trust__icon {
  display: grid;
  place-items: center;
  width: 52px;
  height: 52px;
  border-radius: 12px;
  background: var(--green);
  color: var(--navy);
  flex-shrink: 0;
}
.trust__icon svg { width: 26px; height: 26px; }
.trust h3 { font-size: 16px; font-weight: 600; line-height: 24px; }
.trust p { margin-top: 6px; font-size: 13px; line-height: 19px; color: rgba(255, 255, 255, .9); }

/* =========================================================
   SERVICES
   ========================================================= */
.services {
  padding: 94px 0 96px;
  background: var(--bg-soft);
}
.services__head {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 48px;
}
.services__head > div { max-width: 820px; }
.services__head .h2 { margin-top: 20px; }
.services__intro {
  flex: 0 0 500px;
  font-size: 16px;
  line-height: 27px;
  color: var(--text);
}
.services__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-top: 56px;
}
.service-card {
  min-height: 348px;
  padding: 40px;
  border: 1px solid var(--line);
  border-radius: 24px;
  background: #fff;
  transition: transform .25s, box-shadow .25s, border-color .25s;
}
.service-card:hover { transform: translateY(-4px); box-shadow: 0 22px 44px rgba(4, 37, 68, .08); border-color: #D2E7BC; }
.icon-tile {
  display: grid;
  place-items: center;
  width: 64px;
  height: 64px;
  border-radius: 16px;
  background: #EEF9FD;
  color: var(--green);
}
.icon-tile svg { width: 30px; height: 30px; }
.icon-tile--blue { background: #E3F3FB; }
.service-card h3 {
  margin-top: 20px;
  font-family: var(--f-head);
  font-size: 28px;
  font-weight: 600;
  line-height: 34px;
  color: var(--navy);
}
.service-card p { margin-top: 20px; font-size: 15px; line-height: 25.6px; color: var(--text); }
.service-card--featured {
  border-color: transparent;
  background: var(--grad-blue);
}
.service-card--featured .icon-tile { background: rgba(255, 255, 255, .06); }
.service-card--featured h3 { color: #fff; }
.service-card--featured p { color: #CFE0EC; }
.services__note { margin-top: 56px; font-size: 13px; line-height: 21px; color: var(--text); }
/* Keep the disclaimer on one line (as in the design) by scaling it with the container width */
@media (min-width: 1200px) {
  .services > .container { container-type: inline-size; }
  .services__note { font-size: min(13px, calc(100cqi * 13 / 1472)); white-space: nowrap; }
}

/* =========================================================
   ABOUT
   ========================================================= */
.about {
  padding: 74px 0 96px;
  background: var(--navy);
  color: #fff;
}
.about__inner {
  display: grid;
  grid-template-columns: 579fr 797fr;
  gap: 96px;
  align-items: start;
}
.portrait {
  position: relative;
  aspect-ratio: var(--ratio, 579 / 863);
}
.portrait__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border: 1.5px solid var(--green);
  border-radius: 40px;
}
.portrait__badge-card {
  position: absolute;
  left: 24px;
  bottom: 26px;
  display: flex;
  align-items: center;
  gap: 14px;
  width: max-content;
  min-width: 285px;
  max-width: calc(100% - 48px);
  padding: 16px 22px;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 12px 30px rgba(0, 0, 0, .18);
  color: var(--navy);
}
.portrait__badge-card svg { width: 30px; height: 30px; color: var(--blue); }
.portrait__badge-card strong { display: block; font-size: 16px; font-weight: 600; line-height: 24px; }
.portrait__badge-card span { display: block; margin-top: 2px; font-size: 13px; line-height: 19px; color: var(--text); white-space: nowrap; }
.portrait__cta {
  position: absolute;
  right: -67px;
  bottom: -23px;
  width: 192px;
  border-radius: 50%;
  box-shadow: 0 0 0 6px var(--navy);
  transition: transform .3s;
}
.portrait__cta:hover { transform: rotate(-6deg) scale(1.03); }

.about__bio { padding-top: 16.5px; }
.about__bio .h2 { margin-top: 22px; color: #fff; }
.about__sub {
  margin-top: 22px;
  font-family: var(--f-serif);
  font-style: italic;
  font-weight: 500;
  font-size: 29px;
  line-height: 38px;
  color: var(--green);
}
.about__text { margin-top: 22px; font-size: 15.5px; line-height: 27px; color: rgba(255, 255, 255, .9); }

.features {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 36px;
}
.features li { padding: 25px 0 24px; }
.features svg { width: 26px; height: 26px; color: var(--green); }
.features h3 { margin-top: 10px; font-size: 16.5px; font-weight: 600; line-height: 25px; }
.features p { margin-top: 10px; font-size: 13.5px; line-height: 21px; }
.features--dark { margin-top: 22px; }
.features--dark li { border-top: 1px solid rgba(255, 255, 255, .15); min-height: 183px; }
.features--dark h3 { color: #fff; }
.features--dark p { color: #B9C5D0; }

/* =========================================================
   WHY CHOOSE
   ========================================================= */
.why {
  padding: 104px 0 89px;
  background: var(--green-bg);
}
.why__inner {
  display: grid;
  grid-template-columns: 870fr 577fr;
  gap: 25px;
  align-items: end;
}
.why__main .h2 { max-width: 832px; }
.why__card {
  margin-top: 49px;
  padding: 0 37.5px;
  border-radius: 24px;
  background: var(--green-card);
}
.why__card li { padding: 24px 0; min-height: 183px; border-bottom: 1px solid #CBDDB6; }
.why__card svg { color: var(--navy); }
.why__card h3 { color: var(--navy); }
.why__card p { color: var(--text); }
/* first row carries the card's top padding, last row its bottom padding (any number of rows) */
.why__card li:nth-child(-n+2) { padding-top: 48px; min-height: 206px; }
.why__card li:nth-last-child(-n+2) { padding-bottom: 48px; min-height: 207px; border-bottom: 0; }
.why__media {
  position: relative;
  border-radius: 32px;
  overflow: hidden;
  aspect-ratio: var(--ratio, 577 / 739);
}
.why__media img { width: 100%; height: 100%; object-fit: cover; }
.why__media .btn { position: absolute; right: 27px; bottom: 31px; width: 281.5px; }

/* =========================================================
   TESTIMONIALS
   ========================================================= */
/* Desktop: the whole box scales as one unit with its width (Figma 1472px box),
   so cards, copy and line breaks keep the design proportions. --u = 1 design px. */
.reviews-wrap { background: linear-gradient(var(--green-bg) 0 115px, #fff 115px); }
.reviews-wrap .container { container-type: inline-size; }
.reviews-wrap .container > * { --u: calc(100cqi / 1472); }
.reviews {
  position: relative;
  display: grid;
  grid-template-columns: calc(534 * var(--u)) 1fr;
  min-height: calc(521 * var(--u));
  padding: calc(60 * var(--u)) calc(40 * var(--u));
  border-radius: calc(40 * var(--u));
  background: var(--navy-2);
  box-shadow: 0 30px 60px rgba(4, 37, 68, .08);
  color: #fff;
}
.reviews__intro { position: relative; max-width: calc(428 * var(--u)); }
.reviews__intro .h2 { color: #fff; font-size: calc(52 * var(--u)); line-height: calc(60 * var(--u)); }
.reviews__rating {
  display: inline-flex;
  align-items: center;
  margin-top: calc(12 * var(--u));
  font-size: calc(16 * var(--u));
  line-height: calc(19 * var(--u));
}
.reviews__rating .g-logo { width: calc(27.5 * var(--u)); height: calc(27.5 * var(--u)); margin-right: calc(13.8 * var(--u)); }
.reviews__rating strong { font-weight: 700; margin-right: calc(4 * var(--u)); }
.reviews__rating .stars { gap: calc(3.4 * var(--u)); margin-right: calc(9 * var(--u)); }
.reviews__rating .stars svg { width: calc(18.35 * var(--u)); height: calc(18.35 * var(--u)); }
.reviews__nav { display: flex; align-items: center; gap: calc(27 * var(--u)); margin-top: calc(38 * var(--u)); }
.round-btn {
  display: grid;
  place-items: center;
  width: calc(53.3 * var(--u));
  height: calc(53.3 * var(--u));
  border-radius: 50%;
  background: rgba(255, 255, 255, .1);
  color: #fff;
  transition: background-color .2s, color .2s;
}
.round-btn svg { width: calc(22 * var(--u)); height: calc(22 * var(--u)); }
.round-btn:hover { background: var(--green); color: var(--navy); }
.dots { display: flex; align-items: center; gap: calc(9 * var(--u)); }
.dots button {
  width: calc(8.9 * var(--u));
  height: calc(8.9 * var(--u));
  border-radius: 5px;
  background: rgba(255, 255, 255, .35);
  transition: width .25s, background-color .25s;
}
.dots button.is-active { width: calc(26.7 * var(--u)); background: #fff; }
.reviews__intro .btn--ghost {
  margin-top: calc(43 * var(--u));
  width: calc(289 * var(--u));
  height: calc(57.8 * var(--u));
  padding: 0;
  border-radius: calc(29 * var(--u));
  font-size: calc(17 * var(--u));
}
.reviews__disclaimer { margin-top: calc(30 * var(--u)); font-size: calc(13 * var(--u)); line-height: calc(20 * var(--u)); color: var(--muted); }
.reviews__seal {
  position: absolute;
  left: calc(348 * var(--u));
  top: calc(183 * var(--u));
  display: grid;
  place-items: center;
  width: calc(154 * var(--u));
  height: calc(154 * var(--u));
  border-radius: 50%;
  background: rgba(255, 255, 255, .14);
}
.reviews__seal span {
  display: grid;
  place-items: center;
  width: calc(124 * var(--u));
  height: calc(124 * var(--u));
  border-radius: 50%;
  background: #fff;
}
.reviews__seal img { width: calc(111 * var(--u)); height: calc(61 * var(--u)); object-fit: contain; }

.reviews__track { position: relative; display: flex; gap: 18px; align-items: flex-start; }
.review {
  position: relative;
  flex: 0 0 405px;
  padding: calc(41 * var(--u)) calc(41 * var(--u)) calc(26 * var(--u));
  border-radius: calc(30 * var(--u));
  background: #fff;
  color: var(--navy);
  box-shadow: 0 20px 40px rgba(0, 0, 0, .18);
}
.review--b { background: var(--green-bg); }
.review__top { display: flex; justify-content: space-between; align-items: center; }
.review__stars { display: inline-flex; gap: calc(4.1 * var(--u)); color: #F2A93B; }
.review__stars svg { width: calc(16.8 * var(--u)); height: calc(16.8 * var(--u)); }
.review .g-logo { width: calc(27.5 * var(--u)); height: calc(27.5 * var(--u)); margin-top: calc(-12 * var(--u)); }
.review blockquote {
  position: relative;
  margin-top: calc(22 * var(--u));
  font-style: italic;
  font-size: calc(16 * var(--u));
  line-height: calc(26 * var(--u));
  color: #001D47;
}
.review blockquote::before {
  content: "\201C";
  position: absolute;
  left: calc(-14 * var(--u));
  top: calc(-42 * var(--u));
  font-family: var(--f-serif);
  font-style: normal;
  font-size: calc(110 * var(--u));
  line-height: 1;
  color: rgba(4, 37, 68, .08);
  pointer-events: none;
}
.review__author {
  display: flex;
  align-items: center;
  gap: calc(12 * var(--u));
  margin-top: calc(26 * var(--u));
  padding-top: calc(18 * var(--u));
  border-top: 1px solid rgba(4, 37, 68, .1);
}
.review__author strong { display: block; font-size: calc(17 * var(--u)); font-weight: 600; line-height: calc(28 * var(--u)); color: #261A35; }
.review__author div span { display: block; font-size: calc(15 * var(--u)); line-height: calc(26 * var(--u)); color: #5B5563; }
.avatar {
  display: grid;
  place-items: center;
  width: calc(56 * var(--u));
  height: calc(56 * var(--u));
  border-radius: 50%;
  font-size: calc(28 * var(--u));
  line-height: 1;
  color: #fff;
  flex-shrink: 0;
}
.avatar--b { background: #F4511E; }
.avatar--l { background: #689F38; }
.verified {
  display: inline-flex;
  align-items: center;
  gap: calc(4 * var(--u));
  margin-left: auto;
  align-self: flex-start;
  margin-top: calc(6 * var(--u));
  font-size: calc(13 * var(--u));
  line-height: calc(20 * var(--u));
  color: #5B5563;
}
.verified svg { width: calc(16.5 * var(--u)); height: calc(16.5 * var(--u)); color: #4FB6DA; }

/* Desktop card placement, measured from the Figma frame (relative to the box) */
@media (min-width: 1280px) {
  .reviews__track { position: absolute; inset: 0; display: block; pointer-events: none; }
  .review {
    position: absolute;
    pointer-events: auto;
    transition: left .6s cubic-bezier(.65, 0, .35, 1), top .6s cubic-bezier(.65, 0, .35, 1), width .6s, transform .6s cubic-bezier(.65, 0, .35, 1);
  }
  /* Slot 1 (front/left) and slot 2 (right); the slider moves cards between slots */
  .review.is-pos-1 { z-index: 2; left: calc(598 * var(--u)); top: calc(62 * var(--u)); width: calc(408 * var(--u)); transform: rotate(-2deg); }
  .review.is-pos-2 { z-index: 1; left: calc(1023 * var(--u)); top: calc(46 * var(--u)); width: calc(401 * var(--u)); min-height: calc(382 * var(--u)); padding-inline: calc(36 * var(--u)); transform: rotate(2.5deg); }
  .review.is-pos-1 blockquote { max-width: calc(292 * var(--u)); }
  .review.is-moving.is-pos-2 { transform: rotate(2.5deg) scale(.96); }
}

/* =========================================================
   FAQ
   ========================================================= */
.faq { padding: 73px 0; background: #fff; }
.faq__inner {
  display: grid;
  grid-template-columns: 460fr 924fr;
  gap: 88px;
  align-items: start;
}
.faq__side .h2 { margin-top: 20px; }
.help-card {
  position: relative;
  overflow: hidden;
  margin-top: 36px;
  padding: 36px;
  border-radius: 32px;
  background: var(--grad-blue);
  color: #fff;
}
.help-card::before {
  content: "";
  position: absolute;
  left: 247px;
  top: -119px;
  width: 260px;
  height: 260px;
  border-radius: 50%;
  background: rgba(16, 140, 210, .45);
}
.help-card > * { position: relative; }
.help-card__icon {
  display: grid;
  place-items: center;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: var(--green);
  color: var(--navy);
}
.help-card__icon svg { width: 26px; height: 26px; }
.help-card h3 {
  margin-top: 18px;
  font-family: var(--f-serif);
  font-weight: 400;
  font-size: 31px;
  line-height: 38px;
}
.help-card p { margin-top: 18px; font-size: 15px; line-height: 25px; color: #CFE0EC; }
.help-card .btn { margin-top: 18px; width: 239px; }

.accordion { display: grid; gap: 14px; }
.acc-item {
  border: 1px solid #E7E7E7;
  border-radius: 20px;
  background: #fff;
  transition: border-color .25s, box-shadow .25s;
}
.acc-item.is-open { border-color: #76AF48; box-shadow: 0 18px 30px rgba(4, 37, 68, .05); }
.acc-item__q {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  width: 100%;
  padding: 26px 30px;
  text-align: left;
  font-size: 18px;
  font-weight: 600;
  line-height: 26px;
  color: #101010;
}
.acc-item__q:hover { color: var(--green-dark); }
.acc-item__icon {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: var(--mint);
  color: var(--green-dark);
  flex-shrink: 0;
  transition: background-color .25s, color .25s;
}
.acc-item__icon svg { width: 18px; height: 18px; grid-area: 1 / 1; }
.acc-item__icon .i-minus { display: none; }
.acc-item.is-open .acc-item__icon { background: var(--green-dark); color: #fff; }
.acc-item.is-open .i-plus { display: none; }
.acc-item.is-open .i-minus { display: block; }
.acc-item__a { padding: 0 129px 27px 31px; margin-top: -12px; }
.acc-item__a p { font-size: 16px; line-height: 27px; color: #636363; }
.acc-item__a a { color: var(--green-dark); font-weight: 500; }

/* =========================================================
   CTA
   ========================================================= */
.cta {
  display: grid;
  grid-template-columns: 756fr 844fr;
  min-height: 606px;
  background: var(--navy);
  color: #fff;
}
.cta__media { position: relative; }
.cta__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 30% center; }
.cta__content { max-width: 844px; padding: 68px var(--gutter) 68px 72px; }
.cta__content .h2 { color: #fff; }
.cta__text { max-width: 677px; margin-top: 17px; font-size: 16px; line-height: 27px; color: rgba(255, 255, 255, .85); }
.cta .desk-card { max-width: 639px; margin-top: 42px; }

/* =========================================================
   LOCATION
   ========================================================= */
.location { padding: 120px 0 84px; background: var(--green-bg); }
.location__inner {
  display: grid;
  grid-template-columns: 788fr 620fr;
  gap: 64px;
  align-items: end;
}
.address-card {
  display: flex;
  align-items: center;
  gap: 20px;
  min-height: 116px;
  padding: 28px;
  border-radius: 24px;
  background: #E9F4DB;
  transition: box-shadow .25s;
}
.address-card:hover { box-shadow: 0 12px 28px rgba(4, 37, 68, .06); }
.address-card__icon {
  display: grid;
  place-items: center;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background: var(--green-dark);
  color: var(--navy);
  flex-shrink: 0;
}
.address-card__icon svg { width: 26px; height: 26px; }
.address-card strong { display: block; font-size: 20px; font-weight: 600; line-height: 30px; color: var(--navy); }
.address-card strong + span { display: block; margin-top: 4px; font-size: 16px; line-height: 25px; color: var(--navy); }

.hours-card {
  position: relative;
  margin-top: 32px;
  min-height: 437px;
  padding: 28px;
  border-radius: 24px;
  background: #E9F4DB;
}
.hours-card h3 {
  display: flex;
  align-items: center;
  gap: 14px;
  font-size: 18px;
  font-weight: 600;
  line-height: 27px;
}
.hours-card h3 svg { width: 24px; height: 24px; color: var(--green-dark); }
.hours { margin-top: 16px; display: grid; gap: 16px; }
.hours > div { display: flex; align-items: center; min-height: 43px; }
.hours dt { flex: 0 0 173px; font-size: 15px; font-weight: 600; line-height: 23px; color: var(--navy); }
.hours dd { display: flex; gap: 24px; font-size: 15px; line-height: 22px; color: #333630; }
.hours dd.is-closed { color: var(--yellow); padding-left: 7px; }
.hours-card__badge {
  position: absolute;
  left: 488px;
  top: 149px;
  width: 250px;
  border-radius: 50%;
  transition: transform .3s;
}
.hours-card__badge:hover { transform: rotate(-6deg) scale(1.03); }

.map {
  display: block;
  overflow: hidden;
  border-radius: 32px;
  aspect-ratio: 620 / 547;
}
.map iframe { display: block; width: 100%; height: 100%; border: 0; }

/* =========================================================
   FOOTER
   ========================================================= */
/* Desktop: scales with the container (Figma 1472px content width); --u = 1 design px */
.site-footer { background: #fff; container-type: inline-size; }
.footer__inner, .footer__bar-inner { --u: calc((min(100cqi, 1600px) - 2 * var(--gutter)) / 1472); }
.footer__inner {
  display: grid;
  grid-template-columns: calc(406 * var(--u)) calc(231 * var(--u)) calc(295 * var(--u)) calc(255 * var(--u)) 1fr;
  /* equal visible space above the column headings and below the last list line */
  padding-top: calc(81 * var(--u));
  padding-bottom: calc(75 * var(--u));
}
.footer__brand { align-self: center; width: calc(275 * var(--u)); margin: 0 0 0 calc(-4 * var(--u)); }
.footer__brand img { width: calc(195 * var(--u)); height: auto; margin-inline: auto; }
.footer__name {
  margin-top: calc(24 * var(--u));
  text-align: center;
  font-family: var(--f-serif);
  font-weight: 700;
  font-size: calc(24 * var(--u));
  line-height: calc(32 * var(--u));
  color: var(--green-dark);
}
.footer__brand p:last-child { margin-top: calc(10 * var(--u)); font-size: calc(16 * var(--u)); line-height: calc(22 * var(--u)); color: var(--navy); text-align: center; }
.footer__col h3 {
  font-family: var(--f-serif);
  font-weight: 700;
  font-size: calc(22.5 * var(--u));
  line-height: calc(32 * var(--u));
  color: var(--green-dark);
  white-space: nowrap;
}
.footer__col ul { margin-top: calc(19 * var(--u)); font-size: calc(16 * var(--u)); line-height: calc(36 * var(--u)); color: var(--navy); }
.footer__links a { transition: color .2s; }
.footer__links a:hover { color: var(--green-dark); }
.footer__contact {
  display: flex;
  flex-direction: column;
  align-items: center;
  align-self: center;
  width: calc(264 * var(--u));
}
.chat-btn {
  display: grid;
  place-items: center;
  width: calc(105 * var(--u));
  height: calc(105 * var(--u));
  border-radius: 50%;
  background: var(--green-dark);
  color: #fff;
  transition: transform .25s, box-shadow .25s;
}
.chat-btn svg { width: calc(45 * var(--u)); height: calc(45 * var(--u)); }
.chat-btn:hover { transform: scale(1.05); box-shadow: 0 12px 28px rgba(117, 173, 72, .4); }
.footer__contact .btn {
  width: calc(264 * var(--u));
  height: calc(46.6 * var(--u));
  margin-top: calc(67 * var(--u));
  padding: 0;
  font-size: calc(16 * var(--u));
}
.footer__contact .btn svg { width: calc(18 * var(--u)); height: calc(18 * var(--u)); }
.btn--light { background: #F5FBFE; border-color: var(--blue); }

.footer__bar { background: var(--navy-2); }
.footer__bar-inner {
  display: flex;
  align-items: center;
  min-height: calc(124 * var(--u));
  padding-block: calc(29 * var(--u));
  font-size: calc(13.5 * var(--u));
  line-height: calc(22 * var(--u));
  color: var(--muted);
}
.footer__legal { flex: 0 0 calc(806 * var(--u)); }
.footer__copy { margin-left: calc(68 * var(--u)); white-space: nowrap; }
.footer__powered { margin-left: auto; text-decoration: underline; white-space: nowrap; transition: color .2s; }
.footer__powered:hover { color: #fff; }

/* =========================================================
   INNER PAGES
   ========================================================= */

/* Page hero: full-width photo, copy vertically centred (About: 1600 x 736) */
.page-hero {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 736px;
  overflow: hidden;
  background: #fff;
}
.page-hero__media { position: absolute; inset: 0; }
.page-hero__media img { width: 100%; height: 100%; object-fit: cover; }
.page-hero__inner { position: relative; }
.page-hero__content { max-width: 640px; padding: 40px 0; }
.page-hero__sub { margin-top: 25px; font-size: 16px; line-height: 28px; color: var(--navy); }
.page-hero__btn { margin-top: 50px; width: 281.5px; box-shadow: 0 14px 28px rgba(148, 203, 84, .35); }
.page-hero--lead .page-hero__sub { max-width: 623px; }
.page-hero--lead .page-hero__btn { margin-top: 33px; }

/* Photo + text (About: practice section) */
.media-text { padding: 85px 0; background: var(--bg-soft); }
.media-text__inner {
  display: grid;
  grid-template-columns: 674fr 726fr;
  gap: 72px;
  align-items: center;
}
.media-text--reverse .media-text__media { order: 2; }
.media-text__media { overflow: hidden; border-radius: 20px; aspect-ratio: var(--ratio, 674 / 656); }
.media-text__media img { width: 100%; height: 100%; object-fit: cover; }
.media-text__body .h2 { margin-top: 20px; }
.media-text__text { margin-top: 30px; }
.media-text__text p { font-size: 16px; line-height: 27px; color: var(--text); }
.media-text__text p + p { margin-top: 27px; }

/* Doctor bio variant used on inner pages (no eyebrow, tighter bottom) */
.about--compact { padding-bottom: 75px; }
.about--compact .about__bio { padding-top: 12.5px; }
.about__bio > .h2:first-child { margin-top: 0; }

/* Feature split with intro copy and no button (About: approach) */
.why--approach { padding: 99px 0 98px; }
.why--approach .why__inner { align-items: start; }
.why__intro { margin-top: 12px; }
.why__intro p { font-size: 16px; line-height: 27px; color: var(--text); }
.why__intro p + p { margin-top: 27px; }
.why__intro + .why__card { margin-top: 30px; }
.why--approach .why__card li:nth-child(-n+2) { padding-top: 45px; min-height: 203px; }
.why--approach .why__card li:nth-last-child(-n+2) { padding-bottom: 45px; min-height: 204px; }

/* Contact info cards (About: location) */
.contact-cards { padding: 75px 0; background: #fff; }
.contact-cards__inner { max-width: calc(1224px + 2 * var(--gutter)); }
.contact-cards__head { max-width: 974px; margin-inline: auto; text-align: center; }
.contact-cards__head .h2 { margin-top: 20px; color: #101010; }
.contact-cards__head p,
.contact-cards__outro { margin-top: 20px; font-size: 16px; line-height: 27px; color: var(--text); }
.contact-cards__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin-top: 44px;
}
.contact-cards__outro { max-width: 974px; margin: 61px auto 0; text-align: center; }
.info-card {
  display: flex;
  align-items: center;
  gap: 20px;
  min-height: 140px;
  padding: 28px 16px 28px 28px;
  border-radius: 24px;
  color: var(--navy);
  transition: box-shadow .25s, transform .25s;
}
a.info-card:hover { transform: translateY(-2px); box-shadow: 0 14px 30px rgba(4, 37, 68, .07); }
.info-card--green { background: #E9F4DB; }
.info-card--blue { background: var(--bg-soft); }
.info-card__icon {
  display: grid;
  place-items: center;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  color: var(--navy);
  flex-shrink: 0;
}
.info-card--green .info-card__icon { background: var(--green-dark); }
.info-card--blue .info-card__icon { background: var(--blue); }
.info-card__icon svg { width: 26px; height: 26px; }
.info-card__body strong { display: block; font-size: 20px; font-weight: 600; line-height: 30px; }
.info-card__body > span { display: block; margin-top: 4px; font-size: 15.5px; line-height: 25px; }
/* =========================================================
   SERVICES PAGE
   ========================================================= */

/* Grid-only service cards: 3 on the first row, 2 wide on the second */
.services--compact { padding: 65px 0 62px; }
.services--compact .services__grid { margin-top: 0; grid-template-columns: repeat(6, 1fr); }
.services--compact .service-card { grid-column: span 2; min-height: 271px; }
.services--compact .service-card:nth-child(n+4) { grid-column: span 3; }
.services--compact .service-card p { font-size: 15px; line-height: 25.5px; }
.services--compact .services__note { max-width: 1031px; margin: 51px auto 0; text-align: center; font-size: 16px; line-height: 27px; white-space: normal; }

/* Tag eyebrows: tinted to the section they sit on */
.eyebrow--tag {
  height: 37px;
  padding: 0 16px;
  border: 0;
  background: #E9F8F3;
  color: var(--green-dark);
  font-weight: 600;
  white-space: pre;
}
.eyebrow--tag::before { background: var(--green-dark); }
.service-detail--green .eyebrow--tag,
.appointment .eyebrow--tag { background: #DDF2DF; }
.service-detail--soft .eyebrow--tag { background: #DDEFF9; color: var(--blue); }
.service-detail--soft .eyebrow--tag::before { background: var(--blue); }
.service-detail--navy .eyebrow--tag { background: rgba(255, 255, 255, .1); color: #fff; }
.service-detail--navy .eyebrow--tag::before { background: #fff; }

/* Service section: photo + copy, optional centered note below */
.service-detail { padding: var(--pad, 75px 0); }
.service-detail--white { background: #fff; }
.service-detail--green { background: var(--green-bg); }
.service-detail--soft { background: var(--bg-soft); }
.service-detail--navy { background: var(--navy); }
.service-detail__inner {
  display: grid;
  grid-template-columns: var(--media) var(--body, 797fr);
  column-gap: var(--gap);
  align-items: center;
}
.service-detail--reverse .service-detail__inner { grid-template-columns: var(--body, 797fr) var(--media); }
.service-detail--reverse .service-detail__media { order: 2; }
.service-detail__media { overflow: hidden; border-radius: 32px; aspect-ratio: var(--ratio); }
.service-detail__media img { width: 100%; height: 100%; object-fit: cover; }
.service-detail__body .h2 { margin-top: 20px; }
.service-detail__text { margin-top: 22px; font-size: 15.5px; line-height: 27px; letter-spacing: -0.1px; color: var(--text); }
.service-detail__subhead {
  margin-top: 22px;
  font-family: var(--f-head);
  font-size: 25px;
  font-weight: 600;
  line-height: 27px;
  color: var(--navy);
}
.service-detail__features { margin-top: 22px; }
.service-detail__features li { padding: 25px 0 24px; border-top: 1px solid rgba(4, 37, 68, .12); }
.service-detail__features h3 { color: var(--navy); }
.service-detail__features p { color: var(--text); }
.service-detail--soft .service-detail__features svg,
.service-detail--soft .ficon { color: var(--blue); }
.service-detail--navy .h2,
.service-detail--navy .service-detail__subhead,
.service-detail--navy .service-detail__features h3 { color: #fff; }
.service-detail--navy .service-detail__text { color: rgba(255, 255, 255, .66); }
.service-detail--navy .service-detail__features li { border-top-color: rgba(255, 255, 255, .15); }
.service-detail--navy .service-detail__features p { color: rgba(255, 255, 255, .66); }

/* Mask icon (from assets/images/icons) that takes the text colour like the SVG icons */
.ficon {
  display: block;
  width: 26px;
  height: 26px;
  color: var(--green);
  background: currentColor;
  -webkit-mask: var(--icon) center / 30px 30px no-repeat;
          mask: var(--icon) center / 30px 30px no-repeat;
}

.bullets { margin-top: 22px; }
.bullets li { position: relative; padding-left: 11px; font-size: 15.5px; line-height: 27px; color: var(--text); }
.bullets li::before { content: "\2022"; position: absolute; left: 0; }

.service-note { margin-top: 75px; text-align: center; }
/* Copy a little taller than the photo (Whiplash): copy starts 4px lower, note keeps 75px below the photo */
.service-detail--tall-copy .service-detail__body { padding-top: 4px; }
.service-detail--tall-copy .service-note { margin-top: 54px; }
.service-note__text { max-width: 1300px; margin: 25px auto 0; }
.service-note__text p { font-size: 15.5px; line-height: 27px; color: var(--text); }
.service-note__text p + p { margin-top: 27px; }
.service-note__btn { margin-top: 50px; padding: 0 17px; font-size: 16px; }

/* Blue help banners */
.banner-row { padding: var(--pad, 0 0 75px); background: #fff; }
.help-banner {
  position: relative;
  overflow: hidden;
  padding: 36px;
  border-radius: 32px;
  background: var(--grad-blue);
  color: #fff;
  text-align: center;
}
.help-banner::before {
  content: "";
  position: absolute;
  left: 247px;
  top: -119px;
  width: 260px;
  height: 260px;
  border-radius: 50%;
  background: rgba(16, 140, 210, .45);
}
.help-banner > * { position: relative; }
.help-banner__icon {
  display: grid;
  place-items: center;
  width: 56px;
  height: 56px;
  margin: 0 auto;
  border-radius: 50%;
  background: var(--green);
  color: #fff;
}
.help-banner__icon svg { width: 26px; height: 26px; }
.help-banner h3 { margin-top: 18px; font-family: var(--f-serif); font-weight: 400; font-size: 31px; line-height: 38px; }
.help-banner__icon + h3 { margin-top: 18px; }
.help-banner > h3:first-child { margin-top: 0; }
.help-banner__text { margin-top: 18px; }
.help-banner__text p { font-size: 16px; line-height: 25px; color: rgba(255, 255, 255, .75); }
.help-banner__text p + p { margin-top: 25px; }
.help-banner__notes { margin-top: 18px; }
.help-banner__notes p { font-size: 13px; line-height: 25px; color: rgba(255, 255, 255, .75); }
.help-banner__notes--spaced p + p { margin-top: 25px; }
.help-banner .btn { margin-top: 18px; padding: 0 17px; font-size: 16px; }
.help-banner--narrow h3 { max-width: 420px; margin-inline: auto; }

/* Disc symptoms card + narrow banner */
.symptoms-row { padding: 0 0 75px; background: #fff; }
.symptoms-row__inner { display: grid; grid-template-columns: 822fr 609fr; column-gap: 2.85%; }
.symptoms-card {
  padding: 36px 41px;
  border: 1px solid #B6DB8B;
  border-radius: 24px;
  background: var(--green-bg);
}
.symptoms-card .h2 { max-width: 460px; }
.symptoms-card .bullets { margin-top: 20px; }
.symptoms-card > p { margin-top: 20px; font-size: 15.5px; line-height: 27px; color: var(--text); }

/* Doctor bio on Services (shorter portrait) */
.about--provider { padding: 74px 0 78px; }
.about--provider .about__bio { padding-top: 22.5px; }
.about--provider .portrait__cta { bottom: -38px; }

/* Centered FAQ */
.faq--centered { padding: 75px 0; }
.faq--centered .faq__inner { grid-template-columns: 1fr; gap: 50px; }
.faq--centered .faq__side { text-align: center; }
.faq--centered .faq__side .h2 { max-width: 1092px; margin: 20px auto 0; color: #101010; }
.faq--centered .accordion { width: 100%; max-width: 1224px; margin-inline: auto; }
.faq--centered .acc-item__a { padding-right: 104px; }

/* Appointment request */
.appointment { padding: 92px 0 91px; background: var(--green-bg); }
.appointment__inner { display: grid; grid-template-columns: 746fr 700fr; column-gap: 1.56%; align-items: start; }
.appointment__info { padding-top: 10px; }
.appointment__info .h2 { max-width: 600px; }
.appointment__text { margin-top: 22px; }
.appointment__text p { font-size: 15.5px; line-height: 27px; color: var(--text); }
.appointment__text p + p { margin-top: 27px; }
.appointment .eyebrow--tag { margin-top: 45px; }
.appointment__office { margin-top: 22px; font-size: 16px; line-height: 27px; color: var(--text); }
.appointment__contact { margin-top: 45px; }
.appointment__contact li { display: flex; align-items: center; gap: 20px; color: var(--navy); }
.appointment__contact li + li { margin-top: 60px; }
.appointment__contact .info-card__icon { background: var(--green-dark); }
.appointment__contact strong { display: block; font-size: 20px; font-weight: 600; line-height: 30px; }
.appointment__contact li > span:last-child { font-size: 15.5px; line-height: 25px; }
.appointment__contact a { display: block; margin-top: 4px; }
.appointment__contact a:hover { color: var(--green-dark); }

.appt-form {
  padding: 40px;
  border: 1.5px solid #A9D178;
  border-radius: 24px;
  background: #fff;
  box-shadow: 0 20px 40px rgba(4, 37, 68, .06);
}
.appt-form__hp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.appt-form__status { margin-bottom: 20px; padding: 12px 16px; border-radius: 10px; font-size: 14px; line-height: 22px; }
.appt-form__status--ok { background: #E9F4DB; color: #2F5D16; }
.appt-form__status--err { background: #FDECEC; color: #9B1C1C; }
.appt-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.appt-form > .field,
.appt-form > .appt-form__row ~ .appt-form__row,
.appt-form__row + .field { margin-top: 25px; }
.field { display: block; }
.field[hidden] { display: none; }
.field__label { display: block; font-size: 13px; font-weight: 500; line-height: 20px; color: var(--navy); }
.field__label i { font-style: normal; color: #F37171; }
.field input,
.field select,
.field textarea {
  display: block;
  width: 100%;
  height: 44px;
  margin-top: 6px;
  padding: 0 14px;
  border: 0;
  border-bottom: 1px solid #E7EDF3;
  border-radius: 8px;
  background: #fff;
  font: 400 14px/20px var(--f-body);
  color: var(--navy);
  transition: border-color .2s, box-shadow .2s;
}
.field textarea { height: 120px; padding: 12px 14px; resize: vertical; }
.field input::placeholder,
.field textarea::placeholder { color: #66778A; }
.field input:focus,
.field select:focus,
.field textarea:focus { outline: none; border-bottom-color: var(--green); box-shadow: 0 8px 18px rgba(148, 203, 84, .14); }
.field--select select {
  appearance: none;
  -webkit-appearance: none;
  padding-right: 40px;
  color: #66778A;
  cursor: pointer;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='10' viewBox='0 0 12 10'%3E%3Cpath fill='%2375AD48' d='M6 10 0 0h12z'/%3E%3C/svg%3E") right 14px center / 12px 10px no-repeat;
}
.appt-form__submit { display: flex; width: fit-content; min-width: 271.6px; margin: 25px auto 0; padding: 0 17px; font-size: 16px; box-shadow: 0 14px 28px rgba(148, 203, 84, .3); }
.appt-form__note { margin-top: 25px; text-align: center; font-size: 13px; line-height: 27px; color: var(--text); }
/* =========================================================
   DISC INJURY PAGE (and other condition pages)
   ========================================================= */

/* Hero with paragraphs + accident card instead of a subtitle */
.page-hero--wide .page-hero__content { max-width: 746px; }
.page-hero--wide .hero__title { max-width: 675px; }
.page-hero__content > .hero__title:first-child { margin-top: 0; }
.page-hero__text { margin-top: 10px; }
.page-hero__text p { font-size: 16px; line-height: 28px; color: #2A3D4F; }
.page-hero__text p + p { margin-top: 28px; }
.page-hero .desk-card { margin-top: 30px; }

/* Highlight cards + form band */
.intake { padding: var(--pad, 85px 0); background: var(--green-bg); }
.intake__inner {
  display: grid;
  grid-template-columns: 650fr 700fr;
  column-gap: 67px;
  align-items: center;
  max-width: 1417px;
  margin-inline: auto;
}
.intake__cards { display: grid; gap: 40px; }
.intake-card {
  min-height: 177px;
  padding: 32px 15px;
  border: 1px solid #A3CB7E;
  border-radius: 24px;
  background: #EAF4DB;
}
.intake-card svg { width: 26px; height: 26px; color: var(--navy); }
.intake-card h3 { margin-top: 10px; font-size: 16.5px; font-weight: 600; line-height: 25px; color: var(--navy); }
.intake-card p { margin-top: 10px; font-size: 13.5px; line-height: 21px; color: var(--text); }
.appt-form--disc .field textarea,
.appt-form--whiplash .field textarea { height: 82px; }
/* Whiplash form: 32px between rows (design) */
.appt-form--whiplash > .field,
.appt-form--whiplash > .appt-form__row ~ .appt-form__row,
.appt-form--whiplash .appt-form__row + .field,
.appt-form--whiplash .appt-form__submit,
.appt-form--whiplash .appt-form__note { margin-top: 32px; }
.appt-form--whiplash .appt-form__note { line-height: 27px; }

/* Eyebrow + lead-in line above a bullet list */
.service-detail__list-eyebrow { margin-top: 22px; }
.service-detail .service-detail__list-intro + .bullets { margin-top: 0; }
.service-detail--navy .service-detail__body .eyebrow {
  background: rgba(255, 255, 255, .1);
  border-color: rgba(255, 255, 255, .22);
  color: #fff;
}
.service-detail--navy .bullets li { color: rgba(255, 255, 255, .66); }
.field--date input { color: #66778A; }

/* service-detail extras */
.service-detail--framed .service-detail__media { border: 1.5px solid var(--green); border-radius: 32px; }
.service-detail--tight .h2 + .service-detail__text { margin-top: 15px; }
.service-detail--sans-sub .service-detail__subhead { font-family: var(--f-body); font-size: 20px; font-weight: 600; line-height: 27px; }
.service-detail__body > .h2:first-child { margin-top: 0; }
.service-detail__after { margin-top: 40px; }
.service-detail__after .service-detail__text { margin-top: 18px; }
.service-detail__after .service-detail__text + .service-detail__text { margin-top: 27px; }
.service-detail--tight .service-detail__text + .bullets { margin-top: 27px; }
/* Divider spans the container; the small print is centered in the middle 1224px */
.service-detail__footnote {
  margin-top: 50px;
  padding: 50px 8.42% 0;
  border-top: 1px solid #C2C2C2;
  text-align: center;
  font-size: 15.5px;
  line-height: 27px;
  color: var(--text);
}

/* Short doctor bio (Disc Injury provider) */
.about--short { padding: 71px 0 72px; }
.about--short .about__inner { align-items: center; }
.about--short .about__bio { padding-top: 0; }
.about--short .portrait__cta { bottom: -40px; }
/* =========================================================
   CONTACT PAGE
   ========================================================= */
.appointment--contact { padding: 92px 0 70px; }
.appointment--contact .appointment__info { padding-top: 7px; }
.appointment--contact .appointment__info .h2 { max-width: none; }
.appointment--contact .eyebrow--tag { margin-top: 40px; }
.appointment--contact .appointment__contact { margin-top: 40px; }
.appointment--contact .appointment__contact li + li { margin-top: 35px; }
.appointment__contact-text { display: block; margin-top: 4px; }
.appt-form--contact .field textarea { height: 75px; }
.appt-form--contact .appt-form__note { margin-inline: -17px; line-height: 27px; }

.directions { padding: 0 0 77px; background: var(--green-bg); }
.directions__note { max-width: 1224px; margin: 0 auto; text-align: center; font-size: 15.5px; line-height: 27px; color: var(--text); }
.directions__body { margin-top: 50px; padding-top: 50px; border-top: 1px solid #C2C8BC; text-align: center; }
.directions__body .h2 { color: #101010; }
.directions__text { max-width: 974px; margin: 10px auto 0; font-size: 15.5px; line-height: 27px; color: var(--text); }
.directions__map {
  display: block;
  height: 214px;
  margin-top: 45px;
  overflow: hidden;
  border: 1px solid var(--green-dark);
  border-radius: 16px;
  background: #D4F7E1;
}
.directions__map iframe { display: block; width: 100%; height: 100%; border: 0; }
.directions__text.directions__disclaimer { margin-top: 38px; }
/* =========================================================
   UTILITY PAGES (thank you, 404)
   ========================================================= */
.message-page { padding: 120px 0; background: var(--green-bg); text-align: center; }
.message-page__inner { display: flex; flex-direction: column; align-items: center; }
.message-page__icon {
  display: grid;
  place-items: center;
  width: 76px;
  height: 76px;
  margin-bottom: 24px;
  border-radius: 50%;
  background: var(--green);
  color: #fff;
  box-shadow: 0 14px 30px rgba(148, 203, 84, .35);
}
.message-page__icon svg { width: 36px; height: 36px; }
.message-page__title {
  margin-top: 20px;
  font-family: var(--f-head);
  font-weight: 600;
  font-size: 64px;
  line-height: 67px;
  color: var(--navy);
}
.message-page__text { max-width: 640px; margin-top: 18px; font-size: 16px; line-height: 28px; color: var(--text); }
.message-page__text a { color: var(--green-dark); font-weight: 600; }
.message-page__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin-top: 34px; }
.message-page__actions .btn--outline { background: #fff; }
.message-page__links { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 28px; margin-top: 30px; }
.message-page__links a { font-size: 15px; font-weight: 500; color: var(--navy); text-decoration: underline; text-underline-offset: 3px; }
.message-page__links a:hover { color: var(--green-dark); }
/* =========================================================
   RESPONSIVE
   ========================================================= */
@media (max-width: 1499px) {
  :root { --gutter: 48px; --h2: 48px; }
  .hero__title { font-size: 56px; line-height: 60px; }
  .hero__content { max-width: 560px; }
  .hero__media { width: calc(100% - var(--gutter) - 580px); }
  .hero__media::before { width: 300px; }
  .desk-card__ctas { flex-wrap: wrap; }
  .desk-card__ctas .btn { flex: 1 1 220px; width: auto; padding: 0 16px; }
  .nav { margin-left: 56px; }
  .nav ul { gap: 24px; }
  .nav li:first-child { margin-right: 0; }
  .services__intro { flex-basis: 440px; }
  .about__inner { gap: 72px; }
  .faq__inner { gap: 56px; }
  .hours-card__badge { left: auto; right: 28px; width: 210px; top: 120px; }
}

/* Trust bar: above 1440px it scales as one unit with its width (Figma 1472px bar), so line breaks match the design */
@media (min-width: 1440px) {
  .trust-wrap .container > * { --u: calc(100cqi / 1472); }
  .trust-wrap .container { container-type: inline-size; }
  .trust { padding: calc(32 * var(--u)) calc(36 * var(--u)); }
  .trust__item { gap: calc(16 * var(--u)); padding: 0 calc(28 * var(--u)) 0 calc(29 * var(--u)); }
  .trust__item:first-child { padding-left: 0; padding-right: calc(19 * var(--u)); }
  .trust__item + .trust__item::before { top: calc(5.5 * var(--u)); height: calc(76 * var(--u)); }
  .trust__icon { width: calc(52 * var(--u)); height: calc(52 * var(--u)); border-radius: calc(12 * var(--u)); }
  .trust__icon svg { width: calc(26 * var(--u)); height: calc(26 * var(--u)); }
  .trust h3 { font-size: calc(16 * var(--u)); line-height: calc(24 * var(--u)); }
  .trust p { margin-top: calc(6 * var(--u)); font-size: calc(13 * var(--u)); line-height: calc(19 * var(--u)); }
}

@media (max-width: 1439px) {
  .trust { grid-template-columns: 1fr 1fr; row-gap: 28px; padding: 32px; }
  .trust__item:nth-child(3) { padding-left: 0; }
  .trust__item:nth-child(3)::before { display: none; }
}

@media (max-width: 1279px) {
  :root { --gutter: 40px; --h2: 46px; }
  .nav-toggle { display: flex; }
  .nav {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    margin: 0;
    padding: 12px var(--gutter) 24px;
    background: #fff;
    border-top: 1px solid var(--line);
    box-shadow: 0 20px 30px rgba(4, 37, 68, .08);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-8px);
    transition: opacity .25s, transform .25s, visibility .25s;
  }
  .nav.is-open { opacity: 1; visibility: visible; transform: none; }
  .nav ul { flex-direction: column; align-items: stretch; gap: 4px; }
  .nav a { padding: 12px 14px; font-size: 16px; }
  .navbar { position: relative; }
  .book-pill { margin-left: auto; margin-right: 0; }



  .services__grid { grid-template-columns: repeat(2, 1fr); }
  .services__head { flex-direction: column; align-items: flex-start; gap: 24px; }
  .services__intro { flex-basis: auto; max-width: 760px; }

  .about__inner { grid-template-columns: 1fr 1.25fr; gap: 56px; }
  .portrait__cta { right: -24px; width: 160px; }

  .why__inner { grid-template-columns: 1fr; gap: 40px; }
  .why__media { aspect-ratio: 16 / 10; }
  .why__media img { object-position: center 40%; }

  /* below 1280px the scaled units fall back to plain design px */
  .reviews-wrap .container > *, .footer__inner, .footer__bar-inner { --u: 1px; }
  .reviews__intro .h2 { font-size: var(--h2); line-height: 1.154; }
  .footer__inner { gap: 32px; }
  .footer__contact .btn { padding: 0 16px; }
  .footer__copy { margin-left: 0; }
  .reviews { grid-template-columns: 1fr; gap: 56px; padding: 56px 40px 64px; }
  .reviews__intro { max-width: none; padding-right: 190px; }
  .reviews__seal { left: auto; right: 0; top: 70px; }
  .reviews__track { justify-content: center; margin: 0; }
  .reviews { grid-template-columns: minmax(0, 1fr); }
  .review { flex: 1 1 0; min-width: 0; max-width: 420px; }

  .faq__inner { grid-template-columns: 1fr; gap: 48px; }
  .faq__side .help-card { margin-top: 28px; }
  .acc-item__a { padding-right: 80px; }

  .cta { grid-template-columns: 1fr 1.2fr; }
  .cta__content { padding: 64px var(--gutter) 64px 48px; }

  .location__inner { grid-template-columns: 1fr; gap: 32px; }
  .map { aspect-ratio: 620 / 380; }
  .hours-card { min-height: 0; }
  .hours-card__badge { left: auto; right: 32px; top: calc(50% - 100px); width: 200px; }

  .footer__inner { grid-template-columns: repeat(3, 1fr); row-gap: 40px; column-gap: 32px; }
  .footer__brand {
    grid-column: 1 / 3;
    display: grid;
    grid-template-columns: auto 1fr;
    column-gap: 24px;
    align-items: center;
    width: auto;
    margin: 0;
  }
  .footer__brand a { grid-row: 1 / 3; }
  .footer__brand img { width: 160px; }
  .footer__name { margin-top: 0; text-align: left; align-self: end; }
  .footer__brand p:last-child { margin-top: 4px; align-self: start; text-align: left; }
  .footer__contact { grid-row: 1; grid-column: 3; width: auto; margin-top: 0; align-items: flex-end; justify-content: center; gap: 14px; }
  .chat-btn { width: 64px; height: 64px; }
  .chat-btn svg { width: 28px; height: 28px; }
  .footer__contact .btn { width: auto; margin-top: 0; padding: 0 18px; }
  .footer__col { padding-top: 32px; border-top: 1px solid var(--line); }
  /* keep each link on one line so the Services and Conditions rows stay aligned */
  .footer__col .footer__links li { white-space: nowrap; }
  .footer__bar-inner { flex-wrap: wrap; gap: 12px 40px; }
  .footer__legal { flex-basis: 100%; }
  .footer__powered { margin-left: 0; }
}

@media (max-width: 1199px) {
  /* hero: photo becomes the background, copy sits on top with a light overlay */
  .hero__media { inset: 0; width: 100%; }
  .hero__media img { object-position: 72% center; }
  .hero__media::before { display: none; }
  .hero__media::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(255, 255, 255, .96) 0%, rgba(255, 255, 255, .86) 50%, rgba(255, 255, 255, .3) 100%);
  }
  .hero__content { max-width: 640px; padding: 64px 0 112px; }
  .trust-wrap { background: var(--bg-soft); }
  .trust { position: relative; margin-top: -40px; }
}

@media (max-width: 1199px) {
  .page-hero { min-height: 0; }
  .page-hero__media::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(255, 255, 255, .96) 0%, rgba(255, 255, 255, .86) 50%, rgba(255, 255, 255, .3) 100%);
  }
  .page-hero__content { padding: 88px 0; }
  .media-text__inner { gap: 48px; }
}

@media (max-width: 991px) {
  :root { --h2: 42px; }
  .media-text__inner { grid-template-columns: 1fr; gap: 32px; }
  .media-text--reverse .media-text__media { order: 0; }
  .media-text__media { max-height: 520px; }
  .contact-cards__grid { grid-template-columns: 1fr; max-width: 620px; margin-inline: auto; }
  .topbar__cta { width: auto; padding: 0 var(--gutter) 0 24px; }

  .about__inner { grid-template-columns: 1fr; gap: 64px; }
  .portrait { width: 100%; max-width: 520px; margin-inline: auto; }
  .portrait__cta { right: -18px; bottom: -28px; width: 150px; }

  .cta { grid-template-columns: 1fr; }
  .cta__media { aspect-ratio: 756 / 420; }
  .cta__media img { object-position: center 30%; }
  .cta__content { max-width: none; padding: 56px var(--gutter) 64px; }

  .verified { display: none; }
  .footer__brand { grid-column: 1 / -1; }
  .footer__contact { grid-row: auto; grid-column: 1 / -1; flex-direction: row; align-items: center; justify-content: flex-start; padding-top: 32px; border-top: 1px solid var(--line); }
}

@media (max-width: 767px) {
  :root { --gutter: 20px; --h2: 30px; }
  body { font-size: 15px; }
  .h2 { line-height: 1.1; }

  .topbar__reviews > span:last-child { display: none; }
  .topbar__reviews .stars { margin-right: 0; }
  .topbar__reviews .g-logo { width: 20px; height: 20px; margin-right: 8px; }
  .stars svg { width: 14px; height: 14px; }
  .topbar__reviews { font-size: 14px; }
  .topbar__cta { gap: 8px; padding: 0 var(--gutter) 0 16px; font-size: 13px; }
  .topbar__cta svg { width: 16px; height: 18px; }

  .navbar__inner { height: 76px; }
  .logo img { width: 120px; height: 66px; }
  .navbar__inner > .book-pill { display: none; }
  .nav-toggle { margin-left: auto; }
  .nav .book-pill--mobile { display: flex; margin-top: 16px; justify-content: center; margin-right: 0; padding: 0 20px; border-radius: 31px; }
  .nav .book-pill--mobile:hover { color: inherit; }
  .book-pill__icon { flex-shrink: 0; }
  .nav .book-pill--mobile .book-pill__label { font-size: 14px; margin-right: 10px; }
  .nav .book-pill--mobile .book-pill__num { font-size: 16px; }

  .hero__media::after { background: rgba(255, 255, 255, .82); }
  .hero__content { padding: 40px 0 96px; }
  .hero__eyebrow { height: auto; min-height: 40px; padding: 8px 16px; font-size: 14px; line-height: 20px; }
  .hero__title { font-size: 40px; line-height: 44px; }
  .hero__title br { display: none; }
  .hero__text { font-size: 15px; line-height: 26px; }
  .desk-card { padding: 22px 20px 20px; }
  .desk-card__lead { font-size: 15px; }
  .desk-card__ctas { flex-direction: column; }
  .desk-card__ctas .btn { flex: 0 0 auto; width: 100%; font-size: 16px; }

  .trust { grid-template-columns: 1fr; padding: 28px 24px; row-gap: 0; }
  .trust__item { padding: 20px 0 !important; }
  .trust__item:first-child { padding-top: 0 !important; }
  .trust__item:last-child { padding-bottom: 0 !important; }
  .trust__item + .trust__item::before { display: block !important; top: 0; left: 0; width: 100%; height: 1px; }

  .services { padding: 40px 0; }
  .services__grid { grid-template-columns: 1fr; gap: 16px; margin-top: 36px; }
  .service-card { min-height: 0; padding: 28px 24px; }
  .service-card h3 { font-size: 26px; line-height: 30px; }
  .services__note { margin-top: 32px; }

  .about { padding: 40px 0; }
  .about__inner { gap: 56px; }
  .portrait__img { border-radius: 28px; }
  .portrait__badge-card { left: 14px; bottom: 14px; padding: 10px 12px; gap: 8px; min-width: 0; max-width: calc(100% - 100px); }
  .portrait__badge-card svg { width: 24px; height: 24px; }
  .portrait__badge-card span { font-size: 11px; line-height: 16px; }
  .portrait__cta { right: -6px; bottom: -34px; width: 110px; box-shadow: 0 0 0 4px var(--navy); }
  .about__sub { font-size: 23px; line-height: 30px; }
  .about__text { font-size: 15px; line-height: 26px; }
  .features { grid-template-columns: 1fr; }
  .features--dark li { min-height: 0; }
  .features--dark li:nth-child(-n+2) { min-height: 0; }

  .why { padding: 40px 0; }
  .why__card { margin-top: 24px; padding: 4px 24px; }
  .why__card li, .why__card li:nth-child(n) { min-height: 0; padding: 22px 0; border-bottom: 1px solid #CBDDB6; }
  .why__card li:last-child { border-bottom: 0; }
  .why--approach .why__card li:nth-child(n) { min-height: 0; padding: 22px 0; }
  .why__intro + .why__card { margin-top: 24px; }

  .page-hero__media::after { background: rgba(255, 255, 255, .84); }
  .page-hero__media img { object-position: 70% center !important; }
  .page-hero__content { padding: 48px 0; }
  .page-hero__sub { margin-top: 16px; font-size: 15px; line-height: 24px; }
  .page-hero__btn { margin-top: 28px; }

  .media-text { padding: 40px 0; }
  .media-text__media { border-radius: 16px; }
  .media-text__text { margin-top: 20px; }
  .media-text__text p { font-size: 15px; line-height: 26px; }
  .media-text__text p + p { margin-top: 18px; }

  .contact-cards { padding: 40px 0; }
  .contact-cards__head p, .contact-cards__outro { font-size: 15px; line-height: 26px; }
  .contact-cards__grid { grid-template-columns: 1fr; gap: 14px; margin-top: 28px; }
  .contact-cards__outro { margin-top: 28px; }
  .info-card { min-height: 0; padding: 20px; gap: 16px; border-radius: 20px; }
  .info-card__icon { width: 52px; height: 52px; }
  .info-card__body strong { font-size: 18px; line-height: 26px; }
  .info-card__body > span { font-size: 14.5px; line-height: 23px; }
  .why__media { aspect-ratio: 577 / 600; border-radius: 24px; }
  .why__media .btn { left: 16px; right: 16px; bottom: 16px; width: auto; }

  .reviews-wrap { background: linear-gradient(var(--green-bg) 0 40px, #fff 40px); }
  .reviews-wrap .container { padding-inline: 12px; }
  .reviews { padding: 36px 20px 40px; border-radius: 28px; gap: 28px; }
  .reviews__intro { padding-right: 0; }
  .reviews__seal { display: none; }
  .reviews__intro .btn--ghost { width: 100%; margin-top: 32px; }
  .reviews__nav { margin-top: 28px; }
  .reviews__track {
    justify-content: flex-start;
    gap: 16px;
    margin: -8px -20px 0;
    padding: 12px 20px 24px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
  }
  .reviews__track::-webkit-scrollbar { display: none; }
  .review { flex: 0 0 calc(100% - 8px); min-height: 0; padding: 32px 24px 22px; scroll-snap-align: center; transform: none !important; margin-top: 0 !important; }
  .verified { display: none; }

  .faq { padding: 40px 0; }
  .faq__inner { gap: 32px; }
  .faq__side { display: block; }
  .acc-item__q { padding: 20px; font-size: 16px; line-height: 24px; }
  .acc-item__a { padding: 0 20px 22px; margin-top: -8px; }
  .acc-item__a p { font-size: 15px; line-height: 25px; }
  .help-card { padding: 28px 24px; }
  .help-card .btn { width: 100%; }

  .cta__media { aspect-ratio: 756 / 520; }
  .cta__content { padding: 40px var(--gutter); }
  .cta__text { font-size: 15px; line-height: 26px; }
  .cta__content .h2 br { display: none; }

  .location { padding: 40px 0; }
  .location__inner { gap: 24px; }
  .address-card { padding: 20px; gap: 16px; }
  .address-card__icon { width: 52px; height: 52px; }
  .address-card strong { font-size: 18px; }
  .address-card strong + span { font-size: 15px; }
  .hours-card { min-height: 0; padding: 24px 20px; }
  .hours { gap: 0; margin-top: 8px; }
  .hours > div { align-items: flex-start; min-height: 0; padding: 11px 0; border-bottom: 1px solid rgba(4, 37, 68, .08); }
  .hours > div:last-child { border-bottom: 0; }
  .hours dt { flex-basis: 140px; font-size: 14px; line-height: 22px; }
  .hours dd { flex-direction: column; gap: 0; font-size: 14px; line-height: 22px; }
  .hours dd.is-closed { padding-left: 0; }
  .hours-card__badge { position: static; display: block; width: 130px; margin: 12px auto 0; }
  .map { border-radius: 24px; aspect-ratio: 620 / 500; }

  .footer__inner { grid-template-columns: 1fr 1fr; padding-top: 40px; padding-bottom: 40px; row-gap: 32px; column-gap: 20px; }
  .footer__brand { grid-column: 1 / -1; display: block; max-width: none; text-align: left; }
  .footer__brand img { width: 170px; margin-inline: 0; }
  .footer__name { margin-top: 16px; text-align: left; }
  .footer__col { padding-top: 0; border-top: 0; }
  .footer__brand p:last-child { text-align: left; }
  .footer__col h3 { font-size: 21px; white-space: normal; }
  .footer__col ul { font-size: 15px; }
  .footer__contact { grid-column: 1 / -1; justify-content: flex-start; padding-top: 24px; }
  .footer__contact .btn { margin-top: 0; }
  .chat-btn { display: none; }
  .footer__bar-inner { flex-direction: column; align-items: flex-start; gap: 10px; padding-top: 28px; padding-bottom: 28px; font-size: 13px; }
  .footer__copy, .footer__powered { white-space: normal; }
}

@media (max-width: 479px) {
  .topbar { background: var(--blue); }
  .topbar__inner { padding-left: 0; background: var(--blue); }
  .topbar__reviews { display: none; }
  .topbar__cta { width: 100%; justify-content: center; padding: 0 16px; font-size: 14px; }
}

@media (max-width: 400px) {
  :root { --h2: 27px; }
  .hero__title { font-size: 35px; line-height: 39px; }
  .footer__inner { grid-template-columns: 1fr; }
}

/* Services page, desktop: text blocks scale with the container (Figma 1472px content width)
   so line breaks match the design at any desktop width. --u = 1 design px. */
@media (min-width: 1280px) {
  .service-detail > .container,
  .banner-row > .container,
  .symptoms-row > .container { container-type: inline-size; }
  .service-detail > .container > *,
  .banner-row > .container > *,
  .symptoms-row > .container > * { --u: calc(100cqi / 1472); }

  .service-detail .h2 { font-size: calc(52 * var(--u)); line-height: calc(60 * var(--u)); }
  .service-detail__body .h2 { margin-top: calc(20 * var(--u)); }
  .service-detail__text { margin-top: calc(22 * var(--u)); font-size: calc(15.5 * var(--u)); line-height: calc(27 * var(--u)); }
  .service-detail__subhead { margin-top: calc(22 * var(--u)); font-size: calc(25 * var(--u)); line-height: calc(27 * var(--u)); }
  .service-detail__features { margin-top: calc(22 * var(--u)); column-gap: calc(36 * var(--u)); }
  .service-detail__features li { padding: calc(25 * var(--u)) 0 calc(24 * var(--u)); }
  .service-detail__features svg,
  .service-detail__features .ficon { width: calc(26 * var(--u)); height: calc(26 * var(--u)); }
  .service-detail__features .ficon { -webkit-mask-size: calc(30 * var(--u)); mask-size: calc(30 * var(--u)); }
  .service-detail__features h3 { margin-top: calc(10 * var(--u)); font-size: calc(16.5 * var(--u)); line-height: calc(25 * var(--u)); }
  .service-detail__features p { margin-top: calc(10 * var(--u)); font-size: calc(13.5 * var(--u)); line-height: calc(21 * var(--u)); letter-spacing: calc(-0.2 * var(--u)); }
  .service-detail .bullets { margin-top: calc(22 * var(--u)); }
  .service-detail .bullets li,
  .symptoms-card .bullets li { padding-left: calc(11 * var(--u)); font-size: calc(15.5 * var(--u)); line-height: calc(27 * var(--u)); }
  .service-detail--tall-copy .service-detail__body { padding-top: calc(4 * var(--u)); }

  .service-note { margin-top: calc(75 * var(--u)); }
  .service-detail--tall-copy .service-note { margin-top: calc(54 * var(--u)); }
  .service-note__text { max-width: calc(1300 * var(--u)); margin-top: calc(25 * var(--u)); }
  .service-note__text p { font-size: calc(15.5 * var(--u)); line-height: calc(27 * var(--u)); }
  .service-note__text p + p { margin-top: calc(27 * var(--u)); }
  .service-note__btn { margin-top: calc(50 * var(--u)); }

  .help-banner { padding: calc(36 * var(--u)); }
  .help-banner h3 { margin-top: calc(18 * var(--u)); font-size: calc(31 * var(--u)); line-height: calc(38 * var(--u)); }
  .help-banner > h3:first-child { margin-top: 0; }
  .help-banner__text { margin-top: calc(18 * var(--u)); }
  .help-banner__text p { font-size: calc(16 * var(--u)); line-height: calc(25 * var(--u)); letter-spacing: calc(-0.2 * var(--u)); }
  .help-banner__text p + p,
  .help-banner__notes--spaced p + p { margin-top: calc(25 * var(--u)); }
  .help-banner__notes { margin-top: calc(18 * var(--u)); }
  .help-banner__notes p { font-size: calc(13 * var(--u)); line-height: calc(25 * var(--u)); }
  .help-banner .btn { margin-top: calc(18 * var(--u)); }
  .help-banner--narrow h3 { max-width: calc(420 * var(--u)); }

  .symptoms-card { padding: calc(36 * var(--u)) calc(41 * var(--u)); }
  .symptoms-card .h2 { max-width: calc(460 * var(--u)); font-size: calc(52 * var(--u)); line-height: calc(60 * var(--u)); }
  .symptoms-card .bullets { margin-top: calc(20 * var(--u)); }
  .symptoms-card > p { margin-top: calc(20 * var(--u)); font-size: calc(15.5 * var(--u)); line-height: calc(27 * var(--u)); }

  .about--provider > .container,
  .appointment > .container,
  .services--compact > .container { container-type: inline-size; }
  .about--provider > .container > *,
  .appointment > .container > *,
  .services--compact > .container > * { --u: calc(100cqi / 1472); }
  .services--compact .services__grid { gap: calc(24 * var(--u)); }
  .services--compact .service-card { min-height: calc(271 * var(--u)); padding: calc(40 * var(--u)); }
  .services--compact .service-card h3 { margin-top: calc(20 * var(--u)); font-size: calc(28 * var(--u)); line-height: calc(34 * var(--u)); }
  .services--compact .service-card p { margin-top: calc(20 * var(--u)); font-size: calc(15 * var(--u)); line-height: calc(25.5 * var(--u)); }
  .services--compact .services__note { max-width: calc(1031 * var(--u)); margin-top: calc(51 * var(--u)); font-size: calc(16 * var(--u)); line-height: calc(27 * var(--u)); }
  .appointment .appt-form__note { font-size: calc(13 * var(--u)); }
  .about--provider .h2 { font-size: calc(52 * var(--u)); line-height: calc(60 * var(--u)); }
  .about--provider .about__text { font-size: calc(15.5 * var(--u)); line-height: calc(27 * var(--u)); }
  .about--provider .features { column-gap: calc(36 * var(--u)); }
  .about--provider .features h3 { font-size: calc(16.5 * var(--u)); line-height: calc(25 * var(--u)); }
  .about--provider .features p { font-size: calc(13.5 * var(--u)); line-height: calc(21 * var(--u)); }
  .appointment__info .h2 { max-width: calc(600 * var(--u)); font-size: calc(52 * var(--u)); line-height: calc(60 * var(--u)); }
  .appointment__text p,
  .appointment__office { font-size: calc(15.5 * var(--u)); line-height: calc(27 * var(--u)); }
  .appointment__contact li > span:last-child { font-size: calc(15.5 * var(--u)); line-height: calc(25 * var(--u)); }
  .appointment__contact strong { font-size: calc(20 * var(--u)); line-height: calc(30 * var(--u)); }
}
/* Disc Injury page + shared CTA, desktop: scale with width so line breaks match the design (--u = 1 design px) */
@media (min-width: 1280px) {
  .service-detail__footnote { margin-top: calc(50 * var(--u)); padding-top: calc(50 * var(--u)); font-size: calc(15.5 * var(--u)); line-height: calc(27 * var(--u)); }

  .intake > .container,
  .about--short > .container { container-type: inline-size; }
  .intake > .container > *,
  .about--short > .container > * { --u: calc(100cqi / 1472); }
  .intake__inner { column-gap: calc(67 * var(--u)); max-width: calc(1417 * var(--u)); }
  .intake__cards { gap: calc(40 * var(--u)); }
  .intake-card { min-height: calc(177 * var(--u)); padding: calc(32 * var(--u)) calc(15 * var(--u)); }
  .intake-card h3 { margin-top: calc(10 * var(--u)); font-size: calc(16.5 * var(--u)); line-height: calc(25 * var(--u)); }
  .intake-card p { margin-top: calc(10 * var(--u)); font-size: calc(13.5 * var(--u)); line-height: calc(21 * var(--u)); }
  .intake .appt-form__note { font-size: calc(13 * var(--u)); }
  .about--short .about__inner { column-gap: 6.52%; }
  .about--short .h2 { font-size: calc(52 * var(--u)); line-height: calc(60 * var(--u)); }
  .about--short .about__text { font-size: calc(15.5 * var(--u)); line-height: calc(27 * var(--u)); }

  .cta { container-type: inline-size; --u: calc(100cqi / 1600); }
  .cta__content { max-width: calc(844 * var(--u)); padding: calc(68 * var(--u)) calc(64 * var(--u)) calc(68 * var(--u)) calc(72 * var(--u)); }
  .cta .h2 { font-size: calc(52 * var(--u)); line-height: calc(60 * var(--u)); }
  .cta__text { max-width: calc(677 * var(--u)); margin-top: calc(17 * var(--u)); font-size: calc(16 * var(--u)); line-height: calc(27 * var(--u)); }
  .cta .desk-card { max-width: calc(639 * var(--u)); margin-top: calc(42 * var(--u)); padding: calc(26 * var(--u)) calc(28 * var(--u)) calc(22 * var(--u)); }
  .cta .desk-card__lead { font-size: calc(15.2 * var(--u)); line-height: calc(24 * var(--u)); }
  .cta .desk-card__note { font-size: calc(10.5 * var(--u)); line-height: calc(16 * var(--u)); }
  /* custom-label CTA buttons scale with the card so they always fit on one row (design: 349.6 + 12 + 221.4 = 583) */
  .cta .desk-card__ctas { flex-wrap: nowrap; gap: calc(12 * var(--u)); }
  .cta .desk-card__ctas .btn { flex: 0 0 auto; height: calc(46.6 * var(--u)); padding: 0; gap: calc(10 * var(--u)); }
  .cta .desk-card__ctas .btn svg { width: calc(18 * var(--u)); height: calc(18 * var(--u)); }
  .cta .desk-card__ctas .btn--green { width: calc(281.5 * var(--u)); font-size: calc(17 * var(--u)); }
  .cta .desk-card__ctas .btn--outline { width: calc(289.5 * var(--u)); font-size: calc(16 * var(--u)); }
  .cta .desk-card--auto .desk-card__ctas .btn--green { width: auto; padding: 0 calc(15 * var(--u)); font-size: calc(16 * var(--u)); }
  .cta .desk-card--auto .desk-card__ctas .btn--outline { width: auto; padding: 0 calc(5 * var(--u)); font-size: calc(14.5 * var(--u)); }
}
/* ---------- Services page: tablet & mobile ---------- */
@media (max-width: 1279px) {
  .services--compact .services__grid { grid-template-columns: repeat(2, 1fr); }
  .services--compact .service-card,
  .services--compact .service-card:nth-child(n+4) { grid-column: auto; min-height: 0; }
  .services--compact .service-card:last-child:nth-child(odd) { grid-column: 1 / -1; }
  .faq--centered .acc-item__a { padding-right: 60px; }
}

@media (max-width: 991px) {
  .service-detail__inner,
  .service-detail--reverse .service-detail__inner { grid-template-columns: 1fr; row-gap: 32px; }
  .service-detail--reverse .service-detail__media { order: 0; }
  .service-detail__media { aspect-ratio: 16 / 11; max-height: 560px; }
  .symptoms-row__inner { grid-template-columns: 1fr; row-gap: 24px; }
  .appointment__inner { grid-template-columns: 1fr; row-gap: 40px; }
  .appointment__info { padding-top: 0; }
  .help-banner::before { left: auto; right: -60px; }
}

@media (max-width: 767px) {
  .services--compact { padding: 40px 0; }
  .services--compact .services__grid { grid-template-columns: 1fr; }
  .services--compact .services__note { margin-top: 28px; font-size: 14px; line-height: 23px; }

  .eyebrow--tag { height: auto; min-height: 37px; padding: 8px 16px; white-space: normal; line-height: 20px; text-align: left; }
  .service-detail { padding: 40px 0; }
  .service-detail__media { border-radius: 24px; aspect-ratio: 4 / 3; }
  .service-detail__text, .bullets li, .service-note__text p { font-size: 15px; line-height: 26px; }
  .service-detail__subhead { font-size: 22px; line-height: 26px; }
  .service-detail__features li { padding: 20px 0; }
  .service-note { margin-top: 40px; }
  .service-note__text p + p { margin-top: 18px; }
  .service-note__btn { margin-top: 28px; white-space: normal; height: auto; min-height: 46.6px; padding: 10px 18px; }

  .banner-row { padding: 0 0 40px; }
  /* a banner right after a coloured section needs its own top space */
  .service-detail--navy + .banner-row,
  .service-detail--green + .banner-row,
  .service-detail--soft + .banner-row { padding-top: 40px; }
  .help-banner { padding: 28px 20px; border-radius: 24px; }
  .help-banner h3 { font-size: 25px; line-height: 31px; }
  .help-banner__text p { font-size: 15px; line-height: 24px; }
  .help-banner__text p + p, .help-banner__notes--spaced p + p { margin-top: 16px; }
  .help-banner__notes p { line-height: 21px; }
  .help-banner .btn { white-space: normal; height: auto; min-height: 46.6px; padding: 10px 18px; }

  .symptoms-row { padding: 0 0 40px; }
  .symptoms-card { padding: 28px 22px; }

  .about--provider { padding: 40px 0; }
  .about--provider .portrait__cta { bottom: -34px; }

  .faq--centered { padding: 40px 0; }
  .faq--centered .faq__inner { gap: 28px; }
  .faq--centered .acc-item__a { padding-right: 20px; }

  .appointment { padding: 40px 0; }
  .appointment .eyebrow--tag, .appointment__contact { margin-top: 32px; }
  .appointment__contact li + li { margin-top: 28px; }
  .appointment__contact .info-card__icon { width: 52px; height: 52px; }
  .appointment__contact strong { font-size: 18px; line-height: 26px; }
  .appointment__contact li > span:last-child { font-size: 14.5px; line-height: 23px; }
  .appt-form { padding: 24px 18px; border-radius: 20px; }
  .appt-form__row { grid-template-columns: 1fr; gap: 25px; }
  .appt-form__submit { width: 100%; min-width: 0; height: auto; min-height: 46.6px; padding: 10px 16px; white-space: normal; }
  .appt-form__note { line-height: 21px; }
}
/* ---------- Disc Injury page: tablet & mobile ---------- */
@media (max-width: 1279px) {
  .intake__inner { grid-template-columns: minmax(0, 1fr); row-gap: 40px; max-width: 760px; }
  .intake .appt-form { min-width: 0; }
  .field input, .field select { min-width: 0; }
  .intake__cards { grid-template-columns: 1fr 1fr; gap: 20px; }
  .intake-card { min-height: 0; padding: 24px 20px; }
}
@media (max-width: 1199px) {
  .desk-card--wide .desk-card__ctas { display: flex; }
}
@media (max-width: 991px) {
  /* stacked CTA band: the card uses the full content width */
  .cta .desk-card { max-width: none; }
}
@media (max-width: 767px) {
  .intake { padding: 40px 0; }
  .intake__inner { row-gap: 28px; }
  .intake__cards { grid-template-columns: 1fr; gap: 14px; }
  .page-hero__text p { font-size: 15px; line-height: 26px; }
  .page-hero__text p + p { margin-top: 16px; }
  .page-hero .desk-card { margin-top: 24px; }
  .service-detail__after { margin-top: 28px; }
  .cta { grid-template-columns: minmax(0, 1fr); }
  .desk-card--auto .desk-card__ctas .btn { width: 100%; height: auto; min-height: 46.6px; padding: 10px 16px; white-space: normal; }
  .service-detail__footnote { margin-top: 32px; padding: 28px 0 0; font-size: 14px; line-height: 23px; }
  .about--short .portrait { aspect-ratio: 579 / 445; }
}
/* ---------- Contact page: tablet & mobile ---------- */
@media (max-width: 767px) {
  .appointment--contact { padding: 40px 0; }
  .appointment--contact .eyebrow--tag,
  .appointment--contact .appointment__contact { margin-top: 28px; }
  .appointment--contact .appointment__contact li + li { margin-top: 24px; }
  .appt-form--contact .appt-form__note { margin-inline: 0; line-height: 21px; }
  .directions { padding: 0 0 40px; }
  .directions__note, .directions__text { font-size: 14.5px; line-height: 24px; }
  .directions__body { margin-top: 32px; padding-top: 32px; }
  .directions__map { height: 200px; margin-top: 28px; border-radius: 14px; }
  .directions__text.directions__disclaimer { margin-top: 28px; }
}
/* ---------- Services dropdown inside the mobile/tablet menu ---------- */
@media (max-width: 1279px) {
  .nav .has-sub { flex-wrap: wrap; }
  /* in the stacked menu the open submenu sits inside the item, so only the link row is highlighted */
  .nav .has-sub.is-current { padding-right: 0; background: none; }
  .nav .has-sub.is-current > a.is-active { background: #E9F5DE; }
  .nav .has-sub > a { flex: 1; }
  .sub-toggle { width: 44px; height: 44px; margin-left: 0; border-radius: 8px; }
  .sub-toggle svg { width: 18px; height: 18px; }
  .nav .subnav {
    position: static;
    flex-basis: 100%;
    min-width: 0;
    margin: 2px 0 6px;
    padding: 4px 0 4px 14px;
    border: 0;
    border-left: 2px solid #E9F5DE;
    border-radius: 0;
    box-shadow: none;
    opacity: 1;
    visibility: visible;
    transform: none;
    display: none;
  }
  .nav .subnav::before { display: none; }
  .has-sub:hover .subnav,
  .has-sub:focus-within .subnav { display: none; }
  .has-sub.is-open .subnav { display: block; }
  .has-sub:hover .sub-toggle svg { transform: none; }
  .has-sub.is-open .sub-toggle svg { transform: rotate(180deg); }
  .nav .subnav a { padding: 10px 14px; font-size: 15px; white-space: normal; }
}
/* ---------- Utility pages: mobile ---------- */
@media (max-width: 767px) {
  .message-page { padding: 56px 0; }
  .message-page__icon { width: 64px; height: 64px; }
  .message-page__title { font-size: 40px; line-height: 44px; }
  .message-page__text { font-size: 15px; line-height: 26px; }
  .message-page__actions { flex-direction: column; align-self: stretch; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; scroll-behavior: auto !important; }
}