/* =========================================================
   GRUPO LUTASKA — Hoja de estilos principal
   Edita los colores y tamaños desde las variables de abajo.
   ========================================================= */

:root {
	--navy: #0b1b2e;
	--navy-deep: #060f1c;
	--navy-soft: #12263d;
	--electric: #1e6ff2;
	--electric-dark: #1558c8;
	--steel: #5b6b7c;
	--bg: #f8fafc;
	--bg-alt: #eef1f5;
	--white: #ffffff;
	--slate-200: #e2e8f0;
	--slate-300: #cbd5e1;
	--slate-400: #94a3b8;
	--slate-500: #64748b;

	--max: 90rem;
	--pad: 1.25rem;

	--font-display: "Oswald", "Arial Narrow", sans-serif;
	--font-sans: "Source Sans 3", "Segoe UI", system-ui, sans-serif;
}

@media (min-width: 640px) {
	:root { --pad: 2rem; }
}

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

html { scroll-behavior: smooth; scroll-padding-top: 4rem; }

body {
	margin: 0;
	font-family: var(--font-sans);
	font-size: 17px;
	line-height: 1.6;
	color: var(--navy);
	background: var(--bg);
	overflow-x: hidden;
	-webkit-font-smoothing: antialiased;
}

img, video { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
button { font: inherit; cursor: pointer; }

:focus-visible {
	outline: 3px solid var(--electric);
	outline-offset: 3px;
}

.wrap {
	width: 100%;
	max-width: var(--max);
	margin: 0 auto;
	padding-inline: var(--pad);
}

.sr-only {
	position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* ---------- Tipografía ---------- */
h1, h2, h3 {
	font-family: var(--font-display);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: -0.01em;
	margin: 0;
}

.acento { color: var(--electric); }

.eyebrow {
	display: flex;
	align-items: center;
	gap: 1rem;
	font-size: 0.69rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.25em;
	color: var(--electric);
}
.eyebrow .linea {
	flex: 1;
	height: 1px;
	background: currentColor;
	opacity: 0.25;
}
.eyebrow > span:first-child { min-width: 0; }
.eyebrow .txt { color: var(--steel); }
@media (min-width: 640px) {
	.eyebrow > span:first-child,
	.eyebrow .txt { white-space: nowrap; }
}
.dark .eyebrow .txt { color: var(--slate-400); }

.titulo-seccion {
	margin-top: 1.5rem;
	font-size: clamp(2.1rem, 5.2vw, 3.75rem);
	line-height: 1.02;
}

/* ---------- Botones ---------- */
.btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.6rem;
	padding: 1rem 1.75rem;
	font-size: 0.82rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.15em;
	border: 1px solid transparent;
	transition: background-color .2s, border-color .2s, transform .1s;
}
.btn:active { transform: scale(.98); }
.btn-primario { background: var(--electric); color: #fff; }
.btn-primario:hover { background: var(--electric-dark); }
.btn-linea { border-color: rgba(255,255,255,.3); color: #fff; }
.btn-linea:hover { border-color: #fff; background: rgba(255,255,255,.1); }
.btn-secundario { border-color: rgba(255,255,255,.35); color: #fff; background: transparent; }
.btn-secundario:hover { border-color: #fff; background: rgba(255,255,255,.08); }
.btn-ancho { width: 100%; }

.botones-form { display: grid; gap: .75rem; margin-top: 2rem; }
@media (min-width: 520px) { .botones-form { grid-template-columns: 1fr 1fr; } }
.botones-form .btn { padding-inline: .9rem; font-size: .76rem; letter-spacing: .1em; }

/* Campo trampa contra spam: fuera de la vista, nunca lo ve una persona */
.trampa {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.link-flecha {
	display: inline-flex;
	align-items: center;
	gap: .5rem;
	margin-top: 1.75rem;
	font-size: .85rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .15em;
	color: var(--electric);
}
.link-flecha:hover { color: var(--electric-dark); }

.ico { width: 1.05em; height: 1.05em; stroke-width: 2.4; flex: none; }

/* ---------- Encabezado ---------- */
.header {
	position: fixed;
	inset: 0 0 auto 0;
	z-index: 50;
	background: rgba(11, 27, 46, .96);
	backdrop-filter: blur(6px);
	border-bottom: 1px solid rgba(255,255,255,.1);
}
.header-in {
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 4rem;
}
.logo {
	display: flex;
	align-items: baseline;
	gap: .5rem;
	color: #fff;
}
.logo strong {
	font-family: var(--font-display);
	font-size: 1.5rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .02em;
}
.logo span {
	display: none;
	font-size: .62rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .3em;
	color: var(--slate-400);
}
@media (min-width: 640px) { .logo span { display: inline; } }
@media (min-width: 1024px) and (max-width: 1399px) { .logo span { display: none; } }

.nav-desktop { display: none; gap: 2rem; }
@media (min-width: 1024px) { .nav-desktop { display: flex; align-items: center; } }
.nav-desktop a {
	font-size: .72rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .2em;
	color: var(--slate-300);
	transition: color .2s;
}
.nav-desktop a:hover { color: #fff; }

.header-acciones { display: flex; align-items: center; gap: .75rem; }
.btn-tel { display: none; padding: .7rem 1rem; font-size: .72rem; }
@media (min-width: 640px) { .btn-tel { display: inline-flex; } }

.btn-menu {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2.75rem;
	height: 2.75rem;
	background: none;
	border: 0;
	color: #fff;
}
@media (min-width: 1024px) { .btn-menu { display: none; } }
.btn-menu svg { width: 1.5rem; height: 1.5rem; }
.btn-menu .icono-cerrar { display: none; }
.btn-menu[aria-expanded="true"] .icono-abrir { display: none; }
.btn-menu[aria-expanded="true"] .icono-cerrar { display: block; }

.nav-movil {
	display: none;
	background: var(--navy);
	border-top: 1px solid rgba(255,255,255,.1);
	padding: .5rem var(--pad) 1.25rem;
}
.nav-movil.abierto { display: block; }
@media (min-width: 1024px) { .nav-movil.abierto { display: none; } }
.nav-movil a {
	display: block;
	padding: .9rem 0;
	border-bottom: 1px solid rgba(255,255,255,.07);
	font-size: .85rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .2em;
	color: var(--slate-200);
}
.nav-movil .btn { margin-top: 1rem; }

/* ---------- Hero ---------- */
.hero {
	position: relative;
	display: flex;
	align-items: flex-end;
	min-height: 100svh;
	background: var(--navy);
	overflow: hidden;
}
.hero-img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.hero::after {
	content: "";
	position: absolute;
	inset: 0;
	background:
		linear-gradient(to right, rgba(6,15,28,.95), rgba(11,27,46,.62) 55%, rgba(11,27,46,.25)),
		linear-gradient(to top, rgba(6,15,28,.92), transparent 55%, rgba(6,15,28,.45));
}
.hero-contenido {
	position: relative;
	z-index: 1;
	width: 100%;
	padding-block: 8rem 4rem;
}
@media (min-width: 1024px) { .hero-contenido { padding-block: 9rem 6rem; } }

.hero-grid { display: grid; gap: 2.5rem; }
@media (min-width: 1024px) {
	.hero-grid { grid-template-columns: 2fr 1fr; align-items: flex-end; }
}
.hero .eyebrow { max-width: 26rem; }
.hero .eyebrow .txt { color: var(--slate-300); }

.hero h1 {
	margin-top: 1.5rem;
	font-weight: 700;
	font-size: clamp(2.7rem, 8vw, 6rem);
	line-height: .98;
	color: #fff;
}
.hero p {
	margin-top: 1.5rem;
	max-width: 38rem;
	font-size: 1.1rem;
	color: var(--slate-300);
}
.hero p strong { color: #fff; }

.hero-botones {
	display: flex;
	flex-direction: column;
	gap: .75rem;
	margin-top: 2.25rem;
}
@media (min-width: 640px) { .hero-botones { flex-direction: row; } }

.hero-specs { display: none; }
@media (min-width: 1024px) {
	.hero-specs { display: block; margin-left: auto; max-width: 20rem; width: 100%; }
}
.hero-specs .fila { padding-bottom: .5rem; border-bottom: 1px solid rgba(255,255,255,.25); }
.hero-specs .fila + .fila { margin-top: 1.25rem; }
.hero-specs .fila div {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 1rem;
	color: #fff;
}
.hero-specs dt {
	font-size: .66rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .25em;
	color: var(--slate-400);
}
.hero-specs dt {
	max-width: 9.5rem;
	line-height: 1.4;
}
.hero-specs dd {
	margin: 0;
	font-family: var(--font-display);
	font-size: 1.75rem;
	font-weight: 600;
	text-transform: uppercase;
	white-space: nowrap;
}

/* ---------- Secciones base ---------- */
section { position: relative; }
.seccion { padding-block: 5rem; }
@media (min-width: 640px) { .seccion { padding-block: 7rem; } }

.dark { background: var(--navy); color: #fff; }
.dark h2, .dark h3 { color: #fff; }
.deep { background: var(--navy-deep); color: #fff; }
.deep h2, .deep h3 { color: #fff; }
.claro { background: var(--bg-alt); }

.ruido {
	position: absolute;
	inset: 0;
	pointer-events: none;
	opacity: .05;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");
}
.ruido + .wrap { position: relative; }

/* ---------- Capacidad / cifras ---------- */
.cifras {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 2.5rem 1.5rem;
	margin-top: 2.5rem;
}
@media (min-width: 768px) { .cifras { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1024px) { .cifras { grid-template-columns: repeat(5, 1fr); } }
.cifra { border-top: 1px solid rgba(255,255,255,.2); padding-top: 1.25rem; }
.cifra .valor {
	font-family: var(--font-display);
	font-size: clamp(2.1rem, 4vw, 3rem);
	font-weight: 600;
	text-transform: uppercase;
	color: #fff;
	line-height: 1.05;
}
.cifra .etiqueta {
	margin: .5rem 0 0;
	font-size: .7rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .18em;
	color: var(--slate-400);
}

/* ---------- Servicios ---------- */
.servicios-lista { margin-top: 4rem; display: grid; gap: 5rem; }
@media (min-width: 640px) { .servicios-lista { gap: 7rem; } }

.servicio { display: grid; gap: 2.5rem; align-items: center; }
@media (min-width: 1024px) {
	.servicio { grid-template-columns: 7fr 5fr; gap: 3.5rem; }
	.servicio.invertido { grid-template-columns: 5fr 7fr; }
	.servicio.invertido .servicio-media { order: 2; }
	.servicio.invertido .servicio-texto { order: 1; }
}
.servicio-media { position: relative; }
.servicio-media img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
}
.servicio-num {
	position: absolute;
	left: -.25rem;
	bottom: -1.25rem;
	font-family: var(--font-display);
	font-size: clamp(3.75rem, 9vw, 6rem);
	font-weight: 700;
	line-height: 1;
	color: rgba(11,27,46,.1);
	pointer-events: none;
}
.servicio.invertido .servicio-num { left: auto; right: -.25rem; }

.servicio-texto h3 {
	margin-top: 1rem;
	font-size: clamp(1.7rem, 3.4vw, 2.25rem);
}
.servicio-texto p { color: var(--steel); }

.especificaciones { margin-top: 1.75rem; }
.especificaciones .fila {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 1rem;
	padding: .75rem 0;
	border-top: 1px solid rgba(11,27,46,.15);
}
.especificaciones dt {
	font-size: .68rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .18em;
	color: var(--steel);
}
.especificaciones dd {
	margin: 0;
	text-align: right;
	font-size: .92rem;
	font-weight: 700;
	color: var(--navy);
}

/* ---------- Por qué / listas con check ---------- */
.split { display: grid; gap: 3rem; }
@media (min-width: 1024px) { .split { grid-template-columns: 5fr 7fr; gap: 4rem; } }
@media (min-width: 1024px) { .split.inv { grid-template-columns: 7fr 5fr; } }

.lista-check { margin-top: 2.5rem; }
.lista-check li {
	display: flex;
	gap: 1rem;
	padding: 1.25rem 0;
	border-top: 1px solid rgba(255,255,255,.15);
	color: var(--slate-300);
}
.lista-check li:last-child { border-bottom: 1px solid rgba(255,255,255,.15); }
.lista-check svg { width: 1.25rem; height: 1.25rem; flex: none; margin-top: .25rem; color: var(--electric); }
.lista-check { list-style: none; padding: 0; }

.figura-lateral img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
.figura-lateral figcaption {
	display: flex;
	align-items: center;
	gap: 1rem;
	margin-top: 1rem;
	font-size: .66rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .25em;
	color: var(--slate-400);
}
.figura-lateral figcaption .linea { flex: 1; height: 1px; background: currentColor; opacity: .3; }

/* ---------- Galería ---------- */
.galeria-head {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	gap: 2rem;
}
.galeria-head p { max-width: 24rem; font-size: .95rem; color: var(--steel); }

.galeria {
	display: grid;
	gap: 1.5rem;
	margin-top: 4rem;
}
@media (min-width: 640px) { .galeria { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .galeria { grid-template-columns: repeat(12, 1fr); gap: 2rem; } }

.galeria figure { margin: 0; }
.galeria img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .5s ease;
}
.galeria .marco { overflow: hidden; }
.galeria figure:hover img { transform: scale(1.03); }
.galeria figcaption {
	display: flex;
	align-items: center;
	gap: .75rem;
	margin-top: .75rem;
	font-size: .62rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .22em;
	color: var(--steel);
}
.galeria figcaption .linea { flex: 1; height: 1px; background: currentColor; opacity: .3; }
.galeria figcaption span:last-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

@media (min-width: 1024px) {
	.g-7 { grid-column: span 7; }
	.g-5 { grid-column: span 5; }
	.g-6 { grid-column: span 6; }
	.baja-1 { transform: translateY(3rem); }
	.baja-2 { transform: translateY(1.5rem); }
	.sube-1 { transform: translateY(-1.5rem); }
	.baja-3 { transform: translateY(2.5rem); }
}
.r-16-10 { aspect-ratio: 16 / 10; }
.r-4-3 { aspect-ratio: 4 / 3; }

/* ---------- Video ---------- */
.video-bloque {
	display: grid;
	gap: 2rem;
	margin-top: 5rem;
	align-items: center;
}
@media (min-width: 1024px) { .video-bloque { grid-template-columns: 5fr 7fr; gap: 3.5rem; } }
.video-bloque .marco-video { display: flex; justify-content: center; }
.video-bloque video {
	width: 100%;
	max-width: 22rem;
	background: var(--navy-deep);
	border: 1px solid rgba(11,27,46,.12);
}
.video-bloque h3 { font-size: clamp(1.6rem, 3vw, 2.1rem); margin-top: 1rem; }
.video-bloque p { color: var(--steel); }

/* ---------- Logística / listas planas ---------- */
.lista-plana { list-style: none; margin: 0; padding: 0; border-top: 1px solid rgba(11,27,46,.2); }
.lista-plana li {
	display: flex;
	gap: 1rem;
	padding: 1.25rem 0;
	border-bottom: 1px solid rgba(11,27,46,.2);
	font-size: 1.02rem;
}
.lista-plana svg { width: 1.2rem; height: 1.2rem; flex: none; margin-top: .3rem; color: var(--electric); }

.dark .lista-plana { border-top-color: rgba(255,255,255,.15); }
.dark .lista-plana li { border-bottom-color: rgba(255,255,255,.15); color: var(--slate-200); }

.texto-intro { margin-top: 1.5rem; max-width: 34rem; font-size: 1.08rem; color: var(--steel); }
.dark .texto-intro, .deep .texto-intro { color: var(--slate-300); }

/* ---------- Proceso ---------- */
.pasos {
	display: grid;
	gap: 1px;
	margin-top: 4rem;
	background: rgba(11,27,46,.15);
	border: 1px solid rgba(11,27,46,.15);
}
@media (min-width: 640px) { .pasos { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .pasos { grid-template-columns: repeat(4, 1fr); } }
.paso { background: var(--bg); padding: 2rem; transition: background-color .2s; }
@media (min-width: 640px) { .paso { padding: 2.5rem; } }
.paso:hover { background: var(--bg-alt); }
.paso .num {
	font-family: var(--font-display);
	font-size: clamp(3rem, 6vw, 4.25rem);
	font-weight: 700;
	line-height: 1;
	color: var(--electric);
}
.paso h3 { margin-top: 1.5rem; font-size: 1.4rem; }
.paso p { margin-top: .75rem; color: var(--steel); font-size: .96rem; }

/* ---------- FAQ ---------- */
.faq-lista { border-top: 1px solid rgba(11,27,46,.2); }
.faq-item { border-bottom: 1px solid rgba(11,27,46,.2); }
.faq-boton {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1.5rem;
	width: 100%;
	padding: 1.5rem 0;
	background: none;
	border: 0;
	text-align: left;
	font-family: var(--font-display);
	font-size: 1.1rem;
	font-weight: 600;
	text-transform: uppercase;
	color: var(--navy);
	transition: color .2s;
}
@media (min-width: 640px) { .faq-boton { font-size: 1.25rem; } }
.faq-boton:hover { color: var(--electric); }
.faq-boton .mas {
	flex: none;
	font-size: 1.6rem;
	font-weight: 700;
	color: var(--electric);
	transition: transform .3s;
	font-family: var(--font-sans);
	line-height: 1;
}
.faq-boton[aria-expanded="true"] .mas { transform: rotate(45deg); }
.faq-panel {
	display: grid;
	grid-template-rows: 0fr;
	transition: grid-template-rows .3s ease;
}
.faq-item.abierto .faq-panel { grid-template-rows: 1fr; padding-bottom: 1.5rem; }
.faq-panel > div { overflow: hidden; }
.faq-panel p { margin: 0; max-width: 46rem; color: var(--steel); }

/* ---------- Contacto ---------- */
.contacto-grid { display: grid; gap: 3.5rem; }
@media (min-width: 1024px) { .contacto-grid { grid-template-columns: 5fr 7fr; gap: 4rem; } }

.datos-contacto { margin-top: 2.5rem; }
.dato {
	display: flex;
	align-items: flex-start;
	gap: 1rem;
	padding: 1.25rem 0;
	border-top: 1px solid rgba(255,255,255,.15);
	transition: background-color .2s;
}
.dato:hover { background: rgba(255,255,255,.05); }
.dato > svg:first-child { width: 1.25rem; height: 1.25rem; flex: none; margin-top: .3rem; color: var(--electric); }
.dato > span:nth-child(2) { min-width: 0; }
.dato .etiqueta {
	display: block;
	font-size: .62rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .25em;
	color: var(--slate-400);
}
.dato .valor { display: block; margin-top: .25rem; font-weight: 600; color: #fff; word-break: break-word; }
.dato:hover .valor { color: var(--electric); }
.dato .flecha { width: 1rem; height: 1rem; flex: none; margin: .3rem 0 0 auto; color: var(--slate-500); }

.formulario {
	border: 1px solid rgba(255,255,255,.15);
	background: var(--navy);
	padding: 1.5rem;
}
@media (min-width: 640px) { .formulario { padding: 2.5rem; } }
.campos { display: grid; gap: 1.5rem; margin-top: 2rem; }
@media (min-width: 640px) { .campos { grid-template-columns: repeat(2, 1fr); } }
.campo-ancho { grid-column: 1 / -1; }
.formulario label {
	display: block;
	margin-bottom: .5rem;
	font-size: .68rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .2em;
	color: var(--slate-300);
}
.formulario input,
.formulario select,
.formulario textarea {
	width: 100%;
	padding: .85rem 1rem;
	font-family: inherit;
	font-size: 1rem;
	color: #fff;
	background: rgba(255,255,255,.05);
	border: 1px solid rgba(255,255,255,.2);
	border-radius: 0;
	outline: none;
	transition: border-color .2s;
}
.formulario textarea { resize: vertical; min-height: 7rem; }
.formulario select { appearance: none; }
.formulario select option { color: var(--navy); }
.formulario input::placeholder,
.formulario textarea::placeholder { color: var(--slate-500); }
.formulario input:focus,
.formulario select:focus,
.formulario textarea:focus { border-color: var(--electric); }

.aviso-error {
	margin-top: 1rem;
	padding: .75rem 1rem;
	font-size: .9rem;
	color: #fca5a5;
	background: rgba(239,68,68,.1);
	border: 1px solid rgba(248,113,113,.4);
}
.nota-form { margin-top: 1rem; text-align: center; font-size: .78rem; color: var(--slate-500); }

/* ---------- Pie ---------- */
.footer { background: var(--navy-deep); color: #fff; padding-block: 2.5rem; border-top: 1px solid rgba(255,255,255,.1); }
.footer-in { display: flex; flex-direction: column; gap: 2rem; }
@media (min-width: 1024px) { .footer-in { flex-direction: row; align-items: flex-end; justify-content: space-between; } }
.footer .marca { font-family: var(--font-display); font-size: 1.8rem; font-weight: 700; text-transform: uppercase; }
.footer p { margin: .5rem 0 0; max-width: 24rem; font-size: .88rem; color: var(--slate-400); }
.footer nav { display: flex; flex-wrap: wrap; gap: .75rem 2rem; }
.footer nav a { font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .2em; color: var(--slate-400); }
.footer nav a:hover { color: #fff; }
.footer .legal { font-size: .75rem; color: var(--slate-500); }

/* ---------- WhatsApp flotante ---------- */
.wa-flotante {
	position: fixed;
	right: 1.25rem;
	bottom: 1.25rem;
	z-index: 50;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 3.5rem;
	height: 3.5rem;
	border-radius: 999px;
	background: #25d366;
	color: #fff;
	box-shadow: 0 10px 25px rgba(6,15,28,.35);
	transition: transform .2s, background-color .2s;
}
.wa-flotante:hover { transform: scale(1.06); background: #1eb757; }
.wa-flotante svg { width: 1.8rem; height: 1.8rem; }
@media (min-width: 640px) {
	.wa-flotante { width: 4rem; height: 4rem; }
	.wa-flotante svg { width: 2rem; height: 2rem; }
}

/* ---------- Aparición al hacer scroll ---------- */
.reveal { opacity: 0; transform: translateY(18px); transition: opacity .6s ease, transform .6s ease; }
.reveal.visible { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
	.reveal { opacity: 1; transform: none; }
	@media (min-width: 1024px) {
		.baja-1, .baja-2, .baja-3, .sube-1 { transform: none; }
	}
}


/* ---------- Página de confirmación (enviar.php) ---------- */
.pagina-aviso {
	display: flex;
	align-items: center;
	min-height: 100svh;
	background: var(--navy-deep);
	color: #fff;
	padding-block: 6rem 4rem;
}
.tarjeta-aviso {
	max-width: 40rem;
	border: 1px solid rgba(255,255,255,.15);
	background: var(--navy);
	padding: 2rem;
}
@media (min-width: 640px) { .tarjeta-aviso { padding: 3rem; } }
.tarjeta-aviso h1 {
	margin-top: 1.5rem;
	font-size: clamp(2rem, 5vw, 3rem);
	line-height: 1.05;
	color: #fff;
}
.tarjeta-aviso p { color: var(--slate-300); }
.tarjeta-aviso .acciones { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 2rem; }
.tarjeta-aviso .resumen {
	margin-top: 2rem;
	border-top: 1px solid rgba(255,255,255,.15);
	padding-top: 1.25rem;
	font-size: .9rem;
	color: var(--slate-400);
}