/*
 * Conqr · conqr.css
 * Port de fuente/assets/site.css (fase 01: variables, reset, tipografía, body, .world/.glow, .grain).
 * El resto de site.css llega con el widget o behavior que lo usa, en su fase.
 *
 * Regla: los colores y tipos viven en Elementor → Site Settings (Global Colors / Global Fonts).
 * Aquí solo se referencian con var(--e-global-…), con el valor original como respaldo.
 * Elementor define esas variables en el <body> (.elementor-kit-N), por eso las --cq-* se
 * declaran en body y no en :root.
 */

body {
	--cq-ink: var(--e-global-color-conqr_black, #000000);
	--cq-paper: var(--e-global-color-conqr_white, #FFFFFF);
	--cq-blue: var(--e-global-color-conqr_blue, #2F5BFF);
	--cq-navy: var(--e-global-color-conqr_navy, #0A1240);
	--cq-sky: var(--e-global-color-conqr_sky, #A9BCFF);
	--cq-dim: var(--e-global-color-conqr_dim, rgba(255, 255, 255, .58));
	--cq-faint: var(--e-global-color-conqr_faint, rgba(255, 255, 255, .16));

	/* Luces del fondo (.glow) */
	--cq-glow-deep: var(--e-global-color-conqr_glow_deep, #0A1A70);
	--cq-glow-night: var(--e-global-color-conqr_glow_night, #06103F);
	--cq-glow-electric: var(--e-global-color-conqr_glow_electric, #1E50FF);
	--cq-glow-cobalt: var(--e-global-color-conqr_glow_cobalt, #0A2AB0);

	--cq-font: "Helvetica Neue", Helvetica, Arial, sans-serif;
	--cq-m: clamp(20px, 5vw, 80px);          /* margen lateral (--m) */
	--cq-ease: cubic-bezier(.7, 0, .2, 1);    /* easing de todo el sitio (--ease) */
}

/* ---------- reset (site.css: :root, *, html, body, a, img, button, :focus-visible) ---------- */

:root {
	color-scheme: dark;
	box-sizing: border-box;
	padding-top: env(safe-area-inset-top, 0px);
	padding-bottom: env(safe-area-inset-bottom, 0px);
}

*,
*::before,
*::after {
	box-sizing: inherit;
}

html {
	background: var(--e-global-color-conqr_black, #000000);
	scroll-padding-top: env(safe-area-inset-top, 0px);
	scroll-behavior: auto;             /* neutraliza: html{scroll-behavior:smooth} de Elementor; el original salta sin animar */
}

body {
	margin: 0;
	background: var(--cq-ink);
	color: var(--cq-paper);
	font-family: var(--cq-font);
	line-height: normal;               /* neutraliza: body{line-height:1.5} de Hello; el original usa el normal del navegador */
	-webkit-font-smoothing: antialiased;
	overflow-x: hidden;
}

/* Hello Elementor pinta los enlaces de #c36; el original los hereda. */
a,
a:hover,
a:active {
	color: inherit;
}

/* site.css usa img{display:block}; aquí solo max-width para no romper la alineación del widget Imagen. */
img {
	max-width: 100%;
}

button {
	font: inherit;
	color: inherit;
}

:focus-visible {
	outline: 2px solid var(--cq-sky);
	outline-offset: 4px;
}

/* Todos los titulares van en minúsculas (y terminan en punto). */
h1,
h2,
h3 {
	text-transform: lowercase;
}

/* ---------- un solo fondo infinito para toda la página (.world / .glow) ---------- */
/* Lo imprime inc/frontend.php en wp_body_open. Las .glow empiezan en opacity:0; las mueve el JS de cada página. */

.cq-world {
	position: fixed;
	inset: 0;
	z-index: 0;
	background: #000;
	overflow: hidden;
	pointer-events: none;
}

.cq-glow {
	position: absolute;
	border-radius: 50%;
	filter: blur(80px);
	opacity: 0;
	will-change: transform, opacity;
}

#cq-g1 {
	width: 110vmax;
	height: 110vmax;
	left: 50%;
	top: 50%;
	margin: -55vmax 0 0 -55vmax;
	background: radial-gradient(closest-side, var(--cq-glow-deep) 0%, var(--cq-glow-night) 45%, rgba(0, 0, 0, 0) 100%);
}

#cq-g2 {
	width: 80vmax;
	height: 80vmax;
	left: 80%;
	top: 20%;
	margin: -40vmax 0 0 -40vmax;
	background: radial-gradient(closest-side, var(--cq-blue) 0%, rgba(20, 50, 200, .55) 45%, rgba(0, 0, 0, 0) 100%);
}

#cq-g3 {
	width: 90vmax;
	height: 90vmax;
	left: 42%;
	top: 50%;
	margin: -45vmax 0 0 -45vmax;
	background: radial-gradient(closest-side, var(--cq-glow-electric) 0%, var(--cq-glow-cobalt) 40%, rgba(0, 0, 0, 0) 100%);
}

#cq-g4 {
	width: 140vmax;
	height: 110vmax;
	left: 50%;
	top: 118%;
	margin: -55vmax 0 0 -70vmax;
	background: radial-gradient(closest-side, var(--cq-blue) 0%, rgba(35, 80, 240, .7) 40%, rgba(10, 18, 64, 0) 100%);
}

/* El contenido va por encima del fondo (main y footer con z-index:3 en el original).
   El header no entra aquí: en el original es fixed con z-index propio (fase del header). */
.site-main,
[data-elementor-type="wp-page"],
[data-elementor-type="wp-post"],
[data-elementor-type="single-page"],
[data-elementor-type="single-post"],
[data-elementor-type="single"],
[data-elementor-type="archive"],
[data-elementor-type="footer"] {
	position: relative;
	z-index: 3;
}

/* ---------- grano ---------- */

.cq-grain {
	position: fixed;
	inset: 0;
	z-index: 70;
	pointer-events: none;
	opacity: .08;
	mix-blend-mode: overlay;
	background-image: url("../img/grain.svg");
}

/* ---------- header (.top) · sección 1 ----------
 * Reglas exactas de site.css (.top, .logo, .tools, .lang, .burger, .menu-open, .on-light y @media 820px)
 * sobre el DOM del Theme Builder:
 *   .top    → contenedor raíz de la plantilla Header (clase cq-top)
 *   .logo   → widget Site Logo (clase cq-logo)
 *   .tools  → contenedor hijo (clase cq-tools)
 *   .lang   → widget Language Switcher de Connect Polylang (clase cq-lang): ul = píldora, a = botón
 *   .burger → widget Conqr Menu Toggle (button.cq-burger)
 * Lo marcado "neutraliza" no está en site.css: anula reset.css de Hello y los estilos de
 * Elementor/CPEL para que el resultado sea el del original.
 */

/* Sin z-index propio (sección 2): así .cq-top (60) y el menú (55) quedan en el contexto raíz,
   como .top y .menu en el original (la cortinilla, 58, va entre los dos). */
.elementor-location-header {
	position: relative;
}

.e-con.cq-top {
	position: fixed;
	z-index: 60;
	top: 0;
	left: 0;
	right: 0;
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: center;
	gap: 0;
	width: auto;
	max-width: none;
	min-height: 0;
	margin: 0;
	padding: calc(env(safe-area-inset-top, 0px) + 24px) var(--cq-m) 0;
	pointer-events: none;
	line-height: normal;
	transition: filter .35s ease;
}

/* No está en el original: con sesión iniciada la barra de admin de WP (32 px; 46 px en ≤782 px) tapaba el header. */
.admin-bar .e-con.cq-top {
	top: 32px;
}

@media (max-width: 782px) {
	.admin-bar .e-con.cq-top {
		top: 46px;
	}
}

.e-con.cq-top > * {
	pointer-events: auto;
}

/* .logo img{height:clamp(22px,2vw,28px); width:auto} (img{display:block} de site.css) */
.cq-logo a {
	display: block;
}

.cq-logo img {
	display: block;
	height: clamp(22px, 2vw, 28px);
	width: auto;
	max-width: 100%;
}

/* .tools{display:flex; align-items:center; gap:clamp(14px,2vw,28px)} */
.e-con.cq-tools {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: center;
	gap: clamp(14px, 2vw, 28px);
	width: auto;
	max-width: none;
	min-height: 0;
	margin: 0;
	padding: 0;
}

/* .lang */
.cq-lang .cpel-switcher__nav {
	display: block;
}

.cq-lang .cpel-switcher__list {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	gap: 2px;
	height: 34px;
	padding: 3px;
	border-radius: 999px;
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .25);
	background: rgba(0, 0, 0, .25);
	backdrop-filter: blur(8px);
	line-height: normal;
}

/* .lang button */
.cq-lang .cpel-switcher__lang a {
	text-align: center;
	display: flex;                     /* centra el texto como lo hace <button> */
	align-items: center;
	justify-content: center;
	border: 0;
	background: none;
	cursor: pointer;
	height: 28px;
	min-width: 36px;
	padding: 0 10px;
	border-radius: 999px;
	font-size: 12px;
	font-weight: 500;
	color: var(--cq-dim);
	text-decoration: none;
	transition: background .35s, color .35s;
}

/* .lang button[aria-pressed="true"] */
.cq-lang .cpel-switcher__lang--active a,
.cq-lang .cpel-switcher__lang--active a:hover {
	background: var(--cq-paper);
	color: var(--cq-ink);
}

.cq-lang .cpel-switcher__lang a:hover {
	color: var(--cq-dim);              /* neutraliza: a:hover de Hello */
}

/* .burger */
.cq-burger,
.cq-burger:hover,
.cq-burger:focus {
	display: flex;
	align-items: center;
	gap: 14px;
	height: 44px;
	padding: 0;
	border: 0;
	border-radius: 0;                  /* neutraliza: button de Hello */
	background: none;
	color: inherit;
	cursor: pointer;
	font: inherit;
	font-size: 14px;
	font-weight: 500;
	line-height: inherit;
	white-space: normal;
	transition: none;
}

.cq-burger .lbl {
	position: relative;
	overflow: hidden;
	height: 16px;
	display: block;
	min-width: 52px;
	text-align: right;
}

.cq-burger .lbl span {
	display: block;
	transition: transform .6s var(--cq-ease);
}

.menu-open .cq-burger .lbl span {
	transform: translateY(-100%);
}

.cq-burger .ico {
	position: relative;
	width: 28px;
	height: 28px;
}

.cq-burger .ico i {
	position: absolute;
	left: 2px;
	right: 2px;
	height: 1.5px;
	background: currentColor;
	transition: transform .6s var(--cq-ease), top .6s var(--cq-ease);
}

.cq-burger .ico i:nth-child(1) {
	top: 10px;
}

.cq-burger .ico i:nth-child(2) {
	top: 17px;
}

.menu-open .cq-burger .ico i:nth-child(1) {
	top: 13.5px;
	transform: rotate(45deg);
}

.menu-open .cq-burger .ico i:nth-child(2) {
	top: 13.5px;
	transform: rotate(-45deg);
}

/* :focus-visible{outline:2px solid var(--sky); outline-offset:4px} — neutraliza el box-shadow de Hello */
.cq-top a:focus-visible,
.cq-top button:focus-visible {
	box-shadow: none;
	outline: 2px solid var(--cq-sky);
	outline-offset: 4px;
}

@media (max-width: 820px) {
	.cq-burger .lbl {
		display: none;
	}
}

/* WP (2026-10-29, pedido; primero solo en About, luego en todo el sitio): lo que pasa por debajo del header se
   desvanece bajo un degradado oscuro, así nada se encima con el logo, EN/ES ni Menu. overlays.js pone cq-scrim y,
   al bajar más de 24 px, cq-scrim-on. Sobre la sección blanca (on-light) el header ya lleva fondo blanco; con el
   menú abierto, tampoco. */
.cq-scrim .e-con.cq-top::before {
	content: "";
	position: absolute;
	z-index: -1;
	top: 0;
	left: 0;
	right: 0;
	height: calc(100% + 64px);
	background: linear-gradient(to bottom, #000 0, #000 50%, rgba(0, 0, 0, .7) 72%, rgba(0, 0, 0, 0) 100%);
	pointer-events: none;
	opacity: 0;
	transition: opacity .35s ease;
}
.cq-scrim.cq-scrim-on .e-con.cq-top::before {
	opacity: 1;
}
.cq-scrim.on-light .e-con.cq-top::before,
.cq-scrim.menu-open .e-con.cq-top::before {
	opacity: 0;
}

/* Sobre la sección blanca el header se invierte (la clase on-light la pone esa sección).
   WP (2026-10-27): Safari no aplica filter:invert al contenedor fixed (con backdrop-filter dentro) y dejaba la
   barra transparente sobre lo que aún asoma de la sección anterior (la franja negra). Ahora el contenedor lleva
   fondo blanco (blanco limpio hasta arriba) y se invierte cada pieza (logo, EN|ES, Menu), sin backdrop-filter. */
.on-light .e-con.cq-top {
	background: #fff;
}
.on-light .e-con.cq-top > *,
.on-light .e-con.cq-top .cq-tools > * {
	filter: invert(1);
}
.on-light .e-con.cq-top .cq-tools {
	filter: none;
}
.on-light .e-con.cq-top * {
	-webkit-backdrop-filter: none !important;
	backdrop-filter: none !important;
}

/* ---------- menú (.menu) · sección 2 ----------
 * Reglas exactas de site.css (.menu, .mglow, .menu nav a, small, .roll, .side, .preview, .cta, .mfoot,
 * .contact, .social, .menu-open y @media 820px) sobre el marcado del widget Conqr Menu:
 *   .menu → .cq-menu · .mglow → .cq-mglow · .roll → .cq-roll · .side → .cq-side · .preview → .cq-preview
 *   .cta → .cq-cta · .mfoot → .cq-mfoot · .contact → .cq-contact · #clock → .cq-clock · .social → .cq-social
 * El widget vive en la plantilla Header dentro de un contenedor .cq-menu-host (sin caja propia).
 * Lo marcado "neutraliza" no está en site.css: anula reset.css de Hello y los estilos de Elementor.
 */

/* Fuera del editor el contenedor y el widget no ocupan caja: el menú es fixed y la página no se mueve. */
.e-con.cq-menu-host:not(.elementor-element-edit-mode),
.elementor-widget-conqr-menu:not(.elementor-element-edit-mode) {
	display: contents;
}

.cq-menu {
	position: fixed;
	inset: 0;
	z-index: 55;
	background: #000;
	overflow: hidden;
	visibility: hidden;
	clip-path: circle(0% at calc(100% - var(--cq-m) - 14px) 46px);
	transition: clip-path 1.1s var(--cq-ease), visibility 0s 1.1s;
	display: grid;
	grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
	grid-template-rows: 1fr auto;
	column-gap: clamp(24px, 4vw, 64px);
	padding: calc(env(safe-area-inset-top, 0px) + 110px) var(--cq-m) calc(env(safe-area-inset-bottom, 0px) + 30px);
	line-height: normal;
}

.menu-open .cq-menu {
	visibility: visible;
	clip-path: circle(150% at calc(100% - var(--cq-m) - 14px) 46px);
	transition: clip-path 1.1s var(--cq-ease);
}

.cq-mglow {
	position: absolute;
	width: 70vmax;
	height: 70vmax;
	margin: -35vmax 0 0 -35vmax;
	left: 70%;
	top: 30%;
	border-radius: 50%;
	background: radial-gradient(closest-side, #1E4BFF 0%, rgba(10, 26, 112, .5) 45%, rgba(0, 0, 0, 0) 100%);
	filter: blur(60px);
	opacity: .8;
	pointer-events: none;
}

.cq-menu > *:not(.cq-mglow) {
	position: relative;
}

.cq-menu nav {
	align-self: center;
}

.cq-menu nav a {
	display: flex;
	align-items: baseline;
	gap: 18px;
	text-decoration: none;
	width: max-content;
	max-width: 100%;
	opacity: 0;
	transform: translateY(40px);
	transition: opacity .6s, transform .8s var(--cq-ease);
}

.menu-open .cq-menu nav a {
	opacity: 1;
	transform: none;
	transition-delay: calc(.35s + var(--i) * .06s);
}

.cq-menu nav a.cur .cq-roll span:first-child {
	color: var(--cq-sky);
}

.cq-menu nav a small {
	font-size: 12px;
	color: var(--cq-dim);
	width: 22px;
}

.cq-roll {
	position: relative;
	display: block;
	overflow: hidden;
	height: 1.02em;
	font-size: clamp(34px, 5.2vw, 90px);
	font-weight: 700;
	letter-spacing: -.055em;
	line-height: 1.02;
	text-transform: lowercase;
	transition: opacity .4s;
}

.cq-roll span {
	display: block;
	transition: transform .7s var(--cq-ease);
}

.cq-roll span + span {
	position: absolute;
	left: 0;
	top: 100%;
	color: var(--cq-sky);
}

.cq-menu nav a:hover .cq-roll span,
.cq-menu nav a:focus-visible .cq-roll span {
	transform: translateY(-100%);
}

.cq-menu nav:hover a:not(:hover) .cq-roll {
	opacity: .25;
}

.cq-side {
	align-self: center;
	justify-self: end;
	width: 100%;
	max-width: 440px;
	display: flex;
	flex-direction: column;
	gap: 18px;
	padding-bottom: 40px;
	opacity: 0;
	transform: translateY(24px);
	transition: opacity .8s .55s, transform 1s .5s var(--cq-ease);
}

.menu-open .cq-side {
	opacity: 1;
	transform: none;
}

.cq-preview {
	position: relative;
	width: 100%;
	aspect-ratio: 1;
	margin: 0;
}

.cq-menu .cq-preview > * {             /* .cq-menu: gana a .elementor img{height:auto} de Elementor */
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	max-width: none;                   /* neutraliza: img{max-width:100%} */
	object-fit: contain;
	opacity: 0;
	transform: scale(.88) rotate(-10deg);
	transition: opacity .6s, transform 1.2s var(--cq-ease);
}

/* .preview>.feather */
.cq-menu .cq-preview > .feather {
	object-fit: cover;
	-webkit-mask-image: radial-gradient(closest-side, #000 40%, transparent 100%);
	mask-image: radial-gradient(closest-side, #000 40%, transparent 100%);
}

.cq-menu .cq-preview > .on {
	opacity: 1;
	transform: none;
}

/* La vista 3D reemplaza al <video> y a las gotas c05/c01/c07: sin la máscara del vídeo, que
   recortaría el borde de la figura (la figura ya es redonda y con fondo transparente). */
.cq-preview > .cq-preview__chrome {
	pointer-events: none;
}

.cq-cta {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	align-self: flex-start;
	margin: 8px 0 0;
	padding: 6px 0;
	color: var(--cq-paper);
	text-decoration: none;
	font-size: 14px;
	font-weight: 500;
	border-bottom: 1px solid rgba(255, 255, 255, .3);
	transition: border-color .35s, color .35s;
}

.cq-cta b {
	font-weight: 400;
	transition: transform .5s var(--cq-ease);
}

a.cq-cta:hover {
	color: var(--cq-sky);
	border-color: var(--cq-sky);
}

.cq-cta:hover b {
	transform: translate(3px, -3px);
}

.cq-mfoot {
	grid-column: 1 / -1;
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	gap: 24px;
	padding-top: 22px;
	border-top: 1px solid var(--cq-faint);
	opacity: 0;
	transition: opacity .6s .7s;
}

.menu-open .cq-mfoot {
	opacity: 1;
}

.cq-contact {
	display: flex;
	gap: clamp(20px, 4vw, 56px);
	font-size: 14px;
	line-height: 1.5;
}

.cq-contact h4 {
	margin: 0 0 4px;
	font-size: 12px;
	font-weight: 500;
	color: var(--cq-dim);
	font-family: inherit;              /* neutraliza: h4 de Hello y del kit */
	line-height: inherit;
	letter-spacing: normal;
	text-transform: none;
}

.cq-contact a {
	text-decoration: none;
}

.cq-contact a:hover {
	color: var(--cq-sky);
}

.cq-social {
	display: flex;
	gap: 10px;
}

.cq-social a {
	position: relative;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	display: grid;
	place-items: center;
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .3);
	overflow: hidden;
	transition: box-shadow .4s, color .4s;
}

.cq-social a::before {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: 50%;
	background: var(--cq-paper);
	transform: scale(0);
	transition: transform .5s var(--cq-ease);
}

.cq-social a:hover::before,
.cq-social a:focus-visible::before {
	transform: scale(1);
}

.cq-social a:hover,
.cq-social a:focus-visible {
	color: var(--cq-ink);
}

.cq-social svg {
	position: relative;
	width: 15px;
	height: 15px;
}

/* :focus-visible{outline:2px solid var(--sky); outline-offset:4px} — neutraliza el box-shadow de Hello */
.cq-menu a:focus-visible {
	box-shadow: none;
	outline: 2px solid var(--cq-sky);
	outline-offset: 4px;
}

.cq-social a:focus-visible {
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .3);
}

@media (max-width: 820px) {
	.cq-menu {
		grid-template-columns: minmax(0, 1fr);
	}

	.cq-preview {
		display: none;
	}

	.cq-side {
		justify-self: start;
	}

	.cq-mfoot {
		flex-direction: column;
		align-items: flex-start;
	}

	.cq-contact {
		flex-wrap: wrap;
	}
}

/* Editor de Elementor, editando la plantilla Header: el menú se ve abierto y en su sitio, sin animar. */
.elementor-element-edit-mode .cq-menu {
	position: relative;
	z-index: auto;
	min-height: 100vh;
	visibility: visible;
	clip-path: none;
	transition: none;
}

.elementor-element-edit-mode .cq-menu nav a,
.elementor-element-edit-mode .cq-side,
.elementor-element-edit-mode .cq-mfoot {
	opacity: 1;
	transform: none;
	transition: none;
}

/* ---------- títulos con degradado (behavior cq-tgl: .tgl de site.css) ---------- */
/* tgl.js envuelve el texto del Heading en span.cq-tgl__l: cada línea lleva su propio degradado. */
.cq-tgl .elementor-heading-title {
	color: transparent;
	background-image: none !important;
	-webkit-text-stroke: 0;
}
.cq-tgl__l {
	--tg: linear-gradient(180deg, #F1F3FF 0%, #C9D3FF 24%, #8DA2FF 46%, #4D72FF 64%, #2F5BFF 78%, #2F5BFF 100%);
	background-image: var(--tg);
	background-size: 100% 100%;
	background-repeat: no-repeat;
	-webkit-box-decoration-break: clone;
	box-decoration-break: clone;
	-webkit-background-clip: text;
	background-clip: text;
	color: inherit;
	/* el degradado llega a cada borde de cada glifo */
	padding: .14em .12em .28em;
	margin: 0 -.12em;
	-webkit-text-stroke: 0;
}

/* ---------- cortinilla multipágina (#curtain de site.css; la imprime inc/globals.php) ---------- */
/* z 58: entre el menú (55) y el header (60), como el original. */
.cq-curtain {
	position: fixed;
	inset: 0;
	z-index: 58;
	background: #000;
	transform: translateY(101%);
	display: grid;
	place-items: center;
	pointer-events: none;
}
.cq-curtain span {
	font-size: clamp(40px, 7vw, 110px);
	font-weight: 700;
	letter-spacing: -.06em;
	text-transform: lowercase;
	opacity: .9;
}
/* llegando desde otra página: la cortinilla ya está abajo */
.cq-arriving .cq-curtain {
	transform: none;
}

/* ---------- móvil (revisión 2026-10-26; no está en el original) ---------- */
/* Banner de cookies abierto: el botón de accesibilidad no tapa sus botones (js/overlays.js). */
.cq-cc-open #ea11y-root {
	visibility: hidden;
}
/* EN | ES: zona de toque de 44 px de alto sin cambiar la píldora. */
@media (pointer: coarse) {
	.cq-lang .cpel-switcher__lang a {
		position: relative;
	}
	.cq-lang .cpel-switcher__lang a::after {
		content: "";
		position: absolute;
		inset: -8px -1px;
	}
	/* 2026-10-29: también 44 px de ancho, creciendo hacia afuera (EN a la izquierda, ES a la derecha) */
	.cq-lang .cpel-switcher__lang:first-child a::after {
		left: -8px;
	}
	.cq-lang .cpel-switcher__lang:last-child a::after {
		right: -8px;
	}
	/* revisión móvil (2026-10-29): el menú (solo el ícono, 28 px de ancho) y el enlace de regreso de los heroes
	   («← Expertise», 16 px de alto) también llegan a 44 px sin cambiar cómo se ven */
	.cq-burger {
		position: relative;
	}
	.cq-burger::after {
		content: "";
		position: absolute;
		inset: 0 -8px;
	}
	.elementor-widget.cq-hback:not(.is-big) a::after {
		content: "";
		position: absolute;
		inset: -14px -6px;
	}
	/* logo del header (22 px de alto) y correo / teléfono del footer (18 px): 44 px de alto */
	.e-con.cq-top .elementor-widget-theme-site-logo a,
	.cq-fval a {
		position: relative;
	}
	.e-con.cq-top .elementor-widget-theme-site-logo a::after {
		content: "";
		position: absolute;
		inset: -11px -6px;
	}
	.cq-fval a::after {
		content: "";
		position: absolute;
		inset: -13px -6px;
	}
	/* menú del footer: renglones a 26 px y 26 px entre enlaces; la zona crece hasta tocar a la vecina, sin encimarse */
	.cq-fnav a.elementor-item::after {
		content: "";
		inset: -4px -13px;
		opacity: 1;
		background: none;
	}
	/* pastillas de categoría del Blog (36 px, 8 px entre ellas): toda la pastilla más 4 px por lado */
	.cq-blogcats li {
		position: relative;
	}
	.cq-blogcats li a::after {
		content: "";
		position: absolute;
		inset: -4px;
	}
}
/* Menú abierto en un teléfono en horizontal: a 390 px de alto no cabían «blog.» y «contact.».
   Enlaces un poco más chicos y el panel se puede desplazar. */
@media (orientation: landscape) and (max-height: 500px) {
	.cq-menu {
		grid-template-rows: auto auto;
		row-gap: 28px;
		padding-top: calc(env(safe-area-inset-top, 0px) + 84px);
		overflow-y: auto;
		overscroll-behavior: contain;
		-webkit-overflow-scrolling: touch;
	}
	.cq-roll {
		font-size: min(clamp(34px, 5.2vw, 90px), 9vh);
	}
}

/* WP (2026-10-29): palabra con guion que no se parte («e-commerce.»); la usan los títulos de Web & E-commerce */
.cq-nw {
	white-space: nowrap;
}

/* 2026-10-30 (revisión responsive): zonas táctiles de 44 px sin cambiar cómo se ven (solo en táctil) */
@media (pointer: coarse) {
	.cq-social a {
		width: 44px;
		height: 44px;
	}
	.cq-chero__meta a,
	.cq-tags a {
		position: relative;
	}
	.cq-chero__meta a::after {
		content: "";
		position: absolute;
		inset: -15px -6px;
	}
	.cq-tags a::after {
		content: "";
		position: absolute;
		inset: -14px -4px;
	}
}