.page-services {
  --svc-ink: var(--color-ink);
  --svc-ink-soft: var(--color-ink-soft);
  --svc-line: var(--color-line);
  --svc-surface: var(--color-surface);
  --svc-surface-alt: var(--color-surface-alt);
  --svc-deep: var(--color-surface-deep);
  --svc-accent: var(--color-accent);
  --svc-highlight: var(--color-highlight);
  --svc-contrast: var(--color-contrast-surface);
  --svc-contrast-ink: var(--color-contrast-ink);
  --svc-contrast-line: var(--color-contrast-line);
  --svc-contrast-accent: var(--color-contrast-accent);
  --svc-mono: var(--font-mono);
  --svc-heading: var(--font-heading);
  --svc-body: var(--font-body);
}

.page-services .svc-hero {
  position: relative;
  overflow: hidden;
  background: var(--svc-contrast);
  color: var(--svc-contrast-ink);
  padding-block: var(--section-y-lg);
}

.page-services .svc-hero__bg {
  position: absolute;
  inset: 0;
  opacity: 0.16;
  pointer-events: none;
}

.page-services .svc-hero__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.page-services .svc-hero__inner {
  position: relative;
  z-index: 1;
}

.page-services .svc-hero .crumbs,
.page-services .svc-hero .crumbs a {
  color: var(--svc-contrast-ink);
}

.page-services .svc-hero__frame {
  margin-top: var(--space-6);
  border: var(--border-thick) solid var(--svc-contrast-line);
  border-left-width: 6px;
  padding: var(--space-6);
  background: color-mix(in srgb, var(--svc-contrast) 88%, transparent);
}

.page-services .svc-hero__title {
  font-family: var(--svc-heading);
  font-size: var(--text-display);
  line-height: var(--leading-heading);
  letter-spacing: var(--tracking-heading);
  margin-block: var(--space-3) var(--space-4);
  max-width: 22ch;
}

.page-services .svc-hero__lead {
  font-size: var(--text-lg);
  line-height: var(--leading-body);
  max-width: var(--measure);
  color: var(--svc-contrast-ink);
}

.page-services .svc-hero__stats {
  list-style: none;
  margin: var(--space-6) 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--space-4);
  border-top: var(--border-thin) solid var(--svc-contrast-line);
  padding-top: var(--space-4);
}

.page-services .svc-stat {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}

.page-services .svc-stat__num {
  font-family: var(--svc-mono);
  font-size: var(--text-figure);
  font-weight: var(--weight-heading);
  line-height: 1;
  color: var(--svc-contrast-accent);
}

.page-services .svc-stat__unit {
  font-size: var(--text-sm);
  letter-spacing: 0.08em;
}

.page-services .svc-stat__lab {
  font-size: var(--text-xs);
  color: var(--svc-contrast-ink);
  opacity: 0.78;
}

.page-services .svc-hero__rule {
  margin-top: var(--space-4);
  font-size: var(--text-sm);
  line-height: var(--leading-body);
  border-left: var(--border-thick) solid var(--svc-contrast-accent);
  padding-left: var(--space-3);
  max-width: var(--measure);
}

.page-services .svc-cats {
  position: sticky;
  top: 0;
  z-index: 20;
  background: var(--svc-surface);
  border-block: var(--border-thin) solid var(--svc-line);
}

.page-services .svc-cats__inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2);
  padding-block: var(--space-3);
}

.page-services .svc-cats__label {
  font-size: var(--text-xs);
  letter-spacing: 0.14em;
  color: var(--svc-ink-soft);
  margin-right: var(--space-2);
}

.page-services .svc-cat {
  display: inline-flex;
  align-items: baseline;
  gap: var(--space-2);
  padding: var(--space-1) var(--space-3);
  border: var(--border-thin) solid var(--svc-line);
  border-radius: var(--radius-pill);
  text-decoration: none;
  color: var(--svc-ink);
  font-size: var(--text-sm);
  background: var(--svc-surface-alt);
}

.page-services .svc-cat:hover,
.page-services .svc-cat:focus-visible {
  border-color: var(--svc-accent);
  color: var(--svc-accent);
}

.page-services .svc-cat__count {
  font-size: var(--text-xs);
  color: var(--svc-ink-soft);
}

.page-services .svc-group {
  padding-block: var(--section-y);
}

.page-services .svc-group--alt {
  background: var(--svc-surface-alt);
}

.page-services .svc-list {
  display: grid;
  gap: var(--space-4);
  margin-top: var(--space-6);
}

.page-services .svc-list--three {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.page-services .svc-list--two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.page-services .svc-entry {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr);
  border: var(--border-thick) double var(--svc-line);
  background: var(--svc-surface);
}

.page-services .svc-entry__stub {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: var(--space-4) var(--space-2);
  border-right: var(--border-thin) dashed var(--svc-line);
  background: var(--svc-surface-alt);
}

.page-services .svc-entry__no {
  writing-mode: vertical-rl;
  text-orientation: mixed;
  font-size: var(--text-lg);
  font-weight: var(--weight-heading);
  letter-spacing: 0.18em;
  color: var(--svc-accent);
}

.page-services .svc-entry__body {
  padding: var(--space-4);
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.page-services .svc-entry__head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--space-2);
}

.page-services .svc-entry__title {
  font-family: var(--svc-heading);
  font-size: var(--text-xl);
  line-height: var(--leading-heading);
  margin: 0;
}

.page-services .svc-entry__desc {
  margin: 0;
  font-size: var(--text-base);
  line-height: var(--leading-body);
  color: var(--svc-ink);
}

.page-services .svc-entry__defs {
  margin: 0;
  display: grid;
  gap: var(--space-2);
}

.page-services .svc-entry__defs > div {
  border-left: var(--border-thick) solid var(--svc-highlight);
  padding-left: var(--space-3);
}

.page-services .svc-entry__defs dt {
  font-size: var(--text-xs);
  letter-spacing: 0.1em;
  color: var(--svc-ink-soft);
}

.page-services .svc-entry__defs dd {
  margin: var(--space-1) 0 0;
  font-size: var(--text-sm);
  line-height: var(--leading-body);
}

.page-services .svc-entry__more {
  border-top: var(--border-thin) solid var(--svc-line);
  padding-top: var(--space-2);
}

.page-services .svc-entry__more summary {
  cursor: pointer;
  font-size: var(--text-sm);
  font-weight: var(--weight-heading);
  color: var(--svc-accent);
}

.page-services .svc-entry__need {
  margin: var(--space-2) 0 0;
  padding-left: var(--space-4);
  font-size: var(--text-sm);
  line-height: var(--leading-body);
}

.page-services .svc-entry__foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-3);
  border-top: var(--border-thin) solid var(--svc-line);
  padding-top: var(--space-3);
}

.page-services .svc-entry__foot .note {
  font-size: var(--text-xs);
  color: var(--svc-ink-soft);
}

.page-services .svc-fix-layout,
.page-services .svc-fill-layout {
  display: grid;
  gap: var(--space-6);
  margin-top: var(--space-6);
}

.page-services .svc-fix-layout {
  grid-template-columns: minmax(0, 1fr) 320px;
  align-items: start;
}

.page-services .svc-fill-layout {
  grid-template-columns: 320px minmax(0, 1fr);
  align-items: start;
}

.page-services .svc-fix-layout .svc-list,
.page-services .svc-fill-layout .svc-list {
  margin-top: 0;
}

.page-services .svc-rule-figure,
.page-services .svc-export-figure {
  margin: var(--space-6) 0 0;
}

.page-services .svc-boundary {
  padding-block: var(--section-y);
}

.page-services .svc-boundary__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-6);
  margin-top: var(--space-6);
}

.page-services .svc-boundary__col {
  border: var(--border-thick) solid var(--svc-line);
  padding: var(--space-4);
  background: var(--svc-surface);
}

.page-services .svc-boundary__col--yes {
  border-left: 6px solid var(--verified);
}

.page-services .svc-boundary__col--no {
  border-left: 6px solid var(--doubt);
}

.page-services .svc-boundary__h {
  font-family: var(--svc-heading);
  font-size: var(--text-lg);
  margin: 0 0 var(--space-3);
}

.page-services .svc-boundary__list {
  margin: 0;
  padding-left: var(--space-4);
  display: grid;
  gap: var(--space-2);
  font-size: var(--text-sm);
  line-height: var(--leading-body);
}

.page-services .svc-states {
  margin-top: var(--space-8);
}

.page-services .svc-states__h,
.page-services .svc-flow__h {
  font-family: var(--svc-heading);
  font-size: var(--text-xl);
  margin: 0 0 var(--space-4);
}

.page-services .svc-states__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-4);
}

.page-services .svc-state {
  display: grid;
  gap: var(--space-2);
  border: var(--border-thin) solid var(--svc-line);
  padding: var(--space-4);
  background: var(--svc-surface);
}

.page-services .svc-state--verified {
  border-top: 6px solid var(--verified);
}

.page-services .svc-state--pending {
  border-top: 6px solid var(--pending);
}

.page-services .svc-state--doubt {
  border-top: 6px solid var(--doubt);
}

.page-services .svc-state__mark {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
}

.page-services .svc-state__name {
  font-family: var(--svc-heading);
  font-size: var(--text-lg);
}

.page-services .svc-state__desc {
  font-size: var(--text-sm);
  line-height: var(--leading-body);
  color: var(--svc-ink-soft);
}

.page-services .svc-flow {
  margin-top: var(--space-8);
}

.page-services .svc-flow__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: var(--space-3);
  counter-reset: svc-flow;
}

.page-services .svc-flow__list li {
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr);
  gap: var(--space-3);
  align-items: baseline;
  border-left: var(--border-thick) solid var(--svc-line);
  padding: var(--space-2) 0 var(--space-2) var(--space-4);
}

.page-services .svc-flow__step {
  font-size: var(--text-xs);
  letter-spacing: 0.1em;
  color: var(--svc-accent);
}

.page-services .svc-flow__txt {
  font-size: var(--text-sm);
  line-height: var(--leading-body);
}

.page-services .svc-contact {
  padding-block: var(--section-y);
  background: var(--svc-surface-alt);
}

.page-services .svc-contact__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-6);
  margin-top: var(--space-6);
}

.page-services .svc-contact__col {
  border: var(--border-thin) solid var(--svc-line);
  padding: var(--space-4);
  background: var(--svc-surface);
}

.page-services .svc-contact__h {
  font-family: var(--svc-heading);
  font-size: var(--text-lg);
  margin: 0 0 var(--space-2);
}

.page-services .svc-contact__v {
  margin: 0 0 var(--space-2);
  font-size: var(--text-base);
  font-weight: var(--weight-heading);
  word-break: break-all;
}

.page-services .svc-contact__note {
  margin: 0;
  font-size: var(--text-sm);
  line-height: var(--leading-body);
  color: var(--svc-ink-soft);
}

.page-services .svc-contact__more {
  margin-top: var(--space-6);
  font-size: var(--text-sm);
  line-height: var(--leading-body);
}

.page-services .svc-contact__more a {
  color: var(--svc-accent);
}

@media (max-width: 960px) {
  .page-services .svc-hero__stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .page-services .svc-list--three,
  .page-services .svc-list--two,
  .page-services .svc-states__list,
  .page-services .svc-contact__grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .page-services .svc-fix-layout,
  .page-services .svc-fill-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .page-services .svc-boundary__grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 640px) {
  .page-services .svc-hero__stats {
    grid-template-columns: minmax(0, 1fr);
  }

  .page-services .svc-entry {
    grid-template-columns: 56px minmax(0, 1fr);
  }

  .page-services .svc-flow__list li {
    grid-template-columns: minmax(0, 1fr);
  }
}
