/* Instagram drag carousel (Spacevibes Core) */
.sv-ig { --sv-ig-gap: var(--sv-gap, 24px); --sv-ig-ink: var(--wp--preset--color--ink, #22262C); position: relative; }
.sv-ig__viewport { position: relative; touch-action: pan-y; overflow-x: clip; }
/* JS widens the viewport to the screen edges (cards bleed past the grid) while clipping at the screen, so the page never scrolls sideways */
.sv-ig .sv-ig__track { display: flex; gap: var(--sv-ig-gap); margin: 0; padding: 0 !important; list-style: none; will-change: transform; max-width: none !important; }
.sv-ig__item { flex: 0 0 clamp(240px, 26vw, 340px); margin: 0 !important; max-width: none !important; }
.sv-ig__post { position: relative; display: block; aspect-ratio: 4 / 5; overflow: hidden; border-radius: 4px; background: var(--wp--preset--color--lavender, #F6F5F7); color: #fff; text-decoration: none; user-select: none; -webkit-user-drag: none; }
.sv-ig__post img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .6s cubic-bezier(.2, .7, .2, 1); pointer-events: none; }
.sv-ig__post:hover img { transform: scale(1.03); }
.sv-ig__post:focus-visible { outline: 2px solid var(--wp--preset--color--primary, #133DD3); outline-offset: 3px; }
.sv-ig__meta { position: absolute; left: 0; right: 0; bottom: 0; padding: 64px 16px 16px; font-size: 14px; line-height: 20px; color: var(--wp--preset--color--aqua, #7CE6DF);
	/* strong ink scrim so the text stays readable on light photos (contrast 6:1 or better) */
	background: linear-gradient(to bottom, rgba(34, 38, 44, 0) 0%, rgba(34, 38, 44, .72) 40%, rgba(34, 38, 44, .9) 100%);
	opacity: 0; transform: translateY(8px); transition: opacity .25s, transform .25s; }
.sv-ig__meta b { display: block; font-weight: 600; color: var(--wp--preset--color--mint, #F2FDFC); font-size: 16px; line-height: 24px; }
.sv-ig__post:hover .sv-ig__meta, .sv-ig__post:focus-visible .sv-ig__meta { opacity: 1; transform: none; }
@media (hover: none) { .sv-ig__meta { opacity: 1; transform: none; } }
.sv-ig__badge, .sv-ig__type { position: absolute; top: 12px; font-size: 12px; line-height: 16px; font-weight: 600; border-radius: 999px; padding: 4px 10px; }
.sv-ig__badge { left: 12px; background: #fff; color: var(--sv-ig-ink); }
.sv-ig__type { right: 12px; background: rgba(0, 0, 0, .55); color: #fff; }

.sv-ig__cursor { position: fixed; left: 0; top: 0; width: 88px; height: 88px; margin: -44px 0 0 -44px; border-radius: 50%; background: var(--sv-ig-ink); color: #fff; display: grid; place-items: center; font-size: 14px; line-height: 20px; font-weight: 600; pointer-events: none; z-index: 40; transform: scale(0); transition: transform .2s ease, background-color .2s ease; }
.sv-ig__cursor span { display: flex; align-items: center; gap: 6px; }
.sv-ig__cursor svg { width: 14px; height: 14px; }
.sv-ig.is-scrollable .sv-ig__viewport { cursor: none; }
.sv-ig.is-scrollable.is-hover .sv-ig__cursor { transform: scale(1); }
.sv-ig.is-dragging .sv-ig__cursor { transform: scale(.8); background: var(--wp--preset--color--primary, #133DD3); }
@media (hover: none) { .sv-ig__cursor { display: none; } .sv-ig.is-scrollable .sv-ig__viewport { cursor: auto; } }

.sv-ig__foot { display: flex; align-items: center; gap: 24px; margin-top: 32px; }
.sv-ig__progress { flex: 1; height: 2px; background: var(--wp--preset--color--line, #E2E4E8); position: relative; overflow: hidden; }
.sv-ig__progress i { position: absolute; top: 0; bottom: 0; left: 0; width: 100%; background: var(--sv-ig-ink); }
.sv-ig__nav { all: unset; box-sizing: border-box; cursor: pointer; width: 48px; height: 48px; border: 1px solid var(--sv-ig-ink); border-radius: 50%; display: grid; place-items: center; color: var(--sv-ig-ink); transition: background-color .2s, color .2s; }
.sv-ig__nav svg { width: 20px; height: 20px; }
.sv-ig__nav:hover { background: var(--sv-ig-ink); color: #fff; }
.sv-ig__nav:focus-visible { outline: 2px solid var(--wp--preset--color--primary, #133DD3); outline-offset: 2px; }
.sv-ig__nav[disabled] { opacity: .3; pointer-events: none; }
.sv-ig:not(.is-scrollable) .sv-ig__foot { display: none; }

@media (max-width: 599px) { .sv-ig__item { flex-basis: 78%; } }
@media (prefers-reduced-motion: reduce) { .sv-ig__post img, .sv-ig__meta { transition: none; } }
