/* ============================================================
   Club Valle Nivequetén — páginas legales (/terminos y /privacidad)
   Se carga DESPUÉS de style.css y sólo agrega el maquetado del
   documento: no pisa nada del sitio principal.
   Reglas de la casa que aplican también acá:
     · Prohibido style="" y <script> en línea (la CSP los bloquea).
     · Este archivo se cachea 1 hora → enlazarlo con ?v=fecha.
   ============================================================ */

/* ---------- Barra superior sobria (sin menú ni idioma) ---------- */
.legal-nav{
  position:sticky;top:0;z-index:60;
  background:rgba(6,25,26,.92);
  backdrop-filter:saturate(140%) blur(10px);
  -webkit-backdrop-filter:saturate(140%) blur(10px);
  border-bottom:1px solid var(--line-soft);
}
.legal-nav__bar{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  min-height:var(--nav-h);
}
.legal-nav .brand__mark{width:38px;height:38px;flex:none}
.legal-nav .brand__name{
  font-family:var(--ff-display);font-weight:400;
  font-size:18px;line-height:1.1;letter-spacing:-.02em;
}
.legal-nav__back{
  display:inline-flex;align-items:center;gap:8px;flex:none;
  font-size:13.5px;color:var(--muted);
  border:1px solid var(--line);border-radius:999px;
  padding:8px 15px;
  transition:color .3s,border-color .3s,background-color .3s;
}
.legal-nav__back:hover{color:var(--sand);border-color:rgba(233,164,92,.55);background:rgba(233,164,92,.07)}
.legal-nav__back svg{width:15px;height:15px;flex:none}

/* ---------- Encabezado del documento ---------- */
.doc-hero{padding-block:clamp(48px,7vw,86px) clamp(26px,3.4vw,40px)}
.doc-hero__h1{
  margin-top:14px;
  font-family:var(--ff-display);font-weight:300;
  font-size:clamp(30px,4.6vw,52px);line-height:1.06;letter-spacing:-.028em;
  text-wrap:balance;color:var(--sand);
}
.doc-hero .lede{margin-top:20px}
.doc-meta{
  margin-top:26px;display:flex;flex-wrap:wrap;gap:10px 26px;
  padding-top:20px;border-top:1px solid var(--line-soft);
}
.doc-meta div{display:flex;flex-direction:column;gap:3px}
.doc-meta span{font-size:14px;color:var(--sand)}

/* ---------- Índice ---------- */
.doc-toc{
  margin-top:34px;padding:22px clamp(18px,2.4vw,26px);
  border:1px solid var(--line);border-radius:var(--r-lg);
  background:rgba(11,41,42,.5);
}
.doc-toc ol{
  margin-top:14px;
  display:grid;grid-template-columns:1fr;gap:9px 28px;
  counter-reset:toc;
}
.doc-toc li{counter-increment:toc}
.doc-toc a{
  display:flex;gap:11px;font-size:14.5px;color:var(--muted);
  transition:color .25s;
}
.doc-toc a::before{
  content:counter(toc,decimal-leading-zero);
  font-family:var(--ff-mono);font-size:11px;letter-spacing:.1em;
  color:var(--faint);padding-top:3px;flex:none;
}
.doc-toc a:hover{color:var(--amber-hi)}
@media (min-width:720px){.doc-toc ol{grid-template-columns:1fr 1fr}}

/* ---------- Cuerpo ---------- */
.doc{padding-bottom:clamp(70px,8vw,110px)}
.doc section{
  padding-top:clamp(34px,4vw,52px);
  scroll-margin-top:calc(var(--nav-h) + 18px);
}
.doc section + section{border-top:1px solid var(--line-soft);margin-top:clamp(34px,4vw,52px)}
.doc h2{
  font-family:var(--ff-display);font-weight:400;
  font-size:clamp(21px,2.5vw,29px);line-height:1.16;letter-spacing:-.02em;
  color:var(--sand);text-wrap:balance;
}
.doc h2 .doc__num{
  display:block;
  font-family:var(--ff-mono);font-size:10.5px;letter-spacing:.17em;
  text-transform:uppercase;color:var(--faint);margin-bottom:9px;
}
.doc h3{
  margin-top:26px;
  font-family:var(--ff-text);font-weight:600;font-size:16.5px;letter-spacing:-.01em;
  color:var(--sand);
}
.doc p{margin-top:16px;max-width:70ch;font-size:15.5px;line-height:1.72;color:var(--muted)}
.doc p strong,.doc li strong{color:var(--sand);font-weight:600}
.doc a:not(.btn){color:var(--amber-hi);border-bottom:1px solid rgba(246,201,138,.32)}
.doc a:not(.btn):hover{color:var(--amber);border-color:var(--amber)}

.doc code{
  font-family:var(--ff-mono);font-size:.9em;
  padding:1px 6px;border-radius:5px;
  background:rgba(240,235,224,.07);color:var(--sand);
}

.doc ul.doc__list{margin-top:16px;max-width:70ch;display:flex;flex-direction:column;gap:11px}
.doc ul.doc__list li{
  position:relative;padding-left:20px;
  font-size:15.5px;line-height:1.65;color:var(--muted);
}
.doc ul.doc__list li::before{
  content:"";position:absolute;left:2px;top:.72em;
  width:6px;height:6px;border-radius:50%;background:var(--amber-lo);
}

/* Definiciones: dato ↔ para qué. Se vuelve tabla en pantalla ancha. */
.doc__dl{margin-top:18px;max-width:74ch;display:grid;gap:14px}
.doc__dl > div{
  display:grid;gap:4px;
  padding:14px 16px;border:1px solid var(--line-soft);border-radius:var(--r);
  background:rgba(8,32,31,.5);
}
.doc__dl dt{font-size:14px;font-weight:600;color:var(--sand)}
.doc__dl dd{margin:0;font-size:14.5px;line-height:1.6;color:var(--muted)}
@media (min-width:760px){
  .doc__dl > div{grid-template-columns:minmax(0,14rem) minmax(0,1fr);gap:4px 22px;align-items:start}
}

/* Recuadro de aviso: lo que de verdad interesa que no se pase por alto */
.doc__note{
  margin-top:22px;max-width:74ch;
  padding:18px clamp(16px,2vw,22px);
  border:1px solid rgba(233,164,92,.28);border-left-width:3px;
  border-radius:var(--r);background:rgba(233,164,92,.05);
}
.doc__note p{margin-top:0;color:var(--sand);font-size:15px}
.doc__note p + p{margin-top:12px;color:var(--muted)}

/* Cierre: cómo ejercer derechos / contactar */
.doc-cta{
  margin-top:clamp(40px,5vw,64px);
  padding:clamp(24px,3.2vw,36px);
  border:1px solid var(--line);border-radius:var(--r-lg);
  background:linear-gradient(180deg,rgba(11,41,42,.72),rgba(8,32,31,.5));
}
.doc-cta__h{
  margin-top:12px;
  font-family:var(--ff-display);font-weight:400;
  font-size:clamp(20px,2.3vw,26px);line-height:1.16;letter-spacing:-.02em;color:var(--sand);
}
.doc-cta p{margin-top:14px;max-width:64ch;font-size:15px;line-height:1.7;color:var(--muted)}
.doc-cta__row{margin-top:22px;display:flex;flex-wrap:wrap;gap:12px}

/* ---------- Pie ---------- */
.legal-foot{
  border-top:1px solid var(--line-soft);
  background:rgba(6,25,26,.86);
  padding-block:30px;
}
.legal-foot__grid{display:flex;flex-wrap:wrap;gap:14px 26px;align-items:center;justify-content:space-between}
.legal-foot__links{display:flex;flex-wrap:wrap;gap:10px 22px}
.legal-foot a{font-size:13.5px;color:var(--muted);transition:color .3s}
.legal-foot a:hover{color:var(--sand)}
.legal-foot p{font-size:12px;color:var(--faint);max-width:60ch}
.legal-foot__base{margin-top:20px;padding-top:18px;border-top:1px solid var(--line-soft);display:grid;gap:8px}
