/* Modern presentation shared by legacy service pages. */
.legacy-service-modern .page-hero {
  position: relative;
  overflow: hidden;
  padding: 124px 0 76px;
  color: var(--ink);
  background:
    linear-gradient(rgba(64, 139, 190, .035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(64, 139, 190, .035) 1px, transparent 1px),
    radial-gradient(circle at 78% 26%, rgba(70, 190, 255, .18), transparent 31%),
    radial-gradient(circle at 9% 72%, rgba(8, 120, 209, .08), transparent 29%),
    linear-gradient(180deg, #fbfdff 0%, #f4faff 100%);
  background-size: 48px 48px, 48px 48px, auto, auto, auto;
  background-attachment: scroll;
  border-bottom: 1px solid #e1ebf2;
}

.legacy-service-modern .page-hero .container {
  grid-template-columns: 1.08fr .72fr;
  gap: 68px;
  align-items: center;
}

.legacy-service-modern .page-hero .breadcrumb {
  padding: 0 0 26px;
}

.legacy-service-modern .page-hero .breadcrumb ol {
  color: #718596;
}

.legacy-service-modern .page-hero .breadcrumb a {
  color: #587286;
}

.legacy-service-modern .page-hero .breadcrumb a:hover {
  color: #0a669d;
}

.legacy-service-modern .page-hero .breadcrumb li:not(:last-child)::after {
  color: #a4b5c1;
}

.legacy-service-modern .page-hero .breadcrumb li:last-child {
  color: #243f53;
}

.legacy-service-modern .page-hero h1 {
  max-width: 700px;
  margin-bottom: 22px;
  color: #10263a;
  font-size: clamp(46px, 4.8vw, 66px);
  line-height: 1.08;
  letter-spacing: -.052em;
}

.legacy-service-modern .page-hero h1 span {
  display: block;
  color: #3279c4;
}

.legacy-service-modern .page-hero p.lead {
  max-width: 650px;
  margin-bottom: 28px;
  color: #526a7c;
  font-size: 17.5px;
  line-height: 1.72;
}

.legacy-service-modern .page-hero .hero-badges {
  gap: 10px;
}

.legacy-service-modern .page-hero .hero-badge {
  padding: 8px 13px;
  border: 1px solid #d5e3ec;
  border-radius: 10px;
  background: rgba(255, 255, 255, .76);
  color: #3f5c70;
  font-size: 12.5px;
  box-shadow: 0 8px 20px rgba(32, 88, 124, .045);
}

.legacy-service-modern .page-hero .price-box {
  position: relative;
  padding: 38px;
  border: 1px solid rgba(181, 204, 219, .8);
  border-radius: 20px;
  background: rgba(255, 255, 255, .96);
  color: #152c3d;
  text-align: left;
  box-shadow: 0 28px 68px -28px rgba(20, 68, 99, .38);
  backdrop-filter: blur(14px);
}

.legacy-service-modern .page-hero .price-box .amount {
  display: block;
  color: #10263a;
  font-size: 54px;
  line-height: 1;
  letter-spacing: -.055em;
}

.legacy-service-modern .page-hero .price-box .per {
  display: block;
  margin: 10px 0 24px;
  color: #60798b;
  font-size: 14px;
}

.legacy-service-modern .page-hero .price-box .btn {
  min-height: 52px;
  border-radius: 10px;
  background: linear-gradient(135deg, #1b6bb5, #0056a0);
  box-shadow: 0 12px 24px rgba(0, 86, 160, .2);
}

.legacy-service-modern .page-hero .price-box .btn:hover {
  background: linear-gradient(135deg, #165fad, #064b8b);
}

.legacy-service-modern .page-hero .price-box .note {
  margin-top: 14px;
  color: #718697;
  text-align: center;
  font-size: 12.5px;
}

.legacy-service-modern .float-stack {
  display: none;
}

@media (max-width: 900px) {
  .legacy-service-modern .page-hero {
    padding: 112px 0 70px;
  }

  .legacy-service-modern .page-hero .container {
    grid-template-columns: 1fr;
    gap: 42px;
  }

  .legacy-service-modern .page-hero .price-box {
    width: 100%;
    max-width: 560px;
  }
}

@media (max-width: 620px) {
  .legacy-service-modern .page-hero h1 {
    font-size: 42px;
  }

  .legacy-service-modern .page-hero p.lead {
    font-size: 16.5px;
  }

  .legacy-service-modern .page-hero .price-box {
    padding: 28px 24px;
  }

  .legacy-service-modern .page-hero .hero-badges {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }

  .legacy-service-modern .page-hero .hero-badge {
    text-align: center;
  }
}