.intro {
  .intro-content {
    padding: 3rem 0 4rem;
  }

  .tabs-btns {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.5rem;
    margin-top: 4rem;

    .tab-btn {
      font-size: var(--text-xs);
      font-weight: 600;
      border: none;
      color: var(--color-mine-shaft);
      background-color: var(--color-secondary);
      padding: 10px 20px;
      text-transform: uppercase;
      letter-spacing: 0.15em;
      transition: all 0.15s;

      &.active,
      &:hover {
        color: var(--color-white);
        background-color: var(--color-primary);
      }

      &:focus-visible {
        outline: none;
        box-shadow: 0 0 0 2px var(--color-primary);
      }
    }
  }

  .tabs-content {
    .col-image {
      position: relative;
      min-height: 600px;

      img {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
      }

      .image-label {
        display: inline-flex;
        flex-direction: column;
        align-items: start;
        gap: 0.25rem;
        position: absolute;
        left: 0;
        bottom: 0;
        padding: 1rem 1.5rem;
        background-color: var(--color-primary);
      }
    }

    .col-texts {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: start;
      padding: 2rem;
      background-color: var(--color-secondary);
      
      .texts {
        color: var(--color-greyish-brown);
        line-height: 1.625;
      }

      .line {
        width: 4rem;
        height: 1px;
        background-color: var(--color-primary);
        margin-top: 2.5rem;
      }
    }
  }

  @media (width >= 992px) {
    .tabs-content {
      .col-texts {
        padding: 3rem;
      }
    }
  }

  @media (width >= 1400px) {
    .intro-content {
      padding: 3rem 0 6rem;
    }
    .tabs-content {
      .col-texts {
        padding: 5rem;
      }
    }
  }
}

.preservation-extra {
  padding: 4rem 0;

  @media (width >= 1400px) {
    padding: 6rem 0;
  }
}