/*
 * Responsive Media Queries
 */

/* xs: 320px – 575px — Teléfono portrait (Default is mobile-first, so this is mostly covered by base CSS) */
@media (max-width: 575px) {
	.grid-cols-2, .grid-cols-3, .grid-cols-4 {
		grid-template-columns: 1fr;
	}
	#deel-map {
		height: 300px !important;
	}
	.deel-map-popup {
		font-size: 1rem;
		padding: 10px;
	}
	.leaflet-popup-content-wrapper {
		border-radius: 12px;
	}
}

/* sm: 576px – 767px — Teléfono landscape */
@media (min-width: 576px) {
	/* Ajustes específicos para landscape */
}

/* md: 768px – 991px — Tableta portrait */
@media (min-width: 768px) {
	.d-md-flex { display: flex; }
	.d-md-none { display: none; }
	#deel-map {
		height: 400px !important;
	}
}

/* lg: 992px – 1199px — Tableta landscape / Laptop */
@media (min-width: 992px) {
	.d-lg-flex { display: flex; }
	.d-lg-none { display: none; }
	#deel-map {
		height: 500px !important;
	}
	
	/* Desktop Navigation */
	.site-nav__toggle {
		display: none;
	}
	.site-nav {
		display: flex !important;
		position: static;
		width: auto;
		box-shadow: none;
		padding: 0;
		border: none;
	}
	.site-nav ul {
		flex-direction: row;
		align-items: center;
	}
}

/* xl: 1200px – 1439px — Laptop / Desktop */
@media (min-width: 1200px) {
	/* Desktop specific padding/margins if needed */
}

/* xxl: 1440px+ — Desktop Full HD */
@media (min-width: 1440px) {
	/* Full HD specific adjustments */
}