/* Lumavryn V33 — mobile homepage cleanup
   1) Header shows only the locked gold L mark (desktop unchanged).
   2) Restore the locked mobile hero as one continuous image: no split/recompose seam.
   3) Keep live hero copy transparent and overlay it on the continuous artwork. */
@media (max-width:620px){
  /* Mobile header: crop the existing locked brand artwork to its L mark only. */
  .top .nav>a[aria-label="Lumavryn home"]{
    display:block!important;
    width:62px!important;
    height:58px!important;
    overflow:hidden!important;
    flex:0 0 62px!important;
  }
  .top .nav>a[aria-label="Lumavryn home"] .brand-img{
    display:block!important;
    width:auto!important;
    max-width:none!important;
    height:58px!important;
    margin:0!important;
    object-fit:contain!important;
    object-position:left center!important;
  }

  /* One-piece hero: removes the horizontal join completely. */
  .hero-visual{
    position:relative!important;
    overflow:hidden!important;
    background:#00050d!important;
    isolation:isolate!important;
  }
  .hero-visual>.hero-picture{
    display:block!important;
    position:relative!important;
    z-index:1!important;
    width:100%!important;
    margin:0!important;
    padding:0!important;
    background:transparent!important;
  }
  .hero-visual>.hero-picture img{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    margin:0!important;
    padding:0!important;
    object-fit:contain!important;
    object-position:center top!important;
    transform:none!important;
  }
  .hero-mobile-recompose{display:none!important}

  /* Live wording floats directly over the artwork — no black panel/box. */
  .hero-copy,
  .hero-copy p,
  .hero-visual .hero-copy{
    display:block!important;
    position:absolute!important;
    z-index:5!important;
    left:50%!important;
    top:39%!important;
    transform:translateX(-50%)!important;
    width:84%!important;
    max-width:540px!important;
    margin:0!important;
    padding:0!important;
    text-align:center!important;
    background:transparent!important;
    background-color:transparent!important;
    box-shadow:none!important;
    border:0!important;
    border-radius:0!important;
    color:#f7f7f4!important;
    font-size:12.5px!important;
    line-height:1.48!important;
    text-shadow:0 2px 9px rgba(0,0,0,.95)!important;
  }

  /* Kill all legacy overlay layers that could create a horizontal band. */
  .hero-art::before,.hero-art::after,
  .hero-visual::before,.hero-visual::after{
    content:none!important;
    display:none!important;
    background:none!important;
    opacity:0!important;
    -webkit-mask-image:none!important;
    mask-image:none!important;
  }
}

@media (max-width:390px){
  .hero-copy{top:38.5%!important;width:86%!important;font-size:11.8px!important;line-height:1.46!important}
}