/* ==========================================================================
   GardenStateGo Main Stylesheet — mobile-first
   ========================================================================== */

/* 1. Reset & Base
   ========================================================================== */

*, *::before, *::after {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}

html {
	font-size: 16px;
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
}

body {
	font-family: var(--gsg-font-body);
	font-size: var(--gsg-text-base);
	line-height: 1.65;
	color: var(--gsg-text-primary);
	background-color: var(--gsg-surface-page);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

img, video {
	max-width: 100%;
	height: auto;
	display: block;
}

a {
	color: var(--gsg-green-700);
	text-decoration: none;
	transition: color var(--gsg-transition-fast);
}

a:hover {
	color: var(--gsg-green-500);
}

a:focus-visible {
	outline: 2px solid var(--gsg-green-500);
	outline-offset: 2px;
	border-radius: var(--gsg-radius-sm);
}

ul, ol {
	list-style: none;
}

button {
	cursor: pointer;
	font-family: inherit;
	border: none;
	background: none;
}

h1, h2, h3, h4, h5, h6 {
	font-family: var(--gsg-font-heading);
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: -0.025em;
	color: var(--gsg-text-primary);
}

h1 { font-size: clamp(1.875rem, 5vw, 3rem); }
h2 { font-size: clamp(1.5rem, 3.5vw, 2.25rem); }
h3 { font-size: clamp(1.25rem, 2.5vw, 1.75rem); }
h4 { font-size: var(--gsg-text-xl); }
h5 { font-size: var(--gsg-text-lg); }
h6 { font-size: var(--gsg-text-base); }

p {
	margin-bottom: var(--gsg-space-4);
}

p:last-child {
	margin-bottom: 0;
}

/* 2. Layout Containers
   ========================================================================== */

.gsg-container {
	width: 100%;
	max-width: var(--gsg-container);
	margin-inline: auto;
	padding-inline: var(--gsg-space-4);
}

.gsg-container--wide {
	max-width: var(--gsg-container-wide);
}

.gsg-container--narrow {
	max-width: var(--gsg-container-narrow);
}

@media (min-width: 640px) {
	.gsg-container { padding-inline: var(--gsg-space-6); }
}

@media (min-width: 1024px) {
	.gsg-container { padding-inline: var(--gsg-space-8); }
}

/* Section spacing */
.gsg-section {
	padding-block: var(--gsg-space-12);
}

@media (min-width: 1024px) {
	.gsg-section { padding-block: var(--gsg-space-20); }
}

.gsg-section--sm {
	padding-block: var(--gsg-space-8);
}

/* Grid systems */
.gsg-grid {
	display: grid;
	gap: var(--gsg-space-6);
}

.gsg-grid--2 { grid-template-columns: 1fr; }
.gsg-grid--3 { grid-template-columns: 1fr; }
.gsg-grid--4 { grid-template-columns: 1fr; }

@media (min-width: 640px) {
	.gsg-grid--2 { grid-template-columns: repeat(2, 1fr); }
	.gsg-grid--4 { grid-template-columns: repeat(2, 1fr); }
}

@media (min-width: 768px) {
	.gsg-grid--3 { grid-template-columns: repeat(2, 1fr); }
}

@media (min-width: 1024px) {
	.gsg-grid--3 { grid-template-columns: repeat(3, 1fr); }
	.gsg-grid--4 { grid-template-columns: repeat(4, 1fr); }
}

/* Content + Sidebar layout */
.gsg-layout-sidebar {
	display: grid;
	gap: var(--gsg-space-8);
}

@media (min-width: 1024px) {
	.gsg-layout-sidebar {
		grid-template-columns: 1fr var(--gsg-sidebar-width);
		align-items: start;
	}
}

/* 3. Header
   ========================================================================== */

.site-header {
	position: sticky;
	top: 0;
	z-index: 100;
	background-color: #FFFFFF;
	border-bottom: 1px solid var(--gsg-border-light);
	box-shadow: 0 1px 6px rgba(18,38,58,0.06);
	min-height: var(--gsg-header-height);
}

.site-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--gsg-space-4);
	min-height: var(--gsg-header-height);
}

/* Logo */
.site-logo {
	display: flex;
	align-items: center;
	flex-shrink: 0;
}

.site-logo a {
	display: flex;
	align-items: center;
	gap: var(--gsg-space-3);
	color: var(--gsg-text-primary);
}

.site-logo img {
	height: 48px;
	width: auto;
}

.site-logo__text {
	display: none;
}

@media (min-width: 480px) {
	.site-logo__text {
		display: flex;
		flex-direction: column;
		line-height: 1;
	}

	.site-logo__name {
		font-size: var(--gsg-text-lg);
		font-weight: 800;
		letter-spacing: -0.03em;
		color: var(--gsg-green-800);
	}

	.site-logo__tagline {
		font-size: var(--gsg-text-xs);
		color: var(--gsg-text-muted);
		letter-spacing: 0.05em;
		text-transform: uppercase;
	}
}

/* Primary navigation */
.site-nav {
	display: none;
}

@media (min-width: 1024px) {
	.site-nav {
		display: flex;
		align-items: center;
	}

	.site-nav ul {
		display: flex;
		align-items: center;
		gap: var(--gsg-space-1);
	}

	.site-nav a {
		display: block;
		padding: var(--gsg-space-2) var(--gsg-space-3);
		color: var(--gsg-text-primary);
		font-size: var(--gsg-text-sm);
		font-weight: 600;
		border-radius: var(--gsg-radius-md);
		transition: color var(--gsg-transition-fast), background-color var(--gsg-transition-fast);
	}

	.site-nav a:hover,
	.site-nav .current-menu-item > a {
		color: var(--gsg-green-700);
		background-color: var(--gsg-green-50);
	}

	/* Dropdown */
	.site-nav .menu-item-has-children {
		position: relative;
	}

	.site-nav .sub-menu {
		position: absolute;
		top: calc(100% + var(--gsg-space-2));
		left: 0;
		min-width: 200px;
		background: var(--gsg-surface-card);
		border-radius: var(--gsg-radius-lg);
		box-shadow: var(--gsg-shadow-lg);
		border: 1px solid var(--gsg-border-light);
		padding: var(--gsg-space-2);
		opacity: 0;
		visibility: hidden;
		transform: translateY(-8px);
		transition: all var(--gsg-transition-base);
		z-index: 200;
	}

	.site-nav .menu-item-has-children:hover .sub-menu,
	.site-nav .menu-item-has-children:focus-within .sub-menu {
		opacity: 1;
		visibility: visible;
		transform: translateY(0);
	}

	.site-nav .sub-menu a {
		color: var(--gsg-text-primary);
		font-size: var(--gsg-text-sm);
	}

	.site-nav .sub-menu a:hover {
		color: var(--gsg-green-700);
		background-color: var(--gsg-green-50);
	}
}

/* Header CTA */
.site-header__cta {
	display: flex;
	align-items: center;
	gap: var(--gsg-space-3);
}

/* Mobile menu toggle */
.mobile-menu-toggle {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	color: var(--gsg-text-secondary);
	border-radius: var(--gsg-radius-md);
	transition: color var(--gsg-transition-fast), background-color var(--gsg-transition-fast);
}

.mobile-menu-toggle:hover {
	color: var(--gsg-green-700);
	background-color: var(--gsg-green-50);
}

@media (min-width: 1024px) {
	.mobile-menu-toggle { display: none; }
}

/* Mobile drawer */
.mobile-nav {
	display: none;
	position: fixed;
	inset: 0;
	z-index: 999;
}

.mobile-nav.is-open {
	display: block;
}

.mobile-nav__overlay {
	position: absolute;
	inset: 0;
	background: rgba(15, 46, 30, 0.6);
	backdrop-filter: blur(4px);
}

.mobile-nav__drawer {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	width: min(320px, 90vw);
	background: var(--gsg-green-800);
	padding: var(--gsg-space-6);
	overflow-y: auto;
	transform: translateX(100%);
	transition: transform var(--gsg-transition-base);
}

.mobile-nav.is-open .mobile-nav__drawer {
	transform: translateX(0);
}

.mobile-nav__close {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	margin-bottom: var(--gsg-space-6);
	color: var(--gsg-green-200);
}

.mobile-nav ul {
	display: flex;
	flex-direction: column;
	gap: var(--gsg-space-1);
}

.mobile-nav a {
	display: block;
	padding: var(--gsg-space-3) var(--gsg-space-4);
	color: var(--gsg-green-100);
	font-weight: 500;
	border-radius: var(--gsg-radius-md);
	transition: background-color var(--gsg-transition-fast);
}

.mobile-nav a:hover {
	background-color: rgba(255,255,255,0.1);
	color: #FFFFFF;
}

.mobile-nav .sub-menu {
	padding-left: var(--gsg-space-4);
	margin-top: var(--gsg-space-1);
}

.mobile-nav .sub-menu a {
	font-size: var(--gsg-text-sm);
	color: var(--gsg-green-300);
}

/* 4. Buttons
   ========================================================================== */

.gsg-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--gsg-space-2);
	padding: var(--gsg-space-3) var(--gsg-space-6);
	font-family: inherit;
	font-size: var(--gsg-text-sm);
	font-weight: 600;
	line-height: 1;
	border-radius: var(--gsg-radius-md);
	border: 2px solid transparent;
	cursor: pointer;
	transition: all var(--gsg-transition-fast);
	white-space: nowrap;
	text-decoration: none;
}

.gsg-btn:focus-visible {
	outline: 2px solid var(--gsg-green-500);
	outline-offset: 2px;
}

.gsg-btn--primary {
	background-color: var(--gsg-green-700);
	color: #FFFFFF;
	border-color: var(--gsg-green-700);
}

.gsg-btn--primary:hover {
	background-color: var(--gsg-green-600);
	border-color: var(--gsg-green-600);
	color: #FFFFFF;
	transform: translateY(-1px);
	box-shadow: var(--gsg-shadow-lift);
}

.gsg-btn--accent {
	background-color: var(--gsg-amber-500);
	color: #FFFFFF;
	border-color: var(--gsg-amber-500);
}

.gsg-btn--accent:hover {
	background-color: var(--gsg-amber-600);
	border-color: var(--gsg-amber-600);
	color: #FFFFFF;
	transform: translateY(-1px);
	box-shadow: 0 6px 20px rgba(224, 123, 57, 0.3);
}

.gsg-btn--tickets {
	background-color: var(--gsg-amber-500);
	color: #FFFFFF;
	border-color: var(--gsg-amber-500);
	font-weight: 700;
	box-shadow: 0 2px 8px rgba(224, 123, 57, 0.25);
}

.gsg-btn--tickets:hover {
	background-color: var(--gsg-amber-600);
	border-color: var(--gsg-amber-600);
	color: #FFFFFF;
	transform: translateY(-1px);
	box-shadow: 0 6px 20px rgba(224, 123, 57, 0.4);
}

.gsg-btn--outline {
	background-color: transparent;
	color: var(--gsg-green-700);
	border-color: var(--gsg-green-700);
}

.gsg-btn--outline:hover {
	background-color: var(--gsg-green-700);
	color: #FFFFFF;
}

.gsg-btn--ghost {
	background-color: transparent;
	color: var(--gsg-green-700);
	border-color: transparent;
}

.gsg-btn--ghost:hover {
	background-color: var(--gsg-green-50);
	color: var(--gsg-green-800);
}

.gsg-btn--sm {
	padding: var(--gsg-space-2) var(--gsg-space-4);
	font-size: var(--gsg-text-xs);
}

.gsg-btn--lg {
	padding: var(--gsg-space-4) var(--gsg-space-8);
	font-size: var(--gsg-text-base);
	border-radius: var(--gsg-radius-lg);
}

/* 5. Attraction Cards
   ========================================================================== */

.attraction-card {
	background: var(--gsg-surface-card);
	border-radius: var(--gsg-radius-lg);
	overflow: hidden;
	box-shadow: var(--gsg-shadow-card);
	transition: box-shadow var(--gsg-transition-base), transform var(--gsg-transition-base);
	display: flex;
	flex-direction: column;
}

.attraction-card:hover {
	box-shadow: var(--gsg-shadow-card-hover);
	transform: translateY(-3px);
}

.attraction-card__image {
	position: relative;
	aspect-ratio: 16/9;
	overflow: hidden;
	background: var(--gsg-green-100);
}

.attraction-card__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform var(--gsg-transition-slow);
}

.attraction-card:hover .attraction-card__image img {
	transform: scale(1.04);
}

.attraction-card__image-placeholder {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: linear-gradient(135deg, var(--gsg-green-100) 0%, var(--gsg-green-200) 100%);
	color: var(--gsg-green-500);
	font-size: 3rem;
}

.attraction-card__category {
	position: absolute;
	top: var(--gsg-space-3);
	left: var(--gsg-space-3);
	padding: var(--gsg-space-1) var(--gsg-space-3);
	background: rgba(18, 38, 58, 0.75);
	backdrop-filter: blur(4px);
	color: #FFFFFF;
	font-size: var(--gsg-text-xs);
	font-weight: 600;
	border-radius: var(--gsg-radius-pill);
	letter-spacing: 0.03em;
	text-transform: uppercase;
}

.attraction-card__body {
	padding: var(--gsg-space-5);
	flex: 1;
	display: flex;
	flex-direction: column;
}

.attraction-card__meta {
	display: flex;
	align-items: center;
	gap: var(--gsg-space-2);
	margin-bottom: var(--gsg-space-2);
	font-size: var(--gsg-text-xs);
	color: var(--gsg-text-muted);
}

.attraction-card__meta svg {
	width: 12px;
	height: 12px;
	flex-shrink: 0;
}

.attraction-card__city {
	font-weight: 500;
	color: var(--gsg-green-600);
}

.attraction-card__title {
	font-size: var(--gsg-text-lg);
	font-weight: 700;
	line-height: 1.3;
	margin-bottom: var(--gsg-space-3);
	letter-spacing: -0.02em;
}

.attraction-card__title a {
	color: var(--gsg-text-primary);
}

.attraction-card__title a:hover {
	color: var(--gsg-green-700);
}

.attraction-card__excerpt {
	font-size: var(--gsg-text-sm);
	color: var(--gsg-text-secondary);
	line-height: 1.6;
	flex: 1;
	margin-bottom: var(--gsg-space-4);
}

.attraction-card__tags {
	display: flex;
	flex-wrap: wrap;
	gap: var(--gsg-space-2);
	margin-bottom: var(--gsg-space-4);
}

.attraction-tag {
	display: inline-flex;
	align-items: center;
	gap: var(--gsg-space-1);
	padding: var(--gsg-space-1) var(--gsg-space-2);
	background: var(--gsg-green-50);
	color: var(--gsg-green-700);
	font-size: var(--gsg-text-xs);
	font-weight: 500;
	border-radius: var(--gsg-radius-pill);
	border: 1px solid var(--gsg-green-200);
}

.attraction-card__footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding-top: var(--gsg-space-4);
	border-top: 1px solid var(--gsg-border-light);
}

.attraction-card__link {
	font-size: var(--gsg-text-sm);
	font-weight: 600;
	color: var(--gsg-green-700);
	display: flex;
	align-items: center;
	gap: var(--gsg-space-1);
}

.attraction-card__link:hover {
	color: var(--gsg-green-500);
	gap: var(--gsg-space-2);
}

.attraction-card__duration {
	font-size: var(--gsg-text-xs);
	color: var(--gsg-text-muted);
	display: flex;
	align-items: center;
	gap: var(--gsg-space-1);
}

/* 6. Hero Section
   ========================================================================== */

.page-hero {
	position: relative;
	background: linear-gradient(135deg, var(--gsg-green-900) 0%, var(--gsg-green-800) 40%, var(--gsg-green-700) 100%);
	padding-block: var(--gsg-space-16) var(--gsg-space-20);
	overflow: hidden;
}

.page-hero::before {
	content: '';
	position: absolute;
	inset: 0;
	background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><circle cx="0" cy="0" r="60" fill="rgba(255,255,255,0.02)"/><circle cx="100" cy="100" r="80" fill="rgba(255,255,255,0.02)"/></svg>');
	background-size: 600px;
}

.page-hero__inner {
	position: relative;
	z-index: 1;
	text-align: center;
}

.page-hero__breadcrumb {
	margin-bottom: var(--gsg-space-4);
}

.page-hero__title {
	font-size: clamp(2rem, 6vw, 3.5rem);
	color: #FFFFFF;
	font-weight: 800;
	letter-spacing: -0.03em;
	margin-bottom: var(--gsg-space-4);
}

.page-hero__title em {
	font-style: normal;
	color: var(--gsg-green-400);
}

.page-hero__subtitle {
	font-size: clamp(var(--gsg-text-base), 2vw, var(--gsg-text-xl));
	color: var(--gsg-green-200);
	max-width: 600px;
	margin-inline: auto;
	margin-bottom: var(--gsg-space-8);
	line-height: 1.6;
}

.page-hero__actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--gsg-space-3);
	justify-content: center;
}

.page-hero__stats {
	display: flex;
	gap: var(--gsg-space-8);
	justify-content: center;
	margin-top: var(--gsg-space-10);
}

.page-hero__stat {
	text-align: center;
}

.page-hero__stat-number {
	display: block;
	font-size: var(--gsg-text-3xl);
	font-weight: 800;
	color: #FFFFFF;
	letter-spacing: -0.04em;
}

.page-hero__stat-label {
	display: block;
	font-size: var(--gsg-text-xs);
	color: var(--gsg-green-300);
	text-transform: uppercase;
	letter-spacing: 0.08em;
	margin-top: var(--gsg-space-1);
}

/* 7. Section Headers
   ========================================================================== */

.section-header {
	margin-bottom: var(--gsg-space-10);
}

.section-header--center {
	text-align: center;
}

.section-label {
	display: inline-flex;
	align-items: center;
	gap: var(--gsg-space-2);
	padding: var(--gsg-space-1) var(--gsg-space-3);
	background: var(--gsg-green-100);
	color: var(--gsg-green-700);
	font-size: var(--gsg-text-xs);
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	border-radius: var(--gsg-radius-pill);
	margin-bottom: var(--gsg-space-3);
}

.section-title {
	font-size: clamp(var(--gsg-text-2xl), 4vw, var(--gsg-text-4xl));
	font-weight: 800;
	letter-spacing: -0.03em;
	color: var(--gsg-text-primary);
}

.section-subtitle {
	font-size: var(--gsg-text-lg);
	color: var(--gsg-text-secondary);
	margin-top: var(--gsg-space-3);
	max-width: 600px;
	line-height: 1.6;
}

.section-header--center .section-subtitle {
	margin-inline: auto;
}

/* 8. Region Cards
   ========================================================================== */

.region-card {
	position: relative;
	border-radius: var(--gsg-radius-xl);
	overflow: hidden;
	background: var(--gsg-green-800);
	min-height: 240px;
	display: flex;
	align-items: flex-end;
	transition: transform var(--gsg-transition-base);
}

.region-card:hover {
	transform: translateY(-4px);
}

.region-card::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(15, 46, 30, 0.9) 0%, rgba(15, 46, 30, 0.3) 60%, transparent 100%);
	transition: opacity var(--gsg-transition-base);
}

.region-card:hover::after {
	opacity: 0.85;
}

.region-card__bg {
	position: absolute;
	inset: 0;
}

.region-card__bg img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform var(--gsg-transition-slow);
}

.region-card:hover .region-card__bg img {
	transform: scale(1.06);
}

.region-card__body {
	position: relative;
	z-index: 1;
	padding: var(--gsg-space-6);
	width: 100%;
}

.region-card__title {
	font-size: var(--gsg-text-2xl);
	font-weight: 800;
	color: #FFFFFF;
	letter-spacing: -0.03em;
	margin-bottom: var(--gsg-space-1);
}

.region-card__count {
	font-size: var(--gsg-text-sm);
	color: var(--gsg-green-300);
	margin-bottom: var(--gsg-space-3);
}

.region-card__link {
	display: inline-flex;
	align-items: center;
	gap: var(--gsg-space-1);
	font-size: var(--gsg-text-sm);
	font-weight: 600;
	color: var(--gsg-green-400);
	transition: gap var(--gsg-transition-fast);
}

.region-card:hover .region-card__link {
	gap: var(--gsg-space-2);
}

/* 9. Breadcrumbs
   ========================================================================== */

.breadcrumbs {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--gsg-space-1);
	font-size: var(--gsg-text-sm);
}

.breadcrumbs__item {
	display: flex;
	align-items: center;
	gap: var(--gsg-space-1);
}

.breadcrumbs__item:not(:last-child)::after {
	content: '/';
	color: var(--gsg-text-muted);
	margin-left: var(--gsg-space-1);
}

.breadcrumbs a {
	color: var(--gsg-text-secondary);
}

.breadcrumbs a:hover {
	color: var(--gsg-green-700);
}

.breadcrumbs__current {
	color: var(--gsg-text-muted);
}

/* Breadcrumbs on dark backgrounds (--light modifier on the same nav element) */
.breadcrumbs--light a {
	color: rgba(255, 255, 255, 0.85);
}

.breadcrumbs--light a:hover {
	color: #FFFFFF;
}

.breadcrumbs--light .breadcrumbs__current {
	color: rgba(255, 255, 255, 0.6);
}

.breadcrumbs--light .breadcrumbs__item:not(:last-child)::after {
	color: rgba(255, 255, 255, 0.4);
}

/* 10. Badges / Tags
   ========================================================================== */

.badge {
	display: inline-flex;
	align-items: center;
	gap: var(--gsg-space-1);
	padding: var(--gsg-space-1) var(--gsg-space-3);
	font-size: var(--gsg-text-xs);
	font-weight: 600;
	border-radius: var(--gsg-radius-pill);
	line-height: 1;
}

.badge--green {
	background: var(--gsg-green-100);
	color: var(--gsg-green-800);
}

.badge--amber {
	background: var(--gsg-amber-100);
	color: var(--gsg-amber-700);
}

.badge--free {
	background: #DCFCE7;
	color: #15803D;
}

.badge--family {
	background: #EDE9FE;
	color: #7C3AED;
}

.badge--outdoor {
	background: var(--gsg-green-100);
	color: var(--gsg-green-700);
}

/* 11. Footer
   ========================================================================== */

.site-footer {
	background: var(--gsg-surface-dark);
	color: var(--gsg-green-200);
}

.site-footer__main {
	padding-block: var(--gsg-space-16);
}

.site-footer__grid {
	display: grid;
	gap: var(--gsg-space-10);
}

@media (min-width: 640px) {
	.site-footer__grid { grid-template-columns: repeat(2, 1fr); }
}

@media (min-width: 1024px) {
	.site-footer__grid { grid-template-columns: 1.5fr 1fr 1fr 1fr 1fr; gap: var(--gsg-space-8); }
}

.site-footer__brand p {
	font-size: var(--gsg-text-sm);
	color: var(--gsg-green-400);
	line-height: 1.7;
	margin-top: var(--gsg-space-4);
}

.site-footer__logo img {
	height: 40px;
	width: auto;
	opacity: 0.9;
	/* Natural green highway-sign logo renders well on dark navy footer */
}

.site-footer__col-title {
	font-size: var(--gsg-text-xs);
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--gsg-green-500);
	margin-bottom: var(--gsg-space-4);
}

.site-footer__nav ul {
	display: flex;
	flex-direction: column;
	gap: var(--gsg-space-2);
}

.site-footer__nav a {
	font-size: var(--gsg-text-sm);
	color: var(--gsg-green-300);
	transition: color var(--gsg-transition-fast);
}

.site-footer__nav a:hover {
	color: #FFFFFF;
}

.site-footer__bottom {
	border-top: 1px solid rgba(255,255,255,0.08);
	padding-block: var(--gsg-space-6);
}

.site-footer__bottom-inner {
	display: flex;
	flex-direction: column;
	gap: var(--gsg-space-3);
	font-size: var(--gsg-text-xs);
	color: var(--gsg-green-600);
}

@media (min-width: 768px) {
	.site-footer__bottom-inner {
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
	}
}

.site-footer__bottom-links {
	display: flex;
	flex-wrap: wrap;
	gap: var(--gsg-space-4);
	align-items: center;
}

.site-footer__bottom-links a {
	color: var(--gsg-green-500);
	transition: color var(--gsg-transition-fast);
}

.site-footer__bottom-links a:hover {
	color: #FFFFFF;
}

/* Generic page template (Privacy Policy, Terms, etc.)
   ========================================================================== */

.page-content-wrap {
	max-width: 800px;
	margin-inline: auto;
}

.page-content__body {
	font-size: var(--gsg-text-base);
	line-height: 1.8;
	color: var(--gsg-text-primary);
}

.page-content__body h2 {
	font-size: var(--gsg-text-2xl);
	font-weight: 700;
	color: var(--gsg-green-800);
	margin-top: var(--gsg-space-10);
	margin-bottom: var(--gsg-space-4);
}

.page-content__body h3 {
	font-size: var(--gsg-text-xl);
	font-weight: 600;
	color: var(--gsg-green-700);
	margin-top: var(--gsg-space-8);
	margin-bottom: var(--gsg-space-3);
}

.page-content__body p {
	margin-bottom: var(--gsg-space-5);
}

.page-content__body ul,
.page-content__body ol {
	margin-bottom: var(--gsg-space-5);
	padding-left: var(--gsg-space-6);
}

.page-content__body li {
	margin-bottom: var(--gsg-space-2);
}

.page-content__body a {
	color: var(--gsg-green-600);
	text-decoration: underline;
}

.page-content__body a:hover {
	color: var(--gsg-green-800);
}

/* 12. Content / Entry
   ========================================================================== */

.entry-content {
	max-width: var(--gsg-container-narrow);
}

.entry-content h2,
.entry-content h3,
.entry-content h4 {
	margin-top: var(--gsg-space-8);
	margin-bottom: var(--gsg-space-3);
}

.entry-content p {
	margin-bottom: var(--gsg-space-5);
	color: var(--gsg-text-secondary);
	line-height: 1.75;
}

.entry-content ul,
.entry-content ol {
	margin-bottom: var(--gsg-space-5);
	padding-left: var(--gsg-space-6);
}

.entry-content ul { list-style: disc; }
.entry-content ol { list-style: decimal; }

.entry-content li {
	margin-bottom: var(--gsg-space-2);
	color: var(--gsg-text-secondary);
	line-height: 1.7;
}

.entry-content a {
	color: var(--gsg-green-700);
	text-decoration: underline;
	text-underline-offset: 2px;
}

.entry-content a[rel~="nofollow"] {
	color: var(--gsg-text-secondary);
}

.entry-content blockquote {
	border-left: 4px solid var(--gsg-green-500);
	padding-left: var(--gsg-space-6);
	margin-block: var(--gsg-space-6);
	font-style: italic;
	color: var(--gsg-text-secondary);
}

/* 13. FAQ Component
   ========================================================================== */

.faq-section {
	padding: var(--gsg-space-10) 0;
}

.faq-item {
	border: 1px solid var(--gsg-border-light);
	border-radius: var(--gsg-radius-lg);
	overflow: hidden;
	margin-bottom: var(--gsg-space-3);
}

.faq-item__question {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: var(--gsg-space-5) var(--gsg-space-6);
	font-size: var(--gsg-text-base);
	font-weight: 600;
	color: var(--gsg-text-primary);
	background: var(--gsg-surface-card);
	cursor: pointer;
	text-align: left;
	gap: var(--gsg-space-4);
	transition: background-color var(--gsg-transition-fast);
}

.faq-item__question:hover {
	background: var(--gsg-green-50);
}

.faq-item__icon {
	flex-shrink: 0;
	width: 24px;
	height: 24px;
	border-radius: 50%;
	background: var(--gsg-green-100);
	color: var(--gsg-green-700);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: var(--gsg-text-lg);
	transition: transform var(--gsg-transition-base), background-color var(--gsg-transition-fast);
}

.faq-item.is-open .faq-item__icon {
	transform: rotate(45deg);
	background: var(--gsg-green-700);
	color: #FFFFFF;
}

.faq-item__answer {
	display: none;
	padding: 0 var(--gsg-space-6) var(--gsg-space-5);
	background: var(--gsg-surface-card);
}

.faq-item.is-open .faq-item__answer {
	display: block;
}

.faq-item__answer p {
	color: var(--gsg-text-secondary);
	line-height: 1.7;
}

/* 14. Map Component
   ========================================================================== */

.map-container {
	border-radius: var(--gsg-radius-lg);
	overflow: hidden;
	box-shadow: var(--gsg-shadow-md);
	border: 1px solid var(--gsg-border-light);
}

.map-container .leaflet-map {
	height: 400px;
	width: 100%;
}

@media (min-width: 768px) {
	.map-container .leaflet-map { height: 500px; }
}

/* 15. Pagination
   ========================================================================== */

.pagination {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--gsg-space-2);
	padding-block: var(--gsg-space-8);
}

.pagination a,
.pagination .current {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: var(--gsg-radius-md);
	font-size: var(--gsg-text-sm);
	font-weight: 600;
	transition: all var(--gsg-transition-fast);
	border: 1px solid var(--gsg-border-light);
}

.pagination a {
	color: var(--gsg-text-secondary);
	background: var(--gsg-surface-card);
}

.pagination a:hover {
	color: var(--gsg-green-700);
	border-color: var(--gsg-green-400);
	background: var(--gsg-green-50);
}

.pagination .current {
	color: #FFFFFF;
	background: var(--gsg-green-700);
	border-color: var(--gsg-green-700);
}

/* 16. Notice / Alert Boxes
   ========================================================================== */

.notice {
	display: flex;
	gap: var(--gsg-space-3);
	padding: var(--gsg-space-4) var(--gsg-space-5);
	border-radius: var(--gsg-radius-md);
	font-size: var(--gsg-text-sm);
	line-height: 1.6;
}

.notice--tip {
	background: var(--gsg-green-50);
	border: 1px solid var(--gsg-green-200);
	color: var(--gsg-green-800);
}

.notice--info {
	background: #EFF6FF;
	border: 1px solid #BFDBFE;
	color: #1E40AF;
}

.notice__icon {
	font-size: 1.25rem;
	flex-shrink: 0;
}

/* 17. Utility Classes
   ========================================================================== */

.sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0,0,0,0);
	white-space: nowrap;
	border-width: 0;
}

.text-center { text-align: center; }
.text-right  { text-align: right; }
.text-muted  { color: var(--gsg-text-muted); }
.text-accent { color: var(--gsg-accent); }
.text-green  { color: var(--gsg-green-700); }

.mt-0 { margin-top: 0 !important; }
.mb-0 { margin-bottom: 0 !important; }

.bg-green-dark { background: var(--gsg-green-800); }
.bg-green-pale { background: var(--gsg-green-50); }
.bg-surface    { background: var(--gsg-surface-raised); }

/* 18. Skip Link (Accessibility)
   ========================================================================== */

.skip-link {
	position: absolute;
	top: -100%;
	left: var(--gsg-space-4);
	padding: var(--gsg-space-3) var(--gsg-space-5);
	background: var(--gsg-green-700);
	color: #FFFFFF;
	font-weight: 600;
	border-radius: 0 0 var(--gsg-radius-md) var(--gsg-radius-md);
	z-index: 9999;
	transition: top var(--gsg-transition-fast);
}

.skip-link:focus {
	top: 0;
	color: #FFFFFF;
}

/* 19. Print
   ========================================================================== */

@media print {
	.site-header,
	.site-footer,
	.mobile-nav { display: none; }
	body { font-size: 12pt; }
}

/* 20. Phase 4 — Taxonomy Templates
   ========================================================================== */

/* Taxonomy Filter Bar (region/category strip) */
.taxonomy-filter-bar {
	background: var(--gsg-surface-raised);
	border-bottom: 1px solid var(--gsg-border-light);
	padding: var(--gsg-space-3) 0;
}

.taxonomy-filter-bar--secondary {
	background: var(--gsg-surface-page);
}

.taxonomy-filter {
	display: flex;
	align-items: flex-start;
	gap: var(--gsg-space-3);
}


.taxonomy-filter__label {
	font-size: var(--gsg-text-xs);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--gsg-text-muted);
	white-space: nowrap;
	flex-shrink: 0;
}

.taxonomy-filter__scroll {
	display: flex;
	flex-wrap: wrap;
	gap: var(--gsg-space-2);
	flex: 1;
	min-width: 0;
}


.taxonomy-filter__chip {
	display: inline-flex;
	align-items: center;
	gap: var(--gsg-space-1);
	padding: var(--gsg-space-1) var(--gsg-space-3);
	background: var(--gsg-surface-card);
	border: 1px solid var(--gsg-border-mid);
	color: var(--gsg-text-secondary);
	font-size: var(--gsg-text-xs);
	font-weight: 600;
	border-radius: var(--gsg-radius-pill);
	white-space: nowrap;
	transition: all var(--gsg-transition-fast);
	text-decoration: none;
}

.taxonomy-filter__chip:hover,
.taxonomy-filter__chip--active {
	background: var(--gsg-green-700);
	border-color: var(--gsg-green-700);
	color: #FFFFFF;
}

.taxonomy-filter__chip--active {
	font-weight: 700;
	cursor: default;
}

/* Taxonomy Intro Content */
.taxonomy-intro {
	max-width: 860px;
	margin: 0 auto;
	font-size: var(--gsg-text-lg);
	color: var(--gsg-text-secondary);
	line-height: 1.75;
}

.taxonomy-intro h2,
.taxonomy-intro h3 {
	margin-top: var(--gsg-space-8);
	margin-bottom: var(--gsg-space-3);
	color: var(--gsg-text-primary);
}

.taxonomy-intro p {
	margin-bottom: var(--gsg-space-5);
}

.taxonomy-intro ul,
.taxonomy-intro ol {
	margin-bottom: var(--gsg-space-5);
	padding-left: var(--gsg-space-6);
}

.taxonomy-intro ul { list-style: disc; }
.taxonomy-intro ol { list-style: decimal; }

.taxonomy-intro li {
	margin-bottom: var(--gsg-space-2);
	line-height: 1.7;
}

/* FAQ contained width */
.faq-section--contained {
	max-width: 800px;
	margin: 0 auto;
}

/* Region Sibling Cards (related regions grid) */
.region-sibling-card {
	display: flex;
	align-items: center;
	gap: var(--gsg-space-4);
	padding: var(--gsg-space-5);
	background: var(--gsg-surface-card);
	border: 1px solid var(--gsg-border-light);
	border-radius: var(--gsg-radius-lg);
	text-decoration: none;
	transition: all var(--gsg-transition-fast);
}

.region-sibling-card:hover {
	border-color: var(--gsg-green-500);
	box-shadow: var(--gsg-shadow-card);
	transform: translateY(-2px);
}

.region-sibling-card__emoji {
	font-size: 2rem;
	flex-shrink: 0;
}

.region-sibling-card__body {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: var(--gsg-space-1);
}

.region-sibling-card__name {
	font-size: var(--gsg-text-base);
	font-weight: 700;
	color: var(--gsg-text-primary);
}

.region-sibling-card__count {
	font-size: var(--gsg-text-xs);
	color: var(--gsg-text-muted);
}

.region-sibling-card__arrow {
	color: var(--gsg-green-600);
	font-size: var(--gsg-text-lg);
	flex-shrink: 0;
}

/* Category Sibling Cards */
.category-sibling-card {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--gsg-space-2);
	padding: var(--gsg-space-5);
	background: var(--gsg-surface-card);
	border: 1px solid var(--gsg-border-light);
	border-radius: var(--gsg-radius-lg);
	text-align: center;
	text-decoration: none;
	transition: all var(--gsg-transition-fast);
}

.category-sibling-card:hover {
	border-color: var(--gsg-green-500);
	background: var(--gsg-green-50);
	transform: translateY(-2px);
}

.category-sibling-card__emoji {
	font-size: 2rem;
}

.category-sibling-card__name {
	font-size: var(--gsg-text-sm);
	font-weight: 600;
	color: var(--gsg-text-primary);
	line-height: 1.3;
}

/* City Links Grid (county page) */
.city-links-grid {
	display: flex;
	flex-wrap: wrap;
	gap: var(--gsg-space-2);
}

.city-link-chip {
	display: inline-flex;
	align-items: center;
	gap: var(--gsg-space-2);
	padding: var(--gsg-space-2) var(--gsg-space-4);
	background: var(--gsg-surface-card);
	border: 1px solid var(--gsg-border-light);
	color: var(--gsg-text-secondary);
	font-size: var(--gsg-text-sm);
	font-weight: 500;
	border-radius: var(--gsg-radius-pill);
	text-decoration: none;
	transition: all var(--gsg-transition-fast);
}

.city-link-chip:hover {
	background: var(--gsg-green-700);
	border-color: var(--gsg-green-700);
	color: #FFFFFF;
}

.city-link-chip__count {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 20px;
	height: 20px;
	background: var(--gsg-green-100);
	color: var(--gsg-green-700);
	border-radius: 50%;
	font-size: var(--gsg-text-xs);
	font-weight: 700;
}

.city-link-chip:hover .city-link-chip__count {
	background: rgba(255,255,255,0.2);
	color: #FFFFFF;
}

/* New Jersey Hub Page — Region Cards */
.region-hub-card {
	display: flex;
	align-items: flex-start;
	gap: var(--gsg-space-5);
	padding: var(--gsg-space-6);
	background: var(--gsg-surface-card);
	border: 1px solid var(--gsg-border-light);
	border-radius: var(--gsg-radius-xl);
	text-decoration: none;
	transition: all var(--gsg-transition-base);
}

.region-hub-card:hover {
	border-color: var(--gsg-green-500);
	box-shadow: var(--gsg-shadow-card-hover);
	transform: translateY(-3px);
}

.region-hub-card__emoji {
	font-size: 2.5rem;
	flex-shrink: 0;
	line-height: 1;
}

.region-hub-card__body {
	display: flex;
	flex-direction: column;
	gap: var(--gsg-space-2);
}

.region-hub-card__name {
	font-size: var(--gsg-text-xl);
	font-weight: 700;
	color: var(--gsg-text-primary);
	letter-spacing: -0.02em;
}

.region-hub-card__desc {
	font-size: var(--gsg-text-sm);
	color: var(--gsg-text-secondary);
	line-height: 1.6;
}

.region-hub-card__count {
	font-size: var(--gsg-text-sm);
	font-weight: 600;
	color: var(--gsg-green-700);
}

/* New Jersey Hub Page — Category Cards */
.category-hub-card {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--gsg-space-2);
	padding: var(--gsg-space-6) var(--gsg-space-4);
	background: var(--gsg-surface-card);
	border: 1px solid var(--gsg-border-light);
	border-radius: var(--gsg-radius-lg);
	text-align: center;
	text-decoration: none;
	transition: all var(--gsg-transition-fast);
}

.category-hub-card:hover {
	border-color: var(--gsg-green-500);
	background: var(--gsg-green-50);
	transform: translateY(-2px);
	box-shadow: var(--gsg-shadow-card);
}

.category-hub-card__emoji {
	font-size: 2.25rem;
	line-height: 1;
}

.category-hub-card__name {
	font-size: var(--gsg-text-sm);
	font-weight: 700;
	color: var(--gsg-text-primary);
	line-height: 1.3;
}

.category-hub-card__count {
	font-size: var(--gsg-text-xs);
	color: var(--gsg-text-muted);
}

/* Cluster map height (city pages + aggregate maps) */
.leaflet-map--cluster {
	height: 450px;
	width: 100%;
	position: relative;
}

@media (min-width: 768px) {
	.leaflet-map--cluster { height: 550px; }
}

/* Aggregate map loading placeholder */
.aggregate-map-placeholder {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background: var(--gsg-surface, #f5f7f4);
	border-radius: var(--gsg-radius-lg);
	gap: var(--gsg-space-3);
	pointer-events: none;
}

.aggregate-map-placeholder__icon {
	font-size: 2.5rem;
	line-height: 1;
	opacity: 0.5;
}

.aggregate-map-placeholder__text {
	font-size: var(--gsg-text-sm);
	color: var(--gsg-text-muted);
}

/* Internal Links Component */
.internal-links {
	padding-top: var(--gsg-space-6);
	border-top: 1px solid var(--gsg-border-light);
	margin-top: var(--gsg-space-8);
}

.internal-links__heading {
	font-size: var(--gsg-text-sm);
	color: var(--gsg-text-muted);
	margin-bottom: var(--gsg-space-3);
}

.internal-links__chips {
	display: flex;
	flex-wrap: wrap;
	gap: var(--gsg-space-2);
}

/* Attraction Gallery Grid */
.attraction-gallery {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: var(--gsg-space-3);
	margin-top: var(--gsg-space-5);
}

@media (min-width: 640px) {
	.attraction-gallery { grid-template-columns: repeat(3, 1fr); }
}

.attraction-gallery__item {
	border-radius: var(--gsg-radius-md);
	overflow: hidden;
	aspect-ratio: 4/3;
}

.attraction-gallery__item img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform var(--gsg-transition-slow);
}

.attraction-gallery__item:hover img {
	transform: scale(1.04);
}

/* page-hero--has-image — when a custom hero image is set via WP Admin term meta */
.page-hero--has-image {
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

.page-hero--has-image::before {
	background: linear-gradient(to bottom, rgba(8, 24, 15, 0.50) 0%, rgba(8, 24, 15, 0.78) 100%) !important;
}

/* page-hero--sm variant */
.page-hero--sm {
	padding-block: var(--gsg-space-6) var(--gsg-space-8);
}
.page-hero--sm .page-hero__title {
	font-size: clamp(1.5rem, 4vw, 2.25rem);
	margin-bottom: var(--gsg-space-2);
}
.page-hero--sm .page-hero__subtitle {
	font-size: var(--gsg-text-base);
	margin-bottom: 0;
}

/* ==========================================================================
   21. Phase 5 — Homepage Components
   ========================================================================== */

/* ---- Home Hero ---- */

.home-hero {
	position: relative;
	background-color: var(--gsg-green-900);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	padding-block: var(--gsg-space-16) var(--gsg-space-20);
	overflow: hidden;
	min-height: 420px;
	display: flex;
	align-items: center;
}

@media (min-width: 768px) {
	.home-hero { min-height: 500px; }
}

.home-hero__overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(
		to bottom,
		rgba(12, 35, 22, 0.50) 0%,
		rgba(12, 35, 22, 0.65) 60%,
		rgba(12, 35, 22, 0.78) 100%
	);
	pointer-events: none;
}

.home-hero__inner {
	position: relative;
	z-index: 1;
	text-align: center;
	max-width: 800px;
	margin-inline: auto;
}

.home-hero__title {
	font-size: clamp(2.25rem, 7vw, 4rem);
	font-weight: 900;
	color: #FFFFFF;
	letter-spacing: -0.04em;
	line-height: 1.1;
	margin-bottom: var(--gsg-space-5);
	text-shadow: 0 2px 16px rgba(0,0,0,0.35);
}

.home-hero__title em {
	font-style: normal;
	color: var(--gsg-green-400);
	position: relative;
}

.home-hero__subtitle {
	font-size: clamp(var(--gsg-text-base), 2.2vw, var(--gsg-text-xl));
	color: rgba(255,255,255,0.88);
	max-width: 600px;
	margin-inline: auto;
	margin-bottom: var(--gsg-space-8);
	line-height: 1.65;
	text-shadow: 0 1px 8px rgba(0,0,0,0.25);
}


/* ---- Hero Search Bar ---- */

.hero-search {
	margin-bottom: var(--gsg-space-6);
}

.hero-search__inner {
	display: flex;
	align-items: center;
	background: #FFFFFF;
	border-radius: var(--gsg-radius-pill);
	padding: var(--gsg-space-2) var(--gsg-space-2) var(--gsg-space-2) var(--gsg-space-5);
	gap: var(--gsg-space-2);
	box-shadow: 0 4px 24px rgba(0,0,0,0.25), 0 0 0 1px rgba(255,255,255,0.1);
	max-width: 600px;
	margin-inline: auto;
	transition: box-shadow var(--gsg-transition-base);
}

.hero-search__inner:focus-within {
	box-shadow: 0 4px 32px rgba(0,0,0,0.3), 0 0 0 3px var(--gsg-green-400);
}

.hero-search__icon {
	color: var(--gsg-text-muted);
	flex-shrink: 0;
}

.hero-search__input {
	flex: 1;
	border: none;
	outline: none;
	background: transparent;
	font-family: inherit;
	font-size: var(--gsg-text-base);
	color: var(--gsg-text-primary);
	padding: var(--gsg-space-2) 0;
	min-width: 0;
}

.hero-search__input::placeholder {
	color: var(--gsg-text-muted);
}

.hero-search__btn {
	flex-shrink: 0;
	padding: var(--gsg-space-3) var(--gsg-space-5);
	background: var(--gsg-green-700);
	color: #FFFFFF;
	font-family: inherit;
	font-size: var(--gsg-text-sm);
	font-weight: 700;
	border: none;
	border-radius: var(--gsg-radius-pill);
	cursor: pointer;
	transition: background-color var(--gsg-transition-fast), transform var(--gsg-transition-fast);
	white-space: nowrap;
}

.hero-search__btn:hover {
	background: var(--gsg-green-600);
	transform: scale(1.02);
}

/* ---- Region Gateway Cards ---- */

.region-gateway-grid {
	display: grid;
	gap: var(--gsg-space-5);
	grid-template-columns: 1fr;
}

@media (min-width: 640px) {
	.region-gateway-grid { grid-template-columns: repeat(2, 1fr); }
}

.region-gateway-card {
	position: relative;
	border-radius: var(--gsg-radius-xl);
	padding: var(--gsg-space-8) var(--gsg-space-6);
	min-height: 280px;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	overflow: hidden;
	text-decoration: none;
	transition: transform var(--gsg-transition-base), box-shadow var(--gsg-transition-base);
}

.region-gateway-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 20px 50px rgba(18,38,58,0.2);
}

/* Color themes for each region */
.region-gateway-card--urban {
	background: linear-gradient(145deg, #12263A 0%, #1B3A5C 40%, #1E4D35 100%);
}

.region-gateway-card--farmland {
	background: linear-gradient(145deg, #2D4A1A 0%, #3A6B2E 40%, #8B7335 100%);
}

.region-gateway-card--shore {
	background: linear-gradient(145deg, #0F3A4A 0%, #1A6B8A 40%, #1E4D35 100%);
}

.region-gateway-card--forest {
	background: linear-gradient(145deg, #0F2E1E 0%, #1E4D35 40%, #2D3A1A 100%);
}

/* Decorative overlay / texture */
.region-gateway-card__overlay {
	position: absolute;
	inset: 0;
	background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200"><circle cx="160" cy="40" r="80" fill="rgba(255,255,255,0.03)"/><circle cx="20" cy="160" r="60" fill="rgba(255,255,255,0.03)"/></svg>');
	background-size: cover;
	pointer-events: none;
}

.region-gateway-card__emoji {
	font-size: 3.5rem;
	line-height: 1;
	margin-bottom: var(--gsg-space-4);
	filter: drop-shadow(0 2px 8px rgba(0,0,0,0.3));
	transition: transform var(--gsg-transition-base);
}

.region-gateway-card:hover .region-gateway-card__emoji {
	transform: scale(1.1) rotate(-3deg);
}

.region-gateway-card__body {
	position: relative;
	z-index: 1;
}

.region-gateway-card__name {
	font-size: var(--gsg-text-2xl);
	font-weight: 800;
	color: #FFFFFF;
	letter-spacing: -0.03em;
	margin-bottom: var(--gsg-space-2);
}

.region-gateway-card__desc {
	font-size: var(--gsg-text-sm);
	color: rgba(255,255,255,0.75);
	line-height: 1.6;
	margin-bottom: var(--gsg-space-4);
}

.region-gateway-card__highlights {
	display: flex;
	flex-wrap: wrap;
	gap: var(--gsg-space-2);
	margin-bottom: var(--gsg-space-5);
}

.region-gateway-card__chip {
	display: inline-block;
	padding: var(--gsg-space-1) var(--gsg-space-3);
	background: rgba(255,255,255,0.12);
	border: 1px solid rgba(255,255,255,0.2);
	color: rgba(255,255,255,0.9);
	font-size: var(--gsg-text-xs);
	font-weight: 500;
	border-radius: var(--gsg-radius-pill);
	backdrop-filter: blur(4px);
}

.region-gateway-card__footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding-top: var(--gsg-space-4);
	border-top: 1px solid rgba(255,255,255,0.12);
}

.region-gateway-card__count {
	font-size: var(--gsg-text-xs);
	color: rgba(255,255,255,0.55);
	font-weight: 600;
}

.region-gateway-card__cta {
	font-size: var(--gsg-text-sm);
	font-weight: 700;
	color: var(--gsg-green-300);
	transition: color var(--gsg-transition-fast), letter-spacing var(--gsg-transition-fast);
}

.region-gateway-card:hover .region-gateway-card__cta {
	color: #FFFFFF;
}

/* ---- Section header flex variant ---- */

.section-header__flex {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: var(--gsg-space-4);
	flex-wrap: wrap;
}

.section-header__cta {
	flex-shrink: 0;
	align-self: flex-start;
	margin-top: var(--gsg-space-1);
}

/* ---- Category Browse Grid ---- */

.category-browse-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: var(--gsg-space-4);
}

@media (min-width: 480px) {
	.category-browse-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (min-width: 768px) {
	.category-browse-grid { grid-template-columns: repeat(4, 1fr); }
}

.category-browse-card {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: var(--gsg-space-3);
	padding: var(--gsg-space-6) var(--gsg-space-4);
	border-radius: var(--gsg-radius-xl);
	text-decoration: none;
	text-align: center;
	transition: transform var(--gsg-transition-fast), box-shadow var(--gsg-transition-fast);
	min-height: 140px;
	border: 1px solid transparent;
}

.category-browse-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 12px 32px rgba(18,38,58,0.15);
}

.category-browse-card__emoji {
	font-size: 2.5rem;
	line-height: 1;
	display: block;
	transition: transform var(--gsg-transition-base);
}

.category-browse-card:hover .category-browse-card__emoji {
	transform: scale(1.15);
}

.category-browse-card__name {
	font-size: var(--gsg-text-sm);
	font-weight: 700;
	line-height: 1.3;
	display: block;
}

.category-browse-card__count {
	font-size: var(--gsg-text-xs);
	font-weight: 600;
	display: block;
	opacity: 0.7;
}

/* Category color themes */
.category-browse-card--blue {
	background: linear-gradient(135deg, #EFF6FF 0%, #DBEAFE 100%);
	border-color: #BFDBFE;
	color: #1E40AF;
}
.category-browse-card--blue:hover { background: linear-gradient(135deg, #DBEAFE 0%, #BFDBFE 100%); }

.category-browse-card--green {
	background: linear-gradient(135deg, #F0FAF3 0%, #D8F3DC 100%);
	border-color: var(--gsg-green-200);
	color: var(--gsg-green-800);
}
.category-browse-card--green:hover { background: linear-gradient(135deg, #D8F3DC 0%, #B7E4C7 100%); }

.category-browse-card--purple {
	background: linear-gradient(135deg, #FAF5FF 0%, #EDE9FE 100%);
	border-color: #DDD6FE;
	color: #5B21B6;
}
.category-browse-card--purple:hover { background: linear-gradient(135deg, #EDE9FE 0%, #DDD6FE 100%); }

.category-browse-card--amber {
	background: linear-gradient(135deg, #FFFBEB 0%, #FEF3C7 100%);
	border-color: #FDE68A;
	color: #B45309;
}
.category-browse-card--amber:hover { background: linear-gradient(135deg, #FEF3C7 0%, #FDE68A 100%); }

.category-browse-card--orange {
	background: linear-gradient(135deg, #FFF7ED 0%, var(--gsg-amber-100) 100%);
	border-color: var(--gsg-amber-100);
	color: var(--gsg-amber-700);
}
.category-browse-card--orange:hover { background: linear-gradient(135deg, var(--gsg-amber-100) 0%, #FDDCBC 100%); }

.category-browse-card--navy {
	background: linear-gradient(135deg, #EFF6FF 0%, #E0E7FF 100%);
	border-color: #C7D2FE;
	color: #1E3A8A;
}
.category-browse-card--navy:hover { background: linear-gradient(135deg, #E0E7FF 0%, #C7D2FE 100%); }

.category-browse-card--forest {
	background: linear-gradient(135deg, #F0FAF3 0%, #C6EDD1 100%);
	border-color: var(--gsg-green-300);
	color: var(--gsg-green-900);
}
.category-browse-card--forest:hover { background: linear-gradient(135deg, #C6EDD1 0%, var(--gsg-green-200) 100%); }

.category-browse-card--brown {
	background: linear-gradient(135deg, #FAFAF8 0%, #F5EFE5 100%);
	border-color: #E5D9C7;
	color: #78350F;
}
.category-browse-card--brown:hover { background: linear-gradient(135deg, #F5EFE5 0%, #EAD9C2 100%); }

/* ---- Weekend Planning Section ---- */

.weekend-planning-section {
	background: linear-gradient(145deg, var(--gsg-green-900) 0%, var(--gsg-green-800) 55%, var(--gsg-green-700) 100%);
	position: relative;
	overflow: hidden;
}

.weekend-planning-section::before {
	content: '';
	position: absolute;
	inset: 0;
	background-image: radial-gradient(rgba(255,255,255,0.04) 1px, transparent 1px);
	background-size: 28px 28px;
	pointer-events: none;
}

.weekend-planning-inner {
	position: relative;
	z-index: 1;
	display: grid;
	gap: var(--gsg-space-12);
}

@media (min-width: 1024px) {
	.weekend-planning-inner {
		grid-template-columns: 1fr 1.4fr;
		align-items: start;
	}
}

.weekend-planning-content {
	display: flex;
	flex-direction: column;
	gap: var(--gsg-space-5);
}

/* Light variant of section-label for dark backgrounds */
.section-label--light {
	background: rgba(255,255,255,0.1);
	color: var(--gsg-green-200);
	border: 1px solid rgba(255,255,255,0.15);
}

.weekend-planning-title {
	font-size: clamp(1.75rem, 4vw, 2.75rem);
	font-weight: 900;
	color: #FFFFFF;
	letter-spacing: -0.03em;
	line-height: 1.15;
}

.weekend-planning-subtitle {
	font-size: var(--gsg-text-base);
	color: var(--gsg-green-200);
	line-height: 1.7;
}

.weekend-planning-features {
	display: flex;
	flex-direction: column;
	gap: var(--gsg-space-3);
	list-style: none;
	padding: 0;
}

.weekend-feature {
	display: flex;
	align-items: center;
	gap: var(--gsg-space-3);
	color: var(--gsg-green-100);
	font-size: var(--gsg-text-sm);
	font-weight: 500;
}

.weekend-feature__icon {
	font-size: 1.25rem;
	flex-shrink: 0;
	line-height: 1;
}

/* Itinerary Cards */
.weekend-itineraries {
	display: grid;
	gap: var(--gsg-space-4);
}

@media (min-width: 640px) and (max-width: 1023px) {
	.weekend-itineraries { grid-template-columns: repeat(3, 1fr); }
}

.itinerary-card {
	background: rgba(255,255,255,0.07);
	border: 1px solid rgba(255,255,255,0.12);
	backdrop-filter: blur(8px);
	border-radius: var(--gsg-radius-xl);
	padding: var(--gsg-space-5);
	display: flex;
	flex-direction: column;
	gap: var(--gsg-space-3);
	transition: background-color var(--gsg-transition-fast), transform var(--gsg-transition-fast);
}

.itinerary-card:hover {
	background: rgba(255,255,255,0.11);
	transform: translateY(-2px);
}

.itinerary-card__header {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: var(--gsg-space-3);
}

.itinerary-card__title-row {
	display: flex;
	align-items: center;
	gap: var(--gsg-space-2);
}

.itinerary-card__emoji {
	font-size: 1.5rem;
	line-height: 1;
	flex-shrink: 0;
}

.itinerary-card__title {
	font-size: var(--gsg-text-base);
	font-weight: 700;
	color: #FFFFFF;
	line-height: 1.3;
	letter-spacing: -0.02em;
}

.itinerary-card__tag {
	flex-shrink: 0;
	display: inline-block;
	padding: var(--gsg-space-1) var(--gsg-space-3);
	border-radius: var(--gsg-radius-pill);
	font-size: var(--gsg-text-xs);
	font-weight: 600;
	white-space: nowrap;
}

.itinerary-card__tag--blue   { background: rgba(59,130,246,0.25); color: #93C5FD; }
.itinerary-card__tag--green  { background: rgba(74,197,114,0.25); color: var(--gsg-green-300); }
.itinerary-card__tag--amber  { background: rgba(224,123,57,0.25); color: var(--gsg-amber-400); }

.itinerary-card__duration {
	font-size: var(--gsg-text-xs);
	color: var(--gsg-green-300);
	font-weight: 600;
}

.itinerary-card__stops {
	list-style: none;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: var(--gsg-space-2);
	flex: 1;
}

.itinerary-card__stops li {
	display: flex;
	align-items: baseline;
	gap: var(--gsg-space-2);
	font-size: var(--gsg-text-sm);
	color: rgba(255,255,255,0.75);
	line-height: 1.5;
}

.itinerary-card__stops li::before {
	content: '→';
	color: var(--gsg-green-400);
	font-size: var(--gsg-text-xs);
	flex-shrink: 0;
	font-weight: 700;
}

.itinerary-card__link {
	display: inline-flex;
	align-items: center;
	gap: var(--gsg-space-1);
	font-size: var(--gsg-text-sm);
	font-weight: 600;
	color: var(--gsg-green-300);
	padding-top: var(--gsg-space-3);
	border-top: 1px solid rgba(255,255,255,0.1);
	transition: color var(--gsg-transition-fast), gap var(--gsg-transition-fast);
}

.itinerary-card__link:hover {
	color: #FFFFFF;
	gap: var(--gsg-space-2);
}

/* ---- Email Signup Section ---- */

.email-signup-section {
	background: var(--gsg-amber-50);
	border-top: 1px solid var(--gsg-amber-100);
	border-bottom: 1px solid var(--gsg-amber-100);
}

.email-signup-inner {
	display: grid;
	gap: var(--gsg-space-8);
	align-items: center;
}

@media (min-width: 768px) {
	.email-signup-inner {
		grid-template-columns: 1fr 1fr;
		gap: var(--gsg-space-12);
	}
}

.email-signup-content {
	display: flex;
	flex-direction: column;
	gap: var(--gsg-space-3);
}

.email-signup__icon {
	font-size: 2.5rem;
	line-height: 1;
	display: block;
}

.email-signup__title {
	font-size: clamp(1.5rem, 3vw, 2rem);
	font-weight: 800;
	color: var(--gsg-text-primary);
	letter-spacing: -0.03em;
	line-height: 1.2;
}

.email-signup__subtitle {
	font-size: var(--gsg-text-base);
	color: var(--gsg-text-secondary);
	line-height: 1.65;
}

.email-signup-form {
	display: flex;
	flex-direction: column;
	gap: var(--gsg-space-3);
}

.email-signup-form__row {
	display: flex;
	gap: var(--gsg-space-2);
}

.email-signup-form__input {
	flex: 1;
	height: 52px;
	padding: 0 var(--gsg-space-4);
	background: #FFFFFF;
	border: 2px solid var(--gsg-border-mid);
	border-radius: var(--gsg-radius-md);
	font-family: inherit;
	font-size: var(--gsg-text-base);
	color: var(--gsg-text-primary);
	transition: border-color var(--gsg-transition-fast);
	min-width: 0;
}

.email-signup-form__input::placeholder {
	color: var(--gsg-text-muted);
}

.email-signup-form__input:focus {
	outline: none;
	border-color: var(--gsg-green-500);
	box-shadow: 0 0 0 3px var(--gsg-green-100);
}

.email-signup-form .gsg-btn {
	flex-shrink: 0;
	height: 52px;
	border-radius: var(--gsg-radius-md);
}

.email-signup-form__fine {
	font-size: var(--gsg-text-xs);
	color: var(--gsg-text-muted);
	margin-bottom: 0;
}
.email-signup-form__status {
	font-size: var(--gsg-text-sm);
	font-weight: 600;
	margin: 0.5rem 0 0;
	min-height: 1.4em;
}
.email-signup-form__status--success { color: #1a6335; }
.email-signup-form__status--error   { color: #c0392b; }

/* Honeypot — off-screen, invisible to humans, visible to bots */
.gsg-hp-field {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
	opacity: 0;
}

@media (max-width: 400px) {
	.email-signup-form__row { flex-direction: column; }
	.email-signup-form .gsg-btn { height: 48px; width: 100%; }
}

/* ---- Footer SEO Links Bar ---- */

.footer-seo-links {
	background: rgba(255,255,255,0.04);
	border-top: 1px solid rgba(255,255,255,0.08);
	padding-block: var(--gsg-space-10);
}

.footer-seo-links__grid {
	display: grid;
	gap: var(--gsg-space-8);
	grid-template-columns: 1fr;
}

@media (min-width: 480px) {
	.footer-seo-links__grid { grid-template-columns: repeat(2, 1fr); }
}

@media (min-width: 1024px) {
	.footer-seo-links__grid { grid-template-columns: repeat(4, 1fr); }
}

.footer-seo-col__title {
	font-size: var(--gsg-text-xs);
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--gsg-green-600);
	margin-bottom: var(--gsg-space-4);
}

.footer-seo-col ul {
	display: flex;
	flex-direction: column;
	gap: var(--gsg-space-2);
	list-style: none;
}

.footer-seo-col a {
	font-size: var(--gsg-text-sm);
	color: var(--gsg-green-400);
	transition: color var(--gsg-transition-fast);
}

.footer-seo-col a:hover {
	color: #FFFFFF;
}

/* ==========================================================================
   21. Phase 7 — Single Attraction Profile Page
   ========================================================================== */

/* ---- Attraction Hero ---- */

.attraction-hero {
	position: relative;
	min-height: 300px;
	display: flex;
	align-items: flex-end;
	background-color: var(--gsg-green-900);
	overflow: hidden;
}

@media (min-width: 768px) {
	.attraction-hero { min-height: 360px; }
}

.attraction-hero--has-image {
	background-image: var(--hero-image);
	background-size: cover;
	background-position: center;
}

.attraction-hero__backdrop {
	position: absolute;
	inset: 0;
	background: linear-gradient(
		to top,
		rgba(10, 30, 15, 0.92) 0%,
		rgba(10, 30, 15, 0.60) 45%,
		rgba(10, 30, 15, 0.30) 100%
	);
}

.attraction-hero__body {
	position: relative;
	z-index: 1;
	padding-top: var(--gsg-space-4);
	padding-bottom: var(--gsg-space-16);
	text-align: center;
	width: 100%;
}

.attraction-hero__badges {
	display: flex;
	flex-wrap: wrap;
	gap: var(--gsg-space-2);
	justify-content: center;
	margin-bottom: var(--gsg-space-5);
}

.attraction-hero__badge {
	display: inline-flex;
	align-items: center;
	gap: var(--gsg-space-1);
	padding: var(--gsg-space-1) var(--gsg-space-3);
	font-size: var(--gsg-text-xs);
	font-weight: 600;
	border-radius: var(--gsg-radius-pill);
	line-height: 1;
	text-decoration: none;
	backdrop-filter: blur(4px);
	background: rgba(255, 255, 255, 0.15);
	border: 1px solid rgba(255, 255, 255, 0.25);
	color: #FFFFFF;
	transition: background-color var(--gsg-transition-fast);
}

.attraction-hero__badge:hover {
	background: rgba(255, 255, 255, 0.25);
	color: #FFFFFF;
}

.attraction-hero__badge--amber {
	background: rgba(224, 123, 57, 0.25);
	border-color: rgba(224, 123, 57, 0.4);
}

.attraction-hero__badge--amber:hover {
	background: rgba(224, 123, 57, 0.4);
}

.attraction-hero__title {
	font-size: clamp(2rem, 5vw, 3.5rem);
	font-weight: 800;
	color: #FFFFFF;
	letter-spacing: -0.03em;
	line-height: 1.1;
	margin-bottom: var(--gsg-space-4);
	text-shadow: 0 2px 24px rgba(0, 0, 0, 0.45);
}

.attraction-hero__location {
	font-size: var(--gsg-text-lg);
	color: var(--gsg-green-300);
	margin-bottom: var(--gsg-space-5);
}

.attraction-hero__tags {
	display: flex;
	flex-wrap: wrap;
	gap: var(--gsg-space-2);
	justify-content: center;
}

.attraction-tag--hero {
	background: rgba(255, 255, 255, 0.12);
	border-color: rgba(255, 255, 255, 0.25);
	color: rgba(255, 255, 255, 0.9);
}


/* ---- Quick Info Bar ---- */

.quick-info-bar {
	background: var(--gsg-surface-raised);
	border-bottom: 2px solid var(--gsg-border-light);
	padding-block: var(--gsg-space-4);
	position: sticky;
	top: var(--gsg-header-height);
	z-index: 10;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

.quick-info-bar__inner {
	display: flex;
	align-items: center;
	gap: var(--gsg-space-6);
	flex-wrap: wrap;
}

.quick-info-bar__item {
	display: flex;
	align-items: center;
	gap: var(--gsg-space-3);
}

.quick-info-bar__item--cta {
	margin-left: auto;
}

.quick-info-bar__cta-group {
	display: flex;
	align-items: center;
	gap: var(--gsg-space-4);
	margin-left: auto;
}

.quick-info-bar__icon {
	font-size: 1.25rem;
	line-height: 1;
	flex-shrink: 0;
}

.quick-info-bar__label {
	display: block;
	font-size: var(--gsg-text-xs);
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--gsg-text-muted);
	line-height: 1;
	margin-bottom: 2px;
}

.quick-info-bar__value {
	display: block;
	font-size: var(--gsg-text-sm);
	font-weight: 600;
	color: var(--gsg-text-primary);
	line-height: 1.2;
}

@media (max-width: 639px) {
	.quick-info-bar__inner {
		gap: var(--gsg-space-4);
		flex-wrap: wrap;
	}
	.quick-info-bar__item--cta {
		margin-left: 0;
		width: 100%;
	}
	.quick-info-bar__item--cta .gsg-btn {
		width: 100%;
		justify-content: center;
	}
	.quick-info-bar__cta-group {
		margin-left: 0;
		width: 100%;
		flex-direction: column;
		gap: var(--gsg-space-2);
	}
	.quick-info-bar__cta-group .gsg-btn {
		width: 100%;
		justify-content: center;
	}
}


/* ---- Attraction Content Sections ---- */

.attraction-section {
	margin-bottom: var(--gsg-space-12);
	padding-bottom: var(--gsg-space-12);
	border-bottom: 1px solid var(--gsg-border-light);
}

.attraction-section:last-of-type {
	border-bottom: none;
	margin-bottom: 0;
	padding-bottom: 0;
}

.attraction-section__heading {
	font-size: clamp(1.25rem, 3vw, 1.75rem);
	font-weight: 700;
	color: var(--gsg-text-primary);
	margin-top: 0;
	margin-bottom: var(--gsg-space-6);
	padding-left: var(--gsg-space-4);
	border-left: 4px solid var(--gsg-amber-500);
	letter-spacing: -0.02em;
}


/* ---- Why Visit Grid ---- */

.why-visit-grid {
	display: grid;
	gap: var(--gsg-space-5);
	grid-template-columns: 1fr;
}

@media (min-width: 580px) {
	.why-visit-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (min-width: 900px) {
	.why-visit-grid { grid-template-columns: repeat(3, 1fr); }
}

.why-visit-card {
	padding: var(--gsg-space-6);
	background: var(--gsg-green-50);
	border: 1px solid var(--gsg-green-200);
	border-radius: var(--gsg-radius-lg);
	display: flex;
	flex-direction: column;
	gap: var(--gsg-space-3);
	transition: box-shadow var(--gsg-transition-fast), transform var(--gsg-transition-fast);
}

.why-visit-card:hover {
	box-shadow: var(--gsg-shadow-card);
	transform: translateY(-2px);
}

.why-visit-card__icon {
	font-size: 2rem;
	line-height: 1;
}

.why-visit-card__heading {
	font-size: var(--gsg-text-base);
	font-weight: 700;
	color: var(--gsg-green-800);
	margin: 0;
}

.why-visit-card__text {
	font-size: var(--gsg-text-sm);
	color: var(--gsg-text-secondary);
	line-height: 1.7;
	margin: 0;
}


/* ---- Gallery: zoom overlay (extends existing .attraction-gallery styles) ---- */

.attraction-gallery__item {
	display: block;
	position: relative;
	border-radius: var(--gsg-radius-md);
	overflow: hidden;
	aspect-ratio: 4/3;
	text-decoration: none;
	cursor: zoom-in;
}

.attraction-gallery__item img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform var(--gsg-transition-base);
	display: block;
}

.attraction-gallery__item:hover img {
	transform: scale(1.05);
}

.attraction-gallery__zoom {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(10, 30, 15, 0.45);
	color: #FFFFFF;
	font-size: 1.5rem;
	opacity: 0;
	transition: opacity var(--gsg-transition-fast);
}

.attraction-gallery__item:hover .attraction-gallery__zoom {
	opacity: 1;
}

/* ---- Image credit / attribution ---- */

.attraction-image-credit {
	margin-top: var(--gsg-space-3);
	color: var(--gsg-color-muted, #6b7280);
	font-size: 0.8125rem;
	font-style: italic;
}

.attraction-image-credit small {
	font-size: inherit;
}


/* ---- Practical Info Grid ---- */

.practical-info-grid {
	display: grid;
	gap: var(--gsg-space-5);
	grid-template-columns: 1fr;
}

@media (min-width: 580px) {
	.practical-info-grid { grid-template-columns: repeat(2, 1fr); }
}

.practical-info-item {
	display: flex;
	gap: var(--gsg-space-4);
	padding: var(--gsg-space-5);
	background: var(--gsg-surface-card);
	border: 1px solid var(--gsg-border-light);
	border-radius: var(--gsg-radius-lg);
	transition: border-color var(--gsg-transition-fast);
}

.practical-info-item:hover {
	border-color: var(--gsg-green-300);
}

.practical-info-item__icon {
	font-size: 1.75rem;
	line-height: 1;
	flex-shrink: 0;
	margin-top: 2px;
}

.practical-info-item__body {
	flex: 1;
	min-width: 0;
}

.practical-info-item__heading {
	font-size: var(--gsg-text-sm);
	font-weight: 700;
	color: var(--gsg-text-primary);
	margin: 0 0 var(--gsg-space-2);
}

.practical-info-item__body p {
	font-size: var(--gsg-text-sm);
	color: var(--gsg-text-secondary);
	line-height: 1.65;
	margin: 0;
}


/* ---- Attraction Callouts (Insider Tip + Coffee Spot) ---- */

.attraction-callout {
	display: flex;
	gap: var(--gsg-space-5);
	padding: var(--gsg-space-6) var(--gsg-space-7);
	border-radius: var(--gsg-radius-lg);
	border-left: 4px solid;
}

.attraction-callout--tip {
	background: var(--gsg-green-50);
	border-color: var(--gsg-green-500);
}

.attraction-callout--coffee {
	background: #FFF7ED;
	border-color: var(--gsg-amber-500);
}

.attraction-callout__icon {
	font-size: 2rem;
	line-height: 1;
	flex-shrink: 0;
	margin-top: 2px;
}

.attraction-callout__body {
	flex: 1;
	min-width: 0;
}

.attraction-callout__heading {
	font-size: var(--gsg-text-base);
	font-weight: 700;
	color: var(--gsg-text-primary);
	margin: 0 0 var(--gsg-space-2);
}

.attraction-callout__body p {
	font-size: var(--gsg-text-sm);
	color: var(--gsg-text-secondary);
	line-height: 1.65;
	margin: 0;
}


/* ---- Directions Block ---- */

.directions-block {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--gsg-space-4);
	margin-top: var(--gsg-space-5);
	padding: var(--gsg-space-4) var(--gsg-space-5);
	background: var(--gsg-surface-raised);
	border: 1px solid var(--gsg-border-light);
	border-radius: var(--gsg-radius-lg);
	flex-wrap: wrap;
}

.directions-block__address {
	display: flex;
	align-items: center;
	gap: var(--gsg-space-3);
}

.directions-block__icon {
	font-size: 1.25rem;
	flex-shrink: 0;
}

.directions-block__address address {
	font-style: normal;
	font-size: var(--gsg-text-sm);
	color: var(--gsg-text-secondary);
	font-weight: 500;
	line-height: 1.5;
}


/* ---- Sidebar Cards ---- */

.sidebar-card {
	background: var(--gsg-surface-card);
	border: 1px solid var(--gsg-border-light);
	border-radius: var(--gsg-radius-lg);
	padding: var(--gsg-space-5) var(--gsg-space-6);
	margin-bottom: var(--gsg-space-4);
}

.sidebar-card:last-child {
	margin-bottom: 0;
}

.sidebar-card--tip {
	background: var(--gsg-green-50);
	border-color: var(--gsg-green-200);
}

.sidebar-card--coffee {
	background: #FFF7ED;
	border-color: var(--gsg-amber-100);
}

.sidebar-card__heading {
	font-size: var(--gsg-text-sm);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--gsg-green-800);
	margin: 0 0 var(--gsg-space-4);
}

.sidebar-card__icon-row {
	display: flex;
	align-items: center;
	gap: var(--gsg-space-2);
	margin-bottom: var(--gsg-space-3);
}

.sidebar-card__icon-row .sidebar-card__heading {
	margin: 0;
}

.sidebar-card__icon-row span {
	font-size: 1.25rem;
	line-height: 1;
}

.sidebar-card__text {
	font-size: var(--gsg-text-sm);
	color: var(--gsg-text-secondary);
	line-height: 1.65;
	margin: 0;
}

.sidebar-card__location {
	font-size: var(--gsg-text-sm);
	color: var(--gsg-text-secondary);
	margin: 0 0 var(--gsg-space-4);
}

.sidebar-card__actions {
	margin-top: var(--gsg-space-4);
	padding-top: var(--gsg-space-4);
	border-top: 1px solid var(--gsg-border-light);
	display: flex;
	flex-direction: column;
	gap: var(--gsg-space-3);
}

.sidebar-card__btn {
	width: 100%;
	justify-content: center;
}


/* ---- Sidebar Facts (dl) ---- */

.sidebar-facts {
	display: flex;
	flex-direction: column;
	gap: var(--gsg-space-4);
}

.sidebar-facts__item {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.sidebar-facts__label {
	display: flex;
	align-items: center;
	gap: var(--gsg-space-2);
	font-size: var(--gsg-text-xs);
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--gsg-text-muted);
	font-weight: 600;
}

.sidebar-facts__value {
	font-size: var(--gsg-text-sm);
	color: var(--gsg-text-primary);
	font-weight: 600;
	padding-left: calc(1rem + var(--gsg-space-2)); /* indent under icon */
}


/* ---- Sidebar Good For Tags ---- */

.sidebar-tags {
	display: flex;
	flex-wrap: wrap;
	gap: var(--gsg-space-2);
}

.sidebar-tag {
	display: inline-flex;
	align-items: center;
	gap: var(--gsg-space-1);
	padding: var(--gsg-space-1) var(--gsg-space-3);
	background: var(--gsg-green-100);
	color: var(--gsg-green-800);
	font-size: var(--gsg-text-xs);
	font-weight: 600;
	border-radius: var(--gsg-radius-pill);
	border: 1px solid var(--gsg-green-200);
}


/* ---- Sidebar Explore Links ---- */

.sidebar-explore {
	display: flex;
	flex-direction: column;
	gap: var(--gsg-space-2);
	list-style: none;
}

.sidebar-explore__link {
	display: block;
	font-size: var(--gsg-text-sm);
	color: var(--gsg-green-700);
	padding: var(--gsg-space-2) 0;
	border-bottom: 1px solid var(--gsg-border-light);
	transition: color var(--gsg-transition-fast), padding-left var(--gsg-transition-fast);
}

.sidebar-explore li:last-child .sidebar-explore__link {
	border-bottom: none;
}

.sidebar-explore__link:hover {
	color: var(--gsg-green-600);
	padding-left: var(--gsg-space-2);
}


/* ---- Lightbox ---- */

.gsg-lightbox {
	display: none;
	position: fixed;
	inset: 0;
	background: rgba(0, 0, 0, 0.92);
	z-index: 9999;
	align-items: center;
	justify-content: center;
	padding: var(--gsg-space-8);
}

.gsg-lightbox.is-open {
	display: flex;
}

.gsg-lightbox__image {
	max-width: 100%;
	max-height: 90vh;
	object-fit: contain;
	border-radius: var(--gsg-radius-md);
	box-shadow: 0 20px 60px rgba(0, 0, 0, 0.6);
	display: block;
}

.gsg-lightbox__close {
	position: absolute;
	top: var(--gsg-space-6);
	right: var(--gsg-space-6);
	width: 44px;
	height: 44px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(255, 255, 255, 0.1);
	border-radius: 50%;
	color: #FFFFFF;
	font-size: 1.5rem;
	cursor: pointer;
	border: 1px solid rgba(255, 255, 255, 0.15);
	transition: background-color var(--gsg-transition-fast);
	line-height: 1;
}

.gsg-lightbox__close:hover {
	background: rgba(255, 255, 255, 0.22);
}

.gsg-lightbox__nav {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 48px;
	height: 48px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(255, 255, 255, 0.1);
	border-radius: 50%;
	color: #FFFFFF;
	font-size: 1.75rem;
	cursor: pointer;
	border: 1px solid rgba(255, 255, 255, 0.15);
	transition: background-color var(--gsg-transition-fast);
	line-height: 1;
}

.gsg-lightbox__nav:hover {
	background: rgba(255, 255, 255, 0.22);
}

.gsg-lightbox__prev { left: var(--gsg-space-6); }
.gsg-lightbox__next { right: var(--gsg-space-6); }

.gsg-lightbox__counter {
	position: absolute;
	bottom: var(--gsg-space-6);
	left: 50%;
	transform: translateX(-50%);
	font-size: var(--gsg-text-sm);
	color: rgba(255, 255, 255, 0.6);
	font-weight: 500;
	white-space: nowrap;
}


/* ==========================================================================
   22. Phase 8 — Internal Linking Engine
   ========================================================================== */

/* ---- Region Category Browse Grid (region taxonomy page) ---- */

/* Re-uses .category-browse-card + color variants from Phase 5.
   The .gsg-grid--4 grid and .city-links-grid / .city-link-chip
   are already defined in earlier sections and need no duplication. */

/* Responsive tweak: on mobile the 4-column category grid drops to 2 */
@media ( max-width: 640px ) {
	.gsg-grid--4 .category-browse-card {
		min-height: 100px;
	}
}

/* ---- Related Attractions Section (single attraction page) ---- */

.related-attractions-section {
	border-top: 2px solid var(--gsg-border-light);
	margin-top: var(--gsg-space-12);
	padding-top: var(--gsg-space-10);
}


/* ==========================================================================
   23. Phase 10 — Plan My NJ Weekend Tool
   ========================================================================== */

/* ── Planner Hero ─────────────────────────────────────────────────────────── */

.planner-hero {
	position: relative;
	background: var(--gsg-green-800);
	color: var(--gsg-text-inverse);
	padding: var(--gsg-space-20) 0 var(--gsg-space-16);
	overflow: hidden;
}

.planner-hero__bg {
	position: absolute;
	inset: 0;
	pointer-events: none;
}

.planner-hero__bg-shape {
	position: absolute;
	border-radius: 50%;
	opacity: 0.06;
	background: #FFFFFF;
}

.planner-hero__bg-shape--1 {
	width: 600px;
	height: 600px;
	top: -200px;
	right: -100px;
}

.planner-hero__bg-shape--2 {
	width: 400px;
	height: 400px;
	bottom: -150px;
	left: -80px;
}

.planner-hero__inner {
	position: relative;
	max-width: 680px;
	text-align: center;
	margin: 0 auto;
}

.planner-hero__eyebrow {
	font-size: var(--gsg-text-sm);
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--gsg-green-300);
	margin-bottom: var(--gsg-space-4);
}

.planner-hero__title {
	font-size: clamp(2rem, 5vw, 3.25rem);
	font-weight: 800;
	color: #FFFFFF;
	line-height: 1.1;
	margin-bottom: var(--gsg-space-5);
}

.planner-hero__title em {
	font-style: normal;
	color: var(--gsg-amber-400);
}

.planner-hero__subtitle {
	font-size: var(--gsg-text-lg);
	color: rgba(255, 255, 255, 0.80);
	line-height: 1.6;
	margin-bottom: var(--gsg-space-6);
}

.planner-hero__stats {
	display: flex;
	flex-wrap: wrap;
	gap: var(--gsg-space-4) var(--gsg-space-6);
	justify-content: center;
	font-size: var(--gsg-text-sm);
	color: rgba(255, 255, 255, 0.65);
	margin-bottom: var(--gsg-space-8);
}

/* ── Planner Form ─────────────────────────────────────────────────────────── */

.planner-form {
	max-width: 860px;
	margin: 0 auto;
}

.planner-form__step {
	background: var(--gsg-surface-card);
	border: 1px solid var(--gsg-border-light);
	border-radius: var(--gsg-radius-lg);
	padding: var(--gsg-space-8);
	margin-bottom: var(--gsg-space-6);
	box-shadow: var(--gsg-shadow-sm);
}

.planner-form__step-legend {
	display: flex;
	align-items: center;
	gap: var(--gsg-space-3);
	font-size: var(--gsg-text-lg);
	font-weight: 700;
	color: var(--gsg-text-primary);
	margin-bottom: var(--gsg-space-6);
	width: 100%;
}

.planner-form__step-num {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	background: var(--gsg-green-700);
	color: #FFFFFF;
	border-radius: 50%;
	font-size: var(--gsg-text-sm);
	font-weight: 700;
	flex-shrink: 0;
}

.planner-form__step-hint {
	font-weight: 400;
	font-size: var(--gsg-text-sm);
	color: var(--gsg-text-muted);
	margin-left: var(--gsg-space-1);
}

/* ── Region Grid ──────────────────────────────────────────────────────────── */

.planner-region-grid {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: var(--gsg-space-3);
}

@media ( max-width: 768px ) {
	.planner-region-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

/* ── Shared: visually-hidden inputs with styled labels ─────────────────────── */

.planner-radio-wrap,
.planner-check-wrap {
	position: relative;
}

.planner-radio-wrap input[type="radio"],
.planner-check-wrap input[type="checkbox"] {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* ==========================================================================
   Community Submission Modal
   ========================================================================== */

.suggest-modal {
	display: none;
	position: fixed;
	inset: 0;
	z-index: 1200;
	align-items: center;
	justify-content: center;
	padding: var(--gsg-space-6);
}

.suggest-modal.is-open {
	display: flex;
}

.suggest-modal__overlay {
	position: absolute;
	inset: 0;
	background: rgba( 0, 0, 0, 0.55 );
	backdrop-filter: blur( 3px );
}

.suggest-modal__content {
	position: relative;
	background: var(--gsg-surface-card, #fff);
	border-radius: 12px;
	max-width: 560px;
	width: 100%;
	max-height: 90vh;
	overflow-y: auto;
	box-shadow: 0 24px 64px rgba( 0, 0, 0, 0.35 );
	animation: suggestSlideUp 0.28s cubic-bezier( 0.25, 0.8, 0.25, 1 ) both;
}

@keyframes suggestSlideUp {
	from { opacity: 0; transform: translateY( 24px ); }
	to   { opacity: 1; transform: translateY( 0 ); }
}

.suggest-modal__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: var(--gsg-space-5) var(--gsg-space-6);
	background: var(--gsg-green-800, #1E4D35);
	border-radius: 12px 12px 0 0;
	flex-shrink: 0;
}

.suggest-modal__title {
	margin: 0;
	font-size: 1.15rem;
	font-weight: 700;
	color: #fff;
}

.suggest-modal__close {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	background: rgba( 255, 255, 255, 0.12 );
	border: 1px solid rgba( 255, 255, 255, 0.2 );
	border-radius: 50%;
	color: #fff;
	font-size: 1rem;
	cursor: pointer;
	transition: background 0.18s ease;
	line-height: 1;
}

.suggest-modal__close:hover {
	background: rgba( 255, 255, 255, 0.22 );
}

.suggest-modal__notice {
	margin: 0;
	padding: var(--gsg-space-3) var(--gsg-space-6);
	font-size: 0.8rem;
	color: var(--gsg-text-muted, #8A9BAB);
	background: var(--gsg-surface-page, #FAFAF8);
	border-bottom: 1px solid var(--gsg-border-light, #e8e8e8);
}

/* ── Tabs ─────────────────────────────────────────────────────────────────── */

.suggest-modal__tabs {
	display: flex;
	border-bottom: 2px solid var(--gsg-border-light, #e8e8e8);
	background: var(--gsg-surface-page, #FAFAF8);
}

.suggest-modal__tab {
	flex: 1;
	padding: var(--gsg-space-3) var(--gsg-space-4);
	background: transparent;
	border: none;
	border-bottom: 3px solid transparent;
	margin-bottom: -2px;
	font-size: 0.9rem;
	font-weight: 600;
	color: var(--gsg-text-secondary, #4A5568);
	cursor: pointer;
	transition: color 0.18s ease, border-color 0.18s ease;
}

.suggest-modal__tab:hover {
	color: var(--gsg-green-700, #2D6A4F);
}

.suggest-modal__tab.is-active {
	color: var(--gsg-green-800, #1E4D35);
	border-bottom-color: var(--gsg-green-800, #1E4D35);
}

/* ── Success state ────────────────────────────────────────────────────────── */

.suggest-modal__success {
	text-align: center;
	padding: var(--gsg-space-10) var(--gsg-space-6);
}

.suggest-modal__success-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 64px;
	height: 64px;
	background: var(--gsg-green-100, #d1fae5);
	color: var(--gsg-green-700, #2D6A4F);
	border-radius: 50%;
	font-size: 2rem;
	margin-bottom: var(--gsg-space-4);
}

.suggest-modal__success h3 {
	margin: 0 0 var(--gsg-space-2);
	font-size: 1.2rem;
	color: var(--gsg-green-800, #1E4D35);
}

.suggest-modal__success p {
	margin: 0;
	color: var(--gsg-text-secondary, #4A5568);
	font-size: 0.9rem;
}

/* ── Panel / Form ─────────────────────────────────────────────────────────── */

.suggest-modal__panel {
	padding: var(--gsg-space-5) var(--gsg-space-6) var(--gsg-space-6);
}

.suggest-form__group {
	margin-bottom: var(--gsg-space-4);
}

.suggest-form__row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--gsg-space-4);
}

.suggest-form__label {
	display: block;
	font-size: 0.82rem;
	font-weight: 600;
	color: var(--gsg-text-primary, #12263A);
	margin-bottom: var(--gsg-space-1);
	letter-spacing: 0.2px;
}

.suggest-form__req {
	color: var(--gsg-amber-500, #E07B39);
}

.suggest-form__opt {
	color: var(--gsg-text-muted, #8A9BAB);
	font-weight: 400;
}

.suggest-form__input,
.suggest-form__select,
.suggest-form__textarea {
	width: 100%;
	padding: 9px 12px;
	border: 2px solid var(--gsg-border-light, #e0e0e0);
	border-radius: 8px;
	font-family: inherit;
	font-size: 0.9rem;
	color: var(--gsg-text-primary, #12263A);
	background: #fff;
	transition: border-color 0.18s ease, box-shadow 0.18s ease;
	box-sizing: border-box;
}

.suggest-form__input:focus,
.suggest-form__select:focus,
.suggest-form__textarea:focus {
	outline: none;
	border-color: var(--gsg-green-600, #3A7D5C);
	box-shadow: 0 0 0 3px rgba( 30, 77, 53, 0.12 );
}

.suggest-form__textarea {
	resize: vertical;
	min-height: 80px;
}

.suggest-form__error {
	color: #c62828;
	font-size: 0.85rem;
	min-height: 1.2em;
	margin: var(--gsg-space-2) 0 0;
}

.suggest-form__actions {
	margin-top: var(--gsg-space-5);
	display: flex;
	justify-content: flex-end;
}

/* Footer suggest-a-place trigger (looks like a text link) */
.site-footer__suggest-link {
	background: none;
	border: none;
	color: inherit;
	font: inherit;
	font-size: inherit;
	cursor: pointer;
	padding: 0;
	text-decoration: underline;
	opacity: 0.8;
	transition: opacity 0.18s ease;
}

.site-footer__suggest-link:hover {
	opacity: 1;
}

/* Honeypot — visually hidden from real users, still in DOM */
.suggest-form__honeypot {
	position: absolute;
	left: -9999px;
	top: auto;
	width: 1px;
	height: 1px;
	overflow: hidden;
	opacity: 0;
	pointer-events: none;
	tab-index: -1;
}

/* ── Responsive ───────────────────────────────────────────────────────────── */

@media ( max-width: 600px ) {
	.suggest-modal {
		align-items: flex-end;
		padding: 0;
	}

	.suggest-modal__content {
		max-width: 100%;
		border-radius: 16px 16px 0 0;
		max-height: 92vh;
		animation-name: suggestSlideUpMobile;
	}

	@keyframes suggestSlideUpMobile {
		from { transform: translateY( 100% ); }
		to   { transform: translateY( 0 ); }
	}

	.suggest-form__row {
		grid-template-columns: 1fr;
	}

	.suggest-modal__panel {
		padding: var(--gsg-space-4) var(--gsg-space-4) var(--gsg-space-6);
	}
}

.planner-radio-wrap input[type="radio"]:focus-visible + label,
.planner-check-wrap input[type="checkbox"]:focus-visible + label {
	outline: 2px solid var(--gsg-green-500);
	outline-offset: 2px;
}

/* ── Region Cards ─────────────────────────────────────────────────────────── */

.planner-region-card {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	padding: var(--gsg-space-5) var(--gsg-space-3);
	border: 2px solid var(--gsg-border-light);
	border-radius: var(--gsg-radius-lg);
	cursor: pointer;
	transition: border-color var(--gsg-transition-fast), background-color var(--gsg-transition-fast), transform var(--gsg-transition-fast);
	background: var(--gsg-surface-page);
	min-height: 120px;
	justify-content: center;
	gap: var(--gsg-space-2);
}

.planner-region-card:hover {
	border-color: var(--gsg-green-500);
	background: var(--gsg-green-50);
	transform: translateY(-2px);
}

.planner-radio-wrap input[type="radio"]:checked + .planner-region-card {
	border-color: var(--gsg-green-700);
	background: var(--gsg-green-50);
	box-shadow: 0 0 0 3px rgba(45, 106, 79, 0.15);
}

.planner-region-card__emoji {
	font-size: 1.75rem;
	line-height: 1;
}

.planner-region-card__name {
	font-size: var(--gsg-text-sm);
	font-weight: 700;
	color: var(--gsg-text-primary);
	line-height: 1.2;
}

.planner-region-card__desc {
	font-size: var(--gsg-text-xs);
	color: var(--gsg-text-muted);
	line-height: 1.3;
}

.planner-region-card--any {
	border-style: dashed;
}

/* ── Interest Tag Grid ────────────────────────────────────────────────────── */

.planner-interest-grid {
	display: flex;
	flex-wrap: wrap;
	gap: var(--gsg-space-3);
}

.planner-interest-tag {
	display: inline-flex;
	align-items: center;
	gap: var(--gsg-space-2);
	padding: var(--gsg-space-2) var(--gsg-space-4);
	border: 2px solid var(--gsg-border-mid);
	border-radius: var(--gsg-radius-pill);
	font-size: var(--gsg-text-sm);
	font-weight: 600;
	color: var(--gsg-text-secondary);
	cursor: pointer;
	background: var(--gsg-surface-page);
	transition: border-color var(--gsg-transition-fast), background var(--gsg-transition-fast), color var(--gsg-transition-fast);
	user-select: none;
}

.planner-interest-tag:hover {
	border-color: var(--gsg-green-500);
	background: var(--gsg-green-50);
	color: var(--gsg-green-700);
}

.planner-check-wrap input[type="checkbox"]:checked + .planner-interest-tag {
	border-color: var(--gsg-green-700);
	background: var(--gsg-green-700);
	color: #FFFFFF;
}

/* ── Group Grid ───────────────────────────────────────────────────────────── */

.planner-group-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: var(--gsg-space-3);
}

@media ( max-width: 640px ) {
	.planner-group-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

.planner-group-card {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: var(--gsg-space-2);
	padding: var(--gsg-space-5) var(--gsg-space-3);
	border: 2px solid var(--gsg-border-light);
	border-radius: var(--gsg-radius-lg);
	cursor: pointer;
	text-align: center;
	background: var(--gsg-surface-page);
	transition: border-color var(--gsg-transition-fast), background var(--gsg-transition-fast), transform var(--gsg-transition-fast);
	min-height: 100px;
}

.planner-group-card:hover {
	border-color: var(--gsg-green-500);
	background: var(--gsg-green-50);
	transform: translateY(-2px);
}

.planner-radio-wrap input[type="radio"]:checked + .planner-group-card {
	border-color: var(--gsg-green-700);
	background: var(--gsg-green-50);
	box-shadow: 0 0 0 3px rgba(45, 106, 79, 0.15);
}

.planner-group-card__emoji {
	font-size: 1.75rem;
	line-height: 1;
}

.planner-group-card strong {
	font-size: var(--gsg-text-sm);
	color: var(--gsg-text-primary);
}

/* ── Duration Row ─────────────────────────────────────────────────────────── */

.planner-duration-row {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--gsg-space-3);
}

@media ( max-width: 480px ) {
	.planner-duration-row {
		grid-template-columns: 1fr;
	}
}

.planner-duration-card {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: var(--gsg-space-6) var(--gsg-space-4);
	border: 2px solid var(--gsg-border-light);
	border-radius: var(--gsg-radius-lg);
	cursor: pointer;
	text-align: center;
	background: var(--gsg-surface-page);
	transition: border-color var(--gsg-transition-fast), background var(--gsg-transition-fast);
	gap: var(--gsg-space-1);
}

.planner-duration-card:hover {
	border-color: var(--gsg-green-500);
	background: var(--gsg-green-50);
}

.planner-radio-wrap input[type="radio"]:checked + .planner-duration-card {
	border-color: var(--gsg-amber-500);
	background: var(--gsg-amber-50);
	box-shadow: 0 0 0 3px rgba(224, 123, 57, 0.15);
}

.planner-duration-card__label {
	font-size: var(--gsg-text-lg);
	font-weight: 700;
	color: var(--gsg-text-primary);
}

.planner-duration-card__desc {
	font-size: var(--gsg-text-xs);
	color: var(--gsg-text-muted);
}

/* ── Submit ───────────────────────────────────────────────────────────────── */

.planner-form__submit {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--gsg-space-5);
	padding-top: var(--gsg-space-4);
	flex-wrap: wrap;
}

.planner-form__btn {
	padding: var(--gsg-space-4) var(--gsg-space-10);
	font-size: var(--gsg-text-lg);
}

.planner-form__reset {
	font-size: var(--gsg-text-sm);
	color: var(--gsg-text-muted);
	text-decoration: none;
	transition: color var(--gsg-transition-fast);
}

.planner-form__reset:hover {
	color: var(--gsg-text-secondary);
}

/* ── Results Section ──────────────────────────────────────────────────────── */

.planner-results {
	background: var(--gsg-green-50);
	padding: var(--gsg-space-16) 0;
}

.planner-results__header {
	text-align: center;
	margin-bottom: var(--gsg-space-10);
}

.planner-layout {
	display: grid;
	grid-template-columns: 1fr 360px;
	gap: var(--gsg-space-8);
	align-items: start;
}

@media ( max-width: 960px ) {
	.planner-layout {
		grid-template-columns: 1fr;
	}
}

/* ── Itinerary Timeline ───────────────────────────────────────────────────── */

.planner-itinerary {
	display: flex;
	flex-direction: column;
}

.itinerary-stop {
	display: grid;
	grid-template-columns: 56px 1fr;
	gap: var(--gsg-space-5);
	align-items: start;
}

.itinerary-stop__marker {
	display: flex;
	justify-content: center;
	padding-top: var(--gsg-space-5);
}

.itinerary-stop__num {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	background: var(--gsg-amber-500);
	color: #FFFFFF;
	border-radius: 50%;
	font-size: var(--gsg-text-xl);
	font-weight: 800;
	flex-shrink: 0;
	box-shadow: 0 3px 10px rgba(224, 123, 57, 0.35);
}

.itinerary-stop__body {
	background: var(--gsg-surface-card);
	border: 1px solid var(--gsg-border-light);
	border-radius: var(--gsg-radius-lg);
	padding: var(--gsg-space-6);
	box-shadow: var(--gsg-shadow-sm);
}

.itinerary-stop__time {
	font-size: var(--gsg-text-xs);
	font-weight: 700;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: var(--gsg-green-600);
	margin-bottom: var(--gsg-space-3);
}

.itinerary-stop__image {
	border-radius: var(--gsg-radius-md);
	overflow: hidden;
	margin-bottom: var(--gsg-space-4);
	aspect-ratio: 16 / 7;
}

.itinerary-stop__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.itinerary-stop__title {
	font-size: var(--gsg-text-xl);
	font-weight: 700;
	margin-bottom: var(--gsg-space-3);
	line-height: 1.25;
}

.itinerary-stop__title a {
	color: var(--gsg-text-primary);
}

.itinerary-stop__title a:hover {
	color: var(--gsg-green-700);
}

.itinerary-stop__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--gsg-space-2);
	margin-bottom: var(--gsg-space-4);
}

.itinerary-stop__location,
.itinerary-stop__duration {
	font-size: var(--gsg-text-sm);
	color: var(--gsg-text-secondary);
}

.itinerary-stop__excerpt {
	font-size: var(--gsg-text-base);
	color: var(--gsg-text-secondary);
	line-height: 1.6;
	margin-bottom: var(--gsg-space-4);
}

.itinerary-stop__tip {
	display: flex;
	align-items: flex-start;
	gap: var(--gsg-space-2);
	background: var(--gsg-green-50);
	border-left: 3px solid var(--gsg-green-500);
	padding: var(--gsg-space-3) var(--gsg-space-4);
	border-radius: 0 var(--gsg-radius-sm) var(--gsg-radius-sm) 0;
	margin-bottom: var(--gsg-space-4);
	font-size: var(--gsg-text-sm);
	color: var(--gsg-text-secondary);
}

.itinerary-connector {
	display: grid;
	grid-template-columns: 56px 1fr;
	margin: var(--gsg-space-3) 0;
	align-items: center;
}

.itinerary-connector__icon {
	grid-column: 1;
	text-align: center;
	font-size: var(--gsg-text-lg);
	color: var(--gsg-text-muted);
	display: flex;
	justify-content: center;
}

.itinerary-connector__line {
	display: none;
}

/* ── Map Panel ────────────────────────────────────────────────────────────── */

.planner-map-panel {
	position: sticky;
	top: calc( var(--gsg-header-height) + var(--gsg-space-6) );
	background: var(--gsg-surface-card);
	border: 1px solid var(--gsg-border-light);
	border-radius: var(--gsg-radius-lg);
	padding: var(--gsg-space-5);
	box-shadow: var(--gsg-shadow-md);
}

.planner-map-panel__heading {
	font-size: var(--gsg-text-base);
	font-weight: 700;
	color: var(--gsg-text-primary);
	margin-bottom: var(--gsg-space-4);
}

.planner-map-panel .map-container {
	border-radius: var(--gsg-radius-md);
	overflow: hidden;
}

.planner-map-panel .leaflet-map {
	height: 380px;
}

.planner-map-panel__note {
	font-size: var(--gsg-text-xs);
	color: var(--gsg-text-muted);
	margin-top: var(--gsg-space-3);
	margin-bottom: 0;
}

/* ── Share Bar ────────────────────────────────────────────────────────────── */

.planner-share {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--gsg-space-3);
	flex-wrap: wrap;
	margin-top: var(--gsg-space-10);
	padding-top: var(--gsg-space-8);
	border-top: 1px solid var(--gsg-border-mid);
}

.planner-share__label {
	font-size: var(--gsg-text-sm);
	color: var(--gsg-text-muted);
	font-weight: 600;
}

/* ── Pre-built Weekend Guide Cards ───────────────────────────────────────── */

.weekend-guide-card {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	border-radius: var(--gsg-radius-lg);
	padding: var(--gsg-space-6);
	gap: var(--gsg-space-3);
	border: 1px solid transparent;
	transition: transform var(--gsg-transition-fast), box-shadow var(--gsg-transition-fast);
}

.weekend-guide-card:hover {
	transform: translateY(-3px);
	box-shadow: var(--gsg-shadow-lg);
}

.weekend-guide-card--blue   { background: linear-gradient(135deg, #EEF6FF 0%, #DBEAFE 100%); border-color: #BFDBFE; }
.weekend-guide-card--green  { background: linear-gradient(135deg, var(--gsg-green-50) 0%, var(--gsg-green-100) 100%); border-color: var(--gsg-green-200); }
.weekend-guide-card--amber  { background: linear-gradient(135deg, var(--gsg-amber-50) 0%, var(--gsg-amber-100) 100%); border-color: #FDE68A; }
.weekend-guide-card--forest { background: linear-gradient(135deg, #F0FDF4 0%, #DCFCE7 100%); border-color: #BBF7D0; }

.weekend-guide-card__emoji {
	font-size: 2.5rem;
	line-height: 1;
}

.weekend-guide-card__title {
	font-size: var(--gsg-text-lg);
	font-weight: 700;
	color: var(--gsg-text-primary);
	line-height: 1.2;
	margin: 0;
}

.weekend-guide-card__tagline {
	font-size: var(--gsg-text-sm);
	color: var(--gsg-text-secondary);
	line-height: 1.5;
	margin: 0;
	flex-grow: 1;
}

.weekend-guide-card__tags {
	display: flex;
	flex-wrap: wrap;
	gap: var(--gsg-space-2);
}

.weekend-guide-card__tag {
	font-size: var(--gsg-text-xs);
	font-weight: 600;
	color: var(--gsg-text-secondary);
	background: rgba(0, 0, 0, 0.07);
	padding: 2px var(--gsg-space-2);
	border-radius: var(--gsg-radius-pill);
}

.weekend-guide-card__cta {
	align-self: flex-start;
	margin-top: auto;
}

/* ── Explore Section ──────────────────────────────────────────────────────── */

.planner-explore-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--gsg-space-10);
}

@media ( max-width: 640px ) {
	.planner-explore-grid {
		grid-template-columns: 1fr;
	}
}

.planner-explore__heading {
	font-size: var(--gsg-text-xl);
	font-weight: 700;
	color: var(--gsg-text-primary);
	margin-bottom: var(--gsg-space-5);
}

.planner-region-links {
	display: flex;
	flex-direction: column;
	gap: var(--gsg-space-3);
}

.planner-region-link {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: var(--gsg-space-3) var(--gsg-space-4);
	background: var(--gsg-surface-card);
	border: 1px solid var(--gsg-border-light);
	border-radius: var(--gsg-radius-md);
	font-size: var(--gsg-text-sm);
	font-weight: 600;
	color: var(--gsg-text-primary);
	text-decoration: none;
	transition: border-color var(--gsg-transition-fast), background var(--gsg-transition-fast);
}

.planner-region-link:hover {
	border-color: var(--gsg-green-500);
	background: var(--gsg-green-50);
	color: var(--gsg-text-primary);
}

.planner-region-link__count {
	font-size: var(--gsg-text-xs);
	color: var(--gsg-text-muted);
	font-weight: 400;
}

.planner-category-chips {
	display: flex;
	flex-wrap: wrap;
	gap: var(--gsg-space-2);
}

/* ── Print styles ─────────────────────────────────────────────────────────── */

@media print {
	.planner-hero,
	.planner-form,
	.weekend-guide-card,
	.planner-explore-grid,
	.planner-share,
	.site-header,
	.site-footer {
		display: none !important;
	}

	.planner-results {
		background: white;
		padding: 0;
	}

	.planner-layout {
		grid-template-columns: 1fr;
	}

	.planner-map-panel {
		display: none;
	}

	.itinerary-stop__body {
		border: 1px solid #ccc;
		box-shadow: none;
		break-inside: avoid;
	}
}

/* ==========================================================================
   Phase 12.1.10 — Featured & Editor's Pick badges
   ========================================================================== */

/* ── Attraction card — Featured indicator (top-right corner) ──────────────── */
.attraction-card__featured-badge {
	position: absolute;
	top: var(--gsg-space-2);
	right: var(--gsg-space-2);
	background: rgba(30, 77, 53, 0.88);
	backdrop-filter: blur(4px);
	color: #fff;
	font-size: 0.625rem;
	font-weight: 700;
	letter-spacing: 0.07em;
	text-transform: uppercase;
	padding: 3px 8px;
	border-radius: var(--gsg-radius-pill);
	z-index: 3;
	pointer-events: none;
}

/* ── Attraction card — Editor's Pick strip (bottom of image) ──────────────── */
.attraction-card__editors-pick-badge {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	background: linear-gradient(90deg, #E07B39 0%, #c96a2a 100%);
	color: #fff;
	font-size: 0.625rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	text-align: center;
	padding: 5px 0;
	z-index: 3;
	pointer-events: none;
}

/* ── Featured card border accent ─────────────────────────────────────────── */
.attraction-card--featured {
	box-shadow: 0 0 0 2px var(--gsg-green-600, #1E4D35), var(--gsg-shadow-card);
}

.attraction-card--featured:hover {
	box-shadow: 0 0 0 2px var(--gsg-green-600, #1E4D35), var(--gsg-shadow-card-hover);
}

/* ── Attraction profile hero — Editor's Pick badge ───────────────────────── */
.attraction-hero__editors-pick {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	background: #E07B39;
	color: #fff;
	font-size: 0.8125rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	padding: 5px 14px;
	border-radius: var(--gsg-radius-base);
	margin-bottom: var(--gsg-space-3);
	box-shadow: 0 2px 8px rgba(224, 123, 57, 0.4);
}



/* ==========================================================================
   Phase 12.1.8 — Distance-Aware Planner
   ========================================================================== */

/* Trip summary bar --------------------------------------------------------- */
.planner-trip-summary {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: var(--gsg-space-1) var(--gsg-space-4);
	justify-content: center;
	padding: var(--gsg-space-3) var(--gsg-space-5);
	background: rgba(30, 77, 53, 0.07);
	border: 1px solid rgba(30, 77, 53, 0.12);
	border-radius: var(--gsg-radius-md);
	font-size: 0.9rem;
	color: var(--gsg-text-primary);
	margin: var(--gsg-space-5) 0 var(--gsg-space-3);
}

.planner-trip-summary__item strong {
	color: var(--gsg-color-primary, #1E4D35);
}

.planner-trip-summary__item--muted {
	color: var(--gsg-text-muted, #6b7280);
	font-size: 0.875rem;
}

.planner-trip-summary__sep {
	color: var(--gsg-text-muted, #6b7280);
	user-select: none;
}

/* Drive connector ---------------------------------------------------------- */
.itinerary-connector--drive .itinerary-connector__icon {
	display: none;
}

.itinerary-connector__drive-info {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	font-size: 0.8125rem;
	color: var(--gsg-text-muted, #6b7280);
	background: #fff;
	border: 1px solid #e5e7eb;
	border-radius: 999px;
	padding: 3px 12px;
	white-space: nowrap;
	box-shadow: 0 1px 3px rgba(0,0,0,.06);
}

.itinerary-connector__drive-icon {
	font-size: 0.75rem;
}

.itinerary-connector__drive-dist {
	font-weight: 600;
	color: var(--gsg-text-primary);
}

.itinerary-connector__drive-sep {
	color: #d1d5db;
}

.itinerary-connector__drive-time {
	color: var(--gsg-text-muted, #6b7280);
}


/* ==========================================================================
   Phase 13.5 — Food & Drink: Restaurant Cards + Cuisine Archive
   ========================================================================== */

/* ---- Restaurant Card ---- */

.restaurant-card {
	background: var(--gsg-surface-card);
	border-radius: var(--gsg-radius-lg);
	overflow: hidden;
	border: 1px solid var(--gsg-border-light);
	display: flex;
	flex-direction: column;
	transition: box-shadow var(--gsg-transition-base), transform var(--gsg-transition-base);
}

.restaurant-card:hover {
	box-shadow: var(--gsg-shadow-lg);
	transform: translateY(-2px);
}

.restaurant-card__image-link {
	display: block;
}

.restaurant-card__image-wrap {
	position: relative;
	aspect-ratio: 16 / 9;
	overflow: hidden;
	background: var(--gsg-green-50);
}

.restaurant-card__image {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform var(--gsg-transition-slow);
}

.restaurant-card:hover .restaurant-card__image {
	transform: scale(1.04);
}

.restaurant-card__image-placeholder {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 3rem;
	background: linear-gradient(135deg, var(--gsg-green-50), var(--gsg-green-100));
}

.restaurant-card__influencer-badge {
	position: absolute;
	top: var(--gsg-space-3);
	right: var(--gsg-space-3);
	background: rgba(0, 0, 0, 0.75);
	color: #fff;
	font-size: var(--gsg-text-xs);
	font-weight: 600;
	padding: var(--gsg-space-1) var(--gsg-space-2);
	border-radius: var(--gsg-radius-pill);
	backdrop-filter: blur(4px);
}

.restaurant-card__body {
	padding: var(--gsg-space-5);
	display: flex;
	flex-direction: column;
	flex: 1;
}

.restaurant-card__cuisines {
	display: flex;
	flex-wrap: wrap;
	gap: var(--gsg-space-1);
	margin-bottom: var(--gsg-space-3);
}

.restaurant-card__cuisine-tag {
	display: inline-block;
	font-size: var(--gsg-text-xs);
	font-weight: 600;
	color: var(--gsg-amber-700, #b45309);
	background: var(--gsg-amber-50, #fffbeb);
	border: 1px solid var(--gsg-amber-200, #fde68a);
	padding: 2px var(--gsg-space-2);
	border-radius: var(--gsg-radius-pill);
	transition: background-color var(--gsg-transition-fast);
}

.restaurant-card__cuisine-tag:hover {
	background: var(--gsg-amber-100, #fef3c7);
}

.restaurant-card__title {
	font-size: var(--gsg-text-lg);
	font-weight: 700;
	color: var(--gsg-text-primary);
	margin-bottom: var(--gsg-space-2);
	line-height: 1.3;
}

.restaurant-card__title a {
	color: inherit;
	transition: color var(--gsg-transition-fast);
}

.restaurant-card__title a:hover {
	color: var(--gsg-green-600);
}

.restaurant-card__city {
	font-size: var(--gsg-text-sm);
	color: var(--gsg-text-muted);
	margin-bottom: var(--gsg-space-2);
}

.restaurant-card__excerpt {
	font-size: var(--gsg-text-sm);
	color: var(--gsg-text-secondary);
	line-height: 1.6;
	margin-bottom: var(--gsg-space-4);
	flex: 1;
}

.restaurant-card__footer {
	display: flex;
	align-items: center;
	gap: var(--gsg-space-3);
	margin-top: auto;
	padding-top: var(--gsg-space-4);
	border-top: 1px solid var(--gsg-border-light);
}

.restaurant-card__cta {
	font-size: var(--gsg-text-sm);
	font-weight: 600;
	color: var(--gsg-green-600);
	transition: color var(--gsg-transition-fast);
}

.restaurant-card__cta:hover {
	color: var(--gsg-green-700);
}

.restaurant-card__phone {
	margin-left: auto;
	font-size: var(--gsg-text-base);
	text-decoration: none;
	opacity: 0.7;
	transition: opacity var(--gsg-transition-fast);
}

.restaurant-card__phone:hover {
	opacity: 1;
}

/* ---- Cuisine Archive Hero Variant ---- */

.page-hero--food-drink {
	background: linear-gradient(135deg, #2d1b00 0%, var(--gsg-green-900, #14532d) 100%);
}

/* Photo variant — applied when slug === restaurants */
.page-hero--food-drink[style*="background-image"] {
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

.page-hero--food-drink[style*="background-image"]::before {
	background: linear-gradient(to bottom, rgba(8,24,15,0.65) 0%, rgba(8,24,15,0.85) 100%);
	background-image: none;
}

.page-hero--food-drink[style*="background-image"] .page-hero__subtitle {
	color: #FFFFFF;
}

/* Food Trails hero photo */
.page-hero--food-trails {
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

.page-hero--food-trails::before {
	background: linear-gradient(to bottom, rgba(8,24,15,0.65) 0%, rgba(8,24,15,0.85) 100%);
	background-image: none;
}

.page-hero--food-trails .page-hero__subtitle {
	color: #FFFFFF;
}

/* Food Trails archive — intro content + section heading */
.trails-intro-content {
	padding-block: var(--gsg-space-10) var(--gsg-space-8);
	font-size: var(--gsg-text-base);
	color: var(--gsg-text-secondary);
	line-height: 1.75;
}

.trails-intro-content p:last-child {
	margin-bottom: 0;
}

.trails-section-title {
	font-size: clamp(var(--gsg-text-2xl), 3vw, var(--gsg-text-3xl));
	font-weight: 800;
	color: var(--gsg-green-800);
	letter-spacing: -0.03em;
	margin-bottom: var(--gsg-space-8);
	padding-bottom: var(--gsg-space-4);
	border-bottom: 2px solid var(--gsg-border-light);
}

/* ---- Cuisine Type Grid ---- */

.cuisine-type-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: var(--gsg-space-3);
}

@media (min-width: 480px) {
	.cuisine-type-grid {
		grid-template-columns: repeat(3, 1fr);
	}
}

@media (min-width: 768px) {
	.cuisine-type-grid {
		grid-template-columns: repeat(6, 1fr);
	}
}

.cuisine-type-card {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--gsg-space-2);
	padding: var(--gsg-space-5) var(--gsg-space-3);
	background: var(--gsg-surface-card);
	border: 1px solid var(--gsg-border-light);
	border-radius: var(--gsg-radius-lg);
	text-align: center;
	transition: all var(--gsg-transition-base);
	color: var(--gsg-text-primary);
}

.cuisine-type-card:hover {
	border-color: var(--gsg-amber-400, #fbbf24);
	background: var(--gsg-amber-50, #fffbeb);
	box-shadow: var(--gsg-shadow-md);
	transform: translateY(-2px);
}

.cuisine-type-card__emoji {
	font-size: 2rem;
	line-height: 1;
}

.cuisine-type-card__name {
	font-size: var(--gsg-text-sm);
	font-weight: 600;
	color: var(--gsg-text-primary);
}

.cuisine-type-card__count {
	font-size: var(--gsg-text-xs);
	color: var(--gsg-text-muted);
}

/* ---- Restaurant Archive Grid ---- */

.restaurant-grid {
	row-gap: var(--gsg-space-6);
}

/* ---- Food & Drink Partner CTA ---- */

.food-drink-partner-cta {
	background: linear-gradient(135deg, var(--gsg-green-800, #166534) 0%, var(--gsg-green-900, #14532d) 100%);
	padding: var(--gsg-space-16) 0;
	margin-top: var(--gsg-space-16);
}

.food-drink-partner-cta__inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: var(--gsg-space-6);
}

@media (min-width: 768px) {
	.food-drink-partner-cta__inner {
		flex-direction: row;
		text-align: left;
		justify-content: space-between;
	}
}

.food-drink-partner-cta__text h2 {
	font-size: var(--gsg-text-2xl);
	font-weight: 800;
	color: #FFFFFF;
	margin-bottom: var(--gsg-space-3);
}

.food-drink-partner-cta__text p {
	font-size: var(--gsg-text-base);
	color: rgba(255, 255, 255, 0.8);
	max-width: 480px;
}

/* ==========================================================================
   Phase 13.6 — Restaurant Profile
   ========================================================================== */

/* ---- Restaurant Hero ---- */

.restaurant-hero {
	position: relative;
	min-height: 340px;
	background: linear-gradient(135deg, var(--gsg-green-900, #14532d) 0%, #2d1b00 100%);
	display: flex;
	align-items: flex-end;
	padding-bottom: var(--gsg-space-10);
}

.restaurant-hero--has-image {
	background-image: var(--hero-image);
	background-size: cover;
	background-position: center;
}

.restaurant-hero__backdrop {
	position: absolute;
	inset: 0;
	background: linear-gradient(
		to bottom,
		rgba(0, 0, 0, 0.1) 0%,
		rgba(0, 0, 0, 0.55) 60%,
		rgba(0, 0, 0, 0.8) 100%
	);
}

.restaurant-hero__body {
	position: relative;
	z-index: 1;
	padding-top: var(--gsg-space-16);
}

.restaurant-hero__badges {
	display: flex;
	flex-wrap: wrap;
	gap: var(--gsg-space-2);
	margin-bottom: var(--gsg-space-4);
}

.restaurant-hero__badge {
	display: inline-block;
	padding: var(--gsg-space-1) var(--gsg-space-3);
	background: rgba(255, 255, 255, 0.15);
	backdrop-filter: blur(4px);
	border: 1px solid rgba(255, 255, 255, 0.25);
	border-radius: var(--gsg-radius-full);
	font-size: var(--gsg-text-sm);
	font-weight: 600;
	color: #fff;
	text-decoration: none;
	transition: background var(--gsg-transition-fast);
}

.restaurant-hero__badge:hover {
	background: var(--gsg-amber-500, #f59e0b);
	border-color: var(--gsg-amber-500, #f59e0b);
	color: #fff;
}

.restaurant-hero__title {
	font-size: var(--gsg-text-4xl);
	font-weight: 900;
	color: #fff;
	line-height: 1.15;
	margin: 0 0 var(--gsg-space-3);
	text-shadow: 0 2px 6px rgba(0, 0, 0, 0.5);
}

@media (max-width: 640px) {
	.restaurant-hero__title {
		font-size: var(--gsg-text-3xl);
	}
}

.restaurant-hero__location {
	font-size: var(--gsg-text-base);
	color: rgba(255, 255, 255, 0.85);
	margin: 0;
}

/* ---- Mentioned On ---- */

.mentioned-on__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: var(--gsg-space-3);
}

.mentioned-on__item {
	display: flex;
	align-items: center;
}

.mentioned-on__link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 8px 16px;
	background: #f4f7f4;
	border: 1px solid rgba(30, 77, 53, 0.15);
	border-radius: 6px;
	color: var(--gsg-green);
	font-size: 0.9rem;
	font-weight: 600;
	text-decoration: none;
	transition: background 0.15s, border-color 0.15s;
}

.mentioned-on__link:hover {
	background: rgba(30, 77, 53, 0.08);
	border-color: var(--gsg-green);
}

.mentioned-on__text {
	padding: 8px 16px;
	background: #f4f7f4;
	border-left: 3px solid var(--gsg-green);
	border-radius: 0 6px 6px 0;
	font-size: 0.9rem;
	color: var(--gsg-text);
}

/* ---- Featured By (grouped, expandable) ---- */

.featured-by-list {
	display: flex;
	flex-direction: column;
	gap: var(--gsg-space-1);
}

.featured-by-row {
	border: 1px solid var(--gsg-border-light);
	border-radius: var(--gsg-radius-lg);
	overflow: hidden;
}

.featured-by-row__header {
	display: flex;
	align-items: center;
	gap: var(--gsg-space-3);
	padding: var(--gsg-space-3) var(--gsg-space-4);
	background: var(--gsg-surface-muted, #f8faf9);
	border-bottom: 1px solid var(--gsg-border-light);
}

.featured-by-row__avatar-link {
	flex-shrink: 0;
	display: block;
	text-decoration: none;
}

.featured-by-row__avatar {
	width: 44px;
	height: 44px;
	border-radius: 50%;
	object-fit: cover;
	display: block;
	border: 2px solid var(--gsg-border-light);
}

.featured-by-row__avatar--placeholder {
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--gsg-green-100, #dcfce7);
	font-size: 1.1rem;
}

.featured-by-row__meta {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}

.featured-by-row__name {
	font-size: 0.9rem;
	font-weight: 700;
	color: var(--gsg-text-primary);
	text-decoration: none;
}

.featured-by-row__name:hover {
	color: var(--gsg-primary);
}

.featured-by-row__handle {
	font-size: 0.78rem;
	color: var(--gsg-text-muted);
}

/* Videos inside a row */
.featured-by-row__videos {
	padding: var(--gsg-space-2) var(--gsg-space-4);
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.featured-video-link {
	display: flex;
	align-items: center;
	gap: var(--gsg-space-2);
	padding: 7px var(--gsg-space-2);
	border-radius: var(--gsg-radius-md);
	text-decoration: none;
	transition: background var(--gsg-transition-fast);
}

.featured-video-link:hover {
	background: var(--gsg-green-50, #f0fdf4);
}

.featured-video-link__icon {
	font-size: 1rem;
	flex-shrink: 0;
	line-height: 1;
}

.featured-video-link__title {
	flex: 1;
	font-size: 0.875rem;
	font-weight: 600;
	color: var(--gsg-text-primary);
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.featured-video-link__arrow {
	font-size: 0.75rem;
	color: var(--gsg-text-muted);
	flex-shrink: 0;
}

/* Extra videos (hidden by default) */
.featured-by-row__extra {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

/* Toggle button */
.featured-by-row__toggle {
	display: inline-flex;
	align-items: center;
	gap: var(--gsg-space-1);
	margin-top: 4px;
	padding: 5px var(--gsg-space-2);
	background: none;
	border: none;
	cursor: pointer;
	font-size: 0.8125rem;
	font-weight: 600;
	color: var(--gsg-primary);
	border-radius: var(--gsg-radius-md);
	transition: background var(--gsg-transition-fast);
}

.featured-by-row__toggle:hover {
	background: var(--gsg-green-50, #f0fdf4);
}

.featured-by-row__toggle-chevron {
	font-size: 1rem;
	line-height: 1;
	transition: transform var(--gsg-transition-fast);
}

.featured-by-row__toggle[aria-expanded="true"] .featured-by-row__toggle-chevron {
	transform: rotate(180deg);
}

/* Legacy chip styles (kept for any other usage) */
.influencer-chip {
	display: flex;
	align-items: center;
	gap: var(--gsg-space-2);
	padding: var(--gsg-space-2) var(--gsg-space-4);
	background: var(--gsg-surface-card);
	border: 1px solid var(--gsg-border-light);
	border-radius: var(--gsg-radius-full);
	text-decoration: none;
	transition: all var(--gsg-transition-fast);
}

.influencer-chip:hover {
	border-color: var(--gsg-green-500, #22c55e);
	background: var(--gsg-green-50, #f0fdf4);
}

.influencer-chip__avatar {
	width: 36px;
	height: 36px;
	border-radius: 50%;
	object-fit: cover;
	flex-shrink: 0;
}

.influencer-chip__name {
	font-size: var(--gsg-text-sm);
	font-weight: 700;
	color: var(--gsg-text-primary);
}

.influencer-chip__handle {
	font-size: var(--gsg-text-xs);
	color: var(--gsg-text-muted);
}

/* ---- Sidebar cuisine tags ---- */

.sidebar-tag--cuisine {
	display: inline-block;
	margin: 0 var(--gsg-space-1) var(--gsg-space-1) 0;
	padding: var(--gsg-space-1) var(--gsg-space-3);
	background: var(--gsg-green-50, #f0fdf4);
	border: 1px solid var(--gsg-green-200, #bbf7d0);
	border-radius: var(--gsg-radius-full);
	font-size: var(--gsg-text-sm);
	font-weight: 600;
	color: var(--gsg-green-700, #15803d);
	text-decoration: none;
	transition: all var(--gsg-transition-fast);
}

.sidebar-tag--cuisine:hover {
	background: var(--gsg-green-100, #dcfce7);
	border-color: var(--gsg-green-400, #4ade80);
}

/* ---- Main-content cuisine tag row (single restaurant) ---- */

.restaurant-cuisine-tags {
	display: flex;
	flex-wrap: wrap;
	gap: var(--gsg-space-2);
	margin-bottom: var(--gsg-space-6);
}

.restaurant-cuisine-tag {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: var(--gsg-space-1) var(--gsg-space-4);
	background: var(--gsg-green-50, #f0fdf4);
	border: 1.5px solid var(--gsg-green, #1E4D35);
	border-radius: 99px;
	font-size: var(--gsg-text-sm);
	font-weight: 600;
	color: var(--gsg-green, #1E4D35);
	text-decoration: none;
	transition: background var(--gsg-transition-fast), color var(--gsg-transition-fast);
}

.restaurant-cuisine-tag:hover {
	background: var(--gsg-green, #1E4D35);
	color: #fff;
}

/* ==========================================================================
   Phase 13.7 — Influencer CPT + Profiles
   ========================================================================== */

/* ---- Influencer Hero ---- */

.influencer-hero {
	position: relative;
	background: linear-gradient(135deg, var(--gsg-green-900, #14532d) 0%, #1a1a2e 100%);
	padding: var(--gsg-space-16) 0 var(--gsg-space-10);
}

.influencer-hero--has-image {
	background-image: var(--hero-image);
	background-size: cover;
	background-position: center top;
}

.influencer-hero__backdrop {
	position: absolute;
	inset: 0;
	background: linear-gradient(
		to bottom,
		rgba(0, 0, 0, 0.25) 0%,
		rgba(0, 0, 0, 0.65) 60%,
		rgba(0, 0, 0, 0.85) 100%
	);
}

.influencer-hero__body {
	position: relative;
	z-index: 1;
}

.influencer-hero__inner {
	display: flex;
	align-items: flex-end;
	gap: var(--gsg-space-6);
}

@media (max-width: 640px) {
	.influencer-hero__inner {
		flex-direction: column;
		align-items: center;
		text-align: center;
	}
}

.influencer-hero__avatar-wrap {
	flex-shrink: 0;
}

.influencer-hero__avatar {
	width: 120px;
	height: 120px;
	border-radius: 50%;
	object-fit: cover;
	border: 4px solid rgba(255, 255, 255, 0.3);
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4);
}

.influencer-hero__avatar--placeholder {
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(255, 255, 255, 0.1);
	font-size: 3rem;
	color: rgba(255, 255, 255, 0.6);
}

.influencer-hero__info {
	flex: 1;
	min-width: 0;
}

.influencer-hero__name {
	font-size: var(--gsg-text-4xl);
	font-weight: 900;
	color: #fff;
	line-height: 1.15;
	margin: 0 0 var(--gsg-space-1);
	text-shadow: 0 2px 6px rgba(0, 0, 0, 0.5);
}

@media (max-width: 640px) {
	.influencer-hero__name {
		font-size: var(--gsg-text-3xl);
	}
}

.influencer-hero__handle {
	font-size: var(--gsg-text-lg);
	color: rgba(255, 255, 255, 0.75);
	margin: 0 0 var(--gsg-space-4);
	font-style: italic;
}

.influencer-hero__platforms {
	display: flex;
	flex-wrap: wrap;
	gap: var(--gsg-space-2);
}

.influencer-hero__platform-link {
	display: inline-flex;
	align-items: center;
	gap: var(--gsg-space-1);
	padding: var(--gsg-space-1) var(--gsg-space-3);
	background: rgba(255, 255, 255, 0.12);
	backdrop-filter: blur(4px);
	border: 1px solid rgba(255, 255, 255, 0.25);
	border-radius: var(--gsg-radius-full);
	font-size: var(--gsg-text-sm);
	font-weight: 600;
	color: #fff;
	text-decoration: none;
	transition: all var(--gsg-transition-fast);
}

.influencer-hero__platform-link:hover {
	background: var(--gsg-amber-500, #f59e0b);
	border-color: var(--gsg-amber-500, #f59e0b);
}

.influencer-hero__platform-name {
	font-size: var(--gsg-text-xs);
}

/* ---- Influencer Stats Bar ---- */

.influencer-stats-bar {
	background: var(--gsg-surface-card);
	border-bottom: 1px solid var(--gsg-border-light);
	padding: var(--gsg-space-5) 0;
}

.influencer-stats-bar__inner {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--gsg-space-8);
	flex-wrap: wrap;
}

.influencer-stats-bar__stat {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--gsg-space-1);
}

.influencer-stats-bar__number {
	font-size: var(--gsg-text-3xl);
	font-weight: 900;
	color: var(--gsg-green-700, #15803d);
	line-height: 1;
}

.influencer-stats-bar__label {
	font-size: var(--gsg-text-sm);
	color: var(--gsg-text-secondary);
	text-align: center;
}

.influencer-stats-bar__divider {
	width: 1px;
	height: 40px;
	background: var(--gsg-border-light);
}

/* ---- Influencer Restaurants Map ---- */

.influencer-map-section {
	background: var(--gsg-surface-subtle, #f8faf9);
	border-top: 1px solid var(--gsg-border-light);
	border-bottom: 1px solid var(--gsg-border-light);
	padding: var(--gsg-space-10) 0 var(--gsg-space-8);
}

.influencer-map-section__heading {
	font-size: var(--gsg-text-xl);
	font-weight: 700;
	color: var(--gsg-green-800, #166534);
	margin-bottom: var(--gsg-space-4);
}

.influencer-map-section__map {
	border-radius: var(--gsg-radius-xl);
	overflow: hidden;
	border: 1px solid var(--gsg-border-light);
	height: 420px;
}

@media (min-width: 768px) {
	.influencer-map-section__map { height: 520px; }
}

.influencer-map-section__cta {
	margin-top: var(--gsg-space-4);
	text-align: center;
}

.influencer-map-section__cta-link {
	display: inline-block;
	font-size: var(--gsg-text-sm);
	font-weight: 600;
	color: var(--gsg-amber, #E07B39);
	text-decoration: none;
	border: 2px solid var(--gsg-amber, #E07B39);
	border-radius: var(--gsg-radius-full, 9999px);
	padding: var(--gsg-space-2) var(--gsg-space-6);
	transition: background var(--gsg-transition-base), color var(--gsg-transition-base);
}

.influencer-map-section__cta-link:hover {
	background: var(--gsg-amber, #E07B39);
	color: #fff;
}

/* ---- Influencer map heading size ---- */
.influencer-map-section__heading {
	font-size: var(--gsg-text-base);
	font-weight: 600;
	color: var(--gsg-text-secondary);
	text-transform: uppercase;
	letter-spacing: 0.06em;
	margin-bottom: var(--gsg-space-4);
}

/* ---- Influencer restaurant list ---- */

.influencer-rest-list {
	list-style: none;
	margin: 0;
	padding: 0;
	border: 1px solid var(--gsg-border-light);
	border-radius: var(--gsg-radius-lg);
	overflow: hidden;
}

.influencer-rest-list__row {
	display: grid;
	grid-template-columns: 1fr 1fr auto;
	align-items: center;
	gap: var(--gsg-space-4);
	padding: var(--gsg-space-3) var(--gsg-space-5);
	border-bottom: 1px solid var(--gsg-border-light);
	background: var(--gsg-surface-card);
	transition: background var(--gsg-transition-base);
}

.influencer-rest-list__row:last-child {
	border-bottom: none;
}

.influencer-rest-list__row:hover {
	background: var(--gsg-surface-subtle, #f8faf9);
}

.influencer-rest-list__name {
	font-weight: 600;
	color: var(--gsg-text-primary);
	font-size: var(--gsg-text-sm);
}

.influencer-rest-list__address {
	font-size: var(--gsg-text-sm);
	color: var(--gsg-text-secondary);
	line-height: 1.4;
}

.influencer-rest-list__city {
	display: inline;
}

.influencer-rest-list__more-link {
	display: inline-block;
	font-size: var(--gsg-text-xs);
	font-weight: 600;
	color: var(--gsg-amber, #E07B39);
	text-decoration: none;
	border: 1px solid var(--gsg-amber, #E07B39);
	border-radius: var(--gsg-radius-full, 9999px);
	padding: var(--gsg-space-1) var(--gsg-space-3);
	white-space: nowrap;
	transition: background var(--gsg-transition-base), color var(--gsg-transition-base);
}

.influencer-rest-list__more-link:hover {
	background: var(--gsg-amber, #E07B39);
	color: #fff;
}

@media (max-width: 599px) {
	.influencer-rest-list__row {
		grid-template-columns: 1fr auto;
		grid-template-rows: auto auto;
	}
	.influencer-rest-list__address {
		grid-column: 1;
		grid-row: 2;
	}
	.influencer-rest-list__action {
		grid-column: 2;
		grid-row: 1 / 3;
		align-self: center;
	}
}

/* ---- Influencer restaurant list — distance + cuisine extensions ---- */

.influencer-rest-list__distance {
	display: inline-block;
	font-size: var(--gsg-text-xs, 0.72rem);
	font-weight: 600;
	color: var(--gsg-green, #1E4D35);
	background: #e8f4ec;
	border-radius: 99px;
	padding: 1px 7px;
	margin-left: 6px;
	vertical-align: middle;
}

.influencer-rest-list__cuisine {
	color: var(--gsg-text-muted, #6b7280);
	font-size: var(--gsg-text-xs, 0.72rem);
}

.influencer-rest-list__empty {
	list-style: none;
	padding: var(--gsg-space-6, 1.5rem) 0;
	color: var(--gsg-text-muted, #6b7280);
	font-style: italic;
}

/* ---- Influencer ZIP / city proximity search form ---- */

.influencer-zip-search {
	background: #f8faf8;
	border: 1px solid var(--gsg-border, #e2e8e4);
	border-radius: 10px;
	padding: var(--gsg-space-4, 1rem) var(--gsg-space-5, 1.25rem);
	margin-bottom: var(--gsg-space-5, 1.25rem);
}

.influencer-zip-search__form {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	gap: var(--gsg-space-3, 0.75rem);
}

.influencer-zip-search__group {
	display: flex;
	flex-direction: column;
	gap: 3px;
}

.influencer-zip-search__label {
	font-size: var(--gsg-text-xs, 0.72rem);
	font-weight: 600;
	color: var(--gsg-text-muted, #6b7280);
	text-transform: uppercase;
	letter-spacing: 0.04em;
}

.influencer-zip-search__input,
.influencer-zip-search__select {
	height: 36px;
	padding: 0 var(--gsg-space-3, 0.75rem);
	border: 1px solid var(--gsg-border, #cdd8d2);
	border-radius: 6px;
	font-size: var(--gsg-text-sm, 0.875rem);
	background: #fff;
	color: var(--gsg-text, #12263A);
}

.influencer-zip-search__input {
	width: 110px;
}

.influencer-zip-search__input:focus,
.influencer-zip-search__select:focus {
	outline: none;
	border-color: var(--gsg-green, #1E4D35);
	box-shadow: 0 0 0 2px rgba(30,77,53,.15);
}

.influencer-zip-search__btn {
	height: 36px;
	padding: 0 var(--gsg-space-4, 1rem);
	background: var(--gsg-green, #1E4D35);
	color: #fff;
	border: none;
	border-radius: 6px;
	font-size: var(--gsg-text-sm, 0.875rem);
	font-weight: 600;
	cursor: pointer;
	transition: background 0.15s;
}

.influencer-zip-search__btn:hover {
	background: #163d29;
}

.influencer-zip-search__clear {
	height: 36px;
	padding: 0 var(--gsg-space-3, 0.75rem);
	background: transparent;
	color: var(--gsg-text-muted, #6b7280);
	border: 1px solid var(--gsg-border, #cdd8d2);
	border-radius: 6px;
	font-size: var(--gsg-text-sm, 0.875rem);
	cursor: pointer;
}

.influencer-zip-search__clear:hover {
	color: var(--gsg-red, #c0392b);
	border-color: var(--gsg-red, #c0392b);
}

.influencer-zip-search__error {
	margin: var(--gsg-space-2, 0.5rem) 0 0;
	font-size: var(--gsg-text-sm, 0.875rem);
	color: var(--gsg-red, #c0392b);
	font-weight: 500;
}

.influencer-zip-search__status {
	margin: var(--gsg-space-2, 0.5rem) 0 0;
	font-size: var(--gsg-text-sm, 0.875rem);
	color: var(--gsg-text-muted, #6b7280);
}

@media (max-width: 599px) {
	.influencer-zip-search__input,
	.influencer-zip-search__select,
	.influencer-zip-search__btn,
	.influencer-zip-search__clear {
		flex: 1 1 auto;
	}
	.influencer-zip-search__group {
		flex: 1 1 100%;
	}
}

/* ---- Creator Grid ---- */

.creator-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--gsg-space-6);
	align-items: start;
}

@media (max-width: 900px) {
	.creator-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 540px) {
	.creator-grid {
		grid-template-columns: 1fr;
	}
}

/* ---- Creator Card ---- */

.creator-card {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	background: var(--gsg-surface-card);
	border: 1px solid var(--gsg-border-light);
	border-radius: var(--gsg-radius-xl);
	padding: var(--gsg-space-6) var(--gsg-space-5) var(--gsg-space-5);
	gap: var(--gsg-space-4);
	height: 290px;
	overflow: hidden;
	transition: box-shadow var(--gsg-transition-base), border-color var(--gsg-transition-base), transform var(--gsg-transition-base);
}

.creator-card:hover {
	box-shadow: var(--gsg-shadow-lg);
	border-color: var(--gsg-primary);
	transform: translateY(-2px);
}

/* Avatar */
.creator-card__avatar-link {
	display: block;
	text-decoration: none;
	flex-shrink: 0;
}

.creator-card__avatar {
	width: 96px;
	height: 96px;
	border-radius: 50%;
	overflow: hidden;
	background: linear-gradient(135deg, var(--gsg-primary) 0%, #2d6a4f 100%);
	border: 3px solid var(--gsg-border-light);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 2rem;
	transition: border-color var(--gsg-transition-fast);
}

.creator-card:hover .creator-card__avatar {
	border-color: var(--gsg-primary);
}

.creator-card__avatar img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

/* Body */
.creator-card__body {
	display: flex;
	flex-direction: column;
	gap: var(--gsg-space-1);
	flex: 1;
	width: 100%;
}

.creator-card__name {
	font-size: 1rem;
	font-weight: 800;
	margin: 0;
}

.creator-card__name a {
	color: var(--gsg-text-primary);
	text-decoration: none;
}

.creator-card__name a:hover {
	color: var(--gsg-primary);
}

.creator-card__handle {
	font-size: 0.8125rem;
	color: var(--gsg-primary);
	font-weight: 600;
	margin: 0;
}

.creator-card__bio {
	font-size: 0.8125rem;
	color: var(--gsg-text-secondary);
	margin: var(--gsg-space-2) 0 0;
	line-height: 1.5;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* Footer */
.creator-card__footer {
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--gsg-space-3);
	padding-top: var(--gsg-space-4);
	border-top: 1px solid var(--gsg-border-light);
	margin-top: auto;
}

.creator-card__meta {
	display: flex;
	align-items: center;
	gap: var(--gsg-space-3);
	justify-content: center;
}

.creator-card__badge {
	font-size: 0.75rem;
	font-weight: 600;
	color: var(--gsg-text-muted);
}

.creator-card__platforms {
	display: flex;
	gap: var(--gsg-space-2);
	align-items: center;
}

.creator-card__platform {
	font-size: 1rem;
	text-decoration: none;
	opacity: 0.6;
	line-height: 1;
	transition: opacity var(--gsg-transition-fast);
}

.creator-card__platform:hover {
	opacity: 1;
}

.creator-card__btn {
	font-size: 0.8125rem;
	font-weight: 700;
	color: var(--gsg-primary);
	background: transparent;
	border: 1.5px solid var(--gsg-primary);
	border-radius: var(--gsg-radius-full);
	padding: 6px 18px;
	text-decoration: none;
	white-space: nowrap;
	transition: background var(--gsg-transition-fast), color var(--gsg-transition-fast);
}

.creator-card__btn:hover {
	background: var(--gsg-primary);
	color: #fff;
}


/* ==========================================================================
   Phase 13.9 — Food Map Page
   ========================================================================== */

/* ---- Hero ---- */

.food-map-hero {
	background: linear-gradient(135deg, var(--gsg-green-900, #14532d) 0%, var(--gsg-green-700, #15803d) 100%);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	color: #fff;
	padding: var(--gsg-space-12) 0 var(--gsg-space-10);
	text-align: center;
	position: relative;
}

.food-map-hero::before {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(to bottom, rgba(12,35,22,0.52) 0%, rgba(12,35,22,0.72) 100%);
	pointer-events: none;
}

.food-map-hero__inner {
	position: relative;
	z-index: 1;
}

.food-map-hero__eyebrow {
	font-size: var(--gsg-text-sm);
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--gsg-amber-300, #fcd34d);
	margin-bottom: var(--gsg-space-2);
}

.food-map-hero__title {
	font-size: clamp(2rem, 5vw, 3.25rem);
	font-weight: 800;
	line-height: 1.15;
	margin-bottom: var(--gsg-space-4);
	color: #fff;
}

.food-map-hero__tagline {
	font-size: var(--gsg-text-lg);
	line-height: 1.6;
	max-width: 640px;
	margin: 0 auto var(--gsg-space-4);
	color: rgba(255,255,255,0.88);
}

.food-map-hero__meta {
	font-size: var(--gsg-text-sm);
	color: rgba(255,255,255,0.6);
}

/* ---- Filter bar ---- */

.food-map-filters {
	background: var(--gsg-surface-card);
	border-bottom: 1px solid var(--gsg-border-light);
	padding: var(--gsg-space-4) 0;
	position: sticky;
	top: 0;
	z-index: 80;
	box-shadow: var(--gsg-shadow-sm);
}

.food-map-filters__form {
	display: flex;
	flex-wrap: wrap;
	gap: var(--gsg-space-3) var(--gsg-space-4);
	align-items: flex-end;
}

.food-map-filters__field {
	display: flex;
	flex-direction: column;
	gap: var(--gsg-space-1);
	min-width: 140px;
	flex: 1 1 140px;
}

.food-map-filters__label {
	font-size: var(--gsg-text-xs);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--gsg-text-muted, #6b7280);
}

.food-map-filters__select {
	width: 100%;
	padding: var(--gsg-space-2) var(--gsg-space-3);
	border: 1px solid var(--gsg-border);
	border-radius: var(--gsg-radius-md);
	font-size: var(--gsg-text-sm);
	background: #fff;
	color: var(--gsg-text-primary);
	cursor: pointer;
	transition: border-color var(--gsg-transition-fast);
}

.food-map-filters__select:focus {
	outline: none;
	border-color: var(--gsg-green-500);
	box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.15);
}

.food-map-filters__field--sort {
	flex: 0 0 auto;
}

.food-map-filters__sort-btn {
	display: inline-flex;
	align-items: center;
	gap: var(--gsg-space-1);
	padding: var(--gsg-space-2) var(--gsg-space-4);
	border: 2px solid var(--gsg-border);
	border-radius: var(--gsg-radius-pill);
	background: #fff;
	color: var(--gsg-text-secondary);
	font-size: var(--gsg-text-sm);
	font-weight: 600;
	cursor: pointer;
	transition: all var(--gsg-transition-fast);
}

.food-map-filters__sort-btn:hover {
	border-color: var(--gsg-green-500);
	color: var(--gsg-green-700);
}

.food-map-filters__sort-btn.active {
	background: var(--gsg-green-700);
	border-color: var(--gsg-green-700);
	color: #fff;
}

/* ---- Toolbar (count + view toggle) ---- */

.food-map-toolbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: var(--gsg-space-3);
	padding-top: var(--gsg-space-5);
	padding-bottom: var(--gsg-space-3);
}

.food-map-toolbar__count {
	font-size: var(--gsg-text-sm);
	color: var(--gsg-text-muted);
	font-weight: 600;
}

.food-map-toolbar__views {
	display: flex;
	border: 2px solid var(--gsg-border);
	border-radius: var(--gsg-radius-md);
	overflow: hidden;
}

.food-map-view-btn {
	padding: var(--gsg-space-2) var(--gsg-space-5);
	background: #fff;
	border: none;
	font-size: var(--gsg-text-sm);
	font-weight: 600;
	color: var(--gsg-text-secondary);
	cursor: pointer;
	transition: all var(--gsg-transition-fast);
	border-right: 1px solid var(--gsg-border);
}

.food-map-view-btn:last-child {
	border-right: none;
}

.food-map-view-btn:hover {
	background: var(--gsg-green-50);
	color: var(--gsg-green-700);
}

.food-map-view-btn.active {
	background: var(--gsg-green-700);
	color: #fff;
}

/* ---- Loading indicator ---- */

.food-map-loading {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--gsg-space-3);
	padding: var(--gsg-space-4);
	font-size: var(--gsg-text-sm);
	color: var(--gsg-text-muted);
}

.food-map-loading__spinner {
	width: 20px;
	height: 20px;
	border: 2px solid var(--gsg-border);
	border-top-color: var(--gsg-green-600);
	border-radius: 50%;
	animation: fm-spin 0.7s linear infinite;
}

@keyframes fm-spin {
	to { transform: rotate(360deg); }
}

/* ---- Map section ---- */

.food-map-map-section {
	position: relative;
	margin-bottom: var(--gsg-space-6);
}

.food-map-map {
	width: 100%;
	height: 520px;
}

@media (max-width: 640px) {
	.food-map-map { height: 360px; }
}

.food-map-map__attr {
	font-size: var(--gsg-text-xs);
	color: var(--gsg-text-muted);
	text-align: right;
	padding: var(--gsg-space-1) var(--gsg-space-3);
	background: var(--gsg-surface-card);
}

/* ---- Map popup ---- */

.fm-popup {
	width: 200px;
}

.fm-popup__img {
	width: 100%;
	height: 90px;
	object-fit: cover;
	border-radius: var(--gsg-radius-sm);
	margin-bottom: var(--gsg-space-2);
	display: block;
}

.fm-popup__img-placeholder {
	width: 100%;
	height: 60px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 2rem;
	background: var(--gsg-green-50);
	border-radius: var(--gsg-radius-sm);
	margin-bottom: var(--gsg-space-2);
}

.fm-popup__body {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.fm-popup__name {
	font-weight: 700;
	font-size: 0.9rem;
	color: var(--gsg-green-700);
	text-decoration: none;
	display: block;
	margin-bottom: var(--gsg-space-1);
}

.fm-popup__name:hover {
	color: var(--gsg-green-500);
}

.fm-popup__cuisine,
.fm-popup__city {
	font-size: 0.75rem;
	color: var(--gsg-text-muted);
	display: block;
}

.fm-popup__badge {
	display: inline-block;
	margin-top: var(--gsg-space-1);
	font-size: 0.7rem;
	font-weight: 700;
	background: var(--gsg-amber-100, #fef3c7);
	color: var(--gsg-amber-700, #b45309);
	padding: 2px 6px;
	border-radius: var(--gsg-radius-pill);
}

/* ---- Popup actions ---- */

.fm-popup__actions {
	display: flex;
	align-items: center;
	gap: 6px;
	margin-top: 6px;
}
.fm-popup__view-btn {
	font-size: 0.75rem;
	color: var(--color-amber, #E07B39);
	text-decoration: none;
	font-weight: 600;
}
.fm-popup__view-btn:hover { text-decoration: underline; }
.fm-popup__trail-btn {
	font-size: 0.7rem;
	padding: 2px 7px;
}

/* ---- List section ---- */

.food-map-list-section {
	padding-top: var(--gsg-space-4);
	padding-bottom: var(--gsg-space-10);
}

/* Row-based list table (Excel-style rows) */
.fm-list-table {
	border: 1px solid var(--gsg-border-light, #e5e7eb);
	border-radius: var(--gsg-radius-lg);
	overflow: hidden;
	background: #fff;
}

.fm-list-row {
	display: grid;
	grid-template-columns: 60px 1fr 160px 160px 80px 110px;
	align-items: center;
	gap: 0;
	border-bottom: 1px solid var(--gsg-border-light, #e5e7eb);
	transition: background var(--gsg-transition-fast);
}

.fm-list-row:last-child {
	border-bottom: none;
}

.fm-list-row:hover {
	background: var(--gsg-green-50, #f0faf4);
}

.fm-row__thumb-cell {
	padding: var(--gsg-space-2);
	flex-shrink: 0;
}

.fm-row__thumb {
	width: 56px;
	height: 44px;
	object-fit: cover;
	border-radius: var(--gsg-radius-sm);
	display: block;
}

.fm-row__thumb-placeholder {
	width: 56px;
	height: 44px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 22px;
	background: var(--gsg-green-50, #f0faf4);
	border-radius: var(--gsg-radius-sm);
	color: var(--gsg-text-muted);
}

.fm-row__name-cell {
	padding: var(--gsg-space-3) var(--gsg-space-4);
	font-weight: 600;
	min-width: 0;
}

.fm-row__name {
	color: var(--gsg-green-primary, #1E4D35);
	text-decoration: none;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	display: block;
}

.fm-row__name:hover {
	text-decoration: underline;
}

.fm-row__cuisine-cell,
.fm-row__city-cell {
	padding: var(--gsg-space-3) var(--gsg-space-3);
	font-size: var(--gsg-text-sm);
	color: var(--gsg-text-muted);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.fm-row__badge-cell {
	padding: var(--gsg-space-3) var(--gsg-space-2);
	text-align: center;
}

.fm-row__badge {
	display: inline-flex;
	align-items: center;
	gap: 3px;
	background: var(--gsg-green-100, #d1fae5);
	color: var(--gsg-green-800, #065f46);
	font-size: var(--gsg-text-xs);
	font-weight: 600;
	padding: 2px 8px;
	border-radius: var(--gsg-radius-pill);
}

.fm-row__badge--none {
	background: var(--gsg-neutral-100, #f3f4f6);
	color: var(--gsg-text-muted);
}

.fm-row__action-cell {
	padding: var(--gsg-space-3) var(--gsg-space-4);
	text-align: right;
}

.fm-row__view-btn {
	display: inline-block;
	background: var(--gsg-green-primary, #1E4D35);
	color: #fff;
	font-size: var(--gsg-text-xs);
	font-weight: 600;
	padding: 5px 12px;
	border-radius: var(--gsg-radius-pill);
	text-decoration: none;
	white-space: nowrap;
	transition: background var(--gsg-transition-fast);
}

.fm-row__view-btn:hover {
	background: var(--gsg-green-800, #065f46);
	color: #fff;
}

@media (max-width: 700px) {
	.fm-list-row {
		grid-template-columns: 56px 1fr auto auto;
		grid-template-rows: auto auto;
	}

	.fm-row__thumb-cell { grid-row: 1 / 3; }
	.fm-row__name-cell  { grid-column: 2 / 4; }
	.fm-row__cuisine-cell { display: none; }
	.fm-row__city-cell  { grid-column: 2; font-size: var(--gsg-text-xs); padding-top: 0; }
	.fm-row__badge-cell { grid-column: 3; padding-top: 0; }
	.fm-row__action-cell { grid-column: 2 / 4; padding-top: var(--gsg-space-2); }
}

.fm-empty {
	text-align: center;
	padding: var(--gsg-space-12);
	color: var(--gsg-text-muted);
	font-size: var(--gsg-text-lg);
}

/* ---- Partner CTA ---- */

.food-map-partner-cta {
	background: var(--gsg-green-900, #14532d);
	padding: var(--gsg-space-12) 0;
	margin-top: var(--gsg-space-6);
}

.food-map-partner-cta__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: var(--gsg-space-6);
}

.food-map-partner-cta__heading {
	font-size: clamp(1.4rem, 3vw, 2rem);
	font-weight: 800;
	color: #fff;
	margin-bottom: var(--gsg-space-3);
}

.food-map-partner-cta__body {
	font-size: var(--gsg-text-base);
	color: rgba(255,255,255,0.8);
	max-width: 520px;
}

.food-map-partner-cta__btn {
	display: inline-flex;
	align-items: center;
	gap: var(--gsg-space-2);
	background: var(--gsg-amber-500, #f59e0b);
	color: var(--gsg-text-primary);
	font-weight: 700;
	font-size: var(--gsg-text-base);
	padding: var(--gsg-space-4) var(--gsg-space-8);
	border-radius: var(--gsg-radius-pill);
	transition: background-color var(--gsg-transition-fast), transform var(--gsg-transition-fast);
	white-space: nowrap;
	flex-shrink: 0;
}

.food-map-partner-cta__btn:hover {
	background: var(--gsg-amber-400, #fbbf24);
	color: var(--gsg-text-primary);
	transform: translateY(-1px);
}

/* Food map — ZIP filter row */
.food-map-filters__divider {
	width: 1px;
	background: var(--gsg-border);
	align-self: stretch;
	margin: 0 var(--gsg-space-1);
	flex-shrink: 0;
}

.food-map-filters__input {
	height: 38px;
	padding: 0 var(--gsg-space-3);
	border: 1.5px solid var(--gsg-border);
	border-radius: var(--gsg-radius);
	font-size: .9rem;
	color: var(--gsg-text);
	background: #fff;
	width: 100px;
}

.food-map-filters__input:focus {
	outline: none;
	border-color: var(--gsg-green);
	box-shadow: 0 0 0 3px rgba(30,77,53,.12);
}

/* Search-by-name field: spans its own full row at the bottom of the filter form */
.food-map-filters__field--search {
	flex: 1 1 100%;
	flex-direction: row;
	align-items: center;
	gap: var(--gsg-space-3);
	border-top: 1px solid rgba(255,255,255,.15);
	padding-top: var(--gsg-space-3);
}
.food-map-filters__search-input {
	flex: 1 1 auto;
	max-width: 400px;
}

/* ZIP geocode error banner */
.food-map-zip-error {
	background: #fef2f2;
	border-left: 3px solid #ef4444;
	color: #991b1b;
	font-size: .9rem;
	padding: var(--gsg-space-2) var(--gsg-space-4);
}

/* Distance pill on restaurant card (shown when proximity filter is active) */
.restaurant-card__distance {
	font-size: var(--gsg-text-xs, 0.72rem);
	font-weight: 600;
	color: var(--gsg-green, #1E4D35);
	background: #e8f4ec;
	border-radius: 99px;
	display: inline-block;
	padding: 2px 9px;
	margin-top: var(--gsg-space-1, 0.25rem);
}

/* Distance in popup */
.fm-popup__distance {
	display: block;
	font-size: .75rem;
	color: var(--gsg-green);
	font-weight: 600;
	margin-top: var(--gsg-space-1);
}

/* Distance in list row */
.fm-row__distance {
	font-size: .75rem;
	color: var(--gsg-green);
	font-weight: 600;
}

/* Restaurant archive — ZIP strip */
.restaurant-zip-strip {
	background: #f8faf8;
	border-top: 1px solid var(--gsg-border);
	border-bottom: 1px solid var(--gsg-border);
	padding: var(--gsg-space-3) 0;
}

.restaurant-zip-strip__form {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--gsg-space-3);
}

.restaurant-zip-strip__label {
	font-size: .9rem;
	font-weight: 600;
	color: var(--gsg-text);
	white-space: nowrap;
}

.restaurant-zip-strip__input,
.restaurant-zip-strip__select {
	height: 38px;
	padding: 0 var(--gsg-space-3);
	border: 1.5px solid var(--gsg-border);
	border-radius: var(--gsg-radius);
	font-size: .9rem;
	color: var(--gsg-text);
	background: #fff;
	appearance: none;
	-webkit-appearance: none;
}

.restaurant-zip-strip__input {
	width: 110px;
}

.restaurant-zip-strip__select {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='%23666' d='M4 6l4 4 4-4'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right var(--gsg-space-2) center;
	padding-right: var(--gsg-space-7);
	min-width: 110px;
}

.restaurant-zip-strip__btn {
	height: 38px;
	padding: 0 var(--gsg-space-4);
	background: #1E4D35;
	color: #fff;
	font-size: .875rem;
	font-weight: 700;
	border: none;
	border-radius: var(--gsg-radius);
	cursor: pointer;
	white-space: nowrap;
	transition: background .15s;
}

.restaurant-zip-strip__btn:hover {
	background: #163d29;
}

.restaurant-zip-strip__clear {
	display: inline-flex;
	align-items: center;
	height: 38px;
	padding: 0 var(--gsg-space-3);
	font-size: var(--gsg-text-sm);
	color: var(--gsg-text-muted, #6b7280);
	background: transparent;
	border: 1px solid var(--gsg-border);
	border-radius: 6px;
	cursor: pointer;
	text-decoration: none;
}

.restaurant-zip-strip__clear:hover {
	color: var(--gsg-red, #c0392b);
	border-color: var(--gsg-red, #c0392b);
}

.restaurant-zip-strip__error {
	font-size: var(--gsg-text-sm);
	color: var(--gsg-red, #c0392b);
	font-weight: 500;
	margin-bottom: var(--gsg-space-2);
}

@media (max-width: 600px) {
	.restaurant-zip-strip__form {
		gap: var(--gsg-space-2);
	}
	.restaurant-zip-strip__input,
	.restaurant-zip-strip__select,
	.restaurant-zip-strip__btn {
		flex: 1 1 auto;
	}
	.food-map-filters__divider {
		display: none;
	}
	.food-map-filters__input {
		width: 100%;
	}
}

/* ---- Leaflet custom marker ---- */

.gsg-food-marker {
	background: none;
	border: none;
}

/* ---- Responsive ---- */

@media (max-width: 768px) {
	.food-map-filters__form {
		flex-direction: column;
		gap: var(--gsg-space-3);
	}

	.food-map-filters__field {
		flex: 1 1 100%;
	}

	.food-map-partner-cta__inner {
		flex-direction: column;
		text-align: center;
	}

	.food-map-partner-cta__body {
		max-width: 100%;
	}
}

/* ==========================================================================
   Phase 13.11 — User Dashboards (Influencer + Restaurant Owner)
   ========================================================================== */

/* ---- Dashboard Shell ---- */

.gsg-dashboard {
	min-height: 100vh;
	background: var(--gsg-surface-page);
}

/* ---- Dashboard Header ---- */

.gsg-dashboard__header {
	background: var(--gsg-green-primary, #1E4D35);
	color: #fff;
	padding: var(--gsg-space-8) 0;
}

.gsg-dashboard__header-inner {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 var(--gsg-space-6);
	display: flex;
	align-items: center;
	gap: var(--gsg-space-6);
	flex-wrap: wrap;
}

.gsg-dashboard__avatar {
	flex-shrink: 0;
}

.gsg-dashboard__avatar-img {
	width: 80px;
	height: 80px;
	border-radius: 50%;
	border: 3px solid rgba(255, 255, 255, 0.4);
	object-fit: cover;
}

.gsg-dashboard__identity {
	flex: 1;
}

.gsg-dashboard__name {
	font-size: clamp(1.4rem, 3vw, 2rem);
	font-weight: 700;
	color: #fff;
	margin-bottom: var(--gsg-space-1);
}

.gsg-dashboard__role-label {
	font-size: var(--gsg-text-sm);
	color: rgba(255, 255, 255, 0.7);
	text-transform: uppercase;
	letter-spacing: 0.05em;
	margin-bottom: var(--gsg-space-2);
}

.gsg-dashboard__profile-link {
	color: var(--gsg-amber-400, #fbbf24);
	font-size: var(--gsg-text-sm);
	font-weight: 600;
	text-decoration: none;
}

.gsg-dashboard__profile-link:hover {
	color: #fff;
}

.gsg-dashboard__header-actions {
	margin-left: auto;
}

/* ---- Tabs Bar ---- */

.gsg-dashboard__tabs-bar {
	background: #fff;
	border-bottom: 2px solid var(--gsg-border-light, #e5e7eb);
	position: sticky;
	top: 0;
	z-index: 100;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

.gsg-dashboard__tabs-inner {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 var(--gsg-space-6);
	display: flex;
	gap: 0;
}

.gsg-dashboard__tab {
	background: none;
	border: none;
	border-bottom: 3px solid transparent;
	padding: var(--gsg-space-4) var(--gsg-space-6);
	font-size: var(--gsg-text-base);
	font-weight: 600;
	color: var(--gsg-text-muted);
	cursor: pointer;
	transition: color var(--gsg-transition-fast), border-color var(--gsg-transition-fast);
	margin-bottom: -2px;
}

.gsg-dashboard__tab:hover {
	color: var(--gsg-green-primary, #1E4D35);
}

.gsg-dashboard__tab--active {
	color: var(--gsg-green-primary, #1E4D35);
	border-bottom-color: var(--gsg-green-primary, #1E4D35);
}

/* ---- Dashboard Body ---- */

.gsg-dashboard__body {
	max-width: 1200px;
	margin: 0 auto;
	padding: var(--gsg-space-10) var(--gsg-space-6);
}

/* ---- Tab Panes ---- */

.gsg-dashboard__pane {
	display: none;
}

.gsg-dashboard__pane--active {
	display: block;
}

/* ---- Coming Soon Placeholder ---- */

.gsg-dashboard__coming-soon {
	text-align: center;
	max-width: 540px;
	margin: 0 auto;
	padding: var(--gsg-space-16) var(--gsg-space-6);
}

.gsg-dashboard__coming-soon-icon {
	font-size: 4rem;
	margin-bottom: var(--gsg-space-4);
}

.gsg-dashboard__coming-soon h2 {
	font-size: clamp(1.4rem, 3vw, 1.8rem);
	color: var(--gsg-text-primary);
	margin-bottom: var(--gsg-space-4);
}

.gsg-dashboard__coming-soon p {
	color: var(--gsg-text-secondary, #4b5563);
	font-size: var(--gsg-text-base);
	line-height: 1.7;
	margin-bottom: var(--gsg-space-3);
}

.gsg-dashboard__coming-soon-note {
	display: inline-block;
	background: var(--gsg-surface-section, #f3f4f6);
	color: var(--gsg-text-muted);
	font-size: var(--gsg-text-sm);
	font-weight: 600;
	padding: var(--gsg-space-2) var(--gsg-space-4);
	border-radius: var(--gsg-radius-pill);
	margin-top: var(--gsg-space-2);
}

/* ---- Notices ---- */

.gsg-dashboard__notice {
	padding: var(--gsg-space-4) var(--gsg-space-6);
	border-radius: var(--gsg-radius-md);
	font-size: var(--gsg-text-sm);
	margin-top: var(--gsg-space-4);
}

.gsg-dashboard__notice--warn {
	background: #fef9c3;
	color: #713f12;
	border: 1px solid #fde047;
}

/* ---- Outline White Button ---- */

.gsg-btn--outline-white {
	display: inline-flex;
	align-items: center;
	padding: var(--gsg-space-2) var(--gsg-space-5);
	border: 2px solid rgba(255, 255, 255, 0.6);
	border-radius: var(--gsg-radius-pill);
	color: #fff;
	font-weight: 600;
	font-size: var(--gsg-text-sm);
	text-decoration: none;
	transition: border-color var(--gsg-transition-fast), background var(--gsg-transition-fast);
}

.gsg-btn--outline-white:hover {
	border-color: #fff;
	background: rgba(255, 255, 255, 0.1);
	color: #fff;
}

/* ---- Responsive ---- */

@media (max-width: 640px) {
	.gsg-dashboard__header-inner {
		flex-direction: column;
		align-items: flex-start;
		gap: var(--gsg-space-4);
	}

	.gsg-dashboard__header-actions {
		margin-left: 0;
	}

	.gsg-dashboard__tab {
		padding: var(--gsg-space-3) var(--gsg-space-4);
		font-size: var(--gsg-text-sm);
	}
}

/* ==========================================================================
   Phase 13.12 — Influencer Dashboard: Profile Editor
   ========================================================================== */

/* ---- Profile Editor Layout ---- */

.gsg-profile-editor {
	max-width: 680px;
}

/* ---- Photo Section ---- */

.gsg-profile-editor__photo-section {
	margin-bottom: var(--gsg-space-10);
}

.gsg-profile-editor__photo-wrap {
	display: flex;
	align-items: center;
	gap: var(--gsg-space-6);
	flex-wrap: wrap;
}

.gsg-profile-editor__photo-img {
	width: 120px;
	height: 120px;
	border-radius: 50%;
	object-fit: cover;
	border: 3px solid var(--gsg-border-light, #e5e7eb);
	flex-shrink: 0;
}

.gsg-profile-editor__photo-btn {
	display: inline-flex;
	align-items: center;
	gap: var(--gsg-space-2);
	padding: var(--gsg-space-2) var(--gsg-space-5);
	background: var(--gsg-green-primary, #1E4D35);
	color: #fff;
	border-radius: var(--gsg-radius-pill);
	font-size: var(--gsg-text-sm);
	font-weight: 600;
	cursor: pointer;
	transition: background var(--gsg-transition-fast);
}

.gsg-profile-editor__photo-btn:hover {
	background: #163a28;
}

.gsg-profile-editor__photo-input {
	position: absolute;
	width: 1px;
	height: 1px;
	opacity: 0;
	pointer-events: none;
}

.gsg-profile-editor__photo-hint {
	margin-top: var(--gsg-space-3);
	font-size: var(--gsg-text-sm);
	color: var(--gsg-text-muted);
}

/* ---- Section Title ---- */

.gsg-profile-editor__section-title {
	font-size: var(--gsg-text-sm);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.07em;
	color: var(--gsg-text-muted);
	padding-bottom: var(--gsg-space-3);
	margin-top: var(--gsg-space-8);
	margin-bottom: var(--gsg-space-4);
	border-bottom: 1px solid var(--gsg-border-light, #e5e7eb);
}

.gsg-profile-editor__section-title:first-child {
	margin-top: 0;
}

/* ---- Form Fields ---- */

.gsg-field {
	margin-bottom: var(--gsg-space-5);
}

.gsg-field__label {
	display: block;
	font-size: var(--gsg-text-sm);
	font-weight: 600;
	color: var(--gsg-text-primary);
	margin-bottom: var(--gsg-space-2);
}

.gsg-field__input,
.gsg-field__textarea {
	width: 100%;
	padding: var(--gsg-space-3) var(--gsg-space-4);
	border: 1px solid var(--gsg-border-light, #d1d5db);
	border-radius: var(--gsg-radius-md);
	font-size: var(--gsg-text-base);
	color: var(--gsg-text-primary);
	background: #fff;
	transition: border-color var(--gsg-transition-fast), box-shadow var(--gsg-transition-fast);
	box-sizing: border-box;
}

.gsg-field__input:focus,
.gsg-field__textarea:focus {
	outline: none;
	border-color: var(--gsg-green-primary, #1E4D35);
	box-shadow: 0 0 0 3px rgba(30, 77, 53, 0.12);
}

.gsg-field__textarea {
	resize: vertical;
	min-height: 120px;
	line-height: 1.6;
}

.gsg-field__hint {
	margin-top: var(--gsg-space-2);
	font-size: var(--gsg-text-sm);
	color: var(--gsg-text-muted);
}

/* Prefix (@ sign) input */

.gsg-field__input-wrap--prefix {
	display: flex;
	align-items: stretch;
	border: 1px solid var(--gsg-border-light, #d1d5db);
	border-radius: var(--gsg-radius-md);
	overflow: hidden;
	transition: border-color var(--gsg-transition-fast), box-shadow var(--gsg-transition-fast);
}

.gsg-field__input-wrap--prefix:focus-within {
	border-color: var(--gsg-green-primary, #1E4D35);
	box-shadow: 0 0 0 3px rgba(30, 77, 53, 0.12);
}

.gsg-field__prefix {
	display: flex;
	align-items: center;
	padding: 0 var(--gsg-space-3);
	background: var(--gsg-surface-section, #f3f4f6);
	color: var(--gsg-text-muted);
	font-weight: 600;
	font-size: var(--gsg-text-base);
	border-right: 1px solid var(--gsg-border-light, #d1d5db);
	flex-shrink: 0;
}

.gsg-field__input-wrap--prefix .gsg-field__input {
	border: none;
	border-radius: 0;
	flex: 1;
	box-shadow: none;
}

.gsg-field__input-wrap--prefix .gsg-field__input:focus {
	box-shadow: none;
	border-color: transparent;
}

/* Social icon */

.gsg-social-icon {
	margin-right: var(--gsg-space-1);
}

/* ---- Platform Repeater ---- */

.gsg-platform-repeater {
	display: flex;
	flex-direction: column;
	gap: var(--gsg-space-3);
	margin-bottom: var(--gsg-space-4);
}

.gsg-platform-row {
	display: flex;
	gap: var(--gsg-space-3);
	align-items: center;
}

.gsg-platform-row .gsg-field__input {
	margin-bottom: 0;
}

.gsg-platform-row__name {
	flex: 0 0 200px;
}

.gsg-platform-row__url {
	flex: 1;
}

.gsg-platform-row__remove {
	flex-shrink: 0;
	width: 32px;
	height: 32px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: none;
	border: 1px solid var(--gsg-border-light, #d1d5db);
	border-radius: var(--gsg-radius-md);
	color: var(--gsg-text-muted);
	font-size: 1.2rem;
	cursor: pointer;
	transition: background var(--gsg-transition-fast), color var(--gsg-transition-fast);
}

.gsg-platform-row__remove:hover {
	background: #fee2e2;
	color: #b91c1c;
	border-color: #fca5a5;
}

.gsg-profile-editor__add-platform-btn {
	background: none;
	border: 1px dashed var(--gsg-border-light, #d1d5db);
	border-radius: var(--gsg-radius-md);
	padding: var(--gsg-space-2) var(--gsg-space-5);
	font-size: var(--gsg-text-sm);
	font-weight: 600;
	color: var(--gsg-text-muted);
	cursor: pointer;
	transition: border-color var(--gsg-transition-fast), color var(--gsg-transition-fast);
}

.gsg-profile-editor__add-platform-btn:hover {
	border-color: var(--gsg-green-primary, #1E4D35);
	color: var(--gsg-green-primary, #1E4D35);
}

/* ---- Save Row ---- */

.gsg-profile-editor__save-row {
	display: flex;
	align-items: center;
	gap: var(--gsg-space-6);
	margin-top: var(--gsg-space-8);
	padding-top: var(--gsg-space-6);
	border-top: 1px solid var(--gsg-border-light, #e5e7eb);
	flex-wrap: wrap;
}

.gsg-profile-editor__save-btn {
	padding: var(--gsg-space-3) var(--gsg-space-8);
	background: var(--gsg-green-primary, #1E4D35);
	color: #fff;
	border: none;
	border-radius: var(--gsg-radius-pill);
	font-size: var(--gsg-text-base);
	font-weight: 700;
	cursor: pointer;
	transition: background var(--gsg-transition-fast), opacity var(--gsg-transition-fast);
}

.gsg-profile-editor__save-btn:hover {
	background: #163a28;
}

.gsg-profile-editor__save-btn:disabled {
	opacity: 0.6;
	cursor: not-allowed;
}

/* ---- Status Messages ---- */

.gsg-profile-editor__status {
	display: none;
	font-size: var(--gsg-text-sm);
	font-weight: 600;
	padding: var(--gsg-space-2) var(--gsg-space-4);
	border-radius: var(--gsg-radius-md);
}

.gsg-profile-editor__status--success {
	background: #dcfce7;
	color: #15803d;
}

.gsg-profile-editor__status--error {
	background: #fee2e2;
	color: #b91c1c;
}

/* ---- Responsive ---- */

@media (max-width: 640px) {
	.gsg-profile-editor__photo-wrap {
		flex-direction: column;
		align-items: flex-start;
	}

	.gsg-platform-row {
		flex-wrap: wrap;
	}

	.gsg-platform-row__name {
		flex: 1 1 100%;
	}

	.gsg-platform-row__url {
		flex: 1;
	}
}

/* ==========================================================================
   Phase 13.13 — Restaurant Dashboard: Reports Tab
   ========================================================================== */

/* ---- Photo Upload Controls ---- */

.gsg-restaurant-photo-upload {
	margin-top: var(--gsg-space-10);
	padding-top: var(--gsg-space-8);
	border-top: 1px solid var(--gsg-border-light, #e5e7eb);
}

.gsg-restaurant-photo-upload__controls {
	margin-top: var(--gsg-space-4);
	margin-bottom: var(--gsg-space-3);
}

/* ---- Reports Header ---- */

.gsg-reports {
	max-width: 900px;
}

.gsg-reports__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--gsg-space-6);
	margin-bottom: var(--gsg-space-8);
	flex-wrap: wrap;
}

.gsg-reports__heading {
	font-size: clamp(1.2rem, 3vw, 1.6rem);
	font-weight: 700;
	color: var(--gsg-text-primary);
	margin: 0;
}

/* ---- Date Presets ---- */

.gsg-date-presets {
	display: flex;
	gap: var(--gsg-space-2);
	flex-wrap: wrap;
}

.gsg-date-preset {
	padding: var(--gsg-space-2) var(--gsg-space-4);
	border: 1px solid var(--gsg-border-light, #d1d5db);
	border-radius: var(--gsg-radius-pill);
	background: #fff;
	color: var(--gsg-text-secondary, #4b5563);
	font-size: var(--gsg-text-sm);
	font-weight: 600;
	cursor: pointer;
	transition: background var(--gsg-transition-fast), color var(--gsg-transition-fast), border-color var(--gsg-transition-fast);
}

.gsg-date-preset:hover {
	border-color: var(--gsg-green-primary, #1E4D35);
	color: var(--gsg-green-primary, #1E4D35);
}

.gsg-date-preset--active {
	background: var(--gsg-green-primary, #1E4D35);
	border-color: var(--gsg-green-primary, #1E4D35);
	color: #fff;
}

.gsg-date-preset--active:hover {
	color: #fff;
}

/* ---- Loading ---- */

.gsg-reports__loading {
	padding: var(--gsg-space-12) var(--gsg-space-6);
	text-align: center;
	color: var(--gsg-text-muted);
	font-size: var(--gsg-text-base);
}

/* ---- Sections ---- */

.gsg-reports__section {
	margin-bottom: var(--gsg-space-10);
}

.gsg-reports__section-title {
	font-size: var(--gsg-text-sm);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.07em;
	color: var(--gsg-text-muted);
	margin-bottom: var(--gsg-space-4);
	padding-bottom: var(--gsg-space-3);
	border-bottom: 1px solid var(--gsg-border-light, #e5e7eb);
}

/* ---- Stats Grid ---- */

.gsg-stats-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
	gap: var(--gsg-space-4);
}

.gsg-stats-card {
	background: #fff;
	border: 1px solid var(--gsg-border-light, #e5e7eb);
	border-radius: var(--gsg-radius-lg);
	padding: var(--gsg-space-6) var(--gsg-space-5);
	text-align: center;
}

.gsg-stats-card--accent {
	border-top: 3px solid var(--gsg-amber-500, #E07B39);
}

.gsg-stats-card__value {
	font-size: clamp(1.6rem, 4vw, 2.4rem);
	font-weight: 800;
	color: var(--gsg-green-primary, #1E4D35);
	line-height: 1.1;
	margin-bottom: var(--gsg-space-2);
}

.gsg-stats-card--accent .gsg-stats-card__value {
	color: var(--gsg-amber-600, #c2570e);
}

.gsg-stats-card__label {
	font-size: var(--gsg-text-sm);
	color: var(--gsg-text-muted);
	font-weight: 500;
}

/* ---- Directions Callout ---- */

.gsg-directions-callout {
	display: flex;
	align-items: center;
	gap: var(--gsg-space-4);
	background: #ecfdf5;
	border: 1px solid #6ee7b7;
	border-radius: var(--gsg-radius-lg);
	padding: var(--gsg-space-5) var(--gsg-space-6);
	margin-bottom: var(--gsg-space-10);
	font-size: var(--gsg-text-base);
	color: #065f46;
	font-weight: 600;
}

.gsg-directions-callout__icon {
	font-size: 1.6rem;
	flex-shrink: 0;
}

/* ---- Reports Table ---- */

.gsg-reports-table {
	width: 100%;
	border-collapse: collapse;
	font-size: var(--gsg-text-sm);
}

.gsg-reports-table th,
.gsg-reports-table td {
	padding: var(--gsg-space-3) var(--gsg-space-4);
	text-align: left;
	border-bottom: 1px solid var(--gsg-border-light, #e5e7eb);
}

.gsg-reports-table th {
	font-weight: 700;
	color: var(--gsg-text-muted);
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	background: var(--gsg-surface-section, #f9fafb);
}

.gsg-reports-table tbody tr:hover {
	background: var(--gsg-surface-section, #f9fafb);
}

.gsg-reports-table td a {
	color: var(--gsg-green-primary, #1E4D35);
	font-weight: 600;
	text-decoration: none;
}

.gsg-reports-table td a:hover {
	text-decoration: underline;
}

.gsg-reports-table__num {
	text-align: right !important;
	font-variant-numeric: tabular-nums;
	font-weight: 600;
}

/* ---- Responsive ---- */

@media (max-width: 640px) {
	.gsg-reports__header {
		flex-direction: column;
		align-items: flex-start;
	}

	.gsg-stats-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.gsg-reports-table {
		font-size: 12px;
	}

	.gsg-reports-table th,
	.gsg-reports-table td {
		padding: var(--gsg-space-2) var(--gsg-space-3);
	}
}

/* =============================================================================
   Phase 13.15 — Influencer Content Tab
   ============================================================================= */

.gsg-content-panel {
	background: #fff;
	border: 1px solid #e8eaec;
	border-radius: 10px;
	padding: 28px 32px;
	margin-bottom: 24px;
}

.gsg-content-panel__title {
	font-size: 1.15rem;
	font-weight: 700;
	color: var(--gsg-green);
	margin: 0 0 6px;
}

.gsg-content-panel__desc {
	color: #666;
	font-size: 0.9rem;
	margin: 0 0 22px;
	line-height: 1.5;
}

.gsg-content-panel__empty {
	color: #888;
	font-style: italic;
	margin: 0;
}

/* Two-column field row */
.gsg-field-row {
	display: flex;
	gap: 16px;
	align-items: flex-start;
}

.gsg-field-row .gsg-field {
	flex: 0 0 auto;
}

.gsg-field-row .gsg-field--grow {
	flex: 1 1 0;
	min-width: 0;
}

/* Select styling (matches .gsg-field__input) */
.gsg-field__select {
	display: block;
	width: 100%;
	padding: 10px 14px;
	border: 1.5px solid #d0d5dd;
	border-radius: 8px;
	font-size: 0.95rem;
	color: var(--gsg-navy);
	background: #fff;
	appearance: auto;
	transition: border-color 0.15s;
}

.gsg-field__select:focus {
	outline: none;
	border-color: var(--gsg-green);
	box-shadow: 0 0 0 3px rgba(30, 77, 53, 0.12);
}

/* File input */
.gsg-field__file {
	display: block;
	font-size: 0.9rem;
	color: #555;
	cursor: pointer;
}

/* Required asterisk */
.gsg-field__required {
	color: #c0392b;
	margin-left: 2px;
}

/* Submissions table */
.gsg-submissions-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 0.9rem;
}

.gsg-submissions-table th,
.gsg-submissions-table td {
	text-align: left;
	padding: 10px 14px;
	border-bottom: 1px solid #f0f2f4;
}

.gsg-submissions-table th {
	font-weight: 600;
	color: #555;
	font-size: 0.8rem;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	background: #f8f9fa;
}

.gsg-submissions-table td a {
	color: var(--gsg-green);
	text-decoration: none;
}

.gsg-submissions-table td a:hover {
	text-decoration: underline;
}

/* Status badges */
.gsg-status-badge {
	display: inline-block;
	padding: 3px 10px;
	border-radius: 20px;
	font-size: 0.78rem;
	font-weight: 600;
	letter-spacing: 0.02em;
}

.gsg-status-badge--live {
	background: #e8f5ee;
	color: #1a6b3c;
}

.gsg-status-badge--pending {
	background: #fff4e0;
	color: #a05a00;
}

@media (max-width: 640px) {
	.gsg-content-panel {
		padding: 20px 18px;
	}

	.gsg-field-row {
		flex-direction: column;
	}

	.gsg-field-row .gsg-field,
	.gsg-field-row .gsg-field--grow {
		width: 100%;
	}
}

/* ==========================================================================
   Phase 13.16 — Food Trails
   ========================================================================== */

/* ---- Trail Card (archive grid) ------------------------------------------ */

.food-trail-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
	gap: 28px;
}

.trail-card {
	background: #fff;
	border-radius: 12px;
	overflow: hidden;
	box-shadow: 0 2px 12px rgba(0,0,0,.08);
	transition: transform .2s, box-shadow .2s;
	display: flex;
	flex-direction: column;
}
.trail-card:hover {
	transform: translateY(-3px);
	box-shadow: 0 6px 20px rgba(0,0,0,.12);
}

.trail-card__image-link { display: block; text-decoration: none; }

.trail-card__image-wrap {
	position: relative;
	aspect-ratio: 16/9;
	overflow: hidden;
	background: #e8f0eb;
}

.trail-card__image {
	width: 100%; height: 100%;
	object-fit: cover;
	transition: transform .3s;
}
.trail-card:hover .trail-card__image { transform: scale(1.04); }

.trail-card__image-placeholder {
	width: 100%; height: 100%;
	display: flex; align-items: center; justify-content: center;
	font-size: 3rem;
}

.trail-card__stop-badge {
	position: absolute;
	top: 10px; right: 10px;
	background: var(--color-amber, #E07B39);
	color: #fff;
	font-size: 12px;
	font-weight: 700;
	padding: 3px 9px;
	border-radius: 20px;
	letter-spacing: .3px;
}

.trail-card__body {
	padding: 18px 20px 20px;
	display: flex;
	flex-direction: column;
	flex: 1;
}

.trail-card__title {
	font-size: 1.1rem;
	font-weight: 700;
	margin: 0 0 8px;
	line-height: 1.35;
}
.trail-card__title a { color: var(--color-green, #1E4D35); text-decoration: none; }
.trail-card__title a:hover { color: var(--color-amber, #E07B39); }

.trail-card__stops {
	font-size: 13px;
	color: #555;
	margin: 0 0 8px;
	line-height: 1.5;
}
.trail-card__more {
	font-size: 12px;
	color: var(--color-amber, #E07B39);
	font-weight: 600;
}

.trail-card__excerpt {
	font-size: 13px;
	color: #666;
	margin: 0 0 12px;
	flex: 1;
}

.trail-card__footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-top: auto;
	padding-top: 12px;
	border-top: 1px solid #f0f0f0;
	gap: 10px;
}

.trail-card__author {
	font-size: 12px;
	color: #888;
}

.trail-card__cta {
	font-size: 13px;
	font-weight: 700;
	color: var(--color-amber, #E07B39);
	text-decoration: none;
	white-space: nowrap;
}
.trail-card__cta:hover { text-decoration: underline; }

/* ---- Archive CTA Bar ---------------------------------------------------- */

.trail-archive-cta {
	background: var(--color-green, #1E4D35);
	color: #fff;
	padding: 48px 0;
	margin-top: 60px;
}

.trail-archive-cta__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 32px;
	flex-wrap: wrap;
}

.trail-archive-cta__text h2 {
	font-size: 1.6rem;
	font-weight: 700;
	margin: 0 0 8px;
	color: #fff;
}

.trail-archive-cta__text p {
	color: rgba(255,255,255,.85);
	margin: 0;
}

/* ---- Single Trail ------------------------------------------------------- */

.trail-single__hero {
	background: var(--color-green, #1E4D35);
	padding: 56px 0 48px;
	position: relative;
}

.trail-single__hero--has-image::before {
	content: '';
	position: absolute; inset: 0;
	background-image: var(--hero-image);
	background-size: cover;
	background-position: center;
	opacity: .25;
}

.trail-single__hero-inner {
	position: relative;
	z-index: 1;
}

.trail-single__type-badge {
	display: inline-block;
	background: rgba(255,255,255,.2);
	color: #fff;
	font-size: 12px;
	font-weight: 700;
	padding: 4px 12px;
	border-radius: 20px;
	text-transform: uppercase;
	letter-spacing: .5px;
	margin-bottom: 14px;
}
.trail-single__type-badge--curated {
	background: var(--color-amber, #E07B39);
}

.trail-single__title {
	font-size: clamp(1.6rem, 4vw, 2.4rem);
	font-weight: 800;
	color: #fff;
	margin: 0 0 12px;
	line-height: 1.2;
}

.trail-single__meta {
	color: rgba(255,255,255,.85);
	font-size: 15px;
	margin: 0;
}
.trail-single__meta a { color: #fff; text-decoration: underline; }

/* Share bar */
.trail-single__share-bar {
	background: #f7f7f5;
	border-bottom: 1px solid #e8e8e5;
	padding: 12px 0;
}
.trail-single__share-bar-inner {
	display: flex;
	align-items: center;
	gap: 12px;
	flex-wrap: wrap;
}
.trail-single__share-label {
	font-size: 13px;
	font-weight: 600;
	color: #555;
}
.trail-single__share-btns {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
}
.trail-single__copy-confirm {
	font-size: 13px;
	color: var(--color-green, #1E4D35);
	font-weight: 600;
}

.trail-share-btn {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 6px 14px;
	border-radius: 20px;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
	text-decoration: none;
	border: 1px solid #ddd;
	background: #fff;
	color: #333;
	transition: background .15s, border-color .15s;
}
.trail-share-btn:hover { background: #f0f0f0; border-color: #bbb; }

.trail-share-btn--copy   { border-color: var(--color-green, #1E4D35); color: var(--color-green, #1E4D35); }
.trail-share-btn--email  { border-color: #666; color: #333; }
.trail-share-btn--facebook { background: #1877f2; color: #fff; border-color: #1877f2; }
.trail-share-btn--facebook:hover { background: #166fe5; }
.trail-share-btn--twitter  { background: #000; color: #fff; border-color: #000; }
.trail-share-btn--twitter:hover  { background: #333; }

/* Two-column layout */
.trail-single__layout {
	display: grid;
	grid-template-columns: 1fr 380px;
	gap: 48px;
	align-items: start;
}
@media (max-width: 900px) {
	.trail-single__layout { grid-template-columns: 1fr; }
}

.trail-single__description { margin-bottom: 32px; padding: 0 24px; }
.trail-single__description p { max-width: 72ch; }
.trail-single__stops-heading {
	font-size: 1.25rem;
	font-weight: 700;
	color: var(--color-green, #1E4D35);
	margin: 0 0 20px;
}

/* Stop list */
.trail-stop-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.trail-stop {
	display: flex;
	gap: 16px;
	align-items: flex-start;
}

.trail-stop__number {
	flex-shrink: 0;
	width: 36px; height: 36px;
	border-radius: 50%;
	background: var(--color-amber, #E07B39);
	color: #fff;
	font-size: 15px;
	font-weight: 800;
	display: flex; align-items: center; justify-content: center;
	margin-top: 2px;
}

.trail-stop__content { flex: 1; min-width: 0; }

.trail-stop__card {
	background: #fff;
	border: 1px solid #eee;
	border-radius: 10px;
	padding: 14px 16px;
	display: flex;
	gap: 14px;
	align-items: flex-start;
}

.trail-stop__thumb-link { flex-shrink: 0; }
.trail-stop__thumb {
	width: 90px; height: 64px;
	object-fit: cover;
	border-radius: 6px;
	display: block;
}

.trail-stop__info { flex: 1; min-width: 0; }

.trail-stop__name {
	font-size: 1rem;
	font-weight: 700;
	margin: 0 0 4px;
}
.trail-stop__name a { color: var(--color-green, #1E4D35); text-decoration: none; }
.trail-stop__name a:hover { color: var(--color-amber, #E07B39); }

.trail-stop__city {
	font-size: 13px;
	color: #666;
	margin: 0 0 6px;
}

.trail-stop__cuisines {
	display: flex;
	flex-wrap: wrap;
	gap: 5px;
	margin-bottom: 10px;
}
.trail-stop__cuisine-tag {
	font-size: 11px;
	font-weight: 600;
	padding: 2px 8px;
	background: #eef5ef;
	color: var(--color-green, #1E4D35);
	border-radius: 10px;
}

.trail-stop__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}
.trail-stop__btn {
	font-size: 12px;
	font-weight: 600;
	padding: 4px 10px;
	border-radius: 6px;
	background: #f5f5f5;
	color: #333;
	text-decoration: none;
	border: 1px solid #ddd;
	white-space: nowrap;
	transition: background .15s;
}
.trail-stop__btn:hover { background: #eee; }
.trail-stop__btn--phone { font-size: 14px; }

/* Map sidebar */
.trail-single__map-sticky {
	position: sticky;
	top: 90px;
}
.trail-single__map {
	width: 100%;
	height: 400px;
	border-radius: 10px;
	overflow: hidden;
}
@media (max-width: 900px) {
	.trail-single__map { height: 280px; margin-bottom: 32px; }
	.trail-single__map-sticky { position: static; }
}
.trail-single__map-attr {
	font-size: 11px;
	color: #888;
	margin: 6px 0 0;
}
.trail-single__map-attr a { color: inherit; }

/* Numbered map pins */
.trail-map-pin {
	width: 32px; height: 32px;
	background: var(--color-amber, #E07B39);
	color: #fff;
	border-radius: 50% 50% 50% 0;
	transform: rotate(-45deg);
	font-size: 12px;
	font-weight: 800;
	display: flex; align-items: center; justify-content: center;
	box-shadow: 0 2px 6px rgba(0,0,0,.3);
}
.trail-map-pin > span,
.trail-map-pin {
	/* counter-rotate the text */
}
.trail-map-pin::after {
	content: attr(data-num);
}
/* Actually just apply transform to children isn't straightforward with divIcon.
   Keep the number visible by counter-rotating. */

/* ---- Personal Trail Builder Panel --------------------------------------- */

.trail-fab {
	position: fixed;
	bottom: 24px; right: 24px;
	z-index: 1000;
	background: var(--color-green, #1E4D35);
	color: #fff;
	border: none;
	border-radius: 50px;
	padding: 12px 20px;
	font-size: 15px;
	font-weight: 700;
	cursor: pointer;
	box-shadow: 0 4px 16px rgba(0,0,0,.25);
	display: none;
	align-items: center;
	gap: 8px;
	transition: background .15s, transform .15s;
}
.trail-fab--visible { display: flex; }
.trail-fab:hover { background: #163d29; transform: translateY(-2px); }

.trail-fab__count {
	background: var(--color-amber, #E07B39);
	color: #fff;
	font-size: 12px;
	font-weight: 800;
	padding: 1px 7px;
	border-radius: 10px;
}

.trail-panel-overlay {
	display: none;
	position: fixed; inset: 0;
	background: rgba(0,0,0,.4);
	z-index: 1099;
}
.trail-panel-overlay--visible { display: block; }

.trail-panel {
	position: fixed;
	right: 0; top: 0; bottom: 0;
	width: 360px; max-width: 95vw;
	background: #fff;
	z-index: 1100;
	display: flex;
	flex-direction: column;
	box-shadow: -4px 0 24px rgba(0,0,0,.15);
	transform: translateX(110%);
	transition: transform .3s cubic-bezier(.25,.8,.25,1);
	overflow: hidden;
}
.trail-panel--open { transform: translateX(0); }

.trail-panel__header {
	background: var(--color-green, #1E4D35);
	color: #fff;
	padding: 16px 20px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-shrink: 0;
}
.trail-panel__title {
	font-size: 16px;
	font-weight: 700;
	margin: 0;
	color: #fff;
	display: flex; align-items: center; gap: 8px;
}
.trail-panel__count {
	background: var(--color-amber, #E07B39);
	color: #fff;
	font-size: 12px;
	font-weight: 800;
	padding: 1px 7px;
	border-radius: 10px;
}
.trail-panel__close {
	background: none; border: none; cursor: pointer;
	color: rgba(255,255,255,.8);
	font-size: 24px; line-height: 1;
	padding: 0; transition: color .15s;
}
.trail-panel__close:hover { color: #fff; }

.trail-panel__name-row {
	padding: 12px 16px;
	border-bottom: 1px solid #eee;
	flex-shrink: 0;
}
.trail-panel__name-input {
	width: 100%; box-sizing: border-box;
	border: 1px solid #ddd; border-radius: 8px;
	padding: 8px 12px; font-size: 14px;
	font-family: inherit;
	transition: border-color .15s;
}
.trail-panel__name-input:focus { outline: none; border-color: var(--color-green, #1E4D35); }

.trail-panel__empty {
	padding: 24px 20px;
	color: #888; font-size: 14px; text-align: center;
}

.trail-panel__list {
	flex: 1;
	overflow-y: auto;
	padding: 8px 0;
	margin: 0;
	list-style: none;
}

.trail-panel__item {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 10px 16px;
	border-bottom: 1px solid #f5f5f5;
}
.trail-panel__item-num {
	flex-shrink: 0;
	width: 24px; height: 24px;
	background: var(--color-amber, #E07B39);
	color: #fff;
	border-radius: 50%;
	font-size: 11px; font-weight: 800;
	display: flex; align-items: center; justify-content: center;
}
.trail-panel__item-thumb {
	width: 40px; height: 40px;
	object-fit: cover;
	border-radius: 6px;
	flex-shrink: 0;
}
.trail-panel__item-thumb--empty {
	display: flex; align-items: center; justify-content: center;
	background: #f0f0f0; border-radius: 6px;
	font-size: 18px;
}
.trail-panel__item-info {
	flex: 1; min-width: 0;
	display: flex; flex-direction: column; gap: 2px;
}
.trail-panel__item-name {
	font-size: 13px; font-weight: 600; color: #222;
	white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.trail-panel__item-city { font-size: 11px; color: #888; }

.trail-panel__item-remove {
	background: none; border: none; cursor: pointer;
	color: #bbb; font-size: 18px; padding: 0 4px; line-height: 1;
	transition: color .15s; flex-shrink: 0;
}
.trail-panel__item-remove:hover { color: #c00; }

.trail-panel__footer {
	padding: 14px 16px;
	border-top: 1px solid #eee;
	flex-shrink: 0;
}
.trail-panel__save-btn {
	width: 100%;
	background: var(--color-amber, #E07B39);
	color: #fff;
	border: none;
	border-radius: 8px;
	padding: 12px;
	font-size: 15px; font-weight: 700;
	cursor: pointer;
	transition: background .15s;
}
.trail-panel__save-btn:hover:not(:disabled) { background: #c96a2b; }
.trail-panel__save-btn:disabled { opacity: .5; cursor: not-allowed; }

.trail-panel__status {
	font-size: 13px;
	margin-top: 8px;
	display: none;
}
.trail-panel__status--error   { color: #c00; }
.trail-panel__status--success { color: #1a7a3a; }

.trail-panel__share-result {
	padding: 14px 16px;
	border-top: 1px solid #eee;
	background: #f9fdf9;
}
.trail-panel__share-label {
	font-size: 14px; font-weight: 700;
	color: var(--color-green, #1E4D35);
	margin: 0 0 8px;
}
.trail-panel__share-url {
	width: 100%; box-sizing: border-box;
	border: 1px solid #ddd; border-radius: 6px;
	padding: 7px 10px; font-size: 12px;
	background: #fff; color: #333;
	margin-bottom: 10px;
}
.trail-panel__share-btns {
	display: flex; flex-wrap: wrap; gap: 6px;
	margin-bottom: 12px;
}
.trail-panel__new-btn {
	width: 100%;
	background: none;
	border: 1px solid #ccc;
	border-radius: 6px;
	padding: 8px;
	font-size: 13px; cursor: pointer;
	color: #555;
	transition: background .15s;
}
.trail-panel__new-btn:hover { background: #f0f0f0; }

/* ---- Toast -------------------------------------------------------------- */

.trail-toast {
	position: fixed;
	bottom: 80px; left: 50%;
	transform: translateX(-50%) translateY(12px);
	background: #222;
	color: #fff;
	padding: 10px 20px;
	border-radius: 24px;
	font-size: 14px; font-weight: 600;
	z-index: 1200;
	opacity: 0;
	transition: opacity .2s, transform .2s;
	pointer-events: none;
	white-space: nowrap;
}
.trail-toast--visible {
	opacity: 1;
	transform: translateX(-50%) translateY(0);
}

/* ---- Add to Trail button ------------------------------------------------ */

.trail-add-btn {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 5px 12px;
	font-size: 12px;
	font-weight: 700;
	border: 1px solid var(--color-green, #1E4D35);
	border-radius: 20px;
	background: #fff;
	color: var(--color-green, #1E4D35);
	cursor: pointer;
	transition: background .15s, color .15s;
	white-space: nowrap;
}
.trail-add-btn:hover { background: var(--color-green, #1E4D35); color: #fff; }
.trail-add-btn--active {
	background: var(--color-green, #1E4D35);
	color: #fff;
}
.trail-add-btn--hero {
	margin-top: 14px;
	font-size: 14px;
	padding: 8px 20px;
	border-color: rgba(255,255,255,.8);
	background: rgba(255,255,255,.15);
	color: #fff;
}
.trail-add-btn--hero:hover,
.trail-add-btn--hero.trail-add-btn--active {
	background: #fff;
	color: var(--color-green, #1E4D35);
}

/* ---- Create Trail form (influencer dashboard) ---------------------------- */

.gsg-trail-restaurant-list {
	max-height: 260px;
	overflow-y: auto;
	border: 1px solid #ddd;
	border-radius: 8px;
	padding: 4px 0;
}

.gsg-trail-restaurant-search { margin-bottom: 6px; }

.gsg-trail-restaurant-item {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	padding: 8px 14px;
	cursor: pointer;
	transition: background .1s;
}
.gsg-trail-restaurant-item:hover { background: #f7faf7; }
.gsg-trail-restaurant-item input[type="checkbox"] { flex-shrink: 0; margin-top: 3px; }
.gsg-trail-restaurant-info { display: flex; flex-direction: column; gap: 2px; flex: 1; }
.gsg-trail-restaurant-name { font-size: 14px; font-weight: 600; line-height: 1.3; }
.gsg-trail-restaurant-meta { font-size: 12px; color: #888; line-height: 1.3; }

.gsg-trail-order-list {
	list-style: none;
	margin: 0; padding: 0;
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.gsg-trail-order-item {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 8px 12px;
	background: #f7faf7;
	border: 1px solid #dce8dc;
	border-radius: 6px;
}
.gsg-trail-order-num {
	flex-shrink: 0;
	width: 24px; height: 24px;
	background: var(--color-amber, #E07B39);
	color: #fff;
	border-radius: 50%;
	font-size: 11px; font-weight: 800;
	display: flex; align-items: center; justify-content: center;
}
.gsg-trail-order-name { flex: 1; font-size: 14px; }
.gsg-trail-order-btns { display: flex; gap: 4px; }
.gsg-trail-order-up,
.gsg-trail-order-down {
	background: none; border: 1px solid #ccc; border-radius: 4px;
	cursor: pointer; padding: 2px 7px; font-size: 13px; color: #555;
	transition: background .1s;
}
.gsg-trail-order-up:hover,
.gsg-trail-order-down:hover { background: #eee; }

/* ---- Trail panel view-row (link to builder page) ------------------------ */

.trail-panel__view-row {
	padding: 10px 16px;
	border-top: 1px solid #e2ebe2;
	background: #f7faf7;
}

.trail-panel__view-link {
	display: block;
	text-align: center;
	font-size: 13px;
	font-weight: 700;
	color: var(--color-green, #1E4D35);
	text-decoration: none;
}
.trail-panel__view-link:hover { text-decoration: underline; }

/* ---- My Trail Builder page ---------------------------------------------- */

.trail-builder-page { padding-bottom: 80px; }

.trail-builder-hero.page-hero {
	background: var(--color-green, #1E4D35);
	padding: 48px 0 36px;
	color: #fff;
}
.trail-builder-hero__title { font-size: 2rem; margin: 0 0 6px; color: #fff; }
.trail-builder-hero__sub { font-size: 1rem; margin: 0; opacity: .85; }

.trail-builder-wrap { max-width: 760px; padding-top: 40px; }

/* Empty state */
.trail-builder-empty {
	text-align: center;
	padding: 60px 20px;
	color: #555;
}
.trail-builder-empty__icon { font-size: 3rem; margin-bottom: 16px; }
.trail-builder-empty h2 { font-size: 1.5rem; margin: 0 0 10px; color: #12263A; }
.trail-builder-empty p { margin: 0 0 24px; }

/* Header row */
.trail-builder-header {
	display: flex;
	align-items: flex-end;
	gap: 16px;
	margin-bottom: 24px;
	flex-wrap: wrap;
}
.trail-builder-name-wrap { flex: 1; min-width: 200px; }
.trail-builder-name-label {
	display: block;
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .05em;
	color: #555;
	margin-bottom: 6px;
}
.trail-builder-name-input {
	width: 100%;
	padding: 10px 14px;
	font-size: 15px;
	border: 2px solid #dce8dc;
	border-radius: 8px;
	outline: none;
	transition: border-color .15s;
	box-sizing: border-box;
}
.trail-builder-name-input:focus { border-color: var(--color-green, #1E4D35); }

.trail-builder-count {
	font-size: 13px;
	color: #777;
	white-space: nowrap;
	padding-bottom: 12px;
}

/* Stop list */
.trail-builder-list {
	list-style: none;
	margin: 0 0 16px;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.trail-builder-stop {
	display: flex;
	align-items: center;
	gap: 12px;
	background: #fff;
	border: 1px solid #dce8dc;
	border-radius: 10px;
	padding: 12px 14px;
	box-shadow: 0 1px 4px rgba(0,0,0,.04);
}

.trail-builder-stop__num {
	flex-shrink: 0;
	width: 28px; height: 28px;
	background: var(--color-amber, #E07B39);
	color: #fff;
	border-radius: 50%;
	font-size: 12px; font-weight: 800;
	display: flex; align-items: center; justify-content: center;
}

.trail-builder-stop__thumb {
	flex-shrink: 0;
	width: 48px; height: 48px;
	border-radius: 6px;
	object-fit: cover;
}
.trail-builder-stop__thumb--placeholder {
	background: #e8efe8;
}

.trail-builder-stop__info {
	flex: 1;
	min-width: 0;
}
.trail-builder-stop__name {
	display: block;
	font-size: 15px;
	font-weight: 700;
	color: #12263A;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.trail-builder-stop__address {
	display: block;
	font-size: 12px;
	color: #888;
	margin-top: 2px;
}

.trail-builder-stop__actions {
	display: flex;
	gap: 4px;
	flex-shrink: 0;
}
.tb-btn-up,
.tb-btn-down,
.tb-btn-remove {
	background: none;
	border: 1px solid #ccc;
	border-radius: 5px;
	cursor: pointer;
	padding: 4px 9px;
	font-size: 13px;
	color: #555;
	transition: background .1s, color .1s;
	line-height: 1;
}
.tb-btn-up:hover, .tb-btn-down:hover { background: #f0f0f0; }
.tb-btn-remove { border-color: #f5c4c4; color: #c0392b; }
.tb-btn-remove:hover { background: #fdecea; }
.tb-btn-up:disabled, .tb-btn-down:disabled { opacity: .35; cursor: not-allowed; }

/* Browse link */
.trail-builder-browse {
	text-align: center;
	margin-bottom: 28px;
}
.trail-builder-browse-link {
	font-size: 13px;
	color: var(--color-green, #1E4D35);
	font-weight: 700;
	text-decoration: none;
}
.trail-builder-browse-link:hover { text-decoration: underline; }

/* Action buttons */
.trail-builder-actions {
	display: flex;
	gap: 12px;
	flex-wrap: wrap;
	margin-bottom: 28px;
}
.trail-builder-save { flex: 1; min-width: 200px; }
.trail-builder-clear { background: #fff; color: #c0392b; border-color: #f5c4c4; }
.trail-builder-clear:hover { background: #fdecea; }

/* Saved state */
.trail-builder-saved {
	background: #f0f9f0;
	border: 2px solid #b2d8b2;
	border-radius: 12px;
	padding: 24px;
	margin-bottom: 20px;
}
.trail-builder-saved__label {
	font-size: 14px;
	font-weight: 700;
	color: #1E4D35;
	margin: 0 0 10px;
}
.trail-builder-saved__link-row {
	display: flex;
	gap: 10px;
	margin-bottom: 10px;
	flex-wrap: wrap;
}
.trail-builder-saved__url {
	flex: 1;
	min-width: 180px;
	padding: 8px 12px;
	font-size: 13px;
	border: 1px solid #b2d8b2;
	border-radius: 6px;
	background: #fff;
	color: #333;
	box-sizing: border-box;
}
.trail-builder-copy { white-space: nowrap; }
.trail-builder-saved__note {
	font-size: 12px;
	color: #555;
	margin: 0 0 16px;
}

/* Error state */
.trail-builder-error {
	background: #fdecea;
	border: 1px solid #f5c4c4;
	border-radius: 8px;
	padding: 14px 18px;
	color: #c0392b;
	font-size: 14px;
}
.trail-builder-error p { margin: 0; }

@media (max-width: 480px) {
	.trail-builder-hero__title { font-size: 1.5rem; color: #fff; }
	.trail-builder-stop__thumb { display: none; }
	.trail-builder-actions { flex-direction: column; }
	.trail-builder-save { min-width: 0; }
}

/* ---- Fun Food & Drink Trails page --------------------------------------- */

.fun-trails-hero { background: var(--color-green, #1E4D35); }

.fun-trails-page { max-width: 1100px; padding-top: 0; }

/* What is a Food Trail explainer */
.fun-trails-explainer {
	background: linear-gradient(135deg, #f0f9f0 0%, #e8f5e8 100%);
	border-left: 4px solid var(--color-amber, #E07B39);
	border-radius: 0 12px 12px 0;
	padding: 28px 32px;
	margin: 40px 0 32px;
}
.fun-trails-explainer__title {
	font-size: 1.1rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: .06em;
	color: var(--color-amber, #E07B39);
	margin: 0 0 10px;
}
.fun-trails-explainer__body {
	font-size: 1.05rem;
	line-height: 1.7;
	color: #12263A;
	margin: 0;
}

/* Intro copy */
.fun-trails-intro {
	margin-bottom: 36px;
}
.fun-trails-intro__content {
	font-size: 1rem;
	line-height: 1.7;
	color: #333;
}
.fun-trails-intro__content p { margin-top: 0; }

/* Trails grid */
.fun-trails-grid-section { margin-bottom: 48px; }
.fun-trails-grid-section__title {
	font-size: 1.5rem;
	color: var(--color-green, #1E4D35);
	margin: 0 0 24px;
}
.fun-trails-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 24px; }

/* Empty state */
.fun-trails-empty {
	text-align: center;
	padding: 48px 20px;
	color: #777;
	font-size: 1rem;
}

/* Build your own CTA */
.fun-trails-build-cta {
	background: var(--color-green, #1E4D35);
	border-radius: 16px;
	padding: 40px;
	text-align: center;
	color: #fff;
	margin: 0 0 60px;
}
.fun-trails-build-cta h2 {
	font-size: 1.5rem;
	margin: 0 0 10px;
	color: #fff;
}
.fun-trails-build-cta p {
	margin: 0 0 24px;
	opacity: .88;
}
.fun-trails-build-cta .btn-primary {
	background: var(--color-amber, #E07B39);
	border-color: var(--color-amber, #E07B39);
	color: #fff;
	margin-right: 12px;
}
.fun-trails-build-cta .btn-secondary {
	background: transparent;
	border: 2px solid rgba(255,255,255,.6);
	color: #fff;
}
.fun-trails-build-cta .btn-secondary:hover { background: rgba(255,255,255,.1); }

@media (max-width: 600px) {
	.fun-trails-explainer { padding: 20px; }
	.fun-trails-build-cta { padding: 28px 20px; }
	.fun-trails-build-cta .btn-primary { margin-right: 0; margin-bottom: 10px; }
}

/* =====================================================================
   Food Experiences Section — Homepage
   ===================================================================== */

.food-exp-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--gsg-space-5);
}

@media (min-width: 768px) {
	.food-exp-grid { grid-template-columns: repeat(3, 1fr); }
}

.food-exp-card {
	display: flex;
	flex-direction: column;
	gap: var(--gsg-space-4);
	padding: var(--gsg-space-8) var(--gsg-space-6);
	border-radius: var(--gsg-radius-xl);
	text-decoration: none;
	transition: transform var(--gsg-transition-base), box-shadow var(--gsg-transition-base);
	border: 1px solid var(--gsg-border-light);
	background: var(--gsg-surface-card);
}

.food-exp-card:hover {
	transform: translateY(-4px);
	box-shadow: var(--gsg-shadow-lg);
}

.food-exp-card__icon {
	font-size: 2.75rem;
	line-height: 1;
}

.food-exp-card__body {
	display: flex;
	flex-direction: column;
	gap: var(--gsg-space-3);
	flex: 1;
}

.food-exp-card__title {
	font-size: var(--gsg-text-xl);
	font-weight: 700;
	color: var(--gsg-text-primary);
	letter-spacing: -0.02em;
}

.food-exp-card__desc {
	font-size: var(--gsg-text-sm);
	color: var(--gsg-text-secondary);
	line-height: 1.65;
	margin-bottom: 0;
	flex: 1;
}

.food-exp-card__cta {
	display: block;
	font-size: var(--gsg-text-sm);
	font-weight: 700;
	color: var(--gsg-green-700);
	margin-top: var(--gsg-space-2);
	transition: color var(--gsg-transition-fast);
}

.food-exp-card:hover .food-exp-card__cta {
	color: var(--gsg-green-600);
}

.food-exp-card--map     { border-top: 3px solid var(--gsg-green-500); }
.food-exp-card--trails  { border-top: 3px solid var(--gsg-amber-500); }
.food-exp-card--restaurants { border-top: 3px solid var(--gsg-green-600); }

.food-exp-card--trails .food-exp-card__cta {
	color: var(--gsg-amber-600);
}

.food-exp-card--trails:hover .food-exp-card__cta {
	color: var(--gsg-amber-700);
}

/* =====================================================================
   NJ Adventure Club Page
   ===================================================================== */

.adventure-club-intro {
	font-size: var(--gsg-text-lg);
	color: var(--gsg-text-secondary);
	line-height: 1.75;
	margin-bottom: var(--gsg-space-12);
	text-align: center;
}

.adventure-club-benefits {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--gsg-space-8);
	margin-bottom: var(--gsg-space-16);
}

@media (min-width: 640px) {
	.adventure-club-benefits { grid-template-columns: repeat(2, 1fr); }
}

.adventure-benefit {
	display: flex;
	gap: var(--gsg-space-4);
	align-items: flex-start;
}

.adventure-benefit__icon {
	font-size: 2rem;
	line-height: 1;
	flex-shrink: 0;
	margin-top: 2px;
}

.adventure-benefit__title {
	font-size: var(--gsg-text-lg);
	font-weight: 700;
	color: var(--gsg-text-primary);
	margin-bottom: var(--gsg-space-2);
}

.adventure-benefit__desc {
	font-size: var(--gsg-text-sm);
	color: var(--gsg-text-secondary);
	line-height: 1.65;
	margin-bottom: 0;
}

.adventure-club-signup {
	background: var(--gsg-green-50);
	border: 1px solid var(--gsg-border-light);
	border-radius: var(--gsg-radius-xl);
	padding: var(--gsg-space-10) var(--gsg-space-8);
	text-align: center;
}

.adventure-club-signup__title {
	font-size: var(--gsg-text-2xl);
	font-weight: 800;
	color: var(--gsg-green-800);
	margin-bottom: var(--gsg-space-2);
}

.adventure-club-signup__subtitle {
	font-size: var(--gsg-text-sm);
	color: var(--gsg-text-muted);
	margin-bottom: var(--gsg-space-6);
}

.adventure-signup-form .email-signup-form__row {
	max-width: 500px;
	margin-inline: auto;
}

/* ===========================================================================
   Restaurant Archive / Cuisine Archive — Dropdown Filter Bar
   =========================================================================== */

.restaurant-filter-bar {
	background: #fff;
	border-bottom: 1px solid var(--gsg-border);
	padding: var(--gsg-space-4) 0;
	position: sticky;
	top: 0;
	z-index: 100;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
}

/* Row holds Category group + divider + form groups */
.restaurant-filter-bar__row {
	display: flex;
	align-items: flex-end;
	gap: var(--gsg-space-4);
	flex-wrap: wrap;
}

/* Each label + select pair */
.restaurant-filter-bar__group {
	display: flex;
	flex-direction: column;
	gap: var(--gsg-space-1);
}

/* The form containing cuisine/town/influencer groups */
.restaurant-filter-bar__form {
	display: flex;
	align-items: flex-end;
	gap: var(--gsg-space-4);
	flex-wrap: wrap;
	margin: 0;
	padding: 0;
}

/* Vertical divider between Category nav and the filter form */
.restaurant-filter-bar__divider {
	width: 1px;
	height: 40px;
	background: var(--gsg-border);
	flex-shrink: 0;
	align-self: flex-end;
	margin-bottom: 2px;
}

.restaurant-filter-bar__label {
	font-size: var(--gsg-text-xs, 0.75rem);
	font-weight: 600;
	color: var(--gsg-text-muted);
	text-transform: uppercase;
	letter-spacing: 0.04em;
	white-space: nowrap;
}

.restaurant-filter-select {
	appearance: none;
	-webkit-appearance: none;
	background-color: #fff;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%231E4D35' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right var(--gsg-space-3) center;
	border: 1.5px solid var(--gsg-border);
	border-radius: var(--gsg-radius-md);
	color: var(--gsg-text-dark);
	cursor: pointer;
	font-size: var(--gsg-text-sm);
	font-weight: 500;
	padding: var(--gsg-space-2) var(--gsg-space-9) var(--gsg-space-2) var(--gsg-space-3);
	min-width: 160px;
	transition: border-color 0.15s, box-shadow 0.15s;
}

.restaurant-filter-select:focus {
	outline: none;
	border-color: var(--gsg-green-700);
	box-shadow: 0 0 0 3px rgba(30, 77, 53, 0.12);
}

.restaurant-filter-select:hover {
	border-color: var(--gsg-green-700);
}

/* Clear filters link */
.restaurant-filter-clear {
	align-self: flex-end;
	font-size: var(--gsg-text-sm);
	color: var(--gsg-text-muted);
	text-decoration: none;
	padding: var(--gsg-space-2) var(--gsg-space-2);
	border-radius: var(--gsg-radius-md);
	white-space: nowrap;
	transition: color 0.15s;
}
.restaurant-filter-clear:hover {
	color: var(--gsg-red, #C0392B);
}

/* Restaurant name search bar (separate row below filter bar) */
.restaurant-name-search {
	background: #f0f4f1;
	border-bottom: 1px solid #d8e4dc;
	padding: 10px 0;
}
.restaurant-name-search__form {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-wrap: wrap;
}
.restaurant-name-search__label {
	font-size: var(--gsg-text-xs, 0.75rem);
	font-weight: 600;
	color: var(--gsg-green-700, #163a27);
	text-transform: uppercase;
	letter-spacing: 0.04em;
	white-space: nowrap;
}
.restaurant-name-search__input {
	flex: 1 1 200px;
	max-width: 380px;
	height: 38px;
	padding: 0 12px;
	border: 1.5px solid var(--gsg-border);
	border-radius: var(--gsg-radius-md);
	font-size: var(--gsg-text-sm);
	background: #fff;
	transition: border-color 0.15s, box-shadow 0.15s;
}
.restaurant-name-search__input:focus {
	outline: none;
	border-color: var(--gsg-green);
	box-shadow: 0 0 0 3px rgba(30,77,53,.12);
}
.restaurant-name-search__btn {
	height: 38px;
	padding: 0 18px;
	background: var(--gsg-green-800, #1E4D35);
	color: #fff;
	border: none;
	border-radius: var(--gsg-radius-md);
	font-size: var(--gsg-text-sm);
	font-weight: 600;
	cursor: pointer;
	transition: background 0.15s;
}
.restaurant-name-search__btn:hover {
	background: var(--gsg-green-700, #2D6A4F);
}
.restaurant-name-search__clear {
	font-size: var(--gsg-text-sm);
	color: var(--gsg-text-muted);
	text-decoration: none;
	transition: color 0.15s;
}
.restaurant-name-search__clear:hover {
	color: var(--gsg-red, #C0392B);
}
@media (max-width: 600px) {
	.restaurant-name-search__input { max-width: 100%; }
}

/* Filter results summary */
.restaurant-filter-summary {
	font-size: var(--gsg-text-sm);
	color: var(--gsg-text-muted);
	margin-bottom: var(--gsg-space-6);
}

@media (max-width: 768px) {
	.restaurant-filter-bar__row {
		flex-direction: column;
		align-items: flex-start;
		gap: var(--gsg-space-3);
	}
	.restaurant-filter-bar__divider {
		width: 100%;
		height: 1px;
		margin: 0;
	}
	.restaurant-filter-bar__form {
		gap: var(--gsg-space-3);
	}
	.restaurant-filter-select {
		min-width: 0;
		width: 100%;
	}
	.restaurant-filter-bar__group {
		width: 100%;
	}
}

/* ==========================================================================
   Homepage — Find Attractions Near You strip
   ========================================================================== */

.hp-zip-search {
	background: linear-gradient(135deg, var(--gsg-green) 0%, #16412c 100%);
	padding: var(--gsg-space-4) 0 var(--gsg-space-2);
}

.hp-zip-search__inner {
	display: flex;
	align-items: center;
	gap: var(--gsg-space-5);
}

.hp-zip-search__text {
	flex: 0 0 260px;
	color: #fff;
}

.hp-zip-search__eyebrow {
	display: block;
	font-size: .8125rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .06em;
	color: #12263A;
	margin-bottom: var(--gsg-space-2);
}

.hp-zip-search__title {
	font-size: 1rem;
	font-weight: 400;
	color: #12263A;
	margin-bottom: 0;
	line-height: 1.4;
}

.hp-zip-search__form {
	flex: 1;
}

.hp-zip-search__fields {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	gap: var(--gsg-space-2);
}

.hp-zip-search__field {
	display: flex;
	flex-direction: column;
	gap: var(--gsg-space-1);
	flex: 1 1 130px;
}

.hp-zip-search__label {
	font-size: .75rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .04em;
	color: #12263A;
}

.hp-zip-search__input,
.hp-zip-search__select {
	height: 46px;
	padding: 0 var(--gsg-space-3);
	border: none;
	border-radius: var(--gsg-radius);
	font-size: .9375rem;
	color: var(--gsg-text);
	background: #fff;
	appearance: none;
	-webkit-appearance: none;
}

.hp-zip-search__select {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='%23666' d='M4 6l4 4 4-4'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right var(--gsg-space-3) center;
	padding-right: var(--gsg-space-8);
}

.hp-zip-search__input:focus,
.hp-zip-search__select:focus {
	outline: 2px solid var(--gsg-amber);
	outline-offset: 2px;
}

.hp-zip-search__btn {
	height: 46px;
	padding: 0 var(--gsg-space-5);
	background: #1E4D35;
	color: #fff;
	font-size: .9375rem;
	font-weight: 700;
	border: 2px solid rgba(255,255,255,.25);
	border-radius: var(--gsg-radius);
	cursor: pointer;
	white-space: nowrap;
	transition: background .15s, transform .1s;
	flex: 0 0 auto;
}

.hp-zip-search__btn:hover {
	background: #163d29;
}

.hp-zip-search__btn:active {
	transform: scale(.98);
}

@media (max-width: 900px) {
	.hp-zip-search__inner {
		flex-direction: column;
		align-items: flex-start;
		gap: var(--gsg-space-3);
	}

	.hp-zip-search__text {
		flex: none;
	}

	.hp-zip-search__form {
		width: 100%;
	}
}

@media (max-width: 600px) {
	.hp-zip-search__fields {
		flex-direction: column;
	}

	.hp-zip-search__field,
	.hp-zip-search__input,
	.hp-zip-search__select,
	.hp-zip-search__btn {
		width: 100%;
		flex: 1 1 100%;
	}
}

/* ==========================================================================
   Find Attractions Near You — Phase 13 (ZIP proximity search)
   ========================================================================== */

/* Hero */
.attraction-search-hero {
	background: linear-gradient(135deg, var(--gsg-green-900) 0%, #0d3322 100%);
}

.attraction-search-hero .page-hero__tagline {
	color: #ffffff;
}

/* Search form section */
.attraction-search-form-section {
	background: #fff;
	border-bottom: 1px solid var(--gsg-border);
	padding: var(--gsg-space-6) 0;
}

.attraction-search-form {
	display: flex;
	flex-wrap: wrap;
	gap: var(--gsg-space-4);
	align-items: flex-end;
	background: #fff;
	border-radius: var(--gsg-radius-lg);
	box-shadow: 0 2px 12px rgba(0,0,0,.08);
	padding: var(--gsg-space-5) var(--gsg-space-6);
}

.attraction-search-form__field {
	display: flex;
	flex-direction: column;
	gap: var(--gsg-space-1);
	flex: 1 1 160px;
}

.attraction-search-form__field--submit {
	flex: 0 0 auto;
	justify-content: flex-end;
}

.attraction-search-form__label {
	font-size: .8125rem;
	font-weight: 600;
	color: var(--gsg-text-muted);
	text-transform: uppercase;
	letter-spacing: .04em;
}

.attraction-search-form__input,
.attraction-search-form__select {
	height: 50px;
	padding: 0 var(--gsg-space-3);
	border: 1.5px solid var(--gsg-border);
	border-radius: var(--gsg-radius);
	font-size: 1rem;
	color: var(--gsg-text);
	background: #fff;
	transition: border-color .15s, box-shadow .15s;
	appearance: none;
	-webkit-appearance: none;
}

.attraction-search-form__select {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='%23666' d='M4 6l4 4 4-4'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right var(--gsg-space-3) center;
	padding-right: var(--gsg-space-8);
}

.attraction-search-form__input:focus,
.attraction-search-form__select:focus {
	outline: none;
	border-color: var(--gsg-green);
	box-shadow: 0 0 0 3px rgba(30, 77, 53, .15);
}

.attraction-search-form__submit {
	height: 50px;
	padding: 0 var(--gsg-space-6);
	white-space: nowrap;
}

/* Results section */
.attraction-search-results-section {
	padding: var(--gsg-space-8) 0 var(--gsg-space-12);
}

/* Toolbar / count bar */
.attraction-search-toolbar {
	margin-bottom: var(--gsg-space-5);
}

.attraction-search-toolbar__count {
	font-size: .9375rem;
	color: var(--gsg-text-muted);
	font-weight: 500;
}

/* Loading */
.attraction-search-loading {
	display: flex;
	align-items: center;
	gap: var(--gsg-space-3);
	padding: var(--gsg-space-8) 0;
	font-size: 1rem;
	color: var(--gsg-text-muted);
}

.attraction-search-loading__spinner {
	display: inline-block;
	width: 28px;
	height: 28px;
	border: 3px solid rgba(30, 77, 53, .2);
	border-top-color: var(--gsg-green);
	border-radius: 50%;
	animation: gsg-spin .7s linear infinite;
	flex-shrink: 0;
}

@keyframes gsg-spin {
	to { transform: rotate(360deg); }
}

/* Error */
.attraction-search-error {
	padding: var(--gsg-space-4) var(--gsg-space-5);
	background: #fef2f2;
	border: 1px solid #fecaca;
	border-radius: var(--gsg-radius);
	color: #991b1b;
	font-size: .9375rem;
	margin-bottom: var(--gsg-space-4);
}

/* Empty state */
.attraction-search-empty {
	text-align: center;
	padding: var(--gsg-space-12) 0;
}

.attraction-search-empty__icon {
	font-size: 3rem;
	display: block;
	margin-bottom: var(--gsg-space-3);
}

.attraction-search-empty__title {
	font-size: 1.5rem;
	color: var(--gsg-text);
	margin-bottom: var(--gsg-space-2);
}

.attraction-search-empty__hint {
	color: var(--gsg-text-muted);
	font-size: 1rem;
}

/* Distance badge — overlaid on card image */
.distance-badge {
	position: absolute;
	bottom: var(--gsg-space-2);
	right: var(--gsg-space-2);
	background: rgba(12, 30, 20, .78);
	color: #fff;
	font-size: .75rem;
	font-weight: 600;
	padding: .25rem .6rem;
	border-radius: 999px;
	backdrop-filter: blur(4px);
	pointer-events: none;
	white-space: nowrap;
	line-height: 1.4;
}

/* Mobile adjustments */
@media (max-width: 640px) {
	.attraction-search-form {
		flex-direction: column;
		padding: var(--gsg-space-4);
		gap: var(--gsg-space-3);
	}

	.attraction-search-form__field,
	.attraction-search-form__field--submit {
		flex: 1 1 100%;
		width: 100%;
	}

	.attraction-search-form__input,
	.attraction-search-form__select,
	.attraction-search-form__submit {
		width: 100%;
	}
}

/* ── Influencer section collapsible toggle ─────────────────────────────── */

.influencer-section-toggle {
	border: none;
}

.influencer-section-toggle > summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--gsg-space-3);
	cursor: pointer;
	list-style: none;
	padding: var(--gsg-space-3) 0;
	border-bottom: 2px solid var(--gsg-green-100);
}

.influencer-section-toggle > summary::-webkit-details-marker {
	display: none;
}

.influencer-section-toggle > summary .attraction-section__heading {
	margin-bottom: 0;
}

.influencer-section-toggle__chevron {
	flex-shrink: 0;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	background: var(--gsg-green-50);
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background .2s, transform .25s;
	color: var(--gsg-green-700);
	font-size: .75rem;
}

.influencer-section-toggle__chevron::after {
	content: '▼';
}

.influencer-section-toggle[open] > summary .influencer-section-toggle__chevron {
	transform: rotate(180deg);
	background: var(--gsg-green-100);
}

.influencer-section-toggle > summary:hover .influencer-section-toggle__chevron {
	background: var(--gsg-green-100);
}

.influencer-section-toggle__body {
	padding-top: var(--gsg-space-5);
}

/* NJ Adventure Club — photo hero */
.page-hero--adventure {
	background-color: var(--gsg-green-900);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

.page-hero--adventure::before {
	background: linear-gradient(
		to bottom,
		rgba(12, 35, 22, 0.50) 0%,
		rgba(12, 35, 22, 0.68) 100%
	);
	background-image: none;
}

/* ==========================================================================
   Phase 13.18 — Sponsored Restaurant Feature
   ========================================================================== */

/* ---- Restaurant card — Featured banner + highlighted border ---- */

.restaurant-card--featured {
	border: 2px solid #F08C50;
	box-shadow: 0 0 0 3px #FDE8D8, 0 4px 16px rgba(0,0,0,.1);
}

.restaurant-card__featured-banner {
	position: absolute;
	top: 0;
	left: 0;
	background: #E07B39;
	color: #fff;
	font-size: .65rem;
	font-weight: 700;
	padding: 3px 10px;
	border-radius: 0 0 6px 0;
	letter-spacing: .04em;
	text-transform: uppercase;
	z-index: 2;
	pointer-events: none;
	line-height: 1.6;
}

/* ---- Sponsored section header divider (archive page) ---- */

.gsg-sponsored-header {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 20px;
	margin-top: 4px;
}

.gsg-sponsored-header::after {
	content: '';
	flex: 1;
	height: 1px;
	background: #e5e7eb;
}

.gsg-sponsored-header__label {
	font-size: .8rem;
	font-weight: 700;
	color: #D4672A;
	white-space: nowrap;
	letter-spacing: .03em;
}

/* ---- Food map — sponsored popup ---- */

.fm-popup--sponsored {
	border: 2px solid #F08C50;
	border-radius: 6px;
	overflow: hidden;
}

.fm-popup__featured-bar {
	background: #E07B39;
	color: #fff;
	font-size: .65rem;
	font-weight: 700;
	text-align: center;
	padding: 4px 6px;
	letter-spacing: .05em;
	text-transform: uppercase;
	line-height: 1.4;
}

/* ---- Food map list view — Featured pill ---- */

.fm-row__featured {
	display: inline-block;
	font-size: .68rem;
	font-weight: 700;
	color: #B85C1C;
	background: #FDF0E3;
	border: 1px solid #F9CEAB;
	padding: 1px 7px;
	border-radius: 999px;
	margin-left: 6px;
	vertical-align: middle;
	white-space: nowrap;
}

/* ---- Leaflet sponsored marker — remove default divIcon background ---- */

.gsg-food-marker--sponsored .leaflet-div-icon,
.leaflet-div-icon.gsg-food-marker--sponsored {
	background: transparent !important;
	border: none !important;
}