/* Sistema de políticas: página propia + modal. Mismo en las cuatro landings,
   solo cambia la paleta. Ver politicas.html y politicas.js. */
:root {
  --pol-fondo: #0c0a14; --pol-panel: #141020; --pol-panel2: #1d1730;
  --pol-texto: #f3ebdc; --pol-suave: #bcb2a3;
  --pol-acento: #d4a853; --pol-acento2: #f0d48a; --pol-linea: rgba(212,168,83,0.24);
  --pol-f-tit: "Rozha One", Georgia, serif; --pol-f-txt: "Newsreader", Georgia, serif; --pol-f-ui: "Manrope", system-ui, sans-serif;
}

/* ---------- Enlaces del pie ---------- */
.pol-enlaces { display: flex; flex-wrap: wrap; gap: 0.4rem 1rem; justify-content: center; margin: 0.9rem auto 0.5rem; padding: 0; max-width: 900px; }
.pol-enlaces a { font-family: var(--pol-f-ui); font-size: 0.78rem; letter-spacing: 0.06em; color: var(--pol-acento2); text-decoration: underline; text-underline-offset: 3px; opacity: 0.92; }
.pol-enlaces a:hover { opacity: 1; }
.pol-enlaces a:first-child { font-weight: 700; color: var(--pol-acento); }
.pol-resumen { max-width: 780px; margin: 0.3rem auto 0; font-size: 0.8rem; line-height: 1.5; color: var(--pol-suave); text-align: center; }
.pol-resumen strong { color: var(--pol-acento2); }

/* ---------- Modal ---------- */
.pol-modal { width: min(100vw - 1.2rem, 860px); max-width: 100%; max-height: min(92vh, 1000px); padding: 0; border: 1px solid var(--pol-linea); border-radius: 12px;
  background: var(--pol-panel); color: var(--pol-texto); box-shadow: 0 30px 80px rgba(0,0,0,0.55); overflow: hidden; }
.pol-modal::backdrop { background: rgba(0,0,0,0.72); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); }
.pol-modal[open] { display: flex; }
.pol-caja { display: flex; flex-direction: column; width: 100%; max-height: min(92vh, 1000px); }
.pol-cab { display: flex; align-items: center; gap: 0.8rem; padding: 0.9rem 1rem; border-bottom: 1px solid var(--pol-linea); background: var(--pol-panel2); flex: 0 0 auto; }
.pol-tit { margin: 0; font-family: var(--pol-f-tit); font-size: 1.1rem; font-weight: 400; color: var(--pol-texto); line-height: 1.2; }
.pol-abrir { margin-left: auto; font-family: var(--pol-f-ui); font-size: 0.74rem; letter-spacing: 0.06em; color: var(--pol-acento2); text-decoration: underline; text-underline-offset: 3px; white-space: nowrap; }
.pol-x { width: 36px; height: 36px; flex: 0 0 auto; border-radius: 50%; border: 1px solid var(--pol-linea); background: transparent; color: var(--pol-texto); font-size: 1rem; line-height: 1; cursor: pointer; }
.pol-x:hover { background: var(--pol-acento); color: var(--pol-fondo); }
.pol-cuerpo { flex: 1 1 auto; overflow-y: auto; -webkit-overflow-scrolling: touch; padding: 1.1rem 1.2rem 2rem; }
.pol-cargando { color: var(--pol-suave); font-style: italic; }

/* ---------- Contenido (vale igual en la página y en el modal) ---------- */
.pol-cuerpo, .pol-pagina { font-family: var(--pol-f-txt); font-size: 16.5px; line-height: 1.62; color: var(--pol-texto); }
.pol-cuerpo p, .pol-pagina p { margin: 0 0 0.85em; }
.pol-cuerpo h2, .pol-pagina h2 { font-family: var(--pol-f-tit); font-weight: 400; font-size: 1.22rem; line-height: 1.25; color: var(--pol-acento2); margin: 0 0 0.6rem; }
.pol-cuerpo h3, .pol-pagina h3 { font-family: var(--pol-f-ui); font-weight: 700; font-size: 0.82rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--pol-acento); margin: 1.1rem 0 0.4rem; }
.pol-cuerpo ul, .pol-pagina ul { margin: 0 0 0.9em; padding: 0; list-style: none; }
.pol-cuerpo ul li, .pol-pagina ul li { position: relative; padding-left: 1.3rem; margin-bottom: 0.45rem; }
.pol-cuerpo ul li::before, .pol-pagina ul li::before { content: "✦"; position: absolute; left: 0; top: 0.05em; color: var(--pol-acento); font-size: 0.8em; }
.pol-cuerpo a, .pol-pagina a { color: var(--pol-acento2); text-decoration: underline; text-underline-offset: 2px; }
.pol-cuerpo strong, .pol-pagina strong { color: var(--pol-acento2); }
.pol-seccion { padding: 1.1rem 0; border-top: 1px solid var(--pol-linea); scroll-margin-top: 1rem; }
.pol-seccion:first-of-type { border-top: 0; }
.pol-intro { padding: 0.9rem 1rem; border: 1px dashed var(--pol-linea); border-radius: 8px; background: var(--pol-panel2); font-size: 0.96rem; }
.pol-indice { margin: 0 0 0.4rem; padding: 0.9rem 1rem; border-radius: 8px; background: var(--pol-panel2); border: 1px solid var(--pol-linea); }
.pol-indice-tit { margin: 0 0 0.5rem !important; font-family: var(--pol-f-ui); font-size: 0.74rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--pol-acento); }
.pol-indice ol { margin: 0; padding: 0; list-style: none; display: grid; gap: 0.22rem; font-size: 0.93rem; }
.pol-indice a { text-decoration: none; }
.pol-indice a:hover { text-decoration: underline; }
.pol-dominio { font-weight: 700; color: var(--pol-acento2); overflow-wrap: anywhere; }
.pol-tabla-caja { overflow-x: auto; margin: 0 0 0.9em; }
.pol-tabla { width: 100%; border-collapse: collapse; font-size: 0.92rem; }
.pol-tabla th, .pol-tabla td { padding: 0.5rem 0.6rem; border: 1px solid var(--pol-linea); text-align: left; vertical-align: top; }
.pol-tabla thead th { font-family: var(--pol-f-ui); font-size: 0.72rem; letter-spacing: 0.1em; text-transform: uppercase; background: var(--pol-panel2); color: var(--pol-acento); }
.pol-fecha { margin-top: 0.8rem; font-size: 0.9rem; color: var(--pol-suave); }

/* ---------- Página propia ---------- */
.pol-pagina-cuerpo { margin: 0; background: var(--pol-fondo); color: var(--pol-texto); }
.pol-pagina { width: min(100% - 2rem, 820px); margin: 0 auto; padding: 1.6rem 0 4rem; }
.pol-cabecera { display: flex; flex-wrap: wrap; align-items: center; gap: 0.8rem; padding: 1rem 0 1.2rem; border-bottom: 1px solid var(--pol-linea); margin-bottom: 1.4rem; }
.pol-volver { font-family: var(--pol-f-ui); font-size: 0.8rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--pol-acento2); text-decoration: none; border: 1px solid var(--pol-linea); border-radius: 999px; padding: 0.45rem 0.95rem; }
.pol-volver:hover { background: var(--pol-acento); color: var(--pol-fondo); }
.pol-pagina h1 { font-family: var(--pol-f-tit); font-weight: 400; font-size: clamp(1.6rem, 4.5vw, 2.4rem); line-height: 1.12; color: var(--pol-texto); margin: 0; }
.pol-marca { font-family: var(--pol-f-ui); font-size: 0.72rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--pol-acento); margin: 0 0 0.35rem; }
.pol-pie { margin-top: 2.2rem; padding-top: 1.2rem; border-top: 1px solid var(--pol-linea); font-size: 0.86rem; color: var(--pol-suave); text-align: center; }
.pol-pie a { color: var(--pol-acento2); }

@media (max-width: 560px) {
  .pol-modal { width: 100vw; max-width: 100vw; max-height: 100vh; border-radius: 0; border: 0; }
  .pol-caja { max-height: 100vh; }
  .pol-cab { padding: 0.8rem 0.8rem calc(0.8rem); }
  .pol-abrir { display: none; }
  .pol-cuerpo { padding: 0.9rem 0.9rem 2.4rem; }
  .pol-tit { font-size: 1rem; }
}
@media (prefers-reduced-motion: reduce) { .pol-modal, .pol-modal::backdrop { animation: none !important; } }
