/* ==========================================================================
   TOZUK AGENCY — páginas legales
   Misma identidad que la portada, sin animaciones ni adornos: aquí lo que
   importa es que el texto se lea bien y se encuentre rápido.
   ========================================================================== */

:root{
  color-scheme: dark;

  --ground:      #060911;
  --ground-2:    #080d18;
  --surface:     #0d1424;

  --ice-bright:  #a9c8ee;
  --ice:         #7ea6d8;
  --ice-deep:    #5f8fc9;

  --white:       #eef3fa;
  --text:        #c5cfde;
  --muted:       #8c98ac;
  --dim:         #78839a;

  --border:        rgba(126,166,216,.13);
  --border-strong: rgba(126,166,216,.30);

  --display: 'Sora', system-ui, -apple-system, sans-serif;
  --body:    'Instrument Sans', system-ui, -apple-system, sans-serif;
  --mono:    'JetBrains Mono', ui-monospace, monospace;

  --maxw: 760px;
  --pad: clamp(1.15rem, 4vw, 2rem);
  --radius: 14px;
  --e-out: cubic-bezier(.22,.68,.32,1);
}

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

html{ scroll-behavior:smooth; scroll-padding-top:90px; -webkit-text-size-adjust:100% }
@media (prefers-reduced-motion:reduce){ html{ scroll-behavior:auto } }

body{
  margin:0;
  background:var(--ground);
  color:var(--text);
  font-family:var(--body);
  font-size:1.0625rem;
  line-height:1.72;
  -webkit-font-smoothing:antialiased;
}

img,svg{ max-width:100%; display:block }

a{ color:var(--ice); text-decoration:underline; text-underline-offset:3px }
a:hover{ color:var(--ice-bright) }

:focus-visible{ outline:2px solid var(--ice-bright); outline-offset:3px; border-radius:4px }

.skip{
  position:absolute; left:-9999px; top:0; z-index:200;
  background:var(--ice); color:#04070e;
  padding:.8rem 1.2rem; border-radius:0 0 10px 0;
  font-weight:600; text-decoration:none;
}
.skip:focus{ left:0 }

/* ---------- cabecera ---------- */

.nav{
  position:sticky; top:0; z-index:50;
  background:rgba(6,9,17,.94);
  border-bottom:1px solid var(--border);
}
.nav-in{
  max-width:var(--maxw); margin-inline:auto;
  padding:0 var(--pad);
  height:72px;
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
}
.brand{
  display:flex; align-items:center; gap:.7rem;
  text-decoration:none; padding-block:.35rem; border-radius:8px;
}
.brand svg{ width:30px; height:30px; flex:none }
.brand span{
  font-family:var(--mono); font-weight:500;
  font-size:.86rem; letter-spacing:.32em; color:var(--white);
}
.brand b{ color:var(--ice); font-weight:700 }
.volver{
  font-family:var(--mono); font-size:.8rem;
  color:var(--muted); text-decoration:none;
  padding:.6rem .2rem;
  white-space:nowrap;
}
.volver:hover{ color:var(--ice-bright) }

/* ---------- contenido ---------- */

main{
  max-width:var(--maxw);
  margin-inline:auto;
  padding:clamp(2.5rem,7vw,4.5rem) var(--pad) clamp(3rem,8vw,5rem);
}

h1{
  font-family:var(--display); font-weight:700;
  font-size:clamp(1.9rem,1.4rem + 2.2vw,2.9rem);
  line-height:1.12; letter-spacing:-.03em;
  color:var(--white);
  margin:0 0 .85rem;
  text-wrap:balance;
}
.actualizado{
  font-family:var(--mono); font-size:.78rem;
  color:var(--dim); letter-spacing:.04em;
  margin:0 0 clamp(2rem,5vw,3rem);
  padding-bottom:clamp(2rem,5vw,3rem);
  border-bottom:1px solid var(--border);
}

h2{
  font-family:var(--display); font-weight:600;
  font-size:clamp(1.18rem,1.05rem + .6vw,1.45rem);
  line-height:1.25; letter-spacing:-.018em;
  color:var(--white);
  margin:clamp(2.4rem,5vw,3.2rem) 0 .9rem;
  scroll-margin-top:90px;
}
h2 .num{
  font-family:var(--mono); font-size:.72em; font-weight:500;
  color:var(--ice); margin-right:.55rem;
}

h3{
  font-family:var(--display); font-weight:600;
  font-size:1.02rem; color:var(--white);
  margin:1.8rem 0 .5rem;
}

p{ margin:0 0 1.1rem; text-wrap:pretty }
p:last-child{ margin-bottom:0 }

ul,ol{ margin:0 0 1.1rem; padding-left:1.35rem }
li{ margin-bottom:.55rem }
li::marker{ color:var(--ice-deep) }

strong{ color:var(--white); font-weight:600 }

/* ---------- avisos ---------- */

.aviso{
  margin:clamp(1.6rem,4vw,2.2rem) 0;
  padding:clamp(1.1rem,3vw,1.5rem);
  background:var(--surface);
  border:1px solid var(--border-strong);
  border-radius:var(--radius);
  font-size:.97rem;
}
.aviso p{ margin-bottom:.7rem }
.aviso > :last-child{ margin-bottom:0 }
.aviso b{ color:var(--ice-bright) }

/* campos que el titular debe completar antes de publicar */
.completar{
  display:inline-block;
  padding:.1rem .45rem;
  background:rgba(217,160,102,.14);
  border:1px dashed rgba(217,160,102,.5);
  border-radius:5px;
  font-family:var(--mono); font-size:.82rem;
  color:#e0ae74;
}

/* ---------- índice ---------- */

.indice{
  margin:0 0 clamp(2rem,5vw,3rem);
  padding:clamp(1.1rem,3vw,1.5rem);
  background:var(--ground-2);
  border:1px solid var(--border);
  border-radius:var(--radius);
}
.indice h2{
  margin:0 0 .8rem;
  font-family:var(--mono); font-size:.76rem; font-weight:500;
  letter-spacing:.18em; text-transform:uppercase;
  color:var(--dim);
}
.indice ol{ margin:0; padding-left:1.25rem }
.indice li{ margin-bottom:.35rem }
.indice a{ color:var(--text); text-decoration:none }
.indice a:hover{ color:var(--ice-bright); text-decoration:underline }

/* ---------- tabla ---------- */

.tabla-wrap{ overflow-x:auto; margin:0 0 1.2rem }
table{
  width:100%; border-collapse:collapse;
  font-size:.94rem;
  min-width:420px;
}
th,td{
  text-align:left;
  padding:.75rem .9rem;
  border-bottom:1px solid var(--border);
  vertical-align:top;
}
th{
  font-family:var(--mono); font-size:.76rem; font-weight:500;
  letter-spacing:.08em; text-transform:uppercase;
  color:var(--dim);
}

/* ---------- pie ---------- */

footer{
  border-top:1px solid var(--border);
  background:var(--ground-2);
}
.foot-in{
  max-width:var(--maxw); margin-inline:auto;
  padding:clamp(2rem,5vw,3rem) var(--pad);
  display:flex; flex-wrap:wrap; gap:1rem;
  align-items:center; justify-content:space-between;
  font-family:var(--mono); font-size:.78rem;
  color:var(--dim);
}
.foot-in nav{ display:flex; flex-wrap:wrap; gap:1.25rem }
.foot-in a{ color:var(--muted); text-decoration:none; padding-block:.7rem }
.foot-in a:hover{ color:var(--ice-bright) }

/* ---------- migas de pan ---------- */

.migas{
  max-width:var(--maxw); margin-inline:auto;
  padding:1.1rem var(--pad) 0;
  font-family:var(--mono); font-size:.78rem;
  color:var(--dim);
}
.migas ol{
  list-style:none; margin:0; padding:0;
  display:flex; flex-wrap:wrap; align-items:center; gap:.5rem;
}
.migas li{ margin:0; display:flex; align-items:center; gap:.5rem }
.migas li+li::before{ content:"/"; color:var(--ice-deep) }
.migas a{ color:var(--muted); text-decoration:none; padding-block:.45rem }
.migas a:hover{ color:var(--ice-bright); text-decoration:underline }
.migas [aria-current]{ color:var(--white) }

/* Reemplaza style="position:absolute" del sprite SVG (CSP sin estilos en linea) */
.abs{ position:absolute }