/* Custom Plugin Stage 1. This sheet is enqueued only on that service page. */
.emsoft-service-landing { padding-top: var(--emsoft-header-height, 120px); }
.emsoft-service-landing .service-hero {
  padding: 48px 0 72px;
  background: linear-gradient(115deg, #fff 24%, #f1f9fe 78%, #e6f2fb);
}
.emsoft-service-landing .service-hero__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
  gap: clamp(32px, 5vw, 72px);
  align-items: center;
}
.emsoft-service-landing .service-hero__content { max-width: 760px; }
.emsoft-service-landing .service-hero__eyebrow,
.emsoft-service-landing .service-landing__eyebrow {
  color: #287dac;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .07em;
  text-transform: uppercase;
  margin-bottom: 16px;
}
.emsoft-service-landing .service-hero h1 {
  font-size: clamp(34px, 3.5vw, 54px);
  font-weight: 800;
  letter-spacing: -.045em;
  line-height: 1.1;
  margin-bottom: 24px;
}
.emsoft-service-landing .service-hero h1 span { color: #287dac; }
.emsoft-service-landing .service-hero__content > p:not(.service-hero__eyebrow) {
  color: #35505e;
  font-size: clamp(16px, 1.3vw, 18px);
  line-height: 1.65;
  margin-top: 16px;
}
.emsoft-service-landing .service-landing__button {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 14px;
  min-height: 54px;
  padding: 14px 24px;
  border-radius: 8px;
  background: #287dac;
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  text-align: center;
  text-decoration: none;
  transition: background 180ms ease;
}
.emsoft-service-landing .service-landing__button:hover { background: #20668e; color: #fff; }
.emsoft-service-landing .service-hero__consultation { margin-top: 30px; }
.emsoft-service-landing .service-hero__visual img { width: 100%; height: auto; display: block; }
.emsoft-service-landing .service-hero__diagram {
  position: relative;
  isolation: isolate;
  width: 100%;
  aspect-ratio: 4 / 3;
  border: 1px solid #d8eaf5;
  border-radius: 28px;
  background: radial-gradient(circle at 50% 48%, #f8fcff 0 28%, transparent 29%), linear-gradient(135deg, #edf7fc, #deedf8);
}
.emsoft-service-landing .service-hero__diagram::before {
  content: "";
  position: absolute;
  inset: 15% 19%;
  border: 2px dashed #a6cde3;
  border-radius: 50%;
}
.emsoft-service-landing .service-hero__diagram-core,
.emsoft-service-landing .service-hero__diagram-node {
  position: absolute;
  display: grid;
  place-items: center;
  border: 2px solid #9ccce6;
  background: #fff;
  color: #287dac;
  box-shadow: 0 14px 30px rgb(39 95 130 / 8%);
}
.emsoft-service-landing .service-hero__diagram-core {
  z-index: 1;
  left: 50%;
  top: 50%;
  width: 32%;
  aspect-ratio: 1;
  border-radius: 24px;
  transform: translate(-50%, -50%);
}
.emsoft-service-landing .service-hero__diagram-core svg { width: 44%; height: 44%; }
.emsoft-service-landing .service-hero__diagram-node { width: 15%; aspect-ratio: 1; border-radius: 18px; }
.emsoft-service-landing .service-hero__diagram-node svg { width: 46%; height: 46%; }
.emsoft-service-landing .service-hero__diagram-node--1 { left: 13%; top: 16%; }
.emsoft-service-landing .service-hero__diagram-node--2 { right: 13%; top: 16%; }
.emsoft-service-landing .service-hero__diagram-node--3 { left: 42.5%; bottom: 7%; }
.emsoft-service-landing .service-assistant { padding: 64px 0; }
.emsoft-service-landing .service-assistant__surface {
  padding: clamp(24px, 4vw, 48px);
  border: 1px solid #c6e2f4;
  border-radius: 20px;
  background: linear-gradient(115deg, #f7fbfe, #dfedf8);
}
.emsoft-service-landing .service-assistant__intro {
  display: flex;
  align-items: center;
  gap: 20px;
  margin-bottom: 28px;
}
.emsoft-service-landing .service-assistant__intro img { flex: 0 0 96px; width: 96px; height: 96px; object-fit: contain; }
.emsoft-service-landing .service-assistant__eyebrow { color: #287dac; font-size: 13px; font-weight: 700; margin-bottom: 4px; }
.emsoft-service-landing .service-assistant__intro h2 { margin-bottom: 8px; }
.emsoft-service-landing .service-assistant__intro p:last-child { color: #4c606d; }
.emsoft-service-landing .service-assistant__topics { display: flex; flex-wrap: wrap; gap: 10px; }
.emsoft-service-landing .service-assistant__topic {
  display: inline-flex;
  align-items: center;
  border: 1px solid #b4d6e9;
  border-radius: 8px;
  padding: 11px 16px;
  background: #fff;
  color: #163d55;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.4;
  text-decoration: none;
  cursor: pointer;
  transition: background 180ms ease, color 180ms ease;
}
.emsoft-service-landing .service-assistant__topic:hover,
.emsoft-service-landing .service-assistant__topic.is-active,
.emsoft-service-landing .service-assistant__topic:focus-visible { background: #287dac; color: #fff; }
.emsoft-service-landing .service-assistant__topic--unavailable { opacity: .55; cursor: default; }
.emsoft-service-landing .service-assistant__details {
  margin-top: 28px;
  padding: 24px;
  border: 1px solid #c6e2f4;
  border-radius: 12px;
  background: #fff;
}
.emsoft-service-landing .service-assistant__detail { display: flex; align-items: flex-start; gap: 20px; }
.emsoft-service-landing .service-assistant__detail[hidden] { display: none; }
.emsoft-service-landing .service-assistant__icon {
  display: grid;
  place-items: center;
  flex: 0 0 64px;
  width: 64px;
  height: 64px;
  border-radius: 14px;
  background: #edf7fe;
  color: #287dac;
}
.emsoft-service-landing .service-assistant__icon svg { width: 36px; height: 36px; }
.emsoft-service-landing .service-assistant__detail h3 { font-size: 22px; font-weight: 700; margin-bottom: 6px; }
.emsoft-service-landing .service-assistant__detail p { color: #4c606d; font-size: 16px; }
.emsoft-service-landing .service-assistant__detail a { display: inline-block; color: #287dac; font-weight: 700; margin-top: 10px; }
.emsoft-service-landing .service-main-content { padding: 64px 0; }
.emsoft-service-landing .service-main-content__copy { max-width: 900px; }
.emsoft-service-landing .service-main-content h2 { margin-bottom: 22px; }
.emsoft-service-landing .service-main-content p { color: #3c5360; font-size: 17px; line-height: 1.7; margin-bottom: 18px; }
.emsoft-service-landing .service-main-content__links { display: flex; flex-wrap: wrap; gap: 12px 24px; margin: 20px 0 12px; }
.emsoft-service-landing .service-main-content__links a { color: #287dac; font-size: 16px; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.emsoft-service-landing .service-main-content .service-landing__button { margin-top: 12px; }
.emsoft-service-landing .service-reviews__more { display: flex; justify-content: center; margin-top: 26px; }
.emsoft-service-landing .service-faq { padding: 64px 0; }
.emsoft-service-landing .service-faq h2 { margin-bottom: 28px; }
.emsoft-service-landing .service-faq__items { display: grid; gap: 12px; max-width: 960px; }
.emsoft-service-landing .service-faq__item { border: 1px solid #d5e7f1; border-radius: 12px; background: #f8fbfd; }
.emsoft-service-landing .service-faq__item summary { display: flex; justify-content: space-between; gap: 24px; padding: 20px 24px; cursor: pointer; font-size: 18px; font-weight: 700; list-style: none; }
.emsoft-service-landing .service-faq__item summary::-webkit-details-marker { display: none; }
.emsoft-service-landing .service-faq__item summary span { color: #287dac; font-size: 26px; line-height: 1; }
.emsoft-service-landing .service-faq__item[open] summary span { transform: rotate(45deg); }
.emsoft-service-landing .service-faq__item p { padding: 0 24px 24px; color: #4c606d; font-size: 16px; }
@media (max-width: 767px) {
  .emsoft-service-landing .service-hero { padding: 32px 0 48px; }
  .emsoft-service-landing .service-hero__grid { grid-template-columns: 1fr; gap: 28px; }
  .emsoft-service-landing .service-hero__visual { max-width: 520px; margin-inline: auto; }
  .emsoft-service-landing .service-hero__consultation,
  .emsoft-service-landing .service-main-content .service-landing__button { width: 100%; }
  .emsoft-service-landing .service-assistant,
  .emsoft-service-landing .service-main-content,
  .emsoft-service-landing .service-faq { padding: 48px 0; }
  .emsoft-service-landing .service-assistant__intro { align-items: flex-start; gap: 14px; }
  .emsoft-service-landing .service-assistant__intro img { flex-basis: 64px; width: 64px; height: 64px; }
  .emsoft-service-landing .service-assistant__topic { font-size: 14px; }
  .emsoft-service-landing .service-assistant__details { padding: 18px; }
  .emsoft-service-landing .service-assistant__icon { flex-basis: 48px; width: 48px; height: 48px; }
  .emsoft-service-landing .service-assistant__icon svg { width: 28px; height: 28px; }
}
