/* Brand tokens — swap a hex here and the whole front end follows.
   Fonts are named stacks only: Lust / Lust Stencil are Adobe fonts the theme or
   an Adobe kit supplies; nothing is enqueued from the plugin. */
:root {
	--awm-primary: #99633F;
	--awm-primary-ink: #fff;
	--awm-secondary: #CCCCCC;
	--awm-secondary-ink: #000508;
	--awm-navy: #214D72;
	--awm-ink: #000508;
	--awm-mid: #404040;
	/* Our pages sit on Astra's dark container (slot 2), whose colour is also the theme's
	   body text colour — so text has to name its own colour to be legible. */
	--awm-text-on-dark: var(--ast-global-color-5, #FFFFFF);
	--awm-title: var(--awm-text-on-dark);
	--awm-label: #99633F;
	/* Astra's transparent header is position:absolute, so the pages reserve its height. */
	--awm-header-clear: 0px;
	--awm-font-heading: 'Lust Stencil', Georgia, serif;
	--awm-font-sub: 'Nunito Sans', Georgia, system-ui, serif;
	--awm-font-accent: 'Lustria', Georgia, serif;
	--awm-font-body: 'Nunito Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
}

/* Our pages render on the theme's dark container, so the text names its own colour. */
.awm-grid-page,
.awm-single { color: var(--awm-text-on-dark); }

/* Astra's transparent header floats over the top of the page and reserves no height of its
   own, so these two wrappers clear it. Scoped to the body class: with the header off this
   collapses to the plain 0px default. */
body.ast-theme-transparent-header { --awm-header-clear: 96px; }
@media (max-width: 921px) {
	body.ast-theme-transparent-header { --awm-header-clear: 84px; }
}

.awm-single {
	max-width: min(100%, 1280px);
	margin-inline: auto;
	display: grid;
	gap: 2.5rem;
	grid-template-columns: 1fr;
	/* The generous bottom padding keeps Astra's footer banner off the block. */
	padding: clamp(1.5rem, 4vw, 3rem) 1rem clamp(3rem, 7vw, 5rem);
	padding-top: calc(clamp(1.5rem, 4vw, 3rem) + var(--awm-header-clear));
}
/* 768px is too early inside a boxed theme container — the columns crowd. */
@media (min-width: 900px) {
	.awm-single {
		grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr);
		align-items: start;
	}
}

.awm-single__media,
.awm-single__details { min-width: 0; }
.awm-single__media { display: flex; flex-direction: column; gap: 1rem; }
.awm-single__noimg { color: #888; font-style: italic; }

.awm-single__hero { position: relative; display: block; cursor: zoom-in; }
.awm-single__hero img { width: 100%; height: auto; display: block; border-radius: 4px; }

.awm-single__count-badge {
	position: absolute;
	right: 12px;
	bottom: 12px;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 0.45rem 0.9rem;
	background: rgba(0, 0, 0, 0.65);
	color: #fff;
	font-size: 1rem;
	font-weight: 600;
	border-radius: 999px;
	pointer-events: none;
}
.awm-single__count-badge svg { display: block; width: 20px; height: 20px; }

.awm-single__exhibition-note {
	margin: 0 0 1rem;
	padding: 0.75rem 1rem;
	background: rgb(153 99 63 / 8%);
	border-left: 3px solid var(--awm-primary);
	font-weight: 500;
}

.awm-single__title {
	margin: 0 0 1rem;
	font-family: var(--awm-font-heading);
	font-weight: 700;
	font-size: clamp(1.75rem, 4vw, 2.5rem);
	line-height: 1.15;
	color: var(--awm-title);
}

.awm-single__meta {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 0.35rem 1rem;
	margin: 0 0 1.5rem;
}
.awm-single__meta dt { font-family: var(--awm-font-sub); font-weight: 600; color: var(--awm-label); }
.awm-single__meta dd { margin: 0; }

/* Price / status and the Print pill share one line, the way the cards do. */
.awm-single__line {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px;
	margin: 0 0 1rem;
}
.awm-single__price {
	font-family: var(--awm-font-sub);
	font-size: 1.5rem;
	font-weight: 600;
}
/* Print price, tucked under the piece price in smaller text (note 65). */
.awm-single__print-price {
	margin: -0.5rem 0 1rem;
	font-family: var(--awm-font-sub);
	font-size: 0.95rem;
	opacity: 0.85;
}

.awm-single__ctas {
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
	margin-top: 1rem;
}
.awm-btn--buy,
.awm-btn--print {
	display: block;
	padding: 0.8rem 1.75rem;
	border-radius: 4px;
	font-weight: 600;
	text-decoration: none;
	width: 100%;
	text-align: center;
	transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
.awm-btn--buy {
	background: var(--awm-primary);
	color: var(--awm-primary-ink);
	border: 1px solid var(--awm-primary);
}
.awm-btn--print {
	background: #F7F2FA;
	color: var(--awm-navy);
	border: 1px solid var(--awm-navy);
}

/* Astra's `a:focus`/`a:hover` repaint these buttons' text and add a dotted outline
   (0-1-1 beats a lone class). Re-assert our own colours + a clean keyboard ring. */
.awm-btn:focus,
.awm-btn:focus-visible { outline: none; }
.awm-btn:focus-visible { outline: 2px solid var(--awm-secondary); outline-offset: 3px; }
.awm-btn--buy:focus,
.awm-btn--buy:focus-visible {
	background: var(--awm-primary);
	border-color: var(--awm-primary);
	color: var(--awm-primary-ink);
}
.awm-btn--print:focus,
.awm-btn--print:focus-visible {
	background: #F7F2FA;
	border-color: var(--awm-navy);
	color: var(--awm-navy);
}
/* Last, so a focused button still shows its hover state (else navy-on-navy). */
.awm-btn--buy:hover { background: #7d5233; border-color: #7d5233; color: var(--awm-primary-ink); }
.awm-btn--print:hover { background: var(--awm-navy); border-color: var(--awm-navy); color: #F7F2FA; }

.awm-single__status {
	display: inline-block;
	padding: 4px 12px;
	border-radius: 999px;
	background: var(--awm-secondary);
	color: var(--awm-secondary-ink);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 1px;
	text-transform: uppercase;
}

/* The grid's Sold badge. */
.awm-grid-card__badge {
	display: inline-block;
	padding: 4px 12px;
	border-radius: 999px;
	background: var(--awm-secondary);
	color: var(--awm-secondary-ink);
	font-family: var(--awm-font-sub);
	font-size: 8px;
	font-weight: 700;
	letter-spacing: 1px;
	text-transform: uppercase;
	white-space: nowrap;
}

.awm-single__description { margin-top: 1.5rem; line-height: 1.7; }
/* Astra's link colour is navy — invisible here, and an un-underlined white link reads as body text. */
.awm-single__description a { color: var(--awm-text-on-dark); text-decoration: underline; }
.awm-single__description a:hover,
.awm-single__description a:focus-visible { color: var(--awm-primary); }

/* All Artwork page (/all-artwork/) */

.awm-grid-page {
	max-width: 1450px;
	margin: 0 auto;
	padding: 0 1.5rem;
}

/* Hero */
.awm-grid-hero {
	padding: calc(40px + var(--awm-header-clear)) 0 0;
	text-align: center;
}
.awm-grid-hero__title {
	margin: 0;
	font-family: var(--awm-font-heading);
	font-weight: 700;
	font-size: 56px;
	line-height: 1.2;
	color: var(--awm-title);
}
.awm-grid-hero__divider {
	width: 60px;
	height: 2px;
	background: var(--awm-secondary);
	margin: 24px auto;
	border: none;
}

/* Intro */
.awm-grid-intro {
	max-width: 700px;
	margin: 0 auto;
	text-align: center;
	padding: 0 0 24px;
	line-height: 1.7;
	font-size: 16px;
}
.awm-grid-intro p { margin: 0 0 1rem; }

/* Tabs + sort */
.awm-grid-toolbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 16px;
	margin: 0 0 28px;
	padding-bottom: 12px;
}
.awm-grid-tabs { display: flex; flex-wrap: wrap; gap: 22px; }
.awm-grid-tabs__tab {
	font-family: var(--awm-font-accent);
	font-size: 15px;
	font-weight: 600;
	letter-spacing: 0.5px;
	text-decoration: none;
	color: var(--awm-text-on-dark);
	padding-bottom: 4px;
	border-bottom: 2px solid transparent;
}
.awm-grid-tabs__tab:hover,
.awm-grid-tabs__tab:focus-visible { color: var(--awm-primary); }
.awm-grid-tabs__tab.is-active {
	color: var(--awm-text-on-dark);
	border-bottom-color: var(--awm-primary);
}

.awm-grid-sort { display: flex; align-items: center; gap: 8px; margin: 0; }
/* Core's .screen-reader-text isn't guaranteed on the front end. */
.awm-grid-sort .screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}
.awm-grid-sort select {
	font-family: var(--awm-font-accent);
	font-size: 14px;
	padding: 6px 10px;
	border: 1px solid var(--awm-secondary);
	border-radius: 4px;
	background: var(--awm-ink);
	color: var(--awm-text-on-dark);
	color-scheme: dark;
}
.awm-grid-sort select option {
	background: #fff;
	color: var(--awm-ink);
}
.awm-grid-sort__go {
	appearance: none;
	-webkit-appearance: none;
	font-family: var(--awm-font-accent);
	font-size: 14px;
	padding: 6px 14px;
	border: 1px solid var(--awm-primary);
	border-radius: 4px;
	background: var(--awm-primary);
	color: var(--awm-primary-ink);
	cursor: pointer;
}
.awm-grid-sort__go:hover { background: #7d5233; border-color: #7d5233; }

.awm-grid-section {
	padding: 0 0 80px;
	margin-top: 40px;
}

.awm-grid-gallery {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 22px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.awm-grid-card {
	margin: 0;
}

.awm-grid-card__link {
	display: block;
	text-decoration: none;
	color: inherit;
}

.awm-grid-card__figure {
	position: relative;
	margin: 0;
}

.awm-grid-card__image {
	display: block;
	width: 100%;
	aspect-ratio: 1 / 1;
	object-fit: cover;
}
.awm-grid-card__image--empty {
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 3rem;
	font-weight: 600;
	color: #b5b0a8;
	background: #fff;
}

.awm-grid-card__caption {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	padding: 14px 2px 0;
}
.awm-grid-card__title {
	display: block;
	font-family: var(--awm-font-heading);
	font-weight: 700;
	font-size: 19px;
	line-height: 1.3;
	color: var(--awm-title);
}
/* The Sold pill's row. */
.awm-grid-card__line {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 6px;
}

/* Sold */
.awm-grid-card--sold .awm-grid-card__figure img,
.awm-grid-card--sold .awm-grid-card__figure .awm-grid-card__image--empty {
	opacity: 0.55;
	filter: grayscale(30%);
}

.awm-grid-card__link:hover .awm-grid-card__title,
.awm-grid-card__link:focus-visible .awm-grid-card__title {
	text-decoration: underline;
	color: var(--awm-primary);
}

.awm-grid-empty {
	text-align: center;
	color: #888;
	font-style: italic;
	padding: 3rem 0;
}

.awm-grid-share {
	padding: 30px 2px 30px;
	border-top: 1px solid #e2e2e2;
	margin-top: 60px;
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.awm-grid-share .sd-title { font-family: var(--awm-font-sub); font-size: 13px; font-weight: 700; }
.awm-grid-share .sd-content ul { display: flex; gap: 8px; margin: 0; }
.awm-grid-share .sd-button {
	border: 1px solid #ddd;
	border-radius: 4px;
	background: #fff;
	font-size: 13px;
	text-decoration: none;
}
.awm-grid-share .share-customize-link { display: none; }

@media (max-width: 1100px) {
	.awm-grid-gallery { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 800px) {
	.awm-grid-gallery { grid-template-columns: repeat(2, 1fr); }
	.awm-grid-hero__title { font-size: 40px; }
	.awm-grid-sort { width: 100%; }
	.awm-grid-sort select { flex: 1 1 auto; min-width: 0; }
	.awm-grid-sort__go { flex: none; }
	.awm-grid-tabs { flex-wrap: nowrap; width: 100%; gap: 12px; }
	.awm-grid-tabs__tab { flex: 1 1 0; text-align: center; font-size: 14px; letter-spacing: 0.25px; white-space: nowrap; }
}
@media (max-width: 560px) {
	.awm-grid-gallery { grid-template-columns: 1fr; }
	.awm-grid-hero__title { font-size: 32px; }
	.awm-grid-page { padding: 0 1rem; }
	.awm-grid-tabs { gap: 8px; }
	.awm-grid-tabs__tab { font-size: 13px; letter-spacing: 0; }
}

.awm-viewer {
	position: fixed;
	inset: 0;
	z-index: 999999;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(10, 12, 16, 0.72);
	-webkit-backdrop-filter: blur(18px) saturate(1.15);
	backdrop-filter: blur(18px) saturate(1.15);
}
.awm-viewer[hidden] { display: none; }
.awm-viewer__figure {
	position: relative;
	max-width: min(92vw, 1400px);
	display: flex;
	align-items: center;
	justify-content: center;
}
.awm-viewer__image {
	display: block;
	max-width: 100%;
	max-height: 88vh;
	width: auto;
	height: auto;
	border-radius: 10px;
	box-shadow: 0 24px 80px rgb(0 0 0 / 55%);
}
.awm-viewer__close,
.awm-viewer__btn {
	appearance: none;
	-webkit-appearance: none;
	width: 48px;
	height: 48px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	border: 1px solid rgb(255 255 255 / 35%);
	border-radius: 50%;
	cursor: pointer;
	background: rgb(15 18 24 / 78%);
	-webkit-backdrop-filter: blur(10px) saturate(1.2);
	backdrop-filter: blur(10px) saturate(1.2);
	color: #fff;
	box-shadow: 0 4px 14px rgb(0 0 0 / 35%);
	transition: background 0.18s ease, border-color 0.18s ease, transform 0.18s ease;
	outline: none;
}
.awm-viewer__close:hover,
.awm-viewer__close:focus,
.awm-viewer__close:focus-visible,
.awm-viewer__btn:focus,
.awm-viewer__btn:hover,
.awm-viewer__btn:focus-visible {
	background: rgb(15 18 24 / 92%);
	border-color: rgb(255 255 255 / 55%);
	transform: scale(1.05);
	outline: none;
}
.awm-viewer__close {
	position: absolute;
	top: -20px;
	right: -20px;
	margin: 8px;
	z-index: 2;
}
.awm-viewer__close svg,
.awm-viewer__btn svg {
	width: 24px;
	height: 24px;
	stroke: #fff;
	stroke-width: 2.25;
	fill: none;
	stroke-linecap: round;
	stroke-linejoin: round;
	filter: drop-shadow(0 1px 2px rgb(0 0 0 / 40%));
}
.awm-viewer__btn {
	flex: none;
}
.awm-viewer__btn[hidden] { display: none; }
.awm-viewer__btn--prev,
.awm-viewer__btn--next {
	position: absolute;
	top: 50%;
	margin: 0;
	transform: translateY(-50%);
}
.awm-viewer__btn--prev { left: -24px; }
.awm-viewer__btn--next { right: -24px; }
.awm-viewer__btn--prev:hover,
.awm-viewer__btn--prev:focus,
.awm-viewer__btn--next:focus,
.awm-viewer__btn--next:hover {
	transform: translateY(-50%) scale(1.05);
}
.awm-viewer__counter {
	position: fixed;
	bottom: 20px;
	left: 50%;
	transform: translateX(-50%);
	padding: 4px 14px;
	border-radius: 999px;
	background: rgb(255 255 255 / 10%);
	color: #fff;
	font-size: 13px;
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
}
body.awm-viewer-open { overflow: hidden; }

.awm-viewer__image { transition: transform 0.2s ease; }
.awm-viewer.is-dragging .awm-viewer__image {
	transition: none;
	will-change: transform;
}

@media (max-width: 767px) {
	.awm-viewer { padding: 0 40px; }
	.awm-viewer__figure {
		max-width: calc(100vw - 80px);
		width: 100%;
	}
	.awm-viewer__image {
		max-width: 100%;
		max-height: calc(100vh - 120px);
		object-fit: contain;
	}
	.awm-viewer__close {
		width: 48px;
		height: 48px;
		top: -16px;
		right: -12px;
		margin: 8px;
	}
	.awm-viewer__close svg { width: 26px; height: 26px; }
	.awm-viewer__btn {
		width: 56px;
		height: 56px;
	}
	.awm-viewer__btn--prev { left: -28px; }
	.awm-viewer__btn--next { right: -28px; }
	.awm-viewer__counter { bottom: 24px; }
	.awm-single__count-badge {
		right: 14px;
		bottom: 14px;
		padding: 0.55rem 1rem;
		font-size: 1.1rem;
	}
	.awm-single__count-badge svg { width: 24px; height: 24px; }
}
