/*
 * MyPhone/MyBrain GitHub Pages refresh
 * Style: Field notes in motion. A deep-teal wayfinding masthead, oversized logo crest,
 * paper-white research panels, bright logo-derived accents and editorial science type.
 */
:root {
  --mpb-teal: #006b73;
  --mpb-deep: #003f46;
  --mpb-blue: #159fe1;
  --mpb-yellow: #ffdc70;
  --mpb-pink: #bb1e50;
  --mpb-paper: #fbf8ee;
  --mpb-mist: #d9eef4;
  --mpb-ink: #113b3f;
  --mpb-line: #c8ddda;
  --f-serif: "Fraunces", Georgia, serif;
  --f-sans: "Atkinson Hyperlegible", Arial, sans-serif;
  --f-mono: "DM Mono", monospace;
  --nav-h: 82px;
  --c-cream: var(--mpb-paper);
  --c-cream-dark: #eef5f2;
  --c-white: #ffffff;
  --c-crimson: var(--mpb-teal);
  --c-crimson-dark: var(--mpb-deep);
  --c-crimson-pale: var(--mpb-mist);
  --c-ink: var(--mpb-ink);
  --c-body: #456468;
  --c-muted: #4c6669;
  --c-border: var(--mpb-line);
  --c-dark: var(--mpb-deep);
  --c-dark-mid: #075a61;
  --c-bg: var(--mpb-paper);
  --c-bg-alt: #ffffff;
  --c-card: #ffffff;
  --r: 0;
  --r-lg: 0;
  --r-xl: 0;
  --shadow-sm: 0 8px 20px rgba(0, 70, 75, .08);
  --shadow-md: 0 14px 30px rgba(0, 70, 75, .14);
  --shadow-lg: 0 20px 48px rgba(0, 70, 75, .16);
}

body { font-family: var(--f-sans); background: var(--mpb-paper); color: var(--mpb-ink); font-weight: 400; line-height: 1.58; }
/* Fraunces at a fixed, small optical size with no softness: the f and j keep their shape instead of growing display-size swashes. */
h1, h2, h3 { font-family: var(--f-serif); letter-spacing: -.045em; font-optical-sizing: none; font-variation-settings: "opsz" 14, "SOFT" 0, "WONK" 0; }
h1 { line-height: .93; }
h2 { line-height: .98; }
/* The base stylesheet takes every margin away, so a heading would sit right on the text under it: put a gap back wherever text follows a heading directly (no weight of its own, so any section that sets its own spacing keeps it). */
:where(h1, h2) + :where(p, .prose, ul, ol) { margin-top: clamp(.9rem, 1.6vw, 1.25rem); }
p { max-width: 70ch; }
.container { max-width: 1200px; padding-inline: clamp(1.35rem, 4vw, 3.5rem); }
/* Section spacing: the same on a computer as on a phone (asked for on 7 October 2026: the gaps between sections were too big on desktop). */
.section { position: relative; padding-block: clamp(4.6rem, 5vw, 5rem); background: var(--mpb-paper); }
.section::before { display: none; }
.section-white { background: #ffffff; }
.section-light { background: var(--mpb-mist); }
.section-dark { background: var(--mpb-teal); }
.section-dark .section-kicker { color: var(--mpb-yellow); }
.section-heading { max-width: 750px; margin-bottom: clamp(2rem, 5vw, 3.5rem); }
.section-heading.centered { text-align: left; margin-left: 0; }
.section-heading h2 { color: var(--mpb-teal); font-size: clamp(2.65rem, 5vw, 4.6rem); }
.section-heading h2 em { color: var(--mpb-pink); font-style: normal; }
.section-dark .section-heading h2 { color: #fff; }
.section-kicker, .hero-kicker { font-family: var(--f-mono); font-size: .69rem; font-weight: 500; letter-spacing: .05em; text-transform: none; color: var(--mpb-teal); }
.section-kicker.light { color: var(--mpb-yellow); }
.prose { font-size: 1.08rem; line-height: 1.58; color: #466469; }
.prose strong { color: var(--mpb-teal); }
.prose p { margin-bottom: 1.1rem; }
.prose a { color: var(--mpb-teal); }
.section-dark .section-subheading,
.section-dark .prose,
.section-dark .prose p,
.section-dark .prose-light,
.section-dark .prose-light p,
.section-dark .prose-light strong,
.section-dark .prose strong { color: rgba(255,255,255,.92) !important; }
.section-dark .prose a { color: var(--mpb-yellow); }
.section-dark .info-panel-dark { background: rgba(0, 48, 53, .28); border-color: rgba(255,255,255,.52); }
.section-dark .workshop-panel .info-checklist li,
.section-dark .data-promise .promise-list li,
.section-dark .aim-card p,
.section-dark .aims-list p,
.section-dark .placeholder-card p { color: rgba(255,255,255,.88) !important; }
.section-dark .workshop-panel .info-checklist li::before,
.section-dark .data-promise .promise-list li::before { color: var(--mpb-yellow); }

/* Invitation-led participant journey */
.invitation-section { background: #fff; }
.invitation-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.invitation-card { min-height: 280px; display: flex; flex-direction: column; padding: clamp(1.5rem, 4vw, 2.4rem); border: 1px solid var(--mpb-line); background: var(--mpb-paper); box-shadow: var(--shadow-sm); transition: transform 160ms var(--ease-out), box-shadow 160ms var(--ease-out); }
.invitation-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-md); }
.invitation-card--young { background: var(--mpb-teal); border-color: var(--mpb-teal); }
.invitation-card-label { margin-bottom: 2rem; color: var(--mpb-pink); font-family: var(--f-mono); font-size: .7rem; letter-spacing: .05em; }
.invitation-card h3 { max-width: 12ch; color: var(--mpb-teal); font-size: clamp(2rem, 3.7vw, 3rem); }
.invitation-card p { margin-top: 1rem; color: #496d70; line-height: 1.48; }
.invitation-card-cta { margin-top: auto; padding-top: 1.8rem; color: var(--mpb-teal); font-weight: 700; }
.invitation-card--young .invitation-card-label { color: var(--mpb-yellow); }
.invitation-card--young h3 { color: #fff; }
.invitation-card--young p { color: rgba(255,255,255,.86); }
.invitation-card--young .invitation-card-cta { color: var(--mpb-yellow); }
.journey-overview { display: grid; grid-template-columns: minmax(190px, .65fr) minmax(0, 1.45fr) auto; gap: clamp(1rem, 3vw, 2.5rem); align-items: center; margin-top: clamp(2rem, 5vw, 4rem); padding: clamp(1.5rem, 4vw, 2.5rem); background: var(--mpb-mist); border-top: 5px solid var(--mpb-yellow); }
.journey-overview h3 { color: var(--mpb-teal); font-size: 1.95rem; }
.journey-steps { display: flex; flex-direction: column; gap: .8rem; }
.journey-steps li { display: grid; grid-template-columns: 2rem 1fr; gap: .75rem; align-items: start; }
.journey-steps li > span { width: 2rem; height: 2rem; display: grid; place-items: center; border-radius: 50%; background: var(--mpb-teal); color: #fff; font-family: var(--f-mono); font-size: .76rem; }
.journey-steps strong { color: var(--mpb-teal); }
.journey-steps p { margin-top: .05rem; color: #46676b; font-size: .94rem; line-height: 1.4; }
.narrow-content { max-width: 840px; }
.invitation-detail-section h2, .survey-section h2 { max-width: 16ch; margin-bottom: 1.3rem; color: var(--mpb-teal); font-size: clamp(2.7rem, 5vw, 4.5rem); }
.invitation-actions { display: flex; flex-wrap: wrap; column-gap: 1rem; row-gap: 1.25rem; margin-top: 2.25rem; }
.school-route { max-width: 980px; margin-top: clamp(2.3rem, 5vw, 4.5rem); padding: clamp(1.5rem, 4vw, 2.5rem); display: grid; grid-template-columns: minmax(0, 1fr) minmax(150px, .5fr) auto; align-items: center; gap: clamp(1.25rem, 3vw, 2.5rem); border: 1px solid var(--mpb-line); border-left: 7px solid var(--mpb-yellow); background: #fff; box-shadow: var(--shadow-sm); }
.school-route h3 { max-width: 19ch; margin: .35rem 0 .75rem; color: var(--mpb-teal); font-size: clamp(1.8rem, 3vw, 2.6rem); }
.school-route p:not(.section-kicker) { max-width: 58ch; color: #48676b; }
.school-route .btn { flex: 0 0 auto; }
.school-route-image { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; background: var(--mpb-mist); }
.invitation-grid--single { grid-template-columns: minmax(0, 720px); }
.participant-info-grid { margin-top: 2.25rem; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.participant-info-grid .info-panel { margin: 0; }
.participant-info-grid h3, .participant-next-step h3 { color: var(--mpb-teal); font-size: clamp(1.7rem, 3vw, 2.35rem); }
.participant-next-step { margin-top: 1rem; padding: clamp(1.5rem, 4vw, 2.5rem); border-left: 7px solid var(--mpb-yellow); background: var(--mpb-mist); }
.participant-next-step p:not(.section-kicker) { max-width: 62ch; color: #365d62; }
.participant-next-step .btn { margin: 1rem 1rem 0 0; }
/* One steady rhythm between the blocks of a participant page: boxes, notes and headings never touch, and stacked boxes keep one gap. */
.participant-info-section .narrow-content > * + :not(.section-subheading) { margin-top: clamp(2.25rem, 5vw, 3rem); }
.participant-info-section .narrow-content > .participant-info-grid + .participant-info-grid,
.participant-info-section .narrow-content > .participant-later-heading + .participant-info-grid { margin-top: 1rem; }
.participant-info-section .prose h3 { margin-bottom: .6rem; }
.participant-later-heading { color: var(--mpb-teal); font-size: clamp(1.7rem, 3vw, 2.35rem); }
.participant-info-section .narrow-content > .participant-later-visits { margin: 0.5rem 0 0; }
.participant-info-section .narrow-content > .participant-later-visits + .participant-info-grid { margin-top: 1rem; }
.participant-next-step h3 { margin-bottom: .75rem; }
.participant-next-step .text-link, .participant-info-grid .text-link { display: inline-block; margin-top: 1.1rem; }
/* A heading's lead paragraph sits clear of it, on every page (the base stylesheet leaves only 0.4rem). */
.section-subheading { margin-top: .9rem; }
/* The information sheet (/information/): contents, the two choices, and a clear break between topics. */
.info-sheet [id] { scroll-margin-top: calc(var(--nav-h) + 1rem); }
.info-sheet__start .participant-next-step { margin-top: 1.25rem; }
.section.info-sheet { padding-top: clamp(1.75rem, 4vw, 3rem); }
.info-sheet__start .section-subheading { margin-top: 0; }
.participant-next-step__optout { margin: 1.25rem 0 0; font-size: .95rem; }
.info-sheet__start .participant-next-step .btn + p { margin-top: 1rem; }
.participant-next-step__optout a { color: var(--mpb-teal); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
/* The information sheet's sections, folded: one tappable heading each (8 October 2026). */
.participant-info-section .narrow-content > .info-sheet__more-heading { margin-top: clamp(2.5rem, 6vw, 3.5rem); color: var(--mpb-teal); font-size: clamp(1.4rem, 2.6vw, 1.8rem); }
.participant-info-section .narrow-content > .info-sheet__more-hint { margin-top: .35rem; color: #365d62; }
.participant-info-section .narrow-content > .info-fold { margin-top: 0; }
.participant-info-section .narrow-content > .info-sheet__more-hint + .info-fold { margin-top: 1rem; }
.info-fold { border-top: 1px solid #c8ddda; }
.info-fold:last-of-type { border-bottom: 1px solid #c8ddda; }
.info-fold > summary { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem .25rem; cursor: pointer; list-style: none; min-height: 48px; }
.info-fold > summary::-webkit-details-marker { display: none; }
.info-fold > summary h2 { margin: 0; font-size: clamp(1.1rem, 2.2vw, 1.3rem); line-height: 1.3; color: var(--mpb-teal); }
.info-fold > summary::after { content: '+'; flex: none; width: 1.9rem; height: 1.9rem; border-radius: 50%; background: var(--mpb-mist); color: var(--mpb-teal); font-size: 1.35rem; font-weight: 700; line-height: 1.9rem; text-align: center; }
.info-fold[open] > summary::after { content: '−'; }
.info-fold > summary:focus-visible { outline: 3px solid var(--mpb-teal); outline-offset: 2px; }
.info-fold__body { padding: 0 .25rem 2rem; }
.info-fold__body > * + * { margin-top: 1.25rem; }
.info-sheet__contents { padding: 1.1rem 1.25rem; border-left: 4px solid var(--mpb-yellow); background: #fff; }
.info-sheet__contents p { margin: 0 0 .55rem; color: var(--mpb-teal); font-family: var(--f-mono); font-size: .72rem; letter-spacing: .05em; text-transform: uppercase; }
.info-sheet__contents ol { display: flex; flex-wrap: wrap; gap: .45rem 1.25rem; margin: 0; padding: 0; list-style: none; }
.info-sheet__contents a { color: var(--mpb-teal); font-weight: 700; text-underline-offset: 3px; }
.participant-info-section.info-sheet .narrow-content > h2:not(:first-of-type) { margin-top: clamp(3rem, 7vw, 4.5rem); padding-top: clamp(2rem, 5vw, 3rem); border-top: 1px solid var(--mpb-line); }
.participant-info-section.info-sheet .narrow-content > .info-panel h3:first-child { margin-top: 0; }
.consent-routes { display: grid; gap: 1rem; margin: 0; padding: 0; list-style: none; }
@media (min-width: 760px) { .consent-routes { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.consent-route { display: flex; flex-direction: column; align-items: flex-start; padding: 1.4rem 1.35rem 1.5rem; border: 1px solid var(--mpb-line); border-top: 6px solid var(--mpb-yellow); background: #fff; box-shadow: var(--shadow-sm); }
.consent-route--mist { background: var(--mpb-mist); }
.consent-route__tag { padding: .25rem .55rem; background: var(--mpb-teal); color: #fff; font-family: var(--f-mono); font-size: .7rem; letter-spacing: .05em; text-transform: uppercase; }
.consent-route h3 { margin: .9rem 0 .6rem; color: var(--mpb-teal); font-size: clamp(1.4rem, 2.4vw, 1.7rem); line-height: 1.05; }
.consent-route p { margin: 0 0 .75rem; color: #365d62; font-size: 1rem; line-height: 1.5; }
.consent-route p strong { color: var(--mpb-teal); }
.consent-route .text-link { margin-top: auto; padding-top: .5rem; }
.info-sheet__updated { color: #5b7b7f; font-size: .9rem; }
.info-sheet .info-panel a:not(.btn), .info-sheet .consent-route a:not(.text-link) { color: var(--mpb-teal); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.pathway-grid { margin-top: 2.25rem; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.pathway-card { min-height: 245px; padding: 1.5rem; border: 1px solid var(--mpb-line); border-top: 6px solid var(--mpb-yellow); background: #fff; box-shadow: var(--shadow-sm); }
.pathway-card--mist { background: var(--mpb-mist); }
.pathway-card > span { color: var(--mpb-pink); font-family: var(--f-mono); font-size: .75rem; letter-spacing: .08em; }
.pathway-card h3 { margin: 1.3rem 0 .8rem; color: var(--mpb-teal); font-size: clamp(1.7rem, 3vw, 2.3rem); }
.pathway-card p, .meet-sam-copy { color: #416368; line-height: 1.48; }
.meet-sam-copy { max-width: 66ch; margin: 2rem 0; font-size: 1.1rem; }
.participant-linkline { margin-top: 1.5rem; color: #416368; }
.participant-linkline a { color: var(--mpb-teal); font-weight: 700; text-decoration: underline; text-underline-offset: 4px; }
.contact-form { margin-top: 2rem; display: grid; gap: .55rem; max-width: 560px; padding: 1.4rem; border: 1px solid rgba(255,255,255,.35); background: rgba(0, 48, 53, .26); }
.contact-form label { color: #fff; font-weight: 700; font-size: .88rem; }
.contact-form input, .contact-form select, .contact-form textarea { width: 100%; border-color: rgba(255,255,255,.42); background: #fff; color: var(--mpb-ink); }
.contact-form .btn { width: fit-content; margin-top: .65rem; }
.contact-form-note { margin: .25rem 0 0; color: rgba(255,255,255,.78); font-size: .82rem; line-height: 1.38; }
.contact-form-actions { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; }
.contact-form-actions .btn-outline { color: #fff; border-color: rgba(255,255,255,.68); }
.access-steps { margin: 1.35rem 0; padding: 0; list-style: none; counter-reset: access; }
.access-steps li { display: grid; grid-template-columns: 2rem 1fr; gap: .7rem; align-items: start; margin-bottom: .85rem; }
.access-steps li > span { display: grid; width: 1.75rem; height: 1.75rem; place-items: center; border-radius: 50%; background: var(--mpb-yellow); color: var(--mpb-ink); font-family: var(--f-mono); font-size: .75rem; }
.access-steps p { margin: .08rem 0 0; }
.follow-up-note { margin-top: 1.15rem; padding-top: 1rem; border-top: 1px solid var(--mpb-line); color: #416368 !important; font-size: .94rem; }
.enquiry-follow-up { margin-top: 1.7rem; padding: 1.25rem; border-left: 5px solid var(--mpb-yellow); background: rgba(255,255,255,.54); }
.enquiry-follow-up h3 { color: var(--mpb-teal); font-size: 1.55rem; }
.enquiry-follow-up ol { margin: .8rem 0 0; padding-left: 1.3rem; color: #436469; }
.enquiry-follow-up li + li { margin-top: .42rem; }
.faq-audience-links { margin-top: 1.35rem; display: grid; gap: .65rem; }
.faq-audience-links a { display: grid; gap: .15rem; padding: .82rem; border-left: 4px solid var(--mpb-yellow); background: rgba(255,255,255,.72); color: var(--mpb-teal); }
.faq-audience-links a span { color: #58777b; font-size: .88rem; }
.documents-callout { margin-top: 1.25rem; padding: clamp(1.4rem, 4vw, 2.2rem); display: flex; align-items: end; justify-content: space-between; gap: 1.5rem; border: 1px solid var(--mpb-line); background: var(--mpb-mist); }
.documents-callout h3 { margin: .25rem 0 .6rem; color: var(--mpb-teal); font-size: clamp(1.6rem, 3vw, 2.25rem); }
.documents-callout p:not(.section-kicker) { max-width: 58ch; color: #3b6166; }
.documents-callout .btn { flex: 0 0 auto; }
.documents-grid { margin-top: 2rem; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.document-card { min-height: 270px; padding: 1.5rem; border: 1px solid var(--mpb-line); border-top: 6px solid var(--mpb-yellow); background: #fff; box-shadow: var(--shadow-sm); }
.document-card--mist { background: var(--mpb-mist); }
.document-card > span:first-child { color: var(--mpb-pink); font-family: var(--f-mono); font-size: .75rem; }
.document-card h3 { margin: 1.3rem 0 .7rem; color: var(--mpb-teal); font-size: clamp(1.55rem, 2.6vw, 2rem); }
.document-card p { color: #416368; }
.document-status { display: inline-block; margin-top: .8rem; color: var(--mpb-teal); font-family: var(--f-mono); font-size: .68rem; letter-spacing: .05em; text-transform: uppercase; }
.school-decision-grid { margin-top: 1.25rem; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.school-decision-grid article { padding: 1.4rem; border-top: 5px solid var(--mpb-yellow); background: #fff; box-shadow: var(--shadow-sm); }
.school-decision-grid article:nth-child(2) { background: var(--mpb-mist); }
.school-decision-grid h3 { margin: .55rem 0 .75rem; color: var(--mpb-teal); font-size: clamp(1.5rem, 2.6vw, 2rem); }
.school-decision-grid p:not(.section-kicker) { color: #45666b; line-height: 1.48; }
.school-process { margin-top: clamp(2.5rem, 6vw, 5rem); padding: clamp(1.5rem, 4vw, 2.6rem); background: var(--mpb-teal); color: #fff; }
.school-process-intro { max-width: 670px; }
.school-process .section-kicker { color: var(--mpb-yellow); }
.school-process h3 { margin: .4rem 0 .7rem; color: #fff; font-size: clamp(2rem, 4vw, 3.4rem); }
.school-process-intro > p:not(.section-kicker) { color: rgba(255,255,255,.85); }
.school-process ol { margin: 2rem 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); list-style: none; border-left: 1px solid rgba(255,255,255,.35); }
.school-process li { min-height: 190px; padding: 1.1rem; border: 1px solid rgba(255,255,255,.35); border-left: 0; }
.school-process li > span { color: var(--mpb-yellow); font-family: var(--f-mono); font-size: .75rem; }
.school-process h4 { margin: 1.25rem 0 .6rem; color: #fff; font-family: var(--f-serif); font-size: 1.45rem; letter-spacing: -.04em; }
.school-process li p { margin: 0; color: rgba(255,255,255,.8); font-size: .94rem; line-height: 1.45; }
.invite-next-box { padding: clamp(1.5rem, 4vw, 2.5rem); border: 1px solid var(--mpb-line); border-top: 6px solid var(--mpb-yellow); background: #fff; box-shadow: var(--shadow-sm); }
.invite-next-box h2 { max-width: 16ch; margin: 0 0 1rem; color: var(--mpb-teal); font-size: clamp(2.3rem, 5vw, 4rem); }
.invite-next-box p { max-width: 58ch; color: #46676b; font-size: 1.08rem; }
.invite-next-box .btn { margin-top: 1.7rem; }
.invitation-brief { max-width: 62ch; margin: 2rem 0 .8rem; color: #46676b; font-size: 1.04rem; }
.text-link { color: var(--mpb-teal); font-weight: 700; text-decoration: underline; text-underline-offset: 4px; }
.survey-section { background: #fff; }
.survey-placeholder { padding: clamp(1.6rem, 5vw, 3rem); border: 1px solid var(--mpb-line); border-left: 6px solid var(--mpb-yellow); background: var(--mpb-paper); box-shadow: var(--shadow-sm); }
.survey-placeholder h3 { max-width: 20ch; margin: .8rem 0 1rem; color: var(--mpb-teal); font-size: clamp(1.7rem, 3vw, 2.45rem); }
.survey-placeholder p { color: #46676b; font-size: 1.06rem; }
.survey-status { display: inline-block; color: var(--mpb-teal); font-family: var(--f-mono); font-size: .7rem; letter-spacing: .05em; }
.split { grid-template-columns: minmax(135px, .45fr) minmax(0, 1.55fr); gap: clamp(1.5rem, 5vw, 5rem); }
.split > :first-child { padding-top: .35rem; font-family: var(--f-mono); color: var(--mpb-teal); font-size: .7rem; letter-spacing: .09em; text-transform: uppercase; }

/* Sticky masthead: EEG101-style stable logo bar with a compact menu directly below it on mobile. */
.site-header { position: sticky; top: 0; height: var(--nav-h); z-index: 1000; background: var(--mpb-teal); border: 0; box-shadow: none; backdrop-filter: none; }
.site-header.scrolled { background: var(--mpb-teal); box-shadow: none; }
.header-inner { position: relative; height: 100%; max-width: 1200px; margin: 0 auto; padding-inline: clamp(1.35rem, 4vw, 3.5rem); display: flex; align-items: center; gap: 1.35rem; }
.logo { position: static; z-index: 5; flex: 0 0 auto; width: 210px; height: 62px; display: grid; place-items: center; }
.logo img { width: 100%; height: 100%; object-fit: contain; }
.nav { margin-left: auto; gap: clamp(.55rem, .85vw, .9rem); }
.nav a { color: #fff; font-size: 1.04rem; font-weight: 700; line-height: 1.2; }
.nav a:hover { color: var(--mpb-yellow); }
.nav-cta { padding: .68rem 1.05rem; border: 1px solid rgba(255,255,255,.64); border-radius: 0; background: transparent !important; }
.nav-cta:hover { border-color: var(--mpb-yellow); background: var(--mpb-yellow) !important; color: var(--mpb-ink) !important; }
.menu-toggle,
.mobile-nav-close { width: 48px; height: 48px; display: none; align-items: center; justify-content: center; padding: 0; border: 0; background: transparent; }
.menu-toggle { margin-left: auto; }
.menu-toggle .bar,
.mobile-nav-close .bar { width: 28px; height: 2px; background: #fff; }
.mobile-nav-overlay { display: none; position: absolute; inset: auto 0 auto 0; top: 100%; z-index: 999; background: var(--mpb-teal); border-top: 1px solid rgba(255,255,255,.24); box-shadow: 0 10px 24px rgba(0, 53, 59, .28); backdrop-filter: none; }
.mobile-nav-overlay.is-open { display: block; }
.mobile-nav-inner { width: 100%; height: auto; max-width: 1200px; max-height: calc(100svh - var(--nav-h)); margin: 0 auto; display: flex; flex-direction: column; align-items: stretch; justify-content: flex-start; gap: 0; padding: .45rem clamp(1.35rem, 4vw, 3.5rem) 1rem; overflow-y: auto; text-align: left; }
.mobile-nav-inner::before { display: none; }
.mobile-nav-inner a { padding: .82rem 0; color: #fff; border-bottom: 1px solid rgba(255,255,255,.25); font-family: var(--f-sans); font-size: 1.14rem; font-weight: 700; letter-spacing: 0; line-height: 1.2; }
.mobile-nav-inner a:hover { color: var(--mpb-yellow); }

/* Hero */
.hero { min-height: 680px; display: flex; flex-direction: column; background: var(--mpb-teal); }
.hero-img { top: auto; bottom: 0; height: min(73%, 570px); object-position: center; filter: saturate(.92); }
.hero-overlay { background: linear-gradient(180deg, var(--mpb-teal) 0%, var(--mpb-teal) 25%, rgba(0, 89, 96, .29) 50%, rgba(0, 61, 67, .67) 100%); }
.hero-route { position: relative; z-index: 2; padding-top: clamp(2rem, 5vw, 3.8rem); }
.hero-route a { width: min(590px, 100%); display: flex; align-items: center; gap: .65rem; padding: 0 0 .84rem; color: #fff; border-bottom: 1px solid rgba(255,255,255,.68); font-size: 1.12rem; font-weight: 700; }
.hero-route a span:last-child { margin-left: auto; font-size: 1.55rem; }
.route-sun { color: var(--mpb-yellow); font-size: 1.6rem; line-height: 0; }
.hero-content { min-height: 0; flex: 1; padding-top: clamp(1.3rem, 3vw, 2.6rem); padding-bottom: clamp(3rem, 6vw, 5rem); display: block; }
.hero-kicker { margin-bottom: 1rem; color: var(--mpb-yellow); }
.hero-panel { max-width: 690px; padding: clamp(1.65rem, 3vw, 2.5rem); background: rgba(0, 74, 81, .89); }
.hero h1 { max-width: 11ch; margin-bottom: 1.2rem; color: #fff; font-size: clamp(3.4rem, 7vw, 6rem); }
.hero h1 .accent { display: inline; color: var(--mpb-yellow); font-style: normal; }
.hero .tagline { max-width: 52ch; margin-bottom: 1.7rem; color: rgba(255,255,255,.92); font-size: clamp(1.05rem, 1.8vw, 1.25rem); line-height: 1.4; }
.hero-actions { gap: .65rem; margin: 0; }
.btn { min-height: 46px; border-radius: 0; padding: .72em 1.1em; font-weight: 700; }
.btn-primary { color: var(--mpb-ink); border-color: var(--mpb-yellow); background: var(--mpb-yellow); }
.btn-primary:hover { color: var(--mpb-ink); border-color: #ffd247; background: #ffd247; }
.btn-ghost { color: #fff; border-color: rgba(255,255,255,.72); }
.btn-ghost:hover { background: rgba(255,255,255,.12); }
.hero-scroll { bottom: 1.35rem; flex-direction: row; gap: .5rem; color: #fff; font-family: var(--f-serif); font-size: 1.1rem; letter-spacing: -.02em; text-transform: none; }
.hero-scroll-line { width: 23px; height: 1px; background: #fff; }

/* Focused inner pages */
.page-hero { position: relative; overflow: hidden; padding: clamp(3.5rem, 5vw, 4.5rem) 0 clamp(4rem, 5vw, 4.5rem); background: var(--mpb-teal); color: #fff; }
.page-hero::after { content: ""; position: absolute; right: -20vw; bottom: -42vw; width: min(75vw, 760px); height: min(75vw, 760px); border: 3rem solid rgba(255,255,255,.08); border-radius: 50%; }
.page-hero .container { position: relative; z-index: 1; }
.page-hero h1 { max-width: 12ch; margin: 0 0 1.25rem; color: #fff; font-size: clamp(3.3rem, 7vw, 6.1rem); }
.page-hero h1 span { display: block; color: var(--mpb-yellow); }
.page-hero > .container > p:last-child { max-width: 58ch; color: rgba(255,255,255,.85); font-size: clamp(1.08rem, 2vw, 1.32rem); line-height: 1.44; }
.page-hero .hero-kicker { color: var(--mpb-yellow); }

/* Content story and cards */
.stat-row { max-width: 900px; grid-template-columns: repeat(3, 1fr); gap: 0; padding-top: 1.8rem; border-color: var(--mpb-line); }
.stat-item { padding-right: 1rem; }
.stat-item strong { color: var(--mpb-teal); font-family: var(--f-serif); font-size: clamp(2rem, 4vw, 3.1rem); }
.stat-item span { color: #638183; font-size: .85rem; }
.step-grid { gap: 0; margin-top: 3rem; }
.step-card { min-height: 280px; padding: 1.55rem; border: 1px solid rgba(255,255,255,.34); border-left: 0; border-radius: 0; background: transparent; }
.step-card:first-child { border-left: 1px solid rgba(255,255,255,.34); }
.step-card > span { color: var(--mpb-yellow); opacity: 1; font-family: var(--f-mono); font-size: .8rem; }
.step-card h3 { color: #fff; font-size: 1.68rem; }
.step-card p { color: rgba(255,255,255,.82); font-size: .96rem; line-height: 1.45; }
.section-dark::after, .gallery-section::after { content: ""; display: block; width: 100%; height: 42px; margin-top: 3.2rem; background: linear-gradient(135deg, transparent 0 12%, var(--mpb-yellow) 12% 13%, transparent 13% 24%, var(--mpb-yellow) 24% 25%, transparent 25% 36%, var(--mpb-yellow) 36% 37%, transparent 37%) center / 180px 42px repeat-x; opacity: .72; }
.audience-grid { gap: 15px; }
.audience-card { min-height: 260px; padding: 1.65rem; border: 1px solid var(--mpb-line); border-radius: 0; box-shadow: var(--shadow-sm); }
.audience-card h3 { color: var(--mpb-teal); font-family: var(--f-serif); font-size: 2rem; }
.audience-card h3::before { content: "○"; display: block; margin-bottom: 1rem; color: var(--mpb-yellow); font-family: var(--f-sans); font-size: 2.1rem; line-height: .6; }
.audience-card p { color: #557377; line-height: 1.45; }
.audience-card-cta { color: var(--mpb-teal); font-weight: 700; }
.info-panel, .reassurance-block, .data-promise, .data-flow, .gatsby-block { border: 1px solid var(--mpb-line); border-radius: 0; box-shadow: var(--shadow-sm); }
.info-panel { padding: clamp(1.5rem, 4vw, 2.5rem); }
.info-panel h3, .reassurance-block h3 { color: var(--mpb-teal); font-family: var(--f-serif); font-size: 1.8rem; }
.info-panel-alt { background: var(--mpb-mist); }
.benefit-grid, .promise-grid { gap: 15px; }
.benefit-card, .promise-card { border-left: 4px solid var(--mpb-yellow); border-radius: 0; box-shadow: var(--shadow-sm); }
.benefit-card h3, .promise-card h3 { color: var(--mpb-teal); }
.promise-card h3, .benefit-card h3 { margin-bottom: .6rem; }
.gatsby-header { background: var(--mpb-teal); }
.gatsby-header .section-kicker { color: var(--mpb-yellow); }
.gatsby-grid { background: #fff; }
.gatsby-number { color: var(--mpb-teal); background: var(--mpb-mist); font-family: var(--f-mono); font-size: .85rem; }
.gatsby-card-body h4 { color: var(--mpb-teal); }
.workshop-panel, .aim-card, .aims-list-block, .resources-placeholder .placeholder-card { border-radius: 0; }
.workshop-panel h3, .aim-card h3, .aims-list-block h3, .placeholder-card h3 { color: #fff; }
.aim-number { color: var(--mpb-yellow); opacity: 1; font-family: var(--f-mono); font-size: 1rem; }
.aim-label, .data-flow-steps li { background: var(--mpb-yellow); color: var(--mpb-ink); border-radius: 0; }
.gallery-section { background: var(--mpb-teal) !important; }
.gallery-section .section-heading h2 { color: #fff; }
.gallery-grid img { border-radius: 0 !important; }

/* Forms, accordion and team */
.signup-section { background: var(--mpb-mist); }
.signup-form { border: 0; border-radius: 0; box-shadow: var(--shadow-lg); }
.privacy-note { border-left-color: var(--mpb-yellow); border-radius: 0; background: #fff8d9; }
input[type="text"], input[type="email"], input[type="tel"], select, textarea { border: 1px solid var(--mpb-line); border-radius: 0; background: #fff; }
input:focus, select:focus, textarea:focus { border-color: var(--mpb-teal); box-shadow: 0 0 0 3px rgba(0,107,115,.12); }
.faq-list details { border-color: var(--mpb-line); }
.faq-list summary { color: var(--mpb-teal); font-family: var(--f-serif); font-size: 1.45rem; }
.faq-list summary::after { color: var(--mpb-pink); }
.faq-list .answer { color: #4b696c; }
.people-grid { grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 15px; }
.person-card { border: 1px solid var(--mpb-line); border-radius: 0; box-shadow: var(--shadow-sm); }
.person-image { aspect-ratio: 1 / 1; background: var(--mpb-mist); }
.person-info { padding: 1rem 1rem 1.15rem; }
.person-card .person-role { color: var(--mpb-pink); font-family: var(--f-mono); font-size: .62rem; }
.person-card .person-name { color: var(--mpb-teal); font-family: var(--f-serif); font-size: 1.44rem; line-height: 1.02; }
.person-card .person-name a { color: inherit; text-decoration-color: var(--mpb-yellow); text-decoration-thickness: 2px; text-underline-offset: 4px; }
.person-card .person-name a:hover { color: var(--mpb-deep); }
.person-card .bio { color: #4d6c70; line-height: 1.42; }
.person-links a { color: var(--mpb-teal); }
.co-i-heading { color: var(--mpb-teal); font-family: var(--f-serif); font-size: clamp(2rem, 4vw, 3rem); }
.team-subsection { max-width: 760px; margin: clamp(4rem, 8vw, 7rem) 0 2rem; }
.team-subsection--data { margin-top: 0; }
.team-subsection .co-i-heading { margin: .4rem 0 .75rem; }
.team-subsection > p:not(.section-kicker) { color: #46676b; font-size: 1.06rem; }
.people-grid--data { margin-bottom: clamp(2.5rem, 5vw, 4rem); }
.team-page-intro { padding: 9rem 0 4.5rem; background: var(--mpb-teal); color: #fff; }
.team-page-intro .hero-kicker { color: var(--mpb-yellow); }
.team-page-intro h1 { max-width: 10ch; margin-bottom: 1rem; color: #fff; font-size: clamp(3.2rem, 7vw, 5.8rem); }
.team-page-intro h1 span { color: var(--mpb-yellow); }
.team-page-intro p:last-child { color: rgba(255,255,255,.83); font-size: 1.15rem; }

/* Accessibility: keep all contact information legible on the deep-teal background. */
.contact-section .prose-light,
.contact-section .prose-light p { color: rgba(255,255,255,.92) !important; }
.contact-section .prose-light strong { color: #fff !important; }
.contact-section .contact-link { color: #fff; text-decoration-color: var(--mpb-yellow); text-decoration-thickness: 2px; text-underline-offset: 4px; }
.contact-section .contact-card { background: rgba(255,255,255,.10); border-color: rgba(255,255,255,.44); }
.contact-section .contact-card p,
.contact-section .contact-card p[style] { color: rgba(255,255,255,.90) !important; }
.contact-section .contact-card strong,
.contact-section .contact-card strong[style] { color: var(--mpb-yellow) !important; }

/* Footer */
.site-footer { background: #071f23; color: #fff; }
.footer-inner { max-width: 1200px; padding-block: 4.5rem 3.3rem; display: grid; grid-template-columns: minmax(240px, .8fr) minmax(0, 1.4fr); gap: clamp(2.5rem, 7vw, 7rem); align-items: start; }
.footer-brand p { margin-top: 0; color: rgba(255,255,255,.68); line-height: 1.45; }
.site-footer .footer-brand img { display: none !important; }
.footer-nav { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.3rem; }
.footer-nav div { display: flex; flex-direction: column; align-items: flex-start; gap: .46rem; }
.footer-nav span { margin-bottom: .45rem; color: var(--mpb-yellow); font-family: var(--f-mono); font-size: .62rem; letter-spacing: .05em; text-transform: none; }
.footer-nav a, .footer-nav p { margin: 0; color: rgba(255,255,255,.82); font-size: .88rem; line-height: 1.3; }
.footer-nav a { display: inline-flex; align-items: center; min-height: 28px; padding-block: 4px; }
.footer-nav a:hover { color: var(--mpb-yellow); }
.footer-meta { max-width: none; padding: 1.1rem clamp(1.35rem, 4vw, 3.5rem); display: flex; justify-content: space-between; gap: 1rem; border-top: 1px solid rgba(255,255,255,.16); color: rgba(255,255,255,.51); font-family: var(--f-mono); font-size: .62rem; letter-spacing: .02em; }

/* WCAG tablet accessibility: reliable contrast, target size and visible keyboard focus. */
.coming-soon-tag { background: var(--mpb-deep); color: #fff; }
.slider-wrapper input[type="range"] { min-height: 28px; height: 28px; background: transparent; }
.slider-wrapper input[type="range"]::-webkit-slider-runnable-track { height: 4px; border-radius: 999px; background: var(--mpb-line); }
.slider-wrapper input[type="range"]::-webkit-slider-thumb { width: 24px; height: 24px; margin-top: -10px; background: var(--mpb-teal); border: 2px solid #fff; }
.slider-wrapper input[type="range"]::-moz-range-track { height: 4px; border-radius: 999px; background: var(--mpb-line); }
.slider-wrapper input[type="range"]::-moz-range-thumb { width: 24px; height: 24px; background: var(--mpb-teal); border: 2px solid #fff; }
:where(a, button, input, select, textarea, summary):focus-visible { outline: 3px solid #fff; outline-offset: 3px; box-shadow: 0 0 0 6px var(--mpb-deep) !important; }
.video-accessibility-note { padding: clamp(1.5rem, 4vw, 2.5rem); border-left: 6px solid var(--mpb-yellow); background: var(--mpb-mist); }
.video-accessibility-note h3 { margin: .4rem 0 .75rem; color: var(--mpb-teal); font-size: clamp(1.7rem, 3vw, 2.35rem); }
.video-accessibility-note p:not(.section-kicker) { max-width: 62ch; color: #365d62; }

@media (max-width: 1080px) {
  .nav { display: none; }
  .menu-toggle { display: flex; }
  .hero { min-height: 710px; }
  .hero-route { padding-top: 4.5rem; }
  .hero-content { padding-top: 4.3rem; }
  .footer-inner { grid-template-columns: 1fr; }
  .footer-nav { max-width: 720px; }
}
@media (min-width: 681px) and (max-width: 900px) {
  .school-decision-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .school-decision-grid article:last-child { grid-column: 1 / -1; }
  .school-process ol { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gatsby-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gatsby-card { border-bottom: 1px solid var(--mpb-line); }
  .gatsby-card:nth-child(2),
  .gatsby-card:last-child { border-right: 0; }
  .gatsby-card:last-child { grid-column: 1 / -1; border-bottom: 0; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .01ms !important; }
  .reveal { opacity: 1; transform: none; }
}
@media (max-width: 680px) {
  :root { --nav-h: 88px; }
  .site-header { height: var(--nav-h); }
  .header-inner { padding-inline: 1.35rem; }
  .logo { width: 190px; height: 62px; padding: 0; }
  .logo img { width: 100%; height: 100%; }
  .mobile-nav-inner { padding-inline: 1.35rem; }
  .hero { min-height: 665px; }
  .hero-img { height: 65%; object-position: 56% center; }
  .hero-route { padding-top: 1.15rem; }
  .hero-route a { font-size: 1rem; }
  .hero-content { padding-top: 1rem; padding-bottom: 3.2rem; }
  .hero-panel { margin-inline: -1.35rem; padding: 1.5rem 1.35rem; background: rgba(0, 74, 81, .87); }
  .hero h1 { font-size: clamp(3.15rem, 15.5vw, 4.3rem); }
  .hero .tagline { font-size: 1.05rem; }
  .hero-scroll { display: none; }
  .page-hero { padding-top: 3.5rem; }
  .split { grid-template-columns: 1fr; gap: 1rem; }
  .invitation-grid, .journey-overview { grid-template-columns: 1fr; }
  .journey-overview .btn { width: fit-content; }
  .school-route { grid-template-columns: 1fr; gap: 1.25rem; }
  .school-route-image { max-width: 420px; }
  .participant-info-grid { grid-template-columns: 1fr; }
  .pathway-grid { grid-template-columns: 1fr; }
  .documents-grid { grid-template-columns: 1fr; }
  .documents-callout { align-items: flex-start; flex-direction: column; }
  .school-decision-grid { grid-template-columns: 1fr; }
  .school-process ol { grid-template-columns: 1fr; border-top: 1px solid rgba(255,255,255,.35); border-left: 0; }
  .school-process li { min-height: 0; border-top: 0; border-left: 1px solid rgba(255,255,255,.35); }
  .invitation-actions { flex-direction: column; align-items: stretch; row-gap: 1.1rem; }
  .invitation-actions .btn { width: 100%; justify-content: center; }
  .stat-row, .audience-grid, .benefit-grid, .promise-grid, .workshop-grid, .aims-grid, .resources-placeholder, .signup-layout { grid-template-columns: 1fr; }
  .stat-row { gap: 1.3rem; }
  .step-grid { grid-template-columns: 1fr; }
  .step-card, .step-card:first-child { min-height: 0; border-left: 1px solid rgba(255,255,255,.34); border-bottom: 0; }
  .step-card:last-child { border-bottom: 1px solid rgba(255,255,255,.34); }
  .people-grid { grid-template-columns: repeat(2, 1fr); }
  .person-card .bio { display: none; }
  .footer-nav { grid-template-columns: 1fr 1fr; }
  .footer-nav div:last-child { grid-column: 1 / -1; }
  .footer-meta { flex-direction: column; }
}
.illustration-banner { background: var(--mpb-mist); border: 1px solid var(--mpb-line); }
.illustration-banner img { object-position: center; filter: saturate(.84) contrast(.94); }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; } }

/* ── Simplified site: homepage summary ─────────────────────────────── */
.home-summary h2 { max-width: 18ch; margin-bottom: 1.2rem; color: var(--mpb-teal); font-size: clamp(2.4rem, 4.6vw, 4rem); }
.home-summary .prose p { max-width: 62ch; }
.home-summary-actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.6rem; }

/* ── Enquiry forms ─────────────────────────────────────────────────── */
.form-status { margin: 0 0 1rem; padding: .8rem 1rem; border-left: 5px solid var(--mpb-pink); background: #fff3f6; color: #7a1030; font-weight: 700; }
.form-status[hidden] { display: none; }
.form-success { padding: clamp(1.5rem, 4vw, 2.5rem); border: 1px solid var(--mpb-line); border-top: 6px solid var(--mpb-yellow); background: #fff; color: #113b3f; }
.form-success h3 { margin: 0 0 .5rem; color: var(--mpb-teal); }
.form-success p { margin: 0; }
.hp-field { position: absolute !important; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.checkbox--single { display: flex; gap: .6rem; align-items: flex-start; margin-top: 1rem; font-weight: 600; }
.checkbox--single em { font-style: normal; font-weight: 400; color: var(--mpb-pink); font-size: .85em; margin-left: .3rem; }
fieldset legend span { font-weight: 400; color: #48676b; font-size: .9em; margin-left: .3rem; }
.contact-text h2 { margin-bottom: 1rem; }
.checkbox--single span { text-transform: none; font-size: 1rem; letter-spacing: 0; line-height: 1.4; }

/* ── A school's page for parents (/dua/, /gsal/: _layouts/school.html) ── */
.school-hero h1 { max-width: none; font-size: clamp(2.7rem, 6.4vw, 5.6rem); }
.school-hero .school-hero__intro { max-width: 58ch; color: rgba(255,255,255,.85); font-size: clamp(1.08rem, 2vw, 1.32rem); line-height: 1.44; }
.school-hero__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.5rem; margin-top: 1.8rem; }
.school-hero__more { color: #fff; font-weight: 700; text-decoration: underline; text-underline-offset: .2em; }
.school-hero__more:hover { color: var(--mpb-yellow); }
.school-landing__grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 1rem; align-items: start; }
.school-landing__grid .info-panel { margin: 0; }
.school-landing__grid h2, .school-landing__more h2, .school-landing__optout h2 { margin: 0 0 1rem; color: var(--mpb-teal); font-size: clamp(1.8rem, 3vw, 2.4rem); }
.school-landing__cta { border-top: 6px solid var(--mpb-yellow); }
.school-landing__cta .btn { margin-top: 1.4rem; }
.school-landing__optout .btn { margin-top: 1.25rem; }
.school-steps { margin: 0; padding: 0; list-style: none; counter-reset: school-step; color: #234c51; line-height: 1.5; }
.school-steps li { position: relative; padding-left: 2.4rem; counter-increment: school-step; }
.school-steps li::before { content: counter(school-step); position: absolute; left: 0; top: .05rem; display: grid; place-items: center; width: 1.65rem; height: 1.65rem; border-radius: 50%; background: var(--mpb-teal); color: #fff; font-family: var(--f-mono); font-size: .8rem; font-weight: 500; }
.school-steps li + li { margin-top: .7rem; }
.school-landing__note, .school-landing__hint { margin: 1.2rem 0 0; max-width: 60ch; color: #45666b; line-height: 1.5; }
.school-landing__now { margin: 1rem 0 1.2rem; max-width: 60ch; font-weight: 700; line-height: 1.5; }
.school-landing__more { margin-top: 2.5rem; }
.school-staff { margin-top: 2.5rem; }
.school-staff > summary { cursor: pointer; list-style: none; }
.school-staff > summary::-webkit-details-marker { display: none; }
.school-staff > summary h2 { display: inline; margin: 0; font-size: 1.15rem; text-decoration: underline; text-underline-offset: 4px; }
.school-staff > summary h2::after { content: ' +'; }
.school-staff[open] > summary h2::after { content: ' −'; }
.school-staff[open] > summary { margin-bottom: 1rem; }
.school-staff__message { margin-top: 1.25rem; }
.school-staff__message label { display: block; margin-bottom: .4rem; }
.school-staff__message textarea { width: 100%; padding: .75rem; border: 2px solid #5f8588; border-radius: 0; font: inherit; font-size: 1rem; line-height: 1.5; background: #fff; color: inherit; resize: vertical; }
.school-staff__actions { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; margin-top: .5rem; }
.copy-status { font-weight: 700; }
.school-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem 2rem; margin: 0; padding: 0; list-style: none; }
@media (max-width: 680px) {
  .school-landing__grid, .school-links { grid-template-columns: 1fr; }
}

/* ── Page not found ────────────────────────────────────────────────── */
.not-found-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem 2rem; margin: 1rem 0 0; padding: 0; list-style: none; }
@media (max-width: 680px) { .not-found-links { grid-template-columns: 1fr; } }

/* ── Break study page: shortcut for people already taking part, data panel ── */
.participant-shortcut { margin: 0 0 2rem; padding: .85rem 1rem; border-left: 4px solid var(--mpb-yellow); background: #fff; color: #234c51; font-weight: 600; }
.participant-shortcut a { font-weight: 700; }
.break-data-panel { margin-top: 2.5rem; }
.break-data-panel h3 { margin-top: 0; }

/* ── Persona review: schools page sections, young people's next steps, parents' buttons, FAQ groups ── */
.school-sections { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin-top: 2.5rem; }
.school-sections .info-panel { margin: 0; }
.school-sections h3, .school-ask h3 { margin-top: 0; }
.school-sections #session { grid-column: 1 / -1; }
.school-ask { margin-top: 1rem; }
.school-ask__list ul { list-style: disc; padding-left: 1.3rem; }
.school-ask__list li + li { margin-top: .5rem; }
.enquiry-follow-up ol { list-style: decimal; padding-left: 1.3rem; }
.yp-next { margin-top: 2.5rem; padding: clamp(1.5rem, 4vw, 2.5rem); border: 1px solid rgba(255,255,255,.35); background: rgba(0, 48, 53, .28); }
.yp-next h3 { margin: 0 0 1.25rem; color: #fff; }
.yp-next__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.yp-next__card { padding: 1.25rem; background: #fff; color: var(--mpb-ink); display: flex; flex-direction: column; gap: .75rem; align-items: flex-start; }
.yp-next__card h4 { margin: 0; color: var(--mpb-teal); font-size: 1.25rem; }
.yp-next__card p { margin: 0; color: #234c51 !important; }
.yp-next__help { margin: 1.25rem 0 0; color: rgba(255,255,255,.9); }
.yp-next__help a { color: var(--mpb-yellow); font-weight: 700; }
.parents-actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.5rem; }
.parents-actions__note { margin: 1rem 0 0; color: #45666b; }
/* /families/: the screen-time box first, then the way into the information sheet (/information/), which holds the details. */
.participant-next-step h2 { margin-bottom: .75rem; color: var(--mpb-teal); font-size: clamp(1.7rem, 3vw, 2.35rem); }
.participant-next-step .parents-actions .btn { margin: 0; }
.participant-info-section .narrow-content > .parents-hub__topics { margin-top: 1.5rem; }
.participant-info-section .narrow-content > .parents-hub__read { margin-top: 1.25rem; }
.parents-hub__read .btn { margin: 0 .75rem .75rem 0; }
.parents-hub__read p { max-width: 62ch; margin: 1.1rem 0 0; color: #45666b; }
.parents-hub__read p a { color: var(--mpb-teal); font-weight: 700; text-decoration: underline; text-underline-offset: .18em; }
.faq-group-title { margin: 0 0 .75rem; color: var(--mpb-teal); font-size: 1.4rem; scroll-margin-top: 110px; }
.faq-item + .faq-group-title { margin-top: 2.25rem; }
.privacy-facts { margin-top: 2rem; }
.privacy-facts h3 { margin-top: 0; }
.hero-read-first { margin: 1.1rem 0 0; color: rgba(255,255,255,.88); font-size: 1rem; }
.hero-read-first a { color: var(--mpb-yellow); font-weight: 700; }
@media (max-width: 900px) {
  .school-sections { grid-template-columns: 1fr; }
  .yp-next__grid { grid-template-columns: 1fr; }
}

/* ── Enquiry forms: a problem beside its field, and a clear box when sending fails ── */
.field-error { display: block; margin-top: .35rem; color: #9b1239; font-weight: 700; font-size: .95rem; text-transform: none; letter-spacing: 0; }
[aria-invalid="true"] { border-color: #bb1e50 !important; outline-color: #bb1e50; }
.form-failure { margin-top: 1rem; padding: 1rem 1.1rem; border-left: 5px solid var(--mpb-pink); background: #fff3f6; color: #4a0f22; }
.form-failure p { margin: 0 0 .75rem; }
.form-failure__actions { display: flex; flex-wrap: wrap; gap: .6rem; }
.form-failure__status:empty { display: none; }
.form-failure__status { margin: .75rem 0 0 !important; font-weight: 700; }
.enquiry-follow-up p + h3 { margin-top: 1.25rem; }
.school-landing__note a, .school-landing__hint a, .parents-actions__note a, .participant-shortcut a { text-decoration: underline; text-underline-offset: .18em; }

/* What a session looks like (/participation/): the stages of a workshop, photos, and a school's words. */
.session-timeline { display: grid; gap: .85rem; margin: 0; padding: 0; list-style: none; }
@media (min-width: 900px) { .session-timeline { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.session-stage { display: grid; grid-template-columns: 2.6rem minmax(0, 1fr); gap: 1rem; align-items: start; padding: 1.15rem 1.25rem; background: #fff; border: 1px solid var(--mpb-line); border-left: 5px solid var(--mpb-yellow); box-shadow: var(--shadow-sm); }
.session-stage__number { width: 2.4rem; height: 2.4rem; display: grid; place-items: center; border-radius: 50%; background: var(--mpb-teal); color: #fff; font-family: var(--f-mono); font-weight: 700; }
.session-stage__kind { margin: 0 0 .25rem; color: var(--mpb-pink); font-family: var(--f-mono); font-size: .7rem; letter-spacing: .05em; text-transform: uppercase; }
.session-stage h3 { margin: 0 0 .4rem; color: var(--mpb-teal); font-size: clamp(1.25rem, 2.2vw, 1.5rem); line-height: 1.1; }
.session-stage p:last-child { margin: 0; color: #365d62; line-height: 1.5; }
.session-photos { display: grid; gap: 1rem; margin-top: clamp(1.75rem, 4vw, 2.5rem); }
@media (min-width: 760px) { .session-photos { grid-template-columns: minmax(0, .75fr) minmax(0, 1.25fr); align-items: start; } }
.session-photo, .neuro-usp__photo { margin: 0; background: #fff; border: 1px solid var(--mpb-line); }
.session-photo img, .neuro-usp__photo img { display: block; width: 100%; height: auto; }
.session-photo figcaption, .neuro-usp__photo figcaption { padding: .65rem .85rem; color: #365d62; font-size: .9rem; line-height: 1.4; }
.school-voice { margin: clamp(1.75rem, 4vw, 2.5rem) 0 0; padding: clamp(1.5rem, 4vw, 2.25rem); background: var(--mpb-teal); }
.school-voice blockquote { margin: 0; }
.school-voice blockquote p { max-width: 42ch; margin: 0; color: #fff; font-family: var(--f-serif); font-size: clamp(1.35rem, 3vw, 1.9rem); line-height: 1.2; letter-spacing: -.02em; }
.school-voice figcaption { margin-top: 1rem; color: rgba(255,255,255,.88); font-size: .95rem; }
.school-voice .text-link, .neuro-usp .text-link { color: var(--mpb-yellow); }

/* The schools page: the neuroscience offer, the figures (once filled in) and pupils' words. */
.neuro-usp { display: grid; gap: clamp(1.25rem, 3vw, 2.5rem); margin-top: clamp(2rem, 5vw, 3rem); padding: clamp(1.5rem, 4vw, 2.5rem); background: var(--mpb-teal); }
@media (min-width: 860px) { .neuro-usp { grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); align-items: center; } }
.neuro-usp .section-kicker { color: var(--mpb-yellow); }
.neuro-usp h3 { margin: .6rem 0 1rem; color: #fff; font-size: clamp(2rem, 4vw, 3rem); line-height: 1; }
.neuro-usp p { color: rgba(255,255,255,.92); }
.neuro-usp__text p + p { margin-top: .9rem; }
.neuro-usp .text-link { display: inline-block; margin-top: 1.1rem; }
.track-record { margin-top: 1.25rem; padding: 1.25rem 1.5rem; background: #fff; border: 1px solid var(--mpb-line); border-top: 5px solid var(--mpb-yellow); }
.track-record__title { margin: 0 0 .9rem; color: var(--mpb-teal); font-size: 1.35rem; }
.track-record dl { display: flex; flex-wrap: wrap; gap: 1rem 2.75rem; margin: 0; }
.track-record dl > div { display: flex; flex-direction: column-reverse; }
.track-record dd { margin: 0; color: var(--mpb-teal); font-family: var(--f-serif); font-size: clamp(2.2rem, 5vw, 3.2rem); line-height: 1; }
.track-record dt { margin-top: .35rem; color: #365d62; font-size: .95rem; }
.track-record__note { margin: .8rem 0 0; color: #5b7b7f; font-size: .85rem; }
.school-voices { margin: clamp(2rem, 5vw, 3rem) 0 0; }
.school-voices h3 { margin: 0 0 1rem; color: var(--mpb-teal); font-size: clamp(1.6rem, 3vw, 2.2rem); }
.school-voices__quotes { display: grid; gap: 1rem; }
@media (min-width: 860px) { .school-voices__quotes { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.school-voices blockquote { margin: 0; padding: 1.25rem 1.35rem; background: #fff; border: 1px solid var(--mpb-line); border-left: 5px solid var(--mpb-yellow); }
.school-voices blockquote p { margin: 0; color: var(--mpb-ink); font-size: 1.02rem; line-height: 1.5; }
.school-voices figcaption { margin-top: 1rem; color: #365d62; font-size: .95rem; }
.session-timeline > .session-stage:last-child:nth-child(odd) { grid-column: 1 / -1; }
.gatsby-compass { max-width: none; }
@media (min-width: 760px) {
  .track-record { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 3.5rem; }
  .track-record__title { max-width: 11ch; margin: 0; font-size: 1.7rem; line-height: 1.05; }
  .track-record__note { flex-basis: 100%; margin: 0; }
}
/* The privacy page's "Don't count my visits" switch (assets/js/usage.js): a link-like button inside the details list. */
.privacy-usage-toggle { padding: 0; border: 0; background: none; color: var(--mpb-teal); font: inherit; font-weight: 700; text-decoration: underline; text-underline-offset: .18em; cursor: pointer; }
.privacy-usage-toggle[hidden] { display: none; }
/* Links always look like links (asked for on 7 October 2026): underlined wherever they sit in text, on light or dark backgrounds. Buttons, the menus and whole-card links keep their own look. */
main :is(p, li, dd, dt, td, th, figcaption, blockquote, h3, h4) a:not(.btn):not([class*="card"]) { text-decoration-line: underline; text-underline-offset: .18em; }
.contact-card a:not(.btn) { color: var(--mpb-yellow); font-weight: 700; }
.privacy-facts a { color: var(--mpb-teal); font-weight: 700; }