/* base.css — Tokens, reset, layout base, page-nav y footer.
   Compartido por todas las páginas del sitio (landing, legales, descargas). */

/* ═══ Tokens ═══ */
:root {
  --bg: #1F2430;
  --bg1: #252B3A;
  --bg2: #2B3243;
  --bg3: #343B4F;
  --t1: #F1F2F5;
  --t2: #B6B8BF;
  --t3: #A3A5AD;
  --t4: #5E6069;
  --accent: #EAB25A;
  --accent-hi: #F4C070;
  --accent-lo: #A6741C;
  --accent-fg: #3A2B0D;
  --accent-soft: rgba(234, 178, 90, .12);
  --accent-line: rgba(234, 178, 90, .40);
  --brand-teal: #00C9A7;
  --brand-amber: #F5A623;
  --success: #8BD4A8;
  --warning: #E4C88A;
  --error: #E08478;
  --border: #6B7286;
  --border-soft: rgba(73, 79, 96, .28);
  --border-hi: #7F8698;

  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;

  --shadow-md: 0 4px 12px -2px rgba(0, 0, 0, .35);
  --shadow-lg: 0 14px 30px -6px rgba(0, 0, 0, .50);

  --font-sans: 'IBM Plex Sans', system-ui, -apple-system, sans-serif;
}

/* ═══ Reset / base ═══ */
*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  font-family: var(--font-sans);
  background: var(--bg);
  color: var(--t1);
  font-size: 16px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.container {
  width: 100%;
  max-width: 1120px;
  margin: 0 auto;
  padding: 0 24px;
}

@media (min-width: 640px) {
  .container { padding: 0 32px; }
}

/* ═══ Page-nav (páginas internas: legales y descargas) ═══ */
.page-nav {
  padding: 18px 0;
  border-bottom: 1px solid var(--border-soft);
  background: var(--bg1);
  position: sticky;
  top: 0;
  z-index: 10;
}
.page-nav .container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.page-nav-brand {
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--t1);
  text-decoration: none;
}
.page-nav-brand .accent-fact { color: var(--brand-teal); }
.page-nav-brand .accent-mx { color: var(--brand-amber); }
.page-nav-back {
  font-size: 0.9rem;
  color: var(--t2);
  text-decoration: none;
}
.page-nav-back:hover { color: var(--accent); }

/* ═══ Footer (compartido) ═══ */
footer.site-footer {
  padding: 32px 0;
  border-top: 1px solid var(--border-soft);
  margin-top: 48px;
  color: var(--t3);
  font-size: 0.875rem;
  text-align: center;
}

footer.site-footer .footer-brand {
  color: var(--t2);
  font-weight: 500;
  margin-bottom: 8px;
}

footer.site-footer .footer-fixco {
  font-size: 0.8rem;
  color: var(--t4);
}

footer.site-footer .footer-legal {
  font-size: 0.78rem;
  color: var(--t4);
  line-height: 1.5;
  max-width: 640px;
  margin: 10px auto 0;
}

.footer-links {
  display: flex;
  gap: 18px;
  justify-content: center;
  flex-wrap: wrap;
  margin: 12px 0;
}
.footer-links a {
  color: var(--t2);
  text-decoration: none;
  font-size: 0.85rem;
}
.footer-links a:hover { color: var(--accent); }

/* ═══ Print: overrides de tokens compartidos ═══ */
@media print {
  :root {
    --bg: #ffffff;
    --bg1: #ffffff;
    --bg2: #f7f5f0;
    --bg3: #ede9df;
    --t1: #1a1d26;
    --t2: #4a4f5e;
    --t3: #6a6e7a;
    --t4: #9ba0ad;
    --accent: #A6741C;
    --accent-fg: #ffffff;
    --accent-soft: rgba(166, 116, 28, .12);
    --accent-line: rgba(166, 116, 28, .40);
    --brand-teal: #007F6A;
    --brand-amber: #A6741C;
    --success: #3FA36D;
    --warning: #A8791A;
    --border: #bdb8a8;
    --border-soft: rgba(30, 32, 42, .15);
    --shadow-md: none;
    --shadow-lg: none;
  }
  body { background: #ffffff; color: #1a1d26; }
  footer.site-footer { page-break-before: avoid; border-top: 2px solid #bdb8a8; }
}