/* =========================================================
BO - Components
Reusable primitives shared by listing, detail, sliders and modals.
Loaded after bo-base.css and before feature-specific CSS.
========================================================= */

/* Vehicle UI must always follow the host site's typography. */
.bo-vehicle-listing,
.bo-bilvisning,
.bo-latest,
.bo-similar,
.bo-modal {
	font-family: inherit;
}

.bo-vehicle-listing button,
.bo-vehicle-listing input,
.bo-vehicle-listing select,
.bo-vehicle-listing textarea,
.bo-bilvisning button,
.bo-bilvisning input,
.bo-bilvisning select,
.bo-bilvisning textarea,
.bo-latest button,
.bo-latest input,
.bo-latest select,
.bo-latest textarea,
.bo-similar button,
.bo-similar input,
.bo-similar select,
.bo-similar textarea,
.bo-modal button,
.bo-modal input,
.bo-modal select,
.bo-modal textarea {
	font-family: inherit;
}

/* =========================================================
BO - Generic UI Helpers
Small reusable surfaces and icon button helpers shared across vehicle views.
========================================================= */

.bo-card {
	border: var(--bo-border);
	border-radius: var(--bo-radius-lg);
	background: var(--bo-surface);
}

.bo-soft {
	background: var(--bo-soft);
	border-radius: var(--bo-radius-md);
}

.bo-highlight {
	background: var(--bo-soft);
	border-radius: var(--bo-radius-md);
	max-width: 8.75rem;
}

.bo-icon-btn {
	width: var(--bo-size-7xl);
	height: var(--bo-size-7xl);
}

.bo-highlight-icon {
	width: 3rem;
	height: 3rem;
}

/* =========================================================
Bilonline - Vehicle card baseline
Shared visual defaults. Listing and slider CSS only override these deliberately.
========================================================= */

.bo-car-card {
	--bo-card-border: 1px solid var(--bo-alpha-black-10, rgba(0, 0, 0, .1));
	--bo-card-background: var(--bo-surface, #fff);
	--bo-card-title-font-size: 1.075rem;
	--bo-card-title-mobile-font-size: 1rem;
	--bo-card-title-font-weight: 500;
	--bo-card-title-letter-spacing: 0;
	--bo-card-badge-gap: .3rem;
	--bo-card-badge-padding: .35rem .5rem;
	--bo-card-badge-font-size: var(--bo-size-sm);
	--bo-card-badge-font-weight: 600;
	--bo-card-pill-gap: .4rem;
	--bo-card-pill-padding: 0;
	--bo-card-pill-border: 0;
	--bo-card-pill-radius: 0;
	--bo-card-pill-background: transparent;
	--bo-card-pill-color: var(--bo-pill-subtle-text, var(--bo-muted, #667085));
	--bo-card-pill-font-size: .75rem;
	--bo-card-pill-font-weight: 500;
	--bo-card-pill-line-height: 1.25;
	--bo-card-favorite-size: var(--bo-size-6xl);
	--bo-card-button-font-size: .875rem;
	--bo-card-meta-icon-size: 1.5rem;
}

.bo-car-card .bo-meta-ico .bo-icon {
	width: var(--bo-card-meta-icon-size);
	height: var(--bo-card-meta-icon-size);
}

.bo-car-card .bo-pill::before {
	content: "";
	flex: 0 0 auto;
	width: .375rem;
	height: .375rem;
	border-radius: var(--bo-radius-pill);
	background: var(--bo-pill-indicator-color, var(--bo-brand-primary));
}

.bo-car-card .bo-badge .bo-icon {
	width: 1rem;
	height: 1rem;
}

/* Badges */
.bo-badge {
	font-size: 1rem;
	font-weight: 500;
	background: var(--bo-theme-primary-soft);
	color: var(--bo-ink-900);
	padding: 1.25rem 0.625rem;
}

.bo-badge--discount {
	--bo-badge-border: var(--bo-discount-border);
	background: var(--bo-discount-bg);
	color: var(--bo-discount-color);
}

.bo-toast {
	position: fixed;
	left: 50%;
	bottom: 16px;
	transform: translateX(-50%);
	display: inline-flex;
	align-items: center;
	gap: .5rem;
	background: rgba(15, 23, 32, .92);
	color: #fff;
	padding: .65rem 1rem;
	border-radius: 999px;
	font-weight: 500;
	font-size: 14px;
	box-shadow: 0 12px 28px rgba(0, 0, 0, .25);
	opacity: 0;
	pointer-events: none;
	transition: opacity .18s ease, transform .18s ease;
	z-index: 9999;
}

.bo-toast__icon {
	width: 1rem;
	height: 1rem;
	flex: 0 0 auto;
	transform-origin: center;
}

.bo-toast.is-show .bo-toast__icon {
	animation: bo-toast-icon-wave .4s ease-out both;
}

@keyframes bo-toast-icon-wave {
	0% {
		opacity: 0;
		transform: scale(.72) rotate(-14deg);
	}
	35% {
		opacity: 1;
		transform: scale(1.12) rotate(12deg);
	}
	55% {
		transform: scale(1.06) rotate(-9deg);
	}
	72% {
		transform: scale(1.03) rotate(6deg);
	}
	86% {
		transform: scale(1.01) rotate(-3deg);
	}
	100% {
		opacity: 1;
		transform: scale(1) rotate(0);
	}
}

@media (prefers-reduced-motion: reduce) {
	.bo-toast.is-show .bo-toast__icon {
		animation: none;
	}
}

	.bo-toast.is-show {
		opacity: 1;
		transform: translateX(-50%) translateY(-2px);
	}

.bo-action-fav.is-active,
.bo-action-fav[aria-pressed="true"] {
	--bo-fav-btn-bg: var(--bo-favorite-bg);
	--bo-fav-btn-color: var(--bo-favorite-color);
	--bo-fav-btn-shadow: inset 0 0 0 1px var(--bo-favorite-border);
	--bo-btn-active-bg: var(--bo-favorite-bg);
	--bo-btn-active-color: var(--bo-favorite-color);
	--bo-btn-active-border: var(--bo-favorite-border);
	--bo-btn-shadow-active: inset 0 0 0 1px var(--bo-favorite-border);
	background: var(--bo-favorite-bg);
	border-color: var(--bo-favorite-border);
	color: var(--bo-favorite-color);
	transition: background-color .2s ease, border-color .2s ease, color .2s ease, transform .12s ease;
}

	.bo-action-fav.is-active svg,
	.bo-action-fav[aria-pressed="true"] svg {
		transform: scale(1.05);
		transition: transform .12s ease;
	}

/* =========================================================
Bilonline - Card Hover Modes
Opt-in classes rendered on article.bo-car-card.
========================================================= */

.bo-car-card.bo-card-hover--lift,
.bo-car-card.bo-card-hover--image-zoom,
.bo-car-card.bo-card-hover--reveal-actions {
	transition: box-shadow .2s ease, transform .2s ease;
}

.bo-car-card.bo-card-hover--image-zoom .bo-car-card__img {
	transition: transform .28s ease;
}

.bo-car-card.bo-card-hover--reveal-actions .bo-car-card__cta {
	transition: opacity .2s ease, transform .2s ease;
}

@media (hover: hover) and (pointer: fine) {
	.bo-car-card.bo-card-hover--lift:hover,
	.bo-car-card.bo-card-hover--lift:focus-within {
		box-shadow: var(--bo-card-hover-shadow, 0 0.875rem 2rem rgba(15, 23, 42, .14));
		transform: translateY(-0.1875rem);
	}

	.bo-car-card.bo-card-hover--image-zoom:hover .bo-car-card__img,
	.bo-car-card.bo-card-hover--image-zoom:focus-within .bo-car-card__img {
		transform: scale(1.035);
	}

	.bo-car-card.bo-card-hover--reveal-actions .bo-car-card__cta {
		opacity: var(--bo-card-reveal-actions-opacity, .18);
		transform: translateY(.35rem);
	}

	.bo-car-card.bo-card-hover--reveal-actions:hover .bo-car-card__cta,
	.bo-car-card.bo-card-hover--reveal-actions:focus-within .bo-car-card__cta {
		opacity: 1;
		transform: translateY(0);
	}
}

@media (prefers-reduced-motion: reduce) {
	.bo-car-card.bo-card-hover--lift,
	.bo-car-card.bo-card-hover--image-zoom,
	.bo-car-card.bo-card-hover--reveal-actions,
	.bo-car-card.bo-card-hover--image-zoom .bo-car-card__img,
	.bo-car-card.bo-card-hover--reveal-actions .bo-car-card__cta {
		transition: none;
	}

	.bo-car-card.bo-card-hover--lift:hover,
	.bo-car-card.bo-card-hover--lift:focus-within,
	.bo-car-card.bo-card-hover--image-zoom:hover .bo-car-card__img,
	.bo-car-card.bo-card-hover--image-zoom:focus-within .bo-car-card__img,
	.bo-car-card.bo-card-hover--reveal-actions .bo-car-card__cta {
		transform: none;
	}
}


/* =========================================================
Bilonline - Buttons
========================================================= */

	/* Base */
	.bo-btn {
		--bo-btn-bg: var(--bo-theme-primary);
		--bo-btn-color: var(--bo-theme-on-primary);
		--bo-btn-border: var(--bo-theme-primary);
		--bo-btn-hover-bg: var(--bo-theme-primary-strong);
		--bo-btn-hover-color: var(--bo-theme-on-primary);
		--bo-btn-hover-border: var(--bo-theme-primary-strong);
		--bo-btn-active-bg: var(--bo-theme-primary-strong);
		--bo-btn-active-color: var(--bo-theme-on-primary);
		--bo-btn-active-border: var(--bo-theme-primary-strong);
		--bo-btn-disabled-bg: var(--bo-neutral-150);
		--bo-btn-disabled-color: var(--bo-text-muted);
		--bo-btn-disabled-border: var(--bo-neutral-150);
		--bo-btn-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.06);
		--bo-btn-shadow-hover: 0 0.375rem 0.875rem rgba(0, 0, 0, 0.12);
		--bo-btn-shadow-active: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.08);
		appearance: none;
		-webkit-appearance: none;
		border: 1px solid var(--bo-btn-border);
		background: var(--bo-btn-bg);
		color: var(--bo-btn-color);
		display: inline-flex;
		align-items: center;
		justify-content: center;
		gap: var(--bo-space-2);
		min-height: 2.75rem;
		padding: 0.75rem 1rem;
		border-radius: var(--bo-radius-xl);
		box-shadow: var(--bo-btn-shadow);
		font: inherit;
		font-size: 0.95rem;
		font-weight: 600;
		line-height: 1.2;
		text-align: center;
		text-decoration: none;
		white-space: nowrap;
		vertical-align: middle;
		cursor: pointer;
		user-select: none;
		-webkit-tap-highlight-color: transparent;
		transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease, transform 0.15s ease, opacity 0.2s ease;
	}

		.bo-btn:hover {
			background: var(--bo-btn-hover-bg);
			color: var(--bo-btn-hover-color);
			border-color: var(--bo-btn-hover-border);
			box-shadow: var(--bo-btn-shadow-hover);
			text-decoration: none;
			transform: translateY(-1px);
		}

		.bo-btn:focus {
			outline: none;
		}

		.bo-btn:focus-visible {
			outline: none;
			box-shadow: var(--bo-focus-ring), var(--bo-btn-shadow-hover);
		}

		.bo-btn:active,
		.bo-btn.is-active,
		.bo-btn.active,
		.bo-btn[aria-pressed="true"] {
			background: var(--bo-btn-active-bg);
			color: var(--bo-btn-active-color);
			border-color: var(--bo-btn-active-border);
			box-shadow: var(--bo-btn-shadow-active);
			transform: translateY(0);
		}

		.bo-btn:disabled,
		.bo-btn.disabled,
		.bo-btn[aria-disabled="true"] {
			background: var(--bo-btn-disabled-bg);
			color: var(--bo-btn-disabled-color);
			border-color: var(--bo-btn-disabled-border);
			box-shadow: none;
			opacity: 0.72;
			cursor: not-allowed;
			pointer-events: none;
			transform: none;
		}

		.bo-btn > svg,
		.bo-btn > i,
		.bo-btn > .bo-btn__icon {
			flex: 0 0 auto;
			width: 1.125rem;
			height: 1.125rem;
			display: inline-block;
		}

/* =========================================================
Variants
========================================================= */

	/* Primary */
	.bo-btn--primary,
	.bo-btn-group--primary .bo-btn {
		--bo-btn-bg: var(--bo-theme-primary);
		--bo-btn-color: var(--bo-theme-on-primary);
		--bo-btn-border: var(--bo-theme-primary);
		--bo-btn-hover-bg: var(--bo-theme-primary-strong);
		--bo-btn-hover-color: var(--bo-theme-on-primary);
		--bo-btn-hover-border: var(--bo-theme-primary-strong);
		--bo-btn-active-bg: var(--bo-theme-primary-strong);
		--bo-btn-active-color: var(--bo-theme-on-primary);
		--bo-btn-active-border: var(--bo-theme-primary-strong);
	}

	/* Secondary */
	.bo-btn--secondary,
	.bo-btn-group--secondary .bo-btn {
		--bo-btn-bg: var(--bo-surface);
		--bo-btn-color: var(--bo-text);
		--bo-btn-border: var(--bo-border-color);
		--bo-btn-hover-bg: var(--bo-surface-soft);
		--bo-btn-hover-color: var(--bo-text-strong);
		--bo-btn-hover-border: var(--bo-border-color-strong);
		--bo-btn-active-bg: var(--bo-surface-muted);
		--bo-btn-active-color: var(--bo-text-strong);
		--bo-btn-active-border: var(--bo-border-color-strong);
	}

	/* Outline */
	.bo-btn--outline,
	.bo-btn-group--outline .bo-btn {
		--bo-btn-bg: transparent;
		--bo-btn-color: var(--bo-theme-primary);
		--bo-btn-border: var(--bo-theme-primary);
		--bo-btn-hover-bg: var(--bo-theme-primary);
		--bo-btn-hover-color: var(--bo-theme-on-primary);
		--bo-btn-hover-border: var(--bo-theme-primary);
		--bo-btn-active-bg: var(--bo-theme-primary-strong);
		--bo-btn-active-color: var(--bo-theme-on-primary);
		--bo-btn-active-border: var(--bo-theme-primary-strong);
		--bo-btn-shadow: none;
		--bo-btn-shadow-hover: 0 0.375rem 0.875rem rgba(0, 0, 0, 0.08);
		--bo-btn-shadow-active: none;
	}

	/* Ghost */
	.bo-btn--ghost,
	.bo-btn-group--ghost .bo-btn {
		--bo-btn-bg: transparent;
		--bo-btn-color: var(--bo-theme-primary);
		--bo-btn-border: transparent;
		--bo-btn-hover-bg: var(--bo-theme-primary-soft);
		--bo-btn-hover-color: var(--bo-theme-primary-strong);
		--bo-btn-hover-border: transparent;
		--bo-btn-active-bg: var(--bo-theme-primary-muted);
		--bo-btn-active-color: var(--bo-theme-primary-strong);
		--bo-btn-active-border: transparent;
		--bo-btn-shadow: none;
		--bo-btn-shadow-hover: none;
		--bo-btn-shadow-active: none;
	}

	/* Soft / tinted */
	.bo-btn--soft {
		--bo-btn-bg: var(--bo-theme-primary-soft);
		--bo-btn-color: var(--bo-theme-primary-strong);
		--bo-btn-border: transparent;
		--bo-btn-hover-bg: var(--bo-theme-primary-muted);
		--bo-btn-hover-color: var(--bo-theme-primary-strong);
		--bo-btn-hover-border: transparent;
		--bo-btn-active-bg: var(--bo-theme-primary-muted);
		--bo-btn-active-color: var(--bo-theme-primary-strong);
		--bo-btn-active-border: transparent;
		--bo-btn-shadow: none;
		--bo-btn-shadow-hover: none;
		--bo-btn-shadow-active: none;
	}

	/* Danger */
	.bo-btn--danger {
		--bo-btn-bg: var(--bo-danger-500);
		--bo-btn-color: var(--bo-white);
		--bo-btn-border: var(--bo-danger-500);
		--bo-btn-hover-bg: var(--bo-danger-700);
		--bo-btn-hover-color: var(--bo-white);
		--bo-btn-hover-border: var(--bo-danger-700);
		--bo-btn-active-bg: var(--bo-danger-700);
		--bo-btn-active-color: var(--bo-white);
		--bo-btn-active-border: var(--bo-danger-700);
	}

	/* Link */
	.bo-btn--link {
		--bo-btn-bg: transparent;
		--bo-btn-color: var(--bo-link);
		--bo-btn-border: transparent;
		--bo-btn-hover-bg: transparent;
		--bo-btn-hover-color: var(--bo-link-hover);
		--bo-btn-hover-border: transparent;
		--bo-btn-active-bg: transparent;
		--bo-btn-active-color: var(--bo-link-hover);
		--bo-btn-active-border: transparent;
		--bo-btn-shadow: none;
		--bo-btn-shadow-hover: none;
		--bo-btn-shadow-active: none;
		min-height: auto;
		padding: 0;
		border-radius: 0;
		font-weight: 600;
	}

		.bo-btn--link:hover {
			transform: none;
			text-decoration: underline;
		}

		.bo-btn--link:focus-visible {
			box-shadow: none;
			text-decoration: underline;
			outline: 2px solid transparent;
		}

/* =========================================================
Sizes
========================================================= */

	.bo-btn--sm {
		min-height: 2.25rem;
		padding: 0.625rem 0.875rem;
		border-radius: var(--bo-radius-lg);
		font-size: 0.875rem;
	}

	.bo-btn--lg {
		min-height: 3rem;
		padding: 0.875rem 1.25rem;
		border-radius: var(--bo-radius-2xl);
		font-size: 1rem;
	}

	.bo-btn--pill {
		border-radius: var(--bo-radius-pill);
	}

/* =========================================================
Layout helpers
========================================================= */

	.bo-btn--full {
		width: 100%;
	}

	.bo-btn--icon {
		width: 2.75rem;
		min-width: 2.75rem;
		padding: 0;
		aspect-ratio: 1 / 1;
	}

		.bo-btn--icon.bo-btn--sm {
			width: 2.25rem;
			min-width: 2.25rem;
		}

		.bo-btn--icon.bo-btn--lg {
			width: 3rem;
			min-width: 3rem;
		}

	.bo-btn--with-icon-right {
		flex-direction: row-reverse;
	}

/* =========================================================
Loading
========================================================= */

	.bo-btn.is-loading {
		position: relative;
		pointer-events: none;
		color: transparent !important;
	}

		.bo-btn.is-loading::after {
			content: "";
			position: absolute;
			width: 1rem;
			height: 1rem;
			border: 2px solid currentColor;
			border-right-color: transparent;
			border-radius: 50%;
			animation: bo-btn-spin 0.65s linear infinite;
			color: inherit;
		}

	@keyframes bo-btn-spin {
		to {
			transform: rotate(360deg);
		}
	}

/* =========================================================
Button group
========================================================= */
	.bo-btn-group {
		display: inline-flex;
		flex-wrap: wrap;
		gap: var(--bo-space-2);
	}

	.bo-btn-group--attached {
		gap: 0;
	}

		.bo-btn-group--attached > .bo-btn {
			border-radius: 0;
		}

			.bo-btn-group--attached > .bo-btn:first-child {
				border-top-left-radius: var(--bo-radius-xl);
				border-bottom-left-radius: var(--bo-radius-xl);
			}

			.bo-btn-group--attached > .bo-btn:last-child {
				border-top-right-radius: var(--bo-radius-xl);
				border-bottom-right-radius: var(--bo-radius-xl);
			}

			.bo-btn-group--attached > .bo-btn + .bo-btn {
				margin-left: -1px;
			}

/* =========================================================
Mobile polish
========================================================= */
	@media (max-width: 575.98px) {
		.bo-btn {
			min-height: 2.625rem;
		}

		.bo-btn--lg {
			min-height: 2.875rem;
		}
	}

/* =========================================================
News block
========================================================= */
.bo-news-block {
	padding-block: var(--bo-space-10);
	color: var(--bo-text);
}

.bo-news-block__heading {
	margin: 0 0 var(--bo-space-7);
	color: var(--bo-text-strong);
	font-size: clamp(1.5rem, 2vw, 2rem);
	font-weight: 700;
	letter-spacing: 0;
}

.bo-news-block__items {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--bo-space-6);
}

.bo-news-card {
	display: flex;
	min-width: 0;
	flex-direction: column;
	overflow: hidden;
	border: var(--bo-border);
	border-radius: var(--bo-radius-sm);
	background: var(--bo-card-bg);
}

.bo-news-card__image {
	display: block;
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
}

.bo-news-card__content {
	display: flex;
	flex: 1;
	flex-direction: column;
	padding: var(--bo-space-6);
}

.bo-news-card__date {
	margin-bottom: var(--bo-space-2);
	color: var(--bo-text-muted);
	font-size: .8125rem;
}

.bo-news-card__title {
	margin: 0 0 var(--bo-space-3);
	color: var(--bo-text-strong);
	font-size: 1.125rem;
	font-weight: 700;
	letter-spacing: 0;
}

.bo-news-card__text {
	margin: 0;
	color: var(--bo-text);
	font-size: .9375rem;
	line-height: 1.6;
}

.bo-news-card__action {
	align-self: flex-start;
	margin-top: var(--bo-space-5);
}

.bo-news-block--list .bo-news-block__items {
	grid-template-columns: minmax(0, 1fr);
}

.bo-news-block--list .bo-news-card {
	display: grid;
	grid-template-columns: minmax(12rem, 30%) minmax(0, 1fr);
}

.bo-news-block--list .bo-news-card--no-image {
	grid-template-columns: minmax(0, 1fr);
}

.bo-news-block--list .bo-news-card__image {
	height: 100%;
	aspect-ratio: auto;
}

@media (max-width: 991.98px) {
	.bo-news-block__items {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 575.98px) {
	.bo-news-block {
		padding-block: var(--bo-space-8);
	}

	.bo-news-block__items,
	.bo-news-block--list .bo-news-card {
		grid-template-columns: minmax(0, 1fr);
	}

	.bo-news-block--list .bo-news-card__image {
		aspect-ratio: 16 / 9;
	}
}

/* =========================================================
Reviews block
========================================================= */
.bo-reviews-block {
	padding-block: var(--bo-space-10);
	color: var(--bo-text);
}

.bo-reviews-block__heading {
	margin: 0 0 var(--bo-space-7);
	color: var(--bo-text-strong);
	font-size: 1.75rem;
	font-weight: 700;
	letter-spacing: 0;
}

.bo-reviews-block__items {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--bo-space-6);
}

.bo-review-card {
	display: flex;
	min-width: 0;
	flex-direction: column;
	padding: var(--bo-space-6);
	border: var(--bo-border);
	border-radius: var(--bo-radius-sm);
	background: var(--bo-card-bg);
}

.bo-review-card__rating {
	display: flex;
	gap: .2rem;
	margin-bottom: var(--bo-space-4);
	line-height: 1;
}

.bo-review-card__star {
	color: var(--bo-border-color);
	font-size: 1rem;
}

.bo-review-card__star.is-active {
	color: var(--bo-accent-500);
}

.bo-review-card__quote {
	margin: 0;
	color: var(--bo-text-strong);
	font-size: 1rem;
	line-height: 1.65;
}

.bo-review-card__author {
	display: flex;
	flex-direction: column;
	gap: var(--bo-space-1);
	margin-top: auto;
	padding-top: var(--bo-space-5);
	color: var(--bo-text);
	font-size: .875rem;
	font-weight: 700;
}

.bo-review-card__date {
	color: var(--bo-text-muted);
	font-size: .8125rem;
	font-weight: 400;
}

.bo-review-card__response {
	margin-top: var(--bo-space-5);
	padding: var(--bo-space-4);
	border-left: 3px solid var(--bo-accent-500);
	background: var(--bo-soft);
	color: var(--bo-text);
	font-size: .875rem;
	line-height: 1.55;
}

.bo-review-card__response-label {
	display: block;
	margin-bottom: var(--bo-space-2);
	color: var(--bo-text-strong);
}

.bo-review-card__response p {
	margin: 0;
}

.bo-reviews-block--list .bo-reviews-block__items {
	grid-template-columns: minmax(0, 1fr);
}

@media (max-width: 991.98px) {
	.bo-reviews-block__items {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 575.98px) {
	.bo-reviews-block {
		padding-block: var(--bo-space-8);
	}

	.bo-reviews-block__heading {
		font-size: 1.5rem;
	}

	.bo-reviews-block__items {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* =========================================================
Personnel block
========================================================= */
.bo-personnel-block {
	padding-block: var(--bo-space-10);
	color: var(--bo-text);
	font-family: inherit;
}

.bo-personnel-block__intro {
	width: 100%;
}

.bo-personnel-block__heading {
	margin: 0 0 var(--bo-space-6);
	color: var(--bo-text-strong);
	font-size: 1.75rem;
	font-weight: 700;
	letter-spacing: 0;
}

.bo-personnel-block__items {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--bo-space-6);
	margin: 0;
	padding: 0;
	list-style: none;
}

.bo-personnel-card {
	display: flex;
	min-width: 0;
	flex-direction: column;
	overflow: hidden;
	border: var(--bo-border);
	border-radius: var(--bo-radius-sm);
	background: var(--bo-card-bg);
}

.bo-personnel-card__image {
	display: block;
	width: 100%;
	max-height: none;
	aspect-ratio: 4 / 5;
	border-radius: 0;
	box-shadow: none;
	object-fit: cover;
	object-position: center top;
}

.bo-personnel-card__content {
	display: flex;
	min-width: 0;
	flex: 1;
	flex-direction: column;
	padding: var(--bo-space-6);
}

.bo-personnel-card__department {
	margin: 0 0 var(--bo-space-2);
	color: var(--bo-text-muted);
	font-size: .75rem;
	font-weight: 700;
	letter-spacing: 0;
	text-transform: uppercase;
}

.bo-personnel-card__name {
	margin: 0;
	color: var(--bo-text-strong);
	font-size: 1.15rem;
	font-weight: 700;
	letter-spacing: 0;
}

.bo-personnel-card__role,
.bo-personnel-card__location {
	margin: var(--bo-space-1) 0 0;
	color: var(--bo-text-muted);
	font-size: .875rem;
	line-height: 1.45;
}

.bo-personnel-card__role {
	color: var(--bo-text);
	font-weight: 600;
}

.bo-personnel-card__description {
	margin: var(--bo-space-4) 0 0;
	color: var(--bo-text);
	font-size: .9375rem;
	line-height: 1.6;
}

.bo-personnel-card__contacts {
	display: grid;
	gap: var(--bo-space-2);
	margin-top: auto;
	padding-top: var(--bo-space-5);
}

.bo-personnel-card__contact,
.bo-personnel-block .start-personal-phone-link,
.bo-personnel-block .start-personal-email-link {
	display: flex;
	align-items: center;
	gap: var(--bo-space-2);
	width: 100%;
	min-width: 0;
	padding: .55rem .65rem;
	border-radius: var(--bo-radius-sm);
	background: var(--bo-soft);
	color: var(--bo-text);
	font-size: .85rem;
	line-height: 1.35;
	text-align: left;
	text-decoration: none;
	transition: background-color .18s ease, color .18s ease;
}

.bo-personnel-card__contact:hover,
.bo-personnel-card__contact:focus {
	background: var(--bo-surface-hover, var(--bo-surface));
	color: var(--bo-text-strong);
	text-decoration: none;
}

.bo-personnel-card__contact-icon {
	width: 1.2rem;
	height: 1.2rem;
	flex: 0 0 auto;
	fill: currentColor;
}

.bo-personnel-card__contact span {
	min-width: 0;
	overflow-wrap: anywhere;
}

.bo-personnel-block--list .bo-personnel-block__items {
	grid-template-columns: minmax(0, 1fr);
}

.bo-personnel-block--list .bo-personnel-card {
	display: grid;
	grid-template-columns: minmax(12rem, 28%) minmax(0, 1fr);
}

.bo-personnel-block--list .bo-personnel-card--no-image {
	grid-template-columns: minmax(0, 1fr);
}

.bo-personnel-block--list .bo-personnel-card__image {
	height: 100%;
	min-height: 18rem;
	aspect-ratio: auto;
}

@media (max-width: 991.98px) {
	.bo-personnel-block__items {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 575.98px) {
	.bo-personnel-block {
		padding-block: var(--bo-space-8);
	}

	.bo-personnel-block__heading {
		font-size: 1.5rem;
	}

	.bo-personnel-block__items {
		grid-template-columns: minmax(0, 1fr);
	}

	.bo-personnel-card__image {
		aspect-ratio: 4 / 3;
	}

	.bo-personnel-block--list .bo-personnel-card {
		grid-template-columns: minmax(0, 1fr);
	}

	.bo-personnel-block--list .bo-personnel-card__image {
		height: auto;
		min-height: 0;
		aspect-ratio: 4 / 3;
	}
}