.site button {
  background-color: var( --color-primary );
  font-weight: 600;
  color: var( --color-white );
  border-radius: 40px;
}

.site button:hover,
.site button:focus {
  background-color: rgb(12, 43, 85);
}

@media (max-width: 1024px) {
  .layout {
    --container-max-width: 1024px;
  }
}

@media (max-width: 767px) {
  .layout {
    --container-max-width: 767px;
  }
}

.about-content .biography {
  --display: grid;
  --min-height: 0px;
  --grid-columns: repeat(2, 1fr);
  --grid-rows: repeat(1, 1fr);
  --grid-auto-flow: row;
  --margin-top: 0px;
  --margin-bottom: 0px;
  --margin-left: 0px;
  --margin-right: 0px;
  --padding-top: 0px;
  --padding-bottom: 40px;
  --padding-left: 0px;
  --padding-right: 0px;
}

.about-content .biography-copy {
  --display: grid;
  --min-height: 0px;
  --grid-columns: repeat(1, 1fr);
  --grid-rows: 1;
  --grid-auto-flow: row;
  --align-items: start;
  --grid-align-content: center;
  --padding-top: 32px;
  --padding-bottom: 32px;
  --padding-left: 32px;
  --padding-right: 32px;
}

.about-content .biography-title {
  grid-column: span 1;
}

.about-content .biography-title.heading {
  font-family: "Baloo 2", sans-serif;
  font-size: 80px;
  font-weight: 600;
  color: var( --color-primary );
}

.about-content .biography-text {
  font-family: Lato, sans-serif;
  font-size: 16px;
  font-weight: 400;
  color: var( --color-secondary );
}

.about-content .biography-portrait {
  --display: grid;
  --min-height: 0px;
  --grid-columns: repeat(1, 1fr);
  --grid-rows: 1;
  --grid-auto-flow: row;
  --align-items: start;
  --grid-align-content: center;
  --padding-top: 0px;
  --padding-bottom: 0px;
  --padding-left: 0px;
  --padding-right: 0px;
}

.about-content .values-section {
  --display: grid;
  --min-height: 0px;
  --grid-columns: repeat(2, 1fr);
  --grid-rows: repeat(1, 1fr);
  --grid-auto-flow: row;
  --margin-top: 0px;
  --margin-bottom: 0px;
  --margin-left: 0px;
  --margin-right: 0px;
  --padding-top: 0px;
  --padding-bottom: 40px;
  --padding-left: 0px;
  --padding-right: 0px;
}

.about-content .values-background {
  --display: grid;
  --min-height: 0px;
  --grid-columns: repeat(1, 1fr);
  --grid-rows: 1;
  --grid-auto-flow: row;
  --align-items: start;
  --grid-align-content: center;
  --padding-top: 32px;
  --padding-bottom: 32px;
  --padding-left: 32px;
  --padding-right: 32px;
}

.about-content .values-background {
  background-image: url("../wp-content/uploads/2025/11/DSC2615axx-scaled.jpg");
  background-position: center center;
  background-size: cover;
}

.about-content .values-copy {
  --display: grid;
  --min-height: 0px;
  --grid-columns: repeat(1, 1fr);
  --grid-rows: 1;
  --grid-auto-flow: row;
  --align-items: start;
  --grid-align-content: center;
  --padding-top: 32px;
  --padding-bottom: 32px;
  --padding-left: 32px;
  --padding-right: 32px;
}

.about-content .values-text {
  font-family: Lato, sans-serif;
  font-size: 16px;
  font-weight: 400;
  color: var( --color-secondary );
}

body.about-page {
  background-color: rgb(248, 247, 242);
}

@media (max-width: 1024px) {
  .about-content .biography {
    --grid-auto-flow: row;
  }

  .about-content .biography-copy {
    --grid-auto-flow: row;
  }

  .about-content .biography-portrait {
    --grid-auto-flow: row;
  }

  .about-content .values-section {
    --grid-auto-flow: row;
  }

  .about-content .values-background {
    --grid-auto-flow: row;
  }

  .about-content .values-copy {
    --grid-auto-flow: row;
  }
}

@media (min-width: 768px) {
  .about-content .biography {
    --content-width: 1320px;
  }

  .about-content .biography-copy {
    --width: 100%;
  }

  .about-content .biography-portrait {
    --width: 100%;
  }

  .about-content .values-section {
    --content-width: 1320px;
  }

  .about-content .values-background {
    --width: 100%;
  }

  .about-content .values-copy {
    --width: 100%;
  }
}

@media (max-width: 767px) {
  .about-content .biography {
    --grid-columns: repeat(1, 1fr);
    --grid-rows: repeat(1, 1fr);
    --grid-auto-flow: row;
  }

  .about-content .biography-copy {
    --grid-columns: repeat(1, 1fr);
    --grid-auto-flow: row;
  }

  .about-content .biography-portrait {
    --grid-columns: repeat(1, 1fr);
    --grid-auto-flow: row;
  }

  .about-content .values-section {
    --grid-columns: repeat(1, 1fr);
    --grid-rows: repeat(1, 1fr);
    --grid-auto-flow: row;
  }

  .about-content .values-background {
    --grid-columns: repeat(1, 1fr);
    --grid-auto-flow: row;
  }

  .about-content .values-copy {
    --grid-columns: repeat(1, 1fr);
    --grid-auto-flow: row;
  }
}

@media (max-width: 1024px) {
  .site-footer .footer-layout {
    --grid-auto-flow: row;
  }
}

@media (max-width: 767px) {
  .site-footer .footer-layout {
    --grid-columns: repeat(1, 1fr);
    --grid-auto-flow: row;
  }
}
