:root {
	--di-content-width: 1200px;
	--di-gutter: clamp(1rem, 4vw, 3rem);
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; }
img, svg, video { display: block; max-width: 100%; height: auto; }
.screen-reader-text { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.site-header, .site-footer { padding-inline: var(--di-gutter); }
.site-main > .entry-content:not(:has(> [class])) { width: min(var(--di-content-width), calc(100% - 2 * var(--di-gutter))); margin-inline: auto; }
.site-navigation ul { display: flex; flex-wrap: wrap; gap: 1rem; padding: 0; margin: 0; list-style: none; }

/* Service artwork stays legible on the dark service panels. */
.inner-hero .art-core .service-icon,
.service-directory .featured-service-stat .service-icon {
	color: #fff;
	filter: brightness(0) invert(1);
}

/* Finish every capability card, including even cards and new instances. */
main .capability-grid .capability:nth-child(n) {
	border-left: 3px solid #28abe2;
	padding-left: 22px;
	margin-bottom: 15px;
}

/* Keep two-digit step labels centered and independently legible. */
main .steps .step-num {
	letter-spacing: normal;
	font-variant-numeric: tabular-nums;
	text-align: center;
	line-height: 1;
	flex-shrink: 0;
}

@media (max-width: 540px) {
	main .capability-grid .capability:nth-child(n) { padding-left: 18px; }
}
/* Related-service artwork needs the same contrast on every dark panel. */
main .related-services.dark .service-icon {
	color: #fff;
	filter: brightness(0) invert(1);
}

/* Improve team names, job titles and responsibility captions. */
main .team-roster h3 { font-size: 25px; line-height: 1.3; }
main .team-roster strong { font-size: 15px; line-height: 1.5; }
main .team-roster p { font-size: 14px; line-height: 1.6; }
main .contact-details .map-caption:empty { display: none; }
main .contact-details .location-map span {
	font-size: 14px;
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* Gentle decorative motion, with stable text and reduced-motion support. */
@keyframes di-service-orbit {
	0%, 100% { transform: rotate(-18deg) scale(1); }
	50% { transform: rotate(2deg) scale(1.035); }
}
@keyframes di-service-orbit-inner {
	0%, 100% { transform: rotate(0deg); }
	50% { transform: rotate(-18deg); }
}
@media (prefers-reduced-motion: no-preference) {
	.inner-hero .service-art .art-orbit {
		animation: di-service-orbit 14s ease-in-out infinite;
	}
	.inner-hero .service-art .art-orbit::after {
		animation: di-service-orbit-inner 18s ease-in-out infinite;
	}
	.inner-hero .service-art:hover .art-orbit,
	.inner-hero .service-art:hover .art-orbit::after,
	.inner-hero .service-art:focus-within .art-orbit,
	.inner-hero .service-art:focus-within .art-orbit::after {
		animation-play-state: paused;
	}
}
/* A small lift adds depth without tracking the pointer or moving labels. */
@media (prefers-reduced-motion: no-preference) and (hover: hover) {
  .inner-hero .service-art .art-core {
    transition: transform 360ms ease, box-shadow 360ms ease;
  }
  .inner-hero .service-art:hover .art-core {
    transform: translate(-4px, -5px) rotate(-1deg);
    box-shadow: 17px 19px 0 #28abe226;
  }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}