/* ============================================
   TvojPazar - Responsive Design
   ============================================ */

@media (max-width: 1200px) {
    .listings-grid { grid-template-columns: repeat(3, 1fr); }
    .testimonials-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 992px) {
    .hero-content { grid-template-columns: 1fr; text-align: center; }
    .hero-text h1 { font-size: 2.5rem; }
    .hero-buttons { justify-content: center; }
    .hero-image { display: none; }
    .categories-grid { grid-template-columns: repeat(3, 1fr); gap: 14px; }
    .listings-grid { grid-template-columns: repeat(2, 1fr); gap: 14px; }
    .stats-grid { grid-template-columns: repeat(2, 1fr); }
    .footer-grid { grid-template-columns: repeat(2, 1fr); }
    .app-content { grid-template-columns: 1fr; text-align: center; }
    .app-buttons { justify-content: center; }
    .app-image { display: none; }
    .navbar-center { display: none; }
    .mobile-search { display: block; }
    .mobile-menu-btn { display: block; }
    .add-listing-btn span { display: none; }
    .cities-grid { grid-template-columns: repeat(4, 1fr); }
    .testimonials-grid { grid-template-columns: 1fr; }
    .search-layout { grid-template-columns: 1fr; }
    .filter-sidebar { position: static; }
}

@media (max-width: 768px) {
    .container { padding: 0 16px; }
    .top-bar { display: none; }
    .hero-text h1 { font-size: 2rem; }
    .hero-text p { font-size: 1rem; }
    .categories-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
    .category-card { padding: 14px; gap: 10px; }
    .category-icon { width: 40px; height: 40px; font-size: 1rem; flex-shrink: 0; }
    .category-info h3 { font-size: 0.85rem; word-break: break-word; }
    .category-count { font-size: 0.7rem; }
    .category-arrow { display: none; }
    .listings-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
    .listing-image { height: 150px; }
    .listing-content { padding: 10px; }
    .listing-title { font-size: 0.85rem; }
    .listing-price { font-size: 1rem; }
    .listing-category { font-size: 0.65rem; }
    .listing-meta { font-size: 0.7rem; flex-wrap: wrap; gap: 4px; }
    .steps-grid { grid-template-columns: 1fr; }
    .stats-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
    .stat-number { font-size: 1.8rem; }
    .stat-icon { width: 48px; height: 48px; font-size: 1.2rem; }
    .section-header h2 { font-size: 1.4rem; }
    .section-header p { font-size: 0.9rem; }
    .footer-grid { grid-template-columns: 1fr; gap: 30px; }
    .footer-bottom-content { flex-direction: column; gap: 15px; text-align: center; }
    .cities-grid { grid-template-columns: repeat(3, 1fr); gap: 8px; }
    .city-card { padding: 12px 8px; }
    .city-card span { font-size: 0.8rem; }
    .search-layout { grid-template-columns: 1fr; }
    .step-card { padding: 30px 20px; }
    .step-card h3 { font-size: 1rem; }
    .testimonial-card { padding: 20px; }
    .section-footer .btn { padding: 10px 18px; font-size: 0.85rem; }
}

@media (max-width: 480px) {
    .container { padding: 0 12px; }
    .categories-grid { grid-template-columns: 1fr 1fr; gap: 8px; }
    .category-card { padding: 10px; gap: 8px; }
    .category-icon { width: 36px; height: 36px; font-size: 0.85rem; }
    .category-info h3 { font-size: 0.8rem; }
    .category-count { font-size: 0.65rem; }
    .listings-grid { grid-template-columns: 1fr 1fr; gap: 8px; }
    .listing-image { height: 110px; }
    .listing-content { padding: 8px; }
    .listing-title { font-size: 0.78rem; }
    .listing-price { font-size: 0.9rem; }
    .listing-category { font-size: 0.6rem; }
    .listing-meta { font-size: 0.65rem; flex-direction: column; gap: 2px; }
    .stats-grid { grid-template-columns: repeat(2, 1fr); gap: 6px; }
    .stat-item { padding: 14px 8px; }
    .stat-number { font-size: 1.3rem; }
    .stat-icon { width: 40px; height: 40px; font-size: 1rem; }
    .stat-label { font-size: 0.75rem; }
    .section-header h2 { font-size: 1.2rem; }
    .section-header { margin-bottom: 24px; }
    .back-to-top { bottom: 16px; right: 16px; width: 36px; height: 36px; font-size: 0.9rem; }
    .cities-grid { grid-template-columns: repeat(2, 1fr); gap: 6px; }
    .city-card { padding: 10px 6px; }
    .city-card span { font-size: 0.75rem; }
    .step-card { padding: 24px 16px; }
    .step-icon { font-size: 2rem; }
    .testimonial-card { padding: 16px; }
    .testimonial-card p { font-size: 0.85rem; }
    .app-btn { padding: 12px 20px; font-size: 0.85rem; }
    .section-footer .btn { padding: 8px 14px; font-size: 0.8rem; }
    .section-footer { margin-top: 24px; }
}

@media (max-width: 360px) {
    .container { padding: 0 8px; }
    .listings-grid { grid-template-columns: 1fr 1fr; gap: 6px; }
    .listing-image { height: 100px; }
    .categories-grid { grid-template-columns: 1fr 1fr; gap: 6px; }
    .category-card { padding: 8px; }
    .category-icon { width: 30px; height: 30px; font-size: 0.75rem; }
    .category-info h3 { font-size: 0.7rem; }
    .cities-grid { grid-template-columns: repeat(2, 1fr); }
}

/* Taşma önleme */
.category-card, .listing-card, .city-card, .step-card, .testimonial-card, .stat-item {
    box-sizing: border-box;
    overflow: hidden;
}

.listing-title, .category-info h3, .step-card h3 {
    word-break: break-word;
    overflow-wrap: break-word;
}

img {
    max-width: 100%;
    height: auto;
}