/* ───────────────────────────────────────────────────────────────
   ROAVIA · hoja de estilo de las páginas legales
   Misma paleta y tipografía que index.html, con una columna de
   lectura angosta: son documentos, no una portada.
   ─────────────────────────────────────────────────────────────── */

:root{
  --papel:#F7F9F6;
  --papel-alt:#E4EBE4;
  --tinta:#0A1F1D;
  --tinta-2:#41605C;
  --linea:#CEDBD1;

  --noche:#0B1F1E;
  --noche-2:#11302E;
  --noche-linea:rgba(255,255,255,.13);
  --noche-texto:#F2F7F6;
  --noche-suave:#9FB5B3;

  --rutas:#168685;      --rutas-txt:#0E6B6A;
  --vanlife:#FCB200;
  --seguridad:#E53935;  --seguridad-txt:#C62828;

  --sans:"Gotham","Montserrat",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  --mano:"Mynerve","Bradley Hand",cursive;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0; background:var(--papel); color:var(--tinta);
  font-family:var(--sans); font-size:17px; line-height:1.68;
  -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; display:block; }
a{ color:var(--rutas-txt); text-decoration:underline; text-underline-offset:3px;
   text-decoration-thickness:1px; text-decoration-color:rgba(14,107,106,.4); }
a:hover{ text-decoration-color:currentColor; }
:focus-visible{ outline:3px solid var(--rutas); outline-offset:3px; border-radius:6px; }

.envoltorio{ width:100%; max-width:1180px; margin:0 auto; padding:0 24px; }

/* ── Barra ────────────────────────────────────────────────────── */
header{
  position:sticky; top:0; z-index:20;
  background:rgba(247,249,246,.92); backdrop-filter:blur(14px);
  border-bottom:1px solid var(--linea);
}
.barra{ display:flex; align-items:center; justify-content:space-between; gap:24px; height:84px; }
.barra .marca img{ height:36px; width:auto; }
.enlaces-barra{ display:flex; align-items:center; gap:26px; font-size:.92rem; font-weight:600; }
.enlaces-barra a{ color:var(--tinta-2); text-decoration:none; transition:color .2s ease; }
.enlaces-barra a:hover{ color:var(--tinta); }
.enlaces-barra a[aria-current="page"]{ color:var(--tinta); }
.volver{
  display:inline-flex; align-items:center; gap:8px;
  padding:11px 20px; border-radius:999px; font-weight:700; font-size:.92rem;
  background:var(--tinta); color:var(--noche-texto); text-decoration:none;
  transition:background .2s ease, transform .15s ease;
}
.volver:hover{ background:#16403D; transform:translateY(-2px); }
.volver svg{ width:15px; height:15px; }

/* ── Documento ────────────────────────────────────────────────── */
main{ max-width:46rem; margin:0 auto; padding:clamp(44px,6vw,76px) 24px clamp(64px,8vw,104px); }

.migas{ font-size:.86rem; color:var(--tinta-2); margin:0 0 26px; }
.migas a{ color:var(--tinta-2); }

h1{
  font-size:clamp(2.1rem,4.4vw,3rem); font-weight:800; line-height:1.1;
  letter-spacing:-.03em; margin:0 0 10px; text-wrap:balance;
}
h2{
  font-size:clamp(1.2rem,2vw,1.4rem); font-weight:800; line-height:1.25;
  letter-spacing:-.015em; color:var(--tinta);
  margin:3rem 0 .85rem; padding-top:1.6rem; border-top:1px solid var(--linea);
}
/* el primer h2 después de la entradilla no necesita la línea */
.entradilla + h2{ border-top:0; padding-top:0; margin-top:2.4rem; }

p{ margin:0 0 1.05rem; }
p:last-child{ margin-bottom:0; }
.fecha{ color:var(--tinta-2); font-size:.9rem; margin:0 0 2rem; }
.entradilla{ font-size:1.1rem; color:var(--tinta-2); }

ul{ padding-left:1.15rem; margin:0 0 1.05rem; }
li{ margin:.5rem 0; }
li::marker{ color:var(--rutas); }
strong{ font-weight:700; color:var(--tinta); }

/* ── Tabla ────────────────────────────────────────────────────── */
.tabla{ overflow-x:auto; margin:1.4rem 0 1.6rem; }
table{ width:100%; min-width:34rem; border-collapse:collapse; font-size:.95rem; background:#fff;
       border:1px solid var(--linea); border-radius:14px; overflow:hidden; }
th, td{ text-align:left; padding:.8rem .9rem; border-bottom:1px solid var(--linea); vertical-align:top; }
tr:last-child td{ border-bottom:0; }
th{ color:var(--tinta-2); font-weight:700; font-size:.78rem; letter-spacing:.09em;
    text-transform:uppercase; background:var(--papel-alt); }
td:last-child{ white-space:nowrap; color:var(--tinta-2); }

.pista-tabla{ display:none; font-size:.82rem; color:var(--tinta-2); margin:-.9rem 0 1.6rem; }

/* ── Soporte ──────────────────────────────────────────────────── */
h3{
  font-size:1.02rem; font-weight:700; line-height:1.35; letter-spacing:-.005em;
  color:var(--tinta); margin:1.9rem 0 .5rem;
}
h2 + h3{ margin-top:1.2rem; }

.contacto{
  display:grid; grid-template-columns:auto minmax(0,1fr); gap:28px; align-items:center;
  background:#fff; border:1px solid var(--linea); border-left:4px solid var(--rutas);
  border-radius:16px; padding:24px 28px; margin:2.2rem 0 2.6rem;
  box-shadow:0 2px 0 rgba(10,31,29,.03);
}
.contacto h3{ margin:0 0 4px; font-size:.76rem; letter-spacing:.14em; text-transform:uppercase; color:var(--tinta-2); }
.contacto > div p{ margin:0; font-size:1.12rem; font-weight:700; }
.contacto ul{ margin:0; padding:0; list-style:none; display:grid; gap:7px; font-size:.9rem; color:var(--tinta-2); }
.contacto li{ margin:0; padding-left:16px; position:relative; }
.contacto li::before{ content:""; position:absolute; left:0; top:.62em; width:6px; height:6px; border-radius:50%; background:var(--rutas); }

/* ── Bloque destacado ─────────────────────────────────────────── */
.destacado{
  background:#fff; border:1px solid var(--linea); border-left:4px solid var(--seguridad);
  border-radius:16px; padding:26px 28px; margin:2.4rem 0;
  box-shadow:0 2px 0 rgba(10,31,29,.03);
}
.destacado h2{ border-top:0; padding-top:0; margin:0 0 .85rem; color:var(--seguridad-txt); }
.destacado > *:last-child{ margin-bottom:0; }

/* ── Pie ──────────────────────────────────────────────────────── */
footer{ background:var(--noche-2); color:var(--noche-texto); padding:52px 0 40px; margin-top:clamp(56px,7vw,90px); }
.pie{ display:flex; justify-content:space-between; align-items:flex-start; gap:36px; flex-wrap:wrap; }
.pie img{ height:32px; width:auto; margin-bottom:14px; }
.pie .lema{ font-family:var(--mano); color:var(--vanlife); font-size:1.2rem; }
.pie h4{ margin:0 0 14px; font-size:.74rem; letter-spacing:.15em; text-transform:uppercase;
         color:var(--noche-suave); font-weight:800; }
.pie ul{ list-style:none; margin:0; padding:0; display:grid; gap:11px; font-size:.94rem; }
.pie li{ margin:0; }
.pie a{ color:var(--noche-texto); text-decoration:none; }
.pie a:hover{ color:var(--vanlife); }
.pie-base{
  margin-top:44px; padding-top:22px; border-top:1px solid var(--noche-linea);
  display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap;
  font-size:.85rem; color:var(--noche-suave);
}

@media (max-width:720px){
  body{ font-size:16px; }
  .barra{ height:76px; }
  .barra .marca img{ height:30px; }
  .enlaces-barra{ display:none; }
  .destacado{ padding:22px 20px; }
  .contacto{ grid-template-columns:minmax(0,1fr); gap:16px; padding:22px 20px; }
  .pista-tabla{ display:block; }
  .pie{ gap:28px; }
}
@media (prefers-reduced-motion:reduce){
  *{ transition:none !important; }
  html{ scroll-behavior:auto; }
}