/*
 * CapFat — modo responsive de la portada.
 *
 * Se activa por debajo de HD (menos de 1366 px de ancho o 600 px de alto
 * útil): html.capfat-responsive, puesto por header.php y frame.js. Encima
 * de ese umbral manda el lienzo 1920 x 900 y nada de este archivo aplica.
 *
 * Concepto: "el muro". Scroll vertical normal sobre la pared de CAPFAT,
 * con la obra como protagonista:
 *   - la obra del hero aparece directamente;
 *   - una gota de pintura baja por el borde izquierdo con el scroll;
 *   - accesos pequeños que aparecen en la barra izquierda al avanzar;
 *   - servicios y proceso en carriles con imán;
 *   - cada servicio se abre como hoja deslizable;
 *   - Trabajos se vuelve galería nocturna;
 *   - títulos que aparecen como un trazo de spray.
 *
 * Todo cuelga de html.capfat-responsive body.capfat-front-page para
 * ganar a las reglas de escritorio sin !important salvo donde los scripts
 * escriben estilos en línea.
 */

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

html.capfat-responsive {
	--r-gutter: 20px;
	--r-header: 60px;
	--r-wall: #ece4df;
	--r-wall-deep: #e3d8d2;
	--r-ink: #121110;
	--r-night: #131110;
	--r-orange: #e84b00;
	--r-ease: cubic-bezier(0.22, 0.8, 0.2, 1);
	scroll-padding-top: var(--r-header);
	-webkit-text-size-adjust: 100%;
}

/* El scroll sigue al dedo; el navegador decide el encaje al soltar. */
html.capfat-responsive.capfat-boundary-snap {
	scroll-snap-type: y mandatory;
}

html.capfat-responsive.capfat-boundary-snap body.capfat-front-page .home-horizontal > .h-screen,
html.capfat-responsive.capfat-boundary-snap body.capfat-front-page .capfat-msign {
	scroll-snap-align: start;
}

html.capfat-responsive body.capfat-front-page {
	background: var(--r-wall);
	overflow-x: hidden;
	-webkit-tap-highlight-color: rgba(232, 75, 0, 0.12);
}

html.capfat-responsive body.capfat-front-page .site-main {
	padding-top: 0;
}

/* La estructura del carrusel pasa a ser flujo normal. */
html.capfat-responsive body.capfat-front-page .home-horizontal-shell,
html.capfat-responsive body.capfat-front-page .home-horizontal-viewport,
html.capfat-responsive body.capfat-front-page .home-horizontal {
	display: block;
	position: relative;
	width: auto;
	height: auto;
	overflow: visible;
	transform: none !important;
}

html.capfat-responsive body.capfat-front-page .h-screen {
	position: relative;
	isolation: isolate;
	display: block;
	width: auto;
	height: auto;
	min-height: 0;
	margin: 0;
	padding: 0;
	overflow: hidden;
	background: var(--r-wall) var(--capfat-fondo-base) center top / cover no-repeat;
	transform: none !important;
	opacity: 1 !important;
	visibility: visible !important;
}

/* Escenarios 1920 x 900 → contenido que fluye. */
html.capfat-responsive body.capfat-front-page .capfat-hero-viewport,
html.capfat-responsive body.capfat-front-page .capfat-hero-scaler,
html.capfat-responsive body.capfat-front-page .capfat-hero-stage,
html.capfat-responsive body.capfat-front-page .capfat-services-viewport,
html.capfat-responsive body.capfat-front-page .capfat-services-scaler,
html.capfat-responsive body.capfat-front-page .capfat-services-stage,
html.capfat-responsive body.capfat-front-page .capfat-works-viewport,
html.capfat-responsive body.capfat-front-page .capfat-works-scaler,
html.capfat-responsive body.capfat-front-page .capfat-works-stage,
html.capfat-responsive body.capfat-front-page .capfat-process-viewport,
html.capfat-responsive body.capfat-front-page .capfat-process-scaler,
html.capfat-responsive body.capfat-front-page .capfat-process-stage,
html.capfat-responsive body.capfat-front-page .capfat-special-viewport,
html.capfat-responsive body.capfat-front-page .capfat-special-scaler,
html.capfat-responsive body.capfat-front-page .capfat-special-stage {
	position: relative;
	display: block;
	width: auto !important;
	height: auto !important;
	min-height: 0;
	overflow: visible;
	background: none;
	transform: none !important;
	will-change: auto;
}

html.capfat-responsive body.capfat-front-page .vertical-pager,
html.capfat-responsive body.capfat-front-page .vertical-panel {
	position: relative;
	display: block;
	height: auto;
	min-height: 0;
	overflow: visible;
	background: none;
	transform: none !important;
	opacity: 1 !important;
	visibility: visible !important;
}

html.capfat-responsive body.capfat-front-page .container {
	width: auto;
	max-width: none;
	padding-inline: var(--r-gutter);
}

/* Piezas de escritorio que no tienen sentido en vertical. */
html.capfat-responsive body.capfat-front-page .horizontal-controls,
html.capfat-responsive body.capfat-front-page .vertical-pagination,
html.capfat-responsive body.capfat-front-page .capfat-home-hero__pager,
html.capfat-responsive body.capfat-front-page .capfat-home-hero__signature,
html.capfat-responsive body.capfat-front-page .capfat-home-hero__vertical-label,
html.capfat-responsive body.capfat-front-page .capfat-nav-preview,
html.capfat-responsive body.capfat-front-page .site-nav,
html.capfat-responsive body.capfat-front-page .site-header__cta,
html.capfat-responsive .capfat-global-equalizer {
	display: none !important;
}

html.capfat-responsive body.capfat-front-page .capfat-home-hero > .capfat-web-credit--hero {
	position: relative;
	top: auto;
	left: auto;
	right: auto;
	bottom: auto;
	justify-content: center;
	width: 100%;
	margin: 14px 0 0;
	transform: none;
	color: #000000;
	text-shadow: none;
}

html.capfat-responsive body.capfat-front-page .capfat-web-credit--hero img {
	filter: brightness(0);
	opacity: 1;
}

html.capfat-responsive body.capfat-front-page img {
	max-width: 100%;
}

/* Botones a tamaño de dedo. */
html.capfat-responsive body.capfat-front-page .button {
	min-height: 48px;
	padding: 0.85rem 1.4rem;
	font-size: 13px;
}

/* ================================================================ */
/* Capa decorativa: solo unas piezas, recolocadas para el muro vertical */
/* ================================================================ */

html.capfat-responsive body.capfat-front-page .capfat-decor__canvas {
	inset: 0;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	aspect-ratio: auto;
	transform: none;
}

html.capfat-responsive body.capfat-front-page .capfat-decor__piece {
	display: none;
}

html.capfat-responsive body.capfat-front-page .capfat-decor__piece[data-decor$="/numero"],
html.capfat-responsive body.capfat-front-page .capfat-decor__piece[data-decor$="/estallido-id"],
html.capfat-responsive body.capfat-front-page .capfat-decor__piece[data-decor$="/tag"],
html.capfat-responsive body.capfat-front-page .capfat-decor__piece[data-decor$="/sup-der-rojo"],
html.capfat-responsive body.capfat-front-page .capfat-decor__piece[data-decor$="/der-naranja"],
html.capfat-responsive body.capfat-front-page .capfat-decor__piece[data-decor$="/esquina-sd"],
html.capfat-responsive body.capfat-front-page .capfat-decor__piece[data-decor$="/izq-goteo-rojo"],
html.capfat-responsive body.capfat-front-page .capfat-decor__piece[data-decor$="/izq-naranja"],
html.capfat-responsive body.capfat-front-page .capfat-decor__piece[data-decor$="/izq-salpicadura"] {
	display: block;
	opacity: 1 !important;
	visibility: visible !important;
	transform: none !important;
}

/* El número de la sección, grande y detrás del título. */
html.capfat-responsive body.capfat-front-page .capfat-decor__piece[data-decor$="/numero"] {
	top: 14px !important;
	left: auto !important;
	right: 8px;
	width: min(34vw, 190px) !important;
	opacity: 0.55 !important;
}

/* Estallido de tinta abajo a la derecha. */
html.capfat-responsive body.capfat-front-page .capfat-decor__piece[data-decor$="/estallido-id"] {
	top: auto !important;
	bottom: -6px;
	left: auto !important;
	right: -14px;
	width: min(52vw, 300px) !important;
	opacity: 0.9 !important;
}

/* Remates de esquina superior derecha. */
html.capfat-responsive body.capfat-front-page .capfat-decor__piece[data-decor$="/sup-der-rojo"],
html.capfat-responsive body.capfat-front-page .capfat-decor__piece[data-decor$="/der-naranja"],
html.capfat-responsive body.capfat-front-page .capfat-decor__piece[data-decor$="/esquina-sd"] {
	top: 0 !important;
	left: auto !important;
	right: 0;
	width: min(16vw, 96px) !important;
}

html.capfat-responsive body.capfat-front-page .capfat-decor__piece[data-decor$="/tag"] {
	display: none;
}

html.capfat-responsive body.capfat-front-page .about-hero > .capfat-decor {
	height: 100%;
	bottom: 0;
}

html.capfat-responsive body.capfat-front-page .about-hero .capfat-decor__piece[data-decor="sobre-dime/der-naranja"] {
	top: auto !important;
	bottom: 0;
}

/* Goteos del borde izquierdo. */
html.capfat-responsive body.capfat-front-page .capfat-decor__piece[data-decor$="/izq-goteo-rojo"],
html.capfat-responsive body.capfat-front-page .capfat-decor__piece[data-decor$="/izq-naranja"],
html.capfat-responsive body.capfat-front-page .capfat-decor__piece[data-decor$="/izq-salpicadura"] {
	top: 34% !important;
	left: 0 !important;
	width: min(9vw, 54px) !important;
	opacity: 0.85 !important;
}

/* ================================================================ */
/* Cabecera                                                           */
/* ================================================================ */

html.capfat-responsive body.capfat-front-page .site-header {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 460;
	width: 100%;
	background: rgba(236, 228, 223, 0.94);
	border-bottom: 1px solid rgba(17, 17, 17, 0.06);
	box-shadow: none;
	backdrop-filter: none;
	transition: background-color 0.35s ease, border-color 0.35s ease;
}

html.capfat-responsive body.capfat-front-page.admin-bar .site-header {
	top: 46px;
}

html.capfat-responsive body.capfat-front-page .site-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 6px;
	max-width: none;
	min-height: var(--r-header);
	padding: 6px 12px 6px var(--r-gutter);
}

html.capfat-responsive body.capfat-front-page .site-branding {
	margin-right: auto;
}

html.capfat-responsive body.capfat-front-page .site-branding__logo {
	width: 104px;
	height: 36px;
	max-width: 104px;
	max-height: 36px;
}

html.capfat-responsive body.capfat-front-page .site-branding__home-label {
	display: none;
}

html.capfat-responsive body.capfat-front-page .site-header__navigation {
	display: flex;
	align-items: center;
	position: static;
	margin: 0;
}

/* El altavoz pasa a la cabecera, junto al menú (sound-toggle.js coloca
   su panel líquido respecto al botón, esté donde esté). */
html.capfat-responsive body.capfat-front-page .site-header__navigation .sound-toggle {
	position: relative !important;
	top: auto !important;
	right: auto !important;
	left: auto !important;
	flex: 0 0 auto;
	width: 44px;
	height: 44px;
	margin: 0;
	transform: none;
	animation-name: capfat-sound-icon-pulse-inline;
}

html.capfat-responsive body.capfat-front-page .site-header__navigation .sound-toggle.is-playing {
	animation: none;
}

html.capfat-responsive body.capfat-front-page .sound-toggle__tooltip {
	display: none;
}

html.capfat-responsive body.capfat-front-page .site-header__actions {
	display: flex;
	align-items: center;
}

html.capfat-responsive body.capfat-front-page .menu-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border: 0;
	background: transparent;
}

/* Menú a pantalla completa: un muro nocturno con las secciones como tags. */
html.capfat-responsive body.capfat-front-page .mobile-nav {
	position: fixed;
	inset: 0;
	z-index: -1;
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: calc(var(--r-header) + 24px) 0 calc(36px + env(safe-area-inset-bottom));
	border: 0;
	background:
		linear-gradient(180deg, rgba(19, 17, 16, 0.35), rgba(19, 17, 16, 0.6)),
		url('../img/movil/muro-noche.webp') center / cover no-repeat,
		var(--r-night);
	color: #fff;
	overflow-x: hidden;
	overflow-y: auto;
	isolation: isolate;
	animation: capfat-r-fade 0.35s ease both;
}

html.capfat-responsive body.capfat-front-page .mobile-nav[hidden] {
	display: none;
}

html.capfat-responsive body.capfat-front-page .mobile-nav__list {
	counter-reset: r-menu;
	gap: 2px;
	padding: 0 var(--r-gutter) 24px;
}

html.capfat-responsive body.capfat-front-page .mobile-nav__link {
	counter-increment: r-menu;
	position: relative;
	display: flex;
	align-items: baseline;
	gap: 14px;
	padding: 6px 0;
	font-family: var(--font-display);
	font-size: clamp(3rem, 15vw, 4.6rem);
	line-height: 0.95;
	letter-spacing: 0.01em;
	color: #f4efe9;
	text-decoration: none;
	animation: capfat-r-tag 0.6s var(--r-ease) both;
	animation-delay: calc(0.06s + var(--i, 0) * 0.07s);
}

html.capfat-responsive body.capfat-front-page .mobile-nav__link::before {
	content: counter(r-menu, decimal-leading-zero);
	font-family: var(--font-body);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.14em;
	color: var(--r-orange);
	transform: translateY(-1.6em);
}

html.capfat-responsive body.capfat-front-page .mobile-nav__link:active,
html.capfat-responsive body.capfat-front-page .mobile-nav__link:focus-visible {
	color: var(--r-orange);
}

html.capfat-responsive body.capfat-front-page .mobile-nav .container {
	display: block;
	padding-inline: var(--r-gutter);
}

html.capfat-responsive body.capfat-front-page .mobile-nav__cta {
	display: flex;
	justify-content: center;
	border-color: var(--r-orange);
	background: var(--r-orange);
	width: 100%;
	min-height: 56px;
	font-size: 15px;
	animation: capfat-r-tag 0.6s var(--r-ease) 0.4s both;
}

html.capfat-responsive body.capfat-front-page .mobile-nav__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 4px 18px;
	margin: 22px 0 0;
	font-size: 0.86rem;
	animation: capfat-r-fade 0.6s ease 0.5s both;
}

html.capfat-responsive body.capfat-front-page .mobile-nav__meta a {
	display: inline-flex;
	align-items: center;
	min-height: 40px;
	color: #c9c0b6;
	text-decoration: none;
}

/* Firma gigante al fondo del menú, como un tag desvaído en el muro. */
html.capfat-responsive body.capfat-front-page .mobile-nav::after {
	content: "CAPFAT";
	position: absolute;
	right: -0.08em;
	bottom: 0.1em;
	z-index: -1;
	font-family: var(--font-display);
	font-size: 46vw;
	line-height: 0.8;
	color: transparent;
	-webkit-text-stroke: 1px rgba(244, 239, 233, 0.07);
	pointer-events: none;
	writing-mode: vertical-rl;
	transform: rotate(180deg);
}

html.capfat-responsive.capfat-menu-open .site-header {
	background: transparent;
	border-bottom-color: transparent;
}

html.capfat-responsive.capfat-menu-open .site-branding__logo.capfat-tag {
	color: #f4efe9;
}

html.capfat-responsive.capfat-menu-open .menu-toggle__bars span {
	background: #f4efe9;
}

html.capfat-responsive.capfat-menu-open .sound-toggle {
	visibility: hidden;
}

html.capfat-responsive.capfat-menu-open body {
	overflow: hidden;
}

@keyframes capfat-r-fade {
	from { opacity: 0; }
	to { opacity: 1; }
}

@keyframes capfat-r-tag {
	from {
		opacity: 0;
		clip-path: inset(0 100% 0 0);
		transform: translateX(-10px);
	}
	to {
		opacity: 1;
		clip-path: inset(0 0 0 0);
		transform: none;
	}
}

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

.capfat-hero-m {
	display: none;
}

html.capfat-responsive body.capfat-front-page .capfat-home-hero {
	display: flex;
	flex-direction: column;
	padding-top: var(--r-header);
	padding-bottom: 36px;
	background: var(--r-wall) var(--capfat-fondo-base) left top / cover no-repeat;
}

html.capfat-responsive body.capfat-front-page .capfat-hero-m {
	position: relative;
	display: block;
	width: 100%;
	transform: translate3d(var(--tx, 0), var(--ty, 0), 0) scale(1.03);
	transition: transform 0.6s ease-out;
	-webkit-mask-image: linear-gradient(180deg, #000 72%, transparent 100%);
	mask-image: linear-gradient(180deg, #000 72%, transparent 100%);
}

html.capfat-responsive body.capfat-front-page .capfat-hero-m picture,
html.capfat-responsive body.capfat-front-page .capfat-hero-m__art {
	display: block;
	width: 100%;
	height: auto;
}

html.capfat-responsive body.capfat-front-page .capfat-home-hero__inner {
	display: block;
	min-height: 0;
	height: auto;
	margin-top: -64px;
	padding: 0 var(--r-gutter);
}

html.capfat-responsive body.capfat-front-page .capfat-home-hero__content {
	position: relative;
	width: 100%;
	max-width: 560px;
}

html.capfat-responsive body.capfat-front-page .capfat-home-hero__eyebrow {
	display: inline-block;
	margin: 0 0 12px;
	padding: 5px 9px;
	border: 0;
	background: var(--r-ink);
	color: #f4efe9;
	font-size: 9.5px;
	line-height: 1.5;
	letter-spacing: 0.14em;
}

html.capfat-responsive body.capfat-front-page .capfat-home-hero__eyebrow-line {
	display: block;
	white-space: nowrap;
}

html.capfat-responsive body.capfat-front-page .capfat-home-hero__eyebrow-divider {
	display: none;
}

html.capfat-responsive body.capfat-front-page .capfat-home-hero__title {
	max-width: none;
	margin: 0;
	font-size: clamp(3.9rem, 19vw, 6.2rem);
	line-height: 0.86;
	letter-spacing: 0.005em;
}

html.capfat-responsive body.capfat-front-page .capfat-home-hero__title span {
	display: block;
}

html.capfat-responsive body.capfat-front-page .capfat-home-hero__description {
	max-width: 36ch;
	margin: 18px 0 0;
	font-size: 1rem;
	line-height: 1.55;
}

html.capfat-responsive body.capfat-front-page .capfat-home-hero__tagline {
	margin: 10px 0 0;
	font-family: var(--font-editorial);
	font-size: 1.1rem;
	line-height: 1.3;
}

html.capfat-responsive body.capfat-front-page .capfat-home-hero__actions {
	display: grid;
	grid-template-columns: 1.15fr 1fr;
	gap: 10px;
	margin-top: 24px;
}

html.capfat-responsive body.capfat-front-page .capfat-home-hero__button {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	min-height: 54px;
	padding: 0 14px;
	font-size: 11.5px;
	letter-spacing: 0.08em;
	white-space: nowrap;
}

/* ================================================================ */
/* Cabeceras editoriales comunes                                      */
/* ================================================================ */

html.capfat-responsive body.capfat-front-page .capfat-services-editorial,
html.capfat-responsive body.capfat-front-page .capfat-works-editorial,
html.capfat-responsive body.capfat-front-page .capfat-process-editorial,
html.capfat-responsive body.capfat-front-page .capfat-special-editorial {
	position: relative;
	inset: auto;
	width: auto;
	max-width: 620px;
	margin: 0;
	padding: 0 var(--r-gutter);
	transform: none;
}

html.capfat-responsive body.capfat-front-page .capfat-services-editorial__eyebrow,
html.capfat-responsive body.capfat-front-page .capfat-works-kicker,
html.capfat-responsive body.capfat-front-page .capfat-process-kicker,
html.capfat-responsive body.capfat-front-page .capfat-special-editorial > p:first-child,
html.capfat-responsive body.capfat-front-page .about-hero__eyebrow {
	margin: 0 0 10px;
	font-size: 11px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
}

html.capfat-responsive body.capfat-front-page .capfat-services-editorial__title,
html.capfat-responsive body.capfat-front-page .capfat-works-heading,
html.capfat-responsive body.capfat-front-page .capfat-process-editorial h2,
html.capfat-responsive body.capfat-front-page .capfat-special-editorial h2,
html.capfat-responsive body.capfat-front-page .about-hero__title,
html.capfat-responsive body.capfat-front-page .cta-final__title,
html.capfat-responsive body.capfat-front-page .faq-preview .heading-lg {
	max-width: 11ch;
	margin: 0;
	font-family: var(--font-display);
	font-size: clamp(3rem, 14.5vw, 4.8rem);
	font-weight: 400;
	line-height: 0.9;
	letter-spacing: 0.005em;
}

html.capfat-responsive body.capfat-front-page .capfat-services-editorial__title {
	max-width: none;
}

html.capfat-responsive body.capfat-front-page .capfat-services-editorial__title span {
	display: block;
}

html.capfat-responsive body.capfat-front-page .capfat-services-editorial__text,
html.capfat-responsive body.capfat-front-page .capfat-works-intro,
html.capfat-responsive body.capfat-front-page .capfat-process-intro,
html.capfat-responsive body.capfat-front-page .capfat-special-editorial > p:last-child {
	max-width: 38ch;
	margin: 16px 0 0;
	font-size: 1rem;
	line-height: 1.55;
}

html.capfat-responsive body.capfat-front-page .capfat-process-editorial,
html.capfat-responsive body.capfat-front-page .capfat-special-editorial {
	display: block;
	text-align: left;
}

html.capfat-responsive body.capfat-front-page .capfat-process-editorial h2 br {
	display: none;
}

html.capfat-responsive body.capfat-front-page .capfat-process-intro {
	display: block;
	width: auto;
	height: auto;
	padding: 0 0 0 16px;
	font-family: var(--font-editorial);
	font-size: 1.2rem;
	line-height: 1.3;
}

html.capfat-responsive body.capfat-front-page .capfat-process-editorial h2 span {
	display: block;
}

html.capfat-responsive body.capfat-front-page .capfat-services-editorial__stroke {
	position: static;
	display: block;
	width: 120px;
	margin-top: 18px;
}

/* ================================================================ */
/* Servicios: carril con imán + fichas como hoja deslizable           */
/* ================================================================ */

@media (max-width: 759px) and (orientation: portrait) {
	/* La decoración debe alcanzar el final real del bloque de Servicios. */
	html.capfat-responsive body.capfat-front-page .capfat-services-screen > .capfat-decor {
		bottom: 0;
		height: 100%;
	}

	html.capfat-responsive body.capfat-front-page .capfat-services-screen .capfat-decor__piece[data-decor="servicios/numero"] {
		top: clamp(84px, 24vw, 120px) !important;
	}
}

html.capfat-responsive body.capfat-front-page .capfat-services-screen {
	padding: 24px 0 48px;
}

html.capfat-responsive body.capfat-front-page .capfat-services-screen .vertical-panel:first-child .capfat-services-stage {
	padding-top: 8px;
}

html.capfat-responsive body.capfat-front-page .capfat-services-grid,
html.capfat-responsive body.capfat-front-page .capfat-process-steps {
	position: relative;
	inset: auto;
	display: flex;
	grid-template-columns: none;
	gap: 12px;
	width: auto;
	height: auto;
	margin: 28px 0 0;
	padding: 6px 12vw 10px;
	overflow-x: auto;
	overflow-y: hidden;
	list-style: none;
	scroll-snap-type: x mandatory;
	scroll-padding-inline: 12vw;
	overscroll-behavior-x: contain;
	scrollbar-width: none;
	transform: none;
	-webkit-overflow-scrolling: touch;
}

html.capfat-responsive body.capfat-front-page .capfat-services-grid::-webkit-scrollbar,
html.capfat-responsive body.capfat-front-page .capfat-process-steps::-webkit-scrollbar {
	display: none;
}

html.capfat-responsive body.capfat-front-page .capfat-process-steps {
	margin-top: 44px;
}

html.capfat-responsive body.capfat-front-page .capfat-service-tile {
	position: relative;
	flex: 0 0 76vw;
	width: auto;
	height: auto;
	min-height: 0;
	aspect-ratio: 4 / 5;
	margin: 0;
	border-radius: 6px;
	overflow: hidden;
	scroll-snap-align: center;
	scroll-snap-stop: always;
	box-shadow: 0 18px 40px -22px rgba(17, 17, 17, 0.55);
	transform: scale(0.94);
	opacity: 0.72;
	transition: transform 0.45s var(--r-ease), opacity 0.45s ease;
}

html.capfat-responsive body.capfat-front-page .capfat-service-tile.is-centered {
	transform: none;
	opacity: 1;
}

html.capfat-responsive body.capfat-front-page .capfat-service-tile__image {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

html.capfat-responsive body.capfat-front-page .capfat-service-tile__shade {
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, transparent 38%, rgba(12, 10, 9, 0.88) 100%);
}

html.capfat-responsive body.capfat-front-page .capfat-service-tile__content {
	position: absolute;
	left: 18px;
	right: 56px;
	bottom: 18px;
	top: auto;
}

html.capfat-responsive body.capfat-front-page .capfat-service-tile__title {
	font-size: 2.2rem;
	line-height: 0.95;
}

html.capfat-responsive body.capfat-front-page .capfat-service-tile__description {
	font-size: 0.86rem;
}

html.capfat-responsive body.capfat-front-page .capfat-service-tile__arrow {
	position: absolute;
	right: 16px;
	bottom: 18px;
	display: grid;
	place-items: center;
	width: 38px;
	height: 38px;
	border-radius: 50%;
	background: var(--r-orange);
	color: #fff;
	font-size: 18px;
}

/* Contador del carril: 01 ——— 06 */
.capfat-rail-meter {
	display: none;
}

html.capfat-responsive body.capfat-front-page .capfat-rail-meter {
	display: flex;
	align-items: center;
	gap: 12px;
	max-width: 280px;
	margin: 14px auto 0;
	padding: 0 var(--r-gutter);
	font-family: var(--font-display);
	font-size: 1.05rem;
	letter-spacing: 0.04em;
}

html.capfat-responsive body.capfat-front-page .capfat-rail-meter__num {
	color: var(--r-orange);
}

html.capfat-responsive body.capfat-front-page .capfat-rail-meter__track {
	position: relative;
	flex: 1;
	height: 2px;
	background: rgba(17, 17, 17, 0.14);
	overflow: hidden;
}

html.capfat-responsive body.capfat-front-page .capfat-rail-meter__track i {
	position: absolute;
	inset: 0;
	background: var(--r-ink);
	transform-origin: 0 50%;
	transition: transform 0.2s linear;
}

/* Fichas de servicio: cerradas no están en el flujo. */
html.capfat-responsive body.capfat-front-page .capfat-service-detail-panel {
	display: none;
}

html.capfat-responsive body.capfat-front-page .capfat-service-detail-panel.is-mounted {
	position: fixed;
	top: 10px;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 480;
	display: block;
	height: auto;
	padding: 0 0 calc(32px + env(safe-area-inset-bottom));
	border-radius: 18px 18px 0 0;
	background: var(--r-wall) var(--capfat-fondo-base) center top / cover no-repeat;
	box-shadow: 0 -20px 60px rgba(0, 0, 0, 0.35);
	overflow-x: hidden;
	overflow-y: auto;
	overscroll-behavior: contain;
	-webkit-overflow-scrolling: touch;
	transform: translate3d(0, 105%, 0) !important;
	transition: transform 0.5s var(--r-ease);
}

html.capfat-responsive body.capfat-front-page .capfat-service-detail-panel.is-open {
	transform: translate3d(0, 0, 0) !important;
}

/* Arrastre hacia abajo para cerrar (responsive.js escribe --r-dy). */
html.capfat-responsive body.capfat-front-page .capfat-service-detail-panel.is-open.is-dragging {
	transform: translate3d(0, var(--r-dy, 0px), 0) !important;
	transition: none;
}

/* Velo detrás de la hoja. */
html.capfat-responsive body::after {
	content: "";
	position: fixed;
	inset: 0;
	z-index: 470;
	background: rgba(12, 10, 9, 0.55);
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.4s ease;
}

html.capfat-responsive.capfat-sheet-open body::after {
	opacity: 1;
}

html.capfat-responsive.capfat-sheet-open body {
	overflow: hidden;
}

/* La sección crea su propio contexto de apilado: con la hoja abierta
   se sube entera por encima del velo y de la cabecera. */
html.capfat-responsive.capfat-sheet-open #pantalla-servicios {
	z-index: 480;
	overflow: visible;
}

.capfat-sheet-close,
.capfat-sheet-grab {
	display: none;
}

html.capfat-responsive body.capfat-front-page .capfat-sheet-grab {
	position: absolute;
	top: 8px;
	left: 50%;
	display: block;
	width: 42px;
	height: 4px;
	margin-left: -21px;
	border-radius: 4px;
	background: rgba(17, 17, 17, 0.22);
}

html.capfat-responsive body.capfat-front-page .capfat-sheet-close {
	position: sticky;
	top: 12px;
	z-index: 6;
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	margin: 14px 14px -58px auto;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: var(--r-ink);
	color: #fff;
	cursor: pointer;
}

html.capfat-responsive body.capfat-front-page .capfat-sheet-close svg {
	width: 20px;
	height: 20px;
	fill: none;
	stroke: currentColor;
	stroke-width: 2.2;
	stroke-linecap: round;
}

html.capfat-responsive body.capfat-front-page .capfat-service-detail {
	display: flex;
	flex-direction: column;
	gap: 26px;
	padding: 44px var(--r-gutter) 8px;
}

html.capfat-responsive body.capfat-front-page .capfat-service-detail__content,
html.capfat-responsive body.capfat-front-page .capfat-service-detail__media {
	position: relative;
	inset: auto;
	width: auto;
	height: auto;
	max-width: 620px;
	transform: none;
}

html.capfat-responsive body.capfat-front-page .capfat-service-detail__eyebrow {
	margin: 0 60px 10px 0;
	font-size: 11px;
	letter-spacing: 0.14em;
}

html.capfat-responsive body.capfat-front-page .capfat-service-detail__title {
	margin: 0;
	font-size: clamp(2.7rem, 13vw, 4.2rem);
	line-height: 0.9;
}

html.capfat-responsive body.capfat-front-page .capfat-service-detail__title span {
	display: block;
}

html.capfat-responsive body.capfat-front-page .capfat-service-detail__stroke {
	display: block;
	width: 110px;
	margin-top: 14px;
}

html.capfat-responsive body.capfat-front-page .capfat-service-detail__lead {
	max-width: none;
	margin: 16px 0 0;
	font-size: 1rem;
	line-height: 1.6;
}

html.capfat-responsive body.capfat-front-page .capfat-service-detail__features {
	display: grid;
	grid-template-columns: 1fr;
	gap: 14px;
	margin: 22px 0 0;
	padding: 0;
}

html.capfat-responsive body.capfat-front-page .capfat-service-detail__feature {
	display: grid;
	grid-template-columns: 34px 1fr;
	column-gap: 10px;
	width: auto;
}

html.capfat-responsive body.capfat-front-page .capfat-service-detail__feature-number {
	grid-row: span 2;
	font-family: var(--font-display);
	font-size: 1.6rem;
	line-height: 1;
	color: var(--r-orange);
}

html.capfat-responsive body.capfat-front-page .capfat-service-detail__actions {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px;
	margin-top: 24px;
}

html.capfat-responsive body.capfat-front-page .capfat-service-detail__actions .button {
	width: 100%;
	padding-inline: 10px;
}

html.capfat-responsive body.capfat-front-page .capfat-service-detail__media {
	display: grid;
	grid-template-columns: 1.25fr 1fr;
	gap: 10px;
	order: -1;
}

html.capfat-responsive body.capfat-front-page .capfat-service-detail__figure {
	grid-row: auto;
	grid-column: auto;
	position: relative;
	inset: auto;
	width: auto;
	height: auto;
	margin: 0;
	aspect-ratio: 3 / 4;
	border-radius: 6px;
	overflow: hidden;
	transform: none;
}

html.capfat-responsive body.capfat-front-page .capfat-service-detail__figure--side {
	margin-top: 36px;
}

html.capfat-responsive body.capfat-front-page .capfat-service-detail__zoom,
html.capfat-responsive body.capfat-front-page .capfat-service-detail__zoom img {
	display: block;
	width: 100%;
	height: 100%;
}

html.capfat-responsive body.capfat-front-page .capfat-service-detail__zoom img {
	object-fit: cover;
}

html.capfat-responsive body.capfat-front-page .capfat-service-detail__note {
	position: relative;
	inset: auto;
	grid-column: 1 / -1;
	width: auto;
	height: auto;
	margin: 6px 0 0;
	transform: none;
}

/* ================================================================ */
/* Trabajos: galería nocturna                                         */
/* ================================================================ */

html.capfat-responsive body.capfat-front-page .capfat-works-screen {
	padding: 22px 0 36px;
	background:
		linear-gradient(180deg, rgba(19, 17, 16, 0.25), rgba(19, 17, 16, 0.7) 60%, rgba(19, 17, 16, 0.85)),
		url('../img/movil/muro-noche.webp') center top / 100% auto repeat-y,
		var(--r-night);
	color: #f4efe9;
}

html.capfat-responsive body.capfat-front-page .capfat-works-screen .capfat-decor__piece:not([data-decor$="/numero"]) {
	display: none;
}

html.capfat-responsive body.capfat-front-page .capfat-works-screen .capfat-decor__piece[data-decor$="/numero"] {
	opacity: 0.18 !important;
	filter: invert(1);
}

html.capfat-responsive body.capfat-front-page .capfat-works-kicker {
	color: var(--r-orange);
}

html.capfat-responsive body.capfat-front-page .capfat-works-heading {
	color: #f4efe9;
}

html.capfat-responsive body.capfat-front-page .capfat-works-heading span {
	color: var(--r-orange);
}

html.capfat-responsive body.capfat-front-page .capfat-works-intro {
	color: #c9c0b6;
}

html.capfat-responsive body.capfat-front-page .capfat-works-link {
	display: inline-flex;
	gap: 8px;
	margin-top: 14px;
	color: var(--r-orange);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.12em;
}

html.capfat-responsive body.capfat-front-page .capfat-works-filters {
	position: relative;
	inset: auto;
	display: flex;
	flex-wrap: nowrap;
	justify-content: flex-start;
	gap: 8px;
	width: auto;
	margin: 18px 0 0;
	padding: 2px var(--r-gutter) 4px;
	overflow-x: auto;
	scrollbar-width: none;
	transform: none;
}

html.capfat-responsive body.capfat-front-page .capfat-works-filters::-webkit-scrollbar {
	display: none;
}

html.capfat-responsive body.capfat-front-page .capfat-works-filter {
	flex: 0 0 auto;
	min-height: 38px;
	padding: 0 16px;
	border: 1px solid rgba(244, 239, 233, 0.22);
	border-radius: 999px;
	background: transparent;
	color: #e9e2da;
	font-size: 12px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

html.capfat-responsive body.capfat-front-page .capfat-works-filter.is-active {
	border-color: var(--r-orange);
	background: var(--r-orange);
	color: #fff;
}

html.capfat-responsive body.capfat-front-page .capfat-works-featured {
	position: relative;
	inset: auto;
	width: auto;
	height: auto;
	margin: 18px var(--r-gutter) 0;
	transform: none;
}

html.capfat-responsive body.capfat-front-page .capfat-works-featured__media {
	position: relative;
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 4 / 5;
	padding: 0;
	border: 0;
	border-radius: 6px;
	overflow: hidden;
	background: #0b0a09;
	touch-action: pan-y;
}

html.capfat-responsive body.capfat-front-page .capfat-works-featured__image,
html.capfat-responsive body.capfat-front-page .capfat-works-featured__ghost {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

html.capfat-responsive body.capfat-front-page .capfat-works-featured__meta {
	position: relative;
	inset: auto;
	width: auto;
	margin: 14px 0 0;
	padding: 0 0 0 14px;
	border-left: 3px solid var(--r-orange);
	background: none;
	color: #f4efe9;
	transform: none;
}

html.capfat-responsive body.capfat-front-page .capfat-works-featured__category {
	margin: 0;
	color: var(--r-orange);
	font-size: 11px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

html.capfat-responsive body.capfat-front-page .capfat-works-featured__title {
	margin: 4px 0 0;
	color: #f4efe9;
	font-family: var(--font-display);
	font-size: 2rem;
	line-height: 1;
}

html.capfat-responsive body.capfat-front-page .capfat-works-featured__info {
	margin: 6px 0 0;
	color: #b9b0a6;
	font-size: 0.9rem;
}

html.capfat-responsive body.capfat-front-page .capfat-works-controls {
	position: relative;
	inset: auto;
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: auto;
	margin: 16px 0 0;
	transform: none;
}

html.capfat-responsive body.capfat-front-page .capfat-works-control {
	display: grid;
	place-items: center;
	width: 48px;
	height: 48px;
	border: 1px solid rgba(244, 239, 233, 0.25);
	border-radius: 50%;
	background: transparent;
	color: #f4efe9;
	font-size: 18px;
}

html.capfat-responsive body.capfat-front-page .capfat-works-count {
	margin: 0;
	color: #f4efe9;
	font-family: var(--font-display);
	font-size: 1.3rem;
	letter-spacing: 0.06em;
}

html.capfat-responsive body.capfat-front-page .capfat-works-thumbnails {
	position: relative;
	inset: auto;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	grid-template-rows: none;
	grid-auto-rows: auto;
	gap: 6px;
	width: auto;
	height: auto;
	margin: 22px var(--r-gutter) 0;
	transform: none;
}

html.capfat-responsive body.capfat-front-page .capfat-work-thumb {
	position: relative;
	width: auto;
	height: auto;
	aspect-ratio: 1;
	padding: 0;
	border: 0;
	border-radius: 4px;
	overflow: hidden;
	background: #0b0a09;
	opacity: 0.62;
	transition: opacity 0.3s ease;
}

html.capfat-responsive body.capfat-front-page .capfat-work-thumb.is-active {
	opacity: 1;
	outline: 2px solid var(--r-orange);
	outline-offset: 2px;
}

html.capfat-responsive body.capfat-front-page .capfat-work-thumb img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

html.capfat-responsive body.capfat-front-page .capfat-work-thumb span {
	position: absolute;
	left: 5px;
	bottom: 3px;
	color: #fff;
	font-family: var(--font-display);
	font-size: 0.95rem;
	text-shadow: 0 1px 3px rgba(0, 0, 0, 0.7);
}

html.capfat-responsive body.capfat-front-page .capfat-works-pager {
	position: relative;
	inset: auto;
	justify-content: center;
	width: auto;
	margin: 16px var(--r-gutter) 0;
	color: #f4efe9;
	transform: none;
}

html.capfat-responsive body.capfat-front-page .capfat-works-pager__button {
	width: 44px;
	height: 44px;
	color: #f4efe9;
}

/* ================================================================ */
/* Proceso                                                             */
/* ================================================================ */

html.capfat-responsive body.capfat-front-page .capfat-process-screen {
	padding: 40px 0 48px;
}

html.capfat-responsive body.capfat-front-page .capfat-process-step {
	position: relative;
	flex: 0 0 72vw;
	width: auto;
	margin: 0;
	padding: 0 0 18px;
	border-radius: 6px;
	background: rgba(255, 253, 248, 0.82);
	box-shadow: 0 16px 34px -24px rgba(17, 17, 17, 0.5);
	scroll-snap-align: center;
	transform: scale(0.95);
	opacity: 0.75;
	transition: transform 0.45s var(--r-ease), opacity 0.45s ease;
}

html.capfat-responsive body.capfat-front-page .capfat-process-step.is-centered {
	transform: none;
	opacity: 1;
}

html.capfat-responsive body.capfat-front-page .capfat-process-step__image-wrap {
	position: relative;
	width: auto;
	height: auto;
	aspect-ratio: 4 / 3;
	border-radius: 6px 6px 0 0;
	overflow: hidden;
}

html.capfat-responsive body.capfat-front-page .capfat-process-step__image-wrap img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

html.capfat-responsive body.capfat-front-page .capfat-process-step__number {
	top: auto;
	bottom: 8px;
	left: 12px;
	right: auto;
	color: #fff;
	font-size: 2.4rem;
	line-height: 1;
	text-shadow: 0 2px 10px rgba(0, 0, 0, 0.45);
}

html.capfat-responsive body.capfat-front-page .capfat-process-step h3 {
	margin: 14px 16px 0;
	font-family: var(--font-display);
	font-size: 1.6rem;
	font-weight: 400;
	line-height: 1;
}

html.capfat-responsive body.capfat-front-page .capfat-process-step p {
	margin: 8px 16px 0;
	font-size: 0.92rem;
	line-height: 1.5;
}

html.capfat-responsive body.capfat-front-page .capfat-process-note {
	position: relative;
	inset: auto;
	width: auto;
	max-width: 520px;
	margin: 22px var(--r-gutter) 0;
	padding: 12px 16px;
	border-top: 0;
	border-left: 3px solid var(--r-orange);
	font-size: 0.92rem;
	line-height: 1.5;
	transform: none;
}

html.capfat-responsive body.capfat-front-page .capfat-process-note::before {
	display: none;
}

/* ================================================================ */
/* Proyectos especiales                                                */
/* ================================================================ */

html.capfat-responsive body.capfat-front-page .capfat-special-screen {
	padding: 40px 0 56px;
}

html.capfat-responsive body.capfat-front-page .capfat-special-editorial > div {
	width: 72px;
	height: 3px;
	margin: 18px 0 0;
	background: var(--r-orange);
}

html.capfat-responsive body.capfat-front-page .capfat-special-projects {
	position: relative;
	inset: auto;
	display: grid;
	grid-template-columns: 1fr;
	gap: 14px;
	width: auto;
	height: auto;
	margin: 26px var(--r-gutter) 0;
	transform: none;
}

html.capfat-responsive body.capfat-front-page .capfat-special-project {
	position: relative;
	width: auto;
	height: auto;
	aspect-ratio: 4 / 3.6;
	border-radius: 6px;
	overflow: hidden;
}

html.capfat-responsive body.capfat-front-page .capfat-special-project img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

html.capfat-responsive body.capfat-front-page .capfat-special-project__overlay {
	position: absolute;
	inset: auto 0 0 0;
	width: auto;
	padding: 60px 18px 18px;
	background: linear-gradient(180deg, transparent, rgba(12, 10, 9, 0.9) 55%);
	color: #f4efe9;
	transform: none;
}

html.capfat-responsive body.capfat-front-page .capfat-special-project__overlay h3 {
	margin: 0;
	color: #fff;
	font-family: var(--font-display);
	font-size: 2rem;
	font-weight: 400;
	line-height: 1;
}

html.capfat-responsive body.capfat-front-page .capfat-special-project__overlay p {
	margin: 6px 0 0;
	color: #d9d1c8;
	font-size: 0.9rem;
	line-height: 1.45;
}

html.capfat-responsive body.capfat-front-page .capfat-special-project__overlay a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 44px;
	margin-top: 4px;
	color: var(--r-orange);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.12em;
}

/* ================================================================ */
/* Sobre DIME + Mi historia                                            */
/* ================================================================ */

html.capfat-responsive body.capfat-front-page .about-hero {
	padding: 0;
}

html.capfat-responsive body.capfat-front-page .about-hero .vertical-panel {
	padding: 40px 0 44px;
	background: none;
}

html.capfat-responsive body.capfat-front-page .about-hero .vertical-panel + .vertical-panel {
	padding-top: 24px;
}

html.capfat-responsive body.capfat-front-page .about-hero__inner,
html.capfat-responsive body.capfat-front-page .about-history__inner {
	display: block;
	min-height: 0;
	height: auto;
	padding-block: 0;
}

html.capfat-responsive body.capfat-front-page .about-hero__grid,
html.capfat-responsive body.capfat-front-page .about-history__grid {
	display: flex;
	flex-direction: column;
	gap: 28px;
	min-height: 0;
}

html.capfat-responsive body.capfat-front-page .about-hero__content,
html.capfat-responsive body.capfat-front-page .about-history__intro {
	width: auto;
	max-width: 620px;
}

html.capfat-responsive body.capfat-front-page .about-hero__stroke {
	display: block;
	width: 110px;
	margin: 14px 0 0;
}

html.capfat-responsive body.capfat-front-page .about-hero__subhead {
	margin: 18px 0 0;
	font-family: var(--font-editorial);
	font-size: 1.35rem;
	line-height: 1.25;
}

html.capfat-responsive body.capfat-front-page .about-hero__text {
	max-width: none;
	margin: 12px 0 0;
	font-size: 1rem;
	line-height: 1.6;
}

html.capfat-responsive body.capfat-front-page .about-hero__features {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 8px;
	margin: 22px 0 0;
	padding: 0;
}

html.capfat-responsive body.capfat-front-page .about-hero__feature {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 6px;
	padding: 12px 10px;
	border-radius: 6px;
	background: rgba(255, 253, 248, 0.7);
}

html.capfat-responsive body.capfat-front-page .about-hero__feature-icon {
	width: 26px;
	height: 26px;
	color: var(--r-orange);
}

html.capfat-responsive body.capfat-front-page .about-hero__feature-text strong {
	display: block;
	font-size: 0.86rem;
}

html.capfat-responsive body.capfat-front-page .about-hero__feature-text small {
	font-size: 0.75rem;
}

html.capfat-responsive body.capfat-front-page .about-hero__cta {
	width: 100%;
	margin-top: 22px;
	justify-content: space-between;
}

html.capfat-responsive body.capfat-front-page .about-hero__media,
html.capfat-responsive body.capfat-front-page .about-history__media {
	position: relative;
	width: auto;
	height: auto;
	max-width: 620px;
}

html.capfat-responsive body.capfat-front-page .about-hero__image,
html.capfat-responsive body.capfat-front-page .about-history__image {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 1;
	object-fit: cover;
	border-radius: 6px;
}

html.capfat-responsive body.capfat-front-page .about-hero__doodle-crown {
	top: -14px;
	right: 18px;
	left: auto;
	width: 40px;
	height: 40px;
}

html.capfat-responsive body.capfat-front-page .about-hero__doodle-text {
	top: auto;
	bottom: 14px;
	left: 14px;
	right: auto;
	padding: 6px 10px;
	background: rgba(17, 17, 17, 0.75);
	color: #fff;
	font-size: 0.85rem;
}

html.capfat-responsive body.capfat-front-page .about-hero__signature {
	right: 14px;
	bottom: 10px;
	left: auto;
	top: auto;
	color: #fff;
	font-size: 1.8rem;
}

html.capfat-responsive body.capfat-front-page .about-hero__quote-bar {
	display: flex;
	flex-direction: column;
	gap: 20px;
	margin: 30px 0 0;
	padding: 22px 20px;
	border-radius: 6px;
	background: var(--r-ink);
	color: #f4efe9;
}

html.capfat-responsive body.capfat-front-page .about-hero__quote {
	display: flex;
	gap: 10px;
	margin: 0;
}

html.capfat-responsive body.capfat-front-page .about-hero__quote-mark {
	color: var(--r-orange);
	font-size: 3.4rem;
	line-height: 0.8;
}

html.capfat-responsive body.capfat-front-page .about-hero__quote-body p {
	margin: 0;
	color: #f4efe9;
	font-family: var(--font-editorial);
	font-size: 1.2rem;
	line-height: 1.35;
}

html.capfat-responsive body.capfat-front-page .about-hero__quote-body cite {
	display: block;
	margin-top: 8px;
	color: var(--r-orange);
	font-style: normal;
	font-size: 0.8rem;
	letter-spacing: 0.16em;
}

html.capfat-responsive body.capfat-front-page .about-hero__stats {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 8px;
	margin: 0;
	padding: 16px 0 0;
	border-top: 1px solid rgba(244, 239, 233, 0.16);
}

html.capfat-responsive body.capfat-front-page .about-hero__stat {
	color: #e9e2da;
	display: flex;
	flex-direction: column;
	gap: 6px;
	font-size: 0.8rem;
	line-height: 1.3;
}

html.capfat-responsive body.capfat-front-page .about-hero__stat-icon {
	width: 22px;
	height: 22px;
	color: var(--r-orange);
}

html.capfat-responsive body.capfat-front-page .about-history__tagline-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	margin-top: 20px;
}

html.capfat-responsive body.capfat-front-page .about-history__tagline {
	margin: 0;
	font-family: var(--font-editorial);
	font-size: 1.15rem;
	line-height: 1.25;
}

html.capfat-responsive body.capfat-front-page .about-history__back {
	flex: 0 0 auto;
	width: 48px;
	height: 48px;
	min-height: 48px;
	padding: 0;
	border-radius: 50%;
}

/* Línea de tiempo vertical: un goteo que une los años. */
html.capfat-responsive body.capfat-front-page .about-history__timeline {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 22px;
	width: auto;
	margin: 0;
	padding: 4px 0 4px 30px;
	list-style: none;
}

html.capfat-responsive body.capfat-front-page .about-history__timeline::before {
	content: "";
	position: absolute;
	top: 10px;
	bottom: 10px;
	left: 8px;
	width: 3px;
	border-radius: 3px;
	background: linear-gradient(180deg, var(--r-orange), rgba(232, 75, 0, 0.25));
}

html.capfat-responsive body.capfat-front-page .about-history__timeline-item {
	position: relative;
	width: auto;
	padding: 0;
	text-align: left;
}

html.capfat-responsive body.capfat-front-page .about-history__timeline-item::before {
	content: "";
	position: absolute;
	top: 6px;
	left: -28px;
	right: auto;
	width: 11px;
	height: 11px;
	border: 3px solid var(--r-wall);
	border-radius: 50%;
	background: var(--r-orange);
	transform: none;
}

html.capfat-responsive body.capfat-front-page .about-history__timeline-item::after {
	display: none;
}

html.capfat-responsive body.capfat-front-page .about-history__year {
	display: block;
	color: var(--r-orange);
	font-family: var(--font-display);
	font-size: 1.9rem;
	line-height: 1;
}

html.capfat-responsive body.capfat-front-page .about-history__timeline-item strong {
	display: block;
	margin-top: 2px;
	font-size: 1rem;
}

html.capfat-responsive body.capfat-front-page .about-history__timeline-item p {
	margin: 4px 0 0;
	font-size: 0.92rem;
	line-height: 1.5;
}

html.capfat-responsive body.capfat-front-page .about-history__media-caption {
	position: absolute;
	left: 12px;
	right: 12px;
	bottom: 12px;
	top: auto;
	width: auto;
}

html.capfat-responsive body.capfat-front-page .about-history__stats {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 18px 14px;
	margin: 30px 0 0;
	padding: 20px 0 0;
	border-top: 1px solid rgba(17, 17, 17, 0.14);
}

html.capfat-responsive body.capfat-front-page .about-history__stats li {
	display: flex;
	flex-direction: column;
}

html.capfat-responsive body.capfat-front-page .about-history__stats strong {
	font-family: var(--font-display);
	font-size: 1.6rem;
	font-weight: 400;
	line-height: 1;
}

html.capfat-responsive body.capfat-front-page .about-history__stats span {
	margin-top: 4px;
	font-size: 0.82rem;
}

/* ================================================================ */
/* Cuéntame tu idea                                                    */
/* ================================================================ */

html.capfat-responsive body.capfat-front-page .cta-final {
	padding: 40px 0 52px;
}

html.capfat-responsive body.capfat-front-page .cta-final .capfat-decor__piece[data-decor$="/personaje"] {
	display: block;
	top: 40px !important;
	left: auto !important;
	right: -18px;
	width: var(--r-cta-art-width, 160px) !important;
	height: var(--r-cta-intro-height, 390px) !important;
	max-width: none;
	object-fit: contain;
	-webkit-mask-image: linear-gradient(to bottom, transparent 0%, #000 14%, #000 82%, transparent 100%);
	mask-image: linear-gradient(to bottom, transparent 0%, #000 14%, #000 82%, transparent 100%);
	opacity: 1 !important;
	visibility: visible !important;
	transform: none !important;
}

html.capfat-responsive body.capfat-front-page .cta-final__inner {
	display: block;
	min-height: 0;
	height: auto;
	padding-block: 0;
}

html.capfat-responsive body.capfat-front-page .cta-final__tagline {
	display: none;
}

html.capfat-responsive body.capfat-front-page .cta-final__intro {
	position: relative;
	z-index: 1;
	max-width: 66%;
	margin: 0;
	text-align: left;
}

html.capfat-responsive body.capfat-front-page .cta-final__title {
	max-width: none;
	font-size: clamp(2.7rem, 12.5vw, 4.4rem);
}

html.capfat-responsive body.capfat-front-page .cta-final__title-accent {
	display: block;
	color: var(--r-orange);
}

html.capfat-responsive body.capfat-front-page .cta-final__lead {
	margin: 14px 0 0;
	padding: 0;
	background: none;
	box-shadow: none;
	font-size: 1rem;
	line-height: 1.55;
}

html.capfat-responsive body.capfat-front-page .cta-final__grid {
	display: flex;
	flex-direction: column;
	gap: 22px;
	margin-top: 26px;
}

html.capfat-responsive body.capfat-front-page .cta-final__steps {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 8px;
	margin: 0;
	padding: 0;
}

html.capfat-responsive body.capfat-front-page .cta-final__step {
	padding: 12px;
	border-radius: 6px;
	background: rgba(255, 253, 248, 0.72);
}

html.capfat-responsive body.capfat-front-page .cta-final__form-card {
	width: auto;
	margin: 0;
	padding: 22px 18px;
	border-radius: 10px;
}

html.capfat-responsive body.capfat-front-page .cta-final__form-row {
	display: grid;
	grid-template-columns: 1fr;
	gap: 14px;
}

html.capfat-responsive body.capfat-front-page .cta-final__field input,
html.capfat-responsive body.capfat-front-page .cta-final__field select,
html.capfat-responsive body.capfat-front-page .cta-final__field textarea {
	min-height: 48px;
	font-size: 16px; /* evita el zoom automático de iOS */
}

html.capfat-responsive body.capfat-front-page .cta-final__field textarea {
	min-height: 120px;
}

html.capfat-responsive body.capfat-front-page .cta-final__submit {
	width: 100%;
	min-height: 56px;
	justify-content: space-between;
}

html.capfat-responsive body.capfat-front-page .cta-final__info-bar {
	display: grid;
	grid-template-columns: 1fr;
	gap: 0;
	width: auto;
	margin: 28px 12px 0 0;
	padding: 10px 20px;
	border-radius: 10px;
	box-sizing: border-box;
}

html.capfat-responsive body.capfat-front-page .cta-final__info-bar li {
	min-width: 0;
	padding: 13px 0;
	gap: 12px;
	font-size: 0.86rem;
	line-height: 1.45;
}

html.capfat-responsive body.capfat-front-page .cta-final__info-bar li + li {
	border-top: 1px solid rgba(17, 17, 17, 0.12);
}

html.capfat-responsive body.capfat-front-page .cta-final__info-bar strong {
	font-size: 0.72rem;
	line-height: 1.4;
}

html.capfat-responsive body.capfat-front-page .cta-final__info-icon {
	width: 22px;
	height: 22px;
}

html.capfat-responsive body.capfat-front-page .cta-final__info-bar a {
	word-break: break-word;
}

/* Separa el texto principal de la barra de progreso sin mover las obras. */
html.capfat-responsive body.capfat-front-page .capfat-home-hero__eyebrow,
html.capfat-responsive body.capfat-front-page .capfat-home-hero__title,
html.capfat-responsive body.capfat-front-page .capfat-home-hero__description,
html.capfat-responsive body.capfat-front-page .capfat-home-hero__tagline,
html.capfat-responsive body.capfat-front-page .capfat-services-editorial,
html.capfat-responsive body.capfat-front-page .capfat-works-editorial,
html.capfat-responsive body.capfat-front-page .capfat-process-editorial,
html.capfat-responsive body.capfat-front-page .capfat-special-editorial,
html.capfat-responsive body.capfat-front-page .about-hero__eyebrow,
html.capfat-responsive body.capfat-front-page .about-hero__title,
html.capfat-responsive body.capfat-front-page .about-hero__subhead,
html.capfat-responsive body.capfat-front-page .about-hero__text,
html.capfat-responsive body.capfat-front-page .cta-final__intro,
html.capfat-responsive body.capfat-front-page .faq-preview .section-header {
	margin-left: 10px;
}

/* ================================================================ */
/* Preguntas frecuentes                                                */
/* ================================================================ */

html.capfat-responsive body.capfat-front-page .faq-preview {
	padding: 40px 0 48px;
}

html.capfat-responsive body.capfat-front-page .faq-preview .section-header {
	margin-bottom: 22px;
	text-align: left;
}

html.capfat-responsive body.capfat-front-page .faq-preview__list,
html.capfat-responsive body.capfat-front-page .faq-preview__list--grid {
	display: flex;
	flex-direction: column;
	gap: 8px;
	columns: auto;
}

html.capfat-responsive body.capfat-front-page .faq-item {
	border-radius: 6px;
	background: rgba(255, 253, 248, 0.78);
}

html.capfat-responsive body.capfat-front-page .faq-item__question {
	min-height: 56px;
	padding: 16px 44px 16px 16px;
	font-size: 0.98rem;
	line-height: 1.35;
}

html.capfat-responsive body.capfat-front-page .faq-item__answer {
	max-height: none;
	padding: 0 16px 16px;
	overflow: visible;
	font-size: 0.94rem;
	line-height: 1.6;
}

html.capfat-responsive body.capfat-front-page .faq-preview .text-link {
	display: inline-flex;
	min-height: 48px;
	align-items: center;
	margin-top: 18px;
}

/* ================================================================ */
/* Firma final                                                          */
/* ================================================================ */

.capfat-msign,
.capfat-mdrip,
.capfat-dock {
	display: none;
}

html.capfat-responsive body.capfat-front-page .capfat-msign {
	display: block;
	padding: 44px var(--r-gutter) calc(48px + env(safe-area-inset-bottom));
	background: var(--r-night);
	color: #b9b0a6;
	font-size: 0.86rem;
	line-height: 1.6;
}

html.capfat-responsive body.capfat-front-page .capfat-msign__brand {
	margin: 0;
	color: #f4efe9;
	font-family: var(--font-display);
	font-size: 3.2rem;
	line-height: 0.9;
	letter-spacing: 0.02em;
}

html.capfat-responsive body.capfat-front-page .capfat-msign__line {
	max-width: 32ch;
	margin: 10px 0 0;
}

html.capfat-responsive body.capfat-front-page .capfat-msign__links {
	display: flex;
	flex-direction: column;
	gap: 4px;
	margin: 16px 0 0;
}

html.capfat-responsive body.capfat-front-page .capfat-msign__contact-row {
	display: flex;
	align-items: center;
	gap: 16px;
	min-width: 0;
}

html.capfat-responsive body.capfat-front-page .capfat-msign__links a {
	display: inline-flex;
	align-items: center;
	min-height: 40px;
	color: var(--r-orange);
	text-decoration: none;
}

html.capfat-responsive body.capfat-front-page .capfat-msign__copy {
	margin: 14px 0 0;
	font-size: 0.78rem;
	opacity: 0.6;
}

html.capfat-responsive body.capfat-front-page .capfat-msign .capfat-credit {
	display: inline-flex;
	align-items: center;
	text-decoration: none;
	border-bottom: 0;
}

html.capfat-responsive body.capfat-front-page .capfat-msign__brand,
html.capfat-responsive body.capfat-front-page .capfat-msign__line,
html.capfat-responsive body.capfat-front-page .capfat-msign__links,
html.capfat-responsive body.capfat-front-page .capfat-msign__copy {
	margin-left: 10px;
}

/* ================================================================ */
/* Gota de progreso                                                     */
/* ================================================================ */

html.capfat-responsive body.capfat-front-page .capfat-mdrip {
	position: fixed;
	top: var(--r-header);
	left: 0;
	bottom: 0;
	z-index: 440;
	display: block;
	width: 28px;
	pointer-events: none;
	--p: 0;
	transition: opacity 0.3s ease;
}

html.capfat-responsive body.capfat-front-page .capfat-mdrip__line {
	position: absolute;
	top: 0;
	left: 12px;
	width: 3px;
	height: calc(100% - 18px);
	border-radius: 0 0 3px 3px;
	background: var(--r-orange);
	transform: scaleY(var(--p));
	transform-origin: 50% 0;
}

html.capfat-responsive body.capfat-front-page .capfat-mdrip__drop {
	position: absolute;
	top: calc((100% - 18px) * var(--p) - 4px);
	left: 9px;
	width: 9px;
	height: 14px;
	fill: var(--r-orange);
	transform-origin: 50% 0;
	animation: capfat-r-drop 2.4s ease-in-out infinite;
}

@keyframes capfat-r-drop {
	0%, 100% { transform: scale(1, 1); }
	40% { transform: scale(0.92, 1.16); }
	60% { transform: scale(1.04, 0.96); }
}

html.capfat-responsive.capfat-menu-open .capfat-mdrip,
html.capfat-responsive.capfat-sheet-open .capfat-mdrip {
	opacity: 0;
}

/* Accesos discretos sobre la linea de progreso: aparecen al alcanzarlos. */
html.capfat-responsive body.capfat-front-page .capfat-dock {
	position: fixed;
	top: var(--r-header);
	left: 0;
	bottom: 0;
	z-index: 445;
	display: block;
	width: 44px;
	height: auto;
	padding: 0;
	border-radius: 0;
	background: none;
	box-shadow: none;
	pointer-events: none;
	transform: none;
	animation: none;
}

html.capfat-responsive body.capfat-front-page .capfat-dock__item {
	position: absolute;
	top: calc((100% - 18px) * var(--stop) - 34px);
	left: 1px;
	z-index: 1;
	display: grid;
	place-items: center;
	width: 26px;
	height: 26px;
	min-height: 0;
	padding: 0;
	border: 2px solid var(--r-orange);
	border-radius: 50%;
	background: var(--r-night);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
	color: #f4efe9;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transform: scale(0.65);
	transition: opacity 0.24s ease, transform 0.35s var(--r-ease), visibility 0.24s;
}

html.capfat-responsive body.capfat-front-page .capfat-dock__item:nth-child(1) { --stop: 0.16; }
html.capfat-responsive body.capfat-front-page .capfat-dock__item:nth-child(2) { --stop: 0.32; }
html.capfat-responsive body.capfat-front-page .capfat-dock__item:nth-child(3) { --stop: 0.48; }
html.capfat-responsive body.capfat-front-page .capfat-dock__item:nth-child(4) { --stop: 0.64; }
html.capfat-responsive body.capfat-front-page .capfat-dock__item:nth-child(5) { --stop: 0.80; }

html.capfat-responsive body.capfat-front-page .capfat-dock__item.is-revealed {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transform: scale(1);
}

html.capfat-responsive body.capfat-front-page .capfat-dock__item::before {
	content: "";
	position: absolute;
	inset: -9px -13px;
}

html.capfat-responsive body.capfat-front-page .capfat-dock__item svg {
	width: 15px;
	height: 15px;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.6;
	stroke-linecap: round;
	stroke-linejoin: round;
	transform: none;
}

html.capfat-responsive body.capfat-front-page .capfat-dock__item.is-active {
	border-color: var(--r-orange);
	box-shadow: 0 0 0 2px rgba(232, 75, 0, 0.22), 0 2px 10px rgba(0, 0, 0, 0.3);
}

html.capfat-responsive body.capfat-front-page .capfat-dock__item.is-active svg {
	stroke: var(--r-orange);
	transform: none;
}

html.capfat-responsive body.capfat-front-page .capfat-dock__item--cta {
	background: var(--r-orange);
	color: #fff;
}

html.capfat-responsive body.capfat-front-page .capfat-dock__item--cta.is-active svg {
	stroke: #fff;
}

html.capfat-responsive.capfat-menu-open body.capfat-front-page .capfat-dock,
html.capfat-responsive.capfat-sheet-open body.capfat-front-page .capfat-dock,
html.capfat-responsive.capfat-typing body.capfat-front-page .capfat-dock {
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transform: none;
}

/* ================================================================ */
/* Entradas al aparecer (solo con JS)                                   */
/* ================================================================ */

html.capfat-responsive.capfat-r-js .r-spray {
	-webkit-mask-image: linear-gradient(100deg, #000 0 42%, rgba(0, 0, 0, 0.35) 49%, transparent 56%);
	mask-image: linear-gradient(100deg, #000 0 42%, rgba(0, 0, 0, 0.35) 49%, transparent 56%);
	-webkit-mask-size: 280% 100%;
	mask-size: 280% 100%;
	-webkit-mask-position: 100% 0;
	mask-position: 100% 0;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	transition: -webkit-mask-position 1.15s var(--r-ease), mask-position 1.15s var(--r-ease);
}

html.capfat-responsive.capfat-r-js .r-spray.is-in {
	-webkit-mask-position: 0 0;
	mask-position: 0 0;
}

html.capfat-responsive.capfat-r-js .r-rise {
	opacity: 0;
	transform: translate3d(0, 26px, 0);
	transition: opacity 0.8s ease var(--d, 0ms), transform 0.9s var(--r-ease) var(--d, 0ms);
}

html.capfat-responsive.capfat-r-js .r-rise.is-in {
	opacity: 1;
	transform: none;
}

/* ================================================================ */
/* Tablet y móvil apaisado (760 px o más)                               */
/* ================================================================ */

@media (min-width: 760px) {
	html.capfat-responsive {
		--r-gutter: 40px;
		--r-header: 68px;
	}

	html.capfat-responsive body.capfat-front-page .site-branding__logo {
		width: 124px;
		height: 42px;
		max-width: 124px;
		max-height: 42px;
	}

	html.capfat-responsive body.capfat-front-page .capfat-home-hero__title {
		font-size: clamp(4.4rem, 9vw, 7.4rem);
	}

	html.capfat-responsive body.capfat-front-page .capfat-home-hero__actions {
		grid-template-columns: 1fr 1fr;
	}

	html.capfat-responsive body.capfat-front-page .capfat-services-editorial__title,
	html.capfat-responsive body.capfat-front-page .capfat-works-heading,
	html.capfat-responsive body.capfat-front-page .capfat-process-editorial h2,
	html.capfat-responsive body.capfat-front-page .capfat-special-editorial h2,
	html.capfat-responsive body.capfat-front-page .about-hero__title,
	html.capfat-responsive body.capfat-front-page .cta-final__title,
	html.capfat-responsive body.capfat-front-page .faq-preview .heading-lg {
		font-size: clamp(4rem, 8vw, 6rem);
		max-width: 14ch;
	}

	html.capfat-responsive body.capfat-front-page .capfat-services-grid,
	html.capfat-responsive body.capfat-front-page .capfat-process-steps {
		padding-inline: var(--r-gutter);
		scroll-padding-inline: var(--r-gutter);
	}

	html.capfat-responsive body.capfat-front-page .capfat-service-tile {
		flex-basis: min(40vw, 360px);
		scroll-snap-align: start;
	}

	html.capfat-responsive body.capfat-front-page .capfat-process-step {
		flex-basis: min(36vw, 320px);
		scroll-snap-align: start;
	}

	html.capfat-responsive body.capfat-front-page .capfat-service-detail-panel.is-mounted {
		top: 24px;
		left: 50%;
		right: auto;
		width: min(760px, calc(100% - 40px));
		margin-left: calc(min(760px, calc(100% - 40px)) / -2);
	}

	/* Trabajos: destacada a la izquierda, miniaturas a la derecha. */
	html.capfat-responsive body.capfat-front-page .capfat-works-stage {
		display: grid;
		grid-template-columns: 1.15fr 1fr;
		grid-template-areas:
			"editorial editorial"
			"filters filters"
			"featured thumbs"
			"featured pager";
		column-gap: 24px;
		align-items: start;
	}

	html.capfat-responsive body.capfat-front-page .capfat-works-editorial { grid-area: editorial; }
	html.capfat-responsive body.capfat-front-page .capfat-works-filters { grid-area: filters; }

	html.capfat-responsive body.capfat-front-page .capfat-works-featured {
		grid-area: featured;
		margin-right: 0;
	}

	html.capfat-responsive body.capfat-front-page .capfat-works-thumbnails {
		grid-area: thumbs;
		grid-template-columns: repeat(3, 1fr);
		margin: 18px var(--r-gutter) 0 0;
	}

	html.capfat-responsive body.capfat-front-page .capfat-works-pager {
		grid-area: pager;
		margin-left: 0;
	}

	html.capfat-responsive body.capfat-front-page .capfat-special-projects {
		grid-template-columns: 1fr 1fr;
	}

	html.capfat-responsive body.capfat-front-page .about-hero__grid,
	html.capfat-responsive body.capfat-front-page .about-history__grid {
		display: grid;
		grid-template-columns: 1.1fr 1fr;
		align-items: start;
		gap: 36px;
	}

	html.capfat-responsive body.capfat-front-page .about-history__grid {
		grid-template-columns: 1fr 1fr;
	}

	html.capfat-responsive body.capfat-front-page .about-history__media {
		grid-column: 1 / -1;
		max-width: none;
	}

	html.capfat-responsive body.capfat-front-page .about-history__image {
		aspect-ratio: 16 / 9;
	}

	html.capfat-responsive body.capfat-front-page .about-hero__quote-bar {
		flex-direction: row;
		align-items: center;
	}

	html.capfat-responsive body.capfat-front-page .about-history__stats {
		grid-template-columns: repeat(4, 1fr);
	}

	html.capfat-responsive body.capfat-front-page .cta-final__intro {
		max-width: 62%;
	}

	html.capfat-responsive body.capfat-front-page .cta-final__grid {
		display: grid;
		grid-template-columns: 0.8fr 1.2fr;
		align-items: start;
	}

	html.capfat-responsive body.capfat-front-page .cta-final__steps {
		grid-template-columns: 1fr;
	}

	html.capfat-responsive body.capfat-front-page .cta-final__form-row {
		grid-template-columns: 1fr 1fr;
	}

	html.capfat-responsive body.capfat-front-page .cta-final__info-bar {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		column-gap: 24px;
	}

	html.capfat-responsive body.capfat-front-page .cta-final__info-bar li:nth-child(2) {
		border-top: 0;
	}

	html.capfat-responsive body.capfat-front-page .faq-preview__list,
	html.capfat-responsive body.capfat-front-page .faq-preview__list--grid {
		display: grid;
		grid-template-columns: 1fr 1fr;
		align-items: start;
	}
}

/* Móvil en vertical: obra vertical a sangre (hero-movil-vertical.webp).
   La obra ocupa el 60 % superior de la imagen y el resto es su propia
   pared, sobre la que se apoya el texto: sin cortes entre imagen y fondo. */
@media (max-width: 759px) and (orientation: portrait) {
	html.capfat-responsive body.capfat-front-page .capfat-home-hero {
		--r-hero-art: calc(100vw * 1672 / 940);
		min-height: calc(var(--r-header) + var(--r-hero-art));
		padding-top: calc(var(--r-header) + var(--r-hero-art) * 0.555);
		padding-bottom: 4px;
		background: var(--r-wall) var(--capfat-fondo-base) center top / cover no-repeat;
	}

	html.capfat-responsive body.capfat-front-page .capfat-hero-m {
		position: absolute;
		top: var(--r-header);
		left: 0;
		right: 0;
		z-index: 0;
		transform: translate3d(var(--tx, 0), var(--ty, 0), 0);
		-webkit-mask-image: linear-gradient(180deg, #000 68%, transparent 100%);
		mask-image: linear-gradient(180deg, #000 68%, transparent 100%);
	}

	/* Igualar el matiz de la pared de la ilustración con la pared común. */
	html.capfat-responsive body.capfat-front-page .capfat-hero-m::after {
		content: '';
		position: absolute;
		inset: 0;
		background: var(--r-wall);
		mix-blend-mode: color;
		-webkit-mask-image: linear-gradient(180deg, transparent 58%, #000 82%);
		mask-image: linear-gradient(180deg, transparent 58%, #000 82%);
		pointer-events: none;
	}

	html.capfat-responsive body.capfat-front-page .capfat-hero-viewport {
		position: relative;
		z-index: 1;
	}

	html.capfat-responsive body.capfat-front-page .capfat-home-hero__inner {
		margin-top: 0;
	}

	html.capfat-responsive body.capfat-front-page .capfat-home-hero__eyebrow {
		margin-bottom: 10px;
	}

	html.capfat-responsive body.capfat-front-page .capfat-home-hero__description {
		margin-top: 14px;
	}

	html.capfat-responsive body.capfat-front-page .capfat-home-hero__actions {
		margin-top: 20px;
	}
}

/* Horizontal (tablet apaisada, portátil pequeño): hero en dos columnas,
   texto a la izquierda y obra a la derecha. */
@media (min-width: 760px) and (orientation: landscape) {
	html.capfat-responsive body.capfat-front-page .capfat-home-hero {
		display: grid;
		grid-template-columns: 1fr 1.05fr;
		align-items: center;
		min-height: min(100svh, 860px);
		padding-bottom: 40px;
	}

	html.capfat-responsive body.capfat-front-page .capfat-hero-m {
		grid-column: 2;
		grid-row: 1;
		align-self: center;
		-webkit-mask-image: linear-gradient(180deg, #000 80%, transparent);
		mask-image: linear-gradient(180deg, #000 80%, transparent);
	}

	html.capfat-responsive body.capfat-front-page .capfat-hero-viewport {
		grid-column: 1;
		grid-row: 1;
	}

	html.capfat-responsive body.capfat-front-page .capfat-home-hero__inner {
		margin-top: 0;
		padding-right: 0;
	}

	html.capfat-responsive body.capfat-front-page .capfat-home-hero__actions {
		grid-template-columns: 1fr 1fr;
	}
}

/* Portátiles pequeños y tablets grandes: el muro se centra con aire. */
@media (min-width: 1100px) {
	html.capfat-responsive {
		--r-gutter: max(48px, calc((100vw - 1160px) / 2));
	}

	html.capfat-responsive body.capfat-front-page .capfat-works-featured__media {
		aspect-ratio: auto;
		height: min(68svh, 640px);
	}

	html.capfat-responsive body.capfat-front-page .about-history__image {
		aspect-ratio: 21 / 9;
	}

	html.capfat-responsive body.capfat-front-page .capfat-service-tile {
		flex-basis: 300px;
	}

	html.capfat-responsive body.capfat-front-page .capfat-hero-m {
		max-height: calc(100svh - var(--r-header));
	}
}

/* Pantallas bajas en horizontal (móvil apaisado): hero más compacto. */
@media (max-height: 500px) and (min-width: 600px) {
	html.capfat-responsive body.capfat-front-page .capfat-home-hero {
		min-height: 0;
	}

	html.capfat-responsive body.capfat-front-page .capfat-home-hero__title {
		font-size: clamp(3.4rem, 8vw, 5rem);
	}
}

/* ================================================================ */
/* Movimiento reducido                                                  */
/* ================================================================ */

@media (prefers-reduced-motion: reduce) {
	html.capfat-responsive body.capfat-front-page .capfat-hero-m,
	html.capfat-responsive body.capfat-front-page .capfat-service-tile,
	html.capfat-responsive body.capfat-front-page .capfat-process-step,
	html.capfat-responsive body.capfat-front-page .capfat-service-detail-panel.is-mounted,
	html.capfat-responsive body.capfat-front-page .capfat-dock,
	html.capfat-responsive body.capfat-front-page .capfat-dock__item,
	html.capfat-responsive body.capfat-front-page .mobile-nav__link,
	html.capfat-responsive body.capfat-front-page .mobile-nav__cta {
		transition: none;
		animation: none;
	}

	html.capfat-responsive body.capfat-front-page .capfat-mdrip__drop {
		animation: none;
	}
}