/* =========================================================
   V47 — Mobile layout polish
   Fixes the narrow/blank-right-column appearance seen on phone,
   removes the oversized header CTA on mobile, and balances Home hero.
   ========================================================= */

html,
body{
  width:100%;
  max-width:100%;
  overflow-x:hidden;
}

@supports (overflow:clip){
  html,
  body{
    overflow-x:clip;
  }
}

img,
svg,
video,
iframe{
  max-width:100%;
}

/* Header: mobile must be logo + hamburger only.
   This intentionally has higher specificity than the older V28 CTA rules. */
@media (max-width:1080px){
  .nav{
    width:100% !important;
    max-width:100% !important;
  }

  .nav .nav-inner{
    width:calc(100% - 24px) !important;
    max-width:none !important;
    min-height:72px !important;
    margin-inline:auto !important;
    padding:0 !important;
    gap:10px !important;
  }

  .nav .brand{
    min-width:0 !important;
    flex:1 1 auto !important;
    gap:10px !important;
    overflow:hidden;
  }

  .nav .brand img{
    width:42px !important;
    height:42px !important;
    flex:0 0 42px !important;
  }

  .nav .brand strong{
    max-width:190px !important;
    font-size:.84rem !important;
    line-height:1.03 !important;
    white-space:normal !important;
  }

  .nav .nav-links,
  .nav .nav-phone{
    display:none !important;
  }

  .nav .nav-actions{
    margin-left:auto !important;
    flex:0 0 auto !important;
    gap:8px !important;
  }

  .nav .nav-actions a.btn.primary.nav-cta,
  .nav .nav-actions a.nav-cta,
  .nav .nav-actions .nav-cta,
  .nav-cta{
    display:none !important;
  }

  .nav .menu-toggle,
  .menu-toggle{
    display:block !important;
    flex:0 0 44px !important;
    width:44px !important;
    height:44px !important;
    margin:0 !important;
  }

  .mobile-menu{
    width:100% !important;
    max-width:100% !important;
  }
}

/* Unified floating quick-contact buttons on phone. */
@media (max-width:820px){
  .mobile-actions{
    position:fixed !important;
    right:14px !important;
    bottom:14px !important;
    z-index:1200 !important;
    display:flex !important;
    flex-direction:column !important;
    gap:9px !important;
    width:auto !important;
    max-width:none !important;
  }

  .mobile-actions a{
    width:50px !important;
    height:50px !important;
    min-width:50px !important;
    min-height:50px !important;
    margin:0 !important;
    padding:0 !important;
    border-radius:13px !important;
    display:grid !important;
    place-items:center !important;
    box-shadow:0 10px 26px rgba(5,24,12,.22) !important;
  }

  .mobile-actions a img{
    width:23px !important;
    height:23px !important;
  }
}

/* HOME — cleaner mobile composition. */
@media (max-width:760px){
  body.home-page{
    padding-bottom:76px !important;
  }

  body.home-page .hero{
    width:100% !important;
    min-height:0 !important;
    overflow:hidden !important;
  }

  body.home-page .hero-bg{
    width:100% !important;
    background-position:58% top !important;
    transform:none !important;
  }

  body.home-page .hero-inner{
    width:calc(100% - 32px) !important;
    max-width:none !important;
    grid-template-columns:minmax(0,1fr) !important;
    padding:46px 0 28px !important;
    gap:28px !important;
  }

  body.home-page .hero-copy{
    width:100% !important;
    max-width:none !important;
    min-width:0 !important;
    padding-top:0 !important;
  }

  body.home-page .hero-kicker{
    max-width:100% !important;
    margin-bottom:16px !important;
    font-size:.66rem !important;
    line-height:1.45 !important;
    letter-spacing:.12em !important;
  }

  body.home-page .hero-kicker:before{
    width:24px !important;
    flex:0 0 24px !important;
  }

  body.home-page .hero h1{
    width:100% !important;
    max-width:100% !important;
    margin-bottom:18px !important;
    font-size:clamp(2.55rem,10.5vw,3.25rem) !important;
    line-height:.99 !important;
    letter-spacing:-.035em !important;
  }

  body.home-page .hero-copy > p{
    max-width:100% !important;
    margin-bottom:24px !important;
    font-size:.98rem !important;
    line-height:1.62 !important;
  }

  body.home-page .hero-actions{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:10px !important;
    margin-bottom:24px !important;
  }

  body.home-page .hero-actions .btn{
    width:100% !important;
    min-height:50px !important;
    flex:none !important;
  }

  body.home-page .hero-proof{
    display:flex !important;
    align-items:center !important;
    gap:8px 12px !important;
    font-size:.78rem !important;
    line-height:1.35 !important;
  }

  body.home-page .hero-proof > span{
    white-space:nowrap;
  }

  body.home-page .hero-proof .divider{
    display:none !important;
  }

  body.home-page .quote-card{
    width:100% !important;
    max-width:100% !important;
    margin:0 !important;
    border-radius:10px !important;
    overflow:hidden !important;
  }

  body.home-page .quote-head{
    padding:18px 18px 15px !important;
  }

  body.home-page .quote-head h2{
    font-size:1.06rem !important;
    line-height:1.18 !important;
  }

  body.home-page .quote-body{
    padding:18px !important;
  }

  body.home-page .quote-grid{
    grid-template-columns:1fr !important;
    gap:11px !important;
  }

  body.home-page .field.full{
    grid-column:auto !important;
  }

  body.home-page .field input,
  body.home-page .field select,
  body.home-page .field textarea{
    min-height:46px !important;
    font-size:16px !important; /* prevents mobile browser zoom on focus */
  }

  body.home-page .field textarea{
    min-height:92px !important;
  }
}

@media (max-width:420px){
  .nav .nav-inner{
    width:calc(100% - 20px) !important;
  }

  .nav .brand strong{
    max-width:160px !important;
    font-size:.79rem !important;
  }

  body.home-page .hero-inner{
    width:calc(100% - 28px) !important;
  }

  body.home-page .hero h1{
    font-size:clamp(2.38rem,10.7vw,2.85rem) !important;
  }
}