/**
 * Gutenberg Block Layout Styling
 */

/* Global adjustments */
.nav-menu .menu-link[href="#"] {
    cursor: default;
}

div.page h2:first-child {
    margin-top:0;
}

div.page .ai-wrap {
    margin:0;
}

.wp-block-list {
    padding-left:20px;
}

/* Base image normalization */
.wp-block-image {
    margin: 0;
}

/* Column layout */
.wp-block-columns.is-layout-flex {
    align-items: stretch;
    gap: 1.5em;
}

.wp-block-columns .wp-block-column {
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

/* Column images */
.wp-block-columns .wp-block-column .wp-block-image {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.wp-block-columns .wp-block-column .wp-block-image img {
    width: 100%;
    height: auto;
    aspect-ratio: 4/3;
    object-fit: cover;
    object-position: center;
    display: block;
}

/* Fallback for browsers without aspect-ratio support */
@supports not (aspect-ratio: 4/3) {
    .wp-block-columns .wp-block-column .wp-block-image img {
        position: relative;
        height: 0;
        padding-top: 75%;
    }
    
    .wp-block-columns .wp-block-column .wp-block-image img {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }
}

/* Full-width images */
.wp-block-image.size-full:not(.wp-block-columns .wp-block-image) {
    width: 100%;
    max-width: 100%;
    clear: both;
}

.wp-block-image.size-full:not(.wp-block-columns .wp-block-image) img {
    width: 100%;
    height: auto;
    max-width: 100%;
    display: block;
}

/* Spacing between blocks */
/* Full-width image after columns */
.wp-block-columns + .wp-block-image {
    margin-top: 1.5em;
    margin-bottom: 0;
}

/* Image after another image (but not after columns) */
.wp-block-image + .wp-block-image:not(.wp-block-columns + .wp-block-image) {
    margin-top: 1.5em;
}

/* Ensure column images have no margins */
.wp-block-columns .wp-block-image {
    margin: 0;
}

/* Override WordPress block library margin */
.wp-block-columns {
    margin-bottom: 0;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .wp-block-columns.is-layout-flex {
        flex-direction: column;
    }
    
    .wp-block-columns .wp-block-column {
        width: 100% !important;
    }
    
    .wp-block-columns .wp-block-column .wp-block-image img {
        aspect-ratio: 16/9;
    }
    
    @supports not (aspect-ratio: 16/9) {
        .wp-block-columns .wp-block-column .wp-block-image img {
            padding-top: 56.25%;
        }
    }
}