/* Uniform button hover — lift only, colors never change on hover */

.btn-animated,
.btn-lift,
.nav-ghost,
.nav-cta,
.hero-cta-primary,
.hero-cta-secondary,
.cta-install,
.story-scroll-cta,
.corner-style-card,
.circular-testimonials-pill,
a[data-hitch-install]{
  transition:transform 0.2s ease,box-shadow 0.2s ease;
}

.btn-animated{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  border:none;
  cursor:pointer;
  font-family:inherit;
  box-sizing:border-box;
}
.btn-animated-sweep{display:none}
.btn-animated-label{position:relative;z-index:1}

.btn-animated--dark,
a.btn-animated--dark{
  background:#14130E;
  color:#FFFFFF;
  border:1px solid #14130E;
}
/* Nav pill Install — white bg, bright emerald text */
.btn-animated--white-emerald,
a.btn-animated--white-emerald,
.nav-cta.btn-animated--white-emerald{
  background:#FFFFFF;
  color:#0B7A55;
  border:1px solid #FFFFFF;
}
.btn-animated--white-emerald .btn-animated-label{color:inherit}
.btn-animated--emerald,
a.btn-animated--emerald,
.hero-cta-primary.btn-animated--emerald,
.cta-install.btn-animated--emerald,
.story-scroll-cta.btn-animated--emerald{
  background:#13C98A;
  color:#FFFFFF;
}
/* Hero, Install-once, and bottom CTA — emerald fill, black label */
.hero-content a.hero-cta-primary.btn-animated--emerald,
.steps-player-cta a.hero-cta-primary.btn-animated--emerald,
a.cta-install.btn-animated--emerald{
  color:#1C1B16;
}
.hero-content a.hero-cta-primary.btn-animated--emerald .btn-animated-label,
.steps-player-cta a.hero-cta-primary.btn-animated--emerald .btn-animated-label,
a.cta-install.btn-animated--emerald .btn-animated-label{
  color:#1C1B16;
}
.btn-animated--emerald .btn-animated-label,
.btn-animated--dark .btn-animated-label{color:inherit}
.btn-animated--light{
  background:#FFFFFF;
  color:#1C1B16;
  outline:1px solid rgba(28,27,22,.12);
  outline-offset:0;
}

/* Lift + locked colors — single rule per variant */
a.btn-animated.btn-animated--emerald:hover,
a.btn-animated.btn-animated--emerald:focus-visible,
a.hero-cta-primary.btn-animated--emerald:hover,
a.hero-cta-primary.btn-animated--emerald:focus-visible,
a.cta-install.btn-animated--emerald:hover,
a.cta-install.btn-animated--emerald:focus-visible,
a.story-scroll-cta.btn-animated--emerald:hover,
a.story-scroll-cta.btn-animated--emerald:focus-visible{
  background:#13C98A;
  color:#FFFFFF;
  transform:translateY(-2px);
  box-shadow:0 6px 16px rgba(28,27,22,0.12);
}
a.btn-animated.btn-animated--emerald:hover .btn-animated-label,
a.btn-animated.btn-animated--emerald:focus-visible .btn-animated-label{
  color:#FFFFFF;
}
.hero-content a.hero-cta-primary.btn-animated--emerald:hover,
.hero-content a.hero-cta-primary.btn-animated--emerald:focus-visible,
.steps-player-cta a.hero-cta-primary.btn-animated--emerald:hover,
.steps-player-cta a.hero-cta-primary.btn-animated--emerald:focus-visible,
a.cta-install.btn-animated--emerald:hover,
a.cta-install.btn-animated--emerald:focus-visible{
  background:#13C98A;
  color:#1C1B16;
}
.hero-content a.hero-cta-primary.btn-animated--emerald:hover .btn-animated-label,
.hero-content a.hero-cta-primary.btn-animated--emerald:focus-visible .btn-animated-label,
.steps-player-cta a.hero-cta-primary.btn-animated--emerald:hover .btn-animated-label,
.steps-player-cta a.hero-cta-primary.btn-animated--emerald:focus-visible .btn-animated-label,
a.cta-install.btn-animated--emerald:hover .btn-animated-label,
a.cta-install.btn-animated--emerald:focus-visible .btn-animated-label{
  color:#1C1B16;
}

a.btn-animated.btn-animated--dark:hover,
a.btn-animated.btn-animated--dark:focus-visible{
  background:#14130E;
  color:#FFFFFF;
  border-color:#14130E;
  transform:translateY(-2px);
  box-shadow:0 6px 16px rgba(28,27,22,0.12);
}
a.btn-animated.btn-animated--dark:hover .btn-animated-label,
a.btn-animated.btn-animated--dark:focus-visible .btn-animated-label{
  color:#FFFFFF;
}
a.btn-animated.btn-animated--white-emerald:hover,
a.btn-animated.btn-animated--white-emerald:focus-visible,
a.nav-cta.btn-animated--white-emerald:hover,
a.nav-cta.btn-animated--white-emerald:focus-visible{
  background:#FFFFFF;
  color:#0B7A55;
  border-color:#FFFFFF;
  transform:translateY(-2px);
  box-shadow:0 6px 16px rgba(28,27,22,0.12);
}
a.btn-animated.btn-animated--white-emerald:hover .btn-animated-label,
a.btn-animated.btn-animated--white-emerald:focus-visible .btn-animated-label{
  color:#0B7A55;
}

a.btn-animated.btn-animated--light:hover,
a.btn-animated.btn-animated--light:focus-visible{
  background:#FFFFFF;
  color:#1C1B16;
  outline-color:rgba(28,27,22,.12);
  transform:translateY(-2px);
  box-shadow:0 6px 16px rgba(28,27,22,0.12);
}

.btn-lift:hover,
.btn-lift:focus-visible,
a.btn-lift:hover,
a.btn-lift:focus-visible{
  transform:translateY(-2px);
  box-shadow:0 6px 16px rgba(28,27,22,0.12);
}
a.nav-ghost:hover,
a.nav-ghost:focus-visible{
  color:#4A483F;
  background:transparent;
  border-color:rgba(28,27,22,.12);
  transform:translateY(-2px);
  box-shadow:0 6px 16px rgba(28,27,22,0.12);
}
.hero-topbar-actions a.nav-ghost:hover,
.hero-topbar-actions a.nav-ghost:focus-visible,
.page-topbar .hero-topbar-actions a.nav-ghost:hover,
.page-topbar .hero-topbar-actions a.nav-ghost:focus-visible,
a.hero-topbar-demo.nav-ghost:hover,
a.hero-topbar-demo.nav-ghost:focus-visible,
.hitch-demo-anchor.hero-topbar-demo > a.nav-ghost:hover,
.hitch-demo-anchor.hero-topbar-demo > a.nav-ghost:focus-visible{
  color:#0B7A55;
  background:transparent;
  border-color:rgba(28,27,22,.12);
  transform:translateY(-2px);
  box-shadow:0 6px 16px rgba(28,27,22,0.12);
}
a.hero-cta-secondary:hover,
a.hero-cta-secondary:focus-visible{
  color:#1C1B16;
  border-bottom-color:rgba(28,27,22,.35);
  transform:translateY(-2px);
  box-shadow:0 6px 16px rgba(28,27,22,0.12);
}
button.corner-style-card:hover,
button.corner-style-card:focus-visible{
  transform:none;
  box-shadow:none;
}
button.corner-style-card .corner-style-card-preview{
  transition:transform 0.2s ease,box-shadow 0.2s ease;
}
button.corner-style-card:hover .corner-style-card-preview,
button.corner-style-card:focus-visible .corner-style-card-preview{
  transform:translateY(-2px);
  box-shadow:0 6px 16px rgba(28,27,22,0.12);
}
button.circular-testimonials-pill:hover,
button.circular-testimonials-pill:focus-visible{
  transform:translateY(-2px);
  box-shadow:0 6px 16px rgba(28,27,22,0.12);
}

a[data-hitch-install]:not(.btn-animated):hover,
a[data-hitch-install]:not(.btn-animated):focus-visible{
  transform:translateY(-2px);
  box-shadow:0 6px 16px rgba(28,27,22,0.12);
}

button:disabled:hover,
button:disabled:focus-visible{
  transform:none;
  box-shadow:none;
}

.cta-install{
  display:inline-flex;
  margin-top:32px;
  font-size:16px;
  font-weight:700;
  padding:16px 34px;
  border-radius:99px;
}

@media (prefers-reduced-motion:reduce){
  .btn-animated,
  .btn-lift,
  .nav-ghost,
  .nav-cta,
  .hero-cta-primary,
  .hero-cta-secondary,
  .cta-install,
  .story-scroll-cta,
  .corner-style-card,
  .circular-testimonials-pill,
  a[data-hitch-install]{transition:none}
  a.btn-animated:hover,
  a.btn-animated:focus-visible,
  .btn-lift:hover,
  .btn-lift:focus-visible,
  a.nav-ghost:hover,
  a.nav-ghost:focus-visible,
  a.hero-cta-secondary:hover,
  a.hero-cta-secondary:focus-visible,
  button.corner-style-card:hover,
  button.corner-style-card:hover .corner-style-card-preview,
  button.circular-testimonials-pill:hover,
  a[data-hitch-install]:hover{
    transform:none;
    box-shadow:none;
  }
}