/* Páginas legales de ProEXP: aviso legal, privacidad y cookies.
   Hoja propia; no depende de estilos.css. Fondo claro para que el logo
   (marino + turquesa) se lea sin recolorearlo. */

/* Tipografías alojadas en /fonts/ (WOFF2 variables, OFL 1.1, de @fontsource-variable 5.3.0).
   Solo los subconjuntos latin y latin-ext; el navegador descarga cada uno
   únicamente si la página usa caracteres de su unicode-range. */

@font-face {
  font-family: "Funnel Display";
  font-style: normal;
  font-weight: 300 800;
  font-display: swap;
  src: url("fonts/funnel-display-latin-wght-normal.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: "Funnel Display";
  font-style: normal;
  font-weight: 300 800;
  font-display: swap;
  src: url("fonts/funnel-display-latin-ext-wght-normal.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: "Funnel Sans";
  font-style: normal;
  font-weight: 300 800;
  font-display: swap;
  src: url("fonts/funnel-sans-latin-wght-normal.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: "Funnel Sans";
  font-style: normal;
  font-weight: 300 800;
  font-display: swap;
  src: url("fonts/funnel-sans-latin-ext-wght-normal.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

:root {
  --papel: #F3F7FA;
  --claro: #EEF1F5;
  --blanco: #FFFFFF;
  --tinta: #1B2538;
  --tinta-2: #4A5874;
  --linea: #C3CFDB;
  --enlace: #137A7A;          /* 4,7:1 sobre --papel */
  --enlace-hover: #0E5C5C;
  --foco: #1B9C9C;
  --coral: #F35F78;           /* solo para avisos, como en DESIGN.md */
  --aviso-fondo: #FDECEF;     /* tinte de --coral; la tinta sobre él da 14:1 */
  --pie-texto: #BCC8DC;       /* texto-2 de DESIGN.md, 9:1 sobre --tinta */

  --r-icono: 10px;
  --r-tarjeta: 14px;

  --f-display: "Funnel Display", "Funnel Sans", system-ui, sans-serif;
  --f-texto: "Funnel Sans", system-ui, sans-serif;

  --margen: clamp(16px, 4vw, 48px);
  --medida: 68ch;             /* 65–75 caracteres por línea */
  --cuerpo: 1.125rem;         /* 18 px */
}

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

html {
  background: var(--papel);
  color: var(--tinta);
  color-scheme: light;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scroll-padding-top: 24px;
}

@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }
}

body {
  margin: 0;
  background: var(--papel);
  color: var(--tinta);
  font-family: var(--f-texto);
  font-size: var(--cuerpo);
  line-height: 1.6;
  overflow-wrap: break-word;
}

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

a {
  color: var(--enlace);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.18em;
}
a:hover { color: var(--enlace-hover); text-decoration-thickness: 2px; }
a:focus-visible,
summary:focus-visible {
  outline: 3px solid var(--foco);
  outline-offset: 3px;
}

.salto {
  position: absolute;
  left: var(--margen);
  top: -100px;
  z-index: 10;
  padding: 10px 16px;
  background: var(--tinta);
  color: var(--blanco);
  border-radius: var(--r-icono);
  text-decoration: none;
}
.salto:focus, .salto:hover { top: 12px; color: var(--blanco); }

.contenedor {
  width: 100%;
  max-width: calc(var(--medida) + 2 * var(--margen));
  margin: 0 auto;
  padding: 0 var(--margen);
}

/* Cabecera */
.cab {
  background: var(--blanco);
  border-bottom: 1px solid var(--linea);
}
.cab__fila {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px 24px;
  padding-top: 16px;
  padding-bottom: 16px;
}
.cab__logo { display: inline-flex; align-items: center; min-height: 44px; }
.cab__logo img { display: block; height: 34px; width: auto; }
.cab__nav ul {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 18px;
  margin: 0;
  padding: 0;
  list-style: none;
  font-size: 1rem;
}
.cab__nav a {
  display: inline-block;
  padding: 10px 0;
  color: var(--tinta);
  text-decoration: none;
}
.cab__nav a:hover { color: var(--enlace); text-decoration: underline; }
.cab__nav a[aria-current="page"] {
  color: var(--enlace);
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 0.3em;
}

/* Aviso de borrador */
.borrador {
  margin: 28px 0 0;
  padding: 14px 18px;
  background: var(--aviso-fondo);
  border: 2px solid var(--coral);
  border-radius: var(--r-icono);
  color: var(--tinta);
  font-size: 1rem;
  line-height: 1.5;
}
.borrador strong { display: block; font-size: 1.0625rem; }
.borrador p { margin: 4px 0 0; }

/* Contenido */
main { padding-bottom: 64px; }

h1, h2, h3 {
  font-family: var(--f-display);
  line-height: 1.2;
  color: var(--tinta);
  text-wrap: balance;
}
h1 {
  margin: 36px 0 8px;
  font-size: clamp(2rem, 1.4rem + 2.4vw, 2.75rem);
  font-weight: 700;
  letter-spacing: -0.01em;
}
h2 {
  margin: 56px 0 12px;
  padding-top: 8px;
  font-size: clamp(1.375rem, 1.2rem + 0.8vw, 1.625rem);
  font-weight: 650;
}
h3 {
  margin: 32px 0 8px;
  font-size: 1.1875rem;
  font-weight: 650;
}

p, ul, ol, dl { margin: 0 0 16px; }
ul, ol { padding-left: 1.4em; }
li { margin-bottom: 6px; }
li::marker { color: var(--tinta-2); }

.fecha { margin: 0 0 24px; color: var(--tinta-2); font-size: 1rem; }
.entrada { font-size: 1.1875rem; }

/* Índice */
.indice {
  margin: 32px 0 0;
  padding: 20px 22px 8px;
  background: var(--blanco);
  border: 1px solid var(--linea);
  border-radius: var(--r-tarjeta);
}
.indice h2 {
  margin: 0 0 10px;
  padding: 0;
  font-size: 1.125rem;
}
.indice ol { padding-left: 1.5em; font-size: 1.0625rem; }
.indice a { display: inline-block; padding: 3px 0; }

/* Resumen y fichas: lista de definiciones en dos columnas que se apila en móvil */
.ficha {
  margin: 0 0 20px;
  border: 1px solid var(--linea);
  border-radius: var(--r-tarjeta);
  background: var(--blanco);
}
.ficha > div {
  padding: 14px 18px;
  border-top: 1px solid var(--linea);
}
.ficha > div:first-child { border-top: 0; }
.ficha dt { font-weight: 650; }
.ficha dd { margin: 2px 0 0; }
@media (min-width: 640px) {
  .ficha > div {
    display: grid;
    grid-template-columns: 11rem 1fr;
    gap: 16px;
  }
  .ficha dd { margin: 0; }
}

/* Huecos pendientes: visibles a propósito */
.pendiente {
  background: var(--aviso-fondo);
  color: var(--tinta);
  padding: 0.05em 0.3em;
  border-bottom: 2px solid var(--coral);
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
  font-weight: 600;
}

.nota {
  padding: 12px 16px;
  background: var(--claro);
  border-radius: var(--r-icono);
  font-size: 1.0625rem;
}

.volver {
  margin-top: 48px;
  padding-top: 24px;
  border-top: 1px solid var(--linea);
  font-size: 1.0625rem;
}

/* Pie */
.pie {
  background: var(--tinta);
  color: var(--pie-texto);
  font-size: 0.9375rem;
  line-height: 1.5;
}
.pie__fila { padding-top: 28px; padding-bottom: 28px; }
.pie p { margin: 0 0 12px; }
.pie ul {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 20px;
  margin: 0 0 12px;
  padding: 0;
  list-style: none;
}
.pie li { margin: 0; }
.pie a {
  display: inline-block;
  padding: 8px 0;
  color: var(--blanco);
}
.pie a:hover { color: var(--blanco); text-decoration-thickness: 2px; }
.pie a:focus-visible { outline-color: #19ECDD; }
.pie a[aria-current="page"] { text-decoration-thickness: 2px; }

@media print {
  .cab__nav, .salto, .indice, .pie ul { display: none; }
  body, html { background: #FFFFFF; }
  a { color: inherit; }
}