/* Pulido de interacción del sitio.
 *
 * Escrito a mano — el pipeline no lo regenera. Aquí vive todo lo que hace el
 * sitio interactivo: acordeones del FAQ, hover de testimonios y
 * microinteracciones generales. Los !important son necesarios donde hay que
 * ganar a los estilos en línea que heredamos del diseño.
 */

:root {
	--accent: #C93E14;
	--accent2: #5B358B;
	--tinta: #0B1118;
}

/* El naranja de marca original funciona como superficie decorativa, pero no
 * alcanza AA con texto blanco. El token interactivo conserva el matiz y sube
 * a 5.02:1; los estilos en línea heredados reciben la misma corrección. */
[style*="background:#E84B1D"],
[style*="background: #E84B1D"],
[style*="background-color:#E84B1D"],
[style*="background-color: #E84B1D"] {
	background-color: #C93E14 !important;
}

/* Texto secundario legible en superficies claras. */
html:not([data-theme="dark"]) [style*="color:#7A8595"],
html:not([data-theme="dark"]) [style*="color: #7A8595"],
html:not([data-theme="dark"]) [style*="color:#8893A0"],
html:not([data-theme="dark"]) [style*="color: #8893A0"],
html:not([data-theme="dark"]) [style*="color:#9AA4B0"],
html:not([data-theme="dark"]) [style*="color: #9AA4B0"] {
	color: #667382 !important;
}

/* El pie siempre usa una superficie oscura, incluso en el tema claro. */
html:not([data-theme="dark"]) footer [style*="color:#7A8595"],
html:not([data-theme="dark"]) footer [style*="color: #7A8595"] {
	color: #7A8595 !important;
}

html:not([data-theme="dark"]) footer [style*="color:#9AA4B0"],
html:not([data-theme="dark"]) footer [style*="color: #9AA4B0"] {
	color: #9AA4B0 !important;
}

html {
	scroll-behavior: smooth;
}

::selection {
	background: #FDEDE7;
	color: #C13E16;
}

:focus-visible {
	outline: 2px solid var(--accent);
	outline-offset: 3px;
	border-radius: 4px;
}

/* ===== Cabecera: sombra sutil al hacer scroll ===== */

header {
	transition: box-shadow 0.3s ease;
}

header.is-scrolled {
	box-shadow: 0 12px 32px -20px rgba(11, 17, 24, 0.25);
}

/* ===== Marca oficial ===== */

.seomos-brand {
	display: inline-flex;
	align-items: center;
	flex: 0 0 auto;
	line-height: 0;
}

.seomos-brand-logo {
	display: block;
	width: 164px;
	height: auto;
}

.seomos-brand-logo--oscuro {
	display: none;
}

.seomos-brand--sobre-oscuro {
	margin-bottom: 18px;
}

.seomos-brand--sobre-oscuro .seomos-brand-logo--oscuro,
html[data-theme="dark"] .seomos-brand--adaptive .seomos-brand-logo--oscuro {
	display: block;
}

html[data-theme="dark"] .seomos-brand--adaptive .seomos-brand-logo--principal {
	display: none;
}

/* ===== Navegación: subrayado animado (no aplica al CTA con fondo) ===== */

.main-nav > a:not([style*="background"]),
.main-nav .nav-dd > a {
	position: relative;
}

.main-nav > a:not([style*="background"])::after,
.main-nav .nav-dd > a::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: -6px;
	height: 2px;
	border-radius: 2px;
	background: var(--accent);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 0.25s ease;
}

.main-nav > a:not([style*="background"]):hover::after,
.main-nav .nav-dd > a:hover::after {
	transform: scaleX(1);
}

/* ===== Botones con fondo de acento: elevación al pasar ===== */

a[style*="background:var(--accent"],
button[style*="background:var(--accent"],
label[for="cta-modal-toggle"] {
	transition: transform 0.18s ease, filter 0.18s ease;
}

a[style*="background:var(--accent"]:hover,
button[style*="background:var(--accent"]:hover,
label[for="cta-modal-toggle"]:hover {
	transform: translateY(-2px);
	filter: brightness(1.06);
}

a[style*="background:var(--accent"]:active,
button[style*="background:var(--accent"]:active {
	transform: translateY(0);
	filter: brightness(0.97);
}

/* ===== FAQ: acordeones ===== */

details.seomos-faq {
	overflow: hidden;
	background: #fff;
	transition: border-color 0.25s ease, box-shadow 0.25s ease;
}

details.seomos-faq:hover {
	border-color: #E0E5EC !important;
	box-shadow: 0 18px 42px -30px rgba(11, 17, 24, 0.25);
}

details.seomos-faq[open] {
	border-color: #F3C9BC !important;
}

.seomos-faq-q {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	cursor: pointer;
	list-style: none;
	user-select: none;
}

.seomos-faq-q::-webkit-details-marker,
.seomos-faq-q::marker {
	display: none;
	content: "";
}

.seomos-faq-chev {
	flex-shrink: 0;
	color: #667382;
	transition: transform 0.3s ease, color 0.3s ease;
}

details.seomos-faq[open] .seomos-faq-chev {
	transform: rotate(180deg);
	color: var(--accent);
}

details.seomos-faq[open] .seomos-faq-q {
	color: var(--accent) !important;
}

/* ===== Testimonios: la tarjeta oscura es el estado hover ===== */

.seomos-testimonio {
	transition: background 0.35s ease, border-color 0.35s ease,
		transform 0.3s ease, box-shadow 0.35s ease;
}

.seomos-testimonio .seomos-testimonio-q,
.seomos-testimonio .seomos-testimonio-n,
.seomos-testimonio .seomos-testimonio-r,
.seomos-testimonio .seomos-testimonio-av {
	transition: color 0.35s ease, background 0.35s ease;
}

@media (hover: hover) {
	.seomos-testimonio:hover {
		background: var(--tinta) !important;
		border-color: var(--tinta) !important;
		transform: translateY(-6px);
		box-shadow: 0 34px 60px -28px rgba(11, 17, 24, 0.5);
	}

	.seomos-testimonio:hover .seomos-testimonio-q {
		color: #E4E8ED !important;
	}

	.seomos-testimonio:hover .seomos-testimonio-n {
		color: #fff !important;
	}

	.seomos-testimonio:hover .seomos-testimonio-r {
		color: #A9B2BD !important;
	}

	.seomos-testimonio:hover .seomos-testimonio-av {
		background: #2A323B !important;
	}
}

/* ===== Sin scroll horizontal =====
 *
 * El diseño coloca círculos de gradiente fuera del borde de sus secciones
 * (top:-120px; right:-80px) como decoración. En el preview de Claude Design el
 * lienzo los recortaba; aquí generaban una barra de scroll horizontal.
 *
 * Se recortan en la sección que los contiene, no en el body: así el resto de la
 * página conserva su comportamiento (el header sticky sigue funcionando) y los
 * badges que sobresalen de las tarjetas no se ven afectados, porque cuelgan más
 * abajo en el árbol y no del contenedor recortado.
 *
 * `clip` en vez de `hidden` para no crear un contexto de desplazamiento.
 *
 * Se busca por `radial-gradient` y no por `position:absolute`: el JS de las
 * animaciones reescribe el atributo style y el navegador lo normaliza con
 * espacios, así que un selector sobre esa declaración dejaría de coincidir. De
 * paso, el gradiente distingue justo a los círculos difuminados de los badges
 * blancos que también van en posición absoluta y sí deben sobresalir.
 */
section:has(> div[style*="radial-gradient"]),
div[style*="position:relative"]:has(> div[style*="radial-gradient"]) {
	overflow-x: clip;
}

/* En móvil, el diseño colapsa sus grids a una columna, pero los items nacen
 * con min-width:auto y no pueden encoger por debajo de su contenido, así que
 * seguían empujando la página. Ídem los bloques con padding lateral pensado
 * para escritorio. */
@media (max-width: 768px) {
	[style*="grid-template-columns"] > *,
	[style*="display:flex"] > *,
	[style*="display: flex"] > * {
		min-width: 0;
	}

	section :where(div, label, form, img, h1, h2, h3, p, table) {
		max-width: 100%;
	}

	/* El carrusel de logos es la excepción: su pista debe ser MÁS ancha que la
	   pantalla para poder desplazarse, y ya está contenida por su overflow.
	   El max-width:100% de arriba la aplastaba y las imágenes colapsaban a 0. */
	.seomos-logos-track,
	.seomos-logos-grupo,
	.seomos-logos-grupo img {
		max-width: none;
	}

	/* El valor se busca sin la propiedad porque el JS de animaciones normaliza
	   el atributo style y `padding:38px` dejaría de coincidir con `padding: 38px`. */
	[style*="38px 56px"] {
		padding-left: 22px !important;
		padding-right: 22px !important;
	}

	/* Cifras con su unidad al lado (precios): a 375px la unidad no cabe en la
	   misma línea y se partía encima del número. Se permite que baje entera. */
	[style*="align-items:baseline"] {
		flex-wrap: wrap;
		justify-content: center;
	}
}

/* ===== Logos de clientes: carrusel continuo ===== */

.seomos-logos {
	flex: 1 1 380px;
	min-width: 240px;
	overflow: hidden;
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent);
	mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent);
}

.seomos-logos-track {
	display: flex;
	width: max-content;
	animation: seomos-logos-scroll 36s linear infinite;
}

.seomos-logos:hover .seomos-logos-track {
	animation-play-state: paused;
}

.seomos-logos-grupo {
	display: flex;
	align-items: center;
	gap: 56px;
	padding-right: 56px;
}

.seomos-logos-grupo img {
	height: 34px;
	width: auto;
	max-width: 150px;
	object-fit: contain;
	/* En reposo, silueta de tinta uniforme: con grayscale los logos claros
	   (amarillos, naranjas) quedaban casi invisibles y parecían huecos.
	   A color al pasar el cursor. */
	filter: brightness(0) opacity(0.45);
	transition: filter 0.3s ease, transform 0.3s ease;
}

/* Logos cuadrados o verticales: a la altura base quedan diminutos. */
.seomos-logos-grupo img.es-alto {
	height: 52px;
	max-width: 90px;
}

/* Logos destacados: mayor presencia que el resto. */
.seomos-logos-grupo img.es-destacado {
	height: 44px;
	max-width: 210px;
}

/* Logos con texto en negativo o rellenos: la silueta de tinta los volvería
   una mancha. Conservan sus formas, atenuados en reposo. */
.seomos-logos-grupo img.es-figurativo {
	filter: grayscale(1) opacity(0.6);
}

.seomos-logos-grupo img.es-figurativo:hover {
	filter: none;
}

.seomos-logos-grupo img:hover {
	filter: none;
	transform: scale(1.06);
}

@keyframes seomos-logos-scroll {
	to {
		transform: translateX(-50%);
	}
}

/* ===== Blog: chips de filtro por categoría ===== */

.seomos-chip {
	background: #fff;
	color: #41505F;
	border: 1px solid #DDE3EA;
	font-family: 'Poppins', sans-serif;
	font-weight: 600;
	font-size: 14px;
	padding: 10px 18px;
	border-radius: 999px;
	cursor: pointer;
	transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.15s ease;
}

.seomos-chip:hover {
	border-color: var(--accent);
	color: var(--accent);
	transform: translateY(-1px);
}

.seomos-chip.is-active {
	background: var(--accent);
	color: #fff;
	border-color: var(--accent);
}

.seomos-filtro-vacio {
	display: none;
	text-align: center;
	padding: 50px 20px;
	font-family: 'Poppins', sans-serif;
	font-weight: 700;
	font-size: 18px;
	color: #41505F;
}

.seomos-filtro-vacio.is-visible {
	display: block;
}

/* ===== Paginación del blog (píldoras del diseño) ===== */

.seomos-paginacion {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	margin-top: 54px;
	flex-wrap: wrap;
}

.seomos-paginacion .page-numbers {
	min-width: 42px;
	height: 42px;
	padding: 0 12px;
	border-radius: 11px;
	border: 1px solid #DDE3EA;
	background: #fff;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: #41505F;
	font-family: 'Poppins', sans-serif;
	font-weight: 700;
	font-size: 15px;
	transition: border-color 0.2s ease, color 0.2s ease, transform 0.15s ease;
}

.seomos-paginacion a.page-numbers:hover {
	border-color: var(--accent);
	color: var(--accent);
	transform: translateY(-1px);
}

.seomos-paginacion .page-numbers.current {
	background: var(--accent);
	border-color: var(--accent);
	color: #fff;
}

.seomos-paginacion .page-numbers.dots {
	border: none;
	background: none;
}

/* ===== Selector de idioma (TranslatePress): a la izquierda =====
 *
 * TranslatePress 3.3 usa .trp-floating-switcher; #trp-floater-ls mantiene
 * compatibilidad con el flotador de versiones anteriores. Ambos se separan
 * del CTA inferior. La misma altura se aplica a WhatsApp en toda la web.
 */
:root {
	--seomos-floating-bottom: 32px;
	--seomos-floating-gutter: 20px;
}
@media (max-width: 768px) {
	:root { --seomos-floating-bottom: 96px; }
}
#trp-floater-ls,
.trp-floating-switcher.trp-switcher-position-bottom {
	right: auto !important;
	left: max(var(--seomos-floating-gutter), env(safe-area-inset-left, 0px)) !important;
	bottom: calc(var(--seomos-floating-bottom) + env(safe-area-inset-bottom, 0px)) !important;
}

/* ===== Selector y modo oscuro ===== */

.sh-theme-toggle {
	width: 42px;
	height: 42px;
	padding: 0;
	border: 1px solid #DDE3EA;
	border-radius: 10px;
	background: #fff;
	color: #41505F;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	box-shadow: 0 8px 22px -18px rgba(11, 17, 24, 0.55);
	transition: color 0.2s ease, background 0.2s ease,
		border-color 0.2s ease, transform 0.16s ease;
}

.sh-theme-toggle:hover {
	color: var(--accent);
	border-color: #F3C9BC;
	transform: translateY(-1px);
}

.sh-theme-icon--sun {
	display: none;
}

.cta-fab--whatsapp {
	right: max(var(--seomos-floating-gutter), env(safe-area-inset-right, 0px)) !important;
	bottom: calc(var(--seomos-floating-bottom) + env(safe-area-inset-bottom, 0px)) !important;
	background: linear-gradient(135deg, #0F7B42 0%, #0A6F3A 52%, #075F31 100%);
	color: #fff;
	border: 1px solid rgba(255, 255, 255, 0.28);
	box-shadow: 0 15px 34px -9px rgba(10, 111, 58, 0.78),
		0 7px 18px -12px rgba(13, 108, 49, 0.9);
}

.cta-fab--whatsapp:hover {
	background: linear-gradient(135deg, #14884A 0%, #117B43 52%, #0B6937 100%);
	box-shadow: 0 19px 42px -8px rgba(17, 123, 67, 0.9),
		0 8px 20px -12px rgba(13, 108, 49, 0.95);
}

.cta-fab--whatsapp:focus-visible {
	outline-color: #25D366;
}

.cta-fab__whatsapp-icon {
	filter: drop-shadow(0 1px 1px rgba(0, 77, 29, 0.22));
}

.seomos-whatsapp-icon {
	width: 46px;
	height: 46px;
	border-radius: 12px;
	background: linear-gradient(135deg, #0F7B42, #0A6F3A 55%, #075F31);
	box-shadow: 0 9px 22px -12px rgba(10, 111, 58, 0.9);
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

html[data-theme="dark"] {
	--tinta: #F4F7FA;
	background: #0D1117;
	color-scheme: dark;
}

html[data-theme="dark"] body {
	background: #0D1117;
	color: #E7ECF2;
}

html[data-theme="dark"] body,
html[data-theme="dark"] header,
html[data-theme="dark"] section,
html[data-theme="dark"] footer,
html[data-theme="dark"] div,
html[data-theme="dark"] article,
html[data-theme="dark"] details,
html[data-theme="dark"] input,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea,
html[data-theme="dark"] button {
	transition-property: background-color, border-color, color, box-shadow;
	transition-duration: 0.22s;
	transition-timing-function: ease;
}

html[data-theme="dark"] h1,
html[data-theme="dark"] h2,
html[data-theme="dark"] h3,
html[data-theme="dark"] h4,
html[data-theme="dark"] h5 {
	color: #F5F7FA !important;
}

html[data-theme="dark"] [style*="color:#0B1118"],
html[data-theme="dark"] [style*="color: #0B1118"],
html[data-theme="dark"] [style*="color: rgb(11, 17, 24)"] {
	color: #F5F7FA !important;
}

html[data-theme="dark"] [style*="color:#33414F"],
html[data-theme="dark"] [style*="color:#3C4B5A"],
html[data-theme="dark"] [style*="color:#41505F"],
html[data-theme="dark"] [style*="color: #33414F"],
html[data-theme="dark"] [style*="color: #3C4B5A"],
html[data-theme="dark"] [style*="color: #41505F"],
html[data-theme="dark"] [style*="color: rgb(51, 65, 79)"],
html[data-theme="dark"] [style*="color: rgb(60, 75, 90)"],
html[data-theme="dark"] [style*="color: rgb(65, 80, 95)"] {
	color: #D6DDE6 !important;
}

html[data-theme="dark"] [style*="color:#51606F"],
html[data-theme="dark"] [style*="color:#566270"],
html[data-theme="dark"] [style*="color:#5A6775"],
html[data-theme="dark"] [style*="color:#6A7686"],
html[data-theme="dark"] [style*="color: #51606F"],
html[data-theme="dark"] [style*="color: #5A6775"],
html[data-theme="dark"] [style*="color: rgb(81, 96, 111)"],
html[data-theme="dark"] [style*="color: rgb(86, 98, 112)"],
html[data-theme="dark"] [style*="color: rgb(90, 103, 117)"],
html[data-theme="dark"] [style*="color: rgb(106, 118, 134)"] {
	color: #B5BFCA !important;
}

html[data-theme="dark"] [style*="color:#7A8595"],
html[data-theme="dark"] [style*="color:#8893A0"],
html[data-theme="dark"] [style*="color:#9AA4B0"],
html[data-theme="dark"] [style*="color: #7A8595"],
html[data-theme="dark"] [style*="color: #8893A0"],
html[data-theme="dark"] [style*="color: #9AA4B0"],
html[data-theme="dark"] [style*="color: rgb(122, 133, 149)"],
html[data-theme="dark"] [style*="color: rgb(136, 147, 160)"],
html[data-theme="dark"] [style*="color: rgb(154, 164, 176)"] {
	color: #929EAC !important;
}

html[data-theme="dark"] [style*="color:#C13E16"],
html[data-theme="dark"] [style*="color: rgb(193, 62, 22)"],
html[data-theme="dark"] [style*="color:#E84B1D"],
html[data-theme="dark"] [style*="color: #E84B1D"],
html[data-theme="dark"] [style*="color: rgb(232, 75, 29)"],
html[data-theme="dark"] [style*="color:var(--accent,#E84B1D)"],
html[data-theme="dark"] [style*="color: var(--accent, #E84B1D)"] {
	color: #FF8A61 !important;
}

html[data-theme="dark"] [style*="color:var(--accent2"],
html[data-theme="dark"] [style*="color: var(--accent2"],
html[data-theme="dark"] [style*="color: rgb(91, 53, 139)"] {
	color: #B995DD !important;
}

html[data-theme="dark"] [style*="color:#C9302C"],
html[data-theme="dark"] [style*="color: rgb(201, 48, 44)"] {
	color: #FF7771 !important;
}

html[data-theme="dark"] [style*="background:#fff"],
html[data-theme="dark"] [style*="background: #fff"],
html[data-theme="dark"] [style*="background:#FFFFFF"],
html[data-theme="dark"] [style*="background: #FFFFFF"],
html[data-theme="dark"] [style*="background: rgb(255, 255, 255)"] {
	background: #151B23 !important;
}

html[data-theme="dark"] [style*="background:#FBFCFD"],
html[data-theme="dark"] [style*="background:#F8FAFB"],
html[data-theme="dark"] [style*="background:#F5F7F9"],
html[data-theme="dark"] [style*="background:#F0F2F5"],
html[data-theme="dark"] [style*="background:#EEF1F5"],
html[data-theme="dark"] [style*="background:#EDEFF3"],
html[data-theme="dark"] [style*="background:#E2E6EC"],
html[data-theme="dark"] [style*="background:#DDE2E8"],
html[data-theme="dark"] [style*="background:#D7DCE3"],
html[data-theme="dark"] [style*="background: rgb(251, 252, 253)"],
html[data-theme="dark"] [style*="background: rgb(248, 250, 251)"],
html[data-theme="dark"] [style*="background: rgb(245, 247, 249)"],
html[data-theme="dark"] [style*="background: rgb(240, 242, 245)"],
html[data-theme="dark"] [style*="background: rgb(238, 241, 245)"],
html[data-theme="dark"] [style*="background: rgb(237, 239, 243)"],
html[data-theme="dark"] [style*="background: rgb(226, 230, 236)"],
html[data-theme="dark"] [style*="background: rgb(221, 226, 232)"],
html[data-theme="dark"] [style*="background: rgb(215, 220, 227)"] {
	background: #202934 !important;
}

html[data-theme="dark"] [style*="background:#FDEDE7"],
html[data-theme="dark"] [style*="background:#FFF6F2"],
html[data-theme="dark"] [style*="background:#FCF7F4"],
html[data-theme="dark"] [style*="background:#F8F2EE"],
html[data-theme="dark"] [style*="background: rgb(253, 237, 231)"],
html[data-theme="dark"] [style*="background: rgb(255, 246, 242)"],
html[data-theme="dark"] [style*="background: rgb(252, 247, 244)"],
html[data-theme="dark"] [style*="background: rgb(248, 242, 238)"] {
	background: #2B1B17 !important;
}

html[data-theme="dark"] [style*="background:#EFEAF5"],
html[data-theme="dark"] [style*="background:#F4F0F8"],
html[data-theme="dark"] [style*="background: rgb(239, 234, 245)"],
html[data-theme="dark"] [style*="background: rgb(244, 240, 248)"] {
	background: #211B2B !important;
}

html[data-theme="dark"] [style*="background:#E7F6EE"],
html[data-theme="dark"] [style*="background:#EAF7EF"] {
	background: #15261D !important;
}

html[data-theme="dark"] [style*="linear-gradient(180deg,#FCF7F4"],
html[data-theme="dark"] [style*="linear-gradient(180deg,#FFF6F2"],
html[data-theme="dark"] [style*="linear-gradient(180deg,#FFFFFF"],
html[data-theme="dark"] [style*="linear-gradient(180deg,#FCF9F7"] {
	background: linear-gradient(180deg, #211713 0%, #0D1117 76%) !important;
}

html[data-theme="dark"] [style*="linear-gradient(180deg,#F4F0F8"] {
	background: linear-gradient(180deg, #1D1726 0%, #0D1117 76%) !important;
}

html[data-theme="dark"] [style*="linear-gradient(120deg,#EFEAF5"] {
	background: linear-gradient(120deg, #211B2B, #2B1B17) !important;
}

html[data-theme="dark"] [style*="border:1px solid #ECEFF3"],
html[data-theme="dark"] [style*="border:1px solid #E7EBF0"],
html[data-theme="dark"] [style*="border:1px solid #DDE3EA"],
html[data-theme="dark"] [style*="border:1px solid #DDE2E8"],
html[data-theme="dark"] [style*="border:1px solid #E2E6EC"],
html[data-theme="dark"] [style*="border-bottom:1px solid #ECEFF3"],
html[data-theme="dark"] [style*="border-bottom:1px solid #EEF1F5"],
html[data-theme="dark"] [style*="border-bottom:1px solid #F2F4F7"],
html[data-theme="dark"] [style*="border-top:1px solid #ECEFF3"],
html[data-theme="dark"] [style*="border-top:1px solid #F0F2F5"],
html[data-theme="dark"] [style*="border-top:1px solid #F2F4F7"],
html[data-theme="dark"] [style*="border: 1px solid rgb(236, 239, 243)"],
html[data-theme="dark"] [style*="border: 1px solid rgb(231, 235, 240)"],
html[data-theme="dark"] [style*="border: 1px solid rgb(221, 227, 234)"],
html[data-theme="dark"] [style*="border: 1px solid rgb(221, 226, 232)"],
html[data-theme="dark"] [style*="border: 1px solid rgb(226, 230, 236)"],
html[data-theme="dark"] [style*="border-bottom: 1px solid rgb(236, 239, 243)"],
html[data-theme="dark"] [style*="border-bottom: 1px solid rgb(238, 241, 245)"],
html[data-theme="dark"] [style*="border-bottom: 1px solid rgb(242, 244, 247)"],
html[data-theme="dark"] [style*="border-top: 1px solid rgb(236, 239, 243)"],
html[data-theme="dark"] [style*="border-top: 1px solid rgb(240, 242, 245)"],
html[data-theme="dark"] [style*="border-top: 1px solid rgb(242, 244, 247)"] {
	border-color: #2B3542 !important;
}

html[data-theme="dark"] header {
	background: rgba(13, 17, 23, 0.9) !important;
	border-bottom-color: #28323E !important;
}

html[data-theme="dark"] .main-nav .nav-dd-menu > div,
html[data-theme="dark"] .sh-mpanel {
	background: #151B23 !important;
	border-color: #2B3542 !important;
}

html[data-theme="dark"] .main-nav .nav-dd-menu a:hover {
	background: #222C37 !important;
	color: #fff !important;
}

html[data-theme="dark"] .main-nav > a:hover,
html[data-theme="dark"] .nav-dd > a:hover,
html[data-theme="dark"] .sh-mpanel a:hover {
	color: #fff !important;
}

html[data-theme="dark"] .sh-burger {
	border-color: #34404E !important;
}

html[data-theme="dark"] .sh-burger span {
	background: #E7ECF2 !important;
}

html[data-theme="dark"] .sh-theme-toggle {
	background: #1A222C;
	border-color: #34404E;
	color: #FFD166;
}

html[data-theme="dark"] .sh-theme-icon--moon {
	display: none;
}

html[data-theme="dark"] .sh-theme-icon--sun {
	display: block;
}

html[data-theme="dark"] input,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea {
	background: #10161E !important;
	border-color: #34404E !important;
	color: #E7ECF2 !important;
	caret-color: var(--accent);
}

html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder {
	color: #7F8B99;
	opacity: 1;
}

html[data-theme="dark"] option {
	background: #10161E;
	color: #E7ECF2;
}

html[data-theme="dark"] details.seomos-faq,
html[data-theme="dark"] .seomos-chip,
html[data-theme="dark"] .seomos-paginacion .page-numbers,
html[data-theme="dark"] .cta-modal-card {
	background: #151B23 !important;
	border-color: #2B3542 !important;
	color: #D6DDE6;
}

html[data-theme="dark"] details.seomos-faq:hover {
	border-color: #465363 !important;
	box-shadow: 0 18px 42px -30px rgba(0, 0, 0, 0.75);
}

@media (hover: hover) {
	html[data-theme="dark"] .seomos-testimonio:hover {
		background: #1C2530 !important;
		border-color: #465363 !important;
	}
}

html[data-theme="dark"] .seomos-service-visual,
html[data-theme="dark"] .seomos-report-visual {
	background: linear-gradient(145deg, #171E27 0%, #211713 100%);
	border-color: #2B3542;
}

html[data-theme="dark"] .seomos-service-visual__tag {
	background: #202832;
	border-color: #34404E;
	color: #D6DDE6;
}

html[data-theme="dark"] .seomos-report-keyword {
	background: rgba(28, 37, 48, 0.92);
}

html[data-theme="dark"] .seomos-report-keyword i,
html[data-theme="dark"] .seomos-report-columns i,
html[data-theme="dark"] .seomos-report-footer span {
	background-color: #34404E;
}

html[data-theme="dark"] .seomos-project-logo {
	height: 62px;
	padding: 8px 10px;
	border-radius: 11px;
	background: rgba(255, 255, 255, 0.94);
}

html[data-theme="dark"] .seomos-logos-grupo img {
	filter: brightness(0) invert(1) opacity(0.7);
}

html[data-theme="dark"] .seomos-logos-grupo img.es-figurativo {
	filter: grayscale(1) brightness(1.7) opacity(0.7);
}

html[data-theme="dark"] .seomos-logos-grupo img:hover,
html[data-theme="dark"] .seomos-logos-grupo img.es-figurativo:hover {
	filter: none;
}

html[data-theme="dark"] .seomos-contenido {
	color: #C3CBD5;
}

html[data-theme="dark"] .seomos-contenido h2,
html[data-theme="dark"] .seomos-contenido h3 {
	color: #F5F7FA;
}

html[data-theme="dark"] .seomos-contenido blockquote {
	color: #B5BFCA;
}

html[data-theme="dark"] .seomos-contenido th,
html[data-theme="dark"] .seomos-contenido td,
html[data-theme="dark"] .seomos-toc nav a {
	border-color: #2B3542;
}

html[data-theme="dark"] .seomos-contenido th {
	background: #1B232D;
}

html[data-theme="dark"] .seomos-toc nav a,
html[data-theme="dark"] .seomos-filtro-vacio {
	color: #929EAC;
}

html[data-theme="dark"] .seomos-toc__title {
	color: #AAB5C2;
}

@media (max-width: 980px) {
	html[data-theme="dark"] .seomos-toc__panel,
	html[data-theme="dark"] .seomos-toc__mobile-head {
		background: #151B23;
	}

	html[data-theme="dark"] .seomos-toc__mobile-head {
		border-bottom-color: #34404E;
	}

	html[data-theme="dark"] .seomos-toc__mobile-head strong,
	html[data-theme="dark"] .seomos-toc__mobile-head button {
		color: #F5F7FA;
	}

	html[data-theme="dark"] .seomos-toc__mobile-head button {
		border-color: #465363;
		background: #222B36;
	}

	html[data-theme="dark"] .seomos-toc-mobile-toggle {
		border-color: rgba(255, 255, 255, .25);
		background: #FF7A4A;
		box-shadow: 0 14px 36px rgba(0, 0, 0, .48);
		color: #111820;
	}
}

html[data-theme="dark"] .seomos-form-error {
	background: #2B1B17;
	color: #FF9A78;
}

html[data-theme="dark"] .seomos-form-hecho {
	background: #15261D;
	color: #82DCA7;
}

html[data-theme="dark"] .trp-floating-switcher {
	--bg: rgba(21, 27, 35, 0.94) !important;
	--bg-hover: #222C37 !important;
	--text: #E7ECF2 !important;
	--text-hover: #fff !important;
	border-color: #34404E !important;
}

html[data-theme="dark"] svg[stroke="#0B1118"],
html[data-theme="dark"] svg [stroke="#0B1118"] {
	stroke: #E7ECF2;
}

html[data-theme="dark"] svg[fill="#0B1118"],
html[data-theme="dark"] svg [fill="#0B1118"] {
	fill: #E7ECF2;
}

html[data-theme="dark"] svg[stroke*="var(--accent2"] {
	stroke: #B995DD;
}

/* ===== Movimiento reducido: sin transformaciones ===== */

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

	.seomos-testimonio,
	details.seomos-faq,
	.seomos-faq-chev,
	a[style*="background:var(--accent"],
	button[style*="background:var(--accent"],
	label[for="cta-modal-toggle"],
	.main-nav > a::after {
		transition: none !important;
	}

	.seomos-testimonio:hover,
	a[style*="background:var(--accent"]:hover {
		transform: none;
	}

	/* El carrusel de logos se vuelve una fila estática que envuelve. */
	.seomos-logos-track {
		animation: none;
		width: auto;
		flex-wrap: wrap;
	}

	.seomos-logos-grupo[aria-hidden] {
		display: none;
	}

	.seomos-logos-grupo {
		flex-wrap: wrap;
	}
}

/* ===== SEOMOS AI CRM: entrada en servicios y landing ===== */

.crm-nav-badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 3px 7px;
	border-radius: 999px;
	background: #FDEDE7;
	color: #C43F17;
	font-size: 9px;
	font-weight: 800;
	line-height: 1;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.seomos-crm-service-card {
	display: grid;
	grid-template-columns: 1.05fr 0.95fr;
	gap: 48px;
	align-items: center;
	margin-top: 22px;
	padding: 48px;
	border: 1px solid #222B36;
	border-radius: 22px;
	background:
		radial-gradient(circle at 93% 8%, rgba(232, 75, 29, 0.2), transparent 34%),
		radial-gradient(circle at 72% 100%, rgba(91, 53, 139, 0.22), transparent 42%),
		#0B1118;
	color: #fff;
	overflow: hidden;
}

.seomos-crm-service-card__eyebrow {
	display: flex;
	align-items: center;
	gap: 9px;
	margin-bottom: 15px;
	color: #FF8B67;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.12em;
}

.seomos-crm-service-card__eyebrow span {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--accent);
	box-shadow: 0 0 0 5px rgba(232, 75, 29, 0.16);
}

.seomos-crm-service-card h3 {
	max-width: 610px;
	color: #fff;
	font-size: clamp(28px, 3vw, 39px);
	line-height: 1.12;
	letter-spacing: -0.035em;
}

.seomos-crm-service-card__copy > p {
	max-width: 620px;
	margin-top: 16px;
	color: #B6C0CB;
	font-size: 16px;
	line-height: 1.7;
}

.seomos-crm-service-card__benefits {
	display: flex;
	flex-wrap: wrap;
	gap: 10px 18px;
	margin-top: 22px;
	color: #D9DFE6;
	font-size: 13.5px;
	font-weight: 700;
}

.seomos-crm-service-card__benefits span::first-letter {
	color: var(--accent);
}

.seomos-crm-service-card__actions {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: 28px;
}

.seomos-crm-service-card__actions a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 13px 18px;
	border: 1px solid rgba(255, 255, 255, 0.14);
	border-radius: 11px;
	color: #fff;
	font-family: "Poppins", sans-serif;
	font-size: 14px;
	font-weight: 700;
	transition: transform 0.2s ease, border-color 0.2s ease, background 0.2s ease;
}

.seomos-crm-service-card__actions a:first-child {
	border-color: var(--accent);
	background: var(--accent);
}

.seomos-crm-service-card__actions a:hover {
	transform: translateY(-2px);
	border-color: rgba(255, 255, 255, 0.35);
	background: rgba(255, 255, 255, 0.08);
}

.seomos-crm-service-card__actions a:first-child:hover {
	border-color: #F55B2C;
	background: #F55B2C;
}

.seomos-crm-service-card__visual {
	border: 1px solid rgba(255, 255, 255, 0.12);
	border-radius: 17px;
	background: #F8F9FB;
	box-shadow: 0 28px 55px -24px rgba(0, 0, 0, 0.58);
	color: #0B1118;
	overflow: hidden;
	transform: rotate(1.2deg);
}

.seomos-crm-mini__top {
	display: flex;
	align-items: center;
	gap: 5px;
	height: 36px;
	padding: 0 12px;
	border-bottom: 1px solid #E7EBF0;
	background: #fff;
}

.seomos-crm-mini__top > span {
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: #D8DDE4;
}

.seomos-crm-mini__top > span:first-child {
	background: var(--accent);
}

.seomos-crm-mini__top b {
	margin-left: auto;
	font-size: 8.5px;
	letter-spacing: 0.08em;
}

.seomos-crm-mini__body {
	display: grid;
	grid-template-columns: 1.1fr 0.9fr;
	min-height: 250px;
}

.seomos-crm-mini__inbox {
	padding: 15px;
	border-right: 1px solid #E7EBF0;
	background: #fff;
}

.seomos-crm-mini__title {
	margin-bottom: 12px;
	font-size: 11px;
	font-weight: 800;
}

.seomos-crm-mini__title em {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 16px;
	height: 16px;
	margin-left: 4px;
	border-radius: 50%;
	background: #FDEDE7;
	color: var(--accent);
	font-size: 8px;
	font-style: normal;
}

.seomos-crm-mini__lead {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 7px;
	padding: 10px 9px;
	border: 1px solid transparent;
	border-radius: 10px;
}

.seomos-crm-mini__lead.is-active {
	border-color: #E2E7ED;
	background: #F5F7FA;
}

.seomos-crm-mini__lead i {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 29px;
	height: 29px;
	border-radius: 50%;
	background: #5B358B;
	color: #fff;
	font-size: 8px;
	font-style: normal;
	font-weight: 800;
}

.seomos-crm-mini__lead:nth-child(3) i {
	background: #657E71;
}

.seomos-crm-mini__lead:nth-child(4) i {
	background: #6A778B;
}

.seomos-crm-mini__lead span {
	display: flex;
	min-width: 0;
	flex-direction: column;
}

.seomos-crm-mini__lead b {
	font-size: 8.5px;
}

.seomos-crm-mini__lead small {
	max-width: 120px;
	margin-top: 2px;
	overflow: hidden;
	color: #83909E;
	font-size: 7px;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.seomos-crm-mini__pipeline {
	display: flex;
	gap: 7px;
	padding: 15px 12px;
	background: #F5F7FA;
}

.seomos-crm-mini__pipeline > div {
	flex: 1;
	min-width: 0;
}

.seomos-crm-mini__pipeline b {
	display: block;
	margin-bottom: 8px;
	font-size: 7px;
}

.seomos-crm-mini__pipeline span {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 58px;
	border: 1px solid #E2E7ED;
	border-radius: 9px;
	background: #fff;
	color: #7E8A98;
	font-size: 15px;
	font-weight: 800;
}

.seomos-crm-mini__pipeline span.is-hot {
	border-color: #F4C8BA;
	background: #FFF6F3;
	color: var(--accent);
}

.crm-landing {
	--crm-bg: #FFFFFF;
	--crm-soft: #F7F8FA;
	--crm-line: #E8ECF1;
	--crm-text: #0B1118;
	--crm-copy: #526170;
	--crm-muted: #82909E;
	background: var(--crm-bg);
	color: var(--crm-text);
	overflow: hidden;
}

.crm-landing *,
.crm-landing *::before,
.crm-landing *::after {
	box-sizing: border-box;
}

.crm-container {
	position: relative;
	width: min(1200px, calc(100% - 80px));
	margin: 0 auto;
}

.crm-kicker {
	display: flex;
	align-items: center;
	gap: 9px;
	color: var(--accent);
	font-size: 12.5px;
	font-weight: 800;
	letter-spacing: 0.13em;
	text-transform: uppercase;
}

.crm-kicker > span {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: currentColor;
	box-shadow: 0 0 0 5px rgba(232, 75, 29, 0.12);
}

.crm-hero {
	position: relative;
	padding: 96px 0 112px;
	background:
		linear-gradient(180deg, rgba(251, 252, 253, 0.7), #fff 72%);
}

.crm-orb {
	position: absolute;
	border-radius: 50%;
	filter: blur(2px);
	pointer-events: none;
}

.crm-orb--orange {
	top: -240px;
	right: -180px;
	width: 560px;
	height: 560px;
	background: radial-gradient(circle, rgba(232, 75, 29, 0.15), rgba(232, 75, 29, 0) 67%);
}

.crm-orb--purple {
	bottom: -250px;
	left: -220px;
	width: 520px;
	height: 520px;
	background: radial-gradient(circle, rgba(91, 53, 139, 0.12), rgba(91, 53, 139, 0) 68%);
}

.crm-hero__grid {
	display: grid;
	grid-template-columns: 1.02fr 0.98fr;
	gap: 52px;
	align-items: center;
}

.crm-hero__copy h1 {
	max-width: 650px;
	margin-top: 19px;
	font-size: clamp(45px, 5.1vw, 67px);
	font-weight: 800;
	line-height: 1.02;
	letter-spacing: -0.055em;
}

.crm-hero__copy h1 em {
	color: var(--accent);
	font-style: normal;
}

.crm-hero__lead {
	max-width: 640px;
	margin-top: 24px;
	color: var(--crm-copy);
	font-size: 18px;
	line-height: 1.7;
}

.crm-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: 31px;
}

.crm-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 9px;
	min-height: 50px;
	padding: 13px 22px;
	border: 1px solid transparent;
	border-radius: 12px;
	font-family: "Poppins", sans-serif;
	font-size: 14.5px;
	font-weight: 700;
	line-height: 1.2;
	cursor: pointer;
	transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease, border-color 0.2s ease;
}

.crm-button:hover {
	transform: translateY(-2px);
}

.crm-button__external-icon {
	width: 18px;
	height: 18px;
	flex: 0 0 18px;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.9;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.crm-button--primary {
	background: var(--accent);
	color: #fff;
	box-shadow: 0 14px 28px -15px rgba(232, 75, 29, 0.86);
}

.crm-button--primary:hover {
	background: #F05A2B;
	box-shadow: 0 18px 34px -15px rgba(232, 75, 29, 0.95);
}

.crm-button--secondary {
	border-color: #DCE2E9;
	background: #fff;
	color: var(--crm-text);
}

.crm-button--secondary:hover {
	border-color: #BFC8D2;
	background: #F9FAFB;
}

.crm-proof {
	display: flex;
	flex-wrap: wrap;
	gap: 10px 18px;
	margin-top: 26px;
	color: #687684;
	font-size: 13px;
	font-weight: 700;
}

.crm-proof i {
	margin-right: 3px;
	color: var(--accent);
	font-style: normal;
}

.crm-hero__product {
	position: relative;
	padding: 28px 0 24px;
}

.crm-product-glow {
	position: absolute;
	inset: 2% 8% 0;
	border-radius: 50%;
	background: linear-gradient(135deg, rgba(232, 75, 29, 0.3), rgba(91, 53, 139, 0.3));
	filter: blur(55px);
	opacity: 0.55;
}

.crm-browser {
	position: relative;
	border: 1px solid #DDE3E9;
	border-radius: 17px;
	background: #fff;
	box-shadow: 0 32px 70px -30px rgba(11, 17, 24, 0.38);
	overflow: hidden;
	transform: perspective(1400px) rotateY(-2deg) rotateX(1deg);
}

.crm-browser__bar {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	height: 45px;
	padding: 0 14px;
	border-bottom: 1px solid #E8ECF1;
	background: #FBFCFD;
}

.crm-browser__dots {
	display: flex;
	gap: 5px;
}

.crm-browser__dots span {
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: #D7DCE2;
}

.crm-browser__dots span:first-child {
	background: var(--accent);
}

.crm-browser__address {
	padding: 5px 18px;
	border: 1px solid #E4E8ED;
	border-radius: 7px;
	background: #fff;
	color: #87939F;
	font-size: 9px;
	font-weight: 700;
}

.crm-browser__status {
	justify-self: end;
	color: #2D8B55;
	font-size: 9px;
	font-weight: 800;
}

.crm-browser__status::before {
	content: "";
	display: inline-block;
	width: 6px;
	height: 6px;
	margin-right: 5px;
	border-radius: 50%;
	background: #35B56E;
}

.crm-browser img {
	display: block;
	width: 100%;
	height: auto;
}

.crm-floating-note {
	position: absolute;
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 11px 14px;
	border: 1px solid rgba(221, 227, 233, 0.92);
	border-radius: 12px;
	background: rgba(255, 255, 255, 0.94);
	box-shadow: 0 18px 34px -22px rgba(11, 17, 24, 0.5);
	backdrop-filter: blur(10px);
}

.crm-floating-note--ai {
	top: 5px;
	right: -18px;
}

.crm-floating-note--lead {
	bottom: 0;
	left: -27px;
}

.crm-floating-note__icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	border-radius: 10px;
	background: #EFE9F6;
	color: var(--accent2);
	font-size: 17px;
}

.crm-floating-note__pulse {
	width: 11px;
	height: 11px;
	border-radius: 50%;
	background: #35B56E;
	box-shadow: 0 0 0 6px rgba(53, 181, 110, 0.13);
}

.crm-floating-note > span:last-child {
	display: flex;
	flex-direction: column;
}

.crm-floating-note b {
	font-size: 10.5px;
}

.crm-floating-note small {
	margin-top: 2px;
	color: #84919E;
	font-size: 8.5px;
}

.crm-section-heading {
	max-width: 700px;
}

.crm-section-heading--center {
	margin-right: auto;
	margin-left: auto;
	text-align: center;
}

.crm-section-heading--center .crm-kicker {
	justify-content: center;
}

.crm-section-heading h2,
.crm-showcase__copy h2,
.crm-ai-section__copy h2,
.crm-connections__copy h2 {
	margin-top: 14px;
	font-size: clamp(34px, 4.2vw, 50px);
	font-weight: 800;
	line-height: 1.1;
	letter-spacing: -0.045em;
}

.crm-section-heading > p,
.crm-showcase__copy > p,
.crm-ai-section__copy > p,
.crm-connections__copy > p {
	margin-top: 17px;
	color: var(--crm-copy);
	font-size: 17px;
	line-height: 1.7;
}

.crm-problem {
	padding: 104px 0;
	border-top: 1px solid var(--crm-line);
	border-bottom: 1px solid var(--crm-line);
	background: var(--crm-soft);
}

.crm-flow {
	display: grid;
	grid-template-columns: 1fr auto 1fr auto 1fr auto 1fr;
	gap: 12px;
	align-items: center;
	margin-top: 54px;
}

.crm-flow article {
	position: relative;
	min-height: 250px;
	padding: 27px 24px;
	border: 1px solid var(--crm-line);
	border-radius: 17px;
	background: #fff;
	box-shadow: 0 18px 40px -36px rgba(11, 17, 24, 0.35);
}

.crm-flow__number {
	position: absolute;
	top: 22px;
	right: 20px;
	color: #CDD4DC;
	font-size: 12px;
	font-weight: 800;
}

.crm-flow__icon,
.crm-feature-card__icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	border-radius: 13px;
	background: #FDEDE7;
	color: var(--accent);
}

.crm-flow__icon--purple {
	background: #EFE9F6;
	color: var(--accent2);
}

.crm-flow__icon svg,
.crm-feature-card__icon svg {
	width: 23px;
	height: 23px;
}

.crm-flow h3 {
	margin-top: 35px;
	font-size: 18px;
	font-weight: 800;
}

.crm-flow p {
	margin-top: 9px;
	color: var(--crm-copy);
	font-size: 13.5px;
	line-height: 1.6;
}

.crm-flow__arrow {
	color: #A9B3BE;
	font-size: 20px;
	font-weight: 800;
}

.crm-capabilities {
	padding: 112px 0;
}

.crm-feature-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 18px;
	margin-top: 48px;
}

.crm-feature-card {
	position: relative;
	min-height: 260px;
	padding: 28px;
	border: 1px solid var(--crm-line);
	border-radius: 18px;
	background: #fff;
	transition: transform 0.22s ease, border-color 0.22s ease, box-shadow 0.22s ease;
}

.crm-feature-card:hover {
	transform: translateY(-4px);
	border-color: #D5DCE4;
	box-shadow: 0 25px 45px -35px rgba(11, 17, 24, 0.45);
}

.crm-feature-card--featured {
	border-color: #E7DBF2;
	background: linear-gradient(145deg, #FAF7FD, #FFF9F7);
}

.crm-feature-card__badge {
	position: absolute;
	top: 24px;
	right: 24px;
	padding: 4px 8px;
	border-radius: 999px;
	background: #0B1118;
	color: #fff;
	font-size: 9px;
	font-weight: 800;
	letter-spacing: 0.08em;
}

.crm-feature-card h3 {
	margin-top: 28px;
	font-size: 18px;
	font-weight: 800;
}

.crm-feature-card p {
	margin-top: 10px;
	color: var(--crm-copy);
	font-size: 14px;
	line-height: 1.68;
}

.crm-showcase {
	padding: 112px 0;
}

.crm-showcase--inbox {
	border-top: 1px solid var(--crm-line);
	border-bottom: 1px solid var(--crm-line);
	background: var(--crm-soft);
}

.crm-showcase__grid {
	display: grid;
	grid-template-columns: 0.78fr 1.22fr;
	gap: 62px;
	align-items: center;
}

.crm-check-list {
	display: grid;
	gap: 13px;
	margin-top: 28px;
	padding: 0;
	list-style: none;
}

.crm-check-list li {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	padding: 14px;
	border: 1px solid var(--crm-line);
	border-radius: 12px;
	background: #fff;
}

.crm-check-list li > span {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 25px;
	height: 25px;
	flex: 0 0 25px;
	border-radius: 8px;
	background: #FDEDE7;
	color: var(--accent);
	font-size: 12px;
	font-weight: 800;
}

.crm-check-list li div {
	display: flex;
	flex-direction: column;
}

.crm-check-list b {
	font-size: 13.5px;
}

.crm-check-list small {
	margin-top: 3px;
	color: var(--crm-copy);
	font-size: 12px;
	line-height: 1.5;
}

.crm-screen-card {
	border: 1px solid #DDE3E9;
	border-radius: 18px;
	background: #fff;
	box-shadow: 0 28px 60px -38px rgba(11, 17, 24, 0.42);
	overflow: hidden;
}

.crm-screen-card__top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 44px;
	padding: 0 16px;
	border-bottom: 1px solid #E8ECF1;
	background: #FBFCFD;
	font-size: 10px;
	font-weight: 800;
}

.crm-screen-card__top i {
	padding: 4px 8px;
	border-radius: 999px;
	background: #FDEDE7;
	color: var(--accent);
	font-size: 8px;
	font-style: normal;
}

.crm-screen-card img {
	display: block;
	width: 100%;
	height: auto;
}

.crm-ai-section {
	position: relative;
	padding: 120px 0;
	background: #0B1118;
	color: #fff;
	overflow: hidden;
}

.crm-ai-section__glow {
	position: absolute;
	top: -180px;
	right: 0;
	width: 600px;
	height: 600px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(91, 53, 139, 0.34), transparent 67%);
}

.crm-ai-section__grid {
	display: grid;
	grid-template-columns: 0.92fr 1.08fr;
	gap: 84px;
	align-items: center;
}

.crm-ai-section__copy .crm-kicker {
	color: #FF8B67;
}

.crm-ai-section__copy h2 {
	color: #fff;
}

.crm-ai-section__copy > p {
	color: #AFB8C3;
}

.crm-ai-visual {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 450px;
}

.crm-ai-core {
	position: relative;
	z-index: 3;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 150px;
	height: 150px;
	flex-direction: column;
	border: 1px solid rgba(255, 255, 255, 0.18);
	border-radius: 40px;
	background: linear-gradient(145deg, rgba(232, 75, 29, 0.95), rgba(91, 53, 139, 0.95));
	box-shadow: 0 35px 70px -28px rgba(232, 75, 29, 0.55);
}

.crm-ai-core > span {
	position: absolute;
	top: 14px;
	right: 18px;
	font-size: 22px;
}

.crm-ai-core b {
	font-size: 42px;
	letter-spacing: -0.05em;
}

.crm-ai-core small {
	margin-top: -4px;
	font-size: 11px;
	font-weight: 700;
	opacity: 0.8;
}

.crm-ai-orbit {
	position: absolute;
	inset: 42px;
	border: 1px solid rgba(255, 255, 255, 0.12);
	border-radius: 50%;
}

.crm-ai-orbit--two {
	inset: 90px;
	border-color: rgba(232, 75, 29, 0.25);
}

.crm-ai-orbit span {
	position: absolute;
	padding: 8px 11px;
	border: 1px solid rgba(255, 255, 255, 0.12);
	border-radius: 10px;
	background: #171F29;
	color: #DCE2E9;
	font-size: 10px;
	font-weight: 700;
	box-shadow: 0 15px 30px -20px #000;
}

.crm-ai-orbit--one span:nth-child(1) { top: 8%; left: 12%; }
.crm-ai-orbit--one span:nth-child(2) { top: 17%; right: 2%; }
.crm-ai-orbit--one span:nth-child(3) { right: 4%; bottom: 11%; }
.crm-ai-orbit--two span:nth-child(1) { right: 7%; bottom: -8%; }
.crm-ai-orbit--two span:nth-child(2) { bottom: 3%; left: -12%; }
.crm-ai-orbit--two span:nth-child(3) { top: 0; left: -4%; }

.crm-ai-points {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px;
	margin-top: 32px;
}

.crm-ai-points div {
	display: flex;
	min-height: 104px;
	flex-direction: column;
	justify-content: center;
	padding: 18px;
	border: 1px solid rgba(255, 255, 255, 0.1);
	border-radius: 14px;
	background: rgba(255, 255, 255, 0.035);
}

.crm-ai-points b {
	font-size: 13px;
}

.crm-ai-points span {
	margin-top: 6px;
	color: #929EAC;
	font-size: 12px;
	line-height: 1.5;
}

.crm-showcase--pipeline .crm-section-heading {
	max-width: 760px;
}

.crm-screen-card--wide {
	margin-top: 50px;
}

.crm-connections {
	padding: 112px 0;
	border-top: 1px solid var(--crm-line);
	border-bottom: 1px solid var(--crm-line);
	background: var(--crm-soft);
}

.crm-connections__grid {
	display: grid;
	grid-template-columns: 0.88fr 1.12fr;
	gap: 70px;
	align-items: center;
}

.crm-channel-list {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 29px;
}

.crm-channel-list > span {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 9px 12px;
	border: 1px solid var(--crm-line);
	border-radius: 10px;
	background: #fff;
	font-size: 12px;
	font-weight: 800;
}

.crm-channel-list i {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 24px;
	border-radius: 7px;
	background: #EEF1F4;
	color: #42505E;
	font-size: 10px;
	font-style: normal;
	font-weight: 900;
}

.crm-channel-list i.crm-channel-list__wa {
	background: #DDF8E8;
	color: #128C4A;
}

.crm-operations-card {
	padding: 24px;
	border: 1px solid #DDE3E9;
	border-radius: 20px;
	background: #fff;
	box-shadow: 0 26px 55px -40px rgba(11, 17, 24, 0.38);
}

.crm-operations-card__header {
	display: flex;
	align-items: center;
	gap: 12px;
	padding-bottom: 18px;
	border-bottom: 1px solid var(--crm-line);
}

.crm-operations-card__mark {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 12px;
	background: linear-gradient(145deg, var(--accent), var(--accent2));
	color: #fff;
	font-size: 18px;
	font-weight: 800;
}

.crm-operations-card__header > div {
	display: flex;
	flex-direction: column;
}

.crm-operations-card__header b {
	font-size: 13px;
}

.crm-operations-card__header small {
	margin-top: 2px;
	color: var(--crm-muted);
	font-size: 10px;
}

.crm-operations-card__live {
	margin-left: auto;
	color: #39875A;
	font-size: 10px;
	font-weight: 800;
}

.crm-operations-card__live i {
	display: inline-block;
	width: 6px;
	height: 6px;
	margin-right: 4px;
	border-radius: 50%;
	background: #35B56E;
}

.crm-operations-card__items {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px;
	margin-top: 18px;
}

.crm-operations-card__items > div {
	display: flex;
	align-items: flex-start;
	gap: 11px;
	min-height: 112px;
	padding: 15px;
	border-radius: 12px;
	background: #F7F8FA;
}

.crm-operations-card__items > div > span {
	color: var(--accent);
	font-size: 10px;
	font-weight: 800;
}

.crm-operations-card__items p {
	display: flex;
	flex-direction: column;
}

.crm-operations-card__items b {
	font-size: 12px;
}

.crm-operations-card__items small {
	margin-top: 5px;
	color: var(--crm-copy);
	font-size: 10.5px;
	line-height: 1.5;
}

.crm-onboarding {
	padding: 112px 0;
}

.crm-onboarding__steps {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 18px;
	margin-top: 50px;
}

.crm-onboarding__steps article {
	position: relative;
	padding: 26px 24px;
	border-top: 2px solid #E6EAF0;
}

.crm-onboarding__steps article::after {
	content: "";
	position: absolute;
	top: -6px;
	left: 24px;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: var(--accent);
	box-shadow: 0 0 0 5px #FDEDE7;
}

.crm-onboarding__steps article > span {
	color: #BBC4CE;
	font-size: 11px;
	font-weight: 800;
}

.crm-onboarding__steps h3 {
	margin-top: 25px;
	font-size: 17px;
}

.crm-onboarding__steps p {
	margin-top: 8px;
	color: var(--crm-copy);
	font-size: 13px;
	line-height: 1.6;
}

.crm-final-cta {
	padding: 0 0 112px;
}

.crm-final-cta__card {
	position: relative;
	display: grid;
	grid-template-columns: 1fr auto;
	gap: 48px;
	align-items: end;
	padding: 60px;
	border-radius: 24px;
	background: #0B1118;
	color: #fff;
	overflow: hidden;
}

.crm-final-cta__orbs span {
	position: absolute;
	border-radius: 50%;
	pointer-events: none;
}

.crm-final-cta__orbs span:first-child {
	top: -160px;
	right: -80px;
	width: 370px;
	height: 370px;
	background: radial-gradient(circle, rgba(232, 75, 29, 0.42), transparent 68%);
}

.crm-final-cta__orbs span:last-child {
	bottom: -180px;
	left: 32%;
	width: 360px;
	height: 360px;
	background: radial-gradient(circle, rgba(91, 53, 139, 0.38), transparent 68%);
}

.crm-final-cta__copy,
.crm-final-cta__actions {
	position: relative;
}

.crm-final-cta__copy .crm-kicker {
	color: #FF8B67;
}

.crm-final-cta__copy h2 {
	margin-top: 14px;
	color: #fff;
	font-size: clamp(38px, 5vw, 56px);
	line-height: 1.07;
	letter-spacing: -0.045em;
}

.crm-final-cta__copy p {
	max-width: 650px;
	margin-top: 16px;
	color: #AEB7C2;
	font-size: 16px;
	line-height: 1.65;
}

.crm-final-cta__actions {
	display: flex;
	min-width: 260px;
	flex-direction: column;
	gap: 10px;
}

.crm-button--ghost {
	border-color: rgba(255, 255, 255, 0.18);
	background: rgba(255, 255, 255, 0.05);
	color: #fff;
}

.crm-button--ghost:hover {
	border-color: rgba(255, 255, 255, 0.36);
	background: rgba(255, 255, 255, 0.1);
}

html[data-theme="dark"] .crm-nav-badge {
	background: rgba(232, 75, 29, 0.18);
	color: #FF9D7E;
}

html[data-theme="dark"] .crm-landing {
	--crm-bg: #0D1117;
	--crm-soft: #111820;
	--crm-line: #2B3542;
	--crm-text: #F5F7FA;
	--crm-copy: #AEB8C4;
	--crm-muted: #8793A0;
	background: var(--crm-bg) !important;
}

html[data-theme="dark"] .crm-hero {
	background: linear-gradient(180deg, #10161E, #0D1117 72%) !important;
}

html[data-theme="dark"] .crm-button--secondary,
html[data-theme="dark"] .crm-flow article,
html[data-theme="dark"] .crm-feature-card,
html[data-theme="dark"] .crm-check-list li,
html[data-theme="dark"] .crm-channel-list > span,
html[data-theme="dark"] .crm-operations-card {
	border-color: #2B3542;
	background: #151B23 !important;
	color: #F5F7FA;
}

html[data-theme="dark"] .crm-button--secondary:hover {
	background: #1D2630 !important;
}

html[data-theme="dark"] .crm-feature-card--featured {
	background: linear-gradient(145deg, #1D1726, #211713) !important;
}

html[data-theme="dark"] .crm-browser,
html[data-theme="dark"] .crm-screen-card {
	border-color: #34404E;
	background: #151B23;
}

html[data-theme="dark"] .crm-browser__bar,
html[data-theme="dark"] .crm-screen-card__top {
	border-color: #2B3542;
	background: #1A222C;
	color: #DCE2E9;
}

html[data-theme="dark"] .crm-browser__address {
	border-color: #34404E;
	background: #10161E;
	color: #8F9AA7;
}

html[data-theme="dark"] .crm-floating-note {
	border-color: #34404E;
	background: rgba(21, 27, 35, 0.95);
	color: #F5F7FA;
}

html[data-theme="dark"] .crm-operations-card__items > div {
	background: #1B232D;
}

html[data-theme="dark"] .crm-onboarding__steps article {
	border-top-color: #34404E;
}

html[data-theme="dark"] .crm-onboarding__steps article::after {
	box-shadow: 0 0 0 5px rgba(232, 75, 29, 0.16);
}

@media (max-width: 1080px) {
	.main-nav,
	.sh-cta-desktop {
		display: none !important;
	}

	.sh-burger {
		display: flex !important;
	}

	.sh-mtoggle:checked ~ .sh-mpanel {
		display: block !important;
	}

	.crm-hero__grid,
	.crm-showcase__grid,
	.crm-ai-section__grid,
	.crm-connections__grid {
		gap: 42px;
	}

	.crm-flow {
		grid-template-columns: repeat(4, 1fr);
	}

	.crm-flow__arrow {
		display: none;
	}

	.crm-flow article {
		min-height: 265px;
	}

	.crm-floating-note {
		display: none;
	}
}

@media (max-width: 900px) {
	.crm-container {
		width: min(100% - 44px, 720px);
	}

	.crm-hero {
		padding: 76px 0 90px;
	}

	.crm-hero__grid,
	.crm-showcase__grid,
	.crm-ai-section__grid,
	.crm-connections__grid,
	.crm-final-cta__card,
	.seomos-crm-service-card {
		grid-template-columns: 1fr;
	}

	.crm-hero__copy {
		text-align: center;
	}

	.crm-hero__copy .crm-kicker,
	.crm-actions,
	.crm-proof {
		justify-content: center;
	}

	.crm-hero__copy h1,
	.crm-hero__lead {
		margin-right: auto;
		margin-left: auto;
	}

	.crm-hero__product {
		max-width: 720px;
		margin: 10px auto 0;
	}

	.crm-feature-grid {
		grid-template-columns: 1fr 1fr;
	}

	.crm-showcase__copy {
		max-width: 680px;
	}

	.crm-ai-visual {
		min-height: 400px;
	}

	.crm-final-cta__actions {
		min-width: 0;
		max-width: 330px;
	}

	.seomos-crm-service-card {
		gap: 34px;
		padding: 40px;
	}
}

@media (max-width: 700px) {
	.crm-container {
		width: calc(100% - 36px);
	}

	.crm-hero {
		padding: 58px 0 70px;
	}

	.crm-hero__copy h1 {
		font-size: 42px;
	}

	.crm-hero__lead {
		font-size: 16px;
	}

	.crm-actions {
		align-items: stretch;
		flex-direction: column;
	}

	.crm-button {
		width: 100%;
	}

	.crm-browser {
		border-radius: 12px;
		transform: none;
	}

	.crm-browser__bar {
		height: 36px;
	}

	.crm-browser__address {
		padding: 4px 10px;
	}

	.crm-browser__status {
		display: none;
	}

	.crm-problem,
	.crm-capabilities,
	.crm-showcase,
	.crm-ai-section,
	.crm-connections,
	.crm-onboarding {
		padding: 78px 0;
	}

	.crm-section-heading h2,
	.crm-showcase__copy h2,
	.crm-ai-section__copy h2,
	.crm-connections__copy h2 {
		font-size: 34px;
	}

	.crm-section-heading > p,
	.crm-showcase__copy > p,
	.crm-ai-section__copy > p,
	.crm-connections__copy > p {
		font-size: 15.5px;
	}

	.crm-flow,
	.crm-feature-grid,
	.crm-ai-points,
	.crm-operations-card__items,
	.crm-onboarding__steps {
		grid-template-columns: 1fr;
	}

	.crm-flow article,
	.crm-feature-card {
		min-height: 0;
	}

	.crm-flow h3 {
		margin-top: 26px;
	}

	.crm-screen-card__top {
		height: 38px;
	}

	.crm-ai-visual {
		min-height: 330px;
	}

	.crm-ai-orbit {
		inset: 18px;
	}

	.crm-ai-orbit--two {
		inset: 64px;
	}

	.crm-ai-orbit span {
		padding: 6px 8px;
		font-size: 8px;
	}

	.crm-ai-core {
		width: 128px;
		height: 128px;
		border-radius: 34px;
	}

	.crm-onboarding__steps {
		gap: 0;
	}

	.crm-onboarding__steps article {
		padding: 24px 20px 30px;
	}

	.crm-final-cta {
		padding-bottom: 72px;
	}

	.crm-final-cta__card {
		gap: 30px;
		padding: 38px 24px;
	}

	.crm-final-cta__copy h2 {
		font-size: 38px;
	}

	.seomos-crm-service-card {
		margin-top: 18px;
		padding: 30px 22px;
	}

	.seomos-crm-service-card__actions {
		align-items: stretch;
		flex-direction: column;
	}

	.seomos-crm-service-card__actions a {
		justify-content: center;
		text-align: center;
	}

	.seomos-crm-service-card__visual {
		transform: none;
	}

	.seomos-crm-mini__body {
		min-height: 210px;
	}

	.seomos-crm-mini__lead {
		padding: 8px 5px;
	}

	.seomos-crm-mini__pipeline {
		padding: 12px 7px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.crm-button,
	.crm-feature-card,
	.seomos-crm-service-card__actions a {
		transition: none;
	}

	.crm-button:hover,
	.crm-feature-card:hover,
	.seomos-crm-service-card__actions a:hover {
		transform: none;
	}
}

/* Auditoría de contraste WCAG 2.2 AA — 2026-08-27.
 * Estas reglas cierran excepciones heredadas de estilos en línea y componentes
 * con superficies oscuras propias, también cuando el sitio está en tema claro. */
html:not([data-theme="dark"]) [style*="color: rgb(122, 133, 149)"],
html:not([data-theme="dark"]) [style*="color: rgb(136, 147, 160)"],
html:not([data-theme="dark"]) [style*="color: rgb(154, 164, 176)"],
html:not([data-theme="dark"]) [style*="color:#C5CBD3"],
html:not([data-theme="dark"]) [style*="color: #C5CBD3"],
html:not([data-theme="dark"]) [style*="color:#C9CFD8"],
html:not([data-theme="dark"]) [style*="color: #C9CFD8"],
html:not([data-theme="dark"]) .seomos-service-visual__label {
	color: #667382 !important;
}

html:not([data-theme="dark"]) [style*="color:#1B9E5A"],
html:not([data-theme="dark"]) [style*="color: #1B9E5A"],
html:not([data-theme="dark"]) [style*="color: rgb(27, 158, 90)"] {
	color: #12633A !important;
}

/* Los acentos de marca requieren su variante clara cuando viven sobre paneles
 * oscuros, aunque el tema general de la página sea claro. */
[style*="background:#0B1118"] [style*="color:var(--accent"],
[style*="background: #0B1118"] [style*="color:var(--accent"],
[style*="background:#151B21"] [style*="color:var(--accent"],
[style*="background: #151B21"] [style*="color:var(--accent"],
[style*="background:#151B23"] [style*="color:var(--accent"],
[style*="background: #151B23"] [style*="color:var(--accent"],
[style*="background: rgb(11, 17, 24)"] [style*="color:var(--accent"],
[style*="background: rgb(21, 27, 33)"] [style*="color:var(--accent"],
[style*="background: rgb(21, 27, 35)"] [style*="color:var(--accent"] {
	color: #FF9A78 !important;
}

[style*="background:#0B1118"] [style*="color:var(--accent2"],
[style*="background: #0B1118"] [style*="color:var(--accent2"],
[style*="background:#151B21"] [style*="color:var(--accent2"],
[style*="background: #151B21"] [style*="color:var(--accent2"],
[style*="background:#151B23"] [style*="color:var(--accent2"],
[style*="background: #151B23"] [style*="color:var(--accent2"],
[style*="background: rgb(11, 17, 24)"] [style*="color:var(--accent2"],
[style*="background: rgb(21, 27, 33)"] [style*="color:var(--accent2"],
[style*="background: rgb(21, 27, 35)"] [style*="color:var(--accent2"] {
	color: #C6A8E3 !important;
}

html[data-theme="dark"] [style*="background:#EFEAF5"][style*="color:#5B358B"],
html[data-theme="dark"] [style*="background: #EFEAF5"][style*="color: #5B358B"],
html[data-theme="dark"] [style*="color: rgb(91, 53, 139)"] {
	color: #C6A8E3 !important;
}

html[data-theme="dark"] [style*="color:var(--accent"],
html[data-theme="dark"] [style*="color: var(--accent"],
html[data-theme="dark"] .crm-kicker,
html[data-theme="dark"] .crm-proof i,
html[data-theme="dark"] .crm-operations-card__items > div > span,
html[data-theme="dark"] .crm-onboarding__steps article > span {
	color: #FF9A78 !important;
}

html[data-theme="dark"] [style*="color:var(--accent2"],
html[data-theme="dark"] [style*="color: var(--accent2"],
html[data-theme="dark"] .seomos-report-keyword em {
	color: #C6A8E3 !important;
}

.seomos-report-keyword b {
	color: #667382 !important;
}

.seomos-report-keyword strong {
	color: #B83712 !important;
}

html[data-theme="dark"] .seomos-report-keyword b,
html[data-theme="dark"] .seomos-service-visual__label,
html[data-theme="dark"] .seomos-seo-problems__hint {
	color: #AAB5C2 !important;
}

html[data-theme="dark"] .seomos-report-keyword strong {
	color: #FF9A78 !important;
}

/* Componentes de SEOMOS AI CRM con texto funcional pequeño. */
.crm-landing {
	--crm-muted: #5F6C7A;
}

.crm-browser__address,
.crm-flow__number,
.crm-onboarding__steps article > span {
	color: #5F6C7A;
}

.crm-check-list li > span,
.crm-screen-card__top i {
	color: #B83712;
}

.crm-channel-list i.crm-channel-list__wa {
	color: #19663D;
}

.crm-operations-card__live {
	color: #2F754C;
}

.crm-browser__status {
	color: #12633A;
}

html:not([data-theme="dark"]) .crm-floating-note small {
	color: #5F6C7A;
}

html[data-theme="dark"] .crm-landing {
	--crm-muted: #AAB5C2;
}

html[data-theme="dark"] .crm-proof,
html[data-theme="dark"] .crm-browser__address,
html[data-theme="dark"] .crm-flow__number {
	color: #AAB5C2;
}

html[data-theme="dark"] .crm-operations-card__live {
	color: #8DD6A8;
}

html[data-theme="dark"] .crm-browser__status {
	color: #8DD6A8;
}