/* iConsent — shared stylesheet for the standalone legal pages
   (privacidad.html, terminos.html, eliminar-cuenta.html).
   Rules copied from the site/index.html inline <style> so the pages match it. */

:root{
  --bg:#FBF8F4; --fg:#16212C; --muted:#5B6672; --surface:#FFFFFF; --surface-2:#F6F1E9;
  --border:#EAE3D8; --navy:#1E3A5F; --navy-deep:#0F1F2F; --navy-line:#2A4A7F;
  --accent:#FF8C42; --accent-strong:#FF6B1A; --on-navy:#EEF3F8; --on-navy-muted:#A9BBD0;
  --good:#4CAF50; --ring:rgba(255,140,66,.55);
  --display:"Fraunces", Georgia, "Times New Roman", serif;
  --body:"Hanken Grotesk", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  --maxw:1120px; --r:16px; --r-lg:24px;
}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){
  --bg:#0C131B; --fg:#E9EEF3; --muted:#9BA8B5; --surface:#121D28; --surface-2:#0F1823;
  --border:#223240; color-scheme:dark;
}}
:root[data-theme="dark"]{
  --bg:#0C131B; --fg:#E9EEF3; --muted:#9BA8B5; --surface:#121D28; --surface-2:#0F1823;
  --border:#223240; color-scheme:dark;
}

*{box-sizing:border-box}
body{background:var(--bg); color:var(--fg); font-family:var(--body); line-height:1.55;
  -webkit-font-smoothing:antialiased; font-size:16px}
h1,h2,h3{font-family:var(--display); font-weight:600; line-height:1.08; text-wrap:balance; margin:0}
p{margin:0}
a{color:inherit}
.wrap{max-width:var(--maxw); margin-inline:auto;
  padding-left:max(20px, env(safe-area-inset-left,0px));
  padding-right:max(20px, env(safe-area-inset-right,0px))}

/* ---------- logo mark ---------- */
.brandmark{background:url("brandmark.png") center/contain no-repeat; display:block; aspect-ratio:1/1}

/* ---------- header ---------- */
header.site{position:sticky; top:env(safe-area-inset-top,0px); z-index:20;
  backdrop-filter:saturate(1.2) blur(10px); background:color-mix(in srgb, var(--bg) 82%, transparent);
  border-bottom:1px solid var(--border)}
body::before{content:""; position:fixed; inset:0 0 auto; height:env(safe-area-inset-top,0px);
  background:var(--bg); z-index:21}
.nav{display:flex; align-items:center; gap:22px; padding-block:14px}
.brand{display:flex; align-items:center; gap:11px; font-weight:700; letter-spacing:-.01em;
  font-size:1.12rem; text-decoration:none}
.brand .brandmark{width:34px; border-radius:9px}
.brand b{font-weight:800}
.brand b span{color:var(--accent)}
.nav .links{display:flex; gap:22px; margin-left:auto; align-items:center}
.nav .links a{text-decoration:none; color:var(--muted); font-weight:500; font-size:.95rem}
.nav .links a:hover{color:var(--fg)}
.btn{display:inline-flex; align-items:center; gap:8px; border-radius:11px; font-weight:600;
  font-family:var(--body); font-size:.98rem; padding:12px 18px; border:1px solid transparent;
  cursor:pointer; text-decoration:none; transition:transform .12s ease, box-shadow .2s ease, background .2s ease}
.btn-primary{background:linear-gradient(180deg,var(--accent),var(--accent-strong)); color:#241200;
  box-shadow:0 6px 18px -8px var(--ring)}
.btn-primary:hover{transform:translateY(-1px)}
.nav-cta{margin-left:4px}
.tgl{display:grid; place-items:center; width:40px; height:40px; border-radius:10px;
  border:1px solid var(--border); background:transparent; color:var(--fg); cursor:pointer}
.tgl:hover{border-color:var(--muted)}

/* ---------- legal / doc pages ---------- */
.doc-page{padding-block:clamp(44px,7vw,80px)}
.doc-inner{max-width:820px; margin-inline:auto}
.doc-inner .back{display:inline-flex; align-items:center; gap:7px; color:var(--accent-strong);
  font-weight:600; text-decoration:none; margin-bottom:22px}
.doc-inner h1{font-size:clamp(1.9rem,4vw,2.6rem); margin-bottom:10px}
.doc-inner .meta{color:var(--muted); font-size:.9rem; margin-bottom:26px}
.doc-inner h2{font-size:1.18rem; font-family:var(--body); font-weight:700; margin:30px 0 8px}
.doc-inner p{color:var(--fg); font-size:1rem; line-height:1.7; margin-bottom:10px}
.doc-inner a{color:var(--accent-strong); font-weight:600; text-decoration:none}
.doc-inner a:hover{text-decoration:underline}
.doc-inner ul{padding-left:20px; display:grid; gap:7px; margin:8px 0 14px}
.doc-inner li{color:var(--fg); line-height:1.6}
.doc-inner ol.steps-num{counter-reset:s; list-style:none; padding:0; display:grid; gap:12px; margin:10px 0 16px}
.doc-inner ol.steps-num li{display:flex; gap:12px; align-items:flex-start}
.doc-inner ol.steps-num li::before{counter-increment:s; content:counter(s); flex:none;
  width:26px; height:26px; border-radius:50%; background:var(--accent); color:#241200;
  font-weight:800; display:grid; place-items:center; font-size:.85rem}
.draft-banner{background:color-mix(in srgb,var(--accent) 13%, transparent); border:1px solid var(--accent);
  border-radius:12px; padding:13px 15px; color:var(--fg); font-size:.9rem; margin-bottom:26px;
  display:flex; gap:10px; align-items:flex-start}
.draft-banner svg{color:var(--accent-strong); flex:none; margin-top:2px}
.doc-inner .toc{color:var(--muted); font-size:.92rem; line-height:1.8; background:var(--surface-2);
  border:1px solid var(--border); border-radius:12px; padding:14px 16px}

/* ---------- footer ---------- */
footer.site{background:var(--navy-deep); color:var(--on-navy-muted); padding-block:40px 30px}
footer .top{display:flex; justify-content:space-between; gap:30px; flex-wrap:wrap;
  padding-bottom:26px; border-bottom:1px solid rgba(255,255,255,.1)}
footer .brand{color:#fff}
footer .brand .brandmark{width:36px; border-radius:9px}
footer .fnav{display:flex; gap:40px; flex-wrap:wrap}
footer .fcol{display:grid; gap:9px; font-size:.9rem}
footer .fcol strong{color:var(--on-navy); font-size:.76rem; letter-spacing:.1em; text-transform:uppercase; font-weight:700}
footer .fcol a{color:var(--on-navy-muted); text-decoration:none}
footer .fcol a:hover{color:#fff}
footer .legal{margin-top:22px; font-size:.82rem; color:#6f7d8c; display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap}

/* ---------- responsive ---------- */
@media (max-width:860px){
  .nav .links a:not(.nav-cta){display:none}
}