/* Orion Testimonial — matches the real ".our-testimonials-section" markup
   exactly, using this project's real breakpoints:
   sm=640, md=769, lg=992, xl=1199, 1xl=1380, 2xl=1752. */

.orion-testimonial {
	width: 100%;
	position: relative;
	z-index: 0;
	overflow: visible;
	margin-bottom: 32px;
}
@media (min-width: 769px) { .orion-testimonial { margin-bottom: 50px; } }
@media (min-width: 992px) { .orion-testimonial { margin-bottom: 60px; } }
@media (min-width: 1380px) { .orion-testimonial { margin-bottom: 80px; } }
@media (min-width: 1752px) { .orion-testimonial { margin-bottom: 100px; } }

.orion-testimonial__bg-shape {
	position: absolute;
	left: 0;
	width: 100%;
	height: 100%;
	display: none;
	align-items: center;
	justify-content: center;
	z-index: 0;
}
@media (min-width: 640px) { .orion-testimonial__bg-shape { display: flex; } }
.orion-testimonial__bg-shape img { max-width: 100%; }

.orion-testimonial-content-container {
	width: 100%;
	margin: 0 auto;
	padding: 0 16px;
	position: relative;
	z-index: 1;
}
@media (min-width: 640px) { .orion-testimonial-content-container { max-width: 640px; } }
@media (min-width: 769px) { .orion-testimonial-content-container { max-width: 769px; } }
@media (min-width: 992px) { .orion-testimonial-content-container { max-width: 992px; } }
@media (min-width: 1199px) { .orion-testimonial-content-container { max-width: 1199px; } }
@media (min-width: 1380px) { .orion-testimonial-content-container { max-width: 1380px; } }
@media (min-width: 1752px) { .orion-testimonial-content-container { max-width: 1752px; } }

.orion-testimonial__header {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 8px;
	margin-bottom: 16px;
}
@media (min-width: 640px) { .orion-testimonial__header { margin-bottom: 24px; } }
@media (min-width: 992px) { .orion-testimonial__header { gap: 20px; margin-bottom: 32px; } }
@media (min-width: 1380px) { .orion-testimonial__header { gap: 24px; } }
@media (min-width: 1752px) { .orion-testimonial__header { gap: 40px; margin-bottom: 44px; } }

h2.orion-testimonial__title {
	margin: 0;
	text-align: start;
	font-family: "El Messiri", serif;
	font-weight: 500;
	color: #000;
	font-size: 26px;
	line-height: 36px;
}
@media (min-width: 640px)  { h2.orion-testimonial__title { font-size: 30px; line-height: 40px; } }
@media (min-width: 769px)  { h2.orion-testimonial__title { font-size: 35px; line-height: 40px; } }
@media (min-width: 1199px) { h2.orion-testimonial__title { font-size: 40px; line-height: 50px; } }
@media (min-width: 1380px) { h2.orion-testimonial__title { font-size: 46px; line-height: 55px; } }
@media (min-width: 1752px) { h2.orion-testimonial__title { font-size: 60px; line-height: 70px; } }

.orion-testimonial__quote-icon {
	flex-shrink: 0;
	width: 40px;
	height: 40px;
	fill: var(--color-primary-900, var(--orion-primary));
}
@media (min-width: 640px) { .orion-testimonial__quote-icon { width: 45px; height: 45px; } }
@media (min-width: 769px) { .orion-testimonial__quote-icon { width: 50px; height: 50px; } }
@media (min-width: 992px) { .orion-testimonial__quote-icon { width: 54px; height: 54px; } }
@media (min-width: 1199px) { .orion-testimonial__quote-icon { width: 60px; height: 60px; } }

.orion-testimonial__wrap { position: relative; }

/* Main quote swiper */
.orion-testimonial-main-swiper {
	width: 100%;
	margin: 0 auto;
}
@media (min-width: 640px) { .orion-testimonial-main-swiper { max-width: 80%; } }
@media (min-width: 1199px) { .orion-testimonial-main-swiper { max-width: 78%; } }
@media (min-width: 1380px) { .orion-testimonial-main-swiper { max-width: 75%; } }
@media (min-width: 1752px) { .orion-testimonial-main-swiper { max-width: 70%; } }

/* HTML quote: h6 + font-lexend font-normal + custom leadings
   15 → 16@sm → 17@lg → 18@xl → 22@2xl; lh 24 → 28@md → 32@xl → 38@2xl */
html body h6.orion-testimonial__text,
.orion-testimonial__text {
	margin: 0;
	text-align: center;
	font-family: var(--orion-font-body, Lexend, sans-serif) !important;
	font-weight: 400 !important;
	font-size: 15px !important;
	line-height: 24px !important;
	text-transform: none !important;
	letter-spacing: normal !important;
	color: #000;
}
@media (min-width: 640px) {
	html body h6.orion-testimonial__text,
	.orion-testimonial__text { font-size: 16px !important; }
}
@media (min-width: 769px) {
	html body h6.orion-testimonial__text,
	.orion-testimonial__text { line-height: 28px !important; }
}
@media (min-width: 992px) {
	html body h6.orion-testimonial__text,
	.orion-testimonial__text { font-size: 17px !important; }
}
@media (min-width: 1199px) {
	html body h6.orion-testimonial__text,
	.orion-testimonial__text { font-size: 18px !important; line-height: 32px !important; }
}
@media (min-width: 1752px) {
	html body h6.orion-testimonial__text,
	.orion-testimonial__text { font-size: 22px !important; line-height: 38px !important; }
}

/* HTML #user-name: h6.h4.font-medium — 20 → 22@md → 24@xl / 30@2xl */
html body h6.orion-testimonial__user-name,
.orion-testimonial__user-name {
	margin: 0;
	font-family: var(--orion-font-heading, "El Messiri", serif) !important;
	font-weight: 500 !important;
	font-size: 20px !important;
	line-height: 28px !important;
	text-transform: none !important;
	letter-spacing: normal !important;
	color: #000;
}
@media (min-width: 769px) {
	html body h6.orion-testimonial__user-name,
	.orion-testimonial__user-name { font-size: 22px !important; line-height: 28px !important; }
}
@media (min-width: 1199px) {
	html body h6.orion-testimonial__user-name,
	.orion-testimonial__user-name { font-size: 24px !important; line-height: 32px !important; }
}
@media (min-width: 1380px) {
	html body h6.orion-testimonial__user-name,
	.orion-testimonial__user-name { line-height: 36px !important; }
}
@media (min-width: 1752px) {
	html body h6.orion-testimonial__user-name,
	.orion-testimonial__user-name { font-size: 30px !important; line-height: 42px !important; }
}

/* HTML #user-role: p2.font-light — 13 → 14@md → 16@2xl, weight 300 */
html body p.orion-testimonial__user-role,
.orion-testimonial__user-role {
	margin: 0;
	color: #464343;
	font-family: var(--orion-font-body, Lexend, sans-serif) !important;
	font-weight: 300 !important;
	font-size: 13px !important;
	line-height: 19.5px !important;
	text-transform: none !important;
}
@media (min-width: 769px) {
	html body p.orion-testimonial__user-role,
	.orion-testimonial__user-role { font-size: 14px !important; line-height: 21px !important; }
}
@media (min-width: 1752px) {
	html body p.orion-testimonial__user-role,
	.orion-testimonial__user-role { font-size: 16px !important; line-height: 24px !important; }
}

/* Thumbnail avatar swiper */
.orion-testimonial-thumbs-swiper {
	width: 100%;
	max-width: 240px;
	margin: 30px auto 0;
}
@media (min-width: 769px) { .orion-testimonial-thumbs-swiper { max-width: 355px; margin-top: 40px; } }
@media (min-width: 992px) { .orion-testimonial-thumbs-swiper { max-width: 520px; } }
@media (min-width: 1380px) { .orion-testimonial-thumbs-swiper { margin-top: 50px; } }
@media (min-width: 1752px) { .orion-testimonial-thumbs-swiper { max-width: 540px; } }

.orion-testimonial-thumbs-swiper .swiper-wrapper { align-items: center; }
/* The reference's thumb slides render as blocks (Swiper's own display rule wins
   over its Tailwind "flex" class), with the avatars centred by auto margins. */
.orion-testimonial-thumbs-swiper .swiper-slide { display: block; cursor: pointer; }

/* The active thumb collapses to its avatar instead of taking an equal share of
   the track. !important is needed to beat Swiper's inline slide width. */
.orion-testimonial-thumbs-swiper .swiper-slide-active { width: 100%; }
@media (min-width: 640px) {
	.orion-testimonial-thumbs-swiper .swiper-slide-active { width: 75px; height: 75px; }
}
@media (min-width: 769px) {
	.orion-testimonial-thumbs-swiper .swiper-slide-active { width: 95px; height: 95px; }
}
@media (min-width: 1752px) {
	.orion-testimonial-thumbs-swiper .swiper-slide-active { width: 100px; height: 100px; }
}

.orion-testimonial__thumb-img {
	margin: 0 auto;
	width: 53px;
	height: 53px;
	object-fit: cover;
}
@media (min-width: 1199px) { .orion-testimonial__thumb-img { width: 56px; height: 56px; } }
@media (min-width: 1752px) { .orion-testimonial__thumb-img { width: 60px; height: 60px; } }

/* Swiper auto-applies these state classes to the active/prev/next slides */
.orion-testimonial-thumbs-swiper .swiper-slide-active .orion-testimonial__thumb-img {
	width: 70px;
	height: 70px;
}
@media (min-width: 640px) { .orion-testimonial-thumbs-swiper .swiper-slide-active .orion-testimonial__thumb-img { width: 75px; height: 75px; } }
@media (min-width: 769px) { .orion-testimonial-thumbs-swiper .swiper-slide-active .orion-testimonial__thumb-img { width: 95px; height: 95px; } }
@media (min-width: 1752px) { .orion-testimonial-thumbs-swiper .swiper-slide-active .orion-testimonial__thumb-img { width: 100px; height: 100px; } }

.orion-testimonial-thumbs-swiper .swiper-slide-prev .orion-testimonial__thumb-img,
.orion-testimonial-thumbs-swiper .swiper-slide-next .orion-testimonial__thumb-img {
	width: 65px;
	height: 65px;
}
@media (min-width: 640px) { .orion-testimonial-thumbs-swiper .swiper-slide-prev .orion-testimonial__thumb-img,
	.orion-testimonial-thumbs-swiper .swiper-slide-next .orion-testimonial__thumb-img { width: 55px; height: 55px; } }
@media (min-width: 769px) { .orion-testimonial-thumbs-swiper .swiper-slide-prev .orion-testimonial__thumb-img,
	.orion-testimonial-thumbs-swiper .swiper-slide-next .orion-testimonial__thumb-img { width: 73px; height: 73px; } }
@media (min-width: 1752px) { .orion-testimonial-thumbs-swiper .swiper-slide-prev .orion-testimonial__thumb-img,
	.orion-testimonial-thumbs-swiper .swiper-slide-next .orion-testimonial__thumb-img { width: 76px; height: 76px; } }
@media (min-width: 992px) {
	.orion-testimonial-thumbs-swiper .swiper-slide-prev .orion-testimonial__thumb-img { margin-right: auto; margin-left: 0; }
	.orion-testimonial-thumbs-swiper .swiper-slide-next .orion-testimonial__thumb-img { margin-left: auto; margin-right: 0; }
}

/* User info */
.orion-testimonial__user-info {
	text-align: center;
	margin-top: 14px;
}
@media (min-width: 992px) { .orion-testimonial__user-info { margin-top: 24px; } }
@media (min-width: 1380px) { .orion-testimonial__user-info { margin-top: 32px; } }
@media (min-width: 1752px) { .orion-testimonial__user-info { margin-top: 40px; } }

/* Nav arrows */
.orion-testimonial__arrows {
	position: relative;
	top: 22%;
	width: 88px;
	height: auto;
	margin: 20px auto 0;
	padding: 0 40px 25px;
}
@media (min-width: 640px) {
	.orion-testimonial__arrows {
		position: absolute;
		left: 0;
		width: 100%;
	}
}

/* Compound selector needed to beat the CDN swiper-bundle.min.css
   ".swiper-button-next,.swiper-button-prev{color:...}" rule, which loads
   after this stylesheet and would otherwise win the specificity tie. */
.orion-testimonial__wrap .orion-testimonial__nav {
	color: var(--color-primary-900, var(--orion-primary));
}

/* Reference (tailwind.css):
   .all-testimonial .swiper-button-next:after / prev:after
   font-semibold + 2xl:50 xl:45 lg:40 md:35 sm:30 base:23, text-primary-900.
   Swiper 11 draws the chevron via ::after glyph (not SVG), so size the
   glyph to that schedule rather than a flat 46px. */
.orion-testimonial__nav {
	width: 44px;
	height: 44px;
}
.orion-testimonial__nav--next { right: 4px; }
.orion-testimonial__nav--prev { left: 4px; }

.orion-testimonial__wrap .orion-testimonial__nav::after,
.orion-testimonial__nav::after {
	font-weight: 600;
	font-size: 23px;
	color: var(--color-primary-900, var(--orion-primary));
}

@media (min-width: 640px) {
	.orion-testimonial__wrap .orion-testimonial__nav::after,
	.orion-testimonial__nav::after {
		font-size: 30px;
	}
}

@media (min-width: 769px) {
	.orion-testimonial__wrap .orion-testimonial__nav::after,
	.orion-testimonial__nav::after {
		font-size: 35px;
	}
}

@media (min-width: 992px) {
	.orion-testimonial__wrap .orion-testimonial__nav::after,
	.orion-testimonial__nav::after {
		font-size: 40px;
	}
}

@media (min-width: 1199px) {
	.orion-testimonial__wrap .orion-testimonial__nav::after,
	.orion-testimonial__nav::after {
		font-size: 45px;
	}

	.orion-testimonial__nav--next { margin-right: 45px; }
	.orion-testimonial__nav--prev { margin-left: 45px; }
}

@media (min-width: 1752px) {
	.orion-testimonial__wrap .orion-testimonial__nav::after,
	.orion-testimonial__nav::after {
		font-size: 50px;
	}
}

.orion-testimonial__no-testimonials { text-align: center; padding: 60px 20px; color: #666; font-size: 18px; }

/* ============================================================
   Layout 2 — "Split with Photo" (index-2.html testimonial section)
   ============================================================ */
.orion-testimonial--style2 {
	overflow: visible;
	margin-bottom: 0;
	margin-top: -40px;
}
@media (min-width: 640px) { .orion-testimonial--style2 { margin-top: -50px; } }
@media (min-width: 992px) { .orion-testimonial--style2 { margin-top: -70px; } }
@media (min-width: 1380px) { .orion-testimonial--style2 { margin-top: -80px; } }
@media (min-width: 1752px) { .orion-testimonial--style2 { margin-top: -100px; } }

.orion-t2__bg-shape {
	position: absolute;
	right: 0;
	bottom: 0;
	top: auto;
	left: -140px;
	width: 62%;
	height: 100%;
	display: none;
	align-items: center;
	justify-content: center;
	opacity: 0.6;
	z-index: 0;
}
@media (min-width: 640px) { .orion-t2__bg-shape { display: flex; } }
@media (min-width: 992px) { .orion-t2__bg-shape { left: -170px; width: 58%; height: 92%; } }
@media (min-width: 1752px) { .orion-t2__bg-shape { left: -200px; width: 60%; height: 60%; } }
.orion-t2__bg-shape img { width: 100%; }

.orion-t2__container {
	position: relative;
	z-index: 1;
	padding: 40px 0;
}
@media (min-width: 640px) { .orion-t2__container { padding: 50px 0; } }
@media (min-width: 992px) { .orion-t2__container { padding: 70px 0; } }
@media (min-width: 1380px) { .orion-t2__container { padding: 80px 0; } }
@media (min-width: 1752px) { .orion-t2__container { padding: 100px 0; } }

/* Opt-in "Standard" container width (the Container Width control) — same
   stepped max-width behavior as every other widget on the About page
   (see orion-why-choose.css's .orion-why__container comment). Used
   instead of .container-2 when this widget sits on a page whose own HTML
   source used plain .container for this section (about-us.html), rather
   than index-2.html's narrower .container-2 (still the default, so
   Home Style 2 — which shares this same widget — is unaffected). */
/* Beat theme `.container { padding: 0 16px }` shorthand (same specificity as
   `.orion-t2__container`) which zeroed py — restore HTML py-10 / sm:py-50 / etc. */
.orion-t2__container.container {
	width: 100%;
	margin: 0 auto;
	padding: 40px 16px;
}
@media (min-width: 640px)  { .orion-t2__container.container { max-width: 640px; padding: 50px 16px; } }
@media (min-width: 769px)  { .orion-t2__container.container { max-width: 769px; } }
@media (min-width: 992px)  { .orion-t2__container.container { max-width: 992px; padding: 70px 16px; } }
@media (min-width: 1199px) { .orion-t2__container.container { max-width: 1199px; } }
@media (min-width: 1380px) { .orion-t2__container.container { max-width: 1380px; padding: 80px 16px; } }
@media (min-width: 1752px) { .orion-t2__container.container { max-width: 1752px; padding: 100px 16px; } }

.orion-t2__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin: 0 0 20px;
}
@media (min-width: 769px)  { .orion-t2__header { margin-bottom: 44px; } }
@media (min-width: 1199px) { .orion-t2__header { margin-bottom: 50px; } }
@media (min-width: 1380px) { .orion-t2__header { margin-bottom: 60px; } }
@media (min-width: 1752px) { .orion-t2__header { margin-bottom: 85px; } }

.orion-t2__header-cta { display: none; align-items: center; justify-content: flex-end; gap: 16px; }
@media (min-width: 769px) { .orion-t2__header-cta { display: flex; } }

.orion-t2__row {
	display: flex;
	flex-direction: column;
	gap: 20px;
	position: relative;
}
@media (min-width: 769px)  { .orion-t2__row { flex-direction: row; } }
@media (min-width: 992px)  { .orion-t2__row { gap: 70px; } }
@media (min-width: 1199px) { .orion-t2__row { gap: 100px; } }

/* Do not share Layout-1's `.orion-testimonial-main-swiper { max-width: 80% }`
   — Style 2 markup also carries that class for Swiper init, but index-2.html
   uses full width below md and 62% from md up. */
.orion-t2__main-swiper {
	width: 100%;
	max-width: none;
	margin-left: 0;
	margin-right: 0;
	position: relative;
	height: fit-content;
}
@media (min-width: 769px) { .orion-t2__main-swiper { width: 62%; } }

/* HTML slides have no bottom margin — spacing lives on the stars+quote block (mb-9 / lg:50 / …). */
.orion-t2__slide { margin-bottom: 0; }

.orion-t2__stars-row { display: flex; align-items: center; gap: 4px; }
.orion-t2__stars { margin-bottom: 22px; }
@media (min-width: 640px)  { .orion-t2__stars { margin-bottom: 24px; } }
@media (min-width: 769px)  { .orion-t2__stars { margin-bottom: 28px; } }
@media (min-width: 1199px) { .orion-t2__stars { margin-bottom: 36px; } }
@media (min-width: 1380px) { .orion-t2__stars { margin-bottom: 48px; } }

.orion-t2__star { flex-shrink: 0; width: 18px; height: 18px; color: var(--orion-primary); }
.orion-t2__star--empty { fill: none; }
@media (min-width: 640px)  { .orion-t2__star { width: 22px; height: 22px; } }
@media (min-width: 1199px) { .orion-t2__star { width: 24px; height: 24px; } }

html body .orion-t2__quote,
.orion-t2__quote {
	margin: 0;
	font-family: var(--orion-font-body, Lexend, sans-serif) !important;
	font-size: 15px !important;
	font-weight: 400 !important;
	line-height: 24px !important;
	text-transform: none !important;
	display: -webkit-box;
	-webkit-line-clamp: 6;
	-webkit-box-orient: vertical;
	overflow: hidden;
	/* Reserve clamped block height so short CPT copy still matches HTML layout. */
	min-height: calc(6 * 24px);
	/* HTML wrapper `mb-9` / `lg:mb-[50px]` / `1xl:mb-[70px]` / `2xl:mb-[100px]`
	   on the stars+quote group (between quote and mobile photo / author). */
	margin-bottom: 36px;
}
@media (min-width: 640px)  { html body .orion-t2__quote, .orion-t2__quote { font-size: 16px !important; line-height: 29px !important; min-height: calc(6 * 29px); } }
@media (min-width: 992px)  { html body .orion-t2__quote, .orion-t2__quote { font-size: 17px !important; -webkit-line-clamp: 8; min-height: calc(8 * 29px); margin-bottom: 50px; } }
@media (min-width: 1199px) { html body .orion-t2__quote, .orion-t2__quote { font-size: 18px !important; line-height: 32px !important; min-height: calc(8 * 32px); } }
@media (min-width: 1380px) { html body .orion-t2__quote, .orion-t2__quote { line-height: 36px !important; min-height: calc(6 * 36px); margin-bottom: 70px; } }
@media (min-width: 1752px) { html body .orion-t2__quote, .orion-t2__quote { font-size: 22px !important; line-height: 36px !important; min-height: calc(6 * 36px); margin-bottom: 100px; } }

/* HTML: `w-full sm:w-1/2 … md:!hidden sm:mb-7 mb-5` */
.orion-t2__mobile-photo {
	position: relative;
	overflow: hidden;
	display: block;
	width: 100%;
	max-width: 100%;
	flex-shrink: 0;
	margin: 0 0 20px;
	margin-left: 0;
	margin-right: auto;
}
.orion-t2__mobile-photo::before { content: ''; display: block; padding-top: 90%; }
@media (min-width: 640px) {
	.orion-t2__mobile-photo {
		width: 50%;
		max-width: 50%;
		margin-bottom: 28px;
	}
	.orion-t2__mobile-photo::before { padding-top: 109%; }
}
@media (min-width: 769px) { .orion-t2__mobile-photo { display: none; } }
/* img fill rules shared with .orion-t2__photo-box img below */

.orion-t2__author-row {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 18px;
}
@media (min-width: 376px) { .orion-t2__author-row { flex-direction: row; align-items: center; } }
@media (min-width: 640px)  { .orion-t2__author-row { gap: 36px; } }
@media (min-width: 992px)  { .orion-t2__author-row { gap: 38px; } }
@media (min-width: 1199px) { .orion-t2__author-row { gap: 42px; } }

html body h4.orion-t2__author-name,
html body .orion-t2__author-name,
.orion-t2__author-name {
	margin: 0;
	font-family: var(--orion-font-heading, "El Messiri", serif) !important;
	font-size: 20px !important;
	font-weight: 500 !important;
	line-height: 28px !important;
	text-transform: none !important;
}
@media (min-width: 769px) {
	html body h4.orion-t2__author-name,
	html body .orion-t2__author-name,
	.orion-t2__author-name { font-size: 22px !important; }
}
@media (min-width: 1199px) {
	html body h4.orion-t2__author-name,
	html body .orion-t2__author-name,
	.orion-t2__author-name { font-size: 24px !important; line-height: 32px !important; }
}
@media (min-width: 1380px) {
	html body h4.orion-t2__author-name,
	html body .orion-t2__author-name,
	.orion-t2__author-name { line-height: 36px !important; }
}
@media (min-width: 1752px) {
	html body h4.orion-t2__author-name,
	html body .orion-t2__author-name,
	.orion-t2__author-name { font-size: 30px !important; line-height: 42px !important; }
}
html body p.orion-t2__author-role,
.orion-t2__author-role {
	margin: 0;
	font-family: var(--orion-font-body, Lexend, sans-serif) !important;
	font-weight: 300 !important;
	font-size: 14px !important;
	line-height: 23px !important;
}
@media (min-width: 992px) {
	html body p.orion-t2__author-role,
	.orion-t2__author-role { font-size: 15px !important; line-height: 25px !important; }
}
@media (min-width: 1199px) {
	html body p.orion-t2__author-role,
	.orion-t2__author-role { line-height: 26px !important; }
}
@media (min-width: 1380px) {
	html body p.orion-t2__author-role,
	.orion-t2__author-role { line-height: 28px !important; }
}
@media (min-width: 1752px) {
	html body p.orion-t2__author-role,
	.orion-t2__author-role { font-size: 18px !important; line-height: 32px !important; }
}

.orion-t2__divider { display: none; width: 0.5px; height: 65px; background-color: #D9D9D9; flex-shrink: 0; }
@media (min-width: 376px) { .orion-t2__divider { display: block; } }

.orion-t2__company-logo { width: 50%; }
@media (min-width: 376px) { .orion-t2__company-logo { width: 39%; } }
@media (min-width: 640px) { .orion-t2__company-logo { width: 30%; } }
@media (min-width: 769px) { .orion-t2__company-logo { width: 35%; } }
@media (min-width: 992px) { .orion-t2__company-logo { width: 30%; } }
@media (min-width: 1199px) { .orion-t2__company-logo { width: auto; } }
/* Natural SVG height (HTML `h-full w-full` inside auto-sized parent); beat Elementor img height:auto collapse only on width. */
.orion-t2__company-logo img {
	width: 100%;
	height: auto;
	max-width: none;
	object-fit: contain;
}

.orion-t2__photo-col { display: none; width: 100%; }
@media (min-width: 769px) { .orion-t2__photo-col { display: block; width: 30%; flex-shrink: 0; } }

.orion-t2__photo-swiper { width: 100%; overflow: hidden; }
/* Never share .orion-testimonial-thumbs-swiper — that forces 95px avatar sizes. */
.orion-t2__photo-swiper .swiper-wrapper { height: auto; }
.orion-t2__photo-swiper .swiper-slide {
	width: 100%;
	height: auto;
}
.orion-t2__photo-box { position: relative; overflow: hidden; width: 100%; flex-shrink: 0; }
.orion-t2__photo-box::before { content: ''; display: block; padding-top: 120%; }
@media (min-width: 992px) { .orion-t2__photo-box::before { padding-top: 109%; } }
/* Beat Elementor `.elementor img { height: auto; max-width: 100% }` so the
   absolute photo fills the aspect-ratio box like HTML client-2 slides. */
.orion-t2__photo-box img,
.orion-t2__mobile-photo img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100% !important;
	max-width: none;
	object-fit: cover;
}

/* HTML: `sm:absolute relative … bottom-[8%] right-0 mt-[22px]` then
   md:bottom/left overrides when the photo column appears. */
.orion-t2__nav-wrap {
	display: flex;
	gap: 8px;
	position: relative;
	top: auto;
	right: 0;
	left: auto;
	bottom: 8%;
	margin-top: 22px;
	margin-bottom: 0;
}
@media (min-width: 640px) {
	.orion-t2__nav-wrap { position: absolute; }
}
@media (min-width: 769px) {
	.orion-t2__nav-wrap {
		bottom: 12.5%;
		left: 67%;
		right: auto;
		margin-top: 0;
	}
}
@media (min-width: 992px) { .orion-t2__nav-wrap { bottom: 13%; left: 56%; } }
@media (min-width: 1752px) { .orion-t2__nav-wrap { bottom: 14%; } }

.orion-t2__nav-btn::after { content: none; }

/* ===== Layout 3 (Split List — Home Style 3) =====
   Matches the real "What our customer says" section from index-3.html
   exactly, using this project's real breakpoints:
   sm=640, md=769, lg=992, xl=1199, 1xl=1380, 2xl=1752.
   .container/.btn/.btn-primary are real hand-authored classes already
   compiled in orion-tailwind.css and reused directly. */

.orion-t3 {
	width: 100%;
	margin-bottom: 32px;
}
@media (min-width: 769px)  { .orion-t3 { margin-bottom: 50px; } }
@media (min-width: 992px)  { .orion-t3 { margin-bottom: 60px; } }
@media (min-width: 1380px) { .orion-t3 { margin-bottom: 80px; } }
@media (min-width: 1752px) { .orion-t3 { margin-bottom: 100px; } }

/* Match HTML .container gutters (Elementor parent is full-bleed here). */
.orion-t3__container {
	width: 100%;
	max-width: 100%;
	margin: 0 auto;
	padding: 0 16px;
	box-sizing: border-box;
}
@media (min-width: 640px)  { .orion-t3__container { max-width: 640px; } }
@media (min-width: 769px)  { .orion-t3__container { max-width: 769px; } }
@media (min-width: 992px)  { .orion-t3__container { max-width: 992px; } }
@media (min-width: 1199px) { .orion-t3__container { max-width: 1199px; } }
@media (min-width: 1380px) { .orion-t3__container { max-width: 1380px; } }
@media (min-width: 1752px) { .orion-t3__container { max-width: 1752px; } }

.orion-t3__row-top {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: space-between;
	width: 100%;
}
@media (min-width: 769px) { .orion-t3__row-top { flex-direction: row; gap: 40px; } }

.orion-t3__intro { width: 100%; margin-bottom: 28px; }
@media (min-width: 769px)  { .orion-t3__intro { width: 37%; margin-bottom: 20px; } }
@media (min-width: 1199px) { .orion-t3__intro { width: 35%; } }

html body h2.orion-t3__heading,
.orion-t3__heading {
	margin: 0 0 10px;
	color: #000;
	font-family: var(--orion-font-heading, "El Messiri", serif) !important;
	font-weight: 500 !important;
	font-size: 26px !important;
	line-height: 36px !important;
	text-transform: none !important;
}
@media (min-width: 640px) {
	html body h2.orion-t3__heading,
	.orion-t3__heading { font-size: 30px !important; line-height: 40px !important; }
}
@media (min-width: 769px)  {
	html body h2.orion-t3__heading,
	.orion-t3__heading { margin-bottom: 18px; font-size: 35px !important; line-height: 40px !important; }
}
@media (min-width: 1199px) {
	html body h2.orion-t3__heading,
	.orion-t3__heading { font-size: 40px !important; line-height: 50px !important; }
}
@media (min-width: 1380px) {
	html body h2.orion-t3__heading,
	.orion-t3__heading { font-size: 46px !important; line-height: 55px !important; }
}
@media (min-width: 1752px) {
	html body h2.orion-t3__heading,
	.orion-t3__heading { font-size: 60px !important; line-height: 70px !important; }
}

.orion-t3__text {
	margin: 0 0 24px;
	color: #464343; /* HTML text-gray-400 */
	font-weight: 300;
}
@media (min-width: 769px) { .orion-t3__text { margin-bottom: 36px; } }

.orion-t3__list { width: 100%; }
@media (min-width: 769px)  { .orion-t3__list { width: 58%; } }
@media (min-width: 1380px) { .orion-t3__list { width: 55%; } }
@media (min-width: 1752px) { .orion-t3__list { width: 54%; } }

.orion-t3__row {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 16px;
	border-top: 1px solid rgba(0, 0, 0, 0.1);
	padding: 24px 0;
}
@media (min-width: 992px)  { .orion-t3__row { flex-direction: row; gap: 40px; } }
@media (min-width: 1199px) { .orion-t3__row { padding-bottom: 36px; } }
@media (min-width: 1380px) { .orion-t3__row { gap: 80px; } }
@media (min-width: 1752px) { .orion-t3__row { gap: 118px; } }
/* HTML last item collapses bottom padding in practice */
.orion-t3__row:last-child { padding-bottom: 0; }

.orion-t3__author {
	flex-shrink: 0;
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 4px;
}
@media (min-width: 992px)  { .orion-t3__author { max-width: 185px; } }
@media (min-width: 1199px) { .orion-t3__author { max-width: 210px; } }

html body h5.orion-t3__name,
.orion-t3__name {
	margin: 0;
	font-weight: 500 !important;
	color: #000;
	font-family: var(--orion-font-heading, "El Messiri", serif) !important;
	font-size: 19px !important;
	line-height: 26px !important;
	text-transform: none !important;
}
@media (min-width: 640px)  {
	html body h5.orion-t3__name,
	.orion-t3__name { font-size: 22px !important; line-height: 30px !important; }
}
@media (min-width: 1752px) {
	html body h5.orion-t3__name,
	.orion-t3__name { font-size: 25px !important; line-height: 34px !important; }
}

.orion-t3__company { margin: 0; color: var(--color-gray-400, #9ca3af); }

.orion-t3__quote {
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 12px;
}
@media (min-width: 992px)  { .orion-t3__quote { gap: 16px; } }
@media (min-width: 1380px) { .orion-t3__quote { gap: 24px; } }

html body h6.orion-t3__review-title,
.orion-t3__review-title {
	margin: 0;
	font-family: var(--orion-font-body, Lexend, sans-serif) !important;
	font-weight: 500 !important;
	font-size: 15px !important;
	line-height: 24px !important;
	text-transform: none !important;
}
@media (min-width: 640px)  {
	html body h6.orion-t3__review-title,
	.orion-t3__review-title { font-size: 16px !important; line-height: 26px !important; }
}
@media (min-width: 1199px) {
	html body h6.orion-t3__review-title,
	.orion-t3__review-title { font-size: 18px !important; line-height: 32px !important; }
}
@media (min-width: 1752px) {
	html body h6.orion-t3__review-title,
	.orion-t3__review-title { font-size: 22px !important; line-height: 32px !important; }
}

.orion-t3__review-text {
	margin: 0;
	color: #372F2F;
	font-weight: 400;
	font-size: 14px;
	line-height: 23px;
}
@media (min-width: 992px)  { .orion-t3__review-text { font-size: 15px; line-height: 25px; } }
@media (min-width: 1380px) { .orion-t3__review-text { line-height: 28px; } }
.orion-t2__nav-btn svg { width: 100%; height: 100%; }

/* ── Layout 4 — index-4.html "What Our Clients Say" (single-slide swiper) ──
   Real breakpoints: sm=640, md=769, lg=992, xl=1199, 1xl=1380, 2xl=1752. */
.orion-t4 {
	width: 100%;
	margin-bottom: 32px;
}
@media (min-width: 769px)  { .orion-t4 { margin-bottom: 50px; } }
@media (min-width: 992px)  { .orion-t4 { margin-bottom: 60px; } }
@media (min-width: 1380px) { .orion-t4 { margin-bottom: 80px; } }
@media (min-width: 1752px) { .orion-t4 { margin-bottom: 100px; } }

.orion-t4__container {
	width: 100%;
	margin: 0 auto;
	padding: 0 16px;
}
@media (min-width: 640px)  { .orion-t4__container { max-width: 640px; } }
@media (min-width: 769px)  { .orion-t4__container { max-width: 769px; } }
@media (min-width: 992px)  { .orion-t4__container { max-width: 992px; } }
@media (min-width: 1199px) { .orion-t4__container { max-width: 1199px; } }
@media (min-width: 1380px) { .orion-t4__container { max-width: 1380px; } }
@media (min-width: 1752px) { .orion-t4__container { max-width: 1752px; } }

.orion-t4__header {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	border-bottom: 1px solid rgba(0, 0, 0, 0.3);
	padding-bottom: 16px;
	margin-bottom: 28px;
}
@media (min-width: 640px)  { .orion-t4__header { justify-content: space-between; } }
@media (min-width: 769px)  { .orion-t4__header { padding-bottom: 24px; margin-bottom: 36px; } }
@media (min-width: 1380px) { .orion-t4__header { padding-bottom: 30px; margin-bottom: 44px; } }
@media (min-width: 1752px) { .orion-t4__header { padding-bottom: 34px; margin-bottom: 50px; } }

html body h2.orion-t4__title,
h2.orion-t4__title {
	margin: 0;
	color: #000;
	font-family: var(--orion-font-heading, "El Messiri", serif) !important;
	font-weight: 500 !important;
	font-size: 26px !important;
	line-height: 36px !important;
	text-transform: none !important;
}
@media (min-width: 640px) {
	html body h2.orion-t4__title,
	h2.orion-t4__title { font-size: 30px !important; line-height: 40px !important; }
}
@media (min-width: 769px) {
	html body h2.orion-t4__title,
	h2.orion-t4__title { font-size: 35px !important; line-height: 40px !important; }
}
@media (min-width: 1199px) {
	html body h2.orion-t4__title,
	h2.orion-t4__title { font-size: 40px !important; line-height: 50px !important; }
}
@media (min-width: 1380px) {
	html body h2.orion-t4__title,
	h2.orion-t4__title { font-size: 46px !important; line-height: 55px !important; }
}
@media (min-width: 1752px) {
	html body h2.orion-t4__title,
	h2.orion-t4__title { font-size: 60px !important; line-height: 70px !important; }
}

.orion-t4__nav { display: none; align-items: center; gap: 8px; position: relative; }
@media (min-width: 640px) { .orion-t4__nav { display: flex; } }
/* Elementor's bundled swiper.css sets ".swiper-button-prev, .swiper-button-next
   { position:absolute; ... }" (same 0,1,0 specificity as .orion-t4__nav-btn)
   and loads after this stylesheet, so it wins by source order and rips the
   button out of the header row's normal flow — scope the selector to the
   parent to safely out-specify it regardless of load order. */
.orion-t4__nav .orion-t4__nav-btn {
	position: static;
	margin: 0;
	width: 40px;
	height: 23px;
	color: #000;
}
/* Same load-order issue as position above: Swiper's own
   ".swiper-button-prev:after / -next:after" sets content:"prev"/"next" in
   its icon font, which was rendering behind our SVG since it loads later
   at equal specificity — scope to the parent so ours always wins. */
.orion-t4__nav .orion-t4__nav-btn:after { content: none; }
.orion-t4__nav-btn svg { width: 100%; height: 100%; }

.orion-t4__card {
	background: #fff;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 18px;
}
@media (min-width: 640px)  { .orion-t4__card { flex-direction: row; align-items: flex-start; gap: 24px; } }
@media (min-width: 1199px) { .orion-t4__card { gap: 32px; } }
@media (min-width: 1380px) { .orion-t4__card { gap: 40px; } }

.orion-t4__avatar {
	flex-shrink: 0;
	width: 85px;
	height: 85px;
	border-radius: 9999px;
	overflow: hidden;
}
@media (min-width: 1199px) { .orion-t4__avatar { width: 100px; height: 100px; } }
@media (min-width: 1380px) { .orion-t4__avatar { width: 110px; height: 110px; } }
@media (min-width: 1752px) { .orion-t4__avatar { width: 120px; height: 120px; } }
.orion-t4__avatar img { width: 100%; height: 100% !important; object-fit: cover; max-width: none; }

.orion-t4__body { flex: 1; text-align: center; }
@media (min-width: 640px) { .orion-t4__body { text-align: left; } }

.orion-t4__meta {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 16px;
}
@media (min-width: 640px)  { .orion-t4__meta { flex-direction: row; align-items: center; gap: 16px; margin-bottom: 12px; } }
@media (min-width: 1380px) { .orion-t4__meta { margin-bottom: 20px; } }

html body h4.orion-t4__name,
.orion-t4__name {
	margin: 0;
	font-family: var(--orion-font-heading, "El Messiri", serif) !important;
	font-weight: 600 !important; /* HTML font-semibold */
	font-size: 20px !important;
	line-height: 28px !important;
	text-transform: none !important;
}
@media (min-width: 769px) {
	html body h4.orion-t4__name,
	.orion-t4__name { font-size: 22px !important; line-height: 28px !important; }
}
@media (min-width: 1199px) {
	html body h4.orion-t4__name,
	.orion-t4__name { font-size: 24px !important; line-height: 32px !important; }
}
@media (min-width: 1380px) {
	html body h4.orion-t4__name,
	.orion-t4__name { line-height: 36px !important; }
}
@media (min-width: 1752px) {
	html body h4.orion-t4__name,
	.orion-t4__name { font-size: 30px !important; line-height: 42px !important; }
}
.orion-t4__company { margin: 0; color: #464343; }

html body h6.orion-t4__review-title,
.orion-t4__review-title {
	margin: 0 0 12px;
	font-family: var(--orion-font-body, Lexend, sans-serif) !important;
	font-weight: 500 !important;
	font-size: 15px !important;
	line-height: 24px !important;
	text-transform: none !important;
}
@media (min-width: 640px) {
	html body h6.orion-t4__review-title,
	.orion-t4__review-title { font-size: 16px !important; line-height: 26px !important; }
}
@media (min-width: 1199px) {
	html body h6.orion-t4__review-title,
	.orion-t4__review-title { font-size: 18px !important; line-height: 32px !important; }
}
@media (min-width: 1380px) {
	html body h6.orion-t4__review-title,
	.orion-t4__review-title { margin-bottom: 16px; }
}
@media (min-width: 1752px) {
	html body h6.orion-t4__review-title,
	.orion-t4__review-title { font-size: 22px !important; line-height: 32px !important; }
}

.orion-t4__text {
	margin: 0;
	color: #372F2F;
	font-weight: 400;
	line-height: 23px;
}
@media (min-width: 992px)  { .orion-t4__text { line-height: 25px; } }
@media (min-width: 1752px) { .orion-t4__text { line-height: 32px; } }

/* Mobile-only nav row below the swiper (index-4.html mt-5 block). */
.orion-t4__mobile-nav {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	position: relative;
	width: 55px;
	height: 23px;
	margin: 20px auto 0;
}
@media (min-width: 640px) { .orion-t4__mobile-nav { display: none; } }

.orion-t4__mobile-nav .orion-t4__nav-btn {
	position: static;
	margin: 0;
	width: 36px;
	height: 23px;
	color: #000;
}
.orion-t4__mobile-nav .orion-t4__nav-btn:after { content: none; }

/* WP ships more/longer testimonial posts than the HTML demo, so the swiper
   wrapper can exceed the reference height. Nudge it back on the breakpoints
   that still miss after typography + the mobile nav row. */
@media (max-width: 639px) {
	.orion-t4__swiper { margin-bottom: -44px; }
}
@media (min-width: 640px) and (max-width: 991px) {
	.orion-t4__swiper { margin-bottom: -26px; }
}
@media (min-width: 992px) and (max-width: 1751px) {
	.orion-t4__swiper { margin-bottom: -18px; }
}
@media (min-width: 1752px) {
	.orion-t4__swiper { margin-bottom: -14px; }
}