/* ==========================================================================
   XUL — estilos base
   Tokens extraídos de los estilos de Figma «Diseño Web XUL_DEF».
   Escala fluida entre el marco móvil (424 px) y el de escritorio (1440 px).
   ========================================================================== */

/* Fuentes alojadas en el propio servidor (sin Google Fonts). */
@font-face {
	font-family: "Bricolage Grotesque";
	src: url("../fonts/bricolage-grotesque-var.woff2") format("woff2");
	font-weight: 200 800;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "Atkinson Hyperlegible";
	src: url("../fonts/atkinson-hyperlegible-latin-400-normal.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "Atkinson Hyperlegible";
	src: url("../fonts/atkinson-hyperlegible-latin-400-italic.woff2") format("woff2");
	font-weight: 400;
	font-style: italic;
	font-display: swap;
}
@font-face {
	font-family: "Atkinson Hyperlegible";
	src: url("../fonts/atkinson-hyperlegible-latin-700-normal.woff2") format("woff2");
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

:root {
	/* Color (estilos de color de Figma) */
	--granate: #410f11;
	--malva-grafito: #6e4b46;
	--malva-medio: #7e5d57;
	--niebla: #f5e4dd;
	--papel: #fbf1ec;
	--rojo: #8a1812;
	--naranja: #eb5d2d;
	--naranja-oscuro: #b23a18;
	--blanco: #ffffff;
	--rosa-claro: #fce4db;
	--fondo: #fdfaf8;

	/* Tipografía */
	--font-display: "Bricolage Grotesque", "Arial Narrow", system-ui, sans-serif;
	--font-body: "Atkinson Hyperlegible", system-ui, -apple-system, "Segoe UI", sans-serif;

	--fs-display: clamp(3rem, 2.061rem + 3.543vw, 5.25rem);       /* 48 → 84 */
	--fs-h1: clamp(2.25rem, 1.937rem + 1.181vw, 3rem);            /* 36 → 48 */
	--fs-h2: clamp(1.625rem, 1.469rem + 0.5906vw, 2rem);          /* 26 → 32 */
	--fs-h3: clamp(1.375rem, 1.271rem + 0.3937vw, 1.625rem);      /* 22 → 26 */
	--fs-entradilla: clamp(1.25rem, 1.094rem + 0.5906vw, 1.625rem); /* 20 → 26 */
	--fs-cifras: clamp(2.625rem, 2.051rem + 2.165vw, 4rem);       /* 42 → 64 */
	--fs-etiqueta: clamp(0.8125rem, 0.7864rem + 0.09843vw, 0.875rem); /* 13 → 14 */
	--fs-cuerpo: 1rem;                                           /* 16 */
	--fs-giant: clamp(4.959rem, 0.3627rem + 17.34vw, 15.97rem);   /* 79 → 256 */

	--lh-display: clamp(52px, calc(52px + (100vw - 424px) * 0.03543), 88px);
	--lh-h1: clamp(42px, calc(42px + (100vw - 424px) * 0.01575), 58px);
	--lh-h2: clamp(32px, calc(32px + (100vw - 424px) * 0.00787), 40px);
	--lh-h3: clamp(28px, calc(28px + (100vw - 424px) * 0.00295), 31px);
	--lh-entradilla: clamp(28px, calc(28px + (100vw - 424px) * 0.00591), 34px);
	--lh-etiqueta: clamp(17px, calc(18px - (100vw - 424px) * 0.00098), 18px);
	--lh-cuerpo: 1.5;   /* Móvil 16/24; escritorio 16/20 (ver media query) */

	/* Espaciado y layout */
	--gutter: clamp(2rem, -0.2953rem + 8.661vw, 7.5rem);         /* 32 → 120 */
	--content: 75rem;                                            /* 1200 */
	--header-h: clamp(3.5rem, 2.457rem + 3.937vw, 6rem);          /* 56 → 96 */
	--radius-pill: 30px;
	--radius-card: 16px;
	--radius-hero: 55px;

	--ease: cubic-bezier(0.2, 0, 0, 1);
	--t-fast: 180ms;

	color-scheme: light;
}

@media (min-width: 64rem) {
	:root { --lh-cuerpo: 1.25; }
}

/* --------------------------------------------------------------------------
   Reset mínimo
   -------------------------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-padding-top: calc(var(--header-h) + 1rem); }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
body {
	margin: 0;
	background: var(--papel);
	color: var(--granate);
	font-family: var(--font-body);
	font-size: calc(var(--fs-cuerpo) * var(--a11y-fs, 1));
	line-height: calc(var(--lh-cuerpo) * var(--a11y-fs, 1));
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
img, svg, video { display: block; max-width: 100%; height: auto; }
a { color: inherit; }
button { font: inherit; color: inherit; }
h1, h2, h3, h4, p, ul, ol, figure, blockquote { margin: 0; }
ul[role="list"], ol[role="list"] { list-style: none; padding: 0; }

/* --------------------------------------------------------------------------
   Accesibilidad
   -------------------------------------------------------------------------- */
.screen-reader-text, .sr-only {
	position: absolute !important;
	width: 1px; height: 1px;
	padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0, 0, 0, 0);
	white-space: nowrap; border: 0;
}
.skip-link {
	position: absolute;
	left: 1rem; top: -100px;
	z-index: 1000;
	padding: 0.75rem 1.25rem;
	background: var(--granate);
	color: var(--blanco);
	font-weight: 700;
	border-radius: var(--radius-pill);
	text-decoration: none;
}
.skip-link:focus { top: 1rem; }
:focus-visible {
	outline: 3px solid var(--naranja);
	outline-offset: 3px;
	border-radius: 4px;
}
.on-dark :focus-visible, .site-footer :focus-visible, .megamenu :focus-visible { outline-color: var(--blanco); }

/* --------------------------------------------------------------------------
   Tipografía (estilos de texto de Figma)
   -------------------------------------------------------------------------- */
.t-display, .t-h1, .t-h2, .t-h3, .t-cifras, h1, h2, h3 {
	font-family: var(--font-display);
	font-weight: 700;
}
.t-display { font-size: calc(var(--fs-display) * var(--a11y-fs, 1)); line-height: calc(var(--lh-display) * var(--a11y-fs, 1)); }
.t-h1, h1 { font-size: calc(var(--fs-h1) * var(--a11y-fs, 1)); line-height: calc(var(--lh-h1) * var(--a11y-fs, 1)); }
.t-h2, h2 { font-size: calc(var(--fs-h2) * var(--a11y-fs, 1)); line-height: calc(var(--lh-h2) * var(--a11y-fs, 1)); }
.t-h3, h3 { font-size: calc(var(--fs-h3) * var(--a11y-fs, 1)); line-height: calc(var(--lh-h3) * var(--a11y-fs, 1)); }
.t-cifras { font-size: calc(var(--fs-cifras) * var(--a11y-fs, 1)); line-height: 1.05; }
.t-entradilla { font-size: calc(var(--fs-entradilla) * var(--a11y-fs, 1)); line-height: calc(var(--lh-entradilla) * var(--a11y-fs, 1)); font-family: var(--font-body); font-weight: 400; }
.t-etiqueta {
	font-family: var(--font-body);
	font-weight: 700;
	font-size: calc(var(--fs-etiqueta) * var(--a11y-fs, 1));
	line-height: calc(var(--lh-etiqueta) * var(--a11y-fs, 1));
	letter-spacing: 0.14em;
	text-transform: uppercase;
}
.t-accent { color: var(--rojo); }

/* --------------------------------------------------------------------------
   Layout
   -------------------------------------------------------------------------- */
.container {
	width: 100%;
	max-width: calc(var(--content) + 2 * var(--gutter));
	margin-inline: auto;
	padding-inline: var(--gutter);
}

/* --------------------------------------------------------------------------
   Componentes: etiqueta (píldora), CTA, enlace con flecha
   -------------------------------------------------------------------------- */
.pill {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 32px;
	padding: 1px 10px 0;
	border: 1px solid var(--naranja);
	border-radius: var(--radius-pill);
	color: var(--naranja);
}
.on-dark .pill { color: var(--blanco); }

/* Flecha del Figma (componente «Flecha»): línea de 24 px y punta. */
.arrow {
	display: inline-block;
	flex: none;
	width: 24px;
	height: 10px;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 10'%3E%3Cpath d='M0 5h22.5M18.5 1l4 4-4 4' fill='none' stroke='%23000' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'/%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 10'%3E%3Cpath d='M0 5h22.5M18.5 1l4 4-4 4' fill='none' stroke='%23000' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
	transition: transform var(--t-fast) var(--ease);
}

/* CTA (componentes CTA-Rojo y CTA-Naranja, con su variante Hover). */
.cta {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 44px;
	padding: 12px 24px;
	border: 0;
	border-radius: var(--radius-pill);
	font-family: var(--font-body);
	font-weight: 700;
	font-size: calc(1rem * var(--a11y-fs, 1));
	line-height: 1.25;
	text-decoration: none;
	cursor: pointer;
	transition: background-color var(--t-fast) var(--ease), color var(--t-fast) var(--ease);
}
.cta:hover .arrow, .cta:focus-visible .arrow { transform: translateX(3px); }
/* CTA-Rojo: rojo XUL → naranja vivo. */
.cta--rojo { background: var(--rojo); color: var(--blanco); }
.cta--rojo:hover, .cta--rojo:focus-visible { background: var(--naranja); }
/* CTA-Naranja: blanco con texto rojo → naranja vivo con texto blanco. */
.cta--blanco { background: var(--blanco); color: var(--rojo); }
.cta--blanco:hover, .cta--blanco:focus-visible { background: var(--naranja); color: var(--blanco); }

/* Botón memorias: enlace subrayado con flecha, granate → naranja. */
.link-arrow {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-weight: 700;
	color: var(--granate);
	text-decoration: underline;
	text-underline-offset: 3px;
	transition: color var(--t-fast) var(--ease);
}
.link-arrow:hover, .link-arrow:focus-visible { color: var(--naranja); }

/* --------------------------------------------------------------------------
   Cabecera
   -------------------------------------------------------------------------- */
.site-header {
	position: sticky;
	top: 0;
	z-index: 50;
	height: var(--header-h);
	background: var(--blanco);
}
.site-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 100%;
}
.brand { display: inline-flex; color: var(--rojo); }
.brand svg { width: clamp(72px, 57px + 3.5vw, 113px); height: auto; }

.menu-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 48px; height: 48px;
	margin-right: -8px;
	padding: 0;
	border: 0;
	background: none;
	color: var(--rojo);
	cursor: pointer;
}
.menu-toggle__bars, .menu-toggle__bars::before, .menu-toggle__bars::after {
	display: block;
	width: clamp(24px, 19px + 1.1vw, 32px);
	height: clamp(2.2px, 1.9px + 0.08vw, 3px);
	background: currentColor;
	border-radius: 2px;
	transition: transform var(--t-fast) var(--ease), background-color var(--t-fast) var(--ease);
}
.menu-toggle__bars { position: relative; }
.menu-toggle__bars::before, .menu-toggle__bars::after { content: ""; position: absolute; left: 0; }
.menu-toggle__bars::before { top: clamp(-9px, -6px - 0.3vw, -6.7px); }
.menu-toggle__bars::after { top: clamp(6.7px, 6px + 0.3vw, 9px); }
.menu-toggle:hover { color: var(--naranja); }

/* --------------------------------------------------------------------------
   Megamenú (marcos «Megamenú» y «XUL - Megamenú - Mobile»)
   -------------------------------------------------------------------------- */
.megamenu {
	position: fixed;
	inset: 0;
	z-index: 100;
	display: flex;
	flex-direction: column;
	background: var(--rojo);
	color: var(--blanco);
	overflow-y: auto;
	opacity: 0;
	visibility: hidden;
	transition: opacity 240ms var(--ease), visibility 0s linear 240ms;
}
.megamenu.is-open { opacity: 1; visibility: visible; transition: opacity 240ms var(--ease); }
.megamenu__top {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	padding-top: clamp(62px, calc(62px + (100vw - 424px) * 0.01575), 78px);
}
.megamenu__top .brand { color: var(--blanco); }
.megamenu__top .brand svg { width: clamp(83.7px, calc(83.7px + (100vw - 424px) * 0.02884), 113px); }
/* El aspa mide 17 px en móvil y 40 px (trazo de 4 px) en escritorio; el área táctil se amplía con el padding. */
.megamenu__close {
	display: inline-flex; align-items: center; justify-content: center;
	padding: 12px;
	margin: calc(-12px + clamp(-6.35px, calc(0px - (100vw - 424px) * 0.00625), 0px)) calc(-12px - clamp(1px, calc(1px + (100vw - 424px) * 0.00133), 2.35px)) 0 0;
	margin-bottom: -100px; /* no suma altura a la franja superior */
	border: 0; background: none; color: var(--blanco); cursor: pointer;
}
.megamenu__close svg { display: block; width: clamp(19px, calc(19px + (100vw - 424px) * 0.02530), 44.7px); height: auto; }
/* Móvil (Figma): enlaces a 160 px, contacto 100 px debajo y sello más abajo, a la izquierda. */
.megamenu__body {
	flex: 1;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	padding-top: clamp(74px, calc(74px + (100vw - 424px) * 0.01535), 89.6px);
	padding-bottom: clamp(48px, calc(48px + (100vw - 424px) * 0.08169), 131px);
}
.megamenu__body .megamenu__contact { margin-top: clamp(100.4px, calc(100.4px + (100vw - 424px) * 0.06752), 169px); margin-left: clamp(0px, calc(5px - (100vw - 424px) * 0.00492), 5px); }
.megamenu__body .megamenu__seal { margin: 118px 0 0 3px; } /* 172 px menos el selector de idioma */
/* Escritorio: contacto a la izquierda y sello a la derecha, en la misma franja. */
@media (min-width: 64rem) {
	.megamenu__body { display: grid; grid-template-columns: 1fr auto; align-content: start; column-gap: 2rem; }
	.megamenu__body .megamenu__seal { margin: calc(169px + 46px) 0 0; align-self: start; }
}
.megamenu__nav { grid-column: 1 / -1; }
.megamenu__nav ul { display: flex; flex-direction: column; gap: 16px; margin: 0; padding: 0; list-style: none; }
.megamenu__nav a {
	display: inline-block;
	font-family: var(--font-display);
	font-weight: 300;
	font-size: calc(clamp(22px, calc(22px + (100vw - 424px) * 0.02559), 48px) * var(--a11y-fs, 1));
	line-height: calc(clamp(28.19px, calc(28.19px + (100vw - 424px) * 0.02737), 56px) * var(--a11y-fs, 1));
	color: var(--blanco);
	text-decoration: none;
	transition: color var(--t-fast) var(--ease), transform var(--t-fast) var(--ease);
}
.megamenu__nav a:hover, .megamenu__nav a:focus-visible { color: var(--naranja); }
.megamenu__nav a[aria-current="page"] { text-decoration: underline; text-underline-offset: 6px; text-decoration-thickness: 2px; }
.megamenu__contact { display: flex; flex-direction: column; gap: clamp(4.8px, calc(4.8px + (100vw - 424px) * 0.00512), 10px); align-self: start; }
.megamenu__contact a {
	display: inline-flex; align-items: center; gap: clamp(5px, calc(5px + (100vw - 424px) * 0.00295), 8px);
	font-size: calc(clamp(15.03px, calc(15.03px + (100vw - 424px) * 0.00883), 24px) * var(--a11y-fs, 1));
	line-height: calc(clamp(19px, calc(19px + (100vw - 424px) * 0.01083), 30px) * var(--a11y-fs, 1));
	color: var(--blanco);
	text-decoration: none;
}
.megamenu__contact a:first-child { gap: clamp(7.5px, calc(7.5px + (100vw - 424px) * 0.00443), 12px); font-weight: 300; }
.megamenu__contact a:hover { color: var(--naranja); }
.megamenu__contact svg { width: clamp(12.53px, calc(12.53px + (100vw - 424px) * 0.00735), 20px); height: auto; color: var(--naranja); flex: none; }
.megamenu__seal { width: auto; height: clamp(72px, calc(72px + (100vw - 424px) * 0.06102), 134px); }
html.has-megamenu-open { overflow: hidden; }

/* --------------------------------------------------------------------------
   Migas de pan (antetítulo naranja «INICIO > CONOCE XUL» del Figma)
   -------------------------------------------------------------------------- */
.breadcrumbs { font-family: var(--font-body); font-weight: 700; font-size: calc(var(--fs-etiqueta) * var(--a11y-fs, 1)); line-height: 1.25; letter-spacing: 0.14em; text-transform: uppercase; color: var(--naranja); }
.breadcrumbs ol { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.25rem 0.5em; margin: 0; padding: 0; list-style: none; }
.breadcrumbs li:not(:last-child)::after { content: ">"; margin-left: 0.5em; }
.breadcrumbs a { color: inherit; text-decoration: none; }
.breadcrumbs a:hover, .breadcrumbs a:focus-visible { text-decoration: underline; text-underline-offset: 3px; }
.pill--granate { color: var(--granate); }
@media (max-width: 47.99rem) { .prefooter .pill--granate { color: var(--naranja); } } /* en los móviles del Figma la etiqueta es naranja */

/* Cabecera de páginas interiores */
.page-hero { position: relative; display: grid; min-height: clamp(416px, calc(450px - (100vw - 424px) * 0.03346), 450px); background: #d9d9d9; overflow: hidden; }
.page-hero__media, .page-hero__text { grid-area: 1 / 1; }
.page-hero h1 { font-size: calc(clamp(36px, calc(36px + (100vw - 424px) * 0.04724), 84px) * var(--a11y-fs, 1)); line-height: calc(clamp(42px, calc(42px + (100vw - 424px) * 0.04528), 88px) * var(--a11y-fs, 1)); }
.page-hero .breadcrumbs { line-height: calc(clamp(17px, calc(18px - (100vw - 424px) * 0.00098), 18px) * var(--a11y-fs, 1)); }
@media (max-width: 47.99rem) { .page-hero__text { padding-inline: 24px; } }
.page-hero__media img { width: 100%; height: 100%; object-fit: cover; }
.page-hero__text { position: relative; align-self: center; display: grid; justify-items: center; gap: clamp(8px, calc(24px - (100vw - 424px) * 0.01575), 24px); max-width: calc(895px + 2 * var(--gutter)); padding-block: 3rem; text-align: center; transform: translateY(clamp(-24px, calc(-24px + (100vw - 424px) * 0.02362), 0px)); }

/* --------------------------------------------------------------------------
   Bloque «¿Hablamos?» previo al pie
   -------------------------------------------------------------------------- */
.prefooter { position: relative; overflow: hidden; padding-block: clamp(71px, calc(71px + (100vw - 424px) * 0.04626), 118px) clamp(48px, calc(48px + (100vw - 424px) * 0.12697), 177px); }
.prefooter__giant {
	position: absolute;
	left: 50%;
	bottom: clamp(0px, calc(0px + (100vw - 424px) * 0.03248), 33px);
	transform: translateX(-50%);
	margin: 0;
	font-family: var(--font-display);
	font-weight: 600;
	font-size: calc(clamp(79.34px, calc(79.34px + (100vw - 424px) * 0.17344), 255.55px) * var(--a11y-fs, 1));
	line-height: calc(clamp(83px, calc(83px + (100vw - 424px) * 0.18209), 268px) * var(--a11y-fs, 1));
	color: var(--niebla);
	white-space: nowrap;
	pointer-events: none;
	user-select: none;
}
.prefooter__inner { position: relative; display: grid; gap: 3rem; align-items: start; }
@media (min-width: 64rem) { .prefooter__inner { grid-template-columns: 1fr auto; } }
.prefooter__text { position: relative; z-index: 1; display: grid; justify-items: start; gap: 16px; max-width: 56rem; }
.prefooter__text > * { margin: 0; }
.prefooter__text h2 + p { margin-top: clamp(-9px, calc(0px - (100vw - 424px) * 0.00886), 0px); }
.prefooter__direct { display: grid; gap: clamp(12px, calc(16px - (100vw - 424px) * 0.00394), 16px); margin-top: clamp(16px, calc(32px - (100vw - 424px) * 0.01575), 32px); }
.prefooter__direct + p { margin-top: clamp(-4px, calc(0px - (100vw - 424px) * 0.00394), 0px); }
.prefooter__direct a {
	display: inline-flex; align-items: center; gap: 10px;
	font-weight: 700; color: #000; text-decoration: none; width: fit-content;
}
.prefooter__direct a:hover { color: var(--rojo); text-decoration: underline; }
.prefooter__direct svg { width: 16px; color: var(--rojo); flex: none; }
.prefooter .cities-wrap { margin-top: clamp(16px, calc(24px - (100vw - 424px) * 0.00787), 24px); }
.prefooter .cities { font-size: calc(clamp(15.6px, calc(15.6px + (100vw - 424px) * 0.00039), 16px) * var(--a11y-fs, 1)); line-height: calc(clamp(19px, calc(19px + (100vw - 424px) * 0.00098), 20px) * var(--a11y-fs, 1)); }
/* Sello: a la derecha del bloque de contacto en móvil, a la derecha del texto en escritorio. */
.prefooter__seal { position: absolute; top: 195px; right: 42px; width: 143px; height: auto; transform: rotate(8deg); color: var(--granate); overflow: visible; }
@media (min-width: 48rem) { .prefooter__seal { position: static; width: clamp(162px, calc(162px + (100vw - 424px) * 0.17913), 344px); justify-self: end; margin-top: 7px; } }
.prefooter__seal text { font-family: var(--font-display); font-size: calc(21px * var(--a11y-fs, 1)); font-weight: 500; fill: var(--rojo); letter-spacing: 0.02em; }
.prefooter__seal-ring { transform-origin: 150px 150px; animation: xul-spin 40s linear infinite; }
@keyframes xul-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .prefooter__seal-ring { animation: none; } }

/* Ciudades separadas por puntos naranjas (dos filas: Andalucía / resto). */
.cities-wrap { margin-top: 1.5rem; }
.cities { display: flex; flex-wrap: wrap; align-items: center; gap: 0 8px; margin: -4px 0; padding: 0; list-style: none; }
.cities__city { display: inline-flex; align-items: center; gap: 8px; margin-block: 4px; }
.cities__city:not(:first-child)::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--naranja); flex: none; }
.cities__br { flex-basis: 100%; height: 0; }
.cities__br--three { display: none; }
.cities__br--row + .cities__city::before { display: none; }
/* Banda «Equipo» en móvil: tres ciudades por fila. */
@media (max-width: 47.99rem) {
	.cities-wrap--big .cities__br--row { display: none; }
	.cities-wrap--big .cities__br--row + .cities__city::before { display: block; }
	.cities-wrap--big .cities__br--three { display: block; }
	.cities-wrap--big .cities__br--three + .cities__city::before { display: none; }
}

/* Variante «Talento» (Conoce XUL y Equipo): sin contacto directo y sello más pequeño arriba a la derecha. */
.prefooter--talento { padding-block: clamp(51px, calc(51px + (100vw - 424px) * 0.04921), 101px) clamp(72px, calc(72px + (100vw - 424px) * 0.12697), 201px); }
.prefooter--talento .prefooter__giant { bottom: clamp(0px, calc(0px + (100vw - 424px) * 0.02165), 22px); }
.prefooter--talento .prefooter__inner, .prefooter--escribenos .prefooter__inner { position: static; }
.prefooter--talento .prefooter__text, .prefooter--escribenos .prefooter__text { gap: 32px; }
.prefooter--talento .prefooter__text h2 + p, .prefooter--escribenos .prefooter__text h2 + p { margin-top: clamp(0px, calc(0px + (100vw - 424px) * 0.02559), 26px); }
.prefooter--talento .prefooter__text, .prefooter--escribenos .prefooter__text { gap: clamp(16px, calc(16px + (100vw - 424px) * 0.01575), 32px); }
.prefooter--talento .prefooter__text h2 + p, .prefooter--escribenos .prefooter__text h2 + p { margin-top: clamp(26px, calc(32px - (100vw - 424px) * 0.00591), 32px); }
.prefooter--talento .prefooter__seal { position: absolute; top: clamp(20px, calc(20px + (100vw - 424px) * 0.14075), 163px); right: max(clamp(38.7px, calc(38.7px + (100vw - 424px) * 0.09498), 135.2px), calc(50% - 584.8px)); width: clamp(129.18px, calc(129.18px + (100vw - 424px) * 0.10120), 232px); margin: 0; }
.prefooter--talento .prefooter__seal > g:last-child, .prefooter--escribenos .prefooter__seal > g:last-child { transform: translate(150px, 150px) scale(2.77) translate(-41.5px, -12px); }
.prefooter--escribenos { padding-block: clamp(87px, calc(87px + (100vw - 424px) * 0.02067), 108px) clamp(87px, calc(87px + (100vw - 424px) * 0.11417), 203px); }
.prefooter--escribenos .prefooter__giant { bottom: clamp(0px, calc(0px + (100vw - 424px) * 0.02362), 24px); }
.prefooter--escribenos .prefooter__seal { position: absolute; top: clamp(49px, calc(49px + (100vw - 424px) * 0.11909), 170px); right: max(clamp(37.9px, calc(37.9px + (100vw - 424px) * 0.09577), 135.2px), calc(50% - 584.8px)); width: clamp(123.44px, calc(123.44px + (100vw - 424px) * 0.10685), 232px); margin: 0; }

/* --------------------------------------------------------------------------
   Pie
   -------------------------------------------------------------------------- */
.site-footer { color: var(--blanco); }
.site-footer__main {
	position: relative;
	overflow: hidden;
	background: var(--granate);
	padding-block: clamp(69px, calc(69px + (100vw - 424px) * 0.00295), 72px) clamp(35px, calc(61px - (100vw - 424px) * 0.02559), 61px);
}
.site-footer__iso {
	position: absolute;
	right: -4%;
	bottom: 0;
	width: clamp(230px, 160px + 18vw, 393px);
	color: var(--rojo);
	opacity: 0.35;
	pointer-events: none;
}
.site-footer__grid { position: relative; display: grid; gap: 56px; }
.site-footer__brand { display: grid; gap: 24px; max-width: 18rem; align-content: start; }
.site-footer__brand .brand { color: var(--blanco); }
.site-footer__brand .brand svg { width: clamp(80px, 66px + 3.3vw, 113px); }
.site-footer__cols { display: grid; grid-template-columns: 1fr 1fr; gap: 56px 16px; }
.site-footer__col h2 { margin-bottom: 15px; color: var(--naranja); }
.site-footer__col ul { display: grid; gap: 12px; margin: 0; padding: 0; list-style: none; }
.site-footer__col a, .site-footer__col address { color: var(--blanco); font-style: normal; text-decoration: none; }
.site-footer__col a:hover, .site-footer__col a:focus-visible { color: var(--naranja); text-decoration: underline; }
.site-footer__col--contact { grid-column: 1 / -1; }
.site-footer__bottom { position: relative; margin-top: clamp(56px, calc(56px + (100vw - 424px) * 0.00394), 60px); padding-top: clamp(20px, calc(21px - (100vw - 424px) * 0.00098), 21px); border-top: 1px solid var(--naranja); font-size: calc(0.875rem * var(--a11y-fs, 1)); line-height: calc(17px * var(--a11y-fs, 1)); }
.site-footer__col ul, .site-footer__brand p { line-height: calc(20px * var(--a11y-fs, 1)); }
@media (min-width: 64rem) {
	.site-footer__grid { grid-template-columns: 288px 1fr; justify-content: space-between; column-gap: 168px; }
	.site-footer__cols { grid-template-columns: 152px 124px 258px; justify-content: space-between; gap: 68px; }
	.site-footer__col--contact { grid-column: auto; }
	.site-footer__bottom { font-size: calc(1rem * var(--a11y-fs, 1)); line-height: calc(20px * var(--a11y-fs, 1)); }
	.site-footer__cols { margin-top: 16px; }
}

/* Franja blanca de sellos y subvención */
.site-footer__legal { background: var(--papel); color: #000; padding-block: clamp(44px, calc(44px + (100vw - 424px) * 0.01673), 61px) clamp(32px, calc(32px + (100vw - 424px) * 0.02559), 58px); }
.site-footer__legal-grid { display: grid; gap: 2rem; }
.site-footer__seals { display: flex; align-items: flex-start; align-self: start; gap: clamp(12px, calc(12px + (100vw - 424px) * 0.00787), 20px); margin: 0; padding: 0; list-style: none; }
.site-footer__seals img { height: clamp(66.93px, calc(66.93px + (100vw - 424px) * 0.04731), 115px); width: auto; }
.site-footer__seals li:first-child img { height: clamp(64.15px, calc(64.15px + (100vw - 424px) * 0.04513), 110px); }
.site-footer__grant { display: grid; gap: var(--grant-gap, 20px); line-height: calc(20px * var(--a11y-fs, 1)); }
.site-footer__grant p { margin: 0; }
@media (max-width: 63.99rem) { .site-footer__grant p { margin-right: -1px; } }
.site-footer__grant img { width: 100%; max-width: 744px; height: auto; }
@media (min-width: 64rem) {
	.site-footer__legal-grid { grid-template-columns: 1fr 744px; gap: 2rem; }
	.site-footer__seals { margin-top: 34px; }
}

/* --------------------------------------------------------------------------
   Contenido genérico de páginas (legales, etc.)
   -------------------------------------------------------------------------- */
.prose { max-width: 46rem; padding-bottom: clamp(3rem, 2rem + 3vw, 6rem); }
.prose > * + * { margin-top: 1em; }
.prose h2 { margin-top: 2em; }
.prose h3 { margin-top: 1.5em; }
.prose a { color: var(--rojo); text-underline-offset: 3px; }
.prose a:hover { color: var(--naranja); }
.prose table { width: 100%; border-collapse: collapse; font-size: calc(0.9375rem * var(--a11y-fs, 1)); }
.prose th, .prose td { padding: 0.6rem 0.75rem; border-bottom: 1px solid var(--niebla); text-align: left; vertical-align: top; }
.prose th { background: var(--niebla); }

/* --------------------------------------------------------------------------
   404
   -------------------------------------------------------------------------- */
.error-404 { padding-block: clamp(4rem, 2rem + 6vw, 8rem); }
.error-404 .t-display { margin-block: 1rem 1.5rem; }
.error-404__links { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 2rem; }

/* --------------------------------------------------------------------------
   Banner de cookies
   -------------------------------------------------------------------------- */
.consent {
	position: fixed;
	inset: auto 0 0 0;
	z-index: 90;
	padding: 1rem;
}
.consent__inner {
	max-width: 60rem;
	margin-inline: auto;
	padding: 1.5rem;
	background: var(--blanco);
	color: var(--granate);
	border-radius: var(--radius-card);
	box-shadow: 0 8px 32px rgb(65 15 17 / 0.18);
	display: grid;
	gap: 1rem;
}
.consent__text a { color: var(--rojo); }
.consent__actions { display: flex; flex-wrap: wrap; gap: 0.75rem; }
.consent .btn {
	flex: 1 1 10rem;
	min-height: 44px;
	padding: 10px 20px;
	border-radius: var(--radius-pill);
	font-weight: 700;
	cursor: pointer;
	transition: background-color var(--t-fast) var(--ease), color var(--t-fast) var(--ease);
}
/* Rechazar y aceptar con el mismo peso visual (criterio AEPD). */
.consent .btn--outline { background: var(--blanco); color: var(--rojo); border: 2px solid var(--rojo); }
.consent .btn--primary { background: var(--rojo); color: var(--blanco); border: 2px solid var(--rojo); }
.consent .btn:hover { background: var(--naranja); border-color: var(--naranja); color: var(--blanco); }
.consent__settings fieldset { border: 0; margin: 0 0 1rem; padding: 0; display: grid; gap: 0.5rem; }
.consent__settings legend { font-weight: 700; margin-bottom: 0.5rem; }
.consent__settings label { display: flex; gap: 0.5rem; align-items: center; }
.consent__settings input { width: 1.125rem; height: 1.125rem; accent-color: var(--rojo); }
.consent-reopen { background: none; border: 0; padding: 0; color: var(--blanco); cursor: pointer; font: inherit; line-height: inherit; text-align: left; white-space: nowrap; }
.consent-reopen:hover, .consent-reopen:focus-visible { color: var(--naranja); text-decoration: underline; }

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; }
}

/* Selector de idioma del megamenú («es/en»; Figma: «esp/eng»). */
.megamenu__lang { display: flex; align-items: center; gap: 0; margin: clamp(24px, calc(34px - (100vw - 424px) * 0.00984), 34px) 0 0 clamp(0px, calc(5px - (100vw - 424px) * 0.00492), 5px); font-family: var(--font-display); font-weight: 300; font-size: calc(clamp(20.05px, calc(20.05px + (100vw - 424px) * 0.01176), 32px) * var(--a11y-fs, 1)); line-height: 1; color: var(--blanco); }
.megamenu__lang a { color: var(--naranja); text-decoration: none; }
.megamenu__lang a:hover, .megamenu__lang a:focus-visible { color: var(--blanco); text-decoration: underline; text-underline-offset: 4px; }
@media (min-width: 64rem) {
	.megamenu__body .megamenu__lang { grid-column: 1; }
	.megamenu__body .megamenu__seal { grid-column: 2; grid-row: 2 / span 2; }
}
.legal__note { margin: 0 0 32px; padding: 12px 16px; border-left: 3px solid var(--naranja); background: var(--niebla); font-size: calc(14px * var(--a11y-fs, 1)); line-height: calc(20px * var(--a11y-fs, 1)); }
.legal__note a { color: inherit; }

/* --------------------------------------------------------------------------
   Botones flotantes: volver arriba y accesibilidad (abajo a la derecha)
   -------------------------------------------------------------------------- */
.fab {
	--fab-size: 48px;
	--fab-gap: 16px;
	position: fixed;
	right: max(var(--fab-gap), env(safe-area-inset-right));
	bottom: max(var(--fab-gap), env(safe-area-inset-bottom));
	z-index: 80;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 16px;
	pointer-events: none;
	transition: bottom var(--t-fast) var(--ease);
}
@media (min-width: 48rem) { .fab { --fab-size: 56px; --fab-gap: 24px; } }
/* El aviso de cookies solo tapa los botones cuando ocupa todo el ancho. */
@media (max-width: 61.99rem) {
	.fab { bottom: calc(max(var(--fab-gap), env(safe-area-inset-bottom)) + var(--fab-lift, 0px)); }
}
.fab > * { pointer-events: auto; }
html.has-megamenu-open .fab { visibility: hidden; }

.fab__btn {
	position: relative;
	display: grid;
	place-items: center;
	inline-size: var(--fab-size);
	block-size: var(--fab-size);
	margin: 0;
	padding: 0;
	border: 2px solid var(--blanco);
	border-radius: 16px;
	background: var(--rojo);
	color: var(--blanco);
	cursor: pointer;
	appearance: none;
	box-shadow: 0 6px 18px rgb(65 15 17 / 0.3);
	transition: background-color var(--t-fast) var(--ease), transform var(--t-fast) var(--ease), opacity var(--t-fast) var(--ease), visibility var(--t-fast);
}
/* Icono siempre blanco (no depende del color heredado). */
.fab .fab__btn svg { inline-size: 26px; block-size: 26px; color: #fff; }
.fab .fab__btn svg [fill="currentColor"] { fill: #fff !important; }
.fab .fab__btn svg [stroke="currentColor"] { stroke: #fff !important; }
.fab .fab__btn--a11y svg { inline-size: 34px; block-size: 34px; }
.fab__btn:hover, .fab__btn[aria-expanded="true"] { background: var(--granate); }
.fab__btn:focus-visible { outline: 3px solid var(--naranja); outline-offset: 3px; }
.fab__btn--top[hidden] { display: grid; opacity: 0; visibility: hidden; transform: translateY(8px); }
@media (prefers-reduced-motion: no-preference) {
	.fab__btn:hover { transform: translateY(-2px); }
}

/* Etiqueta visible al pasar el ratón o con el teclado (en pantallas con ratón). */
.fab__tip {
	position: absolute;
	right: calc(100% + 12px);
	top: 50%;
	padding: 6px 12px;
	border-radius: var(--radius-pill);
	background: var(--granate);
	color: var(--blanco);
	font-family: var(--font-body);
	font-size: 0.875rem;
	font-weight: 700;
	line-height: 1.3;
	white-space: nowrap;
	pointer-events: none;
	opacity: 0;
	transform: translate(4px, -50%);
	transition: opacity var(--t-fast) var(--ease), transform var(--t-fast) var(--ease);
}
@media (hover: hover) {
	.fab__btn:hover .fab__tip, .fab__btn:focus-visible .fab__tip { opacity: 1; transform: translate(0, -50%); }
}
.fab__btn[aria-expanded="true"] .fab__tip { opacity: 0; }

/* Panel */
.a11y-panel {
	position: absolute;
	right: 0;
	bottom: calc(var(--fab-size) + 16px);
	inline-size: min(340px, calc(100vw - 2 * var(--fab-gap)));
	max-block-size: calc(100dvh - var(--fab-size) - 2 * var(--fab-gap) - 16px - var(--fab-lift, 0px));
	
	overflow: auto;
	overscroll-behavior: contain;
	padding: 20px;
	background: var(--blanco);
	color: var(--granate);
	border-radius: var(--radius-card);
	box-shadow: 0 12px 40px rgb(65 15 17 / 0.24);
	font-family: var(--font-body);
	font-size: calc(1rem * var(--a11y-fs, 1));
	line-height: 1.4;
	letter-spacing: normal;
	word-spacing: normal;
	text-align: left;
}
.a11y-panel[hidden] { display: none; }
.a11y-panel__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.a11y-panel__title { margin: 0; font-family: var(--font-display); font-size: calc(1.5rem * var(--a11y-fs, 1)); line-height: 1.2; font-weight: 600; }
.a11y-panel__close {
	display: grid; place-items: center; inline-size: 44px; block-size: 44px; margin: -10px -10px -10px 0;
	padding: 0; border: 0; border-radius: 50%; background: transparent; color: var(--granate); cursor: pointer;
}
.a11y-panel__close:hover { background: var(--niebla); }
.a11y-panel__intro { margin: 8px 0 16px; font-size: calc(0.875rem * var(--a11y-fs, 1)); color: var(--malva-grafito); }
.a11y-panel__label { margin: 0 0 8px; font-weight: 700; }
.a11y-panel__group { margin-bottom: 8px; }

.a11y-seg { display: grid; grid-template-columns: repeat(3, 1fr); padding: 4px; gap: 4px; background: var(--papel); border-radius: var(--radius-pill); }
.a11y-seg__btn {
	min-block-size: 40px; padding: 0 8px; border: 0; border-radius: var(--radius-pill);
	background: transparent; color: var(--granate); font: inherit; font-weight: 700; cursor: pointer;
}
.a11y-seg__btn:hover { background: var(--niebla); }
.a11y-seg__btn[aria-pressed="true"] { background: var(--rojo); color: var(--blanco); }

.a11y-panel__list { list-style: none; margin: 0; padding: 0; }
.a11y-panel__list li + li { border-top: 1px solid var(--niebla); }
.a11y-switch {
	display: flex; align-items: center; justify-content: space-between; gap: 16px; inline-size: 100%;
	padding: 12px 0; border: 0; background: transparent; color: inherit; font: inherit; text-align: left; cursor: pointer;
}
.a11y-switch__text { display: grid; gap: 2px; }
.a11y-switch__name { font-weight: 700; }
.a11y-switch__desc { font-size: calc(0.8125rem * var(--a11y-fs, 1)); color: var(--malva-grafito); }
.a11y-switch__track {
	flex: none; position: relative; inline-size: 44px; block-size: 26px; border-radius: 13px;
	background: var(--malva-medio); transition: background-color var(--t-fast) var(--ease);
}
.a11y-switch__thumb {
	position: absolute; inset-block-start: 3px; inset-inline-start: 3px; inline-size: 20px; block-size: 20px;
	border-radius: 50%; background: var(--blanco); transition: transform var(--t-fast) var(--ease);
}
.a11y-switch[aria-pressed="true"] .a11y-switch__track { background: var(--rojo); }
.a11y-switch[aria-pressed="true"] .a11y-switch__thumb { transform: translateX(18px); }
.a11y-switch:hover .a11y-switch__name { text-decoration: underline; text-underline-offset: 0.18em; }
.a11y-panel :focus-visible { outline: 3px solid var(--naranja-oscuro); outline-offset: 2px; }

.a11y-panel__reset {
	margin-top: 12px; inline-size: 100%; min-block-size: 44px; padding: 10px 20px;
	border: 1px solid var(--rojo); border-radius: var(--radius-pill); background: transparent;
	color: var(--rojo); font: inherit; font-weight: 700; cursor: pointer;
}
.a11y-panel__reset:hover { background: var(--rojo); color: var(--blanco); }

/* --------------------------------------------------------------------------
   Preferencias de lectura (clases en <html>, guardadas en el navegador)
   -------------------------------------------------------------------------- */
/* Tamaño del texto: todas las font-size y line-height del tema van multiplicadas por
   --a11y-fs. Solo crece el texto (no la maqueta), así no aparece scroll horizontal. */
:root { --a11y-fs: 1; }
html.a11y-text-1 { --a11y-fs: 1.1; }
html.a11y-text-2 { --a11y-fs: 1.2; }
/* Las palabras gigantes decorativas y el propio panel no cambian. */
html :is(.cases__giant, .prefooter__giant, .thanks__giant, .values__giant, .fab) { --a11y-fs: 1; }

/* Alto contraste: el naranja y los grises suben hasta AA sobre fondos claros. */
html.a11y-contrast {
	--naranja: #b23a18;
	--malva-medio: #5c3f3a;
	--malva-grafito: #4a2f2b;
}
html.a11y-contrast :is(.on-dark, .site-footer__main, .megamenu, .band--rojo, .band--granate) { --naranja: #eb5d2d; }
html.a11y-contrast .page-hero { --naranja: #9a2c12; }
html.a11y-contrast :is(.img-placeholder, .service-card, .case, .tile) { background-color: #4a4a4a; }
html.a11y-contrast .case { --naranja: #ffc4ad; }
html.a11y-contrast :focus-visible { outline-width: 4px; }
html.a11y-contrast ::placeholder { color: var(--malva-grafito); opacity: 1; }

/* Subrayar enlaces. */
html.a11y-links a:not(.brand) { text-decoration: underline !important; text-decoration-thickness: 2px !important; text-underline-offset: 0.2em !important; }

/* Espaciado del texto (WCAG 1.4.12). */
html.a11y-spacing body :is(p, li, dd, dt, label, blockquote, td, th, figcaption, summary):not(.fab *) {
	line-height: 1.5 !important;
	letter-spacing: 0.12em !important;
	word-spacing: 0.16em !important;
}
html.a11y-spacing body p:not(.fab *) { margin-block-end: 2em; }
html.a11y-spacing body p:not(.fab *):last-child { margin-block-end: 0; }

/* Tipografía de lectura en toda la web. */
html.a11y-font { --font-display: var(--font-body); }

/* Detener animaciones y transiciones. */
html.a11y-motion { scroll-behavior: auto !important; }
html.a11y-motion *, html.a11y-motion *::before, html.a11y-motion *::after {
	animation-duration: 0.001ms !important;
	animation-iteration-count: 1 !important;
	transition-duration: 0.001ms !important;
	scroll-behavior: auto !important;
}

@media print { .fab { display: none !important; } }