/* გლუვი სქროლი ლინკებზე დაჭერისას */
html {
    scroll-behavior: smooth;
}

@font-face {
    font-family: 'AngelWish';
    src: url('../fonts/angel_wish/Angel wish.ttf') format('truetype'),
         url('../fonts/angel_wish/Angel wish.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
}

/* ტექსტის მონიშვნის სტაფილოსფერი ფერი */
::selection {
    background-color: #ff5500;
    color: #000000;
}

::-moz-selection {
    background-color: #ff5500;
    color: #000000;
}

body {
    background-color: #070709;
    color: #e2e8f0;
    overflow-x: hidden;
}

/* Glassmorphic UI Containers */
.glass-panel {
    background: rgba(15, 15, 20, 0.85);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(255, 255, 255, 0.08);
}

.glass-card {
    background: rgba(20, 20, 26, 0.65);
    backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 0, 60, 0.2);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.glass-card:hover {
    border-color: rgba(255, 85, 0, 0.6);
    transform: translateY(-4px);
    box-shadow: 0 10px 30px -5px rgba(255, 85, 0, 0.25);
}

/* ციმციმა ნეონის ეფექტი სათაურისთვის (Cyberpunk Neon Flicker) */
@keyframes cyber-flicker {

    0%,
    19.999%,
    22%,
    62.999%,
    64%,
    64.999%,
    70%,
    100% {
        opacity: 1;
        text-shadow: 0 0 15px rgba(255, 85, 0, 0.8), 0 0 30px rgba(255, 85, 0, 0.4);
    }

    20%,
    21.999%,
    63%,
    63.999%,
    65%,
    69.999% {
        opacity: 0.7;
        text-shadow: 0 0 5px rgba(255, 85, 0, 0.3);
    }
}

.text-glow-orange {
    animation: cyber-flicker 3s infinite;
}

/* სქროლვისას ელემენტების ნელ-ნელა შემოსვლის ანიმაცია (Scroll Reveal) */
.reveal {
    opacity: 0;
    transform: translateY(40px);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

.reveal.active {
    opacity: 1;
    transform: translateY(0);
}

::-webkit-scrollbar {
    width: 6px;
}

::-webkit-scrollbar-track {
    background: #070709;
}

::-webkit-scrollbar-thumb {
    background: #ff5500;
    border-radius: 3px;
}

/* მობილური მენიუს ანიმაცია */
#mobile-menu {
    transition: opacity 0.3s ease, transform 0.3s ease;
    transform-origin: top;
}

#menu-btn i {
    transition: transform 0.3s ease;
}

#menu-btn.active i {
    transform: rotate(90deg);
}

/* --- HOVER GLITCH EFFECT (ერთჯერადი & დახვეწილი) --- */

/* 1. ლინკებზე მაუსის მიტანისას - სწრაფი, 1-ჯერადი გლიჩი */
nav a:hover,
.mobile-link:hover {
    display: inline-block;
    /* 0.25 წამში სრულდება მხოლოდ 1-ხელ (1) */
    animation: text-glitch-once 0.25s ease-in-out 1;
    color: #ff5500;
    /* ბოლოს რჩება სუფთა სტაფილოსფერი */
}

@keyframes text-glitch-once {
    0% {
        transform: translate(0);
        text-shadow: none;
    }

    20% {
        transform: translate(-3px, 1px);
        text-shadow: 2px 0 #ff003c, -2px 0 #00f0ff;
    }

    50% {
        transform: translate(3px, -1px);
        text-shadow: -2px 0 #ff003c, 2px 0 #00f0ff;
    }

    80% {
        transform: translate(-1px, 1px);
        text-shadow: 1px 0 #ff003c, -1px 0 #00f0ff;
    }

    100% {
        transform: translate(0);
        text-shadow: none;
        /* ხარვეზი ქრება და ტექსტი რჩება იდეალურად მკაფიო */
    }
}

/* 2. CONTACT ღილაკები - რბილი გაფართოება და ნათება (პანიკის გარეშე) */
header a[href^="mailto"]:hover,
footer button:hover {
    letter-spacing: 1.5px;
    box-shadow: 0 0 15px rgba(255, 85, 0, 0.5);
    transition: all 0.2s ease-in-out;
}

/* 3. ბარათებზე (Glass Cards) მიტანისას - რბილი წამოწევა */
.glass-card {
    transition: transform 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}

.glass-card:hover {
    border-color: rgba(255, 85, 0, 0.8) !important;
    transform: translateY(-5px);
    box-shadow: 0 12px 30px -5px rgba(255, 85, 0, 0.3);
}

/* --- HOVER GLITCH EFFECT (ერთჯერადი & დახვეწილი) --- */

/* 1. ლინკებზე მაუსის მიტანისას - სწრაფი, 1-ჯერადი გლიჩი */
nav a:hover,
.mobile-link:hover {
    display: inline-block;
    /* 0.25 წამში სრულდება მხოლოდ 1-ხელ (1) */
    animation: text-glitch-once 0.25s ease-in-out 1;
    color: #ff5500;
    /* ბოლოს რჩება სუფთა სტაფილოსფერი */
}

@keyframes text-glitch-once {
    0% {
        transform: translate(0);
        text-shadow: none;
    }

    20% {
        transform: translate(-3px, 1px);
        text-shadow: 2px 0 #ff003c, -2px 0 #00f0ff;
    }

    50% {
        transform: translate(3px, -1px);
        text-shadow: -2px 0 #ff003c, 2px 0 #00f0ff;
    }

    80% {
        transform: translate(-1px, 1px);
        text-shadow: 1px 0 #ff003c, -1px 0 #00f0ff;
    }

    100% {
        transform: translate(0);
        text-shadow: none;
        /* ხარვეზი ქრება და ტექსტი რჩება იდეალურად მკაფიო */
    }
}

/* 2. CONTACT ღილაკები - რბილი გაფართოება და ნათება (პანიკის გარეშე) */
header a[href^="mailto"]:hover,
footer button:hover {
    letter-spacing: 1.5px;
    box-shadow: 0 0 15px rgba(255, 85, 0, 0.5);
    transition: all 0.2s ease-in-out;
}

/* 3. ბარათებზე (Glass Cards) მიტანისას - რბილი წამოწევა */
.glass-card {
    transition: transform 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}

.glass-card:hover {
    border-color: rgba(255, 85, 0, 0.8) !important;
    transform: translateY(-5px);
    box-shadow: 0 12px 30px -5px rgba(255, 85, 0, 0.3);
}

/* მთავარი ლოგოს (GIORGI BURKADZE) გლიჩი და მასშტაბირება ჰოვერზე */
header a.group:hover span.font-orbitron {
    display: inline-block;
    animation: brand-glitch-once 0.3s ease-in-out 1;
    color: #ff5500;
}

@keyframes brand-glitch-once {
    0% {
        transform: scale(1) translate(0);
        text-shadow: none;
    }

    30% {
        transform: scale(1.03) skewX(-8deg);
        text-shadow: 3px 0 #ff003c, -3px 0 #00f0ff;
    }

    60% {
        transform: scale(1.02) skewX(8deg);
        text-shadow: -3px 0 #ff003c, 3px 0 #00f0ff;
    }

    100% {
        transform: scale(1) translate(0);
        text-shadow: 0 0 20px rgba(255, 85, 0, 0.6);
    }
}