/* Omni Terrain homepage premium 3-block polish — US + UK only.
   Scope intentionally limited to:
   1) top utility strap
   2) launch/promo offer banner
   3) hero banner fit/presence
   No other storefront layout/content is changed. */

/* 1) Modern top utility strap */
html.ot-reference-home .ot-ref-utility{
  position:relative!important;
  background:
    linear-gradient(90deg,#071a2e 0%,#0b3156 46%,#0a2747 72%,#071a2e 100%)!important;
  border:0!important;
  border-bottom:1px solid rgba(255,255,255,.10)!important;
  box-shadow:
    inset 0 -1px 0 rgba(255,255,255,.035),
    0 3px 12px rgba(7,28,51,.10)!important;
  color:#fff!important;
}

html.ot-reference-home .ot-ref-utility::after{
  content:""!important;
  position:absolute!important;
  inset:auto 0 0!important;
  height:1px!important;
  background:linear-gradient(90deg,transparent,rgba(93,166,235,.45),transparent)!important;
  pointer-events:none!important;
}

html.ot-reference-home .ot-ref-utility .ot-ref-width{
  min-height:30px!important;
  gap:20px!important;
}

html.ot-reference-home .ot-ref-utility-left,
html.ot-reference-home .ot-ref-utility-right{
  gap:14px!important;
}

html.ot-reference-home .ot-ref-utility span,
html.ot-reference-home .ot-ref-utility a,
html.ot-reference-home .ot-ref-utility-center{
  font-family:var(--ot-font-body,Inter,"Helvetica Neue",Arial,sans-serif)!important;
  font-size:10px!important;
  line-height:1!important;
}

html.ot-reference-home .ot-ref-utility-left>span:first-child{
  color:rgba(255,255,255,.78)!important;
  font-weight:500!important;
}

html.ot-reference-home .ot-ref-utility-center{
  color:rgba(255,255,255,.94)!important;
  font-weight:650!important;
  letter-spacing:.035em!important;
}

html.ot-reference-home .ot-ref-utility-right a{
  color:rgba(255,255,255,.78)!important;
  font-weight:550!important;
  transition:color .18s ease,opacity .18s ease!important;
}

html.ot-reference-home .ot-ref-utility-right a:hover{
  color:#fff!important;
}

html.ot-reference-home .ot-ref-region{
  gap:5px!important;
}

html.ot-reference-home .ot-ref-region a{
  min-width:34px!important;
  min-height:22px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:0 9px!important;
  border:1px solid rgba(255,255,255,.16)!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.075)!important;
  color:rgba(255,255,255,.88)!important;
  box-shadow:none!important;
  font-size:9px!important;
  font-weight:650!important;
  letter-spacing:.02em!important;
}

html.ot-reference-home .ot-ref-region a.active{
  border-color:#fff!important;
  background:#fff!important;
  color:#0b355f!important;
  box-shadow:0 2px 8px rgba(0,0,0,.12)!important;
}

/* 2) Modern launch/promo banner — same message and CTA */
html.ot-reference-home .ot-home-launch-offer{
  padding:12px 0 10px!important;
  background:#fff!important;
}

html.ot-reference-home .ot-home-launch-offer .ot-ref-width{
  width:min(1440px,calc(100% - 48px))!important;
}

html.ot-reference-home .ot-home-launch-offer-inner{
  position:relative!important;
  isolation:isolate!important;
  overflow:hidden!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  gap:28px!important;
  padding:20px 22px!important;
  border:1px solid #d8e4ee!important;
  border-radius:16px!important;
  background:
    radial-gradient(circle at 88% 0%,rgba(60,136,220,.10),transparent 34%),
    linear-gradient(135deg,#ffffff 0%,#fbfdff 52%,#f4f8fc 100%)!important;
  box-shadow:
    0 14px 34px rgba(18,48,79,.075),
    inset 0 1px 0 rgba(255,255,255,.95)!important;
}

html.ot-reference-home .ot-home-launch-offer-inner::before{
  content:""!important;
  position:absolute!important;
  z-index:-1!important;
  left:0!important;
  top:0!important;
  width:100%!important;
  height:3px!important;
  background:linear-gradient(90deg,#1f5ed5 0%,#4f9fea 54%,#f0c14a 100%)!important;
}

html.ot-reference-home .ot-home-launch-copy{
  gap:5px!important;
}

html.ot-reference-home .ot-home-launch-kicker{
  width:max-content!important;
  padding:5px 9px!important;
  border:1px solid #ead79c!important;
  border-radius:999px!important;
  background:#fff7db!important;
  color:#795800!important;
  box-shadow:none!important;
  font-size:9px!important;
  font-weight:700!important;
  letter-spacing:.09em!important;
}

html.ot-reference-home .ot-home-launch-copy>strong{
  color:#173b60!important;
  font-family:var(--ot-font-body,Inter,"Helvetica Neue",Arial,sans-serif)!important;
  font-size:20px!important;
  font-weight:650!important;
  line-height:1.2!important;
  letter-spacing:-.01em!important;
}

html.ot-reference-home .ot-home-launch-copy p{
  margin:0!important;
  max-width:900px!important;
  color:#687b8d!important;
  font-size:11px!important;
  font-weight:400!important;
  line-height:1.5!important;
}

html.ot-reference-home .ot-home-launch-copy code{
  padding:2px 6px!important;
  border-radius:6px!important;
  background:#173b60!important;
  color:#fff!important;
  box-shadow:none!important;
  font-family:var(--ot-font-body,Inter,Arial,sans-serif)!important;
  font-size:10px!important;
  font-weight:700!important;
}

html.ot-reference-home .ot-home-launch-offer-inner>a{
  min-height:46px!important;
  padding:0 19px!important;
  border:1px solid #1f5ed5!important;
  border-radius:10px!important;
  background:linear-gradient(180deg,#3278df 0%,#1f5ed5 100%)!important;
  color:#fff!important;
  box-shadow:0 7px 18px rgba(31,94,213,.16)!important;
  font-family:var(--ot-font-body,Inter,"Helvetica Neue",Arial,sans-serif)!important;
  font-size:11px!important;
  font-weight:700!important;
  letter-spacing:0!important;
  text-decoration:none!important;
  transition:transform .18s ease,box-shadow .18s ease,background .18s ease!important;
}

@media(hover:hover) and (pointer:fine){
  html.ot-reference-home .ot-home-launch-offer-inner>a:hover{
    transform:translateY(-1px)!important;
    background:linear-gradient(180deg,#3b82e7 0%,#215fcf 100%)!important;
    box-shadow:0 10px 22px rgba(31,94,213,.22)!important;
  }
}

/* 3) Hero: same artwork/content, larger and correctly fitted */
html.ot-reference-home .ot-ref-hero{
  position:relative!important;
  width:min(1440px,calc(100% - 48px))!important;
  max-width:1440px!important;
  min-height:0!important;
  height:auto!important;
  aspect-ratio:2048/682!important;
  margin:0 auto!important;
  overflow:hidden!important;
  border:1px solid #dce6ee!important;
  border-radius:16px!important;
  background:#eef4f8!important;
  box-shadow:0 15px 38px rgba(17,45,73,.09)!important;
}

html.ot-reference-home .ot-ref-hero-bg{
  position:absolute!important;
  inset:0!important;
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  object-fit:cover!important;
  object-position:center center!important;
  filter:none!important;
  transform:none!important;
}

html.ot-reference-home .ot-ref-hero::after{
  background:transparent!important;
}

html.ot-reference-home .ot-hero-shop-hotspot{
  border-radius:10px!important;
}

/* UK and US share the same hero source; preserve sharp native scaling. */
html.ot-reference-home .ot-ref-hero-bg[src*="omni-main-hero"]{
  image-rendering:auto!important;
}

/* Tablet/mobile: same three blocks, scaled cleanly only. */
@media(max-width:860px){
  html.ot-reference-home .ot-ref-utility .ot-ref-width{
    min-height:29px!important;
  }

  html.ot-reference-home .ot-ref-utility-center{
    font-size:9px!important;
  }

  html.ot-reference-home .ot-home-launch-offer{
    padding:9px 0 8px!important;
  }

  html.ot-reference-home .ot-home-launch-offer .ot-ref-width,
  html.ot-reference-home .ot-ref-hero{
    width:calc(100% - 20px)!important;
  }

  html.ot-reference-home .ot-home-launch-offer-inner{
    gap:14px!important;
    padding:16px!important;
    border-radius:14px!important;
  }

  html.ot-reference-home .ot-home-launch-copy>strong{
    font-size:18px!important;
  }

  html.ot-reference-home .ot-ref-hero{
    border-radius:13px!important;
    box-shadow:0 10px 26px rgba(17,45,73,.075)!important;
  }
}

@media(max-width:640px){
  html.ot-reference-home .ot-ref-utility-right{
    display:none!important;
  }

  html.ot-reference-home .ot-ref-utility .ot-ref-width{
    grid-template-columns:minmax(0,1fr) auto!important;
    gap:8px!important;
  }

  html.ot-reference-home .ot-ref-utility-center{
    justify-self:end!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
  }

  html.ot-reference-home .ot-home-launch-offer-inner{
    grid-template-columns:1fr!important;
  }

  html.ot-reference-home .ot-home-launch-offer-inner>a{
    width:100%!important;
    min-height:44px!important;
  }

  html.ot-reference-home .ot-home-launch-copy>strong{
    font-size:17px!important;
  }

  html.ot-reference-home .ot-home-launch-copy p{
    font-size:10px!important;
  }

  html.ot-reference-home .ot-ref-hero{
    width:calc(100% - 16px)!important;
    border-radius:11px!important;
  }
}

/* Dark mode compatibility without changing dark-theme architecture. */
html[data-ot-theme="dark"].ot-reference-home .ot-ref-utility{
  background:linear-gradient(90deg,#061220,#0a223a,#061724)!important;
}

html[data-ot-theme="dark"].ot-reference-home .ot-home-launch-offer{
  background:#08111f!important;
}

html[data-ot-theme="dark"].ot-reference-home .ot-home-launch-offer-inner{
  border-color:#2b4257!important;
  background:
    radial-gradient(circle at 88% 0%,rgba(101,173,255,.09),transparent 34%),
    linear-gradient(135deg,#101f31,#0d1a29)!important;
}

html[data-ot-theme="dark"].ot-reference-home .ot-home-launch-copy>strong{
  color:#e6eef5!important;
}

html[data-ot-theme="dark"].ot-reference-home .ot-home-launch-copy p{
  color:#a5b5c4!important;
}

html[data-ot-theme="dark"].ot-reference-home .ot-ref-hero{
  border-color:#2a4055!important;
  background:#0d1a29!important;
  box-shadow:0 15px 38px rgba(0,0,0,.22)!important;
}