@import url("https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap");
@use 'libs/bulma/sass/utilities/mixins';
@keyframes underlineIn {
  0% {
    left: 0%;
    right: 100%; }
  100% {
    left: 0%;
    right: 0%; } }

@keyframes underlineOut {
  0% {
    left: 0%;
    right: 0%; }
  100% {
    left: 100%;
    right: 0%; } }

.step-list {
  --index-width: 3rem;
  --step-spacing: 1.5rem;
  --inner-line: 1px solid #b5b5b5;
  --outer-line: 1px dashed #b5b5b5;
  display: flex; }
  .step-list .step-item .index-ctn {
    position: relative; }
    .step-list .step-item .index-ctn::before, .step-list .step-item .index-ctn::after {
      content: '';
      display: block;
      position: absolute; }
    .step-list .step-item .index-ctn .index-number {
      width: var(--index-width);
      height: var(--index-width);
      background-color: white;
      border: var(--inner-line);
      border-radius: 9999px;
      font-weight: 800; }
  .step-list.horizontal {
    flex-direction: row;
    flex-wrap: wrap; }
    .step-list.horizontal .step-item {
      flex: 1 1 0px;
      display: flex;
      flex-direction: column; }
      .step-list.horizontal .step-item:first-child .index-ctn::before {
        border-top: var(--outer-line) !important; }
      .step-list.horizontal .step-item:last-child .index-ctn::after {
        border-top: var(--outer-line) !important; }
      .step-list.horizontal .step-item .index-ctn {
        display: flex;
        justify-content: center; }
        .step-list.horizontal .step-item .index-ctn::before {
          border-top: var(--inner-line);
          width: 50%;
          top: 50%;
          left: 0;
          right: calc(50% + var(--index-width)/2); }
        .step-list.horizontal .step-item .index-ctn::after {
          border-top: var(--inner-line);
          width: 50%;
          top: 50%;
          left: calc(50% + var(--index-width)/2);
          right: 0; }
        .step-list.horizontal .step-item .index-ctn .index-number {
          transform: translateX(calc(50% - (var(--index-width)/2)));
          display: flex;
          align-items: center;
          justify-content: center; }
      .step-list.horizontal .step-item .content {
        text-align: center;
        padding-top: 1.5rem;
        padding-right: calc(var(--step-spacing)/2);
        padding-left: calc(var(--step-spacing)/2); }
  .step-list.vertical {
    flex-direction: column; }
    .step-list.vertical .step-item {
      display: flex; }
      .step-list.vertical .step-item:first-child .index-ctn::before {
        border-right: var(--outer-line) !important; }
      .step-list.vertical .step-item:last-child .index-ctn::after {
        border-right: var(--outer-line) !important; }
      .step-list.vertical .step-item .index-ctn::before {
        border-right: var(--inner-line);
        height: calc(50% - var(--index-width));
        left: 50%;
        top: calc(0px - 50% + var(--index-width)); }
      .step-list.vertical .step-item .index-ctn::after {
        border-right: var(--inner-line);
        height: calc(100% - var(--index-width) - var(--step-spacing));
        left: 50%;
        top: var(--index-width); }
      .step-list.vertical .step-item .index-ctn .index-number {
        display: flex;
        align-items: center;
        justify-content: center; }
      .step-list.vertical .step-item .content {
        padding-top: calc(var(--index-width)/4);
        padding-left: 1.5rem;
        padding-bottom: var(--step-spacing); }
  .step-list.hide-outer-lines .step-item:first-child .index-ctn::before {
    display: none; }
  .step-list.hide-outer-lines .step-item:last-child .index-ctn::after {
    display: none; }

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