:root {
  --pcs-gold: #d3a24a;
  --pcs-dark: #0f1a2f;
  --pcs-overlay: rgba(8, 10, 18, 0.58);
}

body.landing #banner {
  background:
    linear-gradient(135deg, rgba(15, 26, 47, 0.55), rgba(25, 18, 10, 0.45)),
    linear-gradient(var(--pcs-overlay), var(--pcs-overlay)),
    url('https://images.unsplash.com/photo-1519710164239-da123dc03ef4?auto=format&fit=crop&w=1800&q=80');
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
}

#banner .inner.centered-hero {
  width: 100%;
  max-width: 980px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

#banner .inner.centered-hero h2,
#banner .inner.centered-hero p {
  text-align: center;
}

#banner .inner.centered-hero h2 {
  font-size: 2.8em;
  letter-spacing: 0.22em;
}

.pcs-logo {
  width: 110px;
  height: 110px;
  margin: 0 auto 1.5em auto;
  display: block;
  border-radius: 1.2em;
  box-shadow: 0 16px 40px rgba(0,0,0,0.35);
}

.hero-actions {
  justify-content: center;
}

.hero-actions .button.primary,
#contact .button.primary {
  background-color: var(--pcs-gold) !important;
  box-shadow: none !important;
}

.spotlight .image img {
  width: 100%;
  height: 100%;
  min-height: 24em;
  object-fit: cover;
}

#services .icons.major li .icon:before,
#three .features .icon:before,
#footer .icons .icon:before {
  color: var(--pcs-gold);
}

#contact .contact-details a,
#footer a,
#menu a:hover,
#header h1 a:hover {
  color: var(--pcs-gold) !important;
}

.contact-block {
  align-items: center;
}

.contact-block header {
  max-width: 760px;
}

.contact-details {
  line-height: 2;
}

@media screen and (max-width: 980px) {
  #banner .inner.centered-hero h2 {
    font-size: 2em;
    letter-spacing: 0.16em;
  }

  .pcs-logo {
    width: 92px;
    height: 92px;
  }
}

@media screen and (max-width: 736px) {
  #banner .inner.centered-hero h2 {
    font-size: 1.5em;
    letter-spacing: 0.12em;
  }

  #banner .inner.centered-hero p {
    font-size: 0.95em;
  }

  .hero-actions {
    flex-direction: column;
    align-items: center;
  }

  .hero-actions li,
  .hero-actions li .button {
    width: 100%;
    max-width: 320px;
  }

  .spotlight .image img {
    min-height: 18em;
  }
}
