/*
 * WDZ Toolkit — AI-Generated Page Styles (Phase 5).
 *
 * Baseline styling for content output by the AI Home Page Generator and
 * AI Service Category Generator. Self-contained, prefixed with `.wdz-`,
 * and enqueued only on pages that carry `_wdz_ai_generated = '1'` meta
 * — so this never touches the rest of the site.
 *
 * Intent: make a fresh draft look presentable in the browser BEFORE the
 * admin routes the content into Elementor. When Elementor takes over,
 * these styles still apply unless Elementor's own widget styles win on
 * specificity — that's fine; the design system makes the call.
 */

/* ============================================================
   HOME PAGE — hero / trust bar / service area
   ============================================================ */

.wdz-home-hero {
	text-align: center;
	padding: 64px 20px 56px;
	background: linear-gradient(180deg, #faf8ff 0%, #f3eeff 100%);
	border-radius: 8px;
	margin: 0 0 28px;
}

.wdz-home-hero h1 {
	font-size: 42px;
	line-height: 1.15;
	font-weight: 800;
	color: #1a1147;
	margin: 0 0 16px;
	max-width: 820px;
	margin-left: auto;
	margin-right: auto;
}

.wdz-home-hero-sub {
	font-size: 18px;
	line-height: 1.55;
	color: #4a4366;
	margin: 0 auto 28px;
	max-width: 680px;
}

.wdz-home-cta {
	display: inline-block;
	padding: 14px 32px;
	background: #7604e9;
	color: #ffffff;
	font-size: 16px;
	font-weight: 700;
	letter-spacing: 0.02em;
	border-radius: 6px;
	text-decoration: none;
	box-shadow: 0 4px 14px rgba(118, 4, 233, 0.25);
	transition: transform 0.12s ease, box-shadow 0.12s ease;
}

.wdz-home-cta:hover,
.wdz-home-cta:focus {
	transform: translateY(-1px);
	box-shadow: 0 6px 18px rgba(118, 4, 233, 0.35);
	color: #ffffff;
	text-decoration: none;
}

.wdz-home-trust {
	text-align: center;
	padding: 22px 20px;
	background: #1a1147;
	color: #ffffff;
	border-radius: 6px;
	margin: 0 0 28px;
}

.wdz-home-trust p {
	margin: 0;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0.04em;
	color: #ffffff;
}

.wdz-home-service-area {
	padding: 24px 28px;
	background: #ffffff;
	border: 1px solid #e6e0f5;
	border-radius: 6px;
	margin: 0 0 28px;
}

.wdz-home-service-area p {
	margin: 0;
	font-size: 16px;
	line-height: 1.6;
	color: #2d2649;
}

/* ============================================================
   SERVICE CATEGORY + CITY PAGES — shared entry-content polish
   ============================================================ */

.wdz-entry-content {
	max-width: 820px;
	margin: 0 auto;
	padding: 0 16px;
	font-size: 16px;
	line-height: 1.65;
	color: #2d2649;
}

.wdz-entry-content h2 {
	font-size: 26px;
	line-height: 1.2;
	font-weight: 800;
	color: #1a1147;
	margin: 32px 0 14px;
}

.wdz-entry-content p {
	margin: 0 0 14px;
}

.wdz-entry-content ul {
	margin: 0 0 18px;
	padding-left: 24px;
}

.wdz-entry-content ul li {
	margin: 0 0 8px;
}

/* ============================================================
   CITY PILLS — the "Cities We Serve" strip on service pages
   ============================================================ */

.wdz-cities-served {
	margin: 32px 0;
}

.wdz-cities-served h2 {
	font-size: 22px;
	margin-bottom: 14px;
}

.wdz-city-pills {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.wdz-city-pill {
	display: inline-block;
	padding: 7px 14px;
	background: #f3eeff;
	color: #5a02b8;
	border: 1px solid #d9c9f5;
	border-radius: 999px;
	font-size: 13px;
	font-weight: 600;
	text-decoration: none;
	transition: background 0.12s ease;
}

.wdz-city-pill:hover,
.wdz-city-pill:focus {
	background: #7604e9;
	color: #ffffff;
	text-decoration: none;
	border-color: #7604e9;
}

/* ============================================================
   FAQ block — service pages + city pages
   ============================================================ */

.wdz-entry-faq {
	max-width: 820px;
	margin: 36px auto 0;
	padding: 28px 32px;
	background: #ffffff;
	border: 1px solid #e6e0f5;
	border-radius: 8px;
}

.wdz-entry-faq h2 {
	font-size: 24px;
	font-weight: 800;
	color: #1a1147;
	margin: 0 0 18px;
	padding: 0 0 12px;
	border-bottom: 2px solid #f3eeff;
}

.wdz-entry-faq h3 {
	font-size: 17px;
	font-weight: 700;
	color: #1a1147;
	margin: 22px 0 8px;
}

.wdz-entry-faq h3:first-of-type {
	margin-top: 6px;
}

.wdz-entry-faq p {
	margin: 0 0 10px;
	color: #2d2649;
	line-height: 1.6;
}

/* ============================================================
   Small screens
   ============================================================ */

@media (max-width: 640px) {
	.wdz-home-hero {
		padding: 44px 16px 40px;
	}
	.wdz-home-hero h1 {
		font-size: 30px;
	}
	.wdz-home-hero-sub {
		font-size: 16px;
	}
	.wdz-entry-faq {
		padding: 22px 18px;
	}
}