.smgfe-gallery {
    --smgfe-columns: 5;
    --smgfe-row-height: 165px;
    --smgfe-gap: 12px;
    --smgfe-hover-scale: 1.05;
    --smgfe-hover-lift: 8px;
    --smgfe-hover-rotate: 2deg;
    --smgfe-border-width: 0px 0px 0px 0px;
    --smgfe-border-color: #000000;
    --smgfe-border-gradient-start: #6ec1e4;
    --smgfe-border-gradient-end: #54595f;
    --smgfe-border-gradient-angle: 135deg;

    display: grid;
    grid-template-columns: repeat(var(--smgfe-columns), minmax(0, 1fr));
    grid-auto-rows: var(--smgfe-row-height);
    grid-auto-flow: dense;
    gap: var(--smgfe-gap);
    width: 100%;
    max-width: 100%;
}

.smgfe-item {
    position: relative;
    display: block;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    background: #f1f1f1;
    text-decoration: none;
    isolation: isolate;
    box-sizing: border-box;
}

.smgfe-border-solid .smgfe-item,
.smgfe-border-gradient .smgfe-item {
    border-style: solid;
    border-width: var(--smgfe-border-width);
}

.smgfe-border-solid .smgfe-item {
    border-color: var(--smgfe-border-color);
}

.smgfe-border-gradient .smgfe-item {
    border-color: transparent;
    background:
        linear-gradient(#f1f1f1, #f1f1f1) padding-box,
        linear-gradient(
            var(--smgfe-border-gradient-angle),
            var(--smgfe-border-gradient-start),
            var(--smgfe-border-gradient-end)
        ) border-box;
}

.smgfe-item::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 2;
    opacity: 0;
    pointer-events: none;
    transition: opacity 220ms ease;
}

.smgfe-item img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    transform: scale(1);
    filter: grayscale(0);
    transition: transform 380ms cubic-bezier(.22, 1, .36, 1), filter 320ms ease;
}

.smgfe-hover-zoom .smgfe-item:hover img,
.smgfe-hover-zoom .smgfe-item:focus img {
    transform: scale(var(--smgfe-hover-scale));
}

.smgfe-hover-lift .smgfe-item {
    transition: transform 280ms cubic-bezier(.22, 1, .36, 1), box-shadow 280ms ease;
}
.smgfe-hover-lift .smgfe-item:hover,
.smgfe-hover-lift .smgfe-item:focus {
    transform: translateY(calc(var(--smgfe-hover-lift) * -1));
    box-shadow: 0 18px 34px rgba(0,0,0,.18);
    z-index: 4;
}

.smgfe-hover-rotate .smgfe-item:hover img,
.smgfe-hover-rotate .smgfe-item:focus img {
    transform: scale(1.035) rotate(var(--smgfe-hover-rotate));
}

.smgfe-hover-dark_overlay .smgfe-item:hover::after,
.smgfe-hover-dark_overlay .smgfe-item:focus::after,
.smgfe-has-captions .smgfe-item:hover::after,
.smgfe-has-captions .smgfe-item:focus::after {
    opacity: 1;
}

.smgfe-hover-grayscale_color .smgfe-item img {
    filter: grayscale(1);
}
.smgfe-hover-grayscale_color .smgfe-item:hover img,
.smgfe-hover-grayscale_color .smgfe-item:focus img {
    filter: grayscale(0);
}

.smgfe-hover-none .smgfe-item::after {
    display: none;
}

.smgfe-caption {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 3;
    padding: 16px;
    color: #fff;
    background: linear-gradient(to top, rgba(0,0,0,.72), rgba(0,0,0,0));
    transform: translateY(8px);
    opacity: 0;
    transition: opacity 220ms ease, transform 220ms ease;
}

.smgfe-item:hover .smgfe-caption,
.smgfe-item:focus .smgfe-caption {
    transform: translateY(0);
    opacity: 1;
}

.smgfe-ratio-1x1 { grid-column: span 1; grid-row: span 1; }
.smgfe-ratio-2x1 { grid-column: span 2; grid-row: span 1; }
.smgfe-ratio-1x2 { grid-column: span 1; grid-row: span 2; }
.smgfe-ratio-2x2 { grid-column: span 2; grid-row: span 2; }
.smgfe-ratio-3x1 { grid-column: span 3; grid-row: span 1; }
.smgfe-ratio-1x3 { grid-column: span 1; grid-row: span 3; }
.smgfe-ratio-4x3 { grid-column: span 4; grid-row: span 3; }
.smgfe-ratio-3x4 { grid-column: span 3; grid-row: span 4; }
.smgfe-ratio-4x5 { grid-column: span 4; grid-row: span 5; }
.smgfe-ratio-5x4 { grid-column: span 5; grid-row: span 4; }

@media (max-width: 1024px) {
    .smgfe-responsive-simplify .smgfe-ratio-3x1 { grid-column: span 2; }
    .smgfe-responsive-simplify .smgfe-ratio-1x3 { grid-row: span 2; }
    .smgfe-responsive-simplify .smgfe-ratio-2x2 { grid-column: span 2; grid-row: span 2; }
    .smgfe-responsive-simplify .smgfe-ratio-4x3,
    .smgfe-responsive-simplify .smgfe-ratio-3x4,
    .smgfe-responsive-simplify .smgfe-ratio-4x5,
    .smgfe-responsive-simplify .smgfe-ratio-5x4 {
        grid-column: span 3;
        grid-row: span 3;
    }
}

@media (max-width: 767px) {
    .smgfe-responsive-simplify .smgfe-ratio-2x2,
    .smgfe-responsive-simplify .smgfe-ratio-3x1 {
        grid-column: span 2;
        grid-row: span 1;
    }

    .smgfe-responsive-simplify .smgfe-ratio-1x3 {
        grid-column: span 1;
        grid-row: span 2;
    }

    .smgfe-responsive-simplify .smgfe-ratio-4x3,
    .smgfe-responsive-simplify .smgfe-ratio-5x4 {
        grid-column: span 2;
        grid-row: span 2;
    }

    .smgfe-responsive-simplify .smgfe-ratio-3x4,
    .smgfe-responsive-simplify .smgfe-ratio-4x5 {
        grid-column: span 1;
        grid-row: span 2;
    }

    .smgfe-responsive-square_mobile .smgfe-item {
        grid-column: span 1 !important;
        grid-row: span 1 !important;
    }
}

/* v1.1 last-row helpers */
.smgfe-item.smgfe-last-row-item {
    min-width: 0;
}
.smgfe-last-row-center .smgfe-item.smgfe-last-row-first {
    grid-column-start: var(--smgfe-last-row-start, auto);
}

/* v1.2 viewport and final-row fill helpers */
.smgfe-gallery.smgfe-fill-viewport {
    min-height: 100vh;
    min-height: 100svh;
}

.smgfe-item.smgfe-fill-down {
    min-height: 0;
}