/*
 * pages.css: Lane I (inner templates) stylesheet. Loads after ve-site.css and
 * wins over it. Classes are prefixed ve-page-*; every colour, size, radius,
 * shadow and duration comes from tokens.css. Composes the Lane F kit
 * (.ve-row, .ve-quote, .ve-related, .ve-photo-frame, .ve-acc, .ve-cta ...).
 */

/* ------------------------------------------------------------ page flow */
.ve-page-flow > * + * { margin-top: var(--section-y); }
/* Eyebrow per BUILD-BRIEF 2.2 (16/600 pink, normal case): the legacy ve-site.css
   section 8 rule (uppercase + dot ornament) still loads before this file; the
   integrator deletes it. Scoped so home.css keeps its own say. */
.ve-page-flow .ve-eyebrow, .ve-page-split .ve-eyebrow, .ve-band .ve-eyebrow, .ve-page-band .ve-eyebrow, .ve-page-faq .ve-eyebrow {
  display: block;
  margin: 0 0 10px;
  color: var(--c-pink);
  font-size: var(--fs-eyebrow);
  font-weight: 600;
  letter-spacing: normal;
  text-transform: none;
}
.ve-page-flow .ve-eyebrow::before, .ve-page-split .ve-eyebrow::before, .ve-band .ve-eyebrow::before, .ve-page-band .ve-eyebrow::before, .ve-page-faq .ve-eyebrow::before { content: none; }
.ve-page-band .ve-eyebrow { color: var(--c-white); }
.ve-band .ve-eyebrow { margin-bottom: 6px; }

/* Row photos: most of our clinic photos are tall phone shots; crop them to a
   calm 4:3.4 frame (faces sit high, so bias the crop upward). Opt out with
   .ve-page-row-natural (screenshots, award art). */
.ve-page-flow .ve-row-media > img { aspect-ratio: 4 / 3.4; object-fit: cover; object-position: 50% 28%; }
.ve-page-flow .ve-row-media.ve-page-row-natural > img, .ve-page-flow .ve-row-media > .ve-page-row-natural { aspect-ratio: auto; }

/* long labels ("Schedule Your Initial Appointment") must wrap on phones */
.ve-page-flow .ve-btn, .ve-page-rate .ve-btn { white-space: normal; }
.ve-page-flow > .ve-cta-wrap { padding: 0; }
.ve-page-flow > .ve-cta-wrap + * { margin-top: var(--section-y); }
.ve-page-flow > .ve-page-tight + .ve-page-tight { margin-top: var(--block-gap); }
.ve-page-prose { max-width: 62ch; }
.ve-page-prose > :first-child { margin-top: 0; }
.ve-page-prose > :last-child { margin-bottom: 0; }
.ve-page-prose h2 { margin-top: 1.2em; }
.ve-page-narrow { max-width: 780px; }
.ve-page-narrow--center { margin-left: auto; margin-right: auto; }
.ve-page-lead { font-size: var(--fs-lead); line-height: var(--lh-lead); }
.ve-page-actions { margin-top: 24px; }

/* ----------------------------------------------- C19 two-column intro */
.ve-page-split {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  gap: clamp(28px, 5vw, 72px);
  align-items: start;
}
.ve-page-split .ve-heading { margin-bottom: 0; }
@media (min-width: 1024px) {
  /* the heading column holds its place while the longer copy column scrolls */
  .ve-page-split .ve-heading { position: sticky; top: calc(var(--header-h-stuck) + 24px); }
}
.ve-page-split-body > :first-child { margin-top: 0; }
.ve-page-split-body > :last-child { margin-bottom: 0; }
.ve-page-split-body h3 { margin-top: 1.4em; }
.ve-page-split-body h3:first-child { margin-top: 0; }
@media (max-width: 767px) {
  .ve-page-split { grid-template-columns: 1fr; gap: 20px; }
}

/* --------------------------------------------- C19 centred pull quote */
.ve-page-pull {
  max-width: 62ch;
  margin: 0 auto;
  text-align: center;
}
.ve-page-pull .ve-stars { margin-bottom: 18px; }
.ve-page-pull .ve-stars svg { width: 22px; height: 22px; }
.ve-page-pull blockquote { margin: 0; padding: 0; background: none; border-radius: 0; }
.ve-page-pull blockquote p {
  margin: 0;
  color: var(--c-pink);
  font-size: clamp(19px, 2vw, 24px);
  font-weight: 400;
  line-height: 1.55;
}
.ve-page-pull cite {
  display: block;
  margin-top: 18px;
  font-style: normal;
  font-size: var(--fs-lead);
  color: var(--c-muted);
}

/* ------------------------------------------- C19 pillar band + C9 cards */
.ve-page-band {
  position: relative;
  padding: clamp(36px, 5vw, 64px) clamp(22px, 4vw, 56px);
  border-radius: var(--radius-card);
  background: var(--grad-brand);
  color: var(--c-white);
  overflow: hidden;
}
.ve-page-band::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: radial-gradient(rgb(255 255 255 / 0.06) 1px, transparent 1.5px);
  background-size: 14px 14px;
  pointer-events: none;
}
.ve-page-band > * { position: relative; }
.ve-page-band .ve-heading { margin-bottom: 28px; }
.ve-page-pillars {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(20px, 3vw, 36px);
}
.ve-page-pillar { display: flex; flex-direction: column; margin: 0; }
.ve-page-pillar h3 { margin: 18px 0 8px; color: var(--c-white); font-size: var(--fs-h3); font-weight: 500; }
.ve-page-pillar p { margin: 0 0 18px; color: var(--c-white); font-size: var(--fs-small); line-height: 1.7; flex: 1 1 auto; }
.ve-page-pillar .ve-btn { align-self: flex-start; }
@media (max-width: 767px) {
  .ve-page-pillars { grid-template-columns: 1fr; }
}

/* -------------------------------------------------- C11 doctor cards */
.ve-page-doctors {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(20px, 3vw, 36px);
}
.ve-page-doctor { margin: 0; }
.ve-page-doctor h3 { margin: 16px 0 4px; font-size: 22px; font-weight: 500; }
.ve-page-doctor-cred { display: block; margin: 0 0 10px; color: var(--c-pink); font-size: var(--fs-small); font-weight: 500; }
.ve-page-doctor p { margin: 0 0 12px; font-size: var(--fs-small); line-height: 1.7; }
.ve-page-doctor-more { font-weight: 500; text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 767px) {
  .ve-page-doctors { grid-template-columns: 1fr; }
}

/* ------------------------------------------- team member rows + pages */
.ve-page-team-row {
  display: grid;
  grid-template-columns: minmax(0, 260px) minmax(0, 1fr);
  gap: clamp(20px, 4vw, 48px);
  align-items: start;
}
.ve-page-team-row + .ve-page-team-row { margin-top: var(--block-gap); padding-top: var(--block-gap); border-top: 1px solid var(--c-line); }
.ve-page-team-row h3 { margin: 0 0 2px; font-size: 24px; font-weight: 500; }
.ve-page-role { display: block; margin: 0 0 14px; color: var(--c-muted); font-size: var(--fs-small); font-weight: 500; }
.ve-page-team-row .ve-prose > :last-child { margin-bottom: 0; }
.ve-page-member { grid-template-columns: minmax(0, 320px) minmax(0, 1fr); }
@media (max-width: 767px) {
  .ve-page-team-row, .ve-page-member { grid-template-columns: 1fr; }
  .ve-page-team-row .ve-photo-frame { max-width: 320px; }
}

/* ------------------------------------------------ C20 doctor page */
.ve-page-doc {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 340px);
  gap: clamp(28px, 5vw, 72px);
  align-items: start;
}
.ve-page-doc-bio > :first-child { margin-top: 0; }
.ve-page-doc-bio h2 { margin-top: 1.4em; font-size: clamp(24px, 2.6vw, 32px); }
.ve-page-doc-bio h2:first-child { margin-top: 0; }
.ve-page-doc-rail { position: sticky; top: calc(var(--header-h-stuck) + 24px); }
.ve-page-doc-rail .ve-photo-frame { margin-bottom: 22px; }
.ve-page-doc-contact { list-style: none; margin: 0 0 20px; padding: 0; }
.ve-page-doc-contact li { display: flex; align-items: center; gap: 12px; margin: 0 0 12px; font-size: var(--fs-lead); }
.ve-page-doc-contact svg { flex: 0 0 auto; width: 20px; height: 20px; color: var(--c-ink); }
.ve-page-doc-contact a { color: var(--c-ink); overflow-wrap: anywhere; }
.ve-page-doc-contact a:hover { color: var(--c-pink); }
.ve-page-doc-rail .ve-btn { width: 100%; }
/* credentials: a plain dotted list, no pill per item */
.ve-page-chips { display: grid; gap: 8px; list-style: none; margin: 20px 0 0; padding: 0; }
.ve-page-chips li {
  position: relative;
  margin: 0;
  padding: 0 0 0 16px;
  color: var(--c-text);
  font-size: var(--fs-small);
  font-weight: 500;
  line-height: 1.4;
}
.ve-page-chips li::before { content: ''; position: absolute; left: 0; top: 0.55em; width: 6px; height: 6px; border-radius: 50%; background: var(--c-gold); }
.ve-page-doc-photos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: var(--block-gap); }
@media (max-width: 1023px) {
  .ve-page-doc { grid-template-columns: 1fr; }
  .ve-page-doc-rail { position: static; order: -1; max-width: 420px; }
}

/* ----------------------------------------------------- video frames */
.ve-page-video {
  position: relative;
  aspect-ratio: 16 / 9;
  border-radius: var(--radius-img);
  overflow: hidden;
  background: var(--c-surface);
}
.ve-page-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; }
/* click-to-play facade: the YouTube player (and its chrome) mounts only after a tap */
.ve-page-video-play {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  padding: 0;
  border: 0;
  background: var(--c-ink);
  color: var(--c-white);
  cursor: pointer;
}
.ve-page-video-play img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform var(--dur-base) var(--ease-std), opacity var(--dur-base) var(--ease-std); }
.ve-page-video-play:hover img { transform: scale(1.03); opacity: 0.9; }
.ve-page-video-play-badge {
  position: absolute;
  top: 50%;
  left: 50%;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 56px;
  padding: 0 26px 0 20px;
  transform: translate(-50%, -50%);
  border: 2px solid var(--c-white);
  border-radius: var(--radius-btn);
  background: rgb(216 19 104 / 0.85);
  color: var(--c-white);
  font-size: 16px;
  font-weight: 500;
  line-height: 1;
  text-shadow: none;
  transition: background-color var(--dur-base) var(--ease-std), color var(--dur-base) var(--ease-std);
}
.ve-page-video-play:hover .ve-page-video-play-badge, .ve-page-video-play:focus-visible .ve-page-video-play-badge { background: var(--c-white); color: var(--c-pink); }
.ve-page-video-play-badge svg { width: 22px; height: 22px; }
.ve-page-video-play:focus-visible { outline: none; box-shadow: inset var(--focus-ring); }
@media (max-width: 767px) {
  .ve-page-video-play-badge { min-height: 48px; padding: 0 20px 0 16px; font-size: 15px; }
}
.ve-page-video-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(16px, 3vw, 32px); }
.ve-page-video-grid h3 { margin: 0 0 12px; }
.ve-page-video-grid figure { margin: 0; }
.ve-page-video-grid figcaption { margin-top: 10px; font-size: var(--fs-small); color: var(--c-muted); }
.ve-page-video-grid--single { grid-template-columns: minmax(0, 1fr); }
@media (max-width: 767px) {
  .ve-page-video-grid { grid-template-columns: 1fr; }
}

/* ------------------------------------------------------ photo grids */
.ve-page-photo-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.ve-page-photo-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ve-page-photo-grid figure { margin: 0; }
.ve-page-photo-grid figcaption { margin-top: 8px; font-size: 13px; color: var(--c-muted); }
@media (max-width: 767px) {
  .ve-page-photo-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* -------------------------------------------------- quote card grids */
.ve-page-quotes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
@media (min-width: 1024px) { .ve-page-quotes--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 767px) { .ve-page-quotes { grid-template-columns: 1fr; } }
/* Short quotes with no photo: plain items on a top hairline with stars, no
   tinted box per quote (Zach 09-28 list rule: cards only when there's a photo). */
.ve-page-quotes { gap: 30px 36px; }
.ve-page-quotes .ve-quote { margin: 0; padding: 22px 0 0; border-top: 1px solid var(--c-line); border-radius: 0; background: none; }
.ve-page-quotes .ve-quote p { font-size: var(--fs-body); line-height: var(--lh-body); }
.ve-page-quote-long { margin: 0; padding: 26px 28px; }
.ve-page-quote-long p { margin: 0 0 1em; font-size: var(--fs-body); line-height: var(--lh-body); }
.ve-page-quote-long cite { display: block; margin-top: 4px; font-style: normal; font-size: var(--fs-small); color: var(--c-muted); }

/* ----------------------------------------------- feature (icon) items */
/* Plain items on a top hairline, no box per item (Zach 09-28 list rule);
   the round icon is the only ornament. Same treatment as .ve-cond-card. */
.ve-page-features { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 30px 36px; }
.ve-page-features--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 1023px) { .ve-page-features--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 639px) { .ve-page-features--3 { grid-template-columns: 1fr; } }
.ve-page-feature {
  margin: 0;
  padding: 22px 0 0;
  border-top: 1px solid var(--c-line);
}
.ve-page-feature-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  margin-bottom: 12px;
  border-radius: 50%;
  background: var(--c-pink-tint);
  color: var(--c-pink);
}
.ve-page-feature-icon svg { width: 20px; height: 20px; }
.ve-page-feature h3 { margin: 0 0 8px; font-size: var(--fs-h3); font-weight: 500; color: var(--c-ink); }
.ve-page-feature p { margin: 0; font-size: var(--fs-small); line-height: 1.7; }
.ve-page-feature ul { margin: 0; }

/* -------------------------------------------------------- note boxes */
.ve-page-note {
  padding: 22px 26px;
  border: 1px solid var(--c-line);
  border-left: 4px solid var(--c-gold);
  border-radius: var(--radius-card);
  background: var(--c-surface);
}
.ve-page-note > :first-child { margin-top: 0; }
.ve-page-note > :last-child { margin-bottom: 0; }
.ve-page-note h3 { margin-bottom: 6px; }

/* ------------------------------------------------- multi column lists */
.ve-page-cols { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 32px; }
.ve-page-cols--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ve-page-cols .ve-list { margin: 0; }
@media (max-width: 767px) {
  .ve-page-cols, .ve-page-cols--2 { grid-template-columns: 1fr; }
}
/* short item lists (e.g. KST "who is it for"): gold-dot bullets in two
   columns, no box per item */
.ve-page-chiplist { columns: 2; column-gap: 36px; list-style: none; margin: 0 0 1.2em; padding: 0; }
.ve-page-chiplist li { position: relative; break-inside: avoid; margin: 0 0 0.5em; padding-left: 22px; }
.ve-page-chiplist li::before { content: ''; position: absolute; left: 2px; top: 0.68em; width: 8px; height: 8px; border-radius: 50%; background: var(--c-gold); }
@media (max-width: 639px) { .ve-page-chiplist { columns: 1; } }

/* ------------------------------------------------ doctor byline rows */
.ve-page-doclist { list-style: none; margin: 0; padding: 0; }
.ve-page-doclist li {
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr);
  gap: 24px;
  align-items: start;
  margin: 0 0 24px;
}
.ve-page-doclist img { width: 120px; height: 120px; border-radius: var(--radius-img); object-fit: cover; }
.ve-page-doclist p { margin: 0; }
@media (max-width: 480px) {
  .ve-page-doclist li { grid-template-columns: 88px minmax(0, 1fr); gap: 16px; }
  .ve-page-doclist img { width: 88px; height: 88px; }
}

/* ------------------------------------------------------ data tables */
.ve-page-table { border: 1px solid var(--c-line); border-radius: var(--radius-card); overflow: hidden; }
.ve-page-table table { margin: 0; }
.ve-page-table th { background: var(--c-surface); font-weight: 600; }
.ve-page-table td:first-child { font-weight: 500; color: var(--c-ink); }
@media (max-width: 767px) {
  .ve-page-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .ve-page-table tr { display: block; padding: 10px 0; border-bottom: 1px solid var(--c-line); }
  .ve-page-table td { display: block; border: 0; padding: 4px 14px; }
  .ve-page-table td::before { content: attr(data-label); display: block; font-size: 13px; font-weight: 600; color: var(--c-muted); }
}

/* ------------------------------------------------------ contact page */
.ve-page-contact { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(28px, 5vw, 64px); align-items: start; }
.ve-page-contact-card { padding: 28px; border: 1px solid var(--c-line); border-radius: var(--radius-card); background: var(--c-surface); }
.ve-page-contact-card h2 { margin: 0 0 16px; font-size: 26px; }
.ve-page-contact-list { list-style: none; margin: 0 0 22px; padding: 0; }
.ve-page-contact-list li { display: flex; gap: 12px; align-items: flex-start; margin: 0 0 12px; }
.ve-page-contact-list svg { flex: 0 0 auto; width: 20px; height: 20px; margin-top: 4px; color: var(--c-pink); }
.ve-page-contact-list a { color: var(--c-ink); overflow-wrap: anywhere; }
.ve-page-contact-list a:hover { color: var(--c-pink); }
.ve-page-contact-list address { font-style: normal; }
.ve-page-hours { width: 100%; margin: 0 0 22px; font-size: 14px; }
.ve-page-hours th, .ve-page-hours td { padding: 8px 0; border-bottom: 1px solid var(--c-line); line-height: 1.5; }
.ve-page-hours th { width: 30%; font-weight: 500; color: var(--c-ink); }
.ve-page-hours tr:last-child th, .ve-page-hours tr:last-child td { border-bottom: 0; }
.ve-page-appointments .ve-btn { width: 100%; }
.ve-page-appointments { display: grid; gap: 12px; max-width: 460px; }
.ve-page-map { border-radius: var(--radius-img); overflow: hidden; background: var(--c-surface); aspect-ratio: 16 / 9; }
.ve-page-map iframe { display: block; width: 100%; height: 100%; }
.ve-page-map-meta { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px 36px; margin-top: 20px; }
.ve-page-map-meta span, .ve-page-map-meta a { display: inline-flex; align-items: center; gap: 10px; color: var(--c-ink); font-size: var(--fs-lead); }
.ve-page-map-meta svg { width: 20px; height: 20px; color: var(--c-pink); }
@media (max-width: 1023px) {
  .ve-page-contact { grid-template-columns: 1fr; }
}
@media (max-width: 767px) {
  .ve-page-map { aspect-ratio: 4 / 3; }
}

/* --------------------------------------------------------- forms */
.ve-page-form { max-width: 560px; }
.ve-page-form .ve-btn { margin-top: 6px; }
.ve-page-form-alert {
  margin: 0 0 18px;
  padding: 14px 18px;
  border: 1px solid var(--c-pink);
  border-radius: var(--radius-card);
  background: var(--c-pink-tint);
  color: var(--c-pink-deep);
}
.ve-page-form-alert p { margin: 0 0 8px; }
.ve-page-form-alert .ve-btn { margin: 0; }
.ve-page-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 16px; }
@media (max-width: 480px) { .ve-page-form-grid { grid-template-columns: 1fr; } }
.ve-page-honeypot { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }

/* ------------------------------------------------------ review stories */
/* long stories: plain rows on hairlines, no box per story */
.ve-page-stories { display: grid; gap: 0; }
.ve-page-story { padding: 32px 0; border-top: 1px solid var(--c-line); }
.ve-page-story:last-child { border-bottom: 1px solid var(--c-line); }
.ve-page-story .ve-stars { margin-bottom: 10px; }
.ve-page-story h2 { margin: 0 0 12px; font-size: clamp(22px, 2.4vw, 28px); }
.ve-page-story p:last-of-type { margin-bottom: 0; }
.ve-page-story cite { display: block; margin-top: 14px; font-style: normal; font-size: var(--fs-small); font-weight: 500; color: var(--c-muted); }
.ve-page-more {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin: 4px 0 12px;
  padding: 0;
  border: 0;
  background: none;
  color: var(--c-pink);
  font-weight: 500;
  cursor: pointer;
}
.ve-page-more svg { width: 16px; height: 16px; transition: transform var(--dur-fast) var(--ease-std); }
.ve-page-more[aria-expanded='true'] svg { transform: rotate(180deg); }
.ve-page-more-panel[hidden] { display: none; }

/* live + grouped review cards (Reviews.tsx) */
.ve-page-reviews-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 18px; }
.ve-page-review { display: flex; flex-direction: column; padding: 22px; border: 1px solid var(--c-line); border-radius: var(--radius-card); background: var(--c-white); }
.ve-page-review-author { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; font-weight: 500; color: var(--c-ink); }
.ve-page-review-author img { width: 32px; height: 32px; border-radius: 50%; }
.ve-page-review-author a { color: var(--c-ink); }
.ve-page-review-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-bottom: 10px; }
.ve-page-review-tag { font-size: 13px; color: var(--c-muted); }
.ve-page-review blockquote { margin: 0; padding: 0; background: none; border-radius: 0; color: var(--c-text); }
.ve-page-review blockquote p { margin: 0; font-size: var(--fs-small); line-height: 1.7; }
.ve-page-review footer { margin-top: 12px; font-size: var(--fs-small); color: var(--c-muted); }
.ve-page-review footer cite { font-style: normal; font-weight: 500; color: var(--c-ink); }
/* jump links: a plain wrapping row (see .ve-inline-list in base.css), no pill per link */
.ve-page-jump { gap: 0 28px; }

/* --------------------------------------------------------- laser offer */
.ve-page-offer {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 24px 40px;
  align-items: center;
  padding: clamp(28px, 4vw, 44px) clamp(24px, 4vw, 48px);
  border-radius: var(--radius-card);
  background: var(--grad-brand);
  color: var(--c-white);
}
.ve-page-offer h2, .ve-page-offer p { color: var(--c-white); }
.ve-page-offer h2 { margin: 0 0 8px; font-size: clamp(26px, 3vw, 36px); }
.ve-page-offer p { margin: 0 0 18px; }
.ve-page-offer-price {
  display: inline-flex;
  align-items: baseline;
  justify-content: center;
  width: 150px;
  height: 150px;
  border: 2px solid rgb(255 255 255 / 0.7);
  border-radius: 50%;
  background: var(--c-white);
  color: var(--c-pink);
  font-size: 56px;
  font-weight: 600;
  line-height: 150px;
}
.ve-page-offer-price sup { font-size: 24px; line-height: 1; margin-right: 2px; }
@media (max-width: 767px) {
  .ve-page-offer { grid-template-columns: 1fr; text-align: center; }
  .ve-page-offer-price { margin: 0 auto; }
  .ve-page-offer .ve-btn-row { justify-content: center; }
}

/* ---------------------------------------------------- credentials strip */
.ve-page-creds { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 14px; }
.ve-page-cred { margin: 0; padding: 20px 0 0; border-top: 1px solid var(--c-line); text-align: center; }
.ve-page-cred-mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 60px;
  height: 60px;
  margin-bottom: 12px;
  border-radius: 50%;
  background: var(--grad-brand);
  color: var(--c-white);
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 0.02em;
}
.ve-page-cred-mark--gold { background: var(--c-gold); color: var(--c-ink); }
.ve-page-cred strong { display: block; font-size: 13px; font-weight: 600; color: var(--c-ink); line-height: 1.35; }
.ve-page-cred span { display: block; margin-top: 4px; font-size: 12px; color: var(--c-muted); }

/* ---------------------------------------------------- insurance block */
.ve-page-insurance { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.ve-page-insurance .ve-card h3 { margin: 0 0 12px; display: flex; align-items: center; gap: 10px; }
.ve-page-tag { display: inline-block; padding: 2px 10px; border-radius: 999px; background: var(--c-pink-tint); color: var(--c-pink-deep); font-size: 12px; font-weight: 600; }
.ve-page-tag--ink { background: var(--c-surface); color: var(--c-text); border: 1px solid var(--c-line); }
@media (max-width: 640px) { .ve-page-insurance { grid-template-columns: 1fr; } }

/* ------------------------------------------------------ rate page */
.ve-page-rate { max-width: 520px; margin: 0 auto; padding: clamp(32px, 6vw, 64px) var(--gutter) calc(var(--section-y) * 1.5); text-align: center; }
.ve-page-rate-logo { display: block; width: 180px; height: auto; margin: 0 auto 28px; }
.ve-page-rate h1 { font-size: clamp(26px, 4vw, 34px); font-weight: 400; }
.ve-page-rate h2 { font-size: clamp(24px, 3vw, 30px); font-weight: 400; }
.ve-page-rate-stars { display: flex; justify-content: center; gap: 6px; margin: 24px 0; }
.ve-page-rate-star {
  display: inline-flex;
  padding: 4px;
  border: 0;
  border-radius: 8px;
  background: none;
  color: var(--c-line-strong);
  cursor: pointer;
  transition: transform var(--dur-fast) var(--ease-std), color var(--dur-fast) var(--ease-std);
}
.ve-page-rate-star svg { width: 44px; height: 44px; }
.ve-page-rate-star.is-on { color: var(--c-gold); }
.ve-page-rate-star:hover { transform: scale(1.08); }
.ve-page-rate-picked { display: inline-flex; gap: 2px; color: var(--c-gold); margin-bottom: 12px; }
.ve-page-rate-picked svg { width: 22px; height: 22px; }
.ve-page-rate-picked .is-off { color: var(--c-line); }
.ve-page-rate .ve-page-form { margin: 0 auto; text-align: left; }
.ve-page-rate-fine { margin-top: 28px; padding-top: 18px; border-top: 1px solid var(--c-line); font-size: 13px; color: var(--c-muted); }
.ve-page-rate-done { color: var(--c-pink); margin-bottom: 8px; }
.ve-page-rate-done svg { width: 56px; height: 56px; }

/* --------------------------------------------------- misc small bits */
.ve-page-center-actions { display: flex; justify-content: center; }
.ve-page-cards-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.ve-page-cards-2 .ve-card { padding: 24px 0 0; border: 0; border-top: 1px solid var(--c-line); border-radius: 0; background: none; box-shadow: none; text-align: center; }
.ve-page-cards-2 .ve-card h3 { margin: 12px 0 14px; }
.ve-page-cards-2 .ve-page-feature-icon { margin-bottom: 0; }
@media (max-width: 640px) { .ve-page-cards-2 { grid-template-columns: 1fr; } }
.ve-page-phone-lg { font-size: 24px; font-weight: 500; color: var(--c-ink); }
.ve-page-steps-intro { margin-bottom: 20px; }
.ve-page-flow .ve-acc { margin-top: 0; }
.ve-page-flow > .ve-page-faq .ve-heading { margin-bottom: 24px; }

/* split intro headings that are links (Our Techniques): navy like every
   other heading, pink on hover */
.ve-page-split .ve-heading a { color: var(--c-ink); text-decoration: none; }
.ve-page-split .ve-heading a:hover { color: var(--c-pink); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 6px; }

/* Split photo heroes (Direction A roll-out): pages that pass a focal point
   keep it inside the split's photo column (chrome.css sets one fixed
   position for the team photo). Desktop: --focal; phones and tablets, where
   the title sits under the faces: --focal-mobile. */
@media (min-width: 1024px) {
  .ve-photo-hero--split .ve-photo-hero-img[style*='--focal'] { object-position: var(--focal); }
}
@media (max-width: 1023px) {
  .ve-photo-hero--split .ve-photo-hero-img[style*='--focal'] { object-position: var(--focal-mobile, var(--focal)); }
}
/* Below 1024 the split hero stacks like the home side hero: the photo comes
   first, full width, and the title follows on solid navy, so no face ever
   sits under the text (the chrome.css default laid the title over the
   photo's lower half, which hid faces on tall phone titles). */
@media (max-width: 1023px) {
  .ve-photo-hero.ve-photo-hero--split {
    min-height: 0;
    align-items: start;
    padding-top: 0;
    padding-bottom: calc(var(--curve-h) + 56px);
    background: var(--c-navy-deep);
  }
  .ve-photo-hero.ve-photo-hero--split .ve-photo-hero-img {
    position: relative;
    inset: auto;
    width: 100%;
    height: auto;
    aspect-ratio: 4 / 3;
    -webkit-mask-image: linear-gradient(180deg, #000 82%, transparent 100%);
    mask-image: linear-gradient(180deg, #000 82%, transparent 100%);
  }
  .ve-photo-hero--split .ve-photo-hero-scrim { display: none; }
  .ve-photo-hero--split .ve-photo-hero-content { padding-top: 8px; }
  .ve-photo-hero--split .ve-photo-hero-title,
  .ve-photo-hero--split .ve-photo-hero-sub,
  .ve-photo-hero--split .ve-photo-hero-content .ve-eyebrow { text-shadow: none; }
}
@media (min-width: 768px) and (max-width: 1023px) {
  .ve-photo-hero.ve-photo-hero--split .ve-photo-hero-img { aspect-ratio: 16 / 9; }
}

/* ------------------------------------------------ booking chooser (/schedule-appointment/)
   Two equal choice cards (new / existing patient), each a stretched link to
   its SKED flow; call/text line and small help links under them. */
.ve-book { margin: 0; }
.ve-book-choices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; margin: 0; padding: 0; list-style: none; }
.ve-book-choice {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  margin: 0;
  padding: 36px 36px 32px;
  background: var(--c-white);
  border: 1px solid var(--c-line);
  border-top: 4px solid var(--c-pink);
  border-radius: var(--radius-card);
  box-shadow: 0 10px 30px rgb(5 62 103 / 0.08);
  transition: transform var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-std), border-color var(--dur-base) var(--ease-std);
}
.ve-book-choice::before { content: none; }
.ve-book-choice--existing { border-top-color: var(--c-navy); }
.ve-book-choice:hover { transform: translateY(-3px); box-shadow: 0 16px 40px rgb(5 62 103 / 0.14); border-color: var(--c-line-strong); border-top-color: var(--c-pink); }
.ve-book-choice--existing:hover { border-top-color: var(--c-navy); }
.ve-book-choice:focus-within { box-shadow: 0 16px 40px rgb(5 62 103 / 0.14); }
.ve-book-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  margin-bottom: 20px;
  border-radius: 50%;
  background: var(--c-pink-tint);
  color: var(--c-pink);
}
.ve-book-choice--existing .ve-book-icon { background: var(--c-navy-tint); color: var(--c-navy); }
.ve-book-icon svg { width: 26px; height: 26px; }
.ve-book-eyebrow { display: block; margin: 0 0 4px; color: var(--c-pink); font-size: var(--fs-eyebrow); font-weight: 600; }
.ve-book-title { margin: 0 0 12px; color: var(--c-ink); font-size: clamp(30px, 3.2vw, 38px); font-weight: 300; line-height: var(--lh-tight); }
.ve-book-text { margin: 0 0 28px; color: var(--c-text); font-size: var(--fs-body); line-height: var(--lh-body); }
.ve-book-link { margin-top: auto; width: 100%; position: static; }
.ve-book-link::after { content: ''; position: absolute; inset: 0; border-radius: var(--radius-card); }
.ve-book-link svg { transition: transform var(--dur-base) var(--ease-out); }
.ve-book-choice:hover .ve-book-link { background: var(--c-pink-deep); border-color: var(--c-pink-deep); }
.ve-book-choice:hover .ve-book-link svg { transform: translateX(3px); }

.ve-book-call {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin: 40px 0 0;
  padding: 22px 24px;
  border-radius: var(--radius-card);
  background: var(--c-navy-wash);
  text-align: center;
}
.ve-book-call > svg { flex: 0 0 auto; width: 22px; height: 22px; color: var(--c-pink); }
.ve-book-call p { margin: 0; color: var(--c-ink); font-size: var(--fs-lead); }
.ve-book-call a { color: var(--c-ink); font-weight: 600; white-space: nowrap; text-decoration: underline; text-decoration-color: var(--c-pink); text-underline-offset: 4px; }
.ve-book-call a:hover { color: var(--c-pink); }
.ve-book-more { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 28px; margin: 24px 0 0; padding: 0; list-style: none; font-size: var(--fs-small); }
.ve-book-more li { margin: 0; }
.ve-book-more li::before { content: none; }
.ve-book-more a { color: var(--c-pink); }

@media (max-width: 767px) {
  /* phones: compact cards so the second choice starts near the fold */
  .ve-book-choices { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .ve-book-choice { padding: 22px 20px 20px; }
  .ve-book-icon { display: none; }
  .ve-book-title { margin-bottom: 8px; font-size: 28px; }
  .ve-book-text { margin-bottom: 18px; font-size: var(--fs-small); line-height: 1.65; }
  .ve-book-call { flex-direction: column; gap: 6px; margin-top: 28px; }
  .ve-book-more { flex-direction: column; align-items: center; gap: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .ve-book-choice, .ve-book-link svg { transition: none; }
  .ve-book-choice:hover { transform: none; }
}

/* ======================================================================
   MEET THE DOCTORS rows + quiet staff row (session 2, 09-29; lane a-interior)
   Three equal rows, photo side alternating (the pediatric split-row rhythm),
   Dr. Anna first; staff below in a lighter row of small photos. Plain list,
   no boxes (a photo per person, so no cards either).
   ====================================================================== */
.ve-docs { margin-top: clamp(28px, 4vw, 48px); }
.ve-docs-row {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  gap: clamp(28px, 5vw, 72px);
  align-items: center;
}
.ve-docs-row + .ve-docs-row { margin-top: clamp(56px, 7vw, 104px); }
.ve-docs-row--flip { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); }
.ve-docs-row--flip > .ve-docs-photo { order: 2; }
.ve-docs-photo { display: block; }
.ve-docs-photo .ve-photo-frame { max-width: 425px; }
.ve-docs-row--flip .ve-docs-photo .ve-photo-frame { margin-left: auto; }
.ve-docs-photo img { object-position: 50% 22%; }
.ve-docs-text { max-width: 58ch; }
.ve-docs-focus {
  margin: 0 0 12px;
  color: var(--c-pink);
  font-size: var(--fs-eyebrow);
  font-weight: 600;
  line-height: 1.4;
  text-wrap: balance;
}
.ve-docs-text h3 {
  margin: 0 0 16px;
  color: var(--c-ink);
  font-size: clamp(28px, 2.6vw, 36px);
  font-weight: 300;
  line-height: 1.15;
}
.ve-docs-cred { display: block; margin-top: 6px; color: var(--c-muted); font-size: var(--fs-small); font-weight: 500; letter-spacing: 0.02em; }
.ve-docs-bio { margin: 0 0 18px; text-wrap: pretty; }
.ve-docs-more { font-weight: 500; text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 767px) {
  .ve-docs-row, .ve-docs-row--flip { grid-template-columns: 1fr; gap: 20px; }
  .ve-docs-row--flip > .ve-docs-photo { order: 0; }
  .ve-docs-photo .ve-photo-frame, .ve-docs-row--flip .ve-docs-photo .ve-photo-frame { max-width: 320px; margin: 0; }
}

.ve-docs-staff { padding-top: var(--section-y); border-top: 1px solid var(--c-line); }
.ve-docs-staff-list {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(20px, 3vw, 36px);
  margin: clamp(20px, 3vw, 32px) 0 0;
  padding: 0;
  list-style: none;
}
.ve-docs-member { margin: 0; padding: 0; }
.ve-docs-member::before { content: none; }
.ve-docs-member-photo { display: block; max-width: 180px; margin-bottom: 14px; }
.ve-docs-member-photo img { object-position: 50% 25%; }
.ve-docs-member h3 { margin: 0; font-size: var(--fs-h3); font-weight: 500; line-height: 1.3; }
.ve-docs-member h3 a { color: var(--c-ink); text-decoration: none; }
.ve-docs-member h3 a:hover { color: var(--c-pink); text-decoration: underline; text-underline-offset: 3px; }
.ve-docs-role { display: block; margin: 2px 0 8px; color: var(--c-muted); font-size: var(--fs-small); font-weight: 500; }
.ve-docs-member p { margin: 0; color: var(--c-text); font-size: var(--fs-small); line-height: 1.6; text-wrap: pretty; }
@media (max-width: 1023px) {
  .ve-docs-staff-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 380px) {
  .ve-docs-staff-list { grid-template-columns: 1fr; }
}
/* ================================== end MEET THE DOCTORS (lane a-interior) */