/* =========================================================
   TOPBAR V6 – AÇIK CAM ŞERİT + KIVRIMLI LOGO SEKMESİ + DUYURU
   header.css'ten sonra yüklenir; eski topbar kurallarını ezer.
   ========================================================= */
:root { --hdr: 84px; }

.topbar {
    background: linear-gradient(180deg, rgba(255, 255, 255, .92) 0%, rgba(240, 248, 255, .84) 100%);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-bottom: 0;
    border-radius: 0 0 34px 34px;
    box-shadow: 0 8px 28px -10px rgba(10, 90, 170, .35);
}
.topbar.is-scrolled { background: rgba(255, 255, 255, .97); }
.topbar::after { content: none; }

/* ---------- İÇ SAYFALAR: şerit boşluğu ----------
   --subnav-h : topbar'ın altındaki ana menü şeridinin (subnav) kapladığı yükseklik.
   Ana sayfada 0 (orada T menü var), mobilde 0 (tam sayfa menü var).
   Hero'su olmayan iç sayfalar bu boşluğu spacer ile otomatik alır;
   kendi hero'su olan sayfalar (örn. kurumsal) hero'yu bu yüksekliğe kadar yukarı çeker. */
body { --subnav-h: 0px; }
@media (min-width: 901px) { body:not(.is-hero) { --subnav-h: 96px; } }

/* şeridin arkasında sayfa zemini (koyu) görünmesin: hero'su olmayan iç sayfalarda da açık mavi-beyaz kalır */
.topbar-spacer { height: calc(var(--hdr) + var(--subnav-h)); background: linear-gradient(180deg, #e3f0f9 0%, #eaf4fb 100%); }

.topbar-in {
    justify-content: flex-start;
    gap: 18px;
    padding: 0 28px 0 0;
}

/* ---------- LOGO SEKMESİ ---------- */
.topbar-logo {
    position: relative;
    align-self: flex-start;
    flex: none;
    height: calc(var(--hdr) + 22px);
    padding: 0 70px 0 34px;
    box-sizing: border-box;
    background: linear-gradient(180deg, #ffffff 0%, #f1f8ff 100%);
    border-radius: 0 0 90px 38px;
    border-bottom: 3px solid #25c3fd;
    box-shadow: 0 10px 26px -8px rgba(0, 170, 255, .55), 0 0 0 1px rgba(37, 195, 253, .18);
    z-index: 2;
}
.topbar-logo img {
    height: calc(var(--hdr) - 12px);
    max-width: 260px;
    filter: none;
}

/* ---------- DUYURU ALANI ---------- */
.topbar-notice {
    flex: 1;
    min-width: 0;
    max-width: 640px;
    margin-left: 16px;
    height: 44px;
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 0 0 0 22px;
    box-sizing: border-box;
    border: 0;
    border-left: 1px solid rgba(10, 90, 170, .16);
    border-radius: 0;
    background: none;
}

/* ---------- HIZLI ARAMA ---------- */
.topbar-contact {
    display: flex;
    align-items: center;
    gap: 24px;
    margin-left: auto;
}
.topbar-phone,
.topbar-mail {
    display: flex;
    align-items: center;
    gap: 12px;
    text-decoration: none;
    color: #0b2a4a;
}
.tp-ico {
    display: grid;
    place-items: center;
    width: 42px; height: 42px;
    border-radius: 50%;
    background: linear-gradient(135deg, #e6f6ff, #cdeeff);
    color: #0a8fe8;
    transition: background .25s ease, color .25s ease;
}
.tp-ico svg { width: 20px; height: 20px; }
.tp-txt { display: flex; flex-direction: column; line-height: 1.2; }
.tp-txt small { font-size: 11px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: #5b7a96; }
.tp-txt b { font-size: 15px; font-weight: 700; }
.topbar-phone:hover .tp-ico,
.topbar-mail:hover .tp-ico { background: linear-gradient(135deg, #1aa7ff, #0a7fe0); color: #fff; }
@media (max-width: 1450px) { .topbar-mail .tp-txt { display: none; } }
@media (max-width: 1250px) { .tp-txt { display: none; } .topbar-contact { gap: 10px; } }
.tn-badge {
    flex: none;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: 32px;
    padding: 0 16px 0 12px;
    border-radius: 999px;
    background: linear-gradient(90deg, #1aa7ff 0%, #0a7fe0 100%);
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
}
.tn-badge i {
    width: 8px; height: 8px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 0 0 0 rgba(255, 255, 255, .8);
    animation: tnPulse 1.8s ease-out infinite;
}
@keyframes tnPulse { to { box-shadow: 0 0 0 9px rgba(255, 255, 255, 0); } }

.tn-track { position: relative; flex: 1; min-width: 0; height: 100%; overflow: hidden; }
.tn-item {
    position: absolute;
    left: 0; right: 0; top: 0; bottom: 0;
    display: flex;
    align-items: center;
    color: #0b2a4a;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    opacity: 0;
    transform: translateY(12px);
    pointer-events: none;
    transition: opacity .45s ease, transform .45s ease, color .2s ease;
}
.tn-item.is-on { opacity: 1; transform: none; pointer-events: auto; }
.tn-item:hover { color: #0a8fe8; }

/* duyuru okları: önceki / sonraki duyuru */
.tn-nav { flex: none; display: flex; gap: 6px; }
.tn-btn {
    all: unset;
    box-sizing: border-box;
    flex: none;
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border: 1px solid rgba(37, 195, 253, .55);
    border-left: 4px solid #25c3fd;
    border-radius: 4px;
    background: #fff;
    color: #0a8fe8;
    cursor: pointer;
    transition: background .25s ease, color .25s ease, box-shadow .25s ease;
}
.tn-btn svg { width: 16px; height: 16px; }
.tn-btn:hover { background: linear-gradient(90deg, #1aa7ff, #0a7fe0); color: #fff; box-shadow: 0 4px 14px -3px rgba(0, 150, 255, .7); }
.tn-btn:focus-visible { outline: 2px solid #0a8fe8; outline-offset: 2px; }

/* ---------- ARAMA + MENÜ (yuvarlak düğmeler) ---------- */
.topbar-tools {
    margin: 0;
    height: auto;
    gap: 10px;
    border: 0;
    border-radius: 0;
    background: none;
    box-shadow: none;
}
.tb-btn {
    width: 48px;
    height: 48px;
    border: 1px solid rgba(10, 90, 170, .18);
    border-radius: 50%;
    background: #fff;
    color: #0b2a4a;
    box-shadow: 0 4px 14px -6px rgba(10, 90, 170, .4);
}
.tb-btn svg { width: 21px; height: 21px; }
.tb-btn:hover { background: #eaf6ff; color: #0a8fe8; }
.tb-btn[aria-expanded="true"] {
    background: linear-gradient(135deg, #1aa7ff, #0a7fe0);
    border-color: transparent;
    color: #fff;
    box-shadow: 0 6px 18px -4px rgba(0, 150, 255, .7);
}

/* ---------- TEKLİF AL ---------- */
.topbar-cta {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    height: 48px;
    padding: 0 26px 0 22px;
    box-sizing: border-box;
    border: 0;
    border-radius: 999px;
    background: linear-gradient(90deg, #1aa7ff 0%, #0a7fe0 100%);
    box-shadow: 0 8px 22px -6px rgba(0, 150, 255, .7);
    color: #fff;
    font-size: 15px;
    font-weight: 600;
    transition: transform .25s ease, box-shadow .25s ease;
}
.topbar-cta svg { width: 20px; height: 20px; }
.topbar-cta:hover {
    background: linear-gradient(90deg, #1aa7ff 0%, #0a7fe0 100%);
    transform: translateY(-2px);
    box-shadow: 0 12px 26px -6px rgba(0, 150, 255, .85);
}

/* ---------- RESPONSIVE ---------- */
@media (max-width: 1100px) {
    .topbar-notice { max-width: 420px; }
}
@media (max-width: 900px) {
    :root { --hdr: 64px; }
    .topbar { border-radius: 0 0 22px 22px; }
    .topbar-in { gap: 10px; padding-right: 12px; }
    .topbar-logo { height: calc(var(--hdr) + 14px); padding: 0 44px 0 16px; border-radius: 0 0 60px 24px; }
    .topbar-logo img { height: calc(var(--hdr) - 12px); max-width: 150px; }
    .topbar-notice { display: none; }
    .tb-btn { width: 40px; height: 40px; }
    .topbar-cta { display: none !important; }   /* "Hemen Ara" butonu mobilde görünmez */
}

@media (prefers-reduced-motion: reduce) {
    .tn-badge i, .t3d-plate-arrow { animation: none; }
    .tn-item { transition: none; }
}

/* =========================================================
   SLIDER OKLARI – TABELANIN KAİDESİNDE
   Kaide: [● ──────── ‹ ›]  (menü satırlarıyla aynı dil:
   sol cyan yan yüz + cam ön yüz)
   ========================================================= */
.t3d-plate-line { margin-right: calc(22 * var(--u)); }

.t3d-plate-arrow {
    all: unset;
    box-sizing: border-box;
    flex: none;
    display: grid;
    place-items: center;
    width: max(34px, calc(72 * var(--u)));
    height: max(30px, calc(56 * var(--u)));
    margin-left: calc(12 * var(--u));
    border: 1.5px solid #7ae7ff;
    border-radius: 3px;
    /* neon: parlak cyan kenarlık, içte hafif cyan dolgu, dışa doğru ışıma */
    background: linear-gradient(180deg, rgba(0, 217, 255, .34) 0%, rgba(0, 120, 220, .26) 100%);
    box-shadow:
        0 0 6px #00d9ff,
        0 0 18px rgba(0, 217, 255, .85),
        0 0 36px rgba(0, 217, 255, .45),
        inset 0 0 12px rgba(120, 232, 255, .55);
    color: #fff;
    filter: drop-shadow(0 0 4px rgba(0, 217, 255, .9));
    cursor: pointer;
    pointer-events: auto;          /* kaide tıklamaya kapalı, oklar açık */
    animation: plateArrowGlow 2.6s ease-in-out infinite;
    transition: background .25s ease, color .25s ease, transform .2s ease;
}
.t3d-plate-arrow:nth-of-type(2) { animation-delay: -1.3s; }
.t3d-plate-arrow svg {
    width: 58%;
    height: 58%;
    filter: drop-shadow(0 0 4px #00d9ff) drop-shadow(0 0 10px #00d9ff);
}
@keyframes plateArrowGlow {
    50% { box-shadow: 0 0 4px #00d9ff, 0 0 12px rgba(0, 217, 255, .65), 0 0 24px rgba(0, 217, 255, .3), inset 0 0 8px rgba(120, 232, 255, .4); }
}
.t3d-plate-arrow:hover {
    background: linear-gradient(180deg, #5fe3ff 0%, #1aa7ff 100%);
    color: #00334f;
    animation: none;
    box-shadow: 0 0 8px #fff, 0 0 24px #00d9ff, 0 0 48px rgba(0, 217, 255, .8);
}
.t3d-plate-arrow:hover svg { filter: none; }
.t3d-plate-arrow:active { transform: scale(.94); }
.t3d-plate-arrow:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }

/* masaüstünde eski alt oklar gizli (oklar kaidede); mobilde kaide yok, alt oklar geri gelir */
.slider-arrows { display: none; }
@media (max-width: 900px) { .slider-arrows { display: flex; } }

/* =========================================================
   ANA MENÜ ŞERİDİ  (header.php → #subNav)  — önek: subnav
   Ana sayfa dışındaki sayfalarda, YALNIZCA masaüstünde, topbar'ın
   hemen altında ortalı duran cam hap menü. Topbar ile aynı dil:
   beyaz cam yüzey, yuvarlak formlar, aktif sayfada mavi gradyan,
   altta neon ışık çizgisi. Sayfayla birlikte kayar (sabit değil);
   topbar zaten sabit olduğundan menüye her zaman logo'dan ulaşılır.
   Öğeler veri tabanındaki ana_menu tablosundan gelir.
   Hamburger düğmesi bu menüyle ilgisizdir (serbest).
   ========================================================= */
.subnav { display: none; }

@media (min-width: 901px) {
    .subnav {
        --sn-ink: #0b2a4a;
        --sn-sky: #0a8fe8;
        --sn-neon: #00d9ff;
        --sn-ease: cubic-bezier(.16, 1, .3, 1);
        position: absolute;
        z-index: 60;
        top: calc(var(--hdr) + 26px);   /* logo sekmesinin (+22px) altından başlar */
        left: 0;
        right: 0;
        width: max-content;
        max-width: calc(100% - 48px);
        margin-inline: auto;
        display: flex;
        align-items: center;
        gap: 4px;
        padding: 6px;
        overflow-x: auto;
        scrollbar-width: none;
        border: 1px solid rgba(255, 255, 255, .65);
        border-radius: 999px;
        background: linear-gradient(180deg, rgba(255, 255, 255, .95) 0%, rgba(240, 248, 255, .9) 100%);
        -webkit-backdrop-filter: blur(16px);
        backdrop-filter: blur(16px);
        box-shadow:
            0 20px 40px -16px rgba(10, 90, 170, .6),
            0 0 0 4px rgba(255, 255, 255, .26),
            inset 0 1px 0 #fff;
        font-family: 'Segoe UI', 'Helvetica Neue', Roboto, Arial, sans-serif;
        animation: subnavIn .8s var(--sn-ease) .1s both;
    }
    .subnav::-webkit-scrollbar { display: none; }
    /* altta neon ışık çizgisi */
    .subnav::after {
        content: "";
        position: absolute;
        left: 12%; right: 12%; bottom: 0;
        height: 2px;
        background: linear-gradient(90deg, rgba(0, 217, 255, 0), var(--sn-neon) 50%, rgba(0, 217, 255, 0));
        filter: drop-shadow(0 0 5px rgba(0, 217, 255, .85));
        pointer-events: none;
    }

    .subnav-item {
        position: relative;
        flex: none;
        display: inline-flex;
        align-items: center;
        gap: 9px;
        height: 42px;
        padding: 0 20px 0 15px;
        border-radius: 999px;
        color: var(--sn-ink);
        font-size: 14.5px;
        font-weight: 600;
        letter-spacing: .1px;
        white-space: nowrap;
        text-decoration: none;
        transition: background .25s ease, color .25s ease, box-shadow .3s ease, transform .35s var(--sn-ease);
        animation: subnavItem .6s var(--sn-ease) both;
        animation-delay: calc(var(--i) * 60ms + 260ms);
    }
    .subnav-ico { flex: none; width: 19px; height: 19px; color: var(--sn-sky); transition: color .25s ease, transform .35s var(--sn-ease); }

    .subnav-item:hover,
    .subnav-item:focus-visible {
        background: #eaf6ff;
        color: var(--sn-sky);
        transform: translateY(-1px);
        outline: none;
    }
    .subnav-item:hover .subnav-ico { transform: scale(1.12); }
    .subnav-item:focus-visible { box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--sn-sky); }

    /* bulunduğun sayfa */
    .subnav-item.is-active {
        background: linear-gradient(90deg, #1aa7ff 0%, #0a7fe0 100%);
        color: #fff;
        box-shadow: 0 8px 20px -6px rgba(0, 150, 255, .8);
    }
    .subnav-item.is-active .subnav-ico { color: #fff; }
    .subnav-item.is-active:hover { transform: none; background: linear-gradient(90deg, #1aa7ff 0%, #0a7fe0 100%); color: #fff; }
}
@keyframes subnavIn   { from { opacity: 0; transform: translateY(-14px); } }
@keyframes subnavItem { from { opacity: 0; transform: translateY(8px); } }

@media (prefers-reduced-motion: reduce) {
    .subnav, .subnav-item { animation: none !important; transition: none !important; }
}