/* ============================================================
   10-LEGAL.CSS — Páginas Legales (Aviso, Privacidad, Cookies)
   dimonix.gg
   ============================================================ */

/* ── 1. LAYOUT PRINCIPAL ── */
.legal-flex-layout {
    display: flex; flex-direction: column;
    height: 100vh; width: 100%;
    padding-top: var(--header-height);
    overflow: hidden;
    background-color: #050505;
    position: relative;
}

/* ── 2. FONDO (imagen desaturada) ── */
.legal-flex-layout .hero-bg-grid {
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background-image: url("../../img/fondo.webp");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    opacity: 0.2;
    filter: grayscale(100%);
    z-index: 0;
    pointer-events: none;
}

/* ── 3. ZONA SCROLLABLE ── */
.legal-scroll-area {
    flex: 1; overflow-y: auto;
    padding: 40px 20px;
    position: relative; z-index: 2;
    scroll-behavior: smooth;
}
.legal-scroll-area::-webkit-scrollbar       { width: 8px; }
.legal-scroll-area::-webkit-scrollbar-track { background: rgba(0,0,0,0.1); }
.legal-scroll-area::-webkit-scrollbar-thumb { background: var(--brand-primary); border-radius: 4px; }

/* ── 4. CONTENEDOR Y CAJA DE TEXTO ── */
.legal-content-container { max-width: 900px; margin: 0 auto; text-align: center; }
.legal-header            { margin-bottom: 50px; }

.legal-text-box {
    background: rgba(0,0,0,0.85);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 16px;
    padding: 50px; text-align: left;
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    margin-bottom: 20px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.6);
}
.legal-text-box h3                { font-family: var(--font-headings); color: var(--brand-primary); font-size: 1.3rem; margin-top: 30px; margin-bottom: 15px; text-transform: uppercase; }
.legal-text-box h3:first-child    { margin-top: 0; }
.legal-text-box p, .legal-text-box ul { color: #ccc; font-size: 1rem; line-height: 1.7; margin-bottom: 20px; }
.legal-text-box strong            { color: #fff; }
.legal-text-box ul                { padding-left: 20px; list-style: disc inside; }
.legal-text-box a                 { text-decoration: underline; }

/* ── 5. FOOTER FIJO ── */
.legal-scroll-area, .fixed-footer-wrapper { position: relative; z-index: 2; }

/* ── 6. RESPONSIVE LEGAL ── */

/* 2K / 4K */
@media (min-width: 1921px) {
    .legal-content-container { max-width: 1200px; }
    .legal-text-box          { padding: 70px; }
    .legal-text-box h3       { font-size: 1.8rem; }
    .legal-text-box p, .legal-text-box ul { font-size: 1.2rem; }
}

/* Tablet (≤ 768px) */
@media (max-width: 768px) {
    .legal-text-box    { padding: 30px 20px; }
    .legal-scroll-area { padding-bottom: 80px; }
}

/* Móvil (≤ 480px) */
@media (max-width: 480px) {
    .legal-text-box          { padding: 20px 15px; border-radius: 8px; }
    .legal-content-container { padding: 0 5px; }
    .legal-text-box h3       { font-size: 1.1rem; }
    .legal-text-box p, .legal-text-box ul { font-size: 0.95rem; }
}