/* ============================================================
   base.css — Reset ligero + elementos base (estilo moderno)
   ============================================================ */

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

html {
	-webkit-text-size-adjust: 100%;
	scroll-behavior: auto;   /* el suavizado lo maneja Lenis; evita doble suavizado que rompe la barra */
}

/* Cuando pausamos Lenis para permitir el arrastre de la barra de scroll,
   anulamos el bloqueo (overflow:hidden) que aplica lenis.stop() por defecto,
   para que el scroll nativo siga funcionando durante el arrastre. */
html.lenis.lenis-stopped { overflow: auto !important; }

body {
	margin: 0;
	font-family: var(--font-base);
	font-size: var(--fs-base);
	line-height: var(--lh-base);
	color: var(--c-ink);
	background-color: var(--c-bg);
	background-image:
		radial-gradient(1200px 600px at 100% -10%, rgba(14,124,134,.10), transparent 60%),
		radial-gradient(900px 500px at -10% 10%, rgba(244,162,59,.08), transparent 55%);
	background-attachment: fixed;
	background-repeat: no-repeat;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

main { display: block; transition: opacity .18s ease; }

/* Fundido sutil mientras se intercambia el contenido (soft navigation) */
body.is-navigating main { opacity: .45; }

img { max-width: 100%; height: auto; }

a {
	color: var(--c-blue);
	text-decoration-thickness: 1px;
	text-underline-offset: 2px;
	transition: color var(--t-fast);
}
a:hover { color: var(--c-primary); }

p { margin: var(--sp-4) 0; }

h1, h2, h3, h4 {
	font-family: var(--font-display);
	line-height: 1.18;
	color: var(--c-ink);
	letter-spacing: -.01em;
}

hr {
	border: 0;
	height: 1px;
	background: var(--c-border);
	margin: var(--sp-5) 0;
}

::selection { background: var(--c-primary); color: #fff; }

:focus-visible {
	outline: 3px solid color-mix(in srgb, var(--c-primary) 55%, transparent);
	outline-offset: 2px;
	border-radius: 4px;
}

/* Utilidades mínimas (sustituyen estilos inline repetidos) */
.u-center      { text-align: center; }
.u-justify     { text-align: justify; }
.u-stack > * + * { margin-top: var(--sp-5); }
.u-spacer      { display: block; height: var(--sp-5); }
.visually-hidden {
	position: absolute; width: 1px; height: 1px;
	padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap;
}

/* ---- Scroll-reveal (progresivo: sin JS, todo visible) ---- */
.reveal { opacity: 0; transform: translateY(22px); transition: opacity .6s ease, transform .6s cubic-bezier(.22,.61,.36,1); }
.reveal.is-visible { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after { animation-duration: .001ms !important; transition-duration: .001ms !important; }
	.reveal { opacity: 1; transform: none; }
}