/* Páginas legales de follendario.com: texto largo, legible y ligero (sin la portada). */
@font-face { font-family: 'Archivo Black'; src: url('/fonts/archivo-black-400.woff2') format('woff2'); font-weight: 400; font-display: swap; }
@font-face { font-family: 'Geist'; src: url('/fonts/geist-400.woff2') format('woff2'); font-weight: 400; font-display: swap; }
@font-face { font-family: 'Geist'; src: url('/fonts/geist-600.woff2') format('woff2'); font-weight: 600; font-display: swap; }

:root {
  --ink: #10081a;
  --paper: #ffffff;
  --pink-text: #c8124f;
  --muted: #56495f;
  --ash: #e3dde6;
  --mist: #f5f1f6;
  --cream: #fcf3ed;
  --app-muted: #a597b3;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--paper); color: var(--ink); font: 400 17px/1.6 'Geist', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; }

.top { background: var(--ink); }
.top div { max-width: 760px; margin: 0 auto; padding: 14px 16px; display: flex; align-items: center; gap: 16px; }
.top img { width: 132px; height: auto; margin-right: auto; }
.top a { color: var(--cream); font-weight: 600; text-decoration: none; }

main { max-width: 760px; margin: 0 auto; padding: 32px 16px 56px; }
h1 { margin: 0 0 8px; font: 400 clamp(2rem, 8vw, 3.2rem)/1 'Archivo Black', 'Arial Black', system-ui, sans-serif; text-transform: uppercase; }
h2 { margin: 40px 0 8px; font-size: 1.25rem; line-height: 1.3; }
h3 { margin: 24px 0 4px; font-size: 1.05rem; }
p, li { max-width: 68ch; }
a { color: var(--pink-text); }
a:focus-visible { outline: 3px solid var(--pink-text); outline-offset: 2px; }
.fecha { color: var(--muted); margin: 0 0 24px; }
.resumen { background: var(--mist); border-radius: 14px; padding: 16px 20px; margin: 0 0 8px; }
.resumen p { margin: 0 0 8px; }
.resumen ul { margin: 0; padding-left: 20px; }

.tabla { width: 100%; overflow-x: auto; }
table { width: 100%; border-collapse: collapse; font-size: 15px; margin: 8px 0; }
th, td { text-align: left; vertical-align: top; padding: 10px 8px; border-bottom: 1px solid var(--ash); }
th { font-weight: 600; background: var(--mist); }

.pie { background: var(--ink); color: var(--app-muted); font-size: 14px; }
.pie div { max-width: 760px; margin: 0 auto; padding: 24px 16px calc(24px + env(safe-area-inset-bottom)); display: flex; flex-wrap: wrap; gap: 10px 22px; }
.pie a { color: var(--cream); text-decoration: none; }
.pie a:hover, .pie a[aria-current] { text-decoration: underline; }