﻿/* ========== HERO SLIDER ========== */
.hero-slider {
    position: relative;
    z-index: 1;
}

    .hero-slider .carousel-item {
        height: 100vh; /* tam ekran */
        min-height: 560px;
        background-size: cover;
        background-position: center;
        position: relative;
    }

        .hero-slider .carousel-item::before {
            content: '';
            position: absolute;
            inset: 0;
            background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.5));
            z-index: 1;
        }

    .hero-slider .carousel-caption {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 90%;
        max-width: 1000px;
        text-align: center;
        z-index: 2;
        padding-bottom: 0;
        bottom: auto;
        
    }

    .hero-slider h1 {
        font-size: clamp(32px, 5.5vw, 64px);
        font-weight: 400;
        margin-bottom: 16px;
        text-shadow: 2px 2px 12px rgba(0, 0, 0, 0.5);
        line-height: 1.2;
        color: #fff;
        font: 'Helvetica Neue Light';
    }

    .hero-slider p {
        font-size: clamp(17px, 2.4vw, 24px);
        opacity: 0.95;
        margin-bottom: 28px;
        text-shadow: 1px 1px 6px rgba(0, 0, 0, 0.4);
        color: #fff;
    }

    .hero-slider .carousel-control-prev,
    .hero-slider .carousel-control-next {
        width: 70px;
        opacity: 0.7;
        z-index: 3;
    }

        .hero-slider .carousel-control-prev:hover,
        .hero-slider .carousel-control-next:hover {
            opacity: 1;
        }

    .hero-slider .carousel-control-prev-icon,
    .hero-slider .carousel-control-next-icon {
        width: 50px;
        height: 50px;
    }

    .hero-slider .carousel-indicators {
        margin-bottom: 40px;
        z-index: 3;
    }

        .hero-slider .carousel-indicators button {
            width: 14px;
            height: 14px;
            border-radius: 50%;
            margin: 0 8px;
            background-color: rgba(255, 255, 255, 0.5);
            border: 2px solid rgba(255, 255, 255, 0.8);
        }

        .hero-slider .carousel-indicators .active {
            background-color: #fff;
            transform: scale(1.2);
        }

/* ========== RESPONSIVE ========== */
@media (max-width: 991px) {
    .hero-slider .carousel-item {
        height: 85vh;
        min-height: 500px;
    }

    .hero-slider h1 {
        font-size: clamp(28px, 6vw, 48px);
    }
}

@media (max-width: 767px) {
    .hero-slider .carousel-item {
        height: 75vh;
        min-height: 450px;
    }

    .hero-slider .carousel-caption {
        width: 95%;
    }

    .hero-slider .btn-lg {
        font-size: 15px;
        padding: 10px 20px;
    }

    .hero-slider .carousel-indicators {
        margin-bottom: 25px;
    }
}
