/* ── shared blocks used by more than one page (Alex rule 4b · DRY) ─── */
/* ── about ────────────────────────────────────────────────────── */
.ab{padding-block:99px 0}
.ab__box{position:relative;display:grid;grid-template-columns:715fr 723fr;gap:0;align-items:start;background:rgba(214,187,185,.6);border-radius:20px;padding:82px 62px 0 0}
.ab__logo{position:absolute;left:103px;top:95px;width:85px;height:732px}
.ab__logo img{width:100%;height:100%}
.ab__media{position:absolute;left:241px;top:95px;width:412px;height:732px;border-radius:10px}
.ab__play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:2;width:105px;height:105px;border-radius:50%;background:rgba(37,37,37,.2);border:2.75px solid var(--white);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;color:var(--white)}
.ab__play svg{width:43px;height:54px}
.ab__play:hover{background:rgba(37,37,37,.45)}
.ab__content{grid-column:1;padding-bottom:100px}
.ab__title{font-size:clamp(30px,3.65vw,70px);line-height:1.086;max-width:620px;margin-inline-start:auto;margin-right:11px}
.ab__list{margin-top:35px;display:flex;flex-direction:column;gap:14px}
.ab__item{direction:ltr;display:grid;grid-template-columns:1fr 110px;gap:29px;align-items:start;min-height:122px}
.ab__txt{direction:rtl}
.ab__name{font-size:22px;line-height:34px;font-weight:700;color:var(--navy)}
.ab__desc{margin-top:4px;padding-left:43px;font-size:22px;line-height:28px;color:var(--navy)}
.ab__ico{width:110px;height:110px;border-radius:50%;background:var(--blush);display:flex;align-items:center;justify-content:center}
.ab__ico img{width:82px;height:82px;object-fit:contain;mix-blend-mode:multiply}
.ab__foot{position:relative;direction:ltr;margin-top:47px;padding-bottom:47px;border-bottom:1px solid var(--blush);display:grid;grid-template-columns:413fr 1012fr;gap:75px;align-items:end}
.ab__quote{direction:rtl;grid-column:2;font-size:clamp(18px,1.56vw,30px);line-height:1.2;color:var(--navy)}
.ab__quote b{font-weight:700}
.ab__btns{grid-column:1;grid-row:1;display:flex;justify-content:flex-start;gap:12px}
/* the row stays LTR so the button order matches Figma — but each button is RTL inside
   (otherwise the ↖ arrow flips to the right of the label) */
.ab__btns .btn{direction:rtl}

@media(max-width:1400px){
	.ab__box{grid-template-columns:1fr}
	.ab__logo{display:none}
	.ab__media{position:relative;left:auto;top:auto;width:auto;height:420px;margin:0 40px 40px;grid-row:1}
	.ab__content{padding-inline:40px}
}
@media(max-width:1023px){
	/* Figma 118:1742 — title, then centred icon+title+copy for each item, image last */
	.ab{padding-block:48px 0}
	.ab__box{display:flex;flex-direction:column;padding:29px 22px 26px;border-radius:14px}
	.ab__content{order:1;padding:0}
	.ab__media{order:2;position:relative;left:auto;top:auto;width:100%;height:280px;margin:26px 0 0}
	.ab__play{width:72px;height:72px}
	.ab__play svg{width:28px;height:34px}
	.ab__title{font-size:36px;line-height:1.11;text-align:center;max-width:none;margin:0}
	.ab__list{margin-top:24px;gap:26px}
	.ab__item{direction:rtl;display:flex;flex-direction:column-reverse;gap:13px;text-align:center;min-height:0}
	.ab__ico{width:70px;height:70px;margin:0 auto}
	.ab__ico img{width:52px;height:52px}
	.ab__name{font-size:22px;line-height:34px}
	.ab__desc{font-size:18px;line-height:24px;padding:0;text-align:center}
	.ab__foot{grid-template-columns:1fr;gap:22px;margin-top:26px;padding-bottom:26px}
	.ab__quote{grid-column:1;font-size:17px}
	.ab__btns{grid-row:auto;grid-column:1;justify-content:flex-start}
	.ab__btns .btn{flex:1 1 46%;height:48px;font-size:16px}
}

/* ── process (about layout, white variant) ────────────────────── */
.ab--process{padding-block:74px 0}
.ab--process .ab__box{background:var(--white);box-shadow:0 0 40px rgba(10,53,107,.1);padding-top:88px}
.ab--process .ab__title{font-size:clamp(30px,3.65vw,70px);line-height:76px;max-width:620px}
.ab__sub{margin-top:18px;font-size:clamp(16px,1.25vw,24px);line-height:30px;color:var(--navy)}
.ab--process .ab__sub{margin-inline-start:auto;max-width:661px}
.ab__sub b{font-weight:700}
.ab--process .ab__list{margin-top:42px;gap:34px}
.ab--process .ab__item{min-height:110px}
.ab--process .ab__name{font-size:clamp(20px,1.67vw,32px);line-height:34px;font-weight:500}
.ab--process .ab__ico{background:var(--blush-2)}
.ab--process .ab__content{padding-bottom:100px}
@media(max-width:1023px){
	.ab--process{padding-block:44px 0}
	.ab--process .ab__box{padding-top:34px}
	.ab--process .ab__name{font-size:19px;line-height:26px}
	.ab__sub{font-size:15px;line-height:24px}
	.ab--process .ab__list{gap:18px}
}

/* ── team ─────────────────────────────────────────────────────── */
.team{padding-block:107px 0}
.team__head .title{font-size:clamp(30px,3.65vw,70px);line-height:1;letter-spacing:0}
.team__head .sub{margin-top:33px;max-width:990px;font-size:clamp(15px,1.25vw,24px);line-height:1.31}
.team__wrap{position:relative;margin-top:53px;max-width:1848px;margin-inline:auto;padding-inline:20px;overflow:hidden}
/* fixed height = the big card, so the row never collapses mid-transition */
.team__row{display:flex;align-items:flex-end;justify-content:center;gap:40px;min-height:636px}
.team__nav{position:absolute;top:50%;transform:translateY(-50%);z-index:5;width:62px;height:62px}
.team__nav svg{width:22px;height:22px}
.team__nav--prev{right:calc(50% + 188px)}
.team__nav--next{left:calc(50% + 188px)}
.tcard{position:relative;flex:none;width:clamp(240px,16.25vw,312px);height:451px;border-radius:10px;background:var(--navy);margin-top:117px;color:var(--white);transition:height .35s,margin .35s,width .35s}
.tcard__img{position:absolute;inset-block-start:-49px;inset-inline:0;height:413px;border-radius:10px;transition:height .35s,inset-block-start .35s}
.tcard__body{position:absolute;inset-inline:0;inset-block-start:284px;padding:0 20px;text-align:center;z-index:2;transition:inset-block-start .35s}
.tcard__body::before{content:"";position:absolute;inset-inline:0;inset-block-end:0;height:190px;background:linear-gradient(180deg,rgba(28,53,85,0) 0%,var(--navy) 65%,var(--navy) 100%),linear-gradient(180deg,rgba(28,53,85,0) 0%,var(--navy) 100%);z-index:-1}
.tcard__name{font-size:32px;line-height:1.1;font-weight:400;transition:font-size .35s}
.tcard__role{margin-top:16px;font-size:20px;line-height:26px;transition:font-size .35s,margin-top .35s}
/* the centered slide is the big one — grows/shrinks on every navigation */
.tcard.is-lead{position:relative;z-index:2;width:clamp(330px,22.92vw,440px);height:636px;margin-top:0}
.tcard.is-lead .tcard__img{inset-block-start:0;height:540px}
.tcard.is-lead .tcard__body{inset-block-start:460px}
.tcard.is-lead .tcard__name{font-size:40px}
.tcard.is-lead .tcard__role{margin-top:18px;font-size:22px;line-height:30px}
.team__cta{margin-top:47px;text-align:center}


@media(max-width:1023px){
	.team{padding-block:44px 0}
	.team__head .sub{margin-top:14px;font-size:15px;line-height:23px}
	.team__wrap{margin-top:30px}
	.team__row{gap:12px;min-height:420px}
	.team__nav{width:42px;height:42px}
	.team__nav--prev{right:auto;left:4px}
	.team__nav--next{left:auto;right:4px}
	.tcard,.tcard.is-lead{height:420px;margin-top:0;width:78vw;margin-inline:0}
	.tcard__img,.tcard.is-lead .tcard__img{inset-block-start:0;height:380px}
	.tcard__body,.tcard.is-lead .tcard__body{inset-block-start:250px}
	.tcard__name,.tcard.is-lead .tcard__name{font-size:24px}
	.tcard__role,.tcard.is-lead .tcard__role{font-size:16px;line-height:22px;margin-top:10px}
}

/* ── video testimonials ───────────────────────────────────────── */
.vid{padding-block:60px 0}
.vid__head .title{font-size:clamp(32px,3.65vw,70px);line-height:1.2;letter-spacing:-.52px}
.vid__head .sub{max-width:1245px;font-size:clamp(15px,1.15vw,22px);line-height:1.45}
.vid__wrap{margin-top:44px;position:relative;max-width:none;padding-inline:0}
/* the peeking cards fade out to white toward the edges (Figma) */
.vid__wrap::before,.vid__wrap::after{content:"";position:absolute;inset-block:0;z-index:4;pointer-events:none;
	width:max(0px,calc(50vw - 750px))}
.vid__wrap::before{left:0;background:linear-gradient(to left,rgba(255,255,255,0) 0%,rgba(255,255,255,.8) 50%,rgba(255,255,255,.96) 100%)}
.vid__wrap::after{right:0;background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,.8) 50%,rgba(255,255,255,.96) 100%)}
/* Figma 45:1196/45:1200 — 62px circles centred on the container edges */
.vid__wrap .owl-nav .rnd{width:62px;height:62px}
.vid__wrap .owl-nav .rnd svg{width:24px;height:24px}

.vcard{position:relative;width:clamp(280px,25vw,481px);height:734px;border-radius:10px;overflow:hidden;border:1px solid #e2ecf5;color:var(--white)}
.vcard__img{position:absolute;inset:0}
/* Figma stacks the gradient twice (45:1111+45:1112 / 98:4584+98:4585) — same here */
.vcard::after{content:"";position:absolute;inset-inline:0;inset-block-end:0;height:53%;background:linear-gradient(180deg,rgba(10,53,107,0) 0%,#0a356b 100%),linear-gradient(180deg,rgba(10,53,107,0) 0%,#0a356b 100%);z-index:1}
.vcard__play{position:absolute;left:50%;top:256px;transform:translateX(-50%);z-index:3;width:113px;height:113px;border-radius:50%;background:rgba(37,37,37,.2);border:2px solid var(--white);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;color:var(--white)}
.vcard__play svg{width:76px;height:76px}
.vcard__play:hover{background:rgba(37,37,37,.5)}
.vcard__body{position:absolute;inset-inline:0;inset-block-end:0;z-index:2;padding:0 29px 43px}
.vcard .vcard__body p{color:var(--white)}
.vcard__quote{position:relative;font-size:clamp(18px,1.56vw,30px);line-height:38px;font-weight:700}
/* Figma 45:1120 — the “ floats above the first line, not on it */
.vcard__q{position:absolute;right:0;top:-35px;font-size:42px;line-height:40px}
.vcard__meta{margin-top:11px;display:flex;align-items:center;gap:8px;font-size:24px;line-height:30px}
.vcard__meta b{font-weight:700}
.vcard__dot{width:8px;height:8px;border-radius:50%;background:var(--blush)}
.vcard__tag{margin-top:23px;display:flex;align-items:center;justify-content:center;gap:10px;height:50px;border-radius:4px;background:var(--blush);color:var(--navy-2);font-size:23px;font-weight:700}
.vcard__tag svg{width:22px;height:22px;flex:none}

/* owl nav — shared for home sliders */
.vid__wrap .owl-nav,.ba__wrap .owl-nav,.team__wrap .owl-nav{position:absolute;inset:0;z-index:5;pointer-events:none}
.vid__wrap .owl-nav button,.ba__wrap .owl-nav button,.team__wrap .owl-nav button{position:absolute;top:50%;transform:translateY(-50%);pointer-events:auto;background:none!important;margin:0!important;padding:0!important}
.vid__wrap .owl-prev{right:max(12px,calc(50vw - 781px + min(481px,25vw)))}
.vid__wrap .owl-next{left:max(12px,calc(50vw - 781px + min(481px,25vw)))}
.owl-nav .rnd svg{width:17px;height:17px}
.owl-nav button .rnd{display:flex}
.owl-carousel .owl-nav button.owl-prev:hover,.owl-carousel .owl-nav button.owl-next:hover{background:none}
@media(max-width:1023px){
	/* mobile uses the swipe indicator instead of arrows (Figma 118:1742) */
	.vid__wrap .owl-nav,.ba__wrap .owl-nav{display:none}
}

@media(max-width:1400px){
	.vcard{height:620px}
	.vcard__body{padding:0 20px 30px}
	.vcard__play{top:270px;width:88px;height:88px}
	.vcard__play svg{width:56px;height:56px}
}
@media(max-width:1023px){
	.vid{padding-block:44px 0}
	.vid__head .sub{font-size:15px;line-height:23px}
	.vcard{height:520px}
	.vcard__play{top:190px;width:72px;height:72px}
	.vcard__play svg{width:44px;height:44px}
	.vcard__body{padding:0 18px 24px}
	.vcard__quote{font-size:18px;line-height:26px}
	.vcard__q{font-size:30px;top:-26px}
	.vcard__meta{font-size:17px}
	.vcard__tag{height:42px;font-size:16px}
}

/* ── google reviews ───────────────────────────────────────────── */
.rev{padding-block:65px 0}
.rev__row{display:grid;grid-template-columns:276px 1fr;gap:35px;align-items:stretch}
.rev__slider-wrap{min-width:0}
.rcard{position:relative;height:403px;border-radius:6px;background:rgba(230,214,213,.3);padding:25px 24px 27px;display:flex;flex-direction:column}
.rcard__top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.rcard__stars{display:flex;gap:5.7px;color:var(--navy)}
.rcard__stars svg{width:21px;height:21px}
.rcard__top>svg{width:19px;height:20px;flex:none}
/* scrollable quote — custom always-visible track + navy thumb (Figma 45:1348/45:1349) */
.rcard__scroll{position:relative;flex:1;min-height:0;margin-top:16px;padding-inline-start:22px}
.rcard__scroll::before{content:"";position:absolute;left:0;top:0;width:3px;height:100%;border-radius:8px;background:#f3f3f3}
.rcard__scroll.is-scrollable::before{background:var(--blush)}
.rcard__bar{position:absolute;left:0;top:0;width:3px;min-height:24px;border-radius:8px;background:var(--navy);transition:top .1s linear}
.rcard__box{height:100%;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:none;-ms-overflow-style:none}
.rcard__box::-webkit-scrollbar{width:0;height:0;display:none}
.rcard__txt{font-size:20px;line-height:28px;color:var(--navy)}
.rcard__foot{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:14px;margin-top:14px}
.rcard__who{min-width:0;flex:1}
.rcard__name{font-size:22px;line-height:24px;font-weight:700;color:var(--navy);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rcard__when{font-size:17px;line-height:24px;color:#737373}
.rcard__av,.owl-carousel .owl-item .rcard__av{width:44px!important;height:44px;flex:none;border-radius:50%;object-fit:cover}

.rev__score{position:relative;height:403px;border-radius:6px;background:var(--white);box-shadow:0 0 20px rgba(10,53,107,.15);padding:48px 24px 0;text-align:center}
.rev__num{font-size:64px;line-height:.56;font-weight:500;color:var(--navy)}
.rev__label{margin-top:32px;font-size:30px;line-height:28px;font-weight:500;color:var(--navy)}
.rev__stars{margin-top:22px;display:flex;justify-content:center;gap:5px;color:var(--navy)}
.rev__stars svg{width:34px;height:33px}
.rev__based{margin-top:22px;font-size:20px;line-height:28px;color:var(--navy)}
.rev__based b{font-weight:700}
.rev__google{margin:12px auto 0;width:124px;height:auto}
.rev__nav{position:absolute;inset-inline:0;inset-block-end:24px;display:flex;justify-content:center;gap:11px}
.rev__nav .rnd{width:46px;height:46px}
.rev__nav svg{width:17px;height:17px}
.chev-prev{transform:rotate(-90deg)}
.chev-next{transform:rotate(90deg)}

@media(max-width:1023px){
	.rev{padding-block:44px 0}
	.rev__row{grid-template-columns:1fr;gap:20px}
	.rev__score{order:2}
	.rcard{height:340px;padding:18px 16px 20px}
	.rcard__txt{font-size:16px;line-height:24px}
	.rcard__name{font-size:18px}
	.rev__score{height:auto;padding:26px 20px 84px}
}