.wrap {
	width: min(var(--wd1), 100% - 2 * var(--pz2));
	margin-left: auto;
	margin-right: auto;
}

.site-top {
	position: sticky;
	top: 0;
	z-index: 20;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--pz2);
	height: 64px;
	padding: 0 var(--pz2);
	background: var(--nc1);
	border-bottom: 1px solid var(--nc5);
}

.menu-toggle {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	min-width: 44px;
	min-height: 44px;
	padding: 0 12px;
	background: var(--nc2);
	border: 1px solid var(--nc5);
	border-radius: 0;
	cursor: pointer;
	font-size: 0.82rem;
	font-weight: 900;
	letter-spacing: 0.18em;
	text-transform: uppercase;
}

.menu-bars {
	display: grid;
	gap: 4px;
	width: 18px;
}

.menu-bars span {
	display: block;
	height: 2px;
	background: var(--nc3);
}

.top-right {
	display: flex;
	align-items: center;
	gap: var(--pz2);
	margin-left: auto;
}

.top-link {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	color: var(--nc3);
	text-decoration: none;
	font-size: 0.92rem;
}

.bag-link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 44px;
	padding: 0 12px;
	border: 1px solid var(--nc5);
	color: var(--nc3);
	text-decoration: none;
	font-size: 0.92rem;
}

.bag-link svg {
	width: 18px;
	height: 18px;
}

.bag-count {
	display: inline-grid;
	place-items: center;
	min-width: 24px;
	height: 24px;
	padding: 0 6px;
	background: var(--nc7);
	color: hsl(0, 0%, 100%);
	font-weight: 900;
	font-size: 0.8rem;
	transition: transform 0.25s ease;
}

.bag-count.js-seen {
	transform: scale(1.25);
}

.brand-mark {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	min-height: 44px;
	color: var(--nc3);
	text-decoration: none;
	font-family: var(--tp1);
	font-size: 1.35rem;
	line-height: 1;
}

.brand-mark img {
	width: 30px;
	height: 30px;
}

.site-menu {
	background: var(--nc2);
	border-bottom: 1px solid var(--nc5);
	padding: var(--pz1) var(--pz2);
}

.site-menu ul {
	display: flex;
	flex-wrap: wrap;
	gap: 0 var(--pz2);
	margin: 0;
	padding: 0;
	list-style: none;
}

.site-menu a {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	color: var(--nc3);
	text-decoration: none;
	font-size: 0.95rem;
}

.site-menu a[aria-current="page"] {
	background-image: linear-gradient(var(--nc7), var(--nc7));
	background-repeat: no-repeat;
	background-position: 0 78%;
	background-size: 100% 4px;
}

html.js-enabled .site-menu {
	position: fixed;
	top: 64px;
	left: 0;
	bottom: 0;
	z-index: 40;
	width: min(86vw, 360px);
	padding: var(--pz3) var(--pz3);
	overflow-y: auto;
	border-right: 1px solid var(--nc5);
	border-bottom: 0;
	box-shadow: var(--sm1);
	visibility: hidden;
	transform: translateX(-100%);
	transition: transform 0.28s ease, visibility 0s linear 0.28s;
}

html.js-enabled .site-menu.js-open {
	visibility: visible;
	transform: none;
	transition: transform 0.28s ease, visibility 0s;
}

html.js-enabled .site-menu ul {
	display: grid;
	gap: 0;
}

html.js-enabled .site-menu li {
	border-bottom: 1px solid var(--nc5);
}

html.js-enabled .site-menu a {
	width: 100%;
	min-height: 52px;
	font-size: 1.1rem;
}

@media (min-width: 1100px) {
	.site-top {
		height: var(--hd1);
		padding: 0 max(var(--pz2), (100% - var(--wd1)) / 2);
	}
	.menu-toggle,
	.top-link {
		display: none;
	}
	.site-menu,
	html.js-enabled .site-menu {
		position: fixed;
		top: 0;
		left: max(var(--pz2), (100% - var(--wd1)) / 2);
		bottom: auto;
		z-index: 21;
		width: auto;
		height: var(--hd1);
		display: flex;
		align-items: center;
		padding: 0;
		overflow: visible;
		background: transparent;
		border: 0;
		box-shadow: none;
		visibility: visible;
		transform: none;
		transition: none;
	}
	.site-menu ul,
	html.js-enabled .site-menu ul {
		display: flex;
		flex-wrap: nowrap;
		gap: 26px;
	}
	html.js-enabled .site-menu li {
		border: 0;
	}
	html.js-enabled .site-menu a {
		width: auto;
		min-height: 44px;
		font-size: 0.95rem;
	}
	html {
		scroll-padding-top: 104px;
	}
}

@media (max-width: 420px) {
	.brand-mark span {
		display: none;
	}
	.top-right {
		gap: 10px;
	}
}

.sec {
	position: relative;
	padding-top: var(--pz5);
	padding-bottom: var(--pz5);
}

.sec-a {
	background: linear-gradient(180deg, var(--nc1) 0%, var(--nc10) 100%);
	padding-top: var(--pz4);
	padding-bottom: var(--pz4);
}

.sec-b {
	background: linear-gradient(180deg, var(--nc10) 0%, var(--nc2) 100%);
}

.sec-c {
	background: linear-gradient(180deg, var(--nc2) 0%, var(--nc1) 100%);
	padding-top: 64px;
	padding-bottom: 64px;
}

.sec-d {
	background: linear-gradient(180deg, var(--nc1) 0%, var(--nc9) 100%);
	padding-top: 72px;
	padding-bottom: 72px;
}

.sec-e {
	background: linear-gradient(180deg, var(--nc9) 0%, var(--nc10) 100%);
	padding-top: var(--pz6);
	padding-bottom: var(--pz6);
}

.sec-f {
	background: linear-gradient(180deg, var(--nc10) 0%, var(--nc2) 100%);
	padding-top: 96px;
	padding-bottom: var(--pz7);
}

.sec-head {
	display: grid;
	gap: var(--pz2);
	margin-bottom: var(--pz4);
}

@media (min-width: 900px) {
	.sec-head {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
		align-items: end;
	}
	.sec-head p {
		margin-bottom: 6px;
	}
}

.hero-strip {
	padding-top: var(--pz4);
}

.hero-grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	grid-template-areas: "text" "strip" "facts";
	gap: var(--pz4);
}

.hero-text {
	grid-area: text;
}

.hero-text h1 {
	margin-bottom: var(--pz3);
}

.hero-facts {
	grid-area: facts;
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
	align-content: start;
}

.strip-band {
	grid-area: strip;
	padding: var(--pz2);
	border-top: 1px solid var(--nc5);
	border-bottom: 1px solid var(--nc5);
	background: linear-gradient(90deg, var(--nc10), var(--nc2));
}

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

.strip-row figure:first-child {
	grid-column: 1 / -1;
}

@media (min-width: 900px) {
	.hero-grid {
		grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
		grid-template-areas: "facts text" "strip strip";
		align-items: start;
	}
	.hero-text {
		padding-left: var(--pz3);
	}
	.hero-facts {
		margin-top: 10px;
	}
	.strip-row {
		grid-template-columns: 185fr 75fr 75fr;
	}
	.strip-row figure:first-child {
		grid-column: auto;
	}
}

.path-board {
	position: relative;
	padding: var(--pz4) var(--pz3);
	border: 1px solid var(--nc5);
	border-radius: var(--rz1);
	background: var(--nc10);
	box-shadow: var(--sm1);
}

.path-svg {
	display: none;
	width: 100%;
	height: auto;
	margin-bottom: var(--pz2);
}

.path-svg path {
	fill: none;
	stroke: var(--nc6);
	stroke-width: 3;
	stroke-linecap: round;
	stroke-dasharray: 1400;
	stroke-dashoffset: 0;
}

html.js-enabled .path-board:not(.js-seen) .path-svg path {
	stroke-dashoffset: 1400;
}

html.js-enabled .path-svg path {
	transition: stroke-dashoffset 1.6s ease;
}

.path-svg circle {
	fill: var(--nc1);
	stroke: var(--nc7);
	stroke-width: 4;
}

.path-steps {
	display: grid;
	gap: var(--pz3);
	margin: 0;
	padding: 0 0 0 var(--pz3);
	list-style: none;
	border-left: 3px solid var(--nc5);
}

.path-steps li {
	position: relative;
}

.path-steps li::before {
	content: "";
	position: absolute;
	left: calc(-1 * var(--pz3) - 10px);
	top: 6px;
	width: 14px;
	height: 14px;
	border: 3px solid var(--nc7);
	background: var(--nc1);
}

@media (min-width: 900px) {
	.path-svg {
		display: block;
	}
	.path-steps {
		grid-template-columns: repeat(5, minmax(0, 1fr));
		padding: 0;
		border-left: 0;
	}
	.path-steps li::before {
		display: none;
	}
}

.rail-shell,
.gal-shell {
	position: relative;
	min-width: 0;
}

.rail {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.rail-tools {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-top: var(--pz3);
}

.rail-meter {
	flex: 1;
	height: 4px;
	background: var(--nc5);
	position: relative;
	overflow: hidden;
}

.rail-meter span {
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	width: 30%;
	background: var(--nc6);
	transition: transform 0.2s ease, width 0.2s ease;
}

.gal {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
	margin: 0;
	padding: 0;
	list-style: none;
}

@media (min-width: 700px) {
	.rail {
		display: flex;
		gap: var(--pz3);
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		scrollbar-width: thin;
		padding-bottom: 10px;
	}
	.rail > li {
		flex: 0 0 min(340px, 42%);
		scroll-snap-align: start;
	}
	.gal {
		display: flex;
		gap: var(--pz3);
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		scrollbar-width: thin;
		padding-bottom: 10px;
	}
	.gal > li {
		flex: 0 0 min(560px, 78%);
		scroll-snap-align: center;
	}
}

@media (max-width: 699px) {
	.rail-tools {
		display: none;
	}
}

.who-grid {
	display: grid;
	gap: var(--pz3);
}

.who-photo {
	max-width: 420px;
	margin: 0;
}

@media (min-width: 900px) {
	.who-grid {
		grid-template-columns: minmax(0, 4fr) minmax(0, 8fr);
		grid-template-rows: auto auto;
	}
	.who-grid .who-photo {
		grid-row: span 2;
	}
}

.voice-row {
	display: grid;
	gap: 12px;
}

@media (min-width: 700px) {
	.voice-row {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

.cta-band {
	display: grid;
	gap: var(--pz3);
	padding: var(--pz5) var(--pz4);
	border: 1px solid var(--nc5);
	background: linear-gradient(120deg, var(--nc9), var(--nc1));
	box-shadow: var(--sm1);
}

@media (min-width: 900px) {
	.cta-band {
		grid-template-columns: minmax(0, 2fr) auto;
		align-items: center;
	}
}

@media (max-width: 600px) {
	.cta-band {
		padding: var(--pz4) var(--pz3);
	}
}

.page-head {
	padding-top: var(--pz5);
	padding-bottom: var(--pz4);
	background: linear-gradient(180deg, var(--nc1), var(--nc10));
	border-bottom: 1px solid var(--nc5);
}

.page-head h1 {
	font-size: clamp(2.2rem, 1.5rem + 2.2vw, 3.6rem);
	margin-bottom: var(--pz2);
}

@media (max-width: 600px) {
	.page-head {
		padding-top: var(--pz4);
		padding-bottom: var(--pz3);
	}
	.page-head .lead {
		font-size: 1rem;
	}
	#page .page-body {
		padding-top: var(--pz4);
	}
}

.page-body {
	padding-top: var(--pz5);
	padding-bottom: var(--pz6);
	background: linear-gradient(180deg, var(--nc10), var(--nc2));
}

.page-tail {
	padding-top: var(--pz6);
	padding-bottom: var(--pz7);
	background: linear-gradient(180deg, var(--nc2), var(--nc1));
}

.cols-2 {
	display: grid;
	gap: var(--pz3);
}

.cols-3 {
	display: grid;
	gap: var(--pz3);
}

@media (min-width: 800px) {
	.cols-2 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
	.cols-3 {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

.legal-grid {
	display: grid;
	gap: var(--pz4);
}

.legal-grid > div {
	min-width: 0;
}

@media (min-width: 1000px) {
	.legal-grid {
		grid-template-columns: 280px minmax(0, 1fr);
		align-items: start;
	}
	.legal-toc {
		position: sticky;
		top: 100px;
	}
}

.legal-stack {
	display: grid;
	gap: var(--pz3);
}

.contact-grid {
	display: grid;
	gap: var(--pz3);
}

.contact-grid > * {
	min-width: 0;
}

.contact-form-col {
	order: 1;
}

.contact-data-col {
	order: 2;
}

.contact-side-col {
	order: 3;
}

@media (min-width: 1000px) {
	.contact-grid {
		grid-template-columns: minmax(0, 4fr) minmax(0, 4fr) minmax(0, 4fr);
		align-items: start;
	}
	.contact-side-col {
		order: 1;
	}
	.contact-form-col {
		order: 2;
	}
	.contact-data-col {
		order: 3;
	}
}

.shop-grid {
	display: grid;
	gap: var(--pz3);
}

.shop-grid > * {
	min-width: 0;
}

@media (min-width: 960px) {
	.shop-grid {
		grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
		align-items: start;
	}
	.shop-aside {
		position: sticky;
		top: 100px;
	}
}

.cat-nav {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.cat-block {
	padding-top: var(--pz5);
	padding-bottom: var(--pz5);
	border-top: 1px solid var(--nc5);
}

.cat-even {
	background: linear-gradient(180deg, var(--nc10), var(--nc2));
}

.cat-odd {
	background: linear-gradient(180deg, var(--nc2), var(--nc10));
}

.cat-nav {
	margin-top: var(--pz3);
}

.toc-band {
	margin-top: var(--pz3);
	padding: 12px var(--pz3);
	border: 1px solid var(--nc5);
	background: var(--nc2);
}

.toc-row {
	display: flex;
	flex-wrap: wrap;
	gap: 0 var(--pz3);
}

.toc-row li {
	border-bottom: 0;
}

.cat-cards {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
	margin: 0;
	padding: 0;
	list-style: none;
}

@media (min-width: 800px) {
	.cat-cards {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: var(--pz3);
	}
}

@media (min-width: 1150px) {
	.cat-cards {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
}

.ficha {
	display: grid;
	gap: var(--pz3);
	padding-top: var(--pz4);
	padding-bottom: var(--pz5);
}

.ficha > * {
	min-width: 0;
}

.ficha-photo {
	order: 2;
}

.ficha-info {
	order: 1;
}

.ficha-photo img {
	width: auto;
	max-height: 56vh;
	margin: 0 auto;
}

@media (min-width: 900px) {
	.ficha {
		grid-template-columns: minmax(0, 6fr) minmax(0, 6fr);
		align-items: start;
		gap: var(--pz5);
	}
	.ficha-photo {
		order: 1;
		position: sticky;
		top: 100px;
	}
	.ficha-info {
		order: 2;
	}
	.ficha-photo img {
		max-height: 62vh;
	}
}

.crumbs {
	margin: 0 0 var(--pz2);
	color: var(--nc4);
	font-size: 0.92rem;
}

.crumbs a {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
}

.site-foot {
	padding-top: var(--pz6);
	padding-bottom: var(--pz5);
	background: var(--nc10);
	border-top: 1px solid var(--nc5);
}

.foot-cols {
	display: grid;
	gap: var(--pz4);
}

.foot-cols h2 {
	font-family: var(--tp2);
	font-weight: 900;
	font-size: 0.8rem;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--nc6);
	margin-bottom: 10px;
}

.foot-cols ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.foot-cols li a {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	color: var(--nc3);
	text-decoration: none;
}

.foot-cols li a:hover {
	text-decoration: underline;
}

.foot-legal {
	color: var(--nc4);
	font-size: 0.92rem;
	max-width: 70ch;
}

.foot-legal a {
	color: var(--nc6);
}

.foot-copy {
	margin-top: var(--pz4);
	padding-top: var(--pz3);
	border-top: 1px solid var(--nc5);
	color: var(--nc4);
	font-size: 0.9rem;
}

@media (min-width: 700px) {
	.foot-cols {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
	.foot-cols .foot-brand {
		grid-column: 1 / -1;
	}
}

@media (min-width: 1100px) {
	.foot-cols {
		grid-template-columns: minmax(0, 5fr) repeat(3, minmax(0, 2fr));
	}
	.foot-cols .foot-brand {
		grid-column: auto;
	}
}