.rodgers-logo-anim {
  width: 280px;
  max-width: 100%;
  margin: 0 auto;
  overflow: visible;
  cursor: default;
}

/* Left-align variant: add class to the Code Block wrapper */
.rodgers-logo-anim--left {
  margin: 0;
}

/* Header-only left align (logo lives in fusion-tb-header) */
.fusion-tb-header .rodgers-logo-anim {
  margin: 0;
}

.fusion-tb-header .fusion-column-wrapper:has(.rodgers-logo-anim) {
  justify-content: flex-start !important;
  align-items: flex-start !important;
}

/* Optional Avada column custom class */
.header-logo-col .fusion-column-wrapper {
  justify-content: flex-start !important;
  align-items: flex-start !important;
}

.header-logo-col .rodgers-logo-anim {
  margin: 0;
}

.rodgers-logo-svg {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
}

@media (max-width: 1199px) {
  .rodgers-logo-anim {
    width: 180px;
  }
}

.rodgers-logo-svg path {
  opacity: 0;
  clip-path: inset(0 100% 0 0);
  transform: none;
  will-change: opacity, clip-path;
}

/* R starts immediately */
.rodgers-logo-anim.is-visible.is-fast .rodgers-logo-r {
  opacity: 1;
  clip-path: inset(0 0 0 0);
  transition:
    opacity 200ms ease 0ms,
    clip-path 800ms cubic-bezier(0.2, 0.8, 0.2, 1) 0ms;
}

/* Rodgers starts after R begins */
.rodgers-logo-anim.is-visible.is-fast .rodgers-logo-wordmark {
  opacity: 1;
  clip-path: inset(0 0 0 0);
  transition:
    opacity 200ms ease 280ms,
    clip-path 900ms cubic-bezier(0.2, 0.8, 0.2, 1) 280ms;
}

/* Electrical starts after Rodgers begins */
.rodgers-logo-anim.is-visible.is-fast .rodgers-logo-tagline {
  opacity: 1;
  clip-path: inset(0 0 0 0);
  transition:
    opacity 200ms ease 480ms,
    clip-path 700ms cubic-bezier(0.2, 0.8, 0.2, 1) 480ms;
}

/* Blue E waits until the R has fully grown */
.rodgers-logo-anim.is-visible.is-fast .rodgers-logo-mark {
  opacity: 1;
  clip-path: inset(0 0 0 0);
  transition:
    opacity 200ms ease 900ms,
    clip-path 720ms cubic-bezier(0.2, 0.8, 0.2, 1) 900ms;
}

/* Fallback visible state if is-fast is removed */
.rodgers-logo-anim.is-visible:not(.is-fast) .rodgers-logo-r {
  opacity: 1;
  clip-path: inset(0 0 0 0);
  transition:
    opacity 220ms ease 0ms,
    clip-path 1000ms cubic-bezier(0.2, 0.8, 0.2, 1) 0ms;
}

.rodgers-logo-anim.is-visible:not(.is-fast) .rodgers-logo-wordmark {
  opacity: 1;
  clip-path: inset(0 0 0 0);
  transition:
    opacity 220ms ease 320ms,
    clip-path 1000ms cubic-bezier(0.2, 0.8, 0.2, 1) 320ms;
}

.rodgers-logo-anim.is-visible:not(.is-fast) .rodgers-logo-tagline {
  opacity: 1;
  clip-path: inset(0 0 0 0);
  transition:
    opacity 220ms ease 560ms,
    clip-path 1000ms cubic-bezier(0.2, 0.8, 0.2, 1) 560ms;
}

.rodgers-logo-anim.is-visible:not(.is-fast) .rodgers-logo-mark {
  opacity: 1;
  clip-path: inset(0 0 0 0);
  transition:
    opacity 220ms ease 900ms,
    clip-path 1000ms cubic-bezier(0.2, 0.8, 0.2, 1) 900ms;
}

/* Accessibility */
@media (prefers-reduced-motion: reduce) {
  .rodgers-logo-svg path {
    opacity: 1 !important;
    clip-path: none !important;
    transition: none !important;
  }
}