/* ============================================================
   privacidad.css — Política de Privacidad · SiniestrosVial
   Estilos exclusivos de esta página, no afectan la landing.
   ============================================================ */

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }

:root {
  --navy:    #04101F;   /* azul-800 */
  --navy-mid:#0F2A47;  /* azul-600 */
  --navy-lt: #1A3C5E;  /* azul-500 institucional */
  --gold:    #8DC63F;  /* verde-400 principal Movilidad */
  --cream:   #F1F3F5;  /* gris-100 */
  --cream-dk:#DEE2E6;  /* gris-300 */
  --white:   #F8F9FA;  /* gris-50 */
  --gray:    #6C757D;  /* gris-600 */
  --gray-lt: #CED4DA;  /* gris-400 */
  --serif:   'Playfair Display', Georgia, serif;
  --sans:    'DM Sans', sans-serif;
  --mono:    'IBM Plex Mono', monospace;
}

body {
  background: var(--white);
  color: var(--navy-mid);
  font-family: var(--sans);
  line-height: 1.75;
}

/* NAV */
nav {
  background: var(--navy);
  padding: 16px 48px;
  display: flex; align-items:center; justify-content:space-between;
}
.nav-logo {
  display:flex; align-items:center; gap:10px;
  text-decoration:none;
}
.nav-logo-icon {
  width:30px; height:30px; background:var(--gold);
  border-radius:6px; display:flex; align-items:center; justify-content:center;
}
.nav-logo-text {
  font-family:var(--serif); font-size:16px; font-weight:700;
  color:var(--cream); letter-spacing:-0.01em;
}
.nav-back {
  font-size:13px; color:var(--gray-lt); text-decoration:none;
  font-family:var(--mono); transition:color 0.2s;
}
.nav-back:hover { color:var(--gold); }

/* HERO */
.hero {
  background: var(--navy-mid);
  padding: 60px 48px 48px;
  border-bottom: 3px solid var(--gold);
}
.hero-tag {
  font-family:var(--mono); font-size:11px; color:var(--gold);
  letter-spacing:0.1em; text-transform:uppercase; margin-bottom:16px;
  display:flex; align-items:center; gap:10px;
}
.hero-tag::before { content:''; width:24px; height:1px; background:var(--gold); }
.hero-title {
  font-family:var(--serif); font-size:42px; font-weight:900;
  color:var(--cream); letter-spacing:-0.02em; line-height:1.1;
  margin-bottom:12px;
}
.hero-sub {
  font-size:15px; color:var(--gray-lt); max-width:600px; line-height:1.7;
}
.hero-meta {
  margin-top:20px; display:flex; gap:24px; flex-wrap:wrap;
}
.hero-meta-item {
  font-family:var(--mono); font-size:11px; color:var(--gray-lt);
  display:flex; align-items:center; gap:6px;
}
.hero-meta-item::before { content:'·'; color:var(--gold); }

/* CONTENT */
.content {
  max-width: 820px;
  margin: 0 auto;
  padding: 60px 24px 80px;
}

/* TOC */
.toc {
  background:var(--cream); border:1px solid var(--cream-dk);
  border-left: 4px solid var(--gold);
  border-radius:4px; padding:24px 28px; margin-bottom:48px;
}
.toc-title {
  font-family:var(--mono); font-size:11px; font-weight:500;
  color:var(--gold); letter-spacing:0.1em; text-transform:uppercase;
  margin-bottom:14px;
}
.toc ol { padding-left:20px; }
.toc li { margin-bottom:6px; }
.toc a {
  font-size:14px; color:var(--navy-lt); text-decoration:none;
  transition:color 0.2s;
}
.toc a:hover { color:var(--gold); }

/* Sections */
.section {
  margin-bottom:48px;
  scroll-margin-top: 20px;
}
.section-num {
  font-family:var(--mono); font-size:11px; color:var(--gold);
  letter-spacing:0.08em; text-transform:uppercase; margin-bottom:6px;
}
h2 {
  font-family:var(--serif); font-size:26px; font-weight:700;
  color:var(--navy); letter-spacing:-0.01em; margin-bottom:16px;
  padding-bottom:10px; border-bottom:1px solid var(--cream-dk);
}
h3 {
  font-family:var(--sans); font-size:15px; font-weight:600;
  color:var(--navy-lt); margin:20px 0 8px;
}
p { font-size:15px; color:#374151; margin-bottom:14px; }
ul, ol { padding-left:22px; margin-bottom:14px; }
li { font-size:15px; color:#374151; margin-bottom:6px; }
strong { color:var(--navy); }

/* Highlight box */
.highlight {
  background:var(--cream); border-left:4px solid var(--gold);
  padding:16px 20px; border-radius:0 6px 6px 0; margin:20px 0;
}
.highlight p { margin:0; font-size:14px; color:var(--navy-lt); }

/* Alert box */
.alert {
  background:#FEF2F2; border:1px solid #FECACA;
  border-radius:6px; padding:16px 20px; margin:20px 0;
}
.alert-title {
  font-size:13px; font-weight:600; color:#B91C1C; margin-bottom:6px;
}
.alert p { font-size:13px; color:#7F1D1D; margin:0; }

/* Info box */
.info-box {
  background:#EFF6FF; border:1px solid #BFDBFE;
  border-radius:6px; padding:16px 20px; margin:20px 0;
}
.info-box p { font-size:13px; color:#1E40AF; margin:0; }

/* Table */
table {
  width:100%; border-collapse:collapse; margin:20px 0; font-size:14px;
}
th {
  background:var(--navy-mid); color:var(--gold);
  font-family:var(--mono); font-size:10px; font-weight:500;
  letter-spacing:0.06em; text-transform:uppercase;
  padding:10px 14px; text-align:left;
}
td { padding:10px 14px; color:#374151; border-bottom:1px solid var(--cream-dk); }
tr:nth-child(even) td { background:var(--cream); }

/* Revocation box */
.revoke-box {
  background: linear-gradient(135deg, var(--navy-mid), var(--navy));
  border:1px solid var(--gold); border-radius:8px;
  padding:28px 32px; margin:28px 0;
}
.revoke-title {
  font-family:var(--serif); font-size:20px; font-weight:700;
  color:var(--gold); margin-bottom:10px;
}
.revoke-text { font-size:14px; color:var(--gray-lt); margin-bottom:16px; }
.revoke-steps { list-style:none; padding:0; }
.revoke-steps li {
  font-size:13px; color:var(--cream); margin-bottom:8px;
  display:flex; align-items:flex-start; gap:10px;
}
.revoke-steps li::before {
  content:'→'; color:var(--gold); flex-shrink:0; margin-top:1px;
}

/* Footer */
footer {
  background:var(--navy);
  padding:32px 48px;
  display:flex; align-items:center; justify-content:space-between;
  flex-wrap:wrap; gap:16px;
}
footer p { font-family:var(--mono); font-size:11px; color:var(--gray); margin:0; }
footer a { color:var(--gold); text-decoration:none; }

/* Responsive */
@media(max-width:768px){
  nav, footer { padding:16px 20px; }
  footer { flex-direction:column; gap:8px; }

  .hero { padding:40px 20px 32px; }
  .hero-title { font-size:26px; }
  .hero-meta { gap:12px; }

  .content { padding:32px 16px 60px; }
  .toc { padding:18px 16px; }

  table { display:block; overflow-x:auto; -webkit-overflow-scrolling:touch; }

  .revoke-box { padding:20px 16px; }
  .revoke-steps li { font-size:13px; flex-wrap:wrap; }
  .revoke-steps li strong { white-space:normal; word-break:break-word; }

  .highlight, .alert, .info-box { padding:14px 16px; }
  h2 { font-size:22px; }
}