.integra-medical-gallery{
    --integra-gap:14px;
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    grid-auto-flow:row dense;
    gap:var(--integra-gap);
    width:100%;
}

/* Every card has a controlled size, regardless of the uploaded image dimensions. */
.integra-gallery-item{
    margin:0;
    min-width:0;
    aspect-ratio:1 / 1;
}

/* Desktop mosaic: first five photos create the hero composition. */
.integra-gallery-item:nth-child(1){grid-column:1;grid-row:1}
.integra-gallery-item:nth-child(2){grid-column:2;grid-row:1}
.integra-gallery-item:nth-child(3){grid-column:3 / span 2;grid-row:1 / span 2;aspect-ratio:auto}
.integra-gallery-item:nth-child(4){grid-column:1;grid-row:2}
.integra-gallery-item:nth-child(5){grid-column:2;grid-row:2}

.integra-gallery-trigger{
    position:relative;
    display:block;
    width:100%;
    height:100%;
    min-height:0;
    padding:0;
    border:0;
    border-radius:18px;
    overflow:hidden;
    background:#ece9e6;
    cursor:zoom-in;
    text-align:inherit;
    box-shadow:none;
}

.integra-gallery-trigger img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center;
    transition:transform .45s ease,filter .45s ease;
}

.integra-gallery-overlay{
    position:absolute;
    inset:0;
    display:grid;
    place-items:center;
    padding:18px;
    background:rgba(0,0,0,.26);
    opacity:0;
    transition:opacity .3s ease;
}

.integra-gallery-trigger:hover img,
.integra-gallery-trigger:focus-visible img{
    transform:scale(1.055);
    filter:brightness(.8);
}

.integra-gallery-trigger:hover .integra-gallery-overlay,
.integra-gallery-trigger:focus-visible .integra-gallery-overlay{
    opacity:1;
}

.integra-gallery-zoom{
    width:54px;
    height:54px;
    border-radius:50%;
    display:grid;
    place-items:center;
    background:rgba(255,255,255,.94);
    color:#3a2d24;
    box-shadow:0 10px 28px rgba(0,0,0,.2);
    transform:scale(.82);
    transition:transform .3s ease;
}

.integra-gallery-trigger:hover .integra-gallery-zoom,
.integra-gallery-trigger:focus-visible .integra-gallery-zoom{
    transform:scale(1);
}

.integra-gallery-zoom svg{width:26px;height:26px;fill:currentColor}

/* Keep titles available inside the lightbox only for a clean gallery grid. */
.integra-gallery-copy{display:none!important}

.integra-gallery-empty{
    padding:20px;
    border:1px dashed #c7a35e;
    border-radius:14px;
    background:#fffaf1;
}

.integra-lightbox{
    position:fixed!important;
    inset:0!important;
    width:100vw!important;
    height:100vh!important;
    height:100dvh!important;
    z-index:2147483647!important;
    display:none;
    align-items:center;
    justify-content:center;
    box-sizing:border-box;
    padding:30px 76px;
    overflow:hidden;
    isolation:isolate;
    background:#100e0d;
}
.integra-lightbox::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:-1;
    background:#100e0d;
}
.integra-lightbox.is-open{display:flex!important}
.integra-lightbox-stage{
    position:relative;
    z-index:2;
    width:auto;
    max-width:min(1100px,92vw);
    max-height:88dvh;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:15px;
}
.integra-lightbox-stage img{
    display:block;
    width:auto;
    height:auto;
    max-width:100%;
    max-height:78dvh;
    object-fit:contain;
    border-radius:18px;
    box-shadow:0 25px 90px rgba(0,0,0,.55);
}
.integra-lightbox-caption{color:#fff;text-align:center;display:flex;flex-direction:column;gap:5px;max-width:800px}
.integra-lightbox-caption strong{font-size:20px}.integra-lightbox-caption span{font-size:14px;opacity:.78}
.integra-lightbox-close,.integra-lightbox-nav{
    position:absolute!important;
    z-index:5!important;
    border:0;
    color:#fff;
    background:rgba(255,255,255,.14);
    cursor:pointer;
    transition:background .25s ease,transform .25s ease;
}
.integra-lightbox-close{top:20px;right:24px;width:48px;height:48px;border-radius:50%;font-size:34px;line-height:1}
.integra-lightbox-nav{top:50%;transform:translateY(-50%);width:50px;height:70px;border-radius:18px;font-size:28px}
.integra-lightbox-prev{left:18px}.integra-lightbox-next{right:18px}
.integra-lightbox-close:hover,.integra-lightbox-nav:hover{background:rgba(199,163,94,.88)}
html.integra-lightbox-open,
body.integra-lightbox-open{
    overflow:hidden!important;
    overscroll-behavior:none!important;
}
body.integra-lightbox-open{
    position:fixed!important;
    left:0!important;
    right:0!important;
    width:100%!important;
}

@media(max-width:1024px){
    .integra-medical-gallery{
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:12px;
    }
    .integra-gallery-item:nth-child(1),
    .integra-gallery-item:nth-child(2),
    .integra-gallery-item:nth-child(4),
    .integra-gallery-item:nth-child(5){
        grid-column:auto;
        grid-row:auto;
    }
    .integra-gallery-item:nth-child(3){
        grid-column:1 / -1;
        grid-row:auto;
        aspect-ratio:2 / 1;
    }
    .integra-gallery-trigger{border-radius:16px}
}

@media(max-width:640px){
    .integra-medical-gallery{
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:9px;
    }
    .integra-gallery-item:nth-child(3){aspect-ratio:16 / 10}
    .integra-gallery-trigger{border-radius:13px}
    .integra-gallery-overlay{padding:10px}
    .integra-gallery-zoom{width:44px;height:44px}
    .integra-gallery-zoom svg{width:22px;height:22px}
    .integra-lightbox{padding:70px 14px 20px}
    .integra-lightbox-nav{top:auto;bottom:18px;width:46px;height:46px;border-radius:50%;transform:none}
    .integra-lightbox-prev{left:calc(50% - 56px)}
    .integra-lightbox-next{right:calc(50% - 56px)}
}
