/* Tablet */
@media (max-width: 1024px) {
  .grid { grid-template-columns: repeat(2, 1fr); }
  .site-header .bar { min-height: 64px; }
  
  /* Filtri homepage - da 4 colonne a 2 */
  main .card form[method="GET"] {
    grid-template-columns: 1fr 1fr !important;
  }
  
  /* Dettaglio proprietà - sidebar sotto */
  main .grid[style*="2fr 1fr"] {
    grid-template-columns: 1fr !important;
  }
  
  aside .card[style*="position: sticky"] {
    position: static !important;
  }
}

/* Mobile */
@media (max-width: 768px) {
  .hero { padding: 56px 0 28px; }
  .hero h1 { font-size: 28px; }
  .hero p.sub { font-size: 16px; }
  
  /* Navigation */
  nav.primary-nav { gap: 8px; }
  nav.primary-nav a { padding: 8px 10px; font-size: 14px; }
  
  /* Cards grid */
  .grid { grid-template-columns: 1fr; gap: 16px; }
  
  /* Footer */
  .footer-grid { grid-template-columns: 1fr; text-align: center; }
  .footer-left, .footer-right { align-items: center; }
  .footer-left { order: 1; }
  .footer-center { order: 2; }
  .footer-right { order: 3; }
  
  /* Filtri homepage - tutto in colonna singola */
  main .card form[method="GET"] {
    grid-template-columns: 1fr !important;
  }
  
  main .card form[method="GET"] > div:last-child {
    flex-direction: column;
    width: 100%;
  }
  
  main .card form[method="GET"] .btn {
    width: 100%;
  }
  
  /* Form contatti - layout mobile */
  main .grid[style*="1.2fr 1fr"] {
    grid-template-columns: 1fr !important;
  }
  
  main .grid[style*="1.2fr 1fr"] > section {
    order: 2;
  }
  
  main .grid[style*="1.2fr 1fr"] > aside {
    order: 1;
  }
  
  /* Thumbs gallery - 3 colonne invece di 4 */
  .thumbs { 
    grid-template-columns: repeat(3, 1fr) !important; 
  }
}

/* Small phones */
@media (max-width: 600px) {
  .site-header .bar { 
    flex-direction: column; 
    align-items: center; 
    justify-content: center; 
    gap: 6px; 
    min-height: 64px; 
    padding-top: 8px;
    padding-bottom: 8px;
  }
  
  .brand { margin: 0 auto; }
  .brand img { height: 45px !important; }
  
  nav.primary-nav { justify-content: center; }
  
  /* Hero sezione in evidenza */
  .hero h3 { font-size: 16px !important; }
  
  /* Mini thumbs - 2 colonne su mobile molto piccolo */
  .mini-thumbs { 
    grid-template-columns: repeat(2, 1fr) !important; 
  }
  
  /* Galleria thumbs - 2 colonne */
  .thumbs { 
    grid-template-columns: repeat(2, 1fr) !important; 
  }
  
  /* Pulsanti slider più piccoli */
  .slider-btn {
    width: 32px !important;
    height: 32px !important;
  }
  
  .slider-btn svg {
    width: 14px !important;
    height: 14px !important;
  }
}