/* ==========================================================================
   Responsive Breakpoints - Mobile First
   ========================================================================== */

/* Tablet: 768px and up */
@media (min-width: 768px) {
    .rg-vp-content-layout {
        grid-template-columns: 1fr 320px;
    }
    
    .rg-vp-content-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .rg-vp-header__mobile-toggle {
        display: none;
    }
}

/* Desktop: 1024px and up */
@media (min-width: 1024px) {
    .rg-vp-content-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    
    .rg-vp-single-layout {
        grid-template-columns: 1fr 400px;
    }
}

/* Large Desktop: 1440px and up */
@media (min-width: 1440px) {
    .rg-vp-content-grid {
        grid-template-columns: repeat(4, 1fr);
    }
    
    .rg-vp-content-layout {
        max-width: 1600px;
    }
}

/* Mobile: Hide sidebar */
@media (max-width: 767px) {
    .rg-vp-sidebar {
        display: none;
    }
    
    .rg-vp-content-layout {
        grid-template-columns: 1fr;
    }
}