/* Hoja compartida por el aviso legal y la política de privacidad.
   Van aparte de la home a propósito: son páginas de leer, no de vender, y
   así no arrastran los 100 KB de la portada ni su fondo animado. */

/* Tipografías servidas desde aquí, no desde Google (SIL Open Font License). */
@font-face{
  font-family:'Archivo'; font-style:normal; font-weight:400 900; font-display:swap;
  src:url(fuentes/archivo-400-900-normal.woff2) format('woff2');
}
@font-face{
  font-family:'IBM Plex Mono'; font-style:normal; font-weight:500; font-display:swap;
  src:url(fuentes/ibm-plex-mono-500-normal.woff2) format('woff2');
}

:root{
  --paper:#FAFAF8; --paper-raised:#FFFFFF; --ink:#14171A; --ink-soft:#565C62;
  --accent:#FF4B33; --accent-texto:#C2301A; --accent-soft:#FFE4DC; --line:rgba(20,23,26,0.14);
}
*{ box-sizing:border-box; }
html{ background:var(--paper); }
body{
  margin:0; color:var(--ink); background:transparent;
  font-family:'Archivo', ui-sans-serif, system-ui, sans-serif;
  -webkit-font-smoothing:antialiased;
}
a{ color:inherit; }
a:hover{ color:var(--accent); }
:focus-visible{ outline:2.5px solid var(--accent); outline-offset:3px; }

.wrap{ max-width:760px; margin:0 auto; padding:0 28px; }
header{ border-bottom:1px solid var(--line); }
.navrow{ display:flex; align-items:center; padding:20px 0; }
.lockup{
  display:flex; align-items:center; gap:11px; text-decoration:none;
  font-weight:800; font-size:21px; letter-spacing:-0.01em;
}
.lockup .mark{ width:31px; height:31px; flex:none; }
.lockup .b{ color:var(--accent); }
.lockup:hover{ color:inherit; }

main{ padding:56px 0 80px; }
.eyebrow{
  font-family:'IBM Plex Mono', monospace; font-size:12px; font-weight:500;
  letter-spacing:0.14em; text-transform:uppercase; color:var(--accent-texto);
}
h1{ margin:14px 0 0; font-weight:800; font-size:clamp(28px,4.6vw,40px); line-height:1.08; letter-spacing:-0.014em; }
.fecha{ margin:14px 0 0; font-family:'IBM Plex Mono', monospace; font-size:12.5px; color:var(--ink-soft); }
h2{
  margin:44px 0 0; font-weight:700; font-size:20px; letter-spacing:-0.004em;
  padding-top:22px; border-top:1px solid var(--line);
}
h3{ margin:26px 0 0; font-weight:700; font-size:16px; }
p, li{ font-size:16px; line-height:1.65; color:var(--ink-soft); }
p{ margin:14px 0 0; }
strong, b{ color:var(--ink); font-weight:600; }
ul{ margin:14px 0 0; padding-left:22px; }
li{ margin-top:8px; }
li::marker{ color:var(--accent); }
.datos{
  margin:18px 0 0; padding:20px 22px; border:1px solid var(--line); border-radius:14px;
  background:var(--paper-raised); list-style:none;
}
.datos li{ margin:0; padding:7px 0; font-size:15.5px; }
.datos li + li{ border-top:1px solid var(--line); }
.datos .et{
  display:block; font-family:'IBM Plex Mono', monospace; font-size:11px; font-weight:500;
  letter-spacing:0.12em; text-transform:uppercase; color:var(--ink-soft);
}
.datos .va{ color:var(--ink); font-weight:600; }

/* Los datos que faltan se marcan en coral y en mono: imposible publicarlos
   sin verlos. Se rellenan cuando estén el NIF y la dirección definitivos. */
.pendiente{
  font-family:'IBM Plex Mono', monospace; font-size:13px; font-weight:500;
  color:var(--accent); background:var(--accent-soft);
  padding:2px 7px; border-radius:5px; white-space:nowrap;
}
.aviso-borrador{
  margin-top:26px; padding:16px 18px; border:1.5px dashed var(--accent);
  border-radius:14px; background:var(--accent-soft);
}
.aviso-borrador p{ margin:0; color:var(--ink); font-size:15px; }

footer{ border-top:1px solid var(--line); padding:26px 0 40px; }
footer .wrap{ display:flex; gap:18px; flex-wrap:wrap; justify-content:space-between; }
footer p, footer a{ margin:0; font-size:13.5px; color:var(--ink-soft); }
.volver{
  display:inline-flex; align-items:center; gap:8px; margin-top:36px;
  font-family:'IBM Plex Mono', monospace; font-size:12px; font-weight:500;
  letter-spacing:0.1em; text-transform:uppercase; text-decoration:none;
}

/* Filas de "para qué / con qué base legal" y de proveedores. En vez de una
   tabla, cada fila es un bloque con el rótulo encima: se lee igual de bien en
   un móvil de 360 px, donde tres columnas no caben sin scroll lateral. */
.filas{
  margin:18px 0 0; padding:0; list-style:none; overflow:hidden;
  border:1px solid var(--line); border-radius:14px; background:var(--paper-raised);
}
.filas > li{ margin:0; padding:15px 20px; }
.filas > li + li{ border-top:1px solid var(--line); }
.filas .q{ display:block; color:var(--ink); font-weight:600; font-size:15.5px; line-height:1.45; }
.filas .r{ display:block; margin-top:5px; font-size:14.5px; line-height:1.55; }
.resumen{
  margin-top:22px; padding:16px 18px; border-left:3px solid var(--accent);
  background:var(--paper-raised); border-radius:0 10px 10px 0;
}
.resumen p{ margin:0; }