/* ============================================================
   Dhyanachala - estilos propios sobre Bootstrap 5
   Sustituye a menuResponsive.css.
   Nota: el grid casero (.col-1 .. .col-12) de menuResponsive.css
   se eliminó por completo: pisaba las clases reales .col-* de
   Bootstrap porque se cargaba después en el <head>. Ahora se usa
   el grid real de Bootstrap (container / row / col).
   ============================================================ */

:root {
	--brand-dark: #154360;
	--brand-light: #D6EAF8;
	--brand-accent: #FF5733;
	--brand-heading: #5499C7;
}

body {
	font: .99em/150% Arial, Helvetica, sans-serif;
}

h1, h2, h3, h4, h5, h6 {
	color: var(--brand-heading);
	line-height: 1.4em;
}

/* Barra de navegación: se conserva la degradación de marca original,
   aplicada ahora sobre el navbar real de Bootstrap (con collapse
   funcional en móvil, cosa que el menú anterior no tenía). */
.barra-nav {
	background: linear-gradient(-90deg, var(--brand-dark), var(--brand-light));
	border-bottom: 1px solid #ddd;
}
.barra-nav .nav-link {
	color: #fff;
}
.barra-nav .nav-link:hover,
.barra-nav .nav-link.active {
	color: var(--brand-accent);
}

.barra-footer {
	background: linear-gradient(-90deg, var(--brand-dark), var(--brand-light));
	color: #fff;
}
.barra-footer small,
.barra-footer p {
	color: #fff;
}

/* Imágenes de artículos (menuMVO, menuEjer_*) */
figure.post-imagen img {
	float: left;
	margin: 0 1rem 1rem 0;
	max-width: 260px;
}

/* Galería tipo "masonry" flexible usada en menuEjer_1/2/3 */
.cont-flex {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	gap: 1rem;
}

/* Pie de descripción bajo miniaturas (menuEjercicios, menuVideos) */
.desc {
	text-align: center;
	color: #000;
}

.contentSmall {
	margin-top: 1.5rem;
}