/* ============================================
   MARKA BAŞLIKLARI - Güçlendirilmiş versiyon
   ============================================ */

/* Eski .carousel-section float ve margin ezme */
.carousel-section.brand-section {
    float: none !important;
    clear: both !important;
    width: 100%;
    display: block;
    margin-top: 45px;
    margin-bottom: 15px;
    overflow: visible;
}

/* Başlık wrapper - eski h3 stillerini ez */
.brand-section h3.brand-title {
    position: relative !important;
    margin: 0 0 25px 0 !important;
    padding: 0 !important;
    font-size: 0 !important;
    line-height: 1 !important;
    background: none !important;
    border: none !important;
    display: block !important;
    float: none !important;
    clear: both !important;
}

    /* Eski ::before / ::after varsa iptal et */
    .brand-section h3.brand-title::before {
        display: none !important;
        content: none !important;
    }

/* Başlık iç gövdesi */
.brand-section .brand-title .brand-title-inner {
    display: inline-flex !important;
    align-items: center;
    gap: 12px;
    padding: 14px 38px 14px 28px;
    font-size: 20px;
    font-weight: 800;
    letter-spacing: 0.4px;
    text-transform: uppercase;
    position: relative;
    color: #fff;
    line-height: 1.2;
    clip-path: polygon(0 0, calc(100% - 18px) 0, 100% 50%, calc(100% - 18px) 100%, 0 100%);
    transition: transform .25s ease;
}

    .brand-section .brand-title .brand-title-inner i {
        font-size: 18px;
        opacity: 0.95;
    }

/* Aktif çizgi - başlığa yapışık */
.brand-section h3.brand-title::after {
    content: "" !important;
    display: block !important;
    height: 4px;
    width: 100%;
    margin-top: 0;
    border-radius: 2px;
    background: linear-gradient(90deg, var(--brand-color, #FF6B1C) 0%, var(--brand-color, #FF6B1C) 35%, rgba(0,0,0,0.08) 100%);
    box-shadow: 0 2px 6px rgba(0,0,0,0.08);
    position: static;
}

.brand-section .brand-title-inner:hover {
    transform: translateX(4px);
}

/* ---------- BLACK + DECKER ---------- */
.brand-blackdecker {
    --brand-color: #FF6B1C;
}

    .brand-blackdecker .brand-title .brand-title-inner {
        background: linear-gradient(135deg, #1a1a1a 0%, #2d2d2d 60%, #FF6B1C 100%);
        border-left: 6px solid #FF6B1C;
        box-shadow: 0 6px 18px rgba(255, 107, 28, 0.25);
        color: #fff !important;
    }

        .brand-blackdecker .brand-title .brand-title-inner i {
            color: #FF6B1C;
        }

/* ---------- STANLEY ---------- */
.brand-stanley {
    --brand-color: #FFD100;
}

    .brand-stanley .brand-title .brand-title-inner {
        background: linear-gradient(135deg, #FFD100 0%, #FFC400 60%, #1a1a1a 100%);
        color: #1a1a1a !important;
        border-left: 6px solid #1a1a1a;
        box-shadow: 0 6px 18px rgba(255, 209, 0, 0.35);
    }

        .brand-stanley .brand-title .brand-title-inner i {
            color: #1a1a1a;
        }

/* ---------- DEWALT ---------- */
.brand-dewalt {
    --brand-color: #FEBD17;
}

    .brand-dewalt .brand-title .brand-title-inner {
        background: linear-gradient(135deg, #1a1a1a 0%, #1a1a1a 55%, #FEBD17 100%);
        border-left: 6px solid #FEBD17;
        box-shadow: 0 6px 18px rgba(254, 189, 23, 0.3);
        color: #fff !important;
    }

        .brand-dewalt .brand-title .brand-title-inner i {
            color: #FEBD17;
        }

/* ---------- RESPONSIVE ---------- */
@media (max-width: 576px) {
    .brand-section .brand-title .brand-title-inner {
        font-size: 15px;
        padding: 11px 30px 11px 20px;
    }

        .brand-section .brand-title .brand-title-inner i {
            font-size: 14px;
        }
}