/* Responsive Media Queries */

/* Extra large devices (large desktops, 1200px and up) */
@media (max-width: 1200px) {
  .hero-title { font-size: 3.5rem; }
  .search-grid { grid-template-columns: repeat(3, 1fr); }
  .col-span-4 { grid-column: span 3; }
}

/* Large devices (desktops, 992px and up) */
@media (max-width: 991px) {
  .hero-title { font-size: 3rem; }
  .search-container { margin-top: -80px; }
  .search-box { padding: 24px; }
  .search-grid { grid-template-columns: repeat(2, 1fr); }
  .col-span-4 { grid-column: span 2; }
  
  .section-padding { padding: 60px 0; }
  .section-title { font-size: 2rem; }
  
  /* Mega menu for mobile is tricky, usually reverts to standard accordion, but handled by Bootstrap collapse */
  .mega-menu {
    position: static;
    box-shadow: none;
    border-radius: 0;
    padding: 16px 0;
    opacity: 1;
    visibility: visible;
    display: none; /* Let bootstrap handle it via dropdown-menu if configured */
    transform: none;
  }
  .nav-item.dropdown:hover .mega-menu { display: block; }
}

/* Medium devices (tablets, 768px and up) */
@media (max-width: 767px) {
  .hero-title { font-size: 2.5rem; }
  .hero-subtitle { font-size: 1rem; }
  
  .search-grid { grid-template-columns: 1fr; }
  .col-span-2, .col-span-4 { grid-column: span 1; }
  
  .search-tabs { width: 100%; justify-content: space-between; }
  .search-tab { flex: 1; text-align: center; padding: 10px 8px; font-size: 0.875rem; }
  
  .footer-col { margin-bottom: 32px; }
  .footer-bottom { flex-direction: column; text-align: center; }
  
  .card-actions-top-right { flex-direction: row; right: 16px; top: 16px; }
}

/* Small devices (landscape phones, 576px and up) */
@media (max-width: 575px) {
  .hero-title { font-size: 2rem; }
  .property-features { grid-template-columns: repeat(2, 1fr); }
  .cookie-banner { bottom: 0; left: 0; right: 0; border-radius: var(--radius-lg) var(--radius-lg) 0 0; }
}