/* Estilos de las páginas legales (aviso legal, privacidad, cookies).
   Comparten tipografías y color con la web principal (src/index.css)
   para que no parezcan otra web. */

@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('/fonts/manrope-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Schibsted Grotesk';
  font-style: normal;
  font-weight: 500 800;
  font-display: swap;
  src: url('/fonts/schibsted-grotesk-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  --primary:#1f5fd6; --primary-dark:#143f9e; --primary-soft:#eaf1fd;
  --ink:#0d1b33; --ink-2:#2a3a57; --muted:#5a6a85; --line:#e3e9f2; --surface:#f4f7fc; --bg:#fff;
  --font-head:'Schibsted Grotesk', system-ui, sans-serif;
  --font-body:'Manrope', system-ui, sans-serif;
}
* { box-sizing:border-box; }
body {
  margin:0;
  font-family:var(--font-body);
  color:var(--ink-2);
  line-height:1.7;
  background:var(--bg);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
.wrap { max-width:820px; margin:0 auto; padding:44px 22px 90px; }

/* Barra superior de marca (igual estilo que el blog) */
header.bar { border-bottom:1px solid var(--line); position:sticky; top:0; background:color-mix(in oklab, #fff 82%, transparent); backdrop-filter:saturate(160%) blur(14px); z-index:10; }
header.bar .wrap { max-width:960px; padding:14px 22px; display:flex; align-items:center; gap:12px; }
header.bar img { width:42px; height:42px; object-fit:contain; }
header.bar span { font-family:var(--font-head); font-weight:700; font-size:17px; color:var(--ink); letter-spacing:-0.01em; }
header.bar b { color:var(--primary-dark); }

h1, h2, h3 { font-family:var(--font-head); color:var(--ink); letter-spacing:-0.02em; line-height:1.12; text-wrap:balance; }
h1 { font-size:clamp(1.9rem,4vw,2.5rem); margin:0 0 8px; }
h2 { font-size:1.35rem; margin:38px 0 10px; letter-spacing:-0.01em; }
p, li { color:var(--ink-2); }
li { margin:4px 0; }
.muted { color:var(--muted); font-size:.95rem; }
a { color:var(--primary-dark); text-decoration:underline; text-underline-offset:2px; }
a:hover { color:var(--primary); }

/* Recuadro de aviso (usado en algunas páginas) */
.todo { background:#fff7e6; border:1px solid #ffe1a6; border-radius:10px; padding:2px 8px; font-size:.9rem; color:#8a5a00; }

/* Tablas (política de privacidad) */
table { border-collapse:collapse; width:100%; margin:14px 0; font-size:.95rem; }
th, td { border:1px solid var(--line); padding:10px 12px; text-align:left; vertical-align:top; }
th { background:var(--surface); font-family:var(--font-head); font-weight:700; color:var(--ink); }

/* Navegación inferior */
nav.legal { margin-top:52px; padding-top:22px; border-top:1px solid var(--line); font-size:.95rem; display:flex; flex-wrap:wrap; gap:8px 20px; }
nav.legal a { color:var(--muted); text-decoration:none; font-weight:600; }
nav.legal a:hover { color:var(--primary-dark); }

/* Foco visible para navegación por teclado */
a:focus-visible {
  outline:3px solid color-mix(in oklab, var(--primary) 55%, transparent);
  outline-offset:2px; border-radius:6px;
}
