/* v2.0.127 — definitive mobile homepage hero containment.
 * Loaded after main.css to neutralize older hero experiments that used
 * !important desktop geometry and could create horizontal overflow.
 */
@media (max-width:820px){
  html,
  body{
    max-width:100%;
    overflow-x:hidden;
  }

  .home .lz-hero{
    width:100%!important;
    max-width:100%!important;
    overflow:hidden!important;
  }

  .home .lz-hero .lz-shell,
  .home .lz-hero__grid,
  .home .lz-hero__copy,
  .home .lz-hero__visual{
    min-width:0!important;
    max-width:100%!important;
    box-sizing:border-box!important;
  }

  .home .lz-hero__grid{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:24px!important;
    width:100%!important;
  }

  .home .lz-hero__copy{
    width:100%!important;
  }

  .home .lz-hero h1,
  .home .lz-hero .lz-lead{
    width:100%!important;
    max-width:100%!important;
    overflow-wrap:anywhere;
    word-break:normal;
  }

  .home .lz-hero__tags{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
  }

  .home .lz-hero__tags .lz-tag{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
    word-break:normal!important;
    box-sizing:border-box!important;
  }

  .home .lz-hero__visual{
    position:relative!important;
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    overflow:visible!important;
  }

  .home .lz-hero__visual>img{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    height:auto!important;
    margin:0!important;
  }
}

@media (max-width:620px){
  .home .lz-hero{
    padding:30px 0 24px!important;
  }

  .home .lz-hero .lz-shell{
    width:calc(100% - 24px)!important;
    max-width:calc(100% - 24px)!important;
    margin-inline:auto!important;
  }

  .home .lz-hero h1{
    margin-bottom:14px!important;
    font-size:clamp(2rem,10.4vw,2.8rem)!important;
    line-height:1.02!important;
    letter-spacing:-.035em!important;
  }

  .home .lz-hero .lz-lead{
    font-size:1rem!important;
    line-height:1.55!important;
  }

  .home .lz-hero .lz-actions{
    width:100%!important;
    max-width:100%!important;
    margin:20px 0!important;
  }

  .home .lz-hero .lz-actions .lz-button{
    width:100%!important;
    max-width:100%!important;
    box-sizing:border-box!important;
  }

  /* Route card becomes part of normal flow on phones. This removes the last
     absolute-positioned element that could visually escape the hero viewport. */
  .home .lz-hero__visual .lz-route-card{
    position:relative!important;
    inset:auto!important;
    left:auto!important;
    right:auto!important;
    top:auto!important;
    bottom:auto!important;
    width:calc(100% - 20px)!important;
    max-width:100%!important;
    margin:-18px auto 0!important;
    padding:14px 16px!important;
    box-sizing:border-box!important;
  }
}
