/* Reference-matched landing page composition. */
.home-hero{height:100svh;min-height:560px}
.home-hero .hero-copy{padding:110px 40px;transform:translateY(-38px)}
.home-hero .home-title{max-width:1280px;margin:0 auto 14px;font-weight:300}
.home-hero .home-title span{font-family:Georgia,"Times New Roman",serif;font-size:clamp(34px,4.35vw,64px);font-weight:400;line-height:1.22;letter-spacing:-1.2px}
.home-hero .hero-subtitle{margin-top:24px;font-size:15px;font-weight:400;letter-spacing:2px}
.home-hero .hero-subtitle a{display:inline-block;color:white;text-decoration:none;text-underline-offset:7px;text-decoration-thickness:1px}
.home-hero .hero-subtitle a:hover{text-decoration:underline}
.home-hero .hero-photo{object-position:50% 53%;filter:saturate(.85) contrast(1.06)}
.home-hero:before{
  background:
    radial-gradient(ellipse at 5% 2%,rgba(12,50,57,.42),transparent 47%),
    radial-gradient(ellipse at 97% 96%,rgba(0,8,10,.5),transparent 44%),
    radial-gradient(ellipse at 50% 43%,transparent 24%,rgba(4,18,25,.08) 48%,rgba(1,9,14,.32) 74%,rgba(0,5,9,.62) 100%),
    linear-gradient(180deg,rgba(14,30,42,.15),rgba(7,22,33,.37) 48%,rgba(3,14,22,.26));
}
.home-header .navigation{gap:22px}
.home-header .navigation>a{font-size:12px;letter-spacing:1.8px}
@media(min-width:1700px){.home-hero .home-title span{font-size:72px}}
@media(max-width:760px){
  .home-hero{min-height:520px}
  .home-hero .hero-copy{padding:110px 22px;transform:translateY(-22px)}
  .home-hero .home-title{max-width:560px;margin-bottom:20px}
  .home-hero .home-title span{font-size:clamp(29px,5.5vw,41px);line-height:1.25;letter-spacing:-.6px}
  .home-hero .home-title span+span{margin-top:8px}
  .home-hero .hero-subtitle{font-size:14px;line-height:1.7;letter-spacing:.6px;max-width:300px}
  .home-header .navigation{gap:0}
  .home-header .navigation>a{font-size:14px;letter-spacing:2px}
}
@media(max-height:520px) and (min-width:761px){
  .home-hero{min-height:420px}
  .home-hero .hero-copy{transform:translateY(10px)}
  .home-hero .home-title span{font-size:40px}
}

/* The same centered text backdrop, layered with the landing vignette. */
.home-hero:before{background:radial-gradient(ellipse at 50% 45%,rgba(6,12,16,.57) 0%,rgba(6,12,16,.3) 42%,transparent 78%),radial-gradient(ellipse at 5% 2%,rgba(12,50,57,.42),transparent 47%),radial-gradient(ellipse at 97% 96%,rgba(0,8,10,.5),transparent 44%),radial-gradient(ellipse at 50% 43%,transparent 24%,rgba(4,18,25,.08) 48%,rgba(1,9,14,.32) 74%,rgba(0,5,9,.62) 100%),linear-gradient(180deg,rgba(14,30,42,.15),rgba(7,22,33,.18) 48%,rgba(3,14,22,.26))}
.home-hero h1,.home-hero .hero-subtitle{color:#fff;text-shadow:0 2px 16px rgba(0,0,0,.4)}

/* Landing screen stays within the viewport and does not rubber-band. */
html.home-document,html.home-document body{height:100%;overflow:hidden;overscroll-behavior:none}
.home-document .home-hero{height:100dvh;min-height:0;overflow:hidden}
@media(max-height:480px){.home-document .hero-copy{padding:70px 20px 30px;transform:none}.home-document .home-title span{font-size:clamp(23px,4vw,40px)}.home-document .hero-subtitle{margin-top:15px;font-size:12px}}

/* Selected Alma Mater close-up: preserve the statue across screen sizes. */
.home-hero .hero-photo{object-position:50% 50%}

/* iPhone safe areas and browser chrome inherit a dark page surface. */
html.home-document{background:#122b3b;color-scheme:dark}
html.home-document body{background:#122b3b var(--home-photo) center/cover no-repeat fixed}
.home-document .home-hero{width:100%;height:100vh;height:100dvh}
.home-document .home-header{padding-top:max(22px,env(safe-area-inset-top));padding-right:max(22px,env(safe-area-inset-right));padding-left:max(22px,env(safe-area-inset-left))}
@media(max-width:760px){.home-document .hero-copy{padding-left:max(22px,env(safe-area-inset-left));padding-right:max(22px,env(safe-area-inset-right))}}

/* Match the Alma Mater sky rather than introducing a navy border. */
html.home-document{background:#4a6069}
html.home-document body{background-color:#4a6069;background-image:radial-gradient(ellipse at 50% 45%,rgba(6,12,16,.57),rgba(6,12,16,.3) 42%,transparent 78%),linear-gradient(rgba(14,30,42,.2),rgba(3,14,22,.3)),var(--home-photo);background-position:center;background-size:cover;background-repeat:no-repeat}

html.home-document{--home-photo:url('/assets/alma-mater-2000.webp')}
@media(max-width:760px){html.home-document{--home-photo:url('/assets/alma-mater-1200.webp')}}