/* Halman Thompson shop: product journeys, bespoke box, samples, finish popups, upsells.
   Uses the brand tokens defined in style.css (section 9.0). */

/* ---------- Shared ---------- */

.product-eyebrow {
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--ht-bronze);
	margin: 0 0 10px;
}

.visually-hidden {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

/* ---------- Splashback / sheet products ---------- */

.halman-sheet-product .summary .price:first-of-type:empty {
	display: none;
}

.sheet-reassurance {
	list-style: none;
	margin: 24px 0 0;
	padding: 20px 0 0;
	border-top: 1px solid var(--wc-design-border);
	display: grid;
	gap: 10px;
	font-size: 16px;
}

.sheet-reassurance li {
	display: flex;
	gap: 12px;
	align-items: baseline;
	margin: 0;
	padding: 0;
}

.sheet-reassurance li::before {
	content: none;
}

.sheet-reassurance i {
	color: var(--ht-bronze);
	width: 18px;
	text-align: center;
}

.sheet-live-price {
	float: right;
	width: 48%;
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 6px 12px;
	margin: 8px 0 16px;
	font-size: 14px;
}

.sheet-live-price strong {
	font-family: var(--ht-heading-font);
	font-size: 28px;
	font-weight: 400;
}

.sheet-live-price small {
	color: #777;
	font-size: 12px;
}

@media (max-width: 767px) {
	.sheet-live-price {
		float: none;
		width: 100%;
	}
}

/* Hidden for now — duplicates the WooCommerce price in the summary. */
.sheet-live-price {
	display: none;
}

.sheet-size-notice {
	background: #fbf3ec;
	border-left: 3px solid var(--ht-bronze);
	padding: 12px 16px;
	font-size: 14px;
	margin: 0 0 16px;
}

.sheet-size-notice a {
	color: var(--ht-dark);
	text-decoration: underline;
}

.single_add_to_cart_button.disabled,
.single_add_to_cart_button:disabled {
	opacity: 0.45;
	cursor: not-allowed;
}

/* ---------- Splashbacks page: finishes grouped by metal ---------- */

.splashback-finishes-header {
	max-width: 760px;
	margin-bottom: 40px;
}

.splashback-finishes-intro {
	margin: 12px 0 24px;
}

.splashback-metal-nav {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.splashback-metal-nav a {
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	padding: 12px 18px;
	border: 1px solid var(--ht-bronze);
	color: var(--ht-dark);
	transition: background 0.3s ease, color 0.3s ease;
}

.splashback-metal-nav a:hover,
.splashback-metal-nav a:focus-visible {
	background: var(--ht-bronze);
	color: #fff;
}

.splashback-metal {
	scroll-margin-top: 140px;
	margin-top: 48px;
}

.splashback-metal-title {
	display: flex;
	align-items: baseline;
	gap: 14px;
	font-size: 30px;
	margin: 0 0 20px;
	padding-bottom: 12px;
	border-bottom: 1px solid var(--wc-design-border);
}

.splashback-metal-title span {
	font-family: var(--ht-body-font);
	font-size: 13px;
	color: #777;
}

.splashback-finish-grid {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
	gap: 28px 24px;
}

.splashback-finish-card {
	margin: 0;
	padding: 0;
}

.splashback-finish-card::before {
	content: none;
}

.splashback-finish-card a {
	display: flex;
	flex-direction: column;
	gap: 6px;
	color: var(--ht-dark);
	height: 100%;
}

.splashback-finish-image {
	display: block;
	aspect-ratio: 4 / 5;
	overflow: hidden;
	background: var(--ht-nav);
	margin-bottom: 12px;
}

.splashback-finish-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.6s ease;
}

.splashback-finish-card a:hover img {
	transform: scale(1.04);
}

.splashback-finish-image-missing {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
	font-size: 12px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: #8a7d6b;
}

.splashback-finish-name {
	font-size: 16px;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.splashback-finish-sub {
	font-size: 13px;
	color: #666;
}

.splashback-finish-cta {
	padding-top: 6px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--ht-bronze);
}

.splashback-finish-cta i {
	transition: transform 0.3s ease;
}

.splashback-finish-card a:hover .splashback-finish-cta i {
	transform: translateX(4px);
}

@media (max-width: 600px) {
	.splashback-finish-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 20px 14px;
	}
}

/* ---------- Made-to-order options (tables, coasters, placemats) ---------- */

.halman-made-to-order .variations_form table.variations,
.halman-made-to-order .variations_form .variations {
	width: 100%;
	border: 0;
	margin-bottom: 8px;
}

.halman-made-to-order .variations tr,
.halman-made-to-order .variations th,
.halman-made-to-order .variations td {
	display: block;
	border: 0;
	padding: 0;
	background: none;
	text-align: left;
}

.halman-made-to-order .variations th label,
.option-label {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	margin: 22px 0 10px;
	padding: 0;
	color: var(--ht-dark);
}

.halman-made-to-order .reset_variations {
	display: none !important;
}

.option-value {
	font-weight: 400;
	letter-spacing: 0;
	text-transform: none;
	color: #666;
}

fieldset.finish-picker,
fieldset.option-toggle {
	border: 0;
	margin: 0;
	padding: 0;
	min-width: 0;
}

.finish-picker-group {
	display: grid;
	grid-template-columns: 110px 1fr;
	gap: 10px;
	align-items: start;
	padding: 8px 0;
	border-top: 1px solid #ece7e1;
}

.finish-picker-metal {
	font-size: 12px;
	color: #777;
	padding-top: 12px;
}

.finish-picker-swatches {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.finish-swatch {
	position: relative;
	cursor: pointer;
	margin: 0;
}

.finish-swatch input {
	position: absolute;
	opacity: 0;
	inset: 0;
	cursor: pointer;
}

.finish-swatch-image {
	display: block;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	overflow: hidden;
	box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.12);
	transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.finish-swatch-image img,
.finish-swatch-blank {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.finish-swatch-blank {
	background: linear-gradient(135deg, #d9d9d6, #a9aaa8);
}

.finish-swatch:hover .finish-swatch-image {
	transform: scale(1.06);
}

.finish-swatch input:checked + .finish-swatch-image {
	box-shadow: 0 0 0 2px var(--ht-cream), 0 0 0 4px var(--ht-dark);
}

.finish-swatch input:focus-visible + .finish-swatch-image {
	outline: 2px solid var(--ht-bronze);
	outline-offset: 4px;
}

.option-buttons {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.option-button {
	position: relative;
	display: inline-flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 2px;
	min-width: 110px;
	padding: 12px 16px;
	background: var(--wc-design-value);
	border: 1px solid transparent;
	color: var(--ht-dark);
	font-family: var(--ht-body-font);
	font-size: 13px;
	text-align: left;
	cursor: pointer;
	transition: border-color 0.2s ease, background 0.2s ease;
	margin: 0;
}

label.option-button {
	flex-direction: row;
	align-items: center;
	min-width: 0;
}

label.option-button input {
	position: absolute;
	opacity: 0;
}

/* Sheet finish (Gloss / Matte): same lettering as the filter buttons. */
label.option-button span {
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.option-button-name {
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	font-size: 12px;
}

.option-button-note,
.option-button-price {
	font-size: 12px;
	color: #666;
}

.option-button-badge {
	position: absolute;
	top: -9px;
	right: 8px;
	background: var(--ht-bronze);
	color: #fff;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	padding: 2px 6px;
}

.option-button:hover {
	border-color: var(--ht-bronze);
}

.option-button[aria-pressed="true"],
label.option-button:has(input:checked) {
	background: #fff;
	border-color: var(--ht-dark);
}

.option-button:disabled {
	opacity: 0.4;
	cursor: not-allowed;
}

.option-help {
	width: 18px;
	height: 18px;
	border-radius: 50%;
	border: 1px solid #aaa;
	background: none;
	font-size: 11px;
	line-height: 1;
	padding: 0;
	cursor: pointer;
	color: #666;
}

.option-help-text {
	font-size: 13px;
	background: #fff;
	padding: 12px 14px;
	margin: 10px 0 0;
	border-left: 3px solid var(--ht-bronze);
}

.halman-made-to-order .single_variation_wrap {
	margin-top: 20px;
}

.halman-made-to-order .woocommerce-variation-price .price {
	font-family: var(--ht-heading-font);
	font-size: 28px;
	margin: 6px 0 12px;
}

.woocommerce-product-gallery .finish-chip {
	position: absolute;
	left: 16px;
	top: 16px;
	width: auto;
	max-width: calc(100% - 90px);
	z-index: 5;
	display: flex;
	align-items: center;
	gap: 10px;
	background: rgba(249, 248, 246, 0.94);
	padding: 6px 14px 6px 6px;
	font-size: 13px;
	pointer-events: none;
}

.woocommerce-product-gallery .finish-chip img {
	width: 32px !important;
	height: 32px !important;
	max-width: none;
	flex: 0 0 32px;
	border-radius: 50%;
	object-fit: cover;
}

.woocommerce-product-gallery {
	position: relative;
}

/* Featured products now use the uncropped large image, so crop to square here. */
.featured-product-image {
	aspect-ratio: 1 / 1;
	object-fit: cover;
}

/* The theme's global "img { transition: all 0.4s }" makes the hover zoom ease after the cursor on
   every move (jittery, worst in Safari). The zoom image must follow the pointer instantly. */
.woocommerce-product-gallery img,
.woocommerce-product-gallery .zoomImg {
	transition: none !important;
}

/* ---------- Complete the look ---------- */

.complete-the-look {
	clear: both;
	background: var(--ht-nav);
	padding: 48px;
	margin: 60px 0 0;
}

.complete-the-look header {
	margin-bottom: 28px;
}

.complete-the-look h3 {
	font-size: clamp(28px, 3vw, 40px);
	margin: 0 0 8px;
}

.complete-the-look header p {
	margin: 0;
}

.upsell-grid {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 24px;
}

.upsell-card {
	display: grid;
	grid-template-columns: 1fr;
	gap: 14px;
	background: var(--ht-cream);
	padding: 16px;
	margin: 0;
}

.upsell-card::before {
	content: none;
}

.upsell-card-image img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	display: block;
}

.upsell-card-body {
	display: flex;
	flex-direction: column;
	gap: 6px;
	min-width: 0;
}

.upsell-card .upsell-card-title {
	font-family: var(--ht-heading-font);
	font-size: 22px;
	color: var(--ht-dark);
	line-height: 1.2;
}

/* Product page / basket: three across (the "added to basket" popup keeps its auto layout). */
.complete-the-look:not(.added-dialog .complete-the-look) .upsell-grid {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.complete-the-look:not(.added-dialog .complete-the-look) .upsell-card .upsell-card-title {
	font-size: 19px;
}

.complete-the-look:not(.added-dialog .complete-the-look) .upsell-card-image img {
	aspect-ratio: 3 / 2;
}

@media (max-width: 900px) {
	.complete-the-look:not(.added-dialog .complete-the-look) .upsell-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 600px) {
	.complete-the-look:not(.added-dialog .complete-the-look) .upsell-grid {
		grid-template-columns: 1fr;
	}
}

.upsell-card-price {
	font-size: 14px;
}

.quick-add {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 8px;
	margin-top: 6px;
}

.quick-add-field {
	display: flex;
	flex-direction: column;
	gap: 3px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	margin: 0;
}

.quick-add-field:first-of-type {
	grid-column: 1 / -1;
}

.quick-add-field select {
	font-size: 13px;
	padding: 8px;
	border: 1px solid var(--wc-design-border);
	background: #fff;
	text-transform: none;
	letter-spacing: 0;
	font-weight: 400;
	width: 100%;
}

.quick-add-button {
	grid-column: 1 / -1;
	padding: 12px 16px;
}

.quick-add-button.is-loading {
	opacity: 0.6;
}

.quick-add-status {
	grid-column: 1 / -1;
	font-size: 13px;
	margin: 0;
	min-height: 1em;
}

.quick-add-status a {
	text-decoration: underline;
	color: var(--ht-dark);
}

@media (max-width: 600px) {
	.complete-the-look {
		padding: 28px 16px;
	}


	.finish-picker-group {
		grid-template-columns: 1fr;
		gap: 4px;
	}

	.finish-picker-metal {
		padding-top: 4px;
	}
}

/* ---------- Dialogs ---------- */

.halman-dialog {
	border: 0;
	padding: 40px;
	width: min(920px, calc(100vw - 32px));
	max-height: calc(100vh - 48px);
	overflow: auto;
	background: var(--ht-cream);
	color: var(--ht-dark);
}

.halman-dialog::backdrop {
	background: rgba(44, 42, 40, 0.6);
}

.halman-dialog-close {
	position: absolute;
	top: 12px;
	right: 16px;
	font-size: 30px;
	line-height: 1;
	background: none;
	border: 0;
	cursor: pointer;
	color: var(--ht-dark);
}

.added-dialog-tick {
	color: #3c7a4a;
	font-weight: 700;
	margin: 0 0 6px;
}

.added-dialog h3 {
	margin: 0 0 20px;
}

.added-dialog-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px;
}

.btn-outline {
	background: transparent;
	color: var(--ht-dark);
	border-color: var(--ht-dark);
}

.btn-outline:hover {
	background: var(--ht-dark);
	color: #fff;
}

.text-link {
	background: none;
	border: 0;
	padding: 0;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--ht-bronze);
	text-decoration: underline;
	text-underline-offset: 4px;
	cursor: pointer;
}

.added-dialog .complete-the-look {
	margin: 32px -40px -40px;
	padding: 32px 40px 40px;
}

@media (max-width: 600px) {
	.halman-dialog {
		padding: 28px 16px;
	}

	.added-dialog .complete-the-look {
		margin: 24px -16px -28px;
		padding: 24px 16px;
	}
}

/* Made-to-order: override the theme's two-column variation table so options read as buttons. */
.single-product.halman-made-to-order div.product form.variations_form {
	max-width: 560px;
}

.single-product.halman-made-to-order div.product form.variations_form table.variations {
	margin: 0 0 8px !important;
}

.single-product.halman-made-to-order div.product form.variations_form .variations tr {
	display: block;
	border: 0;
}

.single-product.halman-made-to-order div.product form.variations_form .variations th.label {
	display: block;
	min-height: 0;
	padding: 0;
	background: none;
	text-align: left;
}

.single-product.halman-made-to-order div.product form.variations_form .variations th.label label {
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.1em;
	margin: 22px 0 10px;
}

.single-product.halman-made-to-order div.product form.variations_form .variations td.value {
	display: block;
	min-height: 0;
	background: none;
}

.single-product.halman-made-to-order div.product form.variations_form .variations td.value::after {
	content: none;
}

.added-dialog-actions a.btn {
	color: #fff;
}

.added-dialog-actions a.btn.btn-outline {
	color: var(--ht-dark);
}

.added-dialog-actions a.btn.btn-outline:hover {
	color: #fff;
}

.single-product.halman-made-to-order div.product .woocommerce-variation-price .price {
	font-family: var(--ht-heading-font);
	font-size: 30px;
	margin: 18px 0 14px;
	display: block;
}

/* ---------- Header: contact details, search toggle + pop-out ---------- */

.site-header .header-contact {
	display: flex;
	align-items: center;
	gap: 22px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.site-header .header-contact li {
	margin: 0;
	padding: 0;
}

.site-header .header-contact li::before {
	content: none;
}

.site-header .header-contact a {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	color: #181818;
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	white-space: nowrap;
	transition: color 0.3s ease;
}

.site-header .header-contact a:hover {
	color: var(--ht-bronze);
}

.site-header .header-contact i {
	font-size: 14px;
	color: var(--ht-bronze);
}

.site-header .header-search-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 47px;
	height: 47px;
	padding: 0;
	background: transparent;
	border: 0;
	color: #181818;
	cursor: pointer;
	transition: color 0.3s ease;
}

.site-header .header-search-toggle i {
	font-size: 19px;
}

.site-header .header-search-toggle:hover,
.site-header .header-search-toggle[aria-expanded="true"] {
	color: var(--ht-bronze);
}

.site-header .header-right {
	gap: 8px;
}

.site-header .header-right .header-button {
	margin-left: 14px;
}

.site-header .header-search-popout {
	position: absolute;
	top: calc(100% + 8px);
	right: 60px;
	z-index: 50;
	width: min(420px, calc(100vw - 36px)) !important;
	box-sizing: border-box;
	padding: 14px;
	background: var(--ht-cream);
	box-shadow: 0 12px 30px rgba(0, 0, 0, 0.08);
}

.site-header .header-search-popout:not([hidden]) {
	display: block !important;
}

.site-header .header-search-popout[hidden] {
	display: none !important;
}

.site-header .header-search-popout .header-search-form {
	background: #fff;
}

@media only screen and (max-width: 550px) {
	.site-header .header-search-popout {
		right: 18px;
	}
}

@media only screen and (max-width: 1200px) {
	.site-header .header-contact {
		gap: 16px;
	}

	.site-header .header-contact a[href^="mailto"] span {
		display: none;
	}
}

@media only screen and (max-width: 800px) {
	.site-header .header-contact {
		gap: 4px;
	}

	.site-header .header-contact a {
		width: 40px;
		height: 47px;
		justify-content: center;
	}

	.site-header .header-contact a span {
		display: none;
	}

	.site-header .header-contact i {
		font-size: 17px;
	}

	.site-header .header-search-popout .header-search-form {
		justify-content: flex-start;
		padding: 0 15px;
	}

	.site-header .header-search-popout .header-search-submit {
		margin: 0 13px 0 0;
	}

	.site-header .header-search-popout .header-search-field {
		display: block;
	}
}

/* ---------- Sample form ---------- */

.sample-form {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin-top: 12px;
}

.sample-lacquer {
	display: inline-flex;
	border: 1px solid var(--wc-design-border);
}

.sample-lacquer label {
	position: relative;
	margin: 0;
	cursor: pointer;
}

.sample-lacquer input {
	position: absolute;
	opacity: 0;
}

.sample-lacquer span {
	display: block;
	padding: 10px 12px;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.04em;
	color: #666;
	transition: background 0.2s ease, color 0.2s ease;
}

.sample-lacquer input:checked + span {
	background: var(--ht-dark);
	color: #fff;
}

.sample-lacquer input:focus-visible + span {
	outline: 2px solid var(--ht-bronze);
	outline-offset: 2px;
}

.sample-add-button {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 12px 16px;
	white-space: nowrap;
}

.sample-add-price {
	font-weight: 400;
	opacity: 0.85;
	padding-left: 10px;
	border-left: 1px solid rgba(255, 255, 255, 0.4);
}

.sample-add-button i {
	font-size: 14px;
}

.filtered-finishes-section .sample-add-button {
	width: 100%;
	justify-content: center;
}

.sample-add-price .amount {
	color: inherit;
}

.sample-form .quick-add-status {
	flex: 1 1 100%;
	font-size: 13px;
}

.sample-in-basket {
	color: #3c7a4a;
	font-weight: 700;
}

.filtered-finishes-section .sample-form {
	padding: 0 0 8px;
}

/* ---------- Finish popup ---------- */

.finish-dialog {
	width: min(1040px, calc(100vw - 32px));
	padding: 0;
}

.finish-dialog .halman-dialog-close {
	z-index: 2;
	background: rgba(249, 248, 246, 0.9);
	width: 40px;
	height: 40px;
	top: 10px;
	right: 10px;
}

.finish-dialog-grid {
	display: grid;
	grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
}

.finish-dialog-image {
	background: var(--ht-nav);
	min-height: 300px;
}

.finish-dialog-image img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	position: sticky;
	top: 0;
}

.finish-dialog-content {
	padding: 40px;
}

.finish-dialog-content h3 {
	font-size: clamp(28px, 3vw, 40px);
	margin: 4px 0 6px;
}

.finish-dialog-sub {
	color: #666;
	margin: 0 0 14px;
}

.finish-dialog-text {
	font-size: 14px;
	margin-bottom: 24px;
}

.finish-dialog-sample {
	background: #fff;
	padding: 20px 22px;
	margin-bottom: 28px;
	border-left: 3px solid var(--ht-bronze);
}

.finish-dialog-sample h4,
.finish-dialog-shop-title {
	font-size: 20px;
	margin: 0 0 6px;
}

.finish-dialog-sample p {
	font-size: 14px;
	margin: 0;
}

.finish-shop-links {
	list-style: none;
	margin: 12px 0 22px;
	padding: 0;
	display: grid;
	gap: 8px;
}

.finish-shop-links li {
	margin: 0;
	padding: 0;
}

.finish-shop-links li::before {
	content: none;
}

.finish-shop-links a {
	display: grid;
	grid-template-columns: 52px 1fr auto;
	align-items: center;
	gap: 14px;
	padding: 8px 14px 8px 8px;
	background: var(--wc-design-value);
	color: var(--ht-dark);
	transition: background 0.2s ease;
}

.finish-shop-links a:hover {
	background: var(--ht-nav);
}

.finish-shop-thumb img {
	display: block;
	width: 52px;
	height: 52px;
	object-fit: cover;
}

.finish-shop-text {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.finish-shop-text strong {
	font-size: 13px;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.finish-shop-text small {
	font-size: 12px;
	color: #666;
}

.finish-shop-links i {
	color: var(--ht-bronze);
}

@media (max-width: 760px) {
	.finish-dialog-grid {
		grid-template-columns: 1fr;
	}

	.finish-dialog-image {
		min-height: 0;
		max-height: 240px;
		overflow: hidden;
	}

	.finish-dialog-content {
		padding: 24px 18px 28px;
	}
}

/* ---------- Samples page basket bar ---------- */

.sample-bar {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 90;
	background: var(--ht-dark);
	color: #fff;
	box-shadow: 0 -8px 24px rgba(0, 0, 0, 0.12);
}

.sample-bar[hidden] {
	display: none;
}

.sample-bar-inner {
	max-width: 1320px;
	margin: 0 auto;
	padding: 14px 24px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
}

.sample-bar-count strong {
	font-size: 18px;
}

.sample-bar-actions {
	display: flex;
	align-items: center;
	gap: 18px;
}

.sample-bar .text-link {
	color: #fff;
}

.sample-bar .btn {
	padding: 12px 22px;
}

body.page-samples {
	padding-bottom: 72px;
}

.filtered-finishes-section .finishes-grid > .image-link-block {
	display: flex;
	flex-direction: column;
}

.filtered-finishes-section .finishes-grid > .image-link-block .sample-form {
	margin-top: auto;
	padding-top: 12px;
}

/* Samples page: price + buttons pinned to the card bottom so every card in a row lines up. */
.filtered-finishes-section .finishes-grid > .image-link-block .sample-form-split {
	padding-top: 14px;
}

@media (min-width: 768px) {
	.finishes-grid .image-link-block-content h4 {
		font-size: 21px;
	}
}

/* ---------- Finish landing page: shop this finish ---------- */

.finish-shop-section {
	padding: 64px 0;
	background: var(--ht-nav);
}

.finish-shop-section .section-container {
	display: grid;
	grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
	gap: 48px;
	align-items: start;
}

.finish-shop-intro h2 {
	margin: 6px 0 12px;
}

.finish-shop-section .finish-shop-links {
	margin: 0;
}

.finish-shop-section .finish-shop-links a {
	background: var(--ht-cream);
	padding: 10px 18px 10px 10px;
	grid-template-columns: 64px 1fr auto;
}

.finish-shop-section .finish-shop-thumb img {
	width: 64px;
	height: 64px;
}

@media (max-width: 860px) {
	.finish-shop-section .section-container {
		grid-template-columns: 1fr;
		gap: 24px;
	}
}

/* ---------- Home hero badges ---------- */

.banner-badges {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 14px 24px;
	margin-bottom: 18px;
}

.banner-badges .banner-rating {
	margin: 0;
}

.banner-overlay .banner-badges img.banner-mib {
	display: block;
	height: 26px !important;
	width: auto !important;
	max-width: 140px;
	padding-right: 24px;
	border-right: 1px solid rgba(255, 255, 255, 0.4);
}

/* ---------- Shorter banners on sub pages (home hero unchanged) ---------- */

/* Same height as the sub-page sliders (style.css .banner-slider = 420px). */
body:not(.home) .banner:not(.section-banner) {
	min-height: 420px;
}

/* Mobile sub-page heroes: 20% shorter (banner 280 → 224px, slider 420 → 336px). */
@media (max-width: 700px) {
	body:not(.home) .banner:not(.section-banner) {
		min-height: 224px;
	}

	body:not(.home) .banner-slider,
	body:not(.home) .banner-slider .banner-flex,
	body:not(.home) .banner-slider .slides,
	body:not(.home) .banner-slider .slides li {
		height: 336px;
	}
}

/* Hero text container: same side padding on every page on mobile / tablet. */
@media (max-width: 960px) {
	body.home .bo-container,
	body:not(.home) .bo-container {
		padding: 0 30px !important;
	}
}

/* ---------- Size & finish guide ---------- */

.sheet-guide-link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 4px 0 0;
}

.sheet-guide h3 {
	margin: 0 0 18px;
}

.sheet-guide-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 24px;
}

.sheet-guide-grid h4 {
	font-size: 18px;
	margin: 0 0 8px;
}

.sheet-guide-grid p,
.sheet-guide-grid li {
	font-size: 14px;
}

.sheet-guide-diagram {
	display: block;
	width: 100%;
	max-width: 260px;
	height: auto;
	margin: 6px 0 10px;
}

/* ---------- Bespoke quote panel (worktops, bar tops, islands) ---------- */

.bespoke-quote-panel {
	background: var(--ht-nav);
	padding: 26px 28px;
	margin: 20px 0 24px;
}

.bespoke-quote-label {
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--ht-bronze);
	margin: 0 0 12px;
}

.bespoke-quote-panel ul {
	list-style: none;
	margin: 0 0 20px;
	padding: 0;
	display: grid;
	gap: 8px;
}

.bespoke-quote-panel li {
	margin: 0;
	padding: 0;
	font-size: 15px;
}

.bespoke-quote-panel li::before {
	content: none;
}

.bespoke-quote-panel li i {
	color: var(--ht-bronze);
	margin-right: 8px;
}

.bespoke-quote-panel a.btn {
	color: #fff;
}

.bespoke-quote-phone {
	font-size: 14px;
	margin: 14px 0 0;
}

.bespoke-quote-phone a {
	color: var(--ht-dark);
	text-decoration: underline;
}

.price-on-request {
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

/* ---------- Client logos: greyscale ---------- */

.logos-section img,
.partner-logos img {
	filter: grayscale(1);
	opacity: 0.65;
	transition: filter 0.3s ease, opacity 0.3s ease;
	max-height: 90px;
	width: auto;
}

.logos-section img:hover,
.partner-logos img:hover {
	filter: grayscale(0);
	opacity: 1;
}

/* ---------- Floating "Speak to us" ---------- */

.speak-to-us {
	position: fixed;
	left: 20px;
	bottom: 20px;
	z-index: 80;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 10px;
}

body.page-samples .speak-to-us {
	bottom: 92px;
}

.speak-to-us-toggle {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 13px 18px;
	background: var(--ht-dark);
	color: #fff;
	border: 0;
	font-family: var(--ht-body-font);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	cursor: pointer;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);
	transition: background 0.3s ease;
}

.speak-to-us-toggle:hover,
.speak-to-us-toggle[aria-expanded="true"] {
	background: var(--ht-bronze);
}

.speak-to-us-panel {
	width: min(300px, calc(100vw - 40px));
	background: var(--ht-cream);
	padding: 20px 22px;
	box-shadow: 0 12px 30px rgba(0, 0, 0, 0.16);
}

.speak-to-us-panel[hidden] {
	display: none;
}

.speak-to-us-title {
	font-family: var(--ht-heading-font);
	font-size: 22px;
	margin: 0 0 6px;
}

.speak-to-us-text {
	font-size: 14px;
	margin: 0 0 14px;
}

.speak-to-us-panel ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 10px;
}

.speak-to-us-panel li {
	margin: 0;
	padding: 0;
}

.speak-to-us-panel li::before {
	content: none;
}

.speak-to-us-panel a {
	display: flex;
	align-items: center;
	gap: 10px;
	color: var(--ht-dark);
	font-size: 14px;
	word-break: break-word;
}

.speak-to-us-panel i {
	color: var(--ht-bronze);
	width: 16px;
}

@media (max-width: 600px) {
	.speak-to-us {
		left: 12px;
		bottom: 12px;
	}

	.speak-to-us-toggle {
		padding: 12px 14px;
	}
}

/* ---------- Mobile header + menu ---------- */

.site-header .mobile-menu-toggle {
	display: none;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 47px;
	padding: 0;
	background: transparent;
	border: 0;
	color: #181818;
	cursor: pointer;
}

.site-header .mobile-menu-toggle i {
	font-size: 21px;
}

/* Mobile-only menu extras: hidden on desktop. */
@media only screen and (min-width: 1101px) {
	.site-header .navigation .mobile-menu-cta,
	.site-header .navigation .submenu-toggle {
		display: none !important;
	}
}

.site-header .navigation .mobile-menu-cta {
	display: none;
}

@media only screen and (max-width: 800px) {
	.site-header .site-header-container {
		flex-wrap: nowrap;
	}

	.site-header .header-left {
		width: 30%;
	}

	.site-header .site-logo {
		width: 40%;
	}

	.site-header .header-right {
		width: 30%;
		flex-wrap: nowrap;
		gap: 0;
	}

	.site-header .header-right .header-button {
		display: none !important;
	}

}

@media only screen and (max-width: 1100px) {
	.site-header .mobile-menu-toggle {
		display: inline-flex;
	}

	.site-header .header-search-toggle,
	.site-header .header-cart {
		width: 38px;
	}

	.site-header .header-contact a {
		width: 34px;
	}

	.site-header .site-logo img {
		max-width: 132px;
	}

	body.mobile-menu-open .site-header {
		z-index: 1000;
	}

	body.mobile-menu-open .site-header .navigation {
		display: block !important;
		position: absolute;
		left: 0;
		right: 0;
		width: auto;
		margin: 0;
		box-sizing: border-box;
		top: 100%;
		z-index: 60;
		max-height: calc(100vh - 120px);
		overflow-y: auto;
		background: var(--ht-cream);
		box-shadow: 0 16px 30px rgba(0, 0, 0, 0.12);
		padding: 8px 20px 24px;
	}

	body.mobile-menu-open .site-header .navigation ul {
		position: static !important;
		float: none !important;
		height: auto !important;
		max-height: none !important;
		transform: none !important;
		display: block !important;
		width: 100% !important;
		margin: 0 !important;
		padding: 0 !important;
		list-style: none;
		background: transparent !important;
		text-align: left !important;
	}

	body.mobile-menu-open .site-header .navigation li {
		position: relative;
		float: none !important;
		height: auto !important;
		display: block !important;
		width: 100% !important;
		margin: 0 !important;
		padding: 0 !important;
		background: transparent !important;
		border-bottom: 1px solid #e7e1d9;
	}

	body.mobile-menu-open .site-header .navigation li::before {
		content: none;
	}

	body.mobile-menu-open .site-header .navigation li a {
		display: block !important;
		background: transparent !important;
		text-align: left;
		padding: 15px 44px 15px 0;
		font-size: 14px;
		font-weight: 600;
		letter-spacing: 0.08em;
		text-transform: uppercase;
		color: var(--ht-dark);
	}

	body.mobile-menu-open .site-header .navigation li ul {
		display: none !important;
		position: static !important;
		opacity: 1 !important;
		visibility: visible !important;
		transform: none !important;
		box-shadow: none !important;
		background: transparent !important;
		padding: 0 0 8px 14px !important;
		width: auto !important;
		border: 0 !important;
	}

	body.mobile-menu-open .site-header .navigation li.is-open > ul {
		display: block !important;
	}

	body.mobile-menu-open .site-header .navigation li ul li {
		border: 0;
	}

	body.mobile-menu-open .site-header .navigation li ul li a {
		padding: 10px 0;
		font-size: 13px;
		font-weight: 500;
		letter-spacing: 0.04em;
		text-transform: none;
	}

	.site-header .submenu-toggle {
		position: absolute;
		right: 0;
		top: 4px;
		width: 44px;
		height: 44px;
		background: none;
		border: 0;
		color: var(--ht-dark);
		cursor: pointer;
	}

	.site-header li.is-open > .submenu-toggle i {
		transform: rotate(180deg);
	}

	body.mobile-menu-open .site-header .navigation > * {
		float: none !important;
		position: static !important;
		width: 100% !important;
	}

	body.mobile-menu-open .site-header .navigation .mobile-menu-cta {
		display: block;
		height: auto !important;
		min-height: 0 !important;
		line-height: 20px !important;
		clear: both;
		box-sizing: border-box;
		margin-top: 20px;
		padding: 16px;
		text-align: center;
		color: #fff;
	}

	body.mobile-menu-open .site-header .navigation .mobile-menu-contact {
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 12px;
		margin-top: 20px;
		font-size: 14px;
		letter-spacing: 0.02em;
		text-transform: none;
	}

	body.mobile-menu-open .site-header .navigation .mobile-menu-contact a {
		display: inline-flex;
		align-items: center;
		gap: 10px;
		color: var(--ht-dark);
		text-transform: none !important;
		letter-spacing: 0.02em !important;
	}

	body.mobile-menu-open .site-header .navigation .mobile-menu-contact i {
		color: var(--ht-bronze);
	}

	/* Menu unfurls: the panel opens downward, then each item fades and drops in, one after another. */
	body.mobile-menu-open .site-header .navigation {
		animation: menu-unfurl 0.35s cubic-bezier(0.2, 0.7, 0.2, 1) both;
	}

	body.mobile-menu-open .site-header .navigation > div > ul > li,
	body.mobile-menu-open .site-header .navigation > ul > li,
	body.mobile-menu-open .site-header .navigation .mobile-menu-cta,
	body.mobile-menu-open .site-header .navigation .mobile-menu-contact {
		animation: menu-item-drop 0.4s cubic-bezier(0.2, 0.7, 0.2, 1) both;
		animation-delay: calc(80ms + var(--menu-i, 0) * 45ms);
	}
}

@keyframes menu-unfurl {
	from {
		clip-path: inset(0 0 100% 0);
	}

	to {
		clip-path: inset(0 0 0 0);
	}
}

@keyframes menu-item-drop {
	from {
		opacity: 0;
		transform: translateY(-12px);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	body.mobile-menu-open .site-header .navigation,
	body.mobile-menu-open .site-header .navigation * {
		animation: none !important;
	}
}

@media only screen and (max-width: 420px) {
	.site-header .header-contact a[href^="mailto"] {
		display: none;
	}

	.banner-overlay .banner-badges img.banner-mib {
		padding-right: 0;
		border-right: 0;
	}
}

@media (max-width: 600px) {
	.sample-add-button {
		font-size: 12px !important;
		padding: 12px 12px !important;
		gap: 8px;
		max-width: 100%;
		box-sizing: border-box;
	}

	.sample-add-price {
		padding-left: 8px;
	}

	.sample-bar-inner {
		padding: 12px 16px;
	}

	.sample-bar .text-link {
		display: none;
	}

	body.page-samples .speak-to-us {
		bottom: 84px;
	}
}

/* Tablet / small laptop (theme hides the desktop nav at 1100px). */
@media only screen and (min-width: 801px) and (max-width: 1100px) {
	.site-header .header-right {
		flex-wrap: nowrap;
		gap: 4px;
	}

	.site-header .header-right .header-button {
		padding: 14px 16px;
		margin-left: 8px;
		white-space: nowrap;
	}

	.site-header .header-contact a span {
		display: none;
	}

	.site-header .header-contact a {
		width: 40px;
		justify-content: center;
	}

	body.mobile-menu-open .site-header .navigation {
		padding-left: 60px;
		padding-right: 60px;
	}
}

/* ---------- Samples page: split Add to basket / View finish ---------- */

.sample-form-split {
	display: block;
}

.sample-split-top {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 6px 12px;
	margin-bottom: 10px;
}

.sample-split-top .finish-description {
	min-width: 0;
	margin: 0;
	font-size: 15px;
	line-height: 1.3;
}

.sample-split-price {
	display: block;
	margin: 0 !important;
	text-align: left;
	font-size: 15px;
	color: var(--ht-dark);
	white-space: nowrap;
}

.sample-split-top .finish-description + .sample-split-price {
	margin-left: auto !important;
}

.sample-split-price .amount {
	font-weight: 700;
	color: var(--ht-dark);
}

.sample-split-buttons {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 6px;
}

.filtered-finishes-section .sample-split-buttons .btn,
.sample-split-buttons .btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	box-sizing: border-box;
	min-width: 0;
	/* Fixed so a label wrapping to two lines doesn't make one card's buttons taller than its neighbours. */
	height: 50px;
	padding: 10px 6px !important;
	font-size: 11px !important;
	line-height: 1.25;
	letter-spacing: 0.05em;
	text-align: center;
	white-space: normal;
	background: #AB9579;
	border-color: #AB9579;
	color: #fff;
}

.sample-split-buttons .btn span {
	line-height: inherit;
}

.sample-split-buttons .btn:hover {
	background: #232121;
	border-color: #232121;
	color: #fff;
}

.sample-form-split .quick-add-status {
	display: block;
	margin: 8px 0 0 !important;
	line-height: 20px;
	height: 20px;
}

.sample-bar a.btn {
	color: #fff;
}

.sample-form-split {
	position: relative;
}

/* Keep the buttons' space while the lacquer step is open so the card doesn't change height. */
.sample-form-split [data-sample-actions][hidden] {
	display: grid !important;
	visibility: hidden;
}

.sample-form-split [data-lacquer-step][hidden] {
	display: none !important;
}

/* Gloss / Matte step: a white panel that swaps in for the buttons, styled apart from them. */
.sample-lacquer-step {
	position: absolute;
	left: 0;
	right: 0;
	/* Bottom edge lines up with the buttons it replaces (status line 20px + 8px gap below them). */
	bottom: 28px;
	z-index: 2;
	padding: 12px;
	background: #fff;
	box-shadow: 0 6px 20px rgba(35, 33, 33, 0.08);
}

.sample-lacquer-prompt {
	margin: 0 0 10px !important;
	padding: 0 24px;
	text-align: center;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.04em;
}

.sample-lacquer-cancel {
	position: absolute;
	top: 6px;
	right: 6px;
	background: none;
	border: 0;
	padding: 0 4px;
	font-size: 22px;
	line-height: 1;
	color: #666;
	cursor: pointer;
}

.sample-split-buttons .btn.sample-lacquer-option {
	background: #232121;
	border-color: #232121;
}

.sample-split-buttons .btn.sample-lacquer-option:hover,
.sample-split-buttons .btn.sample-lacquer-option:focus-visible {
	background: #AB9579;
	border-color: #AB9579;
}

.sample-lacquer-cancel:hover {
	color: var(--ht-dark);
}

.sample-split-buttons .btn.is-loading,
.sample-split-buttons .btn:disabled {
	opacity: 0.6;
}

/* ---------- Caption labels on images ---------- */

.img-label {
	position: absolute;
	left: 12px;
	bottom: 12px;
	z-index: 3;
	max-width: calc(100% - 24px);
	padding: 6px 10px;
	background: rgba(249, 248, 246, 0.92);
	color: var(--ht-dark);
	font-family: var(--ht-body-font);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.08em;
	line-height: 1.3;
	text-transform: uppercase;
	pointer-events: none;
	box-sizing: border-box;
}

.img-label[hidden] {
	display: none;
}

@media (max-width: 600px) {
	.img-label {
		left: 8px;
		bottom: 8px;
		font-size: 10px;
		padding: 5px 8px;
	}
}

.woocommerce-product-gallery .finish-chip[hidden] {
	display: none;
}

.img-label-small {
	left: 8px;
	bottom: 8px;
	max-width: calc(100% - 16px);
	padding: 4px 7px;
	font-size: 9px;
	letter-spacing: 0.06em;
}

/* ---------- Coffee table polish (Oct 3) ---------- */

/* Space between Gloss/Matte and the quantity + Add to basket row. */
fieldset.option-toggle {
	margin-bottom: 28px;
}

/* Finish picker collapsed into a dropdown. */
.finish-picker-toggle {
	display: flex;
	align-items: center;
	gap: 12px;
	width: 100%;
	max-width: 560px;
	padding: 10px 16px 10px 10px;
	background: var(--wc-design-value);
	border: 1px solid transparent;
	color: var(--ht-dark);
	font-family: var(--ht-body-font);
	font-size: 14px;
	text-align: left;
	cursor: pointer;
	transition: border-color 0.2s ease;
}

.finish-picker-toggle:hover,
.finish-picker-toggle[aria-expanded="true"] {
	border-color: var(--ht-dark);
	background: #fff;
}

.finish-picker-current {
	flex: 0 0 36px;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	overflow: hidden;
	background: linear-gradient(135deg, #e8dfd3, #cbbba5);
	box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1);
}

.finish-picker-current img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.finish-picker-name {
	flex: 1;
	font-weight: 600;
}

.finish-picker-toggle i {
	transition: transform 0.2s ease;
}

.finish-picker-toggle[aria-expanded="true"] i {
	transform: rotate(180deg);
}

.finish-picker-panel {
	max-width: 560px;
	margin-top: 8px;
	padding: 6px 14px 10px;
	background: #fff;
	border: 1px solid var(--wc-design-border);
}

.finish-picker-panel[hidden] {
	display: none;
}

.finish-picker-panel .finish-picker-group:first-child {
	border-top: 0;
}

.finish-picker-error {
	color: #a33;
	font-size: 13px;
	margin: 8px 0 0;
}

.finish-picker-error[hidden] {
	display: none;
}

/* "From" matches the price beside it. */
.price .price-from {
	margin-right: 2px;
}

/* ---------- Edge-to-edge sections inside product pages ---------- */

body {
	overflow-x: clip;
}

.single-product .complete-the-look,
.single-product .image-text-section.bespoke-box {
	width: 100vw;
	max-width: none;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	box-sizing: border-box;
	--edge-offset: max(60px, calc((100vw - 1600px) / 2));
}

.single-product .complete-the-look {
	padding: 64px var(--edge-offset);
}

.single-product .complete-the-look-inner {
	max-width: 1600px;
	margin: 0 auto;
}

@media (max-width: 800px) {
	.single-product .complete-the-look {
		padding: 40px 20px;
	}

}

/* Complete the look in the added-to-basket dialog stays boxed. */
.added-dialog .complete-the-look {
	width: auto;
	margin-left: -40px;
	margin-right: -40px;
}

.single-product .bespoke-box + .woocommerce-tabs,
.single-product .bespoke-box ~ .woocommerce-tabs {
	margin-top: 60px;
}

/* ---------- Upsell cards: image flush, padding on the body only ---------- */

.upsell-card {
	padding: 0;
	gap: 0;
	overflow: hidden;
}

.upsell-card-image {
	display: block;
}

.upsell-card-image img {
	display: block;
	margin: 0;
}

.upsell-card .upsell-card-body {
	padding: 20px;
}

/* Quick add selects styled like the product page options (square, beige, chevron). */
.quick-add-field select {
	box-sizing: border-box;
	width: 100%;
	height: 46px;
	margin: 0;
	padding: 0 38px 0 14px;
	border: 0;
	border-radius: 0;
	outline: 0;
	background-color: var(--wc-design-value);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23111' stroke-width='1.6'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 14px center;
	background-size: 10px 6px;
	color: var(--wc-design-text);
	font-family: inherit;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 1.1px;
	text-transform: uppercase;
	text-overflow: ellipsis;
	white-space: nowrap;
	cursor: pointer;
	appearance: none;
	-webkit-appearance: none;
	transition: box-shadow 0.2s ease;
}

.quick-add-field select:hover {
	box-shadow: inset 0 0 0 1px var(--ht-bronze);
}

.quick-add-field select:focus-visible {
	box-shadow: inset 0 0 0 2px var(--ht-dark);
}

.quick-add-field > span {
	color: var(--ht-dark);
}

.quick-add {
	gap: 12px 10px;
}

.quick-add-field select {
	padding: 0 28px 0 12px;
	background-position: right 11px center;
	letter-spacing: 0.4px;
}

/* Shape + pack side by side when there's room, stacked on narrow cards. */
.upsell-card .quick-add {
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
}

.upsell-card .quick-add-field:first-of-type,
.upsell-card .quick-add-button,
.upsell-card .quick-add-status {
	grid-column: 1 / -1;
}

/* Bespoke section on product pages: home page Image & Text styles, full width. */
.single-product .image-text-section.bespoke-box {
	clear: both;
	margin-top: 0;
	margin-bottom: 0;
}

/* ---------- Logos section: title inline with logos ---------- */

.logos-inline {
	flex-wrap: nowrap;
	justify-content: center;
	gap: 48px;
}

/* The next section brings its own top padding, so the logo strip doesn't add more below. */
.padding:has(> .logos-inline) {
	padding-bottom: 0;
}

.logos-inline .logos-inline-title {
	flex: 0 0 auto;
	margin: 0;
	white-space: nowrap;
}

.logos-inline .logos-section {
	flex: 0 1 auto;
	justify-content: center;
	flex-wrap: nowrap;
	gap: 40px;
}

.logos-inline .ls-logo-container {
	flex: 0 1 auto;
	width: auto;
	margin: 0;
}

.logos-inline .ls-logo-padding {
	padding: 0;
}

.logos-inline img.ls-logo {
	display: block;
	max-height: 56px;
	max-width: 140px;
	width: auto;
	height: auto;
}

@media (max-width: 900px) {
	.logos-inline {
		flex-wrap: wrap;
		gap: 20px;
	}

	.logos-inline .logos-inline-title {
		flex-basis: 100%;
		text-align: center;
	}

	.logos-inline .logos-section {
		flex-wrap: wrap;
		justify-content: center;
		gap: 24px 32px;
	}

	.logos-inline img.ls-logo {
		max-height: 44px;
		max-width: 110px;
	}
}

/* SVG logos without their own width/height collapse in a flex row, so size by height. */
.logos-inline img.ls-logo {
	height: 52px;
	width: auto;
	max-width: 150px;
	object-fit: contain;
}

.logos-inline .ls-logo-container {
	flex-shrink: 0;
}

@media (max-width: 900px) {
	.logos-inline img.ls-logo {
		height: 40px;
		max-width: 110px;
	}
}

/* Phone + email copied into the nav for the mobile menu only. */
.site-header .navigation .mobile-menu-contact {
	display: none;
}

/* =====================================================================
   Header style: top bar (Website Info → Header style = "Top bar").
   Classic header styles above are untouched, so switching back just works.
   ===================================================================== */

.top-bar {
	background: #AB9579;
	color: #fff;
	font-family: var(--ht-body-font);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.top-bar-inner {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	gap: 16px;
	max-width: 1600px;
	min-height: 38px;
	margin: 0 auto;
	padding: 0 60px;
}

.top-bar a,
.top-bar span {
	color: #fff;
}

.top-bar a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	transition: opacity 0.2s ease;
}

.top-bar a:hover {
	opacity: 0.8;
	color: #fff;
}

.top-bar i {
	font-size: 12px;
}

.top-bar-centre {
	text-align: center;
}

.top-bar-right {
	text-align: right;
	justify-self: end;
}

.site-header--bar .site-header-container {
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: center;
	gap: 24px;
	max-width: 1600px;
	margin: 0 auto;
	padding: 18px 60px;
	position: relative;
}

.site-header--bar .site-logo {
	width: auto;
	flex: 0 0 auto;
	text-align: left;
}

.site-header--bar .site-logo img {
	max-width: 210px;
	max-height: 60px;
	margin: 0;
}

.site-header--bar .header-right {
	width: auto;
	flex: 0 0 auto;
	gap: 10px;
}

.site-header--bar .header-right .header-button {
	margin-left: 18px;
}

.site-header--bar .header-cart i {
	font-size: 21px;
}

/* Desktop: menu sits inline between logo and icons. */
@media only screen and (min-width: 1101px) {
	.site-header--bar .navigation {
		display: block;
		flex: 1 1 auto;
		width: auto;
		margin: 0;
		background: transparent;
	}

	.site-header--bar .navigation ul.menu {
		flex-wrap: nowrap;
		justify-content: center;
	}

	.site-header--bar .navigation ul.menu > li {
		margin: 0 4px;
	}

	.site-header--bar .navigation ul.menu > li > a {
		font-size: 13px;
		padding: 12px 14px;
	}
}

/* Tablet / mobile: menu button opens the menu panel (shared mobile menu styles). */
@media only screen and (max-width: 1100px) {
	.site-header--bar .site-header-container,
	.site-header--bar.active .site-header-container {
		padding: 14px 24px;
	}

	.site-header--bar .navigation {
		background: var(--ht-cream);
	}
}

@media only screen and (max-width: 800px) {
	.top-bar-inner {
		grid-template-columns: auto 1fr auto;
		padding: 0 16px;
		min-height: 34px;
		font-size: 10px;
	}

	.top-bar-left span,
	.top-bar-right span {
		display: none;
	}

	.top-bar i {
		font-size: 14px;
	}

	.site-header--bar .site-header-container,
	.site-header--bar.active .site-header-container {
		padding: 12px 16px;
		gap: 8px;
	}

	.site-header--bar .site-logo,
	.site-header--bar .header-right {
		width: auto;
	}

	.site-header--bar .site-logo img {
		max-width: 150px;
	}
}

/* style.css sets the logo to width:100% (height:auto !important), which collapses in a
   content-sized flex item — give it an explicit width instead. */
.site-header--bar .site-logo a.logo-dark {
	display: block;
	width: auto;
}

.site-header--bar .site-logo img {
	width: 200px;
	max-width: none;
	max-height: none;
}

@media only screen and (max-width: 1100px) {
	.site-header--bar .site-logo img {
		width: 170px;
	}
}

@media only screen and (max-width: 800px) {
	.site-header--bar .site-logo img {
		width: 140px;
	}
}

/* Top bar header: shorter, and stop the logo's right edge being clipped. */
.site-header--bar .site-header-container {
	padding-top: 10px;
	padding-bottom: 10px;
}

.site-header--bar .site-logo,
.site-header--bar .site-logo a.logo-dark {
	overflow: visible;
	max-width: none;
}

.site-header--bar .site-logo img {
	width: 175px !important;
	max-width: none !important;
	overflow: visible;
	padding-right: 2px;
}

@media only screen and (max-width: 1100px) {
	.site-header--bar .site-logo img {
		width: 160px !important;
	}
}

@media only screen and (max-width: 800px) {
	.site-header--bar .site-header-container,
	.site-header--bar.active .site-header-container {
		padding-top: 8px;
		padding-bottom: 8px;
	}

	.site-header--bar .site-logo img {
		width: 135px !important;
	}
}

/* Inline logos: smaller title, logos grouped 40px apart rather than spread across the row. */
.logos-inline {
	gap: 40px;
}

.logos-inline .logos-inline-title {
	font-size: 24px;
	line-height: 1.2;
}

.logos-inline .logos-section {
	flex: 0 1 auto;
	justify-content: flex-start;
	gap: 40px;
}

@media (max-width: 900px) {
	.logos-inline .logos-inline-title {
		font-size: 20px;
	}

	.logos-inline .logos-section {
		gap: 24px 32px;
	}
}

/* Top bar header, desktop: logo | centred menu | icons. A 3-column grid keeps the menu
   centred on the page regardless of the logo and button widths. */
@media only screen and (min-width: 1101px) {
	.site-header--bar .site-header-container {
		display: grid;
		grid-template-columns: 1fr auto 1fr;
		column-gap: 24px;
	}

	.site-header--bar .site-logo {
		justify-self: start;
	}

	.site-header--bar .navigation {
		justify-self: center;
	}

	.site-header--bar .header-right {
		justify-self: end;
	}

	.site-header--bar .navigation ul.menu > li {
		position: relative;
	}

	.site-header--bar .navigation .sub-menu {
		left: 0;
		min-width: 220px;
	}
}

/* Smaller Order samples button, same font size as the menu. */
.site-header--bar .header-right .header-button {
	padding: 12px 18px;
	font-size: 13px;
	line-height: 1.2;
	letter-spacing: 0.08em;
	margin-left: 10px;
}

.site-header--bar .header-right {
	flex-wrap: nowrap;
}

.site-header--bar .header-right .header-button {
	white-space: nowrap;
	flex: 0 0 auto;
}

/* ---------- Speak to us: bottom right, gold, gentle pulse ---------- */

.speak-to-us {
	left: auto;
	right: 20px;
	align-items: flex-end; /* panel opens above; button stays on the right */
}

.speak-to-us-toggle {
	background: #AB9579;
	color: #fff;
	animation: speak-to-us-pulse 2.8s ease-out infinite;
}

.speak-to-us-toggle:hover,
.speak-to-us-toggle[aria-expanded="true"] {
	background: var(--ht-dark);
	color: #fff;
}

.speak-to-us-toggle[aria-expanded="true"],
.speak-to-us-toggle:hover {
	animation: none;
}

@keyframes speak-to-us-pulse {
	0% {
		box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18), 0 0 0 0 rgba(171, 149, 121, 0.55);
	}
	70% {
		box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18), 0 0 0 14px rgba(171, 149, 121, 0);
	}
	100% {
		box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18), 0 0 0 0 rgba(171, 149, 121, 0);
	}
}

@media (prefers-reduced-motion: reduce) {
	.speak-to-us-toggle {
		animation: none;
	}
}

.speak-to-us-panel .speak-to-us-title {
	margin: 0 0 6px !important;
	padding: 0 !important;
	line-height: 1.2;
}

.speak-to-us-panel .speak-to-us-text,
.speak-to-us-panel li,
.speak-to-us-panel a {
	font-size: 16px;
}

.speak-to-us-panel .speak-to-us-text {
	margin: 0 0 14px !important;
	padding: 0 !important;
	line-height: 1.45;
}

@media (max-width: 600px) {
	.speak-to-us {
		left: auto;
		right: 12px;
	}
}

.speak-to-us-panel li[hidden] {
	display: none;
}

.speak-to-us-chat {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 0;
	background: none;
	border: 0;
	color: var(--ht-dark);
	font-family: inherit;
	font-size: 16px;
	cursor: pointer;
}

.speak-to-us-chat i {
	color: var(--ht-bronze);
	width: 16px;
}

.speak-to-us-chat:hover {
	color: var(--ht-bronze);
}

/* Speak to us: metallic gold shimmer across the button itself (replaces the outer pulse,
   so nothing outside the button moves). */
.speak-to-us-toggle {
	animation: speak-to-us-shimmer 4s linear infinite;
	background-color: #AB9579;
	background-image: linear-gradient(
		110deg,
		#9c8669 0%,
		#AB9579 35%,
		#d9c7a7 50%,
		#AB9579 65%,
		#9c8669 100%
	);
	background-size: 250% 100%;
	background-position: 100% 0;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);
}

@keyframes speak-to-us-shimmer {
	0% {
		background-position: 100% 0;
	}
	60%,
	100% {
		background-position: -150% 0;
	}
}

.speak-to-us-toggle:hover,
.speak-to-us-toggle[aria-expanded="true"] {
	animation: none;
	background-image: none;
	background-color: var(--ht-dark);
}

@media (prefers-reduced-motion: reduce) {
	.speak-to-us-toggle {
		animation: none;
	}
}

.site-header--bar .header-right .header-button {
	padding: 15px 18px;
	letter-spacing: 0.1em;
	font-weight: 600;
}

/* Search pop-out: include the form's padding/border in its width so it stays inside the box. */
.site-header .header-search-popout .header-search-form {
	box-sizing: border-box;
	width: 100%;
	max-width: 100%;
}

/* ---------- Added-to-basket dialog: image left, details right ---------- */

.added-dialog-top {
	display: grid;
	grid-template-columns: 220px minmax(0, 1fr);
	gap: 32px;
	align-items: center;
}

.added-dialog-image img {
	display: block;
	width: 100%;
	aspect-ratio: 1;
	object-fit: cover;
}

.added-dialog-info h3 {
	margin: 0 0 8px;
}

.added-dialog-meta {
	font-size: 14px;
	color: #666;
	margin-bottom: 6px;
}

.added-dialog-price {
	font-size: 20px;
	font-weight: 600;
	margin: 0 0 18px;
}

.added-dialog-price .amount {
	color: var(--ht-dark);
}

/* Keep "Complete the look" inside the dialog (product pages make it full-bleed). */
.single-product .added-dialog .complete-the-look,
.added-dialog .complete-the-look {
	width: auto;
	max-width: none;
	margin: 32px -40px -40px;
	padding: 32px 40px 40px;
}

@media (max-width: 600px) {
	.added-dialog-top {
		grid-template-columns: 96px minmax(0, 1fr);
		gap: 16px;
		align-items: start;
	}

	.added-dialog-info h3 {
		font-size: 22px;
	}

	.added-dialog-price {
		font-size: 17px;
		margin-bottom: 14px;
	}

	.added-dialog-actions {
		grid-column: 1 / -1;
	}

	.added-dialog-actions .btn {
		padding: 12px 14px;
	}

	.single-product .added-dialog .complete-the-look,
	.added-dialog .complete-the-look {
		margin: 24px -16px -28px;
		padding: 24px 16px 28px;
	}
}

/* Mobile: section containers were content-box (90% width + 40px padding each side), so the
   footer "Create something extraordinary" block made every page ~42px wider than a phone,
   making browsers zoom out and content sit tight to the screen edges. */
@media (max-width: 767px) {
	.section-container {
		box-sizing: border-box;
		max-width: 100%;
	}
}

/* Form fields never wider than their container (a fixed-width textarea pushed the Bespoke page
   wider than phones). */
textarea,
input,
select {
	max-width: 100%;
	box-sizing: border-box;
}

@media (max-width: 600px) {
	.halman-dialog {
		width: calc(100vw - 24px);
		max-width: calc(100vw - 24px);
		margin-left: auto;
		margin-right: auto;
	}
}

/* ---------- Checkout / account checkboxes: square, gold with white tick when checked ---------- */

.woocommerce input[type="checkbox"],
.woocommerce form .form-row input[type="checkbox"] {
	-webkit-appearance: none;
	appearance: none;
	display: inline-block !important;
	flex: 0 0 auto;
	min-width: 20px;
	width: 20px;
	height: 20px;
	margin: 0 10px 0 0;
	padding: 0;
	border: 1px solid #b9ab97;
	border-radius: 0;
	background: #fff;
	vertical-align: -4px;
	cursor: pointer;
	position: relative;
	transition: background-color 0.15s ease, border-color 0.15s ease;
}

.woocommerce input[type="checkbox"]:hover {
	border-color: #AB9579;
}

.woocommerce input[type="checkbox"]:checked,
.woocommerce form .form-row input[type="checkbox"]:checked {
	background-color: #AB9579;
	border-color: #AB9579;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5 10.5l3.2 3.2L15 6.8' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='square'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
	background-size: 16px 16px;
}

.woocommerce input[type="checkbox"]:focus-visible {
	outline: 2px solid var(--ht-dark);
	outline-offset: 2px;
}

/* Line the box up with its label text; wrapped lines align with the text, not under the box. */
.woocommerce form .form-row label.checkbox,
.woocommerce form label.woocommerce-form__label-for-checkbox,
.woocommerce label.woocommerce-form__label-for-checkbox {
	display: block !important;
	position: relative;
	padding-left: 32px;
	line-height: 1.5;
	cursor: pointer;
}

.woocommerce form .form-row label.checkbox input[type="checkbox"],
.woocommerce label.woocommerce-form__label-for-checkbox input[type="checkbox"] {
	position: absolute;
	left: 0;
	top: 2px;
	margin: 0;
}

/* Portrait phones: the gold bar keeps just its message; phone + email move into the menu. */
@media (max-width: 600px) and (orientation: portrait) {
	.top-bar-left,
	.top-bar-right {
		display: none;
	}

	.top-bar-inner {
		grid-template-columns: 1fr;
		text-align: center;
	}
}

/* =====================================================================
   Mobile spacing: ~30px from the screen edge and ~30px between blocks.
   Overrides the theme's 40–60px mobile padding (some of it !important).
   ===================================================================== */

@media (max-width: 767px) {
	.section-container,
	.text-container,
	.padding,
	.image-text-section .flex-container {
		padding: 30px !important;
	}

	.image-text-section.slider-and-text .flex-container {
		padding: 30px 0 !important;
	}

	/* Containers nested inside an already padded container don't add more side padding. */
	.section-container .inner-container,
	.padding .inner-container,
	.testimonial .padding.inner-container {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	/* Horizontal scrollers (home "explore", finishes) line up with everything else.
	   !important because the scroller template prints its own inline <style>. */
	.image-link-blocks-section {
		--container-offset: 30px !important;
		padding-top: 30px !important;
		padding-bottom: 30px !important;
	}

	/* These sections already have 30px top/bottom, so their inner containers don't add more. */
	.image-link-blocks-section .padding-vertical,
	.image-link-blocks-section .section-container,
	.image-link-blocks-section .padding,
	.finish-shop-section .section-container {
		padding-top: 0 !important;
		padding-bottom: 0 !important;
	}

	.image-link-blocks-header + .finishes-grid {
		margin-top: 0 !important;
	}

	/* The last thing in a block doesn't push the section's bottom padding further down. */
	.inner-container > :last-child,
	.text-container > :last-child,
	.finish-description > :last-child,
	.finish-hero-content > :last-child,
	.finish-sample-content > :last-child,
	.featured-products-section li:last-child,
	.inner-container > :has(+ p:empty:last-child) {
		margin-bottom: 0 !important;
	}

	.testimonials-section .padding.inner-container,
	.finish-sample-content {
		padding-top: 0 !important;
		padding-bottom: 0 !important;
	}

	.finish-hero-content {
		padding-bottom: 30px !important;
	}

	.testimonials-section .testimonial-navigation {
		padding-top: 0 !important;
	}

	/* Overlapping images pull up by the section padding only, so they don't cover the section above. */
	.overlap-section .image-container {
		margin-top: -30px !important;
	}

	.image-link-blocks-track {
		padding-right: 30px !important;
	}

	.horz-scroller .image-link-blocks-track {
		margin: 0;
	}

	.image-link-blocks-header {
		margin-bottom: 24px !important;
		padding-right: 30px !important;
	}

	.image-link-blocks-controls {
		margin-top: 24px !important;
		margin-bottom: 0 !important;
	}

	.finishes-home-scroller .finishes-home-toolbar {
		margin: 0 30px 24px !important;
	}

	.finishes-grid {
		margin-top: 30px !important;
	}

	.splashback-metal {
		margin-top: 30px;
	}

	.finish-shop-section {
		padding: 30px 0;
	}

	.contact-section {
		padding-bottom: 30px !important;
	}

	/* Shop pages. */
	.woocommerce .site-main {
		padding: 30px;
	}

	.single-product .site-main .related.products {
		margin-left: -30px;
		margin-right: -30px;
		margin-bottom: -30px;
		padding: 30px;
	}

	.woocommerce div.product .woocommerce-tabs,
	.complete-the-look {
		margin-top: 30px !important;
	}

	.complete-the-look {
		padding: 30px !important;
	}

	.woocommerce ul.products li.product,
	.woocommerce ul.products[class*="columns-"] li.product,
	.woocommerce-page ul.products[class*="columns-"] li.product {
		margin-bottom: 30px !important;
	}
}

/* ---------- Product info accordion (Description / Care guide / Delivery & returns) ---------- */

.product-info-accordion {
	clear: both;
	margin: 28px 0;
}

.product-info-item {
	border-bottom: 1px solid var(--wc-design-border, #e7e1d9);
}

.product-info-item:last-child {
	border-bottom: 0;
}

.product-info-item summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 18px 0;
	list-style: none;
	cursor: pointer;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--ht-dark);
}

.product-info-item summary::-webkit-details-marker {
	display: none;
}

.product-info-item summary i {
	font-size: 14px;
	transition: transform 0.25s ease;
}

.product-info-item[open] summary i {
	transform: rotate(180deg);
}

.product-info-item summary:focus-visible {
	outline: 2px solid var(--ht-bronze);
	outline-offset: 4px;
}

.product-info-content {
	padding: 0 0 20px;
	font-size: 16px;
	line-height: 1.6;
}

/* Some descriptions are pasted in as <div>s (with empty ones between) rather than paragraphs. */
.product-info-content div:empty {
	display: none;
}

.product-info-content div:not(:empty) ~ div:not(:empty) {
	margin-top: 12px;
}

.product-info-content > :last-child {
	margin-bottom: 0 !important;
}

.product-info-content p {
	margin-bottom: 12px !important;
}

.product-info-content ul {
	margin: 0 0 12px;
	padding-left: 20px;
}

.product-info-content li {
	margin: 0 !important;
	padding: 0 0 4px !important;
}

.product-info-content a {
	color: var(--ht-bronze);
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* Inline text links on product pages (accordion, reassurance list, summary copy). */
.single-product .summary p a:not(.btn):not(.button),
.single-product .summary li a:not(.btn):not(.button),
.product-info-content a,
.sheet-reassurance a {
	font-weight: 600;
}

/* Left-aligned wide intros: keep the paragraph to a readable line length. */
.intro .section-container.wide:not(.center) > p {
	max-width: 800px;
}

/* ---------- WooCommerce: brand gold instead of WooCommerce's default #958e09 ---------- */

:root {
	--wc-highlight: #AB9579;
}

.woocommerce span.onsale {
	background-color: #AB9579;
}

.woocommerce div.product p.price,
.woocommerce div.product span.price,
.woocommerce div.product .stock,
.woocommerce ul.products li.product .price,
#add_payment_method .cart-collaterals .cart_totals .discount td,
.woocommerce-cart .cart-collaterals .cart_totals .discount td,
.woocommerce-checkout .cart-collaterals .cart_totals .discount td {
	color: #AB9579;
}

/* ---------- WooCommerce product lists ---------- */

/* !important: the theme's responsive h2 sizes (30–35px) are !important. */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
	font-size: 24px !important;
}

/* Exactly three products: three equal columns, 40px apart, instead of three of four slots. */
@media (min-width: 768px) {
	.woocommerce ul.products:has(> li.product:nth-child(3):last-child) {
		display: grid;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 40px;
	}

	.woocommerce ul.products:has(> li.product:nth-child(3):last-child)::before,
	.woocommerce ul.products:has(> li.product:nth-child(3):last-child)::after {
		content: none;
	}

	.woocommerce ul.products:has(> li.product:nth-child(3):last-child) > li.product {
		float: none;
		width: auto;
		margin: 0;
	}
}

/* ---------- Gravity Forms dropdowns: Font Awesome angle-down on the right ---------- */

.gform_wrapper .ginput_container_select {
	position: relative;
}

.gform_wrapper .ginput_container_select::after {
	content: "\f107"; /* fa-angle-down */
	position: absolute;
	top: 50%;
	right: 18px;
	transform: translateY(-50%);
	font-family: "Font Awesome 6 Pro";
	font-weight: 400;
	font-size: 18px;
	line-height: 1;
	color: var(--ht-dark);
	pointer-events: none;
}

.gform_wrapper .ginput_container_select select {
	padding-right: 50px !important;
}

/* ---------- Contact page: more room at the top and before the form ---------- */

.contact-section .gform_wrapper {
	margin-top: 36px;
}

@media (min-width: 768px) {
	.contact-section > .section-container {
		padding-top: 90px;
	}
}

@media (min-width: 1101px) {
	.contact-section > .section-container {
		padding-top: 120px;
	}
}