/* ===========================================================================
   Estilos de las páginas legales.
   Van en un archivo aparte y no inline como el index: son dos páginas que
   comparten todo, y el día que haya que tocar un color no queremos buscarlo
   en dos lugares.
   =========================================================================== */

@font-face {
  font-family: "Neufreit";
  src: url('fuentes/neufreit-extrabold.woff2') format('woff2'),
       url('fuentes/neufreit-extrabold.woff')  format('woff');
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}

:root{
  --bordo:#8B1E3F;
  --rosa:#FBE7EE;
  --durazno:#E7B999;
  --bordo-hondo:#5A2233;
  --bordo-suave:#F3D3DD;
  --blanco:#FFFFFF;
  --apagado:#8A6472;
  --display:"Neufreit","Quicksand",system-ui,sans-serif;
  --texto:"Quicksand",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--rosa);
  color:var(--bordo-hondo);
  font-family:var(--texto);
  font-size:17px;font-weight:500;line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}

.envoltorio{max-width:760px;margin:0 auto;padding:0 22px}

header{border-bottom:1px solid var(--bordo-suave);background:var(--rosa)}
.barra{display:flex;align-items:center;gap:10px;padding:14px 0;text-decoration:none}
.barra img{width:38px;height:38px}
.barra span{
  font-family:var(--display);font-weight:800;font-size:18px;
  letter-spacing:.5px;color:var(--bordo);
}

main{padding:44px 0 20px}

h1{
  font-family:var(--display);font-weight:800;
  font-size:clamp(30px,5.5vw,42px);line-height:1.1;
  letter-spacing:-1px;margin:0 0 10px;color:var(--bordo);
}
.actualizado{font-size:14.5px;color:var(--apagado);margin:0 0 34px}

h2{
  font-family:var(--display);font-weight:800;
  font-size:clamp(20px,3.4vw,25px);letter-spacing:-.4px;
  margin:38px 0 10px;color:var(--bordo);
}
h3{
  font-family:var(--texto);font-weight:700;font-size:17.5px;
  margin:24px 0 6px;color:var(--bordo-hondo);
}
p{margin:0 0 14px}
ul{margin:0 0 16px;padding-left:20px}
li{margin-bottom:8px}
a{color:var(--bordo)}
strong{font-weight:700;color:var(--bordo-hondo)}

/* El bloque de la cláusula que la Resolución 14/2018 obliga a reproducir
   literal. Se destaca para que se vea que es texto de ley y no nuestro. */
.legal-literal{
  background:var(--blanco);
  border-left:4px solid var(--bordo);
  border-radius:0 14px 14px 0;
  padding:18px 20px;
  margin:0 0 18px;
  font-size:15.5px;
  line-height:1.6;
}

.tarjeta{
  background:var(--blanco);border:1px solid var(--bordo-suave);
  border-radius:18px;padding:20px 22px;margin:0 0 18px;
}
.tarjeta p:last-child, .tarjeta ul:last-child{margin-bottom:0}

.pendiente{
  background:#F9EFD8;border:1px solid #E7B999;
  border-radius:14px;padding:16px 18px;margin:0 0 18px;
  font-size:15.5px;
}

table{border-collapse:collapse;width:100%;margin:0 0 18px;font-size:15.5px}
th,td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--bordo-suave);vertical-align:top}
th{font-weight:700;color:var(--bordo)}

footer{border-top:1px solid var(--bordo-suave);padding:30px 0 40px;margin-top:44px}
.pie{display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;align-items:center;font-size:14.5px}
.pie a{color:var(--bordo);text-decoration:none;font-weight:700}
.pie a:hover{text-decoration:underline}
.pie .legal{color:var(--apagado);font-weight:500}
.enlaces{display:flex;gap:20px;flex-wrap:wrap}