/* ===== WINSION - Responsive Styles ===== */

/* --- Tablet Landscape (max 1199px) --- */
@media screen and (max-width:1199px){
  .container{max-width:960px}
  .products-grid{grid-template-columns:repeat(3,1fr)}
  .features-grid{grid-template-columns:repeat(2,1fr)}
  .news-grid{grid-template-columns:repeat(2,1fr)}
  .footer-grid{grid-template-columns:1fr 1fr;gap:30px}
  .nav>ul>li>a{padding:0 12px;font-size:14px}
  .banner .swiper-slide{height:420px}
  .banner .banner-caption h2{font-size:38px}
}

/* --- Tablet Portrait (max 991px) --- */
@media screen and (max-width:991px){
  .container{max-width:720px}
  .section{padding:45px 0}
  .section-title h2{font-size:28px}
  .nav{display:none}
  .nav-toggle{display:block}
  .about-wrap{flex-direction:column;gap:30px}
  .about-img{flex:none;width:100%}
  .products-grid{grid-template-columns:repeat(3,1fr);gap:15px}
  .news-grid{grid-template-columns:1fr}
  .contact-wrap{grid-template-columns:1fr}
  .product-detail{flex-direction:column;gap:25px}
  .product-gallery{flex:none;width:100%}
  .sub-main{flex-direction:column}
  .sub-wrap{flex-direction:column;gap:25px}
  .sub-sidebar{flex:none;width:100%;order:2}
  .sub-content{order:1}
  .footer-grid{grid-template-columns:1fr 1fr}
  .banner .swiper-slide{height:360px}
  .banner .banner-caption h2{font-size:30px}
  .banner .banner-caption p{font-size:15px}
  .article-list-item{flex-direction:column;gap:15px}
  .article-list-item .art-img{flex:none;width:100%;height:200px}
  .float-contact{display:none}
}

/* --- Mobile Landscape (max 767px) --- */
@media screen and (max-width:767px){
  .container{max-width:100%;padding:0 12px}
  .section{padding:35px 0}
  .section-title{margin-bottom:30px}
  .section-title h2{font-size:24px}
  .topbar{font-size:12px;line-height:36px}
  .topbar .container{flex-wrap:wrap;justify-content:center;gap:5px}
  .topbar .topbar-right span{margin-left:10px}
  .header .container{height:64px}
  .logo-text .brand{font-size:18px}
  .logo-text .brand-sub{font-size:10px}
  .logo img{max-height:44px}
  .banner .swiper-slide{height:240px}
  .banner .banner-caption h2{font-size:22px;margin-bottom:10px}
  .banner .banner-caption p{font-size:13px;margin-bottom:18px}
  .banner .banner-caption .btn{padding:8px 20px;font-size:13px}
  .products-grid{grid-template-columns:repeat(2,1fr);gap:12px}
  .features-grid{grid-template-columns:1fr 1fr;gap:15px}
  .feature-box{padding:25px 15px}
  .feature-box .feature-icon{width:56px;height:56px;font-size:24px;margin-bottom:15px}
  .feature-box h3{font-size:15px}
  .feature-box p{font-size:13px}
  .news-grid{grid-template-columns:1fr;gap:15px}
  .about-text h2{font-size:24px}
  .about-features{grid-template-columns:1fr}
  .cta-banner{padding:40px 0}
  .cta-banner h2{font-size:24px}
  .cta-banner p{font-size:14px}
  .footer{padding:40px 0 0}
  .footer-grid{grid-template-columns:1fr;gap:30px}
  .footer h4{font-size:15px}
  .page-banner{height:160px}
  .page-banner h1{font-size:24px}
  .product-info h1{font-size:22px}
  .product-info .info-row{flex-direction:column;gap:2px}
  .product-info .info-row .label{width:auto}
  .article-detail{padding:25px 15px}
  .article-detail h1{font-size:22px}
  .article-nav{flex-direction:column}
  .article-nav a{min-width:0}
  .message-form{padding:20px}
  .message-form .btn-row{flex-direction:column}
  .message-form .btn-row .btn{width:100%}
  .product-card .product-info{padding:12px}
  .product-card .product-info h3{font-size:14px}
  .back-top{width:40px;height:40px;right:15px;bottom:70px}
}

/* --- Mobile Small (max 480px) --- */
@media screen and (max-width:480px){
  .products-grid{grid-template-columns:1fr 1fr}
  .features-grid{grid-template-columns:1fr}
  .product-gallery .thumbs img{width:60px;height:60px}
  .topbar .topbar-right span{display:block;margin:3px 0}
}
