/* 11.6.61 — visual hierarchy / conversion focus pass.
 * Focus order: headline -> search -> product visual -> shop/deal -> benefits -> categories -> trust.
 * The aim is to stop every surface from shouting at the same volume.
 */

/* --------------------------------------------------------------------------
   Header hierarchy: preserve the white storefront identity, but give the
   primary commerce action one clear accent and quiet the utility actions.
   -------------------------------------------------------------------------- */
html body.home.nt-clay.nt-v6.nt-principled #siteHeader .nt-desktop-nav a{
  color:#5f5869!important;
  font-weight:700!important;
}
html body.home.nt-clay.nt-v6.nt-principled #siteHeader .nt-desktop-nav a[aria-current="page"],
html body.home.nt-clay.nt-v6.nt-principled #siteHeader .nt-desktop-nav a:hover{
  color:#d95b0c!important;
  background:#fff8f2!important;
}
html body.home.nt-clay.nt-v6.nt-principled #siteHeader .nt-header-search,
html body.home.nt-clay.nt-v6.nt-principled #siteHeader .nt-header-icon,
html body.home.nt-clay.nt-v6.nt-principled #siteHeader .nt-header-login-cta{
  background:#fff!important;
  border-color:#eeebe4!important;
  color:#403948!important;
  box-shadow:none!important;
}
html body.home.nt-clay.nt-v6.nt-principled #siteHeader .nt-header-shop-cta{
  background:linear-gradient(135deg,#ffad1f,#ff691c)!important;
  border-color:#ff8a25!important;
  color:#fff!important;
  box-shadow:0 9px 22px rgba(255,105,28,.20)!important;
  font-weight:850!important;
}
html body.home.nt-clay.nt-v6.nt-principled #siteHeader .nt-header-shop-cta:hover{
  transform:translateY(-2px)!important;
  box-shadow:0 13px 29px rgba(255,105,28,.27)!important;
}

/* --------------------------------------------------------------------------
   Hero copy: headline owns the first look. Supporting copy is intentionally
   quieter so search becomes the obvious next action.
   -------------------------------------------------------------------------- */
body.home .ntx-site-hero__eyebrow{
  min-height:32px!important;
  padding:0 12px!important;
  font-size:.68rem!important;
  opacity:.84!important;
  box-shadow:none!important;
}
body.home .ntx-site-hero__title{
  margin:15px 0 11px!important;
  max-width:640px!important;
  font-size:clamp(3.35rem,4.8vw,5.65rem)!important;
  line-height:.965!important;
  text-shadow:0 8px 28px rgba(0,0,0,.32)!important;
}
body.home .ntx-site-hero__lead{
  max-width:565px!important;
  margin-bottom:16px!important;
  color:#cfd4e1!important;
  font-size:clamp(.96rem,1.05vw,1.12rem)!important;
  line-height:1.48!important;
  font-weight:520!important;
}

/* --------------------------------------------------------------------------
   Search is the strongest actionable control in the hero.
   -------------------------------------------------------------------------- */
body.home .ntx-site-search{
  width:min(100%,625px)!important;
  min-height:64px!important;
  margin-bottom:16px!important;
  border:2px solid rgba(255,178,31,.62)!important;
  border-radius:18px!important;
  background:#fff!important;
  box-shadow:0 16px 42px rgba(0,0,0,.29),0 0 0 1px rgba(255,255,255,.7)!important;
}
body.home .ntx-site-search:focus-within{
  transform:translateY(-2px)!important;
  border-color:#ff9c18!important;
  box-shadow:0 20px 48px rgba(0,0,0,.34),0 0 0 5px rgba(255,151,22,.15)!important;
}
body.home .ntx-site-search input{
  font-size:.98rem!important;
  font-weight:650!important;
}
body.home .ntx-site-search button{
  min-height:50px!important;
  min-width:118px!important;
  padding-inline:18px!important;
  border-radius:13px!important;
  background:linear-gradient(135deg,#ffb51f,#ff6619)!important;
  box-shadow:0 9px 22px rgba(255,94,17,.26)!important;
  font-size:.9rem!important;
}
body.home .ntx-site-search__results{
  border:1px solid rgba(139,117,79,.12)!important;
  background:#fff!important;
}
body.home .ntx-site-search__results .nt-live-search-result{
  transition:background .16s ease,transform .16s ease!important;
}
body.home .ntx-site-search__results .nt-live-search-result:hover,
body.home .ntx-site-search__results .nt-live-search-result:focus-visible{
  background:#fff7f0!important;
  transform:translateX(2px)!important;
}

/* --------------------------------------------------------------------------
   Right-hand product artwork = secondary visual. Keep it premium, but slightly
   lower its resting contrast so it supports the headline instead of fighting it.
   -------------------------------------------------------------------------- */
body.home .ntx-site-hero__visual-frame{
  opacity:.95!important;
  box-shadow:0 24px 62px rgba(0,0,0,.39),0 0 40px rgba(32,92,236,.10)!important;
}
body.home .ntx-site-hero__visual-frame img{
  filter:saturate(.96) contrast(.99)!important;
}
body.home .ntx-site-hero__visual:hover .ntx-site-hero__visual-frame{
  opacity:1!important;
  box-shadow:0 31px 74px rgba(0,0,0,.45),0 0 45px rgba(255,113,22,.12)!important;
}
body.home .ntx-site-hero__visual:hover img{
  filter:saturate(1.03) contrast(1.01)!important;
}
body.home .ntx-site-hero__visual-shop{
  background:rgba(4,7,18,.82)!important;
  border-color:rgba(255,255,255,.19)!important;
  font-size:.72rem!important;
  box-shadow:0 7px 18px rgba(0,0,0,.22)!important;
}

/* --------------------------------------------------------------------------
   Deal / Community: tertiary actions. Still visible, no longer equal to search.
   -------------------------------------------------------------------------- */
body.home .ntx-site-hero__deal-row{
  gap:10px!important;
  margin-bottom:14px!important;
}
body.home .ntx-site-hero__discount{
  min-height:56px!important;
  padding:7px 16px 7px 18px!important;
  border-width:1px!important;
  border-radius:18px!important;
  box-shadow:0 8px 23px rgba(255,84,0,.16)!important;
}
body.home .ntx-site-hero__discount span{font-size:.78rem!important}
body.home .ntx-site-hero__discount strong{font-size:1.78rem!important}
body.home .ntx-site-hero__discount i{font-size:1.25rem!important}
body.home .ntx-site-hero__secondary-cta{
  min-height:46px!important;
  padding:0 14px!important;
  border-color:rgba(255,255,255,.14)!important;
  background:rgba(255,255,255,.035)!important;
  color:#d9ddea!important;
  font-size:.76rem!important;
  font-weight:720!important;
}
body.home .ntx-site-hero__secondary-cta:hover{
  color:#fff!important;
  background:rgba(255,255,255,.085)!important;
  border-color:rgba(255,255,255,.25)!important;
}

/* --------------------------------------------------------------------------
   Benefits: reassurance, not a second navigation system. Reduce brightness and
   movement until the user intentionally hovers/focuses them.
   -------------------------------------------------------------------------- */
body.home .ntx-site-hero__benefits{
  gap:7px!important;
  max-width:610px!important;
}
body.home .ntx-site-hero__benefits>div{
  min-height:54px!important;
  padding:7px!important;
  background:rgba(255,255,255,.022)!important;
  border-color:rgba(255,255,255,.065)!important;
  opacity:.78!important;
}
body.home .ntx-site-hero__benefits>div:hover{
  opacity:1!important;
  transform:translateY(-2px)!important;
  background:rgba(255,255,255,.055)!important;
  border-color:rgba(255,185,29,.19)!important;
}
body.home .ntx-site-hero__benefits>div>i{
  width:32px!important;
  height:32px!important;
  border-color:rgba(233,169,15,.68)!important;
  color:#eeb317!important;
  background:rgba(255,175,0,.045)!important;
}
body.home .ntx-site-hero__benefits b{font-size:.74rem!important}
body.home .ntx-site-hero__benefits small{font-size:.62rem!important;color:#b6bccb!important}

/* --------------------------------------------------------------------------
   Category rail: discovery layer. Cards are deliberately quiet at rest and
   become vivid on hover/focus, creating a clear progressive hierarchy.
   -------------------------------------------------------------------------- */
body.home .ntx-site-hero__tools{
  padding-top:16px!important;
  border-top:1px solid rgba(255,255,255,.055)!important;
}
body.home .ntx-site-hero__tools-head span{
  font-size:.75rem!important;
  color:#dfe3ec!important;
}
body.home .ntx-site-hero__tools-head small{
  font-size:.62rem!important;
  color:#858da3!important;
}
body.home .ntx-site-hero__tools-controls button{
  width:34px!important;
  height:34px!important;
  color:#bcc2d0!important;
  border-color:rgba(255,255,255,.11)!important;
  background:rgba(255,255,255,.028)!important;
}
body.home .ntx-site-tool-card{
  min-height:116px!important;
  background:linear-gradient(180deg,rgba(27,34,61,.54),rgba(7,10,22,.74))!important;
  border-color:rgba(255,255,255,.095)!important;
  opacity:.80!important;
  box-shadow:none!important;
}
body.home .ntx-site-tool-card:hover,
body.home .ntx-site-tool-card:focus-visible{
  opacity:1!important;
  transform:translateY(-4px)!important;
  border-color:rgba(255,176,18,.46)!important;
  background:linear-gradient(180deg,rgba(42,48,78,.78),rgba(10,13,28,.94))!important;
  box-shadow:0 12px 26px rgba(0,0,0,.21),0 0 15px rgba(255,132,0,.065)!important;
}
body.home .ntx-site-tool-card__icon{
  width:44px!important;
  height:44px!important;
  box-shadow:0 6px 14px rgba(0,0,0,.20)!important;
}
body.home .ntx-site-tool-card strong{font-size:.77rem!important}
body.home .ntx-site-tool-card small{font-size:.61rem!important;color:#9fa7ba!important}

/* --------------------------------------------------------------------------
   Bottom trust row: lowest visual weight. Shop Now remains the one strong CTA,
   but smaller than the main search to avoid two competing primary controls.
   -------------------------------------------------------------------------- */
body.home .ntx-site-hero__footer{
  border-top-color:rgba(255,255,255,.055)!important;
  padding-top:12px!important;
}
body.home .ntx-site-hero__footer>div,
body.home .ntx-site-hero__footer>a:not(.ntx-site-hero__shop-now){
  opacity:.67!important;
}
body.home .ntx-site-hero__footer>a:not(.ntx-site-hero__shop-now):hover{
  opacity:1!important;
}
body.home .ntx-site-hero__footer i{font-size:1.1rem!important;color:#dcae26!important}
body.home .ntx-site-hero__footer b{font-size:.68rem!important}
body.home .ntx-site-hero__footer small{font-size:.57rem!important;color:#888fa1!important}
body.home .ntx-site-hero__shop-now{
  min-height:52px!important;
  max-width:360px!important;
  width:100%!important;
  justify-self:center!important;
  font-size:1.03rem!important;
  box-shadow:0 8px 24px rgba(255,81,8,.18)!important;
}
body.home .ntx-site-hero__shop-now:hover{
  box-shadow:0 12px 30px rgba(255,81,8,.28)!important;
}

/* --------------------------------------------------------------------------
   Homepage product filter hierarchy: filter chips are controls, not competing
   headings. The active filter receives the accent; inactive filters stay soft.
   -------------------------------------------------------------------------- */
body.home .nt-home-filter-block{
  border-color:rgba(112,97,72,.08)!important;
  box-shadow:0 7px 20px rgba(55,39,75,.045)!important;
}
body.home .nt-home-filter-block__head span{font-size:.80rem!important}
body.home .nt-home-filter-block__head small{color:#958d9b!important;font-size:.68rem!important}
body.home .nt-home-filter-block .nt-toolfilter__chip{
  border-color:#efece7!important;
  background:#faf9fb!important;
  color:#6f6777!important;
  font-weight:700!important;
}
body.home .nt-home-filter-block .nt-toolfilter__chip:hover{
  background:#fff7f0!important;
  border-color:#ffd4b6!important;
  color:#b84c0b!important;
}
body.home .nt-home-filter-block .nt-toolfilter__chip.is-active{
  background:linear-gradient(135deg,#ffb51f,#ff6a1a)!important;
  border-color:#ff8b25!important;
  color:#fff!important;
  box-shadow:0 6px 14px rgba(255,105,27,.16)!important;
}

/* --------------------------------------------------------------------------
   Mobile: hierarchy must become stronger, not flatter. Search stays prominent,
   visual becomes compact, reassurance and rails are compressed.
   -------------------------------------------------------------------------- */
@media (max-width:820px){
  body.home .ntx-site-hero__title{
    margin:11px 0 8px!important;
    font-size:clamp(2.18rem,10.2vw,3.08rem)!important;
  }
  body.home .ntx-site-hero__lead{
    max-width:34rem!important;
    margin-bottom:11px!important;
    color:#bcc2d1!important;
    font-size:.84rem!important;
  }
  body.home .ntx-site-search{
    min-height:60px!important;
    margin-bottom:11px!important;
    border-width:2px!important;
    box-shadow:0 13px 34px rgba(0,0,0,.26)!important;
  }
  body.home .ntx-site-search button{
    min-width:52px!important;
    width:52px!important;
    min-height:48px!important;
    font-size:0!important;
    padding:0!important;
    justify-content:center!important;
  }
  body.home .ntx-site-hero__deal-row{
    margin-bottom:10px!important;
  }
  body.home .ntx-site-hero__discount{
    min-height:50px!important;
    padding:6px 12px!important;
  }
  body.home .ntx-site-hero__discount strong{font-size:1.5rem!important}
  body.home .ntx-site-hero__secondary-cta{min-height:48px!important}
  body.home .ntx-site-hero__benefits>div{min-height:49px!important;opacity:.72!important}
  body.home .ntx-site-hero__visual-frame{
    opacity:.92!important;
    aspect-ratio:1.5/1!important;
  }
  body.home .ntx-site-hero__tools{padding-top:12px!important}
  body.home .ntx-site-tool-card{opacity:.84!important;min-height:108px!important}
  body.home .ntx-site-hero__footer>div,
  body.home .ntx-site-hero__footer>a:not(.ntx-site-hero__shop-now){opacity:.72!important}
  body.home .ntx-site-hero__shop-now{max-width:none!important;min-height:50px!important}
}

@media (max-width:480px){
  body.home .ntx-site-hero__eyebrow{font-size:.58rem!important}
  body.home .ntx-site-hero__title{font-size:clamp(2.02rem,10.5vw,2.72rem)!important}
  body.home .ntx-site-hero__lead{font-size:.79rem!important}
  body.home .ntx-site-search{border-radius:14px!important}
  body.home .ntx-site-hero__deal-row{gap:7px!important}
  body.home .ntx-site-hero__discount{width:auto!important;min-width:0!important;justify-content:flex-start!important}
  body.home .ntx-site-hero__benefits{gap:6px!important}
  body.home .ntx-site-tool-card__icon{width:41px!important;height:41px!important}
}

@media (prefers-reduced-motion:reduce){
  html body.home.nt-clay.nt-v6.nt-principled #siteHeader *,
  body.home .ntx-site-hero *{transition:none!important;animation:none!important}
}