/*
 * Single product page (Figma "Produkt side", 1280px).
 *
 * Everything sits inside body.gg-modern-shop .gg-pdp with native CSS nesting,
 * so theme and WooCommerce rules do not win by specificity.
 */

body.gg-modern-shop.single-product {
	background-color: #fbf9f5;
}

body.gg-modern-shop:has(.gg-pdp) {
	overflow-x: clip;
}

body.gg-modern-shop .e-con:has(.gg-pdp),
body.gg-modern-shop :is(main, #primary, #content, .site-main, .content-area, .entry-content):has(> .gg-pdp) {
	max-width: none;
	margin-block: 0;
	padding-block: 0;
	padding-inline: 0;
}

body.gg-modern-shop .gg-pdp {
	--pdp-ink: #121212;
	--pdp-ink-soft: #1b1c1a;
	--pdp-muted: #6e6a64;
	--pdp-line: #c4c7c7;
	--pdp-gold: #d4af37;
	--pdp-gold-deep: #b3924c;
	--pdp-cream: #fbf9f5;
	--pdp-sand: #f5f3ef;
	--pdp-stone: #efeeea;
	--pdp-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
	--pdp-shadow-lg: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);

	display: flow-root;
	box-sizing: border-box;
	width: 100vw;
	max-width: 100vw;
	margin: 0 0 0 calc(50% - 50vw);
	padding: 0;
	background: var(--pdp-cream);
	color: var(--pdp-ink);
	font-family: Manrope, system-ui, -apple-system, 'Segoe UI', sans-serif;
	font-size: 13px;
	line-height: 20px;
	letter-spacing: normal;
	text-align: left;

	*,
	*::before,
	*::after {
		box-sizing: border-box;
	}

	img {
		display: block;
		max-width: 100%;
		height: auto;
		border: 0;
		border-radius: 0;
	}

	p,
	ul,
	h1,
	h2,
	h3,
	blockquote {
		margin: 0;
		padding: 0;
		letter-spacing: normal;
	}

	ul {
		list-style: none;
	}

	li {
		margin: 0;
		padding: 0;
	}

	svg {
		flex: none;
		fill: none;
		stroke: currentcolor;
		stroke-width: 1.6;
		stroke-linecap: round;
		stroke-linejoin: round;
	}

	/* Shared bits */

	.gg-pdp__eyebrow {
		margin: 0;
		color: var(--pdp-gold-deep);
		font-size: 12px;
		font-weight: 700;
		line-height: 16px;
		letter-spacing: 1.2px;
		text-transform: uppercase;
	}

	.gg-pdp__h2 {
		color: var(--pdp-ink);
		font-family: 'Playfair Display', Georgia, serif;
		font-size: 40px;
		font-weight: 500;
		line-height: 48px;
		letter-spacing: -0.4px;
	}

	.gg-pdp__lead {
		color: var(--pdp-muted);
		font-size: 15px;
		line-height: 24px;
	}

	.gg-pdp__dot {
		display: inline-block;
		width: 6px;
		height: 6px;
		border-radius: 12px;
		background: var(--pdp-gold);
	}

	.gg-pdp__in,
	.gg-pdp__bar-in,
	.gg-pdp__main-in,
	.gg-pdp__endorse-in,
	.gg-pdp__deep-in,
	.gg-pdp__routine-in,
	.gg-pdp__reviews-in {
		width: 100%;
		max-width: 1184px;
		margin: 0 auto;
	}

	/* Breadcrumb bar */

	.gg-pdp__bar {
		padding: 14px 48px;
		background: var(--pdp-sand);
	}

	.gg-pdp__bar-in {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 24px;
		min-height: 20px;
	}

	.gg-pdp__crumbs {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		gap: 8px;
		color: var(--pdp-muted);
		font-size: 13px;
		line-height: 20px;

		a {
			color: var(--pdp-muted);
			text-decoration: none;
			box-shadow: none;

			&:hover {
				color: var(--pdp-ink);
			}
		}
	}

	.gg-pdp__crumb-sep {
		color: var(--pdp-line);
	}

	.gg-pdp__crumb-current {
		color: var(--pdp-ink-soft);
		font-weight: 600;
	}

	.gg-pdp__bar-notes {
		display: flex;
		align-items: center;
		gap: 16px;

		li {
			display: flex;
			align-items: center;
			gap: 6px;
			color: var(--pdp-gold-deep);
			font-size: 12px;
			font-weight: 600;
			line-height: 16px;
			letter-spacing: 0.6px;
			text-transform: uppercase;
		}

		.gg-pdp__bar-sep {
			color: var(--pdp-line);
		}
	}

	/* Main section */

	.gg-pdp__main {
		padding: 56px 48px;
	}

	.gg-pdp__main-in {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		align-items: start;
		gap: 56px;
	}

	.gg-pdp__gallery {
		position: sticky;
		top: 24px;
		display: flex;
		flex-direction: column;
		gap: 16px;
		min-width: 0;
	}

	.gg-pdp__stage {
		position: relative;
		display: flex;
		align-items: center;
		justify-content: center;
		aspect-ratio: 564 / 705;
		padding: 32px;
		overflow: hidden;
		border-radius: 8px;
		background: #fff;
		box-shadow: var(--pdp-shadow);
	}

	.gg-pdp__stage-img {
		width: auto;
		max-width: 100%;
		height: auto;
		max-height: 578px;
		object-fit: contain;
	}

	.gg-pdp__stage-note {
		position: absolute;
		right: 24px;
		bottom: 16px;
		left: 24px;
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 16px;
		padding: 8px 14px;
		border-radius: 4px;
		background: rgba(251, 249, 245, 0.9);
		backdrop-filter: blur(2px);
	}

	.gg-pdp__stage-hint {
		display: flex;
		align-items: center;
		gap: 6px;
		color: var(--pdp-muted);
		font-size: 13px;
		line-height: 20px;

		svg {
			color: var(--pdp-gold);
		}
	}

	.gg-pdp__stage-brand {
		color: var(--pdp-ink);
		font-size: 12px;
		font-weight: 600;
		line-height: 16px;
		letter-spacing: 0.6px;
		text-transform: uppercase;
	}

	.gg-pdp__badges {
		position: absolute;
		top: 20px;
		left: 20px;
		z-index: 2;
		display: flex;
		flex-direction: column;
		align-items: stretch;
		gap: 8px;
		width: max-content;
		min-width: 144px;
	}

	.gg-pdp__badge {
		padding: 6px 12px;
		border-radius: 4px;
		box-shadow: var(--pdp-shadow);
		font-size: 10px;
		font-weight: 700;
		line-height: 14px;
		text-transform: uppercase;
	}

	.gg-pdp__badge--dark {
		background: var(--pdp-ink);
		color: #f4efea;
		letter-spacing: 1px;
	}

	.gg-pdp__badge--gold {
		background: var(--pdp-gold);
		color: var(--pdp-ink);
		letter-spacing: 0.5px;
	}

	.gg-pdp__badge--cream {
		background: #f4efea;
		color: var(--pdp-ink-soft);
		letter-spacing: 1px;
	}

	.gg-pdp__zoom {
		position: absolute;
		top: 20px;
		right: 20px;
		z-index: 2;
		display: flex;
		align-items: center;
		justify-content: center;
		width: 36px;
		height: 36px;
		border-radius: 12px;
		background: rgba(251, 249, 245, 0.9);
		box-shadow: var(--pdp-shadow);
		backdrop-filter: blur(6px);
		color: var(--pdp-ink-soft);
		box-shadow: var(--pdp-shadow);
	}

	.gg-pdp__thumbs {
		display: flex;
		gap: 12px;
	}

	.gg-pdp__thumb {
		display: flex;
		flex: 0 1 132px;
		align-items: center;
		justify-content: center;
		min-width: 0;
		aspect-ratio: 132 / 165;
		margin: 0;
		padding: 8px;
		border: 0;
		border-radius: 4px;
		background: #fff;
		cursor: pointer;
		opacity: 0.7;
		transition: opacity 0.2s ease, box-shadow 0.2s ease;

		img {
			width: 100%;
			height: 100%;
			border-radius: 2px;
			object-fit: cover;
		}

		&:hover,
		&:focus-visible {
			opacity: 1;
		}

		&.is-active {
			opacity: 1;
			box-shadow: 0 0 0 2px var(--pdp-gold);
		}
	}

	/* Buy column */

	.gg-pdp__summary {
		display: flex;
		flex-direction: column;
		gap: 24px;
		float: none;
		width: auto;
		min-width: 0;
		margin: 0;
		padding: 0;
	}

	.gg-pdp__head {
		display: flex;
		flex-direction: column;
		gap: 8px;
	}

	.gg-pdp__head-top {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 16px;
		min-height: 24px;
	}

	.gg-pdp__sku {
		display: inline-flex;
		align-items: center;
		gap: 4px;
		padding: 2px 10px;
		border-radius: 12px;
		background: var(--pdp-stone);
		color: var(--pdp-muted);
		font-size: 13px;
		line-height: 20px;

		strong {
			color: var(--pdp-ink-soft);
			font-weight: 600;
		}
	}

	.gg-pdp__title {
		margin: 0;
		color: var(--pdp-ink);
		font-family: 'Playfair Display', Georgia, serif;
		font-size: 56px;
		font-weight: 500;
		line-height: 70px;
		letter-spacing: -1.4px;
		text-transform: none;
	}

	.gg-pdp__subtitle {
		color: var(--pdp-muted);
		font-size: 18px;
		font-weight: 600;
		line-height: 26px;
	}

	.gg-pdp__rating {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		gap: 4px 16px;
		padding: 4px 0;
	}

	.gg-stars {
		display: inline-flex;
		align-items: center;
		line-height: 0;

		svg {
			stroke: none;
		}
	}

	.gg-pdp__rating-score {
		font-size: 16px;
		font-weight: 700;
		line-height: 24px;
	}

	.gg-pdp__rating-text {
		color: var(--pdp-muted);
		font-size: 13px;
		line-height: 20px;
	}

	.gg-pdp__rating-dot {
		color: var(--pdp-line);
		font-size: 15px;
		line-height: 24px;
	}

	.gg-pdp__rating-link {
		color: var(--pdp-gold-deep);
		font-size: 12px;
		font-weight: 600;
		line-height: 16px;
		letter-spacing: 0.6px;
		text-decoration: none;
		text-transform: uppercase;

		&:hover {
			text-decoration: underline;
		}
	}

	.gg-pdp__price-box {
		display: flex;
		flex-direction: column;
		gap: 12px;
		padding: 20px;
		border-radius: 8px;
		background: var(--pdp-sand);
	}

	.gg-pdp__login {
		display: flex;
		align-items: center;
		justify-content: center;
		box-sizing: border-box;
		width: 100%;
		min-height: 52px;
		margin: 0;
		padding: 14px 24px;
		border: 0;
		border-radius: 4px;
		background: var(--pdp-ink);
		box-shadow: var(--pdp-shadow-lg);
		color: #f4efea;
		font-family: Manrope, system-ui, sans-serif;
		font-size: 12px;
		font-weight: 600;
		font-style: normal;
		line-height: 16px;
		letter-spacing: 0.6px;
		text-align: center;
		text-decoration: none;
		text-transform: uppercase;
		transition: background 0.2s ease;

		&:hover,
		&:focus-visible {
			background: #2a2a2a;
			color: #f4efea;
		}
	}

	.gg-pdp__price-row {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 12px;
		min-height: 48px;
	}

	.gg-pdp__price {
		display: flex;
		flex-wrap: wrap;
		align-items: baseline;
		gap: 4px 12px;
		margin: 0;
		color: var(--pdp-ink);
		font-family: 'Playfair Display', Georgia, serif;
		font-size: 40px;
		font-weight: 700;
		line-height: 48px;
		letter-spacing: -0.4px;

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

		.gg-pdp__from {
			color: var(--pdp-muted);
			font-family: Manrope, system-ui, sans-serif;
			font-size: 13px;
			font-weight: 700;
			letter-spacing: 0.5px;
			line-height: 20px;
			text-transform: uppercase;
		}

		.gg-pdp__amount {
			display: contents;
		}

		del {
			order: 2;
			color: var(--pdp-muted);
			font-family: Manrope, system-ui, sans-serif;
			font-size: 16px;
			font-weight: 400;
			letter-spacing: 0;
			line-height: 24px;
			opacity: 1;

			.woocommerce-Price-amount {
				font-weight: 400;
			}
		}

		ins {
			background: none;
			color: inherit;
			font-weight: inherit;
			text-decoration: none;
		}

		.screen-reader-text {
			position: absolute;
			width: 1px;
			height: 1px;
			overflow: hidden;
			clip-path: inset(50%);
		}

		&:has(.calmabeauty-b2b-login-price-link) {
			flex: 1 1 auto;
			width: 100%;
			min-width: 0;

			.gg-pdp__price-note {
				display: none;
			}
		}

		.price:has(.calmabeauty-b2b-login-price-link) {
			display: block;
			width: 100%;
			margin: 0;
		}

		.calmabeauty-b2b-login-price-link {
			display: flex;
			align-items: center;
			justify-content: center;
			box-sizing: border-box;
			width: 100%;
			min-height: 52px;
			margin: 0;
			padding: 14px 24px;
			border: 0;
			border-radius: 4px;
			background: var(--pdp-ink);
			box-shadow: var(--pdp-shadow-lg);
			color: #f4efea;
			cursor: pointer;
			font-family: Manrope, system-ui, sans-serif;
			font-size: 12px;
			font-weight: 600;
			line-height: 16px;
			letter-spacing: 0.6px;
			text-align: center;
			text-decoration: none;
			text-transform: uppercase;
			transition: background 0.2s ease, transform 0.2s ease;
			white-space: normal;

			&:hover,
			&:focus-visible {
				background: #2a2a2a;
				color: #f4efea;
			}
		}
	}

	.gg-pdp__price-note {
		color: var(--pdp-muted);
		font-family: Manrope, system-ui, sans-serif;
		font-size: 13px;
		font-weight: 400;
		letter-spacing: 0;
		line-height: 20px;
	}

	.gg-pdp__sale-pill {
		padding: 4px 12px;
		border-radius: 12px;
		background: rgba(212, 175, 55, 0.15);
		color: var(--pdp-gold-deep);
		font-size: 10px;
		font-weight: 700;
		line-height: 14px;
		letter-spacing: 0.5px;
		text-transform: uppercase;
	}

	.gg-pdp__loyalty {
		display: flex;
		align-items: center;
		gap: 8px;
		padding-top: 8px;
		color: var(--pdp-ink);
		font-size: 13px;
		line-height: 20px;

		svg {
			color: var(--pdp-gold);
		}
	}

	.gg-pdp__highlights {
		display: flex;
		flex-direction: column;
		gap: 12px;
		padding: 4px 0;

		li {
			display: flex;
			gap: 12px;
		}

		svg {
			margin-top: 3px;
			color: var(--pdp-gold);
		}

		p {
			color: var(--pdp-muted);
			font-size: 15px;
			line-height: 24px;
		}

		strong {
			color: var(--pdp-ink);
			font-weight: 600;
		}
	}

	.gg-pdp__short {
		color: var(--pdp-muted);
		font-size: 15px;
		line-height: 24px;

		p + p {
			margin-top: 8px;
		}
	}

	/* "Vis mer" for long text (assets/js/product-page.js) */

	.gg-pdp__more {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		gap: 12px;

		.gg-pdp__short {
			align-self: stretch;
		}

		&.is-clamped:not(.is-open) .gg-pdp__short {
			max-height: 192px;
			overflow: hidden;
			-webkit-mask-image: linear-gradient(180deg, #000 calc(100% - 56px), transparent 100%);
			mask-image: linear-gradient(180deg, #000 calc(100% - 56px), transparent 100%);
		}

		&.is-open .gg-pdp__more-btn svg {
			transform: rotate(180deg);
		}
	}

	.gg-pdp__more-btn {
		display: inline-flex;
		align-items: center;
		gap: 6px;
		margin: 0;
		padding: 4px 0;
		border: 0;
		border-bottom: 1px solid currentColor;
		border-radius: 0;
		background: none;
		box-shadow: none;
		color: var(--pdp-ink);
		cursor: pointer;
		font-family: inherit;
		font-size: 12px;
		font-weight: 600;
		line-height: 16px;
		letter-spacing: 0.96px;
		text-transform: uppercase;

		&[hidden] {
			display: none;
		}

		&:hover,
		&:focus-visible {
			background: none;
			color: var(--pdp-gold-deep);
		}

		svg {
			transition: transform 0.2s ease;
		}
	}

	.gg-pdp__stock {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		gap: 8px;
		padding: 4px 0;
		color: var(--pdp-muted);
		font-size: 13px;
		line-height: 20px;

		strong {
			color: var(--pdp-ink);
			font-weight: 500;
		}
	}

	.gg-pdp__pulse {
		position: relative;
		width: 10px;
		height: 10px;
		border-radius: 12px;
		background: #2f9e5b;
		isolation: isolate;

		&::before {
			content: '';
			position: absolute;
			inset: 0;
			z-index: -1;
			border-radius: 12px;
			background: #5ec889;
			opacity: 0.75;
			animation: gg-pdp-pulse 2s cubic-bezier(0, 0, 0.2, 1) infinite;
		}
	}

	.gg-pdp__stock--out .gg-pdp__pulse {
		background: #a14a3d;

		&::before {
			background: #a14a3d;
			animation: none;
		}
	}

	.gg-pdp__retail-note {
		margin: 0;
		color: var(--pdp-ink);
		font-size: 14px;
		line-height: 22px;
	}

	.gg-pdp__buy-panel {
		display: flex;
		flex-direction: column;
		gap: 12px;
		padding-top: 8px;

		form.cart {
			display: block;
			margin: 0;
			padding: 0;
		}
	}

	.gg-pdp__buy {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		gap: 12px;
		margin: 0;
		padding: 0;

		/* Vipps MobilePay "Kjøp nå": its own line, full width. */
		.vipps_buy_now_wrapper {
			flex: 0 0 100%;
			width: 100%;
			margin: 0;
			padding: 0;

			a.vipps-buy-now {
				display: block;
				width: 100%;
				margin: 0;
				padding: 0;
				border: 0;
				background: none;
				box-shadow: none;
				line-height: 0;
				text-decoration: none;

				&.disabled {
					opacity: 0.5;
					cursor: not-allowed;
				}
			}

			vipps-mobilepay-button {
				display: block;
				width: 100%;
				max-width: 100%;
				min-height: 0;
				margin: 0;
				padding: 0 !important;
				border: 0 !important;
				border-radius: 4px;
				background: transparent !important;
				box-shadow: none !important;
				line-height: normal;
			}
		}
	}

	.gg-pdp__buy .quantity {
		display: flex;
		flex: none;
		align-items: center;
		width: 136px;
		height: 52px;
		margin: 0;
		padding: 4px;
		border: 0;
		border-radius: 4px;
		background: #fff;
		box-shadow: var(--pdp-shadow);

		.screen-reader-text {
			position: absolute;
			width: 1px;
			height: 1px;
			overflow: hidden;
			clip-path: inset(50%);
		}

		input.qty {
			flex: 1 1 auto;
			width: 48px;
			min-width: 0;
			height: 44px;
			margin: 0;
			padding: 0;
			border: 0;
			border-radius: 0;
			background: transparent;
			box-shadow: none;
			color: var(--pdp-ink);
			font-family: inherit;
			font-size: 16px;
			font-weight: 600;
			line-height: 24px;
			text-align: center;
			appearance: textfield;
			-moz-appearance: textfield;

			&::-webkit-outer-spin-button,
			&::-webkit-inner-spin-button {
				margin: 0;
				-webkit-appearance: none;
			}
		}
	}

	.gg-pdp__qty-btn {
		display: flex;
		flex: none;
		align-items: center;
		justify-content: center;
		width: 40px;
		height: 44px;
		margin: 0;
		padding: 0;
		border: 0;
		border-radius: 2px;
		background: transparent;
		color: var(--pdp-ink);
		cursor: pointer;
		letter-spacing: 0;

		&:hover,
		&:focus-visible {
			background: var(--pdp-sand);
		}

		svg {
			stroke-width: 1.8;
		}
	}

	.gg-pdp__buy .single_add_to_cart_button {
		display: flex;
		flex: 1 1 auto;
		align-items: center;
		justify-content: center;
		gap: 10px;
		width: auto;
		min-width: 0;
		height: 52px;
		margin: 0;
		padding: 14px 24px;
		border: 0;
		border-radius: 4px;
		background: var(--pdp-ink);
		box-shadow: var(--pdp-shadow-lg);
		color: #f4efea;
		cursor: pointer;
		font-family: inherit;
		font-size: 12px;
		font-weight: 600;
		line-height: 16px;
		letter-spacing: 0.6px;
		text-transform: uppercase;
		transition: background 0.2s ease, transform 0.2s ease;

		&:hover,
		&:focus-visible {
			background: #2a2a2a;
			color: #f4efea;
		}

		&.disabled,
		&:disabled {
			cursor: not-allowed;
			opacity: 0.5;
		}

		&.loading {
			opacity: 0.7;
		}

		&.loading::after,
		&.added::after {
			display: none;
		}

		.gg-pdp__cta-price {
			color: var(--pdp-gold);
			font-weight: 400;
		}
	}

	.gg-pdp__wish {
		display: flex;
		flex: none;
		align-items: center;
		justify-content: center;
		width: 52px;
		height: 52px;
		border-radius: 4px;
		background: #fff;
		box-shadow: var(--pdp-shadow);
		color: var(--pdp-ink);
		text-decoration: none;
		transition: color 0.2s ease;

		&:hover,
		&.is-saved {
			color: var(--pdp-gold-deep);
		}

		&.is-saved svg {
			fill: var(--pdp-gold);
		}
	}

	.gg-pdp__express {
		display: flex;
		flex-direction: column;
		gap: 8px;

		.gg-express-btn {
			display: flex;
			align-items: center;
			justify-content: center;
			gap: 12px;
			width: 100%;
			height: 52px;
			padding: 14px 24px;
			border: 0;
			border-radius: 4px;
			background: #ff5b24;
			box-shadow: var(--pdp-shadow);
			color: #fff;
			font-family: inherit;
			font-size: 15px;
			font-weight: 700;
			line-height: 24px;
			text-decoration: none;
			text-transform: none;
			letter-spacing: 0;

			&:hover {
				background: #e84f1c;
				color: #fff;
			}
		}
	}

	/* Variations from WooCommerce */

	.variations_form {
		display: flex;
		flex-direction: column;
		gap: 16px;
		margin: 0;

		.single_variation_wrap {
			display: flex;
			flex-direction: column;
			gap: 16px;
		}

		table.variations {
			display: block;
			width: 100%;
			margin: 0;
			border: 0;
			background: none;

			tbody {
				display: flex;
				flex-direction: column;
				gap: 16px;
			}

			tr {
				display: flex;
				flex-direction: column;
				gap: 8px;
				margin: 0;
				padding: 0;
				border: 0;
				background: none;
			}

			th,
			td {
				display: block;
				padding: 0;
				border: 0;
				background: none;
				line-height: 1;
			}

			label {
				display: block;
				margin: 0;
				color: var(--pdp-ink);
				font-size: 12px;
				font-weight: 700;
				line-height: 16px;
				letter-spacing: 1.2px;
				text-transform: uppercase;
			}

			/* Native select until custom-select.js has wrapped it. */
			select {
				width: 100%;
				height: 52px;
				margin: 0;
				padding: 0 16px;
				border: 0;
				border-radius: 4px;
				background-color: #fff;
				box-shadow: var(--pdp-shadow);
				color: var(--pdp-ink);
				font-family: inherit;
				font-size: 14px;
			}

			td.value {
				text-align: left;
			}

			.reset_variations {
				position: static;
				display: block;
				float: none;
				width: fit-content;
				margin: 8px 0 0;
				color: var(--pdp-muted);
				font-size: 12px;
				line-height: 16px;
				text-decoration: underline;
				text-underline-offset: 3px;

				&:hover {
					color: var(--pdp-ink);
				}
			}
		}

		.woocommerce-variation {
			display: flex;
			flex-direction: column;
			gap: 8px;
			margin: 0;

			&:empty {
				display: none;
			}

			/* Stock is shown above the buy box. Only warn when a choice is sold out. */
			.woocommerce-variation-availability .in-stock,
			.woocommerce-variation-availability:empty {
				display: none;
			}

			.woocommerce-variation-availability p {
				margin: 0;
			}

			.stock.out-of-stock,
			.stock.available-on-backorder {
				margin: 0;
				color: var(--pdp-muted);
				font-size: 13px;
				font-weight: 600;
				line-height: 20px;
			}

			.woocommerce-variation-description {
				color: var(--pdp-muted);
				font-size: 13px;
				line-height: 20px;

				p {
					margin: 0;
				}
			}
		}

		.woocommerce-variation-price {
			display: none;
		}
	}

	.gg-pdp__assure {
		display: grid;
		grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
		gap: 8px;
		padding-top: 12px;

		li {
			display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: center;
			gap: 4px;
			padding: 12px;
			border-radius: 4px;
			background: var(--pdp-sand);
			text-align: center;
		}

		svg {
			color: var(--pdp-gold);
		}

		strong {
			color: var(--pdp-ink);
			font-size: 10px;
			font-weight: 700;
			line-height: 14px;
			letter-spacing: 1.2px;
			text-transform: uppercase;
		}

		span {
			color: var(--pdp-muted);
			font-size: 13px;
			line-height: 20px;
		}
	}

	/* Clinic recommendation */

	.gg-pdp__endorse {
		margin: 24px 0;
		padding: 56px 48px;
		background: var(--pdp-sand);
	}

	.gg-pdp__endorse-card {
		position: relative;
		display: grid;
		grid-template-columns: 292px minmax(0, 1fr);
		align-items: center;
		gap: 80px;
		padding: 48px;
		overflow: hidden;
		border-radius: 16px;
		background: #fff;
		box-shadow: var(--pdp-shadow);

		&::after {
			content: '';
			position: absolute;
			right: -40px;
			bottom: -40px;
			width: 288px;
			height: 288px;
			border-radius: 12px;
			background: rgba(212, 175, 55, 0.05);
			filter: blur(20px);
			pointer-events: none;
		}
	}

	.gg-pdp__endorse-person {
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 20px;
		text-align: center;
	}

	.gg-pdp__endorse-photo {
		width: 144px;
		height: 144px;
		border-radius: 12px;
		box-shadow: var(--pdp-shadow-lg);
		object-fit: cover;
	}

	.gg-pdp__endorse-photo--initials {
		display: flex;
		align-items: center;
		justify-content: center;
		background: var(--pdp-stone);
		color: var(--pdp-gold-deep);
		font-family: 'Playfair Display', Georgia, serif;
		font-size: 56px;
		font-weight: 500;
	}

	.gg-pdp__endorse-who {
		h2 {
			color: var(--pdp-ink);
			font-family: 'Playfair Display', Georgia, serif;
			font-size: 20px;
			font-weight: 600;
			line-height: 28px;
		}
	}

	.gg-pdp__endorse-role {
		padding-top: 2px;
		color: var(--pdp-gold-deep);
		font-size: 12px;
		font-weight: 700;
		line-height: 16px;
		letter-spacing: 0.6px;
		text-transform: uppercase;
	}

	.gg-pdp__endorse-note {
		color: var(--pdp-muted);
		font-size: 13px;
		line-height: 20px;
	}

	.gg-pdp__endorse-body {
		position: relative;
		z-index: 1;
		display: flex;
		flex-direction: column;
		gap: 15px;
	}

	.gg-pdp__endorse-label {
		display: flex;
		align-items: center;
		gap: 8px;
		color: var(--pdp-ink);
		font-size: 12px;
		font-weight: 600;
		line-height: 16px;
		letter-spacing: 1.2px;
		text-transform: uppercase;

		svg {
			color: var(--pdp-gold);
			fill: var(--pdp-gold);
			stroke: none;
		}
	}

	.gg-pdp__quote {
		border: 0;
		color: var(--pdp-ink);
		font-family: 'Playfair Display', Georgia, serif;
		font-size: 28px;
		font-style: italic;
		font-weight: 400;
		line-height: 38px;
		quotes: none;
	}

	.gg-pdp__endorse-text {
		color: var(--pdp-muted);
		font-size: 15px;
		line-height: 24px;
	}

	/* Description tabs */

	.gg-pdp__deep {
		padding: 40px 48px;
	}

	.gg-pdp__deep-in {
		display: flex;
		flex-direction: column;
		gap: 24px;
	}

	.gg-pdp__section-head {
		display: flex;
		flex-direction: column;
		gap: 4px;
	}

	.gg-pdp__tabs {
		display: flex;
		flex-wrap: wrap;
		gap: 8px;
		padding-bottom: 8px;
	}

	.gg-pdp__tab {
		margin: 0;
		padding: 12px 20px;
		border: 0;
		border-radius: 4px;
		background: var(--pdp-sand);
		color: var(--pdp-muted);
		cursor: pointer;
		font-family: inherit;
		font-size: 12px;
		font-weight: 600;
		line-height: 16px;
		letter-spacing: 0.6px;
		text-align: center;
		text-transform: uppercase;
		transition: background 0.2s ease, color 0.2s ease;

		&:hover {
			background: var(--pdp-stone);
			color: var(--pdp-ink);
		}

		&.is-active {
			background: var(--pdp-ink);
			box-shadow: var(--pdp-shadow);
			color: #f4efea;
		}
	}

	.gg-pdp__panels {
		display: flex;
		flex-direction: column;
		gap: 24px;
		padding: 40px;
		border-radius: 16px;
		background: #fff;
		box-shadow: var(--pdp-shadow);
	}

	&.gg-pdp--js .gg-pdp__panel:not(.is-active) {
		display: none;
	}

	.gg-pdp__panel {
		display: flex;
		flex-direction: column;
		gap: 24px;
	}

	.gg-pdp__panel-title {
		color: var(--pdp-ink);
		font-family: 'Playfair Display', Georgia, serif;
		font-size: 24px;
		font-weight: 500;
		line-height: 32px;
	}

	.gg-pdp__prose {
		max-width: 760px;
		color: var(--pdp-muted);
		font-size: 15px;
		line-height: 24px;

		p + p,
		p + ul,
		ul + p {
			margin-top: 12px;
		}

		strong {
			color: var(--pdp-ink);
			font-weight: 600;
		}

		ul,
		.gg-pdp__list {
			padding-left: 0;
			list-style: none;
		}

		li {
			position: relative;
			padding: 0 0 6px 20px;
		}

		li::before {
			content: '';
			position: absolute;
			top: 10px;
			left: 0;
			width: 6px;
			height: 6px;
			border-radius: 12px;
			background: var(--pdp-gold);
		}
	}

	.gg-pdp__cards {
		display: grid;
		grid-template-columns: repeat(var(--gg-cols, 4), minmax(0, 1fr));
		gap: 24px;
	}

	.gg-pdp__card {
		display: flex;
		flex-direction: column;
		gap: 10px;
		padding: 20px 20px 40px;
		border-radius: 8px;
		background: var(--pdp-sand);

		svg {
			margin-bottom: 4px;
			color: var(--pdp-gold);
		}

		h3 {
			color: var(--pdp-ink);
			font-family: inherit;
			font-size: 18px;
			font-weight: 700;
			line-height: 26px;
			text-transform: none;
		}

		p {
			color: var(--pdp-muted);
			font-size: 13px;
			line-height: 20px;
		}
	}

	/* Routine */

	.gg-pdp__routine {
		margin: 32px 0 0;
		padding: 56px 48px;
		background: var(--pdp-sand);
	}

	.gg-pdp__routine-in {
		display: flex;
		flex-direction: column;
		gap: 40px;
	}

	.gg-pdp__routine-head {
		display: flex;
		align-items: flex-end;
		justify-content: space-between;
		flex-wrap: wrap;
		gap: 24px 48px;

		> div:first-child {
			display: flex;
			flex-direction: column;
			gap: 3.5px;
			max-width: 640px;
			padding-top: 4px;
		}
	}

	.gg-pdp__routine-buy {
		display: flex;
		align-items: center;
		gap: 12px;
	}

	.gg-pdp__routine-total {
		display: flex;
		flex-direction: column;
		align-items: flex-end;
		gap: 2px;
		padding-top: 2px;

		span {
			color: var(--pdp-muted);
			font-size: 13px;
			line-height: 20px;
		}

		strong {
			color: var(--pdp-ink);
			font-size: 18px;
			font-weight: 700;
			line-height: 26px;
		}
	}

	.gg-pdp__routine-btn {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		padding: 12px 20px;
		border-radius: 4px;
		background: var(--pdp-gold);
		box-shadow: var(--pdp-shadow);
		color: var(--pdp-ink);
		font-size: 12px;
		font-weight: 700;
		line-height: 16px;
		letter-spacing: 0.6px;
		text-decoration: none;
		text-transform: uppercase;
		transition: background 0.2s ease;

		&:hover {
			background: #c9a42e;
			color: var(--pdp-ink);
		}
	}

	.gg-pdp__steps {
		display: grid;
		grid-template-columns: repeat(4, minmax(0, 1fr));
		align-items: stretch;
		gap: 24px;
	}

	.gg-pdp__step {
		position: relative;
		display: flex;
		flex-direction: column;
		gap: 12px;
		padding: 20px;
		border-radius: 8px;
		background: #fff;
		box-shadow: var(--pdp-shadow);

		&.is-active {
			box-shadow: var(--pdp-shadow-lg);
		}
	}

	.gg-pdp__step-tag {
		position: absolute;
		top: 0;
		right: 0;
		padding: 4px 12px;
		border-radius: 0 8px 0 4px;
		background: var(--pdp-gold);
		color: var(--pdp-ink);
		font-size: 10px;
		font-weight: 700;
		line-height: 14px;
		letter-spacing: 0.5px;
		text-transform: uppercase;
	}

	.gg-pdp__step-top {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 8px;
		min-height: 20px;
		padding-right: 0;
	}

	.gg-pdp__step-label {
		padding: 2px 8px;
		border-radius: 2px;
		background: var(--pdp-stone);
		color: var(--pdp-muted);
		font-size: 10px;
		font-weight: 700;
		line-height: 14px;
		letter-spacing: 1.2px;
		text-transform: uppercase;
	}

	.is-active .gg-pdp__step-label {
		background: rgba(212, 175, 55, 0.15);
		color: var(--pdp-gold-deep);
	}

	.gg-pdp__step-size {
		color: var(--pdp-muted);
		font-size: 13px;
		line-height: 20px;
	}

	.gg-pdp__step-size--pill {
		padding: 4px 10px;
		border-radius: 12px;
		background: var(--pdp-stone);
		color: var(--pdp-ink);
		font-size: 10px;
		font-weight: 600;
		line-height: 14px;
		letter-spacing: 1.2px;
	}

	.gg-pdp__step-media {
		display: flex;
		align-items: center;
		justify-content: center;
		aspect-ratio: 238 / 297.5;
		padding: 16px;
		border-radius: 4px;
		background: var(--pdp-sand);

		img {
			width: auto;
			max-width: 100%;
			height: auto;
			max-height: 100%;
			object-fit: contain;
			mix-blend-mode: multiply;
		}
	}

	.gg-pdp__step-title {
		font-family: 'Playfair Display', Georgia, serif;
		font-size: 20px;
		font-weight: 600;
		line-height: 28px;
		text-transform: none;

		a {
			color: var(--pdp-ink);
			text-decoration: none;
		}
	}

	.gg-pdp__step-text {
		display: -webkit-box;
		overflow: hidden;
		color: var(--pdp-muted);
		font-size: 13px;
		line-height: 20px;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 2;
	}

	.gg-pdp__step-foot {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 12px;
		margin-top: auto;
		padding-top: 24px;
	}

	.gg-pdp__step-price {
		color: var(--pdp-ink);
		font-size: 16px;
		font-weight: 700;
		line-height: 24px;
	}

	.gg-pdp__step-add {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 32px;
		height: 32px;
		margin: 0;
		padding: 0;
		border: 0;
		border-radius: 4px;
		background: var(--pdp-stone);
		color: var(--pdp-ink);
		text-decoration: none;
		transition: background 0.2s ease, color 0.2s ease;

		&:hover {
			background: var(--pdp-ink);
			color: #f4efea;
		}

		&.loading {
			opacity: 0.5;
		}

		&.loading::after,
		&.added::after {
			display: none;
		}

		&.added {
			background: var(--pdp-gold);
			color: var(--pdp-ink);
		}
	}

	.gg-pdp__step-foot a.added_to_cart {
		display: none;
	}

	/* Reviews */

	.gg-pdp__reviews {
		padding: 48px;
	}

	.gg-pdp__reviews-in {
		display: flex;
		flex-direction: column;
		gap: 40px;
	}

	.gg-pdp__reviews-sum {
		display: flex;
		align-items: center;
		justify-content: space-between;
		flex-wrap: wrap;
		gap: 24px 48px;
		padding: 32px;
		border-radius: 16px;
		background: #fff;
		box-shadow: var(--pdp-shadow);
	}

	.gg-pdp__reviews-score {
		display: flex;
		align-items: center;
		gap: 24px;

		> div {
			display: flex;
			flex-direction: column;
			align-items: flex-start;
			gap: 4px;
		}
	}

	.gg-pdp__reviews-avg {
		color: var(--pdp-ink);
		font-family: 'Playfair Display', Georgia, serif;
		font-size: 56px;
		font-weight: 700;
		line-height: 56px;
		letter-spacing: -1.12px;
	}

	.gg-pdp__reviews-base {
		color: var(--pdp-muted);
		font-size: 13px;
		line-height: 20px;
	}

	.gg-pdp__reviews-divider {
		width: 1px;
		height: 64px;
		background: var(--pdp-stone);
	}

	.gg-pdp__bars {
		display: flex;
		flex-direction: column;
		gap: 4px;

		li {
			display: flex;
			align-items: center;
			gap: 8px;
		}
	}

	.gg-pdp__bars-label {
		width: 72px;
		color: var(--pdp-muted);
		font-size: 13px;
		line-height: 20px;
	}

	.gg-pdp__bars-track {
		position: relative;
		width: 144px;
		height: 8px;
		overflow: hidden;
		border-radius: 12px;
		background: var(--pdp-stone);
	}

	.gg-pdp__bars-fill {
		position: absolute;
		inset: 0 auto 0 0;
		border-radius: 12px;
		background: var(--pdp-gold);
	}

	.gg-pdp__bars-count {
		min-width: 16px;
		color: var(--pdp-ink);
		font-size: 13px;
		font-weight: 600;
		line-height: 20px;
	}

	.gg-pdp__reviews-btn {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		padding: 12px 24px;
		border-radius: 4px;
		background: var(--pdp-stone);
		color: var(--pdp-ink);
		font-size: 12px;
		font-weight: 600;
		line-height: 16px;
		letter-spacing: 0.6px;
		text-decoration: none;
		text-transform: uppercase;
		transition: background 0.2s ease;

		&:hover {
			background: #e5e3dd;
			color: var(--pdp-ink);
		}
	}

	.gg-pdp__review-grid {
		display: grid;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 24px;
	}

	.gg-pdp__review {
		display: flex;
		flex-direction: column;
		gap: 16px;
		padding: 24px;
		border-radius: 8px;
		background: #fff;
		box-shadow: var(--pdp-shadow);
	}

	.gg-pdp__review-top {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 12px;
		min-height: 14px;
	}

	.gg-pdp__review-verified {
		color: var(--pdp-gold-deep);
		font-size: 10px;
		font-weight: 700;
		line-height: 14px;
		letter-spacing: 1.2px;
		text-transform: uppercase;
	}

	.gg-pdp__review-text {
		display: -webkit-box;
		overflow: hidden;
		color: var(--pdp-muted);
		font-size: 13px;
		line-height: 20px;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 4;
	}

	.gg-pdp__review-by {
		display: flex;
		align-items: center;
		gap: 8px;
		margin-top: auto;
		padding-top: 8px;
	}

	.gg-pdp__review-avatar {
		display: flex;
		flex: none;
		align-items: center;
		justify-content: center;
		width: 28px;
		height: 28px;
		border-radius: 12px;
		background: var(--pdp-stone);
		color: var(--pdp-ink);
		font-size: 10px;
		font-weight: 700;
		letter-spacing: 1.2px;
	}

	.gg-pdp__review-meta {
		display: flex;
		flex-direction: column;
		gap: 6px;

		strong {
			color: var(--pdp-ink);
			font-size: 13px;
			font-weight: 600;
			line-height: 13px;
		}

		span {
			color: var(--pdp-muted);
			font-size: 10px;
			font-weight: 700;
			line-height: 14px;
			letter-spacing: 1.2px;
			text-transform: uppercase;
		}
	}

	/* The review form from WooCommerce, shown when "Skriv en anmeldelse" is used. */

	.gg-pdp__review-form {
		display: none;
		padding: 32px;
		border-radius: 16px;
		background: #fff;
		box-shadow: var(--pdp-shadow);

		&:target,
		&.is-open {
			display: block;
		}

		.woocommerce-Reviews-title,
		.commentlist,
		.woocommerce-noreviews,
		.woocommerce-pagination,
		#comments > h2 {
			display: none;
		}

		#reply-title {
			display: block;
			margin-bottom: 16px;
			color: var(--pdp-ink);
			font-family: 'Playfair Display', Georgia, serif;
			font-size: 24px;
			font-weight: 500;
			line-height: 32px;
		}

		label {
			display: block;
			margin-bottom: 6px;
			color: var(--pdp-ink);
			font-size: 13px;
			font-weight: 600;
		}

		input[type='text'],
		input[type='email'],
		textarea,
		select {
			width: 100%;
			padding: 12px 16px;
			border: 1px solid rgb(183 183 183);
			border-radius: 4px;
			background: #fff;
			font-family: inherit;
			font-size: 14px;
		}

		textarea {
			min-height: 120px;
		}

		.comment-form > p {
			margin-bottom: 16px;
		}

		.comment-form-cookies-consent label,
		.comment-form-cookies-consent input {
			display: inline;
		}

		#respond input#submit,
		.form-submit input[type='submit'] {
			padding: 14px 24px;
			border: 0;
			border-radius: 4px;
			background: var(--pdp-ink);
			color: #f4efea;
			cursor: pointer;
			font-family: inherit;
			font-size: 12px;
			font-weight: 600;
			letter-spacing: 0.6px;
			text-transform: uppercase;
		}

		p.stars a {
			color: var(--pdp-gold);
		}
	}

	/* Tablet */

	@media (max-width: 1100px) {
		.gg-pdp__main-in {
			grid-template-columns: minmax(0, 1fr);
			gap: 40px;
		}

		.gg-pdp__gallery {
			position: static;
		}

		.gg-pdp__stage {
			aspect-ratio: 4 / 3;
		}

		.gg-pdp__thumbs {
			max-width: 564px;
		}

		.gg-pdp__endorse-card {
			grid-template-columns: minmax(0, 1fr);
			gap: 32px;
		}

		.gg-pdp__cards,
		.gg-pdp__steps {
			grid-template-columns: repeat(2, minmax(0, 1fr));
		}

		.gg-pdp__review-grid {
			grid-template-columns: repeat(2, minmax(0, 1fr));
		}
	}

	/* Phone */

	@media (max-width: 640px) {
		.gg-pdp__bar {
			padding: 12px 20px;
		}

		.gg-pdp__bar-notes {
			display: none;
		}

		.gg-pdp__main,
		.gg-pdp__deep,
		.gg-pdp__reviews {
			padding-right: 20px;
			padding-left: 20px;
		}

		.gg-pdp__main {
			padding-top: 24px;
			padding-bottom: 32px;
		}

		.gg-pdp__stage {
			aspect-ratio: auto;
			min-height: 420px;
			padding: 84px 20px 64px;
		}

		.gg-pdp__badges {
			top: 16px;
			left: 16px;
			flex-direction: row;
			flex-wrap: wrap;
			min-width: 0;
			max-width: calc(100% - 80px);
		}

		.gg-pdp__zoom {
			top: 16px;
			right: 16px;
		}

		.gg-pdp__stage-note {
			right: 12px;
			bottom: 12px;
			left: 12px;
			padding: 6px 10px;
		}

		.gg-pdp__stage-hint {
			font-size: 12px;
		}

		.gg-pdp__thumbs {
			gap: 8px;
			overflow-x: auto;
		}

		.gg-pdp__thumb {
			flex: 0 0 88px;
		}

		.gg-pdp__title {
			font-size: 38px;
			line-height: 46px;
			letter-spacing: -0.9px;
		}

		.gg-pdp__subtitle {
			font-size: 16px;
			line-height: 24px;
		}

		.gg-pdp__price {
			font-size: 34px;
			line-height: 42px;
		}

		.gg-pdp__buy {
			flex-wrap: wrap;
		}

		.gg-pdp__buy .single_add_to_cart_button {
			flex-basis: calc(100% - 64px);
			order: 3;
		}

		.gg-pdp__buy .quantity {
			flex: 1 1 auto;
			width: auto;
		}

		.gg-pdp__assure {
			grid-template-columns: minmax(0, 1fr);
		}

		.gg-pdp__endorse,
		.gg-pdp__routine {
			padding-right: 20px;
			padding-left: 20px;
		}

		.gg-pdp__endorse-card {
			padding: 28px 20px;
		}

		.gg-pdp__quote {
			font-size: 22px;
			line-height: 32px;
		}

		.gg-pdp__h2 {
			font-size: 30px;
			line-height: 38px;
		}

		.gg-pdp__tabs {
			flex-wrap: nowrap;
			margin-right: -20px;
			margin-left: -20px;
			padding-right: 20px;
			padding-left: 20px;
			overflow-x: auto;
		}

		.gg-pdp__tab {
			flex: none;
		}

		.gg-pdp__panels {
			padding: 24px 20px;
		}

		.gg-pdp__cards,
		.gg-pdp__steps,
		.gg-pdp__review-grid {
			grid-template-columns: minmax(0, 1fr);
		}

		.gg-pdp__routine-head,
		.gg-pdp__routine-buy {
			align-items: stretch;
			flex-direction: column;
		}

		.gg-pdp__routine-total {
			align-items: flex-start;
		}

		.gg-pdp__reviews-sum {
			padding: 24px 20px;
		}

		.gg-pdp__reviews-score {
			flex-direction: column;
			align-items: flex-start;
		}

		.gg-pdp__reviews-divider {
			width: 100%;
			height: 1px;
		}

		.gg-pdp__reviews-btn {
			width: 100%;
		}
	}

	/* Related products */

	.gg-related {
		padding: 56px 48px 72px;
		background: #fff;
	}

	.gg-related__in {
		display: flex;
		flex-direction: column;
		gap: 28px;
		width: 100%;
		max-width: 1184px;
		margin: 0 auto;
	}

	.gg-related__head {
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 18px;
		text-align: center;
	}

	.gg-related__title {
		color: #3a3424;
		font-family: 'Playfair Display', Georgia, serif;
		font-size: 40px;
		font-weight: 500;
		line-height: 48px;
		letter-spacing: -0.4px;
	}

	.gg-related__rule {
		display: flex;
		align-items: center;
		gap: 0;
		width: 100%;
		color: var(--pdp-gold);

		span {
			flex: 1 1 auto;
			height: 1px;
			background: currentcolor;
		}

		.gg-icon {
			flex: 0 0 auto;
			width: 18px;
			height: 18px;
			margin: 0 -4px;
			background: #fff;
		}
	}

	.gg-related__viewport {
		min-width: 0;
	}

	.gg-related__track {
		display: flex;
		gap: 20px;
		margin: 0;
		padding: 8px 2px 12px;
		overflow-x: auto;
		scroll-behavior: auto;
		scroll-snap-type: x proximity;
		scroll-padding-inline: 2px;
		scrollbar-width: none;
		overscroll-behavior-x: contain;
		cursor: grab;
		touch-action: pan-y;
		-webkit-overflow-scrolling: touch;

		&::-webkit-scrollbar {
			display: none;
		}

		&.is-dragging {
			scroll-snap-type: none;
			cursor: grabbing;
			user-select: none;
		}

		img {
			-webkit-user-drag: none;
			user-select: none;
		}

		a {
			-webkit-user-drag: none;
			user-select: none;
		}
	}

	.gg-related__track .gg-card {
		flex: 0 0 calc((100% - 60px) / 4);
		scroll-snap-align: start;
	}

	.gg-related .gg-stars path {
		fill: #d4af37;
		stroke: none;
	}

	.gg-related__dots {
		display: flex;
		justify-content: center;
		gap: 8px;

		&[hidden] {
			display: none;
		}
	}

	.gg-related__dot {
		width: 8px;
		height: 8px;
		margin: 0;
		padding: 0;
		border: 0;
		border-radius: 999px;
		background: #eadfbe;
		cursor: pointer;

		&.is-active {
			background: var(--pdp-gold);
		}
	}

	@media (max-width: 1099px) {
		.gg-related__track .gg-card {
			flex-basis: calc((100% - 40px) / 3);
		}
	}

	@media (max-width: 799px) {
		.gg-related {
			padding: 40px 20px 56px;
		}

		.gg-related__title {
			font-size: 32px;
			line-height: 40px;
		}

		.gg-related__track .gg-card {
			flex-basis: calc((100% - 20px) / 2);
		}
	}

	@media (max-width: 559px) {
		.gg-related__track .gg-card {
			flex-basis: 100%;
		}
	}
}

@keyframes gg-pdp-pulse {
	75%,
	100% {
		opacity: 0;
		transform: scale(2);
	}
}

@media (prefers-reduced-motion: reduce) {
	body.gg-modern-shop .gg-pdp .gg-pdp__pulse::before {
		animation: none;
	}
}

/* Variation dropdowns: same field look as the quantity box. */
body:not(#gg) .gg-pdp .variations .gg-select .gg-select__btn {
	min-height: 52px;
	padding: 0 16px;
	border: 0;
	border-radius: 4px;
	background: #fff;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
	color: #121212;
	font-size: 14px;
	font-weight: 500;

	&:hover {
		background: #fff;
		box-shadow: 0 0 0 1px #b3924c;
	}

	&:focus-visible {
		outline: 0;
		box-shadow: 0 0 0 2px #d4af37;
	}
}

body:not(#gg) .gg-pdp .variations .gg-select .gg-select__list {
	border-radius: 4px;
}