/* Hoja de estilo de las páginas legales.
   La portada lleva su CSS en línea porque es una sola página; las legales son
   tres y comparten esta hoja. Mismos tokens y mismas fuentes que index.html:
   si cambia la marca allí, hay que tocar los dos sitios. */

@font-face { font-family:'Bricolage Grotesque'; font-style:normal; font-weight:700; font-display:swap;
             src:url(/fonts/BricolageGrotesque-700-latin.woff2) format('woff2'); }
@font-face { font-family:'Hanken Grotesk'; font-style:normal; font-weight:100 900; font-display:swap;
             src:url(/fonts/HankenGrotesk-400-latin.woff2) format('woff2'); }
@font-face { font-family:'JetBrains Mono'; font-style:normal; font-weight:400 800; font-display:swap;
             src:url(/fonts/JetBrainsMono-400-latin.woff2) format('woff2'); }
@font-face { font-family:'Bricolage fallback'; src:local('Helvetica Neue'),local('Arial');
             size-adjust:98%; ascent-override:94%; descent-override:24%; line-gap-override:0%; }

:root{
  --tg-green:#2F9E54; --tg-deep:#0E5A3C; --tg-lime:#6FBE5A; --tg-teal:#1FB6A6;
  --tg-forest:#0F2E1D; --tg-cream:#F7F5EF;
  --tg-grad:linear-gradient(90deg,#0E5A3C,#2F9E54,#6FBE5A,#1FB6A6);
  --bg:#0b2416;
  --line:rgba(255,255,255,.12); --line-soft:rgba(255,255,255,.07);
  --txt:#eef3ef; --txt-mut:#b3c4b8; --txt-faint:#98b0a1;
  --shell:1200px; --doc:72ch;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0; background:var(--bg); color:var(--txt); font-size:17px; line-height:1.7;
  font-family:'Hanken Grotesk',system-ui,-apple-system,'Segoe UI',sans-serif;
  -webkit-font-smoothing:antialiased;
  background-image:
    radial-gradient(900px 540px at 10% -12%, rgba(47,158,84,.28), transparent 62%),
    radial-gradient(760px 470px at 96% 0%, rgba(31,182,166,.18), transparent 60%);
  background-repeat:no-repeat;
}
.shell{ width:min(100% - 2.5rem, var(--shell)); margin-inline:auto; }
.mono{ font-family:'JetBrains Mono',ui-monospace,monospace; }
a{ color:inherit; }
:focus-visible{ outline:3px solid var(--tg-lime); outline-offset:3px; border-radius:6px; }
img,svg{ max-width:100%; }

/* Cabecera: marca y vuelta a la portada, sin el menú de la home. */
header.nav{ border-bottom:1px solid var(--line-soft); padding:1.1rem 0; }
.nav-in{ display:flex; align-items:center; justify-content:space-between; gap:1.5rem; }
.brand{ display:flex; align-items:center; gap:.7rem; text-decoration:none; }
.brand .wm{ font-family:'Bricolage Grotesque','Bricolage fallback',system-ui,sans-serif;
            font-weight:700; letter-spacing:-.02em; font-size:1.15rem; }
.volver{ font-size:.9rem; color:var(--txt-mut); text-decoration:none; }
.volver:hover{ color:var(--txt); }

/* Documento */
main.doc{ width:min(100% - 2.5rem, var(--doc)); margin:clamp(2.5rem,6vw,4.5rem) auto clamp(3rem,8vw,6rem); }
.doc h1{ font-family:'Bricolage Grotesque','Bricolage fallback',system-ui,sans-serif; font-weight:700;
         letter-spacing:-.03em; line-height:1.1; font-size:clamp(2rem,5vw,2.8rem); margin:0 0 .6rem; }
.doc h2{ font-family:'Bricolage Grotesque','Bricolage fallback',system-ui,sans-serif; font-weight:700;
         letter-spacing:-.02em; line-height:1.2; font-size:clamp(1.25rem,2.6vw,1.5rem);
         margin:2.6rem 0 .9rem; padding-top:1.6rem; border-top:1px solid var(--line-soft); }
.doc h2:first-of-type{ border-top:0; padding-top:0; }
.doc h3{ font-family:'Bricolage Grotesque','Bricolage fallback',system-ui,sans-serif; font-weight:700;
         font-size:1.05rem; margin:1.8rem 0 .5rem; color:var(--tg-lime); }
.doc p{ margin:0 0 1.1rem; color:var(--txt-mut); }
.doc strong{ color:var(--txt); font-weight:600; }
.doc ul,.doc ol{ margin:0 0 1.2rem; padding-left:1.25rem; color:var(--txt-mut); }
.doc li{ margin-bottom:.5rem; }
.doc li::marker{ color:var(--tg-green); }
.doc a{ color:var(--tg-lime); text-underline-offset:.2em; }
.doc code{ font-family:'JetBrains Mono',ui-monospace,monospace; font-size:.9em;
           background:rgba(255,255,255,.06); padding:.12em .4em; border-radius:5px; }
.doc hr{ border:0; border-top:1px solid var(--line-soft); margin:2.4rem 0; }
.doc blockquote{ margin:0 0 1.2rem; padding:.2rem 0 .2rem 1.1rem; border-left:2px solid var(--tg-green);
                 color:var(--txt-mut); }

/* La fecha de actualización, justo bajo el título */
.doc .fecha{ font-family:'JetBrains Mono',ui-monospace,monospace; font-size:.8rem;
             color:var(--txt-faint); letter-spacing:.02em; margin-bottom:2.4rem; }

/* Tablas (bases jurídicas) */
.doc table{ width:100%; border-collapse:collapse; margin:0 0 1.4rem; font-size:.95rem; }
.doc th,.doc td{ text-align:left; vertical-align:top; padding:.7rem .8rem;
                 border-bottom:1px solid var(--line-soft); color:var(--txt-mut); }
.doc th{ color:var(--txt); font-weight:600; border-bottom-color:var(--line); }
@media (max-width:640px){
  .doc table,.doc thead,.doc tbody,.doc tr,.doc th,.doc td{ display:block; }
  .doc thead{ display:none; }
  .doc td{ border-bottom:0; padding:.2rem 0; }
  .doc tr{ border-bottom:1px solid var(--line-soft); padding:.8rem 0; }
}

/* Pie: mismo que la portada, más los enlaces legales */
footer.site{ border-top:1px solid var(--line-soft); padding:2.6rem 0 3.4rem; }
.foot-in{ display:flex; justify-content:space-between; gap:1.5rem; flex-wrap:wrap;
          font-size:.85rem; color:var(--txt-faint); align-items:center; }
.foot-brand{ display:flex; align-items:center; gap:.7rem; }
.foot-legal{ display:flex; gap:1.2rem; flex-wrap:wrap; }
.foot-legal a{ color:var(--txt-faint); text-decoration:none; }
.foot-legal a:hover{ color:var(--txt); }
.foot-legal a[aria-current="page"]{ color:var(--tg-lime); }
