/**
 * Wolliq Custom Additions — assets/css/custom.css
 *
 * Loaded after animations.css. Contains:
 *   - WhatsApp floating widget (.whatsapp-widget)
 *   - Service page benefit cards (.service-benefits)
 *   - Legal page layout (.legal-page)
 *   - Footer contact info list (.site-footer__contact-info)
 *   - Mobile spacing improvements
 *   - Contact page margin fixes
 *
 * @package Wolliq
 * @version 1.1.0
 */

/* ============================================================================
   NAV DROPDOWN — TEXT COLOR FIX
   The nav header uses section--dark (white text). The dropdown panel has a
   light/white background but inherits white text from the dark parent.
   These rules override with explicit dark colours so links are readable.
   ============================================================================ */

.site-nav__dropdown {
	color: var(--color-primary, #0f172a);
	background: #fff;
}

.site-nav__dropdown-pillar-title {
	color: var(--color-primary, #0f172a) !important;
	font-weight: 600;
	text-decoration: none;
	font-size: 0.8125rem;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	display: block;
	margin-bottom: 0.5rem;
	opacity: 1;
}

.site-nav__dropdown-pillar-title:hover {
	color: var(--color-accent, #06b6d4) !important;
}

.site-nav__dropdown-link {
	color: var(--color-text, #334155) !important;
	text-decoration: none;
	font-size: 0.9375rem;
}

.site-nav__dropdown-link:hover {
	color: var(--color-accent, #06b6d4) !important;
}

/* ── Featured CTA panel (right column inside dropdown) ─────────────────────
   This panel sits on the dark primary background; all text must be white.
   Headings & sub text were invisible when the dropdown inherited light text
   from the white dropdown background — these explicit rules fix that.
────────────────────────────────────────────────────────────────────────────── */
.site-nav__dropdown-featured {
	background: var(--color-primary, #0f172a);
	border-radius: var(--r-lg, 0.75rem);
	padding: 1.75rem;
	min-width: 220px;
	flex-shrink: 0;
	display: flex;
	flex-direction: column;
	gap: 0;
}

.site-nav__dropdown-featured .eyebrow,
.site-nav__dropdown-featured .eyebrow-badge {
	color: var(--color-accent, #06b6d4) !important;
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	margin-bottom: 0.75rem;
	display: block;
}

.site-nav__dropdown-featured-heading {
	color: #fff !important;
	font-size: 1.0625rem;
	font-weight: 700;
	line-height: 1.4;
	margin: 0 0 0.5rem;
}

.site-nav__dropdown-featured-sub {
	color: rgba(255, 255, 255, 0.72) !important;
	font-size: 0.875rem;
	line-height: 1.6;
	margin: 0 0 1.25rem;
}

/* Trust text below the Book a Free Call button in the dropdown */
.site-nav__dropdown-trust {
	color: rgba(255, 255, 255, 0.55) !important;
	font-size: 0.75rem;
	margin-top: 0.75rem;
	margin-bottom: 0;
}

/* "View all services" link at the bottom of the featured panel */
.site-nav__dropdown-all-link {
	color: rgba(255, 255, 255, 0.80) !important;
	font-size: 0.8125rem;
	text-decoration: none;
	display: flex;
	align-items: center;
	gap: 0.375rem;
	margin-top: 1rem;
	transition: color 0.15s ease;
}

.site-nav__dropdown-all-link:hover {
	color: #fff !important;
}

/* ============================================================================
   WHATSAPP FLOATING WIDGET
   Fixed bottom-right button. Only renders when number is set in Customizer.
   ============================================================================ */

.whatsapp-widget {
	position: fixed;
	bottom: 2rem;
	right: 2rem;
	z-index: var(--z-nav, 1000);
	display: inline-flex;
	align-items: center;
	gap: 0.625rem;
	padding: 0.75rem 1.25rem 0.75rem 0.875rem;
	background: #25d366;
	color: #fff;
	border-radius: 3rem;
	font-size: 0.9375rem;
	font-weight: 600;
	text-decoration: none;
	box-shadow: 0 4px 20px rgba(37, 211, 102, 0.4);
	transition: transform 0.2s ease, box-shadow 0.2s ease;
	line-height: 1;
}

.whatsapp-widget:hover,
.whatsapp-widget:focus-visible {
	transform: translateY(-3px) scale(1.02);
	box-shadow: 0 8px 28px rgba(37, 211, 102, 0.55);
	color: #fff;
	text-decoration: none;
}

.whatsapp-widget__icon {
	width: 2rem;
	height: 2rem;
	flex-shrink: 0;
}

.whatsapp-widget__label {
	white-space: nowrap;
}

@media (max-width: 600px) {
	.whatsapp-widget {
		bottom: 1.25rem;
		right: 1.25rem;
		padding: 0.875rem;
		border-radius: 50%;
	}
	.whatsapp-widget__label {
		display: none;
	}
}

/* ============================================================================
   SERVICE PAGE — BENEFIT CARDS
   Responsive 2-column grid. Used in S02b of single-wolliq_service.php.
   ============================================================================ */

.service-benefits {
	padding-block: var(--section-padding-y, 5rem);
}

.service-benefits__grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1.25rem;
	margin-top: 2.5rem;
}

.service-benefits__card {
	display: flex;
	align-items: flex-start;
	gap: 0.875rem;
	padding: 1.5rem;
	background: var(--color-white, #fff);
	border: 1.5px solid var(--color-border, #e2e8f0);
	border-radius: var(--r-lg, 0.75rem);
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.service-benefits__card:hover {
	border-color: var(--color-primary, #0f172a);
	box-shadow: 0 4px 16px rgba(15, 23, 42, 0.08);
}

.service-benefits__check {
	flex-shrink: 0;
	color: var(--color-accent, #06b6d4);
	margin-top: 0.1rem;
}

.service-benefits__text {
	font-size: 0.9375rem;
	line-height: 1.6;
	color: var(--color-text, #1e293b);
	font-weight: 500;
}

@media (max-width: 767px) {
	.service-benefits__grid {
		grid-template-columns: 1fr;
	}
}

/* ============================================================================
   LEGAL PAGES (Privacy Policy, Terms of Service)
   ============================================================================ */

.legal-page {
	padding-block: var(--section-padding-y, 5rem);
}

.legal-page__inner {
	max-width: 48rem;
}

.legal-page__header {
	margin-bottom: 3rem;
	padding-bottom: 2rem;
	border-bottom: 1px solid var(--color-border, #e2e8f0);
}

.legal-page__title {
	font-size: clamp(2rem, 4vw, 3rem);
	font-weight: 700;
	line-height: 1.2;
	color: var(--color-primary, #0f172a);
	margin-bottom: 0.5rem;
}

.legal-page__updated {
	color: var(--color-muted, #64748b);
	font-size: 0.875rem;
}

.legal-page__body {
	line-height: 1.8;
}

.legal-page__body h2 {
	font-size: 1.25rem;
	font-weight: 700;
	color: var(--color-primary, #0f172a);
	margin-top: 2.5rem;
	margin-bottom: 0.875rem;
}

.legal-page__body p {
	margin-bottom: 1rem;
}

.legal-page__body ul {
	margin: 0.875rem 0 1rem 1.25rem;
	padding-left: 0.5rem;
}

.legal-page__body ul li {
	margin-bottom: 0.5rem;
	line-height: 1.7;
}

.legal-page__body a {
	color: var(--color-accent, #06b6d4);
	text-decoration: underline;
}

/* ============================================================================
   FOOTER — CONTACT INFO LIST
   ============================================================================ */

.site-footer__contact-info {
	list-style: none;
	margin: 1rem 0 1.5rem;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.375rem;
}

.site-footer__contact-info li {
	font-size: 0.875rem;
	color: rgba(255, 255, 255, 0.7);
}

.site-footer__contact-info a {
	color: rgba(255, 255, 255, 0.85);
	text-decoration: none;
	transition: color 0.15s ease;
}

.site-footer__contact-info a:hover {
	color: #fff;
}

/* ============================================================================
   MOBILE — GENERAL SPACING IMPROVEMENTS
   ============================================================================ */

@media (max-width: 767px) {

	/* Reduce section padding on mobile so content isn't lost in scroll */
	.section {
		--section-padding-y: 3.5rem;
	}

	/* Service hero — fix padding and ensure heading fits */
	.service-hero__inner {
		padding-block: 3rem;
	}

	.service-hero__title {
		font-size: clamp(1.75rem, 6vw, 2.5rem);
	}

	.service-hero__trust {
		flex-direction: column;
		align-items: flex-start;
		gap: 0.5rem;
	}

	.service-hero__trust-divider {
		display: none;
	}

	/* Contact page — fix sidebar stacking */
	.contact-form__inner {
		flex-direction: column;
	}

	.contact-form__sidebar {
		border-radius: var(--r-lg, 0.75rem) var(--r-lg, 0.75rem) 0 0;
	}

	/* Ensure Why Wolliq cards stack properly */
	.why-wolliq__grid {
		grid-template-columns: 1fr;
	}

	/* How it works — ensure steps are readable */
	.how-it-works__step {
		flex-direction: column;
	}

	/* Proof bar labels wrap cleanly */
	.proof-bar__label {
		text-align: center;
		margin-bottom: 1rem;
	}

	/* Stats band — 2 columns on mobile */
	.stats-band__inner {
		grid-template-columns: repeat(2, 1fr);
		gap: 1.5rem;
	}

	/* Deliverables list on service pages */
	.service-deliverables__inner {
		flex-direction: column;
	}

	/* Case cards stack */
	.case-grid {
		grid-template-columns: 1fr;
	}

	/* Blog preview cards stack */
	.blog-preview__cards {
		grid-template-columns: 1fr;
	}

	/* CTA banner — stack actions */
	.cta-banner__actions {
		flex-direction: column;
		align-items: stretch;
	}

	.cta-banner__actions .btn {
		text-align: center;
	}

	/* Footer grid — single column */
	.site-footer__grid {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 480px) {

	/* Stats band — single column on very small screens */
	.stats-band__inner {
		grid-template-columns: 1fr;
	}

	/* WhatsApp widget — ensure it doesn't overlap content */
	.whatsapp-widget {
		bottom: 1rem;
		right: 1rem;
	}
}

/* ============================================================================
   INLINE CTA BOX — LAYOUT & FORMATTING FIX
   The inline-cta component sits between page sections. On mobile the heading
   and button were cramped. These rules give it proper layout at all sizes.
   ============================================================================ */

.inline-cta {
	padding-block: var(--section-padding-y, 4rem);
}

.inline-cta__box {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 2rem;
	padding: 2.5rem 3rem;
	border-radius: var(--r-xl, 1rem);
}

.inline-cta__box--light {
	background: var(--color-white, #fff);
	border: 1.5px solid var(--color-border, #e2e8f0);
	box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06);
}

.inline-cta__box--primary {
	background: var(--color-primary, #0f172a);
	border: 1.5px solid rgba(255, 255, 255, 0.12);
	color: #fff;
}

.inline-cta__content {
	flex: 1;
	min-width: 0;
}

.inline-cta__heading {
	font-size: clamp(1.125rem, 2vw, 1.375rem);
	font-weight: 700;
	line-height: 1.3;
	margin: 0 0 0.5rem;
}

.inline-cta__box--light .inline-cta__heading {
	color: var(--color-primary, #0f172a);
}

.inline-cta__box--primary .inline-cta__heading {
	color: #fff;
}

.inline-cta__text {
	font-size: 0.9375rem;
	line-height: 1.6;
	margin: 0;
}

.inline-cta__box--light .inline-cta__text {
	color: var(--color-text, #334155);
}

.inline-cta__box--primary .inline-cta__text {
	color: rgba(255, 255, 255, 0.78);
}

.inline-cta__eyebrow {
	margin-bottom: 0.625rem;
}

.inline-cta__action {
	flex-shrink: 0;
}

.inline-cta__action .btn {
	white-space: nowrap;
}

@media (max-width: 767px) {
	.inline-cta__box {
		flex-direction: column;
		align-items: flex-start;
		padding: 2rem 1.5rem;
		gap: 1.5rem;
	}

	.inline-cta__action {
		width: 100%;
	}

	.inline-cta__action .btn {
		width: 100%;
		text-align: center;
		justify-content: center;
	}
}

/* ============================================================================
   DEFAULT PAGE TEMPLATE (page.php)
   Provides clean styling for any page using the bare fallback template.
   ============================================================================ */

.page-body__inner {
	max-width: 52rem;
	padding-block: 3rem 5rem;
}

.page-body__inner p {
	font-size: 1.0625rem;
	line-height: 1.8;
	color: var(--color-text, #334155);
	margin-bottom: 1.25rem;
}

.page-body__inner h2 {
	font-size: 1.5rem;
	font-weight: 700;
	color: var(--color-primary, #0f172a);
	margin: 2.5rem 0 0.875rem;
}

.page-body__inner h3 {
	font-size: 1.125rem;
	font-weight: 700;
	color: var(--color-primary, #0f172a);
	margin: 2rem 0 0.75rem;
}

.page-body__inner ul,
.page-body__inner ol {
	margin: 0.875rem 0 1.25rem 1.5rem;
	line-height: 1.75;
}

.page-body__inner ul li,
.page-body__inner ol li {
	margin-bottom: 0.5rem;
	font-size: 1.0625rem;
	color: var(--color-text, #334155);
}

/* ============================================================================
   ABOUT PAGE
   ============================================================================ */

/* Hero */
.about-hero__inner {
	padding-block: 5rem;
}

.about-hero__title {
	margin: 1rem 0 1.25rem;
}

.about-hero__sub {
	max-width: 52rem;
	margin-bottom: 2rem;
}

.about-hero__trust {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.75rem;
	font-size: 0.875rem;
	color: rgba(255, 255, 255, 0.8);
}

/* Story section */
.about-story__inner {
	display: grid;
	grid-template-columns: 1fr 1.6fr;
	gap: 4rem;
	align-items: start;
}

@media (max-width: 1023px) {
	.about-story__inner {
		grid-template-columns: 1fr;
		gap: 2.5rem;
	}
}

.about-story__quote {
	background: var(--color-light, #f8fafc);
	border-left: 4px solid var(--color-accent, #06b6d4);
	border-radius: var(--r-lg, 0.75rem);
	padding: 2rem 1.75rem;
	margin: 0;
	position: sticky;
	top: 6rem;
}

.about-story__quote p {
	font-size: 1.125rem;
	line-height: 1.7;
	font-style: italic;
	color: var(--color-primary, #0f172a);
	margin: 0 0 1rem;
}

.about-story__quote-attr {
	font-size: 0.875rem;
	font-weight: 600;
	color: var(--color-accent, #06b6d4);
}

.about-story__body {
	margin-top: 1.5rem;
}

.about-story__body p {
	font-size: 1.0625rem;
	line-height: 1.8;
	color: var(--color-text, #334155);
	margin-bottom: 1.25rem;
}

/* Mission + Vision */
.about-mission__grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1.5rem;
	margin-top: 3rem;
}

@media (max-width: 767px) {
	.about-mission__grid {
		grid-template-columns: 1fr;
	}
}

.about-mission__card {
	background: rgba(255, 255, 255, 0.06);
	border: 1px solid rgba(255, 255, 255, 0.12);
	border-radius: var(--r-xl, 1rem);
	padding: 2.5rem 2rem;
}

.about-mission__card-icon {
	width: 3rem;
	height: 3rem;
	background: rgba(6, 182, 212, 0.15);
	border-radius: var(--r-lg, 0.75rem);
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--color-accent, #06b6d4);
	margin-bottom: 1.25rem;
}

.about-mission__card-title {
	font-size: 1.125rem;
	font-weight: 700;
	color: #fff;
	margin: 0 0 0.75rem;
}

.about-mission__card-text {
	font-size: 0.9375rem;
	line-height: 1.75;
	color: rgba(255, 255, 255, 0.72);
	margin: 0;
}

/* Values */
.about-values__grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1.5rem;
	margin-top: 3rem;
}

@media (max-width: 767px) {
	.about-values__grid {
		grid-template-columns: 1fr;
	}
}

.about-values__card {
	background: var(--color-white, #fff);
	border: 1.5px solid var(--color-border, #e2e8f0);
	border-radius: var(--r-xl, 1rem);
	padding: 2rem;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.about-values__card:hover {
	border-color: var(--color-accent, #06b6d4);
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
}

.about-values__card-icon {
	width: 2.5rem;
	height: 2.5rem;
	background: rgba(6, 182, 212, 0.1);
	border-radius: var(--r-md, 0.5rem);
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--color-accent, #06b6d4);
	margin-bottom: 1rem;
	flex-shrink: 0;
}

.about-values__card-title {
	font-size: 1.0625rem;
	font-weight: 700;
	color: var(--color-primary, #0f172a);
	margin: 0 0 0.625rem;
}

.about-values__card-text {
	font-size: 0.9375rem;
	line-height: 1.7;
	color: var(--color-text, #334155);
	margin: 0;
}

/* How We're Different */
.about-diff__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 2rem;
	margin-top: 3rem;
}

@media (max-width: 1023px) {
	.about-diff__grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 640px) {
	.about-diff__grid {
		grid-template-columns: 1fr;
	}
}

.about-diff__item {
	position: relative;
	padding-top: 1.25rem;
	border-top: 3px solid var(--color-accent, #06b6d4);
}

.about-diff__number {
	font-size: 2.5rem;
	font-weight: 800;
	color: var(--color-border, #e2e8f0);
	line-height: 1;
	margin-bottom: 0.75rem;
	font-variant-numeric: tabular-nums;
}

.about-diff__title {
	font-size: 1.0625rem;
	font-weight: 700;
	color: var(--color-primary, #0f172a);
	margin: 0 0 0.75rem;
}

.about-diff__text {
	font-size: 0.9375rem;
	line-height: 1.75;
	color: var(--color-text, #334155);
	margin: 0;
}

/* Custom content area */
.about-custom-content__inner {
	max-width: 52rem;
}

/* ============================================================================
   SERVICE SINGLE PAGES — SIDE MARGIN / PADDING FIX
   On mobile and narrow viewports the text was touching the viewport edge
   because .container padding was insufficient for some section variants.
   These rules guarantee safe horizontal padding on all service page sections.
   ============================================================================ */

.service-hero__inner,
.service-deliverables .container,
.service-benefits .container,
.service-cases .container,
.service-testimonial .container,
.service-cta .container {
	padding-inline: max(1.25rem, env(safe-area-inset-left, 1.25rem));
}

@media (max-width: 767px) {
	/* Ensure every .container on service pages has side breathing room */
	.is-service-page .container,
	[class*="service-"] .container {
		padding-inline: 1.25rem;
	}

	/* Override tight padding on the service hero specifically */
	.service-hero__inner {
		padding-inline: 1.25rem;
		padding-block: 3rem;
	}
}

/* ============================================================================
   INDUSTRIES PAGE — ARCHIVE & SINGLE PAGE IMPROVEMENTS
   ============================================================================ */

/* Industry grid on archive page */
.industry-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.5rem;
	margin-top: 3rem;
}

@media (max-width: 1023px) {
	.industry-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

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

.industry-card {
	background: var(--color-white, #fff);
	border: 1.5px solid var(--color-border, #e2e8f0);
	border-radius: var(--r-lg, 0.75rem);
	overflow: hidden;
	transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
	display: flex;
	flex-direction: column;
}

.industry-card:hover {
	border-color: var(--color-accent, #06b6d4);
	box-shadow: 0 8px 32px rgba(0, 0, 0, 0.08);
	transform: translateY(-3px);
}

.industry-card__thumbnail {
	height: 180px;
	overflow: hidden;
	background: var(--color-light, #f8fafc);
}

.industry-card__image {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.industry-card__body {
	padding: 1.5rem;
	display: flex;
	flex-direction: column;
	flex: 1;
}

.industry-card__title {
	font-size: 1.0625rem;
	font-weight: 700;
	color: var(--color-primary, #0f172a);
	margin: 0 0 0.625rem;
	line-height: 1.35;
}

.industry-card__desc {
	font-size: 0.9rem;
	color: var(--color-text, #334155);
	line-height: 1.65;
	margin: 0 0 1.25rem;
	flex: 1;
}

.industry-card__link {
	display: inline-flex;
	align-items: center;
	gap: 0.375rem;
	font-size: 0.9rem;
	font-weight: 600;
	color: var(--color-accent, #06b6d4);
	text-decoration: none;
	transition: gap 0.15s ease, color 0.15s ease;
	margin-top: auto;
}

.industry-card__link:hover {
	gap: 0.625rem;
	color: var(--color-primary, #0f172a);
}

/* Industry icon badge on individual industry pages */
.industry-icon-badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 3.5rem;
	height: 3.5rem;
	background: rgba(6, 182, 212, 0.1);
	border-radius: var(--r-lg, 0.75rem);
	margin-bottom: 1.5rem;
	color: var(--color-accent, #06b6d4);
}

/* Industry challenges grid */
.industry-challenges__grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1rem;
	margin-top: 2rem;
}

@media (max-width: 640px) {
	.industry-challenges__grid {
		grid-template-columns: 1fr;
	}
}

.industry-challenges__item {
	display: flex;
	align-items: flex-start;
	gap: 0.75rem;
	padding: 1.125rem;
	background: var(--color-light, #f8fafc);
	border-radius: var(--r-md, 0.5rem);
	border-left: 3px solid var(--color-accent, #06b6d4);
}

.industry-challenges__icon {
	flex-shrink: 0;
	color: var(--color-accent, #06b6d4);
	margin-top: 0.1rem;
}

.industry-challenges__text {
	font-size: 0.9375rem;
	font-weight: 500;
	color: var(--color-primary, #0f172a);
	line-height: 1.5;
}

/* Industry stats strip */
.industry-stats {
	display: flex;
	flex-wrap: wrap;
	gap: 2rem;
	padding: 2rem;
	background: var(--color-primary, #0f172a);
	border-radius: var(--r-xl, 1rem);
	margin-top: 3rem;
}

.industry-stats__item {
	flex: 1;
	min-width: 140px;
	text-align: center;
}

.industry-stats__number {
	font-size: 2rem;
	font-weight: 800;
	color: var(--color-accent, #06b6d4);
	display: block;
	line-height: 1;
	margin-bottom: 0.375rem;
}

.industry-stats__label {
	font-size: 0.875rem;
	color: rgba(255, 255, 255, 0.72);
}

/* Industry archive intro two-column */
.industry-intro__inner {
	display: grid;
	grid-template-columns: 1.4fr 1fr;
	gap: 4rem;
	align-items: center;
}

@media (max-width: 1023px) {
	.industry-intro__inner {
		grid-template-columns: 1fr;
		gap: 2.5rem;
	}
}

.industry-intro__proof {
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
}

.industry-intro__proof-item {
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
	padding: 1.5rem;
	background: var(--color-light, #f8fafc);
	border-radius: var(--r-lg, 0.75rem);
	border-left: 4px solid var(--color-accent, #06b6d4);
}

.industry-intro__proof-number {
	font-size: 2.25rem;
	font-weight: 800;
	color: var(--color-accent, #06b6d4);
	line-height: 1;
}

.industry-intro__proof-label {
	font-size: 0.9rem;
	color: var(--color-text, #334155);
	font-weight: 500;
}

/* Industry pitch two-column section */
.industry-pitch__inner {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 4rem;
	align-items: start;
}

@media (max-width: 1023px) {
	.industry-pitch__inner {
		grid-template-columns: 1fr;
		gap: 2.5rem;
	}
}

.industry-pitch__actions {
	display: flex;
	gap: 1rem;
	flex-wrap: wrap;
	margin-top: 2rem;
}

.industry-pitch__checklist {
	background: var(--color-white, #fff);
	border: 1.5px solid var(--color-border, #e2e8f0);
	border-radius: var(--r-xl, 1rem);
	padding: 2rem;
}

.industry-pitch__checklist-title {
	font-size: 0.875rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	color: var(--color-muted, #64748b);
	margin-bottom: 1.25rem;
}

.industry-pitch__checklist-item {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	padding: 0.625rem 0;
	border-bottom: 1px solid var(--color-border, #e2e8f0);
	font-size: 0.9375rem;
	color: var(--color-primary, #0f172a);
	font-weight: 500;
}

.industry-pitch__checklist-item:last-child {
	border-bottom: none;
}

.industry-pitch__checklist-item svg {
	flex-shrink: 0;
	color: var(--color-accent, #06b6d4);
}

/* ============================================================================
   CONTACT PAGE — MARGIN FIX
   Addresses extra margin above/below contact form section on the contact page.
   ============================================================================ */

.is-contact-page .contact-form {
	padding-top: 0;
}

.is-contact-page main > .contact-form:first-child {
	padding-top: 3rem;
}

/* ============================================================================
   SERVICE PAGE — GENERAL FIXES
   ============================================================================ */

.is-service-page .service-deliverables {
	padding-block: var(--section-padding-y, 5rem);
}

/* Ensure the deliverables list is visually generous */
.service-deliverables__list {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 0.75rem;
	list-style: none;
	margin: 0;
	padding: 0;
}

.service-deliverables__item {
	display: flex;
	align-items: flex-start;
	gap: 0.75rem;
	padding: 1rem;
	background: var(--color-light, #f8fafc);
	border-radius: var(--r-md, 0.5rem);
}

.service-deliverables__check {
	flex-shrink: 0;
	color: var(--color-accent, #06b6d4);
}

@media (max-width: 640px) {
	.service-deliverables__list {
		grid-template-columns: 1fr;
	}
}
