/* ============================================================
   RESPONSIVE.CSS - MOBİL VE TABLET UYUMLULUK
   ============================================================ */

@media (max-width: 1024px) {
    .services-grid { grid-template-columns: repeat(2,1fr); }
    .brands-grid { grid-template-columns: repeat(4,1fr); }
    .gallery-grid { grid-template-columns: repeat(2,1fr); }
    .footer-grid { grid-template-columns: 1fr 1fr; }
    .about-preview-grid { grid-template-columns: 1fr; }
    .about-preview-img { height: 320px; }
    .content-layout { grid-template-columns: 1fr; }
    .content-side { position: static; }
}

@media (max-width: 860px) {
    .main-nav {
        position: fixed; top: 0; right: -100%; width: 82%; max-width: 340px; height: 100vh;
        background: #fff; box-shadow: -10px 0 30px rgba(0,0,0,.15); padding: 90px 24px 24px;
        transition: right .3s ease; z-index: 600; overflow-y: auto;
    }
    .main-nav.open { right: 0; }
    .main-nav > ul { flex-direction: column; gap: 4px; }
    .main-nav > ul > li > a { padding: 14px 4px; border-bottom: 1px solid var(--border); }
    .dropdown { display: block; position: static; box-shadow: none; padding: 0 0 0 14px; min-width: 0; }
    .has-dropdown .dropdown { display: none; }
    .has-dropdown.open .dropdown { display: block; }
    .menu-toggle { display: flex; }
    .header-phone { display: none; }
    .header-phone.mobile-show { display: inline-flex; font-size: .8rem; padding: 8px 14px; }
}

@media (max-width: 768px) {
    h1 { font-size: 1.9rem; }
    h2 { font-size: 1.5rem; }
    .slider { height: 520px; }
    .slide-content h1 { font-size: 1.9rem; }
    .slide-content h2 { font-size: 1.05rem; }
    .trust-grid { grid-template-columns: repeat(2,1fr); }
    .services-grid { grid-template-columns: 1fr; }
    .brands-grid { grid-template-columns: repeat(3,1fr); }
    .gallery-grid { grid-template-columns: 1fr; }
    .footer-grid { grid-template-columns: 1fr; }
    .contact-info-grid { grid-template-columns: 1fr; }
    .form-row { grid-template-columns: 1fr; }
    .cta-inner { flex-direction: column; text-align: center; }
    .section { padding: 50px 0; }
    .page-hero { padding: 60px 0; }
}

@media (max-width: 480px) {
    .brands-grid { grid-template-columns: repeat(2,1fr); }
    .slide-buttons { flex-direction: column; width: 100%; }
    .slide-buttons .btn { width: 100%; }
    .float-actions { bottom: 14px; right: 14px; gap: 10px; }
    .float-btn { width: 52px; height: 52px; padding: 0; border-radius: 50%; justify-content: center; }
    .float-label { display: none; }
}