/* =========================================================
   VIP TRANSFER FLEET — FINAL
   Masaüstü / Tablet / Mobil
   Yan Yana = grid
   Alt Alta = yatay liste
   ========================================================= */

.ks27-vipx__fleet{
    background:linear-gradient(180deg,#061b2e 0%,#08243a 100%);
    padding:72px 0;
    color:#fff;
}

.ks27-vipx__fleet .ks27-vipx__section-head,
.ks27-vipx__fleet .ks27-vipx__section-head *{
    color:#fff;
}

.ks27-vipx__fleet-toolbar{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    margin:22px 0 20px;
    padding:14px 16px;
    border:1px solid rgba(61,213,231,.25);
    border-radius:15px;
    background:linear-gradient(180deg,rgba(13,43,68,.94),rgba(7,31,51,.94));
    box-shadow:0 14px 30px rgba(0,0,0,.16);
}

.ks27-vipx__fleet-toolbar > div:first-child{
    display:flex;
    flex-direction:column;
    gap:3px;
}

.ks27-vipx__fleet-toolbar strong{
    font-size:14px;
}

.ks27-vipx__fleet-toolbar small{
    color:#9db8c8;
    font-size:12px;
}

.ks27-vipx__view-switch{
    display:flex;
    gap:6px;
    padding:5px;
    border:1px solid rgba(255,255,255,.12);
    border-radius:12px;
    background:#03192a;
}

.ks27-vipx__view-switch button{
    height:38px;
    padding:0 14px;
    border:0;
    border-radius:9px;
    background:transparent;
    color:#9eb9c9;
    font-weight:800;
    cursor:pointer;
    transition:.18s ease;
}

.ks27-vipx__view-switch button.is-active{
    background:linear-gradient(135deg,#18c9d7,#337df3);
    color:#fff;
    box-shadow:0 7px 18px rgba(33,149,255,.22);
}

.ks27-vipx .ks27-vipx__fleet-grid.ks27-vipx__fleet-grid--switchable{
    gap:18px !important;
    align-items:stretch !important;
}

/* Kart ortak görünüm */
.ks27-vipx .ks27-vipx__fleet-grid--switchable .ks27-vipx__fleet-card{
    border:1px solid rgba(63,203,225,.28) !important;
    border-radius:18px !important;
    background:linear-gradient(145deg,#0d2b45,#081f34) !important;
    box-shadow:0 16px 38px rgba(0,0,0,.25) !important;
    overflow:hidden !important;
    color:#f5fbff !important;
    transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease;
}

.ks27-vipx .ks27-vipx__fleet-grid--switchable .ks27-vipx__fleet-card:hover{
    transform:translateY(-2px);
    border-color:rgba(59,220,237,.58) !important;
    box-shadow:0 20px 44px rgba(0,0,0,.30) !important;
}

.ks27-vipx .ks27-vipx__fleet-media{
    background:
      radial-gradient(circle at 50% 42%,rgba(38,200,216,.14),transparent 50%),
      linear-gradient(145deg,#0a2942,#061b2d) !important;
}

.ks27-vipx .ks27-vipx__fleet-media img{
    width:100%;
    height:100%;
    object-fit:contain;
}

.ks27-vipx .ks27-vipx__fleet-body{
    color:#f5fbff !important;
}

.ks27-vipx .ks27-vipx__fleet-body h2,
.ks27-vipx .ks27-vipx__fleet-body h3,
.ks27-vipx .ks27-vipx__fleet-body h4{
    color:#fff !important;
}

.ks27-vipx .ks27-vipx__fleet-body p{
    color:#9fb9c9 !important;
}

.ks27-vipx .ks27-vipx__fleet-meta{
    color:#d9edf5 !important;
}

.ks27-vipx .ks27-vipx__fleet-action{
    background:linear-gradient(135deg,#18c7d6,#3486f7) !important;
    color:#fff !important;
    border:0 !important;
    border-radius:11px !important;
    box-shadow:0 9px 22px rgba(30,154,255,.18) !important;
}

/* =========================
   MASAÜSTÜ — YAN YANA
   ========================= */
.ks27-vipx .ks27-vipx__fleet-grid.ks27-vipx__fleet-grid--switchable[data-view="grid"]{
    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    max-width:none !important;
    margin-inline:0 !important;
}

.ks27-vipx .ks27-vipx__fleet-grid--switchable[data-view="grid"] .ks27-vipx__fleet-card{
    width:100% !important;
    min-height:0 !important;
}

.ks27-vipx .ks27-vipx__fleet-grid--switchable[data-view="grid"] .ks27-vipx__fleet-click{
    display:block !important;
    width:100% !important;
    height:100% !important;
}

.ks27-vipx .ks27-vipx__fleet-grid--switchable[data-view="grid"] .ks27-vipx__fleet-media{
    height:225px !important;
    min-height:225px !important;
    max-height:225px !important;
}

/* =========================
   MASAÜSTÜ — ALT ALTA YATAY
   ========================= */
.ks27-vipx .ks27-vipx__fleet-grid.ks27-vipx__fleet-grid--switchable[data-view="list"]{
    display:grid !important;
    grid-template-columns:1fr !important;
    max-width:1180px !important;
    margin-inline:auto !important;
    gap:14px !important;
}

.ks27-vipx .ks27-vipx__fleet-grid--switchable[data-view="list"] .ks27-vipx__fleet-card{
    display:block !important;
    width:100% !important;
    min-height:210px !important;
}

.ks27-vipx .ks27-vipx__fleet-grid--switchable[data-view="list"] .ks27-vipx__fleet-click{
    display:grid !important;
    grid-template-columns:minmax(250px,31%) minmax(0,1fr) !important;
    width:100% !important;
    min-height:210px !important;
    align-items:stretch !important;
}

.ks27-vipx .ks27-vipx__fleet-grid--switchable[data-view="list"] .ks27-vipx__fleet-media{
    grid-column:1 !important;
    height:100% !important;
    min-height:210px !important;
    max-height:none !important;
}

.ks27-vipx .ks27-vipx__fleet-grid--switchable[data-view="list"] .ks27-vipx__fleet-body{
    grid-column:2 !important;
    display:flex !important;
    flex-direction:column !important;
    justify-content:center !important;
    padding:22px 26px !important;
    min-width:0 !important;
}

.ks27-vipx .ks27-vipx__fleet-grid--switchable[data-view="list"] .ks27-vipx__fleet-body p{
    min-height:0 !important;
    margin-bottom:10px !important;
}

.ks27-vipx .ks27-vipx__fleet-grid--switchable[data-view="list"] .ks27-vipx__fleet-meta{
    margin:10px 0 !important;
}

.ks27-vipx .ks27-vipx__fleet-grid--switchable[data-view="list"] .ks27-vipx__fleet-action{
    width:100% !important;
    max-width:300px !important;
    margin-top:8px !important;
    margin-left:auto !important;
}

.ks27-vipx__fleet-empty{
    padding:32px;
    border:1px dashed rgba(49,217,230,.38);
    border-radius:16px;
    text-align:center;
    background:rgba(255,255,255,.03);
}

.ks27-vipx__fleet-empty strong{
    display:block;
    font-size:18px;
}

.ks27-vipx__fleet-empty span{
    display:block;
    margin-top:6px;
    color:#9eb8c8;
    font-size:13px;
}

/* =========================
   TABLET
   ========================= */
@media (max-width:1050px){
    .ks27-vipx .ks27-vipx__fleet-grid.ks27-vipx__fleet-grid--switchable[data-view="grid"]{
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    }

    .ks27-vipx .ks27-vipx__fleet-grid--switchable[data-view="list"] .ks27-vipx__fleet-click{
        grid-template-columns:minmax(220px,35%) minmax(0,1fr) !important;
    }
}

/* =========================
   MOBİL
   Yan Yana = 2 kompakt kart
   Alt Alta = yatay kart
   ========================= */
@media (max-width:760px){
    .ks27-vipx__fleet{
        padding:42px 0;
    }

    .ks27-vipx__fleet-toolbar{
        align-items:stretch;
        flex-direction:column;
        gap:12px;
        margin-top:16px;
        padding:12px;
    }

    .ks27-vipx__view-switch{
        width:100%;
        display:grid;
        grid-template-columns:1fr 1fr;
    }

    .ks27-vipx__view-switch button{
        width:100%;
        height:42px;
        padding:0 8px;
        font-size:13px;
    }

    /* MOBİL YAN YANA */
    .ks27-vipx .ks27-vipx__fleet-grid.ks27-vipx__fleet-grid--switchable[data-view="grid"]{
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
        gap:10px !important;
    }

    .ks27-vipx .ks27-vipx__fleet-grid--switchable[data-view="grid"] .ks27-vipx__fleet-card{
        border-radius:14px !important;
    }

    .ks27-vipx .ks27-vipx__fleet-grid--switchable[data-view="grid"] .ks27-vipx__fleet-media{
        height:135px !important;
        min-height:135px !important;
        max-height:135px !important;
    }

    .ks27-vipx .ks27-vipx__fleet-grid--switchable[data-view="grid"] .ks27-vipx__fleet-body{
        padding:11px !important;
    }

    .ks27-vipx .ks27-vipx__fleet-grid--switchable[data-view="grid"] .ks27-vipx__fleet-body h3{
        font-size:15px !important;
        line-height:1.15 !important;
    }

    .ks27-vipx .ks27-vipx__fleet-grid--switchable[data-view="grid"] .ks27-vipx__fleet-body p{
        font-size:11px !important;
        line-height:1.35 !important;
    }

    .ks27-vipx .ks27-vipx__fleet-grid--switchable[data-view="grid"] .ks27-vipx__fleet-meta{
        font-size:10px !important;
        gap:5px !important;
    }

    .ks27-vipx .ks27-vipx__fleet-grid--switchable[data-view="grid"] .ks27-vipx__fleet-action{
        min-height:38px !important;
        font-size:12px !important;
    }

    /* MOBİL ALT ALTA — gerçek yatay */
    .ks27-vipx .ks27-vipx__fleet-grid.ks27-vipx__fleet-grid--switchable[data-view="list"]{
        grid-template-columns:1fr !important;
        max-width:none !important;
        gap:12px !important;
    }

    .ks27-vipx .ks27-vipx__fleet-grid--switchable[data-view="list"] .ks27-vipx__fleet-card{
        min-height:150px !important;
        border-radius:15px !important;
    }

    .ks27-vipx .ks27-vipx__fleet-grid--switchable[data-view="list"] .ks27-vipx__fleet-click{
        display:grid !important;
        grid-template-columns:118px minmax(0,1fr) !important;
        min-height:150px !important;
        height:auto !important;
    }

    .ks27-vipx .ks27-vipx__fleet-grid--switchable[data-view="list"] .ks27-vipx__fleet-media{
        grid-column:1 !important;
        grid-row:1 !important;
        height:100% !important;
        min-height:150px !important;
        max-height:none !important;
    }

    .ks27-vipx .ks27-vipx__fleet-grid--switchable[data-view="list"] .ks27-vipx__fleet-body{
        grid-column:2 !important;
        grid-row:1 !important;
        padding:12px 13px !important;
        justify-content:center !important;
    }

    .ks27-vipx .ks27-vipx__fleet-grid--switchable[data-view="list"] .ks27-vipx__fleet-body h3{
        font-size:16px !important;
        line-height:1.15 !important;
        margin-bottom:5px !important;
    }

    .ks27-vipx .ks27-vipx__fleet-grid--switchable[data-view="list"] .ks27-vipx__fleet-body p{
        font-size:11px !important;
        line-height:1.35 !important;
        margin:4px 0 7px !important;
    }

    .ks27-vipx .ks27-vipx__fleet-grid--switchable[data-view="list"] .ks27-vipx__fleet-meta{
        margin:5px 0 !important;
        font-size:10px !important;
        gap:6px !important;
    }

    .ks27-vipx .ks27-vipx__fleet-grid--switchable[data-view="list"] .ks27-vipx__fleet-action{
        width:100% !important;
        max-width:none !important;
        min-height:36px !important;
        margin:6px 0 0 !important;
        font-size:12px !important;
    }
}

/* Küçük telefon */
@media (max-width:480px){
    .ks27-vipx__fleet-toolbar{
        border-radius:13px;
    }

    .ks27-vipx .ks27-vipx__fleet-grid.ks27-vipx__fleet-grid--switchable[data-view="grid"]{
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
        gap:8px !important;
    }

    .ks27-vipx .ks27-vipx__fleet-grid--switchable[data-view="grid"] .ks27-vipx__fleet-media{
        height:112px !important;
        min-height:112px !important;
        max-height:112px !important;
    }

    .ks27-vipx .ks27-vipx__fleet-grid--switchable[data-view="grid"] .ks27-vipx__fleet-body{
        padding:9px !important;
    }

    .ks27-vipx .ks27-vipx__fleet-grid--switchable[data-view="grid"] .ks27-vipx__fleet-body h3{
        font-size:13px !important;
    }

    .ks27-vipx .ks27-vipx__fleet-grid--switchable[data-view="list"] .ks27-vipx__fleet-click{
        grid-template-columns:102px minmax(0,1fr) !important;
        min-height:140px !important;
    }

    .ks27-vipx .ks27-vipx__fleet-grid--switchable[data-view="list"] .ks27-vipx__fleet-media{
        min-height:140px !important;
    }

    .ks27-vipx .ks27-vipx__fleet-grid--switchable[data-view="list"] .ks27-vipx__fleet-body{
        padding:10px !important;
    }

    .ks27-vipx .ks27-vipx__fleet-grid--switchable[data-view="list"] .ks27-vipx__fleet-body h3{
        font-size:14px !important;
    }
}

/* =========================================================
   MOBİL FINAL — TEK KART + GERÇEK YATAY ALT ALTA
   Masaüstü/tablet ve renk sistemi değiştirilmez.
   ========================================================= */
@media (max-width:760px){
    .ks27-vipx .ks27-vipx__fleet-grid.ks27-vipx__fleet-grid--switchable[data-view="grid"]{
        display:grid !important;
        grid-template-columns:minmax(0,1fr) !important;
        gap:14px !important;
        width:100% !important;
    }
    .ks27-vipx .ks27-vipx__fleet-grid--switchable[data-view="grid"] .ks27-vipx__fleet-media{
        height:205px !important; min-height:205px !important; max-height:205px !important;
    }
    .ks27-vipx .ks27-vipx__fleet-grid--switchable[data-view="grid"] .ks27-vipx__fleet-body{padding:14px !important;}
    .ks27-vipx .ks27-vipx__fleet-grid--switchable[data-view="grid"] .ks27-vipx__fleet-body h3{font-size:18px !important;}
    .ks27-vipx .ks27-vipx__fleet-grid--switchable[data-view="grid"] .ks27-vipx__fleet-body p{font-size:12px !important;}

    .ks27-vipx .ks27-vipx__fleet-grid.ks27-vipx__fleet-grid--switchable[data-view="list"]{
        display:grid !important; grid-template-columns:minmax(0,1fr) !important; gap:12px !important; width:100% !important; max-width:none !important;
    }
    .ks27-vipx .ks27-vipx__fleet-grid--switchable[data-view="list"] .ks27-vipx__fleet-card{
        width:100% !important; min-height:172px !important; border-radius:15px !important;
    }
    .ks27-vipx .ks27-vipx__fleet-grid--switchable[data-view="list"] .ks27-vipx__fleet-click{
        display:grid !important; grid-template-columns:34% minmax(0,66%) !important; width:100% !important; min-height:172px !important; height:auto !important; align-items:stretch !important;
    }
    .ks27-vipx .ks27-vipx__fleet-grid--switchable[data-view="list"] .ks27-vipx__fleet-media{
        grid-column:1 !important; grid-row:1 !important; width:100% !important; height:100% !important; min-height:172px !important; max-height:none !important;
    }
    .ks27-vipx .ks27-vipx__fleet-grid--switchable[data-view="list"] .ks27-vipx__fleet-body{
        grid-column:2 !important; grid-row:1 !important; display:flex !important; flex-direction:column !important; justify-content:center !important; min-width:0 !important; padding:11px 12px !important;
    }
    .ks27-vipx .ks27-vipx__fleet-grid--switchable[data-view="list"] .ks27-vipx__fleet-body h3{font-size:15px !important; line-height:1.18 !important; margin:4px 0 !important;}
    .ks27-vipx .ks27-vipx__fleet-grid--switchable[data-view="list"] .ks27-vipx__fleet-body p{
        display:-webkit-box !important; -webkit-line-clamp:2 !important; -webkit-box-orient:vertical !important; overflow:hidden !important; font-size:10px !important; line-height:1.35 !important; margin:3px 0 6px !important;
    }
    .ks27-vipx .ks27-vipx__fleet-grid--switchable[data-view="list"] .ks27-vipx__fleet-meta{margin:4px 0 !important; font-size:9px !important; gap:4px !important;}
    .ks27-vipx .ks27-vipx__fleet-grid--switchable[data-view="list"] .ks27-vipx__fleet-action{width:100% !important; max-width:none !important; min-height:34px !important; margin:5px 0 0 !important; font-size:10px !important;}
}
@media (max-width:420px){
    .ks27-vipx .ks27-vipx__fleet-grid--switchable[data-view="grid"] .ks27-vipx__fleet-media{height:185px !important; min-height:185px !important; max-height:185px !important;}
    .ks27-vipx .ks27-vipx__fleet-grid--switchable[data-view="list"] .ks27-vipx__fleet-click{grid-template-columns:112px minmax(0,1fr) !important;}
}

