/* ═══════════════════════════════════════════
   SUBVEN SOLAR · páginas legales
   Se carga DESPUÉS de solar.css: reutiliza sus tokens,
   header, footer, botones y FAB. Aquí solo va lo propio
   de Política de Privacidad y Términos del Servicio.
═══════════════════════════════════════════ */

/* ═══════════════════════════════════════════
   PAGE HERO · azul noche con trama de células
═══════════════════════════════════════════ */
.page-hero{
  position:relative; overflow:hidden;
  padding:88px 0 80px;
  background:var(--cells), var(--night-900);
  color:#fff;
}
@media(max-width:900px){.page-hero{padding:60px 0 56px;}}
/* Sol saliendo por la esquina */
.page-hero::before{
  content:''; position:absolute; top:-220px; right:-160px;
  width:620px; height:620px; border-radius:50%;
  background:radial-gradient(circle, rgba(251,176,36,.38) 0%, rgba(255,122,26,.14) 40%, transparent 70%);
  pointer-events:none;
}
.page-hero::after{
  content:''; position:absolute; left:0; right:0; bottom:0; height:3px;
  background:var(--sun-grad);
}
.page-hero .wrap{position:relative; z-index:1;}

.crumb{
  display:flex; align-items:center; gap:8px;
  font-size:.84rem; color:rgba(255,255,255,.55);
  margin-bottom:26px;
}
.crumb a{color:rgba(255,255,255,.55); transition:color .2s;}
.crumb a:hover{color:var(--sun-300);}
.crumb .sep{color:rgba(255,255,255,.3);}
.crumb .here{color:#fff; font-weight:600;}

.page-hero .eyebrow{color:var(--sun-300); margin-bottom:16px;}
.page-hero h1{
  color:#fff;
  font-size:clamp(2.2rem, 4.6vw, 3.4rem);
  line-height:1.05; letter-spacing:-.035em;
  font-weight:800;
  margin-bottom:20px;
  max-width:780px;
}
.page-hero .intro{
  font-size:1.08rem;
  color:rgba(255,255,255,.72);
  max-width:700px;
  line-height:1.7;
}
.page-hero .intro strong{color:#fff; font-weight:600;}

.meta{display:flex; flex-wrap:wrap; gap:10px 12px; margin-top:30px;}
.meta-chip{
  display:inline-flex; align-items:center; gap:8px;
  font-size:.82rem; font-weight:600;
  color:var(--sun-200);
  background:rgba(251,176,36,.1);
  border:1px solid rgba(251,176,36,.28);
  padding:8px 14px; border-radius:100px;
}
.meta-chip svg{width:14px; height:14px;}

/* ═══════════════════════════════════════════
   LEGAL LAYOUT · índice + contenido
═══════════════════════════════════════════ */
.legal{padding:72px 0 110px;}
.legal-grid{
  display:grid;
  grid-template-columns:270px 1fr;
  gap:64px;
  align-items:start;
}
@media(max-width:1024px){.legal-grid{grid-template-columns:1fr; gap:32px;}}

/* Índice */
.toc{
  position:sticky; top:96px;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  padding:22px 16px;
  box-shadow:var(--shadow-1);
}
@media(max-width:1024px){.toc{position:static;}}
.toc-title{
  display:flex; align-items:center; gap:10px;
  font-size:.74rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase;
  color:var(--sun-700);
  padding:0 10px 14px; margin-bottom:8px;
  border-bottom:1px solid var(--line-2);
}
.toc-title::before{
  content:''; width:9px; height:9px; border-radius:50%;
  background:var(--sun-400);
  box-shadow:0 0 0 4px rgba(251,176,36,.22);
}
.toc ol{list-style:none;}
.toc a{
  display:flex; align-items:flex-start; gap:12px;
  padding:10px 12px;
  border-radius:12px;
  font-size:.9rem; font-weight:500; line-height:1.45;
  color:var(--text);
  transition:background .2s var(--ease), color .2s var(--ease);
}
.toc a:hover{background:var(--sun-50); color:var(--ink);}
.toc a .num{
  flex-shrink:0; padding-top:2px;
  font-variant-numeric:tabular-nums;
  font-size:.74rem; font-weight:700; letter-spacing:.04em;
  color:var(--soft);
  transition:color .2s;
}
.toc a.active{background:var(--night-800); color:#fff; font-weight:600;}
.toc a.active .num{color:var(--sun-300);}

/* Contenido */
.content{max-width:800px;}
.content section{
  scroll-margin-top:100px;
  padding-bottom:52px; margin-bottom:52px;
  border-bottom:1px solid var(--line);
}
.content section:last-of-type{border-bottom:none; margin-bottom:0; padding-bottom:0;}

.sec-head{display:flex; align-items:center; gap:16px; margin-bottom:24px;}
.chip-num{
  flex-shrink:0;
  display:inline-flex; align-items:center; justify-content:center;
  width:48px; height:48px; border-radius:50%;
  font-family:var(--font-display);
  font-variant-numeric:tabular-nums;
  font-size:.95rem; font-weight:800;
  color:var(--sun-300);
  background:var(--night-800);
  box-shadow:0 0 0 5px var(--sun-100);
}
.content h2{font-size:clamp(1.45rem, 2.5vw, 1.85rem); letter-spacing:-.03em;}
.content h3{
  font-size:1.08rem; letter-spacing:-.015em;
  margin:26px 0 10px;
}
.content h3:first-child, .sec-head + h3{margin-top:4px;}

.content p{margin-bottom:14px; font-size:1rem; line-height:1.75;}
.content p:last-child{margin-bottom:0;}
.content strong{color:var(--ink); font-weight:700;}
.content code{
  font-size:.88em; padding:2px 6px; border-radius:6px;
  background:var(--surface-2); color:var(--ink);
}
.content a.inline{
  color:var(--sun-700); font-weight:600;
  border-bottom:1.5px solid var(--sun-200);
  transition:border-color .2s, color .2s;
}
.content a.inline:hover{color:var(--sun-800); border-bottom-color:var(--sun-500);}

.content ul, .content ol{list-style:none; margin:8px 0 18px;}
.content ul li, .content ol li{
  position:relative;
  padding:6px 0 6px 28px;
  font-size:.98rem; line-height:1.65;
}
.content ul li::before{
  content:''; position:absolute; left:4px; top:15px;
  width:9px; height:9px; border-radius:50%;
  background:var(--sun-400);
  box-shadow:0 0 0 3px rgba(251,176,36,.2);
}
.content ol{counter-reset:item;}
.content ol li{counter-increment:item;}
.content ol li::before{
  content:counter(item, decimal-leading-zero);
  position:absolute; left:0; top:7px;
  font-family:var(--font-display);
  font-variant-numeric:tabular-nums;
  font-size:.82rem; font-weight:800;
  color:var(--sun-700);
}

/* Tablas */
.tbl-wrap{
  margin:20px 0 24px;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:var(--radius);
  overflow:hidden;
  box-shadow:var(--shadow-1);
}
.tbl{width:100%; border-collapse:collapse; font-size:.94rem;}
.tbl thead{background:var(--night-800);}
.tbl th, .tbl td{
  text-align:left; vertical-align:top;
  padding:14px 18px;
  border-bottom:1px solid var(--line-2);
}
.tbl th{
  color:#fff; font-weight:700;
  font-size:.74rem; text-transform:uppercase; letter-spacing:.12em;
  border-bottom:none;
}
.tbl tbody tr:last-child td{border-bottom:none;}
.tbl tbody tr{transition:background .2s;}
.tbl tbody tr:hover{background:var(--sun-50);}
.tbl td{color:var(--text);}
@media(max-width:640px){
  .tbl, .tbl thead, .tbl tbody, .tbl tr, .tbl th, .tbl td{display:block;}
  .tbl thead{display:none;}
  .tbl tr{border-bottom:1px solid var(--line); padding:10px 4px;}
  .tbl tbody tr:last-child{border-bottom:none;}
  .tbl td{border:none; padding:5px 16px;}
  .tbl td::before{
    content:attr(data-label);
    display:block; margin-bottom:2px;
    font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:.1em;
    color:var(--sun-700);
  }
}

/* Avisos */
.callout{
  display:flex; gap:14px; align-items:flex-start;
  margin:22px 0 24px;
  padding:18px 22px;
  border-radius:var(--radius);
  background:var(--sun-50);
  border:1px solid var(--sun-100);
  border-left:4px solid var(--sun-400);
}
.callout svg{flex-shrink:0; width:20px; height:20px; margin-top:3px; color:var(--sun-700);}
.callout p{margin-bottom:0; font-size:.95rem; color:var(--ink);}
.callout p + p{margin-top:8px;}
.callout.info{background:var(--sky-50); border-color:#d3e2f4; border-left-color:var(--sky);}
.callout.info svg{color:var(--sky);}

/* Dos columnas (obligaciones de las partes) */
.two-col{
  display:grid; grid-template-columns:1fr 1fr; gap:18px;
  margin:20px 0 24px;
}
@media(max-width:720px){.two-col{grid-template-columns:1fr;}}
.col-card{
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  padding:22px 24px;
  box-shadow:var(--shadow-1);
}
.col-card h4{
  font-family:var(--font);
  font-size:.74rem; font-weight:700; text-transform:uppercase; letter-spacing:.16em;
  color:var(--sun-700); margin-bottom:12px;
}
.col-card ul{margin:0;}

/* ═══════════════════════════════════════════
   CTA final · ¿dudas?
═══════════════════════════════════════════ */
.legal-cta{
  display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap;
  margin-top:64px;
  padding:32px 36px;
  border-radius:var(--radius-lg);
  background:var(--cells), var(--night-800);
  color:#fff;
  position:relative; overflow:hidden;
}
.legal-cta::before{
  content:''; position:absolute; right:-80px; top:-120px;
  width:280px; height:280px; border-radius:50%;
  background:radial-gradient(circle, rgba(251,176,36,.35), transparent 70%);
  pointer-events:none;
}
.legal-cta > *{position:relative;}
.legal-cta h3{color:#fff; font-size:1.35rem; margin:0 0 6px;}
.legal-cta p{color:rgba(255,255,255,.68); margin:0; font-size:.96rem;}
.legal-cta-actions{display:flex; gap:10px; flex-wrap:wrap;}