/* MIDAS v31 — mobile header/menu + guaranteed hero image on every public page */
@media (max-width: 900px){
  html,body{width:100%!important;max-width:100%!important;overflow-x:hidden!important;background:#050506!important}
  *,*::before,*::after{box-sizing:border-box}

  /* Header: logo + centered, viewport-safe menu popup. */
  .midas-header-v6{position:sticky!important;top:0!important;z-index:10000!important;background:#050506!important}
  .midas-header-inner{width:100%!important;max-width:none!important;height:68px!important;min-height:68px!important;padding:0 16px!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;overflow:visible!important}
  .midas-brand-v6{flex:0 0 auto!important;width:150px!important;height:52px!important;margin:0!important}
  .midas-brand-v6 img{width:148px!important;height:50px!important;object-fit:contain!important;object-position:left center!important}
  .midas-actions-v6{display:none!important}
  .midas-menu-btn{display:inline-flex!important;position:relative!important;z-index:10002!important;flex:0 0 auto!important;align-items:center!important;justify-content:center!important;width:auto!important;min-width:76px!important;height:38px!important;padding:0 14px!important;margin:0!important;border:1px solid rgba(255,255,255,.18)!important;border-radius:9px!important;background:#0b0b0c!important;color:#fff!important;font:800 13px/1 Arial,sans-serif!important;text-align:center!important}

  .midas-nav-v6,
  body.apps-v11 .midas-nav-v6{
    display:none!important;
    position:fixed!important;
    z-index:10001!important;
    top:76px!important;
    left:50%!important;
    right:auto!important;
    bottom:auto!important;
    transform:translateX(-50%)!important;
    width:min(340px,calc(100vw - 28px))!important;
    max-width:calc(100vw - 28px)!important;
    height:auto!important;
    max-height:calc(100dvh - 92px)!important;
    margin:0!important;
    padding:10px!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    flex-direction:column!important;
    align-items:stretch!important;
    justify-content:flex-start!important;
    gap:7px!important;
    background:rgba(5,5,6,.985)!important;
    border:1px solid rgba(255,255,255,.14)!important;
    border-radius:14px!important;
    box-shadow:0 20px 60px rgba(0,0,0,.78)!important;
    text-align:center!important;
  }
  .midas-nav-v6.open,body.apps-v11 .midas-nav-v6.open{display:flex!important}
  .midas-nav-v6 a,body.apps-v11 .midas-nav-v6 a{
    position:relative!important;
    display:flex!important;
    flex:0 0 auto!important;
    width:100%!important;
    min-width:0!important;
    height:42px!important;
    min-height:42px!important;
    margin:0!important;
    padding:0 12px!important;
    align-items:center!important;
    justify-content:center!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
    text-align:center!important;
    border:1px solid rgba(255,255,255,.07)!important;
    border-radius:9px!important;
    background:linear-gradient(180deg,#252527 0%,#111113 100%)!important;
    color:#fff!important;
    font-size:13px!important;
    font-weight:750!important;
    line-height:1.1!important;
    text-decoration:none!important;
  }
  .midas-nav-v6 a.active-v13,.midas-nav-v6 a:hover{border-color:#d90a18!important;background:linear-gradient(180deg,#a20c16,#57050b)!important;color:#fff!important}
  .midas-nav-v6 a::before,.midas-nav-v6 a::after{display:none!important}

  /* Standard image band immediately below header on inner pages. */
  .pagehero:not(.stage-v11-hero){
    display:block!important;
    min-height:0!important;
    padding:0!important;
    margin:0!important;
    background:none!important;
    overflow:visible!important;
  }
  .pagehero:not(.stage-v11-hero)::before{
    content:""!important;
    display:block!important;
    width:100%!important;
    height:clamp(220px,64vw,300px)!important;
    background-image:linear-gradient(180deg,rgba(0,0,0,.02),rgba(0,0,0,.20)),url("midas-hero-wide.png")!important;
    background-repeat:no-repeat!important;
    background-size:auto 100%!important;
    background-position:69% center!important;
    background-color:#050506!important;
  }
  .pagehero:not(.stage-v11-hero)>.wrap,
  .pagehero:not(.stage-v11-hero) .pagehero-grid{
    width:calc(100% - 28px)!important;
    max-width:760px!important;
    min-height:0!important;
    margin:0 auto!important;
    padding:18px 0 20px!important;
    display:block!important;
  }
  .pagehero:not(.stage-v11-hero) .pagehero-copy{display:block!important;width:100%!important;max-width:100%!important;padding:0!important;margin:0!important}
  .pagehero:not(.stage-v11-hero) .pagehero-logo-art{display:none!important}
  .pagehero:not(.stage-v11-hero) h1{font-size:clamp(28px,8.5vw,40px)!important;line-height:1.03!important;margin:6px 0 9px!important}
  .pagehero:not(.stage-v11-hero) .lead{font-size:13px!important;line-height:1.4!important;margin:0!important;max-width:100%!important;color:#d0d2d5!important}

  /* Installation: image first, then selector. No selector can cover the car. */
  .apps-hero-v13{
    display:block!important;
    min-height:0!important;
    padding:0!important;
    margin:0!important;
    background:none!important;
    overflow:visible!important;
  }
  .apps-hero-v13::before{
    content:""!important;
    display:block!important;
    width:100%!important;
    height:clamp(220px,64vw,300px)!important;
    background-image:linear-gradient(180deg,rgba(0,0,0,.02),rgba(0,0,0,.18)),url("midas-hero-wide.png")!important;
    background-repeat:no-repeat!important;
    background-size:auto 100%!important;
    background-position:69% center!important;
    background-color:#050506!important;
  }
  .apps-hero-inner-v13{width:calc(100% - 24px)!important;max-width:760px!important;min-height:0!important;margin:0 auto!important;padding:12px 0 10px!important;display:block!important}
  .apps-selector-stack-v13{width:100%!important;max-width:100%!important;margin:0!important;padding:11px!important;background:#070708!important;border:1px solid rgba(255,255,255,.11)!important;backdrop-filter:none!important}

  /* Stage 1: same guaranteed image band, selector begins below it. */
  .stage-v11-hero{
    display:block!important;
    min-height:0!important;
    padding:0!important;
    margin:0!important;
    background:none!important;
    overflow:visible!important;
  }
  .stage-v11-hero::before{
    content:""!important;
    display:block!important;
    width:100%!important;
    height:clamp(220px,64vw,300px)!important;
    background-image:linear-gradient(180deg,rgba(0,0,0,.02),rgba(0,0,0,.18)),url("midas-hero-wide.png")!important;
    background-repeat:no-repeat!important;
    background-size:auto 100%!important;
    background-position:69% center!important;
    background-color:#050506!important;
  }
  .stage-v11-hero>.wrap,.stage-v11-layout{width:calc(100% - 24px)!important;max-width:760px!important;min-height:0!important;margin:0 auto!important;padding:12px 0 10px!important;display:block!important}
  .stage-top-selector{width:100%!important;max-width:100%!important;margin:0!important;padding:11px!important;background:#070708!important;border:1px solid rgba(255,255,255,.11)!important;backdrop-filter:none!important}

  /* Keep mobile content compact after the hero. */
  .section{padding-top:18px!important;padding-bottom:18px!important}
  .mobilebar{display:none!important}
}

@media (max-width: 420px){
  .midas-header-inner{height:64px!important;min-height:64px!important;padding:0 12px!important}
  .midas-brand-v6{width:136px!important;height:48px!important}
  .midas-brand-v6 img{width:134px!important;height:46px!important}
  .midas-menu-btn{min-width:70px!important;height:36px!important;padding:0 12px!important;font-size:12px!important}
  .midas-nav-v6,body.apps-v11 .midas-nav-v6{top:71px!important;width:calc(100vw - 24px)!important;max-width:340px!important}
  .pagehero:not(.stage-v11-hero)::before,.apps-hero-v13::before,.stage-v11-hero::before{height:clamp(215px,66vw,270px)!important;background-position:70% center!important}
}
