/* Mentorship: index.html's Schibsted Grotesk, Newsreader and green palette.
   Full-width photographic opening from index/Tandem; soft demo stage from Heidi. */
.mentorship-page {
  color-scheme: light;
  --color-ink: #1d2a24;
  --color-muted: #5d6a63;
  --color-green: #0b1c15;
  --color-teal: #00896e;
  --color-teal-dark: #00694f;
  --color-white: #fff;
  --color-cream: #f7f4ef;
  --color-field: #f4f7f5;
  --color-border: #e5eae6;
  --color-mint: #d6e6dc;
  --color-mint-light: #e2f0e9;
  --color-sky: #d9e9ee;
  --color-sand: #ebe5ce;
  --color-overlay: rgb(11 28 21 / .65);
  --color-glass: rgb(255 255 255 / .12);
  --color-white-line: rgb(255 255 255 / .23);
  --spacing-1: .25rem; --spacing-2: .5rem; --spacing-3: .75rem;
  --spacing-4: 1rem; --spacing-5: 1.25rem; --spacing-6: 1.5rem;
  --spacing-8: 2rem; --spacing-10: 2.5rem; --spacing-12: 3rem;
  --spacing-16: 4rem; --spacing-20: 5rem; --spacing-24: 6rem;
  --radius-small: .65rem; --radius-card: 1.25rem; --radius-large: 1.75rem;
  --radius-pill: 10rem; --hairline: .0625rem;
  --font-sans: 'Schibsted Grotesk', system-ui, sans-serif;
  --font-serif: 'Newsreader', Georgia, serif;
  --shadow-card: 0 1rem 4rem rgb(11 28 21 / .10);
  --transition: 180ms ease;
  margin: 0; background: var(--color-white); color: var(--color-ink);
  font: 400 1rem/1.6 var(--font-sans); -webkit-font-smoothing: antialiased;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 2rem; }
[hidden] { display: none !important; }
h1,h2,h3,p,figure,ol,ul { margin: 0; }
h1,h2,h3 { font-family: var(--font-sans); font-weight: 500; line-height: 1.15; letter-spacing: -.035em; }
h2 { font-size: clamp(1.9rem,3vw,2.5rem); }
em { font-style: normal; }
a { color: inherit; text-decoration: none; }
button,input,textarea,select { font: inherit; color: inherit; }
button,summary,select { cursor: pointer; }
button,a,input,select,textarea,summary { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: .15rem solid var(--color-teal); outline-offset: var(--spacing-1); }
img { max-width: 100%; display: block; }
svg { width: var(--spacing-5); height: var(--spacing-5); fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
.symbols { position: absolute; width: 0; height: 0; overflow: hidden; }
.wrap { width: min(calc(100% - var(--spacing-20)),66rem); margin-inline: auto; }
.eyebrow { font-size: .76rem; line-height: 1.5; letter-spacing: 0; font-weight: 500; }
.skip-link { position: fixed; z-index: 20; top: var(--spacing-3); left: var(--spacing-3); transform: translateY(-200%); padding: var(--spacing-3); background: var(--color-white); }
.skip-link:focus { transform: none; }
.button { display: inline-flex; justify-content: center; align-items: center; gap: var(--spacing-3); min-height: 2.9rem; padding: var(--spacing-3) var(--spacing-5); border: var(--hairline) solid transparent; border-radius: var(--radius-pill); font-size: .87rem; font-weight: 400; line-height: 1.4; transition: background var(--transition),border-color var(--transition); }
.primary { background: var(--color-green); color: var(--color-white); }
.primary:hover { background: var(--color-teal-dark); }
.cream { background: var(--color-white); color: var(--color-green); }
.cream:hover { background: var(--color-mint-light); }
.glass { background: var(--color-glass); color: var(--color-white); border-color: var(--color-white-line); backdrop-filter: blur(.5rem); }
.glass:hover { background: var(--color-white-line); }
.text-link { display: inline-flex; align-items: center; gap: var(--spacing-2); font-size: .83rem; }
.text-link:hover { text-decoration: underline; text-underline-offset: .2em; }
/* Same alignment, open navigation and small mark as the homepage. */
.page-nav { position: absolute; inset: 0 0 auto; z-index: 5; height: 5rem; display: flex; align-items: center; gap: var(--spacing-6); color: var(--color-white); }
.nav-logo { display: block; margin-right: auto; }
.nav-logo img { width: 1.65rem; height: 1.65rem; object-fit: contain; filter: brightness(0) invert(1); }
.desktop-nav { display: flex; align-items: center; gap: var(--spacing-6); font-size: .9rem; }
.desktop-nav>a:hover { opacity: .75; }
.nav-actions { display: flex; align-items: center; gap: var(--spacing-2); margin-left: auto; }
.nav-actions .button { font-size: .78rem; min-height: 2.4rem; padding: var(--spacing-2) var(--spacing-4); }
.nav-signin { background: var(--color-glass); }
.nav-cta { color: var(--color-green); background: var(--color-white); }
.nav-cta:hover { background: var(--color-mint-light); }
.nav-dropdown { position: relative; }
.nav-dropdown>summary { display: flex; gap: var(--spacing-2); align-items: center; list-style: none; }
summary::-webkit-details-marker { display: none; }
.nav-dropdown>nav { position: absolute; top: calc(100% + var(--spacing-5)); left: calc(-1 * var(--spacing-4)); width: 17rem; padding: var(--spacing-2); border: var(--hairline) solid var(--color-border); border-radius: var(--radius-small); background: var(--color-white); color: var(--color-ink); box-shadow: var(--shadow-card); }
.nav-dropdown>nav a { display: block; border-radius: var(--radius-small); padding: var(--spacing-3); font-size: .85rem; }
.nav-dropdown>nav a:hover,.nav-dropdown a[aria-current] { background: var(--color-field); }
.nav-dropdown small { display: block; color: var(--color-muted); font-size: .69rem; margin-top: var(--spacing-1); }
.page-nav :focus-visible { outline-color: var(--color-mint); }
.menu-toggle { display: none; background: transparent; color: var(--color-white); border: var(--hairline) solid var(--color-white-line); border-radius: var(--radius-pill); padding: var(--spacing-2) var(--spacing-4); font-size: .8rem; }
.mobile-menu { position: absolute; z-index: 6; top: 4.5rem; right: var(--spacing-5); left: var(--spacing-5); background: var(--color-white); border: var(--hairline) solid var(--color-border); border-radius: var(--radius-card); box-shadow: var(--shadow-card); padding: var(--spacing-3); }
.mobile-menu a { display: block; padding: var(--spacing-3); border-radius: var(--radius-small); font-size: .9rem; }
.mobile-menu a:hover,.mobile-menu a[aria-current] { background: var(--color-field); }
/* Tandem's photographic opening, with Epieme's existing local hero image. */
.m-hero { position: relative; isolation: isolate; min-height: 40rem; display: flex; align-items: center; color: var(--color-white); background: var(--color-green); }
.m-hero-background { position: absolute; z-index: -2; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 45%; }
.m-hero::after { content: ''; position: absolute; z-index: -1; inset: 0; background: linear-gradient(90deg, rgb(11 28 21 / .83),rgb(11 28 21 / .45) 48%,rgb(11 28 21 / .1)); }
.m-hero-inner { padding-block: 8.5rem var(--spacing-16); }
.m-hero .eyebrow { margin-bottom: var(--spacing-5); opacity: .82; font-size: .8rem; }
.m-hero h1 { font-size: clamp(2.4rem,3.8vw,3.2rem); max-width: 32rem; font-weight: 500; line-height: 1.08; letter-spacing: -.04em; }
.m-lede { max-width: 25rem; font-size: 1rem; line-height: 1.6; margin-top: var(--spacing-6); color: var(--color-border); }
.m-hero-actions { display: flex; flex-wrap: wrap; gap: var(--spacing-3); margin-top: var(--spacing-8); }
.m-hero-note { display: flex; gap: var(--spacing-2); align-items: center; font-size: .7rem; color: var(--color-mint); margin-top: var(--spacing-8); }
.m-hero-note span { width: .35rem; height: .35rem; border-radius: 50%; background: var(--color-mint); }
.m-audience { display: flex; align-items: center; justify-content: space-between; gap: var(--spacing-8); min-height: 7rem; border-inline: var(--hairline) solid var(--color-border); border-bottom: var(--hairline) solid var(--color-border); padding: var(--spacing-6); }
.m-audience>p { font-size: .75rem; line-height: 1.5; color: var(--color-muted); }
.m-audience ul { list-style: none; padding: 0; display: flex; gap: var(--spacing-12); color: var(--color-muted); font-size: 1rem; }
/* Heidi's broad, softly colored product stage and compact topic controls. */
.m-explore { padding-block: var(--spacing-20); }
.m-section-head { text-align: center; max-width: 39rem; margin-inline: auto; }
.m-section-head .eyebrow { display: inline-flex; align-items: center; gap: var(--spacing-2); padding: var(--spacing-1) var(--spacing-3); background: var(--color-mint-light); border-radius: var(--radius-small); color: var(--color-teal-dark); font-size: .7rem; }
.m-section-head .eyebrow svg { width: 1rem; height: 1rem; }
.m-section-head h2 { margin-top: var(--spacing-5); }
.m-section-head>p:last-child { color: var(--color-muted); font-size: .94rem; margin-top: var(--spacing-4); line-height: 1.65; }
.m-topic-layout { display: flex; flex-direction: column; gap: var(--spacing-8); margin-top: var(--spacing-10); padding: var(--spacing-10); border-radius: var(--radius-large); background: radial-gradient(ellipse at 5% 95%,var(--color-sand),transparent 48%),radial-gradient(ellipse at 90% 10%,var(--color-sky),transparent 55%),linear-gradient(125deg,var(--color-mint-light),var(--color-mint)); }
.m-topics { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: var(--spacing-2); order: 2; }
.m-topics button { display: flex; align-items: center; justify-content: center; gap: var(--spacing-2); padding: var(--spacing-3) var(--spacing-4); border: var(--hairline) solid transparent; border-radius: var(--radius-pill); font-size: .73rem; line-height: 1.4; background: var(--color-glass); transition: background var(--transition); }
.m-topics button svg { width: 1rem; height: 1rem; }
.m-topics button:hover { background: var(--color-mint-light); }
.m-topics button[aria-pressed='true'] { background: var(--color-white); box-shadow: 0 .2rem .7rem rgb(11 28 21 / .05); }
.m-guide { width: min(100%,39rem); margin: var(--spacing-3) auto 0; border-radius: var(--radius-card); border: var(--hairline) solid var(--color-border); box-shadow: var(--shadow-card); background: var(--color-white); overflow: hidden; padding: var(--spacing-8); min-height: 26rem; }
.m-guide>header { display: flex; align-items: center; justify-content: space-between; gap: var(--spacing-3); padding-bottom: var(--spacing-5); margin-bottom: var(--spacing-6); border-bottom: var(--hairline) solid var(--color-border); font-size: .7rem; }
.m-guide-brand { display: flex; align-items: center; gap: var(--spacing-2); font-weight: 500; }
.m-guide-brand img { width: 1rem; height: 1rem; }
.m-guide-badge { font-size: .62rem; color: var(--color-teal-dark); background: var(--color-mint-light); border-radius: var(--radius-small); padding: var(--spacing-1) var(--spacing-2); }
.m-guide-prompt { font: 500 1.4rem/1.35 var(--font-sans); letter-spacing: -.035em; max-width: 30rem; }
.m-guide>p:not(.m-guide-prompt) { color: var(--color-muted); font-size: .83rem; line-height: 1.7; margin-top: var(--spacing-3); }
.m-guide ol { padding: 0; list-style: none; counter-reset: guide; margin-block: var(--spacing-5); }
.m-guide li { display: flex; align-items: center; gap: var(--spacing-3); counter-increment: guide; font-size: .77rem; padding-block: var(--spacing-2); }
.m-guide li::before { content: counter(guide); width: 1.3rem; height: 1.3rem; display: grid; place-items: center; flex-shrink: 0; border-radius: 50%; background: var(--color-field); color: var(--color-muted); font-size: .63rem; }
.m-guide footer { display: flex; align-items: center; gap: var(--spacing-5); flex-wrap: wrap; margin-top: var(--spacing-6); }
.m-guide .button { font-size: .76rem; min-height: 2.6rem; }
.m-guide .text-link { font-size: .74rem; color: var(--color-muted); }
/* Wide photographic feature and quiet process columns. */
.m-together { background: var(--color-cream); padding-block: var(--spacing-16); }
.m-together-layout { display: grid; grid-template-columns: 1fr 1fr; gap: var(--spacing-16); align-items: center; }
.m-mentor-photo { position: relative; min-height: 30rem; height: 100%; border-radius: var(--radius-large); overflow: hidden; background: var(--color-mint-light); }
.m-mentor-photo img { width: 100%; height: 100%; position: absolute; object-fit: cover; object-position: 65% center; }
.m-mentor-photo figcaption { position: absolute; bottom: var(--spacing-5); left: var(--spacing-5); right: var(--spacing-5); padding: var(--spacing-3) var(--spacing-4); background: var(--color-white); border-radius: var(--radius-small); font-size: .7rem; width: fit-content; }
.m-together header>.eyebrow { color: var(--color-muted); margin-bottom: var(--spacing-5); }
.m-together h2 { font: 400 clamp(2.2rem,3.4vw,3.2rem)/1.1 var(--font-serif); letter-spacing: -.035em; }
.m-together h2 span { color: var(--color-teal-dark); }
.m-together header>p:not(.eyebrow) { color: var(--color-muted); font-size: .9rem; max-width: 26rem; margin-top: var(--spacing-5); line-height: 1.75; }
.m-together .button { margin-top: var(--spacing-6); }
.m-process-section { padding-block: var(--spacing-20); }
.m-process-section header { max-width: 40rem; }
.m-process-section .eyebrow { color: var(--color-teal-dark); margin-bottom: var(--spacing-4); }
.m-process-section header>p:last-child { color: var(--color-muted); font-size: .9rem; margin-top: var(--spacing-4); }
.m-process { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: var(--spacing-8); padding: 0; list-style: none; margin-top: var(--spacing-10); }
.m-process li { border-top: var(--hairline) solid var(--color-border); padding-top: var(--spacing-5); }
.m-process li>span { font-size: .7rem; color: var(--color-teal-dark); }
.m-process h3 { font-size: 1.05rem; margin-top: var(--spacing-6); letter-spacing: -.025em; }
.m-process p { font-size: .81rem; line-height: 1.7; margin-top: var(--spacing-3); color: var(--color-muted); }
/* Real introduction flow, using the homepage's quiet forms and pill actions. */
.m-start { padding-block: var(--spacing-20); border-top: var(--hairline) solid var(--color-border); display: grid; grid-template-columns: 1fr 1.1fr; gap: var(--spacing-16); align-items: start; }
.m-start-copy>.eyebrow { color: var(--color-teal-dark); margin-bottom: var(--spacing-5); }
.m-start-copy>p:not(.eyebrow) { color: var(--color-muted); max-width: 24rem; font-size: .9rem; margin-top: var(--spacing-5); }
.m-expect { border-left: .15rem solid var(--color-mint); padding-left: var(--spacing-5); margin-top: var(--spacing-10); max-width: 24rem; }
.m-expect>svg { color: var(--color-teal-dark); margin-bottom: var(--spacing-4); }
.m-expect h3 { font-size: 1rem; }
.m-expect p { font-size: .8rem; line-height: 1.75; color: var(--color-muted); margin-top: var(--spacing-3); }
.m-start-copy>.text-link { color: var(--color-teal-dark); font-size: .77rem; margin-top: var(--spacing-6); }
.m-form { padding: var(--spacing-8); border-radius: var(--radius-card); background: var(--color-field); min-width: 0; display: flex; flex-direction: column; }
.m-form label,.m-form legend { font-size: .75rem; font-weight: 500; display: block; }
.m-form label>span { color: var(--color-muted); font-weight: 400; font-size: .66rem; }
.m-form input:not([type='radio']),.m-form select,.m-form textarea { width: 100%; border: var(--hairline) solid var(--color-border); background: var(--color-white); border-radius: var(--radius-small); padding: var(--spacing-3); font: 400 .8rem/1.6 var(--font-sans); min-height: 3rem; margin-top: var(--spacing-2); }
.m-form textarea { resize: vertical; min-height: 7rem; }
.m-form input::placeholder,.m-form textarea::placeholder { color: var(--color-muted); opacity: 1; }
.m-form>label { margin-top: var(--spacing-5); }
.m-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: var(--spacing-4); margin-top: var(--spacing-6); }
.m-form-row label { min-width: 0; }
.m-role { display: grid; grid-template-columns: 1fr 1fr; gap: var(--spacing-2); border: 0; padding: 0; margin: 0; min-width: 0; }
.m-role legend { margin-bottom: var(--spacing-3); }
.m-role label { position: relative; cursor: pointer; }
.m-role input { position: absolute; opacity: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.m-role label>span { display: flex; justify-content: space-between; align-items: center; gap: var(--spacing-2); min-height: 3.6rem; border: var(--hairline) solid var(--color-border); border-radius: var(--radius-small); padding: var(--spacing-3); font-size: .73rem; color: var(--color-ink); background: var(--color-white); }
.m-role svg { width: 1rem; height: 1rem; }
.m-role input:checked+span { border-color: var(--color-teal); background: var(--color-mint-light); }
.m-role input:focus-visible+span { outline: .15rem solid var(--color-teal); outline-offset: var(--spacing-1); }
.m-field-hint { font-size: .65rem; color: var(--color-muted); margin-top: var(--spacing-2); line-height: 1.6; }
.m-submit { margin-top: var(--spacing-6); justify-content: space-between; }
.m-form-note { font-size: .63rem; text-align: center; color: var(--color-muted); margin-top: var(--spacing-3); }
.faq { display: grid; grid-template-columns: 1fr 1.1fr; gap: var(--spacing-16); padding-block: var(--spacing-16) var(--spacing-20); border-top: var(--hairline) solid var(--color-border); }
.faq .eyebrow { color: var(--color-teal-dark); margin-bottom: var(--spacing-5); }
.faq-items details { border-bottom: var(--hairline) solid var(--color-border); }
.faq-items summary { display: flex; justify-content: space-between; align-items: center; gap: var(--spacing-5); padding-block: var(--spacing-5); list-style: none; font-size: .87rem; line-height: 1.5; }
.faq-items summary>span { font-size: 1.3rem; transition: transform var(--transition); }
.faq-items details[open] summary>span { transform: rotate(45deg); }
.faq-items p { padding-bottom: var(--spacing-5); color: var(--color-muted); font-size: .8rem; line-height: 1.8; }
.faq-items p a { color: var(--color-teal-dark); text-decoration: underline; text-underline-offset: .15em; }
.m-last { background: var(--color-green); color: var(--color-white); padding-block: var(--spacing-20); }
.m-last>.wrap { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: var(--spacing-5) var(--spacing-8); }
.m-last .eyebrow { grid-column: 1/-1; color: var(--color-mint); }
.m-last h2 { font: 400 clamp(2.2rem,3.5vw,3.3rem)/1.15 var(--font-serif); }
.page-footer { display: grid; grid-template-columns: 1fr auto; gap: var(--spacing-4) var(--spacing-8); padding-block: var(--spacing-12); font-size: .76rem; }
.wordmark { display: inline-flex; align-items: center; gap: var(--spacing-2); font-size: 1.3rem; letter-spacing: -.05em; }
.wordmark img { width: var(--spacing-6); height: var(--spacing-6); }
.page-footer p { color: var(--color-muted); grid-column: 1; }
.page-footer nav { grid-column: 2; grid-row: 1; display: flex; align-items: center; gap: var(--spacing-5); }
.page-footer small { grid-column: 2; text-align: right; color: var(--color-muted); font-size: .68rem; }
.page-footer a:hover { color: var(--color-teal-dark); }
/* Native modal keeps focus and Escape behavior without a framework. */
.m-dialog { width: min(36rem,calc(100% - var(--spacing-8))); max-height: calc(100dvh - var(--spacing-8)); overflow: auto; background: var(--color-white); color: var(--color-ink); border: var(--hairline) solid var(--color-border); border-radius: var(--radius-card); padding: var(--spacing-8); box-shadow: var(--shadow-card); }
.m-dialog::backdrop { background: var(--color-overlay); backdrop-filter: blur(.2rem); }
.m-dialog-close { position: absolute; top: var(--spacing-3); right: var(--spacing-3); width: var(--spacing-10); height: var(--spacing-10); font-size: 1.5rem; line-height: 1; border: 0; border-radius: 50%; background: transparent; }
.m-dialog-close:hover { background: var(--color-field); }
.m-dialog>.eyebrow { color: var(--color-teal-dark); font-size: .6rem; margin-top: var(--spacing-3); }
.m-dialog h2 { margin-top: var(--spacing-4); font-size: 2rem; }
.m-dialog-help { font-size: .82rem; color: var(--color-muted); margin-block: var(--spacing-4); }
.m-dialog textarea { display: block; width: 100%; resize: vertical; min-height: 15rem; font: 400 .8rem/1.65 var(--font-sans); padding: var(--spacing-4); border: var(--hairline) solid var(--color-border); border-radius: var(--radius-small); background: var(--color-field); margin-top: var(--spacing-2); }
.m-dialog footer { display: flex; flex-wrap: wrap; gap: var(--spacing-3); margin-top: var(--spacing-5); }
.m-copy { border-color: var(--color-border); background: transparent; }
#copy-status { font-size: .68rem; color: var(--color-muted); margin-top: var(--spacing-3); }
@media(max-width:62rem) {
  .desktop-nav,.nav-actions { display: none; }
  .menu-toggle { display: flex; gap: var(--spacing-3); }
  .m-audience ul { gap: var(--spacing-6); }
  .m-together-layout,.m-start,.faq { gap: var(--spacing-8); }
  .m-form { padding: var(--spacing-6); }
  .m-form-row { grid-template-columns: 1fr; }
  .m-topic-layout { padding: var(--spacing-8); }
}
@media(max-width:46rem) {
  .wrap { width: calc(100% - var(--spacing-10)); }
  .page-nav { height: 4.5rem; }
  .m-hero { min-height: 39rem; align-items: flex-end; }
  .m-hero-inner { padding-block: 9rem var(--spacing-10); }
  .m-hero-background { object-position: 57% center; }
  .m-hero::after { background: linear-gradient(0deg,rgb(11 28 21 / .88),rgb(11 28 21 / .50) 60%,rgb(11 28 21 / .32)); }
  .m-hero h1 { font-size: 2.5rem; }
  .m-lede { max-width: 23rem; font-size: .92rem; }
  .m-hero-actions { gap: var(--spacing-2); margin-top: var(--spacing-6); }
  .m-hero-actions .button { font-size: .78rem; padding-inline: var(--spacing-4); }
  .m-hero-note { font-size: .64rem; margin-top: var(--spacing-6); }
  .m-audience { display: block; padding: var(--spacing-6) var(--spacing-3); border-inline: 0; text-align: center; }
  .m-audience>p br { display: none; }
  .m-audience ul { justify-content: space-between; gap: var(--spacing-3); margin-top: var(--spacing-4); font-size: .78rem; }
  .m-explore,.m-process-section { padding-block: var(--spacing-16); }
  .m-section-head>p:last-child { font-size: .86rem; }
  .m-section-head>p:last-child br { display: none; }
  .m-topic-layout { padding: var(--spacing-5); gap: var(--spacing-5); margin-top: var(--spacing-8); }
  .m-guide { padding: var(--spacing-5); margin: 0; min-height: 0; }
  .m-guide>header { margin-bottom: var(--spacing-5); padding-bottom: var(--spacing-4); }
  .m-guide-brand { font-size: .65rem; }
  .m-guide-badge { display: none; }
  .m-guide-prompt { font-size: 1.15rem; }
  .m-guide>p:not(.m-guide-prompt) { font-size: .77rem; }
  .m-guide li { font-size: .71rem; align-items: flex-start; }
  .m-guide footer { gap: var(--spacing-4); }
  .m-guide footer .button { font-size: .72rem; padding-inline: var(--spacing-3); }
  .m-guide .text-link { font-size: .69rem; }
  .m-topics { gap: var(--spacing-2); }
  .m-topics button { padding: var(--spacing-2) var(--spacing-3); font-size: .66rem; min-height: 2.6rem; }
  .m-together { padding-block: var(--spacing-12); }
  .m-together-layout { grid-template-columns: 1fr; }
  .m-mentor-photo { min-height: 20rem; }
  .m-together h2 { font-size: 2.5rem; }
  .m-together h2 br { display: none; }
  .m-together header>p:not(.eyebrow) { max-width: 100%; }
  .m-process { grid-template-columns: 1fr; gap: var(--spacing-6); margin-top: var(--spacing-8); }
  .m-process h3 { margin-top: var(--spacing-4); }
  .m-start,.faq { grid-template-columns: 1fr; padding-block: var(--spacing-12); }
  .m-start-copy>p:not(.eyebrow),.m-expect { max-width: 100%; }
  .m-expect { margin-top: var(--spacing-6); }
  .m-form { padding: var(--spacing-5); }
  .m-last { padding-block: var(--spacing-16); }
  .m-last>.wrap { display: block; }
  .m-last h2 { margin-top: var(--spacing-5); font-size: 2.6rem; }
  .m-last .button { margin-top: var(--spacing-6); }
  .page-footer { grid-template-columns: 1fr; gap: var(--spacing-3); padding-block: var(--spacing-8); }
  .page-footer nav,.page-footer small { grid-column: 1; grid-row: auto; text-align: left; flex-wrap: wrap; }
  .page-footer nav { margin-block: var(--spacing-3); }
  .m-dialog { padding: var(--spacing-6); }
  .m-dialog footer .button { font-size: .76rem; padding-inline: var(--spacing-4); }
}
@media(max-width:23rem) {
  .m-hero h1 { font-size: 2.2rem; }
  .m-hero-actions { flex-direction: column; align-items: flex-start; }
  .m-topic-layout { padding: var(--spacing-3); }
  .m-guide { padding: var(--spacing-4); }
  .m-role { grid-template-columns: 1fr; }
  .m-audience ul { font-size: .72rem; gap: var(--spacing-2); }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior: auto; } *,*::before,*::after { transition: none !important; } }
@media print { .page-nav,.mobile-menu,.m-form,.m-last,.m-dialog { display: none; } .m-hero { min-height: 0; color: var(--color-ink); background: var(--color-white); } .m-hero-background,.m-hero::after,.m-hero-actions { display: none; } .m-hero-inner { padding-block: var(--spacing-8); } .m-lede,.m-hero-note { color: var(--color-muted); } .m-start,.faq,.m-together-layout { display: block; } .m-mentor-photo { display: none; } }