/* ============================================================
   Ventas-801 — estilos compartidos de páginas legales
   Enlazar con: <link rel="stylesheet" href="/legal.css">
   ============================================================ */

:root{
  color-scheme: light dark;
  --ink:#241733; --ink-soft:#574a63; --ink-faint:#877c8e;
  --paper:#f7f3ef; --paper-2:#fffdfa; --rule:#e6ddd6;
  --plum:#2e1b47; --rosa:#f0466e; --jade:#0e8f6e;
  --display:"Bricolage Grotesque","Helvetica Neue",Helvetica,Arial,sans-serif;
  --body:"Instrument Sans",ui-sans-serif,system-ui,"Segoe UI",Roboto,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --gutter:clamp(1.15rem,4vw,2.5rem);
}
@media (prefers-color-scheme: dark){
  :root{
    --ink:#f2edf7; --ink-soft:#d3c8e2; --ink-faint:#a99cbd;
    --paper:#171021; --paper-2:#1f1630; --rule:#33264a;
    --plum:#0e0817; --rosa:#ff6688; --jade:#3ec39c;
  }
}

*,*::before,*::after{ box-sizing:border-box; }
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:var(--body); font-size:1.02rem; line-height:1.68;
  -webkit-font-smoothing:antialiased;
}
.shell{ width:min(100% - var(--gutter)*2, 760px); margin-inline:auto; }
a{ color:inherit; }
:where(a,button,summary):focus-visible{ outline:3px solid var(--rosa); outline-offset:3px; border-radius:4px; }
.skip{ position:absolute; left:-9999px; background:var(--ink); color:var(--paper); padding:.85rem 1.25rem; }
.skip:focus{ left:0; top:0; z-index:50; }

/* Header */
.site-header{ border-bottom:1px solid var(--rule); background:var(--paper-2); }
.site-header .shell{
  width:min(100% - var(--gutter)*2, 1140px);
  display:flex; align-items:center; justify-content:space-between; gap:1rem; min-height:68px;
}
.brand{
  font-family:var(--display); font-weight:800; font-size:1.2rem;
  letter-spacing:-.03em; text-decoration:none;
}
.brand__num{ font-family:var(--mono); color:var(--rosa); font-weight:600; }
.back{ font-size:.85rem; color:var(--ink-soft); text-decoration:none; }
.back:hover{ color:var(--ink); }

/* Documento */
.doc{ padding-block:clamp(2.5rem,6vw,4.5rem) clamp(3rem,7vw,5rem); }
.doc h1{
  font-family:var(--display); font-weight:800; letter-spacing:-.035em; line-height:1.1;
  font-size:clamp(1.9rem,5vw,2.9rem); margin:0 0 .6rem; text-wrap:balance;
}
.doc .updated{
  font-family:var(--mono); font-size:.72rem; letter-spacing:.1em; text-transform:uppercase;
  color:var(--ink-faint); margin:0 0 2.5rem;
}
.doc h2{
  font-family:var(--display); font-weight:700; letter-spacing:-.02em; line-height:1.2;
  font-size:1.3rem; margin:2.75rem 0 .8rem; padding-top:1.5rem; border-top:1px solid var(--rule);
}
.doc h3{ font-family:var(--display); font-weight:700; font-size:1.05rem; margin:1.8rem 0 .5rem; }
.doc p, .doc li{ color:var(--ink-soft); }
.doc p{ margin:0 0 1rem; text-wrap:pretty; }
.doc ul, .doc ol{ margin:0 0 1.2rem; padding-left:1.3rem; }
.doc li{ margin-bottom:.5rem; }
.doc strong{ color:var(--ink); }
.doc a{ color:var(--rosa); text-underline-offset:3px; }

.lead{ font-size:1.12rem; color:var(--ink) !important; }
.tofill{
  background:color-mix(in srgb, var(--rosa) 14%, transparent);
  border-radius:4px; padding:.05em .3em; font-family:var(--mono); font-size:.9em; color:var(--ink);
}
.box{
  background:var(--paper-2); border:1px solid var(--rule); border-radius:12px;
  padding:1.25rem 1.4rem; margin:1.5rem 0;
}
.box p:last-child{ margin-bottom:0; }
.box--jade{ border-left:3px solid var(--jade); }
.toc{ background:var(--paper-2); border:1px solid var(--rule); border-radius:12px; padding:1.25rem 1.4rem 1.4rem; margin-bottom:2.5rem; }
.toc h2{ all:unset; font-family:var(--mono); font-size:.7rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-faint); display:block; margin-bottom:.8rem; }
.toc ol{ margin:0; padding-left:1.2rem; }
.toc li{ margin-bottom:.35rem; }
.toc a{ color:var(--ink-soft); text-decoration:none; }
.toc a:hover{ color:var(--rosa); }

dl.data{ margin:0; display:grid; gap:1.1rem; }
dl.data dt{ font-family:var(--mono); font-size:.68rem; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-faint); }
dl.data dd{ margin:.2rem 0 0; color:var(--ink); }

/* Footer */
.site-footer{ background:var(--plum); color:#c6b6db; padding-block:2.5rem; margin-top:3rem; font-size:.85rem; }
.site-footer .shell{ width:min(100% - var(--gutter)*2, 1140px); display:flex; flex-wrap:wrap; gap:.75rem 1.75rem; justify-content:space-between; }
.site-footer a{ color:#e6dcf2; text-decoration:none; }
.site-footer a:hover{ text-decoration:underline; }
.site-footer nav{ display:flex; flex-wrap:wrap; gap:.75rem 1.5rem; }

@media print{ .site-header, .site-footer, .toc{ display:none; } body{ background:#fff; color:#000; } }