:root {
  color-scheme: light;
  --wine: #611232;
  --wine-dark: #3b0b20;
  --gold: #b38e5d;
  --ink: #2f2730;
  --muted: #6f676d;
  --paper: #fffdf9;
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  max-width: 1020px;
  margin: 0 auto;
  padding: 42px clamp(20px, 5vw, 70px) 80px;
  background: var(--paper);
  color: var(--ink);
  font: 16px/1.68 ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

body::before {
  content: "FOCO PÚBLICO · TAMPICO 2027";
  display: block;
  margin-bottom: 28px;
  color: var(--wine);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .14em;
}

nav#TOC {
  margin: 0 0 46px;
  padding: 24px 28px;
  border: 1px solid #eaded7;
  border-radius: 16px;
  background: #f8f0e9;
}

nav#TOC::before {
  content: "Contenido del informe";
  display: block;
  margin-bottom: 12px;
  color: var(--wine);
  font: 700 22px/1.2 Georgia, serif;
}

nav#TOC ul { margin: 0; padding-left: 20px; columns: 2; column-gap: 38px; }
nav#TOC li { margin: 0 0 6px; break-inside: avoid; }
nav#TOC li ul { display: none; }
nav#TOC a { color: #765263; font-size: 12px; text-decoration: none; }
nav#TOC a:hover { color: var(--wine); text-decoration: underline; }

h1 {
  margin: 74px -12px 18px;
  padding: 10px 14px;
  border-left: 5px solid var(--gold);
  color: var(--wine);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .13em;
  text-transform: uppercase;
}

h1:first-of-type { margin-top: 0; }

h2 {
  margin: 0 0 24px;
  color: var(--wine-dark);
  font: 600 clamp(30px, 5vw, 48px)/1.03 Georgia, serif;
  letter-spacing: -.035em;
}

h3 { margin-top: 34px; color: var(--wine); font: 700 21px/1.25 Georgia, serif; }
h4 { margin-top: 28px; color: #5a3645; }
p, li { color: #51494f; }
strong { color: #3e1b2b; }
a { color: var(--wine); }
hr { margin: 44px 0; border: 0; border-top: 1px solid #e8ded8; }

blockquote {
  margin: 28px 0;
  padding: 18px 22px;
  border-left: 4px solid var(--gold);
  background: #f8f0e9;
  color: #654f59;
}

table {
  width: 100%;
  margin: 24px 0 34px;
  border-collapse: collapse;
  font-size: 13px;
}

th { padding: 12px; background: var(--wine); color: white; text-align: left; }
td { padding: 11px 12px; border: 1px solid #e7ddd8; vertical-align: top; }
tr:nth-child(even) td { background: #fbf5f1; }

@media (max-width: 680px) {
  body { padding: 26px 17px 60px; font-size: 15px; }
  nav#TOC ul { columns: 1; }
  h1 { margin-top: 58px; }
  table { display: block; overflow-x: auto; white-space: nowrap; }
}
