/* Mobil Responsive Ek Kurallar - Tüm Sayfalar İçin */

/* Genel Mobil Ayarları */
@media (max-width: 768px) {
    /* Typography */
    h1 { font-size: 1.8rem !important; line-height: 1.3 !important; }
    h2 { font-size: 1.5rem !important; line-height: 1.3 !important; }
    h3 { font-size: 1.2rem !important; line-height: 1.3 !important; }
    h4 { font-size: 1.1rem !important; }
    p, li { font-size: 0.95rem !important; line-height: 1.6 !important; }
    
    /* Container ve padding */
    .container { padding: 0 15px !important; }
    section { padding: 30px 0 !important; }
    
    /* Tablolar - Card görünümü */
    table {
        display: block;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        font-size: 0.85rem !important;
    }
    
    table thead { display: none; }
    
    table tbody tr {
        display: block;
        margin-bottom: 15px;
        border: 1px solid #dee2e6;
        border-radius: 8px;
        padding: 10px;
        background: white;
    }
    
    table tbody td {
        display: flex;
        justify-content: space-between;
        padding: 8px !important;
        border: none !important;
        text-align: right !important;
    }
    
    table tbody td:before {
        content: attr(data-label);
        font-weight: bold;
        text-align: left;
        padding-right: 10px;
        flex: 0 0 40%;
    }
    
    /* Grid sistemleri */
    .info-grid,
    .camera-types-grid,
    .feature-grid,
    .services-grid { 
        grid-template-columns: 1fr !important; 
        gap: 15px !important;
    }
    
    .process-steps .process-step {
        margin-bottom: 20px;
    }
    
    /* Görseller */
    img { 
        max-width: 100% !important; 
        height: auto !important; 
    }
    
    /* Butonlar */
    .btn, 
    .btn-cta-hero,
    .service-link {
        padding: 12px 24px !important;
        font-size: 0.95rem !important;
        display: inline-block;
        width: auto;
        text-align: center;
    }
    
    /* Hero sections */
    .article-hero,
    .hero-form-section {
        padding: 50px 15px 40px !important;
    }
    
    /* FAQ */
    .faq-question {
        font-size: 0.95rem !important;
        padding: 15px !important;
    }
    
    .faq-answer {
        font-size: 0.9rem !important;
        padding: 15px !important;
    }
    
    /* Boxes */
    .info-box,
    .warning-box,
    .info-card,
    .feature-item,
    .service-card {
        padding: 15px !important;
        margin: 15px 0 !important;
    }
    
    /* WhatsApp button */
    .btn-whatsapp {
        font-size: 0.9rem !important;
    }
}

/* Küçük mobil cihazlar */
@media (max-width: 480px) {
    h1 { font-size: 1.5rem !important; }
    h2 { font-size: 1.3rem !important; }
    h3 { font-size: 1.1rem !important; }
    p, li { font-size: 0.9rem !important; }
    
    .btn, 
    .btn-cta-hero {
        padding: 10px 20px !important;
        font-size: 0.9rem !important;
    }
    
    /* Tablo mobil optimize */
    table {
        font-size: 0.8rem !important;
    }
    
    table tbody td {
        padding: 6px !important;
        flex-direction: column;
        align-items: flex-start;
    }
    
    table tbody td:before {
        margin-bottom: 5px;
        font-size: 0.85rem;
    }
}

/* Çok küçük ekranlar */
@media (max-width: 360px) {
    h1 { font-size: 1.3rem !important; }
    h2 { font-size: 1.2rem !important; }
    
    .container {
        padding: 0 10px !important;
    }
}

/* Touch device optimizasyonları */
@media (hover: none) and (pointer: coarse) {
    /* Touch hedefleri büyütülüyor */
    a, button, .btn {
        min-height: 44px;
        min-width: 44px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }
    
    /* Link ve buton aralıkları */
    nav ul li {
        padding: 5px 0;
    }
}

/* Landscape mode - mobil yatay */
@media (max-width: 768px) and (orientation: landscape) {
    .article-hero {
        padding: 30px 15px !important;
    }
    
    .article-hero h1 {
        font-size: 1.6rem !important;
    }
}
