.tf-artwork-page {
	position: relative;
	left: 50%;
	width: 100vw !important;
	max-width: 100vw !important;
	margin-left: -50vw !important;
	background: #f5f1e9;
	color: #26231f;
}
.tf-artwork-page,
.tf-artwork-page * { box-sizing: border-box; }
.tf-artwork-gallery {
	width: min(100%, 1500px);
	margin-inline: auto;
	padding: clamp(38px, 6vw, 82px) clamp(16px, 4vw, 52px) clamp(64px, 8vw, 108px);
}
.tf-artwork-gallery__intro { margin: 0 0 clamp(24px, 4vw, 52px); text-align: center; }
.tf-artwork-gallery__eyebrow {
	margin: 0 0 9px;
	color: #a66a22;
	font: 600 10px/1.5 system-ui, sans-serif;
	letter-spacing: .18em;
	text-transform: uppercase;
}
.tf-artwork-gallery__intro h1 {
	margin: 0;
	color: inherit;
	font: 400 clamp(34px, 4.2vw, 56px)/1.08 Georgia, "Times New Roman", serif;
	letter-spacing: -.025em;
}
.tf-artwork-grid {
	position: relative;
	display: block;
	width: 100%;
	aspect-ratio: var(--gallery-aspect-desktop, 1.3);
}
.tf-artwork-card {
	position: absolute;
	left: var(--art-x-desktop);
	top: var(--art-y-desktop);
	display: flex;
	width: var(--art-w-desktop);
	min-width: 0;
	flex-direction: column;
	gap: 9px;
	align-self: start;
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	color: inherit;
	text-align: left;
	cursor: pointer;
	text-decoration: none;
}
.tf-artwork-card__image-wrap {
	display: block;
	width: 100%;
	padding: 5px;
	border: 1px solid rgba(76, 65, 51, .22);
	background: #fffdfa;
	box-shadow: 0 7px 17px rgba(38, 32, 24, .12), 0 1px 3px rgba(38, 32, 24, .12);
	transition: box-shadow .25s ease, transform .25s ease;
}
.tf-artwork-card:hover .tf-artwork-card__image-wrap,
.tf-artwork-card:focus-visible .tf-artwork-card__image-wrap {
	transform: translateY(-3px);
	box-shadow: 0 12px 22px rgba(38, 32, 24, .2), 0 1px 4px rgba(38, 32, 24, .12);
}
.tf-artwork-card:focus-visible { outline: 2px solid #966324; outline-offset: 7px; }
.tf-artwork-card__image {
	display: block;
	width: 100%;
	height: auto;
	background: #080807;
	object-fit: contain;
}
.tf-artwork-card__title {
	display: block;
	padding: 0 3px;
	color: inherit;
	font: 500 12px/1.4 system-ui, sans-serif;
	letter-spacing: .015em;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden;
}
.tf-gallery-promo {
	position: absolute;
	left: var(--promo-x-desktop);
	top: var(--promo-y-desktop);
	width: var(--promo-w-desktop);
	aspect-ratio: var(--promo-ratio-desktop);
	display: flex;
	min-height: 285px;
	flex-direction: column;
	justify-content: center;
	gap: 14px;
	padding: clamp(22px, 3vw, 38px);
	border: 1px solid rgba(177, 143, 95, .42);
	background: linear-gradient(140deg, #27231e, #393228);
	color: #f4efe7;
	box-shadow: 0 8px 24px rgba(30, 25, 20, .12);
}
.tf-gallery-promo__eyebrow {
	margin: 0;
	color: #d5b989;
	font: 600 10px/1.4 system-ui, sans-serif;
	letter-spacing: .16em;
	text-transform: uppercase;
}
.tf-gallery-promo h2 {
	max-width: 380px;
	margin: 0;
	color: inherit;
	font: 400 clamp(23px, 2.5vw, 34px)/1.15 Georgia, "Times New Roman", serif;
}
.tf-gallery-promo > p:not(.tf-gallery-promo__eyebrow) { margin: 0; color: rgba(244,239,231,.78); font: 400 13px/1.6 system-ui,sans-serif; }
.tf-gallery-promo__links,
.tf-artwork-lightbox__links { display: flex; flex-wrap: wrap; gap: 9px; }
.tf-gallery-promo__links a,
.tf-artwork-lightbox__links a,
.tf-store-link-disabled {
	display: inline-flex;
	min-height: 42px;
	align-items: center;
	justify-content: center;
	padding: 9px 13px;
	border: 1px solid rgba(213,185,137,.72);
	border-radius: 2px;
	color: inherit;
	font: 600 11px/1.3 system-ui,sans-serif;
	text-decoration: none;
}
.tf-gallery-promo__links a:hover,
.tf-gallery-promo__links a:focus-visible,
.tf-artwork-lightbox__links a:hover,
.tf-artwork-lightbox__links a:focus-visible { background: #d5b989; color: #27231e; }
.tf-store-link-disabled { border-style: dashed; opacity: .52; cursor: not-allowed; }
.tf-artwork-gallery__empty { padding: 48px 20px; text-align: center; }

.tf-artwork-lightbox {
	width: min(1000px, calc(100vw - 32px));
	max-width: 1000px;
	max-height: 94vh;
	margin: auto;
	padding: 0;
	border: 1px solid rgba(232, 220, 203, .35);
	background: #181715;
	color: #f5f1e9;
	box-shadow: 0 22px 80px rgba(0,0,0,.5);
}
.tf-artwork-lightbox::backdrop { background: rgba(13, 13, 17, .86); backdrop-filter: blur(4px); }
.tf-artwork-lightbox__panel { position: relative; display: flex; max-height: 94vh; flex-direction: column; padding: clamp(16px, 3vw, 30px); }
.tf-artwork-lightbox__close {
	position: absolute;
	z-index: 2;
	top: 12px;
	right: 12px;
	width: 42px;
	height: 42px;
	border: 1px solid rgba(255,255,255,.42);
	border-radius: 50%;
	background: rgba(20,19,18,.72);
	color: #fff;
	cursor: pointer;
	font: 300 28px/1 system-ui,sans-serif;
}
.tf-artwork-lightbox__close:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
.tf-artwork-lightbox__figure { display: flex; min-height: 0; flex: 1; flex-direction: column; align-items: center; justify-content: center; margin: 0; }
.tf-artwork-lightbox__image { display: block; width: 100%; height: min(68vh, 720px); object-fit: contain; }
.tf-artwork-lightbox__figure figcaption { padding: 14px 52px 16px; color: #f5f1e9; font: 400 clamp(20px, 2.5vw, 28px)/1.2 Georgia,"Times New Roman",serif; text-align: center; }
.tf-artwork-lightbox__links { justify-content: center; padding-top: 4px; }
.tf-artwork-lightbox__links a { border-color: rgba(213,185,137,.8); color: #f5f1e9; }
.tf-artwork-lightbox__links .tf-store-link-disabled { color: #f5f1e9; }

[data-theme="dark"] .tf-artwork-page { background: #181824; color: #f3efe9; }
[data-theme="dark"] .tf-artwork-card__image-wrap { border-color: rgba(231,220,202,.2); background: #25242c; }
[data-theme="dark"] .tf-artwork-card__title { color: #f3efe9; }
@media (max-width: 689px) {
	.tf-artwork-grid { aspect-ratio: var(--gallery-aspect-mobile, .7); }
	.tf-artwork-card { left: var(--art-x-mobile); top: var(--art-y-mobile); width: var(--art-w-mobile); }
	.tf-gallery-promo { left: var(--promo-x-mobile); top: var(--promo-y-mobile); width: var(--promo-w-mobile); aspect-ratio: var(--promo-ratio-mobile); min-height: 245px; padding: 20px; }
	.tf-gallery-promo__links { flex-direction: column; align-items: stretch; }
	.tf-gallery-promo__links a,
	.tf-gallery-promo__links .tf-store-link-disabled { justify-content: flex-start; }
	.tf-artwork-lightbox { width: calc(100vw - 20px); max-height: 92vh; }
	.tf-artwork-lightbox__panel { max-height: 92vh; padding: 12px; }
	.tf-artwork-lightbox__image { height: min(64vh, 620px); }
	.tf-artwork-lightbox__figure figcaption { padding: 12px 44px 14px; }
	.tf-artwork-lightbox__links { flex-direction: column; }
}
@media (prefers-reduced-motion: reduce) {
	.tf-artwork-card__image-wrap { transition: none; }
}
