/* Latest supplied reference: taller city vista, arms-crossed technician, expanded left copy and generous mobile cards. */

.light-reference-hero {
  height: 570px;
}

.boryeong-backdrop {
  height: 70%;
  opacity: .58;
  filter: saturate(.98) contrast(.94) brightness(1.08);
}

.hero-cloud-wash {
  background:
    radial-gradient(ellipse at 8% 5%, rgba(255,255,255,.98) 0%, rgba(255,255,255,.78) 37%, transparent 66%),
    linear-gradient(180deg, rgba(255,255,255,.58), rgba(232,248,255,.08) 45%, rgba(227,246,255,.02));
}

.light-hero-copy {
  top: 81px;
}

.light-hero-copy h1 {
  font-size: clamp(76px, 8.2vw, 119px);
  letter-spacing: -8px;
}

.light-hero-copy h2 {
  font-size: clamp(36px, 4vw, 60px);
}

.light-hero-copy > strong {
  display: block;
  margin-top: 20px;
  color: #4a4f58;
  font-size: clamp(19px, 2vw, 29px);
  font-weight: 600;
  letter-spacing: -1.45px;
  line-height: 1.35;
}

.hero-technician {
  right: max(2%, calc((100vw - 1190px) / 2));
  bottom: -5px;
  width: min(505px, 43vw);
  max-height: 535px;
}

.light-emergency-badge {
  bottom: 89px;
  left: max(24px, calc((100vw - 1160px) / 2));
  min-width: 346px;
  transform: none;
  padding: 14px 27px;
  border: 0;
  border-radius: 14px;
  box-shadow: 0 10px 19px rgba(4, 90, 185, .24);
  font-size: 27px;
}

.light-service-strip {
  padding-bottom: 40px;
}

.light-service-cards {
  margin-top: -47px;
}

.light-service-cards a {
  min-height: 137px;
  border-radius: 17px;
}

.light-service-cards b {
  width: 45px;
  height: 45px;
}

.light-service-cards svg {
  width: 43px;
  height: 43px;
}

.light-service-cards span {
  font-size: 17px;
}

.light-primary-call {
  min-height: 88px;
  margin-top: 20px;
  border-radius: 17px;
}

.light-primary-call span {
  font-size: 43px;
}

.light-primary-call strong {
  font-size: 42px;
}

.light-primary-call small {
  font-size: 17px;
}

.light-primary-call i {
  font-size: 54px;
}

@media(max-width:700px){
  .light-reference-hero {
    height: 422px;
  }

  .boryeong-backdrop {
    height: 66%;
    opacity: .54;
  }

  .light-hero-copy {
    top: 41px;
    left: 22px;
  }

  .light-hero-copy p {
    font-size: 18px;
  }

  .light-hero-copy h1 {
    font-size: 59px;
    letter-spacing: -5px;
  }

  .light-hero-copy h2 {
    font-size: 28px;
    letter-spacing: -2.45px;
  }

  .light-hero-copy > strong {
    margin-top: 12px;
    color: #444b56;
    font-size: 16px;
    letter-spacing: -1.15px;
  }

  .hero-technician {
    right: -11px;
    bottom: -2px;
    width: 59%;
    max-height: 388px;
  }

  .light-emergency-badge {
    bottom: 20px;
    left: 22px;
    min-width: 0;
    padding: 10px 15px;
    border-radius: 9px;
    font-size: 20px;
  }

  .light-service-strip {
    padding: 0 0 21px;
  }

  .light-service-cards {
    margin-top: 0;
  }

  .light-service-cards a {
    min-height: 103px;
    border-radius: 11px;
  }

  .light-service-cards b {
    width: 31px;
    height: 31px;
  }

  .light-service-cards svg {
    width: 31px;
    height: 31px;
  }

  .light-service-cards span {
    font-size: 11px;
  }

  .light-primary-call {
    min-height: 66px;
    margin-top: 12px;
    border-radius: 11px;
  }

  .light-primary-call span {
    font-size: 31px;
  }

  .light-primary-call strong {
    font-size: 32px;
  }

  .light-primary-call small {
    font-size: 12px;
  }

  .light-primary-call i {
    font-size: 41px;
  }
}

@media(max-width:360px){
  .light-reference-hero { height: 407px; }
  .light-hero-copy h1 { font-size: 55px; }
  .light-hero-copy h2 { font-size: 26px; }
  .light-hero-copy > strong { font-size: 15px; }
  .light-service-cards span { font-size: 10px; }
  .light-primary-call strong { font-size: 29px; }
}