/**
 * MIKA SERVICES — Section visibility + dark sidebar text + responsive fixes
 * Ensures left-column content (grid sidebar, why-us heading, process intro)
 * stays visible and matches the reference design on all screen sizes.
 *
 * @package MikaServicesWidgets
 * @since   1.0.19
 */

/* ── Grid sidebar: dark ink text (reference image 4) ── */
.svc-section .svc-sidebar__heading,
.elementor-widget-mika-services-grid .svc-sidebar__heading {
	color: #14141A !important;
	-webkit-text-fill-color: #14141A !important;
	opacity: 1 !important;
	visibility: visible !important;
}

.svc-section .svc-sidebar__eyebrow,
.elementor-widget-mika-services-grid .svc-sidebar__eyebrow {
	color: #2F4CFF !important;
	opacity: 1 !important;
	visibility: visible !important;
}

.svc-section .svc-sidebar,
.svc-section .svc-sidebar__cta,
.svc-section .svc-sidebar__underline,
.svc-section .svc-sidebar__dots {
	opacity: 1 !important;
	visibility: visible !important;
}

/* ── Why Us left heading ── */
.mika-why-band .mika-why-heading-wrap,
.mika-why-band .mika-why-title,
.mika-why-band .mika-why-eyebrow,
.mika-why-band .mika-why-pink-underline {
	opacity: 1 !important;
	visibility: visible !important;
}

.mika-why-band .mika-why-title {
	color: #ffffff !important;
}

/* ── Process left intro column ── */
.mika-process-exact-section .mika-proc-left,
.mika-process-exact-section .mika-proc-eyebrow,
.mika-process-exact-section .mika-proc-heading,
.mika-process-exact-section .mika-proc-scribble-wrap,
.mika-process-exact-section .mika-proc-cta {
	opacity: 1 !important;
	visibility: visible !important;
}

.mika-process-exact-section .mika-proc-heading {
	color: #111116 !important;
}

.mika-process-exact-section .mika-proc-eyebrow {
	color: #2563EB !important;
}

/* ── CTA band ── */
.mika-cta-section-wrap .mika-cta-home {
	opacity: 1 !important;
	visibility: visible !important;
}

/* ── Grid sidebar layout ── */
.svc-section .svc-sidebar {
	min-width: 0;
	max-width: 280px;
}

.svc-section .svc-sidebar__heading {
	font-weight: 800;
}

/* ── Responsive: Grid ── */
@media (max-width: 1024px) {
	.svc-section .svc-sidebar {
		max-width: none;
		width: 100%;
		text-align: left;
	}

	.svc-section .svc-sidebar__cta {
		display: inline-flex;
	}
}

@media (max-width: 640px) {
	.svc-section .svc-sidebar__heading {
		font-size: clamp(1.45rem, 6vw, 1.85rem);
	}

	.svc-section .svc-sidebar__cta {
		width: 100%;
		justify-content: center;
	}
}

/* ── Responsive: Why Us ── */
@media (max-width: 1100px) {
	.mika-why-content-wrap {
		grid-template-columns: 1fr !important;
		gap: 2rem !important;
	}

	.mika-why-heading-wrap {
		text-align: center;
	}

	.mika-why-pink-underline {
		margin-left: auto;
		margin-right: auto;
	}

	.mika-why-items-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	}
}

@media (max-width: 640px) {
	.mika-why-items-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}
}

/* ── Responsive: Process ── */
@media (max-width: 1024px) {
	.mika-proc-row {
		grid-template-columns: 1fr !important;
		gap: 2.5rem !important;
	}

	.mika-proc-left {
		text-align: center;
		max-width: 520px;
		margin-inline: auto;
	}

	.mika-proc-scribble-wrap {
		margin-inline: auto;
	}
}

@media (max-width: 768px) {
	.mika-proc-grid {
		grid-template-columns: 1fr !important;
		gap: 2rem !important;
	}

	.mika-proc-step-col {
		text-align: center;
	}
}

@media (max-width: 480px) {
	.mika-process-exact-section {
		padding-block: 3rem 4rem !important;
	}

	.mika-proc-heading {
		font-size: clamp(1.5rem, 7vw, 1.9rem) !important;
	}
}