/**
 * Single product — Figma 613:3777 (gallery + summary).
 */

.product-single__section {
	padding-block: var(--space-80);
	background-color: var(--color-bg-white);
}

.product-single__layout {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	justify-content: center;
	gap: 1.9375rem; /* 31px */
}

.product-single__layout .woocommerce-product-gallery {
	flex: 0 1 36.4375rem; /* 583px */
	width: 100%;
	max-width: 36.4375rem;
	min-width: 0;
}

.product-single__summary {
	flex: 0 1 35.5rem; /* 568px */
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: var(--space-16);
	width: 100%;
	max-width: 35.5rem;
	min-width: 0;
	margin: 0;
	float: none;
}

.product-single__summary > * + * {
	margin-top: 0;
}

.product-single__eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 0.625rem;
	margin: 0;
	padding-block: 0.625rem;
	color: var(--color-brand-secondary);
	font-family: var(--font-sans);
	font-size: var(--text-eyebrow-size);
	font-weight: var(--text-body-weight);
	line-height: var(--text-eyebrow-line-height);
	letter-spacing: var(--text-eyebrow-letter-spacing);
	text-transform: uppercase;
}

.product-single__eyebrow::before {
	content: '';
	flex: 0 0 auto;
	width: 1rem;
	height: 1px;
	background-color: currentColor;
}

.product-single__title {
	margin: 0;
	color: var(--color-near-black);
	font-family: var(--font-sans);
	font-size: var(--text-display-md-size);
	font-weight: var(--text-display-md-weight);
	line-height: var(--text-heading-line-height);
	letter-spacing: var(--text-heading-letter-spacing);
	text-transform: uppercase;
}

.product-single__description {
	margin: 0;
	color: var(--color-text-tertiary);
	font-family: var(--font-sans);
	font-size: var(--text-body-lg-size);
	font-weight: var(--text-body-lg-weight);
	line-height: var(--text-body-line-height);
	letter-spacing: var(--text-body-letter-spacing);
}

.product-single__description > *:first-child {
	margin-top: 0;
}

.product-single__description > *:last-child {
	margin-bottom: 0;
}

.product-single__description p {
	margin: 0 0 var(--space-16);
}

.product-single__description p:last-child {
	margin-bottom: 0;
}

.product-single__enquire {
	margin-top: 2.8125rem; /* 45px + 16px flex gap = 61px */
	min-width: 17.25rem; /* 276px */
}

/* —— Gallery frames —— */

.product-single .woocommerce-product-gallery__wrapper {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-20) 1.0625rem; /* 20px / 17px */
}

.product-single .woocommerce-product-gallery__image:first-child {
	flex: 0 0 100%;
	box-sizing: border-box;
	height: 26.3125rem; /* 421px */
	padding: 5.375rem 3.25rem; /* 86px / 52px */
	border: 1px solid var(--color-blue-200);
	background-color: var(--color-bg-white);
}

.product-single .woocommerce-product-gallery__image:first-child a,
.product-single .woocommerce-product-gallery__image:first-child img {
	display: block;
	width: 100%;
	height: 100%;
}

.product-single .woocommerce-product-gallery__image:first-child img {
	object-fit: contain;
	background-color: var(--color-bg-grey);
}

.product-single .woocommerce-product-gallery__image:not(:first-child) {
	flex: 0 0 calc((100% - 2.125rem) / 3);
	max-width: 11.4375rem; /* 183px */
	box-sizing: border-box;
	height: 8.625rem; /* 138px */
	padding: 1.75rem 1rem;
	border: 1px solid var(--color-blue-200);
	background-color: var(--color-bg-white);
}

.product-single .woocommerce-product-gallery__image:not(:first-child) a,
.product-single .woocommerce-product-gallery__image:not(:first-child) img {
	display: block;
	width: 100%;
	height: 100%;
}

.product-single .woocommerce-product-gallery__image:not(:first-child) img {
	object-fit: contain;
	background-color: var(--color-bg-grey);
}

.product-single .woocommerce-product-gallery__trigger {
	display: none;
}

@media (max-width: 767px) {
	.product-single__section {
		padding-block: var(--space-48);
	}

	.product-single__layout {
		flex-direction: column;
	}

	.product-single .woocommerce-product-gallery__image:not(:first-child) {
		flex: 1 1 calc(33.333% - 1rem);
		max-width: none;
	}
}

/**
 * Product information tabs — Figma 613:3779.
 */

.product-info-tabs {
	padding-block: 2.75rem var(--space-80); /* 44px top */
	background-color: var(--color-bg-white);
}

.product-info-tabs__inner {
	display: flex;
	flex-direction: column;
	gap: 3.125rem; /* 50px */
}

.product-info-tabs__tabs-wrap {
	width: 100%;
	border-bottom: 0.5px solid var(--color-brand-secondary);
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

.product-info-tabs__tabs {
	display: inline-flex;
	flex-wrap: nowrap;
	gap: 2px;
	min-width: min(100%, 77.625rem); /* 1242px tab row */
}

.product-info-tabs__tab {
	flex: 1 1 19.375rem; /* 310px */
	min-width: 12rem;
	margin: 0;
	padding: 1.125rem 1.875rem; /* 18px / 30px */
	border: 0;
	background-color: var(--color-steel);
	color: var(--color-text-inverse);
	font-family: var(--font-sans);
	font-size: 0.9375rem; /* 15px */
	font-weight: var(--btn-angled-font-weight);
	line-height: var(--btn-angled-line-height);
	letter-spacing: var(--btn-angled-letter-spacing);
	text-transform: uppercase;
	cursor: pointer;
	transition: background-color 0.2s ease;
}

.product-info-tabs__tab.is-active,
.product-info-tabs__tab[aria-selected='true'] {
	background-color: var(--color-brand-secondary);
}

.product-info-tabs__tab:focus-visible {
	outline: 2px solid var(--color-brand-secondary);
	outline-offset: 2px;
}

.product-info-tabs__tab-label {
	display: block;
	white-space: nowrap;
}

.product-info-tabs__panels {
	width: 100%;
	max-width: 74.125rem; /* 1186px */
	margin-inline: auto;
}

.product-info-tabs__panel {
	display: flex;
	flex-direction: column;
	gap: 2.0625rem; /* 33px */
}

.product-info-tabs__panel[hidden] {
	display: none !important;
}

.product-info-tabs__panel-title {
	margin: 0;
	color: var(--color-near-black);
	font-family: var(--font-sans);
	font-size: var(--text-h2-size);
	font-weight: var(--text-h2-weight);
	line-height: 2.5rem;
	letter-spacing: -0.015625rem;
	text-transform: uppercase;
}

.product-info-tabs__panel-body {
	color: var(--color-text-tertiary);
	font-family: var(--font-sans);
	font-size: var(--text-body-lg-size);
	font-weight: var(--text-body-lg-weight);
	line-height: var(--text-body-line-height);
	letter-spacing: var(--text-body-letter-spacing);
}

.product-info-tabs__panel-body > *:first-child {
	margin-top: 0;
}

.product-info-tabs__panel-body > *:last-child {
	margin-bottom: 0;
}

.product-info-tabs__panel-body p {
	margin: 0 0 var(--space-16);
}

.product-info-tabs__panel-body p:last-child {
	margin-bottom: 0;
}

.product-info-tabs__panel-body ul,
.product-info-tabs__panel-body ol {
	margin: 0 0 var(--space-16);
	padding-left: 1.25rem;
}

@media (max-width: 767px) {
	.product-info-tabs {
		padding-block: var(--space-32) var(--space-48);
	}

	.product-info-tabs__inner {
		gap: var(--space-32);
	}

	.product-info-tabs__tab {
		flex: 0 0 auto;
		min-width: 10rem;
	}
}

/**
 * Similar products — Figma 613:3782.
 */

.similar-products {
	padding-block: 5.5rem var(--space-80); /* 88px top */
	background-color: var(--color-bg-white);
}

.similar-products__inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 3.875rem; /* 62px */
}

.similar-products__heading {
	margin: 0;
	color: var(--color-near-black);
	font-family: var(--font-sans);
	font-size: var(--text-h2-size);
	font-weight: var(--text-h2-weight);
	line-height: 2.5rem;
	letter-spacing: -0.015625rem;
	text-align: center;
	text-transform: uppercase;
}

.similar-products__grid.product-catalogue__grid {
	display: grid;
	grid-template-columns: repeat(3, 18rem); /* 288px × 3 — Figma 613:3782 */
	justify-content: center;
	gap: var(--space-32);
	width: 100%;
	max-width: 58rem; /* 928px = 3×288 + 2×32 */
	margin: 0;
	padding: 0;
	list-style: none;
}

.similar-products__item {
	min-width: 0;
	max-width: none;
	width: auto;
}

@media (max-width: 1439px) {
	.similar-products__grid.product-catalogue__grid {
		grid-template-columns: repeat(3, 18rem);
		max-width: 58rem;
	}
}

@media (max-width: 991px) {
	.similar-products__grid.product-catalogue__grid {
		grid-template-columns: repeat(2, minmax(0, 18rem));
		max-width: 38rem; /* 2×288 + 32 */
	}
}

@media (max-width: 767px) {
	.similar-products {
		padding-block: var(--space-48);
	}

	.similar-products__inner {
		gap: var(--space-32);
	}

	.similar-products__grid.product-catalogue__grid {
		grid-template-columns: minmax(0, 1fr);
		max-width: 18rem;
	}

	.similar-products__item {
		max-width: none;
	}
}
