/* ========================================
   STYLES.CSS - Index/Home Page Specific Styles
   Base, Header, Footer, and Buttons moved to shared files
   ======================================== */

/* View All Button Positioning - Index Page Specific */
.view-all-btn {
    margin-right: 37.5%;
    margin-left: 37.5%;
}

/* Theme Toggle Container Positioning */
.theme-toggle-container {
    position: absolute;
    right: 120px;
    top: 37px;
}

@media (max-width: 768px) {
    .theme-toggle-container {
        position: static;
        display: flex;
        justify-content: center;
        margin-top: 15px;
    }
}

/* ========================================
   Bento Grid Layout - Index Page
   ======================================== */
.bento-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-auto-rows: minmax(200px, auto);
    grid-gap: 15px;
    padding: 0 40px;
    max-width: 1800px;
    margin: 0 auto;
}

/* Section Title Override for Index Page */
.section-title {
    margin-bottom: 8px;
}