/* ================= VARIABLES GLOBALES ================= */
    :root {
      --brand-dark: #1A2530;   
      --brand-cyan: #00B4D8;   
      --glass-bg: rgba(255, 255, 255, 0.85);
      --glass-border: rgba(26, 37, 48, 0.05); 
      --w: #fcfdfe;
      --f-text: #4a5568;        
      --f-border: #eaeaea;      
      --text-main: #1d2d42;
      --title-color: var(--brand-dark);
      --video-overlay: rgba(245, 247, 250, 0.88);
    }

    body.dark-theme {
      --w: #0a0f18; 
      --glass-bg: rgba(15, 23, 42, 0.85); 
      --glass-border: rgba(255, 255, 255, 0.1);
      --brand-dark: #f8fafc;
      --f-text: #94a3b8; 
      --f-border: rgba(255,255,255,0.08); 
      --text-main: #f1f5f9;
      --title-color: #ffffff;
      --video-overlay: rgba(10, 15, 24, 0.92);
    }

    * { box-sizing: border-box; margin: 0; padding: 0; }
    html, body { margin: 0; padding: 0; scroll-behavior: smooth; overflow-x: hidden !important; }
    body { font-family: Inter, sans-serif; color: var(--text-main); background-color: var(--w); transition: background-color 0.4s ease, color 0.4s ease; line-height: 1.9; }
    
    #mainContentWrapper { position: relative; display: flex; flex-direction: column; width: 100%; max-width: 100vw; min-height: 100vh; overflow-x: hidden !important; }

    /* ================= FONDO DE VIDEO EXCLUSIVO ================= */
    .video-background-container { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; z-index: -2; overflow: hidden; background-color: #1A2530;}
    .video-background-container video { min-width: 100%; min-height: 100%; width: auto; height: auto; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); object-fit: cover; }
    .video-overlay { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; background-color: var(--video-overlay); z-index: -1; transition: background-color 0.4s ease; }

    /* ================= BOTÓN TEMA OSCURO FLOTANTE ================= */
    .theme-toggle-floating { position: fixed; top: 20px; right: 20px; background: var(--glass-bg); backdrop-filter: blur(10px); border: 1px solid var(--glass-border); width: 45px; height: 45px; border-radius: 50%; font-size: 18px; color: var(--brand-dark); cursor: pointer; display: flex; justify-content: center; align-items: center; z-index: 9999; transition: all 0.3s ease; box-shadow: 0 10px 20px rgba(0,0,0,0.1); }
    .theme-toggle-floating:hover { transform: scale(1.1); color: var(--brand-cyan); border-color: var(--brand-cyan); }
    body.dark-theme .theme-toggle-floating { color: #f8fafc; }

    /* ================= BOTÓN VOLVER ================= */
    .btn-back { display: inline-flex; align-items: center; gap: 8px; color: var(--text-muted); text-decoration: none; font-size: 13px; font-weight: 700; margin-bottom: 20px; transition: 0.3s; text-transform: uppercase; letter-spacing: 1px; font-family: 'Montserrat', sans-serif; }
    .btn-back:hover { color: var(--brand-cyan); transform: translateX(-5px); }
    body.dark-theme .btn-back { color: var(--f-text); }
    body.dark-theme .btn-back:hover { color: var(--brand-cyan); }

    /* ================= CONTENIDO LEGAL ================= */
    .content-wrapper { position: relative; z-index: 10; max-width: 950px; margin: 0 auto; padding: 60px 20px 100px; width: 100%; flex-grow: 1;}

    .legal-header { text-align: center; margin-bottom: 50px; }
    .legal-header h1 { font-family: 'Playfair Display', serif; font-size: clamp(32px, 6vw, 55px); color: var(--title-color); line-height: 1.1; margin-bottom: 15px;}
    .legal-header .subtitle { font-family: 'Montserrat', sans-serif; font-size: 11px; font-weight: 800; color: var(--brand-cyan); text-transform: uppercase; letter-spacing: 4px; }

    .legal-document {
      background: var(--glass-bg);
      backdrop-filter: blur(25px);
      border: 1px solid var(--glass-border);
      border-radius: 24px;
      padding: 60px 70px;
      box-shadow: 0 30px 60px rgba(0,0,0,0.05);
      opacity: 1; transform: translateY(0); transition: all 0.8s cubic-bezier(0.16, 1, 0.3, 1);
    }
    
    body.is-live .legal-document.pre-animate { opacity: 0; transform: translateY(40px); }
    body.is-live .legal-document.visible { opacity: 1; transform: translateY(0); }

    .legal-intro {
      font-size: 15px;
      line-height: 1.8;
      color: var(--f-text);
      margin-bottom: 40px;
      text-align: center; 
      font-style: italic;
    }

    .legal-section {
      margin-bottom: 45px;
      padding-bottom: 40px;
      border-bottom: 1px solid var(--f-border);
    }
    .legal-section:last-child { border-bottom: none; margin-bottom: 0; padding-bottom: 0; }

    .section-title {
      display: flex;
      align-items: center;
      gap: 15px;
      margin-bottom: 20px;
    }
    
    .section-title .num {
      font-family: 'Playfair Display', serif;
      font-size: 28px;
      font-weight: 900;
      color: var(--brand-cyan);
      line-height: 1;
    }
    
    .section-title h2 {
      font-family: 'Montserrat', sans-serif;
      font-size: 18px;
      font-weight: 800;
      color: var(--title-color);
      text-transform: uppercase;
      letter-spacing: 1px;
      margin: 0;
    }
    
    .section-title i { color: var(--f-text); font-size: 20px; margin-left: auto; opacity: 0.3;}

    /* ALINEACIÓN JUSTIFICADA APLICADA AL TEXTO Y LISTAS */
    .legal-section p { 
      font-size: 15.5px; 
      color: var(--text-main); 
      line-height: 1.8; 
      margin-bottom: 15px; 
      text-align: justify; 
      text-justify: inter-word; 
    }
    
    .legal-section ul {
      list-style: none;
      padding: 0;
      margin: 0 0 20px 0;
    }
    
    .legal-section ul li {
      position: relative;
      display: block;
      font-size: 15px;
      color: var(--text-main);
      line-height: 1.6;
      margin-bottom: 12px;
      padding-left: 32px;
      text-align: left; 
      text-justify: auto; 
    }
    
    .legal-section ul li::before {
      content: '\f054';
      font-family: 'Font Awesome 6 Free';
      font-weight: 900;
      color: var(--brand-cyan);
      font-size: 11px;
      position: absolute;
      left: 10px;
      top: 0.45em;
    }

    @media (max-width: 768px) {
      .content-wrapper { padding-top: 50px; }
      .legal-document { padding: 40px 25px; border-radius: 20px;}
      .section-title { align-items: flex-start; flex-direction: column; gap: 5px;}
      .section-title i { display: none; }
      .legal-header h1 { font-size: 32px; }
    }