/* Programme purpose, support discovery and motion inspired by the brand.
   The logo artwork stays intact; only separate decorative elements move. */

.landing-page [hidden] { display: none !important; }
.landing-page :is(section[id], details[id]) { scroll-margin-block-start: calc(var(--space-16) + var(--space-10)); }
.purpose-card { justify-items: center; gap: var(--space-4); text-align: center; }
.purpose-card h2 { max-inline-size: 18ch; font-size: var(--text-xl); }
.purpose-card .eyebrow { font-size: var(--text-sm); }
.purpose-card__body { max-inline-size: 35ch; font-size: var(--text-sm); }
.brand-scene { position: relative; display: grid; place-items: center; inline-size: min(100%, 16rem); aspect-ratio: 1; }
.brand-scene__mark { display: block; inline-size: 7rem; block-size: auto; }
.brand-scene__ring { position: absolute; inset-block: 16%; inset-inline: 16%; border: var(--border-width-hairline) solid var(--color-brand-lavender); border-radius: 50%; }
.brand-scene__ring--outer { inset-block: 5%; inset-inline: 5%; border-style: dashed; }
.brand-scene__traveller { position: absolute; inset-block: 5%; inset-inline: 5%; }
.brand-scene__traveller > span { position: absolute; inset-block-start: 0; inset-inline-start: 50%; inline-size: var(--space-3); block-size: var(--space-3); border-radius: 50%; background: var(--color-accent); }
.brand-scene__traveller--second { inset-block: 16%; inset-inline: 16%; transform: rotate(155deg); }
.brand-scene__traveller--second > span { inline-size: var(--space-2); block-size: var(--space-2); background: var(--color-text-inverse); }
.brand-scene__anchor { position: absolute; inline-size: var(--space-2); block-size: var(--space-2); background: var(--color-brand-lavender); border-radius: 50%; }
.brand-scene__anchor--one { inset-block-start: 50%; inset-inline-start: 3.5%; }
.brand-scene__anchor--two { inset-block-end: 3.5%; inset-inline-end: 46%; }
.brand-values { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--space-2); list-style: none; }
.brand-values li { padding-block: var(--space-1); padding-inline: var(--space-3); border: var(--border-width-hairline) solid var(--color-brand-lavender); border-radius: var(--radius-pill); font-size: var(--text-xs); }
.programme-jump { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--space-3) var(--space-8); padding-block: var(--space-5); border-block-end: var(--border-width-hairline) solid var(--color-border); }
.programme-jump a { display: inline-flex; align-items: center; min-block-size: var(--space-11); color: var(--color-text-accent); font-size: var(--text-sm); font-weight: 700; text-decoration: none; }
.programme-jump a:hover { text-decoration: underline; text-underline-offset: var(--space-2); }
#programme { padding-block-end: var(--space-8); }
.purpose-eyebrow { grid-column: 1 / -1; }
#programme .section-heading { font-size: var(--text-2xl); max-inline-size: 22ch; }
.support-section { background: var(--color-surface-lavender); }
.support-section .section-shell, .outcomes-section .section-shell { gap: var(--space-5); }
.support-section .section-heading { max-inline-size: 28ch; }
.support-intro, .outcomes-intro { max-inline-size: 72ch; color: var(--color-text-secondary); }
.support-filters { display: flex; flex-wrap: wrap; gap: var(--space-3); padding-block: var(--space-3); }
.support-filter { padding-block: var(--space-3); padding-inline: var(--space-5); border: var(--border-width-hairline) solid var(--color-action-primary); border-radius: var(--radius-pill); background: var(--color-surface); color: var(--color-text-accent); font: inherit; font-size: var(--text-sm); font-weight: 700; cursor: pointer; min-block-size: var(--space-11); }
.support-filter[aria-pressed="true"] { background: var(--color-action-primary); color: var(--color-action-primary-text); }
.support-filter[aria-pressed="true"]::before { content: "✓"; margin-inline-end: var(--space-2); }
.support-results { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-5); }
.support-results[data-selected]:not([data-selected="all"]) { grid-template-columns: minmax(0, 1fr); max-inline-size: 48rem; inline-size: 100%; }
.support-route { display: flex; flex-direction: column; align-items: start; gap: var(--space-3); padding-block: var(--space-7); padding-inline: var(--space-6); border: var(--border-width-hairline) solid var(--color-border); border-radius: var(--radius-xl); background: var(--color-surface); }
.support-route > img { inline-size: var(--space-14); block-size: var(--space-14); }
.route-count { font-size: var(--text-sm); font-weight: 700; color: var(--color-text-accent); }
.support-route h3 { color: var(--color-text-accent); font-size: var(--text-xl); }
.support-route h4 { margin-block-start: var(--space-2); font-size: var(--text-sm); }
.support-route > p:not(.route-count), .support-route ul { font-size: var(--text-sm); color: var(--color-text-secondary); }
.support-route ul { display: grid; gap: var(--space-3); padding-inline-start: var(--space-5); list-style: disc; }
.route-link { display: inline-flex; align-items: center; min-block-size: var(--space-11); margin-block-start: auto; padding-block-start: var(--space-3); color: var(--color-text-accent); font-size: var(--text-sm); font-weight: 700; text-underline-offset: var(--space-1); }
.support-note { max-inline-size: 85ch; font-size: var(--text-sm); color: var(--color-text-secondary); }
.support-contact { color: var(--color-text-accent); font-size: var(--text-sm); text-underline-offset: var(--space-1); }
.outcomes-section { background: var(--color-surface-accent); }
.outcomes-section .section-shell { max-inline-size: 68rem; }
.outcomes-intro { font-size: var(--text-lg); line-height: 1.75; }
.outcomes-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; max-inline-size: none; margin-block: var(--space-8) var(--space-10); padding: 0; border-block: var(--border-width-hairline) solid var(--color-border); list-style: none; }
.outcomes-list li { padding-block: var(--space-8); padding-inline: var(--space-8); border: 0; }
.outcomes-list li + li { border-inline-start: var(--border-width-hairline) solid var(--color-border); }
.outcomes-list p { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-4); align-content: start; justify-items: center; max-inline-size: none; color: var(--color-text-secondary); font-size: var(--text-lg); line-height: 1.7; text-align: center; }
.outcomes-list strong { color: var(--color-text-accent); font-size: clamp(3.75rem, 6vw, 6rem); font-weight: 800; font-variant-numeric: tabular-nums; line-height: 1.1; }
.outcomes-list span { max-inline-size: 24ch; text-wrap: balance; }
.outcomes-notes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-8); max-inline-size: none; padding-block-start: var(--space-3); }
.outcomes-note { padding-block: var(--space-5); border-block-start: var(--border-width-hairline) solid var(--color-border); }
.outcomes-note h3 { margin-block-end: var(--space-3); color: var(--color-text-accent); font-size: var(--text-xl); }
.outcomes-note p { max-inline-size: 65ch; color: var(--color-text-secondary); font-size: var(--text-base); line-height: 1.75; }
@media (max-width: 47.999rem) {
  .outcomes-list, .outcomes-notes { grid-template-columns: minmax(0, 1fr); }
  .outcomes-list li { padding-block: var(--space-7); padding-inline: var(--space-4); }
  .outcomes-list li + li { border-inline-start: 0; border-block-start: var(--border-width-hairline) solid var(--color-border); }
  .outcomes-notes { gap: var(--space-4); }
}
.next-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-6); }
.next-grid article { display: grid; gap: var(--space-4); justify-items: start; padding-block: var(--space-7); padding-inline: var(--space-7); border-radius: var(--radius-xl); background: var(--color-surface); border: var(--border-width-hairline) solid var(--color-border); }
.next-grid h3 { color: var(--color-text-accent); font-size: var(--text-xl); }
.next-grid p { color: var(--color-text-secondary); font-size: var(--text-sm); }
.next-grid .button { align-self: end; }
.faq-section .section-shell { grid-template-columns: minmax(0, 0.7fr) minmax(0, 1.3fr); align-items: start; gap: var(--space-10); }
.faq-list { display: grid; gap: var(--space-3); }
.faq-list .accordion { border-radius: var(--radius-lg); }
.faq-list .accordion__content { color: var(--color-text-secondary); font-size: var(--text-sm); }
.partnership-section .section-shell { justify-items: start; gap: var(--space-5); }
.partnership-section .eyebrow { color: var(--color-text-inverse); }
.partnership-section .section-heading { max-inline-size: 27ch; }
.partnership-copy { max-inline-size: 65ch; }
.partnership-note { max-inline-size: 75ch; font-size: var(--text-sm); border-block-start: var(--border-width-hairline) solid var(--color-brand-lavender); padding-block-start: var(--space-5); }

@media (prefers-reduced-motion: no-preference) {
  @keyframes opportunity-orbit { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
  @keyframes opportunity-orbit-inner { from { transform: rotate(155deg); } to { transform: rotate(-205deg); } }
  @keyframes programme-arrive { from { transform: translateY(var(--space-4)); } to { transform: translateY(0); } }
  .landing-page[data-motion="running"] .brand-scene__traveller { animation: opportunity-orbit 28s linear infinite; }
  .landing-page[data-motion="running"] .brand-scene__traveller--second { animation-name: opportunity-orbit-inner; animation-duration: 22s; }
  .landing-page .brand-scene:not(.is-visible) .brand-scene__traveller, .landing-page[data-page-visible="false"] .brand-scene__traveller { animation-play-state: paused; }
  .landing-page[data-motion="running"] .motion-reveal { animation: programme-arrive 650ms ease-out both; }
  .landing-page .motion-reveal:focus-within { animation: none; }
  .landing-page[data-motion="running"] :is(.next-grid .button, .hero-actions .button) { transition: background-color 180ms ease, transform 180ms ease; }
  /* Switch filter text and background together so contrast stays readable. */
  .landing-page[data-motion="running"] .support-filter { transition: transform 180ms ease; }
  .landing-page[data-motion="running"] :is(.support-filter, .next-grid .button, .hero-actions .button):hover { transform: translateY(calc(-1 * var(--space-1) / 2)); }
}
.landing-page[data-motion="paused"] *, .landing-page[data-motion="paused"] *::before, .landing-page[data-motion="paused"] *::after { animation: none !important; transition: none !important; }

@media (max-width: 63.999rem) {
  .support-results { grid-template-columns: 1fr; }
  .support-route { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: var(--space-3) var(--space-5); }
  .support-route > img { grid-column: 1; grid-row: 1 / span 2; }
  .support-route > :is(.route-count, h3) { grid-column: 2; }
  .support-route > :is(h4, p:not(.route-count), ul, .route-link) { grid-column: 1 / -1; }
  .purpose-card { padding-inline: var(--space-5); }
  .brand-scene { inline-size: min(100%, 13rem); }
  .brand-scene__mark { inline-size: 5.5rem; }
}
@media (max-width: 47.999rem) {
  .programme-jump { justify-content: center; gap: var(--space-2) var(--space-5); text-align: center; }
  .next-grid, .faq-section .section-shell { grid-template-columns: minmax(0, 1fr); }

  .support-route { padding-inline: var(--space-5); }
  .support-route h3 { font-size: var(--text-lg); }
  .support-filter { font-size: var(--text-sm); padding-inline: var(--space-4); }
  .learning-note img { inline-size: var(--space-10); block-size: var(--space-10); }
  .next-grid article { padding-inline: var(--space-5); }
}