/* Serviços hub — bloco escuro com carrossel (Segmento). Classes .raz-srv-* compartilhadas
   com Atuação. Título 40/52 ls-1.08 ClashGrotesk-Regular (controle). */
.raz-srv-bloco { background: #1e1e1e; color: var(--raz-cream); }
.raz-srv-bloco .raz-container { padding-block: 50px; }
.raz-srv-bloco__titulo {
	font-family: var(--raz-font-nav);
	font-weight: 400;
	font-size: 26px;                /* mobile */
	line-height: 33.8px;
	letter-spacing: -0.702px;
	color: #fff;
	margin: 0 0 28px;
}

/* trilho horizontal (scroll-snap) — 3 cards/visão no desktop */
.raz-srv-track {
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: 80%;
	gap: 20px;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	-webkit-overflow-scrolling: touch;
	padding-bottom: 6px;
}
.raz-srv-track::-webkit-scrollbar { height: 6px; }
.raz-srv-track::-webkit-scrollbar-thumb { background: rgba(241,242,231,0.25); border-radius: 3px; }

.raz-srv-card {
	position: relative;
	scroll-snap-align: start;
	display: flex;
	align-items: flex-end;
	min-height: 240px;
	padding: 22px;
	overflow: hidden;
	text-decoration: none;
	background: #0e1517;
}
.raz-srv-card__img {
	position: absolute; inset: 0;
	background-size: cover; background-position: center;
	filter: grayscale(1);
	transition: transform 0.5s ease, filter 0.4s ease;
}
.raz-srv-card::after {
	content: ""; position: absolute; inset: 0;
	background: linear-gradient(to top, rgba(0,0,0,0.7), rgba(0,0,0,0.1));
}
.raz-srv-card:hover .raz-srv-card__img { transform: scale(1.05); filter: grayscale(0.2); }
.raz-srv-card__title {
	position: relative; z-index: 1;
	font-family: var(--raz-font-display);
	font-weight: 400;
	font-size: 24px;
	line-height: 28px;
	color: #fff;
}

/* círculo claro com chevron ">" (Group-5533) */
.raz-srv-circle {
	position: absolute;
	right: 22px; bottom: 26px;
	z-index: 1;
	width: 44px; height: 44px;
	border-radius: 50%;
	background: #D4D4D4;
}
.raz-srv-circle::after {
	content: "";
	position: absolute;
	top: 50%; left: 47%;
	width: 9px; height: 9px;
	border-top: 1.5px solid #1E1E1E;
	border-right: 1.5px solid #1E1E1E;
	transform: translate(-50%, -50%) rotate(45deg);
}
.raz-srv-circle--lg { width: 52px; height: 52px; }

@media (min-width: 740px) {
	.raz-srv-bloco .raz-container { padding-block: 50px; }
	.raz-srv-bloco__titulo { font-size: 40px; line-height: 52px; letter-spacing: -1.08px; margin-bottom: 32px; }
	.raz-srv-track { grid-auto-columns: calc((100% - 40px) / 3); }
	.raz-srv-card { min-height: 280px; }
}