/*
 * Shared Photography Prints styles.
 *
 * Keep only cross-page primitives here: shared variables, base print cards,
 * breadcrumbs, buttons, and small utilities used by more than one prints view.
 * Page-specific layout belongs in the neighboring prints-*.css files.
 */

body.ibenlo-stage-theme:is(.ibenlo-prints-page, .ibenlo-prints-themes-page, .ibenlo-prints-shop-all-page, .tax-print_collection, .single-photo_print) #site-header #primary-navigation.overlay-active :is(.hamburger-group, .overlay-toggle, .menu-toggle:not(.dl-trigger)) {
	color: #fffaf2 !important;
	-webkit-text-fill-color: #fffaf2 !important;
	filter: none !important;
	mix-blend-mode: normal !important;
	opacity: 1 !important;
	visibility: visible !important;
}

body.ibenlo-stage-theme:is(.ibenlo-prints-page, .ibenlo-prints-themes-page, .ibenlo-prints-shop-all-page, .tax-print_collection, .single-photo_print) #site-header #primary-navigation.overlay-active :is(.overlay-toggle, .menu-toggle:not(.dl-trigger)) :is(.menu-line-1, .menu-line-2, .menu-line-3) {
	background-color: #fffaf2 !important;
	box-shadow: none !important;
}

body.ibenlo-light-mode:is(.ibenlo-prints-themes-page, .ibenlo-prints-shop-all-page, .tax-print_collection) #primary-navigation:not(.overlay-active) .hamburger-group,
body.ibenlo-light-mode:is(.ibenlo-prints-themes-page, .ibenlo-prints-shop-all-page, .tax-print_collection) #primary-navigation:not(.overlay-active) :is(.overlay-toggle, .menu-toggle:not(.dl-trigger)) {
	color: var(--ibenlo-color-dark-purple, #2c2646) !important;
	-webkit-text-fill-color: var(--ibenlo-color-dark-purple, #2c2646) !important;
	mix-blend-mode: normal !important;
	filter: none !important;
}

body.ibenlo-light-mode:is(.ibenlo-prints-themes-page, .ibenlo-prints-shop-all-page, .tax-print_collection) #primary-navigation:not(.overlay-active) :is(.overlay-toggle, .menu-toggle:not(.dl-trigger)) :is(.menu-line-1, .menu-line-2, .menu-line-3) {
	background-color: var(--ibenlo-color-dark-purple, #2c2646) !important;
	box-shadow: none !important;
}

.portfolio-prints-text-crumbs :is(i, .ti, svg) {
	display: none !important;
}

.portfolio-prints-theme-marquee {
	position: relative;
	z-index: 2;
	width: 100%;
	margin: clamp(1.35rem, 3vw, 2.5rem) auto 0;
	padding: clamp(1.75rem, 3.5vw, 3.25rem) 0 clamp(3rem, 6vw, 5.5rem);
	background: var(--prints-bg);
}

body.ibenlo-light-mode .portfolio-prints-theme-marquee {
	background: var(--prints-bg);
}

.portfolio-prints-theme-intro {
	display: grid;
	gap: 0;
	width: min(100% - 2rem, 1180px);
	margin: 0 auto clamp(2.4rem, 4vw, 3.4rem);
	color: var(--prints-ink);
}

.portfolio-prints-theme-intro__kicker {
	margin: 0 0 1.05rem;
	color: var(--prints-grid-accent);
	font-family: var(--ibenlo-type-family);
	font-size: var(--ibenlo-type-eyebrow);
	font-weight: var(--ibenlo-type-eyebrow-weight);
	letter-spacing: var(--ibenlo-type-eyebrow-letter-spacing);
	line-height: var(--ibenlo-type-eyebrow-line-height);
	text-transform: uppercase;
}

.portfolio-prints-theme-intro h2 {
	max-width: 18ch;
	margin: 0 0 1rem;
	color: var(--prints-ink);
}

.portfolio-prints-theme-intro p:not(.portfolio-prints-theme-intro__kicker) {
	max-width: 48rem;
	margin: 0;
	color: var(--prints-muted);
	font-family: var(--ibenlo-type-family);
	font-size: var(--ibenlo-type-paragraph);
	font-weight: 400;
	line-height: var(--ibenlo-type-paragraph-line-height);
}

.portfolio-prints-theme-intro__link {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--ibenlo-button-icon-gap);
	width: fit-content;
	margin-top: clamp(1.25rem, 2.6vw, 2rem);
	padding: 0 0 var(--ibenlo-button-secondary-underline-offset);
	overflow: visible;
	border: 0;
	background: transparent;
	color: var(--prints-grid-accent);
	font-size: var(--ibenlo-secondary-button-font-size);
	font-weight: var(--ibenlo-secondary-button-font-weight);
	letter-spacing: 0;
	line-height: var(--ibenlo-button-line-height);
	text-decoration: none;
	text-transform: uppercase;
	transition: transform 200ms ease;
}

body.ibenlo-light-mode .portfolio-prints-main .portfolio-prints-theme-intro__link {
	color: var(--prints-grid-accent);
}

body.ibenlo-light-mode .portfolio-prints-main .portfolio-prints-theme-intro__link:hover,
body.ibenlo-light-mode .portfolio-prints-main .portfolio-prints-theme-intro__link:focus-visible,
body.ibenlo-light-mode .portfolio-prints-main .portfolio-prints-theme-intro__link.is-active {
	color: var(--prints-ink);
}

.portfolio-prints-theme-intro__link::before,
.portfolio-prints-theme-intro__link::after {
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	height: var(--ibenlo-button-secondary-underline-height);
	content: "";
	background: currentColor;
	transition: transform 280ms cubic-bezier(0.22, 1, 0.36, 1);
}

.portfolio-prints-theme-intro__link::before {
	opacity: 0.54;
	transform: scaleX(1);
	transform-origin: right center;
}

.portfolio-prints-theme-intro__link::after {
	transform: scaleX(0);
	transform-origin: left center;
}

.portfolio-prints-theme-intro__link i {
	width: var(--ibenlo-secondary-button-icon-size);
	height: var(--ibenlo-secondary-button-icon-size);
	font-size: var(--ibenlo-secondary-button-icon-size);
	line-height: 1;
	transform: translateY(var(--ibenlo-secondary-button-icon-shift-y));
	transition: transform 200ms ease;
}

.portfolio-prints-theme-intro__link:hover,
.portfolio-prints-theme-intro__link:focus-visible,
.portfolio-prints-theme-intro__link.is-active {
	color: var(--ibenlo-secondary-button-text-hover, var(--prints-ink));
	transform: translateY(-1px);
}

.portfolio-prints-theme-intro__link:hover::before,
.portfolio-prints-theme-intro__link:focus-visible::before,
.portfolio-prints-theme-intro__link.is-active::before {
	transform: scaleX(0);
}

.portfolio-prints-theme-intro__link:hover::after,
.portfolio-prints-theme-intro__link:focus-visible::after,
.portfolio-prints-theme-intro__link.is-active::after {
	transform: scaleX(1);
}

.portfolio-prints-theme-intro__link:hover i,
.portfolio-prints-theme-intro__link:focus-visible i,
.portfolio-prints-theme-intro__link.is-active i {
	transform: translateY(var(--ibenlo-secondary-button-icon-shift-y)) translateX(0.18rem);
}

.portfolio-prints-theme-marquee__viewport {
	--portfolio-prints-theme-card-width: clamp(15.5rem, 20vw, 21rem);
	overflow: hidden;
	margin-inline: 0;
	margin-block: -1.05rem -0.7rem;
	padding: 1.45rem 0 1.5rem;
	min-height: clamp(25.75rem, 32vw, 34rem);
	cursor: grab;
	touch-action: pan-y;
	user-select: none;
	-webkit-user-select: none;
}

.portfolio-prints-theme-marquee__track {
	display: flex;
	gap: clamp(0.8rem, 1.2vw, 1rem);
	width: max-content;
	will-change: transform;
}

.portfolio-prints-theme-marquee__viewport.is-dragging {
	cursor: grabbing;
}

.portfolio-prints-theme-card {
	position: relative;
	flex: 0 0 var(--portfolio-prints-theme-card-width);
	aspect-ratio: 0.68;
	overflow: hidden;
	border-radius: var(--ibenlo-card-radius, 0.75rem);
	border: 1px solid color-mix(in srgb, var(--prints-ink) 15%, transparent);
	background: color-mix(in srgb, var(--prints-panel) 88%, var(--prints-bg));
	color: #fff;
	text-decoration: none;
	box-shadow: none;
	transform: scale(1);
	transform-origin: center;
	transition:
		box-shadow 320ms ease,
		transform 320ms ease;
}

body:not(.ibenlo-light-mode) .portfolio-prints-theme-card {
	border-color: color-mix(in srgb, var(--prints-grid-accent) 16%, rgba(255, 255, 255, 0.1));
	box-shadow: 0 22px 56px rgba(0, 0, 0, 0.24);
}

.portfolio-prints-theme-card img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 380ms ease;
}

.portfolio-prints-theme-card::after {
	position: absolute;
	inset: -1px;
	content: "";
	background:
		linear-gradient(180deg, rgba(7, 16, 23, 0.16) 0%, rgba(7, 16, 23, 0.25) 42%, rgba(7, 16, 23, 0.78) 100%),
		linear-gradient(90deg, rgba(7, 16, 23, 0.18), transparent 45%);
	transition: opacity 260ms ease;
}

.portfolio-prints-theme-card__title,
.portfolio-prints-theme-card__count {
	position: absolute;
	z-index: 1;
	left: 1.15rem;
	text-align: left;
	transition: transform 260ms ease;
}

.portfolio-prints-theme-card__title {
	right: 1.15rem;
	bottom: 2.65rem;
	color: #fff;
	font-size: clamp(1.35rem, 2.15vw, 2rem);
	font-weight: 750;
	line-height: 1;
	text-transform: none;
}

.portfolio-prints-theme-card__count {
	bottom: 1.2rem;
	color: var(--prints-grid-accent);
	font-size: clamp(0.86rem, 1vw, 1.02rem);
	font-weight: 650;
	line-height: 1;
}

.portfolio-prints-theme-card:hover img,
.portfolio-prints-theme-card:focus-visible img {
	transform: scale(1.06);
}

.portfolio-prints-theme-card:hover,
.portfolio-prints-theme-card:focus-visible {
	transform: scale(1.045);
}

.portfolio-prints-theme-card:hover::after,
.portfolio-prints-theme-card:focus-visible::after {
	opacity: 0.92;
}

.portfolio-prints-theme-card:hover .portfolio-prints-theme-card__title,
.portfolio-prints-theme-card:focus-visible .portfolio-prints-theme-card__title,
.portfolio-prints-theme-card:hover .portfolio-prints-theme-card__count,
.portfolio-prints-theme-card:focus-visible .portfolio-prints-theme-card__count {
	transform: translateY(-0.38rem);
}

body:not(.ibenlo-light-mode) .portfolio-prints-theme-card:hover,
body:not(.ibenlo-light-mode) .portfolio-prints-theme-card:focus-visible {
	box-shadow: 0 28px 72px rgba(0, 0, 0, 0.36);
}

body.ibenlo-stage-theme.ibenlo-light-mode .portfolio-prints-theme-marquee .portfolio-prints-theme-card,
body.ibenlo-stage-theme.ibenlo-light-mode .portfolio-prints-theme-marquee .portfolio-prints-theme-card:hover,
body.ibenlo-stage-theme.ibenlo-light-mode .portfolio-prints-theme-marquee .portfolio-prints-theme-card:focus-visible {
	box-shadow: 0 0 0 rgba(0, 0, 0, 0) !important;
	filter: none !important;
	transition:
		transform 320ms ease !important;
}

@media (prefers-reduced-motion: reduce) {
	.portfolio-prints-theme-marquee__track {
		transform: none !important;
	}
}

@media (max-width: 680px) {
	.portfolio-prints-theme-intro__kicker {
		font-size: var(--ibenlo-type-eyebrow);
	}

	.portfolio-prints-theme-intro h2 {
		font-size: clamp(1.9rem, 8vw, 2.9rem);
	}

	.portfolio-prints-theme-marquee {
		width: calc(100% - 1.5rem);
	}

	.portfolio-prints-theme-marquee__viewport {
		margin-inline: -0.75rem;
		min-height: min(126vw, 42rem);
		--portfolio-prints-theme-card-width: min(82vw, 27rem);
	}

	.portfolio-prints-theme-card {
		flex-basis: var(--portfolio-prints-theme-card-width);
	}
}
