/* == HERO GRID == */

.hero-content-grid {
  grid-template-areas:
    "hero-heading"
    "hero-paragraph"
    "hero-btn";
  align-content: start;
  padding: 1em;
  color: var(--white);
}

.hero-heading {
  grid-area: hero-heading;
}

.hero-paragraph {
  grid-area: hero-paragraph;
  margin: 1em 0;
  font-size: 1.15rem;
  font-weight: bold;
}

.hero-btn {
  grid-area: hero-btn;
}

/* == ABOUT GRID == */

.about-grid {
  grid-template-areas:
    "about-heading"
    "about-content";
  align-content: center;
  padding: 1em;
}

.about-heading {
  grid-area: about-heading;
  justify-self: center;
}

.about-img {
  display: none;
  height: auto;
}

.about-content {
  grid-area: about-content;
}

/* == HOME PAGE SERVICES GRID == */

.services-grid-home {
  grid-template-areas:
    "services-heading"
    "expertise-card"
    "safety-card"
    "certification-card";
  gap: 1em;
  align-content: center;
  padding-top: 1em;
  padding-left: 1em;
  padding-bottom: 3em;
  padding-right: 1em;
}

.services-heading {
  grid-area: services-heading;
  justify-self: center;
  color: var(--white);
}

.expertise-card {
  grid-area: expertise-card;
}

.safety-card {
  grid-area: safety-card;
}

.certification-card {
  grid-area: certification-card;
}

/* Card Grid */

.card-grid {
  grid-template-areas:
    "card-icon"
    "card-heading"
    "card-blurb"
    "card-btn";
  gap: 1.75em;
  justify-items: center;
  padding: 4em;
  background-color: var(--white);
}

.card-icon {
  grid-area: card-icon;
  width: 7.5em;
}

.card-heading {
  grid-area: card-heading;
}

.card-blurb {
  grid-area: card-blurb;
}

.card-btn {
  grid-area: card-btn;
  margin: 0;
}

.card-btn:hover {
  color: var(--light-grey);
}

.card-btn:visited {
  color: var(--white);
}

/* == CONTACT GRID == */

.contact-grid {
  grid-template-areas: "contact-heading"
    "contact-blurb";
  align-content: center;
  justify-items: center;
  padding: 1em;
}

.contact-heading {
  grid-area: contact-heading;
}

.contact-blurb {
  grid-area: contact-blurb;
}