/* ==========================================================================
   GrupoDW · custom.css (tema hijo astra-child)
   Clases propias con prefijo gdw-. Los textos, colores y tipografías se
   editan en Elementor; aquí solo va lo que Elementor gratis no permite.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Tipografía global
   Plus Jakarta Sans con letter-spacing negativo deja el espacio entre
   palabras en ~4 px y parecen pegadas («Encifras»).
   -------------------------------------------------------------------------- */
h1, h2, h3, h4, h5, h6,
.elementor-heading-title {
	word-spacing: 0.08em;
}

/* Texto en el color de marca dentro de un título:
   <span class="gdw-text-accent">crecer online</span> */
.gdw-text-accent {
	color: var(--e-global-color-primary, #BF1818);
}

/* --------------------------------------------------------------------------
   2. Home · hero
   Segunda línea grande del H1: Diseño que <span class="gdw-hero__big">conecta</span>
   -------------------------------------------------------------------------- */
.gdw-hero__title .gdw-hero__big {
	display: block;
	font-size: 2.05em;
	line-height: 0.88;
	letter-spacing: 0;
	margin-top: 0.04em;
}

/* --------------------------------------------------------------------------
   3. Marquee (.gdw-marquee)
   Estructura en Elementor:
     contenedor .gdw-marquee
       contenedor .gdw-marquee__track   (añadir --reverse para ir al revés)
         títulos .gdw-marquee__item     (una palabra cada uno)
   custom.js duplica las palabras y añade .is-animated. En el editor no se
   anima, para que se pueda editar.
   -------------------------------------------------------------------------- */
.gdw-marquee {
	overflow: hidden;
}

.gdw-marquee .gdw-marquee__track {
	flex-wrap: nowrap !important;
	width: max-content !important;
	max-width: none !important;
	align-self: flex-start;
}

.gdw-marquee .gdw-marquee__item {
	flex: none !important;
	width: auto !important;
}

.gdw-marquee .gdw-marquee__item .elementor-heading-title {
	white-space: nowrap;
}

.gdw-marquee .gdw-marquee__item .elementor-heading-title::after {
	content: "\2192"; /* → */
	color: var(--e-global-color-primary, #BF1818);
	margin: 0 0.6em;
}

.gdw-marquee .gdw-marquee__track--reverse .gdw-marquee__item .elementor-heading-title::after {
	content: "\2190"; /* ← */
}

/* Variante de una sola frase: sin flechas, solo un hueco entre repeticiones */
.gdw-marquee .gdw-marquee__track--plain .gdw-marquee__item .elementor-heading-title::after {
	content: "";
	display: inline-block;
	width: 6vw;
	margin: 0;
}

/* Variante con estrella que gira entre palabras */
.gdw-marquee .gdw-marquee__track--star .gdw-marquee__item .elementor-heading-title::after {
	content: "\2733"; /* ✳ */
	display: inline-block;
	margin: 0 0.35em;
	font-size: 0.6em;
	vertical-align: middle;
	color: var(--e-global-color-primary, #BF1818);
	animation: gdw-spin 8s linear infinite;
}

@keyframes gdw-spin {
	to { transform: rotate(360deg); }
}

@media (prefers-reduced-motion: reduce) {
	.gdw-marquee .gdw-marquee__track--star .gdw-marquee__item .elementor-heading-title::after {
		animation: none;
	}
}

/* Texto en gris dentro de un título: <span class="gdw-text-muted">…</span> */
.gdw-text-muted {
	color: #8A8A86;
}

.gdw-marquee.is-animated .gdw-marquee__track {
	animation: gdw-marquee var(--gdw-marquee-duration, 45s) linear infinite;
}

.gdw-marquee.is-animated .gdw-marquee__track--reverse {
	animation-direction: reverse;
}

@keyframes gdw-marquee {
	from { transform: translateX(0); }
	to   { transform: translateX(-50%); }
}

@media (prefers-reduced-motion: reduce) {
	.gdw-marquee.is-animated .gdw-marquee__track {
		animation: none;
	}
}

/* --------------------------------------------------------------------------
   3b. Título relleno con imagen (.gdw-text-fill en un widget Título)
   La imagen se pone en Elementor: widget → Avanzado → Fondo (clásico).
   Sin imagen de fondo el texto no se vería: poner siempre la imagen.
   -------------------------------------------------------------------------- */
.gdw-text-fill,
.gdw-text-fill > .elementor-widget-container {
	-webkit-background-clip: text;
	background-clip: text;
}

.gdw-text-fill .elementor-heading-title {
	color: transparent !important;
	-webkit-text-fill-color: transparent;
	/* Con interlineado < 1 las colas (g, p, y) salen de la caja y no se pintan */
	padding-bottom: 0.18em;
}

/* --------------------------------------------------------------------------
   4. FAQ (.gdw-faq sobre el widget Acordeón anidado de Elementor)
   Numeración 01, 02… automática e icono dentro de un círculo.
   -------------------------------------------------------------------------- */
.gdw-faq .e-n-accordion {
	counter-reset: gdw-faq;
	border-top: 1px solid var(--e-global-color-secondary, #1D1D1B);
}

.gdw-faq .e-n-accordion-item {
	counter-increment: gdw-faq;
}

.gdw-faq .e-n-accordion-item-title-header {
	display: flex;
	align-items: center;
	gap: 16px;
}

.gdw-faq .e-n-accordion-item-title-header::before {
	content: counter(gdw-faq, decimal-leading-zero);
	flex: 0 0 clamp(44px, 9vw, 140px);
	font-family: "Inter Tight", sans-serif;
	font-size: clamp(18px, 1.6vw, 24px);
	font-weight: 300;
	color: #8A8A86;
}

.gdw-faq .e-n-accordion-item[open] .e-n-accordion-item-title-header::before {
	color: var(--e-global-color-secondary, #1D1D1B);
}

.gdw-faq .e-n-accordion-item-title-icon > span {
	width: 32px;
	height: 32px;
	border: 1px solid currentColor;
	border-radius: 50%;
	display: grid;
	place-items: center;
	transition: background-color 0.2s, color 0.2s;
}

.gdw-faq .e-n-accordion-item[open] .e-n-accordion-item-title-icon > span {
	background: var(--e-global-color-secondary, #1D1D1B);
	border-color: var(--e-global-color-secondary, #1D1D1B);
}

.gdw-faq .e-n-accordion-item[open] .e-n-accordion-item-title-icon svg,
.gdw-faq .e-n-accordion-item[open] .e-n-accordion-item-title-icon i {
	fill: #FFFFFF;
	color: #FFFFFF;
}

/* Respuesta alineada con la pregunta, no con el número */
.gdw-faq .e-n-accordion-item > .e-con {
	padding-left: calc(clamp(44px, 9vw, 140px) + 16px);
}

@media (max-width: 767px) {
	.gdw-faq .e-n-accordion-item > .e-con {
		padding-left: 0;
	}
}

/* --------------------------------------------------------------------------
   4b. Acordeón en tarjetas (.gdw-accordion--cards en el Acordeón anidado)
   Al abrirse, título y contenido forman una sola tarjeta: el título solo
   queda redondeado arriba y el contenido abajo (su borde y su radio se
   ponen en Elementor: Estilo → Contenido).
   -------------------------------------------------------------------------- */
.gdw-accordion--cards .e-n-accordion-item[open] > .e-n-accordion-item-title {
	border-bottom-left-radius: 0 !important;
	border-bottom-right-radius: 0 !important;
	border-bottom-color: transparent !important;
}

/* --------------------------------------------------------------------------
   4c. Carrusel (.gdw-carousel > .gdw-carousel__track > .gdw-carousel__slide)
   Lo mueve custom.js. En el editor las diapositivas se apilan para editarlas.
   -------------------------------------------------------------------------- */
.gdw-carousel {
	overflow: hidden;
}

.gdw-carousel .gdw-carousel__track {
	flex-wrap: nowrap !important;
}

.gdw-carousel.is-ready .gdw-carousel__track {
	transition: transform 0.6s ease;
	touch-action: pan-y;
}

.gdw-carousel .gdw-carousel__slide {
	flex: 0 0 100% !important;
	max-width: 100% !important;
}

.elementor-editor-active .gdw-carousel .gdw-carousel__track {
	flex-wrap: wrap !important;
	row-gap: 30px;
}

.gdw-carousel__dots {
	display: flex;
	justify-content: center;
	gap: 10px;
	margin-top: 30px;
}

.gdw-carousel__dot {
	width: 10px;
	height: 10px;
	padding: 0;
	border: 0;
	border-radius: 999px;
	background: #E2E1DC;
	cursor: pointer;
	transition: width 0.3s, background-color 0.3s;
}

.gdw-carousel__dot.is-active {
	width: 28px;
	background: var(--e-global-color-primary, #BF1818);
}

@media (prefers-reduced-motion: reduce) {
	.gdw-carousel.is-ready .gdw-carousel__track {
		transition: none;
	}
}

/* --------------------------------------------------------------------------
   5. Cabecera fija (Ultimate Addons: #masthead)
   Astra pone overflow-x:hidden en body, y eso impide position:sticky;
   overflow-x:clip también evita el scroll lateral, pero deja fija la cabecera.
   -------------------------------------------------------------------------- */
html body {
	overflow-x: clip;
}

#masthead {
	position: sticky !important; /* Ultimate Addons pone position:relative */
	top: 0;
	z-index: 999;
	transition: box-shadow 0.2s;
}

.admin-bar #masthead {
	top: 32px;
}

@media (max-width: 782px) {
	.admin-bar #masthead {
		top: 46px;
	}
}

@media (max-width: 600px) {
	.admin-bar #masthead {
		top: 0;
	}
}

body.gdw-is-scrolled #masthead {
	box-shadow: 0 6px 24px rgba(18, 18, 18, 0.08);
}

/* Los enlaces a secciones (#servicios) no quedan tapados por la cabecera */
.elementor-element[id] {
	scroll-margin-top: 110px;
}

/* --------------------------------------------------------------------------
   6. Formularios de Contact Form 7 (.gdw-form en el widget que lo contiene)
   Plantilla del formulario: filas .gdw-form__row (2 columnas), campos
   .gdw-form__field, casilla .gdw-form__privacy y botón .gdw-form__submit.
   -------------------------------------------------------------------------- */
.gdw-form .gdw-form__row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0 20px;
}

@media (max-width: 767px) {
	.gdw-form .gdw-form__row {
		grid-template-columns: 1fr;
	}
}

.gdw-form .wpcf7-form p {
	margin: 0 0 18px;
}

.gdw-form .gdw-form__field label {
	display: block;
	font-family: "Inter Tight", sans-serif;
	font-size: 15px;
	font-weight: 600;
	color: var(--e-global-color-secondary, #1D1D1B);
}

.gdw-form input[type="text"],
.gdw-form input[type="email"],
.gdw-form input[type="tel"],
.gdw-form textarea {
	width: 100%;
	margin-top: 8px;
	padding: 14px 16px;
	border: 1px solid #E2E1DC;
	border-radius: 12px;
	background: #FFFFFF;
	font-family: "DM Sans", sans-serif;
	font-size: 16px;
	color: var(--e-global-color-secondary, #1D1D1B);
	box-shadow: none;
	transition: border-color 0.2s, box-shadow 0.2s;
}

.gdw-form textarea {
	min-height: 150px;
	resize: vertical;
}

.gdw-form input:focus,
.gdw-form textarea:focus {
	border-color: var(--e-global-color-secondary, #1D1D1B);
	box-shadow: 0 0 0 3px rgba(191, 24, 24, 0.18);
	outline: none;
}

.gdw-form .gdw-form__privacy {
	font-size: 14px;
	color: var(--e-global-color-text, #494945);
}

.gdw-form .gdw-form__privacy .wpcf7-list-item {
	margin: 0;
}

.gdw-form .gdw-form__privacy a {
	color: #9A1414;
}

.gdw-form .gdw-form__submit {
	background: #9A1414;
	color: #FFFFFF;
	border: 0;
	border-radius: 999px;
	padding: 16px 34px;
	font-family: "Inter Tight", sans-serif;
	font-size: 16px;
	font-weight: 600;
	cursor: pointer;
	transition: background-color 0.2s;
}

.gdw-form .gdw-form__submit:hover,
.gdw-form .gdw-form__submit:focus {
	background: var(--e-global-color-secondary, #1D1D1B);
}

.gdw-form .wpcf7-not-valid-tip {
	margin-top: 6px;
	font-size: 13px;
	color: #9A1414;
}

.gdw-form .wpcf7 form .wpcf7-response-output {
	margin: 10px 0 0;
	padding: 12px 16px;
	border-radius: 12px;
}

/* Sello de reCAPTCHA oculto (chocaba con el botón de WhatsApp). Google lo
   permite si junto al formulario está su aviso: widget .gdw-form__recaptcha */
.grecaptcha-badge {
	visibility: hidden !important;
}

.gdw-form__recaptcha,
.gdw-form__recaptcha p {
	margin: 0;
	font-size: 13px;
	line-height: 1.5;
	color: #8A8A86;
}

.gdw-form__recaptcha a {
	color: inherit;
	text-decoration: underline;
}

/* --------------------------------------------------------------------------
   7. Enlaces sin subrayado (Astra los subraya dentro del contenido)
   -------------------------------------------------------------------------- */
.gdw-blog__grid a,
.gdw-contacto__datos a {
	text-decoration: none !important; /* Astra: .entry-content a { underline } */
}

.gdw-blog__grid .eael-entry-title a:hover,
.gdw-contacto__datos a:hover {
	color: #9A1414;
}

/* --------------------------------------------------------------------------
   7b. Animaciones de entrada de Elementor (fadeInUp en los widgets)
   Si el sistema pide reducir movimiento, todo se muestra sin animar.
   -------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
	.elementor-invisible {
		visibility: visible !important;
	}

	.elementor-element.animated {
		animation: none !important;
	}
}

/* --------------------------------------------------------------------------
   7c. Equipo (Conócenos): fotos en formato retrato 4:5 y columna de texto
   fija al hacer scroll (altura de la cabecera + 30 px). --gdw-header-h lo
   calcula custom.js. Solo en escritorio.
   -------------------------------------------------------------------------- */
.gdw-equipo__foto img {
	width: 100%;
	height: auto !important;
	aspect-ratio: 4 / 5;
	object-fit: cover;
}

@media (min-width: 1025px) {
	.gdw-equipo__intro {
		position: sticky !important;
		top: calc(var(--gdw-header-h, 85px) + 30px + var(--wp-admin--admin-bar--height, 0px));
		align-self: flex-start;
	}
}

/* --------------------------------------------------------------------------
   8. Entradas del blog: ancho completo con el padding lateral de la home
   (50 px; 15 px en móvil). El banner con la imagen destacada sale de
   functions.php (gdw_child_single_post_banner).
   -------------------------------------------------------------------------- */
body.single-post .site-content > .ast-container {
	padding-left: 50px;
	padding-right: 50px;
}

body.single-post .site-content article.post,
body.single-post .site-content .ast-article-single {
	padding-left: 0;
	padding-right: 0;
}

@media (max-width: 767px) {
	body.single-post .site-content > .ast-container {
		padding-left: 15px;
		padding-right: 15px;
	}
}
/* ==========================================================================
   9. HOME 2 (.gdw-h2) · versión oscura con animaciones ligadas al scroll
   custom.js pone en cada [data-gdw-scroll] las variables:
     --p  avance de 0 a 1 mientras la sección pasa por la pantalla
     --ps seno de p (0 → 1 → 0): para desplegar y volver a contraer
   y añade .is-in a .gdw-h2-reveal y .gdw-split al entrar en pantalla.
   ========================================================================== */

/* --- Página oscura: fondo, cabecera y logo (body.gdw-theme-dark lo pone custom.js) --- */
body.gdw-theme-dark,
body.gdw-theme-dark #page,
body.gdw-theme-dark .site-content {
	background: #08090B;
}

/* El desenfoque va en una capa ::before y no en la barra: un backdrop-filter en
   la barra encerraría dentro de ella el panel fijo del menú móvil */
body.gdw-theme-dark .gdw-header__bar {
	position: relative;
	isolation: isolate;
	background-color: transparent !important;
	border-color: rgba(255, 255, 255, 0.08) !important;
}

body.gdw-theme-dark .gdw-header__bar::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background-color: rgba(8, 9, 11, 0.78);
	-webkit-backdrop-filter: blur(14px);
	backdrop-filter: blur(14px);
	pointer-events: none;
}

/* Menú móvil (panel lateral) en la página oscura */
body.gdw-theme-dark #masthead .hfe-side,
body.gdw-theme-dark #masthead .hfe-flyout-content {
	background-color: #121418 !important;
}

body.gdw-theme-dark #masthead .hfe-flyout-close,
body.gdw-theme-dark #masthead .hfe-flyout-close svg {
	color: #F4F3EF !important;
	fill: #F4F3EF !important;
}

body.gdw-theme-dark #masthead .hfe-nav-menu a.hfe-menu-item,
body.gdw-theme-dark #masthead .hfe-nav-menu a.hfe-sub-menu-item,
body.gdw-theme-dark #masthead .hfe-nav-menu .sub-arrow {
	color: #F4F3EF !important;
}

body.gdw-theme-dark #masthead .hfe-nav-menu a.hfe-menu-item:hover,
body.gdw-theme-dark #masthead .hfe-nav-menu .current-menu-item > a.hfe-menu-item,
body.gdw-theme-dark #masthead .hfe-nav-menu .current-menu-ancestor > a.hfe-menu-item,
body.gdw-theme-dark #masthead .hfe-nav-menu a.hfe-sub-menu-item-active,
body.gdw-theme-dark #masthead .hfe-nav-menu a.hfe-sub-menu-item:hover {
	color: #BF1818 !important;
}

body.gdw-theme-dark #masthead .sub-menu,
body.gdw-theme-dark #masthead .hfe-dropdown,
body.gdw-theme-dark #masthead .hfe-dropdown .menu-item a {
	background-color: #121418 !important;
	border-color: rgba(255, 255, 255, 0.08) !important;
}

body.gdw-theme-dark #masthead .hfe-nav-menu__toggle,
body.gdw-theme-dark #masthead .hfe-nav-menu-icon,
body.gdw-theme-dark #masthead .hfe-nav-menu-icon svg {
	color: #F4F3EF !important;
	fill: #F4F3EF !important;
}

body.gdw-theme-dark.gdw-is-scrolled #masthead {
	box-shadow: 0 10px 40px rgba(0, 0, 0, 0.45);
}

/* --- Base --- */
.gdw-h2 {
	--h2-bg: #08090B;
	--h2-surface: #121418;
	--h2-line: rgba(255, 255, 255, 0.09);
	--h2-text: #F4F3EF;
	--h2-muted: #8A8A86;
	--h2-red: #BF1818;
	--h2-coral: #E0262B;
	--gutter: 50px;
	position: relative;
	color: var(--h2-text);
	background-color: var(--h2-bg);
	font-family: "DM Sans", sans-serif;
}

@media (max-width: 767px) {
	.gdw-h2 {
		--gutter: 15px;
	}
}

.gdw-h2 h1,
.gdw-h2 h2,
.gdw-h2 h3,
.gdw-h2 .gdw-h2-title {
	font-family: "Inter Tight", sans-serif;
	color: var(--h2-text);
}

.gdw-h2-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 18px;
	font: 600 13px/1.2 "DM Sans", sans-serif;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--h2-coral);
}

.gdw-h2-eyebrow::before {
	content: "";
	width: 28px;
	height: 1px;
	background: currentColor;
}

.gdw-h2-grad,
.gdw-h2-grad span {
	background: linear-gradient(95deg, #BF1818 0%, #E0262B 55%, #F07A7D 100%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent !important;
	-webkit-text-fill-color: transparent;
}

.gdw-h2-btn {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 17px 30px;
	border-radius: 999px;
	font: 600 16px/1 "Inter Tight", sans-serif;
	text-decoration: none !important;
	color: #FFFFFF !important;
	background: linear-gradient(95deg, #9A1414, #BF1818 60%, #E0262B);
	box-shadow: 0 10px 40px rgba(191, 24, 24, 0.35);
	transition: transform 0.25s, box-shadow 0.25s;
}

.gdw-h2-btn:hover {
	transform: translateY(-2px);
	box-shadow: 0 16px 50px rgba(191, 24, 24, 0.5);
}

.gdw-h2-btn--ghost {
	background: transparent;
	box-shadow: none;
	border: 1px solid rgba(255, 255, 255, 0.22);
}

.gdw-h2-btn--ghost:hover {
	border-color: #BF1818;
	box-shadow: none;
}

.gdw-h2-buttons {
	display: flex;
	flex-wrap: wrap;
	gap: 14px;
	margin-top: 10px;
}

/* --- Aparición al entrar en pantalla --- */
.gdw-h2-reveal {
	opacity: 0;
	transform: translateY(40px);
	transition: opacity 0.9s ease, transform 0.9s cubic-bezier(0.2, 0.8, 0.2, 1);
	transition-delay: calc(var(--d, 0) * 90ms);
}

.gdw-h2-reveal.is-in {
	opacity: 1;
	transform: none;
}

/* Titular palabra a palabra (.gdw-split en un widget Título) */
.gdw-split .gdw-w {
	display: inline-block;
	overflow: hidden;
	vertical-align: top;
	padding-bottom: 0.08em;
	margin-bottom: -0.08em;
}

.gdw-split .gdw-w > span {
	display: inline-block;
	transform: translateY(110%);
	transition: transform 1s cubic-bezier(0.2, 0.8, 0.2, 1);
	transition-delay: calc(var(--i, 0) * 70ms);
}

.gdw-split.is-in .gdw-w > span {
	transform: none;
}

/* --- 1. Hero --- */
.gdw-h2-hero {
	overflow: hidden;
}

.gdw-h2-hero > .elementor-element:not(.gdw-h2-bg) {
	position: relative;
	z-index: 1;
}

.elementor-widget-html.gdw-h2-bg {
	position: absolute !important;
	inset: 0;
	width: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	z-index: 0;
	pointer-events: none;
}

.gdw-h2-bg__inner {
	position: absolute;
	inset: 0;
	overflow: hidden;
}

.gdw-h2-grid {
	position: absolute;
	inset: -10% 0;
	background-image:
		linear-gradient(var(--h2-line) 1px, transparent 1px),
		linear-gradient(90deg, var(--h2-line) 1px, transparent 1px);
	background-size: 72px 72px;
	-webkit-mask-image: radial-gradient(ellipse at 60% 40%, #000 20%, transparent 72%);
	mask-image: radial-gradient(ellipse at 60% 40%, #000 20%, transparent 72%);
	transform: translate3d(0, calc(var(--p, 0) * 120px), 0);
}

.gdw-h2-orb {
	position: absolute;
	border-radius: 50%;
	filter: blur(70px);
	transform: translate3d(0, calc(var(--p, 0) * var(--speed, 200px)), 0) scale(calc(1 + var(--p, 0) * 0.3));
	animation: gdw-h2-breathe 9s ease-in-out infinite alternate;
}

.gdw-h2-orb--1 {
	width: 620px;
	height: 620px;
	top: -180px;
	right: -140px;
	background: radial-gradient(circle, rgba(191, 24, 24, 0.75), transparent 68%);
	--speed: 320px;
}

.gdw-h2-orb--2 {
	width: 460px;
	height: 460px;
	bottom: -160px;
	left: -120px;
	background: radial-gradient(circle, rgba(224, 38, 43, 0.45), transparent 70%);
	--speed: -220px;
	animation-delay: -4s;
}

.gdw-h2-orb--3 {
	width: 260px;
	height: 260px;
	top: 38%;
	left: 42%;
	background: radial-gradient(circle, rgba(154, 20, 20, 0.55), transparent 70%);
	--speed: 480px;
	animation-delay: -2s;
}

@keyframes gdw-h2-breathe {
	to { opacity: 0.55; }
}

.gdw-h2-hero__title {
	transform: translate3d(0, calc(var(--p, 0) * -90px), 0);
	opacity: calc(1 - var(--p, 0) * 1.2);
}

/* Diagrama isométrico que se despliega al bajar */
.gdw-h2-stack {
	height: 560px;
	display: grid;
	place-items: center;
	perspective: 1600px;
}

.gdw-h2-stack__scene {
	position: relative;
	width: min(360px, 70vw);
	aspect-ratio: 1;
	transform-style: preserve-3d;
	transform: rotateX(58deg) rotateZ(-42deg) translate3d(0, 0, calc(var(--p, 0) * -60px));
	animation: gdw-h2-float 6s ease-in-out infinite;
}

@keyframes gdw-h2-float {
	50% { translate: 0 -14px; }
}

.gdw-h2-stack__layer,
.gdw-h2-iso__layer {
	position: absolute;
	inset: 0;
	border-radius: 30px;
	border: 1px solid rgba(255, 255, 255, 0.14);
	background: linear-gradient(135deg, rgba(255, 255, 255, 0.09), rgba(255, 255, 255, 0.02));
	-webkit-backdrop-filter: blur(4px);
	backdrop-filter: blur(4px);
	box-shadow: 0 40px 80px rgba(0, 0, 0, 0.5);
	transform: translateZ(calc(var(--i) * (26px + var(--p, 0) * 110px)));
}

.gdw-h2-stack__layer::before,
.gdw-h2-iso__layer::before {
	content: "";
	position: absolute;
	inset: 18px;
	border-radius: 18px;
	border: 1px dashed rgba(255, 255, 255, 0.12);
}

.gdw-h2-stack__layer:last-child {
	background: linear-gradient(135deg, #BF1818, #7E1010);
	border-color: rgba(255, 255, 255, 0.25);
	box-shadow: 0 40px 90px rgba(191, 24, 24, 0.45);
}

.gdw-h2-stack__layer span,
.gdw-h2-iso__layer span {
	position: absolute;
	left: 26px;
	bottom: 24px;
	font: 700 15px/1 "Inter Tight", sans-serif;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.85);
}

/* Figuras vectoriales que cambian de forma sin parar (morph SVG, custom.js)
   .gdw-h2-morph > svg con dos trazados, enlaces entre nodos y nodos. */
.gdw-h2-morph {
	width: min(540px, 88vw);
	aspect-ratio: 1;
	margin: 0 auto;
	transform: translate3d(0, calc(var(--p, 0) * -70px), 0) rotate(calc(var(--p, 0) * 30deg)) scale(calc(1 + var(--p, 0) * 0.15));
}

.gdw-h2-morph svg {
	display: block;
	width: 100%;
	height: 100%;
	overflow: visible;
}

.gdw-h2-morph__rot {
	transform-origin: 0 0;
	animation: gdw-spin 70s linear infinite;
}

.gdw-h2-morph__outer {
	fill: url(#gdw-morph-fill);
	stroke: url(#gdw-morph-stroke);
	stroke-width: 2.2;
	stroke-linejoin: round;
	filter: drop-shadow(0 0 22px rgba(191, 24, 24, 0.55));
}

.gdw-h2-morph__inner {
	fill: none;
	stroke: rgba(255, 255, 255, 0.35);
	stroke-width: 1.2;
	stroke-dasharray: 4 6;
}

.gdw-h2-morph__links line {
	stroke: rgba(255, 255, 255, 0.12);
	stroke-width: 1;
}

.gdw-h2-morph__nodes circle {
	fill: #08090B;
	stroke: #E0262B;
	stroke-width: 1.8;
}

.gdw-h2-morph__nodes circle.is-inner {
	fill: #BF1818;
	stroke: none;
}

@media (prefers-reduced-motion: reduce) {
	.gdw-h2-morph__rot {
		animation: none;
	}
}

/* --- 3. Líneas de texto gigantes que avanzan y retroceden con el scroll --- */
.gdw-h2-lines {
	padding: 120px 0;
	overflow: hidden;
}

.gdw-h2-lines__row {
	display: flex;
	align-items: center;
	white-space: nowrap;
	width: max-content;
	margin-left: -25vw;
	font: 700 clamp(56px, 9vw, 170px)/1 "Inter Tight", sans-serif;
	letter-spacing: 0;
	transform: translate3d(calc((var(--p, 0) - 0.5) * var(--dir, 1) * 55vw), 0, 0);
	will-change: transform;
}

.gdw-h2-lines__row + .gdw-h2-lines__row {
	margin-top: 0.08em;
}

.gdw-h2-lines__row .is-outline {
	color: transparent;
	-webkit-text-stroke: 1.5px rgba(244, 243, 239, 0.45);
}

.gdw-h2-lines__row i {
	display: inline-block;
	margin: 0 0.35em;
	font-size: 0.45em;
	font-style: normal;
	color: var(--h2-red);
	transform: rotate(calc(var(--p, 0) * 540deg));
}

/* --- 4. Sección fija: cinco capas que se despliegan y se contraen --- */
.gdw-h2-pin {
	position: relative;
	height: 420vh;
}

.gdw-h2-pin__sticky {
	position: sticky;
	top: 0;
	height: 100vh;
	display: grid;
	grid-template-columns: 1fr 1fr;
	align-items: center;
	gap: 60px;
	padding: 0 var(--gutter);
	overflow: hidden;
}

.gdw-h2-pin__title {
	margin: 0 0 34px;
	font-size: clamp(34px, 4vw, 64px);
	line-height: 1.05;
	letter-spacing: 0;
	font-weight: 700;
}

.gdw-h2-pin__steps {
	list-style: none;
	margin: 0;
	padding: 0;
	counter-reset: gdw-step;
}

.gdw-h2-pin__steps li {
	counter-increment: gdw-step;
	position: relative;
	padding: 16px 0 16px 58px;
	border-top: 1px solid var(--h2-line);
	opacity: 0.35;
	transition: opacity 0.4s;
}

.gdw-h2-pin__steps li::before {
	content: counter(gdw-step, decimal-leading-zero);
	position: absolute;
	left: 0;
	top: 17px;
	font: 600 15px "Inter Tight", sans-serif;
	color: var(--h2-muted);
}

.gdw-h2-pin__steps li strong {
	display: block;
	font: 600 21px/1.3 "Inter Tight", sans-serif;
	color: var(--h2-text);
}

.gdw-h2-pin__steps li span {
	display: block;
	max-height: 0;
	overflow: hidden;
	color: var(--h2-muted);
	transition: max-height 0.5s ease, margin 0.5s ease;
}

.gdw-h2-pin__steps li.is-active {
	opacity: 1;
}

.gdw-h2-pin__steps li.is-active::before {
	color: var(--h2-red);
}

.gdw-h2-pin__steps li.is-active span {
	max-height: 120px;
	margin-top: 8px;
}

.gdw-h2-pin__bar {
	height: 2px;
	margin-top: 26px;
	background: var(--h2-line);
}

.gdw-h2-pin__bar span {
	display: block;
	height: 100%;
	width: calc(var(--p, 0) * 100%);
	background: linear-gradient(90deg, #BF1818, #E0262B);
}

.gdw-h2-iso {
	position: relative;
	width: min(380px, 70vw);
	aspect-ratio: 1;
	margin: 0 auto;
	transform-style: preserve-3d;
	transform: rotateX(58deg) rotateZ(-42deg);
}

.gdw-h2-pin__visual {
	perspective: 1600px;
	display: grid;
	place-items: center;
}

.gdw-h2-iso__layer {
	transform: translateZ(calc(var(--i) * (16px + var(--ps, 0) * var(--spread, 120px))));
	transition: background 0.4s, border-color 0.4s, box-shadow 0.4s;
}

.gdw-h2-iso__layer.is-active {
	background: linear-gradient(135deg, #BF1818, #7E1010);
	border-color: rgba(255, 255, 255, 0.3);
	box-shadow: 0 40px 100px rgba(191, 24, 24, 0.5);
}

@media (max-width: 1024px) {
	.gdw-h2-pin__sticky {
		grid-template-columns: 1fr;
		gap: 10px;
		align-content: center;
		padding-top: calc(var(--gdw-header-h, 85px) + 20px);
		--spread: 55px;
		/* La columna no crece con el navegador isométrico (560 px sin escalar) */
		grid-template-columns: minmax(0, 1fr);
	}

	.gdw-h2-pin__visual {
		min-width: 0;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.gdw-h2-pin__visual {
		order: -1;
	}

	.gdw-h2-iso {
		width: min(240px, 60vw);
	}

	.gdw-h2-pin__steps li {
		padding: 10px 0 10px 44px;
	}

	.gdw-h2-pin__steps li strong {
		font-size: 17px;
	}
}

@media (max-width: 767px) {
	.gdw-h2-pin__sticky {
		align-content: start;
		--spread: 24px;
	}

	.gdw-h2-pin__visual {
		height: 270px;
		padding-top: 84px;
	}

	.gdw-h2-pin__steps li {
		padding: 7px 0 7px 40px;
	}

	.gdw-h2-pin__steps li::before {
		top: 9px;
	}

	.gdw-h2-pin__steps li strong {
		font-size: 16px;
	}

	.gdw-h2-iso {
		width: 165px;
	}

	.gdw-h2-pin__title {
		font-size: 28px;
		margin-bottom: 16px;
	}

	.gdw-h2-pin__text .gdw-h2-eyebrow {
		margin-bottom: 10px;
	}
}

/* Navegador isométrico con el esquema de una web (sección «cinco capas»)
   La página de dentro sube con --p; los bloques del paso activo se iluminan
   ([data-step] con .is-active); las dos copias de debajo se separan con --ps. */
.gdw-h2-browser {
	--bw: 560px;
	--bh: 410px;
	--s: 1;
	position: relative;
	width: var(--bw);
	height: var(--bh);
	flex: none;
	transform-style: preserve-3d;
	transform: rotateX(55deg) rotateZ(-38deg) scale(var(--s));
	animation: gdw-h2-float 7s ease-in-out infinite;
}

.gdw-h2-browser__ghost,
.gdw-h2-browser__window {
	position: absolute;
	inset: 0;
	border-radius: 22px;
}

.gdw-h2-browser__ghost {
	border: 1px solid rgba(255, 255, 255, 0.12);
	background: rgba(255, 255, 255, 0.025);
	transform: translateZ(calc(var(--g) * (-22px - var(--ps, 0) * 80px)));
	opacity: calc(0.7 - var(--g) * 0.22);
}

.gdw-h2-browser__ghost::after {
	content: "";
	position: absolute;
	inset: 50px 22px 22px;
	border-radius: 14px;
	border: 1px dashed rgba(255, 255, 255, 0.12);
}

.gdw-h2-browser__window {
	display: flex;
	flex-direction: column;
	overflow: hidden;
	background: #121418;
	border: 1px solid rgba(255, 255, 255, 0.16);
	box-shadow: 0 50px 100px rgba(0, 0, 0, 0.6), 0 0 80px rgba(191, 24, 24, calc(0.08 + var(--ps, 0) * 0.2));
	transform: translateZ(calc(var(--ps, 0) * 30px));
}

.gdw-h2-browser__bar {
	flex: none;
	display: flex;
	align-items: center;
	gap: 7px;
	height: 38px;
	padding: 0 14px;
	background: #1C1C1B;
	border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.gdw-h2-browser__bar i {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: #3A3A38;
}

.gdw-h2-browser__bar i:first-child {
	background: #BF1818;
}

.gdw-h2-browser__bar i:nth-child(2) {
	background: #E0262B;
}

.gdw-h2-browser__url {
	flex: 1;
	height: 20px;
	margin-left: 10px;
	padding: 0 12px;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.06);
	font: 500 11px/20px "DM Sans", sans-serif;
	color: #8A8A86;
}

.gdw-h2-browser__viewport {
	position: relative;
	flex: 1;
	overflow: hidden;
}

.gdw-h2-browser__page {
	display: flex;
	flex-direction: column;
	gap: 12px;
	padding: 14px;
	transform: translate3d(0, calc(var(--p, 0) * -63%), 0);
}

.gdw-h2-b-row {
	display: flex;
	gap: 12px;
}

.gdw-h2-b {
	flex: 1;
	position: relative;
	border-radius: 12px;
	background: rgba(255, 255, 255, 0.06);
	border: 1px solid rgba(255, 255, 255, 0.1);
	transition: background 0.45s, border-color 0.45s, box-shadow 0.45s, transform 0.45s;
}

.gdw-h2-b.is-active {
	background: linear-gradient(135deg, #BF1818, #8C1212);
	border-color: rgba(255, 255, 255, 0.28);
	box-shadow: 0 10px 30px rgba(191, 24, 24, 0.45);
	transform: translateY(-3px);
}

.gdw-h2-b i,
.gdw-h2-b b,
.gdw-h2-b span,
.gdw-h2-b s {
	display: block;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.16);
}

.gdw-h2-b--nav {
	flex: none;
	height: 28px;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 8px;
	padding: 0 12px;
}

.gdw-h2-b--nav::before {
	content: "";
	width: 46px;
	height: 10px;
	margin-right: auto;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.3);
}

.gdw-h2-b--nav span {
	width: 26px;
	height: 6px;
}

.gdw-h2-b--hero {
	flex: none;
	height: 124px;
	padding: 20px;
	display: flex;
	flex-direction: column;
	gap: 9px;
}

.gdw-h2-b--hero b {
	height: 14px;
	width: 70%;
	background: rgba(255, 255, 255, 0.32);
}

.gdw-h2-b--hero b + b {
	width: 48%;
}

.gdw-h2-b--hero em {
	display: block;
	width: 74px;
	height: 22px;
	margin-top: auto;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.28);
}

.gdw-h2-b--card {
	height: 72px;
}

.gdw-h2-b--card::before {
	content: "";
	position: absolute;
	left: 12px;
	top: 12px;
	width: 20px;
	height: 20px;
	border-radius: 7px;
	background: rgba(255, 255, 255, 0.22);
}

.gdw-h2-b--card::after {
	content: "";
	position: absolute;
	left: 12px;
	right: 18px;
	bottom: 14px;
	height: 6px;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.14);
}

.gdw-h2-b--text {
	flex: none;
	padding: 14px;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.gdw-h2-b-row .gdw-h2-b--text {
	flex: 1;
}

.gdw-h2-b--text i {
	height: 6px;
}

.gdw-h2-b--text i:nth-child(2) {
	width: 86%;
}

.gdw-h2-b--text i:nth-child(3) {
	width: 62%;
}

.gdw-h2-b--img {
	height: 96px;
	background-image: radial-gradient(circle at 70% 35%, rgba(255, 255, 255, 0.18) 0 10px, transparent 11px), linear-gradient(160deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.12));
}

.gdw-h2-b--chart {
	flex: none;
	height: 96px;
	display: flex;
	align-items: flex-end;
	gap: 8px;
	padding: 14px 16px;
}

.gdw-h2-b--chart s {
	flex: 1;
	height: calc(var(--h) * 100%);
	border-radius: 6px 6px 3px 3px;
}

.gdw-h2-b--cta {
	flex: none;
	height: 54px;
}

.gdw-h2-b--cta::after {
	content: "";
	position: absolute;
	right: 14px;
	top: 50%;
	width: 70px;
	height: 20px;
	margin-top: -10px;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.28);
}

.gdw-h2-b--footer {
	flex: none;
	height: 44px;
}

/* Versión «diagrama que se abre»: la página de dentro no se mueve; la ventana
   es la capa base y los bloques con [data-layer] (--lz = altura final) se
   elevan con --ps (0 → 1 → 0) mientras la sección está fija. */
.gdw-h2-browser--layers .gdw-h2-browser__window,
.gdw-h2-browser--layers .gdw-h2-browser__viewport,
.gdw-h2-browser--layers .gdw-h2-browser__page,
.gdw-h2-browser--layers .gdw-h2-b-row {
	overflow: visible;
	transform-style: preserve-3d;
}

.gdw-h2-browser--layers .gdw-h2-browser__window {
	transform: none;
}

.gdw-h2-browser--layers .gdw-h2-browser__bar {
	border-radius: 21px 21px 0 0;
}

.gdw-h2-browser--layers .gdw-h2-browser__page {
	height: 100%;
	gap: 10px;
	transform: none;
}

/* --open: se abre en el primer 45 % de la sección y se queda abierto */
.gdw-h2-browser--layers {
	--open: min(1, calc(var(--p, 0) * 2.2));
}

.gdw-h2-browser--layers [data-layer] {
	transform: translateZ(calc(var(--open, 0) * var(--lz, 60px)));
	transition: background 0.45s, border-color 0.45s, box-shadow 0.45s;
}

.gdw-h2-browser--layers .gdw-h2-b[data-layer] {
	box-shadow: 0 calc(var(--open, 0) * 40px) calc(var(--open, 0) * 50px) rgba(0, 0, 0, 0.55);
}

.gdw-h2-browser--layers .gdw-h2-b.is-active {
	transform: translateZ(calc(var(--open, 0) * var(--lz, 60px) + 16px));
	box-shadow: 0 20px 50px rgba(191, 24, 24, 0.5);
}

.gdw-h2-browser--layers .gdw-h2-b-row[data-layer] .gdw-h2-b {
	box-shadow: 0 calc(var(--open, 0) * 40px) calc(var(--open, 0) * 50px) rgba(0, 0, 0, 0.55);
}

.gdw-h2-browser--layers .gdw-h2-b-row[data-layer] .gdw-h2-b.is-active {
	transform: translateZ(16px);
}

.gdw-h2-browser--layers .gdw-h2-b--hero {
	height: 96px;
	padding: 16px 18px;
}

.gdw-h2-browser--layers .gdw-h2-b--card {
	height: 64px;
}

.gdw-h2-browser--layers .gdw-h2-b--chart {
	height: 70px;
	padding: 12px 16px;
}

@media (max-width: 1024px) {
	.gdw-h2-browser {
		--s: 0.66;
	}
}

@media (max-width: 767px) {
	.gdw-h2-browser {
		--s: 0.46;
	}

	.gdw-h2-pin__visual {
		overflow: visible;
	}
}

/* --- 5. Cifras con texto circular que gira --- */
.gdw-h2-stats {
	display: grid;
	grid-template-columns: auto 1fr;
	align-items: center;
	gap: 70px;
	padding: 110px var(--gutter);
}

.gdw-h2-circle {
	position: relative;
	width: 220px;
	height: 220px;
}

.gdw-h2-circle svg {
	width: 100%;
	height: 100%;
	transform: rotate(calc(var(--p, 0) * 540deg));
}

.gdw-h2-circle text {
	font: 600 13.5px "Inter Tight", sans-serif;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	fill: var(--h2-text);
}

.gdw-h2-circle__core {
	position: absolute;
	inset: 50%;
	width: 78px;
	height: 78px;
	margin: -39px 0 0 -39px;
	display: grid;
	place-items: center;
	border-radius: 50%;
	font-size: 34px;
	color: #FFFFFF;
	background: linear-gradient(135deg, #BF1818, #7E1010);
	box-shadow: 0 0 60px rgba(191, 24, 24, 0.55);
}

.gdw-h2-stats__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 30px;
}

.gdw-h2-stat {
	padding: 30px 0 0;
	border-top: 1px solid var(--h2-line);
}

.gdw-h2-stat strong {
	display: block;
	font: 600 clamp(48px, 5vw, 84px)/1 "Inter Tight", sans-serif;
	letter-spacing: 0;
	color: var(--h2-text);
}

.gdw-h2-stat span {
	display: block;
	margin-top: 12px;
	color: var(--h2-muted);
}

@media (max-width: 1024px) {
	.gdw-h2-stats {
		grid-template-columns: 1fr;
		justify-items: center;
		gap: 50px;
	}

	.gdw-h2-stats__grid {
		grid-template-columns: repeat(2, 1fr);
		width: 100%;
	}
}

/* --- 6. Proceso con línea que se rellena --- */
.gdw-h2-process {
	position: relative;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 30px;
	padding: 20px var(--gutter) 110px;
}

.gdw-h2-process__line {
	position: absolute;
	top: 49px;
	left: var(--gutter);
	right: var(--gutter);
	height: 2px;
	background: var(--h2-line);
}

.gdw-h2-process__line span {
	display: block;
	height: 100%;
	background: linear-gradient(90deg, #BF1818, #E0262B);
	transform-origin: left;
	transform: scaleX(clamp(0, calc((var(--p, 0) - 0.2) * 2.4), 1));
}

.gdw-h2-process__step {
	position: relative;
	opacity: clamp(0.2, calc((var(--p, 0) - var(--t)) * 7 + 0.2), 1);
	transform: translate3d(0, calc(clamp(0, (var(--t) - var(--p, 0)) * 300, 40) * 1px), 0);
}

.gdw-h2-process__dot {
	width: 60px;
	height: 60px;
	display: grid;
	place-items: center;
	margin-bottom: 28px;
	border-radius: 50%;
	font: 700 18px "Inter Tight", sans-serif;
	color: #FFFFFF;
	background: var(--h2-surface);
	border: 1px solid var(--h2-line);
	position: relative;
	z-index: 1;
}

.gdw-h2-process__step h3 {
	margin: 0 0 10px;
	font-size: 22px;
	font-weight: 600;
}

.gdw-h2-process__step p {
	margin: 0;
	color: var(--h2-muted);
}

@media (max-width: 1024px) {
	.gdw-h2-process {
		grid-template-columns: 1fr 1fr;
		row-gap: 50px;
	}

	.gdw-h2-process__line {
		display: none;
	}
}

@media (max-width: 767px) {
	.gdw-h2-process {
		grid-template-columns: 1fr;
	}
}

/* --- 7. Proyectos en horizontal, guiados por el scroll vertical --- */
.gdw-h2-hscroll {
	position: relative;
	height: 320vh;
}

.gdw-h2-hscroll__sticky {
	position: sticky;
	top: 0;
	height: 100vh;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 40px;
	overflow: hidden;
}

.gdw-h2-hscroll__head {
	padding: 0 var(--gutter);
	max-width: 900px;
}

.gdw-h2-hscroll__head h2,
.gdw-h2-section-title {
	margin: 0;
	font-size: clamp(34px, 4vw, 64px);
	font-weight: 700;
	line-height: 1.05;
	letter-spacing: 0;
}

.gdw-h2-hscroll__track {
	display: flex;
	gap: 30px;
	width: max-content;
	padding: 0 var(--gutter);
	transform: translate3d(calc(var(--p, 0) * var(--dist, 0) * -1px), 0, 0);
	will-change: transform;
}

.gdw-h2-card {
	position: relative;
	width: clamp(280px, 34vw, 520px);
	flex: none;
	margin: 0;
	border-radius: 26px;
	overflow: hidden;
	background: var(--h2-surface);
	border: 1px solid var(--h2-line);
}

.gdw-h2-card img {
	display: block;
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	transition: transform 0.8s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.gdw-h2-card:hover img {
	transform: scale(1.06);
}

.gdw-h2-card figcaption {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	gap: 20px;
	padding: 22px 24px 24px;
}

.gdw-h2-card figcaption span {
	display: block;
	margin-bottom: 6px;
	font-size: 13px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--h2-coral);
}

.gdw-h2-card figcaption h3 {
	margin: 0;
	font-size: 22px;
	font-weight: 600;
}

.gdw-h2-card figcaption b {
	flex: none;
	width: 44px;
	height: 44px;
	display: grid;
	place-items: center;
	border-radius: 50%;
	border: 1px solid var(--h2-line);
	font-weight: 400;
	transition: background 0.3s, border-color 0.3s;
}

.gdw-h2-card:hover figcaption b {
	background: var(--h2-red);
	border-color: var(--h2-red);
}

/* --- 8. Sectores con brillo que sigue al ratón --- */
.gdw-h2-sectors {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
}

.gdw-h2-sector {
	--mx: 50%;
	--my: 50%;
	position: relative;
	padding: 36px 30px;
	border-radius: 26px;
	background: var(--h2-surface);
	border: 1px solid var(--h2-line);
	overflow: hidden;
	isolation: isolate;
}

.gdw-h2-sector::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: radial-gradient(360px circle at var(--mx) var(--my), rgba(191, 24, 24, 0.28), transparent 60%);
	opacity: 0;
	transition: opacity 0.4s;
}

.gdw-h2-sector:hover::before {
	opacity: 1;
}

.gdw-h2-sector i {
	display: grid;
	place-items: center;
	width: 54px;
	height: 54px;
	margin-bottom: 26px;
	border-radius: 16px;
	font-style: normal;
	font-size: 24px;
	background: rgba(191, 24, 24, 0.12);
	color: var(--h2-red);
}

.gdw-h2-sector h3 {
	margin: 0 0 10px;
	font-size: 22px;
	font-weight: 600;
}

.gdw-h2-sector p {
	margin: 0;
	color: var(--h2-muted);
}

@media (max-width: 1024px) {
	.gdw-h2-sectors {
		grid-template-columns: 1fr 1fr;
	}
}

@media (max-width: 767px) {
	.gdw-h2-sectors {
		grid-template-columns: 1fr;
	}
}

/* --- 9. Opiniones en oscuro (carrusel .gdw-carousel) --- */
.gdw-h2 .gdw-carousel__dot {
	background: rgba(255, 255, 255, 0.18);
}

/* --- 10. CTA final que crece al acercarse --- */
.gdw-h2-cta {
	position: relative;
	padding: 170px var(--gutter);
	text-align: center;
	overflow: hidden;
}

.gdw-h2-cta__glow {
	position: absolute;
	left: 50%;
	top: 50%;
	width: 900px;
	height: 900px;
	margin: -450px 0 0 -450px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(191, 24, 24, 0.45), transparent 62%);
	filter: blur(30px);
	transform: scale(calc(0.4 + var(--p, 0) * 0.9));
	pointer-events: none;
}

.gdw-h2-cta__title {
	position: relative;
	margin: 0 0 26px;
	font-size: clamp(48px, 9vw, 150px) !important;
	line-height: 0.95;
	font-weight: 700;
	letter-spacing: 0;
	transform: scale(clamp(0.7, calc(0.62 + var(--p, 0) * 0.8), 1.05));
}

.gdw-h2-cta__title span {
	display: block;
}

.gdw-h2-cta p {
	position: relative;
	max-width: 620px;
	margin: 0 auto 34px;
	font-size: 19px;
	color: #C9C8C3;
}

/* --- Sin movimiento si el sistema lo pide --- */
@media (prefers-reduced-motion: reduce) {
	.gdw-h2 *,
	.gdw-h2 *::before {
		animation: none !important;
		transition: none !important;
	}

	.gdw-h2-reveal,
	.gdw-split .gdw-w > span {
		opacity: 1 !important;
		transform: none !important;
	}
}

/* ==========================================================================
   10. Páginas legales (.gdw-legal): aviso legal, privacidad y cookies
   Los datos de cada cliente van como <strong>[MARCADOR]</strong>.
   ========================================================================== */
.gdw-legal .gdw-legal__body h2 {
	margin: 2.2em 0 0.7em;
	font-family: "Inter Tight", sans-serif;
	font-size: 24px;
	font-weight: 600;
	line-height: 1.3;
	letter-spacing: 0;
	color: var(--e-global-color-secondary, #1D1D1B);
}

.gdw-legal .gdw-legal__body h3 {
	margin: 1.6em 0 0.5em;
	font-family: "Inter Tight", sans-serif;
	font-size: 19px;
	font-weight: 600;
	color: var(--e-global-color-secondary, #1D1D1B);
}

.gdw-legal .gdw-legal__body p,
.gdw-legal .gdw-legal__body li {
	line-height: 1.75;
}

.gdw-legal .gdw-legal__body ul {
	margin: 0 0 1.2em 1.2em;
}

.gdw-legal .gdw-legal__body strong {
	color: var(--e-global-color-secondary, #1D1D1B);
}

.gdw-legal .gdw-legal__body a {
	color: #9A1414;
}

.gdw-legal .gdw-legal__body table {
	width: 100%;
	margin: 1em 0 1.6em;
	border-collapse: collapse;
	font-size: 15px;
}

.gdw-legal .gdw-legal__body th,
.gdw-legal .gdw-legal__body td {
	padding: 12px 14px;
	border: 1px solid #E2E1DC;
	text-align: left;
	vertical-align: top;
}

.gdw-legal .gdw-legal__body th {
	background: #F4F3EF;
	font-family: "Inter Tight", sans-serif;
	font-weight: 600;
	color: var(--e-global-color-secondary, #1D1D1B);
}

@media (max-width: 767px) {
	.gdw-legal .gdw-legal__body table {
		display: block;
		overflow-x: auto;
	}
}

/* ==========================================================================
   11. Texto circular (.gdw-circle-text): imagen redonda con un anillo de
   texto que gira. El texto sale del widget Título .gdw-circle-text__label
   (custom.js lo convierte en SVG, con su color). El ancho lo marca el
   contenedor.
   ========================================================================== */
.gdw-circle-text {
	position: relative;
	aspect-ratio: 1;
	flex-shrink: 0;
}

.gdw-circle-text > .elementor-widget-image {
	position: absolute;
	inset: 16%;
	width: auto !important;
	margin: 0 !important;
}

.gdw-circle-text > .elementor-widget-image img {
	display: block;
	width: 100% !important;
	height: 100% !important;
	aspect-ratio: 1;
	object-fit: cover;
	border-radius: 50% !important;
}

.gdw-circle-text__ring {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	overflow: visible;
	pointer-events: none;
	animation: gdw-circle-spin 22s linear infinite;
}

.gdw-circle-text__ring text {
	font: 600 13px "Inter Tight", sans-serif;
	letter-spacing: .2em;
	text-transform: uppercase;
	fill: currentColor;
}

/* El título queda para lectores de pantalla cuando ya está el anillo */
.gdw-circle-text.is-built .gdw-circle-text__label {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

/* En el editor (sin anillo) el título se ve debajo del círculo */
.gdw-circle-text:not(.is-built) .gdw-circle-text__label {
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	text-align: center;
}

@keyframes gdw-circle-spin {
	to {
		transform: rotate(360deg);
	}
}

@media (prefers-reduced-motion: reduce) {
	.gdw-circle-text__ring {
		animation: none;
	}
}

/* ==========================================================================
   Grupo Cerama · CSS propio de esta web · v2 «laboratorio» (01-10-2026)
   Va al final de custom.css del tema hijo de esta web (lo junta montar.py).
   Hasta el 14-10-2026 estaba en Personalizar → CSS adicional (copia antigua:
   ../css-adicional.css). Si se cambia en el servidor, cambiarlo aquí, y al revés.
   Base negra y carbón; el rojo corporativo (#BF1818) solo en detalles.
   Imágenes con ruta relativa (/wp-content/…): así vale en el dominio definitivo.
   ========================================================================== */
:root {
	--gc-negro: #08090B; --gc-carbon: #121418; --gc-grafito: #1A1D22; --gc-tinta: #0D0F12;
	--gc-plata: #A3A9B3; --gc-humo: #F3F4F6; --gc-borde: #E3E5E9; --gc-rojo: #BF1818; --gc-rojo-vivo: #E0262B;
	--ast-global-color-0: #BF1818; --ast-global-color-1: #9A1414; --ast-global-color-2: #0D0F12; --ast-global-color-3: #555B65;
	--ast-global-color-4: #FFFFFF; --ast-global-color-5: #F3F4F6; --ast-global-color-6: #08090B; --ast-global-color-7: #E3E5E9; --ast-global-color-8: #0D0F12;
}
body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
::selection { background: #BF1818; color: #FFFFFF; }

/* 1. Cabecera oscura; la barra superior se recoge al bajar (custom.js pone body.gdw-gc-recogida con margen: a partir de 80 px y vuelve por debajo de 10 px, para que no entre en bucle al subir) */
.gdw-header { position: relative; }
.gdw-header__top { max-height: 80px; overflow: hidden; transition: max-height 0.3s ease, padding 0.3s ease; }
/* #masthead para ganar a la regla de Elementor de la barra (7 px arriba y abajo): sin él quedaba una tira de 14 px con el texto cortado */
body.gdw-gc-recogida #masthead .gdw-header__top { max-height: 0; --padding-top: 0px; --padding-bottom: 0px; padding-top: 0 !important; padding-bottom: 0 !important; border-width: 0 !important; }
body.gdw-is-scrolled #masthead { box-shadow: 0 10px 30px rgba(0, 0, 0, 0.35); }
.gdw-header__jobs a:hover { color: #FFFFFF !important; }
.gdw-header__script { position: absolute !important; width: 0 !important; height: 0; overflow: hidden; }
@media (min-width: 1025px) {
	.gdw-header__nav--desktop .gdw-has-mega > .sub-menu { display: none !important; }
}

/* 2. Panel bento de «Grupo Cerama» (se abre al pasar por el menú) */
.gdw-mega {
	position: absolute !important; left: 0; right: 0; top: 100%; z-index: 998;
	opacity: 0; visibility: hidden; transform: translateY(8px);
	transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s;
	box-shadow: 0 30px 60px rgba(0, 0, 0, 0.45);
}
.gdw-mega.is-open { opacity: 1; visibility: visible; transform: none; }
.elementor-editor-active .gdw-mega { position: relative !important; opacity: 1; visibility: visible; transform: none; }
.gdw-has-mega.is-mega-open > a { color: #FFFFFF !important; }

/* 3. Tarjetas técnicas (gdw-card): marcas de esquina, borde fino y elevación */
.gdw-card { --tick: rgba(13, 15, 18, 0.4); position: relative; isolation: isolate; transition: transform 0.35s ease, border-color 0.35s ease, box-shadow 0.35s ease; }
.gdw-card:not(.gdw-tarjeta-foto):not(.gdw-mega__main) {
	background-image: linear-gradient(var(--tick), var(--tick)), linear-gradient(var(--tick), var(--tick)), linear-gradient(var(--tick), var(--tick)), linear-gradient(var(--tick), var(--tick)) !important;
	background-size: 14px 1px, 1px 14px, 14px 1px, 1px 14px !important;
	background-position: 10px 10px, 10px 10px, calc(100% - 10px) 10px, calc(100% - 10px) 10px !important;
	background-repeat: no-repeat !important;
}
.gdw-dark .gdw-card { --tick: rgba(255, 255, 255, 0.55); }
.gdw-card:hover { transform: translateY(-4px); box-shadow: 0 26px 50px -24px rgba(8, 9, 11, 0.35); }
.gdw-dark .gdw-card:hover { border-color: rgba(224, 38, 43, 0.4) !important; box-shadow: 0 26px 60px -26px rgba(224, 38, 43, 0.45); }
a.gdw-card, a.gdw-card:hover { color: inherit; text-decoration: none !important; }
.gdw-areas__card > .gdw-areas__more { margin-top: auto; }
.gdw-intro__empresa img { max-height: 90px; width: auto !important; object-fit: contain; }

/* 4. Destello desenfocado que sigue al ratón (gdw-glow; el script está en custom.js) */
.gdw-glow { --mx: 50%; --my: 50%; overflow: hidden; }
.gdw-glow::after {
	content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none; border-radius: inherit;
	background: radial-gradient(360px circle at var(--mx) var(--my), rgba(224, 38, 43, 0.22), transparent 62%);
	opacity: 0; transition: opacity 0.4s ease;
}
.gdw-glow:hover::after { opacity: 1; }
.gdw-glow > .elementor-element, .gdw-glow > .e-con-inner { position: relative; z-index: 1; }

/* 5. Patrón de hexágonos en las cabeceras (gdw-hex) */
.gdw-hex { position: relative; }
.gdw-hex::after {
	content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='100' viewBox='0 0 56 100'%3E%3Cpath d='M28 66L0 50L0 16L28 0L56 16L56 50L28 66L28 100' fill='none' stroke='%23FFFFFF' stroke-width='1'/%3E%3Cpath d='M28 0L28 34L0 50L0 84L28 100L56 84L56 50L28 34' fill='none' stroke='%23FFFFFF' stroke-width='1'/%3E%3C/svg%3E"); background-size: 42px 75px; opacity: 0.08;
	-webkit-mask-image: radial-gradient(ellipse 55% 75% at 88% 35%, #000 0%, transparent 72%);
	mask-image: radial-gradient(ellipse 55% 75% at 88% 35%, #000 0%, transparent 72%);
}
.gdw-hex > .elementor-element, .gdw-hex > .e-con-inner { position: relative; z-index: 1; }

/* 6. Partículas de la portada (canvas en un widget HTML con la clase gdw-particles) */
.gdw-particles { position: absolute !important; inset: 0; z-index: 0 !important; pointer-events: none; width: 100% !important; max-width: none !important; margin: 0 !important; }
.gdw-particles .elementor-widget-container, .gdw-particles canvas { width: 100%; height: 100%; display: block; }

/* 7. Botones y etiquetas */
.elementor-button { transition: background-color 0.25s, color 0.25s, border-color 0.25s, transform 0.25s, box-shadow 0.25s; }
.elementor-button:hover { transform: translateY(-1px); }
.gdw-eyebrow .elementor-heading-title::before { content: ""; display: inline-block; width: 7px; height: 7px; margin-right: 10px; vertical-align: 1px; background: currentColor; }

/* 8. Franja de palabras: separador en rojo */
.gdw-home-marquee .gdw-marquee__track--star .gdw-marquee__item .elementor-heading-title::after { color: #E0262B; }

/* 9. Logos en baldosas que se desplazan (gdw-tile dentro de .gdw-logos); los logos son versiones en blanco (…-blanco.webp) */
.gdw-logos { -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.gdw-logos .gdw-tile { flex: none !important; width: 220px !important; margin-right: 16px; }
.gdw-tile img { max-width: 150px !important; max-height: 54px; width: auto !important; height: auto !important; object-fit: contain; opacity: 0.62; transition: opacity 0.3s, transform 0.3s; }
.gdw-tile:hover img { opacity: 1; transform: scale(1.04); }
.gdw-glowbg { background-image: radial-gradient(55% 70% at 50% 115%, rgba(191, 24, 24, 0.24), transparent 70%), radial-gradient(35% 50% at 8% 0%, rgba(255, 255, 255, 0.05), transparent 70%) !important; }

/* 10. Vídeo, especies y galerías */
.gdw-video .elementor-wrapper, .gdw-video .elementor-custom-embed-image-overlay { border-radius: 10px; overflow: hidden; }
.gdw-especie .elementor-widget-image img { transition: transform 0.4s ease; }
.gdw-especie:hover .elementor-widget-image img { transform: scale(1.04); }
.gdw-gallery .gallery-item img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 8px; transition: transform 0.35s ease, filter 0.35s ease; }
.gdw-gallery .gallery-item a:hover img { transform: scale(1.03); filter: brightness(1.05); }

/* 11. Tabla de códigos L.E.R. */
.gdw-tabla table { width: 100%; border-collapse: collapse; font-size: 15px; background: #FFFFFF; border: 1px solid #E3E5E9; border-radius: 10px; overflow: hidden; }
.gdw-tabla th, .gdw-tabla td { padding: 12px 16px; border-bottom: 1px solid #E3E5E9; text-align: left; vertical-align: top; }
.gdw-tabla th { background: #121418; color: #FFFFFF; font-family: "Inter Tight", sans-serif; font-weight: 600; }
.gdw-tabla td:first-child { font-family: "JetBrains Mono", monospace; font-weight: 500; color: #BF1818; white-space: nowrap; }

/* 12. Cuadrículas de noticias y eventos (Essential Addons) */
.gdw-blog__grid .eael-grid-post-holder { border: 1px solid #E3E5E9 !important; border-radius: 10px !important; overflow: hidden; transition: transform 0.3s ease, box-shadow 0.3s ease; }
.gdw-blog__grid .eael-grid-post-holder:hover { transform: translateY(-4px); box-shadow: 0 26px 50px -24px rgba(8, 9, 11, 0.3); }
.gdw-blog__grid .eael-entry-thumbnail img { object-fit: cover; }
.gdw-blog__grid .eael-entry-title a:hover, .gdw-contacto__datos a:hover { color: #BF1818; }

/* 13. Formularios de Contact Form 7 */
.gdw-form .gdw-form__field label { font-family: "Inter Tight", sans-serif; color: #0D0F12; }
.gdw-form input[type="text"], .gdw-form input[type="email"], .gdw-form input[type="tel"], .gdw-form textarea { border-radius: 8px; border-color: #E3E5E9; font-family: "Inter", sans-serif; }
.gdw-form input[type="file"] { margin-top: 8px; font-size: 15px; }
.gdw-form .gdw-form__submit { background: #BF1818; border-radius: 8px; font-family: "Inter Tight", sans-serif; }
.gdw-form .gdw-form__submit:hover, .gdw-form .gdw-form__submit:focus { background: #0D0F12; }
.gdw-form .gdw-form__privacy a, .gdw-form .wpcf7-not-valid-tip { color: #BF1818; }
.gdw-form input:focus, .gdw-form textarea:focus { border-color: #0D0F12; box-shadow: 0 0 0 3px rgba(191, 24, 24, 0.14); }
.gdw-form__capa table { width: 100%; margin: 6px 0 0; border-collapse: collapse; font-size: 13px; line-height: 1.45; color: #6B717B; }
.gdw-form__capa th, .gdw-form__capa td { padding: 6px 8px; border: 1px solid #E3E5E9; text-align: left; vertical-align: top; }
.gdw-form__capa th { width: 30%; background: #F3F4F6; font-weight: 600; color: #0D0F12; }
.gdw-form__capa a { color: #BF1818; }

/* 14. Páginas legales */
.gdw-legal .gdw-legal__body h2, .gdw-legal .gdw-legal__body h3, .gdw-legal .gdw-legal__body th { font-family: "Inter Tight", sans-serif; }
.gdw-legal .gdw-legal__body a { color: #BF1818; }
.gdw-legal .gdw-legal__body th { background: #F3F4F6; }

/* 15. Entradas: sin autor (las publica la empresa) */
.single-post .entry-meta .posted-by, .single-post .entry-meta .posted-by + .ast-separator, .blog .posted-by, .archive .posted-by { display: none !important; }
.single-post .entry-content a { color: #BF1818; }

/* 16. Buscador de medicamentos */
.gdw-search { display: flex; gap: 8px; padding: 8px; background: rgba(255, 255, 255, 0.06); border: 1px solid rgba(255, 255, 255, 0.14); border-radius: 12px; backdrop-filter: blur(6px); }
.gdw-search input[type="search"] { flex: 1; min-width: 0; border: 0 !important; background: transparent; padding: 12px 16px; font-size: 16px; color: #FFFFFF; box-shadow: none !important; outline: none; }
.gdw-search input[type="search"]::placeholder { color: #A3A9B3; }
.gdw-search button { border: 0; border-radius: 8px; padding: 12px 24px; background: #BF1818; color: #FFFFFF; font-family: "Inter Tight", sans-serif; font-weight: 600; cursor: pointer; transition: background 0.2s; }
.gdw-search button:hover { background: #9A1414; }
.gdw-search-widget { width: 100%; }

/* 17. Pie: menús en filas de ancho completo */
.gdw-footer__menu .hfe-nav-menu { flex-wrap: wrap; row-gap: 8px; }
.gdw-footer__menu .hfe-nav-menu a.hfe-menu-item { position: relative; }
.gdw-footer__fila:hover .gdw-footer__label .elementor-heading-title { color: #FFFFFF; }

/* 18. Contacto */
.gdw-contacto__dato .elementor-icon-box-description { word-break: break-word; }
.gdw-page-hero__logo img { filter: drop-shadow(0 2px 10px rgba(0, 0, 0, 0.35)); }

@media (max-width: 767px) {
	.gdw-search { flex-direction: column; }
	.gdw-search button { width: 100%; }
	.gdw-logos .gdw-tile { width: 170px !important; }
	.gdw-tile img { max-width: 120px !important; max-height: 46px; }
}
@media (prefers-reduced-motion: reduce) {
	.gdw-card, .gdw-card:hover { transform: none !important; }
}

/* 19. Línea con puntos en los extremos (divisor con la clase gdw-sep) */
.gdw-sep .elementor-divider { position: relative; }
.gdw-sep .elementor-divider::before, .gdw-sep .elementor-divider::after { content: ""; position: absolute; top: 50%; width: 4px; height: 4px; margin-top: -2px; background: rgba(255, 255, 255, 0.7); }
.gdw-sep .elementor-divider::before { left: 0; }
.gdw-sep .elementor-divider::after { right: 0; }

/* 20. Tarjetas de áreas: la foto se funde con la tarjeta */
.gdw-areas__foto img { -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 55%); mask-image: linear-gradient(180deg, transparent 0%, #000 55%); filter: saturate(0.85) contrast(1.05); transition: transform 0.6s ease, filter 0.6s ease; }
.gdw-areas__card:hover .gdw-areas__foto img { transform: scale(1.05); filter: saturate(1) contrast(1.05); }
.gdw-areas__foto { overflow: hidden; margin-top: auto !important; }
.gdw-areas__card > .gdw-areas__more { margin-top: 0; }

/* 22. Texto destacado en rojo sobre fondo oscuro */
.gdw-dark .gdw-text-accent { color: #E0262B; }

/* 23. Foto de las tarjetas de áreas de borde a borde */
.gdw-areas__card > .gdw-areas__foto { width: calc(100% + 60px) !important; max-width: none !important; margin-left: -30px !important; margin-right: -30px !important; }
.gdw-areas__foto img { width: 100% !important; }
@media (max-width: 767px) { .gdw-areas__card > .gdw-areas__foto { width: calc(100% + 44px) !important; margin-left: -22px !important; margin-right: -22px !important; } }

/* 24. Tarjetas del blog (Essential Addons) con la identidad técnica: carbón, borde fino, marcas de esquina y destello */
.gdw-blog__grid .eael-grid-post-holder { --mx: 50%; --my: 50%; position: relative; isolation: isolate; background-color: #121418 !important; border: 1px solid rgba(255, 255, 255, 0.09) !important; border-radius: 10px !important; overflow: hidden; }
.gdw-blog__grid .eael-grid-post-holder::after { content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none; background: radial-gradient(360px circle at var(--mx) var(--my), rgba(224, 38, 43, 0.22), transparent 62%); opacity: 0; transition: opacity 0.4s ease; }
.gdw-blog__grid .eael-grid-post-holder:hover::after { opacity: 1; }
.gdw-blog__grid .eael-grid-post-holder:hover { border-color: rgba(224, 38, 43, 0.4) !important; box-shadow: 0 26px 60px -26px rgba(224, 38, 43, 0.45); }
.gdw-blog__grid .eael-grid-post-holder-inner { position: relative; z-index: 1; display: flex; flex-direction: column; height: 100%; }
.gdw-blog__grid .eael-entry-media { margin: 0 !important; border-bottom: 1px solid rgba(255, 255, 255, 0.09); overflow: hidden; }
.gdw-blog__grid .eael-entry-thumbnail img { filter: saturate(0.9) contrast(1.05); transition: transform 0.6s ease; }
.gdw-blog__grid .eael-entry-overlay { background-color: rgba(8, 9, 11, 0.55) !important; }
.gdw-blog__grid .eael-entry-wrapper {
	display: flex; flex-direction: column; flex: 1; padding: 26px 24px 22px !important;
	background-image: linear-gradient(rgba(255, 255, 255, 0.55), rgba(255, 255, 255, 0.55)), linear-gradient(rgba(255, 255, 255, 0.55), rgba(255, 255, 255, 0.55)), linear-gradient(rgba(255, 255, 255, 0.55), rgba(255, 255, 255, 0.55)), linear-gradient(rgba(255, 255, 255, 0.55), rgba(255, 255, 255, 0.55));
	background-size: 14px 1px, 1px 14px, 14px 1px, 1px 14px; background-position: 10px 10px, 10px 10px, calc(100% - 10px) 10px, calc(100% - 10px) 10px; background-repeat: no-repeat;
}
.gdw-blog__grid .eael-entry-header-after { order: -1; margin: 0 0 12px !important; padding: 0 !important; border: 0 !important; }
.gdw-blog__grid .eael-entry-meta, .gdw-blog__grid .eael-entry-meta time, .gdw-blog__grid .eael-meta-posted-on { font-family: "JetBrains Mono", monospace !important; font-size: 11.5px !important; text-transform: uppercase; letter-spacing: 1.4px; color: #A3A9B3 !important; }
.gdw-blog__grid .eael-entry-meta i { color: #E0262B !important; margin-right: 6px; }
.gdw-blog__grid .eael-entry-title { margin: 0 0 10px !important; }
.gdw-blog__grid .eael-entry-title, .gdw-blog__grid .eael-entry-title a, .gdw-blog__grid .eael-entry-title a:hover { font-weight: 400 !important; }
.gdw-blog__grid .eael-entry-title a, .gdw-blog__grid .eael-entry-title a:hover { color: #FFFFFF !important; font-family: "Inter Tight", sans-serif !important; }
.gdw-blog__grid .eael-entry-content { flex: 1; display: flex; }
.gdw-blog__grid .eael-grid-post-excerpt { display: flex; flex-direction: column; width: 100%; }
.gdw-blog__grid .eael-grid-post-excerpt p { color: #A3A9B3 !important; font-size: 14.5px !important; line-height: 1.6; }
.gdw-blog__grid .eael-post-elements-readmore-btn { margin-top: auto !important; padding: 14px 0 0 !important; border-top: 1px solid rgba(255, 255, 255, 0.09); font-family: "Inter Tight", sans-serif !important; font-weight: 600 !important; font-size: 14px !important; color: #FFFFFF !important; background: none !important; }
.gdw-blog__grid .eael-post-elements-readmore-btn::after { content: " →"; color: #E0262B; }
.gdw-blog__grid .eael-load-more-button { background: #121418 !important; color: #FFFFFF !important; border: 1px solid rgba(255, 255, 255, 0.16) !important; border-radius: 8px !important; font-family: "Inter Tight", sans-serif !important; font-weight: 600 !important; padding: 14px 28px !important; transition: border-color 0.25s, box-shadow 0.25s; }
.gdw-blog__grid .eael-load-more-button:hover { border-color: #E0262B !important; box-shadow: 0 14px 34px -18px rgba(224, 38, 43, 0.6); }

/* 25. Banda de palabras con «//» entre frases */
.gdw-marquee .gdw-marquee__track--slash .gdw-marquee__item .elementor-heading-title::after { content: "//"; display: inline-block; margin: 0 0.55em; color: #E0262B; font-weight: 400; }

/* 26. Texto del logo gigante al final del pie (como Softox) */
.gdw-footer__marca { overflow: hidden; }
.gdw-footer__marca img { display: block; width: 100% !important; height: auto; opacity: 0.08; margin-bottom: -3%; transition: opacity 0.6s ease; }
.gdw-footer:hover .gdw-footer__marca img { opacity: 0.12; }

/* 27. Diagrama de la portada: las cuatro empresas salen de la tarjeta de Grupo Cerama */
.gdw-sep--claro .elementor-divider::before, .gdw-sep--claro .elementor-divider::after { background: rgba(13, 15, 18, 0.45); }
.gdw-org__logo img { max-height: 78px; width: auto !important; }
.gdw-org__hub-logo img { width: 280px !important; }
@media (min-width: 1025px) {
	.gdw-org__row {
		position: relative;
		padding-top: 72px !important;
		background-image: radial-gradient(circle, #E0262B 0 2.5px, transparent 3px), radial-gradient(circle, #E0262B 0 2.5px, transparent 3px), radial-gradient(circle, #E0262B 0 2.5px, transparent 3px), radial-gradient(circle, #E0262B 0 2.5px, transparent 3px), radial-gradient(circle, #E0262B 0 2.5px, transparent 3px), linear-gradient(#C9CED6, #C9CED6), linear-gradient(#C9CED6, #C9CED6), linear-gradient(#C9CED6, #C9CED6), linear-gradient(#C9CED6, #C9CED6), linear-gradient(#C9CED6, #C9CED6), linear-gradient(#C9CED6, #C9CED6);
		background-size: 8px 8px, 8px 8px, 8px 8px, 8px 8px, 8px 8px, 1px 36px, 75% 1px, 1px 36px, 1px 36px, 1px 36px, 1px 36px;
		background-position: 50% 32px, 12.5% 68px, 37.5% 68px, 62.5% 68px, 87.5% 68px, 50% 0, 50% 36px, 12.5% 36px, 37.5% 36px, 62.5% 36px, 87.5% 36px;
		background-repeat: no-repeat;
	}
	.gdw-org__row::after {
		content: ""; position: absolute; top: 36px; left: 12.5%; width: 75%; height: 1px; pointer-events: none;
		background: linear-gradient(90deg, transparent, #E0262B, transparent) no-repeat; background-size: 24% 100%;
		animation: gdw-flujo 3.6s linear infinite;
	}
}
@keyframes gdw-flujo { from { background-position: -30% 0; } to { background-position: 130% 0; } }
@media (prefers-reduced-motion: reduce) { .gdw-org__row::after { animation: none; display: none; } }
.gdw-org__node > .gdw-org__card { flex-grow: 1 !important; height: 100%; }
.gdw-org__card > .gdw-areas__more { margin-top: auto !important; }

/* 28. Vídeos de YouTube en ventana emergente (script en custom.js: cualquier enlace a un vídeo) */
.gdw-vlb { position: fixed; inset: 0; z-index: 100000; display: flex; align-items: center; justify-content: center; padding: 5vw; background: rgba(8, 9, 11, 0.9); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); opacity: 0; transition: opacity 0.25s ease; }
.gdw-vlb.is-open { opacity: 1; }
.gdw-vlb__frame { position: relative; width: min(1100px, 100%); aspect-ratio: 16 / 9; border-radius: 10px; overflow: hidden; border: 1px solid rgba(255, 255, 255, 0.12); box-shadow: 0 40px 120px rgba(0, 0, 0, 0.6); background: #000000; }
.gdw-vlb__frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.gdw-vlb__close { position: absolute; top: 18px; right: 18px; width: 46px; height: 46px; padding: 0; border-radius: 8px; border: 1px solid rgba(255, 255, 255, 0.22); background: #121418; color: #FFFFFF; font-size: 28px; line-height: 1; cursor: pointer; transition: border-color 0.2s, background 0.2s; }
.gdw-vlb__close:hover, .gdw-vlb__close:focus-visible { border-color: #E0262B; background: #1A1D22; }
html.gdw-vlb-open { overflow: hidden; }

/* 29. Especies (Salud animal): tarjetas técnicas con la foto que se funde con la tarjeta */
.gdw-especie__foto { overflow: hidden; }
.gdw-especie__foto img { -webkit-mask-image: linear-gradient(180deg, #000 50%, transparent 100%); mask-image: linear-gradient(180deg, #000 50%, transparent 100%); filter: saturate(0.85) contrast(1.05); transition: transform 0.6s ease, filter 0.6s ease; }
.gdw-especie:hover .gdw-especie__foto img { transform: scale(1.05); filter: saturate(1) contrast(1.05); }
.gdw-especie__info { margin-top: -26px; }

/* 30. Botón de cerrar del bocadillo de WhatsApp como en la base (los estilos de botón del Kit no le afectan) */
.gdw-wa .gdw-wa__close { display: flex !important; align-items: center; justify-content: center; width: 22px !important; height: 22px !important; min-height: 0 !important; padding: 0 !important; margin: 0 !important; border: 0 !important; border-radius: 50% !important; background: var(--gdw-wa-red, #E82828) !important; box-shadow: none !important; font-size: 0 !important; line-height: 0 !important; transform: none; }
.gdw-wa .gdw-wa__close:hover, .gdw-wa .gdw-wa__close:focus-visible { background: var(--gdw-wa-red, #E82828) !important; transform: scale(1.1); }

/* 31. Botones del aviso de cookies compactos (los estilos de botón del Kit no les afectan) */
.cky-consent-container .cky-btn, .cky-modal .cky-btn, .cky-preference-center .cky-btn { padding: 10px 20px !important; font-family: "Inter", sans-serif !important; font-size: 14px !important; line-height: 1.4 !important; border-radius: 8px !important; box-shadow: none !important; transform: none !important; }

/* 32. Tarjetas del blog: al pasar el ratón, solo zoom de la imagen */
.gdw-blog__grid .eael-entry-overlay { display: none !important; }
.gdw-blog__grid .eael-grid-post-holder::after { content: none !important; }
.gdw-blog__grid .eael-grid-post-holder:hover { transform: none !important; box-shadow: none !important; border-color: rgba(255, 255, 255, 0.18) !important; }
.gdw-blog__grid .eael-entry-thumbnail { overflow: hidden; }
.gdw-blog__grid .eael-entry-thumbnail img { transition: transform 0.7s cubic-bezier(0.2, 0.7, 0.2, 1) !important; }
.gdw-blog__grid .eael-entry-thumbnail.eael-image-ratio img { transform: translate(-50%, -50%) scale(1.01) !important; transform-origin: center center; }
.gdw-blog__grid .eael-grid-post-holder:hover .eael-entry-thumbnail.eael-image-ratio img { transform: translate(-50%, -50%) scale(1.08) !important; }

/* 33. Mallas hexagonales decorativas: blanca en fondos negros, negra o roja en fondos claros */
.gdw-hexmesh, .gdw-hexmesh--light, .gdw-hexmesh--red { position: relative; }
.gdw-hexmesh::after, .gdw-hexmesh--light::after, .gdw-hexmesh--red::after { content: ""; position: absolute; z-index: 0; pointer-events: none; width: min(620px, 60%); aspect-ratio: 620 / 540; background-repeat: no-repeat; background-size: contain; }
.gdw-hexmesh::after { top: 0; right: 0; background-image: url("/wp-content/uploads/2026/10/gc-malla-hexagonal-blanca.svg"); opacity: 0.34; }
.gdw-hexmesh--light::after { top: 0; right: 0; background-image: url("/wp-content/uploads/2026/10/gc-malla-hexagonal-negra.svg"); opacity: 0.16; }
.gdw-hexmesh--red::after { bottom: 0; left: 0; top: auto; right: auto; background-image: url("/wp-content/uploads/2026/10/gc-malla-hexagonal-roja.svg"); opacity: 0.16; transform: scale(-1, -1); }
.gdw-hexmesh--bl::after { top: auto; right: auto; bottom: 0; left: 0; transform: scale(-1, -1); }
.gdw-hexmesh > .elementor-element, .gdw-hexmesh > .e-con-inner, .gdw-hexmesh--light > .elementor-element, .gdw-hexmesh--light > .e-con-inner, .gdw-hexmesh--red > .elementor-element, .gdw-hexmesh--red > .e-con-inner { position: relative; z-index: 1; }
@media (max-width: 767px) { .gdw-hexmesh::after, .gdw-hexmesh--light::after, .gdw-hexmesh--red::after { width: 90%; opacity: 0.22; } }

/* 34. Línea de tiempo (gdw-timeline): línea fina con un punto rojo por hito */
.gdw-timeline__item { position: relative; }
.gdw-timeline__item::before { content: "" !important; position: absolute !important; top: 12px !important; left: 0 !important; width: 100% !important; height: 1px !important; background: #C9CED6 !important; opacity: 1 !important; border: 0 !important; mix-blend-mode: normal !important; }
.gdw-timeline__item::after { content: ""; position: absolute; top: 8px; left: 0; width: 9px; height: 9px; background: #BF1818; box-shadow: 0 0 0 4px rgba(191, 24, 24, 0.15); }
.gdw-timeline--dark .gdw-timeline__item::before { background: rgba(255, 255, 255, 0.14) !important; }
@media (max-width: 1024px) {
	.gdw-timeline__item { padding-left: 26px !important; }
	.gdw-timeline__item::before { top: 0 !important; left: 4px !important; width: 1px !important; height: 100% !important; }
	.gdw-timeline__item::after { top: 4px; }
}

/* 35. Tubería de fases (gdw-pipeline): línea con un punto por tarjeta y pulso rojo */
.gdw-pipeline { position: relative; }
@media (min-width: 1025px) {
	.gdw-pipeline { padding-top: 34px !important; background-image: radial-gradient(circle, #E0262B 0 2.5px, transparent 3px), radial-gradient(circle, #E0262B 0 2.5px, transparent 3px), radial-gradient(circle, #E0262B 0 2.5px, transparent 3px), radial-gradient(circle, #E0262B 0 2.5px, transparent 3px), radial-gradient(circle, #E0262B 0 2.5px, transparent 3px), linear-gradient(rgba(255, 255, 255, 0.16), rgba(255, 255, 255, 0.16)); background-size: 8px 8px, 8px 8px, 8px 8px, 8px 8px, 8px 8px, 80% 1px; background-position: 10% 10px, 30% 10px, 50% 10px, 70% 10px, 90% 10px, 50% 14px; background-repeat: no-repeat; }
	.gdw-pipeline::after { content: ""; position: absolute; top: 14px; left: 10%; width: 80%; height: 1px; pointer-events: none; background: linear-gradient(90deg, transparent, #E0262B, transparent) no-repeat; background-size: 20% 100%; animation: gdw-flujo 4.2s linear infinite; }
}
.gdw-pipeline__node > .gdw-tcard { flex-grow: 1 !important; height: 100%; }
@media (prefers-reduced-motion: reduce) { .gdw-pipeline::after { display: none; } }

/* 36. Marcos técnicos para fotos (gdw-frame), listas numeradas y sellos */
.gdw-frame .gdw-frame__img img { border-radius: 6px; transition: transform 0.7s cubic-bezier(0.2, 0.7, 0.2, 1); }
.gdw-frame .gdw-frame__img { overflow: hidden; border-radius: 6px; }
.gdw-frame:hover .gdw-frame__img img { transform: scale(1.04); }
.gdw-lista-fila:first-child { border-top: 1px solid rgba(255, 255, 255, 0.09); }
.gdw-sello .gdw-sello__img img { opacity: 1 !important; max-width: 140px !important; max-height: 120px !important; }
.gdw-vacio { display: none !important; }
.gdw-tcard > .gdw-areas__more, .gdw-tcard > .elementor-widget-button:last-child { margin-top: auto !important; }

/* 37. Secciones grises: malla hexagonal negra (arriba a la derecha) y roja corporativa (abajo a la izquierda) */
.gdw-hexmesh--duo { background-image: url("/wp-content/uploads/2026/10/gc-malla-hexagonal-negra-suave.svg"), url("/wp-content/uploads/2026/10/gc-malla-hexagonal-roja-suave.svg") !important; background-position: right top, left bottom !important; background-size: min(600px, 55%) auto, min(560px, 50%) auto !important; background-repeat: no-repeat !important; }
@media (max-width: 767px) { .gdw-hexmesh--duo { background-size: 95% auto, 90% auto !important; } }

/* 38. Desplegables (acordeón anidado): icono centrado dentro de su círculo, en todos */
.e-n-accordion-item-title-icon > span { justify-content: center !important; align-items: center !important; }
.e-n-accordion-item-title-icon > span > svg, .e-n-accordion-item-title-icon > span > i { margin: 0 !important; }

/* 39. Columna fija al bajar (gdw-sticky): justo por debajo de la cabecera + 30 px; --gdw-header-h lo actualiza custom.js */
@media (min-width: 1025px) {
	.gdw-sticky { position: sticky !important; top: calc(var(--gdw-header-h, 85px) + 30px + var(--wp-admin--admin-bar--height, 0px)); align-self: flex-start !important; z-index: 2; }
}

/* 40. Línea de tiempo con destello rojo que la recorre (como la tubería de Porcino) */
.gdw-timeline { position: relative; }
@media (min-width: 1025px) {
	.gdw-timeline::after { content: ""; position: absolute; top: 12px; left: 0; width: 100%; height: 1px; z-index: 1; pointer-events: none; background: linear-gradient(90deg, transparent, #E0262B, transparent) no-repeat; background-size: 22% 100%; animation: gdw-flujo 4s linear infinite; }
}
@media (prefers-reduced-motion: reduce) { .gdw-timeline::after { display: none; } }

/* 41. Tarjetas del blog: el fondo carbón solo en el bloque de texto; la foto, sin marco ni fondo */
.gdw-blog__grid .eael-grid-post-holder, .gdw-blog__grid .eael-grid-post-holder:hover { background-color: transparent !important; border: 0 !important; }
.gdw-blog__grid .eael-entry-media { border-bottom: 0 !important; }
.gdw-blog__grid .eael-entry-wrapper { background-color: #121418 !important; }

/* 42. Sección oscura con dos mallas (gdw-hexmesh + gdw-hexmesh--dkduo): blanca arriba a la derecha y roja suave abajo a la izquierda */
.gdw-hexmesh--dkduo { background-image: url("/wp-content/uploads/2026/10/gc-malla-hexagonal-roja-suave.svg") !important; background-position: left bottom !important; background-size: min(560px, 50%) auto !important; background-repeat: no-repeat !important; }
@media (max-width: 767px) { .gdw-hexmesh--dkduo { background-size: 90% auto !important; } }

/* 43. Grupo Cerama, franja «Todo empezó en 1996» (gdw-grupo-intro): las dos mallas a la altura de la franja */
.gdw-grupo-intro.gdw-hexmesh::after { width: auto; height: 100%; }
.gdw-grupo-intro.gdw-hexmesh--dkduo { background-size: auto 100% !important; }
.gdw-grupo-intro .elementor-widget-text-editor p:last-child { margin-bottom: 0; }
.gdw-grupo-intro strong { color: #FFFFFF; font-weight: 500; }

/* 44. Sin espaciado negativo entre letras en toda la web (la base lo pone en los títulos de los textos legales; montar.py ya lo quita, esto queda por si acaso) */
.gdw-legal .gdw-legal__body h2 { letter-spacing: normal; }

/* 45. Animaciones de entrada fadeInUp con un recorrido de 100 px como máximo. La de Elementor sube el 100 % de la altura del elemento, y los bloques altos (textos legales, rejillas, galerías) salían desde muy abajo */
@keyframes gdw-fade-in-up { from { opacity: 0; transform: translate3d(0, min(100%, 100px), 0); } to { opacity: 1; transform: none; } }
.elementor-element.animated.fadeInUp { animation-name: gdw-fade-in-up; }

/* 47. Repaso de entrega (14-10-2026): menús del pie que se ajustan al ancho (en tablet y portátil ensanchaban la página), barra superior sin «Trabaja con nosotros» en tablet vertical, autor oculto en búsquedas y archivos, y tablas de los legales con desplazamiento propio en el móvil */
.gdw-footer__fila > .gdw-footer__menu { flex: 1 1 0% !important; min-width: 0; }
@media (max-width: 900px) { .gdw-header__jobs { display: none !important; } }
.search .entry-meta, .archive .entry-meta { font-size: 0; }
.search .entry-meta .posted-on, .archive .entry-meta .posted-on { font-size: 13px; }
.gdw-tabla-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.gdw-tabla-scroll table { min-width: 640px; }

/* 48. Repaso responsive (14-10-2026, de 360 a 1920 px) */
/* Cifras de la portada: entre 1025 y 1150 px la cuarta bajaba sola a otra fila (cuatro al 24 % más los huecos no cabían), y «30 años» se partía en dos líneas en el móvil y en portátiles pequeños. En escritorio, una fila; el número se ajusta al ancho de su tarjeta */
@media (min-width: 1025px) { .gdw-hero__stats { flex-wrap: nowrap !important; } }
.gdw-hero__stat { container-type: inline-size; }
.gdw-hero__stat .elementor-counter-number-prefix, .gdw-hero__stat .elementor-counter-number-suffix { white-space: pre !important; }
.gdw-hero__stat .elementor-counter-number-wrapper { font-size: min(58px, 26cqi) !important; }
@media (max-width: 1024px) { .gdw-hero__stat .elementor-counter-number-wrapper { font-size: min(46px, 26cqi) !important; } }
@media (max-width: 767px) { .gdw-hero__stat .elementor-counter-number-wrapper { font-size: min(40px, 26cqi) !important; } }
/* Tablet: las tarjetas al 48 % dejaban un hueco a la derecha y la última, si era impar, sola en su fila; ahora llenan la fila */
@media (max-width: 1024px) {
	.e-con > .gdw-card:not(.gdw-org__hub):not(.gdw-footer__cta):not(.gdw-mega__main) { flex-grow: 1; }
}
/* Especies (Salud animal): entre 1025 y 1279 px la etiqueta «SALUD ANIMAL» no cabía y salía cortada; se oculta, como en el móvil */
@media (min-width: 1025px) and (max-width: 1279px) { .gdw-especie .elementor-hidden-mobile { display: none; } }
/* Noticias y eventos: tarjetas de una fila a la misma altura y «Leer más» alineado abajo; fecha a 12 px y, en pantallas medianas, en dos líneas si no cabe (salía cortada) */
.gdw-blog__grid .eael-post-appender { display: flex !important; flex-wrap: wrap; }
.gdw-blog__grid .eael-post-appender > .eael-grid-post { display: flex; float: none !important; }
.gdw-blog__grid .eael-grid-post > .eael-grid-post-holder { flex: 1 1 auto; width: 100%; display: flex; flex-direction: column; }
.gdw-blog__grid .eael-grid-post-holder > .eael-grid-post-holder-inner { flex: 1 1 auto; height: auto; }
.gdw-blog__grid .eael-entry-meta, .gdw-blog__grid .eael-entry-meta time, .gdw-blog__grid .eael-meta-posted-on { font-size: 12px !important; }
@media (max-width: 1279px) { .gdw-blog__grid .eael-meta-posted-on, .gdw-blog__grid .eael-meta-posted-on time { white-space: normal !important; letter-spacing: 0.6px !important; } }
.gdw-blog__grid .eael-load-more-button-wrap { margin-top: 32px; }
/* Logos en baldosas: en pantallas táctiles no hay «pasar el ratón» que los encienda */
@media (hover: none) { .gdw-tile img { opacity: 0.9; } }
/* Tarjetas con foto (Instalaciones): la etiqueta roja caía sobre la zona clara de la foto y no se leía */
.gdw-tarjeta-foto::before { background-image: linear-gradient(rgba(8, 9, 11, 0.2) 0%, rgba(8, 9, 11, 0.5) 45%, rgba(8, 9, 11, 0.9) 100%) !important; }
.gdw-tarjeta-foto .gdw-eyebrow .elementor-heading-title { display: inline-block; padding: 5px 9px; border-radius: 4px; background: rgba(8, 9, 11, 0.72); }
/* Pie: los enlaces legales no se parten; en escritorio, en una sola línea («Mapa del sitio» bajaba sola por un píxel) */
.gdw-footer__legal a.hfe-menu-item { white-space: nowrap; }
@media (min-width: 1025px) { .gdw-footer__legal ul.hfe-nav-menu { flex-wrap: nowrap; } }
/* Plantillas del tema (entradas, archivo, búsqueda, 404): «Trabaja con nosotros» y el crédito salían en el rojo de los enlaces de Astra; mismo gris que en las páginas */
.gdw-header__jobs a { color: #A3A9B3; }
.gdw-footer__credit a { color: #7D838D; }
.gdw-footer__credit a:hover { color: #FFFFFF; }
/* Entradas: velo más oscuro sobre la imagen de cabecera (el de Astra es gris al 55 %: título y fecha se leían mal sobre las ilustraciones claras) */
.single-post .ast-single-entry-banner { position: relative; isolation: isolate; }
.single-post .ast-single-entry-banner::before { content: ""; position: absolute; inset: 0; z-index: 0; background: rgba(8, 9, 11, 0.45); pointer-events: none; }
.single-post .ast-single-entry-banner > * { position: relative; z-index: 1; }
.single-post .ast-single-entry-banner .entry-meta, .single-post .ast-single-entry-banner .entry-meta * { font-size: 13px !important; }
/* Archivo y búsqueda: miniaturas recortadas, no estiradas */
.archive .post-thumb-img-content img, .search .post-thumb-img-content img { object-fit: cover; }
/* WhatsApp: oculto mientras está abierto el menú del móvil (el menú va dentro de la cabecera fija y quedaba por debajo) */
body:has(.hfe-side.hfe-flyout-show) .gdw-wa { opacity: 0 !important; visibility: hidden !important; pointer-events: none !important; }
/* Galerías: dos columnas en el móvil (con una sola, Avicultura y Porcino eran miles de píxeles de fotos) */
@media (max-width: 767px) { .gdw-gallery .gallery-item { max-width: 50% !important; } }
/* Formulario de candidaturas: botón para elegir el archivo con el estilo de la web, y el campo a todo el ancho (en el móvil el nombre del archivo salía recortado) */
.gdw-form input[type="file"] { display: block; width: 100%; max-width: 100%; color: #555B65; }
.gdw-form input[type="file"]::file-selector-button { margin: 0 12px 0 0; padding: 10px 18px; border: 1px solid #0D0F12; border-radius: 8px; background: #FFFFFF; color: #0D0F12; font: 600 14px "Inter Tight", sans-serif; cursor: pointer; transition: background-color 0.2s, color 0.2s; }
.gdw-form input[type="file"]::file-selector-button:hover { background: #0D0F12; color: #FFFFFF; }
/* Tabla de cookies: columnas repartidas (la de finalidad quedaba estrecha y las filas, altísimas), nombres largos partidos y aviso de que se desliza en el móvil */
.gdw-tabla-scroll th:nth-child(1) { width: 22%; }
.gdw-tabla-scroll th:nth-child(2) { width: 16%; }
.gdw-tabla-scroll th:nth-child(3) { width: 38%; }
.gdw-tabla-scroll th:nth-child(4) { width: 14%; }
.gdw-tabla-scroll td:first-child { overflow-wrap: anywhere; }
@media (max-width: 767px) {
	.gdw-tabla-scroll table { min-width: 720px; }
	.gdw-tabla-scroll::before { content: "Desliza la tabla a los lados para ver todas las columnas →"; display: block; margin: 0 0 8px; font-size: 13px; color: #6B717B; }
}
/* Títulos sin una palabra sola en la última línea */
.elementor-heading-title, .entry-title, .gdw-footer p { text-wrap: pretty; }
/* Tarjetas de áreas de la portada: «Saber más» a la misma altura en las cuatro (la foto de abajo se llevaba el hueco sobrante) */
.gdw-areas__card > .gdw-areas__more { margin-top: auto !important; }
.gdw-areas__card > .gdw-areas__foto { margin-top: 16px !important; }
/* Tarjetas con un botón al final (PESI y QR en Bioseguridad): el botón abajo, a la misma altura en las dos */
.gdw-card > .elementor-widget-button:last-child { margin-top: auto; }
/* Tabla de códigos L.E.R.: la cabecera «Código L.E.R.» en una línea */
.gdw-tabla th:first-child { white-space: nowrap; }

/* 49. Segunda tanda del repaso (16-10-2026, Mario) */
/* Textos legales: título, fecha y texto en una columna centrada de 1440 px como máximo (Mario, 16-10-2026: con 62ch el texto se quedaba estrecho y a la izquierda; después pidió 1440 px, igual que en las noticias). Las tablas, al ancho de la columna */
.gdw-legal > .elementor-widget { width: 100%; max-width: 1440px !important; margin-left: auto !important; margin-right: auto !important; }
/* Menú: en las páginas de las áreas, «Grupo Cerama» se marca como sección activa (UAE solo subraya el elemento actual; en los elementos con submenú el enlace va dentro de un div) */
.gdw-header__nav .hfe-nav-menu > li:is(.current-menu-ancestor, .current-menu-parent) > a.hfe-menu-item,
.gdw-header__nav .hfe-nav-menu > li:is(.current-menu-ancestor, .current-menu-parent) > .hfe-has-submenu-container > a.hfe-menu-item { color: #FFFFFF; }
.gdw-header__nav .hfe-nav-menu > li:is(.current-menu-ancestor, .current-menu-parent) > a.hfe-menu-item::after,
.gdw-header__nav .hfe-nav-menu > li:is(.current-menu-ancestor, .current-menu-parent) > .hfe-has-submenu-container > a.hfe-menu-item::after { opacity: 1 !important; }
/* Contraste: en fondos oscuros, el rojo de las etiquetas pequeñas (color global «trigo» del Kit, #E0262B, 3,9–4,3:1) pasa a #F24A4F (4,7–5,6:1). En fondo claro sigue el de siempre */
:is(.gdw-dark, .gdw-hex, .gdw-glowbg, .gdw-page-hero, .gdw-home-hero, .gdw-footer, .gdw-mega, .gdw-contacto__datos) { --e-global-color-trigo: #F24A4F; }
/* Encuadres: la vaca (que solo enseñaba pelo), la sede (media foto de cielo) y la furgoneta del D.A.R. (cortada a la derecha) */
img[src*="gc-vaca"] { object-position: 50% 100% !important; }
.gdw-especie img[src*="gc-vaca"] { object-position: 50% 50% !important; }
img[src*="gc-b0055f85-89b4-4622-aa33-3ccdc8630ae0"] { object-position: 50% 88% !important; }
img[src*="gc-dar-1"] { object-position: 85% 50% !important; }
/* Ilustración de Biocitro (con texto): entera sobre blanco en las tarjetas, sin recortar */
.gdw-blog__grid img[src*="gc-sujeto-15"] { object-fit: contain !important; background: #FFFFFF; }
/* Logos de marcas: los que ocupaban una parte pequeña de su caja, a un tamaño parecido al resto (escala calculada con la parte visible de cada logo) */
.gdw-tile img[src*="gc-ceva-1513784951-blanco"] { scale: 1.79; }
.gdw-tile img[src*="gc-dopharma-iberia-logo-hor-rgb-hr-blanco"] { scale: 1.08; }
.gdw-tile img[src*="gc-logo-karizoo-blanco"] { scale: 1.38; }
.gdw-tile img[src*="gc-marca-porcino-03-blanco"] { scale: 1.1; }
.gdw-tile img[src*="gc-marca-porcino-06-blanco"] { scale: 1.43; }
.gdw-tile img[src*="gc-marca-residuos-01-blanco"] { scale: 1.67; }
.gdw-tile img[src*="gc-marca-residuos-02-blanco"] { scale: 1.17; }
.gdw-tile img[src*="gc-marca-residuos-04-blanco"] { scale: 1.3; }
.gdw-tile img[src*="gc-marca-residuos-05-blanco"] { scale: 1.21; }
.gdw-tile img[src*="gc-marca-residuos-06-blanco"] { scale: 1.25; }
.gdw-tile img[src*="gc-marca-residuos-07-blanco"] { scale: 1.23; }
.gdw-tile img[src*="gc-marca-residuos-09-blanco"] { scale: 1.15; }
.gdw-tile img[src*="gc-marca-residuos-10-blanco"] { scale: 1.25; }
.gdw-tile img[src*="gc-marca-residuos-11-blanco"] { scale: 1.28; }
.gdw-tile img[src*="gc-marca-residuos-12-blanco"] { scale: 1.14; }
.gdw-tile img[src*="gc-veterinaria-02-blanco"] { scale: 1.12; }
.gdw-tile img[src*="gc-veterinaria-04-blanco"] { scale: 1.08; }
.gdw-tile img[src*="gc-veterinaria-11-blanco"] { scale: 1.19; }
.gdw-tile img[src*="gc-veterinaria-12-blanco"] { scale: 1.2; }
.gdw-tile img[src*="gc-veterinaria-13-blanco"] { scale: 1.2; }
.gdw-tile img[src*="gc-veterinaria-14-blanco"] { scale: 1.19; }
/* Diagrama de empresas: el logo de Gestión Ambiental (casi cuadrado) se veía mucho más pequeño que los otros tres */
.gdw-org__logo img[src*="gc-marca-04"] { scale: 1.18; }
/* Búsqueda: cabecera oscura como la de las páginas y resultados en tarjetas de la web, sin fotos y sin fecha en las páginas */
.search .ast-archive-description { position: relative; margin: 0 0 40px; padding: 56px 48px 46px; border-radius: 14px; background: #08090B url("/wp-content/uploads/2026/10/gc-malla-hexagonal-roja-suave.svg") right bottom / min(420px, 45%) auto no-repeat; }
.search .ast-archive-description::before { content: "■  Búsqueda"; display: block; margin: 0 0 14px; font: 500 12px/1.2 "JetBrains Mono", monospace; letter-spacing: 0.22em; text-transform: uppercase; color: #F24A4F; }
.search .ast-archive-title { margin: 0; color: #FFFFFF; font-family: "Inter Tight", sans-serif; font-weight: 600; }
.search .ast-archive-title span { color: #F24A4F; }
.search .ast-breadcrumbs-wrapper, .search .ast-blog-featured-section, .search .type-page .entry-meta { display: none !important; }
.search .ast-article-inner { height: 100%; padding: 28px 26px !important; border: 1px solid #E3E5E9; border-radius: 10px; background: #FFFFFF; transition: border-color 0.25s, box-shadow 0.25s, transform 0.25s; }
.search .ast-article-inner:hover { border-color: rgba(191, 24, 24, 0.45); box-shadow: 0 22px 44px -26px rgba(8, 9, 11, 0.35); transform: translateY(-3px); }
.search .entry-title a { color: #0D0F12; font-family: "Inter Tight", sans-serif; }
.search .entry-title a:hover { color: #BF1818; }
.search .ast-excerpt-container p { color: #555B65; }
@media (max-width: 767px) { .search .ast-archive-description { padding: 36px 22px 30px; } }
/* Página 404 (la escribe grupocerama.php): bloque oscuro con buscador, accesos a las áreas y botones */
.gdw-404 { max-width: 820px; margin: 72px auto 96px; padding: 56px 48px; border-radius: 14px; background: #08090B url("/wp-content/uploads/2026/10/gc-malla-hexagonal-roja-suave.svg") right bottom / min(420px, 50%) auto no-repeat; color: #A3A9B3; }
.gdw-404__eyebrow { margin: 0 0 14px; font: 500 12px/1.2 "JetBrains Mono", monospace; letter-spacing: 0.22em; text-transform: uppercase; color: #F24A4F; }
.gdw-404__eyebrow::before { content: ""; display: inline-block; width: 8px; height: 8px; margin-right: 10px; background: #F24A4F; vertical-align: 1px; }
.gdw-404 h1.gdw-404__title { margin: 0 0 16px; color: #FFFFFF; font-family: "Inter Tight", sans-serif; font-weight: 600; font-size: clamp(32px, 4vw, 48px); line-height: 1.1; }
.gdw-404__text { max-width: 56ch; margin: 0 0 28px; font-size: 17px; line-height: 1.6; }
.gdw-404__search { max-width: 460px; margin: 0 0 28px; }
.gdw-404__search label { position: relative; display: block; margin: 0; }
.gdw-404__search .search-field { width: 100%; min-height: 50px; padding: 12px 52px 12px 16px; border: 1px solid rgba(255, 255, 255, 0.2); border-radius: 8px; background: #121418; color: #FFFFFF; font-size: 16px; }
.gdw-404__search .search-field::placeholder { color: #A3A9B3; }
.gdw-404__search button { position: absolute; top: 3px; right: 3px; width: 44px !important; height: 44px !important; min-height: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; color: #FFFFFF !important; box-shadow: none !important; }
.gdw-404__search input[type="submit"] { display: none; }
.gdw-404__links { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 0 32px; padding: 0; list-style: none; }
.gdw-404__links a { display: inline-block; padding: 10px 15px; border: 1px solid rgba(255, 255, 255, 0.16); border-radius: 999px; color: #FFFFFF; font: 500 14px "Inter Tight", sans-serif; text-decoration: none; transition: border-color 0.2s, background-color 0.2s; }
.gdw-404__links a:hover { border-color: #F24A4F; background: rgba(242, 74, 79, 0.1); color: #FFFFFF; }
.gdw-404__actions { display: flex; flex-wrap: wrap; gap: 12px; margin: 0; }
.gdw-404__btn { display: inline-flex; align-items: center; padding: 13px 22px; border: 1px solid #BF1818; border-radius: 8px; background: #BF1818; color: #FFFFFF !important; font: 600 15px "Inter Tight", sans-serif; text-decoration: none !important; transition: background-color 0.2s, border-color 0.2s; }
.gdw-404__btn:hover { background: #9A1414; border-color: #9A1414; }
.gdw-404__btn--line { border-color: rgba(255, 255, 255, 0.3); background: transparent; }
.gdw-404__btn--line:hover { border-color: #FFFFFF; background: rgba(255, 255, 255, 0.08); }
@media (max-width: 767px) { .gdw-404 { margin: 32px 0 56px; padding: 36px 22px; } }
/* Ficha de cada noticia y evento: etiqueta de la sección sobre el título, texto centrado de 1440 px como máximo (Mario, 16-10-2026; antes, 860), la ficha de medicamento en una tarjeta, enlace para volver y navegación más cómoda */
.single-post .ast-single-entry-banner .ast-container::before { display: block; width: 100%; margin: 0 0 16px; font: 500 12px/1.2 "JetBrains Mono", monospace; letter-spacing: 0.22em; text-transform: uppercase; text-align: center; color: #F24A4F; }
.gdw-cat-actualidad .ast-single-entry-banner .ast-container::before { content: "■  Actualidad"; }
.gdw-cat-eventos .ast-single-entry-banner .ast-container::before { content: "■  Eventos"; }
.single-post .site-main > article, .single-post .post-navigation { max-width: 1440px; margin-left: auto !important; margin-right: auto !important; }
.single-post .entry-content { font-size: 17px; line-height: 1.75; }
.gdw-cat-actualidad .entry-content > p:first-child { padding: 28px 32px; border: 1px solid #E3E5E9; border-radius: 12px; background: #FFFFFF; line-height: 2; box-shadow: 0 18px 40px -30px rgba(8, 9, 11, 0.35); }
.gdw-volver { margin: 32px 0 0; }
.single-post .entry-content .gdw-volver a { display: inline-flex; align-items: center; gap: 8px; padding: 11px 18px; border: 1px solid #0D0F12; border-radius: 8px; color: #0D0F12; font: 600 14px "Inter Tight", sans-serif; text-decoration: none; transition: background-color 0.2s, color 0.2s; }
.single-post .entry-content .gdw-volver a:hover { background: #0D0F12; color: #FFFFFF; }
.single-post .post-navigation a { display: block; padding: 8px 0; }
@media (max-width: 767px) { .gdw-cat-actualidad .entry-content > p:first-child { padding: 20px 18px; } }

/* 50. Tercera tanda (16-10-2026, Mario) */
/* Contacto y Trabaja con nosotros en tablet (768–1024 px): los cuatro datos de contacto y los cuatro motivos, en 2 × 2 (uno debajo de otro y a todo el ancho dejaban media tarjeta vacía). Los motivos llevan la clase gdw-trabaja__motivos en su contenedor (07382c0). La etiqueta, el título y la tarjeta de empleo siguen a todo el ancho */
@media (min-width: 768px) and (max-width: 1024px) {
	.gdw-contacto__datos, .gdw-trabaja__motivos { flex-direction: row !important; flex-wrap: wrap !important; }
	.gdw-contacto__datos > *, .gdw-trabaja__motivos > * { flex: 0 0 100% !important; max-width: 100% !important; }
	.gdw-contacto__datos > .gdw-contacto__dato { flex: 1 1 calc(50% - 14px) !important; width: auto !important; justify-content: center !important; }
	.gdw-trabaja__motivos > .e-con { flex: 1 1 calc(50% - 26px) !important; width: auto !important; }
}
/* Nombres que no se parten por el guion («FAMI-QS», «Castilla-La Mancha»): en el texto van dentro de <span class="gdw-nowrap">. Funciona también en los titulares que custom.js parte en palabras */
.gdw-nowrap { white-space: nowrap; }
/* Salud animal, D.A.R.: la foto de la furgoneta lleva un enlace al vídeo que no era un bloque, y la foto tomaba el ancho de su alto (234 px en el móvil, 324 en ordenador) en vez de llenar su columna como la gráfica */
.gdw-salud-dar .elementor-widget-image a { display: block; }
/* Galerías: si la última fila no está completa, sus fotos van centradas (Avicultura tiene 18: en ordenador, la última fila lleva 2) */
.gdw-gallery .gallery { text-align: center; }
/* Bocadillo de WhatsApp: el aspa de cerrar en el rojo de la marca (el plugin trae el rojo de la base en --gdw-wa-red). Aspa blanca a 6,3:1 */
body .gdw-wa { --gdw-wa-red: #BF1818; }