/* ==========================================================================
   BAS Farmers Market — Frontend Module Styles
   ========================================================================== */

/* ── BAS Shared Button Style ───────────────────────────────────────────── */
/*
 * Matches the site-wide pill button standard:
 * gradient background, white text, pill border-radius, Lato font.
 */
.bas-btn-primary {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: linear-gradient(180deg, #c2e86b 0%, #70ac43 100%);
	color: #fff !important;
	border: 1px solid #70ac43;
	border-radius: 100px;
	padding: 11px 28px;
	font-size: 15px;
	font-weight: 700;
	font-family: Lato, sans-serif;
	text-decoration: none !important;
	cursor: pointer;
	transition: opacity 0.2s, transform 0.15s;
	white-space: nowrap;
	line-height: 1;
}
.bas-btn-primary:hover  { opacity: 0.88; transform: translateY(-1px); }
.bas-btn-primary:active { transform: translateY(0); }

/* ── Market Vendors Module ─────────────────────────────────────────────── */
.bas-market-vendors__grid {
	display: grid;
	gap: 1.5rem;
}
.bas-market-vendors__grid--cols-2 { grid-template-columns: repeat(2, 1fr); }
.bas-market-vendors__grid--cols-3 { grid-template-columns: repeat(3, 1fr); }

/* Card — banner + avatar + info design */
.bas-market-vendors__card {
	background: #fff;
	border: 1px solid #e8e8e8;
	border-radius: 12px;
	overflow: hidden;
	box-shadow: 0 2px 10px rgba(0,0,0,0.07);
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	padding: 0;
}

/* Banner area: vendor's store banner as background image */
.bas-market-vendors__banner {
	width: 100%;
	height: 130px;
	background-color: #c2e86b;    /* fallback when vendor has no banner */
	background-size: cover;
	background-position: center;
	position: relative;
	flex-shrink: 0;
	margin-bottom: 50px;          /* space for overlapping avatar */
}

/* Vendor profile image: circle overlapping banner bottom center */
.bas-market-vendors__avatar {
	width: 90px;
	height: 90px;
	border-radius: 50%;
	border: 3px solid #fff;
	object-fit: cover;
	position: absolute;
	bottom: -45px;                /* overlap 50%: half of 90px height */
	left: 50%;
	transform: translateX(-50%);
	background-color: #f0f0f0;    /* placeholder while loading */
	box-shadow: 0 2px 8px rgba(0,0,0,0.14);
	display: block;
}

/* Vendor info block below banner */
.bas-market-vendors__info {
	padding: 0 1.25rem 0.75rem;
	flex: 1;
	width: 100%;
	box-sizing: border-box;
}

.bas-market-vendors__name {
	font-family: "Playfair Display", serif;
	font-size: 1.1rem;
	font-weight: 700;
	color: #313131;
	display: block;
	margin-bottom: 0.35rem;
	line-height: 1.3;
}

.bas-market-vendors__desc {
	font-size: .875rem;
	color: #666;
	margin: 0;
}

/* Button wrapper — centered */
.bas-market-vendors__btn-wrap {
	padding: 0 1.25rem 1.25rem;
	width: 100%;
	box-sizing: border-box;
	display: flex;
	justify-content: center;
}

.bas-market-vendors__placeholder {
	padding: 1.25rem 1.5rem;
	border-radius: 4px;
}

/* ── Vendors toolbar (search / sort / load-more) ───────────────────────── */
.bas-market-vendors__toolbar {
	display: flex;
	gap: 0.625rem;
	align-items: center;
	flex-wrap: wrap;
	margin-bottom: 1.25rem;
}
.bas-mv-search {
	flex: 1 1 200px;
	min-width: 0;
	padding: 10px 14px;
	border: 1px solid #d0d0d0;
	border-radius: 100px;
	font-size: 14px;
	font-family: Lato, sans-serif;
	color: #313131;
	background: #fff;
	outline: none;
	transition: border-color 0.2s;
}
.bas-mv-search:focus { border-color: #70ac43; box-shadow: 0 0 0 2px rgba(112,172,67,0.18); }
.bas-mv-sort {
	flex: 0 1 180px;
	padding: 10px 14px;
	border: 1px solid #d0d0d0;
	border-radius: 100px;
	font-size: 14px;
	font-family: Lato, sans-serif;
	color: #313131;
	background: #fff;
	outline: none;
	cursor: pointer;
	transition: border-color 0.2s;
}
.bas-mv-sort:focus { border-color: #70ac43; }

/* Load More — vendors */
.bas-market-vendors__loadmore-wrap {
	display: flex;
	justify-content: center;
	margin-top: 1.5rem;
}
.bas-market-vendors__status {
	text-align: center;
	font-size: 13px;
	color: #888;
	margin-top: 0.75rem;
	min-height: 20px;
}

/* ── Market Products Module ────────────────────────────────────────────── */
.bas-market-products__grid {
	display: grid;
	gap: 1.5rem;
}
.bas-market-products__grid--cols-2 { grid-template-columns: repeat(2, 1fr); }
.bas-market-products__grid--cols-3 { grid-template-columns: repeat(3, 1fr); }

.bas-market-products__card {
	border: 1px solid #e8e8e8;
	border-radius: 10px;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	box-shadow: 0 2px 10px rgba(0,0,0,0.07);
	background-color: #ffffff;    /* white so card stands out from #fffbef page bg */
}

.bas-market-products__image-link { display: block; }
.bas-market-products__image {
	width: 100%;
	height: 180px;
	object-fit: cover;
	display: block;
}

.bas-market-products__body {
	padding: 1rem;
	display: flex;
	flex-direction: column;
	gap: .5rem;
	flex: 1;
	align-items: center;         /* center all children horizontally */
	text-align: center;
}

.bas-market-products__name {
	font-family: "Playfair Display", serif;
	font-size: 1rem;
	font-weight: 700;
	text-decoration: none;
	color: #313131 !important;
	line-height: 1.3;
}
.bas-market-products__name:hover { color: #70ac43 !important; }

.bas-market-products__vendor {
	font-size: .8125rem;
	color: #888;
}

.bas-market-products__price {
	font-weight: 700;
	color: #313131;               /* site charcoal, not accent */
}

/* Button — matches site-wide pill gradient standard */
.bas-market-products__btn {
	margin-top: auto;
	align-self: center;           /* centered under product info */
}

.bas-market-products__placeholder {
	padding: 1.25rem 1.5rem;
	border-radius: 4px;
}

/* ── Products toolbar (search / filter / sort / load-more) ────────────── */
.bas-market-products__toolbar {
	display: flex;
	gap: 0.625rem;
	align-items: center;
	flex-wrap: wrap;
	margin-bottom: 1.25rem;
}
.bas-mp-search {
	flex: 1 1 200px;
	min-width: 0;
	padding: 10px 14px;
	border: 1px solid #d0d0d0;
	border-radius: 100px;
	font-size: 14px;
	font-family: Lato, sans-serif;
	color: #313131;
	background: #fff;
	outline: none;
	transition: border-color 0.2s;
}
.bas-mp-search:focus { border-color: #70ac43; box-shadow: 0 0 0 2px rgba(112,172,67,0.18); }
.bas-mp-filter,
.bas-mp-sort {
	flex: 0 1 180px;
	padding: 10px 14px;
	border: 1px solid #d0d0d0;
	border-radius: 100px;
	font-size: 14px;
	font-family: Lato, sans-serif;
	color: #313131;
	background: #fff;
	outline: none;
	cursor: pointer;
	transition: border-color 0.2s;
}
.bas-mp-filter:focus,
.bas-mp-sort:focus { border-color: #70ac43; }

/* Load More — products */
.bas-market-products__loadmore-wrap {
	display: flex;
	justify-content: center;
	margin-top: 1.5rem;
}
.bas-market-products__status {
	text-align: center;
	font-size: 13px;
	color: #888;
	margin-top: 0.75rem;
	min-height: 20px;
}

/* ── Market Map Module ─────────────────────────────────────────────────── */
.bas-market-map__wrap { position: relative; }

/* ── Cluster circle icons (replaces default MarkerCluster squares) ──────── */
/*
 * These are rendered by the custom iconCreateFunction in the map JS.
 * Size and background-color are set inline (scaled by count); these rules
 * handle the shared visual treatment: circle shape, white border, shadow.
 */
.bas-fm-cluster {
	border-radius: 50%;
	color: #fff;
	font-weight: 700;
	font-family: Lato, sans-serif;
	text-align: center;
	line-height: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 2.5px solid rgba(255,255,255,0.88);
	box-shadow: 0 2px 8px rgba(0,0,0,0.22);
}

/* ── Market Cards section (below the map canvas) ────────────────────────── */
.bas-fm-map-cards-section {
	margin-top: 2rem;
}

.bas-fm-markets__title {
	font-family: "Playfair Display", serif;
	font-size: 1.35rem;
	font-weight: 700;
	color: #313131;
	margin: 0 0 1.1rem;
}

.bas-fm-markets-grid {
	display: grid;
	gap: 1.5rem;
	grid-template-columns: repeat(3, 1fr);
}

/* ── Individual market card ─────────────────────────────────────────────── */
.bas-fm-market-card {
	background: #fff;
	border: 1px solid #e8e8e8;
	border-radius: 12px;
	overflow: hidden;
	box-shadow: 0 2px 10px rgba(0,0,0,0.07);
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	transition: box-shadow 0.2s, transform 0.15s;
}
.bas-fm-market-card:hover {
	box-shadow: 0 4px 18px rgba(0,0,0,0.12);
	transform: translateY(-2px);
}

/* Header strip — gradient background with market icon */
.bas-fm-market-card__header {
	width: 100%;
	height: 90px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.bas-fm-market-card__icon {
	width: 42px;
	height: 42px;
	color: rgba(255,255,255,0.92);
	flex-shrink: 0;
}

/* Card body */
.bas-fm-market-card__body {
	padding: 0.9rem 1.25rem 0.6rem;
	flex: 1;
	width: 100%;
	box-sizing: border-box;
}

.bas-fm-market-card__name {
	font-family: "Playfair Display", serif;
	font-size: 1rem;
	font-weight: 700;
	color: #313131;
	margin: 0 0 0.3rem;
	line-height: 1.3;
	display: block;
}

.bas-fm-market-card__location {
	font-size: 0.8125rem;
	color: #666;
	margin: 0 0 0.3rem;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 4px;
}

.bas-fm-market-card__meta {
	font-size: 0.75rem;
	color: #888;
	margin: 0;
	line-height: 1.4;
}

/* CTA button row */
.bas-fm-market-card__footer {
	padding: 0 1.25rem 1.25rem;
	width: 100%;
	box-sizing: border-box;
	display: flex;
	justify-content: center;
}

/* ── Market cards toolbar ───────────────────────────────────────────────── */
.bas-fm-markets__toolbar {
	display: flex;
	gap: 0.625rem;
	align-items: center;
	flex-wrap: wrap;
	margin-bottom: 1.25rem;
}

.bas-fm-markets__count {
	font-size: 13px;
	color: #888;
	margin-left: auto;
	white-space: nowrap;
}

/* ── Load More / status — markets ───────────────────────────────────────── */
.bas-fm-markets__loadmore-wrap {
	display: flex;
	justify-content: center;
	margin-top: 1.5rem;
}

.bas-fm-markets__status {
	text-align: center;
	font-size: 13px;
	color: #888;
	margin-top: 0.75rem;
	min-height: 20px;
}

/* Empty state */
.bas-fm-markets__empty {
	grid-column: 1 / -1;
	text-align: center;
	padding: 2rem 1rem;
	color: #888;
	font-size: 0.9375rem;
}

.bas-market-map__search {
	display: flex;
	gap: .5rem;
	margin-bottom: .75rem;
	flex-wrap: wrap;
}

.bas-market-map__search-input,
.bas-market-map__radius-select {
	padding: .5rem .75rem;
	border: 1px solid #ccc;
	border-radius: 4px;
	font-size: .9375rem;
}

.bas-market-map__search-input { flex: 1 1 200px; }

.bas-market-map__search-btn {
	padding: .5rem 1.25rem;
	border: none;
	border-radius: 4px;
	cursor: pointer;
	font-size: .9375rem;
	color: #fff;
}

.bas-market-map__canvas {
	width: 100%;
	border-radius: 6px;
}

.bas-market-map__placeholder {
	padding: 1.25rem 1.5rem;
	border-radius: 4px;
}

/* ── Market Submission Form ────────────────────────────────────────────── */
.bas-fm-submit-form {
	max-width: 640px;
}

.bas-fm-submit-form .bas-fm-field {
	margin-bottom: 1.25rem;
}

.bas-fm-submit-form label {
	display: block;
	font-weight: 600;
	margin-bottom: .3rem;
}

.bas-fm-submit-form input[type="text"],
.bas-fm-submit-form input[type="email"],
.bas-fm-submit-form input[type="url"],
.bas-fm-submit-form textarea {
	width: 100%;
	padding: .5rem .75rem;
	border: 1px solid #ccc;
	border-radius: 4px;
	font-size: .9375rem;
	box-sizing: border-box;
}

.bas-fm-submit-form .bas-fm-submit-btn {
	padding: .65rem 2rem;
	border: none;
	border-radius: 4px;
	font-size: 1rem;
	cursor: pointer;
	color: #fff;
}

.bas-fm-notice {
	padding: .875rem 1.125rem;
	border-radius: 4px;
	margin-bottom: 1.25rem;
}

.bas-fm-notice--success { background: #eaf6e1; border-left: 4px solid #70ac43; }
.bas-fm-notice--error   { background: #fdecea; border-left: 4px solid #d32f2f; }

/* ── Claim Market Form & Submit Market Form Modules ────────────────────── */
/*
 * Shared CSS for bas/claim-market-form and bas/submit-market-form.
 * Designed for sections with a dark (#313131) background.
 * Accent color is controlled via the CSS custom property --bas-fm-accent,
 * which the PHP render callback sets as an inline style on the wrapper div.
 *
 * INPUT STYLE: Matches the site newsletter opt-in form —
 * near-white background with dark text, tall padding, subtle 4px rounding.
 * This ensures inputs are clearly visible on dark section backgrounds.
 */

.bas-fm-claim-form,
.bas-fm-submit-form-module {
	color: #f0f0f0;
	font-family: Lato, sans-serif;
	line-height: 1.5;
}

/* Intro blurb on submit form */
.bas-fm-submit-intro {
	font-size: 14px;
	color: rgba(255,255,255,0.65);
	margin: 0 0 22px;
	line-height: 1.6;
}

/* Field note (below email input on submit form) */
.bas-fm-form__field-note {
	display: block;
	font-size: 12px;
	color: rgba(255,255,255,0.4);
	margin-top: 5px;
	font-style: italic;
}

/* Market name badge on claim form */
.bas-fm-form__market-name {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 22px;
	padding: 10px 14px;
	background: rgba(255,255,255,0.06);
	border-radius: 6px;
	font-size: 14px;
	color: #f0f0f0;
}
.bas-fm-form__market-label {
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	opacity: 0.55;
	flex-shrink: 0;
}

/* Step indicator */
.bas-fm-form__steps {
	display: flex;
	align-items: flex-start;
	margin-bottom: 10px;
}
.bas-fm-form__step {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 5px;
	flex: 0 0 auto;
}
.bas-fm-form__step-line {
	flex: 1;
	height: 1px;
	background: rgba(255,255,255,0.12);
	margin: 14px 4px 0;
	align-self: flex-start;
}
.bas-fm-form__step-dot {
	width: 30px;
	height: 30px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 12px;
	font-weight: 700;
	background: rgba(255,255,255,0.08);
	color: rgba(255,255,255,0.35);
	border: 1.5px solid rgba(255,255,255,0.12);
	transition: background 0.25s, color 0.25s, border-color 0.25s;
	flex-shrink: 0;
}
.bas-fm-form__step-label {
	font-size: 10px;
	color: rgba(255,255,255,0.4);
	letter-spacing: 0.02em;
	transition: color 0.25s;
	white-space: nowrap;
}
.bas-fm-form__step--active .bas-fm-form__step-dot {
	background: var(--bas-fm-accent, #70ac43);
	color: #fff;
	border-color: var(--bas-fm-accent, #70ac43);
	box-shadow: 0 0 0 3px rgba(112,172,67,0.22);
}
.bas-fm-form__step--active .bas-fm-form__step-label { color: #f0f0f0; }
.bas-fm-form__step--completed .bas-fm-form__step-dot {
	background: #1d741b;
	color: #fff;
	border-color: #1d741b;
	font-size: 0;
}
.bas-fm-form__step--completed .bas-fm-form__step-dot::before {
	content: "✓";
	font-size: 13px;
}
.bas-fm-form__step--completed .bas-fm-form__step-label { color: rgba(255,255,255,0.55); }

/* Progress bar */
.bas-fm-form__progress {
	height: 3px;
	background: rgba(255,255,255,0.08);
	border-radius: 2px;
	margin-bottom: 26px;
	overflow: hidden;
}
.bas-fm-form__progress-bar {
	height: 100%;
	background: linear-gradient(90deg, #c2e86b 0%, var(--bas-fm-accent, #70ac43) 100%);
	border-radius: 2px;
	transition: width 0.35s cubic-bezier(.4,0,.2,1);
}

/* Fields */
.bas-fm-form__field { margin-bottom: 18px; }
.bas-fm-form__label {
	display: block;
	font-size: 12px;
	font-weight: 700;
	color: #d8d8d8;
	margin-bottom: 7px;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}
.bas-fm-form__required { color: #ff7660; margin-left: 3px; }

/*
 * Input fields — white/near-white background with dark text.
 * Taller than before (14px/16px padding vs 11px/14px), subtle 4px rounding.
 * Matches the newsletter opt-in form aesthetic.
 */
.bas-fm-form__input {
	width: 100%;
	background: rgba(255,255,255,0.94);
	border: 1px solid rgba(255,255,255,0.35);
	border-radius: 4px;
	padding: 14px 16px;
	font-size: 15px;
	color: #313131;
	font-family: Lato, sans-serif;
	transition: border-color 0.2s, background 0.2s, box-shadow 0.2s;
	box-sizing: border-box;
	-webkit-appearance: none;
}
.bas-fm-form__input::placeholder { color: rgba(49,49,49,0.45); }
.bas-fm-form__input:focus {
	outline: none;
	border-color: var(--bas-fm-accent, #70ac43);
	background: #ffffff;
	box-shadow: 0 0 0 3px rgba(112,172,67,0.2);
}
.bas-fm-form__textarea { resize: vertical; min-height: 110px; line-height: 1.55; }
.bas-fm-form__input--state { max-width: 90px; text-transform: uppercase; }
.bas-fm-form__field-row { display: flex; gap: 12px; align-items: flex-start; }
.bas-fm-form__field-row .bas-fm-form__field { flex: 1; margin-bottom: 0; }
.bas-fm-form__field-row .bas-fm-form__field--narrow { flex: 0 0 90px; }
.bas-fm-form__hint {
	font-size: 12px;
	color: rgba(255,255,255,0.42);
	line-height: 1.55;
	margin: -6px 0 18px;
	font-style: italic;
}

/* Errors */
.bas-fm-form__error {
	display: block;
	font-size: 12px;
	color: #ff7660;
	margin-top: 5px;
	min-height: 15px;
}
.bas-fm-form__error-global {
	padding: 11px 14px;
	background: rgba(255,76,37,0.12);
	border: 1px solid rgba(255,76,37,0.28);
	border-radius: 4px;
	color: #ff7660;
	font-size: 13px;
	margin-bottom: 14px;
	line-height: 1.4;
}

/* Buttons */
.bas-fm-form__actions { margin-top: 22px; }
.bas-fm-form__actions--split {
	display: flex;
	gap: 10px;
	justify-content: space-between;
	align-items: center;
}
.bas-fm-form__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 11px 26px;
	border-radius: 100px;
	font-size: 14px;
	font-weight: 700;
	font-family: Lato, sans-serif;
	cursor: pointer;
	border: none;
	transition: opacity 0.2s, transform 0.15s;
	text-decoration: none;
	white-space: nowrap;
	line-height: 1;
}
.bas-fm-form__btn:hover  { opacity: 0.88; transform: translateY(-1px); }
.bas-fm-form__btn:active { transform: translateY(0); }
.bas-fm-form__btn:disabled {
	opacity: 0.45;
	cursor: not-allowed;
	transform: none !important;
}
.bas-fm-form__btn--primary {
	background: linear-gradient(180deg, #c2e86b 0%, var(--bas-fm-accent, #70ac43) 100%);
	color: #fff;
	border: 1px solid var(--bas-fm-accent, #70ac43);
}
.bas-fm-form__btn--outline {
	background: transparent;
	color: rgba(255,255,255,0.65);
	border: 1px solid rgba(255,255,255,0.22);
}
.bas-fm-form__btn--outline:hover {
	border-color: rgba(255,255,255,0.45);
	color: #f0f0f0;
}

/* Review card */
.bas-fm-form__review-heading {
	font-size: 13px;
	color: rgba(255,255,255,0.55);
	margin: 0 0 12px;
}
.bas-fm-form__review-card {
	background: rgba(255,255,255,0.05);
	border: 1px solid rgba(255,255,255,0.09);
	border-radius: 6px;
	overflow: hidden;
	margin-bottom: 18px;
}
.bas-fm-form__review-row {
	display: flex;
	gap: 12px;
	padding: 10px 14px;
	font-size: 13px;
	border-bottom: 1px solid rgba(255,255,255,0.06);
}
.bas-fm-form__review-row:last-child { border-bottom: none; }
.bas-fm-form__review-row--message  { flex-direction: column; gap: 4px; }
.bas-fm-form__review-key {
	flex: 0 0 70px;
	font-size: 10px;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	color: rgba(255,255,255,0.4);
	padding-top: 2px;
}
.bas-fm-form__review-val {
	color: #e8e8e8;
	word-break: break-word;
	line-height: 1.4;
}

/* Success state */
.bas-fm-form__success {
	text-align: center;
	padding: 32px 24px 24px;
}
.bas-fm-form__success-icon {
	width: 54px;
	height: 54px;
	border-radius: 50%;
	background: linear-gradient(135deg, #c2e86b 0%, var(--bas-fm-accent, #70ac43) 100%);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 24px;
	color: #fff;
	margin: 0 auto 18px;
}
.bas-fm-form__success-title {
	font-size: 22px;
	font-weight: 700;
	color: #f0f0f0;
	margin: 0 0 10px;
	font-family: "Playfair Display", serif;
}
.bas-fm-form__success-msg {
	font-size: 14px;
	color: rgba(255,255,255,0.6);
	line-height: 1.6;
	margin: 0;
}

/* Status notice (claimed / pending) */
.bas-fm-form-notice {
	padding: 14px 18px;
	background: rgba(255,255,255,0.06);
	border-left: 4px solid var(--bas-fm-accent, #70ac43);
	border-radius: 4px;
	color: #f0f0f0;
	font-size: 14px;
	font-family: Lato, sans-serif;
	line-height: 1.5;
}

/* ── Responsive ────────────────────────────────────────────────────────── */
@media (max-width: 767px) {
	.bas-market-vendors__grid--cols-2,
	.bas-market-vendors__grid--cols-3,
	.bas-market-products__grid--cols-2,
	.bas-market-products__grid--cols-3,
	.bas-fm-markets-grid {
		grid-template-columns: 1fr;
	}
	.bas-market-vendors__toolbar,
	.bas-market-products__toolbar,
	.bas-fm-markets__toolbar {
		flex-direction: column;
		align-items: stretch;
	}
	.bas-mv-sort,
	.bas-mp-filter,
	.bas-mp-sort { flex-basis: auto; width: 100%; }
	.bas-fm-markets__count { margin-left: 0; }
}

@media (min-width: 480px) and (max-width: 767px) {
	.bas-fm-markets-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 520px) {
	.bas-fm-form__field-row                      { flex-direction: column; }
	.bas-fm-form__field-row .bas-fm-form__field--narrow { flex: 1; }
	.bas-fm-form__step-label                     { display: none; }
	.bas-fm-form__actions--split                 { flex-direction: column-reverse; }
	.bas-fm-form__actions--split .bas-fm-form__btn { width: 100%; }
}