/* Compartido entre las páginas legales (/aviso-legal, /privacidad, /cookies, /terminos)
   y la página /empresas. Misma identidad visual que la home pero más editorial-prensa. */

:root {
  --bg: #f2ead8;
  --paper: #faf5e6;
  --bg-deep: #ede1c5;
  --ink: #1a1614;
  --ink-soft: #4a4036;
  --ink-meta: #7a6e5e;
  --moss: #1b3a2d;
  --moss-deep: #0f2419;
  --geranium: #c41e3a;
  --gold: #b8851a;
  --line: rgba(26, 22, 20, 0.12);
  --font-display: 'Fraunces', 'Times New Roman', Georgia, serif;
  --font-body: 'Inter Tight', system-ui, -apple-system, sans-serif;
  --font-mono: 'JetBrains Mono', 'SF Mono', Menlo, monospace;
  --ease: cubic-bezier(0.16, 1, 0.3, 1);
}
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body { background: var(--bg); color: var(--ink); font-family: var(--font-body); font-size: 16px; line-height: 1.6; -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; height: auto; }

/* Topbar */
nav.topbar { position: sticky; top: 0; z-index: 50; background: rgba(242, 234, 216, 0.92); backdrop-filter: saturate(140%) blur(14px); border-bottom: 1px solid var(--line); padding: 14px 0; }
.nav-inner { max-width: 980px; margin: 0 auto; padding: 0 24px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.brand { display: inline-flex; align-items: center; gap: 11px; color: var(--ink); transition: opacity 0.2s; }
.brand:hover { opacity: 0.7; }
.brand-mark { display: inline-flex; align-items: flex-start; justify-content: flex-start; width: 38px; height: 38px; border: 1.75px solid currentColor; border-radius: 2px; padding: 5px 4px 0 6px; font-family: var(--font-display); font-weight: 600; font-size: 18px; line-height: 0.9; letter-spacing: -0.02em; flex-shrink: 0; }
.brand-mark sup { font-size: 8px; font-weight: 500; margin-left: 0.5px; vertical-align: top; line-height: 1; }
.brand-wordmark { display: inline-flex; flex-direction: column; font-family: var(--font-display); font-size: 13px; font-weight: 500; line-height: 1.08; letter-spacing: -0.005em; margin-top: 1px; }
.back { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-soft); transition: color 0.2s; }
.back:hover { color: var(--ink); }

/* Article */
main.article { max-width: 760px; margin: 0 auto; padding: clamp(48px, 10vw, 96px) 24px clamp(64px, 12vw, 120px); }

.article-eyebrow { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--gold); margin-bottom: 18px; }
.article h1 { font-family: var(--font-display); font-weight: 400; font-size: clamp(40px, 6.5vw, 72px); line-height: 0.98; letter-spacing: -0.03em; color: var(--ink); margin-bottom: 16px; font-variation-settings: 'opsz' 120, 'SOFT' 50; }
.article h1 em { font-style: italic; font-weight: 300; color: var(--geranium); }
.article-lede { font-family: var(--font-body); font-size: 19px; color: var(--ink-soft); margin-bottom: 8px; max-width: 60ch; line-height: 1.5; font-weight: 350; }
.updated { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-meta); margin-top: 28px; padding-top: 20px; border-top: 1px solid var(--line); display: block; }

.article section { margin-top: 56px; }
.article h2 { font-family: var(--font-display); font-weight: 500; font-size: 24px; line-height: 1.2; letter-spacing: -0.015em; color: var(--ink); margin-bottom: 16px; font-variation-settings: 'opsz' 36, 'SOFT' 50; }
.article h2 .num { font-family: var(--font-mono); font-weight: 500; font-size: 13px; letter-spacing: 0.1em; color: var(--gold); display: block; margin-bottom: 6px; }
.article h3 { font-family: var(--font-display); font-weight: 500; font-size: 18px; line-height: 1.3; color: var(--ink); margin-top: 24px; margin-bottom: 8px; }
.article p { font-size: 16px; color: var(--ink-soft); line-height: 1.65; margin-bottom: 16px; }
.article p strong { color: var(--ink); font-weight: 500; }
.article ul, .article ol { padding-left: 24px; margin-bottom: 16px; color: var(--ink-soft); line-height: 1.65; }
.article li { margin-bottom: 8px; }
.article li::marker { color: var(--ink-meta); }
.article a:not(.back):not(.brand) { color: var(--moss); border-bottom: 1px solid var(--moss); transition: color 0.2s; }
.article a:not(.back):not(.brand):hover { color: var(--geranium); border-bottom-color: var(--geranium); }
.article code { font-family: var(--font-mono); font-size: 13px; background: var(--paper); padding: 2px 6px; border-radius: 3px; color: var(--ink); }
.article hr { border: none; border-top: 1px solid var(--line); margin: 40px 0; }

.todo { background: #fff3cd; border-left: 3px solid var(--gold); padding: 12px 16px; margin: 8px 0; font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.04em; color: var(--ink); border-radius: 0 4px 4px 0; }
.todo::before { content: '⚠ Falta: '; font-weight: 600; color: var(--gold); text-transform: uppercase; }

.article-table { width: 100%; border-collapse: collapse; margin: 16px 0 24px; font-size: 14.5px; }
.article-table thead { background: var(--paper); }
.article-table th, .article-table td { padding: 12px 14px; text-align: left; border-bottom: 1px solid var(--line); vertical-align: top; }
.article-table th { font-family: var(--font-mono); font-weight: 500; font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-meta); }
.article-table td { color: var(--ink-soft); line-height: 1.5; }
.article-table td strong { color: var(--ink); font-weight: 500; }

/* Footer */
footer.foot { background: var(--moss-deep); color: var(--bg); padding: 64px 24px 32px; margin-top: 80px; }
.foot-inner { max-width: 980px; margin: 0 auto; }
.foot-cols { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 40px; margin-bottom: 40px; }
@media (max-width: 720px) { .foot-cols { grid-template-columns: 1fr 1fr; gap: 28px; } }
@media (max-width: 480px) { .foot-cols { grid-template-columns: 1fr; } }
.foot .brand { color: var(--bg); margin-bottom: 16px; }
.foot p { font-size: 14px; opacity: 0.75; max-width: 32ch; line-height: 1.55; }
.foot h4 { font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; opacity: 0.55; margin-bottom: 14px; color: var(--bg); }
.foot a:not(.brand) { display: block; padding: 4px 0; font-size: 14px; opacity: 0.85; transition: opacity 0.2s, color 0.2s; }
.foot a:not(.brand):hover { opacity: 1; color: var(--geranium); }
.foot-bottom { padding-top: 28px; border-top: 1px solid rgba(247, 240, 220, 0.12); display: flex; justify-content: space-between; gap: 12px; font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.08em; opacity: 0.5; flex-wrap: wrap; }