/* ═══════════════════════════════════════════════════════════
   MXSLIDER — İzole modern kurumsal slider
   ═══════════════════════════════════════════════════════════ */
.mxslider {
    --mx-red: #e31e26;
    --mx-navy: #14143a;
    position: relative;
    width: 100%;
    height: 600px;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 18px 50px rgba(20,20,55,.16);
    background: #0c0c24;
}
.mxslider * { box-sizing: border-box; }

.mxslider__track {
    display: flex;
    height: 100%;
    transition: transform .8s cubic-bezier(.65,.05,.36,1);
    will-change: transform;
}
.mxslide {
    position: relative;
    min-width: 100%;
    height: 100%;
    overflow: hidden;
}
.mxslide__link { display: block; width: 100%; height: 100%; }
.mxslide__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1.06);
    transition: transform 7s ease;
}
.mxslide.is-active .mxslide__img { transform: scale(1); }

/* Sinematik overlay */
.mxslide__overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top,
        rgba(8,8,30,.92) 0%,
        rgba(8,8,30,.55) 30%,
        rgba(8,8,30,.12) 60%,
        rgba(8,8,30,0) 100%);
}

/* Caption */
.mxslide__caption {
    position: absolute;
    left: 0; right: 0; bottom: 0;
    padding: 0 46px 54px;
    z-index: 3;
}
.mxslide__badge {
    display: inline-block;
    background: var(--mx-red);
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1.5px;
    padding: 6px 16px;
    border-radius: 30px;
    margin-bottom: 16px;
    opacity: 0;
    transform: translateY(20px);
}
.mxslide__title {
    color: #fff;
    font-size: 34px;
    font-weight: 800;
    line-height: 1.18;
    letter-spacing: -.5px;
    margin: 0 0 12px;
    max-width: 80%;
    text-shadow: 0 2px 20px rgba(0,0,0,.4);
    opacity: 0;
    transform: translateY(24px);
}
.mxslide__meta {
    color: rgba(255,255,255,.82);
    font-size: 14px;
    font-weight: 500;
    margin: 0;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    opacity: 0;
    transform: translateY(20px);
}
.mxslide__meta::before {
    content: "";
    width: 30px; height: 2px;
    background: var(--mx-red);
}
/* Aktif slide animasyonu */
.mxslide.is-active .mxslide__badge { animation: mxCapUp .6s .15s ease both; }
.mxslide.is-active .mxslide__title { animation: mxCapUp .6s .3s ease both; }
.mxslide.is-active .mxslide__meta  { animation: mxCapUp .6s .45s ease both; }
@keyframes mxCapUp {
    to { opacity: 1; transform: translateY(0); }
}

/* Nav butonları */
.mxslider__nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 52px; height: 52px;
    border-radius: 50%;
    border: none;
    background: rgba(255,255,255,.14);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    color: #fff;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 5;
    transition: all .28s ease;
    opacity: 0;
}
.mxslider:hover .mxslider__nav { opacity: 1; }
.mxslider__nav svg { width: 24px; height: 24px; }
.mxslider__nav:hover {
    background: var(--mx-red);
    transform: translateY(-50%) scale(1.1);
}
.mxslider__prev { left: 20px; }
.mxslider__next { right: 20px; }

/* Dots */
.mxslider__dots {
    position: absolute;
    bottom: 26px;
    right: 46px;
    display: flex;
    gap: 9px;
    z-index: 5;
}
.mxslider__dot {
    width: 9px; height: 9px;
    border-radius: 50%;
    border: none;
    background: rgba(255,255,255,.4);
    cursor: pointer;
    padding: 0;
    transition: all .3s ease;
}
.mxslider__dot.is-active {
    width: 30px;
    border-radius: 5px;
    background: var(--mx-red);
}

/* Progress bar */
.mxslider__progress {
    position: absolute;
    bottom: 0; left: 0;
    height: 4px;
    width: 0;
    background: linear-gradient(90deg, var(--mx-red), #ff6b6e);
    z-index: 5;
}

/* Mobil */
@media (max-width: 991px) {
    .mxslider { height: 420px; border-radius: 14px; }
    .mxslide__caption { padding: 0 24px 40px; }
    .mxslide__title { font-size: 24px; max-width: 100%; }
    .mxslider__dots { right: 20px; bottom: 18px; }
    .mxslider__nav { display: none !important; }
    .mxslider__prev { left: 12px; }
    .mxslider__next { right: 12px; }
}
@media (max-width: 600px) {
    .mxslider { height: 340px; }
    .mxslide__title { font-size: 19px; }
    .mxslide__badge { font-size: 11px; margin-bottom: 10px; }
}
