@charset "UTF-8";

:root {
  --page-max: 1200px;
  --page-pad: 24px;
  --header-height: 78px;
  --service-grid: rgba(0, 47, 108, 0.075);
  --service-grid-invert: rgba(255, 255, 255, 0.065);
  --service-focus: #ff0000;
  --service-font-display: "Inter", "Helvetica Neue", Arial, sans-serif;
  --service-font-body: "Inter", "Helvetica Neue", Arial, sans-serif;
  --service-font-data: "Manrope", "Inter", Arial, sans-serif;
}

/* ERA-GLONASS / ASN service page */
.era-page {
  --era-surface: #f3f7fc;
  --era-surface-strong: #eaf1f9;
  --era-ink: #041f43;
  --era-muted: #5a6b80;
  --era-border: rgba(7, 43, 86, 0.14);
  background: #fff;
  color: var(--era-ink);
}

.era-page main {
  overflow: clip;
}

.era-container {
  width: min(100% - 48px, 1200px);
  margin-inline: auto;
}

.era-section {
  padding: 96px 0;
}

.era-section--soft {
  background: var(--era-surface);
}

.era-section--navy {
  background:
    radial-gradient(circle at 83% 18%, rgba(255, 0, 0, 0.13), transparent 28%),
    linear-gradient(135deg, #031d40 0%, #002e6b 100%);
  color: #fff;
}

.era-section__head {
  display: grid;
  grid-template-columns: minmax(0, 0.82fr) minmax(280px, 1.18fr);
  gap: 56px;
  align-items: end;
  margin-bottom: 48px;
}

.era-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 16px;
  color: var(--sv-red);
  font: 700 12px/1.2 var(--font-body);
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.era-eyebrow::before {
  width: 8px;
  height: 8px;
  background: currentColor;
  content: "";
}

.era-section__head h2,
.era-documentation__head h2,
.era-installation__intro h2,
.era-final-cta h2 {
  max-width: 780px;
  margin: 0;
  color: inherit;
  font-family: var(--font-display);
  font-size: clamp(34px, 4.2vw, 62px);
  font-weight: 700;
  letter-spacing: -0.045em;
  line-height: 0.98;
}

.era-section__head > p,
.era-documentation__head > p {
  max-width: 680px;
  margin: 0;
  color: var(--era-muted);
  font-size: 17px;
  line-height: 1.65;
}

.era-section--navy .era-section__head > p,
.era-section--navy .era-documentation__head > p {
  color: rgba(255, 255, 255, 0.72);
}

.era-hero {
  --hero-enter-distance: 18px;
  --hero-enter-ease: cubic-bezier(0.16, 1, 0.3, 1);
  --hero-orbit-rotation: 0deg;

  position: relative;
  min-height: calc(100svh - var(--header-height));
  overflow: hidden;
  border-bottom: 1px solid rgba(0, 47, 108, 0.12);
  background: var(--sv-ground, #eff2f7);
  isolation: isolate;
}

.era-hero::before {
  position: absolute;
  inset: 0 auto 0 0;
  width: 72%;
  background-color: var(--sv-navy, #002f6c);
  background-image: url("./tachograph-paper-grid.svg?v=20260720-5");
  background-position: left top;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  content: "";
  pointer-events: none;
}

.era-hero__layout {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(390px, 0.85fr);
  gap: clamp(44px, 4.5vw, 60px);
  align-items: center;
  min-height: calc(100svh - var(--header-height));
}

.era-hero__copy {
  padding: 76px 0 72px;
}

.era-hero__copy h1 {
  max-width: 760px;
  margin: 0;
  color: #fff;
  font-family: var(--font-display);
  font-size: clamp(44px, 3.5vw, 52px);
  font-weight: 700;
  letter-spacing: -0.055em;
  line-height: 0.94;
}

.era-hero__copy h1 .era-hero-title__accent {
  color: var(--sv-red);
}

.era-page .era-hero__copy .hero-title__clip {
  display: inline-block;
}

.era-page .era-hero__copy .hero-title__line:last-child {
  white-space: normal;
}

.era-hero__lead {
  max-width: 690px;
  margin: 28px 0 0;
  color: rgba(255, 255, 255, 0.74);
  font-size: 16px;
  line-height: 1.58;
}

.era-hero__lead strong,
.era-hero__lead span {
  display: block;
}

.era-hero__lead strong {
  max-width: 660px;
  color: #fff;
  font-size: 19px;
  font-weight: 700;
  letter-spacing: -0.015em;
  line-height: 1.38;
}

.era-hero__lead span {
  margin-top: 9px;
}

.era-hero__actions,
.era-final-cta__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 32px;
}

.era-button {
  display: inline-flex;
  min-height: 52px;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 13px 22px;
  border: 1px solid var(--sv-navy);
  background: var(--sv-navy);
  color: #fff;
  font-family: var(--font-display);
  font-size: 14px;
  font-weight: 700;
  text-align: center;
  text-decoration: none;
  transition: transform 160ms cubic-bezier(0.23, 1, 0.32, 1), background-color 200ms ease, border-color 200ms ease, color 200ms ease;
}

.era-button--secondary {
  background: transparent;
  color: var(--sv-navy);
}

.era-hero .button--primary {
  min-width: 260px;
  border-color: #fff;
  background-color: #fff;
  background-image: linear-gradient(90deg, var(--sv-red, #ff0000) 50%, transparent 50%);
  color: var(--sv-navy, #002f6c);
}

.era-hero .button--primary:hover,
.era-hero .button--primary:focus-visible {
  color: #fff;
}

.era-button:focus-visible,
.era-document-card:focus-visible,
.era-law-card__cta:focus-visible,
.era-vehicle-hotspot summary:focus-visible {
  outline: 3px solid rgba(255, 0, 0, 0.38);
  outline-offset: 3px;
}

.era-button:active,
.era-document-card:active,
.era-law-card__cta:active {
  transform: scale(0.97);
}

.era-hero__proof {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  max-width: 710px;
  margin: 42px 0 0;
  border-top: 1px solid rgba(255, 255, 255, 0.24);
}

.era-hero__proof div {
  padding: 20px 18px 0 0;
}

.era-hero__proof div + div {
  padding-left: 18px;
  border-left: 1px solid rgba(255, 255, 255, 0.2);
}

.era-hero__proof dt {
  color: #fff;
  font-family: var(--font-display);
  font-size: 24px;
  font-weight: 700;
}

.era-hero__proof dd {
  margin: 6px 0 0;
  color: rgba(255, 255, 255, 0.66);
  font-size: 13px;
  line-height: 1.45;
}

.era-hero-visual {
  position: relative;
  display: grid;
  min-height: 620px;
  place-items: center;
  isolation: isolate;
}

.era-page .era-hero-visual__orbit {
  position: absolute;
  top: 50%;
  left: 50%;
  right: auto;
  bottom: auto;
  width: min(680px, 140%);
  height: auto;
  aspect-ratio: 1;
  border: 0;
  border-radius: 50%;
  background: transparent;
  box-shadow: none;
  translate: -50% -50%;
}

.era-page .era-hero-visual__orbit::before {
  position: absolute;
  inset: 95px;
  border: 1px solid rgba(139, 177, 224, 0.42);
  border-radius: 50%;
  content: "";
}

.era-page .era-hero-visual__orbit::after {
  content: none;
}

.era-hero-visual__media {
  position: relative;
  z-index: 2;
  width: min(437px, 85.05%);
  transform: none;
  filter: drop-shadow(20px 30px 24px rgba(0, 26, 61, 0.23));
}

.era-hero-visual__media img {
  display: block;
  width: 100%;
  height: auto;
}

.era-page .era-hero-visual__wordmark {
  right: -92px;
  z-index: 0;
  color: rgba(0, 47, 108, 0.075);
  font-size: clamp(92px, 7.65vw, 110px);
}

.era-page .era-hero-visual__orbit .hero-orbit-outline path {
  stroke: rgba(139, 177, 224, 0.62);
}

.era-page .era-hero-visual__orbit .hero-orbit-slogan text {
  fill: rgba(139, 177, 224, 0.8);
}

.era-page .era-hero-visual__orbit .era-hero-orbit__text {
  dominant-baseline: middle;
  font-size: 10.5px;
  letter-spacing: 0.12em;
}

.era-page .era-hero-visual__orbit .era-hero-orbit__dot {
  fill: var(--sv-red, #ff0000);
  font-size: 12px;
  letter-spacing: 0;
}

.js .era-page .era-hero .era-eyebrow,
.js .era-page .era-hero .era-hero__lead,
.js .era-page .era-hero .era-hero__actions,
.js .era-page .era-hero .era-hero__proof,
.js .era-page .era-hero .hero-title__fragment,
.js .era-page .era-hero .hero-product-orbit,
.js .era-page .era-hero .hero-visual-wordmark {
  opacity: 0;
}

.js .era-page.is-ready .era-hero .era-eyebrow {
  opacity: 1;
  animation: service-hero-enter-left 500ms var(--hero-enter-ease) 100ms backwards;
}

.js .era-page.is-ready .era-hero .hero-title__fragment {
  opacity: 1;
  animation: driver-hero-title-reveal 480ms var(--hero-enter-ease) var(--hero-reveal-delay, 140ms) backwards;
}

.js .era-page.is-ready .era-hero .era-hero__lead {
  opacity: 1;
  animation: service-hero-enter-up 440ms var(--hero-enter-ease) 560ms backwards;
}

.js .era-page.is-ready .era-hero .era-hero__actions {
  opacity: 1;
  animation: service-hero-enter-up 440ms var(--hero-enter-ease) 760ms backwards;
}

.js .era-page.is-ready .era-hero .era-hero__proof {
  opacity: 1;
  animation: service-hero-enter-up 420ms var(--hero-enter-ease) 960ms backwards;
}

.js .era-page.is-ready .era-hero .hero-product-orbit {
  opacity: 1;
  transform: rotate(var(--hero-orbit-rotation));
  animation: service-hero-orbit-in 700ms var(--hero-enter-ease) 160ms backwards;
}

.js .era-page.is-ready .era-hero .hero-visual-wordmark {
  opacity: 1;
  animation: service-hero-wordmark-in 650ms var(--hero-enter-ease) 220ms backwards;
}

@media (prefers-reduced-motion: reduce) {
  .js .era-page .era-hero .era-eyebrow,
  .js .era-page .era-hero .era-hero__lead,
  .js .era-page .era-hero .era-hero__actions,
  .js .era-page .era-hero .era-hero__proof,
  .js .era-page .era-hero .hero-title__fragment,
  .js .era-page .era-hero .hero-product-orbit,
  .js .era-page .era-hero .hero-visual-wordmark {
    opacity: 1 !important;
    animation: none !important;
  }

  .js .era-page .era-hero .hero-product-orbit {
    opacity: 1 !important;
    transform: rotate(var(--hero-orbit-rotation)) !important;
    animation: none !important;
  }
}

.era-hero-visual__label,
.era-hero-visual__note {
  position: absolute;
  z-index: 3;
  border: 1px solid rgba(0, 47, 108, 0.16);
  background: #fff;
  box-shadow: 0 16px 40px rgba(0, 31, 70, 0.12);
  color: var(--sv-navy-deep);
}

.era-hero-visual__label {
  top: 13%;
  right: -2%;
  padding: 12px 16px;
  border-top: 3px solid var(--sv-red);
  font: 700 11px/1.2 var(--font-display);
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.era-hero-visual__note {
  bottom: 12%;
  left: -2%;
  display: grid;
  gap: 4px;
  max-width: 300px;
  margin: 0;
  padding: 15px 18px;
}

.era-hero-visual__note strong {
  font: 700 15px/1.2 var(--font-display);
}

.era-hero-visual__note span {
  color: #5e7086;
  font-size: 11px;
  line-height: 1.4;
}

.era-signal-board {
  position: relative;
  padding: 28px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  background: linear-gradient(145deg, #062b5e 0%, #001b3d 100%);
  box-shadow: 0 28px 80px rgba(1, 30, 68, 0.22);
  color: #fff;
}

.era-signal-board::before {
  position: absolute;
  inset: 12px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  pointer-events: none;
  content: "";
}

.era-signal-board__top {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding-bottom: 22px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.14);
}

.era-signal-board__top strong {
  font: 700 15px/1.25 var(--font-display);
  letter-spacing: 0.02em;
}

.era-signal-board__status {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: #c7d8eb;
  font-size: 12px;
}

.era-signal-board__status::before {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #55df94;
  box-shadow: 0 0 0 5px rgba(85, 223, 148, 0.11);
  content: "";
}

.era-signal-route {
  position: relative;
  display: grid;
  grid-template-columns: 74px minmax(0, 1fr);
  gap: 18px;
  padding: 28px 0;
}

.era-signal-route + .era-signal-route {
  border-top: 1px solid rgba(255, 255, 255, 0.14);
}

.era-signal-route__number {
  display: grid;
  width: 64px;
  height: 64px;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, 0.28);
  color: #fff;
  font: 700 16px/1 var(--font-display);
}

.era-signal-route h2 {
  margin: 0;
  font: 700 20px/1.2 var(--font-display);
}

.era-signal-route p {
  margin: 8px 0 0;
  color: rgba(255, 255, 255, 0.7);
  font-size: 14px;
  line-height: 1.5;
}

.era-signal-route__flow {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 16px;
  color: #d8e5f2;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.era-signal-route__flow i {
  width: 18px;
  height: 1px;
  background: var(--sv-red);
}

.era-visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

.era-requirements {
  position: relative;
  background: #f0f2f8;
}

.era-requirements__intro {
  max-width: 980px;
  margin-bottom: clamp(28px, 3.4vw, 44px);
}

.era-requirements__intro .era-eyebrow {
  margin: 0 0 14px;
  color: var(--sv-red);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.14em;
  line-height: 1.3;
  text-transform: uppercase;
}

.era-requirements__intro h2 {
  max-width: 940px;
  margin: 0;
  color: var(--sv-navy-deep);
  font-family: var(--font-display);
  font-size: clamp(36px, 3.45vw, 50px);
  font-weight: 700;
  letter-spacing: -0.045em;
  line-height: 1.04;
  text-wrap: balance;
}

.era-requirements__intro p {
  max-width: 840px;
  margin: 16px 0 0;
  color: var(--era-muted);
  font-size: 16px;
  line-height: 1.55;
}

.era-vehicle-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
}

.era-vehicle-card {
  position: relative;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  border: 1px solid var(--era-border);
  background: #fff;
  box-shadow: 0 24px 70px rgba(1, 31, 69, 0.08);
}

.era-vehicle-card--forest {
  border-color: rgba(255, 255, 255, 0.12);
  background: var(--sv-navy-deep);
  color: #fff;
}

.era-vehicle-card__visual {
  position: relative;
  min-height: 330px;
  overflow: hidden;
  border-bottom: 1px solid var(--era-border);
  background: #fff;
}

.era-vehicle-card--forest .era-vehicle-card__visual {
  border-color: rgba(255, 255, 255, 0.14);
  background: #073b7a;
}

.era-vehicle-card__regulation {
  position: absolute;
  z-index: 3;
  top: 26px;
  left: 28px;
  display: grid;
  margin: 0;
  color: var(--sv-navy-deep);
  font-family: var(--font-display);
  line-height: 1;
}

.era-vehicle-card--forest .era-vehicle-card__regulation {
  color: #fff;
}

.era-vehicle-card__regulation span {
  color: var(--sv-red);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.era-vehicle-card__regulation strong {
  margin-top: 5px;
  font-size: 31px;
  letter-spacing: -0.05em;
}

.era-vehicle-card__stage {
  position: absolute;
  top: 54%;
  left: 50%;
  width: 112%;
  aspect-ratio: 2048 / 980;
  transform: translate(-50%, -50%);
}

.era-vehicle-card--bus .era-vehicle-card__stage {
  width: 103%;
}

.era-vehicle-card--forest .era-vehicle-card__stage {
  width: 100%;
}

.era-vehicle-card__image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.era-vehicle-card__visual-note {
  position: absolute;
  z-index: 3;
  right: 24px;
  bottom: 20px;
  margin: 0;
  color: rgba(4, 31, 67, 0.65);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.03em;
}

.era-vehicle-card--forest .era-vehicle-card__visual-note {
  color: rgba(4, 31, 67, 0.65);
}

.era-vehicle-card__visual-note span {
  color: var(--sv-red);
}

.era-vehicle-hotspot {
  position: absolute;
  z-index: 5;
  top: var(--point-y);
  left: var(--point-x);
  width: 44px;
  height: 44px;
  transform: translate(-50%, -50%);
}

.era-vehicle-hotspot summary {
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  border-radius: 50%;
  cursor: pointer;
  list-style: none;
}

.era-vehicle-hotspot summary::-webkit-details-marker {
  display: none;
}

.era-vehicle-hotspot summary::before {
  position: absolute;
  inset: 3px;
  border: 1px solid rgba(255, 0, 0, 0.42);
  border-radius: 50%;
  content: "";
  animation: era-hotspot-pulse 2.4s ease-out infinite;
}

.era-vehicle-hotspot__marker {
  position: relative;
  z-index: 1;
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border: 1px solid var(--sv-navy);
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 8px 22px rgba(1, 31, 69, 0.22);
  transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.era-vehicle-hotspot__marker img {
  width: 16px;
  height: 16px;
  transition: transform 180ms ease;
}

.era-vehicle-hotspot[open] {
  z-index: 8;
}

.era-vehicle-hotspot[open] .era-vehicle-hotspot__marker {
  border-color: var(--sv-red);
  box-shadow: 0 8px 28px rgba(255, 0, 0, 0.22);
}

.era-vehicle-hotspot[open] .era-vehicle-hotspot__marker img {
  transform: rotate(45deg);
}

.era-vehicle-hotspot__panel {
  position: absolute;
  top: 50%;
  left: 52px;
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  width: 292px;
  padding: 12px;
  border: 1px solid rgba(0, 47, 108, 0.18);
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 18px 44px rgba(1, 31, 69, 0.2);
  color: var(--sv-navy-deep);
  transform: translateY(-50%);
}

.era-vehicle-hotspot__panel::before {
  position: absolute;
  top: calc(50% - 1px);
  right: 100%;
  width: 14px;
  height: 2px;
  background: var(--sv-red);
  content: "";
}

.era-vehicle-hotspot__panel > img {
  width: 72px;
  height: 62px;
  object-fit: contain;
}

.era-vehicle-hotspot__panel p {
  margin: 0;
}

.era-vehicle-hotspot__panel strong,
.era-vehicle-hotspot__panel span {
  display: block;
}

.era-vehicle-hotspot__panel strong {
  font-family: var(--font-display);
  font-size: 12px;
  line-height: 1.25;
}

.era-vehicle-hotspot__panel span {
  margin-top: 5px;
  color: var(--era-muted);
  font-size: 10px;
  line-height: 1.35;
}

.era-vehicle-card__content {
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr) auto auto;
  padding: 34px 36px 38px;
}

.era-vehicle-card__content .era-eyebrow {
  margin-bottom: 14px;
}

.era-vehicle-card__content h3 {
  max-width: 520px;
  margin: 0;
  color: inherit;
  font-family: var(--font-display);
  font-size: clamp(30px, 2.7vw, 42px);
  font-weight: 700;
  letter-spacing: -0.04em;
  line-height: 1.02;
}

.era-vehicle-card__content > p:not(.era-eyebrow) {
  max-width: 570px;
  margin: 20px 0 0;
  color: var(--era-muted);
  font-size: 15px;
  line-height: 1.66;
}

.era-vehicle-card--forest .era-vehicle-card__content > p:not(.era-eyebrow) {
  color: rgba(255, 255, 255, 0.7);
}

.era-vehicle-card__facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  min-height: 90px;
  margin: 28px 0 0;
  border-top: 1px solid var(--era-border);
  border-bottom: 1px solid var(--era-border);
}

.era-vehicle-card--forest .era-vehicle-card__facts {
  border-color: rgba(255, 255, 255, 0.16);
}

.era-vehicle-card__facts div {
  padding: 16px 16px 17px 0;
}

.era-vehicle-card__facts div + div {
  padding-left: 18px;
  border-left: 1px solid var(--era-border);
}

.era-vehicle-card--forest .era-vehicle-card__facts div + div {
  border-color: rgba(255, 255, 255, 0.16);
}

.era-vehicle-card__facts dt {
  color: inherit;
  font: 700 14px/1.2 var(--font-display);
}

.era-vehicle-card__facts dd {
  margin: 5px 0 0;
  color: var(--era-muted);
  font-size: 11px;
  line-height: 1.38;
}

.era-vehicle-card--forest .era-vehicle-card__facts dd {
  color: rgba(255, 255, 255, 0.65);
}

.era-law-card__cta {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-top: 30px;
  color: var(--sv-navy);
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
  transition: transform 160ms cubic-bezier(0.23, 1, 0.32, 1), color 180ms ease;
}

.era-vehicle-card--forest .era-law-card__cta {
  color: #fff;
}

.era-law-card__cta span {
  color: var(--sv-red);
}

.era-vehicle-slider {
  position: relative;
  background: transparent;
}

.era-vehicle-slider__nav {
  position: relative;
  z-index: 3;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: clamp(24px, 3vw, 48px);
  align-items: end;
  padding-bottom: 18px;
  border-bottom: 1px solid rgba(1, 31, 69, 0.16);
}

.era-vehicle-slider__tabs {
  display: grid;
  max-width: 850px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(14px, 2vw, 32px);
}

.era-vehicle-slider__tabs button {
  position: relative;
  display: grid;
  min-width: 0;
  min-height: 54px;
  gap: 7px;
  align-content: end;
  padding: 0 0 13px;
  border: 0;
  background: transparent;
  color: rgba(1, 31, 69, 0.56);
  font-family: var(--font-display);
  text-align: left;
  cursor: pointer;
  touch-action: manipulation;
  transition: color 180ms ease, transform 140ms cubic-bezier(0.23, 1, 0.32, 1);
}

.era-vehicle-slider__tabs button::after {
  position: absolute;
  right: 0;
  bottom: -19px;
  left: 0;
  height: 3px;
  background: var(--sv-red);
  content: "";
  opacity: 0;
  transform: scaleX(0.42);
  transform-origin: left center;
  transition: opacity 180ms ease, transform 220ms cubic-bezier(0.23, 1, 0.32, 1);
}

.era-vehicle-slider__tabs button > span {
  color: var(--sv-red);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.14em;
  line-height: 1;
}

.era-vehicle-slider__tabs button > strong {
  overflow: hidden;
  font-size: 13px;
  font-weight: 750;
  line-height: 1.28;
  text-overflow: ellipsis;
}

.era-vehicle-slider__tabs button.is-active {
  color: var(--sv-navy-deep);
}

.era-vehicle-slider__tabs button.is-active::after {
  opacity: 1;
  transform: scaleX(1);
}

.era-vehicle-slider__viewport {
  display: grid;
  overflow: hidden;
}

.era-vehicle-slide {
  grid-area: 1 / 1;
  display: grid;
  grid-template-columns: minmax(360px, 1.04fr) minmax(0, 0.96fr);
  gap: clamp(42px, 5vw, 76px);
  min-height: 406px;
  align-items: center;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateX(14px);
  transition: opacity 200ms cubic-bezier(0.23, 1, 0.32, 1), transform 240ms cubic-bezier(0.23, 1, 0.32, 1), visibility 0s linear 240ms;
}

.era-vehicle-slide.is-active {
  z-index: 1;
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: none;
  transition-delay: 0s;
}

.era-vehicle-slide__media {
  position: relative;
  min-width: 0;
  min-height: 406px;
  overflow: hidden;
  background: transparent;
  isolation: isolate;
}

.era-vehicle-slide__shadow {
  position: absolute;
  z-index: 0;
  right: 14%;
  bottom: 13.5%;
  left: 14%;
  height: 16px;
  border-radius: 50%;
  background: radial-gradient(ellipse at center, rgba(1, 31, 69, 0.34) 0%, rgba(1, 31, 69, 0.18) 38%, rgba(1, 31, 69, 0) 74%);
  filter: blur(5px);
  opacity: 0.66;
  transform: scaleX(0.84);
}

.era-vehicle-slide__shadow--truck {
  right: 13%;
  left: 13%;
  transform: scaleX(0.88);
}

.era-vehicle-slide__shadow--garbage {
  right: 12%;
  left: 12%;
  transform: scaleX(0.9);
}

.era-vehicle-slide__image {
  position: absolute;
  z-index: 1;
  top: auto;
  bottom: 11.5%;
  left: 50%;
  display: block;
  width: 107%;
  max-width: none;
  height: auto;
  transform: translateX(-50%);
}

.era-vehicle-slide__image--truck {
  width: 101%;
}

.era-vehicle-slide__image--garbage {
  width: 102%;
}

.era-vehicle-slide__content {
  display: flex;
  min-width: 0;
  padding: 34px 0 30px;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  background: transparent;
}

.era-vehicle-slide__content .era-eyebrow {
  max-width: 600px;
  margin: 0;
  line-height: 1.55;
}

.era-vehicle-slide__content h3 {
  max-width: 600px;
  margin: 16px 0 0;
  color: var(--sv-navy-deep);
  font-family: var(--font-display);
  font-size: clamp(32px, 2.75vw, 42px);
  font-weight: 700;
  letter-spacing: -0.035em;
  line-height: 1.08;
  text-wrap: balance;
}

.era-vehicle-slide__content .era-vehicle-slide__eyebrow {
  margin: 0 0 26px;
  font-size: 11px;
  font-weight: 800;
}

.era-vehicle-slide__summary {
  max-width: 580px;
  margin: 18px 0 0;
  color: var(--era-muted);
  font-size: 16px;
  line-height: 1.58;
}

.era-vehicle-slide__route {
  display: flex;
  max-width: 580px;
  gap: 8px 16px;
  align-items: baseline;
  margin: 22px 0 0;
  padding-left: 14px;
  border-left: 2px solid var(--sv-red);
  color: var(--era-muted);
  line-height: 1.35;
}

.era-vehicle-slide__route span {
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.era-vehicle-slide__route strong {
  color: var(--sv-navy-deep);
  font-size: 13px;
  font-weight: 800;
}

.era-vehicle-slide__link {
  display: inline-flex;
  min-height: 44px;
  gap: 10px;
  align-items: center;
  justify-content: center;
  margin-top: 20px;
  padding: 0;
  color: var(--sv-navy);
  font-size: 13px;
  font-weight: 800;
  text-decoration: underline;
  text-decoration-color: rgba(0, 47, 108, 0.32);
  text-decoration-thickness: 1px;
  text-underline-offset: 5px;
  transition: color 180ms ease, text-decoration-color 180ms ease;
}

.era-vehicle-slide__link span {
  color: var(--sv-red);
  transition: transform 180ms ease;
}

.era-vehicle-slider__controls {
  display: flex;
  min-height: 48px;
  gap: 18px;
  align-items: center;
  justify-content: flex-end;
  background: transparent;
}

.era-vehicle-slider__count {
  display: flex;
  gap: 9px;
  align-items: baseline;
  margin: 0;
  color: var(--era-muted);
  font: 700 14px/1 var(--font-display);
}

.era-vehicle-slider__count strong {
  color: var(--sv-navy-deep);
  font-size: 24px;
  letter-spacing: -0.04em;
}

.era-vehicle-slider__arrows {
  display: flex;
  gap: 8px;
}

.era-vehicle-slider__arrows button {
  display: grid;
  width: 48px;
  min-height: 48px;
  padding: 0;
  place-items: center;
  border: 0;
  background: var(--sv-navy);
  color: #fff;
  cursor: pointer;
  touch-action: manipulation;
  transition: background-color 180ms ease, color 180ms ease, transform 140ms cubic-bezier(0.23, 1, 0.32, 1);
}

.era-vehicle-slider__arrows svg {
  width: 22px;
  height: 22px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: square;
  stroke-linejoin: miter;
  stroke-width: 1.8;
}

.era-vehicle-slide__link:focus-visible,
.era-vehicle-slider__tabs button:focus-visible,
.era-vehicle-slider__arrows button:focus-visible {
  position: relative;
  z-index: 1;
  outline: 3px solid rgba(0, 47, 108, 0.28);
  outline-offset: 4px;
}

@media (hover: hover) and (pointer: fine) {
  .era-vehicle-slide__link:hover {
    color: var(--sv-red);
    text-decoration-color: var(--sv-red);
  }

  .era-vehicle-slide__link:hover span {
    transform: translate(2px, -2px);
  }

  .era-vehicle-slider__arrows button:hover {
    background: var(--sv-red);
    color: #fff;
  }

  .era-vehicle-slider__tabs button:hover {
    color: var(--sv-navy-deep);
  }
}

.era-vehicle-slider__tabs button:active,
.era-vehicle-slider__arrows button:active {
  transform: scale(0.96);
}

@media (max-width: 900px) {
  .era-requirements__intro {
    margin-bottom: 30px;
  }

  .era-requirements__intro h2 {
    font-size: clamp(34px, 6.2vw, 48px);
  }

  .era-vehicle-slider__nav {
    gap: 20px;
  }

  .era-vehicle-slider__tabs {
    gap: 12px;
  }

  .era-vehicle-slider__tabs button > strong {
    font-size: 12px;
  }

  .era-vehicle-slide {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
    min-height: 0;
  }

  .era-vehicle-slide__media {
    min-height: 330px;
  }

  .era-vehicle-slide__image {
    bottom: 1%;
    width: min(740px, 98%);
  }

  .era-vehicle-slide__image--truck {
    width: min(710px, 94%);
  }

  .era-vehicle-slide__image--garbage {
    width: min(720px, 96%);
  }

  .era-vehicle-slide__shadow {
    right: 12%;
    bottom: 5%;
    left: 12%;
    height: 16px;
    filter: blur(5px);
  }

  .era-vehicle-slide__content {
    max-width: 700px;
    padding: 18px 0 8px;
  }

  .era-vehicle-slide__content h3,
  .era-vehicle-slide__summary {
    max-width: 680px;
  }
}

@media (max-width: 600px) {
  .era-requirements__intro {
    margin-bottom: 28px;
  }

  .era-requirements__intro h2 {
    font-size: clamp(27px, 8.4vw, 34px);
    line-height: 1.06;
  }

  .era-requirements__intro p {
    margin-top: 14px;
    font-size: 15.5px;
    line-height: 1.55;
  }

  .era-vehicle-slider__nav {
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
    padding-bottom: 14px;
  }

  .era-vehicle-slider__tabs {
    gap: 8px;
  }

  .era-vehicle-slider__tabs button {
    min-height: 58px;
    gap: 6px;
    padding-bottom: 10px;
  }

  .era-vehicle-slider__tabs button::after {
    bottom: -15px;
  }

  .era-vehicle-slider__tabs button > span {
    font-size: 9px;
  }

  .era-vehicle-slider__tabs button > strong {
    font-size: 10.5px;
    line-height: 1.25;
  }

  .era-vehicle-slider__controls {
    min-height: 44px;
    gap: 14px;
  }

  .era-vehicle-slide__media {
    min-height: 236px;
  }

  .era-vehicle-slide__image {
    width: 108%;
  }

  .era-vehicle-slide__image--truck {
    width: 102%;
  }

  .era-vehicle-slide__image--garbage {
    width: 104%;
  }

  .era-vehicle-slide__shadow {
    right: 8%;
    bottom: 5%;
    left: 8%;
    height: 14px;
    filter: blur(4px);
  }

  .era-vehicle-slide__content {
    padding: 0;
  }

  .era-vehicle-slide__content .era-eyebrow {
    line-height: 1.5;
  }

  .era-vehicle-slide__content h3 {
    margin-top: 16px;
    font-size: clamp(25px, 7.6vw, 29px);
    line-height: 1.08;
  }

  .era-vehicle-slide__summary {
    margin-top: 16px;
    font-size: 15.5px;
  }

  .era-vehicle-slide__route {
    display: grid;
    gap: 5px;
    margin-top: 18px;
  }

  .era-vehicle-slide__link {
    width: auto;
    margin-top: 20px;
  }

  .era-vehicle-slider__controls {
    justify-content: flex-end;
  }

  .era-vehicle-slider__arrows button {
    width: 44px;
    min-height: 44px;
  }
}

/* Vehicle showcase: reference-led slider with an active vehicle and next-slide preview. */
.era-requirements__intro {
  width: 70%;
  max-width: none;
  margin-left: 30%;
  margin-bottom: clamp(30px, 3.2vw, 42px);
  text-align: right;
}

.era-requirements__intro h2 {
  max-width: none;
  font-size: clamp(36px, 3vw, 44px);
  white-space: nowrap;
}

.era-requirements__intro p {
  max-width: none;
  margin-left: auto;
}

.era-vehicle-slider {
  position: relative;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  isolation: isolate;
}

.era-vehicle-slider__viewport {
  position: relative;
  display: grid;
  min-height: 590px;
  overflow: hidden;
}

.era-vehicle-slide {
  position: relative;
  grid-area: 1 / 1;
  display: grid;
  min-height: 590px;
  grid-template-columns: minmax(0, 42%) minmax(0, 58%);
  gap: 0;
  align-items: stretch;
  overflow: hidden;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateX(22px);
  transition: opacity 220ms cubic-bezier(0.23, 1, 0.32, 1), transform 280ms cubic-bezier(0.23, 1, 0.32, 1), visibility 0s linear 280ms;
}

.era-vehicle-slide.is-active {
  z-index: 1;
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: none;
  transition-delay: 0s;
}

.era-vehicle-slide__content {
  position: relative;
  z-index: 3;
  display: flex;
  min-width: 0;
  margin-left: 30px;
  padding: calc(clamp(54px, 4.4vw, 66px) + 10px) 0 100px;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  background: transparent;
}

.era-vehicle-slide__content h3 {
  max-width: 504px;
  margin: 0;
  color: var(--sv-navy-deep);
  font-family: var(--font-display);
  font-size: clamp(28px, 2.35vw, 34px);
  font-weight: 700;
  letter-spacing: -0.045em;
  line-height: 1.02;
  text-wrap: balance;
}

.era-vehicle-slide__title-clip {
  display: block;
  overflow: hidden;
  margin-bottom: -0.08em;
  padding-bottom: 0.08em;
}

@media (min-width: 601px) {
  .era-vehicle-slide__title-line {
    display: block;
    white-space: nowrap;
  }
}

.era-vehicle-slide__regulation {
  margin: clamp(26px, 2.6vw, 36px) 0 0;
  color: rgba(255, 255, 255, 0.88);
  font-family: var(--font-display);
  font-size: clamp(66px, 6.7vw, 96px);
  font-weight: 750;
  letter-spacing: -0.07em;
  line-height: 0.88;
  white-space: nowrap;
  text-shadow: 0 1px 0 rgba(1, 31, 69, 0.03);
}

.era-vehicle-slide__summary {
  max-width: 455px;
  margin: clamp(24px, 2.2vw, 32px) 0 0;
  color: rgba(1, 31, 69, 0.67);
  font-size: 16px;
  line-height: 1.55;
}

.era-vehicle-slide__actions {
  display: flex;
  min-height: 44px;
  gap: 22px;
  align-items: center;
  margin-top: 22px;
}

.era-vehicle-slide__details {
  display: inline-flex;
  min-width: 116px;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  padding: 0 22px;
  border: 1px solid var(--sv-navy);
  border-radius: 0;
  background-color: var(--sv-navy);
  background-image: linear-gradient(90deg, var(--sv-red, #ff0000) 50%, transparent 50%);
  background-position: 100% 0;
  background-repeat: no-repeat;
  background-size: 200% 100%;
  color: #fff;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.015em;
  line-height: 1;
  cursor: pointer;
  touch-action: manipulation;
  transition: background-position 0.46s var(--ease-out, ease), border-color 180ms ease, color 180ms ease, transform 140ms cubic-bezier(0.23, 1, 0.32, 1);
}

.era-vehicle-slide__link {
  display: inline-flex;
  width: auto;
  min-height: 44px;
  gap: 0;
  align-items: center;
  justify-content: center;
  margin-top: 22px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--sv-navy);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.015em;
  line-height: 1.25;
  text-align: center;
  text-decoration: underline;
  text-decoration-color: rgba(0, 47, 108, 0.34);
  text-decoration-thickness: 1px;
  text-underline-offset: 5px;
  transition: color 180ms ease, text-decoration-color 180ms ease, transform 140ms cubic-bezier(0.23, 1, 0.32, 1);
}

.era-vehicle-slide__actions .era-vehicle-slide__link {
  margin-top: 0;
}

.js .era-page .era-vehicle-slide__eyebrow,
.js .era-page .era-vehicle-slide__title-line,
.js .era-page .era-vehicle-slide__regulation,
.js .era-page .era-vehicle-slide__summary,
.js .era-page .era-vehicle-slide__actions,
.js .era-page .era-vehicle-slide__content > .era-vehicle-slide__link {
  opacity: 0;
}

.js .era-page .era-vehicle-slide.is-active .era-vehicle-slide__eyebrow {
  opacity: 1;
  animation: service-hero-enter-left 390ms cubic-bezier(0.16, 1, 0.3, 1) 50ms backwards;
}

.js .era-page .era-vehicle-slide.is-active .era-vehicle-slide__title-line {
  opacity: 1;
  animation: driver-hero-title-reveal 374ms cubic-bezier(0.16, 1, 0.3, 1) 80ms backwards;
}

.js .era-page .era-vehicle-slide.is-active .era-vehicle-slide__title-clip:nth-child(2) .era-vehicle-slide__title-line {
  animation-delay: 120ms;
}

@media (max-width: 600px) {
  .era-vehicle-slide__title-clip {
    display: inline;
    overflow: visible;
    margin-bottom: 0;
    padding-bottom: 0;
  }

  .era-vehicle-slide__title-line {
    position: relative;
  }

  .js .era-page .era-vehicle-slide.is-active .era-vehicle-slide__title-line {
    animation-name: era-vehicle-mobile-title-reveal;
  }
}

.js .era-page .era-vehicle-slide.is-active .era-vehicle-slide__regulation {
  opacity: 1;
  animation: service-hero-enter-up 343ms cubic-bezier(0.16, 1, 0.3, 1) 180ms backwards;
}

.js .era-page .era-vehicle-slide.is-active .era-vehicle-slide__summary {
  opacity: 1;
  animation: service-hero-enter-up 343ms cubic-bezier(0.16, 1, 0.3, 1) 240ms backwards;
}

.js .era-page .era-vehicle-slide.is-active .era-vehicle-slide__actions,
.js .era-page .era-vehicle-slide.is-active .era-vehicle-slide__content > .era-vehicle-slide__link {
  opacity: 1;
  animation: service-hero-enter-up 343ms cubic-bezier(0.16, 1, 0.3, 1) 320ms backwards;
}

.era-vehicle-slide__media {
  position: absolute;
  z-index: 2;
  top: 0;
  right: 4.5%;
  bottom: 28%;
  left: 46.5%;
  min-width: 0;
  min-height: 0;
  overflow: visible;
  background: transparent;
  isolation: isolate;
  translate: 0 50px;
}

.era-vehicle-slide__shadow {
  position: absolute;
  z-index: 0;
  right: 13%;
  bottom: 2.5%;
  left: 13%;
  height: 17px;
  border-radius: 50%;
  background: radial-gradient(ellipse at center, rgba(1, 31, 69, 0.34) 0%, rgba(1, 31, 69, 0.16) 43%, rgba(1, 31, 69, 0) 76%);
  filter: blur(5px);
  opacity: 0.68;
  transform: scaleX(0.86);
}

.era-vehicle-slide__shadow--truck,
.era-vehicle-slide__shadow--garbage {
  right: 12%;
  left: 12%;
  transform: scaleX(0.9);
}

.era-vehicle-slide__image {
  position: absolute;
  z-index: 1;
  bottom: 0;
  left: 50%;
  display: block;
  width: 103%;
  max-width: none;
  height: auto;
  opacity: 1;
  transform: translateX(-50%);
}

.era-vehicle-slide__image--truck {
  width: 98%;
}

.era-vehicle-slide__image--garbage {
  width: 100%;
}

.era-vehicle-slide__image--photo {
  width: 100%;
  -webkit-mask-image:
    linear-gradient(to right, transparent 0, #000 14px, #000 calc(100% - 14px), transparent 100%),
    linear-gradient(to bottom, transparent 0, #000 14px, #000 calc(100% - 14px), transparent 100%);
  -webkit-mask-composite: source-in;
  mask-composite: intersect;
  mask-image:
    linear-gradient(to right, transparent 0, #000 14px, #000 calc(100% - 14px), transparent 100%),
    linear-gradient(to bottom, transparent 0, #000 14px, #000 calc(100% - 14px), transparent 100%);
}

.era-vehicle-slide__image--cutout {
  -webkit-mask-image: none;
  mask-image: none;
}

.era-vehicle-slide__image--m2 {
  transform: translateX(-50%);
}

.era-vehicle-slide__image--m3 {
  filter: none;
  transform: translateX(-50%);
}

.era-vehicle-slide__image--n2 {
  transform: translateX(-50%);
}

.era-vehicle-slide__image--forest {
  scale: 0.945;
  transform: translateX(-50%);
}

.era-vehicle-slide__image--timber-truck {
  filter: none;
  transform: translateX(-50%);
}

.era-vehicle-slide__image--fire {
  scale: 1.05;
  transform: translateX(-50%);
}

.era-vehicle-slide__image--garbage.era-vehicle-slide__image--cutout {
  scale: 1.1;
  transform: translateX(-50%);
}

.era-vehicle-slide.is-active .era-vehicle-slide__media {
  animation: era-vehicle-arrive 380ms cubic-bezier(0.16, 1, 0.3, 1) 80ms both;
}

#era-vehicle-slide-08.is-active .era-vehicle-slide__media {
  animation-duration: 494ms;
}

.era-vehicle-slide__peek {
  position: absolute;
  z-index: 1;
  top: auto;
  right: -24%;
  bottom: 28%;
  width: 34%;
  height: 49%;
  overflow: visible;
  opacity: 0.7;
  filter: none;
  pointer-events: none;
  transform: none;
}

.era-vehicle-slide__peek::after {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 8%;
  height: 12px;
  border-radius: 50%;
  background: radial-gradient(ellipse at center, rgba(1, 31, 69, 0.2), rgba(1, 31, 69, 0) 72%);
  filter: blur(5px);
  content: "";
}

.era-vehicle-slide__peek img {
  position: absolute;
  z-index: 1;
  right: 0;
  bottom: 0;
  display: block;
  width: 128%;
  max-width: none;
  height: auto;
}

.era-vehicle-slide__peek--photo::after {
  display: none;
}

.era-vehicle-slide__peek--photo img {
  width: 118%;
}

.era-vehicle-slide__peek-image--m2 {
  filter: brightness(1.035);
  transform: translateY(7%);
}

.era-vehicle-slide__peek-image--m3 {
  filter: brightness(1.02);
}

.era-vehicle-slide__peek-image--n2 {
  transform: translateY(2.5%);
}

.era-vehicle-slider__controls {
  position: absolute;
  z-index: 5;
  right: auto;
  bottom: 38px;
  left: 50%;
  display: flex;
  min-height: 45px;
  gap: 10px;
  align-items: center;
  justify-content: center;
  background: transparent;
  transform: translateX(-50%);
}

@media (min-width: 901px) {
  .era-requirements {
    padding-bottom: 146px;
  }

  .era-vehicle-slide__media--photo {
    translate: 50px 100px;
  }

  .era-vehicle-slide__content .era-vehicle-slide__eyebrow {
    translate: 0 10px;
  }

  .era-vehicle-slider__controls {
    transform: translate(-50%, 50px);
  }
}

.era-vehicle-slider__count {
  display: flex;
  min-width: 54px;
  gap: 6px;
  align-items: baseline;
  justify-content: center;
  margin: 0;
  color: rgba(1, 31, 69, 0.54);
  font: 700 11px/1 var(--font-display);
}

.era-vehicle-slider__count strong {
  color: var(--sv-navy-deep);
  font-size: 15px;
  letter-spacing: -0.03em;
}

.era-vehicle-slider__arrow {
  display: grid;
  width: 44px;
  min-height: 44px;
  padding: 0;
  place-items: center;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--sv-navy-deep);
  cursor: pointer;
  touch-action: manipulation;
  transition: background-color 180ms ease, color 180ms ease, transform 140ms cubic-bezier(0.23, 1, 0.32, 1);
}

.era-vehicle-slider__arrow--next {
  background: var(--sv-navy);
  color: #fff;
  box-shadow: 0 10px 24px rgba(1, 31, 69, 0.2);
}

.era-vehicle-slider__arrow svg {
  width: 19px;
  height: 19px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: square;
  stroke-linejoin: miter;
  stroke-width: 1.8;
}

.era-vehicle-slide__details:focus-visible,
.era-vehicle-slide__link:focus-visible,
.era-vehicle-slider__arrow:focus-visible {
  position: relative;
  z-index: 6;
  outline: 3px solid rgba(0, 47, 108, 0.3);
  outline-offset: 4px;
}

.era-vehicle-slide__details:hover,
.era-vehicle-slide__details:focus-visible {
  border-color: var(--sv-red);
  background-position: 0 0;
}

@media (hover: hover) and (pointer: fine) {
  .era-vehicle-slide__link:hover {
    background: transparent;
    color: var(--sv-red);
    text-decoration-color: var(--sv-red);
  }

  .era-vehicle-slider__arrow:hover {
    background: rgba(0, 47, 108, 0.09);
    color: var(--sv-navy-deep);
  }

  .era-vehicle-slider__arrow--next:hover {
    background: var(--sv-red);
    color: #fff;
  }
}

.era-vehicle-slide__details:active,
.era-vehicle-slide__link:active,
.era-vehicle-slider__arrow:active {
  transform: scale(0.97);
}

.era-vehicle-slide__details:active {
  border-color: var(--sv-red);
  background-position: 0 0;
}

.era-category-modal {
  position: fixed;
  z-index: 1700;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(5, 18, 36, 0.62);
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
  opacity: 0;
  visibility: hidden;
  transition: opacity 220ms ease, visibility 220ms ease;
}

.era-category-modal.is-open {
  opacity: 1;
  visibility: visible;
}

.era-category-dialog {
  position: relative;
  width: min(760px, 100%);
  max-height: calc(100dvh - 48px);
  overflow: auto;
  border: 1px solid rgba(0, 47, 108, 0.14);
  background: #fff;
  box-shadow: 0 24px 72px rgba(0, 17, 42, 0.28);
  opacity: 0;
  transform: translateY(12px);
  transition: opacity 200ms ease, transform 280ms cubic-bezier(0.22, 1, 0.36, 1);
}

.era-category-modal.is-open .era-category-dialog {
  opacity: 1;
  transform: none;
}

.era-category-dialog__close {
  position: absolute;
  z-index: 2;
  top: 18px;
  right: 18px;
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  border: 1px solid rgba(0, 47, 108, 0.18);
  border-radius: 0;
  background: #fff;
  color: var(--sv-navy);
  cursor: pointer;
  touch-action: manipulation;
  transition: border-color 180ms ease, background-color 180ms ease, color 180ms ease;
}

.era-category-dialog__close:hover,
.era-category-dialog__close:focus-visible {
  border-color: var(--sv-navy);
  background: var(--sv-navy);
  color: #fff;
}

.era-category-dialog__close:focus-visible {
  outline: 3px solid rgba(0, 47, 108, 0.22);
  outline-offset: 3px;
}

.era-category-dialog__content {
  padding: 48px 56px 52px;
}

.era-category-dialog__kicker {
  margin: 0;
  color: var(--sv-red);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.era-category-dialog h2 {
  margin: 14px 0 0;
  padding-right: 56px;
  color: var(--sv-navy-deep);
  font-family: var(--font-display);
  font-size: clamp(34px, 4vw, 48px);
  font-weight: 750;
  letter-spacing: -0.045em;
  line-height: 1;
}

.era-category-dialog__definition {
  max-width: 640px;
  margin: 24px 0 0;
  color: var(--sv-navy-deep);
  font-size: 18px;
  font-weight: 650;
  line-height: 1.55;
  white-space: pre-line;
}

.era-category-dialog__definition.is-compact {
  font-weight: 500;
  white-space: normal;
}

.era-category-dialog__legal {
  display: grid;
  gap: 14px;
  margin-top: 30px;
  padding: 24px 0 0 24px;
  border-top: 1px solid rgba(0, 47, 108, 0.14);
  border-left: 3px solid var(--sv-red);
}

.era-category-dialog__legal p {
  margin: 0;
  color: rgba(1, 31, 69, 0.7);
  font-size: 14px;
  line-height: 1.65;
}

.era-category-dialog__source {
  width: fit-content;
  color: var(--sv-navy);
  font-size: 13px;
  font-weight: 800;
  line-height: 1.45;
  text-decoration: underline;
  text-decoration-color: rgba(0, 47, 108, 0.28);
  text-underline-offset: 4px;
}

.era-category-dialog__source:hover,
.era-category-dialog__source:focus-visible {
  color: var(--sv-red);
  text-decoration-color: currentColor;
}

.era-category-dialog__source:focus-visible {
  outline: 3px solid rgba(0, 47, 108, 0.22);
  outline-offset: 4px;
}

.era-category-dialog__source[hidden] {
  display: none;
}

.era-category-dialog__account {
  display: inline-flex;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  margin-top: 28px;
  padding: 0 24px;
  background: var(--sv-navy);
  color: #fff;
  font-size: 13px;
  font-weight: 800;
  line-height: 1.2;
  text-decoration: none;
  transition: background-color 180ms ease, transform 140ms cubic-bezier(0.23, 1, 0.32, 1);
}

.era-category-dialog__account:hover,
.era-category-dialog__account:focus-visible {
  background: var(--sv-red);
}

.era-category-dialog__account:focus-visible {
  outline: 3px solid rgba(0, 47, 108, 0.22);
  outline-offset: 3px;
}

.era-category-dialog__account:active {
  transform: scale(0.98);
}

.era-category-dialog__account[hidden] {
  display: none;
}

@media (max-width: 1100px) {
  .era-requirements__intro {
    width: 68%;
    margin-left: 32%;
  }

  .era-vehicle-slider__viewport,
  .era-vehicle-slide {
    min-height: 550px;
  }

  .era-vehicle-slide__content {
    padding-left: 0;
  }

  .era-vehicle-slide__content h3 {
    max-width: 100%;
    font-size: 27px;
  }

  .era-vehicle-slide__regulation {
    font-size: clamp(64px, 8vw, 86px);
  }

  .era-vehicle-slide__summary {
    max-width: 390px;
    font-size: 15px;
  }

  .era-vehicle-slide__media {
    right: 2.5%;
    left: 42.5%;
  }

  .era-vehicle-slider__controls {
    right: auto;
  }
}

@media (max-width: 900px) {
  .era-requirements__intro {
    width: auto;
    margin-left: 0;
    margin-bottom: 30px;
    text-align: left;
  }

  .era-requirements__intro h2 {
    white-space: normal;
  }

  .era-vehicle-slider {
    border-radius: 0;
  }

  .era-vehicle-slider__viewport {
    min-height: 0;
  }

  .era-vehicle-slide {
    display: grid;
    min-height: 0;
    padding: 42px clamp(24px, 4vw, 32px) 0;
    grid-template-columns: minmax(0, 1fr);
    align-content: start;
  }

  .era-vehicle-slide__content {
    display: contents;
  }

  .era-vehicle-slide__eyebrow {
    grid-row: 1;
  }

  .era-vehicle-slide__content h3 {
    grid-row: 2;
    max-width: 560px;
    margin-top: 16px;
    font-size: clamp(28px, 4.4vw, 34px);
  }

  .era-vehicle-slide__regulation {
    grid-row: 3;
    margin-top: 24px;
    font-size: clamp(66px, 12vw, 88px);
  }

  .era-vehicle-slide__summary {
    grid-row: 4;
    max-width: 560px;
    margin-top: 24px;
    font-size: 15.5px;
  }

  .era-vehicle-slide__actions,
  .era-vehicle-slide__content > .era-vehicle-slide__link {
    grid-row: 6;
  }

  .era-vehicle-slide__link {
    margin-top: 22px;
  }

  .era-vehicle-slide__media {
    position: relative;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    grid-row: 5;
    width: 100%;
    min-height: 0;
    height: clamp(260px, 42vw, 330px);
    margin-top: 24px;
    translate: none;
  }

  .era-vehicle-slide__image,
  .era-vehicle-slide__image--truck,
  .era-vehicle-slide__image--garbage,
  .era-vehicle-slide__image--photo {
    width: 100%;
    max-width: 100%;
    height: 100%;
    object-fit: contain;
  }

  .era-vehicle-slide__image--forest,
  .era-vehicle-slide__image--fire,
  .era-vehicle-slide__image--garbage.era-vehicle-slide__image--cutout {
    scale: 1;
  }

  .era-vehicle-slide__peek {
    display: none;
  }

  .era-vehicle-slider__controls {
    position: relative;
    right: auto;
    bottom: auto;
    left: auto;
    width: max-content;
    margin: 22px auto 0;
    transform: none;
  }
}

@media (max-width: 600px) {
  .era-requirements__intro {
    margin-bottom: 26px;
  }

  .era-vehicle-slider {
    border-radius: 0;
  }

  .era-vehicle-slide {
    padding: 20px clamp(8px, 3vw, 14px) 0;
  }

  .era-vehicle-slide__content h3 {
    max-width: 410px;
    margin-top: 8px;
    font-size: clamp(25px, 7.55vw, 29px);
    line-height: 1.04;
  }

  .era-vehicle-slide__regulation {
    display: none;
  }

  .era-vehicle-slide__summary {
    max-width: 410px;
    margin-top: 18px;
    font-size: 15px;
    line-height: 1.44;
  }

  .era-vehicle-slide__link {
    max-width: 100%;
    min-height: 44px;
    margin-top: 20px;
    padding: 0;
    font-size: 11px;
  }

  .era-vehicle-slide__actions {
    width: 100%;
    gap: 8px;
    align-items: stretch;
    flex-direction: column;
    margin-top: 16px;
  }

  .era-vehicle-slide__details,
  .era-vehicle-slide__actions .era-vehicle-slide__link {
    width: 100%;
    margin-top: 0;
  }

  .era-category-modal {
    padding: 12px;
  }

  .era-category-dialog {
    max-height: calc(100dvh - 24px);
  }

  .era-category-dialog__close {
    top: 12px;
    right: 12px;
  }

  .era-category-dialog__content {
    padding: 34px 24px 30px;
  }

  .era-category-dialog h2 {
    padding-right: 48px;
    font-size: 32px;
  }

  .era-category-dialog__definition {
    margin-top: 20px;
    font-size: 16px;
  }

  .era-category-dialog__legal {
    margin-top: 24px;
    padding: 20px 0 0 16px;
  }

  .era-vehicle-slide__media {
    height: clamp(160px, 54vw, 205px);
    margin-top: 14px;
  }

  .era-vehicle-slide__shadow {
    right: 10%;
    bottom: 2%;
    left: 10%;
    height: 13px;
    filter: blur(4px);
  }

  .era-vehicle-slider__controls {
    min-height: 44px;
    gap: 6px;
    margin-top: 14px;
  }

  .era-vehicle-slider__count {
    min-width: 50px;
  }

  .era-vehicle-slider__arrow {
    width: 44px;
    min-height: 44px;
  }
}

@keyframes era-vehicle-arrive {
  from {
    opacity: 0;
    transform: translateX(84px) scale(0.985);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

@keyframes era-vehicle-mobile-title-reveal {
  from {
    top: 10px;
    opacity: 0;
  }

  to {
    top: 0;
    opacity: 1;
  }
}

@keyframes era-hotspot-pulse {
  0% {
    opacity: 0.75;
    transform: scale(0.82);
  }

  70%,
  100% {
    opacity: 0;
    transform: scale(1.35);
  }
}

.era-process-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  border-top: 1px solid rgba(255, 255, 255, 0.22);
}

.era-process-card {
  min-height: 330px;
  padding: 30px 24px 28px 0;
}

.era-process-card + .era-process-card {
  padding-left: 24px;
  border-left: 1px solid rgba(255, 255, 255, 0.18);
}

.era-process-card__index {
  color: var(--sv-red);
  font: 700 13px/1 var(--font-display);
  letter-spacing: 0.1em;
}

.era-process-card h3 {
  margin: 80px 0 0;
  color: #fff;
  font: 700 18px/1.24 var(--font-display);
}

.era-process-card p {
  margin: 14px 0 0;
  color: rgba(255, 255, 255, 0.67);
  font-size: 14px;
  line-height: 1.55;
}

.era-documentation__head {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(280px, 1.1fr);
  gap: 56px;
  align-items: end;
  margin-bottom: 44px;
}

.era-documents-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.era-document-card {
  display: grid;
  grid-template-columns: 66px minmax(0, 1fr) auto;
  min-height: 150px;
  align-items: center;
  gap: 18px;
  padding: 22px;
  border: 1px solid var(--era-border);
  background: #fff;
  color: var(--era-ink);
  text-decoration: none;
  transition: transform 180ms cubic-bezier(0.23, 1, 0.32, 1), border-color 180ms ease, box-shadow 180ms ease;
}

.era-document-card img {
  display: block;
  width: 56px;
  height: auto;
}

.era-document-card strong {
  display: block;
  font: 700 15px/1.32 var(--font-display);
}

.era-document-card small {
  display: block;
  margin-top: 8px;
  color: var(--era-muted);
  font-size: 11px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.era-document-card svg {
  width: 18px;
  height: 18px;
  color: var(--sv-red);
}

.era-documentation__note {
  margin: 22px 0 0;
  color: var(--era-muted);
  font-size: 13px;
  line-height: 1.55;
}

.era-page .monitoring-catalog {
  padding: 96px 0;
  background: #e4e9f3;
}

.era-page .monitoring-catalog__inner {
  width: min(100% - 48px, 1200px);
}

.era-page .monitoring-catalog__head {
  display: grid;
  grid-template-columns: minmax(0, 0.75fr) minmax(300px, 1.25fr);
  gap: 52px;
  align-items: end;
  margin-bottom: 40px;
}

.era-page .monitoring-catalog__head--verified {
  grid-template-columns: minmax(0, 1.15fr) minmax(340px, 0.85fr);
  gap: 64px;
  align-items: start;
  margin-bottom: 36px;
}

.era-page .monitoring-catalog__heading {
  display: grid;
  gap: 18px;
}

.era-page .monitoring-catalog__head--verified .monitoring-catalog__eyebrow {
  color: var(--era-muted);
  font-size: 12px;
  line-height: 1.2;
}

.era-page .monitoring-catalog__head h2 {
  max-width: 760px;
  margin: 0;
  color: var(--sv-navy-deep);
  font-family: var(--font-display);
  font-size: clamp(36px, 4.2vw, 62px);
  font-weight: 700;
  letter-spacing: -0.045em;
  line-height: 0.98;
}

.era-page .monitoring-catalog__head--verified h2 {
  max-width: 650px;
  font-size: clamp(32px, 3.25vw, 48px);
  line-height: 1;
}

.era-page .monitoring-catalog__verification {
  display: grid;
  gap: 18px;
  padding-top: 30px;
}

.era-page .monitoring-catalog__verification p {
  margin: 0;
  color: var(--era-muted);
  font-size: 15px;
  line-height: 1.6;
}

.era-page .monitoring-catalog__official-link {
  display: inline-flex;
  width: fit-content;
  min-height: 44px;
  gap: 10px;
  align-items: center;
  color: var(--sv-navy);
  font-size: 13px;
  font-weight: 800;
  line-height: 1.35;
  transition: color 180ms ease, text-decoration-color 180ms ease;
}

.era-page .monitoring-catalog__official-link svg {
  width: 17px;
  height: 17px;
  flex: 0 0 auto;
  fill: none;
  stroke: var(--sv-red);
  stroke-linecap: square;
  stroke-linejoin: miter;
  stroke-width: 1.8;
  transition: transform 180ms ease;
}

.era-page .monitoring-catalog__official-link:focus-visible {
  outline: 3px solid rgba(0, 47, 108, 0.28);
  outline-offset: 4px;
}

@media (hover: hover) and (pointer: fine) {
  .era-page .monitoring-catalog__official-link:hover {
    color: var(--sv-red);
    text-decoration-color: var(--sv-red);
  }

  .era-page .monitoring-catalog__official-link:hover svg {
    transform: translate(2px, -2px);
  }
}

.era-page .monitoring-catalog__head > p:last-child {
  margin: 0;
  color: var(--era-muted);
  font-size: 16px;
  line-height: 1.6;
}

.era-page .monitoring-product-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.era-page .monitoring-product-card__visual {
  min-height: 220px;
}

.era-page .monitoring-product-card__body {
  min-height: 0;
}

.era-page .monitoring-product-card h3 {
  font-size: 21px;
}

.era-page .price-match {
  margin: 0;
}

.era-installation__layout {
  display: grid;
  grid-template-columns: minmax(0, 1.04fr) minmax(360px, 0.96fr);
  column-gap: 72px;
  row-gap: 38px;
  align-items: start;
}

#installation {
  background: #f0f2f8;
  color: var(--era-ink);
}

.era-installation__intro {
  min-width: 0;
}

.era-installation__left {
  grid-column: 1;
  grid-row: 1;
  align-self: stretch;
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.era-installation__intro h2 {
  font-size: clamp(34px, 3.55vw, 52px);
}

.era-installation__title-accent {
  --era-installation-title-accent-base: var(--era-ink);
  background-image: linear-gradient(
    90deg,
    var(--sv-red, #ff0000) 0 50%,
    var(--era-installation-title-accent-base) 50% 100%
  );
  background-position: 100% 0;
  background-repeat: no-repeat;
  background-size: 200% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  color: var(--era-installation-title-accent-base);
  -webkit-text-fill-color: transparent;
}

#installation.is-title-filled .era-installation__title-accent {
  animation: era-installation-title-sweep 0.72s var(--ease-out, ease) 0.12s both;
}

@keyframes era-installation-title-sweep {
  from { background-position: 100% 0; }
  to { background-position: 0 0; }
}

.era-installation__intro > p {
  max-width: 690px;
  margin: 28px 0 0;
  color: var(--era-muted);
  font-size: 17px;
  line-height: 1.65;
}

.era-installation__facts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0;
  border-top: 1px solid var(--era-border);
  border-bottom: 1px solid var(--era-border);
}

.era-installation__support {
  min-width: 0;
  margin-top: auto;
  padding-top: 38px;
}

.era-installation__facts div {
  padding: 31px 18px 31px 0;
}

.era-installation__facts div + div {
  padding-left: 18px;
  border-left: 1px solid var(--era-border);
}

.era-installation__facts dt {
  color: var(--era-ink);
  font-family: var(--font-display);
  font-size: clamp(26px, 2.15vw, 30px);
  font-weight: 750;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.035em;
  line-height: 1;
}

.era-installation__facts dd {
  margin: 9px 0 0;
  color: var(--era-muted);
  font-size: 13px;
  line-height: 1.45;
}

.era-installation__checklist {
  grid-column: 2;
  grid-row: 1;
  align-self: start;
  margin-top: 26px;
  display: grid;
  gap: 0;
  border-top: 1px solid var(--era-border);
}

.era-installation__checklist article {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 18px;
  padding: 24px 0;
  border-bottom: 1px solid var(--era-border);
}

.era-installation__checklist span {
  display: grid;
  width: 30px;
  height: 30px;
  place-items: center;
  border: 1px solid rgba(7, 43, 86, 0.3);
  color: var(--sv-red);
  font: 700 11px/1 var(--font-display);
}

.era-installation__checklist h3 {
  margin: 2px 0 0;
  color: var(--era-ink);
  font: 700 17px/1.3 var(--font-display);
}

.era-installation__checklist p {
  margin: 8px 0 0;
  color: var(--era-muted);
  font-size: 14px;
  line-height: 1.55;
}

.era-installation__geo {
  grid-column: 1 / -1;
  grid-row: 2;
  display: grid;
  grid-template-columns: minmax(0, 0.58fr) minmax(0, 1.42fr);
  column-gap: 32px;
  border-left: 4px solid var(--sv-red);
  background: var(--sv-navy, #002f6c);
}

.era-installation__geo-title {
  display: grid;
  grid-template-columns: 60px minmax(0, 1fr);
  align-items: center;
  gap: 16px;
  padding: 30px 28px;
}

.era-installation__geo-title svg {
  width: 48px;
  height: 58px;
  color: var(--sv-red);
}

.era-installation__geo-title h3 {
  margin: 0;
  color: #fff;
  font: 700 21px/1.2 var(--font-display);
}

.era-installation__geo-title h3 span {
  display: block;
}

.era-installation__geo-copy {
  display: grid;
  align-content: center;
  padding: 30px 32px 30px 0;
}

.era-installation__geo-copy p {
  margin: 0;
  color: rgba(255, 255, 255, 0.72);
  font-size: 14px;
  line-height: 1.62;
}

.era-installation__geo-copy strong {
  color: inherit;
  font-weight: 400;
}

.era-page .faq-section {
  padding-block: clamp(72px, 7vw, 96px);
  background: var(--era-surface);
}

.era-final-cta {
  position: relative;
  padding: 84px 0;
  background: #fff;
}

.era-final-cta__layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 56px;
  align-items: end;
  padding: 52px;
  background: var(--sv-red);
  color: #fff;
}

.era-final-cta p {
  max-width: 720px;
  margin: 20px 0 0;
  color: rgba(255, 255, 255, 0.84);
  font-size: 16px;
  line-height: 1.6;
}

.era-final-cta .era-button {
  min-width: 230px;
  border-color: #fff;
  background: #fff;
  color: var(--sv-navy-deep);
}

@media (hover: hover) and (pointer: fine) {
  .era-button:hover {
    border-color: var(--sv-red);
    background: var(--sv-red);
    color: #fff;
  }

  .era-button--secondary:hover {
    border-color: var(--sv-navy);
    background: var(--sv-navy);
  }

  .era-document-card:hover {
    transform: translateY(-3px);
    border-color: rgba(255, 0, 0, 0.42);
    box-shadow: 0 18px 44px rgba(1, 31, 69, 0.1);
  }

  .era-law-card__cta:hover {
    color: var(--sv-red);
  }

  .era-vehicle-hotspot summary:hover .era-vehicle-hotspot__marker {
    border-color: var(--sv-red);
    box-shadow: 0 10px 30px rgba(1, 31, 69, 0.28);
    transform: scale(1.08);
  }

  .era-final-cta .era-button:hover {
    border-color: var(--sv-navy-deep);
    background: var(--sv-navy-deep);
  }
}

@media (max-width: 1120px) {
  .era-hero__layout,
  .era-installation__layout {
    grid-template-columns: minmax(0, 1fr) minmax(340px, 0.9fr);
    column-gap: 44px;
    row-gap: 38px;
  }

  .era-installation__geo {
    grid-template-columns: minmax(0, 0.58fr) minmax(0, 1.42fr);
    column-gap: 28px;
  }

  .era-process-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .era-process-card:nth-child(4) {
    padding-left: 0;
    border-left: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.18);
  }

  .era-process-card:nth-child(5) {
    border-top: 1px solid rgba(255, 255, 255, 0.18);
  }

  .era-documents-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .era-page .monitoring-product-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .era-hero-visual {
    min-height: 560px;
  }
}

@media (min-width: 901px) and (max-width: 1103px) {
  .era-installation__facts {
    min-height: 144px;
  }
}

@media (min-width: 901px) and (max-width: 930px) {
  .era-installation__facts {
    min-height: 164px;
  }
}

@media (max-width: 900px) {
  .era-container,
  .era-page .monitoring-catalog__inner {
    width: min(100% - 40px, 1200px);
  }

  .era-section {
    padding: 76px 0;
  }

  .era-hero {
    min-height: 0;
  }

  .era-hero::before {
    width: 100%;
    height: 66%;
  }

  .era-hero__layout {
    min-height: 0;
  }

  .era-hero__copy {
    padding: 68px 0 54px;
  }

  .era-hero__layout,
  .era-installation__layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .era-installation__left,
  .era-installation__checklist,
  .era-installation__geo {
    grid-column: auto;
    grid-row: auto;
  }

  .era-installation__checklist {
    margin-top: 0;
    order: 3;
  }

  .era-installation__facts div {
    padding-top: 22px;
    padding-bottom: 22px;
  }

  .era-installation__geo {
    order: 4;
    grid-template-columns: minmax(0, 1fr);
    column-gap: 0;
  }

  .era-hero-visual {
    width: min(680px, 100%);
    min-height: 540px;
    margin: -12px auto 0;
  }

  .era-section__head,
  .era-documentation__head,
  .era-page .monitoring-catalog__head {
    grid-template-columns: minmax(0, 1fr);
    gap: 22px;
  }

  .era-page .monitoring-catalog__verification {
    padding-top: 22px;
  }

  .era-vehicle-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .era-vehicle-card__visual {
    min-height: 390px;
  }

  .era-page .monitoring-catalog {
    padding: 76px 0;
  }

  .era-final-cta__layout {
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
  }
}

@media (max-width: 600px) {
  .era-container,
  .era-page .monitoring-catalog__inner {
    width: min(100% - 32px, 1200px);
  }

  .era-section {
    padding: 60px 0;
  }

  .era-page .monitoring-catalog__head--verified h2 {
    font-size: clamp(30px, 9.2vw, 36px);
  }

  .era-hero {
    padding: 0;
  }

  .era-hero::before {
    height: 72%;
  }

  .era-hero__copy {
    padding: 48px 0 44px;
  }

  .era-hero__copy h1 {
    font-size: clamp(34px, 10vw, 40px);
    line-height: 0.98;
  }

  .era-hero__lead {
    margin-top: 22px;
    font-size: 16px;
  }

  .era-hero__actions,
  .era-final-cta__actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
  }

  .era-hero__actions .button,
  .era-hero__actions .messenger-switch {
    width: 100%;
  }

  .era-button {
    width: 100%;
    min-height: 50px;
  }

  .era-hero__proof,
  .era-installation__facts {
    grid-template-columns: minmax(0, 1fr);
  }

  .era-hero__proof div,
  .era-installation__facts div {
    display: grid;
    grid-template-columns: 92px minmax(0, 1fr);
    gap: 14px;
    align-items: start;
    padding: 16px 0;
  }

  .era-installation__facts div {
    grid-template-columns: 120px minmax(0, 1fr);
  }

  .era-installation__facts dt {
    font-size: 24px;
  }

  .era-hero__proof div + div,
  .era-installation__facts div + div {
    padding-left: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    border-left: 0;
  }

  .era-installation__facts div + div {
    border-top-color: rgba(255, 255, 255, 0.18);
  }

  .era-hero__proof dd,
  .era-installation__facts dd {
    margin-top: 2px;
  }

  .era-hero-visual {
    min-height: 400px;
    margin-top: 0;
  }

  .era-page .era-hero-visual__orbit {
    width: min(360px, calc(100vw - 34px));
  }

  .era-hero-visual__media {
    width: min(284px, 77.76%);
  }

  .era-hero-visual__label {
    top: 7%;
    right: 0;
  }

  .era-hero-visual__note {
    bottom: 6%;
    left: 0;
  }

  .era-signal-board {
    padding: 22px 20px;
  }

  .era-signal-board__top {
    align-items: flex-start;
    flex-direction: column;
    gap: 10px;
  }

  .era-signal-route {
    grid-template-columns: 52px minmax(0, 1fr);
    gap: 14px;
  }

  .era-signal-route__number {
    width: 50px;
    height: 50px;
    font-size: 13px;
  }

  .era-signal-route h2 {
    font-size: 17px;
  }

  .era-signal-route__flow {
    align-items: flex-start;
    flex-direction: column;
  }

  .era-signal-route__flow i {
    display: none;
  }

  .era-section__head h2,
  .era-documentation__head h2,
  .era-installation__intro h2,
  .era-final-cta h2,
  .era-page .monitoring-catalog__head h2 {
    font-size: clamp(32px, 9.8vw, 44px);
    line-height: 1;
  }

  .era-vehicle-card__visual {
    min-height: 260px;
  }

  .era-vehicle-card__regulation {
    top: 18px;
    left: 20px;
  }

  .era-vehicle-card__regulation strong {
    font-size: 27px;
  }

  .era-vehicle-card__stage {
    top: 52%;
    width: 116%;
  }

  .era-vehicle-card__visual-note {
    right: 16px;
    bottom: 13px;
    font-size: 10px;
  }

  .era-vehicle-hotspot__panel {
    top: auto;
    bottom: 24px;
    left: -20px;
    grid-template-columns: 52px minmax(0, 1fr);
    width: 228px;
    padding: 8px;
    transform: none;
  }

  .era-vehicle-card--forest .era-vehicle-hotspot__panel {
    left: -30px;
  }

  .era-vehicle-hotspot__panel::before {
    top: 100%;
    right: auto;
    bottom: auto;
    left: 42px;
    width: 2px;
    height: 14px;
  }

  .era-vehicle-card--forest .era-vehicle-hotspot__panel::before {
    left: 52px;
  }

  .era-vehicle-hotspot__panel > img {
    width: 52px;
    height: 46px;
  }

  .era-vehicle-hotspot__panel strong {
    font-size: 11px;
  }

  .era-vehicle-hotspot__panel span {
    font-size: 9px;
  }

  .era-vehicle-card__content {
    padding: 28px 22px 30px;
  }

  .era-vehicle-card__content h3 {
    font-size: 31px;
  }

  .era-vehicle-card__facts {
    grid-template-columns: minmax(0, 1fr);
  }

  .era-vehicle-card__facts div,
  .era-vehicle-card__facts div + div {
    padding: 14px 0;
    border-left: 0;
  }

  .era-vehicle-card__facts div + div {
    border-top: 1px solid var(--era-border);
  }

  .era-vehicle-card--forest .era-vehicle-card__facts div + div {
    border-top-color: rgba(255, 255, 255, 0.16);
  }

  .era-law-card__cta {
    align-items: flex-start;
    line-height: 1.45;
  }

  .era-process-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .era-process-card,
  .era-process-card + .era-process-card,
  .era-process-card:nth-child(4) {
    min-height: 0;
    padding: 24px 0;
    border-top: 1px solid rgba(255, 255, 255, 0.18);
    border-left: 0;
  }

  .era-process-card h3 {
    margin-top: 34px;
  }

  .era-documents-grid,
  .era-page .monitoring-product-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .era-document-card {
    grid-template-columns: 54px minmax(0, 1fr) auto;
    min-height: 128px;
    padding: 18px 16px;
  }

  .era-document-card img {
    width: 46px;
  }

  .era-page .monitoring-catalog {
    padding: 60px 0;
  }

  .era-page .monitoring-product-card__visual {
    min-height: 220px;
  }

  .era-page .monitoring-product-card__body {
    min-height: 0;
  }

  .era-installation__geo {
    grid-template-columns: minmax(0, 1fr);
  }

  .era-installation__geo-title {
    grid-template-columns: 46px minmax(0, 1fr);
    padding: 20px;
  }

  .era-installation__geo-title svg {
    width: 38px;
    height: 46px;
  }

  .era-installation__geo-title h3 {
    font-size: 18px;
  }

  .era-installation__geo-copy {
    padding: 20px;
  }

  .era-installation__geo-copy p {
    font-size: 14px;
  }

  .era-final-cta {
    padding: 60px 0;
  }

  .era-final-cta__layout {
    gap: 30px;
    padding: 32px 22px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .era-button,
  .era-document-card,
  .era-law-card__cta,
  .era-vehicle-slide,
  .era-vehicle-slide__media,
  .era-vehicle-slide__link,
  .era-vehicle-slider__tabs button,
  .era-vehicle-slider__tabs button::after,
  .era-vehicle-slider__arrows button,
  .era-vehicle-slider__arrow,
  .era-vehicle-hotspot__marker,
  .era-vehicle-hotspot__marker img {
    animation: none;
    transition: none;
  }

  .js .era-page .era-vehicle-slide__eyebrow,
  .js .era-page .era-vehicle-slide__title-line,
  .js .era-page .era-vehicle-slide__regulation,
  .js .era-page .era-vehicle-slide__summary,
  .js .era-page .era-vehicle-slide__actions,
  .js .era-page .era-vehicle-slide__content > .era-vehicle-slide__link {
    opacity: 1 !important;
    animation: none !important;
  }

  .era-vehicle-hotspot summary::before {
    animation: none;
  }
}

/* GLONASS campaign scroll journey */

.monitoring-journey {
  --monitoring-journey-intro-opacity: 1;
  --monitoring-journey-map-opacity: 0;
  --monitoring-journey-map-scale: 1.018;
  --monitoring-journey-map-shift: 0px;
  --monitoring-journey-final-copy-opacity: 0;
  --monitoring-journey-final-copy-shift: 18px;
  --monitoring-journey-stage-height: max(620px, calc(100svh - var(--header-height)));
  position: relative;
  min-height: var(--monitoring-journey-stage-height);
  background: #f8fafc;
}

.monitoring-journey.is-enhanced {
  height: calc(var(--monitoring-journey-stage-height) + 100svh);
}

.monitoring-journey__stage {
  position: relative;
  isolation: isolate;
  height: var(--monitoring-journey-stage-height);
  min-height: var(--monitoring-journey-stage-height);
  overflow: hidden;
  background: #f8fafc;
}

.monitoring-journey.is-enhanced .monitoring-journey__stage {
  position: sticky;
  top: var(--header-height);
}

.monitoring-journey__media,
.monitoring-journey__picture,
.monitoring-journey__video,
.monitoring-journey__picture img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
}

.monitoring-journey__media {
  z-index: 0;
  overflow: hidden;
  background: #f8fafc;
}

.monitoring-journey__picture {
  margin: 0;
  pointer-events: none;
}

.monitoring-journey__video,
.monitoring-journey__intro-frame {
  object-fit: cover;
  object-position: 50% 50%;
}

.monitoring-journey__video {
  z-index: 0;
  background: #f8fafc;
  transform: translateX(var(--monitoring-journey-map-shift));
  will-change: transform;
}

.monitoring-journey__picture--intro {
  z-index: 1;
  opacity: var(--monitoring-journey-intro-opacity);
  transition: opacity 180ms ease;
  will-change: opacity;
}

.monitoring-journey__picture--map {
  z-index: 2;
  background: #f8fafc;
  opacity: var(--monitoring-journey-map-opacity);
  transform: translateX(var(--monitoring-journey-map-shift)) scale(var(--monitoring-journey-map-scale));
  transform-origin: 72% 50%;
  transition:
    opacity 220ms var(--ease-out, cubic-bezier(0.23, 1, 0.32, 1)),
    transform 180ms linear;
  will-change: opacity, transform;
}

.monitoring-journey__picture--map::before,
.monitoring-journey__picture--map::after {
  position: absolute;
  content: "";
  pointer-events: none;
}

.monitoring-journey__picture--map::before {
  z-index: 2;
  top: 0;
  right: 0;
  bottom: 0;
  width: clamp(96px, 7vw, 150px);
  background: linear-gradient(
    to left,
    rgba(248, 250, 252, 1) 0%,
    rgba(248, 250, 252, 0.92) 18%,
    rgba(248, 250, 252, 0.55) 48%,
    rgba(248, 250, 252, 0.16) 78%,
    transparent 100%
  );
}

.monitoring-journey__picture--map::after {
  z-index: 1;
  top: -4px;
  right: 0;
  bottom: 0;
  left: 0;
  background:
    linear-gradient(
      to bottom,
      rgba(248, 250, 252, 1) 0%,
      rgba(248, 250, 252, 0.96) 4%,
      rgba(248, 250, 252, 0.62) 8%,
      rgba(248, 250, 252, 0.16) 12%,
      transparent 16%
    ),
    linear-gradient(
      90deg,
      rgba(248, 250, 252, 0.99) 0%,
      rgba(248, 250, 252, 0.96) 20%,
      rgba(248, 250, 252, 0.58) 28%,
      rgba(248, 250, 252, 0.08) 34%,
      transparent 40%
    );
}

.monitoring-journey__picture .monitoring-journey__map-frame {
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 50%;
}

.monitoring-journey__intro {
  position: absolute;
  z-index: 3;
  inset: 0;
  display: grid;
  align-items: center;
  padding: clamp(32px, 5vw, 76px);
  opacity: var(--monitoring-journey-intro-opacity);
  transition: opacity 180ms ease;
  will-change: opacity;
}

.monitoring-journey__intro::before {
  position: absolute;
  z-index: -1;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(248, 250, 252, 0.98) 0%, rgba(248, 250, 252, 0.9) 28%, rgba(248, 250, 252, 0.08) 48%, transparent 67%),
    linear-gradient(270deg, rgba(248, 250, 252, 0.82) 0%, rgba(248, 250, 252, 0.26) 21%, transparent 36%);
  content: "";
  pointer-events: none;
}

.monitoring-journey.is-intro-hidden .monitoring-journey__intro {
  pointer-events: none;
}

.monitoring-journey__intro-grid {
  display: grid;
  grid-template-columns: minmax(360px, 610px) minmax(240px, 330px);
  gap: clamp(40px, 8vw, 150px);
  justify-content: space-between;
  align-items: center;
  width: min(100%, 1760px);
  margin: 0 auto;
}

.monitoring-journey__copy {
  min-width: 0;
  padding-left: clamp(18px, 2.2vw, 34px);
  border-left: 4px solid var(--sv-red, #ff0000);
}

.monitoring-journey__eyebrow {
  margin: 0 0 15px;
  color: var(--sv-navy, #002f6c);
  font-size: 11px;
  font-weight: 850;
  letter-spacing: 0.13em;
  line-height: 1.2;
  text-transform: uppercase;
}

.monitoring-journey__copy h2 {
  max-width: 640px;
  margin: 0;
  color: var(--sv-navy-ink, #0f2340);
  font-size: clamp(44px, 5.15vw, 82px);
  font-weight: 860;
  letter-spacing: -0.055em;
  line-height: 0.91;
  text-wrap: balance;
}

.monitoring-journey__copy h2 > span {
  display: block;
}

.monitoring-journey__title-accent {
  --monitoring-title-accent-base: var(--sv-navy-ink, #0f2340);
  background-image: linear-gradient(
    90deg,
    var(--sv-red, #ff0000) 0 50%,
    var(--monitoring-title-accent-base) 50% 100%
  );
  background-position: 100% 0;
  background-size: 200% 100%;
  background-repeat: no-repeat;
  -webkit-background-clip: text;
  background-clip: text;
  color: var(--monitoring-title-accent-base);
  -webkit-text-fill-color: transparent;
}

.monitoring-journey.is-title-filled .monitoring-journey__title-accent {
  animation: monitoring-journey-title-sweep 0.72s var(--ease-out, ease) 0.12s both;
}

@keyframes monitoring-journey-title-sweep {
  from { background-position: 100% 0; }
  to { background-position: 0 0; }
}

.monitoring-journey__cta {
  display: inline-flex;
  min-height: 56px;
  align-items: center;
  justify-content: center;
  margin-top: clamp(26px, 3.2vw, 42px);
  padding: 0 clamp(24px, 3vw, 38px);
  border: 1px solid var(--sv-navy, #002f6c);
  border-radius: 0;
  background-color: var(--sv-navy, #002f6c);
  background-image: linear-gradient(var(--sv-red, #ff0000), var(--sv-red, #ff0000));
  background-position: left center;
  background-repeat: no-repeat;
  background-size: 0 100%;
  color: #fff;
  font-size: clamp(15px, 1.35vw, 19px);
  font-weight: 780;
  line-height: 1;
  text-decoration: none;
  touch-action: manipulation;
  transition:
    background-size 480ms var(--ease-out, cubic-bezier(0.23, 1, 0.32, 1)),
    border-color 180ms ease,
    color 180ms ease,
    transform 140ms var(--ease-out, cubic-bezier(0.23, 1, 0.32, 1));
}

.monitoring-journey__cta:hover,
.monitoring-journey__cta:focus-visible {
  border-color: var(--sv-red, #ff0000);
  background-size: 100% 100%;
  color: #fff;
}

.monitoring-journey__cta:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 3px;
  box-shadow: 0 0 0 5px var(--sv-navy, #002f6c);
}

.monitoring-journey__cta:active {
  transform: scale(0.98);
}

.monitoring-journey__offer {
  position: absolute;
  top: clamp(54px, 7.2svh, 76px);
  right: clamp(34px, 5vw, 76px);
  width: min(390px, 29vw);
  max-width: 390px;
  margin: 0;
  padding: 20px 22px 22px;
  border-left: 3px solid var(--sv-red, #ff0000);
  background: rgba(248, 250, 252, 0.82);
  box-shadow: 0 18px 44px rgba(15, 35, 64, 0.08);
  color: var(--sv-navy-ink, #0f2340);
  font-family: var(--service-font-body);
  font-size: clamp(15px, 1.05vw, 18px);
  font-weight: 520;
  letter-spacing: -0.012em;
  line-height: 1.45;
  backdrop-filter: blur(8px);
}

.monitoring-journey__offer-kicker {
  display: block;
  margin-bottom: 10px;
  color: var(--sv-navy, #002f6c);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.12em;
  line-height: 1.2;
  text-transform: uppercase;
}

.monitoring-journey__offer-lead {
  display: block;
  font-size: clamp(18px, 1.25vw, 21px);
  font-weight: 760;
  letter-spacing: -0.026em;
  line-height: 1.3;
}

.monitoring-journey__offer-access {
  display: block;
  margin-top: 9px;
  color: rgba(15, 35, 64, 0.78);
  font-weight: 580;
}

.monitoring-journey__offer-access b {
  color: var(--sv-red, #ff0000);
  font: inherit;
  font-weight: 800;
}

.monitoring-journey__offer-bonus {
  display: block;
  margin-top: 15px;
  padding-top: 14px;
  border-top: 1px solid rgba(0, 47, 108, 0.16);
  color: var(--sv-navy-ink, #0f2340);
  font-size: 0.94em;
  font-weight: 680;
  letter-spacing: -0.01em;
  line-height: 1.4;
}

.monitoring-journey__offer-bonus strong {
  color: var(--sv-red, #ff0000);
  font-weight: 800;
}

.monitoring-journey__offer-total {
  display: block;
  margin-top: 12px;
  padding: 10px 12px;
  background: rgba(0, 47, 108, 0.065);
  color: var(--sv-navy, #002f6c);
  font-size: 0.9em;
  font-weight: 680;
  letter-spacing: -0.012em;
  line-height: 1.35;
}

.monitoring-journey__offer-total strong {
  font-weight: 820;
}

.monitoring-journey__map-ui {
  position: absolute;
  z-index: 5;
  inset: 0;
  display: grid;
  align-items: center;
  padding-block: clamp(32px, 5vw, 76px);
  padding-inline: max(var(--page-pad), calc((100% - var(--page-max)) / 2));
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition:
    opacity 220ms var(--ease-out, cubic-bezier(0.23, 1, 0.32, 1)),
    visibility 0s 220ms;
}

.monitoring-journey.is-final .monitoring-journey__map-ui {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition:
    opacity 220ms var(--ease-out, cubic-bezier(0.23, 1, 0.32, 1)),
    visibility 0s;
}

.monitoring-journey__final-copy {
  width: min(41vw, 560px);
  padding-left: clamp(18px, 2vw, 28px);
  border-left: 3px solid var(--sv-red, #ff0000);
  opacity: var(--monitoring-journey-final-copy-opacity);
  transform: translateY(var(--monitoring-journey-final-copy-shift));
  transition:
    opacity 220ms ease,
    transform 320ms var(--ease-out, cubic-bezier(0.23, 1, 0.32, 1));
  will-change: opacity, transform;
}

.monitoring-journey__final-eyebrow {
  margin: 0 0 15px;
  color: var(--sv-navy, #002f6c);
  font-size: 11px;
  font-weight: 850;
  letter-spacing: 0.13em;
  line-height: 1.2;
  text-transform: uppercase;
}

.monitoring-journey__final-copy h2 {
  max-width: 560px;
  margin: 0;
  color: var(--sv-navy-ink, #0f2340);
  font-size: clamp(40px, 3.05vw, 49px);
  font-weight: 760;
  letter-spacing: -0.045em;
  line-height: 1.01;
  text-wrap: balance;
}

.monitoring-journey__final-copy h2 span {
  display: block;
  color: var(--sv-red, #ff0000);
}

.monitoring-journey__final-text {
  max-width: 500px;
  margin: 24px 0 0;
  color: #53657a;
  font-size: clamp(15px, 1.05vw, 17px);
  line-height: 1.55;
}

.monitoring-journey__final-cta {
  min-height: 52px;
  margin-top: 26px;
  padding-inline: 28px;
  font-size: 15px;
}

.monitoring-journey.is-static {
  min-height: 0;
  background: #f8fafc;
}

.monitoring-journey.is-static .monitoring-journey__stage {
  height: auto;
  min-height: 0;
  padding-top: var(--monitoring-journey-stage-height);
  overflow: visible;
}

.monitoring-journey.is-static .monitoring-journey__media,
.monitoring-journey.is-static .monitoring-journey__intro {
  top: 0;
  bottom: auto;
  height: var(--monitoring-journey-stage-height);
}

.monitoring-journey.is-static .monitoring-journey__picture--map {
  display: none;
}

.monitoring-journey.is-static .monitoring-journey__map-ui {
  position: relative;
  inset: auto;
  min-height: var(--monitoring-journey-stage-height);
  margin-top: 0;
  background:
    linear-gradient(
      90deg,
      rgba(248, 250, 252, 0.99) 0%,
      rgba(248, 250, 252, 0.96) 29%,
      rgba(248, 250, 252, 0.58) 40%,
      rgba(248, 250, 252, 0.08) 54%,
      transparent 67%
    ),
    url("./monitoring/campaign-scroll/monitoring-final-1920.webp?v=20260801-3") 56% 50% / auto 86% no-repeat;
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition: none;
}

.monitoring-journey.is-static .monitoring-journey__final-copy {
  opacity: 1;
  transform: none;
  transition: none;
}

.monitoring-journey__map-caption {
  position: absolute;
  top: clamp(74px, 9svh, 104px);
  right: clamp(20px, 3vw, 48px);
  display: grid;
  gap: 5px;
  min-width: 240px;
  padding: 16px 18px 17px;
  border-left: 3px solid var(--sv-red, #ff0000);
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 18px 44px rgba(15, 35, 64, 0.14);
  color: var(--sv-navy-ink, #0f2340);
  backdrop-filter: blur(12px);
}

.monitoring-journey__map-caption span {
  color: #53657a;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.monitoring-journey__map-caption strong {
  font-size: 17px;
  letter-spacing: -0.025em;
}

.monitoring-journey__vehicle {
  position: absolute;
  z-index: 2;
  width: 56px;
  height: 56px;
  margin: -28px 0 0 -28px;
  pointer-events: none;
}

.monitoring-journey__vehicle button {
  position: relative;
  z-index: 2;
  display: grid;
  width: 56px;
  height: 56px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  cursor: pointer;
  pointer-events: auto;
  place-items: center;
  touch-action: manipulation;
}

.monitoring-journey__vehicle button > span {
  display: block;
  width: clamp(14px, 2.4vw, 38px);
  height: clamp(14px, 2.4vw, 38px);
  border: 2px solid rgba(255, 0, 0, 0.48);
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.04);
  opacity: 0.48;
  transition:
    background-color 160ms ease,
    border-color 160ms ease,
    opacity 160ms ease,
    transform 140ms var(--ease-out, cubic-bezier(0.23, 1, 0.32, 1));
}

.monitoring-journey__vehicle button:hover > span,
.monitoring-journey__vehicle button:focus-visible > span,
.monitoring-journey__vehicle.is-open button > span {
  border-color: var(--sv-red, #ff0000);
  background: rgba(255, 255, 255, 0.16);
  opacity: 1;
}

.monitoring-journey__vehicle button:focus-visible {
  outline: 3px solid var(--sv-red, #ff0000);
  outline-offset: 2px;
}

.monitoring-journey__vehicle button:active > span {
  transform: scale(0.96);
}

.monitoring-journey__vehicle-tooltip {
  --monitoring-tooltip-x: 0;
  position: absolute;
  z-index: 4;
  top: calc(100% + 12px);
  left: -8px;
  width: min(292px, calc(100vw - 32px));
  padding: 16px 17px 17px;
  border: 1px solid rgba(15, 35, 64, 0.16);
  border-top: 3px solid var(--sv-red, #ff0000);
  border-radius: 0;
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 22px 58px rgba(15, 35, 64, 0.22);
  color: var(--sv-navy-ink, #0f2340);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translate(var(--monitoring-tooltip-x), 8px);
  transform-origin: top left;
  transition:
    opacity 160ms ease,
    transform 180ms var(--ease-out, cubic-bezier(0.23, 1, 0.32, 1)),
    visibility 0s 180ms;
}

.monitoring-journey__vehicle[data-tooltip-align="center"] .monitoring-journey__vehicle-tooltip {
  --monitoring-tooltip-x: -50%;
  left: 50%;
  transform-origin: top center;
}

.monitoring-journey__vehicle[data-tooltip-align="end"] .monitoring-journey__vehicle-tooltip {
  right: -8px;
  left: auto;
  transform-origin: top right;
}

.monitoring-journey__vehicle[data-tooltip-side="top"] .monitoring-journey__vehicle-tooltip {
  top: auto;
  bottom: calc(100% + 12px);
  transform-origin: bottom right;
}

.monitoring-journey__vehicle.is-open {
  z-index: 8;
}

.monitoring-journey__vehicle.is-open .monitoring-journey__vehicle-tooltip {
  opacity: 1;
  visibility: visible;
  transform: translate(var(--monitoring-tooltip-x), 0);
  transition:
    opacity 160ms ease,
    transform 180ms var(--ease-out, cubic-bezier(0.23, 1, 0.32, 1)),
    visibility 0s;
}

@media (hover: hover) and (pointer: fine) {
  .monitoring-journey__vehicle:hover {
    z-index: 8;
  }

  .monitoring-journey__vehicle:hover .monitoring-journey__vehicle-tooltip {
    opacity: 1;
    visibility: visible;
    transform: translate(var(--monitoring-tooltip-x), 0);
    transition:
      opacity 160ms ease,
      transform 180ms var(--ease-out, cubic-bezier(0.23, 1, 0.32, 1)),
      visibility 0s;
  }
}

.monitoring-journey__vehicle-head {
  display: flex;
  gap: 16px;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 12px;
  border-bottom: 1px solid #dfe6ee;
}

.monitoring-journey__vehicle-head strong {
  font-size: 15px;
  letter-spacing: -0.02em;
}

.monitoring-journey__vehicle-head span {
  display: inline-flex;
  gap: 6px;
  align-items: center;
  color: #23633b;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.monitoring-journey__vehicle-head span::before {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #2c9b55;
  content: "";
}

.monitoring-journey__vehicle-tooltip dl {
  display: grid;
  gap: 0;
  margin: 8px 0 0;
}

.monitoring-journey__vehicle-tooltip dl > div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: baseline;
  padding: 7px 0;
}

.monitoring-journey__vehicle-tooltip dt {
  color: #5d6d80;
  font-size: 11px;
  line-height: 1.25;
}

.monitoring-journey__vehicle-tooltip dd {
  margin: 0;
  color: var(--sv-navy-ink, #0f2340);
  font-family: var(--service-font-data);
  font-size: 13px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  line-height: 1;
  white-space: nowrap;
}

@media (max-width: 1100px) {
  .monitoring-journey__intro {
    padding: 38px 34px;
  }

  .monitoring-journey__intro-grid {
    grid-template-columns: minmax(320px, 500px) minmax(210px, 280px);
    gap: 52px;
  }

  .monitoring-journey__copy h2 {
    font-size: clamp(40px, 5.7vw, 61px);
  }

  .monitoring-journey__offer {
    font-size: 15px;
  }

  .monitoring-journey__offer-lead {
    font-size: 18px;
  }

  .monitoring-journey__map-ui {
    padding-block: 38px;
  }

  .monitoring-journey__final-copy {
    width: min(45vw, 500px);
  }

  .monitoring-journey__final-copy h2 {
    font-size: clamp(39px, 4.6vw, 48px);
  }

  .monitoring-journey__final-text {
    max-width: 380px;
  }

}

@media (max-width: 900px) {
  .monitoring-journey {
    --monitoring-journey-stage-height: calc(100svh - var(--header-height));
    --monitoring-journey-map-shift: 0px;
  }

  .monitoring-journey__video,
  .monitoring-journey__intro-frame {
    object-position: 61% 50%;
  }

  .monitoring-journey__picture .monitoring-journey__map-frame {
    inset: 4%;
    width: 92%;
    height: 92%;
    object-position: 68% 50%;
  }

  .monitoring-journey__picture--map {
    transform-origin: 68% 50%;
  }

  .monitoring-journey__picture--map::before {
    display: none;
  }

  .monitoring-journey__picture--map::after {
    background: linear-gradient(
      180deg,
      rgba(248, 250, 252, 0.99) 0%,
      rgba(248, 250, 252, 0.96) 32%,
      rgba(248, 250, 252, 0.72) 49%,
      rgba(248, 250, 252, 0.08) 69%,
      transparent 82%
    );
  }

  .monitoring-journey.is-static .monitoring-journey__map-ui {
    background:
      linear-gradient(
        180deg,
        rgba(248, 250, 252, 0.99) 0%,
        rgba(248, 250, 252, 0.96) 32%,
        rgba(248, 250, 252, 0.72) 49%,
        rgba(248, 250, 252, 0.08) 69%,
        transparent 82%
      ),
      url("./monitoring/campaign-scroll/monitoring-final-1920.webp?v=20260801-3") 76% 50% / auto 86% no-repeat;
  }

  .monitoring-journey__intro {
    align-items: start;
    padding: clamp(30px, 5vw, 48px) clamp(20px, 5vw, 44px) 86px;
  }

  .monitoring-journey__intro::before {
    background:
      linear-gradient(90deg, rgba(248, 250, 252, 0.98) 0%, rgba(248, 250, 252, 0.92) 47%, rgba(248, 250, 252, 0.1) 78%),
      linear-gradient(180deg, rgba(248, 250, 252, 0.97) 0%, rgba(248, 250, 252, 0.82) 46%, rgba(248, 250, 252, 0.04) 80%);
  }

  .monitoring-journey__intro-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 22px;
    align-content: start;
  }

  .monitoring-journey__copy {
    width: min(100%, 520px);
  }

  .monitoring-journey__copy h2 {
    font-size: clamp(38px, 8.2vw, 60px);
  }

  .monitoring-journey__offer {
    position: static;
    width: auto;
    max-width: 480px;
    padding: 0 0 0 clamp(22px, 3vw, 34px);
    border-left: 0;
    background: transparent;
    box-shadow: none;
    font-size: clamp(15px, 2.2vw, 18px);
    backdrop-filter: none;
  }

  .monitoring-journey__offer-lead {
    font-size: clamp(18px, 2.8vw, 21px);
  }

  .monitoring-journey__map-ui {
    align-items: start;
    padding: clamp(30px, 5vw, 48px) clamp(20px, 5vw, 44px) 86px;
  }

  .monitoring-journey__final-copy {
    width: min(100%, 540px);
  }

  .monitoring-journey__final-copy h2 {
    font-size: clamp(36px, 7.6vw, 48px);
  }

  .monitoring-journey__final-text {
    max-width: 480px;
    font-size: clamp(15px, 2.2vw, 18px);
  }

  .monitoring-journey__map-caption {
    top: 70px;
    right: 16px;
    min-width: 0;
    padding: 12px 14px 13px;
  }

  .monitoring-journey__map-caption strong {
    font-size: 14px;
  }

  .monitoring-journey__vehicle {
    width: 48px;
    height: 48px;
    margin: -24px 0 0 -24px;
  }

  .monitoring-journey__vehicle button {
    width: 48px;
    height: 48px;
  }

  .monitoring-journey__vehicle-tooltip,
  .monitoring-journey__vehicle[data-tooltip-align="center"] .monitoring-journey__vehicle-tooltip,
  .monitoring-journey__vehicle[data-tooltip-align="end"] .monitoring-journey__vehicle-tooltip,
  .monitoring-journey__vehicle[data-tooltip-side="top"] .monitoring-journey__vehicle-tooltip {
    position: fixed;
    top: auto;
    right: 16px;
    bottom: calc(78px + env(safe-area-inset-bottom));
    left: 16px;
    width: auto;
    transform: translateY(8px);
    transform-origin: bottom center;
  }

  .monitoring-journey__vehicle.is-open .monitoring-journey__vehicle-tooltip {
    transform: translateY(0);
  }
}

@media (max-width: 600px) {
  .monitoring-journey__intro {
    padding: 24px 16px 78px;
  }

  .monitoring-journey__copy {
    width: min(100%, 430px);
    padding-left: 15px;
    border-left-width: 3px;
  }

  .monitoring-journey__eyebrow {
    margin-bottom: 10px;
    font-size: 9px;
  }

  .monitoring-journey__copy h2 {
    font-size: clamp(34px, 11.8vw, 48px);
    line-height: 0.94;
  }

  .monitoring-journey__cta {
    min-height: 50px;
    margin-top: 22px;
    padding: 0 22px;
    font-size: 15px;
  }

  .monitoring-journey__offer {
    max-width: 360px;
    padding-left: 18px;
    font-size: 14px;
    line-height: 1.45;
  }

  .monitoring-journey__offer-kicker {
    font-size: 10px;
  }

  .monitoring-journey__offer-lead {
    font-size: 16px;
  }

  .monitoring-journey__offer-total {
    padding: 9px 10px;
  }

  .monitoring-journey__picture .monitoring-journey__map-frame {
    object-position: 98% 50%;
  }

  .monitoring-journey.is-static .monitoring-journey__map-ui {
    background-position: 0 0, 73% 100%;
    background-size: auto, auto 52%;
  }

  .monitoring-journey__map-ui {
    padding: 24px 16px 78px;
  }

  .monitoring-journey__final-copy {
    width: min(100%, 430px);
    padding-left: 15px;
    border-left-width: 3px;
  }

  .monitoring-journey__final-eyebrow {
    margin-bottom: 10px;
    font-size: 9px;
  }

  .monitoring-journey__final-copy h2 {
    font-size: clamp(34px, 10.2vw, 44px);
    line-height: 1.01;
  }

  .monitoring-journey__final-text {
    max-width: 350px;
    margin-top: 16px;
    font-size: 14px;
    line-height: 1.45;
  }

  .monitoring-journey__final-cta {
    max-width: 100%;
    margin-top: 20px;
    padding-inline: 18px;
    font-size: 14px;
  }

  .monitoring-journey__map-caption {
    top: 62px;
    right: 10px;
    padding: 10px 11px;
  }

  .monitoring-journey__map-caption span {
    font-size: 8px;
  }

  .monitoring-journey__map-caption strong {
    font-size: 12px;
  }

  .monitoring-journey__vehicle-tooltip,
  .monitoring-journey__vehicle[data-tooltip-align="center"] .monitoring-journey__vehicle-tooltip,
  .monitoring-journey__vehicle[data-tooltip-align="end"] .monitoring-journey__vehicle-tooltip,
  .monitoring-journey__vehicle[data-tooltip-side="top"] .monitoring-journey__vehicle-tooltip {
    right: 10px;
    bottom: calc(66px + env(safe-area-inset-bottom));
    left: 10px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .monitoring-journey__title-accent {
    background-position: 0 0;
    animation: none !important;
  }

  .monitoring-journey.is-enhanced {
    height: var(--monitoring-journey-stage-height);
  }

  .monitoring-journey.is-enhanced .monitoring-journey__stage {
    position: relative;
    top: auto;
  }

  .monitoring-journey__picture--intro,
  .monitoring-journey__picture--map,
  .monitoring-journey__intro,
  .monitoring-journey__map-ui,
  .monitoring-journey__final-copy,
  .monitoring-journey__vehicle-tooltip,
  .monitoring-journey__vehicle button > span {
    transition: none;
  }
}

/* GLONASS monitoring capabilities */

.monitoring-capabilities-flow {
  position: relative;
  background:
    radial-gradient(circle at 88% 16%, rgba(26, 82, 156, 0.42), transparent 34%),
    radial-gradient(circle at 14% 68%, rgba(16, 56, 112, 0.38), transparent 40%),
    linear-gradient(135deg, #01152f 0%, #032653 50%, #011a3b 100%);
}

.monitoring-capabilities {
  position: relative;
  isolation: isolate;
  overflow: clip;
  padding: clamp(64px, 7vw, 104px) 0;
  background: transparent;
  color: #ffffff;
}

.monitoring-capabilities::before {
  content: none;
}

.monitoring-capabilities__section-title {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}

.monitoring-capabilities__stage {
  position: relative;
  width: min(calc(100% - (var(--page-pad) * 2)), var(--page-max));
  margin: 0 auto;
}

.monitoring-capability {
  display: grid;
  grid-template-columns: minmax(300px, 0.82fr) minmax(460px, 1.38fr);
  gap: clamp(42px, 6vw, 90px);
  align-items: center;
  min-height: min(720px, 76svh);
  padding: clamp(48px, 6vw, 82px) 0;
  border: 0;
}

.monitoring-capability:last-child {
  border-bottom: 0;
}

.monitoring-capability__copy {
  min-width: 0;
}

.monitoring-capability__eyebrow {
  margin: 0 0 14px;
  color: rgba(255, 255, 255, 0.6);
  font-size: 11px;
  font-weight: 850;
  letter-spacing: 0.13em;
  line-height: 1.2;
  text-transform: uppercase;
}

.monitoring-capability h3 {
  max-width: 540px;
  margin: 0;
  color: #ffffff;
  font-size: clamp(36px, 3.15vw, 50px);
  font-weight: 790;
  letter-spacing: -0.048em;
  line-height: 1.01;
  text-wrap: balance;
}

@media (min-width: 901px) {
  .monitoring-capability__title-line {
    display: block;
    white-space: nowrap;
  }
}

.monitoring-capability__accent {
  --monitoring-capability-accent-base: #ffffff;
  background-image: linear-gradient(
    90deg,
    var(--sv-red, #ff0000) 0 50%,
    var(--monitoring-capability-accent-base) 50% 100%
  );
  background-position: 100% 0;
  background-size: 200% 100%;
  background-repeat: no-repeat;
  -webkit-background-clip: text;
  background-clip: text;
  color: var(--monitoring-capability-accent-base);
  -webkit-text-fill-color: transparent;
}

.monitoring-capability__text {
  max-width: 530px;
  margin: clamp(20px, 2vw, 28px) 0 0;
  color: rgba(255, 255, 255, 0.7);
  font-size: clamp(16px, 1.22vw, 18px);
  font-weight: 500;
  letter-spacing: -0.012em;
  line-height: 1.62;
}

.monitoring-capability.is-current .monitoring-capability__accent {
  animation: monitoring-capability-fill 0.72s var(--ease-out, ease) 0.08s both;
}

@keyframes monitoring-capability-fill {
  from { background-position: 100% 0; }
  to { background-position: 0 0; }
}

.monitoring-capability__media {
  position: relative;
  min-width: 0;
  margin: 0;
}

.monitoring-capability__media figcaption {
  display: flex;
  gap: 12px;
  align-items: center;
  margin: 0 0 12px;
  color: rgba(255, 255, 255, 0.58);
  font-family: var(--service-font-data);
  font-size: 11px;
  font-weight: 780;
  letter-spacing: 0.1em;
  line-height: 1.2;
  text-transform: uppercase;
}

.monitoring-capability__media figcaption span {
  color: var(--sv-red, #ff0000);
}

.monitoring-capability__video-frame {
  position: relative;
  isolation: isolate;
  aspect-ratio: 1.39 / 1;
  overflow: visible;
  border-radius: clamp(16px, 1.45vw, 22px);
  background: #061a37;
  box-shadow:
    0 0 0 3px #000,
    0 0 52px -22px rgba(255, 14, 28, 0.86),
    0 0 104px -52px rgba(255, 0, 18, 0.72);
}

.monitoring-capability__video-frame::before {
  position: absolute;
  z-index: 3;
  inset: 0;
  background: linear-gradient(112deg, rgba(1, 12, 29, 0.94), rgba(3, 27, 59, 0.88) 54%, rgba(5, 47, 96, 0.68));
  content: "";
  opacity: 0;
  pointer-events: none;
  border-radius: inherit;
}

.monitoring-capability__video-frame::after {
  --monitoring-capability-grid-opacity: 0.68;
  position: absolute;
  z-index: -1;
  inset: -96px;
  border-radius: 54px;
  background:
    linear-gradient(90deg, rgba(255, 34, 44, 0.28) 1px, transparent 1px) 0 0 / 54px 54px,
    linear-gradient(rgba(255, 34, 44, 0.25) 1px, transparent 1px) 0 0 / 54px 54px,
    radial-gradient(ellipse closest-side at 50% 50%, rgba(255, 15, 28, 0.48), rgba(255, 0, 18, 0.15) 58%, rgba(9, 61, 120, 0.08) 78%, transparent 100%);
  content: "";
  filter:
    drop-shadow(0 0 18px rgba(255, 0, 18, 0.42))
    drop-shadow(0 0 34px rgba(255, 0, 18, 0.2));
  -webkit-mask-image: radial-gradient(ellipse closest-side at center, #000 0 68%, rgba(0, 0, 0, 0.92) 76%, rgba(0, 0, 0, 0.38) 88%, transparent 100%);
  mask-image: radial-gradient(ellipse closest-side at center, #000 0 68%, rgba(0, 0, 0, 0.92) 76%, rgba(0, 0, 0, 0.38) 88%, transparent 100%);
  opacity: var(--monitoring-capability-grid-opacity);
  pointer-events: none;
}

.monitoring-capabilities__media-stack.is-switching-out
  .monitoring-capability__media.is-current
  .monitoring-capability__video-frame::before {
  animation: monitoring-capability-cover 110ms cubic-bezier(0.4, 0, 1, 1) both;
}

.monitoring-capabilities__media-stack.is-switching-in
  .monitoring-capability__media.is-current
  .monitoring-capability__video-frame::before {
  animation: monitoring-capability-reveal 180ms cubic-bezier(0, 0, 0.2, 1) both;
}

@keyframes monitoring-capability-cover {
  from { opacity: 0; }
  to { opacity: 0.86; }
}

@keyframes monitoring-capability-reveal {
  from { opacity: 0.86; }
  to { opacity: 0; }
}

.monitoring-capability__video-frame img,
.monitoring-capability__video-frame video {
  position: absolute;
  z-index: 1;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  border-radius: inherit;
  background: #061a37;
  object-fit: contain;
  object-position: center;
}

.monitoring-capability__video-frame video {
  z-index: 1;
  opacity: 0;
  transition: opacity 140ms linear;
}

.monitoring-capability__video-frame.is-ready video {
  opacity: 1;
}

.monitoring-capabilities__progress {
  display: none;
}

.monitoring-capabilities__mobile-controls,
.monitoring-capabilities__mobile-pagination {
  display: none;
}

.monitoring-capabilities.is-enhanced {
  --monitoring-capability-step-height: clamp(560px, 64svh, 600px);
  --monitoring-capability-runway: max(
    0px,
    calc((100svh - var(--header-height) - var(--monitoring-capability-step-height)) / 2)
  );
  padding: 0;
  overflow: clip;
}

.monitoring-capabilities.is-enhanced .monitoring-capabilities__stage {
  display: grid;
  grid-template-columns: minmax(320px, 0.76fr) minmax(0, 1.34fr);
  gap: clamp(44px, 5.4vw, 86px);
  align-items: stretch;
}

.monitoring-capabilities.is-enhanced .monitoring-capabilities__list {
  padding-block:
    calc(var(--monitoring-capability-runway) + 13px)
    max(0px, calc(var(--monitoring-capability-runway) - 13px));
}

.monitoring-capabilities.is-enhanced .monitoring-capability {
  display: flex;
  align-items: center;
  min-height: var(--monitoring-capability-step-height);
  padding: clamp(18px, 2.5svh, 24px) 0;
}

.monitoring-capabilities.is-enhanced .monitoring-capability__copy {
  width: 100%;
  opacity: var(--monitoring-capability-visibility, 0.12);
  transition: opacity 100ms linear;
  will-change: opacity;
}

.monitoring-capabilities__media-column {
  display: none;
}

.monitoring-capabilities.is-enhanced .monitoring-capabilities__media-column {
  position: relative;
  display: block;
  min-height: 100%;
}

.monitoring-capabilities.is-enhanced .monitoring-capabilities__media-stack {
  position: sticky;
  top: var(--header-height);
  width: calc(100% + clamp(28px, 3.2vw, 48px));
  height: calc(100svh - var(--header-height));
}

.monitoring-capabilities.is-enhanced .monitoring-capability__media {
  position: absolute;
  z-index: 0;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin: 0;
  opacity: 0;
  pointer-events: none;
  transition: none;
}

.monitoring-capabilities.is-enhanced .monitoring-capability__media.is-current {
  z-index: 2;
  opacity: 1;
}

.monitoring-capabilities.is-enhanced .monitoring-capability__media figcaption {
  opacity: 0;
  transition: opacity 0s linear;
}

.monitoring-capabilities.is-enhanced .monitoring-capability__media.is-current figcaption {
  opacity: 1;
  transition: opacity 200ms ease 100ms;
}

.monitoring-mobile-access {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: clamp(78px, 9vw, 132px) 0;
  background: transparent;
  color: #ffffff;
}

.monitoring-mobile-access__layout {
  display: grid;
  grid-template-columns: minmax(240px, 0.62fr) minmax(390px, 1fr);
  gap: clamp(64px, 9vw, 128px);
  align-items: center;
}

.monitoring-mobile-access__copy {
  grid-column: 2;
  grid-row: 1;
  max-width: 620px;
  padding-left: clamp(18px, 2vw, 28px);
  border-left: 3px solid var(--sv-red, #ff0000);
}

.monitoring-mobile-access__eyebrow {
  margin: 0 0 16px;
  color: rgba(255, 255, 255, 0.6);
  font-size: 11px;
  font-weight: 850;
  letter-spacing: 0.13em;
  line-height: 1.2;
  text-transform: uppercase;
}

.monitoring-mobile-access h2 {
  margin: 0;
  color: #ffffff;
  font-size: clamp(36px, 3.15vw, 50px);
  font-weight: 820;
  letter-spacing: -0.052em;
  line-height: 0.98;
  text-wrap: balance;
}

.monitoring-mobile-access h2 span {
  background-image: linear-gradient(
    90deg,
    var(--sv-red, #ff0000) 0 50%,
    #ffffff 50% 100%
  );
  background-position: 100% 0;
  background-size: 200% 100%;
  background-repeat: no-repeat;
  -webkit-background-clip: text;
  background-clip: text;
  color: #ffffff;
  -webkit-text-fill-color: transparent;
}

.monitoring-mobile-access.is-visible h2 span {
  animation: monitoring-capability-fill 0.76s var(--ease-out, ease) 0.1s both;
}

.monitoring-mobile-access__text {
  max-width: 560px;
  margin: clamp(22px, 2.4vw, 32px) 0 0;
  color: rgba(255, 255, 255, 0.7);
  font-size: clamp(17px, 1.3vw, 19px);
  font-weight: 500;
  letter-spacing: -0.012em;
  line-height: 1.62;
}

.monitoring-mobile-access__actions {
  margin-top: clamp(24px, 2.4vw, 32px);
}

.monitoring-mobile-access__messengers.messenger-switch {
  width: min(100%, 286px);
  border-color: rgba(255, 255, 255, 0.72);
  background: transparent;
  box-shadow: 0 16px 34px rgba(0, 10, 28, 0.28);
}

.monitoring-mobile-access__messengers .messenger-switch__action--max {
  background: transparent;
}

.monitoring-mobile-access__device {
  position: relative;
  isolation: isolate;
  grid-column: 1;
  grid-row: 1;
  justify-self: center;
  width: min(100%, 250px);
  aspect-ratio: 780 / 1634;
  padding: 11px;
  border: 1px solid #32465f;
  border-radius: 50px;
  background: linear-gradient(145deg, #25364b 0%, #06162c 22%, #020b18 100%);
  box-shadow: 0 36px 72px rgba(0, 9, 24, 0.48);
}

.monitoring-mobile-access__device::before {
  position: absolute;
  z-index: 0;
  inset: -8px;
  border: 1px solid #32465f;
  border-radius: 58px;
  background: linear-gradient(145deg, #25364b 0%, #06162c 22%, #020b18 100%);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08);
  content: "";
  pointer-events: none;
}

.monitoring-mobile-access__device::after {
  position: absolute;
  inset: -82px -104px;
  z-index: -1;
  border-radius: 54px;
  background:
    linear-gradient(90deg, rgba(255, 34, 44, 0.28) 1px, transparent 1px) 0 0 / 54px 54px,
    linear-gradient(rgba(255, 34, 44, 0.25) 1px, transparent 1px) 0 0 / 54px 54px,
    radial-gradient(ellipse closest-side at 50% 50%, rgba(255, 15, 28, 0.48), rgba(255, 0, 18, 0.15) 58%, rgba(9, 61, 120, 0.08) 78%, transparent 100%);
  content: "";
  filter:
    drop-shadow(0 0 18px rgba(255, 0, 18, 0.42))
    drop-shadow(0 0 34px rgba(255, 0, 18, 0.2));
  -webkit-mask-image: radial-gradient(ellipse closest-side at center, #000 0 68%, rgba(0, 0, 0, 0.92) 76%, rgba(0, 0, 0, 0.38) 88%, transparent 100%);
  mask-image: radial-gradient(ellipse closest-side at center, #000 0 68%, rgba(0, 0, 0, 0.92) 76%, rgba(0, 0, 0, 0.38) 88%, transparent 100%);
  opacity: 0.68;
  pointer-events: none;
}

.monitoring-mobile-access__speaker {
  position: absolute;
  z-index: 3;
  top: 18px;
  left: 50%;
  width: 33%;
  height: 24px;
  border-radius: 999px;
  background: #06162c;
  transform: translateX(-50%);
}

.monitoring-mobile-access__device video {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 40px;
  background: #ffffff;
  box-shadow: 0 0 0 1px rgba(255, 20, 30, 0.78);
  object-fit: cover;
  opacity: 1;
  transition: opacity 300ms ease;
}

.monitoring-mobile-access__device.is-ready video {
  opacity: 1;
}

@media (max-width: 1100px) and (min-width: 901px) {
  .monitoring-capabilities.is-enhanced .monitoring-capabilities__stage {
    grid-template-columns: minmax(290px, 0.74fr) minmax(0, 1.26fr);
    gap: 38px;
  }

  .monitoring-capability h3 {
    font-size: clamp(34px, 3.6vw, 40px);
  }

  .monitoring-capability__text {
    font-size: 16px;
  }

  .monitoring-mobile-access__layout {
    grid-template-columns: minmax(220px, 0.58fr) minmax(360px, 1fr);
    gap: 52px;
  }

  .monitoring-mobile-access__device {
    width: min(100%, 232px);
  }

  .monitoring-capabilities.is-enhanced .monitoring-capabilities__media-stack {
    width: calc(100% + clamp(8px, 1.2vw, 14px));
  }

  .monitoring-capability__video-frame::after {
    inset: -72px -10px -72px -72px;
  }
}

@media (max-width: 900px) {
  .monitoring-capabilities {
    padding: clamp(46px, 8vw, 64px) 0 clamp(44px, 8vw, 64px);
  }

  .monitoring-capabilities__stage,
  .monitoring-capabilities.is-enhanced .monitoring-capabilities__stage {
    position: relative;
    top: auto;
    display: flex;
    flex-direction: column;
    width: 100%;
    height: auto;
    margin: 0;
    overflow: hidden;
  }

  .monitoring-capabilities__media-column,
  .monitoring-capabilities.is-enhanced .monitoring-capabilities__media-column {
    position: relative;
    order: 1;
    display: block;
    width: auto;
    min-height: 0;
    margin-inline: max(14px, var(--page-pad));
  }

  .monitoring-capabilities__media-stack,
  .monitoring-capabilities.is-enhanced .monitoring-capabilities__media-stack {
    position: relative;
    top: auto;
    width: 100%;
    height: auto;
    aspect-ratio: 1.39 / 1;
    overflow: visible;
    border-radius: 16px;
    background: #061a37;
    touch-action: pan-y;
    box-shadow: 0 0 38px -22px rgba(255, 18, 28, 0.78);
  }

  .monitoring-capabilities__media-stack > .monitoring-capability__media,
  .monitoring-capabilities.is-enhanced .monitoring-capabilities__media-stack > .monitoring-capability__media {
    position: absolute;
    z-index: 0;
    inset: 0;
    display: block;
    margin: 0;
    opacity: 0;
    pointer-events: none;
    transition: none;
  }

  .monitoring-capabilities__media-stack > .monitoring-capability__media.is-current {
    z-index: 2;
    opacity: 1;
  }

  .monitoring-capabilities__media-stack .monitoring-capability__media figcaption {
    display: none;
  }

  .monitoring-capabilities__media-stack .monitoring-capability__video-frame {
    position: absolute;
    inset: 0;
    aspect-ratio: auto;
    overflow: visible;
    border-radius: 16px;
    box-shadow:
      0 0 0 2px #000,
      0 0 30px -18px rgba(255, 14, 28, 0.84),
      0 0 54px -30px rgba(255, 0, 18, 0.6);
  }

  .monitoring-capabilities__media-stack .monitoring-capability__video-frame::after {
    --monitoring-capability-grid-opacity: 0.52;
    inset: -30px;
    border-radius: 30px;
    background:
      linear-gradient(90deg, rgba(255, 34, 44, 0.3) 1px, transparent 1px) 0 0 / 54px 54px,
      linear-gradient(rgba(255, 34, 44, 0.27) 1px, transparent 1px) 0 0 / 54px 54px,
      radial-gradient(ellipse closest-side at 50% 50%, rgba(255, 15, 28, 0.44), rgba(255, 0, 18, 0.12) 58%, rgba(9, 61, 120, 0.08) 78%, transparent 100%);
    filter: drop-shadow(0 0 14px rgba(255, 0, 18, 0.34));
  }

  .monitoring-capabilities__mobile-controls {
    position: absolute;
    z-index: 5;
    right: 14px;
    bottom: 14px;
    display: flex;
    gap: 10px;
  }

  .monitoring-capabilities__mobile-controls button {
    display: grid;
    width: 54px;
    height: 54px;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, 0.5);
    border-radius: 0;
    background: rgba(1, 21, 47, 0.82);
    color: #ffffff;
    cursor: pointer;
    place-items: center;
    transition: background-color 160ms ease, border-color 160ms ease, opacity 160ms ease;
    backdrop-filter: blur(10px);
  }

  .monitoring-capabilities__mobile-controls button:last-child {
    border-color: #ffffff;
    background: #ffffff;
    color: var(--sv-navy-deep, #011e46);
  }

  .monitoring-capabilities__mobile-controls button:disabled {
    opacity: 0.34;
    cursor: default;
  }

  .monitoring-capabilities__mobile-controls button:focus-visible,
  .monitoring-capabilities__mobile-pagination button:focus-visible {
    outline: 2px solid var(--sv-red, #ff0000);
    outline-offset: 3px;
  }

  .monitoring-capabilities__mobile-controls svg {
    width: 23px;
    height: 23px;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.8;
  }

  .monitoring-capabilities__mobile-pagination {
    order: 2;
    display: flex;
    gap: clamp(4px, 1.8vw, 10px);
    padding: 10px max(14px, var(--page-pad)) 0;
  }

  .monitoring-capabilities__mobile-pagination button {
    display: grid;
    width: 44px;
    height: 44px;
    padding: 0;
    border: 0;
    background: transparent;
    color: rgba(255, 255, 255, 0.28);
    font-family: var(--service-font-data);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.1em;
    cursor: pointer;
    place-items: center;
    transition: color 180ms ease;
  }

  .monitoring-capabilities__mobile-pagination button.is-current {
    color: var(--sv-red, #ff0000);
  }

  .monitoring-capabilities__list {
    order: 3;
    display: flex;
    gap: 24px;
    align-items: stretch;
    width: 100%;
    padding: 0 max(14px, var(--page-pad));
    transition: transform 420ms var(--ease-out, ease);
    touch-action: pan-y;
    will-change: transform;
  }

  .monitoring-capability,
  .monitoring-capabilities.is-enhanced .monitoring-capability {
    position: relative;
    inset: auto;
    display: block;
    flex: 0 0 calc(100% - 54px);
    min-height: 0;
    margin: 0;
    padding: 22px 0 34px;
    border: 0;
    opacity: 0.18;
    pointer-events: auto;
    transition: opacity 260ms ease;
  }

  .monitoring-capability.is-current {
    opacity: 1;
  }

  .monitoring-capability__copy,
  .monitoring-capabilities.is-enhanced .monitoring-capability__copy {
    width: 100%;
    transform: none;
  }

  .monitoring-capability h3 {
    max-width: 560px;
    font-size: clamp(29px, 7.5vw, 42px);
  }

  .monitoring-capability__text {
    max-width: 560px;
    font-size: clamp(15px, 2.7vw, 17px);
  }

  .monitoring-capabilities__progress,
  .monitoring-capabilities.is-enhanced .monitoring-capabilities__progress {
    display: none;
  }

  .monitoring-mobile-access__layout {
    grid-template-columns: minmax(0, 1fr);
    gap: 56px;
  }

  .monitoring-mobile-access__copy {
    grid-column: auto;
    grid-row: auto;
    max-width: 700px;
  }

  .monitoring-mobile-access h2 {
    font-size: clamp(29px, 7.5vw, 42px);
  }

  .monitoring-mobile-access__device {
    grid-column: auto;
    grid-row: auto;
    width: min(68vw, 250px);
  }

  .monitoring-mobile-access__device::after {
    inset: -58px -72px;
    opacity: 0.54;
  }
}

@media (max-width: 420px) {
  .monitoring-mobile-access__copy {
    padding-left: 16px;
  }

  .monitoring-capability h3 {
    font-size: clamp(29px, 9vw, 36px);
  }

  .monitoring-capability__text {
    font-size: 15px;
  }

  .monitoring-mobile-access {
    padding-block: 66px;
  }

  .monitoring-mobile-access h2 {
    font-size: clamp(29px, 9vw, 36px);
  }

  .monitoring-mobile-access__text {
    font-size: 16px;
  }

  .monitoring-mobile-access__device {
    width: min(68vw, 232px);
    padding: 10px;
    border-radius: 46px;
  }

  .monitoring-mobile-access__device::after {
    inset: -46px -54px;
    opacity: 0.48;
  }

  .monitoring-mobile-access__device::before {
    border-radius: 54px;
  }

  .monitoring-mobile-access__device video {
    border-radius: 36px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .monitoring-capability__accent,
  .monitoring-mobile-access h2 span {
    background-position: 0 0;
    animation: none !important;
  }

  .monitoring-capability__video-frame video,
  .monitoring-capabilities__media-stack > .monitoring-capability__media,
  .monitoring-capabilities__list,
  .monitoring-capability,
  .monitoring-capabilities.is-enhanced .monitoring-capability__copy,
  .monitoring-mobile-access__device video {
    transition: none;
  }

  .monitoring-capabilities__media-stack.is-switching-out
    .monitoring-capability__media.is-current
    .monitoring-capability__video-frame::before,
  .monitoring-capabilities__media-stack.is-switching-in
    .monitoring-capability__media.is-current
    .monitoring-capability__video-frame::before {
    animation: none;
    opacity: 0;
  }

}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

html.is-monitoring-step-scrolling,
html.is-monitoring-catalog-scrolling {
  scroll-behavior: auto !important;
}

body {
  margin: 0;
  overflow-x: hidden;
  background: var(--sv-ground, #eff2f7);
  color: var(--sv-navy-ink, #0f2340);
  font-family: var(--service-font-body);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

body.menu-open {
  overflow: hidden;
}

button,
input,
select,
textarea {
  font: inherit;
}

button,
select {
  cursor: pointer;
}

img,
svg {
  display: block;
  max-width: 100%;
}

a {
  color: inherit;
  text-decoration: none;
}

p,
h1,
h2,
h3 {
  overflow-wrap: break-word;
}

::selection {
  background: rgba(0, 47, 108, 0.16);
}

:focus-visible {
  outline: 2px solid var(--service-focus);
  outline-offset: 4px;
}

[id] {
  scroll-margin-top: 98px;
}

.skip-link {
  position: fixed;
  top: 10px;
  left: 10px;
  z-index: 200;
  padding: 12px 16px;
  background: #fff;
  color: var(--sv-navy, #002f6c);
  font-weight: 800;
  transform: translateY(-160%);
  transition: transform 0.2s ease;
}

.skip-link:focus {
  transform: translateY(0);
}

.container {
  width: min(calc(100% - (var(--page-pad) * 2)), var(--page-max));
  margin-inline: auto;
}

.site-header {
  position: sticky;
  top: 0;
  z-index: 80;
  height: var(--header-height);
  border-bottom: 1px solid transparent;
  background: rgba(239, 242, 247, 0.9);
  transition:
    background 0.24s var(--ease-out, ease),
    border-color 0.24s var(--ease-out, ease),
    box-shadow 0.24s var(--ease-out, ease);
  -webkit-backdrop-filter: blur(16px);
  backdrop-filter: blur(16px);
}

.site-header.is-scrolled {
  border-color: rgba(0, 47, 108, 0.12);
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 10px 28px rgba(15, 35, 64, 0.07);
}

.header-inner {
  display: flex;
  align-items: center;
  gap: 30px;
  height: 100%;
}

.brand {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  min-height: 44px;
}

.brand-word {
  color: var(--sv-navy, #002f6c);
  font-family: var(--service-font-display);
  font-size: 20px;
  font-weight: 800;
  letter-spacing: -0.02em;
}

.brand-word span {
  color: var(--sv-red, #ff0000);
}

.header-divider {
  width: 1px;
  height: 40px;
  background: rgba(0, 47, 108, 0.2);
}

.desktop-nav {
  display: flex;
  align-items: center;
  gap: 2px;
}

.desktop-nav a {
  padding: 10px 13px;
  color: var(--sv-navy, #002f6c);
  font-size: 14px;
  font-weight: 650;
  transition: color 0.18s ease;
}

.desktop-nav a:hover {
  color: var(--sv-red, #ff0000);
}

.header-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-left: auto;
}

.header-phone {
  display: grid;
  gap: 2px;
  min-height: 44px;
  padding: 6px 12px;
  color: var(--sv-navy, #002f6c);
}

.header-phone strong {
  font-size: 14px;
  line-height: 1;
}

.header-phone span {
  color: var(--sv-gray-500, #6b7789);
  font-size: 10px;
  font-weight: 650;
}

.header-max,
.menu-toggle {
  min-height: 44px;
  border: 1px solid rgba(0, 47, 108, 0.22);
  background-color: transparent;
  color: var(--sv-navy, #002f6c);
}

.header-max {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 17px;
  background-image: linear-gradient(90deg, var(--sv-navy, #002f6c) 50%, transparent 50%);
  background-position: 100% 0;
  background-size: 200% 100%;
  font-size: 13px;
  font-weight: 800;
  transition:
    background-position 0.46s var(--ease-out, ease),
    color 0.28s ease,
    border-color 0.28s ease;
}

.header-max:hover,
.header-max:focus-visible {
  border-color: var(--sv-navy, #002f6c);
  background-position: 0 0;
  color: #fff;
}

.menu-toggle {
  display: none;
  width: 44px;
  padding: 0;
  align-items: center;
  justify-content: center;
}

.menu-toggle svg {
  width: 22px;
  height: 22px;
}

.mobile-menu {
  position: fixed;
  inset: 0;
  z-index: 120;
  overflow-y: auto;
  background: var(--sv-navy-deep, #011e46);
  color: #fff;
}

.mobile-menu[hidden] {
  display: none;
}

.mobile-menu__inner {
  width: min(calc(100% - 32px), 720px);
  margin-inline: auto;
  padding: 18px 0 44px;
}

.mobile-menu__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 58px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.16);
}

.mobile-menu .brand-word {
  color: #fff;
}

.mobile-menu__close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border: 1px solid rgba(255, 255, 255, 0.28);
  background: transparent;
  color: #fff;
}

.mobile-menu__nav {
  display: grid;
  margin-top: 60px;
}

.mobile-menu__nav a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 72px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.13);
  font-family: var(--service-font-display);
  font-size: clamp(22px, 6vw, 36px);
  font-weight: 750;
}

.mobile-menu__nav a::after {
  content: "↗";
  color: var(--sv-red, #ff0000);
  font-size: 18px;
}

.mobile-menu__contacts {
  display: grid;
  gap: 12px;
  margin-top: 44px;
}

.mobile-menu__contacts a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  border: 1px solid rgba(255, 255, 255, 0.3);
  font-weight: 750;
}

.mobile-menu__contacts a:last-child {
  border-color: #fff;
  background: #fff;
  color: var(--sv-navy, #002f6c);
}

/* Shared site navigation — mirrors Homepage.dc.html. */
[data-site-header] {
  position: sticky;
  top: 0;
  z-index: 80;
  border-bottom: 1px solid transparent;
  background: transparent;
  transition:
    background 0.25s var(--ease-out, ease),
    border-color 0.25s var(--ease-out, ease),
    box-shadow 0.25s var(--ease-out, ease);
}

[data-site-header].is-scrolled {
  border-bottom-color: var(--sv-line, rgba(0, 46, 107, 0.14));
  background: rgba(239, 242, 247, 0.92);
  box-shadow: 0 10px 26px rgba(1, 20, 46, 0.08);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
}

[data-header-inner] {
  position: relative;
  display: flex;
  align-items: center;
  gap: 28px;
  max-width: 1200px;
  height: 78px;
  margin: 0 auto;
  padding: 0 24px;
}

[data-header-left] {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  gap: 28px;
  min-width: 0;
}

[data-header-left] > div[aria-hidden] {
  width: 1px;
  height: 40px;
  background: rgba(0, 46, 107, 0.22);
}

[data-logo-lock] {
  display: flex;
  flex-shrink: 0;
  flex-direction: column;
  align-items: stretch;
  line-height: 1;
}

[data-logo-word] {
  color: var(--sv-navy, #002f6c);
  font-family: var(--service-font-display);
  font-size: 20px;
  font-weight: 800;
  letter-spacing: 0;
}

[data-logo-word] span {
  color: var(--sv-red, #ff0000);
}

[data-nav="desktop"] {
  display: flex;
  align-items: center;
  gap: 2px;
  min-width: 0;
}

[data-nav="desktop"] a {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 8px 14px;
  color: #002e6b;
  font-size: 14px;
  font-weight: 600;
  white-space: nowrap;
  transition: color 0.18s var(--ease-out, ease);
}

[data-nav="desktop"] a:hover,
[data-nav="desktop"] a:focus-visible {
  color: #4f77b8;
}

[data-nav-services-trigger][aria-expanded="true"] [data-services-caret] {
  transform: rotate(180deg);
}

[data-services-caret] {
  transition: transform 0.2s var(--ease-out, ease);
}

[data-header-actions] {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  gap: 10px;
  margin-left: auto;
}

[data-header-phone] {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  padding: 8px 14px;
  color: #002e6b;
  font-size: 14px;
  font-weight: 600;
  line-height: 1;
  text-align: center;
  white-space: nowrap;
}

[data-header-phone]:hover,
[data-header-phone]:focus-visible {
  color: #4f77b8;
}

[data-header-phone-hours] {
  color: var(--sv-gray-500, #6b7789);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.01em;
}

[data-header-actions] [data-login-open] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 42px;
  padding: 0 16px;
  border: 1px solid var(--sv-navy, #002f6c);
  background-color: var(--sv-navy, #002f6c);
  background-image: linear-gradient(90deg, var(--sv-red, #ff0000) 50%, transparent 50%);
  background-position: 100% 0;
  background-size: 200% 100%;
  color: #fff;
  font-family: var(--service-font-display);
  font-size: 13px;
  font-weight: 700;
  white-space: nowrap;
  transition:
    background-position 0.5s var(--ease-out, ease),
    border-color 0.35s var(--ease-out, ease);
}

[data-header-actions] [data-login-open]:hover,
[data-header-actions] [data-login-open]:focus-visible {
  border-color: var(--sv-red, #ff0000);
  background-position: 0 0;
}

[data-burger] {
  display: inline-flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  margin-right: 10px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--sv-navy, #002f6c);
}

[data-burger]:hover,
[data-burger]:focus-visible,
[data-mobile-phone]:hover,
[data-mobile-phone]:focus-visible {
  color: #4f77b8;
}

[data-mobile-phone] {
  display: none;
}

[data-mega-panel] {
  position: absolute;
  top: 100%;
  right: 0;
  left: 0;
  z-index: 79;
  visibility: hidden;
  border-top: 1px solid rgba(0, 46, 107, 0.1);
  background: var(--sv-ground, #eff2f7);
  box-shadow: 0 30px 60px rgba(1, 20, 46, 0.14);
  opacity: 0;
  transform: translateY(-16px);
  transition:
    opacity 0.55s cubic-bezier(0.22, 0.61, 0.36, 1),
    transform 0.55s cubic-bezier(0.22, 0.61, 0.36, 1),
    visibility 0s 0.55s;
}

[data-mega-panel].is-open {
  visibility: visible;
  opacity: 1;
  transform: none;
  transition:
    opacity 0.55s cubic-bezier(0.22, 0.61, 0.36, 1),
    transform 0.55s cubic-bezier(0.22, 0.61, 0.36, 1),
    visibility 0s;
}

[data-mega-inner] {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 14px;
  max-width: 1200px;
  margin: 0 auto;
  padding: 32px 24px 40px;
}

[data-mega-card] {
  display: flex;
  min-height: 140px;
  flex-direction: column;
  gap: 10px;
  padding: 18px;
  border: 1px solid var(--sv-line, rgba(0, 46, 107, 0.14));
  background: #fff;
  color: var(--sv-navy-ink, #0f2340);
  opacity: 0;
  transform: translateY(14px);
  transition:
    opacity 0.5s cubic-bezier(0.22, 0.61, 0.36, 1),
    transform 0.5s cubic-bezier(0.22, 0.61, 0.36, 1),
    background 0.275s var(--ease-out, ease),
    border-color 0.275s var(--ease-out, ease);
}

[data-mega-panel].is-open [data-mega-card] {
  opacity: 1;
  transform: none;
}

[data-mega-panel].is-open [data-mega-card]:nth-child(1) { transition-delay: 0.12s, 0.12s, 0s, 0s; }
[data-mega-panel].is-open [data-mega-card]:nth-child(2) { transition-delay: 0.16s, 0.16s, 0s, 0s; }
[data-mega-panel].is-open [data-mega-card]:nth-child(3) { transition-delay: 0.2s, 0.2s, 0s, 0s; }
[data-mega-panel].is-open [data-mega-card]:nth-child(4) { transition-delay: 0.24s, 0.24s, 0s, 0s; }
[data-mega-panel].is-open [data-mega-card]:nth-child(5) { transition-delay: 0.28s, 0.28s, 0s, 0s; }
[data-mega-panel].is-open [data-mega-card]:nth-child(6) { transition-delay: 0.32s, 0.32s, 0s, 0s; }
[data-mega-panel].is-open [data-mega-card]:nth-child(7) { transition-delay: 0.36s, 0.36s, 0s, 0s; }
[data-mega-panel].is-open [data-mega-card]:nth-child(8) { transition-delay: 0.4s, 0.4s, 0s, 0s; }
[data-mega-panel].is-open [data-mega-card]:nth-child(9) { transition-delay: 0.44s, 0.44s, 0s, 0s; }
[data-mega-panel].is-open [data-mega-card]:nth-child(10) { transition-delay: 0.48s, 0.48s, 0s, 0s; }
[data-mega-panel].is-open [data-mega-card]:nth-child(11) { transition-delay: 0.52s, 0.52s, 0s, 0s; }
[data-mega-panel].is-open [data-mega-card]:nth-child(12) { transition-delay: 0.56s, 0.56s, 0s, 0s; }

[data-mega-note] {
  display: flex;
  grid-column: span 3;
  min-height: 140px;
  flex-direction: column;
  align-items: flex-end;
  justify-content: flex-end;
  padding: 24px 4px 8px 48px;
  border-top: 1px solid rgba(0, 46, 107, 0.18);
  text-align: right;
  opacity: 0;
  transform: translateY(14px);
  transition: opacity 0.5s cubic-bezier(0.22, 0.61, 0.36, 1), transform 0.5s cubic-bezier(0.22, 0.61, 0.36, 1);
}

[data-mega-panel].is-open [data-mega-note] {
  opacity: 1;
  transform: none;
  transition-delay: 0.6s;
}

[data-mega-note-title] {
  margin: 0;
  color: var(--sv-navy-ink, #0f2340);
  font-family: var(--service-font-display);
  font-size: 18px;
  line-height: 1.2;
  font-weight: 700;
}

[data-mega-note-copy] {
  max-width: 430px;
  margin: 8px 0 0;
  color: var(--sv-gray-500, #6b7789);
  font-size: 13px;
  line-height: 1.45;
}

[data-mega-note-link] {
  margin-top: 12px;
  color: var(--sv-navy, #002f6c);
  font-size: 12px;
  line-height: 1.2;
  font-weight: 750;
  text-decoration: none;
}

[data-mega-note-link]:hover {
  color: var(--sv-red, #ff0000);
}

[data-mega-note-link]:focus-visible {
  outline: 2px solid var(--sv-red, #ff0000);
  outline-offset: 4px;
}

@media (prefers-reduced-motion: reduce) {
  [data-mega-note] {
    opacity: 1;
    transform: none;
    transition: none;
  }
}

[data-mega-card]:hover,
[data-mega-card]:focus-visible {
  border-color: var(--sv-navy, #002f6c);
  background: var(--sv-navy, #002f6c);
}

[data-mega-card-icon] {
  display: inline-flex;
  width: 32px;
  height: 32px;
  align-items: center;
  justify-content: center;
  color: var(--sv-navy, #002f6c);
}

[data-snowflake-icon] {
  display: block;
  width: 32px;
  height: 32px;
  background: currentColor;
  -webkit-mask: url("icons/snowflake-rounded.png") center / contain no-repeat;
  mask: url("icons/snowflake-rounded.png") center / contain no-repeat;
}

[data-cctv-mask] {
  display: block;
  width: 32px;
  height: 22px;
  background: currentColor;
  -webkit-mask: url("icon-cctv-mask.webp") center / contain no-repeat;
  mask: url("icon-cctv-mask.webp") center / contain no-repeat;
}

[data-mega-card-title] {
  color: var(--sv-navy-ink, #0f2340);
  font-family: var(--service-font-display);
  font-size: 15px;
  line-height: 1.25;
  font-weight: 700;
}

[data-mega-card-sub] {
  color: var(--sv-gray-500, #6b7789);
  font-size: 12px;
  line-height: 1.35;
}

[data-mega-card]:hover [data-mega-card-icon],
[data-mega-card]:hover [data-mega-card-title],
[data-mega-card]:focus-visible [data-mega-card-icon],
[data-mega-card]:focus-visible [data-mega-card-title] {
  color: #fff;
}

[data-mega-card]:hover [data-mega-card-sub],
[data-mega-card]:focus-visible [data-mega-card-sub] {
  color: rgba(255, 255, 255, 0.72);
}

[data-curtain] {
  position: fixed;
  inset: 0;
  z-index: 120;
  visibility: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  background: #fff;
  transform: translateY(-100%);
  transition:
    transform 0.72s cubic-bezier(0.22, 0.61, 0.36, 1),
    visibility 0s 0.72s;
  -webkit-overflow-scrolling: touch;
}

[data-curtain].is-open {
  visibility: visible;
  transform: translateY(0);
  transition:
    transform 0.72s cubic-bezier(0.22, 0.61, 0.36, 1),
    visibility 0s;
}

[data-curtain] [data-curtain-top],
[data-curtain] [data-curtain-inner] > * {
  opacity: 0;
  transform: translateY(14px);
  transition:
    opacity 0.55s var(--ease-out, ease),
    transform 0.55s var(--ease-out, ease);
}

[data-curtain].is-open [data-curtain-top] {
  opacity: 1;
  transform: none;
  transition-delay: 0.24s;
}

[data-curtain].is-open [data-curtain-inner] > *:nth-child(1) {
  opacity: 1;
  transform: none;
  transition-delay: 0.32s;
}

[data-curtain].is-open [data-curtain-inner] > *:nth-child(2) {
  opacity: 1;
  transform: none;
  transition-delay: 0.42s;
}

[data-curtain-top] {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 24px;
  max-width: 1200px;
  margin: 0 auto;
  padding: 20px 24px;
}

.curtain-brand {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  line-height: 1;
}

.curtain-brand__word {
  color: var(--sv-navy, #002f6c);
  font-family: var(--service-font-display);
  font-size: 20px;
  font-weight: 800;
}

.curtain-brand__word span {
  color: var(--sv-red, #ff0000);
}

.curtain-brand__tagline {
  margin-top: 5px;
  color: #002e6b;
  font-family: var(--service-font-data);
  font-size: 11.5px;
  font-weight: 500;
}

[data-curtain-close] {
  display: inline-flex;
  width: 44px;
  height: 44px;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  border: 0;
  background: transparent;
  color: var(--sv-navy, #002f6c);
}

[data-curtain-close]:hover,
[data-curtain-close]:focus-visible {
  color: #4f77b8;
}

[data-curtain-inner] {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(300px, 0.75fr);
  gap: 64px;
  align-items: start;
  max-width: 1200px;
  margin: 0 auto;
  padding: 32px 24px 72px;
}

[data-curtain-services] {
  grid-column: 1;
  grid-row: 1;
}

[data-curtain-contact] {
  grid-column: 2;
  grid-row: 1;
  padding: 26px;
  border-top: 3px solid var(--sv-navy, #002f6c);
  background: var(--sv-ground, #eff2f7);
}

[data-curtain-col-title] {
  position: relative;
  display: block;
  margin: 0 0 22px;
  padding-bottom: 15px;
  color: var(--sv-navy-ink, #0f2340);
  font-family: var(--service-font-display);
  font-size: 26px;
  font-weight: 800;
}

[data-curtain-col-title]::after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 54px;
  height: 3px;
  background: var(--sv-red, #ff0000);
  content: "";
}

[data-curtain-contact-row] {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 0;
  color: var(--sv-navy-ink, #0f2340);
  font-size: 15px;
}

[data-curtain-contact-row] svg {
  flex-shrink: 0;
  color: var(--sv-red, #ff0000);
}

a[data-curtain-contact-row]:hover,
a[data-curtain-contact-row]:focus-visible {
  color: var(--sv-red, #ff0000);
}

.curtain-address {
  align-items: flex-start;
}

.curtain-address svg {
  margin-top: 2px;
}

[data-business-hours] {
  flex-wrap: wrap;
  row-gap: 6px;
}

[data-business-status] {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-left: auto;
  color: #8a94a3;
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}

[data-business-status-dot] {
  width: 7px;
  height: 7px;
  flex-shrink: 0;
  border-radius: 50%;
  background: #9aa5b1;
}

[data-business-status][data-state="open"] {
  color: #18864a;
}

[data-business-status][data-state="open"] [data-business-status-dot] {
  background: #22a45d;
  box-shadow: 0 0 0 3px rgba(34, 164, 93, 0.13);
}

[data-curtain-cta],
[data-login-open][data-curtain-login] {
  display: inline-flex;
  width: 100%;
  min-height: 52px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 22px;
  border: 1px solid var(--sv-navy, #002f6c);
  background-color: var(--sv-navy, #002f6c);
  background-image: linear-gradient(90deg, var(--sv-red, #ff0000) 50%, transparent 50%);
  background-position: 100% 0;
  background-size: 200% 100%;
  color: #fff;
  font-family: var(--service-font-display);
  font-size: 15px;
  font-weight: 700;
  transition:
    background-position 0.5s var(--ease-out, ease),
    border-color 0.35s var(--ease-out, ease),
    color 0.35s var(--ease-out, ease);
}

[data-curtain-cta] {
  margin-top: 22px;
}

[data-curtain-login] {
  margin-top: 14px;
}

[data-curtain-cta]:hover,
[data-curtain-cta]:focus-visible,
[data-login-open][data-curtain-login]:hover,
[data-login-open][data-curtain-login]:focus-visible {
  border-color: var(--sv-red, #ff0000);
  background-position: 0 0;
}

[data-login-open][data-curtain-login] {
  background-color: #fff;
  background-image: linear-gradient(90deg, var(--sv-navy, #002f6c) 50%, transparent 50%);
  color: var(--sv-navy, #002f6c);
}

[data-login-open][data-curtain-login]:hover,
[data-login-open][data-curtain-login]:focus-visible {
  border-color: var(--sv-navy, #002f6c);
  color: #fff;
}

[data-curtain-services-head] {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 28px;
  margin-bottom: 24px;
}

[data-curtain-services-head] [data-curtain-col-title] {
  margin-bottom: 0;
}

[data-curtain-services-note] {
  max-width: 360px;
  margin: 0;
  color: var(--sv-gray-500, #6b7789);
  font-size: 13px;
  line-height: 1.5;
  text-align: right;
}

[data-curtain-services-list] {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

[data-curtain-service-group] {
  min-height: 166px;
  padding: 22px 24px;
  border: 1px solid var(--sv-line, rgba(0, 46, 107, 0.14));
  border-top: 3px solid var(--sv-navy, #002f6c);
  background: #fff;
}

[data-curtain-service-heading] {
  display: block;
  margin: 0 0 12px;
  color: var(--sv-navy-ink, #0f2340);
  font-family: var(--service-font-display);
  font-size: 17px;
  line-height: 1.25;
  font-weight: 800;
}

[data-curtain-service-links] {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

[data-curtain-link] {
  display: block;
  padding: 11px 0;
  color: var(--sv-navy-ink, #0f2340);
  font-family: var(--service-font-display);
  font-size: 17px;
  font-weight: 500;
}

[data-curtain-services-list] [data-curtain-link] {
  width: calc(100% + 20px);
  margin: 0 -10px;
  padding: 7px 10px;
  color: var(--sv-gray-700, #445269);
  font-size: 14px;
  line-height: 1.35;
}

[data-curtain-link]:hover,
[data-curtain-link]:focus-visible {
  color: #4f77b8;
}

[data-curtain-nav] {
  display: grid;
  grid-template-columns: 1fr repeat(5, auto);
  align-items: center;
  gap: 0;
  margin-top: 16px;
  padding: 12px 14px;
  border: 1px solid var(--sv-line, rgba(0, 46, 107, 0.14));
  background: var(--sv-ground, #eff2f7);
}

[data-curtain-nav-label] {
  padding: 8px 10px;
  color: var(--sv-gray-500, #6b7789);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

[data-curtain-nav] [data-curtain-link] {
  padding: 9px 14px;
  color: var(--sv-navy, #002f6c);
  font-size: 13px;
  font-weight: 700;
  white-space: nowrap;
}

[data-curtain-social] {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  width: 100%;
  margin-top: 18px;
}

[data-curtain-social] a {
  display: grid;
  width: 100%;
  height: 50px;
  place-items: center;
  color: var(--sv-navy, #002f6c);
  line-height: 0;
}

[data-curtain-social] a:hover,
[data-curtain-social] a:focus-visible {
  background: var(--sv-ground, #eff2f7);
  color: var(--sv-red, #ff0000);
}

[data-curtain-social] svg {
  width: 21.6px;
  height: 21.6px;
}

[data-curtain-social] a[aria-label="Дзен"] svg {
  transform: translateY(2.7px);
}

[data-login-modal] {
  position: fixed;
  inset: 0;
  z-index: 140;
  display: flex;
  visibility: hidden;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: rgba(1, 20, 46, 0.68);
  opacity: 0;
  pointer-events: none;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  transition:
    opacity 0.24s var(--ease-out, ease),
    visibility 0s 0.24s;
}

[data-login-modal].is-open {
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
  transition:
    opacity 0.24s var(--ease-out, ease),
    visibility 0s;
}

[data-login-dialog] {
  position: relative;
  width: min(100%, 440px);
  padding: 34px;
  border: 1px solid rgba(0, 46, 107, 0.18);
  background: #fff;
  box-shadow: 0 32px 80px rgba(1, 20, 46, 0.28);
  transform: translateY(18px);
  transition: transform 0.28s var(--ease-out, ease);
}

[data-login-modal].is-open [data-login-dialog] {
  transform: none;
}

[data-login-close] {
  position: absolute;
  top: 14px;
  right: 14px;
  display: inline-flex;
  width: 40px;
  height: 40px;
  align-items: center;
  justify-content: center;
  border: 0;
  background: transparent;
  color: var(--sv-navy, #002f6c);
}

[data-login-close]:hover,
[data-login-close]:focus-visible {
  color: var(--sv-red, #ff0000);
}

.login-kicker {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  color: var(--sv-red, #ff0000);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.login-kicker span {
  width: 8px;
  height: 8px;
  background: var(--sv-red, #ff0000);
}

[data-login-dialog] h2 {
  margin: 14px 46px 0 0;
  color: var(--sv-navy-ink, #0f2340);
  font-family: var(--service-font-display);
  font-size: 27px;
  line-height: 1.1;
  font-weight: 800;
}

.login-intro {
  margin: 12px 0 0;
  color: var(--sv-gray-500, #6b7789);
  font-size: 14px;
  line-height: 1.5;
}

[data-login-label] {
  display: flex;
  flex-direction: column;
  gap: 7px;
  margin-top: 16px;
  color: var(--sv-gray-700, #445269);
  font-size: 13px;
  font-weight: 700;
}

[data-login-input] {
  width: 100%;
  min-height: 48px;
  padding: 0 14px;
  border: 1px solid var(--sv-line, rgba(0, 46, 107, 0.14));
  background: var(--sv-ground, #eff2f7);
  color: var(--sv-navy-ink, #0f2340);
  font-size: 15px;
}

[data-login-input]:focus {
  border-color: var(--sv-navy, #002f6c);
  outline: 0;
  box-shadow: 0 0 0 3px rgba(0, 47, 108, 0.12);
}

[data-login-submit] {
  width: 100%;
  min-height: 50px;
  margin-top: 22px;
  border: 1px solid var(--sv-navy, #002f6c);
  background-color: var(--sv-navy, #002f6c);
  background-image: linear-gradient(90deg, var(--sv-red, #ff0000) 50%, transparent 50%);
  background-position: 100% 0;
  background-size: 200% 100%;
  color: #fff;
  font-size: 15px;
  font-weight: 700;
  transition: background-position 0.5s var(--ease-out, ease);
}

[data-login-submit]:hover,
[data-login-submit]:focus-visible {
  border-color: var(--sv-red, #ff0000);
  background-position: 0 0;
}

[data-login-privacy] {
  margin: 11px 0 0;
  color: var(--sv-gray-500, #6b7789);
  font-size: 11.5px;
  line-height: 1.5;
}

[data-login-privacy] a {
  color: var(--sv-navy, #002f6c);
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 2px;
}

[data-login-help] {
  margin-top: 24px;
  padding-top: 20px;
  border-top: 1px solid var(--sv-line, rgba(0, 46, 107, 0.14));
  color: var(--sv-gray-500, #6b7789);
  font-size: 13px;
  line-height: 1.55;
}

[data-login-help] strong {
  display: block;
  margin-bottom: 5px;
  color: var(--sv-navy-ink, #0f2340);
}

[data-login-contacts] {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}

[data-login-contact] {
  display: inline-flex;
  padding: 9px 11px;
  border: 1px solid var(--sv-line, rgba(0, 46, 107, 0.14));
  background-color: #fff;
  background-image: linear-gradient(90deg, var(--sv-navy, #002f6c) 50%, transparent 50%);
  background-position: 100% 0;
  background-size: 200% 100%;
  color: var(--sv-navy, #002f6c);
  font-size: 12px;
  font-weight: 700;
  transition:
    background-position 0.5s var(--ease-out, ease),
    color 0.35s var(--ease-out, ease);
}

[data-login-contact]:hover,
[data-login-contact]:focus-visible {
  background-position: 0 0;
  color: #fff;
}

.login-messenger-icon {
  display: inline-flex;
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  align-items: center;
  justify-content: center;
  color: var(--sv-navy, #002f6c);
  transition:
    color 180ms var(--ease-out, ease),
    transform 180ms var(--ease-out, ease);
}

.login-messenger-icon svg {
  width: 20px;
  height: 20px;
}

.login-messenger-icon--max svg {
  width: 21px;
  height: 21px;
}

.login-messenger-icon:hover,
.login-messenger-icon:focus-visible {
  color: var(--sv-red, #ff0000);
}

.login-messenger-icon:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 2px;
}

.login-messenger-icon:active {
  transform: scale(0.94);
}

.login-address {
  display: block;
  margin-top: 10px;
}

body.login-open {
  overflow: hidden;
}

.service-hero {
  --hero-enter-distance: 18px;
  --hero-enter-ease: cubic-bezier(0.16, 1, 0.3, 1);
  --hero-orbit-rotation: 0deg;
  --hero-product-enter-x: 56px;
  --hero-product-enter-y: 10px;

  position: relative;
  overflow: hidden;
  min-height: calc(100svh - var(--header-height));
  border-bottom: 1px solid rgba(0, 47, 108, 0.12);
  background: var(--sv-ground, #eff2f7);
}

.service-hero::before {
  position: absolute;
  inset: 0 auto 0 0;
  width: 72%;
  content: "";
  pointer-events: none;
  background-color: var(--sv-navy, #002f6c);
  background-image: url("./tachograph-paper-grid.svg?v=20260720-5");
  background-position: left top;
  background-repeat: no-repeat;
  background-size: 100% 100%;
}

.service-hero > .container {
  display: flex;
  min-height: calc(100svh - var(--header-height));
  flex-direction: column;
}

.breadcrumbs {
  position: relative;
  z-index: 2;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  flex: 0 0 auto;
  padding-top: 56px;
  color: rgba(255, 255, 255, 0.72);
  font-size: 12px;
  line-height: 1.4;
}

.breadcrumbs a {
  color: #fff;
  font-weight: 700;
}

.breadcrumbs span[aria-hidden="true"] {
  color: rgba(255, 255, 255, 0.42);
}

.hero-grid {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(420px, 0.95fr);
  flex: 1 1 auto;
  min-height: 720px;
}

.hero-copy {
  position: relative;
  z-index: 3;
  align-self: center;
  padding: 54px 72px 68px 0;
}

.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 18px;
  color: var(--sv-red, #ff0000);
  font-family: var(--service-font-data);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.eyebrow::before {
  width: 9px;
  height: 9px;
  background: currentColor;
  content: "";
}

.hero-title {
  max-width: 640px;
  margin: 0;
  color: #fff;
  font-family: var(--service-font-display);
  font-size: clamp(44px, 3.5vw, 52px);
  font-weight: 750;
  letter-spacing: -0.042em;
  line-height: 1.02;
}

.hero-title__line {
  display: block;
}

.hero-title__line:last-child {
  white-space: nowrap;
}

.hero-title__clip {
  display: inline-block;
  overflow: hidden;
  vertical-align: top;
}

.hero-title__fragment {
  display: inline-block;
}

.hero-title .hero-accent,
.hero-lede__accent {
  color: var(--sv-red, #ff0000);
}

.hero-title .hero-accent::after {
  display: none;
}

.hero-offer {
  display: grid;
  grid-template-columns: 10px minmax(0, 1fr);
  gap: 18px;
  max-width: 570px;
  margin-top: 42px;
}

.hero-offer__mark {
  width: 10px;
  height: 10px;
  margin-top: 8px;
  background: var(--sv-red, #ff0000);
}

.hero-lede {
  margin: 0;
  color: rgba(255, 255, 255, 0.76);
  font-size: 15px;
  line-height: 1.56;
}

.hero-lede strong {
  display: block;
  color: #fff;
  font-size: 19px;
  font-weight: 700;
  letter-spacing: -0.015em;
  line-height: 1.38;
}

.hero-lede span {
  display: block;
  margin-top: 8px;
}

.hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 32px;
}

.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 54px;
  padding: 0 26px;
  border: 1px solid transparent;
  background: transparent;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.2;
  text-align: center;
  transition:
    background-position 0.48s var(--ease-out, ease),
    color 0.28s ease,
    border-color 0.28s ease,
    translate 0.1s ease,
    scale 0.1s ease;
}

.service-hero .button--primary {
  min-width: 260px;
  border-color: #fff;
  background-color: #fff;
  background-image: linear-gradient(90deg, var(--sv-red, #ff0000) 50%, transparent 50%);
  color: var(--sv-navy, #002f6c);
}

.service-hero .button--primary:hover,
.service-hero .button--primary:focus-visible {
  color: #fff;
}

.button--primary {
  border-color: var(--sv-navy, #002f6c);
  background-color: var(--sv-navy, #002f6c);
  background-image: linear-gradient(90deg, var(--sv-red, #ff0000) 50%, transparent 50%);
  background-position: 100% 0;
  background-size: 200% 100%;
  color: #fff;
}

.button--primary:hover,
.button--primary:focus-visible {
  border-color: var(--sv-red, #ff0000);
  background-position: 0 0;
}

.service-hero .button--secondary {
  min-width: 190px;
  border-color: rgba(255, 255, 255, 0.88);
  background-color: var(--sv-navy-chip, #123a73);
  background-image: linear-gradient(90deg, #fff 50%, transparent 50%);
  color: #fff;
}

.service-hero .button--secondary:hover,
.service-hero .button--secondary:focus-visible {
  border-color: #fff;
  color: var(--sv-navy, #002f6c);
}

.messenger-switch {
  position: relative;
  display: flex;
  width: 230px;
  min-height: 54px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.88);
  background: #fff;
  color: var(--sv-navy, #002f6c);
  isolation: isolate;
  transition: border-color 280ms ease;
}

.messenger-switch__action {
  position: relative;
  z-index: 1;
  display: flex;
  flex: 0 0 auto;
  min-width: 0;
  min-height: 52px;
  align-items: center;
  justify-content: center;
  gap: 0;
  overflow: hidden;
  color: inherit;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.2;
  white-space: nowrap;
  isolation: isolate;
  transition:
    width 0.48s var(--ease-out, ease),
    color 220ms ease,
    translate 0.1s ease,
    scale 0.1s ease;
}

.messenger-switch__action--max {
  width: calc(100% - 48px);
  background: var(--sv-navy-chip, #123a73);
  color: #fff;
}

.messenger-switch__action--telegram {
  width: 48px;
  border-left: 1px solid rgba(0, 47, 108, 0.24);
  background: #fff;
  color: var(--sv-navy, #002f6c);
  transition:
    width 0.48s var(--ease-out, ease),
    border-color 280ms ease,
    color 260ms ease,
    translate 0.1s ease,
    scale 0.1s ease;
}

.messenger-switch__icon {
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
  transition:
    width 0.48s var(--ease-out, ease),
    flex-basis 0.48s var(--ease-out, ease),
    opacity 280ms ease,
    transform 0.48s var(--ease-out, ease);
}

.messenger-switch__label {
  overflow: hidden;
  opacity: 1;
  transition:
    max-width 0.48s var(--ease-out, ease),
    opacity 280ms ease,
    transform 0.48s var(--ease-out, ease),
    color 180ms ease;
}

.messenger-switch__label:hover,
.messenger-switch__action:focus-visible .messenger-switch__label {
  color: var(--sv-red, #ff0000);
}

.messenger-switch__action--max .messenger-switch__icon {
  width: 0;
  flex-basis: 0;
  opacity: 0;
  transform: translateX(-10px);
}

.messenger-switch__action--max .messenger-switch__label {
  max-width: 132px;
}

.messenger-switch__action--telegram .messenger-switch__label {
  max-width: 0;
  opacity: 0;
  transform: translateX(10px);
}

.messenger-switch__action--telegram .messenger-switch__icon {
  transform: translate(-1px, 1px);
}

.messenger-switch:is(
  :has(.messenger-switch__action--max:hover),
  :has(.messenger-switch__action--max:focus-visible),
  [data-active="max"]
) .messenger-switch__action--max {
  width: calc(100% - 48px);
}

.messenger-switch:is(
  :has(.messenger-switch__action--max:hover),
  :has(.messenger-switch__action--max:focus-visible),
  [data-active="max"]
) .messenger-switch__action--telegram {
  width: 48px;
}

.messenger-switch:is(
  :has(.messenger-switch__action--max:hover),
  :has(.messenger-switch__action--max:focus-visible),
  [data-active="max"]
) .messenger-switch__action--max .messenger-switch__icon {
  color: #fff;
}

.messenger-switch:is(
  :has(.messenger-switch__action--max:hover),
  :has(.messenger-switch__action--max:focus-visible),
  [data-active="max"]
) .messenger-switch__action--telegram {
  color: var(--sv-navy, #002f6c);
}

.messenger-switch:is(
  :has(.messenger-switch__action--telegram:hover),
  :has(.messenger-switch__action--telegram:focus-visible),
  [data-active="telegram"]
) .messenger-switch__action--max {
  width: 48px;
}

.messenger-switch:is(
  :has(.messenger-switch__action--telegram:hover),
  :has(.messenger-switch__action--telegram:focus-visible),
  [data-active="telegram"]
) .messenger-switch__action--telegram {
  width: calc(100% - 48px);
}

.messenger-switch:is(
  :has(.messenger-switch__action--telegram:hover),
  :has(.messenger-switch__action--telegram:focus-visible),
  [data-active="telegram"]
) {
  border-color: #fff;
}

.messenger-switch:is(
  :has(.messenger-switch__action--telegram:hover),
  :has(.messenger-switch__action--telegram:focus-visible),
  [data-active="telegram"]
) .messenger-switch__action--max {
  color: #fff;
}

.messenger-switch:is(
  :has(.messenger-switch__action--telegram:hover),
  :has(.messenger-switch__action--telegram:focus-visible),
  [data-active="telegram"]
) .messenger-switch__action--telegram {
  border-left-color: rgba(0, 47, 108, 0.24);
  color: var(--sv-navy, #002f6c);
}

.messenger-switch:is(
  :has(.messenger-switch__action--telegram:hover),
  :has(.messenger-switch__action--telegram:focus-visible),
  [data-active="telegram"]
) .messenger-switch__action--max .messenger-switch__icon {
  width: 20px;
  flex-basis: 20px;
  opacity: 1;
  transform: none;
}

.messenger-switch:is(
  :has(.messenger-switch__action--telegram:hover),
  :has(.messenger-switch__action--telegram:focus-visible),
  [data-active="telegram"]
) .messenger-switch__action--max .messenger-switch__label {
  max-width: 0;
  opacity: 0;
  transform: translateX(-10px);
}

.messenger-switch:is(
  :has(.messenger-switch__action--telegram:hover),
  :has(.messenger-switch__action--telegram:focus-visible),
  [data-active="telegram"]
) .messenger-switch__action--telegram .messenger-switch__icon {
  width: 0;
  flex-basis: 0;
  opacity: 0;
  transform: translateX(-10px);
}

.messenger-switch:is(
  :has(.messenger-switch__action--telegram:hover),
  :has(.messenger-switch__action--telegram:focus-visible),
  [data-active="telegram"]
) .messenger-switch__action--telegram .messenger-switch__label {
  max-width: 154px;
  opacity: 1;
  transform: none;
}

.messenger-switch__action:focus-visible {
  z-index: 2;
  outline: 2px solid currentColor;
  outline-offset: -4px;
}

.button--secondary {
  border-color: rgba(0, 47, 108, 0.24);
  background-color: rgba(255, 255, 255, 0.66);
  background-image: linear-gradient(90deg, var(--sv-navy, #002f6c) 50%, transparent 50%);
  background-position: 100% 0;
  background-size: 200% 100%;
  color: var(--sv-navy, #002f6c);
}

.button--secondary:hover,
.button--secondary:focus-visible {
  border-color: var(--sv-navy, #002f6c);
  background-position: 0 0;
  color: #fff;
}

.button svg {
  width: 17px;
  height: 17px;
}

.hero-proof {
  display: grid;
  grid-template-columns:
    minmax(0, 0.8fr)
    minmax(0, 0.8fr)
    minmax(0, 0.95fr)
    minmax(0, 1.45fr);
  max-width: 560px;
  margin-top: 34px;
  padding-top: 20px;
  border-top: 1px solid rgba(255, 255, 255, 0.24);
}

.hero-proof span {
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 0 11px;
  border-left: 1px solid rgba(255, 255, 255, 0.18);
}

.hero-proof span:first-child {
  padding-left: 0;
  border-left: 0;
}

.hero-proof strong {
  color: #fff;
  font-size: 15px;
  font-weight: 800;
  line-height: 1.2;
}

.hero-proof small {
  overflow: hidden;
  color: rgba(255, 255, 255, 0.66);
  font-size: 11px;
  line-height: 1.3;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.hero-proof span:last-child small {
  text-overflow: clip;
  white-space: normal;
}

.hero-visual {
  position: relative;
  isolation: isolate;
  align-self: stretch;
  min-height: 720px;
}

.hero-product-orbit {
  position: absolute;
  right: clamp(-140px, calc((1200px - 100vw) / 2 + 20px), -30px);
  bottom: 32px;
  z-index: 0;
  width: 640px;
  height: 640px;
  border: 0;
  border-radius: 50%;
  opacity: 1;
  pointer-events: none;
  transform: rotate(var(--hero-orbit-rotation));
  transform-origin: 50% 50%;
  transition:
    opacity 0.34s var(--ease-out, ease) 0.08s,
    transform 0.28s cubic-bezier(0.22, 1, 0.36, 1);
}

.hero-orbit-outline {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
  pointer-events: none;
}

.hero-orbit-outline path {
  fill: none;
  stroke: rgba(139, 177, 224, 0.34);
  stroke-width: 1.5;
  stroke-dasharray: 5 6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.hero-product-orbit::before {
  position: absolute;
  inset: 102.2px;
  border: 1px solid rgba(139, 177, 224, 0.22);
  border-radius: inherit;
  content: "";
}

.hero-orbit-slogan {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
}

.hero-orbit-slogan text {
  fill: rgba(139, 177, 224, 0.62);
  font-family: var(--service-font-data);
  font-size: 12px;
  font-weight: 750;
  letter-spacing: 0.15em;
}

.hero-orbit-dot {
  fill: var(--sv-red, #ff0000);
}

.hero-orbit-subline {
  fill: rgba(139, 177, 224, 0.48);
  font-size: 10px;
  font-weight: 750;
  letter-spacing: 0.12em;
}

.hero-visual-wordmark {
  position: absolute;
  top: calc(50% - 36px);
  right: clamp(-310px, calc((1200px - 100vw) / 2 + 50px), -70px);
  z-index: 1;
  margin: 0;
  color: rgba(139, 177, 224, 0.18);
  font-family: var(--service-font-display);
  font-size: clamp(104px, 8.2vw, 132px);
  font-weight: 800;
  letter-spacing: -0.04em;
  line-height: 0.82;
  pointer-events: none;
  text-transform: uppercase;
  text-orientation: mixed;
  transform: translateY(-50%) rotate(180deg);
  user-select: none;
  white-space: nowrap;
  writing-mode: vertical-rl;
}

.tachograph-figure {
  position: absolute;
  right: clamp(-180px, calc((1200px - 100vw) / 2 + 16px), -32px);
  bottom: 190px;
  z-index: 3;
  width: clamp(720px, 52vw, 840px);
  margin: 0;
  opacity: 1;
  transform: none;
}

.tachograph-figure img {
  display: block;
  width: 90%;
  height: auto;
  margin-inline: auto;
  filter: drop-shadow(0 28px 34px rgba(1, 20, 46, 0.22));
}

.js .service-hero .eyebrow,
.js .service-hero .hero-offer,
.js .service-hero .hero-actions,
.js .service-hero .hero-proof,
.js .service-hero .hero-visual-wordmark {
  opacity: 0;
}

.js .service-hero .hero-product-orbit {
  opacity: 0;
  transform: rotate(-4deg) scale(0.92);
}

.js .is-ready .service-hero .eyebrow {
  opacity: 1;
  animation: service-hero-enter-left 500ms var(--hero-enter-ease) 100ms backwards;
}

.js .is-ready .service-hero .hero-offer {
  opacity: 1;
  animation: service-hero-enter-up 600ms var(--hero-enter-ease) 420ms backwards;
}

.js .is-ready .service-hero .hero-actions {
  opacity: 1;
  animation: service-hero-enter-up 550ms var(--hero-enter-ease) 520ms backwards;
}

.js .is-ready .service-hero .hero-proof {
  opacity: 1;
  animation: service-hero-enter-up 500ms var(--hero-enter-ease) 620ms backwards;
}

.js .is-ready .service-hero .hero-product-orbit {
  opacity: 1;
  transform: rotate(var(--hero-orbit-rotation));
  animation: service-hero-orbit-in 700ms var(--hero-enter-ease) 160ms backwards;
}

.js .is-ready .service-hero .hero-visual-wordmark {
  opacity: 1;
  animation: service-hero-wordmark-in 650ms var(--hero-enter-ease) 220ms backwards;
}

@keyframes service-hero-enter-left {
  from {
    opacity: 0;
    transform: translate3d(-16px, 0, 0);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

@keyframes service-hero-enter-up {
  from {
    opacity: 0;
    transform: translate3d(0, var(--hero-enter-distance), 0);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

@keyframes service-hero-word-reveal {
  from {
    opacity: 0;
    filter: blur(3px);
    transform: translate3d(0, 105%, 0);
  }

  to {
    opacity: 1;
    filter: blur(0);
    transform: none;
  }
}

@keyframes service-hero-orbit-in {
  from {
    opacity: 0;
    transform: rotate(-4deg) scale(0.92);
  }

  to {
    opacity: 1;
    transform: rotate(var(--hero-orbit-rotation));
  }
}

@keyframes service-hero-wordmark-in {
  from {
    opacity: 0;
    transform: translate3d(18px, -50%, 0) rotate(180deg);
  }

  to {
    opacity: 1;
    transform: translateY(-50%) rotate(180deg);
  }
}

@keyframes service-hero-product-in {
  from {
    opacity: 0;
    transform:
      translate3d(var(--hero-product-enter-x), var(--hero-product-enter-y), 0)
      scale(0.97);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

@media (min-width: 1081px) and (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .hero-product-orbit {
    backface-visibility: hidden;
    transition:
      opacity 0.34s var(--ease-out, ease) 0.08s,
      transform 240ms cubic-bezier(0.22, 1, 0.36, 1);
    will-change: transform;
  }

}

.service-section.tachograph-catalog {
  padding: 72px 0 88px;
  background: var(--sv-ground, #eff2f7);
}

.catalog-head {
  display: grid;
  gap: 12px;
  margin-bottom: 28px;
}

.catalog-label {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin: 0;
  color: var(--sv-navy-ink, #0f2340);
  font-family: var(--service-font-body);
  font-size: 12px;
  font-weight: 750;
  letter-spacing: 0.08em;
  line-height: 1.2;
  text-transform: uppercase;
}

.catalog-label::before {
  width: 5px;
  height: 14px;
  background: var(--sv-red, #ff0000);
  content: "";
}

.catalog-price-note {
  max-width: 760px;
  margin: 0;
  color: var(--sv-gray-500, #6b7789);
  font-size: 14px;
  line-height: 1.55;
}

.catalog-price-note strong {
  color: var(--sv-navy-ink, #0f2340);
  font-weight: 700;
}

.catalog-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-top: 1px solid var(--sv-line, #dde3ec);
  border-left: 1px solid var(--sv-line, #dde3ec);
}

.catalog-card {
  position: relative;
  display: flex;
  min-width: 0;
  flex-direction: column;
  border-right: 1px solid var(--sv-line, #dde3ec);
  border-bottom: 1px solid var(--sv-line, #dde3ec);
  background: #fff;
}

.catalog-card::after {
  position: absolute;
  z-index: 2;
  inset: 0;
  border: 1px solid transparent;
  pointer-events: none;
  content: "";
  transition: border-color 180ms ease;
}

.catalog-card__visual {
  position: relative;
  display: grid;
  min-height: 220px;
  place-items: center;
  overflow: hidden;
  padding: 26px 24px 18px;
  border-bottom: 1px solid var(--sv-line, #dde3ec);
  background: #fff;
}

.catalog-card__visual img {
  display: block;
  width: min(100%, 300px);
  height: auto;
  filter: drop-shadow(0 14px 16px rgba(15, 35, 64, 0.12));
}

.catalog-card__visual img.catalog-card__image--flat,
.product-dialog__image img.product-dialog__image--flat {
  filter: none;
}

.catalog-card__badge {
  position: absolute;
  z-index: 1;
  top: 18px;
  right: 18px;
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  gap: 8px;
  padding: 0 12px;
  border: 1px solid rgba(255, 255, 255, 0.74);
  background: #ff0000;
  box-shadow: 0 8px 22px rgba(0, 15, 42, 0.2);
  color: #fff;
  font-family: var(--service-font-data);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.1em;
  line-height: 1;
  text-transform: uppercase;
}

.catalog-card__badge::before {
  width: 6px;
  height: 6px;
  flex: 0 0 6px;
  background: #fff;
  content: "";
}

.catalog-card--featured {
  color: #fff;
  background: linear-gradient(180deg, #0a4d8f 0%, #06427f 38%, var(--sv-navy, #002f6c) 72%, #002758 100%);
}

.catalog-card--featured::after {
  border-color: transparent;
}

.catalog-card--featured .catalog-card__visual {
  border-bottom-color: rgba(255, 255, 255, 0.2);
  background: transparent;
}

.catalog-card--featured .catalog-card__visual img {
  filter: drop-shadow(0 16px 18px rgba(0, 12, 35, 0.28));
}

.catalog-card--featured .catalog-card__body {
  background: transparent;
}

.catalog-card--featured .catalog-card__type,
.catalog-card.catalog-card--featured h3,
.catalog-card--featured .catalog-card__specs dd {
  color: #fff;
}

.catalog-card--featured .catalog-card__type {
  opacity: 0.72;
}

.catalog-card--featured .catalog-card__specs {
  border-top-color: rgba(255, 255, 255, 0.22);
}

.catalog-card--featured .catalog-card__specs div {
  border-bottom-color: rgba(255, 255, 255, 0.18);
}

.catalog-card--featured .catalog-card__specs dt {
  color: rgba(255, 255, 255, 0.62);
}

.catalog-card--featured .catalog-card__actions a,
.catalog-card--featured .catalog-card__actions button {
  border-color: #fff;
  background-color: #fff;
  background-image: linear-gradient(90deg, var(--sv-red, #ff0000) 50%, transparent 50%);
  background-position: 100% 0;
  background-size: 200% 100%;
  color: var(--sv-navy, #002f6c);
}

.catalog-card--featured .catalog-card__actions a:hover,
.catalog-card--featured .catalog-card__actions a:focus-visible,
.catalog-card--featured .catalog-card__actions button:hover,
.catalog-card--featured .catalog-card__actions button:focus-visible {
  border-color: var(--sv-red, #ff0000);
  background-position: 0 0;
  color: #fff;
}

.catalog-card--featured .catalog-card__actions a:focus-visible,
.catalog-card--featured .catalog-card__actions button:focus-visible {
  outline-color: rgba(255, 255, 255, 0.72);
}

.catalog-card__body {
  display: flex;
  flex: 1;
  flex-direction: column;
  padding: 22px 24px 24px;
}

.catalog-card__type {
  color: var(--sv-red, #ff0000);
  font-family: var(--service-font-body);
  font-size: 9.5px;
  font-weight: 750;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.catalog-card h3 {
  margin: 8px 0 0;
  color: var(--sv-navy-ink, #0f2340);
  font-family: var(--service-font-body);
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.025em;
  line-height: 1.16;
}

.catalog-card__specs {
  display: grid;
  margin: 18px 0 0;
  border-top: 1px solid var(--sv-line, #dde3ec);
}

.catalog-card__specs div {
  display: grid;
  min-height: 40px;
  grid-template-columns: minmax(0, 0.86fr) minmax(0, 1.14fr);
  gap: 12px;
  align-items: center;
  border-bottom: 1px solid var(--sv-line, #dde3ec);
}

.catalog-card__specs dt,
.catalog-card__specs dd {
  margin: 0;
  font-size: 11.5px;
  line-height: 1.35;
}

.catalog-card__specs dt {
  color: var(--sv-gray-500, #6b7789);
}

.catalog-card__specs dd {
  color: var(--sv-navy-ink, #0f2340);
  font-weight: 650;
  text-align: right;
}

.catalog-card__actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-top: auto;
  padding-top: 22px;
}

.catalog-card__actions a,
.catalog-card__actions button {
  display: inline-flex;
  min-width: 0;
  min-height: 46px;
  align-items: center;
  justify-content: center;
  padding: 0 14px;
  border: 1px solid var(--sv-navy, #002f6c);
  border-radius: 0;
  font: inherit;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  transition:
    border-color 180ms ease,
    background-position 0.48s var(--ease-out, ease),
    color 180ms ease;
  touch-action: manipulation;
}

.catalog-card__order {
  background-color: var(--sv-navy, #002f6c);
  background-image: linear-gradient(90deg, var(--sv-red, #ff0000) 50%, transparent 50%);
  background-position: 100% 0;
  background-size: 200% 100%;
  color: #fff;
}

.catalog-card__order:hover,
.catalog-card__order:focus-visible {
  border-color: var(--sv-red, #ff0000);
  background-position: 0 0;
  color: #fff;
}

.catalog-card__details {
  background-color: #fff;
  background-image: linear-gradient(90deg, var(--sv-navy, #002f6c) 50%, transparent 50%);
  background-position: 100% 0;
  background-size: 200% 100%;
  color: var(--sv-navy, #002f6c);
}

.catalog-card__details:hover,
.catalog-card__details:focus-visible {
  background-position: 0 0;
  color: #fff;
}

.catalog-card__actions a:focus-visible,
.catalog-card__actions button:focus-visible {
  outline: 3px solid rgba(0, 47, 108, 0.24);
  outline-offset: 3px;
}

@media (hover: hover) and (pointer: fine) {
  .catalog-card:hover,
  .catalog-card:focus-within {
    z-index: 1;
  }

  .catalog-card:hover::after,
  .catalog-card:focus-within::after {
    border-color: var(--driver-blue, #0a5bd8);
  }
}

.price-match {
  position: relative;
  z-index: 2;
  overflow: hidden;
  padding: 64px 0;
  background: var(--sv-navy-deep, #011e46);
  color: #fff;
}

.price-match + #included {
  position: relative;
  z-index: 1;
}

.price-match__layout {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1.16fr) minmax(320px, 0.84fr);
  gap: 72px;
  align-items: center;
}

.price-match__copy {
  max-width: 720px;
}

.price-match__copy .eyebrow {
  margin-bottom: 16px;
}

.price-match__copy h2 {
  position: relative;
  max-width: 700px;
  margin: 0;
  color: #fff;
  font-family: var(--service-font-display);
  font-size: clamp(28px, 2.7vw, 40px);
  font-weight: 720;
  letter-spacing: -0.045em;
  line-height: 1.04;
}

.price-match__title-accent {
  --price-match-accent-base: #fff;
  background-image: linear-gradient(
    90deg,
    var(--sv-red, #ff0000) 0 50%,
    var(--price-match-accent-base) 50% 100%
  );
  background-position: 100% 0;
  background-size: 200% 100%;
  background-repeat: no-repeat;
  -webkit-background-clip: text;
  background-clip: text;
  color: var(--price-match-accent-base);
  -webkit-text-fill-color: transparent;
}

.price-match.is-title-filled .price-match__title-accent {
  animation: price-match-accent-sweep 0.72s var(--ease-out, ease) 0.12s both;
}

.price-match.is-title-filled .price-match__title-accent:nth-of-type(2) {
  animation-delay: 0.3s;
}

@keyframes price-match-accent-sweep {
  from { background-position: 100% 0; }
  to { background-position: 0 0; }
}

.price-match__copy p {
  max-width: 680px;
  margin: 22px 0 0;
  color: rgba(255, 255, 255, 0.7);
  font-size: 16px;
  line-height: 1.65;
}

.price-match__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 28px;
}

.price-match__cta {
  display: inline-flex;
  min-height: 50px;
  align-items: center;
  justify-content: center;
  padding: 0 24px;
  border: 1px solid #fff;
  background-color: #fff;
  background-image: linear-gradient(90deg, var(--sv-red, #ff0000) 50%, transparent 50%);
  background-position: 100% 0;
  background-size: 200% 100%;
  color: var(--sv-navy, #002f6c);
  font-size: 13px;
  font-weight: 750;
  text-decoration: none;
  transition:
    border-color 180ms ease,
    background-position 0.48s var(--ease-out, ease),
    color 180ms ease;
}

.price-match__cta--secondary {
  background-color: #fff;
  color: var(--sv-navy, #002f6c);
}

.price-match__cta:hover,
.price-match__cta:focus-visible {
  border-color: var(--sv-red, #ff0000);
  background-position: 0 0;
  color: #fff;
}

.price-match__cta:focus-visible {
  outline: 3px solid rgba(255, 255, 255, 0.72);
  outline-offset: 4px;
}

.installation-page .tachograph-catalog .catalog-card__details,
.installation-page .price-match__cta--secondary {
  background-color: #fff;
  background-image: none;
  background-position: 0 0;
  color: var(--sv-navy, #002f6c);
  transition:
    border-color 180ms ease,
    color 180ms ease;
}

.installation-page .tachograph-catalog .catalog-card__details:hover,
.installation-page .tachograph-catalog .catalog-card__details:focus-visible,
.installation-page .price-match__cta--secondary:hover,
.installation-page .price-match__cta--secondary:focus-visible {
  border-color: var(--sv-red, #ff0000);
  background-color: #fff;
  background-image: none;
  color: var(--sv-red, #ff0000);
}

.price-match__visual {
  position: relative;
  display: flex;
  min-height: 500px;
  align-items: center;
  justify-content: flex-end;
}

.price-match__invoice-figure {
  position: relative;
  width: min(100%, 350px);
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  transform: none;
}

.price-match__invoice-figure::before {
  content: none;
}

.price-match__invoice-figure::after {
  content: none;
}

.price-match__invoice-figure img {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  height: auto;
  filter: drop-shadow(0 20px 30px rgba(0, 8, 24, 0.24));
}

.price-match__invoice-edit {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: block;
  pointer-events: none;
}

.price-match__invoice-edit::before {
  position: absolute;
  top: 56.25%;
  right: 5.5%;
  left: 51%;
  height: 1.5px;
  background: var(--sv-red, #ff0000);
  content: "";
  transform: rotate(-1deg);
  transform-origin: center;
}

.price-match__invoice-edit span {
  position: absolute;
  top: 58%;
  right: 7%;
  color: var(--sv-red, #ff0000);
  font-family: "Segoe Print", "Bradley Hand", "Comic Sans MS", cursive;
  font-size: clamp(24px, 2.1vw, 31px);
  font-style: italic;
  font-weight: 700;
  letter-spacing: -0.04em;
  line-height: 1;
  white-space: nowrap;
  transform: rotate(-4deg);
  transform-origin: center;
}

@media (max-width: 900px) {
  .price-match {
    padding: 52px 0;
  }

  .price-match__layout {
    grid-template-columns: 1fr;
    gap: 36px;
  }

  .price-match__visual {
    min-height: 0;
    justify-content: center;
  }

  .price-match__invoice-figure {
    width: min(100%, 340px);
    margin: 0;
  }

}

@media (max-width: 600px) {
  .price-match {
    padding: 44px 0;
  }

  .price-match__copy h2 {
    font-size: 30px;
  }

  .price-match__copy p {
    margin-top: 18px;
    font-size: 15px;
  }

  .price-match__actions {
    display: grid;
    margin-top: 24px;
  }

  .price-match__cta {
    width: 100%;
  }

  .price-match__invoice-figure {
    width: min(100%, 320px);
    padding: 0;
    transform: none;
  }

  .price-match__invoice-figure::before {
    content: none;
  }

  .service-section--related-light {
    padding: 56px 0 62px;
  }

  .service-section--related-light .related-grid {
    margin-top: 26px;
  }
}

body.product-modal-open,
body.callback-modal-open,
body.mchd-modal-open,
body.era-category-modal-open,
body.monitoring-image-modal-open {
  overflow: hidden;
}

.mchd-modal {
  position: fixed;
  z-index: 1750;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(5, 18, 36, 0.66);
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
  opacity: 0;
  visibility: hidden;
  transition:
    opacity 220ms ease,
    visibility 220ms ease;
}

.mchd-modal.is-open {
  opacity: 1;
  visibility: visible;
}

.mchd-dialog {
  position: relative;
  width: min(1040px, 100%);
  max-height: calc(100dvh - 48px);
  overflow: auto;
  border: 1px solid rgba(0, 47, 108, 0.16);
  background: #fff;
  box-shadow: 0 24px 72px rgba(0, 17, 42, 0.3);
  opacity: 0;
  transform: translateY(12px);
  transition:
    opacity 200ms ease,
    transform 280ms cubic-bezier(0.22, 1, 0.36, 1);
}

.mchd-modal.is-open .mchd-dialog {
  opacity: 1;
  transform: none;
}

.mchd-dialog__close {
  position: absolute;
  z-index: 3;
  top: 16px;
  right: 16px;
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  border: 1px solid rgba(0, 47, 108, 0.18);
  border-radius: 0;
  background: #fff;
  color: var(--sv-navy, #002f6c);
  cursor: pointer;
  transition:
    border-color 180ms ease,
    background 180ms ease,
    color 180ms ease;
}

.mchd-dialog__close:hover,
.mchd-dialog__close:focus-visible {
  border-color: var(--sv-navy, #002f6c);
  outline: none;
  background: var(--sv-navy, #002f6c);
  color: #fff;
}

.mchd-dialog__close:focus-visible {
  outline: 3px solid rgba(0, 47, 108, 0.22);
  outline-offset: 3px;
}

.mchd-dialog__header {
  position: relative;
  padding: 34px 80px 30px 36px;
  overflow: hidden;
  border-bottom: 1px solid rgba(0, 47, 108, 0.14);
  background: linear-gradient(135deg, #0b4a92 0%, #002f6c 54%, #001b44 100%);
}

.mchd-dialog__kicker {
  display: inline-flex;
  gap: 9px;
  align-items: center;
  color: rgba(255, 255, 255, 0.78);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: 0.105em;
  line-height: 1.2;
  text-transform: uppercase;
}

.mchd-dialog__kicker i {
  width: 7px;
  height: 7px;
  background: var(--sv-red, #ff0000);
}

.mchd-dialog__header h2 {
  max-width: 690px;
  margin: 14px 0 0;
  color: #fff;
  font-size: clamp(28px, 3vw, 40px);
  font-weight: 790;
  letter-spacing: -0.04em;
  line-height: 1.05;
}

.mchd-dialog__header p {
  max-width: 760px;
  margin: 14px 0 0;
  color: rgba(255, 255, 255, 0.72);
  font-size: 14px;
  line-height: 1.55;
}

.mchd-dialog__body {
  padding: 28px 36px 32px;
}

.mchd-file-rule {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  padding: 16px 18px;
  border-left: 3px solid var(--sv-red, #ff0000);
  background: rgba(228, 233, 243, 0.62);
  color: var(--sv-navy-ink, #0f2340);
}

.mchd-file-rule svg {
  margin-top: 1px;
  color: var(--sv-navy, #002f6c);
}

.mchd-file-rule p {
  margin: 0;
  font-size: 14px;
  line-height: 1.5;
}

.mchd-file-rule__copy {
  min-width: 0;
}

.mchd-file-rule__presence {
  margin-top: 10px !important;
  padding-top: 10px;
  border-top: 1px solid rgba(0, 47, 108, 0.14);
}

.mchd-file-rule a {
  color: var(--sv-navy, #002f6c);
  font-weight: 800;
  text-underline-offset: 3px;
}

.mchd-owner-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 24px;
  border-top: 1px solid var(--sv-line, #dde3ec);
  border-left: 1px solid var(--sv-line, #dde3ec);
}

.mchd-owner-card {
  position: relative;
  padding: 26px 28px 28px;
  border-right: 1px solid var(--sv-line, #dde3ec);
  border-bottom: 1px solid var(--sv-line, #dde3ec);
}

.mchd-owner-card__number {
  color: var(--sv-red, #ff0000);
  font-family: var(--service-font-data);
  font-size: 12px;
  font-weight: 800;
}

.mchd-owner-card h3 {
  margin: 9px 0 0;
  color: var(--sv-navy-ink, #0f2340);
  font-size: 22px;
  letter-spacing: -0.02em;
  line-height: 1.2;
}

.mchd-owner-card__lead {
  margin: 10px 0 0;
  color: var(--sv-gray-600, #536176);
  font-size: 13px;
  line-height: 1.5;
}

.mchd-owner-card ul {
  display: grid;
  gap: 8px;
  margin: 18px 0 0;
  padding: 0;
  list-style: none;
}

.mchd-owner-card li {
  position: relative;
  padding-left: 17px;
  color: var(--sv-navy-ink, #0f2340);
  font-size: 13px;
  line-height: 1.45;
}

.mchd-owner-card li::before {
  position: absolute;
  top: 0.65em;
  left: 0;
  width: 5px;
  height: 5px;
  background: var(--sv-red, #ff0000);
  content: "";
  transform: translateY(-50%);
}

.mchd-resources {
  display: grid;
  grid-template-columns: 230px minmax(0, 1fr);
  gap: 28px;
  margin-top: 28px;
  padding-top: 26px;
  border-top: 1px solid var(--sv-line, #dde3ec);
}

.mchd-resources__head span {
  color: var(--sv-red, #ff0000);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: 0.09em;
  line-height: 1.3;
  text-transform: uppercase;
}

.mchd-resources__head h3 {
  margin: 8px 0 0;
  color: var(--sv-navy-ink, #0f2340);
  font-size: 22px;
  letter-spacing: -0.025em;
  line-height: 1.2;
}

.mchd-resource-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border-top: 1px solid var(--sv-line, #dde3ec);
  border-left: 1px solid var(--sv-line, #dde3ec);
}

.mchd-resource-list a {
  position: relative;
  display: grid;
  min-height: 78px;
  align-content: center;
  gap: 5px;
  padding: 15px 38px 15px 16px;
  border-right: 1px solid var(--sv-line, #dde3ec);
  border-bottom: 1px solid var(--sv-line, #dde3ec);
  color: var(--sv-navy-ink, #0f2340);
  text-decoration: none;
  transition:
    background-color 180ms ease,
    color 180ms ease;
}

.mchd-resource-list a::after {
  position: absolute;
  top: 50%;
  right: 16px;
  color: var(--sv-red, #ff0000);
  content: "↗";
  font-size: 17px;
  transform: translateY(-50%);
}

.mchd-resource-list a:hover,
.mchd-resource-list a:focus-visible {
  outline: none;
  background: var(--sv-navy, #002f6c);
  color: #fff;
}

.mchd-resource-list a span {
  color: var(--sv-gray-500, #6b7789);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.mchd-resource-list a:hover span,
.mchd-resource-list a:focus-visible span {
  color: rgba(255, 255, 255, 0.7);
}

.mchd-resource-list a strong {
  font-size: 13px;
  line-height: 1.35;
}

.mchd-dialog__verification {
  margin: 20px 0 0;
  color: var(--sv-gray-500, #6b7789);
  font-size: 11px;
  line-height: 1.5;
}

.callback-modal {
  position: fixed;
  z-index: 1700;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(5, 18, 36, 0.66);
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
  opacity: 0;
  visibility: hidden;
  transition:
    opacity 220ms ease,
    visibility 220ms ease;
}

.callback-modal.is-open {
  opacity: 1;
  visibility: visible;
}

.callback-dialog {
  position: relative;
  width: min(440px, 100%);
  max-height: calc(100dvh - 48px);
  overflow: auto;
  border: 1px solid rgba(0, 47, 108, 0.18);
  background: #fff;
  box-shadow: 0 24px 72px rgba(0, 17, 42, 0.28);
  opacity: 0;
  transform: translateY(12px);
  transition:
    opacity 200ms ease,
    transform 280ms cubic-bezier(0.22, 1, 0.36, 1);
}

.callback-modal.is-open .callback-dialog {
  opacity: 1;
  transform: none;
}

.callback-dialog__close {
  position: absolute;
  z-index: 2;
  top: 14px;
  right: 14px;
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  border: 1px solid rgba(0, 47, 108, 0.16);
  border-radius: 0;
  background: #fff;
  color: var(--sv-navy, #002f6c);
  transition:
    border-color 180ms ease,
    color 180ms ease,
    background-color 180ms ease;
}

.callback-dialog__close:hover,
.callback-dialog__close:focus-visible {
  border-color: var(--sv-red, #ff0000);
  outline: none;
  background: var(--sv-red, #ff0000);
  color: #fff;
}

.callback-dialog__intro {
  padding: 30px 72px 0 28px;
}

.callback-dialog__kicker {
  display: inline-flex;
  gap: 9px;
  align-items: center;
  color: var(--sv-navy, #002f6c);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: 0.105em;
  line-height: 1.2;
  text-transform: uppercase;
}

.callback-dialog__kicker i {
  width: 7px;
  height: 7px;
  background: var(--sv-red, #ff0000);
}

.callback-dialog__intro h2 {
  margin: 15px 0 0;
  color: var(--sv-navy-ink, #0f2340);
  font-size: 27px;
  font-weight: 780;
  letter-spacing: -0.035em;
  line-height: 1.08;
}

.callback-dialog__intro p {
  margin: 13px 0 0;
  color: var(--sv-gray-500, #6b7789);
  font-size: 13px;
  line-height: 1.55;
}

.callback-form {
  padding: 22px 28px 24px;
}

.callback-field {
  display: grid;
  gap: 8px;
}

.callback-field > span {
  color: var(--sv-navy-ink, #0f2340);
  font-size: 11px;
  font-weight: 750;
}

.callback-field input {
  width: 100%;
  min-height: 56px;
  padding: 0 15px;
  border: 1px solid rgba(0, 47, 108, 0.24);
  border-radius: 0;
  outline: none;
  background: #fff;
  color: var(--sv-navy-ink, #0f2340);
  font-family: var(--service-font-data);
  font-size: 18px;
  font-weight: 650;
  letter-spacing: 0.015em;
  transition:
    border-color 180ms ease,
    box-shadow 180ms ease;
}

.callback-field input:focus {
  border-color: var(--sv-navy, #002f6c);
  box-shadow: 0 0 0 3px rgba(0, 47, 108, 0.1);
}

.callback-field input[aria-invalid="true"] {
  border-color: var(--sv-red, #ff0000);
}

.callback-honeypot {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

.callback-consent {
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  margin-top: 16px;
  color: var(--sv-gray-500, #6b7789);
  font-size: 10.5px;
  line-height: 1.5;
}

.callback-consent input {
  width: 18px;
  height: 18px;
  margin: 1px 0 0;
  accent-color: var(--sv-navy, #002f6c);
}

.callback-consent a {
  color: var(--sv-navy, #002f6c);
  text-decoration: underline;
  text-underline-offset: 2px;
}

.callback-consent--optional {
  margin-top: 12px;
}

.callback-consent--optional strong {
  font-weight: 700;
}

.callback-consent-note {
  margin: 7px 0 0 30px;
  color: var(--sv-gray-500, #6b7789);
  font-size: 10.5px;
  line-height: 1.5;
}

.callback-consent-note a {
  color: var(--sv-navy, #002f6c);
  text-decoration: underline;
  text-underline-offset: 2px;
}

.callback-submit {
  width: 100%;
  margin-top: 18px;
}

.callback-submit:disabled {
  border-color: #cbd3df;
  background: #dfe4ec;
  color: #748095;
  cursor: not-allowed;
}

.callback-status {
  min-height: 32px;
  margin: 11px 0 0;
  color: var(--sv-gray-500, #6b7789);
  font-size: 10.5px;
  line-height: 1.5;
}

.callback-status[data-state="error"] {
  color: #c60000;
}

.callback-progress {
  margin: 22px 28px 24px;
  border: 1px solid rgba(0, 47, 108, 0.16);
}

.callback-timer {
  position: relative;
  display: flex;
  min-height: 132px;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background-color: var(--sv-navy, #002f6c);
  background-image:
    linear-gradient(rgba(255, 255, 255, 0.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.055) 1px, transparent 1px);
  background-size: 28px 28px;
  color: #fff;
  font-family: var(--service-font-data);
  font-size: clamp(54px, 15vw, 70px);
  font-variant-numeric: tabular-nums;
  font-weight: 750;
  letter-spacing: -0.055em;
  line-height: 1;
}

.callback-timer::after {
  position: absolute;
  right: 18px;
  bottom: 18px;
  width: 8px;
  height: 8px;
  background: var(--sv-red, #ff0000);
  content: "";
}

.callback-timer b {
  margin: 0 4px;
  color: var(--sv-red, #ff0000);
  font-weight: inherit;
  transform: translateY(-4px);
}

.callback-progress__copy {
  padding: 18px;
}

.callback-progress__copy > span {
  color: var(--sv-red, #ff0000);
  font-size: 9px;
  font-weight: 850;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}

.callback-progress__copy strong {
  display: block;
  margin-top: 8px;
  color: var(--sv-navy-ink, #0f2340);
  font-size: 16px;
  line-height: 1.35;
}

.callback-progress__copy p {
  margin: 7px 0 0;
  color: var(--sv-gray-500, #6b7789);
  font-size: 11.5px;
  line-height: 1.5;
}

.callback-fallback {
  display: flex;
  flex-wrap: wrap;
  gap: 7px 14px;
  align-items: center;
  padding: 15px 28px 18px;
  border-top: 1px solid var(--sv-line, #dde3ec);
  color: var(--sv-gray-500, #6b7789);
  font-size: 11px;
}

.callback-fallback a {
  color: var(--sv-navy, #002f6c);
  font-weight: 800;
}

.product-modal {
  position: fixed;
  z-index: 1600;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(5, 18, 36, 0.58);
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
  opacity: 0;
  visibility: hidden;
  transition:
    opacity 220ms ease,
    visibility 220ms ease;
}

.product-modal.is-open {
  opacity: 1;
  visibility: visible;
}

.product-dialog {
  position: relative;
  width: min(1080px, 100%);
  max-height: calc(100dvh - 48px);
  overflow: auto;
  border: 1px solid rgba(0, 47, 108, 0.12);
  background: #fff;
  box-shadow: 0 24px 72px rgba(0, 17, 42, 0.26);
  opacity: 0;
  transform: translateY(10px);
  transition:
    opacity 200ms ease,
    transform 260ms cubic-bezier(0.22, 1, 0.36, 1);
}

.product-modal.is-open .product-dialog {
  opacity: 1;
  transform: none;
}

.product-dialog__close {
  position: absolute;
  z-index: 3;
  top: 16px;
  right: 16px;
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  border: 1px solid rgba(0, 47, 108, 0.18);
  border-radius: 0;
  background: #fff;
  color: var(--sv-navy, #002f6c);
  cursor: pointer;
  transition:
    border-color 180ms ease,
    background 180ms ease,
    color 180ms ease;
  touch-action: manipulation;
}

.product-dialog__close:hover,
.product-dialog__close:focus-visible {
  border-color: var(--sv-navy, #002f6c);
  background: var(--sv-navy, #002f6c);
  color: #fff;
}

.product-dialog__close:focus-visible {
  outline: 3px solid rgba(0, 47, 108, 0.22);
  outline-offset: 3px;
}

.product-dialog__grid {
  display: grid;
  min-height: 0;
  grid-template-columns: minmax(0, 1fr) minmax(370px, 0.86fr);
}

.product-dialog__visual {
  min-width: 0;
  padding: 32px;
  border-right: 1px solid var(--sv-line, #dde3ec);
  background: #fff;
}

.product-dialog__image {
  position: relative;
  display: grid;
  min-height: 250px;
  place-items: center;
  overflow: hidden;
  margin-top: 12px;
  padding: 18px 12px;
  background: #fff;
}

.product-dialog__image img {
  position: relative;
  z-index: 1;
  display: block;
  width: min(100%, 480px);
  height: auto;
  filter: drop-shadow(0 16px 18px rgba(15, 35, 64, 0.14));
}

.product-dialog__documents {
  margin-top: 20px;
  padding-top: 18px;
  border-top: 1px solid var(--sv-line, #dde3ec);
}

.product-dialog__documents h3,
.product-dialog__spec-group h3 {
  margin: 0;
  color: var(--sv-navy-ink, #0f2340);
  font-family: var(--service-font-body);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0;
}

.product-dialog__document-list {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
  margin-top: 12px;
}

.product-document {
  display: grid;
  min-height: 56px;
  grid-template-columns: 42px 1fr;
  gap: 12px;
  align-items: center;
  padding: 6px 12px 6px 7px;
  border: 1px solid var(--sv-line, #dde3ec);
  background: #fff;
  color: var(--sv-navy-ink, #0f2340);
  transition:
    border-color 180ms ease,
    box-shadow 180ms ease;
}

.product-document:hover,
.product-document:focus-visible {
  border-color: var(--sv-navy, #002f6c);
  box-shadow: 0 6px 16px rgba(15, 35, 64, 0.07);
}

.product-document--static:hover {
  border-color: var(--sv-line, #dde3ec);
  box-shadow: none;
}

.product-document:focus-visible {
  outline: 3px solid rgba(0, 47, 108, 0.2);
  outline-offset: 2px;
}

.product-document__type {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  color: var(--sv-red, #ff0000);
}

.product-document__type--pdf img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.product-document__type--text {
  background: var(--sv-red, #ff0000);
  color: #fff;
  font-family: var(--service-font-data);
  font-size: 9px;
  font-weight: 750;
  letter-spacing: 0.06em;
}

.product-document__text {
  font-size: 12px;
  font-weight: 650;
  line-height: 1.35;
}

.product-dialog__info {
  display: flex;
  min-width: 0;
  flex-direction: column;
  padding: 46px 38px 32px;
  background: #f6f8fb;
}

.product-dialog__kicker {
  color: var(--sv-red, #ff0000);
  font-family: var(--service-font-body);
  font-size: 9.5px;
  font-weight: 750;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.product-dialog__info h2 {
  max-width: 520px;
  margin: 10px 0 0;
  color: var(--sv-navy-ink, #0f2340);
  font-family: var(--service-font-body);
  font-size: clamp(28px, 2.4vw, 34px);
  font-weight: 700;
  letter-spacing: -0.035em;
  line-height: 1.08;
}

.product-dialog__description {
  max-width: 520px;
  margin: 16px 0 0;
  color: var(--sv-gray-500, #6b7789);
  font-size: 14px;
  line-height: 1.55;
}

.product-dialog__spec-group {
  margin-top: 28px;
}

.product-dialog__specs {
  display: grid;
  margin: 12px 0 0;
  border-top: 1px solid rgba(0, 47, 108, 0.16);
}

.product-dialog__specs div {
  display: grid;
  min-height: 44px;
  grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
  gap: 22px;
  align-items: center;
  border-bottom: 1px solid rgba(0, 47, 108, 0.13);
}

.product-dialog__specs dt,
.product-dialog__specs dd {
  margin: 0;
  font-size: 12px;
  line-height: 1.35;
}

.product-dialog__specs dt {
  color: var(--sv-gray-500, #6b7789);
}

.product-dialog__specs dd {
  color: var(--sv-navy-ink, #0f2340);
  font-weight: 650;
  text-align: right;
}

.product-dialog__note {
  margin: 20px 0 0;
  padding: 12px 14px;
  border-left: 2px solid var(--sv-red, #ff0000);
  background: #fff;
  color: var(--sv-gray-500, #6b7789);
  font-size: 11.5px;
  line-height: 1.5;
}

.product-dialog__actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-top: auto;
  padding-top: 24px;
}

.product-dialog__actions .button {
  min-width: 0;
  min-height: 48px;
  padding-inline: 14px;
  font-size: 12px;
}

.estimate-selected-model {
  margin: 0 0 20px;
  padding: 12px 14px;
  border-left: 3px solid var(--sv-red, #ff0000);
  background: var(--sv-ground, #eff2f7);
  color: var(--sv-gray-500, #6b7789);
  font-size: 12px;
  line-height: 1.4;
}

.estimate-selected-model strong {
  color: var(--sv-navy-ink, #0f2340);
}

.service-section {
  position: relative;
  padding: 110px 0;
}

#main {
  position: relative;
}

.estimate-route {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  display: block;
  width: 100%;
  height: 0;
  overflow: visible;
  pointer-events: none;
}

.estimate-route__line {
  fill: none;
  stroke: var(--sv-red, #ff0000);
  stroke-width: 2;
  stroke-dasharray: 1;
  stroke-dashoffset: 1;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: 0;
}

.estimate-route.is-active .estimate-route__line {
  animation: estimate-route-draw 1.35s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.service-section--white {
  background: #fff;
}

#price {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}

#price::before {
  position: absolute;
  z-index: -1;
  inset: 0;
  background-image:
    linear-gradient(rgba(0, 47, 108, 0.11) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0, 47, 108, 0.11) 1px, transparent 1px);
  background-size: 54px 54px;
  content: "";
  opacity: 0.7;
  pointer-events: none;
  -webkit-mask-image: radial-gradient(110% 95% at 0 100%, #000 0%, transparent 72%);
  mask-image: radial-gradient(110% 95% at 0 100%, #000 0%, transparent 72%);
}

.service-section--soft {
  background: var(--sv-ground-2, #e4e9f2);
}

.service-section--related-light {
  overflow: hidden;
  padding: 78px 0 82px;
  background: linear-gradient(135deg, #f3f5f9 0%, #e4e9f3 58%, #eef2f7 100%);
  color: var(--sv-navy-ink, #0f2340);
}

.service-section--related-light::before {
  content: none;
}

.related-section__inner {
  position: relative;
  z-index: 1;
}

.service-section--navy {
  overflow: hidden;
  background: var(--sv-navy-deep, #011e46);
  color: #fff;
}

.service-section--navy::before {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(var(--service-grid-invert) 1px, transparent 1px),
    linear-gradient(90deg, var(--service-grid-invert) 1px, transparent 1px);
  background-size: 54px 54px;
  content: "";
  -webkit-mask-image: radial-gradient(110% 95% at 100% 0, #000 0%, transparent 70%);
  mask-image: radial-gradient(110% 95% at 100% 0, #000 0%, transparent 70%);
  pointer-events: none;
}

#included {
  background-color: #e4e9f3;
  background-image: radial-gradient(
    ellipse 52% 105% at 44% 50%,
    rgba(255, 255, 255, 0.48) 0%,
    rgba(255, 255, 255, 0.38) 35%,
    rgba(255, 255, 255, 0.2) 62%,
    rgba(255, 255, 255, 0.05) 80%,
    rgba(255, 255, 255, 0) 91%
  );
  color: var(--sv-navy-ink, #0f2340);
}

#included::before {
  background-image:
    linear-gradient(rgba(0, 47, 108, 0.1) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0, 47, 108, 0.1) 1px, transparent 1px);
  -webkit-mask-image: radial-gradient(110% 95% at 100% 0, #000 0%, transparent 72%);
  mask-image: radial-gradient(110% 95% at 100% 0, #000 0%, transparent 72%);
}

.skzi-page #included {
  background-image: radial-gradient(
    ellipse 58% 108% at 48% 50%,
    rgba(255, 255, 255, 0.66) 0%,
    rgba(255, 255, 255, 0.52) 34%,
    rgba(255, 255, 255, 0.28) 63%,
    rgba(255, 255, 255, 0.08) 80%,
    rgba(255, 255, 255, 0) 92%
  );
}

#included .section-heading--inverse {
  color: var(--sv-navy-ink, #0f2340);
}

#included .section-intro--inverse {
  color: var(--sv-gray-500, #6b7789);
}

.section-heading {
  max-width: 760px;
  margin: 0;
  color: var(--sv-navy-ink, #0f2340);
  font-family: var(--service-font-display);
  font-size: clamp(38px, 4.4vw, 58px);
  font-weight: 760;
  letter-spacing: -0.04em;
  line-height: 1.04;
  text-wrap: balance;
}

.section-heading--inverse {
  color: #fff;
}

.section-heading .section-accent {
  color: var(--sv-red, #ff0000);
}

.section-intro {
  max-width: 700px;
  margin: 22px 0 0;
  color: var(--sv-gray-500, #6b7789);
  font-size: 18px;
  line-height: 1.58;
}

.section-intro--inverse {
  color: var(--sv-on-navy-muted, #9fb0cc);
}

.scenario-layout {
  display: grid;
  grid-template-columns: minmax(0, 0.78fr) minmax(0, 1.22fr);
  gap: 86px;
  align-items: start;
}

.scenario-list {
  margin-top: 8px;
  border-top: 1px solid rgba(0, 47, 108, 0.18);
}

.scenario {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 20px;
  padding: 24px 0;
  border-bottom: 1px solid rgba(0, 47, 108, 0.14);
}

.scenario__index {
  color: var(--sv-red, #ff0000);
  font-family: var(--service-font-data);
  font-size: 12px;
  font-weight: 800;
}

.scenario h3 {
  margin: 0;
  color: var(--sv-navy-ink, #0f2340);
  font-size: 19px;
  line-height: 1.25;
}

.scenario p {
  margin: 8px 0 0;
  color: var(--sv-gray-500, #6b7789);
  font-size: 14px;
  line-height: 1.55;
}

.vehicle-board {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-top: 1px solid var(--sv-line, #dde3ec);
  border-left: 1px solid var(--sv-line, #dde3ec);
  background: #fff;
  box-shadow: 0 20px 50px rgba(15, 35, 64, 0.08);
}

.vehicle {
  min-height: 270px;
  padding: 28px 24px;
  border-right: 1px solid var(--sv-line, #dde3ec);
  border-bottom: 1px solid var(--sv-line, #dde3ec);
}

.vehicle__icon {
  display: flex;
  align-items: center;
  height: 98px;
  color: var(--sv-navy, #002f6c);
}

.vehicle__icon svg {
  width: 100%;
  max-width: 150px;
  height: 82px;
}

.vehicle__type {
  display: block;
  margin-top: 24px;
  color: var(--sv-red, #ff0000);
  font-family: var(--service-font-data);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.vehicle h3 {
  margin: 8px 0 0;
  color: var(--sv-navy-ink, #0f2340);
  font-size: 18px;
}

.vehicle p {
  margin: 8px 0 0;
  color: var(--sv-gray-500, #6b7789);
  font-size: 13px;
  line-height: 1.5;
}

.included-layout {
  position: relative;
  z-index: 1;
}

.included-aside {
  display: block;
  max-width: 720px;
}

.included-aside .eyebrow {
  margin: 2px 0 0;
}

.included-aside .section-intro {
  margin: 16px 0 0;
}

.work-list {
  display: grid;
  max-width: 1020px;
  gap: 0;
  margin: 58px auto 0;
  padding: 0;
  list-style: none;
}

.work-item {
  position: relative;
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr);
  gap: 0;
  width: 100%;
  min-height: 0;
  margin: 0;
  padding: 0 0 46px 52px;
}

.work-item:last-child {
  padding-bottom: 0;
}

.work-item:not(:last-child)::before,
.work-item:not(:last-child)::after {
  position: absolute;
  top: 9px;
  left: 6px;
  width: 2px;
  height: 100%;
  content: "";
}

.work-item:not(:last-child)::before {
  background: rgba(15, 35, 64, 0.24);
}

.work-item:not(:last-child)::after {
  background: var(--sv-red, #ff0000);
  transform: scaleY(0);
  transform-origin: 50% 0;
}

.work-item__index {
  position: relative;
  color: var(--sv-navy-ink, #0f2340);
  font-family: var(--service-font-data);
  font-size: 16px;
  font-weight: 700;
  line-height: 1.35;
}

.work-item__index::before {
  position: absolute;
  top: 4px;
  left: -50px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: rgba(15, 35, 64, 0.52);
  content: "";
}

.work-route-anchor {
  position: absolute;
  top: 9px;
  left: 7px;
  width: 0;
  height: 0;
  pointer-events: none;
}

.work-item h3 {
  margin: 0;
  color: var(--sv-navy-ink, #0f2340);
  font-size: 22px;
  line-height: 1.25;
}

.work-item p {
  max-width: 790px;
  margin: 7px 0 0;
  color: var(--sv-gray-500, #6b7789);
  font-size: 15px;
  line-height: 1.55;
}

.mchd-guide-trigger {
  display: inline-flex;
  gap: 9px;
  align-items: center;
  margin-top: 13px;
  padding: 0 0 4px;
  border: 0;
  border-bottom: 1px solid currentColor;
  background: transparent;
  color: var(--sv-navy, #002f6c);
  font: inherit;
  font-size: 13px;
  font-weight: 750;
  line-height: 1.35;
  text-align: left;
  cursor: pointer;
  transition:
    color 180ms ease,
    border-color 180ms ease;
}

.mchd-guide-trigger svg {
  flex: 0 0 auto;
  transition: transform 180ms ease;
}

.mchd-guide-trigger:hover,
.mchd-guide-trigger:focus-visible {
  border-color: var(--sv-red, #ff0000);
  outline: none;
  color: var(--sv-red, #ff0000);
}

.mchd-guide-trigger:hover svg,
.mchd-guide-trigger:focus-visible svg {
  transform: translateX(3px);
}

.work-list.in .work-item:not(:last-child)::after {
  animation: work-route-draw 0.5s cubic-bezier(0.4, 0, 0.2, 1) both;
}

.work-list.in .work-item__index::before {
  animation: work-route-node 0.22s ease-out both;
}

.work-list.in .work-item__index {
  animation: work-route-index 0.22s ease-out both;
}

.work-list.in .work-item:nth-child(1)::after { animation-delay: 0.18s; }
.work-list.in .work-item:nth-child(2)::after { animation-delay: 0.68s; }
.work-list.in .work-item:nth-child(3)::after { animation-delay: 1.18s; }
.work-list.in .work-item:nth-child(4)::after { animation-delay: 1.68s; }
.work-list.in .work-item:nth-child(5)::after { animation-delay: 2.18s; }
.work-list.in .work-item:nth-child(6)::after { animation-delay: 2.68s; }

.work-list.in .work-item:nth-child(1) .work-item__index,
.work-list.in .work-item:nth-child(1) .work-item__index::before { animation-delay: 0.08s; }
.work-list.in .work-item:nth-child(2) .work-item__index,
.work-list.in .work-item:nth-child(2) .work-item__index::before { animation-delay: 0.62s; }
.work-list.in .work-item:nth-child(3) .work-item__index,
.work-list.in .work-item:nth-child(3) .work-item__index::before { animation-delay: 1.12s; }
.work-list.in .work-item:nth-child(4) .work-item__index,
.work-list.in .work-item:nth-child(4) .work-item__index::before { animation-delay: 1.62s; }
.work-list.in .work-item:nth-child(5) .work-item__index,
.work-list.in .work-item:nth-child(5) .work-item__index::before { animation-delay: 2.12s; }
.work-list.in .work-item:nth-child(6) .work-item__index,
.work-list.in .work-item:nth-child(6) .work-item__index::before { animation-delay: 2.62s; }
.work-list.in .work-item:nth-child(7) .work-item__index,
.work-list.in .work-item:nth-child(7) .work-item__index::before { animation-delay: 3.12s; }

.monitoring-workflow {
  padding-block: 88px;
}

.monitoring-workflow .included-aside {
  max-width: 820px;
}

.monitoring-workflow .work-list {
  margin-top: 46px;
}

.monitoring-workflow .work-item {
  padding-bottom: 38px;
}

.monitoring-workflow .work-item p {
  max-width: 840px;
}

.era-registration {
  --sv-gray-500: #bdcbe0;
  --sv-navy-ink: #f5f8fc;
  overflow: hidden;
  background-color: #002b60;
  background-image: linear-gradient(145deg, #022858 0%, #06396f 48%, #002b60 100%);
  color: var(--sv-navy-ink);
}

.era-registration::before {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(255, 255, 255, 0.085) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.085) 1px, transparent 1px);
  background-size: 54px 54px;
  content: "";
  pointer-events: none;
  -webkit-mask-image: radial-gradient(110% 95% at 100% 0, #000 0%, transparent 72%);
  mask-image: radial-gradient(110% 95% at 100% 0, #000 0%, transparent 72%);
}

.era-registration .included-aside {
  max-width: none;
}

.era-registration__title {
  max-width: 1040px;
  margin: 18px 0 0;
  color: var(--sv-navy-ink);
  font-family: var(--service-font-display);
  font-size: clamp(34px, 3.6vw, 48px);
  font-weight: 760;
  letter-spacing: -0.04em;
  line-height: 1.04;
  text-wrap: balance;
}

.era-registration .section-intro {
  max-width: none;
}

.era-registration__lead {
  max-width: none;
  margin: 16px 0 0;
  color: #bdcbe0;
  font-size: 15px;
  line-height: 1.6;
}

.era-registration__details {
  display: grid;
  max-width: 840px;
  gap: 9px;
  margin: 14px 0 0;
  padding: 0;
  color: #c5d1e2;
  font-size: 14px;
  line-height: 1.55;
  list-style: none;
}

.era-registration__details li {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
}

.era-registration__details li::before {
  display: grid;
  width: 18px;
  height: 18px;
  place-items: center;
  margin-top: 2px;
  border: 1px solid rgba(255, 255, 255, 0.24);
  background: rgba(255, 255, 255, 0.04);
  color: #ff5a66;
  content: "✓";
  font-family: Arial, sans-serif;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
}

.era-registration .work-item p {
  color: #bdcbe0;
}

.era-registration .work-item a {
  color: #f5f8fc;
  text-decoration-line: underline;
  text-decoration-color: rgba(245, 248, 252, 0.5);
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  transition: color 180ms ease, text-decoration-color 180ms ease;
}

.era-registration .work-item a:hover,
.era-registration .work-item a:focus-visible {
  color: #ff6b75;
  text-decoration-color: currentColor;
}

.era-registration .work-item a:focus-visible {
  outline: 2px solid rgba(255, 255, 255, 0.72);
  outline-offset: 3px;
}

.era-registration .work-item:not(:last-child)::before {
  background: rgba(255, 255, 255, 0.18);
}

.era-registration .work-item__index::before {
  background: rgba(255, 255, 255, 0.46);
}

.era-registration__source {
  display: inline-flex;
  margin-top: 20px;
  padding-bottom: 4px;
  border-bottom: 1px solid currentColor;
  color: #f5f8fc;
  font-size: 13px;
  font-weight: 750;
  line-height: 1.35;
  text-decoration: none;
  transition:
    border-color 180ms ease,
    color 180ms ease;
}

.era-registration__source:hover,
.era-registration__source:focus-visible {
  border-color: var(--sv-red, #ff0000);
  outline: none;
  color: var(--sv-red, #ff0000);
}

@keyframes work-route-draw {
  to { transform: scaleY(1); }
}

@keyframes work-route-node {
  to {
    background: var(--sv-red, #ff0000);
    box-shadow: 0 0 0 4px rgba(255, 0, 0, 0.1);
  }
}

@keyframes work-route-index {
  from { color: var(--sv-navy-ink, #0f2340); }
  to { color: var(--sv-red, #ff0000); }
}

@keyframes estimate-route-draw {
  0% {
    stroke-dashoffset: 1;
    opacity: 1;
  }
  100% {
    stroke-dashoffset: 0;
    opacity: 1;
  }
}

.price-layout {
  display: grid;
  grid-template-columns: minmax(0, 0.82fr) minmax(480px, 1.18fr);
  column-gap: 76px;
  row-gap: 32px;
  align-items: stretch;
}

.price-copy {
  display: flex;
  flex-direction: column;
}

.price-copy > .eyebrow {
  margin-top: 0;
}

.price-copy__lead {
  max-width: 620px;
  margin: 26px 0 0;
  color: var(--sv-navy-ink, #0f2340);
  font-size: clamp(18px, 1.55vw, 21px);
  font-weight: 650;
  letter-spacing: -0.012em;
  line-height: 1.48;
}

.price-copy__proof {
  max-width: 620px;
  margin: 22px 0 0;
  color: var(--sv-gray-500, #6b7789);
  font-size: 16px;
  line-height: 1.65;
}

.price-trust-cta {
  position: relative;
  max-width: 620px;
  margin-top: auto;
  padding: 28px 30px 30px;
  border-left: 3px solid var(--sv-red, #ff0000);
  background: var(--sv-ground, #eff2f7);
}

.price-trust-cta > span {
  color: var(--sv-red, #ff0000);
  font-family: var(--service-font-data);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.price-trust-cta strong {
  display: block;
  margin-top: 10px;
  color: var(--sv-navy-ink, #0f2340);
  font-size: clamp(20px, 1.8vw, 25px);
  line-height: 1.25;
}

.price-trust-cta p {
  margin: 8px 0 0;
  color: var(--sv-gray-500, #6b7789);
  font-size: 15px;
  line-height: 1.5;
}

.price-trust-cta .price-copy__experience {
  max-width: none;
  margin-top: 20px;
  padding-top: 20px;
  border-top: 1px solid rgba(0, 47, 108, 0.16);
  color: var(--sv-navy-ink, #0f2340);
  line-height: 1.62;
}

.price-factors {
  display: grid;
  margin-top: 32px;
  border-top: 1px solid rgba(0, 47, 108, 0.16);
}

.price-geo {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: minmax(240px, 0.46fr) minmax(0, 1.54fr);
  gap: 32px;
  align-items: start;
  margin-top: 0;
  padding: 24px 28px;
  border-left: 3px solid var(--sv-red, #ff0000);
  background: var(--sv-navy, #002f6c);
}

.price-geo strong {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr);
  gap: 14px;
  align-items: center;
  color: #fff;
  font-size: 14px;
  line-height: 1.24;
}

.price-geo strong::before {
  width: 52px;
  height: 52px;
  background: var(--sv-red, #ff0000);
  content: "";
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 2a7 7 0 0 0-7 7c0 5.25 7 13 7 13s7-7.75 7-13a7 7 0 0 0-7-7Zm0 9.5A2.5 2.5 0 1 1 12 6a2.5 2.5 0 0 1 0 5.5Z'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 2a7 7 0 0 0-7 7c0 5.25 7 13 7 13s7-7.75 7-13a7 7 0 0 0-7-7Zm0 9.5A2.5 2.5 0 1 1 12 6a2.5 2.5 0 0 1 0 5.5Z'/%3E%3C/svg%3E") center / contain no-repeat;
}

.price-geo p {
  margin: 0;
  color: rgba(255, 255, 255, 0.76);
  font-size: 13px;
  line-height: 1.55;
}

.price-factor {
  display: grid;
  grid-template-columns: 30px 1fr;
  gap: 16px;
  padding: 18px 0;
  border-bottom: 1px solid rgba(0, 47, 108, 0.13);
}

.price-factor__mark {
  color: var(--sv-red, #ff0000);
  font-family: var(--service-font-data);
  font-size: 12px;
  font-weight: 800;
}

.price-factor strong {
  display: block;
  color: var(--sv-navy-ink, #0f2340);
  font-size: 15px;
}

.price-factor span {
  display: block;
  margin-top: 5px;
  color: var(--sv-gray-500, #6b7789);
  font-size: 13px;
  line-height: 1.48;
}

.estimate-card {
  position: relative;
  z-index: 3;
  margin-top: 64px;
  border: 1px solid rgba(0, 47, 108, 0.16);
  background: #fff;
  box-shadow: 0 24px 64px rgba(15, 35, 64, 0.1);
}

.estimate-card__route-outline {
  position: absolute;
  inset: -2px;
  z-index: 4;
  display: block;
  width: calc(100% + 4px);
  height: calc(100% + 4px);
  overflow: visible;
  pointer-events: none;
}

.estimate-card__route-outline path {
  fill: none;
  stroke: var(--sv-red, #ff0000);
  stroke-width: 2;
  stroke-dasharray: 1;
  stroke-dashoffset: 1;
  stroke-linecap: square;
  opacity: 0;
}

.estimate-card.is-route-highlighted .estimate-card__route-outline path {
  animation: estimate-card-outline-draw 0.9s cubic-bezier(0.22, 1, 0.36, 1) both;
}

@keyframes estimate-card-outline-draw {
  0% {
    stroke-dashoffset: 1;
    opacity: 1;
  }
  100% {
    stroke-dashoffset: 0;
    opacity: 1;
  }
}

.estimate-card__head {
  padding: 32px 34px 26px;
  border-bottom: 1px solid var(--sv-line, #dde3ec);
}

.estimate-card__head span {
  color: var(--sv-red, #ff0000);
  font-family: var(--service-font-data);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}

.estimate-card__head h3 {
  margin: 10px 0 0;
  color: var(--sv-navy-ink, #0f2340);
  font-size: 28px;
  letter-spacing: -0.025em;
}

.estimate-card__head p {
  margin: 10px 0 0;
  color: var(--sv-gray-500, #6b7789);
  font-size: 14px;
  line-height: 1.5;
}

.estimate-form {
  padding: 30px 34px 34px;
}

.form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px 18px;
}

.field {
  display: grid;
  gap: 8px;
}

.driver-card-page .field--wide {
  grid-column: 1 / -1;
}

.field label {
  color: var(--sv-navy-ink, #0f2340);
  font-size: 12px;
  font-weight: 750;
}

.field input,
.field select {
  width: 100%;
  min-height: 50px;
  padding: 0 13px;
  border: 1px solid rgba(0, 47, 108, 0.22);
  border-radius: 0;
  background: #fff;
  color: var(--sv-navy-ink, #0f2340);
  font-size: 15px;
  transition:
    border-color 0.18s ease,
    box-shadow 0.18s ease;
}

.field input:focus,
.field select:focus {
  border-color: var(--sv-navy, #002f6c);
  outline: none;
  box-shadow: 0 0 0 3px rgba(0, 47, 108, 0.1);
}

.field input::placeholder {
  color: #8b96a7;
}

.consent {
  display: grid;
  grid-template-columns: 20px 1fr;
  gap: 10px;
  align-items: start;
  margin-top: 20px;
  color: var(--sv-gray-500, #6b7789);
  font-size: 11px;
  line-height: 1.5;
}

.consent input {
  width: 18px;
  height: 18px;
  margin: 1px 0 0;
  accent-color: var(--sv-navy, #002f6c);
}

.consent a {
  color: var(--sv-navy, #002f6c);
  text-decoration: underline;
  text-underline-offset: 2px;
}

.consent--optional {
  margin-top: 12px;
}

.consent--optional strong {
  font-weight: 700;
}

.consent-note {
  margin: 7px 0 0 30px;
  color: var(--sv-gray-500, #6b7789);
  font-size: 11px;
  line-height: 1.5;
}

.consent-note a {
  color: var(--sv-navy, #002f6c);
  text-decoration: underline;
  text-underline-offset: 2px;
}

.estimate-submit {
  width: 100%;
  margin-top: 20px;
}

.estimate-submit:disabled {
  border-color: #cbd3df;
  background: #dfe4ec;
  color: #748095;
  cursor: not-allowed;
}

.form-status {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  margin: 16px 0 0;
  padding: 14px 16px;
  border: 1px solid rgba(11, 107, 75, 0.22);
  border-left: 3px solid #0b6b4b;
  background: #eef8f4;
  color: var(--sv-navy-ink, #0f2340);
}

.form-status[hidden] {
  display: none;
}

.form-status__icon {
  display: grid;
  width: 38px;
  height: 38px;
  place-items: center;
  background: #0b6b4b;
  color: #fff;
}

.form-status strong {
  display: block;
  font-size: 14px;
  line-height: 1.3;
}

.form-status p {
  margin: 4px 0 0;
  color: #4f665e;
  font-size: 11px;
  line-height: 1.45;
}

.form-status.is-error {
  border-color: rgba(180, 35, 24, 0.24);
  border-left-color: #b42318;
  background: #fff1f0;
}

.form-status.is-error .form-status__icon {
  background: #b42318;
  font-size: 22px;
  font-weight: 800;
}

.form-status.is-error p {
  color: #7a271a;
}

.estimate-form.is-success .estimate-submit:disabled {
  border-color: #0b6b4b;
  background: #0b6b4b;
  color: #fff;
}

.form-alternative {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 18px;
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid var(--sv-line, #dde3ec);
  font-size: 12px;
}

.form-alternative span {
  color: var(--sv-gray-500, #6b7789);
}

.form-alternative a {
  color: var(--sv-navy, #002f6c);
  font-weight: 800;
  transition: color 180ms ease;
}

.form-alternative a:hover,
.form-alternative a:focus-visible {
  color: var(--sv-red, #ff0000);
}

[data-form-messenger] {
  color: var(--sv-navy, #002f6c) !important;
  transition: color 180ms var(--ease-out, ease);
}

[data-form-messenger]:hover,
[data-form-messenger]:focus-visible,
[data-form-messenger]:focus-within {
  color: var(--sv-red, #ff0000) !important;
}

[data-login-contact][data-form-messenger] {
  background-image: none;
}

[data-login-contact][data-form-messenger]:hover,
[data-login-contact][data-form-messenger]:focus-visible {
  background-position: 100% 0;
}

.process-head {
  display: grid;
  grid-template-columns: 0.75fr 1.25fr;
  gap: 70px;
  align-items: end;
}

.process-head .section-intro {
  margin: 0 0 4px;
}

.process-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 56px;
  border-top: 2px solid var(--sv-navy, #002f6c);
}

.process-step {
  position: relative;
  min-height: 230px;
  padding: 30px 26px 24px 0;
}

.process-step + .process-step {
  padding-left: 26px;
  border-left: 1px solid rgba(0, 47, 108, 0.14);
}

.process-step::before {
  position: absolute;
  top: -7px;
  left: 0;
  width: 12px;
  height: 12px;
  border: 2px solid var(--sv-ground-2, #e4e9f2);
  background: var(--sv-red, #ff0000);
  content: "";
}

.process-step + .process-step::before {
  left: 26px;
}

.process-step__index {
  color: var(--sv-red, #ff0000);
  font-family: var(--service-font-data);
  font-size: 12px;
  font-weight: 800;
}

.process-step h3 {
  margin: 28px 0 0;
  color: var(--sv-navy-ink, #0f2340);
  font-size: 20px;
}

.process-step p {
  margin: 10px 0 0;
  color: var(--sv-gray-500, #6b7789);
  font-size: 14px;
  line-height: 1.55;
}

.proof-layout {
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
  gap: 64px;
  align-items: stretch;
}

.proof-panel {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border-top: 1px solid rgba(0, 47, 108, 0.16);
  border-left: 1px solid rgba(0, 47, 108, 0.16);
  background: #fff;
}

.proof-stat {
  min-height: 190px;
  padding: 28px;
  border-right: 1px solid rgba(0, 47, 108, 0.16);
  border-bottom: 1px solid rgba(0, 47, 108, 0.16);
}

.proof-stat strong {
  display: block;
  color: var(--sv-navy, #002f6c);
  font-family: var(--service-font-display);
  font-size: 42px;
  font-weight: 800;
  letter-spacing: -0.04em;
  line-height: 1;
}

.proof-stat span {
  display: block;
  margin-top: 18px;
  color: var(--sv-gray-500, #6b7789);
  font-size: 13px;
  line-height: 1.5;
}

.documents-geo {
  padding: 34px;
  border: 1px solid rgba(0, 47, 108, 0.16);
  background:
    linear-gradient(rgba(0, 47, 108, 0.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0, 47, 108, 0.045) 1px, transparent 1px),
    #f8fafc;
  background-size: 36px 36px;
}

.documents-geo h3 {
  margin: 0;
  color: var(--sv-navy-ink, #0f2340);
  font-size: 28px;
  letter-spacing: -0.025em;
}

.document-list {
  display: grid;
  gap: 10px;
  margin: 24px 0 0;
  padding: 0;
  list-style: none;
}

.document-list li {
  display: grid;
  grid-template-columns: 16px 1fr;
  gap: 10px;
  color: var(--sv-gray-500, #6b7789);
  font-size: 14px;
  line-height: 1.45;
}

.document-list li::before {
  width: 9px;
  height: 9px;
  margin-top: 5px;
  background: var(--sv-red, #ff0000);
  content: "";
}

.geo-title {
  margin-top: 34px !important;
  padding-top: 28px;
  border-top: 1px solid rgba(0, 47, 108, 0.16);
}

.geo-copy {
  margin: 12px 0 0;
  color: var(--sv-gray-500, #6b7789);
  font-size: 14px;
  line-height: 1.55;
}

.geo-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 20px;
}

.geo-chip {
  min-height: 34px;
  padding: 9px 11px;
  border: 1px solid rgba(0, 47, 108, 0.2);
  background: #fff;
  color: var(--sv-navy, #002f6c);
  font-family: var(--service-font-data);
  font-size: 10px;
  font-weight: 800;
}

#faq {
  background: var(--sv-ground, #e4e9f3);
}

.era-page .faq-panel__note a {
  border-bottom: 1px solid currentColor;
  color: inherit;
  text-decoration: none;
  text-underline-offset: 3px;
}

.era-page .faq-panel__note a:hover,
.era-page .faq-panel__note a:focus-visible {
  border-color: var(--sv-red, #ff0000);
  outline: none;
  color: var(--sv-red, #ff0000);
}

.faq-layout {
  display: grid;
  grid-template-columns: 300px minmax(0, 1fr);
  gap: 72px;
  align-items: start;
}

.faq-aside {
  position: sticky;
  top: 104px;
}

.faq-panel {
  padding: 28px;
  border-top: 3px solid var(--sv-red, #ff0000);
  background: var(--sv-navy, #002f6c);
  box-shadow: 0 22px 48px rgba(0, 47, 108, 0.16);
}

.faq-panel__label {
  display: grid;
  gap: 7px;
  margin: 0;
}

.faq-panel__label span {
  color: var(--sv-red, #ff0000);
  font-family: var(--service-font-data);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.faq-panel__label strong {
  color: #fff;
  font-family: var(--service-font-display);
  font-size: 24px;
  line-height: 1.15;
}

.faq-panel__note {
  margin: 18px 0 0;
  color: rgba(255, 255, 255, 0.68);
  font-size: 14px;
  line-height: 1.55;
}

.faq-contact {
  margin-top: 24px;
  padding-top: 22px;
  border-top: 1px solid rgba(255, 255, 255, 0.2);
}

.faq-contact > strong {
  display: block;
  color: #fff;
  font-size: 16px;
  line-height: 1.35;
}

.faq-contact p {
  margin-top: 8px;
  color: rgba(255, 255, 255, 0.68);
  font-size: 12.5px;
  line-height: 1.5;
}

.faq-contact__actions {
  display: grid;
  gap: 9px;
  margin-top: 16px;
}

.faq-contact__primary,
.faq-contact__telegram,
.faq-contact__phone {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0 14px;
  color: #fff;
  font-size: 13px;
  font-weight: 800;
  text-align: center;
}

.faq-contact__primary,
.faq-contact__telegram {
  border: 1px solid #fff;
  background-color: transparent;
  background-size: 200% 100%;
  transition:
    border-color 180ms ease,
    background-position 0.48s var(--ease-out, ease),
    color 180ms ease,
    translate 0.1s ease,
    scale 0.1s ease;
}

.faq-contact__primary {
  background-image: linear-gradient(
    90deg,
    var(--sv-red, #ff0000) 50%,
    transparent 50%
  );
  background-position: 100% 0;
}

.faq-contact__telegram {
  background-image: linear-gradient(
    90deg,
    transparent 50%,
    var(--sv-red, #ff0000) 50%
  );
  background-position: 0 0;
}

.faq-contact__primary:hover,
.faq-contact__primary:focus-visible {
  border-color: var(--sv-red, #ff0000);
  background-position: 0 0;
  outline: none;
}

.faq-contact__telegram:hover,
.faq-contact__telegram:focus-visible {
  border-color: var(--sv-red, #ff0000);
  background-position: 100% 0;
  outline: none;
}

.faq-contact__phone:hover,
.faq-contact__phone:focus-visible {
  color: var(--sv-red, #ff0000);
  outline: none;
}

.faq-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.faq-item {
  overflow: hidden;
  border: 1px solid rgba(0, 47, 108, 0.13);
  background: rgba(255, 255, 255, 0.72);
  transition:
    background-color 0.28s var(--ease-out, ease),
    border-color 0.28s var(--ease-out, ease),
    box-shadow 0.28s var(--ease-out, ease);
}

.faq-item:hover,
.faq-item.is-open {
  border-color: rgba(0, 47, 108, 0.28);
  background: #fff;
}

.faq-item.is-open {
  box-shadow: inset 3px 0 0 var(--sv-red, #ff0000), 0 14px 32px rgba(0, 47, 108, 0.08);
}

.faq-item__heading {
  margin: 0;
  font: inherit;
}

.faq-summary {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) 28px;
  gap: 18px;
  align-items: center;
  width: 100%;
  min-height: 76px;
  padding: 18px 24px;
  border: 0;
  background: transparent;
  color: var(--sv-navy-ink, #0f2340);
  cursor: pointer;
  text-align: left;
}

.faq-summary:focus-visible {
  outline: 2px solid var(--sv-red, #ff0000);
  outline-offset: -5px;
}

.faq-index {
  color: var(--sv-red, #ff0000);
  font-family: var(--service-font-data);
  font-size: 11px;
  font-weight: 800;
}

.faq-question {
  font-size: 18px;
  font-weight: 750;
  line-height: 1.35;
}

.faq-toggle {
  position: relative;
  width: 26px;
  height: 26px;
  color: var(--sv-red, #ff0000);
  transition: transform 0.4s var(--ease-out, ease);
}

.faq-toggle::before,
.faq-toggle::after {
  position: absolute;
  top: 12px;
  left: 5px;
  width: 16px;
  height: 2px;
  background: currentColor;
  content: "";
}

.faq-toggle::after {
  transform: rotate(90deg);
}

.faq-item.is-open .faq-toggle {
  transform: rotate(45deg);
}

.faq-answer {
  display: grid;
  grid-template-rows: 0fr;
  opacity: 0;
  visibility: hidden;
  transition:
    grid-template-rows 0.45s var(--ease-out, ease),
    opacity 0.3s var(--ease-out, ease),
    visibility 0s 0.45s;
}

.faq-item.is-open > .faq-answer {
  grid-template-rows: 1fr;
  opacity: 1;
  visibility: visible;
  transition:
    grid-template-rows 0.45s var(--ease-out, ease),
    opacity 0.35s 0.08s var(--ease-out, ease),
    visibility 0s;
}

.faq-answer__inner {
  min-height: 0;
  overflow: hidden;
  transform: translateY(-8px);
  transition: transform 0.45s var(--ease-out, ease);
}

.faq-item.is-open .faq-answer__inner {
  transform: none;
}

.faq-answer p {
  margin: 0;
  padding: 0 70px 24px 84px;
  color: var(--sv-gray-500, #6b7789);
  font-size: 15px;
  line-height: 1.65;
}

.related-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 48px;
  border-top: 1px solid rgba(255, 255, 255, 0.18);
  border-left: 1px solid rgba(255, 255, 255, 0.18);
}

.related-card {
  display: flex;
  min-height: 230px;
  flex-direction: column;
  padding: 26px;
  border-right: 1px solid rgba(255, 255, 255, 0.18);
  border-bottom: 1px solid rgba(255, 255, 255, 0.18);
  transition:
    background 0.25s ease,
    color 0.25s ease;
}

.related-card:hover,
.related-card:focus-visible {
  background: #fff;
  color: var(--sv-navy, #002f6c);
}

.related-card__index {
  color: var(--sv-red, #ff0000);
  font-family: var(--service-font-data);
  font-size: 10px;
  font-weight: 800;
}

.related-card h3 {
  margin: 34px 0 0;
  color: inherit;
  font-size: 20px;
  line-height: 1.25;
}

.related-card p {
  margin: 10px 0 0;
  color: var(--sv-on-navy-muted, #9fb0cc);
  font-size: 13px;
  line-height: 1.5;
  transition: color 0.25s ease;
}

.related-card:hover p,
.related-card:focus-visible p {
  color: var(--sv-gray-500, #6b7789);
}

.related-card__link {
  margin-top: auto;
  padding-top: 22px;
  font-size: 12px;
  font-weight: 800;
}

.related-card__link::after {
  margin-left: 8px;
  color: var(--sv-red, #ff0000);
  content: "↗";
}

.service-section--related-light .section-intro {
  max-width: 760px;
  margin-top: 14px;
  color: var(--sv-gray-500, #6b7789);
}

.service-section--related-light .related-grid {
  margin-top: 34px;
  border-color: rgba(0, 47, 108, 0.16);
}

.service-section--related-light .related-card {
  min-height: 210px;
  border-color: rgba(0, 47, 108, 0.16);
  background: rgba(255, 255, 255, 0.68);
  color: var(--sv-navy-ink, #0f2340);
  transition:
    background 180ms ease,
    box-shadow 180ms ease,
    transform 180ms ease;
}

.service-section--related-light .related-card p {
  margin-bottom: 24px;
  color: var(--sv-gray-500, #6b7789);
}

.service-section--related-light .related-card:hover,
.service-section--related-light .related-card:focus-visible {
  background: var(--sv-navy, #002f6c);
  box-shadow: 0 16px 36px rgba(15, 35, 64, 0.16);
  color: #fff;
  transform: translateY(-2px);
}

.service-section--related-light .related-card:hover p,
.service-section--related-light .related-card:focus-visible p {
  color: rgba(255, 255, 255, 0.72);
}

.service-section--related-light .related-card__link {
  display: inline-flex;
  width: max-content;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  margin-top: auto;
  padding: 0 16px;
  border: 1px solid var(--sv-navy, #002f6c);
  background: var(--sv-navy, #002f6c);
  color: #fff;
  transition:
    border-color 180ms ease,
    background 180ms ease,
    color 180ms ease;
}

.service-section--related-light .related-card__link::after {
  color: currentColor;
}

.service-section--related-light .related-card:hover .related-card__link,
.service-section--related-light .related-card:focus-visible .related-card__link {
  border-color: var(--sv-red, #ff0000);
  background: var(--sv-red, #ff0000);
  color: #fff;
}

.final-cta {
  position: relative;
  overflow: hidden;
  background: var(--sv-navy, #002f6c);
  color: #fff;
}

.final-cta::before {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(255, 255, 255, 0.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.055) 1px, transparent 1px);
  background-size: 54px 54px;
  content: "";
  pointer-events: none;
}

.final-cta__inner {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(350px, 0.85fr);
  gap: 70px;
  align-items: center;
  min-height: 360px;
  padding-block: 66px;
}

.final-cta h2 {
  max-width: 710px;
  margin: 0;
  font-family: var(--service-font-display);
  font-size: clamp(38px, 4.3vw, 58px);
  font-weight: 760;
  letter-spacing: -0.04em;
  line-height: 1.04;
  text-wrap: balance;
}

.final-cta h2 span {
  color: var(--sv-red, #ff0000);
}

.final-cta p {
  max-width: 630px;
  margin: 18px 0 0;
  color: var(--sv-on-navy-muted, #9fb0cc);
  font-size: 16px;
  line-height: 1.55;
}

.final-cta__actions {
  display: grid;
  gap: 12px;
}

.final-cta__actions .button {
  width: 100%;
}

.final-cta__actions .button--primary {
  border-color: #fff;
  background-color: #fff;
  color: var(--sv-navy, #002f6c);
}

.final-cta__actions .button--primary:hover,
.final-cta__actions .button--primary:focus-visible {
  border-color: var(--sv-red, #ff0000);
  color: #fff;
}

.final-cta__actions .button--secondary {
  border-color: rgba(255, 255, 255, 0.38);
  background-color: transparent;
  background-image: linear-gradient(90deg, #fff 50%, transparent 50%);
  color: #fff;
}

.final-cta__actions .button--secondary:hover,
.final-cta__actions .button--secondary:focus-visible {
  color: var(--sv-navy, #002f6c);
}

.site-footer {
  background: var(--sv-navy-deep, #011e46);
  color: #fff;
}

.footer-main {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr 1fr;
  gap: 42px;
  padding: 64px 0 44px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

.footer-about p {
  max-width: 310px;
  margin: 14px 0 0;
  color: var(--sv-on-navy-muted, #9fb0cc);
  font-size: 13px;
  line-height: 1.58;
}

.footer-title {
  margin: 2px 0 16px;
  color: #fff;
  font-family: var(--service-font-data);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.footer-links {
  display: grid;
  gap: 10px;
}

.footer-links a,
.footer-links span {
  color: var(--sv-on-navy-muted, #9fb0cc);
  font-size: 13px;
  line-height: 1.5;
}

.footer-links a {
  transition: color 0.18s ease;
}

.footer-links a:hover,
.footer-links a:focus-visible {
  color: var(--sv-red, #ff0000);
}

.footer-bottom {
  display: grid;
  gap: 12px;
  padding: 26px 0 32px;
  color: rgba(159, 176, 204, 0.72);
  font-size: 11px;
  line-height: 1.55;
}

.footer-legal {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 20px;
}

.footer-legal a:hover,
.footer-legal a:focus-visible {
  color: #fff;
}

/* Shared footer — mirrors Homepage.dc.html. */
.shared-footer {
  padding: 64px 0 32px;
  background: var(--sv-navy-deep, #011e46);
  color: #fff;
}

.shared-footer__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 24px;
}

[data-footer] {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr 1fr;
  gap: 40px;
  padding-bottom: 44px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

.shared-footer__brand {
  color: #fff;
  font-family: var(--service-font-display);
  font-size: 22px;
  font-weight: 800;
}

.shared-footer__brand span {
  color: var(--sv-red, #ff0000);
}

.shared-footer__about {
  max-width: 300px;
  margin: 12px 0 20px;
  color: var(--sv-on-navy-muted, #9fb0cc);
  font-size: 14px;
  line-height: 1.55;
}

[data-footer-social] {
  display: grid;
  grid-template-columns: repeat(5, 42px);
  gap: 8px;
  width: max-content;
  max-width: 100%;
}

[data-footer-social] a,
.shared-footer__messengers a {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border: 0;
  background: transparent;
  color: #fff;
  line-height: 0;
  transition: color 0.25s var(--ease-out, ease);
}

[data-footer-social] a:hover,
[data-footer-social] a:focus-visible,
.shared-footer__messengers a:hover,
.shared-footer__messengers a:focus-visible {
  background: transparent;
  color: var(--sv-red, #ff0000);
}

[data-footer-social] svg,
.shared-footer__messengers svg {
  display: block;
}

[data-footer-social] a[aria-label="Telegram"] svg,
.shared-footer__messengers a[aria-label="Написать в Telegram"] svg {
  width: 18px;
  height: 18px;
}

[data-footer-social] a[aria-label="ВКонтакте"] svg {
  width: 26px;
  height: 26px;
}

[data-footer-social] a[aria-label="YouTube"] svg {
  width: 20px;
  height: 20px;
}

[data-footer-social] a[aria-label="Дзен"] svg {
  width: 21px;
  height: 21px;
  transform: translateY(0.5px);
}

[data-footer-social] a[aria-label="Одноклассники"] svg {
  width: 24px;
  height: 24px;
}

.shared-footer__messengers .shared-footer__messenger-icon--max {
  width: 19px;
  height: 19px;
}

.shared-footer__title {
  margin-bottom: 16px;
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.shared-footer__links {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.shared-footer__links a,
.shared-footer__links span {
  color: var(--sv-on-navy-muted, #9fb0cc);
  font-size: 14px;
  line-height: 1.5;
}

.shared-footer__links a:hover,
.shared-footer__links a:focus-visible,
.shared-footer__legal-links a:hover,
.shared-footer__legal-links a:focus-visible {
  color: var(--sv-red, #ff0000);
}

.shared-footer__contacts {
  gap: 12px;
}

.shared-footer__contacts > a:first-child {
  color: #fff;
  font-size: 16px;
  font-weight: 700;
}

.shared-footer__messengers {
  display: flex;
  gap: 8px;
  width: max-content;
  max-width: 100%;
  padding-top: 4px;
}

.shared-footer__messengers a {
  color: #fff;
}

.shared-footer__messenger-icon--max {
  transform: none;
}

.shared-footer__legal-links {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 24px;
  padding: 28px 0;
}

.shared-footer__legal-links a {
  color: var(--sv-on-navy-muted, #9fb0cc);
  font-size: 13px;
}

.shared-footer__disclaimer,
.shared-footer__copyright {
  color: rgba(159, 176, 204, 0.7);
  font-size: 12.5px;
}

.shared-footer__disclaimer {
  max-width: 820px;
  margin: 0 0 12px;
  line-height: 1.55;
}

.shared-footer__copyright {
  margin: 0;
}

.back-to-top {
  position: fixed;
  right: 20px;
  bottom: 20px;
  z-index: 60;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  border: 1px solid rgba(0, 47, 108, 0.2);
  background: #fff;
  color: var(--sv-navy, #002f6c);
  box-shadow: 0 12px 28px rgba(15, 35, 64, 0.13);
  opacity: 0;
  pointer-events: none;
  transform: translateY(12px);
  transition:
    opacity 0.2s ease,
    transform 0.2s ease,
    background 0.2s ease,
    color 0.2s ease;
}

.back-to-top.is-visible {
  opacity: 1;
  pointer-events: auto;
  transform: none;
}

.back-to-top:hover,
.back-to-top:focus-visible {
  border-color: var(--sv-red, #ff0000);
  background: var(--sv-red, #ff0000);
  color: #fff;
}

.back-to-top svg {
  width: 20px;
  height: 20px;
}

.js .reveal {
  opacity: 0;
  transform: translateY(32px);
  transition:
    opacity 0.84s var(--ease-out, ease),
    transform 0.84s var(--ease-out, ease);
}

.js .reveal.in {
  opacity: 1;
  transform: none;
}

@media (max-width: 1080px) {
  .desktop-nav {
    display: none;
  }

  .menu-toggle {
    display: inline-flex;
  }

  .service-hero {
    --hero-enter-distance: 12px;
    --hero-product-enter-x: 18px;
    --hero-product-enter-y: 6px;

    min-height: 0;
  }

  .service-hero::before {
    width: 100%;
    height: 74%;
  }

  .service-hero > .container {
    min-height: 0;
  }

  .breadcrumbs {
    padding-top: 34px;
  }

  .hero-grid {
    grid-template-columns: 1fr;
    flex: 0 0 auto;
    min-height: 0;
  }

  .hero-copy {
    padding: 50px 0 54px;
  }

  .hero-visual {
    min-height: 390px;
    border-top: 0;
    border-left: 0;
  }

  .hero-product-orbit {
    right: -10px;
    bottom: -60px;
    width: 480px;
    height: 480px;
  }

  .hero-product-orbit::before {
    inset: 76.2px;
  }

  .hero-visual-wordmark {
    display: none;
  }

  .tachograph-figure {
    right: -70px;
    bottom: 70px;
    width: 700px;
  }

  .hero-proof {
    margin-top: 32px;
  }

  .scenario-layout,
  .price-layout,
  .faq-layout {
    gap: 56px;
  }

  .related-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 900px) {
  :root {
    --page-pad: 22px;
  }

  .header-divider,
  .header-max {
    display: none;
  }

  .scenario-layout,
  .price-layout,
  .process-head,
  .proof-layout,
  .faq-layout,
  .final-cta__inner {
    grid-template-columns: 1fr;
  }

  .faq-aside {
    position: static;
  }

  .faq-layout {
    gap: 52px;
  }

  .price-layout {
    gap: 48px;
  }

  .price-trust-cta {
    margin-top: 0;
  }

  .estimate-card {
    margin-top: 0;
  }

  .faq-panel {
    padding: 26px;
  }

  .process-head {
    gap: 18px;
  }

  .process-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .process-step:nth-child(3) {
    border-left: 0;
  }

  .process-step:nth-child(n + 3) {
    border-top: 1px solid rgba(0, 47, 108, 0.14);
  }

  .process-step:nth-child(3)::before {
    left: 0;
  }

  .final-cta__inner {
    gap: 36px;
  }

  .footer-main {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  :root {
    --header-height: 70px;
  }

  .header-phone span,
  .header-phone strong {
    display: none;
  }

  .header-phone {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    padding: 0;
    border: 1px solid rgba(0, 47, 108, 0.22);
  }

  .header-phone::before {
    width: 18px;
    height: 18px;
    background: currentColor;
    content: "";
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.13.96.36 1.9.7 2.81a2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.9.34 1.85.57 2.81.7A2 2 0 0 1 22 16.92z'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.13.96.36 1.9.7 2.81a2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.9.34 1.85.57 2.81.7A2 2 0 0 1 22 16.92z'/%3E%3C/svg%3E") center / contain no-repeat;
  }

  .vehicle-board {
    grid-template-columns: 1fr;
  }

  .vehicle {
    min-height: 0;
  }

  .vehicle__icon {
    height: 80px;
  }

  .work-list {
    margin-top: 48px;
  }

  .work-item {
    grid-template-columns: 44px minmax(0, 1fr);
    padding: 0 0 36px 42px;
  }

  .work-item:not(:last-child)::before,
  .work-item:not(:last-child)::after {
    left: 5px;
  }

  .work-item__index::before {
    left: -41px;
  }

  .work-route-anchor {
    left: 6px;
  }

  .price-geo {
    grid-template-columns: 1fr;
    gap: 10px;
    padding: 20px;
  }

  .proof-panel {
    grid-template-columns: 1fr;
  }

  .proof-stat {
    min-height: 0;
  }

  .related-grid {
    grid-template-columns: 1fr;
  }

  .related-card {
    min-height: 190px;
  }
}

@media (max-width: 600px) {
  :root {
    --page-pad: 16px;
  }

  .service-hero {
    --hero-product-enter-x: 12px;
  }

  #price::before {
    background-size: 54px 54px;
  }

  .brand-word {
    font-size: 18px;
  }

  .header-inner {
    gap: 10px;
  }

  .breadcrumbs {
    padding-top: 26px;
    font-size: 11px;
  }

  .hero-copy {
    padding: 38px 0 42px;
  }

  .eyebrow {
    margin-bottom: 14px;
    font-size: 10px;
  }

  .hero-title {
    font-size: clamp(34px, 10vw, 40px);
    letter-spacing: -0.036em;
    line-height: 1.04;
  }

  .hero-offer {
    grid-template-columns: 8px minmax(0, 1fr);
    gap: 14px;
    margin-top: 26px;
  }

  .hero-offer__mark {
    width: 8px;
    height: 8px;
    margin-top: 7px;
  }

  .hero-lede {
    font-size: 14px;
    line-height: 1.52;
  }

  .hero-lede strong {
    font-size: 16px;
    line-height: 1.4;
  }

  .hero-actions {
    display: grid;
    gap: 10px;
    margin-top: 26px;
  }

  .messenger-switch {
    width: 100%;
  }

  .button {
    width: 100%;
    min-height: 52px;
    padding-inline: 18px;
  }

  .hero-proof {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px 0;
    margin-top: 26px;
    padding-top: 17px;
  }

  .hero-proof span {
    padding-inline: 10px;
  }

  .hero-proof span:nth-child(odd) {
    padding-left: 0;
    border-left: 0;
  }

  .hero-proof span:nth-child(n + 3) {
    padding-top: 15px;
    border-top: 1px solid rgba(255, 255, 255, 0.18);
  }

  .hero-proof strong {
    font-size: 14px;
  }

  .hero-proof small {
    font-size: 9.5px;
  }

  .hero-visual {
    min-height: 360px;
  }

  .hero-product-orbit {
    left: 50%;
    right: auto;
    bottom: 0;
    width: min(360px, calc(100vw - 24px));
    height: min(360px, calc(100vw - 24px));
    translate: -50% 0;
  }

  .hero-product-orbit::before {
    inset: 57.6px;
  }

  .hero-orbit-slogan {
    display: none;
  }

  .tachograph-figure {
    left: 50%;
    right: auto;
    bottom: 74px;
    width: min(440px, calc(100vw + 16px));
    translate: -50% 0;
  }

  .service-section {
    padding: 72px 0;
  }

  .section-heading {
    font-size: clamp(34px, 10vw, 44px);
    letter-spacing: -0.035em;
  }

  .section-intro {
    margin-top: 18px;
    font-size: 15px;
    line-height: 1.55;
  }

  .scenario-layout,
  .price-layout,
  .faq-layout {
    gap: 40px;
  }

  .scenario {
    grid-template-columns: 30px minmax(0, 1fr);
    gap: 12px;
    padding: 20px 0;
  }

  .vehicle {
    padding: 22px 20px;
  }

  .work-item {
    grid-column: auto;
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 0;
    width: 100%;
    min-height: 0;
    margin: 0;
    padding: 0 0 34px 32px;
    border: 0;
    background: transparent;
  }

  .work-item:nth-child(n + 3) {
    grid-column: auto;
    min-height: 0;
  }

  .work-item:last-child {
    padding-bottom: 0;
  }

  .work-item:not(:last-child)::before,
  .work-item:not(:last-child)::after {
    left: 5px;
  }

  .work-item__index {
    font-size: 15px;
  }

  .work-item__index::before {
    left: -31px;
  }

  .work-route-anchor {
    left: 6px;
  }

  .work-item h3 {
    font-size: 18px;
  }

  .work-item p {
    font-size: 14px;
  }

  .work-list {
    grid-template-columns: 1fr;
    margin-top: 42px;
    padding: 0;
  }

  .era-registration .work-list {
    margin-top: 34px;
  }

  .era-registration .work-item {
    grid-template-columns: minmax(0, 1fr);
    row-gap: 8px;
    padding: 0 0 28px 24px;
  }

  .era-registration .work-item__index {
    width: max-content;
  }

  .era-registration .work-item__index::before {
    left: -23px;
  }

  .era-registration .work-item > div {
    min-width: 0;
    grid-column: 1;
  }

  .work-item,
  .work-item:nth-child(n + 3) {
    grid-column: auto;
  }

  .estimate-card__head,
  .estimate-form {
    padding-inline: 20px;
  }

  .form-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .process-grid {
    grid-template-columns: 1fr;
    margin-top: 42px;
  }

  .process-step,
  .process-step + .process-step {
    min-height: 0;
    padding: 26px 0;
    border-top: 0;
    border-left: 0;
    border-bottom: 1px solid rgba(0, 47, 108, 0.14);
  }

  .process-step::before,
  .process-step + .process-step::before,
  .process-step:nth-child(3)::before {
    top: -7px;
    left: 0;
  }

  .process-step h3 {
    margin-top: 18px;
  }

  .proof-stat {
    padding: 24px 20px;
  }

  .documents-geo {
    padding: 24px 20px;
  }

  .faq-summary {
    grid-template-columns: 30px minmax(0, 1fr) 26px;
    gap: 12px;
    min-height: 70px;
    padding: 16px 17px;
  }

  .faq-question {
    font-size: 16px;
  }

  .faq-answer p {
    padding: 0 18px 22px 59px;
    font-size: 14px;
  }

  .final-cta__inner {
    min-height: 0;
    padding-block: 58px;
  }

  .final-cta h2 {
    font-size: clamp(34px, 10vw, 44px);
  }

  .footer-main {
    grid-template-columns: 1fr;
    gap: 34px;
    padding-top: 50px;
  }

  .back-to-top {
    right: 14px;
    bottom: 14px;
  }
}

@media (max-width: 1080px) {
  [data-nav="desktop"],
  [data-mega-panel],
  [data-header-left] > div[aria-hidden] {
    display: none;
  }
}

@media (max-width: 900px) {
  [data-curtain-top] {
    gap: 16px;
    padding: 16px 20px;
  }

  [data-curtain-inner] {
    grid-template-columns: 1fr;
    gap: 28px;
    padding: 20px 20px 64px;
  }

  [data-curtain-services],
  [data-curtain-contact] {
    grid-column: 1;
    grid-row: auto;
  }

  [data-curtain-col-title] {
    font-size: 22px;
  }

  [data-header-phone-hours] {
    display: none;
  }

  [data-footer] {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 600px) {
  [data-header-inner] {
    width: 100%;
    max-width: 100%;
    padding: 0 14px;
    gap: 10px;
  }

  [data-header-left] {
    gap: 12px;
  }

  [data-header-actions] {
    display: flex;
    margin-left: auto;
  }

  [data-header-actions] > :not([data-burger]) {
    display: none;
  }

  [data-header-actions] [data-burger] {
    position: fixed;
    top: 14px;
    right: 14px;
    z-index: 81;
    display: inline-flex;
    width: 44px;
    height: 44px;
    margin: 0;
    border: 1px solid var(--sv-line, rgba(0, 46, 107, 0.14));
    background: #fff;
  }

  [data-mobile-phone] {
    position: fixed;
    top: 14px;
    right: 68px;
    z-index: 80;
    display: inline-flex;
    width: 44px;
    height: 44px;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--sv-line, rgba(0, 46, 107, 0.14));
    background: #fff;
    color: var(--sv-navy, #002f6c);
  }

  [data-curtain-services-head] {
    display: block;
  }

  [data-curtain-services-note] {
    margin-top: 12px;
    text-align: left;
  }

  [data-curtain-services-list] {
    grid-template-columns: 1fr;
  }

  [data-curtain-service-group] {
    min-height: 0;
    padding: 19px 20px;
  }

  [data-curtain-nav] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding: 10px;
  }

  [data-curtain-nav-label] {
    grid-column: 1 / -1;
  }

  [data-curtain-nav] [data-curtain-link] {
    font-size: 13px;
    white-space: normal;
  }

  [data-curtain-contact] {
    padding: 22px 18px;
  }

  [data-curtain-social] a {
    height: 48px;
  }

  [data-login-modal] {
    padding: 14px;
  }

  [data-login-dialog] {
    padding: 30px 22px 24px;
  }

  .callback-modal {
    align-items: end;
    padding: 0;
  }

  .callback-dialog {
    width: 100%;
    max-height: 100dvh;
    border-width: 1px 0 0;
    box-shadow: 0 -18px 48px rgba(0, 17, 42, 0.24);
    transform: translateY(24px);
  }

  .callback-dialog__intro {
    padding: 25px 64px 0 18px;
  }

  .callback-dialog__intro h2 {
    max-width: 280px;
    font-size: 24px;
  }

  .callback-form {
    padding: 20px 18px 22px;
  }

  .callback-progress {
    margin: 20px 18px 22px;
  }

  .callback-fallback {
    padding-inline: 18px;
  }

  [data-footer] {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 1080px) {
  .catalog-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 900px) {
  .mchd-resources {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .product-dialog__grid {
    display: flex;
    flex-direction: column;
    background: #f6f8fb;
  }

  .product-dialog__visual,
  .product-dialog__info {
    display: contents;
  }

  .product-dialog__image {
    order: 1;
    min-height: 230px;
    margin-top: 0;
    padding: 56px 32px 24px;
    border-bottom: 1px solid var(--sv-line, #dde3ec);
  }

  .product-dialog__kicker {
    order: 2;
    padding: 32px 32px 0;
  }

  .product-dialog__info h2 {
    order: 3;
    max-width: none;
    margin: 10px 32px 0;
  }

  .product-dialog__description {
    order: 4;
    max-width: none;
    margin: 16px 32px 0;
  }

  .product-dialog__spec-group {
    order: 5;
    margin: 28px 32px 0;
  }

  .product-dialog__note {
    order: 6;
    margin: 20px 32px 0;
  }

  .product-dialog__documents {
    order: 7;
    margin: 28px 0 0;
    padding: 24px 32px;
    background: #fff;
  }

  .product-dialog__actions {
    order: 8;
    margin: 0;
    padding: 0 32px 30px;
    background: #fff;
  }

  .product-dialog__document-list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .product-document {
    min-height: 64px;
    grid-template-columns: 38px minmax(0, 1fr);
    padding: 10px;
  }

  .product-document__type {
    width: 38px;
    height: 38px;
  }

}

@media (max-width: 700px) {
  .mchd-modal {
    align-items: stretch;
    padding: 0;
  }

  .mchd-dialog {
    width: 100%;
    max-height: 100dvh;
    min-height: 100dvh;
    border: 0;
    box-shadow: none;
  }

  .mchd-dialog__close {
    position: fixed;
    top: 12px;
    right: 12px;
  }

  .mchd-dialog__header {
    padding: 70px 18px 26px;
  }

  .mchd-dialog__header h2 {
    font-size: 30px;
  }

  .mchd-dialog__body {
    padding: 22px 16px 28px;
  }

  .mchd-file-rule {
    grid-template-columns: 26px minmax(0, 1fr);
    padding: 14px;
  }

  .mchd-owner-grid {
    grid-template-columns: 1fr;
    margin-top: 18px;
  }

  .mchd-owner-card {
    padding: 22px 18px 24px;
  }

  .mchd-resources {
    margin-top: 22px;
    padding-top: 22px;
  }

  .mchd-resource-list {
    grid-template-columns: 1fr;
  }

  .service-section.tachograph-catalog {
    padding: 52px 0 64px;
  }

  .catalog-head {
    gap: 10px;
    margin-bottom: 20px;
  }

  .catalog-label {
    font-size: 11px;
  }

  .catalog-price-note {
    font-size: 13px;
  }

  .catalog-grid {
    grid-template-columns: 1fr;
  }

  .catalog-card__visual {
    min-height: 190px;
    padding: 18px 18px 12px;
  }

  .catalog-card__visual img {
    width: min(100%, 280px);
  }

  .catalog-card__body {
    padding: 20px;
  }

  .catalog-card h3 {
    font-size: 21px;
  }

  .catalog-card__specs {
    margin-top: 16px;
  }

  .catalog-card__actions {
    padding-top: 20px;
  }

  .product-modal {
    align-items: stretch;
    padding: 0;
  }

  .product-dialog {
    width: 100%;
    max-height: 100dvh;
    min-height: 100dvh;
    border: 0;
    box-shadow: none;
  }

  .product-dialog__close {
    position: fixed;
    top: 12px;
    right: 12px;
  }

  .product-dialog__image {
    min-height: 180px;
    padding: 54px 16px 16px;
  }

  .product-dialog__documents {
    margin-top: 24px;
    padding: 22px 16px;
  }

  .product-dialog__document-list {
    grid-template-columns: 1fr;
  }

  .product-dialog__kicker {
    padding: 26px 16px 0;
  }

  .product-dialog__info h2 {
    margin-inline: 16px;
    font-size: 28px;
  }

  .product-dialog__description {
    margin: 14px 16px 0;
  }

  .product-dialog__spec-group {
    margin: 24px 16px 0;
  }

  .product-dialog__note {
    margin: 20px 16px 0;
  }

  .product-dialog__specs div {
    min-height: 44px;
    gap: 12px;
  }

  .product-dialog__actions {
    grid-template-columns: 1fr;
    padding: 0 16px 28px;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }

  .js .reveal {
    opacity: 1;
    transform: none;
  }

  .work-list .work-item:not(:last-child)::after {
    transform: scaleY(1);
  }

  .work-list .work-item__index::before {
    background: var(--sv-red, #ff0000);
    box-shadow: 0 0 0 4px rgba(255, 0, 0, 0.1);
  }

  .work-list .work-item__index {
    color: var(--sv-red, #ff0000);
  }

  .estimate-route.is-active .estimate-route__line,
  .estimate-card.is-route-highlighted .estimate-card__route-outline path {
    stroke-dashoffset: 0;
    opacity: 1;
    animation: none;
  }

  .price-match__title-accent,
  .era-installation__title-accent {
    background-position: 0 0;
    animation: none !important;
  }

  .js .service-hero .eyebrow,
  .js .service-hero .hero-offer,
  .js .service-hero .hero-lede,
  .js .service-hero .hero-actions,
  .js .service-hero .hero-proof,
  .js .service-hero .hero-title__fragment,
  .js .service-hero .tachograph-figure {
    opacity: 1 !important;
    filter: none !important;
    transform: none !important;
    animation: none !important;
  }

  .js .service-hero .hero-visual-wordmark {
    opacity: 1 !important;
    animation: none !important;
  }

  .js .service-hero .hero-product-orbit {
    opacity: 1 !important;
    transform: rotate(var(--hero-orbit-rotation)) !important;
    animation: none !important;
  }
}

/* Fuel savings calculator */

.fuel-calculator {
  overflow: hidden;
  border-top: 1px solid rgba(0, 47, 108, 0.12);
  background: var(--sv-ground, #eff2f7);
}

.fuel-calculator__header {
  max-width: 900px;
}

.fuel-calculator__header .eyebrow {
  color: var(--sv-red, #ff0000);
}

.fuel-calculator__header .section-heading {
  max-width: 860px;
  margin-top: 18px;
}

.fuel-calculator__header .section-intro {
  max-width: 820px;
}

.fuel-calculator__context {
  max-width: 820px;
  margin: 16px 0 0;
  color: #53647c;
  font-size: 14px;
  line-height: 1.6;
}

.fuel-calculator__shell {
  display: grid;
  grid-template-columns: minmax(360px, 0.82fr) minmax(0, 1.18fr);
  margin-top: 52px;
  border: 1px solid rgba(0, 47, 108, 0.16);
  background: #fff;
  box-shadow: 0 24px 60px rgba(15, 35, 64, 0.09);
}

.fuel-calculator__controls {
  padding: clamp(30px, 3.6vw, 46px);
  border-right: 1px solid rgba(0, 47, 108, 0.14);
  background: #fff;
}

.fuel-calculator__mode-label {
  display: block;
  margin-bottom: 10px;
  color: var(--sv-navy-ink, #0f2340);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.fuel-calculator__mode-switch {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border: 1px solid rgba(0, 47, 108, 0.24);
  background: #f5f7fb;
}

.fuel-calculator__mode-button {
  min-height: 52px;
  padding: 10px 16px;
  border: 0;
  background: transparent;
  color: #4f6077;
  font-size: 13px;
  font-weight: 780;
  line-height: 1.3;
  transition:
    background-color 180ms ease,
    color 180ms ease;
}

.fuel-calculator__mode-button + .fuel-calculator__mode-button {
  border-left: 1px solid rgba(0, 47, 108, 0.16);
}

.fuel-calculator__mode-button:hover,
.fuel-calculator__mode-button:focus-visible {
  color: var(--sv-navy, #002f6c);
}

.fuel-calculator__mode-button.is-active {
  background: var(--sv-navy, #002f6c);
  color: #fff;
}

.fuel-calculator__form {
  display: grid;
  gap: 0;
  margin-top: 30px;
}

.fuel-calculator__mode-fields {
  display: grid;
}

.fuel-calculator__mode-fields[hidden] {
  display: none;
}

.fuel-field {
  padding: 20px 0;
  border-top: 1px solid rgba(0, 47, 108, 0.11);
}

.fuel-calculator__form > .fuel-field:first-child {
  padding-top: 0;
  border-top: 0;
}

.fuel-field label {
  display: block;
  margin-bottom: 9px;
  color: var(--sv-navy-ink, #0f2340);
  font-size: 13px;
  font-weight: 780;
  line-height: 1.35;
}

.fuel-field__control {
  position: relative;
}

.fuel-field__control input {
  width: 100%;
  min-height: 54px;
  padding: 0 112px 0 15px;
  border: 1px solid rgba(0, 47, 108, 0.24);
  border-radius: 0;
  background: #fff;
  color: var(--sv-navy-ink, #0f2340);
  font-family: var(--service-font-data);
  font-size: 18px;
  font-weight: 750;
  font-variant-numeric: tabular-nums;
  transition:
    border-color 160ms ease,
    box-shadow 160ms ease;
}

.fuel-field__control input:hover {
  border-color: rgba(0, 47, 108, 0.42);
}

.fuel-field__control input:focus {
  border-color: var(--sv-navy, #002f6c);
  outline: none;
  box-shadow: 0 0 0 3px rgba(0, 47, 108, 0.1);
}

.fuel-field__control input[aria-invalid="true"] {
  border-color: var(--sv-red, #ff0000);
  box-shadow: 0 0 0 3px rgba(255, 0, 0, 0.08);
}

.fuel-field__control > span {
  position: absolute;
  top: 50%;
  right: 14px;
  color: #66768c;
  font-size: 12px;
  font-weight: 700;
  pointer-events: none;
  transform: translateY(-50%);
}

.fuel-field__help,
.fuel-field__error {
  margin: 8px 0 0;
  font-size: 11px;
  line-height: 1.5;
}

.fuel-field__help {
  color: #66768c;
}

.fuel-field__error {
  color: #c50000;
  font-weight: 700;
}

.fuel-field__error[hidden] {
  display: none;
}

.fuel-calculator__reset {
  justify-self: start;
  margin-top: 8px;
  border-color: rgba(0, 47, 108, 0.3);
  background-color: transparent;
  background-image: none;
  color: var(--sv-navy, #002f6c);
}

.fuel-calculator__reset:hover,
.fuel-calculator__reset:focus-visible {
  border-color: var(--sv-red, #ff0000);
  background-color: transparent;
  background-image: none;
  background-position: 100% 0;
  color: var(--sv-red, #ff0000);
}

.fuel-calculator__results {
  display: grid;
  align-content: start;
  gap: 34px;
  padding: clamp(30px, 3.6vw, 46px);
  background: #f7f9fc;
}

.fuel-calculator__subhead > span {
  display: block;
  margin-bottom: 7px;
  color: var(--sv-red, #ff0000);
  font-size: 11px;
  font-weight: 850;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.fuel-calculator__subhead h3,
.fuel-calculator__result-head h3,
.fuel-calculator__cta h3 {
  margin: 0;
  color: var(--sv-navy-ink, #0f2340);
  font-family: var(--service-font-display);
  letter-spacing: -0.025em;
}

.fuel-calculator__subhead h3 {
  font-size: clamp(23px, 2vw, 30px);
  line-height: 1.15;
}

.fuel-calculator__summary {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 22px 0 0;
  border-top: 1px solid rgba(0, 47, 108, 0.14);
  border-left: 1px solid rgba(0, 47, 108, 0.14);
}

.fuel-calculator__summary > div {
  min-width: 0;
  padding: 17px 18px;
  border-right: 1px solid rgba(0, 47, 108, 0.14);
  border-bottom: 1px solid rgba(0, 47, 108, 0.14);
  background: #fff;
}

.fuel-calculator__summary dt,
.fuel-calculator__primary-metrics dt,
.fuel-scenario dt {
  color: #66768c;
  font-size: 10px;
  font-weight: 760;
  letter-spacing: 0.05em;
  line-height: 1.35;
  text-transform: uppercase;
}

.fuel-calculator__summary dd,
.fuel-calculator__primary-metrics dd,
.fuel-scenario dd {
  margin: 7px 0 0;
  font-family: var(--service-font-data);
  font-variant-numeric: tabular-nums;
}

.fuel-calculator__summary dd {
  color: var(--sv-navy, #002f6c);
  font-size: clamp(18px, 1.6vw, 23px);
  font-weight: 820;
  line-height: 1.1;
}

.fuel-calculator__summary small,
.fuel-calculator__primary-metrics small {
  margin-left: 4px;
  color: inherit;
  font-size: 10px;
  font-weight: 700;
  opacity: 0.65;
}

.fuel-calculator__primary-result {
  position: relative;
  overflow: hidden;
  padding: clamp(26px, 3vw, 38px);
  border-top: 3px solid var(--sv-red, #ff0000);
  background: var(--sv-navy, #002f6c);
  color: #fff;
}

.fuel-calculator__result-head {
  display: flex;
  gap: 24px;
  align-items: flex-start;
  justify-content: space-between;
}

.fuel-calculator__badge {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 4px 9px;
  border: 1px solid rgba(255, 255, 255, 0.28);
  color: #fff;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.fuel-calculator__result-head h3 {
  max-width: 520px;
  margin-top: 14px;
  color: #fff;
  font-size: clamp(24px, 2.4vw, 34px);
  line-height: 1.08;
}

.fuel-calculator__rate {
  color: #fff;
  font-family: var(--service-font-data);
  font-size: clamp(34px, 4vw, 56px);
  font-weight: 850;
  letter-spacing: -0.05em;
  line-height: 0.95;
}

.fuel-calculator__annual {
  margin: 34px 0 0;
  color: #fff;
  font-family: var(--service-font-data);
  font-size: clamp(38px, 4.4vw, 64px);
  font-weight: 850;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.055em;
  line-height: 0.98;
}

.fuel-calculator__annual span {
  display: inline-block;
  margin-left: 8px;
  color: #c7d5e9;
  font-size: 0.32em;
  font-weight: 700;
  letter-spacing: 0;
}

.fuel-calculator__primary-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 30px 0 0;
  border-top: 1px solid rgba(255, 255, 255, 0.22);
}

.fuel-calculator__primary-metrics > div {
  min-width: 0;
  padding: 18px 14px 0 0;
}

.fuel-calculator__primary-metrics dt {
  color: #aebed4;
}

.fuel-calculator__primary-metrics dd {
  color: #fff;
  font-size: clamp(16px, 1.4vw, 20px);
  font-weight: 800;
  line-height: 1.2;
}

.fuel-calculator__payback {
  margin: 24px 0 0;
  padding-top: 18px;
  border-top: 1px solid rgba(255, 255, 255, 0.22);
  color: #d3deed;
  font-size: 13px;
  line-height: 1.55;
}

.fuel-calculator__scenario-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-top: 22px;
}

.fuel-scenario {
  min-width: 0;
  border: 1px solid rgba(0, 47, 108, 0.16);
  background: #fff;
}

.fuel-scenario--primary {
  border-color: rgba(0, 47, 108, 0.5);
  box-shadow: inset 0 3px 0 var(--sv-navy, #002f6c);
}

.fuel-scenario header {
  display: flex;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
  padding: 16px;
  border-bottom: 1px solid rgba(0, 47, 108, 0.12);
}

.fuel-scenario header strong {
  color: var(--sv-navy-ink, #0f2340);
  font-size: 13px;
}

.fuel-scenario header span {
  color: var(--sv-red, #ff0000);
  font-family: var(--service-font-data);
  font-size: 20px;
  font-weight: 850;
}

.fuel-scenario dl {
  margin: 0;
}

.fuel-scenario dl > div {
  padding: 13px 16px;
  border-bottom: 1px solid rgba(0, 47, 108, 0.09);
}

.fuel-scenario dl > div:last-child {
  border-bottom: 0;
}

.fuel-scenario dd {
  color: var(--sv-navy, #002f6c);
  font-size: 14px;
  font-weight: 800;
  line-height: 1.25;
}

.fuel-calculator__scenario-note {
  margin: 16px 0 0;
  color: #5e6e84;
  font-size: 12px;
  line-height: 1.55;
}

.fuel-calculator__status {
  min-height: 20px;
  margin: -12px 0 0;
  color: #66768c;
  font-size: 11px;
  line-height: 1.45;
}

.fuel-calculator__disclaimer {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  margin-top: 34px;
  padding: 26px 0;
  border-top: 1px solid rgba(0, 47, 108, 0.14);
  border-bottom: 1px solid rgba(0, 47, 108, 0.14);
}

.fuel-calculator__disclaimer p {
  margin: 0;
  color: #5c6c82;
  font-size: 11px;
  line-height: 1.65;
}

.fuel-calculator__cta {
  display: flex;
  gap: 40px;
  align-items: center;
  justify-content: space-between;
  margin-top: 34px;
  padding: 30px 34px;
  background: #e2e8f1;
}

.fuel-calculator__cta h3 {
  font-size: clamp(24px, 2.4vw, 34px);
  line-height: 1.1;
}

.fuel-calculator__cta p {
  max-width: 720px;
  margin: 10px 0 0;
  color: #53647c;
  font-size: 14px;
  line-height: 1.55;
}

.fuel-calculator__cta .button {
  flex: 0 0 auto;
  min-width: 238px;
}

@media (max-width: 1100px) {
  .fuel-calculator__shell {
    grid-template-columns: 1fr;
  }

  .fuel-calculator__controls {
    border-right: 0;
    border-bottom: 1px solid rgba(0, 47, 108, 0.14);
  }

  .fuel-calculator__form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 28px;
  }

  .fuel-calculator__mode-fields {
    display: contents;
  }

  .fuel-calculator__mode-fields[hidden] {
    display: none;
  }

  .fuel-calculator__reset {
    align-self: end;
    margin-bottom: 20px;
  }
}

@media (max-width: 860px) {
  .fuel-calculator__scenario-grid,
  .fuel-calculator__disclaimer {
    grid-template-columns: 1fr;
  }

  .fuel-calculator__scenario-grid {
    gap: 10px;
  }

  .fuel-scenario dl {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .fuel-scenario dl > div:nth-child(2n + 1) {
    border-right: 1px solid rgba(0, 47, 108, 0.09);
  }

  .fuel-calculator__disclaimer {
    gap: 14px;
  }

  .fuel-calculator__cta {
    align-items: flex-start;
    flex-direction: column;
  }
}

@media (max-width: 620px) {
  .fuel-calculator {
    padding-block: 76px;
  }

  .fuel-calculator__header .section-heading {
    font-size: clamp(34px, 10.5vw, 44px);
  }

  .fuel-calculator__header .section-intro {
    font-size: 16px;
  }

  .fuel-calculator__shell {
    margin-top: 38px;
  }

  .fuel-calculator__controls,
  .fuel-calculator__results {
    padding: 22px 18px;
  }

  .fuel-calculator__mode-switch {
    grid-template-columns: 1fr;
  }

  .fuel-calculator__mode-button + .fuel-calculator__mode-button {
    border-top: 1px solid rgba(0, 47, 108, 0.16);
    border-left: 0;
  }

  .fuel-calculator__form {
    display: grid;
    grid-template-columns: 1fr;
  }

  .fuel-field__control input {
    min-height: 52px;
    padding-right: 104px;
    font-size: 17px;
  }

  .fuel-calculator__reset {
    width: 100%;
    margin-bottom: 0;
  }

  .fuel-calculator__summary,
  .fuel-calculator__primary-metrics {
    grid-template-columns: 1fr;
  }

  .fuel-calculator__summary > div {
    padding: 15px 16px;
  }

  .fuel-calculator__primary-result {
    padding: 24px 20px;
  }

  .fuel-calculator__result-head {
    gap: 16px;
  }

  .fuel-calculator__rate {
    font-size: 34px;
  }

  .fuel-calculator__annual {
    margin-top: 28px;
    font-size: clamp(33px, 11vw, 46px);
  }

  .fuel-calculator__annual span {
    display: block;
    margin: 8px 0 0;
    font-size: 13px;
  }

  .fuel-calculator__primary-metrics > div {
    padding: 15px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.18);
  }

  .fuel-calculator__primary-metrics > div:last-child {
    border-bottom: 0;
  }

  .fuel-calculator__cta {
    padding: 24px 20px;
  }

  .fuel-calculator__cta .button {
    width: 100%;
    min-width: 0;
  }
}

/* Compact fuel calculator */

.fuel-calculator {
  padding-block: clamp(80px, 7vw, 112px);
  background:
    radial-gradient(circle at 12% 0%, rgba(54, 105, 177, 0.5), transparent 38%),
    linear-gradient(135deg, #071f45 0%, #0b356d 56%, #082654 100%);
}

.fuel-calculator__intro {
  max-width: 1050px;
  margin: 0 0 clamp(20px, 2vw, 28px);
}

.fuel-calculator__intro-label {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 8px;
  color: var(--sv-red, #ff0000);
  font-size: 11px;
  font-weight: 850;
  letter-spacing: 0.08em;
  line-height: 1.2;
  text-transform: uppercase;
}

.fuel-calculator__intro-label::before {
  flex: 0 0 7px;
  width: 7px;
  height: 7px;
  background: currentColor;
  content: "";
}

.fuel-calculator__intro > p:last-child {
  max-width: 980px;
  margin: 0;
  color: rgba(255, 255, 255, 0.88);
  font-size: clamp(14px, 1.2vw, 16px);
  line-height: 1.55;
}

.fuel-calculator__shell {
  grid-template-columns: minmax(380px, 0.82fr) minmax(0, 1.18fr);
  margin-top: 0;
  border-color: rgba(255, 255, 255, 0.26);
  box-shadow: 0 20px 48px rgba(1, 17, 43, 0.32);
}

.fuel-calculator__controls,
.fuel-calculator__results {
  padding: clamp(20px, 2.2vw, 28px);
}

.fuel-calculator__mode-label {
  margin-bottom: 7px;
  font-size: 11px;
}

.fuel-calculator__mode-button {
  min-height: 44px;
  padding: 8px 12px;
  font-size: 12px;
}

.fuel-calculator__form {
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
  margin-top: 0;
}

.fuel-calculator__mode-fields {
  display: contents;
}

.fuel-field {
  display: grid;
  grid-template-columns: minmax(122px, 0.9fr) minmax(80px, 1.1fr) minmax(126px, 0.8fr);
  gap: 0 12px;
  align-items: center;
  padding: 0;
  border-top: 0;
}

.fuel-field label {
  min-height: 0;
  margin: 0;
  font-size: 12px;
}

.fuel-field__control {
  grid-column: 3;
}

.fuel-field__control input {
  min-height: 44px;
  padding-right: 64px;
  font-size: 16px;
}

.fuel-field__control > span {
  right: 10px;
  font-size: 10px;
}

.fuel-range {
  grid-column: 2;
  grid-row: 1;
  margin: 0;
}

.fuel-range > input {
  --range-progress: 0%;
  width: 100%;
  min-height: 44px;
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  background: transparent;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
}

.fuel-range > input::-webkit-slider-runnable-track {
  width: 100%;
  height: 4px;
  border-radius: 0;
  background:
    linear-gradient(
      to right,
      var(--sv-red, #ff0000) 0,
      var(--sv-red, #ff0000) var(--range-progress),
      #d4ddeb var(--range-progress),
      #d4ddeb 100%
    );
}

.fuel-range > input::-webkit-slider-thumb {
  width: 18px;
  height: 18px;
  margin-top: -7px;
  border: 3px solid #fff;
  border-radius: 50%;
  background: var(--sv-red, #ff0000);
  box-shadow: 0 0 0 1px rgba(15, 35, 64, 0.34);
  appearance: none;
  -webkit-appearance: none;
  transition:
    box-shadow 160ms ease,
    transform 160ms ease;
}

.fuel-range > input::-moz-range-track {
  width: 100%;
  height: 4px;
  border-radius: 0;
  background: #d4ddeb;
}

.fuel-range > input::-moz-range-progress {
  height: 4px;
  border-radius: 0;
  background: var(--sv-red, #ff0000);
}

.fuel-range > input::-moz-range-thumb {
  width: 12px;
  height: 12px;
  border: 3px solid #fff;
  border-radius: 50%;
  background: var(--sv-red, #ff0000);
  box-shadow: 0 0 0 1px rgba(15, 35, 64, 0.34);
  transition:
    box-shadow 160ms ease,
    transform 160ms ease;
}

.fuel-range > input:focus-visible {
  outline: 2px solid var(--sv-navy, #002f6c);
  outline-offset: -7px;
}

.fuel-range > input:focus-visible::-webkit-slider-thumb {
  box-shadow:
    0 0 0 2px #fff,
    0 0 0 4px var(--sv-navy, #002f6c);
}

.fuel-range > input:focus-visible::-moz-range-thumb {
  box-shadow:
    0 0 0 2px #fff,
    0 0 0 4px var(--sv-navy, #002f6c);
}

.fuel-range__bounds {
  display: flex;
  justify-content: space-between;
  margin-top: -5px;
  color: #75849a;
  font-family: var(--service-font-data);
  font-size: 9px;
  font-variant-numeric: tabular-nums;
  font-weight: 650;
  line-height: 1.2;
}

.fuel-field__error {
  grid-column: 1 / -1;
  margin-top: 5px;
  font-size: 10px;
  line-height: 1.35;
}

.fuel-calculator__reset {
  grid-column: 1 / -1;
  justify-self: stretch;
  min-height: 44px;
  margin: 0;
}

.fuel-calculator__form-cta {
  grid-column: 1 / -1;
  width: 100%;
  min-height: 44px;
}

.fuel-calculator__form-notes {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  padding-top: 2px;
}

.fuel-calculator__form-notes p {
  margin: 0;
  color: #5c6c82;
  font-size: 10px;
  line-height: 1.5;
}

.fuel-calculator__results {
  gap: 12px;
}

.fuel-calculator__summary {
  margin: 0;
}

.fuel-calculator__summary > div {
  padding: 13px 15px;
}

.fuel-calculator__summary dd {
  font-size: clamp(17px, 1.4vw, 21px);
}

.fuel-calculator__primary-result {
  padding: clamp(20px, 2vw, 26px);
}

.fuel-calculator__result-head h2 {
  max-width: 520px;
  margin: 8px 0 0;
  color: #fff;
  font-family: var(--service-font-display);
  font-size: clamp(22px, 2vw, 30px);
  letter-spacing: -0.025em;
  line-height: 1.08;
}

.fuel-calculator__rate {
  font-size: clamp(32px, 3.2vw, 46px);
}

.fuel-calculator__annual {
  margin-top: 18px;
  font-size: clamp(34px, 3.5vw, 50px);
}

.fuel-calculator__primary-metrics {
  grid-template-columns: 1fr;
  margin-top: 18px;
}

.fuel-calculator__primary-metrics > div {
  padding-top: 12px;
}

.fuel-calculator__subhead h3 {
  font-size: clamp(20px, 1.6vw, 25px);
}

.fuel-calculator__scenario-grid {
  gap: 8px;
  margin-top: 12px;
}

.fuel-scenario {
  padding: 0;
  border-radius: 0;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
  appearance: none;
  transition:
    border-color 160ms ease,
    background-color 160ms ease,
    box-shadow 160ms ease,
    transform 120ms ease;
}

.fuel-scenario__head {
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: space-between;
  padding: 11px 12px;
  border-bottom: 1px solid rgba(0, 47, 108, 0.12);
}

.fuel-scenario__head strong {
  display: inline-flex;
  gap: 7px;
  align-items: center;
  color: var(--sv-navy-ink, #0f2340);
  font-size: 12px;
}

.fuel-scenario__head strong::before {
  flex: 0 0 7px;
  width: 7px;
  height: 7px;
  border: 1px solid rgba(0, 47, 108, 0.35);
  content: "";
}

.fuel-scenario__head > span {
  color: var(--sv-red, #ff0000);
  font-family: var(--service-font-data);
  font-size: 18px;
  font-weight: 850;
}

.fuel-scenario__values {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.fuel-scenario__values > span {
  min-width: 0;
  padding: 10px 12px;
}

.fuel-scenario__values > span + span {
  border-left: 1px solid rgba(0, 47, 108, 0.09);
}

.fuel-scenario__values small {
  display: block;
  color: #66768c;
  font-size: 9px;
  font-weight: 760;
  letter-spacing: 0.05em;
  line-height: 1.35;
  text-transform: uppercase;
}

.fuel-scenario__values strong {
  display: block;
  margin-top: 5px;
  color: var(--sv-navy, #002f6c);
  font-family: var(--service-font-data);
  font-size: 13px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  line-height: 1.25;
}

.fuel-scenario.is-active,
.fuel-scenario--primary {
  border-color: var(--sv-navy, #002f6c);
  background: #f3f6fb;
  box-shadow: inset 0 3px 0 var(--sv-red, #ff0000);
}

.fuel-scenario.is-active .fuel-scenario__head strong::before {
  border-color: var(--sv-red, #ff0000);
  background: var(--sv-red, #ff0000);
}

.fuel-scenario:focus-visible {
  outline: 2px solid var(--sv-red, #ff0000);
  outline-offset: 2px;
}

.fuel-scenario:active {
  transform: scale(0.985);
}

@media (hover: hover) {
  .fuel-range > input:hover::-webkit-slider-thumb {
    box-shadow:
      0 0 0 2px #fff,
      0 0 0 4px rgba(0, 47, 108, 0.24);
  }

  .fuel-range > input:hover::-moz-range-thumb {
    box-shadow:
      0 0 0 2px #fff,
      0 0 0 4px rgba(0, 47, 108, 0.24);
  }

  .fuel-scenario:hover {
    border-color: rgba(0, 47, 108, 0.5);
    background: #f7f9fc;
  }
}

.fuel-calculator__status {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

.fuel-calculator__disclaimer {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  margin-top: 18px;
  padding: 14px 0;
}

.fuel-calculator__disclaimer p {
  font-size: 10px;
  line-height: 1.5;
}

.fuel-calculator__cta {
  gap: 24px;
  margin-top: 18px;
  padding: 15px 20px;
}

.fuel-calculator__cta h3 {
  font-size: clamp(21px, 2vw, 28px);
}

.fuel-calculator__cta .button {
  min-width: 190px;
}

@media (max-width: 860px) {
  .fuel-calculator__shell {
    grid-template-columns: 1fr;
  }

  .fuel-calculator__controls {
    border-right: 0;
    border-bottom: 1px solid rgba(0, 47, 108, 0.14);
  }

  .fuel-calculator__scenario-grid {
    grid-template-columns: 1fr;
  }

  .fuel-calculator__disclaimer {
    grid-template-columns: 1fr;
    gap: 8px;
  }
}

@media (max-width: 620px) {
  .fuel-calculator {
    padding-block: 60px;
  }

  .fuel-calculator__controls,
  .fuel-calculator__results {
    padding: 18px 16px;
  }

  .fuel-calculator__form {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .fuel-field {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
  }

  .fuel-field label {
    grid-column: 1;
    grid-row: auto;
    min-height: 0;
    margin-bottom: 6px;
  }

  .fuel-field__control {
    grid-column: 1;
    grid-row: auto;
  }

  .fuel-range {
    grid-column: 1;
    grid-row: auto;
    margin-top: 4px;
  }

  .fuel-calculator__form-notes {
    grid-template-columns: 1fr;
  }

  .fuel-calculator__reset {
    grid-column: auto;
  }

  .fuel-calculator__summary,
  .fuel-calculator__primary-metrics {
    grid-template-columns: 1fr;
  }

  .fuel-calculator__result-head h2 {
    font-size: 22px;
  }

  .fuel-calculator__annual {
    margin-top: 16px;
    font-size: clamp(31px, 10vw, 42px);
  }

  .fuel-calculator__annual span {
    display: inline-block;
    margin: 0 0 0 6px;
    font-size: 0.34em;
  }

  .fuel-calculator__primary-metrics > div {
    padding: 11px 0 0;
    border-bottom: 0;
  }

  .fuel-calculator__cta {
    padding: 17px 16px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .fuel-calculator *,
  .fuel-calculator *::before,
  .fuel-calculator *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }
}

/* Service page: tachograph installation */
.js .installation-page .service-hero .hero-title__fragment {
  opacity: 0;
}

.js .installation-page.is-ready .service-hero .hero-title__fragment {
  opacity: 1;
  animation: driver-hero-title-reveal 480ms var(--hero-enter-ease) var(--hero-reveal-delay, 140ms) backwards;
}

.js .installation-page.is-ready .service-hero .hero-offer {
  animation: service-hero-enter-up 440ms var(--hero-enter-ease) 560ms backwards;
}

.js .installation-page.is-ready .service-hero .hero-actions {
  animation: service-hero-enter-up 440ms var(--hero-enter-ease) 760ms backwards;
}

.js .installation-page.is-ready .service-hero .hero-proof {
  animation: service-hero-enter-up 420ms var(--hero-enter-ease) 960ms backwards;
}

/* Service page: replacement of the SKZI / NKM unit */
.skzi-page .skzi-hero__grid {
  grid-template-columns: minmax(0, 1fr) minmax(420px, 1fr);
}

.skzi-page .skzi-hero .hero-copy {
  padding-right: 48px;
}

.skzi-page .skzi-hero .hero-title {
  max-width: 680px;
}

.skzi-page .skzi-hero .hero-title__line:last-child {
  white-space: normal;
}

.js .skzi-page .skzi-hero .hero-title__fragment {
  opacity: 0;
}

.js .skzi-page.is-ready .skzi-hero .hero-title__fragment {
  opacity: 1;
  animation: driver-hero-title-reveal 480ms var(--hero-enter-ease) var(--hero-reveal-delay, 140ms) backwards;
}

.js .skzi-page.is-ready .skzi-hero .hero-offer {
  animation: service-hero-enter-up 440ms var(--hero-enter-ease) 560ms backwards;
}

.js .skzi-page.is-ready .skzi-hero .hero-actions {
  animation: service-hero-enter-up 440ms var(--hero-enter-ease) 760ms backwards;
}

.js .skzi-page.is-ready .skzi-hero .hero-proof {
  animation: service-hero-enter-up 420ms var(--hero-enter-ease) 960ms backwards;
}

.skzi-page .skzi-hero__proof {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.skzi-page .skzi-hero__proof small {
  white-space: normal;
}

.skzi-page .skzi-hero__visual {
  position: relative;
  isolation: isolate;
  align-self: stretch;
  min-height: 720px;
}

.skzi-page .skzi-hero__figure {
  position: absolute;
  right: calc(clamp(-140px, calc((1200px - 100vw) / 2 + 20px), -30px) + 54.5px);
  bottom: 86.5px;
  z-index: 2;
  width: 531px;
  margin: 0;
}

.skzi-page .skzi-hero__figure img {
  display: block;
  width: 100%;
  height: auto;
  filter: drop-shadow(0 38px 42px rgba(0, 28, 65, 0.24));
}

.skzi-page .skzi-section-head {
  max-width: 760px;
  margin-bottom: 48px;
}

.skzi-page .skzi-section-head .section-intro {
  max-width: 720px;
}

.skzi-page #price .price-copy {
  align-self: start;
}

.skzi-page #price .price-trust-cta {
  margin-top: 32px;
}

.skzi-page #price .price-geo {
  position: relative;
  display: block;
  grid-column: auto;
  margin-top: 16px;
  padding: 17px 20px 18px 68px;
}

.skzi-page #price .price-geo strong {
  display: block;
  color: #fff;
  font-size: 13px;
  line-height: 1.35;
}

.skzi-page #price .price-geo strong::before {
  position: absolute;
  top: 20px;
  left: 20px;
  width: 32px;
  height: 32px;
}

.skzi-page #price .price-geo p {
  margin-top: 7px;
  font-size: 12.5px;
  line-height: 1.48;
}

.skzi-page .skzi-reasons__layout {
  display: block;
}

.skzi-page .skzi-reasons__primary {
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
  gap: clamp(44px, 5vw, 80px);
  align-items: stretch;
}

.skzi-page .skzi-reasons__media {
  overflow: hidden;
  aspect-ratio: 1;
  margin: 0;
  background: #e6edf5;
}

.skzi-page .skzi-reasons__media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.skzi-page .skzi-reasons__content {
  align-self: stretch;
  border: 0;
}

.skzi-page .skzi-reasons__content .section-intro {
  max-width: 640px;
  margin: 18px 0 0;
  font-size: 15px;
  line-height: 1.58;
}

.skzi-page .skzi-reasons__term--inline {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 16px;
  align-items: end;
  max-width: 640px;
  margin: 20px 0 0;
  padding: 0 0 18px;
  border-bottom: 1px solid rgba(0, 47, 108, 0.13);
  border-left: 0;
}

.skzi-page .skzi-reasons__term--inline strong {
  color: var(--sv-navy, #002f6c);
  font-size: clamp(38px, 3.2vw, 50px);
  letter-spacing: -0.055em;
  line-height: 0.95;
}

.skzi-page .skzi-reasons__term--inline span {
  max-width: none;
  padding-bottom: 2px;
  color: var(--sv-muted, #65748a);
  font-size: 14px;
  line-height: 1.45;
  white-space: nowrap;
}

.skzi-page .skzi-reasons__part {
  min-height: 100%;
  padding: 0;
}

.skzi-page .skzi-reasons__label {
  display: block;
  color: var(--sv-red, #ff0000);
  font-family: var(--service-font-data);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.skzi-page .skzi-reasons__content h3,
.skzi-page .skzi-reasons__early h3 {
  max-width: 640px;
  margin: 18px 0 12px;
  color: var(--sv-ink, #0d2340);
  font-size: clamp(25px, 2.2vw, 34px);
  letter-spacing: -0.03em;
  line-height: 1.14;
}

.skzi-page .skzi-reasons__steps,
.skzi-page .skzi-reasons__cases {
  margin: 0;
  padding: 0;
  list-style: none;
}

.skzi-page .skzi-reasons__steps li {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 14px;
  align-items: baseline;
  padding: 10px 0;
}

.skzi-page .skzi-reasons__steps span {
  color: var(--sv-red, #ff0000);
  font-family: var(--service-font-data);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.08em;
}

.skzi-page .skzi-reasons__steps p {
  margin: 0;
  color: var(--sv-ink, #0d2340);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.48;
}

.skzi-page .skzi-reasons__price {
  margin: 7px 0 0;
  color: var(--sv-muted, #65748a);
  font-size: 13px;
  line-height: 1.55;
}

.skzi-page .skzi-reasons__price strong {
  color: var(--sv-ink, #0d2340);
}

.skzi-page .skzi-reasons__early {
  margin-top: clamp(48px, 6vw, 80px);
  padding: 42px 46px 0;
  border-left: 3px solid var(--sv-red, #ff0000);
  background: #edf2f8;
}

.skzi-page .skzi-reasons__early .skzi-reasons__part {
  padding: 0;
}

.skzi-page .skzi-reasons__cases li {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-height: 150px;
  padding: 24px 28px;
  border-left: 1px solid rgba(0, 47, 108, 0.13);
}

.skzi-page .skzi-reasons__cases {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-top: 1px solid rgba(0, 47, 108, 0.13);
  border-bottom: 1px solid rgba(0, 47, 108, 0.13);
}

.skzi-page .skzi-reasons__cases li:first-child {
  padding-left: 0;
  border-left: 0;
}

.skzi-page .skzi-reasons__cases li:last-child {
  padding-right: 0;
}

.skzi-page .skzi-reasons__cases strong {
  color: var(--sv-ink, #0d2340);
  font-size: 15px;
  line-height: 1.45;
}

.skzi-page .skzi-reasons__cases span {
  color: var(--sv-muted, #65748a);
  font-size: 14px;
  line-height: 1.6;
}

.skzi-page .skzi-reasons__note {
  display: block;
  margin: 0;
  padding: 28px 0 38px;
}

.skzi-page .skzi-reasons__note p {
  margin: 0;
  color: var(--sv-muted, #65748a);
  font-size: 13px;
  line-height: 1.62;
}

.skzi-page .skzi-reasons__note strong {
  color: var(--sv-ink, #0d2340);
}

.skzi-page .skzi-reasons__note a {
  color: var(--sv-navy, #002f6c);
  font-weight: 800;
  text-decoration: underline;
  text-decoration-color: rgba(0, 47, 108, 0.42);
  text-underline-offset: 3px;
}

.skzi-page .skzi-documents {
  background-image:
    linear-gradient(rgba(0, 47, 108, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0, 47, 108, 0.035) 1px, transparent 1px);
  background-size: 54px 54px;
}

.skzi-page .skzi-documents__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border: 1px solid rgba(0, 47, 108, 0.16);
  background: rgba(255, 255, 255, 0.92);
}

.skzi-page .skzi-document-card {
  min-height: 410px;
  padding: 38px;
}

.skzi-page .skzi-document-card + .skzi-document-card {
  border-left: 1px solid rgba(0, 47, 108, 0.16);
}

.skzi-page .skzi-document-card__index {
  color: var(--sv-red, #ff0000);
  font-family: var(--service-font-data);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.skzi-page .skzi-document-card h3 {
  margin: 16px 0 24px;
  color: var(--sv-ink, #0d2340);
  font-size: 24px;
  line-height: 1.2;
}

.skzi-page .skzi-document-card ul,
.skzi-page .skzi-service-card__body ul {
  display: grid;
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.skzi-page .skzi-document-card li,
.skzi-page .skzi-service-card__body li {
  position: relative;
  padding-left: 18px;
  color: var(--sv-muted, #65748a);
  font-size: 14px;
  line-height: 1.55;
}

.skzi-page .skzi-document-card li::before,
.skzi-page .skzi-service-card__body li::before {
  position: absolute;
  top: 0.62em;
  left: 0;
  width: 5px;
  height: 5px;
  background: var(--sv-red, #ff0000);
  content: "";
}

.skzi-page .skzi-presence-note {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(150px, 0.55fr) minmax(220px, 0.8fr) minmax(0, 1.6fr) auto;
  align-items: center;
  gap: 26px;
  padding: 24px 30px;
  border-top: 1px solid rgba(0, 47, 108, 0.16);
  border-left: 4px solid var(--sv-red, #ff0000);
  background: var(--sv-navy, #002f6c);
  color: #fff;
}

.skzi-page .skzi-presence-note > span {
  color: #9fc2ea;
  font-family: var(--service-font-data);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.skzi-page .skzi-presence-note strong {
  font-size: 18px;
}

.skzi-page .skzi-presence-note p {
  margin: 0;
  color: rgba(255, 255, 255, 0.72);
  font-size: 13px;
  line-height: 1.55;
}

.skzi-page .skzi-presence-note a {
  min-width: 210px;
  padding: 13px 18px;
  border: 1px solid rgba(255, 255, 255, 0.72);
  color: #fff;
  font-size: 12px;
  font-weight: 800;
  text-align: center;
}

.skzi-page .skzi-presence-note a:hover,
.skzi-page .skzi-presence-note a:focus-visible {
  border-color: #fff;
  background: #fff;
  color: var(--sv-navy, #002f6c);
}

.skzi-page .skzi-extra {
  background:
    linear-gradient(rgba(0, 47, 108, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0, 47, 108, 0.035) 1px, transparent 1px),
    #e9edf4;
  background-size: 56px 56px;
}

.skzi-page .skzi-extra .skzi-section-head {
  max-width: 930px;
  margin-bottom: 42px;
}

.skzi-page .skzi-extra .section-intro {
  max-width: 790px;
}

.skzi-page .skzi-extra__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px;
}

.skzi-page .skzi-service-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 100%;
  overflow: hidden;
  border: 1px solid rgba(0, 47, 108, 0.15);
  background: #fff;
  box-shadow: 0 18px 42px rgba(0, 35, 79, 0.07);
  transition: border-color 220ms ease, box-shadow 220ms ease;
}

@media (hover: hover) and (pointer: fine) {
  .skzi-page .skzi-service-card:hover {
    border-color: rgba(0, 47, 108, 0.32);
    box-shadow: 0 24px 52px rgba(0, 35, 79, 0.12);
  }
}

.skzi-page .skzi-service-card__visual {
  position: relative;
  display: grid;
  overflow: hidden;
  place-items: center;
  aspect-ratio: 16 / 10;
  border-bottom: 1px solid rgba(0, 47, 108, 0.16);
  background: #00234f;
}

.skzi-page .skzi-service-card__visual img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.skzi-page .skzi-service-card__body {
  display: flex;
  flex: 1;
  flex-direction: column;
  align-items: flex-start;
  padding: clamp(28px, 3vw, 42px);
}

.skzi-page .skzi-service-card__body > span {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--sv-red, #ff0000);
  font-family: var(--service-font-data);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.skzi-page .skzi-service-card__body > span b {
  padding-right: 10px;
  border-right: 1px solid rgba(0, 47, 108, 0.22);
  color: var(--sv-navy, #002f6c);
  font: inherit;
}

.skzi-page .skzi-service-card__body h3 {
  max-width: 520px;
  margin: 14px 0 18px;
  color: var(--sv-ink, #0d2340);
  font-size: clamp(25px, 2.1vw, 32px);
  letter-spacing: -0.025em;
  line-height: 1.15;
}

.skzi-page .skzi-service-card__body > p {
  max-width: 560px;
  margin: 0 0 24px;
  color: var(--sv-muted, #65748a);
  font-size: 15px;
  line-height: 1.65;
}

.skzi-page .skzi-service-card__body > ul {
  margin-bottom: 32px;
}

.skzi-page .skzi-service-card__body > a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  margin-top: auto;
  padding: 12px 18px;
  border: 1px solid rgba(0, 47, 108, 0.42);
  color: var(--sv-navy, #002f6c);
  font-size: 13px;
  font-weight: 800;
  transition: border-color 180ms ease, background-color 180ms ease, color 180ms ease;
}

.skzi-page .skzi-service-card__body > a::after {
  margin-left: 10px;
  content: "→";
}

.skzi-page .skzi-service-card__body > a:hover,
.skzi-page .skzi-service-card__body > a:focus-visible {
  border-color: var(--sv-navy, #002f6c);
  background: var(--sv-navy, #002f6c);
  color: #fff;
}

@media (max-width: 1080px) {
  .skzi-page .skzi-hero__grid {
    grid-template-columns: 1fr;
  }

  .skzi-page .skzi-hero .hero-copy {
    padding-right: 0;
  }

  .skzi-page .skzi-hero__visual {
    min-height: 440px;
  }

  .skzi-page .skzi-hero__figure {
    right: 5px;
    bottom: -45px;
    width: 450px;
  }

  .skzi-page .skzi-presence-note {
    grid-template-columns: minmax(0, 0.7fr) minmax(0, 1fr);
  }

  .skzi-page .skzi-presence-note p {
    grid-column: 1 / -1;
  }

  .skzi-page .skzi-presence-note a {
    grid-column: 1 / -1;
    justify-self: start;
  }
}

@media (max-width: 900px) {
  .skzi-page .skzi-reasons__primary {
    grid-template-columns: 1fr;
    gap: 34px;
  }

  .skzi-page .skzi-reasons__media {
    width: min(100%, 680px);
  }

  .skzi-page .skzi-reasons__content .section-intro,
  .skzi-page .skzi-reasons__term--inline {
    max-width: 680px;
  }

  .skzi-page .skzi-reasons__content .section-intro,
  .skzi-page .skzi-reasons__steps p,
  .skzi-page .skzi-reasons__cases strong,
  .skzi-page .skzi-reasons__cases span,
  .skzi-page .skzi-reasons__price {
    font-size: 16px;
  }

  .skzi-page .skzi-reasons__note p {
    font-size: 15px;
  }

  .skzi-page .skzi-reasons__early {
    padding: 38px 34px 0;
  }

  .skzi-page .skzi-reasons__cases,
  .skzi-page .skzi-reasons__note {
    grid-template-columns: 1fr;
  }

  .skzi-page .skzi-reasons__cases li,
  .skzi-page .skzi-reasons__cases li:first-child,
  .skzi-page .skzi-reasons__cases li:last-child {
    min-height: 0;
    padding: 20px 0;
    border-top: 1px solid rgba(0, 47, 108, 0.11);
    border-left: 0;
  }

  .skzi-page .skzi-reasons__cases li:first-child {
    border-top: 0;
  }

  .skzi-page .skzi-documents__grid {
    grid-template-columns: 1fr;
  }

  .skzi-page .skzi-document-card {
    min-height: 0;
  }

  .skzi-page .skzi-document-card + .skzi-document-card {
    border-top: 1px solid rgba(0, 47, 108, 0.16);
    border-left: 0;
  }

  .skzi-page .skzi-extra__grid {
    grid-template-columns: 1fr;
    max-width: 760px;
  }
}

@media (max-width: 600px) {
  .skzi-page .skzi-hero__proof {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .skzi-page .skzi-hero__visual {
    min-height: 350px;
  }

  .skzi-page .skzi-hero__figure {
    right: 50%;
    bottom: clamp(17px, 6.4vw, 24px);
    width: min(297px, calc(90vw - 25.2px));
    translate: 50% 0;
  }

  .skzi-page .skzi-section-head {
    margin-bottom: 30px;
  }

  .skzi-page .skzi-reasons__primary {
    gap: 30px;
  }

  .skzi-page .skzi-reasons__content .section-intro {
    margin-top: 18px;
  }

  .skzi-page .skzi-reasons__term--inline {
    gap: 12px;
    margin-top: 20px;
    padding-bottom: 18px;
  }

  .skzi-page .skzi-reasons__term--inline strong {
    font-size: 40px;
  }

  .skzi-page .skzi-reasons__term--inline span {
    font-size: 14px;
  }

  .skzi-page .skzi-reasons__part {
    padding: 0;
  }

  .skzi-page .skzi-reasons__content h3,
  .skzi-page .skzi-reasons__early h3 {
    font-size: 25px;
  }

  .skzi-page .skzi-reasons__steps li {
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 12px;
    padding: 13px 0;
  }

  .skzi-page .skzi-reasons__steps p,
  .skzi-page .skzi-reasons__cases strong {
    font-size: 16px;
  }

  .skzi-page .skzi-reasons__cases li {
    gap: 8px;
    padding: 18px 0;
  }

  .skzi-page .skzi-reasons__cases span,
  .skzi-page .skzi-reasons__price {
    font-size: 16px;
  }

  .skzi-page .skzi-reasons__note {
    gap: 16px;
    margin-top: 0;
    padding: 24px 0 30px;
  }

  .skzi-page .skzi-reasons__early {
    margin-top: 44px;
    padding: 30px 20px 0;
  }

  .skzi-page .skzi-document-card {
    padding: 28px 22px;
  }

  .skzi-page .skzi-document-card h3 {
    font-size: 22px;
  }

  .skzi-page .skzi-presence-note {
    grid-template-columns: 1fr;
    gap: 14px;
    padding: 24px 20px;
  }

  .skzi-page .skzi-presence-note p,
  .skzi-page .skzi-presence-note a {
    grid-column: auto;
  }

  .skzi-page .skzi-presence-note a {
    width: 100%;
    min-width: 0;
  }

  .skzi-page .skzi-service-card__visual {
    aspect-ratio: 4 / 3;
  }

  .skzi-page .skzi-service-card__body {
    padding: 30px 22px 34px;
  }

  .skzi-page .skzi-service-card__body h3 {
    font-size: 25px;
  }

  .skzi-page .skzi-service-card__body > a {
    width: 100%;
  }
}

@media (max-width: 420px) {
  .skzi-page .skzi-reasons__term--inline {
    grid-template-columns: 1fr;
    gap: 8px;
    align-items: start;
  }
}

/* Driver card SKZI page */
.driver-card-page {
  --driver-ink: #0b1f39;
  --driver-navy: #002f6c;
  --driver-blue: #0a5bd8;
  --driver-blue-deep: #073b8d;
  --driver-cyan: #5ec6ff;
  --driver-red: #ff0000;
  --driver-line: rgba(11, 31, 57, 0.14);
  --driver-ease-out: cubic-bezier(0.16, 1, 0.3, 1);
}

.driver-card-page [data-mega-card][aria-current="page"],
.driver-card-page [data-curtain-link][aria-current="page"] {
  color: var(--driver-blue);
}

.driver-card-page .driver-card-hero {
  min-height: min(880px, calc(100svh - 70px));
  overflow: hidden;
}

.driver-card-page .driver-card-hero .hero-grid {
  grid-template-columns: minmax(0, 1.02fr) minmax(410px, 0.98fr);
  gap: clamp(44px, 7vw, 104px);
  min-height: clamp(650px, 78vh, 760px);
}

.driver-card-page .driver-card-hero .hero-title {
  max-width: 760px;
}

.driver-card-page .driver-card-hero .hero-copy {
  padding-right: 32px;
}

.driver-card-page .driver-card-hero .hero-title__line:first-child {
  white-space: nowrap;
}

.driver-card-page .driver-card-hero .hero-lede {
  max-width: 680px;
  margin-top: 24px;
}

.js .driver-card-page .driver-card-hero .hero-title__fragment,
.js .driver-card-page .driver-card-hero .hero-lede {
  opacity: 0;
}

.js .driver-card-page.is-ready .driver-card-hero .hero-title__fragment {
  opacity: 1;
  animation: driver-hero-title-reveal 480ms var(--hero-enter-ease) var(--hero-reveal-delay, 140ms) backwards;
}

.js .driver-card-page.is-ready .driver-card-hero .hero-lede {
  opacity: 1;
  animation: service-hero-enter-up 440ms var(--hero-enter-ease) 560ms backwards;
}

.js .driver-card-page.is-ready .driver-card-hero .hero-actions {
  animation: service-hero-enter-up 440ms var(--hero-enter-ease) 760ms backwards;
}

.js .driver-card-page.is-ready .driver-card-hero .hero-proof {
  animation: service-hero-enter-up 420ms var(--hero-enter-ease) 960ms backwards;
}

@keyframes driver-hero-title-reveal {
  from {
    opacity: 0;
    transform: translate3d(0, 72%, 0);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

.driver-card-page .driver-card-hero .hero-proof {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  width: min(780px, 100%);
  max-width: 780px;
}

.driver-card-page .driver-card-hero .hero-proof span {
  min-width: 0;
}

.driver-card-page .driver-card-hero .hero-proof small {
  overflow: visible;
  text-overflow: clip;
  white-space: normal;
}

.driver-card-visual {
  position: relative;
  display: grid;
  place-items: center;
  min-height: 560px;
  isolation: isolate;
  perspective: 1200px;
  perspective-origin: 50% 50%;
}

.driver-card-page .driver-card-visual .hero-product-orbit {
  position: absolute;
  left: 50%;
  right: auto;
  bottom: 50%;
  width: min(610px, 112%);
  height: auto;
  aspect-ratio: 1;
  translate: -50% 50%;
}

.js .driver-card-page .driver-card-visual .hero-product-orbit {
  opacity: 0;
  transform: rotate(-4deg) scale(0.92);
  animation: none;
  transition: none;
  will-change: opacity, transform;
}

.js .driver-card-page.is-ready .driver-card-visual .hero-product-orbit {
  opacity: 1;
  transform: none;
  animation: service-hero-orbit-in 700ms var(--hero-enter-ease) 160ms backwards;
}

.driver-card-visual__media {
  --card-edge-left: calc(100% - 1px);
  --card-edge-opacity: 0;
  --card-edge-radius: 0 6px 6px 0;
  --card-glare-opacity: 0;
  --card-glare-position: 50%;
  position: relative;
  z-index: 2;
  width: min(519px, 95%);
  transform: none;
  transform-box: border-box;
  transform-origin: 50% 50%;
  transform-style: preserve-3d;
  filter: none;
}

.driver-card-visual__media::before,
.driver-card-visual__media::after {
  position: absolute;
  inset: 0;
  pointer-events: none;
  content: "";
  -webkit-mask-image: url("hero-slider/driver-card-uraltrackpro.webp?v=20260723-2");
  -webkit-mask-position: center;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-image: url("hero-slider/driver-card-uraltrackpro.webp?v=20260723-2");
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: 100% 100%;
}

.driver-card-visual__media::before {
  inset: 2.5% auto 2.5% var(--card-edge-left);
  z-index: 0;
  width: 12px;
  border-radius: var(--card-edge-radius);
  background: linear-gradient(90deg, #f8fafc 0%, #dfe5eb 100%);
  opacity: var(--card-edge-opacity);
  transform: rotateY(90deg);
  transform-origin: 0 50%;
  -webkit-mask-image: none;
  mask-image: none;
}

.driver-card-visual__media::after {
  z-index: 3;
  background:
    linear-gradient(
      112deg,
      transparent 10%,
      rgba(226, 241, 255, 0.12) 28%,
      rgba(255, 255, 255, 0.96) 43%,
      rgba(195, 226, 255, 0.52) 53%,
      rgba(255, 255, 255, 0.2) 64%,
      transparent 84%
    );
  background-position: var(--card-glare-position) 50%;
  background-repeat: no-repeat;
  background-size: 68% 190%;
  mix-blend-mode: screen;
  opacity: var(--card-glare-opacity);
  transform: translateZ(2px);
}

.driver-card-visual__media img {
  display: block;
  position: relative;
  z-index: 2;
  width: 100%;
  height: auto;
  backface-visibility: hidden;
}

@media (hover: hover) and (pointer: fine) {
  .driver-card-visual__media[data-driver-card-tilt] {
    will-change: transform;
  }
}

.driver-section-heading {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(300px, 0.75fr);
  gap: clamp(40px, 7vw, 112px);
  align-items: end;
  margin-bottom: clamp(42px, 6vw, 72px);
}

.driver-section-heading .section-intro {
  margin: 0;
}

.driver-card-types {
  padding: 72px 0 88px;
  background: var(--sv-ground, #eff2f7);
}

.driver-card-catalog .catalog-card__visual {
  min-height: 250px;
  padding: 26px 24px 20px;
  background: #fff;
}

.driver-card-catalog .catalog-card__visual img.driver-card-catalog__image {
  width: min(100%, 340px);
  filter:
    drop-shadow(0 5px 3px rgba(0, 24, 58, 0.14))
    drop-shadow(0 18px 12px rgba(0, 24, 58, 0.2));
}

.driver-card-catalog .catalog-card--featured .catalog-card__visual {
  background: transparent;
}

.driver-card-catalog .catalog-card--featured:hover::after,
.driver-card-catalog .catalog-card--featured:focus-within::after {
  border-color: transparent;
}

.driver-card-catalog .catalog-card--featured .catalog-card__details {
  background-color: transparent;
  color: #fff;
}

.driver-card-catalog .catalog-card__specs div {
  grid-template-columns: minmax(0, 0.82fr) minmax(0, 1.18fr);
}

.driver-card-catalog__price dd {
  display: grid;
  min-height: 50px;
  align-content: center;
  justify-items: end;
  gap: 2px;
  color: var(--sv-navy-ink, #0f2340);
  font-variant-numeric: tabular-nums;
}

.driver-card-catalog__price dd strong {
  font-size: 13px;
  line-height: 1.2;
}

.driver-card-catalog__price dd small {
  color: #68798d;
  font-size: 9.5px;
  font-weight: 650;
  line-height: 1.35;
}

.driver-card-price-line {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}

.driver-card-price-help {
  position: relative;
  display: inline-flex;
}

.driver-card-price-help > button {
  display: grid;
  width: 24px;
  height: 24px;
  place-items: center;
  padding: 0;
  border: 1px solid rgba(0, 47, 108, 0.28);
  border-radius: 50%;
  background: #fff;
  color: var(--sv-navy, #002f6c);
  font: inherit;
  font-size: 11px;
  font-weight: 800;
  line-height: 1;
  cursor: help;
}

.driver-card-price-help > button::after {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 44px;
  height: 44px;
  content: "";
  transform: translate(-50%, -50%);
}

.driver-card-price-help > button:hover,
.driver-card-price-help > button:focus-visible {
  border-color: var(--sv-navy, #002f6c);
  background: var(--sv-navy, #002f6c);
  color: #fff;
}

.driver-card-price-help > button:focus-visible {
  outline: 3px solid rgba(0, 47, 108, 0.22);
  outline-offset: 3px;
}

.driver-card-price-tooltip {
  position: absolute;
  z-index: 8;
  right: 0;
  bottom: calc(100% + 10px);
  width: 232px;
  padding: 11px 12px;
  background: var(--sv-navy-ink, #0f2340);
  color: #fff;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.45;
  text-align: left;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(4px);
  box-shadow: 0 12px 28px rgba(0, 17, 42, 0.22);
  transition:
    opacity 160ms ease,
    transform 160ms ease,
    visibility 160ms ease;
}

.driver-card-price-help:hover .driver-card-price-tooltip,
.driver-card-price-help:focus-within .driver-card-price-tooltip {
  opacity: 1;
  visibility: visible;
  transform: none;
}

.driver-card-catalog .catalog-card__actions a,
.driver-card-catalog .catalog-card__actions button {
  transition:
    border-color 180ms ease,
    background-position 0.48s var(--driver-ease-out, ease),
    color 180ms ease,
    translate 0.1s ease,
    scale 0.1s ease;
}

.driver-card-page .catalog-card__details {
  background-image: none;
}

.driver-card-page .catalog-card__details:hover,
.driver-card-page .catalog-card__details:focus-visible {
  border-color: var(--sv-red, #ff0000);
  background-image: none;
  background-position: 100% 0;
  color: var(--sv-red, #ff0000);
}

.driver-card-page .catalog-card--featured .catalog-card__details {
  border-color: #fff;
  background-color: transparent;
  background-image: none;
  color: #fff;
}

.driver-card-page .catalog-card--featured .catalog-card__details:hover,
.driver-card-page .catalog-card--featured .catalog-card__details:focus-visible {
  border-color: var(--sv-red, #ff0000);
  background-color: transparent;
  background-image: none;
  color: var(--sv-red, #ff0000);
}

.driver-card-documents-modal .product-dialog__image img {
  filter: none;
}

.driver-card-documents-modal .product-dialog {
  width: min(1160px, 100%);
}

.driver-card-documents-modal .product-dialog__grid {
  grid-template-columns: minmax(320px, 0.76fr) minmax(0, 1.24fr);
  background: #fff;
}

.driver-card-documents-modal .product-dialog__visual {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 54px 40px;
  border-right: 1px solid var(--sv-line, #dde3ec);
  background: #fff;
}

.driver-card-documents-modal .product-dialog__image {
  min-height: 0;
  margin-top: 0;
  padding: 0;
}

.driver-card-documents-modal .product-dialog__image img {
  width: min(100%, 420px);
}

.driver-card-documents-modal .product-dialog__info {
  justify-content: center;
  padding: 54px 72px 48px 44px;
  background: #fff;
}

.driver-card-documents-modal .product-dialog__info h2 {
  font-size: clamp(30px, 3vw, 40px);
}

.driver-card-documents-modal .product-dialog__description {
  max-width: 620px;
  font-size: 14px;
  line-height: 1.6;
}

.product-dialog__requirements {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: minmax(0, 1.18fr) minmax(280px, 0.82fr);
  gap: 24px 40px;
  margin-top: 0;
  padding: 32px 40px 24px;
  border-top: 1px solid var(--sv-line, #dde3ec);
  background: #f6f8fb;
}

.product-requirements__intro,
.product-requirements__outro {
  margin: 0;
  color: var(--sv-gray-500, #6b7789);
  font-size: 12.5px;
  line-height: 1.58;
}

.product-requirements__intro {
  grid-column: 1 / -1;
  max-width: 940px;
  color: var(--sv-navy-ink, #0f2340);
  font-size: 13px;
}

.product-requirements__section {
  min-width: 0;
  padding-top: 18px;
  border-top: 1px solid rgba(0, 47, 108, 0.16);
}

.product-requirements__section + .product-requirements__section {
  padding-left: 40px;
  border-left: 1px solid rgba(0, 47, 108, 0.14);
}

.product-requirements__section h3 {
  position: relative;
  margin: 0;
  padding-left: 14px;
  color: var(--sv-navy-ink, #0f2340);
  font-family: var(--service-font-body);
  font-size: 14px;
  font-weight: 750;
  line-height: 1.35;
}

.product-requirements__section h3::before {
  position: absolute;
  top: 0.15em;
  bottom: 0.15em;
  left: 0;
  width: 3px;
  background: var(--sv-red, #ff0000);
  content: "";
}

.product-requirements__section ul {
  display: grid;
  gap: 9px;
  margin: 16px 0 0;
  padding: 0;
  list-style: none;
}

.product-requirements__section li {
  position: relative;
  padding-left: 18px;
  color: var(--sv-navy-ink, #0f2340);
  font-size: 12px;
  line-height: 1.45;
}

.product-requirements__section li::before {
  position: absolute;
  top: 0.58em;
  left: 0;
  width: 6px;
  height: 2px;
  background: var(--sv-red, #ff0000);
  content: "";
}

.product-requirements__outro {
  grid-column: 1 / -1;
  padding: 12px 14px;
  border-left: 2px solid var(--sv-red, #ff0000);
  background: #fff;
  color: var(--sv-navy-ink, #0f2340);
}

.driver-card-documents-modal .product-dialog__actions {
  grid-column: 1 / -1;
  grid-template-columns: minmax(220px, 280px) minmax(190px, 230px);
  justify-content: center;
  margin-top: 0;
  padding: 0 40px 32px;
  background: #f6f8fb;
}

@media (max-width: 900px) {
  .driver-card-documents-modal .product-dialog__grid {
    display: flex;
    flex-direction: column;
  }

  .driver-card-documents-modal .product-dialog__visual {
    display: flex;
    order: 1;
    padding: 54px 32px 28px;
    border-right: 0;
    border-bottom: 1px solid var(--sv-line, #dde3ec);
  }

  .driver-card-documents-modal .product-dialog__image {
    min-height: 0;
    margin-top: 0;
    padding: 0;
  }

  .driver-card-documents-modal .product-dialog__info {
    display: flex;
    order: 2;
    padding: 32px 32px 26px;
  }

  .driver-card-documents-modal .product-dialog__requirements {
    order: 3;
    grid-template-columns: minmax(0, 1.12fr) minmax(240px, 0.88fr);
    margin: 0;
    padding: 28px 32px 22px;
  }

  .driver-card-documents-modal .product-dialog__actions {
    order: 4;
    margin: 0;
    padding: 0 32px 30px;
  }

  .driver-card-documents-modal .product-dialog__kicker {
    padding: 0;
  }

  .driver-card-documents-modal .product-dialog__info h2,
  .driver-card-documents-modal .product-dialog__description {
    margin-inline: 0;
  }
}

@media (max-width: 600px) {
  .driver-card-documents-modal .product-dialog__image {
    padding: 0;
  }

  .driver-card-documents-modal .product-dialog__visual {
    padding: 54px 16px 20px;
  }

  .driver-card-documents-modal .product-dialog__info {
    padding: 26px 16px 22px;
  }

  .driver-card-documents-modal .product-dialog__requirements {
    grid-template-columns: 1fr;
    gap: 18px;
    margin: 0;
    padding: 24px 16px 20px;
  }

  .driver-card-documents-modal .product-dialog__actions {
    grid-template-columns: 1fr;
    padding: 0 16px 28px;
  }

  .product-requirements__section + .product-requirements__section {
    padding-left: 0;
    border-left: 0;
  }

  .product-requirements__intro,
  .product-requirements__outro {
    font-size: 12px;
  }
}

.driver-type-head {
  display: grid;
  gap: 12px;
  margin-bottom: 28px;
}

.driver-type-label {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin: 0;
  color: var(--driver-ink);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.08em;
  line-height: 1.2;
  text-transform: uppercase;
}

.driver-type-label::before {
  width: 5px;
  height: 14px;
  background: var(--driver-red);
  content: "";
}

.driver-type-head p {
  max-width: 760px;
  margin: 0;
  color: #607086;
  font-size: 14px;
  line-height: 1.55;
}

.driver-type-head strong {
  color: var(--driver-ink);
  font-weight: 700;
}

.driver-card-type-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-top: 1px solid var(--driver-line);
  border-left: 1px solid var(--driver-line);
}

.driver-card-type {
  display: flex;
  min-width: 0;
  min-height: 292px;
  flex-direction: column;
  padding: 28px;
  border-right: 1px solid var(--driver-line);
  border-bottom: 1px solid var(--driver-line);
  background: #fff;
  transition:
    background-color 180ms var(--driver-ease-out),
    color 180ms var(--driver-ease-out);
}

.driver-card-type__top {
  display: flex;
  min-height: 18px;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 48px;
}

.driver-card-type--active {
  background: var(--driver-navy);
  color: #fff;
}

.driver-card-type__index {
  color: #8290a2;
  font-family: var(--service-font-data, monospace);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
}

.driver-card-type__meta {
  color: var(--driver-blue);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.driver-card-type--active .driver-card-type__index {
  color: rgba(255, 255, 255, 0.54);
}

.driver-card-type--active .driver-card-type__meta {
  color: rgba(255, 255, 255, 0.72);
}

.driver-card-type h3 {
  max-width: 280px;
  margin: 0 0 14px;
  color: var(--driver-ink);
  font-size: clamp(22px, 2vw, 28px);
  line-height: 1.12;
  letter-spacing: -0.025em;
}

.driver-card-type--active h3 {
  color: #fff;
}

.driver-card-type p {
  margin: 0 0 28px;
  color: #5d6c7f;
  font-size: 14px;
  line-height: 1.58;
}

.driver-card-type--active p {
  color: rgba(255, 255, 255, 0.72);
}

.driver-card-type > a,
.driver-card-type > strong {
  min-height: 44px;
  margin-top: auto;
  color: var(--driver-blue);
  font-size: 13px;
  font-weight: 800;
  line-height: 44px;
  text-decoration: none;
}

.driver-card-type--active > strong {
  color: #fff;
}

.driver-type-note {
  display: grid;
  grid-template-columns: 112px minmax(0, 1fr);
  gap: 24px;
  align-items: center;
  margin-top: 20px;
  padding: 18px 0;
  border-top: 1px solid var(--driver-line);
  border-bottom: 1px solid var(--driver-line);
}

.driver-type-note > span {
  color: var(--driver-red);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.driver-type-note p {
  margin: 0;
  color: #5d6c7f;
  font-size: 14px;
  line-height: 1.55;
}

.driver-type-note strong {
  color: var(--driver-ink);
}

.driver-documents__layout {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(430px, 1.1fr);
  gap: clamp(52px, 8vw, 118px);
  align-items: center;
}

.driver-documents__copy .section-intro {
  margin-bottom: 40px;
}

.driver-pain-list {
  display: grid;
  gap: 0;
  border-top: 1px solid var(--driver-line);
}

.driver-pain-list article,
.driver-application__benefits article {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 16px;
  padding: 20px 0;
  border-bottom: 1px solid var(--driver-line);
}

.driver-pain-list article > span,
.driver-application__benefits article > span {
  color: var(--driver-blue);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.1em;
}

.driver-pain-list strong,
.driver-application__benefits strong {
  display: block;
  margin-bottom: 4px;
  color: var(--driver-ink);
  font-size: 16px;
}

.driver-pain-list p,
.driver-application__benefits p {
  margin: 0;
  color: #617187;
  font-size: 14px;
  line-height: 1.55;
}

.driver-checklist {
  position: relative;
  padding: clamp(32px, 5vw, 56px);
  border: 1px solid rgba(11, 31, 57, 0.09);
  border-radius: 24px;
  background:
    linear-gradient(rgba(10, 91, 216, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(10, 91, 216, 0.035) 1px, transparent 1px),
    #fff;
  background-size: 28px 28px;
  box-shadow: 0 30px 80px rgba(12, 37, 72, 0.09);
}

.driver-checklist__head {
  padding-bottom: 26px;
  border-bottom: 1px solid var(--driver-line);
}

.driver-checklist__head > span {
  color: var(--driver-blue);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.driver-checklist__head h3 {
  margin: 12px 0 10px;
  color: var(--driver-ink);
  font-size: clamp(28px, 3vw, 40px);
  line-height: 1.05;
  letter-spacing: -0.04em;
}

.driver-checklist__head p {
  margin: 0;
  color: #617187;
  font-size: 14px;
  line-height: 1.6;
}

.driver-checklist ol {
  display: grid;
  gap: 0;
  margin: 0;
  padding: 10px 0;
  list-style: none;
}

.driver-checklist li {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 14px;
  align-items: start;
  padding: 14px 0;
  border-bottom: 1px solid rgba(11, 31, 57, 0.08);
}

.driver-checklist li > span {
  display: grid;
  width: 24px;
  height: 24px;
  place-items: center;
  border-radius: 50%;
  background: rgba(10, 91, 216, 0.1);
  color: var(--driver-blue);
  font-size: 12px;
  font-weight: 900;
}

.driver-checklist li strong {
  display: block;
  color: var(--driver-ink);
  font-size: 15px;
}

.driver-checklist li small {
  display: block;
  margin-top: 4px;
  color: #68798d;
  font-size: 13px;
  line-height: 1.5;
}

.driver-checklist__privacy {
  margin: 18px 0 24px;
  color: #617187;
  font-size: 13px;
  line-height: 1.55;
}

.driver-document-sets {
  display: grid;
  margin-top: 10px;
  border-top: 1px solid rgba(11, 31, 57, 0.08);
}

.driver-document-sets article {
  padding: 18px 0;
  border-bottom: 1px solid rgba(11, 31, 57, 0.08);
}

.driver-document-sets__title {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 14px;
  align-items: center;
}

.driver-document-sets__title span {
  color: var(--driver-blue);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.08em;
}

.driver-document-sets h4 {
  margin: 0;
  color: var(--driver-ink);
  font-size: 15px;
}

.driver-document-sets p {
  margin: 8px 0 0 42px;
  color: #68798d;
  font-size: 13px;
  line-height: 1.55;
}

.driver-checklist .button {
  width: 100%;
}

.driver-process {
  isolation: isolate;
  overflow: hidden;
  background:
    linear-gradient(
      to bottom left,
      #0a3a72 0%,
      #052b5b 38%,
      #021f48 70%,
      #011630 100%
    );
}

.driver-process::before {
  background-image:
    linear-gradient(rgba(170, 207, 246, 0.075) 1px, transparent 1px),
    linear-gradient(90deg, rgba(170, 207, 246, 0.075) 1px, transparent 1px);
  background-size: 54px 54px;
  opacity: 0.82;
  -webkit-mask-image: linear-gradient(to bottom left, #000 0%, rgba(0, 0, 0, 0.52) 42%, transparent 88%);
  mask-image: linear-gradient(to bottom left, #000 0%, rgba(0, 0, 0, 0.52) 42%, transparent 88%);
}

.driver-process__content {
  position: relative;
  z-index: 1;
}

.driver-process__heading {
  grid-template-columns: minmax(0, 1fr);
  gap: 18px;
  max-width: 760px;
  margin-bottom: clamp(36px, 4vw, 52px);
}

.driver-process__heading .section-heading {
  max-width: 680px;
  font-size: clamp(32px, 3vw, 44px);
  line-height: 1.06;
}

.driver-process__heading .section-intro {
  max-width: 660px;
  color: rgba(224, 239, 255, 0.72);
  font-size: 17px;
  line-height: 1.58;
}

.driver-process-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(16px, 2vw, 24px);
  margin: 0;
  padding: 0;
  list-style: none;
}

.driver-process-step {
  display: grid;
  grid-template-rows: auto 1fr;
  min-width: 0;
  overflow: hidden;
  border: 1px solid rgba(187, 218, 255, 0.16);
  border-radius: 0;
  background: rgba(5, 27, 55, 0.96);
  box-shadow: 0 22px 54px rgba(0, 12, 29, 0.2);
}

.driver-process-step__media {
  position: relative;
  aspect-ratio: 4 / 3;
  margin: 0;
  overflow: hidden;
  background: #071b35;
}

.driver-process-step__media::after {
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(180deg, rgba(7, 36, 72, 0.04) 45%, rgba(4, 25, 52, 0.46) 100%),
    linear-gradient(110deg, rgba(10, 91, 216, 0.12), transparent 56%);
  content: "";
  pointer-events: none;
}

.driver-process-step__media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(0.88) contrast(1.035) brightness(0.96);
}

.driver-process-step__number {
  position: absolute;
  top: 18px;
  left: 18px;
  z-index: 2;
  display: grid;
  width: 46px;
  height: 34px;
  place-items: center;
  border: 1px solid rgba(224, 239, 255, 0.3);
  border-radius: 0;
  background: rgba(0, 47, 108, 0.84);
  color: #fff;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.12em;
  box-shadow: 0 10px 22px rgba(0, 18, 45, 0.22);
}

.driver-process-step__body {
  padding: clamp(24px, 3vw, 34px);
}

.driver-process-step h3 {
  margin: 0 0 14px;
  color: #fff;
  font-size: clamp(19px, 1.7vw, 24px);
  line-height: 1.12;
  letter-spacing: -0.025em;
}

.driver-process-step p {
  margin: 0;
  color: rgba(224, 239, 255, 0.68);
  font-size: 15px;
  line-height: 1.62;
}

.driver-application {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border-top: 1px solid rgba(0, 47, 108, 0.1);
  border-bottom: 1px solid rgba(0, 47, 108, 0.1);
  background:
    linear-gradient(135deg, #e8eef7 0%, #f7f9fc 48%, #e9f1fa 100%);
}

.driver-application__layout {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(28px, 3vw, 44px);
  align-items: stretch;
}

.driver-application__copy {
  display: flex;
  min-width: 0;
  flex-direction: column;
  padding: clamp(28px, 2.5vw, 36px) 0 0;
}

.driver-application__copy .section-intro {
  max-width: 560px;
  margin-top: 18px;
  margin-bottom: 24px;
  font-size: 16px;
  line-height: 1.6;
}

.driver-application__copy .section-heading {
  max-width: 680px;
  font-size: clamp(30px, 2.25vw, 36px);
  line-height: 1.08;
}

.driver-application__benefits {
  display: grid;
  border-top: 1px solid var(--driver-line);
}

.driver-application__benefits article {
  grid-template-columns: 36px minmax(0, 1fr);
  gap: 12px;
  padding: 16px 0;
}

.driver-application__geo {
  margin-top: 24px;
}

.driver-application__geo {
  min-width: 0;
  height: 100%;
  padding: 16px 18px;
  border-left: 3px solid var(--driver-blue);
  background: rgba(10, 91, 216, 0.065);
}

.driver-application__geo strong {
  display: block;
  margin-bottom: 7px;
  color: var(--driver-ink);
  font-size: 14px;
}

.driver-application__geo p {
  margin: 0;
  color: #596b80;
  font-size: 14px;
  line-height: 1.6;
}

.driver-card-page .driver-application .estimate-card {
  position: relative;
  top: auto;
  display: flex;
  height: 100%;
  margin-top: 0;
  flex-direction: column;
  border-top: 3px solid var(--driver-blue);
}

.driver-card-page .driver-application .estimate-form {
  display: flex;
  flex: 1;
  flex-direction: column;
}

.driver-card-page .driver-application .form-alternative {
  margin-top: auto;
}

.driver-rto-bonus {
  border: 0;
  background:
    linear-gradient(145deg, rgba(10, 91, 216, 0.22), transparent 34%),
    linear-gradient(
      90deg,
      #063875 0%,
      #002f6c 22%,
      #011e46 40.5%,
      #fff 40.5%,
      #fff 100%
    );
}

.driver-rto-bonus__panel {
  position: relative;
  display: grid;
  grid-template-columns: minmax(300px, 0.78fr) minmax(0, 1.22fr);
  overflow: visible;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.driver-rto-bonus__preview {
  display: grid;
  min-width: 0;
  align-content: center;
  justify-items: center;
  padding: clamp(36px, 4vw, 58px);
  background: transparent;
  transform: translateX(clamp(-62px, calc(366px - 29.75vw), 0px));
}

.driver-rto-bonus__preview img {
  width: min(100%, 320px);
  height: auto;
  border: 1px solid rgba(255, 255, 255, 0.32);
  background: #fff;
  box-shadow: 18px 24px 46px rgba(0, 15, 39, 0.34);
}

.driver-rto-bonus__format {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px 0;
  margin-top: 22px;
  color: rgba(255, 255, 255, 0.82);
  font-size: 12px;
  font-weight: 750;
  line-height: 1.3;
}

.driver-rto-bonus__format span {
  display: inline-flex;
  align-items: center;
}

.driver-rto-bonus__format span + span::before {
  width: 1px;
  height: 14px;
  margin: 0 12px;
  background: rgba(255, 255, 255, 0.32);
  content: "";
}

.driver-rto-bonus__copy {
  display: flex;
  min-width: 0;
  flex-direction: column;
  justify-content: center;
  padding: clamp(38px, 5vw, 70px);
}

.driver-rto-bonus__copy time {
  color: var(--sv-red-deep, #d40000);
  font-size: 13px;
  font-weight: 850;
  letter-spacing: 0.02em;
}

.driver-rto-bonus__copy h2 {
  max-width: 650px;
  margin: 16px 0 0;
  color: var(--driver-ink);
  font-size: clamp(32px, 3.2vw, 46px);
  line-height: 1.06;
  letter-spacing: -0.04em;
}

.driver-rto-bonus__intro {
  max-width: 620px;
  margin: 22px 0 0;
  color: #52657c;
  font-size: 17px;
  line-height: 1.66;
}

.driver-rto-bonus__topics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 28px 0 0;
  padding: 0;
  border-top: 1px solid var(--driver-line);
  border-bottom: 1px solid var(--driver-line);
  list-style: none;
}

.driver-rto-bonus__topics li {
  min-width: 0;
  padding: 16px 16px 16px 0;
  color: var(--driver-ink);
  font-size: 13px;
  font-weight: 750;
  line-height: 1.45;
}

.driver-rto-bonus__topics li + li {
  padding-left: 16px;
  border-left: 1px solid var(--driver-line);
}

.driver-rto-bonus__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 14px 18px;
  align-items: center;
  margin-top: 30px;
}

.driver-rto-bonus__actions .button {
  white-space: nowrap;
}

.driver-rto-bonus__actions > span {
  color: #64758a;
  font-size: 13px;
  font-weight: 700;
}

.driver-rto-bonus__source {
  max-width: 650px;
  margin: 20px 0 0;
  color: #6a7a8d;
  font-size: 12px;
  line-height: 1.58;
}

.driver-rto-bonus__source a {
  color: var(--driver-blue-deep);
  font-weight: 750;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

.driver-rto-bonus__source a:hover,
.driver-rto-bonus__source a:focus-visible {
  color: var(--driver-red);
}

.driver-fleet__layout {
  display: grid;
  grid-template-columns: minmax(270px, 0.85fr) minmax(360px, 1.15fr) auto;
  gap: clamp(32px, 6vw, 86px);
  align-items: end;
}

.driver-fleet__layout p {
  margin: 0;
  color: #56697e;
  font-size: 16px;
  line-height: 1.75;
}

.driver-fleet__layout .button {
  white-space: nowrap;
}

.driver-card-page .faq-answer a {
  color: var(--driver-blue);
  font-weight: 700;
}

@media (hover: hover) and (pointer: fine) {
  .driver-card-type:hover {
    background: #f8faff;
  }

  .driver-card-type--active:hover {
    background: var(--driver-navy);
  }

  .driver-card-type > a:hover,
  .driver-card-type > a:focus-visible {
    color: var(--driver-blue-deep);
  }
}

.driver-card-page :where(
  button,
  a.button,
  .messenger-switch__action,
  .catalog-card__actions a,
  .faq-contact__actions a,
  [data-curtain-cta],
  .driver-card-type > a
):active:not(:disabled) {
  translate: 0 1px;
  scale: 0.98;
}

.driver-price-match {
  border-top: 1px solid var(--driver-line);
  border-bottom: 1px solid var(--driver-line);
  background: #e6ecf5;
}

.driver-price-match__panel {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(320px, 0.85fr);
  gap: clamp(48px, 7vw, 104px);
  align-items: center;
}

.driver-price-match__copy {
  max-width: 690px;
}

.driver-price-match__copy .eyebrow {
  color: var(--sv-red, #ff0000);
}

.driver-price-match__copy h2 {
  max-width: 680px;
  margin: 18px 0 0;
  color: var(--driver-navy);
  font-size: clamp(34px, 3.4vw, 48px);
  line-height: 1.08;
  letter-spacing: -0.04em;
}

.driver-price-match__copy h2 em {
  --driver-price-highlight-base: var(--driver-navy);
  display: inline-block;
  margin-right: -0.08em;
  padding-right: 0.08em;
  background-image: linear-gradient(
    90deg,
    var(--sv-red, #ff0000) 0 50%,
    var(--driver-price-highlight-base) 50% 100%
  );
  background-position: 100% 0;
  background-size: 200% 100%;
  background-repeat: no-repeat;
  -webkit-background-clip: text;
  background-clip: text;
  color: var(--driver-price-highlight-base);
  font-style: normal;
  -webkit-text-fill-color: transparent;
}

.driver-price-match__panel.in .driver-price-match__copy h2 em {
  animation: driver-price-match-highlight-sweep 620ms var(--ease-out, ease) 1.02s both;
}

.driver-price-match__panel.in .driver-price-match__copy h2 em[data-price-match-highlight="saving"] {
  animation-delay: 1.3s;
}

@keyframes driver-price-match-highlight-sweep {
  from {
    background-position: 100% 0;
  }

  to {
    background-position: 0 0;
  }
}

.driver-price-match__copy > p:not(.driver-price-match__condition) {
  max-width: 640px;
  margin: 24px 0 0;
  color: #4f6077;
  font-size: 17px;
  line-height: 1.7;
}

.driver-price-match__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 16px 22px;
  align-items: center;
  margin-top: 30px;
}

.messenger-switch--light {
  border-color: rgba(0, 47, 108, 0.32);
}

.messenger-switch--login {
  width: 220px;
  height: 39px;
  min-height: 39px;
}

.messenger-switch--login .messenger-switch__action {
  min-height: 37px;
  font-size: 12px;
}

.messenger-switch--login .messenger-switch__action--max,
.messenger-switch--login:is(
  :has(.messenger-switch__action--max:hover),
  :has(.messenger-switch__action--max:focus-visible),
  [data-active="max"]
) .messenger-switch__action--max {
  width: calc(100% - 38px);
}

.messenger-switch--login .messenger-switch__action--telegram,
.messenger-switch--login:is(
  :has(.messenger-switch__action--max:hover),
  :has(.messenger-switch__action--max:focus-visible),
  [data-active="max"]
) .messenger-switch__action--telegram,
.messenger-switch--login:is(
  :has(.messenger-switch__action--telegram:hover),
  :has(.messenger-switch__action--telegram:focus-visible),
  [data-active="telegram"]
) .messenger-switch__action--max {
  width: 38px;
}

.messenger-switch--login:is(
  :has(.messenger-switch__action--telegram:hover),
  :has(.messenger-switch__action--telegram:focus-visible),
  [data-active="telegram"]
) .messenger-switch__action--telegram {
  width: calc(100% - 38px);
}

.messenger-switch--price {
  width: 258px;
}

.messenger-switch--wide {
  width: 286px;
}

.messenger-switch--wide .messenger-switch__action--max .messenger-switch__label {
  max-width: 194px;
}

.messenger-switch--wide:is(
  :has(.messenger-switch__action--telegram:hover),
  :has(.messenger-switch__action--telegram:focus-visible),
  [data-active="telegram"]
) .messenger-switch__action--telegram .messenger-switch__label {
  max-width: 212px;
}

.messenger-switch--price .messenger-switch__action--max .messenger-switch__label {
  max-width: 148px;
}

.messenger-switch--price:is(
  :has(.messenger-switch__action--telegram:hover),
  :has(.messenger-switch__action--telegram:focus-visible),
  [data-active="telegram"]
) {
  border-color: rgba(0, 47, 108, 0.32);
}

.messenger-switch--price:is(
  :has(.messenger-switch__action--telegram:hover),
  :has(.messenger-switch__action--telegram:focus-visible),
  [data-active="telegram"]
) .messenger-switch__action--telegram .messenger-switch__label {
  max-width: 178px;
}

@media (max-width: 600px) {
  .messenger-switch--price,
  .messenger-switch--wide {
    width: 100%;
  }
}

.driver-price-match__email {
  border-color: rgba(0, 47, 108, 0.36);
  background-color: transparent;
  background-image: none;
}

.driver-price-match__email:hover,
.driver-price-match__email:focus-visible {
  border-color: var(--sv-red, #ff0000);
  background-color: transparent;
  background-image: none;
  background-position: 100% 0;
  color: var(--sv-red, #ff0000);
}

.driver-price-match__condition {
  margin: 20px 0 0;
  color: #62738a;
  font-size: 12px;
  line-height: 1.55;
}

.driver-price-match__visual {
  display: grid;
  justify-items: center;
}

.driver-price-match__terminal {
  display: block;
  width: min(100%, 390px);
  height: auto;
  filter:
    drop-shadow(2px 8px 4px rgba(0, 27, 63, 0.14))
    drop-shadow(18px 30px 22px rgba(0, 27, 63, 0.2));
}

@media (max-width: 1280px) {
  .driver-card-page .driver-card-hero .hero-grid {
    grid-template-columns: minmax(0, 1fr) minmax(360px, 0.82fr);
    gap: 38px;
  }

  .driver-card-page .driver-card-hero .hero-proof {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .driver-process-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .driver-process-step {
    min-height: 0;
  }

  .driver-fleet__layout {
    grid-template-columns: minmax(250px, 0.8fr) minmax(320px, 1.2fr);
  }

  .driver-fleet__layout .button {
    grid-column: 2;
    justify-self: start;
  }

  .driver-price-match__panel {
    gap: 42px;
  }
}

@media (min-width: 941px) and (max-width: 1080px) {
  .driver-card-page .driver-card-hero::before {
    width: 72%;
    height: 100%;
  }
}

@media (max-width: 1100px) {
  .driver-application__layout {
    grid-template-columns: 1fr;
    gap: 40px;
  }
}

@media (max-width: 940px) {
  .driver-card-page .driver-card-hero {
    min-height: 0;
  }

  .driver-card-page .driver-card-hero .hero-copy {
    padding-right: 0;
  }

  .driver-card-page .driver-card-hero .hero-grid {
    grid-template-columns: 1fr;
    min-height: 0;
  }

  .driver-card-visual {
    width: min(620px, 100%);
    min-height: 500px;
    margin: -18px auto 0;
  }

  .driver-section-heading,
  .driver-documents__layout,
  .driver-application__layout {
    grid-template-columns: 1fr;
  }

  .driver-card-type-grid {
    grid-template-columns: 1fr 1fr;
  }

  .driver-card-type--active {
    grid-column: 1 / -1;
  }

  .driver-documents__layout,
  .driver-application__layout {
    gap: 46px;
  }

  .driver-card-page .driver-application .estimate-card {
    position: relative;
    top: auto;
  }

  .driver-price-match__panel {
    grid-template-columns: 1fr;
  }

  .driver-price-match__copy {
    max-width: 720px;
  }

  .driver-price-match__visual {
    justify-items: center;
  }

  .driver-rto-bonus__panel {
    grid-template-columns: 1fr;
  }

  .driver-rto-bonus {
    padding: 0;
    background: #fff;
  }

  .driver-rto-bonus > .container {
    width: 100%;
    max-width: none;
  }

  .driver-rto-bonus__preview {
    padding-inline: clamp(40px, 8vw, 70px);
    background:
      linear-gradient(145deg, rgba(10, 91, 216, 0.22), transparent 46%),
      linear-gradient(160deg, #063875 0%, #002f6c 52%, #011e46 100%);
    transform: none;
  }

  .driver-rto-bonus__copy {
    padding-inline: clamp(40px, 8vw, 70px);
    background: #fff;
  }

  .driver-rto-bonus__preview img {
    width: min(100%, 280px);
  }
}

@media (max-width: 700px) {
  .driver-card-page .driver-card-hero .hero-lede {
    margin-top: 20px;
  }

  .driver-card-page .driver-card-hero .hero-title__line:first-child {
    white-space: normal;
  }

  .driver-card-page .driver-card-hero .hero-proof {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .driver-card-visual {
    min-height: 390px;
  }

  .driver-card-visual__media {
    width: 88.4%;
  }

  .driver-card-page .driver-card-visual .hero-product-orbit {
    width: min(360px, calc(100vw - 24px));
  }

  .driver-card-type-grid,
  .driver-process-grid,
  .driver-fleet__layout {
    grid-template-columns: 1fr;
  }

  .driver-card-type--active,
  .driver-fleet__layout .button {
    grid-column: auto;
  }

  .driver-card-type {
    min-height: 280px;
  }

  .driver-card-catalog .catalog-card__visual {
    min-height: 210px;
    padding: 22px 18px 16px;
  }

  .driver-process-step {
    min-height: 0;
  }

  .driver-process-step__body {
    padding: 24px;
  }

  .driver-fleet__layout {
    align-items: start;
  }

  .driver-price-match__panel {
    gap: 36px;
  }

  .driver-price-match__copy h2 {
    font-size: clamp(30px, 9vw, 38px);
  }

  .driver-price-match__copy > p:not(.driver-price-match__condition) {
    font-size: 16px;
  }

  .driver-price-match__actions {
    align-items: stretch;
  }

  .driver-price-match__actions .messenger-switch {
    width: 100%;
  }

  .driver-price-match__actions .button {
    width: 100%;
  }

  .driver-price-match__visual {
    width: 100%;
  }

  .driver-price-match__terminal {
    width: min(100%, 320px);
  }

  .driver-rto-bonus__preview {
    padding: 36px 40px 30px;
  }

  .driver-rto-bonus__copy {
    padding: 34px 40px 38px;
  }

  .driver-rto-bonus__copy h2 {
    font-size: clamp(30px, 9vw, 38px);
  }

  .driver-rto-bonus__intro {
    font-size: 16px;
  }

  .driver-rto-bonus__topics {
    grid-template-columns: 1fr;
  }

  .driver-rto-bonus__topics li {
    padding: 14px 0;
  }

  .driver-rto-bonus__topics li + li {
    padding-left: 0;
    border-top: 1px solid var(--driver-line);
    border-left: 0;
  }

  .driver-rto-bonus__actions {
    align-items: stretch;
  }

  .driver-rto-bonus__actions .button {
    width: 100%;
  }

}

@media (max-width: 480px) {
  .driver-card-page .driver-card-hero .hero-grid {
    gap: 18px;
  }

  .driver-card-page .driver-card-hero .hero-actions .button {
    width: 100%;
  }

  .driver-card-visual {
    min-height: 330px;
  }

  .driver-card-type,
  .driver-checklist {
    padding: 26px 20px;
  }

  .driver-card-type__top {
    margin-bottom: 36px;
  }

  .driver-type-note {
    grid-template-columns: 1fr;
    gap: 8px;
    padding: 18px 20px;
  }

  .driver-pain-list article,
  .driver-application__benefits article {
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 12px;
  }

  .driver-application__copy {
    padding: 26px 20px;
  }

  .driver-checklist li {
    grid-template-columns: 24px minmax(0, 1fr);
    gap: 10px;
  }

  .driver-document-sets__title {
    grid-template-columns: 24px minmax(0, 1fr);
    gap: 10px;
  }

  .driver-document-sets p {
    margin-left: 34px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .driver-card-page .driver-card-type {
    transition-duration: 0.01ms;
  }

  .messenger-switch,
  .messenger-switch__action,
  .messenger-switch__action--telegram,
  .messenger-switch__icon,
  .messenger-switch__label {
    transition: none;
  }

  .driver-price-match__panel.in .driver-price-match__copy h2 em {
    animation: none;
    background-position: 0 0;
  }

  .driver-card-page :where(
    button,
    a.button,
    .messenger-switch__action,
    .catalog-card__actions a,
    .faq-contact__actions a,
    [data-curtain-cta],
    .driver-card-type > a
  ):active:not(:disabled) {
    opacity: 0.88;
    translate: none;
    scale: 1;
  }

}

/* GLONASS monitoring — interactive opening screen */
.glonass-page {
  background: #f4f5f7;
}

.monitoring-hero {
  --monitoring-card-width: 340px;
  --monitoring-scroll-ui-opacity: 1;
  --monitoring-stage-height: max(720px, calc(100svh - var(--header-height)));
  min-height: max(720px, calc(100svh - var(--header-height)));
  color: var(--sv-navy-ink, #0f2340);
  isolation: isolate;
}

.monitoring-hero::before {
  display: none;
}

.monitoring-hero__stage {
  position: relative;
  min-height: inherit;
  overflow: hidden;
  isolation: isolate;
}

.monitoring-hero__media,
.monitoring-hero__wash {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.monitoring-hero__media {
  z-index: 0;
  background-color: #f7f8fa;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-size: cover;
  transform: scale(1.015);
}

.monitoring-hero__frame-picture {
  display: contents;
}

.monitoring-hero__video {
  position: absolute;
  z-index: 0;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 50%;
  pointer-events: none;
}

.monitoring-hero__video--secondary {
  opacity: 0;
}

.monitoring-hero.is-monitoring-secondary .monitoring-hero__video--secondary {
  opacity: 1;
}

.monitoring-hero__initial-frame,
.monitoring-hero__final-frame,
.monitoring-hero__result-frame {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 50%;
  pointer-events: none;
  transition: opacity 180ms ease;
  will-change: opacity;
}

.monitoring-hero__initial-frame {
  z-index: 1;
  opacity: 1;
  transition: none;
}

.monitoring-hero.is-scroll-scrub-enabled .monitoring-hero__initial-frame {
  opacity: var(--monitoring-initial-opacity, 1);
}

.monitoring-hero__final-frame {
  z-index: 2;
  opacity: 0;
}

.monitoring-hero.is-monitoring-primary-complete .monitoring-hero__final-frame {
  opacity: var(--monitoring-primary-final-opacity, 1);
}

.monitoring-hero__result-frame {
  z-index: 4;
  opacity: 0;
}

.monitoring-hero.is-monitoring-result .monitoring-hero__result-frame {
  opacity: 1;
}

.monitoring-hero__wash {
  z-index: 1;
  background:
    linear-gradient(
      90deg,
      rgba(247, 248, 250, 0.99) 0%,
      rgba(247, 248, 250, 0.97) 28%,
      rgba(247, 248, 250, 0.79) 42%,
      rgba(247, 248, 250, 0.06) 58%,
      rgba(247, 248, 250, 0.14) 100%
    ),
    linear-gradient(180deg, rgba(244, 246, 249, 0.1) 62%, rgba(244, 246, 249, 0.62) 100%);
}

.monitoring-hero__inner {
  position: relative;
  z-index: 2;
  display: flex;
  min-height: max(720px, calc(100svh - var(--header-height)));
  flex-direction: column;
}

.monitoring-hero.is-scroll-scrub-enabled {
  height: calc(var(--monitoring-stage-height) + 140svh);
  min-height: calc(var(--monitoring-stage-height) + 140svh);
  overflow: visible;
}

.monitoring-hero.is-scroll-scrub-enabled .monitoring-hero__stage {
  position: sticky;
  top: var(--header-height);
  height: var(--monitoring-stage-height);
  min-height: var(--monitoring-stage-height);
}

.monitoring-hero.is-scroll-scrub-enabled .monitoring-hero__inner {
  min-height: var(--monitoring-stage-height);
  opacity: var(--monitoring-scroll-ui-opacity);
  transition: opacity 420ms var(--ease-out, cubic-bezier(0.22, 1, 0.36, 1));
  will-change: opacity;
}

.monitoring-hero.is-scroll-scrub-enabled .monitoring-hero__wash {
  opacity: var(--monitoring-scroll-ui-opacity);
  transition: opacity 420ms var(--ease-out, cubic-bezier(0.22, 1, 0.36, 1));
  will-change: opacity;
}

.monitoring-hero.is-scroll-ui-hidden .monitoring-hero__inner {
  pointer-events: none;
}

.monitoring-final {
  position: absolute;
  inset: 0;
  z-index: 5;
  overflow: hidden;
  color: var(--sv-navy-ink, #0f2340);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition:
    opacity 260ms ease,
    visibility 0s 260ms;
}

.monitoring-hero.is-monitoring-final .monitoring-final {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition:
    opacity 260ms ease,
    visibility 0s;
}

.monitoring-final__headline {
  position: absolute;
  top: clamp(28px, 4.8svh, 52px);
  left: 50%;
  width: min(calc(100% - 24px), 1280px);
  text-align: left;
  opacity: 0;
  transform: translate(-50%, 16px);
  transition:
    opacity 460ms var(--ease-out, cubic-bezier(0.22, 1, 0.36, 1)),
    transform 460ms var(--ease-out, cubic-bezier(0.22, 1, 0.36, 1));
}

.monitoring-final__headline h2 {
  max-width: 720px;
  margin: 0;
  color: var(--sv-navy-ink, #0f2340);
  font-size: clamp(31px, 3.1vw, 48px);
  font-weight: 780;
  letter-spacing: -0.045em;
  line-height: 1.02;
}

.monitoring-final__title-line {
  display: block;
}

.monitoring-final__accent {
  position: relative;
  display: inline-block;
  color: var(--sv-red, #ff0000);
  white-space: nowrap;
}

.monitoring-final__accent::after {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  color: var(--sv-navy-ink, #0f2340);
  white-space: nowrap;
  clip-path: inset(-0.2em 0 -0.2em 0);
  content: attr(data-text);
  transition: clip-path 260ms ease;
}

.monitoring-final__headline p {
  max-width: none;
  margin: 12px auto 0;
  color: rgba(15, 35, 64, 0.7);
  font-size: clamp(14px, 1.1vw, 17px);
  line-height: 1.5;
}

.monitoring-final__headline p span {
  display: block;
}

.monitoring-final__headline p span + span {
  margin-top: 2px;
}

.monitoring-final__callout {
  position: absolute;
  display: grid;
  width: clamp(250px, 18.5vw, 300px);
  min-height: 76px;
  grid-template-columns: 30px minmax(0, 1fr);
  gap: 9px;
  align-items: center;
  padding: 10px;
  border: 0;
  border-radius: 10px;
  background: rgba(248, 250, 252, 0.94);
  box-shadow:
    0 10px 28px rgba(15, 35, 64, 0.14),
    0 2px 8px rgba(15, 35, 64, 0.08),
    0 0 0 1px rgba(15, 35, 64, 0.1);
  -webkit-backdrop-filter: blur(20px) saturate(120%);
  backdrop-filter: blur(20px) saturate(120%);
  opacity: 0;
  transform: translateY(14px);
  transition:
    opacity 380ms var(--ease-out, cubic-bezier(0.22, 1, 0.36, 1)),
    transform 380ms var(--ease-out, cubic-bezier(0.22, 1, 0.36, 1));
}

.monitoring-final__callout[data-monitoring-anchor] {
  right: auto;
  left: var(--monitoring-card-x);
  transform: translate(-50%, 14px);
}

.monitoring-final__callout > svg {
  display: block;
  width: 30px;
  height: 30px;
  padding: 6px;
  border-radius: 7px;
  background: rgba(255, 0, 0, 0.07);
  color: var(--sv-red, #ff0000);
}

.monitoring-final__callout-body {
  min-width: 0;
}

.monitoring-final__callout::before,
.monitoring-final__callout::after {
  position: absolute;
  display: block;
  content: "";
  pointer-events: none;
}

.monitoring-final__callout::before {
  left: 50%;
  width: 1px;
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 1px 0 0 rgba(15, 35, 64, 0.32);
  transform: scaleY(0);
}

.monitoring-final__callout::after {
  left: calc(50% - 7px);
  width: 14px;
  height: 14px;
  border: 0;
  border-radius: 4px;
  background:
    radial-gradient(circle at center, var(--sv-red, #ff0000) 0 2px, transparent 2.5px),
    rgba(248, 250, 252, 0.96);
  box-shadow:
    0 0 0 1px rgba(15, 35, 64, 0.16),
    0 2px 6px rgba(15, 35, 64, 0.18);
  opacity: 0;
  transform: scale(0.45);
}

.monitoring-final__callout[data-monitoring-anchor]::before {
  left: var(--monitoring-line-x);
  height: var(--monitoring-line-length);
}

.monitoring-final__callout[data-monitoring-anchor]::after {
  left: calc(var(--monitoring-line-x) - 7px);
}

.monitoring-final__callout strong {
  display: block;
  color: var(--sv-navy-ink, #0f2340);
  font-size: 12.5px;
  font-weight: 700;
  line-height: 1.3;
}

.monitoring-final__callout p {
  margin: 4px 0 0;
  color: rgba(15, 35, 64, 0.62);
  font-size: 11px;
  line-height: 1.45;
}

.monitoring-camera-feeds {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  margin-top: 2px;
}

.monitoring-camera-feed {
  position: relative;
  display: block;
  min-width: 0;
  aspect-ratio: 16 / 9;
  margin: 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.72);
  border-radius: 12px;
  background: var(--sv-navy-ink, #0f2340);
  color: inherit;
  cursor: zoom-in;
  font: inherit;
  pointer-events: auto;
  text-align: left;
  -webkit-appearance: none;
  appearance: none;
}

.monitoring-camera-feed img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 220ms var(--ease-out, cubic-bezier(0.22, 1, 0.36, 1));
}

.monitoring-camera-feed:hover img,
.monitoring-camera-feed:focus-visible img {
  transform: scale(1.045);
}

.monitoring-camera-feed:focus-visible {
  outline: 2px solid var(--sv-red, #ff0000);
  outline-offset: 2px;
}

.monitoring-camera-feed__hud {
  position: absolute;
  top: 5px;
  right: 5px;
  left: 5px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 4px;
  color: #fff;
  font-family: var(--service-font-data);
  font-size: 6.5px;
  font-variant-numeric: tabular-nums;
  font-weight: 760;
  letter-spacing: 0.025em;
  line-height: 1;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.85);
}

.monitoring-camera-feed__rec {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: #ff2b2b;
  letter-spacing: 0.08em;
}

.monitoring-camera-feed__rec i {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: currentColor;
  box-shadow: 0 0 0 2px rgba(255, 43, 43, 0.2);
  animation: monitoring-online-blink 1s steps(1, end) infinite;
}

.monitoring-camera-feed__caption {
  position: absolute;
  right: 5px;
  bottom: 4px;
  left: 5px;
  color: #fff;
  font-size: 8px;
  font-weight: 760;
  line-height: 1;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.9);
}

.monitoring-camera-feed__zoom {
  position: absolute;
  right: 5px;
  bottom: 5px;
  display: grid;
  width: 20px;
  height: 20px;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, 0.72);
  border-radius: 50%;
  background: rgba(7, 24, 47, 0.7);
  color: #fff;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.26);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  transition:
    background-color 180ms ease,
    transform 180ms ease;
}

.monitoring-camera-feed__zoom svg {
  width: 12px;
  height: 12px;
}

.monitoring-camera-feed:hover .monitoring-camera-feed__zoom,
.monitoring-camera-feed:focus-visible .monitoring-camera-feed__zoom {
  background: var(--sv-red, #ff0000);
  transform: scale(1.08);
}

.monitoring-final__connection {
  display: flex;
  align-items: center;
  gap: 5px;
  color: var(--sv-navy, #002f6c) !important;
  font-family: var(--service-font-data);
  font-size: 9px !important;
  font-variant-numeric: tabular-nums;
  font-weight: 760;
  white-space: nowrap;
}

.monitoring-final__connection-separator {
  color: rgba(15, 35, 64, 0.38);
}

.monitoring-final__connection-active {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: #18864a;
  font-weight: 800;
}

.monitoring-final__connection-active i {
  width: 6px;
  height: 6px;
  flex: 0 0 6px;
  border-radius: 50%;
  background: #22a45d;
  box-shadow: 0 0 0 3px rgba(34, 164, 93, 0.13);
  animation: monitoring-online-blink 1.4s steps(1, end) infinite;
}

.monitoring-callout-metrics {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 2px 0 0;
  color: var(--sv-navy-ink, #0f2340);
}

.monitoring-callout-metrics > div {
  min-width: 0;
  padding: 7px 7px 1px;
  border-left: 1px solid rgba(15, 35, 64, 0.12);
}

.monitoring-callout-metrics > div:nth-child(2) {
  border-left: 0;
}

.monitoring-callout-metrics__primary {
  display: flex;
  grid-column: 1 / -1;
  min-height: 44px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 3px;
  padding: 8px 10px !important;
  border: 1px solid rgba(255, 255, 255, 0.7);
  border-left: 2px solid var(--sv-red, #ff0000) !important;
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.38);
}

.monitoring-callout-metrics > .monitoring-callout-metrics__primary dt {
  max-width: 82px;
  color: rgba(15, 35, 64, 0.68);
  font-size: 10px;
  font-weight: 760;
  line-height: 1.15;
}

.monitoring-callout-metrics dt {
  color: rgba(15, 35, 64, 0.56);
  font-size: 8px;
  font-weight: 700;
  line-height: 1.2;
}

.monitoring-callout-metrics dd {
  margin: 3px 0 0;
  color: var(--sv-navy-ink, #0f2340);
  font-family: var(--service-font-data);
  font-size: 13px;
  font-variant-numeric: tabular-nums;
  font-weight: 820;
  letter-spacing: -0.02em;
  line-height: 1;
  white-space: nowrap;
}

.monitoring-callout-metrics dd small {
  color: rgba(15, 35, 64, 0.58);
  font-size: 7px;
  font-weight: 700;
  letter-spacing: 0;
}

.monitoring-callout-metrics__primary dd {
  display: flex;
  min-width: 0;
  flex: 1 1 auto;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: flex-end;
  column-gap: 6px;
  row-gap: 0;
  margin: 0;
}

.monitoring-callout-metrics--terminal .monitoring-callout-metrics__primary dd {
  align-items: flex-end;
}

.monitoring-callout-metrics__primary dd strong {
  font-family: var(--service-font-data);
  font-size: clamp(18px, 1.15vw, 22px);
  font-variant-numeric: tabular-nums;
  font-weight: 820;
  letter-spacing: -0.035em;
  line-height: 1.02;
  text-align: right;
  white-space: normal;
}

.monitoring-callout-metrics__primary dd span {
  color: rgba(15, 35, 64, 0.68);
  font-family: var(--service-font-body);
  font-size: 10px;
  font-weight: 760;
  letter-spacing: 0;
  line-height: 1.15;
  white-space: nowrap;
}

.monitoring-final__callout--terminal {
  --monitoring-callout-delay: 800ms;
  --monitoring-card-x: 77%;
  --monitoring-line-x: 50%;
  --monitoring-line-length: clamp(116px, 17svh, 164px);
  top: calc(71% - 30px);
  width: clamp(270px, 20vw, 310px);
}

.monitoring-final__callout--terminal::before {
  bottom: 100%;
  transform-origin: center bottom;
}

.monitoring-final__callout--terminal::after {
  bottom: calc(100% + var(--monitoring-line-length) - 7px);
}

.monitoring-final__callout--fuel {
  --monitoring-callout-delay: 560ms;
  --monitoring-card-x: calc(50% - 7px);
  --monitoring-line-x: calc(50% + 20px);
  --monitoring-line-length: calc(clamp(42px, 6svh, 66px) + 30px);
  top: calc(46% - 90px);
  width: clamp(270px, 19vw, 310px);
}

.monitoring-final__callout--fuel::before {
  top: 100%;
  transform-origin: center top;
}

.monitoring-final__callout--fuel::after {
  top: calc(100% + var(--monitoring-line-length) - 7px);
}

.monitoring-final__callout--video {
  --monitoring-callout-delay: 320ms;
  --monitoring-card-x: 78%;
  --monitoring-line-x: 50%;
  --monitoring-line-length: clamp(36px, 5svh, 54px);
  top: clamp(106px, 13%, 124px);
  width: clamp(330px, 23vw, 380px);
}

.monitoring-final__callout--video::before {
  top: 100%;
  transform-origin: center top;
}

.monitoring-final__callout--video::after {
  top: calc(100% + var(--monitoring-line-length) - 7px);
}

.monitoring-image-modal {
  position: fixed;
  z-index: 1800;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(5, 18, 36, 0.76);
  -webkit-backdrop-filter: blur(9px);
  backdrop-filter: blur(9px);
  opacity: 0;
  visibility: hidden;
  transition:
    opacity 220ms ease,
    visibility 220ms ease;
}

.monitoring-image-modal.is-open {
  opacity: 1;
  visibility: visible;
}

.monitoring-image-dialog {
  position: relative;
  width: min(960px, 92vw);
  max-height: calc(100dvh - 48px);
  padding: 12px;
  overflow: auto;
  border: 1px solid rgba(255, 255, 255, 0.72);
  border-radius: 24px;
  background: rgba(239, 245, 252, 0.82);
  box-shadow: 0 30px 90px rgba(0, 13, 34, 0.46);
  -webkit-backdrop-filter: blur(24px) saturate(140%);
  backdrop-filter: blur(24px) saturate(140%);
  opacity: 0;
  transform: translateY(18px) scale(0.97);
  transition:
    opacity 200ms ease,
    transform 260ms var(--ease-out, cubic-bezier(0.22, 1, 0.36, 1));
}

.monitoring-image-modal.is-open .monitoring-image-dialog {
  opacity: 1;
  transform: none;
}

.monitoring-image-dialog__close {
  position: absolute;
  z-index: 2;
  top: 22px;
  right: 22px;
  display: grid;
  width: 40px;
  height: 40px;
  place-items: center;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, 0.74);
  border-radius: 50%;
  background: rgba(7, 24, 47, 0.72);
  color: #fff;
  cursor: pointer;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}

.monitoring-image-dialog__close svg {
  width: 19px;
  height: 19px;
}

.monitoring-image-dialog__close:hover,
.monitoring-image-dialog__close:focus-visible {
  background: var(--sv-red, #ff0000);
}

.monitoring-image-dialog__close:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 2px;
}

.monitoring-image-dialog__media {
  position: relative;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  border-radius: 16px;
  background: var(--sv-navy-ink, #0f2340);
}

.monitoring-image-dialog__media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.monitoring-image-dialog__hud {
  position: absolute;
  top: 18px;
  right: 20px;
  left: 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: #fff;
  font-family: var(--service-font-data);
  font-size: 13px;
  font-variant-numeric: tabular-nums;
  font-weight: 760;
  text-shadow: 0 2px 6px rgba(0, 0, 0, 0.88);
}

.monitoring-image-dialog h2 {
  margin: 12px 8px 3px;
  color: var(--sv-navy-ink, #0f2340);
  font-size: 18px;
  line-height: 1.2;
}

.monitoring-final__closing {
  position: absolute;
  right: clamp(24px, 5vw, 86px);
  bottom: clamp(24px, 4svh, 40px);
  left: clamp(24px, 5vw, 86px);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(22px, 3vw, 42px);
  opacity: 0;
  transform: translateY(14px);
  transition:
    opacity 420ms var(--ease-out, cubic-bezier(0.22, 1, 0.36, 1)),
    transform 420ms var(--ease-out, cubic-bezier(0.22, 1, 0.36, 1));
}

.monitoring-final__closing p {
  max-width: 610px;
  margin: 0;
  color: var(--sv-navy-ink, #0f2340);
  font-size: clamp(14px, 1.15vw, 17px);
  font-weight: 700;
  line-height: 1.4;
}

.monitoring-final__cta {
  flex: 0 0 auto;
  min-width: 210px;
  pointer-events: auto;
}

.monitoring-hero.is-monitoring-final .monitoring-final__headline {
  opacity: 1;
  transform: translate(-50%, 0);
  transition-delay: 60ms;
}

.monitoring-hero.is-monitoring-final .monitoring-final__accent::after {
  clip-path: inset(-0.2em 0 -0.2em 100%);
  transition: clip-path 760ms var(--ease-out, cubic-bezier(0.22, 1, 0.36, 1)) 280ms;
}

.monitoring-hero.is-monitoring-final .monitoring-final__callout {
  opacity: 1;
  transform: translateY(0);
  transition-delay: var(--monitoring-callout-delay, 320ms);
}

.monitoring-hero.is-monitoring-final .monitoring-final__callout[data-monitoring-anchor] {
  transform: translate(-50%, 0);
}

.monitoring-hero.is-monitoring-final .monitoring-final__callout::before {
  transform: scaleX(1);
  transition: transform 360ms var(--ease-out, cubic-bezier(0.22, 1, 0.36, 1)) calc(var(--monitoring-callout-delay, 320ms) + 180ms);
}

.monitoring-hero.is-monitoring-final .monitoring-final__callout--fuel::before {
  transform: scaleY(1);
}

.monitoring-hero.is-monitoring-final .monitoring-final__callout--terminal::before {
  transform: scaleY(1);
}

.monitoring-hero.is-monitoring-final .monitoring-final__callout--video::before {
  transform: scaleY(1);
}

.monitoring-hero.is-monitoring-final .monitoring-final__callout::after {
  opacity: 1;
  transform: scale(1);
  transition:
    opacity 220ms ease calc(var(--monitoring-callout-delay, 320ms) + 490ms),
    transform 220ms var(--ease-out, cubic-bezier(0.22, 1, 0.36, 1)) calc(var(--monitoring-callout-delay, 320ms) + 490ms);
}

.monitoring-hero.is-monitoring-final .monitoring-final__closing {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 1080ms;
}

.monitoring-result {
  position: absolute;
  inset: 0;
  z-index: 6;
  overflow: hidden;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition:
    opacity 300ms ease,
    visibility 0s 300ms;
}

.monitoring-hero.is-monitoring-result .monitoring-result {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition:
    opacity 300ms ease,
    visibility 0s;
}

.monitoring-calculator {
  position: absolute;
  top: 50%;
  right: clamp(24px, 5vw, 84px);
  width: clamp(360px, 31vw, 470px);
  max-height: calc(100% - 48px);
  padding: clamp(20px, 2.1vw, 28px);
  overflow-y: auto;
  border: 1px solid rgba(15, 35, 64, 0.12);
  border-radius: 0;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.8), rgba(232, 239, 248, 0.64)),
    rgba(238, 244, 252, 0.68);
  -webkit-backdrop-filter: blur(20px) saturate(125%);
  backdrop-filter: blur(20px) saturate(125%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.74),
    0 24px 64px rgba(15, 35, 64, 0.16);
  opacity: 0;
  transform: translateY(calc(-50% + 18px));
  transition:
    opacity 420ms var(--ease-out, cubic-bezier(0.22, 1, 0.36, 1)),
    transform 420ms var(--ease-out, cubic-bezier(0.22, 1, 0.36, 1));
}

@media (prefers-reduced-transparency: reduce) {
  .monitoring-calculator {
    background: rgba(244, 248, 253, 0.96);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
}

@media (min-width: 1360px) {
  .monitoring-calculator {
    right: calc(clamp(24px, 5vw, 84px) + 150px);
  }
}

.monitoring-hero.is-monitoring-result .monitoring-calculator {
  opacity: 1;
  transform: translateY(-50%);
  transition-delay: 120ms;
}

.monitoring-calculator__head {
  margin-bottom: 18px;
}

.monitoring-calculator__eyebrow {
  display: flex;
  gap: 8px;
  align-items: center;
  margin: 0 0 7px;
  color: var(--sv-red, #ff0000);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: 0.08em;
  line-height: 1.2;
  text-transform: uppercase;
}

.monitoring-calculator__eyebrow::before {
  flex: 0 0 7px;
  width: 7px;
  height: 7px;
  background: currentColor;
  content: "";
}

.monitoring-calculator__head h2 {
  max-width: 390px;
  margin: 0;
  color: var(--sv-navy-ink, #0f2340);
  font-family: var(--service-font-display);
  font-size: clamp(24px, 2.2vw, 34px);
  font-weight: 780;
  letter-spacing: -0.035em;
  line-height: 1.02;
}

.monitoring-calculator__description {
  margin: 8px 0 0;
  color: var(--sv-gray-500, #6b7789);
  font-size: 12px;
  font-weight: 620;
  line-height: 1.35;
}

.monitoring-calculator__form {
  display: grid;
  gap: 12px;
}

.monitoring-calculator .fuel-field {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 112px;
  gap: 5px 12px;
  align-items: center;
  padding: 0;
  border: 0;
}

.monitoring-calculator .fuel-field label {
  grid-column: 1 / -1;
  min-height: 0;
  margin: 0;
  font-size: 11px;
}

.monitoring-calculator .fuel-range {
  grid-column: 1;
  grid-row: 2;
  margin: 0;
}

.monitoring-calculator .fuel-range > input::-webkit-slider-runnable-track {
  background:
    linear-gradient(
      to right,
      var(--sv-navy, #002f6c) 0,
      var(--sv-navy, #002f6c) var(--range-progress),
      #d4ddeb var(--range-progress),
      #d4ddeb 100%
    );
}

.monitoring-calculator .fuel-range > input::-webkit-slider-thumb {
  background: var(--sv-navy, #002f6c);
}

.monitoring-calculator .fuel-range > input::-moz-range-progress,
.monitoring-calculator .fuel-range > input::-moz-range-thumb {
  background: var(--sv-navy, #002f6c);
}

.monitoring-calculator .fuel-field__control {
  grid-column: 2;
  grid-row: 2;
}

.monitoring-calculator .fuel-field__control input {
  min-height: 42px;
  padding-right: 58px;
  font-size: 15px;
}

.monitoring-calculator .fuel-field__control > span {
  right: 9px;
  font-size: 9px;
}

.monitoring-calculator .fuel-field__error {
  grid-column: 1 / -1;
  grid-row: 3;
  margin-top: 0;
}

.monitoring-calculator__results {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 3px;
  border-top: 3px solid var(--sv-red, #ff0000);
  background: var(--sv-navy, #002f6c);
}

.monitoring-calculator__results > div {
  min-width: 0;
  padding: 14px 15px 16px;
}

.monitoring-calculator__results > div + div {
  border-left: 1px solid rgba(255, 255, 255, 0.18);
}

.monitoring-calculator__results span {
  display: block;
  color: rgba(255, 255, 255, 0.68);
  font-size: 9px;
  font-weight: 760;
  letter-spacing: 0.05em;
  line-height: 1.25;
  text-transform: uppercase;
}

.monitoring-calculator__results strong {
  display: block;
  margin-top: 6px;
  color: #fff;
  font-family: var(--service-font-data);
  font-size: clamp(18px, 1.7vw, 25px);
  font-variant-numeric: tabular-nums;
  font-weight: 820;
  letter-spacing: -0.025em;
  line-height: 1;
  white-space: nowrap;
}

.monitoring-calculator__cta {
  width: 100%;
  min-height: 46px;
}

.monitoring-calculator__cta:active {
  translate: 0 1px;
  scale: 0.98;
}

.monitoring-calculator__status {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

@media (min-width: 901px) {
  .monitoring-calculator {
    padding: clamp(18px, 1.8vw, 24px);
  }

  .monitoring-calculator__head {
    margin-bottom: 14px;
  }

  .monitoring-calculator__form {
    gap: 9px;
  }

  .monitoring-calculator__results > div {
    padding: 11px 15px 13px;
  }

  .monitoring-calculator__results strong {
    margin-top: 4px;
  }
}

.monitoring-hero .breadcrumbs {
  padding-top: 30px;
  color: rgba(15, 35, 64, 0.58);
}

.monitoring-hero .breadcrumbs a {
  color: var(--sv-navy, #002f6c);
}

.monitoring-hero .breadcrumbs span[aria-hidden="true"] {
  color: rgba(15, 35, 64, 0.26);
}

.monitoring-hero__layout {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) var(--monitoring-card-width);
  flex: 1 1 auto;
  align-items: center;
  gap: clamp(56px, 8vw, 118px);
  padding: 42px 0 86px;
}

.monitoring-hero__copy {
  position: relative;
  z-index: 3;
  width: min(100%, 600px);
}

.monitoring-hero .eyebrow {
  margin-bottom: 22px;
  color: var(--sv-red, #ff0000);
}

.monitoring-hero .hero-title {
  max-width: 600px;
  color: var(--sv-navy-ink, #0f2340);
  font-size: clamp(40px, 3.05vw, 49px);
  font-weight: 760;
  letter-spacing: -0.045em;
  line-height: 1.01;
}

.monitoring-hero .hero-title__line:last-child {
  white-space: normal;
}

.monitoring-hero__nowrap {
  white-space: nowrap;
}

.monitoring-hero .hero-title__clip {
  margin-bottom: -0.09em;
  padding-bottom: 0.09em;
}

.monitoring-hero__offer {
  max-width: 540px;
  margin-top: 32px;
  gap: 16px;
}

.monitoring-hero .hero-lede {
  color: rgba(15, 35, 64, 0.72);
  font-size: 16px;
}

.monitoring-hero .hero-lede strong {
  color: var(--sv-navy-ink, #0f2340);
  font-size: 19px;
}

.monitoring-hero .hero-actions {
  margin-top: 30px;
}

.monitoring-hero .button--primary {
  border-color: var(--sv-navy, #002f6c);
  background-color: var(--sv-navy, #002f6c);
  color: #fff;
}

.monitoring-hero .button--primary:hover,
.monitoring-hero .button--primary:focus-visible {
  border-color: var(--sv-red, #ff0000);
}

.monitoring-hero .messenger-switch {
  border-color: rgba(0, 47, 108, 0.3);
}

.monitoring-card {
  position: relative;
  z-index: 4;
  align-self: center;
  width: 100%;
  overflow: visible;
  border: 1px solid rgba(255, 255, 255, 0.78);
  border-radius: 24px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.74), rgba(232, 240, 250, 0.48));
  box-shadow:
    0 28px 72px rgba(15, 35, 64, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.88);
  color: var(--sv-navy-ink, #0f2340);
  padding: 24px;
  -webkit-backdrop-filter: blur(28px) saturate(150%);
  backdrop-filter: blur(28px) saturate(150%);
  transition:
    border-color 240ms ease,
    box-shadow 320ms var(--ease-out, ease);
}

.monitoring-card:hover {
  border-color: rgba(255, 255, 255, 0.96);
  box-shadow: 0 34px 90px rgba(15, 35, 64, 0.23);
}

.monitoring-card__head,
.monitoring-card__route-label {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
}

.monitoring-card__head {
  gap: 12px;
  padding-bottom: 20px;
  border-bottom: 1px solid rgba(0, 47, 108, 0.12);
}

.monitoring-card__identity {
  display: grid;
  gap: 3px;
}

.monitoring-card__identity strong {
  color: var(--sv-navy, #002f6c);
  font-size: 16px;
  line-height: 1.2;
}

.monitoring-card__identity > span {
  color: var(--sv-gray-500, #6b7789);
  font-family: var(--service-font-data);
  font-size: 10px;
  font-weight: 750;
  letter-spacing: 0.015em;
  line-height: 1.3;
  white-space: nowrap;
}

.monitoring-card__online {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: var(--sv-navy, #002f6c);
  font-family: var(--service-font-data);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.monitoring-card__online i {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #5ec58d;
  box-shadow: 0 0 0 6px rgba(94, 197, 141, 0.14);
}

.monitoring-card__route {
  padding: 20px 0;
}

.monitoring-card__route-label {
  align-items: baseline;
  color: var(--sv-navy, #002f6c);
}

.monitoring-card__route-label span {
  font-size: 12px;
  font-weight: 750;
}

.monitoring-card__route-label strong {
  font-family: var(--service-font-data);
  font-size: 34px;
  letter-spacing: -0.04em;
  line-height: 1;
}

.monitoring-card__track {
  height: 6px;
  margin-top: 14px;
  overflow: hidden;
  border-radius: 999px;
  background: #dfe5ee;
}

.monitoring-card__track span {
  display: block;
  width: 74%;
  height: 100%;
  background: var(--sv-red, #ff0000);
  transform-origin: left center;
}

.monitoring-card__metrics {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.72);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.24);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.56);
}

.monitoring-card__metrics > div {
  position: relative;
  display: grid;
  min-height: 72px;
  align-content: center;
  gap: 7px;
  padding: 13px 14px;
  border-right: 1px solid rgba(0, 47, 108, 0.12);
  border-bottom: 1px solid rgba(0, 47, 108, 0.12);
}

.monitoring-card__metrics > div:nth-child(2n) {
  border-right: 0;
}

.monitoring-card__metrics > div:nth-last-child(-n + 2) {
  border-bottom: 0;
}

.monitoring-card__metrics span {
  color: var(--sv-gray-500, #6b7789);
  font-family: var(--service-font-data);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.monitoring-card__metrics strong {
  color: var(--sv-navy, #002f6c);
  font-size: 17px;
  letter-spacing: -0.02em;
}

.monitoring-card__metric-value {
  display: flex;
  align-items: center;
  gap: 6px;
}

.monitoring-card__metrics .monitoring-card__metric-separator {
  color: rgba(0, 47, 108, 0.42);
  font-size: 14px;
  font-weight: 650;
  line-height: 1;
}

.monitoring-card__metrics .monitoring-card__online {
  color: var(--sv-navy, #002f6c);
  font-size: 8px;
  letter-spacing: 0.05em;
}

.monitoring-card__fuel {
  padding-bottom: 22px !important;
}

.monitoring-card__fuel-bar {
  position: absolute;
  right: 14px;
  bottom: 10px;
  left: 14px;
  display: block;
  height: 3px;
  overflow: hidden;
  border-radius: 999px;
  background: #e1e6ee;
}

.monitoring-card__fuel-bar i {
  display: block;
  width: 79%;
  height: 100%;
  background: var(--sv-red, #ff0000);
}

.monitoring-card__signal {
  display: inline-flex;
  flex: 0 0 auto;
  align-self: flex-end;
  align-items: center;
  gap: 7px;
  margin-bottom: 1px;
}

.monitoring-card__signal-bars {
  display: flex;
  height: 16px;
  align-items: flex-end;
  gap: 3px;
}

.monitoring-card__signal-bars i {
  width: 3px;
  background: var(--sv-navy, #002f6c);
}

.monitoring-card__signal-bars i:nth-child(1) {
  height: 5px;
}

.monitoring-card__signal-bars i:nth-child(2) {
  height: 8px;
}

.monitoring-card__signal-bars i:nth-child(3) {
  height: 12px;
}

.monitoring-card__signal-bars i:nth-child(4) {
  height: 16px;
  background: var(--sv-red, #ff0000);
}

.monitoring-card__signal strong {
  color: var(--sv-navy, #002f6c);
  font-family: var(--service-font-data);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: 0.08em;
  line-height: 1;
}

.js .glonass-page .monitoring-hero .hero-title__fragment {
  opacity: 0;
  transform: translateY(112%);
}

.js .glonass-page.is-ready .monitoring-hero .hero-title__fragment {
  opacity: 1;
  transform: none;
  animation: driver-hero-title-reveal 480ms var(--hero-enter-ease) var(--hero-reveal-delay, 140ms) backwards;
}

.js .glonass-page .monitoring-hero [data-hero-mark] {
  color: var(--sv-navy-ink, #0f2340);
}

.glonass-page .monitoring-hero [data-hero-char] {
  display: inline-block;
  color: inherit;
  transition: color 160ms linear;
}

.js .glonass-page.is-ready .monitoring-hero [data-hero-mark] [data-hero-char] {
  color: var(--sv-red, #ff0000);
  transition-delay: calc(780ms + var(--i, 0) * 45ms);
}

.js .glonass-page.is-ready .monitoring-hero .hero-offer {
  animation: service-hero-enter-up 440ms var(--hero-enter-ease) 560ms backwards;
}

.js .glonass-page.is-ready .monitoring-hero .hero-actions {
  animation: service-hero-enter-up 440ms var(--hero-enter-ease) 760ms backwards;
}

.js .glonass-page .monitoring-card {
  opacity: 0;
}

.js .glonass-page.is-ready .monitoring-card {
  opacity: 1;
  animation: monitoring-card-enter 720ms var(--hero-enter-ease) 960ms backwards;
}

.js .glonass-page.is-ready .monitoring-hero__media {
  animation: monitoring-background-enter 1400ms var(--hero-enter-ease) backwards;
}

.js .glonass-page.is-ready .monitoring-card__track span,
.js .glonass-page.is-ready .monitoring-card__fuel-bar i {
  animation: monitoring-level-enter 900ms var(--hero-enter-ease) 1180ms backwards;
}

.js .glonass-page.is-ready .monitoring-card__online i {
  animation: monitoring-online-blink 1s steps(1, end) 1500ms infinite;
}

@keyframes monitoring-card-enter {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes monitoring-background-enter {
  from {
    filter: saturate(0.8);
    transform: scale(1.04);
  }

  to {
    filter: none;
    transform: scale(1.015);
  }
}

@keyframes monitoring-level-enter {
  from {
    transform: scaleX(0);
  }

  to {
    transform: scaleX(1);
  }
}

@keyframes monitoring-online-blink {
  0%,
  49% {
    opacity: 1;
  }

  50%,
  100% {
    opacity: 0;
  }
}

@media (max-width: 1100px) {
  .monitoring-hero {
    --monitoring-card-width: 310px;
  }

  .monitoring-final__callout {
    width: 240px;
    padding: 10px;
  }

  .monitoring-final__connection {
    gap: 3px;
    font-size: 8px !important;
    letter-spacing: -0.015em;
  }

  .monitoring-final__connection-active {
    gap: 3px;
  }

  .monitoring-final__connection-active i {
    width: 5px;
    height: 5px;
    flex-basis: 5px;
  }

  .monitoring-final__callout--terminal,
  .monitoring-final__callout--video {
    right: 52px;
  }

  .monitoring-final__closing {
    right: 22px;
    left: 22px;
  }

  .monitoring-final__closing p {
    max-width: 480px;
  }

  .monitoring-hero__layout {
    gap: 42px;
  }

  .monitoring-hero .hero-title {
    font-size: clamp(39px, 4.6vw, 48px);
  }

  .monitoring-card {
    padding: 20px;
  }

  .monitoring-card__identity > span {
    white-space: normal;
  }
}

@media (max-width: 900px) {
  .monitoring-final {
    display: none;
  }

  .monitoring-hero__result-frame {
    display: none;
  }

  .monitoring-hero,
  .monitoring-hero__inner {
    min-height: 1040px;
  }

  .monitoring-hero__media {
    background-position: 56% 50%;
  }

  .monitoring-hero__video,
  .monitoring-hero__initial-frame {
    object-position: 56% 50%;
  }

  .monitoring-hero__wash {
    background:
      linear-gradient(180deg, rgba(230, 240, 251, 0.9) 0%, rgba(230, 240, 251, 0.74) 40%, rgba(230, 240, 251, 0.12) 67%, rgba(220, 234, 248, 0.5) 100%),
      linear-gradient(90deg, rgba(232, 242, 252, 0.86) 0%, rgba(232, 242, 252, 0.5) 48%, transparent 82%);
  }

  .monitoring-hero__layout {
    grid-template-columns: minmax(0, 1fr);
    align-content: space-between;
    gap: 78px;
    padding: 40px 0 86px;
  }

  .monitoring-hero__copy {
    width: min(100%, 560px);
  }

  .monitoring-card {
    width: min(100%, 360px);
    justify-self: end;
  }

  .monitoring-result {
    position: relative;
    inset: auto;
    min-height: 680px;
    padding: 72px 24px;
    overflow: visible;
    background:
      linear-gradient(90deg, rgba(247, 248, 250, 0.9), rgba(247, 248, 250, 0.68)),
      url("./monitoring/glonass-monitoring-result.webp") 42% 50% / cover no-repeat;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transition: none;
  }

  .monitoring-calculator,
  .monitoring-hero.is-monitoring-result .monitoring-calculator {
    position: relative;
    top: auto;
    right: auto;
    width: min(100%, 560px);
    max-height: none;
    margin: 0 auto;
    opacity: 1;
    transform: none;
    transition: none;
  }
}

@media (max-width: 600px) {
  .monitoring-hero,
  .monitoring-hero__inner {
    min-height: 1110px;
  }

  .monitoring-hero__media {
    background-position: 56% 54%;
  }

  .monitoring-hero__video,
  .monitoring-hero__initial-frame {
    object-position: 56% 54%;
  }

  .monitoring-hero .breadcrumbs {
    padding-top: 24px;
    font-size: 11px;
  }

  .monitoring-hero__layout {
    gap: 60px;
    padding: 34px 0 78px;
  }

  .monitoring-hero .hero-title {
    max-width: 420px;
    font-size: clamp(34px, 10.2vw, 44px);
    line-height: 1.01;
    overflow-wrap: normal;
    word-break: normal;
    hyphens: none;
  }

  .monitoring-hero .hero-title__clip,
  .monitoring-hero .hero-title__fragment {
    overflow-wrap: normal;
    word-break: normal;
    hyphens: none;
  }

  .monitoring-hero__offer {
    margin-top: 26px;
  }

  .monitoring-hero .hero-lede {
    font-size: 14px;
  }

  .monitoring-hero .hero-lede strong {
    font-size: 17px;
  }

  .monitoring-hero .hero-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
  }

  .monitoring-hero .button--primary,
  .monitoring-hero .messenger-switch {
    width: 100%;
    min-width: 0;
  }

  .monitoring-card {
    width: 100%;
    padding: 18px;
  }

  .monitoring-card__route-label strong {
    font-size: 30px;
  }

  .monitoring-card__metrics > div {
    padding-inline: 11px;
  }

  .monitoring-card__metrics strong {
    font-size: 15px;
  }

  .monitoring-result {
    min-height: 0;
    padding: 56px 16px;
    background-position: 39% 50%;
  }

  .monitoring-calculator {
    padding: 18px 16px;
  }

  .monitoring-calculator__head h2 {
    font-size: 27px;
  }

  .monitoring-calculator .fuel-field {
    grid-template-columns: minmax(0, 1fr) 96px;
    column-gap: 9px;
  }

  .monitoring-calculator .fuel-field__control input {
    padding-right: 48px;
    font-size: 14px;
  }

  .monitoring-calculator__results {
    grid-template-columns: minmax(0, 1fr);
  }

  .monitoring-calculator__results > div + div {
    border-top: 1px solid rgba(255, 255, 255, 0.18);
    border-left: 0;
  }

  .monitoring-calculator__results strong {
    font-size: 22px;
  }
}

@media (max-width: 360px) {
  .monitoring-hero,
  .monitoring-hero__inner {
    min-height: 1150px;
  }

  .monitoring-hero .hero-title {
    font-size: 34px;
  }

  .monitoring-card__head {
    gap: 10px;
  }

  .monitoring-card__identity strong {
    font-size: 14px;
  }

  .monitoring-card__metrics strong {
    font-size: 14px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .monitoring-hero__result-frame {
    display: none;
  }

  .monitoring-result {
    position: relative;
    inset: auto;
    min-height: 680px;
    padding: 72px 24px;
    overflow: visible;
    background:
      linear-gradient(90deg, rgba(247, 248, 250, 0.9), rgba(247, 248, 250, 0.68)),
      url("./monitoring/glonass-monitoring-result.webp") 42% 50% / cover no-repeat;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }

  .monitoring-calculator,
  .monitoring-hero.is-monitoring-result .monitoring-calculator {
    position: relative;
    top: auto;
    right: auto;
    width: min(100%, 560px);
    max-height: none;
    margin: 0 auto;
    opacity: 1;
    transform: none;
  }

  .monitoring-final,
  .monitoring-final * {
    animation: none !important;
    transition: none !important;
  }

  .glonass-page .monitoring-hero__media,
  .glonass-page .monitoring-card,
  .glonass-page .monitoring-card:hover,
  .glonass-page .monitoring-card__track span,
  .glonass-page .monitoring-card__fuel-bar i,
  .glonass-page .monitoring-card__online i,
  .glonass-page .monitoring-hero .hero-title__fragment {
    opacity: 1;
    animation: none !important;
    transform: none;
    transition: none;
  }

  .glonass-page .monitoring-hero [data-hero-mark],
  .glonass-page .monitoring-hero [data-hero-char] {
    color: var(--sv-red, #ff0000);
    transition: none;
  }
}

@media (max-width: 600px) and (prefers-reduced-motion: reduce) {
  .monitoring-result {
    min-height: 0;
    padding: 56px 16px;
    background-position: 39% 50%;
  }

  .monitoring-calculator {
    padding: 18px 16px;
  }
}

@media (max-width: 900px) {
  .monitoring-hero__media {
    background-image: url("./monitoring/glonass-monitoring-hero-1920.webp");
  }

  .monitoring-result {
    background-image:
      linear-gradient(90deg, rgba(247, 248, 250, 0.9), rgba(247, 248, 250, 0.68)),
      url("./monitoring/glonass-monitoring-result-1920.webp");
  }
}

.monitoring-final__catalog-link {
  display: inline-flex;
  min-height: 34px;
  grid-column: 1 / -1;
  align-items: center;
  justify-content: center;
  margin-top: 3px;
  padding: 7px 12px;
  border: 1px solid var(--sv-navy, #002f6c);
  border-radius: 6px;
  background-color: var(--sv-navy, #002f6c);
  background-image: linear-gradient(90deg, var(--sv-red, #ff0000) 50%, transparent 50%);
  background-position: 100% 0;
  background-size: 200% 100%;
  color: #fff;
  font-size: 10px;
  font-weight: 800;
  line-height: 1.15;
  pointer-events: auto;
  text-align: center;
  transition:
    border-color 180ms ease,
    background-position 0.48s var(--ease-out, ease),
    color 180ms ease,
    translate 0.1s ease,
    scale 0.1s ease;
  touch-action: manipulation;
}

.monitoring-final__catalog-link:hover,
.monitoring-final__catalog-link:focus-visible {
  border-color: var(--sv-red, #ff0000);
  background-position: 0 0;
  color: #fff;
}

.monitoring-final__catalog-link:active {
  translate: 0 1px;
  scale: 0.98;
}

.monitoring-final__catalog-link:focus-visible {
  outline: 2px solid var(--sv-red, #ff0000);
  outline-offset: 2px;
}

.monitoring-catalog {
  position: relative;
  isolation: isolate;
  scroll-margin-top: 72px;
  overflow: hidden;
  padding: clamp(60px, 6vw, 84px) 24px clamp(82px, 9vw, 128px);
  background:
    radial-gradient(circle at 12% 8%, rgba(0, 105, 209, 0.42), transparent 36%),
    radial-gradient(circle at 88% 24%, rgba(42, 112, 207, 0.22), transparent 31%),
    linear-gradient(135deg, #03152f 0%, #062f67 54%, #07509b 100%);
  color: #fff;
}

.monitoring-catalog::before {
  position: absolute;
  z-index: -1;
  inset: 0;
  background-image:
    linear-gradient(rgba(150, 199, 255, 0.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(150, 199, 255, 0.055) 1px, transparent 1px);
  background-size: 48px 48px;
  content: "";
  -webkit-mask-image: radial-gradient(ellipse 94% 82% at 100% 0%, #000 0%, rgba(0, 0, 0, 0.92) 28%, rgba(0, 0, 0, 0.48) 56%, transparent 82%);
  mask-image: radial-gradient(ellipse 94% 82% at 100% 0%, #000 0%, rgba(0, 0, 0, 0.92) 28%, rgba(0, 0, 0, 0.48) 56%, transparent 82%);
}

.monitoring-catalog__inner {
  width: min(1240px, 100%);
  margin: 0 auto;
}

.monitoring-catalog__head {
  display: block;
}

.monitoring-catalog__eyebrow {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0;
  color: #fff;
  font-size: 12px;
  font-weight: 750;
  letter-spacing: 0.08em;
  line-height: 1.2;
  text-transform: uppercase;
}

.monitoring-catalog__eyebrow::before {
  width: 5px;
  height: 14px;
  background: var(--sv-red, #ff0000);
  content: "";
}

.monitoring-catalog__tabs {
  --monitoring-catalog-columns: 3;
  display: grid;
  grid-auto-columns: calc(100% / var(--monitoring-catalog-columns));
  grid-auto-flow: column;
  gap: 0;
  margin-top: clamp(28px, 4vw, 48px);
  padding: 0;
  overflow-x: auto;
  border: 0;
  border-top: 1px solid var(--sv-line, #dde3ec);
  border-bottom: 1px solid var(--sv-line, #dde3ec);
  border-left: 1px solid var(--sv-line, #dde3ec);
  border-radius: 0;
  background: #fff;
  scroll-snap-type: x proximity;
  scrollbar-width: none;
}

.monitoring-catalog__tabs::-webkit-scrollbar {
  display: none;
}

.monitoring-catalog__tab {
  display: inline-flex;
  min-width: 0;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 9px 18px;
  border: 0;
  border-right: 1px solid var(--sv-line, #dde3ec);
  border-radius: 0;
  background: transparent;
  color: var(--sv-gray-500, #6b7789);
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 760;
  scroll-snap-align: start;
  white-space: nowrap;
  transition:
    background-color 180ms ease,
    color 180ms ease;
}

.monitoring-catalog__tab span {
  display: grid;
  min-width: 20px;
  height: 20px;
  place-items: center;
  padding-inline: 5px;
  border-radius: 0;
  background: rgba(0, 47, 108, 0.08);
  font-family: var(--service-font-data);
  font-size: 9px;
}

.monitoring-catalog__tab:hover,
.monitoring-catalog__tab:focus-visible {
  background: rgba(0, 47, 108, 0.045);
  color: var(--sv-navy, #002f6c);
}

.monitoring-catalog__tab.is-active {
  background: var(--sv-navy, #002f6c);
  color: #fff;
  box-shadow: none;
}

.monitoring-catalog__tab.is-active span {
  background: rgba(255, 255, 255, 0.16);
  color: #fff;
}

.monitoring-catalog__tab.is-active:hover,
.monitoring-catalog__tab.is-active:focus-visible {
  background: var(--sv-navy, #002f6c);
  color: #fff;
}

.monitoring-catalog__tab:focus-visible {
  outline: 2px solid #ff4d4d;
  outline-offset: 2px;
}

.monitoring-catalog__panel {
  margin-top: 24px;
}

.monitoring-catalog__panel[hidden] {
  display: none;
}

.monitoring-product-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-top: 1px solid var(--sv-line, #dde3ec);
  border-left: 1px solid var(--sv-line, #dde3ec);
}

.monitoring-product-grid[hidden] {
  display: none;
}

.monitoring-product-grid--more {
  margin-top: 0;
  border-top: 0;
}

.monitoring-product-card {
  position: relative;
  display: flex;
  min-width: 0;
  flex-direction: column;
  overflow: hidden;
  border: 0;
  border-right: 1px solid var(--sv-line, #dde3ec);
  border-bottom: 1px solid var(--sv-line, #dde3ec);
  border-radius: 0;
  background: #fff;
  color: var(--sv-navy-ink, #0f2340);
  box-shadow: none;
}

.monitoring-product-card::after {
  position: absolute;
  z-index: 4;
  inset: 0;
  border: 2px solid transparent;
  pointer-events: none;
  content: "";
  transition: border-color 180ms ease;
}

.monitoring-product-card--featured {
  border-bottom-color: transparent;
  color: #fff;
  background: linear-gradient(180deg, #0a4d8f 0%, #06427f 38%, var(--sv-navy, #002f6c) 72%, #002758 100%);
}

@media (hover: hover) and (pointer: fine) {
  .monitoring-product-card:hover,
  .monitoring-product-card:focus-within {
    z-index: 1;
  }

  .monitoring-product-card:hover::after,
  .monitoring-product-card:focus-within::after {
    border-color: var(--driver-blue, #0a5bd8);
  }

  .monitoring-product-card--featured:hover::after,
  .monitoring-product-card--featured:focus-within::after {
    border-color: var(--sv-red, #ff0000);
  }
}

.monitoring-product-card__visual {
  position: relative;
  display: grid;
  min-height: 220px;
  place-items: center;
  overflow: hidden;
  padding: 26px 24px 18px;
  border-bottom: 1px solid var(--sv-line, #dde3ec);
  background: #fff;
}

.monitoring-product-card__visual::before {
  content: "";
  position: absolute;
  z-index: 0;
  bottom: 18px;
  left: 50%;
  width: 56%;
  height: 12px;
  border-radius: 50%;
  background: rgba(3, 15, 36, 0.52);
  filter: blur(6px);
  opacity: 0.9;
  transform: translateX(-50%) skewX(-10deg);
}

.monitoring-product-card__visual img {
  position: relative;
  z-index: 1;
  display: block;
  width: min(100%, 290px);
  max-height: 176px;
  object-fit: contain;
  filter:
    drop-shadow(0 7px 4px rgba(11, 28, 54, 0.34))
    drop-shadow(0 14px 9px rgba(11, 28, 54, 0.2));
}

.monitoring-product-card--source-photo .monitoring-product-card__visual::before {
  display: none;
}

.monitoring-product-card--source-photo .monitoring-product-card__visual img {
  filter: none;
  transform: scale(1.1);
}

.monitoring-product-card--image-plus-15 .monitoring-product-card__visual img {
  transform: scale(1.265);
}

.monitoring-product-card--image-plus-10 .monitoring-product-card__visual img {
  transform: scale(1.21);
}

.monitoring-product-card--image-plus-20 .monitoring-product-card__visual img {
  transform: scale(1.32);
}

.monitoring-product-card--image-plus-30 .monitoring-product-card__visual img {
  transform: scale(1.43);
}

.monitoring-product-card--wide-visual .monitoring-product-card__visual img {
  width: min(100%, 330px);
}

.monitoring-product-card--navtelecom .monitoring-product-card__visual img {
  width: min(100%, 310px);
}

.monitoring-product-card--studio-photo .monitoring-product-card__visual {
  background: #fff;
}

.monitoring-product-card--studio-photo .monitoring-product-card__visual::before {
  display: none;
}

.monitoring-product-card--studio-photo .monitoring-product-card__visual img {
  width: min(100%, 320px);
  max-height: 184px;
  filter: none;
  transform: scale(1.1);
}

.monitoring-product-card--fuel-photo .monitoring-product-card__visual img {
  width: min(100%, 320px);
  max-height: 184px;
  transform: translateY(18px) scale(1.1);
}

.monitoring-product-card--fls-one.monitoring-product-card--fuel-photo .monitoring-product-card__visual img {
  transform: translateY(65px) scale(1.46);
}

.monitoring-product-card--featured.monitoring-product-card--fuel-photo .monitoring-product-card__visual img {
  filter: none;
  mix-blend-mode: normal;
}

.monitoring-product-card__badge {
  position: absolute;
  z-index: 2;
  top: 18px;
  right: 18px;
  left: auto;
  display: none;
  min-height: 30px;
  gap: 8px;
  align-items: center;
  padding: 0 12px;
  border: 1px solid rgba(255, 255, 255, 0.74);
  border-radius: 0;
  background: rgba(255, 0, 0, 0.92);
  clip-path: none;
  color: #fff;
  box-shadow: 0 8px 22px rgba(0, 15, 42, 0.2);
  filter: none;
  font-family: var(--service-font-data);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.1em;
  line-height: 1;
  text-transform: uppercase;
}

.monitoring-product-card--featured .monitoring-product-card__badge,
.monitoring-product-card__badge--era {
  display: inline-flex;
  background: #ff0000;
  color: #fff;
}

.monitoring-product-card__badge::before {
  width: 6px;
  height: 6px;
  flex: 0 0 6px;
  background: #fff;
  content: "";
}

.monitoring-product-card__body > .monitoring-product-card__badge--era {
  position: static;
  min-height: 20px;
  align-self: flex-start;
  padding: 0 8px;
  box-shadow: none;
  font-size: 8px;
}

.monitoring-product-card__body > .monitoring-product-card__badge--era::before {
  width: 4px;
  height: 4px;
  flex-basis: 4px;
}

.monitoring-product-card__body {
  display: flex;
  min-width: 0;
  flex: 1;
  flex-direction: column;
  padding: 22px 24px 24px;
  background: #fff;
}

.monitoring-product-card__variant {
  margin: 0;
  color: var(--sv-red, #ff0000);
  font-size: 9px;
  font-weight: 820;
  letter-spacing: 0.08em;
  line-height: 1.2;
  text-transform: uppercase;
}

.monitoring-product-card h3 {
  margin: 7px 0 0;
  color: var(--sv-navy-ink, #0f2340);
  font-family: var(--service-font-body);
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.025em;
  line-height: 1.16;
}

.monitoring-product-card__summary {
  display: none;
  margin: 13px 0 0;
  border: 1px solid rgba(0, 47, 108, 0.16);
  background: rgba(0, 47, 108, 0.035);
}

.monitoring-product-card__summary summary {
  display: flex;
  min-height: 38px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 9px 11px;
  color: var(--sv-navy, #002f6c);
  cursor: pointer;
  font-size: 11.5px;
  font-weight: 750;
  line-height: 1.25;
  list-style: none;
}

.monitoring-product-card__summary summary::-webkit-details-marker {
  display: none;
}

.monitoring-product-card__summary summary::after {
  flex: 0 0 auto;
  color: var(--sv-red, #ff0000);
  content: "+";
  font-family: var(--service-font-data);
  font-size: 16px;
  font-weight: 780;
  line-height: 1;
}

.monitoring-product-card__summary[open] summary::after {
  content: "−";
}

.monitoring-product-card__summary summary:focus-visible {
  outline: 2px solid var(--sv-red, #ff0000);
  outline-offset: -2px;
}

.monitoring-product-card__description {
  margin: 0;
  padding: 0 11px 11px;
  color: var(--sv-gray-500, #6b7789);
  font-size: 12.5px;
  line-height: 1.52;
}

.monitoring-product-card__specs {
  display: grid;
  margin: 14px 0 0;
  border-top: 1px solid var(--sv-line, #dde3ec);
}

.monitoring-product-card__specs div {
  display: grid;
  min-height: 40px;
  grid-template-columns: minmax(0, 0.88fr) minmax(0, 1.12fr);
  gap: 14px;
  align-items: center;
  border-bottom: 1px solid var(--sv-line, #dde3ec);
}

.monitoring-product-card__specs dt,
.monitoring-product-card__specs dd {
  margin: 0;
  font-size: 11.5px;
  line-height: 1.34;
}

.monitoring-product-card__specs dt {
  color: rgba(15, 35, 64, 0.54);
}

.monitoring-product-card__specs dd {
  color: var(--sv-navy-ink, #0f2340);
  font-weight: 730;
  text-align: right;
}

.monitoring-product-card__footer {
  margin-top: auto;
  padding-top: 22px;
}

.monitoring-product-card__price {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
}

.monitoring-product-card__price span {
  color: rgba(15, 35, 64, 0.5);
  font-family: inherit;
  font-size: 11.5px;
  font-weight: 400;
  line-height: 1.34;
  letter-spacing: normal;
}

.monitoring-product-card__price strong {
  color: var(--sv-navy-ink, #0f2340);
  font-family: var(--service-font-data);
  font-size: 18px;
  font-weight: 820;
  letter-spacing: -0.03em;
}

.monitoring-product-card__actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

.monitoring-product-card__actions button,
.monitoring-product-card__actions a {
  display: inline-flex;
  min-width: 0;
  min-height: 46px;
  align-items: center;
  justify-content: center;
  padding: 9px 11px;
  border: 1px solid rgba(0, 47, 108, 0.18);
  border-radius: 0;
  background: #fff;
  color: var(--sv-navy, #002f6c);
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.15;
  text-align: center;
  transition:
    border-color 180ms ease,
    background-position 0.48s var(--ease-out, ease),
    color 180ms ease,
    translate 0.1s ease,
    scale 0.1s ease;
  touch-action: manipulation;
}

.monitoring-product-card__actions a {
  border-color: var(--sv-navy, #002f6c);
  background-color: var(--sv-navy, #002f6c);
  background-image: linear-gradient(90deg, var(--sv-red, #ff0000) 50%, transparent 50%);
  background-position: 100% 0;
  background-size: 200% 100%;
  color: #fff;
}

.monitoring-product-card__actions button:hover,
.monitoring-product-card__actions button:focus-visible {
  border-color: var(--sv-red, #ff0000);
  background: #fff;
  color: var(--sv-red, #ff0000);
}

.monitoring-product-card__actions a:hover,
.monitoring-product-card__actions a:focus-visible {
  border-color: var(--sv-red, #ff0000);
  background-position: 0 0;
  color: #fff;
}

.monitoring-product-card__actions button:focus-visible,
.monitoring-product-card__actions a:focus-visible {
  outline: 3px solid rgba(255, 0, 0, 0.18);
  outline-offset: 2px;
}

.monitoring-product-card__actions a:active,
.monitoring-product-card__actions button:active {
  translate: 0 1px;
  scale: 0.98;
}

.monitoring-product-card--featured .monitoring-product-card__visual {
  border-bottom-color: rgba(255, 255, 255, 0.2);
  background: transparent;
}

.monitoring-product-card--featured.monitoring-product-card--source-photo .monitoring-product-card__visual {
  border-bottom-color: rgba(255, 255, 255, 0.2);
  background: transparent;
}

.monitoring-product-card--featured.monitoring-product-card--source-photo .monitoring-product-card__visual img {
  filter:
    drop-shadow(0 8px 5px rgba(0, 18, 44, 0.32))
    drop-shadow(0 20px 16px rgba(0, 18, 44, 0.24));
}

.monitoring-product-card--featured.monitoring-product-card--source-photo.monitoring-product-card--fuel-photo .monitoring-product-card__visual img {
  filter: none;
  mix-blend-mode: normal;
}

.monitoring-product-card--featured.monitoring-product-card--source-photo.monitoring-product-card--fuel-photo .monitoring-product-card__visual {
  border-bottom-color: rgba(255, 255, 255, 0.2);
  background: transparent;
}

.monitoring-product-card--featured .monitoring-product-card__visual::before {
  background: rgba(0, 8, 24, 0.66);
}

.monitoring-product-card--featured .monitoring-product-card__body {
  background: transparent;
}

.monitoring-product-card--featured .monitoring-product-card__variant,
.monitoring-product-card--featured h3,
.monitoring-product-card--featured .monitoring-product-card__specs dd,
.monitoring-product-card--featured .monitoring-product-card__price strong {
  color: #fff;
}

.monitoring-product-card--featured .monitoring-product-card__variant {
  opacity: 0.72;
}

.monitoring-product-card--featured .monitoring-product-card__description {
  color: rgba(255, 255, 255, 0.72);
}

.monitoring-product-card--featured .monitoring-product-card__summary {
  border-color: rgba(255, 255, 255, 0.24);
  background: rgba(255, 255, 255, 0.08);
}

.monitoring-product-card--featured .monitoring-product-card__summary summary {
  color: #fff;
}

.monitoring-product-card--featured .monitoring-product-card__specs {
  border-top-color: rgba(255, 255, 255, 0.22);
}

.monitoring-product-card--featured .monitoring-product-card__specs div {
  border-bottom-color: rgba(255, 255, 255, 0.18);
}

.monitoring-product-card--featured .monitoring-product-card__specs dt,
.monitoring-product-card--featured .monitoring-product-card__price span {
  color: rgba(255, 255, 255, 0.62);
}

.monitoring-product-card--featured .monitoring-product-card__actions a,
.monitoring-product-card--featured .monitoring-product-card__actions button {
  border-color: #fff;
  background-color: #fff;
  color: var(--sv-navy, #002f6c);
}

.monitoring-product-card--featured .monitoring-product-card__actions a {
  background-image: linear-gradient(90deg, var(--sv-red, #ff0000) 50%, transparent 50%);
  background-position: 100% 0;
  background-size: 200% 100%;
}

.monitoring-product-card--featured .monitoring-product-card__actions a:hover,
.monitoring-product-card--featured .monitoring-product-card__actions a:focus-visible {
  border-color: var(--sv-red, #ff0000);
  background-position: 0 0;
  color: #fff;
}

.monitoring-product-card--featured .monitoring-product-card__actions button:hover,
.monitoring-product-card--featured .monitoring-product-card__actions button:focus-visible {
  border-color: var(--sv-red, #ff0000);
  background: #fff;
  color: var(--sv-red, #ff0000);
}

.monitoring-catalog__more {
  display: flex;
  justify-content: center;
  margin-top: 24px;
}

.monitoring-catalog__more[hidden] {
  display: none;
}

.monitoring-catalog__more-button {
  display: inline-flex;
  min-width: 220px;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  padding: 11px 24px;
  border: 1px solid var(--sv-navy, #002f6c);
  border-radius: 0;
  background-color: #fff;
  background-image: linear-gradient(90deg, var(--sv-red, #ff0000) 50%, transparent 50%);
  background-position: 100% 0;
  background-size: 200% 100%;
  color: var(--sv-navy, #002f6c);
  cursor: pointer;
  font: inherit;
  font-size: 13px;
  font-weight: 760;
  line-height: 1.2;
  transition:
    border-color 180ms ease,
    background-position 0.48s var(--ease-out, ease),
    color 180ms ease,
    translate 0.1s ease,
    scale 0.1s ease;
  touch-action: manipulation;
}

.monitoring-catalog__more-button:hover,
.monitoring-catalog__more-button:focus-visible {
  border-color: var(--sv-red, #ff0000);
  background-position: 0 0;
  color: #fff;
}

.monitoring-catalog__more-button:focus-visible {
  outline: 3px solid rgba(255, 0, 0, 0.18);
  outline-offset: 2px;
}

.monitoring-catalog__more-button:active {
  translate: 0 1px;
  scale: 0.98;
}

.monitoring-catalog__placeholder {
  display: grid;
  min-height: 360px;
  place-content: center;
  padding: 48px 24px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 0;
  background: rgba(3, 17, 41, 0.28);
  text-align: center;
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
}

.monitoring-catalog__placeholder span {
  color: #ff4b4b;
  font-size: 9px;
  font-weight: 820;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.monitoring-catalog__placeholder h3 {
  margin: 12px 0 0;
  color: #fff;
  font-size: clamp(28px, 4vw, 46px);
  letter-spacing: -0.045em;
}

.monitoring-catalog__placeholder p {
  margin: 12px 0 0;
  color: rgba(230, 240, 255, 0.66);
  font-size: 13px;
}

.monitoring-product-modal .product-dialog__image {
  min-height: 300px;
  border-radius: 0;
  background:
    radial-gradient(circle at 50% 44%, rgba(38, 111, 204, 0.3), transparent 46%),
    linear-gradient(145deg, #082650, #04172f);
}

.monitoring-product-modal .product-dialog__image::before {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(147, 199, 255, 0.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(147, 199, 255, 0.045) 1px, transparent 1px);
  background-size: 30px 30px;
  content: "";
}

.monitoring-product-modal .product-dialog__image img {
  max-height: 220px;
  object-fit: contain;
}

.monitoring-product-modal .product-dialog__summary {
  margin-top: 0;
}

.monitoring-product-modal .product-dialog__summary h2 {
  max-width: 520px;
  margin: 10px 0 0;
  color: var(--sv-navy-ink, #0f2340);
  font-family: var(--service-font-body);
  font-size: clamp(28px, 2.4vw, 34px);
  font-weight: 700;
  letter-spacing: -0.035em;
  line-height: 1.08;
}

.monitoring-product-modal .product-dialog__description {
  margin-top: 14px;
}

.monitoring-product-modal .product-dialog__decision {
  margin-top: 20px;
  padding: 15px;
  border: 1px solid rgba(0, 47, 108, 0.16);
  background: #f6f8fb;
}

.monitoring-product-modal .product-dialog__decision-price {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 20px;
}

.monitoring-product-modal .product-dialog__decision-price span {
  color: var(--sv-gray-500, #6b7789);
  font-size: 11px;
  font-weight: 650;
}

.monitoring-product-modal .product-dialog__decision-price strong {
  color: var(--sv-navy-ink, #0f2340);
  font-family: var(--service-font-data);
  font-size: 26px;
  font-weight: 820;
  letter-spacing: -0.035em;
  line-height: 1;
}

.monitoring-product-modal .product-dialog__decision h3 {
  margin: 14px 0 9px;
  color: var(--sv-navy-ink, #0f2340);
  font-size: 12px;
  font-weight: 750;
}

.monitoring-product-modal .product-dialog__highlights {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  margin: 0;
  padding: 1px;
  background: rgba(0, 47, 108, 0.13);
  list-style: none;
}

.monitoring-product-modal .product-dialog__highlights li {
  display: grid;
  min-height: 48px;
  align-content: center;
  gap: 2px;
  padding: 8px 10px;
  background: #fff;
}

.monitoring-product-modal .product-dialog__highlights strong {
  color: var(--sv-navy-ink, #0f2340);
  font-family: var(--service-font-data);
  font-size: 12px;
  font-weight: 780;
  line-height: 1.25;
}

.monitoring-product-modal .product-dialog__highlights span {
  color: var(--sv-gray-500, #6b7789);
  font-size: 10px;
  line-height: 1.3;
}

.monitoring-product-modal .product-dialog__documents {
  margin-top: 24px;
}

.monitoring-product-modal .product-dialog__document-list {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.monitoring-product-modal .product-dialog__visual {
  display: flex;
  flex-direction: column;
}

.monitoring-product-modal .product-dialog__actions {
  margin-top: 0;
  padding-top: 20px;
}

.monitoring-product-modal .product-dialog__actions > .button--primary {
  border-color: var(--sv-navy, #002f6c);
  background-color: var(--sv-navy, #002f6c);
  background-image: linear-gradient(90deg, var(--sv-red, #ff0000) 50%, transparent 50%);
  background-position: 100% 0;
  background-size: 200% 100%;
  color: #fff;
  transition:
    border-color 180ms ease,
    background-position 0.48s var(--ease-out, ease),
    color 180ms ease,
    translate 0.1s ease,
    scale 0.1s ease;
  touch-action: manipulation;
}

.monitoring-product-modal .product-dialog__actions > .button--primary:hover,
.monitoring-product-modal .product-dialog__actions > .button--primary:focus-visible {
  border-color: var(--sv-red, #ff0000);
  background-position: 0 0;
  color: #fff;
}

.monitoring-product-modal .product-dialog__actions > .button--primary:active {
  translate: 0 1px;
  scale: 0.98;
}

.monitoring-product-modal .product-dialog__actions .messenger-switch__action--telegram {
  border-left: 0;
  box-shadow:
    inset 0 1px 0 var(--sv-navy, #002f6c),
    inset -1px 0 0 var(--sv-navy, #002f6c),
    inset 0 -1px 0 var(--sv-navy, #002f6c);
}

.monitoring-product-modal .product-dialog__note {
  margin-top: 16px;
}

.monitoring-product-modal .product-dialog__info {
  display: flex;
}

.monitoring-product-modal .product-dialog__spec-group {
  margin-top: 0;
}

.monitoring-product-modal .product-dialog__specs div {
  min-height: 40px;
}

@media (max-width: 1100px) {
  .monitoring-catalog__tabs {
    --monitoring-catalog-columns: 2;
  }

  .monitoring-product-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .monitoring-product-card__description {
    min-height: 58px;
  }
}

@media (max-width: 760px) {
  .monitoring-catalog {
    padding: 68px 20px 80px;
  }

  .monitoring-catalog__head {
    grid-template-columns: minmax(0, 1fr);
    gap: 22px;
  }

  .monitoring-catalog__lead {
    max-width: 620px;
  }

  .monitoring-catalog__tabs {
    grid-auto-columns: max-content;
    margin-top: 36px;
  }

  .monitoring-product-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .monitoring-product-card__description {
    min-height: 0;
  }

  .monitoring-catalog__more-button {
    width: 100%;
  }

  .monitoring-product-modal .product-dialog__image {
    min-height: 220px;
  }
}

@media (max-width: 900px) {
  .monitoring-product-modal .product-dialog__grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
  }

  .monitoring-product-modal .product-dialog__visual,
  .monitoring-product-modal .product-dialog__info {
    display: block;
  }

  .monitoring-product-modal .product-dialog__visual {
    padding: 32px;
    border-right: 0;
    border-bottom: 1px solid var(--sv-line, #dde3ec);
  }

  .monitoring-product-modal .product-dialog__image {
    margin-top: 0;
    padding: 24px 16px;
  }

  .monitoring-product-modal .product-dialog__kicker {
    padding: 0;
  }

  .monitoring-product-modal .product-dialog__summary h2,
  .monitoring-product-modal .product-dialog__description,
  .monitoring-product-modal .product-dialog__documents,
  .monitoring-product-modal .product-dialog__note {
    margin-right: 0;
    margin-left: 0;
  }

  .monitoring-product-modal .product-dialog__documents {
    padding: 18px 0 0;
  }

  .monitoring-product-modal .product-dialog__actions {
    grid-template-columns: 1fr 1fr;
    padding: 0;
    background: transparent;
  }

  .monitoring-product-modal .product-dialog__document-list {
    grid-template-columns: 1fr;
  }

  .monitoring-product-modal .product-dialog__info {
    padding: 32px;
  }

  .monitoring-product-modal .product-dialog__spec-group {
    margin: 0;
  }
}

@media (max-width: 480px) {
  .monitoring-catalog {
    padding: 58px 16px 68px;
  }

  .monitoring-catalog__tabs {
    margin-inline: -16px;
    padding-inline: 16px;
    border-right: 0;
    border-left: 0;
    border-radius: 0;
  }

  .monitoring-catalog__tab {
    min-height: 44px;
    padding-inline: 14px;
  }

  .monitoring-product-card {
    border-radius: 0;
  }

  .monitoring-product-card__visual {
    min-height: 216px;
  }

  .monitoring-product-card__body {
    padding: 21px 18px 19px;
  }

  .monitoring-product-card h3 {
    font-size: 25px;
  }

  .monitoring-product-card__specs div {
    grid-template-columns: minmax(0, 0.82fr) minmax(0, 1.18fr);
    gap: 10px;
  }

  .monitoring-product-card__actions {
    grid-template-columns: minmax(0, 1fr);
  }

  .monitoring-product-card__actions button,
  .monitoring-product-card__actions a {
    min-height: 45px;
  }

  .monitoring-catalog__placeholder {
    min-height: 300px;
  }

  .monitoring-product-modal .product-dialog__visual,
  .monitoring-product-modal .product-dialog__info {
    padding: 24px 16px;
  }

  .monitoring-product-modal .product-dialog__actions {
    grid-template-columns: minmax(0, 1fr);
  }

  .monitoring-product-modal .product-dialog__highlights {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (prefers-reduced-motion: reduce) {
  .monitoring-product-card,
  .monitoring-product-card__visual img,
  .monitoring-product-card__actions a,
  .monitoring-product-modal .product-dialog__actions > .button--primary {
    transition: none;
  }
}

.monitoring-installation {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: clamp(76px, 8vw, 118px) 24px clamp(84px, 9vw, 132px);
  border-top: 1px solid rgba(145, 194, 255, 0.18);
  background:
    radial-gradient(circle at 8% 0%, rgba(0, 105, 209, 0.28), transparent 34%),
    linear-gradient(150deg, #03152f 0%, #062b5d 58%, #073f7d 100%);
  color: #fff;
}

.monitoring-installation::before {
  position: absolute;
  z-index: -1;
  inset: 0;
  background-image:
    linear-gradient(rgba(150, 199, 255, 0.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(150, 199, 255, 0.045) 1px, transparent 1px);
  background-size: 48px 48px;
  content: "";
  -webkit-mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.82), transparent 72%);
  mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.82), transparent 72%);
}

.monitoring-installation__inner {
  width: min(1240px, 100%);
  margin: 0 auto;
}

.monitoring-installation__head {
  max-width: 960px;
}

.monitoring-installation__head h2 {
  max-width: 900px;
  margin: 0;
  color: #fff;
  font-size: clamp(38px, 5vw, 66px);
  letter-spacing: -0.045em;
  line-height: 0.98;
}

.monitoring-installation__head p {
  max-width: 790px;
  margin: 24px 0 0;
  color: rgba(255, 255, 255, 0.76);
  font-size: clamp(16px, 1.5vw, 19px);
  line-height: 1.62;
}

.monitoring-installation__layout {
  display: grid;
  grid-template-columns: minmax(0, 1.28fr) minmax(360px, 0.72fr);
  gap: clamp(34px, 4.5vw, 58px);
  align-items: start;
  margin-top: clamp(46px, 6vw, 72px);
}

.monitoring-installation__content {
  display: grid;
  gap: 24px;
  min-width: 0;
}

.monitoring-installation__calibration {
  display: grid;
  grid-template-columns: minmax(0, 1.24fr) minmax(230px, 0.76fr);
  overflow: hidden;
  border: 1px solid rgba(174, 211, 255, 0.2);
  background: rgba(2, 18, 42, 0.44);
}

.monitoring-installation__calibration-copy {
  padding: clamp(28px, 4vw, 46px);
}

.monitoring-installation__calibration h3,
.monitoring-installation__proof h3,
.monitoring-installation__geo h3 {
  margin: 0;
  color: #fff;
  letter-spacing: -0.025em;
  line-height: 1.12;
}

.monitoring-installation__calibration h3 {
  font-size: clamp(27px, 3vw, 38px);
}

.monitoring-installation__calibration-copy > p {
  margin: 18px 0 0;
  color: rgba(255, 255, 255, 0.76);
  font-size: 15px;
  line-height: 1.66;
}

.monitoring-installation__metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 30px 0 0;
  border-top: 1px solid rgba(174, 211, 255, 0.2);
}

.monitoring-installation__metrics div {
  min-width: 0;
  padding: 19px 14px 0 0;
}

.monitoring-installation__metrics div + div {
  padding-left: 14px;
  border-left: 1px solid rgba(174, 211, 255, 0.2);
}

.monitoring-installation__metrics dt {
  color: rgba(255, 255, 255, 0.58);
  font-size: 10px;
  font-weight: 750;
  letter-spacing: 0.06em;
  line-height: 1.35;
  text-transform: uppercase;
}

.monitoring-installation__metrics dd {
  margin: 8px 0 0;
  color: #fff;
  font-family: var(--service-font-data);
  font-size: clamp(24px, 2.4vw, 34px);
  font-weight: 850;
  letter-spacing: -0.035em;
  line-height: 1;
}

.monitoring-installation__sensor {
  position: relative;
  display: grid;
  min-width: 0;
  align-content: end;
  margin: 0;
  padding: 32px 24px 28px;
  border-left: 1px solid rgba(174, 211, 255, 0.18);
  background:
    radial-gradient(circle at 50% 38%, rgba(51, 145, 255, 0.34), transparent 52%),
    rgba(8, 47, 92, 0.54);
}

.monitoring-installation__sensor img {
  display: block;
  width: min(100%, 330px);
  height: auto;
  max-height: 340px;
  margin: auto;
  object-fit: contain;
  filter: drop-shadow(0 26px 42px rgba(0, 0, 0, 0.28));
}

.monitoring-installation__sensor figcaption {
  margin-top: 20px;
  color: rgba(255, 255, 255, 0.68);
  font-size: 12px;
  line-height: 1.48;
}

.monitoring-installation__proof {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border-top: 1px solid rgba(174, 211, 255, 0.2);
  border-bottom: 1px solid rgba(174, 211, 255, 0.2);
}

.monitoring-installation__proof article {
  padding: 28px 28px 30px 0;
}

.monitoring-installation__proof article + article {
  padding-right: 0;
  padding-left: 28px;
  border-left: 1px solid rgba(174, 211, 255, 0.2);
}

.monitoring-installation__proof h3 {
  font-size: 22px;
}

.monitoring-installation__proof p {
  margin: 12px 0 0;
  color: rgba(255, 255, 255, 0.72);
  font-size: 14px;
  line-height: 1.62;
}

.monitoring-installation__geo {
  padding: 27px 30px 30px;
  border-left: 3px solid var(--sv-red, #ff0000);
  background: rgba(2, 18, 42, 0.56);
}

.monitoring-installation__geo h3 {
  font-size: 23px;
}

.monitoring-installation__regions {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(210px, 0.6fr);
  gap: 28px;
  margin-top: 20px;
}

.monitoring-installation__regions strong {
  color: #fff;
  font-size: 13px;
}

.monitoring-installation__regions p {
  margin: 8px 0 0;
  color: rgba(255, 255, 255, 0.68);
  font-size: 13px;
  line-height: 1.62;
}

.monitoring-installation__form-card {
  position: sticky;
  top: 92px;
  margin: 0;
  box-shadow: 0 34px 84px rgba(0, 0, 0, 0.28);
}

.monitoring-installation__field--wide {
  grid-column: 1 / -1;
}

.monitoring-installation__form-card .estimate-submit {
  min-height: 52px;
}

@media (max-width: 1040px) {
  .monitoring-installation__layout {
    grid-template-columns: minmax(0, 1fr) 360px;
    gap: 32px;
  }

  .monitoring-installation__calibration {
    grid-template-columns: minmax(0, 1fr);
  }

  .monitoring-installation__sensor {
    grid-template-columns: minmax(180px, 0.46fr) minmax(0, 0.54fr);
    gap: 24px;
    align-items: center;
    border-top: 1px solid rgba(174, 211, 255, 0.18);
    border-left: 0;
  }

  .monitoring-installation__sensor img {
    max-height: 220px;
  }

  .monitoring-installation__sensor figcaption {
    margin-top: 0;
  }

  .monitoring-installation__form-card .form-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .monitoring-installation__field--wide {
    grid-column: auto;
  }
}

/* Final cascade for the unified installation composition */

#professional-installation {
  padding: clamp(54px, 5.5vw, 72px) 24px clamp(58px, 6vw, 80px);
}

#professional-installation .monitoring-installation__head {
  display: block;
  max-width: 960px;
  padding-left: clamp(18px, 2.2vw, 28px);
  border-left: 3px solid var(--sv-red, #ff0000);
}

#professional-installation .monitoring-installation__head h2 {
  max-width: 860px;
  font-size: clamp(34px, 4vw, 50px);
  line-height: 1.02;
}

#professional-installation .monitoring-installation__head p {
  max-width: 830px;
  margin-top: 16px;
  font-size: clamp(15px, 1.15vw, 17px);
  line-height: 1.55;
}

#professional-installation .monitoring-installation__layout {
  margin-top: clamp(26px, 3vw, 34px);
}

#professional-installation .monitoring-installation__content {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 16px;
}

#professional-installation .monitoring-installation__metrics {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0;
  border-top: 1px solid #dce5ee;
  background: #f8fafc;
}

#professional-installation .monitoring-installation__metrics div {
  display: block;
  padding: 16px clamp(16px, 2.3vw, 28px) 18px;
}

#professional-installation .monitoring-installation__metrics div + div {
  padding-left: clamp(16px, 2.3vw, 28px);
  border-top: 0;
  border-left: 1px solid #dce5ee;
}

#professional-installation .monitoring-installation__metrics dd {
  margin-top: 5px;
}

#professional-installation .monitoring-installation__geo {
  display: grid;
  grid-template-columns: minmax(300px, 0.72fr) minmax(0, 1.8fr);
  gap: clamp(32px, 5vw, 72px);
  align-items: center;
  min-width: 0;
  min-height: 150px;
  padding: 30px clamp(28px, 3.5vw, 44px);
  border: 0;
  border-left: 4px solid var(--sv-red, #ff0000);
  background: #083975;
}

#professional-installation .monitoring-installation__geo h3 {
  color: #fff;
  font-size: 20px;
  line-height: 1.2;
}

#professional-installation .monitoring-installation__geo > p {
  max-width: 760px;
  margin: 0;
  color: #d8e4f2;
  font-size: clamp(14px, 1.2vw, 16px);
  line-height: 1.55;
}

@media (max-width: 900px) {
  #professional-installation .monitoring-installation__head {
    max-width: 820px;
  }

  #professional-installation .monitoring-installation__geo {
    grid-template-columns: minmax(0, 1fr);
    gap: 20px;
    min-height: 0;
  }

  #professional-installation .monitoring-installation__geo > p {
    max-width: none;
  }
}

@media (max-width: 620px) {
  #professional-installation {
    padding: 46px 16px 54px;
  }

  #professional-installation .monitoring-installation__head {
    padding-left: 16px;
  }

  #professional-installation .monitoring-installation__head h2 {
    font-size: clamp(28px, 8.7vw, 35px);
    line-height: 1.04;
  }

  #professional-installation .monitoring-installation__head p {
    margin-top: 14px;
    font-size: 15px;
  }

  #professional-installation .monitoring-installation__layout {
    margin-top: 24px;
  }

  #professional-installation .monitoring-installation__metrics {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  #professional-installation .monitoring-installation__metrics div {
    display: block;
    padding: 13px 10px 15px;
  }

  #professional-installation .monitoring-installation__metrics div + div {
    padding-left: 10px;
    border-top: 0;
    border-left: 1px solid #dce5ee;
  }

  #professional-installation .monitoring-installation__metrics dd {
    margin-top: 6px;
  }

  #professional-installation .monitoring-installation__geo {
    gap: 18px;
    padding: 24px 20px 26px;
  }

  #professional-installation .monitoring-installation__geo h3 {
    font-size: 19px;
  }

  #professional-installation .monitoring-installation__geo > p {
    font-size: 14px;
    line-height: 1.52;
  }
}

@media (max-width: 360px) {
  #professional-installation .monitoring-installation__geo-title {
    gap: 12px;
  }

  #professional-installation .monitoring-installation__geo-title svg {
    width: 38px;
    flex-basis: 38px;
  }

  #professional-installation .monitoring-installation__geo h3 {
    font-size: 17px;
  }
}

/* GLONASS price comparison */

.price-match--monitoring .messenger-switch__action--max {
  background: var(--sv-navy-deep, #011e46);
}

.price-match--monitoring .price-match__invoice-edit::before {
  top: 72%;
  right: 5%;
  left: 51%;
  height: 2px;
}

.price-match--monitoring .price-match__invoice-edit span {
  top: 77.5%;
  right: 7%;
  font-size: clamp(23px, 1.9vw, 29px);
  transform: rotate(-4deg);
}

.glonass-page .price-match__cta--secondary {
  background-color: #fff;
  background-image: none;
  background-position: 0 0;
  color: var(--sv-navy, #002f6c);
  transition:
    border-color 180ms ease,
    color 180ms ease;
}

.glonass-page .price-match__cta--secondary:hover,
.glonass-page .price-match__cta--secondary:focus-visible {
  border-color: var(--sv-red, #ff0000);
  background-color: #fff;
  background-image: none;
  color: var(--sv-red, #ff0000);
}

/* Unified professional installation block */

.monitoring-installation {
  padding: clamp(54px, 5.5vw, 72px) 24px clamp(58px, 6vw, 80px);
}

.monitoring-installation__head {
  display: block;
  max-width: 960px;
  padding-left: clamp(18px, 2.2vw, 28px);
  border-left: 3px solid var(--sv-red, #ff0000);
}

.monitoring-installation__eyebrow {
  display: block;
  margin-bottom: 12px;
  color: #e31b16;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.12em;
  line-height: 1.2;
  text-transform: uppercase;
}

.monitoring-installation__head h2 {
  max-width: 860px;
  font-size: clamp(34px, 4vw, 50px);
  line-height: 1.02;
}

.monitoring-installation__head p {
  max-width: 830px;
  margin-top: 16px;
  color: #40536b;
  font-size: clamp(15px, 1.15vw, 17px);
  line-height: 1.55;
}

.monitoring-installation__layout {
  margin-top: clamp(26px, 3vw, 34px);
}

.monitoring-installation__content {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 16px;
}

.monitoring-installation__expertise {
  overflow: hidden;
  border: 1px solid #d7e1ec;
  background: #fff;
}

.monitoring-installation__expertise-head {
  padding: clamp(22px, 2.5vw, 28px) clamp(22px, 2.8vw, 32px) 20px;
  border-bottom: 1px solid #dce5ee;
}

.monitoring-installation__expertise-head h3 {
  margin: 0;
  color: #082d5d;
  font-size: clamp(24px, 2.4vw, 30px);
  letter-spacing: -0.025em;
  line-height: 1.1;
}

.monitoring-installation__expertise-head p {
  max-width: 800px;
  margin: 9px 0 0;
  color: #52647a;
  font-size: 14px;
  line-height: 1.5;
}

.monitoring-installation__expertise-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.monitoring-installation__expertise-grid section {
  min-width: 0;
  padding: 22px clamp(20px, 2.3vw, 28px) 24px;
}

.monitoring-installation__expertise-grid section + section {
  border-left: 1px solid #dce5ee;
}

.monitoring-installation__expertise-grid section::before {
  display: block;
  width: 28px;
  height: 2px;
  margin-bottom: 14px;
  background: var(--sv-red, #ff0000);
  content: "";
}

.monitoring-installation__expertise-grid h4 {
  margin: 0;
  color: #082d5d;
  font-size: clamp(17px, 1.5vw, 20px);
  letter-spacing: -0.015em;
  line-height: 1.2;
}

.monitoring-installation__expertise-grid p {
  margin: 9px 0 0;
  color: #52647a;
  font-size: 14px;
  line-height: 1.52;
}

.monitoring-installation__metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0;
  border-top: 1px solid #dce5ee;
  background: #f8fafc;
}

.monitoring-installation__metrics div {
  min-width: 0;
  padding: 16px clamp(16px, 2.3vw, 28px) 18px;
}

.monitoring-installation__metrics div + div {
  border-left: 1px solid #dce5ee;
}

.monitoring-installation__metrics dt {
  color: #64748a;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.08em;
  line-height: 1.25;
  text-transform: uppercase;
}

.monitoring-installation__metrics dd {
  margin-top: 5px;
  color: #062a58;
  font-size: clamp(23px, 2.2vw, 29px);
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1;
}

.monitoring-installation__geo {
  display: grid;
  grid-template-columns: minmax(300px, 0.72fr) minmax(0, 1.8fr);
  gap: clamp(32px, 5vw, 72px);
  align-items: center;
  min-width: 0;
  min-height: 150px;
  padding: 30px clamp(28px, 3.5vw, 44px);
  border: 0;
  border-left: 4px solid var(--sv-red, #ff0000);
  background: #083975;
}

.monitoring-installation__geo-title {
  display: flex;
  gap: 20px;
  align-items: center;
  min-width: 0;
}

.monitoring-installation__geo-title svg {
  width: 52px;
  height: auto;
  flex: 0 0 52px;
  color: var(--sv-red, #ff0000);
}

.monitoring-installation__geo h3 {
  margin: 0;
  color: #fff;
  font-size: clamp(21px, 2vw, 25px);
  letter-spacing: -0.02em;
  line-height: 1.18;
}

.monitoring-installation__geo > p {
  max-width: 760px;
  margin: 0;
  color: #d8e4f2;
  font-size: clamp(14px, 1.2vw, 16px);
  line-height: 1.55;
}

@media (max-width: 900px) {
  .monitoring-installation__head {
    max-width: 820px;
  }

  .monitoring-installation__expertise-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .monitoring-installation__expertise-grid section + section {
    border-top: 1px solid #dce5ee;
    border-left: 0;
  }

  .monitoring-installation__geo {
    grid-template-columns: minmax(0, 1fr);
    gap: 20px;
    min-height: 0;
  }

  .monitoring-installation__geo > p {
    max-width: none;
  }
}

@media (max-width: 620px) {
  .monitoring-installation {
    padding: 46px 16px 54px;
  }

  .monitoring-installation__head {
    padding-left: 16px;
  }

  .monitoring-installation__eyebrow {
    margin-bottom: 10px;
  }

  .monitoring-installation__head h2 {
    font-size: clamp(28px, 8.7vw, 35px);
    line-height: 1.04;
  }

  .monitoring-installation__head p {
    margin-top: 14px;
    font-size: 15px;
  }

  .monitoring-installation__layout {
    margin-top: 24px;
  }

  .monitoring-installation__expertise-head {
    padding: 20px 18px 18px;
  }

  .monitoring-installation__expertise-head h3 {
    font-size: 23px;
  }

  .monitoring-installation__expertise-grid section {
    padding: 20px 18px 21px;
  }

  .monitoring-installation__expertise-grid h4 {
    font-size: 18px;
  }

  .monitoring-installation__metrics {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .monitoring-installation__metrics div {
    display: block;
    padding: 13px 10px 15px;
  }

  .monitoring-installation__metrics div + div {
    border-top: 0;
    border-left: 1px solid #dce5ee;
  }

  .monitoring-installation__metrics dt {
    font-size: 9px;
    letter-spacing: 0.04em;
  }

  .monitoring-installation__metrics dd {
    margin-top: 6px;
    font-size: clamp(20px, 6vw, 24px);
  }

  .monitoring-installation__geo {
    gap: 18px;
    padding: 24px 20px 26px;
  }

  .monitoring-installation__geo-title {
    gap: 15px;
    align-items: flex-start;
  }

  .monitoring-installation__geo-title svg {
    width: 42px;
    flex-basis: 42px;
  }

  .monitoring-installation__geo h3 {
    font-size: 21px;
  }

  .monitoring-installation__geo > p {
    font-size: 14px;
    line-height: 1.52;
  }
}

/* Compact light professional installation */

.monitoring-installation {
  overflow: visible;
  padding: clamp(56px, 6vw, 82px) 24px clamp(62px, 6.5vw, 90px);
  border-top: 1px solid #dce5ef;
  background: #f4f7fb;
  color: #0a2b57;
}

.monitoring-installation::before {
  display: none;
}

.monitoring-installation__inner {
  width: min(1180px, 100%);
}

.monitoring-installation__head {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(340px, 0.72fr);
  gap: clamp(32px, 5vw, 68px);
  align-items: end;
  max-width: none;
}

.monitoring-installation__head h2 {
  max-width: 720px;
  color: #062a58;
  font-size: clamp(34px, 4vw, 52px);
  letter-spacing: -0.04em;
  line-height: 1.02;
}

.monitoring-installation__head p {
  max-width: 620px;
  margin: 0;
  color: #41546d;
  font-size: clamp(15px, 1.25vw, 17px);
  line-height: 1.6;
}

.monitoring-installation__layout {
  grid-template-columns: minmax(0, 1fr);
  gap: 0;
  margin-top: clamp(28px, 3.5vw, 40px);
}

.monitoring-installation__content {
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 16px;
}

.monitoring-installation__calibration {
  display: block;
  grid-column: span 7;
  overflow: visible;
  border: 1px solid #d7e1ec;
  background: #fff;
}

.monitoring-installation__calibration-copy {
  padding: clamp(24px, 2.8vw, 34px);
}

.monitoring-installation__calibration h3,
.monitoring-installation__proof h3,
.monitoring-installation__geo h3 {
  color: #082d5d;
}

.monitoring-installation__calibration h3 {
  max-width: 640px;
  font-size: clamp(25px, 2.5vw, 32px);
  line-height: 1.08;
}

.monitoring-installation__calibration-copy > p {
  max-width: 690px;
  margin-top: 14px;
  color: #40536b;
  font-size: 15px;
  line-height: 1.58;
}

.monitoring-installation__calibration-details {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  margin-top: 18px;
}

.monitoring-installation__calibration-details p {
  margin: 0;
  color: #52647a;
  font-size: 14px;
  line-height: 1.58;
}

.monitoring-installation__metrics {
  margin-top: 22px;
  border-color: #dce5ee;
}

.monitoring-installation__metrics div {
  padding: 16px 12px 0 0;
}

.monitoring-installation__metrics div + div {
  border-color: #dce5ee;
}

.monitoring-installation__metrics dt {
  color: #64748a;
}

.monitoring-installation__metrics dd {
  color: #062a58;
  font-size: clamp(23px, 2.2vw, 30px);
}

.monitoring-installation__proof {
  display: grid;
  grid-column: span 5;
  grid-template-columns: minmax(0, 1fr);
  gap: 16px;
  border: 0;
}

.monitoring-installation__proof article,
.monitoring-installation__proof article + article {
  padding: 24px;
  border: 1px solid #d7e1ec;
  background: #fff;
}

.monitoring-installation__proof h3 {
  font-size: 20px;
}

.monitoring-installation__proof p {
  margin-top: 10px;
  color: #52647a;
  font-size: 14px;
  line-height: 1.58;
}

.monitoring-installation__geo {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: minmax(250px, 0.72fr) minmax(0, 1.28fr);
  gap: clamp(28px, 4vw, 52px);
  align-items: start;
  padding: 24px 26px;
  border: 1px solid #d7e1ec;
  border-left: 3px solid var(--sv-red, #ff0000);
  background: #fff;
}

.monitoring-installation__geo h3 {
  font-size: clamp(20px, 2vw, 24px);
  line-height: 1.18;
}

.monitoring-installation__regions {
  grid-template-columns: minmax(0, 1.45fr) minmax(180px, 0.55fr);
  gap: 24px;
  margin-top: 0;
}

.monitoring-installation__regions strong {
  color: #082d5d;
}

.monitoring-installation__regions p {
  margin-top: 6px;
  color: #52647a;
  line-height: 1.55;
}

@media (max-width: 900px) {
  .monitoring-installation__head {
    grid-template-columns: minmax(0, 1fr);
    gap: 16px;
    align-items: start;
  }

  .monitoring-installation__head p {
    max-width: 760px;
  }

  .monitoring-installation__content {
    grid-template-columns: minmax(0, 1fr);
  }

  .monitoring-installation__calibration,
  .monitoring-installation__proof,
  .monitoring-installation__geo {
    grid-column: 1;
  }
}

@media (max-width: 620px) {
  .monitoring-installation {
    padding: 48px 16px 56px;
  }

  .monitoring-installation__head h2 {
    font-size: clamp(28px, 8.7vw, 35px);
    line-height: 1.04;
  }

  .monitoring-installation__head p {
    font-size: 15px;
    line-height: 1.55;
  }

  .monitoring-installation__layout {
    margin-top: 24px;
  }

  .monitoring-installation__calibration-copy {
    padding: 22px 19px 24px;
  }

  .monitoring-installation__calibration h3 {
    font-size: 24px;
  }

  .monitoring-installation__calibration-details {
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
  }

  .monitoring-installation__metrics {
    grid-template-columns: minmax(0, 1fr);
    margin-top: 18px;
  }

  .monitoring-installation__metrics div {
    padding: 13px 0;
  }

  .monitoring-installation__metrics div + div {
    border-color: #dce5ee;
  }

  .monitoring-installation__metrics dd {
    font-size: 24px;
  }

  .monitoring-installation__proof {
    gap: 12px;
  }

  .monitoring-installation__proof article,
  .monitoring-installation__proof article + article {
    padding: 20px 19px;
  }

  .monitoring-installation__geo {
    grid-template-columns: minmax(0, 1fr);
    gap: 16px;
    padding: 20px 18px;
  }

  .monitoring-installation__regions {
    grid-template-columns: minmax(0, 1fr);
    gap: 14px;
  }
}

@media (max-width: 820px) {
  .monitoring-installation {
    padding-inline: 20px;
  }

  .monitoring-installation__layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .monitoring-installation__form-card {
    position: relative;
    top: auto;
  }

  .monitoring-installation__form-card .form-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .monitoring-installation__field--wide {
    grid-column: 1 / -1;
  }
}

@media (max-width: 620px) {
  .monitoring-installation {
    padding: 66px 16px 76px;
  }

  .monitoring-installation__head h2 {
    overflow-wrap: normal;
    font-size: clamp(27px, 8.4vw, 35px);
    line-height: 1.04;
    word-break: normal;
  }

  .monitoring-installation__head p {
    margin-top: 20px;
    font-size: 15px;
  }

  .monitoring-installation__layout {
    margin-top: 38px;
  }

  .monitoring-installation__calibration-copy {
    padding: 26px 20px 28px;
  }

  .monitoring-installation__metrics {
    grid-template-columns: minmax(0, 1fr);
  }

  .monitoring-installation__metrics div {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 18px;
    align-items: end;
    padding: 15px 0;
  }

  .monitoring-installation__metrics div + div {
    padding-left: 0;
    border-top: 1px solid rgba(174, 211, 255, 0.2);
    border-left: 0;
  }

  .monitoring-installation__metrics dd {
    margin: 0;
  }

  .monitoring-installation__sensor {
    grid-template-columns: minmax(0, 1fr);
  }

  .monitoring-installation__sensor figcaption {
    margin-top: 14px;
  }

  .monitoring-installation__proof {
    grid-template-columns: minmax(0, 1fr);
  }

  .monitoring-installation__proof article {
    padding: 24px 0;
  }

  .monitoring-installation__proof article + article {
    padding-left: 0;
    border-top: 1px solid rgba(174, 211, 255, 0.2);
    border-left: 0;
  }

  .monitoring-installation__geo {
    padding: 24px 20px 26px;
  }

  .monitoring-installation__regions {
    grid-template-columns: minmax(0, 1fr);
    gap: 20px;
  }

  .monitoring-installation__form-card .form-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .monitoring-installation__field--wide {
    grid-column: auto;
  }
}