/* Razenet Gallery – front end */
.rzg { --c: var(--rzg-cols); position: relative; margin: 0 0 1.5em; box-sizing: border-box; }
.rzg *, .rzg *::before, .rzg *::after { box-sizing: border-box; }
@media (max-width: 640px) { .rzg { --c: var(--rzg-cols-m); } }
.rzg figure.rzg-item { margin: 0; padding: 0; position: relative; min-width: 0; }
.rzg .rzg-link { display: block; position: relative; overflow: hidden; border-radius: var(--rzg-radius); line-height: 0; color: inherit; text-decoration: none; }
.rzg .rzg-img { display: block; width: 100%; height: auto; max-width: 100%; margin: 0; border: 0; box-shadow: none; }
.rzg .rzg-cap { font-size: .875em; line-height: 1.4; margin-top: .5em; opacity: .85; }
.rzg a.rzg-link:focus-visible { outline: 3px solid currentColor; outline-offset: 2px; }
.rzg a.rzg-lb { cursor: zoom-in; }

/* Shared grid */
.rzg-t-grid .rzg-track, .rzg-t-polaroid .rzg-track, .rzg-t-cards .rzg-track, .rzg-t-overlay .rzg-track,
.rzg-t-logo-grid .rzg-track, .rzg-t-logo-cards .rzg-track, .rzg-t-mosaic .rzg-track, .rzg-t-logo-wall .rzg-track {
	display: grid; grid-template-columns: repeat(var(--c), minmax(0, 1fr)); gap: var(--rzg-gap);
}
.rzg-t-grid .rzg-img, .rzg-t-cards .rzg-img, .rzg-t-overlay .rzg-img, .rzg-t-polaroid .rzg-img, .rzg-t-filmstrip .rzg-img, .rzg-t-slider .rzg-img {
	aspect-ratio: var(--rzg-ar); object-fit: cover; height: auto;
}
.rzg-t-grid .rzg-img { transition: transform .4s ease, opacity .3s; }
.rzg-t-grid .rzg-link:hover .rzg-img { transform: scale(1.04); }

/* 2. Masonry */
.rzg-t-masonry .rzg-track { column-count: var(--c); column-gap: var(--rzg-gap); }
.rzg-t-masonry .rzg-item { break-inside: avoid; margin-bottom: var(--rzg-gap); display: inline-block; width: 100%; }
.rzg-t-masonry .rzg-img { transition: opacity .3s; }
.rzg-t-masonry .rzg-link:hover .rzg-img { opacity: .85; }

/* 3. Justified */
.rzg-t-justified .rzg-track { display: flex; flex-wrap: wrap; gap: var(--rzg-gap); }
.rzg-t-justified .rzg-track::after { content: ""; flex-grow: 999999; }
.rzg-t-justified .rzg-item { flex-grow: calc(var(--rzg-r) * 100); flex-basis: calc(var(--rzg-r) * var(--rzg-row)); }
.rzg-t-justified .rzg-img { aspect-ratio: var(--rzg-r); object-fit: cover; height: 100%; transition: transform .4s; }
.rzg-t-justified .rzg-link:hover .rzg-img { transform: scale(1.03); }
.rzg-t-justified .rzg-cap, .rzg-t-mosaic .rzg-cap, .rzg-t-slider .rzg-cap, .rzg-t-overlay .rzg-cap {
	position: absolute; left: 0; right: 0; bottom: 0; margin: 0; padding: 2em .9em .75em; color: #fff; opacity: 1;
	background: linear-gradient(transparent, rgba(0,0,0,.72)); border-radius: 0 0 var(--rzg-radius) var(--rzg-radius); pointer-events: none;
}
.rzg-t-justified .rzg-cap { opacity: 0; transition: opacity .25s; }
.rzg-t-justified .rzg-item:hover .rzg-cap { opacity: 1; }
@media (max-width: 640px) { .rzg-t-justified .rzg-item { flex-basis: calc(var(--rzg-r) * var(--rzg-row) * .6); } }

/* 4. Mosaic */
.rzg-t-mosaic .rzg-track { grid-auto-flow: dense; }
.rzg-t-mosaic .rzg-item { aspect-ratio: 1; }
.rzg-t-mosaic .rzg-link { position: absolute; inset: 0; }
.rzg-t-mosaic .rzg-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.rzg-t-mosaic .rzg-link:hover .rzg-img { transform: scale(1.05); }
.rzg-t-mosaic .rzg-item:nth-child(7n+1) { grid-column: span 2; grid-row: span 2; }
.rzg-t-mosaic .rzg-item:nth-child(7n+5) { grid-column: span 2; aspect-ratio: 2 / 1; }

/* 5. Polaroid */
.rzg-t-polaroid .rzg-track { gap: calc(var(--rzg-gap) + 10px); padding: 10px 6px; }
.rzg-t-polaroid .rzg-item { background: #fff; padding: 10px 10px 0; box-shadow: 0 4px 14px rgba(0,0,0,.14), 0 1px 3px rgba(0,0,0,.1); transform: rotate(-2deg); transition: transform .3s, box-shadow .3s; color: #333; }
.rzg-t-polaroid .rzg-item:nth-child(3n+2) { transform: rotate(1.8deg); }
.rzg-t-polaroid .rzg-item:nth-child(3n) { transform: rotate(-.8deg); }
.rzg-t-polaroid .rzg-item:hover { transform: rotate(0) scale(1.04); z-index: 2; box-shadow: 0 12px 30px rgba(0,0,0,.2); }
.rzg-t-polaroid .rzg-link { border-radius: 0; }
.rzg-t-polaroid .rzg-cap { margin: 0; padding: .7em 0 .9em; text-align: center; font-family: "Segoe Print", "Bradley Hand", "Comic Sans MS", cursive; opacity: 1; min-height: 2.6em; }
.rzg-t-polaroid .rzg-item:not(:has(.rzg-cap)) { padding-bottom: 36px; }

/* 6. Caption cards */
.rzg-t-cards .rzg-item { background: var(--rzg-card, #fff); color: #222; border-radius: var(--rzg-radius); box-shadow: 0 2px 10px rgba(0,0,0,.08); overflow: hidden; transition: transform .25s, box-shadow .25s; }
.rzg-t-cards .rzg-item:hover { transform: translateY(-4px); box-shadow: 0 10px 24px rgba(0,0,0,.12); }
.rzg-t-cards .rzg-link { border-radius: 0; }
.rzg-t-cards .rzg-cap { margin: 0; padding: .85em 1em 1em; font-weight: 600; opacity: 1; }

/* 7. Hover overlay */
.rzg-t-overlay .rzg-img { transition: transform .5s ease; }
.rzg-t-overlay .rzg-item:hover .rzg-img { transform: scale(1.1); }
.rzg-t-overlay .rzg-link::after { content: ""; position: absolute; inset: 0; background: rgba(0,0,0,.35) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M21 21l-4.3-4.3M11 8v6M8 11h6'/%3E%3C/svg%3E") center/38px no-repeat; opacity: 0; transition: opacity .3s; }
.rzg-t-overlay span.rzg-link::after { background-image: none; }
.rzg-t-overlay .rzg-item:hover .rzg-link::after, .rzg-t-overlay .rzg-link:focus-visible::after { opacity: 1; }
.rzg-t-overlay .rzg-cap { transform: translateY(100%); opacity: 0; transition: transform .3s, opacity .3s; z-index: 1; font-weight: 600; }
.rzg-t-overlay .rzg-item:hover .rzg-cap { transform: none; opacity: 1; }

/* Shared scrollers: slider, filmstrip, logo carousel */
.rzg .rzg-viewport { overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; scroll-behavior: smooth; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.rzg .rzg-viewport::-webkit-scrollbar { display: none; }
.rzg-t-slider .rzg-track, .rzg-t-filmstrip .rzg-track, .rzg-t-logo-carousel .rzg-track { display: flex; gap: var(--rzg-gap); }
.rzg-t-slider .rzg-item, .rzg-t-filmstrip .rzg-item, .rzg-t-logo-carousel .rzg-item { scroll-snap-align: start; flex: 0 0 calc((100% - (var(--c) - 1) * var(--rzg-gap)) / var(--c)); }
.rzg-t-slider { --c: 1 !important; }
.rzg-t-slider .rzg-viewport { border-radius: var(--rzg-radius); }
.rzg-t-slider .rzg-cap { font-size: 1em; padding: 3em 1.2em 1.1em; }
.rzg-t-filmstrip .rzg-viewport { padding-bottom: 2px; }
.rzg-t-filmstrip .rzg-img { transition: transform .4s; }
.rzg-t-filmstrip .rzg-link:hover .rzg-img { transform: scale(1.04); }
.rzg .rzg-arrow { position: absolute; top: 50%; transform: translateY(-50%); z-index: 3; width: 42px; height: 42px; border-radius: 50%; border: 0; padding: 0; cursor: pointer; background: rgba(255,255,255,.92); box-shadow: 0 2px 10px rgba(0,0,0,.2); display: flex; align-items: center; justify-content: center; transition: opacity .2s, transform .2s; color: #222; }
.rzg .rzg-arrow:hover { transform: translateY(-50%) scale(1.08); }
.rzg .rzg-arrow svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.rzg .rzg-prev { left: 10px; }
.rzg .rzg-next { right: 10px; }
.rzg .rzg-arrow[disabled] { opacity: 0; pointer-events: none; }
.rzg-t-slider .rzg-arrow { top: calc(50% - 14px); }
.rzg-t-logo-carousel .rzg-prev { left: -6px; }
.rzg-t-logo-carousel .rzg-next { right: -6px; }
.rzg-t-logo-carousel { padding: 0 40px; }
.rzg-t-logo-carousel .rzg-arrow { width: 34px; height: 34px; box-shadow: 0 1px 6px rgba(0,0,0,.15); }
.rzg .rzg-dots { display: flex; justify-content: center; gap: 8px; margin-top: 12px; height: 16px; align-items: center; }
.rzg .rzg-dots button { width: 9px; height: 9px; border-radius: 9px; border: 0; padding: 0; background: currentColor; opacity: .25; cursor: pointer; transition: width .25s, opacity .25s; }
.rzg .rzg-dots button.is-active { opacity: .85; width: 24px; }

/* ===== Logo templates ===== */
.rzg-logos .rzg-item { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; }
.rzg-logos .rzg-link { display: flex; align-items: center; justify-content: center; border-radius: 0; overflow: visible; }
.rzg-logos .rzg-img { width: auto; max-width: 100%; max-height: var(--rzg-logo-h); height: auto; object-fit: contain; transition: filter .3s, opacity .3s, transform .3s; }
.rzg-logos.rzg-gray .rzg-img { filter: grayscale(1); opacity: .65; }
.rzg-logos.rzg-gray .rzg-item:hover .rzg-img, .rzg-logos.rzg-gray .rzg-link:focus-visible .rzg-img { filter: none; opacity: 1; }
.rzg-logos .rzg-cap { font-size: .8em; margin-top: .6em; }

/* 10. Logo grid */
.rzg-t-logo-grid .rzg-item { padding: 16px; min-height: calc(var(--rzg-logo-h) + 32px); }
.rzg-t-logo-grid .rzg-item:hover .rzg-img { transform: scale(1.06); }

/* 11. Logo wall */
.rzg-t-logo-wall .rzg-track { gap: 0; }
.rzg-t-logo-wall .rzg-item { background: var(--rzg-logo-bg); padding: calc(var(--rzg-gap) + 18px) 16px; min-height: calc(var(--rzg-logo-h) + 48px);
	box-shadow: 1px 0 0 0 rgba(0,0,0,.1), 0 1px 0 0 rgba(0,0,0,.1), 1px 1px 0 0 rgba(0,0,0,.1), 1px 0 0 0 rgba(0,0,0,.1) inset, 0 1px 0 0 rgba(0,0,0,.1) inset; color: #333; transition: background .25s; }
.rzg-t-logo-wall .rzg-item:hover { position: relative; z-index: 1; box-shadow: 0 6px 20px rgba(0,0,0,.1), 1px 0 0 0 rgba(0,0,0,.1) inset, 0 1px 0 0 rgba(0,0,0,.1) inset; }

/* 12. Logo marquee */
.rzg-t-logo-marquee .rzg-viewport { overflow: hidden; scroll-snap-type: none; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.rzg-t-logo-marquee .rzg-track { display: flex; width: max-content; align-items: center; animation: rzg-marquee var(--rzg-marquee) linear infinite; }
.rzg-t-logo-marquee .rzg-item { flex: 0 0 auto; padding: 12px calc(var(--rzg-gap) + 20px); }
.rzg-t-logo-marquee .rzg-img { max-width: 220px; }
.rzg-t-logo-marquee:hover .rzg-track, .rzg-t-logo-marquee:focus-within .rzg-track { animation-play-state: paused; }
@keyframes rzg-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) {
	.rzg-t-logo-marquee .rzg-track { animation: none; flex-wrap: wrap; width: auto; justify-content: center; }
	.rzg-t-logo-marquee .rzg-item[aria-hidden] { display: none; }
	.rzg-t-logo-marquee .rzg-viewport { -webkit-mask-image: none; mask-image: none; }
}

/* 13. Logo carousel */
.rzg-t-logo-carousel .rzg-item { padding: 14px 10px; min-height: calc(var(--rzg-logo-h) + 28px); }

/* 14. Logo cards */
.rzg-t-logo-cards .rzg-item { background: var(--rzg-logo-bg); color: #333; border-radius: var(--rzg-radius); padding: 28px 18px 22px; box-shadow: 0 2px 12px rgba(0,0,0,.07); border: 1px solid rgba(0,0,0,.05); min-height: calc(var(--rzg-logo-h) + 60px); transition: transform .25s, box-shadow .25s; }
.rzg-t-logo-cards .rzg-item:hover { transform: translateY(-5px); box-shadow: 0 14px 30px rgba(0,0,0,.12); }
.rzg-t-logo-cards .rzg-cap { font-weight: 600; font-size: .85em; margin-top: 1em; opacity: .8; }

/* ===== Lightbox ===== */
.rzg-lightbox { position: fixed; inset: 0; z-index: 999999; background: rgba(10,10,12,.94); display: flex; align-items: center; justify-content: center; opacity: 0; visibility: hidden; transition: opacity .25s, visibility .25s; -webkit-tap-highlight-color: transparent; }
.rzg-lightbox.is-open { opacity: 1; visibility: visible; }
.rzg-lightbox figure { margin: 0; max-width: 92vw; max-height: 88vh; display: flex; flex-direction: column; align-items: center; }
.rzg-lightbox img { max-width: 92vw; max-height: 80vh; width: auto; height: auto; object-fit: contain; border-radius: 4px; box-shadow: 0 10px 40px rgba(0,0,0,.5); transition: opacity .2s; }
.rzg-lightbox img.is-loading { opacity: 0; }
.rzg-lightbox figcaption { color: #eee; margin-top: 14px; font-size: 15px; text-align: center; max-width: 80vw; }
.rzg-lightbox button { position: absolute; background: rgba(255,255,255,.1); border: 0; color: #fff; width: 48px; height: 48px; border-radius: 50%; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: background .2s; padding: 0; }
.rzg-lightbox button:hover, .rzg-lightbox button:focus-visible { background: rgba(255,255,255,.25); outline: none; }
.rzg-lightbox button svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.rzg-lb-close { top: 16px; right: 16px; }
.rzg-lb-prev { left: 16px; top: 50%; transform: translateY(-50%); }
.rzg-lb-next { right: 16px; top: 50%; transform: translateY(-50%); }
.rzg-lb-count { position: absolute; top: 26px; left: 24px; color: #aaa; font-size: 13px; letter-spacing: .05em; }
@media (max-width: 640px) { .rzg-lb-prev, .rzg-lb-next { top: auto; bottom: 16px; transform: none; } }
body.rzg-lb-lock { overflow: hidden; }

/* ===== Alignment ===== */
.rzg-align-full { width: 100%; }
.rzg-align-left, .rzg-align-center, .rzg-align-right { width: 100%; max-width: min(var(--rzg-maxw), 100%); }
.rzg-align-left { margin-left: 0; margin-right: auto; }
.rzg-align-center { margin-left: auto; margin-right: auto; }
.rzg-align-right { margin-left: auto; margin-right: 0; }
.rzg-align-center .rzg-cap, .rzg-align-center.rzg-t-cards .rzg-cap { text-align: center; }
.rzg-align-right .rzg-cap { text-align: right; }
