/* Shared spacing foundation: Home, About, Speaking and Mentorship only.
   Loaded after page styles to adapt existing layouts without changing artwork,
   image crops, carousels or the separate Toolkit page. */
:root {
  --space-xs: .5rem; /* 8px */
  --space-sm: 1rem; /* 16px */
  --space-md: 1.5rem; /* 24px */
  --space-lg: 2rem; /* 32px */
  --space-xl: 3rem; /* 48px */
  --space-2xl: 4rem; /* 64px */
  --space-3xl: 6rem; /* 96px */
  --container-width: 1100px;
  --prose-width: 680px;
  --page-gutter: var(--space-lg);
  --section-space: var(--space-3xl);
}
.site-spacing { line-height: 1.6; }
.site-spacing *, .site-spacing *::before, .site-spacing *::after { box-sizing: border-box; }
.site-spacing p { line-height: 1.6; }
/* Containers own their gutters; full-width section backgrounds stay intact. */
.site-spacing .container,
.site-spacing .m-wrap {
  width: calc(100% - var(--page-gutter) * 2);
  max-width: var(--container-width);
  margin-inline: auto;
  padding-inline: 0;
}
.site-spacing .prose, .site-spacing .text-content {
  max-width: var(--prose-width);
  overflow-wrap: break-word;
}
/* Longer prose follows proximity rules; component headings retain their sizes. */
.site-spacing .prose :is(h1, h2) { margin: var(--space-xl) 0 var(--space-sm); }
.site-spacing .prose h3 { margin: var(--space-lg) 0 var(--space-xs); }
.site-spacing .prose p { margin: 0 0 var(--space-md); }
.site-spacing .prose > :first-child { margin-top: 0; }
.site-spacing .prose > :last-child { margin-bottom: 0; }
.site-spacing :is(.section, .m-section) { padding-block: var(--section-space); padding-inline: 0; }
/* Match navigation and footer edges to the same centred content measure. */
.site-spacing > nav,
.site-spacing > footer {
  padding-inline: max(var(--page-gutter), calc((100% - var(--container-width)) / 2));
}
.site-spacing > footer { padding-block: var(--space-2xl); }
.site-spacing .footer-inner { max-width: var(--container-width); gap: var(--space-xl); margin-bottom: var(--space-xl); }

/* HOME: preserve the full-bleed hero and horizontal animated strips.
   Existing fades count as section breathing room instead of doubling it. */
.page-home :is(.credibility, .speaking, .feedback, .newsletter) {
  padding-inline: var(--page-gutter);
}
.page-home :is(.credibility-row, .speaking-inner) { max-width: var(--container-width); }
.page-home .hero-content {
  max-width: var(--container-width);
  margin-inline: auto;
  padding-inline: var(--page-gutter);
  padding-bottom: var(--space-2xl);
}
.page-home .hero h1 { margin-bottom: var(--space-sm); }
.page-home .hero p.subhead { line-height: 1.6; margin-bottom: var(--space-md); }
.page-home .credibility { padding-top: var(--space-lg); padding-bottom: var(--space-3xl); }
.page-home .logos { padding-top: var(--space-md); padding-bottom: var(--space-2xl); }
.page-home .help { padding-top: var(--section-space); }
.page-home .help-header { margin-bottom: var(--space-xl); padding-inline: var(--page-gutter); }
.page-home .speaking { padding-top: var(--section-space); }
.page-home .speaking-inner { gap: var(--space-xl); }
.page-home .speaking-fade, .page-home .feedback-fade { height: var(--section-space); }
.page-home .feedback { padding-top: var(--space-lg); }
.page-home .feedback-header { margin-bottom: var(--space-lg); }
.page-home .newsletter { padding-top: var(--section-space); }
.page-home .newsletter-inner { max-width: var(--prose-width); gap: var(--space-md); }
.page-home .newsletter-cta { padding-bottom: var(--section-space); }
/* Toolkit teaser and Toolkit page styling are deliberately excluded. */

/* ABOUT: consistent timeline rhythm with unchanged photo dimensions/crops. */
.page-about .about-hero { padding: var(--section-space) var(--page-gutter) 0; }
.page-about .about-hero-inner { max-width: var(--container-width); gap: var(--space-xl); }
.page-about .hero-summary { line-height: 1.6; }
.page-about .timeline {
  width: calc(100% - var(--page-gutter) * 2);
  max-width: var(--container-width);
  padding: var(--section-space) 0;
}
.page-about .timeline-entry { padding-left: var(--space-xl); padding-bottom: var(--section-space); }
.page-about .timeline-entry h2 { margin: 0 0 var(--space-sm); }
.page-about .entry-content { gap: var(--space-xl); }
.page-about .entry-content p { max-width: var(--prose-width); line-height: 1.6; }
.page-about .closing { max-width: var(--prose-width); padding: var(--space-sm) 0 var(--space-2xl); line-height: 1.6; }

/* SPEAKING: one container and one gutter per section. */
.page-speaking .section-header { max-width: var(--prose-width); margin-bottom: var(--space-xl); }
.page-speaking h1 { margin: var(--space-sm) 0 var(--space-md); }
.page-speaking h2 { margin: 0 0 var(--space-sm); }
.page-speaking h3 { margin: 0 0 var(--space-xs); }
.page-speaking :is(.hero-grid, .booking-grid) { gap: var(--space-xl); }
.page-speaking :is(.themes-grid, .testimonials-grid, .events-grid, .features-grid) { gap: var(--space-md); }
.page-speaking :is(.theme-card, .quote-card, .feature-card, .booking-details) { padding: var(--space-md); }
.page-speaking :is(.faq-answer, .hero-grid p, .booking-grid p) { max-width: var(--prose-width); line-height: 1.6; }
.page-speaking .faq-item summary { padding-block: var(--space-md); }
.page-speaking .faq-answer { padding-bottom: var(--space-md); }

/* MENTORSHIP: shared rhythm across offers, testimonials and application. */
.page-mentorship .m-hero { padding-block: var(--section-space); gap: var(--space-xl); }
.page-mentorship .m-hero h1 { margin: 0 0 var(--space-md); }
.page-mentorship h2 { margin: 0 0 var(--space-md); }
.page-mentorship h3 { margin: var(--space-lg) 0 var(--space-xs); }
.page-mentorship .m-package h3 { margin-top: 0; }
.page-mentorship :is(.m-support, .m-quotes, .m-packages, .m-steps, .m-option-notes) { gap: var(--space-md); }
.page-mentorship :is(.m-why, .m-application, .m-faq) { gap: var(--space-xl); }
.page-mentorship :is(.m-package, .m-quote, form) { padding: var(--space-lg); }
.page-mentorship .m-field, .page-mentorship fieldset { margin-bottom: var(--space-md); }
.page-mentorship .m-field-grid { gap: var(--space-md); }
.page-mentorship .m-disclaimer { max-width: var(--prose-width); }
.page-mentorship .m-final { padding: var(--section-space) var(--page-gutter); }

/* Below 768px, use 16px outer gutters and 64px major section spacing. */
@media (max-width: 767px) {
  :root { --page-gutter: var(--space-sm); --section-space: var(--space-2xl); }
  .site-spacing .footer-inner { gap: var(--space-lg); margin-bottom: var(--space-lg); }
  .page-home .speaking-inner { gap: var(--space-lg); }
  .page-about .about-hero-inner { grid-template-columns: 1fr; gap: var(--space-lg); }
  .page-about .hero-photo { grid-row: 1; justify-self: center; max-width: 260px; }
  .page-about .timeline-entry { padding-left: var(--space-md); }
  .page-about .entry-content { gap: var(--space-md); }
  .page-speaking :is(.hero-grid, .themes-grid, .testimonials-grid, .events-grid, .features-grid, .booking-grid) { grid-template-columns: 1fr; gap: var(--space-lg); }
  .page-mentorship :is(.m-hero, .m-why, .m-quotes, .m-packages, .m-option-notes, .m-application, .m-faq) { grid-template-columns: 1fr; gap: var(--space-lg); }
  .page-mentorship :is(.m-package, .m-quote, form) { padding: var(--space-md); }
  .page-mentorship .m-field-grid { grid-template-columns: 1fr; gap: 0; }
}

/* Mobile homepage statistics: all four groups share one compact row. */
@media (max-width: 767px) {
  .page-home .credibility-row {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--space-xs);
  }
  .page-home .credibility-row .stat {
    min-width: 0;
    padding: 0;
    border-left: 0;
    text-align: center;
  }
  .page-home .stat-value {
    font-size: clamp(16px, 4.4vw, 24px);
    white-space: nowrap;
  }
  .page-home .stat-label {
    font-size: clamp(8px, 2.35vw, 12px);
    white-space: nowrap;
  }
}

/* A shorter mobile hero also reveals more of the full-width video frame. */
@media (max-width: 767px) {
  .page-home .hero {
    height: 84vh;
    height: 84svh;
    min-height: 560px;
  }
}

/* Compact statistics band on phones, with room for the curved divider. */
@media (max-width: 767px) {
  .page-home .credibility { padding-top: 16px; padding-bottom: 40px; }
  .page-home .credibility .wave-divider { height: 24px; }
}

/* Mobile 8-point rhythm. Desktop rules above remain unchanged.
   Use 8px within a text group, 16px before its action, and 32px between groups. */
@media (max-width: 767px) {
  :root { --page-gutter: 16px; --section-space: 32px; }
  .site-spacing :is(h1, h2, h3) + p { margin-top: 8px; }
  .site-spacing :is(.prose, .text-content) :is(h1, h2, h3) { margin-top: 24px; margin-bottom: 8px; }
  .site-spacing :is(.prose, .text-content) p { margin-bottom: 16px; }
  .site-spacing > footer { padding-block: 32px; }
  .site-spacing :is(.section, .m-section) { padding-block: 16px; }

  /* Existing decorative transitions provide part of each section's gap. */
  .page-home .hero h1 { margin-bottom: 8px; }
  .page-home .hero p.subhead { margin-top: 0; margin-bottom: 16px; }
  .page-home .logos { padding-top: 16px; padding-bottom: 16px; }
  .page-home .help { padding-top: 16px; }
  .page-home .help-header { margin-bottom: 24px; }
  .page-home .speaking-inner { gap: 24px; }
  .page-home :is(.speaking-fade, .feedback-fade) { height: 32px; }
  .page-home .feedback { padding-top: 0; }
  .page-home .feedback-header { margin-bottom: 24px; }
  .page-home .newsletter-inner { gap: 16px; }
  .page-home .newsletter-cta { padding-bottom: 16px; }
  .page-home .offers-description { margin-bottom: 16px; min-height: 0; }
  .page-home .offers-detail { padding-inline: 16px; }
  .page-home .offers-position { margin-top: 16px; }

  .page-about .timeline-entry h2 { margin-bottom: 8px; }
  .page-about .entry-content { gap: 16px; }
  .page-about .closing { padding-bottom: 32px; }
  .page-speaking .section-header { margin-bottom: 24px; }
  .page-speaking :is(h1, h2) { margin-bottom: 8px; }
  .page-speaking :is(.hero-grid, .booking-grid, .themes-grid, .testimonials-grid, .events-grid, .features-grid) { gap: 24px; }
  .page-speaking .wave { height: 24px; }
  .page-speaking p:has(+ .btn) { margin-bottom: 16px; }
  .page-mentorship :is(.m-hero h1, h2, h3) { margin-bottom: 8px; }
  .page-mentorship .m-lead { margin-bottom: 16px; }
  .page-mentorship :is(.m-hero, .m-why, .m-quotes, .m-packages, .m-option-notes, .m-application, .m-faq) { gap: 24px; }
  .page-mentorship .m-availability { margin-top: 16px; }
}

/* Mobile speaking: heading, full-width photo deck, copy, then action.
   Explicit gallery width prevents its absolutely positioned photos collapsing. */
@media (max-width: 767px) {
  .page-home .speaking-inner { display:flex; flex-direction:column; align-items:stretch; gap:16px; }
  .page-home .speaking-content { display:contents; }
  .page-home .speaking-content h2 { order:0; margin:0; }
  .page-home .speaking-gallery { order:1; width:100%; max-width:360px; margin:0 auto 24px; }
  .page-home .speaking-photo-viewport { margin:16px 32px; aspect-ratio:4 / 5; }
  .page-home .speaking-content p { order:2; margin:0; }
  .page-home .speaking-content .btn { order:3; align-self:flex-start; margin-top:0; }
}

/* Compact transition from the offers/testimonials to Public Speaking. */
.page-home .help .testimonial-strip { margin-bottom:0; }
.page-home .help > .diagonal-divider { height:24px; }
.page-home .speaking { padding-top:24px; }
@media (max-width:767px) {
  .page-home .help > .diagonal-divider { height:16px; }
  .page-home .speaking { padding-top:16px; }
}

/* Homepage section breathing room; keep internal text and CTA spacing compact. */
.page-home .logos { padding-top:32px; padding-bottom:64px; }
.page-home .help { padding-top:96px; }
.page-home .help > .diagonal-divider { height:32px; }
.page-home .speaking { padding-top:48px; }
.page-home :is(.speaking-fade, .feedback-fade) { height:96px; }
.page-home .newsletter { padding-top:96px; }
.page-home .newsletter-cta { padding-bottom:96px; }
@media(max-width:767px) {
 .page-home .logos { padding-top:24px; padding-bottom:24px; }
 .page-home .help { padding-top:40px; }
 .page-home .help > .diagonal-divider { height:24px; }
 .page-home .speaking { padding-top:40px; }
 .page-home :is(.speaking-fade, .feedback-fade) { height:48px; }
 .page-home .newsletter { padding-top:40px; }
 .page-home .newsletter-cta { padding-bottom:48px; }
}

/* Consistent, readable CTA text on phones. */
@media(max-width:767px) {
 .site-spacing .btn, .page-home .toolkit-cta { font-size:14px; }
}