.homepage-hero-container{min-height: calc(100vh - 60px);padding: 80px 0 0;}
.homepage-hero-bg{width: 100%;height: 100%;position: absolute;top: 0;right: 0;bottom: 0;left: 0;z-index: 0;}
.homepage-hero-bg iframe{height: 120%;width: 120%;position: absolute; object-fit: cover;background: #000;aspect-ratio: auto;top: -10%;bottom: -10%;left: -10%;right: -10%;}
.homepage-hero-logo{width: 100%;opacity: 0.4;}
.hh-content-wrapper{margin-top: 80px;}
.hh-right-box{width: 100vw;height: 100%;position: absolute;bottom: 0;}
.hh-content{width: 100%; background: transparent !important;}
.hh-content-text{font-size: 20px;font-weight: 600;}
.hh-content-text h1{font-size: 72px;font-weight: 700;line-height: 0.85;letter-spacing: -0.01em;margin-bottom: 0;}
.hh-content-text h1:has(+ p){margin-bottom: 10px;}
.hh-btn-group{margin-top: 30px;}

.hh-scroll-down{width: 54px;height: 54px;position: absolute;bottom: 135px;border: 4px solid var(--kal-white);border-radius: 50%;}
.hh-scroll-icon{width: 18px;}

.left-content .hh-right-box{right: 0;}
.left-content .hh-scroll-down{right: calc(8.33% + 13px);}
.right-content .hh-right-box{left: 0;}
.right-content .hh-scroll-down{left: calc(8.33% + 13px);}

@media (min-width:1400px){
.left-content .hh-content{padding: 90px 15% 135px 0;}
.right-content .hh-content{padding: 90px 0 135px 15%;}
}

/* ========================================== 
! Large devices (desktops, less than 1400px)
=========================================== */
@media (max-width:1399.98px){
    .hh-content{padding: 60px 40px 110px;}
    .hh-content-text{font-size: 18px;}
    .hh-content-text h1{font-size: 50px; line-height: 1;}
	.hh-scroll-down{bottom: 110px;}
}

/* ========================================== 
! Large devices (desktops, less than 1200px)
=========================================== */
@media (max-width:1199.98px){
	.homepage-hero-container{min-height: auto;padding: 70px 0 0;}
    .hh-content-wrapper{width: calc(100% + 30px);margin-top: 70px;}
    .hh-content{padding: 60px 30px 110px;}
    .hh-content-text h1{font-size: 45px;}
    .hh-btn-group{margin-top: 30px;}

    .right-content .hh-content-wrapper{margin-left: -15px;}
    .right-content .hh-content{padding-left: 50px;}
}

/*==========================================
! Medium devices (tablets, less than 992px)
========================================== */
@media (max-width:991.98px){
	.homepage-hero-container{padding: 50px 0 0;}
	.hh-content-wrapper{margin-top: 50px;}
    .hh-content{max-width: 350px;margin-left: auto;padding: 45px 15px 100px;}
    .hh-content-text h1{font-size: 35px;}

    .right-content .hh-content-wrapper{margin-left: -30px};
}

/* =================================================  
! Small devices (landscape phones, less than 768px)
================================================= */
@media (max-width:767.98px){
    .homepage-hero-container{padding: 0;}
    .homepage-hero-bg{bottom: auto;min-height: 425px;position: relative;display: flex;flex-grow: 1;}
    .homepage-hero-bg img{position: absolute;top: 0;left: 0;right: 0;bottom: 0;}
    .homepage-hero-bg.has-video{min-height: auto;}
    .homepage-hero-bg.has-video iframe{position:relative; inset: auto;    aspect-ratio: 16 / 9;}
    .homepage-hero-logo-wrapper{position: absolute;top: 50px;left: 0;right: 0;}
    .hh-content-wrapper{width: calc(100% + 30px);margin-top: 0;margin-left: -15px;}
    .hh-content, .right-content .hh-content{max-width: 100%;padding: 45px 15px 50px;}
    .hh-content-text h1{font-size: 40px;}

    .right-content .hh-content-wrapper{margin-left: -15px};
}

/* ======================================================
! Extra small devices (portrait phones, less than 576px)
====================================================== */
@media (max-width:575.98px){}

/* ======================================================
! Extra small devices (portrait phones, less than 370px)
====================================================== */
@media (max-width:369.98px){}