/* 
 * Hadi Oku Eğitim Akademisi - Premium Visual Effects
 * Modern, Professional, and Advanced UI Enhancements
 */

/* ==========================================================
   1. CUSTOM SCROLLBAR
============================================================= */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}
::-webkit-scrollbar-track {
    background: var(--dark-optional);
    border-radius: 4px;
}
::-webkit-scrollbar-thumb {
    background: var(--color-primary);
    border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
    background: var(--color-secondary);
}
* {
    scrollbar-width: thin;
    scrollbar-color: var(--color-primary) var(--dark-optional);
}

/* ==========================================================
   2. TYPOGRAPHY POLISH
============================================================= */
body {
    letter-spacing: 0.3px;
    line-height: 1.85;
}
h1, h2, h3, h4, h5, h6 {
    letter-spacing: -0.5px;
}

/* ==========================================================
   3. GLASSMORPHISM EFFECTS
============================================================= */
/* Sticky Navbar Glass Effect */
header nav.navbar.validnavs.navbar-fixed.navbar-sticky {
    background: rgba(31, 31, 31, 0.7) !important; /* Dark with transparency */
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

/* Dropdown Menu Glass Effect */
header nav.navbar.validnavs ul.dropdown-menu {
    background: rgba(31, 31, 31, 0.85) !important;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.3);
}

/* Side Menu Glass Effect */
.side {
    background: rgba(31, 31, 31, 0.85) !important;
    backdrop-filter: blur(25px);
    -webkit-backdrop-filter: blur(25px);
    border-left: 1px solid rgba(255, 255, 255, 0.05);
}

/* ==========================================================
   4. DYNAMIC GLOW AND NEON SHADOWS
============================================================= */
/* Glowing Buttons */
.btn-style-one {
    position: relative;
    transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
    box-shadow: 0 4px 15px rgba(240, 96, 26, 0.2); /* Subtle Orange Glow */
}
.btn-style-one:hover {
    box-shadow: 0 8px 25px rgba(240, 96, 26, 0.5); /* Intense Orange Glow */
    transform: translateY(-2px);
}

/* ==========================================================
   5. ADVANCED CARD HOVER EFFECTS (3D Lift & Border Light)
============================================================= */
/* Cards generic classes */
.services-style-two, .about-style-two, .team-style-one-item, .blog-style-one {
    transition: all 0.5s cubic-bezier(0.25, 0.8, 0.25, 1);
    position: relative;
    z-index: 1;
}

.services-style-two:hover, .about-style-two:hover, .team-style-one-item:hover, .blog-style-one:hover {
    transform: translateY(-10px) scale(1.02);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.5), 0 0 20px rgba(28, 69, 161, 0.1); /* Deep shadow with subtle blue glow */
    border-color: rgba(28, 69, 161, 0.5);
}

/* Specific inner element scales on hover */
.services-style-two:hover i, .services-style-two:hover img {
    transform: scale(1.1) rotate(5deg);
    transition: all 0.4s ease;
}
.services-style-two i, .services-style-two img {
    transition: all 0.4s ease;
}

/* ==========================================================
   6. AMBIENT BLURRY BACKGROUNDS (Hero & Sections)
============================================================= */
.ambient-glow-wrapper {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    z-index: -1;
    pointer-events: none;
}
.ambient-glow-circle-1, .ambient-glow-circle-2 {
    position: absolute;
    border-radius: 50%;
    filter: blur(150px);
    opacity: 0.15;
}
.ambient-glow-circle-1 {
    width: 600px;
    height: 600px;
    background: var(--color-primary); /* Orange */
    top: -10%;
    left: -10%;
}
.ambient-glow-circle-2 {
    width: 500px;
    height: 500px;
    background: var(--color-secondary); /* Blue */
    bottom: -10%;
    right: -10%;
}

/* ==========================================================
   7. NEURAL NETWORK (BRAIN) BACKGROUND ANIMATION
============================================================= */
#neural-bg {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    z-index: -2;
    pointer-events: none; /* Allows clicking through it */
    opacity: 0.6; /* Slight transparency so it's not overpowering */
    background: transparent;
}
