/*
Theme Name: TPDG
Theme URI: https://tpdg.au
Author: The Positive Difference Group
Author URI: https://tpdg.au
Description: A bespoke editorial-style theme for The Positive Difference Group built around the Three Ps framework (Professional, Personal, People). Includes the complete site design, content auto-creation on activation, working Sustainable Leader Scorecard form, integration with the TPDG Coaching Portal plugin for live pricing, login rate-limiting, self-hosted auto-updates from tpdg.au, and 2026 security hardening (CSP, HSTS, X-Frame-Options, REST API limits, XML-RPC disabled, version disclosure removed, file editing disabled). Built for senior leaders.
Version: 1.7.0
Requires at least: 6.4
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: tpdg
Tags: business, editorial, custom-colors, custom-menu, featured-images, threaded-comments, translation-ready, block-styles
*/

:root {
  --navy: #0F2A44;
  --navy-deep: #0A1E33;
  --navy-mid: #1E3A5F;
  --warm-grey: #5C5A55;
  --warm-grey-soft: #8A877F;
  --gold: #8A6A2B;
  --gold-soft: #C9A95B;
  --teal: #1E5F73;
  --teal-deep: #164B5C;
  --teal-soft: #4A8FA3;
  --warm-white: #FBF7EE;
  --warm-white-deep: #F4EEDF;
  --ink: #1A1614;
  --ink-soft: #3D3A36;
  --rule: #E5DDC9;

  --p-professional: #1E3A5F;
  --p-personal:    #7A4E2C;
  --p-people:      #3F6B5C;
  --p-product:     #8A6A2D;

  --display-xl: clamp(48px, 6.5vw, 88px);
  --display-l:  clamp(40px, 5vw, 64px);
  --display-m:  clamp(32px, 3.6vw, 48px);
  --display-s:  clamp(24px, 2.4vw, 32px);
  --body-l: 19px;
  --body:   17px;
  --small:  14px;
  --micro:  12px;

  --space-xs: 8px;
  --space-s:  16px;
  --space-m:  32px;
  --space-l:  64px;
  --space-xl: 96px;
  --space-2xl: 144px;

  --max-w: 1240px;
  --read-w: 640px;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: 'Manrope', -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: var(--body);
  line-height: 1.6;
  color: var(--ink);
  background: var(--warm-white);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  font-feature-settings: 'kern' 1, 'liga' 1;
}
.serif {
  font-family: 'Fraunces', 'Iowan Old Style', Georgia, serif;
  font-variation-settings: "opsz" 60, "SOFT" 50;
  font-feature-settings: 'kern' 1, 'liga' 1, 'ss01' 1;
  letter-spacing: -0.015em;
}
.eyebrow {
  font-family: 'Manrope', sans-serif;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--warm-grey);
}
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; height: auto; }
.skip-link {
  position: absolute;
  left: -9999px;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
}
.skip-link:focus {
  position: fixed;
  left: 16px;
  top: 16px;
  width: auto;
  height: auto;
  padding: 12px 18px;
  background: var(--navy);
  color: var(--warm-white);
  z-index: 100000;
  font-weight: 600;
}

/* ====== HEADER ====== */
.site-header {
  background: var(--warm-white);
  border-bottom: 1px solid var(--rule);
  padding: 24px 48px;
  position: sticky;
  top: 0;
  z-index: 100;
  backdrop-filter: blur(8px);
  background: rgba(251, 247, 238, 0.95);
}
.site-header-inner {
  max-width: var(--max-w);
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
}
.brand { display: flex; flex-direction: column; line-height: 1; }
.brand-mark {
  font-family: 'Fraunces', serif;
  font-variation-settings: "opsz" 36, "SOFT" 30;
  font-weight: 500;
  font-size: 28px;
  color: var(--navy);
  letter-spacing: -0.01em;
}
.brand-tag {
  font-family: 'Manrope', sans-serif;
  font-size: 9px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--warm-grey);
  margin-top: 6px;
  font-weight: 500;
}
/* Custom Logo (Customizer → Site Identity → Logo).
   Constrains the uploaded logo so it sits neatly in the header next to the
   nav. Without this, WordPress renders the logo at its full pixel width.
   Height matches the old "TPDG" wordmark. v1.5.3. */
.site-header .custom-logo-link {
  display: inline-flex;
  align-items: center;
  margin: 0;
}
.site-header .custom-logo {
  height: 52px;
  width: auto;
  max-width: 240px;
  display: block;
}
.site-nav { display: flex; gap: 28px; align-items: center; }
.site-nav ul { list-style: none; display: flex; gap: 28px; align-items: center; }
.site-nav a {
  font-size: 13px;
  font-weight: 500;
  color: var(--ink-soft);
  letter-spacing: 0.02em;
  position: relative;
  padding: 4px 0;
  transition: color 0.2s;
}
.site-nav a:hover { color: var(--navy); }
.site-nav .current-menu-item > a,
.site-nav a.active {
  color: var(--navy);
}
.site-nav .current-menu-item > a::after,
.site-nav a.active::after {
  content: '';
  position: absolute;
  bottom: -4px;
  left: 0; right: 0;
  height: 1px;
  background: var(--gold);
}
.menu-toggle {
  display: none;
  background: none;
  border: 1px solid var(--rule);
  padding: 10px 16px;
  cursor: pointer;
  font-family: 'Manrope', sans-serif;
  font-size: 12px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  font-weight: 600;
  color: var(--navy);
}

.btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 12px 22px;
  background: var(--gold);
  color: var(--warm-white);
  font-family: 'Manrope', sans-serif;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.04em;
  border: 1px solid var(--gold);
  border-radius: 0;
  transition: all 0.2s;
  cursor: pointer;
  text-decoration: none;
}
.btn:hover { background: var(--navy); border-color: var(--navy); color: var(--warm-white); }
.btn-secondary {
  background: transparent;
  color: var(--navy);
  border: 1px solid var(--navy);
}
.btn-secondary:hover { background: var(--navy); color: var(--warm-white); }
.btn-on-dark {
  background: transparent;
  color: var(--warm-white);
  border: 1px solid var(--gold);
}
.btn-on-dark:hover { background: var(--gold); color: var(--warm-white); }
.btn-arrow::after { content: ' →'; }

/* v1.4.1: Client portal link in the header — subtle text link, sits between
   the nav and the gold Book CTA. Avoids competing with the primary CTA but
   stays visible on every page. */
.client-login-link {
  font-family: 'Manrope', sans-serif;
  font-size: 14px;
  font-weight: 500;
  color: var(--navy);
  text-decoration: none;
  padding: 8px 4px;
  border-bottom: 1px solid transparent;
  transition: border-color 0.15s, color 0.15s;
  white-space: nowrap;
}
.client-login-link:hover,
.client-login-link:focus {
  color: var(--gold);
  border-bottom-color: var(--gold);
}
@media (max-width: 880px) {
  /* On narrow viewports, drop the client-login link out of the nav row.
     The mobile menu reveals it instead so the header doesn't get crowded. */
  .client-login-link { display: none; }
  .mobile-nav .client-login-link,
  .primary-menu + .client-login-link {
    display: inline-block;
  }
}

/* ====== HERO ====== */
.hero {
  /* v1.5.3: top padding reduced from --space-2xl (144px) to --space-l (64px)
     to remove the oversized gap below the sticky header on the homepage.
     Horizontal + bottom spacing unchanged. */
  padding: var(--space-l) 48px var(--space-xl);
  position: relative;
  overflow: hidden;
}
.hero::before {
  content: '';
  position: absolute;
  top: 80px;
  right: 6%;
  width: 320px;
  height: 320px;
  background: radial-gradient(circle, rgba(176, 141, 63, 0.06) 0%, transparent 70%);
  pointer-events: none;
}
.hero-inner { max-width: var(--max-w); margin: 0 auto; position: relative; }
.hero-eyebrow { display: flex; align-items: center; gap: 16px; margin-bottom: 32px; }
.hero-eyebrow .rule { width: 48px; height: 1px; background: var(--gold); }
.hero-headline {
  font-family: 'Fraunces', serif;
  font-variation-settings: "opsz" 144, "SOFT" 30;
  font-size: var(--display-xl);
  font-weight: 380;
  line-height: 1.05;
  color: var(--navy);
  max-width: 920px;
  letter-spacing: -0.025em;
}
.hero-headline em {
  font-style: italic;
  font-variation-settings: "opsz" 144, "SOFT" 100;
  color: var(--gold);
  font-weight: 360;
}
.hero-sub {
  font-size: var(--body-l);
  color: var(--warm-grey);
  margin-top: 36px;
  max-width: 600px;
  line-height: 1.55;
  font-weight: 400;
}
.hero-cta-group {
  margin-top: 48px;
  display: flex;
  gap: 16px;
  align-items: center;
  flex-wrap: wrap;
}
.hero-cta-group .small-link {
  font-size: 13px;
  color: var(--warm-grey);
  border-bottom: 1px solid var(--rule);
  padding-bottom: 2px;
  transition: border-color 0.2s, color 0.2s;
}
.hero-cta-group .small-link:hover { color: var(--navy); border-bottom-color: var(--gold); }

/* ====== SECTIONS ====== */
section.block { padding: var(--space-xl) 48px; }
section.block-tight { padding: var(--space-l) 48px; }
section.block-wide { padding: var(--space-2xl) 48px; }
section.bg-deep { background: var(--warm-white-deep); }
section.bg-navy { background: var(--navy); color: var(--warm-white); }
section.bg-navy .eyebrow { color: var(--gold-soft); }
.block-inner { max-width: var(--max-w); margin: 0 auto; }
.read-inner { max-width: var(--read-w); margin: 0 auto; }

.section-head { margin-bottom: var(--space-l); max-width: 760px; }
.section-head .eyebrow { margin-bottom: 12px; }
.section-head h2 {
  font-family: 'Fraunces', serif;
  font-variation-settings: "opsz" 84, "SOFT" 40;
  font-size: var(--display-l);
  font-weight: 380;
  line-height: 1.1;
  color: var(--navy);
  letter-spacing: -0.02em;
}
.section-head .lead {
  margin-top: 20px;
  font-size: var(--body-l);
  color: var(--warm-grey);
  max-width: 560px;
}

/* ====== FOUR PS GRID ====== */
.four-ps-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  border-top: 1px solid var(--rule);
}
.four-ps-grid .p-card {
  border-right: 1px solid var(--rule);
  padding: 48px 32px 56px;
  position: relative;
  background: var(--warm-white);
  transition: background 0.3s;
  display: flex;
  flex-direction: column;
}
.four-ps-grid .p-card:last-child { border-right: none; }
.four-ps-grid .p-card:hover { background: var(--warm-white-deep); }
.four-ps-grid .p-card .p-mark { display: flex; align-items: baseline; gap: 12px; margin-bottom: 20px; }
.four-ps-grid .p-card .p-numeral {
  font-family: 'Fraunces', serif;
  font-variation-settings: "opsz" 144, "SOFT" 80;
  font-size: 48px;
  font-weight: 300;
  font-style: italic;
  line-height: 1;
}
.four-ps-grid .p-card .p-letter {
  font-family: 'Fraunces', serif;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--warm-grey);
}
.four-ps-grid .p-card h3 {
  font-family: 'Fraunces', serif;
  font-variation-settings: "opsz" 60;
  font-size: 26px;
  font-weight: 460;
  line-height: 1.15;
  margin-bottom: 14px;
  letter-spacing: -0.01em;
}
.four-ps-grid .p-card p {
  font-size: 14.5px;
  color: var(--warm-grey);
  line-height: 1.6;
  margin-bottom: 28px;
  flex-grow: 1;
}
.four-ps-grid .p-card .p-link {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border-bottom: 1px solid currentColor;
  padding-bottom: 3px;
  transition: gap 0.2s;
  align-self: flex-start;
}
.four-ps-grid .p-card .p-link:hover { gap: 14px; }

.p-card.p-prof { border-top: 3px solid var(--p-professional); }
.p-card.p-prof .p-numeral, .p-card.p-prof h3, .p-card.p-prof .p-link { color: var(--p-professional); }
.p-card.p-pers { border-top: 3px solid var(--p-personal); }
.p-card.p-pers .p-numeral, .p-card.p-pers h3, .p-card.p-pers .p-link { color: var(--p-personal); }
.p-card.p-peop { border-top: 3px solid var(--p-people); }
.p-card.p-peop .p-numeral, .p-card.p-peop h3, .p-card.p-peop .p-link { color: var(--p-people); }
.p-card.p-prod { border-top: 3px solid var(--p-product); }
.p-card.p-prod .p-numeral, .p-card.p-prod h3, .p-card.p-prod .p-link { color: var(--p-product); }

/* ====== TRUST STRIP ====== */
.trust-strip {
  padding: 48px;
  background: var(--warm-white);
  border-top: 1px solid var(--rule);
  border-bottom: 1px solid var(--rule);
}
.trust-strip-inner {
  max-width: var(--max-w);
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
  flex-wrap: wrap;
}
.trust-strip .label {
  font-family: 'Fraunces', serif;
  font-style: italic;
  font-size: 17px;
  color: var(--warm-grey);
  flex: 1;
  min-width: 280px;
}
.trust-credentials {
  display: flex;
  gap: 36px;
  flex-wrap: wrap;
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-soft);
  font-weight: 500;
}
.trust-credentials span { white-space: nowrap; }

/* ====== PILLAR HUB ====== */
.hub-hero {
  padding: var(--space-2xl) 48px var(--space-xl);
  background: var(--warm-white);
  position: relative;
}
.hub-hero-inner { max-width: var(--max-w); margin: 0 auto; position: relative; }
.hub-letter-mark {
  font-family: 'Fraunces', serif;
  font-style: italic;
  font-variation-settings: "opsz" 144, "SOFT" 100;
  font-size: 280px;
  line-height: 0.85;
  opacity: 0.08;
  position: absolute;
  top: -40px;
  right: 0;
  pointer-events: none;
  font-weight: 300;
}
.hub-hero .hub-eyebrow {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 28px;
  font-family: 'Manrope', sans-serif;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--warm-grey);
}
.hub-hero .hub-eyebrow .dot { width: 8px; height: 8px; border-radius: 50%; }
.hub-hero h1 {
  font-family: 'Fraunces', serif;
  font-variation-settings: "opsz" 144, "SOFT" 40;
  font-size: var(--display-xl);
  font-weight: 380;
  line-height: 1.05;
  letter-spacing: -0.025em;
  max-width: 880px;
  position: relative;
}
.hub-hero h1 em {
  font-style: italic;
  font-variation-settings: "opsz" 144, "SOFT" 100;
  font-weight: 360;
}
.hub-hero .sub {
  font-size: var(--body-l);
  color: var(--warm-grey);
  max-width: 620px;
  margin-top: 32px;
  line-height: 1.55;
}

.hub-prof .hub-letter-mark, .hub-prof h1, .hub-prof .hub-eyebrow .dot { color: var(--p-professional); }
.hub-prof .hub-eyebrow .dot { background: var(--p-professional); }
.hub-prof .offer-card .tier-name, .hub-prof .offer-card .card-cta { color: var(--p-professional); }

.hub-pers .hub-letter-mark, .hub-pers h1 { color: var(--p-personal); }
.hub-pers .hub-eyebrow .dot { background: var(--p-personal); }
.hub-pers .offer-card .tier-name, .hub-pers .offer-card .card-cta { color: var(--p-personal); }

.hub-peop .hub-letter-mark, .hub-peop h1 { color: var(--p-people); }
.hub-peop .hub-eyebrow .dot { background: var(--p-people); }
.hub-peop .offer-card .tier-name, .hub-peop .offer-card .card-cta { color: var(--p-people); }

.hub-prod .hub-letter-mark, .hub-prod h1 { color: var(--p-product); }
.hub-prod .hub-eyebrow .dot { background: var(--p-product); }
.hub-prod .offer-card .tier-name, .hub-prod .offer-card .card-cta { color: var(--p-product); }

.the-case { padding: var(--space-xl) 48px; }
.the-case-inner { max-width: var(--read-w); margin: 0 auto; }
.the-case .eyebrow { margin-bottom: 24px; }
.the-case h2 {
  font-family: 'Fraunces', serif;
  font-variation-settings: "opsz" 60;
  font-size: var(--display-m);
  font-weight: 400;
  line-height: 1.15;
  margin-bottom: 32px;
  color: var(--navy);
  letter-spacing: -0.015em;
}
.the-case p {
  font-size: var(--body-l);
  line-height: 1.7;
  color: var(--ink-soft);
  margin-bottom: 20px;
}

/* ====== OFFERS ====== */
.offers { padding: var(--space-l) 48px var(--space-xl); }
.offers-inner { max-width: var(--max-w); margin: 0 auto; }
.offers-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-top: 48px;
}
.offer-card {
  background: var(--warm-white);
  border: 1px solid var(--rule);
  padding: 40px 32px;
  display: flex;
  flex-direction: column;
  position: relative;
  transition: border-color 0.2s, transform 0.2s;
}
.offer-card:hover { border-color: var(--gold); transform: translateY(-2px); }
.offer-card .tier-name {
  font-family: 'Fraunces', serif;
  font-variation-settings: "opsz" 36;
  font-size: 24px;
  font-weight: 460;
  margin-bottom: 8px;
}
.offer-card .tier-tag {
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--warm-grey);
  font-weight: 500;
  margin-bottom: 20px;
}
.offer-card p {
  font-size: 14.5px;
  line-height: 1.6;
  color: var(--ink-soft);
  margin-bottom: 24px;
  flex-grow: 1;
}
.offer-card .price {
  font-family: 'Fraunces', serif;
  font-style: italic;
  font-size: 19px;
  color: var(--navy);
  margin-bottom: 24px;
  border-top: 1px solid var(--rule);
  padding-top: 20px;
}
.offer-card .price em {
  font-size: 12px;
  color: var(--warm-grey);
  font-style: normal;
  letter-spacing: 0.06em;
  display: block;
  margin-top: 4px;
  text-transform: uppercase;
  font-weight: 500;
}
.offer-card .card-cta {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border-bottom: 1px solid currentColor;
  padding-bottom: 3px;
  align-self: flex-start;
  transition: gap 0.2s;
}
.offer-card .card-cta:hover { gap: 14px; }

/* ====== CTA BAND ====== */
.cta-band {
  background: var(--navy);
  color: var(--warm-white);
  padding: var(--space-xl) 48px;
}
.cta-band-inner { max-width: 880px; margin: 0 auto; text-align: center; }
.cta-band .eyebrow { color: var(--gold-soft); margin-bottom: 16px; }
.cta-band h2 {
  font-family: 'Fraunces', serif;
  font-variation-settings: "opsz" 84, "SOFT" 60;
  font-size: var(--display-m);
  font-weight: 380;
  line-height: 1.15;
  margin-bottom: 20px;
  letter-spacing: -0.015em;
}
.cta-band h2 em {
  font-style: italic;
  font-variation-settings: "opsz" 84, "SOFT" 100;
  color: var(--gold-soft);
}
.cta-band p {
  font-size: var(--body-l);
  color: var(--warm-white);
  opacity: 0.78;
  margin-bottom: 36px;
  max-width: 580px;
  margin-left: auto;
  margin-right: auto;
}

/* ====== EDITORIAL (About) ====== */
.editorial {
  display: grid;
  grid-template-columns: 1fr 1.4fr;
  gap: 80px;
  align-items: start;
}
.editorial-img {
  aspect-ratio: 4 / 5;
  background: linear-gradient(135deg, var(--navy) 0%, var(--navy-mid) 100%);
  position: relative;
  overflow: hidden;
}
.editorial-img.no-photo::before {
  content: 'KW';
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Fraunces', serif;
  font-style: italic;
  font-size: 200px;
  color: var(--gold);
  opacity: 0.5;
}
.editorial-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.editorial-body h2 {
  font-family: 'Fraunces', serif;
  font-variation-settings: "opsz" 84;
  font-size: var(--display-m);
  font-weight: 380;
  line-height: 1.12;
  color: var(--navy);
  margin-bottom: 32px;
  letter-spacing: -0.018em;
}
.editorial-body p {
  font-size: var(--body-l);
  line-height: 1.65;
  color: var(--ink-soft);
  margin-bottom: 20px;
}
/* v1.4.1: drop-cap rule removed entirely. Was firing on plugin-rendered
   widgets (rate calculator, client portal) and breaking layout. Scoping
   it in v1.4.0 didn't stick reliably. Editorial pages now render
   without the gold floated first-letter; cleaner result anyway. */
.credentials-list {
  margin-top: 40px;
  padding-top: 32px;
  border-top: 1px solid var(--rule);
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 18px 32px;
}
.credentials-list .cred-item { font-size: 13px; }
.credentials-list .cred-label {
  font-size: 10px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--warm-grey);
  margin-bottom: 4px;
  display: block;
}

/* ====== SCORECARD ====== */
.scorecard-hero {
  background: var(--warm-white-deep);
  padding: var(--space-xl) 48px var(--space-l);
}
.scorecard-hero-inner {
  max-width: 1080px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.3fr 1fr;
  gap: 80px;
  align-items: center;
}
.scorecard-copy h1 {
  font-family: 'Fraunces', serif;
  font-variation-settings: "opsz" 144, "SOFT" 40;
  font-size: var(--display-l);
  font-weight: 380;
  line-height: 1.08;
  color: var(--navy);
  letter-spacing: -0.022em;
  margin-bottom: 24px;
}
.scorecard-copy h1 em {
  font-style: italic;
  font-variation-settings: "opsz" 144, "SOFT" 100;
  color: var(--gold);
}
.scorecard-copy .sub {
  font-size: var(--body-l);
  color: var(--warm-grey);
  margin-bottom: 32px;
  line-height: 1.55;
}
.scorecard-copy ul.dimensions {
  list-style: none;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px 24px;
  margin-top: 24px;
}
.scorecard-copy ul.dimensions li {
  font-size: 14px;
  font-weight: 500;
  color: var(--ink);
  padding-left: 18px;
  position: relative;
}
.scorecard-copy ul.dimensions li::before {
  content: '';
  position: absolute;
  left: 0; top: 0.7em;
  width: 8px; height: 1px;
  background: var(--gold);
}
.scorecard-form-wrap, .contact-form-wrap {
  background: var(--warm-white);
  border: 1px solid var(--rule);
  padding: 40px;
}
.scorecard-form-wrap h3, .contact-form-wrap h3 {
  font-family: 'Fraunces', serif;
  font-size: 24px;
  font-weight: 460;
  margin-bottom: 8px;
  color: var(--navy);
}
.scorecard-form-wrap .micro, .contact-form-wrap .micro {
  font-size: 12px;
  color: var(--warm-grey);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin-bottom: 24px;
  font-weight: 500;
}
.tpdg-form label {
  display: block;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--warm-grey);
  margin-bottom: 6px;
  margin-top: 16px;
}
.tpdg-form input,
.tpdg-form select,
.tpdg-form textarea {
  width: 100%;
  padding: 12px 0;
  border: none;
  border-bottom: 1px solid var(--rule);
  background: transparent;
  font-family: 'Manrope', sans-serif;
  font-size: 16px;
  color: var(--ink);
  outline: none;
  transition: border-color 0.2s;
}
.tpdg-form textarea {
  min-height: 100px;
  resize: vertical;
  border: 1px solid var(--rule);
  padding: 12px;
  margin-top: 6px;
}
.tpdg-form input:focus,
.tpdg-form select:focus,
.tpdg-form textarea:focus {
  border-bottom-color: var(--gold);
  border-color: var(--gold);
}
.tpdg-form .form-cta {
  width: 100%;
  margin-top: 32px;
  padding: 16px;
  background: var(--navy);
  color: var(--warm-white);
  border: none;
  font-family: 'Manrope', sans-serif;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background 0.2s;
}
.tpdg-form .form-cta:hover { background: var(--gold); }
.tpdg-form .form-cta:disabled { opacity: 0.5; cursor: not-allowed; }
.tpdg-form .honeypot { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.tpdg-form-message {
  padding: 16px;
  margin-top: 16px;
  font-size: 14px;
  display: none;
}
.tpdg-form-message.success { background: #E8F2EC; color: #2D5240; border-left: 3px solid var(--p-people); display: block; }
.tpdg-form-message.error { background: #F2E8E8; color: #6B2828; border-left: 3px solid #8B2E2E; display: block; }

/* ====== FULL SCORECARD QUESTIONS ====== */
.scorecard-full {
  max-width: 760px;
  margin: 0 auto;
  padding: var(--space-xl) 48px;
}
.scorecard-step { display: none; }
.scorecard-step.active { display: block; }
.scorecard-step h3 {
  font-family: 'Fraunces', serif;
  font-size: 28px;
  font-weight: 460;
  color: var(--navy);
  margin-bottom: 8px;
}
.scorecard-step .step-num {
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold);
  font-weight: 600;
  margin-bottom: 12px;
  display: block;
}
.scorecard-question {
  margin: 32px 0;
  padding-bottom: 24px;
  border-bottom: 1px solid var(--rule);
}
.scorecard-question p { font-size: 16px; margin-bottom: 16px; color: var(--ink); }
.likert {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 8px;
}
.likert label {
  display: flex;
  flex-direction: column;
  align-items: center;
  cursor: pointer;
  padding: 12px 4px;
  border: 1px solid var(--rule);
  background: var(--warm-white);
  font-size: 12px;
  font-weight: 500;
  text-transform: none;
  letter-spacing: 0;
  color: var(--warm-grey);
  transition: all 0.15s;
  text-align: center;
  margin: 0;
}
.likert label:hover { border-color: var(--gold); }
.likert input[type="radio"] { display: none; }
.likert input[type="radio"]:checked + .likert-num {
  background: var(--navy);
  color: var(--warm-white);
  border-color: var(--navy);
}
.likert .likert-num {
  width: 32px; height: 32px;
  border: 1px solid var(--warm-grey);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 600;
  margin-bottom: 8px;
  background: transparent;
  color: var(--ink);
  transition: all 0.15s;
}
.scorecard-nav { display: flex; justify-content: space-between; margin-top: 40px; }
.scorecard-progress {
  height: 2px;
  background: var(--rule);
  margin-bottom: 48px;
  position: relative;
}
.scorecard-progress-bar {
  height: 100%;
  background: var(--gold);
  width: 0%;
  transition: width 0.3s;
}

.scorecard-results {
  background: var(--warm-white);
  padding: 48px;
  border: 1px solid var(--rule);
}
.scorecard-results .overall-score {
  font-family: 'Fraunces', serif;
  font-size: 96px;
  font-weight: 300;
  font-style: italic;
  color: var(--gold);
  line-height: 1;
  margin: 16px 0;
}
.scorecard-results .dimension-scores {
  display: grid;
  gap: 16px;
  margin-top: 32px;
}
.dim-score {
  display: grid;
  grid-template-columns: 160px 1fr 60px;
  gap: 16px;
  align-items: center;
}
.dim-score-label { font-weight: 600; font-size: 14px; }
.dim-score-bar { height: 8px; background: var(--rule); position: relative; }
.dim-score-bar-fill { height: 100%; background: var(--navy); transition: width 0.5s; }
.dim-score-num { font-family: 'Fraunces', serif; font-style: italic; font-size: 20px; color: var(--gold); text-align: right; }

/* ====== COACHES ====== */
.coach-card {
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 56px;
  padding: 56px 0;
  border-top: 1px solid var(--rule);
}
.coach-card:last-child { border-bottom: 1px solid var(--rule); }
.coach-photo {
  aspect-ratio: 1;
  background: linear-gradient(135deg, var(--navy) 0%, var(--navy-mid) 100%);
  position: relative;
}
.coach-photo.no-photo::before {
  content: 'KW';
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Fraunces', serif;
  font-style: italic;
  font-size: 80px;
  color: var(--gold);
  opacity: 0.55;
}
.coach-name {
  font-family: 'Fraunces', serif;
  font-variation-settings: "opsz" 60;
  font-size: 32px;
  font-weight: 420;
  color: var(--navy);
  margin-bottom: 4px;
  letter-spacing: -0.015em;
}
.coach-role {
  font-size: 13px;
  color: var(--warm-grey);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-weight: 500;
  margin-bottom: 20px;
}
.coach-tags { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 20px; }
.coach-tag {
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 5px 10px;
  border: 1px solid var(--rule);
}
.coach-tag.t-prof { color: var(--p-professional); border-color: var(--p-professional); }
.coach-tag.t-pers { color: var(--p-personal); border-color: var(--p-personal); }
.coach-tag.t-peop { color: var(--p-people); border-color: var(--p-people); }
.coach-tag.t-prod { color: var(--p-product); border-color: var(--p-product); }
.coach-card p {
  font-size: 15.5px;
  line-height: 1.65;
  color: var(--ink-soft);
  margin-bottom: 24px;
  max-width: 600px;
}

/* ====== CONTACT ====== */
.contact-grid {
  display: grid;
  grid-template-columns: 1fr 1.5fr;
  gap: 80px;
}
.contact-info h3 {
  font-family: 'Fraunces', serif;
  font-size: 22px;
  font-weight: 460;
  margin-bottom: 8px;
  color: var(--navy);
}
.contact-info .info-block { margin-bottom: 32px; }
.contact-info .info-label {
  font-size: 10px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--warm-grey);
  margin-bottom: 4px;
  font-weight: 600;
  display: block;
}
.contact-info .info-value { font-size: 16px; color: var(--ink); }

/* ====== POST / ARCHIVE ====== */
.post-hero {
  padding: var(--space-xl) 48px var(--space-l);
  background: var(--warm-white);
  border-bottom: 1px solid var(--rule);
}
.post-hero-inner { max-width: 760px; margin: 0 auto; }
.post-meta {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 24px;
  font-size: 12px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--warm-grey);
  font-weight: 500;
}
.post-meta .pillar-tag {
  padding: 4px 10px;
  border: 1px solid currentColor;
}
.post-meta .pillar-tag.prof { color: var(--p-professional); }
.post-meta .pillar-tag.pers { color: var(--p-personal); }
.post-meta .pillar-tag.peop { color: var(--p-people); }
.post-meta .pillar-tag.prod { color: var(--p-product); }

.post-title {
  font-family: 'Fraunces', serif;
  font-variation-settings: "opsz" 144, "SOFT" 40;
  font-size: var(--display-l);
  font-weight: 400;
  line-height: 1.1;
  color: var(--navy);
  letter-spacing: -0.02em;
}

.post-content {
  max-width: var(--read-w);
  margin: 0 auto;
  padding: var(--space-xl) 48px;
  font-size: var(--body-l);
  line-height: 1.7;
  color: var(--ink-soft);
}
.post-content h2 {
  font-family: 'Fraunces', serif;
  font-size: 32px;
  font-weight: 460;
  color: var(--navy);
  margin: 48px 0 16px;
  letter-spacing: -0.015em;
}
.post-content h3 {
  font-family: 'Fraunces', serif;
  font-size: 22px;
  font-weight: 500;
  color: var(--navy);
  margin: 32px 0 12px;
}
.post-content p { margin-bottom: 20px; }
/* v1.4.1: drop-cap rule removed — see note in editorial-body section above. */
.post-content blockquote {
  border-left: 3px solid var(--gold);
  padding: 8px 24px;
  margin: 32px 0;
  font-family: 'Fraunces', serif;
  font-style: italic;
  font-size: 22px;
  line-height: 1.4;
  color: var(--navy);
}
.post-content ul, .post-content ol { margin: 20px 0 20px 28px; }
.post-content li { margin-bottom: 8px; }

.archive-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
  max-width: var(--max-w);
  margin: 0 auto;
  padding: var(--space-xl) 48px;
}
.archive-card {
  border: 1px solid var(--rule);
  padding: 32px;
  background: var(--warm-white);
  transition: border-color 0.2s, transform 0.2s;
  display: flex;
  flex-direction: column;
}
.archive-card:hover { border-color: var(--gold); transform: translateY(-2px); }
.archive-card .card-meta {
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--warm-grey);
  font-weight: 500;
  margin-bottom: 16px;
}
.archive-card h3 {
  font-family: 'Fraunces', serif;
  font-size: 22px;
  font-weight: 460;
  color: var(--navy);
  margin-bottom: 12px;
  line-height: 1.2;
  letter-spacing: -0.01em;
}
.archive-card p {
  font-size: 14.5px;
  line-height: 1.6;
  color: var(--warm-grey);
  margin-bottom: 16px;
  flex-grow: 1;
}
.archive-card .read-more {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--navy);
  border-bottom: 1px solid currentColor;
  padding-bottom: 2px;
  align-self: flex-start;
}

/* ====== 404 ====== */
.error-404 {
  padding: var(--space-2xl) 48px;
  text-align: center;
  max-width: 720px;
  margin: 0 auto;
}
.error-404 .big-num {
  font-family: 'Fraunces', serif;
  font-style: italic;
  font-size: 200px;
  line-height: 1;
  color: var(--gold);
  opacity: 0.4;
  margin-bottom: 24px;
}
.error-404 h1 {
  font-family: 'Fraunces', serif;
  font-size: var(--display-m);
  font-weight: 400;
  color: var(--navy);
  margin-bottom: 16px;
}

/* ====== FOOTER ====== */
.site-footer {
  background: var(--navy-deep);
  color: var(--warm-white);
  padding: var(--space-xl) 48px var(--space-m);
}
.site-footer-inner { max-width: var(--max-w); margin: 0 auto; }
.footer-grid {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr 1.4fr;
  gap: 48px;
  padding-bottom: var(--space-l);
  border-bottom: 1px solid rgba(255,255,255,0.12);
}
.footer-brand .footer-mark {
  font-family: 'Fraunces', serif;
  font-variation-settings: "opsz" 60, "SOFT" 30;
  font-size: 32px;
  font-weight: 460;
  color: var(--warm-white);
  margin-bottom: 12px;
}
.footer-brand p {
  font-size: 14px;
  line-height: 1.6;
  opacity: 0.7;
  max-width: 280px;
  margin-bottom: 18px;
}
.footer-brand .four-ps-mini {
  font-family: 'Fraunces', serif;
  font-style: italic;
  font-size: 13px;
  color: var(--gold-soft);
  letter-spacing: 0.04em;
}
.footer-col h4 {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold-soft);
  margin-bottom: 18px;
}
.footer-col ul { list-style: none; }
.footer-col ul li { margin-bottom: 10px; }
.footer-col ul a {
  font-size: 14px;
  color: var(--warm-white);
  opacity: 0.78;
  transition: opacity 0.2s;
}
.footer-col ul a:hover { opacity: 1; }
.footer-newsletter input {
  width: 100%;
  padding: 12px 0;
  background: transparent;
  border: none;
  border-bottom: 1px solid rgba(255,255,255,0.25);
  color: var(--warm-white);
  font-family: 'Manrope', sans-serif;
  font-size: 15px;
  outline: none;
  margin-bottom: 16px;
  transition: border-color 0.2s;
}
.footer-newsletter input::placeholder { color: rgba(255,255,255,0.4); }
.footer-newsletter input:focus { border-bottom-color: var(--gold); }
.footer-newsletter .btn { padding: 10px 20px; font-size: 12px; }
.footer-bottom {
  padding-top: 24px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 12px;
  opacity: 0.6;
  flex-wrap: wrap;
  gap: 16px;
}
.footer-bottom .legal-links { display: flex; gap: 24px; }

/* ====== ADMIN BAR ALIGNMENT ====== */
.admin-bar .site-header { top: 32px; }
@media (max-width: 782px) {
  .admin-bar .site-header { top: 46px; }
}

/* ====== RESPONSIVE ====== */
@media (max-width: 980px) {
  .four-ps-grid { grid-template-columns: repeat(2, 1fr); }
  .four-ps-grid .p-card { border-bottom: 1px solid var(--rule); }
  .four-ps-grid .p-card:nth-child(2) { border-right: none; }
  .four-ps-grid .p-card:nth-child(3),
  .four-ps-grid .p-card:nth-child(4) { border-bottom: none; }
  .editorial { grid-template-columns: 1fr; gap: 40px; }
  .scorecard-hero-inner { grid-template-columns: 1fr; gap: 48px; }
  .offers-grid { grid-template-columns: 1fr; }
  .archive-grid { grid-template-columns: 1fr; }
  .coach-card { grid-template-columns: 1fr; gap: 32px; }
  .coach-photo { max-width: 280px; }
  .contact-grid { grid-template-columns: 1fr; gap: 40px; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 32px; }
  .menu-toggle { display: block; }
  .site-nav {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: var(--warm-white);
    border-bottom: 1px solid var(--rule);
    padding: 24px;
    flex-direction: column;
    align-items: stretch;
  }
  .site-nav.open { display: flex; }
  .site-nav ul { flex-direction: column; align-items: stretch; gap: 16px; }
  .site-header-inner { position: relative; }
  .hub-letter-mark { font-size: 180px; }
  .dim-score { grid-template-columns: 120px 1fr 50px; }
}
@media (max-width: 600px) {
  .four-ps-grid { grid-template-columns: 1fr; }
  .four-ps-grid .p-card { border-right: none; }
  .four-ps-grid .p-card:nth-child(-n+3) { border-bottom: 1px solid var(--rule); }
  .footer-grid { grid-template-columns: 1fr; }
  .hero, section.block, section.block-tight, section.block-wide,
  .hub-hero, .the-case, .offers, .cta-band, .scorecard-hero,
  .site-header, .trust-strip, .site-footer, .post-hero,
  .post-content, .archive-grid, .scorecard-full, .error-404 {
    padding-left: 24px;
    padding-right: 24px;
  }
  .scorecard-form-wrap, .contact-form-wrap { padding: 24px; }
  .likert label { padding: 8px 2px; font-size: 10px; }
  .likert .likert-num { width: 28px; height: 28px; font-size: 13px; }
  .site-header .custom-logo { height: 42px; }
}

/* ============================================================
   v1.5.1 — Homepage polish pass
   Disciplined image sizing, consistent vertical rhythm,
   alternating section tones. All tokens are the theme's own.
   ============================================================ */

/* ---- Consistent section rhythm ----
   One vertical beat for all new bands. Overrides the uneven
   per-section padding from the first pass. */
.credibility-band,
.voices-band,
.speaking-band { padding: var(--space-2xl) 48px; }

/* ---- HERO: balanced, portrait reined in ---- */
.hero-with-portrait .hero-grid {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: var(--space-xl);
  align-items: center;
}
.hero-col-text { min-width: 0; }
.hero-offerings {
  display: flex; flex-wrap: wrap; gap: 22px;
  margin-top: 28px;
}
.hero-offerings span {
  display: inline-flex; align-items: center; gap: 9px;
  font-size: 13px; color: var(--warm-grey); letter-spacing: 0.04em;
  text-transform: uppercase;
}
.hero-offerings span::before {
  content: ""; width: 5px; height: 5px; border-radius: 50%; background: var(--gold);
}
.hero-portrait {
  position: relative; margin: 0 0 0 auto;
  width: 100%; max-width: 420px;
  aspect-ratio: 4 / 5;
  border-radius: 4px; overflow: hidden;
  box-shadow: 0 24px 60px -28px rgba(15, 42, 68, 0.4);
}
.hero-portrait img { width: 100%; height: 100%; object-fit: cover; object-position: center 20%; }
.hero-portrait::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, transparent 58%, rgba(15,42,68,0.34) 100%);
}
.hero-portrait-cap {
  position: absolute; left: 18px; bottom: 16px; z-index: 2;
  display: flex; flex-direction: column;
}
.hero-portrait-cap .cap-name { font-size: 17px; color: var(--warm-white); letter-spacing: -0.01em; line-height: 1.1; }
.hero-portrait-cap .cap-role { font-size: 10px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--gold-soft); margin-top: 5px; }

/* ---- CREDIBILITY: words lead, image is support ---- */
.credibility-band { background: var(--warm-white); }
.credibility-inner {
  max-width: var(--max-w); margin: 0 auto;
  display: grid; grid-template-columns: 0.8fr 1.2fr; gap: var(--space-xl);
  align-items: center;
}
.credibility-image {
  margin: 0; width: 100%; max-width: 380px;
  aspect-ratio: 4 / 5; border-radius: 4px; overflow: hidden;
  box-shadow: 0 24px 56px -30px rgba(15, 42, 68, 0.4);
}
.credibility-image img { width: 100%; height: 100%; object-fit: cover; object-position: center 28%; }
.credibility-text h2 {
  font-family: 'Fraunces', serif; font-variation-settings: "opsz" 84, "SOFT" 40;
  font-size: var(--display-m); font-weight: 380; line-height: 1.1;
  color: var(--navy); letter-spacing: -0.02em; margin: 14px 0 18px;
}
.credibility-text h2 em { font-style: italic; color: var(--gold); }
.credibility-text .lead { font-size: var(--body-l); color: var(--warm-grey); max-width: 54ch; }
.credential-list { list-style: none; margin: 28px 0 0; padding: 22px 0 0; border-top: 1px solid var(--rule); display: grid; gap: 2px; }
.credential-list li { padding: 13px 0; border-bottom: 1px solid var(--rule); }
.credential-list li:last-child { border-bottom: none; }
.credential-list li strong {
  display: block; font-family: 'Fraunces', serif; font-weight: 500;
  font-size: 15.5px; color: var(--ink); letter-spacing: -0.005em; margin-bottom: 2px;
}
.credential-list li span { font-size: 13.5px; color: var(--warm-grey-soft); }

/* ---- VOICES: on deep ground for light/dark contrast ---- */
.voices-band { background: var(--warm-white-deep); border-top: 1px solid var(--rule); }
.voices-inner { max-width: var(--max-w); margin: 0 auto; }
.voices-head { text-align: center; margin-bottom: var(--space-l); }
.voices-head h2 {
  font-family: 'Fraunces', serif; font-variation-settings: "opsz" 84, "SOFT" 40;
  font-size: var(--display-m); font-weight: 380; line-height: 1.1;
  color: var(--navy); letter-spacing: -0.02em; margin-top: 12px;
}
.voices-head h2 em { font-style: italic; color: var(--gold); }
.voices-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-m); max-width: 980px; margin: 0 auto; }
.voice-card {
  margin: 0; background: var(--warm-white); border: 1px solid var(--rule);
  border-radius: 5px; padding: 38px 34px; display: flex; flex-direction: column;
}
.voice-card.voice-featured { background: var(--navy); border-color: var(--navy); }
.voice-card blockquote {
  font-family: 'Fraunces', serif; font-weight: 360; font-size: 20px;
  line-height: 1.4; letter-spacing: -0.01em; color: var(--ink);
  margin: 0 0 24px; flex: 1;
}
.voice-card.voice-featured blockquote { color: var(--warm-white); }
.voice-card blockquote em { font-style: italic; color: var(--gold); }
.voice-card.voice-featured blockquote em { color: var(--gold-soft); }
.voice-card figcaption { padding-top: 18px; border-top: 1px solid var(--rule); }
.voice-card.voice-featured figcaption { border-top-color: rgba(255,255,255,0.16); }
.voice-card figcaption strong {
  display: block; font-family: 'Fraunces', serif; font-weight: 500; font-size: 15px;
  color: var(--ink); letter-spacing: -0.005em; margin-bottom: 2px;
}
.voice-card.voice-featured figcaption strong { color: var(--warm-white); }
.voice-card figcaption span { font-size: 12.5px; color: var(--warm-grey-soft); letter-spacing: 0.03em; }

/* ---- SPEAKING: overlap that actually holds its shape ---- */
.speaking-band { background: var(--warm-white); }
.speaking-inner {
  max-width: var(--max-w); margin: 0 auto;
  display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-xl); align-items: center;
}
.speaking-images { position: relative; height: 480px; }
.speaking-img-main {
  position: absolute; top: 0; left: 0; width: 68%; height: 100%; margin: 0;
  border-radius: 4px; overflow: hidden; z-index: 2;
  box-shadow: 0 24px 56px -30px rgba(15, 42, 68, 0.42);
}
.speaking-img-sub {
  position: absolute; bottom: 24px; right: 0; width: 46%; height: 52%; margin: 0;
  border-radius: 4px; overflow: hidden; z-index: 3;
  border: 6px solid var(--warm-white);
  box-shadow: 0 20px 46px -26px rgba(15, 42, 68, 0.42);
}
.speaking-images img { width: 100%; height: 100%; object-fit: cover; object-position: center 25%; }
.speaking-text h2 {
  font-family: 'Fraunces', serif; font-variation-settings: "opsz" 84, "SOFT" 40;
  font-size: var(--display-m); font-weight: 380; line-height: 1.08;
  color: var(--navy); letter-spacing: -0.02em; margin: 14px 0 18px;
}
.speaking-text h2 em { font-style: italic; color: var(--gold); }
.speaking-text .lead { font-size: var(--body-l); color: var(--warm-grey); max-width: 48ch; margin-bottom: 26px; }

/* ---- Responsive ---- */
@media (max-width: 980px) {
  .hero-with-portrait .hero-grid,
  .credibility-inner,
  .speaking-inner { grid-template-columns: 1fr; gap: var(--space-l); }
  .hero-col-image { order: -1; }
  .hero-portrait, .credibility-image { margin: 0 auto; }
  .voices-grid { grid-template-columns: 1fr; max-width: 520px; }
  .credibility-band, .voices-band, .speaking-band { padding: var(--space-xl) 24px; }
  .speaking-images { height: 380px; max-width: 480px; margin: 0 auto; }
}
@media (max-width: 560px) {
  .speaking-images { height: 320px; }
  .hero-offerings { gap: 14px; }
}

/* ============================================================
   v1.5.2 — CSP fix: classes replacing former inline styles
   The theme's Content-Security-Policy blocks inline style
   attributes (no 'unsafe-inline' in style-src). These move
   the former inline declarations into the external sheet so
   they apply within the security model.
   ============================================================ */
.pillars-intro-band { border-top: 1px solid var(--rule); }
.pillars-intro-inner { text-align: center; }
.pillars-intro-eyebrow { margin-bottom: 16px; }
.pillars-intro-h2 {
  font-size: var(--display-s); font-weight: 380; max-width: 760px;
  margin: 0 auto; color: var(--navy); letter-spacing: -0.015em; line-height: 1.25;
}
.four-ps-section { background: var(--warm-white); }
.lead-spaced { margin-top: 18px; }

/* ============================================================
   v1.5.2 — Defensive image sizing
   Higher-specificity caps so no existing rule or cascade
   order can leave homepage images full-bleed. Belt and braces.
   ============================================================ */
.hero.hero-with-portrait .hero-portrait { width: 100%; max-width: 420px; margin-left: auto; }
.hero.hero-with-portrait .hero-portrait img { width: 100%; height: 100%; object-fit: cover; object-position: center 20%; }

.credibility-band .credibility-image { width: 100%; max-width: 380px; }
.credibility-band .credibility-image img { width: 100%; height: 100%; object-fit: cover; object-position: center 28%; }

.speaking-band .speaking-images { position: relative; height: 480px; }
.speaking-band .speaking-images .speaking-img-main { position: absolute; top: 0; left: 0; width: 68%; height: 100%; }
.speaking-band .speaking-images .speaking-img-sub  { position: absolute; bottom: 24px; right: 0; width: 46%; height: 52%; }
.speaking-band .speaking-images img { width: 100%; height: 100%; object-fit: cover; }

@media (max-width: 980px) {
  .speaking-band .speaking-images { height: 380px; max-width: 480px; margin: 0 auto; }
}
@media (max-width: 560px) {
  .speaking-band .speaking-images { height: 320px; }
}

/* ---- Home page podcast band (v1.5.11) ---- */
.podcast-band .section-head { text-align: center; }
.podcast-player { max-width: 760px; margin: 32px auto 24px; }
.podcast-player iframe { display: block; width: 100%; border: 0; border-radius: 0; }
.podcast-band .tpdg-listen,
.podcast-band .tpdg-listen__row { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; }

/* How-it-works (v1.6.4) */
.how-it-works .hiw-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:28px; margin-top:8px; }
.how-it-works .hiw-step { }
.how-it-works .hiw-num { display:block; font-size:34px; line-height:1; color:var(--gold); margin-bottom:12px; }
.how-it-works .hiw-step h3 { margin:0 0 8px; font-size:20px; }
.how-it-works .hiw-step p { font-size:15px; line-height:1.6; }

/* ============================================================
   v1.7.0 — Statement hero (Option B: bold · secure · dynamic · professional)
   A self-contained, reversible variant. Adding the `hero-statement`
   class to the homepage hero flips it to a full-bleed navy treatment
   with an ambient teal + gold glow. Remove the class to restore the
   original light portrait hero — no other markup depends on this.
   All declarations live here in the sheet (theme convention: no inline
   styles), and every motion is gated on prefers-reduced-motion.
   ============================================================ */
.hero.hero-statement {
  background: var(--navy);
  color: var(--warm-white);
  isolation: isolate;
}
/* Ambient glow — soft, blurred colour spots behind the content (not a hard
   gradient). Teal top-right, gold bottom-left; both sit under the content. */
.hero.hero-statement::before {
  content: "";
  position: absolute;
  top: -12%;
  right: -6%;
  width: 620px;
  height: 620px;
  max-width: 70vw;
  background: radial-gradient(circle, rgba(30, 95, 115, 0.55) 0%, rgba(30, 95, 115, 0) 68%);
  filter: blur(30px);
  pointer-events: none;
  z-index: -1;
}
.hero.hero-statement::after {
  content: "";
  position: absolute;
  bottom: -22%;
  left: -8%;
  width: 520px;
  height: 520px;
  max-width: 66vw;
  background: radial-gradient(circle, rgba(201, 169, 91, 0.20) 0%, rgba(201, 169, 91, 0) 70%);
  filter: blur(24px);
  pointer-events: none;
  z-index: -1;
}

/* Type + accents recoloured for the dark ground */
.hero-statement .hero-eyebrow .rule { background: var(--gold-soft); }
.hero-statement .eyebrow { color: var(--gold-soft); }
.hero-statement .hero-headline { color: var(--warm-white); }
.hero-statement .hero-headline em { color: var(--gold-soft); }
.hero-statement .hero-sub { color: rgba(251, 247, 238, 0.82); }
.hero-statement .hero-offerings span { color: rgba(251, 247, 238, 0.72); }
.hero-statement .hero-offerings span::before { background: var(--teal-soft); }

/* CTAs on navy: gold primary that inverts to warm-white on hover
   (the base .btn hovers to navy, which would vanish here), and a
   scorecard link recoloured for the dark ground. */
.hero-statement .hero-cta-group .btn {
  background: var(--gold);
  border-color: var(--gold);
  color: var(--warm-white);
}
.hero-statement .hero-cta-group .btn:hover {
  background: var(--warm-white);
  border-color: var(--warm-white);
  color: var(--navy);
}
.hero-statement .hero-cta-group .small-link {
  color: rgba(251, 247, 238, 0.78);
  border-bottom-color: rgba(251, 247, 238, 0.28);
}
.hero-statement .hero-cta-group .small-link:hover {
  color: var(--warm-white);
  border-bottom-color: var(--gold-soft);
}

/* Portrait: a hairline gold frame so it sits deliberately on the navy,
   with a deeper lift shadow. */
.hero-statement .hero-portrait {
  box-shadow: 0 30px 70px -30px rgba(0, 0, 0, 0.55);
  outline: 1px solid rgba(201, 169, 91, 0.35);
  outline-offset: 0;
}
.hero-statement .hero-portrait-cap .cap-name { color: var(--warm-white); }
.hero-statement .hero-portrait-cap .cap-role { color: var(--gold-soft); }

/* Dynamic — restrained entrance + slow ambient drift. Motion only for
   users who haven't asked to reduce it; content is fully visible without JS. */
@media (prefers-reduced-motion: no-preference) {
  .hero.hero-statement .hero-col-text > * {
    animation: tpdg-rise 0.7s cubic-bezier(0.22, 0.61, 0.36, 1) both;
  }
  .hero.hero-statement .hero-eyebrow { animation-delay: 0.02s; }
  .hero.hero-statement .hero-headline { animation-delay: 0.08s; }
  .hero.hero-statement .hero-sub { animation-delay: 0.16s; }
  .hero.hero-statement .hero-cta-group { animation-delay: 0.24s; }
  .hero.hero-statement .hero-offerings { animation-delay: 0.30s; }
  .hero.hero-statement .hero-col-image { animation: tpdg-fade 0.9s ease 0.18s both; }
  .hero.hero-statement::before { animation: tpdg-drift-a 18s ease-in-out infinite alternate; }
  .hero.hero-statement::after  { animation: tpdg-drift-b 22s ease-in-out infinite alternate; }
}
@keyframes tpdg-rise {
  from { opacity: 0; transform: translateY(14px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes tpdg-fade {
  from { opacity: 0; transform: scale(0.985); }
  to   { opacity: 1; transform: scale(1); }
}
@keyframes tpdg-drift-a {
  from { transform: translate(0, 0); }
  to   { transform: translate(-26px, 20px); }
}
@keyframes tpdg-drift-b {
  from { transform: translate(0, 0); }
  to   { transform: translate(22px, -18px); }
}

/* Header sits directly above the navy hero — soften the seam so the
   sticky cream bar doesn't cut a hard line into the navy on load. */
.hero.hero-statement { border-top: 1px solid rgba(201, 169, 91, 0.18); }
