/*
 * Responsive Styles
 * Additional responsive styles for Doup Theme
 */

/* Tablet (768px and below) */
@media (max-width: 768px) {
    .site-header .container {
        flex-direction: column;
        align-items: flex-start;
    }

    .main-navigation {
        width: 100%;
        margin-top: 20px;
    }

    .main-navigation ul {
        flex-direction: column;
        gap: 10px;
    }

    .site-content {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .entry-title {
        font-size: 24px;
    }

    .entry-meta {
        font-size: 13px;
    }
}

/* Mobile (480px and below) */
@media (max-width: 480px) {

    .site-header {
        padding: 15px 0;
    }

    .site-title {
        font-size: 22px;
    }

    .entry-title {
        font-size: 20px;
    }

    .post {
        margin-bottom: 40px;
        padding-bottom: 30px;
    }

    .site-footer {
        padding: 30px 0;
    }

    .widget {
        margin-bottom: 30px;
    }
}

/* Large Desktop (1400px and above) */
@media (min-width: 1400px) {
    .container {
        max-width: 1400px;
    }
}