/* ================================================
   responsive.css — Go Transfer Services
   Breakpoints:
     - 1200px : Büyük tablet / küçük laptop
     - 992px  : Tablet
     - 768px  : Geniş mobil / küçük tablet
     - 576px  : Standart mobil
     - 400px  : Küçük mobil (iPhone SE vb.)
================================================ */


/* ------------------------------------------------
   1. HEADER
------------------------------------------------ */

@media (max-width: 992px) {

    .header-contact .separator,
    .header-contact a:last-of-type {
        display: none; /* İkinci numarayı gizle, tek numara kalsın */
    }

    .header-actions {
        gap: 15px;
    }
}

@media (max-width: 768px) {

    .main-header {
        padding: 10px 0;
    }

    .header-wrapper {
        flex-wrap: wrap;
        gap: 10px;
        justify-content: space-between;
    }

    .header-logo img {
        height: 45px;
    }

    .header-actions {
        gap: 12px;
        flex-wrap: wrap;
    }

    .header-contact {
        font-size: 12px;
        gap: 6px;
    }

    .auth-trigger-btn {
        padding: 6px 12px;
        font-size: 12px;
    }

    .lang-current span:not(.chevron-icon) {
        display: none; /* Dil yazısını gizle, sadece bayrak kalsın */
    }
}

@media (max-width: 576px) {

    .header-contact {
        display: none; /* Telefon numaralarını küçük mobilde gizle */
    }

    .header-actions {
        gap: 10px;
    }

    .header-logo img {
        height: 38px;
    }
}


/* ------------------------------------------------
   2. HERO & BOOKING SECTION
------------------------------------------------ */

/* 992px ve Altı (Tablet & Mobil) İçin Kesin Çözüm */
@media (max-width: 992px) {
    
    /* 1. Hero alanını (Görseli) formdan ayırıyoruz */
    .hero {
        height: auto !important;
        min-height: 250px !important; /* Görselin yüksekliği */
        padding: 40px 0 !important;
        position: relative !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    .hero__container {
        position: relative !important;
        transform: none !important;
        padding: 0 20px !important;
        text-align: center !important;
    }

    .hero__title-animate {
        font-size: 28px !important;
        margin-bottom: 0 !important;
    }

    /* 2. Formu Akışa Dahil Ediyoruz (Görsel Bittikten Sonra Gelir) */
    .booking-section {
        position: relative !important; /* Havada asılı kalmayı durdurur */
        top: 0 !important;
        bottom: 0 !important;
        left: 0 !important;
        transform: none !important;
        width: 100% !important;
        margin: 0 !important; /* Üstteki görselle bitişik başlar */
        padding: 40px 15px !important; /* Alt ve üstten temiz boşluk */
        background-color: #f8f9fb !important; /* Formun olduğu alanı ayırmak için hafif gri */
    }

    .modern-search-bar {
        flex-direction: column !important;
        gap: 15px !important;
        width: 100% !important;
        background: #ffffff !important;
        padding: 25px !important;
        border-radius: 15px !important;
        box-shadow: 0 10px 30px rgba(0,0,0,0.08) !important;
    }

    /* 3. Partnerler Alanı (Otomatik Olarak Formun Altına Düşer) */
    .partners-section {
        padding: 40px 0 !important;
        background-color: #ffffff !important;
        margin-top: 0 !important;
    }

    /* Gereksiz Mobilde Kirlilik Yapan Elemanları Gizle */
    .route-divider {
        display: none !important;
    }

    .search-group, .mid-group, .action-group {
        width: 100% !important;
        flex: none !important;
    }
}

/* Küçük Telefonlar İçin Yazı Ayarı */
@media (max-width: 576px) {
    .hero__title-animate {
        font-size: 22px !important;
    }
    
    .booking-section {
        padding: 30px 10px !important;
    }
}

/* ------------------------------------------------
   3. PARTNER SLIDER
------------------------------------------------ */

@media (max-width: 768px) {

    .partner-slider-section {
        flex-direction: column;
        gap: 20px;
        padding: 25px 20px;
        margin-top: 30px; /* booking-section artık negatif değil, fazla margin gerekmez */
    }

    .slider-title {
        font-size: 18px;
        white-space: normal;
        text-align: center;
    }

    .slider-wrapper {
        width: 100%;
    }
}

@media (max-width: 576px) {

    .partner-slider-section {
        margin-top: 30px;
    }
}


/* ------------------------------------------------
   4. FİLO (ARAÇ SLIDER)
------------------------------------------------ */

@media (max-width: 992px) {

    .fleet {
        padding: 60px 0;
    }

    .fleet__title {
        font-size: 28px;
    }

    .fleet-decoration {
        display: none; /* Dekoratif arka plan gizlenir */
    }
}

@media (max-width: 768px) {

    .fleet {
        padding: 40px 0;
    }

    .fleet__title {
        font-size: 24px;
        text-align: center;
    }

    .vehicle-card__image img {
        height: 200px;
    }

    .vehicle-card__features {
        flex-wrap: wrap;
        gap: 10px;
    }
}


/* ------------------------------------------------
   5. HİZMETLER (SWIPER KARTI)
------------------------------------------------ */

@media (max-width: 992px) {

    .hizmet-modern {
        padding: 60px 0;
    }

    .hizmet-header h2,
    .hizmet-title-box h2 {
        font-size: 32px;
    }

    .hizmet-swiper .swiper-slide {
        height: 380px;
    }
}

@media (max-width: 768px) {

    .hizmet-header h2,
    .hizmet-title-box h2 {
        font-size: 26px;
    }

    .hizmet-swiper .swiper-slide {
        height: 320px;
    }

    .modern-nav {
        margin-top: 30px;
    }

    .nav-arrow {
        width: 44px;
        height: 44px;
    }
}


/* ------------------------------------------------
   6. POPULAR TOURS / ARA SEPERATör
------------------------------------------------ */

@media (max-width: 768px) {

    .popular-tours {
        padding: 40px 20px;
    }

    .tours-title {
        font-size: 28px;
        letter-spacing: 0;
    }
}

@media (max-width: 576px) {

    .tours-title {
        font-size: 22px;
    }
}


/* ------------------------------------------------
   7. TUR KARTLARI
------------------------------------------------ */

@media (max-width: 992px) {

    .tours-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
    }

    .tours-grid-section {
        padding: 40px 0;
    }
}

@media (max-width: 576px) {

    .tours-grid {
        grid-template-columns: 1fr;
    }
}


/* ------------------------------------------------
   8. ÖZELLİKLER (FEATURES)
------------------------------------------------ */

@media (max-width: 992px) {

    .features-section {
        padding: 60px 0;
    }

    .features-header h2 {
        font-size: 28px;
        margin-bottom: 40px;
    }

    .features-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 30px;
    }
}

@media (max-width: 576px) {

    .features-grid {
        grid-template-columns: 1fr;
        gap: 25px;
    }

    .features-header h2 {
        font-size: 24px;
    }
}


/* ------------------------------------------------
   9. ÖNE ÇIKAN HİZMET (Tekne / Featured Service)
------------------------------------------------ */

@media (max-width: 992px) {

    .featured-service {
        padding: 60px 0;
    }

    .featured-service__wrapper {
        flex-direction: column;
        gap: 30px;
    }

    .featured-service__content h2 {
        font-size: 30px;
    }

    .image-decoration {
        display: none;
    }
}

@media (max-width: 768px) {

    .featured-service__content h2 {
        font-size: 26px;
    }

    .featured-service__content p {
        font-size: 15px;
    }
}


/* ------------------------------------------------
   10. DESTİNASYONLAR
------------------------------------------------ */

@media (max-width: 992px) {

    .destinations-section {
        padding: 60px 0;
    }

    .destinations-wrapper {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .destinations-content {
        padding-left: 0;
        text-align: center;
    }

    .destinations-content h2 {
        font-size: 30px;
    }

    .gallery-item.large {
        height: 350px;
    }
}

@media (max-width: 576px) {

    .destinations-content h2 {
        font-size: 24px;
    }

    .gallery-item.large {
        height: 250px;
    }

    .gallery-item.small {
        height: 120px;
    }
}


/* ------------------------------------------------
   11. TRANSFER LİNKLERİ
------------------------------------------------ */

@media (max-width: 992px) {

    .transfer-main-card {
        flex-direction: column;
    }

    .transfer-image-box {
        flex: none;
        width: 100%;
        height: 280px;
    }

    .transfer-content-box {
        flex: none;
        width: 100%;
        margin-left: 0;
        margin-top: -30px;
        min-height: auto;
    }
}

@media (max-width: 576px) {

    .transfer-image-box {
        height: 200px;
        border-radius: 15px;
    }

    .transfer-content-box {
        padding: 25px 20px;
    }

    .transfer-title {
        font-size: 15px;
    }

    .loc-from,
    .loc-to {
        font-size: 13px;
    }
}


/* ------------------------------------------------
   12. SIKÇA SORULAN SORULAR (FAQ / ACCORDION)
------------------------------------------------ */

@media (max-width: 768px) {

    .faq-section {
        padding: 60px 0;
    }

    .faq-title {
        font-size: 28px;
        margin-bottom: 40px;
    }

    .accordion-header span {
        font-size: 16px;
        padding-right: 15px;
    }

    .accordion-header {
        padding: 20px 0;
    }

    .accordion-content p {
        font-size: 14px;
        max-width: 100%;
    }

    .icon-box {
        width: 30px;
        height: 30px;
        flex-shrink: 0;
    }
}

@media (max-width: 576px) {

    .faq-title {
        font-size: 22px;
    }
}


/* ------------------------------------------------
   13. FOOTER
------------------------------------------------ */

@media (max-width: 992px) {

    .main-footer-modern {
        padding: 40px 0 25px;
    }

    .footer-content-wrapper {
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 30px;
    }

    .address-box {
        text-align: center;
    }

    .address-box address {
        margin: 0 auto;
    }

    .tursab-box img {
        max-width: 200px;
        margin: 0 auto;
    }

    .f-logo {
        width: 180px;
    }
}

@media (max-width: 576px) {

    .main-footer-modern {
        padding: 30px 0 20px;
    }

    .f-logo {
        width: 150px;
        margin-bottom: 15px;
    }

    .c-item {
        font-size: 14px;
    }

    .address-box h4 {
        font-size: 15px;
    }

    .address-box address {
        font-size: 13px;
    }

    .copyright {
        font-size: 12px;
    }
}


/* ------------------------------------------------
   14. AUTH MODAL
------------------------------------------------ */

@media (max-width: 576px) {

    .auth-modal-card {
        width: 95%;
        padding: 20px;
        border-radius: 12px;
    }

    .auth-tab-btn {
        font-size: 13px;
        padding: 10px;
    }

    .auth-main-btn {
        font-size: 14px;
        padding: 12px;
    }

    .auth-field input {
        padding: 10px;
        font-size: 14px;
    }
}


/* ------------------------------------------------
   15. ÇEREZ ÇUBUĞU
------------------------------------------------ */

@media (max-width: 768px) {

    .cookie-bar__wrapper {
        flex-direction: column;
        gap: 12px;
        text-align: center;
        font-size: 13px;
    }

    .btn-cookie {
        padding: 8px 20px;
        font-size: 13px;
    }
}


/* ------------------------------------------------
   16. GENEL YARDIMCI DÜZELTMELER
------------------------------------------------ */

/* Tüm section başlıklarını mobilede ölçeklendir */
@media (max-width: 576px) {

    h1 { font-size: clamp(22px, 6vw, 36px); }
    h2 { font-size: clamp(20px, 5vw, 30px); }
    h3 { font-size: clamp(16px, 4vw, 22px); }

    .container {
        padding: 0 15px;
    }
}

/* Google Places öneri kutusu mobilede tam genişlik */
@media (max-width: 768px) {

    .pac-container {
        width: 90vw !important;
    }
}