/* Mile I Shipping V87.31 — authoritative public mobile/tablet header, hero overlay and menu */
@media (max-width:1024px){
  :root{--v8731-header-height:78px}
  html,body{overflow-x:hidden!important}

  html body.public-site .site-header,
  html body.rates-page .site-header,
  html body.public-site.menu-open .site-header,
  html body.rates-page.menu-open .site-header,
  html body[class*="mobile-menu-open"] .site-header,
  html body.v8731-menu-open .site-header{
    position:fixed!important;top:0!important;right:0!important;left:0!important;bottom:auto!important;
    z-index:2147483000!important;width:100%!important;height:var(--v8731-header-height)!important;
    min-height:var(--v8731-header-height)!important;max-height:var(--v8731-header-height)!important;
    padding:8px 14px!important;display:grid!important;grid-template-columns:minmax(0,1fr) 54px!important;
    grid-template-rows:1fr!important;align-items:center!important;gap:10px!important;overflow:visible!important;
    background:linear-gradient(135deg,#061d48,#07366f)!important;border:0!important;
    border-bottom:1px solid rgba(255,255,255,.12)!important;
    box-shadow:0 8px 24px rgba(0,17,45,.24)!important;backdrop-filter:none!important
  }
  html body.public-site .site-header::before,html body.public-site .site-header::after,
  html body.rates-page .site-header::before,html body.rates-page .site-header::after{display:none!important;content:none!important}
  html body.public-site .site-header .brand,html body.rates-page .site-header .brand{
    grid-column:1!important;grid-row:1!important;min-width:0!important;max-width:calc(100vw - 92px)!important;
    height:100%!important;display:flex!important;align-items:center!important;overflow:visible!important
  }
  html body.public-site .site-header .brand img,html body.rates-page .site-header .brand img{
    display:block!important;width:auto!important;height:auto!important;max-width:min(250px,100%)!important;
    max-height:61px!important;object-fit:contain!important;object-position:left center!important;transform:none!important;filter:none!important
  }
  html body.public-site .site-header .menu-toggle,html body.rates-page .site-header .menu-toggle{
    position:static!important;inset:auto!important;grid-column:2!important;grid-row:1!important;display:grid!important;
    place-content:center!important;width:52px!important;height:52px!important;min-width:52px!important;
    margin:0!important;padding:0!important;border:1px solid rgba(255,255,255,.23)!important;border-radius:16px!important;
    background:linear-gradient(145deg,#174d86,#0b3568)!important;
    box-shadow:0 8px 18px rgba(0,12,35,.24),inset 0 1px 0 rgba(255,255,255,.13)!important;transform:none!important
  }
  html body.public-site .site-header .menu-toggle span,html body.rates-page .site-header .menu-toggle span{
    display:block!important;width:26px!important;height:3px!important;margin:3px auto!important;border-radius:999px!important;
    background:#fff!important;transition:transform .18s ease,opacity .18s ease!important
  }
  html body.v8731-menu-open .site-header .menu-toggle span:nth-child(1){transform:translateY(9px) rotate(45deg)!important}
  html body.v8731-menu-open .site-header .menu-toggle span:nth-child(2){opacity:0!important}
  html body.v8731-menu-open .site-header .menu-toggle span:nth-child(3){transform:translateY(-9px) rotate(-45deg)!important}

  /* The original desktop navigation stays dormant on compact screens. */
  html body.public-site .site-header>nav,html body.rates-page .site-header>nav,
  html body.public-site.menu-open .site-header>nav,html body.rates-page.menu-open .site-header>nav,
  html body.public-site .site-header .header-actions,html body.rates-page .site-header .header-actions,
  html body.public-site.menu-open .site-header .header-actions,html body.rates-page.menu-open .site-header .header-actions,
  html body.public-site .v8728-mobile-auth-dock,html body.rates-page .v8728-mobile-auth-dock,
  .v8730-mobile-drawer,.v8730-mobile-backdrop{display:none!important;visibility:hidden!important;pointer-events:none!important}

  .v8731-menu-backdrop{
    position:fixed!important;z-index:2147482980!important;inset:var(--v8731-header-height) 0 0!important;
    opacity:0!important;visibility:hidden!important;pointer-events:none!important;background:rgba(1,14,37,.58)!important;
    backdrop-filter:blur(3px)!important;transition:opacity .18s ease,visibility .18s ease!important
  }
  html body.v8731-menu-open .v8731-menu-backdrop{opacity:1!important;visibility:visible!important;pointer-events:auto!important}

  .v8731-mobile-menu{
    position:fixed!important;z-index:2147482990!important;top:var(--v8731-header-height)!important;right:10px!important;
    width:min(370px,calc(100vw - 20px))!important;max-height:calc(100dvh - var(--v8731-header-height) - 10px)!important;
    overflow-y:auto!important;overscroll-behavior:contain!important;-webkit-overflow-scrolling:touch!important;
    padding:12px!important;border:1px solid rgba(255,255,255,.16)!important;border-top:0!important;
    border-radius:0 0 18px 18px!important;background:linear-gradient(180deg,#082d60,#051f49)!important;
    box-shadow:0 28px 70px rgba(0,12,35,.46)!important;transform:translateY(-12px)!important;
    opacity:0!important;visibility:hidden!important;pointer-events:none!important;
    transition:transform .2s cubic-bezier(.22,.8,.22,1),opacity .16s ease!important
  }
  html body.v8731-menu-open .v8731-mobile-menu{transform:translateY(0)!important;opacity:1!important;visibility:visible!important;pointer-events:auto!important}
  .v8731-mobile-menu nav{display:grid!important;grid-template-columns:1fr!important;gap:4px!important;margin:0!important;padding:0!important}
  .v8731-mobile-menu nav a{
    width:100%!important;min-height:44px!important;padding:10px 13px!important;display:flex!important;align-items:center!important;
    justify-content:space-between!important;gap:12px!important;border:1px solid transparent!important;border-radius:10px!important;
    background:transparent!important;color:#fff!important;font-size:13px!important;font-weight:850!important;line-height:1.25!important;
    text-decoration:none!important;text-align:left!important;white-space:normal!important
  }
  .v8731-mobile-menu nav a::after{content:'›'!important;color:#8ec0ee!important;font-size:19px!important;line-height:1!important}
  .v8731-mobile-menu nav a:hover,.v8731-mobile-menu nav a:focus-visible,.v8731-mobile-menu nav a.active,.v8731-mobile-menu nav a[aria-current=page]{
    border-color:rgba(255,255,255,.14)!important;background:rgba(255,255,255,.075)!important;color:#fff!important
  }
  .v8731-mobile-auth{
    display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important;margin:8px 0 0!important;
    padding:12px 0 0!important;border-top:1px solid rgba(255,255,255,.14)!important
  }
  .v8731-mobile-auth a{
    width:100%!important;min-width:0!important;min-height:46px!important;margin:0!important;padding:10px 11px!important;
    display:flex!important;align-items:center!important;justify-content:center!important;border-radius:11px!important;
    font-size:12px!important;font-weight:900!important;line-height:1.2!important;text-align:center!important;text-transform:uppercase!important;text-decoration:none!important
  }
  .v8731-mobile-auth .v8731-login{border:1px solid rgba(255,255,255,.36)!important;background:rgba(255,255,255,.06)!important;color:#fff!important}
  .v8731-mobile-auth .v8731-create{border:1px solid #ef2734!important;background:linear-gradient(135deg,#ef1f2c,#ff3441)!important;color:#fff!important;box-shadow:0 8px 18px rgba(238,31,44,.22)!important}

  html body.v8731-menu-open{overflow:hidden!important;touch-action:none!important}
  html body.public-site main,html body.rates-page main{padding-top:var(--v8731-header-height)!important}

  /* Remove the clear/bright band above the hero: the dark film starts at the first hero pixel. */
  html body.home-page .mobile-home-hero-v63{
    min-height:620px!important;height:auto!important;margin:0!important;padding:0!important;
    background-position:61% center!important;background-size:cover!important
  }
  html body.home-page .mobile-home-hero-v63::before{inset:0!important;top:0!important}
  html body.home-page .mh63-content{
    min-height:620px!important;padding:54px 24px 42px!important;display:flex!important;flex-direction:column!important;justify-content:center!important
  }
  html body.home-page .mh63-content h1{margin:12px 0 16px!important;max-width:9ch!important;font-size:clamp(43px,8.2vw,68px)!important;line-height:.97!important}
  html body.home-page .mh63-content p{max-width:38ch!important;margin-bottom:22px!important;font-size:clamp(15px,2.2vw,18px)!important}
  html body.home-page .mh63-actions{width:min(430px,100%)!important;display:grid!important;grid-template-columns:1fr 1fr!important;gap:10px!important}
  html body.home-page .mh63-actions .btn{min-height:50px!important;font-size:12px!important}
}
@media (max-width:600px){
  :root{--v8731-header-height:74px}
  html body.public-site .site-header,html body.rates-page .site-header,
  html body.public-site.menu-open .site-header,html body.rates-page.menu-open .site-header,
  html body[class*="mobile-menu-open"] .site-header,html body.v8731-menu-open .site-header{
    padding:7px 10px 7px 14px!important;grid-template-columns:minmax(0,1fr) 52px!important
  }
  html body.public-site .site-header .brand img,html body.rates-page .site-header .brand img{max-width:min(225px,100%)!important;max-height:58px!important}
  .v8731-mobile-menu{right:8px!important;width:calc(100vw - 16px)!important;max-height:calc(100dvh - var(--v8731-header-height) - 8px)!important}
  html body.home-page .mobile-home-hero-v63{min-height:690px!important;background-position:64% center!important}
  html body.home-page .mh63-content{min-height:690px!important;padding:46px 20px 34px!important}
  html body.home-page .mh63-content h1{max-width:8.6ch!important;font-size:clamp(42px,13vw,58px)!important}
  html body.home-page .mh63-content p{max-width:31ch!important;font-size:15px!important}
}
@media (max-width:360px){
  html body.public-site .site-header .brand img,html body.rates-page .site-header .brand img{max-width:min(205px,100%)!important}
  .v8731-mobile-auth{grid-template-columns:1fr!important}
  html body.home-page .mh63-actions{grid-template-columns:1fr!important}
  html body.home-page .mobile-home-hero-v63,html body.home-page .mh63-content{min-height:720px!important}
}
@media (min-width:1025px){.v8731-mobile-menu,.v8731-menu-backdrop{display:none!important}}
@media (prefers-reduced-motion:reduce){.v8731-mobile-menu,.v8731-menu-backdrop,.site-header .menu-toggle span{transition:none!important}}
