/* ============================================================
   Hypero · Hoja de estilo compartida para páginas legales
   Reusa los tokens de la landing (index.html) para mantener
   una sola identidad visual en todo el sitio.
   ============================================================ */
:root{
  --ink:#0F1545;
  --ink-deep:#0A0E33;
  --indigo:#283CA0;
  --indigo-2:#4458C8;
  --paper:#FFFFFF;
  --paper-2:#F4F6FB;
  --paper-3:#EBEEF6;
  --rule:rgba(15,21,69,0.10);
  --rule-strong:rgba(15,21,69,0.22);
  --cta:#F5A524;
  --cta-deep:#D4861A;
  --cta-tint:#FFF6E5;
  --muted:rgba(15,21,69,0.58);
  --muted-2:rgba(15,21,69,0.40);
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;background:var(--paper);color:var(--ink);font-family:'Geist',sans-serif;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;letter-spacing:-0.005em;overflow-x:clip;}
body{font-size:18px;line-height:1.65;}
a{color:var(--indigo);text-decoration:none;}
a:hover{text-decoration:underline;}
img{display:block;}
.wrap{max-width:1320px;margin:0 auto;padding:0 48px;}
.mono{font-family:'Geist Mono',monospace;}

/* ============ NAV ============ */
.nav{position:sticky;top:0;z-index:50;background:rgba(255,255,255,0.85);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid var(--rule);}
.nav-inner{max-width:1320px;margin:0 auto;padding:14px 48px;display:flex;justify-content:space-between;align-items:center;gap:32px;}
.nav-brand img{height:125px;width:auto;transition:transform .35s cubic-bezier(.2,.7,.2,1);}
.nav-brand:hover img{transform:scale(1.04);}
.nav-cta{display:flex;gap:12px;align-items:center;}
.nav-cta a{font-size:15px;font-weight:500;color:var(--ink);padding:10px 18px;border-radius:999px;}
.nav-cta a:hover{text-decoration:none;background:var(--paper-2);}
.nav-cta .btn-cta{background:var(--cta);color:#fff;font-weight:600;box-shadow:0 6px 24px -8px rgba(245,165,36,0.5);}
.nav-cta .btn-cta:hover{background:var(--cta-deep);}

/* ============ LEGAL HEADER ============ */
.legal-hero{padding:72px 0 36px;border-bottom:1px solid var(--rule);background:var(--paper-2);}
.legal-hero .eyebrow{font-family:'Geist Mono',monospace;font-size:12px;letter-spacing:0.2em;text-transform:uppercase;font-weight:600;color:var(--indigo);display:inline-flex;align-items:center;gap:10px;}
.legal-hero .eyebrow .dot{width:8px;height:8px;border-radius:50%;background:var(--cta);}
.legal-hero h1{font-size:clamp(38px,6vw,68px);line-height:1.0;letter-spacing:-0.035em;font-weight:500;margin:22px 0 0;color:var(--ink);}
.legal-hero .dates{margin-top:20px;display:flex;gap:28px;flex-wrap:wrap;font-family:'Geist Mono',monospace;font-size:12px;letter-spacing:0.08em;text-transform:uppercase;color:var(--muted);font-weight:500;}
.legal-hero .dates span strong{color:var(--ink);font-weight:600;}

/* ============ LEGAL BODY ============ */
.legal-body{padding:56px 0 96px;}
.legal-body .col{max-width:820px;}
.legal-body .intro{font-size:19px;line-height:1.6;color:var(--ink);background:var(--cta-tint);border-left:3px solid var(--cta);border-radius:0 12px 12px 0;padding:20px 24px;margin:0 0 44px;}
.legal-body h2{font-size:27px;font-weight:600;letter-spacing:-0.018em;line-height:1.2;margin:48px 0 16px;color:var(--ink);scroll-margin-top:90px;}
.legal-body h3{font-size:20px;font-weight:600;letter-spacing:-0.012em;margin:32px 0 12px;color:var(--ink);}
.legal-body p{margin:0 0 18px;color:rgba(15,21,69,0.78);}
.legal-body ul,.legal-body ol{margin:0 0 22px;padding-left:24px;color:rgba(15,21,69,0.78);}
.legal-body li{margin:0 0 10px;line-height:1.6;}
.legal-body strong{color:var(--ink);font-weight:600;}
.legal-body blockquote{margin:0 0 26px;padding:16px 22px;background:var(--paper-2);border-left:3px solid var(--indigo);border-radius:0 12px 12px 0;color:var(--ink);font-size:17px;}
.legal-body table{width:100%;border-collapse:collapse;margin:0 0 28px;font-size:15.5px;}
.legal-body th,.legal-body td{text-align:left;padding:12px 14px;border-bottom:1px solid var(--rule);vertical-align:top;color:rgba(15,21,69,0.82);}
.legal-body th{font-family:'Geist Mono',monospace;font-size:11px;letter-spacing:0.12em;text-transform:uppercase;color:var(--muted);font-weight:600;background:var(--paper-2);}
.legal-body hr{border:none;border-top:1px solid var(--rule);margin:40px 0;}
.legal-body .contact-card{margin-top:40px;padding:24px 28px;border:1px solid var(--rule);border-radius:16px;background:var(--paper-2);}
.legal-body .contact-card .k{font-family:'Geist Mono',monospace;font-size:11px;letter-spacing:0.14em;text-transform:uppercase;color:var(--muted);font-weight:600;}

/* ============ FOOTER ============ */
footer{background:var(--paper-2);padding:80px 0 40px;border-top:1px solid var(--rule);}
.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:48px;margin-bottom:48px;}
.footer-brand img{height:125px;width:auto;margin-bottom:24px;}
.footer-brand p{font-size:15px;line-height:1.5;color:var(--muted);max-width:340px;}
.footer-col h5{font-family:'Geist Mono',monospace;font-size:11px;letter-spacing:0.18em;text-transform:uppercase;color:var(--muted);font-weight:600;margin:0 0 16px;}
.footer-col ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px;}
.footer-col a{font-size:15px;color:var(--ink);font-weight:500;}
.footer-col a:hover{color:var(--indigo);}
.footer-legal{padding-top:28px;border-top:1px solid var(--rule);font-family:'Geist Mono',monospace;font-size:12px;line-height:1.7;color:var(--muted);letter-spacing:0.02em;}
.footer-legal strong{color:var(--ink);font-weight:600;}
.footer-compliance{margin-top:18px;font-size:12.5px;line-height:1.6;color:var(--muted-2);max-width:900px;}
.footer-bottom{margin-top:24px;padding-top:24px;border-top:1px solid var(--rule);display:flex;justify-content:space-between;align-items:center;font-family:'Geist Mono',monospace;font-size:12px;color:var(--muted);letter-spacing:0.06em;gap:24px;flex-wrap:wrap;}
.footer-bottom .links{display:flex;gap:22px;flex-wrap:wrap;}
.footer-bottom .links a{color:var(--muted);}
.footer-bottom .links a:hover{color:var(--indigo);}

/* (El banner de cookies ahora se estiliza desde site.js, autocontenido.) */

@media (max-width:1100px){
  .wrap,.nav-inner{padding:0 28px;}
  .footer-grid{grid-template-columns:1fr 1fr;}
}
@media (max-width:640px){
  .wrap,.nav-inner{padding:0 18px;}
  body{font-size:17px;}
  .footer-grid{grid-template-columns:1fr;}
  .footer-bottom{flex-direction:column;align-items:flex-start;}
  .nav-brand img{height:84px;}
  .legal-body table{font-size:14px;}
}