.project-layout {
  --animation-delay: 0.4s;
  --animation-duration: 2s;
  --animation-timing-function: cubic-bezier(0.5, 0.67, 0.29, 0.97);
  --viewport-height: 100vh;
  --viewport-height: 100dvh;
  --project-layout-width: 100%;
  --sidebar-width: 100%;
  --sidebar-padding-left: 0vw;
  --sidebar-padding-right: 0vw;
  --cover-height: calc(var(--viewport-height) - var(--header-height));
  --content-padding-top: 8.2666666667vw;
  --content-padding-bottom: 13.3333333333vw;
  --sidebar-content-border-radius-top: 1.6vw;
  --sidebar-content-border-radius-bottom: 0vw;
  --content-padding-left: var(--main-layout-side-padding);
  --content-padding-right: var(--main-layout-side-padding);
  --new-year-bow-desktop-translate: 0vw;
  --rounds-panel-height: 19.7333333333vw;
  --sidebar-content-padding: 4.2666666667vw;
}
@media (min-width: 720px) {
  .project-layout {
    --project-layout-width: 100%;
  }
}
@media (min-width: 720px) {
  .project-layout {
    --sidebar-width: 43.046875vw;
  }
}
@media (min-width: 720px) {
  .project-layout {
    --sidebar-padding-left: 4.0625vw;
  }
}
@media (min-width: 720px) {
  .project-layout {
    --sidebar-padding-right: 2.265625vw;
  }
}
@media (min-width: 720px) {
  .project-layout {
    --cover-height: 50.9375vw;
  }
}
@media (min-width: 720px) {
  .project-layout {
    --content-padding-top: 4.375vw;
  }
}
@media (min-width: 720px) {
  .project-layout {
    --content-padding-bottom: 3.90625vw;
  }
}
@media (min-width: 720px) {
  .project-layout {
    --sidebar-content-border-radius-top: 1.71875vw;
  }
}
@media (min-width: 720px) {
  .project-layout {
    --sidebar-content-border-radius-bottom: 1.71875vw;
  }
}
@media (min-width: 720px) {
  .project-layout {
    --content-padding-left: var(--main-layout-side-padding);
  }
}
@media (min-width: 720px) {
  .project-layout {
    --content-padding-right: var(--sidebar-width);
  }
}
@media (min-width: 720px) {
  .project-layout {
    --new-year-bow-desktop-translate: 0vw;
  }
}
@media (min-width: 720px) {
  .project-layout {
    --rounds-panel-height: 7.734375vw;
  }
}
@media (min-width: 720px) {
  .project-layout {
    --sidebar-content-padding: 2.03125vw;
  }
}
@media (min-width: 1281px) {
  .project-layout {
    --project-layout-width: 85vw;
  }
}
@media (min-width: 1281px) {
  .project-layout {
    --sidebar-width: 38.6458333333vw;
  }
}
@media (min-width: 1281px) {
  .project-layout {
    --sidebar-padding-left: 3.8541666667vw;
  }
}
@media (min-width: 1281px) {
  .project-layout {
    --sidebar-padding-right: 7.1875vw;
  }
}
@media (min-width: 1281px) {
  .project-layout {
    --cover-height: 35.2604166667vw;
  }
}
@media (min-width: 1281px) {
  .project-layout {
    --content-padding-top: 2.3958333333vw;
  }
}
@media (min-width: 1281px) {
  .project-layout {
    --content-padding-bottom: 6.5625vw;
  }
}
@media (min-width: 1281px) {
  .project-layout {
    --sidebar-content-border-radius-top: 1.1458333333vw;
  }
}
@media (min-width: 1281px) {
  .project-layout {
    --sidebar-content-border-radius-bottom: 1.1458333333vw;
  }
}
@media (min-width: 1281px) {
  .project-layout {
    --content-padding-left: 7.1875vw;
  }
}
@media (min-width: 1281px) {
  .project-layout {
    --content-padding-right: var(--sidebar-width);
  }
}
@media (min-width: 1281px) {
  .project-layout {
    --new-year-bow-desktop-translate: 0.6770833333vw;
  }
}
@media (min-width: 1281px) {
  .project-layout {
    --rounds-panel-height: 5.15625vw;
  }
}
@media (min-width: 1281px) {
  .project-layout {
    --sidebar-content-padding: 2.0833333333vw;
  }
}
@media (min-width: 2400px) {
  .project-layout {
    --project-layout-width: 2040px;
  }
}
@media (min-width: 2400px) {
  .project-layout {
    --sidebar-width: 927.5px;
  }
}
@media (min-width: 2400px) {
  .project-layout {
    --sidebar-padding-left: 92.5px;
  }
}
@media (min-width: 2400px) {
  .project-layout {
    --sidebar-padding-right: 172.5px;
  }
}
@media (min-width: 2400px) {
  .project-layout {
    --cover-height: 846.25px;
  }
}
@media (min-width: 2400px) {
  .project-layout {
    --content-padding-top: 57.5px;
  }
}
@media (min-width: 2400px) {
  .project-layout {
    --content-padding-bottom: 157.5px;
  }
}
@media (min-width: 2400px) {
  .project-layout {
    --sidebar-content-border-radius-top: 27.5px;
  }
}
@media (min-width: 2400px) {
  .project-layout {
    --sidebar-content-border-radius-bottom: 27.5px;
  }
}
@media (min-width: 2400px) {
  .project-layout {
    --content-padding-left: 172.5px;
  }
}
@media (min-width: 2400px) {
  .project-layout {
    --content-padding-right: var(--sidebar-width);
  }
}
@media (min-width: 2400px) {
  .project-layout {
    --new-year-bow-desktop-translate: 16.25px;
  }
}
@media (min-width: 2400px) {
  .project-layout {
    --rounds-panel-height: 123.75px;
  }
}
@media (min-width: 2400px) {
  .project-layout {
    --sidebar-content-padding: 50px;
  }
}
.project-layout {
  --project-layout-half-width: calc(var(--project-layout-width) / 2);
  width: var(--project-layout-width);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  margin-top: var(--new-year-bow-desktop-translate);
}
.project-layout__cover {
  height: var(--cover-height);
}
.project-layout__sidebar {
  --project-layout-half-width: calc(var(--project-layout-width) / 2);
  --position: relative;
  --height: auto;
  --top: auto;
  --left: auto;
  --animation-name: sidebar-shift-up-mobile;
}
@media (min-width: 720px) {
  .project-layout__sidebar {
    --position: absolute;
  }
}
@media (min-width: 720px) {
  .project-layout__sidebar {
    --height: calc(100% - var(--header-height) - var(--content-padding-bottom));
  }
}
@media (min-width: 720px) {
  .project-layout__sidebar {
    --top: var(--header-height);
  }
}
@media (min-width: 720px) {
  .project-layout__sidebar {
    --left: calc(50% + var(--project-layout-half-width) - var(--sidebar-width));
  }
}
@media (min-width: 720px) {
  .project-layout__sidebar {
    --animation-name: sidebar-shift-up-desktop;
  }
}
@media (min-width: 1281px) {
  .project-layout__sidebar {
    --position: absolute;
  }
}
@media (min-width: 1281px) {
  .project-layout__sidebar {
    --height: calc(100% - var(--header-height) - var(--content-padding-bottom));
  }
}
@media (min-width: 1281px) {
  .project-layout__sidebar {
    --top: var(--header-height);
  }
}
@media (min-width: 1281px) {
  .project-layout__sidebar {
    --left: calc(50% + var(--project-layout-half-width) - var(--sidebar-width));
  }
}
@media (min-width: 1281px) {
  .project-layout__sidebar {
    --animation-name: sidebar-shift-up-desktop;
  }
}
@media (min-width: 2400px) {
  .project-layout__sidebar {
    --position: absolute;
  }
}
@media (min-width: 2400px) {
  .project-layout__sidebar {
    --height: calc(100% - var(--header-height) - var(--content-padding-bottom));
  }
}
@media (min-width: 2400px) {
  .project-layout__sidebar {
    --top: var(--header-height);
  }
}
@media (min-width: 2400px) {
  .project-layout__sidebar {
    --left: calc(50% + var(--project-layout-half-width) - var(--sidebar-width));
  }
}
@media (min-width: 2400px) {
  .project-layout__sidebar {
    --animation-name: sidebar-shift-up-desktop;
  }
}
.project-layout__sidebar {
  position: var(--position);
  top: var(--top);
  left: var(--left);
  height: var(--height);
  z-index: 3;
  width: var(--sidebar-width);
  padding-top: var(--sidebar-padding-top);
  padding-left: var(--sidebar-padding-left);
  padding-right: var(--sidebar-padding-right);
  animation: var(--animation-name) var(--animation-duration) var(--animation-timing-function) var(--animation-delay) 1 normal both;
}
.project-layout__sidebar-content {
  width: 100%;
  padding: var(--sidebar-content-padding);
  background-color: var(--color-clear-white);
  border-radius: var(--sidebar-content-border-radius-top) var(--sidebar-content-border-radius-top) var(--sidebar-content-border-radius-bottom) var(--sidebar-content-border-radius-bottom);
  box-shadow: 0 0 25px 0 rgba(26, 30, 18, 0.02), 0 0 80px 0 rgba(26, 30, 18, 0.05);
}
.project-layout__content {
  padding-top: var(--content-padding-top);
  padding-bottom: var(--content-padding-bottom);
  padding-left: var(--content-padding-left);
  padding-right: var(--content-padding-right);
  background-color: var(--color-paper-white);
  position: relative;
  width: 100%;
  overflow: hidden;
}
.project-layout__widget {
  --position: absolute;
  --margin-top: 0vw;
  --margin-bottom: 8.5333333333vw;
  --margin-left: 0;
  --margin-right: 0;
  --width: 100%;
}
@media (min-width: 720px) {
  .project-layout__widget {
    --position: relative;
  }
}
@media (min-width: 720px) {
  .project-layout__widget {
    --margin-top: -2.5vw;
  }
}
@media (min-width: 720px) {
  .project-layout__widget {
    --margin-bottom: 0vw;
  }
}
@media (min-width: 720px) {
  .project-layout__widget {
    --margin-left: var(--content-padding-left);
  }
}
@media (min-width: 720px) {
  .project-layout__widget {
    --margin-right: var(--content-padding-right);
  }
}
@media (min-width: 720px) {
  .project-layout__widget {
    --width: calc(100% - var(--content-padding-right) - var(--content-padding-left));
  }
}
@media (min-width: 1281px) {
  .project-layout__widget {
    --position: relative;
  }
}
@media (min-width: 1281px) {
  .project-layout__widget {
    --margin-top: -0.8333333333vw;
  }
}
@media (min-width: 1281px) {
  .project-layout__widget {
    --margin-bottom: 0vw;
  }
}
@media (min-width: 1281px) {
  .project-layout__widget {
    --margin-left: var(--content-padding-left);
  }
}
@media (min-width: 1281px) {
  .project-layout__widget {
    --margin-right: var(--content-padding-right);
  }
}
@media (min-width: 1281px) {
  .project-layout__widget {
    --width: calc(100% - var(--content-padding-right) - var(--content-padding-left));
  }
}
@media (min-width: 2400px) {
  .project-layout__widget {
    --position: relative;
  }
}
@media (min-width: 2400px) {
  .project-layout__widget {
    --margin-top: -20px;
  }
}
@media (min-width: 2400px) {
  .project-layout__widget {
    --margin-bottom: 0px;
  }
}
@media (min-width: 2400px) {
  .project-layout__widget {
    --margin-left: var(--content-padding-left);
  }
}
@media (min-width: 2400px) {
  .project-layout__widget {
    --margin-right: var(--content-padding-right);
  }
}
@media (min-width: 2400px) {
  .project-layout__widget {
    --width: calc(100% - var(--content-padding-right) - var(--content-padding-left));
  }
}
.project-layout__widget {
  position: relative;
  z-index: 10;
  width: var(--width);
  margin-top: var(--margin-top);
  margin-bottom: var(--margin-bottom);
  margin-left: var(--margin-left);
  margin-right: var(--margin-right);
}
.project-layout__new-year-bow {
  --left: auto;
  --right: 0;
}
@media (min-width: 720px) {
  .project-layout__new-year-bow {
    --left: auto;
  }
}
@media (min-width: 720px) {
  .project-layout__new-year-bow {
    --right: 0;
  }
}
@media (min-width: 1281px) {
  .project-layout__new-year-bow {
    --left: 50%;
  }
}
@media (min-width: 1281px) {
  .project-layout__new-year-bow {
    --right: auto;
  }
}
@media (min-width: 2400px) {
  .project-layout__new-year-bow {
    --left: 50%;
  }
}
@media (min-width: 2400px) {
  .project-layout__new-year-bow {
    --right: auto;
  }
}
.project-layout__new-year-bow {
  position: absolute;
  top: var(--header-height);
  left: var(--left);
  right: var(--right);
  z-index: 10;
  margin-left: calc(var(--project-layout-half-width) * -1);
}
.project-layout__rounds-panel {
  --gap: 4.2666666667vw;
}
@media (min-width: 720px) {
  .project-layout__rounds-panel {
    --gap: 2.890625vw;
  }
}
@media (min-width: 1281px) {
  .project-layout__rounds-panel {
    --gap: 1.9270833333vw;
  }
}
@media (min-width: 2400px) {
  .project-layout__rounds-panel {
    --gap: 46.25px;
  }
}
.project-layout__rounds-panel {
  width: calc(100% + var(--sidebar-content-padding) * 2);
  height: var(--rounds-panel-height);
  background-color: var(--color-paper-white);
  position: relative;
  top: calc(var(--sidebar-content-padding) * -1);
  left: calc(var(--sidebar-content-padding) * -1);
  border-radius: var(--sidebar-content-border-radius-top) var(--sidebar-content-border-radius-top) 0 0;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: var(--gap);
  padding: 0 var(--sidebar-content-padding);
  border-bottom: 1px solid var(--color-mint);
}
.project-layout__rounds-panel-item {
  --side-padding: 1.0666666667vw;
}
@media (min-width: 720px) {
  .project-layout__rounds-panel-item {
    --side-padding: 0.625vw;
  }
}
@media (min-width: 1281px) {
  .project-layout__rounds-panel-item {
    --side-padding: 0.4166666667vw;
  }
}
@media (min-width: 2400px) {
  .project-layout__rounds-panel-item {
    --side-padding: 10px;
  }
}
.project-layout__rounds-panel-item {
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  padding: 0 var(--side-padding);
  position: relative;
  opacity: 0.4;
}
.project-layout__rounds-panel-item_selected_true {
  opacity: 1;
}
.project-layout__rounds-panel-item_selected_true::after {
  --height: 1.3333333333vw;
}
@media (min-width: 720px) {
  .project-layout__rounds-panel-item_selected_true::after {
    --height: 0.390625vw;
  }
}
@media (min-width: 1281px) {
  .project-layout__rounds-panel-item_selected_true::after {
    --height: 0.2604166667vw;
  }
}
@media (min-width: 2400px) {
  .project-layout__rounds-panel-item_selected_true::after {
    --height: 6.25px;
  }
}
.project-layout__rounds-panel-item_selected_true::after {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  bottom: -1px;
  width: 100%;
  height: var(--height);
  background-color: var(--color-brand);
}
.project-layout_type_project {
  --sidebar-padding-top: auto/3.75vw;
  --sidebar-margin-top: 107.7333333333vw;
}
@media (min-width: 720px) {
  .project-layout_type_project {
    --sidebar-padding-top: 8.828125vw;
  }
}
@media (min-width: 720px) {
  .project-layout_type_project {
    --sidebar-margin-top: 0vw;
  }
}
@media (min-width: 1281px) {
  .project-layout_type_project {
    --sidebar-padding-top: 8.3854166667vw;
  }
}
@media (min-width: 1281px) {
  .project-layout_type_project {
    --sidebar-margin-top: 0vw;
  }
}
@media (min-width: 2400px) {
  .project-layout_type_project {
    --sidebar-padding-top: 201.25px;
  }
}
@media (min-width: 2400px) {
  .project-layout_type_project {
    --sidebar-margin-top: 0px;
  }
}
.project-layout_type_project .project-layout__sidebar-content {
  --position: static;
  --top: 0vw;
}
@media (min-width: 720px) {
  .project-layout_type_project .project-layout__sidebar-content {
    --position: sticky;
  }
}
@media (min-width: 720px) {
  .project-layout_type_project .project-layout__sidebar-content {
    --top: 3.125vw;
  }
}
@media (min-width: 1281px) {
  .project-layout_type_project .project-layout__sidebar-content {
    --position: sticky;
  }
}
@media (min-width: 1281px) {
  .project-layout_type_project .project-layout__sidebar-content {
    --top: 2.0833333333vw;
  }
}
@media (min-width: 2400px) {
  .project-layout_type_project .project-layout__sidebar-content {
    --position: sticky;
  }
}
@media (min-width: 2400px) {
  .project-layout_type_project .project-layout__sidebar-content {
    --top: 50px;
  }
}
.project-layout_type_project .project-layout__sidebar-content {
  position: var(--position);
  top: calc(var(--header-height) + var(--top));
  transition: top 1s ease-in-out;
}
.project-layout_type_project.project-layout_with-mic {
  --sidebar-margin-top: 123.7333333333vw;
}
@media (min-width: 720px) {
  .project-layout_type_project.project-layout_with-mic {
    --sidebar-margin-top: 0vw;
  }
}
@media (min-width: 1281px) {
  .project-layout_type_project.project-layout_with-mic {
    --sidebar-margin-top: 0vw;
  }
}
@media (min-width: 2400px) {
  .project-layout_type_project.project-layout_with-mic {
    --sidebar-margin-top: 0px;
  }
}
.project-layout_type_invest {
  --sidebar-padding-top: auto/3.75vw;
  --sidebar-margin-top: 100.2666666667vw;
}
@media (min-width: 720px) {
  .project-layout_type_invest {
    --sidebar-padding-top: 11.953125vw;
  }
}
@media (min-width: 720px) {
  .project-layout_type_invest {
    --sidebar-margin-top: 0vw;
  }
}
@media (min-width: 1281px) {
  .project-layout_type_invest {
    --sidebar-padding-top: 8.6458333333vw;
  }
}
@media (min-width: 1281px) {
  .project-layout_type_invest {
    --sidebar-margin-top: 0vw;
  }
}
@media (min-width: 2400px) {
  .project-layout_type_invest {
    --sidebar-padding-top: 207.5px;
  }
}
@media (min-width: 2400px) {
  .project-layout_type_invest {
    --sidebar-margin-top: 0px;
  }
}

@keyframes sidebar-shift-up-mobile {
  from {
    margin-top: var(--cover-height);
  }
  to {
    margin-top: var(--sidebar-margin-top);
  }
}
@keyframes sidebar-shift-up-desktop {
  from {
    padding-top: calc(var(--cover-height) + var(--content-padding-top));
  }
  to {
    padding-top: var(--sidebar-padding-top);
  }
}
