:root {
  color-scheme: light;
  --bg: #fff4e6;          /* warm cream page background */
  --fg: #1f1f1f;          /* body ink */
  --primary: #0b3c5d;     /* deep navy — headings, primary buttons, footer bg */
  --accent: #e85d04;      /* spice orange — CTAs, highlights, kickers */
  --accent-strong: #c2410c; /* darker spice orange — small/body-size orange text (AA contrast) */
  --accent-soft: rgba(232, 93, 4, 0.12);
  --secondary: #f2f6fa;   /* cool light panels */
  --muted: #e6e6e6;       /* borders */
  --muted-fg: #4b5563;    /* secondary text */
  --card: #ffffff;
  --destructive: #b91c1c; /* refund/warning text only */
  --scrim: linear-gradient(to top, rgba(11, 60, 93, 0.75), rgba(11, 60, 93, 0.25));
  --shadow: 0 20px 60px rgba(11, 60, 93, 0.12);
  --radius: 8px;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* {
  box-sizing: border-box;
}

[hidden] {
  display: none !important;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  color: var(--fg);
  background: var(--bg);
  overflow-x: hidden;
}

a {
  color: inherit;
}

button,
a {
  -webkit-tap-highlight-color: transparent;
}

:focus {
  outline: none;
}

:focus-visible {
  outline: 3px solid rgba(232, 93, 4, 0.75);
  outline-offset: 4px;
}

.skip-link {
  position: fixed;
  top: 12px;
  left: 12px;
  z-index: 100;
  padding: 10px 14px;
  border-radius: var(--radius);
  color: white;
  background: var(--primary);
  box-shadow: var(--shadow);
  font-weight: 850;
  text-decoration: none;
  transform: translateY(-160%);
  transition: transform 160ms ease;
}

.skip-link:focus-visible {
  transform: translateY(0);
}

.site-header {
  position: sticky;
  top: 0;
  z-index: 20;
  min-height: 64px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 10px clamp(18px, 4vw, 54px);
  background: rgba(255, 244, 230, 0.92);
  border-bottom: 1px solid var(--muted);
  backdrop-filter: blur(16px);
}

.brand {
  display: flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
}

.brand-logo {
  display: block;
  width: auto;
  max-width: min(220px, 48vw);
  height: 52px;
  object-fit: contain;
}

.brand-mark {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  color: white;
  background: linear-gradient(135deg, var(--primary), var(--accent));
  font-weight: 800;
  font-size: 0.84rem;
}

.brand strong,
.brand small {
  display: block;
}

.brand small {
  margin-top: 2px;
  color: var(--muted-fg);
  font-size: 0.78rem;
}

.top-nav {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 0.84rem;
}

.top-nav a {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  padding: 8px 10px;
  border-radius: 999px;
  color: var(--muted-fg);
  text-decoration: none;
  white-space: nowrap;
}

.top-nav a:hover {
  color: var(--fg);
  background: rgba(11, 60, 93, 0.08);
}

.top-nav .nav-cta {
  color: white;
  background: var(--accent);
  font-size: 1rem;
  font-weight: 800;
}

.top-nav .mobile-only-link {
  display: none;
}

.nav-toggle {
  display: none;
  align-items: center;
  gap: 9px;
  min-height: 42px;
  padding: 9px 12px;
  border: 1px solid var(--muted);
  border-radius: var(--radius);
  color: var(--primary);
  background: var(--card);
  font: inherit;
  font-size: 0.86rem;
  font-weight: 850;
  cursor: pointer;
}

.nav-toggle-icon,
.nav-toggle-icon::before,
.nav-toggle-icon::after {
  display: block;
  width: 18px;
  height: 2px;
  border-radius: 99px;
  background: currentColor;
}

.nav-toggle-icon {
  position: relative;
}

.nav-toggle-icon::before,
.nav-toggle-icon::after {
  content: "";
  position: absolute;
  left: 0;
}

.nav-toggle-icon::before {
  top: -6px;
}

.nav-toggle-icon::after {
  top: 6px;
}

.sub-nav {
  position: sticky;
  top: 73px;
  z-index: 19;
  display: flex;
  align-items: center;
  gap: 6px;
  overflow-x: auto;
  padding: 6px clamp(18px, 4vw, 54px);
  background: var(--card);
  border-bottom: 1px solid var(--muted);
  -webkit-overflow-scrolling: touch;
}

.sub-nav a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 10px 14px;
  border-radius: 999px;
  color: var(--primary);
  font-weight: 800;
  font-size: 0.88rem;
  text-decoration: none;
  white-space: nowrap;
}

.sub-nav a:hover {
  background: rgba(11, 60, 93, 0.08);
}

.proof-tabs {
  gap: 4px;
}

.proof-tab {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 44px;
  padding: 10px 14px;
  border: 0;
  border-radius: 999px;
  color: var(--primary);
  background: transparent;
  font: inherit;
  font-weight: 800;
  font-size: 0.86rem;
  white-space: nowrap;
  cursor: pointer;
}

.proof-tab:hover {
  background: rgba(11, 60, 93, 0.08);
}

.proof-tab.is-active {
  color: white;
  background: var(--primary);
}

.tab-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  border-radius: 999px;
  color: var(--accent-strong);
  background: var(--accent-soft);
  font-size: 0.72rem;
  font-weight: 900;
}

.proof-tab.is-active .tab-count {
  color: white;
  background: rgba(255, 255, 255, 0.24);
}

.whatsapp-float {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  color: white;
  background: var(--accent);
  box-shadow: 0 12px 30px rgba(232, 93, 4, 0.35);
  text-decoration: none;
  transition: transform 180ms ease, box-shadow 180ms ease;
}

.whatsapp-float:hover {
  transform: translateY(-2px);
}

.whatsapp-float svg {
  width: 28px;
  height: 28px;
  fill: currentColor;
}

.hero {
  position: relative;
  min-height: calc(100vh - 72px);
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(360px, 1.08fr);
  align-items: center;
  overflow: hidden;
  background:
    linear-gradient(90deg, rgba(255, 244, 230, 0.98) 0%, rgba(255, 244, 230, 0.9) 42%, rgba(255, 244, 230, 0.16) 70%),
    linear-gradient(135deg, #0b3c5d 0%, #1a5276 100%);
}

.hero-copy {
  position: relative;
  z-index: 2;
  max-width: 720px;
  padding: clamp(48px, 8vw, 104px) clamp(22px, 6vw, 76px);
}

.hero-image {
  min-height: 620px;
}

.eyebrow {
  margin: 0 0 12px;
  color: var(--accent-strong);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}

h1,
h2,
h3,
h4,
p {
  margin-top: 0;
}

h1,
h2,
h3,
h4 {
  color: var(--primary);
}

h1 {
  max-width: 700px;
  margin-bottom: 18px;
  font-size: clamp(2.75rem, 6vw, 6.2rem);
  line-height: 0.98;
  letter-spacing: 0;
}

h2 {
  margin-bottom: 14px;
  font-size: clamp(2rem, 3.4vw, 3.4rem);
  line-height: 1.05;
  letter-spacing: 0;
}

h3 {
  margin-bottom: 10px;
  font-size: 1.32rem;
  line-height: 1.2;
}

h4 {
  margin-bottom: 12px;
  font-size: 1rem;
}

p,
li {
  color: var(--muted-fg);
  line-height: 1.7;
}

.hero-lede {
  max-width: 600px;
  color: var(--muted-fg);
  font-size: clamp(1.04rem, 1.5vw, 1.22rem);
}

.hero-actions,
.section-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 30px;
}

.cta-row {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 10px;
  margin-top: auto;
}

.image-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  aspect-ratio: 16 / 9;
  padding: 16px;
  border: 1px solid rgba(11, 60, 93, 0.15);
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(11, 60, 93, 0.08), rgba(232, 93, 4, 0.08)) #fff4e6;
  color: #0b3c5d;
  font-weight: 700;
}

.image-placeholder span {
  font-size: 16px;
  line-height: 1.4;
}

.image-placeholder--portrait {
  aspect-ratio: 4 / 5;
}

/* Home Page Redesign Part B — shared image-section / scrim / safe-zone pattern.
   One pattern for every text-on-image section (hero, problem, portion-sahi-preview,
   postpartum-guide, final-cta). Overlay token classes (scrim-left/scrim-right/scrim-dark)
   are set from config/images.json and applied to both the section and the scrim div. */
.image-section {
  position: relative;
  display: flex;
  align-items: center;
  overflow: hidden;
  aspect-ratio: var(--ar-desktop, 16 / 9);
  color: white;
}

.image-section-media {
  position: absolute;
  inset: 0;
  z-index: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.image-section-scrim {
  position: absolute;
  inset: 0;
  z-index: 1;
}

.image-section.scrim-left .image-section-scrim {
  background: linear-gradient(90deg, rgba(11, 60, 93, 0.74) 0%, rgba(11, 60, 93, 0.38) 55%, rgba(11, 60, 93, 0) 100%);
}

.image-section.scrim-right .image-section-scrim {
  background: linear-gradient(270deg, rgba(11, 60, 93, 0.74) 0%, rgba(11, 60, 93, 0.38) 55%, rgba(11, 60, 93, 0) 100%);
}

.image-section.scrim-dark .image-section-scrim {
  background: linear-gradient(0deg, rgba(11, 60, 93, 0.82) 0%, rgba(11, 60, 93, 0.62) 100%);
}

.image-section-copy {
  position: relative;
  z-index: 2;
  max-width: 45%;
  padding: clamp(24px, 4vw, 56px);
  color: white;
}

.image-section.scrim-right .image-section-copy {
  margin-left: auto;
}

.image-section.scrim-dark .image-section-copy {
  max-width: 640px;
  margin: 0 auto;
  text-align: center;
}

.image-section-copy .eyebrow {
  color: #fff;
  font-size: 19px;
  font-weight: 700;
}

.image-section-copy h1,
.image-section-copy h2 {
  margin: 0 0 14px;
  color: white;
  font-size: clamp(1.7rem, 3.2vw, 2.7rem);
}

.image-section-copy .body-text {
  margin: 0 0 18px;
  color: white;
  font-size: 20px;
  line-height: 1.55;
}

.image-section-steps {
  display: grid;
  gap: 10px;
  margin: 0 0 20px;
  padding: 0;
  list-style: none;
}

.image-section-steps li {
  display: flex;
  align-items: baseline;
  gap: 10px;
  color: white;
  font-size: 18px;
}

.image-section-steps .step-number {
  font-weight: 800;
  opacity: 0.75;
}

.image-section-steps .step-label {
  font-weight: 700;
}

/* Verifier correction: dark-on-cream steps list for split-interim sections (hero,
   portion-sahi-preview) — same structure as .image-section-steps, but on the .image-split
   cream background instead of a scrim, so text is dark, not white. */
.split-copy-steps {
  display: grid;
  gap: 10px;
  margin: 0 0 20px;
  padding: 0;
  list-style: none;
}

.split-copy-steps li {
  display: flex;
  align-items: baseline;
  gap: 10px;
  font-size: 1rem;
  color: var(--fg);
}

.split-copy-steps .step-number {
  font-weight: 800;
  color: var(--accent-strong);
}

.split-copy-steps .step-label {
  font-weight: 700;
}

.trust-bar {
  padding: 22px clamp(20px, 5vw, 64px);
  background: var(--bg);
  border-block: 1px solid var(--muted);
}

.trust-bar .stat-badge-row {
  margin-top: 0;
  justify-content: center;
}

.proof-category-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 18px 0;
}

.path-card-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
}

/* Testimonials — shared across Home, Moves n Stretch (/workout-guidance), and Postpartum.
   LOCK #12 (docs/LOCKED_DECISIONS.md): .testimonial-disclaimer must never gain its own
   font-size, color, or opacity — it inherits everything from .testimonial-text on purpose
   (the disclaimer <p> carries both classes) so "same font-size as card body" holds by
   construction, not by matching numbers by hand. Neither .testimonial-name nor
   .testimonial-text may carry text-transform: names/text render exactly as configured
   (e.g. "manisha rajput" must stay lowercase on screen, not just in the HTML source). */
.testimonial-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
  margin-top: 8px;
}

.testimonial-card {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 24px;
  border: 1px solid var(--muted);
  border-radius: var(--radius);
  background: var(--card);
  box-shadow: var(--shadow);
}

.testimonial-stars {
  color: var(--accent-strong);
  font-size: 1.1rem;
  letter-spacing: 2px;
}

.testimonial-text {
  margin: 0;
  color: var(--fg);
  font-size: 1rem;
  line-height: 1.6;
}

.testimonial-name {
  margin: 0;
  margin-top: auto;
  color: var(--primary);
  font-weight: 800;
}

.testimonial-disclaimer {
  margin: 28px 0 0;
  max-width: 820px;
}

@media (max-width: 640px) {
  .testimonial-grid {
    grid-template-columns: 1fr;
  }


  .image-section {
    aspect-ratio: var(--ar-mobile, 4 / 5);
  }

  .image-section-copy {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    max-width: 100%;
    width: 100%;
    min-height: 40%;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    margin: 0;
    padding: clamp(18px, 5vw, 28px);
  }

  .image-section.scrim-left .image-section-scrim,
  .image-section.scrim-right .image-section-scrim {
    background: linear-gradient(0deg, rgba(11, 60, 93, 0.8) 0%, rgba(11, 60, 93, 0.3) 55%, rgba(11, 60, 93, 0) 100%);
  }

  /* Verifier correction: bottom-40%-safe-zone fix. A strict 4:5 mobile crop leaves no room
     for a 40-word body + h2 + eyebrow inside the bottom 40% at >=16px text, so these two
     scrim variants (image + scrim stay absolutely positioned behind, unchanged) grow the
     section itself and anchor the copy to the bottom via flex instead of a fixed 40%-height
     absolute box. final-cta (scrim-dark) is untouched and keeps the 4:5 aspect-ratio box. */
  .image-section.scrim-left,
  .image-section.scrim-right {
    aspect-ratio: auto;
    min-height: 150vw;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
  }

  .image-section.scrim-left .image-section-copy,
  .image-section.scrim-right .image-section-copy {
    position: relative;
    left: auto;
    right: auto;
    bottom: auto;
    min-height: 0;
    margin-left: 0;
  }

  .image-section.scrim-dark .image-section-copy {
    position: relative;
    min-height: 0;
    padding: clamp(18px, 5vw, 28px);
  }

  .image-section-copy .body-text {
    font-size: 17px;
  }

  .image-section-steps li {
    font-size: 16px;
  }

  .path-card-grid {
    grid-template-columns: 1fr;
  }
}

.button,
.primary-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 13px 18px;
  border: 1px solid transparent;
  border-radius: 999px;
  font-weight: 800;
  text-decoration: none;
  transition: transform 180ms ease, box-shadow 180ms ease, background 180ms ease;
}

/* WhatsApp float defect fix: the float must paint below every button at rest, at any
   viewport, so it never covers a CTA. .whatsapp-float sits at z-index: 1 (see above); this
   puts every .button/.nav-cta at z-index: 2 in the same root stacking context so they all
   win, not just the ones already inside a local z-2 context like .image-section-copy. */
.button,
.nav-cta {
  position: relative;
  z-index: 2;
}

.button:hover,
.primary-link:hover {
  transform: translateY(-1px);
}

.button-primary,
.primary-link {
  color: white;
  background: var(--primary);
  box-shadow: 0 12px 30px rgba(11, 60, 93, 0.22);
}

.button-secondary {
  color: var(--primary);
  background: rgba(255, 255, 255, 0.78);
  border-color: var(--muted);
}

/* /contact "Reach us" link hub — two labelled sub-rows of buttons. Flex-wrap with
   flex-grow means each line is filled edge-to-edge, so there is never an orphan/empty
   cell exposing the section background (the old auto-fit grid left one on odd counts). */
.link-hub {
  display: flex;
  flex-direction: column;
  gap: 20px;
  margin-top: 8px;
}

.link-hub-label {
  margin: 0 0 10px;
  color: var(--muted-fg);
  font-size: 0.74rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.link-hub-row {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.link-hub-row .button {
  flex: 1 1 200px;
}

/* The `.contact-details a` link-colour rule (specificity 0,1,1) otherwise beats
   `.button-primary` (0,1,0) and paints the WhatsApp button's label navy-on-navy.
   Restore the primary button's white label with a hub-scoped rule. */
.link-hub .button-primary {
  color: #fff;
}

.microcopy {
  margin: 18px 0 0;
  max-width: 520px;
  font-size: 0.88rem;
}

.intro-band,
.section,
.safety-note {
  padding: clamp(50px, 7vw, 96px) clamp(20px, 5vw, 64px);
}

.intro-band {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 0.8fr);
  gap: clamp(26px, 5vw, 70px);
  align-items: center;
  background: var(--card);
  border-block: 1px solid var(--muted);
}

.medical-disclaimer-panel {
  display: grid;
  grid-template-columns: minmax(160px, 0.24fr) minmax(0, 1fr);
  gap: 18px;
  align-items: start;
  padding: 22px clamp(20px, 5vw, 64px);
  border-block: 1px solid var(--muted);
  background: rgba(185, 28, 28, 0.05);
}

.medical-disclaimer-panel strong {
  color: var(--primary);
  font-size: 0.9rem;
  text-transform: uppercase;
}

.medical-disclaimer-panel p {
  margin: 0;
  color: var(--muted-fg);
  line-height: 1.65;
}

.intro-copy {
  max-width: 760px;
}

.trust-people {
  display: grid;
  gap: 14px;
}

.intro-visual-stack {
  display: grid;
  gap: 14px;
}

.intro-visual-stack .feature-image img {
  min-height: 260px;
  max-height: 340px;
}

.person {
  display: grid;
  grid-template-columns: 96px 1fr;
  gap: 14px;
  align-items: center;
  padding: 18px;
  border: 1px solid var(--muted);
  border-radius: var(--radius);
  background: var(--bg);
}

.person img,
.person .image-placeholder {
  width: 96px;
  height: 96px;
  border-radius: 50%;
  object-fit: cover;
}

.person img {
  object-position: 50% 26%;
}

/* E3 headshot avatars: the circle clips an oversized, face-anchored likeness so both
   founders read as clear headshots. .person-avatar clips; the img zooms from its own
   inline transform-origin (set per portrait at the face). */
.person-avatar {
  display: block;
  width: 96px;
  height: 96px;
  overflow: hidden;
  border-radius: 50%;
}

.person-avatar img {
  display: block;
  transform: scale(1.75);
}

.person .image-placeholder {
  aspect-ratio: auto;
  border-width: 0;
}

.person .image-placeholder span {
  display: none;
}

.person small {
  color: var(--muted-fg);
}

.trust-note {
  margin: 14px 0 0;
  color: var(--primary);
  font-weight: 750;
}

.section-heading {
  max-width: 820px;
  margin-bottom: 28px;
}

.section-heading p {
  max-width: 700px;
}

.segmented-control {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  max-width: 820px;
  padding: 6px;
  border: 1px solid var(--muted);
  border-radius: 999px;
  background: var(--card);
  box-shadow: 0 10px 26px rgba(31, 31, 31, 0.06);
}

.stage-button {
  min-height: 46px;
  padding: 10px 14px;
  border: 0;
  border-radius: 999px;
  color: var(--muted-fg);
  background: transparent;
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}

.stage-button.is-active {
  color: white;
  background: var(--primary);
}

.stage-panel {
  margin-top: 24px;
  background: var(--card);
  border: 1px solid var(--muted);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  overflow: hidden;
}

/* C3 merged guide (lock 20): stage tabs + symptom chips feed one combined output panel.
   The panel stacks four labeled sub-blocks inside the existing .stage-panel card. */
#guide .symptom-grid {
  margin-top: 14px;
}

.guide-block {
  padding: clamp(22px, 3.5vw, 36px);
  border-top: 1px solid var(--muted);
}

.guide-block:first-child {
  border-top: 0;
  background:
    linear-gradient(135deg, rgba(11, 60, 93, 0.1), rgba(232, 93, 4, 0.12)),
    var(--card);
}

.guide-block h3 {
  margin-bottom: 10px;
}

.guide-block > p {
  max-width: 760px;
}

.guide-block ul {
  display: grid;
  gap: 6px;
  max-width: 760px;
}

.guide-symptom-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-top: 14px;
}

.guide-symptom {
  padding: 18px;
  border: 1px solid var(--muted);
  border-radius: var(--radius);
  background: var(--bg);
}

.guide-symptom h4 {
  margin-bottom: 8px;
}

.guide-symptom p {
  margin-bottom: 8px;
}

.guide-symptom p:last-child {
  margin-bottom: 0;
}

.guide-check {
  padding-top: 8px;
  border-top: 1px dashed var(--muted);
}

.guide-help .cta-row {
  margin-top: 16px;
}

.stage-visual-panel {
  display: grid;
  grid-template-columns: minmax(280px, 0.9fr) minmax(0, 1.1fr);
  margin-top: 18px;
  border: 1px solid var(--muted);
  border-radius: var(--radius);
  background: var(--card);
  overflow: hidden;
  box-shadow: var(--shadow);
}

.stage-visual-panel figure {
  margin: 0;
  background: var(--bg);
}

.stage-visual-panel img,
.stage-visual-panel .image-placeholder {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 380px;
  object-fit: cover;
}

.stage-visual-copy {
  display: grid;
  gap: 14px;
  align-content: center;
  padding: clamp(22px, 4vw, 40px);
}

.progress-timeline {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.progress-timeline article {
  min-height: 180px;
  padding: 18px;
  border: 1px solid var(--muted);
  border-radius: var(--radius);
  background: var(--bg);
}

.progress-timeline span {
  display: inline-flex;
  margin-bottom: 8px;
  color: var(--accent-strong);
  font-size: 0.78rem;
  font-weight: 900;
  text-transform: uppercase;
}

.postpartum-goal-grid {
  margin-top: 22px;
}

.stage-summary {
  padding: clamp(24px, 4vw, 42px);
  background:
    linear-gradient(135deg, rgba(11, 60, 93, 0.1), rgba(232, 93, 4, 0.12)),
    var(--card);
}

.stage-summary p:last-child {
  max-width: 720px;
  margin-bottom: 0;
}

.stage-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.stage-grid article {
  min-height: 220px;
  padding: 24px;
  border-top: 1px solid var(--muted);
  border-right: 1px solid var(--muted);
}

.stage-grid article:nth-child(3n) {
  border-right: 0;
}

ul {
  margin: 0;
  padding-left: 18px;
}

.muted-section {
  background: var(--secondary);
}

.symptom-grid {
  display: grid;
  grid-template-columns: repeat(9, minmax(112px, 1fr));
  gap: 10px;
}

.symptom-grid button {
  min-height: 48px;
  padding: 11px 14px;
  border: 1px solid var(--muted);
  border-radius: 999px;
  color: var(--fg);
  background: var(--card);
  font: inherit;
  font-weight: 750;
  cursor: pointer;
}

.symptom-grid button.is-selected {
  color: white;
  background: var(--primary);
  border-color: var(--primary);
}

.recovery-path {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-top: 26px;
}

.recovery-path div,
.symptom-card,
.condition-grid article,
.comparison-grid article,
.support-grid article {
  padding: 20px;
  border: 1px solid var(--muted);
  border-radius: var(--radius);
  background: var(--card);
}

.condition-grid article img,
.comparison-grid article img,
.contact-grid article img,
.support-grid article img,
.price-card > img,
.condition-grid article .image-placeholder,
.comparison-grid article .image-placeholder,
.contact-grid article .image-placeholder,
.support-grid article .image-placeholder,
.price-card > .image-placeholder {
  display: block;
  width: 100%;
  height: 180px;
  margin-bottom: 16px;
  border-radius: var(--radius);
  object-fit: cover;
}

.recovery-path span {
  display: block;
  margin-bottom: 8px;
  color: var(--accent-strong);
  font-size: 0.76rem;
  font-weight: 800;
  text-transform: uppercase;
}

.recovery-path strong {
  display: block;
  line-height: 1.35;
}

.symptom-education {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin-top: 18px;
}

.symptom-visual-wrap {
  display: grid;
  grid-template-columns: minmax(280px, 0.75fr) minmax(0, 1.25fr);
  gap: 18px;
  align-items: stretch;
  margin-top: 20px;
}

.symptom-visual {
  overflow: hidden;
  border: 1px solid var(--muted);
  border-radius: var(--radius);
  background: var(--card);
  box-shadow: 0 12px 36px rgba(31, 31, 31, 0.08);
}

.symptom-visual img,
.symptom-visual .image-placeholder {
  display: block;
  width: 100%;
  min-height: 360px;
  object-fit: cover;
}

.symptom-visual-caption {
  padding: 18px;
}

.empty-note {
  grid-column: 1 / -1;
  margin: 0;
  padding: 18px;
  border: 1px dashed rgba(11, 60, 93, 0.28);
  border-radius: var(--radius);
  background: rgba(255, 255, 255, 0.58);
}

.symptom-card h3 {
  font-size: 1.05rem;
}

.symptom-card strong {
  display: block;
  margin-top: 12px;
  color: var(--primary);
}

.body-map-section {
  background: var(--card);
}

.body-map-layout {
  display: grid;
  grid-template-columns: minmax(280px, 0.8fr) minmax(0, 1fr);
  gap: clamp(22px, 5vw, 72px);
  align-items: center;
}

.body-map {
  min-height: 540px;
  display: grid;
  place-items: center;
  border-radius: var(--radius);
  background: linear-gradient(180deg, var(--secondary), var(--card));
  border: 1px solid var(--muted);
}

.silhouette {
  position: relative;
  width: min(310px, 72vw);
  height: 470px;
}

.silhouette::before,
.silhouette::after {
  content: "";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  background: rgba(11, 60, 93, 0.18);
  border: 1px solid rgba(11, 60, 93, 0.28);
}

.silhouette::before {
  top: 22px;
  width: 82px;
  height: 82px;
  border-radius: 50%;
}

.silhouette::after {
  top: 120px;
  width: 180px;
  height: 300px;
  border-radius: 48% 48% 42% 42%;
}

.map-dot {
  position: absolute;
  z-index: 2;
  width: 32px;
  height: 32px;
  border: 3px solid white;
  border-radius: 50%;
  background: var(--accent);
  box-shadow: 0 10px 22px rgba(232, 93, 4, 0.32);
  cursor: pointer;
}

.map-dot.is-active {
  background: var(--primary);
  box-shadow: 0 10px 24px rgba(11, 60, 93, 0.36);
}

.map-dot span {
  position: absolute;
  left: 40px;
  top: 50%;
  min-width: 120px;
  padding: 6px 8px;
  border-radius: 999px;
  color: var(--fg);
  background: white;
  box-shadow: 0 8px 20px rgba(31, 31, 31, 0.1);
  font-size: 0.78rem;
  font-weight: 800;
  transform: translateY(-50%);
}

.map-dot.ribs { top: 170px; left: 138px; }
.map-dot.belly { top: 246px; left: 138px; }
.map-dot.scar { top: 308px; left: 138px; }
.map-dot.pelvis { top: 356px; left: 138px; }
.map-dot.back { top: 238px; left: 46px; }
.map-dot.neck { top: 106px; left: 184px; }
.map-dot.breathing { top: 150px; left: 220px; }
.map-dot.hips { top: 390px; left: 216px; }

.map-info {
  padding: clamp(26px, 4vw, 44px);
  border-radius: var(--radius);
  border: 1px solid var(--muted);
  background: var(--bg);
  box-shadow: var(--shadow);
}

.map-info-visual {
  display: block;
  width: 100%;
  height: 300px;
  margin: 0 0 18px;
  border-radius: var(--radius);
  background: var(--card);
  object-fit: cover;
}

.map-info-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin-top: 14px;
}

.map-info-grid strong {
  display: block;
  margin-bottom: 4px;
  color: var(--primary);
}

.map-info-grid p {
  margin: 0;
  color: var(--muted-fg);
  line-height: 1.55;
}

.warning-section {
  background: var(--primary);
}

.warning-section h2,
.warning-section .section-heading p {
  color: white;
}

.warning-section .eyebrow {
  color: var(--bg);
}

.warning-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(340px, 0.54fr);
  gap: 18px;
  align-items: stretch;
}

.avoid-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.avoid-grid span {
  min-height: 54px;
  display: flex;
  align-items: center;
  padding: 12px 14px;
  border-radius: var(--radius);
  color: white;
  background: rgba(255, 255, 255, 0.12);
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-left: 4px solid var(--destructive);
  font-weight: 800;
}

.warning-visual {
  margin: 0;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: var(--radius);
  background: rgba(255, 255, 255, 0.1);
}

.warning-visual img,
.warning-visual .image-placeholder {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 300px;
  object-fit: cover;
}

.condition-grid,
.comparison-grid,
.support-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.condition-grid article strong {
  display: block;
  margin: 12px 0 6px;
  color: var(--primary);
}

.condition-grid article span {
  color: var(--muted-fg);
  line-height: 1.6;
}

.comparison-section {
  background: var(--secondary);
}

.comparison-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.comparison-grid article:last-child {
  background: var(--accent-soft);
  border-color: rgba(232, 93, 4, 0.3);
}

.red-flag-section {
  background: var(--card);
}

.red-flag-media img,
.red-flag-media .image-placeholder {
  max-height: 460px;
  object-position: center 44%;
}

.red-flag-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.red-flag-grid article {
  padding: 20px;
  border: 1px solid rgba(185, 28, 28, 0.25);
  border-radius: var(--radius);
  background: rgba(185, 28, 28, 0.05);
}

.red-flag-grid span {
  display: inline-flex;
  margin-bottom: 14px;
  color: var(--destructive);
  font-size: 0.76rem;
  font-weight: 900;
  text-transform: uppercase;
}

.readiness-section {
  background: var(--secondary);
}

.readiness-check {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 0.72fr);
  gap: 18px;
  align-items: stretch;
}

.readiness-options,
.readiness-result {
  padding: clamp(20px, 3vw, 28px);
  border: 1px solid var(--muted);
  border-radius: var(--radius);
  background: var(--card);
}

.readiness-options {
  display: grid;
  gap: 12px;
}

.readiness-options label {
  display: grid;
  grid-template-columns: 22px 1fr;
  gap: 12px;
  align-items: start;
  padding: 14px;
  border: 1px solid var(--muted);
  border-radius: var(--radius);
  background: var(--bg);
  color: var(--fg);
  font-weight: 750;
}

.readiness-options input {
  width: 18px;
  height: 18px;
  margin-top: 3px;
  accent-color: var(--primary);
}

.readiness-options span {
  line-height: 1.5;
}

.readiness-result {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.readiness-image {
  display: block;
  width: 100%;
  height: 220px;
  border-radius: var(--radius);
  object-fit: cover;
}

.readiness-result .button {
  align-self: flex-start;
  margin-top: auto;
}

.support-section {
  background: var(--card);
}

.support-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.support-grid article {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.support-grid .button {
  margin-top: auto;
}

.funnel-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.funnel-card {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid var(--muted);
  border-radius: var(--radius);
  background: var(--card);
  box-shadow: 0 12px 36px rgba(31, 31, 31, 0.08);
}

.funnel-card img,
.funnel-card .image-placeholder {
  display: block;
  width: 100%;
  height: 180px;
  object-fit: cover;
}

/* Image audit correction: Choose Your Path card images rendered 417x180 (2.3:1 letterbox)
   at desktop, slicing the subject out of frame. Scoped to .path-card-grid only (not the
   wider .funnel-card usage on /workout-guidance) so those cards keep their fixed height. */
.path-card-grid .funnel-card img,
.path-card-grid .funnel-card .image-placeholder {
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

.funnel-card div {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 20px;
}

.funnel-card .button {
  align-self: flex-start;
  margin-top: auto;
}

.contact-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  justify-content: center;
}

.contact-grid article {
  /* Same 4-across card width as the old 4-col grid (using the existing 14px gap), but
     flex-wrap + justify-content:center means an incomplete last row centers instead of
     clumping bottom-left with empty cells. flex-grow:0 keeps a lone last card at card
     width rather than stretching it full-width. */
  flex: 0 1 calc((100% - 3 * 14px) / 4);
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-height: 300px;
  padding: 22px;
  border: 1px solid var(--muted);
  border-radius: var(--radius);
  background: var(--card);
}

.contact-grid h2 {
  font-size: clamp(1.45rem, 2vw, 2rem);
}

.contact-grid .button {
  margin-top: auto;
}

.contact-grid .cta-row .button {
  margin-top: 0;
}

.contact-details a {
  color: var(--primary);
  font-weight: 800;
}

.safety-inline {
  max-width: 900px;
  margin: 0;
  padding: 12px 16px;
  border: 1px solid var(--muted);
  border-radius: var(--radius);
  background: var(--secondary);
  color: var(--muted-fg);
  font-size: 0.86rem;
  line-height: 1.5;
}

.safety-inline strong {
  color: var(--fg);
}

.safety-inline p {
  margin-bottom: 0;
}

.plan-label {
  margin-bottom: 0;
  color: var(--accent-strong);
  font-size: 0.78rem;
  font-weight: 800;
  text-transform: uppercase;
}

.proof-chip {
  display: inline-flex;
  margin-bottom: 8px;
  padding: 4px 10px;
  border-radius: 999px;
  color: var(--accent-strong);
  background: var(--accent-soft);
  font-size: 0.72rem;
  font-weight: 800;
  text-transform: uppercase;
}

.proof-result {
  display: flex;
  width: fit-content;
  margin: 0 0 10px;
  padding: 5px 10px;
  border: 1px solid var(--accent);
  border-radius: 999px;
  color: var(--accent-strong);
  background: var(--secondary);
  font-size: 0.75rem;
  font-weight: 900;
}

.proof-story {
  margin-top: 10px;
}

.proof-story summary {
  cursor: pointer;
  list-style: none;
  color: var(--primary);
  font-weight: 800;
  font-size: 0.86rem;
}

.proof-story summary::-webkit-details-marker {
  display: none;
}

.proof-story p {
  margin-top: 8px;
}

.standards-card {
  max-width: 980px;
  margin: 0 auto;
  padding: 4px;
  border: 1px solid var(--muted);
  border-radius: var(--radius);
  background: var(--card);
  box-shadow: 0 12px 36px rgba(31, 31, 31, 0.08);
}

.standards-card summary {
  cursor: pointer;
  list-style: none;
  padding: 18px 20px;
  color: var(--fg);
  font-weight: 850;
}

.standards-card summary::-webkit-details-marker {
  display: none;
}

.standards-card > .comparison-grid {
  padding: 0 20px 20px;
}

/* Home portion-system storyline (lock 27, PORTION-SYSTEM-ON-HOME): native details/summary
   accordions for the five steps, step 01 alone opening onto a .case-study-grid (untouched,
   reused as-is). Card language and summary/marker-hiding treatment mirror .standards-card
   and .credential-disclosure above; numeral treatment mirrors .stepper-grid article span /
   .process-steps span. */
.step-accordions {
  display: grid;
  gap: 14px;
  margin-top: 28px;
}

.step-accordion {
  border: 1px solid var(--muted);
  border-radius: var(--radius);
  background: var(--card);
}

.step-accordion summary {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 20px 22px;
  cursor: pointer;
  list-style: none;
}

.step-accordion summary::-webkit-details-marker {
  display: none;
}

.step-accordion .step-number {
  color: var(--accent-strong);
  font-weight: 900;
}

.step-accordion .step-label {
  font-weight: 700;
}

.step-accordion-body {
  padding: 0 22px 24px;
}

.step-accordion-body .case-study-grid {
  margin-top: 18px;
}

/* Postpartum "Conditions explained simply" (chunk C5, 21 Jul 2026): the 8 condition cards
   became compact click-to-expand accordions — collapsed shows name + one-liner, expanding
   reveals the existing image + full detail. Modeled directly on .step-accordions/.step-accordion
   above (marker hiding, card border/radius/background, summary flex row, body padding); the
   internal label/value pairs reuse .condition-grid article strong/span's exact colors so the
   expanded detail looks identical to the old card content. */
.condition-accordions {
  display: grid;
  gap: 14px;
  margin-top: 28px;
}

.condition-accordion {
  border: 1px solid var(--muted);
  border-radius: var(--radius);
  background: var(--card);
}

.condition-accordion summary {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 14px;
  padding: 20px 22px;
  cursor: pointer;
  list-style: none;
}

.condition-accordion summary::-webkit-details-marker {
  display: none;
}

/* E4 curiosity thumbnails: each summary leads with a small crop of its own body image. */
.condition-thumb {
  width: 60px;
  height: 60px;
  flex-shrink: 0;
  border-radius: 10px;
  object-fit: cover;
}

/* E4, mobile: long condition names wrap under the thumb in the flex row, so under 820px
   the summary becomes a uniform two-column grid — thumb left, name + hint stacked right. */
@media (max-width: 820px) {
  .condition-accordion summary {
    display: grid;
    grid-template-columns: 60px minmax(0, 1fr);
    grid-template-rows: auto auto;
    align-items: center;
    column-gap: 14px;
    row-gap: 2px;
  }

  .condition-accordion summary .condition-thumb {
    grid-row: 1 / 3;
  }

  .condition-accordion summary .condition-name,
  .condition-accordion summary .condition-hint {
    grid-column: 2;
  }
}

.condition-accordion .condition-name {
  font-weight: 700;
}

.condition-accordion .condition-hint {
  color: var(--muted-fg);
  font-size: 0.92rem;
}

.condition-accordion-body {
  padding: 0 22px 24px;
}

.condition-accordion-body img {
  display: block;
  width: 100%;
  height: 180px;
  margin-bottom: 16px;
  border-radius: var(--radius);
  object-fit: cover;
}

.condition-accordion-body strong {
  display: block;
  margin: 12px 0 6px;
  color: var(--primary);
}

.condition-accordion-body span {
  color: var(--muted-fg);
  line-height: 1.6;
}

.proof-visual-grid.is-quad {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.safety-note {
  background: var(--primary);
}

.safety-note .eyebrow {
  color: var(--bg);
}

.postpartum-safety-note {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 0.46fr);
  gap: clamp(22px, 4vw, 48px);
  align-items: center;
}

.safety-note h2,
.safety-note p {
  color: white;
}

.safety-note p {
  max-width: 1000px;
}

.safety-note-visual {
  margin: 0;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: var(--radius);
}

.safety-note-visual img,
.safety-note-visual .image-placeholder {
  display: block;
  width: 100%;
  min-height: 260px;
  object-fit: cover;
}

.toast {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 50;
  max-width: 310px;
  padding: 14px 16px;
  border-radius: var(--radius);
  color: white;
  background: var(--fg);
  box-shadow: var(--shadow);
  opacity: 0;
  pointer-events: none;
  transform: translateY(12px);
  transition: opacity 180ms ease, transform 180ms ease;
}

.toast.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.entry-page {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 24px;
  background:
    linear-gradient(120deg, rgba(11, 60, 93, 0.08), rgba(232, 93, 4, 0.12)),
    var(--bg);
}

.entry-shell {
  max-width: 760px;
  padding: clamp(28px, 5vw, 56px);
  border: 1px solid var(--muted);
  border-radius: var(--radius);
  background: var(--card);
  box-shadow: var(--shadow);
}

.entry-shell h1 {
  font-size: clamp(2.2rem, 5vw, 4.8rem);
}

.page-hero {
  padding: clamp(54px, 8vw, 108px) clamp(20px, 5vw, 64px);
  background:
    linear-gradient(135deg, rgba(11, 60, 93, 0.08), rgba(232, 93, 4, 0.1)),
    var(--bg);
}

.page-hero > p,
.page-hero > h1 {
  max-width: 920px;
}

.page-hero .hero-lede {
  max-width: 760px;
}

.feature-image {
  margin: 0;
  overflow: hidden;
  border-radius: var(--radius);
  border: 1px solid var(--muted);
  background: var(--card);
  box-shadow: var(--shadow);
}

.feature-image img,
.feature-image .image-placeholder {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 360px;
  object-fit: cover;
}

/* Image audit correction: the placeholder has no intrinsic image dimensions, so it was
   stretching to whatever height the grid row/min-height combination produced (measured
   562x360 desktop, ~1.1:1 mobile) instead of holding 16:9 — reads accidental, and pinned
   the label to the top of the oversized box. Enforce a true, width-derived 16:9 box instead
   of the fixed min-height, re-center the label on both axes, and strengthen the tint so the
   box reads as a deliberate placeholder (still neutral cream/navy — never an image, never a
   face). Real photos in .feature-image (the img rule above) are untouched. */
.feature-image .image-placeholder {
  height: auto;
  min-height: 0;
  aspect-ratio: 16 / 9;
  align-self: center;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  background: linear-gradient(135deg, rgba(11, 60, 93, 0.14), rgba(232, 93, 4, 0.14)) #fff4e6;
}

.section-media {
  margin: 28px 0;
  overflow: hidden;
  border: 1px solid var(--muted);
  border-radius: var(--radius);
  background: var(--card);
  box-shadow: 0 12px 36px rgba(31, 31, 31, 0.08);
}

.section-media img,
.section-media .image-placeholder {
  display: block;
  width: 100%;
  max-height: 520px;
  object-fit: cover;
}

.founder-duo {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  min-height: 520px;
}

.founder-duo img {
  min-height: 520px;
}

.founder-duo img:first-child {
  object-position: 52% center;
}

.founder-duo img:last-child {
  object-position: 50% center;
}

.visual-card-grid,
.offer-visual-grid,
.proof-visual-grid,
.asset-request-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.visual-card,
.offer-visual-card,
.proof-visual-card,
.asset-request-card {
  overflow: hidden;
  border: 1px solid var(--muted);
  border-radius: var(--radius);
  background: var(--card);
  box-shadow: 0 12px 36px rgba(31, 31, 31, 0.08);
}

.visual-card img,
.offer-visual-card img,
.proof-visual-card img,
.visual-card .image-placeholder,
.offer-visual-card .image-placeholder,
.proof-visual-card .image-placeholder {
  display: block;
  width: 100%;
  height: 260px;
  object-fit: cover;
}

.visual-card div,
.offer-visual-card div,
.proof-visual-card div,
.asset-request-card {
  padding: 20px;
}

.visual-card h3,
.offer-visual-card h3,
.proof-visual-card h3,
.asset-request-card h3 {
  margin-bottom: 8px;
}

.visual-card p,
.offer-visual-card p,
.proof-visual-card p,
.asset-request-card p {
  margin-bottom: 0;
}

.offer-visual-card {
  display: grid;
  grid-template-rows: auto 1fr;
}

.offer-visual-card strong,
.proof-visual-card strong {
  display: inline-flex;
  margin-bottom: 8px;
  color: var(--accent-strong);
  font-size: 0.78rem;
  font-weight: 900;
  text-transform: uppercase;
}

.transformation-proof-card img {
  height: auto;
  aspect-ratio: 1000 / 563;
  object-fit: contain;
  background: var(--secondary);
}

#proofGrid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
}

.logo-strip {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  align-items: center;
  margin-top: 24px;
}

.logo-strip img {
  width: 100%;
  height: 76px;
  padding: 16px 20px;
  border: 1px solid var(--muted);
  border-radius: var(--radius);
  background: var(--card);
  object-fit: contain;
}

.stats-band {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  padding: 1px;
  background: var(--muted);
}

.stats-band div {
  min-height: 128px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 24px clamp(18px, 4vw, 42px);
  background: var(--card);
}

.stats-band strong {
  color: var(--primary);
  font-size: clamp(1.5rem, 2.4vw, 2.4rem);
  line-height: 1;
}

.stats-band span {
  margin-top: 8px;
  color: var(--muted-fg);
}

.mechanism-grid,
.proof-grid,
.about-grid,
.pricing-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.stepper-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 14px;
}

.mechanism-grid article,
.proof-grid article,
.about-grid article,
.price-card,
.stepper-grid article {
  padding: 22px;
  border: 1px solid var(--muted);
  border-radius: var(--radius);
  background: var(--card);
}

.mechanism-grid article span,
.proof-grid article span,
.about-grid article span,
.stepper-grid article span {
  display: inline-flex;
  margin-bottom: 18px;
  color: var(--accent-strong);
  font-weight: 900;
}

.proof-grid article small {
  display: block;
  margin-top: 14px;
  color: var(--muted-fg);
  line-height: 1.5;
}

.case-study-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.case-study-grid article {
  padding: 24px;
  border: 1px solid var(--muted);
  border-radius: var(--radius);
  background: var(--card);
}

.case-study-grid dl {
  display: grid;
  gap: 12px;
  margin: 18px 0 0;
}

.case-study-grid div {
  padding-top: 12px;
  border-top: 1px solid var(--muted);
}

.case-study-grid dt {
  color: var(--primary);
  font-weight: 900;
}

.case-study-grid dd {
  margin: 4px 0 0;
  color: var(--muted-fg);
  line-height: 1.5;
}

.quote-panel {
  display: flex;
  align-items: center;
  min-height: 280px;
  padding: clamp(24px, 4vw, 42px);
  border: 1px solid var(--muted);
  border-radius: var(--radius);
  background: var(--card);
  box-shadow: var(--shadow);
}

.quote-panel p {
  color: var(--primary);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.4rem, 2.4vw, 2.1rem);
  line-height: 1.35;
}

.founder-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.founder-card {
  overflow: hidden;
  border: 1px solid var(--muted);
  border-radius: var(--radius);
  background: var(--card);
  box-shadow: 0 12px 36px rgba(31, 31, 31, 0.08);
}

.founder-card img {
  display: block;
  width: 100%;
  height: 520px;
  object-fit: cover;
}

.founder-card:first-child img {
  object-position: 52% center;
}

.founder-card:last-child img {
  object-position: 50% center;
}

.founder-card div {
  padding: 24px;
}

/* /about rebuild (lock 22): tagline + founder credential lists */
/* /about brand watermark (lock 24): each brand's own logo as a faint background behind that
   section's text; text sits above (z-index) and stays fully AA-legible. Replaces the old
   inline .brand-mark logos in the Moves n Stretch / Chatora Coach blocks. url() is relative
   to this stylesheet at repo root, so it is assets/logos/… (no ../). */
.brand-watermark {
  position: relative;
  overflow: hidden;
}

.brand-watermark > * {
  position: relative;
  z-index: 1;
}

.brand-watermark::before {
  content: "";
  position: absolute;
  top: 50%;
  right: -1%;
  transform: translateY(-50%);
  width: min(320px, 38%);
  height: 78%;
  background-repeat: no-repeat;
  background-position: center right;
  background-size: contain;
  opacity: 0.06;
  pointer-events: none;
  z-index: 0;
}

.brand-watermark--mns::before {
  background-image: url("assets/logos/moves-n-stretch-logo-transparent.png");
}

.brand-watermark--chatora::before {
  background-image: url("assets/logos/chatora-coach-logo-transparent.png");
}

.brand-tagline {
  font-weight: 700;
  font-size: 1.15rem;
  color: var(--accent-strong);
  margin: 4px 0;
}

.founder-role {
  font-weight: 600;
  margin: 4px 0 12px;
}

.founder-creds {
  margin: 0;
  padding-left: 20px;
  display: grid;
  gap: 6px;
}

.shot-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.shot-list article,
.asset-request-card {
  padding: 22px;
  border: 1px solid var(--muted);
  border-radius: var(--radius);
  background: var(--card);
}

.process-section {
  background: var(--card);
}

.process-steps {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  padding: 1px;
  border-radius: var(--radius);
  background: var(--muted);
  overflow: hidden;
}

.process-steps article {
  min-height: 240px;
  padding: clamp(20px, 3vw, 30px);
  background: var(--bg);
}

.process-steps span {
  display: inline-flex;
  margin-bottom: 18px;
  color: var(--accent-strong);
  font-weight: 900;
}

.process-steps h3 {
  max-width: 220px;
}

.split-section,
.image-split {
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
  gap: clamp(28px, 5vw, 76px);
  align-items: center;
  padding: clamp(54px, 8vw, 100px) clamp(20px, 5vw, 64px);
}

.split-section {
  background: var(--primary);
}

.split-section h2,
.split-section p {
  color: white;
}

.split-section .eyebrow {
  color: var(--bg);
}

.path-list {
  display: grid;
  gap: 10px;
}

.path-list a {
  display: grid;
  gap: 6px;
  padding: 18px;
  border-radius: var(--radius);
  color: var(--fg);
  background: var(--card);
  text-decoration: none;
  border: 1px solid rgba(255, 255, 255, 0.28);
}

.path-list.is-visual a {
  grid-template-columns: 92px minmax(0, 1fr);
  align-items: center;
  padding: 10px;
}

.path-list.is-visual img,
.path-list.is-visual .image-placeholder {
  width: 92px;
  height: 82px;
  border-radius: var(--radius);
  object-fit: cover;
}

.path-list.is-visual strong,
.path-list.is-visual span {
  display: block;
}

.path-list span {
  color: var(--muted-fg);
  line-height: 1.5;
}

.final-cta {
  padding: clamp(54px, 8vw, 104px) clamp(20px, 5vw, 64px);
  background: linear-gradient(135deg, #fff4e6, #f2f6fa 55%, #fff4e6);
}

.final-cta p,
.final-cta h2 {
  max-width: 820px;
}

.plan-section {
  background: var(--card);
}

.pricing-grid {
  grid-template-columns: 1.2fr 1fr 1fr;
  align-items: stretch;
}

.mns-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  align-items: stretch;
}

.mns-grid--single {
  grid-template-columns: minmax(0, 760px);
  justify-content: center;
}

.standards-card > .mns-grid {
  padding: 0 20px 20px;
}

/* Moves n Stretch studio block — deliberately styled apart from the Chatora
   cards above it: two price points (₹4,999 / ₹8,999) exist in both brands'
   line-ups and must not read as the same products. */
.mns-section {
  background: var(--primary);
  border-top: 6px solid var(--accent);
}

.mns-section .section-heading h2 {
  color: #fff;
}

.mns-section .section-heading .eyebrow {
  color: #ffd8b0;
}

.mns-section .section-heading p {
  color: rgba(255, 255, 255, 0.85);
}

.price-card.mns-card {
  background: var(--bg);
  border-top: 4px solid var(--accent);
}

.mns-badge {
  align-self: flex-start;
  margin: 0;
  padding: 4px 12px;
  border-radius: 999px;
  background: var(--primary);
  color: #fff;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.mns-assess {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px;
  margin-top: 18px;
  color: rgba(255, 255, 255, 0.9);
}

.mns-assess p {
  margin: 0;
}

.mns-assess .button {
  color: var(--primary);
  background: #fff;
}

.price-card {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.price-card > img,
.price-card > .image-placeholder {
  height: 210px;
  margin-bottom: 4px;
}

.price-card h2 {
  font-size: clamp(1.55rem, 2.3vw, 2.45rem);
}

.price-card .button {
  margin-top: auto;
}

.price-card .cta-row .button {
  margin-top: 0;
}

.price-card.is-featured {
  color: white;
  background: linear-gradient(135deg, rgba(11, 60, 93, 0.92), var(--primary));
  border-color: transparent;
  box-shadow: var(--shadow);
}

.price-card.is-featured p,
.price-card.is-featured li,
.price-card.is-featured .plan-label {
  color: rgba(255, 255, 255, 0.82);
}

.price-card.is-featured h2 {
  color: #fff;
}

.price-card.is-featured .button {
  color: var(--primary);
  background: white;
}

.price-card.is-featured .button-secondary {
  color: white;
  background: rgba(255, 255, 255, 0.12);
  border-color: rgba(255, 255, 255, 0.34);
  box-shadow: none;
}

/* .primary-link's own base styling (solid var(--primary) navy pill) is the same navy as
   this card's own gradient background — without this override the pill is nearly invisible
   against the card. Same translucent-white treatment as .button-secondary above. */
.price-card.is-featured .primary-link {
  color: white;
  background: rgba(255, 255, 255, 0.12);
  border-color: rgba(255, 255, 255, 0.34);
  box-shadow: none;
}

.plan-more {
  margin-top: 2px;
}

.plan-more summary {
  cursor: pointer;
  list-style: none;
  color: var(--primary);
  font-weight: 800;
  font-size: 0.9rem;
}

.plan-more summary::-webkit-details-marker {
  display: none;
}

.plan-more ul {
  margin-top: 10px;
}

.price-card.is-featured .plan-more summary {
  color: white;
}

.premium-rule {
  padding: 14px 16px;
  border-radius: var(--radius);
  background: rgba(255, 255, 255, 0.14);
  font-size: 0.9rem;
  line-height: 1.55;
}

.fair-policy-inline {
  margin: 0;
  color: var(--muted-fg);
  font-size: 0.82rem;
}

.callback-toggle {
  position: relative;
}

.callback-toggle summary {
  cursor: pointer;
  list-style: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 13px 18px;
  border: 1px solid var(--muted);
  border-radius: 999px;
  color: var(--primary);
  background: rgba(255, 255, 255, 0.78);
  font-weight: 800;
}

.callback-toggle summary::-webkit-details-marker {
  display: none;
}

.callback-note {
  margin-top: 10px;
  padding: 12px 14px;
  border: 1px solid var(--muted);
  border-radius: var(--radius);
  background: var(--secondary);
  color: var(--muted-fg);
  font-size: 0.86rem;
  line-height: 1.5;
}

.callback-note a {
  color: var(--primary);
  font-weight: 800;
}

/* /contact Request Callback form (revealed by the hub's Request Callback button) */
.callback-panel {
  margin-top: 14px;
  max-width: 560px;
}

.callback-form {
  display: grid;
  gap: 14px;
  padding: 20px;
  border: 1px solid var(--muted);
  border-radius: var(--radius);
  background: var(--card);
}

.callback-form-title {
  margin: 0;
  color: var(--primary);
  font-weight: 800;
}

.callback-form-note {
  margin: -6px 0 0;
  color: var(--muted-fg);
  font-size: 0.88rem;
}

.callback-field {
  display: grid;
  gap: 6px;
}

.callback-field label {
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--muted-fg);
}

.callback-field label span[aria-hidden] {
  color: var(--accent-strong);
}

.callback-optional {
  font-weight: 600;
  color: var(--muted-fg);
}

.callback-field input,
.callback-field select,
.callback-field textarea {
  width: 100%;
  padding: 11px 12px;
  border: 1px solid var(--muted);
  border-radius: var(--radius);
  background: #fff;
  color: var(--fg);
  font: inherit;
}

.callback-field textarea {
  resize: vertical;
}

.callback-field input:focus,
.callback-field select:focus,
.callback-field textarea:focus {
  outline: 2px solid var(--primary);
  outline-offset: 1px;
  border-color: var(--primary);
}

.callback-error {
  margin: 0;
  color: var(--destructive);
  font-size: 0.86rem;
  font-weight: 700;
}

.callback-status {
  margin: 0;
  font-size: 0.9rem;
}

.callback-status[data-kind="success"] {
  color: #15803d;
  font-weight: 700;
}

.callback-status[data-kind="error"] {
  color: var(--destructive);
  font-weight: 700;
}

.callback-status a {
  color: var(--primary);
  font-weight: 800;
}

/* Web3Forms honeypot — visually hidden, off the tab order */
.callback-hp {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.price-card.is-featured .callback-toggle summary {
  color: white;
  background: rgba(255, 255, 255, 0.12);
  border-color: rgba(255, 255, 255, 0.34);
}

.price-card.is-featured .callback-note {
  background: rgba(255, 255, 255, 0.14);
  color: rgba(255, 255, 255, 0.92);
}

.price-card.is-featured .callback-note a {
  color: white;
  text-decoration: underline;
}

.price {
  display: block;
  color: inherit;
  font-size: clamp(2rem, 4vw, 3.4rem);
  line-height: 1;
}

.price-card .price-text-small {
  font-size: clamp(1.1rem, 1.6vw, 1.5rem);
  line-height: 1.25;
}

.price-card .plan-tier-note {
  font-size: 0.85rem;
  color: var(--muted-fg);
  margin: 0;
}

.comparison-table-wrap {
  overflow-x: auto;
  border: 1px solid var(--muted);
  border-radius: var(--radius);
  background: var(--card);
  box-shadow: 0 12px 36px rgba(31, 31, 31, 0.08);
}

.comparison-table {
  width: 100%;
  min-width: 880px;
  border-collapse: collapse;
  text-align: left;
}

.comparison-table th,
.comparison-table td {
  padding: 16px;
  border-bottom: 1px solid var(--muted);
  vertical-align: top;
}

.comparison-table thead th {
  color: var(--primary);
  background: var(--bg);
  font-size: 0.78rem;
  text-transform: uppercase;
}

.comparison-table tbody th {
  color: var(--fg);
  font-size: 1rem;
}

.comparison-table td {
  color: var(--muted-fg);
  line-height: 1.55;
}

.comparison-table tr:last-child th,
.comparison-table tr:last-child td {
  border-bottom: 0;
}

.comparison-table a {
  color: var(--primary);
  font-weight: 900;
  text-decoration: none;
}

.compare-accordion {
  display: none;
  margin-top: 18px;
}

.compare-card {
  border: 1px solid var(--muted);
  border-radius: var(--radius);
  background: var(--card);
  overflow: hidden;
}

.compare-card + .compare-card {
  margin-top: 10px;
}

.compare-card summary {
  cursor: pointer;
  list-style: none;
  padding: 16px 18px;
  color: var(--primary);
  font-weight: 850;
}

.compare-card summary::-webkit-details-marker {
  display: none;
}

.compare-card dl {
  margin: 0;
  padding: 0 18px 18px;
  display: grid;
  gap: 12px;
}

.compare-card dl > div {
  padding-top: 12px;
  border-top: 1px solid var(--muted);
}

.compare-card dt {
  color: var(--primary);
  font-size: 0.78rem;
  font-weight: 850;
  text-transform: uppercase;
}

.compare-card dd {
  margin: 4px 0 0;
  color: var(--muted-fg);
  line-height: 1.55;
}

.compare-card dd a {
  color: var(--primary);
  font-weight: 900;
  text-decoration: none;
}

.plan-finder {
  display: grid;
  grid-template-columns: minmax(0, 0.95fr) minmax(320px, 0.75fr);
  gap: 18px;
  align-items: stretch;
}

.finder-controls,
.finder-result {
  padding: clamp(20px, 3vw, 28px);
  border: 1px solid var(--muted);
  border-radius: var(--radius);
  background: var(--card);
  box-shadow: 0 12px 36px rgba(31, 31, 31, 0.08);
}

.finder-controls {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.finder-question {
  margin: 0;
  padding: 0;
  border: 0;
}

.finder-question legend {
  padding: 0;
  margin-bottom: 10px;
  color: var(--primary);
  font-size: 0.78rem;
  font-weight: 850;
  text-transform: uppercase;
}

.chip-group {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.chip {
  position: relative;
  display: inline-flex;
}

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

.chip span {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 9px 14px;
  border: 1px solid var(--muted);
  border-radius: 999px;
  color: var(--fg);
  background: var(--bg);
  font-size: 0.86rem;
  font-weight: 750;
  line-height: 1.3;
  cursor: pointer;
  transition: background 160ms ease, color 160ms ease, border-color 160ms ease;
}

.chip input:checked + span {
  color: white;
  background: var(--primary);
  border-color: var(--primary);
}

.chip input:focus-visible + span {
  outline: 3px solid rgba(232, 93, 4, 0.75);
  outline-offset: 3px;
}

.fair-policy-note {
  max-width: 980px;
  margin: 18px auto 0;
  padding: 14px 16px;
  border: 1px solid var(--muted);
  border-radius: var(--radius);
  color: var(--muted-fg);
  background: rgba(255, 255, 255, 0.74);
  font-size: 0.92rem;
  line-height: 1.5;
}

.refund-explainer {
  max-width: 820px;
  margin: 0 auto;
  padding: clamp(24px, 4vw, 36px);
  border: 1px solid var(--muted);
  border-radius: var(--radius);
  background: var(--card);
  box-shadow: 0 12px 36px rgba(31, 31, 31, 0.08);
}

.refund-explainer p {
  margin: 0 0 14px;
  color: var(--muted-fg);
  line-height: 1.6;
}

.refund-explainer p:last-of-type {
  margin-bottom: 20px;
}

.finder-result {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.finder-result h3 {
  font-size: clamp(1.45rem, 2vw, 2rem);
}

.finder-result .button {
  align-self: flex-start;
  margin-top: auto;
}

.finder-result .price.finder-price {
  font-size: clamp(1.6rem, 2.4vw, 2.2rem);
  line-height: 1.1;
}

.section-message-cta {
  display: flex;
  justify-content: center;
  margin-top: 20px;
}

/* postpartum plans "help nearby" fix (Mayur, 21 Jul preview walk: "off beat — I am not able
   to see it properly" / "the button should be nearby"): .help-banner makes the shared
   callback/call block an obvious boxed card instead of two loose buttons, reusing the same
   card tokens as .price-card/.step-accordion. */
.help-banner {
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 16px;
  padding: 24px 28px;
  border: 1px solid var(--muted);
  border-radius: var(--radius);
  background: var(--card);
  text-align: center;
}

.help-banner p {
  flex-basis: 100%;
  margin: 0;
}

/* Lock 39 — context-aware return CTA on /transformations: a compact banner
   (the top strip ships hidden and appears only when a funnel context
   resolves; the final one is always visible with the generic default) that
   sends the visitor back to the funnel they arrived from. */
.return-cta {
  width: min(720px, calc(100% - 40px));
  margin: 12px auto 28px;
  padding: 22px 24px;
  border: 1px solid var(--muted);
  border-radius: var(--radius);
  background: var(--card);
  text-align: center;
}

.return-cta .eyebrow {
  margin-bottom: 6px;
}

.return-cta-message {
  margin: 0 0 16px;
}

/* Lock 39 — return destinations land clear of the sticky site header (same
   convention as the BMT anchor rules). */
#chatora-plans,
#postpartum-plans {
  scroll-margin-top: 96px;
}

.mini-price-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin: 24px 0 0;
}

.mini-price-list.is-not-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.mini-price-list.is-not-grid strong {
  font-size: 1.05rem;
}

.mini-price-list div {
  padding: 18px;
  border-radius: var(--radius);
  border: 1px solid var(--muted);
  background: var(--card);
}

.mini-price-list strong,
.mini-price-list span {
  display: block;
}

.mini-price-list strong {
  color: var(--primary);
  font-size: 1.45rem;
}

.mini-price-list span {
  margin-top: 6px;
  color: var(--muted-fg);
}

.faq-list {
  display: grid;
  gap: 10px;
  max-width: 980px;
  margin: 0 auto;
}

.faq-list .section-heading {
  margin: 0 0 12px;
}

.faq-list .compact-heading {
  margin-top: 34px;
}

.faq-list details {
  border: 1px solid var(--muted);
  border-radius: var(--radius);
  background: var(--card);
  overflow: hidden;
}

.faq-list summary {
  cursor: pointer;
  padding: 18px 20px;
  color: var(--fg);
  font-weight: 850;
}

.faq-list details p {
  margin: 0;
  padding: 0 20px 20px;
}

.legal-page {
  max-width: 920px;
  margin: 0 auto;
  padding: clamp(54px, 8vw, 100px) clamp(20px, 5vw, 64px);
}

.legal-page h1 {
  font-size: clamp(2.4rem, 5vw, 4.6rem);
}

.legal-page h2 {
  margin-top: 34px;
  font-size: 1.6rem;
}

.site-footer {
  display: flex;
  flex-direction: column;
  gap: 22px;
  padding: 40px clamp(18px, 4vw, 54px) 28px;
  border-top: 1px solid var(--muted);
  background: var(--primary);
  color: rgba(255, 255, 255, 0.8);
}

.site-footer .logo-strip {
  max-width: 420px;
  margin-top: 0;
}

/* Image audit correction: the footer now serves the light-variant logos (real alpha,
   read correctly on the navy footer background), so the .logo-strip img white-card
   treatment (background/border/padding) reads as an unwanted box. Scoped to the footer
   only — the base .logo-strip img rule stays as-is for safety in case another context
   ever needs the card treatment. */
.site-footer .logo-strip img {
  height: 56px;
  padding: 0;
  border: none;
  background: transparent;
  object-fit: contain;
}

.footer-tagline {
  margin: 0;
  max-width: 560px;
  color: rgba(255, 255, 255, 0.92);
  font-weight: 800;
  font-size: 1rem;
}

.footer-tagline .footer-note {
  display: block;
  margin-top: 4px;
  color: rgba(255, 255, 255, 0.8);
  font-size: 0.82rem;
  font-weight: 700;
}

.site-footer nav {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.site-footer nav a {
  color: rgba(255, 255, 255, 0.8);
  text-decoration: none;
  font-weight: 750;
}

.site-footer nav a:hover {
  color: #fff;
}

.footer-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.footer-actions a {
  color: rgba(255, 255, 255, 0.8);
  text-decoration: none;
  font-weight: 750;
}

.footer-actions a:hover {
  color: #fff;
}

.footer-contact {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 18px;
  color: rgba(255, 255, 255, 0.8);
  font-size: 0.9rem;
}

.footer-contact a {
  color: rgba(255, 255, 255, 0.92);
  text-decoration: none;
  font-weight: 750;
}

.footer-contact a:hover {
  color: #fff;
}

.footer-bottom {
  padding-top: 16px;
  border-top: 1px solid rgba(255, 255, 255, 0.18);
  color: rgba(255, 255, 255, 0.65);
  font-size: 0.82rem;
}

.footer-note {
  margin: 0;
  color: rgba(255, 255, 255, 0.8);
  font-size: 0.82rem;
  font-weight: 800;
}

.review-route-list {
  display: grid;
  gap: 10px;
}

.review-route-list a {
  display: grid;
  grid-template-columns: minmax(160px, 0.55fr) minmax(180px, 0.45fr) minmax(0, 1fr);
  gap: 14px;
  align-items: center;
  padding: 18px;
  border: 1px solid var(--muted);
  border-radius: var(--radius);
  background: var(--card);
  text-decoration: none;
}

.review-route-list span {
  color: var(--accent-strong);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size: 0.9rem;
}

.review-route-list em {
  color: var(--muted-fg);
  font-style: normal;
  line-height: 1.5;
}

/* Phase 4 — Portion Sahi / Workout / About / FAQ / Contact additions */

.portion-hero {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: 26px;
  min-height: clamp(480px, 56vw, 620px);
  padding: clamp(54px, 8vw, 108px) clamp(20px, 5vw, 64px);
  background:
    var(--scrim),
    url("assets/portion-sahi-food.jpg") center / cover no-repeat;
}

.portion-hero .eyebrow {
  color: var(--bg);
}

.portion-hero-copy {
  position: relative;
  z-index: 2;
  max-width: 36rem;
  color: white;
}

.portion-hero-copy h1 {
  color: white;
}

.portion-hero-copy .hero-lede {
  color: rgba(255, 255, 255, 0.92);
}

.condition-grid article img,
.case-study-grid article img,
.condition-grid article .image-placeholder,
.case-study-grid article .image-placeholder {
  display: block;
  width: 100%;
  height: 160px;
  margin-bottom: 14px;
  border-radius: var(--radius);
  object-fit: cover;
}

.stat-badge-row {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 22px;
}

.stat-badge {
  display: inline-flex;
  align-items: center;
  padding: 12px 20px;
  border-radius: 999px;
  border: 1px solid var(--muted);
  background: var(--card);
  box-shadow: var(--shadow);
  color: var(--primary);
  font-weight: 850;
}

.credential-line {
  max-width: 860px;
  margin: 0 0 18px;
  color: var(--muted-fg);
  font-size: 0.92rem;
  line-height: 1.65;
}

.credential-doc-link {
  color: var(--primary);
  font-weight: 800;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.credential-badge-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-top: 8px;
}

.credential-badge {
  display: flex;
  align-items: center;
  min-height: 64px;
  padding: 14px 18px;
  border-radius: var(--radius);
  border: 1px solid var(--muted);
  background: var(--card);
  color: var(--primary);
  font-weight: 800;
  line-height: 1.3;
}

.credential-disclosure {
  margin-top: 18px;
}

.credential-disclosure summary {
  cursor: pointer;
  list-style: none;
  color: var(--primary);
  font-weight: 850;
}

.credential-disclosure summary::-webkit-details-marker {
  display: none;
}

.credential-disclosure .process-steps {
  margin-top: 18px;
}

.note-card {
  max-width: 920px;
  margin: 0 auto;
  padding: clamp(24px, 4vw, 40px);
  border: 1px solid var(--muted);
  border-radius: var(--radius);
  background: var(--card);
  box-shadow: var(--shadow);
}

.note-card p {
  margin-bottom: 0;
}

.shot-list article,
.asset-request-card {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.shot-list article .primary-link {
  align-self: flex-start;
  margin-top: auto;
}

@media (max-width: 1100px) {
  .stage-grid,
  .condition-grid,
  .progress-timeline {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .stage-grid article:nth-child(2n) {
    border-right: 0;
  }

  .symptom-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .recovery-path,
  .support-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .contact-grid article {
    flex-basis: calc((100% - 14px) / 2);
  }

  .avoid-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .red-flag-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .readiness-check {
    grid-template-columns: 1fr;
  }

  .mini-price-list.is-not-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .warning-layout,
  .postpartum-safety-note {
    grid-template-columns: 1fr;
  }

  .split-section,
  .image-split,
  .stage-visual-panel,
  .symptom-visual-wrap {
    grid-template-columns: 1fr;
  }

  /* Mobile split stacking is per-section, not blanket: hero and portion-sahi-preview are
     result-first (locked strategy rule) — the H1/heading and WhatsApp START must lead the
     viewport, so their natural copy-first DOM order stands on mobile too, same as desktop.
     chatora-experiment and postpartum-guide lead with the figure instead, so their image
     stays pinned first even though postpartum-guide's DOM order (image LEFT on desktop)
     already puts it first; chatora-experiment's does too — this rule just makes both
     explicit/authoritative rather than incidental. */
  #chatora-experiment .feature-image,
  #postpartum-guide .feature-image {
    order: -1;
  }

  .mechanism-grid,
  .proof-grid,
  .about-grid,
  .founder-grid,
  .shot-list,
  .visual-card-grid,
  .offer-visual-grid,
  .proof-visual-grid,
  .asset-request-grid,
  .case-study-grid,
  .process-steps,
  .stats-band,
  .stepper-grid,
  .funnel-grid,
  .credential-badge-grid,
  .proof-visual-grid.is-quad {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .pricing-grid,
  .mns-grid {
    grid-template-columns: 1fr;
  }

  .plan-finder,
  .finder-controls {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 820px) {
  .site-header {
    position: sticky;
    align-items: center;
    flex-direction: row;
    gap: 10px;
    padding: 10px 16px;
  }

  .brand-logo {
    height: 46px;
    max-width: min(186px, 58vw);
  }

  .sub-nav {
    top: 67px;
  }

  .nav-toggle {
    display: inline-flex;
    margin-left: auto;
  }

  .top-nav {
    position: absolute;
    top: calc(100% + 1px);
    left: 0;
    right: 0;
    width: 100%;
    display: none;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    padding: 12px 16px 16px;
    overflow: visible;
    background: rgba(255, 244, 230, 0.98);
    border-bottom: 1px solid var(--muted);
    box-shadow: 0 18px 36px rgba(31, 31, 31, 0.1);
    backdrop-filter: blur(16px);
  }

  .top-nav.is-open {
    display: grid;
  }

  .top-nav .mobile-only-link {
    display: inline-flex;
  }

  .top-nav a {
    justify-content: center;
    min-height: 42px;
    padding: 9px 10px;
    font-size: 0.84rem;
    white-space: normal;
    text-align: center;
  }

  .hero {
    min-height: auto;
    display: block;
    background:
      linear-gradient(180deg, rgba(255, 244, 230, 0.96) 0%, rgba(255, 244, 230, 0.82) 56%, rgba(255, 244, 230, 0.12) 100%),
      linear-gradient(135deg, #0b3c5d 0%, #1a5276 100%);
  }

  .hero-copy {
    min-height: 720px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
  }

  .hero-image {
    display: none;
  }

  h1 {
    font-size: clamp(2.4rem, 13vw, 4.6rem);
  }

  .intro-band,
  .medical-disclaimer-panel,
  .body-map-layout {
    grid-template-columns: 1fr;
  }

  .segmented-control {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    border-radius: 22px;
  }

  .stage-button {
    border-radius: 18px;
  }

  .stage-grid,
  .progress-timeline,
  .recovery-path,
  .symptom-education,
  .guide-symptom-grid,
  .comparison-grid,
  .support-grid {
    grid-template-columns: 1fr;
  }

  .contact-grid article {
    flex-basis: 100%;
    min-height: auto;
  }

  .stage-grid article {
    min-height: auto;
    border-right: 0;
  }

  .symptom-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .avoid-grid,
  .red-flag-grid,
  .condition-grid {
    grid-template-columns: 1fr;
  }

  .feature-image img {
    min-height: 300px;
  }

  .feature-image .image-placeholder {
    min-height: 0;
  }

  .mini-price-list {
    grid-template-columns: 1fr;
  }

  .site-footer {
    align-items: flex-start;
    flex-direction: column;
  }

  .review-route-list a {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  /* WhatsApp float defect fix: the float is fixed at right/bottom: 18px, ~56px tall, so it
     persistently covers roughly the bottom 74px of the viewport. Add clearance below the
     footer's own content so nothing sits under it at rest when scrolled to page end. Float's
     own right/bottom offsets are unchanged. */
  .site-footer {
    padding-bottom: calc(28px + 72px);
  }

  .comparison-table-wrap {
    display: none;
  }

  .compare-accordion {
    display: grid;
  }

  .portion-hero {
    display: block;
    min-height: auto;
    padding-top: 200px;
    background:
      linear-gradient(180deg, rgba(255, 244, 230, 0.1) 0%, rgba(255, 244, 230, 0.94) 40%, var(--bg) 62%),
      url("assets/portion-sahi-food.jpg") center top / cover no-repeat;
  }

  .portion-hero-copy {
    max-width: none;
    color: var(--fg);
  }

  .portion-hero-copy h1 {
    color: var(--primary);
  }

  .portion-hero-copy .hero-lede {
    color: var(--muted-fg);
  }
}

@media (max-width: 520px) {
  .brand small {
    max-width: 210px;
  }

  .hero-copy,
  .intro-band,
  .section,
  .safety-note {
    padding-left: 16px;
    padding-right: 16px;
  }

  .hero-actions .button,
  .cta-row .button,
  .cta-row .callback-toggle,
  .cta-row .callback-toggle summary,
  .support-grid .button,
  .finder-result .button,
  .readiness-result .button,
  .help-banner .button,
  .primary-link {
    width: 100%;
  }

  .top-nav {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .symptom-grid {
    grid-template-columns: 1fr;
  }

  .body-map {
    min-height: 500px;
  }

  .map-dot span {
    min-width: 96px;
    max-width: 118px;
    white-space: normal;
  }

  .map-dot.neck span,
  .map-dot.breathing span,
  .map-dot.hips span {
    left: auto;
    right: 40px;
  }

  .map-info-grid {
    grid-template-columns: 1fr;
  }

  .mechanism-grid,
  .proof-grid,
  .about-grid,
  .founder-grid,
  .shot-list,
  .visual-card-grid,
  .offer-visual-grid,
  .proof-visual-grid,
  .asset-request-grid,
  .case-study-grid,
  .process-steps,
  .stats-band,
  .stepper-grid,
  .funnel-grid,
  .credential-badge-grid,
  .proof-visual-grid.is-quad {
    grid-template-columns: 1fr;
  }

  #proofGrid {
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .process-steps article {
    min-height: auto;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}

/* Lock 34 CREDENTIALS-VISIBLE: the /credentials PDF viewer — native browser rendering
   with a graceful open-in-tab fallback (no page-render tooling exists on the build host). */
.credentials-viewer object {
  width: 100%;
  height: 78vh;
  min-height: 480px;
  border: 1px solid var(--muted);
  border-radius: var(--radius);
  background: var(--card);
}

/* ============================================================================
   GENERATED-ASPIRATIONAL-MARKETING (lock 35, 27 Jul 2026)
   Hero aspirational figure + badge, What's Possible cards, How This Works
   frames, Real Proof teaser, and the sitewide header brand descriptor.
   No `order:` declarations here (lock 1's whitelist is untouched).
   ========================================================================= */

.site-header .brand {
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
}

.brand-descriptor {
  font-size: 0.72rem;
  line-height: 1.25;
  color: var(--muted-fg);
  letter-spacing: 0.01em;
}

@media (max-width: 480px) {
  .brand-descriptor {
    font-size: 0.66rem;
  }
}

/* Hero: media wrapper anchors the badge + inset; figcaption is the honesty line. */
.hero-media {
  position: relative;
}

.hero-figure .hero-media picture img {
  display: block;
  width: 100%;
  border-radius: var(--radius) var(--radius) 0 0;
}

.hero-badge {
  position: absolute;
  top: 14px;
  left: 14px;
  margin: 0;
  display: flex;
  flex-direction: column;
  background: var(--primary);
  color: #ffffff;
  padding: 10px 16px 12px;
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  line-height: 1.1;
}

.hero-badge-value {
  font-size: clamp(1.9rem, 5.5vw, 2.6rem);
  font-weight: 800;
  letter-spacing: -0.01em;
}

.hero-badge-detail {
  font-size: 0.85rem;
  font-weight: 600;
  color: #d9e6f2;
  margin-top: 2px;
}

/* Beats .feature-image img's width/height/min-height (img.hero-inset is more specific). */
.hero-figure img.hero-inset {
  position: absolute;
  right: 12px;
  bottom: 12px;
  width: clamp(84px, 24%, 140px);
  height: auto;
  min-height: 0;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  border-radius: var(--radius);
  border: 3px solid #ffffff;
  box-shadow: var(--shadow);
}

.hero-microline,
.section-microline {
  font-size: 0.85rem;
  color: var(--muted-fg);
  margin: 10px 0 0;
}

.hero-microline {
  text-align: left;
  padding: 10px 14px 12px;
  margin: 0;
}

/* What's Possible: image-led cards, badge is the hero of each card. */
.possible-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  margin-top: 24px;
}

.possible-card {
  background: var(--card);
  border: 1px solid var(--muted);
  border-radius: var(--radius);
  overflow: hidden;
  padding-bottom: 16px;
}

.possible-media img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 5;
  object-fit: cover;
}

.badge-chip {
  display: inline-block;
  background: var(--primary);
  color: #ffffff;
  font-size: clamp(1.3rem, 3.5vw, 1.7rem);
  font-weight: 800;
  padding: 6px 16px;
  border-radius: var(--radius);
  margin: 14px 16px 4px;
}

.possible-caption {
  margin: 2px 16px 0;
  color: var(--muted-fg);
  font-weight: 600;
}

.proof-bridge {
  margin: 22px 0 0;
  font-weight: 600;
}

.proof-bridge-link {
  color: var(--primary);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.proof-bridge-link:hover {
  color: var(--accent-strong);
}

/* How This Works: three pictures, almost no words. */
.hiw-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  margin-top: 24px;
}

.hiw-card {
  margin: 0;
}

.hiw-card img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: var(--radius);
}

.hiw-card figcaption {
  margin-top: 10px;
  font-weight: 700;
  color: var(--primary);
}

/* Final CTA (Mayur, 27 Jul 2026): the navy primary button disappeared into the navy
   scrim-dark backdrop — use the site's established CTA orange (same white-on-accent
   pattern as .top-nav .nav-cta) so it reads instantly. */
#final-cta .button-primary,
#mid-cta .button-primary {
  background: var(--accent);
  font-weight: 800;
  box-shadow: 0 12px 30px rgba(232, 93, 4, 0.35);
}

#final-cta .button-primary:hover,
#mid-cta .button-primary:hover {
  background: var(--accent-strong);
}

/* Real Proof teaser: numbers only, pill row. */
.proof-stat-row {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 20px;
}

.proof-stat {
  background: var(--secondary);
  border: 1px solid var(--muted);
  border-radius: 999px;
  padding: 10px 18px;
  font-weight: 700;
  color: var(--primary);
}

@media (max-width: 900px) {
  .possible-grid,
  .hiw-grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  /* Portrait crop on mobile too — the card images tell full-figure stories that a
     landscape crop would behead. */
  .possible-media img {
    aspect-ratio: 4 / 5;
  }
}

/* ============================================================================
   Light pass (27 Jul 2026): price note, portion subtitle, trust founder cue,
   proof-teaser thumbnails, mid-page CTA orange (shares the final-cta rule).
   ========================================================================= */

.hero-price-note {
  margin: 10px 0 0;
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--muted-fg);
}

.section-subtitle {
  margin: 4px 0 0;
  color: var(--muted-fg);
  font-weight: 600;
}

.trust-bar-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 18px 36px;
}

.trust-founder {
  display: flex;
  align-items: center;
  gap: 12px;
  background: var(--card);
  border: 1px solid var(--muted);
  border-radius: 999px;
  padding: 8px 20px 8px 8px;
  box-shadow: var(--shadow);
}

.trust-founder-photo {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  object-fit: cover;
  object-position: 50% 26%;
}

.trust-founder-copy {
  display: flex;
  flex-direction: column;
  line-height: 1.3;
}

.trust-founder-copy strong {
  color: var(--primary);
  font-size: 0.95rem;
}

.trust-founder-line {
  font-size: 0.8rem;
  color: var(--muted-fg);
}

.proof-thumb-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin-top: 20px;
  max-width: 1200px;
}

.proof-thumb {
  display: block;
  text-decoration: none;
}

.proof-thumb img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1000 / 563;
  object-fit: contain;
  background: var(--secondary);
  border-radius: var(--radius);
  border: 1px solid var(--muted);
}

.proof-thumb-name {
  display: block;
  margin-top: 6px;
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--muted-fg);
}

@media (max-width: 640px) {
  .proof-thumb-row {
    display: flex;
    max-width: none;
    margin-right: -16px;
    padding: 0 16px 10px 0;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: thin;
  }

  .proof-thumb {
    flex: 0 0 min(78vw, 300px);
    scroll-snap-align: start;
  }
}

/* ---------------------------------------------------------------------------
   Beyond Mummy Tummy microsite (lock 37, BMT-FOUNDING-SALES-PAGE, 29 Jul 2026).
   Every visual override is scoped to .bmt-page / .bmt- / #bmt- so the sitewide
   Chatora Coach design remains unchanged. Offer values live in config/bmt.json. */

body.bmt-page {
  --bmt-black: #0c0e14;
  --bmt-charcoal: #14171f;
  --bmt-card: #1c2029;
  --bmt-border: #2a2f3b;
  --bmt-off-white: #f5f1ee;
  --bmt-muted: #a8aebc;
  --bmt-rose: #e85a8a;
  --bmt-rose-deep: #c43f6e;
  --bmt-coral: #f08a6b;
  --bmt-rose-tint: #2a1620;
  --bmt-teal: #20b8a6;
  --bmt-alert: #ff6b6b;
  --bmt-blue-quiet: #4a63b0;
  color: var(--bmt-off-white);
  background: var(--bmt-black);
  color-scheme: dark;
}

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

.bmt-page :focus-visible {
  outline-color: var(--bmt-rose);
}

.bmt-page main {
  background: var(--bmt-black);
}

.bmt-page h1,
.bmt-page h2,
.bmt-page h3 {
  color: var(--bmt-off-white);
  letter-spacing: -0.025em;
}

.bmt-page p,
.bmt-page li {
  color: var(--bmt-muted);
}

.bmt-page .eyebrow {
  color: var(--bmt-rose);
}

.bmt-page .button-primary {
  color: var(--bmt-black);
  background: var(--bmt-rose);
  box-shadow: 0 14px 36px rgba(232, 90, 138, 0.18);
}

.bmt-page .button-primary:hover {
  color: var(--bmt-off-white);
  background: var(--bmt-rose-deep);
}

.bmt-page .button-secondary {
  color: var(--bmt-off-white);
  background: transparent;
  border-color: var(--bmt-border);
}

.bmt-page .button-secondary:hover {
  border-color: var(--bmt-rose);
}

.bmt-header {
  position: sticky;
  top: 0;
  z-index: 20;
  min-height: 86px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: clamp(16px, 3vw, 36px);
  padding: 10px clamp(18px, 4vw, 54px);
  background: rgba(12, 14, 20, 0.96);
  border-bottom: 1px solid var(--bmt-border);
  backdrop-filter: blur(18px);
}

.bmt-brand {
  display: inline-grid;
  grid-template-columns: auto 1px minmax(0, auto);
  align-items: center;
  gap: 12px;
  color: var(--bmt-off-white);
  text-decoration: none;
}

.bmt-brand img {
  width: clamp(92px, 7.4vw, 112px);
  height: auto;
  padding: 0;
  border: 0;
  background: transparent;
  filter: none;
}

.bmt-brand > span {
  width: 1px;
  height: 30px;
  background: var(--bmt-border);
}

.bmt-brand strong {
  max-width: 190px;
  color: var(--bmt-off-white);
  font-size: clamp(0.98rem, 1.35vw, 1.18rem);
  font-weight: 850;
  line-height: 1.08;
  letter-spacing: -0.025em;
  text-shadow: 0 0 18px rgba(232, 90, 138, 0.3);
}

.bmt-nav {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: clamp(4px, 1vw, 12px);
}

.bmt-nav a {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  padding: 8px 9px;
  border-radius: 999px;
  color: var(--bmt-muted);
  font-size: 0.82rem;
  font-weight: 750;
  text-decoration: none;
  white-space: nowrap;
}

.bmt-nav a:hover {
  color: var(--bmt-off-white);
  background: rgba(255, 255, 255, 0.06);
}

.bmt-nav .bmt-visit-link {
  color: var(--bmt-off-white);
  font-size: 0.76rem;
  font-weight: 600;
  text-decoration: underline;
  text-decoration-color: var(--bmt-blue-quiet);
  text-decoration-thickness: 2px;
  text-underline-offset: 4px;
}

.bmt-header-cta {
  min-height: 44px;
  padding: 11px 16px;
  font-size: 0.78rem;
  white-space: nowrap;
}

.bmt-page .page-hero.bmt-hero {
  position: relative;
  isolation: isolate;
  min-height: calc(100vh - 86px);
  grid-template-columns: minmax(0, 0.82fr) minmax(480px, 1.18fr);
  gap: clamp(34px, 5vw, 78px);
  padding: clamp(56px, 7vw, 96px) clamp(20px, 5vw, 72px);
  overflow: hidden;
  background:
    radial-gradient(circle at 18% 26%, rgba(232, 90, 138, 0.1), transparent 34%),
    var(--bmt-black);
  border-bottom: 1px solid var(--bmt-border);
}

.bmt-page .page-hero.bmt-hero::before,
.bmt-page .page-hero.bmt-hero::after {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 0;
  pointer-events: none;
}

.bmt-page .page-hero.bmt-hero::before {
  background: url("assets/bmt/bmt-hero-mother-baby-bg.webp") 36% center / cover no-repeat;
  opacity: 0.36;
  -webkit-mask-image: linear-gradient(90deg, #000 0%, #000 44%, rgba(0, 0, 0, 0.55) 58%, transparent 76%);
  mask-image: linear-gradient(90deg, #000 0%, #000 44%, rgba(0, 0, 0, 0.55) 58%, transparent 76%);
}

.bmt-page .page-hero.bmt-hero::after {
  background: linear-gradient(90deg, rgba(12, 14, 20, 0.76) 0%, rgba(12, 14, 20, 0.74) 42%, rgba(12, 14, 20, 0.5) 66%, rgba(12, 14, 20, 0.84) 100%);
}

.bmt-hero > div,
.bmt-hero > figure {
  position: relative;
  z-index: 1;
}

.bmt-hero > div {
  max-width: 650px;
}

.bmt-hero h1 {
  max-width: 700px;
  font-size: clamp(2.55rem, 4.35vw, 4.7rem);
  line-height: 0.98;
}

.bmt-hero h1 span {
  color: var(--bmt-rose);
}

.bmt-hero .hero-lede {
  color: var(--bmt-off-white);
  font-size: clamp(1.05rem, 1.45vw, 1.25rem);
  line-height: 1.65;
}

.bmt-schedule {
  margin: 20px 0 0;
}

.bmt-schedule strong {
  color: var(--bmt-off-white);
}

.bmt-reassurance {
  margin: 8px 0 0;
  color: var(--bmt-muted);
}

.bmt-page .bmt-offer-line {
  margin: 16px 0 0;
  color: var(--bmt-coral);
  font-weight: 800;
  line-height: 1.5;
}

.bmt-hero .hero-actions {
  margin-top: 28px;
}

.bmt-hero .microcopy {
  color: var(--bmt-muted);
}

.bmt-page .feature-image.bmt-hero-visual {
  overflow: visible;
  border: 0;
  border-radius: 16px;
  background: transparent;
  box-shadow: none;
}

/* Lock 44 hero crop: pure CSS, the image file is untouched. The picture box
   holds an aspect ratio BELOW the source's 3:2, so object-fit: cover fills the
   height with zero vertical crop at every viewport — heads and shoes can never
   be cut; only the wide empty side margins are cropped away. The shadow moves
   here from the figure so it hugs the narrowed visual. */
.bmt-hero-visual picture {
  display: block;
  width: 78%;
  margin-inline: auto;
  overflow: hidden;
  border: 1px solid var(--bmt-border);
  border-radius: 16px;
  background: var(--bmt-charcoal);
  aspect-ratio: 1040 / 950;
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.42);
}

.bmt-page .bmt-hero-visual img {
  width: 100%;
  height: 100%;
  min-height: 0;
  object-fit: cover;
  object-position: 50% 50%;
}

.bmt-hero-visual figcaption {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  width: 78%;
  margin-top: 12px;
  margin-inline: auto;
  color: var(--bmt-muted);
  font-size: 0.74rem;
  line-height: 1.45;
}

.bmt-hero-visual figcaption a {
  flex: 0 0 auto;
  color: var(--bmt-off-white);
  font-weight: 800;
  text-decoration-color: var(--bmt-blue-quiet);
  text-underline-offset: 3px;
}

.bmt-page .section,
.bmt-page .safety-note {
  border-bottom: 1px solid var(--bmt-border);
}

.bmt-page .section > *,
.bmt-page .safety-note > * {
  max-width: 1180px;
  margin-right: auto;
  margin-left: auto;
}

.bmt-page .muted-section {
  background: var(--bmt-charcoal);
}

.bmt-page #bmt-eligibility,
.bmt-page #bmt-worries,
.bmt-page #bmt-trainer,
.bmt-page #bmt-join,
.bmt-page #bmt-faq {
  background: var(--bmt-charcoal);
}

.bmt-page #bmt-eligibility {
  background:
    linear-gradient(90deg, rgba(20, 23, 31, 0.99) 0%, rgba(20, 23, 31, 0.95) 52%, rgba(20, 23, 31, 0.78) 100%),
    url("assets/bmt/bmt-activity-join-from-home.webp") center 40% / cover no-repeat;
}

.bmt-page #bmt-outcomes,
.bmt-page #bmt-included,
.bmt-page #bmt-activities,
.bmt-page #bmt-pricing {
  background: var(--bmt-black);
}

.bmt-page .section-heading {
  max-width: 780px;
}

.bmt-page .section-heading > p:last-child {
  color: var(--bmt-muted);
}

.bmt-page #bmt-included,
.bmt-page #bmt-activities,
.bmt-page #bmt-trainer,
.bmt-page #bmt-pricing {
  scroll-margin-top: 86px;
}

.bmt-check-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-top: 26px;
  padding: 0;
  list-style: none;
}

.bmt-check-list li {
  position: relative;
  padding: 18px 20px 18px 50px;
  border: 1px solid var(--bmt-border);
  border-radius: 12px;
  color: var(--bmt-off-white);
  background: var(--bmt-card);
  font-weight: 650;
}

.bmt-check-list li::before {
  content: "\2713";
  position: absolute;
  left: 19px;
  color: var(--bmt-teal);
  font-weight: 900;
}

.bmt-context-link {
  display: inline-flex;
  flex-direction: column;
  gap: 2px;
  margin-top: 24px;
  color: var(--bmt-off-white);
  font-weight: 750;
  line-height: 1.45;
  text-decoration-color: var(--bmt-blue-quiet);
  text-decoration-thickness: 2px;
  text-underline-offset: 4px;
}

.bmt-context-link span {
  color: var(--bmt-muted);
  font-size: 0.84rem;
  font-weight: 500;
}

.bmt-page .mini-price-list div {
  border-color: var(--bmt-border);
  border-radius: 12px;
  background: var(--bmt-card);
}

.bmt-page .mini-price-list strong {
  color: var(--bmt-off-white);
}

.bmt-page .mini-price-list span {
  color: var(--bmt-muted);
  line-height: 1.55;
}

.bmt-page #bmt-outcomes .section-heading h2 {
  max-width: 680px;
  font-size: clamp(1.85rem, 3.2vw, 3rem);
  line-height: 1.08;
}

.bmt-outcome-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: clamp(34px, 7vw, 90px);
  margin: 30px 0 0;
  padding: 0;
  border-top: 1px solid var(--bmt-border);
  list-style: none;
}

.bmt-outcome-list li {
  min-height: 64px;
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  padding: 13px 0;
  border-bottom: 1px solid var(--bmt-border);
}

.bmt-outcome-list span {
  color: var(--bmt-rose);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.08em;
}

.bmt-outcome-list strong {
  color: var(--bmt-off-white);
  font-size: clamp(0.94rem, 1.35vw, 1.08rem);
  font-weight: 620;
  line-height: 1.42;
}

.bmt-results-band {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 34px;
  padding: clamp(36px, 5vw, 62px) clamp(20px, 5vw, 64px);
  background:
    linear-gradient(90deg, rgba(12, 14, 20, 0.98) 0%, rgba(12, 14, 20, 0.9) 48%, rgba(42, 22, 32, 0.38) 72%, rgba(12, 14, 20, 0.48) 100%),
    url("assets/bmt/bmt-results-movement-bg.webp") 64% 46% / cover no-repeat;
  border-top: 1px solid var(--bmt-border);
  border-bottom: 1px solid var(--bmt-border);
}

.bmt-results-band > div {
  max-width: 720px;
}

.bmt-results-band h2 {
  margin: 4px 0 8px;
  font-size: clamp(1.7rem, 3vw, 2.7rem);
}

.bmt-results-band p {
  margin-bottom: 0;
}

.bmt-results-band .bmt-results-disclosure {
  margin-top: 12px;
  color: var(--bmt-muted);
  font-size: 0.72rem;
  line-height: 1.45;
}

.bmt-included-layout {
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(440px, 1.08fr);
  gap: clamp(24px, 4vw, 46px);
  align-items: start;
  margin-top: 28px;
}

.bmt-inclusion-grid {
  grid-template-columns: 1fr;
  gap: 10px;
  margin-top: 0;
}

.bmt-page .bmt-inclusion-grid div {
  min-height: 0;
  padding: 14px 16px;
}

.bmt-page .bmt-inclusion-grid span {
  margin-top: 3px;
  font-size: 0.86rem;
}

.bmt-included-list {
  grid-template-columns: 1fr;
  gap: 10px;
  margin-top: 14px;
}

.bmt-page .bmt-included-list li {
  padding: 12px 16px 12px 46px;
  font-size: 0.95rem;
  font-weight: 600;
}

.bmt-page .bmt-included-list li::before {
  left: 17px;
}

.bmt-included-actions {
  margin-top: 20px;
}

.bmt-included-actions .button {
  min-height: 42px;
}

.bmt-class-preview {
  min-width: 0;
  padding: clamp(18px, 2.4vw, 28px);
  border: 1px solid var(--bmt-border);
  border-radius: 16px;
  background: var(--bmt-charcoal);
}

.bmt-class-preview-heading h3 {
  margin: 4px 0 8px;
  font-size: clamp(1.45rem, 2.2vw, 2rem);
}

.bmt-class-preview-heading p:last-child {
  margin-bottom: 0;
  font-size: 0.9rem;
  line-height: 1.55;
}

.bmt-session-detail {
  margin-top: 18px;
  border: 1px solid var(--bmt-border);
  border-radius: 12px;
  background: var(--bmt-card);
  overflow: hidden;
}

.bmt-session-detail summary {
  cursor: pointer;
  padding: 18px 20px;
  color: var(--bmt-off-white);
  font-weight: 850;
}

.bmt-session-detail[open] {
  border-color: var(--bmt-rose);
}

.bmt-session-detail summary::marker {
  color: var(--bmt-rose);
}

.bmt-session-detail p {
  margin: 0;
  padding: 0 20px 16px;
  line-height: 1.65;
}

.bmt-worry-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 24px 0 0;
  padding: 0;
  list-style: none;
}

.bmt-worry-list li {
  position: relative;
  min-height: 0;
  padding: 14px 16px 14px 43px;
  border: 1px solid var(--bmt-border);
  border-radius: 11px;
  background: var(--bmt-card);
}

.bmt-worry-list li::before {
  content: "\2192";
  position: absolute;
  top: 14px;
  left: 16px;
  color: var(--bmt-rose);
  font-weight: 900;
}

.bmt-worry-list strong,
.bmt-worry-list span {
  display: block;
}

.bmt-worry-list strong {
  color: var(--bmt-off-white);
  font-size: 0.94rem;
  line-height: 1.35;
}

.bmt-worry-list span {
  margin-top: 4px;
  color: var(--bmt-muted);
  font-size: 0.84rem;
  line-height: 1.45;
}

.bmt-activity-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 18px;
}

.bmt-activity-card {
  min-width: 0;
  margin: 0;
  overflow: hidden;
  border: 1px solid var(--bmt-border);
  border-radius: 14px;
  background: var(--bmt-card);
}

.bmt-activity-card picture {
  display: block;
  height: clamp(108px, 10vw, 142px);
  overflow: hidden;
  background: var(--bmt-charcoal);
}

.bmt-activity-card img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.bmt-activity-card:nth-child(1) img {
  object-position: 42% center;
}

.bmt-activity-card:nth-child(2) img {
  object-position: 52% center;
}

.bmt-activity-card:nth-child(3) img {
  object-position: 48% center;
}

.bmt-activity-card:nth-child(4) img {
  object-position: 62% center;
}

.bmt-activity-card:nth-child(5) img {
  object-position: 43% center;
}

.bmt-activity-card:nth-child(6) img {
  object-position: 44% center;
}

.bmt-activity-card figcaption {
  min-height: 42px;
  display: flex;
  align-items: center;
  padding: 9px 11px 10px;
  color: var(--bmt-off-white);
  font-size: 0.78rem;
  font-weight: 800;
  line-height: 1.25;
}

.bmt-visual-disclosure {
  margin: 15px 0 0;
  color: var(--bmt-muted);
  font-size: 0.76rem;
  line-height: 1.5;
}

.bmt-trainer-card {
  position: relative;
  isolation: isolate;
  min-height: clamp(460px, 43vw, 560px);
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(380px, 0.82fr);
  align-items: center;
  margin-top: 28px;
  padding: clamp(28px, 4vw, 54px);
  overflow: hidden;
  border: 1px solid var(--bmt-border);
  border-radius: 16px;
  background: var(--bmt-card);
}

.bmt-trainer-card::after {
  content: "";
  position: absolute;
  z-index: 1;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(12, 14, 20, 0.08) 0%, rgba(12, 14, 20, 0.28) 38%, rgba(12, 14, 20, 0.9) 68%, rgba(12, 14, 20, 0.98) 100%),
    linear-gradient(0deg, rgba(12, 14, 20, 0.46), transparent 48%);
  pointer-events: none;
}

.bmt-trainer-backdrop {
  position: absolute;
  z-index: 0;
  inset: 0;
}

.bmt-trainer-backdrop img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.bmt-trainer-content {
  position: relative;
  z-index: 2;
  grid-column: 2;
  padding: clamp(20px, 3vw, 32px);
  border: 1px solid rgba(196, 63, 110, 0.42);
  border-radius: 14px;
  background: rgba(28, 32, 41, 0.76);
  box-shadow: 0 20px 48px rgba(0, 0, 0, 0.24);
  backdrop-filter: blur(10px);
}

.bmt-trainer-identity {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 18px;
}

.bmt-trainer-portrait {
  width: 96px;
  height: 96px;
  flex: 0 0 96px;
  border: 2px solid var(--bmt-off-white);
  border-radius: 50%;
  object-fit: cover;
  object-position: 50% 18%;
  box-shadow: 0 0 0 5px rgba(232, 90, 138, 0.18);
}

.bmt-trainer-card h3 {
  margin: 0 0 6px;
  font-size: clamp(1.55rem, 2.4vw, 2.35rem);
}

.bmt-credentials {
  margin: 0;
  color: var(--bmt-muted);
  font-size: 0.84rem;
  font-weight: 750;
  line-height: 1.45;
  text-wrap: balance;
}

.bmt-trainer-content > p {
  margin: 0 0 12px;
  color: var(--bmt-off-white);
  line-height: 1.6;
}

/* Plain trainer card (lock 43): no photographic backdrop while the live-class
   image is pending — the double-class selector outranks every single-class
   .bmt-trainer-card rule, including the mobile backdrop paddings. */
.bmt-trainer-card.bmt-trainer-card-plain {
  min-height: 0;
  grid-template-columns: minmax(0, 1fr);
  align-items: start;
  padding: clamp(20px, 3vw, 34px);
}

.bmt-trainer-card.bmt-trainer-card-plain::after {
  content: none;
}

.bmt-trainer-card.bmt-trainer-card-plain .bmt-trainer-content {
  grid-column: 1;
  max-width: 860px;
}

.bmt-trainer-content .bmt-designer-credit {
  margin: 16px 0 0;
  color: var(--bmt-muted);
  font-size: 0.88rem;
  line-height: 1.55;
}

.bmt-trainer-content .bmt-trainer-disclosure {
  margin: 18px 0 0;
  color: var(--bmt-muted);
  font-size: 0.74rem;
  line-height: 1.45;
}

.bmt-pricing .pricing-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  max-width: 820px;
  margin-inline: auto;
}

.bmt-page .bmt-pricing .price-card {
  border-color: var(--bmt-border);
  border-radius: 14px;
  background: var(--bmt-card);
}

.bmt-page .bmt-pricing .price-card.is-featured {
  color: var(--bmt-off-white);
  background: var(--bmt-card);
  border-color: var(--bmt-rose);
  box-shadow:
    inset 0 4px 0 var(--bmt-rose),
    0 24px 60px rgba(0, 0, 0, 0.28);
}

.bmt-pricing .price-card h3 {
  margin: 0;
  color: var(--bmt-off-white);
  font-size: clamp(1.35rem, 1.8vw, 1.8rem);
}

.bmt-page .bmt-pricing .price-card p,
.bmt-page .bmt-pricing .price-card.is-featured p,
.bmt-page .bmt-pricing .price-card.is-featured .plan-label {
  color: var(--bmt-muted);
}

.bmt-page .bmt-pricing .price-card .button {
  color: var(--bmt-black);
  background: var(--bmt-rose);
}

.bmt-price-row {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 10px;
  margin: 0;
}

.bmt-price-official,
.bmt-page .price-card.is-featured .bmt-price-official {
  color: var(--bmt-muted);
  font-weight: 600;
}

.bmt-price-row .price {
  display: inline-block;
  color: var(--bmt-rose);
  font-size: clamp(1.9rem, 3vw, 2.6rem);
}

/* Lock 44 batch-time interest link: quiet, never a primary CTA. The anchors
   ship hidden with no href; script.js reveals them only when config carries
   batchTimeInterestUrl. The [hidden] rule must stay — the author display
   value would otherwise override the hidden attribute's display: none. */
.bmt-page .bmt-batch-time-link {
  display: inline-block;
  margin-top: 8px;
  color: var(--bmt-teal);
  font-size: 0.84rem;
  font-weight: 650;
  text-decoration: underline;
  text-decoration-color: var(--bmt-teal);
  text-underline-offset: 3px;
}

.bmt-page .bmt-batch-time-link[hidden] {
  display: none;
}

.bmt-page .bmt-inclusion-grid .bmt-batch-time-link {
  font-size: 0.8rem;
}

/* Lock 44 certifications link: quiet text route to /credentials (lock 34),
   deliberately subordinate to the JOIN THE BMT BATCH funnel CTAs. */
.bmt-trainer-content .bmt-cert-link-row {
  margin: 10px 0 0;
}

.bmt-page .bmt-cert-link {
  color: var(--bmt-muted);
  font-size: 0.82rem;
  font-weight: 650;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.bmt-page .bmt-offer-note {
  margin-top: 26px;
  color: var(--bmt-coral);
  font-weight: 800;
  text-align: center;
}

.bmt-page .process-section {
  background: var(--bmt-charcoal);
}

.bmt-page .process-steps {
  position: relative;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
  padding: 0;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.bmt-page .process-steps::before {
  content: "";
  position: absolute;
  top: 21px;
  right: 9%;
  left: 9%;
  height: 1px;
  background: var(--bmt-border);
}

.bmt-page .process-steps article {
  position: relative;
  min-height: 0;
  padding: 0 clamp(14px, 2.2vw, 28px);
  background: transparent;
  text-align: center;
}

.bmt-page .process-steps span {
  position: relative;
  z-index: 1;
  width: 42px;
  height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0 0 14px;
  border: 1px solid var(--bmt-rose-deep);
  border-radius: 50%;
  color: var(--bmt-rose);
  background: var(--bmt-charcoal);
  font-size: 0.76rem;
}

.bmt-page .process-steps h3 {
  max-width: none;
  margin: 0 0 6px;
  color: var(--bmt-off-white);
  font-size: clamp(0.98rem, 1.35vw, 1.12rem);
  line-height: 1.3;
}

.bmt-page .process-steps p {
  margin: 0;
  color: var(--bmt-muted);
  font-size: 0.82rem;
  line-height: 1.52;
}

.bmt-page .safety-note {
  padding-top: clamp(28px, 4vw, 42px);
  padding-bottom: clamp(28px, 4vw, 42px);
  background: var(--bmt-black);
}

.bmt-page .safety-note h2 {
  margin: 0 0 12px;
  color: var(--bmt-off-white);
  font-size: clamp(1.25rem, 2.1vw, 1.7rem);
}

.bmt-page .safety-note p {
  margin: 7px auto 0;
  color: var(--bmt-muted);
  font-size: 0.84rem;
  line-height: 1.55;
}

.bmt-page .safety-note strong {
  color: var(--bmt-muted);
  font-weight: 650;
}

.bmt-page .bmt-pricing > .microcopy {
  color: var(--bmt-alert);
}

.bmt-plan-payment-note {
  max-width: 780px;
  margin: 18px 0 26px;
  padding: 13px 16px;
  color: var(--bmt-off-white);
  border-left: 3px solid var(--bmt-rose);
  background: rgba(232, 90, 138, 0.07);
  font-size: 0.9rem;
  line-height: 1.55;
}

.bmt-page .final-cta {
  display: grid;
  grid-template-columns: minmax(0, 0.88fr) minmax(430px, 1.02fr);
  align-items: center;
  gap: clamp(30px, 5vw, 68px);
  padding-top: clamp(44px, 6vw, 76px);
  padding-bottom: clamp(44px, 6vw, 76px);
  background: var(--bmt-rose-tint);
  border-top: 1px solid var(--bmt-rose-deep);
  border-bottom: 1px solid var(--bmt-rose-deep);
}

.bmt-page .bmt-final-cta-copy p {
  color: var(--bmt-muted);
}

.bmt-page .bmt-final-cta-copy .bmt-schedule strong {
  color: var(--bmt-coral);
}

.bmt-cta-path {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin: 22px 0;
  padding: 0;
  list-style: none;
}

.bmt-cta-path li {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  color: var(--bmt-off-white);
  font-size: 0.78rem;
  font-weight: 760;
  line-height: 1.3;
}

.bmt-cta-path span {
  flex: 0 0 25px;
  display: grid;
  width: 25px;
  height: 25px;
  place-items: center;
  color: var(--bmt-off-white);
  border: 1px solid var(--bmt-rose);
  border-radius: 50%;
  font-size: 0.68rem;
}

.bmt-final-cta-copy h2 {
  max-width: 720px;
  font-size: clamp(2rem, 3.8vw, 3.7rem);
  line-height: 1.02;
}

.bmt-final-cta-visual {
  margin: 0;
  overflow: hidden;
  border: 1px solid var(--bmt-border);
  border-radius: 16px;
  background: var(--bmt-card);
  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.32);
}

.bmt-final-cta-visual picture,
.bmt-final-cta-visual img {
  display: block;
  width: 100%;
}

.bmt-final-cta-visual img {
  height: auto;
  aspect-ratio: 3 / 2;
  object-fit: cover;
  object-position: center;
}

.bmt-final-cta-visual figcaption {
  padding: 9px 12px;
  color: var(--bmt-muted);
  background: var(--bmt-card);
  font-size: 0.7rem;
  line-height: 1.4;
}

.bmt-page .faq-list details {
  width: 100%;
  max-width: 900px;
  margin-right: auto;
  margin-left: auto;
  border-color: var(--bmt-border);
  border-radius: 12px;
  background: var(--bmt-card);
}

.bmt-page .faq-list summary {
  color: var(--bmt-off-white);
}

.bmt-page .faq-list details p {
  color: var(--bmt-muted);
  line-height: 1.65;
}

.bmt-page .faq-list details[open] {
  border-color: var(--bmt-rose);
}

.bmt-page .faq-list summary::marker {
  color: var(--bmt-rose);
}

.bmt-footer {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 28px;
  padding: 26px clamp(20px, 5vw, 64px);
  color: var(--bmt-muted);
  background: var(--bmt-black);
  border-top: 1px solid var(--bmt-border);
}

.bmt-footer-brand {
  display: flex;
  align-items: center;
  gap: 14px;
}

.bmt-footer-brand img {
  width: 112px;
  height: auto;
}

.bmt-footer-brand strong {
  color: var(--bmt-off-white);
  font-size: 0.85rem;
}

.bmt-footer nav {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 8px 18px;
}

.bmt-footer nav a {
  color: var(--bmt-off-white);
  font-size: 0.78rem;
  text-decoration-color: var(--bmt-blue-quiet);
  text-underline-offset: 3px;
}

.bmt-footer nav a:hover {
  color: var(--bmt-off-white);
}

.bmt-footer > p {
  margin: 0;
  color: var(--bmt-muted);
  font-size: 0.72rem;
}

.bmt-sticky-cta {
  display: none;
}

@media (max-width: 1120px) {
  .bmt-header {
    gap: 14px;
  }

  .bmt-brand strong {
    max-width: 160px;
    font-size: 0.9rem;
  }

  .bmt-brand > span {
    height: 38px;
  }

  .bmt-pricing .pricing-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .bmt-page .page-hero.bmt-hero {
    grid-template-columns: minmax(0, 0.8fr) minmax(430px, 1.2fr);
  }

  .bmt-page .page-hero.bmt-hero::before {
    background-image: url("assets/bmt/bmt-hero-mother-baby-bg-1200.webp");
  }
}

@media (max-width: 900px) {
  .bmt-header {
    grid-template-columns: minmax(0, 1fr) auto;
    padding-bottom: 7px;
  }

  .bmt-brand img {
    width: 92px;
    height: auto;
  }

  .bmt-nav {
    grid-column: 1 / -1;
    grid-row: 2;
    justify-content: space-between;
    gap: 2px;
    border-top: 1px solid var(--bmt-border);
  }

  .bmt-nav a {
    min-height: 36px;
    padding: 7px 5px 3px;
    font-size: 0.75rem;
  }

  .bmt-nav .bmt-visit-link {
    font-size: 0.7rem;
  }

  .bmt-header-cta {
    padding: 10px 13px;
  }

  .bmt-page #bmt-included,
  .bmt-page #bmt-activities,
  .bmt-page #bmt-trainer,
  .bmt-page #bmt-pricing {
    scroll-margin-top: 116px;
  }

  .bmt-page .page-hero.bmt-hero {
    min-height: 0;
    grid-template-columns: 1fr;
    padding-top: 48px;
  }

  .bmt-hero > div {
    max-width: 760px;
  }

  .bmt-results-band {
    align-items: flex-start;
    flex-direction: column;
    background-image:
      linear-gradient(90deg, rgba(12, 14, 20, 0.98) 0%, rgba(12, 14, 20, 0.9) 52%, rgba(42, 22, 32, 0.42) 78%, rgba(12, 14, 20, 0.56) 100%),
      url("assets/bmt/bmt-results-movement-bg-960.webp");
  }

  .bmt-inclusion-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .bmt-included-layout {
    grid-template-columns: 1fr;
  }

  .bmt-activity-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .bmt-activity-card picture {
    height: clamp(130px, 22vw, 170px);
  }

  .bmt-trainer-card {
    grid-template-columns: 1fr;
    min-height: 0;
    align-items: end;
    padding: clamp(300px, 54vw, 420px) 18px 18px;
  }

  .bmt-trainer-card::after {
    background:
      linear-gradient(0deg, rgba(12, 14, 20, 0.98) 0%, rgba(12, 14, 20, 0.9) 46%, rgba(12, 14, 20, 0.12) 78%),
      linear-gradient(90deg, rgba(12, 14, 20, 0.16), rgba(12, 14, 20, 0.42));
  }

  .bmt-trainer-backdrop img {
    object-position: center top;
  }

  .bmt-trainer-content {
    grid-column: 1;
  }

  .bmt-page .process-steps {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .bmt-page .process-steps::before {
    top: 21px;
    right: auto;
    bottom: 21px;
    left: 21px;
    width: 1px;
    height: auto;
  }

  .bmt-page .process-steps article {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    column-gap: 14px;
    padding: 0;
    text-align: left;
  }

  .bmt-page .process-steps span {
    grid-row: 1 / span 2;
    margin: 0;
  }

  .bmt-page .process-steps h3,
  .bmt-page .process-steps p {
    grid-column: 2;
  }

  .bmt-page .final-cta {
    grid-template-columns: 1fr;
  }

  .bmt-final-cta-visual {
    width: 100%;
    max-width: 760px;
  }

  .bmt-footer {
    grid-template-columns: 1fr;
    justify-items: center;
    text-align: center;
    padding-bottom: calc(28px + 76px + env(safe-area-inset-bottom));
  }

  .bmt-sticky-cta {
    display: block;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 4;
    padding: 9px 12px calc(9px + env(safe-area-inset-bottom));
    background: rgba(12, 14, 20, 0.96);
    border-top: 1px solid var(--bmt-border);
    box-shadow: 0 -16px 38px rgba(0, 0, 0, 0.36);
    backdrop-filter: blur(16px);
  }

  .bmt-sticky-cta .button {
    display: flex;
    width: 100%;
    min-height: 46px;
    justify-content: center;
    white-space: nowrap;
  }

  body.bmt-page .whatsapp-float {
    right: 14px;
    bottom: calc(78px + env(safe-area-inset-bottom));
    background: var(--bmt-rose-deep);
  }
}

@media (max-width: 640px) {
  .bmt-header {
    padding-right: 14px;
    padding-left: 14px;
  }

  .bmt-brand {
    display: inline-grid;
    grid-template-columns: auto 1px minmax(0, 86px);
    align-items: center;
    gap: 8px;
  }

  .bmt-brand > span {
    display: block;
    height: 28px;
  }

  .bmt-brand strong {
    max-width: 86px;
    padding-left: 0;
    font-size: 0.8rem;
    line-height: 1.05;
  }

  .bmt-brand img {
    width: clamp(70px, 21vw, 84px);
  }

  .bmt-header-cta {
    min-height: 40px;
    padding: 9px 10px;
    font-size: 0.7rem;
  }

  .bmt-nav a {
    font-size: 0.69rem;
  }

  .bmt-nav .bmt-visit-link {
    font-size: 0.64rem;
  }

  .bmt-hero h1 {
    font-size: clamp(2.35rem, 12vw, 3.4rem);
  }

  .bmt-hero-visual figcaption {
    align-items: flex-start;
    flex-direction: column;
    font-size: 0.7rem;
  }

  .bmt-check-list,
  .bmt-inclusion-grid,
  .bmt-pricing .pricing-grid,
  .bmt-page .process-steps {
    grid-template-columns: 1fr;
  }

  .bmt-hero-visual picture,
  .bmt-hero-visual figcaption {
    width: 92%;
  }

  .bmt-page .page-hero.bmt-hero::before {
    background-image: url("assets/bmt/bmt-hero-mother-baby-bg-768.webp");
    background-position: 22% center;
    opacity: 0.3;
  }

  .bmt-page .page-hero.bmt-hero::after {
    background: linear-gradient(180deg, rgba(12, 14, 20, 0.82) 0%, rgba(12, 14, 20, 0.72) 46%, rgba(12, 14, 20, 0.88) 100%);
  }

  .bmt-outcome-list {
    grid-template-columns: 1fr;
    margin-top: 24px;
  }

  .bmt-outcome-list li {
    min-height: 58px;
    padding: 11px 0;
  }

  .bmt-results-band {
    background-image:
      linear-gradient(90deg, rgba(12, 14, 20, 0.98) 0%, rgba(12, 14, 20, 0.9) 58%, rgba(42, 22, 32, 0.45) 100%),
      url("assets/bmt/bmt-results-movement-bg-720.webp");
    background-position: 58% center;
  }

  .bmt-page #bmt-eligibility {
    background:
      linear-gradient(90deg, rgba(20, 23, 31, 0.98), rgba(20, 23, 31, 0.86)),
      url("assets/bmt/bmt-activity-join-from-home-480.webp") 62% center / cover no-repeat;
  }

  .bmt-worry-list {
    grid-template-columns: 1fr;
  }

  .bmt-activity-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }

  .bmt-activity-card picture {
    height: clamp(108px, 31vw, 135px);
  }

  .bmt-activity-card figcaption {
    min-height: 48px;
    display: flex;
    align-items: center;
    padding: 9px 10px 10px;
    font-size: 0.76rem;
  }

  .bmt-included-actions .button {
    width: 100%;
  }

  .bmt-trainer-card {
    padding: clamp(225px, 58vw, 300px) 12px 12px;
  }

  .bmt-trainer-content {
    padding: 17px;
  }

  .bmt-trainer-identity {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }

  .bmt-trainer-portrait {
    width: 78px;
    height: 78px;
    flex-basis: 78px;
  }

  .bmt-trainer-card h3 {
    font-size: 1.45rem;
  }

  .bmt-credentials {
    font-size: 0.76rem;
  }

  .bmt-trainer-content > p {
    font-size: 0.9rem;
  }

  .bmt-page .process-steps article {
    min-height: 0;
  }

  .bmt-results-band .button {
    width: 100%;
  }

  .bmt-page .final-cta {
    gap: 26px;
    padding-top: 38px;
    padding-bottom: 38px;
  }

  .bmt-cta-path {
    gap: 10px;
  }

  .bmt-cta-path li {
    align-items: flex-start;
    flex-direction: column;
    font-size: 0.72rem;
  }

  .bmt-final-cta-copy .button {
    width: 100%;
  }

  .bmt-final-cta-visual {
    border-radius: 12px;
  }

  .bmt-footer-brand {
    flex-direction: column;
  }
}

@media (max-width: 375px) {
  .bmt-brand img {
    width: 74px;
    height: auto;
  }

  .bmt-header-cta {
    padding-right: 8px;
    padding-left: 8px;
    font-size: 0.64rem;
  }

  .bmt-nav a {
    padding-right: 3px;
    padding-left: 3px;
    font-size: 0.63rem;
  }

  .bmt-nav .bmt-visit-link {
    font-size: 0.59rem;
  }

  .bmt-sticky-cta .button {
    padding-right: 8px;
    padding-left: 8px;
    font-size: 0.76rem;
  }
}

@media (max-width: 340px) {
  .bmt-header {
    gap: 8px;
  }

  .bmt-brand {
    grid-template-columns: 64px 1px 72px;
    gap: 6px;
  }

  .bmt-brand img {
    width: 64px;
  }

  .bmt-brand strong {
    font-size: 0.7rem;
  }

  .bmt-header-cta {
    padding-right: 8px;
    padding-left: 8px;
    font-size: 0.62rem;
  }
}

/* ---- BMT post-payment joining page (/beyond-mummy-tummy/payment-success/) ----
   Namespaced under .bmt-page/.bmt-joining-* — never restyles other pages. Reuses
   the locked BMT palette tokens and the shared .callback-hp honeypot utility. */

.bmt-page .bmt-joining {
  border-bottom: 0;
  padding-top: clamp(34px, 6vw, 64px);
  padding-bottom: clamp(48px, 7vw, 84px);
}

.bmt-page .bmt-joining-shell {
  max-width: 680px;
  display: grid;
  gap: 14px;
}

.bmt-page .bmt-joining h1 {
  margin: 0;
  font-size: clamp(1.9rem, 4.6vw, 2.6rem);
}

.bmt-page .bmt-joining-lede {
  margin: 0;
  color: var(--bmt-off-white);
  font-size: clamp(1.05rem, 2.2vw, 1.2rem);
  font-weight: 750;
}

.bmt-page .bmt-joining-intro {
  margin: 0;
}

.bmt-payment-summary {
  display: grid;
  gap: 10px;
  margin-top: 10px;
  padding: 16px 18px;
  background: var(--bmt-card);
  border: 1px solid var(--bmt-border);
  border-radius: 14px;
}

.bmt-payment-summary h2 {
  margin: 0;
  font-size: 0.8rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--bmt-rose);
}

.bmt-payment-summary-list {
  margin: 0;
  display: grid;
  gap: 8px 18px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.bmt-payment-summary-list > div {
  min-width: 0;
}

.bmt-payment-summary-list dt {
  color: var(--bmt-muted);
  font-size: 0.74rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.bmt-payment-summary-list dd {
  margin: 2px 0 0;
  color: var(--bmt-off-white);
  font-size: 0.94rem;
  font-weight: 650;
  overflow-wrap: anywhere;
}

.bmt-payment-summary .microcopy {
  margin: 0;
}

.bmt-joining-form {
  display: grid;
  gap: 16px;
  margin-top: 14px;
}

.bmt-joining-row {
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
}

.bmt-joining-field {
  display: grid;
  gap: 6px;
}

.bmt-joining-field label {
  color: var(--bmt-off-white);
  font-size: 0.86rem;
  font-weight: 720;
}

.bmt-joining-field label span[aria-hidden] {
  color: var(--bmt-rose);
}

.bmt-joining-field input,
.bmt-joining-field select {
  width: 100%;
  min-height: 48px;
  padding: 11px 13px;
  border: 1px solid var(--bmt-border);
  border-radius: 10px;
  background: var(--bmt-charcoal);
  color: var(--bmt-off-white);
  font: inherit;
}

.bmt-joining-field select {
  appearance: none;
  background-image: linear-gradient(45deg, transparent 50%, var(--bmt-muted) 50%), linear-gradient(135deg, var(--bmt-muted) 50%, transparent 50%);
  background-position: calc(100% - 20px) 55%, calc(100% - 14px) 55%;
  background-size: 6px 6px;
  background-repeat: no-repeat;
  padding-right: 38px;
}

.bmt-joining-field input:focus-visible,
.bmt-joining-field select:focus-visible {
  outline: 2px solid var(--bmt-rose);
  outline-offset: 1px;
  border-color: var(--bmt-rose);
}

.bmt-joining-field input[aria-invalid="true"],
.bmt-joining-field select[aria-invalid="true"] {
  border-color: var(--bmt-alert);
}

.bmt-page .bmt-field-help {
  margin: 0;
  color: var(--bmt-muted);
  font-size: 0.78rem;
}

.bmt-page .bmt-field-error {
  margin: 0;
  color: var(--bmt-alert);
  font-size: 0.82rem;
  font-weight: 700;
}

.bmt-joining-disclaimer {
  display: grid;
  gap: 12px;
  padding: 14px 16px;
  background: var(--bmt-charcoal);
  border: 1px solid var(--bmt-border);
  border-radius: 12px;
}

.bmt-joining-disclaimer > p {
  margin: 0;
  color: var(--bmt-muted);
  font-size: 0.82rem;
  line-height: 1.55;
}

.bmt-joining-agree {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  gap: 10px;
  color: var(--bmt-off-white);
  font-size: 0.9rem;
  font-weight: 700;
  cursor: pointer;
}

.bmt-joining-agree input {
  width: 20px;
  height: 20px;
  margin-top: 1px;
  accent-color: var(--bmt-rose);
}

.bmt-joining-agree input:focus-visible {
  outline: 2px solid var(--bmt-rose);
  outline-offset: 2px;
}

.bmt-joining-agree span[aria-hidden] {
  color: var(--bmt-rose);
}

.bmt-page .bmt-joining-error {
  margin: 0;
  color: var(--bmt-alert);
  font-size: 0.88rem;
  font-weight: 750;
}

.bmt-joining-submit {
  justify-self: start;
  min-height: 52px;
  padding: 14px 26px;
  letter-spacing: 0.04em;
}

.bmt-page .bmt-joining-status {
  margin: 0;
  font-size: 0.9rem;
}

.bmt-page .bmt-joining-status[data-kind="info"] {
  color: var(--bmt-muted);
}

.bmt-page .bmt-joining-status[data-kind="error"] {
  color: var(--bmt-alert);
  font-weight: 700;
}

.bmt-page .bmt-joining-status a {
  color: var(--bmt-rose);
  font-weight: 800;
}

.bmt-joining-success {
  display: grid;
  gap: 10px;
  margin-top: 14px;
  padding: 20px 22px;
  background: var(--bmt-card);
  border: 1px solid var(--bmt-teal);
  border-radius: 14px;
}

.bmt-joining-success h2 {
  margin: 0;
  color: var(--bmt-teal);
  font-size: clamp(1.1rem, 2.4vw, 1.3rem);
}

.bmt-joining-success h2:focus {
  outline: none;
}

.bmt-page .bmt-joining-success p {
  margin: 0;
  color: var(--bmt-off-white);
}

@media (max-width: 640px) {
  .bmt-joining-row,
  .bmt-payment-summary-list {
    grid-template-columns: 1fr;
  }

  .bmt-joining-submit {
    justify-self: stretch;
    width: 100%;
  }
}

/* No sticky CTA bar on the joining page — undo the BMT footer clearance that
   the 900px media block adds for the sales page's fixed bottom bar. */
@media (max-width: 900px) {
  .bmt-joining-page .bmt-footer {
    padding-bottom: 28px;
  }
}

/* ---- BMT sales pause (lock 42, 5 Aug 2026) ----
   Rendered only while config/bmt.json salesPaused is true: the full sales page is
   archived inertly inside <template data-bmt-sales-archive> and these rules style
   the short notice that renders in its place. Dormant once the pause is lifted. */
.bmt-paused-notice {
  max-width: 620px;
  margin: 0 auto;
  padding: 110px 24px 140px;
  text-align: center;
}

.bmt-paused-notice h1 {
  font-size: clamp(2rem, 5vw, 2.75rem);
  line-height: 1.15;
  margin: 14px 0 18px;
}

.bmt-paused-notice p {
  font-size: 1.05rem;
  line-height: 1.65;
  margin: 0 0 14px;
}

.bmt-paused-notice .cta-row {
  justify-content: center;
  margin-top: 26px;
}