/**
 * Ana sayfa hero — omurkuzucu.com ile aynı katman yapısı
 * (parçacık ağı, patlama efekti, bulutlar, uçuşan teknoloji ikonları, galaksi)
 */

.hero-slider.hero-omur {
    background:
        radial-gradient(ellipse 70% 55% at 78% 72%, rgba(34, 211, 238, 0.22) 0%, transparent 58%),
        radial-gradient(ellipse 50% 40% at 18% 28%, rgba(56, 189, 248, 0.14) 0%, transparent 55%),
        linear-gradient(160deg, #041820 0%, #0a3648 42%, #0d4a5c 72%, #083040 100%);
    margin-top: 0;
    min-height: 100vh;
    min-height: 100dvh;
    height: 100vh;
    height: 100dvh;
    box-sizing: border-box;
}

/* Logo + menü slide içinde (üst katman) */
.hero-slider .header--hero {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 30;
    background: transparent;
    border-bottom: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    box-shadow: none;
}

.hero-slider .header--hero.scrolled {
    background: rgba(4, 24, 32, 0.72);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-bottom: 1px solid rgba(79, 215, 236, 0.18);
}

/* Beyaz logo: logo-anim.css (.logo-link--anim) */

.hero-slider .header--hero .logo {
    min-width: 140px;
}

/* Masaüstü: koyu hero üzerinde beyaz menü linkleri */
@media (min-width: 769px) {
    .hero-slider .header--hero .nav-menu a {
        color: rgba(255, 255, 255, 0.88);
    }

    .hero-slider .header--hero .nav-menu a:hover,
    .hero-slider .header--hero .nav-menu a.active {
        color: #fff;
    }

    .hero-slider .header--hero .nav-menu a::after {
        background: linear-gradient(90deg, #4fd7ec, rgba(255, 255, 255, 0.9));
    }
}

.hero-slider .header--hero .hamburger span {
    background: rgba(255, 255, 255, 0.95);
}

.hero-slider.hero-omur .slider-container,
.hero-slider.hero-omur .slide {
    height: 100%;
    min-height: 100%;
}

.hero-slider.hero-omur .slider-container {
    z-index: 1;
}

.hero-slider.hero-omur .slide-bg {
    opacity: 1;
    filter: saturate(1.35) contrast(1.08) brightness(1.04);
}

/* FX katmanı — slide görsellerinin üstünde */
.hero-omur__fx {
    position: absolute;
    inset: 0;
    z-index: 5;
    pointer-events: none;
    overflow: hidden;
}

.hero-omur__fx * {
    pointer-events: none !important;
}

.hero-omur__shade {
    position: absolute;
    inset: 0;
    z-index: 2;
    background:
        radial-gradient(ellipse 55% 50% at 82% 78%, rgba(34, 211, 238, 0.18) 0%, transparent 60%),
        linear-gradient(
            180deg,
            rgba(4, 24, 32, 0.22) 0%,
            rgba(8, 48, 64, 0.08) 42%,
            rgba(4, 28, 38, 0.28) 100%
        );
}

.hero-omur__fx canvas {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    display: block;
}

#star-two {
    z-index: 1;
    opacity: 0.9;
    pointer-events: none;
}

#star-box {
    z-index: 4;
    pointer-events: none;
}

/* Bulutlar — omurkuzucu.com (css-animation.css + cloud-bg.png) */
.hero-omur__fx .clouds {
    position: absolute;
    pointer-events: none;
    overflow: hidden;
    width: 100%;
    height: 353px;
    bottom: 0;
    left: 0;
    z-index: 3;
}

.hero-omur__fx .cloud {
    width: 200%;
    height: 100%;
    background-image: url(../hero-omur/bgi/cloud-bg.png);
    background-size: cover;
    background-repeat: no-repeat;
    opacity: 0.28;
}

.hero-omur__fx .cloud-anim {
    animation: cloudanim 120s ease-in-out infinite;
}

@keyframes cloudanim {
    0% {
        transform: translateX(0);
    }
    50% {
        transform: translateX(-50%);
    }
    100% {
        transform: translateX(0);
    }
}

/* Uçuşan teknoloji ikonları (sprite) */
.hero-omur__fx .floating-object,
.hero-omur__fx .floating-object li {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    list-style: none;
}

.hero-omur__fx .floating-object {
    max-width: 1506px;
    left: 0;
    right: 0;
    margin: 0 auto;
    z-index: 6;
}

.hero-omur__fx .floating-object li {
    text-align: center;
}

.hero-omur__fx .floating-object li span {
    position: absolute;
    opacity: 1;
    display: block;
    background-repeat: no-repeat;
    animation: omurIconFloat 6s ease-in-out infinite;
    filter: saturate(1.4) brightness(1.12) drop-shadow(0 0 10px rgba(34, 211, 238, 0.25));
}

.hero-omur__fx .floating-object li span[class$="-icon"] {
    background-image: url(../hero-omur/bgi/sprites.png);
}

.hero-omur__fx .floating-object li:nth-child(odd) span {
    animation-duration: 7.5s;
    animation-delay: -1.5s;
}

.hero-omur__fx .floating-object li:nth-child(3n) span {
    animation-duration: 8.5s;
    animation-delay: -3s;
}

@keyframes omurIconFloat {
    0%, 100% {
        transform: translateY(0) translateX(0);
    }
    50% {
        transform: translateY(-14px) translateX(6px);
    }
}

.floating-object .float-icon-1 { top: 15.65%; left: 0; }
.floating-object .float-icon-2 { top: 16.21%; left: 64.94%; }
.floating-object .float-icon-3 { top: 11.3%; left: 22.51%; }
.floating-object .float-icon-4 { top: 95.02%; left: 30.54%; }
.floating-object .float-icon-5 { top: 57.23%; left: 63.68%; }
.floating-object .float-icon-6 { top: 71.68%; left: 46.81%; }
.floating-object .float-icon-7 { top: 87.3%; left: 0.27%; }
.floating-object .float-icon-8 { top: 91.41%; left: 86.72%; }
.floating-object .float-icon-9 { top: 68.75%; left: 82.67%; }
.floating-object .float-icon-10 { top: 60.94%; left: 17%; }
.floating-object .float-icon-11 { top: 19.63%; left: 95.82%; }
.floating-object .float-icon-12 { top: 21%; left: 40.31%; }
.floating-object .float-icon-13 { top: 22.95%; left: 34.25%; }
.id-icon { background-position: -47px -96px; width: 30px; height: 31px; }
.jq-icon { background-position: -336px -96px; width: 53px; height: 58px; }
.php-icon { background-position: -119px -96px; width: 50px; height: 31px; }
.w3c-icon { background-position: -428px -96px; width: 39px; height: 33px; }
.html5-icon { background-position: -81px -96px; width: 34px; height: 44px; }
.css3-icon { background-position: -393px -96px; width: 31px; height: 38px; }
.ad-icon { background-position: -214px -96px; width: 37px; height: 45px; }
.wp-icon { background-position: -297px -96px; width: 34px; height: 35px; }
.ap-icon { background-position: -505px -96px; width: 28px; height: 34px; }
.jm-icon { background-position: -2px -96px; width: 41px; height: 41px; }
.ps-icon { background-position: -470px -96px; width: 32px; height: 33px; }
.mg-icon { background-position: -173px -96px; width: 37px; height: 36px; }
.ai-icon { background-position: -255px -96px; width: 38px; height: 38px; }

/* Astronot + uzay mekiği — JS ile tüm slide’da serbest dolaşır */
.hero-omur__fx .space-objects {
    position: absolute;
    inset: 0;
    z-index: 6;
    overflow: hidden;
    pointer-events: none;
}

.hero-omur__fx .space-station-pic,
.hero-omur__fx .astronaut-pic {
    position: absolute;
    left: 0;
    top: 0;
    margin: 0;
    inset: auto;
    width: auto;
    height: auto;
    will-change: transform;
}

.hero-omur__fx .space-station-pic {
    width: min(11vw, 128px);
}

.hero-omur__fx .astronaut-pic {
    width: min(14vw, 150px);
}

.hero-omur__fx .shuttle-craft {
    position: relative;
    display: block;
    width: 100%;
}

.hero-omur__fx .shuttle-craft img,
.hero-omur__fx .astronaut-pic img {
    display: block;
    width: 100%;
    height: auto;
    max-width: none;
    mix-blend-mode: screen;
    opacity: 0.92;
}

.hero-omur__fx .astronaut-pic img {
    filter: drop-shadow(0 0 14px rgba(34, 211, 238, 0.45));
    animation: astronautBreath 4s infinite ease-in-out;
}

.hero-omur__fx .shuttle-craft img {
    position: relative;
    z-index: 1;
    filter: drop-shadow(0 0 8px rgba(79, 215, 236, 0.25));
}

@keyframes astronautBreath {
    0%, 100% { opacity: 0.86; }
    50% { opacity: 0.96; }
}

/* Galaksi görseli */
.hero-omur__fx .galaxy-pic {
    position: absolute;
    right: 0;
    bottom: 0;
    margin: auto;
    z-index: 5;
    max-width: min(42vw, 520px);
    pointer-events: none;
    user-select: none;
    opacity: 1;
}

.hero-omur__fx .galaxy-pic img {
    width: 100%;
    height: auto;
    display: block;
    filter:
        saturate(1.45) contrast(1.12) brightness(1.08)
        drop-shadow(0 0 48px rgba(34, 211, 238, 0.45))
        drop-shadow(0 0 90px rgba(250, 204, 21, 0.2));
}

/* Slider kontrolleri üstte */
/* Slide merkez metin */
.hero-center {
    position: absolute;
    inset: 0;
    z-index: 12;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 5.5rem 1.5rem 7rem;
    pointer-events: none;
    text-align: center;
}

.hero-center__inner {
    max-width: 920px;
    pointer-events: auto;
    animation: heroCenterIn 1s cubic-bezier(0.4, 0, 0.2, 1) both;
}

@keyframes heroCenterIn {
    from {
        opacity: 0;
        transform: translateY(24px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.hero-center__title {
    margin: 0 0 0.75rem;
    font-family: 'Plus Jakarta Sans', 'Space Grotesk', sans-serif;
    font-size: clamp(1.35rem, 2.8vw, 2rem);
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -0.03em;
    color: #fff;
    text-shadow:
        0 0 28px rgba(34, 211, 238, 0.35),
        0 2px 16px rgba(0, 0, 0, 0.55);
}

.hero-center__text {
    margin: 0 auto 1.5rem;
    max-width: 640px;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    font-size: clamp(0.875rem, 1.45vw, 1.05rem);
    font-weight: 400;
    line-height: 1.65;
    letter-spacing: 0.01em;
    color: rgba(224, 252, 255, 0.92);
    text-shadow: 0 1px 10px rgba(0, 0, 0, 0.45);
}

.btn-hero-omur {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.65rem;
    padding: 0.9rem 1.85rem;
    font-family: 'Plus Jakarta Sans', 'Space Grotesk', sans-serif;
    font-size: 0.875rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    text-decoration: none;
    color: #042028;
    background: linear-gradient(135deg, #a5f3fc 0%, #22d3ee 40%, #06b6d4 100%);
    border: none;
    border-radius: 999px;
    box-shadow:
        0 0 0 1px rgba(255, 255, 255, 0.4) inset,
        0 0 28px rgba(34, 211, 238, 0.55),
        0 4px 22px rgba(6, 182, 212, 0.55),
        0 8px 32px rgba(0, 0, 0, 0.28);
    transition: transform 0.25s ease, box-shadow 0.25s ease, filter 0.25s ease;
    animation: heroBtnGlow 2.8s ease-in-out infinite;
    position: relative;
    overflow: hidden;
}

.btn-hero-omur::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(
        105deg,
        transparent 0%,
        rgba(255, 255, 255, 0.45) 45%,
        transparent 55%
    );
    transform: translateX(-120%);
    transition: transform 0.55s ease;
}

.btn-hero-omur:hover {
    color: #0a2229;
    transform: translateY(-3px) scale(1.02);
    filter: brightness(1.06);
    box-shadow:
        0 0 0 1px rgba(255, 255, 255, 0.5) inset,
        0 6px 28px rgba(79, 215, 236, 0.7),
        0 12px 40px rgba(0, 0, 0, 0.32);
    animation: none;
}

.btn-hero-omur:hover::before {
    transform: translateX(120%);
}

.btn-hero-omur__icon {
    font-size: 0.8rem;
    transition: transform 0.25s ease;
}

.btn-hero-omur:hover .btn-hero-omur__icon {
    transform: translateX(4px);
}

@keyframes heroBtnGlow {
    0%,
    100% {
        box-shadow:
            0 0 0 1px rgba(255, 255, 255, 0.4) inset,
            0 0 24px rgba(34, 211, 238, 0.45),
            0 4px 22px rgba(6, 182, 212, 0.5),
            0 8px 32px rgba(0, 0, 0, 0.28);
    }
    50% {
        box-shadow:
            0 0 0 1px rgba(255, 255, 255, 0.55) inset,
            0 0 36px rgba(34, 211, 238, 0.7),
            0 6px 28px rgba(6, 182, 212, 0.65),
            0 10px 36px rgba(0, 0, 0, 0.3);
    }
}

/* Aşağı kaydır — mouse (omurkuzucu.com) */
.hero-mouse {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 3.5%;
    margin: 0 auto;
    width: 28px;
    height: 42px;
    z-index: 14;
    border: 2px solid #fff;
    border-radius: 15px 15px 21px 21px;
    text-decoration: none;
    cursor: pointer;
    transition: border-color 0.2s ease, opacity 0.2s ease;
}

.hero-mouse:hover {
    border-color: #4fd7ec;
    opacity: 0.95;
}

.hero-mouse::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    margin: 0 auto;
    width: 1px;
    height: 20px;
    background: rgba(255, 255, 255, 0.3);
}

.hero-mouse__wheel {
    position: absolute;
    left: 0;
    right: 0;
    top: 21px;
    margin: 0 auto;
    width: 3px;
    height: 8px;
    background: #fff;
    border-radius: 2px;
    transform-origin: 50% 0%;
    animation: heroMouseWheel 1.25s linear infinite;
}

@keyframes heroMouseWheel {
    0% {
        transform: scaleY(0.4) translateY(0);
    }
    20% {
        transform: scaleY(1) translateY(0);
    }
    60% {
        transform: scaleY(0.4) translateY(22px);
    }
    100% {
        transform: scaleY(0.4) translateY(0);
    }
}

.hero-slider.hero-omur .slider-controls,
.hero-slider.hero-omur .slider-dots {
    z-index: 20;
}

.hero-slider.hero-omur .slider-btn {
    background: rgba(255, 255, 255, 0.15);
    border-color: rgba(255, 255, 255, 0.35);
    color: #fff;
}

.hero-slider.hero-omur .slider-btn:hover {
    background: rgba(79, 215, 236, 0.35);
}

.hero-slider.hero-omur .dot {
    background: rgba(255, 255, 255, 0.35);
}

.hero-slider.hero-omur .dot.active {
    background: #4fd7ec;
}

@media (-webkit-min-device-pixel-ratio: 1.5), (min-resolution: 144dpi) {
    .hero-omur__fx .floating-object li span[class$="-icon"] {
        background-image: url(../hero-omur/bgi/sprites-2x.png);
        background-size: 800px 650px;
    }
}

@media (max-width: 1024px) {
    .hero-omur__fx .galaxy-pic {
        max-width: 38vw;
        opacity: 0.92;
    }
}

@media (max-width: 767px) {
    .hero-slider.hero-omur {
        min-height: 100vh;
        min-height: 100dvh;
        height: 100vh;
        height: 100dvh;
    }

    .hero-omur__fx .galaxy-pic {
        max-width: 55vw;
        right: -8%;
        opacity: 0.85;
    }

    .hero-omur__fx .floating-object li span {
        transform: scale(0.85);
    }

    .hero-omur__fx .space-station-pic {
        width: min(18vw, 88px);
    }

    .hero-omur__fx .astronaut-pic {
        width: min(20vw, 100px);
    }

    .hero-omur__fx .shuttle-craft img,
    .hero-omur__fx .astronaut-pic img {
        opacity: 0.9;
        filter: drop-shadow(0 0 6px rgba(79, 215, 236, 0.18));
    }

}

@media (prefers-reduced-motion: reduce) {
    .hero-omur__fx .cloud-anim,
    .hero-omur__fx .floating-object li span,
    .hero-omur__fx .astronaut-pic img,
    .hero-mouse__wheel,
    .btn-hero-omur {
        animation: none;
    }

    .hero-center__inner {
        animation: none;
    }

    .hero-omur__fx canvas#star-two {
        display: none;
    }
}

/* Hamburger menü 1024px altında görünür; tıklanabilirliği o aralıkta garanti et */
@media (max-width: 1023px) {
    .hero-slider .header--hero {
        z-index: 50;
        isolation: isolate;
        pointer-events: auto;
    }

    .hero-slider .header--hero .navbar,
    .hero-slider .header--hero .container {
        pointer-events: auto;
    }

    .hero-slider .header--hero .hamburger {
        position: relative;
        z-index: 3;
        pointer-events: auto;
        -webkit-tap-highlight-color: rgba(255, 255, 255, 0.15);
    }
}

@media (max-width: 767px) {
    .hero-center {
        padding: 4.5rem 1rem 6.5rem;
    }

    .hero-mouse {
        bottom: 2.5%;
    }
}