/* ==========================================================================
   AYFER TRAVEL — VIP TRANSFER · responsive.css
   Tüm @media kuralları. css/style.css'ten SONRA yüklenir (inc/css.php).

   Sıra: max-width (genişten dara) -> min-width (dardan genişe) ->
   aralıklar -> özellik sorguları (hover, prefers-reduced-motion).
   Bootstrap kırılımları: 575.98 / 767.98 / 991.98 / 1199.98px
   ========================================================================== */

@media (max-width: 991.98px) {
    .header-logo-img {
        width: 110px;
    }

    .topbar-side-desktop {
        display: none !important;
    }

    .bl-search-form {
        flex-direction: column;
        align-items: stretch;
        gap: 14px;
    }

    .bl-swap,
    .bl-divider {
        display: none;
    }

    .bl-field-pax {
        flex: 1 1 auto;
    }

    .bl-submit-wrap {
        align-self: stretch;
        margin-top: 8px;
        margin-bottom: 0;
    }

    .bl-submit-btn {
        width: 100%;
        height: 50px;
        font-size: 0.95rem;
    }

    .bl-search-panel {
        margin: 0 12px;
        width: auto;
        padding: 22px 16px 18px;
        border-radius: 12px;
    }

    /* Boş detay satırı yer kaplamasın; doluysa tek satır kalsın */
    .bl-field-detail {
        min-height: 0;
        margin-top: 3px;
    }

    .bl-field-detail:empty {
        display: none;
    }

    .bl-field-label {
        margin-bottom: 2px;
    }

    .bl-field-input,
    .bl-field-value {
        padding: 5px 2px 9px;
    }

    .bl-hero.bl-expanded .bl-panel-hint {
        max-height: 0;
        opacity: 0;
        margin: 0 auto;
    }

    .bl-hero-title {
        font-size: 2rem;
    }

    .bl-search-panel .custom-suggestions {
        min-width: 0;
    }

    .bl-search-panel .pax-popup {
        left: 0;
        transform: none;
    }

    .faq-tab {
        width: auto;
        margin-right: 0;
        padding: 10px 16px;
        border: 1px solid var(--ayfer-border);
        border-bottom: 1px solid var(--ayfer-border);
        border-radius: 999px;
        background: var(--ayfer-surface);
        white-space: nowrap;
        font-size: 0.85rem;
    }

    .zone-tile-go {
        display: none;
    }

    .gal-cell-lg {
        grid-column: span 2;
        grid-row: span 1;
    }

    /* Mobil / tablet header */
    .ay-navbar {
        padding-top: 10px;
        padding-bottom: 10px;
    }

    .ay-navbar > .container {
        flex-wrap: wrap;
    }

    .ay-brand {
        margin-right: auto;
    }

    .ay-brand .header-logo-img {
        height: 36px;
    }

    .ay-lang-btn-mobile {
        height: 36px;
        padding: 0 10px !important;
    }

    .ay-toggler {
        width: 40px;
        height: 40px;
        padding: 0;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 10px !important;
        border: 1px solid var(--ayfer-border) !important;
    }

    .ay-toggler .navbar-toggler-icon {
        width: 1.2em;
        height: 1.2em;
    }

    .ay-navbar .navbar-collapse {
        width: 100%;
    }

    .ay-nav {
        align-items: stretch !important;
        gap: 0 !important;
        margin-top: 14px !important;
        padding-top: 6px;
        border-top: 1px solid var(--ayfer-border);
    }

    .ay-nav .nav-item {
        border-bottom: 1px solid var(--ayfer-border);
    }

    .ay-nav .ay-nav-link {
        padding: 14px 2px !important;
        font-size: 1rem;
    }

    .ay-nav .ay-nav-link::after {
        display: none;
    }

    /* Anasayfa mobil: header hero ile aynı koyu lacivert, üstte sabit */
    body.home-blacklane #siteHeader {
        position: sticky;
        top: 0;
    }

    body.home-blacklane .ay-navbar {
        background: rgba(var(--ayfer-deep-navy-rgb), 0.96) !important;
        -webkit-backdrop-filter: blur(14px);
        backdrop-filter: blur(14px);
        border-bottom-color: rgba(255, 255, 255, 0.08);
        box-shadow: none !important;
    }

    body.home-blacklane .navbar-brand .header-logo-img:not(.ay-logo-invert) {
        filter: none;
    }

    body.home-blacklane .ay-logo-color {
        display: none;
    }

    body.home-blacklane .ay-logo-light {
        display: block;
    }

    body.home-blacklane .ay-lang-btn {
        background: rgba(255, 255, 255, 0.06) !important;
        border-color: rgba(255, 255, 255, 0.2) !important;
        color: #fff !important;
    }

    body.home-blacklane .ay-lang-btn .text-muted {
        color: rgba(255, 255, 255, 0.65) !important;
    }

    body.home-blacklane .ay-toggler {
        border-color: rgba(255, 255, 255, 0.2) !important;
    }

    body.home-blacklane .ay-toggler .navbar-toggler-icon {
        filter: invert(1) brightness(2);
    }

    body.home-blacklane .ay-nav {
        border-top-color: rgba(255, 255, 255, 0.1);
    }

    body.home-blacklane .ay-nav .nav-item {
        border-bottom-color: rgba(255, 255, 255, 0.08);
    }

    body.home-blacklane .ay-nav .ay-nav-link {
        color: rgba(255, 255, 255, 0.88) !important;
    }

    body.home-blacklane #header-user-section {
        margin-top: 8px !important;
    }

    /* Mobil hero: alanlar alt alta */
    /* main.js hero'ya inline yükseklik verir; mobilde içerik belirlesin */
    .bl-hero.hero-wrapper {
        height: auto !important;
        min-height: 0;
    }

    .bl-hero .hero-overlay {
        position: relative;
        height: auto;
        padding: 56px 0 36px;
        justify-content: flex-start;
    }

    .bl-hero .bl-hero-copy {
        padding: 0 20px;
    }

    .ay-hero-eyebrow {
        font-size: 0.64rem;
        letter-spacing: 0.28em;
        margin-bottom: 14px;
    }

    .ay-hero-eyebrow::before,
    .ay-hero-eyebrow::after {
        width: 24px;
    }

    .bl-hero .bl-hero-title {
        font-size: clamp(1.75rem, 6.4vw, 2.4rem);
        margin-bottom: 26px;
        padding: 0;
    }

    .bl-hero .bl-search-panel {
        margin: 0 16px;
        width: auto;
        padding: 8px;
        border-radius: 18px;
    }

    .bl-hero.bl-expanded .bl-search-panel {
        padding-bottom: 8px;
    }

    .bl-hero .bl-search-form {
        gap: 6px;
    }

    .bl-hero .bl-field {
        padding: 12px 14px 10px;
        background: rgba(255, 255, 255, 0.04);
        border: 1px solid rgba(255, 255, 255, 0.06);
        border-radius: 12px;
    }

    .bl-hero .bl-field-pax {
        flex: 1 1 auto;
    }

    .bl-hero .bl-submit-wrap {
        margin: 6px 0 0;
    }

    .bl-hero .bl-submit-btn {
        width: 100%;
        min-height: 56px;
        border-radius: 12px;
    }

    .bl-hero .bl-search-panel .custom-suggestions {
        left: -1px;
        right: -1px;
        width: auto;
    }

    .social-strip {
        padding: 36px 0;
    }

    .social-strip-inner {
        flex-direction: column;
        align-items: stretch;
    }

    .social-strip-links {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    }

    .social-chip {
        width: 100%;
    }

    .social-chip-ext {
        margin-left: auto;
    }

    /* Tablet: 2 sütun, tek kalan kart tam genişlik */
    .zone-grid {
        gap: 14px;
    }

    .zone-grid > .zone-tile,
    .zone-grid[class*="zone-grid--n"] > .zone-tile {
        grid-column: span 6;
        aspect-ratio: 4 / 5;
    }

    .zone-grid > .zone-tile:nth-child(odd):last-child {
        grid-column: span 12;
        aspect-ratio: 16 / 9;
    }

    .zone-tile-name {
        font-size: 1.1rem;
    }

    .faq-tabs {
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        margin: 24px -16px 0;
        padding: 2px 16px 4px;
    }

    .faq-tabs::-webkit-scrollbar {
        display: none;
    }

    .faq-tabs .nav-item {
        flex: 0 0 auto;
    }

    .faq-tab.active {
        background: var(--ayfer-navy);
        border-color: var(--ayfer-navy);
        border-bottom-color: var(--ayfer-navy);
        color: #fff;
        box-shadow: none;
    }
}

@media (max-width: 767.98px) {
    /* ============ MOBILE FIXES ============ */
    /* Hero Banner Mobile Fix (Homepage Title) */
    .hero-title {
        font-size: 2rem !important;
        margin-top: 10px !important;
    }

    .hero-overlay {
        padding-top: 60px !important;
        padding-bottom: 30px !important;
    }

    .pax-popup {
        width: 240px;
    }

    .gal-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-auto-rows: 140px;
        gap: 10px;
    }

    .gal-grid .gal-cell,
    .gal-grid .gal-cell:nth-child(2),
    .gal-grid .gal-cell:nth-child(3),
    .gal-grid[class*="gal-grid--n"] .gal-cell {
        grid-column: span 1;
        grid-row: span 1;
        border-radius: 12px;
    }

    .gal-grid .gal-cell-lg,
    .gal-grid[class*="gal-grid--n"] .gal-cell-lg {
        grid-column: span 2;
        grid-row: span 2;
    }

    /* Çift sayıda görselde (büyük hariç tek kalan) son hücre tam genişlik */
    .gal-grid--n2 .gal-cell:last-child,
    .gal-grid--n4 .gal-cell:last-child,
    .gal-grid--n6 .gal-cell:last-child {
        grid-column: span 2;
    }

    .gal-cell-icon {
        width: 40px;
        height: 40px;
        font-size: 0.8rem;
    }

    .ay-concierge {
        padding: 24px 20px;
        border-radius: 18px;
    }

    .ay-concierge-actions,
    .ay-concierge-actions .ay-btn {
        width: 100%;
    }

    .ay-concierge-actions .ay-btn {
        flex: 1 1 100%;
    }

    .ay-footer .ay-footer-logo {
        height: 46px;
    }
}

@media (max-width: 575.98px) {
    .footer-policy-row {
        gap: 8px 18px;
    }

    .footer-policy-row li + li::before {
        left: -10px;
    }

    .bl-hero .hero-overlay {
        padding-top: 44px;
        padding-bottom: 28px;
    }

    .bl-hero .bl-search-panel {
        margin: 0 12px;
    }

    .zone-grid {
        gap: 10px;
    }

    .zone-grid > .zone-tile,
    .zone-grid[class*="zone-grid--n"] > .zone-tile {
        aspect-ratio: 3 / 4;
        border-radius: 14px;
    }

    .zone-grid > .zone-tile:nth-child(odd):last-child {
        aspect-ratio: 16 / 10;
    }

    .zone-tile-body {
        padding: 14px;
        gap: 8px;
    }

    .zone-tile-idx {
        top: 12px;
        left: 14px;
        font-size: 0.66rem;
    }

    .zone-tile-kind {
        width: 26px;
        height: 26px;
        font-size: 0.64rem;
    }

    .zone-tile-name {
        font-size: 0.95rem;
    }

    .zone-tile-go {
        display: flex;
        width: 32px;
        height: 32px;
        font-size: 0.7rem;
    }

    .faq-acc .faq-q {
        padding: 16px 14px 16px 16px;
        font-size: 0.95rem;
    }

    .faq-acc .faq-a {
        padding: 0 16px 18px;
    }
}

@media (max-width: 380px) {
    .ay-brand .header-logo-img {
        height: 30px;
    }

    .ay-lang-btn-mobile {
        padding: 0 8px !important;
    }
}

@media (max-width: 340px) {
    .social-strip-links {
        grid-template-columns: 1fr;
    }
}

@media (min-width: 992px) {
    /* ============================================================
   BLACKLANE TARZI HERO + HEADER (Anasayfa)
   ============================================================ */
    /* --- Header: hero üzerine binen şeffaf navbar (yalnızca desktop) --- */
    body.home-blacklane #siteHeader {
        z-index: 1050;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
    }

    body.home-blacklane .navbar {
        background: transparent !important;
        box-shadow: none !important;
    }

    /* Logo koyu renkli olduğu için hero üzerinde beyaza çevrilir */
    body.home-blacklane .navbar-brand .header-logo-img {
        filter: brightness(0) invert(1);
    }

    /* Nav linkleri: Blacklane gibi sağa yaslı, beyaz */
    body.home-blacklane .navbar-nav {
        margin-left: auto !important;
        margin-right: 1.5rem !important;
    }

    body.home-blacklane .navbar .nav-link {
        color: #ffffff !important;
        opacity: 0.85;
    }

    body.home-blacklane .navbar .nav-link:hover {
        opacity: 1;
    }

    /* Dil / para birimi butonu: şeffaf ghost stil */
    body.home-blacklane .navbar [data-bs-target="#langModal"] {
        background: transparent !important;
        border: 1px solid rgba(255, 255, 255, 0.35) !important;
        color: #ffffff !important;
    }

    body.home-blacklane .navbar [data-bs-target="#langModal"] .text-muted {
        color: rgba(255, 255, 255, 0.7) !important;
    }

    /* Giriş Yap: Blacklane'in "Sign in" pill butonu gibi */
    body.home-blacklane .navbar [data-bs-target="#authModal"] {
        background: transparent !important;
        border: 1px solid rgba(255, 255, 255, 0.6) !important;
        border-radius: 999px !important;
        color: #ffffff !important;
    }

    body.home-blacklane .navbar [data-bs-target="#authModal"]:hover {
        background: rgba(255, 255, 255, 0.12) !important;
    }

    /* --- SSS: solda sabit başlık + kategoriler, sağda sorular --- */
    .faq-aside {
        position: sticky;
        top: 110px;
    }

    .faq-tabs {
        flex-direction: column;
    }

    .custom-suggestions {
        min-width: 400px;
        margin-left: -50px;
    }

    body.home-blacklane .ay-navbar {
        background: transparent !important;
        border-bottom-color: transparent;
        padding-top: 24px;
        padding-bottom: 24px;
    }

    body.home-blacklane .ay-header.is-scrolled .ay-navbar {
        background: rgba(var(--ayfer-deep-navy-rgb), 0.78) !important;
        -webkit-backdrop-filter: blur(16px) saturate(140%);
        backdrop-filter: blur(16px) saturate(140%);
        border-bottom-color: rgba(255, 255, 255, 0.08);
        box-shadow: 0 16px 40px -24px rgba(0, 0, 0, 0.6) !important;
        padding-top: 12px;
        padding-bottom: 12px;
    }

    body.home-blacklane .ay-header.is-scrolled .ay-brand .header-logo-img {
        height: 44px;
    }

    /* style.css'teki eski "logoyu beyaza çevir" filtresi iptal: beyaz varyant kullanılıyor */
    body.home-blacklane .navbar-brand .header-logo-img:not(.ay-logo-invert) {
        filter: none;
    }

    body.home-blacklane .ay-logo-color {
        display: none;
    }

    body.home-blacklane .ay-logo-light {
        display: block;
    }

    body.home-blacklane .ay-nav .ay-nav-link {
        color: rgba(255, 255, 255, 0.82) !important;
    }

    body.home-blacklane .ay-nav .ay-nav-link:hover {
        color: #fff !important;
    }

    body.home-blacklane .ay-nav .ay-nav-link::after {
        background: var(--ayfer-primary-light);
    }

    body.home-blacklane .navbar .ay-lang-btn {
        background: rgba(255, 255, 255, 0.06) !important;
        border: 1px solid rgba(255, 255, 255, 0.22) !important;
        color: #fff !important;
        -webkit-backdrop-filter: blur(8px);
        backdrop-filter: blur(8px);
    }

    body.home-blacklane .navbar .ay-lang-btn:hover {
        background: rgba(255, 255, 255, 0.14) !important;
        border-color: rgba(255, 255, 255, 0.45) !important;
    }

    body.home-blacklane .navbar .ay-lang-btn .text-muted {
        color: rgba(255, 255, 255, 0.7) !important;
    }

    .faq-tab.active::before {
        content: "";
        position: absolute;
        left: -1px;
        top: 12px;
        bottom: 12px;
        width: 3px;
        border-radius: 0 3px 3px 0;
        background: var(--ayfer-primary);
    }
}

@media (min-width: 992px) and (max-width: 1199.98px) {
    /* Tablet: alanlar 2 satıra iner */
    .bl-hero .bl-field {
        padding-left: 16px;
        padding-right: 16px;
    }

    .bl-hero .bl-field-pax {
        flex-basis: 170px;
    }

    .bl-hero .bl-submit-btn {
        padding: 0 24px;
    }
}

@media (hover: hover) {
    .bl-field-pax:hover .bl-field-value {
        border-bottom-color: var(--primary-color);
        box-shadow: 0 1px 0 var(--primary-color);
    }

    .bl-hero .bl-field:hover {
        background: rgba(255, 255, 255, 0.05);
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }

    .ay-js .ay-reveal {
        opacity: 1;
        transform: none;
    }

    .bl-hero .hero-slide,
    .bl-hero .hero-slide.active {
        transform: none;
    }
}