/* ==========================================================================
   Páginas legales — Patricia Córdoba
   Hoja independiente de popshow.css: las legales son documentos de lectura
   larga y no necesitan el peso del CSS de la home. Reutiliza la misma paleta
   y las mismas tipografías para que no se noten "pegadas" al sitio.
   ========================================================================== */

:root{
  --yellow:#f4ee2a;
  --red:#e63946;
  --blue:#2257e9;
  --ink:#0a0a0a;
  --paper:#fffaf0;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:"Archivo",sans-serif;overflow-x:hidden}
a{color:inherit}
img{display:block;max-width:100%}

/* ── Nav ──────────────────────────────────────────────────────────────── */
nav.top{position:sticky;top:0;z-index:50;background:var(--yellow);border-bottom:3px solid var(--ink);display:flex;justify-content:space-between;align-items:center;gap:16px;padding:14px 32px}
nav.top .logo{display:flex;align-items:center;gap:10px;font-family:"Archivo Black",sans-serif;font-size:17px;letter-spacing:-0.02em;text-decoration:none}
nav.top .logo .dot{width:24px;height:24px;background:var(--red);border-radius:50%;flex:none}
nav.top .back{font-family:"Archivo Black",sans-serif;font-size:12px;letter-spacing:.04em;text-transform:uppercase;text-decoration:none;border:2px solid var(--ink);border-radius:999px;padding:8px 16px;background:var(--ink);color:var(--yellow);transition:all .15s;white-space:nowrap}
nav.top .back:hover{background:var(--red);color:#fff;border-color:var(--red)}

/* ── Cabecera del documento ───────────────────────────────────────────── */
.legal-head{padding:64px 32px 40px;max-width:900px;margin:0 auto}
.legal-tag{display:inline-block;font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.24em;text-transform:uppercase;background:var(--red);color:#fff;padding:6px 14px;transform:rotate(-1.5deg);margin-bottom:18px}
.legal-head h1{font-family:"Archivo Black",sans-serif;font-size:clamp(38px,7vw,76px);line-height:.95;letter-spacing:-0.04em;margin:0 0 18px}
.legal-head .updated{font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.16em;text-transform:uppercase;opacity:.55;margin:0}

/* ── Cuerpo ───────────────────────────────────────────────────────────── */
.legal-body{max-width:900px;margin:0 auto;padding:0 32px 96px;font-size:16.5px;line-height:1.75}
.legal-body section{border-top:3px solid var(--ink);padding-top:32px;margin-top:44px}
.legal-body section:first-of-type{margin-top:0}
.legal-body h2{font-family:"Archivo Black",sans-serif;font-size:clamp(22px,3vw,30px);line-height:1.1;letter-spacing:-0.02em;margin:0 0 18px}
.legal-body h2 .num{color:var(--red);margin-right:10px}
.legal-body h3{font-family:"Archivo",sans-serif;font-weight:800;font-size:17px;margin:28px 0 8px;letter-spacing:-0.01em}
.legal-body p{margin:0 0 16px}
.legal-body ul{margin:0 0 16px;padding-left:22px}
.legal-body li{margin-bottom:8px}
.legal-body a{color:var(--blue);text-decoration:underline;text-underline-offset:2px}
.legal-body a:hover{color:var(--red)}
.legal-body strong{font-weight:800}

/* Ficha de datos identificativos / responsable */
.legal-card{background:#fff;border:3px solid var(--ink);box-shadow:8px 8px 0 var(--ink);padding:24px 28px;margin:0 0 20px}
.legal-card dl{display:grid;grid-template-columns:200px 1fr;gap:10px 20px;margin:0}
.legal-card dt{font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;opacity:.6;padding-top:4px}
.legal-card dd{margin:0;font-weight:600}

/* Aviso destacado */
.legal-note{background:var(--yellow);border-left:8px solid var(--red);padding:18px 22px;margin:0 0 20px;font-size:15.5px}
.legal-note p:last-child{margin-bottom:0}

/* Tablas (tipos de cookies, plazos, etc.) */
.legal-table-wrap{overflow-x:auto;margin:0 0 20px;border:3px solid var(--ink);background:#fff}
table.legal-table{width:100%;border-collapse:collapse;font-size:14.5px;min-width:560px}
table.legal-table th{background:var(--ink);color:var(--yellow);font-family:"JetBrains Mono",monospace;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;text-align:left;padding:12px 14px;font-weight:500}
table.legal-table td{padding:12px 14px;border-top:1px solid #e5e0d3;vertical-align:top;line-height:1.5}
table.legal-table tbody tr:nth-child(even){background:#fdfaf2}

/* Botón para reabrir el panel de cookies desde la política */
.legal-actions{display:flex;flex-wrap:wrap;gap:12px;margin:0 0 8px}
.btn-legal{display:inline-block;font-family:"Archivo Black",sans-serif;font-size:13px;letter-spacing:.04em;text-transform:uppercase;text-decoration:none;border:3px solid var(--ink);border-radius:999px;padding:12px 24px;background:var(--red);color:#fff;cursor:pointer;transition:transform .12s,box-shadow .12s}
.btn-legal:hover{transform:translateY(-2px);box-shadow:4px 4px 0 var(--ink)}
.btn-legal.ghost{background:transparent;color:var(--ink)}
.btn-legal.ghost:hover{background:var(--ink);color:var(--yellow)}

/* ── Footer ───────────────────────────────────────────────────────────── */
footer{padding:32px;background:var(--ink);color:var(--yellow);border-top:3px solid var(--yellow);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px;font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.2em;text-transform:uppercase}
footer .legal-links{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center}
footer a{color:inherit;text-decoration:none;opacity:.75;transition:opacity .15s,color .15s}
footer a:hover{opacity:1;color:#fff}
footer .copy{opacity:.55}

/* ── Responsive ───────────────────────────────────────────────────────── */
@media (max-width:760px){
  nav.top{padding:12px 18px}
  nav.top .logo{font-size:14px}
  nav.top .logo .dot{width:18px;height:18px}
  nav.top .back{font-size:10px;padding:7px 12px}
  .legal-head{padding:40px 20px 28px}
  .legal-body{padding:0 20px 64px;font-size:16px}
  .legal-card{padding:18px 20px;box-shadow:5px 5px 0 var(--ink)}
  .legal-card dl{grid-template-columns:1fr;gap:2px}
  .legal-card dd{margin-bottom:12px}
  .legal-body section{padding-top:24px;margin-top:32px}
  footer{padding:24px 20px;flex-direction:column;align-items:flex-start;gap:14px}
}