:root{--header-h:80px;--hero-offset:12vh;--vh:100vh;}
@supports (height: 100dvh) {
:root{--vh:100dvh;}
} .hero-banner{position:relative;display:grid;grid-template-columns:1fr 1fr;align-items:center;height:calc(var(--vh) - var(--header-h) - var(--hero-offset));padding:0 clamp(4vw, 7vw, 8vw);overflow:hidden;color:#fff;}
.hero-banner::after{content:"";position:absolute;inset:0;background:linear-gradient(to top, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.3) 20%, rgba(0, 0, 0, 0.15) 40%, rgba(0, 0, 0, 0.05) 60%, rgba(0, 0, 0, 0) 80%);z-index:1;pointer-events:none;}
.hero-bg{position:absolute;inset:0;z-index:0;}
.hero-bg-img{width:100%;height:100%;object-fit:cover;object-position:center top;transition:opacity 1s ease;}
.hero-bg.hidden .hero-bg-img{opacity:0;}
.hero-inner{position:relative;z-index:2;margin-left:7vw;}
.hero-inner h1{font-size:clamp(3rem, 4.5vw + 1rem, 5.5rem);font-weight:700;line-height:1.05;margin:0 0 1.25rem;color:#fff !important;text-shadow:0 2px 6px rgba(0,0,0,.55);}
.hero-inner p{font-size:clamp(1.2rem, 1.1vw + .4rem, 1.5rem);max-width:600px;line-height:1.35;margin:0 0 1.75rem;text-shadow:0 1px 4px rgba(0, 0, 0, 0.9);}
.btn-main{display:inline-block;padding:1rem 2.25rem;font-size:1.05rem;font-weight:600;background:transparent;border:3px solid #fff;border-radius:.8rem;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.85);cursor:pointer;text-decoration:none;transition:background .25s ease, color .25s ease;}
.btn-main::after{content:"→";display:inline-block;margin-left:.55rem;transition:transform .25s ease;}
.btn-main:hover{background:#fff;color:#000;text-shadow:none;}
.btn-main:hover::after{transform:translateX(.25rem);}
@media(max-width:768px){
.hero-banner {
grid-template-columns: 1fr;
height: 60vh;
}
.hero-inner {
margin: 17vh 0 0;
margin-left: 0;
}
.btn-main, .btn-main:hover {
border: 2px solid #fff;
}
}