@import url('/homepage/homepage-card-controls.css?v=homepage-card-controls-20260511a');

[hidden] { display: none !important; }

.cards-grid:not([data-grid-hydrated]) > .card:nth-of-type(n + 13) {
	display: none !important;
}

.sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	white-space: nowrap;
}

.hero-map__frame {
	display: block;
	min-height: 62vh;
}

.hero-map__canvas-wrap {
	min-height: 62vh;
}

.rnrn-strip {
	display: none !important;
}

.rnrn-strip__copy {
	display: block;
	width: 100%;
}

.rnrn-heading-row {
	display: flex;
	align-items: center;
	gap: 12px;
	min-width: 0;
}

.rnrn-strip__copy h2,
.rnrn-strip__copy h1 {
	margin: 0;
	font-family: var(--font-display);
	font-size: clamp(1.55rem, 2.1vw, 2.2rem);
	line-height: 1.02;
	letter-spacing: -0.02em;
}

.rnrn-thesis,
.cards-summary {
	display: none !important;
}


.map-status {
	display: none !important;
}

.locate-button {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 1px solid rgba(212, 181, 122, 0.28);
	border-radius: 999px;
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.02)), rgba(8, 8, 9, 0.78);
	color: var(--ink);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04), 0 12px 28px rgba(0, 0, 0, 0.28);
	cursor: pointer;
	backdrop-filter: blur(14px);
}

.locate-button .locate-button__icon {
	display: none;
}

.locate-button::before,
.card-actions .button.ghost[data-focus-profile]::after {
	content: "";
	display: inline-block;
	flex: 0 0 auto;
	width: 24px;
	height: 24px;
	border-radius: 999px;
	background-color: rgba(212, 181, 122, 0.14);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e6c98f' stroke-width='2.15' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='6.2'/%3E%3Cpath d='M12 2.8v3.1M12 18.1v3.1M2.8 12h3.1M18.1 12h3.1M12 9.3v5.4M9.3 12h5.4'/%3E%3C/svg%3E");
	background-position: center;
	background-repeat: no-repeat;
	background-size: 18px 18px;
	box-shadow: inset 0 0 0 1px rgba(212, 181, 122, 0.22), 0 0 16px rgba(212, 181, 122, 0.08);
}

.locate-button:hover {
	background: linear-gradient(180deg, rgba(212, 181, 122, 0.12), rgba(255, 255, 255, 0.035)), rgba(8, 8, 9, 0.86);
	border-color: rgba(212, 181, 122, 0.42);
}

.locate-button:disabled {
	opacity: 0.58;
	cursor: not-allowed;
}

.cards-header,
.cards-footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
}

.cards-header {
	margin-bottom: 16px;
}

.cards-footer {
	justify-content: center;
	margin-top: 18px;
}

.card {
	display: grid;
	grid-template-rows: auto auto auto auto auto auto;
	row-gap: 8px;
	align-content: start;
}

.card h3 {
	margin: 10px 0 0;
	font-family: var(--font-display);
	font-size: 1.25rem;
	line-height: 1.2;
	font-weight: 700;
}

.card h3 a {
	color: var(--ink);
	text-decoration: none;
}

.card h3 a:hover {
	color: var(--accent);
}

.card-lead {
	margin: 0;
	color: var(--muted);
}

.card-products {
	display: grid;
	gap: 8px;
	margin-top: 10px;
}

.card-product-row {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 12px;
	padding: 6px 0;
	border-top: 1px solid rgba(244, 239, 228, 0.09);
}

.card-product-row:first-child {
	border-top: 0;
	padding-top: 0;
}

.card-product-name {
	color: var(--accent);
	font-family: var(--font-display);
	font-weight: 600;
}

.card-product-availability {
	color: var(--muted);
	font-size: 0.92rem;
	white-space: nowrap;
}

.card-place-row {
	display: flex;
	align-items: baseline;
	flex-wrap: wrap;
	gap: 4px;
	margin-top: 8px;
	padding-top: 10px;
	border-top: 1px solid rgba(244, 239, 228, 0.09);
	color: var(--muted);
}

.card-place,
.card-place-separator,
.card-distance {
	color: var(--muted);
	font-weight: 400;
}

.card-distance {
	white-space: nowrap;
}

.card-actions {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	justify-self: start;
	width: 100%;
	gap: 10px;
	flex-wrap: nowrap;
	margin-top: 6px;
}

.card-actions .button {
	min-height: 42px;
	white-space: nowrap;
}

.card-actions .button.ghost {
	flex: 0 0 auto;
	min-width: 86px;
}

.card-actions .button.ghost[data-focus-profile] {
	gap: 6px;
	padding-inline: 8px;
}

.card-actions .button.primary {
	flex: 0 1 auto;
	max-width: 260px;
	padding-inline: 20px;
}

.card-top .pill {
	border-color: rgba(212, 181, 122, 0.62);
	background: rgba(212, 181, 122, 0.06);
	color: rgba(244, 239, 228, 0.96);
}

.selected-source-slot:not(:empty) {
	margin-bottom: 16px;
}

.selected-source-card {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 18px;
	border: 1px solid rgba(212, 181, 122, 0.3);
	border-radius: 22px;
	background: linear-gradient(180deg, rgba(212, 181, 122, 0.1), rgba(255,255,255,0.03)), rgba(255,255,255,0.02);
}

.selected-source-card h3 {
	margin: 4px 0 0;
	font-family: var(--font-display);
	font-size: 1.12rem;
}

.selected-source-card p {
	margin: 8px 0 0;
	color: var(--muted);
	line-height: 1.45;
}

.selected-source-card__distance {
	color: var(--ink) !important;
}

.locate-button:focus-visible {
	outline: 2px solid var(--focus);
	outline-offset: 3px;
	box-shadow: 0 0 0 3px rgba(11, 11, 12, 0.75);
}

@media (max-width: 1120px) {
	.hero-map__frame,
	.hero-map__canvas-wrap {
		min-height: 56vh;
	}
}

@media (max-width: 760px) {
	.hero-map__frame,
	.hero-map__canvas-wrap {
		min-height: 52vh;
	}

	.rnrn-heading-row {
		gap: 10px;
	}

	.locate-button {
		width: 42px;
		height: 42px;
	}

	.selected-source-card {
		display: grid;
	}

	.card {
		grid-template-rows: auto auto auto auto auto auto;
		row-gap: 8px;
	}

	.card-lead {
		min-height: 0;
	}

	.card-product-row {
		align-items: flex-start;
		flex-direction: column;
		gap: 4px;
	}

	.card-product-availability,
	.card-distance {
		white-space: normal;
	}

	.card-actions {
		flex-wrap: wrap;
	}
}