/* PRIVACIDAD - estilos específicos
   Basado en los patrones visuales del sitio principal
   Incluye variables de color, tipografías, layout y componentes legales
*/

:root{
  --bg:#f5f1ec;
  --surface:#ffffff;
  --text:#161616;
  --muted:#6d6863;
  --red:#e21c1c;
  --red-dark:#be1515;
  --border:rgba(18,18,18,.08);
  --shadow:0 20px 60px rgba(0,0,0,.12);
}

*{box-sizing:border-box}
body{margin:0;font-family:Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;color:var(--text);background:linear-gradient(180deg,#faf8f5 0%,var(--bg) 100%);overflow-x:hidden}
img{max-width:100%;display:block}
a{text-decoration:none}

/* Header / navbar reuse */
.site-header{position:absolute;top:1rem;inset:0 0 auto 0;z-index:30;pointer-events:none}
.navbar-shell{width:min(calc(100% - 2rem),1320px);max-width:1320px;margin:0 auto;padding:.95rem 1.35rem;background:rgba(5,5,5,.58);backdrop-filter:blur(18px) saturate(120%);border-radius:24px;pointer-events:auto}
.navbar-brand img{height:54px}
.navbar-nav .nav-link{color:rgba(255,255,255,.9);font-weight:700;text-transform:uppercase;padding:.6rem .8rem}
.btn-header{display:inline-flex;align-items:center;gap:.5rem;padding:.7rem 1rem;background:var(--red);color:#fff;border:0}

/* HERO legal */
.hero-legal{min-height:36vh;display:flex;align-items:center;padding:6rem 0;background:linear-gradient(90deg,rgba(6,6,6,.88) 0%,rgba(6,6,6,.5) 40%, rgba(6,6,6,.15) 70%, rgba(6,6,6,0) 100%),url('../img/inicio/hero/hero.png') center/cover no-repeat;color:#fff;position:relative}
.hero-legal::after{content:"";position:absolute;inset:auto 0 0 0;height:140px;background:linear-gradient(180deg,transparent 20%,rgba(245,241,236,.65) 100%)}
.hero-legal .eyebrow{font-weight:800;letter-spacing:.14em;color:rgba(255,255,255,.9)}
.hero-legal h1{font-family:'Playfair Display', serif;font-weight:800;font-size:clamp(2.5rem,5vw,4rem);margin:.4rem 0}
.hero-legal h1 span{color:var(--red)}
.hero-legal .lead{color:rgba(255,255,255,.86);max-width:48ch}

/* Main content */
section.legal-content{padding:4.5rem 0}
.side-panel{background:linear-gradient(180deg,rgba(255,255,255,.95),rgba(248,246,243,.9));padding:1.6rem;border-radius:14px;border:1px solid var(--border);box-shadow:var(--shadow)}
.side-panel .kicker{color:var(--red);font-weight:800;letter-spacing:.16em}
.legal-nav .nav-link{color:var(--text);padding:.45rem 0}
.side-cta{margin-top:1.2rem;padding-top:1rem;border-top:1px solid var(--border)}
.btn-cta{display:inline-block;padding:.6rem .9rem;background:var(--red);color:#fff;border-radius:6px;margin-top:.5rem}

.legal-block h2{font-family:'Playfair Display', serif;font-weight:700;margin-bottom:.6rem}
.legal-block p{color:var(--muted);line-height:1.7}
.info-card{background:var(--surface);padding:1.1rem;border-radius:10px;border:1px solid var(--border);box-shadow:0 12px 30px rgba(0,0,0,.06);display:grid;grid-template-columns:auto 1fr;gap:1rem;align-items:center}
.info-card i{font-size:1.35rem;color:var(--red);display:inline-flex;width:44px;height:44px;align-items:center;justify-content:center;background:rgba(226,28,28,.06);border-radius:10px;grid-row:1 / span 2}
.info-card h4{margin:0;font-size:1.05rem;font-weight:700}
.info-card p{margin:0;color:var(--muted);line-height:1.6}
.rights-card{background:linear-gradient(180deg, #fff, #fbfbfb);padding:1rem;border-radius:10px;border:1px solid var(--border);display:flex;gap:.9rem;align-items:flex-start}
.rights-card i{font-size:1.35rem;color:var(--red);min-width:36px}

.divider{border:0;height:1px;background:linear-gradient(90deg,transparent,rgba(16,16,16,.06),transparent);margin:2.2rem 0}

.cta-panel{background:var(--surface);padding:1.6rem;border-radius:12px;border:1px solid var(--border);display:flex;flex-direction:column;gap:.6rem;color:var(--text);box-shadow:0 12px 30px rgba(16,16,16,.06)}
.cta-panel h3{margin:0;color:var(--text)}
.cta-panel p{color:var(--muted)}
.btn-primary{display:inline-block;padding:.8rem 1.1rem;background:var(--red);color:#fff;border-radius:8px}
.footer-logo{height:46px}

/* Responsive tweaks */
@media(max-width:991.98px){
  .hero-legal{padding:4rem 0}
  .side-panel{position:relative}
}

@media(max-width:575.98px){
  .hero-legal h1{font-size:2rem}
  .lead{font-size:.95rem}
}

/* Small utility tweaks to match existing design system */
.kicker{font-weight:800;letter-spacing:.12em;color:var(--red);margin-bottom:.6rem}
.legal-list{color:var(--muted);line-height:1.7}