/* Half Skull — Instagram carousel v2: 4:5 tiles, autoplay reels, arrows, lightbox. */

.hs-ig2 {
	position: relative;
	padding: 16px 0;
	border-radius: 30px;
	background: #fff;
	box-shadow: 0 0 0 1px rgba(19, 19, 22, .06), 0 14px 40px rgba(19, 19, 22, .12);
}
.hs-ig2__track {
	list-style: none;
	margin: 0;
	padding: 6px 18px 14px;
	display: flex;
	gap: 14px;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-padding: 0 18px;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
	cursor: grab;
}
.hs-ig2__track::-webkit-scrollbar { display: none; }
.hs-ig2__track.is-dragging { cursor: grabbing; scroll-snap-type: none; }

.hs-ig2__tile { position: relative; flex: 0 0 calc((100% - 36px - 3 * 14px) / 4); min-width: 0; scroll-snap-align: start; }
@media (max-width: 991px) { .hs-ig2__tile { flex-basis: 38%; } }
@media (max-width: 640px) { .hs-ig2__tile { flex-basis: 66%; } .hs-ig2 { margin: 0 12px; border-radius: 24px; } .hs-ig2__track { padding: 4px 12px 12px; gap: 10px; } }

.hs-ig2__open {
	position: relative;
	display: block;
	width: 100%;
	aspect-ratio: 4 / 5;
	padding: 0;
	border: 0;
	border-radius: 22px;
	overflow: hidden;
	background: #ece8e3;
	cursor: pointer;
	box-shadow: 0 8px 22px rgba(19, 19, 22, .18);
	transition: transform .3s cubic-bezier(.2, .8, .2, 1), box-shadow .3s;
}
.hs-ig2__tile:hover .hs-ig2__open { transform: translateY(-6px) rotate(-.5deg); box-shadow: 0 20px 44px rgba(19, 19, 22, .32); }
.hs-ig2__open img,
.hs-ig2__open video { width: 100%; height: 100%; object-fit: cover; display: block; pointer-events: none; transition: transform .7s cubic-bezier(.2, .8, .2, 1); }
.hs-ig2__tile:hover .hs-ig2__open img,
.hs-ig2__tile:hover .hs-ig2__open video { transform: scale(1.06); }

.hs-ig2__badge { position: absolute; top: 10px; left: 10px; padding: 5px 11px; border-radius: 999px; background: rgba(19, 19, 22, .72); backdrop-filter: blur(6px); color: #fff; font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.hs-ig2__veil { position: absolute; inset: 0; display: flex; align-items: flex-end; padding: 14px; background: linear-gradient(180deg, rgba(19, 19, 22, 0) 45%, rgba(19, 19, 22, .78) 100%); opacity: 0; transition: opacity .25s; text-align: left; }
.hs-ig2__veil span { color: #fff; font-size: 13px; font-weight: 600; line-height: 1.35; }
.hs-ig2__tile:hover .hs-ig2__veil { opacity: 1; }
@media (hover: none) { .hs-ig2__veil { display: none; } }

.hs-ig2__sound { position: absolute; right: 10px; bottom: 10px; width: 38px; height: 38px; border: 0; border-radius: 50%; background: rgba(19, 19, 22, .72); backdrop-filter: blur(6px); color: #fff; display: flex; align-items: center; justify-content: center; cursor: pointer; z-index: 2; transition: background .2s, transform .2s; }
.hs-ig2__sound:hover { transform: scale(1.08); }
.hs-ig2__sound .hs-ig2__waves { opacity: 0; transition: opacity .2s; }
.hs-ig2__sound.is-on { background: #e3001c; }
.hs-ig2__sound.is-on .hs-ig2__waves { opacity: 1; }

.hs-ig2__arrow { position: absolute; top: 50%; transform: translateY(-50%); z-index: 3; width: 46px; height: 46px; border: 0; border-radius: 50%; background: #fff; color: #131316; font-size: 28px; line-height: 1; cursor: pointer; box-shadow: 0 8px 22px rgba(19, 19, 22, .28); transition: transform .2s, opacity .2s; }
.hs-ig2__arrow:hover:not(:disabled) { transform: translateY(-50%) scale(1.08); }
.hs-ig2__arrow:disabled { opacity: 0; pointer-events: none; }
.hs-ig2__arrow.is-prev { left: -14px; }
.hs-ig2__arrow.is-next { right: -14px; }
@media (max-width: 640px) { .hs-ig2__arrow { display: none; } }

/* ---------- lightbox ---------- */
.hs-ig2lb { position: fixed; inset: 0; z-index: 100002; display: flex; align-items: center; justify-content: center; padding: 14px; opacity: 0; transition: opacity .25s; }
.hs-ig2lb[hidden] { display: none; }
.hs-ig2lb.is-open { opacity: 1; }
.hs-ig2lb__scrim { position: absolute; inset: 0; background: rgba(19, 19, 22, .82); }
.hs-ig2lb__panel { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; grid-template-areas: 'prev media next' 'info info info'; align-items: center; gap: 10px 12px; width: min(560px, 100%); max-height: 96vh; padding: 16px; border-radius: 28px; background: #fff; box-shadow: 0 30px 80px rgba(0, 0, 0, .5); }
.hs-ig2lb__media { grid-area: media; aspect-ratio: 4 / 5; max-height: 66vh; border-radius: 20px; overflow: hidden; background: #131316; }
.hs-ig2lb__media img, .hs-ig2lb__media video { width: 100%; height: 100%; object-fit: contain; display: block; background: #131316; }
.hs-ig2lb__nav { width: 40px; height: 40px; border: 0; border-radius: 50%; background: #f6f3ef; font-size: 26px; line-height: 1; cursor: pointer; box-shadow: 0 4px 12px rgba(19, 19, 22, .18); }
.hs-ig2lb__nav.is-prev { grid-area: prev; }
.hs-ig2lb__nav.is-next { grid-area: next; }
.hs-ig2lb__info { grid-area: info; text-align: center; }
.hs-ig2lb__count { margin: 4px 0; font-size: 12px; font-weight: 800; letter-spacing: .08em; color: #8a858f; }
.hs-ig2lb__cap { margin: 0 0 10px; font-size: 14px; line-height: 1.5; color: #2c2830; }
.hs-ig2lb__btns { display: flex; justify-content: center; gap: 10px; flex-wrap: wrap; }
.hs-ig2lb__btn { padding: 12px 20px; border-radius: 999px; border: 2px solid #131316; background: #fff; color: #131316 !important; font-weight: 800; font-size: 13px; text-decoration: none !important; }
.hs-ig2lb__btn.is-primary { background: #e3001c; border-color: #e3001c; color: #fff !important; box-shadow: 3px 3px 0 #131316; }
.hs-ig2lb__x { position: absolute; top: -12px; right: -6px; width: 38px; height: 38px; border: 0; border-radius: 50%; background: #131316; color: #fff; font-size: 22px; line-height: 1; cursor: pointer; z-index: 2; box-shadow: 0 6px 16px rgba(0, 0, 0, .4); }
@media (max-width: 520px) {
	.hs-ig2lb__panel { grid-template-columns: minmax(0, 1fr); grid-template-areas: 'media' 'info'; padding: 12px; border-radius: 22px; }
	.hs-ig2lb__nav { position: absolute; top: 40%; z-index: 2; background: rgba(255, 255, 255, .9); }
	.hs-ig2lb__nav.is-prev { left: 4px; }
	.hs-ig2lb__nav.is-next { right: 4px; }
}

@media (prefers-reduced-motion: reduce) {
	.hs-ig2__open, .hs-ig2__open img, .hs-ig2__open video, .hs-ig2__arrow, .hs-ig2lb { transition: none; }
}