:root {
  --sidebar-width: 31rem;
  --layout-gap: 4rem;
  --wp--style--block-gap: clamp(3.5rem, 2.737rem + 1.404vw, 4rem);
}

@media (min-width: 1300px) {
  :root {
    --sidebar-width: 34rem;
    --layout-gap: 6rem;
  }
}
/*
@mixin button {
    display: inline-flex;
    align-items: center;
    font-family: $ff-body;
    font-size: $font-17;
    font-weight: 500;
    line-height: 1.05;
    text-align: center;
    text-decoration: none;
    padding: 1.2rem 2rem;
    color: $dark-green;
    background: transparent;
    border: 1px solid $dark-green;
    border-radius: 3.2rem;
    cursor: pointer;
    transition: color $speed $cb, background $speed $cb;

    &:after {
        content: '';
        background-color: currentColor;
        mask: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M15.0247 9.55859C15.2669 9.80078 15.2669 10.1992 15.0247 10.4414L7.52472 17.9414C7.28253 18.1836 6.88409 18.1836 6.64191 17.9414C6.39972 17.6992 6.39972 17.3008 6.64191 17.0586L13.7005 10L6.64191 2.94141C6.39972 2.69922 6.39972 2.30078 6.64191 2.05859C6.88409 1.81641 7.28253 1.81641 7.52472 2.05859L15.0247 9.55859Z' fill='%23000000'/%3E%3C/svg%3E");        
        width: 20px;
        height: 20px;
        margin-left: 8px;
    }

    &:hover,
    &:active,
    &:focus {
        color: #fff;
        background: $dark-green;
    }

    &[href^="http"]:not([href*="origin-framework.luminated.co.uk"]):not([href*="originenterprises.com"]),
    &[target="_blank"] {
        &:after {
            margin-top: -3px;
            mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 17 17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M14.4213 9.38932V14.6834C14.4213 15.1515 14.2354 15.6003 13.9045 15.9313C13.5735 16.2622 13.1247 16.4481 12.6566 16.4481H2.95074C2.48271 16.4481 2.03385 16.2622 1.70291 15.9313C1.37196 15.6003 1.18604 15.1515 1.18604 14.6834V4.97755C1.18604 4.50952 1.37196 4.06066 1.70291 3.72972C2.03385 3.39877 2.48271 3.21284 2.95074 3.21284H8.24486' stroke='%23006450' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M10.8916 1.44814H16.1857V6.74225' stroke='%23006450' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M8.50619 9.12796L16.1862 1.44814' stroke='%23006450' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
            background-size: cover;
        }
    }

    &[href*="wp-origin-resources-2024"] {
        &:after {
            mask: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M15.0247 9.55859C15.2669 9.80078 15.2669 10.1992 15.0247 10.4414L7.52472 17.9414C7.28253 18.1836 6.88409 18.1836 6.64191 17.9414C6.39972 17.6992 6.39972 17.3008 6.64191 17.0586L13.7005 10L6.64191 2.94141C6.39972 2.69922 6.39972 2.30078 6.64191 2.05859C6.88409 1.81641 7.28253 1.81641 7.52472 2.05859L15.0247 9.55859Z' fill='%23000000'/%3E%3C/svg%3E")!important;
            background-size: cover;
        }
    }
}
*/
.team-grid {
  overflow: hidden;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 20px 24px;
}
p + .team-grid, h2 + .team-grid, h3 + .team-grid, h4 + .team-grid, h5 + .team-grid, h6 + .team-grid {
  margin-top: 3rem;
}
.team-grid + .team {
  margin-top: 3rem;
}
div + .team-grid {
  margin-top: 4rem;
}
.team-grid.team-fade .team-head:not(.open) h3, .team-grid.team-fade .team-head:not(.open) p {
  opacity: 0.75;
}
.team-grid .team-head {
  margin: 0;
  position: relative;
  cursor: pointer;
  line-height: 0;
}
.team-grid .team-head img {
  width: 100%;
  height: 100%;
  aspect-ratio: 9/9.6;
  object-fit: cover;
  border-radius: 4px;
}
.team-grid .team-head .profile {
  width: 100%;
}
.team-grid .team-head .team-details {
  display: flex;
  width: 100%;
  margin: 0;
  padding: 2rem 0;
  transition: background 0.25s ease-in-out;
}
.team-grid .team-head .team-details .title {
  width: 100%;
}
.team-grid .team-head .team-details h3 {
  font-family: var(--wp--preset--font-family--primary);
  font-size: var(--wp--preset--font-size--font-24);
  font-weight: 500;
  margin: 0;
  color: #000;
  transition: opacity 0.25s ease-in-out;
}
.team-grid .team-head .team-details h3:after {
  content: "";
  display: block;
  width: 6rem;
  height: 2px;
  margin: 1.2rem 0 1.4rem 0;
  background: #FDD97C;
  transition: background 0.25s ease-in-out;
}
.team-grid .team-head .team-details p {
  font-size: var(--wp--preset--font-size--font-15);
  font-weight: 500;
  text-transform: uppercase;
  margin: 0 !important;
  color: #1B462D;
  transition: color 0.25s ease-in-out, opacity 0.25s ease-in-out;
}
.team-grid .team-head.open .team-details h3:after, .team-grid .team-head:hover .team-details h3:after {
  background: #1B462D;
}
.team-grid .team-head.open:after {
  transform: rotate(90deg);
}
.team-grid .team-bio {
  display: none;
  grid-column: 1/-1;
  width: 100%;
  overflow: hidden;
  will-change: height, opacity;
}
.team-grid .team-bio .inner {
  display: grid;
  gap: 2rem;
  background: rgba(27, 70, 45, 0.1);
  margin: 10px 0 var(--wp--preset--spacing--normal) 0;
  padding: var(--wp--preset--spacing--small);
  border-radius: 4px;
  opacity: 0;
  overflow: hidden;
}
@media (min-width: 1024px) {
  .team-grid .team-bio .inner {
    padding: var(--wp--preset--spacing--medium);
  }
}
.team-grid .team-bio .wp-block-columns {
  margin: 0;
}
.team-grid .team-bio .wp-block-column:nth-child(2) {
  padding: var(--spacer);
  border-radius: 5px;
}
.team-grid .team-bio h3 {
  font-weight: 400;
  margin-bottom: 1ch;
}
.team-grid .team-bio p:last-of-type {
  margin: 0;
}
.team-grid .team-bio__details {
  display: block;
}
.team-grid .team-bio__details h3 {
  font-family: var(--wp--preset--font-family--primary);
  font-size: var(--wp--preset--font-size--font-24);
  font-weight: 500;
  margin: 0;
  color: #000;
  transition: opacity 0.25s ease-in-out;
}
.team-grid .team-bio__details h3:after {
  content: "";
  display: block;
  width: 6rem;
  height: 2px;
  margin: 1.2rem 0 1.4rem 0;
  background: #FDD97C;
  transition: background 0.25s ease-in-out;
}
.team-grid .team-bio__details p {
  font-size: var(--wp--preset--font-size--font-15);
  margin-top: 0 !important;
}
.team-grid .team-bio__details p.position {
  font-weight: 500;
  text-transform: uppercase;
  color: #1B462D;
}
.team-grid .team-bio__details p.country {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 8px 10px 6px 10px;
  background: linear-gradient(90deg, #fff 0%, rgba(255, 255, 255, 0.05) 100%);
  border-radius: 2px;
}
.team-grid .team-bio__details p.country .country__flags {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  flex: 0 0 auto;
}
.team-grid .team-bio__details p.country .country__flags img {
  display: block;
  width: 2.4rem;
  height: auto;
}
.team-grid .team-bio.active-tab {
  display: block;
  grid-row: var(--team-bio-row);
}
.team-grid .team-bio.active-tab .inner {
  opacity: 1;
}
@media (min-width: 900px) {
  .team-grid .team-bio .inner {
    display: grid;
    grid-template-columns: minmax(0, 30%) minmax(0, 1fr);
    gap: 3rem;
  }
  .team-grid .team-bio__details {
    width: auto;
  }
  .team-grid .team-bio__content {
    width: auto;
  }
}

@media (min-width: 600px) {
  .team-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 30px 24px;
  }
  .team-grid .team-head {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
  }
  .team-grid .team-bio .inner {
    margin-top: 0;
  }
}
@media (max-width: 699px) {
  .acc-panel {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }
}
@media (min-width: 900px) {
  .team-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media (min-width: 1100px) {
  .team-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
