:root{--nbl-portal-duration:600ms}

/* Shared responsive media safety net. */
img{
  max-width:100%;
  height:auto;
}

picture,
figure{
  max-width:100%;
}

video{
  max-width:100%;
}

.nbl-portal-overlay{
  position:fixed;
  inset:0;
  width:100vw;
  height:100vh;
  height:100dvh;
  z-index:9999;
  opacity:1;
  pointer-events:none;
  background:
    radial-gradient(circle at 50% 46%,rgba(214,161,75,.08),transparent 34%),
    #0d1117;
  transition:opacity var(--nbl-portal-duration) cubic-bezier(.4,0,.2,1);
  will-change:opacity;
}

.nbl-portal-overlay.portal-visible{
  opacity:1;
  pointer-events:auto;
}

.nbl-portal-overlay.portal-hidden{
  opacity:0;
  pointer-events:none;
}

/* Keep the one approved homepage artwork. CSS changes only its framing. */
html.nbl-day body#home .hero-media{
  filter:brightness(1.08) saturate(.94) contrast(.96) sepia(.035);
}

html.nbl-night body#home .hero-media{
  filter:brightness(.88) saturate(1.06) contrast(1.04);
}

body#home .hero-media{
  transition:filter 900ms ease;
  object-fit:cover;
  object-position:50% 50%;
}

@media(max-width:800px) and (orientation:portrait){
  body#home .hero{
    min-height:72svh;
  }

  body#home .hero-media{
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:50% 50%;
  }
}

@media(max-width:1000px) and (orientation:landscape){
  body#home .hero-media{
    object-fit:cover;
    object-position:50% 50%;
  }
}

@media(max-width:820px){
  html.nbl-clothing-live .header-inner{
    flex-wrap:wrap;
    padding:8px 0 6px;
  }

  html.nbl-clothing-live .header .nav{
    display:flex!important;
    order:3;
    width:100%;
    margin-left:0;
    gap:14px;
    overflow-x:auto;
    padding:2px 0 8px;
    scrollbar-width:none;
  }

  html.nbl-clothing-live .header .nav::-webkit-scrollbar{
    display:none;
  }

  html.nbl-clothing-live .subnav{
    position:static!important;
    top:auto!important;
  }
}

@media(max-width:800px){
  main img,
  main video,
  main picture{
    max-width:100%;
  }
}

@media(prefers-reduced-motion:reduce){
  :root{--nbl-portal-duration:0ms}
  .nbl-portal-overlay,
  body#home .hero-media{transition:none!important}
}