/* Mobile refinement. The approved desktop layout remains in style.css. */
@media(max-width:760px){
  html{scroll-padding-top:24px}
  .header{height:74px;padding-left:max(22px,env(safe-area-inset-left));padding-right:max(22px,env(safe-area-inset-right))}
  .hero{height:100svh;min-height:620px;max-height:1000px}
  .hero-content{left:24px;right:79px;bottom:calc(116px + env(safe-area-inset-bottom));max-width:420px}
  .hero h1{font-size:clamp(30px,8.1vw,39px);line-height:1.12;letter-spacing:-.02em;text-wrap:balance}
  .hero .eyebrow{max-width:270px;font-size:8px;line-height:1.65;letter-spacing:1.25px;margin-bottom:15px}
  .hero-description{font-size:12px;line-height:1.75;margin-top:16px}
  .hero-content>.outline-button{min-height:46px;min-width:174px;margin-top:21px;font-size:12px}
  .hero-media:after{background:linear-gradient(180deg,rgba(12,30,22,.51),transparent 27%,rgba(12,30,22,.05) 43%,rgba(12,30,22,.78) 92%)}
  .hero-poster{object-position:center center}
  .hero-bottom{left:22px;right:78px;bottom:calc(29px + env(safe-area-inset-bottom));gap:18px}
  .video-toggle{min-width:44px;min-height:44px;justify-content:center}
  .video-symbol{width:34px;height:34px}
  .scroll-cue{min-height:44px;font-size:10px;gap:14px}
  .header nav{top:74px;max-height:calc(100svh - 74px);overflow-y:auto;overscroll-behavior:contain;padding:14px 24px 28px}
  .header nav>a{display:flex;align-items:center;min-height:52px;font-size:14px;border-bottom:1px solid #dde3d6;padding:15px 0}
  .header nav>.nav-visit{min-height:46px;margin-top:19px;padding:12px 17px}
  .section,.visit-inner{padding-left:24px;padding-right:24px}
  .introduction{padding-top:49px}
  .intro-body h2,.moment-copy h2,.section-heading h2,.world h2{font-size:clamp(31px,8.2vw,37px);line-height:1.16;text-wrap:balance}
  .intro-description p,.moment-copy p:not(.eyebrow),.world-copy>p{font-size:14px;line-height:1.85}
  .section-heading>p{font-size:13px}
  .section-label,.moment-copy .eyebrow{font-size:9px;letter-spacing:1.2px}
  .moment-photo img{height:auto;aspect-ratio:1.15;object-fit:cover}
  .moment-photo figcaption{gap:9px;line-height:1.6}
  .text-link{min-height:44px;padding-top:10px;padding-bottom:9px;font-size:12px;max-width:100%}
  .text-link>span{flex-shrink:0}
  .age-grid{gap:29px 22px}
  .age p{font-size:13px;line-height:1.8}
  .age h3{font-size:15px;line-height:1.5}
  .age-top span:last-child{font-size:8px}
  .campus figure>img{min-height:0;max-height:none;height:auto;aspect-ratio:1.6;object-fit:cover}
  .campus figcaption>span{font-size:8px;line-height:1.7;letter-spacing:.75px}
  .campus .text-link,.learning>.text-link{font-size:12px}
  .visit h2{font-size:37px;text-wrap:balance}
  .visit p:not(.section-label){font-size:14px}
  .visit .outline-button{min-height:46px;font-size:12px}
  .contact{padding-right:41px}
  .contact>p{font-size:13px!important;line-height:1.85!important}
  .contact .phone{min-height:44px;display:flex;align-items:center;font-size:21px}
  .contact .text-link{font-size:12px}
  .social-dock{right:max(13px,env(safe-area-inset-right));bottom:calc(112px + env(safe-area-inset-bottom));gap:10px}
  .social-circle{width:44px;height:44px}
  .social-circle svg{width:27px;height:27px}
  .social-circle.facebook svg{width:25px;height:25px}
  .tooltip{display:none}
  .footer{padding-left:24px;padding-right:24px;padding-bottom:calc(83px + env(safe-area-inset-bottom))}
  .footer-social{gap:4px 22px}
  .footer-social>a{min-height:44px;display:inline-flex;align-items:center;font-size:11px}
  .footer-bottom{font-size:9px;line-height:1.7}
  .footer-bottom>a{min-height:44px}
}
@media(max-width:430px){
  .age-grid{grid-template-columns:1fr;gap:24px}
  .age{display:grid;grid-template-columns:57px 1fr;column-gap:17px;padding-top:18px}
  .age-top{grid-column:1;grid-row:1/3;display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start;gap:8px}
  .age-top span:first-child{font-size:27px}
  .age h3{grid-column:2;grid-row:1;margin:0 0 8px;font-size:15px}
  .age p{grid-column:2;grid-row:2;margin:0;font-size:13px}
}
@media(max-width:360px){
  .hero-content{left:22px;right:72px}
  .hero h1{font-size:29px}
  .hero-description{font-size:11px}
  .hero .eyebrow{font-size:7px;letter-spacing:1px}
  .contact .phone{font-size:19px}
}
@media(max-width:760px) and (max-height:680px){
  .hero{min-height:590px}
  .hero-content{bottom:97px}
  .hero h1{font-size:30px}
  .hero .eyebrow{margin-bottom:11px}
  .hero-description{margin-top:12px}
  .hero-content>.outline-button{margin-top:16px}
  .hero-bottom{bottom:18px}
}
