.home-banner{position:relative;isolation:isolate;width:100%;height:clamp(440px,68svh,540px);overflow:hidden;margin:0}
.home-banner picture{display:block;width:100%;height:100%}
.home-banner img{display:block;width:100%;height:100%;object-fit:cover;object-position:35% 50%}
.home-banner-message{position:absolute;z-index:1;left:16px;right:16px;bottom:16px;padding:20px;border-radius:14px;background:rgba(55,89,0,.94);color:#fff}
.home-banner-message h1{margin:0;color:inherit;font-family:inherit;font-size:clamp(23px,6.2vw,29px);font-weight:700;line-height:1.16;letter-spacing:-.02em;text-wrap:pretty}
@keyframes banner-settle{from{transform:scale(1.04)}to{transform:scale(1)}}
@keyframes banner-reveal{from{opacity:0;transform:scale(1.025)}to{opacity:1;transform:scale(1)}}
@keyframes banner-message-in{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
@keyframes banner-message-in-desktop{from{opacity:0;transform:translateY(calc(-50% + 16px))}to{opacity:1;transform:translateY(-50%)}}
@media(min-width:701px){
 .home-banner{height:auto;aspect-ratio:3/1}
 .home-banner picture{position:absolute;inset:0}
 .home-banner img{object-fit:cover;object-position:center}
 .home-banner-message{left:auto;right:4%;bottom:auto;top:50%;transform:translateY(-50%);width:35%;max-width:500px;padding:28px;border-radius:16px}
 .home-banner-message h1{font-size:clamp(25px,2.65vw,40px);line-height:1.13;text-wrap:balance}
}
@media(min-width:701px) and (max-width:1000px){
 .home-banner{aspect-ratio:auto;height:340px}
 .home-banner img{object-position:left center}
 .home-banner-message{right:3%;width:39%;padding:20px}
 .home-banner-message h1{font-size:clamp(23px,2.8vw,28px)}
}
@media(max-width:700px) and (prefers-reduced-motion:no-preference){
 .home-banner img{animation:banner-settle 6s ease-out both}
 .home-banner-message{animation:banner-message-in .75s .18s cubic-bezier(.22,1,.36,1) both}
}
@media(min-width:701px) and (prefers-reduced-motion:no-preference){
 .home-banner img{animation:banner-reveal 1.1s cubic-bezier(.22,1,.36,1) both}
 .home-banner-message{animation:banner-message-in-desktop .85s .22s cubic-bezier(.22,1,.36,1) both}
}
