
/* ==========================================================
   V58 - ZOOM-OUT SAFE RESPONSIVE SCALE
   Fixes the layout when browser zoom is reduced:
   - hero no longer shrinks into a small centered island
   - typography scales with the widened CSS viewport
   - images keep their aspect ratio
   - partner / stats / about remain readable and proportional
   Normal desktop (<1800 CSS px) remains unchanged.
   ========================================================== */

@media (min-width:1800px){
  html,body{max-width:100%;overflow-x:clip!important}

  .container,
  .hero .container{
    width:92vw!important;
    max-width:none!important;
  }

  /* Header */
  .topbar{
    height:clamp(28px,1.65vw,96px)!important;
    font-size:clamp(11px,.66vw,38px)!important;
  }
  .top-left,.top-right{gap:clamp(22px,1.25vw,70px)!important}

  .navbar{height:clamp(62px,3.7vw,210px)!important}
  .brand img{width:clamp(205px,12vw,680px)!important}
  .nav{gap:clamp(29px,1.6vw,90px)!important}
  .nav a{
    font-size:clamp(12px,.72vw,42px)!important;
    padding:clamp(22px,1.28vw,72px) 0!important;
  }
  .nav .quote{
    margin-left:clamp(17px,1vw,56px)!important;
    padding:clamp(12px,.70vw,40px) clamp(19px,1.10vw,64px)!important;
  }

  /* Hero */
  .hero .container{
    min-height:clamp(440px,26vw,1500px)!important;
    height:auto!important;
    grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr)!important;
    align-items:stretch!important;
  }
  .hero-copy{
    min-width:0!important;
    align-self:center!important;
    padding:clamp(34px,2vw,120px) clamp(28px,1.65vw,96px)
            clamp(34px,2vw,120px) 0!important;
  }
  .eyebrow{font-size:clamp(11px,.66vw,38px)!important}

  .hero h1{
    font-size:clamp(52px,3.15vw,180px)!important;
    line-height:1.02!important;
    letter-spacing:-.045em!important;
  }
  .hero h2{
    font-size:clamp(24px,1.45vw,82px)!important;
    max-width:34vw!important;
  }
  .hero p{
    font-size:clamp(13px,.78vw,44px)!important;
    line-height:1.58!important;
    max-width:34vw!important;
  }

  .btn{
    height:clamp(40px,2.35vw,132px)!important;
    padding:0 clamp(22px,1.30vw,74px)!important;
    font-size:clamp(12px,.70vw,40px)!important;
  }

  .hero-trust{
    gap:clamp(23px,1.35vw,76px)!important;
    margin-top:clamp(13px,.78vw,44px)!important;
    font-size:clamp(10px,.62vw,36px)!important;
  }
  .hero-trust span:before{
    width:clamp(16px,.95vw,54px)!important;
    height:clamp(16px,.95vw,54px)!important;
    margin-right:clamp(6px,.35vw,20px)!important;
    font-size:clamp(9px,.52vw,30px)!important;
  }

  .hero-media{
    position:relative!important;
    min-width:0!important;
    min-height:clamp(440px,26vw,1500px)!important;
    height:auto!important;
    margin:0!important;
    overflow:hidden!important;
  }
  .hero-media>img{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    max-width:none!important;
    min-height:0!important;
    object-fit:cover!important;
    object-position:center center!important;
    transform:none!important;
  }

  .hero-solutions.tech-timeline{
    position:absolute!important;
    left:auto!important;
    top:auto!important;
    right:clamp(20px,1.3vw,74px)!important;
    bottom:clamp(18px,1.15vw,64px)!important;
    width:clamp(300px,18vw,1000px)!important;
    max-width:none!important;
    max-height:calc(100% - 36px)!important;
    margin:0!important;
  }

  .hero-solution.tech-card{
    width:100%!important;
    max-width:100%!important;
    min-height:clamp(57px,3.4vw,190px)!important;
    grid-template-columns:clamp(38px,2.25vw,126px) 1fr clamp(24px,1.4vw,80px)!important;
    gap:clamp(8px,.52vw,30px)!important;
    padding:clamp(7px,.48vw,28px) clamp(9px,.58vw,34px)!important;
  }
  .hero-solution.tech-card .tech-icon{
    width:clamp(38px,2.25vw,126px)!important;
    height:clamp(38px,2.25vw,126px)!important;
  }
  .hero-solution.tech-card b{font-size:clamp(12px,.72vw,42px)!important}
  .hero-solution.tech-card small{font-size:clamp(9px,.52vw,30px)!important}

  /* Section rhythm */
  .products,.partners,.about-ref,.ref-block,.ref-news,.ref-cta,
  .content-section,.content-band,.process-section,.subpage-intro,
  .service-hero-visual,.operations-showcase,.contact-visual-section{
    padding-top:clamp(20px,1.25vw,72px)!important;
    padding-bottom:clamp(20px,1.25vw,72px)!important;
  }

  .section-head,.ref-head,.partner-head-row{
    gap:clamp(20px,1.2vw,70px)!important;
    margin-bottom:clamp(9px,.65vw,38px)!important;
  }

  .section-link,.ref-head a,.partner-head-row .section-link{
    font-size:clamp(11px,.66vw,38px)!important;
  }
  .ref-head h2{
    font-size:clamp(14px,.84vw,48px)!important;
  }

  /* Cards / images */
  .category-grid,.ref-card-grid,.projects-row,.news-ref-grid{
    gap:clamp(14px,.85vw,48px)!important;
  }

  .category-image img,
  .ref-card img,
  .news-ref-card img,
  .project-card img,
  .subpage-media img,
  .about-ref-image img,
  .company-story-grid img,
  .contact-visual-grid img,
  .operations-grid img,
  .service-hero-visual img,
  .detail-hero img{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    object-fit:cover!important;
    object-position:center!important;
  }

  .category-body,.ref-card-body,.news-ref-body{
    padding:clamp(12px,.76vw,42px)!important;
  }

  .category-body h3,.ref-card-body h3,.news-ref-body h3{
    font-size:clamp(14px,.84vw,48px)!important;
    line-height:1.35!important;
  }

  .category-body p,.ref-card-body p,.news-ref-body p,
  .about-ref-copy>p,.footer p,.footer a{
    font-size:clamp(13px,.76vw,44px)!important;
    line-height:1.55!important;
  }

  .ref-card-body small,.news-ref-body time{
    font-size:clamp(10px,.60vw,34px)!important;
  }

  .card-link{
    margin-top:clamp(10px,.60vw,34px)!important;
    font-size:clamp(10px,.60vw,34px)!important;
  }

  /* Partners */
  .partner-title{gap:clamp(10px,.60vw,34px)!important}
  .partner-title:before{
    width:clamp(50px,3vw,170px)!important;
    height:clamp(3px,.18vw,10px)!important;
  }
  .partner-title strong{font-size:clamp(13px,.78vw,44px)!important}

  .partner-shell,.brand-stage,.brand-track{
    height:clamp(72px,4.3vw,245px)!important;
  }
  .brand-stage{padding:0 clamp(36px,2.15vw,120px)!important}

  .brand-item{
    flex-basis:clamp(108px,6.45vw,370px)!important;
    height:clamp(63px,3.75vw,215px)!important;
    margin:0 clamp(2px,.12vw,8px)!important;
    padding:clamp(5px,.30vw,18px) clamp(6px,.36vw,20px)!important;
  }
  .brand-item img{max-height:clamp(52px,3.1vw,178px)!important}

  /* Stats */
  .stats{height:clamp(88px,5.25vw,300px)!important}
  .stats .container{
    width:92vw!important;
    max-width:none!important;
  }
  .stat{
    gap:clamp(12px,.72vw,42px)!important;
    padding:0 clamp(10px,.60vw,34px)!important;
  }
  .stat .icon{
    width:clamp(44px,2.65vw,150px)!important;
    height:clamp(44px,2.65vw,150px)!important;
  }
  .stat b{font-size:clamp(27px,1.62vw,92px)!important}
  .stat span{font-size:clamp(10px,.62vw,36px)!important}
  .stat-callout{
    padding:0 clamp(58px,3.5vw,200px) 0 clamp(28px,1.7vw,96px)!important;
    font-size:clamp(17px,1.02vw,58px)!important;
  }

  /* About */
  .about-ref-grid{
    width:92vw!important;
    max-width:none!important;
    grid-template-columns:38% 37% 23%!important;
    gap:1%!important;
  }
  .about-ref-media{
    min-height:clamp(280px,16.8vw,960px)!important;
  }
  .about-ref-copy{
    padding:clamp(4px,.25vw,14px) clamp(8px,.50vw,28px)!important;
  }
  .ref-section-label{
    font-size:clamp(10px,.62vw,36px)!important;
    border-left-width:clamp(34px,2vw,114px)!important;
    padding-left:clamp(8px,.48vw,28px)!important;
  }
  .about-ref-copy h2{
    font-size:clamp(24px,1.45vw,82px)!important;
  }
  .about-ref-benefits{
    gap:clamp(6px,.36vw,20px)!important;
    margin:clamp(13px,.78vw,44px) 0!important;
  }
  .about-ref-benefits span{
    width:clamp(31px,1.86vw,106px)!important;
    height:clamp(31px,1.86vw,106px)!important;
    font-size:clamp(14px,.84vw,48px)!important;
  }
  .about-ref-benefits b{font-size:clamp(9px,.56vw,32px)!important}
  .ref-value b{font-size:clamp(11px,.66vw,38px)!important}
  .ref-value p{
    font-size:clamp(9px,.56vw,32px)!important;
    line-height:1.45!important;
  }

  /* Footer */
  .footer{
    padding:clamp(24px,1.45vw,82px) 0 clamp(12px,.72vw,42px)!important;
  }
  .footer-grid{
    gap:clamp(28px,1.7vw,96px)!important;
    grid-template-columns:1.3fr .9fr .9fr .9fr minmax(130px,7.8vw)!important;
  }
  .footer-logo{width:clamp(210px,12.6vw,720px)!important}
  .footer-title,.footer h4{font-size:clamp(11px,.66vw,38px)!important}
  .footer-bottom{font-size:clamp(9px,.56vw,32px)!important}
}
