/* Fit the desktop composition to the available browser height, reserving the eye row. */
@media (min-width:1201px){
  .hero{min-height:calc(100svh - 24px)}
  body[data-layout=dawn] .presentation{padding-top:64px;padding-bottom:24px}
  body[data-layout=dawn] .logo-stage{height:clamp(120px,calc(100svh - 506px),360px)}
  .brand-promise{padding-block:22px}
  .brand-promise:first-child{padding-top:0}
  .brand-promise:last-child{padding-bottom:0}
}
@media (min-width:1800px){
  body[data-layout=dawn] .logo-stage{height:clamp(120px,calc(100svh - 506px),430px)}
}
@media (min-width:1201px) and (max-height:700px){
  .hero{min-height:100svh}
  body[data-layout=dawn] .presentation{padding-top:66px;padding-bottom:14px}
  body[data-layout=dawn] .logo-stage{height:clamp(80px,calc(100svh - 480px),220px)}
  .logo-composition .directions,.logo-composition .hero-statement{margin-top:20px}
  .brand-promises{align-self:start}
  .brand-promise{padding-block:8px}
  .brand-promise:first-child{padding-top:0}
  .brand-promise:last-child{padding-bottom:0}
}
@media (min-width:1201px) and (max-height:620px){
  .brand-promise{padding-block:0}
  .brand-promise h2{line-height:1.3}
}
body[data-scene=dawn] .about p,
body[data-scene=dawn] .about address,
body[data-scene=dawn] .about .footer-line{color:#203449}
body[data-scene=dawn] .about a{color:#002554}
body[data-scene=dawn] .about a:hover{color:#004b7e}
@media(forced-colors:active){
  body[data-scene=dawn] .about p,
  body[data-scene=dawn] .about address,
  body[data-scene=dawn] .about .footer-line{color:CanvasText}
  body[data-scene=dawn] .about a{color:LinkText}
}