/**
 * Services page — archive & single PHP template utilities.
 * Mirrors blog-page.css with service-specific adjustments.
 */

@media (min-width: 768px) {
	.md\:flex-row-reverse {
		flex-direction: row-reverse;
	}

	.md\:grid-cols-2 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.md\:w-2\/5 {
		width: 40%;
	}

	.md\:w-3\/5 {
		width: 60%;
	}

	.md\:text-headline-sm {
		font-size: 1.375rem;
		line-height: 1.35;
	}
}

@media (min-width: 1024px) {
	.lg\:grid-cols-12 {
		grid-template-columns: repeat(12, minmax(0, 1fr));
	}

	.lg\:grid-cols-3 {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.lg\:col-span-8 {
		grid-column: span 8 / span 8;
	}

	.lg\:col-span-4 {
		grid-column: span 4 / span 4;
	}
}

.persian-title {
	font-family: var(--font-display);
}

.bg-surface-container-lowest {
	background-color: var(--color-surface-container-lowest);
}

.bg-surface-container-low {
	background-color: var(--color-surface-container-low);
}

.bg-surface-container {
	background-color: var(--color-surface-container);
}

.bg-surface-container-high {
	background-color: var(--color-surface-container-high);
}

.bg-primary-container {
	background-color: var(--color-primary-container);
}

.bg-secondary-container {
	background-color: var(--color-secondary-container);
}

.bg-tertiary-container {
	background-color: var(--color-tertiary-container);
}

.text-on-surface {
	color: var(--color-on-surface);
}

.text-on-surface-variant {
	color: var(--color-on-surface-variant);
}

.text-on-background {
	color: var(--color-on-background);
}

.text-on-surface {
	color: var(--color-on-surface);
}

.text-on-primary {
	color: var(--color-on-primary);
}

.text-on-primary-container {
	color: var(--color-on-primary-container);
}

.text-on-secondary-container {
	color: var(--color-on-secondary-container);
}

.text-on-tertiary-container {
	color: var(--color-on-tertiary-container);
}

.text-secondary {
	color: var(--color-secondary);
}

.text-tertiary {
	color: var(--color-tertiary);
}

.text-primary {
	color: var(--color-primary);
}

.text-outline {
	color: var(--color-outline);
}

.text-outline-variant {
	color: var(--color-outline-variant);
}

.bg-primary {
	background-color: var(--color-primary);
}

.bg-primary\/90 {
	background-color: color-mix(in srgb, var(--color-primary) 90%, transparent);
}

.bg-primary\/10 {
	background-color: color-mix(in srgb, var(--color-primary) 10%, transparent);
}

.bg-secondary {
	background-color: var(--color-secondary);
}

.bg-secondary-container\/80 {
	background-color: color-mix(in srgb, var(--color-secondary-container) 80%, transparent);
}

.border-outline-variant\/10 {
	border-color: color-mix(in srgb, var(--color-outline-variant) 10%, transparent);
}

.border-outline-variant\/20 {
	border-color: color-mix(in srgb, var(--color-outline-variant) 20%, transparent);
}

.border-outline-variant\/30 {
	border-color: color-mix(in srgb, var(--color-outline-variant) 30%, transparent);
}

.border-b-2 {
	border-bottom-width: 2px;
	border-bottom-style: solid;
}

.border-primary {
	border-color: var(--color-primary);
}

.text-\[11px\] {
	font-size: 11px;
}

.text-\[18px\] {
	font-size: 18px;
}

.text-headline-sm-mobile {
	font-size: 1.125rem;
	line-height: 1.35;
}

.text-display-lg-mobile {
	font-size: 2rem;
	line-height: 1.2;
}

.text-body-sm {
	font-size: 0.875rem;
	line-height: 1.5;
}

.text-body-md {
	font-size: 1rem;
	line-height: 1.6;
}

.text-body-lg {
	font-size: 1.125rem;
	line-height: 1.6;
}

.text-display-lg {
	font-size: 2.75rem;
	line-height: 1.2;
}

.text-headline-sm {
	font-size: 1.375rem;
	line-height: 1.35;
}

.text-headline-md {
	font-size: 1.75rem;
	line-height: 1.3;
}

.text-title-lg {
	font-size: 1.2rem;
	line-height: 1.45;
}

.text-label-md {
	font-size: 0.875rem;
	line-height: 1.4;
}

.text-caption {
	font-size: 0.75rem;
	line-height: 1.4;
}

.font-body-sm {
	font-family: var(--font-body);
}

.font-body-md {
	font-family: var(--font-body);
}

.font-body-lg {
	font-family: var(--font-body);
}

.font-display-lg {
	font-family: var(--font-display);
}

.font-headline-sm {
	font-family: var(--font-display);
}

.font-headline-md {
	font-family: var(--font-display);
}

.font-title-lg {
	font-family: var(--font-body);
}

.font-label-md {
	font-family: var(--font-label);
}

.hover\:shadow-md:hover {
	box-shadow: var(--elevation-hover);
}

.hover\:text-primary:hover {
	color: var(--color-primary);
}

.hover\:text-tertiary:hover {
	color: var(--color-tertiary);
}

.hover\:bg-primary\/90:hover {
	background-color: var(--color-primary);
}

.hover\:bg-primary-container\/80:hover {
	background-color: color-mix(in srgb, var(--color-primary-container) 80%, transparent);
}

.hover\:bg-secondary-container\/80:hover {
	background-color: color-mix(in srgb, var(--color-secondary-container) 80%, transparent);
}

.hover\:border-primary:hover {
	border-color: var(--color-primary);
}

.hover\:scale-110:hover {
	transform: scale(1.1);
}

.group:hover .group-hover\:scale-110 {
	transform: scale(1.1);
}

.group:hover .group-hover\:text-primary {
	color: var(--color-primary);
}

.duration-500 {
	transition-duration: 500ms;
}

.opacity-0 {
	opacity: 0;
}

.w-14 {
	width: 3.5rem;
}

.h-14 {
	height: 3.5rem;
}

.bottom-8 {
	bottom: var(--space-xl);
}

.right-8 {
	right: var(--space-xl);
}

.fixed {
	position: fixed;
}

.z-40 {
	z-index: 40;
}

.w-fit {
	width: fit-content;
}

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

.line-clamp-2 {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.truncate {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.space-y-2 > * + * {
	margin-top: var(--space-sm);
}

.space-y-3 > * + * {
	margin-top: var(--space-md);
}

.space-y-6 > * + * {
	margin-top: var(--space-lg);
}

.text-8xl {
	font-size: 6rem;
	line-height: 1;
}

.min-w-0 {
	min-width: 0;
}

/* Prevent wide content from overflowing the 12-col grid */
.obc-services-layout > * {
	min-width: 0;
}

/* Services card hover */
.obc-services-card {
	transition: border-color var(--transition-normal), box-shadow var(--transition-normal);
}

.obc-services-card:hover {
	border-color: var(--color-primary);
}

/* Featured service card — matched to .obc-blog-featured */
.obc-services-featured__media {
	aspect-ratio: 16 / 9;
	min-height: 16rem;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: var(--color-surface-container-low);
}

.obc-services-featured__media img {
	width: 100%;
	height: 100%;
	display: block;
	object-fit: cover;
}

@media (min-width: 768px) {
	.obc-services-featured {
		min-height: 0;
	}

	.obc-services-featured__media {
		aspect-ratio: auto;
		min-height: 22rem;
	}
}

/* Grid card media fallback (no thumbnail) */
.obc-services-card__media {
	height: 12rem;
	background-color: var(--color-surface-container-low);
}

.h-48 {
	height: 12rem;
}

.object-cover {
	object-fit: cover;
}

.text-5xl {
	font-size: 3rem;
	line-height: 1;
}

.group:hover .group-hover\:scale-105 {
	transform: scale(1.05);
}

.hover\:translate-x-\[-4px\]:hover {
	transform: translateX(-4px);
}

/* Back-to-top button */
.obc-services-back-to-top {
	opacity: 0;
	transition: opacity var(--transition-normal);
}

.obc-services-back-to-top.is-visible {
	opacity: 1;
}

/* Single service — intro grid (copy + gallery) */
.obc-services-single__intro {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--space-lg);
	margin-bottom: var(--space-md);
}

@media (min-width: 768px) {
	.obc-services-single__intro {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr);
		gap: var(--space-xl);
		align-items: start;
	}

	.obc-services-single__gallery {
		order: 2;
		position: sticky;
		top: var(--space-lg);
	}

	.obc-services-single__copy {
		order: 1;
		min-width: 0;
	}
}

/* Service image gallery */
.obc-service-gallery {
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: var(--space-sm);
}

.obc-service-gallery__stage {
	position: relative;
	overflow: hidden;
	border-radius: var(--radius-2xl);
	background: var(--color-surface-container);
	aspect-ratio: 16 / 10;
}

.obc-service-gallery__main {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: 1;
	transition: opacity var(--transition-normal);
	will-change: opacity;
}

.obc-service-gallery__main.is-fading {
	opacity: 0;
}

.obc-service-gallery__nav {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 1;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.5rem;
	height: 2.5rem;
	padding: 0;
	border: none;
	border-radius: var(--radius-full);
	background: var(--color-surface-container-lowest);
	color: var(--color-primary);
	box-shadow: var(--elevation-card);
	cursor: pointer;
	transition: background var(--transition-fast), color var(--transition-fast);
}

.obc-service-gallery__nav:hover {
	background: var(--color-primary);
	color: var(--color-on-primary);
}

.obc-service-gallery__nav--prev {
	inset-inline-start: var(--space-sm);
}

.obc-service-gallery__nav--next {
	inset-inline-end: var(--space-sm);
}

.obc-service-gallery__nav .material-symbols-outlined {
	font-size: 1.5rem;
	line-height: 1;
}

.obc-service-gallery__thumbs {
	display: flex;
	gap: var(--space-sm);
	overflow-x: auto;
	padding-block: var(--space-xs);
	scrollbar-width: thin;
	scroll-snap-type: x proximity;
}

.obc-service-gallery__thumb {
	flex: 0 0 auto;
	width: 4.5rem;
	height: 3.375rem;
	padding: 0;
	border: 2px solid transparent;
	border-radius: var(--radius-lg);
	overflow: hidden;
	background: var(--color-surface-container);
	cursor: pointer;
	scroll-snap-align: start;
	transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
}

.obc-service-gallery__thumb img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.obc-service-gallery__thumb:hover {
	border-color: var(--color-outline-variant);
}

.obc-service-gallery__thumb.is-active {
	border-color: var(--color-primary);
	box-shadow: 0 0 0 1px var(--color-primary);
}

@media (max-width: 767px) {
	.obc-services-single__gallery {
		order: -1;
	}

	.obc-service-gallery__thumb {
		width: 4rem;
		height: 3rem;
	}
}

/* Hero */
.obc-services-hero {
	padding-top: var(--space-xl);
	margin-bottom: var(--space-lg);
}

.obc-services-hero h1 {
	font-family: var(--font-display);
	font-size: 2rem;
	line-height: 1.2;
	color: var(--color-on-background);
	margin-bottom: var(--space-md);
}

.obc-services-hero p,
.obc-services-hero__lede {
	font-family: var(--font-body);
	font-size: 1rem;
	line-height: 1.6;
	color: var(--color-on-surface-variant);
	max-width: 40rem;
}

.obc-services-hero__lede p {
	margin: 0 0 var(--space-sm);
}

.obc-services-hero__lede p:last-child {
	margin-bottom: 0;
}

@media ( max-width: 767px ) {
	.obc-services-hero h1 {
		font-size: 1.625rem;
		line-height: 1.3;
	}

	.obc-services-hero p,
	.obc-services-hero__lede {
		font-size: 1rem;
		line-height: 1.6;
	}
}

@media ( min-width: 768px ) and ( max-width: 1023px ) {
	.obc-services-hero h1 {
		font-size: 1.875rem;
		line-height: 1.25;
	}
}

/* Hero search */
.obc-services-hero__search {
	display: flex;
	flex-direction: row;
	align-items: stretch;
	width: 100%;
	max-width: 40rem;
	border: 1px solid var(--color-outline-variant);
	border-radius: var(--radius-xl);
	overflow: hidden;
	background-color: var(--color-surface-container-lowest);
	transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
}

.obc-services-hero__search:focus-within {
	border-color: var(--color-primary);
	box-shadow: 0 0 0 1px var(--color-primary);
}

.obc-services-hero__search-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 3.25rem;
	padding: 0;
	border: none;
	border-radius: 0;
	background-color: var(--color-primary);
	color: var(--color-on-primary);
	cursor: pointer;
	transition: background-color var(--transition-fast);
}

.obc-services-hero__search-btn:hover,
.obc-services-hero__search-btn:focus-visible {
	background-color: var(--color-secondary);
}

.obc-services-hero__search-btn .material-symbols-outlined {
	font-size: 1.5rem;
	line-height: 1;
}

.obc-services-hero__search-input {
	flex: 1;
	min-width: 0;
	border: none;
	border-radius: 0;
	outline: none;
	padding-block: var(--space-md);
	padding-inline: var(--space-lg);
	box-sizing: border-box;
	color: var(--color-on-surface);
	background-color: transparent;
	font-family: var(--font-body);
	font-size: 1rem;
	line-height: 1.5;
}

.obc-services-hero__search-input::placeholder {
	color: var(--color-on-surface-variant);
}

.obc-services-hero__search-input:focus {
	outline: none;
	box-shadow: none;
}

@media (max-width: 767px) {
	.obc-services-hero__search {
		max-width: 100%;
	}
}

/* Sticky category chips */
.obc-services-filters-wrap {
	position: sticky;
	top: 0;
	z-index: calc(var(--z-sticky) - 1);
	background: var(--color-background);
	border-bottom: 1px solid color-mix(in srgb, var(--color-outline-variant) 35%, transparent);
	margin-inline: calc(-1 * var(--margin-mobile));
	padding-inline: var(--margin-mobile);
	margin-bottom: var(--space-xl);
}

@media (min-width: 768px) {
	.obc-services-filters-wrap {
		margin-inline: calc(-1 * var(--margin-desktop));
		padding-inline: var(--margin-desktop);
	}
}

.obc-services-filters {
	display: flex;
	gap: var(--space-sm);
	overflow-x: auto;
	padding-block: var(--space-md);
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
}

.obc-services-filters::-webkit-scrollbar {
	display: none;
}

.obc-services-filters__pill {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	white-space: nowrap;
	padding: var(--space-sm) var(--space-md);
	border-radius: var(--radius-md);
	border: 1px solid color-mix(in srgb, var(--color-outline-variant) 70%, transparent);
	background-color: var(--color-surface-container-lowest);
	color: var(--color-on-surface-variant);
	font-family: var(--font-body);
	font-size: 0.875rem;
	font-weight: 600;
	line-height: 1.4;
	text-decoration: none;
	transition: background-color var(--transition-fast), color var(--transition-fast), border-color var(--transition-fast);
}

.obc-services-filters__pill:hover {
	border-color: var(--color-secondary);
	color: var(--color-on-surface);
}

.obc-services-filters__pill.is-active,
.obc-services-filters__pill.is-active:hover,
.obc-services-filters__pill.is-active:focus,
.obc-services-filters__pill.is-active:visited {
	background-color: var(--color-primary);
	color: var(--color-on-primary);
	border-color: var(--color-primary);
}

/* Sidebar */
.obc-services-sidebar {
	align-self: start;
}

@media (min-width: 1024px) {
	.obc-services-sidebar {
		position: sticky;
		top: 5.5rem;
	}
}

/* CTA panel */
.obc-services-cta {
	position: relative;
	overflow: hidden;
}

.obc-services-cta::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: radial-gradient(circle at top left, color-mix(in srgb, var(--color-primary) 5%, transparent) 0%, transparent 70%);
	pointer-events: none;
}

.obc-services-cta__title {
	margin: 0 0 var(--space-md);
	font-size: 1.5rem;
	line-height: 1.33;
	font-weight: 600;
}

.obc-services-cta__desc {
	line-height: 1.6;
}

.obc-services-cta__btn {
	width: 100%;
	justify-content: center;
}

/* Ensure Material icons inherit button text color and don’t clip */
.obc-services-page .btn .material-symbols-outlined {
	font-size: 1.125rem;
	line-height: 1;
	width: 1.125rem;
	height: 1.125rem;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: inherit;
	overflow: visible;
	flex-shrink: 0;
}

.obc-services-page .btn {
	overflow: visible;
	min-height: 2.75rem;
}

.obc-services-page .btn--small {
	min-height: 2.25rem;
}

.obc-services-page .btn--large {
	min-height: 3.25rem;
}

/* Breadcrumb */
.obc-services-breadcrumb,
.obc-services-archive-breadcrumb {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--space-xs);
}

.obc-services-breadcrumb a,
.obc-services-archive-breadcrumb a {
	color: var(--color-primary);
	text-decoration: none;
	transition: color var(--transition-fast);
}

.obc-services-breadcrumb a:hover,
.obc-services-archive-breadcrumb a:hover {
	color: var(--color-primary-container);
}

.obc-services-breadcrumb .rank-math-breadcrumb p,
.obc-services-archive-breadcrumb .rank-math-breadcrumb p {
	margin: 0;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--space-xs);
}

.obc-services-breadcrumb span:last-child,
.obc-services-archive-breadcrumb span:last-child {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	max-width: 100%;
	display: inline-block;
	vertical-align: bottom;
}

/* Single service entry content */
.obc-services-single-page .entry-content h1,
.obc-services-single-page .entry-content h2,
.obc-services-single-page .entry-content h3,
.obc-services-single-page .entry-content h4,
.obc-services-single-page .entry-content h5,
.obc-services-single-page .entry-content h6 {
	font-family: var(--font-display);
	color: var(--color-on-surface);
	margin-top: var(--space-xl);
	margin-bottom: var(--space-md);
	line-height: 1.35;
	font-weight: 700;
	letter-spacing: -0.01em;
}

.obc-services-single-page .entry-content h1 {
	font-size: 1.75rem;
	line-height: 1.3;
}

.obc-services-single-page .entry-content h2 {
	font-size: 1.5rem;
	line-height: 1.3;
}

.obc-services-single-page .entry-content h3 {
	font-size: 1.25rem;
	line-height: 1.35;
}

.obc-services-single-page .entry-content h4 {
	font-size: 1.125rem;
	line-height: 1.4;
}

.obc-services-single-page .entry-content h5,
.obc-services-single-page .entry-content h6 {
	font-size: 1rem;
	line-height: 1.45;
}

.obc-services-single-page .entry-content p {
	margin-bottom: var(--space-md);
	line-height: 1.85;
}

.obc-services-single-page .entry-content li {
	line-height: 1.85;
}

.obc-services-single-page .entry-content ul,
.obc-services-single-page .entry-content ol {
	margin-bottom: var(--space-md);
	padding-inline-start: var(--space-lg);
}

.obc-services-single-page .entry-content blockquote {
	margin: var(--space-lg) 0;
	padding: var(--space-md) var(--space-lg);
	border-inline-start: 4px solid var(--color-primary);
	background-color: var(--color-surface-container-low);
	border-radius: var(--radius-md);
}

.obc-services-single-page .entry-content img {
	max-width: 100%;
	height: auto;
	border-radius: var(--radius-xl);
	margin-block: var(--space-md);
}

.obc-services-single-page .entry-content {
	overflow-wrap: anywhere;
	word-break: break-word;
}

.obc-services-single-page .entry-content pre,
.obc-services-single-page .entry-content table {
	overflow-x: auto;
	max-width: 100%;
	display: block;
}

.obc-services-single-page .entry-content iframe,
.obc-services-single-page .entry-content video,
.obc-services-single-page .entry-content .wp-video,
.obc-services-single-page .entry-content .wp-block-embed,
.obc-services-single-page .entry-content figure {
	max-width: 100%;
}

.obc-services-single-page .entry-content a {
	word-break: break-word;
}

/* Mobile headings */
@media (max-width: 767px) {
	.obc-services-single-page .entry-content h1 {
		font-size: 1.5rem;
		line-height: 1.3;
	}

	.obc-services-single-page .entry-content h2 {
		font-size: 1.375rem;
		line-height: 1.3;
	}

	.obc-services-single-page .entry-content h3 {
		font-size: 1.25rem;
		line-height: 1.35;
	}

	.obc-services-single-page .entry-content h4 {
		font-size: 1.125rem;
		line-height: 1.4;
	}
}

/* Pagination */
.obc-services-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2.5rem;
	height: 2.5rem;
	padding-inline: var(--space-sm);
	border-radius: var(--radius-lg);
	border: 1px solid var(--color-outline-variant);
	color: var(--color-on-surface);
	text-decoration: none;
	font-family: var(--font-label);
	font-size: 0.875rem;
	transition: background-color var(--transition-fast);
}

.obc-services-pagination .page-numbers.current {
	background-color: var(--color-primary);
	border-color: var(--color-primary);
	color: var(--color-on-primary);
}

.obc-services-pagination .page-numbers:hover:not(.current) {
	background-color: var(--color-surface-container);
}


/* ==========================================================================
   Single service redesign — hero, sections, process, CTA band, post-nav
   ========================================================================== */

.obc-services-hero-split {
	display: grid;
	gap: var(--space-lg);
	margin-bottom: var(--space-2xl);
}

@media (min-width: 980px) {
	.obc-services-hero-split--has-media {
		grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
		gap: var(--space-xl);
		align-items: start;
	}
}

@media (max-width: 979px) {
	.obc-services-hero-split__media {
		order: -1;
	}
}

.obc-services-hero-split__copy {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-self: start;
	gap: var(--space-md);
	padding: var(--space-lg);
	background: var(--color-surface-container-lowest);
	border: 1px solid color-mix(in srgb, var(--color-outline-variant) 40%, transparent);
	border-radius: var(--radius-2xl);
	box-shadow: var(--elevation-card);
}

@media (min-width: 980px) {
	.obc-services-hero-split__copy {
		padding: var(--space-lg) var(--space-xl);
	}
}

.obc-services-hero-split__badge {
	width: fit-content;
}

.obc-services-hero-split__title {
	margin: 0;
	font-family: var(--font-display);
	font-size: clamp(1.5rem, 3vw, 2rem);
	line-height: 1.2;
	font-weight: 700;
	letter-spacing: -0.02em;
	color: var(--color-on-background);
}

.obc-services-hero-split__lead {
	margin: 0;
	font-size: 1rem;
	line-height: 1.7;
	color: var(--color-on-surface-variant);
	max-width: 36em;
}

.obc-services-meta-chips {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-sm);
}

.obc-services-meta-chip {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 0.375rem 0.75rem;
	border-radius: var(--radius-full);
	background: var(--color-surface-container-low);
	color: var(--color-on-surface-variant);
	font-size: 0.8125rem;
	font-family: var(--font-label);
}

.obc-services-meta-chip .material-symbols-outlined {
	font-size: 1rem;
	color: var(--color-primary);
}

.obc-services-hero-split__cta {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-sm);
	margin-top: var(--space-sm);
}

.obc-services-hero-split__media {
	min-width: 0;
}

.obc-services-section {
	margin-bottom: var(--space-2xl);
}

.obc-services-section:last-child {
	margin-bottom: 0;
}

.obc-services-section__head {
	margin-bottom: var(--space-lg);
}

.obc-services-section__title {
	margin: 0;
	font-family: var(--font-display);
	font-size: 1.375rem;
	line-height: 1.3;
	font-weight: 700;
	position: relative;
	padding-bottom: var(--space-sm);
	color: var(--color-on-surface);
	width: fit-content;
}

.obc-services-section__title::after {
	content: '';
	position: absolute;
	inset-inline-start: 0;
	bottom: 0;
	width: 2.5rem;
	height: 3px;
	background: var(--color-primary);
	border-radius: var(--radius-full);
}

.obc-services-benefits {
	display: grid;
	gap: var(--space-md);
	margin: 0;
	padding: 0;
	list-style: none;
}

@media (min-width: 640px) {
	.obc-services-benefits {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

.obc-services-benefit {
	display: flex;
	align-items: flex-start;
	gap: var(--space-md);
	padding: var(--space-md);
	background: var(--color-surface-container-lowest);
	border: 1px solid color-mix(in srgb, var(--color-outline-variant) 35%, transparent);
	border-radius: var(--radius-xl);
	transition: border-color var(--transition-fast), box-shadow var(--transition-normal);
}

.obc-services-benefit:hover {
	border-color: color-mix(in srgb, var(--color-primary) 40%, transparent);
	box-shadow: var(--elevation-card);
}

.obc-services-benefit__icon {
	flex-shrink: 0;
	width: 2.5rem;
	height: 2.5rem;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: var(--radius-lg);
	background: color-mix(in srgb, var(--color-primary) 12%, transparent);
	color: var(--color-primary);
}

.obc-services-benefit__icon .material-symbols-outlined {
	font-size: 1.25rem;
}

.obc-services-benefit__text {
	font-size: 0.9375rem;
	line-height: 1.55;
	color: var(--color-on-surface-variant);
	padding-top: 0.375rem;
}

.obc-services-prose {
	background: var(--color-surface-container-lowest);
	border: 1px solid color-mix(in srgb, var(--color-outline-variant) 30%, transparent);
	border-radius: var(--radius-2xl);
	padding: var(--space-lg);
}

@media (min-width: 768px) {
	.obc-services-prose {
		padding: var(--space-xl);
	}
}

.obc-services-process {
	display: grid;
	gap: var(--space-md);
	margin: 0;
	padding: 0;
	list-style: none;
	counter-reset: obc-service-step;
}

@media (min-width: 768px) {
	.obc-services-process {
		grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
	}
}

.obc-services-process__step {
	position: relative;
	padding: var(--space-lg);
	background: var(--color-surface-container-low);
	border-radius: var(--radius-xl);
	counter-increment: obc-service-step;
}

.obc-services-process__step::before {
	content: counter(obc-service-step);
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2rem;
	height: 2rem;
	margin-bottom: var(--space-md);
	border-radius: var(--radius-full);
	background: var(--color-primary);
	color: var(--color-on-primary);
	font-family: var(--font-label);
	font-size: 0.875rem;
	font-weight: 700;
}

.obc-services-process__step-title {
	margin: 0 0 var(--space-sm);
	font-size: 1rem;
	font-weight: 600;
	line-height: 1.4;
	color: var(--color-on-surface);
}

.obc-services-process__step-desc {
	margin: 0;
	font-size: 0.875rem;
	color: var(--color-on-surface-variant);
	line-height: 1.55;
}

.obc-services-cta-band {
	display: flex;
	flex-direction: column;
	gap: var(--space-md);
	padding: var(--space-xl);
	border-radius: var(--radius-2xl);
	background:
		radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--color-primary-container) 35%, transparent), transparent 55%),
		linear-gradient(135deg, var(--color-secondary-container) 0%, var(--color-surface-container-low) 100%);
	border: 1px solid color-mix(in srgb, var(--color-primary) 15%, transparent);
}

@media (min-width: 640px) {
	.obc-services-cta-band {
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
	}
}

.obc-services-cta-band__title {
	margin: 0 0 var(--space-xs);
	font-size: 1.25rem;
	font-weight: 700;
	line-height: 1.35;
	color: var(--color-on-surface);
}

.obc-services-cta-band__desc {
	margin: 0;
	font-size: 0.9375rem;
	color: var(--color-on-surface-variant);
	max-width: 36em;
	line-height: 1.6;
}

.obc-services-post-nav {
	display: grid;
	gap: var(--space-md);
}

@media (min-width: 640px) {
	.obc-services-post-nav {
		grid-template-columns: 1fr 1fr;
	}
}

.obc-services-post-nav__link {
	display: flex;
	align-items: center;
	gap: var(--space-md);
	min-width: 0;
	padding: var(--space-sm);
	padding-inline-end: var(--space-md);
	background: var(--color-surface-container-lowest);
	border: 1px solid color-mix(in srgb, var(--color-outline-variant) 35%, transparent);
	border-radius: var(--radius-xl);
	text-decoration: none;
	color: var(--color-on-surface);
	transition: border-color var(--transition-fast), box-shadow var(--transition-normal);
}

.obc-services-post-nav__link:hover {
	border-color: var(--color-primary);
	box-shadow: var(--elevation-card);
}

.obc-services-post-nav__link--next {
	flex-direction: row-reverse;
	text-align: start;
}

.obc-services-post-nav__thumb {
	width: 4.5rem;
	height: 4.5rem;
	border-radius: var(--radius-lg);
	overflow: hidden;
	flex-shrink: 0;
	background: var(--color-surface-container);
}

.obc-services-post-nav__thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.obc-services-post-nav__label {
	display: block;
	font-size: 0.75rem;
	font-family: var(--font-label);
	color: var(--color-outline);
	margin-bottom: 2px;
}

.obc-services-post-nav__title {
	display: block;
	font-size: 0.9375rem;
	font-weight: 600;
	line-height: 1.35;
}

.obc-services-post-nav__link:hover .obc-services-post-nav__title {
	color: var(--color-primary);
}

.obc-services-related-grid {
	display: grid;
	gap: var(--space-lg);
}

@media (min-width: 640px) {
	.obc-services-related-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

/* Sidebar phone + category list */
.obc-services-cta__phone {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--space-sm);
	margin-top: var(--space-md);
	font-size: 0.875rem;
	color: var(--color-on-surface-variant);
	text-decoration: none;
	transition: color var(--transition-fast);
}

.obc-services-cta__phone .material-symbols-outlined {
	font-size: 1.125rem;
	color: var(--color-primary);
}

.obc-services-cta__phone:hover {
	color: var(--color-primary);
}

.obc-services-cat-list {
	display: flex;
	flex-direction: column;
	gap: var(--space-sm);
	margin: 0;
	padding: 0;
	list-style: none;
}

.obc-services-cat-list__link {
	display: block;
	padding: 0.625rem var(--space-md);
	border-radius: var(--radius-md);
	background: var(--color-surface-container);
	color: var(--color-on-surface-variant);
	font-size: 0.875rem;
	font-family: var(--font-label);
	text-decoration: none;
	transition: background-color var(--transition-fast), color var(--transition-fast);
}

.obc-services-cat-list__link:hover {
	background: var(--color-surface-container-high);
	color: var(--color-on-surface);
}

.obc-services-cat-list__link.is-active,
.obc-services-cat-list__link.is-active:hover,
.obc-services-cat-list__link.is-active:focus,
.obc-services-cat-list__link.is-active:visited {
	background: var(--color-primary);
	color: var(--color-on-primary);
	font-weight: 600;
}

/* ——— Archive redesign: domains, featured, rows, consult ——— */

.obc-services-domains {
	margin-bottom: var(--space-2xl);
}

.obc-services-domains__label {
	margin: 0 0 var(--space-md);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--color-secondary);
}

.obc-services-domains__grid {
	display: grid;
	gap: var(--gutter);
	grid-template-columns: 1fr;
}

@media (min-width: 768px) {
	.obc-services-domains__grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

.obc-services-domain {
	position: relative;
	isolation: isolate;
	min-height: 200px;
	border-radius: var(--radius-2xl);
	overflow: hidden;
	text-decoration: none;
	color: var(--color-on-primary);
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	padding: var(--space-lg);
	transition: transform var(--transition-fast);
}

.obc-services-domain:hover {
	transform: translateY(-2px);
}

.obc-services-domain__bg {
	position: absolute;
	inset: 0;
	z-index: -2;
	background-size: cover;
	background-position: center;
	transition: transform 0.6s ease;
}

.obc-services-domain:hover .obc-services-domain__bg {
	transform: scale(1.06);
}

.obc-services-domain--a .obc-services-domain__bg:not([style*='background-image']) {
	background-color: #2a5200;
	background-image: linear-gradient(135deg, #2a5200, #4a7a18);
}

.obc-services-domain--b .obc-services-domain__bg:not([style*='background-image']) {
	background-color: #3d2918;
	background-image: linear-gradient(145deg, #3d2918, #78574a 40%, #466821);
}

.obc-services-domain--c .obc-services-domain__bg:not([style*='background-image']) {
	background-color: #1f4200;
	background-image: linear-gradient(160deg, #1f4200, #6bb728 55%, #d8e4c2);
}

.obc-services-domain__bg[style*='background-image'] {
	background-color: var(--color-primary);
}

.obc-services-domain__veil {
	position: absolute;
	inset: 0;
	z-index: -1;
	background: linear-gradient(
		to top,
		color-mix(in srgb, var(--color-primary) 88%, #000) 0%,
		color-mix(in srgb, var(--color-primary) 35%, transparent) 55%,
		transparent 100%
	);
	pointer-events: none;
}

.obc-services-domain__arrow {
	position: absolute;
	top: var(--space-md);
	inset-inline-start: var(--space-md);
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.15);
	display: grid;
	place-items: center;
	transition: background var(--transition-fast);
}

.obc-services-domain:hover .obc-services-domain__arrow {
	background: rgba(255, 255, 255, 0.28);
}

.obc-services-domain__arrow .material-symbols-outlined {
	font-size: 1.25rem;
	line-height: 1;
}

.obc-services-domain__count {
	font-size: 0.75rem;
	opacity: 0.85;
	margin-bottom: var(--space-xs);
}

.obc-services-domain__title {
	font-family: var(--font-display);
	font-size: 1.375rem;
	font-weight: 700;
	margin: 0 0 var(--space-xs);
	line-height: 1.3;
	color: inherit;
}

.obc-services-domain__hint {
	margin: 0;
	font-size: 0.875rem;
	opacity: 0.9;
	line-height: 1.5;
}

/* Featured block */
.obc-services-featured-block {
	margin-bottom: var(--space-xl);
}

.obc-services-featured-block__label {
	display: inline-flex;
	align-items: center;
	gap: var(--space-xs);
	margin: 0 0 var(--space-md);
	font-size: 0.875rem;
	font-weight: 700;
	color: var(--color-primary);
}

.obc-services-featured-block__label .material-symbols-outlined {
	font-size: 1.125rem;
	line-height: 1;
}

.obc-services-featured-card {
	display: grid;
	gap: var(--space-lg);
	padding: var(--space-lg);
	background: var(--color-surface-container-lowest);
	border: 1px solid color-mix(in srgb, var(--color-outline-variant) 35%, transparent);
	border-radius: var(--radius-2xl);
}

@media (min-width: 768px) {
	.obc-services-featured-card {
		grid-template-columns: auto 1fr;
		align-items: center;
	}
}

.obc-services-featured-card__media {
	width: 72px;
	height: 72px;
	border-radius: var(--radius-2xl);
	display: grid;
	place-items: center;
	overflow: hidden;
	background: var(--color-secondary-container);
	color: var(--color-on-secondary-container);
	flex-shrink: 0;
}

.obc-services-featured-card__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.obc-services-featured-card__media .material-symbols-outlined {
	font-size: 2rem;
	line-height: 1;
}

.obc-services-featured-card__title {
	font-family: var(--font-display);
	font-size: 1.375rem;
	font-weight: 700;
	margin: 0 0 var(--space-sm);
	line-height: 1.3;
	color: var(--color-on-surface);
}

.obc-services-featured-card__title a {
	color: inherit;
	text-decoration: none;
}

.obc-services-featured-card__title a:hover {
	color: var(--color-primary);
}

.obc-services-featured-card__desc {
	margin: 0 0 var(--space-md);
	font-size: 0.9375rem;
	color: var(--color-on-surface-variant);
	line-height: 1.6;
}

.obc-services-featured-card__actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-sm);
}

/* Catalog list */
.obc-services-catalog {
	margin-bottom: var(--space-xl);
}

.obc-services-catalog__head {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: var(--space-md);
	margin-bottom: var(--space-lg);
}

.obc-services-catalog__title {
	font-family: var(--font-display);
	font-size: clamp(1.25rem, 2.5vw, 1.75rem);
	margin: 0;
	line-height: 1.3;
	color: var(--color-on-surface);
}

.obc-services-catalog__meta {
	margin: 0;
	font-size: 0.875rem;
	color: var(--color-on-surface-variant);
}

.obc-services-list {
	display: flex;
	flex-direction: column;
	gap: var(--space-sm);
}

.obc-services-row {
	display: grid;
	grid-template-columns: 56px 1fr auto;
	gap: var(--space-md);
	align-items: center;
	padding: var(--space-md);
	background: var(--color-surface-container-lowest);
	border: 1px solid color-mix(in srgb, var(--color-outline-variant) 35%, transparent);
	border-radius: var(--radius-xl);
	text-decoration: none;
	color: inherit;
	transition: border-color var(--transition-fast), box-shadow var(--transition-fast), transform var(--transition-fast);
}

.obc-services-row:hover {
	border-color: color-mix(in srgb, var(--color-primary) 40%, var(--color-outline-variant));
	box-shadow: var(--elevation-hover);
	transform: translateY(-1px);
}

@media (max-width: 639px) {
	.obc-services-row {
		grid-template-columns: 48px 1fr;
		grid-template-rows: auto auto;
	}

	.obc-services-row__cta {
		grid-column: 2;
		justify-self: start;
	}
}

.obc-services-row__media {
	width: 56px;
	height: 56px;
	border-radius: var(--radius-xl);
	display: grid;
	place-items: center;
	overflow: hidden;
	background: var(--color-secondary-container);
	color: var(--color-on-secondary-container);
	flex-shrink: 0;
}

.obc-services-row__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.obc-services-row__media .material-symbols-outlined {
	font-size: 1.75rem;
	line-height: 1;
}

.obc-services-row__body {
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: var(--space-xs);
}

.obc-services-row__badge {
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	color: var(--color-primary);
}

.obc-services-row__title {
	font-family: var(--font-display);
	font-size: 1.0625rem;
	font-weight: 700;
	line-height: 1.35;
	color: var(--color-on-surface);
}

.obc-services-row__desc {
	font-size: 0.875rem;
	color: var(--color-on-surface-variant);
	line-height: 1.55;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.obc-services-row__cta {
	display: inline-flex;
	align-items: center;
	gap: var(--space-xs);
	font-size: 0.8125rem;
	font-weight: 700;
	color: var(--color-primary);
	white-space: nowrap;
	padding: var(--space-sm) var(--space-md);
	border-radius: var(--radius-md);
	background: color-mix(in srgb, var(--color-secondary-container) 40%, transparent);
	transition: background var(--transition-fast);
}

.obc-services-row:hover .obc-services-row__cta {
	background: var(--color-secondary-container);
}

.obc-services-row__cta .material-symbols-outlined {
	font-size: 1.125rem;
	line-height: 1;
}

.obc-services-empty {
	text-align: center;
	padding: var(--space-2xl);
	color: var(--color-on-surface-variant);
	border: 1px dashed var(--color-outline-variant);
	border-radius: var(--radius-2xl);
	margin-bottom: var(--space-xl);
}

/* Full-width consult CTA */
.obc-services-consult {
	margin-top: var(--space-2xl);
	margin-bottom: var(--space-md);
	border-radius: var(--radius-2xl);
	overflow: hidden;
	position: relative;
	isolation: isolate;
	padding: var(--space-2xl) var(--space-lg);
	color: var(--color-on-primary);
	text-align: center;
}

.obc-services-consult::before {
	content: '';
	position: absolute;
	inset: 0;
	z-index: -1;
	background:
		radial-gradient(circle at 20% 80%, color-mix(in srgb, var(--color-primary-container) 40%, transparent), transparent 45%),
		linear-gradient(135deg, #1f4200, var(--color-primary) 50%, #2f4f09);
}

.obc-services-consult__title {
	font-family: var(--font-display);
	font-size: clamp(1.375rem, 3vw, 2rem);
	margin: 0 0 var(--space-sm);
	line-height: 1.25;
	color: inherit;
}

.obc-services-consult__desc {
	margin: 0 auto var(--space-lg);
	max-width: 28rem;
	opacity: 0.92;
	font-size: 0.9375rem;
	line-height: 1.6;
}

.obc-services-consult__actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-sm);
	justify-content: center;
}

.obc-services-consult .btn--light,
.obc-services-consult a.btn--light,
.obc-services-consult a.btn--light:visited {
	background: var(--color-surface-container-lowest);
	color: var(--color-primary);
	border-color: var(--color-surface-container-lowest);
}

.obc-services-consult .btn--light:hover,
.obc-services-consult a.btn--light:hover {
	background: var(--color-secondary-container);
	color: var(--color-on-secondary-container);
}

.obc-services-consult .btn--ghost,
.obc-services-consult a.btn--ghost,
.obc-services-consult a.btn--ghost:visited {
	background: transparent;
	border: 2px solid rgba(255, 255, 255, 0.45);
	color: var(--color-on-primary);
}

.obc-services-consult .btn--ghost:hover,
.obc-services-consult a.btn--ghost:hover {
	background: rgba(255, 255, 255, 0.12);
	color: var(--color-on-primary);
}