/********************************/
/*****      UTILITIES       *****/
/********************************/

/* Flex layout */
.flex-row-between {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.flex-row-between-start {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}

.flex-row-around {
  display: flex;
  justify-content: space-around;
  align-items: center;
  gap: 20px;
  flex-wrap: wrap;
}

.flex-row-start {
  display: flex;
  justify-content: space-around;
  align-items: flex-start;
}

.wrap {
  flex-wrap: wrap;
}

/* Widths */
.w-30 { width: 30%; }
.w-40 { width: 40%; }
.w-50 { width: 50%; }
.w-60 { width: 60%; }
.w-85 { width: 85%; }
.w-100 { width: 100%; }

/* Heights */
.h-60 { height: 60%; }

/* Margins */
.sl-m-0 { margin: 0; }
.sl-m-line-20 { margin-inline: 20px; }
.sl-m-l-10 { margin-left: 10px; }
.sl-m-l-20 { margin-left: 20px; }
.sl-m-r-10 { margin-right: 10px; }
.sl-m-r-30 { margin-right: 30px; }
.sl-m-t-0 { margin-top: 0; }
.sl-m-t-15 { margin-top: 15px; }
.sl-m-t-20 { margin-top: 20px; }
.sl-m-t-30 { margin-top: 30px; }
.sl-m-t-50 { margin-top: 50px; }
.sl-m-b-10 { margin-bottom: 10px; }
.sl-m-b-20 { margin-bottom: 20px; }
.sl-m-b-80 { margin-bottom: 80px; }

/* Padding */
.sl-p-line-20 { padding-inline: 20px; }
.sl-p-t-90 { padding-top: 90px; }

/* Text */
.sl-text-black { color: #222222 !important; }
.sl-text-l-black { color: #333333 !important; }
.sl-text-d-gray { color: #737373 !important; }
.sl-text-bo { color: var(--bo-primary-blue) !important; }
.sl-text-s { font-size: 1.5rem; line-height: 2rem; font-weight: 400; }
.sl-text-vs { font-size: 1.2rem; }
.sl-text-center { text-align: center; }
.sl-text-end { text-align: end; }
.sl-text-justify { text-align: justify; }

/* Visibility (kept last so it wins over flex-* utilities of equal specificity) */
.display-none { display: none; }

@media (max-width: 600px) {
  .flex-row-between-start {
    flex-direction: column;
  }
}