/* Content remains scrollable on unusually small screens or with enlarged text. */
/* Compact laptop windows retain the complete page in the first viewport. */
body .page{min-height:100svh;display:flex;flex-direction:column}
body .header{padding-top:20px;padding-bottom:20px}
body .brand .wordmark{width:140px;height:28px}
body main{flex:1;display:flex;flex-direction:column}
body .hero{flex:1;min-height:0;width:100%;padding-top:24px;padding-bottom:38px}
body h1{font-size:clamp(58px,min(6.55vw,10.6svh),106px);margin-bottom:22px}
body .eyebrow{margin-bottom:22px}
body .supporting{margin-bottom:18px}
body .visual{width:min(100%,calc((100svh - 255px)*.833));justify-self:center;margin-top:0}
body .ticker{padding-top:15px;padding-bottom:15px}
body footer{padding-top:26px;padding-bottom:22px}
@media(max-width:1000px) and (min-width:651px){body h1{font-size:clamp(48px,min(7.5vw,10svh),82px)}body .hero{padding-top:20px;padding-bottom:30px}}
@media(max-width:650px){
  body .header{padding-top:16px;padding-bottom:12px}
  body .hero{padding-top:15px;padding-bottom:22px;gap:24px}
  body h1{font-size:clamp(44px,min(12vw,7.2svh),64px);margin-bottom:16px}
  body .eyebrow{margin-bottom:14px}
  body .intro{font-size:17px;line-height:1.4;margin-bottom:10px;max-width:none}
  body .supporting{font-size:14px;line-height:1.5;margin-bottom:10px;max-width:none}
  body .contact{font-size:14px;padding-bottom:8px}
  body .visual{width:89%;max-width:370px;margin:0 auto}
  body .photo-frame{aspect-ratio:auto;height:clamp(145px,22svh,220px);border-radius:55px 55px 14px 14px}
  body .hero-photo{object-position:50% 43%}
  body .sticker{width:98px;height:98px;right:-24px;top:-12px;font-size:11px}
  body .sticker-star{font-size:21px}
  body .photo-caption{bottom:16px;left:18px;right:18px;font-size:11px}
  body .photo-caption>span:first-child{font-size:18px}
  body .ticker{padding-top:10px;padding-bottom:10px}
  body .ticker-track{font-size:15px}
  body .asterisk{font-size:27px}
  body footer{padding-top:20px;padding-bottom:16px;gap:10px;flex-wrap:nowrap}
body .footer-brand{width:auto;font-size:10px}
}
@media(min-width:651px) and (max-height:800px){
  body .header{padding-top:14px;padding-bottom:14px}
  body .hero{padding-top:16px;padding-bottom:24px}
  body h1{font-size:clamp(44px,8.5svh,68px);margin-bottom:16px}
  body .eyebrow{margin-bottom:16px}
  body .intro{font-size:17px;line-height:1.4;margin-bottom:10px}
  body .supporting{font-size:14px;line-height:1.5;margin-bottom:12px}
  body .visual{width:min(100%,calc((100svh - 270px)*.833))}
  body footer{padding-top:16px;padding-bottom:16px}
}
