
/* ===== ACCRF HOMEPAGE CSS ===== */
/* Minimal — only rules that cannot be set via native Avada element options */

/* HERO TEXT OVERLAY — fusion_text doesn't support background_color natively */
.hero-overlay-text {
  background: rgba(0,0,0,0.65);
  padding: 24px 40px;
  max-width: 1049px;
  margin: 0 auto;
}
@media (max-width: 480px) {
  .hero-overlay-text {
    padding: 7px;
  }
}

/* TIMELINE CENTER LINE — decorative pseudo-element, no native Avada equivalent */
.accrf-timeline {
  position: relative;
}
.accrf-timeline::before {
  content: "";
  position: absolute;
  top: 350px;
  left: 50%;
  transform: translateX(-50%);
  width: 2px;
  height: calc(100% - 550px);
  background: rgba(71,108,125,0.7);
  z-index: 1;
}
.accrf-timeline > .fusion-fullwidth-container {
  position: relative;
  z-index: 1;
}
@media (max-width: 992px) {
  .accrf-timeline::before { display: none; }
}

/* TIMELINE SPEECH BUBBLE — matches live site .quickfinder-item-info exactly */
/* Live site: post-arrow.svg path "M 50,0 Q 45,45 0,50 Q 45,55 50,100" */
/* 50×100px, fill rgb(4,41,56), arrow attached to balloon edge */
.timeline-balloon {
  --awb-overflow: visible;
}
/* Avada inner columns ignore min_height attribute — must set via CSS.
   3-class selector beats Avada's 2-class ".fusion-layout-column .fusion-column-wrapper" */
.fusion-layout-column.timeline-balloon .fusion-column-wrapper {
  min-height: 250px;
  overflow: visible;
  position: relative; /* arrow anchor — positions arrows against the visible balloon, not the column */
}
/* Arrow pointing RIGHT (left-side balloons) — on WRAPPER so it touches the balloon edge */
.timeline-balloon-left .fusion-column-wrapper::after {
  content: "";
  position: absolute;
  top: 50%;
  right: -50px;
  transform: translateY(-50%);
  width: 50px;
  height: 100px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 100'%3E%3Cpath fill='rgb(4,41,56)' d='M 0,0 Q 5,45 50,50 Q 5,55 0,100'/%3E%3C/svg%3E") no-repeat center/contain;
}
/* Arrow pointing LEFT (right-side balloons) — on WRAPPER so it touches the balloon edge */
.timeline-balloon-right .fusion-column-wrapper::after {
  content: "";
  position: absolute;
  top: 50%;
  left: -50px;
  transform: translateY(-50%);
  width: 50px;
  height: 100px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 100'%3E%3Cpath fill='rgb(4,41,56)' d='M 50,0 Q 45,45 0,50 Q 45,55 50,100'/%3E%3C/svg%3E") no-repeat center/contain;
}
@media (max-width: 992px) {
  .timeline-balloon-left .fusion-column-wrapper::after,
  .timeline-balloon-right .fusion-column-wrapper::after { display: none; }
}

/* ===== END ACCRF HOMEPAGE CSS ===== */
