﻿/* Buradaki :root bloğu KALDIRILDI (2026-09-08): sekiz renk değişkeni tanımlıyordu
   ve HİÇBİRİ kullanılmıyordu — ölçüldü, sıfır `var(--primary-color)` vb. Yorumları da
   bayattı: "A modern blue" yazan değer #111827, yani neredeyse siyah.
   Renk kararları artık gts-tokens.css'te. */

body, html {
    margin: 0;
    font-family: "Montserrat", sans-serif;
    font-optical-sizing: auto;
    font-style: normal;
    /* clip: yatay taşmayı gizler ama kaydırma-kabı YARATMAZ → position:sticky çalışır
       (hidden bir scroll container oluşturup sticky sidebar'ı kırıyordu) */
    overflow-x: clip;
    scroll-behavior: smooth;
}
/* Scroll bar'ın genel genişliğini ayarlayın */
::-webkit-scrollbar {
    width: 12px; /* Dikey scrollbar genişliği */
    height: 12px; /* Yatay scrollbar genişliği */
}

/* Scroll bar arka planı */
::-webkit-scrollbar-track {
    background: #f1f1f1; /* Arka plan rengi */
    border-radius: 10px; /* Köşeleri yuvarlat */
}

/* Scroll barın kendisi */
::-webkit-scrollbar-thumb {
    background: #888; /* Scroll barın rengi */
    border-radius: 10px; /* Scroll bar köşelerini yuvarlat */
    border: 3px solid #f1f1f1; /* Scroll barın içindeki boşluk */
}

    /* Scroll bar üzerine gelince (hover) */
    ::-webkit-scrollbar-thumb:hover {
        background: #555; /* Hover sırasında renk değişimi */
    }

/* Scroll barın köşesi (yatay ve dikey birleştiği yer) */
::-webkit-scrollbar-corner {
    background: #f1f1f1; /* Köşe arka plan rengi */
}

.body-content {
    flex: 1; /* İçeriği esnek hale getirir ve boş alanı doldurur */
}

/* ══════════════════════════════════════════════════
   TOP BAR
══════════════════════════════════════════════════ */
.top-bar {
    background: #1a202c;
    color: rgba(255,255,255,.75);
    font-size: .76rem;
    height: 36px;
    display: flex;
    align-items: center;
}

.top-bar .container {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.top-bar-left,
.top-bar-right {
    display: flex;
    align-items: center;
    gap: 22px;
}

.top-bar-link {
    color: rgba(255,255,255,.75);
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 5px;
    transition: color .15s;
    font-weight: 500;
}

.top-bar-link:hover { color: #fff; }

.top-bar-icon {
    color: rgba(255,255,255,.65);
    font-size: .95rem;
    text-decoration: none;
    transition: color .15s;
    line-height: 1;
}

.top-bar-icon:hover { color: #fff; }

.top-bar-sep {
    width: 1px;
    height: 14px;
    background: rgba(255,255,255,.2);
}

/* Language switcher */
.top-lang {
    display: flex;
    align-items: center;
    gap: 0;
}

.top-lang form {
    display: flex;
    align-items: center;
    gap: 0;
}

.lang-btn {
    background: none;
    border: none;
    color: rgba(255,255,255,.6);
    font-size: .72rem;
    font-weight: 700;
    padding: 2px 7px;
    cursor: pointer;
    letter-spacing: .5px;
    transition: color .15s;
    line-height: 1;
}

.lang-btn:hover { color: #fff; }
.lang-btn.active { color: #fff; }
.lang-btn + .lang-sep { color: rgba(255,255,255,.3); font-size: .7rem; }

/* Currency switcher */
.top-currency {
    position: relative;
}

.cur-btn {
    background: none;
    border: 1px solid rgba(255,255,255,.25);
    border-radius: 6px;
    color: rgba(255,255,255,.85);
    font-size: .76rem;
    font-weight: 700;
    padding: 3px 9px;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 4px;
    transition: all .15s;
    line-height: 1;
    white-space: nowrap;
}

.cur-btn:hover {
    background: rgba(255,255,255,.1);
    color: #fff;
    border-color: rgba(255,255,255,.4);
}

.cur-submenu {
    position: absolute;
    top: 100%;
    right: 0;
    left: auto;
    z-index: 1200;
    min-width: 175px;
    background: #fff;
    border: 1px solid #e9edf2;
    border-radius: 12px;
    box-shadow: 0 8px 28px rgba(0,0,0,.13);
    padding: 6px;
    padding-top: 12px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(6px);
    transition: opacity .18s, transform .18s, visibility .18s;
    pointer-events: none;
}

.top-currency:hover .cur-submenu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
}

.cur-item {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 8px 11px;
    border-radius: 8px;
    font-size: .82rem;
    font-weight: 500;
    color: #4a5568;
    background: none;
    border: none;
    width: 100%;
    cursor: pointer;
    text-align: left;
    transition: background .12s, color .12s;
}

.cur-item:hover { background: #f8fafc; color: #BA1B21; }
.cur-item.active { background: #fff5f5; color: #BA1B21; font-weight: 700; }

.cur-item .cur-sym {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 6px;
    background: #f0f4f8;
    font-size: .82rem;
    font-weight: 800;
    flex-shrink: 0;
}

/* ══════════════════════════════════════════════════
   SITE HEADER / NAVBAR
══════════════════════════════════════════════════ */
.site-header {
    position: sticky;
    top: 0;
    z-index: 1030;
    background: #fff;
    border-bottom: 1px solid #f0f4f8;
    transition: box-shadow .22s;
}

.site-header.scrolled {
    box-shadow: 0 4px 20px rgba(0,0,0,.09);
}

.site-nav {
    display: flex;
    align-items: center;
    height: 72px;
    gap: 0;
}

/* Logo */
.site-logo {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    margin-right: 32px;
    text-decoration: none;
}

.site-logo img {
    height: 44px;
    width: auto;
    object-fit: contain;
}

/* Nav links list */
.nav-menu {
    display: flex;
    align-items: center;
    gap: 2px;
    list-style: none;
    margin: 0;
    padding: 0;
    flex: 1;
    height: 100%;
}

.nav-menu > li {
    height: 100%;
    display: flex;
    align-items: center;
    position: relative;
}

.nav-menu .nav-link {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: .875rem;
    font-weight: 600;
    color: #2d3748;
    text-decoration: none;
    padding: 8px 14px;
    border-radius: 10px;
    transition: color .15s, background .15s;
    white-space: nowrap;
    position: relative;
    cursor: pointer;
    height: 100%;
}

.nav-menu .nav-link:hover {
    color: #BA1B21;
    background: #fff5f5;
}

.nav-menu .nav-link.active {
    color: #BA1B21;
}

.nav-menu .nav-link.active::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 14px;
    right: 14px;
    height: 2px;
    border-radius: 2px 2px 0 0;
    background: #BA1B21;
}

.nav-link-chevron {
    font-size: .65rem;
    color: #a0aec0;
    transition: transform .22s;
}

.has-dropdown:hover .nav-link-chevron {
    transform: rotate(180deg);
    color: #BA1B21;
}

/* ── Mega menu (Turlar) ── */
.mega-menu {
    position: absolute;
    top: 100%;              /* linke bitişik başlar; görsel boşluk padding ile verilir */
    left: 0;
    padding-top: 8px;       /* ŞEFFAF köprü: link ile menü arası boşluğu hover'a dahil eder */
    opacity: 0;
    visibility: hidden;
    transform: translateY(6px);
    transition: opacity .22s, transform .22s, visibility .22s;
    z-index: 1100;
    pointer-events: none;
}

.has-dropdown:hover .mega-menu,
.has-dropdown:hover .nav-submenu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
}

/* ── Mega menu container ── */
.mega-inner {
    display: flex;
    width: 660px;
    /* Az linkli menü (dinamik otel şehirleri) de Turlar kadar heybetli dursun:
       yükseklik link sayısından bağımsız sabit taban; sağdaki görsel küçülmez. */
    min-height: 410px;
    background: #fff;
    border: 1px solid #e5e0da;
    border-radius: 18px;
    box-shadow:
        0 2px 8px rgba(15,10,5,.05),
        0 12px 32px rgba(15,10,5,.10),
        0 32px 64px rgba(15,10,5,.06);
    overflow: hidden;
}

/* ── Sol panel: kategoriler ── */
.mega-cats {
    flex: 1;
    display: flex;
    flex-direction: column;
    padding: 24px 22px 22px;
    min-width: 0;
}

.mega-cats-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid #f0ece8;
}

.mega-cats-head span {
    font-size: .68rem;
    font-weight: 700;
    color: #b5ada6;
    text-transform: uppercase;
    letter-spacing: .8px;
}

.mega-all {
    font-size: .74rem;
    font-weight: 600;
    color: #9c9490;
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 1px;
    transition: color .13s;
}
.mega-all:hover { color: #BA1B21; }
.mega-all i { font-size: 1rem; }

.mega-list {
    display: flex;
    flex-direction: column;
    gap: 1px;
    flex: 1;
}

.mega-item {
    display: flex;
    flex-direction: column;
    gap: 1px;
    padding: 9px 12px 9px 14px;
    border-radius: 8px;
    text-decoration: none;
    color: inherit;
    border-left: 2px solid transparent;
    transition: background .13s, border-color .13s;
}
.mega-item:hover {
    background: #faf7f4;
    border-left-color: #BA1B21;
}
.mega-item strong {
    font-size: .84rem;
    font-weight: 600;
    color: #1c1410;
    letter-spacing: -.01em;
    line-height: 1.3;
}
.mega-item span {
    font-size: .71rem;
    color: #a8a09a;
    line-height: 1.3;
}

/* ── Sağ panel: featured + güven ── */
.mega-featured {
    width: 230px;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    border-left: 1px solid #f0ece8;
}

.mega-feat-card {
    flex: 1;
    display: block;
    text-decoration: none;
    position: relative;
    background:
        linear-gradient(
            165deg,
            rgba(10,6,3,.30) 0%,
            rgba(10,6,3,.62) 70%
        ),
        url('/images/placeholder.jpg') center/cover no-repeat;
    min-height: 200px;
    overflow: hidden;
    transition: opacity .15s;
}
.mega-feat-card:hover { opacity: .92; }

.mega-feat-content {
    position: absolute;
    bottom: 0; left: 0; right: 0;
    padding: 20px 18px 18px;
    background: linear-gradient(to top, rgba(10,6,3,.80) 0%, transparent 100%);
}

.mega-feat-tag {
    display: inline-block;
    font-size: .62rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: rgba(255,255,255,.70);
    margin-bottom: 6px;
}

.mega-feat-title {
    font-size: 1rem;
    font-weight: 700;
    color: #fff;
    line-height: 1.25;
    letter-spacing: -.02em;
    margin-bottom: 10px;
}

.mega-feat-cta {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: .75rem;
    font-weight: 700;
    color: #fff;
    background: #BA1B21;
    padding: 5px 12px;
    border-radius: 20px;
    letter-spacing: .02em;
    transition: background .13s;
}
.mega-feat-card:hover .mega-feat-cta { background: #9e1519; }

/* ── Güven rozetleri ── */
.mega-trust-row {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0;
    padding: 12px 14px;
    border-top: 1px solid #f0ece8;
    background: #faf7f4;
}

.mega-trust-item {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: .63rem;
    font-weight: 600;
    color: #78716c;
    white-space: nowrap;
    padding: 0 8px;
}
.mega-trust-item i { color: #BA1B21; font-size: .7rem; }

.mega-trust-sep {
    width: 1px;
    height: 10px;
    background: #e5e0da;
    flex-shrink: 0;
}

/* ── Oteller mega menü: öne çıkan kart başlangıç görseli (JS rastgele otel kapağıyla değiştirir) ── */
.mega-feat-card--hotels {
    background:
        linear-gradient(165deg, rgba(10,6,3,.28) 0%, rgba(10,6,3,.68) 75%),
        url('/images/placeholder.jpg') center/cover no-repeat;
}

/* ── Simple submenu (Oteller) ── */
.nav-submenu {
    position: absolute;
    top: calc(100% + 1px);
    left: 0;
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    transition: opacity .22s, transform .22s, visibility .22s;
    z-index: 1100;
    pointer-events: none;
    background: #fff;
    border: 1px solid #e9edf2;
    border-radius: 14px;
    box-shadow: 0 12px 40px rgba(0,0,0,.12);
    padding: 8px;
    min-width: 200px;
}

.submenu-item {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 9px 12px;
    border-radius: 9px;
    font-size: .84rem;
    font-weight: 500;
    color: #4a5568;
    text-decoration: none;
    transition: background .12s, color .12s;
}

.submenu-item i { font-size: .85rem; color: #a0aec0; }
.submenu-item:hover { background: #f8fafc; color: #BA1B21; }
.submenu-item:hover i { color: #BA1B21; }

.submenu-sep {
    height: 1px;
    background: #f0f4f8;
    margin: 5px 8px;
}

/* ── Auth area ── */
.nav-auth {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-shrink: 0;
    margin-left: auto;
}

.btn-nav-login {
    font-size: .84rem;
    font-weight: 600;
    color: #4a5568;
    text-decoration: none;
    padding: 9px 18px;
    border-radius: 10px;
    border: 1.5px solid #e2e8f0;
    transition: all .15s;
    white-space: nowrap;
}

.btn-nav-login:hover {
    border-color: #BA1B21;
    color: #BA1B21;
    background: #fff5f5;
}

.btn-nav-signup {
    font-size: .84rem;
    font-weight: 700;
    color: #fff;
    text-decoration: none;
    padding: 9px 20px;
    border-radius: 10px;
    background: #BA1B21;
    transition: background .15s, transform .1s;
    white-space: nowrap;
    display: flex;
    align-items: center;
    gap: 5px;
}

.btn-nav-signup:hover  { background: #8a1318; color: #fff; }
.btn-nav-signup:active { transform: scale(.97); }

/* User avatar dropdown button */
.nav-user-btn {
    display: flex;
    align-items: center;
    gap: 9px;
    background: none;
    border: 1.5px solid #e2e8f0;
    border-radius: 25px;
    padding: 5px 14px 5px 5px;
    cursor: pointer;
    transition: all .15s;
    color: #2d3748;
}

.nav-user-btn:hover,
.nav-user-btn[aria-expanded="true"] {
    border-color: #BA1B21;
    color: #BA1B21;
    background: #fff5f5;
}

.nav-avatar {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: #BA1B21;
    color: #fff;
    font-size: .7rem;
    font-weight: 800;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    letter-spacing: .5px;
}

.nav-username {
    font-size: .84rem;
    font-weight: 600;
    max-width: 130px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.nav-chevron {
    font-size: .68rem;
    color: #a0aec0;
    transition: transform .2s;
}

.nav-user-btn[aria-expanded="true"] .nav-chevron { transform: rotate(180deg); }

/* Account dropdown */
.nav-dropdown-menu {
    min-width: 220px;
    border: 1px solid #e9edf2;
    border-radius: 14px;
    box-shadow: 0 8px 28px rgba(0,0,0,.1);
    padding: 6px;
    margin-top: 8px !important;
}

.nav-dropdown-menu .dropdown-item {
    font-size: .84rem;
    border-radius: 9px;
    padding: 9px 13px;
    color: #4a5568;
    display: flex;
    align-items: center;
    gap: 10px;
    transition: background .12s, color .12s;
    background: none;
    border: none;
    width: 100%;
    cursor: pointer;
}

.nav-dropdown-menu .dropdown-item i {
    font-size: .9rem;
    color: #718096;
    width: 16px;
    flex-shrink: 0;
}

.nav-dropdown-menu .dropdown-item:hover        { background: #f8fafc; color: #BA1B21; }
.nav-dropdown-menu .dropdown-item:hover i      { color: #BA1B21; }
.nav-dropdown-menu .dropdown-divider           { margin: 5px 6px; border-color: #f0f4f8; }
.nav-logout-item                               { color: #BA1B21 !important; }
.nav-logout-item i                             { color: #BA1B21 !important; }
.nav-logout-item:hover                         { background: #fff5f5 !important; }

/* Mobile toggle */
.nav-toggle {
    display: none;
    align-items: center;
    justify-content: center;
    background: none;
    border: 1.5px solid #e2e8f0;
    border-radius: 9px;
    padding: 7px 11px;
    cursor: pointer;
    color: #4a5568;
    margin-left: auto;
    font-size: 1.3rem;
    transition: all .15s;
}

.nav-toggle:hover { border-color: #BA1B21; color: #BA1B21; background: #fff5f5; }

/* Nav collapse wrapper */
.nav-collapse {
    display: flex;
    align-items: center;
    flex: 1;
    height: 100%;
}

.icon { transition: transform 0.3s ease; }
.icon:hover { transform: scale(1.2); }

/* ══════════════════════════════════════════════════
   SECONDARY NAV BAR (Kurumsal / Hızlı Bağlantılar)
══════════════════════════════════════════════════ */
.site-nav-sub {
    background: #f8f9fc;
    border-top: 1px solid #edf2f7;
    border-bottom: 1px solid #edf2f7;
    height: 38px;
    display: flex;
    align-items: center;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    transform-origin: top center;
    transition: height .26s ease, opacity .2s ease, transform .26s ease, border-width .26s ease;
}

.site-nav-sub::-webkit-scrollbar { display: none; }

/* Scroll edilince kurumsal alt-bar yukarı kayıp kaybolur; sadece en üstte belirgin */
.site-header.scrolled .site-nav-sub {
    height: 0;
    border-top-width: 0;
    border-bottom-width: 0;
    opacity: 0;
    transform: translateY(-6px);
    pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
    .site-nav-sub { transition: none; }
}

.site-nav-sub .container {
    display: flex;
    align-items: center;
    height: 100%;
}

.sns-links {
    display: flex;
    align-items: center;
    gap: 4px;
    white-space: nowrap;
    height: 100%;
}

.sns-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: .76rem;
    font-weight: 500;
    color: #718096;
    text-decoration: none;
    padding: 4px 14px;
    border-radius: 6px;
    transition: color .14s, background .14s;
    height: 28px;
}

.sns-link i { font-size: .72rem; color: #a0aec0; transition: color .14s; }
.sns-link:hover { color: #BA1B21; background: #fff0f0; }
.sns-link:hover i { color: #BA1B21; }
.sns-active { color: #BA1B21 !important; font-weight: 700 !important; }
.sns-active i { color: #BA1B21 !important; }

.sns-sep {
    width: 1px;
    height: 16px;
    background: #e2e8f0;
    margin: 0 8px;
    flex-shrink: 0;
}

/* ── Responsive ── */
/* ══════════════════════════════════════
   TABLET 992px
   ══════════════════════════════════════ */
@media (max-width: 991px) {
    .top-bar { display: none; }
    .nav-toggle { display: flex; }
    .site-nav { flex-wrap: wrap; height: auto; padding: 10px 0; }
    .nav-collapse {
        display: none;
        flex-direction: column;
        align-items: flex-start;
        width: 100%;
        height: auto;
        padding: 8px 0 14px;
        border-top: 1px solid #f0f4f8;
        gap: 2px;
    }
    .nav-collapse.open { display: flex; }
    .nav-menu { flex-direction: column; align-items: flex-start; width: 100%; height: auto; gap: 2px; }
    .nav-menu > li { height: auto; width: 100%; }
    .nav-menu .nav-link { height: auto; width: 100%; }
    .nav-menu .nav-link.active::after { display: none; }
    .mega-menu, .nav-submenu {
        position: static; opacity: 1; visibility: visible; transform: none;
        box-shadow: none; border: none; border-radius: 0; padding: 0 0 0 16px;
        pointer-events: auto; width: 100%;
    }
    .mega-inner { width: 100%; border: none; box-shadow: none; padding: 8px 0; border-radius: 0; flex-direction: column; }
    .mega-cats { padding: 4px 0; }
    .mega-cats-head { display: none; }
    .mega-featured { display: none; } /* Mobil sidebar'da featured panel gizli */
    .has-dropdown .mega-menu, .has-dropdown .nav-submenu { display: none; }
    .has-dropdown.mobile-open .mega-menu, .has-dropdown.mobile-open .nav-submenu { display: block; }
    .nav-auth { width: 100%; padding-top: 10px; border-top: 1px solid #f0f4f8; }
    .site-logo { margin-right: auto; }
    .site-nav-sub { height: 34px; }
    .sns-link { font-size: .72rem; padding: 3px 9px; }
}

/* ══════════════════════════════════════════════════════════════
   MOBİL PREMIUM DRAWER — ≤991px  (tablet portre dahil)
   Sıcak taş + marka kırmızısı; kaydırmalı alt paneller, ikon çipleri,
   segment kontroller, kademeli açılış animasyonu.
   NOT: ≤991'e çıkarıldı — iPad portrede eski satır-içi menü yerine
   aynı premium çekmece kullanılsın (JS zaten <992'yi mobil sayıyor).
   ══════════════════════════════════════════════════════════════ */

/* Mobil-only elemanlar: varsayılan gizli */
.mob-drawer-head { display: none; }
.mob-panels      { display: none; }

/* Backdrop */
.mob-nav-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(28,25,23,.58);
    z-index: 1039;
    backdrop-filter: blur(6px) saturate(1.1);
    -webkit-backdrop-filter: blur(6px) saturate(1.1);
}
.mob-nav-overlay.show {
    display: block;
    animation: mobOverlayIn .3s ease;
}
@keyframes mobOverlayIn { from { opacity: 0; } to { opacity: 1; } }

@media (max-width: 991px) {

    /* ── Navbar bar: minimal 60px ── */
    .site-nav {
        height: 60px;
        padding: 0;
        flex-wrap: nowrap;
    }
    .site-logo img { height: 36px; }
    .site-logo { margin-right: 0; }
    .nav-toggle {
        width: 44px;
        height: 44px;
        border-radius: 13px;
        background: #F5F2EE;
        border: none;
        font-size: 1.25rem;
        color: #1C1917;
        margin-left: auto;
        margin-right: 10px;
        transition: background .15s, transform .15s;
    }
    .nav-toggle:hover, .nav-toggle:active { background: #EDE8E3; transform: scale(.96); }

    /* Secondary bar: mobilde gizle */
    .site-nav-sub { display: none !important; }

    /* ── Drawer: sağdan kayan full-height panel ── */
    .nav-collapse {
        display: flex !important;   /* always in DOM, hidden via transform */
        position: fixed !important;
        top: 0; right: 0 !important; bottom: 0;
        width: min(86vw, 420px);
        background: linear-gradient(180deg, #FFFDFB 0%, #FAF8F5 100%);
        z-index: 1040;
        transform: translateX(112%);
        transition: none;           /* JS ile etkinleştirilir — yüklenme flash'ını önler */
        overflow: hidden;
        box-shadow: -24px 0 70px -18px rgba(28,25,23,.34), -1px 0 0 rgba(28,25,23,.04);
        flex-direction: column;
        align-items: stretch;
        border-top: none;
        border-radius: 0;
        padding: 0;
        gap: 0;
        height: 100dvh;
        padding-top: env(safe-area-inset-top);
    }
    .nav-collapse.drawer-ready { transition: transform .46s cubic-bezier(.22,1,.36,1); }
    .nav-collapse.open { transform: translateX(0); }

    /* ── Drawer header ── */
    .mob-drawer-head {
        display: flex !important;
        align-items: center;
        justify-content: space-between;
        padding: 20px 20px 16px;
        position: relative;
        flex-shrink: 0;
    }
    .mob-drawer-head::after {
        content: ""; position: absolute; left: 20px; right: 20px; bottom: 0; height: 1px;
        background: linear-gradient(90deg, rgba(28,25,23,.09), rgba(28,25,23,0));
    }
    .mob-drawer-logo { display: block; line-height: 0; }
    .mob-drawer-logo img { height: 34px; width: auto; }
    .mob-drawer-close {
        width: 40px; height: 40px;
        border-radius: 13px;
        background: rgba(255,255,255,.7);
        border: 1px solid rgba(28,25,23,.08);
        color: #57534E;
        font-size: .95rem;
        cursor: pointer;
        display: flex; align-items: center; justify-content: center;
        flex-shrink: 0;
        transition: transform .18s cubic-bezier(.22,1,.36,1), background .18s, color .18s;
    }
    .mob-drawer-close:hover { background: #1C1917; color: #fff; transform: rotate(90deg); }

    /* ── Desktop nav ağacı mobilde tamamen gizli — içerik .mob-panels'te ── */
    .nav-menu  { display: none !important; }
    .nav-auth  { display: none !important; }

    /* ── Mobil panel sistemi ── */
    .mob-panels {
        display: flex !important;
        flex: 1;
        position: relative;
        overflow: hidden;
        min-height: 0;
    }
    .mob-panel {
        position: absolute;
        inset: 0;
        display: flex;
        flex-direction: column;
        background: transparent;
        transform: translateX(0);
        transition: transform .4s cubic-bezier(.22,1,.36,1), opacity .3s ease;
        overflow: hidden;
    }
    .mob-panel#mpMain.pushed { transform: translateX(-22%); opacity: 0; pointer-events: none; }
    .mob-sub-panel        { transform: translateX(100%); background: linear-gradient(180deg, #FFFDFB, #FBF9F6); }
    .mob-sub-panel.active { transform: translateX(0); }
    /* Aktif olmayan alt panel görünmez — konum/kırpma ne olursa olsun sağdan
       sızıp "yamuk" görünmesini engeller. Kayma animasyonunu bozmaz:
       .active olunca anında görünür olur, transform kayarak girer. */
    .mob-sub-panel:not(.active) { visibility: hidden; }
    .mob-panel-scroll {
        flex: 1;
        overflow-y: auto;
        overflow-x: hidden;
        padding: 6px 14px 4px;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: thin;
        scrollbar-color: #DAD3CB transparent;
    }
    .mob-panel-scroll::-webkit-scrollbar { width: 5px; }
    .mob-panel-scroll::-webkit-scrollbar-thumb { background: #DAD3CB; border-radius: 8px; }

    /* Bölüm etiketi (küçük büyük-harf) */
    .mob-sec-label {
        display: block;
        font-size: .62rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase;
        color: #A8A29E; padding: 14px 12px 7px;
    }

    /* ── Ana menü satırları — ikon çipi + başlık + alt başlık ── */
    .mob-nav-row {
        display: flex; align-items: center; gap: 12px;
        width: 100%; padding: 15px 14px; border-radius: 12px;
        background: none; border: none; cursor: pointer; font-family: inherit;
        text-decoration: none; text-align: left; position: relative;
        transition: background .16s, transform .16s cubic-bezier(.22,1,.36,1);
        margin-bottom: 1px;
    }
    .mob-nav-row:active { transform: scale(.985); }
    .mob-nav-row:hover  { background: #F5F2EE; }
    .mnr-body { flex: 1; display: flex; flex-direction: column; gap: 1px; min-width: 0; }
    .mnr-title { font-size: .98rem; font-weight: 600; color: #1C1917; letter-spacing: -.01em; line-height: 1.2; }
    .mnr-sub   { font-size: .74rem; font-weight: 500; color: #A8A29E; line-height: 1.25; }
    .mob-chev { font-size: .72rem; color: #C4BFBA; flex-shrink: 0; transition: transform .2s, color .2s; }
    .mob-nav-row:hover .mob-chev { color: #78716C; transform: translateX(2px); }

    /* Aktif satır — tek vurgu: kırmızı başlık + ince sol şerit */
    .mob-nav-active { background: #FBF6F5; }
    .mob-nav-active .mnr-title { color: #BA1B21; }
    .mob-nav-active::before {
        content: ""; position: absolute; left: 0; top: 12px; bottom: 12px; width: 3px;
        border-radius: 0 3px 3px 0; background: #BA1B21;
    }

    /* Kampanya satırı — _Layout inline stili background-clip:text uygular;
       alt öğelerde geri alıp tek renk (kırmızı başlık) bırakıyoruz. */
    .mob-campaign-row .mnr-title { color: #BA1B21; -webkit-text-fill-color: #BA1B21; background: none; -webkit-background-clip: border-box; background-clip: border-box; animation: none; }
    .mob-campaign-row .mnr-sub { color: #A8A29E; -webkit-text-fill-color: #A8A29E; }

    /* Kurumsal hızlı bağlantılar — mobilde ikincil menü çubuğu gizli olduğu
       için bu sayfaların tek erişim noktası burasıdır. Ana keşif satırlarıyla
       yarışmasın diye kasıtlı olarak küçük ve sessiz. */
    .mob-quick-links {
        display: grid; grid-template-columns: 1fr 1fr;
        gap: 2px 4px; margin: 0 16px; padding-top: 12px;
        border-top: 1px solid rgba(28,25,23,.07);
        flex-shrink: 0;
    }
    .mob-quick-links a {
        padding: 9px 12px; border-radius: 9px;
        font-size: .82rem; font-weight: 500; color: #78716C; text-decoration: none;
        transition: background .14s, color .14s;
    }
    .mob-quick-links a:hover { background: #F5F2EE; color: #1C1917; }

    /* Sub-panel header */
    .mob-sub-header {
        display: flex; align-items: center; gap: 11px;
        padding: 18px 18px 15px; position: relative; flex-shrink: 0;
    }
    .mob-sub-header::after {
        content: ""; position: absolute; left: 18px; right: 18px; bottom: 0; height: 1px;
        background: linear-gradient(90deg, rgba(28,25,23,.09), rgba(28,25,23,0));
    }
    .mob-back-btn {
        width: 38px; height: 38px; border-radius: 12px;
        background: rgba(255,255,255,.7); border: 1px solid rgba(28,25,23,.08);
        color: #44403C; font-size: .9rem; cursor: pointer;
        display: flex; align-items: center; justify-content: center;
        flex-shrink: 0; transition: transform .18s cubic-bezier(.22,1,.36,1), background .18s, color .18s;
    }
    .mob-back-btn:hover { background: #1C1917; color: #fff; transform: translateX(-2px); }
    .mob-sub-title { font-size: 1.18rem; font-weight: 700; color: #1C1917; flex: 1; letter-spacing: -.4px; }
    .mob-sub-all {
        font-size: .74rem; font-weight: 700; color: #BA1B21; text-decoration: none; white-space: nowrap;
        display: flex; align-items: center; gap: 4px; padding: 6px 11px; border-radius: 20px;
        background: rgba(186,27,33,.08); transition: background .15s;
    }
    .mob-sub-all:hover { background: rgba(186,27,33,.15); }

    /* Sub-panel satırları — sade metin, ikon yok */
    .mob-sub-row {
        display: flex; align-items: center;
        padding: 13px 14px; border-radius: 10px;
        text-decoration: none; color: inherit; position: relative;
        transition: background .14s, transform .14s cubic-bezier(.22,1,.36,1);
        margin-bottom: 1px;
    }
    .mob-sub-row:active { transform: scale(.99); }
    .mob-sub-row:hover, .mob-sub-row.active { background: #F5F2EE; }
    .mob-sub-text { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
    .mob-sub-text strong {
        font-size: .91rem; font-weight: 600;
        color: #1C1917; letter-spacing: -.01em; line-height: 1.25;
    }
    .mob-sub-text span {
        font-size: .74rem; color: #A8A29E; line-height: 1.3;
    }

    /* ── Utility bar: dil + kur (segment kontroller) ── */
    .mob-util-bar {
        display: flex; align-items: center; justify-content: space-between; gap: 10px;
        margin: 6px 14px 0; padding: 10px 14px; border-radius: 12px;
        background: #fff; border: 1px solid rgba(28,25,23,.07);
        flex-shrink: 0;
    }
    .mob-util-label {
        font-size: .74rem; font-weight: 600; color: #78716C; letter-spacing: .01em;
    }
    .mob-lang-form { display: flex; align-items: center; background: #F1ECE6; border-radius: 11px; padding: 3px; gap: 2px; }
    .mob-lang-btn {
        padding: 6px 14px; border-radius: 9px; font-size: .76rem; font-weight: 700;
        border: none; background: transparent; color: #78716C;
        cursor: pointer; font-family: inherit; transition: all .2s cubic-bezier(.22,1,.36,1);
    }
    .mob-lang-btn.active { background: #fff; color: #1C1917; box-shadow: 0 2px 6px rgba(28,25,23,.1); }
    .mob-lang-btn:not(.active):hover { color: #1C1917; }
    .mob-lang-sep { display: none; }
    .mob-cur-wrap { position: relative; }
    .mob-cur-btn {
        display: flex; align-items: center; gap: 6px;
        padding: 7px 11px; border-radius: 11px; font-size: .8rem; font-weight: 700;
        border: 1px solid rgba(28,25,23,.1); background: #fff; color: #1C1917;
        cursor: pointer; font-family: inherit; transition: border-color .18s, box-shadow .18s;
    }
    .mob-cur-btn:hover, .mob-cur-btn.open { border-color: #BA1B21; box-shadow: 0 2px 10px -4px rgba(186,27,33,.3); }
    .mob-cur-chev { font-size: .52rem; opacity: .5; transition: transform .22s; }
    .mob-cur-btn.open .mob-cur-chev { transform: rotate(180deg); }
    .mob-cur-menu {
        display: none; position: absolute; bottom: calc(100% + 8px); right: 0;
        background: #fff; border-radius: 14px;
        box-shadow: 0 12px 34px -8px rgba(28,25,23,.28); padding: 6px; min-width: 172px; z-index: 20;
        border: 1px solid rgba(28,25,23,.07);
    }
    .mob-cur-menu.open { display: block; animation: curPop .22s cubic-bezier(.22,1,.36,1); }
    @keyframes curPop { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }
    .mob-cur-item {
        display: flex; align-items: center; gap: 9px; width: 100%; text-align: left; padding: 9px 12px;
        font-size: .82rem; font-weight: 600; color: #44403C; border-radius: 9px;
        background: transparent; border: none; cursor: pointer; font-family: inherit;
        transition: background .12s, color .12s;
    }
    .mob-cur-item .cs { width: 22px; text-align: center; font-weight: 700; color: #78716C; }
    .mob-cur-item.active { color: #BA1B21; } .mob-cur-item.active .cs { color: #BA1B21; }
    .mob-cur-item:hover { background: #FBEEEC; color: #BA1B21; }

    /* ── Hesap paneli (mpUser) ──
       Koyu kart + kırmızı hâle kaldırıldı: çekmecenin geri kalanı açık taş
       yüzey kullanıyor, hesap ekranı da aynı dili konuşuyor. */
    .mob-acc-card {
        display: flex; align-items: center; gap: 13px;
        margin: 12px 2px 10px; padding: 14px;
        border-radius: 14px;
        background: #fff; border: 1px solid rgba(28,25,23,.08);
        flex-shrink: 0;
    }
    .mob-acc-avatar {
        width: 46px; height: 46px; border-radius: 14px; flex-shrink: 0;
        display: flex; align-items: center; justify-content: center; line-height: 1;
        background: #1C1917; color: #fff;
        font-size: .95rem; font-weight: 700; letter-spacing: -.02em;
    }
    .mob-acc-info { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
    .mob-acc-info strong { font-size: .97rem; font-weight: 700; color: #1C1917; letter-spacing: -.01em; }
    .mob-acc-info span {
        font-size: .74rem; color: #A8A29E; font-weight: 500;
        white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    }

    /* Hesap satırları — ikon çipi + başlık + açıklama (alt panel satırlarının ikizi) */
    .mob-acc-row {
        display: flex; align-items: center; gap: 12px;
        padding: 12px; border-radius: 10px;
        text-decoration: none; color: inherit;
        transition: background .14s, transform .14s cubic-bezier(.22,1,.36,1);
        margin-bottom: 1px;
    }
    .mob-acc-row:active { transform: scale(.99); }
    .mob-acc-row:hover  { background: #F5F2EE; }
    .mob-acc-ico {
        width: 34px; height: 34px; border-radius: 10px; flex-shrink: 0;
        display: flex; align-items: center; justify-content: center;
        background: #F1ECE6; color: #57534E; font-size: .92rem;
        transition: background .14s, color .14s;
    }
    .mob-acc-row:hover .mob-acc-ico { background: #EAE4DC; color: #1C1917; }
    .mob-acc-text { flex: 1; display: flex; flex-direction: column; gap: 1px; min-width: 0; }
    .mob-acc-text strong { font-size: .91rem; font-weight: 600; color: #1C1917; letter-spacing: -.01em; line-height: 1.25; }
    .mob-acc-text span   { font-size: .73rem; color: #A8A29E; line-height: 1.3; }

    /* Çıkış alanı — panelin altına sabit, tek ince ayraçla ayrılır */
    .mob-acc-foot {
        flex-shrink: 0; position: relative;
        padding: 12px 16px calc(14px + env(safe-area-inset-bottom));
    }
    .mob-acc-foot::before {
        content: ""; position: absolute; top: 0; left: 16px; right: 16px; height: 1px;
        background: rgba(28,25,23,.08);
    }

    /* mob-user-row (buton) — açık yüzey kart, mpUser'a iter */
    .mob-user-row {
        display: flex; align-items: center; gap: 12px; width: 100%; padding: 11px 12px;
        border-radius: 12px; background: #fff; border: 1px solid rgba(28,25,23,.08);
        text-decoration: none; cursor: pointer; font-family: inherit; text-align: left;
        transition: background .16s, border-color .16s, transform .18s cubic-bezier(.22,1,.36,1);
    }
    .mob-user-row:active { transform: scale(.99); }
    .mob-user-row:hover  { background: #FAF8F5; border-color: rgba(28,25,23,.16); }
    .mob-avatar-ico {
        width: 42px; height: 42px; border-radius: 13px; flex-shrink: 0;
        display: flex; align-items: center; justify-content: center; line-height: 1;
        background: #1C1917; color: #fff;
        font-size: .88rem; font-weight: 700; letter-spacing: -.02em;
    }
    .mob-user-info { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
    .mob-user-info strong { font-size: .92rem; font-weight: 600; color: #1C1917; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .mob-user-info span   { font-size: .73rem; color: #A8A29E; }

    /* Çıkış butonu — sessiz varsayılan, yalnız temasta kırmızıya döner */
    .mob-logout-btn {
        display: flex; align-items: center; justify-content: center; gap: 7px;
        width: 100%; padding: 12px; border-radius: 12px;
        font-size: .85rem; font-weight: 600;
        border: 1px solid rgba(28,25,23,.1); color: #78716C; background: #fff;
        cursor: pointer; font-family: inherit;
        transition: color .16s, border-color .16s;
    }
    .mob-logout-btn:hover { color: #BA1B21; border-color: rgba(186,27,33,.35); }

    /* ── Auth alanı ── */
    .mob-auth-bar {
        padding: 14px 18px calc(18px + env(safe-area-inset-bottom));
        margin-top: 8px; flex-shrink: 0; position: relative;
        background: linear-gradient(180deg, rgba(245,242,238,0), rgba(245,242,238,.7));
    }
    .mob-auth-bar::before {
        content: ""; position: absolute; top: 0; left: 18px; right: 18px; height: 1px;
        background: linear-gradient(90deg, rgba(28,25,23,0), rgba(28,25,23,.1), rgba(28,25,23,0));
    }
    .mob-auth-pitch {
        display: flex; align-items: center; gap: 7px; font-size: .72rem; color: #78716C; font-weight: 500;
        margin: 2px 2px 11px;
    }
    .mob-auth-pitch i { color: #BA1B21; }
    .mob-btn-signup {
        display: flex; align-items: center; justify-content: center; gap: 8px;
        width: 100%; padding: 14px; border-radius: 12px; font-size: .94rem; font-weight: 700;
        color: #fff; text-decoration: none; letter-spacing: .01em;
        background: #BA1B21;
        transition: background .16s, transform .18s cubic-bezier(.22,1,.36,1);
    }
    .mob-btn-signup:hover, .mob-btn-signup:active { background: #a3171c; color: #fff; }
    .mob-btn-login {
        display: flex; align-items: center; justify-content: center; gap: 7px;
        width: 100%; padding: 13px; margin-top: 9px; border-radius: 12px; font-size: .9rem; font-weight: 600;
        border: 1.5px solid rgba(28,25,23,.14); color: #1C1917; background: rgba(255,255,255,.65);
        text-decoration: none; transition: background .16s, border-color .16s;
    }
    .mob-btn-login:hover { background: #fff; border-color: #1C1917; color: #1C1917; }

    /* ── Sub-panel içi öne çıkan kart ── */
    .mob-feat-card {
        display: block; position: relative; text-decoration: none;
        margin: 14px 2px 8px; border-radius: 18px; overflow: hidden; min-height: 172px;
        background:
            linear-gradient(165deg, rgba(28,20,16,.15) 0%, rgba(28,20,16,.68) 70%),
            url('/images/placeholder.jpg') center/cover no-repeat;
        box-shadow: 0 12px 30px -14px rgba(28,25,23,.5);
        transition: transform .18s, box-shadow .18s;
    }
    .mob-feat-card:active { transform: scale(.985); }
    .mob-feat-card--hotels {
        background:
            linear-gradient(165deg, rgba(28,20,16,.15) 0%, rgba(28,20,16,.7) 75%),
            url('/images/placeholder.jpg') center/cover no-repeat;
    }
    .mob-feat-content {
        position: absolute; inset: auto 0 0 0; padding: 18px 16px 16px;
        background: linear-gradient(to top, rgba(20,14,10,.85) 0%, transparent 100%);
    }
    .mob-feat-tag {
        display: inline-flex; align-items: center; gap: 5px;
        font-size: .58rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
        color: #fff; background: rgba(255,255,255,.16);
        -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px);
        padding: 4px 9px; border-radius: 20px; margin-bottom: 9px;
    }
    .mob-feat-title {
        font-size: 1.12rem; font-weight: 700; color: #fff; line-height: 1.2;
        letter-spacing: -.3px; margin-bottom: 12px;
    }
    .mob-feat-cta {
        display: inline-flex; align-items: center; gap: 6px;
        font-size: .76rem; font-weight: 700; color: #fff;
        background: #BA1B21; padding: 8px 15px; border-radius: 22px;
        box-shadow: 0 8px 18px -8px rgba(186,27,33,.7);
    }
    .mob-feat-cta i { font-size: .82rem; line-height: 1; }

    /* ── Güven rozetleri satırı ── */
    .mob-trust-row {
        display: flex; align-items: center; justify-content: center; gap: 0;
        padding: 13px 14px calc(14px + env(safe-area-inset-bottom));
        position: relative; flex-shrink: 0;
    }
    .mob-trust-row::before {
        content: ""; position: absolute; top: 0; left: 18px; right: 18px; height: 1px;
        background: linear-gradient(90deg, rgba(28,25,23,0), rgba(28,25,23,.09), rgba(28,25,23,0));
    }
    .mob-trust-item {
        display: flex; align-items: center;
        font-size: .7rem; font-weight: 600; color: #78716C;
        letter-spacing: .02em; white-space: nowrap; padding: 0 12px;
    }
    .mob-trust-sep { width: 1px; height: 11px; background: #E5E0DA; flex-shrink: 0; }

    /* Kademeli açılış animasyonu kaldırıldı — öğeler doğrudan görünür. */
}

@media (max-width: 991px) and (prefers-reduced-motion: reduce) {
    .nav-collapse.drawer-ready { transition: transform .2s ease; }
    .nav-collapse.open #mpMain .mob-panel-scroll > *,
    .nav-collapse.open #mpMain .mob-util-bar,
    .nav-collapse.open #mpMain .mob-auth-bar { animation: none; }
}

/* Footer stilleri footer.css'e taşındı */
