/*
 * WP Rankings v2 — Home Hero (Blockstrap-native rebuild)
 * Styles the editable Blockstrap hero blocks that replaced the shortcode hero grid.
 * Scoped under .wpr-v2-hero so it does not collide with the shortcode-rendered
 * sections below it (which keep using wpr-v2-home-alpha.css).
 */

.wpr-v2-hero {
	--wpr-home-ink: #101828;
	--wpr-home-muted: #667085;
	--wpr-home-line: #e4e7ec;
	--wpr-home-primary: #5b39f2;
	--wpr-home-primary-2: #8c3cf7;
	position: relative;
	/* The site header is a Bootstrap .fixed-top navbar (~60px) that overlays the
	   page, so the hero must clear the header height plus breathing room. */
	padding: clamp(6.5rem, 6vw, 8rem) 0 clamp(1.75rem, 2.4vw, 2.5rem);
	color: var(--wpr-home-ink);
	background:
		radial-gradient(circle at 15% 12%, rgba(91, 57, 242, 0.13), transparent 30rem),
		radial-gradient(circle at 92% 22%, rgba(140, 60, 247, 0.08), transparent 32rem),
		linear-gradient(180deg, #fff 0%, #fbfbff 100%);
}

/* Guard against the mb-3 Blockstrap JS recovery can inject on the section container. */
.wpr-v2-hero.mb-3 {
	margin-bottom: 0 !important;
}

.wpr-v2-hero * {
	box-sizing: border-box;
}

.wpr-v2-hero .wpr-v2-hero-row {
	row-gap: 2rem;
}

.wpr-v2-hero-copy,
.wpr-v2-hero-visual {
	min-width: 0;
}

/* Rebalance columns at desktop so the dashboard card breathes (copy 46 / card 54).
   Container width is unchanged — same Bootstrap .container as the single page. */
@media (min-width: 992px) {
	.wpr-v2-hero-row > .wpr-v2-hero-copy {
		flex: 0 0 46%;
		max-width: 46%;
	}

	.wpr-v2-hero-row > .wpr-v2-hero-visual {
		flex: 0 0 54%;
		max-width: 54%;
	}
}

/* Badge */
.wpr-v2-hero-badge {
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;
	width: fit-content;
	margin: 0 0 1.15rem;
	padding: 0.45rem 0.8rem;
	border: 1px solid rgba(91, 57, 242, 0.16);
	border-radius: 999px;
	background: rgba(91, 57, 242, 0.08);
	color: var(--wpr-home-primary);
	font-size: 0.75rem;
	font-weight: 600;
	line-height: 1;
	text-transform: uppercase;
	letter-spacing: 0.02em;
}

.wpr-v2-hero-badge::before {
	content: "\2726";
	font-size: 0.82rem;
	line-height: 1;
}

/* Headline */
.wpr-v2-hero-title {
	max-width: 17ch;
	margin: 0;
	color: #111827;
	font-size: clamp(2.1rem, 2.9vw, 3.05rem);
	line-height: 1.05;
	font-weight: 600;
	letter-spacing: -0.015em;
}

.wpr-v2-hero-title span {
	display: inline;
	color: var(--wpr-home-primary);
}

/* Subtitle */
.wpr-v2-hero-subtitle {
	max-width: 34rem;
	margin: 1.2rem 0 0;
	color: #475467;
	font-size: clamp(1rem, 1.25vw, 1rem);
	line-height: 1.5;
	font-weight: 400;
}

/* Search form reuses .wpr-v2-home-search from wpr-v2-home-alpha.css;
   the CSS variables above keep its purple button + ink text intact here. */
.wpr-v2-hero .wpr-v2-home-search {
	margin-top: 1.55rem;
}

/* CTA buttons */
.wpr-v2-hero-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	align-items: center;
	margin-top: 1.1rem;
}

.wpr-v2-hero-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	min-height: 3.15rem;
	padding: 0 1.5rem;
	border: 1px solid transparent;
	border-radius: 8px;
	font-size: 0.95rem;
	font-weight: 600;
	line-height: 1;
	white-space: nowrap;
	box-shadow: 0 14px 28px rgba(16, 24, 40, 0.08);
	text-decoration: none;
	vertical-align: middle;
}

.wpr-v2-hero-btn > * {
	line-height: 1;
}

.wpr-v2-hero-btn.is-primary,
.wpr-v2-hero-btn.is-primary:visited {
	background: var(--wpr-home-primary);
	border-color: var(--wpr-home-primary);
	color: #fff;
}

.wpr-v2-hero-btn.is-primary:hover,
.wpr-v2-hero-btn.is-primary:focus {
	background: #4a2fd6;
	border-color: #4a2fd6;
	color: #fff;
}

.wpr-v2-hero-btn.is-ghost,
.wpr-v2-hero-btn.is-ghost:visited {
	background: #fff;
	border-color: rgba(16, 24, 40, 0.14);
	color: var(--wpr-home-ink);
	cursor: pointer;
}

.wpr-v2-hero-btn.is-ghost:hover {
	border-color: rgba(16, 24, 40, 0.28);
	color: var(--wpr-home-ink);
}

/* Button icons — inline-SVG backgrounds (stroke colour matches the button text). */
.wpr-v2-hero-actions .wpr-v2-hero-btn {
	display: inline-flex;
}

.wpr-v2-hero-btn::before {
	content: "";
	flex: none;
	width: 1.15rem;
	height: 1.15rem;
	background-position: center;
	background-size: contain;
	background-repeat: no-repeat;
}

.wpr-v2-hero-btn.is-primary::before {
	background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23ffffff'%20stroke-width='2.2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M3%203v18h18'/%3E%3Cpath%20d='M18%2017V9'/%3E%3Cpath%20d='M13%2017V5'/%3E%3Cpath%20d='M8%2017v-3'/%3E%3C/svg%3E");
}

.wpr-v2-hero-btn.is-ghost::before {
	background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23101828'%20stroke-width='2.2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M8%203%204%207l4%204'/%3E%3Cpath%20d='M4%207h16'/%3E%3Cpath%20d='m16%2021%204-4-4-4'/%3E%3Cpath%20d='M20%2017H4'/%3E%3C/svg%3E");
}

/* Ecosystem row */
.wpr-v2-hero-eco {
	margin-top: 1.45rem;
}

.wpr-v2-hero-eco-label {
	display: block;
	margin-bottom: 0.55rem;
	color: var(--wpr-home-muted);
	font-size: 0.78rem;
}

.wpr-v2-hero-eco-list {
	display: flex;
	flex-wrap: wrap;
	gap: 0.55rem 1.1rem;
	align-items: center;
}

.wpr-v2-hero-eco-list b {
	color: #344054;
	font-size: 0.82rem;
	font-weight: 600;
}

/* Powered-by: small plugin icon + linked product name, smaller text. */
.wpr-v2-hero-eco-list a {
	display: inline-flex;
	align-items: center;
	gap: 0.34rem;
	color: #344054;
	font-size: 0.78rem;
	font-weight: 600;
	text-decoration: none;
}
.wpr-v2-hero-eco-list a:hover {
	color: var(--wpr-home-primary);
	text-decoration: underline;
}
.wpr-v2-hero-eco-ico {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: none;
	width: 18px;
	height: 18px;
	border-radius: 4px;
	object-fit: contain;
	color: var(--wpr-home-muted);
}
.wpr-v2-hero-eco-ico svg { width: 18px; height: 18px; }
img.wpr-v2-hero-eco-ico { background: #fff; }
/* UWP Membership has no WP.org listing icon — custom "UM" badge. */
.wpr-v2-hero-eco-ico.is-um {
	background: var(--wpr-home-primary);
	color: #fff;
	font-size: 0.52rem;
	font-weight: 800;
	letter-spacing: 0.02em;
}

/* Premium nudge under the powered-by row. */
.wpr-v2-hero-nudge {
	margin: 0.9rem 0 0;
	color: var(--wpr-home-muted);
	font-size: 0.8rem;
	line-height: 1.45;
}
.wpr-v2-hero-nudge a {
	color: var(--wpr-home-primary);
	font-weight: 700;
	text-decoration: underline;
}

/* Dashboard preview (reuses .wpr-v2-home-dashboard markup + CSS). */
.wpr-v2-hero-visual .wpr-v2-home-dashboard {
	justify-self: stretch;
}

/* When the shortcode renders without its hero grid, let the new Blockstrap
   hero own the top spacing and sit flush against the stat strip below. */
.wpr-v2-home-hero--detached {
	padding-top: 0;
}

.wpr-v2-home-hero--detached .wpr-v2-home-stat-strip {
	margin-top: 0;
}

@media (max-width: 991.98px) {
	.wpr-v2-hero-visual {
		margin-top: 0.5rem;
	}

	.wpr-v2-hero-title {
		max-width: none;
	}
}

/* ---- Movement-focused dashboard preview ---- */
.wpr-v2-hero-dash {
	padding: 0.85rem;
}

/* Neutralise any stray <p> wpautop injects around the shortcode's inline rows. */
.wpr-v2-hero-dash p {
	margin: 0;
	display: contents;
}

.wpr-v2-hero-dash-stats {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 0.6rem;
}

.wpr-v2-hero-stat {
	padding: 0.7rem 0.75rem;
	border: 1px solid rgba(16, 24, 40, 0.07);
	border-radius: 10px;
	background: linear-gradient(180deg, #fff, #fafbff);
}

.wpr-v2-hero-stat span {
	display: block;
	color: #1d2939;
	font-size: 0.72rem;
	font-weight: 600;
}

.wpr-v2-hero-stat strong {
	display: block;
	margin-top: 0.3rem;
	font-size: clamp(1.05rem, 1.5vw, 1.4rem);
	line-height: 1;
}

.wpr-v2-hero-stat small {
	display: block;
	margin-top: 0.28rem;
	color: var(--wpr-home-muted);
	font-size: 0.68rem;
}

/* Growth-chart stat cell: "The Growth Chart" / [chart silhouette] / "is back!". */
.wpr-v2-hero-stat-chart {
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.wpr-v2-growth-chart-wrap {
	margin: 0.4rem 0 0.32rem;
}
.wpr-v2-growth-chart {
	display: block;
	width: 100%;
	height: 30px;
	overflow: visible;
}
.wpr-v2-growth-chart-sub {
	color: #5b39f2 !important; /* the "is back!" punchline in the chart's primary colour */
}

.wpr-v2-hero-dash-body {
	display: grid;
	grid-template-columns: minmax(0, 1.35fr) minmax(150px, 0.92fr);
	gap: 0.7rem;
	margin-top: 0.7rem;
}

.wpr-v2-hero-movers {
	padding: 0.75rem;
	border: 1px solid rgba(16, 24, 40, 0.07);
	border-radius: 10px;
	background: #fff;
}

.wpr-v2-hero-mover {
	display: grid;
	grid-template-columns: 2.1rem minmax(0, 1fr) auto;
	align-items: center;
	gap: 0.9rem;
	min-height: 3.15rem;
	padding: 0.5rem 0.5rem;
	margin: 0 -0.5rem;
	border-top: 1px solid var(--wpr-home-line);
	border-radius: 8px;
	color: var(--wpr-home-ink);
	transition: background-color 0.15s ease;
}

.wpr-v2-hero-mover:first-of-type {
	border-top: 0;
}

.wpr-v2-hero-mover:hover {
	background-color: rgba(91, 57, 242, 0.05);
}

.wpr-v2-hero-ico {
	width: 2.1rem;
	height: 2.1rem;
	border-radius: 8px;
	object-fit: cover;
	background: #f2f4f7;
	border: 1px solid rgba(16, 24, 40, 0.08);
}

.wpr-v2-hero-ico.is-sm {
	width: 1.7rem;
	height: 1.7rem;
}

span.wpr-v2-hero-ico--fallback {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: linear-gradient(135deg, var(--wpr-home-primary), var(--wpr-home-primary-2));
	color: #fff;
	font-size: 0.66rem;
	font-weight: 600;
}

.wpr-v2-hero-mover-name {
	min-width: 0;
	font-size: 0.88rem;
	font-weight: 600;
	line-height: 1.3;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.wpr-v2-hero-mover-name small {
	display: block;
	margin-top: 0.2rem;
	color: var(--wpr-home-muted);
	font-size: 0.74rem;
	font-weight: 500;
}

.wpr-v2-hero-move {
	font-size: 0.82rem;
	font-weight: 600;
	white-space: nowrap;
	text-align: right;
}

.wpr-v2-hero-move small {
	display: block;
	color: var(--wpr-home-muted);
	font-size: 0.62rem;
	font-weight: 700;
}

.wpr-v2-hero-move.is-up {
	color: #027a48;
}

.wpr-v2-hero-move.is-down {
	color: #b42318;
}

.wpr-v2-hero-move.is-flat {
	color: var(--wpr-home-muted);
}

.wpr-v2-hero-dash-note {
	margin-top: 0.6rem;
	padding-top: 0.55rem;
	border-top: 1px dashed rgba(16, 24, 40, 0.12);
	color: var(--wpr-home-muted);
	font-size: 0.68rem;
}

.wpr-v2-hero-risers {
	display: flex;
	flex-direction: column;
	gap: 0.6rem;
	height: 100%;
}

.wpr-v2-hero-riser {
	position: relative;
	display: flex;
	flex: 1;
	flex-direction: column;
	justify-content: center;
	gap: 0.3rem;
	padding: 0.7rem 0.8rem;
	border: 1px solid rgba(16, 24, 40, 0.08);
	border-radius: 11px;
	background: linear-gradient(180deg, #fff, #fafbff);
	color: var(--wpr-home-ink);
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.wpr-v2-hero-riser:hover {
	border-color: rgba(91, 57, 242, 0.35);
	box-shadow: 0 10px 24px rgba(16, 24, 40, 0.08);
}

/* Stretched link makes the whole card clickable without nesting a block in an <a>. */
.wpr-v2-hero-riser-link {
	position: absolute;
	inset: 0;
	z-index: 1;
	border-radius: 11px;
}

.wpr-v2-hero-riser > *:not(.wpr-v2-hero-riser-link) {
	position: relative;
	z-index: 2;
	pointer-events: none;
}

.wpr-v2-hero-riser.is-empty {
	justify-content: center;
}

.wpr-v2-hero-riser-tag {
	color: var(--wpr-home-primary);
	font-size: 0.62rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.03em;
}

.wpr-v2-hero-riser-head {
	display: flex;
	align-items: center;
	gap: 0.45rem;
	min-width: 0;
}

.wpr-v2-hero-riser-head strong {
	min-width: 0;
	font-size: 0.82rem;
	font-weight: 600;
	line-height: 1.1;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.wpr-v2-hero-riser-stat {
	display: flex;
	align-items: baseline;
	gap: 0.35rem;
}

.wpr-v2-hero-riser-stat strong {
	font-size: 1.05rem;
	line-height: 1;
}

.wpr-v2-hero-riser-stat span {
	color: var(--wpr-home-muted);
	font-size: 0.68rem;
}

.wpr-v2-hero-riser-foot {
	display: flex;
	flex-direction: column;
	gap: 0.15rem;
}

.wpr-v2-hero-riser-note {
	color: var(--wpr-home-muted);
	font-size: 0.66rem;
}

@media (max-width: 575.98px) {
	.wpr-v2-hero-dash-body {
		grid-template-columns: 1fr;
	}
}

/* ---- Stat strip (Blockstrap-native, sits below the hero) ---- */
.wpr-v2-statstrip-section {
	--wpr-home-ink: #101828;
	--wpr-home-muted: #667085;
	--wpr-home-line: #e4e7ec;
	--wpr-home-primary: #5b39f2;
	padding: 0 0 clamp(1.25rem, 2.4vw, 2.25rem);
	background: linear-gradient(180deg, #f6f8fc 0%, #f6f8fc 100%);
}

.wpr-v2-statstrip {
	border: 1px solid rgba(16, 24, 40, 0.08);
	border-radius: 16px;
	background: #fff;
	box-shadow: 0 24px 64px rgba(16, 24, 40, 0.1);
	overflow: hidden;
}

.wpr-v2-statstrip .wpr-v2-statstrip-row {
	--bs-gutter-x: 0;
	--bs-gutter-y: 0;
}

.wpr-v2-statstrip-item {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	column-gap: 0.85rem;
	align-items: center;
	min-height: 78px;
	height: 100%;
	padding: 0.85rem 1rem;
	border-right: 1px solid var(--wpr-home-line);
	color: var(--wpr-home-ink);
}

.wpr-v2-statstrip-col:last-child .wpr-v2-statstrip-item {
	border-right: 0;
}

.wpr-v2-statstrip-ico {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.45rem;
	height: 2.45rem;
	border: 1px solid rgba(91, 57, 242, 0.14);
	border-radius: 999px;
	background: rgba(91, 57, 242, 0.08);
	color: var(--wpr-home-primary);
	line-height: 0;
}

.wpr-v2-statstrip-ico svg {
	width: 1.18rem;
	height: 1.18rem;
}

.wpr-v2-statstrip-text {
	min-width: 0;
}

.wpr-v2-statstrip-text strong {
	display: block;
	font-size: clamp(1.25rem, 2vw, 1.55rem);
	line-height: 1;
	font-weight: 600;
}

.wpr-v2-statstrip-sub {
	display: block;
	margin-top: 0.3rem;
	color: #475467;
	font-size: 0.88rem;
	line-height: 1.28;
}

/* Sponsor ad slot — the 4th stat-strip cell, rendered as a centered mini
   sponsor card (mirrors the footer sponsor). The cell's flex/contents are
   render-injected by WPR_V2_Home_Cards (save-proof, §4.1). */
.wpr-v2-statstrip-item.is-sponsor {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
}

.wpr-v2-statstrip-sponsor {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.18rem;
}

.wpr-v2-statstrip-sponsor-head {
	font-family: Montserrat, -apple-system, BlinkMacSystemFont, "segoe ui", Roboto, Helvetica, Arial, sans-serif;
	font-size: 0.95rem;
	font-weight: 700;
	line-height: 1.1;
	color: #1d2939;
}

.wpr-v2-statstrip-sponsor-sub {
	font-size: 0.85rem;
	color: #667085;
}

.wpr-v2-statstrip-sponsor-btn {
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;
	margin-top: 0.55rem;
	padding: 0.5rem 0.9rem;
	border: 1px solid #d0d5dd;
	border-radius: 8px;
	background-color: #eee;
	color: #1d2939;
	font-size: 0.85rem;
	font-weight: 600;
	line-height: 1;
	transition: background-color 0.15s ease, border-color 0.15s ease;
}

.wpr-v2-statstrip-sponsor-btn:hover {
	background-color: #e0e2e7;
	border-color: #c2c7d0;
	color: #1d2939;
}

.wpr-v2-statstrip-sponsor-btn i {
	color: #1d2939;
}

@media (max-width: 991.98px) {
	.wpr-v2-statstrip-item {
		border-right: 0;
		border-bottom: 1px solid var(--wpr-home-line);
	}

	.wpr-v2-statstrip-col:last-child .wpr-v2-statstrip-item {
		border-bottom: 0;
	}
}

/* ---- Top Movers / All Plugins preview band ---- */
.wpr-v2-preview-section {
	--wpr-home-ink: #101828;
	--wpr-home-muted: #667085;
	--wpr-home-line: #e4e7ec;
	--wpr-home-primary: #5b39f2;
	--wpr-home-primary-2: #8c3cf7;
	padding: clamp(0.5rem, 1.5vw, 1.25rem) 0 clamp(1.25rem, 2.4vw, 2.25rem);
	background: #f6f8fc;
	color: var(--wpr-home-ink);
}

.wpr-v2-preview-section .wpr-v2-preview-row {
	--bs-gutter-x: 1.2rem;
	--bs-gutter-y: 1.2rem;
	align-items: stretch;
}

.wpr-v2-preview-card {
	height: 100%;
	padding: 1.1rem;
	border: 1px solid rgba(16, 24, 40, 0.08);
	border-radius: 14px;
	background: #fff;
	box-shadow: 0 24px 64px rgba(16, 24, 40, 0.1);
}

/* Neutralise any stray <p> wpautop injects around the shortcode list/table. */
.wpr-v2-preview-card p {
	margin: 0;
	display: contents;
}

.wpr-v2-preview-cardhead {
	display: flex;
	justify-content: space-between;
	gap: 1rem;
	align-items: center;
	margin-bottom: 0.8rem;
}

.wpr-v2-preview-cardhead strong {
	color: #111827;
	font-size: 0.95rem;
	font-weight: 600;
}

.wpr-v2-preview-cardhead a,
.wpr-v2-preview-cardhead span {
	color: var(--wpr-home-primary);
	font-size: 0.78rem;
	font-weight: 800;
	text-decoration: none;
	white-space: nowrap;
}

.wpr-v2-preview-note {
	margin: -0.45rem 0 0.7rem;
	color: var(--wpr-home-muted);
	font-size: 0.78rem;
	line-height: 1.35;
	font-weight: 400;
}

.wpr-v2-preview-empty {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 12rem;
	padding: 1.25rem;
	border: 1px dashed rgba(91, 57, 242, 0.24);
	border-radius: 10px;
	background: rgba(91, 57, 242, 0.045);
	color: #475467;
	font-size: 0.95rem;
	font-weight: 700;
	text-align: center;
}

/* Card 1 movers reuse .wpr-v2-hero-mover styles; tighten the row padding here. */
.wpr-v2-preview-movers .wpr-v2-hero-mover {
	margin: 0;
}

/* Card 2 table */
.wpr-v2-preview-table {
	display: flex;
	flex-direction: column;
}

.wpr-v2-preview-trow {
	display: grid;
	grid-template-columns: 2.4rem minmax(0, 1fr) auto auto;
	align-items: center;
	gap: 0.75rem;
	min-height: 3rem;
	padding: 0.35rem 0.4rem;
	border-top: 1px solid var(--wpr-home-line);
	color: var(--wpr-home-ink);
	transition: background-color 0.15s ease;
}

.wpr-v2-preview-trow.is-head {
	min-height: 0;
	padding: 0 0.4rem 0.55rem;
	border-top: 0;
	color: var(--wpr-home-muted);
	font-size: 0.74rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.02em;
}

.wpr-v2-preview-trow.is-head span {
	text-align: right;
}

.wpr-v2-preview-trow.is-head span:nth-child(1),
.wpr-v2-preview-trow.is-head span:nth-child(2) {
	text-align: left;
}

a.wpr-v2-preview-trow:hover {
	background-color: rgba(91, 57, 242, 0.05);
}

.wpr-v2-preview-rank {
	color: #475467;
	font-size: 0.82rem;
	font-weight: 600;
}

.wpr-v2-preview-plugin {
	display: flex;
	align-items: center;
	gap: 0.55rem;
	min-width: 0;
}

.wpr-v2-preview-name {
	min-width: 0;
	font-size: 0.84rem;
	font-weight: 600;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.wpr-v2-preview-installs {
	font-size: 0.82rem;
	font-weight: 800;
	text-align: right;
	white-space: nowrap;
}

.wpr-v2-preview-trend {
	text-align: right;
	white-space: nowrap;
}

@media (max-width: 575.98px) {
	.wpr-v2-preview-trow {
		grid-template-columns: 1.8rem minmax(0, 1fr) auto;
	}

	.wpr-v2-preview-trow .wpr-v2-preview-trend,
	.wpr-v2-preview-trow.is-head span:nth-child(4) {
		display: none;
	}
}

/* ---- "Why developers check it every morning" strip ---- */
.wpr-v2-why-section {
	--wpr-home-ink: #101828;
	--wpr-home-muted: #667085;
	--wpr-home-line: #e4e7ec;
	--wpr-home-primary: #5b39f2;
	padding: clamp(1.25rem, 2.6vw, 2.5rem) 0 clamp(1.25rem, 2.4vw, 2.25rem);
	background: #f6f8fc;
	color: var(--wpr-home-ink);
}

.wpr-v2-why-title {
	margin: 0 0 clamp(1rem, 1.8vw, 1.5rem);
	text-align: center;
	font-size: clamp(1.4rem, 2.2vw, 1.95rem);
	line-height: 1.15;
	font-weight: 600;
	letter-spacing: -0.01em;
	color: #111827;
}

.wpr-v2-why-strip {
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	border: 1px solid rgba(16, 24, 40, 0.08);
	border-radius: 16px;
	background: #fff;
	box-shadow: 0 18px 48px rgba(16, 24, 40, 0.07);
	overflow: hidden;
}

.wpr-v2-why-item {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	column-gap: 0.7rem;
	align-items: center;
	min-height: 76px;
	padding: 0.85rem 1rem;
	border-right: 1px solid var(--wpr-home-line);
}

.wpr-v2-why-strip .wpr-v2-why-item:last-child {
	border-right: 0;
}

.wpr-v2-why-ico {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.4rem;
	height: 2.4rem;
	border: 1px solid rgba(91, 57, 242, 0.14);
	border-radius: 10px;
	background: rgba(91, 57, 242, 0.08);
	color: var(--wpr-home-primary);
	line-height: 0;
}

.wpr-v2-why-ico svg {
	width: 1.15rem;
	height: 1.15rem;
}

.wpr-v2-why-text {
	min-width: 0;
}

.wpr-v2-why-text strong {
	display: block;
	font-size: 0.9rem;
	line-height: 1.2;
	font-weight: 600;
}

.wpr-v2-why-sub {
	display: block;
	margin-top: 0.1rem;
	color: var(--wpr-home-muted);
	font-size: 0.82rem;
	line-height: 1.3;
}

@media (max-width: 991.98px) {
	.wpr-v2-why-strip {
		grid-template-columns: 1fr;
	}

	.wpr-v2-why-item {
		border-right: 0;
		border-bottom: 1px solid var(--wpr-home-line);
	}

	.wpr-v2-why-strip .wpr-v2-why-item:last-child {
		border-bottom: 0;
	}
}

/* ---- Feature grid: "Everything you need to build better plugins" ---- */
.wpr-v2-features-section {
	--wpr-home-ink: #101828;
	--wpr-home-muted: #667085;
	padding: clamp(1rem, 2.4vw, 2.25rem) 0 clamp(1.5rem, 3vw, 3rem);
	background: #f6f8fc;
	color: var(--wpr-home-ink);
}

.wpr-v2-features-title {
	margin: 0 0 clamp(1rem, 1.8vw, 1.5rem);
	text-align: center;
	font-size: clamp(1.4rem, 2.2vw, 1.95rem);
	line-height: 1.15;
	font-weight: 600;
	letter-spacing: -0.01em;
	color: #111827;
}

.wpr-v2-features-card {
	padding: clamp(1rem, 1.6vw, 1.5rem);
	border: 1px solid rgba(16, 24, 40, 0.08);
	border-radius: 18px;
	background: #fff;
	box-shadow: 0 24px 64px rgba(16, 24, 40, 0.1);
}

.wpr-v2-features-card .wpr-v2-features-row {
	--bs-gutter-x: 0.85rem;
	--bs-gutter-y: 0.85rem;
}

.wpr-v2-feature {
	display: flex;
	flex-direction: column;
	align-items: center;
	height: 100%;
	min-height: 150px;
	padding: 1.1rem 0.85rem;
	border: 1px solid rgba(16, 24, 40, 0.06);
	border-radius: 12px;
	background: #fff;
	text-align: center;
}

.wpr-v2-feature-ico {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.6rem;
	height: 2.6rem;
	margin-bottom: 0.7rem;
	border-radius: 999px;
	background: rgba(91, 57, 242, 0.1);
	color: #5b39f2;
	line-height: 0;
}

.wpr-v2-feature-ico svg {
	width: 1.25rem;
	height: 1.25rem;
}

.wpr-v2-feature-title {
	display: block;
	font-size: 1rem;
	font-weight: 600;
	color: #111827;
}

.wpr-v2-feature-copy {
	display: block;
	margin-top: 0.4rem;
	color: var(--wpr-home-muted);
	font-size: 0.82rem;
	line-height: 1.4;
}

/* Per-feature soft colour tints (matching the mockup palette). */
.wpr-v2-feature.is-rankings    { background: rgba(91, 57, 242, 0.05);  border-color: rgba(91, 57, 242, 0.12); }
.wpr-v2-feature.is-rankings    .wpr-v2-feature-ico { background: rgba(91, 57, 242, 0.12);  color: #5b39f2; }
.wpr-v2-feature.is-charts      { background: rgba(47, 109, 246, 0.05); border-color: rgba(47, 109, 246, 0.12); }
.wpr-v2-feature.is-charts      .wpr-v2-feature-ico { background: rgba(47, 109, 246, 0.12); color: #2f6df6; }
.wpr-v2-feature.is-support     { background: rgba(18, 183, 106, 0.05); border-color: rgba(18, 183, 106, 0.12); }
.wpr-v2-feature.is-support     .wpr-v2-feature-ico { background: rgba(18, 183, 106, 0.12); color: #12b76a; }
.wpr-v2-feature.is-reviews     { background: rgba(245, 158, 11, 0.06); border-color: rgba(245, 158, 11, 0.14); }
.wpr-v2-feature.is-reviews     .wpr-v2-feature-ico { background: rgba(245, 158, 11, 0.14); color: #d97706; }
.wpr-v2-feature.is-competitors { background: rgba(236, 72, 153, 0.05); border-color: rgba(236, 72, 153, 0.12); }
.wpr-v2-feature.is-competitors .wpr-v2-feature-ico { background: rgba(236, 72, 153, 0.12); color: #ec4899; }
.wpr-v2-feature.is-installs    { background: rgba(6, 182, 212, 0.06);  border-color: rgba(6, 182, 212, 0.14); }
.wpr-v2-feature.is-installs    .wpr-v2-feature-ico { background: rgba(6, 182, 212, 0.14);  color: #0891b2; }

/* ---- Free / Premium split ---- */
.wpr-v2-plans-section {
	--wpr-home-ink: #101828;
	--wpr-home-muted: #667085;
	--wpr-home-primary: #5b39f2;
	padding: clamp(0.5rem, 1.5vw, 1.25rem) 0 clamp(1.75rem, 3vw, 3rem);
	background: #f6f8fc;
	color: var(--wpr-home-ink);
}

.wpr-v2-plans-section .wpr-v2-plans-row {
	--bs-gutter-x: 1.3rem;
	--bs-gutter-y: 1.3rem;
	align-items: stretch;
}

.wpr-v2-plan {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	gap: 1.15rem;
	height: 100%;
	padding: clamp(1.25rem, 2vw, 1.75rem);
	border: 1px solid rgba(16, 24, 40, 0.08);
	border-radius: 16px;
	background:
		linear-gradient(135deg, rgba(91, 57, 242, 0.06), rgba(18, 183, 106, 0.03)),
		#fff;
	box-shadow: 0 24px 64px rgba(16, 24, 40, 0.1);
}

.wpr-v2-plan.is-premium {
	background:
		linear-gradient(135deg, rgba(91, 57, 242, 0.07), rgba(140, 60, 247, 0.03)),
		#fff;
}

.wpr-v2-plan-ico {
	display: inline-flex;
	align-items: flex-start;
	justify-content: center;
	width: 3.4rem;
	height: 3.4rem;
	border: 1px solid rgba(91, 57, 242, 0.16);
	border-radius: 14px;
	background: rgba(91, 57, 242, 0.1);
	color: var(--wpr-home-primary);
	line-height: 0;
}

.wpr-v2-plan-ico svg {
	width: 1.6rem;
	height: 1.6rem;
	margin-top: 0.9rem;
}

.wpr-v2-plan-body {
	min-width: 0;
}

.wpr-v2-plan-title {
	display: block;
	font-size: clamp(1.15rem, 1.6vw, 1.35rem);
	line-height: 1.2;
	font-weight: 600;
	color: #111827;
}

.wpr-v2-plan-copy {
	margin: 0.5rem 0 0;
	color: var(--wpr-home-muted);
	font-size: 0.95rem;
	line-height: 1.5;
	max-width: 34rem;
}

.wpr-v2-plan-bullets {
	margin: 0.9rem 0 0;
	padding: 0;
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
}

.wpr-v2-plan-bullets li {
	position: relative;
	padding-left: 1.65rem;
	color: #344054;
	font-size: 0.9rem;
	font-weight: 700;
	line-height: 1.35;
}

.wpr-v2-plan-bullets li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.05rem;
	width: 1.15rem;
	height: 1.15rem;
	border-radius: 999px;
	background: rgba(91, 57, 242, 0.12);
}

.wpr-v2-plan-bullets li::after {
	content: "";
	position: absolute;
	left: 0.36rem;
	top: 0.32rem;
	width: 0.32rem;
	height: 0.6rem;
	border: solid var(--wpr-home-primary);
	border-width: 0 2px 2px 0;
	transform: rotate(45deg);
}

.wpr-v2-plan-note {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	margin-top: 1rem;
	padding: 0.32rem 0.75rem;
	border-radius: 999px;
	background: rgba(91, 57, 242, 0.1);
	color: var(--wpr-home-primary);
	font-size: 0.7rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.04em;
}

.wpr-v2-plan-note::before {
	content: "";
	width: 0.5rem;
	height: 0.5rem;
	border-radius: 999px;
	background: currentColor;
}

/* Premium bullets read as "planned": muted check tone. */
.wpr-v2-plan.is-premium .wpr-v2-plan-bullets li::before {
	background: rgba(102, 112, 133, 0.14);
}

.wpr-v2-plan.is-premium .wpr-v2-plan-bullets li::after {
	border-color: var(--wpr-home-muted);
}

@media (max-width: 575.98px) {
	.wpr-v2-plan {
		grid-template-columns: 1fr;
		gap: 0.85rem;
	}

	.wpr-v2-plan-ico svg {
		margin-top: 0;
	}

	.wpr-v2-plan-ico {
		align-items: center;
	}
}

/* =====================================================================
   Typography polish — Montserrat for headings/large display only,
   Inter (system fallback) for all body / UI text. Body bold = 600.
   ===================================================================== */
.wpr-v2-hero,
.wpr-v2-statstrip-section,
.wpr-v2-preview-section,
.wpr-v2-why-section,
.wpr-v2-features-section,
.wpr-v2-plans-section {
	font-family: Inter, -apple-system, BlinkMacSystemFont, "segoe ui", Roboto, Helvetica, Arial, sans-serif;
}

/* Headings + large display/title text keep Montserrat. */
.wpr-v2-hero-title,
.wpr-v2-why-title,
.wpr-v2-features-title,
.wpr-v2-hero-stat strong,
.wpr-v2-statstrip-text strong,
.wpr-v2-plan-title,
.wpr-v2-feature-title,
.wpr-v2-hero-riser-stat strong {
	font-family: Montserrat, -apple-system, BlinkMacSystemFont, "segoe ui", Roboto, Helvetica, Arial, sans-serif;
}

/* Restore strong weight on true display/title text (body bold stays 600). */
.wpr-v2-hero-title,
.wpr-v2-why-title,
.wpr-v2-features-title {
	font-weight: 800;
}

.wpr-v2-hero-stat strong,
.wpr-v2-statstrip-text strong,
.wpr-v2-plan-title,
.wpr-v2-feature-title,
.wpr-v2-hero-riser-stat strong {
	font-weight: 700;
}

/* =====================================================================
   Ecosystem row — plugin icon + name pairs
   ===================================================================== */
.wpr-v2-eco-item {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	text-decoration: none;
	color: inherit;
}

a.wpr-v2-eco-item:hover b {
	color: var(--wpr-home-primary);
}

.wpr-v2-eco-ico {
	width: 1.2rem;
	height: 1.2rem;
	border-radius: 5px;
	object-fit: cover;
	background: #f2f4f7;
	border: 1px solid rgba(16, 24, 40, 0.08);
}

.wpr-v2-eco-ico--fallback {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: 0;
	background: linear-gradient(135deg, var(--wpr-home-primary), var(--wpr-home-primary-2));
	color: #fff;
	font-size: 0.55rem;
	font-weight: 600;
}

/* Footer styles moved to wpr-v2-footer.css (enqueued globally, since the footer
   renders on every page — not just the front page like this hero CSS). */

/* ============================================================================
 * Home hero — native GD Search widget ([gd_search]).
 * Keep the widget's NATIVE (full-column) width — only fix the wpautop <p>
 * layout break, give the input/button a little more height, and align the
 * button. Scoped to .wpr-v2-hero-copy (archive/search .wpr-v2-arch-search
 * is untouched).
 * ========================================================================== */

/* Dissolve the <p> tags wpautop injects into the multi-line [gd_search] output
   (one even wraps the visible input). display:contents removes their boxes so
   the GD input-group lays out natively and the empty/hidden-input <p>s collapse. */
.wpr-v2-hero-copy .geodir-listing-search p {
	display: contents !important;
}

.wpr-v2-hero-copy .geodir-listing-search {
	margin-top: 1.1rem;
}

/* One row, vertically centered, no leftover wpautop gaps. */
.wpr-v2-hero-copy .geodir-listing-search .geodir-search.row {
	margin: 0 !important;
	row-gap: 0 !important;
	align-items: center !important;
}

/* A little more input height than the cramped sm default. Horizontal padding is
   left to GeoDirectory so the magnifier icon keeps its clearance (no overlap). */
.wpr-v2-hero-copy .geodir-listing-search .input-group-inside {
	min-height: 2.85rem;
}
.wpr-v2-hero-copy .geodir-listing-search .form-control {
	min-height: 2.85rem !important;
	height: 2.85rem !important;
	font-size: 0.95rem !important;
}

/* Submit button: same height as the input (aligned, not a floating square),
   comfortable horizontal padding, icon centered. */
.wpr-v2-hero-copy .geodir-listing-search .geodir_submit_search.btn {
	height: 2.85rem !important;
	padding: 0 1.1rem !important;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

/* Right column top-aligns so its stat cards + 5 movers sit inline (high) with
   the hero copy instead of dropping lower. */
@media (min-width: 992px) {
	.wpr-v2-hero .wpr-v2-hero-row {
		align-items: flex-start !important;
	}
}

/* Hero search fine-tuning (per review). Scoped to the hero so neither the global
   Bootstrap .px-3 utility nor the archive/search GD bar is affected. */

/* Remove ONLY the left padding the .px-3 utility puts on the search row
   (keep the right padding so the button still clears the edge). */
.wpr-v2-hero-copy .geodir-listing-search .geodir-search.row {
	padding-left: 0 !important;
}

/* Magnifier icon: a little extra padding (0.425rem -> 0.8rem). */
.wpr-v2-hero-copy .geodir-listing-search .input-group-text {
	padding-top: 0.8rem !important;
	padding-bottom: 0.8rem !important;
}