/* ============================================================
   ARCORE — Legal / document pages (dark theme)
   Reuses tokens.css (buttons, eyebrow, badges) + dark.css (nav, footer).
   Adds: legal hero, breadcrumb, TOC sidebar, article typography,
   tables, callouts, "aviso" box, chips, summary cards.
   ============================================================ */

/* ---------------- HERO ---------------- */
.legal-hero{position:relative;overflow:hidden;border-bottom:1px solid var(--slate)}
.legal-hero .phero-glow{position:absolute;inset:0;pointer-events:none;background:
  radial-gradient(620px 420px at 80% -10%,rgba(var(--accent-rgb),.16),transparent 62%),
  radial-gradient(560px 420px at 0% 120%,rgba(var(--accent-rgb),.07),transparent 64%)}
body[data-motion="on"] .legal-hero .phero-glow{animation:breathe 12s ease-in-out infinite}
.legal-hero .wrap{position:relative;z-index:1;padding-top:54px;padding-bottom:46px}

/* breadcrumb */
.crumb{display:flex;align-items:center;gap:9px;font-family:var(--ff-corecap);
  font-size:12px;letter-spacing:.04em;color:var(--mist);margin-bottom:26px;flex-wrap:wrap}
.crumb a{color:var(--mist);transition:color .2s var(--ease)}
.crumb a:hover{color:var(--gold)}
.crumb .sep{color:var(--steel)}
.crumb .here{color:var(--fog)}

.legal-hero h1{font-size:clamp(30px,4.4vw,46px);line-height:1.06;margin-top:14px;max-width:20ch}
.legal-meta{margin-top:18px;font-family:var(--ff-corecap);font-size:12.5px;
  color:var(--mist);line-height:1.9;letter-spacing:.01em}
.legal-meta strong{color:var(--fog);font-weight:700}
.legal-meta .pipe{color:var(--steel);margin:0 8px}

/* ---------------- BODY LAYOUT ---------------- */
.legal-body{padding:48px 0 96px}
.legal-layout{display:grid;grid-template-columns:248px minmax(0,1fr);gap:56px;align-items:start}
.legal-layout.no-toc{grid-template-columns:minmax(0,1fr);max-width:820px}

/* ---------------- TOC ---------------- */
.toc{position:sticky;top:92px;align-self:start;border:1px solid var(--slate);
  border-radius:var(--r-card);padding:20px 22px;background:var(--carbon);
  max-height:calc(100vh - 120px);overflow:auto}
.toc h2{font-family:var(--ff-corecap);font-size:11px;text-transform:uppercase;
  letter-spacing:2px;color:var(--gold);margin:0 0 14px;font-weight:700}
.toc ol{margin:0;padding:0;list-style:none;counter-reset:toc;display:flex;flex-direction:column;gap:2px}
.toc li{margin:0;counter-increment:toc}
.toc a{display:flex;gap:10px;font-size:13px;line-height:1.4;color:var(--mist);
  padding:7px 9px;border-radius:8px;transition:color .2s var(--ease),background .2s var(--ease)}
.toc a::before{content:counter(toc,decimal-leading-zero);font-family:var(--ff-corecap);
  font-size:11px;color:var(--steel);flex:none;padding-top:1px}
.toc a:hover{color:var(--white);background:var(--graphite)}

.toc-toggle{display:none}

/* ---------------- ARTICLE ---------------- */
.legal-article{min-width:0}
.legal-article .lead{font-size:clamp(17px,2vw,20px);color:var(--fog);max-width:64ch;margin-bottom:8px}
.legal-article section{padding:26px 0;border-bottom:1px solid var(--slate)}
.legal-article section:last-of-type{border-bottom:none}
.legal-article h2{font-size:clamp(22px,2.6vw,28px);margin:6px 0 14px;scroll-margin-top:96px;letter-spacing:-.02em}
.legal-article h3{font-family:var(--ff-arcore);font-weight:600;color:var(--white);
  font-size:18px;margin:24px 0 8px;letter-spacing:-.01em}
.legal-article p{margin:12px 0;color:var(--fog);font-size:15.5px;line-height:1.75;text-wrap:pretty}
.legal-article ul{margin:14px 0;padding-left:0;list-style:none;display:flex;flex-direction:column;gap:10px}
.legal-article li{position:relative;padding-left:24px;color:var(--fog);font-size:15.5px;line-height:1.7}
.legal-article li::before{content:"";position:absolute;left:4px;top:11px;width:6px;height:6px;
  border-radius:50%;background:var(--accent);opacity:.8}
.legal-article strong{color:var(--white);font-weight:600}
.legal-article a{color:var(--gold);text-decoration:none;border-bottom:1px solid rgba(var(--accent-rgb),.35);
  transition:border-color .2s var(--ease),color .2s var(--ease)}
.legal-article a:hover{color:var(--gold-soft);border-bottom-color:var(--gold-soft)}

/* ---------------- TABLES ---------------- */
.legal-article .table-wrap{overflow-x:auto;margin:18px 0;border:1px solid var(--slate);border-radius:var(--r-card)}
.legal-article table{width:100%;border-collapse:collapse;font-size:14px;min-width:520px}
.legal-article caption{caption-side:top;text-align:left;color:var(--mist);
  font-family:var(--ff-corecap);font-size:11.5px;letter-spacing:.02em;
  padding:14px 16px 0;text-transform:uppercase}
.legal-article th,.legal-article td{padding:12px 16px;text-align:left;vertical-align:top;
  border-bottom:1px solid var(--slate);line-height:1.5}
.legal-article tbody tr:last-child td{border-bottom:none}
.legal-article th{background:rgba(var(--accent-rgb),.07);color:var(--gold-soft);
  font-family:var(--ff-corecap);font-size:11.5px;letter-spacing:.04em;text-transform:uppercase;font-weight:700}
.legal-article td{color:var(--fog)}
.legal-article td strong{color:var(--white)}

/* ---------------- CALLOUT ---------------- */
.callout{background:rgba(var(--accent-rgb),.06);border:1px solid rgba(var(--accent-rgb),.22);
  border-left:3px solid var(--accent);border-radius:var(--r-ctl);
  padding:16px 18px;margin:18px 0;font-size:14.5px;color:var(--fog);line-height:1.65}
.callout strong{color:var(--white)}

/* ---------------- "AVISO IMPORTANTE" box ---------------- */
.aviso{background:var(--graphite);border:1px solid var(--steel);border-left:3px solid var(--gold);
  border-radius:var(--r-card);padding:20px 22px;margin:18px 0;font-size:15.5px;
  line-height:1.65;color:var(--fog)}
.aviso strong{color:var(--white)}

/* ---------------- CHIPS (rights) ---------------- */
.rights{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.chip{display:inline-flex;align-items:center;font-family:var(--ff-corecap);font-size:12px;
  font-weight:700;letter-spacing:.01em;padding:6px 13px;border-radius:var(--r-pill);
  background:rgba(var(--accent-rgb),.12);color:var(--gold-soft);border:1px solid rgba(var(--accent-rgb),.3)}

/* ---------------- SUMMARY CARD GRID (aviso de privacidad) ---------------- */
.legal-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:26px 0 10px}
.legal-grid .gcard{background:var(--carbon);border:1px solid var(--slate);
  border-radius:var(--r-card);padding:22px}
.legal-grid .gcard.full{grid-column:1 / -1}
.legal-grid .gcard h2{font-family:var(--ff-arcore);font-size:16px;color:var(--white);
  margin:0 0 8px;letter-spacing:-.01em;border:none;padding:0}
.legal-grid .gcard p{margin:0;font-size:14.5px;color:var(--fog);line-height:1.7}
.legal-grid .gcard a{color:var(--gold)}

/* ---------------- BACK CTA ---------------- */
.legal-back{margin-top:40px;display:flex;gap:14px;flex-wrap:wrap}

/* ---------------- RESPONSIVE ---------------- */
@media (max-width:900px){
  .legal-layout{grid-template-columns:1fr;gap:0}
  .toc{position:static;max-height:none;margin-bottom:28px}
  .toc-toggle{display:flex;align-items:center;justify-content:space-between;width:100%;
    background:transparent;border:none;color:var(--gold);font-family:var(--ff-corecap);
    font-size:11px;letter-spacing:2px;text-transform:uppercase;font-weight:700;cursor:pointer;padding:0}
  .toc[data-collapsed="true"] ol{display:none}
  .toc h2{display:none}
}
@media (min-width:901px){.toc-toggle{display:none}}

/* ---------------- PRINT ---------------- */
@media print{
  .nav,.legal-hero .phero-glow,.toc,.toc-toggle,.legal-back,.footer-legal,.cookies-banner{display:none !important}
  body{background:#fff;color:#000}
  .legal-hero,.footer{border:none}
  .legal-layout{display:block}
  .legal-article h2,.legal-article h3,.legal-article strong,.legal-meta strong{color:#000}
  .legal-article p,.legal-article li,.legal-article td{color:#111}
  .legal-article a{color:#000;border:none}
  .callout,.aviso,.legal-grid .gcard{background:#fff;border:1px solid #999;color:#000}
}