/* ============================================
   Responsive styles
   ============================================ */

/* Wide desktop — hero finder card biraz daha büyük */
@media (min-width: 1500px) {
    .hero-mega { padding: 90px 0 80px; }
}

/* Standard desktop alt sınırı — laptop / 1366px */
@media (max-width: 1366px) {
    .hero-mega-inner { gap: 40px; }
}

/* Tablet ve altı — sidebar / catalog single column */
@media (max-width: 1024px) {
    .hero-mega-inner {
        grid-template-columns: 1fr;
        gap: 30px;
        max-width: 720px;
        margin: 0 auto;
    }
    .hero-intro { text-align: center; }
    .hero-sub { margin-left: auto; margin-right: auto; }
    .hero-features-bottom { justify-content: center; }
    .hero h1 br { display: none; }

    .category-grid { grid-template-columns: repeat(3, 1fr); }
    .product-grid { grid-template-columns: repeat(3, 1fr); }
    .trust-grid { grid-template-columns: repeat(2, 1fr); }
    .brand-grid { grid-template-columns: repeat(4, 1fr); }
    .footer-grid { grid-template-columns: repeat(2, 1fr); }
    .vehicle-type-grid { grid-template-columns: 1fr; }
    .brand-logo-grid { grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); }
    .catalog-grid { grid-template-columns: 1fr; }
    .filters { position: static; }
    .cart-grid { grid-template-columns: 1fr; }
    .contact-grid { grid-template-columns: 1fr; }

    .product-detail-grid { grid-template-columns: 1fr; }
}

/* Mobile (≤768px) */
/* Tablet + Mobil header — 2 satır temiz layout (≤1024px) */
@media (max-width: 1024px) {
    /* Header satır 1: hamburger | logo (ortada/sol) | telefon + sepet (sağda)
       Header satır 2: arama çubuğu tam genişlik */
    .header-inner {
        display: flex !important;
        flex-wrap: wrap;
        gap: 8px;
        padding: 10px 0;
        align-items: center;
    }
    /* Hamburger en solda */
    .mobile-toggle {
        order: 1;
        display: inline-flex !important;
        flex-direction: column;
        gap: 4px;
        padding: 0;
        background: var(--color-bg-soft);
        border-radius: 10px;
        cursor: pointer;
        width: 42px;
        height: 42px;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        border: none;
    }
    .mobile-toggle span {
        width: 20px;
        height: 2px;
        background: var(--color-text);
        border-radius: 2px;
    }
    /* Logo - hamburger ile sepet/tel arasında */
    .logo { order: 2; flex: 1 1 auto; min-width: 0; font-size: 15px; gap: 6px; overflow: hidden; }
    .logo-text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: 1.15; min-width: 0; }
    .logo-text small { display: none; }
    .logo-mark { min-width: 50px; height: 34px; padding: 0 9px; font-size: 13px; letter-spacing: 0.18em; text-indent: 0.18em; flex-shrink: 0; }
    .logo-mark::after { bottom: 5px; width: 14px; }

    /* AI/WA hızlı butonları mobilde gizle (hamburger menude değil — başka yerde) */
    .header-quick { display: none !important; }

    /* Sağ aksiyonlar: telefon ikonu + sepet (giriş/bayi hamburger menude) */
    .header-actions {
        order: 3;
        gap: 6px;
        margin: 0 0 0 4px !important;
        display: inline-flex;
        align-items: center;
        flex-shrink: 0;
    }
    .header-actions .header-auth-slot { display: none; }
    .header-actions .header-tel {
        display: inline-flex !important;
        padding: 0;
        width: 42px;
        height: 42px;
        background: var(--color-bg-soft);
        border-radius: 10px;
        align-items: center;
        justify-content: center;
    }
    .header-actions .header-tel-label { display: none; }
    .header-actions .cart-link {
        padding: 0;
        width: 42px;
        height: 42px;
        background: var(--color-bg-soft);
        border-radius: 10px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        position: relative;
    }
    .header-actions .cart-link span:not(.cart-count) { display: none; }
    .header-actions .cart-link .cart-count {
        position: absolute;
        top: -4px;
        right: -4px;
        background: var(--color-primary);
        color: #fff;
        font-size: 10px;
        min-width: 18px;
        height: 18px;
        line-height: 18px;
        text-align: center;
        border-radius: 999px;
        padding: 0 4px;
    }

    /* Arama çubuğu tam genişlikte 2. satıra zorla */
    .search-bar {
        order: 99;
        flex-basis: 100%;
        width: 100%;
        max-width: none;
        height: 46px;
        margin: 0 !important;
    }
    .search-bar-icon { padding-left: 14px; }
    .search-bar input { line-height: 42px; font-size: 14.5px; }

    /* Hamburger menü, ana nav */
    .main-nav { display: none; }
    .main-nav.open { display: block; }
}

@media (max-width: 768px) {
    .hero-mega { padding: 36px 0 30px; }
    .hero h1 { font-size: clamp(28px, 6vw, 38px); }
    .hero-features { gap: 14px; }
    .hero-features li { font-size: 12.5px; }

    .main-nav { display: none; }
    .main-nav.open { display: block; }
    .main-nav > .container > ul { flex-direction: column; gap: 0; }
    .main-nav a { padding: 14px 24px; }
    .main-nav > .container > ul > li > a::after { display: none; }
    .dropdown {
        position: static;
        opacity: 1;
        visibility: visible;
        transform: none;
        background: rgba(0,0,0,.15);
        box-shadow: none;
        border-radius: 0;
        color: #fff;
        padding: 0;
    }
    .dropdown a { padding: 10px 40px; color: rgba(255,255,255,.85); }

    /* Wizard finder mobil — sıralama HTML order'ından geliyor:
       fw-top → fw-code-section → fw-body */
    .finder-wizard {
        padding: 16px 16px 14px;
        border-radius: 14px;
    }
    /* Mobilde OEM/Parça araması, fw-top altında: üst border yerine alt border */
    .finder-wizard .fw-code-section {
        margin-top: 0;
        padding-top: 0;
        border-top: 0;
        margin-bottom: 14px;
        padding-bottom: 14px;
        border-bottom: 1px solid var(--color-border);
    }
    .fw-top-text h2 { font-size: 16.5px; }
    .fw-top-text p { font-size: 12.5px; }
    .fw-step-label { font-size: 13px; }
    .fw-cta { font-size: 14.5px; padding: 14px 18px; }
    .fw-code-search { gap: 6px; }
    .fw-code-search input { font-size: 13px; padding: 11px 12px; }
    /* Input + buton stacked layout ≤1024px (style.css base) — dar ekranda input %100 */

    /* Trust strip mobile */
    .trust-strip { padding: 18px 0; }
    .trust-strip-grid { grid-template-columns: repeat(2, 1fr); gap: 8px; }
    .trust-strip-item {
        border-right: 0;
        padding: 8px 4px;
        background: var(--color-bg-soft);
        border-radius: 8px;
    }
    .trust-strip-icon { width: 36px; height: 36px; }
    .trust-strip-icon svg { width: 18px; height: 18px; }
    .trust-strip-title { font-size: 12.5px; }
    .trust-strip-sub { font-size: 11.5px; }

    /* Sections */
    .vehicle-types,
    .popular-brands,
    .categories,
    .featured-products,
    .vehicle-finder { padding: 36px 0; }

    .product-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }
    .category-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
    .trust-grid { grid-template-columns: 1fr 1fr; }
    .brand-grid { grid-template-columns: repeat(3, 1fr); }
    .footer-grid { grid-template-columns: 1fr; gap: 28px; padding: 0 4px 28px; }
    .vehicle-type-grid { grid-template-columns: 1fr; gap: 10px; }
    .brand-logo-grid { grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)); gap: 8px; }
    .vehicle-type-card { grid-template-columns: 56px 1fr auto; gap: 12px; padding: 16px; }
    .vt-icon { font-size: 38px; }

    .section-head { flex-direction: column; align-items: flex-start; gap: 8px; }
    .section-head h2 { font-size: 22px; }

    .finder-form { grid-template-columns: 1fr; padding: 12px; gap: 8px; }

    /* Catalog & detail */
    .catalog-toolbar { flex-direction: column; gap: 8px; align-items: stretch; }
    .catalog-toolbar select { width: 100%; }
    .product-quick-info strong { min-width: 110px; font-size: 12px; }
    .product-summary h1 { font-size: 22px; }
    .product-price-block .price { font-size: 26px; }
}

/* Small mobile (≤480px) */
@media (max-width: 480px) {
    .hero h1 { font-size: 26px; }
    .hero-sub { font-size: 14px; }
    .hero-features li { font-size: 12px; }

    .product-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
    .product-title { font-size: 12.5px; min-height: 50px; }
    .product-image { aspect-ratio: 1; }
    .product-image img { padding: 8px; }
    .product-info { padding: 10px 12px; }
    .price { font-size: 15px; }
    .btn-add-cart { width: calc(100% - 20px); margin: 0 10px 10px; padding: 8px; font-size: 11.5px; }

    .page-head h1 { font-size: 22px; }
    .brand-grid { grid-template-columns: repeat(2, 1fr); }

    .fw-tip-cards { grid-template-columns: 1fr; }
    .fw-trust-row { grid-template-columns: 1fr; }
    .trust-strip-grid { grid-template-columns: 1fr; }

    .breadcrumb { font-size: 12px; padding: 12px 0; }
    .breadcrumb ol { gap: 4px; }
}
