/* ═══════════════════════════════════════════════════════════════════════════
   Classical — hoja compartida del sitio estático de LegalAtlas (unidad R-12)
   ───────────────────────────────────────────────────────────────────────────
   ÚNICO origen de tokens y de la piel común. La consumen las 14 estáticas
   (landing + 13) ANTES de su <style> inline, que queda solo para lo local de
   cada página. Tres capas:

   (1) TOKENS + BASE + CROMO — extraídos tal cual de landing.html (216f4e1):
       paleta piedra/tinta/dorado, Cormorant Garamond (titular) + Lora (cuerpo),
       filetes de un pelo, radios 2/4/7, topbar con imagotipo horizontal, footer
       con imagotipo apilado, variantes -dark, botones, eyebrow, section-head,
       .reveal, reduced-motion y los cortes 900/560.
   (2) COMPATIBILIDAD — las 13 páginas nacieron con tres juegos de variables
       propios (--ink/--paper/--thread…, --bg-deep/--text-primary/--gold…,
       --bg/--bg-card/--border…). Aquí se redefinen en términos de los tokens
       Classical para que el CSS local de cada página se recoloree entero sin
       reescribir cada regla. Va en `:root:root` para ganarle a cualquier resto.
   (3) PRIMITIVAS DE PÁGINA INTERIOR — `.page` (columna de lectura), `.prose`
       (legales: h1/h2/p/ul/table/callout) y alias de clases heredadas
       (.label→eyebrow, .btn-ghost→secondary, .btn-gold/.cta-btn→primary).

   Dorado: solo trazo y texto. Sin gradientes, sin Inter, sin CDN.
   ═══════════════════════════════════════════════════════════════════════ */

/* ── (1a) Tokens ─────────────────────────────────────────────────────────── */
:root {
  --color-bg:#f3f2f2;--color-surface:#eae9e9;--color-text:#201f1d;--color-muted:#5f5b57;
  --color-accent:#b68235;--color-accent-deep:#79561f;--color-divider:color-mix(in srgb,#201f1d 16%,transparent);
  --font-heading:'Cormorant Garamond',Georgia,'Times New Roman',serif;--font-body:'Lora',Georgia,'Times New Roman',serif;
  --font-mono:'JetBrains Mono',ui-monospace,SFMono-Regular,'SF Mono',Menlo,Consolas,monospace;
  --radius-sm:2px;--radius-md:4px;--radius-lg:7px;--max:1180px;
  --shadow-sm:0 1px 2px color-mix(in srgb,#2d2b2b 14%,transparent);--shadow-md:0 3px 10px color-mix(in srgb,#2d2b2b 16%,transparent);--shadow-lg:0 12px 32px color-mix(in srgb,#2d2b2b 22%,transparent)
}
:root[data-theme="dark"]{--color-bg:#242221;--color-surface:#2d2b2b;--color-text:#f8f4f4;--color-muted:#c9c5c2;--color-accent:#e1ad66;--color-accent-deep:#facb8d;--color-divider:color-mix(in srgb,#f8f4f4 15%,transparent);--shadow-sm:0 1px 2px color-mix(in srgb,#000 45%,transparent);--shadow-md:0 3px 10px color-mix(in srgb,#000 50%,transparent);--shadow-lg:0 12px 32px color-mix(in srgb,#000 58%,transparent)}

/* ── (2) Compatibilidad con las variables heredadas de las 13 páginas ───── */
:root:root{
  /* familia B (pricing, why, mcp, docs-mcp, reformas) */
  --ink:var(--color-text);--ink-soft:var(--color-text);--ink-muted:var(--color-muted);
  --paper:var(--color-bg);--paper-alt:var(--color-surface);--paper-raised:color-mix(in srgb,var(--color-surface) 88%,var(--color-text));--gazette:var(--color-surface);
  --thread:var(--color-accent);--thread-hi:var(--color-accent);--thread-lo:var(--color-accent-deep);
  --rule:var(--color-divider);--rule-thread:color-mix(in srgb,var(--color-accent) 32%,transparent);
  --serif:var(--font-heading);--mono:var(--font-mono);
  /* familia A (about, company, contact) */
  --bg-deep:var(--color-bg);--bg-card:var(--color-surface);--bg-elevated:color-mix(in srgb,var(--color-surface) 88%,var(--color-text));
  --text-primary:var(--color-text);--text-secondary:var(--color-text);--text-muted:var(--color-muted);
  --gold:var(--color-accent-deep);--gold-light:var(--color-accent);--gold-dim:color-mix(in srgb,var(--color-accent) 9%,transparent);--gold-border:color-mix(in srgb,var(--color-accent) 30%,transparent);--gold-glow:color-mix(in srgb,var(--color-accent) 28%,transparent);
  --border:var(--color-divider);
  /* familia C (security, terms, privacy, dpa, acceptable) */
  --bg:var(--color-bg)
}

/* ── (1b) Base ───────────────────────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box}html{scroll-behavior:smooth}
html body{margin:0;overflow-x:hidden;background:var(--color-bg);color:var(--color-text);font:400 16px/1.65 var(--font-body);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body::before{content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.025;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='2'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)' opacity='.6'/%3E%3C/svg%3E")}
img{display:block;max-width:100%;height:auto}a{color:inherit;text-underline-offset:3px}button,input,select,textarea{font:inherit}:focus{outline:0}:focus-visible{outline:2px solid var(--color-accent);outline-offset:3px;border-radius:var(--radius-sm)}::selection{color:var(--color-text);background:var(--color-surface)}
h1,h2,h3,h4,p{margin:0}h1,h2,h3,h4{color:var(--color-text);font-family:var(--font-heading);font-weight:600;line-height:1.06;letter-spacing:-.02em}
table,th,td,.tnum{font-variant-numeric:tabular-nums}
.wrap{width:min(var(--max),calc(100% - 48px));margin-inline:auto}.skip-link{position:fixed;left:16px;top:-80px;z-index:100;padding:9px 14px;color:var(--color-bg);background:var(--color-text);border-radius:var(--radius-md)}.skip-link:focus{top:12px}
.eyebrow,.label{display:flex;align-items:center;gap:12px;margin-bottom:18px;color:var(--color-accent-deep);font-family:var(--font-body);font-size:11px;font-weight:600;letter-spacing:.18em;text-transform:uppercase}.eyebrow::before,.label::before{content:'';width:28px;height:0;margin:0;border-top:1px solid var(--color-accent);background:none}
.section-head{max-width:680px;margin-bottom:46px}.section-head h2{font-size:clamp(2.5rem,5vw,4.1rem);font-weight:600}.section-head p{max-width:61ch;margin-top:18px;color:var(--color-muted)}
.btn,.cta-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:10px 19px;border:1px solid var(--color-text);border-radius:var(--radius-md);font-family:var(--font-body);font-size:13px;font-weight:600;letter-spacing:.04em;text-transform:none;text-decoration:none;cursor:pointer;transition:color .18s ease,background-color .18s ease,border-color .18s ease,transform .18s ease}.btn:hover,.cta-btn:hover{transform:translateY(-2px);text-decoration:none}
.btn-primary,.btn-gold,.cta-btn{color:var(--color-bg);background:var(--color-text);border-color:var(--color-text)}.btn-primary:hover,.btn-gold:hover,.cta-btn:hover{color:var(--color-accent-deep);background:transparent;border-color:var(--color-accent)}
.btn-secondary,.btn-ghost,.cta-btn-ghost{color:var(--color-text);background:transparent;border-color:var(--color-divider)}.btn-secondary:hover,.btn-ghost:hover,.cta-btn-ghost:hover{color:var(--color-accent-deep);background:transparent;border-color:var(--color-accent)}

/* ── (1c) Cromo: topbar y footer idénticos al landing ────────────────────── */
.site-header{position:sticky;top:0;z-index:30;border-bottom:1px solid var(--color-divider);background:color-mix(in srgb,var(--color-bg) 92%,transparent);backdrop-filter:blur(12px)}.nav-shell{display:flex;align-items:center;min-height:74px;gap:30px}.brand{flex:none;text-decoration:none}.brand img{width:224px;height:auto}.top-nav{display:flex;align-items:center;gap:27px;margin-left:auto}.top-nav>a:not(.btn){color:var(--color-muted);font-size:13px;text-decoration:none}.top-nav>a:not(.btn):hover{color:var(--color-accent-deep)}.top-nav .btn{min-height:39px;padding:8px 15px}
.site-footer{padding:66px 0 28px;border-top:1px solid var(--color-divider)}.footer-grid{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:55px}.footer-logo{width:178px;height:auto;margin:-18px 0 4px}.footer-note{max-width:31ch;color:var(--color-muted);font-size:12px}.footer-col h3{margin-bottom:14px;color:var(--color-muted);font-family:var(--font-body);font-size:10px;font-weight:600;letter-spacing:.16em;text-transform:uppercase}.footer-col a{display:block;width:fit-content;padding:4px 0;color:var(--color-muted);font-size:12px;text-decoration:none}.footer-col a:hover{color:var(--color-accent-deep);text-decoration:underline}.footer-bottom{display:flex;justify-content:space-between;gap:25px;margin-top:50px;padding-top:21px;border-top:1px solid var(--color-divider);color:var(--color-muted);font-size:10px}
:root[data-theme="dark"] .brand img{content:url('/img/brand/legalatlas-imagotipo-horizontal-dark.png')}:root[data-theme="dark"] .plate-mark,:root[data-theme="dark"] .final-mark{content:url('/favicon-dark.svg')}:root[data-theme="dark"] .footer-logo{content:url('/img/brand/legalatlas-imagotipo-apilado-dark.png')}

/* ── (3) Primitivas de página interior ───────────────────────────────────── */
.page{width:min(var(--max),calc(100% - 48px));margin-inline:auto;padding:72px 0 96px}.page-narrow{max-width:760px}
.page-head{margin-bottom:46px}.page-head h1{max-width:16ch;font-size:clamp(2.8rem,6vw,4.6rem);font-weight:400}.page-head .lede,.page-head .fecha{margin-top:18px;color:var(--color-muted)}.page-head .lede{max-width:60ch;font-size:clamp(1rem,1.7vw,1.15rem)}.page-head .fecha{font-size:13px}
.prose h2{margin:44px 0 14px;padding-bottom:9px;border-bottom:1px solid var(--color-divider);font-size:clamp(1.55rem,2.6vw,1.95rem);font-weight:600}.prose h3{margin:28px 0 10px;font-size:1.3rem}.prose p{margin-bottom:16px;color:var(--color-text);font-size:15.5px}.prose ul,.prose ol{margin:0 0 16px 22px;padding:0}.prose li{margin-bottom:8px;font-size:15.5px}.prose li::marker{color:var(--color-accent-deep)}.prose a{color:var(--color-accent-deep)}.prose a:hover{color:var(--color-accent)}.prose strong{font-weight:600}
.prose table{width:100%;margin:22px 0 26px;border-collapse:collapse;border-top:1px solid var(--color-text);font-size:14px}.prose th,.prose td{padding:11px 10px;border-bottom:1px solid var(--color-divider);text-align:left;vertical-align:top}.prose th{color:var(--color-muted);font-family:var(--font-body);font-size:10px;font-weight:600;letter-spacing:.14em;text-transform:uppercase}.prose td.num,.prose th.num{text-align:right;white-space:nowrap}.prose tfoot td{border-bottom:0;border-top:1px solid var(--color-text);font-weight:600}.prose .code{font-family:var(--font-body)}
.callout{margin:0 0 30px;padding:20px 22px;border:1px solid var(--color-divider);border-left:2px solid var(--color-accent);border-radius:var(--radius-md);background:var(--color-surface)}.callout strong{display:block;margin-bottom:6px;font-family:var(--font-heading);font-size:1.25rem;font-weight:600}.callout p{margin:0;color:var(--color-muted);font-size:14.5px}

.annex{margin:32px 0;padding:26px 26px 10px;border:1px solid var(--color-divider);border-radius:var(--radius-lg);background:var(--color-surface)}.annex h2{margin-top:0;padding-bottom:0;border-bottom:0}
@media print{:root{--color-bg:#fff;--color-surface:#fff}body::before,.site-header,.site-footer,.skip-link{display:none!important}.page{width:100%;padding:0}@page{margin:18mm 16mm}a{color:var(--color-text);text-decoration:none}h1,h2,h3{break-after:avoid}h2,h3,tr,.callout,.annex{break-inside:avoid}p,li{orphans:3;widows:3}}

/* ── Movimiento y cortes ─────────────────────────────────────────────────── */
.reveal{opacity:1;transform:none}@media(prefers-reduced-motion:no-preference){.reveal{opacity:0;transform:translateY(18px);transition:opacity .65s ease,transform .65s ease}.reveal.visible{opacity:1;transform:none}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
@media(max-width:900px){.top-nav>a:not(.btn){display:none}.footer-grid{grid-template-columns:1.3fr 1fr 1fr}.footer-brand{grid-column:1/-1}}
@media(max-width:560px){.wrap,.page{width:min(100% - 32px,var(--max))}.page{padding:52px 0 72px}.nav-shell{min-height:66px;gap:12px}.brand img{width:160px}.top-nav{margin-left:auto}.top-nav .btn{min-height:37px;padding:7px 10px;font-size:11px}.section-head{margin-bottom:36px}.footer-grid{grid-template-columns:repeat(2,1fr);gap:35px}.footer-brand{grid-column:1/-1}.footer-bottom{flex-direction:column}.prose table{display:block;overflow-x:auto}}
