/* ==========================================================================
   Acumen Company History & Milestones Timeline Styles
   Two-column section: Left Introduction & Right Chronological Timeline
   ========================================================================== */

/* Universal Gutenberg layout & block-gap resets for company-history */
.company-history-section :where(.is-layout-flow) > *,
.company-history-section :where(.is-layout-constrained) > *,
.company-history-section :where(.wp-block-group.is-layout-flow) > *,
.company-history-section :where(.wp-block-group.is-layout-constrained) > *,
.company-history-a.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)),
.company-history-a.is-layout-flow > :where(:not(.alignleft):not(.alignright):not(.alignfull)),
.company-history-a .timeline.is-layout-flow > :where(:not(.alignleft):not(.alignright):not(.alignfull)),
.company-history-a .timeline.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)),
.company-history-a .timeline-item.is-layout-flow > :where(:not(.alignleft):not(.alignright):not(.alignfull)),
.company-history-a .timeline-item.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)),
.company-history-a .timeline,
.company-history-a .timeline > *,
.company-history-a .timeline-item,
.company-history-a .timeline-item > * {
  margin-block-start: 0 !important;
  margin-block-end: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

.company-history-a p:empty {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Outer full-width section wrapper */
.company-history-section {
  display: flex !important;
  width: 100% !important;
  max-width: 100% !important;
  align-items: center !important;
  justify-content: center !important;
  background-color: var(--white, #ffffff) !important;
  position: relative !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Inner 1300px centered container */
.company-history-a {
  display: flex !important;
  flex-direction: row !important;
  width: 100% !important;
  max-width: 1300px !important;
  margin: 0 auto !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 80px !important;
  padding: 100px 70px !important;
  position: relative !important;
  background-color: var(--white, #ffffff) !important;
  box-sizing: border-box !important;
}

.company-history-a > * {
  box-sizing: border-box !important;
}

/* ==========================================================================
   Left Column: Introduction
   ========================================================================== */

.company-history-a .introduction {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 24px !important;
  position: relative !important;
  flex: 1 1 45% !important;
  max-width: 520px !important;
}

.company-history-a .eyebrow {
  position: relative !important;
  align-self: stretch !important;
  margin: 0 !important;
  font-family: var(--caption-caption-font-family, var(--font-main, 'Poppins', sans-serif)) !important;
  font-weight: var(--caption-caption-font-weight, 500) !important;
  color: var(--red, #FF5A5F) !important;
  font-size: var(--caption-caption-font-size, 14px) !important;
  letter-spacing: var(--caption-caption-letter-spacing, 0.28px) !important;
  line-height: var(--caption-caption-line-height, 1.6) !important;
  font-style: var(--caption-caption-font-style, normal) !important;
  text-transform: uppercase !important;
}

.company-history-a .headline,
.company-history-a h2.headline {
  position: relative !important;
  align-self: stretch !important;
  margin: 0 !important;
  font-family: var(--h-h2-font-family, var(--font-main, 'Poppins', sans-serif)) !important;
  font-weight: var(--h-h2-font-weight, 600) !important;
  color: var(--dark, #0A1B2E) !important;
  font-size: 48px !important;
  letter-spacing: -0.5px !important;
  line-height: 1.2 !important;
  font-style: var(--h-h2-font-style, normal) !important;
}

.company-history-a .introduction .text-wrapper,
.company-history-a .introduction p.text-wrapper {
  position: relative !important;
  align-self: stretch !important;
  margin: 0 !important;
  font-family: var(--s-s5-font-family, var(--font-main, 'Poppins', sans-serif)) !important;
  font-weight: var(--s-s5-font-weight, 400) !important;
  color: var(--text-gray, #475462) !important;
  font-size: 18px !important;
  letter-spacing: 0px !important;
  line-height: var(--s-s5-line-height, 1.6) !important;
  font-style: var(--s-s5-font-style, normal) !important;
}

/* Button & Button Wrapper */
.company-history-a .button-wrapper {
  margin-top: 8px !important;
  display: flex !important;
}

.company-history-a .button,
.company-history-a .wp-block-button.button {
  margin: 0 !important;
}

.company-history-a .button .wp-block-button__link {
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  padding: 14px 24px !important;
  position: relative !important;
  flex: 0 0 auto !important;
  background-color: var(--red, #FF5A5F) !important;
  border-radius: var(--radius-btn, 8px) !important;
  color: var(--white, #ffffff) !important;
  font-family: var(--b1-b1-semibold-font-family, var(--font-main, 'Poppins', sans-serif)) !important;
  font-weight: var(--b1-b1-semibold-font-weight, 600) !important;
  font-size: var(--b1-b1-semibold-font-size, 16px) !important;
  letter-spacing: 0px !important;
  line-height: var(--b1-b1-semibold-line-height, 1.5) !important;
  text-decoration: none !important;
  border: none !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  transition: all 0.25s ease !important;
}

.company-history-a .button .wp-block-button__link:hover {
  background-color: var(--red-hover, #F24448) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 20px rgba(255, 90, 95, 0.3) !important;
  color: var(--white, #ffffff) !important;
  text-decoration: none !important;
}

.company-history-a .button .wp-block-button__link::after {
  content: "" !important;
  display: inline-block !important;
  width: 14px !important;
  height: 14px !important;
  background-image: url("data:image/svg+xml,%3Csvg width='14' height='14' viewBox='0 0 14 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.16669 12.8333L12.8334 1.16666M12.8334 1.16666H4.08335M12.8334 1.16666V9.91666' stroke='%23ffffff' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: contain !important;
  transition: transform 0.2s ease !important;
  flex-shrink: 0 !important;
}

.company-history-a .button .wp-block-button__link:hover::after {
  transform: translate(2px, -2px) !important;
}

/* ==========================================================================
   Right Column: Timeline
   ========================================================================== */

.company-history-a .timeline {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  position: relative !important;
  flex: 1 1 50% !important;
  width: 100% !important;
  gap: 0 !important;
  row-gap: 0 !important;
  column-gap: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

/* Timeline Item Container */
.company-history-a .timeline-item {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 8px !important;
  row-gap: 8px !important;
  padding: 0 0 40px 48px !important;
  margin: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  position: relative !important;
  align-self: stretch !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

.company-history-a .timeline-item:last-child {
  padding-bottom: 0 !important;
}

/* Connecting Line: Unbroken continuous vertical rail running through all items */
.company-history-a .timeline-item::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  bottom: -25px !important;
  left: 10px !important;
  width: 2px !important;
  background-color: var(--stroke-dark-10, #E7E8EA) !important;
  z-index: 1 !important;
}

/* First item connector starts at the center of the first milestone circle */
.company-history-a .timeline-item:first-child::before {
  top: 12px !important;
}

/* Hide connector line on the last item */
.company-history-a .timeline-item:last-child::before,
.company-history-a .timeline-item.milestone-january::before {
  display: none !important;
}

/* Milestone Dot (Red Ring with White Center) */
.company-history-a .timeline-item::after {
  content: "" !important;
  position: absolute !important;
  top: 2px !important;
  left: 0 !important;
  width: 22px !important;
  height: 22px !important;
  background-color: var(--white, #ffffff) !important;
  border-radius: 50% !important;
  border: 2.5px solid var(--red, #FF5A5F) !important;
  box-sizing: border-box !important;
  z-index: 2 !important;
}

/* Current Milestone Dot (Solid Red Circle) on the last item */
.company-history-a .timeline-item:last-child::after,
.company-history-a .timeline-item.milestone-january::after {
  background-color: var(--red, #FF5A5F) !important;
}

/* Date / Year Headline */
.company-history-a .timeline-item .date,
.company-history-a .timeline-item p.date {
  position: relative !important;
  align-self: stretch !important;
  margin: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  font-family: var(--b1-b1-semibold-font-family, var(--font-main, 'Poppins', sans-serif)) !important;
  font-weight: 600 !important;
  color: var(--dark, #0A1B2E) !important;
  font-size: 16px !important;
  letter-spacing: 0px !important;
  line-height: 1.5 !important;
  font-style: normal !important;
}

/* Event Description */
.company-history-a .timeline-item .text-wrapper,
.company-history-a .timeline-item p.text-wrapper {
  position: relative !important;
  align-self: stretch !important;
  margin: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  font-family: var(--s-s5-font-family, var(--font-main, 'Poppins', sans-serif)) !important;
  font-weight: 400 !important;
  color: var(--text-gray, #475462) !important;
  font-size: 16px !important;
  letter-spacing: 0px !important;
  line-height: 1.6 !important;
  font-style: normal !important;
}

/* Announcement Link Button Wrapper */
.company-history-a .button-2-wrapper {
  margin-top: 6px !important;
  display: flex !important;
}

.company-history-a .button-2,
.company-history-a .wp-block-button.button-2 {
  all: unset !important;
  display: inline-flex !important;
  margin: 0 !important;
}

.company-history-a .button-2 .wp-block-button__link {
  all: unset !important;
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  position: relative !important;
  flex: 0 0 auto !important;
  cursor: pointer !important;
  font-family: var(--b1-b1-m-underline-font-family, var(--font-main, 'Poppins', sans-serif)) !important;
  font-weight: 500 !important;
  color: var(--red-hover, #F24448) !important;
  font-size: 16px !important;
  letter-spacing: 0px !important;
  line-height: 1.5 !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
  white-space: nowrap !important;
  font-style: normal !important;
  transition: all 0.2s ease !important;
}

.company-history-a .button-2 .wp-block-button__link:hover {
  color: var(--red, #FF5A5F) !important;
  text-decoration: underline !important;
}

.company-history-a .button-2 .wp-block-button__link::after {
  content: "" !important;
  display: inline-block !important;
  width: 14px !important;
  height: 14px !important;
  background-image: url("data:image/svg+xml,%3Csvg width='14' height='14' viewBox='0 0 14 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.16669 12.8333L12.8334 1.16666M12.8334 1.16666H4.08335M12.8334 1.16666V9.91666' stroke='%23F24448' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: contain !important;
  transition: transform 0.2s ease !important;
  flex-shrink: 0 !important;
  text-decoration: none !important;
}

.company-history-a .button-2 .wp-block-button__link:hover::after {
  transform: translate(2px, -2px) !important;
}

/* ==========================================================================
   Responsive Breakpoints
   ========================================================================== */

@media (max-width: 1024px) {
  .company-history-a {
    gap: 48px !important;
    padding: 70px 40px !important;
  }

  .company-history-a .headline,
  .company-history-a h2.headline {
    font-size: 38px !important;
  }
}

@media (max-width: 768px) {
  .company-history-a {
    flex-direction: column !important;
    gap: 48px !important;
    padding: 50px 20px 70px !important;
  }

  .company-history-a .introduction {
    max-width: 100% !important;
    width: 100% !important;
  }

  .company-history-a .headline,
  .company-history-a h2.headline {
    font-size: 32px !important;
    line-height: 1.25 !important;
  }

  .company-history-a .introduction .text-wrapper,
  .company-history-a .introduction p.text-wrapper {
    font-size: 16px !important;
  }

  .company-history-a .timeline {
    width: 100% !important;
  }

  .company-history-a .timeline-item {
    padding-left: 40px !important;
    padding-bottom: 32px !important;
  }

  .company-history-a .button,
  .company-history-a .wp-block-button.button,
  .company-history-a .wp-block-button.button .wp-block-button__link {
    width: 100% !important;
    justify-content: center !important;
  }
}
