/* ============================================
   TGDC Homepage v3.7 — Production CSS
   ============================================
   Scoped to body.hp-v2 to avoid conflicts.
   Add class via body_class filter in functions.php.
   
   Design tokens match site-wide system:
     Orange: #fb9000    Teal: #6cc8d7
     Purple: #9b59b6    Green: #4aae8c
     Red: #e8724a       Rose: #d94f6e
     Ink: #2a2520       Body: #555
     Meta: #6b7378      Ghost: #c5bfb8
     Tobacco: #7f6045   Border: #e6e6e6
     Warm light: #faf8f5  Warm bg: #f5f0eb
     Charcoal: #2c2c2c
   
   Fonts: Lora (serif), Poppins (sans)
   ============================================ */

/* ── Reset for homepage ── */
body.hp-v2 .wrapper { margin-top: 0; }
body.hp-v2 main { background: #fff; }

/* ── HERO ── */
.hp-hero {
  position: relative;
  overflow: hidden;
  background: linear-gradient(160deg, #f5f0eb 0%, #e8e0d8 40%, #f5f0eb 100%);
}

.hp-hero__inkblot {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 2200px;
  height: auto;
  opacity: 0.05;
  mix-blend-mode: multiply;
  pointer-events: none;
  z-index: 0;
}

.hp-hero__inner {
  position: relative;
  z-index: 1;
  max-width: 1000px;
  margin: 0 auto;
  padding: 80px 40px 60px;
}

.hp-hero__content {
  max-width: 640px;
}

/* H1 styled as eyebrow label */
.hp-hero h1 {
  font-family:var(--font-ui);
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 2px;
  color: #fb9000;
  margin: 0 0 24px;
  line-height: 1.4;
}

/* H2 styled as dominant visual headline */
.hp-hero h2 {
  font-family:var(--font-display);font-size-adjust:var(--display-optical-size,none);
  font-size: 40px;
  font-weight: var(--display-weight);
  line-height: 1.15;
  color: #2a2520;
  margin: 0 0 20px;
  letter-spacing: -0.5px;
}
.hp-hero h2 span { color: #fb9000; }

.hp-hero__differentiator {
  font-family:var(--font-body);font-size-adjust:var(--body-optical-size,none);
  font-size: 19.5px;
  line-height: 1.7;
  color: #555;
  margin: 0 0 16px;
}

.hp-hero__positioning {
  font-family:var(--font-body);font-size-adjust:var(--body-optical-size,none);
  font-size: 20px;
  font-style: italic;
  line-height: 1.6;
  color: #2a2520;
  margin: 0 0 32px;
}

.hp-hero__ctas {
  display: flex;
  gap: 14px;
  align-items: center;
}

.hp-btn-primary {
  background: #fb9000;
  color: #fff;
  border: none;
  border-radius: 8px;
  padding: 14px 28px;
  font-family:var(--font-ui);
  font-weight: 600;
  font-size: 15px;
  cursor: pointer;
  transition: background 0.3s;
  text-decoration: none;
  display: inline-block;
}
.hp-btn-primary:hover { background: #db7a05; color: #fff; }

.hp-btn-secondary {
  background: transparent;
  color: #2a2520;
  border: 1.5px solid #c5bfb8;
  border-radius: 8px;
  padding: 13px 24px;
  font-family:var(--font-ui);
  font-weight: 500;
  font-size: 15px;
  cursor: pointer;
  text-decoration: none;
  display: inline-block;
  transition: border-color 0.3s;
}
.hp-btn-secondary:hover { border-color: #8e979b; }

.hp-hero__micro {
  font-family:var(--font-ui);
  font-size: 13px;
  color: #6b7378;
  margin-top: 12px;
}

.hp-hero__wink {
  font-family:var(--font-body);font-size-adjust:var(--body-optical-size,none);
  font-style: italic;
  font-size: 13px;
  color: #7f6045;
  margin-top: 16px;
  line-height: 1.6;
}
/* Pulse card */
.hp-pulse {
  margin-top: 48px;
  padding: 18px 24px;
  background: rgba(255,255,255,0.6);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border-radius: 10px;
  border: 1px solid rgba(230,230,230,0.6);
  display: flex;
  align-items: center;
  gap: 16px;
  max-width: 640px;
}

.hp-pulse__dots {
  display: flex;
  flex-shrink: 0;
}
.hp-pulse__dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  border: 1.5px solid rgba(255,255,255,0.8);
}
.hp-pulse__dot:not(:first-child) { margin-left: -4px; }

.hp-pulse__label {
  font-family:var(--font-ui);
  font-size: 9.5px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  color: #fb9000;
  margin-bottom: 3px;
}

.hp-pulse__text {
  font-family:var(--font-body);font-size-adjust:var(--body-optical-size,none);
  font-size: 13.5px;
  line-height: 1.5;
  color: #555;
  margin: 0;
}

/* ── RAINBOW DIVIDER ── */
.hp-rainbow {
  height: 3px;
  width: 100%;
  background: linear-gradient(90deg, #fb9000, #e8724a, #d94f6e, #9b59b6, #6cc8d7, #4aae8c);
}

/* ── EXPERIENTIAL PROMPTS ── */
.hp-prompts {
  background: #fff;
  padding: 72px 40px;
}

.hp-prompts__inner {
  max-width: 1000px;
  margin: 0 auto;
}

.hp-prompts__header {
  text-align: center;
  margin-bottom: 48px;
}

.hp-prompts__header h2 {
  font-family:var(--font-display);font-size-adjust:var(--display-optical-size,none);
  font-size: 26px;
  font-weight: 500;
  color: #2a2520;
  margin: 0 0 8px;
  line-height: 1.4;
}

.hp-prompts__header p {
  font-family:var(--font-ui);
  font-size: 14px;
  color: #6b7378;
  margin: 0;
}

.hp-prompts__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

.hp-prompt-card {
  background: #fff;
  border-radius: 12px;
  border: 1px solid #e6e6e6;
  border-left-width: 3px;
  padding: 20px 28px;
  cursor: pointer;
  transition: all 0.25s ease;
}
.hp-prompt-card:hover,
.hp-prompt-card.is-open {
  background: #faf8f5;
}
.hp-prompt-card.is-open {
  padding: 24px 28px;
}

.hp-prompt-card__top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}

.hp-prompt-card__quote {
  font-family:var(--font-body);font-size-adjust:var(--body-optical-size,none);
  font-size: 17px;
  font-style: italic;
  line-height: 1.5;
  color: #2a2520;
  margin: 0;
}

.hp-prompt-card__category {
  font-family:var(--font-ui);
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1px;
  white-space: nowrap;
  margin-left: 16px;
  flex-shrink: 0;
  margin-top: 4px;
}

.hp-prompt-card__expand {
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid #e6e6e6;
  display: none;
}
.hp-prompt-card.is-open .hp-prompt-card__expand { display: block; }

.hp-prompt-card__validation {
  font-family:var(--font-body);font-size-adjust:var(--body-optical-size,none);
  font-size: 15px;
  line-height: 1.7;
  color: #555;
  margin: 0 0 14px;
}

.hp-prompt-card__link {
  font-family:var(--font-ui);
  font-size: 13px;
  font-weight: 600;
  color: #7f6045;
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-color: rgba(127,96,69,0.35);
  transition: text-decoration-color 0.3s;
}
.hp-prompt-card__link:hover {
  text-decoration-color: rgba(127,96,69,0.8);
}

/* Chiclets */
.hp-chiclets {
  margin-top: 32px;
  padding: 20px 24px;
  background: #faf8f5;
  border-radius: 10px;
  border: 1px solid #e6e6e6;
}

.hp-chiclets__label {
  font-family:var(--font-ui);
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  color: #6b7378;
  margin-bottom: 12px;
}

.hp-chiclets__wrap {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.hp-chiclet {
  font-family:var(--font-ui);
  font-size: 13px;
  color: #7f6045;
  padding: 6px 14px;
  background: #fff;
  border-radius: 20px;
  border: 1px solid #e6e6e6;
  text-decoration: none;
  transition: all 0.2s;
}
.hp-chiclet:hover {
  border-color: #7f6045;
  color: #7f6045;
}

/* ── HOW IT WORKS ── */
.hp-how {
  background: #f5f0eb;
  padding: 72px 40px;
  position: relative;
}

.hp-how__inner {
  max-width: 900px;
  margin: 0 auto;
}

.hp-how h2 {
  font-family:var(--font-display);font-size-adjust:var(--display-optical-size,none);
  font-size: 28px;
  font-weight: 500;
  color: #fb9000;
  margin: 0 0 12px;
  text-align: center;
}

.hp-how__subtitle {
  font-family:var(--font-body);font-size-adjust:var(--body-optical-size,none);
  font-size: 17px;
  line-height: 1.65;
  color: #555;
  margin: 0 auto 40px;
  max-width: 520px;
  text-align: center;
}

.hp-step {
  display: grid;
  grid-template-columns: 80px 1fr;
  gap: 24px;
  padding: 28px 0;
  align-items: start;
}
.hp-step:not(:last-child) {
  border-bottom: 1px solid rgba(0,0,0,0.06);
}

.hp-step__num {
  font-family:var(--font-display);font-size-adjust:var(--display-optical-size,none);
  font-size: 42px;
  font-weight: var(--display-weight);
  opacity: 0.2;
  line-height: 1;
}

.hp-step__title {
  font-family:var(--font-display);font-size-adjust:var(--display-optical-size,none);
  font-size: 18px;
  font-weight: var(--display-weight);
  color: #2a2520;
  margin: 0 0 8px;
}

.hp-step__body {
  font-family:var(--font-body);font-size-adjust:var(--body-optical-size,none);
  font-size: 15.5px;
  line-height: 1.7;
  color: #555;
  margin: 0;
}

.hp-how__cta {
  text-align: center;
  margin-top: 36px;
}

.hp-how__cta-sub {
  font-family:var(--font-ui);
  font-size: 13px;
  color: #6b7378;
  margin-top: 10px;
}

/* ── PRACTICE IDENTITY ── */
.hp-identity {
  background: #fff;
  padding: 72px 40px;
}

.hp-identity__inner {
  max-width: 1000px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 56px;
  align-items: center;
}

.hp-identity__video {
  width: 100%;
  aspect-ratio: 16/9;
  border-radius: 12px;
  overflow: hidden;
  position: relative;
  box-shadow: 0 16px 40px rgba(0,0,0,0.08);
  background: transparent;
}

.hp-identity__play {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.hp-identity__play-btn {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: rgba(255,255,255,0.9);
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 16px rgba(0,0,0,0.15);
}

.hp-identity__caption {
  font-family:var(--font-ui);
  font-size: 12.5px;
  color: #6b7378;
  margin: 12px 0 0;
  text-align: center;
}

.hp-identity__text h2 {
  font-family:var(--font-display);font-size-adjust:var(--display-optical-size,none);
  font-size: 28px;
  font-weight: 500;
  color: #fb9000;
  margin: 0 0 20px;
}

.hp-identity__text p {
  font-family:var(--font-body);font-size-adjust:var(--body-optical-size,none);
  font-size: 17px;
  line-height: 1.8;
  color: #555;
  margin-bottom: 18px;
}
.hp-identity__text p:last-child { margin-bottom: 0; }

/* ── THERAPIST GLIMPSE ── */
.hp-therapists {
  background: #faf8f5;
  padding: 72px 40px;
}

.hp-therapists__inner {
  max-width: 1000px;
  margin: 0 auto;
}

.hp-therapists__header {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 40px;
}

.hp-therapists__header h2 {
  font-family:var(--font-display);font-size-adjust:var(--display-optical-size,none);
  font-size: 28px;
  font-weight: 500;
  color: #fb9000;
  margin: 0 0 8px;
}

.hp-therapists__header p {
  font-family:var(--font-body);font-size-adjust:var(--body-optical-size,none);
  font-size: 17px;
  color: #555;
  margin: 0;
  line-height: 1.6;
}

.hp-therapists__team-link {
  font-family:var(--font-ui);
  font-size: 14px;
  font-weight: 600;
  color: #7f6045;
  text-decoration: underline;
  text-underline-offset: 3px;
  white-space: nowrap;
}

.hp-therapists__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}

.hp-therapist-card {
  background: #fff;
  border-radius: 12px;
  padding: 24px 20px;
  border: 1px solid #e6e6e6;
  display: block;
  text-decoration: none;
  transition: border-color 0.2s, box-shadow 0.2s;
}
.hp-therapist-card:hover {
  border-color: #c5bfb8;
  box-shadow: 0 2px 12px rgba(0,0,0,0.06);
  text-decoration: none;
}

.hp-therapist-card__avatar {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family:var(--font-ui);
  font-weight: 600;
  font-size: 15px;
  margin-bottom: 14px;
}

.hp-therapist-card__photo {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  object-fit: cover;
  margin-bottom: 14px;
  border: 2px solid #e6e6e6;
}

.hp-therapist-card__name {
  font-family:var(--font-ui);
  font-size: 15px;
  font-weight: 600;
  color: #2a2520;
  margin: 0 0 2px;
}

.hp-therapist-card__role {
  font-family:var(--font-ui);
  font-size: 11px;
  color: #6b7378;
  margin-bottom: 10px;
}

.hp-therapist-card__tagline {
  font-family:var(--font-body);font-size-adjust:var(--body-optical-size,none);
  font-size: 14px;
  line-height: 1.55;
  color: #555;
  margin: 0;
}

.hp-therapists__below {
  text-align: center;
  margin-top: 28px;
}

.hp-therapists__below em {
  font-family:var(--font-body);font-size-adjust:var(--body-optical-size,none);
  font-size: 16px;
  color: #555;
}

.hp-therapists__below-link {
  font-family:var(--font-ui);
  font-size: 15px;
  font-weight: 600;
  color: #7f6045;
  text-decoration: underline;
  text-underline-offset: 3px;
  cursor: pointer;
}

/* ── CREDIBILITY ── */
.hp-cred {
  background: #2c2c2c;
  padding: 56px 40px;
}

.hp-cred__inner {
  max-width: 900px;
  margin: 0 auto;
  text-align: center;
}

.hp-cred__stats {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 40px;
  margin-bottom: 36px;
}

.hp-cred__stat-num {
  font-family:var(--font-display);font-size-adjust:var(--display-optical-size,none);
  font-size: 36px;
  font-weight: var(--display-weight);
  color: #fff;
  margin-bottom: 6px;
  line-height: 1.2;
}

.hp-cred__stat-label {
  font-family:var(--font-ui);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  color: rgba(255,255,255,0.5);
}

/* Gray payment card */
.hp-cred__pay-card {
  padding: 20px 28px;
  background: rgba(255,255,255,0.05);
  border-radius: 8px;
  border: 1px solid rgba(255,255,255,0.08);
  display: inline-flex;
  align-items: center;
  gap: 24px;
  margin-bottom: 32px;
}

.hp-cred__pay-label {
  font-family:var(--font-ui);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  color: rgba(255,255,255,0.4);
  margin-bottom: 4px;
}

.hp-cred__pay-amount {
  font-family:var(--font-display);font-size-adjust:var(--display-optical-size,none);
  font-size: 24px;
  font-weight: var(--display-weight);
  color: #fff;
}

.hp-cred__pay-detail {
  font-family:var(--font-body);font-size-adjust:var(--body-optical-size,none);
  font-size: 13px;
  color: rgba(255,255,255,0.45);
  margin-top: 2px;
}

.hp-cred__pay-divider {
  width: 1px;
  height: 48px;
  background: rgba(255,255,255,0.1);
}

.hp-cred__pay-rates {
  font-family:var(--font-ui);
  font-size: 13px;
  color: rgba(255,255,255,0.5);
  line-height: 1.5;
  text-align: left;
}

.hp-cred__pay-help {
  font-family:var(--font-body);font-size-adjust:var(--body-optical-size,none);
  font-size: 12px;
  color: rgba(255,255,255,0.35);
  margin-top: 4px;
  text-align: left;
}

.hp-cred__prose {
  font-family:var(--font-body);font-size-adjust:var(--body-optical-size,none);
  font-size: 15px;
  line-height: 1.65;
  color: rgba(255,255,255,0.45);
  margin: 0 auto 28px;
  max-width: 560px;
}

.hp-cred__unis {
  font-family:var(--font-ui);
  font-size: 12px;
  color: rgba(255,255,255,0.3);
}

.hp-cred__strip {
  margin-top: 28px;
  padding-top: 20px;
  border-top: 1px solid rgba(255,255,255,0.08);
  font-family:var(--font-ui);
  font-size: 13px;
  color: rgba(255,255,255,0.5);
  display: flex;
  justify-content: center;
  gap: 20px;
  align-items: center;
}
.hp-cred__strip strong { color: #fff; }
.hp-cred__strip-sep { color: rgba(255,255,255,0.2); }

/* ── EDITORIAL ── */
.hp-editorial {
  background: #faf8f5;
  padding: 64px 40px;
}

.hp-editorial__inner {
  max-width: 900px;
  margin: 0 auto;
}

.hp-editorial__header {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 32px;
}

.hp-editorial__label {
  font-family:var(--font-ui);
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  color: #6b7378;
  margin-bottom: 6px;
}

.hp-editorial__header h2 {
  font-family:var(--font-display);font-size-adjust:var(--display-optical-size,none);
  font-size: 24px;
  font-weight: 500;
  color: #fb9000;
  margin: 0;
}

.hp-editorial__all-link {
  font-family:var(--font-ui);
  font-size: 14px;
  font-weight: 600;
  color: #7f6045;
  text-decoration: underline;
  text-underline-offset: 3px;
  white-space: nowrap;
}

.hp-editorial__post {
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 20px 0;
  cursor: pointer;
  text-decoration: none;
}
.hp-editorial__post:not(:last-child) {
  border-bottom: 1px solid #e6e6e6;
}

.hp-editorial__rank {
  font-family:var(--font-display);font-size-adjust:var(--display-optical-size,none);
  font-size: 24px;
  font-weight: var(--display-weight);
  color: #c5bfb8;
  min-width: 40px;
}

.hp-editorial__post-title {
  font-family:var(--font-body);font-size-adjust:var(--body-optical-size,none);
  font-size: 17px;
  font-weight: 500;
  color: #2a2520;
  margin: 0;
  line-height: 1.35;
  flex: 1;
}

.hp-editorial__post-cat {
  font-family:var(--font-ui);
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1px;
  white-space: nowrap;
}

.hp-editorial__post-readers {
  font-family:var(--font-ui);
  font-size: 12px;
  color: #6b7378;
  white-space: nowrap;
}

/* Rotating insights */
.hp-insights {
  margin-top: 24px;
  display: flex;
  align-items: center;
  gap: 12px;
  justify-content: center;
  min-height: 32px;
}

.hp-insights__dots {
  display: flex;
}
.hp-insights__dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  border: 1.5px solid #faf8f5;
}
.hp-insights__dot:not(:first-child) { margin-left: -4px; }

.hp-insights__text {
  font-family:var(--font-ui);
  font-size: 13px;
  color: #6e787c;
  transition: opacity 0.5s ease;
}

/* ── FAQ ── */
.hp-faq {
  background: #fff;
  padding: 72px 40px;
}

.hp-faq__inner {
  max-width: 760px;
  margin: 0 auto;
}

.hp-faq__header {
  text-align: center;
  margin-bottom: 48px;
}

.hp-faq__header h2 {
  font-family:var(--font-display);font-size-adjust:var(--display-optical-size,none);
  font-size: 24px;
  font-weight: 500;
  color: #fb9000;
  margin: 0 0 8px;
}

.hp-faq__header p {
  font-family:var(--font-body);font-size-adjust:var(--body-optical-size,none);
  font-size: 15px;
  color: #6b7378;
  margin: 0;
  font-style: italic;
}

.hp-faq__category {
  margin-bottom: 48px;
}

.hp-faq__cat-heading {
  border-left-width: 3px;
  border-left-style: solid;
  padding-left: 16px;
  margin-bottom: 8px;
}

.hp-faq__cat-heading h3 {
  font-family:var(--font-display);font-size-adjust:var(--display-optical-size,none);
  font-size: 17px;
  font-weight: var(--display-weight);
  color: #2a2520;
  margin: 0;
}

.hp-faq__questions {
  padding-left: 19px;
}

.hp-faq__item {
  border-bottom: 1px solid #e6e6e6;
}

.hp-faq__q {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 18px 0;
  background: none;
  border: none;
  cursor: pointer;
  text-align: left;
}

.hp-faq__q-text {
  font-family:var(--font-ui);
  font-size: 15px;
  font-weight: 500;
  color: #2a2520;
  padding-right: 24px;
}

.hp-faq__q-toggle {
  font-family:var(--font-ui);
  font-size: 20px;
  color: #6b7378;
  flex-shrink: 0;
  transition: transform 0.2s;
  line-height: 1;
}
.hp-faq__item.is-open .hp-faq__q-toggle {
  transform: rotate(45deg);
}

.hp-faq__a {
  font-family:var(--font-body);font-size-adjust:var(--body-optical-size,none);
  font-size: 15px;
  line-height: 1.75;
  color: #555;
  padding: 0 0 24px;
  max-width: 680px;
  display: none;
}
.hp-faq__item.is-open .hp-faq__a { display: block; }

.hp-faq__a p { margin: 0 0 16px; }
.hp-faq__a p:last-child { margin-bottom: 0; }

/* FAQ closing box */
.hp-faq__closing {
  margin-top: 20px;
  padding: 20px 24px;
  background: #faf8f5;
  border-radius: 8px;
}

.hp-faq__closing h4 {
  font-family:var(--font-display);font-size-adjust:var(--display-optical-size,none);
  font-size: 15px;
  font-weight: var(--display-weight);
  color: #2a2520;
  margin: 0 0 8px;
}

.hp-faq__closing p {
  font-family:var(--font-body);font-size-adjust:var(--body-optical-size,none);
  font-size: 14.5px;
  line-height: 1.7;
  color: #555;
  margin: 0;
}

/* FAQ content links — tobacco to match site standard */
.hp-faq__a a,
.hp-faq__closing a {
  color: #7f6045 !important;
  text-decoration: underline !important;
  text-decoration-color: rgba(127,96,69,0.35) !important;
  text-underline-offset: 3px;
  transition: all 0.3s ease;
}
.hp-faq__a a:hover,
.hp-faq__closing a:hover {
  color: #5e4530 !important;
  text-decoration-color: rgba(127,96,69,0.8) !important;
}

/* ── BOTTOM CTA ── */
.hp-bottom-cta {
  background: linear-gradient(135deg, #faf8f5 0%, #f5f0eb 100%);
  padding: 64px 40px;
  text-align: center;
}

.hp-bottom-cta__lead {
  font-family:var(--font-body);font-size-adjust:var(--body-optical-size,none);
  font-size: 17px;
  color: #555;
  margin: 0 0 12px;
  font-style: italic;
}

.hp-bottom-cta h2 {
  font-family:var(--font-display);font-size-adjust:var(--display-optical-size,none);
  font-size: 30px;
  font-weight: var(--display-weight);
  color: #2a2520;
  margin: 0 0 14px;
  line-height: 1.2;
}

.hp-bottom-cta__body {
  font-family:var(--font-body);font-size-adjust:var(--body-optical-size,none);
  font-size: 16px;
  line-height: 1.65;
  color: #555;
  margin: 0 auto 24px;
  max-width: 480px;
}

.hp-bottom-cta__micro {
  font-family:var(--font-ui);
  font-size: 13px;
  color: #6b7378;
  margin-top: 10px;
}

/* ── NEW FOOTER ── */
.hp-footer {
  background: #2c2c2c;
  padding: 48px 40px 32px;
}

.hp-footer__inner {
  max-width: 1000px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr;
  gap: 40px;
}

.hp-footer__brand {
  font-family:var(--font-ui);
  font-weight: 600;
  font-size: 16px;
  color: #fff;
  margin-bottom: 12px;
}

.hp-footer__address {
  font-family:var(--font-body);font-size-adjust:var(--body-optical-size,none);
  font-size: 14px;
  line-height: 1.6;
  color: rgba(255,255,255,0.45);
  margin: 0;
}

.hp-footer__col-title {
  font-family:var(--font-ui);
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  color: rgba(255,255,255,0.5);
  margin-bottom: 16px;
}

.hp-footer__link {
  display: block;
  font-family:var(--font-ui);
  font-size: 13px;
  margin-bottom: 8px;
  color: rgba(255,255,255,0.45);
  text-decoration: none;
  transition: color 0.2s;
}
.hp-footer__link:hover { color: rgba(255,255,255,0.7); }

.hp-footer__bottom {
  max-width: 1000px;
  margin: 32px auto 0;
  padding-top: 20px;
  border-top: 1px solid rgba(255,255,255,0.08);
  font-family:var(--font-ui);
  font-size: 12px;
  color: rgba(255,255,255,0.25);
}
.hp-footer__legal {
  margin-bottom: 10px;
}
.hp-footer__legal-link {
  color: rgba(255,255,255,0.35);
  text-decoration: none;
  transition: color 0.2s;
}
.hp-footer__legal-link:hover {
  color: rgba(255,255,255,0.6);
}
.hp-footer__legal-sep {
  margin: 0 8px;
  color: rgba(255,255,255,0.15);
}
.hp-footer__copyright {
  color: rgba(255,255,255,0.25);
}

/* ── RESPONSIVE ── */
@media (max-width: 1000px) {
  .hp-identity__inner { grid-template-columns: 1fr; gap: 40px; }
  .hp-therapists__grid { grid-template-columns: repeat(2, 1fr); }
  .hp-footer__inner { grid-template-columns: 1fr 1fr; gap: 32px; }
}

@media (max-width: 768px) {
  .hp-hero h2 { font-size: 32px; }
  .hp-hero__inner { padding: 60px 24px 40px; }
  .hp-prompts { padding: 48px 24px; }
  .hp-prompts__grid { grid-template-columns: 1fr; }
  .hp-how { padding: 48px 24px; }
  .hp-step { grid-template-columns: 60px 1fr; gap: 16px; }
  .hp-step__num { font-size: 32px; }
  .hp-identity { padding: 48px 24px; }
  .hp-therapists { padding: 48px 24px; }
  .hp-therapists__header { flex-direction: column; align-items: flex-start; gap: 12px; }
  .hp-therapists__grid { grid-template-columns: 1fr 1fr; }
  .hp-editorial { padding: 48px 24px; }
  .hp-editorial__header { flex-direction: column; align-items: flex-start; gap: 8px; }
  .hp-faq { padding: 48px 24px; }
  .hp-cred { padding: 40px 24px; }
  .hp-cred__stats { grid-template-columns: 1fr; gap: 24px; }
  .hp-cred__pay-card { flex-direction: column; gap: 16px; text-align: center; }
  .hp-cred__pay-divider { width: 100%; height: 1px; }
  .hp-cred__pay-rates, .hp-cred__pay-help { text-align: center; }
  .hp-bottom-cta { padding: 48px 24px; }
  .hp-bottom-cta h2 { font-size: 26px; }
  .hp-footer { padding: 40px 24px 24px; }
  .hp-footer__inner { grid-template-columns: 1fr; gap: 24px; }
  .hp-editorial__post { flex-wrap: wrap; gap: 8px; }
  .hp-editorial__post-cat, .hp-editorial__post-readers { display: none; }
  .hp-hero__ctas { flex-direction: column; align-items: flex-start; }
}

@media (max-width: 480px) {
  .hp-hero h2 { font-size: 28px; }
  .hp-hero__differentiator { font-size: 17px; }
  .hp-hero__positioning { font-size: 18px; }
  .hp-therapists__grid { grid-template-columns: 1fr; }
  .hp-cred__pay-amount { font-size: 20px; }
}

/* ============================================================
   REIMAGINE restructure — additive styles (front-page.php ?v=reimagine)
   Reuses the v3.7 token system (--font-display / --font-body / --font-ui)
   and the established palette. Nothing here overrides v3.7 classes.
   ============================================================ */

/* ── shared eyebrow ── */
.hp-eyebrow {
  font-family: var(--font-ui);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 2.2px;
  text-transform: uppercase;
  margin-bottom: 12px;
}
.hp-eyebrow--tobacco { color: #7f6045; }
.hp-eyebrow--orange  { color: #fb9000; }

/* section seam + flat hero field (visual fidelity to prototype) */
.hp-reimagine.hp-hero--atmos,
.hp-reimagine .hp-hero--atmos { background: #f4efe8; }
.hp-reimagine .hp-prompts { background: #faf8f5; border-top: 1px solid #ece7e0; }

/* Roster section is white; the cards now use the canonical tl-card component from
   therapist-listing.css (enqueued on the front page via functions.php), so the
   homepage roster stays pixel-consistent with /therapist-near-me-dc/ — scrim,
   hover, creds, tagline, and colored specialty chiclets all inherited. */
.hp-reimagine .hp-therapists { background: #fff; }

/* ── HERO atmosphere: bloom (SEASONAL) + grain + ghost inkblot.
   Per the design drift build-note: keep the layered structure; the bloom palette
   rotates with the quarterly inkblot (Q1 winter · Q2 spring · Q3 summer · Q4 autumn)
   so the season's bloom matches the season's blot. Grain + inkblot are
   season-agnostic. Each palette is warm-anchored at the core so the corner reads
   warm, never gray. ── */
/* Four decorative layers behind the text column, all aria-hidden + pointer-events:none.
   Paint order = DOM order (front-page.php): L1 bloom → L2 core (screen) → L3 blot (screen)
   → L4 grain (multiply). Reference box top:-160 right:-180 1000x1040 (spec §1). */
/* L1 bloom — warm luminous field (season palette below) */
.hp-hero--atmos .hp-hero__bloom {
  position: absolute; top: -160px; right: -180px;
  width: 1000px; height: 1040px; pointer-events: none; z-index: 0;
  -webkit-mask-image: radial-gradient(ellipse 66% 70% at 72% 34%, #000 26%, transparent 78%);
  mask-image: radial-gradient(ellipse 66% 70% at 72% 34%, #000 26%, transparent 78%);
}
/* SPRING — amber core · terracotta · sage · lavender · warm-rose (spec §1) */
.hp-hero--spring .hp-hero__bloom{background:
  radial-gradient(ellipse 34% 38% at 60% 30%, rgba(240,176,104,.56), rgba(240,176,104,0) 60%),
  radial-gradient(ellipse 30% 34% at 76% 20%, rgba(226,142,92,.42),  rgba(226,142,92,0) 58%),
  radial-gradient(ellipse 32% 34% at 80% 46%, rgba(158,186,146,.34), rgba(158,186,146,0) 60%),
  radial-gradient(ellipse 26% 30% at 55% 52%, rgba(190,172,206,.28), rgba(190,172,206,0) 58%),
  radial-gradient(ellipse 24% 26% at 88% 34%, rgba(224,178,172,.34), rgba(224,178,172,0) 58%);}
/* SUMMER — amber core · rose · teal (spec §2) */
.hp-hero--summer .hp-hero__bloom{background:
  radial-gradient(ellipse 34% 38% at 60% 30%, rgba(240,176,104,.56), transparent 60%),
  radial-gradient(ellipse 30% 34% at 76% 20%, rgba(230,112,60,.40),  transparent 58%),
  radial-gradient(ellipse 32% 34% at 80% 46%, rgba(90,165,179,.32),  transparent 60%),
  radial-gradient(ellipse 26% 30% at 55% 52%, rgba(224,82,117,.26),  transparent 58%),
  radial-gradient(ellipse 24% 26% at 88% 34%, rgba(124,151,131,.30), transparent 58%);}
/* AUTUMN — amber core · berry · dusty-blue (spec §2) */
.hp-hero--autumn .hp-hero__bloom{background:
  radial-gradient(ellipse 34% 38% at 60% 30%, rgba(238,164,96,.54),  transparent 60%),
  radial-gradient(ellipse 30% 34% at 76% 20%, rgba(214,134,90,.42),  transparent 58%),
  radial-gradient(ellipse 32% 34% at 80% 46%, rgba(88,132,166,.28),  transparent 60%),
  radial-gradient(ellipse 26% 30% at 55% 52%, rgba(186,86,108,.30),  transparent 58%),
  radial-gradient(ellipse 24% 26% at 88% 34%, rgba(214,134,90,.30),  transparent 58%);}
/* WINTER — warmed hardest: clay core, frost-pink/teal only at the dissolving edge (spec §2) */
.hp-hero--winter .hp-hero__bloom{background:
  radial-gradient(ellipse 34% 38% at 60% 30%, rgba(240,172,102,.58), transparent 60%),
  radial-gradient(ellipse 30% 34% at 76% 20%, rgba(222,140,96,.42),  transparent 58%),
  radial-gradient(ellipse 32% 34% at 80% 46%, rgba(120,165,160,.22), transparent 60%),
  radial-gradient(ellipse 26% 30% at 55% 52%, rgba(228,150,180,.26), transparent 58%),
  radial-gradient(ellipse 24% 26% at 88% 34%, rgba(210,128,118,.28), transparent 58%);}
/* L2 core highlight — bright warm core; screen only ADDS light (spec §1 layer 2) */
.hp-hero--atmos .hp-hero__core {
  position: absolute; top: -160px; right: -180px;
  width: 1000px; height: 1040px; pointer-events: none; z-index: 0;
  mix-blend-mode: screen;
  background: radial-gradient(ellipse 20% 24% at 64% 28%, rgba(252,214,150,.70), rgba(252,214,150,0) 62%);
}
/* L3 blot — the season's real Rorschach SVG. mix-blend-mode:screen is CRITICAL: screen can
   only ADD light, never darken — this is what kills the "gray smudge." Do NOT change to
   normal/multiply. Bright warm filter push (spec §1 layer 3). */
.hp-hero__inkblot--blot {
  left: auto; right: -160px; top: -120px; transform: none; width: 1060px; height: auto;
  opacity: .95; mix-blend-mode: screen;
  filter: brightness(1.30) saturate(1.65) sepia(.42) hue-rotate(-11deg) blur(6px);
  -webkit-mask-image: radial-gradient(ellipse 46% 50% at 66% 32%, #000 12%, rgba(0,0,0,.4) 48%, transparent 74%);
  mask-image: radial-gradient(ellipse 46% 50% at 66% 32%, #000 12%, rgba(0,0,0,.4) 48%, transparent 74%);
}
/* L4 grain — pigment-on-paper; multiply. Pre-baked 220px WebP tile (spec §5): a REAL file,
   because prod's CSS inliner absolutizes url() values and corrupts data: URIs
   (reference_wpe_css_svg_minify — second incarnation). */
.hp-hero--atmos .hp-hero__grain {
  position: absolute; top: -160px; right: -180px;
  width: 1000px; height: 1040px; pointer-events: none; z-index: 0;
  mix-blend-mode: multiply; opacity: .75;
  background-image: url(images/grain-tile.webp);
  -webkit-mask-image: radial-gradient(ellipse 64% 68% at 72% 34%, #000 12%, transparent 74%);
  mask-image: radial-gradient(ellipse 64% 68% at 72% 34%, #000 12%, transparent 74%);
}
/* headline scale — dominant (build note 1.1) */
.hp-reimagine .hp-hero h2 { font-size: 56px; line-height: 1.06; letter-spacing: -1.1px; }
@media (max-width: 768px){ .hp-reimagine .hp-hero h2 { font-size: 38px; } }
@media (max-width: 480px){ .hp-reimagine .hp-hero h2 { font-size: 35px; line-height: 1.08; letter-spacing: -0.6px; } }

/* hero dek — terracotta subheadline: roman, clearly larger than body (a tier of its
   own between the 56px headline and the body), generous air above and below. */
.hp-reimagine .hp-hero__kicker {
  font-family:var(--font-body);font-size-adjust:var(--body-optical-size,none);
  font-size: 26px;
  line-height: 1.4;
  color: var(--accent-terracotta);
  margin: 30px 0 38px;
}
@media (max-width: 768px){ .hp-reimagine .hp-hero__kicker { font-size: 23px; } }
@media (max-width: 480px){ .hp-reimagine .hp-hero__kicker { font-size: 19px; line-height: 1.35; } }

/* body block — both paragraphs: quiet warm-gray body ink #4f4a44 (matches the site's
   elevated blog body; the brightened ink now carries the visual energy, so the body reads
   quiet) at 17px / 1.65, grouped tightly so they read as one block. Scoped to reimagine so
   the shared base rules + v37 (current) hero are untouched. */
.hp-reimagine .hp-hero__differentiator {
  font-size: 17px;
  line-height: 1.65;
  color: #4f4a44;
  margin: 0 0 14px;
}
.hp-reimagine .hp-hero__positioning {
  font-size: 17px;
  font-style: normal;
  line-height: 1.65;
  color: #4f4a44;
  margin: 0 0 40px; /* top 0 groups it with the paragraph above; bottom adds air over the CTA row */
}
/* the claim is wrapped in <em> (UA-italic by default) — force upright so both paragraphs
   read as one grouped block; their separation is spacing, not style. */
.hp-reimagine .hp-hero__positioning em { font-style: normal; }
@media (max-width: 480px){
  .hp-reimagine .hp-hero__differentiator { font-size: 15px; }
  .hp-reimagine .hp-hero__positioning { font-size: 15px; }
}

/* ── Hero layout + eyebrow — spec §1 exact; scoped so v37 (shared classes) stays untouched.
   Terracotta tokenized here so a future second use stays in sync. ── */
.hp-reimagine { --accent-terracotta: #c15a2e; }
.hp-reimagine .hp-hero { min-height: 760px; }
.hp-reimagine .hp-hero__inner { padding: 66px 44px 56px; }
.hp-reimagine .hp-hero__content { max-width: 600px; }
.hp-reimagine .hp-hero h1 { letter-spacing: .14em; }

/* ── Mobile hero (≤480px, spec §3): ink becomes a faint warm wash from the TOP edge
   (text now spans the canvas), type scale tightens, CTAs go full-width. Season-agnostic
   bloom wash on mobile; the blot still rotates by season. ── */
@media (max-width: 480px){
  .hp-reimagine .hp-hero h1 { font-size: 10.5px; }
  .hp-reimagine .hp-hero { min-height: 0; }
  .hp-reimagine .hp-hero__inner { padding: 14px 24px 30px; }
  .hp-reimagine .hp-hero__content { max-width: none; }
  /* CTAs stack full-width, gap 10px */
  .hp-reimagine .hp-hero__ctas { gap: 10px; align-items: stretch; }
  .hp-reimagine .hp-hero__ctas .hp-btn-primary,
  .hp-reimagine .hp-hero__ctas .hp-btn-secondary { display: block; width: 100%; text-align: center; }
  /* L1 bloom → top-edge warm wash */
  .hp-reimagine .hp-hero--atmos .hp-hero__bloom {
    top: -160px; left: -40px; right: -40px; width: auto; height: 520px;
    background:
      radial-gradient(ellipse 60% 60% at 68% 24%, rgba(240,176,104,.42), transparent 64%),
      radial-gradient(ellipse 50% 50% at 40% 16%, rgba(224,178,172,.30), transparent 62%),
      radial-gradient(ellipse 46% 48% at 82% 40%, rgba(158,186,146,.24), transparent 62%);
    -webkit-mask-image: radial-gradient(ellipse 90% 70% at 60% 10%, #000 22%, transparent 82%);
    mask-image: radial-gradient(ellipse 90% 70% at 60% 10%, #000 22%, transparent 82%);
  }
  /* L2 core highlight reposition */
  .hp-reimagine .hp-hero--atmos .hp-hero__core {
    top: -120px; right: -60px; left: auto; width: 420px; height: 360px;
    background: radial-gradient(ellipse 30% 30% at 60% 30%, rgba(252,214,150,.60), transparent 64%);
  }
  /* L3 blot reposition + smaller */
  .hp-reimagine .hp-hero__inkblot--blot {
    right: -140px; top: -140px; width: 520px; opacity: .90;
    filter: brightness(1.30) saturate(1.65) sepia(.42) hue-rotate(-11deg) blur(5px);
    -webkit-mask-image: radial-gradient(ellipse 48% 46% at 58% 30%, #000 10%, transparent 72%);
    mask-image: radial-gradient(ellipse 48% 46% at 58% 30%, #000 10%, transparent 72%);
  }
  /* L4 grain reposition (reuses the 0.58/220 tile — §5 perf-equivalent) */
  .hp-reimagine .hp-hero--atmos .hp-hero__grain {
    top: -160px; left: -40px; right: -40px; width: auto; height: 520px; opacity: .70;
    -webkit-mask-image: radial-gradient(ellipse 80% 62% at 62% 12%, #000 14%, transparent 78%);
    mask-image: radial-gradient(ellipse 80% 62% at 62% 12%, #000 14%, transparent 78%);
  }
}

/* ═══════════ PHOTO HERO (Dupont Circle office; DEFAULT reimagine hero) ═══════════
   Photo replaces the ink atmosphere on desktop (hero photo spec). The ink hero is kept
   as the ?hero=ink A/B variant. Scoped to .hp-reimagine .hp-hero--photo. */
.hp-reimagine .hp-hero--photo {
  position: relative;
  background: #f4efe8;
  min-height: 640px;
}
.hp-reimagine .hp-hero--photo .hp-hero__grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 1fr minmax(420px, 46%);
  align-items: center;
  min-height: 640px;
  /* photo bleeds to the right edge (right pad 0); text centers to a 1180px container on the left */
  padding: 60px 0 52px max(44px, calc((100% - 1180px) / 2));
}
.hp-reimagine .hp-hero--photo .hp-hero__content { max-width: 560px; }

/* photo cell */
.hp-reimagine .hp-hero--photo .hp-hero__photo {
  position: relative;
  align-self: stretch;
  min-height: 540px;
  overflow: hidden;
}
.hp-reimagine .hp-hero--photo .hp-hero__photo picture,
.hp-reimagine .hp-hero--photo .hp-hero__photo img { position: absolute; inset: 0; width: 100%; height: 100%; }
/* L1 — the photograph (NO desaturation, NO sepia); feather the left edge into cream */
.hp-reimagine .hp-hero--photo .hp-hero__photo img {
  object-fit: cover; object-position: 62% 40%;
  filter: saturate(1.03) brightness(1.02);
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.9) 30%, #000 46%);
  mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.9) 30%, #000 46%);
}
/* L2/L3 protection mask — the ellipse where NO scrim/vignette touches the artwork.
   Tied to object-position 62% 40% at this column ratio; re-tune by eye if the crop changes. */
.hp-reimagine .hp-hero--photo .hp-hero__ph-scrim,
.hp-reimagine .hp-hero--photo .hp-hero__ph-vignette {
  position: absolute; inset: 0; pointer-events: none; mix-blend-mode: multiply;
  -webkit-mask-image: radial-gradient(ellipse 44% 36% at 40% 25%, transparent 52%, #000 76%);
  mask-image: radial-gradient(ellipse 44% 36% at 40% 25%, transparent 52%, #000 76%);
}
/* L2 — warm scrim */
.hp-reimagine .hp-hero--photo .hp-hero__ph-scrim {
  background: linear-gradient(120deg, rgba(193,90,46,.26), rgba(240,176,104,.16) 60%, rgba(193,90,46,.14));
}
/* L3 — vignette */
.hp-reimagine .hp-hero--photo .hp-hero__ph-vignette {
  background: radial-gradient(ellipse 115% 115% at 44% 48%, transparent 58%, rgba(58,40,24,.24) 100%);
}
/* L4 — lamp halation (screen: only adds light) */
.hp-reimagine .hp-hero--photo .hp-hero__ph-halation {
  position: absolute; inset: 0; pointer-events: none; mix-blend-mode: screen;
  background: radial-gradient(ellipse 24% 20% at 16% 56%, rgba(255,216,150,.5), transparent 70%);
}
/* L5 — grain (same 0.58/220 warm tile as the ink hero; base64 = minifier-safe) */
.hp-reimagine .hp-hero--photo .hp-hero__ph-grain {
  position: absolute; inset: 0; pointer-events: none; mix-blend-mode: multiply; opacity: .35;
  background-image: url(images/grain-tile.webp);
}
/* L6 — cream edge wash (softens the photo's left cut into the text column) */
.hp-reimagine .hp-hero--photo .hp-hero__ph-wash {
  position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(90deg, #f4efe8 2%, rgba(244,239,232,0) 42%);
}

/* microcopy under the CTA pair + caption under the trust row (photo-hero copy additions) */
.hp-reimagine .hp-hero__micro {
  font-family: var(--font-ui); font-size: 13px; color: #7a746c; margin: 14px 0 0;
}
.hp-reimagine .hp-hero__caption {
  font-family: var(--font-body); font-style: italic; font-size: 14.5px; color: #7f6045;
  margin: 20px 0 0; max-width: 460px; line-height: 1.5;
}

/* ── Photo hero MOBILE (≤767, interim per §6): single column, photo hidden (never
   downloaded — the <picture> source is desktop-only), light warm top-edge wash. ── */
@media (max-width: 767px){
  .hp-reimagine .hp-hero--photo { min-height: 0; }
  .hp-reimagine .hp-hero--photo .hp-hero__grid {
    grid-template-columns: 1fr; min-height: 0; padding: 16px 24px 30px;
  }
  .hp-reimagine .hp-hero--photo .hp-hero__content { max-width: none; }
  .hp-reimagine .hp-hero--photo .hp-hero__photo { display: none; }
  .hp-reimagine .hp-hero--photo::before {
    content: ""; position: absolute; top: 0; left: 0; right: 0; height: 320px;
    pointer-events: none; z-index: 0;
    background:
      radial-gradient(ellipse 70% 60% at 70% 0%, rgba(240,176,104,.34), transparent 66%),
      radial-gradient(ellipse 60% 52% at 28% 4%, rgba(224,178,172,.24), transparent 64%);
    -webkit-mask-image: linear-gradient(#000 42%, transparent 100%);
    mask-image: linear-gradient(#000 42%, transparent 100%);
  }
  .hp-reimagine .hp-hero__caption { max-width: none; }
}

/* ── HERO availability row (bottom of hero, on beige — per design) ── */
.hp-hero__avail {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 22px;
  margin-top: 28px;
  font-family: var(--font-ui);
  font-size: 13.5px;
  color: #4f4a44;
}
.hp-hero__avail-item { display: inline-flex; align-items: center; gap: 8px; }
.hp-hero__avail-dot { width: 9px; height: 9px; border-radius: 50%; display: inline-block; flex-shrink: 0; }
.hp-hero__avail-tel { color: #2a2520; font-weight: 600; text-decoration: none; }
.hp-hero__avail-tel:hover { color: #fb9000; }

/* ── PRICING (on beige — per design, alternates with the white roster) ── */
.hp-pricing { background: #f4efe8; padding: 64px 40px; }
.hp-pricing__inner { max-width: 1000px; margin: 0 auto; }
.hp-pricing__header { text-align: center; margin-bottom: 32px; }
.hp-pricing__header h2 {
  font-family: var(--font-display); font-size-adjust: var(--display-optical-size, none);
  font-size: 28px; font-weight: 500; color: #2a2520; margin: 0;
}
.hp-pricing__card {
  display: grid;
  grid-template-columns: 1fr 1fr 1.2fr;
  background: #fff;
  border: 1px solid #e8e0d8;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 14px 40px rgba(42,37,32,.07);
}
.hp-pricing__col { padding: 30px 28px; border-right: 1px solid #f0e9e0; }
.hp-pricing__col:last-child { border-right: none; }
.hp-pricing__col--feature { background: #fbf7f1; }
.hp-pricing__col-label {
  font-family: var(--font-ui);
  font-size: 11px; text-transform: uppercase; letter-spacing: 1.6px;
  color: #6b7378; margin-bottom: 10px;
}
.hp-pricing__col-label--accent { color: #fb9000; }
.hp-pricing__rate {
  font-family: var(--font-display); font-size-adjust: var(--display-optical-size, none);
  font-size: 24px; font-weight: var(--display-weight); color: #2a2520; line-height: 1.3;
}
.hp-pricing__rate--big { font-size: 36px; line-height: 1.1; }
.hp-pricing__rate-detail {
  font-family: var(--font-body); font-size-adjust: var(--body-optical-size, none);
  font-size: 13.5px; color: #555; margin-bottom: 12px;
}
.hp-pricing__col--feature .hp-pricing__rate-detail { margin-top: 4px; margin-bottom: 0; line-height: 1.5; }
.hp-pricing__prose {
  font-family: var(--font-body); font-size-adjust: var(--body-optical-size, none);
  font-size: 14px; line-height: 1.6; color: #555; margin: 0 0 10px;
}
.hp-pricing__prose--small { font-size: 13px; line-height: 1.55; margin: 0; }
.hp-pricing__prose a,
.hp-reimagine .hp-identity__text p a { color: #7f6045; text-decoration: underline; text-underline-offset: 2px; }
.hp-reimagine .hp-identity__text p a:hover { color: #fb9000; }
.hp-pricing__sub {
  font-family: var(--font-body); font-size-adjust: var(--body-optical-size, none);
  font-size: 15px; line-height: 1.6; color: #555; margin: 10px auto 0; max-width: 580px;
}

/* ── WHAT WE TREAT (dark index) ── */
.hp-treat { background: #2a2520; padding: 64px 40px; }
.hp-treat__inner { max-width: 1000px; margin: 0 auto; }
.hp-treat__h2 {
  font-family: var(--font-display); font-size-adjust: var(--display-optical-size, none);
  font-size: 30px; font-weight: 500; color: #fff; margin: 0 0 16px; max-width: 620px;
}
.hp-treat__intro {
  font-family: var(--font-body); font-size-adjust: var(--body-optical-size, none);
  font-size: 16px; line-height: 1.6; color: rgba(255,255,255,.6); margin: 0 0 28px; max-width: 620px;
}
.hp-treat__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 56px; }
.hp-treat__row {
  display: flex; justify-content: space-between; align-items: baseline; gap: 16px;
  padding: 18px 0;
  border-top: 1px solid rgba(255,255,255,.12);
  text-decoration: none;
  transition: padding-left .2s ease;
}
.hp-treat__row:hover { padding-left: 6px; }
.hp-treat__row:last-child { border-bottom: 1px solid rgba(255,255,255,.12); }
.hp-treat__name {
  font-family: var(--font-display); font-size-adjust: var(--display-optical-size, none);
  font-size: 21px; color: #fff;
}
.hp-treat__tag {
  font-family: var(--font-ui); font-size: 12.5px; color: rgba(255,255,255,.45); white-space: nowrap;
}
.hp-treat__chips-label {
  font-family: var(--font-ui);
  font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 1.8px;
  color: rgba(255,255,255,.4);
  margin: 28px 0 14px;
}
.hp-treat__chips { display: flex; flex-wrap: wrap; gap: 8px; }
.hp-treat__chip {
  font-family: var(--font-ui); font-size: 12.5px;
  color: rgba(255,255,255,.78);
  text-decoration: none;
  padding: 6px 13px;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 20px;
  transition: border-color .2s, color .2s;
}
.hp-treat__chip:hover { border-color: rgba(255,255,255,.5); color: #fff; }

/* ── ABOUT insight box ── */
.hp-identity__insight {
  margin-top: 24px;
  background: #faf8f5;
  border: 1px solid #ece7e0;
  border-radius: 12px;
  padding: 22px 26px;
}
.hp-identity__insight-label {
  display: block;
  font-family: var(--font-ui);
  font-size: 11px; font-weight: 600; letter-spacing: 1px; text-transform: uppercase;
  color: #2e7d74; margin-bottom: 6px;
}
.hp-identity__insight p {
  font-family: var(--font-body); font-size-adjust: var(--body-optical-size, none);
  font-size: 15.5px; line-height: 1.7; color: #5a5a5a; margin: 0;
}

/* ── PROOF BAND (story-led; stat grid removed per build-note Part 4) ── */
.hp-cred__eyebrow { margin-bottom: 16px; }
.hp-cred__h2 {
  font-family: var(--font-display); font-size-adjust: var(--display-optical-size, none);
  font-size: 38px; font-weight: var(--display-weight);
  color: #fff; line-height: 1.15; letter-spacing: -0.6px;
  margin: 0 auto 20px; max-width: 720px;
}
.hp-cred__h2 span { color: #fb9000; font-style: italic; font-weight: 500; }
.hp-cred__prose--lead {
  font-size: 17px; line-height: 1.75;
  color: rgba(255,255,255,.6); max-width: 620px; margin-bottom: 30px;
}

/* ── FIELD NOTES cards ── */
.hp-editorial__cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.hp-editorial__card {
  background: #fff; border: 1px solid #e6e6e6; border-radius: 12px;
  padding: 24px; text-decoration: none; display: block;
  transition: border-color .2s, box-shadow .2s;
}
.hp-editorial__card:hover { border-color: #c5bfb8; box-shadow: 0 2px 12px rgba(0,0,0,.06); }
.hp-editorial__card-cat {
  font-family: var(--font-ui);
  font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 1px;
}
.hp-editorial__card-title {
  font-family: var(--font-display); font-size-adjust: var(--display-optical-size, none);
  font-size: 19px; font-weight: var(--display-weight); color: #2c2c2c;
  margin: 10px 0 0; line-height: 1.35;
}

/* ── REIMAGINE responsive ── */
@media (max-width: 1000px) {
  .hp-treat__grid { grid-template-columns: 1fr; gap: 0; }
  .hp-editorial__cards { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
  .hp-avail { padding: 14px 24px; }
  .hp-avail__inner { gap: 10px; }
  .hp-avail__meta { margin-left: 0; gap: 14px; }
  .hp-pricing { padding: 48px 24px; }
  .hp-pricing__card { grid-template-columns: 1fr; }
  .hp-pricing__col { border-right: none; border-bottom: 1px solid #f0e9e0; }
  .hp-pricing__col:last-child { border-bottom: none; }
  .hp-treat { padding: 48px 24px; }
  .hp-cred__h2 { font-size: 28px; }
}