.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:.25rem;padding:.75rem 1.375rem;font-weight:600;font-size:clamp(1rem, 2vw, 1.25rem);letter-spacing:.03rem;width:max-content}.btn--primary{background:var(--color-accent);color:#fff;border:2px solid var(--color-accent);margin-top:1rem}.btn--primary:not(:hover){text-shadow:rgb(51,51,51) 0px 0px 5px}
.floating--hidden{opacity:0}
.hero{position:relative;width:100%;height:110vh;z-index:0;--hero-p:0} 
.hero .btn--primary{box-shadow:0 4px 10px rgba(0,0,0,0.3)}
.hero__inner{position:relative;width:100%;height:100vh}
.hero__slides{position:relative;top:0;height:100vh;overflow:visible}
.hero__slide{position:absolute;inset:0;width:100%;height:100%;min-height:100%;opacity:0;transform:translateX(-200%)}
.hero__slide--1{opacity:1;transform:translateX(0);animation:hero-fade-1 9s linear infinite}
.hero__slide--2{opacity:0;transform:translateX(-200%);animation:hero-fade-2 9s linear infinite}
@keyframes hero-fade-1{0%,40%{opacity:1;transform:translateX(0)}50%{opacity:0;transform:translateX(0)}50.01%,89.99%{opacity:0;transform:translateX(-200%)}90%{opacity:0;transform:translateX(0)}100%{opacity:1;transform:translateX(0)}}@keyframes hero-fade-2{0%,39.99%{opacity:0;transform:translateX(-200%)}40%{opacity:0;transform:translateX(0)}50%,90%{opacity:1;transform:translateX(0)}100%{opacity:0;transform:translateX(0)}}
.hero.is-manual .hero__slide{transition:opacity .8s ease;animation:none;opacity:0;pointer-events:none;transform:translateX(-200%)}
.hero.is-manual .hero__slide.is-active{opacity:1;transform:translateX(0);pointer-events:auto}
.hero__content{position:relative;z-index:2;height:100vh;display:flex;flex-direction:column;padding:0 var(--padding-horizontal)}
.hero__logo{width:clamp(8rem,40vw,12rem);color:#fff;z-index:2;display:flex;flex-direction:column;align-items:center;gap:1.2rem} 
.hero__logo-img use{width:100%;height:100%} 
.hero__logo-img:nth-child(1){width:65%;aspect-ratio:174.18/108.26}
.hero__logo-img:nth-child(2){width:100%;aspect-ratio:280.09/60.08}
.hero__text-container{display:flex;flex-direction:column;align-items:center;flex:1;gap:1rem;margin-top:3rem;text-align:center}
.hero__copy{width:100%;z-index:1;gap:1rem;display:flex;flex-direction:column;justify-content:space-between;align-items:center;padding:1.25rem 0 2rem 0;position:sticky;top:0}
.hero__headline{font-size:1.25rem;line-height:1.05;color:#fff;font-weight:600;text-shadow:rgb(51,51,51) 0px 0px 5px}
.hero__text{font-size:clamp(18px,1.92vw,1.8rem);line-height:1.2;color:#fff;font-weight:400;text-shadow:rgb(51,51,51) 0px 0px 5px}
.hero__text2{font-size:clamp(16px,1.46vw,1.4rem)}
.hero__media{position:absolute;inset:0;z-index:0;height: 110vh;}
.hero__picture{position:absolute;display:block;left:0;right:0;height:105vh}
.hero__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center bottom}
.hero__dots{position:fixed;top:88vh;left:0;right:auto;width:100dvw;z-index:2;display:block;text-align:center;font-size:0;visibility:hidden;opacity:0;pointer-events:none;transition:opacity .25s ease}
.hero__dots.dots--fixed{visibility:visible;opacity:1;pointer-events:auto}
.hero__dot{display:inline-block;width:1rem;height:1rem;margin:0 .625rem;padding:0;border-radius:999px;border:2px solid rgba(255,255,255,.75);background:transparent;cursor:pointer}
.hero__dot[aria-current="true"]{background:rgba(255,255,255,.75)}
.hero__dot:nth-child(1){animation:hero-dot-1 9s linear infinite}  
.hero__dot:nth-child(2){animation:hero-dot-2 9s linear infinite}  
@keyframes hero-dot-1{0%,40%{background:rgba(255,255,255,.75)}50%,90%{background:transparent}100%{background:rgba(255,255,255,.75)}}
@keyframes hero-dot-2{0%,40%{background:transparent}50%,90%{background:rgba(255,255,255,.75)}100%{background:transparent}}
.hero.is-manual .hero__dot{animation:none}
.hero__dot:focus-visible{outline:1px solid rgba(255,255,255,.75);outline-offset:3px}
/*parallax css <768*/
@media (max-width:767.98px){ 
.hero__media{overflow:hidden}  
@supports (animation-timeline:scroll()){
.hero__picture{animation:hero-parallax linear both;animation-timeline:scroll(root block);animation-range:0 100vh}
.hero__text-container{animation:hero-copy-parallax linear both;animation-timeline:scroll(root block);animation-range:0 75vh}}
@keyframes hero-parallax{from{transform:translate3d(0,0,0)}to{transform:translate3d(0,190px,0)}}
@keyframes hero-copy-parallax{from{transform:translate3d(0,0,0)}to{transform:translate3d(0,75px,0)}}
}
@media (min-width:520px){.hero__text2{max-width:37ch}}
@media (min-width:768px){
.hero{--hero-media-shift:350px;--hero-copy-shift:150px;height:140vh}   
.hero__content{justify-content:space-around}
.hero__text-container{display:grid;margin-top:0;flex:0;text-align:left;align-items:flex-start}
.hero__copy{width:46.9vw;height:100%;align-items:flex-start}
.hero__headline{font-size:clamp(1.8rem,2.13vw,2rem);font-weight:700}
.hero__text{font-size:clamp(22px,1.92vw,1.8rem)}
.hero__text2{font-size:clamp(18px,1.46vw,1.4rem);font-weight:500}
.hero__img1{object-position:center}
.hero__img2{object-position:left center}
.hero__logo-container{flex:1}
.hero__logo{width:12.5rem;height:10rem;position:sticky;top:1rem}
.hero__media,.hero__picture{height:150vh}
.hero__dots{top:92vh}
/*parallax JS >768*/
.hero__slides{transform:translateZ(0)}
.hero__slide,.hero__picture,.hero__text-container{will-change:transform;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.hero__picture,.hero__text-container{transition:transform 60ms ease-out}
.hero__picture{top:-10vh;bottom:-10vh;transform:translate3d(0,calc(var(--hero-media-shift)*var(--hero-p)),0)}
.hero__text-container{transform:translate3d(0,calc(var(--hero-copy-shift)*var(--hero-p)),0)} 
/*solo tx 200%*/
.hero__text-container{display:grid;margin-top:0;flex:0;text-align:left;align-items:flex-start;gap:16px}
.hero__copy{width:46.9vw;height:100%;align-items:flex-start;gap:16px;padding:20px 0 32px}
.hero__logo{width:200px;height:160px;position:sticky;top:16px}
.hero__cta{padding:12px 22px;margin-top:16px}
}
@media (min-width:1024px){.hero__img1,.hero__img2{object-position:center}}
@media (max-height:580px) and (max-width:767.98px){.hero__dots{top:50%;left:auto;right:0;width:auto;padding-right:1rem;display:flex;text-align:left;transform:translateY(-50%);flex-direction:column;gap:1.5rem}.hero__img2{object-position:center 80%}.hero{height:140vh}}