/* Responsive Image Styles */
.responsive-image {
    display: block;
    margin: 2rem auto;
    text-align: center;
    max-width: 100%;
}

.responsive-image img {
    display: block;
    margin: 0 auto;
    max-width: 100%;
    height: auto;
    border-radius: 4px;
}

/* Basic figcaption styling - will be overridden by post-content rule below */
.responsive-image figcaption {
    margin-top: 0.8rem;
    text-align: center;
}

/* Mobile responsiveness */
@media (max-width: 768px) {
    .responsive-image {
        margin: 1.5rem auto;
    }

    .responsive-image img {
        max-width: 100%;
    }

    .responsive-image figcaption {
        font-size: 0.85em;
        padding: 0 1rem;
    }
}

/* For very small screens */
@media (max-width: 480px) {
    .responsive-image {
        margin: 1rem auto;
    }

    .responsive-image figcaption {
        font-size: 0.8em;
    }
}

/* Override PaperMod's bold figcaption styling for responsive-image */
.post-content .responsive-image figcaption {
    font-weight: normal !important;
    font-size: 14px;
    color: var(--primary);
}