/* ============================================================
   Premier Hematology & Oncology — Shared Stylesheet
   ============================================================ */

/* ---- Tokens ------------------------------------------------ */
:root {
  --purple:        #5B3FA0;
  --purple-deep:   #3E2A6E;
  --purple-hover:  #4C3388;
  --lavender-chip: #EBE3FA;
  --lavender-bg:   #F4F0FB;
  --off-white:     #FAF8FD;
  --border:        #EFEAF8;
  --border-card:   #EEE7F7;
  --border-row:    #F1EDF8;
  --ink:           #1C1633;
  --body:          #56526A;
  --body-alt:      #43405A;
  --body-muted:    #6A6480;
  --muted-label:   #8A84A0;
  --footer-bg:     #141029;
  --footer-text:   #B3ACC9;
  --footer-subtle: #968FB0;
  --footer-label:  #6F6790;
  --footer-accent: #8D7FB8;
  --step-numeral:  #C3AEF0;
}

/* ---- Reset ------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; font-family: 'Hanken Grotesk', sans-serif; color: var(--body); background: #fff; -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
h1, h2, h3, h4, h5, h6, p { margin: 0; }
::selection { background: #ddd0f5; }

/* ---- Typography -------------------------------------------- */
.serif { font-family: 'Newsreader', serif; }

/* ---- Layout helpers --------------------------------------- */
.container      { max-width: 1200px; margin: 0 auto; padding: 0 40px; }
.container--md  { max-width: 1100px; margin: 0 auto; padding: 0 40px; }
.container--sm  { max-width: 760px;  margin: 0 auto; padding: 0 40px; }
.container--article-media { max-width: 1000px; margin: 0 auto; padding: 0 40px; }

/* ---- Buttons ---------------------------------------------- */
.btn {
  display: inline-flex; align-items: center; gap: 9px;
  padding: 14px 28px; background: var(--purple); color: #fff;
  border-radius: 999px; font-weight: 600; font-size: 15px;
  font-family: inherit; border: none; cursor: pointer;
  transition: background 0.15s;
  white-space: nowrap;
}
.btn:hover { background: var(--purple-hover); }
.btn--sm { padding: 11px 22px; font-size: 14px; }
.btn--lg { padding: 15px 30px; font-size: 15px; }
.btn--white { background: #fff; color: var(--purple); }
.btn--white:hover { background: #f0eafa; color: var(--purple); }

.link-text {
  font-weight: 600; font-size: 14px; letter-spacing: 0.04em;
  color: var(--purple); border-bottom: 1.5px solid #d8cbf2;
  padding-bottom: 2px; transition: border-color 0.15s;
}
.link-text:hover { border-color: var(--purple); }

/* ---- Eyebrows --------------------------------------------- */
.eyebrow-sans {
  display: inline-block; font-size: 12.5px; font-weight: 600;
  letter-spacing: 0.16em; text-transform: uppercase; color: var(--purple);
}
.eyebrow-serif {
  font-family: 'Newsreader', serif; font-style: italic;
  font-size: 17px; color: var(--purple);
}

/* ---- Cards ------------------------------------------------ */
.card {
  background: #fff; border: 1px solid var(--border-card);
  border-radius: 16px; overflow: hidden;
}

/* ---- Image placeholder (dev only) ------------------------- */
.img-placeholder {
  background: repeating-linear-gradient(45deg, #efeaf8, #efeaf8 12px, #f4f0fb 12px, #f4f0fb 24px);
  display: flex; align-items: center; justify-content: center;
  color: var(--muted-label); font-size: 13px; font-weight: 600;
  letter-spacing: 0.04em;
}

/* ---- Real images (replaces placeholders after media download) --- */
img.page-img {
  width: 100%; height: 100%; object-fit: cover; display: block;
  border-radius: inherit;
}

/* ============================================================
   UTILITY BAR
   ============================================================ */
.util-bar {
  background: var(--off-white);
  border-bottom: 1px solid var(--border);
}
.util-bar__inner {
  display: flex; justify-content: flex-end; align-items: center;
  gap: 26px; padding: 8px 40px; font-size: 13px; color: var(--body-muted);
  max-width: 1200px; margin: 0 auto;
}
.util-bar__portal {
  display: flex; align-items: center; gap: 7px;
}
.util-bar__dot {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--purple); display: inline-block;
}
.util-bar__phone { font-weight: 600; color: var(--ink); }

/* ============================================================
   HEADER / NAV
   ============================================================ */
.site-header {
  background: #fff; border-bottom: 1px solid var(--border);
  position: relative; z-index: 50;
}
.site-header__inner {
  max-width: 1200px; margin: 0 auto; padding: 18px 40px;
  display: flex; align-items: center; justify-content: space-between;
}

/* Logo */
.logo { display: flex; align-items: center; gap: 11px; }
.logo__mark {
  width: 34px; height: 34px; border-radius: 50%;
  border: 2px solid var(--purple);
  display: flex; align-items: center; justify-content: center; flex: none;
}
.logo__ribbon {
  width: 7px; height: 16px; background: var(--purple);
  border-radius: 4px; transform: rotate(20deg);
}
.logo__text { line-height: 1; }
.logo__name {
  font-weight: 700; letter-spacing: 0.04em; color: var(--ink); font-size: 16px;
}
.logo__sub {
  font-size: 11px; letter-spacing: 0.32em; color: var(--purple); margin-top: 3px;
}

/* Nav */
.site-nav {
  display: flex; align-items: center; gap: 30px;
  font-size: 14.5px; font-weight: 500; color: #2c2740;
  list-style: none; margin: 0; padding: 0;
}
.site-nav__item { position: relative; }
.site-nav__link {
  display: flex; align-items: center; gap: 5px; cursor: pointer;
  padding: 4px 0; transition: color 0.15s;
  color: inherit; text-decoration: none;
}
.site-nav__link:hover { color: var(--purple); }
.site-nav__arrow { font-size: 9px; opacity: 0.5; }

/* Dropdown */
.site-nav__item { padding-bottom: 14px; margin-bottom: -14px; }

.site-nav__dropdown {
  position: absolute; top: calc(100% + 0px); left: 50%;
  transform: translateX(-50%);
  background: #fff; border: 1px solid var(--border-card);
  border-radius: 14px; padding: 8px 0; min-width: 220px;
  box-shadow: 0 8px 30px rgba(91,63,160,.12);
  opacity: 0; pointer-events: none; transition: opacity 0.15s, transform 0.15s;
  transform: translateX(-50%) translateY(-6px);
  z-index: 100;
}
.site-nav__item:hover .site-nav__dropdown,
.site-nav__item:focus-within .site-nav__dropdown {
  opacity: 1; pointer-events: all;
  transform: translateX(-50%) translateY(0);
}
.site-nav__dropdown a {
  display: block; padding: 10px 20px; font-size: 14px;
  color: var(--body); transition: background 0.1s, color 0.1s;
}
.site-nav__dropdown a:hover { background: var(--lavender-bg); color: var(--purple); }

/* Nested flyout inside a dropdown (Our Services → Oncology → …).
   The parent link still navigates; the children open beside it on hover or
   when keyboard focus lands anywhere inside (:focus-within), the same rule
   the top-level dropdowns use. A 6px overlap keeps the pointer inside the
   hover area while it crosses from the parent row into the flyout. */
.site-nav__sub { position: relative; }
.site-nav__dropdown .site-nav__sub-parent {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
}
.site-nav__sub-arrow { font-size: 11px; opacity: 0.55; }
.site-nav__subdropdown {
  position: absolute; top: -9px; left: calc(100% - 6px);
  background: #fff; border: 1px solid var(--border-card);
  border-radius: 14px; padding: 8px 0; min-width: 290px;
  box-shadow: 0 8px 30px rgba(91,63,160,.12);
  opacity: 0; pointer-events: none; transform: translateX(-6px);
  transition: opacity 0.15s, transform 0.15s;
  z-index: 110;
}
.site-nav__sub:hover > .site-nav__subdropdown,
.site-nav__sub:focus-within > .site-nav__subdropdown {
  opacity: 1; pointer-events: all; transform: translateX(0);
}
.site-nav__sub:hover > .site-nav__sub-parent,
.site-nav__sub:focus-within > .site-nav__sub-parent { background: var(--lavender-bg); color: var(--purple); }
/* 901–1100px: the Services dropdown sits close to the right edge, so the
   flyout opens to the left instead of running off-screen. */
@media (max-width: 1100px) and (min-width: 901px) {
  .site-nav__subdropdown { left: auto; right: calc(100% - 6px); transform: translateX(6px); }
  .site-nav__sub-arrow { order: -1; transform: rotate(180deg); }
  .site-nav__dropdown .site-nav__sub-parent { justify-content: flex-start; }
}
/* 641–900px: no room for a flyout on either side, so the children are listed
   indented inside the dropdown, under Oncology (same as the mobile menu). */
@media (max-width: 900px) and (min-width: 641px) {
  .site-nav__subdropdown { position: static; transform: none; opacity: 1; pointer-events: all; box-shadow: none; border: none; border-radius: 0; padding: 0 0 4px 14px; min-width: auto; }
  .site-nav__subdropdown a { font-size: 13.5px; padding-top: 7px; padding-bottom: 7px; }
  .site-nav__sub-arrow { display: none; }
}

/* Hamburger (mobile) */
.nav-toggle {
  display: none; background: none; border: none; cursor: pointer; padding: 4px;
}
.nav-toggle__bar {
  display: block; width: 22px; height: 2px; background: var(--ink);
  margin: 5px 0; border-radius: 2px; transition: 0.2s;
}

/* ============================================================
   FOOTER
   ============================================================ */
.site-footer {
  background: var(--footer-bg); color: var(--footer-text);
}
.site-footer__grid {
  display: grid; grid-template-columns: 1.5fr 1fr 1fr 1.3fr;
  gap: 48px; padding: 70px 40px 30px;
  max-width: 1200px; margin: 0 auto;
}
.site-footer__logo { display: flex; align-items: center; gap: 10px; margin-bottom: 18px; }
.site-footer__logo-mark {
  width: 30px; height: 30px; border-radius: 50%;
  border: 2px solid var(--footer-accent);
  display: flex; align-items: center; justify-content: center; flex: none;
}
.site-footer__logo-ribbon {
  width: 6px; height: 14px; background: var(--footer-accent);
  border-radius: 3px; transform: rotate(20deg);
}
.site-footer__logo-text { line-height: 1.1; }
.site-footer__logo-name { font-weight: 700; letter-spacing: 0.04em; color: #fff; font-size: 14px; }
.site-footer__logo-sub { font-size: 9.5px; letter-spacing: 0.3em; color: var(--footer-accent); margin-top: 2px; }
.site-footer__blurb { font-size: 14px; line-height: 1.7; max-width: 280px; color: var(--footer-subtle); }

.site-footer__col-label {
  font-size: 12px; font-weight: 700; letter-spacing: 0.12em;
  text-transform: uppercase; color: var(--footer-label); margin-bottom: 18px;
}
.site-footer__links { display: flex; flex-direction: column; gap: 12px; font-size: 14px; }
.site-footer__links a { color: var(--footer-text); transition: color 0.15s; }
.site-footer__links a:hover { color: #fff; }
/* Fax is plain text, not a link — match the links it sits beside. */
.site-footer__fax { color: var(--footer-text); }

.site-footer__locations {
  display: grid; grid-template-columns: 1fr 1fr; gap: 11px 22px; font-size: 14px;
}
.site-footer__locations a { color: var(--footer-text); transition: color 0.15s; }
.site-footer__locations a:hover { color: #fff; }

.site-footer__bottom {
  border-top: 1px solid #2a2444;
}
.site-footer__bottom-inner {
  max-width: 1200px; margin: 0 auto; padding: 22px 40px;
  display: flex; justify-content: space-between; align-items: center;
  font-size: 13px; color: var(--footer-label);
}
.site-footer__bottom-links { display: flex; gap: 24px; }
.site-footer__bottom-links a { color: var(--footer-label); transition: color 0.15s; }
.site-footer__bottom-links a:hover { color: #fff; }

/* ============================================================
   HOMEPAGE
   ============================================================ */

/* Hero */
.hero {
  max-width: 1200px; margin: 0 auto; padding: 84px 40px 70px;
  display: grid; grid-template-columns: 1.05fr 1fr; gap: 56px; align-items: center;
}
.hero__eyebrow { margin-bottom: 22px; }
.hero__h1 {
  font-family: 'Newsreader', serif; font-weight: 500; font-size: 62px;
  line-height: 1.04; letter-spacing: -0.02em; color: var(--ink); margin-bottom: 22px;
}
.hero__h1 em { font-style: italic; color: var(--purple); }
.hero__lead {
  font-size: 17px; line-height: 1.65; max-width: 460px; margin-bottom: 34px; color: var(--body);
}
.hero__ctas { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }

/* Hero single image */
.hero__single-img {
  height: 520px; border-radius: 24px; overflow: hidden;
}

/* Announcement band */
.announce-band {
  background: var(--purple); color: #fff;
}
.announce-band__inner {
  max-width: 1200px; margin: 0 auto; padding: 20px 40px;
  display: flex; align-items: center; justify-content: space-between; gap: 24px;
}
.announce-band__text { font-size: 17px; font-weight: 500; }

/* Standards section */
.standards {
  max-width: 1200px; margin: 0 auto; padding: 96px 40px;
  display: grid; grid-template-columns: 1fr 1.1fr; gap: 64px; align-items: center;
}
.standards__eyebrow { margin-bottom: 14px; }
.standards__h2 {
  font-family: 'Newsreader', serif; font-weight: 500; font-size: 42px;
  line-height: 1.12; letter-spacing: -0.015em; color: var(--ink); margin-bottom: 24px;
}
.standards__body { font-size: 16.5px; line-height: 1.7; margin-bottom: 18px; }

/* Services grid */
.services-section {
  background: var(--off-white);
  border-top: 1px solid var(--border); border-bottom: 1px solid var(--border);
}
.services-section__inner { max-width: 1200px; margin: 0 auto; padding: 92px 40px; }
.services-section__eyebrow { margin-bottom: 10px; }
.services-section__h2 {
  font-family: 'Newsreader', serif; font-weight: 500; font-size: 40px;
  letter-spacing: -0.015em; color: var(--ink); margin-bottom: 48px;
}
.services-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; }
.service-card__img { height: 188px; overflow: hidden; }
.service-card__body { padding: 24px 24px 26px; }
.service-card__title {
  font-family: 'Newsreader', serif; font-weight: 600; font-size: 22px;
  color: var(--ink); margin-bottom: 9px;
}
.service-card__desc { font-size: 14.5px; line-height: 1.6; margin-bottom: 16px; color: var(--body-muted); }
.service-card__link {
  font-size: 13px; font-weight: 700; letter-spacing: 0.1em;
  text-transform: uppercase; color: var(--purple);
  transition: opacity 0.15s;
}
.service-card__link:hover { opacity: 0.75; }

/* CTA band */
.cta-band { max-width: 1200px; margin: 0 auto; padding: 80px 40px; }
.cta-band__inner {
  background: linear-gradient(110deg, var(--purple), var(--purple-deep));
  border-radius: 22px; padding: 48px 52px;
  display: flex; align-items: center; justify-content: space-between; gap: 30px;
}
.cta-band__h2 {
  font-family: 'Newsreader', serif; font-weight: 500; font-size: 34px;
  line-height: 1.2; color: #fff;
}

/* Women's health */
.womens-section {
  max-width: 1200px; margin: 0 auto; padding: 40px 40px 96px;
  display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center;
}
.womens-section__eyebrow { margin-bottom: 14px; }
.womens-section__h2 {
  font-family: 'Newsreader', serif; font-weight: 500; font-size: 40px;
  letter-spacing: -0.015em; color: var(--ink); margin-bottom: 22px;
}
.womens-section__body { font-size: 16.5px; line-height: 1.7; max-width: 440px; margin-bottom: 30px; }

/* Three features */
.features-section {
  background: var(--off-white); border-top: 1px solid var(--border);
}
.features-section__inner {
  max-width: 1100px; margin: 0 auto; padding: 90px 40px; text-align: center;
}
.features-section__eyebrow { margin-bottom: 10px; }
.features-section__h2 {
  font-family: 'Newsreader', serif; font-weight: 500; font-size: 40px;
  letter-spacing: -0.015em; color: var(--ink); margin-bottom: 56px;
}
.features-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 44px; }
.feature__icon {
  width: 64px; height: 64px; border-radius: 50%; background: var(--lavender-chip);
  display: flex; align-items: center; justify-content: center; margin: 0 auto 20px;
}
.feature__icon-mark {
  width: 9px; height: 22px; background: var(--purple);
  border-radius: 5px; transform: rotate(20deg);
}
.feature__title {
  font-family: 'Newsreader', serif; font-weight: 600; font-size: 21px;
  color: var(--ink); margin-bottom: 10px;
}
.feature__desc { font-size: 14.5px; line-height: 1.65; max-width: 280px; margin: 0 auto; color: var(--body-muted); }

/* 3-step journey */
.steps-section {
  max-width: 1200px; margin: 0 auto; padding: 96px 40px;
  display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center;
}
.steps-section__eyebrow { margin-bottom: 12px; }
.steps-section__h2 {
  font-family: 'Newsreader', serif; font-weight: 500; font-size: 38px;
  letter-spacing: -0.015em; color: var(--ink); margin-bottom: 36px;
}
.steps-list { display: flex; flex-direction: column; gap: 28px; }
.step { display: flex; gap: 20px; }
.step__num {
  font-family: 'Newsreader', serif; font-style: italic; font-size: 30px;
  color: var(--step-numeral); line-height: 1; min-width: 34px;
}
.step__title { font-weight: 700; font-size: 17px; color: var(--ink); margin-bottom: 6px; }
.step__desc { font-size: 14.5px; line-height: 1.6; color: var(--body-muted); }

/* ============================================================
   SERVICE PAGE
   ============================================================ */
.service-hero {
  background: linear-gradient(160deg, var(--lavender-bg), #ffffff);
}
.service-hero__inner {
  max-width: 1100px; margin: 0 auto; padding: 54px 40px 64px;
}
.breadcrumb { font-size: 13px; color: var(--muted-label); margin-bottom: 26px; }
.breadcrumb a { color: var(--muted-label); transition: color 0.15s; }
.breadcrumb a:hover { color: var(--purple); }
.breadcrumb__sep { opacity: 0.5; margin: 0 6px; }
.breadcrumb__current { color: var(--purple); }

.service-hero__eyebrow { margin-bottom: 16px; }
.service-hero__h1 {
  font-family: 'Newsreader', serif; font-weight: 500; font-size: 54px;
  line-height: 1.06; letter-spacing: -0.02em; color: var(--ink); margin-bottom: 18px; max-width: 720px;
}
.service-hero__lead { font-size: 18px; line-height: 1.6; max-width: 620px; }

.service-media {
  max-width: 1100px; margin: -32px auto 0; padding: 0 40px;
}
.service-media__img { height: 380px; border-radius: 18px; }

.service-body {
  max-width: 1100px; margin: 0 auto; padding: 72px 40px 80px;
  display: grid; grid-template-columns: 1.6fr 1fr; gap: 64px; align-items: start;
}
.service-body__h2 {
  font-family: 'Newsreader', serif; font-weight: 500; font-size: 32px;
  letter-spacing: -0.01em; color: var(--ink); margin-bottom: 18px;
}
.service-body__p { font-size: 16.5px; line-height: 1.75; margin-bottom: 18px; }
.service-body__h3 {
  font-family: 'Newsreader', serif; font-weight: 600; font-size: 24px;
  color: var(--ink); margin-bottom: 18px;
}
.checklist { display: flex; flex-direction: column; gap: 14px; margin-bottom: 38px; }
.checklist__item { display: flex; gap: 13px; align-items: flex-start; }
.checklist__check {
  width: 22px; height: 22px; border-radius: 50%; background: var(--lavender-chip);
  color: var(--purple); display: flex; align-items: center; justify-content: center;
  font-size: 12px; flex: none; margin-top: 1px;
}
.checklist__text { font-size: 16px; line-height: 1.5; color: #3c3852; }
.pullquote {
  border-left: 3px solid var(--purple); padding: 4px 0 4px 26px;
}
.pullquote p {
  font-family: 'Newsreader', serif; font-style: italic;
  font-size: 22px; line-height: 1.5; color: var(--ink);
}

/* Sidebar */
.service-sidebar {
  position: sticky; top: 80px; display: flex; flex-direction: column; gap: 20px;
}
.sidebar-cta {
  background: var(--purple); border-radius: 18px; padding: 30px;
}
.sidebar-cta__h3 {
  font-family: 'Newsreader', serif; font-weight: 500; font-size: 24px;
  color: #fff; margin-bottom: 10px;
}
.sidebar-cta__p { font-size: 14.5px; line-height: 1.6; color: #e2d8f7; margin-bottom: 22px; }
.sidebar-facts {
  border: 1px solid var(--border-card); border-radius: 18px; padding: 28px;
}
.sidebar-facts__label {
  font-size: 12.5px; font-weight: 700; letter-spacing: 0.12em;
  text-transform: uppercase; color: var(--muted-label); margin-bottom: 18px;
}
.fact-row {
  display: flex; justify-content: space-between; padding: 11px 0;
  border-bottom: 1px solid var(--border-row); font-size: 14.5px;
}
.fact-row:last-child { border-bottom: none; }
.fact-row__key { color: var(--body-muted); }
.fact-row__val { color: var(--ink); font-weight: 600; }

/* Related services */
.related-section {
  background: var(--off-white); border-top: 1px solid var(--border);
}
.related-section__inner { max-width: 1100px; margin: 0 auto; padding: 76px 40px; }
.related-section__h2 {
  font-family: 'Newsreader', serif; font-weight: 500; font-size: 32px;
  color: var(--ink); margin-bottom: 36px;
}
.related-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
.related-card__img { height: 200px; width: 100%; object-fit: cover; display: block; flex-shrink: 0; }
.related-card__body { padding: 22px; }
.related-card__title {
  font-family: 'Newsreader', serif; font-weight: 600; font-size: 20px;
  color: var(--ink); margin-bottom: 8px;
}
.related-card__desc { font-size: 14px; line-height: 1.55; margin-bottom: 14px; color: var(--body-muted); }
.related-card__link {
  font-size: 12.5px; font-weight: 700; letter-spacing: 0.1em;
  text-transform: uppercase; color: var(--purple);
}

/* ============================================================
   ARTICLE PAGE
   ============================================================ */
.article-header {
  max-width: 760px; margin: 0 auto; padding: 56px 40px 0;
}
.article-cat {
  display: inline-block; font-size: 12px; font-weight: 700;
  letter-spacing: 0.12em; text-transform: uppercase; color: var(--purple);
  background: var(--lavender-bg); padding: 6px 14px; border-radius: 999px;
  margin-bottom: 22px;
}
.article-header__h1 {
  font-family: 'Newsreader', serif; font-weight: 500; font-size: 48px;
  line-height: 1.1; letter-spacing: -0.02em; color: var(--ink); margin-bottom: 24px;
}
.article-byline {
  display: flex; align-items: center; gap: 14px;
  padding-bottom: 34px; border-bottom: 1px solid var(--border);
}
.article-byline__avatar {
  width: 44px; height: 44px; border-radius: 50%; background: var(--lavender-chip); flex: none;
}
.article-byline__name { font-weight: 600; color: var(--ink); font-size: 15px; }
.article-byline__meta { font-size: 13px; color: var(--muted-label); }

.article-hero-wrap {
  max-width: 1000px; margin: 36px auto 0; padding: 0 40px;
}
.article-hero-wrap__img { height: 420px; border-radius: 18px; width: 100%; object-fit: cover; display: block; }

.article-prose {
  max-width: 720px; margin: 0 auto; padding: 52px 40px 80px;
  font-size: 18px; line-height: 1.8; color: var(--body-alt);
}
.article-prose p { margin-bottom: 26px; }
.article-prose h2 {
  font-family: 'Newsreader', serif; font-weight: 500; font-size: 30px;
  line-height: 1.2; color: var(--ink); margin: 44px 0 18px;
}
.article-prose ul { margin: 0 0 26px; padding-left: 22px; }
.article-prose li { margin-bottom: 11px; }
.article-prose blockquote {
  margin: 38px 0; padding: 4px 0 4px 28px; border-left: 3px solid var(--purple);
}
.article-prose blockquote p {
  font-family: 'Newsreader', serif; font-style: italic;
  font-size: 24px; line-height: 1.45; color: var(--ink); margin-bottom: 0;
}

.article-footer {
  margin-top: 48px; padding-top: 30px; border-top: 1px solid var(--border);
  display: flex; align-items: center; justify-content: space-between; gap: 20px;
}
.article-footer__author { display: flex; align-items: center; gap: 14px; }
.article-footer__avatar {
  width: 52px; height: 52px; border-radius: 50%; background: var(--lavender-chip); flex: none;
}
.article-footer__name { font-weight: 600; color: var(--ink); font-size: 15px; }
.article-footer__title { font-size: 13px; color: var(--muted-label); }

/* More from blog */
.more-blog { background: var(--off-white); border-top: 1px solid var(--border); }
.more-blog__inner { max-width: 1100px; margin: 0 auto; padding: 72px 40px; }
.more-blog__h2 {
  font-family: 'Newsreader', serif; font-weight: 500; font-size: 30px;
  color: var(--ink); margin-bottom: 34px;
}
.blog-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
.blog-card__img { height: 170px; border-radius: 14px; margin-bottom: 16px; width: 100%; object-fit: cover; display: block; }
.blog-card__cat {
  font-size: 12px; font-weight: 700; letter-spacing: 0.1em;
  text-transform: uppercase; color: var(--purple); margin-bottom: 9px;
}
.blog-card__title {
  font-family: 'Newsreader', serif; font-weight: 600; font-size: 20px;
  line-height: 1.25; color: var(--ink);
}
.blog-card__title:hover { color: var(--purple); }

/* ============================================================
   BLOG INDEX
   ============================================================ */
.blog-hero {
  background: linear-gradient(160deg, var(--lavender-bg), #ffffff);
  padding: 64px 40px;
}
.blog-hero__inner { max-width: 1100px; margin: 0 auto; }
.blog-hero__h1 {
  font-family: 'Newsreader', serif; font-weight: 500; font-size: 54px;
  letter-spacing: -0.02em; color: var(--ink); margin-bottom: 16px;
}
.blog-hero__lead { font-size: 18px; line-height: 1.6; color: var(--body); max-width: 600px; }
.blog-main { max-width: 1100px; margin: 0 auto; padding: 72px 40px; }
.blog-index-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 36px; }

/* ============================================================
   LOCATION PAGE
   ============================================================ */
.location-hero {
  background: linear-gradient(160deg, var(--lavender-bg), #ffffff);
}
.location-hero__inner { max-width: 1100px; margin: 0 auto; padding: 54px 40px 64px; }
.location-hero__h1 {
  font-family: 'Newsreader', serif; font-weight: 500; font-size: 54px;
  line-height: 1.06; letter-spacing: -0.02em; color: var(--ink); margin-bottom: 18px; max-width: 720px;
}
.location-hero__lead { font-size: 18px; line-height: 1.6; max-width: 620px; }
.location-body { max-width: 1100px; margin: 0 auto; padding: 72px 40px; }

/* ============================================================
   LOCATION PAGE — new two-column layout
   ============================================================ */
.loc-hero { background: linear-gradient(160deg, var(--lavender-bg), #fff); }
.loc-hero__inner { max-width: 1100px; margin: 0 auto; padding: 56px 40px 60px; }
.loc-hero__h1 { font-family: 'Newsreader', serif; font-weight: 500; font-size: 52px; line-height: 1.07; letter-spacing: -.02em; color: var(--ink); margin-bottom: 16px; max-width: 700px; }
.loc-hero__lead { font-size: 18px; line-height: 1.65; color: var(--body); max-width: 600px; }

.loc-body { padding: 72px 40px; }
.loc-body__inner { max-width: 1100px; margin: 0 auto; display: grid; grid-template-columns: 1fr 380px; gap: 72px; align-items: start; }

/* Left column */
.loc-content__h2 { font-family: 'Newsreader', serif; font-weight: 500; font-size: 34px; line-height: 1.2; letter-spacing: -.015em; color: var(--ink); margin-bottom: 18px; }
.loc-content__h3 { font-family: 'Newsreader', serif; font-weight: 500; font-size: 22px; color: var(--ink); margin: 36px 0 16px; }
.loc-content__p { font-size: 16px; line-height: 1.78; color: var(--body); margin-bottom: 16px; }

/* Right sidebar */
.loc-sidebar { display: flex; flex-direction: column; gap: 24px; position: sticky; top: 100px; }

.loc-contact-card { background: #fff; border: 1px solid #e8e2f5; border-radius: 20px; padding: 32px 28px; box-shadow: 0 4px 24px rgba(91,63,160,.07); }
.loc-contact-card__label { font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--purple); margin-bottom: 20px; }
.loc-contact-card__row { display: flex; align-items: flex-start; gap: 10px; margin-bottom: 14px; font-size: 15px; line-height: 1.5; color: var(--body); }
.loc-contact-card__row svg { flex-shrink: 0; margin-top: 2px; color: var(--purple); }

.loc-map { border-radius: 14px; overflow: hidden; box-shadow: 0 2px 16px rgba(28,22,51,.08); }

/* Google Reviews carousel */
.reviews-section { margin-top: 48px; }
.reviews-section__header { display: flex; align-items: center; gap: 14px; margin-bottom: 20px; flex-wrap: wrap; }
.reviews-section__title { font-family: 'Newsreader', serif; font-weight: 500; font-size: 22px; color: var(--ink); margin: 0; }
.reviews-stars { color: #f59e0b; font-size: 18px; letter-spacing: 1px; }
.reviews-score { font-weight: 700; font-size: 16px; color: var(--ink); }
.reviews-count { font-size: 14px; color: var(--body); }
.reviews-section__rating { display: flex; align-items: center; gap: 6px; }

.reviews-carousel { position: relative; min-height: 180px; }
.review-card { display: none; background: #fff; border: 1px solid #e8e2f5; border-radius: 16px; padding: 28px; box-shadow: 0 2px 16px rgba(91,63,160,.06); }
.review-card--active { display: block; animation: fadeSlide .35s ease; }
@keyframes fadeSlide { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
.review-card__stars { color: #f59e0b; font-size: 16px; margin-bottom: 10px; }
.review-card__text { font-size: 15px; line-height: 1.72; color: var(--body); margin-bottom: 18px; }
.review-card__meta { display: flex; align-items: center; gap: 12px; }
.review-card__avatar { width: 36px; height: 36px; border-radius: 50%; object-fit: cover; }
.review-card__author { font-weight: 600; font-size: 14px; color: var(--ink); }
.review-card__time { font-size: 12px; color: #888; margin-top: 2px; }

.reviews-nav { display: flex; gap: 8px; margin-top: 16px; }
.reviews-dot { width: 8px; height: 8px; border-radius: 50%; border: none; background: #d8d2ec; cursor: pointer; padding: 0; transition: background .2s; }
.reviews-dot--active { background: var(--purple); }

.reviews-skeleton { display: flex; gap: 16px; }
.reviews-skeleton__card { flex: 1; height: 160px; border-radius: 16px; background: linear-gradient(90deg, #f0ecfb 25%, #e8e2f5 50%, #f0ecfb 75%); background-size: 200% 100%; animation: shimmer 1.5s infinite; }
@keyframes shimmer { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 900px) {
  .container, .container--md { padding: 0 24px; }
  .hero { grid-template-columns: 1fr; padding: 56px 24px 48px; }
  .hero__single-img { display: none; }
  .hero__h1 { font-size: 44px; }
  .standards { grid-template-columns: 1fr; padding: 64px 24px; }
  .services-grid { grid-template-columns: 1fr 1fr; }
  .womens-section { grid-template-columns: 1fr; padding: 40px 24px 64px; }
  .features-grid { grid-template-columns: 1fr; gap: 32px; }
  .steps-section { grid-template-columns: 1fr; padding: 64px 24px; }
  .service-body { grid-template-columns: 1fr; }
  .service-sidebar { position: static; }
  .loc-body__inner { grid-template-columns: 1fr; }
  .loc-sidebar { position: static; }
  .loc-hero__h1 { font-size: 38px; }
  .reviews-skeleton { flex-direction: column; }
  .reviews-skeleton__card { height: 80px; }
  .related-grid, .blog-grid, .blog-index-grid { grid-template-columns: 1fr 1fr; }
  .cta-band__inner { flex-direction: column; text-align: center; }
  .site-footer__grid { grid-template-columns: 1fr 1fr; gap: 36px; }
  .service-media { margin-top: 24px; }
  .service-media .service-media__img { margin-top: 0; }
}

/* ==========================================================
   FORMS
   ========================================================== */
.form-section { background: #faf8fd; border-top: 1px solid #efeaf8; border-bottom: 1px solid #efeaf8; padding: 80px 40px; }
.form-layout { max-width: 1100px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1.1fr; gap: 72px; align-items: start; }
.form-layout__trust { padding-top: 8px; }
.form-layout__trust h2,
.form-layout__trust h1 { font-family: 'Newsreader', serif; font-weight: 500; font-size: 34px; line-height: 1.2; letter-spacing: -0.015em; color: var(--ink); margin-bottom: 16px; }
.form-layout__trust p { font-size: 16px; line-height: 1.75; color: var(--body); margin-bottom: 24px; }
.form-layout__trust .checklist__item { display: flex; gap: 10px; align-items: flex-start; margin-bottom: 12px; }
.form-layout__trust .checklist__check { color: var(--purple); font-size: 15px; line-height: 1.6; flex-shrink: 0; }
.form-layout__trust .checklist__text { font-size: 15px; line-height: 1.6; color: var(--body); }
.form-card { background: #fff; border: 1px solid #e8e2f5; border-radius: 20px; padding: 40px 36px; box-shadow: 0 4px 24px rgba(91,63,160,.07); }
.form-card__title { font-family: 'Newsreader', serif; font-weight: 500; font-size: 22px; color: var(--ink); margin-bottom: 6px; }
.form-card__sub { font-size: 14px; color: var(--body); margin-bottom: 28px; }
.form-row { display: flex; flex-wrap: wrap; gap: 14px; margin-bottom: 14px; }
.form-group { display: flex; flex-direction: column; gap: 5px; flex: 1 1 200px; }
.form-group--full { flex: 1 1 100%; }
.form-group label { font-size: 13px; font-weight: 600; letter-spacing: .02em; color: var(--ink); }
.form-group label .req { color: var(--purple); margin-left: 2px; }
.form-group input,
.form-group textarea,
.form-group select { width: 100%; padding: 11px 14px; border: 1.5px solid #d8d2ec; border-radius: 10px; font-size: 15px; font-family: 'Hanken Grotesk', sans-serif; color: var(--ink); background: #fff; transition: border-color .18s; box-sizing: border-box; }
.form-group input:focus,
.form-group textarea:focus,
.form-group select:focus { outline: none; border-color: var(--purple); box-shadow: 0 0 0 3px rgba(91,63,160,.1); }
.form-group textarea { resize: vertical; min-height: 100px; }
.form-group input[type="file"] { padding: 8px 10px; font-size: 13px; cursor: pointer; }
.form-group--radio legend,
.form-group--check legend { font-size: 13px; font-weight: 600; letter-spacing: .02em; color: var(--ink); margin-bottom: 8px; display: block; }
.form-group--radio legend .req,
.form-group--check legend .req { color: var(--purple); margin-left: 2px; }
.radio-grid, .check-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 16px; }
.radio-opt, .check-opt { display: flex; align-items: center; gap: 8px; font-size: 14px; color: var(--body); cursor: pointer; }
.radio-opt input, .check-opt input { width: 16px; height: 16px; accent-color: var(--purple); cursor: pointer; }
.form-section__divider { font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--purple); border-top: 1px solid #efeaf8; padding-top: 20px; margin: 8px 0 16px; }
.form-hp { display: none !important; }
/* Consent block — the SMS opt-in must stay visibly separate from the terms
   line and from the submit button, not buried in fine print. */
.form-consent { margin-top: 22px; }
.form-consent__opt {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 12.5px;
  line-height: 1.6;
  color: #56526A;
  cursor: pointer;
}
.form-consent__opt input[type="checkbox"] {
  flex-shrink: 0;
  width: 17px;
  height: 17px;
  margin: 2px 0 0;
  accent-color: #5B3FA0;
  cursor: pointer;
}
.form-consent__opt a { color: #5B3FA0; text-decoration: underline; }
.form-consent__fine {
  font-size: 11.5px;
  line-height: 1.55;
  color: #8b83a8;
  margin: 6px 0 0 27px;
}
.form-consent__fine a { color: #5B3FA0; text-decoration: underline; }
.form-consent__terms {
  font-size: 12px;
  line-height: 1.6;
  color: #8b83a8;
  margin: 12px 0 0;
}
.form-consent__terms a { color: #5B3FA0; text-decoration: underline; }

.form-submit { margin-top: 20px; }
.form-submit .btn { width: 100%; justify-content: center; font-size: 16px; padding: 14px 24px; }
.form-msg { margin-top: 12px; font-size: 14px; text-align: center; min-height: 20px; }
.form-msg--error { color: #c0392b; }

/* Referral form two-column rows */
.form-row--half .form-group { flex: 1 1 calc(50% - 8px); min-width: 0; }

/* Wide single-form pages */
.form-section--wide .form-layout { grid-template-columns: 1fr; max-width: 760px; }
.form-section--wide .form-layout__trust { display: none; }

@media (max-width: 900px) {
  .form-layout { grid-template-columns: 1fr; gap: 40px; }
  .form-section { padding: 56px 24px; }
}

/* Forms dropped into a slot the page has already framed — a contact column
   beside address details, or a centred block under its own heading. The
   full-bleed band and the trust panel repeat what the surrounding page is
   already saying, and nesting the 1100px two-column layout inside a grid
   column squeezed the card to roughly half its intended width. Declared
   after the 900px query so the section padding it resets stays reset.
   Applied by build_forms.py wherever a page uses the form-card placeholder. */
.form-section--inline { background: none; border: 0; padding: 0; text-align: left; }
.form-section--inline .form-layout { grid-template-columns: 1fr; max-width: none; gap: 0; }
.form-section--inline .form-layout__trust { display: none; }

/* A page-level split: an explanatory column beside an injected form card.
   These were written as inline styles, and an inline style cannot be
   overridden by a media query — so the sections stayed two-column at 375px
   and pushed the form off the side of the screen. As classes they collapse. */
.split-form { max-width: 1100px; margin: 0 auto; padding: 88px 40px; display: grid; grid-template-columns: 1fr 1.1fr; gap: 72px; align-items: start; }
.split-form--even { max-width: 1200px; grid-template-columns: 1fr 1fr; gap: 64px; }
.split-form--flush { max-width: none; padding: 0; gap: 56px; grid-template-columns: 1fr 1fr; }

@media (max-width: 900px) {
  .split-form { grid-template-columns: 1fr; gap: 40px; padding: 56px 24px; }
  .split-form--flush { padding: 0; gap: 40px; }
}

/* ----------------------------------------------------------
   Collapsing the inline-styled grids
   ----------------------------------------------------------
   Many sections are laid out with an inline style="display:grid".
   An inline declaration beats any normal rule, so a media query could not
   collapse them: they stayed two, three and four columns wide at phone
   widths and pushed their content off the side of the screen. !important is
   what lets a stylesheet override an inline declaration, so these classes sit
   alongside the existing inline style and take effect at narrow widths only.
   Desktop layout is still governed entirely by the inline style, unchanged.

   Grids written with repeat(auto-fit, minmax(...)) already collapse on their
   own and carry no class. */
@media (max-width: 900px) {
  .grid-collapse,
  .grid-collapse-side { grid-template-columns: 1fr !important; }
  .grid-collapse-3    { grid-template-columns: repeat(2, 1fr) !important; }
}

@media (max-width: 600px) {
  .grid-collapse-3 { grid-template-columns: 1fr !important; }
}

/* ==========================================================
   END FORMS
   ========================================================== */

@media (max-width: 640px) {
  .util-bar__inner { padding: 8px 20px; }
  .site-header__inner { padding: 14px 20px; }
  .site-nav { display: none; }
  .site-nav.is-open { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; position: absolute; top: 100%; left: 0; right: 0; background: #fff; border-bottom: 1px solid var(--border); padding: 16px 20px 24px; z-index: 200; }
  .site-nav__dropdown { position: static; transform: none; opacity: 1; pointer-events: all; box-shadow: none; border: none; padding: 4px 0 4px 16px; min-width: auto; }
  /* Nested submenu: listed open, indented one more step under its parent. */
  .site-nav__subdropdown { position: static; transform: none; opacity: 1; pointer-events: all; box-shadow: none; border: none; border-radius: 0; padding: 0 0 4px 16px; min-width: auto; }
  .site-nav__subdropdown a { font-size: 13.5px; padding-top: 7px; padding-bottom: 7px; }
  .site-nav__sub-arrow { display: none; }
  .site-nav__sub:hover > .site-nav__sub-parent,
  .site-nav__sub:focus-within > .site-nav__sub-parent { background: none; }
  .nav-toggle { display: block; }
  .hero__h1 { font-size: 36px; }
  .services-grid { grid-template-columns: 1fr; }
  .related-grid, .blog-grid, .blog-index-grid { grid-template-columns: 1fr; }
  .site-footer__grid { grid-template-columns: 1fr; }
  .site-footer__bottom-inner { flex-direction: column; gap: 12px; text-align: center; }
  .article-header { padding: 40px 20px 0; }
  .article-hero-wrap, .article-prose { padding-left: 20px; padding-right: 20px; }
  .announce-band__inner { flex-direction: column; text-align: center; }
  .article-footer { flex-direction: column; align-items: flex-start; }
  .container--sm { padding: 0 20px; }
}

/* ---------------------------------------------------------------------------
   Care team grid
   Photo-first cards. The bio is a panel positioned over its own card, so
   opening one never moves anything below it — the reason this is not an
   accordion. The panel is `hidden` until opened, so its text is skipped by
   the keyboard and by screen readers rather than merely painted behind.
--------------------------------------------------------------------------- */
.team-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 22px;
}
.team-card {
  position: relative;
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 14px;
  overflow: hidden;
  transition: box-shadow .2s ease, transform .2s ease;
}
.team-card:hover { box-shadow: 0 8px 24px rgba(28,22,51,.09); transform: translateY(-2px); }
.team-card__photo {
  width: 100%;
  /* height:auto is load-bearing: the img carries width/height attributes so the
     browser can reserve space before the file arrives, and those attributes map
     to a presentational height that otherwise beats aspect-ratio outright —
     every photo rendered a fixed 400px tall and the crop tightened as the card
     narrowed. */
  height: auto;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  object-position: top center;
  display: block;
  background: var(--lavender-bg);
}
.team-card__body { padding: 16px 18px 18px; display: flex; flex-direction: column; flex: 1; }
.team-card__name {
  font-family: 'Newsreader', serif; font-weight: 500; font-size: 18px;
  line-height: 1.25; color: var(--ink); margin-bottom: 4px;
}
.team-card__role {
  font-size: 10.5px; font-weight: 700; color: var(--purple);
  text-transform: uppercase; letter-spacing: .06em; line-height: 1.45;
  margin-bottom: 14px;
}
.team-card__toggle {
  margin-top: auto; align-self: flex-start;
  background: none; border: 0; padding: 0; cursor: pointer;
  font-family: inherit; font-size: 12.5px; font-weight: 600; color: var(--purple);
}
.team-card__toggle:hover { text-decoration: underline; }
.team-card__toggle span { transition: transform .18s ease; display: inline-block; }
.team-card__toggle:hover span { transform: translateX(3px); }

/* The bio panel itself. [hidden] keeps it out of the tree; .is-open fades it
   in over the card once the script has revealed it. */
.team-card__bio {
  position: absolute; inset: 0; z-index: 2;
  background: #fff;
  display: flex; flex-direction: column;
  opacity: 0; transition: opacity .2s ease;
}
/* `hidden` must win over the display above, or a closed panel stays laid over
   its card as an invisible layer and eats every click meant for the button
   underneath — the Read bio buttons were dead to the mouse because of it. */
.team-card__bio[hidden] { display: none; }
.team-card__bio.is-open { opacity: 1; }
.team-card__bio-scroll { overflow-y: auto; padding: 20px 20px 24px; }
.team-card__bio-name {
  font-family: 'Newsreader', serif; font-weight: 500; font-size: 17px;
  color: var(--ink); margin-bottom: 3px; padding-right: 26px;
}
.team-card__bio-role {
  font-size: 10px; font-weight: 700; color: var(--purple);
  text-transform: uppercase; letter-spacing: .06em; margin-bottom: 12px;
}
.team-card__bio-text { font-size: 12.5px; line-height: 1.6; color: var(--body); }
/* These bios run long enough to scroll inside the card, and a panel clipped
   mid-sentence with no bottom edge reads as broken rather than as scrollable.
   The script adds .has-more only when the text actually overflows. */
.team-card__bio.has-more::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 44px;
  background: linear-gradient(to bottom, rgba(255,255,255,0), #fff 72%);
  pointer-events: none;
}
.team-card__close {
  position: absolute; top: 8px; right: 10px; z-index: 3;
  width: 26px; height: 26px; border: 1px solid var(--border); border-radius: 50%;
  background: #fff; color: var(--ink);
  font-size: 19px; line-height: 1; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
}
.team-card__close:hover { background: var(--lavender-bg); }
.team-card__toggle:focus-visible,
.team-card__close:focus-visible { outline: 2px solid var(--purple); outline-offset: 2px; }

@media (max-width: 1040px) { .team-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 780px)  { .team-grid { grid-template-columns: repeat(2, 1fr); } }
/* One column on a phone: at two columns the bio panel is too narrow to read. */
@media (max-width: 560px) {
  .team-grid { grid-template-columns: 1fr; gap: 18px; }
  /* Wider than the desktop crop so a full-width card is not mostly photo,
     but not so wide that it cuts the face. */
  .team-card__photo { aspect-ratio: 4 / 3; }
}
@media (prefers-reduced-motion: reduce) {
  .team-card, .team-card__bio, .team-card__toggle span { transition: none; }
  .team-card:hover { transform: none; }
}

/* ---- Care team card links ---------------------------------
   The card name links through to that provider's own profile page; the bio
   panel keeps the same link at the end so a reader who opened the panel is
   not sent back to the card to find it. The photo link is aria-hidden and
   untabbable on purpose — it duplicates the name link for mouse users
   without adding a second stop for the keyboard.
-------------------------------------------------------------- */
.team-card__photo-link { display: block; }
.team-card__link { color: inherit; }
.team-card:hover .team-card__link { color: var(--purple); }
.team-card__link:focus-visible { outline: 2px solid var(--purple); outline-offset: 2px; }
.team-card__bio-more { margin-top: 14px; font-size: 12.5px; font-weight: 600; }
.team-card__bio-more a { color: var(--purple); }
.team-card__bio-more a:hover { text-decoration: underline; }

/* ---- Provider profile pages -------------------------------- */
.btn--ghost { background: #fff; color: var(--purple); border: 1px solid var(--border-card); }
.btn--ghost:hover { background: var(--lavender-bg); color: var(--purple); }

.provider-hero { background: var(--lavender-bg); border-bottom: 1px solid var(--border); }
.provider-hero__inner { max-width: 1100px; margin: 0 auto; padding: 26px 40px 64px; }
.provider-hero__grid {
  display: grid; grid-template-columns: 320px 1fr; gap: 56px; align-items: start;
}
.provider-hero__photo {
  width: 100%; height: auto; aspect-ratio: 4 / 5;
  object-fit: cover; object-position: top center;
  border-radius: 18px; background: #fff;
}
.provider-hero__h1 {
  font-family: 'Newsreader', serif; font-weight: 500; font-size: 46px;
  line-height: 1.08; letter-spacing: -0.02em; color: var(--ink); margin-bottom: 10px;
}
.provider-hero__role {
  font-size: 15px; font-weight: 600; color: var(--purple); margin-bottom: 28px;
}
.provider-facts { margin: 0 0 30px; }
.provider-facts__row {
  display: grid; grid-template-columns: 170px 1fr; gap: 16px;
  padding: 12px 0; border-top: 1px solid var(--border-card);
}
.provider-facts__row:last-child { border-bottom: 1px solid var(--border-card); }
.provider-facts dt {
  font-size: 11px; font-weight: 700; color: var(--muted-label);
  text-transform: uppercase; letter-spacing: .06em; padding-top: 2px;
}
.provider-facts dd { margin: 0; font-size: 15px; line-height: 1.6; color: var(--body); }
.provider-facts dd a { color: var(--purple); font-weight: 500; }
.provider-facts dd a:hover { text-decoration: underline; }
.provider-hero__cta { display: flex; flex-wrap: wrap; gap: 12px; }

.provider-body__inner { max-width: 800px; margin: 0 auto; padding: 72px 40px 24px; }
.provider-body__h2 {
  font-family: 'Newsreader', serif; font-weight: 500; font-size: 30px;
  letter-spacing: -0.015em; color: var(--ink); margin-bottom: 18px;
}
/* The bio paragraph sets no bottom margin of its own (the reset zeroes it),
   so the Education heading needs the gap or it crowds the last line. */
.provider-body__h2 + * { margin-top: 0; }
.provider-body__text + .provider-body__h2 { margin-top: 44px; }
.provider-body__text { font-size: 17px; line-height: 1.8; color: var(--body); }
.provider-edu {
  margin: 0 0 8px; padding-left: 20px;
  font-size: 16px; line-height: 1.9; color: var(--body);
}
.provider-body__back { margin-top: 36px; font-size: 15px; font-weight: 600; }
.provider-body__back a { color: var(--purple); }
.provider-body__back a:hover { text-decoration: underline; }

.provider-also { border-top: 1px solid var(--border); background: var(--off-white); }
.provider-also__inner { max-width: 1100px; margin: 0 auto; padding: 56px 40px 72px; }
.provider-also__h2 {
  font-family: 'Newsreader', serif; font-weight: 500; font-size: 26px;
  color: var(--ink); margin-bottom: 26px;
}
.provider-also__grid {
  display: grid; grid-template-columns: repeat(5, 1fr); gap: 18px;
}
.provider-also__item {
  display: block; background: #fff; border: 1px solid var(--border-card);
  border-radius: 12px; overflow: hidden; padding-bottom: 14px;
  transition: box-shadow .2s ease, transform .2s ease;
}
.provider-also__item:hover { box-shadow: 0 8px 24px rgba(28,22,51,.09); transform: translateY(-2px); }
.provider-also__item img {
  width: 100%; height: auto; aspect-ratio: 4 / 5;
  object-fit: cover; object-position: top center; margin-bottom: 12px;
  background: var(--lavender-bg);
}
.provider-also__name {
  display: block; padding: 0 14px; font-family: 'Newsreader', serif;
  font-size: 16px; line-height: 1.25; color: var(--ink); margin-bottom: 4px;
}
.provider-also__role {
  display: block; padding: 0 14px; font-size: 10.5px; font-weight: 700;
  color: var(--purple); text-transform: uppercase; letter-spacing: .06em; line-height: 1.45;
}

@media (max-width: 900px) {
  .provider-hero__grid { grid-template-columns: 1fr; gap: 32px; }
  .provider-hero__photo { max-width: 300px; }
  .provider-hero__h1 { font-size: 38px; }
  .provider-also__grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 640px) {
  .provider-hero__inner { padding: 20px 24px 48px; }
  /* 'Yaakov Perlstein, MSN, APRN, FNP-C, AOCNP' is three lines of display
     serif on a phone at the desktop size. */
  .provider-hero__h1 { font-size: 32px; }
  .provider-body__inner { padding: 48px 24px 16px; }
  .provider-also__inner { padding: 40px 24px 56px; }
  .provider-facts__row { grid-template-columns: 1fr; gap: 4px; }
  .provider-also__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (prefers-reduced-motion: reduce) {
  .provider-also__item { transition: none; }
  .provider-also__item:hover { transform: none; }
}

/* ----------------------------------------------------------
   Oncology paid landing pages (/oncology/second-opinion/,
   /oncology/womens-cancer-care/) and /oncology-confirmation/
   ---------------------------------------------------------- */
.onc-insurance {
  background: var(--lavender-chip); color: var(--purple-deep);
  font-size: 19px; font-weight: 700; line-height: 1.3; text-align: center;
  border-radius: 12px; padding: 14px 16px; margin-bottom: 22px;
}
.onc-form-note {
  font-size: 15px; line-height: 1.6; color: #3A3454; background: #F7F4FD;
  border-left: 3px solid var(--purple); border-radius: 0 10px 10px 0;
  padding: 12px 14px; margin: 14px 0 6px;
}
.onc-hero__h1 {
  font-family: 'Newsreader', serif; font-weight: 500; font-size: 38px; line-height: 1.12;
  letter-spacing: -0.02em; color: var(--ink); margin-bottom: 20px;
}
@media (max-width: 640px) { .onc-hero__h1 { font-size: 29px; } }
.onc-docs { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.onc-docs__faces { display: flex; }
.onc-docs__faces img {
  width: 64px; height: 64px; border-radius: 50%; object-fit: cover; object-position: top;
  border: 3px solid #fff; box-shadow: 0 2px 8px rgba(28,22,51,.14); margin-left: -12px; background: #fff;
}
.onc-docs__faces img:first-child { margin-left: 0; }
.onc-docs__caption { font-size: 14.5px; font-weight: 600; color: #3A3454; margin: 0; }

/* Floating "Book an Appointment" button — phones only */
.onc-sticky { display: none; }
@media (max-width: 768px) {
  .onc-sticky {
    display: block; position: fixed; left: 16px; right: 16px; bottom: 16px; z-index: 900;
    background: var(--purple); color: #fff; text-align: center; text-decoration: none;
    font-size: 17px; font-weight: 700; padding: 16px; border-radius: 999px;
    box-shadow: 0 8px 24px rgba(28,22,51,.28); transition: opacity .2s, transform .2s;
  }
  .onc-sticky--hidden { opacity: 0; transform: translateY(120%); pointer-events: none; }
  .onc-landing .site-footer { padding-bottom: 88px; }
  .onc-landing .grecaptcha-badge { bottom: 88px !important; }
}

/* Oncology thank-you page */
.onc-ty { max-width: 720px; margin: 0 auto; padding: 72px 24px 88px; }
.onc-ty p { font-size: 17px; line-height: 1.7; color: #56526A; margin: 0 0 12px; }
.onc-ty__hero { text-align: center; padding-bottom: 36px; border-bottom: 1px solid var(--border); }
.onc-ty__hero .onc-docs { justify-content: center; margin: 4px 0 26px; }
.onc-ty__check {
  width: 72px; height: 72px; border-radius: 50%; background: var(--lavender-chip); color: var(--purple);
  font-size: 30px; display: flex; align-items: center; justify-content: center; margin: 0 auto 24px;
}
.onc-ty h1 { font-family: 'Newsreader', serif; font-weight: 500; font-size: 40px; line-height: 1.12; color: var(--ink); margin-bottom: 14px; }
.onc-ty__lead { font-size: 19px !important; font-weight: 600; color: #3A3454 !important; margin-bottom: 26px !important; }
.onc-ty__strong { font-weight: 700; color: var(--purple-deep) !important; }
.onc-ty__block { padding: 36px 0; border-bottom: 1px solid var(--border); }
.onc-ty__block:last-child { border-bottom: 0; }
.onc-ty h2 { font-family: 'Newsreader', serif; font-weight: 500; font-size: 30px; color: var(--ink); margin-bottom: 18px; }
.onc-ty__steps { list-style: none; padding: 0; margin: 0; display: grid; gap: 14px; }
.onc-ty__steps li { background: #fff; border: 1px solid var(--border-card); border-radius: 14px; padding: 20px 22px; }
.onc-ty__steps h3 { font-size: 18px; color: var(--ink); margin-bottom: 8px; }
.onc-ty__steps p:last-child { margin-bottom: 0; }
.onc-ty__sign { font-weight: 700; color: var(--ink) !important; margin-top: 18px !important; }
.onc-ty__fine { font-size: 15px !important; color: #6A6480 !important; }
@media (max-width: 640px) { .onc-ty h1 { font-size: 32px; } }
.onc-call-line { font-size: 15px; color: #56526A; margin: 22px 0 0; }
.onc-call-line a { color: var(--purple); font-weight: 700; text-decoration: none; white-space: nowrap; }
.onc-doc-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.onc-doc-grid img { height: 260px !important; }
@media (max-width: 1000px) { .onc-doc-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .onc-doc-grid { grid-template-columns: 1fr; } .onc-doc-grid img { height: 320px !important; } }
