/* Home: work shields, client banners and testimonial scroll (Figma 48:1003, 56:1468, 64:4988).
   Loaded after home.css, so these rules win. Desktop values are Figma's; mobile is tuned below. */

/* ---------- Work: shields on an iron rail ---------- */
.ramah-home-work { padding-block: 34px 48px; background: #dfdad3; color: #171717; overflow: hidden; }
.ramah-home-work__head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 24px; padding-block: 8px 48px; }
.ramah-home-work__heading { display: grid; justify-items: end; gap: 12px; text-align: end; }
.ramah-home-work__title { font-size: 76px; line-height: 96px; font-weight: 700; color: #171717; }
.ramah-home-work__intro { font-size: 20px; line-height: 28px; font-weight: 500; color: #404040; }
.ramah-home-work__controls { display: flex; align-items: center; gap: 8px; }
.ramah-home-work__arrow { display: grid; place-items: center; inline-size: 47px; block-size: 48px; padding: 0; border: 1px solid #a3a3a3; background: transparent; color: #171717; cursor: pointer; transition: background-color 0.25s ease, color 0.25s ease, border-color 0.25s ease; }
.ramah-home-work__arrow:hover, .ramah-home-work__arrow:focus-visible { background: #171717; color: #faf7f2; border-color: #171717; }
.ramah-home-work__arrow:disabled { opacity: 0.4; cursor: default; }
.ramah-home-work__arrow svg { inline-size: 20px; block-size: 20px; }
.ramah-home-work__hint { margin-inline-start: 8px; font-size: 16px; line-height: 24px; color: #525252; }

.ramah-home-work__rail { position: relative; block-size: 6px; margin-inline: 88px; border-radius: 9999px; background: #171717; }
.ramah-home-work__rail::before, .ramah-home-work__rail::after { content: ""; position: absolute; inset-block-start: -3px; inline-size: 12px; block-size: 12px; border-radius: 9999px; background: #171717; }
.ramah-home-work__rail::before { inset-inline-start: -8px; }
.ramah-home-work__rail::after { inset-inline-end: -8px; }

.ramah-home-work__stage { margin-inline: 88px; }
.ramah-home-work__track { display: flex; gap: 32px; margin: 0; padding: 32px 0 16px; list-style: none; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scrollbar-width: none; }
.ramah-home-work__track::-webkit-scrollbar { display: none; }
.ramah-home-work__card { position: relative; flex: 0 0 340px; scroll-snap-align: start; }
.ramah-home-work__string { position: absolute; inset-block-start: -32px; inset-inline-start: 50%; translate: 50% 0; inline-size: 3px; block-size: 32px; background: #262626; }
.ramah-home-work__string::before { content: ""; position: absolute; inset-block-start: -4px; inset-inline-start: -4px; inline-size: 10px; block-size: 10px; border-radius: 9999px; background: #171717; border: 1px solid #404040; }
.ramah-home-work__shield {
	display: flex; flex-direction: column; align-items: center; justify-content: space-between;
	min-block-size: 424px; padding: 6px 30px 54px; border: 6px solid #1c1c1c; border-radius: 4px 4px 170px 170px;
	background: #faf7f2;
}
.ramah-home-work__crown { display: block; inline-size: calc(100% + 0px); block-size: 24px; margin-inline: 0; background: #171717; -webkit-mask: url("../../images/home/cards/shield-crown.svg") center top / 100% 100% no-repeat; mask: url("../../images/home/cards/shield-crown.svg") center top / 100% 100% no-repeat; }
.ramah-home-work__seal-row { display: flex; align-items: center; gap: 12px; inline-size: 100%; margin-block-start: 12px; }
.ramah-home-work__seal { display: grid; place-items: center; flex: none; inline-size: 56px; block-size: 56px; padding: 6px; border: 2px dashed #a3a3a3; border-radius: 9999px; font-size: 11px; line-height: 14px; text-align: center; color: #737373; }
.ramah-home-work__client { margin: 0; flex: 1; font-size: 18px; line-height: 22.5px; font-weight: 700; color: #171717; text-align: start; }
.ramah-home-work__value { margin: 12px 0 0; font-size: 60px; line-height: 60px; font-weight: 700; letter-spacing: -3px; color: #171717; text-align: center; }
.ramah-home-work__label { margin: 0; font-size: 18px; line-height: 28px; font-weight: 700; color: #171717; text-align: center; }
.ramah-home-work__text { margin: 0; max-inline-size: 286px; font-size: 14px; line-height: 22.75px; color: #404040; text-align: center; }
.ramah-home-work__link { display: inline-flex; align-items: center; gap: 8px; margin-block-start: 16px; font-size: 16px; line-height: 24px; font-weight: 700; color: #9e1b2a; }
.ramah-home-work__link svg { transition: translate 0.25s var(--ramah-ease); }
.ramah-home-work__link:hover svg { translate: -4px 0; }


/* ---------- Clients: hanging banners, seven per row ---------- */
.ramah-home-clients { padding-block: 56px 72px; background: #dfdad3; }
.ramah-home-clients__head { display: grid; justify-items: center; gap: 16px; padding-block-end: 56px; text-align: center; }
.ramah-home-clients__title { font-size: 60px; line-height: 72px; font-weight: 700; letter-spacing: -1.5px; color: #1c1c1c; }
.ramah-home-clients__title .ramah-red, .ramah-home-clients__title span + span { color: #941c1e; }
.ramah-home-clients__intro { font-size: 20px; line-height: 28px; color: #404040; }
@media (max-width: 767px) {
	.ramah-home-clients__title { font-size: 40px; line-height: 52px; }
}

/* ---------- Testimonials: parchment scroll with rods ---------- */
.ramah-home-reviews { position: relative; padding-block: 40px 64px; background: #7d1418 url("../../images/home/cards/reviews-bg.webp") center top / cover no-repeat; color: #ede6da; overflow: hidden; }
.ramah-home-reviews__title { font-size: 60px; line-height: 72px; font-weight: 700; letter-spacing: 1.5px; text-align: center; color: #ede6da; text-shadow: 0 2px 2px rgb(0 0 0 / 0.06), 0 4px 3px rgb(0 0 0 / 0.07); }
.ramah-home-reviews__stage { position: relative; display: flex; align-items: center; gap: 16px; inline-size: 100%; max-inline-size: 1040px; margin: 48px auto 0; }
.ramah-home-reviews__arrow { display: grid; place-items: center; flex: none; inline-size: 56px; block-size: 56px; padding: 0; border: 1px solid rgb(255 255 255 / 0.2); background: rgb(37 36 34 / 0.9); color: #fff; cursor: pointer; box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1); }
.ramah-home-reviews__arrow:hover, .ramah-home-reviews__arrow:focus-visible { background: #171717; }
.ramah-home-reviews__arrow svg { inline-size: 24px; block-size: 24px; }
.ramah-home-reviews__scroll { flex: 1; min-inline-size: 0; display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; overscroll-behavior-x: contain; }
.ramah-home-reviews__scroll::-webkit-scrollbar { display: none; }
.ramah-home-reviews__slide { position: relative; flex: 0 0 100%; margin: 0; padding: 24px 10px 40px; scroll-snap-align: center; }
.ramah-home-reviews__paper {
	position: relative; display: grid; align-content: center; gap: 0; min-block-size: 339px; padding: 40px 56px 40px 56px;
	border-radius: 2px; color: #1f1d1a;
	background: linear-gradient(90deg, #d8cebd 0%, #e9dfd0 4%, #f1e9dd 15%, #eee6d9 50%, #f1e9dd 85%, #e9dfd0 96%, #d8cebd 100%);
	box-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.85), 0 10px 20px 0 rgb(0 0 0 / 0.5), inset 0 0 40px rgb(135 110 75 / 0.18), inset 12px 0 18px rgb(90 70 45 / 0.25), inset -12px 0 18px rgb(90 70 45 / 0.25);
}
.ramah-home-reviews__paper::before, .ramah-home-reviews__paper::after {
	content: ""; position: absolute; inset-block: -24px; inline-size: 20px; border-radius: 1px;
	background: linear-gradient(90deg, #5a4322 0%, #826435 22%, #bfa068 45%, #dcbe86 52%, #a68449 72%, #523d1e 100%);
	box-shadow: -4px 0 10px rgb(0 0 0 / 0.6), 4px 0 10px rgb(0 0 0 / 0.6);
}
.ramah-home-reviews__paper::before { inset-inline-start: -10px; }
.ramah-home-reviews__paper::after { inset-inline-end: -10px; }
.ramah-home-reviews__mark { position: absolute; inset-block-start: 22px; inset-inline-end: 40px; font-family: "Liberation Serif", Georgia, serif; font-size: 60px; font-weight: 700; line-height: 60px; color: #a31b24; letter-spacing: -3px; }
.ramah-home-reviews__quote { margin: 0; font-size: 30px; line-height: 49.5px; font-weight: 700; text-align: start; max-inline-size: 760px; }
.ramah-home-reviews__quote p { margin: 0; }
.ramah-home-reviews__who { display: flex; align-items: center; gap: 16px; margin: 32px 0 0; }
.ramah-home-reviews__cite { display: grid; gap: 2px; margin-inline-end: auto; text-align: start; }
.ramah-home-reviews__name { font-size: 18px; line-height: 28px; font-weight: 700; color: #23201c; }
.ramah-home-reviews__role { font-size: 14px; line-height: 20px; font-weight: 600; color: #5a5245; }
.ramah-home-reviews__seal { display: grid; place-items: center; flex: none; inline-size: 64px; block-size: 64px; border: 2px dashed #8d8272; border-radius: 9999px; font-size: 12px; line-height: 16px; font-weight: 700; color: #63594b; text-align: center; }
.ramah-home-reviews__dots { display: flex; justify-content: center; gap: 10px; margin: 40px 0 0; padding: 0; list-style: none; }
.ramah-home-reviews__dots button { inline-size: 40px; block-size: 6px; padding: 0; border: 0; border-radius: 9999px; background: #3a3936; cursor: pointer; transition: background-color 0.3s ease, box-shadow 0.3s ease; }
.ramah-home-reviews__dots button[aria-current="true"] { background: #a31b24; box-shadow: 0 0 8px rgb(163 27 36 / 0.6); }

@media (max-width: 767px) {
	.ramah-home-work__head { padding-block: 8px 32px; }
	.ramah-home-work__heading { justify-items: start; text-align: start; }
	.ramah-home-work__title { font-size: 48px; line-height: 60px; }
	.ramah-home-work__rail, .ramah-home-work__stage { margin-inline: 16px; }
	.ramah-home-work__card { flex-basis: 84%; }
	.ramah-home-work__shield { min-block-size: 400px; padding-inline: 22px; }
	.ramah-home-reviews__title { font-size: 40px; line-height: 52px; }
	.ramah-home-reviews__stage { flex-wrap: wrap; justify-content: center; gap: 12px; }
	.ramah-home-reviews__scroll { flex: 0 0 100%; order: -1; }
	.ramah-home-reviews__arrow--prev { order: 1; }
	.ramah-home-reviews__arrow--next { order: 2; }
	.ramah-home-reviews__arrow { inline-size: 44px; block-size: 44px; }
	.ramah-home-reviews__slide { padding-inline: 16px; }
	.ramah-home-reviews__paper { padding: 36px 26px; }
	.ramah-home-reviews__quote { font-size: 20px; line-height: 34px; }
	.ramah-home-reviews__mark { position: static; display: block; height: 44px; font-size: 56px; line-height: 44px; }
	.ramah-home-reviews__dots button { inline-size: 44px; block-size: 44px; padding: 19px 2px; box-sizing: border-box; background-clip: content-box; }
	.ramah-home-reviews__dots button[aria-current="true"] { background-clip: content-box; box-shadow: none; }
}
.ramah-home-work__card { padding: 0; }

/* Single shield outline: neutralise the v1 card frame from home.css (it drew a second border + top bar). */
.ramah-home-work__card { border: 0; border-radius: 0; background: none; margin-block-start: 0; }
.ramah-home-work__card::before { content: none; }
.ramah-home-work__who { flex: 1; display: grid; gap: 2px; text-align: start; }
.ramah-home-work__category { margin: 0; font-size: 13px; line-height: 20px; color: #737373; }

/* All four shields fully visible on desktop (Figma crops the 4th inside a scroller; the client wants it whole). */
@media (min-width: 1280px) {
	.ramah-home-work__card { flex: 0 0 calc((100% - 96px) / 4); }
	.ramah-home-work__shield { padding-inline: 24px; }
	.ramah-home-work__value { font-size: 54px; line-height: 58px; }
}
/* Same vertical rhythm on every shield whatever the copy length: content from the top, link at the bottom. */
.ramah-home-work__shield { justify-content: flex-start; gap: 0; }
.ramah-home-work__link { margin-block-start: auto; padding-block-start: 16px; }