/* Desktop dimensions scale together; only tablet/phone widths recompose the layout. */
@media (max-width: 900px) {
    .header-inner { gap: 1.4375rem; }
    .desktop-nav { gap: 1.25rem; }
    .desktop-nav a { font-size: 0.6875rem; }
    .header-cta { padding-inline: 1.25rem; }
    .hero-actions { flex-wrap: wrap; gap: 0.625rem; }
    .hero h1 { font-size: 6.45vw; }
    .hero-lead { font-size: 0.9375rem; }
    .hero-copy { width: 52%; }
    .hero-visual { right: -6%; width: 61%; }
    .about-layout { gap: 1.875rem; }
    .about-numbers > div { padding-inline: 1.25rem; }
    .about-numbers dt { font-size: 3.3125rem; }
    .about-education { padding-inline: 1.4375rem; }
    .education-list h3 { font-size: 1.3125rem; }
    .social-layout { gap: 2.8125rem; }
}
@media (max-width: 900px) {
    :root { --header-height: 5rem; }
    .desktop-nav { display: none; }
    .header-cta { margin-left: auto; }
    .menu-toggle { display: block; }
    .hero-layout { min-height: 40.625rem; padding-top: 7.1875rem; padding-bottom: 3.125rem; }
    .hero h1 { font-size: clamp(3.25rem, 6.5vw, 4.5rem); }
    .hero-lead { font-size: 0.875rem; }
    .hero-visual { top: 5.9375rem; right: -5%; width: 60%; }
    .hero-stamp { width: 5.5rem; height: 5.5rem; right: -1%; }
    .hero-stamp > span { font-size: 2.25rem; }
    .hero-stamp small { font-size: 0.625rem; }
    .hero-moon { width: 3.125rem; }
    .about-layout { grid-template-columns: minmax(0, 1.4fr) minmax(18.75rem, 1fr); }
    .about h2 { font-size: 3.55vw; }
    .about-text { font-size: 0.875rem; }
    .about-tagline { font-size: 1.625rem; }
    .about-numbers { gap: 0.75rem; }
    .about-numbers > div { padding: 1.25rem 0.9375rem; }
    .about-numbers dt { font-size: 2.8125rem; }
    .about-numbers dd { font-size: 0.6875rem; }
    .course-grid { grid-auto-columns: min(42vw, 22.5rem); }
    .course-card { padding: 1.4375rem; min-height: 29.6875rem; }
    .course-card h3 { font-size: 2.25rem; }
    .course-carousel-footer { display: flex; }
    .section-heading--split { gap: 1.875rem; grid-template-columns: 1.2fr 1fr; }
    .section-heading--split > p { font-size: 0.8125rem; }
    .follow-intro h2 { font-size: 2.25rem; }
    .follow-strip { gap: 1rem; }
    .follow-card { padding: 1.25rem; }
    .social-layout { grid-template-columns: minmax(0, 1.1fr) minmax(19.375rem, 1fr); gap: 2.5rem; }
    .social-question-intro { grid-template-columns: minmax(0, 1fr) 6.25rem; gap: 0 0.9375rem; }
    .heart-location { width: 6.25rem; }
    .social-question-intro > p { font-size: 0.875rem; }
    .final-note { left: 62%; font-size: 1.6875rem; }
    .final-content > p:not(.eyebrow) { max-width: 55%; font-size: 0.8125rem; }
}
@media (max-width: 900px) {
    .hero-layout { display: block; padding-top: 7.3125rem; padding-bottom: 0; min-height: 0; }
    .hero-copy { width: 100%; max-width: 40.625rem; margin-top: 0; }
    .hero h1 { font-size: clamp(3.6875rem, 8.4vw, 4.75rem); }
    .hero-lead { font-size: 1rem; }
    .hero-actions { flex-wrap: nowrap; margin-top: 1.5625rem; }
    .hero-visual { position: relative; top: auto; bottom: auto; right: auto; width: min(100%, 37.5rem); height: 31.875rem; margin: 0.875rem 0 0 auto; }
    .portrait-caption { font-size: 2.625rem; }
    .hero-moon { right: 3%; top: 2%; }
    .hero-stamp { right: 0; }
    .hero-still-life { left: -4%; width: 38%; }
    .hero-open-book { right: 0; }
    .about-layout { grid-template-columns: 1fr; gap: 1.75rem; }
    .about h2 { font-size: 2.6875rem; white-space: normal; }
    .about-tagline { font-size: 1.9375rem; }
    .about-text { max-width: none; font-size: 0.9375rem; }
    .about-numbers > div { padding: 1.375rem; }
    .about-numbers dt { font-size: 3.5625rem; }
    .about-numbers dd { font-size: 0.8125rem; }
    .about-education { margin-top: 0; }
    .education-heading { min-height: 7rem; }
    .education-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; }
    .education-list li { grid-template-columns: 1fr; gap: 0.625rem; }
    .education-list h3 { font-size: 1.3125rem; }
    .section-heading--split { grid-template-columns: 1fr; gap: 1.125rem; }
    .section-heading--split > p { padding: 0; max-width: 29.375rem; font-size: 0.875rem; }
    .guide-banner { padding: 2rem; min-height: 21.375rem; }
    .guide-copy { max-width: none; }
    .guide-copy h2 { font-size: 2.9375rem; }
    .guide-copy > p { font-size: 0.8125rem; }
    .guide-copy .desktop-break { display: none; }
    .guide-art { height: 12rem; }
    .guide-note { font-size: 1.25rem; margin-right: 0; }
    .follow-strip { grid-template-columns: 1fr 1fr; gap: 1.125rem; }
    .follow-intro { grid-column: 1/-1; padding: 0; }
    .follow-intro h2 { font-size: 2.625rem; }
    .follow-intro > p:last-child { max-width: 31.25rem; }
    .follow-card { min-height: 10.9375rem; }
    .social-layout { grid-template-columns: 1fr; gap: 2.1875rem; }
    .social-question-intro { grid-template-columns: minmax(0, 1fr) 7.5rem; max-width: 40.625rem; }
    .heart-location { width: 7.5rem; }
    .social-row { grid-template-columns: 2.625rem minmax(0, 1fr) 1.125rem; gap: 0.75rem; }
    .social-icon { width: 2.625rem; height: 2.625rem; }
    .social-row strong { font-size: 1.5625rem; }
    .social-row small { font-size: 0.6875rem; }
    .final-content h2 { font-size: 3.0625rem; }
    .final-note { display: none; }
}
@media (max-width: 640px) {
    :root { --gutter: max(1.25rem, env(safe-area-inset-left), env(safe-area-inset-right)); --header-height: 4.5rem; --section-space: 3rem; }
    body { padding: 0.375rem; font-size: 0.875rem; }
    .site-header { inset: 0.375rem 0.375rem auto; }
    .site-header.is-scrolled { inset: 0 0.375rem auto; }
    .brand { font-size: 2.25rem; }
    .header-inner { gap: 1rem; }
    .header-cta { display: none; }
    .eyebrow { font-size: 0.5625rem; gap: 0.75rem; margin-bottom: 1.25rem; }
    .eyebrow::before { width: 1.75rem; }
    .hero-layout { padding-top: 6.1875rem; }
    .hero-kicker { font-size: 0.5625rem; gap: 0.6875rem; margin-bottom: 0.9375rem; }
    .hero h1 { font-size: clamp(2.5rem, 11.2vw, 4.125rem); line-height: .98; }
    .hero-lead { margin-top: 1.375rem; font-size: 0.875rem; line-height: 1.65; max-width: 26.875rem; }
    .desktop-break { display: none; }
    .hero-actions { flex-wrap: wrap; gap: 0.6875rem; margin-top: 1.4375rem; }
    .hero-actions .button { min-height: 3.25rem; }
    .hero-actions .button:first-child { min-width: 12.8125rem; }
    .hero-actions .button--outline { font-size: 0.75rem; }
    .hero-visual { height: clamp(20rem, 96vw, 30rem); width: 111%; margin-left: -5%; margin-top: 1.0625rem; }
    .hero-portrait { width: 98%; right: -1%; height: 104%; bottom: 0; }
    .portrait-backdrop { inset: 6% 5% 2% 20%; }
    .portrait-backdrop::after { inset: 0.75rem; }
    .portrait-caption { top: 19%; left: 3%; font-size: clamp(1.6875rem, 7.7vw, 2.375rem); }
    .hero-still-life { left: -1%; bottom: 6%; width: 38%; }
    .hero-open-book { width: 47%; bottom: -1%; right: -2%; }
    .hero-moon { width: 2.6875rem; right: 6%; }
    .hero-stamp { width: 4.8125rem; height: 4.8125rem; top: 46%; right: 3%; gap: 0.3125rem; }
    .hero-stamp > span { font-size: 1.9375rem; }
    .hero-stamp small { font-size: 0.5rem; }
    .about h2 { font-size: clamp(2.0625rem, 9.5vw, 2.75rem); line-height: 1.04; }
    .about-tagline { font-size: 1.6875rem; margin-top: 0.75rem; }
    .about-tagline br { display: none; }
    .about-tagline-row { grid-template-columns: minmax(0, 1fr) 3rem; gap: 0.5rem; }
    .about-text { margin-top: 1.5625rem; font-size: 0.875rem; line-height: 1.7; }
    .about-numbers { gap: 0.5625rem; margin-top: 1.6875rem; }
    .about-numbers > div { padding: 1.125rem 0.625rem; border-radius: 0.75rem; }
    .about-numbers dt { font-size: clamp(2.125rem, 10.7vw, 3.3125rem); }
    .about-numbers dd { font-size: 0.625rem; margin-top: 0.6875rem; }
    .about-education { border-radius: 1.125rem; padding-inline: 1.375rem; }
    .education-heading { min-height: 7.8125rem; }
    .education-heading .mini-label { font-size: 0.625rem; }
    .about-avatar { width: 6.625rem; flex-basis: 6.625rem; }
    .education-list { display: block; }
    .education-list li { grid-template-columns: 1.5rem 1fr; gap: 0.9375rem; padding-block: 1.4375rem; }
    .education-list h3 { font-size: 1.5rem; }
    .education-list p { font-size: 0.8125rem; }
    .section-heading h2 { font-size: 2.75rem; }
    .section-heading--split { margin-bottom: 1.875rem; }
    .course-grid { grid-auto-columns: min(calc(100vw - 4.125rem), 23.125rem); gap: 0.9375rem; }
    .course-carousel { --course-edge: var(--gutter); }
    .course-card { padding: 1.4375rem; min-height: 30.9375rem; }
    .course-tag { font-size: 0.5625rem; }
    .course-art { height: 7.1875rem; }
    .course-card h3 { font-size: 2.375rem; }
    .course-card > p { font-size: 0.875rem; }
    .course-card ul { font-size: 0.75rem; gap: 0.5rem; }
    .course-link { font-size: 0.8125rem; }
    .materials { padding-top: 2.5rem; }
    .guide-banner { grid-template-columns: 1fr; min-height: 0; padding: 1.8125rem 1.5625rem; border-radius: 1.3125rem; gap: 1.5rem; }
    .guide-copy { max-width: 100%; }
    .guide-copy h2 { font-size: clamp(2.6875rem, 12vw, 3.8125rem); }
    .guide-copy > p { margin-top: 1.375rem; font-size: 0.875rem; line-height: 1.65; }
    .guide-copy .button { min-width: 13.625rem; }
    .guide-art { height: 14rem; }
    .guide-note { font-size: 1.1875rem; opacity: .8; }
    .guide-note span { display: none; }
    .follow-strip { gap: 0.8125rem; }
    .follow-intro h2 { font-size: 2.25rem; }
    .follow-intro > p:last-child { font-size: 0.875rem; }
    .follow-card { min-height: 10.625rem; padding: 1.25rem 0.8125rem; gap: 0.875rem; border-radius: 1.0625rem; }
    .follow-card svg { width: 2.1875rem; height: 2.1875rem; }
    .follow-card strong { font-size: 0.9375rem; }
    .follow-card > span { font-size: 0.6875rem; }
    .socials { border-radius: 1.125rem; }
    .social-question-intro { grid-template-columns: minmax(0, 1fr) 5rem; gap: 0 0.75rem; }
    .social-question-intro > p { font-size: 0.875rem; }
    .heart-location { width: 5rem; }
    .social-group h3 { font-size: 0.625rem; }
    .social-row { grid-template-columns: 2.9375rem minmax(0, 1fr) 1.375rem; gap: 0.9375rem; padding-block: 1.125rem; }
    .social-icon { width: 2.9375rem; height: 2.9375rem; }
    .social-row strong { font-size: 1.8125rem; }
    .social-row small { font-size: 0.6875rem; }
    .final-section { padding-top: 1.125rem; }
    .final-banner { min-height: 40.625rem; background-image: url("../images/generated/footer-study-scene.webp"); background-size: auto 55%; background-position: right bottom; }
    .final-banner::before { background: linear-gradient(180deg, #482034 0%, #482034 43%, #482034e6 55%, transparent 80%); }
    .final-content { padding-block: 1.9375rem; }
    .final-content h2 { font-size: clamp(2.375rem, 10.5vw, 3.625rem); }
    .final-content > p:not(.eyebrow) { max-width: 100%; font-size: 0.8125rem; margin-top: 1.375rem; }
    .final-content > p:not(.eyebrow) br { display: none; }
    .final-content .button { min-width: 14.6875rem; margin-top: 1.4375rem; }
    .site-footer { padding-block: 1.5625rem 0.625rem; }
    .footer-inner { gap: 1rem 1.375rem; font-size: 0.625rem; }
    .footer-inner .brand { width: 100%; font-size: 2rem; }
    .footer-inner > p { width: 100%; }
}
@media (max-width: 360px) {
    :root { --gutter: 1rem; }
    .hero h1 { font-size: 10.9vw; }
    .hero-lead { font-size: 0.8125rem; }
    .hero-kicker { font-size: 0.5rem; }
    .about-numbers { gap: 0.4375rem; }
    .about-numbers > div { padding-inline: 0.5rem; }
    .about-numbers dt { font-size: 2.125rem; }
    .course-card h3 { font-size: 2.125rem; }
    .about-education { padding-inline: 1.0625rem; }
    .education-heading .mini-label { font-size: 0.5625rem; }
    .about-avatar { width: 5.75rem; flex-basis: 5.75rem; }
    .guide-banner { padding-inline: 1.25rem; }
    .guide-copy h2 { font-size: 2.4375rem; }
    .social-question-intro { grid-template-columns: minmax(0, 1fr) 4.3125rem; }
    .heart-location { width: 4.3125rem; }
    .final-content h2 { font-size: 2.1875rem; }
}