/* Sistema de estilos compartido — spreso.co
   Fuente única de verdad para tokens y componentes de marca (logo, botones,
   eyebrow, ícono WhatsApp, nav, tipografía base). Lo usan index.html, insights/,
   terminos.html y privacidad.html. El layout específico de cada página vive en su propio <style>. */

:root{
  --brand:#1E3A5F; --brand-2:#16304f; --accent:#F97316; --secondary:#0D9488;
  --success:#16A34A; --error:#DC2626; --warning:#F59E0B; --info:#00B7CD;
  --surface:#F8FAFC; --slate:#334155; --muted:#64748B; --line:#E2E8F0;
  --sans:'Inter',system-ui,sans-serif; --serif:'Fraunces',Georgia,serif; --mono:'IBM Plex Mono',monospace;
}

*{box-sizing:border-box}
body{margin:0;font-family:var(--sans);color:var(--slate);background:#fff;line-height:1.6}
h1,h2,h3{font-family:var(--serif);color:var(--brand);letter-spacing:-.01em;margin:0}
p{margin:0}
a{color:inherit}

.wrap{max-width:1080px;margin:0 auto;padding:0 24px}

/* Marca */
.logo{display:inline-flex;align-items:center;gap:6px;font-family:var(--serif);font-weight:600;font-size:24px;color:var(--brand);text-decoration:none}
.logo .ia{color:var(--accent)}
.logo .mark{height:1.15em;width:auto;flex:0 0 auto;fill:var(--accent);position:relative;top:1px}
.eyebrow{font-family:var(--sans);font-weight:600;font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent)}

/* Botones */
.btn{display:inline-flex;align-items:center;gap:9px;background:var(--accent);color:#fff;font-weight:600;font-size:15px;padding:13px 22px;border-radius:10px;text-decoration:none;box-shadow:0 6px 16px color-mix(in srgb, var(--accent) 25%, transparent)}
.btn.ghost{background:transparent;color:var(--accent);box-shadow:none;border:1px solid var(--accent)}
.btn.lg{padding:16px 28px;font-size:16px}

/* Ícono (WhatsApp / genéricos) */
.wa{width:18px;height:18px;flex:0 0 18px;fill:currentColor}
.btn.lg .wa{width:20px;height:20px;flex-basis:20px}

/* Nav compartido (index, insights, términos, privacidad) */
nav{position:sticky;top:0;z-index:10;background:rgba(255,255,255,.9);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
nav .wrap{display:flex;align-items:center;gap:24px;height:64px}
nav .links{display:flex;gap:22px;margin-left:12px;font-size:14px;font-weight:500}
nav .links a{color:var(--slate);text-decoration:none}
nav .cta{margin-left:auto}
@media(max-width:760px){nav .links{display:none}}
/* acceso discreto para clientes: texto gris, sin aspecto de botón */
nav .nav-login{font-size:13px;color:#94A3B8;text-decoration:none;white-space:nowrap}
nav .nav-login:hover{color:var(--slate)}

/* Enlaces sociales del footer (icono + etiqueta) */
.slink{display:flex;align-items:center;gap:8px}
.slink .sico{width:16px;height:16px;flex:0 0 16px;fill:currentColor}
/* Hover unificado para todos los links del footer */
footer a{transition:color .15s ease}
footer a:hover{color:var(--accent)}