/* Homepage refinement: one visual system for both dual-image sections. */
.mass-paging-managed :is(#business,#learning-experiences) .split-heading h2{
  font-size:clamp(28px,3vw,38px);line-height:1.35;
}
.mass-paging-managed :is(#business,#learning-experiences) .split-copy h3{
  font-size:clamp(30px,3.2vw,48px);line-height:1.22;white-space:normal;
}
.mass-paging-managed :is(#business,#learning-experiences) .split-copy .eyebrow{
  font-size:clamp(9px,.9vw,12px);letter-spacing:.16em;
}
.mass-paging-managed :is(#business,#learning-experiences) .split-copy a:focus-visible{
  outline:3px solid #f3d4a2;outline-offset:5px;
}
#why-mass .design-feature-photo figcaption>span{color:#825b42!important}

@media(min-width:761px){
  html[lang=en] :is(#business,#learning-experiences) .split-copy h3{min-height:2.44em}
  .mass-paging-managed :is(#business,#learning-experiences) .split-copy p{min-height:3.8em}
}

/* Keep useful controls in view on a short laptop display, without hiding copy. */
@media(min-width:1101px) and (max-height:760px){
  .mass-page-mode #main>#welcome{padding-block:112px 88px!important}
  .mass-page-mode #main>#welcome>.container{padding-bottom:0!important}
  .mass-page-mode #welcome .scroll-cue{bottom:22px;gap:4px;font-size:11px;line-height:1.4}
  .mass-page-mode #welcome .scroll-cue span{line-height:1}
  .mass-page-mode #welcome h1{font-size:clamp(38px,7svh,52px);line-height:1.12;margin:12px 0 14px}
  .mass-page-mode #welcome>.container>p:not(.visitor-hero-note){font-size:15px;line-height:1.65;margin:12px 0 16px}
  .mass-page-mode #welcome .actions{margin-top:14px}
  .mass-page-mode #welcome .actions .btn{min-height:46px;padding:12px 20px;box-sizing:border-box}
  .mass-page-mode #welcome .human-quick{margin-top:14px}
  .mass-page-mode #welcome .human-quick a{padding:9px 14px;min-height:44px;box-sizing:border-box}
  .mass-page-mode #welcome .visitor-hero-note{margin:8px 0 0;font-size:12px;line-height:1.5}
  .mass-page-mode #main>#projects .card-image{height:clamp(80px,14svh,108px)!important}
  .mass-page-mode #main>#projects .heading{margin-bottom:6px;max-width:none}
  .mass-page-mode #main>#projects .heading .eyebrow{font-size:10px;margin-bottom:6px}
  .mass-page-mode #main>#projects .heading h2{font-size:28px;line-height:1.3;margin:0 0 6px}
  .mass-page-mode #main>#projects .heading p{font-size:14px;line-height:1.55;margin:6px 0 0;max-width:none}
  .mass-page-mode #main>#projects .tabs{margin-block:6px 8px}
  .mass-page-mode #projects .tab{min-height:40px;padding:8px 16px}
  .mass-page-mode #projects .card-body{padding:12px 16px}
  .mass-page-mode #projects .card-body h3{font-size:20px;line-height:1.3;margin:0 0 6px}
  .mass-page-mode #projects .card-body p{font-size:14px;line-height:1.55;margin:0 0 8px}
  .mass-page-mode #projects .card-body .text-link{font-size:14px;margin-top:4px;min-height:40px;display:inline-flex;align-items:center}
  .mass-page-mode #projects .human-other-paths{margin-top:6px;gap:8px}
  .mass-page-mode #projects .human-other-paths a{padding:8px 12px;font-size:13px;min-height:40px;box-sizing:border-box}
  .mass-page-mode #why-mass .design-feature-photo>img{height:clamp(180px,37svh,280px)!important;aspect-ratio:auto!important;object-fit:contain!important;background:#f4efeb}
  .mass-page-mode #why-mass .design-feature-photo figcaption{padding:16px 20px}
  .mass-page-mode #why-mass .design-feature-photo h2{font-size:23px}
  .mass-page-mode #why-mass .design-principles>h2{font-size:30px;line-height:1.3}
  .mass-page-mode #why-mass .design-principles>p{font-size:14px;line-height:1.6;margin-block:10px}
  .mass-page-mode #main>#why-mass details{padding:8px 8px}
  .mass-page-mode #why-mass summary{font-size:18px;min-height:38px}
  .mass-page-mode #why-mass details p{font-size:14px;line-height:1.65}
}

/* Phone photographs keep their full composition; text no longer covers faces. */
@media(max-width:760px){
  .mass-paging-managed :is(#business,#learning-experiences) .split-half{
    display:flex;flex-direction:column;min-height:0;border:1px solid #e8dde1;
    background:#4b2030;border-radius:18px;overflow:hidden;
  }
  .mass-paging-managed :is(#business,#learning-experiences) .split-in{background:#193344}
  .mass-paging-managed :is(#business,#learning-experiences) .split-photo{
    position:relative;inset:auto;display:block;width:100%;height:auto!important;
    aspect-ratio:var(--home-photo-ratio,2);object-fit:contain;object-position:center;
    max-height:none;flex-shrink:0;transform:none!important;background:#f1e9e6;
  }
  #business .split-out .split-photo{--home-photo-ratio:1600/681}
  .mass-paging-managed #business .split-in .split-photo{height:220px!important;aspect-ratio:auto;object-fit:cover;object-position:center 36%}
  #learning-experiences .split-photo{--home-photo-ratio:1983/793}
  .mass-paging-managed :is(#business,#learning-experiences) .split-shade{display:none}
  .mass-paging-managed :is(#business,#learning-experiences) .split-half .split-copy{
    position:relative;inset:auto!important;width:auto!important;min-width:0;
    padding:24px 22px 26px;opacity:1!important;
  }
  .mass-paging-managed :is(#business,#learning-experiences) .split-copy:before{display:none}
  .mass-paging-managed :is(#business,#learning-experiences) .split-copy h3{
    min-height:0;font-size:30px;line-height:1.25;margin:12px 0 14px;
  }
  .mass-paging-managed :is(#business,#learning-experiences) .split-copy .eyebrow{font-size:10px}
  .mass-paging-managed :is(#business,#learning-experiences) .split-copy p{
    min-height:0;font-size:15px;line-height:1.8;margin:0;
  }
  .mass-paging-managed :is(#business,#learning-experiences) .split-tags{margin:16px 0;font-size:12px;line-height:1.8}
  .mass-paging-managed :is(#business,#learning-experiences) .split-copy .btn{min-height:46px;box-sizing:border-box;font-size:14px;line-height:1.6}
  .mass-paging-managed :is(#business,#learning-experiences) .split-heading p{max-width:32em;margin-inline:auto}
  .mass-free-mode #main>:is(#business,#learning-experiences){padding-block:40px!important}
}

@media(prefers-reduced-motion:reduce){
  #main>.home-screen .split-photo,#main>.home-screen .split-shade,#main>.home-screen .split-copy,
  #main>.home-screen .card,#main>.home-screen .card img,#main>.home-screen .hero-slide,
  #main>.home-screen .human-quick a,#main>.home-screen .human-guide-card{
    transition:none!important;animation:none!important;
  }
  #main>.home-screen .card:hover,#main>.home-screen .human-quick a:hover{transform:none!important}
}