/*
Theme Name: Kortek Systems
Theme URI: https://kortek.design
Author: Kortek Engineering
Description: A high-performance, AI-focused theme for technology agencies.
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: kortek
*/

:root {
  --color-obsidian: #050505;
  --color-ethereal-blue: #00d2ff;
  --color-ethereal-teal: #3aedc4;
  --color-vapor-pink: #ff00ff;
  --color-vapor-purple: #9d00ff;
  --color-vapor-cyan: #00ffff;
  --color-vapor-blue: #000033;
}

body {
  background-color: var(--color-obsidian);
  color: #ffffff;
  margin: 0;
  padding: 0;
}

.glow-text {
  text-shadow: 0 0 20px rgba(0, 210, 255, 0.5);
}

.glass-card {
  background: rgba(255, 255, 255, 0.03);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid rgba(255, 255, 255, 0.1);
}

.bg-gradient-mesh {
  background-image: 
    radial-gradient(at 0% 0%, hsla(191,100%,50%,0.1) 0, transparent 50%), 
    radial-gradient(at 100% 100%, hsla(166,82%,54%,0.1) 0, transparent 50%);
}

.vapor-grid-purple {
  background-image: 
    linear-gradient(to right, rgba(255, 0, 255, 0.4) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255, 0, 255, 0.4) 1px, transparent 1px);
  background-size: 40px 40px;
}

@keyframes shooting-star {
  0% { transform: translate(0, 0) rotate(-45deg) scale(0); opacity: 0; }
  10% { transform: translate(10px, 10px) rotate(-45deg) scale(1); opacity: 1; }
  100% { transform: translate(300px, 300px) rotate(-45deg) scale(0.5); opacity: 0; }
}

.star {
  position: absolute;
  background: white;
  border-radius: 50%;
  opacity: 0.3;
  animation: pulse 3s infinite ease-in-out;
}

@keyframes pulse {
  0%, 100% { opacity: 0.3; transform: scale(1); }
  50% { opacity: 0.8; transform: scale(1.2); }
}

.shooting-star {
  position: absolute;
  width: 100px;
  height: 2px;
  background: linear-gradient(90deg, white, transparent);
  box-shadow: 0 0 10px white;
  pointer-events: none;
  opacity: 0;
  z-index: 20;
}

.animate-shooting-star {
  animation: shooting-star 1s ease-out forwards;
}

@keyframes float {
    0%, 100% { transform: translateY(0px); }
    50% { transform: translateY(-20px); }
}

@keyframes grid-flow {
    0% { transform: perspective(500px) rotateX(60deg) translateY(0); }
    100% { transform: perspective(500px) rotateX(60deg) translateY(40px); }
}

@keyframes vapor-pulse {
    0%, 100% { box-shadow: 0 0 5px #ff71ce, 0 0 10px #ff71ce; }
    50% { box-shadow: 0 0 20px #01cdfe, 0 0 40px #01cdfe; }
}

@keyframes glitch {
    0% { clip-path: inset(40% 0 61% 0); transform: translate(-2px, 2px); }
    20% { clip-path: inset(92% 0 1% 0); transform: translate(1px, -3px); }
    40% { clip-path: inset(43% 0 1% 0); transform: translate(-1px, 2px); }
    60% { clip-path: inset(25% 0 58% 0); transform: translate(2px, 1px); }
    80% { clip-path: inset(54% 0 7% 0); transform: translate(-2px, -2px); }
    100% { clip-path: inset(58% 0 43% 0); transform: translate(1px, 1px); }
}

.animate-float {
    animation: float 6s ease-in-out infinite;
}

.animate-grid-flow {
    animation: grid-flow 2s linear infinite;
}

.animate-vapor-pulse {
    animation: vapor-pulse 4s ease-in-out infinite;
}

.animate-glitch {
    animation: glitch 1s linear infinite alternate-reverse;
}

.vapor-grid {
    background-image: 
        linear-gradient(to right, rgba(255, 113, 206, 0.2) 1px, transparent 1px),
        linear-gradient(to bottom, rgba(255, 113, 206, 0.2) 1px, transparent 1px);
    background-size: 40px 40px;
}