/* ==================== VARIABLES DE COLOR ==================== */
        :root {
            --color-gold: #c5a059;
            --color-gold-hover: #e0bb72;
            --color-dark: #10192b;
            --color-darker: #090e1a;
            --color-offwhite: #fdfbf7;
            --color-accent: #16223b;
        }

        /* ==================== TIPOGRAFÍA Y BASE ==================== */
        body {
            font-family: 'Inter', sans-serif;
            background-color: var(--color-offwhite);
            color: #333;
            scroll-behavior: smooth;
            overflow-x: clip;
        }

        h1, h2, h3, h4, h5, h6, .brand-font {
            font-family: 'Outfit', sans-serif;
        }

        .logo-font {
            font-family: 'Cinzel', serif;
        }

        /* ==================== UTILIDADES PERSONALIZADAS ==================== */
        .text-gold { color: var(--color-gold); }
        .bg-gold { background-color: var(--color-gold); }
        .bg-dark { background-color: var(--color-dark); }
        .bg-darker { background-color: var(--color-darker); }
        
        .hover-bg-gold:hover { background-color: var(--color-gold-hover); }

        .btn-gold-outline {
            border: 1px solid var(--color-gold);
            color: var(--color-gold);
            transition: all 0.3s ease;
        }

        .btn-gold-outline:hover {
            background-color: var(--color-gold);
            color: var(--color-darker);
        }

        .btn-gold-solid {
            background-color: var(--color-gold);
            color: var(--color-darker);
            transition: all 0.3s ease;
            font-weight: bold;
        }

        .btn-gold-solid:hover {
            background-color: var(--color-gold-hover);
        }

        /* ==================== SECCIÓN HERO ==================== */
        .hero-bg {
            background-color: var(--color-darker);
            position: relative;
            overflow: hidden;
            border-bottom: 2px solid var(--color-gold);
        }
        
        .hero-bg::before {
             content: '';
             position: absolute;
             top: 0; right: 0; bottom: 0; left: 0;
             background: radial-gradient(circle at center, rgba(22,34,59,0.85) 0%, rgba(9,14,26,1) 100%);
             z-index: 1;
        }

        .hero-content {
            position: relative;
            z-index: 3;
            width: 100%;
        }
        
        .hero-watermark {
            position: absolute;
            top: 0;
            left: 0;
            transform: none;
            opacity: 0.22;
            width: 100%;
            height: 100%;
            min-width: 100%;
            max-width: none;
            z-index: 2;
            pointer-events: none;
            mix-blend-mode: screen;
            filter: drop-shadow(0 0 50px rgba(197, 160, 89, 0.2));
            object-fit: cover;
            object-position: center;
        }


        /* ==================== LISTAS Y FORMULARIOS ==================== */
        .service-section {
            padding: 5rem 1rem;
            border-bottom: 1px solid #eaeaea;
        }
        
        .service-section:nth-child(even) {
            background-color: #f5f3ef;
        }

        .service-list li {
            position: relative;
            padding-left: 1.5rem;
            margin-bottom: 0.75rem;
            color: #444;
        }
        
        .service-list li::before {
            content: '•';
            color: var(--color-gold);
            position: absolute;
            left: 0;
            font-size: 1.5rem;
            line-height: 1;
            top: -4px;
        }

        .input-dark {
            background-color: #1a1a1a;
            border: 1px solid #333;
            color: white;
            transition: border-color 0.3s;
        }

        .input-dark:focus {
            outline: none;
            border-color: var(--color-gold);
        }
        
        /* ==================== NAVEGACIÓN Y CABECERAS ==================== */
        .sticky-header {
            position: -webkit-sticky;
            position: sticky;
            top: 0;
            z-index: 50;
            min-height: 4rem;
            background-color: var(--color-dark, #0b0b0d);
            box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.5);
            transform: translateZ(0);
        }

        .page-content {
            display: none;
            min-height: 60vh;
            animation: fadeIn 0.4s ease-in-out;
        }

        .page-content.active {
            display: block;
        }
        
        @keyframes fadeIn {
            from { opacity: 0; transform: translateY(10px); }
            to { opacity: 1; transform: translateY(0); }
        }
        
        .page-header {
            background-color: var(--color-darker);
            padding: 6rem 1rem;
            text-align: center;
            border-bottom: 2px solid var(--color-gold);
            position: relative;
            background-size: cover;
            background-position: center;
            background-attachment: fixed;
        }

        /* Imágenes de fondo para cabeceras */
        .bg-header-despacho { background-image: url('https://images.unsplash.com/photo-1605664041952-4a2855d9363b?ixlib=rb-4.0.3&auto=format&fit=crop&w=1920&q=80'); }
        .bg-header-extranjeria { background-image: url('https://images.unsplash.com/photo-1589829085413-56de8ae18c73?ixlib=rb-4.0.3&auto=format&fit=crop&w=1920&q=80'); }
        .bg-header-penal { background-image: url('https://images.unsplash.com/photo-1589391886645-d51941baf7fb?ixlib=rb-4.0.3&auto=format&fit=crop&w=1920&q=80'); }
        .bg-header-fiscal { background-image: url('https://images.unsplash.com/photo-1450101499163-c8848c66ca85?ixlib=rb-4.0.3&auto=format&fit=crop&w=1920&q=80'); }
        .bg-header-ubicacion { background-image: url('https://images.unsplash.com/photo-1589994965851-a8f479c573a9?ixlib=rb-4.0.3&auto=format&fit=crop&w=1920&q=80'); }
        .bg-header-videoconsulta { background-image: url('https://images.unsplash.com/photo-1505664177941-c66cf14bc49c?ixlib=rb-4.0.3&auto=format&fit=crop&w=1920&q=80'); }
        .bg-header-contacto { background-image: url('https://images.unsplash.com/photo-1497366216548-37526070297c?ixlib=rb-4.0.3&auto=format&fit=crop&w=1920&q=80'); }
        .bg-header-legal { background-image: url('https://images.unsplash.com/photo-1589829085413-56de8ae18c73?ixlib=rb-4.0.3&auto=format&fit=crop&w=1920&q=80'); }
        
        .page-header::before {
            content: '';
            position: absolute;
            top: 0; right: 0; bottom: 0; left: 0;
            background: linear-gradient(135deg, rgba(9, 14, 26, 0.92) 0%, rgba(22, 34, 59, 0.8) 100%);
        }

        .page-header > * {
            position: relative;
            z-index: 2;
        }

        /* ==================== OTROS COMPONENTES ==================== */
        .office-img {
            width: 100%;
            height: 300px;
            object-fit: cover;
            border-bottom: 3px solid var(--color-gold);
            box-shadow: 0 10px 25px rgba(0,0,0,0.1);
        }
        
        .star-filled { color: #F59E0B; }
        .star-empty { color: #E5E7EB; }