/* =====================================================
   PRIMUS GOOGLE REVIEWS
====================================================== */

#primus-google-reviews {

  --pgr-black: #171719;
  --pgr-text: #50535a;
  --pgr-muted: #7a7d84;
  --pgr-border: #e4e5e7;
  --pgr-bg: #f8f9fa;
  --pgr-white: #ffffff;
  --pgr-star: #fbbc04;

  width: 100%;
  padding: 95px 24px;

  background: var(--pgr-bg);

  color: var(--pgr-black);

  font-family:
    Arial,
    Helvetica,
    sans-serif;

}


#primus-google-reviews * {
  box-sizing: border-box;
}


.pgr-container {

  width: 100%;
  max-width: 1240px;

  margin: 0 auto;

}



/* =====================================================
   GOOGLE TOP BAR
====================================================== */

.pgr-header {

  display: flex;

  align-items: center;
  justify-content: space-between;

  gap: 30px;

  padding-bottom: 32px;

  margin-bottom: 62px;

  border-bottom:
    1px solid var(--pgr-border);

}



.pgr-google-brand {

  display: flex;

  align-items: center;

  gap: 13px;

  color: var(--pgr-black);

  font-size: 20px;
  font-weight: 700;

}



.pgr-google-icon {

  display: block;

  width: 36px;
  height: 36px;

  object-fit: contain;

}



.pgr-rating {

  display: flex;

  align-items: center;

  gap: 14px;

}



.pgr-rating > strong {

  color: var(--pgr-black);

  font-size: 31px;
  line-height: 1;

}



.pgr-rating-info {

  display: flex;

  flex-direction: column;

  gap: 3px;

}



.pgr-stars {

  color: var(--pgr-star);

  font-size: 16px;

  line-height: 1;

  letter-spacing: 2px;

}



.pgr-rating-info span {

  color: var(--pgr-muted);

  font-size: 11px;

}



/* =====================================================
   HEADING
====================================================== */

.pgr-heading {

  max-width: 700px;

  margin-bottom: 52px;

}



.pgr-eyebrow {

  display: block;

  margin-bottom: 13px;

  color: #63666d;

  font-size: 11px;
  font-weight: 700;

  letter-spacing: 2px;

}



.pgr-heading h2 {

  margin:
    0
    0
    18px;

  color: var(--pgr-black);

  font-size:
    clamp(
      38px,
      4.4vw,
      58px
    );

  font-weight: 700;

  line-height: 1.03;

  letter-spacing: -2.3px;

}



.pgr-heading p {

  max-width: 600px;

  margin: 0;

  color: var(--pgr-text);

  font-size: 17px;

  line-height: 1.65;

}



/* =====================================================
   GRID
====================================================== */

.pgr-grid {

  display: grid;

  grid-template-columns:
    repeat(
      3,
      minmax(0,1fr)
    );

  gap: 20px;

}



/* =====================================================
   REVIEW CARD
====================================================== */

.pgr-card {

  display: flex;

  min-width: 0;
  min-height: 335px;

  flex-direction: column;

  padding: 28px;

  border:
    1px solid
    var(--pgr-border);

  border-radius: 16px;

  background:
    var(--pgr-white);

  color:
    var(--pgr-black) !important;

  text-decoration:
    none !important;

  box-shadow:
    0 1px 2px rgba(0,0,0,.02),
    0 8px 30px rgba(0,0,0,.025);

  transition:
    transform .28s ease,
    box-shadow .28s ease,
    border-color .28s ease;

}



.pgr-card:hover {

  transform:
    translateY(-6px);

  border-color:
    #cfd1d4;

  box-shadow:
    0 18px 45px
    rgba(0,0,0,.07);

}



.pgr-card-top {

  display: flex;

  align-items: center;
  justify-content: space-between;

  gap: 20px;

  margin-bottom: 25px;

}



.pgr-card-google {

  width: 27px;
  height: 27px;

  object-fit: contain;

}



/* =====================================================
   REVIEW TEXT
====================================================== */

.pgr-card blockquote {

  flex: 1;

  margin:
    0
    0
    30px;

  color:
    var(--pgr-black);

  font-size: 17px;
  font-weight: 400;

  line-height: 1.6;

}



/* =====================================================
   REVIEWER
====================================================== */

.pgr-reviewer {

  display: flex;

  align-items: center;

  gap: 12px;

  margin-bottom: 22px;

}



.pgr-avatar {

  display: flex;

  width: 41px;
  height: 41px;

  flex-shrink: 0;

  align-items: center;
  justify-content: center;

  border-radius: 50%;

  background:
    #f1f3f4;

  color:
    #4285f4;

  font-size: 15px;
  font-weight: 700;

}



.pgr-person {

  display: flex;

  min-width: 0;

  flex-direction: column;

  gap: 4px;

}



.pgr-person strong {

  color:
    var(--pgr-black);

  font-size: 14px;

}



.pgr-person span {

  color:
    var(--pgr-muted);

  font-size: 12px;

}



/* =====================================================
   SOURCE
====================================================== */

.pgr-source {

  display: flex;

  align-items: center;
  justify-content: space-between;

  gap: 15px;

  padding-top: 17px;

  border-top:
    1px solid #eeeeef;

  color:
    var(--pgr-muted);

  font-size: 11px;

}



.pgr-open {

  color:
    #4285f4;

  font-weight: 700;

}



/* =====================================================
   BOTTOM
====================================================== */

.pgr-bottom {

  display: flex;

  align-items: center;
  justify-content: space-between;

  gap: 30px;

  margin-top: 47px;

  padding-top: 30px;

  border-top:
    1px solid
    var(--pgr-border);

}



.pgr-bottom-rating {

  display: flex;

  align-items: center;

  gap: 13px;

}



.pgr-bottom-rating img {

  width: 38px;
  height: 38px;

}



.pgr-bottom-rating div {

  display: flex;

  flex-direction: column;

  gap: 4px;

}



.pgr-bottom-rating strong {

  color:
    var(--pgr-black);

  font-size: 14px;

}



.pgr-bottom-rating span {

  color:
    var(--pgr-star);

  font-size: 13px;

  letter-spacing: 1px;

}



/* =====================================================
   BUTTON
====================================================== */

.pgr-button {

  display: inline-flex;

  min-height: 53px;

  align-items: center;
  justify-content: center;

  gap: 10px;

  padding:
    14px
    23px;

  border-radius: 7px;

  background:
    var(--pgr-black);

  color:
    #ffffff !important;

  font-size: 13px;
  font-weight: 700;

  text-decoration:
    none !important;

  transition:
    transform .25s ease,
    box-shadow .25s ease;

}



.pgr-button:hover {

  transform:
    translateY(-2px);

  box-shadow:
    0 12px 28px
    rgba(0,0,0,.16);

}



/* =====================================================
   TABLET
====================================================== */

@media (max-width: 950px) {

  .pgr-grid {

    grid-template-columns:
      repeat(
        2,
        minmax(0,1fr)
      );

  }

}



/* =====================================================
   MOBILE
====================================================== */

@media (max-width: 650px) {

  #primus-google-reviews {

    padding:
      68px
      18px;

  }


  .pgr-header {

    align-items:
      flex-start;

    flex-direction:
      column;

    margin-bottom:
      45px;

  }


  .pgr-heading {

    margin-bottom:
      37px;

  }


  .pgr-heading h2 {

    font-size:
      40px;

    letter-spacing:
      -1.5px;

  }


  .pgr-heading p {

    font-size:
      15px;

  }


  .pgr-grid {

    grid-template-columns:
      1fr;

  }


  .pgr-card {

    min-height:
      auto;

    padding:
      24px;

  }


  .pgr-bottom {

    align-items:
      stretch;

    flex-direction:
      column;

  }


  .pgr-button {

    width:
      100%;

  }

}