/* ============================================================
   ONE Fitness Center — tema premium estilo Equinox
   Negro + azul eléctrico (#0069DE). Minimal, mucho aire,
   imágenes grandes, bordes rectos, tipografía con presencia.
   --color-primario=#0069DE · --color-secundario=#0A0A0A (params)
   ============================================================ */

:root {
	--one-blue: #0069DE;
	--one-dark: #0A0A0A;
	--one-muted: #6b7280;
}

/* ---------------- Tipografía atlética ---------------- */
h1, h2, h3, h4, h5, h6,
.display-1, .display-2, .display-3, .display-4, .display-5, .display-6,
.navbar-nav .nav-link, .btn,
.portada-texto-grande, .portada-texto-pequeno,
.titulo-formulario-contacto, .titulo-whatsapp-contacto {
	font-family: "Oswald", "Manrope", sans-serif !important;
}

h1, h2,
.display-1, .display-2, .display-3, .display-4 {
	text-transform: uppercase;
	font-weight: 700;
	letter-spacing: .015em;
	line-height: 1.08;
}

.navbar-nav .nav-link {
	text-transform: uppercase;
	font-weight: 500;
	letter-spacing: .08em;
	font-size: .92rem;
}

/* Títulos de sección: sólido oscuro, grande, con presencia (sin gradiente) */
[id^="divBloque"] .display-2,
[id^="divBloque"] .display-3,
[id^="divBloque"] .display-4,
[id^="divBloque"] .display-5,
[id^="divBloque"] .display-6 {
	color: var(--one-dark) !important;
	-webkit-text-fill-color: var(--one-dark);
	background: none;
	font-weight: 700;
	letter-spacing: .02em;
}

/* Subtítulo de bloque como "eyebrow" azul */
[id^="divBloque"] .lead {
	color: var(--one-muted);
}

/* ---------------- Logo / marca (logo real "ONE", compacto) ---------------- */
.navbar-brand img { width: 80px; max-width: 80px; }
.logo-menu-mobile { width: 72px; }
@media (max-width: 575.98px) {
	.navbar-brand img { width: 72px; padding: 10px 10px 10px 0 !important; }
}

/* ---------------- HERO (altura por aspecto, no full-height) ---------------- */
.swiper-hero, .swiper-hero-con-barra, .swiper-hero .swiper-slide, .swiper-hero-con-barra .swiper-slide {
	/* height: 82vh !important; */
	/* min-height: 540px; */
}

.swiper-hero-sin-barra, .swiper-hero-sin-barra .swiper-slide {
	height: calc(100vw / 2.35);
}

/* Tablet: hero horizontal un poco más alto (estilo mutualmodelo) */
@media (max-width: 767px) {
	.swiper-hero-sin-barra, .swiper-hero-sin-barra .swiper-slide {
		height: calc(100vw / 1.25) !important;
	}
}

/* Mobile (<576px): portadas.php muestra el slider vertical (imagen vertical 2:3) */
.swiper-hero-vertical-sin-barra, .swiper-hero-vertical-sin-barra .swiper-slide {
	height: calc(100vw / 0.66);
}
@media (max-width: 575.98px) {
	.swiper-hero-vertical-sin-barra, .swiper-hero-vertical-sin-barra .swiper-slide {
		height: calc(100vw / 0.66) !important;
	}
}

/* Nav-links más altos en desktop (más aire en la barra) */
@media (min-width: 992px) {
	.navbar-expand-lg[class*=navbar-bg-]:not(.fancy):not(.extended):not(.fixed) .navbar-collapse .nav-link {
		padding-top: 1.25rem;
		padding-bottom: 1.25rem;
	}
}

.portada-texto-pequeno {
	text-transform: uppercase;
	letter-spacing: .38em !important;
	font-weight: 500 !important;
	font-size: .82rem !important;
	margin-bottom: 1.1rem !important;
}

.portada-texto-grande {
	font-weight: 700 !important;
	text-transform: uppercase;
	letter-spacing: .005em;
	line-height: 1.02 !important;
	font-size: clamp(2.8rem, 6.5vw, 6rem) !important;
	margin-bottom: 1rem !important;
}

.portada-texto-normal {
	font-family: "Manrope", sans-serif !important;
	font-weight: 400 !important;
	font-size: clamp(1rem, 1.5vw, 1.3rem) !important;
	letter-spacing: .01em;
	opacity: .92;
}

/* ---------------- Whitespace generoso entre secciones ---------------- */
[id^="divBloque"].wrapper {
	padding-top: 5.5rem !important;
	padding-bottom: 5.5rem !important;
}
[id^="divBloque"] .display-4 { margin-bottom: 3rem !important; }

/* ---------------- Bordes rectos (Equinox) — sin tocar botones circulares ---------------- */
.btn:not(.btn-circle), figure.rounded, .rounded, .card, .card-body, img.rounded,
.form-control, .form-select, .pricing.card, .shadow-lg, .shadow-sm {
	border-radius: 0 !important;
}

/* ---------------- Botones rectangulares premium (excluye .btn-circle: scroll-down, play, etc.) ---------------- */
.btn:not(.btn-circle) {
	text-transform: uppercase;
	font-weight: 600;
	letter-spacing: .14em;
	font-size: .8rem;
	padding: .9rem 2.1rem !important;
	transition: background-color .25s ease, color .25s ease, border-color .25s ease, transform .25s ease;
}
.btn-primary, .btn-primario {
	background-color: var(--one-blue) !important;
	border-color: var(--one-blue) !important;
	color: #fff !important;
}
.btn-primary:hover, .btn-primario:hover {
	background-color: var(--one-dark) !important;
	border-color: var(--one-dark) !important;
	color: #fff !important;
	transform: translateY(-2px);
}
/* Hover invertido (blanco + texto azul) para el CTA del menú y el botón del bloque Sumate/Preinscripción */
.boton-cta-menu:hover,
#divBloquePreinscripcion .btn:hover {
	background-color: #ffffff !important;
	border-color: #ffffff !important;
	color: var(--one-blue) !important;
}

/* ---------------- Tarjetas de disciplina (modelo 5) ---------------- */
#divBloqueDisciplinas figure {
	overflow: hidden;
	margin-bottom: 1rem !important;
}
#divBloqueDisciplinas figure img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	transition: transform .6s ease;
}
#divBloqueDisciplinas figure:hover img { transform: scale(1.06); }
#divBloqueDisciplinas h4 {
	text-transform: uppercase;
	font-weight: 600;
	letter-spacing: .04em;
	margin-top: .9rem !important;
}
#divBloqueDisciplinas .meta { color: var(--one-muted); font-size: .95rem; }

/* ---------------- Bandas modelo 3 (Pase Libre / Servicios / CTA) ---------------- */
#divBloquePaseLibre figure, #divBloqueServicios figure,
#divBloquePreinscripcion figure {
	overflow: hidden;
}
#divBloquePaseLibre figure img, #divBloqueServicios figure img,
#divBloquePreinscripcion figure img {
	transition: transform .6s ease;
}
#divBloquePaseLibre figure:hover img, #divBloqueServicios figure:hover img,
#divBloquePreinscripcion figure:hover img { transform: scale(1.04); }

/* Banda CTA de preinscripción = sección oscura (contraste editorial) */
#divBloquePreinscripcion.wrapper { background: var(--one-dark) !important; }
#divBloquePreinscripcion h2, #divBloquePreinscripcion h3, #divBloquePreinscripcion h4,
#divBloquePreinscripcion .display-4, #divBloquePreinscripcion .display-5,
#divBloquePreinscripcion .display-6, #divBloquePreinscripcion .display-7,
#divBloquePreinscripcion p, #divBloquePreinscripcion .lead {
	color: #fff !important;
	-webkit-text-fill-color: #fff;
}
#divBloquePreinscripcion .meta, #divBloquePreinscripcion .display-7 { color: #d4d8df !important; -webkit-text-fill-color: #d4d8df; }

/* ---------------- Galería mosaico: hover zoom + sharp ---------------- */
#divBloqueGaleria figure { overflow: hidden; margin: 0; }
#divBloqueGaleria figure img { transition: transform .6s ease; }
#divBloqueGaleria figure:hover img { transform: scale(1.07); }

/* ---------------- Franja de beneficios (predefinido 2) ---------------- */
#divBloqueBeneficios .uil, #divBloqueBeneficios [class^="uil-"] {
	color: var(--one-blue);
}

/* ---------------- Botón scroll-to-top en azul (no verde) ---------------- */
.progress-wrap::after { color: var(--one-blue) !important; }
.progress-wrap svg.progress-circle path { stroke: var(--one-blue) !important; }
.progress-wrap { box-shadow: inset 0 0 0 2px rgba(0,105,222,.2) !important; }

/* ---------------- Footer ---------------- */
footer .footer-title, footer h4, footer .h4 {
	color: var(--one-blue) !important;
	text-transform: uppercase;
	letter-spacing: .08em;
}
footer { padding-top: 1rem; }
footer .nav.social a, footer .social a { font-size: 1.15rem; }

/* ---------------- Cards de disciplina con nombre superpuesto (overview /disciplinas) ---------------- */
.card-disciplina {
	position: relative;
	display: block;
	overflow: hidden;
	color: #fff;
}
.card-disciplina img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	filter: brightness(.6);
	transition: transform .6s ease, filter .4s ease;
}
.card-disciplina:hover img { transform: scale(1.07); filter: brightness(.72); }
.card-disciplina .card-disciplina-body {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	padding: 1.6rem;
	text-align: left;
	background: linear-gradient(to top, rgba(0,0,0,.88) 0%, rgba(0,0,0,.15) 55%, transparent 100%);
}
.card-disciplina .card-disciplina-tag {
	color: var(--one-blue);
	font-weight: 600;
	letter-spacing: .2em;
	text-transform: uppercase;
	font-size: .72rem;
	margin-bottom: .3rem;
}
.card-disciplina h3 {
	color: #fff !important;
	text-transform: uppercase;
	font-weight: 600;
	letter-spacing: .03em;
	margin: 0;
	font-size: 1.5rem;
}

/* "Nuestro espacio": nombres más largos -> tipografía un poco menor */
#divBloqueGaleria .card-disciplina h3 { font-size: 1.15rem; }
#divBloqueGaleria .card-disciplina .card-disciplina-body { padding: 1.2rem; }

/* ---------------- Contenido de sección: separar del footer ----------------
   #divContenido solo se usa en seccion.php (front). Uso `> .container` para
   afectar SOLO el container propio de la sección, no los de bloques/galería
   que seccion.php incluye anidados dentro de #divContenido. */
#divContenido { padding-bottom: 5rem !important; }
#divContenido > .container { padding-bottom: 1.5rem; }

/* Logo blanco sobre la portada de la sección */
.image-wrapper .img-logo-contacto {
	width: 120px;
	max-width: 50%;
	height: auto;
	margin-bottom: 1.6rem !important;
}

/* ---------------- Tablas (horarios de disciplinas) ---------------- */
.table { --bs-table-bg: transparent; }
.table thead th {
	text-transform: uppercase;
	letter-spacing: .06em;
	font-size: .82rem;
	border-bottom: 2px solid var(--one-dark);
}

/* ============================================================
   BLOQUES ESTILO EQUINOX (full-bleed, imagen de fondo, texto grande)
   Aditivo: solo afecta los bloques con id que empieza en divBloqueEq.
   ============================================================ */
[id^="divBloqueEq"].wrapper { padding: 0 !important; background: #0a0a0a !important; }
[id^="divBloqueEq"] .container,
[id^="divBloqueEq"] .row,
[id^="divBloqueEq"] .col-12 { max-width: 100%; padding: 0; margin: 0; }

.one-eq {
	position: relative;
	width: 100vw;
	margin-left: calc(50% - 50vw);
	min-height: 82vh;
	display: flex;
	align-items: center;
	overflow: hidden;
	background-size: cover;
	background-position: center;
	background-color: #0a0a0a;
	text-align: left;
}
.one-eq::before {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, rgba(0,0,0,.82) 0%, rgba(0,0,0,.5) 45%, rgba(0,0,0,.12) 100%);
}
.one-eq-right::before { background: linear-gradient(270deg, rgba(0,0,0,.82) 0%, rgba(0,0,0,.5) 45%, rgba(0,0,0,.12) 100%); }
.one-eq-center::before { background: linear-gradient(0deg, rgba(0,0,0,.8) 0%, rgba(0,0,0,.3) 55%, rgba(0,0,0,.55) 100%); }

.one-eq-inner { position: relative; z-index: 2; max-width: 660px; padding: 0 7vw; }
.one-eq-right { justify-content: flex-end; }
.one-eq-right .one-eq-inner { text-align: right; }
.one-eq-right .one-eq-text { margin-left: auto; }
.one-eq-center { justify-content: center; }
.one-eq-center .one-eq-inner { text-align: center; max-width: 760px; }
.one-eq-center .one-eq-text { margin-left: auto; margin-right: auto; }

.one-eq-eyebrow {
	display: inline-block;
	color: var(--one-blue);
	font-family: "Oswald", sans-serif;
	text-transform: uppercase;
	letter-spacing: .35em;
	font-size: .82rem;
	font-weight: 500;
	margin-bottom: 1.2rem;
}
.one-eq-title {
	color: #fff !important;
	-webkit-text-fill-color: #fff;
	font-family: "Oswald", sans-serif;
	text-transform: uppercase;
	font-weight: 700;
	line-height: .98;
	letter-spacing: .01em;
	font-size: clamp(2.8rem, 6vw, 5.5rem);
	margin: 0 0 1.4rem;
	justify-content: center;
}
.one-eq-text {
	color: #e3e6ea;
	font-size: clamp(1rem, 1.4vw, 1.25rem);
	line-height: 1.5;
	margin: 0 0 2rem;
	max-width: 540px;
}
.one-eq-cta {
	display: inline-block;
	border: 2px solid #fff;
	color: #fff;
	background: transparent;
	text-transform: uppercase;
	letter-spacing: .14em;
	font-family: "Oswald", sans-serif;
	font-weight: 600;
	font-size: .82rem;
	padding: .9rem 2.2rem;
	transition: background-color .25s ease, color .25s ease;
}
.one-eq-cta:hover { background: #fff; color: var(--one-dark); }

/* Fondos por bloque */
.one-eq-marca { background-image: url('../../../img/one/bloques/eq-marca.jpg'); }
.one-eq-pase-libre { background-image: url('../../../img/one/bloques/eq-pase-libre.jpg'); }
.one-eq-crossfit { background-image: url('../../../img/one/bloques/eq-crossfit.jpg'); }
.one-eq-comunidad { background-image: url('../../../img/one/bloques/eq-comunidad.jpg'); }

@media (max-width: 767px) {
	.one-eq { min-height: 68vh; }
	.one-eq-inner { padding: 0 8vw; max-width: 100%; }
	.one-eq-right, .one-eq-right .one-eq-inner { justify-content: flex-start; text-align: left; }
	.one-eq-right .one-eq-text { margin-left: 0; }
}
