/* =============== GRUP 1: SELÇUK KURUMSAL TONLAR =============== */
/* #1c458b ana mavi, #0d2d5e koyu mavi, #0a1628 çok koyu mavi */

.navbar-variant-1 {
    background: linear-gradient(180deg, rgba(28, 69, 139, 0.95) 0%, rgba(28, 69, 139, 0.85) 25%, rgba(28, 69, 139, 0.5) 50%, rgba(28, 69, 139, 0.2) 75%, rgba(28, 69, 139, 0) 100% );
    backdrop-filter: blur(2px);
}

.overlay-variant-1 {
    background: linear-gradient(180deg, rgba(13, 45, 94, 0.40) 0%, rgba(13, 45, 94, 0.20) 25%, rgba(13, 45, 94, 0.20) 50%, rgba(13, 45, 94, 0.30) 75%, rgba(13, 45, 94, 0.80) 100% );
}

.navbar-variant-2 {
    background: linear-gradient(180deg, rgba(13, 45, 94, 0.95) 0%, rgba(13, 45, 94, 0.85) 25%, rgba(13, 45, 94, 0.5) 50%, rgba(13, 45, 94, 0.2) 75%, rgba(13, 45, 94, 0) 100% );
    backdrop-filter: blur(2px);
}

.overlay-variant-2 {
    background: linear-gradient(180deg, rgba(13, 45, 94, 0.40) 0%, rgba(13, 45, 94, 0.20) 25%, rgba(13, 45, 94, 0.20) 50%, rgba(13, 45, 94, 0.30) 75%, rgba(13, 45, 94, 0.80) 100% );
}

.navbar-variant-3 {
    background: linear-gradient(180deg, rgba(10, 22, 40, 0.95) 0%, rgba(10, 22, 40, 0.85) 25%, rgba(10, 22, 40, 0.5) 50%, rgba(10, 22, 40, 0.2) 75%, rgba(10, 22, 40, 0) 100% );
    backdrop-filter: blur(2px);
}

.overlay-variant-3 {
    background: linear-gradient(180deg, rgba(10, 22, 40, 0.40) 0%, rgba(10, 22, 40, 0.20) 25%, rgba(10, 22, 40, 0.20) 50%, rgba(10, 22, 40, 0.30) 75%, rgba(10, 22, 40, 0.80) 100% );
}

/* =============== GRUP 2: TURKUAZ TONLAR =============== */

.navbar-variant-4 {
    background: linear-gradient(180deg, rgba(0, 128, 128, 0.95) 0%, rgba(0, 128, 128, 0.85) 25%, rgba(0, 128, 128, 0.5) 50%, rgba(0, 128, 128, 0.2) 75%, rgba(0, 128, 128, 0) 100% );
    backdrop-filter: blur(2px);
}

.overlay-variant-4 {
    background: linear-gradient(180deg, rgba(0, 128, 128, 0.40) 0%, rgba(0, 128, 128, 0.20) 25%, rgba(0, 128, 128, 0.20) 50%, rgba(0, 128, 128, 0.30) 75%, rgba(0, 128, 128, 0.80) 100% );
}

.navbar-variant-5 {
    background: linear-gradient(180deg, rgba(0, 87, 107, 0.95) 0%, rgba(0, 87, 107, 0.85) 25%, rgba(0, 87, 107, 0.5) 50%, rgba(0, 87, 107, 0.2) 75%, rgba(0, 87, 107, 0) 100% );
    backdrop-filter: blur(2px);
}

.overlay-variant-5 {
    background: linear-gradient(180deg, rgba(0, 87, 107, 0.40) 0%, rgba(0, 87, 107, 0.20) 25%, rgba(0, 87, 107, 0.20) 50%, rgba(0, 87, 107, 0.30) 75%, rgba(0, 87, 107, 0.80) 100% );
}

.navbar-variant-6 {
    background: linear-gradient(180deg, rgba(20, 170, 170, 0.95) 0%, rgba(20, 170, 170, 0.85) 25%, rgba(20, 170, 170, 0.5) 50%, rgba(20, 170, 170, 0.2) 75%, rgba(20, 170, 170, 0) 100% );
    backdrop-filter: blur(2px);
}

.overlay-variant-6 {
    background: linear-gradient(180deg, rgba(20, 170, 170, 0.40) 0%, rgba(20, 170, 170, 0.20) 25%, rgba(20, 170, 170, 0.20) 50%, rgba(20, 170, 170, 0.30) 75%, rgba(20, 170, 170, 0.80) 100% );
}

/* =============== GRUP 3: KOYU TONLAR =============== */

.navbar-variant-7 {
    background: linear-gradient(180deg, rgba(10, 20, 40, 0.95) 0%, rgba(10, 20, 40, 0.85) 25%, rgba(10, 20, 40, 0.5) 50%, rgba(10, 20, 40, 0.2) 75%, rgba(10, 20, 40, 0) 100% );
    backdrop-filter: blur(2px);
}

.overlay-variant-7 {
    background: linear-gradient(180deg, rgba(10, 20, 40, 0.40) 0%, rgba(10, 20, 40, 0.20) 25%, rgba(10, 20, 40, 0.20) 50%, rgba(10, 20, 40, 0.30) 75%, rgba(10, 20, 40, 0.80) 100% );
}

.navbar-variant-8 {
    background: linear-gradient(180deg, rgba(5, 15, 35, 0.95) 0%, rgba(5, 15, 35, 0.85) 25%, rgba(5, 15, 35, 0.5) 50%, rgba(5, 15, 35, 0.2) 75%, rgba(5, 15, 35, 0) 100% );
    backdrop-filter: blur(2px);
}

.overlay-variant-8 {
    background: linear-gradient(180deg, rgba(5, 15, 35, 0.40) 0%, rgba(5, 15, 35, 0.20) 25%, rgba(5, 15, 35, 0.20) 50%, rgba(5, 15, 35, 0.30) 75%, rgba(5, 15, 35, 0.80) 100% );
}

.navbar-variant-9 {
    background: linear-gradient(180deg, rgba(12, 28, 45, 0.95) 0%, rgba(12, 28, 45, 0.85) 25%, rgba(12, 28, 45, 0.5) 50%, rgba(12, 28, 45, 0.2) 75%, rgba(12, 28, 45, 0) 100% );
}

.overlay-variant-9 {
    background: linear-gradient(180deg, rgba(12, 28, 45, 0.40) 0%, rgba(12, 28, 45, 0.20) 25%, rgba(12, 28, 45, 0.20) 50%, rgba(12, 28, 45, 0.30) 75%, rgba(12, 28, 45, 0.80) 100% );
}

/* =============== GRUP 4: TURKUAZ-MAVİ KARIŞIMI =============== */

.navbar-variant-10 {
    background: linear-gradient(180deg, rgba(0, 105, 128, 0.95) 0%, rgba(0, 105, 128, 0.85) 25%, rgba(0, 105, 128, 0.5) 50%, rgba(0, 105, 128, 0.2) 75%, rgba(0, 105, 128, 0) 100% );
    backdrop-filter: blur(2px);
}

.overlay-variant-10 {
    background: linear-gradient(180deg, rgba(0, 105, 128, 0.40) 0%, rgba(0, 105, 128, 0.20) 25%, rgba(0, 105, 128, 0.20) 50%, rgba(0, 105, 128, 0.30) 75%, rgba(0, 105, 128, 0.80) 100% );
}

.navbar-variant-11 {
    background: linear-gradient(180deg, rgba(15, 76, 92, 0.95) 0%, rgba(15, 76, 92, 0.85) 25%, rgba(15, 76, 92, 0.5) 50%, rgba(15, 76, 92, 0.2) 75%, rgba(15, 76, 92, 0) 100% );
    backdrop-filter: blur(2px);
}

.overlay-variant-11 {
    background: linear-gradient(180deg, rgba(15, 76, 92, 0.40) 0%, rgba(15, 76, 92, 0.20) 25%, rgba(15, 76, 92, 0.20) 50%, rgba(15, 76, 92, 0.30) 75%, rgba(15, 76, 92, 0.80) 100% );
}