/* Documentos legales de Altodos. Extiende la identidad visual de styles.css. */
.legal-page{background:var(--blanco)}
.legal-page .nav__links a[aria-current="page"]{color:var(--navy)}
.legal-page .nav__links a[aria-current="page"]::after{transform:scaleX(1)}

.legal-main{min-height:calc(100vh - var(--nav-h)); padding-bottom:clamp(4rem,8vw,7rem)}
.legal-hero{
  position:relative; overflow:hidden; padding:clamp(3rem,7vw,5.75rem) 0 clamp(2.75rem,5vw,4.5rem);
  border-bottom:1px solid var(--line);
}
.legal-hero::before{
  content:""; position:absolute; width:min(34rem,70vw); aspect-ratio:1; right:-12rem; top:-18rem;
  border-radius:50%; background:radial-gradient(circle,rgba(14,142,104,.14),transparent 69%); pointer-events:none;
}
.legal-hero::after{
  content:""; position:absolute; width:min(30rem,64vw); aspect-ratio:1; left:-13rem; bottom:-22rem;
  border-radius:50%; background:radial-gradient(circle,rgba(255,55,27,.12),transparent 69%); pointer-events:none;
}
.legal-hero__inner{position:relative; z-index:1; max-width:52rem}
.legal-breadcrumb{
  display:inline-flex; align-items:center; gap:.5rem; min-height:44px; margin-bottom:1.1rem;
  color:var(--ink-2); font-size:.9rem; font-weight:700;
}
.legal-breadcrumb svg{width:17px; height:17px; color:var(--rojo)}
.legal-breadcrumb:hover{color:var(--navy)}
.legal-title{
  max-width:15ch; font-family:var(--display); font-size:clamp(2.35rem,6vw,4.6rem);
  font-weight:800; line-height:1.04; letter-spacing:-.045em;
}
.legal-intro{max-width:43rem; margin-top:1.25rem; color:var(--ink-2); font-size:clamp(1rem,1.7vw,1.14rem)}
.legal-meta{display:flex; flex-wrap:wrap; gap:.65rem 1rem; margin-top:1.6rem; color:var(--ink-3); font-size:.84rem}
.legal-meta span{display:inline-flex; align-items:center; gap:.45rem}
.legal-meta span::before{content:""; width:6px; height:6px; border-radius:50%; background:var(--verde)}

.legal-layout{
  display:grid; grid-template-columns:minmax(0,1fr) 15.5rem; align-items:start;
  gap:clamp(2.5rem,6vw,5.5rem); padding-top:clamp(2.75rem,6vw,5rem);
}
.legal-article{max-width:47rem}
.legal-section{scroll-margin-top:calc(var(--nav-h) + 24px)}
.legal-section+.legal-section{margin-top:clamp(2.2rem,5vw,3.35rem); padding-top:clamp(2rem,4vw,2.8rem); border-top:1px solid var(--line)}
.legal-section h2{
  margin-bottom:.9rem; font-family:var(--display); font-size:clamp(1.35rem,2.6vw,1.75rem);
  font-weight:800; line-height:1.22; letter-spacing:-.025em;
}
.legal-section h3{margin:1.4rem 0 .55rem; font-family:var(--display); font-size:1rem; font-weight:800}
.legal-section p,.legal-section li{color:var(--ink-2); font-size:1rem; line-height:1.75}
.legal-section p+p{margin-top:1rem}
.legal-section ul{display:grid; gap:.7rem; margin-top:1rem}
.legal-section li{position:relative; padding-left:1.2rem}
.legal-section li::before{content:""; position:absolute; left:0; top:.7em; width:6px; height:6px; border-radius:50%; background:var(--rojo)}
.legal-section a{color:var(--navy); font-weight:700; text-decoration:underline; text-decoration-color:var(--navy-16); text-underline-offset:3px}
.legal-section a:hover{text-decoration-color:var(--rojo)}

.legal-note{
  margin:1.35rem 0; padding:1.15rem 1.25rem; border:1px solid var(--navy-16);
  border-left:4px solid var(--navy); border-radius:var(--r-md); background:var(--navy-04);
}
.legal-note p{color:var(--ink)}
.legal-note--privacy{border-color:var(--verde-12); border-left-color:var(--verde); background:var(--verde-06)}

.legal-toc{position:sticky; top:calc(var(--nav-h) + 1.5rem); border-left:1px solid var(--line); padding-left:1.25rem}
.legal-toc strong{
  display:block; margin-bottom:.8rem; color:var(--ink-3); font-family:var(--display);
  font-size:.73rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase;
}
.legal-toc ol{display:grid; gap:.15rem; counter-reset:legal-section}
.legal-toc li{counter-increment:legal-section}
.legal-toc a{
  display:grid; grid-template-columns:1.4rem 1fr; gap:.3rem; padding:.42rem 0;
  color:var(--ink-2); font-size:.87rem; line-height:1.35; transition:color .2s,transform .2s;
}
.legal-toc a::before{content:counter(legal-section,decimal-leading-zero); color:var(--ink-3); font-size:.7rem; padding-top:.16rem}
.legal-toc a:hover{color:var(--rojo); transform:translateX(3px)}

.legal-end{
  display:flex; align-items:center; justify-content:space-between; gap:1.25rem; margin-top:clamp(2.75rem,6vw,4.5rem);
  padding:1.4rem; border:1px solid var(--line); border-radius:var(--r-lg); background:var(--blanco);
}
.legal-end__mark{display:flex; align-items:center; gap:.9rem}
.legal-end__mark img{width:46px; height:46px; border-radius:14px}
.legal-end__mark strong{display:block; font-family:var(--display); font-size:1rem}
.legal-end__mark span{display:block; color:var(--ink-3); font-size:.84rem}

@media (max-width:860px){
  .legal-layout{grid-template-columns:1fr}
  .legal-toc{position:static; order:-1; border-left:0; border-bottom:1px solid var(--line); padding:0 0 1.5rem}
  .legal-toc ol{grid-template-columns:repeat(2,minmax(0,1fr)); gap:.15rem 1rem}
}
@media (max-width:640px){
  .legal-hero{padding-top:2.4rem}
  .legal-title{font-size:clamp(2.15rem,12vw,3.05rem)}
  .legal-toc ol{grid-template-columns:1fr}
  .legal-section p,.legal-section li{font-size:.96rem; line-height:1.7}
  .legal-end{align-items:flex-start; flex-direction:column}
  .legal-end .btn{width:100%}
}
