.wfg-output {
    width: min(100%, 1600px);
    margin: 0 auto;
}

.wfg-output *,
.wfg-output *::before,
.wfg-output *::after {
    box-sizing: border-box;
}

.wfg-output-stage {
    position: relative;
    width: 100%;
    aspect-ratio: 1 / var(--wfg-canvas-ratio);
}

.wfg-output-item {
    position: absolute;
    top: calc(var(--wfg-y) * 1%);
    left: calc(var(--wfg-x) * 1%);
    width: calc(var(--wfg-w) * 1%);
    aspect-ratio: var(--wfg-ratio);
    margin: 0;
    overflow: hidden;
}

.wfg-output-link {
    display: block;
    width: 100%;
    height: 100%;
    overflow: hidden;
    cursor: zoom-in;
}

.wfg-output-item img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: var(--wfg-pan-x) var(--wfg-pan-y);
    transform: scale(var(--wfg-zoom));
    transform-origin: var(--wfg-pan-x) var(--wfg-pan-y);
}

.wfg-output-item.is-cropped img {
    object-fit: cover;
}

@media (max-width: 767px) {
    .wfg-output-stage {
        display: flex;
        flex-direction: column;
        gap: 16px;
        aspect-ratio: auto;
    }

    .wfg-output-item {
        position: relative;
        top: auto;
        left: auto;
        width: 100%;
        flex: 0 0 auto;
    }
}

/* Global spacing stays constant outside the proportional image canvas. */
.wfg-output.wfg-fixed-bottom {
    padding-bottom: var(--wfg-bottom-space, 60px);
}

/* Use Semplice's content width even in a fluid, gutterless grid section. */
#content-holder smp-container.wfg-info-container {
    display: block;
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    padding: 0;
    margin: 0 auto;
}
#content-holder [data-layout="fluid"] smp-container.wfg-info-container {
    max-width: var(--smp-grid-width-desktop, 1664px);
    padding: 0 var(--smp-grid-outer-desktop, 32px);
}
@media (max-width: 1169.98px) {
    #content-holder [data-layout="fluid"] smp-container.wfg-info-container {
        padding: 0 var(--smp-grid-outer-tablet, 32px);
    }
}
@media (max-width: 575.98px) {
    #content-holder [data-layout="fluid"] smp-container.wfg-info-container {
        padding: 0 var(--smp-grid-outer-mobile, 20px);
    }
}
.wfg-project-info {
    font-family: inherit;
    font-size: 16px;
    line-height: 1.5;
    padding-bottom: 20px;
}
/* Override Semplice's later .is-content paragraph spacing. */
#content-holder .wfg-project-info p {
    margin: 0 !important;
}
#content-holder .wfg-project-info > .wfg-project-description {
    margin-top: 0 !important;
    padding-top: 0 !important;
}
#content-holder .wfg-project-info .wfg-project-info-title,
#content-holder .wfg-project-info-title strong,
.wfg-project-title {
    font-weight: 700;
}
#content-holder .wfg-project-description p + p {
    margin-top: 16px !important;
}

#content-holder .wfg-project-description a {
    color: inherit;
    text-decoration: underline;
    text-underline-offset: 0.15em;
}
#content-holder .wfg-project-description strong,
#content-holder .wfg-project-description b { font-weight: 700; }
#content-holder .wfg-project-description em,
#content-holder .wfg-project-description i { font-style: italic; }