/* EZY2BRAND FINAL RESPONSIVE OVERRIDES — 2026-09-12
   Loaded after page + cyber CSS. Designed for 320px phones through desktop. */

:root{--ezy-safe-x:clamp(12px,4vw,22px)}
html,body{width:100%;max-width:100%;overflow-x:hidden!important}
body{min-width:0}
*,*::before,*::after{box-sizing:border-box}
img,video,svg,canvas,iframe{max-width:100%;height:auto}
video{display:block}
button,input,select,textarea{max-width:100%;font:inherit}
input,select,textarea{min-width:0}
pre,code{max-width:100%;overflow:auto}
.container,.ezy-tech-container{min-width:0}

/* ---------- shared technology header ---------- */
@media(max-width:1100px){
  .ezy-tech-nav-row{gap:12px!important}
  .ezy-tech-brand{min-width:0!important;flex:0 1 auto}
  .ezy-tech-brand-text{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .ezy-tech-nav{gap:2px!important}
  .ezy-tech-nav a{padding:10px 9px!important;font-size:12px!important}
}
@media(max-width:860px){
  .ezy-tech-shell{z-index:5000!important}
  .ezy-tech-container{width:calc(100% - 24px)!important;max-width:none!important}
  .ezy-tech-announcement .ezy-tech-container{justify-content:center!important;flex-wrap:wrap!important}
  .ezy-tech-info .ezy-tech-container{gap:10px!important}
  .ezy-tech-nav-row{min-height:68px!important;gap:8px!important}
  .ezy-tech-brand{max-width:calc(100% - 58px)!important;font-size:19px!important;gap:9px!important}
  .ezy-tech-brand-img,.ezy-tech-brand-mark{width:43px!important;height:43px!important;flex:0 0 43px!important}
  .ezy-tech-brand-text{max-width:210px!important}
  .ezy-tech-menu-btn{width:44px!important;height:44px!important;flex:0 0 44px!important}
  .ezy-tech-nav{width:min(88vw,360px)!important;max-width:360px!important;padding:82px 16px 24px!important;padding-bottom:max(24px,env(safe-area-inset-bottom))!important}
  .ezy-tech-nav a{min-height:46px!important;display:flex!important;align-items:center!important;font-size:15px!important;padding:12px 14px!important}
  .ezy-tech-mobile-actions a{min-height:46px!important}
}
@media(max-width:600px){
  .ezy-tech-announcement .ezy-tech-container{width:calc(100% - 20px)!important;min-height:40px!important;padding:7px 0!important;gap:6px!important}
  .ezy-tech-announcement span{font-size:10px!important;line-height:1.25!important;max-width:calc(100% - 78px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .ezy-tech-announcement a{flex:0 0 auto!important}
  .ezy-tech-info .ezy-tech-container{width:calc(100% - 20px)!important;min-height:36px!important}
  .ezy-tech-info-left{max-width:64%!important;font-size:10px!important}
  .ezy-tech-info-right{margin-left:auto!important;gap:8px!important}
  .ezy-tech-brand-text{font-size:17px!important;max-width:170px!important}
  .ezy-tech-brand-text small{display:none!important}
}
@media(max-width:400px){
  .ezy-tech-announcement span{max-width:calc(100% - 70px)}
  .ezy-tech-info-left{max-width:55%!important}
  .ezy-tech-brand-text{font-size:15px!important;max-width:145px!important}
  .ezy-tech-brand-img,.ezy-tech-brand-mark{width:39px!important;height:39px!important;flex-basis:39px!important}
  .ezy-tech-nav-row{min-height:62px!important}
}

/* ---------- public page heroes ---------- */
body.ezy-tech-inner-page > .hero{min-height:0!important}
@media(max-width:820px){
  body.ezy-tech-inner-page > .hero{padding:58px 0 50px!important}
  body.ezy-tech-inner-page > .hero .container{width:calc(100% - 28px)!important}
  body.ezy-tech-inner-page > .hero h1{font-size:clamp(34px,9vw,54px)!important;line-height:1.04!important;letter-spacing:-1.5px!important;max-width:100%!important;overflow-wrap:anywhere}
  body.ezy-tech-inner-page > .hero p{font-size:15px!important;line-height:1.65!important;max-width:100%!important}
}
@media(max-width:480px){
  body.ezy-tech-inner-page > .hero{padding:46px 0 42px!important}
  body.ezy-tech-inner-page > .hero h1{font-size:clamp(31px,10vw,42px)!important;letter-spacing:-1px!important}
  body.ezy-tech-inner-page > .hero p{font-size:14px!important}
  .hero-badges{gap:7px!important;margin-top:18px!important}
  .hero-badges span{font-size:10px!important;padding:7px 9px!important}
}

/* ---------- homepage hero / sliders ---------- */
@media(max-width:980px){
  .hero-depth-panel{opacity:.55!important;transform:scale(.88)!important;transform-origin:right center!important}
  .managed-hero,.video-hero,.managed-slide .slide-content,.video-hero .slide-content,.slide,.slide-content{height:auto!important;min-height:560px!important}
}
@media(max-width:720px){
  .managed-hero,.video-hero,.managed-slide .slide-content,.video-hero .slide-content,.slide,.slide-content{min-height:590px!important}
  .hero-copy,.video-hero .hero-copy,.managed-slide .hero-copy{max-width:100%!important;padding:46px 28px 104px 28px!important;margin:0!important}
  .hero h1{font-size:clamp(34px,10.4vw,48px)!important;line-height:1.04!important;letter-spacing:-1.35px!important;margin:14px 0 16px!important;overflow-wrap:anywhere}
  .hero p{font-size:15px!important;line-height:1.6!important;max-width:100%!important;margin-bottom:22px!important}
  .hero .eyebrow{font-size:10px!important;letter-spacing:.07em!important;padding:7px 10px!important;max-width:100%!important;white-space:normal!important}
  .hero-actions{display:grid!important;grid-template-columns:1fr!important;gap:9px!important;width:min(100%,360px)!important}
  .hero-actions .btn{width:100%!important;min-height:48px!important;padding:12px 15px!important}
  .hero-depth-panel{display:none!important}
  .managed-media,.hero-video-media{object-position:center center!important}
  .managed-slide:before,.hero.video-hero:before,.slide-bg:after{background:linear-gradient(90deg,rgba(2,8,18,.92) 0%,rgba(2,8,18,.82) 52%,rgba(2,8,18,.58) 100%)!important}
  .hero .slide-arrow{top:auto!important;bottom:24px!important;transform:none!important;width:42px!important;height:42px!important;z-index:50!important}
  .hero .slide-arrow.prev{left:16px!important}
  .hero .slide-arrow.next{right:16px!important}
  .hero .slider-nav{bottom:34px!important;z-index:49!important}
  .video-status{right:14px!important;bottom:82px!important;font-size:0!important;width:42px!important;height:42px!important;padding:0!important;display:grid!important;place-items:center!important}
  .video-status i{font-size:13px!important;width:auto!important}
}
@media(max-width:420px){
  .managed-hero,.video-hero,.managed-slide .slide-content,.video-hero .slide-content,.slide,.slide-content{min-height:610px!important}
  .hero-copy,.video-hero .hero-copy,.managed-slide .hero-copy{padding:42px 18px 108px!important}
  .hero h1{font-size:clamp(31px,10.8vw,40px)!important}
  .hero p{font-size:14px!important}
  .hero .slide-arrow.prev{left:10px!important}.hero .slide-arrow.next{right:10px!important}
}
@media(max-width:360px){
  .managed-hero,.video-hero,.managed-slide .slide-content,.video-hero .slide-content,.slide,.slide-content{min-height:625px!important}
  .hero-copy,.video-hero .hero-copy,.managed-slide .hero-copy{padding-left:14px!important;padding-right:14px!important}
}

/* ---------- homepage content grids ---------- */
@media(max-width:900px){
  .trust .container{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .trust-item{border-bottom:1px solid var(--line)!important}
  .trust-item:nth-child(2n){border-right:0!important}
  .stats,.service-grid,.work-grid,.product-grid,.blog-grid,.testimonials,.cap-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .process,.why-grid,.faq-wrap{grid-template-columns:1fr!important;gap:28px!important}
  .footer-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .section-head{gap:18px!important}
}
@media(max-width:640px){
  section{padding:52px 0!important}
  .container{width:calc(100% - 24px)!important;max-width:none!important}
  .trust .container,.service-grid,.work-grid,.product-grid,.blog-grid,.testimonials,.cap-grid,.footer-grid{grid-template-columns:1fr!important}
  .trust-item{border-right:0!important;padding:16px 8px!important}
  .stats-wrap{width:calc(100% - 24px)!important;margin-top:20px!important}
  .stats{grid-template-columns:repeat(2,minmax(0,1fr))!important;border-radius:16px!important}
  .stat{padding:18px 8px!important;min-width:0!important}
  .stat strong{font-size:27px!important}
  .stat span{font-size:11px!important;line-height:1.3!important}
  .service-card,.blog-card,.faq-item,.cap-card,.why-panel,.insight-card,.quote,.step{border-radius:16px!important}
  .service-card{padding:21px!important;min-height:0!important}
  .section-head{margin-bottom:24px!important;align-items:flex-start!important;flex-direction:column!important}
  .section-head h2{font-size:clamp(29px,8.8vw,39px)!important;line-height:1.08!important;letter-spacing:-1px!important}
  .section-head p{font-size:14px!important;line-height:1.6!important}
  .work-card{aspect-ratio:4/3!important}
  .work-info{left:16px!important;right:16px!important;bottom:15px!important}
  .work-info h3{font-size:18px!important}
  .process-visual{min-height:310px!important;border-radius:18px!important}
  .floating-badge{left:12px!important;right:12px!important;bottom:12px!important;padding:14px!important;border-radius:13px!important}
  .step{grid-template-columns:40px minmax(0,1fr)!important;gap:12px!important;padding:14px!important}
  .step-num{width:40px!important;height:40px!important}
  .blog-body{padding:18px!important}
  .cta-box{padding:27px 20px!important;border-radius:18px!important;gap:18px!important}
  .cta-box h2{font-size:29px!important;line-height:1.1!important}
  .faq-q{padding:16px!important;gap:12px!important}
  .faq-a{padding:0 16px 16px!important}
  footer,.footer{padding:42px 0 22px!important}
  .footer-grid{gap:22px!important}
  .copyright{margin-top:24px!important;padding-top:16px!important;flex-direction:column!important;gap:8px!important}
}
@media(max-width:360px){
  .stats{grid-template-columns:1fr!important}
  .stat{border-right:0!important;border-bottom:1px solid var(--line)!important}
  .stat:last-child{border-bottom:0!important}
}

/* ---------- products ---------- */
@media(max-width:820px){
  .category-strip{position:relative!important;top:auto!important}
  .cat-scroll{display:flex!important;overflow-x:auto!important;overscroll-behavior-inline:contain;scroll-snap-type:x proximity;padding-bottom:8px!important;gap:8px!important;scrollbar-width:none}
  .cat-scroll::-webkit-scrollbar{display:none}
  .cat-pill{flex:0 0 auto!important;scroll-snap-align:start;white-space:nowrap!important}
  .content-head{gap:12px!important;align-items:flex-start!important;flex-direction:column!important}
  .products-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:560px){
  .products-grid{grid-template-columns:1fr!important}
  .product-card{min-width:0!important}
  .product-image{height:auto!important;aspect-ratio:16/10!important}
  .product-body{padding:17px!important}
  .product-btn{min-height:46px!important}
  .pagination{display:flex!important;flex-wrap:wrap!important;justify-content:center!important;gap:7px!important}
}

/* ---------- services/pricing ---------- */
@media(max-width:900px){
  .service-top{grid-template-columns:1fr!important;gap:16px!important}
  .price-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:620px){
  .services{padding:42px 0!important}
  .service-block{border-radius:18px!important;margin-bottom:18px!important}
  .service-top{padding:19px!important}
  .service-top h2{font-size:27px!important}
  .service-icon{width:54px!important;height:54px!important;border-radius:16px!important}
  .price-grid{grid-template-columns:1fr!important;padding:13px!important;gap:12px!important}
  .plan{padding:18px!important;border-radius:16px!important}
  .plan p{min-height:0!important}
  .features li{align-items:flex-start!important}
}

/* ---------- portfolio/blog/contact ---------- */
@media(max-width:900px){
  .portfolio-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .contact-section{grid-template-columns:1fr!important;gap:18px!important}
}
@media(max-width:620px){
  .portfolio-grid{grid-template-columns:1fr!important;gap:16px!important}
  .portfolio-card{border-radius:16px!important;overflow:hidden!important}
  .portfolio-image{height:auto!important;aspect-ratio:4/3!important}
  .portfolio-info{padding:17px!important}
  .articles-list{display:grid!important;gap:16px!important}
  .article-card{grid-template-columns:1fr!important;border-radius:16px!important;overflow:hidden!important;margin:0!important}
  .article-image{min-height:0!important;height:auto!important;aspect-ratio:16/9!important;order:-1!important}
  .article-content{padding:18px!important}
  .article-title{font-size:20px!important;line-height:1.3!important}
  .contact-section{padding:42px 0!important}
  .contact-form,.contact-card{padding:20px!important;border-radius:16px!important}
  .form-group input,.form-group textarea,.form-group select{font-size:16px!important;min-height:46px!important}
  .form-group textarea{min-height:120px!important}
}

/* ---------- auth, account, article ---------- */
@media(max-width:640px){
  .login-body,.register-body{padding:18px 12px!important;align-items:flex-start!important}
  .login-card,.register-card{width:100%!important;max-width:none!important;border-radius:18px!important;margin:18px auto!important}
  .login-header,.register-header{padding:24px 18px!important}
  .login-body .container,.register-body .container{width:100%!important;padding:0!important}
  .wrap{width:calc(100% - 24px)!important;margin:22px auto!important}
  .wrap .card{border-radius:16px!important;overflow:hidden!important}
  .content{padding:20px!important}
  .content h1{font-size:clamp(28px,9vw,36px)!important;overflow-wrap:anywhere}
  .grid{grid-template-columns:1fr!important}
  .actions{display:grid!important;grid-template-columns:1fr!important;gap:8px!important}
  .actions .btn{width:100%!important;justify-content:center!important}
}

/* ---------- chat, WhatsApp and floating utilities ---------- */
@media(max-width:640px){
  .ezy-float-stack{right:12px!important;bottom:max(12px,env(safe-area-inset-bottom))!important;gap:10px!important}
  .ezy-float-btn{--mobile-launcher:min(var(--ezy-chat-launcher),54px);width:var(--mobile-launcher)!important;min-width:var(--mobile-launcher)!important;height:var(--mobile-launcher)!important}
  .ezy-chat-open.with-label{padding:0!important}
  .ezy-chat-open .launcher-text{display:none!important}
  .ezy-chat-label{display:none!important}
  .ezy-chat-panel{left:8px!important;right:8px!important;top:8px!important;bottom:8px!important;width:auto!important;height:auto!important;max-height:none!important;border-radius:16px!important}
  .ezy-chat-head{padding:13px 14px!important}
  .ezy-chat-head .avatar{width:40px!important;height:40px!important;flex-basis:40px!important}
  .ezy-chat-close{width:40px!important;height:40px!important;flex-basis:40px!important}
  .ezy-chat-start{padding:14px!important}
  .ezy-chat-field input,.ezy-chat-field textarea,.ezy-chat-field select{font-size:16px!important;min-height:45px!important}
  .ezy-chat-compose{padding:9px!important;gap:6px!important}
  .ezy-chat-compose textarea{font-size:16px!important;min-height:42px!important;max-height:110px!important}
  .ezy-chat-attach,.ezy-chat-send{width:42px!important;height:42px!important;flex:0 0 42px!important}
  .ezy-msg{max-width:90%!important}
  .back-top{right:78px!important;bottom:max(14px,env(safe-area-inset-bottom))!important;width:48px!important;height:48px!important}
}
@media(max-width:380px){
  .ezy-chat-panel{left:4px!important;right:4px!important;top:4px!important;bottom:4px!important;border-radius:12px!important}
  .ezy-chat-start{padding:12px!important}
}

/* ---------- intro loader ---------- */
@media(max-width:560px){
  .ezy-intro-core{width:100%!important;padding:24px 16px!important}
  .ezy-intro-orbit{width:178px!important;height:178px!important;margin-bottom:18px!important}
  .ezy-intro-logo-shell{width:116px!important;height:116px!important}
  .ezy-intro-logo{width:96px!important;height:96px!important}
  .ezy-intro-title{font-size:clamp(27px,9vw,38px)!important}
  .ezy-intro-sub{font-size:9px!important;letter-spacing:.16em!important}
  .ezy-intro-skip{right:12px!important;bottom:max(12px,env(safe-area-inset-bottom))!important}
  .ezy-intro-corners{inset:10px!important}
}

/* ---------- landscape phones ---------- */
@media(max-width:900px) and (max-height:520px) and (orientation:landscape){
  .ezy-tech-announcement,.ezy-tech-info{display:none!important}
  .ezy-tech-nav-row{min-height:58px!important}
  .managed-hero,.video-hero,.managed-slide .slide-content,.video-hero .slide-content,.slide,.slide-content{min-height:520px!important}
  .hero-copy,.video-hero .hero-copy,.managed-slide .hero-copy{padding-top:32px!important;padding-bottom:88px!important}
  .hero h1{font-size:clamp(30px,6vw,42px)!important}
  .ezy-chat-panel{top:4px!important;bottom:4px!important}
}

/* ---------- touch ---------- */
@media(hover:none) and (pointer:coarse){
  a,button,input,select,textarea{touch-action:manipulation}
  .service-card:hover,.product-card:hover,.work-card:hover,.blog-card:hover,.portfolio-card:hover,.plan:hover,.cap-card:hover,.quote:hover,.step:hover{transform:none!important}
}
