
/* =========================================================
   V22 — spacing, About hero fit, and site-wide mobile repair
   Content intentionally unchanged.
   ========================================================= */

/* ---------- Overall rhythm ---------- */
:root {
  --v22-space-xl: clamp(4rem, 6vw, 5.8rem);
  --v22-space-lg: clamp(3.2rem, 5vw, 4.8rem);
  --v22-space-md: clamp(2.3rem, 4vw, 3.6rem);
}

.home-hero,
.about-hero,
.page-intro,
.contact-hero-v8 {
  padding-top: var(--v22-space-lg) !important;
  padding-bottom: var(--v22-space-lg) !important;
}

.home-bridge,
.home-evidence,
.home-close,
.about-story,
.training-section,
.about-snapshot,
.about-detail,
.research-hub,
.life-course-section,
.engagement-topics-v8,
.engagement-audience-v8,
.engagement-history-v8,
.contact-main-v8,
.contact-direct-v8,
.contact-guide-v8,
.professional-enquiry-full {
  padding-top: var(--v22-space-md) !important;
  padding-bottom: var(--v22-space-md) !important;
}

/* Keep headings/copy close enough to feel intentionally grouped. */
.page-intro-title,
.about-story-heading,
.research-pathway-heading,
.life-course-heading,
.audience-heading-row > div {
  margin-bottom: 1rem !important;
}
.page-intro-copy,
.about-story-copy,
.research-pathway-heading > p,
.life-course-heading > p,
.audience-heading-row > p {
  margin-top: 0 !important;
}

/* ---------- About page: fix clipped name + image balance ---------- */
.about-hero {
  overflow: hidden !important;
}
.about-hero .container {
  width: min(calc(100% - 56px), 1280px) !important;
}
.about-hero-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1.12fr) minmax(420px, .88fr) !important;
  gap: clamp(2.3rem, 4vw, 4.2rem) !important;
  align-items: center !important;
}
.about-hero-copy {
  min-width: 0 !important;
}
.about-hero-copy h1.no-wrap-desktop {
  max-width: 100% !important;
  font-size: clamp(3rem, 3.6vw, 4rem) !important;
  line-height: .98 !important;
  white-space: nowrap !important;
  letter-spacing: 0 !important;
  margin: .35rem 0 1.2rem !important;
}
.about-hero-copy .page-lead,
.about-hero-copy .about-affiliation {
  max-width: 650px !important;
  margin-bottom: 0 !important;
}
.about-hero-copy .about-affiliation {
  margin-top: 1rem !important;
}
.about-conference-image {
  margin: 0 !important;
  width: 100% !important;
  max-width: 560px !important;
  justify-self: end !important;
}
.about-conference-image img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  object-fit: contain !important;
}

/* ---------- Support intros: cleaner spacing after stacking ---------- */
.page-intro-editorial-grid {
  max-width: 1120px !important;
}
.page-intro-title {
  max-width: 980px !important;
}
.page-intro-title h1 {
  max-width: 980px !important;
  margin: .3rem 0 0 !important;
}
.page-intro-copy {
  max-width: 920px !important;
  line-height: 1.72 !important;
}
.page-intro-copy p {
  margin-bottom: 1rem !important;
}

/* Research blocks */
.research-pathway-heading {
  max-width: 980px !important;
}
.research-pathway-heading h2 {
  margin-bottom: .65rem !important;
}
.research-pathway-heading > p {
  max-width: 820px !important;
  line-height: 1.65 !important;
}
.two-column-detail {
  padding-top: 2rem !important;
  padding-bottom: 1.2rem !important;
}
.two-column-detail > div:first-child {
  margin-bottom: .85rem !important;
}
.two-column-detail .plain-copy {
  max-width: 900px !important;
}

/* Nutrition heading */
.life-course-heading {
  max-width: 1000px !important;
}
.life-course-heading h2 {
  margin-bottom: .6rem !important;
}
.life-course-heading > p {
  max-width: 820px !important;
}

/* Professional engagement intro/audiences */
.engagement-intro .page-intro-title,
.engagement-intro .page-intro-copy {
  max-width: 980px !important;
}
.audience-heading-row > p {
  max-width: 900px !important;
}

/* About story reading width */
.about-story-heading {
  max-width: 760px !important;
}
.about-story-copy {
  max-width: 920px !important;
}
.about-story-copy p {
  line-height: 1.74 !important;
  margin-bottom: 1.15rem !important;
}

/* ---------- Mobile / tablet ---------- */
@media (max-width: 1100px) {
  .about-hero .container {
    width: min(calc(100% - 40px), 960px) !important;
  }
  .about-hero-grid {
    grid-template-columns: 1fr !important;
    gap: 2rem !important;
  }
  .about-hero-copy h1.no-wrap-desktop {
    white-space: normal !important;
    font-size: clamp(2.8rem, 7vw, 3.8rem) !important;
  }
  .about-conference-image {
    justify-self: start !important;
    max-width: 720px !important;
  }

  .page-intro-editorial-grid,
  .page-intro-title,
  .page-intro-copy,
  .about-story-heading,
  .about-story-copy,
  .research-pathway-heading,
  .life-course-heading {
    max-width: none !important;
  }

  .engagement-topic-grid,
  .engagement-history-grid,
  .contact-card-grid,
  .contact-info-grid,
  .contact-guide-grid {
    grid-template-columns: 1fr !important;
  }

  .audience-strip {
    grid-template-columns: repeat(3, minmax(0,1fr)) !important;
  }

  .service-form-grid {
    grid-template-columns: 1fr !important;
  }
}

/* Mobile nav and page layout */
@media (max-width: 760px) {
  body {
    overflow-x: hidden !important;
    font-size: 16px !important;
  }

  .container,
  .container-wide,
  .narrow,
  .narrow-editorial,
  .about-hero .container {
    width: min(calc(100% - 28px), 100%) !important;
  }

  .site-header {
    position: sticky !important;
    top: 0 !important;
    z-index: 100 !important;
  }
  .nav-wrap {
    min-height: 58px !important;
    justify-content: flex-end !important;
  }
  .menu-toggle {
    display: inline-flex !important;
    padding: .55rem .8rem !important;
    font-size: 1rem !important;
  }
  .nav-links {
    top: 58px !important;
    left: 10px !important;
    right: 10px !important;
    width: auto !important;
    max-height: calc(100vh - 76px) !important;
    overflow-y: auto !important;
    border-radius: 12px !important;
    padding: .45rem !important;
  }
  .nav-links > li,
  .nav-links a,
  .nav-support-toggle {
    width: 100% !important;
  }
  .nav-links a,
  .nav-support-toggle {
    padding: .75rem .8rem !important;
    border-radius: 8px !important;
  }
  .nav-support-toggle {
    justify-content: flex-start !important;
  }
  .nav-submenu {
    position: static !important;
    width: auto !important;
    min-width: 0 !important;
    margin: .2rem .35rem .35rem .8rem !important;
    padding: .15rem 0 .15rem .5rem !important;
    border-left: 2px solid rgba(36,56,74,.14) !important;
    background: transparent !important;
    box-shadow: none !important;
    border-radius: 0 !important;
  }
  .nav-submenu a {
    color: var(--navy) !important;
    padding: .62rem .72rem !important;
  }
  .nav-submenu a:hover,
  .nav-submenu a[aria-current="page"] {
    color: var(--rust) !important;
    background: #f7f2ee !important;
  }

  /* Hero areas */
  .home-hero,
  .about-hero,
  .page-intro,
  .contact-hero-v8 {
    padding-top: 2.5rem !important;
    padding-bottom: 2.5rem !important;
  }
  .home-hero-grid-v6,
  .about-hero-grid {
    grid-template-columns: 1fr !important;
    gap: 1.8rem !important;
  }
  .home-hero-copy-v6 h1,
  .about-hero-copy h1.no-wrap-desktop,
  .page-intro-title h1 {
    white-space: normal !important;
    font-size: clamp(2.35rem, 11vw, 3.1rem) !important;
    line-height: 1.02 !important;
  }
  .hero-eyebrow,
  .kicker {
    line-height: 1.35 !important;
  }
  .credential-stack-v6 {
    gap: .25rem !important;
  }
  .credential-stack-v6 span {
    font-size: 1rem !important;
    line-height: 1.42 !important;
  }
  .hero-insight-line {
    font-size: 1rem !important;
    line-height: 1.5 !important;
  }
  .portrait-full,
  .about-conference-image {
    width: 100% !important;
    max-width: 100% !important;
    justify-self: stretch !important;
  }

  /* Section spacing */
  .home-bridge,
  .home-evidence,
  .home-close,
  .about-story,
  .training-section,
  .about-snapshot,
  .about-detail,
  .research-hub,
  .life-course-section,
  .engagement-topics-v8,
  .engagement-audience-v8,
  .engagement-history-v8,
  .contact-main-v8,
  .contact-direct-v8,
  .contact-guide-v8,
  .professional-enquiry-full {
    padding-top: 2.35rem !important;
    padding-bottom: 2.35rem !important;
  }

  /* Cards/lists */
  .service-pair-grid-v18 {
    width: min(calc(100% - 28px), 100%) !important;
    grid-template-columns: 1fr !important;
    gap: 1rem !important;
    padding: 1.4rem 0 !important;
  }
  .service-pair-grid-v18 .service-panel-v6 {
    min-height: 0 !important;
    padding: 1.4rem !important;
  }
  .service-pair-grid-v18 .service-panel-v6 h2 {
    font-size: 1.7rem !important;
  }
  .service-pair-grid-v18 .arrow-link {
    white-space: normal !important;
  }

  .home-close-grid,
  .home-close-links,
  .training-grid,
  .about-detail-grid,
  .research-service-grid-clean,
  .tab-list,
  .contact-card-grid,
  .contact-guide-grid {
    grid-template-columns: 1fr !important;
  }

  .home-close-links a {
    min-height: auto !important;
  }

  /* Research pathway */
  .research-pathway {
    padding: 1rem !important;
  }
  .research-pathway-steps {
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    gap: .7rem !important;
  }
  .research-step {
    min-height: 112px !important;
    padding: .8rem .55rem !important;
  }
  .research-pathway-detail {
    grid-template-columns: 1fr !important;
    padding: 1rem !important;
  }
  .research-pathway-tags {
    border-left: 0 !important;
    padding-left: 0 !important;
  }

  /* Forms */
  .service-form-wrap,
  .enquiry-form {
    padding: 1rem !important;
    border-radius: 14px !important;
  }
  .form-grid-two {
    grid-template-columns: 1fr !important;
    gap: .2rem !important;
  }
  .enquiry-form input,
  .enquiry-form select,
  .enquiry-form textarea {
    font-size: 16px !important; /* avoids iOS zoom */
  }

  /* Life-course graphic: horizontal scroll instead of shrinking to unreadable size */
  .life-course-horizontal,
  .life-course-visual-photo {
    padding: .8rem !important;
  }
  .life-course-artboard,
  .life-course-reference-figure {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }
  .life-course-artboard img,
  .life-course-reference-figure img {
    min-width: 720px !important;
    width: 720px !important;
    max-width: none !important;
  }
  .life-course-stage-row,
  .life-course-chip-row {
    display: flex !important;
    overflow-x: auto !important;
    gap: .55rem !important;
    padding-bottom: .35rem !important;
    -webkit-overflow-scrolling: touch !important;
  }
  .life-stage-tab,
  .life-stage-chip {
    flex: 0 0 auto !important;
  }
  .life-course-detail,
  .life-course-detail-wide {
    padding: 1rem !important;
    min-height: 0 !important;
  }

  /* Professional audiences */
  .audience-strip {
    grid-template-columns: 1fr 1fr !important;
    margin-top: 1.2rem !important;
  }
  .audience-strip span {
    padding: .9rem .4rem !important;
  }
  .engagement-timeline {
    margin-left: 26px !important;
  }

  /* Footer */
  .footer-minimal {
    gap: 1.2rem !important;
  }
  .footer-policy-links {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: .65rem 1rem !important;
  }
}

/* Small phones */
@media (max-width: 420px) {
  .home-hero-copy-v6 h1,
  .about-hero-copy h1.no-wrap-desktop,
  .page-intro-title h1 {
    font-size: 2.25rem !important;
  }
  .research-pathway-steps,
  .audience-strip {
    grid-template-columns: 1fr !important;
  }
}
