/* comment to try to force github rebuild since stuck at que */

* {
	box-sizing: border-box;
}
html,
body {
	height: 100%;
}
body {
	margin: 0;
	font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, "Helvetica Neue", Arial, "Apple Color Emoji", "Segoe UI Emoji";
	background: radial-gradient(1200px 800px at 10% -10%, #152036 0%, var(--bg) 60%);
	color: var(--text);
}

.wrap {
	max-width: 1100px;
	margin: 0 auto;
	padding: 18px 20px;
}
.row {
	display: flex;
	align-items: center;
	gap: 14px;
}
.brand {
	font-weight: 800;
	letter-spacing: 0.2px;
}
.brand a {
	color: var(--text);
	text-decoration: none;
}

header {
	position: sticky;
	top: 0;
	z-index: 10;
	backdrop-filter: saturate(1.2) blur(8px);
	background: rgba(11, 13, 18, 0.6);
	border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.controls {
	display: flex;
	gap: 10px;
	align-items: center;
	flex-wrap: wrap;
}
input[type="search"],
select {
	background: var(--card);
	border: 1px solid rgba(255, 255, 255, 0.08);
	color: var(--text);
	padding: 10px 12px;
	border-radius: 10px;
	outline: none;
}
input[type="search"] {
	min-width: 220px;
}

main.wrap {
	padding-top: 20px;
}

footer {
	color: var(--muted);
	font-size: 12px;
	padding: 30px 20px;
	text-align: center;
}

.hero {
	padding: 60px 0 80px;
}
.hero-title {
	font-size: 42px;
	margin: 0 0 8px;
}
.hero-sub {
	color: var(--muted);
	margin: 0 0 14px;
}

.row-between {
	justify-content: space-between;
}

.section-heading-lg {
	margin: 0 0 12px;
}

.section-heading-sm {
	margin: 0 0 4px;
}

.section-subtext {
	margin: 0 0 10px;
}

.section-spacer-40 {
	margin-top: 40px;
}

.section-spacer-60 {
	margin-top: 60px;
}

.cart-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 12px;
}

.cart-item {
	display: grid;
	grid-template-columns: 80px 1fr auto;
	gap: 12px;
	align-items: center;
	padding: 8px;
}

.cart-item-thumb {
	aspect-ratio: 1/1;
}

.cart-item-body {
	padding: 0;
}

.cart-total-row {
	margin-top: 16px;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.qty-input {
	width: 70px;
	margin-left: 6px;
}

.btn-remove {
	margin-left: 8px;
}