.mauve-instagram .ms-ig-item {
position: relative;
}
.mauve-instagram .ms-ig-item img {
display: block;
width: 100%;
height: auto;
} .ms-ig-ratio-square .ms-ig-item img   { aspect-ratio: 1 / 1;  object-fit: cover; }
.ms-ig-ratio-portrait .ms-ig-item img { aspect-ratio: 4 / 5;  object-fit: cover; }
.ms-ig-ratio-tall .ms-ig-item img     { aspect-ratio: 2 / 3;  object-fit: cover; }
.ms-ig-ratio-wide .ms-ig-item img     { aspect-ratio: 3 / 2;  object-fit: cover; }
.ms-ig-ratio-original .ms-ig-item img { aspect-ratio: auto;   object-fit: unset; height: auto; } .mauve-instagram .ms-ig-play {
position: absolute;
top: 10px;
right: 10px;
z-index: 3;
width: 34px;
height: 34px;
border-radius: 50%;
background: rgba(17, 19, 26, .55);
-webkit-backdrop-filter: blur(4px);
backdrop-filter: blur(4px);
pointer-events: none;
}
.mauve-instagram .ms-ig-play::before {
content: "";
position: absolute;
left: 13px;
top: 9px;
border-style: solid;
border-width: 8px 0 8px 12px;
border-color: transparent transparent transparent #fff;
} .ms-ig-collage {
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: center;
gap: var(--ms-ig-gap, 0px);
padding: 40px 0;
}
.ms-ig-collage .ms-ig-item {
width: 17%;
min-width: 150px;
margin: 0;
box-shadow: 0 22px 44px -20px rgba(0, 0, 0, .35);
background: #fff;
transition: transform .35s ease, box-shadow .35s ease;
will-change: transform;
}
.ms-ig-collage .ms-ig-item:nth-child(6n+1) { transform: translateY(28px) rotate(-4deg);  width: 16%; }
.ms-ig-collage .ms-ig-item:nth-child(6n+2) { transform: translateY(-20px) rotate(2.5deg); width: 20%; margin-left: -2%; }
.ms-ig-collage .ms-ig-item:nth-child(6n+3) { transform: translateY(36px) rotate(-2deg);  width: 15%; margin-left: -1.5%; }
.ms-ig-collage .ms-ig-item:nth-child(6n+4) { transform: translateY(-32px) rotate(3.5deg); width: 21%; margin-left: -2%; }
.ms-ig-collage .ms-ig-item:nth-child(6n+5) { transform: translateY(14px) rotate(-3deg);  width: 17%; margin-left: -1.5%; }
.ms-ig-collage .ms-ig-item:nth-child(6n+6) { transform: translateY(-12px) rotate(1.5deg); width: 14%; margin-left: -1%; }
.ms-ig-collage .ms-ig-item:hover {
transform: translateY(0) rotate(0) scale(1.05);
z-index: 5;
box-shadow: 0 30px 60px -22px rgba(0, 0, 0, .45);
}
@media (max-width: 767px) {
.ms-ig-collage {
padding: 24px 0;
}
.ms-ig-collage .ms-ig-item,
.ms-ig-collage .ms-ig-item:nth-child(n) {
width: 38%;
min-width: 130px;
margin-left: 0;
}
} .ms-ig-marquee {
--ms-ig-gap: 18px;
--ms-ig-size: 300px;
position: relative;
display: flex;
overflow: hidden;
width: 100%;
} .ms-ig-marquee.ms-ig-has-fade::before,
.ms-ig-marquee.ms-ig-has-fade::after {
content: "";
position: absolute;
top: 0;
bottom: 0;
width: var(--ms-ig-fade-w, 120px);
z-index: 2;
pointer-events: none;
}
.ms-ig-marquee.ms-ig-has-fade::before {
left: 0;
background: linear-gradient(to right, var(--ms-ig-fade-color, #fff), transparent);
}
.ms-ig-marquee.ms-ig-has-fade::after {
right: 0;
background: linear-gradient(to left, var(--ms-ig-fade-color, #fff), transparent);
}
.ms-ig-marquee .ms-ig-track {
display: flex;
width: max-content;
animation: ms-ig-scroll var(--ms-ig-duration, 35s) linear infinite;
} .ms-ig-marquee .ms-ig-half {
display: flex;
flex: 0 0 auto;
gap: var(--ms-ig-gap);
padding-right: var(--ms-ig-gap);
}
.ms-ig-marquee .ms-ig-item {
flex: 0 0 auto;
width: var(--ms-ig-size);
margin: 0;
}
.ms-ig-marquee:hover .ms-ig-track {
animation-play-state: paused;
}
.rtl .ms-ig-marquee .ms-ig-track {
animation-direction: reverse;
}
@keyframes ms-ig-scroll {
to { transform: translateX(-50%); }
}
@media (max-width: 767px) {
.ms-ig-marquee {
--ms-ig-size: 220px;
--ms-ig-gap: 12px;
}
}
@media (prefers-reduced-motion: reduce) {
.ms-ig-marquee {
overflow-x: auto;
}
.ms-ig-marquee .ms-ig-track {
animation: none;
}
.ms-ig-marquee .ms-ig-half[aria-hidden] {
display: none;
}
} .ms-ig-video-pop {
position: relative;
max-width: 860px;
margin: 0 auto;
}
.ms-ig-video-pop video {
display: block;
width: 100%;
max-height: 80vh;
background: #000;
}
.ms-ig-video-pop .ms-ig-pop-caption {
padding: 10px 2px;
font-size: 13px;
color: #f3f4f6;
}
.ms-ig-mfp .mfp-title a.ms-ig-open,
.ms-ig-video-pop .ms-ig-pop-caption a.ms-ig-open {
color: #fff;
text-decoration: underline;
white-space: nowrap;
}