/* legal.css — extiende index.css. Cárgalo DESPUÉS de index.css */

.legal-hero{
    padding:150px var(--margin-mobile) 60px;
    border-bottom:1px solid rgba(68,71,72,.3);
    background:var(--void-black);
    position:relative;
}
@media(min-width:900px){ .legal-hero{padding:170px var(--margin-desktop) 72px;} }
.legal-eyebrow{
    font-family:var(--font-mono);font-size:11px;letter-spacing:.22em;font-weight:500;
    color:var(--cyber-green);display:flex;align-items:center;gap:10px;margin-bottom:18px;
}
.legal-eyebrow i{width:16px;height:2px;background:var(--cyber-green);display:inline-block;}
.legal-hero h1{
    font-family:var(--font-display);font-size:clamp(2.2rem,6vw,3.8rem);line-height:1;
    text-transform:uppercase;letter-spacing:.01em;margin-bottom:18px;color:var(--on-surface);
}
.legal-hero p{font-size:15px;line-height:1.7;color:var(--on-surface-variant);max-width:640px;}
.legal-updated{
    margin-top:22px;font-family:var(--font-mono);font-size:11px;letter-spacing:.08em;
    color:var(--outline);display:inline-block;border:1px solid var(--outline-variant);
    padding:6px 12px;
}

.legal-fillin{
    margin-top:26px;max-width:640px;background:rgba(255,77,0,.07);
    border-left:2px solid var(--racing-red);padding:16px 18px;
    font-family:var(--font-mono);font-size:12px;line-height:1.7;color:var(--on-surface-variant);
}
.legal-fillin strong{color:var(--racing-red);}

.legal-toc{
    position:sticky;top:64px;z-index:30;
    display:flex;gap:0;flex-wrap:wrap;
    background:rgba(19,19,19,.95);backdrop-filter:blur(10px);
    border-bottom:1px solid var(--outline-variant);
    padding:0 var(--margin-mobile);
}
@media(min-width:900px){ .legal-toc{padding:0 var(--margin-desktop);} }
.legal-toc a{
    font-family:var(--font-mono);font-size:11px;letter-spacing:.12em;font-weight:700;
    color:var(--on-surface-variant);padding:16px 18px;border-bottom:2px solid transparent;
    white-space:nowrap;transition:.15s;
}
.legal-toc a:hover{color:var(--on-surface);}
.legal-toc a.active{color:var(--cyber-green);border-bottom-color:var(--cyber-green);}

.legal-section{
    padding:64px var(--margin-mobile);
    border-bottom:1px solid rgba(68,71,72,.3);
    background:var(--surface);
    scroll-margin-top:120px;
}
@media(min-width:900px){ .legal-section{padding:80px var(--margin-desktop);} }
.legal-section:nth-child(odd){background:var(--void-black);}

.legal-section-head{max-width:760px;margin-bottom:36px;}
.legal-tag{
    font-family:var(--font-mono);font-size:10px;letter-spacing:.18em;font-weight:700;
    color:var(--cyber-green);display:block;margin-bottom:10px;
}
.legal-section-head h2{
    font-family:var(--font-display);font-size:clamp(1.7rem,4vw,2.6rem);
    text-transform:uppercase;letter-spacing:.01em;color:var(--on-surface);
}

.legal-body{max-width:760px;color:var(--on-surface-variant);font-size:14.5px;line-height:1.75;}
.legal-body h3{
    font-family:var(--font-mono);font-size:12px;letter-spacing:.1em;font-weight:700;
    color:var(--on-surface);text-transform:uppercase;margin:34px 0 12px;
    padding-bottom:8px;border-bottom:1px solid var(--outline-variant);
}
.legal-body h3:first-child{margin-top:0;}
.legal-body p{margin-bottom:14px;}
.legal-body ul{margin:0 0 14px 0;padding-left:20px;}
.legal-body li{margin-bottom:8px;}
.legal-body strong{color:var(--on-surface);font-weight:700;}
.legal-body a{color:var(--cyber-green);border-bottom:1px solid rgba(0,255,157,.35);}
.legal-body a:hover{border-color:var(--cyber-green);}

.legal-placeholder{color:var(--racing-red);font-weight:700;}

.legal-table{width:100%;border-collapse:collapse;margin:14px 0 20px;font-size:13px;}
.legal-table th,.legal-table td{
    text-align:left;padding:10px 12px;border:1px solid var(--outline-variant);
    vertical-align:top;
}
.legal-table th{
    font-family:var(--font-mono);font-size:10px;letter-spacing:.08em;
    color:var(--cyber-green);text-transform:uppercase;background:var(--surface-container);
}

.legal-back{
    display:inline-flex;align-items:center;gap:8px;margin-top:12px;
    font-family:var(--font-mono);font-size:11px;letter-spacing:.1em;font-weight:700;
    color:var(--on-surface-variant);
}
.legal-back:hover{color:var(--cyber-green);}