.organigation {
  width: 100%;
  height: 100%;
  min-width: var(--min-width);
  min-height: 100dvh;
  padding: 0 clamp(1.6rem, 3vw, 4rem);
  background-color: var(--background-color);
  color: var(--white);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.organigation-container {
  width: 100%;
  height: 100%;
  max-width: 144rem;

  padding: 14rem 0;
  display: flex;
  flex-direction: column;
  gap: 10.3rem;
}
.organigation-content {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  gap: 10.3rem;
}
.triangle {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(0.8rem, 1vw, 1.3rem);
}

.row {
  position: relative;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  gap: clamp(3rem, 1vw, 4.7rem);
}
.row:not(:first-child)::before {
  position: absolute;
  content: "";
  width: 0;
  height: 0;
  border-left: clamp(0.3rem, 1vw, 0.4rem) solid transparent;
  border-right: clamp(0.3rem, 1vw, 0.4rem) solid transparent;
  border-top: clamp(0.2rem, 1vw, 0.4rem) solid var(--main-font-color);
}
.row:nth-child(2)::before {
  margin-top: 0.5rem;
}
.row:nth-child(3)::before {
  transform: translateY(-1.5rem);
}

.circle {
  border-radius: 50%;
  box-sizing: border-box;
  width: clamp(8rem, 10vw, 12.2rem);
  aspect-ratio: 1/1;
  border: 1px solid #dec0a3;
  display: flex;
  justify-content: center;
  align-items: center;
  font-family: "Inter" sans-serif;
  font-style: normal;
  font-weight: 500;
  font-size: clamp(1.4rem, 1vw, 2rem);
  line-height: 2.4rem;
  text-align: center;
}
.circle.shine {
  border: 1px solid var(--sub-font-color);
  box-shadow: 0 0 80px 20px rgba(220, 192, 152, 0.25),
    0 0 150px 40px rgba(220, 192, 152, 0.2),
    0 0 250px 60px rgba(220, 192, 152, 0.15),
    inset 0 0 40px 10px rgba(220, 192, 152, 0.25),
    inset 0 0 80px 20px rgba(220, 192, 152, 0.2);
  filter: drop-shadow(0 0 12px rgba(220, 192, 152, 0.6));
}

.department-list {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  list-style-type: none;
  gap: 2.6rem;
  flex-wrap: wrap;
}
.department {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  font-family: "Inter", sans-serif;
  font-style: normal;
  font-weight: 200;
  font-size: clamp(1.4rem, 1vw, 2rem);
  line-height: 1.7rem;
  text-align: center;
}

.department:not(:first-child)::before {
  position: absolute;
  content: "";
  width: 3.23px;
  height: 3.23px;
  left: -1.5rem;
  top: 50%;
  transform: translate(auto, -50%);
  background: var(--sub-font-color);
  box-shadow: 0px 0px 12.2059px var(--main-font-color),
    0px 0px 6.97482px var(--main-font-color),
    0px 0px 4.06865px var(--main-font-color),
    0px 0px 2.03432px var(--main-font-color),
    0px 0px 0.581235px var(--main-font-color),
    0px 0px 0.290618px var(--main-font-color);
  transform: rotate(36.55deg);
}
.department.edge-in-row::before {
  display: none;
}

@media (max-width: 768px) {
  .organigation {
    justify-content: flex-start;
    padding: 0 1.6rem;
  }
  .organigation-container {
    padding-top: 0;
    padding-bottom: 5rem;
    gap: 0;
  }
  .organigation-title {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
  }
  .organigation-content {
    padding-top: clamp(5.3rem, 3vw, 10.3rem);
  }
}
