html body .hero{
  position:relative!important;
  height:min(92vh,760px)!important;
  min-height:560px!important;
  overflow:hidden!important;
  background:#000!important;
  display:block!important;
  align-items:stretch!important
}
html body .hero:after{display:none!important}
html body .hero-media{
  position:absolute!important;
  inset:0!important;
  overflow:hidden!important;
  display:block!important;
  width:100%!important;
  height:100%!important
}
html body .hero-media img,
html body .hero img{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center!important;
  display:block!important;
  transform-origin:center center!important;
  animation:kddKen 10s ease-in-out infinite alternate!important
}
html body .hero-copy{
  position:absolute!important;
  inset:0!important;
  z-index:3!important;
  max-width:none!important;
  width:100%!important;
  padding:0!important;
  margin:0!important;
  pointer-events:none!important;
  text-align:center!important
}
html body .eyebrow{
  position:absolute!important;
  z-index:3!important;
  top:72px!important;
  left:0!important;
  right:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  color:#78d8ff!important;
  font-size:12px!important;
  letter-spacing:.18em!important;
  direction:ltr!important
}
html body .in-circle{
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  transform:translate(-50%,-50%)!important;
  width:min(520px,78vw)!important;
  text-align:center!important;
  pointer-events:none!important
}
html body .hero h1{
  margin:0 0 8px!important;
  font-size:clamp(18px,3.2vw,34px)!important;
  line-height:1.4!important;
  letter-spacing:0!important;
  font-weight:800!important;
  text-align:center!important;
  white-space:nowrap!important
}
html body .hero p{
  margin:0 auto!important;
  color:rgba(239,248,252,.92)!important;
  font-size:13px!important;
  line-height:1.8!important;
  max-width:420px!important;
  text-align:center!important
}
html body .hero .actions{
  position:absolute!important;
  z-index:4!important;
  left:0!important;
  right:0!important;
  bottom:32px!important;
  display:flex!important;
  justify-content:center!important;
  pointer-events:auto!important
}
html body .section{padding:56px 0!important}
html body .container.product{
  display:grid!important;
  grid-template-columns:minmax(0,1.05fr) minmax(0,1fr)!important;
  align-items:stretch!important;
  gap:0!important;
  overflow:hidden!important;
  border-radius:16px!important
}
html body .product-copy{
  order:1!important;
  padding:36px 32px!important;
  text-align:right!important
}
html body .product-image{
  order:2!important;
  height:auto!important;
  min-height:320px!important;
  overflow:hidden!important;
  background:#000!important
}
html body .product-image img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  display:block!important;
  animation:kddFlow 18s ease-in-out infinite alternate!important
}
html body .product-copy h2{
  font-size:clamp(22px,2.8vw,34px)!important;
  line-height:1.5!important;
  letter-spacing:0!important
}
html body .cta{padding:48px 16px!important}
html body .cta h2{
  font-size:clamp(22px,3vw,36px)!important;
  letter-spacing:0!important;
  line-height:1.5!important
}
@keyframes kddKen{
  0%{transform:scale(1)}
  100%{transform:scale(1.16)}
}
@keyframes kddFlow{
  0%{transform:scale(1) translateX(0)}
  100%{transform:scale(1.16) translateX(-4%)}
}
@media(max-width:760px){
  html body .hero{
    height:min(92svh,760px)!important;
    min-height:560px!important
  }
  html body .eyebrow{top:64px!important;font-size:11px!important}
  html body .in-circle{width:min(92vw,420px)!important}
  html body .hero h1{font-size:clamp(15px,5.4vw,22px)!important}
  html body .hero p{font-size:12px!important;max-width:90vw!important}
  html body .hero .actions{bottom:24px!important}
  html body .actions .button{width:min(280px,86vw)!important}
  html body .container.product{
    display:flex!important;
    flex-direction:column!important
  }
  html body .product-image{
    order:0!important;
    width:100%!important;
    min-height:220px!important;
    height:240px!important
  }
  html body .product-copy{
    order:1!important;
    padding:22px 18px!important;
    text-align:center!important
  }
  html body .product-copy ul{text-align:right!important}
}
