/* =========================================================
   GROWBITECH EDITORIAL
   HOMEPAGE - PHASE 1
========================================================= */

.gb-home {
	overflow: hidden;
}


/* =========================================================
   HERO
========================================================= */

.gb-home-hero {
	padding: 32px 0 12px;
}

.gb-home-hero-frame {
	min-height: 520px;

	display: grid;
	grid-template-columns:
		minmax(0, 4fr)
		minmax(360px, 4.15fr)
		minmax(0, 4fr);

	overflow: hidden;

	border: 1px solid var(--gb-border);
	border-radius: 20px;

	background: var(--gb-white);

	box-shadow:
		0 22px 60px
		rgba(17, 24, 39, 0.055);
}

.gb-hero-visual {
	position: relative;

	min-width: 0;
	min-height: 520px;

	margin: 0;

	overflow: hidden;

	background:
		linear-gradient(
			145deg,
			#e9e7e2,
			#d4d7db
		);
}

.gb-hero-visual img {
	position: absolute;

	inset: 0;

	display: block;

	width: 100%;
	height: 100%;

	object-fit: cover;

	transition:
		transform 0.55s ease;
}

.gb-hero-visual-men img {
	object-position: 52% 20%;
}

.gb-hero-visual-women img {
	object-position: 50% 18%;
}

.gb-home-hero-frame:hover .gb-hero-visual img {
	transform: scale(1.015);
}

.gb-hero-visual.is-placeholder::before {
	content: "Editorial image";

	position: absolute;

	inset: 0;

	display: grid;
	place-items: center;

	color: rgba(17, 24, 39, 0.38);

	font:
		600 13px/1
		Inter,
		sans-serif;

	letter-spacing: 0.12em;

	text-transform: uppercase;
}

.gb-hero-visual-men.is-placeholder {
	background:
		linear-gradient(
			145deg,
			#ddd8d2,
			#aab2bb
		);
}

.gb-hero-visual-women.is-placeholder {
	background:
		linear-gradient(
			145deg,
			#eadfd8,
			#c8aea0
		);
}

.gb-hero-visual::after {
	content: "";

	position: absolute;

	inset: 0;

	pointer-events: none;

	background:
		linear-gradient(
			to top,
			rgba(8, 12, 18, 0.22),
			transparent 34%
		);
}

.gb-hero-visual figcaption {
	position: absolute;

	z-index: 2;

	left: 22px;
	bottom: 20px;

	margin: 0;

	padding: 7px 11px;

	border: 1px solid rgba(255, 255, 255, 0.55);
	border-radius: 999px;

	background: rgba(255, 255, 255, 0.84);

	backdrop-filter: blur(10px);

	color: var(--gb-ink);

	font-size: 10px;
	font-weight: 800;

	letter-spacing: 0.16em;

	text-transform: uppercase;
}

.gb-hero-copy {
	position: relative;

	z-index: 3;

	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;

	padding: 48px 34px;

	text-align: center;

	background:
		radial-gradient(
			circle at 50% 45%,
			#ffffff 0%,
			#fafaf7 64%,
			#f5f4ef 100%
		);
}

.gb-hero-copy::before,
.gb-hero-copy::after {
	content: "";

	position: absolute;

	top: 0;
	bottom: 0;

	width: 1px;

	background: var(--gb-border);
}

.gb-hero-copy::before {
	left: 0;
}

.gb-hero-copy::after {
	right: 0;
}

.gb-hero-copy h1 {
	max-width: 500px;

	margin: 18px 0 20px;

	font:
		700 clamp(42px, 3.9vw, 56px) / 0.99
		"Playfair Display",
		serif;

	letter-spacing: -0.035em;
}

.gb-hero-copy h1 em {
	display: block;

	margin-top: 5px;

	color: var(--gb-industry-accent);

	font-weight: 600;
}

.gb-hero-copy p {
	max-width: 500px;

	margin: 0 auto 28px;

	color: var(--gb-text);

	font-size: 16px;
	line-height: 1.72;
}

.gb-hero-actions {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;

	gap: 12px;
}


/* =========================================================
   SHARED HOME SECTION
========================================================= */

.gb-home-section {
	padding: 58px 0 8px;
}


/* =========================================================
   FEATURED BRANDS
========================================================= */

.gb-brand-strip-section {
	padding-top: 46px;
}

.gb-brand-strip {
	display: grid;

	grid-auto-flow: column;
	grid-auto-columns: 168px;
	grid-template-rows: 1fr;

	gap: 14px;

	overflow-x: auto;

	padding: 2px 2px 12px;

	scrollbar-width: thin;
	scroll-snap-type: x proximity;
	justify-content: start;
}

.gb-brand-card {
	min-height: 104px;

	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;

	gap: 10px;

	padding: 14px 16px;

	border: 1px solid var(--gb-border);
	border-radius: 12px;

	background: rgba(255, 255, 255, 0.86);

	text-decoration: none;

	scroll-snap-align: start;

	transition:
		transform 0.2s ease,
		border-color 0.2s ease,
		box-shadow 0.2s ease,
		background 0.2s ease;
}

.gb-brand-card:hover {
	transform: translateY(-3px);

	border-color: rgba(35, 58, 94, 0.45);

	background: var(--gb-white);

	box-shadow:
		0 12px 30px
		rgba(17, 24, 39, 0.06);
}

.gb-brand-card-logo {
	height: 44px;

	display: grid;
	place-items: center;
}

.gb-brand-card-logo img {
	display: block;

	max-width: 104px;
	max-height: 42px;

	object-fit: contain;
}

.gb-brand-card-initials {
	width: 42px;
	height: 42px;

	display: grid;
	place-items: center;

	border-radius: 50%;

	background: var(--gb-surface);

	color: var(--gb-navy);

	font-size: 13px;
	font-weight: 800;
}

.gb-brand-card-name {
	font-size: 13px;
	font-weight: 700;

	text-align: center;
}

.gb-brand-empty {
	grid-column: 1 / -1;

	padding: 24px;

	border: 1px dashed var(--gb-border);
	border-radius: 12px;

	background: var(--gb-white);

	color: var(--gb-muted);

	font-size: 14px;
}

.gb-brand-empty p {
	margin: 0;
}


/* =========================================================
   CATEGORY GRID
========================================================= */

.gb-categories-section {
	padding-top: 34px;
	padding-bottom: 18px;
}

.gb-category-grid {
	display: grid;
	grid-template-columns:
		repeat(
			6,
			minmax(0, 1fr)
		);

	gap: 16px;
}

.gb-category-card {
	position: relative;

	min-height: 230px;

	overflow: hidden;

	display: block;

	border-radius: var(--gb-radius-md);

	background:
		linear-gradient(
			145deg,
			#27364c,
			#111827
		);

	color: #ffffff;

	text-decoration: none;

	isolation: isolate;

	box-shadow:
		inset 0 0 0 1px
		rgba(255, 255, 255, 0.08);

	transition:
		transform 0.25s ease,
		box-shadow 0.25s ease;
}

.gb-category-card:hover {
	transform: translateY(-4px);

	box-shadow:
		0 16px 34px
		rgba(17, 24, 39, 0.12);
}

.gb-category-card-image {
	position: absolute;

	z-index: -3;

	inset: 0;

	display: block;

	width: 100%;
	height: 100%;

	object-fit: cover;

	transition:
		transform 0.45s ease;
}

.gb-category-card:hover .gb-category-card-image {
	transform: scale(1.035);
}

.gb-category-card-overlay {
	position: absolute;

	z-index: -2;

	inset: 0;

	background:
		linear-gradient(
			to top,
			rgba(7, 10, 16, 0.82) 0%,
			rgba(7, 10, 16, 0.32) 46%,
			rgba(7, 10, 16, 0.06) 78%
		);
}

.gb-category-card.is-placeholder::before {
	content: "";

	position: absolute;

	z-index: -3;

	inset: 0;

	background:
		linear-gradient(
			145deg,
			#39485d,
			#151c27
		);
}

.gb-category-card-content {
	position: absolute;

	z-index: 2;

	left: 20px;
	right: 54px;
	bottom: 19px;
}

.gb-category-eyebrow {
	display: block;

	color: rgba(255, 255, 255, 0.72);

	font-size: 9px;
	font-weight: 800;

	letter-spacing: 0.12em;

	text-transform: uppercase;
}

.gb-category-card strong {
	display: block;

	margin-top: 5px;

	color: #ffffff;

	font:
		700 24px/1.08
		"Playfair Display",
		serif;
}

.gb-category-arrow {
	position: absolute;

	z-index: 2;

	top: 16px;
	right: 16px;

	width: 34px;
	height: 34px;

	display: grid;
	place-items: center;

	border: 1px solid rgba(255, 255, 255, 0.42);
	border-radius: 50%;

	background: rgba(11, 16, 24, 0.14);

	backdrop-filter: blur(7px);

	color: #ffffff;

	transition:
		transform 0.2s ease,
		background 0.2s ease;
}

.gb-category-card:hover .gb-category-arrow {
	transform: translate(2px, -2px);

	background: rgba(255, 255, 255, 0.16);
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 1180px) {

	.gb-home-hero-frame {
		min-height: 490px;

		grid-template-columns:
			minmax(0, 3fr)
			minmax(350px, 4fr)
			minmax(0, 3fr);
	}

	.gb-hero-visual {
		min-height: 490px;
	}

	.gb-category-grid {
		grid-template-columns:
			repeat(
				3,
				minmax(0, 1fr)
			);
	}

	.gb-category-card {
		min-height: 250px;
	}

}


@media (max-width: 820px) {

	.gb-home-hero {
		padding-top: 18px;
	}

	.gb-home-hero-frame {
		grid-template-columns: 1fr 1fr;

		min-height: auto;
	}

	.gb-hero-copy {
		grid-column: 1 / -1;
		grid-row: 1;

		padding: 46px 24px 36px;
	}

	.gb-hero-copy::before,
	.gb-hero-copy::after {
		display: none;
	}

	.gb-hero-visual {
		min-height: 410px;
	}

	.gb-hero-visual-men {
		grid-column: 1;
		grid-row: 2;
	}

	.gb-hero-visual-women {
		grid-column: 2;
		grid-row: 2;
	}

	.gb-section-head {
		align-items: flex-start;
		flex-direction: column;
	}

	.gb-brand-strip {
		grid-auto-columns: 160px;
	}

	.gb-category-grid {
		grid-template-columns:
			repeat(
				2,
				minmax(0, 1fr)
			);
	}

	.gb-category-card {
		min-height: 280px;
	}

}


@media (max-width: 560px) {

	.gb-home-hero-frame {
		display: flex;
		flex-direction: column;
	}

	.gb-hero-copy {
		order: 1;

		padding: 42px 20px 34px;
	}

	.gb-hero-copy h1 {
		font-size: clamp(40px, 12vw, 52px);
	}

	.gb-hero-visual-men,
	.gb-hero-visual-women {
		order: 2;

		min-height: 380px;
	}

	.gb-hero-visual-women {
		display: none;
	}

	.gb-brand-strip {
		grid-auto-columns: 152px;
	}

	.gb-category-grid {
		grid-template-columns: 1fr;
	}

	.gb-category-card {
		min-height: 310px;
	}

}


/* =========================================================
   PHASE 2
   BRAND SPOTLIGHT + LATEST EDITORIAL + LATEST REVIEWS
========================================================= */


/* =========================================================
   SPOTLIGHT + EDITORIAL LAYOUT
========================================================= */

.gb-discovery-feature-section {
	margin-top: 38px;

	padding-top: 68px;
	padding-bottom: 68px;

	background:
		linear-gradient(
			180deg,
			rgba(244, 245, 246, 0.62),
			rgba(250, 250, 247, 0.15)
		);

	border-top: 1px solid var(--gb-border);
	border-bottom: 1px solid var(--gb-border);
}

.gb-phase2-layout {
	display: grid;

	grid-template-columns:
		minmax(0, 5fr)
		minmax(0, 7fr);

	gap: 38px;
}

.gb-section-head-compact {
	margin-bottom: 22px;
}

.gb-section-head-compact h2 {
	font-size: clamp(30px, 3vw, 38px);
}


/* =========================================================
   BRAND SPOTLIGHT
========================================================= */

.gb-brand-spotlight-card {
	overflow: hidden;

	border: 1px solid var(--gb-border);
	border-radius: 18px;

	background: var(--gb-white);

	box-shadow:
		0 18px 50px
		rgba(17, 24, 39, 0.055);
}

.gb-brand-spotlight-visual {
	position: relative;

	min-height: 330px;

	display: block;

	overflow: hidden;

	background: var(--gb-surface);
}

.gb-brand-spotlight-visual > img {
	position: absolute;

	inset: 0;

	display: block;

	width: 100%;
	height: 100%;

	object-fit: cover;
	object-position: center;

	transition:
		transform 0.5s ease;
}

.gb-brand-spotlight-card:hover
.gb-brand-spotlight-visual > img {
	transform: scale(1.025);
}

.gb-brand-spotlight-shade {
	position: absolute;

	inset: 0;

	background:
		linear-gradient(
			to top,
			rgba(9, 14, 22, 0.5) 0%,
			rgba(9, 14, 22, 0.1) 45%,
			transparent 72%
		);
}

.gb-brand-spotlight-logo {
	position: absolute;

	left: 22px;
	bottom: 22px;

	width: 70px;
	height: 70px;

	display: grid;
	place-items: center;

	padding: 10px;

	border: 1px solid rgba(255, 255, 255, 0.65);
	border-radius: 14px;

	background: rgba(255, 255, 255, 0.91);

	backdrop-filter: blur(12px);

	box-shadow:
		0 10px 25px
		rgba(17, 24, 39, 0.12);
}

.gb-brand-spotlight-logo img {
	display: block;

	max-width: 100%;
	max-height: 100%;

	object-fit: contain;
}

.gb-brand-spotlight-logo > span {
	width: 48px;
	height: 48px;

	display: grid;
	place-items: center;

	border-radius: 50%;

	background: var(--gb-surface);

	color: var(--gb-navy);

	font-size: 14px;
	font-weight: 800;
}

.gb-brand-spotlight-body {
	padding: 26px;
}

.gb-brand-spotlight-meta {
	display: flex;
	flex-wrap: wrap;

	gap: 8px;

	margin-bottom: 13px;
}

.gb-brand-spotlight-meta span {
	padding: 6px 9px;

	border-radius: 999px;

	background: var(--gb-surface);

	color: var(--gb-text);

	font-size: 10px;
	font-weight: 700;

	letter-spacing: 0.04em;

	text-transform: uppercase;
}

.gb-brand-spotlight-body h3 {
	margin: 0 0 11px;

	font:
		700 30px/1.12
		"Playfair Display",
		serif;
}

.gb-brand-spotlight-body h3 a {
	color: var(--gb-ink);
	text-decoration: none;
}

.gb-brand-spotlight-body p {
	margin: 0;

	color: var(--gb-text);

	font-size: 14px;
	line-height: 1.7;
}

.gb-brand-spotlight-actions {
	display: flex;
	flex-wrap: wrap;

	gap: 10px;

	margin-top: 22px;
}


/* =========================================================
   LATEST EDITORIAL
========================================================= */

.gb-editorial-grid {
	display: grid;

	grid-template-columns:
		repeat(
			2,
			minmax(0, 1fr)
		);

	gap: 18px;
}

.gb-editorial-card {
	overflow: hidden;

	border: 1px solid var(--gb-border);
	border-radius: 15px;

	background: var(--gb-white);

	transition:
		transform 0.22s ease,
		box-shadow 0.22s ease,
		border-color 0.22s ease;
}

.gb-editorial-card:hover {
	transform: translateY(-3px);

	border-color:
		rgba(35, 58, 94, 0.25);

	box-shadow:
		0 14px 34px
		rgba(17, 24, 39, 0.055);
}

.gb-editorial-card-image {
	aspect-ratio: 16 / 10;

	display: block;

	overflow: hidden;

	background: var(--gb-surface);
}

.gb-editorial-card-image img {
	display: block;

	width: 100%;
	height: 100%;

	object-fit: cover;

	transition:
		transform 0.45s ease;
}

.gb-editorial-card:hover
.gb-editorial-card-image img {
	transform: scale(1.025);
}

.gb-editorial-card-body {
	padding: 18px 18px 19px;
}

.gb-editorial-card-kicker {
	min-height: 18px;

	display: flex;
	flex-wrap: wrap;
	align-items: center;

	gap: 7px;

	margin-bottom: 8px;

	font-size: 10px;
	font-weight: 800;

	letter-spacing: 0.08em;

	text-transform: uppercase;
}

.gb-editorial-card-kicker > span {
	color: var(--gb-industry-accent-dark);
}

.gb-editorial-card-kicker a {
	color: var(--gb-muted);

	text-decoration: none;
}

.gb-editorial-card-kicker a::before {
	content: "•";

	margin-right: 7px;

	color: var(--gb-border);
}

.gb-editorial-card h3 {
	margin: 0 0 9px;

	font:
		700 21px/1.24
		"Playfair Display",
		serif;
}

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

.gb-editorial-card p {
	margin: 0;

	color: var(--gb-text);

	font-size: 13px;
	line-height: 1.62;
}


/* =========================================================
   LATEST REVIEWS
========================================================= */

.gb-latest-reviews-section {
	padding-top: 70px;
	padding-bottom: 22px;
}

.gb-review-grid {
	display: grid;

	grid-template-columns:
		repeat(
			4,
			minmax(0, 1fr)
		);

	gap: 20px;
}

.gb-review-card {
	overflow: hidden;

	border: 1px solid var(--gb-border);
	border-radius: 15px;

	background: var(--gb-white);

	transition:
		transform 0.22s ease,
		box-shadow 0.22s ease;
}

.gb-review-card:hover {
	transform: translateY(-4px);

	box-shadow:
		0 16px 38px
		rgba(17, 24, 39, 0.065);
}

.gb-review-card-image {
	position: relative;

	aspect-ratio: 5 / 3;

	display: block;

	overflow: hidden;

	background: var(--gb-surface);
}

.gb-review-card-image img {
	display: block;

	width: 100%;
	height: 100%;

	object-fit: cover;

	transition:
		transform 0.45s ease;
}

.gb-review-card:hover
.gb-review-card-image img {
	transform: scale(1.025);
}

.gb-review-card-badge {
	position: absolute;

	left: 14px;
	top: 14px;

	padding: 6px 9px;

	border-radius: 999px;

	background: rgba(255, 255, 255, 0.9);

	backdrop-filter: blur(10px);

	color: var(--gb-ink);

	font-size: 9px;
	font-weight: 800;

	letter-spacing: 0.09em;

	text-transform: uppercase;
}

.gb-review-card-body {
	padding: 19px;
}

.gb-review-card-brand {
	display: inline-block;

	margin-bottom: 8px;

	color: var(--gb-industry-accent-dark);

	font-size: 10px;
	font-weight: 800;

	letter-spacing: 0.09em;

	text-decoration: none;
	text-transform: uppercase;
}

.gb-review-card h3 {
	margin: 0 0 10px;

	font:
		700 21px/1.24
		"Playfair Display",
		serif;
}

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

.gb-review-card-body > p {
	margin: 0 0 18px;

	color: var(--gb-text);

	font-size: 13px;
	line-height: 1.64;
}

.gb-review-card-footer {
	display: flex;
	align-items: center;
	justify-content: space-between;

	gap: 12px;

	padding-top: 14px;

	border-top: 1px solid var(--gb-border);

	color: var(--gb-muted);

	font-size: 11px;
}

.gb-review-card-footer a {
	color: var(--gb-navy);

	font-weight: 700;

	text-decoration: none;
}

.gb-review-rating {
	color: var(--gb-industry-accent-dark);

	font-weight: 800;
}


/* =========================================================
   EMPTY STATES
========================================================= */

.gb-phase2-empty {
	padding: 28px;

	border: 1px dashed var(--gb-border);
	border-radius: 14px;

	background: rgba(255, 255, 255, 0.7);

	color: var(--gb-muted);

	font-size: 14px;
	line-height: 1.6;
}

.gb-phase2-empty-wide {
	grid-column: 1 / -1;
}


/* =========================================================
   PHASE 2 RESPONSIVE
========================================================= */

@media (max-width: 1100px) {

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

	.gb-brand-spotlight-card {
		display: grid;

		grid-template-columns:
			minmax(0, 1fr)
			minmax(320px, 0.82fr);
	}

	.gb-brand-spotlight-visual {
		min-height: 390px;
	}

	.gb-brand-spotlight-body {
		display: flex;
		flex-direction: column;
		justify-content: center;

		padding: 32px;
	}

	.gb-review-grid {
		grid-template-columns:
			repeat(
				2,
				minmax(0, 1fr)
			);
	}

}


@media (max-width: 760px) {

	.gb-discovery-feature-section {
		padding-top: 52px;
		padding-bottom: 52px;
	}

	.gb-brand-spotlight-card {
		display: block;
	}

	.gb-brand-spotlight-visual {
		min-height: 330px;
	}

	.gb-editorial-grid {
		grid-template-columns: 1fr;
	}

	.gb-review-grid {
		grid-template-columns: 1fr;
	}

}


@media (max-width: 560px) {

	.gb-brand-spotlight-body {
		padding: 22px;
	}

	.gb-brand-spotlight-body h3 {
		font-size: 27px;
	}

	.gb-brand-spotlight-actions {
		align-items: stretch;
		flex-direction: column;
	}

	.gb-brand-spotlight-actions .gb-btn {
		width: 100%;
	}

}


/* =========================================================
   PHASE 2.1
   ADAPTIVE CONTENT DENSITY + BRAND COVER IMAGE
========================================================= */


/* ---------------------------------------------------------
   BRAND SPOTLIGHT COVER
--------------------------------------------------------- */

.gb-brand-spotlight-visual > img {
	object-position: center 42%;
}

/* Slightly stronger image treatment for campaign imagery. */
.gb-brand-spotlight-visual::after {
	content: "";

	position: absolute;

	inset: 0;

	pointer-events: none;

	box-shadow:
		inset 0 -1px 0 rgba(255,255,255,.08);
}


/* ---------------------------------------------------------
   LATEST EDITORIAL - ADAPTIVE COUNTS
--------------------------------------------------------- */

/* One article: turn it into a proper editorial feature. */
.gb-editorial-grid.gb-editorial-count-1 {
	grid-template-columns: 1fr;
}

.gb-editorial-count-1 .gb-editorial-card {
	display: grid;

	grid-template-columns:
		minmax(0, 1.12fr)
		minmax(280px, .88fr);

	min-height: 320px;
}

.gb-editorial-count-1 .gb-editorial-card-image {
	min-height: 320px;
	aspect-ratio: auto;
}

.gb-editorial-count-1 .gb-editorial-card-body {
	display: flex;
	flex-direction: column;
	justify-content: center;

	padding: 30px;
}

.gb-editorial-count-1 .gb-editorial-card h3 {
	font-size: clamp(26px, 2.3vw, 34px);
}

.gb-editorial-count-1 .gb-editorial-card p {
	font-size: 14px;
	line-height: 1.7;
}


/* Two articles: clean 2-column spread. */
.gb-editorial-grid.gb-editorial-count-2 {
	grid-template-columns:
		repeat(
			2,
			minmax(0, 1fr)
		);
}


/* Three articles: first story acts as the lead. */
.gb-editorial-count-3 .gb-editorial-card:first-child {
	grid-column: 1 / -1;

	display: grid;

	grid-template-columns:
		minmax(0, 1.08fr)
		minmax(280px, .92fr);
}

.gb-editorial-count-3 .gb-editorial-card:first-child .gb-editorial-card-image {
	min-height: 280px;
	aspect-ratio: auto;
}

.gb-editorial-count-3 .gb-editorial-card:first-child .gb-editorial-card-body {
	display: flex;
	flex-direction: column;
	justify-content: center;

	padding: 26px;
}

.gb-editorial-count-3 .gb-editorial-card:first-child h3 {
	font-size: 28px;
}


/* Four articles: existing 2x2 layout remains ideal. */
.gb-editorial-grid.gb-editorial-count-4 {
	grid-template-columns:
		repeat(
			2,
			minmax(0, 1fr)
		);
}


/* ---------------------------------------------------------
   LATEST REVIEWS - ADAPTIVE COUNTS
--------------------------------------------------------- */

/* One review: horizontal feature instead of a lonely 1/4 card. */
.gb-review-grid.gb-review-count-1 {
	grid-template-columns: 1fr;
}

.gb-review-count-1 .gb-review-card {
	display: grid;

	grid-template-columns:
		minmax(0, .95fr)
		minmax(0, 1.05fr);

	min-height: 300px;
}

.gb-review-count-1 .gb-review-card-image {
	min-height: 300px;
	aspect-ratio: auto;
}

.gb-review-count-1 .gb-review-card-body {
	display: flex;
	flex-direction: column;
	justify-content: center;

	padding: 30px;
}

.gb-review-count-1 .gb-review-card h3 {
	font-size: clamp(27px, 2.4vw, 35px);
}

.gb-review-count-1 .gb-review-card-body > p {
	max-width: 680px;

	font-size: 14px;
}


/* Two reviews fill the row. */
.gb-review-grid.gb-review-count-2 {
	grid-template-columns:
		repeat(
			2,
			minmax(0, 1fr)
		);
}


/* Three reviews use the full width naturally. */
.gb-review-grid.gb-review-count-3 {
	grid-template-columns:
		repeat(
			3,
			minmax(0, 1fr)
		);
}


/* Four reviews keep the 4-column layout. */
.gb-review-grid.gb-review-count-4 {
	grid-template-columns:
		repeat(
			4,
			minmax(0, 1fr)
		);
}


/* ---------------------------------------------------------
   RESPONSIVE PHASE 2.1
--------------------------------------------------------- */

@media (max-width: 900px) {

	.gb-editorial-count-1 .gb-editorial-card,
	.gb-editorial-count-3 .gb-editorial-card:first-child,
	.gb-review-count-1 .gb-review-card {
		display: block;

		min-height: 0;
	}

	.gb-editorial-count-1 .gb-editorial-card-image,
	.gb-editorial-count-3 .gb-editorial-card:first-child .gb-editorial-card-image,
	.gb-review-count-1 .gb-review-card-image {
		min-height: 0;

		aspect-ratio: 16 / 10;
	}

	.gb-review-grid.gb-review-count-3 {
		grid-template-columns:
			repeat(
				2,
				minmax(0, 1fr)
			);
	}

}


@media (max-width: 620px) {

	.gb-editorial-grid.gb-editorial-count-2,
	.gb-editorial-grid.gb-editorial-count-3,
	.gb-editorial-grid.gb-editorial-count-4,
	.gb-review-grid.gb-review-count-2,
	.gb-review-grid.gb-review-count-3,
	.gb-review-grid.gb-review-count-4 {
		grid-template-columns: 1fr;
	}

	.gb-editorial-count-3 .gb-editorial-card:first-child {
		grid-column: auto;
	}

}


/* =========================================================
   PHASE 3
   SHOP SMARTER + DEALS + LATEST STORIES
========================================================= */


/* =========================================================
   SHARED
========================================================= */

.gb-section-intro {
	max-width: 640px;

	margin: 12px 0 0;

	color: var(--gb-text);

	font-size: 14px;
	line-height: 1.7;
}

.gb-section-link-group {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;

	gap: 18px;
}

.gb-phase3-empty {
	display: flex;
	flex-direction: column;

	gap: 6px;

	padding: 30px;

	border: 1px dashed var(--gb-border);
	border-radius: 14px;

	background:
		rgba(255, 255, 255, 0.72);

	color: var(--gb-muted);

	font-size: 13px;
	line-height: 1.6;
}

.gb-phase3-empty strong {
	color: var(--gb-ink);

	font-family:
		"Playfair Display",
		serif;

	font-size: 20px;
}

.gb-phase3-empty-wide {
	grid-column: 1 / -1;
}


/* =========================================================
   SHOP SMARTER
========================================================= */

.gb-shop-smarter-section {
	padding-top: 76px;
	padding-bottom: 34px;
}

.gb-shop-smarter-grid {
	display: grid;

	grid-template-columns:
		minmax(0, 2fr)
		minmax(0, 1fr)
		minmax(0, 1fr);

	gap: 20px;
}

.gb-smart-card {
	overflow: hidden;

	border: 1px solid var(--gb-border);
	border-radius: 16px;

	background: var(--gb-white);

	transition:
		transform 0.22s ease,
		box-shadow 0.22s ease,
		border-color 0.22s ease;
}

.gb-smart-card:hover {
	transform: translateY(-4px);

	border-color:
		rgba(35, 58, 94, 0.24);

	box-shadow:
		0 17px 40px
		rgba(17, 24, 39, 0.065);
}

.gb-smart-card-image {
	position: relative;

	aspect-ratio: 4 / 3;

	display: block;

	overflow: hidden;

	background: var(--gb-surface);
}

.gb-smart-card-lead .gb-smart-card-image {
	aspect-ratio: 16 / 9;
}

.gb-smart-card-image img {
	display: block;

	width: 100%;
	height: 100%;

	object-fit: cover;

	transition:
		transform 0.45s ease;
}

.gb-smart-card:hover
.gb-smart-card-image img {
	transform: scale(1.025);
}

.gb-smart-card-shade {
	position: absolute;

	inset: 0;

	background:
		linear-gradient(
			to top,
			rgba(8, 12, 18, 0.45),
			transparent 52%
		);
}

.gb-smart-card-type {
	position: absolute;

	left: 15px;
	bottom: 14px;

	padding: 7px 10px;

	border: 1px solid
		rgba(255, 255, 255, 0.46);
	border-radius: 999px;

	background:
		rgba(255, 255, 255, 0.88);

	backdrop-filter: blur(9px);

	color: var(--gb-ink);

	font-size: 9px;
	font-weight: 800;

	letter-spacing: 0.08em;

	text-transform: uppercase;
}

.gb-smart-card-body {
	padding: 20px;
}

.gb-smart-card-lead .gb-smart-card-body {
	padding: 24px;
}

.gb-smart-card-brand {
	display: inline-block;

	margin-bottom: 8px;

	color: var(--gb-industry-accent-dark);

	font-size: 10px;
	font-weight: 800;

	letter-spacing: 0.08em;

	text-decoration: none;
	text-transform: uppercase;
}

.gb-smart-card h3 {
	margin: 0 0 10px;

	font:
		700 21px/1.24
		"Playfair Display",
		serif;
}

.gb-smart-card-lead h3 {
	font-size: clamp(28px, 2.4vw, 36px);
}

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

.gb-smart-card p {
	margin: 0 0 18px;

	color: var(--gb-text);

	font-size: 13px;
	line-height: 1.66;
}

.gb-smart-card-lead p {
	font-size: 14px;
}

.gb-smart-card-link {
	color: var(--gb-navy);

	font-size: 12px;
	font-weight: 700;

	text-decoration: none;
}


/* Adaptive Shop Smarter */

.gb-shop-smarter-grid.gb-shop-count-1 {
	grid-template-columns: 1fr;
}

.gb-shop-count-1 .gb-smart-card {
	display: grid;

	grid-template-columns:
		minmax(0, 1.15fr)
		minmax(300px, .85fr);
}

.gb-shop-count-1
.gb-smart-card-image {
	min-height: 360px;

	aspect-ratio: auto;
}

.gb-shop-count-1
.gb-smart-card-body {
	display: flex;
	flex-direction: column;
	justify-content: center;

	padding: 34px;
}

.gb-shop-smarter-grid.gb-shop-count-2 {
	grid-template-columns:
		repeat(
			2,
			minmax(0, 1fr)
		);
}

.gb-shop-count-2
.gb-smart-card-lead {
	grid-column: auto;
}


/* =========================================================
   DEALS
========================================================= */

.gb-deals-section {
	margin-top: 32px;

	padding-top: 52px;
	padding-bottom: 52px;

	border-top: 1px solid var(--gb-border);
	border-bottom: 1px solid var(--gb-border);

	background:
		linear-gradient(
			180deg,
			rgba(244, 245, 246, .75),
			rgba(250, 250, 247, .55)
		);
}

.gb-section-head-deals {
	margin-bottom: 20px;
}

.gb-deals-strip {
	display: grid;

	grid-template-columns:
		repeat(
			5,
			minmax(0, 1fr)
		);

	gap: 14px;
}

.gb-deal-card {
	min-height: 176px;

	display: flex;
	flex-direction: column;

	padding: 18px;

	border: 1px solid var(--gb-border);
	border-radius: 14px;

	background: var(--gb-white);

	transition:
		transform 0.2s ease,
		box-shadow 0.2s ease;
}

.gb-deal-card:hover {
	transform: translateY(-3px);

	box-shadow:
		0 13px 30px
		rgba(17, 24, 39, .055);
}

.gb-deal-card-top {
	display: flex;
	align-items: center;

	gap: 9px;

	margin-bottom: 18px;
}

.gb-deal-card-icon {
	width: 32px;
	height: 32px;

	display: grid;
	place-items: center;

	border-radius: 9px;

	background:
		var(--gb-industry-accent-soft);

	color:
		var(--gb-industry-accent-dark);

	font-size: 13px;
	font-weight: 800;
}

.gb-deal-brand {
	color: var(--gb-muted);

	font-size: 10px;
	font-weight: 800;

	letter-spacing: 0.07em;

	text-decoration: none;
	text-transform: uppercase;
}

.gb-deal-card h3 {
	flex: 1;

	margin: 0 0 18px;

	font:
		700 18px/1.28
		"Playfair Display",
		serif;
}

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

.gb-deal-card-link {
	color: var(--gb-navy);

	font-size: 11px;
	font-weight: 700;

	text-decoration: none;
}

.gb-deals-empty {
	min-height: 0;
}


/* Adaptive deals */

.gb-deals-strip.gb-deals-count-1 {
	grid-template-columns:
		minmax(260px, 360px);
}

.gb-deals-strip.gb-deals-count-2 {
	grid-template-columns:
		repeat(
			2,
			minmax(0, 1fr)
		);
}

.gb-deals-strip.gb-deals-count-3 {
	grid-template-columns:
		repeat(
			3,
			minmax(0, 1fr)
		);
}

.gb-deals-strip.gb-deals-count-4 {
	grid-template-columns:
		repeat(
			4,
			minmax(0, 1fr)
		);
}


/* =========================================================
   LATEST STORIES
========================================================= */

.gb-latest-stories-section {
	padding-top: 74px;
	padding-bottom: 38px;
}

.gb-story-list {
	border-top: 1px solid var(--gb-border);
}

.gb-story-row {
	display: grid;

	grid-template-columns:
		240px
		minmax(0, 1fr)
		150px;

	align-items: center;

	gap: 28px;

	padding: 24px 0;

	border-bottom: 1px solid var(--gb-border);
}

.gb-story-image {
	aspect-ratio: 16 / 9;

	display: block;

	overflow: hidden;

	border-radius: 12px;

	background: var(--gb-surface);
}

.gb-story-image img {
	display: block;

	width: 100%;
	height: 100%;

	object-fit: cover;

	transition:
		transform 0.4s ease;
}

.gb-story-row:hover
.gb-story-image img {
	transform: scale(1.025);
}

.gb-story-meta {
	display: flex;
	flex-wrap: wrap;

	gap: 7px;

	margin-bottom: 8px;

	font-size: 10px;
	font-weight: 800;

	letter-spacing: .08em;

	text-transform: uppercase;
}

.gb-story-meta > span {
	color: var(--gb-industry-accent-dark);
}

.gb-story-meta a {
	color: var(--gb-muted);

	text-decoration: none;
}

.gb-story-meta a::before {
	content: "•";

	margin-right: 7px;

	color: var(--gb-border);
}

.gb-story-body h3 {
	margin: 0 0 9px;

	font:
		700 24px/1.24
		"Playfair Display",
		serif;
}

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

.gb-story-body p {
	max-width: 720px;

	margin: 0;

	color: var(--gb-text);

	font-size: 13px;
	line-height: 1.66;
}

.gb-story-aside {
	align-self: stretch;

	display: flex;
	flex-direction: column;
	align-items: flex-end;
	justify-content: space-between;

	padding: 4px 0;
}

.gb-story-aside time {
	color: var(--gb-muted);

	font-size: 11px;
}

.gb-story-aside a {
	color: var(--gb-navy);

	font-size: 11px;
	font-weight: 700;

	text-decoration: none;
}


/* =========================================================
   RESPONSIVE PHASE 3
========================================================= */

@media (max-width: 1100px) {

	.gb-shop-smarter-grid {
		grid-template-columns:
			repeat(
				2,
				minmax(0, 1fr)
			);
	}

	.gb-smart-card-lead {
		grid-column: 1 / -1;

		display: grid;

		grid-template-columns:
			minmax(0, 1.15fr)
			minmax(300px, .85fr);
	}

	.gb-smart-card-lead
	.gb-smart-card-image {
		min-height: 320px;

		aspect-ratio: auto;
	}

	.gb-smart-card-lead
	.gb-smart-card-body {
		display: flex;
		flex-direction: column;
		justify-content: center;
	}

	.gb-deals-strip,
	.gb-deals-strip.gb-deals-count-4,
	.gb-deals-strip.gb-deals-count-5 {
		grid-template-columns:
			repeat(
				3,
				minmax(0, 1fr)
			);
	}

	.gb-story-row {
		grid-template-columns:
			210px
			minmax(0, 1fr)
			120px;
	}

}


@media (max-width: 820px) {

	.gb-section-link-group {
		justify-content: flex-start;
	}

	.gb-shop-smarter-grid,
	.gb-shop-smarter-grid.gb-shop-count-2 {
		grid-template-columns: 1fr;
	}

	.gb-smart-card-lead,
	.gb-shop-count-1 .gb-smart-card {
		display: block;

		grid-column: auto;
	}

	.gb-smart-card-lead
	.gb-smart-card-image,
	.gb-shop-count-1
	.gb-smart-card-image {
		min-height: 0;

		aspect-ratio: 16 / 10;
	}

	.gb-deals-strip,
	.gb-deals-strip.gb-deals-count-2,
	.gb-deals-strip.gb-deals-count-3,
	.gb-deals-strip.gb-deals-count-4,
	.gb-deals-strip.gb-deals-count-5 {
		grid-template-columns:
			repeat(
				2,
				minmax(0, 1fr)
			);
	}

	.gb-story-row {
		grid-template-columns:
			180px
			minmax(0, 1fr);

		gap: 20px;
	}

	.gb-story-aside {
		grid-column: 2;

		flex-direction: row;
		align-items: center;
	}

}


@media (max-width: 580px) {

	.gb-shop-smarter-section,
	.gb-latest-stories-section {
		padding-top: 56px;
	}

	.gb-deals-strip,
	.gb-deals-strip.gb-deals-count-1,
	.gb-deals-strip.gb-deals-count-2,
	.gb-deals-strip.gb-deals-count-3,
	.gb-deals-strip.gb-deals-count-4,
	.gb-deals-strip.gb-deals-count-5 {
		grid-template-columns: 1fr;
	}

	.gb-story-row {
		display: block;
	}

	.gb-story-image {
		margin-bottom: 18px;
	}

	.gb-story-aside {
		margin-top: 17px;

		padding-top: 13px;

		border-top: 1px solid var(--gb-border);
	}

}


/* =========================================================
   PHASE 7.1
   FRONTEND POLISH + RESPONSIVE FINISHING
   2026-08
========================================================= */

/* Keep the reading rhythm calmer as the homepage grows. */
.gb-home-section {
	position: relative;
}

.gb-home-section + .gb-home-section {
	border-top-color: rgba(229, 231, 235, 0.78);
}

.gb-section-head {
	gap: 28px;
}

.gb-section-head h2 {
	text-wrap: balance;
}

.gb-section-intro,
.gb-smart-card-body p,
.gb-story-body p {
	text-wrap: pretty;
}

/* Cards: consistent focus / hover feedback without making the site feel ecommerce-heavy. */
.gb-smart-card,
.gb-deal-card,
.gb-review-card,
.gb-editorial-card,
.gb-brand-spotlight-card,
.gb-category-card {
	transition:
		transform .24s ease,
		box-shadow .24s ease,
		border-color .24s ease;
}

@media (hover:hover) {
	.gb-smart-card:hover,
	.gb-deal-card:hover,
	.gb-review-card:hover,
	.gb-editorial-card:hover {
		transform: translateY(-2px);
	}
}

/* Deals remain deliberately compact. Duplicate titles are removed in front-page.php. */
.gb-deal-card {
	min-height: 166px;
}

.gb-deal-card h3 {
	text-wrap: balance;
}

.gb-deals-strip.gb-deals-count-1 .gb-deal-card {
	max-width: 520px;
}

/* Article and generated-image polish. home.css is globally enqueued by the theme. */
.gb-article-content > figure,
.gb-article-content > .wp-block-image {
	margin-block: 34px;
}

.gb-article-content img {
	border-radius: 14px;
}

.gb-article-content figcaption,
.wp-element-caption {
	margin-top: 9px;
	color: var(--gb-muted);
	font-size: 12px;
	line-height: 1.55;
	text-align: left;
}

.gb-article-content blockquote {
	margin: 34px 0;
	padding: 4px 0 4px 24px;
	border-left: 3px solid var(--gb-industry-accent);
	color: var(--gb-text);
	font-family: "Playfair Display", serif;
	font-size: 1.18em;
}

.gb-article-content table {
	width: 100%;
	border-collapse: collapse;
	font-size: 15px;
}

.gb-article-content th,
.gb-article-content td {
	padding: 12px 14px;
	border: 1px solid var(--gb-border);
	vertical-align: top;
}

.gb-article-content th {
	background: var(--gb-surface);
	color: var(--gb-ink);
	text-align: left;
}

/* Footer refinement. Contact lives in the bottom legal row only. */
.gb-site-footer {
	margin-top: 72px;
}

.gb-footer-grid {
	align-items: start;
}

.gb-site-footer h3 {
	letter-spacing: .04em;
}

.gb-site-footer a {
	transition: opacity .2s ease, transform .2s ease;
}

@media (hover:hover) {
	.gb-site-footer a:hover {
		opacity: .92;
	}
}

.gb-footer-bottom .gbpc-legal-links {
	align-items: center;
}

/* Accessible keyboard focus across the publication. */
.gb-home a:focus-visible,
.gb-site-footer a:focus-visible,
.gb-article-content a:focus-visible,
.gb-btn:focus-visible,
.gb-text-link:focus-visible {
	outline: 2px solid var(--gb-navy);
	outline-offset: 4px;
	border-radius: 4px;
}

/* ---------------------------------------------------------
   TABLET
--------------------------------------------------------- */
@media (max-width: 980px) {
	.gb-home-hero-frame {
		border-radius: 18px;
	}

	.gb-home-hero-frame,
	.gb-hero-visual {
		min-height: 0;
	}

	.gb-hero-visual {
		aspect-ratio: 4 / 5;
	}

	.gb-home-section {
		padding-top: 60px;
		padding-bottom: 60px;
	}

	.gb-latest-stories-section {
		padding-bottom: 24px;
	}

	.gb-footer-grid {
		gap: 38px;
	}
}

/* ---------------------------------------------------------
   MOBILE / SMALL TABLET
--------------------------------------------------------- */
@media (max-width: 760px) {
	.gb-home-hero {
		padding-top: 14px;
	}

	.gb-home-hero-frame {
		border-radius: 16px;
	}

	.gb-hero-copy {
		padding: 38px 22px 32px;
	}

	.gb-hero-copy h1 {
		margin-top: 14px;
		font-size: clamp(38px, 9vw, 48px);
		line-height: 1.02;
	}

	.gb-hero-copy p {
		font-size: 15px;
		line-height: 1.65;
	}

	.gb-hero-visual {
		min-height: 0;
		aspect-ratio: 4 / 5;
	}

	.gb-home-section {
		padding-top: 50px;
		padding-bottom: 50px;
	}

	.gb-section-head {
		gap: 16px;
		margin-bottom: 26px;
	}

	.gb-section-link-group {
		width: 100%;
		gap: 14px;
	}

	.gb-smart-card-body,
	.gb-brand-spotlight-body {
		padding: 22px;
	}

	.gb-story-body h3 {
		font-size: 22px;
	}

	.gb-deal-card {
		min-height: 142px;
		padding: 18px;
	}

	.gb-single-article,
	.gb-page-article {
		padding: 30px 24px;
		border-radius: 16px;
	}

	.gb-article-header h1,
	.gb-page-header h1 {
		font-size: clamp(38px, 9vw, 52px);
	}

	.gb-article-content {
		font-size: 17px;
		line-height: 1.78;
	}

	.gb-article-content table {
		display: block;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}
}

/* ---------------------------------------------------------
   PHONE
--------------------------------------------------------- */
@media (max-width: 560px) {
	.gb-home-hero-frame {
		box-shadow: 0 14px 38px rgba(17, 24, 39, .05);
	}

	.gb-hero-copy {
		padding: 34px 18px 30px;
	}

	.gb-hero-actions {
		width: 100%;
		align-items: stretch;
		flex-direction: column;
	}

	.gb-hero-actions .gb-btn {
		width: 100%;
		justify-content: center;
	}

	.gb-hero-visual-men {
		min-height: 0;
		aspect-ratio: 4 / 5;
	}

	.gb-category-card {
		min-height: 280px;
	}

	.gb-home-section {
		padding-top: 44px;
		padding-bottom: 44px;
	}

	.gb-section-head h2 {
		font-size: clamp(30px, 9vw, 38px);
	}

	.gb-section-intro {
		font-size: 13px;
	}

	.gb-smart-card-body h3,
	.gb-review-card-body h3,
	.gb-editorial-card-body h3 {
		font-size: 24px;
	}

	.gb-story-aside {
		gap: 14px;
		align-items: flex-start;
	}

	.gb-single-article,
	.gb-page-article {
		margin-inline: -16px;
		padding: 26px 16px 34px;
		border-right: 0;
		border-left: 0;
		border-radius: 0;
	}

	.gb-article-featured {
		margin-inline: -16px;
		border-radius: 0;
	}

	.gb-article-content {
		font-size: 16.5px;
		line-height: 1.76;
	}

	.gb-article-content > figure,
	.gb-article-content > .wp-block-image {
		margin-block: 28px;
	}

	.gb-article-content img {
		border-radius: 10px;
	}

	.gb-site-footer {
		margin-top: 56px;
	}

	.gb-footer-grid {
		padding-top: 42px;
		padding-bottom: 30px;
	}

	.gb-footer-bottom {
		gap: 10px;
	}

	.gb-footer-bottom .gbpc-legal-links {
		gap: 12px;
	}
}

/* Respect reduced motion without removing visual hierarchy. */
@media (prefers-reduced-motion: reduce) {
	.gb-home *,
	.gb-site-footer * {
		scroll-behavior: auto !important;
		transition-duration: .001ms !important;
		animation-duration: .001ms !important;
		animation-iteration-count: 1 !important;
	}
}