/* ==========================================================================
   DORIC · Product page
   ========================================================================== */

.d-product { padding-top: var(--d-s6); }
.d-product > .d-container > .d-crumbs { margin-bottom: var(--d-s6); }

.d-product__layout { display: grid; gap: var(--d-s8); padding-bottom: var(--d-s11); }

/* The gallery runs edge to edge on phones and tablets. */
@media (max-width: 1023px) {
	.d-product__gallery { margin-inline: calc(var(--d-gutter) * -1); }

	/* The photograph runs edge to edge; its thumbnails keep the gutter. */
	.d-product__gallery .d-pgal__thumbs {
		padding-inline: var(--d-gutter);
		scroll-padding-inline: var(--d-gutter);
	}
}

@media (min-width: 1024px) {
	.d-product__layout {
		grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr);
		gap: clamp(48px, 5vw, 96px);
		align-items: start;
	}

	.d-product__summary {
		position: sticky;
		top: calc(var(--d-chrome-h) + var(--d-s6));
	}
}

@media (min-width: 1440px) {
	.d-product__summary { max-width: 560px; }
}

/* ── Summary ────────────────────────────────────────────────────────────── */

.d-product__eyebrow { display: flex; flex-wrap: wrap; align-items: center; gap: var(--d-s2); }

.d-product__eyebrow a {
	display: inline-flex;
	align-items: center;
	min-height: 28px;
	color: var(--d-accent);
	transition: color var(--d-dur-fast) var(--d-ease-out);
}

.d-product__eyebrow a.d-product__cat { color: var(--d-text-muted); }
.d-product__eyebrow a:hover { color: var(--d-accent-hover); }

.d-product__title {
	margin-top: var(--d-s4);
	font-family: var(--d-font-display);
	font-size: var(--d-fs-h1);
	font-weight: 400;
	line-height: 1.08;
	letter-spacing: .04em;
	text-transform: uppercase;
	text-wrap: balance;
}

.d-product__colour { margin-top: var(--d-s3); font-size: var(--d-fs-small); color: var(--d-text-muted); }
.d-product__price { margin-top: var(--d-s5); font-size: var(--d-fs-body-l); color: var(--d-text); }

.d-product__price--pending {
	font-size: var(--d-fs-micro);
	letter-spacing: var(--d-ls-label);
	color: var(--d-text-muted);
}
.d-product__badge { margin-top: var(--d-s5); }

.d-product__short {
	margin-top: var(--d-s6);
	max-width: 52ch;
	font-size: var(--d-fs-body);
	line-height: 1.8;
	color: var(--d-text-2);
}

/* ── Buy box ────────────────────────────────────────────────────────────── */

.d-product__buy { display: grid; gap: var(--d-s3); margin-top: var(--d-s8); }

.d-product__buy form.cart { display: flex; flex-wrap: wrap; gap: var(--d-s3); }
.d-product__buy form.cart:not(.variations_form) > .single_add_to_cart_button { flex: 1 1 200px; }

.d-product__buy .quantity {
	display: inline-flex;
	align-items: stretch;
	border: var(--d-hairline) solid var(--d-border-strong);
}

.d-product__buy .quantity .qty {
	width: 52px;
	min-height: calc(var(--d-btn-h) - 2px);
	padding: 0;
	background: transparent;
	border: 0;
	color: var(--d-text);
	font-size: var(--d-fs-body);
	font-variant-numeric: tabular-nums;
	text-align: center;
	-moz-appearance: textfield;
	appearance: textfield;
}

.d-product__buy .quantity .qty::-webkit-outer-spin-button,
.d-product__buy .quantity .qty::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

.d-qty__btn {
	border-radius: var(--d-r-pill);
	display: grid;
	place-items: center;
	width: var(--d-tap);
	color: var(--d-text-2);
	font-size: 1.125rem;
	line-height: 1;
	transition: color var(--d-dur-fast) var(--d-ease-out);
}

.d-qty__btn:hover:not(:disabled) { color: var(--d-accent); }
.d-qty__btn:disabled { opacity: .3; cursor: not-allowed; }

.d-product__buy .single_add_to_cart_button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: var(--d-btn-h);
	padding-inline: var(--d-s7);
	background: var(--d-accent);
	border: var(--d-hairline) solid var(--d-accent);
	color: var(--d-on-accent);
	font-size: var(--d-fs-label);
	font-weight: 500;
	letter-spacing: var(--d-ls-btn);
	text-transform: uppercase;
	transition: background-color var(--d-dur-fast) var(--d-ease-out), border-color var(--d-dur-fast) var(--d-ease-out);
}

.d-product__buy .single_add_to_cart_button:hover { background: var(--d-accent-hover); border-color: var(--d-accent-hover); }
.d-product__buy .single_add_to_cart_button:active { transform: translateY(1px); }
.d-product__buy .single_add_to_cart_button.disabled { opacity: .45; cursor: not-allowed; }

.d-product__buy .stock { width: 100%; font-size: var(--d-fs-small); color: var(--d-text-muted); }
.d-product__buy .out-of-stock { color: var(--d-text); }

/* Variable products: WooCommerce's size and colour selectors. */
.d-product__buy .variations { width: 100%; border-collapse: collapse; margin-bottom: var(--d-s3); }
.d-product__buy .variations th,
.d-product__buy .variations td { display: block; padding: 0; text-align: left; }

.d-product__buy .variations label {
	display: block;
	margin-bottom: var(--d-s2);
	font-size: var(--d-fs-label);
	font-weight: 500;
	letter-spacing: var(--d-ls-label);
	text-transform: uppercase;
	color: var(--d-text-2);
}

.d-product__buy .variations select {
	width: 100%;
	min-height: var(--d-btn-h);
	padding: 0 var(--d-s4);
	background: transparent;
	border: var(--d-hairline) solid var(--d-border-strong);
	border-radius: 0;
	color: var(--d-text);
}

.d-product__buy .variations select option { background: var(--d-surface-2); }
.d-product__buy .reset_variations { display: inline-block; margin-top: var(--d-s2); font-size: var(--d-fs-small); color: var(--d-text-muted); }
.d-product__buy .single_variation_wrap { width: 100%; }
.d-product__buy .woocommerce-variation-add-to-cart { display: flex; flex-wrap: wrap; gap: var(--d-s3); }

.d-product__wish {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--d-s3);
	min-height: var(--d-btn-h);
	border: var(--d-hairline) solid var(--d-border-strong);
	font-size: var(--d-fs-label);
	font-weight: 500;
	letter-spacing: var(--d-ls-btn);
	text-transform: uppercase;
	color: var(--d-text);
	transition: border-color var(--d-dur-fast) var(--d-ease-out), color var(--d-dur-fast) var(--d-ease-out);
}

.d-product__wish:hover { border-color: var(--d-ivory); }
.d-product__wish[aria-pressed="true"] { border-color: var(--d-accent); color: var(--d-accent); }
.d-product__wish[aria-pressed="true"] svg { fill: currentColor; }

/* ── Tools and service ──────────────────────────────────────────────────── */

.d-product__tools {
	display: flex;
	flex-wrap: wrap;
	gap: var(--d-s2) var(--d-s6);
	margin-top: var(--d-s5);
}

.d-product__tool {
	display: inline-flex;
	align-items: center;
	min-height: var(--d-tap);
	font-size: var(--d-fs-label);
	font-weight: 500;
	letter-spacing: var(--d-ls-label);
	text-transform: uppercase;
	color: var(--d-text-2);
	border-bottom: var(--d-hairline) solid transparent;
	transition: color var(--d-dur-fast) var(--d-ease-out);
}

.d-product__tool span { border-bottom: var(--d-hairline) solid var(--d-border-strong); padding-bottom: 3px; }
.d-product__tool:hover { color: var(--d-accent); }
.d-product__tool:hover span { border-bottom-color: currentColor; }

.d-product__service {
	display: grid;
	gap: var(--d-s1);
	margin-top: var(--d-s6);
	padding-block: var(--d-s4);
	border-block: var(--d-hairline) solid var(--d-border);
}

.d-product__service a {
	display: flex;
	align-items: center;
	gap: var(--d-s3);
	min-height: 40px;
	font-size: var(--d-fs-small);
	color: var(--d-text-2);
	transition: color var(--d-dur-fast) var(--d-ease-out);
}

.d-product__service svg { color: var(--d-accent); }
.d-product__service a:hover { color: var(--d-text); }

.d-product__info { margin-top: var(--d-s4); }

.d-specs__prose + .d-specs__prose { margin-top: var(--d-s3); }
.d-specs__list { display: grid; gap: var(--d-s2); }

.d-specs__list li {
	position: relative;
	padding-left: var(--d-s5);
	font-size: var(--d-fs-small);
	color: var(--d-text-2);
}

.d-specs__list li::before {
	content: "";
	position: absolute;
	left: 0;
	top: .8em;
	width: 8px;
	height: 1px;
	background: var(--d-accent);
}

.d-brandlist { display: grid; gap: var(--d-s4); margin-bottom: var(--d-s5); }

.d-brandlist li {
	display: grid;
	grid-template-columns: 32px minmax(0, 1fr);
	column-gap: var(--d-s3);
}

.d-brandlist__index {
	grid-row: span 2;
	font-family: var(--d-font-display);
	font-size: var(--d-fs-small);
	letter-spacing: .12em;
	color: var(--d-accent);
}

.d-brandlist__title {
	font-size: var(--d-fs-label);
	font-weight: 500;
	letter-spacing: var(--d-ls-label);
	color: var(--d-text);
}

.d-brandlist__text { font-size: var(--d-fs-small); color: var(--d-text-muted); }

/* ── Related ────────────────────────────────────────────────────────────── */

.d-product__related { border-top: var(--d-hairline) solid var(--d-border); }

/* ── Construction view ──────────────────────────────────────────────────── */

.d-construct {
	position: fixed;
	inset: 0;
	z-index: var(--d-z-overlay);
	display: grid;
	justify-items: end;
	background: rgba(11, 10, 9, .72);
	opacity: 0;
	transition: opacity var(--d-dur-base) var(--d-ease-out);
}

.d-construct.is-open { opacity: 1; }

.d-construct__panel {
	width: min(100%, 940px);
	height: 100%;
	overflow-y: auto;
	overscroll-behavior: contain;
	background: var(--d-bg);
	border-left: var(--d-hairline) solid var(--d-border);
	transform: translateX(32px);
	transition: transform var(--d-dur-slow) var(--d-ease-cine);
}

.d-construct.is-open .d-construct__panel { transform: none; }

.d-construct__bar {
	position: sticky;
	top: 0;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--d-s5);
	padding: var(--d-s5) var(--d-gutter);
	background: var(--d-bg);
	border-bottom: var(--d-hairline) solid var(--d-border);
}

.d-construct__title {
	margin-top: var(--d-s2);
	font-family: var(--d-font-display);
	font-size: var(--d-fs-h3);
	font-weight: 400;
	letter-spacing: .06em;
	text-transform: uppercase;
}

.d-construct__body { padding: var(--d-s8) var(--d-gutter) var(--d-s12); }

.d-construct__intro {
	max-width: 54ch;
	margin-bottom: var(--d-s8);
	font-size: var(--d-fs-body);
	line-height: 1.8;
	color: var(--d-text-2);
}

.d-construct__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--d-s7) var(--d-s4);
}

@media (min-width: 768px) {
	.d-construct__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

.d-construct__item--wide { grid-column: 1 / -1; }

.d-construct__caption {
	margin-top: var(--d-s3);
	font-size: var(--d-fs-micro);
	font-weight: 500;
	letter-spacing: var(--d-ls-label);
	text-transform: uppercase;
	color: var(--d-text-muted);
}

.d-construct__notes { margin-top: var(--d-s8); }

@media (prefers-reduced-motion: reduce) {
	.d-construct,
	.d-construct__panel { transition: none; }
	.d-construct__panel { transform: none; }
}

/* ── Product gallery ────────────────────────────────────────────────────────
   One scroll-snap track: swipe on touch, drag or arrows on a pointer, arrow
   keys from the keyboard. The thumbnail rail follows the visible frame.
   ------------------------------------------------------------------------- */

.d-pgal { display: grid; gap: var(--d-s3); }

.d-pgal__stage { position: relative; }

.d-pgal__track {
	display: flex;
	overflow-x: auto;
	overflow-y: hidden;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	overscroll-behavior-x: contain;
	scrollbar-width: none;
	-ms-overflow-style: none;
}

.d-pgal__track::-webkit-scrollbar { display: none; }

.d-pgal__slide {
	flex: 0 0 100%;
	min-width: 0;
	scroll-snap-align: center;
}

.d-pgal.is-zoomable .d-pgal__slide { cursor: zoom-in; }
.d-pgal__track.is-dragging { scroll-behavior: auto; cursor: grabbing; }
.d-pgal__track.is-dragging .d-pgal__slide { cursor: grabbing; }

.d-pgal__nav {
	border-radius: var(--d-r-pill);
	position: absolute;
	top: 50%;
	z-index: 2;
	display: grid;
	place-items: center;
	width: var(--d-tap);
	height: var(--d-tap);
	transform: translateY(-50%);
	background: rgba(11, 10, 9, .6);
	border: var(--d-hairline) solid var(--d-border-strong);
	color: var(--d-ivory);
	opacity: 0;
	transition:
		opacity var(--d-dur-base) var(--d-ease-out),
		background-color var(--d-dur-fast) var(--d-ease-out);
}

.d-pgal__nav--prev { left: var(--d-s4); }
.d-pgal__nav--next { right: var(--d-s4); }
.d-pgal__nav:hover { background: rgba(11, 10, 9, .82); }
.d-pgal__nav:disabled { opacity: 0 !important; pointer-events: none; }

.d-pgal__stage:hover .d-pgal__nav,
.d-pgal__nav:focus-visible { opacity: 1; }

/* Touch reads the swipe; arrows would only cover the photograph. */
@media (hover: none) {
	.d-pgal__nav { display: none; }
}

.d-pgal__zoom {
	border-radius: var(--d-r-pill);
	position: absolute;
	right: var(--d-s4);
	bottom: var(--d-s4);
	z-index: 2;
	display: grid;
	place-items: center;
	width: var(--d-tap);
	height: var(--d-tap);
	background: rgba(11, 10, 9, .6);
	border: var(--d-hairline) solid var(--d-border-strong);
	color: var(--d-ivory);
	transition: background-color var(--d-dur-fast) var(--d-ease-out);
}

.d-pgal__zoom:hover { background: rgba(11, 10, 9, .82); }

.d-pgal__count {
	position: absolute;
	left: var(--d-s4);
	bottom: var(--d-s4);
	z-index: 2;
	display: flex;
	gap: var(--d-s2);
	padding: var(--d-s1) var(--d-s3);
	background: rgba(11, 10, 9, .6);
	font-size: var(--d-fs-micro);
	font-weight: 500;
	letter-spacing: var(--d-ls-label);
	font-variant-numeric: tabular-nums;
	color: var(--d-ivory);
}

.d-pgal__countsep { color: var(--d-accent); }

.d-pgal__thumbs {
	display: flex;
	gap: var(--d-s2);
	overflow-x: auto;
	overflow-y: hidden;
	scrollbar-width: none;
}

.d-pgal__thumbs::-webkit-scrollbar { display: none; }
.d-pgal__thumbitem { flex: 0 0 auto; }

.d-pgal__thumb {
	display: block;
	width: 76px;
	border: var(--d-hairline) solid transparent;
	opacity: .5;
	transition:
		opacity var(--d-dur-fast) var(--d-ease-out),
		border-color var(--d-dur-fast) var(--d-ease-out);
}

.d-pgal__thumb:hover { opacity: .82; }
.d-pgal__thumb[aria-current="true"] { opacity: 1; border-color: var(--d-accent); }
.d-pgal--single .d-pgal__thumbs { display: none; }

@media (min-width: 1024px) {
	.d-pgal {
		grid-template-columns: 76px minmax(0, 1fr);
		gap: var(--d-s4);
		align-items: start;
	}

	.d-pgal__thumbs {
		order: -1;
		flex-direction: column;
		max-height: 80vh;
		overflow-x: visible;
		overflow-y: auto;
	}

	.d-pgal--single { grid-template-columns: minmax(0, 1fr); }
}

@media (prefers-reduced-motion: reduce) {
	.d-pgal__track { scroll-behavior: auto; }
}

/* ── Lightbox ───────────────────────────────────────────────────────────── */

.d-lightbox {
	position: fixed;
	inset: 0;
	z-index: var(--d-z-overlay);
	display: grid;
	grid-template-rows: auto minmax(0, 1fr);
	background: rgba(11, 10, 9, .95);
	opacity: 0;
	transition: opacity var(--d-dur-base) var(--d-ease-out);
}

.d-lightbox.is-open { opacity: 1; }

.d-lightbox__bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--d-s5);
	padding: var(--d-s4) var(--d-gutter);
	border-bottom: var(--d-hairline) solid var(--d-border);
}

.d-lightbox__count {
	display: flex;
	gap: var(--d-s2);
	font-size: var(--d-fs-micro);
	font-weight: 500;
	letter-spacing: var(--d-ls-label);
	font-variant-numeric: tabular-nums;
	color: var(--d-text-2);
}

.d-lightbox__close { color: var(--d-ivory); }

.d-lightbox__track {
	display: flex;
	align-items: center;
	overflow-x: auto;
	overflow-y: hidden;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	overscroll-behavior: contain;
	scrollbar-width: none;
}

.d-lightbox__track::-webkit-scrollbar { display: none; }

.d-lightbox__slide {
	display: grid;
	flex: 0 0 100%;
	place-items: center;
	padding: var(--d-s5) var(--d-gutter);
	scroll-snap-align: center;
}

.d-lightbox__media { width: min(100%, 78vh); }

.d-lightbox__nav {
	position: absolute;
	top: 50%;
	background: rgba(11, 10, 9, .7);
	opacity: 1;
}

.d-lightbox__nav--prev { left: var(--d-s4); }
.d-lightbox__nav--next { right: var(--d-s4); }

@media (prefers-reduced-motion: reduce) {
	.d-lightbox { transition: none; }
	.d-lightbox__track { scroll-behavior: auto; }
}

/* ── Identity block ───────────────────────────────────────── */

.d-product__god {
	background: var(--d-bg-elevated);
	border-top: var(--d-hairline) solid var(--d-border);
}

.d-product__godinner { display: grid; gap: var(--d-s8); }

@media (min-width: 900px) {
	.d-product__godinner {
		grid-template-columns: minmax(0, 1fr) minmax(0, .8fr);
		align-items: center;
		gap: clamp(48px, 6vw, 112px);
	}

	.d-product__godmedia { max-width: 460px; justify-self: end; width: 100%; }
}

.d-product__godname {
	margin-top: var(--d-s4);
	font-family: var(--d-font-display);
	font-size: var(--d-fs-display-l);
	font-weight: 400;
	line-height: 1;
	letter-spacing: .05em;
}

.d-product__godvirtue {
	margin-top: var(--d-s4);
	font-size: var(--d-fs-label);
	font-weight: 500;
	letter-spacing: var(--d-ls-label);
	text-transform: uppercase;
	color: var(--d-accent);
}

.d-product__godtraits {
	display: grid;
	gap: var(--d-s1);
	margin-top: var(--d-s6);
	font-family: var(--d-font-display);
	font-size: clamp(1.125rem, 1.8vw, 1.5rem);
	line-height: 1.3;
	color: var(--d-text);
}

.d-product__godintro {
	margin-top: var(--d-s5);
	max-width: 46ch;
	font-size: var(--d-fs-body);
	line-height: 1.8;
	color: var(--d-text-muted);
}

.d-product__godcopy .d-btn { margin-top: var(--d-s7); }

/* ── The close view ─────────────────────────────────────────────────────────
   The macro frame at the size it deserves, next to the two ways further in:
   the construction study and the Standard it is judged against. It renders
   only for a piece that has actually been photographed close.
   ------------------------------------------------------------------------- */

.d-closeview__inner {
	display: grid;
	gap: var(--d-s6);
	align-items: center;
}

.d-closeview__title {
	margin-top: var(--d-s3);
	font-family: var(--d-font-display);
	font-size: var(--d-fs-h3);
	line-height: var(--d-lh-tight);
	color: var(--d-ivory);
}

.d-closeview__text {
	max-width: 38ch;
	margin-top: var(--d-s3);
	color: var(--d-text-dim);
}

.d-closeview__open { margin-top: var(--d-s5); }
/* Its own line, under the button, not trailing off beside it. */
.d-closeview__standard {
	display: flex;
	width: fit-content;
	margin-top: var(--d-s4);
}

@media (min-width: 900px) {
	.d-closeview__inner {
		grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
		gap: var(--d-s8);
	}
}

/* One study: give it the room rather than leaving two empty cells beside it. */
.d-construct__grid--single {
	grid-template-columns: minmax(0, 1fr);
	max-width: 720px;
	margin-inline: auto;
}
