/*
 * Lenzzberry — Instagram feed styles (v2 — premium UI refresh).
 *
 * Design notes (driven by https://spotlightwp.com patterns + brand fit):
 *   - Brand pink (#FF6F91) is the dominant accent, NOT IG pink, so the feed
 *     blends into the footer cream palette instead of fighting it.
 *   - The only IG-pink moment is the small camera glyph next to the @handle.
 *   - Cards are tightly spaced (4px gap) for an editorial mosaic feel rather
 *     than the airy 8-12px grid that screams "plugin default".
 *   - Each image fades in over 0.32s after load, with a shimmer placeholder
 *     while loading — this is the single biggest "premium" perceptual win.
 *   - Hover uses a teal gradient floor (not a flat wash) so caption/icon
 *     contrast is high without visually crushing the image.
 *
 * Theme tokens are injected inline via lenzzberry_ig_inline_vars().
 */

.lenzz-ig {
	--lz-ig-cols-d: 6;
	--lz-ig-cols-t: 4;
	--lz-ig-cols-m: 2;
	--lz-ig-gap: 4px;
	--lz-ig-ratio: 1 / 1;
	--lz-ig-accent: #FF6F91;            /* Brand pink */
	--lz-ig-accent-soft: rgba(255, 111, 145, 0.08);
	--lz-ig-btn-text: #fff;
	--lz-ig-clamp: 2;
	--lz-ig-spv: 4;
	--lz-ig-bg: #FFF6F4;                /* cream — sits naturally above the dark footer */
	--lz-ig-text: #1F2937;
	--lz-ig-tile-bg: #eee;              /* neutral so partial loads / letterboxing don't show white */

	background: var(--lz-ig-bg);
	color: var(--lz-ig-text);
	box-sizing: border-box;
	padding: clamp(28px, 5vw, 56px) clamp(16px, 5vw, 56px);
	width: 100%;
}

.lenzz-ig *,
.lenzz-ig *::before,
.lenzz-ig *::after { box-sizing: border-box; }

/* ---- Header (centered, editorial) ----------------------------------- */
.lenzz-ig-header {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 6px;
	margin: 0 auto clamp(20px, 3vw, 36px);
	max-width: 640px;
}
.lenzz-ig-header-text {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 4px;
	min-width: 0;
}
.lenzz-ig-title {
	margin: 0;
	font-size: clamp(20px, 2.6vw, 28px);
	font-weight: 700;
	letter-spacing: -0.015em;
	line-height: 1.15;
	color: inherit;
}
.lenzz-ig-subtitle {
	margin: 2px 0 0;
	opacity: 0.7;
	font-size: 0.95em;
	line-height: 1.45;
}
.lenzz-ig-handle {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-top: 6px;
	font-size: 0.95em;
	font-weight: 600;
	color: var(--lz-ig-accent);
	text-decoration: none;
}
.lenzz-ig-handle::before {
	content: "";
	display: inline-block;
	width: 14px;
	height: 14px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23e1306c' opacity='0.85'%3E%3Cpath d='M12 2.16c3.2 0 3.58.01 4.85.07 1.17.05 1.8.25 2.23.41.56.22.96.48 1.38.9.42.42.68.82.9 1.38.16.42.36 1.06.41 2.23.06 1.27.07 1.64.07 4.85s-.01 3.58-.07 4.85c-.05 1.17-.25 1.8-.41 2.23-.22.56-.48.96-.9 1.38-.42.42-.82.68-1.38.9-.42.16-1.06.36-2.23.41-1.27.06-1.64.07-4.85.07s-3.58-.01-4.85-.07c-1.17-.05-1.8-.25-2.23-.41a3.71 3.71 0 0 1-1.38-.9 3.71 3.71 0 0 1-.9-1.38c-.16-.42-.36-1.06-.41-2.23-.06-1.27-.07-1.64-.07-4.85s.01-3.58.07-4.85c.05-1.17.25-1.8.41-2.23.22-.56.48-.96.9-1.38.42-.42.82-.68 1.38-.9.42-.16 1.06-.36 2.23-.41 1.27-.06 1.64-.07 4.85-.07M12 0C8.74 0 8.33.01 7.05.07 5.77.13 4.9.33 4.14.63a5.95 5.95 0 0 0-2.15 1.4A5.95 5.95 0 0 0 .59 4.18C.3 4.94.1 5.81.04 7.09-.02 8.37-.04 8.78-.04 12.04c0 3.26.02 3.67.08 4.95.06 1.28.26 2.15.55 2.91.31.79.72 1.46 1.4 2.14a5.95 5.95 0 0 0 2.14 1.4c.76.3 1.63.5 2.91.55C8.33 23.99 8.74 24 12 24c3.26 0 3.67-.01 4.95-.07 1.28-.06 2.15-.26 2.91-.55a5.95 5.95 0 0 0 2.14-1.4 5.95 5.95 0 0 0 1.4-2.14c.3-.76.5-1.63.55-2.91.06-1.28.07-1.69.07-4.95 0-3.26-.01-3.67-.07-4.95-.06-1.28-.26-2.15-.55-2.91a5.95 5.95 0 0 0-1.4-2.14A5.95 5.95 0 0 0 19.86.63C19.1.33 18.23.13 16.95.07 15.67.01 15.26 0 12 0Zm0 5.84a6.16 6.16 0 1 0 0 12.32 6.16 6.16 0 0 0 0-12.32ZM12 16a4 4 0 1 1 0-8 4 4 0 0 1 0 8Zm6.41-11.85a1.44 1.44 0 1 0 0 2.88 1.44 1.44 0 0 0 0-2.88Z'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-size: contain;
	flex-shrink: 0;
}
.lenzz-ig-handle:hover { text-decoration: underline; color: var(--lz-ig-accent); }

.lenzz-ig-follow {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-top: 14px;
	padding: 10px 22px;
	background: var(--lz-ig-accent);
	color: var(--lz-ig-btn-text);
	border-radius: 999px;
	font-size: 0.92em;
	font-weight: 700;
	letter-spacing: 0.01em;
	text-decoration: none;
	white-space: nowrap;
	box-shadow: 0 2px 8px rgba(255, 111, 145, 0.22);
	transition: transform 0.15s ease, filter 0.15s ease, box-shadow 0.15s ease;
}
.lenzz-ig-follow:hover {
	transform: translateY(-1px);
	filter: brightness(1.05);
	box-shadow: 0 4px 14px rgba(255, 111, 145, 0.3);
	color: var(--lz-ig-btn-text);
}
.lenzz-ig-follow svg { display: block; }

/* ---- Grid layout ---------------------------------------------------- */
.lenzz-ig-grid {
	display: grid;
	gap: var(--lz-ig-gap);
	grid-template-columns: repeat(var(--lz-ig-cols-d), minmax(0, 1fr));
}

/* ---- Slideshow layout ----------------------------------------------- */
.lenzz-ig-slider {
	position: relative;
	overflow: hidden;
}
.lenzz-ig-track {
	display: flex;
	gap: var(--lz-ig-gap);
	transition: transform 0.45s cubic-bezier(0.22, 0.61, 0.36, 1);
	will-change: transform;
}
.lenzz-ig-slider .lenzz-ig-card {
	flex: 0 0 calc((100% - var(--lz-ig-gap) * (var(--lz-ig-spv) - 1)) / var(--lz-ig-spv));
	min-width: 0;
}

.lenzz-ig-arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 2;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	border: none;
	background: rgba(255, 255, 255, 0.96);
	color: #222;
	font-size: 22px;
	line-height: 1;
	cursor: pointer;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.18);
	transition: transform 0.15s ease, background 0.15s ease;
}
.lenzz-ig-arrow:hover { transform: translateY(-50%) scale(1.05); background: #fff; }
.lenzz-ig-arrow:disabled { opacity: 0.4; cursor: default; }
.lenzz-ig-arrow--prev { left: 8px; }
.lenzz-ig-arrow--next { right: 8px; }

.lenzz-ig-dots {
	display: flex;
	justify-content: center;
	gap: 6px;
	margin-top: 14px;
}
.lenzz-ig-dots button {
	width: 8px;
	height: 8px;
	padding: 0;
	border: none;
	border-radius: 50%;
	background: rgba(0, 0, 0, 0.2);
	cursor: pointer;
	transition: background 0.15s ease, transform 0.15s ease;
}
.lenzz-ig-dots button[aria-current="true"] {
	background: var(--lz-ig-accent);
	transform: scale(1.25);
}

/* ---- Card ----------------------------------------------------------- */
.lenzz-ig-card {
	position: relative;
	display: block;
	text-decoration: none;
	color: inherit;
	background: var(--lz-ig-tile-bg);
	border-radius: 4px;
	overflow: hidden;
	isolation: isolate;
}
.lenzz-ig-card:hover { color: inherit; }

.lenzz-ig-media {
	position: relative;
	aspect-ratio: var(--lz-ig-ratio);
	overflow: hidden;
	background: var(--lz-ig-tile-bg);
}

/* Shimmer skeleton — visible until the <img> fires its load event. */
.lenzz-ig-media::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 0;
	background: linear-gradient(110deg, #e9e9e9 8%, #f3f3f3 18%, #e9e9e9 33%);
	background-size: 200% 100%;
	animation: lenzz-ig-shimmer 1.4s linear infinite;
	opacity: 1;
	transition: opacity 0.32s ease;
}
.lenzz-ig-media.is-loaded::before { opacity: 0; }

@keyframes lenzz-ig-shimmer {
	0%   { background-position: 200% 0; }
	100% { background-position: -200% 0; }
}

.lenzz-ig-media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	position: relative;
	z-index: 1;
	opacity: 0;
	transition: opacity 0.32s ease-out, transform 0.45s cubic-bezier(0.22, 0.61, 0.36, 1);
}
.lenzz-ig-media.is-loaded img { opacity: 1; }
.lenzz-ig-card:hover .lenzz-ig-media img { transform: scale(1.04); }

/* Video / Reel / Album affordance — translucent white pill, IG-native */
.lenzz-ig-badge {
	position: absolute;
	top: 8px;
	right: 8px;
	z-index: 3;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 24px;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.7);
	color: #222;
	backdrop-filter: blur(4px);
	-webkit-backdrop-filter: blur(4px);
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.18);
	pointer-events: none;
}
.lenzz-ig-badge svg { display: block; }
.lenzz-ig-badge--reel  { background: rgba(225, 48, 108, 0.92); color: #fff; }
.lenzz-ig-badge--video { background: rgba(0, 0, 0, 0.6); color: #fff; }

/* Hover overlay — soft ink wash so the white engagement stats stay legible
   over any photo, Instagram-native but tuned to the brand's ink tone. */
.lenzz-ig-overlay {
	position: absolute;
	inset: 0;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(46, 42, 51, 0.46);
	color: #fff;
	opacity: 0;
	transition: opacity 0.25s ease;
	pointer-events: none;
}
.lenzz-ig-card:hover .lenzz-ig-overlay,
.lenzz-ig-card:focus-visible .lenzz-ig-overlay { opacity: 1; }

/* Likes + comments row (real engagement pulled from the Graph API) */
.lenzz-ig-stats {
	display: flex;
	align-items: center;
	gap: clamp(10px, 1.4vw, 20px);
	font-weight: 700;
	font-size: clamp(0.8rem, 1.1vw, 0.95rem);
	letter-spacing: 0.01em;
	transform: translateY(6px);
	transition: transform 0.25s ease;
}
.lenzz-ig-card:hover .lenzz-ig-stats { transform: translateY(0); }
.lenzz-ig-stat {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	text-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
}
.lenzz-ig-stat svg { display: block; }
.lenzz-ig-stat:first-child svg { color: var(--lz-ig-accent); } /* pink heart, brand pop */

.lenzz-ig-overlay-icon svg { filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.4)); }

.lenzz-ig-caption {
	margin: 8px 0 0;
	font-size: 0.85em;
	line-height: 1.45;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: var(--lz-ig-clamp);
	line-clamp: var(--lz-ig-clamp);
	overflow: hidden;
}

.lenzz-ig-view-btn {
	display: inline-block;
	margin-top: 8px;
	padding: 6px 12px;
	border-radius: 4px;
	background: var(--lz-ig-accent);
	color: var(--lz-ig-btn-text);
	font-size: 0.8em;
	font-weight: 600;
	letter-spacing: 0.01em;
}

/* Featured / collab card with no uploaded image — branded tile linking out */
.lenzz-ig-media--ph { background: linear-gradient(135deg, #FF9FB8 0%, #FF6F91 45%, #C9B8F0 100%); }
.lenzz-ig-ph {
	position: absolute;
	inset: 0;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 14px;
	text-align: center;
	color: #fff;
}
.lenzz-ig-ph svg { opacity: 0.95; filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.2)); }
.lenzz-ig-ph-cap {
	font-style: normal;
	font-size: 0.8em;
	font-weight: 600;
	line-height: 1.35;
	max-width: 92%;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	line-clamp: 3;
	overflow: hidden;
	text-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
}

/* ---- Responsive ----------------------------------------------------- */
@media (max-width: 980px) {
	.lenzz-ig-grid { grid-template-columns: repeat(var(--lz-ig-cols-t), minmax(0, 1fr)); }
	.lenzz-ig-slider .lenzz-ig-card {
		flex-basis: calc((100% - var(--lz-ig-gap) * (min(var(--lz-ig-spv), 3) - 1)) / min(var(--lz-ig-spv), 3));
	}
}
@media (max-width: 600px) {
	.lenzz-ig { padding: 28px 14px; }
	.lenzz-ig-grid { grid-template-columns: repeat(var(--lz-ig-cols-m), minmax(0, 1fr)); }
	.lenzz-ig-slider .lenzz-ig-card {
		flex-basis: calc((100% - var(--lz-ig-gap) * (min(var(--lz-ig-spv), 2) - 1)) / min(var(--lz-ig-spv), 2));
	}
	.lenzz-ig-arrow { width: 34px; height: 34px; font-size: 18px; }
	.lenzz-ig-follow { padding: 9px 18px; font-size: 0.88em; }
}

/* When embedded INSIDE the footer (below_cols position), pull padding in
   so the section doesn't overpower the surrounding footer content. */
.lenzz-footer .lenzz-ig {
	padding-top: 16px;
	padding-bottom: 28px;
	background: transparent;
}

/* ===================================================================== */
/*  Reels row layout — horizontal strip of tall 9:16 video cards          */
/* ===================================================================== */
.lenzz-ig--reels .lenzz-ig-reels-wrap { position: relative; }

.lenzz-ig-reels-row {
	display: flex;
	gap: 14px;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-padding: 0 4px;
	padding: 4px 2px 12px;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;               /* Firefox */
}
.lenzz-ig-reels-row::-webkit-scrollbar { display: none; } /* WebKit */

.lenzz-ig--reels .lenzz-ig-card {
	flex: 0 0 clamp(150px, 42vw, 216px);
	scroll-snap-align: start;
	border-radius: 16px;
	background: var(--lz-ig-tile-bg);
	cursor: pointer;
	box-shadow: 0 4px 16px rgba(31, 41, 55, 0.08);
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.lenzz-ig--reels .lenzz-ig-card:hover {
	transform: translateY(-3px);
	box-shadow: 0 10px 26px rgba(255, 111, 145, 0.22);
}
.lenzz-ig--reels .lenzz-ig-media {
	aspect-ratio: 9 / 16;              /* Reels are portrait — no square cropping */
	border-radius: 16px;
}
.lenzz-ig--reels .lenzz-ig-media img { border-radius: 16px; }

/* Center play button */
.lenzz-ig-play {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 3;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 52px;
	height: 52px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.92);
	color: #1F2937;
	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.28);
	padding-left: 3px;                 /* optically centre the triangle */
	pointer-events: none;
	transition: transform 0.2s ease, background 0.2s ease;
}
.lenzz-ig--reels .lenzz-ig-card:hover .lenzz-ig-play {
	transform: translate(-50%, -50%) scale(1.08);
	background: #fff;
}

/* Branded gradient footer overlaid on each Reel card (avatar + @handle + time) */
.lenzz-ig--reels .lenzz-ig-badge { display: none; } /* play button + footer say enough */

.lenzz-ig-card-foot {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 4;
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 30px 11px 11px;
	background: linear-gradient(to top, rgba(0,0,0,0.74) 0%, rgba(0,0,0,0.34) 46%, rgba(0,0,0,0) 100%);
	color: #fff;
	pointer-events: none;
}
.lenzz-ig-avatar {
	flex: 0 0 auto;
	width: 27px;
	height: 27px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	/* background-color is set per-creator inline; this gloss overlays it. */
	background-color: var(--lz-ig-accent);
	background-image: linear-gradient(145deg, rgba(255, 255, 255, 0.3), rgba(0, 0, 0, 0.08));
	color: #fff;
	font-size: 12px;
	font-weight: 800;
	line-height: 1;
	text-shadow: 0 1px 1px rgba(0, 0, 0, 0.25);
	box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.95), 0 2px 5px rgba(0, 0, 0, 0.28);
}
.lenzz-ig-foot-meta {
	display: flex;
	flex-direction: column;
	min-width: 0;
	line-height: 1.2;
}
.lenzz-ig-foot-name {
	font-size: 12.5px;
	font-weight: 700;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	text-shadow: 0 1px 3px rgba(0,0,0,0.45);
}
.lenzz-ig-foot-time {
	font-size: 10.5px;
	font-weight: 500;
	opacity: 0.85;
	text-shadow: 0 1px 2px rgba(0,0,0,0.45);
}
.lenzz-ig-foot-glyph {
	margin-left: auto;
	flex: 0 0 auto;
	color: #fff;
	opacity: 0.92;
	filter: drop-shadow(0 1px 2px rgba(0,0,0,0.45));
}
.lenzz-ig-foot-glyph svg { display: block; }

/* Reels header — store avatar + title on the left, Follow button on the right */
.lenzz-ig--reels .lenzz-ig-header {
	flex-direction: row;
	align-items: center;
	justify-content: flex-start;
	text-align: left;
	max-width: none;
	gap: 14px;
}
.lenzz-ig--reels .lenzz-ig-header-text { align-items: flex-start; }
.lenzz-ig--reels .lenzz-ig-handle { margin-top: 2px; }
.lenzz-ig--reels .lenzz-ig-follow { margin-top: 0; margin-left: auto; }

.lenzz-ig-head-avatar {
	flex: 0 0 auto;
	width: 54px;
	height: 54px;
	border-radius: 50%;
	overflow: hidden;
	display: block;
	background: #eee;
	box-shadow: 0 0 0 2px #fff, 0 3px 10px rgba(255, 111, 145, 0.28);
}
.lenzz-ig-head-avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }

@media (max-width: 600px) {
	.lenzz-ig--reels .lenzz-ig-header { flex-wrap: wrap; gap: 10px 12px; }
	.lenzz-ig-head-avatar { width: 44px; height: 44px; }
	/* On phones, let the Follow button drop to its own full row under the title. */
	.lenzz-ig--reels .lenzz-ig-follow { margin-left: 0; }
	.lenzz-ig--reels .lenzz-ig-header-text { flex: 1 1 auto; min-width: 0; }
}

/* Prev / next scroll buttons (desktop; hidden by JS when nothing to scroll) */
.lenzz-ig-reels-nav {
	position: absolute;
	top: calc(50% - 16px);
	transform: translateY(-50%);
	z-index: 4;
	width: 42px;
	height: 42px;
	border: none;
	border-radius: 50%;
	background: #fff;
	color: #1F2937;
	font-size: 22px;
	line-height: 1;
	cursor: pointer;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.16);
	transition: transform 0.15s ease, opacity 0.15s ease;
}
.lenzz-ig-reels-nav:hover { transform: translateY(-50%) scale(1.06); }
.lenzz-ig-reels-nav:disabled { opacity: 0.35; cursor: default; }
.lenzz-ig-reels-nav--prev { left: -6px; }
.lenzz-ig-reels-nav--next { right: -6px; }
@media (max-width: 600px) {
	.lenzz-ig-reels-nav { display: none !important; } /* touch users swipe */
}

/* ===================================================================== */
/*  Lightbox — plays the Instagram post inline (no external script)       */
/* ===================================================================== */
html.lenzz-ig-noscroll { overflow: hidden; }

.lenzz-ig-lightbox { display: none; }
.lenzz-ig-lightbox:not([hidden]) {
	display: flex;
	position: fixed;
	inset: 0;
	z-index: 100000;
	align-items: center;
	justify-content: center;
	padding: 16px;
	animation: lenzz-ig-fade 0.2s ease;
}
@keyframes lenzz-ig-fade { from { opacity: 0; } to { opacity: 1; } }

.lenzz-ig-lightbox-backdrop {
	position: absolute;
	inset: 0;
	background: rgba(20, 16, 22, 0.82);
	backdrop-filter: blur(3px);
	-webkit-backdrop-filter: blur(3px);
}
.lenzz-ig-lightbox-inner {
	position: relative;
	z-index: 1;
	width: clamp(280px, 92vw, 400px);
}
.lenzz-ig-lightbox-frame {
	position: relative;
	width: 100%;
	height: min(84vh, 720px);
	background: #000;
	border-radius: 14px;
	overflow: hidden;
	box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
}
.lenzz-ig-lightbox-frame iframe {
	width: 100%;
	height: 100%;
	border: 0;
	display: block;
	background: #fff;
}
.lenzz-ig-lightbox-close {
	position: fixed;          /* pinned to the screen corner — always visible */
	top: 14px;
	right: 14px;
	z-index: 3;
	width: 42px;
	height: 42px;
	border: none;
	border-radius: 50%;
	background: rgba(0, 0, 0, 0.55);
	color: #fff;
	font-size: 26px;
	line-height: 1;
	cursor: pointer;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.45);
	transition: background 0.15s ease, transform 0.15s ease;
}
.lenzz-ig-lightbox-close:hover { background: rgba(0, 0, 0, 0.78); transform: scale(1.05); }
@media (max-width: 600px) {
	/* Shorter video on phones so the reel + Follow button + close all fit. */
	.lenzz-ig-lightbox-frame { height: 78vh; }
}

/* Our own "Follow the store" CTA under the reel (the embed's own buttons point
   at the original poster and are inside a cross-origin iframe we can't touch). */
.lenzz-ig-lightbox-follow {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	margin-top: 12px;
	padding: 11px 18px;
	width: 100%;
	background: var(--lz-ig-accent, #FF6F91);
	color: #fff;
	border-radius: 999px;
	font-size: 14px;
	font-weight: 700;
	text-decoration: none;
	box-shadow: 0 6px 18px rgba(255, 111, 145, 0.35);
	transition: transform 0.15s ease, filter 0.15s ease;
}
.lenzz-ig-lightbox-follow:hover { transform: translateY(-1px); filter: brightness(1.05); color: #fff; }
.lenzz-ig-lightbox-follow svg { display: block; }

/* Accessibility — respect motion preferences */
@media (prefers-reduced-motion: reduce) {
	.lenzz-ig-media::before { animation: none; }
	.lenzz-ig-media img { transition: opacity 0.2s ease; }
	.lenzz-ig-card:hover .lenzz-ig-media img { transform: none; }
	.lenzz-ig-follow:hover { transform: none; }
	.lenzz-ig--reels .lenzz-ig-card:hover { transform: none; }
	.lenzz-ig-lightbox:not([hidden]) { animation: none; }
}