/* Shared Literacy Squared blue and Talavera treatment for Professional Learning. */
.pl-page {
  --navy: #173972;
  --deep: #173972;
}

.pl-hero {
  background-color: #173972;
  background-image: url('../images/talavera-banner.jpg');
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.pl-hero::after {
  inset: 0;
  opacity: 1;
  background: linear-gradient(90deg, rgba(23, 57, 114, .52) 0%, rgba(23, 57, 114, .28) 48%, rgba(23, 57, 114, .06) 100%);
  transform: none;
}

.pl-category__head::after {
  right: 0;
  top: 0;
  width: 300px;
  height: 100%;
  opacity: .5;
  background-image:
    linear-gradient(90deg, rgba(23, 57, 114, .95), rgba(23, 57, 114, .08)),
    url('../images/talavera-banner.jpg');
  background-position: left top, right center;
  background-repeat: no-repeat, no-repeat;
  background-size: 100% 100%, cover;
}

.pl-card__description {
  display: grid;
  grid-template-columns: 10px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
}

.pl-card__bullet {
  width: 9px;
  height: 9px;
  margin-top: .48em;
  border-radius: 50%;
  background: var(--gold);
  box-shadow: 0 0 0 3px rgba(243, 181, 27, .14);
}

.pl-card__description p {
  margin: 0;
}

.pl-contact {
  background-color: #173972;
  background-image:
    linear-gradient(rgba(23, 57, 114, .82), rgba(23, 57, 114, .82)),
    url('../images/talavera-banner-flipped.jpg');
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

@media (max-width: 767px) {
  .pl-hero::after {
    inset: 0;
    opacity: 1;
    transform: none;
  }

  .pl-category__head::after {
    width: 180px;
    background-size: 100% 100%, cover;
  }
}