@layer components {
	/* ---- Gallery hero ---- */
	.gallery-hero { position: relative; isolation: isolate; background: var(--black); color: var(--white-text); overflow: hidden; border-bottom: var(--nav-rule) solid var(--red); }
	.gallery-hero.has-image { width: 100%; max-width: 100%; min-height: 520px; max-height: 800px; aspect-ratio: var(--ratio-hero-mobile); display: flex; align-items: flex-end; }
	.gallery-hero__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; }
	.gallery-hero__overlay { position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(8,8,10,.25) 0%, rgba(8,8,10,.05) 35%, rgba(8,8,10,.7) 70%, rgba(8,8,10,.95) 100%); }
	.gallery-hero__inner { flex: none; display: flex; flex-direction: column; align-items: flex-start; gap: var(--sp-4); padding-block: var(--sp-6); }
	.gallery-hero__title { font-family: var(--font-display); font-weight: var(--fw-black); font-size: clamp(2.75rem, 6.5vw, 5.5rem); line-height: 0.9; letter-spacing: var(--ls-tight); text-transform: uppercase; max-width: 16ch; text-shadow: 0 2px 28px rgba(0,0,0,.4); }
	.gallery-hero__facts { display: flex; flex-wrap: wrap; gap: var(--sp-3) var(--sp-6); margin-top: var(--sp-2); }
	.gallery-hero__facts dt { font-size: var(--fs-micro); font-weight: var(--fw-semi); letter-spacing: var(--ls-label); text-transform: uppercase; color: var(--on-dark-muted); }
	.gallery-hero__facts dd { margin: 2px 0 0; font-family: var(--font-display); font-weight: var(--fw-bold); font-size: var(--fs-small); text-transform: uppercase; letter-spacing: 0.02em; }

	.gallery-intro { background: var(--black); color: var(--white-text); padding-block: var(--sp-5); }
	.gallery-intro__inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--sp-4) var(--sp-6); }
	.gallery-intro__text { max-width: 60ch; font-family: var(--font-serif); font-size: var(--fs-body); line-height: 1.6; color: rgba(255,255,255,.8); }
	.gallery-intro__links { display: flex; flex-wrap: wrap; gap: var(--sp-3); }

	/* ---- Editorial photo rows: ratios intact, no cropping ---- */
	.gallery-body { padding-block: var(--sp-5) var(--sp-8); }
	.photos { display: grid; gap: var(--sp-2); }
	.photo-row { display: flex; gap: var(--sp-2); }
	.photo { position: relative; margin: 0; flex: var(--r) 1 0%; min-width: 0; aspect-ratio: var(--r); background: var(--black-panel); }
	.photo-row--single .photo { aspect-ratio: max(var(--r), 2.2); } /* full-width moments run cinematic; the lightbox shows the whole frame */
	.photo__link { display: block; width: 100%; height: 100%; }
	.photo__img { width: 100%; height: 100%; object-fit: cover; display: block; }
	.photo__caption { position: absolute; left: 0; right: 0; bottom: 0; padding: 20px 12px 10px; font-family: var(--font-display); font-size: var(--fs-micro); font-weight: var(--fw-semi); letter-spacing: var(--ls-ui); text-transform: uppercase; color: var(--white-text); background: linear-gradient(180deg, transparent, rgba(8,8,10,.7)); opacity: 0; transition: opacity var(--dur) var(--ease); pointer-events: none; }
	.photo:hover .photo__caption, .photo:focus-within .photo__caption { opacity: 1; }
	@media (max-width: 767px) {
		.photo-row { flex-wrap: wrap; }
		.photo { flex: 1 1 100%; }
		.photo--portrait, .photo--square { flex: 1 1 calc(50% - var(--sp-2) / 2); }
		.photo__caption { opacity: 1; }
	}
	@media (min-width: 768px) { .photos, .photo-row { gap: var(--sp-3); } .gallery-hero.has-image { aspect-ratio: var(--ratio-hero); min-height: 480px; } }
	@media (min-width: 1024px) { .photos, .photo-row { gap: var(--sp-4); } }

	/* ---- Gallery cards ---- */
	.gallery-index, .gallery-more { padding-block: var(--sp-6) var(--sp-9); }
	.gallery-grid { display: grid; gap: var(--sp-4); }
	.gallery-card { background: var(--black-deep); color: var(--white-text); }
	.gallery-card__link { display: flex; flex-direction: column; color: var(--white-text); height: 100%; }
	.gallery-card__media { position: relative; display: block; aspect-ratio: var(--ratio-card); overflow: hidden; background: var(--black-panel); }
	.gallery-card__img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 600ms var(--ease); }
	.gallery-card:hover .gallery-card__img { transform: scale(1.03); }
	.gallery-card__count { position: absolute; left: 12px; bottom: 12px; padding: 5px 10px 4px; background: rgba(8,8,10,.75); font-size: var(--fs-micro); font-weight: var(--fw-bold); letter-spacing: var(--ls-ui); text-transform: uppercase; }
	.gallery-card__body { display: flex; flex-direction: column; gap: 6px; padding: var(--pad-card); }
	.gallery-card__title { font-family: var(--font-display); font-weight: var(--fw-extra); font-size: clamp(1.25rem, 1.6vw, 1.5rem); line-height: 1.05; text-transform: uppercase; letter-spacing: 0.005em; }
	.gallery-card__credit { font-size: var(--fs-micro); font-weight: var(--fw-semi); letter-spacing: var(--ls-ui); text-transform: uppercase; color: var(--on-dark-muted); }
	.gallery-card--wide { margin-bottom: var(--sp-5); }
	.gallery-card--wide .gallery-card__media { aspect-ratio: var(--ratio-lead); }
	.gallery-card--wide .gallery-card__title { font-size: var(--fs-h2); font-weight: var(--fw-black); line-height: var(--lh-display); letter-spacing: var(--ls-tight); }
	@media (min-width: 640px) { .gallery-grid { grid-template-columns: repeat(2, 1fr); } }
	@media (min-width: 768px) {
		.gallery-card--wide .gallery-card__link { display: grid; grid-template-columns: 2fr 1fr; }
		.gallery-card--wide .gallery-card__media { aspect-ratio: 16 / 9; }
		.gallery-card--wide .gallery-card__body { justify-content: center; padding: var(--sp-6); }
	}
	@media (min-width: 1024px) { .gallery-grid { grid-template-columns: repeat(3, 1fr); gap: var(--sp-5); } }

	/* Photo strip used on sport, game and story pages */
	.photo-strip { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--sp-2); }
	.photo-strip__item { display: block; aspect-ratio: var(--ratio-card); overflow: hidden; background: var(--black-panel); }
	.photo-strip__item img { width: 100%; height: 100%; object-fit: cover; display: block; }
	@media (min-width: 768px) { .photo-strip { grid-template-columns: repeat(6, 1fr); gap: var(--sp-3); } }
	.sport-photos { padding-block: 0 var(--sp-7); }

	/* ---- Lightbox chrome (PhotoSwipe) ---- */
	.pswp { --pswp-bg: #000; --pswp-icon-color: #f2f2f2; --pswp-icon-color-secondary: #000; }
	.pswp__counter { font-family: var(--font-display); font-weight: var(--fw-bold); font-size: 0.9rem; letter-spacing: var(--ls-ui); text-shadow: none; opacity: 1; }
	.pswp__corbin-caption { position: absolute; left: 0; right: 0; bottom: 0; padding: 14px var(--sp-5) 18px; display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 16px; background: linear-gradient(180deg, transparent, rgba(0,0,0,.85)); color: #f2f2f2; font-family: var(--font-display); pointer-events: none; }
	.pswp__cap-text { font-size: 1rem; font-weight: var(--fw-semi); }
	.pswp__cap-credit { font-size: 0.75rem; font-weight: var(--fw-semi); letter-spacing: var(--ls-ui); text-transform: uppercase; color: rgba(255,255,255,.65); }
	.pswp__button--arrow { opacity: .9; }
	.pswp__icn { filter: none; }
}