/* ================================================================
   THEME: Glitch
   ================================================================ */

[data-theme="glitch"] {
  --bg: #04080F; --bg2: #080D18; --bg3: #0C1220;
  --text: #FFFFFF; --text2: rgba(255,255,255,0.55); --text3: rgba(0,255,100,0.85);
  --accent: #00FF64; --accent2: rgba(0,255,100,0.4);
  --border: rgba(0,255,100,0.18); --border2: rgba(0,255,100,0.07);
  --card-bg: rgba(0,255,100,0.04); --card-border: rgba(0,255,100,0.2);
  --nav-bg: rgba(4,8,15,0.97); --btn-bg: transparent; --btn-text: #00FF64;
  --font-d: 'Space Mono', monospace; --font-b: 'Space Mono', monospace; --fw-d: 700;
  --t-overlay: #00FF64;
}

[data-theme="glitch"] .bymg-logo .lp { fill: var(--accent); }
[data-theme="glitch"] .snake-icon-img path,
[data-theme="glitch"] .snake-icon-img polygon { fill: var(--accent); }

/* — Overlay transition — */
#overlay.t-glitch { animation: tGlitch 1.4s linear forwards; }
@keyframes tGlitch {
  0%{opacity:0;background:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(0,255,100,0.15) 2px,rgba(0,255,100,0.15) 4px)}7%{opacity:1}20%{opacity:1;background:#04080F}72%{opacity:1;background:#04080F}92%{opacity:0.2}100%{opacity:0}
}

/* — Personality — */
[data-theme="glitch"] .hero-headline { text-shadow: 2px 0 rgba(255,0,60,0.4), -2px 0 rgba(0,80,255,0.4); }
[data-theme="glitch"] .hl-outline { -webkit-text-stroke-color: #00FF64; filter: drop-shadow(0 0 8px rgba(0,255,100,0.7)); animation: glitchOutline 5s steps(1) infinite; }
@keyframes glitchOutline { 0%,94%,100%{clip-path:none;transform:none} 95%{clip-path:inset(10% 0 70% 0);transform:translateX(6px)} 96%{clip-path:inset(70% 0 5% 0);transform:translateX(-5px)} 97%{clip-path:none;transform:translateX(2px)} }
[data-theme="glitch"] .sobre-kicker::after, [data-theme="glitch"] .srv-kicker::after { content: '_'; animation: termBlink 1s steps(1) infinite; }
[data-theme="glitch"] .section-label::after { content: '_'; animation: termBlink 1s steps(1) infinite; }
[data-theme="glitch"] .section-headline { text-shadow: 0 0 30px rgba(0,255,100,0.5); letter-spacing: 4px; }
@keyframes termBlink { 50%{opacity:0} }
/* Offer box: btn-bg é transparent, sobrepor com texto legível */
[data-theme="glitch"] .ob-label,
[data-theme="glitch"] .ob-body { color: rgba(255,255,255,0.75); opacity: 1; }
