/**
 * Premium Website Forge — page composition pass (section wrappers only).
 * Zone backgrounds, vertical rhythm, zone dividers, heading + accent normalisation.
 * Does not modify frozen component internals.
 */

:root {
	--sa-comp-tone-base: #12151a;
	--sa-comp-tone-deep: #0f1117;
	--sa-comp-tone-footer: #0a0c10;
	--sa-comp-accent: #3b82f6;
	--sa-comp-heading-size: 30px;
	--sa-comp-zone-rule: rgba(255, 255, 255, 0.06);
}

/* ------------------------------------------------------------------ */
/* 1. Zone background tones                                           */
/* ------------------------------------------------------------------ */

/* Services — base band (hero #0d0f14 is frozen, untouched). */
section.sa-premium-services-experience-header,
section.sa-premium-services-header,
section.sa-premium-services-image-grid,
section.sa-premium-services-grid,
section.sa-premium-services-collection {
	background-color: var(--sa-comp-tone-base) !important;
}

/* Trust — slightly darker band. */
section.sa-premium-trust-experience-header,
section.sa-premium-proof-header,
section.sa-premium-proof-cards,
section.sa-premium-trust-cards-grid,
section.sa-premium-trust-collection,
section.sa-premium-badges-grid.sa-premium-trust-component-v1 {
	background-color: var(--sa-comp-tone-deep) !important;
}

/* Process — back to base. */
section.sa-premium-process-experience-header,
section.sa-premium-process-header,
section.sa-premium-process-steps,
section.sa-premium-process-steps-grid {
	background-color: var(--sa-comp-tone-base) !important;
}

/* Reviews — darker band. */
section.sa-premium-review-summary-header,
section.sa-premium-review-summary-cards,
section.sa-premium-review-summary-cta,
section.sa-premium-review-summary,
section.sa-premium-reviews-header-block,
section.sa-premium-review-cards-grid,
section.sa-premium-reviews-cta-block {
	background-color: var(--sa-comp-tone-deep) !important;
}

/* CTA — base band. */
section.sa-premium-cta-split,
section.sa-premium-cta-banner,
section.sa-premium-cta-dual,
section.sa-premium-cta-dark {
	background-color: var(--sa-comp-tone-base) !important;
}

/* Interior page hero — compact, text-only (frozen scale separate from homepage). */
section.sa-premium-page-hero-small {
	background-color: #0d0f14 !important;
}

section.sa-premium-page-hero-small .elementor-heading-title {
	text-align: center !important;
	font-size: clamp(28px, 3.2vw, 36px) !important;
	font-weight: 700 !important;
	color: #ffffff !important;
	line-height: 1.15 !important;
	letter-spacing: -0.02em !important;
}

section.sa-premium-page-hero-small .elementor-widget-text-editor,
section.sa-premium-page-hero-small .elementor-widget-text-editor p {
	text-align: center !important;
	max-width: 640px;
	margin-left: auto !important;
	margin-right: auto !important;
	color: rgba(255, 255, 255, 0.78) !important;
	font-size: 17px !important;
	line-height: 1.55 !important;
}

section.sa-premium-page-hero-small .elementor-button-wrapper {
	text-align: center !important;
}

/* About story + team bands */
section.sa-premium-about-story,
section.sa-premium-about-team-header {
	background-color: var(--sa-comp-tone-base) !important;
}

section.sa-premium-about-team-cards,
section.sa-premium-about-team-cards.sa-premium-trust-component-v1 {
	background-color: var(--sa-comp-tone-deep) !important;
}

section.sa-premium-about-story .elementor-heading-title,
section.sa-premium-about-team-header .elementor-heading-title {
	font-size: var(--sa-comp-heading-size) !important;
	font-weight: 700 !important;
	color: #ffffff !important;
	text-align: center !important;
}

/* Footer / contact — deepest band. */
section.sa-premium-contact-split,
section.sa-premium-contact-header,
section.sa-premium-contact-cards,
section.sa-premium-contact-form {
	background-color: var(--sa-comp-tone-footer) !important;
}

/* ------------------------------------------------------------------ */
/* 2. Zone transition dividers (one per major band, not every section) */
/* ------------------------------------------------------------------ */

section.sa-premium-services-experience-header,
section.sa-premium-services-header,
section.sa-premium-trust-experience-header,
section.sa-premium-proof-header,
section.sa-premium-process-experience-header,
section.sa-premium-process-header,
section.sa-premium-review-summary-header,
section.sa-premium-cta-split,
section.sa-premium-cta-banner,
section.sa-premium-cta-dual,
section.sa-premium-cta-dark,
section.sa-premium-contact-split {
	box-shadow: inset 0 1px 0 var(--sa-comp-zone-rule);
}

/* ------------------------------------------------------------------ */
/* 3. Section vertical rhythm (wrapper padding only)                  */
/* ------------------------------------------------------------------ */

/* Trust — sit closer to Services (proof continuation). */
section.sa-premium-trust-experience-header.elementor-section,
section.sa-premium-proof-header.elementor-section {
	padding-top: 52px !important;
}

/* Process — journey moment, more air above and below the zone. */
section.sa-premium-process-experience-header.elementor-section,
section.sa-premium-process-header.elementor-section {
	padding-top: 96px !important;
}

section.sa-premium-process-steps-grid.elementor-section,
section.sa-premium-process-steps.elementor-section {
	padding-bottom: 96px !important;
}

@media (max-width: 1024px) {
	section.sa-premium-trust-experience-header.elementor-section,
	section.sa-premium-proof-header.elementor-section {
		padding-top: 44px !important;
	}

	section.sa-premium-process-experience-header.elementor-section,
	section.sa-premium-process-header.elementor-section {
		padding-top: 72px !important;
	}

	section.sa-premium-process-steps-grid.elementor-section,
	section.sa-premium-process-steps.elementor-section {
		padding-bottom: 72px !important;
	}
}

@media (max-width: 767px) {
	section.sa-premium-trust-experience-header.elementor-section,
	section.sa-premium-proof-header.elementor-section {
		padding-top: 36px !important;
	}

	section.sa-premium-process-experience-header.elementor-section,
	section.sa-premium-process-header.elementor-section {
		padding-top: 56px !important;
	}

	section.sa-premium-process-steps-grid.elementor-section,
	section.sa-premium-process-steps.elementor-section {
		padding-bottom: 56px !important;
	}
}

/* ------------------------------------------------------------------ */
/* 4. Section heading consistency                                     */
/* ------------------------------------------------------------------ */

section.sa-premium-services-experience-header .elementor-heading-title,
section.sa-premium-services-header .elementor-heading-title,
section.sa-premium-trust-experience-header .elementor-heading-title,
section.sa-premium-proof-header .elementor-heading-title,
section.sa-premium-process-experience-header .elementor-heading-title,
section.sa-premium-process-header .elementor-heading-title,
section.sa-premium-review-summary-header .elementor-heading-title {
	font-size: var(--sa-comp-heading-size) !important;
	font-weight: 700 !important;
	color: #ffffff !important;
	line-height: 1.12 !important;
	letter-spacing: -0.025em !important;
}

/* ------------------------------------------------------------------ */
/* 5. Blue accent underline — consistent 40px bar on all zone headers */
/* ------------------------------------------------------------------ */

section.sa-premium-services-experience-header .elementor-widget-text-editor div[aria-hidden="true"],
section.sa-premium-trust-experience-header .elementor-widget-text-editor div[aria-hidden="true"],
section.sa-premium-proof-header .elementor-widget-text-editor div[aria-hidden="true"],
section.sa-premium-process-experience-header .elementor-widget-text-editor div[aria-hidden="true"],
section.sa-premium-process-header .elementor-widget-text-editor div[aria-hidden="true"] {
	width: 40px !important;
	height: 3px !important;
	background-color: var(--sa-comp-accent) !important;
	border-radius: 2px !important;
	margin-top: 12px !important;
	margin-bottom: 24px !important;
	margin-left: auto !important;
	margin-right: auto !important;
}

/* Reviews GBP header — match accent treatment (no H2 on v1 layout). */
section.sa-premium-review-summary-header .sa-premium-reviews-header {
	position: relative;
	padding-bottom: 0;
}

section.sa-premium-review-summary-header .sa-premium-reviews-header::after {
	content: "";
	display: block;
	width: 40px;
	height: 3px;
	border-radius: 2px;
	background-color: var(--sa-comp-accent);
	margin: 20px auto 0;
}