/* ====== INICIO: COPIA EXACTA DEL CSS DE agencia3.html ====== */
        :root {
            --bg-color: #111111;
            --text-color: #FFFFFF;
            --subtext-color: #CCCCCC;
            --accent-color: #FFB000;
            --accent-dark: #E59E00;
            --section-bg: #1C1C1C;
            --card-bg: #2C2C2C;
            --footer-bg: #11111C;
            --transition-speed: 0.4s;
            --container-padding: 0 2rem;
            --section-padding-y: 7rem; /* Padding para secciones normales */
            --gap-large: 4rem;
            --gap-medium: 2.5rem;
            --gap-small: 1.5rem;
            --border-thickness: 2px;
            --animation-duration: 0.8s;
        }
        * { margin: 0; padding: 0; box-sizing: border-box; }
        html { scroll-behavior: smooth; }
        body {
            font-family: 'Roboto', sans-serif;
            background-color: var(--bg-color);
            color: var(--text-color);
            line-height: 1.7;
            font-size: 1rem;
            min-height: 100vh;
            overflow-x: hidden;
            display: flex; /* Ayuda a empujar el footer hacia abajo */
            flex-direction: column; /* Asegura el flujo vertical */
        }
        main {
            flex-grow: 1; /* Hace que el contenido principal ocupe el espacio disponible */
        }
        a { color: inherit; text-decoration: none; transition: color var(--transition-speed), opacity var(--transition-speed); }
        a:hover { color: var(--accent-color); opacity: 1; }
        .container { width: 90%; max-width: 1200px; margin: 0 auto; padding: var(--container-padding); }
        img { max-width: 100%; height: auto; display: block; }

        /* === Estilos Header (copiados de agencia3.html) === */
        header {
            position: sticky; /* Cambiado a sticky para que no solape el título inicial */
            top: 0; left: 0; width: 100%; z-index: 100;
            background: rgba(17, 17, 17, 0.95); backdrop-filter: blur(10px);
            padding: 1rem 0; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.4);
            transition: background 0.3s ease;
        }
        .nav { display: flex; justify-content: space-between; align-items: center; }
        .logo { font-family: 'Montserrat', sans-serif; font-size: 1.8rem; font-weight: 700; color: var(--accent-color); flex-shrink: 0; display: flex; align-items: center; transition: opacity var(--transition-speed); }
        .logo:hover { opacity: 0.9; }
        header .nav .logo img { display: block; height: 50px; width: auto; transition: height 0.3s ease; }
        .nav ul { list-style: none; display: flex; gap: var(--gap-medium); margin: 0; padding: 0; }
        .nav ul li a { font-weight: 500; font-size: 1rem; position: relative; padding: 0.5rem 0; }
        .nav ul li a::after { content: ''; position: absolute; bottom: 0; left: 50%; width: 0; height: 2px; background-color: var(--accent-color); transition: all var(--transition-speed) ease-out; transform: translateX(-50%); }
        .nav ul li a:hover::after { width: 100%; left: 0; transform: translateX(0%); }
        .hamburger { display: none; background: none; border: none; cursor: pointer; font-size: 1.9rem; color: var(--text-color); z-index: 101; padding: 0.5rem; transition: color var(--transition-speed), transform 0.3s ease; position: relative; width: 30px; height: 30px; }
        .hamburger:hover { color: var(--accent-color); }
        .hamburger i { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); transition: opacity 0.3s ease, transform 0.3s ease; }
        .hamburger i.fa-bars { opacity: 1; transform: translate(-50%, -50%) rotate(0deg); }
        .hamburger i.fa-times { opacity: 0; transform: translate(-50%, -50%) rotate(-90deg); }
        .hamburger.active i.fa-bars { opacity: 0; transform: translate(-50%, -50%) rotate(90deg); }
        .hamburger.active i.fa-times { opacity: 1; transform: translate(-50%, -50%) rotate(0deg); }
        .header-contact-btn { display: inline-block; background: var(--accent-color); color: var(--bg-color); padding: 0.6rem 1.5rem; border-radius: 50px; font-weight: 600; font-size: 0.9rem; transition: background var(--transition-speed), transform 0.2s ease, box-shadow var(--transition-speed); box-shadow: 0 3px 10px rgba(255, 176, 0, 0.2); }
        .header-contact-btn:hover { background: var(--accent-dark); transform: translateY(-2px); box-shadow: 0 4px 12px rgba(255, 176, 0, 0.3); color: var(--bg-color); opacity: 1; }
        .nav ul#nav-menu { display: flex; }
        .mobile-contact-link { display: none; }
        @media (max-width: 768px) {
            .nav ul#nav-menu { display: flex; position: fixed; top: 0; right: -100%; left: auto; width: 80%; max-width: 300px; height: 100vh; background: rgba(17, 17, 17, 0.98); backdrop-filter: blur(10px); flex-direction: column; align-items: center; justify-content: center; gap: var(--gap-medium); padding-top: 80px; overflow-y: auto; transition: right var(--transition-speed) ease-in-out; z-index: 100; }
            .nav ul#nav-menu.nav-active { right: 0; }
            .nav ul li a::after { display: none; }
            .nav ul li a { font-size: 1.4rem; font-weight: 500; padding: 0.5rem 0; }
            .hamburger { display: block; }
            .header-contact-btn { display: none; }
            .mobile-contact-link { display: block; margin-top: 1.5rem; }
            .mobile-contact-link a.btn { display: inline-block; background: var(--accent-color); color: var(--bg-color); padding: 0.8rem 2rem; border-radius: 50px; font-weight: 600; font-size: 1.1rem; transition: background var(--transition-speed), transform 0.2s ease; }
            .mobile-contact-link a.btn:hover { background: var(--accent-dark); transform: scale(1.05); color: var(--bg-color); opacity: 1; }
            /* Orden links móvil (ajusta según necesites) */
            .nav ul li:has(a[href="agencia3.html#about"]) { order: 1; }
            .nav ul li:has(a[href="agencia3.html#services"]) { order: 2; }
            .nav ul li:has(a[href="agencia3.html#staff"]) { order: 3; }
            .nav ul li:has(a[href="agencia3.html#pricing"]) { order: 4; }
            .nav ul .mobile-contact-link { order: 5; }
        }

        /* === Estilos Footer (copiados de agencia3.html) === */
        footer { background: var(--section-bg); padding: 4rem 0 2rem; text-align: center; color: var(--subtext-color); font-size: 0.9rem; position: relative; z-index: 1; border-top: 1px solid rgba(255, 176, 0, 0.1); margin-top: auto; /* Asegura que esté al final */ }
        .social-icons { margin: 1.8rem 0 2.5rem; display: flex; justify-content: center; gap: var(--gap-medium); }
        .social-icons a { width: 50px; height: 50px; background: var(--card-bg); border-radius: 50%; display: inline-flex; justify-content: center; align-items: center; color: var(--subtext-color); font-size: 1.6rem; box-shadow: 0 4px 10px rgba(0, 0, 0, 0.4); border: 1px solid transparent; opacity: 1; /* Visibles por defecto en páginas de políticas */ transition: background var(--transition-speed) ease, color var(--transition-speed) ease, transform 0.3s ease, box-shadow var(--transition-speed) ease; }
        .social-icons a:hover { background: var(--accent-color); color: var(--bg-color); transform: translateY(-5px) scale(1.1); box-shadow: 0 6px 15px rgba(255, 176, 0, 0.4); border-color: rgba(255, 255, 255, 0.1); opacity: 1; }
        .footer-links { margin-top: 1.5rem; margin-bottom: 1.5rem; font-size: 0.85rem; color: var(--subtext-color); opacity: 1; /* Visible por defecto */ }
        .footer-links a { color: var(--subtext-color); margin: 0 0.8rem; transition: color var(--transition-speed); }
        .footer-links a:hover { color: var(--accent-color); text-decoration: underline; }
        footer p.copyright { margin-top: 0; color: var(--subtext-color); font-size: 0.9rem; opacity: 1; /* Visible por defecto */ }
        @media (max-width: 768px) {
             .footer-links { font-size: 0.8rem; margin: 1.2rem 0; }
             .footer-links a { margin: 0 0.6rem; }
        }
         @media (max-width: 480px) {
             footer { padding: 2.5rem 0 1.5rem; }
             .social-icons { gap: 1.2rem; margin-bottom: 2rem; }
             .social-icons a { width: 40px; height: 40px; font-size: 1.2rem; }
             .footer-links { display: flex; flex-direction: column; gap: 0.5rem; margin: 1rem 0; font-size: 0.9rem; }
             .footer-links a { margin: 0; }
         }


        /* === Estilos específicos para páginas de políticas === */
        .policy-section {
            padding: calc(var(--section-padding-y) / 2) 0; /* Menos padding vertical */
            background-color: var(--section-bg); /* Fondo oscuro para el contenido */
            color: var(--subtext-color);
        }
        .policy-section .container {
            max-width: 900px; /* Ancho de contenido más legible */
        }
        .policy-section h1 {
            font-family: 'Montserrat', sans-serif;
            font-size: 3rem; /* Tamaño H1 */
            color: var(--accent-color); /* Título principal en color acento */
            text-align: center;
            margin-bottom: 2.5rem;
            padding-top: 3rem; /* Espacio arriba después del header sticky */
        }
        .policy-section h2 {
            font-family: 'Montserrat', sans-serif;
            font-size: 1.8rem; /* Tamaño H2 */
            color: var(--text-color); /* Títulos de sección en blanco */
            margin-top: 2.5rem;
            margin-bottom: 1rem;
            padding-bottom: 0.5rem;
            border-bottom: 2px solid var(--accent-color); /* Subrayado */
            text-align: left; /* Alinear a la izquierda */
        }
         .policy-section h3 {
            font-family: 'Montserrat', sans-serif;
            font-size: 1.4rem; /* Tamaño H3 */
            color: var(--text-color);
            margin-top: 2rem;
            margin-bottom: 0.8rem;
             text-align: left;
        }
        .policy-section p, .policy-section li {
            font-size: 1rem;
            line-height: 1.8;
            margin-bottom: 1rem;
             text-align: justify; /* Justificar texto para mejor lectura */
        }
        .policy-section ul {
            list-style: disc;
            padding-left: 2rem; /* Indentación para listas */
            margin-bottom: 1rem;
        }
         .policy-section a { /* Estilo específico para enlaces dentro del texto */
             color: var(--accent-color);
             text-decoration: underline;
         }
         .policy-section a:hover {
              color: var(--accent-dark);
              opacity: 1;
         }

         /* Responsive para políticas */
         @media (max-width: 768px) {
             .policy-section h1 { font-size: 2.5rem; margin-bottom: 2rem; padding-top: 2rem; }
             .policy-section h2 { font-size: 1.6rem; }
             .policy-section h3 { font-size: 1.3rem; }
             .policy-section p, .policy-section li { font-size: 0.95rem; }
         }
          @media (max-width: 480px) {
             .policy-section { padding: calc(var(--section-padding-y) / 3) 0; }
             .policy-section h1 { font-size: 2rem; margin-bottom: 1.5rem; padding-top: 1.5rem;}
             .policy-section h2 { font-size: 1.4rem; }
             .policy-section h3 { font-size: 1.2rem; }
          }

        /* ====== FIN: COPIA EXACTA DEL CSS DE agencia3.html ====== */