/* ====================================================================
   LIBERATI · POLÍTICA DE PRIVACIDAD (page-specific styles)
   Depende de: tokens.css, nav.css
   ==================================================================== */

body{line-height:1.6}

.eyebrow{color:var(--brand-700);background:rgba(101,110,224,.10)}
.eyebrow.on-dark{background:rgba(255,255,255,.08);color:#dadaec}

/* ====================================================================
   HERO
   ==================================================================== */
.legal-hero{
  background:radial-gradient(ellipse at 50% -10%, var(--brand-200) 0%, var(--bg-2) 55%, var(--bg-2) 100%);
  padding:130px 0 56px;
  margin-top:-72px;padding-top:130px;
  text-align:center;
  position:relative;
}
.legal-hero::after{
  content:"";position:absolute;inset:auto 0 0 0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(20,20,43,.06),transparent);
}
.legal-hero .h-display{
  font-size:clamp(36px,9vw,64px);
  color:var(--brand-900);letter-spacing:-.035em;
}
.legal-hero .h-display .b{color:var(--brand-500)}
.legal-hero .lead{max-width:620px;margin:18px auto 0;color:var(--text-3);font-size:17px}
.legal-hero .updated{
  display:inline-flex;align-items:center;gap:8px;
  margin-top:22px;
  font-size:13px;font-weight:600;color:var(--brand-700);
  background:rgba(101,110,224,.10);
  padding:7px 16px;border-radius:999px;
}
.legal-hero .updated svg{width:15px;height:15px}

/* ====================================================================
   GRID: índice lateral + contenido
   ==================================================================== */
.legal-main{padding:50px 0 80px;overflow:visible}
.legal-grid{display:grid;grid-template-columns:1fr;gap:24px}

/* Índice (TOC) */
.legal-toc{display:none}
.legal-toc .toc-card{
  position:sticky;top:120px;
  background:#fff;border-radius:22px;padding:18px;
  box-shadow:var(--shadow-card);
  max-height:calc(100vh - 150px);overflow:auto;
}
.legal-toc h4{margin:0 0 12px;font-size:13px;color:var(--muted-2);letter-spacing:.06em;text-transform:uppercase;font-weight:600}
.legal-toc a{
  display:block;
  padding:9px 12px;border-radius:12px;
  font-weight:600;color:var(--brand-900);font-size:13.5px;line-height:1.4;
  transition:background .12s ease, color .12s ease;
}
.legal-toc a + a{margin-top:2px}
.legal-toc a:hover{background:#f3f3fb;color:var(--brand-500)}
.legal-toc a.active{background:var(--brand-50);color:var(--brand-500)}

/* ====================================================================
   Documento
   ==================================================================== */
.legal-doc{
  background:#fff;border-radius:22px;
  padding:26px 22px;
  box-shadow:var(--shadow-card);
}
.legal-intro{
  color:var(--text-3);font-size:15.5px;line-height:1.7;
  border-left:3px solid var(--brand-200);
  padding-left:16px;margin-bottom:8px;
}
.legal-intro strong{color:var(--brand-900);font-weight:700}

.legal-doc section{scroll-margin-top:100px;padding-top:28px}
.legal-doc section + section{border-top:1px solid var(--line)}

.legal-doc h2{
  font-family:var(--f-display);
  font-size:21px;font-weight:800;letter-spacing:-.015em;
  color:var(--brand-900);
  margin:0 0 14px;
  display:flex;align-items:baseline;gap:10px;
}
.legal-doc h2 .sec-num{
  font-family:var(--f-jakarta);font-weight:800;font-size:14px;
  color:var(--brand-300);flex:0 0 auto;
}
.legal-doc h3{
  font-size:16px;font-weight:700;color:var(--brand-700);
  margin:22px 0 8px;
}
.legal-doc p{margin:0 0 12px;color:var(--text-3);font-size:15px;line-height:1.7}
.legal-doc p:last-child{margin-bottom:0}
.legal-doc strong{color:var(--brand-900);font-weight:700}
.legal-doc a{color:var(--brand-500);font-weight:600;text-decoration:underline}
.legal-doc a:hover{color:var(--brand-700)}

.legal-doc ul,
.legal-doc ol{margin:4px 0 14px;padding-left:4px;list-style:none}
.legal-doc ol{counter-reset:item}
.legal-doc li{
  position:relative;
  padding:4px 0 4px 26px;
  color:var(--text-3);font-size:15px;line-height:1.65;
}
.legal-doc ul > li::before{
  content:"";position:absolute;left:4px;top:13px;
  width:7px;height:7px;border-radius:50%;
  background:var(--brand-300);
}
.legal-doc ol > li{counter-increment:item;padding-left:34px}
.legal-doc ol > li::before{
  content:counter(item);position:absolute;left:0;top:5px;
  width:22px;height:22px;border-radius:7px;
  background:var(--brand-50);color:var(--brand-500);
  font-size:12px;font-weight:800;
  display:grid;place-items:center;
}
.legal-doc li strong{color:var(--brand-900)}

/* sub-listas (o) */
.legal-doc li ul{margin:8px 0 4px}
.legal-doc li ul > li::before{background:var(--brand-200)}

/* Tarjeta de contacto del responsable */
.legal-contact-card{
  background:var(--brand-50);
  border:1px solid rgba(101,110,224,.16);
  border-radius:16px;
  padding:18px 20px;
  margin-top:4px;
}
.legal-contact-card p{margin:0 0 6px;color:var(--brand-900);font-size:15px}
.legal-contact-card p:last-child{margin-bottom:0}
.legal-contact-card .label{color:var(--muted);font-weight:600;font-size:13px}

/* Aviso destacado */
.legal-note{
  background:#f8f8fd;
  border:1px solid var(--line);
  border-radius:14px;
  padding:14px 16px;
  margin:6px 0 14px;
  font-size:14.5px;color:var(--text-3);
}
.legal-note strong{color:var(--brand-900)}

/* ====================================================================
   FOOTER reducido
   ==================================================================== */
.s-footer{background:var(--ink-900);color:#fff;padding:48px 0 28px;position:relative;overflow:hidden}

/* ====================================================================
   DESKTOP (≥ 1000px)
   ==================================================================== */
@media (min-width:1000px){
  .legal-hero{padding:170px 0 80px}
  .legal-hero .h-display{font-size:clamp(56px,7vw,76px)}
  .legal-hero .lead{font-size:19px}

  .legal-main{padding:64px 0 110px}
  .legal-grid{grid-template-columns:280px 1fr;gap:40px;align-items:start}
  .legal-toc{display:block}

  .legal-doc{padding:40px 44px}
  .legal-doc h2{font-size:25px}
  .legal-doc section{padding-top:36px}
}

/* === entrance polish === */
@media (prefers-reduced-motion:no-preference){
  .legal-doc{
    opacity:0;transform:translateY(14px);
    animation:rise .55s ease forwards;
  }
  @keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
}