
/* ---------------------------------------------------------------------------
 * Panel del menú de teléfono, desplegado por el icono de hamburguesa.
 * Las medidas siguen la cabecera del diseño: mismo borde, mismo verde y la
 * misma tipografía del menú de escritorio.
 * ------------------------------------------------------------------------- */

.elementor .elementor-element-rc-header { position: relative; }
.elementor .elementor-element-rc-burger { cursor: pointer; }
html.rc-sin-scroll, html.rc-sin-scroll body { overflow: hidden; }
/* Con barra de desplazamiento clásica, quitarla ensanchaba la página 15 px de
   golpe al abrir el panel. Se reserva su hueco mientras está abierto. */
html.rc-sin-scroll { scrollbar-gutter: stable; }

.rc-menu-movil {
	position: absolute;
	inset-inline: 0;
	top: 100%;
	z-index: 120;
	background: #ffffff;
	border-top: 1px solid #dcd8d2;
	border-bottom: 1px solid #dcd8d2;
	padding: 4px 20px 16px;
	box-shadow: 0 18px 30px -22px rgba(15, 26, 24, .45);
}
.rc-menu-movil[hidden] { display: none; }
.rc-menu-movil ul { list-style: none; margin: 0; padding: 0; }
.rc-menu-movil li + li { border-top: 1px solid #efece7; }
.rc-menu-movil a {
	display: block;
	padding: 16px 0;
	font-size: 16.5px;
	font-weight: 500;
	letter-spacing: -.01em;
	line-height: 1.3;
	color: #193530;
	text-decoration: none;
}
/* La página actual se marca como en el escritorio: verde, en negrita y con un
   filete terracota. El terracota como color de texto daba 4,1:1 sobre blanco,
   por debajo del 4,5:1 que pide AA para este tamaño. */
.rc-menu-movil a[aria-current="page"] {
	font-weight: 700;
	text-decoration: underline 2px #c65e3c;
	text-underline-offset: 8px;
}

.rc-menu-movil .rc-menu-social {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 10px;
	margin-top: 14px;
	padding-top: 14px;
	border-top: 1px solid #efece7;
}
/* Los iconos heredan un alto fijo de 24 px del estilo atómico, así que el
   relleno quedaba dentro de la caja y el área de toque se caía a 24 px. Se les
   da caja propia de 44, que es el mínimo cómodo con el pulgar. */
.rc-menu-movil .rc-menu-social a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: 44px;
	height: 44px;
	padding: 0;
	color: #6b7a76;
}
/* El SVG atómico trae width y height al 100 % en línea, que ganarían a esta
   regla y lo estirarían a los 44 px de la caja. */
.rc-menu-movil .rc-menu-social a svg { width: 20px !important; height: 20px !important; display: block; }

@media (min-width: 768px) {
	.rc-menu-movil { display: none !important; }
}

/* El formulario de contacto abre sus canales con un margen negativo de 5 px,
   el de Elementor, que pisa los 9 px de recumbre-form.css. Entre 768 y 1200 el
   formulario llega al borde de la pantalla y esos 5 px provocaban barra
   horizontal. El recorte se limita a ese tramo: fuera de él no hay desborde, y
   recortar cortaría el anillo de foco del botón de envío. */
@media (min-width: 768px) and (max-width: 1200px) {
	.elementor .rc-form { overflow-x: clip; }
}
