/* ===========================================================
   Senda ERP — Estilos compartidos de páginas legales
   =========================================================== */
:root {
  --cobalt:#0047AB; --cobalt-700:#073B85; --cobalt-900:#0A2540;
  --emerald:#10B981; --emerald-600:#059669;
  --slate:#4A5568; --slate-soft:#708090; --ink:#16213A;
  --bg:#F8FAFC; --bg-alt:#F1F5F9; --white:#FFFFFF;
  --line:#E2E8F0; --line-strong:#CBD5E1;
  --radius:14px; --radius-sm:10px; --radius-pill:999px;
  --shadow-sm:0 1px 2px rgba(16,33,58,.06),0 1px 3px rgba(16,33,58,.05);
  --shadow-md:0 8px 24px -8px rgba(16,33,58,.16);
  --maxw:860px;
  --sans:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --display:'Montserrat',var(--sans);
}
* { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body {
  font-family:var(--sans); color:var(--slate); background:var(--bg);
  line-height:1.7; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
img,svg { display:block; max-width:100%; }
a { color:var(--cobalt); text-decoration:none; }
a:hover { text-decoration:underline; }
h1,h2,h3,h4 { font-family:var(--display); color:var(--ink); letter-spacing:-.01em; line-height:1.25; }

/* ---------- Header ---------- */
.legal-header {
  position:sticky; top:0; z-index:50;
  background:rgba(248,250,252,.9); backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line);
}
.legal-header .inner { max-width:1180px; margin:0 auto; padding:0 24px; height:66px; display:flex; align-items:center; justify-content:space-between; }
.brand { display:inline-flex; align-items:center; gap:11px; }
.brand img { width:38px; height:38px; object-fit:contain; }
.brand-text { font-family:var(--display); line-height:1; }
.brand-text .b1 { font-weight:800; font-size:19px; letter-spacing:.04em; color:var(--ink); }
.brand-text .b2 { font-weight:400; font-size:19px; letter-spacing:.18em; color:var(--slate-soft); }
.back-link { font-family:var(--display); font-weight:600; font-size:14px; color:var(--slate); display:inline-flex; align-items:center; gap:7px; }
.back-link:hover { color:var(--cobalt); text-decoration:none; }

/* ---------- Hero ---------- */
.legal-hero { border-bottom:1px solid var(--line); background:var(--white); }
.legal-hero .inner { max-width:var(--maxw); margin:0 auto; padding:56px 24px 40px; }
.legal-hero .eyebrow { font-family:var(--display); font-weight:700; font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:var(--cobalt); }
.legal-hero h1 { font-size:clamp(28px,4vw,40px); margin:12px 0 14px; }
.legal-hero .meta { font-size:14px; color:var(--slate-soft); }
.legal-hero .meta b { color:var(--ink); font-weight:600; }

/* ---------- Cuerpo ---------- */
.legal-wrap { max-width:var(--maxw); margin:0 auto; padding:48px 24px 40px; }
.legal-wrap article > section { margin-bottom:38px; scroll-margin-top:84px; }
.legal-wrap h2 {
  font-size:21px; margin:0 0 14px; padding-top:8px;
  color:var(--ink); display:flex; gap:10px; align-items:baseline;
}
.legal-wrap h2 .n { color:var(--cobalt); font-weight:800; font-size:16px; flex:0 0 auto; }
.legal-wrap h3 { font-size:16px; margin:22px 0 8px; color:var(--ink); }
.legal-wrap p { margin:0 0 14px; font-size:15.5px; }
.legal-wrap ul, .legal-wrap ol { margin:0 0 14px 4px; padding-left:22px; }
.legal-wrap li { margin-bottom:9px; font-size:15.5px; }
.legal-wrap strong { color:var(--ink); font-weight:600; }

/* Índice / TOC */
.toc { background:var(--bg-alt); border:1px solid var(--line); border-radius:var(--radius); padding:22px 24px; margin-bottom:40px; }
.toc h2 { font-family:var(--display); font-size:14px; letter-spacing:.06em; text-transform:uppercase; color:var(--slate-soft); margin-bottom:14px; }
.toc ol { list-style:decimal; columns:2; column-gap:32px; margin:0; padding-left:20px; }
.toc li { margin-bottom:7px; font-size:14px; }
.toc a { color:var(--slate); }
.toc a:hover { color:var(--cobalt); }

/* Aviso / callout */
.callout { border-left:3px solid var(--emerald); background:#ECFDF5; border-radius:0 var(--radius-sm) var(--radius-sm) 0; padding:16px 20px; margin:0 0 22px; }
.callout p { margin:0; font-size:14.5px; color:#065F46; }

.tag-placeholder { background:#FFF7ED; color:#C2410C; border-radius:5px; padding:1px 6px; font-size:.9em; font-weight:600; }

/* ---------- Footer ---------- */
.legal-footer { background:var(--cobalt-900); color:rgba(255,255,255,.66); padding:44px 0 30px; margin-top:20px; }
.legal-footer .inner { max-width:1180px; margin:0 auto; padding:0 24px; }
.legal-footer .links { display:flex; flex-wrap:wrap; gap:8px 22px; padding-bottom:24px; border-bottom:1px solid rgba(255,255,255,.12); }
.legal-footer .links a { color:rgba(255,255,255,.75); font-size:14px; }
.legal-footer .links a:hover { color:#fff; text-decoration:none; }
.legal-footer .bottom { padding-top:22px; display:flex; justify-content:space-between; gap:14px; flex-wrap:wrap; font-size:13px; }
.legal-footer .bottom em { color:var(--emerald); font-style:normal; font-weight:600; }

@media (max-width:620px) {
  .toc ol { columns:1; }
  .brand-text .b2 { display:none; }
}
