/*
Theme Name:   Kadence Child
Template:     kadence
Version:      1.0.0
Description:  Custom child theme for yourbestlifeover50.com — A Zest for Life LLC
Author:       A Zest for Life LLC
Text Domain:  kadence-child
*/

/* ============================================================
   BRAND CSS CUSTOM PROPERTIES
   ============================================================ */

:root {
  /* Core brand palette */
  --brand-ivory:    #FAF4EE;
  --brand-violet:   #5C3060;
  --brand-midnight: #100A20;
  --brand-gold:     #B8906A;
  --brand-rose:     #F0C0C8;
  --brand-plum:     #2A1C30;
  --brand-blush:    #F5ECE8;
  --brand-mauve:    #EDE4F0;
  --brand-footer:   #3A1E30;

  /* Extended palette */
  --brand-earth:    #8A7355;
  --brand-champagne:#E8C56A;
  --brand-petal:    #FEF5F5;
  --brand-gold-dark:#C4A055;

  /* Kadence global palette — mapped to brand colours */
  --global-palette1: #2A1C30;
  --global-palette2: #5C3060;
  --global-palette3: #B8906A;
  --global-palette4: #8A7355;
  --global-palette5: #EDE4F0;
  --global-palette6: #F5ECE8;
  --global-palette7: #FAF4EE;
  --global-palette8: #FAF4EE;
  --global-palette9: #ffffff;

  /* Typography scale */
  --font-display: 'Playfair Display', Georgia, 'Times New Roman', serif;
  --font-ui:      'Jost', Arial, 'Helvetica Neue', sans-serif;
  --font-serif:   Georgia, 'Times New Roman', serif;

  /* Spacing */
  --section-padding: 40px 0;
  --container-max:   1200px;
  --border-radius:   8px;
  --border-radius-pill: 50px;

  /* Transitions */
  --transition: 0.25s ease;
}

/* ============================================================
   GLOBAL RESET & BASE
   ============================================================ */

*, *::before, *::after {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  font-family: var(--font-display);
  color: var(--brand-plum);
  background-color: var(--brand-ivory);
  line-height: 1.7;
  font-size: 17px;
}

/* ============================================================
   TYPOGRAPHY
   ============================================================ */

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-display);
  color: var(--brand-plum);
  font-weight: 600;
  line-height: 1.2;
  margin-bottom: 0.75em;
}

h1 { font-size: clamp(2rem, 4vw, 3.2rem); }
h2 { font-size: clamp(1.6rem, 3vw, 2.5rem); }
h3 { font-size: clamp(1.3rem, 2.5vw, 1.9rem); }
h4 { font-size: 1.4rem; }
h5 { font-size: 1.2rem; }
h6 { font-size: 1rem; }

p { margin-bottom: 1.2em; }

.eyebrow {
  font-family: var(--font-ui);
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--brand-gold);
  margin-bottom: 0.6em;
  display: block;
}

blockquote,
.testimonial-text {
  font-style: italic;
  font-size: 1.15rem;
  line-height: 1.75;
  color: var(--brand-plum);
}

/* ============================================================
   LINKS
   ============================================================ */

a {
  color: var(--brand-violet);
  text-decoration: none;
  transition: color var(--transition);
}

a:hover,
a:focus {
  color: var(--brand-gold);
  text-decoration: underline;
}

/* ============================================================
   BUTTONS
   ============================================================ */

/* Primary CTA — violet pill */
.wp-element-button,
.btn,
.btn-primary,
button.btn-primary,
a.btn-primary,
.wp-block-button__link,
.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button {
  font-family: var(--font-ui);
  font-weight: 600;
  font-size: 0.95rem;
  letter-spacing: 0.03em;
  border-radius: var(--border-radius-pill);
  padding: 0.85em 2em;
  transition: background-color var(--transition), color var(--transition), border-color var(--transition), transform 0.15s ease;
  display: inline-block;
  cursor: pointer;
  border: 2px solid transparent;
  text-decoration: none;
  line-height: 1;
}

.wp-element-button,
.btn-primary,
.wp-block-button:not(.is-style-outline) .wp-block-button__link {
  background-color: var(--brand-violet);
  color: var(--brand-ivory) !important;
  border-color: var(--brand-violet);
}

.wp-element-button:hover,
.btn-primary:hover,
.wp-block-button:not(.is-style-outline) .wp-block-button__link:hover {
  background-color: #4a2650;
  border-color: #4a2650;
  color: var(--brand-ivory) !important;
  transform: translateY(-1px);
  text-decoration: none;
}

/* Secondary / outline button — gold */
.btn-secondary,
.btn-outline,
.wp-block-button.is-style-outline .wp-block-button__link {
  background-color: transparent;
  color: var(--brand-gold) !important;
  border-color: var(--brand-gold);
}

.btn-secondary:hover,
.btn-outline:hover,
.wp-block-button.is-style-outline .wp-block-button__link:hover {
  background-color: var(--brand-gold);
  color: var(--brand-ivory) !important;
  text-decoration: none;
  transform: translateY(-1px);
}

/* ============================================================
   HEADER & NAVIGATION
   ============================================================ */

.site-header,
#masthead {
  background-color: #251428;   /* dark "bookend" — matches the footer */
  border-bottom: 1px solid rgba(184, 144, 106, 0.45);   /* gold hairline */
}

/* Kadence paints the MAIN header row background (#ffffff) via inline CSS on
   .site-header-row-container-inner, which covers .site-header — override it. */
.site-main-header-wrap .site-header-row-container-inner,
#masthead .site-main-header-wrap .site-header-row-container-inner {
  background: #251428 !important;
}

.site-header .custom-logo {
  max-height: 64px;
  width: auto;
}

/* Primary navigation */
.main-navigation,
#site-navigation {
  font-family: var(--font-ui);
}

.main-navigation a,
#site-navigation a {
  font-size: 0.92rem;
  font-weight: 500;
  letter-spacing: 0.01em;
  color: var(--brand-ivory);   /* light nav on the dark header */
  transition: color var(--transition);
}

.main-navigation a:hover,
#site-navigation a:hover {
  color: var(--brand-gold);
  text-decoration: none;
}

/* "Book a Call" nav button — gold pill so the primary CTA pops on the dark header */
.nav-book-call a,
.menu-item-book-call > a {
  background-color: var(--brand-gold);
  color: #251428 !important;
  border-radius: var(--border-radius-pill);
  /* Shared pill spec — matches the "Email Us" button (§37) so both CTA
     pills are the same height regardless of how many letters they hold. */
  font-family: var(--font-ui);
  font-size: 0.85rem;
  font-weight: 600;
  letter-spacing: 1px;
  text-transform: uppercase;
  line-height: 1;
  padding: 0.65em 1.5em;
  transition: background-color var(--transition);
}

.nav-book-call a:hover,
.menu-item-book-call > a:hover {
  background-color: #cba078;
  text-decoration: none;
}

/* ============================================================
   PAGE HERO SECTIONS
   ============================================================ */

.hero-section {
  padding: var(--section-padding);
  background-color: var(--brand-ivory);
}

.hero-section h1 {
  font-size: clamp(2.2rem, 5vw, 3.6rem);
  font-weight: 700;
  color: var(--brand-plum);
  max-width: 700px;
  text-align: center;
}

.hero-section .hero-subhead {
  font-size: 1.2rem;
  color: var(--brand-earth);
  max-width: 580px;
  margin-bottom: 2rem;
}

.hero-cta-group {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  align-items: center;
  justify-content: center;
}

/* ============================================================
   SOCIAL PROOF BAR
   ============================================================ */

.social-proof-bar {
  background-color: var(--brand-blush);
  padding: 1.5rem 0;
  border-top: 1px solid rgba(184,144,106,0.2);
  border-bottom: 1px solid rgba(184,144,106,0.2);
}

/* Collapse the social-proof bar while it has no content (empty divider).
   Reappears automatically if proof content is added later. Per §22. */
.social-proof-bar:has(> .wp-block-group__inner-container:empty) {
  display: none !important;
}

.social-proof-bar__inner {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 2rem;
  max-width: var(--container-max);
  margin: 0 auto;
  padding: 0 1.5rem;
  font-family: var(--font-ui);
  font-size: 0.88rem;
  color: var(--brand-plum);
}

.social-proof-bar .stars {
  color: var(--brand-gold);
  font-size: 1rem;
}

.social-proof-bar .divider {
  color: var(--brand-gold);
  opacity: 0.5;
}

/* ============================================================
   OFFER CARDS (3-column grid)
   ============================================================ */

.offer-cards-section {
  padding: var(--section-padding);
  background-color: var(--brand-ivory);
}

.offer-cards-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
  max-width: var(--container-max);
  margin: 0 auto;
  padding: 0 1.5rem;
}

.offer-card {
  background: #fff;
  border-radius: var(--border-radius);
  overflow: hidden;
  box-shadow: 0 2px 20px rgba(42, 28, 48, 0.06);
  transition: transform var(--transition), box-shadow var(--transition);
  display: flex;
  flex-direction: column;
}

.offer-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 30px rgba(42, 28, 48, 0.12);
}

.offer-card__top-bar {
  height: 5px;
  background-color: var(--brand-gold);
}

.offer-card--featured .offer-card__top-bar {
  height: 0;
}

.offer-card--featured {
  background-color: var(--brand-violet);
}

.offer-card--featured h3,
.offer-card--featured p,
.offer-card--featured .eyebrow {
  color: var(--brand-ivory) !important;
}

.offer-card__body {
  padding: 2rem;
  flex: 1;
  display: flex;
  flex-direction: column;
}

/* ============================================================
   TESTIMONIALS
   ============================================================ */

.testimonials-section {
  padding: var(--section-padding);
  background-color: var(--brand-ivory);
}

.testimonials-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 2rem;
  max-width: var(--container-max);
  margin: 0 auto;
  padding: 0 1.5rem;
  align-items: stretch;
}

.testimonial-card {
  background-color: var(--brand-petal, #FEF5F5);
  border-radius: var(--border-radius);
  padding: 2.5rem 2rem 2rem;
  position: relative;
  display: flex;
  flex-direction: column;
  height: 100%;
}

.testimonial-card::before {
  content: '\201C';
  font-family: Georgia, serif;
  font-size: 5rem;
  line-height: 1;
  color: #D4A0A8;
  position: absolute;
  top: 0.5rem;
  left: 1.5rem;
  opacity: 0.6;
}

.testimonial-card__text {
  font-style: italic;
  margin-bottom: 1.5rem;
  margin-top: 1.5rem;
  font-size: 1rem;
  line-height: 1.75;
}

.testimonial-card__attribution {
  font-family: var(--font-ui);
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--brand-gold);
  letter-spacing: 0.02em;
}

.testimonial-card__role {
  /* Client-type label intentionally hidden per Home Page Style Standards (§22) */
  display: none;
}

/* ============================================================
   EMAIL OPT-IN SECTION
   ============================================================ */

.optin-section {
  padding: var(--section-padding);
  background-color: var(--brand-mauve);
}

.optin-section__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4rem;
  align-items: center;
  max-width: var(--container-max);
  margin: 0 auto;
  padding: 0 1.5rem;
}

/* ============================================================
   ABOUT TEASER / BLUSH SECTIONS
   ============================================================ */

.section-blush {
  background-color: var(--brand-blush);
}

.section-mauve {
  background-color: var(--brand-mauve);
}

.section-midnight {
  background-color: var(--brand-midnight);
  color: var(--brand-ivory);
}

.section-midnight h1,
.section-midnight h2,
.section-midnight h3 {
  color: var(--brand-ivory);
}

.section-footer-dark {
  background-color: var(--brand-footer);
  color: var(--brand-ivory);
}

/* ============================================================
   SOVLINE™ METHODOLOGY SECTION
   ============================================================ */

.sovline-section {
  padding: var(--section-padding);
  background-color: var(--brand-midnight);
  color: var(--brand-ivory);
}

.sovline-section h2 {
  color: var(--brand-ivory);
}

.sovline-section .eyebrow {
  color: var(--brand-rose);
}

.sovline-above-line,
.sovline-below-line {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin: 1.5rem 0;
}

.sovline-tag {
  font-family: var(--font-ui);
  font-size: 0.85rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  border-radius: var(--border-radius-pill);
  padding: 0.4em 1.1em;
  display: inline-block;
}

.sovline-tag--above {
  background-color: rgba(240, 192, 200, 0.15);
  color: var(--brand-rose);
  border: 1px solid rgba(240, 192, 200, 0.4);
}

.sovline-tag--below {
  background-color: rgba(255,255,255,0.06);
  color: rgba(250, 244, 238, 0.55);
  border: 1px solid rgba(255,255,255,0.12);
}

.sovline-the-line {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin: 1.5rem 0;
  font-family: var(--font-ui);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--brand-gold);
}

.sovline-the-line::before,
.sovline-the-line::after {
  content: '';
  flex: 1;
  height: 1px;
  background-color: var(--brand-gold);
  opacity: 0.4;
}

/* ============================================================
   CUSTOM 4-COLUMN FOOTER — Deep Rose Dusk
   ============================================================ */

/* Hide Kadence's default footer wrapper (we output our own) */
.site-footer-wrap { display: none !important; }

/* Our custom footer root */
.ybl-footer {
  background-color: #251428;   /* deeper plum — between the prior #3A1E30 and midnight */
  color: var(--brand-ivory);
  font-family: var(--font-ui);
}

/* ── Main grid ─────────────────────────────────────────── */
.ybl-footer-main {
  max-width: 1240px;
  margin: 0 auto;
  padding: 36px 2rem 28px;   /* trimmed from 80/56px — was wasting vertical space */
}

.ybl-footer-grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr;
  gap: 3rem;
  align-items: start;
}

/* ── Column 1: brand logo + tagline ────────────────────── */
.ybl-footer-logo {
  max-width: 280px;   /* balanced against the footer nav text */
  width: 100%;
  height: auto;
  display: block;
}

.ybl-footer-tagline {
  margin: 0.85rem 0 0;
  font-family: var(--font-display);
  font-style: italic;
  font-size: 0.9rem;
  color: var(--brand-gold);
  line-height: 1.4;
}

/* ── Column headings ────────────────────────────────────── */
.ybl-footer-heading {
  font-family: var(--font-ui);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--brand-gold);
  margin: 0 0 1.2rem;
}

/* ── Nav lists ──────────────────────────────────────────── */
.ybl-footer-nav {
  list-style: none;
  margin: 0;
  padding: 0;
}

.ybl-footer-nav li {
  margin-bottom: 0.6rem;
}

.ybl-footer-nav a {
  color: rgba(250, 244, 238, 0.78);
  text-decoration: none;
  font-size: 0.92rem;
  transition: color 0.2s ease;
}

.ybl-footer-nav a:hover {
  color: var(--brand-gold);
}

/* Instagram / social links not yet live — subtle treatment */
.ybl-footer-nav .coming-soon {
  color: rgba(250, 244, 238, 0.38);
  font-size: 0.92rem;
  cursor: default;
}

/* ── Column 4: SOV-LINE™ badge ─────────────────────────── */
.ybl-footer-col--badge {
  text-align: center;
}

.ybl-footer-badge-img {
  max-width: 78px;   /* balanced with the horizontal logo */
  width: 100%;
  height: auto;
  display: block;
  margin: 0 auto 0.85rem;
}

.ybl-footer-badge-name {
  font-family: var(--font-ui);
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.22em;
  color: var(--brand-ivory);
  margin: 0 0 0.2rem;
}

.ybl-footer-badge-tagline {
  font-family: var(--font-display);
  font-style: italic;
  font-size: 0.82rem;
  color: var(--brand-gold);
  margin: 0;
}

/* ── Gold separator + bottom bar ────────────────────────── */
.ybl-footer-bottom {
  border-top: 1px solid rgba(184, 144, 106, 0.28);
}

.ybl-footer-bottom-inner {
  max-width: 1240px;
  margin: 0 auto;
  padding: 1.4rem 2rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  flex-wrap: wrap;
  font-size: 0.76rem;
  color: rgba(250, 244, 238, 0.45);
}

.ybl-footer-bottom-inner a {
  color: rgba(250, 244, 238, 0.5);
  text-decoration: none;
  transition: color 0.2s;
}

.ybl-footer-bottom-inner a:hover {
  color: var(--brand-gold);
}

/* ── Responsive ─────────────────────────────────────────── */
@media (max-width: 920px) {
  .ybl-footer-grid {
    grid-template-columns: 1fr 1fr;
    gap: 2.5rem;
  }
  .ybl-footer-col--brand {
    grid-column: 1 / -1;
  }
}

@media (max-width: 540px) {
  .ybl-footer-grid {
    grid-template-columns: 1fr;
  }
  .ybl-footer-col--badge {
    text-align: left;
  }
  /* the global `img { max-width:100% !important }` mobile rule was blowing the
     badge up to full column width — re-cap it (and the logo) here */
  .ybl-footer-badge-img {
    max-width: 68px !important;
    width: 68px !important;
    margin: 0 0 0.75rem;
  }
  .ybl-footer-logo {
    max-width: 220px !important;
  }
  .ybl-footer-bottom-inner {
    flex-direction: column;
    align-items: flex-start;
  }
}

/* ============================================================
   WOOCOMMERCE OVERRIDES
   ============================================================ */

.woocommerce .star-rating span::before,
.woocommerce .star-rating::before {
  color: var(--brand-gold);
}

.woocommerce span.onsale {
  background-color: var(--brand-violet);
  border-radius: var(--border-radius-pill);
}

.woocommerce #respond input#submit.alt,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt {
  background-color: var(--brand-violet);
  color: var(--brand-ivory);
  border-radius: var(--border-radius-pill);
}

.woocommerce #respond input#submit.alt:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover {
  background-color: #4a2650;
}

.woocommerce-cart .wc-proceed-to-checkout a.checkout-button,
.woocommerce .checkout-button {
  background-color: var(--brand-violet);
  color: var(--brand-ivory);
  border-radius: var(--border-radius-pill);
  font-family: var(--font-ui);
  font-weight: 600;
}

/* ============================================================
   FLUENT FORMS OVERRIDES
   ============================================================ */

.ff-el-input--label label,
.ff-el-form-control,
.fluentform .ff-el-input--label {
  font-family: var(--font-ui);
  color: var(--brand-plum);
}

.fluentform input[type="text"],
.fluentform input[type="email"],
.fluentform textarea,
.fluentform select {
  border-color: rgba(184, 144, 106, 0.35) !important;
  border-radius: var(--border-radius) !important;
  background-color: #fff !important;
  color: var(--brand-plum) !important;
  font-family: var(--font-ui) !important;
  padding: 0.7em 1em !important;
  font-size: 0.95rem !important;
}

.fluentform input:focus,
.fluentform textarea:focus {
  border-color: var(--brand-violet) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(92, 48, 96, 0.12) !important;
}

.fluentform .ff_submit_btn_container button,
.fluentform .ff_submit_btn_wrapper button,
.fluentform .ff_submit_btn_wrapper_custom button,
.fluentform button.ff-btn-submit,
.fluentform .ff-btn.ff-btn-submit,
.fluentform .wp-element-button {
  background-color: var(--brand-violet) !important;
  border-color: var(--brand-violet) !important;
  color: var(--brand-ivory) !important;
  border-radius: var(--border-radius-pill) !important;
  font-family: var(--font-ui) !important;
  font-weight: 600 !important;
  border: 2px solid var(--brand-violet) !important;
  padding: 0.85em 2em !important;
  width: 100%;
  font-size: 0.95rem !important;
  cursor: pointer;
  transition: background-color var(--transition);
}

.fluentform .ff_submit_btn_container button:hover,
.fluentform .ff_submit_btn_wrapper button:hover,
.fluentform button.ff-btn-submit:hover {
  background-color: #4a2650 !important;
  border-color: #4a2650 !important;
}

/* ============================================================
   SECTION LAYOUT UTILITIES
   ============================================================ */

.section-container {
  max-width: var(--container-max);
  margin: 0 auto;
  padding: 0 1.5rem;
}

.section-pad {
  padding: var(--section-padding);
}

.section-pad-sm {
  padding: 40px 0;
}

.text-center { text-align: center; }
.text-gold    { color: var(--brand-gold); }
.text-violet  { color: var(--brand-violet); }
.text-ivory   { color: var(--brand-ivory); }

/* Two-column split layout */
.two-col-split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4rem;
  align-items: center;
}

/* ============================================================
   FAQ ACCORDION
   ============================================================ */

.faq-item {
  border-bottom: 1px solid rgba(184, 144, 106, 0.25);
}

.faq-question {
  font-family: var(--font-ui);
  font-weight: 600;
  font-size: 1rem;
  color: var(--brand-plum);
  padding: 1.25rem 0;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  transition: color var(--transition);
}

.faq-question:hover {
  color: var(--brand-violet);
}

.faq-answer {
  font-size: 0.95rem;
  padding-bottom: 1.25rem;
  color: var(--brand-plum);
  line-height: 1.75;
}

/* ============================================================
   COACHING OFFER CARDS
   ============================================================ */

.coaching-cards-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2.5rem;
  max-width: 900px;
  margin: 0 auto;
}

.coaching-card {
  background: var(--brand-ivory);
  border: 2px solid rgba(184,144,106,0.25);
  border-radius: var(--border-radius);
  padding: 2.5rem;
}

.coaching-card--featured {
  background-color: var(--brand-violet);
  border-color: var(--brand-violet);
  color: var(--brand-ivory);
}

.coaching-card--featured h3,
.coaching-card--featured p,
.coaching-card--featured li {
  color: var(--brand-ivory);
}

.coaching-card__price {
  font-family: var(--font-ui);
  font-size: 1.6rem;
  font-weight: 700;
  color: var(--brand-gold);
  margin: 1rem 0 0.25rem;
}

.coaching-card__includes {
  list-style: none;
  padding: 0;
  margin: 1.25rem 0;
}

.coaching-card__includes li {
  font-family: var(--font-ui);
  font-size: 0.9rem;
  padding: 0.3rem 0 0.3rem 1.5rem;
  position: relative;
}

.coaching-card__includes li::before {
  content: '✓';
  position: absolute;
  left: 0;
  color: var(--brand-gold);
  font-weight: 700;
}

/* ============================================================
   PAIN POINTS / IS THIS YOU
   ============================================================ */

.pain-points-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.5rem;
  max-width: 860px;
  margin: 2rem auto;
}

.pain-point-item {
  display: flex;
  gap: 1rem;
  align-items: flex-start;
  padding: 1.5rem;
  background: rgba(240, 192, 200, 0.20);
  border-left: 3px solid var(--brand-rose);
  border-radius: 0 var(--border-radius) var(--border-radius) 0;
}

.pain-point-item p {
  margin: 0;
  font-size: 0.95rem;
  line-height: 1.6;
}

/* ============================================================
   COMMUNITY COMING SOON PAGE
   ============================================================ */

.community-hero {
  padding: 40px 0;
  background: linear-gradient(135deg, var(--brand-midnight) 0%, #2A1C30 100%);
  color: var(--brand-ivory);
  text-align: center;
}
/* trim Kadence's 5rem content-area margin to the 40px rule (gap above the
   blue hero box) — scoped to the Community page */
body.page-id-25734 .content-area {
  margin-top: 40px !important;
  margin-bottom: 40px !important;
}
/* recreated hero headline (wp:html block) — inline centering on the element
   plus this guard; max-width keeps it to ~3 centered lines */
.community-hero .cw-hero-title {
  max-width: 640px;
  margin: 0 auto 1.25rem !important;
  text-align: center !important;
  color: var(--brand-ivory);
}

.community-hero h1 {
  color: var(--brand-ivory);
  max-width: 760px;
  margin: 0 auto 1.5rem;
  text-align: center !important;
}

.community-hero .subhead {
  color: rgba(250, 244, 238, 0.8);
  max-width: 600px;
  margin: 0 auto 2rem;
  font-size: 1.15rem;
  text-align: center;
}

/* Community waitlist — Approach C custom form on the midnight hero
   (replaces the old Kit embed; POSTs to Kit form 9535156 + tag
   community-waitlist 20132733, JS in functions.php is_page(25734)) */
/* force-center the hero text (matches Books CTA; overrides any stale rule) */
body.page-id-25734 .community-hero,
body.page-id-25734 .community-hero .eyebrow,
body.page-id-25734 .community-hero h1,
body.page-id-25734 .community-hero .subhead,
body.page-id-25734 .community-hero .cw-success__head,
body.page-id-25734 .community-hero .cw-success__note {
  text-align: center !important;
}

/* §35 spacing — trim the boxed vertical padding to the 40px rule
   (CLAUDE.md §22/§23): 40px above the blue hero box, 40px above COMING SOON,
   40px gap before the feature cards. Was 100px hero padding + boxed gap. */
body.page-id-25734 .single-entry .entry-content-wrap,
body.page-id-25734 .content-bg .entry-content-wrap {
  padding-top: 40px !important;
  padding-bottom: 40px !important;
}
body.page-id-25734 .entry-content > .community-hero {
  padding-top: 40px !important;
  padding-bottom: 40px !important;
  margin: 0 !important;
}
body.page-id-25734 .entry-content > .wp-block-group:not(.community-hero) {
  padding-top: 40px !important;
  padding-bottom: 0 !important;
  margin: 0 !important;
}

/* ============================================================
   CONTACT PAGE (page-id-25736) — midnight hero + ivory body,
   40px rule, email-wrap fix
   ============================================================ */
body.page-id-25736 .single-entry .entry-content-wrap,
body.page-id-25736 .content-bg .entry-content-wrap {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
body.page-id-25736 .content-area {       /* 40px above the hero band */
  margin-top: 40px !important;
  margin-bottom: 40px !important;
}
.contact-hero {
  background: linear-gradient(135deg, var(--brand-midnight) 0%, #2A1C30 100%);
  color: var(--brand-ivory);
  text-align: center;
  padding: 40px 1.5rem !important;
}
.contact-hero h1 { color: var(--brand-ivory) !important; }
.contact-hero p  { color: rgba(250, 244, 238, 0.85) !important; }
.contact-hero a  { color: var(--brand-rose); }
.contact-hero a:hover { color: var(--brand-gold); }

.contact-body { padding: 40px 1.5rem !important; }
/* 3 info cards with icons — equal sizing so the email matches the others */
.contact-cards {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1.75rem 2rem;
  max-width: 860px;
  margin: 0 auto;
}
.contact-card {
  flex: 1 1 240px;
  max-width: 280px;
  text-align: center;
}
.contact-card__icon {
  display: block;
  width: 30px;
  height: 30px;
  margin: 0 auto 0.7rem;
}
.contact-card__label {
  font-family: var(--font-ui);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--brand-gold);
  margin: 0 0 0.35rem;
}
.contact-card__value {
  display: block;
  font-family: var(--font-ui);
  font-size: 0.98rem;
  line-height: 1.4;
  color: var(--brand-plum);
  margin: 0;
  text-decoration: none;
  overflow-wrap: break-word;
}
a.contact-card__value { color: var(--brand-violet); }
a.contact-card__value:hover { color: var(--brand-gold); }

/* contact form (REST → wp_mail) */
.contact-form {
  max-width: 560px;
  margin: 0 auto 2.75rem;
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
  text-align: left;
}
.contact-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.contact-input,
.contact-textarea {
  width: 100%;
  padding: 0.85rem 1rem;
  font-size: 1rem;
  font-family: var(--font-ui);
  border: 1px solid rgba(42, 28, 48, 0.25);
  border-radius: 6px;
  background: #fff;
  color: var(--brand-plum);
  box-sizing: border-box;
}
.contact-textarea { resize: vertical; min-height: 130px; }
.contact-input:focus,
.contact-textarea:focus { outline: 2px solid var(--brand-violet); outline-offset: 1px; }
.contact-btn {
  align-self: center;
  margin-top: 0.3rem;
  padding: 0.85rem 2rem;
  font-family: var(--font-ui);
  font-size: 0.95rem;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--brand-ivory);
  background: var(--brand-violet);
  border: none;
  border-radius: 50px;
  cursor: pointer;
  min-height: 44px;
  transition: background 0.15s ease;
}
.contact-btn:hover { background: var(--brand-gold); }
.contact-btn:disabled { opacity: 0.7; cursor: default; }
.contact-error {
  display: none;
  color: #B3261E;
  font-size: 0.9rem;
  margin: 0;
  text-align: center;
}
.contact-success { display: none; max-width: 560px; margin: 0 auto 2.75rem; text-align: center; }
.contact-success p {
  font-family: var(--font-display);
  font-size: 1.2rem;
  color: var(--brand-violet);
  margin: 0;
}
.contact-other {
  text-align: center;
  font-family: var(--font-ui);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--brand-gold);
  margin: 0 0 1.5rem;
}

/* two fields on one row (First Name + Email), button wraps centered below —
   same layout as the Books .notify-form CTA */
.cw-form {
  display: flex;
  gap: 0.6rem;
  max-width: 560px;
  margin: 0 auto;
  flex-wrap: wrap;
  justify-content: center;
}
.cw-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.cw-input {
  flex: 1 1 220px;
  padding: 0.85rem 1rem;
  font-size: 1rem;
  border: 1px solid rgba(250, 244, 238, 0.35);
  border-radius: 6px;
  background: #fff;
  color: var(--brand-plum);
  min-height: 44px;
}
.cw-input::placeholder { color: rgba(42, 28, 48, 0.55); }
.cw-input:focus { outline: 2px solid var(--brand-rose); outline-offset: 1px; }
.cw-btn {
  flex: 0 0 auto;
  padding: 0.85rem 1.6rem;
  font-family: Arial, "Helvetica Neue", sans-serif;
  font-size: 0.95rem;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--brand-ivory);
  background: var(--brand-violet);
  border: none;
  border-radius: 50px;
  cursor: pointer;
  min-height: 44px;   /* tap target, HIG */
  transition: background 0.15s ease;
}
.cw-btn:hover { background: var(--brand-gold); }
.cw-btn:disabled { opacity: 0.7; cursor: default; }
.cw-error {
  display: none;
  width: 100%;
  color: var(--brand-rose);
  font-size: 0.9rem;
  margin: 0.4rem 0 0;
}
.cw-success { display: none; max-width: 460px; margin: 0 auto; }
.cw-success__head {
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.3rem;
  color: var(--brand-rose);
  margin: 0 0 0.4rem;
}
.cw-success__note {
  color: rgba(250, 244, 238, 0.85);
  font-size: 1rem;
  margin: 0;
}

/* Community features — icon grid with rose icons */
.community-features h4,
.wp-block-group .wp-block-columns h4[style*="F0C0C8"] {
  color: var(--brand-rose) !important;
  font-size: 1rem;
  margin-top: 0.5rem;
}

/* Community feature icon circles */
.community-icon-circle {
  width: 64px;
  height: 64px;
  margin: 0 auto 1rem;
  background: rgba(240, 192, 200, 0.12);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1.5px solid rgba(240, 192, 200, 0.35);
}

/* ============================================================
   404 PAGE
   ============================================================ */

.error-404 {
  padding: 120px 0;
  text-align: center;
  background-color: var(--brand-ivory);
}

.error-404 h1 {
  font-size: 6rem;
  color: var(--brand-rose);
  line-height: 1;
  margin-bottom: 0.25em;
}

/* ============================================================
   KADENCE PAGE TITLE BANNER — hide everywhere
   (All pages use their own H1 hero sections)
   ============================================================ */

.entry-hero,
.kadence-page-title-wrap,
.site-above-header-wrap,
.page-title-bar,
.wp-block-kadence-header ~ .entry-hero,
.single-page-hero {
  display: none !important;
}

.home .entry-hero,
.home .kadence-page-title,
.home .page-title-wrap {
  display: none !important;
}

.wp-site-blocks .alignfull:first-child,
.entry-content > .wp-block-group:first-child {
  margin-top: 0 !important;
}

/* ============================================================
   KADENCE HEADER — logo only, hide site name text
   ============================================================ */

/* Dark bookend header: hide the dark-text logo img and paint the IVORY logo
   as a background on the brand link (desktop = full logo with tagline). */
.site-header .custom-logo-link img,
.site-header .custom-logo,
.kadence-custom-logo img,
.site-branding a.brand img,
.site-branding a.brand img.svg-logo-image {
  display: none !important;
}
.site-branding a.brand {
  display: inline-block !important;
  width: 320px !important;
  height: 72px !important;
  background-image: url("/wp-content/themes/kadence-child/assets/images/logo-primary-footer.svg");
  background-repeat: no-repeat;
  background-position: left center;
  background-size: contain;
}

/* Hide the text site-title/tagline that appears alongside the logo */
.site-header .site-title,
.site-header .site-description,
.header-site-name-wrap,
.site-header .header-site-name-wrap,
.site-branding-text,
.kadence-site-branding .site-title,
.kadence-header .site-title {
  display: none !important;
}

/* Shrink the header bar slightly */
.site-header .site-header-row-container-inner {
  padding-top: 12px !important;
  padding-bottom: 12px !important;
}

/* ============================================================
   FOOTER — remove Kadence credit, correct copyright
   ============================================================ */

/* Hide "WordPress Theme by Kadence WP" credit and separator */
.footer-credit,
.kadence-credit,
.site-info .sep,
.site-info a[href*="kadencewp"],
.copyright-footer-widget .sep,
.copyright-footer-widget a[href*="kadencewp"],
.footer-copyright-bar a[href*="kadencewp"],
[class*="footer-credit"],
[class*="credit-text"] a {
  display: none !important;
}

/* Style the remaining copyright bar on brand */
.site-info,
.footer-bottom-wrap,
.footer-copyright-bar,
.kadence-footer-bottom,
.footer-legal-wrap {
  background-color: var(--brand-footer) !important;
  color: rgba(250, 244, 238, 0.5) !important;
  font-family: var(--font-ui) !important;
  font-size: 0.78rem !important;
  text-align: center !important;
  padding: 1.25rem !important;
  border-top: 1px solid rgba(184, 144, 106, 0.15) !important;
}

.site-info a,
.footer-copyright-bar a {
  color: rgba(250, 244, 238, 0.6) !important;
  text-decoration: none !important;
}

.site-info a:hover,
.footer-copyright-bar a:hover {
  color: var(--brand-gold) !important;
}

/* ============================================================
   LUXURY GOLD ENHANCEMENTS
   ============================================================ */

/* Warm ivory on all Kadence content areas */
body,
.wp-site-blocks,
.site-main,
.entry-content,
.kadence-inner-column-inner,
.kb-inside-container,
.site-content {
  background-color: var(--brand-ivory) !important;
}

/* Gold accent line under eyebrow labels */
.eyebrow::after {
  content: '';
  display: block;
  width: 36px;
  height: 1.5px;
  background: linear-gradient(90deg, var(--brand-gold), transparent);
  margin-top: 5px;
}

/* Centred eyebrows get a centred accent line */
p.has-text-align-center.eyebrow::after,
[style*="text-align: center"] .eyebrow::after {
  margin-left: auto;
  margin-right: auto;
}

/* Gold left-border accent on pull quotes / highlighted paragraphs */
.wp-block-pullquote,
.has-global-padding blockquote {
  border-left: 3px solid var(--brand-gold) !important;
  border-right: none !important;
  padding-left: 1.5rem !important;
}

/* Richer card shadow with gold undertone */
.wp-block-group.is-style-rounded,
.offer-card,
.coaching-card {
  box-shadow: 0 4px 32px rgba(42, 28, 48, 0.08),
              0 1px 8px rgba(184, 144, 106, 0.1) !important;
}

/* Violet buttons: subtle gradient for depth */
.wp-block-button:not(.is-style-outline) .wp-block-button__link {
  background: linear-gradient(135deg, #5C3060 0%, #6e3873 100%) !important;
  box-shadow: 0 3px 12px rgba(92, 48, 96, 0.28) !important;
}

.wp-block-button:not(.is-style-outline) .wp-block-button__link:hover {
  background: linear-gradient(135deg, #4a2650 0%, #5C3060 100%) !important;
  box-shadow: 0 5px 18px rgba(92, 48, 96, 0.38) !important;
  transform: translateY(-2px) !important;
}

/* Gold outline buttons: warmer fill on hover */
.wp-block-button.is-style-outline .wp-block-button__link {
  border: 1.5px solid var(--brand-gold) !important;
  color: var(--brand-gold) !important;
}

.wp-block-button.is-style-outline .wp-block-button__link:hover {
  background: linear-gradient(135deg, var(--brand-gold) 0%, #C4A055 100%) !important;
  color: var(--brand-ivory) !important;
  box-shadow: 0 3px 12px rgba(184, 144, 106, 0.35) !important;
}

/* Section headings — tighter tracking, more weight */
.entry-content h1,
.entry-content h2,
.entry-content h3,
.wp-block-group h2,
.site-main h2 {
  letter-spacing: -0.02em !important;
  font-weight: 700 !important;
}

/* Gold horizontal rule */
.wp-block-separator:not(.is-style-dots) {
  border-color: var(--brand-gold-dark) !important;
  opacity: 0.35 !important;
  margin: 2.5rem auto !important;
}

/* Navigation gold hover accent */
.main-navigation ul li a,
#site-navigation ul li a {
  position: relative;
}

.main-navigation ul li a::after,
#site-navigation ul li a::after {
  content: '';
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 0;
  height: 1.5px;
  background-color: var(--brand-gold);
  transition: width 0.22s ease;
}

.main-navigation ul li a:hover::after,
#site-navigation ul li a:hover::after {
  width: 100%;
}

/* Header bottom border — antique-gold hairline (separates the dark header
   from the dark hero sections; echoes the logo's horizon line) */
.site-header,
#masthead {
  border-bottom: 1px solid rgba(184, 144, 106, 0.5) !important;
  box-shadow: none !important;
}

/* ============================================================
   RESPONSIVE — TABLET (max 900px)
   ============================================================ */

@media (max-width: 900px) {
  .offer-cards-grid {
    grid-template-columns: 1fr;
    max-width: 520px;
  }

  .footer-grid {
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
  }

  .coaching-cards-grid {
    grid-template-columns: 1fr;
    max-width: 520px;
  }

  .two-col-split {
    grid-template-columns: 1fr;
    gap: 2rem;
  }

  .optin-section__inner {
    grid-template-columns: 1fr;
    gap: 2.5rem;
  }

  .pain-points-grid {
    grid-template-columns: 1fr;
  }
}

/* ============================================================
   RESPONSIVE — MOBILE (max 600px)
   ============================================================ */

@media (max-width: 600px) {
  :root {
    --section-padding: 56px 0;
  }

  body {
    font-size: 16px;
  }

  .footer-grid {
    grid-template-columns: 1fr;
    padding: 3rem 1.5rem 2rem;
    gap: 2rem;
  }

  .footer-bottom-bar {
    flex-direction: column;
    text-align: center;
  }

  .footer-legal-links {
    justify-content: center;
  }

  .hero-cta-group {
    flex-direction: column;
    align-items: flex-start;
  }

  .social-proof-bar__inner {
    flex-direction: column;
    gap: 0.75rem;
    text-align: center;
  }

  .social-proof-bar .divider {
    display: none;
  }
}

/* ============================================================
   KIT NATIVE FORM STYLING
   Matches brand: violet buttons, ivory background, plum text
   ============================================================ */

.formkit-form {
  font-family: Georgia, "Times New Roman", serif !important;
}

.formkit-form[data-uid] .formkit-field input[type="text"],
.formkit-form[data-uid] .formkit-field input[type="email"] {
  border: 1.5px solid var(--brand-gold) !important;
  border-radius: 6px !important;
  padding: 0.75em 1em !important;
  font-family: Georgia, serif !important;
  color: var(--brand-plum) !important;
  background: #fff !important;
}

.formkit-form[data-uid] .formkit-submit,
.formkit-form[data-uid] [data-element="submit"] .formkit-submit {
  background-color: var(--brand-violet) !important;
  color: var(--brand-ivory) !important;
  border-radius: 50px !important;
  font-family: Arial, "Helvetica Neue", sans-serif !important;
  font-weight: 600 !important;
  letter-spacing: 0.05em !important;
  padding: 0.85em 2em !important;
  border: none !important;
  cursor: pointer !important;
  transition: background-color 0.2s ease !important;
}

.formkit-form[data-uid] .formkit-submit:hover {
  background-color: var(--brand-midnight) !important;
}

.formkit-form[data-uid] .formkit-guarantee {
  color: rgba(42,28,48,0.6) !important;
  font-size: 0.8rem !important;
}

/* ============================================================
   SOVLINE METHODOLOGY — visual consistency
   ============================================================ */

/* Divider bars: bolder text, larger, more letter-spacing */
.sovline-the-line p {
  font-weight: 700 !important;
  font-size: 0.92rem !important;
  letter-spacing: 0.25em !important;
}

/* Make the gold horizontal lines thicker */
.sovline-the-line::before,
.sovline-the-line::after {
  height: 2px !important;
  opacity: 0.6 !important;
}

/* Column grid: allow wrapping so 7 cols don't overflow */
.sovline-section .wp-block-columns {
  flex-wrap: wrap !important;
  align-items: flex-start !important;
  gap: 1.5rem !important;
}

.sovline-section .wp-block-columns .wp-block-column {
  flex: 1 1 130px !important;
  min-width: 130px !important;
}

/* Below the Line: match Above the Line colors exactly */
.sovline-section .wp-block-columns:last-of-type h4 {
  color: #F0C0C8 !important;
  font-size: 1rem !important;
}

.sovline-section .wp-block-columns:last-of-type p {
  color: rgba(250, 244, 238, 0.75) !important;
  font-size: 0.9rem !important;
}

/* Above the Line h4: ensure consistent size */
.sovline-section .wp-block-columns:first-of-type h4 {
  font-size: 1rem !important;
}

/* ============================================================
   DESKTOP SPACING — reduce section padding site-wide
   ============================================================ */

/* Target sections by their class names (more reliable than attribute selectors) */
.offer-cards-section,
.testimonials-section,
.optin-section,
.section-blush,
.sovline-section,
.section-mauve {
  padding-top:    40px !important;
  padding-bottom: 40px !important;
}

/* Hero section: fix the double-padding stack (80px outer + 60px inner = 140px) */
.hero-section {
  padding-top: 32px !important;
  padding-bottom: 0 !important;
}

.hero-section .wp-block-columns {
  padding-top: 16px !important;
  padding-bottom: 0 !important;
}

/* Tighten eyebrow → H1 gap in hero */
.hero-section .eyebrow {
  margin-bottom: 0.4em;
}

.hero-section h1 {
  margin-top: 0.2em;
}

/* Consistent left padding on hero content (matches page gutter) */
.hero-section .wp-block-column:first-child {
  padding-left: 1.5rem;
}

/* Center the entire hero text column to match all other sections */
.hero-section .wp-block-column:first-child {
  text-align: center;
}

/* H1 and subhead have max-widths, so center them as blocks too */
.hero-section h1,
.hero-section .hero-subhead {
  margin-left: auto;
  margin-right: auto;
}

/* Center the gold accent line under the hero eyebrow */
.hero-section .eyebrow::after {
  margin-left: auto;
  margin-right: auto;
}

/* ============================================================
   OFFER CARDS — equal height + consistent padding
   ============================================================ */

/* Stretch columns so all cards reach the same height */
.offer-cards-grid.wp-block-columns {
  align-items: stretch !important;
}

.offer-cards-grid .wp-block-column {
  display: flex !important;
  flex-direction: column !important;
}

.offer-cards-grid .wp-block-column > .wp-block-group.offer-card {
  flex: 1 !important;
}

/* Uniform padding on all cards */
.offer-card {
  padding: 2rem !important;
}

/* Gold top bar on non-featured cards via pseudo-element */
.offer-card:not(.offer-card--featured) {
  padding-top: 2.5rem !important;
  position: relative;
}

.offer-card:not(.offer-card--featured)::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 5px;
  background-color: var(--brand-gold);
  border-radius: 8px 8px 0 0;
}

/* Featured card: slightly more top padding */
.offer-card--featured {
  padding: 2.5rem !important;
}

/* ============================================================
   MOBILE OPTIMISATION — 767px and below
   Fixes whitespace, layout, and readability on phones
   ============================================================ */

@media (max-width: 767px) {

  /* ── Prevent horizontal scroll ─────────────────────────── */
  html, body, .wp-site-blocks, .site-main {
    overflow-x: hidden;
    max-width: 100%;
  }

  /* ── Override WordPress spacing presets (Gutenberg inline vars) */
  :root {
    --section-padding:        40px 0;
    --wp--preset--spacing--80: 2.5rem;
    --wp--preset--spacing--70: 2rem;
    --wp--preset--spacing--60: 1.5rem;
    --wp--preset--spacing--50: 1.25rem;
  }

  /* ── Gutenberg block groups — reduce large padding ───────── */
  .wp-block-group {
    padding-top:    40px !important;
    padding-bottom: 40px !important;
    padding-left:   1.25rem !important;
    padding-right:  1.25rem !important;
  }

  /* Zero-padding blocks stay at zero */
  .wp-block-group[style*="padding-top:0"],
  .wp-block-group[style*="padding-top: 0"] {
    padding-top: 0 !important;
  }
  .wp-block-group[style*="padding-bottom:0"],
  .wp-block-group[style*="padding-bottom: 0"] {
    padding-bottom: 0 !important;
  }

  /* ── Spacers: cut in half on mobile ──────────────────────── */
  .wp-block-spacer {
    height: 24px !important;
    min-height: unset !important;
  }

  /* ── Inner containers: safe horizontal padding ──────────── */
  .wp-block-group__inner-container,
  .kb-inside-container,
  .kb-row-layout-wrap,
  .section-container {
    padding-left:  1.25rem !important;
    padding-right: 1.25rem !important;
    max-width: 100% !important;
  }

  /* ── Columns: stack vertically ───────────────────────────── */
  .wp-block-columns {
    flex-direction: column !important;
    gap: 1.5rem !important;
  }

  .wp-block-column {
    flex-basis: 100% !important;
    width:       100% !important;
    min-width:   unset !important;
  }

  /* ── Header: compact logo ───────────────────────────────── */
  .site-header .custom-logo-link img,
  .site-header .custom-logo,
  .kadence-custom-logo img,
  .site-branding a.brand img {
    width:     180px !important;
    max-width: 180px !important;
  }

  .site-header .site-header-row-container-inner {
    padding-top:    6px !important;
    padding-bottom: 6px !important;
  }

  /* ── Typography: tighter on small screens ───────────────── */
  h1 { font-size: clamp(1.75rem, 7vw, 2.2rem) !important; }
  h2 { font-size: clamp(1.4rem,  6vw, 1.9rem) !important; }
  h3 { font-size: clamp(1.15rem, 5vw, 1.5rem) !important; }

  /* ── Hero CTA buttons: stack and stretch ────────────────── */
  .hero-cta-group {
    flex-direction: column !important;
    align-items:    stretch !important;
    gap: 0.75rem !important;
  }

  .hero-cta-group .wp-block-button,
  .hero-cta-group .wp-block-buttons {
    width: 100% !important;
  }

  .hero-cta-group .wp-block-button__link,
  .wp-block-buttons .wp-block-button__link {
    display:    block !important;
    text-align: center !important;
    width:      100% !important;
  }

  /* ── Buttons block: stack on mobile ─────────────────────── */
  .wp-block-buttons {
    flex-direction: column !important;
    align-items:    stretch !important;
    gap: 0.75rem !important;
  }

  .wp-block-buttons .wp-block-button {
    width: 100% !important;
  }

  .wp-block-buttons .wp-block-button__link {
    display:    block !important;
    text-align: center !important;
    width:      100% !important;
    box-sizing: border-box !important;
  }

  /* ── Custom grids: single column ────────────────────────── */
  .offer-cards-grid,
  .coaching-cards-grid,
  .pain-points-grid,
  .testimonials-grid {
    grid-template-columns: 1fr !important;
    max-width: 100% !important;
  }

  .optin-section__inner,
  .two-col-split {
    grid-template-columns: 1fr !important;
    gap: 2rem !important;
  }

  /* ── Community hero: less top padding ───────────────────── */
  .community-hero {
    padding: 40px 1.25rem !important;
  }

  /* Community waitlist form: stack, full-width button (fold = headline + 1 CTA) */
  .cw-form { flex-direction: column; max-width: 340px; }
  .cw-input { flex: 0 0 auto; width: 100%; }
  .cw-btn   { flex: 0 0 auto; width: 100%; }

  /* ── Footer: compact ────────────────────────────────────── */
  .ybl-footer-main {
    padding: 2.5rem 1.25rem 1.5rem !important;
  }

  /* EXPLORE | CONNECT side by side; logo + badge each get a full-width row
     (reduces mobile scroll) */
  .ybl-footer-grid {
    grid-template-columns: 1fr 1fr !important;
    gap: 1.75rem 1.5rem !important;
  }
  .ybl-footer-col--brand,
  .ybl-footer-col--badge {
    grid-column: 1 / -1 !important;
  }

  /* ── Images: never overflow ─────────────────────────────── */
  img {
    max-width: 100% !important;
    height: auto !important;
  }

  /* ── WooCommerce: tighten checkout on mobile ─────────────── */
  .woocommerce-checkout .woocommerce,
  .woocommerce-cart .woocommerce {
    padding: 0 1rem !important;
  }

  /* ── Social proof bar: centre on mobile ─────────────────── */
  .social-proof-bar__inner {
    flex-direction: column !important;
    gap: 0.5rem !important;
    text-align: center !important;
    padding: 0 1rem !important;
  }

  .social-proof-bar .divider { display: none !important; }

  /* ── Kit forms: full width on mobile ────────────────────── */
  .formkit-form {
    padding: 0 !important;
  }
}

/* ============================================================
   SOV-LINE™ Framework Widget v3
   ============================================================ */

.sovline-widget {
  width: 100%;
  max-width: 100%;
  padding: 1.5rem 2rem;
  box-sizing: border-box;
}

/* Badge */
.sovline-widget__badge-wrap {
  text-align: center;
  margin-bottom: 1.75rem;
}
.sovline-widget__badge-wrap img {
  display: block;
  width: 120px;
  height: auto;
  margin: 0 auto 0.5rem;
}
.sovline-widget__badge-name {
  display: block;
  font-family: Arial, "Helvetica Neue", sans-serif;
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 3px;
  color: #FAF4EE;
  margin-bottom: 0.2rem;
}
.sovline-widget__badge-tagline {
  display: block;
  font-family: Georgia, serif;
  font-style: italic;
  font-size: 13px;
  color: #B8906A;
}

/* Header / footer bar  ▲ ABOVE THE LINE · … */
.sovline-widget__bar {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin: 0.6rem 0;
}
.sovline-widget__bar-rule {
  flex: 1;
  height: 1px;
  background: #B8906A;
  opacity: 0.7;
}
.sovline-widget__bar-label {
  font-family: Arial, "Helvetica Neue", sans-serif;
  font-weight: 700;
  font-size: 10px;
  letter-spacing: 2px;
  color: #B8906A;
  white-space: nowrap;
}

/* 7-column card grid */
.sovline-widget__cards {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 5px;
}

/* Individual cards */
.sovline-widget__card {
  border-radius: 6px;
  padding: 0.75rem 0.5rem;
  text-align: center;
}
.sovline-widget__card--above {
  background: #1E1630;
  border: 0.5px solid #5C3060;
  border-top: 2px solid #B8906A;
}
.sovline-widget__card--below {
  background: #080412;
  border: 0.5px solid #2A1240;
  border-bottom: 2px solid #5C3060;
}
.sovline-widget__card-title {
  font-family: Arial, "Helvetica Neue", sans-serif;
  font-weight: 700;
  font-size: 12px;
  line-height: 1.3;
  margin: 0 0 0.3rem;
}
.sovline-widget__card--above .sovline-widget__card-title { color: #F0C0C8; }
.sovline-widget__card--below .sovline-widget__card-title { color: #9080A0; }

.sovline-widget__card-desc {
  font-family: Georgia, serif;
  font-style: italic;
  font-size: 11px;
  line-height: 1.4;
  margin: 0;
}
.sovline-widget__card--above .sovline-widget__card-desc { color: #C8A8B8; }
.sovline-widget__card--below .sovline-widget__card-desc { color: #604878; }

/* Polarity arrows row */
.sovline-widget__arrows {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 5px;
  margin: 3px 0;
}
.sovline-widget__arrow {
  text-align: center;
  font-size: 10px;
  color: #B8906A;
  opacity: 0.5;
  padding: 2px 0;
}

/* THE SOVEREIGNTY LINE divider */
.sovline-widget__sov-line {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  background: #100A20;
  padding: 0.65rem 0.25rem;
  margin: 2px 0;
}
.sovline-widget__sov-rule {
  flex: 1;
  height: 3px;
  background: #B8906A;
}
.sovline-widget__sov-label {
  font-family: Arial, "Helvetica Neue", sans-serif;
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 3px;
  color: #B8906A;
  white-space: nowrap;
}

/* CTA button */
.sovline-widget__cta-wrap {
  text-align: center;
  margin-top: 1.75rem;
}
.sovline-widget__cta {
  display: inline-block;
  background: #5C3060;
  color: #F0C0C8 !important;
  font-family: Arial, "Helvetica Neue", sans-serif;
  font-size: 0.875rem;
  text-decoration: none !important;
  border-radius: 24px;
  padding: 12px 32px;
  transition: background 0.2s;
}
.sovline-widget__cta:hover {
  background: #7A4080;
  color: #F0C0C8 !important;
}

/* Intro sentence (coaching page) */
.sovline-widget-intro {
  color: rgba(250, 244, 238, 0.85);
  font-family: Georgia, serif;
  font-style: italic;
  font-size: 1rem;
  line-height: 1.7;
  text-align: center;
  max-width: 680px;
  margin: 0 auto 2rem;
}

/* Mobile — 4 columns at ≤900px */
@media (max-width: 900px) {
  .sovline-widget__cards,
  .sovline-widget__arrows {
    grid-template-columns: repeat(4, 1fr);
  }
  .sovline-widget__bar-label {
    font-size: 8px;
    letter-spacing: 1px;
  }
}

/* §30: Methodology grid — single-column stack on mobile (≤768px).
   Reading order: ▲ header → 7 Above cards → SOVEREIGNTY LINE → 7 Below
   cards → ▼ header. Polarity-arrow rows are a desktop column-linking
   device with no place in a single-column read, so they are hidden. */
@media (max-width: 768px) {
  .sovline-widget__cards {
    grid-template-columns: 1fr;   /* single column, full width */
    gap: 12px;                    /* §30: 12-16px between stacked cards */
  }
  .sovline-widget__arrows {
    display: none;                /* arrows don't map to a single-column read */
  }
  /* Cards have full width now — keep labels readable (don't shrink) */
  .sovline-widget__bar-label {
    font-size: 10px;
    letter-spacing: 1px;
    white-space: normal;
    text-align: center;
  }
  .sovline-widget__sov-label {
    font-size: 11px;
    letter-spacing: 2px;
    white-space: normal;
    text-align: center;
  }
  /* Edge gutter consistent with the rest of the site's mobile margin */
  .sovline-widget {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
  }
}

/* ============================================================
   ABOUT PAGE (page-id-25696) — cosmetic fixes
   Scoped to the About page only; Coaching is untouched.
   ============================================================ */

/* Fix 1: normalize hardcoded inline section padding to 40px (matches Home, §22) */
body.page-id-25696 .wp-block-group[style*="padding-top:80px"],
body.page-id-25696 .wp-block-group[style*="padding-top:60px"] {
  padding-top: 40px !important;
}
body.page-id-25696 .wp-block-group[style*="padding-bottom:80px"],
body.page-id-25696 .wp-block-group[style*="padding-bottom:60px"] {
  padding-bottom: 40px !important;
}

/* Fix 2: Your Guide / My Story — story columns side breathing room (>=24px) */
body.page-id-25696 .section-blush .wp-block-columns .wp-block-column {
  padding-left: 24px !important;
  padding-right: 24px !important;
}

/* Fix 3: "What Becomes Possible" cards — equal height within each row */
body.page-id-25696 .wp-block-column:has(> .wp-block-group[style*="border-left:3px solid #B8906A"]) {
  display: flex;
  align-items: stretch;
}
body.page-id-25696 .wp-block-group[style*="border-left:3px solid #B8906A"] {
  width: 100%;
}

/* Fix 4: "When women come to me…" intro paragraph — side breathing room (>=24px) */
body.page-id-25696 p[style*="margin-top:0.5rem;margin-bottom:3rem"] {
  padding-left: 24px !important;
  padding-right: 24px !important;
}

/* ============================================================
   SOV-LINE™ WIDGET — larger text + badge (About AND Coaching)
   ============================================================ */

/* Fix 5: increase widget card text and badge size */
.sovline-widget__card-title   { font-size: 14px; }   /* was 12px */
.sovline-widget__card-desc    { font-size: 13px; }   /* was 11px */
.sovline-widget__badge-wrap img { width: 160px; }    /* was 120px */
.sovline-widget__badge-name   { font-size: 15px; }   /* was 13px */
.sovline-widget__badge-tagline { font-size: 14px; }  /* was 13px */

/* Fix 6: Coaching framework — "SOV-LINE™ maps two ways…" paragraph side padding */
body.page-id-25728 .sovline-widget-intro {
  padding-left: 24px !important;
  padding-right: 24px !important;
}

/* ============================================================
   ABOUT PAGE — "The Work" section: 3 centered client cards
   (replaces the old 2-column sentences + testimonial layout)
   ============================================================ */

/* Fix 8: The Work — 3 client cards */
.the-work-clients-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
  max-width: 960px;
  margin: 2rem auto 0;
  text-align: center;
}
.the-work-client-card {
  background: var(--brand-mauve);
  border-radius: var(--border-radius);
  padding: 1.75rem 1.5rem;
  font-family: var(--font-display);
  color: var(--brand-plum);
  font-size: 1rem;
  line-height: 1.65;
}
.the-work-client-card strong {
  display: block;
  margin-bottom: 0.4rem;
  color: var(--brand-violet);
}

/* Mobile: stack the client cards to a single column */
@media (max-width: 767px) {
  .the-work-clients-grid {
    grid-template-columns: 1fr !important;
  }
}

/* ============================================================
   37. MOBILE HEADER — hamburger trigger + "Email Us" button
   Native Kadence mobile-trigger styled to brand (not blue).
   ============================================================ */

/* Hamburger is an SVG (fill:currentColor) — color it via the button's
   `color`, NOT background. Brand plum; gold on hover/focus. */
/* Light hamburger on the dark header. The toggle is an SVG (.kadence-menu-svg);
   there is no .menu-toggle-open element here, so set the fill DIRECTLY. */
.mobile-toggle-open-container {
  color: var(--brand-ivory) !important;
  padding: 8px 10px !important;
  min-width: 44px;
  min-height: 44px;
}
.mobile-toggle-open-container .menu-toggle-icon { background: none !important; }
.mobile-toggle-open-container .kadence-menu-svg,
.mobile-toggle-open-container svg {
  fill: var(--brand-ivory) !important;
  color: var(--brand-ivory) !important;
}
.mobile-toggle-open-container:hover .kadence-menu-svg,
.mobile-toggle-open-container:focus-within .kadence-menu-svg {
  fill: var(--brand-gold) !important;
}

/* Mobile header fit: the full logo (with the wide gold tagline) + Email Us + ☰
   overflow the phone width, pushing the ☰ off the right edge. On mobile we swap
   to a tagline-less, narrower logo (painted as a background on the logo link),
   tighten the gap, and keep items off the screen edges so all three fit. */
@media (max-width: 1024px) {
  #masthead .site-header-row-container-inner {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }
  /* Hide the full logo image (the #masthead id beats the desktop
     ".site-branding a.brand img.svg-logo-image" display rule) and paint the
     tagline-less mobile logo as a background on the link. */
  #masthead .site-branding a.brand img.custom-logo,
  #masthead .site-branding a.brand img.svg-logo-image { display: none !important; }
  #masthead .site-branding a.brand {
    display: inline-block !important;
    width: 188px;
    height: 62px;
    background-image: url("/wp-content/themes/kadence-child/assets/images/logo-primary-mobile-light.svg");
    background-repeat: no-repeat;
    background-position: left center;
    background-size: contain;
  }
  .site-header-main-section-right { column-gap: 0.3rem !important; }
  /* Smaller EMAIL US on mobile so the (now larger) logo + ☰ all fit */
  .mobile-header-button-wrap a.button {
    font-size: 0.72rem !important;
    letter-spacing: 0.5px !important;
    padding: 0.5em 1em !important;
  }
}

/* Phones (≤500px): shrink the logo + tighten the pill/gaps so the logo,
   EMAIL US pill, and hamburger all fit without clipping off the right edge. */
@media (max-width: 500px) {
  #masthead .site-header-row-container-inner {
    padding-left: 0.75rem !important;
    padding-right: 0.75rem !important;
  }
  #masthead .site-branding a.brand {
    width: 150px !important;
    height: 50px !important;
  }
  .site-header-main-section-right { column-gap: 0.2rem !important; }
  .mobile-header-button-wrap a.button {
    font-size: 0.6rem !important;
    letter-spacing: 0.3px !important;
    padding: 0.4em 0.7em !important;
    min-height: 32px !important;
  }
  .mobile-toggle-open-container { padding: 6px 4px !important; min-width: 38px; }
}

/* "Email Us" header button — outlined brand pill (mobile + desktop) */
.header-button-wrap a.button,
.mobile-header-button-wrap a.button {
  background-color: transparent !important;
  background-image: none !important;
  color: var(--brand-ivory) !important;
  border: 1.5px solid rgba(250, 244, 238, 0.6) !important;
  border-radius: var(--border-radius-pill) !important;
  font-family: var(--font-ui) !important;
  font-weight: 500 !important;
  font-size: 0.85rem !important;
  letter-spacing: 1px !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;          /* never wrap to two lines */
  padding: 0.65em 1.5em !important;
  box-shadow: none !important;
  display: inline-flex;
  align-items: center;
  min-height: 38px;
}
.header-button-wrap a.button:hover,
.header-button-wrap a.button:focus,
.mobile-header-button-wrap a.button:hover,
.mobile-header-button-wrap a.button:focus {
  background-color: var(--brand-gold) !important;
  border-color: var(--brand-gold) !important;
  color: var(--brand-midnight) !important;
}

/* ============================================================
   38. HOMEPAGE — make each offer card fully tappable
   The Books / Coaching / Digital Products cards already act as
   the site's primary visual nav (esp. stacked on mobile). This
   stretches each card's existing link across the whole card so
   tapping anywhere on the block navigates. No extra markup.
   ============================================================ */

.offer-card { position: relative; cursor: pointer; }

/* Stretch the card's single CTA link to cover the entire card.
   The anchor itself stays static so ::after positions against
   .offer-card (the nearest positioned ancestor), not the link. */
.offer-card a[href]::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
}

/* ============================================================
   39. REMOVE THE WHITE "BOXED" PAGE FRAME (site-wide)
   Kadence's default boxed content style draws the page inside a
   white .content-bg container (#fff) with padding + drop-shadow,
   which reads as a white border around the cream content. Recolor
   that container to ivory and drop the shadow so the page is one
   seamless cream surface, edge to edge. (Per CLAUDE.md §23.)
   ============================================================ */

.content-bg {
  background-color: var(--brand-ivory) !important;
  box-shadow: none !important;
}
/* Drop the boxed drop-shadow on the page/post entry wrappers */
.entry.single-entry,
.entry.loop-entry,
.content-bg.entry {
  box-shadow: none !important;
}
/* Remove the white side gutter so sections reach the edges */
.single-entry .entry-content-wrap,
.content-bg .entry-content-wrap {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* ============================================================
   40. WOOCOMMERCE PAGES ON-BRAND (cart / checkout / shop / account)
   The Kadence global palette is now brand-mapped (set via theme
   mod), so default UI is brand-colored. These rules guarantee the
   purchase-flow CTAs are brand violet→gold pills, and the page sits
   on ivory like the rest of the site (no leftover blue/grey).
   ============================================================ */

.woocommerce,
.woocommerce-page {
  background-color: var(--brand-ivory);
}
.woocommerce .button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce a.button,
.wc-block-components-button,
.wp-block-woocommerce-cart .wc-block-components-button {
  background-color: var(--brand-violet) !important;
  color: var(--brand-ivory) !important;
  border-radius: var(--border-radius-pill) !important;
  border-color: var(--brand-violet) !important;
}
.woocommerce .button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce a.button:hover,
.wc-block-components-button:hover {
  background-color: var(--brand-gold) !important;
  color: var(--brand-midnight) !important;
  border-color: var(--brand-gold) !important;
}
/* Links in WooCommerce content use brand violet, not default blue */
.woocommerce a:not(.button):not(.wc-block-components-button) {
  color: var(--brand-violet);
}
/* Cart/checkout/empty-cart containers inherit the ivory page — no white card
   in the center, and no light placeholder boxes on the empty/loading state. */
.wp-block-woocommerce-cart,
.wp-block-woocommerce-checkout,
.wp-block-woocommerce-empty-cart-block,
.wc-block-cart,
.wc-block-checkout,
.wc-block-cart__sidebar .components-card,
.wp-block-woocommerce-cart.is-loading .wp-block-woocommerce-cart-line-items-block,
.wp-block-woocommerce-cart.is-loading .wp-block-woocommerce-proceed-to-checkout-block {
  background-color: transparent !important;
  background-image: none !important;
}

/* ============================================================
   41. MOBILE DRAWER (hamburger menu) — visible, on-brand
   The drawer menu links default to palette8 (now ivory), which is
   invisible on a light panel. Give the drawer an ivory panel with
   readable plum links + subtle dividers.
   ============================================================ */

#mobile-drawer .drawer-inner,
#mobile-drawer .drawer-content {
  background-color: var(--brand-ivory) !important;
}
#mobile-drawer .drawer-header {
  border-bottom: 1px solid rgba(42, 28, 48, 0.12);
}
/* Close (X) icon + menu links in brand plum */
#mobile-drawer .drawer-toggle,
#mobile-drawer .menu-toggle-close {
  color: var(--brand-plum) !important;
}
.mobile-navigation ul li:not(.nav-book-call) > a,
.mobile-navigation ul li.menu-item-has-children > .drawer-nav-drop-wrap {
  color: var(--brand-plum) !important;
}
.mobile-navigation ul li.current-menu-item:not(.nav-book-call) > a {
  color: var(--brand-violet) !important;
}
/* "Book a Call" pill keeps ivory text on its violet background */
.mobile-navigation ul li.nav-book-call > a {
  color: var(--brand-ivory) !important;
}
.mobile-navigation ul li:not(.menu-item-has-children) a,
.mobile-navigation ul li.menu-item-has-children .drawer-nav-drop-wrap {
  border-bottom: 1px solid rgba(42, 28, 48, 0.12) !important;
}

/* Center, enlarge, and uppercase the drawer menu (mirrors the reference) */
#mobile-drawer .drawer-content,
.mobile-navigation,
.mobile-navigation .mobile-menu-container,
.mobile-navigation ul.menu,
.mobile-navigation ul li { text-align: center !important; }

/* Regular menu items: large, centered, uppercase (Book a Call pill excluded) */
.mobile-navigation ul li:not(.nav-book-call) > a {
  font-family: var(--font-ui);
  font-size: 1.4rem !important;
  font-weight: 500 !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  text-align: center !important;
  justify-content: center !important;
  padding-top: 1.05em !important;
  padding-bottom: 1.05em !important;
}

/* "Book a Call" centered pill in the drawer — sized to match the other menu
   items (the compact header pill stays small; this is the drawer context). */
.mobile-navigation ul li.nav-book-call { padding: 1em 0; }
.mobile-navigation ul li.nav-book-call > a {
  display: inline-block !important;
  width: auto !important;
  border-bottom: 0 !important;
  font-size: 1.35rem !important;
  letter-spacing: 2px !important;
  padding: 0.55em 1.4em !important;
}

/* Drawer backdrop: ivory instead of the default gray overlay */
#mobile-drawer .drawer-overlay,
#mobile-drawer.popup-drawer .drawer-overlay {
  background-color: var(--brand-ivory) !important;
}

/* ============================================================
   42. PRIMARY NAVIGATION — uppercase menu items (desktop + mobile)
   ============================================================ */
.main-navigation .primary-menu-container > ul > li.menu-item > a,
.header-navigation .primary-menu-container > ul > li.menu-item > a {
  text-transform: uppercase !important;
  letter-spacing: 1px;
}

/* ============================================================
   43. HOMEPAGE HERO — full-bleed split panel (CLAUDE.md §23/§26)
   Left: full-bleed photo (Zsuzsanna.jpg). Right: solid midnight
   panel, ivory text, ONE CTA. No SOV-LINE diagram (moved to
   "Your Guide"). Mobile: photo top + panel below; headline + one
   CTA visible with zero scroll at 375px (subhead hidden on mobile).
   ============================================================ */

.ybl-hero {
  display: grid;
  grid-template-columns: 1fr 1fr;
  width: 100%;
  min-height: 72vh;
  margin: 0;
}
/* Hero sits flush under the header (remove the boxed top/bottom gap on home;
   same treatment on the About page so .about-hero / contrast bars run edge to
   edge within the contained content area). */
.home .single-entry .entry-content-wrap,
.home .content-bg .entry-content-wrap,
body.page-id-25696 .single-entry .entry-content-wrap,
body.page-id-25696 .content-bg .entry-content-wrap {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
.ybl-hero__photo {
  background-size: cover;
  background-position: center 18%;
  background-repeat: no-repeat;
  min-height: 72vh;
}
.ybl-hero__panel {
  background-color: var(--brand-midnight);
  color: var(--brand-ivory);
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 3rem 3.5rem;
}
.ybl-hero__eyebrow {
  font-family: var(--font-ui);
  text-transform: uppercase;
  letter-spacing: 3px;
  font-size: 0.85rem;
  color: var(--brand-gold);
  margin: 0 0 1rem;
}
.ybl-hero__title {
  font-family: var(--font-display);
  color: var(--brand-ivory);
  font-size: 2.3rem;
  line-height: 1.18;
  margin: 0 0 1.25rem;
  max-width: 18ch;
}
.ybl-hero__subhead {
  font-family: var(--font-serif);
  font-size: 1.05rem;
  line-height: 1.6;
  color: rgba(250, 244, 238, 0.9);
  margin: 0 0 1.85rem;
  max-width: 42ch;
}
.ybl-hero__cta {
  align-self: flex-start;
  display: inline-block;
  background-color: var(--brand-violet);
  color: var(--brand-ivory) !important;
  font-family: var(--font-ui);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-size: 0.95rem;
  text-decoration: none;
  border-radius: var(--border-radius-pill);
  padding: 0.95em 2.1em;
  transition: background-color var(--transition);
}
.ybl-hero__cta:hover,
.ybl-hero__cta:focus {
  background-color: var(--brand-gold);
  color: var(--brand-midnight) !important;
}

/* Tablet: ease the headline down a touch */
@media (max-width: 1024px) {
  .ybl-hero__panel { padding: 2.5rem 2rem; }
  .ybl-hero__title { font-size: 2rem; }
}

/* Mobile (≤767px): stack photo over panel; headline + ONE CTA in the
   fold, zero scroll at 375px. Subhead hidden (echoed in Your Guide). */
@media (max-width: 767px) {
  /* Photo (taller, shows more than the head) → small ivory break → panel fills
     the rest of the screen (minus the ~80px header) so it's all in view. */
  .ybl-hero {
    grid-template-columns: 1fr;
    grid-template-rows: 46svh 1fr;
    row-gap: 14px;
    min-height: calc(100svh - 80px);
  }
  .ybl-hero__photo {
    min-height: 0;
    height: auto;
    background-position: center 12%;
  }
  .ybl-hero__panel {
    justify-content: center;
    padding: 1.75rem 1.4rem 2rem;
  }
  .ybl-hero__eyebrow { font-size: 0.8rem; }
  .ybl-hero__title {
    font-size: 1.4rem !important;
    line-height: 1.25 !important;
    max-width: 100%;
    margin-bottom: 1.75rem;
  }
  .ybl-hero__subhead { display: none; }
  .ybl-hero__cta {
    align-self: stretch;
    text-align: center;
    font-size: 0.95rem;
    padding: 1em 1.5em;
  }
}

/* ============================================================
   44. HOMEPAGE FIXES (eyebrow swish, Your Guide diagram, section
   spacing, featured CTA contrast) — owner feedback 2026-06-18
   ============================================================ */

/* 1. Gold accent "swish" under the hero eyebrow + tighten eyebrow→headline gap */
.ybl-hero__eyebrow { margin: 0 0 0.25rem !important; }
.ybl-hero__eyebrow::after {
  content: "";
  display: block;
  width: 36px;
  height: 1.5px;
  background: linear-gradient(90deg, var(--brand-gold), transparent);
  margin-top: 4px;
}

/* 2 + 3. Your Guide: the diagram figure is shrink-to-fit (aligncenter) — make it
   fill its column so it reads large; widen its column; add a gold methodology
   label beneath it (the transparent diagram now reads as decoration without it). */
.your-guide-section .wp-block-column:first-child { flex-basis: 50% !important; }
.your-guide-section .wp-block-column:last-child  { flex-basis: 50% !important; }
.your-guide-diagram {
  width: 100% !important;
  max-width: 100% !important;
  display: block !important;
  margin: 0 !important;
}
.your-guide-diagram img {
  width: 100% !important;
  max-width: 100% !important;
  height: auto;
}
.your-guide-diagram::after {
  content: "THE SOV-LINE\2122 METHODOLOGY";
  display: block;
  text-align: center;
  font-family: var(--font-ui);
  text-transform: uppercase;
  letter-spacing: 3px;
  font-size: 0.8rem;
  color: var(--brand-gold);
  margin-top: 0.5rem;
}

/* 3b. BOOKS card carries inline padding-top:0; the mobile zero-padding rule then
   squeezes its eyebrow against the gold bar. Force consistent top padding. */
.offer-cards-grid .offer-card:not(.offer-card--featured) {
  padding-top: 2.5rem !important;
}

/* 4. Uniform ~40px gaps between homepage sections (symmetric 20px top/bottom;
   replaces the fragile negative-margin approach so it holds on mobile too). */
.home .your-guide-section,
.home .offer-cards-section,
.home .optin-section {
  margin-top: 0 !important;
  padding-top: 20px !important;
  padding-bottom: 20px !important;
}

/* 5. Featured "Explore Coaching" CTA — ivory border so the gold pill reads
   clearly against the violet card. */
.offer-card--featured .wp-block-button__link {
  border: 2px solid var(--brand-ivory) !important;
}

/* ============================================================
   45. FREE GUIDE (Kit embed) submit button — UPPERCASE
   ============================================================ */
.optin-section button,
.optin-section .formkit-submit,
.optin-section button[type="submit"],
.optin-section button[data-element="submit"] {
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
}

/* ============================================================
   46. ABOUT PAGE REBUILD (page-id-25696) — about-page-spec.md §4
   Light hero (split) → contrast bar 1 (duotone + quote) → light
   story → contrast bar 2 (violet, link forward) → footer.
   Mirrors the homepage .ybl-hero pattern (§43). Full-bleed within
   the contained content area; true full-bleed on mobile.
   ============================================================ */

/* ---- Section 1: HERO (split photo | midnight panel) ---- */
.about-hero {
  display: grid;
  grid-template-columns: 1fr 1fr;
  width: 100%;
  min-height: 72vh;
  margin: 0;
}
.about-hero__photo {
  background-size: cover;
  background-position: center 22%;
  background-repeat: no-repeat;
  min-height: 72vh;
}
.about-hero__panel {
  background-color: var(--brand-midnight);
  color: var(--brand-ivory);
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 3rem 3.5rem;
}
.about-hero__eyebrow {
  font-family: var(--font-ui);
  text-transform: uppercase;
  letter-spacing: 3px;
  font-size: 0.85rem;
  color: var(--brand-gold);
  margin: 0 0 0.25rem !important;
}
.about-hero__eyebrow::after {
  content: "";
  display: block;
  width: 36px;
  height: 1.5px;
  background: linear-gradient(90deg, var(--brand-gold), transparent);
  margin-top: 4px;
}
.about-hero__title {
  font-family: var(--font-display);
  color: var(--brand-ivory);
  font-size: 2.6rem;
  line-height: 1.16;
  margin: 0.75rem 0 1.25rem;
  max-width: 16ch;
}
.about-hero__subhead {
  font-family: var(--font-serif);
  font-size: 1.05rem;
  line-height: 1.6;
  color: rgba(250, 244, 238, 0.9);
  margin: 0 0 1.85rem;
  max-width: 40ch;
}
.about-hero__cta {
  align-self: flex-start;
  display: inline-block;
  background-color: var(--brand-violet);
  color: var(--brand-ivory) !important;
  font-family: var(--font-ui);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-size: 0.95rem;
  text-decoration: none;
  border-radius: var(--border-radius-pill);
  padding: 0.95em 2.1em;
  transition: background-color var(--transition);
}
.about-hero__cta:hover,
.about-hero__cta:focus {
  background-color: var(--brand-gold);
  color: var(--brand-midnight) !important;
}

/* ---- Section 2: STORY (ivory, the main bio) ---- */
.about-story {
  background-color: var(--brand-ivory);
}
.about-story p,
.about-story-continues p {
  font-family: var(--font-serif);
  font-size: 1.12rem;
  line-height: 1.75;
  color: var(--brand-plum);
  max-width: 62ch;
  margin-left: auto;
  margin-right: auto;
}
.about-story p em { color: var(--brand-violet); font-style: italic; }

/* ---- About: KEEP the contained layout (CLAUDE.md §23 — no full-bleed).
   Only remove the vertical ivory seam between a story section and an adjacent
   contrast bar. Widths are left at their natural contained values so the hero,
   bars, and story bands all sit within the 1290px content box. ---- */
body.page-id-25696 .about-story,
body.page-id-25696 .about-story-continues,
body.page-id-25696 .about-contrast {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}
body.page-id-25696 .about-story-continues.section-blush {
  background-color: var(--brand-blush);
}

/* ---- Section 3: CONTRAST BAR 1 (duotone photo | quote) ---- */
.about-contrast {
  display: grid;
  grid-template-columns: 1fr 1fr;
  width: 100%;
  min-height: 60vh;
  margin: 0;
}
.about-contrast__photo {
  background-image: url('/wp-content/uploads/2026/06/Zsuzsanna-683x1024.jpg');
  background-size: cover;
  background-position: center 18%;
  background-repeat: no-repeat;
  min-height: 60vh;
  /* Duotone: shadows -> midnight, highlights -> rose/gold */
  filter: grayscale(1) contrast(1.05) sepia(0.55) hue-rotate(255deg) saturate(1.4) brightness(0.95);
}
.about-contrast__panel {
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 3rem 3rem;
  background: linear-gradient(135deg, var(--brand-midnight) 0%, var(--brand-violet) 100%);
}
/* SOV-LINE horizon circle (icon only) as a pale ghost watermark behind the
   quote. Sized large so the longest quote line sits inside the circle. */
.about-contrast__panel::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: min(96%, 460px);
  aspect-ratio: 1;
  transform: translate(-50%, -50%);
  background: url('/wp-content/themes/kadence-child/assets/images/sovline-circle-watermark.svg?v=3') no-repeat center / contain;
  opacity: 0.22;
  pointer-events: none;
}
.about-contrast__quote {
  position: relative;
  z-index: 1;
  margin: 0;
  border: 0;
  padding: 0;
  text-align: center;
  max-width: 15rem;
}
.about-contrast__quote p {
  font-family: var(--font-display);
  font-style: italic;
  font-size: 1.5rem;
  line-height: 1.35;
  color: var(--brand-ivory);
  margin: 0 0 1rem;
  overflow-wrap: normal !important;
  word-break: keep-all !important;
  hyphens: none;
}
.about-contrast__cite {
  display: block;
  font-family: var(--font-ui);
  font-style: normal;
  letter-spacing: 2px;
  font-size: 0.85rem;
  color: var(--brand-rose);
  text-transform: uppercase;
}
.about-contrast__tag {
  display: block;
  margin-top: 0.6rem;
  font-family: var(--font-serif);
  font-style: italic;
  font-size: 0.95rem;
  color: var(--brand-gold);
}

/* ---- Contrast bar — text-only variant (no photo): the Wooden quote.
   Same midnight->violet panel + quote/cite treatment as the Tuell bar,
   just full-width with no photo column. Quote box is wider since the
   quote is longer than the Tuell line. ---- */
.about-contrast--quote-only {
  display: block;
  grid-template-columns: none;
  min-height: 0;
}
.about-contrast--quote-only .about-contrast__panel {
  min-height: 60vh;
}
.about-contrast--quote-only .about-contrast__quote {
  max-width: 34rem;
}

/* ---- Section 5: CONTRAST BAR 2 (solid violet, link forward) ---- */
.about-contrast--forward {
  display: block;
  min-height: 0;
  background: var(--brand-violet);
  text-align: center;
}
.about-contrast--forward__inner {
  max-width: 640px;
  margin: 0 auto;
  padding: 4rem 1.5rem;
}
.about-contrast--forward__lead {
  font-family: var(--font-display);
  font-size: 1.9rem;
  line-height: 1.25;
  color: var(--brand-ivory);
  margin: 0 0 0.5rem;
}
.about-contrast--forward__sub {
  font-family: var(--font-serif);
  font-size: 1.05rem;
  color: rgba(250, 244, 238, 0.85);
  margin: 0 0 1.75rem;
}
.about-contrast--forward__cta {
  display: inline-block;
  background-color: var(--brand-gold);
  color: var(--brand-midnight) !important;
  font-family: var(--font-ui);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-size: 0.95rem;
  text-decoration: none;
  border-radius: var(--border-radius-pill);
  padding: 0.95em 2.1em;
  transition: background-color var(--transition), color var(--transition);
}
.about-contrast--forward__cta:hover,
.about-contrast--forward__cta:focus {
  background-color: var(--brand-ivory);
  color: var(--brand-midnight) !important;
}

/* ---- Tablet ---- */
@media (max-width: 1024px) {
  .about-hero__panel { padding: 2.5rem 2rem; }
  .about-hero__title { font-size: 2.1rem; }
  .about-contrast__quote p { font-size: 1.5rem; }
}

/* ---- Mobile (<=767px): stack; hero = headline + ONE CTA, zero scroll @375px;
   subhead hidden. Contrast bars stack photo over quote, drama preserved. ---- */
@media (max-width: 767px) {
  .about-hero {
    grid-template-columns: 1fr;
    grid-template-rows: 46svh 1fr;
    row-gap: 14px;
    min-height: calc(100svh - 80px);
  }
  .about-hero__photo {
    min-height: 0;
    height: auto;
    background-position: center 20%;
  }
  .about-hero__panel {
    justify-content: center;
    padding: 1.75rem 1.4rem 2rem;
  }
  .about-hero__eyebrow { font-size: 0.8rem; }
  .about-hero__title {
    font-size: 1.6rem !important;
    line-height: 1.22 !important;
    max-width: 100%;
    margin-bottom: 1.5rem;
  }
  .about-hero__subhead { display: none; }
  .about-hero__cta {
    align-self: stretch;
    text-align: center;
    padding: 1em 1.5em;
  }

  .about-story p,
  .about-story-continues p { font-size: 1.05rem; }

  .about-contrast {
    grid-template-columns: 1fr;
    grid-template-rows: 44vh auto;
    min-height: 0;
  }
  .about-contrast__photo { min-height: 0; height: 44vh; }
  .about-contrast__panel { padding: 3.5rem 1.5rem; }
  .about-contrast__panel::before { width: min(92%, 360px); }
  .about-contrast__quote { max-width: 12.5rem; }
  .about-contrast__quote p { font-size: 1.3rem; }

  /* text-only Wooden bar: full-width panel, wider quote box for the longer quote */
  .about-contrast--quote-only .about-contrast__panel { min-height: 50vh; }
  .about-contrast--quote-only .about-contrast__quote { max-width: 88%; }

  .about-contrast--forward__inner { padding: 3rem 1.4rem; }
  .about-contrast--forward__lead { font-size: 1.5rem; }
  .about-contrast--forward__cta { display: block; }
}

/* ============================================================
   47. COACHING PAGE REBUILD (page-id-25728) — page-build-specs §28/§31
   Outcomes section (relocated from About §27), investment copy
   (no price figures, no card buttons), and FAQ restyling (§31).
   ============================================================ */

/* ---- §28 Part 2: "What Becomes Possible" outcomes grid (ivory cards,
   gold top bar, on the blush section) ---------------------------------- */
.outcomes-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
  max-width: 1000px;
  margin: 2.5rem auto 0;
}
.outcome-card {
  background: var(--brand-ivory);
  border-top: 3px solid var(--brand-gold);
  border-radius: var(--border-radius);
  padding: 2rem 1.75rem;
  text-align: left;
}
.outcome-card h3 {
  font-size: 1.2rem;
  line-height: 1.3;
  margin: 0 0 0.6rem;
  color: var(--brand-plum);
}
.outcome-card p {
  font-size: 1rem;
  line-height: 1.65;
  margin: 0;
  color: var(--brand-plum);
}

/* ---- §28 Part 3: investment copy replacing price + buttons ----------- */
.coaching-card__investment {
  font-family: Georgia, serif;
  font-style: italic;
  font-size: 1rem;
  line-height: 1.55;
  color: var(--brand-gold);
  margin: 1.5rem 0 0;
}
/* Featured (violet) card: two-class selector to beat .coaching-card--featured p */
.coaching-card--featured .coaching-card__investment {
  color: #E8CBA6;   /* light gold — legible on violet */
}

/* Equal-height cards: .coaching-cards-grid is display:grid so the two cards
   already stretch to the same box height. Make each card a flex column and
   push the investment line to the bottom so both cards' last lines align. */
.coaching-card {
  display: flex;
  flex-direction: column;
}
.coaching-card__investment {
  margin-top: auto;   /* anchor to card bottom */
  padding-top: 1.25rem;
}

/* ---- §31: FAQ accordion restyling (reuse for any future FAQ) --------- */
.faq-section .wp-block-details {
  max-width: 720px;
  margin-left: auto;
  margin-right: auto;
  background: transparent;
  border: none;
  border-bottom: 1px solid rgba(184, 144, 106, 0.3);
  border-radius: 0;
  padding: 0;
}
.faq-section .wp-block-details:last-of-type {
  border-bottom: none;
}
.faq-section summary {
  list-style: none;
  cursor: pointer;
  position: relative;
  padding: 26px 2.75rem 26px 0;
  font-family: var(--font-ui);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  font-size: 1rem;
  line-height: 1.45;
  color: var(--brand-plum);
}
.faq-section summary::-webkit-details-marker { display: none; }
.faq-section summary::after {
  content: '';
  position: absolute;
  right: 6px;
  top: 50%;
  width: 10px;
  height: 10px;
  margin-top: -8px;
  border-right: 2px solid var(--brand-gold);
  border-bottom: 2px solid var(--brand-gold);
  transform: rotate(45deg);          /* chevron points down (closed) */
  transition: transform 0.2s ease;
}
.faq-section details[open] summary::after {
  transform: rotate(225deg);         /* 180° flip — points up (open) */
}
.faq-section .wp-block-details p {
  font-family: Georgia, serif;
  font-size: 1rem;
  line-height: 1.7;
  color: var(--brand-plum);
  margin: 0 0 1.25rem;
  padding-right: 2.75rem;
}
/* Soft reveal on open (native <details> can't height-animate without JS;
   this avoids a hard snap of the answer copy) */
.faq-section details[open] > *:not(summary) {
  animation: faqReveal 0.25s ease;
}
@keyframes faqReveal {
  from { opacity: 0; transform: translateY(-4px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ---- Coaching mobile: outcomes stack ------------------------------- */
@media (max-width: 900px) {
  .outcomes-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 600px) {
  .outcomes-grid {
    grid-template-columns: 1fr !important;
    max-width: 100% !important;
  }
  .faq-section summary { font-size: 0.95rem; }
}

/* ============================================================
   47b. COACHING PAGE (page-id-25728) — hero & section spacing
   The saved section <div>s carry NO inline padding (the block
   padding lived only in the editor JSON, not the rendered HTML),
   and .section-midnight was never in the forced-padding rule — so
   the hero collapsed to ~0 internal padding (eyebrow flush to the
   top edge, CTA flush to the bottom). Give every top-level section
   uniform internal padding, drop the boxed cream gap above the
   content, and collapse inter-section margins so the colored bands
   sit flush. (Owner review 2026-06-18.)
   ============================================================ */

/* Issue 1: remove the boxed content top/bottom padding (cream above hero) */
body.page-id-25728 .single-entry .entry-content-wrap,
body.page-id-25728 .content-bg .entry-content-wrap {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* Issues 2, 3 & 4: uniform internal padding on every top-level section +
   collapse the block-gap margins so bands touch (no cream between them). */
body.page-id-25728 .entry-content > .wp-block-group {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-top: 40px !important;     /* §22 site standard */
  padding-bottom: 40px !important;
}

/* Hero: a touch more presence + tighten the stranded eyebrow→headline gap */
body.page-id-25728 .entry-content > .section-midnight:first-child {
  padding-top: 56px !important;
  padding-bottom: 56px !important;
}
body.page-id-25728 .section-midnight:first-child h1 {
  margin-top: 0.25em !important;
}
body.page-id-25728 .section-midnight:first-child .hero-cta-buttons {
  margin-top: 1.75rem;
}

@media (max-width: 767px) {
  body.page-id-25728 .entry-content > .wp-block-group {
    padding-top: 36px !important;
    padding-bottom: 36px !important;
  }
  body.page-id-25728 .entry-content > .section-midnight:first-child {
    padding-top: 44px !important;
    padding-bottom: 44px !important;
  }
  /* Cards too narrow on iPhone: the side gutter was doubled — the Kadence
     content-container edge padding (1.5rem) PLUS the section group padding
     (1.25rem) ≈ 44px each side. Zero the container gutter and use a single
     ~14px section gutter so the "Is This You?" and outcome cards use the full
     screen width. (Owner iPhone review 2026-06-19.) */
  body.page-id-25728 .content-container {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  body.page-id-25728 .entry-content > .wp-block-group {
    padding-left: 0.9rem !important;
    padding-right: 0.9rem !important;
  }
}

/* ============================================================
   48. BOOKS PAGE (page-id-25730) — launch page (§32 State A)
   Hand-authored wp:html sections carry NO inline padding and render
   as direct children of .entry-content (no .wp-block-group wrapper),
   so drive ALL spacing from here — same approach as §47b (coaching).
   Contained layout per CLAUDE.md §23 (no full-bleed). State A = pre-order.
   ============================================================ */

/* utility classes this page introduces */
.section-ivory { background-color: var(--brand-ivory); }
.sovline-gold  { color: var(--brand-gold); }

/* remove boxed cream above the hero + collapse inter-section gaps */
body.page-id-25730 .single-entry .entry-content-wrap,
body.page-id-25730 .content-bg .entry-content-wrap {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
body.page-id-25730 .entry-content > .ybl-book-sec {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding: 48px 0 !important;
}
body.page-id-25730 .entry-content > .ybl-book-hero {
  padding: 56px 0 !important;
}

/* centered inner-content max-width helpers */
.ybl-book-notify .notify-inner,
.ybl-book-about  .book-about-inner,
.ybl-book-author .book-author-inner {
  max-width: 760px;
  margin: 0 auto;
}

/* centered sections get a centered eyebrow accent line */
.ybl-book-notify .eyebrow::after,
.ybl-book-about  .eyebrow::after,
.ybl-book-author .eyebrow::after {
  margin-left: auto;
  margin-right: auto;
}

/* ---- HERO: split (cover + content), contained ---- */
/* Background lives on the full-width section; the grid sits on an inner
   wrapper so the midnight panel spans the SAME width as the sections below
   (it was capped to the grid's max-width before). */
.ybl-book-hero.section-midnight {
  background: radial-gradient(125% 130% at 82% 4%, #3A2342 0%, #1B1132 46%, #100A20 100%);
}
.book-hero-inner {
  display: grid;
  grid-template-columns: 1fr 1fr;   /* equal halves → cover sits nearer page centre */
  gap: 3rem;
  align-items: center;
  max-width: 1200px;
  margin: 0 auto;
}
.book-hero__cover { text-align: center; }   /* centered within its half */
.book-hero__cover img {
  display: block;
  margin: 0 auto;
  width: 100%;
  max-width: 360px;
  height: auto;
  border-radius: 4px;
  /* gold hairline ring stops the cover's dark bottom melting into the dark
     hero; soft drop shadow adds depth */
  box-shadow: 0 0 0 1px rgba(184,144,106,0.7),
              14px 18px 44px rgba(0,0,0,0.55);
}
.book-hero__content .eyebrow { color: var(--brand-rose); }
.book-hero__title {
  font-size: clamp(2.4rem, 4vw, 3.4rem);
  line-height: 1.08;
  margin: 0.15em 0 0.2em;
  color: var(--brand-ivory);
}
.book-hero__subtitle {
  font-family: var(--font-ui);
  letter-spacing: 0.04em;
  font-size: 1.05rem;
  color: rgba(250,244,238,0.85);
  margin: 0 0 1.2rem;
}
.book-hero__desc {
  font-style: italic;
  font-size: 1.12rem;
  line-height: 1.7;
  color: rgba(250,244,238,0.9);
  max-width: 30em;
  margin: 0 0 1.75rem;
}
.book-hero__cta {
  display: inline-block;
  background: var(--brand-gold);
  color: var(--brand-midnight);
  font-family: var(--font-ui);
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;            /* all action buttons are UPPERCASE */
  text-decoration: none;
  padding: 0.95rem 2rem;
  border-radius: 999px;
  font-size: 1.02rem;
  transition: transform .15s ease, background .15s ease;
}
.book-hero__cta:hover {
  background: #C9A074;
  transform: translateY(-1px);
  color: var(--brand-midnight);
}
/* clarifies the $0.99 pre-order = the eBook edition */
.book-hero__ebook-note {
  font-size: 0.95rem;
  color: var(--brand-rose);
  margin: 0.9rem 0 0;
}
.book-hero__ebook-note strong { color: var(--brand-ivory); font-weight: 700; }
/* launch date: larger, with clear space below the gold button */
.book-hero__launch {
  font-family: var(--font-ui);
  font-size: 1.35rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  color: var(--brand-ivory);
  margin: 1.4rem 0 0;
}

/* ---- EMAIL CAPTURE (pending-Kit-wiring) ---- */
.ybl-book-notify { text-align: center; }
.notify-title { margin: 0 0 0.5rem; }
.notify-body  { color: var(--brand-plum); margin: 0 auto 1.5rem; max-width: 34em; }
.notify-form {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  justify-content: center;
  max-width: 560px;
  margin: 0 auto;
}
.notify-input {
  flex: 1 1 200px;
  padding: 0.85rem 1.1rem;
  border: 1px solid var(--brand-gold);
  border-radius: 6px;
  font-family: var(--font-ui);
  font-size: 1rem;
  background: #fff;
  color: var(--brand-plum);
}
.notify-btn {
  flex: 0 0 auto;
  background: var(--brand-violet);
  color: var(--brand-ivory);
  border: none;
  font-family: var(--font-ui);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  padding: 0.85rem 1.75rem;
  border-radius: 999px;
  cursor: pointer;
  transition: background .15s ease;
}
.notify-btn:hover { background: #46244A; }
.notify-success {
  color: var(--brand-violet);
  font-size: 1.15rem;
  font-weight: 600;
  line-height: 1.6;
  max-width: 34em;
  margin: 0.5rem auto 0;
}
.notify-error {
  color: #9B2C2C;
  font-size: 0.95rem;
  max-width: 34em;
  margin: 0.75rem auto 0;
}
.notify-error a { color: #9B2C2C; text-decoration: underline; }

/* ---- ABOUT THE BOOK / AUTHOR ---- */
.ybl-book-about,
.ybl-book-author { text-align: center; }
.book-about-inner p,
.book-author-inner p { line-height: 1.8; margin: 0 0 1.1rem; }
.book-author__link {
  font-family: var(--font-ui);
  font-weight: 600;
  color: var(--brand-violet);
  text-decoration: none;
}
.book-author__link:hover { text-decoration: underline; }

/* ---- MOBILE: stack hero, headline + CTA in fold (§23 Part 3) ---- */
@media (max-width: 767px) {
  body.page-id-25730 .entry-content > .ybl-book-sec  { padding: 36px 0 !important; }
  body.page-id-25730 .entry-content > .ybl-book-hero { padding: 40px 0 !important; }
  body.page-id-25730 .content-container {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  body.page-id-25730 .entry-content > .ybl-book-sec {
    padding-left: 1.1rem !important;
    padding-right: 1.1rem !important;
  }
  body.page-id-25730 .book-hero-inner {
    grid-template-columns: 1fr;   /* force single column on phones */
    gap: 1.5rem;
    text-align: left;             /* keep text left so the swish stays under "AVAILABLE" */
  }
  .book-hero__cover { padding-right: 0; }   /* img is centered via its own margin:auto */
  /* !important + higher specificity beats the global mobile `img{max-width:100%!important}`
     rule (style.css ~1698) that was forcing the cover full-width */
  .book-hero__cover img { max-width: 210px !important; }
  /* centre the text block on screen but keep its text left-aligned, so the
     eyebrow swish sits under the first word while the block isn't edge-hugging */
  .book-hero__content {
    max-width: 20rem;
    margin-left: auto;
    margin-right: auto;
  }
  .book-hero__cta { font-size: 0.92rem; padding: 0.9rem 1.4rem; }
  .book-hero__launch { font-size: 1.15rem; }
  .book-hero__desc { display: none; }          /* keep headline + CTA in the fold */
  .notify-form { flex-direction: column; }
  /* column flex made `flex:1 1 200px` set a 200px HEIGHT basis + grow → giant
     tall input bars; reset to natural height, full width */
  .notify-input { flex: 0 0 auto; width: 100%; }
  .notify-btn   { flex: 0 0 auto; width: 100%; font-size: 0.92rem; }
}


/* ============================================================
   49. DIGITAL PRODUCTS PAGE (page-id-25732) — §34 reorg
   Three free, email-gated downloads (5 Shifts, SOV-LINE
   Self-Assessment, Rising Horizon Journal). Custom forms POST to
   Kit (Approach C, see kit-form-wiring-approach.md); on success the
   matching .dp-success (with the PDF link) is revealed on-page — no
   Kit automation needed. Hand-authored wp:html <section> elements are
   direct children of .entry-content (no .wp-block-group wrapper), so
   drive ALL spacing here — same approach as §47b/§48. Contained
   layout per CLAUDE.md §23 (no full-bleed).
   ============================================================ */

/* remove boxed cream + collapse inter-section gaps */
body.page-id-25732 .single-entry .entry-content-wrap,
body.page-id-25732 .content-bg .entry-content-wrap {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
body.page-id-25732 .entry-content > .dp-sec {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding: 48px 0 !important;
}
body.page-id-25732 .entry-content > .dp-hero {
  padding: 56px 0 !important;
}

/* ---- HERO (midnight band — matches Coaching/site hero format) ---- */
.dp-hero-inner {
  max-width: 760px;
  margin: 0 auto;
  text-align: center;
}
.dp-eyebrow { text-align: center; }
.dp-eyebrow::after { margin-left: auto; margin-right: auto; }
.dp-hero__title {
  text-align: center;
  color: var(--brand-ivory);
  margin: 0.3em 0 0.4em;
}
.dp-hero__sub {
  text-align: center;
  font-size: 1.15rem;
  color: rgba(250, 244, 238, 0.8);
  max-width: 620px;
  margin: 0 auto;
}
.dp-hero__cta {
  display: inline-block;
  margin-top: 1.4rem;
  padding: 0.85rem 1.6rem;
  font-family: Arial, "Helvetica Neue", sans-serif;
  font-size: 0.95rem;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--brand-ivory);
  background: var(--brand-violet);
  border-radius: 50px;
  text-decoration: none;
  min-height: 44px;
  transition: background 0.15s ease;
}
.dp-hero__cta:hover { background: var(--brand-gold); color: var(--brand-ivory); }

/* ---- PRODUCT GRID ---- */
.dp-grid {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
  align-items: stretch;
}
.dp-card {
  display: flex;
  flex-direction: column;
  background: var(--brand-ivory);
  border: 1px solid rgba(184, 144, 106, 0.35);   /* antique gold, soft */
  border-radius: 10px;
  padding: 1.75rem 1.5rem;
  box-shadow: 0 6px 22px rgba(42, 28, 48, 0.06);
}
.dp-card__eyebrow {
  font-family: Arial, "Helvetica Neue", sans-serif;
  font-size: 0.72rem;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: var(--brand-gold);
  margin: 0 0 0.5rem;
}
.dp-card__title {
  font-size: 1.3rem;
  line-height: 1.25;
  margin: 0 0 0.6rem;
}
.dp-card__desc {
  font-size: 1rem;
  line-height: 1.55;
  margin: 0 0 1.25rem;
  flex: 1 1 auto;   /* push form to the bottom so cards align */
}

/* ---- FORM ---- */
.dp-form { display: flex; flex-direction: column; gap: 0.6rem; margin: 0; }
.dp-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.dp-input {
  width: 100%;
  padding: 0.8rem 0.9rem;
  font-size: 1rem;
  border: 1px solid rgba(42, 28, 48, 0.25);
  border-radius: 6px;
  background: #fff;
}
.dp-input:focus { outline: 2px solid var(--brand-violet); outline-offset: 1px; }
.dp-btn {
  margin-top: 0.2rem;
  padding: 0.85rem 1.2rem;
  font-family: Arial, "Helvetica Neue", sans-serif;
  font-size: 0.95rem;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--brand-ivory);
  background: var(--brand-violet);
  border: none;
  border-radius: 50px;
  cursor: pointer;
  min-height: 44px;   /* tap target, HIG */
  transition: background 0.15s ease;
}
.dp-btn:hover { background: var(--brand-gold); }
.dp-btn:disabled { opacity: 0.7; cursor: default; }
.dp-error {
  display: none;
  color: #B3261E;
  font-size: 0.9rem;
  margin: 0.2rem 0 0;
}

/* ---- SUCCESS / DOWNLOAD REVEAL ---- */
.dp-success { display: none; }
.dp-success__head {
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.15rem;
  font-weight: 700;
  margin: 0 0 0.6rem;
}
.dp-download {
  display: inline-block;
  padding: 0.8rem 1.2rem;
  font-family: Arial, "Helvetica Neue", sans-serif;
  font-size: 0.92rem;
  font-weight: 700;
  letter-spacing: 0.5px;
  color: var(--brand-ivory);
  background: var(--brand-gold);
  border-radius: 50px;
  text-decoration: none;
  min-height: 44px;
}
.dp-download:hover { background: var(--brand-violet); color: var(--brand-ivory); }
.dp-success__note {
  font-size: 0.92rem;
  font-style: italic;
  margin: 0.7rem 0 0;
}

/* ---- CREDIT STRIP ---- */
.dp-credit { text-align: center; }
.dp-credit__line {
  font-family: Georgia, "Times New Roman", serif;
  font-style: italic;
  font-size: 1.05rem;
  margin: 0 0 0.4rem;
}
.dp-credit__tm {
  font-family: Arial, "Helvetica Neue", sans-serif;
  font-size: 0.78rem;
  letter-spacing: 1px;
  color: var(--brand-plum);
  opacity: 0.75;
  margin: 0;
}

/* ---- MOBILE ---- */
@media (max-width: 900px) {
  .dp-grid { grid-template-columns: 1fr; max-width: 480px; }
}
@media (max-width: 767px) {
  body.page-id-25732 .entry-content > .dp-sec  { padding: 36px 0 !important; }
  body.page-id-25732 .entry-content > .dp-hero { padding: 40px 0 !important; }
  body.page-id-25732 .content-container {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  body.page-id-25732 .entry-content > .dp-sec {
    padding-left: 1.1rem !important;
    padding-right: 1.1rem !important;
  }
  .dp-hero__title { font-size: 1.85rem; }
}