/*
 * VojvodinaMeteo location hubs + scoped trend SSR additions.
 * Kept outside vm-styles.css so UCSS can generate small hub profiles.
 */

.vm-hub-shell {
	--vm-hub-ink: #10233f;
	--vm-hub-muted: #53657d;
	--vm-hub-line: rgba(24, 72, 121, .14);
	--vm-hub-surface: rgba(255, 255, 255, .86);
	--vm-hub-soft: #eef7ff;
	--vm-hub-accent: #1479d1;
	--vm-hub-accent-2: #14b8d4;
	box-sizing: border-box;
	width: min(100%, 1240px);
	padding-block: clamp(18px, 3vw, 44px) clamp(56px, 8vw, 100px);
	color: var(--vm-hub-ink);
}

.vm-hub-shell *,
.vm-hub-shell *::before,
.vm-hub-shell *::after { box-sizing: border-box; }

.vm-hub,
.vm-region-hub { min-width: 0; }

.vm-hub a,
.vm-region-hub a,
.vm-trend-extended a { text-decoration: none; }

.vm-hub-hero,
.vm-region-hub__hero {
	position: relative;
	isolation: isolate;
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: clamp(24px, 5vw, 64px);
	align-items: end;
	overflow: hidden;
	padding: clamp(28px, 5vw, 64px);
	border: 1px solid rgba(93, 194, 238, .34);
	border-radius: clamp(24px, 3vw, 40px);
	background:
		radial-gradient(circle at 88% 18%, rgba(255, 255, 255, .8) 0 2%, transparent 2.3%),
		radial-gradient(circle at 76% 30%, rgba(255, 255, 255, .38) 0 9%, transparent 9.4%),
		linear-gradient(135deg, #e7f7ff 0%, #f7fbff 48%, #e8fff9 100%);
	box-shadow: 0 28px 70px rgba(32, 91, 145, .13);
}

.vm-hub--trend .vm-hub-hero {
	--vm-hub-accent: #5657dc;
	--vm-hub-accent-2: #9b67e8;
	background:
		radial-gradient(circle at 86% 15%, rgba(255, 255, 255, .68) 0 8%, transparent 8.5%),
		linear-gradient(135deg, #eef1ff 0%, #fbf9ff 50%, #f2eaff 100%);
}

.vm-hub-hero::after,
.vm-region-hub__hero::after {
	content: "";
	position: absolute;
	z-index: -1;
	right: -60px;
	bottom: -100px;
	width: 330px;
	aspect-ratio: 1;
	border: 44px solid color-mix(in srgb, var(--vm-hub-accent) 12%, transparent);
	border-radius: 50%;
}

.vm-hub-eyebrow {
	display: inline-block;
	margin-bottom: 10px;
	color: var(--vm-hub-accent);
	font-size: .75rem;
	font-weight: 800;
	letter-spacing: .13em;
	text-transform: uppercase;
}

.vm-hub-hero h1,
.vm-region-hub__hero h1 {
	max-width: 850px;
	margin: 0;
	color: var(--vm-hub-ink);
	font-size: clamp(2.05rem, 5vw, 4.45rem);
	font-weight: 850;
	letter-spacing: -.055em;
	line-height: .98;
	text-wrap: balance;
}

.vm-hub-hero p,
.vm-region-hub__hero p {
	max-width: 770px;
	margin: 22px 0 0;
	color: var(--vm-hub-muted);
	font-size: clamp(1rem, 1.5vw, 1.18rem);
	line-height: 1.7;
}

.vm-hub-hero__stat {
	display: grid;
	place-items: center;
	min-width: 170px;
	padding: 24px;
	border: 1px solid rgba(255, 255, 255, .8);
	border-radius: 26px;
	background: rgba(255, 255, 255, .56);
	box-shadow: inset 0 1px 0 #fff, 0 16px 30px rgba(39, 95, 140, .09);
	backdrop-filter: blur(14px);
}

.vm-hub-hero__stat strong {
	color: var(--vm-hub-accent);
	font-size: clamp(2.4rem, 5vw, 4rem);
	line-height: 1;
}

.vm-hub-hero__stat span { margin-top: 7px; color: var(--vm-hub-muted); font-size: .83rem; font-weight: 700; }

.vm-hub-switch {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	max-width: 720px;
	margin: clamp(22px, 4vw, 38px) auto 18px;
	padding: 5px;
	border: 1px solid var(--vm-hub-line);
	border-radius: 18px;
	background: var(--vm-hub-surface);
	box-shadow: 0 10px 34px rgba(27, 77, 123, .08);
}

.vm-hub-switch__item {
	display: grid;
	min-height: 48px;
	place-items: center;
	padding: 10px 16px;
	border-radius: 13px;
	color: var(--vm-hub-muted);
	font-size: .94rem;
	font-weight: 800;
	text-align: center;
	transition: transform .18s ease, background-color .18s ease, color .18s ease;
}

.vm-hub-switch__item.is-active {
	background: linear-gradient(135deg, var(--vm-hub-accent), var(--vm-hub-accent-2));
	color: #fff;
	box-shadow: 0 8px 20px color-mix(in srgb, var(--vm-hub-accent) 28%, transparent);
}

.vm-hub .vm-location-search,
.vm-region-hub .vm-location-search {
	max-width: 780px !important;
	margin: 18px auto 14px !important;
}

.vm-hub .vm-location-search--integrated .vm-location-search__shell,
.vm-region-hub .vm-location-search--integrated .vm-location-search__shell {
	padding: 0;
	border-radius: 21px;
	background: transparent;
	box-shadow: none;
}

.vm-hub .vm-location-search--integrated .vm-location-search__field,
.vm-region-hub .vm-location-search--integrated .vm-location-search__field {
	box-sizing: border-box;
	min-height: 64px;
	height: auto;
	gap: 12px;
	padding: 0 9px 0 11px;
	border: 1px solid var(--vm-hub-line);
	border-radius: 20px;
	background: var(--vm-hub-surface);
	box-shadow: 0 14px 36px rgba(24, 72, 121, .1);
	transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.vm-hub .vm-location-search--integrated .vm-location-search__field:focus-within,
.vm-region-hub .vm-location-search--integrated .vm-location-search__field:focus-within {
	border-color: color-mix(in srgb, var(--vm-hub-accent) 55%, var(--vm-hub-line));
	box-shadow: 0 0 0 4px color-mix(in srgb, var(--vm-hub-accent) 13%, transparent), 0 18px 42px rgba(24, 72, 121, .13);
	transform: translateY(-1px);
}

.vm-hub .vm-location-search--integrated .vm-location-search__icon,
.vm-region-hub .vm-location-search--integrated .vm-location-search__icon {
	box-sizing: border-box;
	width: 40px;
	height: 40px;
	flex: 0 0 40px;
	padding: 9px;
	border-radius: 13px;
	background: var(--vm-hub-soft);
	color: var(--vm-hub-accent);
}

.vm-hub .vm-location-search--integrated .vm-location-search__input,
.vm-region-hub .vm-location-search--integrated .vm-location-search__input {
	min-height: 62px;
	font-size: 1.02rem;
	font-weight: 620;
	letter-spacing: -.01em;
}

.vm-hub .vm-location-search--integrated .vm-location-search__input:focus-visible,
.vm-region-hub .vm-location-search--integrated .vm-location-search__input:focus-visible { outline: 0; }

.vm-hub .vm-location-search--integrated .vm-location-search__input::placeholder,
.vm-region-hub .vm-location-search--integrated .vm-location-search__input::placeholder {
	color: var(--vm-hub-muted);
	font-weight: 520;
	opacity: .86;
}

.vm-location-search--integrated .vm-location-search__count {
	display: inline-flex;
	min-height: 40px;
	flex: 0 0 auto;
	align-items: center;
	justify-content: center;
	gap: 5px;
	padding: 6px 11px;
	border: 1px solid color-mix(in srgb, var(--vm-hub-accent) 16%, var(--vm-hub-line));
	border-radius: 13px;
	background: var(--vm-hub-soft);
	color: var(--vm-hub-muted);
	font-size: .75rem;
	font-weight: 750;
	line-height: 1;
	white-space: nowrap;
	transition: border-color .18s ease, background-color .18s ease, color .18s ease;
}

.vm-location-search--integrated .vm-location-search__count strong {
	color: var(--vm-hub-accent);
	font-size: .92rem;
	font-weight: 850;
}

.vm-location-search--integrated.vm-location-search--has-query .vm-location-search__count {
	border-color: color-mix(in srgb, var(--vm-hub-accent) 30%, var(--vm-hub-line));
	background: color-mix(in srgb, var(--vm-hub-accent) 10%, var(--vm-hub-surface));
}

.vm-location-search--integrated.vm-location-search--empty .vm-location-search__count {
	border-color: color-mix(in srgb, #d97706 42%, var(--vm-hub-line));
	background: color-mix(in srgb, #f59e0b 13%, var(--vm-hub-surface));
	color: #8a5a08;
}

.vm-location-search--integrated.vm-location-search--empty .vm-location-search__count strong { color: #b45309; }

.vm-hub .vm-location-search__clear,
.vm-region-hub .vm-location-search__clear {
	flex-basis: 44px;
	width: 44px;
	height: 44px;
	border-radius: 13px;
	background: var(--vm-hub-soft) !important;
}

.vm-hub-region-nav {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 8px;
	max-width: 980px;
	margin: 20px auto 0;
}

.vm-hub-region-nav a {
	display: inline-flex;
	min-height: 44px;
	align-items: center;
	gap: 8px;
	padding: 9px 14px;
	border: 1px solid var(--vm-hub-line);
	border-radius: 999px;
	background: var(--vm-hub-surface);
	color: var(--vm-hub-ink);
	font-size: .84rem;
	font-weight: 750;
}

.vm-hub-region-nav span {
	display: grid;
	min-width: 25px;
	height: 25px;
	place-items: center;
	border-radius: 999px;
	background: var(--vm-hub-soft);
	color: var(--vm-hub-accent);
	font-size: .72rem;
}

.vm-hub-no-results {
	max-width: 720px;
	margin: 18px auto;
	padding: 16px;
	border-radius: 14px;
	background: #fff3cd;
	color: #654d08;
	text-align: center;
}

.vm-hub-regions,
.vm-hub-featured,
.vm-hub-method,
.vm-hub-directory,
.vm-region-hub__featured,
.vm-region-hub__directory,
.vm-trend-extended { margin-top: clamp(42px, 7vw, 82px); }

.vm-hub-section-head { margin-bottom: 20px; }

.vm-hub-section-head h2,
.vm-hub-method h2,
.vm-trend-extended h2 {
	margin: 0;
	color: var(--vm-hub-ink);
	font-size: clamp(1.55rem, 3vw, 2.45rem);
	font-weight: 830;
	letter-spacing: -.035em;
	line-height: 1.1;
	text-wrap: balance;
}

.vm-hub-region-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }

.vm-hub-region-card {
	--vm-card-accent: #0a84d5;
	--vm-card-accent-2: #20c7e8;
	position: relative;
	display: flex;
	min-height: 245px;
	flex-direction: column;
	align-items: flex-start;
	overflow: hidden;
	padding: 25px;
	border: 1px solid color-mix(in srgb, var(--vm-card-accent) 22%, transparent);
	border-radius: 26px;
	background: linear-gradient(150deg, color-mix(in srgb, var(--vm-card-accent) 11%, #fff), #fff 65%);
	color: var(--vm-hub-ink);
	box-shadow: 0 16px 44px rgba(27, 77, 123, .08);
	transition: transform .2s ease, box-shadow .2s ease;
}

.vm-hub-region-card--banat { --vm-card-accent: #008e87; --vm-card-accent-2: #52d5c6; }
.vm-hub-region-card--srem { --vm-card-accent: #208a57; --vm-card-accent-2: #5f68dd; }

.vm-hub-region-card__icon {
	display: block;
	width: 54px;
	height: 54px;
	margin-bottom: 23px;
	border-radius: 18px;
	background:
		radial-gradient(circle at 67% 35%, #fff 0 15%, transparent 16%),
		linear-gradient(135deg, var(--vm-card-accent), var(--vm-card-accent-2));
	box-shadow: 0 10px 24px color-mix(in srgb, var(--vm-card-accent) 24%, transparent);
}

.vm-hub-region-card__name { font-size: 1.45rem; font-weight: 850; letter-spacing: -.03em; }
.vm-hub-region-card__desc { margin-top: 9px; color: var(--vm-hub-muted); font-size: .91rem; line-height: 1.55; }
.vm-hub-region-card__cta { margin-top: auto; padding-top: 20px; color: var(--vm-card-accent); font-weight: 800; }

.vm-hub-featured-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }

.vm-hub-featured-card {
	display: flex;
	min-height: 100px;
	flex-direction: column;
	justify-content: space-between;
	padding: 18px;
	border: 1px solid var(--vm-hub-line);
	border-radius: 19px;
	background: var(--vm-hub-surface);
	color: var(--vm-hub-ink);
	box-shadow: 0 10px 28px rgba(24, 72, 121, .06);
	transition: border-color .18s ease, transform .18s ease;
}

.vm-hub-featured-card span { font-size: 1.02rem; font-weight: 820; }
.vm-hub-featured-card small { color: var(--vm-hub-muted); font-size: .75rem; }

.vm-hub-method {
	position: relative;
	overflow: hidden;
	padding: clamp(24px, 4vw, 40px);
	border: 1px solid var(--vm-hub-line);
	border-radius: 26px;
	background: linear-gradient(135deg, var(--vm-hub-soft), rgba(255, 255, 255, .78));
}

.vm-hub-method p { max-width: 900px; margin: 14px 0 0; color: var(--vm-hub-muted); line-height: 1.75; }

.vm-hub-group {
	content-visibility: auto;
	contain-intrinsic-size: auto 460px;
	scroll-margin-top: 110px;
	margin-top: 24px;
	padding: clamp(18px, 3vw, 28px);
	border: 1px solid var(--vm-hub-line);
	border-radius: 24px;
	background: rgba(255, 255, 255, .64);
}

.vm-hub-group__head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 15px;
	margin-bottom: 15px;
}

.vm-hub-group__head h3 { margin: 0; color: var(--vm-hub-ink); font-size: 1.3rem; font-weight: 830; }
.vm-hub-group__head > span { color: var(--vm-hub-muted); font-size: .8rem; font-weight: 700; }
.vm-hub-location-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; }

.vm-hub-location {
	display: flex;
	min-width: 0;
	min-height: 68px;
	flex-direction: column;
	justify-content: center;
	padding: 11px 13px;
	border: 1px solid transparent;
	border-radius: 13px;
	background: var(--vm-hub-soft);
	color: var(--vm-hub-ink);
	transition: transform .16s ease, border-color .16s ease, background-color .16s ease;
}

.vm-hub-location span { overflow: hidden; font-size: .88rem; font-weight: 780; text-overflow: ellipsis; white-space: nowrap; }
.vm-hub-location small { margin-top: 3px; overflow: hidden; color: var(--vm-hub-muted); font-size: .65rem; text-overflow: ellipsis; white-space: nowrap; }

.vm-hub-breadcrumb,
.vm-trend-breadcrumb {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin-bottom: 18px;
	color: var(--vm-hub-muted, #64748b);
	font-size: .82rem;
}

.vm-hub-breadcrumb a,
.vm-trend-breadcrumb a { color: var(--vm-hub-accent, #1479d1); font-weight: 700; }

.vm-region-hub--backa { --vm-hub-accent: #087fcb; --vm-hub-accent-2: #25c9e7; }
.vm-region-hub--banat { --vm-hub-accent: #008e87; --vm-hub-accent-2: #52d5c6; }
.vm-region-hub--srem { --vm-hub-accent: #258b58; --vm-hub-accent-2: #6166dc; }

.vm-region-hub__hero {
	grid-template-columns: 1fr;
	align-items: start;
	background: linear-gradient(135deg, color-mix(in srgb, var(--vm-hub-accent) 13%, #fff), #fff 56%, color-mix(in srgb, var(--vm-hub-accent-2) 10%, #fff));
}

.vm-region-hub__hero h1 { font-size: clamp(2.15rem, 5vw, 4rem); }
.vm-region-hub__meta { margin-top: 22px; color: var(--vm-hub-muted); font-size: .86rem; }
.vm-region-hub__meta strong { margin-right: 5px; color: var(--vm-hub-accent); font-size: 1.35rem; }
.vm-region-hub__featured-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }

.vm-region-hub__featured-card {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto auto;
	align-items: center;
	gap: 8px;
	min-height: 70px;
	padding: 13px 15px;
	border: 1px solid var(--vm-hub-line);
	border-radius: 16px;
	background: var(--vm-hub-surface);
}

.vm-region-hub__featured-card strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vm-region-hub__featured-card a { display: grid; min-height: 44px; place-items: center; padding: 7px 11px; border-radius: 11px; background: var(--vm-hub-soft); color: var(--vm-hub-accent); font-size: .78rem; font-weight: 800; }

.vm-region-hub__location-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 10px;
	margin: 20px 0 0;
	padding: 0;
	list-style: none;
}

.vm-region-location {
	display: flex;
	min-width: 0;
	min-height: 128px;
	flex-direction: column;
	padding: 16px;
	border: 1px solid var(--vm-hub-line);
	border-radius: 17px;
	background: var(--vm-hub-surface);
	box-shadow: 0 8px 24px rgba(24, 72, 121, .05);
}

.vm-region-location > strong { color: var(--vm-hub-ink); font-size: .98rem; }
.vm-region-location > span { display: grid; gap: 5px; margin-top: auto; padding-top: 11px; }
.vm-region-location a { display: flex; min-height: 44px; align-items: center; color: var(--vm-hub-accent); font-size: .76rem; font-weight: 750; line-height: 1.3; }

.vm-trend-extended {
	--vm-hub-ink: #10233f;
	--vm-hub-muted: #53657d;
	--vm-hub-accent: #5657dc;
	padding: clamp(24px, 4vw, 40px);
	border: 1px solid rgba(86, 87, 220, .18);
	border-radius: 26px;
	background: linear-gradient(145deg, #f2f4ff, #fff 55%, #effcf8);
	box-shadow: 0 16px 44px rgba(57, 65, 135, .08);
}

.vm-trend-extended__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; }
.vm-trend-extended__eyebrow { display: block; margin-bottom: 8px; color: var(--vm-hub-accent); font-size: .72rem; font-weight: 850; letter-spacing: .12em; text-transform: uppercase; }
.vm-trend-extended__badge { flex: 0 0 auto; padding: 8px 11px; border-radius: 999px; background: rgba(86, 87, 220, .11); color: #4748ba; font-size: .7rem; font-weight: 800; }
.vm-trend-extended > p { max-width: 900px; margin: 15px 0 0; color: var(--vm-hub-muted); line-height: 1.7; }
.vm-trend-extended__weeks { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 22px 0 0; padding: 0; list-style: none; }

.vm-trend-extended__week {
	display: grid;
	gap: 12px;
	padding: 17px;
	border: 1px solid rgba(86, 87, 220, .13);
	border-radius: 17px;
	background: rgba(255, 255, 255, .78);
}

.vm-trend-extended__week time { color: var(--vm-hub-ink); font-size: .8rem; font-weight: 820; }
.vm-trend-extended__week span { display: grid; }
.vm-trend-extended__week strong { color: var(--vm-hub-ink); font-size: 1.05rem; }
.vm-trend-extended__week small { margin-top: 3px; color: var(--vm-hub-muted); font-size: .68rem; line-height: 1.4; }
.vm-trend-extended__method { margin-top: 18px; padding: 13px 15px; border: 1px solid rgba(86, 87, 220, .13); border-radius: 14px; background: rgba(255, 255, 255, .65); }
.vm-trend-extended__method summary { min-height: 44px; cursor: pointer; color: var(--vm-hub-ink); font-weight: 800; }
.vm-trend-extended__method p { color: var(--vm-hub-muted); line-height: 1.65; }
.vm-trend-extended__link { display: inline-flex; min-height: 44px; align-items: center; margin-top: 17px; color: var(--vm-hub-accent); font-weight: 800; }

.vm-trend-stale {
	margin: 18px 0;
	padding: 14px 16px;
	border: 1px solid #e2ac3e;
	border-radius: 13px;
	background: #fff8df;
	color: #6c4e08;
}

.vm-trend-day-card--ssr .vm-trend-day-card__conf { margin-top: 7px; }
.vm-trend-detail-table caption { padding: 10px; color: #526276; font-weight: 700; text-align: left; }

.vm-hub a:hover,
.vm-region-hub a:hover,
.vm-hub-region-card:hover,
.vm-hub-featured-card:hover { transform: translateY(-2px); }

.vm-hub a:focus-visible,
.vm-region-hub a:focus-visible,
.vm-hub button:focus-visible,
.vm-region-hub button:focus-visible,
.vm-hub input:focus-visible,
.vm-region-hub input:focus-visible,
.vm-trend-extended a:focus-visible,
.vm-trend-extended summary:focus-visible,
.vm-trend-breadcrumb a:focus-visible {
	outline: 3px solid color-mix(in srgb, var(--vm-hub-accent, #1479d1) 62%, #fff);
	outline-offset: 3px;
}

[data-theme="dark"] .vm-hub-shell,
[data-theme="dark"] .vm-trend-extended {
	--vm-hub-ink: #edf6ff;
	--vm-hub-muted: #a8bbcf;
	--vm-hub-line: rgba(145, 188, 225, .18);
	--vm-hub-surface: rgba(17, 33, 51, .88);
	--vm-hub-soft: #142b40;
}

[data-theme="dark"] .vm-hub-hero,
[data-theme="dark"] .vm-region-hub__hero {
	border-color: rgba(104, 190, 226, .17);
	background: linear-gradient(135deg, #102b43, #111d2e 52%, #10332f);
	box-shadow: 0 26px 70px rgba(0, 0, 0, .25);
}

[data-theme="dark"] .vm-hub--trend .vm-hub-hero { background: linear-gradient(135deg, #1c244f, #171d31 53%, #33214a); }
[data-theme="dark"] .vm-hub-hero__stat { border-color: rgba(255, 255, 255, .1); background: rgba(8, 20, 34, .5); box-shadow: none; }
[data-theme="dark"] .vm-hub-region-card { background: linear-gradient(150deg, color-mix(in srgb, var(--vm-card-accent) 18%, #122034), #111e2e 70%); }
[data-theme="dark"] .vm-hub-group,
[data-theme="dark"] .vm-hub-method { background: rgba(14, 29, 45, .72); }
[data-theme="dark"] .vm-trend-extended { background: linear-gradient(145deg, #1d2449, #121e2d 58%, #12342e); }
[data-theme="dark"] .vm-trend-extended__week,
[data-theme="dark"] .vm-trend-extended__method { background: rgba(11, 23, 37, .68); }
[data-theme="dark"] .vm-trend-extended__badge { color: #c5c4ff; }
[data-theme="dark"] .vm-trend-stale { border-color: #99762f; background: #352c16; color: #f7d98b; }
[data-theme="dark"] .vm-trend-detail-table caption { color: #b7c6d6; }
[data-theme="dark"] .vm-location-search--integrated.vm-location-search--empty .vm-location-search__count { color: #f7d98b; }
[data-theme="dark"] .vm-location-search--integrated.vm-location-search--empty .vm-location-search__count strong { color: #fbbf24; }

@media (max-width: 1024px) {
	.vm-hub-location-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.vm-hub-featured-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.vm-region-hub__location-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
	.vm-hub-shell { width: 100%; padding-inline: 14px; overflow-x: clip; }
	.vm-hub-hero { grid-template-columns: 1fr; align-items: start; padding: 28px 22px; border-radius: 25px; }
	.vm-hub-hero h1,
	.vm-region-hub__hero h1 { font-size: clamp(2rem, 11vw, 3rem); line-height: 1.02; }
	.vm-hub-hero__stat { grid-template-columns: auto 1fr; justify-self: stretch; min-width: 0; padding: 15px 18px; }
	.vm-hub-hero__stat strong { font-size: 2.2rem; }
	.vm-hub-switch { width: 100%; }
	.vm-hub-switch__item { font-size: .8rem; }
	.vm-hub .vm-location-search,
	.vm-region-hub .vm-location-search { margin-block: 14px 12px !important; }
	.vm-hub .vm-location-search--integrated .vm-location-search__field,
	.vm-region-hub .vm-location-search--integrated .vm-location-search__field { min-height: 60px; gap: 9px; padding-inline: 8px; }
	.vm-hub .vm-location-search--integrated .vm-location-search__icon,
	.vm-region-hub .vm-location-search--integrated .vm-location-search__icon { width: 38px; height: 38px; flex-basis: 38px; padding: 9px; }
	.vm-hub .vm-location-search--integrated .vm-location-search__input,
	.vm-region-hub .vm-location-search--integrated .vm-location-search__input { min-height: 58px; font-size: .96rem; }
	.vm-location-search--integrated .vm-location-search__count { min-width: 42px; min-height: 38px; padding-inline: 8px; }
	.vm-location-search--integrated .vm-location-search__count span { display: none; }
	.vm-hub-region-nav { justify-content: flex-start; overflow: visible; }
	.vm-hub-region-nav a { flex: 1 1 auto; justify-content: center; }
	.vm-hub-region-grid { grid-template-columns: 1fr; }
	.vm-hub-region-card { min-height: 200px; }
	.vm-hub-featured-grid,
	.vm-region-hub__featured-grid,
	.vm-region-hub__location-grid,
	.vm-trend-extended__weeks { grid-template-columns: 1fr; }
	.vm-hub-location-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.vm-hub-group { padding: 15px; border-radius: 18px; }
	.vm-hub-group__head { align-items: flex-start; flex-direction: column; gap: 3px; }
	.vm-hub-location { min-height: 62px; }
	.vm-hub-location small { display: none; }
	.vm-region-hub__hero { padding: 28px 22px; }
	.vm-region-hub__featured-card { grid-template-columns: minmax(0, 1fr) auto auto; }
	.vm-trend-extended { padding: 22px 17px; border-radius: 20px; }
	.vm-trend-extended__head { flex-direction: column; }
}

@media (max-width: 390px) {
	.vm-hub-shell { padding-inline: 10px; }
	.vm-hub-switch { grid-template-columns: 1fr; }
	.vm-hub-switch__item { min-height: 44px; }
	.vm-hub .vm-location-search--integrated .vm-location-search__field,
	.vm-region-hub .vm-location-search--integrated .vm-location-search__field { gap: 7px; padding-inline: 7px; }
	.vm-hub .vm-location-search--integrated .vm-location-search__icon,
	.vm-region-hub .vm-location-search--integrated .vm-location-search__icon { width: 36px; height: 36px; flex-basis: 36px; padding: 8px; }
	.vm-location-search--integrated .vm-location-search__count { min-width: 38px; padding-inline: 6px; }
	.vm-hub-location-grid { grid-template-columns: 1fr; }
	.vm-region-hub__featured-card { grid-template-columns: 1fr 1fr; }
	.vm-region-hub__featured-card strong { grid-column: 1 / -1; }
}

@media (prefers-reduced-motion: reduce) {
	.vm-hub *,
	.vm-region-hub *,
	.vm-trend-extended * {
		scroll-behavior: auto !important;
		transition-duration: .01ms !important;
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
	}
	.vm-hub a:hover,
	.vm-region-hub a:hover,
	.vm-hub-region-card:hover,
	.vm-hub-featured-card:hover { transform: none; }
}