/* MLG V2.8.1 — the V2.8.0 desktop is completely unchanged.
   The original metallic MLG artwork is preserved, not redrawn in CSS. */
@media (max-width:720px) {
  /* A fine visual header, not an opaque navy slab. */
  :root { --header:64px; }
  body .site-header,
  body[data-page="brands"] .site-header,
  body[data-page="partnerships"] .site-header,
  body[data-page="contact"] .site-header {
    height:64px; padding-inline:clamp(14px,4vw,20px);
    background:rgba(4,16,25,.35);
    border-bottom:1px solid rgba(220,183,100,.11);
    -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  }
  body .site-header.scrolled,
  body[data-page="brands"] .site-header.scrolled,
  body[data-page="partnerships"] .site-header.scrolled,
  body[data-page="contact"] .site-header.scrolled {
    height:60px; background:rgba(5,17,27,.88);
  }
  body .site-header>.brand {width:100px;min-width:100px;height:60px;}
  body .site-header.scrolled>.brand {width:94px;min-width:94px;height:56px;}
  body .site-header>.nav {padding-top:calc(env(safe-area-inset-top) + 74px);}
  body.menu-open .site-header{background:#071622!important;}
  /* One complete background artwork. The metallic lettering, map and
     illuminated city are within the same real image, not separate overlays. */
  body[data-page="home"] .hero-scene .hero-media {
    background-image:url('/assets/mlg-home-mobile-v281-premium-art.webp')!important;
    background-size:100% 100%!important;
    background-position:center top!important;
    background-repeat:no-repeat!important;
    filter:saturate(1.025) contrast(1.014)!important;
  }
  /* Protect the text on the left; allow the 3D MLG and castle to shine. */
  body[data-page="home"] .hero-scene .hero-shade {
    background:
      linear-gradient(90deg,rgba(3,10,19,.41) 0%,rgba(4,12,21,.22) 42%,rgba(4,12,21,0) 100%),
      linear-gradient(180deg,rgba(3,11,19,.13) 0%,rgba(3,11,19,0) 30%,rgba(3,11,19,0) 56%,rgba(3,12,20,.09) 73%,rgba(9,14,20,.36) 94%,#090e14 100%)!important;
  }
  /* Text remains real, accessible HTML. Do not alter its approved fonts. */
  body[data-page="home"] .hero-scene .scene-copy-hero h1 {
    text-shadow:0 3px 15px rgba(1,5,11,.85),0 1px 23px rgba(1,5,11,.35);
  }
  body[data-page="home"] .hero-scene .scene-copy-hero p {
    text-shadow:0 2px 10px rgba(1,5,11,.91),0 1px 17px rgba(1,5,11,.50);
  }
  /* A quieter transition to Group Activities; do not darken away the city. */
  body[data-page="home"] .gateway-scene .gateway-backgrounds {
    -webkit-mask-image:linear-gradient(to bottom,transparent 0,rgba(0,0,0,.24) 36px,rgba(0,0,0,.70) 105px,#000 195px);
    mask-image:linear-gradient(to bottom,transparent 0,rgba(0,0,0,.24) 36px,rgba(0,0,0,.70) 105px,#000 195px);
  }
}
@media (max-width:375px) {
  body .site-header>.brand{width:93px;min-width:93px;height:57px;}
  body .site-header.scrolled>.brand{width:88px;min-width:88px;height:53px;}
}
@media (max-width:720px) and (prefers-reduced-transparency:reduce) {
  body .site-header{background:#071622!important;backdrop-filter:none!important;}
}