/* Páginas legales de CapoPlay: mismo mundo que la web, pensadas para leer */
:root{
  --lav:#f1e8fc; --lav-2:#e2d0f7; --ink:#3b0f74; --ink-2:#5b2a96; --violet:#7b2fd0;
  --yellow:#ffd21f; --night:#24094d;
  --ease-out:cubic-bezier(0.23, 1, 0.32, 1);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:96px}
body{font-family:"Fredoka",system-ui,sans-serif;font-size:1.0625rem;line-height:1.65;color:var(--ink);
  background:linear-gradient(90deg,#e2cff7 0%,#f5eefd 14%,#f5eefd 86%,#e2cff7 100%);min-height:100vh;-webkit-font-smoothing:antialiased}
::selection{background:var(--yellow);color:var(--ink)}
a{color:var(--violet);text-underline-offset:4px;text-decoration-thickness:2px}
:focus-visible{outline:3px solid var(--ink);outline-offset:3px}
h1,h2,h3{font-family:"Bungee","Fredoka",sans-serif;font-weight:400;letter-spacing:0;line-height:1.12;text-wrap:balance}

/* marquesina */
.top{position:sticky;top:0;z-index:5;background:repeating-linear-gradient(90deg,#fff 0 22px,#eee5f9 22px 26px);box-shadow:inset 0 -3px 0 var(--ink)}
.top .in{width:min(880px,100% - 32px);margin:0 auto;height:76px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.top img{height:48px;width:auto;display:block}
.back{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 18px;border:3px solid var(--ink);border-radius:999px;
  background:linear-gradient(180deg,#ffe766,#ffc400);color:var(--ink);font-weight:600;text-decoration:none;box-shadow:0 4px 0 var(--ink);
  transition:transform 160ms var(--ease-out), box-shadow 160ms var(--ease-out)}
.back:active{transform:translateY(3px);box-shadow:0 1px 0 var(--ink)}

main{width:min(880px,100% - 32px);margin:32px auto 64px}
.draft{margin-bottom:20px;padding:14px 18px;background:#fff6c7;border:3px dashed var(--ink);border-radius:16px;font-size:.98rem}
.draft b{font-weight:600}
.doc{background:#fff;border:3px solid var(--ink);border-radius:24px;padding:clamp(24px,5vw,56px);box-shadow:0 14px 30px -18px rgba(59,15,116,.55)}
.doc h1{font-size:clamp(1.7rem,4.4vw,2.4rem)}
.updated{margin:8px 0 24px;color:var(--ink-2);font-size:.95rem}
.intro{font-size:1.1rem;max-width:65ch}
.toc{margin:28px 0 8px;padding:18px 22px;background:var(--lav);border:2.5px solid var(--ink);border-radius:16px}
.toc b{display:block;margin-bottom:6px}
.toc ol{padding-left:22px;display:grid;gap:2px}
.doc h2{font-size:1.25rem;margin:40px 0 10px;padding-top:4px}
.doc h3{font-size:1.02rem;margin:22px 0 6px}
.doc p,.doc li{max-width:68ch}
.doc p+p{margin-top:12px}
.doc ul,.doc ol.list{padding-left:22px;margin:10px 0;display:grid;gap:6px}
.doc table{width:100%;border-collapse:collapse;margin:12px 0;font-size:.98rem}
.doc th,.doc td{text-align:left;vertical-align:top;padding:10px 12px;border-bottom:2px solid var(--lav-2)}
.doc th{font-weight:600;background:var(--lav)}
.legal-note{margin-top:14px;padding:14px 18px;background:var(--lav);border-left:0;border:2.5px solid var(--ink);border-radius:14px;font-size:.95rem}
/* datos para completar: bien visibles para que no se publiquen sin llenar */
.fill{background:var(--yellow);border:2px dashed var(--ink);border-radius:6px;padding:0 6px;font-weight:600;white-space:nowrap}

footer{width:min(880px,100% - 32px);margin:0 auto 40px;font-size:.92rem;color:var(--ink-2);display:flex;flex-wrap:wrap;gap:6px 18px;justify-content:center}
footer a{color:var(--ink-2)}

@media (max-width:600px){ .top img{height:40px} .doc table{font-size:.92rem} .fill{white-space:normal} }
@media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto} .back{transition:none} }
@media print{ .top,.draft,footer{display:none} body{background:#fff} .doc{border:0;box-shadow:none;padding:0} .fill{background:none} }
