/* =========================================================================
   C2IET — Sistema visual
   Ayuntamiento de Ponferrada · Centro Integrado del Ecosistema de Innovación
   Digital y Emprendimiento del Territorio

   Referencia visual: /interfaces/*.png
   Este fichero define los tokens y todos los componentes del portal. Movedo
   aporta el motor (WPBakery, opciones); la referencia visual orienta, pero
   legibilidad, accesibilidad y responsive tienen prioridad.
   ========================================================================= */

/* -------------------------------------------------------------------------
   1. TOKENS
   Colores del Manual de Identidad Corporativa C2IET y del logotipo
   vectorial (Azul #0D1B3D · Turquesa #00A79D · Grafito #2B2B2B).
   ------------------------------------------------------------------------- */
:root {
	/* Marca — Manual de Identidad Corporativa C2IET + logo vectorial */
	--c2-navy-900: #0A142C;
	--c2-navy-800: #0D1B3D; /* Azul C2IET */
	--c2-navy-700: #1A2E58;
	--c2-navy-600: #2A4270;

	--c2-cyan-600: #008F87;
	--c2-cyan-500: #00A79D; /* Turquesa C2IET — acentos, botones, rellenos */
	--c2-cyan-400: #1FBFB5;
	--c2-cyan-100: #C5F0ED;
	--c2-cyan-050: #E6F8F7;
	/* Texto de enlace: #00A79D sobre blanco queda ~3:1 y no cumple AA.
	   Este tono sigue la familia del logo y sí pasa 4,5:1. */
	--c2-link: #006B82;

	--c2-yellow-500: #FDD02E; /* categoría destacada */
	--c2-yellow-200: #FDE9A8; /* chips de filtro */
	--c2-yellow-100: #FEF3CE;

	/* Estados */
	--c2-green-700: #1B7A46;
	--c2-green-100: #DFF5E5;
	--c2-amber-700: #8A6100;
	--c2-amber-100: #FDF0D0;
	--c2-red-700: #A5231F;
	--c2-red-100: #FBE2E1;

	/* Neutros */
	--c2-text: #2B2B2B; /* Grafito C2IET */
	--c2-text-soft: #4A4A4A; /* secundario */
	/* Terciario. #8A94A6 daba 3,06:1 sobre blanco y no llegaba al 4,5:1 que
	   pide WCAG AA para texto normal (fechas de evento, pasos del formulario
	   de reserva, pistas de campo). Este tono conserva la jerarquía y pasa
	   tanto sobre blanco (4,97:1) como sobre --c2-bg-alt (4,57:1). */
	--c2-text-faint: #667085;
	--c2-border: #E4E9F2;
	--c2-border-soft: #EEF2F7;
	--c2-bg: #F8F9FD; /* fondo de página */
	--c2-bg-alt: #F1F5F9;
	--c2-white: #FFFFFF;

	/* Tipografía — Manual de Identidad C2IET §9
	   Titulares/señalética: Montserrat. Texto e interfaces: Inter. */
	--c2-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	--c2-font-heading: 'Montserrat', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

	/* Métrica

	   `--c2-container`, `--c2-gutter`, `--c2-section-y` y `--c2-section-y-tight`
	   NO se declaran aquí: los inyecta `inc/movedo-bridge.php` a partir de las
	   Opciones del tema de Movedo (Container size y su escala de espaciado),
	   para que el panel sea la única fuente de verdad de la retícula. Si los
	   declaras en esta hoja, ganarás la cascada y volverás a dejar el panel sin
	   efecto — que es justo el problema que había. */
	--c2-radius: 12px;
	--c2-radius-lg: 16px;
	--c2-radius-pill: 999px;

	--c2-shadow-sm: 0 1px 2px rgba(10, 28, 56, .06);
	--c2-shadow: 0 2px 12px rgba(10, 28, 56, .07);
	--c2-shadow-md: 0 8px 28px rgba(10, 28, 56, .10);
}

/* -------------------------------------------------------------------------
   2. BASE
   ------------------------------------------------------------------------- */

/* Tamaño raíz fijo. NO quitar.

   `theme-style.css` de Movedo encoge la raíz en pantallas pequeñas:

       html                        { font-size: 16px }
       @media (max-width: 1200px)  { html { font-size: 10px } }
       @media (max-width: 767px)   { html { font-size:  8px } }

   Tiene sentido para Movedo, cuya escala tipográfica se re-deriva a partir de
   la raíz. Pero el sistema visual del C2IET dimensiona en `rem` dando por
   hecho una raíz de 16 px, así que heredar ese encogimiento dejaba **todo el
   texto del portal a la mitad en móvil**: el párrafo del hero bajaba de 17 px
   a 8 px y el pie del logo a 4,5 px. Además de ilegible, incumple WCAG.

   Como esta hoja se carga después que la de Movedo y la especificidad es la
   misma, basta con declararlo aquí sin media query para ganar en los tres
   tramos. */
html {
	font-size: 16px;
	background: var(--c2-navy-900);
}

html { -webkit-text-size-adjust: 100%; }

body.c2iet {
	font-family: var(--c2-font);
	font-size: 16px;
	line-height: 1.65;
	color: var(--c2-text);
	background: var(--c2-white);
	margin: 0;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	overflow-x: hidden;
}

.grve-box-icon.grve-top-icon .grve-box-title-wrapper {
    margin-bottom: 0;
}

.grve-box-icon.grve-top-icon .grve-box-title-wrapper,
.grve-box-icon.grve-top-icon .grve-box-title {
    color: var(--c2-navy-800);
}

.c2iet h1, .c2iet h2, .c2iet h3, .c2iet h4, .c2iet h5, .c2iet h6,
.c2iet .grve-title,
.c2iet .grve-heading {
	font-family: var(--c2-font-heading);
	color: var(--c2-navy-800);
	margin: 0 0 .5em;
	line-height: 1.16;
	letter-spacing: -0.02em;
	font-weight: 800;
}

.c2iet h1 { font-size: clamp(2.25rem, 1.4rem + 3.4vw, 4rem); }
.c2iet h2 { font-size: clamp(1.75rem, 1.25rem + 1.9vw, 2.5rem); }
.c2iet h3 { font-size: clamp(1.25rem, 1.05rem + .7vw, 1.5rem); font-weight: 700; }
.c2iet h4 { font-size: 1.125rem; font-weight: 700; }
.c2iet h5 { font-size: 1rem; font-weight: 700; }
.c2iet h6 { font-size: .875rem; font-weight: 700; }

.c2iet p { margin: 0 0 1.15em; }
.c2iet p:last-child { margin-bottom: 0; }

/* Enlaces de texto. Se limita a los que no llevan clase propia: los
   componentes (botones, logo, tarjetas) definen su color y esta regla, al
   ser `.c2iet a` (0,1,1), les ganaría en especificidad. */
.c2iet a:not([class]) { color: var(--c2-cyan-600); text-decoration: none; transition: color .16s ease; }
.c2iet a:not([class]):hover { color: var(--c2-navy-800); }
.c2iet a { text-decoration: none; transition: color .16s ease; }

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

/* Foco visible — requisito WCAG 2.4.7, se aplica en todo el portal */
.c2iet a:focus-visible,
.c2iet button:focus-visible,
.c2iet input:focus-visible,
.c2iet select:focus-visible,
.c2iet textarea:focus-visible,
.c2iet [tabindex]:focus-visible {
	outline: 3px solid var(--c2-link);
	outline-offset: 2px;
	border-radius: 4px;
}

/* Salto al contenido — WCAG 2.4.1 */
.c2-skip-link {
	position: absolute;
	left: -9999px;
	top: 0;
	z-index: 10000;
	background: var(--c2-navy-900);
	color: #fff;
	padding: 14px 22px;
	font-weight: 700;
	border-radius: 0 0 var(--c2-radius) 0;
}
.c2-skip-link:focus,
.c2-skip-link:focus-visible {
	left: 0 !important;
	color: #fff !important;
}

/* El plugin movedo-talento legacy crea dos `.skip-link` adicionales. Si
   llegan a existir por caché, nunca deben entrar en el flujo de la página. */
.c2iet a.skip-link {
	position: absolute !important;
	left: -10000px !important;
	top: 0 !important;
	width: 1px !important;
	height: 1px !important;
	margin: -1px !important;
	padding: 0 !important;
	overflow: hidden !important;
	clip: rect(0 0 0 0) !important;
	clip-path: inset(50%) !important;
	white-space: nowrap !important;
	border: 0 !important;
	opacity: 1 !important;
}
.c2iet a.skip-link:focus,
.c2iet a.skip-link:focus-visible {
	left: var(--c2-gutter) !important;
	top: 0 !important;
	width: auto !important;
	height: auto !important;
	margin: 0 !important;
	padding: 14px 22px !important;
	overflow: visible !important;
	clip: auto !important;
	clip-path: none !important;
	background: var(--c2-navy-900) !important;
	color: #fff !important;
	opacity: 1 !important;
	z-index: 10001 !important;
}

.c2-visually-hidden {
	position: absolute !important;
	width: 1px; height: 1px;
	padding: 0; margin: -1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}

/* -------------------------------------------------------------------------
   3. LAYOUT
   ------------------------------------------------------------------------- */
.c2-container {
	width: 100%;
	max-width: var(--c2-container);
	margin: 0 auto;
	padding: 0 var(--c2-gutter);
	box-sizing: border-box;
}

.c2-section { padding: var(--c2-section-y) 0; }
.c2-section--tight { padding: calc(var(--c2-section-y) * .6) 0; }
.c2-section--bg { background: var(--c2-bg); }

.c2-grid { display: grid; gap: 24px; }
.c2-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.c2-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.c2-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

@media (max-width: 1024px) {
	.c2-grid--3, .c2-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 680px) {
	.c2-grid--2, .c2-grid--3, .c2-grid--4 { grid-template-columns: minmax(0, 1fr); }
}

/* Cabecera de sección: título + enlace "ver todo" a la derecha */
.c2-section-head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	max-width: var(--c2-container);
	margin-left: auto;
	margin-right: auto;
	padding-left: var(--c2-gutter);
	padding-right: var(--c2-gutter);
	gap: 24px;
	margin-bottom: 28px;
	flex-wrap: wrap;
}
.c2-section-head h2 { margin: 0; }
.c2-section-head .c2-link-arrow { flex: none; }

/* -------------------------------------------------------------------------
   4. TOPBAR INSTITUCIONAL
   Franja azul marino: escudo + "Ayuntamiento de Ponferrada" / bandera UE
   ------------------------------------------------------------------------- */
.c2-topbar {
	background: var(--c2-navy-900);
	color: #DCE4F0;
	font-size: .8125rem;
	line-height: 1.3;
}
.c2-topbar .c2-container {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	min-height: 48px;
	padding-top: 8px;
	padding-bottom: 8px;
}
.c2-topbar__side { display: flex; align-items: center; gap: 10px; }
.c2-topbar__crest { width: 26px; height: 30px; flex: none; }
.c2-topbar__eu-flag { width: 34px; height: 23px; flex: none; border-radius: 2px; }
.c2-topbar a { color: #DCE4F0; }
.c2-topbar a:hover { color: #fff; text-decoration: underline; }

@media (max-width: 680px) {
	.c2-topbar { font-size: .6875rem; }
	.c2-topbar .c2-container { min-height: 42px; gap: 10px; }
	.c2-topbar__crest { width: 20px; height: 23px; }
	.c2-topbar__eu-flag { width: 26px; height: 18px; }
}

/* -------------------------------------------------------------------------
   5. HEADER + NAVEGACIÓN
   ------------------------------------------------------------------------- */
.c2-header {
	background: var(--c2-white);
	border-bottom: 1px solid var(--c2-border-soft);
	position: relative;
	z-index: 900;
	transition: transform .28s ease, box-shadow .28s ease;
}
.c2-header.c2-header--sticky.c2-header--simple,
.c2-header.c2-header--sticky.c2-header--shrink,
.c2-header.c2-header--sticky.c2-header--advanced,
.c2-header.c2-header--sticky.c2-header--movedo {
	position: sticky;
	top: 0;
}
.c2-header.c2-header--sticky.is-hidden {
	transform: translateY(-100%);
}
.c2-header.c2-header--sticky.is-stuck {
	box-shadow: 0 8px 24px rgba(13, 27, 61, .08);
}
.c2-header .c2-container {
	display: flex;
	align-items: center;
	gap: 24px;
	height: var(--c2-header-height, 76px);
	min-height: var(--c2-header-height, 76px);
	box-sizing: border-box;
	transition: height .22s ease, min-height .22s ease;
}

.c2-logo {
	font-size: 2.125rem;
	font-weight: 800;
	letter-spacing: -0.045em;
	color: var(--c2-navy-800);
	line-height: 1;
	flex: none;
	white-space: nowrap;
}
.c2-logo:hover { color: var(--c2-navy-900); }
.c2-logo img { display: block; height: var(--c2-logo-height, 48px); max-height: var(--c2-logo-height, 48px); width: auto; transition: height .22s ease, max-height .22s ease; }

.c2-nav { margin-left: auto; }
.c2-nav > ul {
	display: flex;
	align-items: center;
	gap: 6px;
	list-style: none;
	margin: 0;
	padding: 0;
}
.c2-nav li { position: relative; margin: 0; }
.c2-nav > ul > li > a {
	display: flex;
	align-items: center;
	height: var(--c2-header-height, 76px);
	padding: 0 16px;
	font-family: var(--c2-font-heading);
	font-size: 1rem;
	font-weight: 500;
	color: var(--c2-navy-800);
	position: relative;
	white-space: nowrap;
	box-sizing: border-box;
	transition: height .22s ease;
}
.c2-nav > ul > li > a:hover { color: var(--c2-cyan-600); }

/* Sección activa: texto cyan + subrayado grueso (como en la interface) */
.c2-nav > ul > li.current-menu-item > a,
.c2-nav > ul > li.current-menu-ancestor > a,
.c2-nav > ul > li.current-page-ancestor > a {
	color: var(--c2-cyan-500);
	font-weight: 600;
}
.c2-nav > ul > li.current-menu-item > a::after,
.c2-nav > ul > li.current-menu-ancestor > a::after,
.c2-nav > ul > li.current-page-ancestor > a::after {
	content: "";
	position: absolute;
	left: 16px;
	right: 16px;
	bottom: 0;
	height: 3px;
	background: var(--c2-cyan-500);
	border-radius: 3px 3px 0 0;
}

/* Submenús */
.c2-nav ul ul {
	position: absolute;
	top: 100%;
	left: 0;
	min-width: 250px;
	background: var(--c2-white);
	border: 1px solid var(--c2-border);
	border-radius: var(--c2-radius);
	box-shadow: var(--c2-shadow-md);
	list-style: none;
	margin: 0;
	padding: 8px;
	opacity: 0;
	visibility: hidden;
	transform: translateY(6px);
	transition: opacity .16s ease, transform .16s ease, visibility .16s;
	z-index: 20;
}
.c2-nav li:hover > ul,
.c2-nav li:focus-within > ul {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}
.c2-nav ul ul a {
	display: block;
	padding: 10px 14px;
	border-radius: 8px;
	font-size: .9375rem;
	color: var(--c2-navy-800);
}
.c2-nav ul ul a:hover { background: var(--c2-cyan-050); color: var(--c2-cyan-600); }

/* Acciones de cabecera: buscador + acceder */
.c2-header__actions { display: flex; align-items: center; gap: 14px; flex: none; }

.c2-search-toggle {
	width: 42px; height: 42px;
	display: inline-flex; align-items: center; justify-content: center;
	border: 0; background: transparent; cursor: pointer;
	color: var(--c2-navy-800);
	border-radius: 50%;
	transition: background .16s ease, color .16s ease;
}
.c2-search-toggle:hover { background: var(--c2-cyan-050); color: var(--c2-cyan-600); }

.c2-btn-login {
	display: inline-flex; align-items: center; gap: 8px;
	padding: 13px 30px;
	border: 1.5px solid var(--c2-cyan-500);
	border-radius: var(--c2-radius);
	color: var(--c2-navy-800);
	font-weight: 600;
	font-size: 1rem;
	background: transparent;
	transition: background .16s ease, color .16s ease;
	white-space: nowrap;
}
.c2-btn-login:hover { background: var(--c2-cyan-500); color: #fff; }

/* Avatar de usuario autenticado */
.c2-user-chip {
	display: inline-flex; align-items: center; gap: 10px;
	padding: 7px 14px 7px 8px;
	border: 1px solid var(--c2-border);
	border-radius: var(--c2-radius);
	color: var(--c2-navy-800);
	font-weight: 600;
	background: var(--c2-white);
}
.c2-user-chip:hover { border-color: var(--c2-cyan-500); }
.c2-user-chip img { width: 34px; height: 34px; border-radius: 50%; object-fit: cover; }
button.c2-user-chip { cursor: pointer; font: inherit; }

.c2-user-dropdown { position: relative; }
.c2-user-menu {
	display: none; position: absolute; right: 0; top: calc(100% + 6px);
	background: var(--c2-white); border: 1px solid var(--c2-gray-200);
	border-radius: 10px; box-shadow: 0 8px 24px rgba(0,0,0,.12);
	min-width: 220px; padding: 6px 0; margin: 0; list-style: none;
	z-index: 1000;
}
.c2-user-menu.is-open { display: block; }
.c2-user-menu a {
	display: flex; align-items: center; gap: 8px;
	padding: 10px 18px; color: var(--c2-navy-900);
	font-size: .9375rem; text-decoration: none;
}
.c2-user-menu a:hover { background: var(--c2-gray-50); color: var(--c2-cyan-600); }
.c2-user-menu li:last-child { border-top: 1px solid var(--c2-gray-100); margin-top: 4px; padding-top: 4px; }
.c2-user-chip[aria-expanded="true"] svg:last-child { transform: rotate(180deg); }

/* Botón de menú móvil */
.c2-burger {
	display: none;
	width: 46px; height: 46px;
	align-items: center; justify-content: center;
	border: 1px solid var(--c2-border);
	border-radius: 10px;
	background: var(--c2-white);
	cursor: pointer;
	color: var(--c2-navy-800);
}
.c2-burger:hover { border-color: var(--c2-cyan-500); color: var(--c2-cyan-600); }

@media (max-width: 1200px) {
	.c2-nav > ul > li > a { padding-left: 11px; padding-right: 11px; font-size: .9375rem; }
	.c2-btn-login { padding: 12px 20px; }
}
@media (max-width: 1024px) {
	.c2-logo { font-size: 1.75rem; }
	.c2-nav { display: none; }
	.c2-burger { display: inline-flex; }
	.c2-header__actions { margin-left: auto; }
	.c2-btn-login { display: none; }
}

/* Panel de navegación móvil */
.c2-mobile-nav {
	position: fixed;
	inset: 0;
	background: var(--c2-white);
	z-index: 1000;
	display: none;
	flex-direction: column;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
}
.c2-mobile-nav.is-open { display: flex; }
.c2-mobile-nav__head {
	display: flex; align-items: center; justify-content: space-between;
	padding: 18px var(--c2-gutter);
	border-bottom: 1px solid var(--c2-border-soft);
	position: sticky; top: 0; background: var(--c2-white);
}
.c2-mobile-nav__close {
	width: 44px; height: 44px;
	border: 1px solid var(--c2-border); border-radius: 10px;
	background: var(--c2-white); cursor: pointer; color: var(--c2-navy-800);
	display: inline-flex; align-items: center; justify-content: center;
}
.c2-mobile-nav ul { list-style: none; margin: 0; padding: 12px var(--c2-gutter) 32px; }
.c2-mobile-nav ul ul { padding: 0 0 0 18px; }
.c2-mobile-nav a {
	display: block;
	padding: 14px 4px;
	font-size: 1.125rem;
	font-weight: 600;
	color: var(--c2-navy-800);
	border-bottom: 1px solid var(--c2-border-soft);
}
.c2-mobile-nav ul ul a { font-size: 1rem; font-weight: 500; color: var(--c2-text); }
.c2-mobile-nav a:hover,
.c2-mobile-nav .current-menu-item > a { color: var(--c2-cyan-600); }
.c2-mobile-nav__cta { padding: 20px var(--c2-gutter) 40px; }
.c2-mobile-nav__cta .c2-btn { width: 100%; justify-content: center; }
body.c2-nav-open { overflow: hidden; }

/* Buscador desplegable */
.c2-search-panel {
	display: none;
	border-bottom: 1px solid var(--c2-border-soft);
	background: var(--c2-white);
	padding: 22px 0;
}
.c2-search-panel.is-open { display: block; }
.c2-search-panel form { display: flex; gap: 12px; }
.c2-search-panel input[type="search"] {
	flex: 1;
	padding: 15px 20px;
	border: 1px solid var(--c2-border);
	border-radius: var(--c2-radius);
	font-family: var(--c2-font);
	font-size: 1.0625rem;
	color: var(--c2-navy-800);
	background: var(--c2-bg);
}
.c2-search-panel input[type="search"]:focus { border-color: var(--c2-cyan-500); background: #fff; }

/* -------------------------------------------------------------------------
   6. BOTONES Y ENLACES DE ACCIÓN
   ------------------------------------------------------------------------- */
.c2-btn {
	display: inline-flex;
	align-items: center;
	justify-content: space-between;
	gap: 22px;
	padding: 16px 26px;
	border-radius: var(--c2-radius);
	font-family: Poppins, sans-serif;
	font-weight: 600;
	font-size: 1.0625rem;
	line-height: 1.2;
	cursor: pointer;
	border: 1.5px solid transparent;
	transition: background .16s ease, color .16s ease, border-color .16s ease, transform .12s ease;
	text-align: left;
}
.c2-btn svg { flex: none; }
.c2-btn:active { transform: translateY(1px); }

.c2-btn--primary { background: var(--c2-cyan-500); color: #fff; border-color: var(--c2-cyan-500); }
.c2-btn--primary:hover { background: var(--c2-cyan-600); border-color: var(--c2-cyan-600); color: #fff; }

.c2-btn--outline { background: var(--c2-white); color: var(--c2-navy-800); border-color: var(--c2-border); }
.c2-btn--outline:hover { border-color: var(--c2-cyan-500); color: var(--c2-cyan-600); }

.c2-btn--navy { background: var(--c2-navy-800); color: #fff; border-color: var(--c2-navy-800); }
.c2-btn--navy:hover { background: var(--c2-navy-900); color: #fff; }

.c2-btn--ghost { background: transparent; color: var(--c2-cyan-600); border-color: transparent; padding-left: 0; padding-right: 0; }
.c2-btn--ghost:hover { color: var(--c2-navy-800); }

.c2-btn--sm { padding: 11px 18px; font-size: .9375rem; gap: 14px; }
.c2-btn--block { display: flex; width: 100%; }

.c2-link-arrow {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-weight: 600;
	color: var(--c2-cyan-600);
}
.c2-link-arrow svg { transition: transform .16s ease; }
.c2-link-arrow:hover svg { transform: translateX(4px); }

/* -------------------------------------------------------------------------
   7. HERO
   ------------------------------------------------------------------------- */
.c2-hero {
	position: relative;
	background: var(--c2-bg);
	overflow: hidden;
}
/* La mitad derecha del hero sangra hasta el borde de la ventana (como en la
   interface), así que la rejilla ocupa el ancho completo y es el texto el
   que se alinea con el contenedor del sitio mediante su padding izquierdo. */
.c2-hero__inner {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	align-items: stretch;
	min-height: 470px;
}
.c2-hero__text {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: 76px 56px 76px max(var(--c2-gutter), calc((100vw - var(--c2-container)) / 2 + var(--c2-gutter)));
	position: relative;
	z-index: 2;
}
.c2-hero__text-inner { width: 100%; }
.c2-hero h1 { margin-bottom: 20px; }
.c2-hero__lead {
	font-size: clamp(1.0625rem, 1rem + .35vw, 1.3125rem);
	color: var(--c2-text);
	max-width: 30ch;
	margin-bottom: 34px;
}
.c2-hero__actions { display: flex; flex-wrap: wrap; gap: 16px; }

.c2-hero__media { position: relative; min-height: 470px; }
.c2-hero__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

/* Trama topográfica sutil del fondo (interface) */
.c2-hero::before {
	content: "";
	position: absolute;
	inset: 0;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='420' height='420' viewBox='0 0 420 420'%3E%3Cg fill='none' stroke='%230A1C38' stroke-opacity='.05' stroke-width='1'%3E%3Cpath d='M-40 120C60 60 160 190 250 120s150-40 250 30'/%3E%3Cpath d='M-40 180C60 120 160 250 250 180s150-40 250 30'/%3E%3Cpath d='M-40 240C60 180 160 310 250 240s150-40 250 30'/%3E%3Cpath d='M-40 300C60 240 160 370 250 300s150-40 250 30'/%3E%3Cpath d='M-40 360C60 300 160 430 250 360s150-40 250 30'/%3E%3C/g%3E%3C/svg%3E");
	pointer-events: none;
}

/* Retícula de puntos decorativa */
.c2-dots {
	position: absolute;
	width: 110px; height: 76px;
	background-image: radial-gradient(var(--c2-cyan-400) 1.4px, transparent 1.4px);
	background-size: 13px 13px;
	opacity: .5;
	pointer-events: none;
}

@media (max-width: 900px) {
	.c2-hero__inner { grid-template-columns: minmax(0, 1fr); min-height: 0; }
	.c2-hero__text { padding: 48px var(--c2-gutter) 40px; order: 1; }
	.c2-hero__media { order: 2; min-height: 280px; height: 42vw; max-height: 380px; }
	.c2-hero__lead { max-width: none; }
}
@media (max-width: 480px) {
	.c2-hero__actions { flex-direction: column; align-items: stretch; }
	.c2-hero__actions .c2-btn { justify-content: space-between; }
}

/* Hero interior (páginas que no son la Home) */
.c2-page-hero {
	position: relative;
	background: var(--c2-bg);
	padding: 40px 0 52px;
	overflow: hidden;
}
.c2-page-hero h1 { margin-bottom: 16px; max-width: 20ch; }
.c2-page-hero__lead { font-size: 1.125rem; color: var(--c2-text); max-width: 62ch; }
.c2-page-hero__actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 28px; }

/* Migas de pan */
/* Migas.

   Se veían flojas: el separador usaba el color de borde (#E4E9F2), casi
   invisible sobre el lavanda de la banda, y los enlaces iban en gris claro.
   El resultado era una fila de texto suelto que no se leía como un rastro de
   navegación. Ahora el separador tiene contraste propio, el enlace usa el
   color de texto secundario y la página actual va en azul de marca. */
.c2-breadcrumbs {
	font-size: .875rem;
	color: var(--c2-text-soft);
	margin-bottom: 22px;
}
.c2-breadcrumbs ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.c2-breadcrumbs li { display: flex; align-items: center; gap: 10px; }
.c2-breadcrumbs li + li::before {
	content: "/";
	color: var(--c2-text-faint);
	font-weight: 400;
}
.c2-breadcrumbs a {
	color: var(--c2-text-soft);
	text-decoration: none;
	border-bottom: 1px solid transparent;
}
.c2-breadcrumbs a:hover,
.c2-breadcrumbs a:focus-visible {
	color: var(--c2-design-teal-dark);
	border-bottom-color: currentColor;
}
.c2-breadcrumbs [aria-current="page"] {
	color: var(--c2-design-blue);
	font-weight: 600;
}

/* -------------------------------------------------------------------------
   8. TARJETAS DE ACCESO RÁPIDO (Home)
   ------------------------------------------------------------------------- */
.c2-quicklinks {
	position: relative;
	z-index: 3;
	margin-top: -58px;
	margin-bottom: 8px;
}
.c2-quicklink {
	display: flex;
	align-items: center;
	gap: 20px;
	background: var(--c2-white);
	border: 1px solid var(--c2-border-soft);
	border-radius: var(--c2-radius-lg);
	padding: 28px 26px;
	box-shadow: var(--c2-shadow);
	transition: box-shadow .18s ease, transform .18s ease, border-color .18s ease;
	height: 100%;
}
.c2-quicklink:hover {
	box-shadow: var(--c2-shadow-md);
	transform: translateY(-3px);
	border-color: var(--c2-cyan-100);
}
.c2-quicklink__icon { flex: none; color: var(--c2-cyan-500); }
.c2-quicklink__body { flex: 1; min-width: 0; }
.c2-quicklink__body h3 { font-size: 1.1875rem; margin: 0 0 6px; font-weight: 700; }
.c2-quicklink__body p { font-size: .9375rem; color: var(--c2-text-soft); margin: 0; }
.c2-quicklink__arrow { flex: none; color: var(--c2-cyan-500); transition: transform .16s ease; }
.c2-quicklink:hover .c2-quicklink__arrow { transform: translateX(4px); }

@media (max-width: 900px) {
	.c2-quicklinks { margin-top: 32px; }
}

/* -------------------------------------------------------------------------
   9. TARJETAS DE EVENTO
   ------------------------------------------------------------------------- */
.c2-event-card {
	display: flex;
	gap: 26px;
	background: var(--c2-white);
	border: 1px solid var(--c2-border-soft);
	border-radius: var(--c2-radius-lg);
	padding: 26px 28px;
	box-shadow: var(--c2-shadow-sm);
	transition: box-shadow .18s ease, transform .18s ease, border-color .18s ease;
	height: 100%;
	align-items: flex-start;
}
.c2-event-card:hover { box-shadow: var(--c2-shadow-md); transform: translateY(-3px); border-color: var(--c2-cyan-100); }

.c2-event-date {
	flex: none;
	text-align: center;
	padding-right: 26px;
	border-right: 1px solid var(--c2-border);
	min-width: 92px;
	align-self: stretch;
}
.c2-event-date__day {
	display: block;
	font-size: 2.75rem;
	font-weight: 800;
	color: var(--c2-navy-800);
	line-height: 1;
	letter-spacing: -.03em;
}
.c2-event-date__month {
	display: block;
	font-size: .875rem;
	font-weight: 700;
	color: var(--c2-navy-800);
	text-transform: uppercase;
	letter-spacing: .09em;
	margin-top: 8px;
}
.c2-event-date__year { display: block; font-size: .875rem; color: var(--c2-text-faint); margin-top: 4px; }

.c2-event-card__body { flex: 1; min-width: 0; }
.c2-event-card__body h3 { font-size: 1.3125rem; margin: 12px 0 12px; }
.c2-event-card__body h3 a { color: inherit; }
.c2-event-card__body h3 a:hover { color: var(--c2-cyan-600); }
.c2-event-card__excerpt { font-size: .9375rem; color: var(--c2-text-soft); margin: 0; }
.c2-event-card__arrow { flex: none; align-self: center; color: var(--c2-cyan-500); transition: transform .16s ease; }
.c2-event-card:hover .c2-event-card__arrow { transform: translateX(4px); }

/* Metadatos: hora, lugar, plazas */
.c2-meta {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 22px;
	font-size: .875rem;
	color: var(--c2-text-soft);
	margin: 0 0 10px;
	list-style: none;
	padding: 0;
}
.c2-meta li { display: flex; align-items: center; gap: 7px; margin: 0; }
.c2-meta svg { flex: none; color: var(--c2-text-faint); }

@media (max-width: 560px) {
	.c2-event-card { flex-wrap: wrap; gap: 18px; padding: 22px; }
	.c2-event-date {
		display: flex; align-items: baseline; gap: 10px;
		border-right: 0; border-bottom: 1px solid var(--c2-border);
		padding: 0 0 14px; width: 100%; text-align: left; min-width: 0;
	}
	.c2-event-date__day { font-size: 2rem; }
	.c2-event-date__month, .c2-event-date__year { margin-top: 0; }
	.c2-event-card__arrow { display: none; }
}

/* -------------------------------------------------------------------------
   10. BADGES, CHIPS Y ESTADOS
   ------------------------------------------------------------------------- */
.c2-badge {
	display: inline-block;
	padding: 6px 13px;
	border-radius: 7px;
	font-size: .75rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .07em;
	line-height: 1.3;
}
.c2-badge--navy { background: var(--c2-navy-900); color: #fff; }
.c2-badge--yellow { background: var(--c2-yellow-500); color: var(--c2-navy-900); }
.c2-badge--soft { background: var(--c2-yellow-100); color: #7A5B00; }
.c2-badge--cyan { background: var(--c2-cyan-050); color: var(--c2-cyan-600); }

/* Píldoras de estado (disponibilidad, convocatoria, reservas) */
.c2-status {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 5px 13px;
	border-radius: var(--c2-radius-pill);
	font-size: .8125rem;
	font-weight: 600;
	line-height: 1.4;
}
.c2-status::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; flex: none; }
.c2-status--ok { background: var(--c2-green-100); color: var(--c2-green-700); }
.c2-status--wait { background: var(--c2-amber-100); color: var(--c2-amber-700); }
.c2-status--off { background: var(--c2-red-100); color: var(--c2-red-700); }
.c2-status--info { background: var(--c2-cyan-050); color: var(--c2-cyan-600); }
.c2-status--neutral { background: var(--c2-bg-alt); color: var(--c2-text-soft); }
.c2-status--plain::before { display: none; }

/* Chips de filtro por categoría */
.c2-chips { display: flex; flex-wrap: wrap; gap: 10px; }
.c2-chip {
	display: inline-flex;
	align-items: center;
	padding: 11px 22px;
	border-radius: 9px;
	font-size: .9375rem;
	font-weight: 600;
	background: var(--c2-yellow-200);
	color: #6B4E00;
	border: 0;
	cursor: pointer;
	font-family: var(--c2-font);
	transition: background .16s ease, color .16s ease;
	white-space: nowrap;
}
.c2-chip:hover { background: var(--c2-yellow-500); color: var(--c2-navy-900); }
.c2-chip.is-active,
.c2-chip[aria-current="true"] { background: var(--c2-cyan-500); color: #fff; }

/* -------------------------------------------------------------------------
   11. TARJETAS GENÉRICAS (servicios, espacios, cursos, noticias)
   ------------------------------------------------------------------------- */
.c2-card {
	display: flex;
	flex-direction: column;
	background: var(--c2-white);
	border: 1px solid var(--c2-border-soft);
	border-radius: var(--c2-radius-lg);
	overflow: hidden;
	box-shadow: var(--c2-shadow-sm);
	transition: box-shadow .18s ease, transform .18s ease, border-color .18s ease;
	height: 100%;
}
.c2-card:hover { box-shadow: var(--c2-shadow-md); transform: translateY(-3px); border-color: var(--c2-cyan-100); }

.c2-card__media { position: relative; aspect-ratio: 16 / 10; background: var(--c2-bg-alt); overflow: hidden; }
.c2-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.c2-card:hover .c2-card__media img { transform: scale(1.04); }
.c2-card__media .c2-badge { position: absolute; top: 14px; left: 14px; }

.c2-card__body { padding: 22px 24px 24px; display: flex; flex-direction: column; flex: 1; gap: 12px; }
.c2-card__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.c2-card__body h3 { margin: 0; font-size: 1.1875rem; }
.c2-card__body h3 a { color: inherit; }
.c2-card__body h3 a:hover { color: var(--c2-cyan-600); }
.c2-card__excerpt { font-size: .9375rem; color: var(--c2-text-soft); margin: 0; flex: 1; }
.c2-card__footer { margin-top: auto; padding-top: 4px; }

/* Fila de características con icono (WiFi, pantalla, accesible…) */
/* Equipamiento de la ficha de espacio.

   Era un `flex-wrap` en el que cada elemento se dimensionaba según el ancho
   de su etiqueta: «WiFi» ocupaba 62 px y «Pantalla/Proyector» 99, así que los
   iconos caían en posiciones distintas en cada fila y el bloque medía 76, 230
   o 307 px según la ficha. Las tarjetas quedaban descuadradas entre sí y el
   contenido daba saltos.

   Con una rejilla de columnas iguales los iconos se alinean siempre y la
   altura pasa a depender solo del número de filas. */
.c2-features {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 18px 12px;
	list-style: none;
	margin: 4px 0 0;
	padding: 16px 0 0;
	border-top: 1px solid var(--c2-border-soft);
}
.c2-features li {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 7px;
	font-size: .75rem;
	color: var(--c2-text-soft);
	text-align: center;
	margin: 0;
	min-width: 62px;
}
.c2-features svg { color: var(--c2-cyan-500); }

/* Tarjeta destacada horizontal (imagen + contenido) */
.c2-feature-card {
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
	background: var(--c2-white);
	border: 1px solid var(--c2-border-soft);
	border-radius: var(--c2-radius-lg);
	overflow: hidden;
	box-shadow: var(--c2-shadow-sm);
}
.c2-feature-card__media { position: relative; min-height: 300px; background: var(--c2-bg-alt); }
.c2-feature-card__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.c2-feature-card__body { padding: 32px 34px; display: flex; flex-direction: column; gap: 14px; justify-content: center; }
.c2-feature-card__body h3 { font-size: clamp(1.375rem, 1.2rem + .6vw, 1.75rem); margin: 0; }

@media (max-width: 860px) {
	.c2-feature-card { grid-template-columns: minmax(0, 1fr); }
	.c2-feature-card__media { min-height: 220px; height: 44vw; max-height: 300px; }
	.c2-feature-card__body { padding: 26px 24px; }
}

/* -------------------------------------------------------------------------
   12. FORMULARIOS
   ------------------------------------------------------------------------- */
.c2-field { display: flex; flex-direction: column; gap: 7px; }
.c2-field > label,
.c2-label {
	font-size: .875rem;
	font-weight: 600;
	color: var(--c2-navy-800);
}
.c2-field__hint { font-size: .8125rem; color: var(--c2-text-faint); }

.c2iet input[type="text"],
.c2iet input[type="email"],
.c2iet input[type="password"],
.c2iet input[type="tel"],
.c2iet input[type="url"],
.c2iet input[type="number"],
.c2iet input[type="date"],
.c2iet input[type="time"],
.c2iet input[type="search"],
.c2iet select,
.c2iet textarea {
	/* Sin `border-box`, el `width: 100%` mide solo el contenido y los 32 px de
	   padding más el borde se suman por fuera: en móvil el formulario de
	   contacto se salía 14 px de la pantalla. `max-width: 100%` tampoco lo
	   corrige, porque también se resuelve contra la caja de contenido. */
	box-sizing: border-box;
	width: 100%;
	padding: 13px 16px;
	border: 1px solid var(--c2-border);
	border-radius: 10px;
	background: var(--c2-white);
	font-family: var(--c2-font);
	font-size: 1rem;
	color: var(--c2-navy-800);
	transition: border-color .16s ease, box-shadow .16s ease;
	max-width: 100%;
}
.c2iet input:focus,
.c2iet select:focus,
.c2iet textarea:focus {
	border-color: var(--c2-cyan-500);
	box-shadow: 0 0 0 3px var(--c2-cyan-050);
	outline: none;
}
.c2iet textarea { min-height: 140px; resize: vertical; }
.c2iet select {
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1l6 6 6-6' fill='none' stroke='%235F6C82' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 16px center;
	padding-right: 44px;
}

.c2-check { display: flex; align-items: flex-start; gap: 11px; font-size: .9375rem; color: var(--c2-text); }
.c2-check input[type="checkbox"] {
	width: 20px; height: 20px; flex: none; margin-top: 2px;
	accent-color: var(--c2-cyan-500); cursor: pointer;
}
.c2-check a { text-decoration: underline; }

/* Casillas de verificación: 24x24 px, el mínimo de WCAG 2.5.8. La de
   consentimiento de privacidad es obligatoria para enviar los formularios,
   así que fallarla bloquea la tarea entera en móvil. La de registro venía
   sin estilar (13x13, el tamaño por defecto del navegador). */
.c2-check input[type="checkbox"],
.c2-form__check input[type="checkbox"] {
	width: 24px;
	height: 24px;
	flex: none;
	margin-top: 0;
	accent-color: var(--c2-cyan-500);
	cursor: pointer;
}

/* Barra de filtros horizontal */
.c2-filterbar {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	gap: 18px;
	background: var(--c2-white);
	border: 1px solid var(--c2-border-soft);
	border-radius: var(--c2-radius-lg);
	padding: 20px 24px;
	box-shadow: var(--c2-shadow-sm);
}
.c2-filterbar .c2-field { flex: 1 1 190px; min-width: 0; }
.c2-filterbar .c2-btn { flex: none; }

/* Mensajes de formulario / avisos */
.c2-notice {
	display: flex;
	gap: 13px;
	padding: 15px 18px;
	border-radius: var(--c2-radius);
	font-size: .9375rem;
	border: 1px solid transparent;
	margin-bottom: 20px;
}
.c2-notice svg { flex: none; margin-top: 2px; }
.c2-notice--info { background: var(--c2-cyan-050); border-color: var(--c2-cyan-100); color: #075A73; }
.c2-checkout-reserva-note { margin: 12px 0 0; font-size: 14px; line-height: 1.5; color: #5F6C82; }
body.woocommerce-checkout #payment .c2-checkout-reserva-note {
	clear: both;
	position: static;
	margin: 12px 0 0;
}
.c2-notice--ok { background: var(--c2-green-100); border-color: #BFE8CD; color: var(--c2-green-700); }
.c2-notice--warn { background: var(--c2-amber-100); border-color: #F5DFA8; color: var(--c2-amber-700); }
.c2-notice--error { background: var(--c2-red-100); border-color: #F3C6C4; color: var(--c2-red-700); }
.c2-notice p { margin: 0; }
.c2-notice ul { margin: 6px 0 0; padding-left: 20px; }

/* -------------------------------------------------------------------------
   13. FOOTER
   ------------------------------------------------------------------------- */
.c2-footer { background: var(--c2-navy-900); color: #B9C6DA; font-size: .9375rem; }
.c2-footer a { color: #DCE4F0; }
.c2-footer a:hover { color: var(--c2-cyan-400); }

.c2-footer__main { padding: 60px 0 44px; }
.c2-footer__grid {
	display: grid;
	grid-template-columns: 1.5fr 1fr 1fr 1.2fr;
	gap: 40px;
}
.c2-footer__logo {
	font-size: 2rem;
	font-weight: 800;
	color: #fff;
	letter-spacing: -.045em;
	display: inline-block;
	margin-bottom: 16px;
	line-height: 1;
}
.c2-footer h2, .c2-footer h3 {
	color: #fff;
	font-size: .8125rem;
	text-transform: uppercase;
	letter-spacing: .1em;
	margin: 0 0 18px;
	font-weight: 700;
}
.c2-footer ul { list-style: none; margin: 0; padding: 0; }
.c2-footer li { margin: 0 0 11px; }
.c2-footer__about p { color: #A3B3C8; max-width: 40ch; }

.c2-footer__contact li { display: flex; gap: 11px; align-items: flex-start; color: #B9C6DA; }
.c2-footer__contact svg { flex: none; margin-top: 4px; color: var(--c2-cyan-400); }

/* Franja de financiación */
.c2-footer__funding {
	border-top: 1px solid rgba(255, 255, 255, .1);
	border-bottom: 1px solid rgba(255, 255, 255, .1);
	padding: 26px 0;
}
.c2-footer__funding .c2-container {
	display: flex;
	align-items: center;
	gap: 26px;
	flex-wrap: wrap;
}
.c2-footer__funding img { flex: none; }
.c2-footer__eu-flag { width: 56px; height: 38px; flex: none; border-radius: 2px; }
.c2-footer__funding p { font-size: .8125rem; color: #A3B3C8; margin: 0; max-width: 78ch; }

.c2-footer__bottom { padding: 22px 0; }
.c2-footer__bottom .c2-container {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 18px;
	flex-wrap: wrap;
	font-size: .8125rem;
	color: #A3B3C8;
}
.c2-footer__legal { display: flex; flex-wrap: wrap; gap: 8px 22px; list-style: none; margin: 0; padding: 0; }
.c2-footer__legal a { color: #A3B3C8; }
.c2-footer__legal a:hover { color: var(--c2-cyan-400); }
.c2-footer__legal li { margin: 0; }

@media (max-width: 1024px) {
	.c2-footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 34px; }
}
@media (max-width: 600px) {
	.c2-footer__grid { grid-template-columns: minmax(0, 1fr); }
	.c2-footer__main { padding: 44px 0 32px; }
}

/* -------------------------------------------------------------------------
   14. CONTENIDO EDITORIAL
   ------------------------------------------------------------------------- */
.c2-prose { font-size: 1.0625rem; color: var(--c2-text); }
.c2-prose > * + * { margin-top: 1.1em; }
.c2-prose h2 { margin-top: 1.9em; }
.c2-prose h3 { margin-top: 1.6em; }
.c2-prose ul, .c2-prose ol { padding-left: 24px; }
.c2-prose li { margin-bottom: .5em; }
.c2-prose a { text-decoration: underline; }
.c2-prose blockquote {
	border-left: 4px solid var(--c2-cyan-500);
	padding: 4px 0 4px 22px;
	margin-left: 0;
	color: var(--c2-navy-700);
	font-size: 1.125rem;
}
.c2-prose img { border-radius: var(--c2-radius); }
.c2-prose table { width: 100%; border-collapse: collapse; }
.c2-prose th, .c2-prose td { padding: 12px 14px; border-bottom: 1px solid var(--c2-border); text-align: left; }
.c2-prose th { background: var(--c2-bg); font-weight: 700; color: var(--c2-navy-800); }

/* Layout de página interior con barra lateral */
.c2-layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 380px;
	gap: 44px;
	align-items: start;
}

/* Los ítems de una rejilla tienen `min-width: auto` por defecto, así que no
   se encogen por debajo del ancho mínimo de su contenido: una tarjeta con
   imagen o la tabla del calendario ensanchaban su columna y se salían del
   contenedor. A 320 px (el ancho que exige WCAG 1.4.10) el desbordamiento no
   producía scroll —lo recortaba un `overflow` de más arriba—, que es peor:
   se perdía contenido. */
.c2-layout__main,
.c2-layout__aside {
	min-width: 0;
}
.c2-layout--narrow { grid-template-columns: minmax(0, 1fr) 320px; }
@media (max-width: 1000px) {
	.c2-layout, .c2-layout--narrow { grid-template-columns: minmax(0, 1fr); gap: 32px; }
}

.c2-panel {
	background: var(--c2-white);
	border: 1px solid var(--c2-border-soft);
	border-radius: var(--c2-radius-lg);
	padding: 28px;
	box-shadow: var(--c2-shadow);
}
.c2-panel--sticky { position: sticky; top: 108px; }
.c2-panel h2 { font-size: 1.5rem; margin: 0 0 22px; }
.c2-panel h3 { font-size: 1.0625rem; margin: 0 0 14px; }

/* Lista de datos clave (ficha de espacio/curso) */
.c2-datalist { list-style: none; margin: 0; padding: 0; }
.c2-datalist li {
	display: flex;
	justify-content: space-between;
	gap: 18px;
	padding: 13px 0;
	border-bottom: 1px solid var(--c2-border-soft);
	font-size: .9375rem;
}
.c2-datalist li:last-child { border-bottom: 0; }
.c2-datalist dt, .c2-datalist__key { color: var(--c2-text-soft); }
.c2-datalist dd, .c2-datalist__val { margin: 0; font-weight: 600; color: var(--c2-navy-800); text-align: right; }

.c2-single__links {
	display: flex;
	flex-wrap: wrap;
	gap: 18px 28px;
	margin-top: 28px;
	padding-top: 22px;
	border-top: 1px solid var(--c2-border-soft);
}

.c2iet-space-tariffs {
	margin-top: 24px;
	padding-top: 22px;
	border-top: 1px solid var(--c2-border-soft);
}
.c2iet-space-tariffs h3 {
	margin: 0 0 12px;
	font-size: 1.0625rem;
}
.c2iet-space-tariffs ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
.c2iet-space-tariffs li {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 12px 0;
	border-bottom: 1px solid var(--c2-border-soft);
}
.c2iet-space-tariffs li:last-child { border-bottom: 0; }
.c2iet-space-tariffs li > div {
	display: grid;
	gap: 3px;
	min-width: 0;
}
.c2iet-space-tariffs strong {
	color: var(--c2-navy-800);
	font-size: .875rem;
	line-height: 1.25;
}
.c2iet-space-tariffs li > div > span {
	color: var(--c2-text-soft);
	font-size: .8125rem;
}
.c2iet-space-tariffs .c2-btn { flex: none; }

.c2-public-availability-form {
	display: grid;
	gap: 8px;
	margin-bottom: 18px;
}
.c2-public-availability-form label {
	color: var(--c2-text-soft);
	font-size: .8125rem;
	font-weight: 700;
}
.c2-public-availability-form > div {
	display: flex;
	align-items: center;
	gap: 8px;
}
.c2-public-availability-form input[type="date"] {
	min-width: 0;
	flex: 1;
	height: 42px;
	padding: 7px 9px;
	border: 1px solid var(--c2-border);
	border-radius: 8px;
	color: var(--c2-navy-800);
	background: var(--c2-white);
}
.c2-public-availability {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 12px;
	margin: 0 0 20px;
	padding: 10px 12px;
	border-radius: 8px;
	font-size: .8125rem;
}
.c2-public-availability span,
.c2-public-availability small {
	color: inherit;
}
.c2-public-availability--available {
	background: #e7f7f1;
	color: #176149;
}
.c2-public-availability--occupied {
	background: #fff1e8;
	color: #8a3f16;
}
.c2-public-availability--pending {
	background: #fff8e2;
	color: #725719;
}

/* Indicador de pasos (1 Solicitud → 2 Validación → 3 Confirmación) */
.c2-steps { display: flex; align-items: center; gap: 8px; margin-bottom: 26px; }
.c2-step { display: flex; flex-direction: column; align-items: center; gap: 8px; flex: 1; }
.c2-step__num {
	width: 38px; height: 38px;
	border-radius: 50%;
	display: flex; align-items: center; justify-content: center;
	font-weight: 700; font-size: .9375rem;
	background: var(--c2-bg-alt); color: var(--c2-text-faint);
	border: 1px solid var(--c2-border);
}
.c2-step__label { font-size: .8125rem; color: var(--c2-text-faint); text-align: center; }
.c2-step.is-active .c2-step__num { background: var(--c2-cyan-500); color: #fff; border-color: var(--c2-cyan-500); }
.c2-step.is-active .c2-step__label { color: var(--c2-cyan-600); font-weight: 600; }
.c2-steps__sep { color: var(--c2-border); flex: none; margin-bottom: 22px; }

/* -------------------------------------------------------------------------
   15. LISTADOS Y PAGINACIÓN
   ------------------------------------------------------------------------- */
.c2-results-count { font-size: .9375rem; color: var(--c2-text-soft); margin-bottom: 22px; }

.c2-pagination { display: flex; justify-content: center; gap: 8px; margin-top: 44px; flex-wrap: wrap; }
.c2-pagination .page-numbers {
	display: inline-flex; align-items: center; justify-content: center;
	min-width: 44px; height: 44px; padding: 0 12px;
	border-radius: 10px;
	border: 1px solid var(--c2-border);
	background: var(--c2-white);
	color: var(--c2-navy-800);
	font-weight: 600;
}
.c2-pagination .page-numbers:hover { border-color: var(--c2-cyan-500); color: var(--c2-cyan-600); }
.c2-pagination .page-numbers.current {
	background: var(--c2-cyan-500); border-color: var(--c2-cyan-500); color: #fff;
}
.c2-pagination .dots { border-color: transparent; background: transparent; }

/* Estado vacío */
.c2-empty {
	text-align: center;
	padding: 62px 24px;
	background: var(--c2-bg);
	border: 1px dashed var(--c2-border);
	border-radius: var(--c2-radius-lg);
}
.c2-empty h3 { margin-bottom: 8px; }
.c2-empty p { color: var(--c2-text-soft); margin: 0 auto 20px; max-width: 46ch; }

/* -------------------------------------------------------------------------
   16. ÁREA PERSONAL — resumen del panel (layout en bloque consolidado §formularios)
   ------------------------------------------------------------------------- */

/* Tira de resumen (próximo evento / reserva / curso) */
.c2-summary {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	background: var(--c2-white);
	border: 1px solid var(--c2-border-soft);
	border-radius: var(--c2-radius-lg);
	box-shadow: var(--c2-shadow-sm);
	overflow: hidden;
	margin-bottom: 38px;
}
.c2-summary__item { display: flex; gap: 18px; padding: 24px 26px; align-items: center; }
.c2-summary__item + .c2-summary__item { border-left: 1px solid var(--c2-border-soft); }
.c2-summary__icon {
	width: 56px; height: 56px; border-radius: 50%; flex: none;
	display: flex; align-items: center; justify-content: center;
	border: 1.5px solid currentColor;
}
.c2-summary__icon--cyan { color: var(--c2-cyan-500); }
.c2-summary__icon--amber { color: #E0A200; }
.c2-summary__icon--green { color: var(--c2-green-700); }
.c2-summary__label { font-size: .875rem; font-weight: 600; margin-bottom: 3px; }
.c2-summary__label--cyan { color: var(--c2-cyan-600); }
.c2-summary__label--amber { color: #B57F00; }
.c2-summary__label--green { color: var(--c2-green-700); }
.c2-summary__title { font-weight: 700; color: var(--c2-navy-800); font-size: 1.0625rem; margin-bottom: 3px; }
.c2-summary__meta { font-size: .875rem; color: var(--c2-text-soft); }

@media (max-width: 1000px) {
	.c2-summary { grid-template-columns: minmax(0, 1fr); }
	.c2-summary__item + .c2-summary__item { border-left: 0; border-top: 1px solid var(--c2-border-soft); }
}

/* Barra de progreso de curso */
.c2-progress { display: flex; align-items: center; gap: 16px; }
.c2-progress__track { flex: 1; height: 9px; background: var(--c2-bg-alt); border-radius: var(--c2-radius-pill); overflow: hidden; }
.c2-progress__bar { height: 100%; background: var(--c2-green-700); border-radius: var(--c2-radius-pill); }
.c2-progress__value { font-weight: 700; color: var(--c2-navy-800); flex: none; }

/* Tabla de datos (reservas, inscripciones) */
.c2-table-wrap {
	background: var(--c2-white);
	border: 1px solid var(--c2-border-soft);
	border-radius: var(--c2-radius-lg);
	box-shadow: var(--c2-shadow-sm);
	overflow-x: auto;
}
.c2-table { width: 100%; border-collapse: collapse; font-size: .9375rem; min-width: 620px; }
.c2-table th {
	text-align: left;
	padding: 17px 22px;
	font-size: .875rem;
	font-weight: 700;
	color: var(--c2-navy-800);
	border-bottom: 1px solid var(--c2-border-soft);
	white-space: nowrap;
}
.c2-table td { padding: 17px 22px; border-bottom: 1px solid var(--c2-border-soft); color: var(--c2-text); vertical-align: middle; }
.c2-table tr:last-child td { border-bottom: 0; }
.c2-table tbody tr:hover { background: var(--c2-bg); }
.c2-table__title { display: flex; align-items: center; gap: 13px; font-weight: 600; color: var(--c2-navy-800); }
.c2-table__icon {
	width: 38px; height: 38px; border-radius: 10px; flex: none;
	display: flex; align-items: center; justify-content: center;
	background: var(--c2-cyan-050); color: var(--c2-cyan-600);
}

/* -------------------------------------------------------------------------
   17. BLOQUES INSTITUCIONALES
   ------------------------------------------------------------------------- */
.c2-cta-band {
	background: var(--c2-navy-900);
	color: #fff;
	border-radius: var(--c2-radius-lg);
	margin-top: 2rem;
	padding: 44px 48px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 34px;
	flex-wrap: wrap;
	position: relative;
	overflow: hidden;
}
.c2-cta-band h2 { color: #fff; margin: 0 0 10px; }
.c2-cta-band p { color: #fff; margin: 0; max-width: 56ch; }
.c2-cta-band__body { flex: 1 1 400px; position: relative; z-index: 1; }
.c2-cta-band__actions { display: flex; gap: 14px; flex-wrap: wrap; position: relative; z-index: 1; }
.c2-cta-band .c2-btn--outline { background: transparent; color: #fff; border-color: rgba(255,255,255,.35); }
.c2-cta-band .c2-btn--outline:hover { background: rgba(255,255,255,.1); border-color: #fff; color: #fff; }

/* Puente WordPress → aula virtual (interface de Formación) */
.c2-bridge {
	display: flex;
	align-items: center;
	gap: 30px;
	background: var(--c2-cyan-050);
	border: 1px solid var(--c2-cyan-100);
	border-radius: var(--c2-radius-lg);
	padding: 32px 38px;
	flex-wrap: wrap;
}
.c2-bridge__side { display: flex; align-items: center; gap: 20px; flex: 1 1 320px; }
.c2-bridge__icon {
	width: 78px; height: 78px; border-radius: 50%; flex: none;
	display: flex; align-items: center; justify-content: center;
	border: 1.5px solid var(--c2-cyan-500); color: var(--c2-cyan-600);
	background: var(--c2-white);
}
.c2-bridge__icon--green { border-color: var(--c2-green-700); color: var(--c2-green-700); }
.c2-bridge p { margin: 0 0 4px; color: var(--c2-navy-800); font-size: 1.0625rem; }
.c2-bridge__arrow { flex: none; color: var(--c2-cyan-500); }
@media (max-width: 820px) { .c2-bridge__arrow { display: none; } }

/* -------------------------------------------------------------------------
   18. CALENDARIO
   ------------------------------------------------------------------------- */
.c2-calendar { background: var(--c2-white); border: 1px solid var(--c2-border-soft); border-radius: var(--c2-radius); padding: 20px; }
.c2-calendar__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }
.c2-calendar__title { font-weight: 700; color: var(--c2-navy-800); font-size: 1.0625rem; }
.c2-calendar__nav {
	width: 34px; height: 34px; border-radius: 8px; border: 1px solid transparent;
	background: transparent; cursor: pointer; color: var(--c2-navy-800);
	display: inline-flex; align-items: center; justify-content: center;
}
.c2-calendar__nav:hover { background: var(--c2-cyan-050); color: var(--c2-cyan-600); }
.c2-calendar table { width: 100%; border-collapse: collapse; }
.c2-calendar th {
	font-size: .8125rem; font-weight: 600; color: var(--c2-text-faint);
	padding: 8px 0; text-align: center;
}
.c2-calendar td { text-align: center; padding: 3px; }
/* Celdas fluidas: con 34 px fijos, siete columnas más el padding del panel
   no caben en pantallas de 320 px y la tabla se salía. `aspect-ratio`
   mantiene el círculo, y el mínimo de 30 px sigue por encima del objetivo
   táctil de 24 px que pide WCAG 2.5.8. */
.c2-calendar td span, .c2-calendar td a {
	display: inline-flex; align-items: center; justify-content: center;
	width: 100%; max-width: 34px; min-width: 30px;
	aspect-ratio: 1; border-radius: 50%;
	font-size: .9375rem; color: var(--c2-navy-800);
}
@media (max-width: 360px) {
	.c2-calendar { padding: 14px; }
	.c2-calendar td { padding: 2px; }
	.c2-calendar td span, .c2-calendar td a { min-width: 26px; }
}
.c2-calendar td a:hover { background: var(--c2-cyan-050); color: var(--c2-cyan-600); }
.c2-calendar .is-muted span { color: var(--c2-text-faint); opacity: .55; }
.c2-calendar .is-today span, .c2-calendar .is-today a { border: 1px solid var(--c2-cyan-500); }
.c2-calendar .is-selected span, .c2-calendar .is-selected a { background: var(--c2-cyan-500); color: #fff; font-weight: 600; }

.c2-legend { display: flex; flex-wrap: wrap; gap: 8px 20px; margin-top: 16px; font-size: .8125rem; color: var(--c2-text-soft); list-style: none; padding: 0; }
.c2-legend li { display: flex; align-items: center; gap: 7px; margin: 0; }
.c2-legend span { width: 9px; height: 9px; border-radius: 50%; flex: none; }

/* -------------------------------------------------------------------------
   19. UTILIDADES
   ------------------------------------------------------------------------- */
.c2-mt-0 { margin-top: 0 !important; }
.c2-mb-0 { margin-bottom: 0 !important; }
.c2-mb-1 { margin-bottom: 12px !important; }
.c2-mb-2 { margin-bottom: 24px !important; }
.c2-mb-3 { margin-bottom: 36px !important; }
.c2-mt-2 { margin-top: 24px !important; }
.c2-mt-3 { margin-top: 36px !important; }
.c2-text-center { text-align: center; }
.c2-flex { display: flex; }
.c2-flex-between { display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap; }
.c2-gap-1 { gap: 12px; }
.c2-gap-2 { gap: 24px; }
.c2-lead { font-size: 1.125rem; color: var(--c2-text); }
.c2-small { font-size: .875rem; }
.c2-muted { color: var(--c2-text-soft); }

/* Respeta la preferencia de movimiento reducido — WCAG 2.3.3 */
@media (prefers-reduced-motion: reduce) {
	.c2iet *, .c2iet *::before, .c2iet *::after {
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .01ms !important;
		scroll-behavior: auto !important;
	}
}

/* Impresión */
@media print {
	.c2-topbar, .c2-header, .c2-footer, .c2-mobile-nav, .c2-search-panel, .c2-btn { display: none !important; }
	.c2iet { background: #fff; }
}

/* -------------------------------------------------------------------------
   20. GRÁFICO DE RESPALDO DEL HERO Y TARJETAS SIN IMAGEN
   ------------------------------------------------------------------------- */
.c2-hero-graphic { position: absolute; inset: 0; }
.c2-hero-graphic svg { width: 100%; height: 100%; display: block; }

.c2-card__placeholder {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	background: linear-gradient(135deg, var(--c2-navy-800) 0%, var(--c2-cyan-600) 100%);
}
.c2-card__placeholder span {
	font-size: 3rem;
	font-weight: 800;
	color: rgba(255, 255, 255, .55);
	letter-spacing: -.04em;
}

/* Las tarjetas de evento de la portada van envueltas en un enlace: se
   neutraliza el estilo de enlace para que la tarjeta mande. */
.c2-card-link { display: block; color: inherit; height: 100%; }
.c2-card-link:hover { color: inherit; }

/* -------------------------------------------------------------------------
   21. LAYOUTS DE PÁGINA (shortcodes + plantillas)
   🔶 pendiente de interface real — tokens actuales de :root
   ------------------------------------------------------------------------- */
.c2-main { display: block; min-height: 40vh; padding-bottom: 80px; }
.c2-main--home { padding-bottom: 0; }
.c2-filters { margin-bottom: 28px; }
.c2-filters__chips { margin: -8px 0 28px; }
.c2-field-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 14px;
}
@media (max-width: 560px) {
	.c2-field-row { grid-template-columns: minmax(0, 1fr); }
}
.c2-field--grow { flex: 2 1 280px; }

.c2-booking { width: 100%; }
.c2-booking__step { display: grid; gap: 14px; }
.c2-booking__step[hidden] { display: none !important; }
.c2-booking__nav {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	justify-content: space-between;
	margin-top: 8px;
}

.c2-espacios-layout,
.c2-agenda-layout,
.c2-formacion-layout,
.c2-contact {
	padding: var(--c2-section-y) 0;
}

.c2-agenda-layout__views { display: flex; gap: 8px; flex-wrap: wrap; align-items: flex-end; }
.c2-agenda-layout__featured { margin-bottom: 28px; }
.c2-agenda-layout__calendar-shell { margin-bottom: 28px; }

.c2-formacion-layout__intro { margin-bottom: 28px; max-width: 52rem; }
.c2-formacion-layout__ctas { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 18px; }
.c2-formacion-layout__featured { margin-bottom: 32px; }

.c2-contact__title { margin-bottom: 22px; }
.c2-contact__form { display: grid; gap: 16px; max-width: 40rem; }
.c2-contact__data { list-style: none; margin: 0 0 16px; padding: 0; }
.c2-contact__data li {
	display: flex;
	gap: 12px;
	align-items: flex-start;
	margin: 0 0 14px;
	color: var(--c2-text);
	font-size: .9375rem;
}
.c2-contact__data svg { flex: none; margin-top: 2px; color: var(--c2-cyan-500); }

.c2-single { padding-bottom: var(--c2-section-y); }
.c2-single__header { padding: 12px 0 28px; }
.c2-single__header .c2-status,
.c2-single__header .c2-quicklink__icon { margin-bottom: 14px; display: inline-flex; }
.c2-single__media {
	margin: 0 0 32px;
	border-radius: var(--c2-radius-lg);
	overflow: hidden;
}
.c2-single__media img { display: block; width: 100%; height: auto; }
.c2-single__block { margin-top: 36px; }
.c2-single__content { max-width: 52rem; }

/* Ficha de evento: abre con la banda de cabecera a ancho completo (las migas
   y el titular van dentro de ella), así que el cuerpo necesita su propio aire
   por arriba —en espacios y cursos ese aire lo daban las migas. */
.c2-single--evento { padding-top: var(--c2-section-y-tight); }
.c2-single--evento .c2-single__header { padding-top: 0; }
.c2-single--evento .c2-panel .c2-btn + .c2-btn,
.c2-single--evento .c2-panel form + .c2-btn { margin-top: 12px; }
.c2-single--evento .c2-panel .c2-datalist { margin-bottom: 22px; }

/* La dirección postal acompaña al nombre del recinto en la misma celda: se
   pinta debajo, en el tono secundario, para no competir con él. */
.c2-datalist__note {
	display: block;
	margin-top: 3px;
	color: var(--c2-text-soft);
	font-weight: 400;
	font-size: .875rem;
	line-height: 1.45;
}

/* Ficha de noticia: chrome, contenido y widgets comparten el contenedor. */
.c2-single__chrome { padding: 32px 0 20px; }
.c2-single__chrome .c2-breadcrumbs { margin-bottom: 0; }
.c2-single__chrome .c2-notice { margin-bottom: 0; }
.c2-layout--post {
	grid-template-columns: minmax(0, 1fr) minmax(260px, 320px);
	gap: 40px;
}
.c2-single--post .c2-single__header { padding: 0 0 28px; }
.c2-single--post .c2-single__content { max-width: none; }
.c2-single__pagination {
	margin-top: 36px;
	padding-top: 24px;
	border-top: 1px solid var(--c2-design-line);
}
.c2-single__pagination a {
	color: var(--c2-design-teal-dark);
	font-weight: 600;
}

.c2-blog-sidebar {
	align-self: start;
	min-width: 0;
	position: sticky;
	top: 100px;
	display: grid;
	gap: 24px;
}
.c2-blog-sidebar .widget {
	margin: 0;
	padding: 24px;
	background: var(--c2-white);
	border: 1px solid var(--c2-design-line);
	border-radius: var(--c2-radius-lg);
	box-shadow: 0 3px 14px rgba(23, 32, 82, .07);
}
.c2-blog-sidebar .widget-title {
	margin: 0 0 16px;
	color: var(--c2-design-ink);
	font-size: 1.125rem;
	line-height: 1.25;
}
.c2-blog-sidebar .widget ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
.c2-blog-sidebar .widget li {
	margin: 0;
	padding: 11px 0;
	border-bottom: 1px solid var(--c2-design-line);
	line-height: 1.4;
}
.c2-blog-sidebar .widget li:first-child { padding-top: 0; }
.c2-blog-sidebar .widget li:last-child {
	padding-bottom: 0;
	border-bottom: 0;
}
/* `:not(.c2-btn)` para no pisar el color propio de los botones: sin esa
   exclusión, «Contacta con el centro» heredaba el azul tinta de los enlaces
   sobre su fondo teal y quedaba en 1,65:1, muy por debajo del 4,5:1 de AA. */
.c2-blog-sidebar .widget a:not(.c2-btn) {
	color: var(--c2-design-ink);
	font-weight: 600;
}
.c2-blog-sidebar .widget a:not(.c2-btn):hover { color: var(--c2-design-teal-dark); }
/* Movedo aplica `opacity: .5` a `.post-date`, y la opacidad se mezcla con el
   fondo: el #53627b que fijamos aquí acababa renderizándose como #a9b1bd,
   2,16:1 sobre blanco. El color se ve bien en el inspector pero falla en la
   práctica, que es lo que mide axe. Se anula la opacidad y se deja el color
   sólido, que da 5,6:1. */
.c2-blog-sidebar .widget.widget_recent_entries li span.post-date,
.c2-blog-sidebar .widget .post-date {
	display: block;
	margin-top: 4px;
	opacity: 1;
	color: var(--c2-design-muted);
	font-size: .8125rem;
	font-weight: 400;
}
.c2-blog-sidebar .widget_categories li {
	display: flex;
	justify-content: space-between;
	gap: 14px;
}
.c2-blog-sidebar .widget_categories li a { min-width: 0; }
.c2-blog-sidebar .widget_categories .count {
	flex: none;
	color: var(--c2-design-muted);
	font-size: .875rem;
}
.c2-blog-sidebar .widget_custom_html {
	background: var(--c2-design-lilac);
	border-color: var(--c2-cyan-100);
}
.c2-blog-sidebar .widget_custom_html p {
	color: var(--c2-design-muted);
	font-size: .9375rem;
}
.c2-blog-sidebar .widget_custom_html .c2-btn {
	width: 100%;
	justify-content: center;
	margin-top: 6px;
}

@media (max-width: 1000px) {
	.c2-layout--post { grid-template-columns: minmax(0, 1fr); }
	.c2-blog-sidebar { position: static; }
}

@media (max-width: 600px) {
	.c2-single__chrome { padding-top: 24px; padding-bottom: 16px; }
	.c2-single--post .c2-single__header { padding-bottom: 22px; }
	.c2-blog-sidebar .widget { padding: 20px; }
}

.c2-empty--large {
	text-align: center;
	padding: 48px 20px 24px;
}
.c2-empty__code {
	font-size: clamp(3.5rem, 2rem + 6vw, 6rem);
	font-weight: 800;
	line-height: 1;
	color: var(--c2-cyan-500);
	margin: 0 0 8px;
	letter-spacing: -.04em;
}
.c2-empty__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	justify-content: center;
	margin-top: 8px;
}

.c2-page--aux { padding-bottom: var(--c2-section-y); }
.c2-page--aux .c2-searchform { margin-bottom: 28px; max-width: 36rem; }

/* -------------------------------------------------------------------------
   22. ÁREA PERSONAL / AUTH / FORMULARIOS
   ------------------------------------------------------------------------- */
.c2-auth { max-width: 520px; padding: 40px 0 72px; }
.grve-section:not(.grve-fullwidth) > .grve-container .c2-auth.c2-container {
	max-width: 520px;
	margin-left: auto;
	margin-right: auto;
}
.c2-auth h1 { margin-bottom: 8px; }
.c2-auth__lead { color: var(--c2-text-soft); margin-bottom: 28px; }
.c2-auth__links { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 20px; }
.c2-auth__links a { color: var(--c2-cyan-500); font-weight: 600; }
.c2-auth__verification {
	margin-top: 32px;
	padding-top: 24px;
	border-top: 1px solid var(--c2-border);
}
.c2iet .c2-auth__verification h2 {
	margin: 0 0 8px;
	font-size: 1.25rem;
	line-height: 1.35;
	letter-spacing: 0;
}
.c2-auth .c2-form__actions .c2-btn {
	justify-content: center;
}

.c2-form label { display: block; font-weight: 600; color: var(--c2-navy-800); margin-bottom: 6px; }
.c2-form input[type="text"],
.c2-form input[type="email"],
.c2-form input[type="password"],
.c2-form input[type="date"],
.c2-form input[type="number"],
.c2-form input[type="search"],
.c2-form input[type="tel"],
.c2-form select,
.c2-form textarea {
	width: 100%;
	border: 1px solid var(--c2-border);
	border-radius: 8px;
	padding: 12px 14px;
	font: inherit;
	background: var(--c2-white);
	color: var(--c2-navy-800);
}
.c2-form textarea { min-height: 140px; resize: vertical; }
.c2-form__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.c2-form__actions { margin-top: 8px; }
.c2-form__check { font-size: .95rem; }
.c2-form__check label { font-weight: 500; display: flex; gap: 10px; align-items: flex-start; }
.c2-form__hint { color: var(--c2-text-soft); font-size: .9rem; }
.c2-field__error { display: block; margin-top: 6px; color: #9b1c1c; font-size: .9rem; }
.c2-password { position: relative; display: block; }
.c2-password input { padding-right: 44px; }
.c2-password__toggle {
	position: absolute;
	top: 50%;
	right: 4px;
	transform: translateY(-50%);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	z-index: 3;
	width: 36px;
	height: 36px;
	padding: 0;
	border: 0;
	background: transparent;
	color: var(--c2-navy-800);
	cursor: pointer;
}
.c2-password__eye-off { display: none; }
.c2-password__toggle[aria-pressed="true"] .c2-password__eye { display: none; }
.c2-password__toggle[aria-pressed="true"] .c2-password__eye-off { display: inline-flex; }

.c2-account {
	display: grid;
	grid-template-columns: minmax(220px, 260px) minmax(0, 1fr);
	gap: clamp(20px, 3vw, 36px);
	padding: clamp(16px, 2.5vw, 28px) var(--c2-gutter) clamp(40px, 6vw, 72px);
	max-width: var(--c2-container);
	margin: 0 auto;
	box-sizing: border-box;
}
.c2-account__nav {
	background: var(--c2-bg);
	border-radius: var(--c2-radius);
	padding: 20px 14px;
	height: fit-content;
	position: sticky;
	top: calc(var(--c2-header-offset, 88px) + 12px);
}
.c2-account__nav-label {
	font-size: .75rem;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--c2-text-faint);
	margin: 0 10px 12px;
	font-weight: 700;
}
.c2-account__nav-list,
.c2-account__nav ul { list-style: none; margin: 0; padding: 0; }
.c2-account__nav-list li + li,
.c2-account__nav li + li { margin-top: 2px; }
.c2-account__nav-panel > summary { list-style: none; }
.c2-account__nav-panel > summary::-webkit-details-marker { display: none; }
.c2-account__nav-toggle {
	display: none;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	width: 100%;
	padding: 12px 14px;
	border: 1px solid var(--c2-border-soft);
	border-radius: var(--c2-radius);
	background: var(--c2-bg);
	color: var(--c2-navy-800);
	font-weight: 600;
	font-size: .9375rem;
	line-height: 1.3;
	cursor: pointer;
	box-sizing: border-box;
}
.c2-account__nav-toggle-label {
	display: flex;
	align-items: center;
	gap: 10px;
	min-width: 0;
}
.c2-account__nav-toggle-label span { min-width: 0; }
.c2-account__nav-toggle-icon {
	display: flex;
	flex: none;
	color: var(--c2-text-soft);
	transition: transform .2s ease;
}
.c2-account__nav-panel[open] .c2-account__nav-toggle-icon { transform: rotate(180deg); }
.c2-account__nav-panel[open] .c2-account__nav-toggle {
	border-color: var(--c2-cyan-500);
	box-shadow: 0 0 0 1px var(--c2-cyan-500);
}
.c2-account__nav-toggle:focus-visible {
	outline: 3px solid var(--c2-link);
	outline-offset: 2px;
}
.c2-account__nav a {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 10px 12px;
	border-radius: 8px;
	color: var(--c2-navy-800);
	font-weight: 600;
	text-decoration: none;
	font-size: .9375rem;
	line-height: 1.3;
}
.c2-account__nav a span { min-width: 0; }
.c2-account__nav a.is-active,
.c2-account__nav a:hover {
	background: var(--c2-cyan-500);
	color: #fff;
}
.c2-account__nav a.is-active svg,
.c2-account__nav a:hover svg { stroke: #fff; }
.c2-account__nav-logout {
	margin-top: 8px;
	padding-top: 8px;
	border-top: 1px solid var(--c2-border-soft);
}
.c2-account__main {
	min-width: 0;
	padding-top: 4px;
}
.c2-account__welcome { color: var(--c2-text-soft); margin-bottom: 28px; }
.c2-account-summary { margin-bottom: 36px; }
.c2-summary-card {
	background: var(--c2-white);
	border: 1px solid var(--c2-border);
	border-radius: var(--c2-radius);
	padding: 20px;
}
.c2-summary-card__label { font-size: .85rem; color: var(--c2-text-soft); margin: 8px 0 4px; }
.c2-summary-card__title { font-weight: 700; color: var(--c2-navy-800); margin: 0; }
.c2-summary-card--event .c2-summary-card__icon { color: var(--c2-cyan-500); }
.c2-summary-card--booking .c2-summary-card__icon { color: var(--c2-amber-700); }
.c2-summary-card--course .c2-summary-card__icon { color: var(--c2-green-700); }
.c2-account-block { margin-top: 12px; }
.c2-table { width: 100%; border-collapse: collapse; }
.c2-table th, .c2-table td {
	text-align: left;
	padding: 14px 12px;
	border-bottom: 1px solid var(--c2-border);
	vertical-align: middle;
}
.c2-table th { font-size: .8rem; letter-spacing: .01em; color: var(--c2-text-soft); text-transform: none; }
.c2-order-cards { display: none; list-style: none; margin: 0; padding: 0; }
.c2-order-card {
	border: 1px solid var(--c2-border);
	border-radius: var(--c2-radius);
	padding: 16px;
	background: var(--c2-white);
}
.c2-order-card + .c2-order-card { margin-top: 12px; }
.c2-order-card__concept { margin: 0 0 6px; font-weight: 700; color: var(--c2-navy-800); }
.c2-order-card__meta,
.c2-order-card__total { margin: 0 0 8px; }
.c2-order-card__actions,
.c2-account-list__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px;
}
.c2-summary-card__pending { list-style: none; margin: 12px 0; padding: 0; }
.c2-summary-card__pending li {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 8px;
	margin-top: 10px;
}
.c2-account .c2-btn,
.c2-account button.c2-btn {
	min-height: 44px;
	padding: 10px 16px;
	justify-content: center;
	gap: 8px;
	font-size: 1rem;
	line-height: 1.2;
	text-transform: none;
	letter-spacing: 0;
	white-space: nowrap;
}
.c2-account .c2-link-arrow {
	min-height: 44px;
	font-size: 1rem;
	white-space: nowrap;
}
.c2-account .c2-form__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px;
}
.c2-account-list { list-style: none; margin: 0; padding: 0; }
.c2-account-list__item {
	display: flex;
	justify-content: space-between;
	gap: 16px;
	align-items: flex-start;
	padding: 18px 0;
	border-bottom: 1px solid var(--c2-border);
}
.c2-account-list__item > div { min-width: 0; flex: 1 1 auto; }
.c2-account-list__item > form,
.c2-account-list__item > .c2-btn { flex: none; }
.c2-account-gate { padding: 48px 0; }
.c2-sitemap__list { columns: 2; gap: 24px; }
.c2-sitemap__list li { margin-bottom: 8px; }
.c2-vc-quicklinks .c2-container,
.wpb_wrapper > .c2-grid { max-width: var(--c2-container); margin-left: auto; margin-right: auto; padding-left: var(--c2-gutter); padding-right: var(--c2-gutter); }
.wpb_column .c2-section-head,
.wpb_column .c2-grid,
.wpb_column .c2-cta,
.wpb_column .c2-quicklinks,
.wpb_column .c2-spaces,
.wpb_column .c2-agenda,
.wpb_column .c2-formacion { max-width: var(--c2-container); margin-left: auto; margin-right: auto; }
.vc_row.c2-section,
.vc_row.c2-section--bg,
.vc_row.c2-section--tight { padding-top: var(--c2-section-y); padding-bottom: var(--c2-section-y); }
.vc_row.c2-section--bg { background: var(--c2-bg); }
.vc_row.c2-vc-quicklinks { margin-top: -48px; position: relative; z-index: 2; padding-bottom: 24px; }

@media (max-width: 900px) {
	.c2-form__grid { grid-template-columns: minmax(0, 1fr); }
	.c2-sitemap__list { columns: 1; }

	/* Área personal — una columna; menú colapsable (acordeón) */
	.c2-account {
		grid-template-columns: minmax(0, 1fr);
		gap: 0;
		padding-top: 12px;
		padding-bottom: 40px;
		min-width: 0;
	}
	.c2-account__nav {
		position: static;
		margin: 0;
		padding: 0 0 14px;
		border-radius: 0;
		border-bottom: 1px solid var(--c2-border-soft);
		background: var(--c2-white);
		min-width: 0;
		max-width: 100%;
		overflow: visible;
	}
	.c2-account__nav-label { display: none; }
	.c2-account__nav-list--static { display: none; }
	.c2-account__nav-toggle {
		display: flex;
		min-height: 44px;
	}
	.c2-account__nav-panel { margin: 0; }
	.c2-account__nav-list {
		margin-top: 10px;
		padding-top: 10px;
		border-top: 1px solid var(--c2-border-soft);
	}
	.c2-account__nav-list li + li { margin-top: 2px; }
	.c2-account__nav a {
		min-height: 44px;
		padding: 10px 12px;
		font-size: 1rem;
		box-sizing: border-box;
	}
	.c2-account__nav a svg { width: 18px; height: 18px; flex: none; }
	.c2-account__nav-logout {
		margin-top: 8px;
		padding-top: 8px;
		border-top: 1px solid var(--c2-border-soft);
	}
	.c2-account__main {
		padding-top: 20px;
	}
	.c2-account-summary.c2-grid--3,
	.c2-account-summary.c2-grid--4 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 12px;
	}
	.c2-account-block .c2-section-head {
		flex-direction: column;
		align-items: stretch;
		gap: 12px;
		padding-left: 0;
		padding-right: 0;
		margin-bottom: 16px;
	}
	.c2-account-block .c2-section-head .c2-btn {
		align-self: flex-start;
	}
	.c2-account-list__item {
		flex-direction: column;
		align-items: stretch;
		gap: 12px;
	}
	.c2-account-list__item > form,
	.c2-account-list__item > .c2-btn {
		align-self: flex-start;
	}
	.c2-payment-methods .c2-account-list__item {
		flex-direction: column;
		align-items: stretch;
	}
	.c2-table-wrap {
		margin-left: calc(-1 * var(--c2-gutter));
		margin-right: calc(-1 * var(--c2-gutter));
		border-radius: 0;
		border-left: 0;
		border-right: 0;
	}
	.c2-table { min-width: 520px; font-size: .875rem; }
	.c2-table th,
	.c2-table td { padding: 12px 14px; }
	.c2-formation-card {
		flex-direction: column;
		padding: 18px 16px;
	}
	.c2-formation-card__actions {
		width: 100%;
		flex-direction: column;
		align-items: stretch;
	}
	.c2-formation-card__actions .c2-btn {
		justify-content: center;
		width: 100%;
	}
	.c2-formation-hub__actions .c2-btn {
		width: 100%;
		justify-content: center;
	}
	.c2-order-detail .c2-btn {
		display: flex;
		justify-content: center;
		width: 100%;
		box-sizing: border-box;
	}
	.c2-order-detail .c2-btn + .c2-btn { margin-top: 8px; }
}

@media (max-width: 600px) {
	.c2-orders .c2-table-wrap { display: none; }
	.c2-order-cards { display: block; }
	.c2-order-card__actions .c2-btn,
	.c2-order-card__actions .c2-link-arrow,
	.c2-account-list__actions .c2-btn,
	.c2-account-list__actions .c2-link-arrow {
		justify-content: center;
	}
}

@media (min-width: 901px) {
	.c2-account__nav-list--static { display: block; }
	.c2-account__nav-panel { display: none; }
}

@media (max-width: 680px) {
	.c2-account-summary.c2-grid--4 {
		grid-template-columns: minmax(0, 1fr);
	}
}

@media (min-width: 901px) and (max-width: 1100px) {
	.c2-account-summary.c2-grid--3,
	.c2-account-summary.c2-grid--4 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

/* Espacios: rejilla + sidebar de reserva (interface) */
.c2-espacios-layout { padding-bottom: var(--c2-section-y); }
/* Reparto flexible, no una rejilla de columnas fijas.

   `repeat(3, minmax(0, 1fr)) auto` estaba escrito a la medida de la barra de
   Espacios, que tiene tres campos y un botón. La agenda tiene dos controles y
   un botón, así que el botón «Buscar» caía en la tercera pista de `1fr` y se
   estiraba a 344 px: una barra teal enorme con la palabra «Buscar» dentro.
   Con `flex` el reparto depende de los hijos que haya, no de un número
   cableado, y sirve igual para cualquier barra futura. */
.c2-filterbar {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	gap: 14px;
	background: var(--c2-bg);
	border: 1px solid var(--c2-border);
	border-radius: var(--c2-radius);
	padding: 18px;
	margin-bottom: 28px;
}
.c2-filterbar > * { min-width: 0; }
.c2-filterbar .c2-field { flex: 1 1 190px; }
.c2-filterbar .c2-field--grow { flex: 2 1 260px; }
.c2-filterbar > .c2-btn,
.c2-filterbar > button { flex: 0 0 auto; }
.c2-filterbar .c2-field label {
	display: block;
	font-size: .8rem;
	font-weight: 700;
	color: var(--c2-navy-800);
	margin-bottom: 6px;
}
.c2-layout--spaces {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 340px;
	gap: 28px;
	align-items: start;
}
/* Solo posición: la tarjeta la pone el `.c2-panel` de dentro (ver sección 37). */
.c2-layout--spaces .c2-booking,
.c2-layout--spaces aside.c2-booking,
.c2-layout--spaces .c2-sidebar {
	position: sticky;
	top: 24px;
}
.c2-layout--spaces .c2-grid--3 {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}
@media (max-width: 1100px) {
	.c2-layout--spaces { grid-template-columns: minmax(0, 1fr); }
	.c2-layout--spaces .c2-grid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 700px) {
	.c2-layout--spaces .c2-grid--3 { grid-template-columns: minmax(0, 1fr); }
	/* Un control por línea: con `flex-basis` los campos aún cabrían de dos en
	   dos y quedan demasiado estrechos para escribir. */
	.c2-filterbar > * { flex: 1 1 100%; }
	.c2-filterbar > .c2-btn,
	.c2-filterbar > button { justify-content: center; }
}

/* Hero media foto a sangre */
.c2-hero__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

/* =========================================================================
   24. NUEVA INTERFAZ C2IET — Home, Servicios y Formación
   ========================================================================= */
:root {
	--c2-design-blue: #0D1B3D;
	--c2-design-blue-dark: #081228;
	--c2-design-teal: #00A79D;
	--c2-design-teal-dark: #008F87;
	--c2-design-ink: #0D1B3D;
	--c2-design-muted: #5C6570;
	--c2-design-lilac: #E6F8F7;
	--c2-design-yellow: #ffbd16;
	--c2-design-line: #E4E9F2;
}

/* Cabecera compacta de los nuevos diseños. */
.c2-topbar { display: none !important; }
.c2-header {
	background: #fff;
	border-bottom: 1px solid var(--c2-design-line);
	box-shadow: 0 1px 8px rgba(23, 32, 82, .04);
}
.c2-header .c2-container { gap: 22px; box-sizing: border-box; }
.c2-logo { color: var(--c2-design-blue); font-size: 1rem; letter-spacing: 0; }
.c2-logo:hover { color: var(--c2-design-blue-dark); }
.c2-logo__stack { display: inline-flex; flex-direction: column; align-items: flex-start; line-height: .9; }
.c2-logo__mark { color: var(--c2-design-blue); font-size: 1.35rem; letter-spacing: -.08em; }
.c2-logo__town { color: var(--c2-design-blue); font-size: .6875rem; font-weight: 700; letter-spacing: .02em; margin-top: 4px; }
.c2-logo img { display: block; height: var(--c2-logo-height, 48px); max-height: var(--c2-logo-height, 48px); width: auto; }
.c2-nav { margin-left: auto; }
.c2-nav > ul { gap: 0; }
.c2-nav > ul > li > a {
	padding-left: 12px;
	padding-right: 12px;
	font-size: .68rem;
	font-weight: 600;
	color: var(--c2-design-ink);
}
.c2-nav > ul > li > a:hover,
.c2-nav > ul > li.current-menu-item > a,
.c2-nav > ul > li.current-menu-ancestor > a,
.c2-nav > ul > li.current-page-ancestor > a { color: var(--c2-design-teal-dark); }
.c2-nav > ul > li.current-menu-item > a::after,
.c2-nav > ul > li.current-menu-ancestor > a::after,
.c2-nav > ul > li.current-page-ancestor > a::after { background: var(--c2-design-teal); height: 3px; left: 12px; right: 12px; }
.c2-search-toggle { display: none; }
.c2-header__actions { gap: 10px; }
.c2-btn-login,
.c2-user-chip {
	padding: 10px 17px;
	border: 0;
	border-radius: var(--c2-radius-pill);
	background: var(--c2-design-teal);
	color: #fff;
	font-size: .68rem;
	font-weight: 700;
	letter-spacing: .01em;
}
.c2-btn-login:hover,
.c2-user-chip:hover { background: var(--c2-design-teal-dark); color: #fff; }
.c2-user-chip svg { display: inline-block; transition: transform .18s ease; }
.c2-user-menu { border-color: var(--c2-design-line); border-radius: 12px; box-shadow: 0 12px 30px rgba(23, 32, 82, .16); }
.c2-user-menu a { color: var(--c2-design-ink); font-size: .8rem; }
.c2-user-menu a:hover { background: var(--c2-design-lilac); color: var(--c2-design-teal-dark); }
.c2-burger { width: 40px; height: 40px; border-color: var(--c2-design-line); color: var(--c2-design-teal-dark); }

/* Pie claro de la interfaz. */
.c2-footer {
	background: #f4f5fa;
	color: var(--c2-design-muted);
	border-top: 1px solid var(--c2-design-line);
	font-size: .9rem;
}
.c2-footer__main { padding: 40px 0 30px; }
.c2-footer .c2-container { box-sizing: border-box; }
.c2-footer__grid { grid-template-columns: 1.35fr 1fr 1fr 1.2fr; gap: 34px; }
.c2-footer__logo {
	display: inline-flex;
	flex-direction: column;
	align-items: flex-start;
	color: var(--c2-design-blue);
	font-size: 1rem;
	line-height: .9;
	letter-spacing: 0;
	margin-bottom: 12px;
}
.c2-footer__logo img {
	display: block;
	height: 40px;
	max-height: 40px;
	width: auto;
	max-width: 168px;
}
.c2-footer__logo .c2-logo__mark { font-size: 1.28rem; }
.c2-footer h2,
.c2-footer h3 {
	color: var(--c2-design-ink);
	font-size: .7rem;
	text-transform: none;
	letter-spacing: 0;
	margin-bottom: 12px;
}
.c2-footer li { margin-bottom: 8px; }
.c2-footer a,
.c2-footer__legal a { color: #59627f; }
.c2-footer a:hover,
.c2-footer__legal a:hover { color: var(--c2-design-teal-dark); }
.c2-footer__about p,
.c2-footer__funding p { color: #59627f; font-size: .68rem; max-width: 31ch; }
.c2-footer__contact li { color: #59627f; }
.c2-footer__contact svg { color: var(--c2-design-teal); }
.c2-footer__institution { display: flex; align-items: center; gap: 8px; margin-top: 14px; color: var(--c2-design-ink); font-size: .65rem; font-weight: 600; }
.c2-footer__crest { width: 22px; height: 25px; flex: none; }
.c2-footer__funding { padding: 10px 0; border-top: 1px solid var(--c2-design-line); border-bottom: 1px solid var(--c2-design-line); }
.c2-footer__funding .c2-container { gap: 12px; }
.c2-footer__eu-flag { width: 30px; height: 20px; }
.c2-footer__funding p { margin: 0; max-width: none; font-size: .62rem; }
.c2-footer__bottom { padding: 14px 0; }
.c2-footer__bottom .c2-container { color: #59627f; font-size: .6rem; }

/* Pie maquetado como Area Item (WPBakery). */
.c2-footer-area,
.c2-footer-area .grve-section {
	background: #f4f5fa;
}
.c2-footer-area .grve-title,
.c2-footer-area .widgettitle,
.c2-footer-area h2,
.c2-footer-area h3 {
	color: var(--c2-design-ink);
	font-size: 1.05rem;
	font-weight: 700;
	text-transform: none;
	letter-spacing: -.01em;
	margin: 0 0 16px;
	line-height: 1.25;
}
.c2-footer-area .c2-footer-mark {
	color: var(--c2-design-blue);
	font-size: 1.55rem;
	font-weight: 800;
	letter-spacing: -.06em;
	line-height: .9;
	margin: 0;
}
.c2-footer-area .c2-footer-mark span {
	display: block;
}
.c2-footer-area .c2-footer-town {
	color: var(--c2-design-blue);
	font-size: .8rem;
	font-weight: 700;
	letter-spacing: .04em;
	margin: 4px 0 0;
}
.c2-footer-area ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
.c2-footer-area li {
	margin: 0;
}
.c2-footer-area .widget_nav_menu li + li {
	margin-top: 2px;
}
.c2-footer-area a {
	color: var(--c2-design-muted);
}
.c2-footer-area a:hover {
	color: var(--c2-design-teal-dark);
}
.c2-footer-area .widget_nav_menu .widgettitle + div,
.c2-footer-area .widget_nav_menu ul {
	margin: 0;
}
.c2-footer-area p {
	color: var(--c2-design-muted);
	font-size: .9rem;
	line-height: 1.5;
	max-width: none;
	margin: 0;
}
.c2-footer-row--main .grve-column-wrapper {
	min-width: 0;
}
.c2-footer-col--brand .grve-column-wrapper {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	grid-template-areas:
		"id logo"
		"town logo"
		"lead lead";
	column-gap: 18px;
	row-gap: 0;
	align-items: center;
}
.c2-footer-col--brand .c2-footer-mark { grid-area: id; }
.c2-footer-col--brand .c2-footer-mark + .grve-text { grid-area: town; }
.c2-footer-col--brand .c2-footer__municipal-logo { grid-area: logo; justify-self: start; }
.c2-footer-col--brand .c2-footer-lead {
	grid-area: lead;
	margin-top: 14px;
	max-width: 34ch;
}
.c2-footer-area .c2-footer__municipal-logo {
	display: block;
	line-height: 0;
}
.c2-footer-area .c2-footer__municipal-logo img {
	display: block;
	width: auto;
	height: 52px;
	max-height: 52px;
	max-width: 180px;
	object-fit: contain;
	mix-blend-mode: lighten;
}
/* Movedo deja las imágenes a opacity 0 hasta que el JS las revela. */
.c2-footer-area .grve-image img {
	opacity: 1;
}
.c2-footer-row--funding {
	border-top: 1px solid var(--c2-design-line);
}
.c2-footer-row--funding .grve-row {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 14px;
}
.c2-footer-row--funding .grve-column-1-6 {
	width: auto;
	float: none;
	flex: 0 0 auto;
}
.c2-footer-row--funding .grve-column-5-6 {
	width: auto;
	float: none;
	flex: 1 1 0;
	min-width: 0;
	max-width: none;
}
.c2-footer-row--funding p {
	max-width: none;
	width: 100%;
	margin: 0;
	font-size: .85rem;
	line-height: 1.5;
}
.c2-footer-area .c2-footer__eu-flag {
	display: block;
	width: 36px;
	height: 24px;
	border-radius: 3px;
	box-shadow: 0 0 0 1px rgba(23, 32, 82, .08);
}
.c2-footer-area .grve-section.c2-footer-row--bottom {
	border-top: 1px solid var(--c2-design-line);
	background: #f4f5fa;
	color: var(--c2-design-muted);
	font-size: .78rem;
}
.c2-footer-row--bottom p {
	margin: 0;
	max-width: none;
	font-size: inherit;
	letter-spacing: .01em;
}
.c2-footer-row--bottom .grve-row {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px 24px;
}
.c2-footer-row--bottom .grve-column {
	float: none;
	width: auto;
}
.c2-footer-row--bottom .grve-column:last-child {
	margin-left: auto;
	text-align: right;
}
.c2-footer-area .widget,
.c2-footer-area .widget_nav_menu {
	margin: 0;
	padding: 0;
	background: transparent;
	border: 0;
	box-shadow: none;
}
.c2-footer-area .grve-element {
	margin: 0;
}
.c2-footer-area .c2-footer__contact {
	margin-top: 14px;
}
.c2-footer-area .c2-footer__contact li {
	display: flex;
	gap: 12px;
	align-items: flex-start;
	color: var(--c2-design-muted);
	font-size: .9rem;
	line-height: 1.45;
}
.c2-footer-area .c2-footer__contact li + li {
	margin-top: 10px;
}
.c2-footer-area .c2-footer__contact svg {
	flex: none;
	width: 16px;
	height: 16px;
	padding: 6px;
	margin-top: 0;
	color: var(--c2-design-teal);
	border: 1px solid rgba(0, 167, 157, .35);
	border-radius: 50%;
	background: #fff;
	box-sizing: content-box;
}
.c2-footer-area .widget_nav_menu a,
.c2-footer-area .wpb_text_column a {
	display: inline-flex;
	align-items: center;
	min-height: 0;
	padding: 3px 0;
	font-size: .95rem;
	line-height: 1.35;
}
@media (max-width: 768px) {
	.c2-footer-col--brand .grve-column-wrapper {
		grid-template-columns: auto 1fr;
	}
	.c2-footer-row--bottom .grve-column:last-child {
		margin-left: 0;
		text-align: left;
	}
}

/* Base de las tres composiciones nuevas.

   Estas páginas tenían su propio contenedor de 1220 px mientras la cabecera,
   la topbar y el pie usaban 1240 px: el contenido quedaba 10 px descentrado
   respecto al resto del portal. Ahora heredan el contenedor global, que sale
   de las Opciones del tema. */
.c2-design-page {
	color: var(--c2-design-ink);
	background: #fff;
	overflow-x: hidden;
	overflow-y: visible;
}
.c2-design-page .c2-container { box-sizing: border-box; }
.c2-design-page h1,
.c2-design-page h2,
.c2-design-page h3 { color: var(--c2-design-ink); }
.c2-design-page p { color: var(--c2-design-muted); }
.c2iet .c2-cta-band,
.c2iet .c2-cta-band h1,
.c2iet .c2-cta-band h2,
.c2iet .c2-cta-band h3,
.c2iet .c2-cta-band h4,
.c2iet .c2-cta-band p,
.c2iet .c2-cta-band .grve-title,
.c2iet .c2-cta-band .grve-heading,
.c2iet .c2-cta-band .grve-description,
.c2-design-page .c2-cta-band,
.c2-design-page .c2-cta-band h1,
.c2-design-page .c2-cta-band h2,
.c2-design-page .c2-cta-band h3,
.c2-design-page .c2-cta-band h4,
.c2-design-page .c2-cta-band p {
	color: #fff;
}
.c2-design-page .grve-headings-light h1,
.c2-design-page .grve-headings-light h2,
.c2-design-page .grve-headings-light h3,
.c2-design-page .grve-headings-light h4,
.c2-design-page .grve-headings-light p,
.c2-design-page .grve-headings-light .grve-title,
.c2-design-page .grve-headings-light .grve-heading,
.c2-design-page .grve-headings-light .grve-counter-item,
.c2-design-page .grve-headings-light .grve-counter-title,
.c2-design-page .grve-headings-light .grve-box-title {
	color: #fff;
}
/* El ritmo vertical de estas secciones se define una sola vez, más abajo,
   con los tokens `--c2-section-y*`. */
.c2-design-section--courses { background: #fff; }
.c2-design-section__head {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 24px;
	margin-bottom: 24px;
}
.c2-design-section__head h2 { margin: 0 0 4px; font-size: clamp(1.3rem, 1.1rem + .55vw, 1.75rem); }
.c2-design-section__head p { margin: 0; font-size: .68rem; }
.c2-design-section__head--center { justify-content: center; text-align: center; }
.c2-design-section__head--center > div { max-width: 600px; }
.c2-design-section__link { display: inline-flex; align-items: center; gap: 7px; color: var(--c2-design-teal-dark); font-size: .65rem; font-weight: 700; white-space: nowrap; }
.c2-design-section__link:hover { color: var(--c2-design-teal); }
.c2-design-section__center { display: flex; justify-content: center; margin-top: 30px; }
.c2-design-grid { display: grid; gap: 18px; }
.c2-design-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.c2-design-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.c2-design-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.c2-design-kicker {
	display: inline-block;
	color: #fff;
	background: var(--c2-design-yellow);
	border-radius: 4px;
	padding: 4px 9px;
	font-size: .58rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: .04em;
}
.c2-design-kicker--blue { color: var(--c2-design-ink); background: transparent; padding: 0 0 4px; box-shadow: inset 0 -3px 0 var(--c2-design-teal); }
.c2-design-tag {
	display: inline-flex;
	align-items: center;
	width: fit-content;
	padding: 3px 8px;
	border-radius: 4px;
	background: var(--c2-design-yellow);
	color: #5b4300;
	font-size: .52rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: .03em;
}
.c2-design-tag--dark { position: absolute; z-index: 1; top: 10px; left: 10px; background: var(--c2-design-teal); color: #fff; }
.c2-design-tag--outline { background: transparent; color: var(--c2-design-teal-dark); padding: 0; }
.c2-design-btn {
	display: inline-flex;
	box-sizing: border-box;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 29px;
	padding: 7px 17px;
	border: 1px solid transparent;
	border-radius: var(--c2-radius-pill);
	font-family: Poppins, var(--c2-font-heading);
	font-size: .62rem;
	font-weight: 700;
	line-height: 1.2;
	white-space: nowrap;
	transition: background .18s ease, color .18s ease, border-color .18s ease, transform .18s ease;
}
/* Movedo pide Poppins en los botones. Va autoalojada, sin Google. */
button.c2-btn,
a.grve-btn,
button.grve-custom-btn.c2-btn,
a.c2-design-btn {
	font-family: Poppins, sans-serif !important;
}
.c2-design-btn:hover { transform: translateY(-1px); }
.c2-design-btn--blue { color: #fff; background: var(--c2-design-teal); border-color: var(--c2-design-teal); }
.c2-design-btn--blue:hover { color: #fff; background: var(--c2-design-teal-dark); border-color: var(--c2-design-teal-dark); }
.c2-design-btn--navy { color: #fff; background: var(--c2-design-blue); border-color: var(--c2-design-blue); }
.c2-design-btn--navy:hover { color: #fff; background: var(--c2-design-blue-dark); border-color: var(--c2-design-blue-dark); }
.c2-design-btn--outline { color: var(--c2-design-ink); background: #fff; border-color: var(--c2-design-teal); }
.c2-design-btn--outline:hover { color: #fff; background: var(--c2-design-teal); }
.c2-design-btn--white { color: var(--c2-design-ink); background: #fff; border-color: #fff; }
.c2-design-btn--white:hover { color: var(--c2-design-teal-dark); background: var(--c2-cyan-050); }
.c2-design-btn--glass { color: #fff; background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.7); }
.c2-design-btn--glass:hover { color: var(--c2-design-ink); background: #fff; }
.c2-design-btn--small { min-height: 25px; padding: 5px 12px; font-size: .58rem; }
.c2-design-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; }

/* Hero fotográfico compartido. */
.c2-design-hero {
	position: relative;
	display: flex;
	align-items: center;
	min-height: 386px;
	background-color: #0D1B3D;
	background-image: linear-gradient(rgba(13, 27, 61, .70), rgba(13, 27, 61, .70)), var(--c2-design-hero-image);
	background-position: center;
	background-size: cover;
	color: #fff;
}
.c2-design-hero::after { content: ""; position: absolute; inset: auto 0 0; height: 26px; background: linear-gradient(180deg, transparent, rgba(255,255,255,.16)); pointer-events: none; }
.c2-design-hero .c2-container { position: relative; z-index: 1; }
.c2-design-hero__content { max-width: 490px; }
.c2-design-hero h1 { max-width: 13ch; margin: 12px 0 10px; color: #fff; font-size: clamp(2rem, 1.4rem + 2.2vw, 3.35rem); line-height: 1.03; letter-spacing: -.045em; }
.c2-design-hero p { max-width: 47ch; margin: 0; color: rgba(255,255,255,.9); font-size: .77rem; line-height: 1.5; }
.c2-design-hero--home .c2-design-search { margin-top: 28px; max-width: 470px; }
/* Home centrada: misma lógica vertical y de ancho que Formación. */
.c2-design-hero--home:has(.c2-design-hero__content--center) {
	min-height: 375px;
	background-image: linear-gradient(rgba(13, 27, 61, .68), rgba(13, 27, 61, .68)), var(--c2-design-hero-image);
}
.c2-design-hero--home:has(.c2-design-hero__content--center) .c2-design-search {
	max-width: none;
	width: 100%;
}
.c2-design-hero--services { min-height: 360px; }
.c2-design-hero--services h1 { max-width: 14ch; font-size: clamp(1.9rem, 1.3rem + 2vw, 3rem); }
.c2-design-hero--training { min-height: 375px; }
.c2-design-hero__content--center { max-width: 680px; margin: 0 auto; text-align: center; }
.c2-design-hero__content--center h1 { max-width: none; font-size: clamp(2rem, 1.45rem + 2.2vw, 3.2rem); }
.c2-design-hero__content--center p { margin: 0 auto; max-width: 52ch; }
.c2-design-hero__content--center .c2-design-actions {
	justify-content: center;
}
.c2-design-hero__content--center .c2-design-search { margin: 24px auto 0; width: 100%; max-width: none; }
.c2-design-search {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 4px 5px 4px 13px;
	border-radius: var(--c2-radius-pill);
	background: #fff;
	box-shadow: 0 8px 24px rgba(11, 20, 59, .18);
}
.c2-design-search__icon { display: inline-flex; color: #a1a8bc; flex: none; }
.c2-design-search input { min-width: 0; flex: 1; border: 0 !important; outline: 0; box-shadow: none !important; padding: 8px 4px; background: transparent; color: var(--c2-design-ink); font-size: .64rem; }
.c2-design-search input::placeholder { color: #8991aa; opacity: 1; }
.c2-design-search .c2-design-btn { flex: none; }
.c2-design-chips { display: flex; flex-wrap: wrap; justify-content: center; gap: 7px; margin-top: 10px; }
.c2-design-chips span,
.c2-design-chips a {
	padding: 4px 9px;
	border: 1px solid rgba(255,255,255,.9);
	border-radius: 999px;
	color: #fff !important;
	background: rgba(10, 28, 56, .34);
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
	box-shadow: 0 1px 2px rgba(10, 28, 56, .18);
	font-size: .54rem;
	font-weight: 700 !important;
	text-decoration: none;
}

/* Tarjetas de servicios, espacios y cursos. */
.c2-design-card {
	display: flex;
	flex-direction: column;
	min-width: 0;
	overflow: hidden;
	background: #fff;
	border: 1px solid var(--c2-design-line);
	border-radius: 9px;
	box-shadow: 0 2px 9px rgba(23, 32, 82, .05);
	transition: transform .18s ease, box-shadow .18s ease;
}
.c2-design-card:hover { transform: translateY(-3px); box-shadow: 0 9px 22px rgba(23, 32, 82, .11); }
.c2-design-card__media { position: relative; display: block; overflow: hidden; aspect-ratio: 1.65 / 1; background: var(--c2-cyan-050); }
.c2-design-card__media img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .35s ease; }
.c2-design-card:hover .c2-design-card__media img { transform: scale(1.04); }
.c2-design-card__body { display: flex; flex-direction: column; flex: 1; gap: 8px; padding: 14px; }
.c2-design-card h3 { margin: 0; font-size: .85rem; line-height: 1.18; }
.c2-design-card h3 a { color: var(--c2-design-ink); }
.c2-design-card h3 a:hover { color: var(--c2-design-teal-dark); }
.c2-design-card p { margin: 0; font-size: .62rem; line-height: 1.45; }
.c2-design-card .c2-design-btn { margin-top: auto; align-self: flex-start; }
.c2-design-service-card .c2-design-tag { margin-top: 1px; }
.c2-design-service-card .c2-design-btn { width: 100%; }
.c2-design-meta { display: flex; flex-wrap: wrap; gap: 10px; list-style: none; margin: 0; padding: 0; color: var(--c2-design-muted); font-size: .58rem; }
.c2-design-meta li { display: inline-flex; align-items: center; gap: 4px; margin: 0; }
.c2-design-meta svg { color: var(--c2-design-teal); }
.c2-design-space-card .c2-design-card__body { gap: 10px; }
.c2-design-course-card__author { font-size: .56rem !important; color: #8b92a8 !important; }
.c2-design-course-card__rating { color: var(--c2-design-yellow); font-size: .65rem; letter-spacing: .04em; }
.c2-design-course-card__rating small { color: #8991aa; font-size: .55rem; letter-spacing: 0; }
.c2-design-course-card__footer { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-top: auto; padding-top: 8px; border-top: 1px solid var(--c2-design-line); font-size: .55rem; color: #8991aa; }
.c2-design-course-card__footer strong { color: var(--c2-design-teal-dark); font-size: .62rem; }
.c2-design-course-card__footer span { display: inline-flex; align-items: center; gap: 3px; }
.c2-design-course-card__price { font-weight: 700; color: var(--c2-design-ink); }
.c2-design-course-card .c2-design-btn { width: 100%; justify-content: center; margin-top: 2px; }

/* Banda fotográfica de formación en Home. */
.c2-design-image-band {
	position: relative;
	min-height: 220px;
	display: flex;
	align-items: center;
	background-color: #0D1B3D;
	background-image: linear-gradient(rgba(13, 27, 61, .72), rgba(13, 27, 61, .72)), var(--c2-design-band-image);
	background-size: cover;
	background-position: center;
}
.c2-design-image-band__content { max-width: 390px; }
.c2-design-image-band h2 { margin: 0 0 8px; color: #fff; font-size: clamp(1.55rem, 1.2rem + 1.4vw, 2.25rem); line-height: 1.02; }
.c2-design-image-band p { margin: 0; color: rgba(255,255,255,.82); font-size: .67rem; }

/* Noticias y bloque de suscripción. */
.c2-design-news { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(280px, .8fr); gap: 26px; }
.c2-design-news__featured { overflow: hidden; border-radius: 9px; background: #fff; }
.c2-design-news__image { display: block; overflow: hidden; aspect-ratio: 1.75 / 1; }
.c2-design-news__image img { display: block; width: 100%; height: 100%; object-fit: cover; }
.c2-design-news__body { padding: 14px 4px 0; }
.c2-design-news__body h3 { margin: 7px 0 6px; font-size: 1.05rem; line-height: 1.12; }
.c2-design-news__body h3 a { color: var(--c2-design-ink); }
.c2-design-news__body p { font-size: .65rem; max-width: 60ch; }
.c2-design-news__list { display: flex; flex-direction: column; gap: 13px; }
.c2-design-news__item { display: grid; grid-template-columns: 86px minmax(0, 1fr); gap: 10px; align-items: start; }
.c2-design-news__item > a { display: block; overflow: hidden; aspect-ratio: 1.25 / 1; border-radius: 7px; }
.c2-design-news__item > a img { display: block; width: 100%; height: 100%; object-fit: cover; }
.c2-design-news__item h3 { margin: 4px 0; font-size: .7rem; line-height: 1.2; }
.c2-design-news__item h3 a { color: var(--c2-design-ink); }
.c2-design-news__item time { color: #9aa1b6; font-size: .52rem; }
.c2-design-newsletter { margin-top: auto; padding: 15px; border-radius: 9px; background: var(--c2-design-teal); color: #fff; }
.c2-design-newsletter strong { display: block; font-size: .75rem; }
.c2-design-newsletter p { color: rgba(255,255,255,.8); font-size: .59rem; margin: 4px 0 10px; }

/* Página Servicios. */
.c2-design-services .c2-design-section--spaces { padding-bottom: var(--c2-section-y); }
.c2-design-program-card { overflow: hidden; background: #fff; border: 1px solid var(--c2-design-line); border-radius: 8px; box-shadow: 0 2px 8px rgba(23,32,82,.04); }
.c2-design-program-card__media { aspect-ratio: 1.45 / 1; overflow: hidden; }
.c2-design-program-card__media img { display: block; width: 100%; height: 100%; object-fit: cover; }
.c2-design-program-card__body { position: relative; padding: 13px; }
.c2-design-program-card__icon { display: inline-flex; align-items: center; justify-content: center; width: 25px; height: 25px; border-radius: 6px; background: var(--c2-design-lilac); color: var(--c2-design-teal); }
.c2-design-program-card h3 { margin: 8px 0 4px; font-size: .78rem; }
.c2-design-program-card h3 a { color: var(--c2-design-ink); }
.c2-design-program-card p { margin: 0 0 8px; font-size: .58rem; line-height: 1.4; }
.c2-design-program-card__body > a { color: var(--c2-design-teal-dark); font-size: .56rem; font-weight: 700; }
.c2-design-reservation { background: var(--c2-cyan-050); }
.c2-design-reservation .c2-container { display: grid; grid-template-columns: minmax(0, .9fr) minmax(430px, 1.1fr); gap: 50px; align-items: center; }
.c2-design-reservation__copy { max-width: 390px; }
.c2-design-reservation__copy h2 { margin: 0 0 10px; font-size: 1.55rem; }
.c2-design-reservation__copy p { font-size: .68rem; }
.c2-design-reservation__copy ul { display: grid; gap: 9px; list-style: none; margin: 22px 0 0; padding: 0; }
.c2-design-reservation__copy li { display: flex; align-items: flex-start; gap: 9px; padding: 10px; border-radius: 7px; background: #fff; color: var(--c2-design-muted); font-size: .58rem; }
.c2-design-reservation__copy li svg { flex: none; color: var(--c2-design-teal); }
.c2-design-reservation__copy li span { display: grid; gap: 2px; }
.c2-design-reservation__copy li strong { color: var(--c2-design-ink); font-size: .61rem; }
.c2-design-reservation__form { min-width: 0; }
.c2-design-reservation__form .c2-booking { max-width: 520px; margin: 0 auto; }
.c2-design-reservation__form .c2-panel { padding: 20px; border: 0; border-radius: 10px; background: #fff; box-shadow: 0 7px 22px rgba(23,32,82,.12); }
.c2-design-reservation__form .c2-panel > h2 { font-size: 1rem; }
.c2-design-reservation__form .c2-steps { display: none; }
.c2-design-reservation__form .c2-field label { font-size: .58rem; }
.c2-design-reservation__form .c2-field input,
.c2-design-reservation__form .c2-field select,
.c2-design-reservation__form .c2-field textarea { padding: 8px 10px; border-radius: 6px; font-size: .65rem; }
.c2-design-reservation__form .c2-btn { min-height: 28px; padding: 7px 13px; font-size: .6rem; }
.c2-design-testimonials { background: var(--c2-design-yellow); }
/* Blanco sobre el amarillo de marca daba 1,67:1. El azul tinta da 9,19:1. */
.c2-design-testimonials h2 { margin: 0 0 22px; text-align: center; color: var(--c2-design-ink); font-size: 1.4rem; }
.c2-design-testimonials blockquote { position: relative; margin: 0; padding: 19px; border-radius: 8px; background: #fff; color: var(--c2-design-muted); font-size: .64rem; }
.c2-design-testimonials blockquote strong,
.c2-design-testimonials blockquote cite { display: block; }
.c2-design-testimonials blockquote strong { color: var(--c2-design-ink); font-size: .7rem; }
.c2-design-testimonials blockquote cite { margin: 2px 0 10px; color: var(--c2-design-teal-dark); font-size: .55rem; font-style: normal; }
.c2-design-testimonials blockquote p { margin: 0; font-size: .62rem; }

/* Página Formación. */
.c2-design-training .c2-design-section--courses { padding-bottom: var(--c2-section-y); }
.c2-design-classroom { background: #fff8e9; }
.c2-design-classroom .c2-container { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: 48px; align-items: center; }
.c2-design-classroom__copy { max-width: 390px; margin-left: auto; }
.c2-design-classroom__copy h2 { margin: 0 0 8px; font-size: 1.45rem; }
.c2-design-classroom__copy p { font-size: .66rem; }
.c2-design-classroom__copy ul { display: grid; gap: 5px; list-style: none; margin: 15px 0 18px; padding: 0; color: var(--c2-design-muted); font-size: .6rem; }
.c2-design-classroom__copy li { display: flex; align-items: center; gap: 6px; }
.c2-design-classroom__copy li svg { color: var(--c2-design-teal); }
.c2-design-classroom__media { position: relative; overflow: visible; border-radius: 10px; }
.c2-design-classroom__media img { display: block; width: 100%; max-height: 290px; object-fit: cover; border-radius: 10px; box-shadow: 0 7px 20px rgba(23,32,82,.14); }
.c2-design-classroom__media > span { position: absolute; right: -7px; bottom: -10px; display: grid; grid-template-columns: auto auto; gap: 1px 5px; align-items: center; padding: 9px 12px; border: 2px solid #fff; border-radius: 9px; background: #fff; color: var(--c2-design-muted); font-size: .5rem; box-shadow: 0 3px 10px rgba(23,32,82,.13); }
.c2-design-classroom__media > span svg { grid-row: span 2; color: var(--c2-design-teal); }
.c2-design-classroom__media > span strong { color: var(--c2-design-teal-dark); font-size: .7rem; }
.c2-design-section--resources { background: #fff; }
.c2-design-resources { display: grid; grid-template-columns: 1.15fr .85fr; gap: 12px; max-width: 900px; margin: 0 auto; }
.c2-design-resource { display: flex; flex-direction: column; gap: 8px; padding: 18px; border: 1px solid var(--c2-design-line); border-radius: 8px; color: var(--c2-design-ink); }
.c2-design-resource:hover { transform: translateY(-2px); box-shadow: 0 7px 18px rgba(23,32,82,.09); }
.c2-design-resource > span { display: inline-flex; color: var(--c2-design-teal); }
.c2-design-resource strong { font-size: .9rem; }
.c2-design-resource p { margin: 0; font-size: .61rem; }
.c2-design-resource small { display: flex; justify-content: space-between; gap: 8px; margin-top: auto; color: var(--c2-design-muted); font-size: .52rem; }
.c2-design-resource small b { color: var(--c2-design-teal-dark); }
.c2-design-resource--large { min-height: 175px; }
.c2-design-resources__side { display: grid; gap: 12px; }
.c2-design-resource--blue { color: #fff; background: var(--c2-design-teal); border-color: var(--c2-design-teal); }
.c2-design-resource--blue > span,
.c2-design-resource--blue small { color: rgba(255,255,255,.85); }
.c2-design-resource--lilac { background: var(--c2-cyan-100); border-color: var(--c2-cyan-100); }

@media (max-width: 1100px) {
	.c2-nav > ul > li > a { padding-left: 8px; padding-right: 8px; font-size: .62rem; }
	.c2-design-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.c2-design-reservation .c2-container { grid-template-columns: 1fr 1fr; gap: 28px; }
}
@media (max-width: 850px) {
	.c2-nav { display: none; }
	.c2-search-toggle { display: inline-flex; width: 36px; height: 36px; }
	.c2-btn-login, .c2-user-chip { padding: 9px 13px; }
	.c2-design-hero { min-height: 350px; }
	.c2-design-news { grid-template-columns: minmax(0, 1fr); }
	.c2-design-reservation .c2-container,
	.c2-design-classroom .c2-container { grid-template-columns: minmax(0, 1fr); }
	.c2-design-reservation__copy,
	.c2-design-classroom__copy { max-width: 600px; margin-left: 0; }
	.c2-design-reservation__form .c2-booking { max-width: 600px; margin: 0; }
	.c2-design-resources { grid-template-columns: minmax(0, 1fr); }
	.c2-design-resources__side { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
	.c2-design-section { padding: 38px 0; }
	.c2-design-section__head { display: block; margin-bottom: 18px; }
	.c2-design-section__link { margin-top: 10px; }
	.c2-design-grid--2,
	.c2-design-grid--3,
	.c2-design-grid--4 { grid-template-columns: minmax(0, 1fr); }
	.c2-design-hero { min-height: 420px; align-items: flex-end; padding-bottom: 38px; }
	.c2-design-hero--services,
	.c2-design-hero--training,
	.c2-design-hero--home:has(.c2-design-hero__content--center) { min-height: 405px; align-items: center; padding-bottom: 0; }
	.c2-design-hero h1 { font-size: 2.1rem; }
	.c2-design-search { width: 100%; }
	.c2-design-image-band { min-height: 250px; }
	.c2-design-resources__side { grid-template-columns: minmax(0, 1fr); }
	.c2-footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 18px; }
	.c2-footer__about { grid-column: 1 / -1; }
	.c2-design-reservation .c2-container { display: block; }
	.c2-design-reservation__form { margin-top: 28px; }
}

/* =========================================================================
   25. CONSOLIDACIÓN VISUAL — escala tipográfica y componentes comunes

   La primera iteración de las composiciones nuevas estaba dimensionada para
   parecerse al PNG a escala reducida. En producción eso dejaba cuerpo,
   metadatos y botones por debajo de un tamaño cómodo. Estos tokens son la
   capa común que usan tanto las páginas nuevas como los listados clásicos.
   ========================================================================= */
:root {
	/* Ojo: la métrica de retícula (contenedor, gutter, ritmo vertical) ya no
	   se declara aquí. Ver el comentario del bloque `:root` inicial. */
	--c2-text: #2B2B2B;
	--c2-text-soft: #4A4A4A;
	--c2-design-ink: #0D1B3D;
	--c2-design-muted: #5C6570;
	--c2-design-line: #E4E9F2;
	--c2-design-lilac: #E6F8F7;
}

body.c2iet {
	font-size: 16px;
	line-height: 1.6;
}

.c2iet h1 { font-size: clamp(2.35rem, 1.65rem + 2.8vw, 4rem); }
.c2iet h2 { font-size: clamp(1.8rem, 1.4rem + 1.4vw, 2.5rem); }
.c2iet h3 { font-size: clamp(1.2rem, 1.05rem + .45vw, 1.5rem); }

/* Topbar institucional: mejora contexto y acceso sin competir con el menú. */
.c2-topbar {
	display: block !important;
	background: var(--c2-navy-900);
	color: #eef4ff;
	font-size: .8125rem;
	line-height: 1.35;
	border-bottom: 3px solid var(--c2-cyan-500);
}
.c2-topbar__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	min-height: 38px;
	padding-top: 7px;
	padding-bottom: 7px;
	box-sizing: border-box;
}
.c2-topbar__identity,
.c2-topbar__links {
	display: flex;
	align-items: center;
	gap: 10px;
	min-width: 0;
}
.c2-topbar__identity { font-weight: 600; }
.c2-topbar__crest { width: 20px; height: 23px; flex: none; }
.c2-topbar__links { gap: 18px; }
.c2-topbar__links a {
	color: #eef4ff;
	font-weight: 500;
	white-space: nowrap;
}
.c2-topbar__links a:hover,
.c2-topbar__links a:focus-visible { color: #fff; text-decoration: underline; }

/* Header: una escala legible y estable en todas las páginas. */
.c2-header {
	background: #fff;
	border-bottom-color: var(--c2-design-line);
}
.c2-header .c2-container {
	box-sizing: border-box;
}
.c2-logo { font-size: 1rem; }
.c2-logo__mark { font-size: 1.55rem; }
.c2-logo__town { font-size: .6875rem; }
.c2-nav > ul { gap: 2px; }
.c2-nav > ul > li > a {
	padding-left: 11px;
	padding-right: 11px;
	font-size: .875rem;
	font-weight: 600;
}
.c2-nav > ul > li.current-menu-item > a::after,
.c2-nav > ul > li.current-menu-ancestor > a::after,
.c2-nav > ul > li.current-page-ancestor > a::after {
	background: var(--c2-design-teal);
}
.c2-btn-login,
.c2-user-chip {
	min-height: 44px;
	padding: 10px 18px;
	border-radius: var(--c2-radius-pill);
	font-size: .875rem;
}
.c2-user-menu a { font-size: .875rem; }

/* Sistema común para cualquier entidad: servicio, espacio, curso, evento o
   noticia. La información específica puede cambiar, no la jerarquía visual. */
.c2-grid,
.c2-design-grid { gap: 24px; }
.c2-card,
.c2-event-card,
.c2-design-card,
.c2-design-program-card {
	border: 1px solid var(--c2-design-line);
	border-radius: 14px;
	box-shadow: 0 3px 14px rgba(23, 32, 82, .07);
}
.c2-card:hover,
.c2-event-card:hover,
.c2-design-card:hover,
.c2-design-program-card:hover {
	border-color: rgba(0, 167, 157, .35);
	box-shadow: 0 12px 28px rgba(0, 167, 157, .12);
}
.c2-card__body { padding: 22px 24px 24px; gap: 13px; }
.c2-card__body h3,
.c2-event-card__body h3 { font-size: 1.25rem; line-height: 1.25; }
.c2-card__excerpt,
.c2-event-card__excerpt { font-size: .9375rem; line-height: 1.55; color: var(--c2-text-soft); }
.c2-meta { font-size: .875rem; line-height: 1.45; }
.c2-link-arrow { font-size: .9375rem; }
.c2-badge,
.c2-status { font-size: .75rem; }
.c2-event-card { padding: 24px; gap: 24px; }
.c2-event-date { min-width: 74px; }
.c2-event-date__day { font-size: 2rem; }
.c2-event-date__month,
.c2-event-date__year { font-size: .75rem; }

/* La tarjeta destacada conserva su jerarquía, pero comparte ritmo y bordes. */
.c2-feature-card { border-radius: 16px; }
.c2-feature-card__body { padding: 32px 36px; gap: 16px; }
.c2-feature-card__body h3 { font-size: clamp(1.5rem, 1.25rem + .7vw, 2rem); }

/* Escala legible de Home, Servicios y Formación.

   El ritmo vertical sale de `--c2-section-y` / `--c2-section-y-tight`, que a
   su vez salen de la escala de espaciado de Movedo (3x y 2x). Antes cada
   sección traía su propio número —48, 52, 54, 56, 64, 70, 76, 84, 88— y por
   eso unas respiraban y otras iban apretadas sin criterio. Un editor que
   ponga "3x" en una fila de WPBakery obtiene ahora exactamente este mismo
   espacio. */
.c2-design-page { font-size: 1rem; }
.c2-design-section { padding: var(--c2-section-y) 0; }
/* Solo la sección que va pegada al hero respira menos por arriba: el hero ya
   trae su propio aire. Antes esto dependía del modificador de cada sección
   (--services, --spaces, --news), y como no todas las páginas usan los mismos
   modificadores, la primera sección quedaba a 60 px en Inicio y a 90 px en
   Formación. Atado a la posición, sale igual en las tres. */
.c2-design-hero + .c2-design-section { padding-top: var(--c2-section-y-tight); }
.c2-design-section__head { margin-bottom: 30px; }
.c2-design-section__head h2 { font-size: clamp(1.7rem, 1.35rem + .8vw, 2.25rem); }
.c2-design-section__head p { font-size: .9375rem; }
.c2-design-section__link { font-size: .875rem; }
.c2-design-kicker { padding: 6px 11px; font-size: .75rem; }
.c2-design-tag { padding: 5px 9px; font-size: .75rem; }
.c2-design-btn {
	min-height: 44px;
	padding: 10px 19px;
	font-size: .875rem;
}
.c2-design-btn--small { min-height: 38px; padding: 8px 14px; font-size: .8125rem; }
.c2-design-actions { gap: 12px; margin-top: 22px; }
.c2-design-hero { min-height: 460px; }
.c2-design-hero--services { min-height: 420px; }
.c2-design-hero--training,
.c2-design-hero--home:has(.c2-design-hero__content--center) { min-height: 435px; }
.c2-design-hero__content { max-width: 610px; }
.c2-design-hero__content--center { max-width: 720px; }
.c2-design-hero h1,
.c2-design-hero--services h1,
.c2-design-hero__content--center h1 {
	font-size: clamp(2.5rem, 1.75rem + 2.6vw, 4rem);
	line-height: 1.06;
}
.c2-design-hero p { font-size: 1.0625rem; line-height: 1.6; }
.c2-design-hero--home .c2-design-search { max-width: 560px; margin-top: 32px; }
.c2-design-hero--home:has(.c2-design-hero__content--center) .c2-design-search {
	max-width: none;
	width: 100%;
	margin-top: 28px;
}
.c2-design-search { padding: 6px 7px 6px 16px; }
.c2-design-search input { padding: 10px 5px; font-size: .9375rem; }
.c2-design-chips { gap: 8px; margin-top: 14px; }
.c2-design-chips span,
.c2-design-chips a { padding: 6px 11px; font-size: .75rem; }
.c2-design-card__body { padding: 20px; gap: 11px; }
.c2-design-card h3 { font-size: 1.125rem; line-height: 1.25; }
.c2-design-card p { font-size: .9375rem; line-height: 1.5; }
.c2-design-card .c2-design-btn { width: auto; }
.c2-design-meta { gap: 12px; font-size: .8125rem; }
.c2-design-course-card__author { font-size: .8125rem !important; }
.c2-design-course-card__rating { font-size: .875rem; }
.c2-design-course-card__rating small { font-size: .75rem; }
.c2-design-course-card__footer { font-size: .75rem; }
.c2-design-course-card__footer strong { font-size: .8125rem; }
.c2-design-course-card__price { font-size: .875rem; }
.c2-design-course-card .c2-design-btn { width: 100%; }
.c2-design-image-band { min-height: 280px; }
.c2-design-image-band h2 { font-size: clamp(1.85rem, 1.4rem + 1.4vw, 2.5rem); }
.c2-design-image-band p { font-size: .9375rem; }
.c2-design-news { gap: 34px; }
.c2-design-news__body { padding-top: 20px; }
.c2-design-news__body h3 { font-size: 1.5rem; }
.c2-design-news__body p { font-size: .9375rem; }
.c2-design-news__item { grid-template-columns: 104px minmax(0, 1fr); gap: 14px; }
.c2-design-news__item h3 { font-size: .9375rem; }
.c2-design-news__item time { font-size: .75rem; }
.c2-design-newsletter { padding: 22px; }
.c2-design-newsletter strong { font-size: 1rem; }
.c2-design-newsletter p { font-size: .875rem; }
.c2-design-program-card__body { padding: 18px; }
.c2-design-program-card h3 { font-size: 1.0625rem; }
.c2-design-program-card p { font-size: .875rem; }
.c2-design-program-card__body > a { font-size: .8125rem; }
.c2-design-reservation { padding: var(--c2-section-y) 0; }
.c2-design-reservation .c2-container { gap: 64px; }
.c2-design-reservation__copy h2 { font-size: 2rem; }
.c2-design-reservation__copy p { font-size: .9375rem; }
.c2-design-reservation__copy li { padding: 13px; font-size: .8125rem; }
.c2-design-reservation__copy li strong { font-size: .875rem; }
.c2-design-reservation__form .c2-panel { padding: 28px; }
.c2-design-reservation__form .c2-panel > h2 { font-size: 1.25rem; }
.c2-design-reservation__form .c2-field label { font-size: .8125rem; }
.c2-design-reservation__form .c2-field input,
.c2-design-reservation__form .c2-field select,
.c2-design-reservation__form .c2-field textarea { padding: 11px 12px; font-size: .875rem; }
.c2-design-reservation__form .c2-btn { min-height: 44px; padding: 10px 16px; font-size: .8125rem; }
.c2-design-testimonials { padding: var(--c2-section-y) 0; }
.c2-design-testimonials h2 { font-size: 1.9rem; }
.c2-design-testimonials blockquote { padding: 24px; font-size: .9375rem; }
.c2-design-testimonials blockquote strong { font-size: 1rem; }
.c2-design-testimonials blockquote cite { font-size: .8125rem; }
.c2-design-testimonials blockquote p { font-size: .9375rem; }
.c2-design-classroom { padding: var(--c2-section-y) 0; }
.c2-design-classroom .c2-container { gap: 64px; }
.c2-design-classroom__copy h2 { font-size: 1.9rem; }
.c2-design-classroom__copy p { font-size: .9375rem; }
.c2-design-classroom__copy ul { font-size: .875rem; }
.c2-design-classroom__media > span { font-size: .6875rem; }
.c2-design-classroom__media > span strong { font-size: .875rem; }
.c2-design-resource { padding: 22px; }
.c2-design-resource strong { font-size: 1.125rem; }
.c2-design-resource p { font-size: .875rem; }
.c2-design-resource small { font-size: .75rem; }

/* Footer: cuerpo y enlaces del mismo tamaño que el resto del portal. */
.c2-footer { font-size: .875rem; }
.c2-footer__main { padding: 64px 0 48px; }
.c2-footer h2,
.c2-footer h3 { font-size: .9375rem; margin-bottom: 16px; }
.c2-footer li { margin-bottom: 10px; }
.c2-footer__about p,
.c2-footer__funding p { font-size: .875rem; line-height: 1.55; }
.c2-footer__institution { font-size: .8125rem; }
.c2-footer__funding { padding: 16px 0; }
.c2-footer__funding p { font-size: .8125rem; }
.c2-footer__bottom .c2-container { font-size: .75rem; }
.c2-footer__eu-flag { width: 34px; height: 23px; }

/* WPBakery/listados clásicos heredan el mismo aire y la misma jerarquía. */
.c2-listing {
	max-width: var(--c2-container);
	margin: 0 auto 8px;
	padding-left: var(--c2-gutter);
	padding-right: var(--c2-gutter);
	box-sizing: border-box;
}
/* Intro de sección (texto Movedo) → rejilla: un poco de aire debajo del
   párrafo, p. ej. «Espacios reservables» en /el-centro/instalaciones/. */
.grve-element.grve-text + .c2-listing {
	margin-top: 28px;
}
.wpb_wrapper > .c2-listing,
.wpb_column > .c2-listing {
	max-width: var(--c2-container);
}
.c2-listing > .c2-grid { max-width: none; padding-left: 0; padding-right: 0; }
.c2-listing .c2-grid { align-items: stretch; }
.c2-listing .c2-card,
.c2-listing .c2-event-card { height: 100%; }

@media (max-width: 1100px) {
	.c2-nav > ul > li > a { padding-left: 8px; padding-right: 8px; font-size: .8125rem; }
	.c2-header__actions { gap: 7px; }
	.c2-design-reservation .c2-container,
	.c2-design-classroom .c2-container { gap: 36px; }
}

@media (max-width: 850px) {
	.c2-topbar__inner { min-height: 36px; }
	.c2-topbar__links { gap: 12px; }
	.c2-design-hero { min-height: 410px; }
	.c2-design-hero--services { min-height: 390px; }
	.c2-design-hero--training,
	.c2-design-hero--home:has(.c2-design-hero__content--center) { min-height: 400px; }
}

@media (max-width: 600px) {
	.c2-topbar { font-size: .75rem; }
	.c2-topbar__links a:last-child { display: none; }
	.c2-topbar__identity { gap: 7px; }
	.c2-topbar__crest { width: 18px; height: 21px; }
	.c2-logo__mark { font-size: 1.4rem; }
	.c2-logo__town { font-size: .6875rem; }
	.c2-design-section { padding: 56px 0; }
	.c2-design-hero,
	.c2-design-hero--services,
	.c2-design-hero--training { min-height: 440px; }
	.c2-design-hero h1,
	.c2-design-hero--services h1,
	.c2-design-hero__content--center h1 { font-size: 2.35rem; }
	.c2-design-hero p { font-size: 1rem; }
	.c2-design-card__body { padding: 18px; }
	.c2-design-news__item { grid-template-columns: 88px minmax(0, 1fr); }
	.c2-event-card { padding: 20px; }
	.c2-footer__main { padding: 48px 0 36px; }
	.c2-footer__grid { gap: 30px 20px; }
	.c2-footer__funding .c2-container { align-items: flex-start; }
	.c2-footer__bottom .c2-container { gap: 8px; flex-direction: column; align-items: flex-start; }
}

/* =========================================================================
   26. LEGIBILIDAD DE NAVEGACIÓN Y ENLACES

   La escala de contenido ya está consolidada. Esta capa corrige la lectura
   de los elementos pequeños de interfaz: navegación, topbar y metadatos.

   No se pisa `--c2-cyan-500`: ese token es el turquesa del logo (#00A79D)
   y tiene que verse en botones, rellenos y acentos. El texto de enlace usa
   `--c2-link` porque #00A79D sobre blanco no llega al 4,5:1 de WCAG AA.
   ========================================================================= */
:root {
	--c2-link: #006B82;
}

.c2iet a:not([class]) {
	color: var(--c2-link);
	font-weight: 500;
}

.c2-topbar {
	font-size: .875rem;
}
.c2-topbar__identity {
	font-size: .875rem;
	font-weight: 600;
}
.c2-topbar__links a {
	color: #fff !important;
	font-size: .875rem;
	font-weight: 600 !important;
	letter-spacing: .005em;
}

.c2-nav > ul > li > a {
	padding-left: 12px;
	padding-right: 12px;
	font-size: .9375rem;
	font-weight: 700 !important;
	letter-spacing: .005em;
	color: var(--c2-design-ink) !important;
}
.c2-nav > ul > li.current-menu-item > a,
.c2-nav > ul > li.current-menu-ancestor > a,
.c2-nav > ul > li.current-page-ancestor > a {
	color: var(--c2-link) !important;
}
.c2-nav ul ul a {
	font-size: .9375rem;
	font-weight: 600;
	color: var(--c2-design-ink) !important;
}

.c2-footer a,
.c2-footer__legal a {
	color: #59627f !important;
	font-weight: 500;
}

/* Texto oscuro sobre amarillo: mantiene el carácter visual y recupera el
   contraste AA que no tenía el blanco sobre la etiqueta amarilla. */
.c2-design-kicker {
	color: var(--c2-design-ink);
}

.c2-design-search {
	box-sizing: border-box;
	width: 100%;
}

.c2-design-course-card__author,
.c2-design-course-card__rating small,
.c2-design-course-card__footer,
.c2-design-news__item time {
	color: var(--c2-design-muted) !important;
}

@media (max-width: 1100px) {
	.c2-nav > ul > li > a {
		padding-left: 9px;
		padding-right: 9px;
		font-size: .875rem;
		font-weight: 700 !important;
	}
}

@media (max-width: 600px) {
	.c2-topbar,
	.c2-topbar__links a {
		font-size: .8125rem;
	}
	.c2-topbar__links a:nth-child(2) {
		display: none;
	}
}

/* =========================================================================
   27. NAVEGACIÓN: HOVER, FOCO Y SUBMENÚ INSTITUCIONAL

   Estas reglas van al final porque la capa de legibilidad anterior fija
   colores del menú con !important. El fondo aporta una señal perceptible
   también para usuarios que no distinguen bien cambios de color.
   ========================================================================= */
.c2-nav > ul > li > a {
	border-radius: 0;
	transition: color .16s ease, background-color .16s ease, text-decoration-color .16s ease;
}
.c2-nav > ul > li > a:hover,
.c2-nav > ul > li > a:focus-visible {
	color: var(--c2-link) !important;
	background: var(--c2-cyan-050);
	text-decoration: underline;
	text-decoration-color: var(--c2-design-teal);
	text-decoration-thickness: 2px;
	text-underline-offset: 5px;
}
.c2-nav > ul > li.current-menu-item > a:hover,
.c2-nav > ul > li.current-menu-ancestor > a:hover,
.c2-nav > ul > li.current-page-ancestor > a:hover,
.c2-nav > ul > li.current-menu-item > a:focus-visible,
.c2-nav > ul > li.current-menu-ancestor > a:focus-visible,
.c2-nav > ul > li.current-page-ancestor > a:focus-visible {
	color: var(--c2-link) !important;
	background: var(--c2-cyan-050);
}

/* Chevron discreto para los elementos que WordPress marca como padres. */
.c2-nav > ul > li.menu-item-has-children > a {
	padding-right: 29px;
}
.c2-nav > ul > li.menu-item-has-children > a::before {
	content: "";
	position: absolute;
	top: 50%;
	right: 13px;
	width: 6px;
	height: 6px;
	margin-top: -4px;
	border-right: 1.5px solid currentColor;
	border-bottom: 1.5px solid currentColor;
	transform: rotate(45deg);
	transition: transform .16s ease, margin-top .16s ease;
}
.c2-nav > ul > li.menu-item-has-children:hover > a::before,
.c2-nav > ul > li.menu-item-has-children:focus-within > a::before {
	margin-top: -1px;
	transform: rotate(225deg);
}

/* Un dropdown institucional no debe parecer una tarjeta de contenido. */
.c2-nav ul ul {
	border-radius: 0;
	border-color: #dfe5f0;
	box-shadow: 0 8px 20px rgba(23, 32, 82, .12);
	padding: 6px;
}
.c2-nav ul ul a {
	border-radius: 0;
	transition: color .16s ease, background-color .16s ease;
}
.c2-nav ul ul a:hover,
.c2-nav ul ul a:focus-visible {
	color: var(--c2-link) !important;
	background: var(--c2-cyan-050);
	text-decoration: underline;
	text-decoration-color: var(--c2-design-teal);
	text-decoration-thickness: 2px;
	text-underline-offset: 3px;
}
.c2-nav ul ul .current-menu-item > a,
.c2-nav ul ul .current_page_item > a,
.c2-nav ul ul a[aria-current="page"] {
	color: var(--c2-link) !important;
	background: var(--c2-cyan-050);
	font-weight: 700;
	text-decoration: underline;
	text-decoration-color: var(--c2-design-teal);
	text-decoration-thickness: 2px;
	text-underline-offset: 3px;
}

.c2-mobile-nav a:hover,
.c2-mobile-nav a:focus-visible {
	color: var(--c2-link) !important;
	background: var(--c2-cyan-050);
	text-decoration: underline;
	text-decoration-color: var(--c2-design-teal);
	text-decoration-thickness: 2px;
	text-underline-offset: 4px;
}
.c2-mobile-nav .current-menu-item > a {
	color: var(--c2-link) !important;
}

@media (max-width: 1024px) {
	/* La navegación móvil no muestra el chevron de escritorio: sus niveles
	   ya están en el panel y el botón hamburguesa conserva todo su espacio. */
	.c2-nav > ul > li.menu-item-has-children > a::before {
		display: none;
	}
}

/* Identidad institucional local: proporciones naturales y agrupación estable. */
.c2-topbar__brand {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	min-width: 0;
	flex: none;
	color: #fff;
}
.c2-topbar__brand:hover,
.c2-topbar__brand:focus-visible {
	color: #fff;
}
.c2-topbar__brand img {
	display: block;
	width: 112px;
	height: auto;
	max-height: 46px;
	object-fit: contain;
	flex: none;
}
.c2-topbar__brand-name {
	padding-left: 10px;
	border-left: 1px solid rgba(255,255,255,.4);
	font-size: .875rem;
	font-weight: 700;
	letter-spacing: .02em;
	white-space: nowrap;
}
.c2-footer__brand {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 14px;
}
.c2-footer__municipal-logo {
	display: block;
	width: 154px;
	height: auto;
	max-height: 64px;
	object-fit: contain;
	flex: none;
}
.c2-footer__funding .c2-container {
	display: flex;
	align-items: center;
	gap: 16px;
}
.c2-footer__funding-brand {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 44px;
}
.c2-footer__eu-flag {
	display: block;
	width: 44px;
	height: 30px;
	max-width: 44px;
	object-fit: contain;
	flex: none;
}

@media (max-width: 850px) {
	.c2-topbar__brand img { width: 104px; max-height: 43px; }
	.c2-topbar__brand-name { font-size: .8125rem; }
	.c2-footer__brand { gap: 12px; }
	.c2-footer__municipal-logo { width: 142px; max-height: 58px; }
}

@media (max-width: 600px) {
	.c2-topbar__brand-name { display: none; }
	.c2-topbar__brand img { width: 104px; max-height: 43px; }
	.c2-footer__brand { align-items: flex-start; }
	.c2-footer__funding .c2-container {
		align-items: flex-start;
		gap: 12px;
	}
	.c2-footer__funding-brand { flex-basis: 38px; }
	.c2-footer__eu-flag { width: 38px; height: 26px; max-width: 38px; }
}

.c2-footer__funding {
	background: #fff;
	padding: 14px 0;
}
.c2-footer__funding .c2-container {
	display: block;
}
.c2-footer__funding .c2-container,
.c2-footer-row--funding .wpb_wrapper,
.c2-footer-row--funding p {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}
.c2-footer__funding-logos,
.c2-footer-row--funding img {
	display: block;
	width: auto !important;
	max-width: none !important;
	height: 64px !important;
	max-height: none !important;
	margin: 0;
}

/* La topbar prioriza contacto rápido; la identificación institucional queda
   en el footer, donde dispone de más espacio y no compite con la navegación. */
.c2-topbar__contact {
	display: flex;
	align-items: center;
	gap: 20px;
	min-width: 0;
}
.c2-topbar__contact-item {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	min-height: 24px;
	color: #fff !important;
	font-size: .875rem;
	font-weight: 600;
	white-space: nowrap;
}
.c2-topbar__contact-item svg {
	flex: none;
	opacity: .9;
}
.c2-topbar__contact a:hover,
.c2-topbar__contact a:focus-visible {
	color: #fff !important;
	text-decoration: underline;
	text-decoration-thickness: 2px;
	text-underline-offset: 3px;
}

@media (max-width: 850px) {
	.c2-topbar__contact {
		gap: 14px;
	}
	.c2-topbar__contact-item {
		font-size: .8125rem;
	}
	.c2-topbar__contact-item--address,
	.c2-topbar__contact-item--directions {
		display: none;
	}
}

/* La derecha de la topbar es acceso de usuario, no navegación institucional. */
.c2-topbar__links {
	align-items: center;
	gap: 18px;
}
/* `baseline` alineaba «Área privada:» y el nombre de usuario por su línea
   base, pero el resto de elementos de la topbar usa `center`: con dos pesos
   y tamaños distintos dentro del enlace, el bloque quedaba descolgado
   respecto a «Cerrar sesión» y «Aula Virtual». */
.c2-topbar__links .c2-topbar__account {
	display: inline-flex;
	align-items: center;
	gap: 6px;
}
.c2-topbar__links .c2-topbar__account-name {
	font-weight: 700;
}
.c2-topbar__links .c2-topbar__logout {
	font-weight: 600;
}
.c2-topbar__links .c2-topbar__moodle {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-weight: 600;
}
.c2-topbar__links .c2-topbar__moodle svg {
	flex: none;
}

@media (max-width: 600px) {
	.c2-topbar__contact { display: none; }
	.c2-topbar__inner {
		min-height: 48px;
		justify-content: flex-end;
	}
	.c2-topbar__links {
		width: 100%;
		justify-content: flex-end;
		gap: 4px;
	}
	.c2-topbar__links .c2-topbar__account-name {
		display: none;
	}
	.c2-topbar__links a.c2-topbar__account,
	.c2-topbar__links a.c2-topbar__logout {
		display: inline-flex;
		align-items: center;
		min-height: 44px;
		padding: 0 10px;
		box-sizing: border-box;
		font-size: .9375rem;
	}
	.c2-topbar__links .c2-topbar__moodle {
		display: none;
	}
}

.c2-mobile-nav__contact {
	margin: 0;
	padding: 8px var(--c2-gutter) 0;
}
.c2-mobile-nav__contact a {
	display: flex;
	align-items: center;
	min-height: 44px;
}

/* La regla base `.c2-nav ul ul` es más específica que el selector histórico
   de apertura; igualamos la especificidad para que hover y teclado funcionen. */
.c2-nav > ul > li:hover > ul,
.c2-nav > ul > li:focus-within > ul {
	opacity: 1 !important;
	visibility: visible !important;
	transform: translateY(0) !important;
}

/* =========================================================================
   29. RETÍCULA Y RITMO COMUNES DE CABECERAS

   Las páginas estándar y las composiciones WPBakery deben compartir la
   misma columna y un espacio vertical reconocible. El ensanchado del gutter
   en tablet vive ahora en `inc/movedo-bridge.php`, junto al resto de la
   métrica, para no tener la retícula repartida entre dos sitios.
   ========================================================================= */
.c2-page-header,
.c2-section-head,
.c2-listing,
.c2-booking {
	box-sizing: border-box;
}

.c2-design-hero .c2-container {
	padding-top: var(--c2-section-y-tight);
	padding-bottom: var(--c2-section-y-tight);
}
.c2-design-section__head {
	margin-bottom: 32px;
}

/* El menú principal usa una sola señal de estado:
   fondo para hover/foco y línea inferior para la sección activa. */
.c2-nav > ul > li > a:hover,
.c2-nav > ul > li > a:focus-visible,
.c2-nav > ul > li.current-menu-item > a:hover,
.c2-nav > ul > li.current-menu-ancestor > a:hover,
.c2-nav > ul > li.current-page-ancestor > a:hover,
.c2-nav > ul > li.current-menu-item > a:focus-visible,
.c2-nav > ul > li.current-menu-ancestor > a:focus-visible,
.c2-nav > ul > li.current-page-ancestor > a:focus-visible {
	text-decoration: none;
}
.c2-nav > ul > li.current-menu-item > a:hover,
.c2-nav > ul > li.current-menu-ancestor > a:hover,
.c2-nav > ul > li.current-page-ancestor > a:hover,
.c2-nav > ul > li.current-menu-item > a:focus-visible,
.c2-nav > ul > li.current-menu-ancestor > a:focus-visible,
.c2-nav > ul > li.current-page-ancestor > a:focus-visible {
	background: transparent;
}


/* =========================================================================
   30. CABECERA DE PÁGINA UNIFICADA

   Un único componente para la apertura de toda página interior: migas,
   título y entradilla dentro de la misma banda y el mismo contenedor.

   Sustituye a `.c2-page__chrome` + `.c2-page-intro`, que eran dos bloques
   independientes y opcionales: las migas iban en un contenedor suelto por
   encima de la banda y la entradilla se insertaba a mano en el contenido con
   un shortcode. De ahí venía que el `<h1>` cayera a distinta altura en cada
   página (60, 68, 98 o 133 px) y que las migas aparecieran o no sin regla.

   Qué se pinta lo decide `inc/page-header.php` leyendo el panel; esta hoja
   solo se ocupa del aspecto.
   ========================================================================= */
.c2-page-header {
	position: relative;
	width: 100%;
	border-bottom: 1px solid var(--c2-design-line);
	background: linear-gradient(112deg, #E6F8F7 0%, #F4FBFA 64%, #ffffff 100%);
	overflow: hidden;
}

.c2-page-header__inner {
	position: relative;
	padding-top: var(--c2-section-y-tight);
	padding-bottom: var(--c2-section-y-tight);
	isolation: isolate;
}

/* Solo migas (páginas que abren con hero): tira sobria, sin fondo ni trama. */
.c2-page-header--bare {
	border-bottom: 0;
	background: none;
}
.c2-page-header--bare .c2-page-header__inner {
	padding-top: 18px;
	padding-bottom: 18px;
}
.c2-page-header--bare .c2-page-header__inner::after { display: none; }
.c2-page-header--bare .c2-breadcrumbs { margin-bottom: 0; }

/* Trama decorativa. Va detrás del texto y nunca captura el puntero. */
.c2-page-header__inner::after {
	content: "";
	position: absolute;
	top: 50%;
	right: calc(var(--c2-gutter) * -1);
	width: 260px;
	height: 260px;
	transform: translateY(-50%);
	background-image: radial-gradient(rgba(0, 167, 157, .28) 1.4px, transparent 1.4px);
	background-size: 14px 14px;
	opacity: .5;
	pointer-events: none;
	z-index: -1;
}

/* Las migas abren la banda, sin caja propia ni separación extra: son parte
   de la cabecera, no un bloque suelto encima de ella. */
.c2-page-header .c2-breadcrumbs {
	position: relative;
	z-index: 1;
	margin: 0 0 18px;
}

.c2-page-header__title {
	position: relative;
	z-index: 1;
	max-width: 24ch;
	margin: 0;
	color: var(--c2-design-ink);
	font-size: clamp(2.15rem, 1.55rem + 1.8vw, 3.25rem);
	line-height: 1.08;
	letter-spacing: -.035em;
}

.c2-page-header__text {
	position: relative;
	z-index: 1;
	max-width: 62ch;
	margin: 18px 0 0;
	color: var(--c2-design-muted);
	font-size: 1.125rem;
	line-height: 1.6;
}

@media (max-width: 767px) {
	.c2-page-header .c2-breadcrumbs { margin-bottom: 14px; }
	.c2-page-header__title { font-size: clamp(2rem, 1.65rem + 1.8vw, 2.35rem); }
	.c2-page-header__text { margin-top: 14px; font-size: 1rem; }
	.c2-page-header__inner::after { display: none; }
}

/* Avisos de sesión/formulario servidos desde `<main>`. */
.c2-notices {
	padding-top: 24px;
}

/* =========================================================================
   31. ÁREA TÁCTIL DE ENLACES DE NAVEGACIÓN

   WCAG 2.5.8 (Tamaño del objetivo, AA en WCAG 2.2) pide 24×24 px CSS como
   mínimo, y exime los enlaces embebidos en un párrafo. Los de aquí no están
   exentos: son listas de navegación (pie, mapa del sitio, topbar) y enlaces
   de acción de las tarjetas, que se medían entre 17 y 22 px de alto.

   Se resuelve con relleno vertical en vez de agrandando la letra, para no
   alterar la escala tipográfica ya consolidada.
   ========================================================================= */
.c2-footer__grid a,
.c2-sitemap__list a,
.c2-topbar__account,
.c2-topbar__logout,
.c2-topbar__moodle,
.c2-small > a:only-child {
	display: inline-flex;
	align-items: center;
	min-height: 24px;
}

/* Enlaces de acción de tarjetas y cabeceras de sección. Necesitan también
   `inline-flex`: sobre un elemento `inline`, `min-height` no hace nada. */
.c2-design-section__link,
.c2-design-card__body > a,
.c2-design-program-card__body > a,
.c2-link-arrow {
	display: inline-flex;
	align-items: center;
	min-height: 24px;
}

/* Títulos de tarjeta enlazados: el alto lo daba el interlineado del h3 y se
   quedaban en 22 px. Un relleno mínimo los lleva a 24 sin tocar la escala
   tipográfica ni descuadrar la tarjeta. */
.c2-design-card__body h3 a,
.c2-card__head h3 a {
	display: inline-block;
	padding-block: 1px;
}

/* En móvil se separan un poco más entre sí: con objetivos contiguos de 24 px
   el margen de error al tocar es escaso. */
@media (max-width: 767px) {
	.c2-footer__grid li,
	.c2-sitemap__list li {
		margin-bottom: 10px;
	}
	.c2-footer__grid a,
	.c2-sitemap__list a {
		min-height: 28px;
	}
}

/* =========================================================================
   32. UN SOLO CONTENEDOR

   La cabecera, la banda de título y el pie usan `.c2-container`
   (`max-width` + gutter). Las filas de WPBakery usan `.grve-container`, que
   Movedo resuelve con `width: 90%`. Las dos fórmulas solo coinciden por
   encima de ~1378 px; por debajo, el contenido de las filas se desplazaba
   respecto al del resto del portal —6 px a 1293 px de ancho—, y se notaba
   porque el texto no arrancaba en la misma vertical que el logo, las migas
   y el titular.

   Aquí se iguala `.grve-container` a la misma regla que `.c2-container`.
   ========================================================================= */
.grve-container {
	width: 100%;
	max-width: var(--c2-container);
	margin-left: auto;
	margin-right: auto;
	padding-left: var(--c2-gutter);
	padding-right: var(--c2-gutter);
	box-sizing: border-box;
}

/* Las filas a sangre completa no llevan gutter: su contenido ya trae su
   propio `.c2-container` (heroes y bandas), y añadirlo aquí lo sangraría
   dos veces. Movedo ya fuerza su anchura con `!important`. */
.grve-fullwidth .grve-container {
	padding-left: 0;
	padding-right: 0;
}

/* Por debajo de 960 px la igualación de arriba no llegaba a aplicarse: Movedo
   pone ahí `.grve-container { max-width: 90% !important }`, y con `!important`
   gana. El resultado era una caja centrada al 90 % a la que este apartado le
   sumaba además su gutter, así que el contenido de las filas se metía hacia
   dentro respecto al resto del portal —medido contra el borde de la cabecera:
   +45 px a 900, +38 a 768, +20 a 390, +16 a 320— mientras la cabecera, las migas
   y el pie seguían en su sitio. Se veía como un escalón entre una sección y la
   siguiente.

   Mismo valor que arriba, repetido con `!important` solo para poder ganarle a
   esa regla. Las filas a sangre completa no se ven afectadas: Movedo las fuerza
   al 100 % desde `.grve-fullwidth .grve-container`, que tiene más
   especificidad que esto. */
@media only screen and (max-width: 959px) {
	.grve-container {
		max-width: var(--c2-container) !important;
	}
}

/* =========================================================================
   33. AVISO DE COOKIES

   Ajustes sobre GDPR Cookie Compliance para que el aviso no parezca un
   añadido de terceros. El plugin ya se configura desde su panel
   (`scripts/seed/12-cookies-rgpd.php`); aquí solo va lo que sus opciones no
   cubren.
   ========================================================================= */

/* El plugin cae a un cartel «GDPR» propio cuando no hay logo configurado y
   no ofrece ninguna opción para quitarlo. En un portal institucional sobra. */
.moove-gdpr-company-logo-holder {
	display: none !important;
}

/* Tipografía del portal en lugar de la del plugin. */
#moove_gdpr_cookie_info_bar,
#moove_gdpr_cookie_modal {
	font-family: var(--c2-font) !important;
}

#moove_gdpr_cookie_info_bar .moove-gdpr-info-bar-container {
	max-width: var(--c2-container);
	padding-left: var(--c2-gutter);
	padding-right: var(--c2-gutter);
	box-sizing: border-box;
}

/* =========================================================================
   34. MIGAS DENTRO DEL HERO

   En las páginas que abren con hero (Servicios, Formación) las migas se
   pintan sobre la imagen, no en una tira blanca encima. Antes quedaba una
   franja suelta de unos 66 px entre la cabecera y el hero que no pertenecía
   a ninguno de los dos y se leía como un hueco.

   Sobre foto oscura hacen falta colores propios: los de la versión clara no
   tendrían contraste suficiente.
   ========================================================================= */
.c2-design-hero__breadcrumbs {
	position: relative;
	z-index: 2;
	padding-top: 22px;
}

.c2-design-hero__breadcrumbs .c2-breadcrumbs {
	margin-bottom: 0;
	color: rgba(255, 255, 255, .82);
}
.c2-design-hero__breadcrumbs .c2-breadcrumbs a {
	color: rgba(255, 255, 255, .82);
}
.c2-design-hero__breadcrumbs .c2-breadcrumbs a:hover,
.c2-design-hero__breadcrumbs .c2-breadcrumbs a:focus-visible {
	color: #fff;
	border-bottom-color: currentColor;
}
.c2-design-hero__breadcrumbs .c2-breadcrumbs li + li::before {
	color: rgba(255, 255, 255, .55);
}
.c2-design-hero__breadcrumbs .c2-breadcrumbs [aria-current="page"] {
	color: #fff;
	font-weight: 600;
}

/* El hero centrado (Formación) alinea también sus migas al centro. */
.c2-design-hero:has(.c2-design-hero__content--center) .c2-design-hero__breadcrumbs .c2-breadcrumbs ol {
	justify-content: center;
}

/* Con las migas dentro, el contenido del hero necesita algo menos de aire
   por arriba para que el conjunto no crezca. */
.c2-design-hero__breadcrumbs + .c2-design-hero__content {
	padding-top: 8px;
}

/* =========================================================================
   35. BOTONES DENTRO DE WIDGETS

   Movedo colorea todos los enlaces de un widget con
   `.widget a:not(.grve-outline):not(.grve-btn)` — excluye sus propias clases
   de botón, pero no las del C2IET. Como esa regla tiene más especificidad que
   `.c2-btn--primary`, nuestros botones heredaban el color de enlace: en el
   sidebar de las noticias, «Contacta con el centro» salía en azul tinta sobre
   su fondo teal, con un contraste de 1,65:1 (AA pide 4,5:1).

   Se iguala la especificidad encadenando `.c2-btn` con su variante; esta hoja
   carga después que la de Movedo, así que gana el empate.
   ========================================================================= */
.widget a.c2-btn.c2-btn--primary,
.widget a.c2-btn.c2-btn--navy {
	color: #fff;
}
.widget a.c2-btn.c2-btn--outline {
	color: var(--c2-navy-800);
}
.widget a.c2-btn.c2-btn--outline:hover {
	color: var(--c2-cyan-600);
}

/* =========================================================================
   36. PANTALLAS EDITORIALES Y DE SISTEMA
   (ficha de noticia, archivos de categoría/etiqueta/fecha/autor,
   resultados de búsqueda y 404)

   Añadido en la revisión del 2026-08-13. Todo lo de esta sección es
   exclusivo de esas pantallas; no toca ninguna regla anterior.
   ========================================================================= */

/* --- Buscador ------------------------------------------------------------
   `.c2-searchform` solo tenía ancho máximo: el campo y el botón se apilaban
   sin separación y el botón quedaba en 42 px sueltos bajo un campo de 47.
   Ahora es una fila con las dos piezas a la misma altura. */
.c2-searchform {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	align-items: stretch;
}
.c2-searchform input[type="search"] {
	flex: 1 1 14rem;
	min-width: 0;
	min-height: 48px;
}
.c2-searchform .c2-btn {
	flex: none;
	min-height: 48px;
	padding-left: 24px;
	padding-right: 24px;
}
/* El campo se quedaba sin el contorno de foco del portal: `.c2iet input:focus`
   lleva `outline: none` y, al empatar en especificidad con la regla general de
   `:focus-visible`, gana por ir después en la hoja. Quedaba solo el halo
   (#EAF7FB, 1,09:1 sobre blanco), que apenas se ve. Se repone igualando
   especificidad, sin `!important` y sin tocar el resto de formularios. */
.c2iet .c2-searchform input[type="search"]:focus-visible {
	outline: 3px solid var(--c2-link);
	outline-offset: 2px;
}

/* Página de resultados (`search.php`): mismo buscador que la home. */
.c2-page--search {
	padding-top: 28px;
	padding-bottom: 64px;
}
.c2-search-page__form {
	max-width: 720px;
	margin: 0 auto 36px;
}
.c2-search-page__form .c2-design-search {
	width: 100%;
	max-width: none;
}

.c2-search-filters {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 28px;
}
.c2-search-filters__chip {
	display: inline-flex;
	align-items: center;
	min-height: 36px;
	padding: 6px 14px;
	border: 1px solid rgba(23, 32, 82, .16);
	border-radius: var(--c2-radius-pill);
	background: #fff;
	color: var(--c2-design-ink);
	font-size: .8125rem;
	font-weight: 700;
	text-decoration: none;
	transition: background .15s ease, border-color .15s ease, color .15s ease;
}
.c2-search-filters__chip:hover,
.c2-search-filters__chip:focus-visible {
	border-color: var(--c2-design-teal);
	color: var(--c2-design-teal-dark);
}
.c2-search-filters__chip.is-active {
	border-color: var(--c2-design-teal);
	background: var(--c2-design-teal);
	color: #fff;
}

.c2-search-group + .c2-search-group {
	margin-top: 40px;
}
.c2-search-group__head {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: 8px 16px;
	margin-bottom: 18px;
}
.c2-search-group__head h2 {
	margin: 0;
	font-size: clamp(1.25rem, 1.1rem + .5vw, 1.5rem);
}
.c2-search-group__count {
	color: var(--c2-design-muted);
	font-size: .875rem;
}

.c2-search-hits {
	display: grid;
	gap: 14px;
}
.c2-search-hit {
	display: grid;
	gap: 8px;
	padding: 18px 20px;
	border: 1px solid rgba(23, 32, 82, .1);
	border-radius: 12px;
	background: #fff;
}
.c2-search-hit__type {
	display: inline-flex;
	width: fit-content;
	padding: 3px 8px;
	border-radius: 4px;
	background: rgba(0, 167, 157, .12);
	color: var(--c2-design-teal-dark);
	font-size: .6875rem;
	font-weight: 800;
	letter-spacing: .04em;
	text-transform: uppercase;
}
.c2-search-hit__title {
	margin: 0;
	font-size: 1.125rem;
	line-height: 1.3;
}
.c2-search-hit__title a {
	color: inherit;
	text-decoration: none;
}
.c2-search-hit__title a:hover,
.c2-search-hit__title a:focus-visible {
	color: var(--c2-design-teal-dark);
}
.c2-search-hit__excerpt {
	margin: 0;
	color: var(--c2-design-muted);
	font-size: .9375rem;
	line-height: 1.5;
}

/* Antesala de la búsqueda sin término: es un rótulo de sección, no un estado
   vacío, así que no lleva la caja gris de `.c2-empty`. */
.c2-search-intro { margin: 8px 0 24px; }
.c2-search-intro h2 { margin: 0 0 6px; }
.c2-search-intro p { margin: 0; color: var(--c2-design-muted); }

/* --- Archivos editoriales ------------------------------------------------ */
.c2-archive { padding-top: 40px; }
.c2-archive .c2-pagination { margin-top: 40px; }

/* Sin widgets configurados el archivo no debe dejar una columna vacía. */
.c2-layout--solo { grid-template-columns: minmax(0, 1fr); }

/* --- Navegación entre noticias ------------------------------------------ */
.c2-post-nav {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 16px;
	margin-top: 40px;
	padding-top: 28px;
	border-top: 1px solid var(--c2-design-line);
}
.c2-post-nav__item {
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding: 16px 18px;
	border: 1px solid var(--c2-design-line);
	border-radius: var(--c2-radius-lg);
	background: var(--c2-white);
	color: var(--c2-design-ink);
	text-decoration: none;
}
.c2-post-nav__item--next {
	grid-column: 2;
	text-align: right;
}
.c2-post-nav__item:hover {
	border-color: var(--c2-design-teal);
}
.c2-post-nav__label {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	color: var(--c2-design-muted);
	font-size: .8125rem;
	font-weight: 600;
	letter-spacing: .04em;
	text-transform: uppercase;
}
.c2-post-nav__item--next .c2-post-nav__label { justify-content: flex-end; }
.c2-post-nav__title {
	font-weight: 700;
	line-height: 1.35;
}
.c2-post-nav__item:hover .c2-post-nav__title { color: var(--c2-design-teal-dark); }

@media (max-width: 680px) {
	.c2-post-nav { grid-template-columns: minmax(0, 1fr); }
	.c2-post-nav__item--next {
		grid-column: 1;
		text-align: left;
	}
	.c2-post-nav__item--next .c2-post-nav__label { justify-content: flex-start; }
}

/* --- 404 ----------------------------------------------------------------- */
.c2-404 {
	max-width: 40rem;
	margin: 0 auto;
	padding: 40px 0 8px;
	text-align: center;
}
.c2-404 .c2-empty__code { margin-bottom: 4px; }
.c2-404 h2 { margin: 0 0 8px; }
.c2-404 > p { color: var(--c2-design-muted); }
.c2-404 .c2-searchform {
	justify-content: center;
	margin: 24px 0 20px;
}

/* --- Objetivos táctiles del sidebar editorial ---------------------------
   Los enlaces de los widgets de temas y de actualidad reciente medían 20 px
   de alto (WCAG 2.5.8 pide 24). Se resuelve con caja mínima, sin tocar la
   escala tipográfica. */
.c2-blog-sidebar .widget li > a {
	display: inline-flex;
	align-items: center;
	min-height: 24px;
}
.c2-blog-sidebar .widget_recent_entries li > a { display: block; }
.c2-blog-sidebar .widget_recent_entries li { padding-top: 13px; padding-bottom: 13px; }

/* =========================================================================
   36. SECCIÓN DE EVENTOS: RETÍCULA DENTRO DE WPBAKERY Y CHIPS DE FILTRO

   Añadido al unificar la sección de eventos con el resto del portal
   (2026-08-13). Toca dos cosas: el gutter duplicado cuando un componente del
   C2IET vive dentro de una fila de WPBakery, y los chips de filtro de la
   agenda.
   ========================================================================= */

/* Gutter duplicado.

   Los componentes del portal abren su propio contenedor (`.c2-container`, o
   `.c2-listing` en los listados) porque también se usan fuera de WPBakery
   —fichas, cabeceras, plantillas—. Dentro de una fila normal de WPBakery el
   ancho máximo y el gutter los pone ya `.grve-container`, así que el
   contenedor interno los sumaba por segunda vez: medido a 1440 px, el
   contenido de Agenda y Espacios arrancaba en x=164 y el de Actualidad
   también, mientras el `<h1>` de la banda de cabecera y las filas a sangre
   completa (Inicio, Servicios, Formación) arrancan en x=132. Es decir, la
   mitad del portal iba 32 px por dentro de su propio titular.

   La condición no puede ser «tener un `.grve-container` por encima»: las filas
   a sangre completa también lo pintan, solo que anulado —`width` y `max-width`
   al 100 % con `!important` (`movedo/css/theme-style.css`), y sin gutter por la
   regla del apartado 32 de aquí mismo—. Con esa condición el hero de portada, el
   de Servicios, el de Formación y las tres bandas que los acompañan perdían su
   contenedor y arrancaban en x=0, contra el borde de la ventana, mientras la
   cabecera seguía en x=132 (regresión vista en producción, 2026-08-13).

   El criterio bueno es el que usa el propio Movedo para decidir si su contenedor
   ciñe o no: la clase `.grve-fullwidth` de la fila. Si la fila es normal, el
   gutter lo pone `.grve-container` y el contenedor del componente sobra; si es a
   sangre completa, `.grve-container` es un pasamanos sin ancho ni gutter y el
   contenedor del componente es el único que ciñe el contenido. Es además la
   misma condición del apartado 32, en espejo: allí se le quita el gutter al
   contenedor de fuera, aquí al de dentro, y nunca a los dos a la vez. */
.grve-section:not(.grve-fullwidth) > .grve-container .c2-container,
.grve-section:not(.grve-fullwidth) > .grve-container .c2-listing {
	max-width: none;
	padding-left: 0;
	padding-right: 0;
}

/* Debajo de 768 px Movedo le mete 15 px de padding lateral a las columnas de las
   filas a sangre completa —`.grve-fullwidth .grve-row:not(.grve-columns-gap-none)
   .grve-column`, en su propia media query—, que es su sustituto del gutter cuando
   una fila así no tiene contenedor. Aquí sobra por partida doble: la banda deja de
   sangrar (se veía el hero de portada como un rectángulo con dos franjas blancas a
   los lados, mientras la barra superior sí llegaba al borde) y su contenido se
   sumaba a los 15 px, arrancando en x=35 con la cabecera en x=20.

   Defecto anterior a la regresión de contenedores —se mide igual antes y después—,
   pero es el mismo desajuste de banda contra cabecera y se corrige aquí.

   Acotado a las columnas que llevan dentro un componente del portal: ese ya trae su
   propio gutter. Una fila a sangre completa con contenido de WPBakery a pelo
   seguiría necesitando el de Movedo. */
@media only screen and (max-width: 767px) {
	.grve-fullwidth .grve-row .grve-column:has(.c2-container) {
		padding-left: 0;
		padding-right: 0;
	}
}

/* En escritorio el hueco de columnas (`grve-columns-gap-30`) deja el mismo
   escalón aunque la fila sea `.grve-fullwidth`: 15 px en la fila + 15 px en
   la columna. Las páginas nuevas de El Centro se publicaron sin
   `columns_gap="0"` y el hero no llegaba al borde (medido: x=30 / 869 px
   frente a un viewport de 944). El texto ya se ciñe con `.c2-container`. */
.grve-fullwidth .grve-row:has(.c2-design-hero),
.grve-fullwidth .grve-column:has(.c2-design-hero) {
	padding-left: 0 !important;
	padding-right: 0 !important;
}

/* Esquema de distribución del edificio (Instalaciones, Espacios, Servicios). */
.grve-image.c2-floorplan,
.c2-floorplan {
	margin-top: 8px;
}
.grve-image.c2-floorplan img,
.c2-floorplan img {
	width: 100%;
	height: auto;
	border-radius: 12px;
}

/* Chips de filtro (vista y categorías de la agenda).

   Eran amarillos en reposo y teal al estar activos, así que el par
   «Listado»/«Calendario» se leía como dos controles distintos en lugar de
   como una elección entre dos. Pasan al mismo patrón que ya usa la paginación
   del portal para exactamente la misma semántica —un elemento seleccionado
   dentro de un conjunto—: superficie blanca con borde, y relleno de marca solo
   en el seleccionado. Así la diferencia no es solo de color, sino de relleno.

   El amarillo se reserva para las etiquetas de categoría de las tarjetas,
   donde sí es una marca y no un control. */
.c2-chip {
	background: var(--c2-white);
	border: 1px solid var(--c2-border);
	color: var(--c2-navy-800);
}
.c2-chip:hover {
	background: var(--c2-cyan-050);
	border-color: var(--c2-cyan-500);
	color: var(--c2-cyan-600);
}
.c2-chip.is-active,
.c2-chip[aria-current] {
	background: var(--c2-cyan-500);
	border-color: var(--c2-cyan-500);
	color: #fff;
}
.c2-chip.is-active:hover,
.c2-chip[aria-current]:hover {
	background: var(--c2-cyan-600);
	border-color: var(--c2-cyan-600);
	color: #fff;
}

/* El selector de vista es un grupo de dos: se pega para que se lea como un
   único control segmentado y no como dos chips sueltos entre los filtros. */
.c2-agenda-layout__views { gap: 0; }
.c2-agenda-layout__views .c2-chip { border-radius: 0; }
.c2-agenda-layout__views .c2-chip:first-child {
	border-radius: 9px 0 0 9px;
}
.c2-agenda-layout__views .c2-chip:last-child {
	border-radius: 0 9px 9px 0;
	margin-left: -1px;
}
.c2-agenda-layout__views .c2-chip.is-active { position: relative; z-index: 1; }

/* Los tres controles de la barra comparten alto: el chip medía 46 px y el
   botón 42, y la línea quedaba desalineada. */
.c2-agenda-layout .c2-filterbar .c2-chip,
.c2-agenda-layout .c2-filterbar > .c2-btn { min-height: 46px; }

/* =========================================================================
   37. RESERVA DE ESPACIOS Y AVISOS

   Doble encuadre del panel «Solicita tu reserva». En `/espacios/` el panel
   salía con dos marcos concéntricos separados unos 20 px: el `aside.c2-booking`
   pintaba tarjeta (fondo, borde de 1 px, radio de 16 px, relleno de 22 px y
   sombra) y dentro el formulario volvía a pintarla con `.c2-panel`. Medido a
   1440 px: caja exterior en x=936 y caja interior en x=959.

   La tarjeta se la queda `.c2-panel`, que es la unidad visual que ya usan la
   ficha de espacio, la de curso y el sidebar de Actualidad: así el panel de
   reserva pesa lo mismo que las tarjetas de espacio que tiene al lado. El
   `aside` se queda solo con la posición (ver la regla de `.c2-layout--spaces`
   en la sección 22). La variante de portada resolvía esto mismo apagando el
   borde del panel (`.c2-design-reservation__form .c2-panel`), pero esa regla
   no alcanza a `/espacios/`.

   Con el `aside` ya sin relleno propio, ambos elementos son la misma caja y
   sobra que los dos se declaren pegajosos: el offset lo fija el `aside`.
   (Anotado de paso: hoy ninguno de los dos llega a pegarse, porque el `body`
   lleva `overflow-x: hidden` y eso convierte al documento en contenedor de
   scroll. Es previo a este cambio y afecta a todos los `.c2-panel--sticky`
   del portal, así que no se toca aquí.)
   ========================================================================= */
.c2-layout--spaces .c2-panel--sticky {
	position: static;
}

/* Listado de la agenda: una tarjeta por línea (ver el comentario del
   shortcode). */
.c2-agenda-layout__grid { grid-template-columns: minmax(0, 1fr); }

/* En la vista de calendario la agenda no pinta lateral, y `.c2-layout` seguía
   reservando sus 380 px: la columna de contenido se quedaba corta y a la
   derecha había un hueco vacío.

   Acotado a la agenda a propósito: el lateral de Espacios no es un
   `.c2-layout__aside` sino un `aside.c2-booking`, así que una regla genérica
   por ausencia de `.c2-layout__aside` le tiraba abajo el panel de reserva. */
.c2-agenda-layout .c2-layout:not(:has(> .c2-layout__aside)) {
	grid-template-columns: minmax(0, 1fr);
}

/* Sin lateral, el calendario del mes se estiraba a los 1.176 px de la columna:
   celdas que solo llevan un número dentro de una rejilla enorme y vacía. */
.c2-agenda-layout__calendar-shell { max-width: 46rem; }

/* =========================================================================
   38. FICHAS DE CONTENIDO Y FOCO DE FORMULARIOS

   Dos cosas que van juntas por ser el cierre de la unificación de pantallas:
   el aire de las fichas que acaban de pasar a la banda común, y el contorno
   de foco de los campos, que hasta ahora solo se había repuesto en el
   buscador.
   ========================================================================= */

/* Servicio, espacio, curso y reserva de espacio abren ya con la banda a ancho
   completo, así que el cuerpo necesita su propio aire por arriba: antes ese
   aire lo daban las migas, que ahora están dentro de la banda. Es la misma
   corrección que necesitó la ficha de evento (ver `.c2-single--evento` en la
   sección 21). */
.c2-single--servicio,
.c2-single--espacio,
.c2-single--curso,
.c2-single--coworking {
	padding-top: var(--c2-section-y-tight);
}
.c2-single--servicio .c2-single__header,
.c2-single--espacio .c2-single__header,
.c2-single--curso .c2-single__header,
.c2-single--coworking .c2-single__header {
	padding-top: 0;
}

/* Contorno de foco en todos los campos del portal —contacto, registro,
   acceso, recuperación, perfil y reserva—, no solo en el buscador.

   `.c2iet input:focus` (sección 12) lleva `outline: none` y empata en
   especificidad con la regla general de `:focus-visible` (sección 2), así que
   ganaba por ir después en la hoja: al tabular por un campo solo quedaba el
   halo #EAF7FB, 1,09:1 sobre blanco, invisible en la práctica (WCAG 2.4.7).
   Se repone igualando especificidad y colocando la regla al final de la hoja,
   sin `!important`.

   El radio se declara aquí porque la regla general lo fija en 4 px para
   cualquier elemento enfocado, y en un campo de 10 px el contorno se dibujaba
   con las esquinas más cerradas que el propio campo. */
.c2iet input:focus-visible,
.c2iet select:focus-visible,
.c2iet textarea:focus-visible {
	outline: 3px solid var(--c2-link);
	outline-offset: 2px;
	border-radius: 10px;
}

/* =========================================================================
   39. CALENDARIO INTERACTIVO DE LA AGENDA

   El minicalendario de `/agenda-y-eventos/` pintaba el mes y se acababa ahí.
   Ahora navega de mes y filtra por día, así que cada celda es un enlace y
   necesita área táctil, estado y una marca que no dependa del color.

   Tres marcas, tres formas distintas, para no fiarlo todo al tono (WCAG 1.4.1):

   - hoy               contorno
   - con eventos       punto bajo el número
   - día seleccionado  relleno

   La sección 18 sigue siendo la base del componente; aquí solo va lo que la
   versión navegable añade, acotado con `.c2-calendar--interactive` para no
   tocar ningún otro calendario del portal.
   ========================================================================= */

/* Se usa `--c2-cyan-500` tal como lo dejó la sección 26 (#006B82, 6,13:1 con
   texto blanco encima), el mismo tono del contorno de foco del portal. Con el
   #00A5C8 original el día marcado daba 2,91:1 —fallo de contraste que la
   auditoría no cazó porque el número iba dentro de un `span` sin fondo propio
   y la herramienta resolvía el del `td`—. Si ese token vuelve a aclararse hay
   que revisar aquí: el relleno del día seleccionado lleva texto encima. */

.c2-calendar--interactive {
	--c2-cal-cell: 40px;
}

/* En la vista de calendario el componente es el contenido principal, no un
   apunte del lateral: la rejilla puede respirar. */
.c2-agenda-layout__calendar-shell .c2-calendar--interactive {
	--c2-cal-cell: 46px;
}

.c2-calendar--interactive .c2-calendar__head {
	gap: 8px;
}

.c2-calendar--interactive .c2-calendar__title {
	flex: 1 1 auto;
	text-align: center;
	/* Sin esto, «septiembre de 2026» ensancha la caja y las flechas bailan de
	   sitio al cambiar de mes: el punto de pulsación se mueve bajo el dedo. */
	min-width: 0;
}

/* Flechas: enlaces, no botones decorativos. 40 px de lado, por encima del
   objetivo mínimo de 24 px de WCAG 2.5.8 incluso en móvil. */
.c2-calendar--interactive .c2-calendar__nav {
	flex: none;
	width: 40px;
	height: 40px;
	border-color: var(--c2-border);
	text-decoration: none;
}
.c2-calendar--interactive .c2-calendar__nav:hover {
	background: var(--c2-cyan-050);
	border-color: var(--c2-cyan-500);
	color: var(--c2-cyan-500);
}

.c2-calendar--interactive .c2-calendar__grid {
	table-layout: fixed;
}
.c2-calendar--interactive td {
	padding: 2px;
}
.c2-calendar--interactive td.is-empty {
	/* Hueco de relleno del mes vecino: ni número, ni enlace, ni nombre. */
	padding: 0;
}

/* La regla de la sección 18 hace círculos de 34 px con un solo número dentro.
   Aquí la celda lleva número y punto, y tiene que ser pulsable entera. */
.c2-calendar--interactive td a {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 3px;
	width: 100%;
	max-width: none;
	min-width: 0;
	min-height: var(--c2-cal-cell);
	aspect-ratio: auto;
	padding: 4px 0;
	border: 2px solid transparent;
	border-radius: 10px;
	font-variant-numeric: tabular-nums;
	line-height: 1.1;
	text-decoration: none;
	transition: background-color .14s ease, border-color .14s ease, color .14s ease;
}
.c2-calendar--interactive td a:hover {
	background: var(--c2-cyan-050);
	color: var(--c2-cyan-500);
	border-color: var(--c2-cyan-100);
}

/* La sección 18 convierte en círculo de 30 px cualquier `span` dentro de una
   celda, y pinta ahí las marcas de hoy y de día elegido. Con la celda entera
   convertida en enlace eso dibujaba dos marcas concéntricas —un círculo dentro
   del recuadro— y estiraba las filas a 59 px. El número vuelve a ser texto. */
.c2-calendar--interactive td a .c2-calendar__num {
	display: inline;
	width: auto;
	min-width: 0;
	max-width: none;
	aspect-ratio: auto;
	border: 0;
	border-radius: 0;
	background: none;
	color: inherit;
}

/* Punto de «hay eventos». Ocupa sitio siempre —transparente en los días sin
   eventos— para que las cifras queden en la misma línea en toda la rejilla y
   no bailen al cambiar de mes. */
.c2-calendar--interactive td a::after {
	content: "";
	display: block;
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: transparent;
}
.c2-calendar--interactive .has-events a::after {
	background: var(--c2-cyan-500);
}

/* Hoy: contorno. */
.c2-calendar--interactive .is-today a {
	border-color: var(--c2-cyan-500);
	font-weight: 700;
	color: var(--c2-navy-800);
}

/* Día seleccionado: relleno. Texto blanco sobre --c2-cyan-500 (6,13:1). */
.c2-calendar--interactive .is-selected a,
.c2-calendar--interactive .is-selected a:hover {
	background: var(--c2-cyan-500);
	border-color: var(--c2-cyan-500);
	color: #fff;
	font-weight: 700;
}
.c2-calendar--interactive .is-selected.has-events a::after {
	background: #fff;
}

/* Leyenda: las mismas tres formas del calendario, nombradas. Repite la forma
   —recuadro, punto, relleno— en lugar de tres puntos de colores, que sería
   volver a pedir que se distinga por el tono. */
.c2-calendar__legend {
	margin-top: 14px;
	gap: 6px 16px;
}
.c2-legend .c2-legend__mark {
	width: 22px;
	height: 22px;
	border-radius: 7px;
	border: 2px solid var(--c2-border);
	flex: none;
	background: transparent;
}
.c2-legend .c2-legend__mark--today {
	border-color: var(--c2-cyan-500);
}
.c2-legend .c2-legend__mark--events {
	position: relative;
}
.c2-legend .c2-legend__mark--events::after {
	content: "";
	position: absolute;
	left: 50%;
	top: 50%;
	width: 5px;
	height: 5px;
	margin: -2.5px 0 0 -2.5px;
	border-radius: 50%;
	background: var(--c2-cyan-500);
}
.c2-legend .c2-legend__mark--selected {
	background: var(--c2-cyan-500);
	border-color: var(--c2-cyan-500);
}

/* 46 rem daba celdas de 100 px de ancho por 46 de alto: una rejilla estirada
   que no se lee como un calendario. */
.c2-agenda-layout__calendar-shell {
	max-width: 34rem;
}

/* -------------------------------------------------------------------------
   Rótulo de alcance y resultados
   ------------------------------------------------------------------------- */

/* Filtrar por un día deja una lista más corta; sin decir por qué, parece que
   se han acabado los eventos. */
.c2-agenda-scope {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 10px 16px;
	margin-bottom: 20px;
	padding: 12px 16px;
	background: var(--c2-cyan-050);
	border: 1px solid var(--c2-cyan-100);
	border-radius: var(--c2-radius);
}
.c2-agenda-scope__title {
	margin: 0;
	font-weight: 700;
	color: var(--c2-navy-800);
}
.c2-agenda-scope__count {
	margin-left: 8px;
	font-weight: 400;
	color: var(--c2-text-soft);
}
.c2-agenda-scope__clear {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	min-height: 32px;
	padding: 4px 10px;
	border: 1px solid var(--c2-cyan-500);
	border-radius: 999px;
	background: var(--c2-white);
	color: var(--c2-cyan-500);
	font-size: .875rem;
	font-weight: 600;
	text-decoration: none;
}
.c2-agenda-scope__clear:hover {
	background: var(--c2-cyan-500);
	color: #fff;
}
.c2-agenda-scope__clear svg {
	flex: none;
}

/* El foco aterriza aquí al quitar el filtro de día, y tiene que verse: el
   contenedor no es un control, así que no hereda la regla general. */
.c2-agenda-results:focus-visible {
	outline: 3px solid var(--c2-link);
	outline-offset: 6px;
	border-radius: 8px;
}

/* Mientras llega el fragmento nuevo. Sin animación: el cambio dura lo que
   tarda una petición local y parpadear molesta más de lo que informa. */
.c2-layout[aria-busy="true"] {
	opacity: .6;
}

/* Respaldo de `.c2-layout:not(:has(...))` para navegadores sin `:has`: la
   agenda sin lateral no debe reservar la columna del minicalendario. */
.c2-agenda-layout .c2-layout--single {
	grid-template-columns: minmax(0, 1fr);
}

@media (max-width: 640px) {
	.c2-calendar--interactive {
		--c2-cal-cell: 38px;
	}
	.c2-agenda-layout__calendar-shell .c2-calendar--interactive {
		--c2-cal-cell: 40px;
	}
	.c2-agenda-scope {
		align-items: flex-start;
		flex-direction: column;
	}
}

/* A 320 px la rejilla tiene 7 columnas y poco más de 250 px útiles. 34 px de
   lado siguen por encima del mínimo de 24 px y el número no se parte. */
@media (max-width: 360px) {
	.c2-calendar--interactive,
	.c2-agenda-layout__calendar-shell .c2-calendar--interactive {
		--c2-cal-cell: 34px;
	}
	.c2-calendar--interactive td a {
		font-size: .875rem;
	}
	.c2-calendar--interactive .c2-calendar__nav {
		width: 36px;
		height: 36px;
	}
}

/* =========================================================================
   40. (retirado) Cierre de sesión — mismo estilo que el resto del menú lateral
   ========================================================================= */

/* =========================================================================
   41. HOVER Y ESTADO PULSADO DE LOS BOTONES DENTRO DE WIDGETS

   La sección 35 igualó el color en reposo, pero se dejó fuera el hover, y ahí
   Movedo no empata: pinta

       .widget:not(.grve-social) a:not(.grve-outline):not(.grve-btn):hover
           { color: #2944E8 }

   —cinco clases y un elemento— muy por encima de `.c2-btn--primary:hover`, que
   son dos clases. Y su hoja (`movedo_grve_options-dynamic-css`) se imprime en
   línea *después* de esta, así que tampoco bastaba con empatar.

   Efecto en «Contacta con el centro» (widget del lateral de las noticias): al
   pasar el ratón el texto saltaba al azul eléctrico de los enlaces sobre el
   teal oscuro del propio botón — **1,17:1** medido con la transición ya
   terminada, frente a los 6,13:1 del reposo. El estado pulsado se iba con él,
   porque `:active` con ratón implica `:hover`.

   Se repone el color propio de cada variante con `:not(.grve-social)` y el
   prefijo `.c2iet`: seis clases y un elemento, gana sin depender del orden de
   las hojas. No se inventa ningún color — cada variante recupera exactamente
   el hover que ya usa en el resto del portal, para que dos botones iguales en
   reposo se comporten igual bajo el ratón. Si algún día nace una variante
   nueva de `.c2-btn`, hay que añadirla aquí.
   ========================================================================= */

.c2iet .widget:not(.grve-social) a.c2-btn.c2-btn--primary:hover,
.c2iet .widget:not(.grve-social) a.c2-btn.c2-btn--primary:active,
.c2iet .widget:not(.grve-social) a.c2-btn.c2-btn--navy:hover,
.c2iet .widget:not(.grve-social) a.c2-btn.c2-btn--navy:active {
	color: #fff;
}

.c2iet .widget:not(.grve-social) a.c2-btn.c2-btn--outline:hover,
.c2iet .widget:not(.grve-social) a.c2-btn.c2-btn--outline:active {
	color: var(--c2-cyan-600);
}

.c2iet .widget:not(.grve-social) a.c2-btn.c2-btn--ghost:hover,
.c2iet .widget:not(.grve-social) a.c2-btn.c2-btn--ghost:active {
	color: var(--c2-navy-800);
}

/* =========================================================================
   42. FICHA DE FORMACIÓN — COLUMNA DE CONTENIDO

   Sin interface propia (solo hay PNG de Home, Servicios y Formación). La
   columna izquierda era una sucesión plana: píldora, foto, H2 + lista. Aquí
   se agrupa convocatoria (foto + chips + datos) y se dan caja a objetivos,
   programa, destinatarios y requisitos. 🔶 pendiente de interface real.
   ========================================================================= */

.c2-single--curso .c2-layout__main {
	display: flex;
	flex-direction: column;
	gap: 28px;
}
.c2-single--curso .c2-single__content {
	max-width: none;
}

.c2-course-masthead {
	display: flex;
	flex-direction: column;
	gap: 16px;
}
.c2-course-media {
	margin: 0;
}

.c2-course-key {
	display: flex;
	flex-direction: column;
	gap: 14px;
	padding: 16px 18px 18px;
	background: var(--c2-cyan-050);
	border: 1px solid var(--c2-cyan-100);
	border-radius: var(--c2-radius-lg);
}
.c2-course-key__chips {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
}

.c2-course-facts {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(148px, 1fr));
	gap: 10px 12px;
	list-style: none;
	margin: 0;
	padding: 0;
}
.c2-course-facts li {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin: 0;
	min-width: 0;
	padding: 10px 12px;
	background: var(--c2-white);
	border-radius: 10px;
}
.c2-course-facts__icon {
	display: flex;
	flex: none;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border-radius: 8px;
	background: var(--c2-cyan-050);
	color: var(--c2-cyan-600);
}
.c2-course-facts__text {
	display: flex;
	flex-direction: column;
	gap: 1px;
	min-width: 0;
}
.c2-course-facts__label {
	color: var(--c2-text-soft);
	font-size: .75rem;
	font-weight: 600;
	letter-spacing: .02em;
}
.c2-course-facts__value {
	color: var(--c2-navy-800);
	font-size: .9375rem;
	font-weight: 700;
	line-height: 1.3;
}

.c2-course-lead > p:first-child {
	margin: 0;
	color: var(--c2-navy-700);
	font-size: 1.125rem;
	line-height: 1.55;
}
.c2-course-lead > * + * {
	margin-top: 1em;
}

.c2-course-profile {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.c2-course-block {
	padding: 22px 24px 24px;
	background: var(--c2-white);
	border: 1px solid var(--c2-border-soft);
	border-radius: var(--c2-radius-lg);
	box-shadow: var(--c2-shadow-sm);
}
.c2-course-block h2 {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 16px;
	color: var(--c2-navy-800);
	font-size: 1.125rem;
	line-height: 1.3;
}
.c2-course-block h2 svg {
	flex: none;
	color: var(--c2-cyan-600);
}
.c2-course-block p {
	margin: 0;
	color: var(--c2-text);
	font-size: 1rem;
	line-height: 1.55;
}
.c2-course-block--compact {
	padding: 20px 22px 22px;
}

.c2-course-checks {
	display: grid;
	gap: 8px;
	list-style: none;
	margin: 0;
	padding: 0;
}
.c2-course-checks li {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin: 0;
	padding: 0;
	color: var(--c2-text);
	font-size: 1rem;
	line-height: 1.45;
}
.c2-course-checks svg {
	flex: none;
	margin-top: 2px;
	color: var(--c2-cyan-600);
}

.c2-course-modules {
	list-style: none;
	counter-reset: c2-module;
	margin: 0;
	padding: 0;
}
.c2-course-modules li {
	display: grid;
	grid-template-columns: 2rem minmax(0, 1fr);
	gap: 12px;
	align-items: start;
	margin: 0;
	padding: 12px 0;
	border-top: 1px solid var(--c2-border-soft);
	color: var(--c2-text);
	font-size: 1rem;
	line-height: 1.45;
	counter-increment: c2-module;
}
.c2-course-modules li:first-child {
	padding-top: 0;
	border-top: 0;
}
.c2-course-modules li::before {
	content: counter(c2-module);
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2rem;
	height: 2rem;
	border-radius: 50%;
	background: var(--c2-cyan-050);
	color: var(--c2-navy-800);
	font-size: .8125rem;
	font-weight: 700;
	line-height: 1;
}

.c2-course-pair {
	display: grid;
	gap: 16px;
}
.c2-course-pair:has(> :nth-child(2)) {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (max-width: 720px) {
	.c2-single--curso .c2-layout__main {
		gap: 22px;
	}
	.c2-course-block {
		padding: 18px 16px 20px;
	}
	.c2-course-pair:has(> :nth-child(2)) {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* =========================================================================
   43. CATÁLOGO DE FORMACIÓN

   El hero no cambia. Debajo, filtros reales (categoría y modalidad) y
   paginación sobre las mismas tarjetas de diseño. Las chips del hero son
   enlaces al mismo contrato GET (`c2_q`, `c2_cat`, `c2_mod`, `c2_pag`).
   ========================================================================= */

.c2-design-chips a:hover,
.c2-design-chips a:focus-visible {
	background: rgba(0, 167, 157, .55);
	border-color: #fff;
	color: #fff !important;
}
.c2-design-chips a.is-active,
.c2-design-chips a[aria-current="page"] {
	background: #fff;
	border-color: #fff;
	color: var(--c2-design-teal-dark);
	box-shadow: 0 2px 8px rgba(10, 28, 56, .16);
}

.c2-design-catalog__filters {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 14px;
	margin: 12px 0 8px;
}
.c2-design-catalog__filter-group {
	padding: 16px 18px 18px;
	background: var(--c2-bg);
	border: 1px solid var(--c2-border-soft);
	border-radius: var(--c2-radius);
}
.c2-design-catalog__filter-label {
	margin: 0 0 10px;
	color: var(--c2-text-soft);
	font-size: .8125rem;
	font-weight: 700;
	letter-spacing: .02em;
	text-transform: uppercase;
}
.c2-design-catalog__chips {
	gap: 8px;
}
.c2-design-catalog__chips .c2-chip {
	padding: 8px 16px;
	font-size: .875rem;
}
.c2-design-catalog .c2-results-count {
	margin: 18px 0 22px;
}
.c2-design-catalog .c2-pagination {
	margin-top: 36px;
}
.c2-design-catalog .c2-empty {
	margin-top: 8px;
}

/* En `/formacion/` el catálogo va dentro de una fila WPBakery con padding
   superior propio; si además conserva el padding de `.c2-design-section`,
   entre el hero y "Oferta formativa" se suman dos respiraciones. */
.c2-page-formacion #c2-formacion-catalogo {
	padding-top: 0;
}

@media (max-width: 720px) {
	.c2-design-catalog__filters {
		grid-template-columns: minmax(0, 1fr);
	}
	.c2-design-catalog__filter-group {
		padding: 14px;
	}
	.c2-design-catalog__chips .c2-chip {
		padding: 8px 14px;
	}
}

/* Área personal — pedidos y métodos de pago (WooCommerce) */
.c2-order-detail { margin-top: 8px; }
.c2-order-detail__head h2 { margin-bottom: 6px; }
.c2-order-detail__meta { color: var(--c2-text-soft); margin-bottom: 24px; }
.c2-order-detail__total,
.c2-order-detail__payment { margin: 18px 0; }
.c2-order-detail__instructions { margin: 20px 0; }
.c2-link-arrow--back::before { transform: rotate(180deg); margin-right: 6px; }
.c2-wc-payment-add .woocommerce-PaymentBox { margin-top: 16px; }
.c2-payment-methods .c2-account-list__item { align-items: center; }
.c2-account-summary.c2-grid--3 { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
body.woocommerce-account .woocommerce-MyAccount-content { float: none; width: 100%; }
body.woocommerce-account .woocommerce form .form-row { margin-bottom: 16px; }

/* Mi formación — tarjetas de curso con SSO Moodle */
.c2-formation-hub__actions { margin-bottom: 28px; }
.c2-formation-cards {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 16px;
}
.c2-formation-card {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	justify-content: space-between;
	gap: 16px 24px;
	padding: 22px 24px;
	border: 1px solid var(--c2-border-soft);
	border-radius: var(--c2-radius-md, 12px);
	background: #fff;
}
.c2-formation-card__title {
	margin: 0 0 8px;
	font-size: 1.125rem;
	color: var(--c2-navy-800);
}
.c2-formation-card__meta,
.c2-formation-card__hint {
	margin: 8px 0 0;
	color: var(--c2-text-soft);
	font-size: .9375rem;
}
.c2-formation-card__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px 14px;
}
.c2-formation-card__actions .c2-btn { display: inline-flex; align-items: center; gap: 8px; }

@media (max-width: 480px) {
	.c2-account__nav-label { font-size: .6875rem; }
	.c2-account__nav a { padding: 8px 10px; }
	.c2-summary-card { padding: 16px; }
	.c2-auth { padding-left: 0; padding-right: 0; }
}

/*
 * Coming soon / mantenimiento de Movedo.
 *
 * Movedo deja `.grve-section.grve-custom-height` en visibility:hidden hasta
 * que main.js añade `.grve-show-custom-height`. El portal retira ese script
 * (inc/performance.php), así que `/mantenimiento/` pintaba una pantalla en
 * blanco: el texto estaba en el HTML, invisible. Estas reglas no dependen
 * de JS. `#grve-theme-wrapper` solo existe en header-basic.php (coming soon).
 */
.grve-section.grve-custom-height {
	visibility: visible !important;
}
/*
 * Movedo pinta `.grve-animated-item { opacity: 0 }` hasta que main.js +
 * jquery-appear añaden `.grve-animated`. El portal descarga esos scripts
 * (inc/performance.php), así que iconos, cifras e imagen+texto quedaban
 * invisibles pero ocupando hueco: páginas llenas de blancos.
 */
.c2iet .grve-animated-item {
	opacity: 1 !important;
	animation: none !important;
}
/* El shortcode de imagen de Movedo deja `img { opacity: 0 }` hasta que
   elements.js hace el fade-in. Ese script no se carga, así que el esquema
   del edificio (y cualquier Single Image) ocupaba sitio en blanco. */
.c2iet .grve-image img {
	opacity: 1 !important;
}
/*
 * Image Text layout 1, icon boxes con advanced-hover y el leader del blog
 * salen en `visibility:hidden` hasta que main.js calcula alturas. Sin ese
 * script el texto y las fotos ocupan sitio pero no se ven.
 */
.c2iet .grve-image-text.grve-layout-1,
.c2iet .grve-box-icon.grve-advanced-hover,
.c2iet .grve-blog-leader.grve-layout-1.grve-movedo-style .grve-post-leader {
	visibility: visible !important;
}
.c2iet .grve-image-text.grve-layout-1 {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
}
.c2iet .grve-image-text.grve-layout-1.grve-align-right {
	flex-direction: row-reverse;
}
.c2iet .grve-image-text.grve-layout-1 .grve-image,
.c2iet .grve-image-text.grve-layout-1 .grve-content {
	float: none;
	box-sizing: border-box;
}
/*
 * Movedo (main.js → imageText) inyecta padding vertical en la foto/texto
 * para igualar alturas. Con flex + align-items:center sobra y en fotos
 * redondeadas deja bandas blancas arriba y abajo.
 */
.c2iet .grve-image-text.grve-layout-1 .grve-image img {
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}
.c2iet .grve-image-text.grve-layout-1 .grve-content {
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}
@media (max-width: 767px) {
	.c2iet .grve-image-text.grve-layout-1 .grve-image,
	.c2iet .grve-image-text.grve-layout-1 .grve-content {
		width: 100%;
	}
}
.grve-section.grve-fullheight {
	min-height: 100vh;
}
#grve-theme-wrapper .grve-section.grve-middle-content {
	display: flex;
	align-items: center;
	justify-content: center;
}
#grve-theme-wrapper .grve-section.grve-middle-content > .grve-container {
	width: 100%;
}
#grve-theme-wrapper #grve-content {
	background-color: transparent;
}

/* =========================================================================
   CABECERA — métricas del panel de Movedo

   Header Height, Logo Height y Sticky Header salen de Theme Options.
   Estas reglas van al final para ganar a las min-height históricas.
   ========================================================================= */
.c2-header .c2-container {
	height: var(--c2-header-height, 76px);
	min-height: var(--c2-header-height, 76px);
}
.c2-header .c2-logo img,
.c2-mobile-nav .c2-logo img {
	height: var(--c2-logo-height, 48px);
	max-height: var(--c2-logo-height, 48px);
	width: auto;
}
.c2-header .c2-nav > ul > li > a {
	height: var(--c2-header-height, 76px);
	padding-top: 0;
	padding-bottom: 0;
}

.c2-header.c2-header--shrink.is-stuck .c2-container,
.c2-header.c2-header--movedo.is-stuck .c2-container {
	height: var(--c2-header-sticky-height, 68px);
	min-height: var(--c2-header-sticky-height, 68px);
}
.c2-header.c2-header--shrink.is-stuck .c2-logo img,
.c2-header.c2-header--movedo.is-stuck .c2-logo img {
	height: var(--c2-logo-sticky-height, 40px);
	max-height: var(--c2-logo-sticky-height, 40px);
}
.c2-header.c2-header--shrink.is-stuck .c2-nav > ul > li > a,
.c2-header.c2-header--movedo.is-stuck .c2-nav > ul > li > a {
	height: var(--c2-header-sticky-height, 68px);
}

.admin-bar .c2-header.c2-header--sticky.c2-header--simple,
.admin-bar .c2-header.c2-header--sticky.c2-header--shrink,
.admin-bar .c2-header.c2-header--sticky.c2-header--advanced,
.admin-bar .c2-header.c2-header--sticky.c2-header--movedo {
	top: 32px;
}
@media screen and (max-width: 782px) {
	.admin-bar .c2-header.c2-header--sticky.c2-header--simple,
	.admin-bar .c2-header.c2-header--sticky.c2-header--shrink,
	.admin-bar .c2-header.c2-header--sticky.c2-header--advanced,
	.admin-bar .c2-header.c2-header--sticky.c2-header--movedo {
		top: 46px;
	}
}

/* =========================================================================
   Páginas institucionales — cajas, color y hover sobre elementos Movedo
   ========================================================================= */
.c2-info-card.grve-box-icon,
.grve-column .c2-info-card {
	height: 100%;
	margin: 2rem 0;
	padding: 28px 24px 30px;
	border: 1px solid rgba(13, 27, 61, .08);
	border-radius: 20px;
	background: #fff;
	box-shadow: 0 10px 28px rgba(13, 27, 61, .07);
	transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.c2iet .grve-box-icon:has(+ .grve-box-icon) {
	margin-bottom: 24px;
}
.c2iet .grve-box-icon + .grve-box-icon {
	margin-top: 24px;
}
.c2-info-card.grve-box-icon:hover {
	transform: translateY(-6px);
	border-color: rgba(0, 167, 157, .35);
	box-shadow: 0 18px 40px rgba(0, 167, 157, .16);
}
/*
 * Transparencia (y el mismo patrón en otras páginas): el «Leer» es un
 * movedo_button hermano de la caja. Lo integramos en la tarjeta y lo
 * pintamos como el resto de botones del portal.
 */
.c2-design-page .grve-column-wrapper:has(> .c2-info-card):has(.grve-btn) {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	height: 100%;
	padding: 28px 24px 24px;
	border: 1px solid rgba(13, 27, 61, .08);
	border-radius: 20px;
	background: #fff;
	box-shadow: 0 10px 28px rgba(13, 27, 61, .07);
	transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.c2-design-page .grve-column-wrapper:has(> .c2-info-card):has(.grve-btn):hover {
	transform: translateY(-6px);
	border-color: rgba(0, 167, 157, .35);
	box-shadow: 0 18px 40px rgba(0, 167, 157, .16);
}
.c2-design-page .grve-column-wrapper:has(> .c2-info-card):has(.grve-btn) > .c2-info-card {
	height: auto;
	flex: 1 1 auto;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
}
.c2-design-page .grve-column-wrapper:has(> .c2-info-card):has(.grve-btn) > .c2-info-card:hover {
	transform: none;
	border-color: transparent;
	box-shadow: none;
}
.c2-design-page .grve-column-wrapper:has(> .c2-info-card):has(.grve-btn) > .grve-element:has(.grve-btn) {
	margin-top: 18px;
}
.c2-design-page .grve-column-wrapper:has(> .c2-info-card):has(.grve-btn) a.grve-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 44px;
	padding: 10px 19px;
	border: 1px solid var(--c2-design-blue, #0D1B3D);
	border-radius: var(--c2-radius-pill);
	background: var(--c2-design-blue, #0D1B3D);
	color: #fff;
	font-family: var(--c2-font-heading);
	font-size: .875rem;
	font-weight: 700;
	line-height: 1.2;
	text-decoration: none;
	white-space: nowrap;
}
.c2-design-page .grve-column-wrapper:has(> .c2-info-card):has(.grve-btn) a.grve-btn span {
	color: inherit;
	position: static;
}
.c2-design-page .grve-column-wrapper:has(> .c2-info-card):has(.grve-btn) a.grve-btn .grve-btn-bottom-line {
	display: none;
}
.c2-design-page .grve-column-wrapper:has(> .c2-info-card):has(.grve-btn) a.grve-btn:hover,
.c2-design-page .grve-column-wrapper:has(> .c2-info-card):has(.grve-btn) a.grve-btn:focus-visible {
	background: var(--c2-design-blue-dark, #001636);
	border-color: var(--c2-design-blue-dark, #001636);
	color: #fff;
}
.c2-design-page .grve-column-wrapper:has(> .c2-info-card):has(.grve-btn) a.grve-btn::after {
	content: "";
	width: 14px;
	height: 14px;
	flex: none;
	background-color: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h16m0 0l-6-6m6 6l-6 6'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h16m0 0l-6-6m6 6l-6 6'/%3E%3C/svg%3E") center / contain no-repeat;
}
.c2-info-card .grve-wrapper-icon {
	margin-bottom: 16px;
}
.c2-info-card h3,
.c2-info-card .grve-title {
	margin-bottom: 10px;
	color: #0D1B3D;
	font-family: var(--c2-font-heading, Montserrat, sans-serif);
}
.c2-info-card.grve-box-icon p,
.c2-info-card .grve-box-icon-content {
	color: #4a5568;
	line-height: 1.55;
}

.c2-info-card--navy {
	background: #0D1B3D;
	border-color: transparent;
	box-shadow: 0 14px 32px rgba(13, 27, 61, .28);
}
.c2-info-card--navy h3,
.c2-info-card--navy .grve-title,
.c2-info-card--navy p,
.c2-info-card--navy .grve-box-icon-content {
	color: #fff;
}
.c2-info-card--navy:hover {
	box-shadow: 0 20px 44px rgba(0, 167, 157, .28);
}

.c2-info-card--teal {
	background: #00A79D;
	border-color: transparent;
}
.c2-info-card--teal h3,
.c2-info-card--teal .grve-title,
.c2-info-card--teal p,
.c2-info-card--teal .grve-box-icon-content {
	color: #fff;
}

.grve-section.c2-stat-band .grve-counter {
	padding: 8px 0 4px;
	text-align: center;
}
.grve-section.c2-stat-band .grve-counter-value,
.grve-section.c2-stat-band .grve-counter span {
	color: #fff;
	font-family: var(--c2-font-heading, Montserrat, sans-serif);
}
.grve-section.c2-stat-band .grve-counter-title {
	margin-top: 8px;
	color: #fff;
	font-size: 1.25rem;
	letter-spacing: .02em;
}

.grve-image-text.c2-image-panel .grve-image img {
	border-radius: 20px;
	box-shadow: 0 16px 40px rgba(13, 27, 61, .16);
}
/* Movedo usa ~8% entre foto y texto; no dejarlo en 12px. */
.grve-image-text.c2-image-panel .grve-content {
	padding: 8px 0 8px clamp(28px, 8%, 64px) !important;
}
.grve-image-text.c2-image-panel.grve-align-right .grve-content {
	padding: 8px clamp(28px, 8%, 64px) 8px 0 !important;
}
.c2iet .grve-image-text a.grve-read-more.c2-design-btn {
	margin-top: 20px;
	color: #fff;
	text-decoration: none;
}
.c2iet .grve-image-text a.grve-read-more.c2-design-btn:hover {
	color: #fff;
}
.c2iet .grve-image-text a.grve-read-more.c2-design-btn::after,
.home .grve-column-wrapper:has(> .grve-image-text.c2-image-panel) a.grve-btn::after {
	content: "";
	width: 14px;
	height: 14px;
	flex: none;
	background-color: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h16m0 0l-6-6m6 6l-6 6'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h16m0 0l-6-6m6 6l-6 6'/%3E%3C/svg%3E") center / contain no-repeat;
}
/*
 * Portada: el botón va como hermano del Image Text, así que Movedo lo pinta
 * a ancho completo debajo de la foto. Lo subimos a la columna del texto.
 */
.home .grve-column-wrapper:has(> .grve-image-text.c2-image-panel) {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	align-items: center;
	column-gap: 40px;
	row-gap: 16px;
}
.home .grve-column-wrapper:has(> .grve-image-text.c2-image-panel) > .grve-image-text.c2-image-panel.grve-layout-1 {
	display: contents;
}
.home .grve-column-wrapper:has(> .grve-image-text.c2-image-panel) .grve-image-text.c2-image-panel .grve-image {
	grid-column: 1;
	grid-row: 1 / span 2;
	width: 100%;
	float: none;
}
.home .grve-column-wrapper:has(> .grve-image-text.c2-image-panel) .grve-image-text.c2-image-panel .grve-content {
	grid-column: 2;
	grid-row: 1;
	width: 100%;
	float: none;
	padding: 0 !important; /* el hueco lo marca column-gap del grid */
}
.home .grve-column-wrapper:has(> .grve-image-text.c2-image-panel) > .grve-empty-space {
	display: none;
}
.home .grve-column-wrapper:has(> .grve-image-text.c2-image-panel) > .grve-element {
	grid-column: 2;
	grid-row: 2;
	justify-self: start;
	align-self: start;
}
.home .grve-column-wrapper:has(> .grve-image-text.c2-image-panel) a.grve-btn {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 44px;
	padding: 10px 19px !important;
	border: 1px solid var(--c2-design-blue, #0D1B3D) !important;
	border-radius: var(--c2-radius-pill) !important;
	background: var(--c2-design-blue, #0D1B3D) !important;
	color: #fff !important;
	font-family: var(--c2-font-heading);
	font-size: .875rem;
	font-weight: 700;
	line-height: 1.2;
	text-decoration: none;
	white-space: nowrap;
}
.home .grve-column-wrapper:has(> .grve-image-text.c2-image-panel) a.grve-btn:hover,
.home .grve-column-wrapper:has(> .grve-image-text.c2-image-panel) a.grve-btn:focus-visible {
	background: var(--c2-design-blue-dark, #001636);
	border-color: var(--c2-design-blue-dark, #001636);
	color: #fff;
}
@media (max-width: 767px) {
	.home .grve-column-wrapper:has(> .grve-image-text.c2-image-panel) {
		grid-template-columns: minmax(0, 1fr);
	}
	.home .grve-column-wrapper:has(> .grve-image-text.c2-image-panel) .grve-image-text.c2-image-panel .grve-image,
	.home .grve-column-wrapper:has(> .grve-image-text.c2-image-panel) .grve-image-text.c2-image-panel .grve-content,
	.home .grve-column-wrapper:has(> .grve-image-text.c2-image-panel) > .grve-element {
		grid-column: 1;
		grid-row: auto;
		width: 100%;
	}
}

@media (max-width: 767px) {
	.c2-info-card.grve-box-icon {
		margin-bottom: 16px;
	}
}

/* =========================================================================
   FICHA ESPACIO / COWORKING — contenido editorial

   El `post_content` del CPT `espacio` llega con filas WPBakery/Movedo
   (`grve-section`, columnas con gutter). En la columna estrecha de la ficha
   eso desalineaba el texto respecto a la imagen hero y dejaba un vacío
   grande (padding 2x/3x) antes de «Uso recomendado». Aquí se ancla el
   marcado al ancho de la imagen y se da aire claro al bloque Equipamiento.
   ========================================================================= */
.c2-single--coworking .c2-single__media,
.c2-single--espacio .c2-single__media {
	margin-bottom: 0;
}

.c2-single--coworking .c2-single__block--features,
.c2-single--espacio .c2-single__block--features {
	margin-top: 28px;
	margin-bottom: 8px;
}

.c2-single--coworking .c2-single__block--features h2,
.c2-single--espacio .c2-single__block--features h2 {
	margin: 0 0 14px;
	font-size: 1.15rem;
}

.c2-features--chips {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
	gap: 10px;
	list-style: none;
	margin: 0;
	padding: 0;
	border: 0;
}

.c2-features--chips li {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: flex-start;
	gap: 10px;
	min-width: 0;
	margin: 0;
	padding: 12px 14px;
	border: 1px solid var(--c2-border-soft);
	border-radius: var(--c2-radius);
	background: var(--c2-bg);
	font-size: 0.875rem;
	font-weight: 600;
	line-height: 1.25;
	color: var(--c2-navy-800);
	text-align: left;
}

.c2-features--chips li svg {
	flex: none;
	color: var(--c2-cyan-500);
}

.c2-single--coworking .c2-single__content,
.c2-single--espacio .c2-single__content {
	margin-top: 28px;
	max-width: none;
}

/* Filas Movedo dentro de la columna: mismo ancho que la imagen, sin gutter. */
.c2-single--coworking .c2-single__content > .grve-section,
.c2-single--coworking .c2-single__content > .grve-row-section,
.c2-single--espacio .c2-single__content > .grve-section,
.c2-single--espacio .c2-single__content > .grve-row-section {
	padding-top: 0 !important;
	padding-bottom: 0 !important;
	margin: 0;
}

.c2-single--coworking .c2-single__content .grve-background-wrapper,
.c2-single--espacio .c2-single__content .grve-background-wrapper {
	position: static;
	inset: auto;
	width: auto;
	height: auto;
	min-height: 0;
}

.c2-single--coworking .c2-single__content .grve-container,
.c2-single--coworking .c2-single__content .grve-row,
.c2-single--espacio .c2-single__content .grve-container,
.c2-single--espacio .c2-single__content .grve-row {
	width: 100% !important;
	max-width: none !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}

.c2-single--coworking .c2-single__content .grve-column,
.c2-single--coworking .c2-single__content .grve-column-wrapper,
.c2-single--espacio .c2-single__content .grve-column,
.c2-single--espacio .c2-single__content .grve-column-wrapper {
	padding-left: 0 !important;
	padding-right: 0 !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
}

.c2-single--coworking .c2-single__content .grve-element,
.c2-single--espacio .c2-single__content .grve-element {
	margin-bottom: 1.1em;
}

.c2-single--coworking .c2-single__content .grve-element:last-child,
.c2-single--espacio .c2-single__content .grve-element:last-child {
	margin-bottom: 0;
}

/* =========================================================================
   RESERVAS MWB — ficha de coworking

   MWB aporta la lógica de disponibilidad y precio, pero su hoja pública
   deja el calendario y las franjas con estilos de demostración. Se
   sobrescriben aquí, siempre dentro de la clase que añade el tema hijo a
   las fichas de productos coworking, sin tocar el plugin proveedor.
   ========================================================================= */
.c2-single--coworking .c2-panel--booking {
	padding: clamp(20px, 3vw, 32px);
}

.c2-single--coworking .c2-panel--booking h2 {
	margin-bottom: 22px;
}

.c2-single--coworking .c2-panel--booking .c2-datalist li:last-child {
	border-bottom: 1px solid var(--c2-border-soft);
}

.c2-single--coworking .c2-panel--booking .c2-datalist {
	margin-bottom: 4px;
}

.c2-single--coworking .grve-product-form {
	padding: 0;
	border: 0;
	background: transparent;
}

.c2-single--coworking .grve-product-form form.cart {
	display: grid;
	gap: 18px;
	margin: 0;
}

.c2-single--coworking .mwb-mbfw-cart-page-data {
	display: grid;
	gap: 18px;
}

.c2-single--coworking .mbfw-date-picker-section__wrapper {
	display: grid;
	gap: 12px;
	margin-top: 10px;
	padding-top: 16px;
}

.c2-single--coworking .mbfw-date-picker-section {
	display: grid;
	width: 100%;
	max-width: none;
	gap: 8px;
}

.c2-single--coworking .mbfw-date-picker-section label,
.c2-single--coworking .mbfw-additionl-detail-listing-section:first-child {
	margin: 0;
	color: var(--c2-navy-800);
	font-family: var(--c2-font-heading);
	font-size: .875rem;
	font-weight: 700;
	letter-spacing: .01em;
}

.c2-single--coworking .grve-product-form input[type="text"],
.c2-single--coworking .grve-product-form input[type="number"] {
	width: 100%;
	min-height: 50px;
	padding: 11px 14px;
	border: 1px solid var(--c2-border);
	border-radius: 10px;
	background: var(--c2-white);
	color: var(--c2-navy-800);
	font-family: var(--c2-font);
	font-size: .9375rem;
	line-height: 1.3;
	box-shadow: none;
}

.c2-single--coworking .grve-product-form input.c2iet-mwb-date-display,
.c2-single--coworking .grve-product-form input[type="text"].c2iet-mwb-date-display {
	font-size: .875rem;
}

.c2-single--coworking .grve-product-form input[type="text"]::placeholder {
	color: var(--c2-text-faint);
	opacity: 1;
	text-transform: none;
	font-size: .875rem;
}

.c2-single--coworking .grve-product-form input[type="text"] {
	text-align: left;
	text-transform: none;
}

.c2-single--coworking .grve-product-form input[type="text"]:focus,
.c2-single--coworking .grve-product-form input[type="number"]:focus {
	border-color: var(--c2-cyan-500);
	box-shadow: 0 0 0 3px var(--c2-cyan-100);
	outline: 0;
}

.c2-single--coworking .mbfw-additionl-detail-listing-section__wrapper {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	margin: 0;
	padding: 14px 0 0;
	border-top: 1px solid var(--c2-border-soft);
}

.c2-single--coworking .mbfw-additionl-detail-listing-section:first-child {
	flex: 1 1 auto;
	min-width: 0;
}

.c2-single--coworking .mbfw-additionl-detail-listing-section:last-child {
	flex: 0 0 auto;
	margin-left: auto;
}

.c2-single--coworking .mbfw-additionl-detail-listing-section:last-child input,
.c2-single--coworking .grve-product-form input.mwb_mbfw_people_number {
	display: block;
	width: 4.5rem;
	min-width: 4.5rem;
	max-width: 4.5rem;
	box-sizing: border-box;
	padding-left: 8px;
	padding-right: 8px;
	margin: 0;
	text-align: center;
	font-variant-numeric: tabular-nums;
}

.c2-single--coworking .grve-product-form .quantity {
	display: none;
}

.c2-single--coworking .mwb-mbfw-total-area {
	margin: 6px 0 0;
}

.c2-single--coworking .mbfw-total-listing-single-page__wrapper-parent {
	overflow: hidden;
	border: 1px solid var(--c2-border);
	border-radius: 12px;
	background: var(--c2-bg-alt);
}

.c2-single--coworking .mbfw-total-listing-single-page__wrapper {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 18px;
	padding: 12px 14px 10px;
	border-bottom: 0;
	color: var(--c2-text-soft);
	font-size: .875rem;
}

.c2-single--coworking .mbfw-total-listing-single-page__wrapper
	.mbfw-total-listing-single-page:first-child {
	color: var(--c2-navy-800);
}

.c2-single--coworking .mbfw-total-cost__wrapper {
	font-family: var(--c2-font-heading);
	font-size: 1rem;
	font-weight: 700;
}

.c2-single--coworking .mbfw-total-cost__wrapper
	.mbfw-total-listing-single-page:last-child {
	color: var(--c2-cyan-600);
}

.c2-single--coworking .single_add_to_cart_button {
	width: 100%;
	min-height: 52px;
	margin: 0;
	border: 0;
	border-radius: 10px;
	background: var(--c2-cyan-500);
	color: var(--c2-white);
	font-family: var(--c2-font-heading);
	font-size: .9375rem;
	font-weight: 700;
	letter-spacing: .01em;
	box-shadow: 0 6px 14px rgba(0, 143, 135, .18);
	transition: background-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

.c2-single--coworking .single_add_to_cart_button:hover,
.c2-single--coworking .single_add_to_cart_button:focus-visible {
	background: var(--c2-cyan-600);
	color: var(--c2-white);
	box-shadow: 0 8px 18px rgba(0, 143, 135, .26);
	transform: translateY(-1px);
}

.c2-single--coworking .grve-product-form input.c2iet-mwb-date-source {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	border: 0;
	pointer-events: none;
}

body.c2iet-coworking-product .flatpickr-calendar {
	z-index: 100000;
	width: min(360px, calc(100vw - 32px));
	height: auto;
	overflow: visible;
	border: 1px solid var(--c2-border);
	border-radius: 16px;
	background: var(--c2-white);
	box-shadow: 0 16px 36px rgba(10, 28, 56, .16);
	color: var(--c2-text);
	font-family: var(--c2-font);
}

body.c2iet-coworking-product .flatpickr-calendar::before,
body.c2iet-coworking-product .flatpickr-calendar::after {
	display: none;
}

body.c2iet-coworking-product .flatpickr-months {
	align-items: center;
	padding: 10px 12px 8px;
	background: var(--c2-navy-800);
}

body.c2iet-coworking-product .flatpickr-months .flatpickr-month {
	height: 42px;
	color: var(--c2-white);
}

body.c2iet-coworking-product .flatpickr-current-month {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	width: 100%;
	height: 42px;
	padding: 0;
	color: var(--c2-white);
	font-family: var(--c2-font-heading);
	font-size: .9375rem;
	font-weight: 700;
}

body.c2iet-coworking-product .flatpickr-current-month .flatpickr-monthDropdown-months,
body.c2iet-coworking-product .flatpickr-current-month input.cur-year {
	color: var(--c2-white);
	font-family: var(--c2-font-heading);
	font-size: .9375rem;
	font-weight: 700;
}

body.c2iet-coworking-product .flatpickr-current-month .flatpickr-monthDropdown-months {
	background: transparent;
}

body.c2iet-coworking-product .flatpickr-current-month input.cur-year {
	flex: 0 0 72px;
	width: 72px;
	max-width: none;
	padding-right: 4px;
	padding-left: 4px;
	background: transparent;
}

body.c2iet-coworking-product .flatpickr-current-month .numInputWrapper {
	flex: 0 0 72px;
	width: 72px;
}

body.c2iet-coworking-product .flatpickr-months .flatpickr-prev-month,
body.c2iet-coworking-product .flatpickr-months .flatpickr-next-month {
	position: static;
	display: grid;
	place-items: center;
	width: 36px;
	height: 36px;
	border-radius: 8px;
	color: var(--c2-white);
	fill: var(--c2-white);
}

body.c2iet-coworking-product .flatpickr-months .flatpickr-prev-month:hover,
body.c2iet-coworking-product .flatpickr-months .flatpickr-next-month:hover {
	background: rgba(255, 255, 255, .14);
	color: var(--c2-white);
	fill: var(--c2-white);
}

body.c2iet-coworking-product .flatpickr-weekdays {
	padding: 7px 10px;
	background: var(--c2-bg-alt);
}

body.c2iet-coworking-product .flatpickr-weekday {
	color: var(--c2-text-faint);
	font-size: .6875rem;
	font-weight: 700;
	text-transform: uppercase;
}

body.c2iet-coworking-product .flatpickr-days,
body.c2iet-coworking-product .dayContainer {
	width: 100%;
	min-width: 100%;
	max-width: 100%;
}

body.c2iet-coworking-product .dayContainer {
	padding: 6px 10px 4px;
}

body.c2iet-coworking-product .flatpickr-day {
	width: 14.2857%;
	max-width: none;
	height: 38px;
	margin: 2px 0;
	border: 2px solid transparent;
	border-radius: 10px;
	color: var(--c2-navy-800);
	font-size: .8125rem;
	line-height: 34px;
}

body.c2iet-coworking-product .flatpickr-day:hover,
body.c2iet-coworking-product .flatpickr-day:focus {
	border-color: var(--c2-cyan-100);
	background: var(--c2-cyan-050);
	color: var(--c2-cyan-600);
}

body.c2iet-coworking-product .flatpickr-day.today:not(.selected) {
	border-color: var(--c2-cyan-500);
}

body.c2iet-coworking-product .flatpickr-day.selected,
body.c2iet-coworking-product .flatpickr-day.selected:hover {
	border-color: var(--c2-cyan-600);
	background: var(--c2-cyan-600);
	color: var(--c2-white);
}

body.c2iet-coworking-product .flatpickr-day.flatpickr-disabled {
	color: #B8C0CC;
	opacity: .7;
}

body.c2iet-coworking-product .wps_cal_timeslot {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 8px;
	margin: 0 !important;
	padding: 12px 14px 14px;
	border-top: 1px solid var(--c2-border-soft);
	background: var(--c2-bg);
}

body.c2iet-coworking-product .wps_cal_timeslot span {
	display: block;
	margin: 0;
	padding: 0;
}

body.c2iet-coworking-product .wps_cal_timeslot button {
	width: 100%;
	min-height: 44px;
	margin: 0;
	padding: 7px 6px;
	border: 1px solid var(--c2-border);
	border-radius: 9px;
	background: var(--c2-white);
	color: var(--c2-navy-800);
	font-family: var(--c2-font);
	font-size: .8125rem;
	font-weight: 700;
	line-height: 1.2;
	box-shadow: none;
	transition: border-color .16s ease, background-color .16s ease, color .16s ease;
}

body.c2iet-coworking-product .wps_cal_timeslot button:not(:disabled):hover,
body.c2iet-coworking-product .wps_cal_timeslot button:not(:disabled):focus-visible {
	border-color: var(--c2-cyan-500);
	background: var(--c2-cyan-050);
	color: var(--c2-cyan-600);
}

body.c2iet-coworking-product .wps_cal_timeslot button:disabled,
body.c2iet-coworking-product .wps_cal_timeslot button:disabled:hover {
	border-color: #DCE2EA;
	background: #F1F3F6;
	color: #9AA4B2;
	cursor: not-allowed;
	opacity: .75;
}

body.c2iet-coworking-product .wps_booking_tooltip {
	z-index: 100001;
	max-width: 210px;
	padding: 8px 10px;
	border: 1px solid rgba(255, 255, 255, .2);
	border-radius: 8px;
	background: var(--c2-navy-800);
	color: var(--c2-white);
	font-family: var(--c2-font);
	font-size: .75rem;
	line-height: 1.35;
	box-shadow: 0 8px 18px rgba(10, 28, 56, .18);
}

@media (max-width: 560px) {
	.c2-single--coworking .c2-panel--booking {
		padding: 20px;
	}

	body.c2iet-coworking-product .flatpickr-calendar {
		width: calc(100vw - 32px);
	}
}

/* --------------------------------------------------------------------
   Carrito WooCommerce
   -------------------------------------------------------------------- */
body.woocommerce-cart .grve-cart-update-button,
body.woocommerce-cart button[name="update_cart"],
body.woocommerce-cart input[name="update_cart"] {
	display: none !important;
}

body.woocommerce-cart .c2-cart-totals {
	margin: 0;
	padding: 24px;
	border: 1px solid var(--c2-border);
	border-radius: 12px;
	background: var(--c2-white);
	box-shadow: none;
}

body.woocommerce-cart .c2-cart-totals__title {
	margin: 0 0 18px;
	padding: 0;
	border: 0;
	font-family: var(--c2-font-heading);
	font-size: 1.05rem;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: 0;
	text-align: left;
	text-transform: none !important;
	color: var(--c2-navy-800);
}

body.woocommerce-cart .c2-cart-totals__table,
body.woocommerce-cart .c2-cart-totals table {
	width: 100%;
	margin: 0 0 20px;
	padding: 0;
	border: 0 !important;
	border-bottom: 0 !important;
	border-collapse: collapse;
	border-spacing: 0;
}

body.woocommerce-cart .c2-cart-totals table th,
body.woocommerce-cart .c2-cart-totals table td {
	padding: 10px 0;
	border: 0 !important;
	border-top: 0 !important;
	border-bottom: 0 !important;
	border-left: 0 !important;
	border-right: 0 !important;
	background: transparent !important;
	font-family: var(--c2-font);
	font-size: .9375rem;
	font-weight: 500;
	line-height: 1.4;
	text-align: left;
	text-transform: none !important;
	color: var(--c2-navy-700);
	vertical-align: middle;
}

body.woocommerce-cart .c2-cart-totals table td {
	text-align: right;
	font-weight: 600;
	color: var(--c2-navy-800);
}

body.woocommerce-cart .c2-cart-totals table tr.order-total th,
body.woocommerce-cart .c2-cart-totals table tr.order-total td {
	padding-top: 16px;
	border-top: 1px solid var(--c2-border) !important;
	border-bottom: 0 !important;
	font-size: 1.05rem;
	font-weight: 700;
	color: var(--c2-navy-800);
}

body.woocommerce-cart .wc-proceed-to-checkout {
	margin: 0;
	padding: 0;
}

body.woocommerce-cart .wc-proceed-to-checkout a,
body.woocommerce-cart .wc-proceed-to-checkout a.checkout-button,
body.woocommerce-cart .wc-proceed-to-checkout .grve-btn {
	display: flex !important;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 52px;
	margin: 0 !important;
	padding: 14px 20px !important;
	border: 0 !important;
	border-radius: 10px !important;
	background: var(--c2-cyan-500) !important;
	background-color: var(--c2-cyan-500) !important;
	color: var(--c2-white) !important;
	font-family: var(--c2-font-heading) !important;
	font-size: 1rem !important;
	font-weight: 700 !important;
	line-height: 1.2 !important;
	letter-spacing: 0 !important;
	text-align: center;
	text-decoration: none !important;
	text-transform: none !important;
	box-shadow: none !important;
	transition: background-color .16s ease, color .16s ease;
}

body.woocommerce-cart .wc-proceed-to-checkout a span,
body.woocommerce-cart .wc-proceed-to-checkout .grve-btn span {
	color: inherit !important;
}

body.woocommerce-cart .wc-proceed-to-checkout a:hover,
body.woocommerce-cart .wc-proceed-to-checkout a:focus-visible,
body.woocommerce-cart .wc-proceed-to-checkout .grve-btn:hover,
body.woocommerce-cart .wc-proceed-to-checkout .grve-btn:focus-visible {
	background: var(--c2-navy-800) !important;
	background-color: var(--c2-navy-800) !important;
	color: var(--c2-white) !important;
}

body.woocommerce-cart .woocommerce a.remove {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	margin: 0;
	border: 1px solid var(--c2-border);
	border-radius: 8px;
	background: var(--c2-white);
	color: var(--c2-navy-700);
	text-decoration: none;
	transition: border-color .16s ease, background-color .16s ease, color .16s ease;
}

body.woocommerce-cart .woocommerce a.remove:hover,
body.woocommerce-cart .woocommerce a.remove:focus-visible {
	border-color: #E2B4B4;
	background: #FDF2F2;
	color: #B42318;
}

body.woocommerce-cart .woocommerce a.remove .grve-icon-close {
	font-size: 14px;
	line-height: 1;
}

body.woocommerce-cart .shop_table.cart {
	margin-bottom: 0;
	border: 0;
	border-bottom: 0;
}

body.woocommerce-cart .shop_table.cart th {
	padding: 12px 10px;
	border: 0;
	border-bottom: 1px solid var(--c2-border);
	font-family: var(--c2-font);
	font-size: .8125rem;
	font-weight: 700;
	letter-spacing: .02em;
	text-transform: none !important;
	color: var(--c2-navy-700);
}

body.woocommerce-cart .shop_table.cart td {
	padding: 18px 10px;
	border: 0;
	border-bottom: 1px solid var(--c2-border-soft);
	vertical-align: middle;
}

body.woocommerce-cart .shop_table.cart .product-name a {
	font-family: var(--c2-font-heading);
	font-weight: 700;
	color: var(--c2-navy-800);
	text-decoration: none;
}

body.woocommerce-cart .shop_table.cart .product-name a:hover {
	color: var(--c2-cyan-600);
}

body.woocommerce-cart .shop_table.cart .variation,
body.woocommerce-cart .shop_table.cart .wc-item-meta {
	margin: 8px 0 0;
	padding: 0;
	border: 0;
	text-align: left;
}

body.woocommerce-cart .shop_table.cart .variation dt,
body.woocommerce-cart .shop_table.cart .variation dd,
body.woocommerce-cart .shop_table.cart .wc-item-meta .wc-item-meta-label,
body.woocommerce-cart .shop_table.cart .wc-item-meta p {
	display: inline;
	margin: 0;
	padding: 0;
	float: none;
	font-size: .875rem;
	font-weight: 500;
	color: var(--c2-navy-700);
}

body.woocommerce-cart .shop_table.cart .variation dt::after,
body.woocommerce-cart .shop_table.cart .wc-item-meta .wc-item-meta-label::after {
	content: ': ';
}

body.woocommerce-cart .shop_table.cart .variation dd p,
body.woocommerce-cart .shop_table.cart .wc-item-meta p {
	display: inline;
}

@media (max-width: 1024px) {
	body.woocommerce-cart .grve-cart-content {
		padding-right: 0;
		margin-bottom: 28px;
	}
}

/* =====================================================================
 * Checkout — CTA y caja Redsys InSite
 * ===================================================================== */

body.woocommerce-checkout #payment #place_order,
body.woocommerce-checkout #payment button#place_order,
body.woocommerce-checkout #payment .grve-btn#place_order,
body.woocommerce-checkout form.checkout #place_order {
	display: block !important;
	float: none !important;
	position: relative;
	z-index: 2;
	width: 100%;
	min-height: 52px;
	margin: 0 !important;
	padding: 14px 20px !important;
	border: 0 !important;
	border-radius: 10px !important;
	background: var(--c2-cyan-500) !important;
	background-color: var(--c2-cyan-500) !important;
	color: var(--c2-white) !important;
	font-family: var(--c2-font-heading) !important;
	font-size: 1rem !important;
	font-weight: 700 !important;
	line-height: 1.2 !important;
	letter-spacing: 0 !important;
	text-align: center;
	text-decoration: none !important;
	text-transform: none !important;
	box-shadow: none !important;
	cursor: pointer;
	transition: background-color .16s ease, color .16s ease;
}

body.woocommerce-checkout #payment #place_order:hover,
body.woocommerce-checkout #payment #place_order:focus-visible,
body.woocommerce-checkout form.checkout #place_order:hover,
body.woocommerce-checkout form.checkout #place_order:focus-visible {
	background: var(--c2-navy-800) !important;
	background-color: var(--c2-navy-800) !important;
	color: var(--c2-white) !important;
}

/* Datos obligatorios de reserva (art. 33 del Reglamento C2IET). */
body.woocommerce-checkout .form-row.c2iet-reserva-field {
	margin-top: 8px;
	margin-bottom: 18px;
}
body.woocommerce-checkout .form-row.c2iet-reserva-field label {
	display: block;
	margin-bottom: 7px;
	font-family: var(--c2-font-heading);
	font-size: .94rem;
	font-weight: 700;
	color: var(--c2-navy-800);
}
body.woocommerce-checkout .form-row.c2iet-reserva-field input.input-text,
body.woocommerce-checkout .form-row.c2iet-reserva-field input[type="number"],
body.woocommerce-checkout .form-row.c2iet-reserva-field input[type="month"],
body.woocommerce-checkout .form-row.c2iet-reserva-field textarea {
	width: 100%;
	min-height: 48px;
	padding: 12px 14px;
	border: 1px solid var(--c2-border);
	border-radius: 8px;
	background: var(--c2-white);
	color: var(--c2-navy-800);
	font-family: var(--c2-font);
	font-size: .95rem;
	line-height: 1.4;
}
body.woocommerce-checkout .form-row.c2iet-reserva-field textarea {
	min-height: 112px;
	resize: vertical;
}
body.woocommerce-checkout .form-row.c2iet-reserva-field input:focus,
body.woocommerce-checkout .form-row.c2iet-reserva-field textarea:focus {
	border-color: var(--c2-cyan-500);
	outline: 3px solid rgba(0, 167, 157, .22);
}
body.woocommerce-checkout .form-row.c2iet-reserva-check {
	padding: 12px 14px;
	border: 1px solid var(--c2-border-soft);
	border-radius: 8px;
	background: var(--c2-cyan-050);
}
body.woocommerce-checkout .form-row.c2iet-reserva-check label {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin: 0;
	font-family: var(--c2-font);
	font-size: .9rem;
	font-weight: 500;
	line-height: 1.45;
}
body.woocommerce-checkout .form-row.c2iet-reserva-check input[type="checkbox"] {
	flex: 0 0 auto;
	width: 20px;
	height: 20px;
	margin: 1px 0 0;
	accent-color: var(--c2-cyan-500);
}
body.woocommerce-checkout .form-row.c2iet-reserva-check a {
	color: var(--c2-navy-800);
	font-weight: 700;
	text-decoration: underline;
	text-underline-offset: 2px;
}
body.woocommerce-checkout .c2iet-order-reservation {
	margin-top: 24px;
}
body.woocommerce-checkout .c2iet-order-reservation h3 {
	margin-bottom: 12px;
}
.c2iet-tariff-promo {
	display: inline-flex;
	align-items: center;
	padding: 4px 9px;
	border-radius: 999px;
	background: var(--c2-cyan-050);
	color: var(--c2-navy-800);
	font-weight: 700;
}
.woocommerce .c2iet-tariff-rule-note {
	color: var(--c2-cyan-700, #007f78);
	font-weight: 700;
}
