/*
 * Product pages (/product/phone-farm/, android-emulator, remote-phone,
 * proxy-browser) and feature pages (/features/rpa/, social-media-automation,
 * seedream, proxy-management) seeded from seed/products.php and
 * seed/features.php. Builders: seed/lib/products.php.
 *
 * Everything is scoped to .prd-page (the wrapper group of each page) so it
 * cannot leak into other page families. Shared pieces (geelark-section,
 * geelark-media, geelark-faq, geelark-tabs, geelark-carousel, geelark-cta-box)
 * come from landing.css; this file only adds what those lack.
 */

.prd-page {
	--prd-line: #edf2f7;
	--prd-muted: #4a5568;
	--prd-soft: #f7f9fc;
	--prd-band: #f4fbff;
	--prd-green: #48bb78;
	overflow-x: clip;
}

/* ---------- section rhythm ---------- */

.prd-page > .geelark-section {
	padding-block: 56px;
	padding-inline: 24px;
}

.prd-page > .geelark-hero-section {
	padding-block: 48px 40px !important;
}

.prd-page > .geelark-cta-section {
	padding-block: 88px !important;
}

/* Flow gaps inside our components are set explicitly. */
.prd-page .geelark-section > * + * {
	margin-block-start: 40px;
}

.prd-page :where(.prd-card, .prd-head, .prd-use, .prd-check, .prd-callout-body, .prd-split-copy, .prd-hero-copy) > * {
	margin-block: 0;
}

.prd-page .wp-block-columns {
	margin-block-end: 0;
}

/* ---------- type ---------- */

.prd-page h2 {
	font-size: clamp(1.625rem, 1.2rem + 1.2vw, 1.875rem);
	line-height: 1.25;
}

.prd-page h3 {
	font-size: 1.125rem;
	line-height: 1.4;
}

.prd-page .prd-center,
.prd-page .has-text-align-center {
	text-align: center;
}

.prd-page .geelark-kicker {
	font-size: 0.75rem;
	letter-spacing: 0.04em;
}

.prd-head > * + * {
	margin-top: 0.75rem !important;
}

.prd-head .geelark-kicker + h2 {
	margin-top: 0.5rem !important;
}

.prd-head h2,
.prd-head .geelark-lead-muted {
	max-width: 880px;
}

.prd-head .geelark-lead-muted {
	font-size: 1rem;
	line-height: 1.55;
}

.prd-head.is-center {
	text-align: center;
}

.prd-head.is-center > * {
	margin-inline: auto;
}

.prd-page .geelark-arrow-link {
	font-size: 0.875rem;
	font-weight: 500;
}

/* ---------- hero ---------- */

.prd-hero {
	gap: 48px !important;
}

.prd-hero h1 {
	font-size: clamp(2.25rem, 1.4rem + 2.6vw, 3.25rem);
	line-height: 1.1;
}

.prd-hero-copy > * + * {
	margin-top: 1.25rem !important;
}

.prd-hero-lead {
	max-width: 36rem;
	font-size: 1.0625rem;
	line-height: 1.6;
	color: var(--wp--preset--color--body);
}

.prd-hero .wp-block-button__link {
	padding: 9px 28px;
	font-size: 0.9375rem;
}

.prd-hero-note {
	color: var(--prd-muted);
	font-size: 0.875rem;
}

.prd-page .geelark-check-pills {
	gap: 12px;
}

.prd-page .geelark-dot-pill {
	padding: 0.6rem 1.25rem;
}

/* ---------- illustration frames ---------- */

.prd-media {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 20px;
	min-height: 220px;
}

.prd-media.is-hero {
	min-height: 360px;
}

.prd-media.is-cover {
	min-height: 0;
	padding: 0;
	aspect-ratio: 16 / 9;
}

.prd-media.is-plain {
	background: none;
	padding: 0;
	min-height: 0;
}

.prd-media .geelark-illustration img {
	max-height: 360px;
	object-fit: contain;
}

.prd-media.is-cover .geelark-illustration img {
	max-height: none;
	object-fit: cover;
}

/* ---------- check row under the hero ---------- */

.prd-checks {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 24px;
	margin-top: 32px !important;
}

.prd-checks.is-3 {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.prd-check {
	position: relative;
	padding-left: 52px;
	min-height: 36px;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.prd-check::before {
	content: "";
	position: absolute;
	left: 8px;
	top: 50%;
	width: 24px;
	height: 24px;
	margin-top: -12px;
	border: 2px solid #8bd36a;
	border-radius: 50%;
}

.prd-check::after {
	content: "";
	position: absolute;
	left: 16px;
	top: 50%;
	width: 9px;
	height: 5px;
	margin-top: -5px;
	border-left: 2px solid #6cc24a;
	border-bottom: 2px solid #6cc24a;
	transform: rotate(-45deg);
}

.prd-check h3 {
	color: var(--wp--preset--color--primary);
	font-size: 1.0625rem;
	font-weight: 500;
}

.prd-check p {
	margin-top: 0.5rem !important;
	font-size: 0.8125rem;
	line-height: 1.3;
	color: #232323;
}

/* ---------- callout box with a big glyph ---------- */

.prd-callout {
	display: grid;
	grid-template-columns: 64px minmax(0, 1fr);
	gap: 24px;
	align-items: center;
	padding: 24px 40px;
	border: 2px solid var(--wp--preset--color--primary);
	border-radius: 24px;
}

.prd-callout.is-plain {
	border: 0;
	padding-inline: 24px;
}

.prd-callout-body > * + * {
	margin-top: 0.75rem !important;
}

.prd-callout h2 {
	font-size: 1.625rem;
	font-weight: 600;
}

.prd-callout h3 {
	font-size: 1.25rem;
	font-weight: 600;
}

.prd-callout p {
	color: var(--prd-muted);
	line-height: 1.55;
}

.prd-glyph {
	width: 56px;
	height: 56px;
	margin: 0 auto !important;
	background: var(--wp--preset--color--primary);
	-webkit-mask: var(--prd-glyph) center / contain no-repeat;
	mask: var(--prd-glyph) center / contain no-repeat;
}

.prd-glyph.is-question { --prd-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.5c-3.6 0-6.2 2.3-6.4 5.6h3.6c.2-1.4 1.3-2.4 2.8-2.4 1.6 0 2.7 1 2.7 2.3 0 1.2-.6 1.9-2.1 2.8-1.9 1.1-2.7 2.4-2.6 4.4v.9h3.5v-.7c0-1.3.5-1.9 2.1-2.9 1.8-1.1 3-2.6 3-4.8 0-3.1-2.7-5.2-6.6-5.2zM12 17.3a2.1 2.1 0 1 0 0 4.2 2.1 2.1 0 0 0 0-4.2z'/%3E%3C/svg%3E"); }
.prd-glyph.is-alert { --prd-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 1.5a10.5 10.5 0 1 0 0 21 10.5 10.5 0 0 0 0-21zm-1.5 5h3l-.4 7.5h-2.2zm1.5 9.2a1.6 1.6 0 1 1 0 3.2 1.6 1.6 0 0 1 0-3.2z'/%3E%3C/svg%3E"); }
.prd-glyph.is-phone { --prd-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linejoin='round'%3E%3Crect x='7.5' y='2.5' width='9' height='17' rx='1.5'/%3E%3Crect x='2.5' y='7' width='4' height='10' rx='1'/%3E%3Crect x='17.5' y='7' width='4' height='10' rx='1'/%3E%3Cpath d='M11 17h2'/%3E%3C/svg%3E"); }
.prd-glyph.is-bulb { --prd-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 1.5a7 7 0 0 0-4.2 12.6c.7.6 1.2 1.4 1.2 2.4v.5h6v-.5c0-1 .5-1.8 1.2-2.4A7 7 0 0 0 12 1.5zM9 18.5h6v1.5a2 2 0 0 1-2 2h-2a2 2 0 0 1-2-2z'/%3E%3C/svg%3E"); }

/* ---------- card grids ---------- */

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

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

.prd-grid.is-4 {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

.prd-grid.is-wide-gap {
	gap: 24px;
}

.prd-grid.is-centered {
	justify-content: center;
}

.prd-card {
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
	padding: 24px;
	border-radius: 16px;
}

.prd-card > * {
	margin: 0 !important;
}

.prd-card p {
	color: var(--prd-muted);
	font-size: 0.875rem;
	line-height: 1.6;
}

.prd-card .wp-block-buttons {
	margin-top: 0.25rem !important;
}

.prd-card .wp-block-button__link,
.prd-small-btn .wp-block-button__link {
	padding: 6px 24px !important;
	font-size: 0.8125rem;
}

.prd-card > .prd-media {
	margin-top: auto !important;
}

.prd-grid.is-soft .prd-card,
.prd-card.is-soft {
	background: var(--prd-soft);
}

.prd-grid.is-outline .prd-card,
.prd-card.is-outline {
	border: 1px solid #e2e8f0;
	background: var(--wp--preset--color--base);
}

.prd-grid.is-shadow .prd-card,
.prd-card.is-shadow {
	background: var(--wp--preset--color--base);
	box-shadow: 0 3px 16px rgba(70, 115, 152, 0.12);
}

.prd-grid.is-big .prd-card {
	padding: 28px 32px;
}

.prd-grid.is-big .prd-card h3 {
	font-size: clamp(1.375rem, 1rem + 0.9vw, 1.75rem);
	font-weight: 400;
	line-height: 1.25;
}

.prd-grid.is-big .prd-card h2 {
	font-size: clamp(1.375rem, 1rem + 0.9vw, 1.75rem);
}

.prd-grid.is-big .prd-card p {
	font-size: 0.9375rem;
}

.prd-card .geelark-icon-box {
	width: 2.75rem;
	height: 2.75rem;
	border-radius: 8px;
	background: var(--wp--preset--color--tint);
}

.prd-card .geelark-icon-box::after {
	color: var(--wp--preset--color--primary);
}

.prd-card.is-icon-round .geelark-icon-box,
.prd-grid.is-icon-round .geelark-icon-box {
	width: 3.25rem;
	height: 3.25rem;
	border-radius: 50%;
	background: #edf2f7;
}

.prd-card.is-icon-round .geelark-icon-box::after,
.prd-grid.is-icon-round .geelark-icon-box::after {
	color: var(--wp--preset--color--contrast);
}

.prd-grid.is-outline-blue .prd-card {
	border: 2px solid #edf2f7;
	background: var(--wp--preset--color--base);
}

.prd-card h3 a,
.prd-related h3 a {
	color: inherit;
	text-decoration: none;
}

.prd-card h3 a:hover {
	color: var(--wp--preset--color--primary);
}

/* Small tiles: icon + title + text on a grey panel */
.prd-grid.is-tiles {
	gap: 12px;
}

.prd-grid.is-tiles .prd-card {
	display: grid;
	grid-template-columns: 1.25rem minmax(0, 1fr);
	gap: 0.25rem 0.75rem;
	padding: 16px 20px;
	border-radius: 8px;
	background: var(--prd-soft);
}

.prd-grid.is-tiles .geelark-icon-box {
	grid-row: span 2;
	width: 1.25rem;
	height: 1.25rem;
	background: none;
}

.prd-grid.is-tiles .geelark-icon-box::after {
	inset: 0;
	color: var(--wp--preset--color--contrast);
}

.prd-grid.is-tiles h3 {
	font-size: 1rem;
	font-weight: 500;
}

.prd-grid.is-tiles p {
	font-size: 0.8125rem;
	line-height: 1.45;
}

/* Related products */
.prd-related {
	text-align: left;
}

.prd-related h3 {
	font-weight: 600;
}

/* ---------- numbered steps ---------- */

.prd-steps .prd-card {
	padding: 16px 20px;
}

.prd-num {
	color: var(--wp--preset--color--primary);
	font-size: 0.9375rem;
	margin-bottom: 0.75rem !important;
}

.prd-steps.is-joined {
	gap: 0;
	overflow: hidden;
	border: 1px solid #e2e8f0;
	border-radius: 12px;
}

.prd-steps.is-joined .prd-card {
	padding: 20px;
	border-radius: 0;
}

.prd-steps.is-joined .prd-card + .prd-card {
	border-left: 1px solid #e2e8f0;
}

.prd-steps.is-joined .prd-num {
	font-size: 1.25rem;
}

/* ---------- text + image rows ---------- */

.prd-split {
	gap: 56px !important;
	align-items: center !important;
}

@media (min-width: 782px) {
	.prd-split > .wp-block-column {
		flex: 1 1 0 !important;
	}
}

.prd-split-copy {
	padding-inline: 32px;
}

.prd-split-copy > * + * {
	margin-top: 1rem !important;
}

.prd-split-copy p {
	color: var(--prd-muted);
	font-size: 0.9375rem;
	line-height: 1.6;
}

.prd-split-copy .wp-block-button__link {
	padding: 6px 24px;
	font-size: 0.8125rem;
}

.prd-split + .prd-grid,
.prd-head + .prd-grid,
.prd-head + .prd-uses,
.prd-head + .prd-steps {
	margin-top: 40px !important;
}

/* ---------- use cases ---------- */

.prd-uses {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 56px 48px;
	max-width: 1010px !important;
	margin-inline: auto !important;
}

.prd-uses.is-3 {
	grid-template-columns: repeat(3, minmax(0, 1fr));
	max-width: 960px !important;
}

.prd-use > * + * {
	margin-top: 0.75rem !important;
}

.prd-use .geelark-icon-box {
	width: 2.25rem;
	height: 2.25rem;
	background: none;
}

.prd-use .geelark-icon-box::after {
	inset: 0;
	color: var(--wp--preset--color--primary);
}

.prd-use h3 {
	margin-top: 1.25rem !important;
	font-size: 1.25rem;
	font-weight: 600;
}

.prd-use p {
	color: var(--prd-muted);
	font-size: 0.875rem;
	line-height: 1.6;
}

/* ---------- tables ---------- */

.prd-table-wrap {
	overflow-x: auto;
}

.prd-table {
	margin: 0;
}

.prd-table table {
	width: 100%;
	border-collapse: collapse;
	font-size: 0.875rem;
}

.prd-table th,
.prd-table td {
	padding: 10px 12px;
	border: 0;
	text-align: left;
	vertical-align: middle;
	color: var(--wp--preset--color--contrast);
	line-height: 1.4;
}

.prd-table thead th {
	font-weight: 600;
	border-bottom: 0;
}

.prd-table tbody tr:nth-child(odd) {
	background: #f1f2f4;
}

.prd-table thead {
	border-bottom: 0;
}

.is-center-head .prd-table thead th {
	text-align: center;
}

.prd-table-note {
	color: var(--prd-muted);
	font-size: 0.8125rem;
	font-style: italic;
	text-align: center;
}

/* ---------- platform strip ---------- */

.prd-logos {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 16px 24px;
	padding-block: 24px;
	border-top: 1px solid #e2e8f0;
}

.prd-logo {
	gap: 0.5rem;
	align-items: center;
}

.prd-logo > * {
	margin: 0 !important;
}

.prd-logo .geelark-icon-box {
	width: 1.5rem;
	height: 1.5rem;
	background: none;
}

.prd-logo .geelark-icon-box::after {
	inset: 0;
}

.prd-logo p {
	font-family: var(--wp--preset--font-family--golos);
	font-weight: 600;
	color: var(--wp--preset--color--contrast);
}

/* ---------- template rows ---------- */

.prd-templates {
	max-width: 400px;
}

.prd-templates > * + * {
	margin-top: 10px !important;
}

.prd-template {
	margin: 0 !important;
	padding: 0.4rem 1rem;
	font-size: 0.875rem;
}

.prd-template .geelark-icon-box {
	width: 2rem;
	height: 2rem;
}

.prd-template a {
	color: var(--wp--preset--color--contrast);
	text-decoration: none;
}

.prd-template a:hover {
	color: var(--wp--preset--color--primary);
}

.prd-templates .wp-block-buttons {
	justify-content: center;
	margin-top: 1.25rem !important;
}

/* ---------- chooser ---------- */

.prd-chooser h3 {
	font-size: 0.9375rem;
	font-weight: 600;
}

.prd-chooser p {
	font-size: 0.875rem;
	line-height: 1.6;
}

.prd-chooser .geelark-choose > * + * {
	margin-top: 0.75rem;
}

.prd-page .geelark-chooser {
	margin-top: 32px !important;
}

/* ---------- tinted band and carousels ---------- */

.prd-band {
	background: var(--prd-band);
	padding-block: 80px !important;
}

.prd-carousel {
	margin-top: 32px !important;
}

.prd-carousel .geelark-carousel-prev,
.prd-carousel .geelark-carousel-next {
	display: grid;
	place-items: center;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background: var(--wp--preset--color--base);
	box-shadow: 0 2px 8px rgba(15, 23, 42, 0.12);
	font-size: 1.375rem;
}

.prd-carousel .geelark-carousel-prev:focus-visible,
.prd-carousel .geelark-carousel-next:focus-visible {
	outline: 2px solid var(--wp--preset--color--primary);
	outline-offset: 2px;
}

.prd-carousel.is-thirds .geelark-carousel-track > .prd-card {
	flex: 0 0 calc((100% - 32px) / 3);
	scroll-snap-align: start;
}

.prd-setup {
	padding: 20px;
	border: 1px solid #e2e8f0;
	background: var(--wp--preset--color--base);
	border-radius: 12px;
}

.prd-card-kicker {
	color: var(--wp--preset--color--primary) !important;
	font-size: 0.6875rem !important;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.prd-setup h3 {
	font-size: 1rem;
	font-weight: 600;
}

.prd-bullets {
	margin: 0;
	padding-left: 1.1rem;
	color: var(--prd-muted);
	font-size: 0.8125rem;
	line-height: 1.5;
}

.prd-bullets li::marker {
	color: var(--wp--preset--color--primary);
}

.prd-bullets li + li {
	margin-top: 0.5rem;
}

.prd-card-meta {
	margin-top: auto !important;
	padding-top: 0.75rem;
	border-top: 1px solid #edf2f7;
	font-size: 0.75rem !important;
}

.prd-setup .wp-block-buttons,
.prd-setup .wp-block-button {
	width: 100%;
}

.prd-setup .wp-block-button__link {
	width: 100%;
	border-color: #e2e8f0 !important;
	color: var(--wp--preset--color--contrast) !important;
}

.prd-note {
	color: #718096;
	font-size: 0.8125rem;
	text-align: center;
}

.prd-guide {
	padding: 0;
	overflow: hidden;
	border-radius: 12px;
	background: var(--wp--preset--color--base);
	box-shadow: 0 3px 16px rgba(70, 115, 152, 0.12);
}

.prd-guide > :not(.prd-media) {
	padding-inline: 16px;
}

.prd-guide > :last-child {
	padding-bottom: 20px;
}

.prd-guide h3 {
	font-size: 1.125rem;
	font-weight: 600;
}

/* ---------- pill links ---------- */

.prd-pills {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 16px;
	max-width: 760px !important;
	margin-inline: auto !important;
	padding: 0;
	list-style: none;
}

.prd-pills li {
	margin: 0;
}

.prd-pills a {
	display: inline-block;
	min-width: 120px;
	padding: 4px 24px;
	border: 1px solid #c3dafe;
	border-radius: 8px;
	color: var(--wp--preset--color--primary);
	font-size: 0.8125rem;
	text-align: center;
	text-decoration: none;
}

.prd-pills a:hover {
	background: var(--wp--preset--color--tint);
}

/* ---------- small link tiles (seedream "explore more") ---------- */

.prd-grid.is-links {
	max-width: 880px !important;
	margin-inline: auto !important;
	gap: 16px 32px;
}

.prd-grid.is-links .prd-card {
	display: grid;
	grid-template-columns: 1.25rem minmax(0, 1fr);
	gap: 0 0.6rem;
	padding: 12px 16px;
	border-radius: 8px;
	background: var(--prd-soft);
}

.prd-grid.is-links .geelark-icon-box {
	grid-row: span 2;
	width: 1.125rem;
	height: 1.125rem;
	background: none;
}

.prd-grid.is-links .geelark-icon-box::after {
	inset: 0;
	color: var(--wp--preset--color--contrast);
}

.prd-grid.is-links h3 {
	font-size: 0.9375rem;
	font-weight: 500;
}

.prd-grid.is-links p {
	font-size: 0.75rem;
}

/* ---------- two-column model overview (seedream) ---------- */

.prd-overview {
	gap: 48px !important;
}

.prd-overview .wp-block-column > * + * {
	margin-top: 1rem !important;
}

.prd-overview .geelark-lead-muted {
	font-size: 1rem;
}

/* ---------- tabs ---------- */

.prd-page .geelark-tabs-dark .geelark-tab-list {
	margin-block: 0 2rem !important;
	border-bottom-width: 1px;
}

.prd-page .geelark-tab {
	font-size: 0.875rem;
}

.prd-page .geelark-tab:focus-visible {
	outline: 2px solid var(--wp--preset--color--primary);
	outline-offset: 2px;
}

.prd-page .geelark-tab-panel .prd-split {
	margin-top: 0 !important;
}

/* ---------- proxy management (the reference's older "v1" template) ---------- */

.prd-proxy-management .gl-section {
	margin: 0;
}

.prd-v1-icons {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 24px 36px;
	margin-top: 40px !important;
}

.prd-v1-icons > * {
	margin: 0 !important;
}

.prd-v1-icons .geelark-icon-box {
	width: 2.5rem;
	height: 2.5rem;
	border-radius: 8px;
	background: #000;
	box-shadow: 0 0 14px rgba(0, 200, 255, 0.45);
}

.prd-v1-icons .geelark-icon-box::after {
	color: #fff;
}

.prd-v1-cta {
	padding: 48px 32px;
	border: 1px solid var(--wp--preset--color--primary);
	border-radius: 24px;
	text-align: center;
}

.prd-v1-cta .wp-block-buttons {
	justify-content: center;
}

.prd-proxy-management .gl-quote p:last-child {
	margin: 0;
}

/* ---------- responsive ---------- */

@media (max-width: 1100px) {
	.prd-checks,
	.prd-grid.is-4 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.prd-steps.is-joined .prd-card:nth-child(3) {
		border-left: 0;
	}

	.prd-steps.is-joined .prd-card:nth-child(n + 3) {
		border-top: 1px solid #e2e8f0;
	}

	.prd-split-copy {
		padding-inline: 0;
	}
}

@media (max-width: 781px) {
	.prd-page > .geelark-section {
		padding-block: 40px;
		padding-inline: 16px;
	}

	.prd-band {
		padding-block: 56px !important;
	}

	.prd-page > .geelark-cta-section {
		padding-block: 56px !important;
	}

	.prd-page .geelark-section > * + * {
		margin-block-start: 28px;
	}

	.prd-checks,
	.prd-checks.is-3,
	.prd-grid,
	.prd-grid.is-2,
	.prd-grid.is-4,
	.prd-uses,
	.prd-uses.is-3 {
		grid-template-columns: minmax(0, 1fr);
	}

	.prd-uses {
		gap: 36px;
	}

	.prd-steps.is-joined .prd-card + .prd-card {
		border-left: 0;
		border-top: 1px solid #e2e8f0;
	}

	.prd-callout {
		grid-template-columns: minmax(0, 1fr);
		gap: 12px;
		padding: 20px;
	}

	.prd-glyph {
		margin: 0 !important;
		width: 40px;
		height: 40px;
	}

	.prd-media.is-hero {
		min-height: 240px;
	}

	.prd-split {
		gap: 24px !important;
	}

	.prd-split.is-reverse {
		flex-direction: column-reverse;
	}

	.prd-table table {
		min-width: 620px;
	}

	.prd-carousel.is-thirds .geelark-carousel-track > .prd-card {
		flex-basis: 100%;
	}

	.prd-logos {
		justify-content: center;
	}

	.prd-v1-cta {
		padding: 32px 20px;
	}
}

/* ---------- small layout helpers ---------- */

.prd-page .prd-center-btns {
	justify-content: center;
}

.prd-grid.prd-narrow-grid,
.prd-table-wrap.prd-narrow-table {
	max-width: 1000px !important;
	margin-inline: auto !important;
}

.prd-callout.is-small {
	max-width: 1000px !important;
	margin-inline: auto !important;
	padding-block: 16px;
}

.prd-callout.is-small p {
	font-size: 0.875rem;
}

/* Grid children: drop the flow layout's top margins so rows line up. */
.prd-page :is(.prd-grid, .prd-uses, .prd-checks, .prd-logos, .geelark-carousel-track, .prd-callout) > * {
	margin-block: 0 !important;
}

@media (min-width: 782px) {
	.prd-grid.is-3.is-centered > :last-child:nth-child(3n + 1) {
		grid-column: 2;
	}
}

/* ---------- feature page details ---------- */

.prd-grid.prd-plain-cards .prd-card {
	padding: 12px;
}

.prd-grid.prd-plain-cards .geelark-icon-box {
	width: 2rem;
	height: 2rem;
}

.prd-grid.prd-plain-cards h3,
.prd-grid.is-outline h3 {
	font-size: 1rem;
	font-weight: 500;
}

.prd-grid.prd-blue-titles {
	gap: 40px 24px;
}

.prd-grid.prd-blue-titles .prd-card {
	padding: 12px;
}

.prd-grid.prd-blue-titles h3 {
	color: var(--wp--preset--color--primary);
	font-size: 1rem;
	font-weight: 500;
}

.prd-page .prd-sub {
	font-size: 1.5rem;
	font-weight: 400;
}

.prd-ways > * {
	max-width: 420px;
}

.prd-ways > * + * {
	margin-top: 1rem !important;
}

.prd-model-links {
	justify-content: center;
	gap: 12px 16px;
}

.prd-model-links p {
	margin: 0;
}

.prd-model-links a {
	display: inline-block;
	padding: 4px 16px;
	border: 1px solid #e2e8f0;
	border-radius: 999px;
	color: var(--wp--preset--color--contrast);
	font-size: 0.875rem;
	text-decoration: none;
}

.prd-model-links a:hover {
	border-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--primary);
}

/* Tablet: the reference keeps two columns of cards down to ~600px. */
@media (min-width: 600px) and (max-width: 781px) {
	.prd-checks,
	.prd-grid.is-2,
	.prd-grid.is-3,
	.prd-grid.is-4,
	.prd-uses,
	.prd-uses.is-3 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.prd-grid.is-tiles,
	.prd-grid.is-links {
		grid-template-columns: minmax(0, 1fr);
	}
}