@charset "UTF-8";
/**
 * @file
 * Anchor Button — Atom
 *
 * Animated chevron used as an anchor/link to a URL or section id.
 * Implements a simple chevron made with pseudo-elements. Color is
 * controlled via component modifiers that map to project-level
 * CSS custom properties.
 *
 * Markup expected:
 *   <a class="c-anchor-button scroll-bottom style3 c-anchor-button--dark">
 *     <div class="c-anchor-button__stem"></div>
 *   </a>
 */
.c-anchor-button {
  /* Local component variables */
  --anchor-bar-width: 16px;
  --anchor-bar-height: 2px;
  --anchor-stem-height: 50px;
  --anchor-trans: var(--base-trans);
  display: inline-flex;
  width: 100%;
  justify-content: center;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  cursor: pointer;
  /* Element: stem (vertical bar) */
  /* Modifiers: color variants mapped to global custom properties. */
  /* Positioning and initial transforms for chevron halves. */
  /* Respect reduced motion preference */
}
.c-anchor-button__stem {
  position: relative;
  display: inline-block;
  height: var(--anchor-stem-height);
  width: 1px;
}
.c-anchor-button__stem::before, .c-anchor-button__stem::after {
  content: "";
  width: var(--anchor-bar-width);
  height: var(--anchor-bar-height);
  position: absolute;
  bottom: 50%;
  will-change: transform;
  transition: transform var(--anchor-trans);
}
.c-anchor-button--dark .c-anchor-button__stem::before,
.c-anchor-button--dark .c-anchor-button__stem::after {
  background: var(--black);
}
.c-anchor-button--light .c-anchor-button__stem::before,
.c-anchor-button--light .c-anchor-button__stem::after {
  background: var(--white-text);
}
.c-anchor-button.scroll-bottom.style3 {
  /* Hover: expand arms to full width */
}
.c-anchor-button.scroll-bottom.style3 .c-anchor-button__stem::before {
  right: 1px;
  transform: rotateZ(45deg) scaleX(0.75);
  transform-origin: 100% 100%;
}
.c-anchor-button.scroll-bottom.style3 .c-anchor-button__stem::after {
  left: 1px;
  transform: rotateZ(-45deg) scaleX(0.75);
  transform-origin: 0 100%;
}
.c-anchor-button.scroll-bottom.style3:hover .c-anchor-button__stem::before {
  transform: rotateZ(45deg) scaleX(1);
  transition-delay: 0.1s;
}
.c-anchor-button.scroll-bottom.style3:hover .c-anchor-button__stem::after {
  transform: rotateZ(-45deg) scaleX(1);
  transition-delay: 0.1s;
}
@media (prefers-reduced-motion: reduce) {
  .c-anchor-button .c-anchor-button__stem::before,
  .c-anchor-button .c-anchor-button__stem::after {
    transition: none;
  }
}
/*# sourceMappingURL=anchor-button.css.map */