/* Our History Block Styles */

[data-name='acf_our-history'] {
  @apply relative overflow-hidden bg-[--colorwhite];
}

[data-name='acf_our-history'] .our-history__wrapper {
  @apply gap-0;
  position: relative;
}

/* Left Panel - Timeline Navigation */
[data-name='acf_our-history'] .our-history__timeline {
  @apply b820:w-full b820:mb-[40px] flex-shrink-0;
  position: relative;
  z-index: 10;
  overflow: hidden;
}

[data-name='acf_our-history'] .our-history__headlines {
  @apply flex flex-col gap-[20px] mb-[60px];
}

[data-name='acf_our-history'] .our-history__small-headline {
  @apply text-[--coloryellow];
}

[data-name='acf_our-history'] .our-history__main-headline {
  @apply flex flex-col;
}

[data-name='acf_our-history'] .our-history__main-headline .headline__text {
  @apply text-[--coloryellow] font-bold uppercase [font-family:--fontprompt] text-[60px] tracking-[2.4px] leading-[100%];
}

[data-name='acf_our-history'] .our-history__main-headline-line {
  @apply block;
}

[data-name='acf_our-history'] .our-history__years-list {
  @apply list-none p-0 m-0 flex flex-col gap-[20px];
}

[data-name='acf_our-history'] .our-history__year-item {
  @apply flex items-center gap-[40px] cursor-pointer transition-all duration-300;
  color: rgba(255, 255, 255, 0.5);
  font-size: 24px;
  font-weight: 600;
  font-family: var(--fontprompt);
  position: relative;
}

[data-name='acf_our-history'] .our-history__year-item:hover {
  color: rgba(255, 255, 255, 0.8);
}

[data-name='acf_our-history'] .our-history__year-item--active {
  @apply text-white;
  color: #ffffff;
}

[data-name='acf_our-history'] .our-history__year-icon {
  @apply flex-shrink-0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
}

[data-name='acf_our-history']
  .our-history__year-item--active
  .our-history__year-icon {
  opacity: 1;
  visibility: visible;
}

[data-name='acf_our-history'] .our-history__year-text {
  @apply relative;
}

[data-name='acf_our-history'] .our-history__content {
  position: relative;
  overflow: hidden;
}

[data-name='acf_our-history'] .our-history__content-item {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 40px;
  opacity: 0;
  visibility: hidden;
  display: flex;
  flex-direction: column;
  gap: 40px;
  pointer-events: none;
  transition: opacity 0.5s ease-in-out, visibility 0.5s ease-in-out;
  z-index: 1;
  transform: none;
}

[data-name='acf_our-history'] .our-history__content-item--active {
  opacity: 1;
  visibility: visible;
  position: absolute;
  pointer-events: auto;
  z-index: 2;
  transform: none;
}

[data-name='acf_our-history'] .our-history__content-year {
  @apply font-bold;
  font-size: 120px;
  line-height: 1;
  font-family: var(--fontprompt);
  color: var(--colororange);
  margin: 0;
}

[data-name='acf_our-history'] .our-history__content-paragraph {
  @apply text-[--colorgreen];
}

[data-name='acf_our-history'] .our-history__content-paragraph--first {
  @apply font-bold uppercase text-[20px] leading-[150%] [font-family:--fontprompt];
}

[data-name='acf_our-history'] .our-history__content-paragraph--second {
  @apply font-normal text-[16px] leading-[150%] max-w-[450px];
}

/* Responsive Styles */
@media (max-width: 820px) {
  [data-name='acf_our-history'] .our-history__headlines {
    @apply mb-[40px];
  }

  [data-name='acf_our-history'] .our-history__main-headline {
    font-size: 60px;
    margin-bottom: 40px;
  }

  [data-name='acf_our-history'] .our-history__main-headline .headline__text {
    font-size: 60px;
  }

  [data-name='acf_our-history'] .our-history__content-item {
    gap: 30px;
    padding: 50px 30px;
  }

  [data-name='acf_our-history'] .our-history__content-year {
    font-size: 80px;
  }

  [data-name='acf_our-history'] .our-history__content-paragraph {
    font-size: 16px;
  }

  [data-name='acf_our-history'] .our-history__content-paragraph--second {
    max-width: 100%;
    text-align: left;
  }
}

@media (max-width: 480px) {
  [data-name='acf_our-history'] .our-history__headlines {
    @apply mb-[30px];
  }

  [data-name='acf_our-history'] .our-history__main-headline {
    font-size: 48px;
    margin-bottom: 30px;
  }

  [data-name='acf_our-history'] .our-history__main-headline .headline__text {
    font-size: 48px;
  }

  [data-name='acf_our-history'] .our-history__year-item {
    font-size: 20px;
    gap: 12px;
  }

  [data-name='acf_our-history'] .our-history__content-item {
    padding: 40px 20px;
    gap: 25px;
  }

  [data-name='acf_our-history'] .our-history__content-year {
    font-size: 60px;
  }

  [data-name='acf_our-history'] .our-history__content-paragraph {
    font-size: 14px;
  }
}