/* =========================================================================
   Marketing Services and its four service pages (Google Ads, SEO Services,
   AI SEO, Meta Ads). Builders: sites/growmyptpractice/pages-marketing.inc.php
   (gmp_mkt_*).
   ========================================================================= */

/* Inline SVG icons (Webflow's embedded Material Symbols), sized like the
   Icons8 PNGs next to them. */
.gmp-mkt-svg {
	line-height: 0;
	color: var(--wp--preset--color--ink);
}
.gmp-mkt-svg svg {
	width: 3rem;
	height: 3rem;
}
.gmp-mkt-svg.gmp-icon-sm svg {
	width: 2rem;
	height: 2rem;
}
.gmp-on-dark .gmp-mkt-svg {
	color: var(--wp--preset--color--base);
}
.gmp-feature .gmp-mkt-svg,
.gmp-mini .gmp-mkt-svg {
	margin-block: 0 1.25rem;
}
.gmp-mini .gmp-mkt-svg {
	margin-block-end: 0.75rem;
}
.gmp-align-center .gmp-mkt-svg {
	display: flex;
	justify-content: center;
}
.gmp-split__copy > .gmp-mkt-svg,
.gmp-split__copy > .gmp-icon {
	margin-block-end: 1.5rem;
}

/* Feature grid on the service pages: Webflow's h5 titles are smaller. */
.gmp-mkt-grid .gmp-feature__title {
	font-size: var(--wp--preset--font-size--x-large);
}
.gmp-mkt-grid .gmp-feature p {
	font-size: var(--wp--preset--font-size--small);
}

/* Section capped at Webflow's 1000px container. */
.gmp-mkt-narrow .gmp-section__inner {
	max-width: 62.5rem;
	margin-inline: auto;
}
.gmp-mkt-intro-sm h2 {
	font-size: var(--wp--preset--font-size--xx-large);
}

/* Heading left, copy right, no photo (AI SEO layout102). */
.gmp-mkt-pair h2 {
	margin-block-end: 0;
}

/* Icon + text lines (Meta Ads layout16). */
.gmp-mkt-list {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	margin-block: 2rem 0;
}
.gmp-mkt-list > * {
	margin: 0 !important;
}
.gmp-mkt-list__item {
	display: flex;
	align-items: center;
	gap: 1rem;
}
.gmp-mkt-list__item > * {
	margin: 0 !important;
}
.gmp-mkt-list__icon {
	flex: none;
}
.gmp-mkt-list__icon img {
	width: 1.5rem;
	height: 1.5rem;
}

/* Big blue numbers, two up (SEO Services layout218). */
.gmp-mkt-stats {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1.5rem;
	margin-block: 2rem 0;
}
.gmp-mkt-stats > *,
.gmp-mkt-stat > * {
	margin: 0 !important;
}
.gmp-mkt-stat__num {
	color: var(--wp--preset--color--accent);
	font-size: var(--wp--preset--font-size--xx-large);
	line-height: 1.2;
	margin-block-end: 0.5rem !important;
}

/* "Still have questions?" under the FAQ. */
.gmp-mkt-still h3 {
	font-size: var(--wp--preset--font-size--xx-large);
	margin-block: 0 1rem;
}

/* Photo hero with centered copy (AI SEO). Webflow kept the first button black. */
.gmp-mkt-hero-center .gmp-hero__copy {
	margin-inline: auto;
	text-align: center;
}
.gmp-mkt-hero-center .wp-block-buttons {
	justify-content: center;
}
.gmp-photo.gmp-mkt-hero-center .wp-block-button:not(.is-style-outline) > .wp-block-button__link {
	background: var(--wp--preset--color--black);
	color: var(--wp--preset--color--base);
	border-color: var(--wp--preset--color--black);
}

/* Rounded photo CTA card inside a white section (AI SEO cta41). */
.gmp-photo.gmp-mkt-cta-card.wp-block-cover {
	border-radius: var(--gmp-radius);
	overflow: hidden;
	padding: clamp(2rem, 1rem + 3vw, 4rem);
	align-items: center;
	justify-content: flex-start;
}
.gmp-mkt-cta-card .wp-block-cover__inner-container {
	width: 100%;
}
.gmp-mkt-cta-card .gmp-cta {
	max-width: 40rem;
	margin-inline: 0 !important;
}
.gmp-mkt-cta-card h2 {
	color: var(--wp--preset--color--base);
}

@media (max-width: 600px) {
	.gmp-mkt-stats {
		grid-template-columns: 1fr;
	}
}

/* Center the lead under centered headings. The theme caps paragraph width
   (about 664px), and inside .gmp-intro that capped paragraph sits flush left. */
.gmp-mkt-intro p,
.gmp-mkt-still p,
.gmp-mkt-hero-center .gmp-lead {
	margin-inline: auto;
}

/* Webflow's forced line break in the Meta Ads H1 only suits wide screens. */
@media (max-width: 600px) {
	.gmp-mkt-br-wide h1 br {
		display: none;
	}
}