/* Services page. Measured from the original at 1440px. */
.svc-hero {
  overflow-x: clip; /* the -49px shift must not widen the page (RTL) */
  padding: 84px 20px 358px;
  background:
    radial-gradient(circle at 45.83% 11.13%, #00a1a7 0%, 17.5%, rgba(0,161,167,0) 35%),
    radial-gradient(circle at 30.23% 49.69%, #60dbe0 0%, 17.5%, rgba(96,219,224,0) 35%),
    radial-gradient(circle at 73.30% 47.94%, #08b4ba 0%, 17.5%, rgba(8,180,186,0) 35%),
    radial-gradient(circle at 70.13% 7.43%, #007b80 0%, 17.5%, rgba(0,123,128,0) 35%),
    radial-gradient(circle at 94.35% 89.62%, #00a1a7 0%, 20%, rgba(0,161,167,0) 40%),
    radial-gradient(circle at 7.13% 90.29%, rgba(220,239,238,.99) 0%, 25%, rgba(220,239,238,0) 50%),
    radial-gradient(circle at 19.04% 5.53%, #60dbe0 0%, 42%, rgba(96,219,224,0) 70%),
    radial-gradient(circle at 93.69% 11.43%, #007b80 0%, 42%, rgba(0,123,128,0) 70%),
    radial-gradient(circle at 48.90% 49.52%, #fff 0%, 100%, rgba(255,255,255,0) 100%);
}
.svc-hero__intro { color: var(--white); text-align: center; font-family: var(--f-body); font-size: 16px; line-height: 1.4; }
.svc-hero__sub { margin-top: 3px; font-family: var(--f-text); font-size: clamp(32px, 3.32vw, 47.81px); line-height: 1; color: var(--yellow); }
.svc-hero__intro p + p { margin-top: 23px; }
.svc-hero__punch { font-family: var(--f-display); }
.svc-grid {
  display: grid; grid-template-columns: repeat(2, minmax(0, 487px)); justify-content: center;
  gap: 27px; margin-top: 95px;
}
.svc-card {
  display: flex; flex-direction: column;
  min-height: 606px; padding: 56px 30px 58px 29px;
  background: var(--white); border-radius: 13.66px;
}
.svc-card__head { display: flex; align-items: center; gap: 15px; padding-bottom: 10px; border-bottom: 2px solid var(--teal); margin-left: 4px; }
.svc-card__head img { width: 63px; height: 61px; flex: none; }
.svc-card__head h2 { font-family: var(--f-title); font-size: clamp(22px, 1.9vw, 27.32px); line-height: 1.1; }
.svc-card__head + p { margin-top: 28px; }
.svc-card p { font-family: var(--f-body); font-size: 16px; line-height: 1.6; }
.svc-card__img { width: 100%; height: 155px; margin-top: auto; object-fit: cover; }
.svc-card p:last-of-type { margin-bottom: 30px; }
.svc-card { padding-bottom: 58px; }
/* In the original, the hero block sits ~49px left of centre on wide screens. Reproduced as-is. */
@media (min-width: 1200px) { .svc-hero__intro, .svc-grid { transform: translateX(-49px); } }

.extras { padding: 56px 20px 86px; text-align: center; }
.extras .section-title { margin-top: 10px; }
.extras__text { max-width: 625px; margin: 21px auto 0; font-family: var(--f-body); font-size: 16px; line-height: 1.4; }
.extras__text + .extras__text { margin-top: 0; }
.extras__list { display: flex; flex-wrap: wrap; justify-content: center; gap: 18px; max-width: 1130px; margin: 41px auto 0; }
.extra { flex: 0 1 269px; min-height: 346px; padding: 38px 12px 0; }
.extra img { width: 92px; height: 91px; margin: 0 auto; }
.extra h3 { margin-top: 15px; font-family: var(--f-title); font-size: clamp(22px, 1.9vw, 27.32px); line-height: 1; }
.extra p { max-width: 246px; margin: 15px auto 0; font-family: var(--f-body); font-size: 16px; line-height: 1.4; }
.extras__btn { margin-top: 37px; }

@media (max-width: 900px) {
  .svc-grid { grid-template-columns: minmax(0, 520px); }
  .svc-hero { padding-bottom: 80px; }
  .svc-hero__intro br { display: none; }
}
@media (max-width: 750px) {
  .svc-hero { padding: 48px 16px 56px; }
  .svc-grid { margin-top: 48px; gap: 20px; }
  .svc-card { min-height: 0; padding: 32px 20px 28px; }
  .extra { flex-basis: 100%; min-height: 0; padding-bottom: 24px; }
  .extras { padding: 48px 16px 56px; }
}