/* marquee of disciplines — skewed ribbon */
.ribbon{
	background:var(--gray-blue-color);
	color:var(--white-color);
	font-family:"light" !important;
	transform:;
	/** margin:4.5rem 0; **/
	margin:0;
	padding:1.1rem 0;
	overflow:hidden;
	white-space:nowrap;
}
.ribbon div{
	display:inline-block;
	transform:;
	letter-spacing:.28em;
	text-transform:uppercase;
	font-size:.78rem;
	animation:scroll 34s linear infinite;
}
.ribbon b{
	color:var(--gray-color);
	font-size:.88rem;
	margin:0 1.4rem;
}
@keyframes scroll{
	from{
		transform:translateX(0);
	}
	to{
		transform:translateX(-50%);
	}
}
@media(prefers-reduced-motion:reduce){
	.ribbon div{
		animation:none;
	}
}

/* ---------- skewed section rhythm ---------- */
.main-page-section-services{
	padding:9rem 6vw;
}
.wrap{
	max-width:1200px;
	margin:0 auto;
}
.eyebrow{
	font-family:"bold" !important;
	letter-spacing:.32em;
	text-transform:uppercase;
	font-size:.75rem;
	font-weight:600;
	color:var(--gray-color);
	margin-bottom:1rem;
	
	transform:skewX(-6deg);
}
h2{
	font-family:"news" !important;
	font-weight:800;
	font-stretch:108%;
	font-size:clamp(1.9rem,4vw,3rem);
	line-height:1.08;
	letter-spacing:.02em;
	color:var(--dark-blue-color);
}

/* services — parallelogram cards */
.svc-grid{
	display:grid;
	grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
	gap:6px;
	margin-top:3.5rem;
	transform:skewX(-6deg);
}
.svc{
	background:var(--dark-blue-color);
	border-left:6px solid var(--gray-color);
	padding:2.8rem 2.4rem;
	transition:.66s;
}
.svc>*{
	transform:skewX(6deg);
}
.svc:hover{
	background:var(--bright-gray-blue-color);
	border-color:var(--gray-blue-color);
}
.svc:hover span p{
	color:var(--dark-blue-color);
}
.svc:hover h3,.svc:hover p{
	color:var(--dark-blue-color);
}
.svc span p{
	font-family:"news" !important;
	font-weight:700;
	color:var(--gray-color);
	font-size:.85rem;
	letter-spacing:.2em;
	margin-bottom:.6rem;
}
.svc h3{
	font-family:"light" !important;
	font-size:1.02rem;
	font-weight:800;
	letter-spacing:.05em;
	text-transform:uppercase;
	color:var(--white-color);
	margin-bottom:.7rem;
}
.svc p{
	font-family:"light" !important;
	font-size:.9rem;
	line-height:1.65;
	color:var(--white-color);
	font-weight:300;
}
.svc:hover p{
	color:var(--dark-blue-color);
}

@media(max-width:700px){
	.svc-grid{
		transform:none;
	}
	.svc>*{
		transform:none;
	}
}