/**
 * The base file that should be imported by every file.
 * There should be no CSS generation in this or from imported scss files at all!
 */
/**
 * Library
 */
/**
 * Variables and functions
 */
.section-growthpath {
  background-color: var(--dark-blue); }
  .section-growthpath .container {
    position: relative; }
    @media (max-width: 980px) {
      .section-growthpath .container {
        padding: 0; } }
    .section-growthpath .container .title {
      padding-bottom: 45px;
      padding-top: 60px;
      display: flex;
      align-items: center;
      gap: 22.5px; }
      .section-growthpath .container .title h2 {
        margin: 0; }
        .section-growthpath .container .title h2 .title-one {
          color: var(--green); }
        .section-growthpath .container .title h2 .title-two {
          color: var(--white); }
      .section-growthpath .container .title .icon img {
        max-height: 35px;
        width: auto; }
        @media (min-width: 981px) {
          .section-growthpath .container .title .icon img {
            max-height: 70px; } }
    .section-growthpath .container .toggle-switch {
      position: absolute;
      top: 0;
      right: 0;
      height: 45px; }
      .section-growthpath .container .toggle-switch .toggle-label {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        right: 30px;
        display: flex;
        flex-direction: column; }
        .section-growthpath .container .toggle-switch .toggle-label small {
          color: var(--white);
          min-width: 80px;
          opacity: .5;
          text-transform: uppercase;
          transition: font-weight .3s ease-in-out, opacity .3s ease-in-out; }
          .section-growthpath .container .toggle-switch .toggle-label small.active {
            font-weight: 800;
            opacity: 1; }
      .section-growthpath .container .toggle-switch input[type=checkbox] {
        height: 0;
        width: 0;
        visibility: hidden; }
      .section-growthpath .container .toggle-switch label {
        cursor: pointer;
        text-indent: -9999px;
        width: 26px;
        height: 45px;
        border: 2px solid var(--green);
        background: transparent;
        display: block;
        border-radius: 100px;
        position: absolute;
        top: 0;
        right: 0; }
      .section-growthpath .container .toggle-switch label:after {
        content: '';
        position: absolute;
        top: 2px;
        left: 2px;
        width: 18px;
        height: 18px;
        background: var(--green);
        border-radius: 90px;
        transition: 0.3s; }
      .section-growthpath .container .toggle-switch input:checked + label:after {
        top: calc(45px - 24px); }
    .section-growthpath .container .steps {
      display: flex;
      flex-wrap: nowrap;
      gap: 1em; }
      @media (max-width: 980px) {
        .section-growthpath .container .steps {
          flex-direction: column; } }
      .section-growthpath .container .steps .step {
        flex: 1;
        position: relative; }
        @media (max-width: 980px) {
          .section-growthpath .container .steps .step {
            margin-bottom: 45px; }
            .section-growthpath .container .steps .step:after {
              content: '';
              height: 100%;
              width: 2px;
              background-color: var(--gray-blue);
              position: absolute;
              top: 45px;
              left: 15px; } }
        .section-growthpath .container .steps .step:last-of-type:after {
          display: none; }
        .section-growthpath .container .steps .step:last-of-type .icon:after {
          display: none; }
        .section-growthpath .container .steps .step h3, .section-growthpath .container .steps .step p {
          margin: 0;
          color: var(--white); }
        .section-growthpath .container .steps .step .graph-wrapper {
          height: 400px;
          width: 120px;
          position: relative; }
          .section-growthpath .container .steps .step .graph-wrapper .graph {
            display: flex;
            flex-direction: column;
            justify-content: flex-end;
            width: 100%;
            animation: animateUp .3s ease-in-out forwards;
            padding-bottom: 30px;
            position: absolute;
            bottom: 0; }
            @media (max-width: 980px) {
              .section-growthpath .container .steps .step .graph-wrapper .graph {
                margin-left: calc(40px + 90px / 4); } }
            .section-growthpath .container .steps .step .graph-wrapper .graph .white {
              background: linear-gradient(0deg, #FFFFFF 0%, rgba(255, 255, 255, 0.5) 100%); }
            .section-growthpath .container .steps .step .graph-wrapper .graph .gray {
              background: linear-gradient(180deg, #5C7482 0%, rgba(92, 116, 130, 0.5) 100%); }
            .section-growthpath .container .steps .step .graph-wrapper .graph .green {
              background: linear-gradient(180deg, #00FFA0 0%, rgba(0, 255, 160, 0.5) 100%); }
        .section-growthpath .container .steps .step .icon {
          position: relative; }
          @media (max-width: 980px) {
            .section-growthpath .container .steps .step .icon {
              position: absolute;
              left: 0;
              top: 0; } }
          @media (min-width: 981px) {
            .section-growthpath .container .steps .step .icon {
              top: -15px; } }
          @media (min-width: 981px) {
            .section-growthpath .container .steps .step .icon:after {
              height: 2px;
              width: 80%;
              top: 50%;
              transform: translateY(-50%);
              left: 45px;
              background-color: var(--gray-blue);
              position: absolute;
              content: ''; } }
          .section-growthpath .container .steps .step .icon svg {
            height: 30px;
            width: 30px; }
            .section-growthpath .container .steps .step .icon svg path {
              fill: var(--green); }
        @media (min-width: 981px) {
          .section-growthpath .container .steps .step .content {
            padding: 0; } }
        .section-growthpath .container .steps .step .content .fase {
          color: var(--green); }
        .section-growthpath .container .steps .step .content .functions {
          color: var(--white);
          margin-bottom: 0;
          padding-bottom: 0; }
  .section-growthpath .animation-wrapper {
    display: none; }
  .section-growthpath .delay-1 {
    animation-delay: 0.1s !important; }
  .section-growthpath .delay-2 {
    animation-delay: 0.2s !important; }
  .section-growthpath .delay-3 {
    animation-delay: 0.3s !important; }
  .section-growthpath .delay-4 {
    animation-delay: 0.4s !important; }
  .section-growthpath .delay-5 {
    animation-delay: 0.5s !important; }
  .section-growthpath .delay-6 {
    animation-delay: 0.6s !important; }
  .section-growthpath .delay-7 {
    animation-delay: 0.7s !important; }
  .section-growthpath .delay-8 {
    animation-delay: 0.8s !important; }
  .section-growthpath .delay-9 {
    animation-delay: 0.9s !important; }
  .section-growthpath .delay-10 {
    animation-delay: 1s !important; }
  .section-growthpath .delay-11 {
    animation-delay: 1.1s !important; }
  .section-growthpath .delay-12 {
    animation-delay: 1.2s !important; }
  .section-growthpath .delay-13 {
    animation-delay: 1.3s !important; }
  .section-growthpath .delay-14 {
    animation-delay: 1.4s !important; }
  .section-growthpath .delay-15 {
    animation-delay: 1.5s !important; }
  .section-growthpath .delay-16 {
    animation-delay: 1.6s !important; }

@keyframes animateUp {
  0% {
    height: 0; }
  100% {
    height: 100%; } }

/*# sourceMappingURL=growthpath.css.map */