/* Services menu: transparent editorial rows with a staggered colour splash. */
body.jd-page-services .svc-menu__intro { max-width: 46rem; }

body.jd-page-services .svc-menu__title {
  row-gap: .08em;
  color: #4f4946;
}

body.jd-page-services .svc-menu__title span {
  font-family: var(--jd-font-display);
  font-weight: 400;
}

body.jd-page-services .svc-menu__title em {
  position: relative;
  color: #9e7a4f;
  white-space: nowrap;
}

body.jd-page-services .svc-menu__title em::after {
  content: "";
  position: absolute;
  right: -.22em;
  bottom: -.08em;
  left: .05em;
  height: .18em;
  border-bottom: 2px solid rgba(158, 122, 79, .48);
  border-radius: 50%;
  transform: rotate(-2deg);
}

body.jd-page-services .svc-cat-hero__shell {
  border-color: rgba(158, 122, 79, .16);
  background: transparent;
  box-shadow: none;
}

body.jd-page-services .svc-cat-hero__copy { background: transparent; }
body.jd-page-services .svc-cat-hero__label { color: #9e7a4f; }

body.jd-page-services .svc-cat-hero__title {
  color: #4f4946;
  font-size: clamp(2.2rem, 4.4vw, 3.8rem);
  line-height: .96;
  letter-spacing: -.035em;
}

body.jd-page-services .svc-cat-hero__text { color: #7a6a5d; }

body.jd-page-services .svc-cat-hero__meta span {
  padding: .25rem 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #7a6a5d;
}

body.jd-page-services .svc-cat-hero__meta span + span::before {
  content: "·";
  margin-right: .45rem;
  color: #9e7a4f;
}

body.jd-page-services .svc-cards,
body.jd-page-services .svc-menu #menu-container {
  gap: 0;
  border-top: 1px solid rgba(62, 50, 40, .14);
}

body.jd-page-services .svc-card.blanc-service-api-card,
body.jd-page-services .svc-menu .blanc-service-api-card {
  isolation: isolate;
  overflow: hidden;
  min-height: 12rem;
  padding: 1.5rem 1.35rem 1.25rem;
  border: 0;
  border-right: 1px solid rgba(62, 50, 40, .11);
  border-bottom: 1px solid rgba(62, 50, 40, .14);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body.jd-page-services .svc-card.blanc-service-api-card::before {
  top: auto;
  right: auto;
  bottom: 0;
  width: 3.5rem;
  height: 2px;
  background: #9e7a4f;
  opacity: .7;
}

body.jd-page-services .svc-card.blanc-service-api-card::after {
  content: "";
  position: absolute;
  z-index: 0;
  top: -35%;
  bottom: -35%;
  left: -72%;
  width: 54%;
  background: linear-gradient(
    102deg,
    transparent 0%,
    rgba(255, 247, 225, 0) 12%,
    rgba(225, 192, 139, .16) 34%,
    rgba(255, 252, 239, .82) 50%,
    rgba(225, 192, 139, .2) 66%,
    rgba(255, 247, 225, 0) 88%,
    transparent 100%
  );
  filter: blur(1px);
  opacity: 0;
  transform: translateX(0) skewX(-12deg);
  animation: svc-light-sweep 7s cubic-bezier(.22,.68,.25,1) infinite both;
  animation-delay: calc(var(--svc-splash-index, 0) * 115ms + 120ms);
  pointer-events: none;
}

body.jd-page-services .svc-card > * {
  position: relative;
  z-index: 1;
}

body.jd-page-services .svc-card__top .blanc-service-api-title {
  font-family: var(--jd-font-display);
  font-size: clamp(1.4rem, 2vw, 1.75rem);
  font-weight: 500;
  line-height: 1.08;
  letter-spacing: -.025em;
}

body.jd-page-services .svc-card__top .blanc-service-api-title a { color: #4f4946; }

body.jd-page-services .svc-card__price {
  color: #9e7a4f;
  font-size: 1.2rem;
}

body.jd-page-services .svc-card__footer { border-top-color: rgba(62, 50, 40, .1); }
body.jd-page-services .svc-card:hover { background: rgba(255, 255, 255, .28); }

@keyframes svc-light-sweep {
  0% { opacity: 0; transform: translateX(0) skewX(-12deg); }
  2.5% { opacity: .88; }
  9% { opacity: .62; }
  15% { opacity: 0; transform: translateX(340%) skewX(-12deg); }
  100% { opacity: 0; transform: translateX(340%) skewX(-12deg); }
}

@media (max-width: 767.98px) {
  body.jd-page-services .svc-card.blanc-service-api-card,
  body.jd-page-services .svc-menu .blanc-service-api-card {
    min-height: 0;
    padding: 1.25rem .35rem 1.1rem;
    border-right: 0;
  }

  body.jd-page-services .svc-cat-hero__copy { padding-inline: .25rem !important; }
}

@media (prefers-reduced-motion: reduce) {
  body.jd-page-services .svc-card.blanc-service-api-card::after {
    animation: none;
    opacity: 0;
    transform: none;
  }
}
