/*
 * Bosstad Tweewielers - catalogue styling.
 * Sinds 2026-09-09 gekoppeld aan het centrale Bosstad-designsysteem (tokens, Barlow/Newsreader,
 * radius 4/2, zachte schaduw). Body 17px blijft: veel oudere klanten.
 */

.bt-cs-catalogue { /* Tokens komen uit het Bosstad-designsysteem (uploads/bosstad/bosstad-design-system.css); de fallbacks houden de catalogus overeind als die stylesheet ontbreekt. */ --bt-ink: var(--bs-ink, #1C2022); --bt-ink-2: var(--bs-ink-2, #2C3235);
	--bt-muted: var(--bs-muted, #697478);
	--bt-teal: var(--bs-teal, #0F8A7C);
	--bt-teal-bright: var(--bs-turquoise, #33C7B7);
	--bt-teal-light: var(--bs-turquoise-light, #4FD8C8);
	--bt-btn-ink: var(--bs-btn-ink, #06110F);
	--bt-border: var(--bs-border, #E3E4E2);
	--bt-border-soft: var(--bs-border-soft, #EEF0EF);
	--bt-surface: var(--bs-surface, #FFFFFF);
	--bt-surface-soft: var(--bs-surface-soft, #F6F5F2);
	--bt-radius: var(--bs-radius, 4px);
	--bt-radius-sm: var(--bs-radius-sm, 2px);
	--bt-shadow: var(--bs-shadow-soft, 0 1px 2px rgba(28, 32, 34, .04), 0 8px 24px rgba(28, 32, 34, .06));
	--bt-shadow-lift: 0 1px 2px rgba(28, 32, 34, .04), 0 8px 24px rgba(28, 32, 34, .06);
	--bt-font: var(--bs-font-body, Barlow, system-ui, -apple-system, "Segoe UI", sans-serif);
	--bt-font-display: var(--bs-font-display, Newsreader, Georgia, serif); }

.bt-cat, .bt-single { font-family: var(--bt-font);
	color: var(--bt-ink);
	font-size: 17px;
	line-height: 1.6;
	background: var(--bt-surface); }

.bt-wrap { width: 100%;
	max-width: 1440px;
	margin-inline: auto;
	padding-inline: clamp(18px, 4vw, 48px); }

/* ---------------------------------------------------------------- headings */ .bt-cat__head { background: var(--bt-surface-soft);
	border-bottom: 1px solid var(--bt-border);
	padding: clamp(28px, 5vw, 56px) 0 clamp(24px, 4vw, 40px); }

.bt-cat__title { font-family: var(--bt-font-display);
	font-size: clamp(34px, 4.4vw, 52px);
	line-height: 1.1;
	letter-spacing: 0;
	margin: 6px 0 12px;
	color: var(--bt-ink);
	font-weight: 400; }

.bt-cat__intro { margin: 0;
	max-width: 62ch;
	color: var(--bt-muted);
	font-size: 1.05rem; }

.bt-crumbs { display: flex;
	flex-wrap: wrap;
	gap: 8px;
	align-items: center;
	font-size: .93rem;
	color: var(--bt-muted);
	padding: 18px 0 0; }

.bt-crumbs a { color: var(--bt-ink-2);
	text-decoration: none; }

.bt-crumbs a:hover, .bt-crumbs a:focus-visible { color: var(--bt-teal);
	text-decoration: underline; }

.bt-crumbs span[aria-hidden] { color: #B9C1C3; }

/* ----------------------------------------------------------------- layout */ .bt-cat__body { display: grid;
	grid-template-columns: 292px minmax(0, 1fr);
	gap: clamp(24px, 3vw, 44px);
	padding-block: clamp(26px, 4vw, 44px) clamp(48px, 7vw, 88px);
	align-items: start; }

@media (max-width: 980px) { .bt-cat__body { grid-template-columns: minmax(0, 1fr); } }

/* ---------------------------------------------------------------- filters */ .bt-filters { position: sticky;
	top: 24px; }

@media (max-width: 980px) { .bt-filters { position: static; } }

/* Mobile disclosure is pure CSS: the checkbox carries no name attribute, so it is never submitted with the filter form. No JavaScript, no <details> quirks. */ .bt-filters .bt-filters__toggle { display: none;
	width: 100%;
	margin-bottom: 14px; }

.bt-filters__toggle-close { display: none; }

#bt-filter-toggle:checked ~ .bt-filters__toggle .bt-filters__toggle-open { display: none; }

#bt-filter-toggle:checked ~ .bt-filters__toggle .bt-filters__toggle-close { display: inline; }

#bt-filter-toggle:focus-visible ~ .bt-filters__toggle { outline: 3px solid rgba(15, 138, 124, .3);
	outline-offset: 2px; }

.bt-filters__inner { border: 1px solid var(--bt-border);
	border-radius: var(--bt-radius);
	background: var(--bt-surface);
	padding: 20px;
	display: grid;
	gap: 22px; }

.bt-filters__group { border: 0;
	margin: 0;
	padding: 0; }

.bt-filters__group + .bt-filters__group { border-top: 1px solid var(--bt-border-soft);
	padding-top: 20px; }

.bt-filters__label { display: block;
	font-weight: 700;
	font-size: .95rem;
	letter-spacing: .01em;
	margin-bottom: 10px;
	padding: 0;
	color: var(--bt-ink); }

.bt-filters input[type="search"], .bt-filters input[type="number"] { width: 100%;
	font: inherit;
	font-size: 1rem;
	color: var(--bt-ink);
	padding: 11px 13px;
	border: 1px solid var(--bt-border);
	border-radius: var(--bt-radius-sm);
	background: #fff; }

.bt-filters input:focus-visible { outline: 3px solid rgba(15, 138, 124, .28);
	outline-offset: 1px;
	border-color: var(--bt-teal); }

.bt-check { display: flex;
	align-items: center;
	gap: 10px;
	padding: 7px 0;
	cursor: pointer;
	font-size: .99rem;
	min-height: 40px; }

.bt-check input { width: 19px;
	height: 19px;
	accent-color: var(--bt-teal);
	flex: none;
	cursor: pointer; }

.bt-check span { display: flex;
	gap: 7px;
	align-items: baseline; }

.bt-check em { font-style: normal;
	color: var(--bt-muted);
	font-size: .86rem; }

.bt-check:hover span { color: var(--bt-teal); }

.bt-range { display: flex;
	align-items: center;
	gap: 9px; }

.bt-range span { color: var(--bt-muted); }

.bt-filters__actions { display: grid;
	gap: 10px;
	justify-items: start; }

.bt-filters__actions .bt-btn { width: 100%; }

.bt-filters__reset { font-size: .93rem;
	color: var(--bt-muted); }

.bt-filters__reset:hover { color: var(--bt-teal); }

/* ---------------------------------------------------------------- toolbar */ .bt-toolbar { display: flex;
	flex-wrap: wrap;
	gap: 14px;
	align-items: center;
	justify-content: space-between;
	padding-bottom: 20px;
	margin-bottom: 22px;
	border-bottom: 1px solid var(--bt-border); }

.bt-toolbar__count { margin: 0;
	color: var(--bt-muted); }

.bt-toolbar__count strong { color: var(--bt-ink);
	font-size: 1.12rem; }

.bt-toolbar__sort { display: flex;
	align-items: center;
	gap: 10px;
	margin: 0; }

.bt-toolbar__sort label { color: var(--bt-muted);
	font-size: .95rem; }

.bt-toolbar__sort select { font: inherit;
	font-size: .98rem;
	padding: 10px 13px;
	border: 1px solid var(--bt-border);
	border-radius: var(--bt-radius-sm);
	background: #fff;
	color: var(--bt-ink);
	min-height: 44px;
	cursor: pointer; }

/* ------------------------------------------------------------------- grid */ .bt-grid { display: grid;
	grid-template-columns: repeat(auto-fill, minmax(266px, 1fr));
	gap: clamp(16px, 2vw, 26px); }

.bt-grid--related { margin-top: 20px; }

.bt-card { border: 1px solid var(--bt-border);
	border-radius: var(--bt-radius);
	background: var(--bt-surface);
	overflow: hidden;
	transition: box-shadow .18s ease, transform .18s ease, border-color .18s ease; }

.bt-card:hover, .bt-card:focus-within { box-shadow: var(--bt-shadow-lift);
	transform: translateY(-2px);
	border-color: #CBD3D1; }

.bt-card__link { display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	color: inherit; }

.bt-card__link:focus-visible { outline: 3px solid var(--bt-teal);
	outline-offset: -3px; }

.bt-card__media { position: relative;
	background: var(--bt-surface-soft);
	aspect-ratio: 4 / 3; }

.bt-card__img { width: 100%;
	height: 100%;
	object-fit: contain;
	display: block;
	padding: 12px; }

.bt-card__img--empty { display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 8px;
	color: #AEB8BA;
	font-size: .88rem; }

.bt-card__img--empty svg { width: 68px;
	height: auto; }

.bt-card__img--empty .bt-placeholder-logo { width: 42%;
	max-width: 150px;
	height: auto; }

.bt-card__img--empty span { font-size: .8rem; }

.bt-card__tags { position: absolute;
	top: 12px;
	left: 12px;
	display: flex;
	flex-wrap: wrap;
	gap: 6px; }

.bt-tag { display: inline-block;
	font-size: .76rem;
	font-weight: 600;
	letter-spacing: .02em;
	padding: 5px 10px;
	border-radius: 999px;
	background: #EDF1F0;
	color: var(--bt-ink-2);
	line-height: 1.3; }

.bt-tag--ebike { background: var(--bt-teal-bright);
	color: var(--bt-btn-ink); }

.bt-tag--used { background: #FFE9C7;
	color: #6A4A12; }

.bt-card__body { display: flex;
	flex-direction: column;
	gap: 5px;
	padding: 17px 18px 18px;
	flex: 1; }

.bt-card__brand { margin: 0;
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: 3px;
	text-transform: uppercase;
	color: var(--bt-teal); }

.bt-card__title { margin: 0;
	font-size: 1.14rem;
	line-height: 1.3;
	font-weight: 700;
	color: var(--bt-ink); }

.bt-card__type { margin: 0;
	font-size: .92rem;
	color: var(--bt-muted); }

.bt-card__facts { list-style: none;
	margin: 4px 0 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 6px; }

.bt-card__facts li { list-style: none;
	font-size: .82rem;
	color: var(--bt-ink-2);
	background: var(--bt-surface-soft);
	border: 1px solid var(--bt-border-soft);
	padding: 3px 9px;
	border-radius: 999px; }

.bt-card__foot { margin-top: auto;
	padding-top: 12px;
	display: flex;
	flex-wrap: wrap;
	gap: 4px 12px;
	align-items: baseline;
	justify-content: space-between; }

.bt-card__price { margin: 0;
	font-size: 1.32rem;
	font-weight: 700;
	letter-spacing: -.01em;
	color: var(--bt-ink); }

.bt-card__cta { margin-top: 13px;
	width: 100%;
	justify-content: center;
	pointer-events: none; }

/* ------------------------------------------------------------------ stock */ .bt-stock { margin: 0;
	display: inline-flex;
	align-items: center;
	gap: 7px;
	font-size: .9rem;
	font-weight: 600; }

.bt-stock__dot { width: 9px;
	height: 9px;
	border-radius: 50%;
	flex: none; }

.bt-stock--in { color: #0B7A55; }

.bt-stock--in .bt-stock__dot { background: #16A34A;
	box-shadow: 0 0 0 3px rgba(22, 163, 74, .16); }

.bt-stock--out { color: #8A6A1F; }

.bt-stock--out .bt-stock__dot { background: #D9A21B;
	box-shadow: 0 0 0 3px rgba(217, 162, 27, .16); }

/* --------------------------------------------------------------- buttons */ .bt-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	font-family: var(--bt-font);
	font-weight: 700;
	font-size: 12.5px;
	letter-spacing: 1.7px;
	text-transform: uppercase;
	line-height: 1;
	min-height: 46px;
	padding: 15px 24px;
	border-radius: var(--bt-radius-sm);
	border: 1px solid transparent;
	cursor: pointer;
	text-decoration: none;
	transition: background .18s cubic-bezier(.2,.7,.2,1), color .18s cubic-bezier(.2,.7,.2,1), border-color .18s cubic-bezier(.2,.7,.2,1);
}

.bt-btn--lg { min-height: 52px; padding: 18px 30px; font-size: 13px; }

.bt-btn--primary { background: var(--bt-teal-bright);
	color: var(--bt-btn-ink); }

.bt-card:hover .bt-btn--primary, .bt-btn--primary:hover, .bt-btn--primary:focus-visible { background: var(--bt-teal-light);
	color: var(--bt-btn-ink); }

.bt-btn--ghost { background: #fff;
	color: var(--bt-ink);
	border-color: var(--bt-border); }

.bt-btn--ghost:hover, .bt-btn--ghost:focus-visible { border-color: var(--bt-teal);
	color: var(--bt-teal); }

.bt-btn:focus-visible { outline: 3px solid rgba(15, 138, 124, .3);
	outline-offset: 2px; }

/* ------------------------------------------------------------------ empty */ .bt-empty { border: 1px dashed var(--bt-border);
	border-radius: var(--bt-radius);
	background: var(--bt-surface-soft);
	padding: clamp(34px, 6vw, 64px) 28px;
	text-align: center; }

.bt-empty h2 { margin: 0 0 10px;
	font-size: 1.5rem;
	color: var(--bt-ink); }

.bt-empty p { margin: 0 auto 22px;
	max-width: 52ch;
	color: var(--bt-muted); }

/* ------------------------------------------------------------- pagination */ .bt-pagination, .pagination { margin-top: 40px; }

.bt-pagination .nav-links, .pagination .nav-links { display: flex;
	flex-wrap: wrap;
	gap: 8px;
	justify-content: center; }

.bt-pagination .page-numbers, .pagination .page-numbers { display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 46px;
	min-height: 46px;
	padding: 0 14px;
	border: 1px solid var(--bt-border);
	border-radius: var(--bt-radius-sm);
	text-decoration: none;
	color: var(--bt-ink);
	font-weight: 600;
	background: #fff; }

.bt-pagination .page-numbers:hover, .pagination .page-numbers:hover { border-color: var(--bt-teal);
	color: var(--bt-teal); }

.bt-pagination .page-numbers.current, .pagination .page-numbers.current { background: var(--bt-ink);
	border-color: var(--bt-ink);
	color: #fff; }

/* ----------------------------------------------------------------- single */ .bt-single__top { display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
	gap: clamp(26px, 4vw, 56px);
	padding-block: 22px clamp(34px, 5vw, 56px);
	align-items: start; }

@media (max-width: 900px) { .bt-single__top { grid-template-columns: minmax(0, 1fr); } }

.bt-gallery__main { margin: 0;
	border: 1px solid var(--bt-border);
	border-radius: var(--bt-radius);
	background: var(--bt-surface-soft);
	aspect-ratio: 4 / 3;
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: center; }

.bt-gallery__img { width: 100%;
	height: 100%;
	object-fit: contain;
	padding: 20px; }

.bt-gallery__main--empty { flex-direction: column;
	gap: 14px;
	color: #AEB8BA;
	text-align: center;
	padding: 26px; }

.bt-gallery__main--empty svg { width: 96px;
	height: auto; }

.bt-gallery__main--empty .bt-placeholder-logo { width: 36%;
	max-width: 200px;
	height: auto; }

.bt-gallery__main--empty p { margin: 0;
	font-size: .95rem; }

.bt-gallery__thumbs { display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 12px; }

.bt-gallery__thumb { width: 84px;
	height: 84px;
	border: 1px solid var(--bt-border);
	border-radius: var(--bt-radius-sm);
	overflow: hidden;
	background: var(--bt-surface-soft);
	display: block; }

.bt-gallery__thumb img { width: 100%;
	height: 100%;
	object-fit: contain;
	padding: 5px; }

.bt-gallery__thumb:hover { border-color: var(--bt-teal); }

.bt-summary__tags { display: flex;
	flex-wrap: wrap;
	gap: 7px;
	margin-bottom: 14px; }

.bt-summary__brand { margin: 0 0 6px;
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: 3px;
	text-transform: uppercase;
	color: var(--bt-teal); }

.bt-summary__title { margin: 0 0 16px;
	font-family: var(--bt-font-display);
	font-size: clamp(30px, 3.6vw, 46px);
	line-height: 1.12;
	letter-spacing: 0;
	font-weight: 400;
	color: var(--bt-ink); }

.bt-summary__pricing { display: flex;
	flex-wrap: wrap;
	gap: 6px 14px;
	align-items: baseline; }

.bt-summary__price { margin: 0;
	font-size: clamp(28px, 3.4vw, 36px);
	font-weight: 700;
	letter-spacing: -.02em; }

.bt-summary__rrp { margin: 0;
	color: var(--bt-muted);
	font-size: .97rem; }

.bt-summary .bt-stock { margin-top: 12px;
	font-size: 1rem; }

.bt-facts { margin: 24px 0 0;
	padding: 0;
	border-top: 1px solid var(--bt-border-soft); }

.bt-facts__row { display: flex;
	gap: 16px;
	justify-content: space-between;
	padding: 11px 0;
	border-bottom: 1px solid var(--bt-border-soft); }

.bt-facts dt { margin: 0;
	color: var(--bt-muted); }

.bt-facts dd { margin: 0;
	font-weight: 600;
	text-align: right; }

.bt-battery { margin-top: 22px;
	padding: 16px 18px;
	border: 1px solid var(--bt-border);
	border-left: 4px solid var(--bt-teal-bright);
	border-radius: var(--bt-radius-sm);
	background: var(--bt-surface-soft); }

.bt-battery h2 { margin: 0 0 8px;
	font-size: 1.03rem; }

.bt-battery li { list-style: none; }

.bt-battery ul { list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 6px 18px;
	font-size: .95rem;
	color: var(--bt-ink-2); }

.bt-cta { margin-top: 28px;
	display: flex;
	flex-wrap: wrap;
	gap: 11px; }

.bt-cta__note { flex-basis: 100%;
	margin: 4px 0 0;
	color: var(--bt-muted);
	font-size: .93rem; }

.bt-single__detail { display: grid;
	gap: clamp(22px, 3vw, 34px);
	padding-bottom: clamp(40px, 6vw, 72px); }

.bt-panel { border: 1px solid var(--bt-border);
	border-radius: var(--bt-radius);
	padding: clamp(20px, 3vw, 30px);
	background: #fff; }

.bt-panel__title { margin: 0 0 16px;
	font-family: var(--bt-font-display);
	font-size: clamp(22px, 2.2vw, 24px);
	font-weight: 400;
	letter-spacing: 0;
	line-height: 1.25;
	color: var(--bt-ink); }

.bt-panel__lead { margin: 0;
	color: var(--bt-muted); }

.bt-prose { color: var(--bt-ink-2);
	max-width: 78ch; }

.bt-prose p { margin: 0 0 14px; }

.bt-specs { width: 100%;
	border-collapse: collapse;
	font-size: .97rem; }

.bt-specs tr { border-bottom: 1px solid var(--bt-border-soft); }

.bt-specs tr:nth-child(odd) { background: var(--bt-surface-soft); }

.bt-specs th { text-align: left;
	font-weight: 600;
	color: var(--bt-muted);
	padding: 11px 14px;
	width: 42%;
	vertical-align: top; }

.bt-specs td { padding: 11px 14px;
	color: var(--bt-ink); }

@media (max-width: 620px) { .bt-specs th, .bt-specs td { display: block;
	width: auto; }

.bt-specs th { padding-bottom: 2px; }

.bt-specs td { padding-top: 0;
	font-weight: 600; } }

.bt-ref { margin: 0;
	color: #98A2A5;
	font-size: .86rem; }

.bt-related { padding-bottom: clamp(48px, 7vw, 88px); }

/* ---------------------------------------------------------- mobile filters */ @media (max-width: 980px) { .bt-filters .bt-filters__toggle { display: inline-flex; }

.bt-filters__inner { display: none; }

#bt-filter-toggle:checked ~ .bt-filters__inner { display: grid; } }

.bt-sr, .screen-reader-text { position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	border: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	clip-path: inset(50%);
	white-space: nowrap; }

/* ------------------------------------------------------- overflow guards */ .bt-cat, .bt-single { overflow-x: clip; }

.bt-cat img, .bt-single img { max-width: 100%;
	height: auto; }

.bt-grid > *, .bt-cat__body > *, .bt-single__top > * { min-width: 0; }

.bt-card__title, .bt-card__type, .bt-card__brand, .bt-summary__title, .bt-facts dd, .bt-specs td, .bt-specs th, .bt-prose { overflow-wrap: anywhere;
	word-break: break-word; }

.bt-specs__scroll { max-width: 100%;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch; }

.bt-empty svg { width: 78px;
	height: auto;
	color: #C3CBCD;
	margin-bottom: 6px; }

.bt-toolbar__sort select { max-width: 100%; }

.bt-crumbs { overflow-wrap: anywhere; }

/* Belt and braces: the theme styles bare <li>, so reset inside the catalogue. */ .bt-cs-catalogue .bt-card__facts li, .bt-cs-catalogue .bt-battery li, .bt-cs-catalogue .bt-gallery__thumbs li { list-style: none;
	list-style-type: none; }

/* ------------------------------------------------------ availability */ .bt-card__where { margin: 6px 0 0;
	display: flex;
	flex-wrap: wrap;
	gap: 5px; }

.bt-where { font-size: .78rem;
	font-weight: 600;
	color: var(--bt-teal);
	background: rgba(51, 199, 183, .13);
	border-radius: 999px;
	padding: 3px 9px;
	line-height: 1.3; }

.bt-avail { margin-top: 20px;
	padding: 16px 18px;
	border: 1px solid var(--bt-border);
	border-radius: var(--bt-radius-sm);
	background: var(--bt-surface-soft); }

.bt-avail__title { margin: 0 0 8px;
	font-size: 1rem;
	font-weight: 700; }

.bt-avail__list { list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 8px; }

.bt-avail__item { list-style: none;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 4px 10px;
	font-size: .98rem; }

.bt-avail__item .bt-stock__dot { background: #16A34A;
	box-shadow: 0 0 0 3px rgba(22,163,74,.16); }

.bt-avail__count { color: var(--bt-muted);
	font-size: .92rem; }

.bt-avail__link { margin-left: auto;
	font-size: .9rem;
	color: var(--bt-ink-2);
	white-space: nowrap; }

.bt-avail__link:hover { color: var(--bt-teal); }

.bt-avail__none { margin: 0;
	color: var(--bt-muted);
	font-size: .95rem; }

/* --------------------------------------------------------------- forms */ .bt-testride__grid { display: grid;
	grid-template-columns: minmax(0, 380px) minmax(0, 1fr);
	gap: clamp(26px, 4vw, 56px);
	padding-block: 22px clamp(48px, 7vw, 88px);
	align-items: start; }

@media (max-width: 900px) { .bt-testride__grid { grid-template-columns: minmax(0, 1fr); } }

.bt-testride__eyebrow { margin: 0 0 10px;
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: 3px;
	text-transform: uppercase;
	color: var(--bt-teal); }

.bt-testride__card { border: 1px solid var(--bt-border);
	border-radius: var(--bt-radius);
	overflow: hidden;
	background: #fff; }

.bt-testride__media { background: var(--bt-surface-soft);
	aspect-ratio: 4 / 3;
	display: flex;
	align-items: center;
	justify-content: center; }

.bt-testride__media img { width: 100%;
	height: 100%;
	object-fit: contain;
	padding: 14px; }

.bt-testride__body { padding: 18px 20px 20px;
	display: grid;
	gap: 6px; }

.bt-testride__body .bt-card__price { font-size: 1.45rem;
	margin-top: 6px; }

.bt-testride__back { margin-top: 10px;
	font-size: .95rem;
	color: var(--bt-ink-2); }

.bt-testride__back:hover { color: var(--bt-teal); }

.bt-testride__lead { margin: 0 0 24px;
	color: var(--bt-muted);
	max-width: 60ch;
	font-size: 1.05rem; }

.bt-testride__done p { color: var(--bt-ink-2);
	max-width: 60ch; }

.bt-form { display: grid;
	gap: 18px;
	max-width: 640px; }

.bt-form__grid { display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 18px; }

@media (max-width: 560px) { .bt-form__grid { grid-template-columns: 1fr; } }

.bt-form__row { display: grid;
	gap: 7px; }

.bt-form__row label { font-weight: 700;
	font-size: .98rem; }

.bt-form__row label span[aria-hidden] { color: var(--bt-teal); }

.bt-form__opt { font-weight: 400;
	color: var(--bt-muted);
	font-size: .9rem; }

.bt-form input[type="text"], .bt-form input[type="tel"], .bt-form input[type="email"], .bt-form select, .bt-form textarea { width: 100%;
	font: inherit;
	font-size: 1.05rem;
	color: var(--bt-ink);
	padding: 13px 15px;
	border: 1px solid var(--bt-border);
	border-radius: var(--bt-radius-sm);
	background: #fff;
	min-height: 50px; }

.bt-form textarea { min-height: 110px;
	resize: vertical; }

.bt-form input:focus-visible, .bt-form select:focus-visible, .bt-form textarea:focus-visible { outline: 3px solid rgba(15, 138, 124, .28);
	outline-offset: 1px;
	border-color: var(--bt-teal); }

.bt-form__hp { position: absolute !important;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden; }

.bt-form__errors { border: 1px solid #E7B4B4;
	border-left: 4px solid #C62828;
	background: #FFF6F6;
	border-radius: var(--bt-radius-sm);
	padding: 14px 16px;
	color: #7A1F1F; }

.bt-form__errors ul { margin: 8px 0 0 18px;
	padding: 0; }

.bt-form__note { margin: 0;
	color: var(--bt-muted);
	font-size: .93rem;
	max-width: 56ch; }

.bt-form .bt-btn { justify-self: start; }

.bt-form__hint { margin: 0;
	font-size: .9rem;
	color: var(--bt-muted); }

.bt-testride__none p { color: var(--bt-ink-2);
	max-width: 60ch; }