.logo-hero{height:calc(100svh - 82px);min-height:620px;background:#eadfce;color:#fff;position:relative;overflow:hidden;isolation:isolate}
.logo-hero:after{content:"";position:absolute;inset:auto 0 0;height:22%;background:linear-gradient(transparent,rgba(20,35,31,.44));pointer-events:none;z-index:1}
.logo-hero-inner{position:absolute;inset:0;overflow:hidden;animation:hero-arrive .8s ease-out both}
.logo-hero-inner img{position:absolute;left:0;top:-82px;width:100%;height:calc(100% + 82px);max-width:none;object-fit:cover;object-position:center top}
.scroll-cue{position:absolute;left:50%;bottom:27px;transform:translateX(-50%);display:flex;align-items:center;gap:13px;text-transform:uppercase;letter-spacing:.14em;font-size:.72rem;font-weight:800;color:#fff;text-shadow:0 1px 10px rgba(20,35,31,.7);z-index:2}
.scroll-cue i{width:34px;height:34px;border:1px solid rgba(255,255,255,.75);border-radius:50%;display:grid;place-items:center;font-size:1rem;font-style:normal;transition:.2s;background:rgba(11,75,63,.28);backdrop-filter:blur(6px)}
.scroll-cue:hover i{background:#0b4b3f;transform:translateY(3px)}
@keyframes hero-arrive{from{opacity:0;transform:scale(1.015)}to{opacity:1;transform:none}}
@media(max-width:1000px){.logo-hero-inner img{object-position:58% top}}
@media(max-width:700px){.logo-hero{height:calc(100svh - 70px);min-height:540px}.logo-hero-inner img{top:-58px;height:calc(100% + 58px);object-position:56% top}.scroll-cue{bottom:23px;white-space:nowrap}}
@media(prefers-reduced-motion:reduce){.logo-hero-inner{animation:none}}