.gga-gallery {
	--gga-accent: #fb8d00;
	--gga-gap: 14px;
	--gga-radius: 12px;
	--gga-ratio: 2/1;
	--gga-cols-mobile: 1;
	--gga-cols-tablet: 2;
	--gga-cols-desktop: 3;
	width: 100%;
	max-width: 1280px;
	margin-inline: auto;
	padding: 32px 20px 42px;
	font-family: inherit;
	color: inherit;
}

.gga-gallery,
.gga-gallery * { box-sizing: border-box; }

/* Filter controls deliberately retain the original widget design. */
.gga-filters {
	display: flex;
	align-items: center;
	gap: 10px;
	width: 100%;
	margin: 0 0 20px;
	padding: 2px 1px 8px;
	overflow-x: auto;
	scrollbar-width: thin;
	-webkit-overflow-scrolling: touch;
}

.gga-filter {
	display: inline-flex;
	flex: 0 0 auto;
	align-items: center;
	justify-content: center;
	gap: 9px;
	min-height: 44px;
	padding: 10px 18px;
	border: 1px solid #d9dce1;
	border-radius: 999px;
	background: #fff;
	color: #17191d;
	font: inherit;
	font-size: 14px;
	font-weight: 500;
	line-height: 1;
	cursor: pointer;
	transition: color .2s ease, background .2s ease, border-color .2s ease, transform .2s ease, box-shadow .2s ease;
}

.gga-filter svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.gga-filter:hover { border-color: var(--gga-accent); transform: translateY(-1px); }
.gga-filter.is-active { border-color: var(--gga-accent); background: var(--gga-accent); color: #fff; box-shadow: 0 5px 16px rgba(251,141,0,.22); }
.gga-filter:focus-visible,
.gga-card-button:focus-visible,
.gga-lightbox button:focus-visible { outline: 3px solid var(--gga-accent); outline-offset: 3px; }

.gga-grid {
	display: grid;
	grid-template-columns: repeat(var(--gga-cols-mobile), minmax(0, 1fr));
	gap: var(--gga-gap);
	width: 100%;
}

.gga-card {
	position: relative;
	min-width: 0;
	margin: 0 !important;
	overflow: hidden;
	border: 0;
	border-radius: var(--gga-radius);
	background: #eef0f2;
	box-shadow: 0 2px 9px rgba(16,24,40,.12);
	isolation: isolate;
}

.gga-card[hidden] { display: none; }

/* Isolate the internal media trigger from Elementor's global orange button style. */
.gga-gallery .gga-card-button {
	all: unset !important;
	box-sizing: border-box !important;
	position: relative !important;
	display: block !important;
	width: 100% !important;
	aspect-ratio: var(--gga-ratio) !important;
	margin: 0 !important;
	padding: 0 !important;
	overflow: hidden !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	cursor: zoom-in !important;
}

.gga-gallery .gga-card-button::before,
.gga-gallery .gga-card-button::after { content: none !important; display: none !important; }

.gga-card-image {
	position: absolute !important;
	inset: 0 !important;
	display: block !important;
	width: 100% !important;
	height: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	object-fit: cover !important;
	object-position: center center;
	transition: transform .35s ease;
}
.gga-card-video-preview { position: absolute !important; inset: 0 !important; display: block !important; width: 100% !important; height: 100% !important; max-width: none !important; margin: 0 !important; border: 0 !important; border-radius: 0 !important; background: #070a10; object-fit: cover !important; pointer-events: none; }

.gga-card:hover .gga-card-image { transform: scale(1.025); }

.gga-album-card::after,
.gga-video-card::after {
	content: '';
	position: absolute;
	z-index: 2;
	inset: auto 0 0;
	height: 56%;
	background: linear-gradient(to top,rgba(5,8,12,.82),rgba(5,8,12,0));
	pointer-events: none;
}

.gga-album-caption {
	position: absolute;
	z-index: 4;
	right: 14px;
	bottom: 13px;
	left: 14px;
	display: flex;
	min-width: 0;
	align-items: flex-end;
	justify-content: space-between;
	gap: 12px;
	color: #fff;
	font-style: normal;
	line-height: 1.2;
	pointer-events: none;
}
.gga-album-caption strong { overflow: hidden; font-size: 15px; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
.gga-album-caption span { flex: 0 0 auto; font-size: 12px; opacity: .82; }

.gga-album-open {
	position: absolute;
	z-index: 3;
	top: 12px;
	right: 12px;
	display: grid;
	width: 38px;
	height: 38px;
	border: 1px solid rgba(255,255,255,.7);
	border-radius: 50%;
	background: rgba(5,8,12,.54);
	color: #fff;
	box-shadow: 0 5px 16px rgba(0,0,0,.22);
	place-items: center;
	pointer-events: none;
}
.gga-album-open svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.7; }
.gga-video-card .gga-card-button { cursor: pointer !important; }
.gga-video-card .gga-play { width: 50px; height: 50px; }

.gga-card-label {
	position: absolute;
	z-index: 4;
	top: 8px;
	left: 8px;
	max-width: calc(100% - 16px);
	margin: 0;
	padding: 6px 9px;
	overflow: hidden;
	border: 1px solid rgba(0,0,0,.08);
	border-radius: 5px;
	background: rgba(255,255,255,.95);
	box-shadow: 0 2px 7px rgba(0,0,0,.12);
	color: #16181c;
	font-size: 11px;
	font-weight: 500;
	font-style: normal;
	line-height: 1.1;
	text-overflow: ellipsis;
	white-space: nowrap;
	pointer-events: none;
}

.gga-video-placeholder {
	display: grid;
	width: 100%;
	height: 100%;
	min-height: 150px;
	background: linear-gradient(135deg,#151f36,#283550);
	color: rgba(255,255,255,.28);
	place-items: center;
}
.gga-video-placeholder svg { width: 64px; height: 64px; fill: none; stroke: currentColor; stroke-width: 1.2; }
.gga-play {
	position: absolute;
	z-index: 3;
	top: 50%;
	left: 50%;
	display: grid;
	width: 54px;
	height: 54px;
	border: 3px solid #fff;
	border-radius: 50%;
	background: rgba(5,8,12,.52);
	color: #fff;
	box-shadow: 0 8px 24px rgba(0,0,0,.30);
	place-items: center;
	transform: translate(-50%,-50%);
	pointer-events: none;
}
.gga-play svg { width: 25px; height: 25px; margin-left: 3px; fill: currentColor; }

.gga-empty { grid-column: 1/-1; display: flex; min-height: 220px; flex-direction: column; align-items: center; justify-content: center; gap: 10px; padding: 32px; border: 1px dashed #cfd4dc; border-radius: var(--gga-radius); background: #fafafa; color: #5d6470; text-align: center; }
.gga-empty[hidden] { display: none !important; }
.gga-empty svg { width: 42px; height: 42px; fill: none; stroke: var(--gga-accent); stroke-width: 1.5; }
.gga-empty p { margin: 0; }

.gga-lightbox[hidden],
.gga-lightbox-image[hidden],
.gga-lightbox-video[hidden] { display: none !important; }
.gga-lightbox {
	position: fixed;
	z-index: 999999;
	inset: 0;
	display: block;
	padding: 0;
	background: radial-gradient(circle at 50% 38%,#172035,#04070c 64%);
	color: #fff;
	font-family: inherit;
	overscroll-behavior: contain;
}
.gga-lightbox-shell { display: flex; width: 100%; height: 100%; min-height: 0; flex-direction: column; padding: max(12px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left)); }
.gga-lightbox-header { z-index: 5; display: flex; width: min(1440px,100%); min-height: 50px; flex: 0 0 auto; align-items: center; justify-content: space-between; gap: 18px; margin: 0 auto; }
.gga-lightbox-meta { display: flex; min-width: 0; align-items: center; gap: 12px; color: #fff; }
.gga-lightbox-meta strong { overflow: hidden; font-size: 16px; font-weight: 650; letter-spacing: -.01em; text-overflow: ellipsis; white-space: nowrap; }
.gga-lightbox-meta span { flex: 0 0 auto; padding: 4px 8px; border: 1px solid rgba(255,255,255,.14); border-radius: 999px; background: rgba(255,255,255,.07); color: rgba(255,255,255,.76); font-size: 12px; line-height: 1; }
.gga-lightbox-tools { display: flex; flex: 0 0 auto; align-items: center; gap: 8px; }

/* Protect lightbox controls from Elementor and theme button styles. */
.gga-gallery .gga-lightbox button {
	all: unset !important;
	box-sizing: border-box !important;
	display: inline-grid !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 1px solid rgba(255,255,255,.22) !important;
	background: rgba(14,20,31,.68) !important;
	color: #fff !important;
	font: inherit !important;
	line-height: 1 !important;
	place-items: center !important;
	cursor: pointer !important;
	-webkit-tap-highlight-color: transparent;
}
.gga-gallery .gga-lightbox button::before,
.gga-gallery .gga-lightbox button::after { content: none !important; display: none !important; }
.gga-gallery .gga-lightbox button:hover { border-color: rgba(255,255,255,.56) !important; background: rgba(32,43,62,.9) !important; }
.gga-gallery .gga-lightbox button:focus-visible { outline: 3px solid var(--gga-accent) !important; outline-offset: 3px !important; }
.gga-lightbox svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.gga-gallery .gga-lightbox button.gga-lightbox-autoplay { display: inline-flex !important; min-height: 38px !important; grid-auto-flow: column; gap: 7px !important; padding: 0 13px !important; border-radius: 999px !important; font-size: 12px !important; font-weight: 600 !important; }
.gga-lightbox-autoplay svg { width: 18px; height: 18px; }
.gga-lightbox-autoplay .gga-icon-pause { display: none; }
.gga-lightbox-autoplay.is-playing .gga-icon-pause { display: inline-flex; }
.gga-lightbox-autoplay.is-playing .gga-icon-play { display: none; }
.gga-gallery .gga-lightbox button.gga-lightbox-close { width: 40px !important; height: 40px !important; border-radius: 50% !important; }

.gga-lightbox-progress { position: relative; z-index: 5; width: min(1440px,100%); height: 3px; flex: 0 0 auto; margin: 5px auto 8px; overflow: hidden; border-radius: 999px; background: rgba(255,255,255,.11); }
.gga-lightbox-progress span { display: block; width: 100%; height: 100%; border-radius: inherit; background: var(--gga-accent); box-shadow: 0 0 14px color-mix(in srgb,var(--gga-accent) 70%,transparent); transform: scaleX(0); transform-origin: left center; will-change: transform; }

.gga-lightbox-stage { position: relative; display: grid; width: 100%; min-height: 0; flex: 1 1 auto; place-items: center; touch-action: none; outline: none; }
.gga-lightbox-media { display: grid; width: min(1240px,calc(100vw - 150px)); height: 100%; min-height: 0; place-items: center; opacity: .25; transform: scale(.985); transition: opacity .25s ease,transform .25s ease; }
.gga-lightbox-media.is-ready { opacity: 1; transform: scale(1); }
.gga-lightbox-image,
.gga-lightbox-video { display: block; max-width: 100%; max-height: 100%; margin: 0; border: 1px solid rgba(255,255,255,.09); border-radius: 12px; background: #05070b; object-fit: contain; box-shadow: 0 24px 80px rgba(0,0,0,.48); }
.gga-lightbox-video { width: min(1120px,100%); aspect-ratio: 16/9; }

.gga-lightbox-loader { position: absolute; z-index: 4; top: 50%; left: 50%; display: flex; align-items: center; gap: 10px; padding: 9px 13px; border: 1px solid rgba(255,255,255,.12); border-radius: 999px; background: rgba(7,10,16,.72); color: rgba(255,255,255,.84); transform: translate(-50%,-50%); pointer-events: none; }
.gga-lightbox-loader[hidden] { display: none; }
.gga-lightbox-loader span { width: 16px; height: 16px; border: 2px solid rgba(255,255,255,.25); border-top-color: var(--gga-accent); border-radius: 50%; animation: gga-spin .75s linear infinite; }
.gga-lightbox-loader em { font-size: 12px; font-style: normal; }
@keyframes gga-spin { to { transform: rotate(360deg); } }

.gga-gallery .gga-lightbox button.gga-lightbox-nav { position: absolute !important; z-index: 5 !important; top: 50% !important; width: 48px !important; height: 48px !important; border-radius: 50% !important; transform: translateY(-50%) !important; }
.gga-gallery .gga-lightbox button.gga-lightbox-prev { right: auto !important; left: max(6px,calc((100vw - 1440px)/2)) !important; }
.gga-gallery .gga-lightbox button.gga-lightbox-next { right: max(6px,calc((100vw - 1440px)/2)) !important; left: auto !important; }

.gga-lightbox-footer { display: flex; width: 100%; min-height: 76px; flex: 0 0 auto; align-items: flex-end; justify-content: center; padding-top: 10px; }
.gga-lightbox-thumbs { display: flex; max-width: min(100%,1120px); gap: 8px; padding: 4px 3px 7px; overflow-x: auto; overscroll-behavior-inline: contain; scroll-behavior: smooth; scroll-snap-type: x proximity; scrollbar-color: rgba(255,255,255,.28) transparent; scrollbar-width: thin; }
.gga-gallery .gga-lightbox button.gga-lightbox-thumb { position: relative !important; display: block !important; width: 76px !important; height: 54px !important; flex: 0 0 76px !important; overflow: hidden !important; border-radius: 8px !important; opacity: .56; scroll-snap-align: center; transition: opacity .2s ease,border-color .2s ease,transform .2s ease; }
.gga-gallery .gga-lightbox button.gga-lightbox-thumb:hover { opacity: .88; }
.gga-gallery .gga-lightbox button.gga-lightbox-thumb.is-active { border-color: var(--gga-accent) !important; opacity: 1; transform: translateY(-2px) !important; box-shadow: 0 0 0 1px var(--gga-accent),0 7px 18px rgba(0,0,0,.32) !important; }
.gga-lightbox-thumb img { display: block; width: 100%; height: 100%; max-width: none; object-fit: cover; }
.gga-lightbox-thumb-video { position: absolute; top: 50%; left: 50%; display: grid; width: 24px; height: 24px; border: 1px solid rgba(255,255,255,.7); border-radius: 50%; background: rgba(0,0,0,.58); color: #fff; font-size: 9px; place-items: center; transform: translate(-50%,-50%); pointer-events: none; }
.gga-lightbox-open { overflow: hidden; }

@media (min-width: 600px) {
	.gga-grid { grid-template-columns: repeat(var(--gga-cols-tablet), minmax(0,1fr)); }
	.gga-filters { flex-wrap: wrap; overflow: visible; }
}

@media (min-width: 1024px) {
	.gga-grid { grid-template-columns: repeat(var(--gga-cols-desktop), minmax(0,1fr)); }
}

@media (max-width: 599px) {
	.gga-gallery { padding: 24px 16px 34px; }
	.gga-filter { min-height: 42px; padding: 9px 14px; font-size: 13px; }
	.gga-play { width: 48px; height: 48px; }
	.gga-lightbox-shell { padding-inline: max(10px,env(safe-area-inset-left)); }
	.gga-lightbox-header { min-height: 46px; gap: 8px; }
	.gga-lightbox-meta { gap: 7px; }
	.gga-lightbox-meta strong { max-width: 42vw; font-size: 14px; }
	.gga-lightbox-meta span { padding: 4px 7px; font-size: 11px; }
	.gga-gallery .gga-lightbox button.gga-lightbox-autoplay { min-height: 36px !important; padding: 0 10px !important; }
	.gga-gallery .gga-lightbox button.gga-lightbox-close { width: 36px !important; height: 36px !important; }
	.gga-lightbox-progress { margin-bottom: 5px; }
	.gga-lightbox-media { width: calc(100vw - 20px); height: 100%; }
	.gga-lightbox-image,.gga-lightbox-video { max-width: 100%; max-height: 100%; border-radius: 9px; }
	.gga-gallery .gga-lightbox button.gga-lightbox-nav { top: auto !important; bottom: 8px !important; width: 42px !important; height: 42px !important; transform: none !important; }
	.gga-gallery .gga-lightbox button.gga-lightbox-prev { right: auto !important; left: 10px !important; }
	.gga-gallery .gga-lightbox button.gga-lightbox-next { right: 10px !important; left: auto !important; }
	.gga-lightbox-footer { min-height: 69px; padding-top: 7px; }
	.gga-lightbox-thumbs { max-width: calc(100vw - 12px); gap: 6px; }
	.gga-gallery .gga-lightbox button.gga-lightbox-thumb { width: 62px !important; height: 46px !important; flex-basis: 62px !important; border-radius: 7px !important; }
}

@media (prefers-reduced-motion: reduce) {
	.gga-gallery * { scroll-behavior: auto !important; transition: none !important; }
	.gga-lightbox-loader span { animation: none; }
}
