/*
 * WooCommerce surfaces, brought into the design's language.
 *
 * Only the pieces the compiled Tailwind build has no rule for live here:
 * the quantity stepper's input, the remove link, and WooCommerce's own
 * notices. Everything structural is done with the design's existing classes.
 */

/* --- the quantity stepper: the input sits between two buttons, so the
       border comes from the wrapper, not the field --------------------- */
.at-qty .quantity {
	display: contents;
}

.at-qty input.qty {
	width: 2.5rem;               /* matches the design's w-10 */
	height: 2.5rem;
	padding: 0;
	border: 0;
	background: transparent;
	text-align: center;
	font-family: var(--font-sans, ui-sans-serif, system-ui, sans-serif);
	font-size: 12px;
	font-weight: 500;
	font-variant-numeric: tabular-nums;
	color: var(--color-ink-900);
	-moz-appearance: textfield;
	appearance: textfield;
}

.at-qty input.qty::-webkit-outer-spin-button,
.at-qty input.qty::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

.at-qty input.qty:focus {
	outline: none;
}

.at-qty button[data-at-step] {
	border: 0;
	background: transparent;
	cursor: pointer;
}

.at-qty button[data-at-step]:disabled {
	cursor: default;
}

/* --- visually hidden, but still clickable and still announced ---------- */
.at-sr {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* --- the remove control: the design's small underlined caps ----------- */
.at-cart-remove {
	background: none;
	border: 0;
	padding: 0;
	cursor: pointer;
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 6px;
}

.at-cart-remove .remove {
	text-decoration: none;
}

/* --- WooCommerce notices, in the design's palette ---------------------- */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
	list-style: none;
	margin: 0 0 2rem;
	padding: 1rem 1.25rem;
	border-left: 2px solid var(--color-gold-600, #ad8843);
	background: rgb(255 255 255 / 0.5);
	font-size: 12.5px;
	font-weight: 300;
	color: var(--color-ash-600, #6b625a);
}

.woocommerce-error {
	border-left-color: #b4402f;
}

.woocommerce-message a,
.woocommerce-info a {
	text-decoration: underline;
	text-underline-offset: 4px;
}

/* --- the coupon row: present because it is a real feature, quiet because
       the design does not draw one ------------------------------------- */
.at-coupon input[type="text"] {
	width: 11rem;
	border: 0;
	border-bottom: 1px solid var(--color-ink-900);
	background: transparent;
	padding: 0.35rem 0;
	font-size: 11px;
	letter-spacing: 0.08em;
	color: var(--color-ink-900);
}

.at-coupon input[type="text"]:focus {
	outline: none;
	border-bottom-color: var(--color-gold-700, #8c6b32);
}

.at-coupon button {
	background: none;
	border: 0;
	padding: 0;
	cursor: pointer;
	text-decoration: underline;
	text-underline-offset: 6px;
}

/* --- the empty state --------------------------------------------------- */
.at-cart-empty {
	padding: 4rem 0;
}

/* --- the design's gradient button has no <button> ancestor rules, so the
       disabled state needs saying once ---------------------------------- */
.at-btn[disabled],
.at-btn[aria-disabled="true"] {
	pointer-events: none;
	opacity: 0.45;
}

/* --- the cart thumbnail: square, image fills it ------------------------ */
.at-cart-thumb {
	aspect-ratio: 1 / 1;
}

.at-cart-thumb img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* --- WooCommerce wraps totals in <strong>; the design's figures are in
       the display face at normal weight --------------------------------- */
.at-total strong,
.at-line-price .woocommerce-Price-amount {
	font-weight: inherit;
}

.at-total .woocommerce-Price-amount {
	font-size: inherit;
	color: inherit;
}

/* --- the item price/subtotal should not be bolded by WooCommerce ------- */
.product-subtotal .woocommerce-Price-amount,
.cart_totals dd .woocommerce-Price-amount {
	font-weight: inherit;
}

/* === the catalogue card ================================================ */

.at-card-art {
	aspect-ratio: 4 / 5;         /* the reference card's ratio */
}

.at-card-art img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* The design's Add to Basket is a small underlined caps link, sitting beside
   "Enquire". WooCommerce's loop button is kept because it is the thing that
   carries the AJAX add-to-cart, so it is dressed rather than replaced. */
.at-card-add,
.product .button.at-card-add {
	display: inline-block;
	padding: 0.375rem 0;
	background: none;
	border: 0;
	color: var(--color-ash-600, #6b625a);
	font-size: 9.5px;
	font-weight: 600;
	line-height: 1.6;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	text-decoration: underline;
	text-decoration-color: rgb(173 136 67 / 0.5);
	text-decoration-thickness: 1px;
	text-underline-offset: 6px;
	transition: color 0.5s, text-decoration-color 0.5s;
}

.at-card-add:hover,
.product .button.at-card-add:hover {
	background: none;
	color: var(--color-gold-700, #8c6b32);
	text-decoration-color: var(--color-gold-500, #c9a24a);
}

.at-card-add.added::after,
.at-card-add.loading::after {
	font-family: inherit;
	font-size: 9.5px;
}

/* Prices come back as <span class="price"> with <del>/<ins> inside. */
.at-card-price .price,
.at-card-price .woocommerce-Price-amount {
	font: inherit;
	color: inherit;
}

.at-card-price del,
.at-card-price del .woocommerce-Price-amount {
	color: var(--color-ash-400, #8b827a);
	font-size: 0.75em;
}

.at-card-price ins {
	text-decoration: none;
}

/* === the sort select =================================================== */

.at-shop-sort {
	-webkit-appearance: none;
	appearance: none;
	background-image: none;
}

/* === pagination ======================================================== */

.woocommerce-pagination {
	margin-top: 4rem;
	border-top: 1px solid rgb(7 6 5 / 0.12);
	padding-top: 2.5rem;
}

.woocommerce-pagination ul {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 1.75rem;
	border: 0;
	margin: 0;
	padding: 0;
}

.woocommerce-pagination ul li {
	border: 0;
	margin: 0;
	overflow: visible;
}

.woocommerce-pagination ul li a,
.woocommerce-pagination ul li span {
	display: inline-block;
	padding: 0;
	border: 0;
	background: none;
	color: var(--color-ash-600, #6b625a);
	font-size: 10px;
	font-weight: 600;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	text-decoration: underline;
	text-decoration-color: rgb(7 6 5 / 0.25);
	text-decoration-thickness: 1px;
	text-underline-offset: 6px;
	transition: color 0.5s, text-decoration-color 0.5s;
}

.woocommerce-pagination ul li span.current,
.woocommerce-pagination ul li a:hover {
	background: none;
	color: var(--color-ink-900, #070605);
	text-decoration-color: var(--color-gold-600, #ad8843);
}

.woocommerce-pagination ul li a.next,
.woocommerce-pagination ul li a.prev {
	text-decoration-color: rgb(173 136 67 / 0.5);
}

/* === "no products found" ============================================== */

.woocommerce-no-products-found {
	margin-top: 3rem;
	border-top: 1px solid rgb(7 6 5 / 0.12);
	padding-top: 2.5rem;
	font-size: 0.95rem;
	font-weight: 300;
	color: var(--color-ash-600, #6b625a);
}

/* === the order summary thumbnail ======================================= */

.at-summary-thumb {
	width: 3.5rem;               /* the design's w-14 */
}

.at-summary-lines .product-quantity {
	font-weight: 400;
}

/* === shipping: a package, as a <dt>/<dd> pair rather than a <tr> ======== */

.woocommerce-shipping-totals {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 1.5rem;
}

.woocommerce-shipping-totals.at-shipping-has-choice {
	flex-direction: column;
	align-items: stretch;
	gap: 0.875rem;
}

.woocommerce-shipping-methods {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 0.5rem;
	margin: 0;
	padding: 0;
	list-style: none;
	text-align: right;
}

.at-shipping-has-choice .woocommerce-shipping-methods {
	align-items: flex-start;
	text-align: left;
}

.woocommerce-shipping-methods li {
	margin: 0;
}

.woocommerce-shipping-methods label {
	cursor: pointer;
}

.woocommerce-shipping-methods input.shipping_method {
	margin-right: 0.5rem;
	accent-color: #8c6b32;
}

.at-shipping-destination {
	margin: 0.5rem 0 0;
}

/* === the checkout shell ================================================ */

.at-checkout {
	display: grid;
	gap: 4rem;
}

@media (min-width: 1024px) {
	.at-checkout {
		grid-template-columns: minmax(0, 1.3fr) minmax(0, 0.7fr);
		column-gap: 5rem;
	}

	.at-checkout-aside {
		position: sticky;
		top: 140px;
		align-self: start;
	}
}

/* WooCommerce's field rows. The wrapper becomes the grid, so a `.form-row-wide`
   spans the full width while first/last sit two-up - the design's rhythm for
   paired inputs, without touching a single field's markup (checkout.js reads
   those wrappers to validate inline). */
.at-checkout .woocommerce-billing-fields__field-wrapper,
.at-checkout .woocommerce-shipping-fields__field-wrapper,
.at-checkout .woocommerce-additional-fields__field-wrapper {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 1.75rem;
}

@media (min-width: 640px) {
	.at-checkout .woocommerce-billing-fields__field-wrapper,
	.at-checkout .woocommerce-shipping-fields__field-wrapper,
	.at-checkout .woocommerce-additional-fields__field-wrapper {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		column-gap: 1.75rem;
	}
}

.at-checkout .form-row {
	display: flex;
	flex-direction: column;
	gap: 0.625rem;
	float: none;
	width: 100%;
	margin: 0;
	padding: 0;
}

.at-checkout .form-row-wide {
	grid-column: 1 / -1;
}

.at-checkout .form-row > label {
	font-family: var(--font-sans, ui-sans-serif, system-ui, sans-serif);
	font-size: 9.5px;
	font-weight: 600;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--fg-muted);
}

.at-checkout .form-row > label .required,
.at-checkout .form-row > label abbr.required {
	color: #8a3a2a;
	text-decoration: none;
}

.at-checkout h3 {
	font-family: var(--font-sans, ui-sans-serif, system-ui, sans-serif);
	font-size: 10px;
	font-weight: 600;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--fg-muted);
}

/* the "ship to a different address?" toggle, and same for create-account */
.at-checkout .woocommerce-form__label-for-checkbox {
	display: flex;
	align-items: flex-start;
	gap: 0.875rem;
	cursor: pointer;
	font-family: var(--font-sans, ui-sans-serif, system-ui, sans-serif);
	font-size: 11.5px;
	font-weight: 300;
	line-height: 1.7;
	letter-spacing: normal;
	text-transform: none;
	color: var(--fg-body);
}

.at-checkout .input-checkbox {
	flex: 0 0 auto;
	width: 1rem;
	height: 1rem;
	margin: 3px 0 0;
	accent-color: #8c6b32;
}

.at-checkout .woocommerce-shipping-fields {
	margin-top: 2.5rem;
	border-top: 1px solid rgb(7 6 5 / 0.12);
	padding-top: 2rem;
}

/* === the coupon row (outside the form, hence its own scope) ============ */

.woocommerce-form-coupon {
	margin-bottom: 3rem;
	border-top: 1px solid rgb(7 6 5 / 0.12);
	padding-top: 1.75rem;
}

.woocommerce-form-coupon p {
	margin: 0 0 1rem;
	font-size: 11.5px;
	font-weight: 300;
	color: var(--color-ash-600, #6b625a);
}

.woocommerce-form-coupon .form-row {
	margin: 0 0 1rem;
}

.woocommerce-form-coupon input[type="text"] {
	width: 100%;
	max-width: 16rem;
}

/* === payment methods, as the design's choice cards ====================== */

.at-payment-methods {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	margin: 1.5rem 0 0;
	padding: 0;
	list-style: none;
}

.at-payment-methods > li {
	position: relative;
	margin: 0;
}

.at-payment-card {
	display: block;
	padding: 1.25rem 1.5rem 1.25rem 3.25rem;
	border: 1px solid rgb(7 6 5 / 0.15);
	cursor: pointer;
}

.at-payment-card:hover {
	border-color: rgb(7 6 5 / 0.3);
}

/* The radio precedes the label as a sibling, so the chosen card needs no
   JavaScript and no class for WooCommerce to remember to toggle. */
.wc_payment_method > input.at-payment-radio {
	position: absolute;
	top: 1.45rem;
	left: 1.5rem;
	z-index: 1;
	width: 1rem;
	height: 1rem;
	margin: 0;
	accent-color: #8c6b32;
}

.wc_payment_method > input.at-payment-radio:checked ~ .at-payment-card {
	border-color: rgb(173 136 67 / 0.7);
	background-color: rgb(173 136 67 / 0.07);
}

.at-payment-card img {
	display: inline-block;
	width: auto;
	max-height: 1rem;
	margin-left: 0.5rem;
	vertical-align: middle;
}

.at-payment-box {
	margin-top: 0.25rem;
	padding: 0.25rem 1.5rem 0 3.25rem;
	font-size: 11px;
	font-weight: 300;
	line-height: 1.75;
	color: var(--fg-body);
}

.at-payment-box p {
	margin: 0 0 0.875rem;
}

.at-payment-box p:last-child {
	margin-bottom: 0;
}

.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper {
	margin-top: 2rem;
}

.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper .form-row {
	display: block;
	margin: 0;
}

/* === the confirmation ================================================== */

.at-confirmation {
	max-width: 68ch;
}

/* order-received.php prints a <p>, kept so its filter still works; dressed
   as the page's heading rather than as one more notice. */
.woocommerce-thankyou-order-received {
	margin: 1.75rem 0 0;
	padding: 0;
	border: 0;
	background: none;
	font-family: var(--font-display, Georgia, serif);
	font-size: clamp(1.75rem, 4vw, 2.75rem);
	font-weight: 300;
	line-height: 1.05;
	color: var(--fg-heading);
}

.at-order-overview {
	display: flex;
	flex-direction: column;
	gap: 1.25rem;
	width: 100%;
	margin: 2.5rem 0 0;
	padding: 1.75rem 0 0;
	border-top: 1px solid rgb(7 6 5 / 0.12);
	list-style: none;
	font-size: 12px;
}

.at-order-overview > li {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: 0.75rem;
	margin: 0;
}

.at-order-overview .at-ov-label {
	font-family: var(--font-sans, ui-sans-serif, system-ui, sans-serif);
	font-size: 9.5px;
	font-weight: 600;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--fg-muted);
}

.at-order-overview strong {
	font-weight: 400;
	color: var(--fg-heading);
}

.at-order-overview__order strong,
.at-order-overview__total strong {
	font-family: var(--font-display, Georgia, serif);
	font-size: 1.5rem;
	letter-spacing: 0.02em;
}

/* the order-details and customer-details tables the thankyou hook appends:
   WooCommerce's stylesheet is not loaded here, so they need a base */
.woocommerce-order-details,
.woocommerce-customer-details {
	margin-top: 4rem;
	border-top: 1px solid rgb(7 6 5 / 0.12);
	padding-top: 2.5rem;
}

.woocommerce-order-details__title,
.woocommerce-column__title {
	margin: 0;
	font-family: var(--font-sans, ui-sans-serif, system-ui, sans-serif);
	font-size: 10px;
	font-weight: 600;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--fg-muted);
}

.woocommerce-table--order-details {
	width: 100%;
	margin-top: 1.5rem;
	border-collapse: collapse;
	font-size: 12.5px;
}

.woocommerce-table--order-details th,
.woocommerce-table--order-details td {
	padding: 0.9rem 0;
	border-bottom: 1px solid rgb(7 6 5 / 0.12);
	font-weight: 300;
	color: var(--fg-body);
	text-align: left;
	vertical-align: top;
}

.woocommerce-table--order-details tfoot th,
.woocommerce-table--order-details tfoot td {
	text-align: right;
}

.woocommerce-table--order-details .woocommerce-Price-amount {
	font-weight: 400;
	color: var(--fg-heading);
}


/* ==================================================================
   Product detail page — single-product.php
   Only rules the compiled sheet does not already carry. Everything is
   prefixed .at- so it cannot leak onto the design pages.
   ================================================================== */

.at-pdp{display:grid;gap:2.5rem;grid-template-columns:minmax(0,1fr)}
@media(min-width:1024px){
  .at-pdp{grid-template-columns:minmax(0,1fr) minmax(340px,420px);gap:clamp(2.5rem,5vw,5rem);align-items:start}
}
.at-pdp-media{min-width:0}

/* gallery */
.at-pdp-gallery{display:flex;flex-direction:column;gap:1rem}
.at-pdp-gallery-main{position:relative;overflow:hidden;background:#12100e;border:1px solid rgba(173,136,67,.28)}
.at-pdp-gallery-main--empty{aspect-ratio:1/1}
.at-pdp-hero-img{display:block;width:100%;height:auto;aspect-ratio:1/1;object-fit:cover}
.at-pdp-gallery-thumbs{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:.5rem;margin:0;padding:0;list-style:none}
@media(max-width:640px){.at-pdp-gallery-thumbs{grid-template-columns:repeat(4,minmax(0,1fr))}}
.at-pdp-thumb{display:block;width:100%;padding:0;border:1px solid rgba(11,44,74,.14);background:#efe8dc;cursor:pointer;transition:border-color .4s,box-shadow .4s}
.at-pdp-thumb img{display:block;width:100%;height:auto;aspect-ratio:1/1;object-fit:cover}
.at-pdp-thumb:hover{border-color:rgba(173,136,67,.55)}
.at-pdp-thumb.is-active{border-color:rgba(173,136,67,.95);box-shadow:inset 0 0 0 1px rgba(173,136,67,.55)}

/* buy column */
.at-pdp-buy{display:flex;flex-direction:column;gap:.85rem}
@media(min-width:1024px){.at-pdp-buy{position:sticky;top:6rem}}
.at-pdp-price-row{display:flex;align-items:baseline;gap:1rem;flex-wrap:wrap}
.at-pdp-price{font-size:clamp(1.9rem,2.4vw,2.4rem);line-height:1;color:#0b0a09;margin:0}
.at-pdp-stock{font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;color:#6b6a66}
.at-pdp-value{margin:0;font-size:.85rem;line-height:1.6;color:#3f3d39}
.at-pdp-value--meta{color:#6b6a66;font-size:.8rem}
.at-pdp-buy-rule{height:1px;background:rgba(11,44,74,.12);margin:.5rem 0}

/* variation picker */
.at-variation{border:0;margin:0;padding:0;position:relative}
.at-variation-legend{font-size:.62rem;font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:#6b6a66;padding:0;margin-bottom:.7rem}
.at-variation-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.55rem;margin:0;padding:0;list-style:none}
.at-variation-swatch{display:flex;flex-direction:column;align-items:center;gap:.4rem;width:100%;padding:.45rem .3rem .5rem;background:transparent;border:1px solid rgba(11,44,74,.14);cursor:pointer;transition:border-color .35s,background .35s}
.at-variation-thumb{display:block;width:100%;aspect-ratio:1/1;overflow:hidden;border-radius:999px;background:#efe8dc}
.at-variation-thumb img{display:block;width:100%;height:100%;object-fit:cover}
.at-variation-name{font-size:.6rem;line-height:1.25;text-align:center;color:#3f3d39}
.at-variation-swatch:hover{border-color:rgba(173,136,67,.6)}
.at-variation-swatch.is-active,.at-variation-swatch[aria-pressed="true"]{border-color:rgba(173,136,67,.95);background:rgba(173,136,67,.08)}
.at-variation-swatch.is-active .at-variation-thumb,.at-variation-swatch[aria-pressed="true"] .at-variation-thumb{box-shadow:0 0 0 2px rgba(173,136,67,.85)}
/* the real select must stay in the DOM for WooCommerce's script */
.at-variation-native{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.at-variation-reset{display:inline-block;margin-top:.9rem;font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;color:#6b6a66;text-decoration:underline;text-underline-offset:4px}

/* quantity + submit */
.at-pdp-actions{display:flex;align-items:stretch;gap:.7rem;margin-top:1rem;flex-wrap:wrap}
.at-pdp-add{flex:1 1 12rem;min-height:3rem;padding:0 1.5rem;border:0;background:#0b0a09;color:#f6f1e7;font-size:.72rem;font-weight:600;letter-spacing:.22em;text-transform:uppercase;cursor:pointer;transition:background .4s,opacity .3s}
.at-pdp-add:hover:not(:disabled){background:#1c1a17}
.at-pdp-add:disabled{opacity:.42;cursor:not-allowed}
.at-pdp-form .at-qty{display:flex;align-items:center;border:1px solid rgba(11,44,74,.18)}
.at-pdp-form .at-qty .qty{width:3.4rem;height:3rem;border:0;text-align:center;font-size:.9rem;background:transparent;color:#0b0a09}

.at-variation-live{margin:.9rem 0 0}
.at-variation-live .woocommerce-variation-price{font-size:.9rem;color:#3f3d39}
.at-variation-live .woocommerce-variation-availability p{margin:.35rem 0 0;font-size:.78rem;color:#6b6a66}
.at-pdp-unavailable{font-size:.85rem;color:#6b6a66}

/* notices (WooCommerce's own stylesheets are not loaded here) */
.woocommerce-notices-wrapper .woocommerce-message,
.woocommerce-notices-wrapper .woocommerce-info,
.woocommerce-notices-wrapper .woocommerce-error{list-style:none;margin:0 0 1rem;padding:.85rem 1.1rem;font-size:.8rem;line-height:1.6;border-left:2px solid rgba(173,136,67,.8);background:rgba(173,136,67,.08);color:#3f3d39}
.woocommerce-notices-wrapper .woocommerce-message .button{float:right;margin-left:1rem;font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;color:#0b0a09;text-decoration:underline;text-underline-offset:3px}

/* micro table */
.at-pdp-micro{display:flex;flex-wrap:wrap;gap:.4rem 1.6rem;margin:1.1rem 0 0;padding-top:1rem;border-top:1px solid rgba(11,44,74,.1)}
.at-pdp-micro div{display:flex;gap:.45rem;align-items:baseline}
.at-pdp-micro dt{margin:0;text-transform:uppercase;letter-spacing:.14em;font-size:.58rem;color:#8a8781}
.at-pdp-micro dd{margin:0;font-size:.72rem;color:#3f3d39}

/* description on the dark ground */
.at-pdp-prose{max-width:70ch;color:#cfc7ba;font-size:1.02rem;line-height:1.85}
.at-pdp-prose > p:first-child{margin-top:0}
.at-pdp-prose strong{color:#f6f1e7;font-weight:600}
.at-pdp-prose p{margin:0 0 1.1rem}
.at-pdp-prose a{color:#e0c894;text-decoration:underline;text-underline-offset:3px}

/* specification */
.at-pdp-h2{font-size:clamp(1.6rem,2.4vw,2.2rem);line-height:1.15;color:#0b0a09;margin:0 0 1.4rem}
.at-pdp-lede{max-width:60ch;color:#3f3d39;margin:0 0 1.6rem;line-height:1.8}
.at-pdp-spec table{width:100%;border-collapse:collapse;font-size:.9rem}
.at-pdp-spec th,.at-pdp-spec td{padding:.75rem 0;text-align:left;vertical-align:top;border-bottom:1px solid rgba(11,44,74,.1)}
.at-pdp-spec th{width:37%;font-size:.6rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:#6b6a66}
.at-pdp-spec td{color:#3f3d39}

/* related */
.at-pdp-related{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1.5rem;margin:0;padding:0;list-style:none}
.at-pdp-related-card{display:flex;flex-direction:column;gap:.5rem;text-decoration:none;color:inherit}
.at-pdp-related-art{display:block;overflow:hidden;background:#12100e;border:1px solid rgba(173,136,67,.22)}
.at-pdp-related-art img{display:block;width:100%;height:auto;aspect-ratio:1/1;object-fit:cover}
.at-pdp-related-name{font-size:.95rem;color:#0b0a09}
.at-pdp-related-price{font-size:.85rem;color:#6b6a66}

/* enquiry CTA */
.at-pdp-cta{display:inline-block;padding:.9rem 1.7rem;border:1px solid rgba(11,44,74,.3);font-size:.64rem;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:#0b0a09;text-decoration:none;transition:background .4s,color .4s}
.at-pdp-cta:hover{background:#0b0a09;color:#f6f1e7}

/* catalogue cards: both actions measured 27 px tall at 390 px */
@media(max-width:640px){
.at-card-add,.at-card-enquire{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding-block:.5rem}
}
