/* One additional desktop zoom-out step, expressed as real layout dimensions.
   Keep the responsive breakpoints, 16px body copy, 44px controls and modal native.
   Loaded after the route styles so later hero rules use the same desktop rhythm. */
@media screen and (min-width: 901px) {
  :root {
    --desktop-rail: min(71.44vw, 1022.58px);
    --desktop-pad: clamp(20.52px, 4.3605vw, 72.675px);
    --section: clamp(57.6px, 6.3vw, 100.8px);
  }

  .header { column-gap: 21.6px; }
  .header .brand { font-size: 18.81px; padding-right: 18.81px; }
  .header .nav-main { gap: 21.6px; }
  .header .nav-main a { font-size: 14.4px; }
  .header .nav-apps { gap: 18px; padding-left: 21.6px; }
  .header nav a, .header .theme-toggle { min-height: 44px; }

  .home .hero-main { min-height: clamp(450px, 36.9vw, 558px); padding-block: 43.2px; }
  .home .hero h1 { font-size: clamp(43.2px, 4.365vw, 68.4px); margin-bottom: 25.2px; }
  .home .hero-description { font-size: clamp(18px, 1.53vw, 21.6px); max-width: 531px; }
  .home .hero-support { font-size: 16px; max-width: 513px; margin-top: 21.6px; }
  .home .hero-actions { margin-top: 28.8px; gap: 25.2px; }
  .home .hero .primary-link { min-height: 44px; padding: 10.8px 19.8px; }
  .home .hero-index { gap: 19.8px; padding-block: 18.9px 21.6px; }

  .home .portfolio-story .about { padding-block: 35.055px 40.185px; }
  .home #about .about-title h2 { font-size: clamp(27.36px, 2.7vw, 39.6px); }
  .home #about .about-copy > p.lead { font-size: 16.2px; }
  .home #about .about-copy > p { font-size: 16px; }
  .home #about .build-illustration { margin-top: 16.2px; }
  .home #about .about-read-more { margin-top: 21.6px; }
  .home .portfolio-story .work { padding-block: 25.65px 53.01px; }
  .section-head { gap: 22.23px; margin-bottom: 30.78px; }
  .section-head h2 { font-size: clamp(27.36px, 2.9241vw, 41.04px); }
  .home .portfolio-story .work > .section-head { padding-bottom: 17.955px; margin-bottom: 17.955px; }
  .portfolio-impact-heading { margin-bottom: 18.81px; }
  .portfolio-impact-heading h3 { font-size: 16.245px; }
  .portfolio-impact-metrics { gap: 23.94px; }
  .portfolio-impact .impact-metric + .impact-metric { padding-left: 23.94px; }
  .portfolio-impact .impact-number { font-size: clamp(35.91px, 3.2913vw, 47.025px); }
  .project-grid { gap: 20.52px; }
  .project-copy { padding: 23.94px; }
  .project-copy h3 { font-size: clamp(21.375px, 1.8981vw, 27.36px); }
  .project-thesis { font-size: 16px; }
  .project-label { margin-bottom: 13.68px; }
  .visual-link { padding: 20.52px; }
  .project-featured .project-copy { padding: clamp(22.23px, 2.4111vw, 36.765px); }
  .project-featured h3 { font-size: clamp(27.36px, 2.7018vw, 38.475px); }
  .project-featured .project-thesis { font-size: 17.1px; }
  .project-featured .visual-link { padding: clamp(22.23px, 2.6334vw, 41.895px); }
  .project-wide .project-copy { padding: 27.36px; }
  .project-wide .visual-link { padding: 23.94px 30.78px; }

  .about-page .about-introduction-centered,
  html[data-theme=dark] .about-page .about-introduction-centered { padding-block: 57.6px 64.8px; }
  .about-page .about-introduction-centered .about-introduction-inner { max-width: 900px; }
  .about-page .about-introduction-centered .about-introduction-composition { gap: 30.6px; }
  .about-page .about-introduction-centered h1 { font-size: clamp(28.8px, 2.88vw, 43.2px); }
  .about-page .about-introduction-centered .about-introduction-bottom { max-width: 720px; }
  .about-page .about-introduction-centered .about-introduction-bottom > p:not(.about-location) { max-width: 684px; font-size: 16px; }
  .about-page .about-introduction-centered .about-introduction-bottom > .about-location { margin-top: 21.6px; }
  .about-page .about-introduction-centered .about-focus { gap: 10.8px; margin-top: 28.8px; }
  .about-page .about-introduction-centered .about-focus li { min-width: 129.6px; padding: 9px 19.8px; }
  .about-page .about-introduction-centered > .about-introduction-inner > .linkedin-link { margin-top: 27px; font-size: 14px; }
  .about-page .about-chapter { padding-block: 44.46px; }
  .about-page .about-chapter + .about-chapter { padding-top: 0; }
  .about-page .about-chapter-heading { margin-bottom: 25.65px; }
  .about-page .about-chapter + .about-chapter > .about-chapter-heading { padding-top: 41.04px; }
  .about-page .about-chapter-heading h2 { font-size: clamp(25.65px, 2.6073vw, 35.91px); }
  .about-page .about-chapter-heading > p:not(.micro) { margin-top: 15.39px; font-size: 16px; }
  .about-page .employment-record { padding: 36px; }
  .about-page .employment-record + .employment-record { margin-top: 36px; }
  .about-page .employment-story { padding-top: 28.8px; }
  .about-page .employment-story h4 { font-size: 20.52px; margin-bottom: 16.2px; }
  .employment-identity { font-size: 22.23px; }
  .employment-impact { gap: 20.52px; margin-top: 23.94px; padding-top: 21.375px; }
  .employment-impact li + li { padding-left: 20.52px; }
  .employment-impact strong { font-size: 29.07px; }
  .employment-award { gap: 18px; margin-top: 28.8px; padding: 25.2px 23.4px; }
  .employment-award-art { width: 58.14px; flex-basis: 58.14px; }
  .employment-award-copy h4 { font-size: 17.955px; }
  .education-entry h3 { font-size: 17.1px; }
  .language-panel > h3 { font-size: 22.23px; }
  .foundation-composition { padding-top: 25.65px; }
  .about-page .profile-foundations .education-entry { --education-mark-width: clamp(57.6px, 5.85vw, 68.4px); gap: 19.8px; }
  .profile-certificates { padding-bottom: 57.285px; }
  .profile-certificates .chapter-heading h2 { font-size: clamp(34.2px, 3.249vw, 48.735px); }
  .certificates-description { font-size: clamp(16px, 1.2825vw, 18.81px); }
  .certificate-card { padding: 25.65px 29.07px 20.52px; min-height: 196.65px; }
  .certificate-issuer { gap: 21.375px; }
  .certificate-issuer h3 { font-size: clamp(16.245px, 1.2825vw, 20.52px); }
  .certificate-mark { width: 63.27px; height: 63.27px; }
  .certificate-stanford .certificate-mark img { width: 76.95px; height: 76.95px; }
  .certificate-card li { font-size: 16px; }
  .certificate-google li { font-size: 16.245px; }
  .certificate-category { font-size: 14px; padding: 5.985px 16.245px; }
  .about-building { padding-block: 0; }
  .about-building-copy { font-size: 16px; }
  .about-tool-list { gap: 21.375px 37.62px; margin-top: 23.94px; }
  .about-tool-list dt { font-size: 16px; }
  .about-tool-list dd { font-size: 16px; }
  .about-next-steps { gap: 17.1px 23.94px; margin-top: 22.23px; }

  .case-page .case-hero[data-project] { max-width: 1022.58px; margin-top: 21.6px; padding: 21.6px 30.6px 25.2px; border-radius: 19.8px; }
  .case-page .case-title h1 { font-size: clamp(37.8px, 5.9cqw, 59.4px); margin-block: 15.3px 13.5px; }
  .case-page .case-title > p { font-size: clamp(18px, 2.2cqw, 21.6px); }
  .case-page .case-summary { font-size: 16px; margin-top: 14.4px; }
  .case-page .case-meta { margin-top: 23.4px; gap: 7.2px; }
  .case-page .case-meta > span { padding: 7.2px 10.8px; }
  .case-hero-art img { max-height: 355.5px; }
  .case-layout { grid-template-columns: 153.9px minmax(0,1fr); gap: clamp(29.07px, 3.6504vw, 58.14px); padding-block: 30.78px 58.14px; }
  .article h2, .article-section.example h2 { font-size: 22.23px; margin-bottom: 17.955px; }
  .article p { font-size: 16px; }
  .article-section { gap: 13.68px; padding-bottom: 30.78px; margin-bottom: 30.78px; }
  .case-lead-capture { margin-top: 22.23px; }
  .capture-inline { margin-block: 22.23px 30.78px; }
  .capture-open, .capture-lead .capture-open { padding: 16.2px; }
  .decision-heading { font-size: 18.9px; margin-block: 28.8px 11.7px; }
  .engine-profile .decision-heading { font-size: 18.9px; }
  .case-bottom { padding-block: 40.185px; }
  .case-next-title { font-size: clamp(30.6px, 3.6vw, 48.6px); }
  .case-next-subtitle { font-size: 16px; }
}

@media screen and (min-width: 1241px) {
  .header { height: 68.4px; }
  .case-sidebar { top: 84px; }
}
@media screen and (min-width: 1101px) {
  .home #about.about { column-gap: clamp(28.8px, 3.6vw, 50.4px); }
  .home #about .about-copy { padding-top: 27px; }
}
@media screen and (min-width: 901px) and (max-width: 1100px) {
  .home .hero h1 { font-size: clamp(38.7px, 4.365vw, 46.8px); }
  .home #about.about { row-gap: 27px; }
  .home #about .about-copy { padding-top: 0; }
  .about-page .employment-record { padding: 28.8px; }
  .certificate-card { padding: 22.5px 21.6px 20.7px; }
  .case-page .case-hero[data-project] { padding: 20.7px 24.3px 23.4px; }
  .case-page .case-title h1 { font-size: clamp(36px, 5.8cqw, 51.3px); }
}