/* ============================================
   SÉRGIO BENACHIO - CSS RESPONSIVO
   Breakpoints: 1200, 1024, 768, 576
   ============================================ */

/* ----- Até 1200px ----- */
@media (max-width: 1200px) {
    .hero-title { font-size: 2.8rem; }
    .properties-grid { grid-template-columns: repeat(2, 1fr); }
    .categories-grid { grid-template-columns: repeat(3, 1fr); }
    
    .detail-grid { grid-template-columns: 1fr 340px; gap: 30px; }
    .detail-quick-features { grid-template-columns: repeat(3, 1fr); }
    .detail-info-grid { grid-template-columns: repeat(2, 1fr); }
    
    .footer-grid { grid-template-columns: 1.2fr 1fr 1fr 1.2fr; gap: 30px; }
}

/* ----- Até 1024px ----- */
@media (max-width: 1024px) {
    .section { padding: 60px 0; }
    
    .top-bar { display: none; }
    
    /* Navbar Mobile */
    .nav-toggle { display: block; }
    
    .nav-menu {
        position: fixed;
        top: 0;
        right: -320px;
        width: 300px;
        height: 100vh;
        background: var(--white);
        flex-direction: column;
        align-items: stretch;
        padding: 80px 28px 28px;
        gap: 0;
        box-shadow: -4px 0 20px rgba(0,0,0,0.15);
        overflow-y: auto;
        transition: right 0.35s ease;
        z-index: 1000;
    }
    
    .nav-menu.open { right: 0; }
    
    .nav-link {
        padding: 14px 0;
        border-bottom: 1px solid var(--border-color);
        justify-content: space-between;
    }
    
    .nav-cta {
        margin-left: 0;
        margin-top: 16px;
        text-align: center;
        justify-content: center;
    }
    
    .dropdown-menu {
        position: static;
        opacity: 1;
        visibility: visible;
        transform: none;
        box-shadow: none;
        border: none;
        padding: 0 0 0 16px;
        display: none;
        background: var(--off-white);
        border-radius: var(--radius-sm);
        margin-top: 8px;
    }
    
    .dropdown.open .dropdown-menu { display: block; }
    
    .dropdown:hover .dropdown-menu {
        opacity: 0;
        visibility: hidden;
    }
    .dropdown.open .dropdown-menu {
        opacity: 1;
        visibility: visible;
    }
    
    .nav-overlay {
        display: block;
        position: fixed;
        inset: 0;
        background: rgba(0,0,0,0.4);
        z-index: 999;
        opacity: 0;
        visibility: hidden;
        transition: var(--transition);
    }
    
    .nav-overlay.active {
        opacity: 1;
        visibility: visible;
    }
    
    /* Hero */
    .hero { min-height: 70vh; }
    .hero-title { font-size: 2.5rem; }
    .hero-subtitle { font-size: 1rem; }
    
    .search-form { flex-direction: column; }
    .search-field { border-right: none; border-bottom: 1px solid var(--border-color); }
    .search-btn { justify-content: center; }
    
    .stats-grid { grid-template-columns: repeat(2, 1fr); }
    
    /* Grids */
    .about-home-grid { grid-template-columns: 1fr; gap: 40px; }
    .about-grid { grid-template-columns: 1fr; gap: 40px; }
    .services-grid { grid-template-columns: repeat(2, 1fr); }
    .testimonials-grid { grid-template-columns: repeat(2, 1fr); }
    .blog-grid { grid-template-columns: repeat(2, 1fr); }
    
    .detail-grid { grid-template-columns: 1fr; }
    .sticky-card { position: static; }
    
    .blog-layout { grid-template-columns: 1fr; }
    .blog-layout .sidebar-widget:not(:last-child) { display: none; }
    
    .contact-cards-grid { grid-template-columns: repeat(2, 1fr); }
    .contact-grid { grid-template-columns: 1fr; }
    
    .tool-grid { grid-template-columns: 1fr; }
    .tools-nav-grid { grid-template-columns: repeat(2, 1fr); }
    
    .footer-grid { grid-template-columns: repeat(2, 1fr); }
}

/* ----- Até 768px ----- */
@media (max-width: 768px) {
    html { font-size: 15px; }
    .section { padding: 50px 0; }
    .container { padding: 0 16px; }
    
    .hero { min-height: 60vh; }
    .hero-title { font-size: 2rem; }
    .hero-content { padding: 60px 0 30px; }
    
    .section-title { font-size: 1.8rem; }
    
    .categories-grid { grid-template-columns: repeat(2, 1fr); }
    .category-card { height: 180px; }
    
    .about-home-features { grid-template-columns: 1fr; }
    
    .properties-grid { grid-template-columns: 1fr 1fr; }
    .property-image { height: 200px; }
    
    .property-slider { height: 340px; }
    .detail-quick-features { grid-template-columns: repeat(2, 1fr); }
    .detail-info-grid { grid-template-columns: 1fr; }
    .detail-title { font-size: 1.5rem; }
    
    .mvv-grid { grid-template-columns: 1fr; }
    .numbers-grid { grid-template-columns: repeat(2, 1fr); }
    
    .timeline::before { left: 20px; }
    .timeline-item,
    .timeline-item:nth-child(even) {
        width: 100%;
        margin-left: 0;
        padding-left: 50px;
        padding-right: 0;
        text-align: left;
    }
    .timeline-marker,
    .timeline-item:nth-child(odd) .timeline-marker,
    .timeline-item:nth-child(even) .timeline-marker {
        left: 12px;
        right: auto;
    }
    
    .result-cards { grid-template-columns: 1fr; }
    .compare-result-grid { grid-template-columns: 1fr; }
    .checklist-grid { grid-template-columns: 1fr 1fr; }
    
    .page-banner { padding: 60px 0; }
    .page-banner-content h1 { font-size: 2rem; }
    
    .cta-content h2 { font-size: 1.8rem; }
    
    .post-title { font-size: 1.6rem; }
    
    .form-row { grid-template-columns: 1fr; }
    
    .filters-grid { flex-direction: column; }
    .filter-group { min-width: 100%; }
    
    .footer-bottom-content {
        flex-direction: column;
        gap: 8px;
        text-align: center;
    }
}

/* ----- Até 576px ----- */
@media (max-width: 576px) {
    html { font-size: 14px; }
    .section { padding: 40px 0; }
    
    .hero { min-height: 80vh; }
    .hero-title { font-size: 1.8rem; }
    .hero-badge { font-size: 0.72rem; padding: 4px 14px; }
    .hero-subtitle { font-size: 0.92rem; margin-bottom: 28px; }
    
    .stats-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
    .stat-item { padding: 14px; }
    .stat-number { font-size: 1.6rem; }
    
    .section-title { font-size: 1.5rem; }
    .section-tag { font-size: 0.72rem; }
    
    .properties-grid { grid-template-columns: 1fr; }
    .categories-grid { grid-template-columns: 1fr 1fr; }
    .services-grid { grid-template-columns: 1fr; }
    .testimonials-grid { grid-template-columns: 1fr; }
    .blog-grid { grid-template-columns: 1fr; }
    .blog-grid.grid-2 { grid-template-columns: 1fr; }
    
    .contact-cards-grid { grid-template-columns: 1fr; }
    
    .tools-nav-grid { grid-template-columns: 1fr 1fr; }
    .checklist-grid { grid-template-columns: 1fr; }
    
    .cta-buttons { flex-direction: column; align-items: center; }
    .cta-section { padding: 60px 0; }
    
    .detail-price-value { font-size: 1.7rem; }
    .detail-quick-features { grid-template-columns: 1fr; }
    .property-slider { height: 260px; }
    
    .numbers-grid { grid-template-columns: 1fr 1fr; gap: 16px; }
    .number-value { font-size: 2.2rem; }
    
    .whatsapp-float { width: 52px; height: 52px; font-size: 1.5rem; bottom: 16px; right: 16px; }
    .back-to-top { bottom: 16px; right: 78px; width: 40px; height: 40px; }
    
    .author-box { flex-direction: column; text-align: center; align-items: center; }
    
    .share-buttons .share-btn { width: 38px; height: 38px; }
    
    .logo-name { font-size: 1.1rem; }
    .logo-subtitle { font-size: 0.65rem; letter-spacing: 1.5px; }
    .logo-img { height: 42px; }
    
    .footer-grid { grid-template-columns: 1fr; gap: 30px; }
    .page-banner { padding: 40px 0; }
    .page-banner-content h1 { font-size: 1.6rem; }
    
    .breadcrumb { flex-wrap: wrap; justify-content: center; }
}
