/* Homepage motion. Only active when animations.js adds .anim to <html>
   (so no-JS and reduced-motion visitors see the static page). */

:root { --ease-out: cubic-bezier(.22, 1, .36, 1); }

/* ---------- Scroll reveal ---------- */
.anim [data-reveal] {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity .8s var(--ease-out), transform .8s var(--ease-out), box-shadow .45s var(--ease-out);
  transition-delay: calc(var(--i, 0) * 90ms);
}
.anim [data-reveal="left"] { transform: translateX(-36px); }
.anim [data-reveal="right"] { transform: translateX(36px); }
.anim [data-reveal="zoom"] { transform: scale(.94); }
/* Phones: side-entering reveals rise instead, so they never cause sideways scrolling */
@media (max-width: 640px) { .anim [data-reveal="left"], .anim [data-reveal="right"] { transform: translateY(28px); } }
.anim [data-reveal].is-in { opacity: 1; transform: none; }
.anim [data-fade] { opacity: 0; transition: opacity .9s var(--ease-out); transition-delay: calc(var(--i, 0) * 90ms); }
.anim [data-fade].is-in { opacity: 1; }

/* ---------- Hero entrance ---------- */
.anim .hero__copy > *,
.anim .hero__title > span {
  opacity: 0;
  transform: translateY(24px);
  animation: hb-rise .9s var(--ease-out) forwards;
}
.anim .hero__eyebrow { animation-delay: .05s; }
.anim .hero__title > span:nth-child(1) { animation-delay: .15s; }
.anim .hero__title > span:nth-child(2) { animation-delay: .3s; }
.anim .hero__title { opacity: 1; transform: none; animation: none; }
.anim .hero__lead { animation-delay: .45s; }
.anim .hero__cta { animation-delay: .6s; }
.anim .hero__trust { animation-delay: .75s; }

.anim .hero__card { opacity: 0; transform: scale(.96) translateY(20px); animation: hb-rise 1.1s var(--ease-out) .2s forwards; }
.anim .hero__woman { animation: hb-settle 1.6s var(--ease-out) .2s both; }
.anim .hero__phone { opacity: 0; transform: translateY(60px); animation: hb-rise 1s var(--ease-out) .55s forwards, hb-float 6s ease-in-out 1.8s infinite; }
.anim .hero__proof { opacity: 0; transform: translateY(20px) scale(.92); animation: hb-pop .8s var(--ease-out) .9s forwards, hb-float 7s ease-in-out 2s infinite reverse; }
.anim .hero__proof .avatars img { opacity: 0; transform: scale(.4); animation: hb-pop .5s var(--ease-out) forwards; }
.anim .hero__proof .avatars img:nth-child(1) { animation-delay: 1.1s; }
.anim .hero__proof .avatars img:nth-child(2) { animation-delay: 1.18s; }
.anim .hero__proof .avatars img:nth-child(3) { animation-delay: 1.26s; }
.anim .hero__proof .avatars img:nth-child(4) { animation-delay: 1.34s; }

/* Stars twinkle in */
.anim .hero__rating .stars, .anim .hero__proof-rating .stars {
  background: linear-gradient(90deg, #c9a25b 50%, #e7dcc6 50%) 100% 0 / 200% 100%;
  -webkit-background-clip: text; background-clip: text; color: transparent;
  animation: hb-fill 1.2s var(--ease-out) 1.2s forwards;
}

/* ---------- "Say goodbye to" chips ---------- */
.chips li { transition: background-color .3s, transform .3s var(--ease-out); }
.chips li:hover { background: #bfd0ca; transform: translateY(-2px); }

/* ---------- Feature icons ---------- */
.anim .features__grid li.is-in img { animation: hb-bob .9s var(--ease-out) calc(.2s + var(--i, 0) * 90ms) both; }

/* ---------- Hover polish ---------- */
.btn { transition: background-color .2s, transform .25s var(--ease-out), box-shadow .25s; }
.btn--primary:hover, .btn--gold:hover { transform: translateY(-2px); box-shadow: 0 10px 22px -10px rgba(139, 58, 80, .6); }
.btn:active { transform: translateY(0); }

.tcard, .gcard, .post, .stats li, .state {
  transition: transform .45s var(--ease-out), box-shadow .45s var(--ease-out);
}
.tcard:hover, .gcard:hover, .post:hover, .stats li:hover, .state:hover {
  transform: translateY(-6px);
  box-shadow: 0 18px 40px -18px rgba(28, 42, 53, .35);
}

.state img, .team__media img { transition: transform 1.2s var(--ease-out); }
.state:hover img { transform: scale(1.05); }
.program, .state { overflow: hidden; }

/* Video play buttons: pulsing ring */
.video__play { transition: transform .35s var(--ease-out); }
.video:hover .video__play { transform: translate(-50%, -50%) scale(1.12); }
.anim .video::after {
  content: ""; position: absolute; left: 50%; top: 50%; width: 65px; height: 65px; margin: -32.5px 0 0 -32.5px;
  border-radius: 50%; border: 2px solid rgba(255,255,255,.8); pointer-events: none;
  animation: hb-ring 2.4s ease-out infinite;
}

/* Carousel arrows nudge */
.carousel__btn { transition: transform .25s var(--ease-out); }
.carousel__btn--prev:hover { transform: translateY(-50%) translateX(-4px); }
.carousel__btn--next:hover { transform: translateY(-50%) translateX(4px); }

/* Stats: tag arrow bounce once revealed */
.anim .stats li.is-in .stat__tag { animation: hb-pop .6s var(--ease-out) calc(.25s + var(--i, 0) * 90ms) both; }

/* Collage: slow drift */
.anim .quiz__collage { overflow: hidden; }
.anim .quiz__collage img { animation: hb-drift 24s ease-in-out infinite alternate; }

/* Quiz card glow when focused from CTA */

/* Header gets a shadow once you scroll */
.site-header { transition: box-shadow .3s, background-color .3s; }
.site-header.is-scrolled { box-shadow: 0 8px 24px -16px rgba(28, 42, 53, .35); background: rgba(251, 249, 246, .94); backdrop-filter: saturate(1.4) blur(8px); }

/* Signature draws in */
.anim .team__sign img { clip-path: inset(0 100% 0 0); transition: clip-path 1.6s var(--ease-out) .3s; }
.anim .team__sign.is-in img { clip-path: inset(0 0 0 0); }

/* ---------- Keyframes ---------- */
@keyframes hb-rise { to { opacity: 1; transform: none; } }
@keyframes hb-pop { 0% { opacity: 0; transform: scale(.6); } 70% { opacity: 1; transform: scale(1.06); } 100% { opacity: 1; transform: none; } }
@keyframes hb-float { 0%, 100% { translate: 0 0; } 50% { translate: 0 -10px; } }
@keyframes hb-settle { from { scale: 1.08; } to { scale: 1; } }
@keyframes hb-fill { to { background-position: 0 0; } }
@keyframes hb-bob { 0% { transform: translateY(0); } 40% { transform: translateY(-8px); } 100% { transform: none; } }
@keyframes hb-ring { 0% { transform: scale(1); opacity: .9; } 100% { transform: scale(1.9); opacity: 0; } }
@keyframes hb-drift { from { transform: scale(1.06) translateX(-1.5%); } to { transform: scale(1.06) translateX(1.5%); } }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}

/* Auto-detected cards on inner pages */
.hb-card { transition: transform .45s var(--ease-out), box-shadow .45s var(--ease-out), opacity .8s var(--ease-out); }
.hb-card:hover { transform: translateY(-6px); box-shadow: 0 18px 40px -18px rgba(28, 42, 53, .35); }
details.hb-card:hover, li.hb-card:hover { transform: translateY(-2px); }