/* O2 Technologies - Mobile Homepage V4
   Strong mobile-only redesign. Desktop >= 761px is untouched. */
@media (max-width:760px){
  body{padding-bottom:58px}
  .utility-bar{display:none!important}

  .site-header{position:sticky;top:0;z-index:700;background:#fff}
  .header-inner{height:58px!important;min-height:58px;gap:10px}
  .brand{width:104px!important;flex:0 0 104px!important;height:54px!important;align-self:auto!important;justify-content:flex-start!important}
  .brand img{width:100px!important;max-height:52px!important;object-fit:contain}
  .menu-toggle{display:inline-flex!important;min-width:68px!important;min-height:38px!important;padding:0 13px!important;border-radius:8px!important;font-size:13px!important;margin-left:auto!important}
  .header-quote{display:none!important}
  .main-nav{top:100%!important;max-height:calc(100vh - 58px)!important;padding:8px 14px 16px!important}
  .main-nav>a,.nav-dropdown>button{min-height:44px!important;padding:0 8px!important;font-size:13px!important}

  .hero{min-height:660px!important;height:auto!important;background:
    linear-gradient(180deg,rgba(2,9,20,.06) 0%,rgba(2,9,20,.10) 27%,rgba(2,9,20,.72) 43%,#07111d 59%,#07111d 100%),
    url(../images/homepage-hero-v19.jpg) center top/cover no-repeat!important;
    color:#fff}
  .hero-content{min-height:660px!important;padding:275px 0 28px!important;justify-content:flex-start!important}
  .hero h1{font-size:clamp(43px,12.7vw,58px)!important;line-height:.91!important;letter-spacing:-.045em!important;max-width:100%!important;margin:0 0 16px!important;text-shadow:0 3px 18px rgba(0,0,0,.34)}
  .hero p{font-size:15.5px!important;line-height:1.48!important;max-width:96%!important;margin:0 0 18px!important}
  .hero-actions{display:grid!important;grid-template-columns:1fr 1fr!important;gap:9px!important;width:100%!important;margin:0!important}
  .hero-actions .btn{width:100%!important;min-height:47px!important;padding:0 10px!important;font-size:10.5px!important;border-radius:6px!important}
  .hero-proof{display:none!important}

  .quick-actions{position:fixed!important;left:auto!important;right:14px!important;top:auto!important;bottom:12px!important;transform:none!important;width:auto!important;display:flex!important;gap:7px!important;background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important;overflow:visible!important;z-index:800!important}
  .quick-actions a{width:46px!important;height:46px!important;min-width:46px!important;border:2px solid #fff!important;border-radius:50%!important;box-shadow:0 5px 18px rgba(0,0,0,.28)!important;gap:0!important}
  .quick-actions svg{width:21px!important;height:21px!important}
  .quick-actions span{display:none!important}

  .compact-section{padding:32px 0 20px!important}
  .section-heading{margin-bottom:17px!important}
  .section-heading h2{font-size:25px!important;line-height:1.1!important}

  .site-footer{padding-bottom:0!important}
  .footer-grid{grid-template-columns:1fr 1fr!important;gap:18px 16px!important;padding:24px 0 18px!important}
  .footer-about{grid-column:1/-1!important;display:grid!important;grid-template-columns:88px 1fr!important;align-items:center!important;gap:14px!important}
  .footer-about img{width:88px!important;margin:0!important}
  .footer-about p{font-size:10.5px!important;line-height:1.4!important;margin:0!important}
  .footer-solutions{grid-column:1/-1!important}
  .footer-solutions .two-col{grid-template-columns:1fr 1fr!important;column-gap:14px!important}
  .site-footer h3{font-size:12px!important;margin-bottom:8px!important}
  .site-footer a,.site-footer p{font-size:10.5px!important;line-height:1.35!important;margin:5px 0!important}
  .footer-social-links{padding:13px 0!important;gap:10px!important;flex-wrap:nowrap!important}
  .footer-social-links .footer-social-label{font-size:12px!important;width:auto!important;margin:0 auto 0 0!important}
  .footer-social-links a{width:34px!important;height:34px!important;flex:0 0 34px!important}
  .footer-social-links .social-icon{width:18px!important;height:18px!important}
  .footer-bottom>div{display:flex!important;flex-direction:column!important;align-items:flex-start!important;gap:5px!important;min-height:0!important;padding:10px 0 70px!important}
  .footer-bottom span{display:block!important;margin:0!important;font-size:10.5px!important}
}

@media (max-width:480px){
  .container,.wide-container{width:calc(100% - 28px)!important}
  .hero{min-height:640px!important;background:
    linear-gradient(180deg,rgba(2,9,20,.02) 0%,rgba(2,9,20,.08) 29%,rgba(2,9,20,.76) 43%,#07111d 58%,#07111d 100%),
    url(../images/homepage-hero-v19.jpg) 61% top/auto 315px no-repeat,#07111d!important}
  .hero-content{min-height:640px!important;padding-top:270px!important}
  .hero h1{font-size:clamp(42px,13.2vw,52px)!important}
  .hero p{font-size:15px!important;max-width:100%!important}
  .hero-actions{grid-template-columns:1fr!important}
  .hero-actions .btn{min-height:46px!important;font-size:11px!important}
  .quick-actions{right:10px!important;gap:5px!important}
  .quick-actions a{width:43px!important;height:43px!important;min-width:43px!important}
  .footer-grid{grid-template-columns:1fr 1fr!important}
  .footer-about,.footer-solutions{grid-column:1/-1!important}
}

/* V4 refinements: keep hero CTAs clear; add fifth social icon cleanly. */
@media (max-width:760px){
  .quick-actions{opacity:0!important;pointer-events:none!important;transform:translateY(12px)!important;transition:opacity .2s ease,transform .2s ease!important}
  .quick-actions.mobile-qa-visible{opacity:1!important;pointer-events:auto!important;transform:none!important}
  .footer-social-links{gap:8px!important}
  .footer-social-links a{width:32px!important;height:32px!important;flex-basis:32px!important}
  .footer-social-links .footer-social-label{font-size:11.5px!important}
}
@media (max-width:390px){
  .footer-social-links{gap:6px!important}
  .footer-social-links a{width:30px!important;height:30px!important;flex-basis:30px!important}
  .footer-social-links .footer-social-label{font-size:11px!important}
}


/* V5 social polish: branded, high-contrast social buttons */
@media(max-width:760px){
  .footer-social-links{align-items:center!important;gap:9px!important;flex-wrap:wrap!important}
  .footer-social-links .footer-social-label{width:100%!important;font-size:15px!important;font-weight:800!important;margin:0 0 5px!important;color:#13233b!important}
  .footer-social-links a{width:40px!important;height:40px!important;flex:0 0 40px!important;border:0!important;border-radius:12px!important;color:#fff!important;box-shadow:0 5px 13px rgba(6,25,48,.18)!important;position:relative!important;overflow:hidden!important}
  .footer-social-links a::after{content:"";position:absolute;inset:0;background:linear-gradient(145deg,rgba(255,255,255,.28),transparent 52%);pointer-events:none}
  .footer-social-links .social-icon{width:21px!important;height:21px!important;position:relative;z-index:1}
  .footer-social-links .social-linkedin{background:#0a66c2!important}
  .footer-social-links .social-instagram{background:radial-gradient(circle at 30% 107%,#fdf497 0 6%,#fd5949 40%,#d6249f 62%,#285aeb 92%)!important}
  .footer-social-links .social-facebook{background:#1877f2!important}
  .footer-social-links .social-tiktok{background:#111!important}
  .footer-social-links .social-youtube{background:#ff0033!important}
}
