/*
 * ShiftLab — puente entre Elementor y los estilos del diseño original.
 *
 * Orden de carga: Elementor  ->  bridge.css  ->  tailwind.css
 * - Los contenedores/widgets generados por la importación llevan la clase "sl-c" / "sl-w".
 *   Aquí se neutralizan los valores por defecto de Elementor SOLO para esos elementos,
 *   para que se comporten igual que el HTML original.
 * - Las clases utilitarias (tailwind.css) se cargan después y ganan sobre estos reseteos.
 * - Cualquier estilo que el cliente defina desde el panel de Elementor gana sobre todo lo anterior.
 * - Contenedores o widgets NUEVOS (sin sl-c / sl-w) mantienen el comportamiento normal de Elementor.
 */

html, body { background-color: #16215b; }
body { margin: 0; font-family: "Inter", sans-serif; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

/* ---------- Contenedores generados: se comportan como el elemento HTML original ---------- */
.e-con.sl-c {
	display: block;
	flex: 0 1 auto;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: normal;
	align-content: normal;
	justify-content: normal;
	gap: 0;
	width: auto;
	max-width: none;
	min-width: 0;
	min-height: 0;
	height: auto;
	padding: 0;
	margin: 0;
	position: static;
	text-align: inherit;
	border-radius: 0;
}
/* En el editor los contenedores necesitan "position" para mostrar los controles de Elementor. */
body.elementor-editor-active .e-con.sl-c:not(.absolute):not(.fixed):not(.sticky) { position: relative; }

.e-con.sl-c > .elementor-widget {
	width: auto;
	flex: 0 1 auto;
	margin: 0;
	align-self: auto;
}

/* ---------- Widgets de texto (encabezado / editor de texto / botón) ----------
 * Las clases del elemento original están en el contenedor del widget; el contenido
 * interno se "funde" con él (display: contents) para respetar flex/grid y tipografía. */
.elementor .sl-w > .elementor-widget-container,
.elementor .sl-w .elementor-heading-title,
.elementor .sl-w .elementor-button-wrapper,
.elementor .sl-w .elementor-button,
.elementor .sl-w .elementor-button-content-wrapper,
.elementor .sl-w .elementor-button-text,
.elementor .sl-contents,
.elementor .sl-contents > .elementor-widget-container {
	display: contents;
}
.elementor .sl-w .elementor-heading-title {
	font: inherit;
	color: inherit;
	line-height: inherit;
	letter-spacing: inherit;
	text-transform: inherit;
	text-align: inherit;
	margin: 0;
	padding: 0;
}
.elementor .sl-w .elementor-heading-title > a { color: inherit; }
.elementor .sl-w.elementor-widget-text-editor { color: inherit; }
.elementor .sl-w.elementor-widget-text-editor p { margin: 0; }
.elementor .sl-w.elementor-widget-text-editor p + p { margin-top: 1em; }

.elementor .sl-w.elementor-widget-button .elementor-button,
.elementor .sl-w.elementor-widget-button .elementor-button:hover,
.elementor .sl-w.elementor-widget-button .elementor-button:focus,
.elementor .sl-w.elementor-widget-button .elementor-button:visited {
	background: none;
	padding: 0;
	border-radius: 0;
	color: inherit;
	fill: currentColor;
	font: inherit;
	line-height: inherit;
	letter-spacing: inherit;
	transition: none;
}

.sl-inline { display: inline; }

/* Enlaces y botones: toda la "píldora" es clicable, no sólo el texto. */
.elementor .sl-link,
.elementor .sl-btn { cursor: pointer; }
.elementor .sl-link a::after,
.elementor .sl-btn .elementor-button::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
}
.elementor .sl-link:not(.absolute):not(.fixed),
.elementor .sl-btn:not(.absolute):not(.fixed) { position: relative; }
.elementor .sl-btn:focus-within,
.elementor .sl-link:focus-within { outline: 2px solid #1ee2cf; outline-offset: 3px; }

/* ---------- Widgets HTML (iconos y elementos decorativos) ---------- */
.elementor .sl-html,
.elementor .sl-html > .elementor-widget-container { display: contents; }

/* ---------- Imágenes ---------- */
.elementor .sl-img { text-align: inherit; }
.elementor .sl-img > .elementor-widget-container { height: 100%; width: 100%; border-radius: inherit; overflow: inherit; }
.elementor .sl-img img {
	display: block;
	width: 100%;
	height: 100%;
	max-width: 100%;
	object-fit: cover;
	object-position: center;
	border-radius: inherit;
}
.elementor .sl-img.w-auto { width: auto; }
.elementor .sl-img.w-auto img { width: auto; max-width: none; }
.elementor .sl-img.h-auto img { height: auto; }
.elementor .sl-img.object-top img { object-position: top; }
.elementor .sl-img.object-center img { object-position: center; }
/* Logos de clientes */
.elementor .sl-img.object-contain { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; }
.elementor .sl-img.object-contain > .elementor-widget-container { display: flex; align-items: center; justify-content: center; }
.elementor .sl-img.object-contain img { object-fit: contain; width: auto; height: auto; max-width: 100%; max-height: 100%; }
@media (width >= 64rem) {
	.elementor .sl-img.lg\:object-cover img { object-fit: cover; width: 100%; height: 100%; max-height: none; }
	.elementor .sl-img.lg\:h-full { height: 100%; }
}
.elementor .sl-img.aspect-video img,
.elementor .sl-img[class*="aspect-["] img { aspect-ratio: inherit; }

/* ---------- Menú: enlace activo ---------- */
.sl-nav a[aria-current="page"] { color: #fff; }

/* ---------- Contenido de artículos del blog (editor de WordPress) ---------- */
.sl-prose { --sl-accent: var(--color-brand-magenta); color: var(--color-zinc-400); }
.sl-prose > * + * { margin-top: 1.5rem; }
.sl-prose p, .sl-prose li { line-height: 1.625; }
.sl-prose a { color: var(--color-brand-teal); text-decoration: underline; text-underline-offset: 4px; }
.sl-prose strong { color: var(--color-zinc-200); font-weight: 600; }
.sl-prose h2, .sl-prose h3 {
	padding-top: 1.5rem;
	font-family: var(--font-display);
	font-weight: 600;
	color: var(--color-zinc-50);
}
.sl-prose h2 { font-size: 1.5rem; line-height: 2rem; }
.sl-prose h3 { font-size: 1.25rem; line-height: 1.75rem; }
.sl-prose blockquote {
	border-left: 2px solid var(--sl-accent);
	padding-left: 1.5rem;
	font-family: var(--font-display);
	font-size: 1.25rem;
	line-height: 1.625;
	font-style: italic;
	color: var(--color-zinc-200);
}
.sl-prose blockquote p { margin: 0; }
.sl-prose blockquote cite { display: block; margin-top: .75rem; font-size: .875rem; font-style: normal; color: var(--color-zinc-500); }
.sl-prose ul, .sl-prose ol { list-style: none; padding: 0; }
.sl-prose ul > li + li, .sl-prose ol > li + li { margin-top: .75rem; }
.sl-prose ul > li { position: relative; padding-left: 1.125rem; }
.sl-prose ul > li::before {
	content: "";
	position: absolute;
	left: 0;
	top: .625rem;
	width: .375rem;
	height: .375rem;
	background: var(--sl-accent);
}
.sl-prose ol { counter-reset: sl; }
.sl-prose ol > li { counter-increment: sl; position: relative; padding-left: 1.75rem; }
.sl-prose ol > li::before { content: counter(sl, decimal-leading-zero); position: absolute; left: 0; font-family: var(--font-display); font-size: .75rem; font-weight: 600; color: var(--sl-accent); top: .2rem; }
.sl-prose figure img, .sl-prose img { max-width: 100%; height: auto; }
.sl-prose figcaption { margin-top: .5rem; font-size: .875rem; color: var(--color-zinc-500); }
.sl-prose hr { border-color: rgb(244 244 245 / .1); }

/* Páginas normales (sin Elementor), p. ej. Política de privacidad: fondo blanco */
.sl-page-plain .sl-prose { color: var(--color-zinc-600); }
.sl-page-plain .sl-prose h2, .sl-page-plain .sl-prose h3 { color: var(--color-zinc-950); }
.sl-page-plain .sl-prose strong { color: var(--color-zinc-950); }
.sl-page-plain .sl-prose blockquote { color: var(--color-zinc-700); }

/* ---------- Formulario de contacto (estilo: texto + datos a la izquierda, tarjeta blanca a la derecha) ---------- */
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
#formulario { scroll-margin-top: 6rem; }
.sl-contact { padding: 1rem 1.5rem 6rem; }
.sl-ct { display: grid; gap: 3rem; align-items: center; }
@media (width >= 64rem) { .sl-ct { grid-template-columns: 1fr 1fr; gap: 4rem; } }
.sl-ct-title { margin-top: 1rem; font-size: 2.25rem; line-height: 1.1; font-weight: 600; color: var(--color-zinc-50); text-wrap: balance; }
@media (width >= 48rem) { .sl-ct-title { font-size: 3rem; } }
.sl-ct-title span { background: linear-gradient(90deg, var(--color-brand-cyan), var(--color-brand-teal)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.sl-ct-lead { margin-top: 1.25rem; max-width: 52ch; font-size: 1.125rem; line-height: 1.6; color: var(--color-zinc-400); text-wrap: pretty; }
.sl-ct-list { margin-top: 2.5rem; display: grid; gap: 1.25rem; }
.sl-ct-item { display: inline-flex; align-items: center; gap: 1rem; color: var(--color-zinc-200); font-size: 1rem; transition: color .2s; word-break: break-word; }
a.sl-ct-item:hover { color: #fff; }
span.sl-ct-item { user-select: all; }
.sl-ct-icon { display: grid; place-items: center; flex-shrink: 0; width: 2.75rem; height: 2.75rem; border-radius: .625rem; background: rgb(0 112 251 / .15); color: #6aa8ff; transition: background-color .2s; }
.sl-ct-icon svg { width: 1.25rem; height: 1.25rem; }
a.sl-ct-item:hover .sl-ct-icon { background: rgb(0 112 251 / .3); }
.sl-ct-item.is-highlight .sl-ct-icon { background: var(--color-brand-cyan); color: #fff; }
.sl-ct-item.is-highlight { font-weight: 600; color: #fff; }

.sl-ct-card { background: #fff; border-radius: 1rem; padding: 1.5rem; box-shadow: 0 30px 60px -20px rgb(0 0 0 / .45); }
@media (width >= 40rem) { .sl-ct-card { padding: 2rem; } }
.sl-form { display: grid; gap: 1rem; }
@media (width >= 40rem) { .sl-form { grid-template-columns: 1fr 1fr; } }
.sl-field-full { grid-column: 1 / -1; }
.sl-field { display: flex; flex-direction: column; }
.sl-field input,
.sl-field textarea {
	width: 100%;
	border: 1px solid var(--color-zinc-200);
	border-radius: .5rem;
	background: var(--color-zinc-50);
	padding: .75rem .875rem;
	font: inherit;
	font-size: .9375rem;
	color: var(--color-zinc-950);
	transition: border-color .2s, box-shadow .2s, background-color .2s;
}
.sl-field input::placeholder,
.sl-field textarea::placeholder { color: var(--color-zinc-500); opacity: 1; }
.sl-field textarea { resize: vertical; min-height: 6rem; }
.sl-field input:focus,
.sl-field textarea:focus { outline: none; background: #fff; border-color: var(--color-brand-cyan); box-shadow: 0 0 0 3px rgb(0 112 251 / .18); }
.sl-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.sl-submit {
	display: flex; align-items: center; justify-content: center; gap: .5rem;
	width: 100%;
	cursor: pointer;
	border: 0;
	border-radius: .5rem;
	background: var(--color-brand-cyan);
	padding: .875rem 1.5rem;
	font: inherit;
	font-size: .9375rem;
	font-weight: 500;
	color: #fff;
	transition: background-color .2s;
}
.sl-submit svg { width: 1.125rem; height: 1.125rem; }
.sl-submit:hover { background: var(--color-brand-cyan-deep); }
.sl-submit:disabled { opacity: .7; cursor: wait; }
.sl-submit:focus-visible { outline: 3px solid rgb(0 112 251 / .35); outline-offset: 2px; }
.sl-form-status { margin-top: .75rem; font-size: .875rem; text-align: center; color: var(--color-zinc-600); }
.sl-form-status:empty { display: none; }
.sl-form-status[data-state="ok"] { color: var(--color-brand-teal-deep); font-weight: 500; }
.sl-form-status[data-state="error"] { color: #be123c; }

/* Accesibilidad */
.sl-skip { position: absolute; left: -9999px; top: 0; z-index: 200; background: #fff; color: #16215b; padding: .75rem 1rem; border-radius: .375rem; }
.sl-skip:focus { left: 1rem; top: 1rem; }
.screen-reader-text { clip: rect(1px,1px,1px,1px); position: absolute !important; height: 1px; width: 1px; overflow: hidden; }

/* Barra de administración de WordPress: el menú fijo no debe quedar debajo */
body.admin-bar .sl-nav { top: 32px; }
@media (max-width: 782px) { body.admin-bar .sl-nav { top: 0; } }
