/* v133: Mobile homepage compact mode + global back-to-top button.
   Desktop page layout is intentionally untouched except for the small back-to-top button. */

/* Back to top: all pages */
.hl3c-backtop{
  position:fixed!important;
  right:22px!important;
  bottom:28px!important;
  z-index:5200!important;
  width:48px!important;
  height:48px!important;
  border-radius:999px!important;
  border:1px solid rgba(255,255,255,.72)!important;
  background:linear-gradient(135deg,rgba(37,50,74,.96),rgba(69,104,240,.92))!important;
  color:#fff!important;
  box-shadow:0 16px 36px rgba(15,23,42,.26)!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  font-size:22px!important;
  font-weight:900!important;
  line-height:1!important;
  cursor:pointer!important;
  opacity:0!important;
  pointer-events:none!important;
  transform:translateY(10px) scale(.96)!important;
  transition:opacity .18s ease, transform .18s ease, filter .18s ease!important;
  backdrop-filter:blur(12px)!important;
}
.hl3c-backtop:hover{filter:brightness(1.08)!important;transform:translateY(6px) scale(1)!important;}
body.hl3c-backtop-visible .hl3c-backtop{
  opacity:1!important;
  pointer-events:auto!important;
  transform:translateY(0) scale(1)!important;
}

@media (max-width:820px){
  /* Keep the floating button above the mobile browser bottom toolbar. */
  .hl3c-backtop{
    right:16px!important;
    bottom:calc(84px + env(safe-area-inset-bottom, 0px))!important;
    width:46px!important;
    height:46px!important;
    font-size:21px!important;
    box-shadow:0 12px 28px rgba(15,23,42,.24)!important;
  }

  /* Homepage compact reading mode: reduce vertical length without changing desktop. */
  .brand-v4-hero{
    padding-top:34px!important;
    padding-bottom:30px!important;
  }
  .brand-v4-hero h1{
    font-size:clamp(32px,10vw,48px)!important;
    line-height:1.08!important;
    margin-bottom:12px!important;
  }
  .brand-v4-hero p,
  .brand-v4-hero-copy p{
    font-size:15.5px!important;
    line-height:1.72!important;
    margin-top:10px!important;
    margin-bottom:10px!important;
  }
  .brand-v4-search{
    margin-top:14px!important;
    margin-bottom:10px!important;
  }
  .brand-v4-actions{
    gap:8px!important;
    margin-top:10px!important;
  }

  .brand-v4-section,
  .brand-v4-catalog,
  .brand-v4-scenarios,
  .brand-v4-featured,
  .brand-v4-trust,
  .brand-v4-cta{
    padding-top:28px!important;
    padding-bottom:30px!important;
  }

  .brand-v4-section-head{
    margin-bottom:14px!important;
    gap:10px!important;
  }
  .brand-v4-section-head h2{
    font-size:clamp(24px,7.4vw,34px)!important;
    line-height:1.15!important;
    margin-bottom:6px!important;
  }
  .brand-v4-section-head p{
    font-size:15px!important;
    line-height:1.65!important;
    display:-webkit-box!important;
    -webkit-line-clamp:2!important;
    -webkit-box-orient:vertical!important;
    overflow:hidden!important;
  }

  /* Cards become horizontal swipe rows on mobile to reduce long vertical scrolling. */
  .brand-v4-catalog-grid,
  .brand-v4-scenario-grid,
  .brand-v4-product-grid,
  .brand-v4-trust-grid{
    display:flex!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    gap:12px!important;
    padding:4px 2px 14px!important;
    scroll-snap-type:x proximity!important;
    -webkit-overflow-scrolling:touch!important;
  }
  .brand-v4-catalog-grid::-webkit-scrollbar,
  .brand-v4-scenario-grid::-webkit-scrollbar,
  .brand-v4-product-grid::-webkit-scrollbar,
  .brand-v4-trust-grid::-webkit-scrollbar{height:6px!important;}
  .brand-v4-catalog-grid::-webkit-scrollbar-thumb,
  .brand-v4-scenario-grid::-webkit-scrollbar-thumb,
  .brand-v4-product-grid::-webkit-scrollbar-thumb,
  .brand-v4-trust-grid::-webkit-scrollbar-thumb{
    background:rgba(37,50,74,.22)!important;
    border-radius:999px!important;
  }

  .brand-v4-catalog-card,
  .brand-v4-scenario-card,
  .brand-v4-product-card,
  .brand-v4-trust-grid > *,
  .brand-v4-trust-card .brand-v4-trust-grid > *{
    flex:0 0 min(78vw, 318px)!important;
    width:min(78vw, 318px)!important;
    min-width:min(78vw, 318px)!important;
    scroll-snap-align:start!important;
  }

  .brand-v4-catalog-card,
  .brand-v4-scenario-card,
  .brand-v4-product-card{
    padding:16px!important;
    border-radius:22px!important;
  }
  .brand-v4-scenario-card p,
  .brand-v4-product-body p,
  .brand-v4-catalog-card p{
    display:-webkit-box!important;
    -webkit-line-clamp:2!important;
    -webkit-box-orient:vertical!important;
    overflow:hidden!important;
    line-height:1.55!important;
  }
  .brand-v4-cat-photo,
  .brand-v4-product-img{
    max-height:170px!important;
    overflow:hidden!important;
  }

  /* Trust/why block and CTA: keep, but tighter. */
  .brand-v4-trust-card{
    padding:20px 16px!important;
    border-radius:24px!important;
  }
  .brand-v4-trust-card h2,
  .brand-v4-cta h2{
    font-size:clamp(24px,7vw,34px)!important;
    line-height:1.18!important;
  }
  .brand-v4-cta p{
    font-size:15px!important;
    line-height:1.65!important;
  }

  /* Footer/contact mobile spacing also slightly tightened, but content stays visible. */
  .footer-v62,
  .footer-v62-main,
  .footer-v62-bottom{
    padding-top:22px!important;
    padding-bottom:22px!important;
  }
}
