/*
 * Scoped heading-hierarchy styling for Wise SEO wizard-generated pages.
 * Only applies inside .wise-seo-generated-content, so it never touches
 * the rest of the theme or hand-built pages.
 */
.wise-seo-generated-content h2 {
	font-size: 1.6em;
	line-height: 1.3;
	margin-top: 1.6em;
	margin-bottom: 0.6em;
}
.wise-seo-generated-content h3 {
	font-size: 1.2em;
	line-height: 1.35;
	margin-top: 1.2em;
	margin-bottom: 0.5em;
}
.wise-seo-generated-content p {
	line-height: 1.7;
	margin-bottom: 1em;
}

/*
 * CTA buttons — output of the [wise_seo_cta] shortcode. Not scoped to
 * .wise-seo-generated-content: CTA's are meant to be reusable on any
 * page. Colour is a CSS custom property so it can be overridden from
 * a child theme / customizer "additional CSS" without editing the
 * plugin, e.g.:
 *   :root { --wise-seo-cta-color: #123456; }
 */
:root {
	--wise-seo-cta-color: #1a56a0;
	--wise-seo-cta-color-hover: #123f78;
}
.wise-seo-cta-button {
	display: inline-block;
	padding: 0.7em 1.5em;
	margin: 0.25em 0.6em 0.25em 0;
	background: var( --wise-seo-cta-color );
	color: #fff;
	font-weight: 600;
	text-decoration: none;
	border-radius: 4px;
	line-height: 1.2;
	transition: background-color .15s ease, transform .1s ease;
}
.wise-seo-cta-button:hover,
.wise-seo-cta-button:focus {
	background: var( --wise-seo-cta-color-hover );
	color: #fff;
	text-decoration: none;
}
.wise-seo-cta-button:active {
	transform: translateY(1px);
}
/* Optional outline/secondary look: add this class alongside the default one
   via the shortcode's class="" attribute, e.g.
   [wise_seo_cta key="contact" class="wise-seo-cta-button wise-seo-cta-button--outline"] */
.wise-seo-cta-button--outline {
	background: transparent;
	color: var( --wise-seo-cta-color );
	border: 2px solid var( --wise-seo-cta-color );
	padding: calc(0.7em - 2px) calc(1.5em - 2px);
}
.wise-seo-cta-button--outline:hover,
.wise-seo-cta-button--outline:focus {
	background: var( --wise-seo-cta-color );
	color: #fff;
}
.wise-seo-cta-group {
	display: flex;
	flex-wrap: wrap;
	gap: 0.25em 0.4em;
	margin: 1em 0;
}

/* FAQ items — output of the [wise_seo_faq] shortcode. */
.wise-seo-faq-item {
	margin-bottom: 1.2em;
}
.wise-seo-faq-question {
	font-size: 1.15em;
	margin-bottom: 0.3em;
}

/* Breadcrumbs — output of the [wise_seo_breadcrumbs] shortcode. */
.wise-seo-breadcrumbs {
	font-size: 0.9em;
	color: #666;
	margin-bottom: 1em;
}
.wise-seo-breadcrumbs a {
	color: inherit;
	text-decoration: underline;
}
.wise-seo-breadcrumbs .wise-seo-breadcrumb-sep {
	margin: 0 0.4em;
	opacity: .5;
}
