/* Gallery hero + shared layout
   Scoped under .gallery-page so styles never leak into other templates. */

.gallery-page {
	--gallery-accent: #d64528;
	--gallery-accent-dark: #b5371d;
	--gallery-ink: #16202e;
	--gallery-muted: #5b6675;
	--gallery-surface: #ffffff;
	--gallery-bg: #f4f6f9;
	--gallery-border: #e2e7ee;
	--gallery-radius: 12px;
	--gallery-shadow: 0 10px 30px rgba(22, 32, 46, 0.10);
	--gallery-maxw: 1200px;
	background: var(--gallery-bg);
	color: var(--gallery-ink);
}

.gallery-container {
	width: 100%;
	max-width: var(--gallery-maxw);
	margin: 0 auto;
	padding-left: 20px;
	padding-right: 20px;
	box-sizing: border-box;
}

.gallery-hero {
	position: relative;
	padding: clamp(3rem, 8vw, 6rem) 0;
	text-align: center;
	color: #f7fafc;
	background:
		linear-gradient(135deg, rgba(18, 27, 41, 0.92), rgba(29, 44, 68, 0.86)),
		radial-gradient(circle at 25% 20%, rgba(214, 69, 40, 0.35), transparent 55%);
	background-color: #121b29;
}

.gallery-hero__eyebrow {
	margin: 0 0 0.75rem;
	text-transform: uppercase;
	letter-spacing: 0.18em;
	font-size: 0.8rem;
	font-weight: 700;
	color: #ff8a6b;
}

.gallery-hero__title {
	margin: 0 0 1rem;
	font-size: clamp(2.2rem, 5vw, 3.5rem);
	line-height: 1.1;
	letter-spacing: -0.02em;
}

.gallery-hero__intro {
	margin: 0 auto;
	max-width: 640px;
	font-size: clamp(1rem, 2.2vw, 1.15rem);
	line-height: 1.7;
	color: rgba(247, 250, 252, 0.85);
}

@media (prefers-reduced-motion: reduce) {
	.gallery-page * {
		transition: none !important;
		animation: none !important;
	}
}