/*
Theme Name: Drive Sombrio
Theme URI: http://drivesombrio.com/meu-tema
Author: Seu Nome
Author URI: http://drivesombrio.com
Description: "Drive Sombrio é uma agência de marketing digital com estética dark e espírito cyberpunk. Criamos estratégias invisíveis, copy brutal e autoridade silenciosa para quem quer resultados reais sem se expor. Silêncio. Estratégia. Lucro."
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: meu-tema
*/
        @keyframes glitch {
            0% { text-shadow: 0.05em 0 0 #00fffc, -0.05em -0.025em 0 #fc00ff; }
            14% { text-shadow: 0.05em 0 0 #00fffc, -0.05em -0.025em 0 #fc00ff; }
            15% { text-shadow: -0.05em -0.025em 0 #00fffc, 0.025em 0.025em 0 #fc00ff; }
            49% { text-shadow: -0.05em -0.025em 0 #00fffc, 0.025em 0.025em 0 #fc00ff; }
            50% { text-shadow: 0.025em 0.05em 0 #00fffc, 0.05em 0 0 #fc00ff; }
            99% { text-shadow: 0.025em 0.05em 0 #00fffc, 0.05em 0 0 #fc00ff; }
            100% { text-shadow: -0.025em 0 0 #00fffc, -0.025em -0.025em 0 #fc00ff; }
        }
        
        .cyber-border {
            border-image: linear-gradient(45deg, #ff00ff, #00f0ff);
            border-image-slice: 1;
        }
        
        .text-stroke {
            -webkit-text-stroke: 1px #00f0ff;
            -webkit-text-stroke: 1px #00f0ff;
        }
        
        .glitch-effect {
            position: relative;
        }
        
        .glitch-effect::before, .glitch-effect::after {
            content: attr(data-text);
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
        }
        
        .glitch-effect::before {
            left: 2px;
            text-shadow: -2px 0 #ff00ff;
            clip: rect(44px, 450px, 56px, 0);
            animation: glitch-anim 5s infinite linear alternate-reverse;
        }
        
        .glitch-effect::after {
            left: -2px;
            text-shadow: -2px 0 #00f0ff;
            clip: rect(44px, 450px, 56px, 0);
            animation: glitch-anim2 5s infinite linear alternate-reverse;
        }
        
        @keyframes glitch-anim {
            0% { clip: rect(31px, 9999px, 94px, 0); }
            20% { clip: rect(112px, 9999px, 76px, 0); }
            40% { clip: rect(75px, 9999px, 107px, 0); }
            60% { clip: rect(62px, 9999px, 109px, 0); }
            80% { clip: rect(84px, 9999px, 107px, 0); }
            100% { clip: rect(69px, 9999px, 98px, 0); }
        }
        
        @keyframes glitch-anim2 {
            0% { clip: rect(65px, 9999px, 119px, 0); transform: skew(0.78deg); }
            20% { clip: rect(101px, 9999px, 74px, 0); transform: skew(0.87deg); }
            40% { clip: rect(118px, 9999px, 100px, 0); transform: skew(0.56deg); }
            60% { clip: rect(68px, 9999px, 66px, 0); transform: skew(0.43deg); }
            80% { clip: rect(86px, 9999px, 73px, 0); transform: skew(0.32deg); }
            100% { clip: rect(84px, 9999px, 106px, 0); transform: skew(0.65deg); }
        }
        
        .hacker-terminal {
            position: relative;
            background-color: rgba(0, 0, 20, 0.8);
            border: 1px solid rgba(0, 240, 255, 0.3);
            box-shadow: 0 0 10px rgba(0, 240, 255, 0.3);
        }
        
        .hacker-terminal::before {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            height: 3px;
            background: linear-gradient(to right, transparent, #ff00ff, #00f0ff, transparent);
        }
        
        .scanline {
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background: linear-gradient(
                rgba(0, 240, 255, 0.1) 1px,
                transparent 1px
            );
            background-size: 100% 2px;
            animation: scanline 15s linear infinite;
        }
        
        @keyframes scanline {
            from { background-position: 0 0; }
            to { background-position: 0 100%; }
        }
        
        .matrix-effect {
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%"><rect width="100%" height="100%" fill="none" stroke="%2300f0ff" stroke-width="1" stroke-dasharray="5,5" /></svg>');
            opacity: 0.2;
        }