/* A full canvas, with quiet typography and a restoration revealed by touch. */
html:root body .hero{
  isolation:isolate;display:flex!important;align-items:center;position:relative;
  max-width:none!important;width:100%;min-height:100svh!important;
  padding:130px 7vw 110px!important;margin:0!important;overflow:hidden!important;
  background:#111410!important;
}
html:root body .hero:after{
  content:'';position:absolute;inset:0!important;width:auto!important;height:auto!important;
  border:0!important;border-radius:0!important;transform:none!important;z-index:1;
  background:linear-gradient(90deg,#111410fa 0%,#111410e8 22%,#111410a6 43%,#11141020 68%,#11141018 100%),linear-gradient(0deg,#111410 0%,#111410c9 8%,transparent 35%,#11141044 100%);
  pointer-events:none;
}
html:root body .hero-art{
  position:absolute!important;inset:0!important;width:100%!important;height:100%!important;
  max-width:none!important;min-height:0!important;aspect-ratio:auto!important;margin:0!important;
  border:0!important;border-radius:0!important;outline:0!important;box-shadow:none!important;
  z-index:0!important;opacity:1!important;transform:none!important;background:#111410!important;
}
html:root body .hero-art:before,html:root body .hero-art:after{display:none!important}
html:root body .hero-art img{
  inset:0!important;width:100%!important;height:100%!important;object-fit:cover!important;
  object-position:67% 44%!important;transform:none!important;transition:none!important;
}
html:root body .hero-art .hero-before{filter:saturate(.55) brightness(.72)!important}
html:root body .hero-art .hero-restored{filter:saturate(.88) brightness(.94)!important}
html:root body .hero-art.immersive-restoration .hero-restored{
  opacity:1!important;clip-path:none!important;
  mask-image:radial-gradient(circle at var(--restore-x,65%) var(--restore-y,45%),#000 0,#000 var(--restore-radius,180px),transparent calc(var(--restore-radius,180px) + 70px))!important;
  -webkit-mask-image:radial-gradient(circle at var(--restore-x,65%) var(--restore-y,45%),#000 0,#000 var(--restore-radius,180px),transparent calc(var(--restore-radius,180px) + 70px))!important;
}
html:root body .hero-art.restoration-static .hero-restored{mask-image:none!important;-webkit-mask-image:none!important}
html:root body .hero .hero-reveal-ring,html:root body .hero .temporary,html:root body .hero .slavic-script{display:none!important}
html:root body .hero-copy{position:relative!important;z-index:3!important;max-width:650px!important;width:49%!important;align-self:center!important;transform:none!important}
html:root body .hero .eyebrow{color:#cda56a!important;font-size:11px!important;letter-spacing:.16em!important;line-height:1.7!important;max-width:43ch!important}
html:root body .hero h1{font-size:clamp(20px,2vw,29px)!important;line-height:1.25!important;color:#c1c3b6!important;margin:25px 0!important;text-wrap:balance!important}
html:root body .hero h1 em{
  font-family:ArtDisplay,Georgia,serif!important;font-weight:400!important;font-style:normal!important;
  font-size:clamp(52px,6.4vw,96px)!important;line-height:.99!important;letter-spacing:-.035em!important;
  color:#f1eddf!important;max-width:12ch!important;margin-top:20px!important;text-wrap:balance!important;
}
html:root body .hero .intro{color:#c6c8bc!important;font-size:16px!important;line-height:1.7!important;max-width:40ch!important;margin:28px 0!important;text-wrap:pretty!important}
html:root body .hero .hero-assessment{border-radius:8px!important;padding:17px 23px!important;font-size:14px!important;margin:0 18px 14px 0!important;min-height:52px;box-shadow:0 8px 35px #0002}
html:root body .hero .arrow-link{font-size:10px!important;width:185px!important;padding:16px 0!important;margin:0!important;letter-spacing:.08em!important;color:#e9e5d8!important}
html:root body .hero .scroll-mark{z-index:3;left:7vw!important;bottom:42px!important;color:#c6c8bc!important;font-size:10px!important}
html:root body .topbar{z-index:6;background:linear-gradient(180deg,#111410b3,transparent)!important;border-color:#f1eddf1c!important}
html:root body .works{position:relative;padding-top:65px!important}
@media(min-width:1500px){html:root body .hero-copy{max-width:740px!important}html:root body .hero h1 em{font-size:104px!important}}
@media(max-width:1050px){html:root body .hero-copy{width:60%!important}html:root body .hero{padding-top:145px!important}html:root body .hero h1 em{font-size:clamp(56px,7.5vw,78px)!important}}
@media(max-width:700px){
 html:root body .hero{min-height:100svh!important;padding:145px 6vw 90px!important;align-items:center!important}
 html:root body .hero-copy{width:100%!important;max-width:480px!important}
 html:root body .hero:after{background:linear-gradient(90deg,#111410e3,#11141088),linear-gradient(0deg,#111410 0%,transparent 65%)}
 html:root body .hero-art img{object-position:58% 43%!important}
 html:root body .hero .eyebrow{font-size:10px!important;max-width:30ch!important}
 html:root body .hero h1{font-size:21px!important;margin-top:22px!important}
 html:root body .hero h1 em{font-size:clamp(50px,13vw,72px)!important;max-width:13ch!important;line-height:1.03!important}
 html:root body .hero .intro{font-size:14px!important;max-width:35ch!important;margin:23px 0!important}
 html:root body .hero .hero-assessment{width:auto!important;padding:16px 20px!important;font-size:13px!important}
 html:root body .hero .arrow-link{width:160px!important;font-size:9px!important}
}
@media(max-height:650px) and (min-width:701px){html:root body .hero{min-height:650px!important;padding-top:120px!important}html:root body .hero h1 em{font-size:66px!important}}
@media(prefers-reduced-motion:reduce){html:root body .hero-copy{opacity:1!important}}
/* The navigation overlays the first canvas rather than adding a second viewport. */
html:root body .topbar{position:absolute!important;inset:0 0 auto!important;width:100%;height:auto!important;min-height:84px;backdrop-filter:none!important}

@media(min-width:701px){html:root body .hero h1 em{max-width:100%!important;font-size:clamp(52px,5.6vw,84px)!important}}
