.buyPage {
	background: #f5f5f7;
	color: #1d1d1f;
}

.topbar {
	position: sticky;
	top: 0;
	z-index: 100;
	backdrop-filter: saturate(180%) blur(20px);
	background: rgba(255, 255, 255, 0.78);
	border-bottom: 1px solid rgba(210, 210, 215, 0.9);
}

.topbarInner {
	width: min(calc(100% - 64px), 1200px);
	margin: 0 auto;
	display: grid;
	grid-template-columns: 180px 1fr 260px;
	align-items: center;
	height: 52px;
	gap: 24px;
}

.backLink,
.helpText,
.progress span {
	font-size: 12px;
	line-height: 1;
}

.backLink {
	font-weight: 600;
	text-decoration: none;
	justify-self: start;

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

.progress {
	display: inline-flex;
	justify-content: center;
	gap: 22px;
	color: #6e6e73;

	span {
		position: relative;
	}
}

.progressActive {
	color: #1d1d1f;
	font-weight: 600;
}

.helpText {
	margin: 0;
	justify-self: end;
	color: #6e6e73;
}

.hero {
	padding: 72px 32px 36px;
}

.heroInner {
	width: min(100%, 1200px);
	margin: 0 auto;
	display: grid;
	grid-template-columns: minmax(0, 1.2fr) minmax(320px, 0.8fr);
	gap: 32px;
	align-items: end;
}

.eyebrow,
.sectionKicker,
.stepCount,
.choiceEyebrow {
	margin: 0 0 12px;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #6e6e73;
}

.heroTitle {
	margin: 0;
	font-size: clamp(42px, 6vw, 72px);
	line-height: 0.95;
	letter-spacing: -0.05em;
	max-width: 10ch;
}

.heroBody {
	max-width: 62ch;
	margin: 22px 0 0;
	font-size: 18px;
	line-height: 1.55;
	color: #424245;
}

.heroMeta {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 14px;

	div {
		padding: 18px 18px 20px;
		border-radius: 24px;
		background: linear-gradient(180deg, #ffffff 0%, #f9f9fb 100%);
		border: 1px solid #e5e5ea;
		box-shadow: 0 16px 40px rgba(15, 23, 42, 0.06);
	}

	strong,
	span {
		display: block;
	}

	strong {
		font-size: 16px;
		margin-bottom: 6px;
	}

	span {
		font-size: 14px;
		line-height: 1.45;
		color: #6e6e73;
	}
}

.configSection {
	padding: 28px 32px 64px;
}

.configGrid {
	width: min(100%, 1200px);
	margin: 0 auto;
	display: grid;
	grid-template-columns: minmax(320px, 420px) minmax(0, 1fr);
	gap: 32px;
	align-items: start;
}

.summaryRail {
	position: sticky;
	top: 84px;
	align-self: start;
}

.summarySticky {
	display: grid;
	gap: 16px;
}

.supportRow {
	width: min(100%, 1200px);
	margin: 16px auto 0;
}

.previewCard,
.orderCard,
.assuranceCard,
.stepSection,
.notesPanel {
	background: #ffffff;
	border: 1px solid #e5e5ea;
	border-radius: 32px;
	box-shadow: 0 24px 60px rgba(15, 23, 42, 0.08);
}

.previewCard {
	padding: 20px;
}

.previewFrame {
	margin-top: 8px;
	padding: 22px;
	border-radius: 28px;
	background: radial-gradient(circle at top, #ffffff 0%, #f3f4f7 80%);
	border: 1px solid #ececf1;

	img {
		display: block;
		width: min(100%, 248px);
		max-height: 280px;
		height: auto;
		margin: 0 auto;
		object-fit: contain;
	}
}

.previewCopy {
	margin-top: 14px;
	display: grid;
	gap: 6px;
}

.previewTitle {
	margin: 0;
	font-size: 26px;
	font-weight: 700;
	letter-spacing: -0.03em;
}

.previewSubtitle {
	margin: 0;
	font-size: 15px;
	color: #6e6e73;
}

.previewSpec {
	margin: 0;
	font-size: 13px;
	line-height: 1.4;
	color: #424245;
}

.orderCard {
	padding: 20px;
}

.orderHeader {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 16px;

	h2 {
		margin: 0;
		font-size: 25px;
		line-height: 1;
		letter-spacing: -0.03em;
	}
	}

.priceNow {
	margin: 0;
	font-size: 29px;
	font-weight: 700;
	letter-spacing: -0.04em;
}

.orderRows {
	margin-top: 18px;
	display: grid;
	gap: 12px;
}

.orderRow,
.orderSavings {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	font-size: 14px;

	span {
		color: #6e6e73;
	}

	strong {
		font-size: 15px;
		font-weight: 600;
		text-align: right;
	}
}

.orderSavings {
	margin-top: 18px;
	padding-top: 16px;
	border-top: 1px solid #e5e5ea;
}

.cartStatusRow {
	margin-top: 18px;
	padding-top: 16px;
	border-top: 1px solid #e5e5ea;
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 16px;
	font-size: 13px;

	span {
		color: #6e6e73;
	}

	strong {
		font-size: 14px;
		font-weight: 700;
	}
}

.cartStatusCopy {
	display: grid;
	gap: 4px;

	strong {
		display: block;

		&[data-cart-flash="true"] {
			animation: cartCountPulse 0.55s ease;
		}
	}
}

.cartUtilityButton {
	padding: 0;
	border: 0;
	background: transparent;
	color: #0071e3;
	font-size: 13px;
	font-weight: 600;
	white-space: nowrap;
	cursor: pointer;

	&:disabled {
		opacity: 0.45;
		cursor: not-allowed;
	}
}

.cartList {
	margin-top: 16px;
	display: grid;
	gap: 12px;
	transition: transform 180ms ease, opacity 180ms ease;

	&[data-cart-flash="true"] {
		animation: cartListFlash 0.55s ease;
	}
}

.cartItem {
	display: grid;
	grid-template-columns: 92px minmax(0, 1fr);
	gap: 12px;
	align-items: center;
	padding: 10px;
	border: 1px solid #e5e5ea;
	border-radius: 22px;
	background: linear-gradient(180deg, #ffffff 0%, #fafafd 100%);
	box-shadow: 0 12px 28px rgba(15, 23, 42, 0.05);
}

.cartItemImageWrap {
	padding: 10px;
	border-radius: 18px;
	min-height: 86px;
	display: grid;
	place-items: center;
	border: 1px solid rgba(210, 210, 215, 0.72);

	img {
		display: block;
		width: 100%;
		height: auto;
		max-width: 72px;
	}
}

.cartItemBody {
	display: grid;
	gap: 4px;
	min-width: 0;
}

.cartItemTop {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 8px;
}

.cartItemTitle,
.cartItemSubtitle,
.cartItemMeta,
.cartItemPrice {
	margin: 0;
}

.cartItemTitle {
	font-size: 15px;
	line-height: 1.05;
	font-weight: 700;
	letter-spacing: -0.02em;
}

.cartItemSubtitle {
	font-size: 12px;
	line-height: 1.35;
	color: #424245;
}

.cartItemMeta {
	font-size: 11px;
	line-height: 1.35;
	color: #6e6e73;
}

.cartItemFooter {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	margin-top: 6px;
}

.cartItemPrice {
	font-size: 13px;
	font-weight: 700;
	color: #1d1d1f;
}

.cartItemRemove {
	flex: 0 0 auto;
	width: 26px;
	height: 26px;
	padding: 0;
	border: 0;
	border-radius: 999px;
	background: rgba(0, 0, 0, 0.05);
	color: #6e6e73;
	font-size: 18px;
	line-height: 1;
	cursor: pointer;
	transition: background 180ms ease, color 180ms ease;

	&:hover {
		background: rgba(180, 35, 24, 0.1);
		color: #b42318;
	}

	&:focus-visible {
		outline: 2px solid #0071e3;
		outline-offset: 2px;
	}
}

.cartItemEmpty {
	padding: 14px 16px;
	border: 1px dashed #d2d2d7;
	border-radius: 20px;
	background: rgba(255, 255, 255, 0.72);
	font-size: 12px;
	line-height: 1.45;
	color: #6e6e73;
}

.summaryActions {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 10px;
	margin-top: 18px;

	.primaryCta,
	.secondaryCta {
		margin-top: 0;
	}
}

.primaryCta {
	width: 100%;
	padding: 14px 18px;
	border: 0;
	border-radius: 999px;
	background: #0071e3;
	color: #ffffff;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;

	&:hover {
		background: #0077ed;
	}

	&:disabled {
		opacity: 0.45;
		cursor: not-allowed;
		background: #0071e3;
	}

	&[data-added="true"] {
		animation: addButtonPulse 0.8s ease;
	}
}

.secondaryCta {
	width: 100%;
	padding: 14px 18px;
	border: 1px solid rgba(0, 0, 0, 0.08);
	border-radius: 999px;
	background: rgba(0, 0, 0, 0.04);
	color: #1d1d1f;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;

	&:hover:not(:disabled) {
		background: rgba(0, 0, 0, 0.06);
	}

	&:disabled {
		opacity: 0.45;
		cursor: not-allowed;
	}
}

.orderFine {
	margin: 12px 0 0;
	font-size: 12px;
	line-height: 1.4;
	color: #6e6e73;

	&[data-cart-feedback-state="success"] {
		color: #18794e;
	}

	&[data-cart-feedback-state="error"] {
		color: #b42318;
	}
}

.cartToast {
	position: fixed;
	right: 24px;
	bottom: 24px;
	z-index: 120;
	min-width: min(320px, calc(100vw - 32px));
	max-width: 360px;
	padding: 14px 16px;
	border-radius: 22px;
	border: 1px solid rgba(210, 210, 215, 0.9);
	background: rgba(255, 255, 255, 0.96);
	box-shadow: 0 20px 48px rgba(15, 23, 42, 0.16);
	backdrop-filter: saturate(180%) blur(18px);
	opacity: 0;
	transform: translateY(16px);
	pointer-events: none;
	transition: opacity 180ms ease, transform 180ms ease;

	strong,
	span {
		display: block;
		margin: 0;
	}

	strong {
		font-size: 14px;
		margin-bottom: 4px;
	}

	span {
		font-size: 12px;
		line-height: 1.4;
		color: #424245;
	}

	&[data-visible="true"] {
		opacity: 1;
		transform: translateY(0);
	}

	&[data-state="success"] {
		border-color: rgba(24, 121, 78, 0.18);
	}

	&[data-state="error"] {
		border-color: rgba(180, 35, 24, 0.18);

		strong {
			color: #b42318;
		}
	}
}

@keyframes addButtonPulse {
	0% {
		transform: scale(1);
	}
	40% {
		transform: scale(1.03);
	}
	100% {
		transform: scale(1);
	}
}

@keyframes cartListFlash {
	0% {
		transform: translateY(0);
	}
	35% {
		transform: translateY(-2px);
	}
	100% {
		transform: translateY(0);
	}
}

@keyframes cartCountPulse {
	0% {
		transform: scale(1);
	}
	40% {
		transform: scale(1.04);
	}
	100% {
		transform: scale(1);
	}
}

.assuranceCard {
	padding: 20px;
	margin-top: 16px;

	h3 {
		margin: 0 0 12px;
		font-size: 18px;
		letter-spacing: -0.02em;
	}

	ul {
		margin: 0;
		padding-left: 18px;
		display: grid;
		gap: 8px;
		color: #424245;
		font-size: 13px;
		line-height: 1.4;
	}
}

@media (max-height: 920px) and (min-width: 901px) {
	.summaryRail {
		top: 72px;
	}

	.summarySticky {
		gap: 12px;
	}

	.previewCard,
	.orderCard,
	.assuranceCard {
		padding: 14px;
		border-radius: 26px;
	}

	.previewFrame {
		padding: 14px;

		img {
			width: min(100%, 148px);
			max-height: 14dvh;
		}
	}

	.previewCopy {
		margin-top: 10px;
		gap: 4px;
	}

	.previewTitle {
		font-size: 20px;
	}

	.previewSubtitle {
		font-size: 12px;
	}

	.previewSpec,
	.orderRow,
	.orderSavings {
		font-size: 11px;
	}

	.orderHeader {
		h2 {
			font-size: 20px;
		}
	}

	.priceNow {
		font-size: 22px;
	}

	.orderRows {
		margin-top: 12px;
		gap: 8px;
	}

	.orderSavings {
		margin-top: 12px;
		padding-top: 10px;
	}

	.primaryCta {
		margin-top: 12px;
		padding: 11px 16px;
		font-size: 12px;
	}

	.secondaryCta {
		padding: 11px 16px;
		font-size: 12px;
	}

	.assuranceCard ul {
		font-size: 12px;
		line-height: 1.35;
	}

	.assuranceCard h3 {
		font-size: 16px;
		margin-bottom: 10px;
	}
}

.builderColumn {
	display: grid;
	gap: 24px;
}

.stepSection {
	padding: 28px;
	scroll-margin-top: 96px;
}

.stepHeader {
	margin-bottom: 22px;

	h2 {
		margin: 0;
		font-size: 34px;
		line-height: 1.02;
		letter-spacing: -0.04em;
	}

	p:last-child {
		margin: 12px 0 0;
		font-size: 16px;
		line-height: 1.55;
		color: #6e6e73;
	}
}

.choiceGrid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 16px;
}

.choiceCard,
.colorCard,
.quantityButton {
	appearance: none;
	-webkit-appearance: none;
	width: 100%;
	padding: 0;
	border: 1px solid #d2d2d7;
	border-radius: 28px;
	background: #ffffff;
	color: inherit;
	text-align: left;
	cursor: pointer;
	transition:
		border-color 0.2s ease,
		box-shadow 0.2s ease,
		transform 0.2s ease;

	&:hover {
		border-color: #86868b;
		box-shadow: 0 16px 32px rgba(15, 23, 42, 0.08);
		transform: translateY(-1px);
	}

	&[aria-pressed="true"] {
		border-color: #0071e3;
		box-shadow: 0 0 0 4px rgba(0, 113, 227, 0.15);
	}

	&:disabled {
		opacity: 0.45;
		cursor: not-allowed;
		box-shadow: none;
		transform: none;
	}

	&:focus-visible {
		outline: 2px solid #0071e3;
		outline-offset: 3px;
	}
}

.choiceCard {
	padding: 20px 22px 22px;
	display: grid;
	gap: 8px;

	strong {
		font-size: 24px;
		line-height: 1.05;
		letter-spacing: -0.03em;
	}

	span {
		font-size: 14px;
		line-height: 1.5;
		color: #6e6e73;
	}
}

.colorGrid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 18px;
}

.colorCard {
	overflow: hidden;

	&[disabled] {
		display: none;
	}

	&[data-inventory-state="soldout"] {
		opacity: 0.62;
	}

	&[data-inventory-state="soldout"][aria-pressed="true"] {
		border-color: rgba(179, 38, 30, 0.5);
		box-shadow: 0 20px 48px rgba(179, 38, 30, 0.08);
	}
}

.colorImageWrap {
	padding: 26px;
	border-bottom: 1px solid rgba(210, 210, 215, 0.72);

	img {
		display: block;
		width: 100%;
		height: auto;
	}
}

.colorCopy {
	padding: 18px 20px 20px;
	display: grid;
	gap: 8px;

	p,
	strong,
	span {
		margin: 0;
	}

	strong {
		font-size: 24px;
		line-height: 1.05;
		letter-spacing: -0.03em;
	}

	span {
		font-size: 14px;
		line-height: 1.5;
		color: #6e6e73;
	}
}

.availabilityLine {
	margin: 4px 0 0;
}

.availabilityBadge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 26px;
	padding: 0 12px;
	border-radius: 999px;
	border: 1px solid rgba(210, 210, 215, 0.92);
	background: rgba(245, 245, 247, 0.92);
	color: #424245;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	line-height: 1;

	&[data-state="ready"] {
		background: rgba(232, 245, 235, 0.95);
		border-color: rgba(76, 175, 80, 0.22);
		color: #1f6f3e;
	}

	&[data-state="low"] {
		background: rgba(255, 244, 229, 0.95);
		border-color: rgba(255, 167, 38, 0.28);
		color: #a15c00;
	}

	&[data-state="soldout"] {
		background: rgba(255, 235, 238, 0.95);
		border-color: rgba(211, 47, 47, 0.18);
		color: #b3261e;
	}
}

.colorSwatchRow {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #6e6e73;
}

.colorSwatch {
	width: 14px;
	height: 14px;
	border-radius: 999px;
	border: 1px solid rgba(0, 0, 0, 0.08);
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.25);
}

.quantityRow {
	display: grid;
	grid-template-columns: minmax(0, 320px);
	gap: 14px;
}

.quantityField {
	padding: 20px;
	border: 1px solid rgba(210, 210, 215, 0.82);
	border-radius: 24px;
	background: rgba(255, 255, 255, 0.92);
	box-shadow: 0 16px 36px rgba(15, 23, 42, 0.06);
}

.quantityField {
	display: grid;
	gap: 10px;

	span {
		font-size: 12px;
		font-weight: 600;
		letter-spacing: 0.08em;
		text-transform: uppercase;
		color: #6e6e73;
	}

	input {
		width: 100%;
		padding: 16px 18px;
		border: 1px solid rgba(29, 29, 31, 0.14);
		border-radius: 18px;
		background: #ffffff;
		font-size: 24px;
		font-weight: 700;
		letter-spacing: -0.03em;
		color: #1d1d1f;

		&:focus-visible {
			outline: 2px solid rgba(0, 113, 227, 0.35);
			outline-offset: 2px;
			border-color: rgba(0, 113, 227, 0.5);
		}
	}
}

.notesPanel {
	margin-top: 18px;
	padding: 20px 22px;
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;

	div {
		display: grid;
		gap: 6px;
	}

	strong {
		font-size: 14px;
	}

	span {
		font-size: 13px;
		line-height: 1.5;
		color: #6e6e73;
	}
}

.bottomCheckoutCta {
	margin-top: 20px;
}

@media (max-width: 900px) {
	.topbarInner,
	.heroInner,
	.configGrid {
		width: min(calc(100% - 48px), 1200px);
	}

	.heroInner {
		grid-template-columns: 1fr;
	}

	.heroMeta {
		grid-template-columns: 1fr;
	}

	.configGrid {
		grid-template-columns: 1fr;
	}

	.summaryRail {
		position: static;
	}
}

@media (max-width: 734px) {
	.topbar {
		position: sticky;
		top: 0;
	}

	.topbarInner {
		width: calc(100% - 32px);
		height: auto;
		padding: calc(env(safe-area-inset-top, 0px) + 10px) 0 10px;
		grid-template-columns: auto auto;
		justify-content: space-between;
		gap: 10px 16px;
	}

	.helpText {
		display: none;
	}

	.progress {
		grid-column: 1 / -1;
		justify-content: flex-start;
		gap: 10px;
		overflow-x: auto;
		padding-bottom: 2px;
		scrollbar-width: none;

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

		span {
			flex: 0 0 auto;
			padding: 7px 10px;
			border-radius: 999px;
			background: rgba(0, 0, 0, 0.04);
		}
	}

	.progressActive {
		background: rgba(0, 113, 227, 0.1);
		color: #0071e3;
	}

	.hero {
		padding: 36px 16px 20px;
	}

	.heroInner {
		width: 100%;
		gap: 18px;
		align-items: start;
	}

	.eyebrow {
		margin-bottom: 10px;
	}

	.heroTitle {
		font-size: clamp(34px, 11vw, 46px);
		line-height: 0.98;
		max-width: none;
	}

	.heroBody {
		margin-top: 14px;
		font-size: 15px;
		line-height: 1.45;
		max-width: none;
	}

	.heroMeta {
		gap: 10px;

		div {
			padding: 14px 14px 15px;
			border-radius: 20px;
			box-shadow: 0 12px 28px rgba(15, 23, 42, 0.06);
		}

		strong {
			font-size: 14px;
			margin-bottom: 4px;
		}

		span {
			font-size: 12px;
			line-height: 1.4;
		}
	}

	.configSection {
		padding: 12px 16px 40px;
	}

	.configGrid,
	.supportRow {
		width: 100%;
	}

	.configGrid {
		gap: 16px;
	}

	.builderColumn {
		order: 1;
	}

	.summaryRail {
		order: 2;
	}

	.summarySticky,
	.builderColumn {
		gap: 16px;
	}

	.previewCard,
	.orderCard,
	.assuranceCard,
	.stepSection,
	.notesPanel {
		border-radius: 24px;
		box-shadow: 0 14px 30px rgba(15, 23, 42, 0.06);
	}

	.previewCard,
	.orderCard,
	.assuranceCard,
	.stepSection {
		padding: 18px;
	}

	.previewFrame {
		padding: 16px;
		border-radius: 22px;

		img {
			width: min(100%, 220px);
			max-height: 220px;
		}
	}

	.previewCopy {
		margin-top: 12px;
		gap: 4px;
	}

	.previewTitle {
		font-size: 22px;
	}

	.previewSubtitle {
		font-size: 13px;
	}

	.previewSpec {
		font-size: 12px;
	}

	.orderHeader {
		align-items: flex-start;

		h2 {
			font-size: 22px;
		}
	}

	.priceNow {
		font-size: 24px;
	}

	.orderRows {
		margin-top: 14px;
		gap: 10px;
	}

	.orderRow,
	.orderSavings {
		font-size: 12px;
		gap: 12px;

		strong {
			font-size: 13px;
		}
	}

	.cartItem {
		grid-template-columns: 78px minmax(0, 1fr);
		gap: 10px;
		padding: 8px;
		border-radius: 18px;
	}

	.cartItemImageWrap {
		min-height: 72px;
		padding: 8px;
		border-radius: 14px;

		img {
			max-width: 60px;
		}
	}

	.cartItemTitle {
		font-size: 14px;
	}

	.cartItemSubtitle,
	.cartItemMeta,
	.cartItemPrice {
		font-size: 11px;
	}

	.primaryCta {
		padding: 13px 16px;
		font-size: 13px;
	}

	.orderFine {
		font-size: 11px;
	}

	.cartUtilityButton {
		font-size: 12px;
	}

	.stepSection {
		scroll-margin-top: 88px;
	}

	.stepHeader {
		margin-bottom: 16px;

		h2 {
			font-size: 26px;
			line-height: 1.06;
		}

		p:last-child {
			margin-top: 10px;
			font-size: 14px;
			line-height: 1.45;
		}
	}

	.choiceGrid,
	.colorGrid {
		grid-template-columns: 1fr;
		gap: 12px;
	}

	.choiceCard {
		padding: 16px;
		gap: 6px;

		strong {
			font-size: 20px;
		}

		span {
			font-size: 13px;
			line-height: 1.4;
		}
	}

	.colorImageWrap {
		padding: 18px;
	}

	.colorCopy {
		padding: 14px 16px 16px;
		gap: 6px;

		strong {
			font-size: 20px;
		}

		span {
			font-size: 12px;
			line-height: 1.4;
		}
	}

	.colorSwatchRow {
		gap: 8px;
		font-size: 11px;
	}

	.quantityRow {
		grid-template-columns: 1fr;
		gap: 10px;
	}

	.quantityField {
		padding: 16px;
	}

	.quantityField {
		input {
			font-size: 21px;
		}
	}

	.notesPanel {
		margin-top: 14px;
		padding: 16px;
		grid-template-columns: 1fr;
		gap: 12px;

		strong {
			font-size: 13px;
		}

		span {
			font-size: 12px;
			line-height: 1.45;
		}
	}

	.summaryActions {
		grid-template-columns: 1fr;
	}

	.cartToast {
		left: 16px;
		right: 16px;
		bottom: 16px;
		min-width: 0;
		max-width: none;
	}

	.cartStatusRow {
		align-items: center;
	}

	.cartUtilityButton {
		font-size: 12px;
	}

	.bottomCheckoutCta {
		margin-top: 14px;
	}

	.supportRow {
		margin-top: 12px;
	}

	.assuranceCard {
		margin-top: 0;

		h3 {
			font-size: 16px;
			margin-bottom: 10px;
		}

		ul {
			gap: 6px;
			font-size: 12px;
			line-height: 1.4;
		}
	}

	.choiceCard,
	.colorCard,
	.quantityButton {
		&:hover {
			transform: none;
			box-shadow: none;
		}
	}
}
