/* ========================================
   GyroNavi - Responsive Styles
   ======================================== */

/* --- Tablet (max 1024px) --- */
@media (max-width: 1024px) {
  .categories-grid { grid-template-columns: repeat(2, 1fr); }
  .products-grid { grid-template-columns: repeat(2, 1fr); }
  .blog-grid { grid-template-columns: repeat(2, 1fr); }
  .advantages-grid { grid-template-columns: repeat(2, 1fr); }
  .cert-grid { grid-template-columns: repeat(2, 1fr); }
  .factory-grid { grid-template-columns: repeat(2, 1fr); }
  .products-layout { grid-template-columns: 1fr; }
  .app-grid { grid-template-columns: repeat(2, 1fr); }
  .product-detail-layout { grid-template-columns: 1fr; gap: 30px; }
  .app-detail-layout { grid-template-columns: 1fr; }
  .blog-layout { grid-template-columns: 1fr; }
  .contact-layout { grid-template-columns: 1fr; gap: 40px; }
  .profile-layout { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: repeat(2, 1fr); }
  .hero h1 { font-size: 2.2rem; }
  .hero-stats { gap: 24px; }
}

/* --- Mobile (max 768px) --- */
@media (max-width: 768px) {
  .container { padding: 0 16px; }
  h1 { font-size: 1.9rem; }
  h2 { font-size: 1.5rem; }
  
  /* Header */
  .nav-links { display: none; position: absolute; top: var(--header-height); left: 0; right: 0; background: var(--color-bg-dark); flex-direction: column; padding: 10px 20px 20px; }
  .nav-links.open { display: flex; }
  .nav-links a { padding: 12px 8px; border-bottom: 1px solid rgba(255,255,255,0.06); }
  .hamburger { display: flex; }
  
  /* Hero */
  .hero { padding: 60px 0 50px; }
  .hero h1 { font-size: 1.8rem; }
  .hero p { font-size: 1rem; }
  .hero-stats { flex-wrap: wrap; gap: 20px; }
  .hero-stat .num { font-size: 1.5rem; }
  
  /* Grids */
  .categories-grid { grid-template-columns: 1fr; }
  .products-grid { grid-template-columns: 1fr; }
  .blog-grid { grid-template-columns: 1fr; }
  .advantages-grid { grid-template-columns: 1fr; }
  .cert-grid { grid-template-columns: 1fr; }
  .factory-grid { grid-template-columns: 1fr; }
  .app-grid { grid-template-columns: 1fr; }
  .case-grid { grid-template-columns: 1fr; }
  
  /* Blog */
  .blog-post-card { flex-direction: column; }
  .blog-post-card-img { width: 100%; height: 180px; }
  
  /* Product detail */
  .product-detail-layout { gap: 24px; }
  .product-gallery { position: static; }
  
  /* Footer */
  .footer-grid { grid-template-columns: 1fr; gap: 30px; }
  
  .float-quote-btn { bottom: 16px; right: 16px; padding: 12px 20px; font-size: 0.85rem; }
  .popup-box { padding: 24px 20px; }
}

/* --- Small Mobile (max 480px) --- */
@media (max-width: 480px) {
  .hero-btns { flex-direction: column; }
  .hero-btns .btn { width: 100%; }
  .product-card-actions { flex-direction: column; }
  .site-header .container { padding: 0 12px; }
}