/*
 * EENDA
 * Marketing, Desarrollo & Consulting
 * www.eenda.com
 * © 2026
 *
 * centroemocionarse.es · Front-End
 * Bootstrap 5.3 + tokens propios. Los breakpoints van en responsive.css.
 */


/* ==========================================================================
   Tokens
   ========================================================================== */

:root{
	/* Marca: el turquesa del logotipo y el carbón de la palabra "Emocionar" */
	--ce-teal:        #00baa5;
	--ce-teal-dark:   #009a89;
	--ce-teal-soft:   #d9f4f0;
	--ce-teal-tint:   #eefaf8;
	--ce-ink:         #22332f;
	--ce-ink-soft:    #4b5b57;
	--ce-muted:       #7a8784;

	/* Neutros cálidos: la web respira, no compite con las fotos */
	--ce-cream:       #f8f6f1;
	--ce-sand:        #efe9df;
	--ce-line:        #e4e8e6;
	--ce-white:       #ffffff;

	--ce-radius:      1.25rem;
	--ce-radius-sm:   .75rem;
	--ce-shadow:      0 1rem 2.5rem rgba(34, 51, 47, .08);
	--ce-shadow-sm:   0 .35rem 1rem rgba(34, 51, 47, .06);

	--ce-font-display: "Fraunces", Georgia, "Times New Roman", serif;
	--ce-font-body:    "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif;

	/* Bootstrap: se reasignan sus variables para no pelear con sus componentes */
	--bs-body-font-family: var(--ce-font-body);
	--bs-body-color: var(--ce-ink-soft);
	--bs-body-bg: var(--ce-white);
	--bs-heading-color: var(--ce-ink);
	--bs-link-color: var(--ce-teal-dark);
	--bs-link-hover-color: var(--ce-ink);
	--bs-border-color: var(--ce-line);
	--bs-border-radius: var(--ce-radius-sm);
}


/* ==========================================================================
   Base
   ========================================================================== */

html{
	scroll-behavior: smooth;
	scroll-padding-top: 6rem;
}

body{
	font-family: var(--ce-font-body);
	font-size: 1.0625rem;
	line-height: 1.7;
	color: var(--ce-ink-soft);
	background: var(--ce-white);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	overflow-x: hidden;
}

h1, h2, h3, h4, h5, h6{
	font-family: var(--ce-font-display);
	font-weight: 500;
	line-height: 1.15;
	letter-spacing: -.01em;
	color: var(--ce-ink);
}

a{
	color: var(--ce-teal-dark);
	text-decoration: none;
	transition: color .2s ease;
}

	a:hover,
	a:focus{
		color: var(--ce-ink);
	}

img{
	max-width: 100%;
	height: auto;
}

p:last-child{
	margin-bottom: 0;
}

strong, b{
	font-weight: 700;
	color: var(--ce-ink);
}

::selection{
	background: var(--ce-teal-soft);
	color: var(--ce-ink);
}

section{
	padding-block: 5.5rem;
}

.visually-hidden-focusable:focus{
	position: fixed;
	top: 1rem;
	left: 1rem;
	z-index: 2000;
	padding: .5rem 1rem;
	background: var(--ce-ink);
	color: #fff;
	border-radius: var(--ce-radius-sm);
}


/* ==========================================================================
   Tipografía de sección
   ========================================================================== */

.eyebrow{
	display: inline-flex;
	align-items: center;
	gap: .4rem;
	margin-bottom: .75rem;
	font-size: .8rem;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--ce-teal-dark);
}

	.eyebrow a{
		color: inherit;
	}

	.eyebrow i{
		font-size: 1rem;
	}

.section-title{
	font-size: clamp(2rem, 3.4vw, 2.75rem);
	margin-bottom: 1.25rem;
}

.section-lead{
	font-size: 1.125rem;
	color: var(--ce-ink-soft);
}

.section-header{
	max-width: 46rem;
	margin: 0 auto 3rem;
	text-align: center;
}

.section-text p{
	margin-bottom: 1rem;
}

.section-sticky{
	position: sticky;
	top: 6.5rem;
	align-self: flex-start;
}

.link-more{
	display: inline-flex;
	align-items: center;
	gap: .35rem;
	font-weight: 700;
	font-size: .95rem;
}

	.link-more i{
		transition: transform .2s ease;
	}

	.link-more:hover i{
		transform: translateX(.25rem);
	}


/* ==========================================================================
   Botones
   ========================================================================== */

.btn{
	--bs-btn-padding-x: 1.35rem;
	--bs-btn-padding-y: .7rem;
	--bs-btn-font-weight: 700;
	--bs-btn-border-radius: 999px;
	--bs-btn-font-size: .95rem;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .5rem;
	transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease, color .2s ease, border-color .2s ease;
}

	.btn i{
		font-size: 1.1em;
		line-height: 1;
	}

	.btn-lg{
		--bs-btn-padding-x: 1.75rem;
		--bs-btn-padding-y: .9rem;
		--bs-btn-font-size: 1.05rem;
	}

.btn-teal{
	--bs-btn-bg: var(--ce-teal);
	--bs-btn-border-color: var(--ce-teal);
	--bs-btn-color: #fff;
	--bs-btn-hover-bg: var(--ce-teal-dark);
	--bs-btn-hover-border-color: var(--ce-teal-dark);
	--bs-btn-hover-color: #fff;
	--bs-btn-active-bg: var(--ce-teal-dark);
	--bs-btn-active-border-color: var(--ce-teal-dark);
	--bs-btn-active-color: #fff;
	box-shadow: 0 .5rem 1.25rem rgba(0, 186, 165, .28);
}

	.btn-teal:hover{
		transform: translateY(-2px);
	}

.btn-outline-teal{
	--bs-btn-color: var(--ce-teal-dark);
	--bs-btn-border-color: var(--ce-teal);
	--bs-btn-hover-bg: var(--ce-teal);
	--bs-btn-hover-border-color: var(--ce-teal);
	--bs-btn-hover-color: #fff;
	--bs-btn-active-bg: var(--ce-teal);
	--bs-btn-active-color: #fff;
}

.btn-ink{
	--bs-btn-bg: var(--ce-ink);
	--bs-btn-border-color: var(--ce-ink);
	--bs-btn-color: #fff;
	--bs-btn-hover-bg: var(--ce-teal);
	--bs-btn-hover-border-color: var(--ce-teal);
	--bs-btn-hover-color: #fff;
	--bs-btn-active-bg: var(--ce-teal-dark);
	--bs-btn-active-color: #fff;
}

.btn-outline-ink{
	--bs-btn-color: var(--ce-ink);
	--bs-btn-border-color: rgba(34, 51, 47, .25);
	--bs-btn-hover-bg: var(--ce-ink);
	--bs-btn-hover-border-color: var(--ce-ink);
	--bs-btn-hover-color: #fff;
	--bs-btn-active-bg: var(--ce-ink);
	--bs-btn-active-color: #fff;
}

.btn-icon{
	--bs-btn-padding-x: .7rem;
	--bs-btn-padding-y: .7rem;
	width: 2.75rem;
	height: 2.75rem;
}

.btn-link{
	--bs-btn-font-weight: 700;
	text-decoration: none;
}


/* ==========================================================================
   Barra superior + cabecera
   ========================================================================== */

.topbar{
	background: var(--ce-ink);
	color: rgba(255, 255, 255, .85);
	font-size: .85rem;
	padding-block: .45rem;
}

	.topbar a,
	.topbar span{
		color: inherit;
		display: inline-flex;
		align-items: center;
		gap: .4rem;
	}

	.topbar a:hover{
		color: var(--ce-teal);
	}

	.topbar .list-inline-item:not(:last-child){
		margin-right: 1.5rem;
	}

	.topbar .rrss a{
		color: rgba(255, 255, 255, .7);
	}

	.topbar .rrss a:hover{
		color: var(--ce-teal);
	}

.header{
	position: sticky;
	top: 0;
	z-index: 1030;
	background: rgba(255, 255, 255, .92);
	backdrop-filter: saturate(180%) blur(12px);
	-webkit-backdrop-filter: saturate(180%) blur(12px);
	border-bottom: 1px solid transparent;
	transition: border-color .2s ease, box-shadow .2s ease;
}

	.header.is-scrolled{
		border-bottom-color: var(--ce-line);
		box-shadow: var(--ce-shadow-sm);
	}

	.header .navbar{
		padding-block: .9rem;
	}

	.header .navbar-brand img{
		width: 200px;
		height: auto;
	}

	.header .navbar-toggler{
		border: 0;
		padding: .35rem .5rem;
		font-size: 1.6rem;
		color: var(--ce-ink);
		line-height: 1;
	}

	.header .navbar-toggler:focus{
		box-shadow: none;
	}

.main-nav .nav-link{
	font-weight: 600;
	font-size: .95rem;
	color: var(--ce-ink);
	padding: .5rem .85rem;
	display: inline-flex;
	align-items: center;
	gap: .2rem;
	position: relative;
}

	.main-nav .nav-link i{
		font-size: .85rem;
		opacity: .6;
		transition: transform .2s ease;
	}

	.main-nav .nav-link::after{
		content: "";
		position: absolute;
		left: .85rem;
		right: .85rem;
		bottom: .15rem;
		height: 2px;
		border-radius: 2px;
		background: var(--ce-teal);
		transform: scaleX(0);
		transform-origin: left;
		transition: transform .25s ease;
	}

	.main-nav .nav-link:hover::after,
	.main-nav .nav-link.active::after,
	.main-nav .show > .nav-link::after{
		transform: scaleX(1);
	}

	.main-nav .show > .nav-link i{
		transform: rotate(180deg);
	}

.main-nav .dropdown-menu{
	--bs-dropdown-border-color: var(--ce-line);
	--bs-dropdown-border-radius: var(--ce-radius-sm);
	--bs-dropdown-padding-y: .6rem;
	--bs-dropdown-item-padding-x: 1.1rem;
	--bs-dropdown-item-padding-y: .5rem;
	--bs-dropdown-link-color: var(--ce-ink-soft);
	--bs-dropdown-link-hover-color: var(--ce-ink);
	--bs-dropdown-link-hover-bg: var(--ce-teal-tint);
	--bs-dropdown-link-active-color: var(--ce-ink);
	--bs-dropdown-link-active-bg: var(--ce-teal-soft);
	--bs-dropdown-min-width: 15rem;
	box-shadow: var(--ce-shadow);
	margin-top: 0;
	font-size: .93rem;
}

	/*
	 * Puente invisible entre el enlace y el menú. Sin él, al bajar el ratón
	 * hacia el desplegable se atraviesa un hueco en el que el :hover del <li>
	 * se pierde y el menú se cierra antes de llegar. El puente forma parte del
	 * menú, así que el hover se mantiene durante todo el recorrido.
	 */
	.main-nav .dropdown-menu::before{
		content: "";
		position: absolute;
		left: 0;
		right: 0;
		bottom: 100%;
		height: 1.25rem;
	}

	.main-nav .dropdown-item{
		display: flex;
		align-items: center;
		gap: .6rem;
		font-weight: 500;
	}

	.main-nav .dropdown-item i{
		color: var(--ce-teal);
		font-size: 1rem;
	}

	.main-nav .dropdown-sublist{
		list-style: none;
		padding-left: 2.3rem;
		margin: 0 0 .25rem;
	}

	.main-nav .dropdown-sublist .dropdown-item{
		font-size: .88rem;
		padding-block: .3rem;
	}

	.main-nav .dropdown-menu-columns{
		--bs-dropdown-min-width: 44rem;
		display: none;
		padding: 1rem;
	}

	.main-nav .dropdown-menu-columns.show{
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap: 0 .5rem;
	}

	.main-nav .dropdown-menu-columns .dropdown-item{
		border-radius: .5rem;
	}

	.main-nav .dropdown-all{
		grid-column: 1 / -1;
		border-top: 1px solid var(--ce-line);
		margin-top: .5rem;
		padding-top: .5rem;
	}

	.main-nav .dropdown-all .dropdown-item{
		color: var(--ce-teal-dark);
	}

	.main-nav .dropdown-all .dropdown-item i{
		font-size: .9rem;
	}

/* Botón "Pedir cita" con desplegable */
.header .dropdown-toggle::after{
	display: none;
}

.header .dropdown-menu{
	--bs-dropdown-border-color: var(--ce-line);
	--bs-dropdown-border-radius: var(--ce-radius-sm);
	--bs-dropdown-link-hover-bg: var(--ce-teal-tint);
	box-shadow: var(--ce-shadow);
	margin-top: .5rem;
}

	.header .dropdown-menu .dropdown-item{
		display: flex;
		align-items: center;
		gap: .6rem;
		padding-block: .55rem;
		font-weight: 500;
	}

	.header .dropdown-menu .dropdown-item i{
		color: var(--ce-teal);
	}


/* ==========================================================================
   Menú móvil (offcanvas)
   ========================================================================== */

.offcanvas{
	--bs-offcanvas-width: min(22rem, 90vw);
}

	.offcanvas-header{
		border-bottom: 1px solid var(--ce-line);
	}

	.offcanvas .main-nav{
		flex-direction: column;
	}

	.offcanvas .main-nav .nav-link{
		font-size: 1.05rem;
		padding: .65rem 0;
		justify-content: space-between;
		width: 100%;
	}

	.offcanvas .main-nav .nav-link::after{
		display: none;
	}

	.offcanvas .main-nav .dropdown-menu{
		position: static !important;
		transform: none !important;
		box-shadow: none;
		border: 0;
		background: var(--ce-cream);
		margin: 0 0 .5rem;
	}

	.offcanvas .main-nav .dropdown-menu-columns.show{
		grid-template-columns: 1fr;
	}

	.offcanvas .rrss{
		display: flex;
		gap: .25rem;
	}


/* ==========================================================================
   Redes sociales
   ========================================================================== */

.rrss{
	display: inline-flex;
	align-items: center;
}

	.rrss .list-inline-item{
		margin-right: .25rem;
	}

	.rrss a{
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 2.25rem;
		height: 2.25rem;
		border-radius: 50%;
		color: var(--ce-ink-soft);
		font-size: 1.05rem;
		transition: background-color .2s ease, color .2s ease, transform .2s ease;
	}

	.rrss a:hover{
		background: var(--ce-teal);
		color: #fff;
		transform: translateY(-2px);
	}


/* ==========================================================================
   Hero
   ========================================================================== */

.hero{
	position: relative;
	padding-block: 4.5rem 5rem;
	background:
		radial-gradient(60rem 30rem at 85% -10%, var(--ce-teal-soft) 0%, transparent 60%),
		linear-gradient(180deg, var(--ce-cream) 0%, var(--ce-white) 100%);
	overflow: hidden;
}

	.hero-title{
		font-size: clamp(2.5rem, 5vw, 4rem);
		font-weight: 500;
		margin-bottom: .75rem;
	}

	.hero-title em{
		font-style: italic;
		color: var(--ce-teal-dark);
	}

	.hero-subtitle{
		font-family: var(--ce-font-display);
		font-size: 1.35rem;
		font-style: italic;
		color: var(--ce-teal-dark);
		margin-bottom: 1.25rem;
	}

	.hero-text{
		font-size: 1.15rem;
		max-width: 34rem;
		margin-bottom: 2rem;
	}

	.hero-actions{
		display: flex;
		flex-wrap: wrap;
		gap: .75rem;
		margin-bottom: 2rem;
	}

	.hero-trust{
		display: inline-flex;
		align-items: center;
		gap: .75rem;
		font-size: .92rem;
		color: var(--ce-ink-soft);
	}

	.hero-trust .stars{
		color: #f5b301;
		display: inline-flex;
		gap: .1rem;
		font-size: .95rem;
	}

	.hero-media{
		position: relative;
	}

	.hero-img{
		width: 100%;
		aspect-ratio: 5 / 4;
		object-fit: cover;
		object-position: 32% center;
		border-radius: var(--ce-radius) 6rem var(--ce-radius) var(--ce-radius);
		box-shadow: var(--ce-shadow);
	}

	.hero-media::before{
		content: "";
		position: absolute;
		inset: auto -1.5rem -1.5rem auto;
		width: 55%;
		height: 55%;
		border-radius: var(--ce-radius) 6rem var(--ce-radius) var(--ce-radius);
		background: var(--ce-teal-soft);
		z-index: -1;
	}

	.hero-badge{
		position: absolute;
		left: -1rem;
		bottom: 2rem;
		display: flex;
		align-items: center;
		gap: .85rem;
		padding: .85rem 1.15rem;
		background: #fff;
		border-radius: var(--ce-radius-sm);
		box-shadow: var(--ce-shadow);
		font-size: .9rem;
		line-height: 1.3;
	}

	.hero-badge i{
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 2.6rem;
		height: 2.6rem;
		border-radius: 50%;
		background: var(--ce-teal-soft);
		color: var(--ce-teal-dark);
		font-size: 1.3rem;
	}

	.hero-badge strong{
		display: block;
	}

	.hero-badge span{
		color: var(--ce-muted);
		font-size: .82rem;
	}


/* ==========================================================================
   Boxes
   ========================================================================== */

.boxes{
	padding-block: 0 5.5rem;
	margin-top: -2rem;
}

.box{
	display: block;
	height: 100%;
	padding: 2rem 1.75rem;
	background: #fff;
	border: 1px solid var(--ce-line);
	border-radius: var(--ce-radius);
	color: var(--ce-ink-soft);
	transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}

	.box:hover{
		transform: translateY(-4px);
		box-shadow: var(--ce-shadow);
		border-color: transparent;
		color: var(--ce-ink-soft);
	}

	.box-icon{
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 3.25rem;
		height: 3.25rem;
		margin-bottom: 1.25rem;
		border-radius: 1rem;
		background: var(--ce-teal-soft);
		color: var(--ce-teal-dark);
		font-size: 1.5rem;
		transition: background-color .25s ease, color .25s ease;
	}

	.box:hover .box-icon{
		background: var(--ce-teal);
		color: #fff;
	}

	.box-title{
		font-size: 1.25rem;
		margin-bottom: .5rem;
	}

	.box-text{
		font-size: .95rem;
		margin: 0;
	}


/* ==========================================================================
   Nosotros / equipo
   ========================================================================== */

.nosotros{
	background: var(--ce-cream);
}

.equipo-card{
	height: 100%;
	background: #fff;
	border-radius: var(--ce-radius);
	overflow: hidden;
	box-shadow: var(--ce-shadow-sm);
	transition: transform .25s ease, box-shadow .25s ease;
}

	.equipo-card:hover{
		transform: translateY(-4px);
		box-shadow: var(--ce-shadow);
	}

	.equipo-media img{
		width: 100%;
		aspect-ratio: 4 / 4.2;
		object-fit: cover;
		object-position: center top;
		transition: transform .6s ease;
	}

	.equipo-card:hover .equipo-media img{
		transform: scale(1.03);
	}

	.equipo-media{
		overflow: hidden;
	}

	.equipo-body{
		padding: 1.35rem 1.5rem 1.6rem;
	}

	.equipo-nombre{
		font-size: 1.3rem;
		margin-bottom: .15rem;
	}

	.equipo-cargo{
		font-size: .8rem;
		font-weight: 700;
		letter-spacing: .06em;
		text-transform: uppercase;
		color: var(--ce-teal-dark);
		margin-bottom: .6rem;
	}

	.equipo-texto{
		font-size: .93rem;
		margin: 0;
	}

	/* La segunda columna baja un poco: rompe la cuadrícula y da aire */
	.equipo-grid .col-sm-6:nth-child(even){
		margin-top: 2.5rem;
	}


/* ==========================================================================
   Centros homologados
   ========================================================================== */

.homologados{
	padding-block: 3rem;
	border-top: 1px solid var(--ce-line);
	border-bottom: 1px solid var(--ce-line);
}

	.logo-homologado{
		max-height: 5.5rem;
		width: auto;
		filter: grayscale(1);
		opacity: .75;
		transition: filter .3s ease, opacity .3s ease;
	}

	.logo-homologado:hover{
		filter: grayscale(0);
		opacity: 1;
	}


/* ==========================================================================
   Tratamientos
   ========================================================================== */

.tratamiento-card{
	height: 100%;
	display: flex;
	flex-direction: column;
	background: #fff;
	border: 1px solid var(--ce-line);
	border-radius: var(--ce-radius);
	overflow: hidden;
	transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}

	.tratamiento-card:hover{
		transform: translateY(-4px);
		box-shadow: var(--ce-shadow);
		border-color: transparent;
	}

	.tratamiento-media{
		display: block;
		overflow: hidden;
	}

	.tratamiento-media img{
		width: 100%;
		aspect-ratio: 3 / 2;
		object-fit: cover;
		transition: transform .6s ease;
	}

	.tratamiento-card:hover .tratamiento-media img{
		transform: scale(1.04);
	}

	.tratamiento-body{
		display: flex;
		flex-direction: column;
		flex: 1;
		padding: 1.5rem 1.6rem 1.75rem;
	}

	.tratamiento-titulo{
		font-size: 1.35rem;
		margin-bottom: .6rem;
	}

	.tratamiento-titulo a{
		color: var(--ce-ink);
	}

	.tratamiento-titulo a:hover{
		color: var(--ce-teal-dark);
	}

	.tratamiento-texto{
		font-size: .95rem;
		margin-bottom: 1.25rem;
		flex: 1;
	}


/* ==========================================================================
   FAQs
   ========================================================================== */

.faqs{
	background: var(--ce-cream);
}

.accordion-faqs{
	--bs-accordion-bg: #fff;
	--bs-accordion-border-color: transparent;
	--bs-accordion-border-radius: var(--ce-radius-sm);
	--bs-accordion-inner-border-radius: var(--ce-radius-sm);
	--bs-accordion-btn-padding-x: 1.5rem;
	--bs-accordion-btn-padding-y: 1.15rem;
	--bs-accordion-body-padding-x: 1.5rem;
	--bs-accordion-body-padding-y: 0;
	--bs-accordion-btn-color: var(--ce-ink);
	--bs-accordion-active-color: var(--ce-teal-dark);
	--bs-accordion-active-bg: #fff;
	--bs-accordion-btn-focus-box-shadow: none;
	--bs-accordion-btn-icon-width: 1rem;
	--bs-accordion-btn-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%2322332f'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
	--bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23009a89'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}

	.accordion-faqs .accordion-item{
		margin-bottom: .75rem;
		border-radius: var(--ce-radius-sm);
		box-shadow: var(--ce-shadow-sm);
		overflow: hidden;
	}

	.accordion-faqs .accordion-button{
		font-family: var(--ce-font-display);
		font-size: 1.2rem;
		font-weight: 500;
		line-height: 1.3;
	}

	.accordion-faqs .accordion-body{
		padding-bottom: 1.35rem;
		font-size: .98rem;
	}


/* ==========================================================================
   Dónde encontrarnos
   ========================================================================== */

.centro-card{
	background: #fff;
	border-radius: var(--ce-radius);
	overflow: hidden;
	box-shadow: var(--ce-shadow);
}

	.centro-map{
		height: 100%;
		min-height: 26rem;
	}

	.centro-map iframe{
		display: block;
		width: 100%;
		height: 100%;
		min-height: 26rem;
		border: 0;
	}

	.centro-body{
		padding: 2.25rem 2.25rem 2.5rem;
	}

	.centro-titulo{
		font-size: 1.5rem;
	}

	.centro-texto{
		font-size: .95rem;
		margin-bottom: 1.5rem;
	}

	.centro-datos li{
		display: flex;
		gap: .85rem;
		align-items: flex-start;
		padding-block: .5rem;
		border-top: 1px solid var(--ce-line);
		font-size: .95rem;
	}

	.centro-datos li i{
		color: var(--ce-teal);
		font-size: 1.15rem;
		margin-top: .15rem;
		flex-shrink: 0;
	}

	.rating-pill{
		display: inline-flex;
		align-items: center;
		gap: .35rem;
		padding: .3rem .7rem;
		border-radius: 999px;
		background: #fff7dd;
		color: #7a5a00;
		font-weight: 700;
		font-size: .85rem;
		white-space: nowrap;
	}

	.rating-pill i{
		color: #f5b301;
	}


/* ==========================================================================
   CTA cita (banda antes del pie)
   ========================================================================== */

.cta-cita{
	position: relative;
	padding-block: 4.5rem;
	background:
		radial-gradient(40rem 20rem at 0% 100%, rgba(255, 255, 255, .12) 0%, transparent 60%),
		linear-gradient(135deg, var(--ce-teal) 0%, var(--ce-teal-dark) 100%);
	color: #fff;
}

	.cta-cita .eyebrow{
		color: rgba(255, 255, 255, .8);
	}

	.cta-title{
		color: #fff;
		font-size: clamp(2rem, 3.6vw, 3rem);
		margin-bottom: 1rem;
	}

	.cta-title i{
		color: #fff;
		font-size: .8em;
		vertical-align: -.05em;
	}

	.cta-cita .lead{
		color: rgba(255, 255, 255, .9);
		font-size: 1.1rem;
	}

	.cta-actions{
		display: flex;
		flex-direction: column;
		align-items: stretch;
		gap: .75rem;
	}

	.cta-actions .btn-light{
		--bs-btn-color: var(--ce-teal-dark);
		--bs-btn-hover-color: var(--ce-ink);
	}

	.cta-actions .btn-outline-light{
		--bs-btn-hover-color: var(--ce-teal-dark);
	}

	.cta-actions .btn-link{
		--bs-btn-font-weight: 500;
		text-decoration: underline;
		text-underline-offset: .2em;
	}


/* ==========================================================================
   Pie
   ========================================================================== */

.footer{
	padding-block: 4.5rem 2rem;
	background: var(--ce-ink);
	color: rgba(255, 255, 255, .72);
	font-size: .95rem;
}

	.footer a{
		color: rgba(255, 255, 255, .85);
	}

	.footer a:hover{
		color: var(--ce-teal);
	}

	/* El logotipo a color se pasa a blanco: sobre carbón es lo que se lee */
	.footer-logo{
		max-width: 200px;
		height: auto;
		filter: brightness(0) invert(1);
		opacity: .9;
	}

	.footer-title{
		font-family: var(--ce-font-body);
		font-size: .8rem;
		font-weight: 700;
		letter-spacing: .12em;
		text-transform: uppercase;
		color: #fff;
		margin-bottom: 1.1rem;
	}

	.footer-links li{
		margin-bottom: .45rem;
	}

	.footer-contact li{
		display: flex;
		gap: .7rem;
		align-items: flex-start;
		margin-bottom: .85rem;
	}

	.footer-contact i{
		color: var(--ce-teal);
		font-size: 1.1rem;
		margin-top: .15rem;
		flex-shrink: 0;
	}

	.footer .rrss{
		margin-top: 1rem;
	}

	.footer .rrss a{
		color: rgba(255, 255, 255, .75);
		background: rgba(255, 255, 255, .06);
	}

	.footer .rrss a:hover{
		background: var(--ce-teal);
		color: #fff;
	}

	.footer-bottom{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		align-items: center;
		gap: .75rem;
		margin-top: 3.5rem;
		padding-top: 1.5rem;
		border-top: 1px solid rgba(255, 255, 255, .1);
		font-size: .85rem;
		color: rgba(255, 255, 255, .55);
	}

	.footer-bottom .list-inline-item:not(:last-child){
		margin-right: 1.25rem;
	}

	.footer-bottom a{
		color: rgba(255, 255, 255, .7);
	}


/* ==========================================================================
   Volver arriba
   ========================================================================== */

.btn-scroll-top{
	position: fixed;
	right: 1.25rem;
	bottom: 1.25rem;
	z-index: 1020;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.75rem;
	height: 2.75rem;
	border-radius: 50%;
	background: var(--ce-ink);
	color: #fff;
	box-shadow: var(--ce-shadow);
	opacity: 0;
	visibility: hidden;
	transform: translateY(.5rem);
	transition: opacity .25s ease, transform .25s ease, visibility .25s;
}

	.btn-scroll-top.is-visible{
		opacity: 1;
		visibility: visible;
		transform: none;
	}

	.btn-scroll-top:hover{
		background: var(--ce-teal);
		color: #fff;
	}


/* ==========================================================================
   Formularios y modal
   ========================================================================== */

.form-control,
.form-select{
	padding: .7rem .95rem;
	border-color: var(--ce-line);
	border-radius: var(--ce-radius-sm);
}

	.form-control:focus,
	.form-select:focus{
		border-color: var(--ce-teal);
		box-shadow: 0 0 0 .25rem rgba(0, 186, 165, .18);
	}

.form-label{
	font-weight: 600;
	font-size: .9rem;
	color: var(--ce-ink);
}

.form-check-input:checked{
	background-color: var(--ce-teal);
	border-color: var(--ce-teal);
}

.modal-content{
	border: 0;
	border-radius: var(--ce-radius);
	box-shadow: var(--ce-shadow);
}

	.modal-header{
		border-bottom-color: var(--ce-line);
		align-items: flex-start;
	}

	.modal-footer{
		border-top-color: var(--ce-line);
	}


/* ==========================================================================
   Animación de entrada (progresiva: sin JS todo se ve)
   ========================================================================== */

@media (prefers-reduced-motion: no-preference){
	.js [data-reveal]{
		opacity: 0;
		transform: translateY(1.25rem);
		transition: opacity .6s ease, transform .6s ease;
	}

	.js [data-reveal].is-revealed{
		opacity: 1;
		transform: none;
	}
}


/* ==========================================================================
   Páginas interiores: cabecera y migas
   ========================================================================== */

.page-hero{
	padding-block: 1.5rem 3.5rem;
	background:
		radial-gradient(50rem 24rem at 90% -20%, var(--ce-teal-soft) 0%, transparent 60%),
		linear-gradient(180deg, var(--ce-cream) 0%, var(--ce-white) 100%);
}

	.page-breadcrumb{
		margin-bottom: 2rem;
	}

	.page-breadcrumb .breadcrumb{
		--bs-breadcrumb-divider: "›";
		--bs-breadcrumb-divider-color: var(--ce-muted);
		--bs-breadcrumb-item-active-color: var(--ce-ink);
		font-size: .85rem;
		margin: 0;
	}

	.page-breadcrumb a{
		color: var(--ce-muted);
	}

	.page-breadcrumb a:hover{
		color: var(--ce-teal-dark);
	}

	.page-breadcrumb .breadcrumb-item i{
		font-size: 1rem;
		vertical-align: -.1em;
	}

	.page-title{
		font-size: clamp(2rem, 4vw, 3.25rem);
		margin-bottom: .75rem;
	}

	.page-subtitle{
		font-family: var(--ce-font-display);
		font-style: italic;
		font-size: 1.3rem;
		color: var(--ce-teal-dark);
		margin-bottom: 1.25rem;
	}

	.page-intro{
		font-size: 1.1rem;
		max-width: 44rem;
	}

	.page-actions{
		display: flex;
		flex-wrap: wrap;
		gap: .75rem;
		margin-top: 1.75rem;
	}

	.page-hero-img{
		width: 100%;
		aspect-ratio: 4 / 3;
		object-fit: cover;
		border-radius: var(--ce-radius) 5rem var(--ce-radius) var(--ce-radius);
		box-shadow: var(--ce-shadow);
	}

.page-content{
	padding-block: 4.5rem;
}

.bg-cream{
	background: var(--ce-cream);
}

.img-rounded{
	width: 100%;
	border-radius: var(--ce-radius);
	box-shadow: var(--ce-shadow);
}


/* ==========================================================================
   Prosa: contenido que viene del editor
   ========================================================================== */

.prose{
	font-size: 1.05rem;
	line-height: 1.75;
}

	.prose > *:first-child{
		margin-top: 0;
	}

	.prose p,
	.prose ul,
	.prose ol{
		margin-bottom: 1.15rem;
	}

	.prose h2,
	.prose h3,
	.prose h4{
		margin: 2.25rem 0 .9rem;
	}

	.prose h2{ font-size: 1.75rem; }
	.prose h3{ font-size: 1.4rem; }
	.prose h4{ font-size: 1.15rem; }

	.prose h2 a,
	.prose h3 a,
	.prose h4 a{
		color: inherit;
	}

	.prose ul,
	.prose ol{
		padding-left: 1.4rem;
	}

	.prose li{
		margin-bottom: .4rem;
	}

	.prose li::marker{
		color: var(--ce-teal);
	}

	.prose a[href]:not([class]){
		text-decoration: underline;
		text-underline-offset: .2em;
		text-decoration-color: var(--ce-teal);
	}

	.prose img{
		border-radius: var(--ce-radius-sm);
		margin-block: 1rem;
	}

	.prose blockquote{
		margin: 1.75rem 0;
		padding: 1rem 1.5rem;
		border-left: 4px solid var(--ce-teal);
		background: var(--ce-cream);
		border-radius: 0 var(--ce-radius-sm) var(--ce-radius-sm) 0;
		font-family: var(--ce-font-display);
		font-style: italic;
		font-size: 1.15rem;
	}

	.prose table{
		width: 100%;
		margin-bottom: 1.25rem;
		font-size: .95rem;
	}

	.prose td,
	.prose th{
		padding: .5rem .75rem;
		border-bottom: 1px solid var(--ce-line);
		vertical-align: top;
	}

	/*
	 * El editor de la web anterior guardó tamaños y fuentes en línea
	 * (Optima, 12pt, 14pt…). Aquí manda la tipografía de la web.
	 */
	.prose [style]{
		font-family: inherit !important;
		font-size: inherit !important;
		line-height: inherit !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
		color: inherit !important;
	}

	.prose-legal{
		font-size: .98rem;
	}

	.prose-legal h3{
		font-size: 1.25rem;
	}


/* ==========================================================================
   Laterales
   ========================================================================== */

.aside-card{
	padding: 1.5rem 1.6rem;
	background: #fff;
	border: 1px solid var(--ce-line);
	border-radius: var(--ce-radius);
	margin-bottom: 1.25rem;
}

	.aside-title{
		font-size: 1.15rem;
		margin-bottom: 1rem;
	}

	.aside-cita{
		background: var(--ce-cream);
		border-color: transparent;
	}

	.aside-cita p{
		font-size: .95rem;
		margin-bottom: 1.25rem;
	}

	.aside-list{
		list-style: none;
		padding: 0;
		margin: 0;
	}

	.aside-list li + li{
		border-top: 1px solid var(--ce-line);
	}

	.aside-list a{
		display: block;
		padding: .6rem 0;
		color: var(--ce-ink-soft);
		font-weight: 500;
		font-size: .95rem;
	}

	.aside-list a:hover,
	.aside-list a.active{
		color: var(--ce-teal-dark);
	}

	.aside-list a.active{
		font-weight: 700;
	}

	.aside-check{
		list-style: none;
		padding: 0;
		margin: 0;
	}

	.aside-check li{
		display: flex;
		gap: .6rem;
		align-items: flex-start;
		padding-block: .4rem;
		font-size: .95rem;
	}

	.aside-check i{
		color: var(--ce-teal);
		font-size: 1.1rem;
		margin-top: .15rem;
		flex-shrink: 0;
	}

	.aside-check a{
		display: inline-flex;
		gap: .6rem;
		color: var(--ce-ink);
		font-weight: 600;
	}

	.aside-tags{
		list-style: none;
		padding: 0;
		margin: 0;
		display: flex;
		flex-wrap: wrap;
		gap: .5rem;
	}

	.aside-tags a{
		display: inline-block;
		padding: .35rem .8rem;
		border-radius: 999px;
		background: var(--ce-cream);
		color: var(--ce-ink-soft);
		font-size: .85rem;
		font-weight: 600;
		transition: background-color .2s ease, color .2s ease;
	}

	.aside-tags a:hover,
	.aside-tags a.active{
		background: var(--ce-teal);
		color: #fff;
	}

	.aside-search{
		display: flex;
		gap: .5rem;
	}

	.aside-search .form-control{
		flex: 1;
	}

	.aside-posts{
		list-style: none;
		padding: 0;
		margin: 0;
	}

	.aside-posts li{
		display: flex;
		gap: .9rem;
		align-items: center;
		padding-block: .7rem;
	}

	.aside-posts li + li{
		border-top: 1px solid var(--ce-line);
	}

	.aside-post-media{
		flex-shrink: 0;
		width: 4.5rem;
		aspect-ratio: 1;
		border-radius: var(--ce-radius-sm);
		overflow: hidden;
	}

	.aside-post-media img{
		width: 100%;
		height: 100%;
		object-fit: cover;
	}

	.aside-post-titulo{
		display: block;
		font-weight: 600;
		font-size: .92rem;
		line-height: 1.4;
		color: var(--ce-ink);
	}

	.aside-post-titulo:hover{
		color: var(--ce-teal-dark);
	}

	.aside-posts small{
		color: var(--ce-muted);
	}


/* ==========================================================================
   Nuestro enfoque
   ========================================================================== */

.enfoque-card{
	display: flex;
	gap: 1.5rem;
	height: 100%;
	padding: 2rem;
	background: #fff;
	border: 1px solid var(--ce-line);
	border-radius: var(--ce-radius);
	color: var(--ce-ink-soft);
	transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}

	.enfoque-card:hover{
		transform: translateY(-4px);
		box-shadow: var(--ce-shadow);
		border-color: transparent;
		color: var(--ce-ink-soft);
	}

	.enfoque-card .box-icon{
		flex-shrink: 0;
		margin-bottom: 0;
	}

	.enfoque-card:hover .box-icon{
		background: var(--ce-teal);
		color: #fff;
	}

	.enfoque-titulo{
		font-size: 1.4rem;
		margin-bottom: .5rem;
	}

	.enfoque-texto{
		font-size: .95rem;
		margin-bottom: .75rem;
	}


/* ==========================================================================
   Centros
   ========================================================================== */

.centro-ficha{
	padding: 2rem 2.25rem;
	background: #fff;
	border-radius: var(--ce-radius);
	box-shadow: var(--ce-shadow-sm);
}


/* ==========================================================================
   Galería (instalaciones)
   ========================================================================== */

.galeria-grid{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	grid-auto-rows: 14rem;
	grid-auto-flow: dense;
	gap: 1rem;
}

	.galeria-item{
		position: relative;
		display: block;
		border-radius: var(--ce-radius-sm);
		overflow: hidden;
		background: var(--ce-sand);
	}

	.galeria-item:nth-child(6n+1){
		grid-column: span 2;
		grid-row: span 2;
	}

	.galeria-item:nth-child(6n+4){
		grid-row: span 2;
	}

	.galeria-item img{
		width: 100%;
		height: 100%;
		object-fit: cover;
		transition: transform .6s ease;
	}

	.galeria-item:hover img{
		transform: scale(1.05);
	}

	.galeria-zoom{
		position: absolute;
		inset: 0;
		display: flex;
		align-items: center;
		justify-content: center;
		color: #fff;
		font-size: 1.75rem;
		background: rgba(34, 51, 47, .35);
		opacity: 0;
		transition: opacity .25s ease;
	}

	.galeria-item:hover .galeria-zoom{
		opacity: 1;
	}

.lightbox{
	position: fixed;
	inset: 0;
	z-index: 1080;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(34, 51, 47, .94);
	opacity: 0;
	visibility: hidden;
	transition: opacity .25s ease, visibility .25s;
}

	.lightbox.is-open{
		opacity: 1;
		visibility: visible;
	}

	.lightbox img{
		max-width: min(92vw, 1400px);
		max-height: 84vh;
		border-radius: var(--ce-radius-sm);
		box-shadow: 0 2rem 4rem rgba(0, 0, 0, .4);
	}

	.lightbox-caption{
		position: absolute;
		left: 0;
		right: 0;
		bottom: 1.5rem;
		text-align: center;
		color: rgba(255, 255, 255, .8);
		font-size: .9rem;
	}

	.lightbox-btn{
		position: absolute;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 3rem;
		height: 3rem;
		border: 0;
		border-radius: 50%;
		background: rgba(255, 255, 255, .12);
		color: #fff;
		font-size: 1.4rem;
		cursor: pointer;
		transition: background-color .2s ease;
	}

	.lightbox-btn:hover{
		background: var(--ce-teal);
	}

	.lightbox-close{ top: 1.25rem; right: 1.25rem; }
	.lightbox-prev{ left: 1.25rem; top: 50%; transform: translateY(-50%); }
	.lightbox-next{ right: 1.25rem; top: 50%; transform: translateY(-50%); }


/* ==========================================================================
   Podcasts
   ========================================================================== */

.podcast-platforms{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .75rem;
	margin-bottom: 2.5rem;
	font-size: .9rem;
	color: var(--ce-muted);
}

	.podcast-platforms a{
		display: inline-flex;
		align-items: center;
		gap: .45rem;
		padding: .45rem 1rem;
		border-radius: 999px;
		border: 1px solid var(--ce-line);
		color: var(--ce-ink);
		font-weight: 600;
	}

	.podcast-platforms a:hover{
		border-color: var(--ce-teal);
		color: var(--ce-teal-dark);
	}

.podcast-card{
	height: 100%;
	display: flex;
	flex-direction: column;
	background: #fff;
	border: 1px solid var(--ce-line);
	border-radius: var(--ce-radius);
	overflow: hidden;
	transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}

	.podcast-card:hover{
		transform: translateY(-4px);
		box-shadow: var(--ce-shadow);
		border-color: transparent;
	}

	.podcast-media{
		position: relative;
		display: block;
		overflow: hidden;
	}

	.podcast-media img{
		width: 100%;
		aspect-ratio: 1;
		object-fit: cover;
		transition: transform .6s ease;
	}

	.podcast-card:hover .podcast-media img{
		transform: scale(1.04);
	}

	.podcast-play{
		position: absolute;
		left: 1rem;
		bottom: 1rem;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 3rem;
		height: 3rem;
		border-radius: 50%;
		background: var(--ce-teal);
		color: #fff;
		font-size: 1.2rem;
		box-shadow: var(--ce-shadow);
	}

	.podcast-body{
		display: flex;
		flex-direction: column;
		flex: 1;
		padding: 1.35rem 1.5rem 1.6rem;
	}

	.podcast-fecha{
		display: inline-flex;
		align-items: center;
		gap: .35rem;
		font-size: .82rem;
		color: var(--ce-muted);
		margin-bottom: .5rem;
	}

	.podcast-titulo{
		font-size: 1.2rem;
		margin-bottom: .6rem;
	}

	.podcast-titulo a{
		color: var(--ce-ink);
	}

	.podcast-titulo a:hover{
		color: var(--ce-teal-dark);
	}

	.podcast-texto{
		font-size: .93rem;
		flex: 1;
		margin-bottom: 1rem;
	}

	.podcast-header{
		margin-bottom: 1.5rem;
	}

	.embed-video{
		border-radius: var(--ce-radius);
		overflow: hidden;
		margin-bottom: 1.5rem;
		box-shadow: var(--ce-shadow);
	}

	.embed-audio{
		margin-bottom: 2rem;
	}

	.embed-audio iframe{
		width: 100%;
		border: 0;
	}


/* ==========================================================================
   Blog
   ========================================================================== */

.post-card{
	display: grid;
	grid-template-columns: 17rem 1fr;
	gap: 1.75rem;
	margin-bottom: 2.5rem;
	padding-bottom: 2.5rem;
	border-bottom: 1px solid var(--ce-line);
}

	.post-card:last-of-type{
		border-bottom: 0;
	}

	.post-card-destacado{
		grid-template-columns: 1fr;
	}

	.post-media{
		display: block;
		border-radius: var(--ce-radius);
		overflow: hidden;
		background: var(--ce-sand);
	}

	.post-media img{
		width: 100%;
		aspect-ratio: 4 / 3;
		object-fit: cover;
		transition: transform .6s ease;
	}

	.post-card-destacado .post-media img{
		aspect-ratio: 21 / 9;
	}

	.post-media:hover img{
		transform: scale(1.04);
	}

	.post-meta{
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		gap: .35rem 1.1rem;
		list-style: none;
		padding: 0;
		margin: 0 0 .75rem;
		font-size: .85rem;
		color: var(--ce-muted);
	}

	.post-meta li{
		display: inline-flex;
		align-items: center;
		gap: .35rem;
	}

	.post-meta a{
		color: var(--ce-muted);
	}

	.post-meta a:hover{
		color: var(--ce-teal-dark);
	}

	.post-categoria{
		display: inline-block;
		padding: .25rem .7rem;
		border-radius: 999px;
		background: var(--ce-teal-soft);
		color: var(--ce-teal-dark) !important;
		font-weight: 700;
		font-size: .78rem;
		letter-spacing: .04em;
		text-transform: uppercase;
	}

	.post-categoria:hover{
		background: var(--ce-teal);
		color: #fff !important;
	}

	.post-titulo{
		font-size: 1.6rem;
		margin-bottom: .6rem;
	}

	.post-card-destacado .post-titulo{
		font-size: 2rem;
	}

	.post-titulo a{
		color: var(--ce-ink);
	}

	.post-titulo a:hover{
		color: var(--ce-teal-dark);
	}

	.post-texto{
		margin-bottom: .75rem;
	}

.post-articulo .post-meta{
	margin-bottom: 1.25rem;
}

	.post-entradilla{
		font-family: var(--ce-font-display);
		font-size: 1.3rem;
		font-style: italic;
		color: var(--ce-ink);
		margin-bottom: 1.75rem;
	}

	.post-figura{
		margin: 0 0 2rem;
		border-radius: var(--ce-radius);
		overflow: hidden;
		box-shadow: var(--ce-shadow);
	}

	.post-figura img{
		width: 100%;
	}

	.post-footer{
		margin-top: 3rem;
		padding-top: 2rem;
		border-top: 1px solid var(--ce-line);
	}

	.post-share{
		display: flex;
		align-items: center;
		gap: .5rem;
		margin-bottom: 2rem;
		font-size: .85rem;
		font-weight: 700;
		letter-spacing: .08em;
		text-transform: uppercase;
		color: var(--ce-muted);
	}

	.post-share span{
		margin-right: .5rem;
	}

	.post-share a{
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 2.5rem;
		height: 2.5rem;
		border-radius: 50%;
		border: 1px solid var(--ce-line);
		color: var(--ce-ink);
		font-size: 1rem;
		transition: background-color .2s ease, color .2s ease, border-color .2s ease;
	}

	.post-share a:hover{
		background: var(--ce-teal);
		border-color: var(--ce-teal);
		color: #fff;
	}

	.post-autor{
		display: flex;
		gap: 1rem;
		align-items: flex-start;
		padding: 1.5rem;
		background: var(--ce-cream);
		border-radius: var(--ce-radius);
	}

	.post-autor .avatar{
		flex-shrink: 0;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 3.25rem;
		height: 3.25rem;
		border-radius: 50%;
		background: var(--ce-teal);
		color: #fff;
		font-family: var(--ce-font-display);
		font-size: 1.4rem;
	}

	.post-autor-nombre{
		font-family: var(--ce-font-display);
		font-size: 1.2rem;
		color: var(--ce-ink);
	}

	.post-autor-bio{
		font-size: .92rem;
		margin: .25rem 0 0;
	}

.post-mini .post-media img{
	aspect-ratio: 3 / 2;
}

	.post-mini .post-fecha{
		margin: .9rem 0 .3rem;
		font-size: .82rem;
		color: var(--ce-muted);
	}

	.post-mini-titulo{
		font-size: 1.15rem;
	}

	.post-mini-titulo a{
		color: var(--ce-ink);
	}

	.post-mini-titulo a:hover{
		color: var(--ce-teal-dark);
	}

.paginacion{
	margin-top: 1rem;
}

	.pagination{
		--bs-pagination-border-radius: 999px;
		--bs-pagination-color: var(--ce-ink);
		--bs-pagination-border-color: var(--ce-line);
		--bs-pagination-hover-bg: var(--ce-teal-tint);
		--bs-pagination-hover-color: var(--ce-teal-dark);
		--bs-pagination-hover-border-color: var(--ce-line);
		--bs-pagination-active-bg: var(--ce-teal);
		--bs-pagination-active-border-color: var(--ce-teal);
		--bs-pagination-focus-box-shadow: none;
		--bs-pagination-disabled-color: var(--ce-muted);
		gap: .35rem;
		flex-wrap: wrap;
	}

	.pagination .page-link{
		display: inline-flex;
		align-items: center;
		justify-content: center;
		min-width: 2.5rem;
		height: 2.5rem;
		border-radius: 999px !important;
		font-weight: 600;
		font-size: .9rem;
	}

.empty-state{
	padding: 3rem 1.5rem;
	text-align: center;
	background: var(--ce-cream);
	border-radius: var(--ce-radius);
	color: var(--ce-muted);
}

	.empty-state i{
		font-size: 2.5rem;
		color: var(--ce-teal);
		display: block;
		margin-bottom: .75rem;
	}


/* ==========================================================================
   Cita
   ========================================================================== */

.form-card{
	padding: 2.25rem;
	background: #fff;
	border: 1px solid var(--ce-line);
	border-radius: var(--ce-radius);
	box-shadow: var(--ce-shadow);
}

	.form-card h2 i{
		color: var(--ce-teal);
	}

.cita-alternativas{
	display: flex;
	flex-direction: column;
	gap: .75rem;
}

	.cita-alternativas h2{
		margin-bottom: .5rem;
	}

	.cita-alt{
		display: flex;
		align-items: center;
		gap: 1rem;
		padding: 1rem 1.25rem;
		background: #fff;
		border: 1px solid var(--ce-line);
		border-radius: var(--ce-radius-sm);
		color: var(--ce-ink);
		transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
	}

	.cita-alt:hover{
		transform: translateX(4px);
		box-shadow: var(--ce-shadow-sm);
		border-color: var(--ce-teal);
		color: var(--ce-ink);
	}

	.cita-alt .box-icon{
		margin-bottom: 0;
		width: 2.75rem;
		height: 2.75rem;
		font-size: 1.25rem;
		flex-shrink: 0;
	}

	.cita-alt strong{
		display: block;
	}

	.cita-alt small{
		display: block;
		color: var(--ce-muted);
	}


/* ==========================================================================
   Páginas de error
   ========================================================================== */

.errorpage{
	padding-block: 6rem;
}

	.errorpage-codigo{
		font-family: var(--ce-font-display);
		font-size: 6rem;
		line-height: 1;
		color: var(--ce-teal-soft);
		margin-bottom: 1rem;
	}
