/* ────────────────────────────────────────────────────────────────────────────────────────────────────────────────── */
/* MEDIA QUERIES 																									  */
/* ────────────────────────────────────────────────────────────────────────────────────────────────────────────────── */


/***********************************************
Pantalla 3480x2160 16:9 4K
***********************************************/
@media only screen and (min-width:2651px) and (max-width: 3840px) {
	
	.show-mobile { display:none !important; }
	.show-tablet { display:none !important; }
	.show-screen { display:inherit; }
	.hide-mobile { display:inherit !important; }
	.hide-tablet { display:inherit !important; }
	.hide-screen { display:none !important; }
	
	th.show-screen { display:table-cell; }
	th.hide-mobile { display:table-cell !important; }
	th.hide-tablet { display:table-cell !important; }
	td.show-screen { display:table-cell; }
	td.hide-mobile { display:table-cell !important; }
	td.hide-tablet { display:table-cell !important; }	
	


}


/***********************************************
Pantalla 2560x1440 16:9 2K
***********************************************/
@media only screen and (min-width:1921px) and (max-width: 2560px) {

	.show-mobile { display:none !important; }
	.show-tablet { display:none !important; }
	.show-screen { display:inherit; }
	.hide-mobile { display:inherit !important; }
	.hide-tablet { display:inherit !important; }
	.hide-screen { display:none !important; }
	
	th.show-screen { display:table-cell; }
	th.hide-mobile { display:table-cell !important; }
	th.hide-tablet { display:table-cell !important; }
	td.show-screen { display:table-cell; }
	td.hide-mobile { display:table-cell !important; }
	td.hide-tablet { display:table-cell !important; }


}


/***********************************************
Pantalla 1920x1080 16:9 
***********************************************/
@media only screen and (min-width:1681px) and (max-width: 1920px) {

	.show-mobile { display:none !important; }
	.show-tablet { display:none !important; }
	.show-screen { display:inherit; }
	.hide-mobile { display:inherit !important; }
	.hide-tablet { display:inherit !important; }
	.hide-screen { display:none !important; }
	
	th.show-screen { display:table-cell; }
	th.hide-mobile { display:table-cell !important; }
	th.hide-tablet { display:table-cell !important; }
	td.show-screen { display:table-cell; }
	td.hide-mobile { display:table-cell !important; }
	td.hide-tablet { display:table-cell !important; }


	}


/***********************************************
Pantalla 1680x1050 16:10
***********************************************/
@media only screen and (min-width:1367px) and (max-width: 1680px) {

	.show-mobile { display:none !important; }
	.show-tablet { display:none !important; }
	.show-screen { display:inherit; }
	.hide-mobile { display:inherit !important; }
	.hide-tablet { display:inherit !important; }
	.hide-screen { display:none !important; }
	
	th.show-screen { display:table-cell; }
	th.hide-mobile { display:table-cell !important; }
	th.hide-tablet { display:table-cell !important; }
	td.show-screen { display:table-cell; }
	td.hide-mobile { display:table-cell !important; }
	td.hide-tablet { display:table-cell !important; }


}


/***********************************************
Pantalla 1366x768 16:9
***********************************************/
@media only screen and (min-width:1281px) and (max-width: 1366px) {

	.show-mobile { display:none !important; }
	.show-tablet { display:none !important; }
	.show-screen { display:inherit; }
	.hide-mobile { display:inherit !important; }
	.hide-tablet { display:inherit !important; }
	.hide-screen { display:none !important; }
	
	th.show-screen { display:table-cell; }
	th.hide-mobile { display:table-cell !important; }
	th.hide-tablet { display:table-cell !important; }
	td.show-screen { display:table-cell; }
	td.hide-mobile { display:table-cell !important; }
	td.hide-tablet { display:table-cell !important; }

}


/***********************************************
Pantalla 1280x720 16:9
***********************************************/
@media only screen and (min-width:1025px) and (max-width: 1280px) {

	.show-mobile { display:none !important; }
	.show-tablet { display:none !important; }
	.show-screen { display:inherit; }
	.hide-mobile { display:inherit !important; }
	.hide-tablet { display:inherit !important; }
	.hide-screen { display:none !important; }
	
	th.show-screen { display:table-cell; }
	th.hide-mobile { display:table-cell !important; }
	th.hide-tablet { display:table-cell !important; }
	td.show-screen { display:table-cell; }
	td.hide-mobile { display:table-cell !important; }
	td.hide-tablet { display:table-cell !important; }

}


/***********************************************
Pantalla 1024x600 16:10
***********************************************/
@media only screen and (min-width:960px) and (max-width: 1024px) {

	.show-mobile { display:none !important; }
	.show-tablet { display:none !important; }
	.show-screen { display:inherit; }
	.hide-mobile { display:inherit !important; }
	.hide-tablet { display:inherit !important; }
	.hide-screen { display:none !important; }
	
	th.show-screen { display:table-cell; }
	th.hide-mobile { display:table-cell !important; }
	th.hide-tablet { display:table-cell !important; }
	td.show-screen { display:table-cell; }
	td.hide-mobile { display:table-cell !important; }
	td.hide-tablet { display:table-cell !important; }

}


/***********************************************
Tablet 
***********************************************/
@media only screen and (min-width:768px) and (max-width: 959px) {
	
	.show-mobile { display:none !important; }
	.show-tablet { display:inherit !important; }
	.show-screen { display:none !important; }
	.hide-mobile { display:inherit !important; }
	.hide-tablet { display:none !important; }
	.hide-screen { display:inherit !important; }	
	
	th.show-tablet { display:table-cell !important; }
	th.hide-mobile { display:table-cell !important; }
	th.hide-screen { display:table-cell !important; }	
	td.show-tablet { display:table-cell !important; }
	td.hide-mobile { display:table-cell !important; }
	td.hide-screen { display:table-cell !important; }	


}


/***********************************************
Mobile (portrait)
***********************************************/
@media only screen and (max-width:767px) {
	
	.show-mobile { display:inherit !important; }
	.show-tablet { display:none !important; }
	.show-screen { display:none !important; }
	.hide-mobile { display:none !important; }
	.hide-tablet { display:inherit !important; }
	.hide-screen { display:inherit !important; }
	
	th.show-mobile { display:table-cell !important; }
	th.hide-tablet { display:table-cell !important; }
	th.hide-screen { display:table-cell !important; }	
	td.show-mobile { display:table-cell !important; }
	td.hide-tablet { display:table-cell !important; }
	td.hide-screen { display:table-cell !important; }
	td span.show-mobile { display:inline !important; }	
	

}


/***********************************************
Mobile (landscape)
***********************************************/
@media only screen and (min-width: 480px) and (max-width: 767px) {

	.show-mobile { display:inherit !important; }
	.show-tablet { display:none !important; }
	.show-screen { display:none !important; }
	.hide-mobile { display:none !important; }
	.hide-tablet { display:inherit !important; }
	.hide-screen { display:inherit !important; }
	
	th.show-mobile { display:table-cell !important; }
	th.hide-tablet { display:table-cell !important; }
	th.hide-screen { display:table-cell !important; }	
	td.show-mobile { display:table-cell !important; }
	td.hide-tablet { display:table-cell !important; }
	td.hide-screen { display:table-cell !important; }
	td span.show-mobile { display:inline !important; }
	
	
}

@media only screen and (max-width: 767px) {
	.contactoContenido { padding-top: 9rem; padding-bottom: 8rem; }
	.contactoHero h1 { font-size: clamp(3.8rem, 11vw, 5rem); }
	.contactoEtiqueta { font-size: 1.1rem; letter-spacing: .25rem; }
	.contactoIntro { font-size: 1.5rem; }
	.contactoDatos .contenidoBloqueSeccion { padding-top: 5rem; padding-bottom: 6rem; }
	.contactoTarjetas { grid-template-columns: 1fr; gap: 1.5rem; }
	.contactoTarjeta { min-height: 17rem; padding: 2.5rem; }
	.contactoNota { margin-top: 5rem; }
	.contactoNota h2 { font-size: 3rem; }
}

@media only screen and (min-width: 768px) and (max-width: 959px) {
	.contactoTarjetas { grid-template-columns: repeat(2, 1fr); }
}

/* Página de trabajo en curso: siempre encajada en la ventana */
@media only screen and (max-width: 767px) {
	.pantallaTrabajando { padding: 2rem 7%; }
	.trabajandoDecoracion { right: -10rem; bottom: -7rem; width: 34rem; height: 34rem; }
	.trabajandoLogo img { width: 13rem; }
	.trabajandoCodigo { margin-top: 2.5rem; font-size: 1.1rem; letter-spacing: .25rem; }
	.trabajandoContenido h1 { font-size: clamp(3.6rem, 12vw, 5.5rem); }
	.trabajandoTexto { font-size: 1.45rem; }
	.trabajandoAcciones { gap: 1.5rem; margin-top: 2.2rem; }
	.trabajandoAcciones .boton { padding: 1.4rem 2rem; font-size: 1.2rem; }
	.trabajandoEmail { font-size: 1.3rem; }
	.trabajandoVolver { margin-top: 2rem; }
}
@media only screen and (min-width: 768px) and (max-width: 1199px) {
	.trabajandoContenido h1 { font-size: clamp(5rem, 8vw, 7rem); }
	.trabajandoDecoracion { right: -10rem; bottom: -10rem; width: 45rem; height: 45rem; }
}


/* Tira de fotografías de inicio */
@media only screen and (max-width: 767px) {
	.tiraFotos {
		grid-template-columns: 1fr;
	}

	.marcoFoto > div {
		aspect-ratio: 16 / 10;
	}
}

@media only screen and (min-width: 768px) and (max-width: 959px) {
	.profesoresGrid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.profesorCard:last-child {
		grid-column: 1 / -1;
		max-width: 36rem;
		width: 100%;
		justify-self: center;
	}

	.clasesTarjetas {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.marcoFoto > div {
		aspect-ratio: 1 / 1;
	}
}

@media only screen and (max-width: 767px) {
	.piePagina { padding: 5rem 10% 2rem; }
	.pieContenido { grid-template-columns: 1fr; gap: 3rem; }
	.pieLegal { flex-direction: column; gap: .7rem; margin-top: 3.5rem; }
	.pieDecoracion { top: auto; right: -6rem; bottom: -2rem; width: 23rem; height: 23rem; transform: rotate(-10deg); }
	.galeriaPista { aspect-ratio: 4 / 3; }
	.galeriaAnterior { left: 1rem; }
	.galeriaSiguiente { right: 1rem; }
	.galeriaFlecha { width: 3.8rem; height: 3.8rem; }
	.galeriaSlide figcaption { padding: 4rem 1.5rem 1.5rem; font-size: 1.5rem; }
	.heroMatricula .contenidoBloqueSeccion {
		padding-top: 8rem;
		padding-bottom: 8rem;
	}

	.matriculaEtiqueta {
		font-size: 1.1rem;
		letter-spacing: .25rem;
	}

	.heroMatricula h2 {
		font-size: 3.8rem;
	}

	.heroMatricula h4 {
		font-size: 1.45rem;
	}

	.matriculaEmail {
		font-size: 1.7rem;
	}

	.heroMatricula .boton {
		padding: 1.5rem 2.5rem;
		font-size: 1.3rem;
	}

	.profesores h1 {
		font-size: 4.2rem;
		letter-spacing: -.1rem;
	}

	.profesoresGrid {
		margin-top: 4rem;
	}

	.profesorCard {
		min-height: 0;
	}

	.profesorFoto {
		height: 20rem;
	}

	.profesores .contenidoBloqueSeccion {
		/* La navegación móvil ocupa dos líneas y es fija; dejamos espacio antes del título. */
		padding-top: 16rem;
		padding-bottom: 7rem;
	}

	.profesoresGrid {
		grid-template-columns: 1fr;
		gap: 2rem;
		margin-top: 4rem;
	}

	.profesorCard {
		max-width: 34rem;
		margin: 0 auto;
	}

	.clasesTarjetas {
		grid-template-columns: 1fr;
		gap: 1.2rem;
		margin-top: 3rem;
	}

	.tarjetaClase {
		min-height: auto;
		padding: 2rem;
	}

	.tarjetaClase h3 {
		margin-top: 2rem;
	}
}

/* Ajustes móviles del diseño anterior de profesores */
@media only screen and (max-width: 767px) {
	.profesores h1 {
		font-size: clamp(3.6rem, 5vw, 5.8rem);
		letter-spacing: normal;
		text-align: center;
	}

	.profesorFoto {
		width: 15rem;
		height: 18rem;
	}

	.profesoresGrid {
		margin-top: 9rem;
	}

	.profesorCard {
		padding-top: 13rem;
	}

	.profesoresGrid {
		row-gap: 9rem;
	}
}

/* Ajustes responsive globales */
@media only screen and (min-width: 768px) and (max-width: 1199px) {
	.contenidoBloqueSeccion { width: 86%; }
	.navContainer { padding: 0 3.5rem; }
	.navbar-nav { gap: 2rem; }
	.carruselInicio { padding-right: 6rem; padding-left: 6rem; }
	.quienesSomosInicio .contenidoBloqueSeccion { gap: 4rem; }
	.quienesSomosInicio img { max-width: 40%; object-fit: contain; }
	.clasesTarjetas { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.tarifasGrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.piePagina { padding-right: 7%; padding-left: 7%; }
	.pieContenido { gap: 3rem; }
	.seccionHorarios { margin: 10rem 2.5rem 5rem; }
	.horariosCabecera { min-width: 0; }
}

@media only screen and (max-width: 767px) {
	img { max-width: 100%; }
	.contenidoBloqueSeccion { width: 86%; padding-top: 6rem; padding-bottom: 6rem; }
	main { padding-top: 11.5rem; }

	/* Navegación: enlaces visibles y desplazables en pantallas estrechas. */
	.navContainer { display: flex; flex-direction: column; align-items: stretch; padding: .4rem 0 0; }
	.navContainer > a { align-self: center; }
	.logo { display: block; max-width: 11rem; padding: .4rem; }
	.navbar-collapse { width: 100%; margin: 0; overflow-x: auto; scrollbar-width: none; }
	.navbar-collapse::-webkit-scrollbar { display: none; }
	.navbar-nav { width: max-content; min-width: 100%; justify-content: center; gap: 0; }
	.navbar-nav li { flex: 0 0 auto; }
	.nav li a { display: block; padding: 1rem .9rem 1.1rem; font-size: 1.1rem; white-space: nowrap; }

	.carruselInicio { min-height: 58vh; padding: 7rem 7% 5rem; }
	.carruselTexto { max-width: 100%; }
	.carruselTexto h1 { font-size: clamp(4.2rem, 12vw, 6.2rem); }
	.carruselTexto p { max-width: 34rem; font-size: 1.6rem; }
	.marqueeGrupo { gap: 2rem; }
	.marqueeGrupo span { font-size: 1.4rem; }
	.quienesSomosInicio .contenidoBloqueSeccion { flex-direction: column; gap: 3rem; }
	.quienesSomosInicio img { max-width: 100%; }
	.listaValores li { font-size: 1.45rem; }
	.clasesInicio .contenidoBloqueSeccion > div { width: auto; }
	.clasesInicio h2, .quienesSomosInicio h2 { font-size: clamp(3.4rem, 9vw, 4.6rem); }
	.tiraFotos { grid-template-columns: 1fr; }
	.whatsapp { right: 1.5rem; bottom: 1.5rem; width: 5.4rem; height: 5.4rem; }
	.whatsapp img { width: 2.8rem; height: 2.8rem; }

	/* Horario: cabecera legible y tabla desplazable solo dentro de su sección. */
	.seccionHorarios { margin: 7rem 0 4rem; padding: 0 1.5rem 1.5rem; overflow-x: auto; -webkit-overflow-scrolling: touch; }
	.horariosCabecera { min-width: 0; flex-direction: column; gap: 2rem; margin-bottom: 3rem; }
	.horariosCabecera h1 { font-size: clamp(3.6rem, 10vw, 4.5rem); }
	.horariosSubtitulo { font-size: 1.55rem; }
	.horariosLeyenda { max-width: none; justify-content: flex-start; padding-top: 0; gap: .8rem; }
	.chip { padding: .8rem 1.1rem; font-size: 1.1rem; }
	.tablaHorarios { min-width: 105rem; }
	.filaHorario { grid-template-columns: 12rem repeat(10, minmax(6.5rem, 1fr)); }
	.horas { margin-left: 12rem; }
	.diaHorario { padding: 1.5rem; font-size: 2rem; }
	.horariosLeyenda, .tablaHorarios { display: none; }
	.horariosMovil { display: block; width: 100%; padding: 0; overflow: hidden; border: 0; border-radius: 1.8rem; background: #fff; box-shadow: 0 1.2rem 3rem rgba(41,49,51,.12); cursor: zoom-in; }
	.horariosMovil img { display: block; width: 100%; height: auto; }
	.horariosMovil span { display: block; padding: 1rem; color: #246a72; font-family: "Josefin Sans", sans-serif; font-size: 1.3rem; font-weight: 700; text-align: center; }
	.seccionTarifas .contenidoBloqueSeccion { width: 90%; }
	.tarifasCabecera { margin-bottom: 3rem; }
	.tarifasCabecera h2 { font-size: clamp(3.6rem, 10vw, 4.8rem); }
	.tarifasEscritorio { display: none; }
	.tarifasMovil { display: block; width: 100%; padding: 0; overflow: hidden; border: 0; border-radius: 1.8rem; background: #fff; box-shadow: 0 1.2rem 3rem rgba(41,49,51,.12); cursor: zoom-in; }
	.tarifasMovil img { display: block; width: 100%; height: auto; }
	.tarifasMovil span { display: block; padding: 1rem; color: #246a72; font-family: "Josefin Sans", sans-serif; font-size: 1.3rem; font-weight: 700; text-align: center; }

	.galeriaEscuela .contenidoBloqueSeccion { width: 90%; }
	.galeriaIntro { margin-bottom: 3rem; font-size: 1.45rem; }
	.galeriaVentana { border-radius: 1.4rem; }
	.galeriaCarrusel { padding-bottom: 4rem; }
	.galeriaFlecha { top: 42%; }
	.contactoTarjeta strong { overflow-wrap: anywhere; }
}

@media only screen and (max-width: 374px) {
	main { padding-top: 12.4rem; }
	.profesores .contenidoBloqueSeccion { padding-top: 17rem; }
	.nav li a { padding-right: .7rem; padding-left: .7rem; font-size: 1rem; }
	.carruselInicio { min-height: 54vh; }
	.carruselTexto h1 { font-size: 4rem; }
	.boton { padding: 1.2rem 2rem; font-size: 1.2rem; }
	.contactoTarjeta { padding: 2rem; }
}

@media only screen and (max-width: 767px) {
	.historiaContenido h1 { font-size: clamp(3.6rem, 10vw, 5rem); }
	.historiaTexto { text-align: left; }
	.historiaDestacados { grid-template-columns: 1fr; gap: 1.2rem; margin-top: 3rem; }
	.historiaDestacados div { padding: 2rem; }
	.historiaFestival { padding: 2rem; text-align: left; }
}
