@import url('https://fonts.googleapis.com/css2?family=Syncopate:wght@400;700&family=Plus+Jakarta+Sans:wght@300;400;600;800&display=swap');
        
        :root {
            --primary: #ca8a04; /* yellow-600 */
            --dark: #0f1115;
        }

        body { 
            font-family: 'Plus Jakarta Sans', sans-serif; 
            scroll-behavior: smooth;
        }

        .font-heading { font-family: 'Syncopate', sans-serif; }

        .text-stroke {
            -webkit-text-stroke: 1px rgba(255,255,255,0.3);
            color: transparent;
        }

        .hero-video-bg {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            object-fit: cover;
            z-index: -1;
            filter: brightness(0.4);
        }

        .yellow-glow {
            box-shadow: 0 0 30px rgba(202, 138, 4, 0.3);
        }

        .project-card:hover .project-img {
            transform: scale(1.05);
        }

        #mobile-menu {
            transition: transform 0.3s ease-in-out;
            transform: translateX(100%);
        }
        #mobile-menu.active {
            transform: translateX(0);
        }

        /* Ajuste final para evitar cortes de texto */
        .word-switcher {
            display: inline-block;
            position: relative;
            vertical-align: top;
            overflow: hidden;
            /* Aumentamos significativamente el margen interno y el alto */
            height: 1.4em; 
            line-height: 1.4em;
            padding: 0 0.1em; /* Evita cortes laterales en itálicas */
            margin-top: -0.1em;
        }

        .word-item {
            display: block;
            transition: transform 0.6s cubic-bezier(0.76, 0, 0.24, 1), opacity 0.6s ease;
            white-space: nowrap;
            will-change: transform, opacity;
        }

        .word-hidden-up {
            transform: translateY(-100%);
            opacity: 0;
        }

        .word-hidden-down {
            transform: translateY(100%);
            opacity: 0;
        }

        .word-visible {
            transform: translateY(0);
            opacity: 1;
        }