/* Finchwell Medical LLC: shared stylesheet (plain CSS, no build step required) */

:root {
  --radius: 0.75rem;
  --background: #f7f6ef;
  --foreground: #1f2933;
  --card: #ffffff;
  --primary: #1f4f50;
  --primary-foreground: #f7f6ef;
  --teal-deep: #12302f;
  --secondary: #ece9e2;
  --secondary-foreground: #1f4f50;
  --muted: #efece4;
  --muted-foreground: #5b6a6a;
  --accent: #8c3a4a;
  --accent-foreground: #faf1ee;
  --gold: #8c3a4a;
  --gold-light: #c98894;
  --border: #e4e0d7;
  --ivory: #f7f6ef;
  --sage: #7f9686;
  --desert-sand: #d9c2a0;
  --warm-taupe: #a89684;
  --dusty-blue: #7c93a3;
  --font-display: "Cormorant Garamond", ui-serif, Georgia, serif;
  --font-sans: "DM Sans", ui-sans-serif, system-ui, sans-serif;
  --gradient-hero: linear-gradient(140deg, #1f4f50 0%, #163a3b 100%);
  --gradient-soft: linear-gradient(180deg, #f1eee7 0%, #f7f6ef 100%);
  --shadow-soft: 0 28px 70px -28px rgba(31, 79, 80, 0.22);
  --shadow-card: 0 12px 34px -18px rgba(31, 41, 51, 0.14);
}

.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--background);
  color: var(--foreground);
  font-family: var(--font-sans);
  -webkit-font-smoothing: antialiased;
  line-height: 1.5;
}
h1, h2, h3, h4 {
  font-family: var(--font-display);
  font-weight: 500;
  letter-spacing: -0.015em;
  margin: 0;
}
p { margin: 0; }
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
ul { list-style: none; margin: 0; padding: 0; }

.wrap { max-width: 1320px; margin: 0 auto; padding: 0 20px; }
@media (min-width: 640px) { .wrap { padding: 0 24px; } }
@media (min-width: 1024px) { .wrap { padding: 0 32px; } }

/* Vertical padding only: .section is almost always paired with .wrap on the
   same element ("wrap section"), and a "padding: 72px 0" shorthand here
   silently zeroed the .wrap side gutters on every page. */
.section { padding-top: 72px; padding-bottom: 72px; }
@media (min-width: 1024px) { .section { padding-top: 120px; padding-bottom: 120px; } }
.section.pt-0 { padding-top: 0; }

.eyebrow {
  font-size: 0.8rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  color: var(--primary);
}

.bg-soft { background: var(--gradient-soft); }
.bg-hero { background: var(--gradient-hero); color: var(--primary-foreground); }
.bg-secondary { background: color-mix(in srgb, var(--secondary) 40%, transparent); }
.bg-muted { background: color-mix(in srgb, var(--muted) 40%, transparent); }

/* Header */
.site-header { position: sticky; top: 0; z-index: 50; border-bottom: 1px solid color-mix(in srgb, var(--border) 60%, transparent); background: color-mix(in srgb, var(--ivory) 90%, transparent); backdrop-filter: blur(8px); }
.header-row { max-width: 1320px; margin: 0 auto; padding: 0 20px; height: 4.5rem; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.logo { display: flex; align-items: center; gap: 10px; }
.logo-mark { height: 36px; width: auto; }
.logo-word { display: flex; flex-direction: column; line-height: 1; }
.logo-word .name { font-family: var(--font-display); font-size: 1.25rem; font-weight: 600; }
.logo-word .tag { margin-top: 2px; font-size: 0.6rem; font-weight: 500; text-transform: uppercase; letter-spacing: 0.22em; color: var(--muted-foreground); }
.nav-desktop { display: none; align-items: center; gap: 4px; }
@media (min-width: 1140px) { .nav-desktop { display: flex; } }
.nav-desktop a { padding: 10px 14px; border-radius: 6px; font-size: 1rem; font-weight: 600; color: color-mix(in srgb, var(--foreground) 82%, transparent); }
.nav-desktop a:hover { background: var(--secondary); color: var(--foreground); }
.nav-desktop a.active { color: var(--primary); }
.nav-desktop a { white-space: nowrap; }
/* 1140px to 1359px: tighten the desktop nav (the desktop nav now starts
   at 1140px, raised from 1100px on 10/10/26 for the third header CTA; below that the menu button is used) so the header row never
   overflows the viewport (it did by up to ~110px before 9/23/26). */
@media (min-width: 1140px) and (max-width: 1359px) {
  .nav-desktop { gap: 0; }
  .nav-desktop a, .nav-item-dropdown > a { padding: 8px 7px; font-size: 0.88rem; white-space: nowrap; }
  .logo-word .tag { white-space: nowrap; }
  .header-cta .btn { padding-left: 12px; padding-right: 12px; font-size: 0.82rem; }
}
/* 10/10/26: third header CTA ("Schedule a Discovery Call"). Below 1280px the
   label shortens to "Discovery Call" (the lead-in is hidden) so the header row
   still fits without overflow. Full label shows at 1280px and wider. */
@media (min-width: 1140px) and (max-width: 1279px) {
  .header-cta .dc-lead { display: none; }
  .header-cta { gap: 6px; }
  .header-cta .btn { padding-left: 10px; padding-right: 10px; }
  .header-row { gap: 10px; }
}
@media (min-width: 1140px) and (max-width: 1179px) {
  .logo { flex-shrink: 0; }
  .nav-desktop a, .nav-item-dropdown > a { padding: 8px 4px; }
  .header-cta .btn { padding-left: 8px; padding-right: 8px; font-size: 0.8rem; }
  .header-row { padding-left: 14px; padding-right: 14px; }
}
.header-cta { display: none; }
@media (min-width: 1140px) { .header-cta { display: flex; align-items: center; gap: 8px; } }
.nav-toggle { display: inline-flex; height: 40px; width: 40px; align-items: center; justify-content: center; border-radius: 6px; background: none; border: none; cursor: pointer; color: var(--foreground); }
@media (min-width: 1140px) { .nav-toggle { display: none; } }
.nav-mobile { overflow: hidden; max-height: 0; border-bottom: 1px solid var(--border); background: var(--background); transition: max-height 0.3s ease; }
.nav-mobile.open { max-height: calc(100vh - 4.5rem); max-height: calc(100dvh - 4.5rem); overflow-y: auto; }
.nav-mobile-inner { display: flex; flex-direction: column; gap: 4px; padding: 16px; }
.nav-mobile-inner a { padding: 12px 14px; border-radius: 6px; font-size: 1.05rem; font-weight: 600; }
.nav-mobile-inner a:hover { background: var(--secondary); }

/* Services quick-browse dropdown (9/5/26, per Dr. Bui, modeled on a
   reference clinic site's header menu). Desktop: hover/focus-within shows
   the panel; a JS click-toggle (script.js initNavDropdowns) covers
   touch/keyboard where hover doesn't apply. Mobile: no dropdown mechanics
   needed -- the quick links are just always-visible, indented under the
   Services & Pricing mobile nav link. */
.nav-item-dropdown { position: relative; }
.nav-item-dropdown > a { display: inline-flex; align-items: center; gap: 7px; padding: 10px 14px; }
.nav-item-dropdown > a::after { content: "\25BE"; font-size: 1em; opacity: 0.9; position: relative; top: 1px; }
/* top:100% with NO margin -- the panel's box must sit flush against the
   trigger link with zero gap between them. A margin-top gap here (the old
   8px) creates a dead pixel strip that belongs to neither .nav-item-dropdown
   (whose own height is just the inline link, since an absolutely-positioned
   child doesn't add to it) nor .nav-dropdown-panel itself -- the mouse loses
   :hover the instant it crosses that strip on the way down from the link to
   the panel, closing the panel before a patient can ever click into it
   (Dr. Bui, 9/6/26: "the box disappears when I move my mouse away"). The
   equivalent visual spacing is kept as padding-top INSIDE the panel's own
   box instead, which stays continuously hoverable. */
.nav-dropdown-panel { position: absolute; top: 100%; left: 0; min-width: 280px; background: var(--card); border: 1px solid var(--border); border-radius: 1rem; box-shadow: var(--shadow-soft); padding: 18px 10px 10px; display: none; flex-direction: column; gap: 2px; z-index: 60; }
.nav-item-dropdown:hover .nav-dropdown-panel, .nav-item-dropdown:focus-within .nav-dropdown-panel, .nav-item-dropdown.open .nav-dropdown-panel { display: flex; }
.nav-dropdown-panel .nav-dropdown-label { padding: 4px 12px 6px; font-size: 0.68rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: var(--muted-foreground); }
.nav-dropdown-panel a { padding: 11px 14px; border-radius: 0.6rem; font-size: 1rem; font-weight: 600; color: var(--foreground); white-space: nowrap; }
.nav-dropdown-panel a:hover { background: var(--secondary); color: var(--primary); }
.nav-dropdown-panel .nav-dropdown-all { border-top: 1px solid var(--border); margin-top: 6px; padding-top: 12px; font-weight: 700; color: var(--primary); }
.nav-mobile-sublist { display: flex; flex-direction: column; gap: 1px; padding-left: 16px; margin: -2px 0 6px; }
.nav-mobile-sublist a { padding: 8px 12px; font-size: 0.8rem; font-weight: 500; color: var(--muted-foreground); border-radius: 6px; }
.nav-mobile-sublist a:hover { background: var(--secondary); }
/* Collapsible mobile sub-lists (script.js initMobileSublists). Without JS they stay open. */
.nav-mobile-row { display: flex; align-items: stretch; gap: 4px; }
.nav-mobile-row > a { flex: 1; }
.nav-sub-toggle { flex: none; width: 48px; border: none; border-radius: 6px; background: none; color: var(--foreground); font-size: 1.25rem; line-height: 1; cursor: pointer; }
.nav-sub-toggle:hover { background: var(--secondary); }
.nav-sub-toggle.open { transform: rotate(180deg); }
.nav-mobile-sublist.js-collapsible:not(.open) { display: none; }

/* Buttons */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; border-radius: 8px; font-weight: 500; font-size: 0.9rem; padding: 10px 18px; border: 1px solid transparent; cursor: pointer; transition: all 0.15s ease; white-space: nowrap; }
.btn-hero { background: var(--primary); color: var(--primary-foreground); }
.btn-hero:hover { background: color-mix(in srgb, var(--primary) 88%, black); }
.btn-outline { background: transparent; border-color: var(--border); color: var(--foreground); }
.btn-outline:hover { background: var(--secondary); }
.btn-hero-outline { background: transparent; border-color: color-mix(in srgb, var(--primary-foreground) 40%, transparent); color: var(--primary-foreground); }
.btn-hero-outline:hover { background: color-mix(in srgb, var(--primary-foreground) 12%, transparent); }
.btn-ghost { background: transparent; color: var(--foreground); }
.btn-ghost:hover { background: var(--secondary); }
.btn-accent { background: var(--accent); color: var(--accent-foreground); }
.btn-accent:hover { background: color-mix(in srgb, var(--accent) 88%, black); }
.btn-xl { padding: 14px 24px; font-size: 1rem; border-radius: 10px; }
.btn-lg { padding: 12px 20px; font-size: 0.95rem; border-radius: 9px; }
.btn-sm { padding: 7px 14px; font-size: 0.8rem; }
.btn-block { width: 100%; }
.icon { width: 1em; height: 1em; display: inline-block; vertical-align: -0.125em; }

.btn-row { display: flex; flex-direction: column; gap: 12px; margin-top: 36px; }
@media (min-width: 640px) { .btn-row { flex-direction: row; flex-wrap: wrap; } }

/* Hero */
.hero-grid { display: grid; gap: 48px; align-items: center; padding: 72px 0; }
@media (min-width: 1024px) { .hero-grid { grid-template-columns: 3fr 2fr; gap: 64px; padding: 120px 0; } }
.hero-copy { max-width: 650px; }
.hero-copy h1 { font-size: 2.25rem; line-height: 1.05; margin-top: 20px; }
@media (min-width: 640px) { .hero-copy h1 { font-size: 3rem; } }
@media (min-width: 1024px) { .hero-copy h1 { font-size: 3.5rem; } }
.hero-copy .lead { margin-top: 24px; font-size: 1.25rem; line-height: 1.6; color: color-mix(in srgb, var(--foreground) 80%, transparent); }
.hero-visual { aspect-ratio: 4/5; width: 100%; border-radius: 1.5rem; box-shadow: var(--shadow-soft); background: var(--gradient-hero); overflow: hidden; }
.hero-visual img { width: 100%; height: 100%; object-fit: cover; display: block; }
/* grid-2 sections (About, For Patients, For Clinics): the source photos are tight 4:5 portrait
   headshots. The previous 4:3 landscape crop forced a heavy center-crop that zoomed in on the
   face (cutting off hair/chin). That's the "oversized About photo" bug fixed 8/25/26. Keeping
   the ratio close to the source's native ~4:5 and raising the height cap shows the full headshot
   with only a light trim, instead of a forced landscape crop. */
.grid-2 .hero-visual { aspect-ratio: 4/5; max-height: 560px; }
.grid-2 .hero-visual-compact { aspect-ratio: 4/3; max-height: 360px; max-width: 480px; justify-self: center; }

/* Page hero (inner pages) */
.page-hero { background: var(--gradient-soft); padding: 64px 0 48px; }
@media (min-width: 1024px) { .page-hero { padding: 96px 0 64px; } }
.page-hero-inner { max-width: 780px; }
.page-hero h1 { margin-top: 16px; font-size: 2rem; }
@media (min-width: 640px) { .page-hero h1 { font-size: 2.75rem; } }
.page-hero .desc { margin-top: 16px; font-size: 1.15rem; color: var(--muted-foreground); }
.page-hero .btn-row { margin-top: 28px; }

/* Section heading */
.section-heading { max-width: 640px; }
.section-heading.center { margin: 0 auto; text-align: center; }
.section-heading h2 { font-size: 1.75rem; margin-top: 12px; }
@media (min-width: 640px) { .section-heading h2 { font-size: 2.25rem; } }
.section-heading .desc { margin-top: 14px; font-size: 1.1rem; color: var(--muted-foreground); }

/* Cards / grids */
.grid { display: grid; gap: 24px; }
.grid > * { min-width: 0; } /* keep grid items inside the .wrap gutters on narrow screens */
.grid-2 { grid-template-columns: repeat(1, 1fr); }
.grid-3 { grid-template-columns: repeat(1, 1fr); }
.grid-4 { grid-template-columns: repeat(1, 1fr); }
@media (min-width: 640px) { .grid-2 { grid-template-columns: repeat(2, 1fr); } .grid-4 { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 768px) { .grid-3 { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1024px) { .grid-3 { grid-template-columns: repeat(3, 1fr); } .grid-4 { grid-template-columns: repeat(4, 1fr); } }

.card { background: var(--card); border: 1px solid var(--border); border-radius: 2px; padding: 32px 28px; box-shadow: none; transition: border-color 0.2s ease, transform 0.2s ease; }
.card:hover { border-color: var(--gold); transform: translateY(-2px); }
/* Clickable cards (9/23/26): whole card is one link, with a small arrow and
   a clear hover/focus state. */
a.card-link { display: block; position: relative; color: inherit; text-decoration: none; padding-right: 48px; }
a.card-link:hover { box-shadow: var(--shadow-card); }
a.card-link:focus-visible { outline: 2px solid var(--primary); outline-offset: 3px; }
.card-link-arrow { position: absolute; top: 28px; right: 22px; font-size: 1.1rem; font-weight: 700; color: var(--accent); transition: transform 0.2s ease; }
a.card-link:hover .card-link-arrow, a.card-link:focus-visible .card-link-arrow { transform: translateX(4px); }
a.card-link:hover h3 { color: var(--primary); text-decoration: underline; text-underline-offset: 3px; }
a.card-link:active { border-color: var(--gold); transform: translateY(-1px); }
a.card-link .card-link-arrow { opacity: 1; }
a.tag-chip-link { text-decoration: none; transition: background 0.2s ease, color 0.2s ease; }
a.tag-chip-link:hover, a.tag-chip-link:focus-visible { background: var(--gold); color: var(--accent-foreground); }
.home-trust-row a { color: inherit; text-decoration: none; border-bottom: 1px solid transparent; transition: border-color 0.2s ease; }
.home-trust-row a:hover, .home-trust-row a:focus-visible { border-bottom-color: currentColor; }
a.hero-badge-link { text-decoration: none; transition: background 0.2s ease; }
a.hero-badge-link:hover, a.hero-badge-link:focus-visible { background: rgba(18,48,47,0.6); }
.card-icon { display: inline-flex; height: 48px; width: 48px; align-items: center; justify-content: center; border-radius: 0.85rem; background: var(--secondary); color: var(--primary); margin-bottom: 16px; font-size: 1.4rem; }
.card h3 { font-size: 1.15rem; margin-top: 4px; }
.card p { margin-top: 8px; color: var(--muted-foreground); line-height: 1.6; }

.step-num { display: inline-block; height: auto; width: auto; border-radius: 0; background: none; color: var(--gold); font-family: var(--font-display); font-weight: 400; font-size: 2.75rem; line-height: 1; }

/* Pricing list */
.price-list { margin-top: 24px; border: 1px solid var(--border); border-radius: 1.25rem; background: var(--card); box-shadow: var(--shadow-card); padding: 0 24px; }
.price-item { padding: 20px 0; border-bottom: 1px solid var(--border); }
.price-item:last-child { border-bottom: none; }
.price-item-top { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; align-items: baseline; }
.price-item-top .name { font-weight: 500; }
.price-item-top .detail { margin-left: 8px; font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.05em; color: var(--muted-foreground); }
.price-item-top .price { font-family: var(--font-display); font-size: 1.4rem; font-weight: 700; color: var(--primary); }
.price-item .desc { margin-top: 4px; font-size: 0.9rem; color: var(--muted-foreground); line-height: 1.6; }

.pricing-group { border: 1px solid var(--border); border-radius: 1.25rem; background: var(--card); padding: 24px; box-shadow: var(--shadow-card); }
.pricing-group-head { display: flex; gap: 12px; align-items: flex-start; }
.pricing-group ul { margin-top: 18px; }
.pricing-group li { padding: 14px 0; border-bottom: 1px solid var(--border); }
.pricing-group li:last-child { border-bottom: none; }
.pricing-disclosure { margin-top: 16px; background: color-mix(in srgb, var(--muted) 60%, transparent); border-radius: 8px; padding: 10px 12px; font-size: 0.8rem; color: var(--muted-foreground); }

/* Compact per-card price + click-to-reveal detail (V26, 2026-08-29) --
   used to merge the old separate "Patient Services" / "Program & Specialty
   Pricing" sections so price sits directly under each service, with
   longer itemized lists (minor procedures, dosing notes) hidden until the
   patient taps to expand -- keeps cards short by default. */
.card-price { margin-top: 8px; font-family: var(--font-display); font-weight: 700; color: var(--primary); font-size: 1.2rem; }
.card-detail { margin-top: 10px; }
.card-detail summary { cursor: pointer; list-style: none; font-size: 0.8rem; font-weight: 600; color: var(--primary); text-decoration: underline; text-underline-offset: 2px; }
.card-detail summary::-webkit-details-marker { display: none; }
.card-detail[open] summary { margin-bottom: 10px; }
.card-detail ul { margin: 0; padding-left: 0; list-style: none; }
.card-detail li { padding: 8px 0; border-bottom: 1px solid var(--border); }
.card-detail li:last-child { border-bottom: none; }

/* Membership */
.tier-card { display: flex; flex-direction: column; border: 1px solid var(--border); border-radius: 1rem; background: var(--card); padding: 24px; box-shadow: var(--shadow-card); }
.tier-card .price { margin-top: 4px; font-family: var(--font-display); font-size: 1.5rem; font-weight: 600; color: var(--primary); }
.tier-card ul { margin-top: 20px; display: flex; flex-direction: column; gap: 10px; }
.tier-card li { display: flex; gap: 8px; font-size: 0.9rem; color: var(--muted-foreground); line-height: 1.5; }
.tier-card .tier-age { font-size: 0.75rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.14em; color: var(--accent); margin-bottom: 6px; }
.tier-card[id] { scroll-margin-top: 96px; }
.tier-grid { display: grid; gap: 20px; grid-template-columns: 1fr; align-items: stretch; }
@media (min-width: 900px) { .tier-grid { grid-template-columns: repeat(3, 1fr); } }

/* CTA band */
.cta-band { background: var(--teal-deep); position: relative; overflow: hidden; }
.cta-band::before, .cta-band::after { content: ""; position: absolute; border-radius: 50%; border: 1px solid rgba(247,246,239,0.16); pointer-events: none; }
.cta-band::before { width: 320px; height: 320px; top: -160px; right: -90px; }
.cta-band::after { width: 200px; height: 200px; bottom: -110px; left: 6%; }
.cta-band-inner { position: relative; z-index: 1; max-width: 650px; margin: 0 auto; padding: 72px 20px; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 20px; }
@media (min-width: 1024px) { .cta-band-inner { padding: 120px 32px; } }
.cta-band h2 { color: var(--primary-foreground); font-size: 1.75rem; }
@media (min-width: 640px) { .cta-band h2 { font-size: 2.25rem; } }
.cta-band p { color: rgba(247,246,239,0.85); font-size: 1.05rem; }

/* Tag chips (#8) */
.tag-chip-row { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; }
.tag-chip { display: inline-flex; align-items: center; padding: 8px 18px; border: 1px solid var(--gold); border-radius: 999px; font-size: 0.75rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.1em; color: var(--gold); background: color-mix(in srgb, var(--gold) 8%, transparent); }

/* Pull-quote (#6) */
.pull-quote-section { position: relative; background: var(--primary); color: var(--primary-foreground); padding: 88px 0; overflow: hidden; text-align: center; }
.pull-quote-mark { position: absolute; top: -30px; left: 50%; transform: translateX(-50%); font-family: var(--font-display); font-size: 13rem; line-height: 1; color: rgba(247,246,239,0.08); pointer-events: none; user-select: none; }
.pull-quote-text { position: relative; max-width: 720px; margin: 0 auto; font-family: var(--font-display); font-style: italic; font-weight: 500; font-size: 1.6rem; line-height: 1.45; }
@media (min-width: 640px) { .pull-quote-text { font-size: 2.05rem; } }
.pull-quote-attribution { position: relative; margin-top: 22px; font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.16em; color: rgba(247,246,239,0.68); }

/* Dark split hero with stat sidebar (#3) */
.home-hero.home-hero-dark { background: linear-gradient(150deg, var(--teal-deep) 0%, var(--primary) 100%); color: var(--primary-foreground); position: relative; overflow: hidden; }
.home-hero.home-hero-dark::before { content: none; }
.home-hero.home-hero-dark::after { content: ""; position: absolute; width: 480px; height: 480px; border-radius: 50%; border: 1px solid rgba(247,246,239,0.08); top: -220px; left: -180px; pointer-events: none; }
.home-hero-dark .eyebrow { color: var(--gold-light); }
.home-hero-dark .hero-copy h1 { color: #ffffff; }
.home-hero-dark .hero-copy .lead { color: rgba(255,255,255,0.75); }
.home-hero-dark .home-trust-row { color: rgba(255,255,255,0.55); }
.hero-badge-pill { position: relative; z-index: 1; display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border: 1px solid rgba(247,246,239,0.25); border-radius: 999px; font-size: 0.75rem; font-weight: 600; color: rgba(247,246,239,0.9); white-space: nowrap; background: rgba(18,48,47,0.35); }
.hero-badge-pill .pulse { width: 8px; height: 8px; border-radius: 999px; background: #8fd6a0; box-shadow: 0 0 0 3px rgba(143,214,160,0.28); flex: none; }

/* Full-bleed hero image with text overlaid on top (Nabla-style), homepage
   only. A single <img> is absolutely positioned behind the copy; a
   left-to-right gradient scrim over it keeps the headline readable while
   still showing the photo on the right. Mobile flips the scrim to
   top-to-bottom since the layout stacks to one column. */
.home-hero.home-hero-image { min-height: 480px; display: flex; align-items: center; padding: 48px 0; }
.home-hero.home-hero-image::before { content: none; }
.home-hero-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 35%; z-index: 0; }
/* Scrim MUST be ::after, not ::before: ::after paints after (on top of)
   the real <img> child in source order at the same z-index, while
   ::before would paint underneath the opaque photo and be invisible --
   this was why earlier contrast passes had no visible effect. */
.home-hero.home-hero-image::after { content: ""; position: absolute; inset: 0; width: auto; height: auto; border-radius: 0; border: none; pointer-events: none; z-index: 0; background: linear-gradient(100deg, rgba(10,28,28,0.98) 0%, rgba(10,28,28,0.95) 42%, rgba(10,28,28,0.78) 62%, rgba(10,28,28,0.4) 82%, rgba(10,28,28,0.15) 100%); }
.home-hero.home-hero-image .wrap { position: relative; z-index: 1; }
.home-hero-copy { max-width: 600px; }
.home-hero.home-hero-image .hero-copy h1,
.home-hero.home-hero-image .hero-copy .lead { text-shadow: 0 2px 10px rgba(0,0,0,0.55); }
@media (max-width: 800px) {
  .home-hero.home-hero-image { min-height: 420px; padding: 40px 0; }
  .home-hero-bg { object-position: center 25%; }
  .home-hero.home-hero-image::after { background: linear-gradient(180deg, rgba(10,28,28,0.55) 0%, rgba(10,28,28,0.92) 50%, rgba(10,28,28,0.98) 100%); }
  .home-hero-copy { max-width: 100%; }
}
.hero-stat-sidebar { position: relative; z-index: 1; display: flex; flex-direction: column; gap: 18px; }
.hero-stat-block { border: 1px solid rgba(247,246,239,0.18); border-radius: 2px; padding: 22px 24px; }
.hero-stat-block .num { font-family: var(--font-display); font-weight: 500; font-size: 2.4rem; color: var(--gold-light); line-height: 1; }
.hero-stat-block .label { margin-top: 6px; font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.1em; color: rgba(247,246,239,0.68); }


/* Charm booking widget */
.charm-widget { overflow: hidden; border-radius: 1rem; border: 1px solid var(--border); background: var(--card); box-shadow: var(--shadow-card); }
.charm-widget-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; border-bottom: 1px solid var(--border); background: color-mix(in srgb, var(--secondary) 60%, transparent); padding: 12px 20px; font-size: 0.875rem; font-weight: 500; }
.charm-widget iframe { width: 100%; height: 1000px; border: 0; display: block; }
.charm-widget-foot { display: flex; flex-direction: column; gap: 12px; border-top: 1px solid var(--border); background: color-mix(in srgb, var(--muted) 40%, transparent); padding: 16px 20px; }
@media (min-width: 640px) { .charm-widget-foot { flex-direction: row; align-items: center; justify-content: space-between; } }

/* Forms */
.field { margin-bottom: 18px; }
.field label { display: block; margin-bottom: 6px; font-size: 0.875rem; font-weight: 500; }
.field input, .field textarea { width: 100%; border: 1px solid var(--border); border-radius: 8px; padding: 10px 12px; font-family: var(--font-sans); font-size: 0.95rem; background: var(--background); }
.sms-optin { display: block; position: relative; padding-left: 26px; margin: 2px 0 14px; color: var(--muted-foreground); line-height: 1.45; text-align: left; cursor: pointer; }
.sms-optin input { position: absolute; left: 0; top: 2px; width: 16px; height: 16px; margin: 0; accent-color: var(--primary); }
.sms-optin a { text-decoration: underline; color: var(--primary); }
.field textarea { resize: vertical; }
.form-card { border: 1px solid var(--border); border-radius: 1.5rem; background: var(--card); padding: 32px; box-shadow: var(--shadow-card); }
.tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; background: var(--secondary); border-radius: 8px; padding: 4px; margin-bottom: 16px; }
.tabs button { border: none; background: none; padding: 8px; border-radius: 6px; font-size: 0.875rem; font-weight: 500; cursor: pointer; color: var(--muted-foreground); }
.tabs button.active { background: var(--card); color: var(--foreground); box-shadow: var(--shadow-card); }

/* FAQ (native details/summary) */
.faq-item { border-bottom: 1px solid var(--border); padding: 16px 0; }
.faq-item summary { cursor: pointer; font-family: var(--font-display); font-size: 1.1rem; font-weight: 500; list-style: none; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after { content: "+"; float: right; }
.faq-item[open] summary::after { content: "−"; }
.faq-item p { margin-top: 10px; color: var(--muted-foreground); line-height: 1.6; }

/* Services & Pricing accordions -- collapsible category/pricing groups so the page
   doesn't dump everything on the visitor at once (per Dr. Bui, V24). */
.svc-group { border: 1px solid var(--border); border-radius: 1rem; margin-top: 12px; overflow: hidden; background: var(--card); }
.svc-group summary { cursor: pointer; list-style: none; padding: 18px 20px; display: flex; align-items: center; gap: 14px; }
.svc-group summary::-webkit-details-marker { display: none; }
.svc-group summary .svc-group-title { flex: 1; }
.svc-group summary .svc-group-title h3, .svc-group summary .svc-group-title p { margin: 0; }
.svc-group summary::after { content: "+"; font-size: 1.3rem; color: var(--muted-foreground); flex: none; }
.svc-group[open] summary::after { content: "\2212"; }
.svc-group[open] summary { border-bottom: 1px solid var(--border); }
.svc-group-body { padding: 20px; }

/* Nested category accordion inside a svc-group (9/5/26, per Dr. Bui: Primary
   & Acute Care's 13 flat tiles made patients scroll too much). Lighter than
   .svc-group -- no card box, just a divider -- so it reads as a sub-section,
   not a second layer of the same card. */
.svc-subgroup { border-top: 1px solid var(--border); margin-top: 4px; padding-top: 4px; }
.svc-subgroup:first-child { border-top: none; margin-top: 0; padding-top: 0; }
.svc-subgroup summary { cursor: pointer; list-style: none; padding: 12px 4px; display: flex; align-items: center; gap: 12px; }
.svc-subgroup summary::-webkit-details-marker { display: none; }
.svc-subgroup summary h4 { flex: 1; margin: 0; font-family: var(--font-sans); font-size: 0.95rem; font-weight: 700; color: var(--primary); }
.svc-subgroup summary .card-icon { font-size: 1.1rem; }
.svc-subgroup summary::after { content: "+"; font-size: 1.2rem; color: var(--muted-foreground); flex: none; }
.svc-subgroup[open] summary::after { content: "\2212"; }
.svc-subgroup > .svc-tile-grid { padding: 4px 4px 16px; }


/* Footer */
.site-footer { border-top: 1px solid var(--border); background: var(--primary); color: var(--primary-foreground); }
.footer-inner { max-width: 1320px; margin: 0 auto; padding: 56px 20px; }
.footer-row { display: flex; flex-direction: column; gap: 40px; }
@media (min-width: 768px) { .footer-row { flex-direction: row; justify-content: space-between; } }
.footer-brand p { margin-top: 20px; font-size: 0.9rem; color: rgba(247,246,239,0.75); max-width: 280px; line-height: 1.6; }
.footer-nav { display: flex; flex-wrap: wrap; gap: 8px 32px; font-size: 0.9rem; color: rgba(247,246,239,0.8); }
.footer-nav a:hover { text-decoration: underline; }
.footer-contact { display: flex; flex-direction: column; gap: 12px; font-size: 0.9rem; color: rgba(247,246,239,0.8); }
.site-footer .muted { color: rgba(247,246,239,0.65); }
.footer-contact li { display: flex; align-items: flex-start; gap: 8px; }
.footer-areas { margin-top: 32px; padding-top: 20px; border-top: 1px solid rgba(247,246,239,0.15); display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; font-size: 0.72rem; color: rgba(247,246,239,0.55); }
.footer-areas-label { text-transform: uppercase; letter-spacing: 0.05em; }
.footer-areas a:hover { text-decoration: underline; color: rgba(247,246,239,0.8); }
.footer-legal { margin-top: 40px; border-top: 1px solid rgba(247,246,239,0.15); padding-top: 24px; display: flex; flex-wrap: wrap; gap: 8px 20px; font-size: 0.75rem; color: rgba(247,246,239,0.6); }
.footer-legal a:hover { text-decoration: underline; }
.footer-legal .pending { border: 1px solid rgba(247,246,239,0.35); border-radius: 999px; padding: 2px 8px; font-size: 0.65rem; text-transform: uppercase; letter-spacing: 0.05em; }

/* Footer mini service-area map (SVG, no external tiles/API key -- links to
   the real interactive map on service-areas.html), added 2026-09-10 */
.footer-mini-map { display: inline-flex; align-items: center; gap: 12px; }
.footer-mini-map-svg { flex: none; }
.footer-mini-map-bg { fill: rgba(247,246,239,0.08); stroke: rgba(247,246,239,0.18); transition: stroke 0.2s ease; }
.footer-mini-map-ring-outer { fill: var(--gold-light); opacity: 0.16; }
.footer-mini-map-ring-inner { fill: var(--gold-light); opacity: 0.28; }
.footer-mini-map-dot { fill: rgba(247,246,239,0.55); }
.footer-mini-map-pin { fill: var(--accent); }
.footer-mini-map-pin-hole { fill: var(--primary); }
.footer-mini-map span { line-height: 1.4; }
.footer-mini-map:hover .footer-mini-map-bg { stroke: rgba(247,246,239,0.4); }
.footer-mini-map:hover span { text-decoration: underline; }

.footer-bottom { margin-top: 16px; display: flex; flex-direction: column; gap: 10px; font-size: 0.75rem; color: rgba(247,246,239,0.65); }
@media (min-width: 640px) { .footer-bottom { flex-direction: row; align-items: center; justify-content: space-between; } }

/* Emergency banner */
.banner { border-top: 1px solid color-mix(in srgb, var(--accent) 30%, transparent); border-bottom: 1px solid color-mix(in srgb, var(--accent) 30%, transparent); background: color-mix(in srgb, var(--accent) 10%, transparent); }
.banner-inner { max-width: 1320px; margin: 0 auto; padding: 16px 20px; display: flex; gap: 12px; font-size: 0.9rem; }
@media (min-width: 1024px) { .banner-inner { padding: 16px 32px; } }

/* Waitlist / welcome modal */
.modal-overlay { position: fixed; inset: 0; z-index: 100; display: none; align-items: center; justify-content: center; padding: 16px; background: rgba(31,41,51,0.5); backdrop-filter: blur(2px); }
.modal-overlay.open { display: flex; }
.modal-box { position: relative; width: 100%; max-width: 460px; max-height: calc(100vh - 32px); overflow-y: auto; border-radius: 1.5rem; border: 1px solid var(--border); background: var(--card); box-shadow: var(--shadow-soft); }
.modal-close { position: absolute; right: 14px; top: 14px; height: 32px; width: 32px; border-radius: 999px; border: none; background: rgba(255,255,255,0.8); cursor: pointer; }
.modal-head { background: var(--gradient-hero); color: var(--primary-foreground); padding: 28px; }
.modal-body { padding: 24px 28px; }
.badge-pill { display: inline-flex; align-items: center; gap: 6px; border-radius: 999px; background: rgba(255,255,255,0.15); padding: 4px 12px; font-size: 0.7rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.1em; }

.text-center { text-align: center; }
.mt-8 { margin-top: 32px; }
.mt-12 { margin-top: 48px; }
.muted { color: var(--muted-foreground); }
.small { font-size: 0.85rem; }
.coming-soon { display: inline-flex; align-items: center; gap: 4px; border-radius: 999px; background: color-mix(in srgb, var(--accent) 15%, transparent); padding: 2px 8px; font-size: 0.62rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; color: var(--accent-foreground); }

/* ==========================================================================
   Pricing & Appointment Wizard (Skill 13, added 8/14/26)
   Rule-based, no AI/LLM, no free-text input, no data leaves the browser.
   ========================================================================== */

/* V37 (2026-09-06): recolored to accent gold (was primary teal, same as
   every booking button) so Ava reads as a visually distinct "get help
   choosing" action rather than competing with "Book an Appointment", and
   given a subtle pulsing ring (guarded by prefers-reduced-motion) so it's
   genuinely noticeable without being distracting. Copy is now two lines
   ("Not sure what you need?" / "Ask Ava") per Dr. Bui's spec. */
.ltw-launcher { position: fixed; bottom: 24px; right: 24px; z-index: 9998; display: flex; align-items: center; gap: 10px; padding: 12px 20px; border: none; border-radius: 999px; background: var(--accent); color: var(--accent-foreground); font-family: var(--font-sans); font-size: 0.85rem; font-weight: 600; letter-spacing: 0.01em; cursor: pointer; box-shadow: var(--shadow-soft), 0 0 0 0 color-mix(in srgb, var(--accent) 55%, transparent); transition: all 0.15s ease; animation: ltw-pulse 2.6s ease-in-out infinite; }
.ltw-launcher:hover { background: color-mix(in srgb, var(--accent) 88%, black); transform: translateY(-2px); animation-play-state: paused; }
.ltw-launcher svg { width: 20px; height: 20px; flex: none; }
.ltw-launcher-text { display: flex; flex-direction: column; align-items: flex-start; line-height: 1.2; text-align: left; }
.ltw-launcher-text strong { font-size: 0.72rem; font-weight: 700; opacity: 0.85; }
@keyframes ltw-pulse {
  0%, 100% { box-shadow: var(--shadow-soft), 0 0 0 0 color-mix(in srgb, var(--accent) 45%, transparent); }
  50% { box-shadow: var(--shadow-soft), 0 0 0 10px color-mix(in srgb, var(--accent) 0%, transparent); }
}
@media (prefers-reduced-motion: reduce) { .ltw-launcher { animation: none; } }

.ltw-overlay { position: fixed; inset: 0; z-index: 9999; background: rgba(31, 41, 51, 0.5); backdrop-filter: blur(2px); display: none; align-items: flex-end; justify-content: flex-end; }
.ltw-overlay.ltw-open { display: flex; }

/* Panel gets its own tinted ground (9/5/26, per Dr. Bui: "chatbot background
   should be different color to stand out more") -- it was var(--card), which
   is pure white, same as most page cards, so the open widget blended into
   whatever page it opened over. Now a soft teal tint distinct from both the
   ivory page background and white cards. */
.ltw-panel { width: 100%; max-width: 420px; height: 100%; max-height: 100vh; background: color-mix(in srgb, var(--primary) 7%, #ffffff); display: flex; flex-direction: column; box-shadow: var(--shadow-soft); border: 1px solid color-mix(in srgb, var(--primary) 20%, var(--border)); }
@media (min-width: 480px) { .ltw-panel { height: min(680px, 92vh); margin: 24px; border-radius: 1.5rem; overflow: hidden; } }

.ltw-header { background: var(--gradient-hero); color: var(--primary-foreground); padding: 18px 20px; display: flex; align-items: center; justify-content: space-between; flex: none; }
.ltw-header-id { display: flex; align-items: center; gap: 10px; }
.ltw-avatar { width: 34px; height: 34px; border-radius: 999px; overflow: hidden; display: flex; align-items: center; justify-content: center; flex: none; background: var(--secondary); }
.ltw-avatar img { width: 100%; height: 100%; display: block; object-fit: cover; }
.ltw-header h2 { margin: 0; font-family: var(--font-display); font-size: 1.05rem; font-weight: 600; }
.ltw-header p { margin: 2px 0 0; font-size: 0.75rem; opacity: 0.85; }
.ltw-close { background: rgba(255,255,255,0.15); border: none; color: var(--primary-foreground); font-size: 20px; line-height: 1; cursor: pointer; height: 32px; width: 32px; border-radius: 999px; flex: none; }
.ltw-close:hover { background: rgba(255,255,255,0.25); }

.ltw-safety { background: color-mix(in srgb, var(--accent) 10%, transparent); border-bottom: 1px solid color-mix(in srgb, var(--accent) 30%, transparent); color: var(--muted-foreground); font-size: 0.72rem; line-height: 1.5; padding: 8px 20px; flex: none; }

.ltw-body { flex: 1; overflow-y: auto; padding: 20px; display: flex; flex-direction: column; gap: 14px; background: color-mix(in srgb, var(--primary) 4%, #ffffff); }

.ltw-bubble { max-width: 92%; border-radius: 1rem; padding: 12px 14px; font-size: 0.875rem; line-height: 1.55; }
.ltw-bubble.ltw-bot { background: var(--secondary); color: var(--foreground); align-self: flex-start; border-bottom-left-radius: 4px; }
.ltw-bubble.ltw-bot strong { color: var(--secondary-foreground); }
.ltw-bubble.ltw-user { background: var(--primary); color: var(--primary-foreground); align-self: flex-end; border-bottom-right-radius: 4px; }
.ltw-bubble.ltw-user strong { color: inherit; }

.ltw-inputrow { flex: none; padding: 12px 14px; border-top: 1px solid var(--border); display: flex; gap: 8px; background: var(--card); }
.ltw-inputrow input { flex: 1; min-width: 0; border: 1px solid var(--border); border-radius: 999px; padding: 10px 15px; font-family: var(--font-sans); font-size: 0.86rem; color: var(--foreground); background: var(--background); }
.ltw-inputrow input:focus-visible { outline: 2px solid var(--primary); outline-offset: 1px; }
.ltw-inputrow button { flex: none; width: 38px; height: 38px; border-radius: 999px; padding: 0; display: flex; align-items: center; justify-content: center; }

.ltw-typing { display: flex; gap: 4px; padding: 4px 2px; align-self: flex-start; }
.ltw-typing span { width: 6px; height: 6px; border-radius: 999px; background: var(--muted-foreground); opacity: 0.5; animation: ltw-blink 1.1s infinite ease-in-out; }
.ltw-typing span:nth-child(2) { animation-delay: 0.15s; }
.ltw-typing span:nth-child(3) { animation-delay: 0.3s; }
@keyframes ltw-blink { 0%, 80%, 100% { opacity: 0.3; } 40% { opacity: 0.9; } }
@media (prefers-reduced-motion: reduce) { .ltw-typing span { animation: none; } }

.ltw-crumb { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 6px; font-size: 0.7rem; color: var(--muted-foreground); }
.ltw-crumb span { white-space: nowrap; }
.ltw-crumb-sep { opacity: 0.5; }

.ltw-choices { display: flex; flex-direction: column; gap: 8px; }
.ltw-choice-btn { text-align: left; background: var(--card); border: 1px solid var(--border); color: var(--foreground); border-radius: 10px; padding: 10px 14px; font-family: var(--font-sans); font-size: 0.85rem; cursor: pointer; transition: all 0.12s ease; }
.ltw-choice-btn:hover { border-color: var(--primary); background: var(--secondary); }

.ltw-typebox { margin-top: 6px; display: flex; flex-direction: column; gap: 6px; }
.ltw-typebox-label { font-size: 0.72rem; color: var(--muted-foreground); }
.ltw-typebox-row { display: flex; gap: 8px; }
.ltw-typebox-row input[type="text"] { flex: 1; min-width: 0; border: 1px solid var(--border); border-radius: 10px; padding: 10px 12px; font-family: var(--font-sans); font-size: 0.85rem; color: var(--foreground); background: var(--card); }
.ltw-typebox-row input[type="text"]:focus-visible { outline: 2px solid var(--primary); outline-offset: 1px; }
.ltw-typebox-row .btn { flex: none; }
.ltw-typebox-examples { font-size: 0.68rem; color: var(--muted-foreground); line-height: 1.5; margin: 0; }

.ltw-why, .ltw-how { margin-top: 8px; font-size: 0.85rem; line-height: 1.5; }
.ltw-emergency { background: var(--secondary); border: 1px solid var(--border); border-radius: 0.75rem; padding: 10px 12px; line-height: 1.55; }

.ltw-estimate { border: 1px solid var(--border); border-radius: 1.25rem; padding: 16px 18px; background: var(--card); box-shadow: var(--shadow-card); }
.ltw-estimate h3 { margin: 0 0 8px; font-family: var(--font-display); font-size: 1rem; color: var(--foreground); }
.ltw-line { display: flex; justify-content: space-between; gap: 12px; font-size: 0.82rem; color: var(--muted-foreground); padding: 3px 0; }
.ltw-line.ltw-total { border-top: 1px solid var(--border); margin-top: 6px; padding-top: 8px; font-weight: 700; color: var(--foreground); }
.ltw-disclaimer { font-size: 0.72rem; color: var(--muted-foreground); margin-top: 10px; line-height: 1.6; }

.ltw-cta-row { display: flex; gap: 8px; margin-top: 4px; flex-wrap: wrap; }
.ltw-cta-row .btn { flex: 1 1 auto; }

.ltw-restart { align-self: center; background: none; border: none; color: var(--muted-foreground); font-size: 0.75rem; text-decoration: underline; cursor: pointer; margin-top: 4px; font-family: var(--font-sans); }

/* Ava launcher placement (9/23/26): never cover content. The JS in
   finchwell-pricing-wizard.js sets --ltw-lift (height of any fixed bottom
   bar) and toggles .ltw-launcher-hidden when a price, card, or button is
   under the launcher. At 768px and below it shrinks to an icon-only circle,
   and the footer gets extra bottom padding so the last lines scroll clear. */
.ltw-launcher { bottom: calc(24px + var(--ltw-lift, 0px)); }
.ltw-launcher.ltw-launcher-hidden { opacity: 0; pointer-events: none; transform: translateY(8px) scale(0.9); animation: none; }
@media (max-width: 768px) {
  .ltw-launcher-text { display: none; }
  .ltw-launcher { width: 44px; height: 44px; padding: 0; justify-content: center; right: 12px; bottom: calc(12px + var(--ltw-lift, 0px)); }
  body.ltw-has-launcher .site-footer .footer-inner { padding-bottom: 80px; }
}

/* ===== Homepage redesign: approved 8/26/26 (scoped to index.html only, .home- prefix) ===== */
.home-hero { position: relative; overflow: hidden; background: linear-gradient(180deg, var(--background) 0%, var(--background) 62%, var(--secondary) 100%); }
.home-hero::before { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 40%; background: linear-gradient(180deg, transparent 0%, color-mix(in srgb, var(--accent) 30%, transparent) 100%); clip-path: polygon(0 38%, 18% 30%, 38% 42%, 58% 22%, 78% 36%, 100% 18%, 100% 100%, 0 100%); pointer-events: none; }
.home-hero .hero-grid { position: relative; z-index: 1; }
/* V27 (2026-09-03, per Dr. Bui): hero copy read as flush against the edge on
   narrow screens -- give the homepage hero its own wider side padding so
   there is visible background room before the text starts, without
   touching the shared .wrap padding used site-wide. */
.home-hero .wrap { padding-left: 28px; padding-right: 28px; }
@media (min-width: 640px) { .home-hero .wrap { padding-left: 32px; padding-right: 32px; } }
@media (min-width: 1024px) { .home-hero .wrap { padding-left: 40px; padding-right: 40px; } }
.home-hero .hero-copy h1 { font-size: clamp(2.15rem, 1.5rem + 2.6vw, 3.15rem); margin-top: 14px; }
.home-hero .hero-copy .lead { font-size: clamp(1.02rem, 0.95rem + 0.3vw, 1.15rem); max-width: 46ch; }
.home-diff-row { margin-top: 20px; display: flex; flex-wrap: wrap; gap: 10px; }
.home-diff-chip { display: inline-flex; align-items: center; gap: 6px; background: var(--card); border: 1px solid var(--border); padding: 7px 13px; border-radius: 999px; font-size: 0.8rem; font-weight: 600; color: var(--primary); box-shadow: var(--shadow-card); }
.home-diff-chip .dot { width: 6px; height: 6px; border-radius: 999px; background: var(--sage); flex: none; }
.home-hero-visual { position: relative; }
.home-hero-badge { position: absolute; left: 16px; bottom: 16px; background: rgba(31,41,51,0.82); backdrop-filter: blur(6px); color: var(--background); padding: 10px 14px; border-radius: 12px; font-size: 0.78rem; font-weight: 600; display: flex; align-items: center; gap: 8px; }
.home-hero-badge .pulse { width: 8px; height: 8px; border-radius: 999px; background: #8fd6a0; box-shadow: 0 0 0 3px rgba(143,214,160,0.28); flex: none; }

.home-trio { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr; gap: 1px; background: var(--border); border: 1px solid var(--border); border-radius: 16px; overflow: hidden; margin: 28px 0 40px; }
@media (min-width: 780px) { .home-trio { grid-template-columns: repeat(3,1fr); } }
.home-trio-item { background: var(--card); padding: 22px 24px; }
.home-trio-item .k { font-size: 0.68rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--warm-taupe); }
.home-trio-item h3 { margin-top: 8px; font-size: 1.05rem; }
.home-trio-item p { margin-top: 6px; font-size: 0.88rem; color: var(--muted-foreground); }

.home-problem-grid { margin-top: 36px; display: grid; grid-template-columns: 1fr; gap: 14px; }
@media (min-width: 780px) { .home-problem-grid { grid-template-columns: repeat(2,1fr); } }
.home-problem-item { display: flex; gap: 12px; align-items: flex-start; background: var(--card); border: 1px solid var(--border); border-radius: 14px; padding: 16px 18px; }
.home-problem-item .x { color: #b5533f; font-size: 1.1rem; line-height: 1.4; flex: none; }
.home-problem-item p { font-weight: 560; font-family: var(--font-display); font-size: 1rem; }
.home-problem-close { margin-top: 28px; font-family: var(--font-display); font-size: 1.3rem; color: var(--primary); text-align: center; }

.home-diff-cards { margin-top: 36px; display: grid; grid-template-columns: 1fr; gap: 20px; }
@media (min-width: 780px) { .home-diff-cards { grid-template-columns: repeat(3,1fr); } }
.home-diff-card { background: var(--card); border-radius: 16px; padding: 26px 24px; box-shadow: var(--shadow-card); border-top: 3px solid var(--sage); }
.home-diff-card:nth-child(2) { border-top-color: var(--dusty-blue); }
.home-diff-card:nth-child(3) { border-top-color: var(--accent); }
.home-diff-card .num { font-family: var(--font-display); font-size: 1.6rem; color: var(--border); }
.home-diff-card h3 { margin-top: 10px; font-size: 1.1rem; }
.home-diff-card p { margin-top: 8px; font-size: 0.92rem; color: var(--muted-foreground); }

.home-how-row { margin-top: 36px; display: grid; grid-template-columns: 1fr; gap: 32px; align-items: center; }
@media (min-width: 900px) { .home-how-row { grid-template-columns: 0.9fr 1.1fr; } }
.home-how-photo { width: 100%; border-radius: 18px; overflow: hidden; box-shadow: var(--shadow-card); aspect-ratio: 4/5; border: 6px solid var(--card); max-height: 480px; margin: 0 auto; }
.home-how-photo img { width: 100%; height: 100%; object-fit: cover; }
.home-how-steps { display: flex; flex-direction: column; gap: 18px; }
.home-how-step { display: flex; gap: 14px; }
.home-how-step .n { flex: none; width: 30px; height: 30px; border-radius: 999px; background: var(--primary); color: var(--primary-foreground); display: flex; align-items: center; justify-content: center; font-size: 0.85rem; font-weight: 700; font-family: var(--font-display); }
.home-how-step h3 { font-size: 1rem; }
.home-how-step p { margin-top: 4px; font-size: 0.9rem; color: var(--muted-foreground); }

.home-service-groups { margin-top: 36px; display: flex; flex-direction: column; gap: 32px; }
.home-service-group-label { font-family: var(--font-display); font-size: 1rem; font-weight: 600; color: var(--foreground); margin-bottom: 14px; }
.home-service-groups .home-service-grid { margin-top: 0; }
.home-service-grid { margin-top: 36px; display: grid; grid-template-columns: 1fr; gap: 16px; }
@media (min-width: 640px) { .home-service-grid { grid-template-columns: repeat(2,1fr); } }
@media (min-width: 1024px) { .home-service-grid { grid-template-columns: repeat(4,1fr); } }
.home-service-card { background: var(--card); border: 1px solid var(--border); border-radius: 14px; padding: 20px; }
.home-service-card .ic { width: 38px; height: 38px; border-radius: 10px; background: var(--secondary); display: flex; align-items: center; justify-content: center; font-size: 1.1rem; }
.home-service-card h3 { margin-top: 12px; font-size: 0.98rem; }
.home-service-card p { margin-top: 6px; font-size: 0.85rem; color: var(--muted-foreground); }

.home-member-box { margin-top: 0; background: var(--primary); color: var(--primary-foreground); border-radius: 22px; padding: 40px 32px; position: relative; overflow: hidden; }
.home-member-box::after { content: ''; position: absolute; right: -60px; top: -60px; width: 220px; height: 220px; border-radius: 999px; background: radial-gradient(circle, color-mix(in srgb, var(--accent) 28%, transparent), transparent 70%); }
.home-member-grid { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr; gap: 28px; }
@media (min-width: 860px) { .home-member-grid { grid-template-columns: 1fr 1fr; align-items: center; } }
.home-member-box .eyebrow { color: var(--accent); }
.home-member-box h2 { margin-top: 10px; color: var(--primary-foreground); font-size: clamp(1.5rem, 1.2rem + 1vw, 2rem); }
.home-member-box .price { font-family: var(--font-display); font-size: 2.4rem; margin-top: 14px; }
.home-member-box .price span { font-size: 1rem; font-family: var(--font-sans); font-weight: 500; opacity: 0.75; }
.home-member-list { margin-top: 16px; display: flex; flex-direction: column; gap: 8px; font-size: 0.9rem; }
.home-member-list li { display: flex; gap: 8px; align-items: flex-start; opacity: 0.92; }
.home-member-note { margin-top: 18px; font-size: 0.82rem; opacity: 0.7; }
/* Homepage membership band, three options (9/24/26). */
.home-member-head, .home-member-options, .home-member-foot { position: relative; z-index: 1; }
.home-member-options { margin-top: 22px; display: grid; grid-template-columns: 1fr; gap: 12px; }
@media (min-width: 760px) { .home-member-options { grid-template-columns: repeat(3, 1fr); } }
.home-member-option { position: relative; display: flex; flex-direction: column; gap: 2px; padding: 16px 44px 16px 18px; border: 1px solid rgba(247,246,239,0.22); border-radius: 14px; background: rgba(247,246,239,0.06); color: var(--primary-foreground); text-decoration: none; transition: background 0.2s ease, border-color 0.2s ease, transform 0.2s ease; }
.home-member-option:hover, .home-member-option:focus-visible, .home-member-option:active { background: rgba(247,246,239,0.14); border-color: rgba(247,246,239,0.5); transform: translateY(-2px); }
.home-member-option:focus-visible { outline: 2px solid var(--accent-foreground); outline-offset: 2px; }
.hmo-name { font-weight: 700; font-size: 1rem; }
.hmo-price { font-family: var(--font-display); font-size: 1.7rem; line-height: 1.2; }
.hmo-price small { font-family: var(--font-sans); font-size: 0.85rem; opacity: 0.75; }
.hmo-who { font-size: 0.82rem; opacity: 0.8; }
.hmo-arrow { position: absolute; right: 16px; top: 50%; transform: translateY(-50%); font-weight: 700; color: var(--gold-light); transition: transform 0.2s ease; }
.home-member-option:hover .hmo-arrow { transform: translate(4px, -50%); }
.home-member-foot { margin-top: 22px; display: flex; flex-wrap: wrap; align-items: center; gap: 14px 22px; }
.home-member-foot .home-member-note { margin-top: 0; flex: 1 1 280px; font-size: 0.88rem; opacity: 0.85; }
/* Homepage "Meet the Finchwell Medical Team" band, now one clickable card. */
a.team-band-card { max-width: 760px; margin: 0 auto; text-align: center; padding: 40px 48px; }
.team-band-card h2 { margin-top: 12px; }
.team-band-card p.muted { margin-top: 14px; font-size: 1.05rem; }
.team-band-cta { margin-top: 24px; pointer-events: none; }
a.team-band-card:hover .team-band-cta { background: var(--secondary); }
@media (max-width: 640px) { a.team-band-card { padding: 32px 24px; } }

/* ===== Homepage v7 additions: reviewer pass, approved 8/26/26 ===== */
.home-trust-row { margin-top: 18px; font-size: 0.85rem; font-weight: 600; color: var(--muted-foreground); letter-spacing: 0.01em; }
.home-diff-cards-4 { grid-template-columns: 1fr; }
@media (min-width: 640px) { .home-diff-cards-4 { grid-template-columns: repeat(2,1fr); } }
@media (min-width: 1024px) { .home-diff-cards-4 { grid-template-columns: repeat(4,1fr); } }
.home-org-band { background: var(--secondary); border-radius: 22px; padding: 48px 40px; text-align: center; }
@media (min-width: 1024px) { .home-org-band { padding: 56px 48px; } }

/* ===== Footer restructure: v8, approved 8/26/26 ===== */
.footer-columns { display: grid; grid-template-columns: repeat(2, 1fr); gap: 28px 32px; flex: 2 1 420px; }
@media (min-width: 640px) { .footer-columns { grid-template-columns: repeat(4, 1fr); } }
.footer-col h4 { font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; color: rgba(247,246,239,0.5); margin-bottom: 12px; }
.footer-col a { display: block; font-size: 0.88rem; color: rgba(247,246,239,0.82); padding: 4px 0; }
.footer-col a:hover { text-decoration: underline; }

/* ===== Team page: photo appears exactly once sitewide, approved 8/26/26 ===== */
.team-card { display: flex; flex-direction: column; gap: 24px; align-items: flex-start; background: var(--card); border: 1px solid var(--border); border-radius: 1.25rem; padding: 32px; box-shadow: var(--shadow-card); }
@media (min-width: 640px) { .team-card { flex-direction: row; align-items: center; } }
.team-photo { flex: none; width: 180px; height: 180px; border-radius: 999px; overflow: hidden; box-shadow: var(--shadow-card); margin: 0 auto; }
@media (min-width: 640px) { .team-photo { margin: 0; } }
.team-photo img { width: 100%; height: 100%; object-fit: cover; }
.team-info { text-align: center; }
@media (min-width: 640px) { .team-info { text-align: left; } }
.team-badges { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
@media (min-width: 640px) { .team-badges { justify-content: flex-start; } }
.team-badges .badge-pill { background: var(--card); border: 1px solid var(--border); font-size: 0.72rem; }

/* ===== Team page redesign: prominent Mission/Vision with photo inlay,
   clickable circular-photo team roster grid (Bravo-style), 2026-09-10.
   Old .team-card/.team-photo rules above are kept for now (still valid
   circular-crop pattern) even though team.html no longer uses them
   directly -- the roster grid below reuses the same visual language. ===== */
.mission-vision { display: grid; grid-template-columns: 1fr; gap: 32px; align-items: center; }
@media (min-width: 800px) { .mission-vision { grid-template-columns: 0.85fr 1.15fr; gap: 48px; } }
.mv-visual { position: relative; max-width: 420px; margin: 0 auto; }
@media (min-width: 800px) { .mv-visual { margin: 0; } }
.mv-visual-accent { position: absolute; inset: 20px -20px -20px 20px; background: var(--accent); border-radius: 1.5rem; z-index: 0; }
.mv-visual-photo { position: relative; z-index: 1; display: block; width: 100%; border-radius: 1.5rem; box-shadow: var(--shadow-card); }
.mv-copy { display: flex; flex-direction: column; gap: 28px; }
.mv-block .eyebrow { margin-bottom: 8px; }
.mv-statement { font-family: var(--font-display); font-size: 1.35rem; line-height: 1.5; color: var(--primary); margin: 0; }

.team-roster-grid { display: grid; grid-template-columns: 1fr; gap: 20px; max-width: 420px; margin: 0 auto; }
@media (min-width: 640px) { .team-roster-grid { grid-template-columns: repeat(auto-fit, minmax(240px, 340px)); justify-content: center; max-width: none; } }
.team-roster-card { background: var(--card); border: 1px solid var(--border); border-radius: 1.25rem; box-shadow: var(--shadow-card); overflow: hidden; }
.team-roster-trigger { width: 100%; background: none; border: none; cursor: pointer; padding: 28px 24px; display: flex; flex-direction: column; align-items: center; gap: 4px; text-align: center; font-family: var(--font-sans); }
.team-roster-photo-wrap { width: 130px; height: 130px; border-radius: 999px; overflow: hidden; box-shadow: var(--shadow-card); margin-bottom: 12px; transition: width 0.25s ease, height 0.25s ease, border-radius 0.25s ease; }
.team-roster-card.is-expanded .team-roster-photo-wrap { width: 200px; height: 250px; border-radius: 0.85rem; }
.team-roster-photo { width: 100%; height: 100%; object-fit: cover; }
.team-roster-name { font-weight: 700; color: var(--primary); font-size: 1.05rem; }
.team-roster-role { color: var(--muted-foreground); font-size: 0.9rem; }
.team-roster-hint { margin-top: 6px; font-size: 0.8rem; font-weight: 600; color: var(--accent); }
.team-roster-detail { padding: 0 24px 28px; text-align: left; }
.team-roster-bio { display: flex; flex-direction: column; gap: 12px; color: var(--muted-foreground); line-height: 1.7; }
/* About page founder card (9/23/26): horizontal layout so the full bio is
   visible without scrolling or clicking; stacks on narrow phones. */
.nt-intro-list { margin-top: 14px; padding-left: 20px; list-style: disc; display: flex; flex-direction: column; gap: 6px; color: var(--muted-foreground); font-size: 1rem; line-height: 1.55; }
.team-feature-card { display: grid; grid-template-columns: 170px 1fr; gap: 36px; align-items: center; max-width: 920px; margin: 40px auto 0; padding: 36px 40px; background: var(--card); border: 1px solid var(--border); border-radius: 1.25rem; box-shadow: var(--shadow-card); }
.team-feature-photo { width: 170px; height: 170px; border-radius: 999px; overflow: hidden; box-shadow: var(--shadow-card); }
.team-feature-photo img { width: 100%; height: 100%; object-fit: cover; }
.team-feature-name { font-family: var(--font-display); font-size: 1.6rem; font-weight: 600; color: var(--primary); line-height: 1.2; }
.team-feature-role { margin-top: 2px; color: var(--muted-foreground); font-size: 0.95rem; }
.team-feature-info .team-badges { justify-content: flex-start; }
.team-feature-bio { margin-top: 14px; display: flex; flex-direction: column; gap: 10px; color: var(--muted-foreground); line-height: 1.65; }
@media (max-width: 640px) {
  .team-feature-card { grid-template-columns: 1fr; gap: 20px; padding: 28px 22px; text-align: center; }
  .team-feature-photo { width: 140px; height: 140px; margin: 0 auto; }
  .team-feature-info .team-badges { justify-content: center; }
  .team-feature-bio { text-align: left; }
}

/* Service Areas: coverage legend, real Leaflet map, city list
   (V7, 8/27/26; map rebuilt on real geography V8, 8/27/26; clinic markers
   for the Albuquerque/Rio Rancho rented partner spaces added 8/27/26) */
.sa-legend { display: grid; grid-template-columns: 1fr; gap: 16px; }
@media (min-width: 640px) { .sa-legend { grid-template-columns: repeat(2,1fr); } }
@media (min-width: 640px) { .sa-legend-3 { grid-template-columns: repeat(3,1fr); } }
.sa-legend-item { display: flex; gap: 12px; align-items: flex-start; background: var(--card); border: 1px solid var(--border); border-radius: 14px; padding: 16px; }
.sa-legend-item strong { font-family: var(--font-display); font-size: 1rem; }
.sa-legend-item p { margin-top: 4px; font-size: 0.85rem; color: var(--muted-foreground); }
.sa-legend-dot { flex: none; width: 36px; height: 36px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 1.05rem; }
.sa-dot-tele { background: var(--dusty-blue); }
.sa-dot-home { background: var(--sage); }
.sa-dot-clinic { background: var(--accent); }

/* Real interactive Leaflet + OpenStreetMap map (V8, 2026-08-27): replaces
   the prior decorative inline-SVG map entirely. Map is the primary element;
   the city list below it is secondary. No fixed clinic ADDRESS is ever
   shown. The two clinic markers below mark rented partner-space cities
   only (see master plan + CharmHealth GFE docs). */
.sa-map-wrap { max-width: 900px; margin: 0 auto; position: relative; isolation: isolate; }
#sa-leaflet-map { width: 100%; height: 460px; border-radius: 1.25rem; border: 1px solid var(--border); box-shadow: var(--shadow-card); background: var(--secondary); }
@media (max-width: 640px) { #sa-leaflet-map { height: 340px; border-radius: 0.85rem; } }
#sa-leaflet-map-contact { width: 100%; height: 280px; border-radius: 1.25rem; border: 1px solid var(--border); box-shadow: var(--shadow-card); background: var(--secondary); }
.sa-map-note { font-size: 0.8rem; color: var(--muted-foreground); margin-top: 10px; text-align: center; }
.leaflet-popup-content { font-family: var(--font-sans); font-size: 0.85rem; }
.leaflet-popup-content strong { font-family: var(--font-display); font-size: 0.95rem; }
.sa-clinic-pin { width: 28px; height: 28px; border-radius: 50%; background: var(--accent); border: 2px solid var(--card); box-shadow: var(--shadow-card); display: flex; align-items: center; justify-content: center; font-size: 0.95rem; }

.sa-city-list { display: grid; grid-template-columns: 1fr; gap: 10px; max-width: 640px; margin-left: auto; margin-right: auto; }
@media (min-width: 640px) { .sa-city-list { grid-template-columns: repeat(2,1fr); } }
.sa-city-card { background: var(--card); border: 1px solid var(--border); border-radius: 12px; padding: 12px 16px; }
.sa-city-card summary { cursor: pointer; font-family: var(--font-display); }
.sa-city-card p { margin-top: 8px; font-size: 0.85rem; color: var(--muted-foreground); }

/* --- home-testimonials (V13) --- */
.home-testimonial-grid { }
.home-testimonial-card { text-align: center; border-style: dashed; opacity: 0.85; }
.home-testimonial-card .card-icon { margin-left: auto; margin-right: auto; font-size: 1.6rem; font-family: var(--font-display); }
.home-testimonial-quote { font-style: italic; color: var(--muted-foreground); }

/* ==========================================================================
   V37 (2026-09-06): Services & Pricing IA rebuild.
   "What can we help you with?" interactive category selector, status
   badges, membership callout, and the "View Full Pricing" secondary view.
   ========================================================================== */

/* One-word page-heading treatment (services.html hero): bigger, simpler,
   less vertical space than the old two-line "Healthcare Services & Pricing"
   heading it replaces. */
.page-hero-oneword h1 { font-size: clamp(2.4rem, 5vw, 3.4rem); margin-top: 4px; }

/* Small contextual membership nudge shown near the top of the selector,
   distinct from (and much lighter than) the full membership section
   further down the page. */
.care-callout { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; background: color-mix(in srgb, var(--primary) 8%, var(--card)); border: 1px solid color-mix(in srgb, var(--primary) 20%, var(--border)); border-radius: 0.85rem; padding: 14px 18px; margin: 18px 0 26px; font-size: 0.92rem; }
.care-callout a { font-weight: 700; color: var(--primary); white-space: nowrap; }

/* Category chip row: segmented-control style, wraps on mobile, large
   touch targets, non-color-dependent selected state (border + weight +
   check glyph, not color alone). */
.care-chips { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; }
.care-chip {
  display: inline-flex; align-items: center; gap: 8px; padding: 12px 18px;
  border-radius: 999px; border: 1.5px solid var(--border); background: var(--card);
  font-family: var(--font-sans); font-size: 0.88rem; font-weight: 600; color: var(--foreground);
  cursor: pointer; transition: all 0.15s ease; min-height: 44px;
}
.care-chip .chip-icon { font-size: 1.05rem; line-height: 1; }
.care-chip:hover { border-color: var(--primary); }
.care-chip:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
.care-chip[aria-selected="true"] { background: var(--primary); border-color: var(--primary); color: var(--primary-foreground); font-weight: 700; }
.care-chip[aria-selected="true"]::after { content: "\2713"; font-size: 0.8rem; }
.care-chip.care-chip-ava { border-style: dashed; border-color: var(--accent); color: var(--accent-foreground); background: color-mix(in srgb, var(--accent) 12%, var(--card)); }
.care-chip.care-chip-ava:hover { border-color: var(--accent); }

/* Progressive-disclosure panel: appears in place under the chip row, no
   page navigation, no full-page reflow. */
.care-panel { margin-top: 22px; }
.care-panel[hidden] { display: none; }
.care-panel-head { margin-bottom: 14px; }
.care-panel-head h3 { font-size: 1.2rem; margin: 0; }
.care-panel-head p { margin-top: 4px; }
.care-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 14px; }
.care-card { border: 1px solid var(--border); border-radius: 0.9rem; background: var(--card); padding: 16px 18px; display: flex; flex-direction: column; gap: 8px; }
.care-card-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.care-card-top h4 { margin: 0; font-size: 1rem; font-family: var(--font-sans); font-weight: 700; }
.care-card-price { font-family: var(--font-display); font-weight: 700; color: var(--primary); font-size: 1.05rem; }
.care-card-desc { font-size: 0.85rem; color: var(--muted-foreground); margin: 0; }
.care-card-modality { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 2px; }
.care-modality-pill { font-size: 0.68rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em; background: var(--muted); color: var(--muted-foreground); border-radius: 999px; padding: 3px 9px; }
.care-card-actions { margin-top: auto; padding-top: 8px; }

/* Status badges: never an ambiguous "Learn More"; bookability is always
   stated in words, not just color, so it reads correctly without color. */
.status-badge { display: inline-flex; align-items: center; gap: 4px; border-radius: 999px; padding: 3px 10px; font-size: 0.66rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; }
.status-badge.status-available { background: color-mix(in srgb, var(--sage) 22%, transparent); color: #2b4a37; }
.status-badge.status-waitlist { background: color-mix(in srgb, var(--accent) 18%, transparent); color: var(--accent-foreground); }
.status-badge.status-comingsoon { background: var(--muted); color: var(--muted-foreground); }
.price-item-top .name .status-badge { margin-left: 6px; vertical-align: middle; font-weight: 700; }

.care-not-sure { margin-top: 26px; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 16px 18px; border: 1.5px dashed var(--accent); border-radius: 0.9rem; background: color-mix(in srgb, var(--accent) 8%, var(--background)); }
.care-not-sure p { margin: 0; font-weight: 600; }

/* "View Full Pricing" secondary view: collapsed by default (details/
   summary, no JS required to open/close), so the interactive selector
   above is the primary landing experience while the complete flat price
   list stays one click away. Existing #primary-acute-care /
   #neurotoxin-services / #telehealth-visits / etc. deep links still work:
   script.js's openDeepLinkedDetails() already walks up and opens every
   ancestor <details>, and this wrapper is just one more ancestor. */
.full-pricing-toggle { border: 1px solid var(--border); border-radius: 1rem; background: var(--card); margin-top: 34px; }
.full-pricing-toggle > summary { cursor: pointer; list-style: none; padding: 18px 22px; display: flex; align-items: center; gap: 14px; font-family: var(--font-display); font-size: 1.15rem; font-weight: 600; }
.full-pricing-toggle > summary::-webkit-details-marker { display: none; }
.full-pricing-toggle > summary::after { content: "View Full Pricing \25BE"; margin-left: auto; font-family: var(--font-sans); font-size: 0.85rem; font-weight: 700; color: var(--primary); }
.full-pricing-toggle[open] > summary::after { content: "Hide Full Pricing \25B4"; }
.full-pricing-body { padding: 0 22px 22px; }

@media (max-width: 640px) {
  .care-chips { gap: 8px; }
  .care-chip { padding: 10px 14px; font-size: 0.82rem; }
  .care-cards { grid-template-columns: 1fr; }
}

/* ======================================================================
   VISUAL-DIRECTION POLISH (added per Dr. Bui's Bravo Physio / Sterling
   Wellness / Santa Fe Mobile MD hybrid brief). Overall site stays at the
   existing restrained "medical 3/5" hairline-card aesthetic already set
   in V22/V23 above -- these rules only (a) style the previously-unstyled
   homepage photo-feature section and (b) give the Neurotoxin & Aesthetic
   Services group a deliberately richer "5/5" premium treatment so that
   ONE section reads more visual/sophisticated without pulling the rest
   of the site toward a spa aesthetic. Nothing here changes layout
   structure, pricing, or copy -- CSS-token-level only. */

/* --- Homepage "Ways to Receive Care" photo-feature grid (Bravo Physio:
   confident hierarchy + clean CTA; Sterling Wellness: generous whitespace,
   restrained complexity) --- */
.photo-feature-grid { display: grid; grid-template-columns: 1fr; gap: 24px; margin-top: 40px; }
@media (min-width: 768px) { .photo-feature-grid { grid-template-columns: repeat(2, 1fr); gap: 28px; } }
.photo-feature-card {
  display: block;
  position: relative;
  border-radius: 4px;
  overflow: hidden;
  background: var(--card);
  border: 1px solid var(--border);
  box-shadow: var(--shadow-card);
  transition: box-shadow 0.25s ease, transform 0.25s ease;
}
.photo-feature-card:hover, .photo-feature-card:focus-visible { box-shadow: var(--shadow-soft); transform: translateY(-2px); }
.photo-feature-card img { width: 100%; aspect-ratio: 4/3; object-fit: cover; transition: transform 0.5s ease; }
.photo-feature-card:hover img { transform: scale(1.03); }
.photo-feature-content { padding: 26px 26px 28px; }
.photo-feature-content .eyebrow { margin-bottom: 6px; }
.photo-feature-content h3 { font-size: 1.35rem; margin-top: 2px; }
.photo-feature-content p { margin-top: 10px; color: var(--muted-foreground); font-size: 0.95rem; line-height: 1.6; }
.photo-feature-cta { display: inline-flex; align-items: center; gap: 6px; margin-top: 16px; font-size: 0.85rem; font-weight: 700; color: var(--primary); }
.photo-feature-card:hover .photo-feature-cta { color: var(--accent); }
@media (min-width: 768px) {
  /* Both supplied photos are composed with deliberate left-side negative
     space for text overlay -- use that instead of a caption stacked below. */
  .photo-feature-card { display: grid; grid-template-columns: 1fr; }
  .photo-feature-card img { aspect-ratio: 16/10; }
}

/* --- Neurotoxin & Aesthetic Services: elevated "5/5" premium treatment.
   Wraps the existing #neurotoxin-services <details class="svc-group">
   with a richer dark/gold surface -- deliberately the one place on the
   site that departs from the flat ivory-card language, matching Dr.
   Bui's "medical<->wellness 5/5 for aesthetics, 3/5 everywhere else"
   direction. Structure/accordion behavior is untouched. --- */
.aesthetic-showcase {
  margin-top: 12px;
  border-radius: 1.25rem;
  padding: 3px;
  background: linear-gradient(135deg, var(--gold) 0%, var(--teal-deep) 45%, var(--teal-deep) 100%);
}
.aesthetic-showcase > .svc-group {
  margin-top: 0;
  border: none;
  border-radius: calc(1.25rem - 3px);
  background: linear-gradient(165deg, var(--teal-deep) 0%, #0c2423 100%);
  color: var(--primary-foreground);
}
.aesthetic-showcase > .svc-group summary { padding: 26px 28px; gap: 18px; }
.aesthetic-showcase > .svc-group summary .svc-group-title h3 {
  font-family: var(--font-display);
  font-size: 1.5rem;
  font-weight: 500;
  color: var(--primary-foreground);
  letter-spacing: -0.01em;
}
.aesthetic-showcase > .svc-group summary .svc-group-title p { color: color-mix(in srgb, var(--primary-foreground) 72%, transparent); }
.aesthetic-showcase > .svc-group summary::after { color: var(--gold-light); }
.aesthetic-showcase > .svc-group[open] summary { border-bottom: 1px solid color-mix(in srgb, var(--gold) 30%, transparent); }
.aesthetic-showcase .svc-group-body { padding: 24px 28px 28px; }
.aesthetic-showcase .svc-tile {
  border: 1px solid color-mix(in srgb, var(--gold) 24%, transparent);
  border-radius: 0.85rem;
  background: color-mix(in srgb, #ffffff 5%, transparent);
  margin-top: 10px;
  overflow: hidden;
}
.aesthetic-showcase .svc-tile summary { padding: 16px 18px; color: var(--primary-foreground); }
.aesthetic-showcase .svc-tile summary::after { color: var(--gold-light); }
.aesthetic-showcase .svc-tile-body,
.aesthetic-showcase .svc-tile p { color: color-mix(in srgb, var(--primary-foreground) 82%, transparent); }
.aesthetic-showcase .svc-tile a { color: var(--gold-light); text-decoration-color: color-mix(in srgb, var(--gold-light) 55%, transparent); }
.aesthetic-showcase .btn-outline { border-color: color-mix(in srgb, var(--gold) 55%, transparent); color: var(--primary-foreground); }
.aesthetic-showcase .btn-outline:hover { background: var(--gold); color: var(--accent-foreground); border-color: var(--gold); }
.aesthetic-showcase .price-item-top .price,
.aesthetic-showcase .card-price { color: var(--gold-light); }

@media (max-width: 640px) {
  .aesthetic-showcase > .svc-group summary { padding: 20px 18px; }
  .aesthetic-showcase > .svc-group summary .svc-group-title h3 { font-size: 1.25rem; }
}


/* =====================================================================
   9/27/26 pre-launch pass: line-icon system, category tiles, membership
   bracket, delivery-method filter, full price list, neurotoxin need chips.
   ===================================================================== */
.lt-i{display:inline-block;width:1.15em;height:1.15em;flex:none;vertical-align:-0.2em;background-color:currentColor;-webkit-mask:var(--lt-i) center/contain no-repeat;mask:var(--lt-i) center/contain no-repeat;}
.lt-i[data-i="primary"]{--lt-i:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M6%203v5a4.5%204.5%200%200%200%209%200V3%22%2F%3E%3Cpath%20d%3D%22M10.5%2012.5V15a5%205%200%200%200%2010%200v-2%22%2F%3E%3Ccircle%20cx%3D%2220.5%22%20cy%3D%2211%22%20r%3D%222%22%2F%3E%3C%2Fsvg%3E");}
.lt-i[data-i="ongoing"]{--lt-i:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%2020s-7.5-4.6-7.5-10.2A4.1%204.1%200%200%201%2012%207.4a4.1%204.1%200%200%201%207.5%202.4C19.5%2015.4%2012%2020%2012%2020z%22%2F%3E%3Cpath%20d%3D%22M9%2011.6l2%202%204-4%22%2F%3E%3C%2Fsvg%3E");}
.lt-i[data-i="weight"]{--lt-i:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%204v16M7.5%2020h9M4.5%207.5h15%22%2F%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%224%22%20r%3D%221.2%22%2F%3E%3Cpath%20d%3D%22M4.5%207.5L2%2013a2.6%202.6%200%200%200%205%200z%20M19.5%207.5L17%2013a2.6%202.6%200%200%200%205%200z%22%2F%3E%3C%2Fsvg%3E");}
.lt-i[data-i="family"]{--lt-i:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%228.5%22%20cy%3D%227%22%20r%3D%222.8%22%2F%3E%3Ccircle%20cx%3D%2216.5%22%20cy%3D%229%22%20r%3D%222.2%22%2F%3E%3Cpath%20d%3D%22M3.5%2020a5%205%200%200%201%2010%200%22%2F%3E%3Cpath%20d%3D%22M13%2020a3.8%203.8%200%200%201%207.5%200%22%2F%3E%3C%2Fsvg%3E");}
.lt-i[data-i="physicals"]{--lt-i:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%225%22%20y%3D%224.5%22%20width%3D%2214%22%20height%3D%2216.5%22%20rx%3D%222%22%2F%3E%3Cpath%20d%3D%22M9%203h6v3H9z%22%2F%3E%3Cpath%20d%3D%22M9%2013.5l2%202%204-4.5%22%2F%3E%3C%2Fsvg%3E");}
.lt-i[data-i="procedures"]{--lt-i:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M7%203h7.5L19%207.5V21H7z%22%2F%3E%3Cpath%20d%3D%22M14.5%203v4.5H19%22%2F%3E%3Cpath%20d%3D%22M13%2011v6M10%2014h6%22%2F%3E%3C%2Fsvg%3E");}
.lt-i[data-i="aesthetics"]{--lt-i:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M13%203.5c-3.9%200-6.5%202.9-6.5%206.4%200%201.4-1.3%202.8-2%203.8l2%20.6v2.4A1.8%201.8%200%200%200%208.3%2018.5h2V21%22%2F%3E%3Cpath%20d%3D%22M18%205.5l.8%202%202%20.8-2%20.8-.8%202-.8-2-2-.8%202-.8z%22%2F%3E%3Cpath%20d%3D%22M17%2014.5l.5%201.2%201.2.5-1.2.5-.5%201.2-.5-1.2-1.2-.5%201.2-.5z%22%2F%3E%3C%2Fsvg%3E");}
.lt-i[data-i="membership"]{--lt-i:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%203l7.5%203v5.2c0%205-3.6%208.4-7.5%209.8-3.9-1.4-7.5-4.8-7.5-9.8V6z%22%2F%3E%3Cpath%20d%3D%22M12%2015.5s-3.2-1.9-3.2-4.2A1.7%201.7%200%200%201%2012%2010.4a1.7%201.7%200%200%201%203.2.9c0%202.3-3.2%204.2-3.2%204.2z%22%2F%3E%3C%2Fsvg%3E");}
.lt-i[data-i="telehealth"]{--lt-i:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223%22%20y%3D%224%22%20width%3D%2218%22%20height%3D%2212.5%22%20rx%3D%222%22%2F%3E%3Cpath%20d%3D%22M8.5%2020.5h7M12%2016.5v4%22%2F%3E%3Cpath%20d%3D%22M12%207.5v5.5M9.25%2010.25h5.5%22%2F%3E%3C%2Fsvg%3E");}
.lt-i[data-i="inhome"]{--lt-i:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M3%2011l9-7%209%207%22%2F%3E%3Cpath%20d%3D%22M5.5%209.3V20.5h13V9.3%22%2F%3E%3Cpath%20d%3D%22M12%2011.5v6M9%2014.5h6%22%2F%3E%3C%2Fsvg%3E");}
.lt-i[data-i="inperson"]{--lt-i:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%2021V8l8-5%208%205v13%22%2F%3E%3Cpath%20d%3D%22M9%2021v-5h6v5%22%2F%3E%3Cpath%20d%3D%22M12%207.5v4.5M9.75%209.75h4.5%22%2F%3E%3C%2Fsvg%3E");}
.lt-i[data-i="calendar"]{--lt-i:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223.5%22%20y%3D%225%22%20width%3D%2217%22%20height%3D%2215.5%22%20rx%3D%222%22%2F%3E%3Cpath%20d%3D%22M3.5%2010h17M8%203v4M16%203v4%22%2F%3E%3C%2Fsvg%3E");}
.lt-i[data-i="clock"]{--lt-i:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%228.5%22%2F%3E%3Cpath%20d%3D%22M12%207.5V12l3%202%22%2F%3E%3C%2Fsvg%3E");}
.lt-i[data-i="home"]{--lt-i:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M3%2011l9-7%209%207%22%2F%3E%3Cpath%20d%3D%22M5.5%209.3V20.5h13V9.3%22%2F%3E%3Cpath%20d%3D%22M10%2020.5v-5h4v5%22%2F%3E%3C%2Fsvg%3E");}
.lt-i[data-i="pin"]{--lt-i:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%2021s-6.5-5.9-6.5-11a6.5%206.5%200%200%201%2013%200c0%205.1-6.5%2011-6.5%2011z%22%2F%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2210%22%20r%3D%222.4%22%2F%3E%3C%2Fsvg%3E");}
.lt-i[data-i="shield"]{--lt-i:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%203l7.5%203v5.2c0%205-3.6%208.4-7.5%209.8-3.9-1.4-7.5-4.8-7.5-9.8V6z%22%2F%3E%3Cpath%20d%3D%22M9%2012l2.2%202.2L15.5%2010%22%2F%3E%3C%2Fsvg%3E");}
.lt-i[data-i="check"]{--lt-i:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%228.5%22%2F%3E%3Cpath%20d%3D%22M8.5%2012.3l2.4%202.4%204.8-5%22%2F%3E%3C%2Fsvg%3E");}
.lt-i[data-i="building"]{--lt-i:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%225%22%20y%3D%223%22%20width%3D%2214%22%20height%3D%2218%22%20rx%3D%221.5%22%2F%3E%3Cpath%20d%3D%22M9%207h1.5M13.5%207H15M9%2011h1.5M13.5%2011H15M9%2015h1.5M13.5%2015H15M10.5%2021v-3h3v3%22%2F%3E%3C%2Fsvg%3E");}
.lt-i[data-i="mind"]{--lt-i:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M9%2021v-3.2A6.5%206.5%200%201%201%2018.5%2012l1.5%202.5h-2v2.3a1.7%201.7%200%200%201-1.7%201.7H15V21%22%2F%3E%3Cpath%20d%3D%22M10%209.5a2.2%202.2%200%201%201%203.3%201.9c-.8.5-1.3%201-1.3%202%22%2F%3E%3C%2Fsvg%3E");}
.lt-i[data-i="heart"]{--lt-i:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%2020s-7.5-4.6-7.5-10.2A4.1%204.1%200%200%201%2012%207.4a4.1%204.1%200%200%201%207.5%202.4C19.5%2015.4%2012%2020%2012%2020z%22%2F%3E%3C%2Fsvg%3E");}
.lt-i[data-i="users"]{--lt-i:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%229%22%20cy%3D%228%22%20r%3D%223%22%2F%3E%3Cpath%20d%3D%22M3%2020a6%206%200%200%201%2012%200%22%2F%3E%3Cpath%20d%3D%22M15.5%205.3a3%203%200%200%201%200%205.4M17.5%2014.3A6%206%200%200%201%2021%2020%22%2F%3E%3C%2Fsvg%3E");}
.lt-i[data-i="user"]{--lt-i:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%228%22%20r%3D%223.8%22%2F%3E%3Cpath%20d%3D%22M4.5%2020.5a7.5%207.5%200%200%201%2015%200%22%2F%3E%3C%2Fsvg%3E");}
.lt-i[data-i="flask"]{--lt-i:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M9%203h6M10%203v6.2L5%2018a2%202%200%200%200%201.8%203h10.4A2%202%200%200%200%2019%2018l-5-8.8V3%22%2F%3E%3Cpath%20d%3D%22M7.4%2015h9.2%22%2F%3E%3C%2Fsvg%3E");}
.lt-i[data-i="pill"]{--lt-i:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4.9%2013.1l8.2-8.2a4%204%200%200%201%205.7%205.7l-8.2%208.2a4%204%200%200%201-5.7-5.7z%22%2F%3E%3Cpath%20d%3D%22M9%209l6%206%22%2F%3E%3C%2Fsvg%3E");}
.lt-i[data-i="pulse"]{--lt-i:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M3%2012h4l2.2-5%204.4%2010%202.2-5H21%22%2F%3E%3C%2Fsvg%3E");}
.lt-i[data-i="dollar"]{--lt-i:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%228.5%22%2F%3E%3Cpath%20d%3D%22M14.8%209.4c-.4-.9-1.5-1.4-2.8-1.4-1.6%200-2.8.8-2.8%201.9s1.2%201.6%202.8%201.9%202.8.9%202.8%202-1.2%201.9-2.8%201.9c-1.3%200-2.4-.5-2.8-1.4M12%206.5v11%22%2F%3E%3C%2Fsvg%3E");}
.lt-i[data-i="phone"]{--lt-i:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M5.5%204h3.3l1.7%204.3-2.2%201.3a10.5%2010.5%200%200%200%204.8%204.8l1.3-2.2%204.3%201.7v3.3A1.8%201.8%200%200%201%2017%2019%2014%2014%200%200%201%203.7%205.8%201.8%201.8%200%200%201%205.5%204z%22%2F%3E%3C%2Fsvg%3E");}
.lt-i[data-i="message"]{--lt-i:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%205h16v11H9.5L5%2019.5V16H4z%22%2F%3E%3C%2Fsvg%3E");}
.lt-i[data-i="mail"]{--lt-i:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223%22%20y%3D%225.5%22%20width%3D%2218%22%20height%3D%2213%22%20rx%3D%222%22%2F%3E%3Cpath%20d%3D%22M3.5%207l8.5%206%208.5-6%22%2F%3E%3C%2Fsvg%3E");}
.lt-i[data-i="alert"]{--lt-i:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%204L21.5%2020h-19z%22%2F%3E%3Cpath%20d%3D%22M12%2010v4.5M12%2017.2v.1%22%2F%3E%3C%2Fsvg%3E");}
.lt-i[data-i="clipboard"]{--lt-i:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%225%22%20y%3D%224.5%22%20width%3D%2214%22%20height%3D%2216.5%22%20rx%3D%222%22%2F%3E%3Cpath%20d%3D%22M9%203h6v3H9zM9%2011h6M9%2015h4%22%2F%3E%3C%2Fsvg%3E");}
.lt-i[data-i="cap"]{--lt-i:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M2.5%209L12%204.5%2021.5%209%2012%2013.5z%22%2F%3E%3Cpath%20d%3D%22M6.5%2011v4.5c0%201.4%202.5%203%205.5%203s5.5-1.6%205.5-3V11M21.5%209v5%22%2F%3E%3C%2Fsvg%3E");}
.lt-i[data-i="sparkle"]{--lt-i:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%203.5l1.7%205%205%201.7-5%201.7-1.7%205-1.7-5-5-1.7%205-1.7z%22%2F%3E%3Cpath%20d%3D%22M18.5%2015.5l.6%201.6%201.6.6-1.6.6-.6%201.6-.6-1.6-1.6-.6%201.6-.6z%22%2F%3E%3C%2Fsvg%3E");}
.lt-i[data-i="chart"]{--lt-i:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%204v16h16%22%2F%3E%3Cpath%20d%3D%22M7.5%2015l4-4%203%203%205-6%22%2F%3E%3C%2Fsvg%3E");}
.lt-i[data-i="bulb"]{--lt-i:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M9.5%2018h5M10.5%2021h3%22%2F%3E%3Cpath%20d%3D%22M12%203a6%206%200%200%200-3.4%2010.9c.6.5.9%201.3.9%202.1h5c0-.8.3-1.6.9-2.1A6%206%200%200%200%2012%203z%22%2F%3E%3C%2Fsvg%3E");}
.lt-i[data-i="signal"]{--lt-i:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M2.5%209a14%2014%200%200%201%2019%200M5.5%2012.4a9.5%209.5%200%200%201%2013%200M8.7%2015.7a5%205%200%200%201%206.6%200%22%2F%3E%3Cpath%20d%3D%22M12%2019.2v.1%22%2F%3E%3C%2Fsvg%3E");}
.lt-i[data-i="leaf"]{--lt-i:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M5%2019c0-8%205-13.5%2014-14%200%209-5.2%2014-13.2%2014z%22%2F%3E%3Cpath%20d%3D%22M5%2019l7-7%22%2F%3E%3C%2Fsvg%3E");}
.lt-i[data-i="refresh"]{--lt-i:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M19.5%2011A7.5%207.5%200%200%200%206%206.8L4.5%208.5%22%2F%3E%3Cpath%20d%3D%22M4.5%204.5v4h4%22%2F%3E%3Cpath%20d%3D%22M4.5%2013A7.5%207.5%200%200%200%2018%2017.2l1.5-1.7%22%2F%3E%3Cpath%20d%3D%22M19.5%2019.5v-4h-4%22%2F%3E%3C%2Fsvg%3E");}
.lt-i[data-i="handshake"]{--lt-i:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M2.5%2011l4-4%203.5%201.2%202-1.2%203%20.5%204%203.5%22%2F%3E%3Cpath%20d%3D%22M6.5%207L2.5%2013l5%205%201.5-1%22%2F%3E%3Cpath%20d%3D%22M19%2010.5l2.5%202.5-5%205-3-2.2-3-2.8%202.2-2.2%203.3%202.7%22%2F%3E%3C%2Fsvg%3E");}
.card-icon .lt-i { width: 24px; height: 24px; }
.status-badge .lt-i { width: 1.05em; height: 1.05em; }
.eyebrow .lt-i { margin-right: 4px; vertical-align: -0.22em; }

/* Nav: membership tiers with Child Add-On bracketed under Essential Adult */
.nav-dropdown-panel a.nav-tier, .nav-mobile-sublist a.nav-tier { display: flex; justify-content: space-between; align-items: baseline; gap: 18px; }
.nav-price { font-weight: 500; font-size: 0.85em; color: var(--muted-foreground); }
a.nav-tier-sub { position: relative; padding-left: 36px !important; font-weight: 500 !important; }
a.nav-tier-sub::before { content: ""; position: absolute; left: 20px; top: 2px; width: 9px; height: calc(50% - 2px); border-left: 1.5px solid var(--warm-taupe); border-bottom: 1.5px solid var(--warm-taupe); border-bottom-left-radius: 3px; }
.nav-mobile-sublist a.nav-tier-sub { padding-left: 30px !important; }
.nav-mobile-sublist a.nav-tier-sub::before { left: 16px; }

/* Homepage category tiles: two slim columns, not a wall of cards */
.home-cat-grid { display: grid; grid-template-columns: 1fr; gap: 12px; max-width: 1040px; margin-left: auto; margin-right: auto; }
@media (min-width: 768px) { .home-cat-grid { grid-template-columns: 1fr 1fr; gap: 14px 18px; } }
.cat-tile { display: flex; align-items: center; gap: 16px; padding: 16px 18px; min-height: 84px; background: var(--card); border: 1px solid var(--border); border-radius: var(--radius); color: var(--foreground); text-decoration: none; transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease; }
.cat-tile:hover, .cat-tile:focus-visible { border-color: color-mix(in srgb, var(--primary) 40%, var(--border)); box-shadow: var(--shadow-card); transform: translateY(-1px); }
.cat-tile-icon { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; border-radius: 999px; background: var(--secondary); color: var(--primary); }
.cat-tile-icon .lt-i { width: 24px; height: 24px; }
.cat-tile-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1; }
.cat-tile-label { font-family: var(--font-display); font-size: 1.22rem; font-weight: 600; color: var(--primary); line-height: 1.2; }
.cat-tile-line { font-size: 0.88rem; color: var(--muted-foreground); line-height: 1.4; }
.cat-tile-arrow { flex: none; color: var(--primary); font-weight: 700; transition: transform .15s ease; }
.cat-tile:hover .cat-tile-arrow { transform: translateX(3px); }

/* Homepage membership: Child Add-On bracketed under Essential Adult */
@media (min-width: 760px) { .home-member-options { grid-template-columns: 1fr 1fr; align-items: start; } }
.member-tree { display: flex; flex-direction: column; gap: 10px; }
.home-member-option.member-sub { margin-left: 30px; }
.home-member-option.member-sub::before { content: ""; position: absolute; left: -20px; top: -11px; width: 14px; height: calc(50% + 11px); border-left: 1.5px solid rgba(247,246,239,0.45); border-bottom: 1.5px solid rgba(247,246,239,0.45); border-bottom-left-radius: 4px; }

/* Ways to receive care: three delivery methods */
@media (min-width: 900px) { .photo-feature-grid.photo-feature-grid-3 { grid-template-columns: repeat(3, 1fr); gap: 24px; } }
.photo-feature-grid-3 .photo-feature-content { padding: 22px 22px 24px; }

/* Category pages: delivery-method filter + deep-link focus */
.modality-filter { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 4px; }
.mf-chip { display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 8px 16px; border-radius: 999px; border: 1px solid var(--border); background: var(--card); color: var(--foreground); font: 600 0.9rem var(--font-sans); cursor: pointer; }
.mf-chip.active { background: var(--primary); border-color: var(--primary); color: var(--primary-foreground); }
.mf-chip.mf-static { cursor: default; background: var(--secondary); color: var(--primary); }
.price-item[hidden] { display: none; }
.price-item-focus { background: color-mix(in srgb, var(--secondary) 70%, transparent); border-radius: var(--radius); padding-left: 14px; padding-right: 14px; box-shadow: inset 3px 0 0 var(--primary); scroll-margin-top: 110px; }
.view-full-pricing { font-weight: 600; color: var(--primary); text-decoration: underline; }

/* Services page: collapsed full price list (single level) */
.full-pricing { border: 1px solid var(--border); border-radius: var(--radius); background: var(--card); padding: 4px 20px; scroll-margin-top: 100px; }
.full-pricing > summary { cursor: pointer; padding: 16px 0; font-family: var(--font-display); font-size: 1.3rem; font-weight: 600; color: var(--primary); }
.fp-body { display: grid; grid-template-columns: 1fr; gap: 8px 36px; padding-bottom: 8px; }
@media (min-width: 860px) { .fp-body { grid-template-columns: 1fr 1fr; } }
.fp-group h3 { font-size: 1.05rem; margin: 14px 0 6px; }
.fp-group h3 a { color: var(--primary); text-decoration: none; }
.fp-group ul { list-style: none; margin: 0; padding: 0; }
.fp-group li { display: flex; justify-content: space-between; gap: 14px; padding: 7px 0; border-bottom: 1px solid var(--border); font-size: 0.9rem; }
.fp-group li.fp-sub { padding-left: 18px; }
.fp-name { min-width: 0; }
.fp-price { flex: none; max-width: 48%; text-align: right; color: var(--muted-foreground); }

/* Neurotoxin: need-first chips */
.need-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.need-chip { min-height: 44px; padding: 10px 16px; border-radius: 999px; border: 1px solid var(--border); background: var(--card); color: var(--foreground); font: 600 0.92rem var(--font-sans); cursor: pointer; }
.need-chip:hover { border-color: var(--primary); color: var(--primary); }
.need-chip.active { background: var(--primary); border-color: var(--primary); color: var(--primary-foreground); }
@keyframes ltPulse { 0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--accent) 60%, transparent); } 100% { box-shadow: 0 0 0 16px transparent; } }
.area-dot.pulse-hint { border-radius: 999px; animation: ltPulse 0.9s ease-out 3; }
@media (prefers-reduced-motion: reduce) { .area-dot.pulse-hint { animation: none; outline: 2px solid var(--accent); } }
.home-member-box .muted { color: rgba(247,246,239,0.82); }
.home-member-box .eyebrow { color: var(--gold-light); }
@media (max-width: 767px) {
  .photo-feature-grid.photo-feature-grid-3 { gap: 12px; margin-top: 24px; }
  .photo-feature-grid-3 .photo-feature-card { display: grid; grid-template-columns: 112px 1fr; align-items: stretch; }
  .photo-feature-grid-3 .photo-feature-card img { aspect-ratio: auto; height: 100%; min-height: 150px; }
  .photo-feature-grid-3 .photo-feature-content { padding: 14px 14px 16px; }
  .photo-feature-grid-3 .photo-feature-content h3 { font-size: 1.1rem; margin-top: 2px; }
  .photo-feature-grid-3 .photo-feature-content p { font-size: 0.86rem; }
  .cat-tile { padding: 12px 14px; min-height: 0; gap: 12px; }
  .cat-tile-icon { width: 40px; height: 40px; }
}

/* Services directory cards + breadcrumb (final architecture 10/3/26) */
.svc-dir { gap: 20px; }
.svc-card { display: flex !important; flex-direction: column; min-height: 100%; }
.svc-card .svc-examples { margin-top: 10px; font-size: 0.9rem; color: var(--muted-foreground); }
.svc-card .svc-status { margin-top: 10px; }
.svc-card .svc-view { margin-top: auto; padding-top: 14px; font-weight: 600; color: var(--primary); }
.svc-secondary { max-width: 720px; margin: 28px auto 0; }
.svc-secondary-link { display: flex; align-items: center; gap: 14px; padding: 14px 18px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--card); color: inherit; text-decoration: none; min-height: 56px; }
.svc-secondary-link .card-icon { margin: 0; flex: none; }
.svc-secondary-link:hover { border-color: var(--primary); }
.svc-secondary-link > span:nth-child(2) { flex: 1; font-size: 0.95rem; }
.eyebrow.breadcrumb a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.status-badge.status-waitlist { color: var(--accent); }

/* Footer logo: the SVG carries its own ivory disc, so it stays visible on the teal footer */
.site-footer .logo-mark { height: 64px; width: 64px; }
/* Tagline readability */
.logo-word .tag { color: #3d4a4a; font-weight: 600; font-size: 0.64rem; }
.site-footer .logo-word .tag { color: #f7f6ef; font-weight: 600; opacity: 0.95; }

/* 10/10/26: Discovery Call is a solid third main button (outline blended into the ivory header) */
.header-cta .btn-outline, .nav-mobile .btn-outline { background: var(--desert-sand); border-color: #8a7660; color: var(--teal-deep); font-weight: 600; }
.header-cta .btn-outline:hover, .nav-mobile .btn-outline:hover { background: #c9ad84; color: var(--teal-deep); }
/* 10/10/26 review: mobile-menu outline button border matched to the desktop header treatment (was near-invisible var(--border) on ivory) */

/* 10/10/26: Services dropdown was clipped on short laptop viewports (See All Services unreachable); panel now scrolls and tightens on short screens */
.nav-dropdown-panel { max-height: calc(100vh - 72px); overflow-y: auto; overscroll-behavior: contain; }
@media (max-height: 780px) {
  .nav-dropdown-panel { padding: 12px 8px 8px; gap: 0; }
  .nav-dropdown-panel a { padding: 7px 14px; font-size: 0.95rem; }
  .nav-dropdown-panel .nav-dropdown-all { margin-top: 4px; padding-top: 10px; }
}

/* 10/10/26: Patient Portal demoted to a text link (one primary CTA rule);
   homepage two-door audience split (patients / clinics). */
.header-link { font-size: 0.88rem; font-weight: 600; color: var(--primary); padding: 8px 6px; text-decoration: underline; text-underline-offset: 3px; white-space: nowrap; }
.header-link:hover, .header-link:focus-visible { color: var(--accent); }
.audience-doors { padding: 40px 0 8px; }
.doors-grid { display: grid; grid-template-columns: 1fr; gap: 20px; }
@media (min-width: 820px) { .doors-grid { grid-template-columns: 1fr 1fr; } }
.door-card { border: 1px solid var(--border); border-radius: 14px; padding: 28px; background: var(--card, #fff); display: flex; flex-direction: column; gap: 10px; }
.door-card h2 { font-size: 1.6rem; line-height: 1.2; margin: 0; }
.door-card p { margin: 0; }
.door-card-clinic { background: var(--teal-deep); color: var(--primary-foreground); border-color: var(--teal-deep); }
.door-card-clinic .eyebrow, .door-card-clinic h2 { color: var(--primary-foreground); }
.door-card-clinic .eyebrow { opacity: 0.8; }
.door-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; margin-top: 8px; }
.door-link { font-weight: 600; color: var(--primary); text-decoration: none; border-bottom: 1px solid transparent; }
.door-link:hover, .door-link:focus-visible { border-bottom-color: currentColor; }
.door-card-clinic .door-link { color: var(--desert-sand); }

/* Procedure tier cards (10/10/26) */
.tier-items { list-style: none; margin: 10px 0 4px; padding: 0; display: grid; gap: 6px; }
.tier-items li { font-size: 0.95rem; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }

/* Full price list table (10/10/26) */
.fpt { display: block; padding-bottom: 8px; }
.fpt-row { display: grid; grid-template-columns: minmax(0, 1.8fr) minmax(0, 1fr) minmax(0, 1.2fr); gap: 4px 16px; padding: 9px 0; border-bottom: 1px solid var(--border); font-size: 0.92rem; align-items: baseline; }
.fpt-head { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; color: var(--muted-foreground); border-bottom: 2px solid var(--border); }
.fpt-sec h3 { font-size: 1.05rem; margin: 18px 0 4px; }
.fpt-sec h3 a { color: var(--primary); text-decoration: none; }
.fpt-nm, .fpt-m { color: var(--foreground); font-weight: 600; }
.fpt-m { color: var(--primary); }
.fpt-note { margin: 6px 0 0; font-size: 0.8rem; color: var(--muted-foreground); }
.fpt-wide .fpt-span { grid-column: 2 / 4; font-weight: 600; color: var(--primary); }
@media (max-width: 640px) {
  .fpt-head { display: none; }
  .fpt-row { grid-template-columns: 1fr 1fr; }
  .fpt-name { grid-column: 1 / 3; font-weight: 500; }
  .fpt-nm::before, .fpt-m::before { content: attr(data-label); display: block; font-size: 0.68rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; color: var(--muted-foreground); }
  .fpt-wide .fpt-span { grid-column: 1 / 3; }
}
/* Memberships: child add-on linked inside the adult card */
.tier-grid.tier-grid-2 { grid-template-columns: 1fr; }
@media (min-width: 900px) { .tier-grid.tier-grid-2 { grid-template-columns: repeat(2, 1fr); } }
.addon-box { margin-top: 18px; padding: 14px 16px; border: 1px dashed var(--accent); border-radius: 0.75rem; background: var(--secondary); scroll-margin-top: 96px; }
.addon-box .addon-label { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.12em; color: var(--accent); }
.addon-box .addon-line { margin-top: 4px; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px; font-weight: 600; }
.addon-box .addon-price { font-family: var(--font-display); color: var(--primary); }
.fp-body .fpt { grid-column: 1 / -1; width: 100%; }
.fpt-sub .fpt-name { padding-left: 22px; position: relative; color: var(--muted-foreground); }
.fpt-sub .fpt-name::before { content: "\21B3"; position: absolute; left: 4px; }