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

.site button:hover,
.site button:focus,
.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;
  }
}

.home-content .hero {
  --display: grid;
  --grid-columns: repeat(2, 1fr);
  --grid-rows: repeat(1, 1fr);
  --grid-auto-flow: row;
  border-style: solid;
  --border-style: solid;
  border-width: 0px 0px 2px;
  --border-top-width: 0px;
  --border-right-width: 0px;
  --border-bottom-width: 2px;
  --border-left-width: 0px;
  border-color: var( --color-accent );
  --border-color: var( --color-accent );
  --margin-top: 0px;
  --margin-bottom: 0px;
  --margin-left: 0px;
  --margin-right: 0px;
  --padding-top: 0px;
  --padding-bottom: 0px;
  --padding-left: 0px;
  --padding-right: 0px;
}

.home-content .hero-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;
}

.home-content .hero-title {
  grid-column: span 1;
}

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

.home-content .hero-intro {
  font-family: Lato, sans-serif;
  font-size: 18px;
  font-weight: 400;
  color: var( --color-secondary );
}

.home-content .hero-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;
}

.home-content .hero-image img {
  border-style: none;
}

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

.home-content .introduction {
  background-color: rgb(255, 255, 255);
}

.home-content .introduction-image img {
  border-radius: 20px;
}

.home-content .introduction-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;
}

.home-content .introduction-title {
  grid-column: span 1;
}

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

.home-content .introduction-text {
  color: var( --color-secondary );
}

.home-content .introduction-action .button {
  background-color: var( --color-accent );
  font-family: Roboto, sans-serif;
  font-weight: 500;
  fill: var( --color-white );
  color: var( --color-white );
  border-style: solid;
  border-width: 1px;
  border-radius: 20px;
}

.home-content .introduction-action .button:hover,
.home-content .introduction-action .button:focus {
  background-color: rgb(155, 4, 85);
}

.home-content .services {
  --display: grid;
  --grid-columns: repeat(1, 1fr);
  --grid-rows: repeat(1, 1fr);
  --grid-auto-flow: row;
  --justify-items: center;
  --margin-top: 0px;
  --margin-bottom: 0px;
  --margin-left: 0px;
  --margin-right: 0px;
  --padding-top: 100px;
  --padding-bottom: 0px;
  --padding-left: 0px;
  --padding-right: 0px;
}

.home-content .services > .inner > .divider-top svg {
  height: 49px;
}

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

.home-content .services-symbol img {
  width: 30%;
}

.home-content .services-title {
  grid-column: span 1;
}

.home-content .services-title.heading {
  font-family: "Baloo 2", sans-serif;
  font-size: 48px;
  font-weight: 700;
  color: var( --color-primary );
}

.home-content .service-list {
  --display: grid;
  --grid-columns: repeat(3, 1fr);
  --grid-rows: repeat(1, 1fr);
  --grid-auto-flow: row;
  --overlay-opacity: 0.5;
  --margin-top: 0px;
  --margin-bottom: 0px;
  --margin-left: 0px;
  --margin-right: 0px;
  --padding-top: 24px;
  --padding-bottom: 80px;
  --padding-left: 24px;
  --padding-right: 024px;
}

.home-content .service-list::before {
  --background-overlay: '';
}

.home-content .individual-service {
  --display: grid;
  --min-height: 0px;
  --grid-columns: 1fr;
  --grid-rows: repeat(1, 1fr);
  --grid-auto-flow: row;
  --align-items: start;
  border-style: solid;
  --border-style: solid;
  border-width: 1px;
  --border-top-width: 1px;
  --border-right-width: 1px;
  --border-bottom-width: 1px;
  --border-left-width: 1px;
  border-color: var( --color-accent );
  --border-color: var( --color-accent );
  --border-radius: 20px 20px 20px 20px;
  --padding-top: 0px;
  --padding-bottom: 0px;
  --padding-left: 0px;
  --padding-right: 0px;
}

.home-content .individual-service {
  background-color: var( --color-white );
}

.home-content .individual-service.layout {
  --align-self: flex-start;
}

.home-content .individual-image:is(.layout, .widget) {
  --align-self: flex-start;
}

.home-content .individual-image img {
  border-radius: 20px 20px 0px 0px;
}

.home-content .individual-copy {
  --display: flex;
  --padding-top: 16px;
  --padding-bottom: 24px;
  --padding-left: 16px;
  --padding-right: 16px;
}

.home-content .individual-copy.layout {
  --align-self: stretch;
}

.home-content .individual-title {
  grid-column: span 1;
}

.home-content .individual-title.heading {
  font-family: "Baloo 2", sans-serif;
  font-size: 24px;
  font-weight: 600;
  color: var( --color-accent );
}

.home-content .individual-text:is(.layout, .widget) {
  --align-self: stretch;
}

.home-content .individual-text {
  font-size: 16px;
  color: var( --color-primary );
}

.home-content .team-service {
  --display: grid;
  --min-height: 0px;
  --grid-columns: 1fr;
  --grid-rows: repeat(1, 1fr);
  --grid-auto-flow: row;
  --align-items: start;
  border-style: solid;
  --border-style: solid;
  border-width: 1px;
  --border-top-width: 1px;
  --border-right-width: 1px;
  --border-bottom-width: 1px;
  --border-left-width: 1px;
  border-color: var( --color-accent );
  --border-color: var( --color-accent );
  --border-radius: 20px 20px 20px 20px;
  --padding-top: 0px;
  --padding-bottom: 0px;
  --padding-left: 0px;
  --padding-right: 0px;
}

.home-content .team-service {
  background-color: var( --color-white );
}

.home-content .team-image img {
  border-radius: 20px 20px 0px 0px;
}

.home-content .team-copy {
  --display: flex;
  --padding-top: 16px;
  --padding-bottom: 24px;
  --padding-left: 16px;
  --padding-right: 16px;
}

.home-content .team-title {
  grid-column: span 1;
}

.home-content .team-title.heading {
  font-family: "Baloo 2", sans-serif;
  font-size: 24px;
  font-weight: 600;
  color: var( --color-accent );
}

.home-content .team-text {
  color: var( --color-primary );
}

.home-content .workshop-service {
  --display: grid;
  --min-height: 0px;
  --grid-columns: 1fr;
  --grid-rows: repeat(1, 1fr);
  --grid-auto-flow: row;
  --align-items: start;
  border-style: solid;
  --border-style: solid;
  border-width: 1px;
  --border-top-width: 1px;
  --border-right-width: 1px;
  --border-bottom-width: 1px;
  --border-left-width: 1px;
  border-color: var( --color-accent );
  --border-color: var( --color-accent );
  --border-radius: 20px 20px 20px 20px;
  --padding-top: 0px;
  --padding-bottom: 0px;
  --padding-left: 0px;
  --padding-right: 0px;
}

.home-content .workshop-service {
  background-color: var( --color-white );
}

.home-content .workshop-service.layout {
  --align-self: flex-start;
}

.home-content .workshop-image img {
  border-radius: 20px 20px 0px 0px;
}

.home-content .workshop-copy {
  --display: flex;
  --padding-top: 16px;
  --padding-bottom: 24px;
  --padding-left: 16px;
  --padding-right: 16px;
}

.home-content .workshop-title {
  grid-column: span 1;
}

.home-content .workshop-title.heading {
  font-family: "Baloo 2", sans-serif;
  font-size: 24px;
  font-weight: 600;
  color: var( --color-accent );
}

.home-content .workshop-text {
  color: var( --color-primary );
}

.home-content .consultation {
  --display: grid;
  --grid-columns: repeat(2, 1fr);
  --grid-rows: repeat(1, 1fr);
  --grid-auto-flow: row;
  --align-items: center;
  --margin-top: 00px;
  --margin-bottom: 0px;
  --margin-left: 0px;
  --margin-right: 0px;
  --padding-top: 80px;
  --padding-bottom: 40px;
  --padding-left: 0px;
  --padding-right: 0px;
}

.home-content .consultation {
  background-color: var( --color-primary );
}

.home-content .consultation > .inner > .divider-top .divider-fill {
  fill: var( --color-cream );
}

.home-content .consultation > .inner > .divider-top svg {
  height: 36px;
}

.home-content .consultation-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;
}

.home-content .consultation-title {
  grid-column: span 1;
}

.home-content .consultation-title.heading {
  font-family: "Baloo 2", sans-serif;
  font-size: 32px;
  font-weight: 600;
  color: rgb(255, 255, 255);
}

.home-content .consultation-text {
  color: rgb(255, 255, 255);
}

.home-content .page-end {
  --display: flex;
  --flex-direction: column;
  --flex-wrap-mobile: wrap;
}

.home-content .page-end {
  background-color: var( --color-primary );
}

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

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

  .home-content .hero-copy {
    --grid-auto-flow: row;
  }

  .home-content .hero-portrait {
    --grid-auto-flow: row;
  }

  .home-content .introduction {
    --grid-auto-flow: row;
  }

  .home-content .introduction-copy {
    --grid-auto-flow: row;
  }

  .home-content .services {
    --grid-auto-flow: row;
  }

  .home-content .services-heading {
    --grid-auto-flow: row;
  }

  .home-content .service-list {
    --grid-auto-flow: row;
  }

  .home-content .individual-service {
    --grid-auto-flow: row;
  }

  .home-content .team-service {
    --grid-auto-flow: row;
  }

  .home-content .workshop-service {
    --grid-auto-flow: row;
  }

  .home-content .consultation {
    --grid-auto-flow: row;
  }

  .home-content .consultation-copy {
    --grid-auto-flow: row;
  }
}

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

  .home-content .hero-copy {
    --width: 100%;
  }

  .home-content .hero-portrait {
    --width: 100%;
  }

  .home-content .introduction-copy {
    --width: 100%;
  }

  .home-content .services {
    --content-width: 1140px;
  }

  .home-content .services-heading {
    --width: 100%;
  }

  .home-content .consultation-copy {
    --width: 100%;
  }
}

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

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

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

  .home-content .introduction {
    --grid-columns: repeat(1, 1fr);
    --grid-rows: repeat(1, 1fr);
    --grid-auto-flow: row;
  }

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

  .home-content .services {
    --grid-columns: repeat(1, 1fr);
    --grid-rows: repeat(1, 1fr);
    --grid-auto-flow: row;
  }

  .home-content .services-heading {
    --grid-columns: repeat(1, 1fr);
    --grid-auto-flow: row;
  }

  .home-content .service-list {
    --grid-columns: repeat(1, 1fr);
    --grid-rows: repeat(1, 1fr);
    --grid-auto-flow: row;
  }

  .home-content .individual-service {
    --grid-columns: minmax(0, 1fr);
    --grid-auto-flow: row;
  }

  .home-content .team-service {
    --grid-columns: minmax(0, 1fr);
    --grid-auto-flow: row;
  }

  .home-content .workshop-service {
    --grid-columns: minmax(0, 1fr);
    --grid-auto-flow: row;
  }

  .home-content .consultation {
    --grid-columns: repeat(1, 1fr);
    --grid-rows: repeat(1, 1fr);
    --grid-auto-flow: row;
  }

  .home-content .consultation-copy {
    --grid-columns: minmax(0, 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;
  }
}