/* Aligned Attachments — animations & motion */

/* Reveal on scroll */
.reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 700ms cubic-bezier(.2,.8,.2,1),
              transform 700ms cubic-bezier(.2,.8,.2,1);
  will-change: opacity, transform;
}
.reveal.is-visible {
  opacity: 1;
  transform: none;
}
/* stagger via index */
.reveal[data-stagger="1"] { transition-delay: 80ms; }
.reveal[data-stagger="2"] { transition-delay: 160ms; }
.reveal[data-stagger="3"] { transition-delay: 240ms; }
.reveal[data-stagger="4"] { transition-delay: 320ms; }
.reveal[data-stagger="5"] { transition-delay: 400ms; }
.reveal[data-stagger="6"] { transition-delay: 480ms; }
.reveal[data-stagger="7"] { transition-delay: 560ms; }

/* Hero entrance — animate transform only, keep content visible by default
   so iframes that don't progress rAF still show the content. */
@keyframes aaFadeUp {
  from { opacity: 0.001; transform: translateY(24px); }
  to   { opacity: 1; transform: none; }
}
@keyframes aaFadeIn {
  from { opacity: 0.001; }
  to   { opacity: 1; }
}
@keyframes aaScaleIn {
  from { opacity: 0.001; transform: scale(.94); }
  to   { opacity: 1; transform: scale(1); }
}
.hero-display, .hero-eyebrow, .hero-sub, .hero-cta-row, .hero-trust-row {
  animation: aaFadeUp 900ms cubic-bezier(.2,.8,.2,1) both;
  opacity: 1; /* fallback if animation never runs */
}
.hero-eyebrow { animation-delay: 0ms; }
.hero-display { animation-delay: 120ms; }
.hero-sub { animation-delay: 280ms; }
.hero-cta-row { animation-delay: 420ms; }
.hero-trust-row { animation-delay: 560ms; }
.hero-img-wrap {
  animation: aaScaleIn 1100ms cubic-bezier(.2,.8,.2,1) both;
  animation-delay: 200ms;
  opacity: 1;
}

/* Floating subtle drift on hero photo */
@keyframes aaFloat {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-8px); }
}
.hero-img { animation: aaFloat 7s ease-in-out infinite; }

/* Marquee scroll (if class present) */
@keyframes aaMarquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}
.marquee-strip { overflow: hidden; }
.marquee-strip .marquee-track {
  display: inline-flex; gap: 48px;
  animation: aaMarquee 38s linear infinite;
  white-space: nowrap;
}

/* Step cards lift */
.step-card {
  transition: transform 380ms cubic-bezier(.2,.8,.2,1),
              box-shadow 380ms cubic-bezier(.2,.8,.2,1);
}
.step-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 24px 48px rgba(20,57,58,.18), 0 4px 12px rgba(20,57,58,.10);
}
.step-num {
  transition: color 300ms ease;
}
.step-card:hover .step-num { color: var(--aa-gold-500); }

/* Buttons - subtle shimmer on hover */
.btn { position: relative; overflow: hidden; transition: transform 220ms ease, box-shadow 220ms ease, background 220ms ease; }
.btn::before {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(120deg, transparent 30%, rgba(255,255,255,.18) 50%, transparent 70%);
  transform: translateX(-120%);
  transition: transform 700ms cubic-bezier(.2,.8,.2,1);
  pointer-events: none;
}
.btn:hover { transform: translateY(-2px); box-shadow: 0 12px 24px rgba(20,57,58,.18); }
.btn:hover::before { transform: translateX(120%); }
.btn-outline:hover { background: var(--aa-ink-1000); color: var(--aa-cream-100); }

/* Blog card hover */
.blog-card {
  transition: transform 380ms cubic-bezier(.2,.8,.2,1),
              box-shadow 380ms cubic-bezier(.2,.8,.2,1);
}
.blog-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 22px 40px rgba(20,57,58,.16);
}
.blog-card .img-wrap img { transition: transform 700ms cubic-bezier(.2,.8,.2,1); }
.blog-card:hover .img-wrap img { transform: scale(1.05); }

/* Testimonial cards */
.tcard {
  transition: transform 380ms cubic-bezier(.2,.8,.2,1), box-shadow 380ms;
}
.tcard:hover { transform: translateY(-4px); box-shadow: 0 18px 36px rgba(20,57,58,.14); }

/* Social tile hover lift */
.social-tile { transition: transform 320ms cubic-bezier(.2,.8,.2,1); position: relative; overflow: hidden; }
.social-tile img { transition: transform 600ms cubic-bezier(.2,.8,.2,1), filter 320ms ease; }
.social-tile:hover { transform: translateY(-3px); }
.social-tile:hover img { transform: scale(1.06); filter: brightness(1.05); }
.social-tile::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, transparent 60%, rgba(20,57,58,.45));
  opacity: 0; transition: opacity 320ms ease;
  pointer-events: none;
}
.social-tile:hover::after { opacity: 1; }

/* Eyebrow underline draw-in on hover (in CTAs etc.) */
.eyebrow-line { display: inline-block; }

/* Nav link underline grow */
.nav-link { position: relative; }
.nav-link::after {
  content: ""; position: absolute; left: 50%; right: 50%; bottom: -6px;
  height: 1.5px; background: var(--aa-gold-500);
  transition: left 300ms ease, right 300ms ease;
}
.nav-link:hover::after, .nav-link.is-active::after { left: 0; right: 0; }

/* FAQ open animation */
.faq-item summary {
  list-style: none;
  cursor: pointer;
  transition: color 220ms ease;
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after {
  content: "+"; float: right;
  font-family: var(--aa-font-display);
  font-size: 28px; font-weight: 300;
  color: var(--aa-teal-700);
  transition: transform 320ms cubic-bezier(.2,.8,.2,1);
  line-height: 1;
}
.faq-item[open] summary::after { transform: rotate(45deg); }
.faq-item[open] .faq-body {
  animation: aaFadeUp 420ms cubic-bezier(.2,.8,.2,1) both;
}

/* Session row hover */
.session-row { transition: transform 280ms ease, box-shadow 280ms ease, border-color 280ms ease; }
.session-row:hover { transform: translateY(-2px); box-shadow: 0 12px 28px rgba(20,57,58,.12); border-color: var(--aa-gold-500); }

/* Form fields focus */
.field input, .field textarea, .field select {
  transition: border-color 220ms ease, box-shadow 220ms ease, background 220ms ease;
}
.field input:focus, .field textarea:focus, .field select:focus {
  outline: none;
  border-color: var(--aa-teal-700);
  box-shadow: 0 0 0 4px rgba(31,110,112,.12);
}

/* Mint CTA pulse — gentle */
@keyframes aaGentlePulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(20,57,58,0); }
  50%      { box-shadow: 0 0 0 12px rgba(20,57,58,.04); }
}
.mint-cta .btn { animation: aaGentlePulse 3.6s ease-in-out infinite; }

/* Page transition — keep content visible if rAF never advances */
@keyframes aaPageIn {
  from { opacity: 0.001; transform: translateY(8px); }
  to   { opacity: 1; transform: none; }
}
main {
  animation: aaPageIn 500ms cubic-bezier(.2,.8,.2,1) both;
  opacity: 1;
}

/* Workbook book hover */
@keyframes aaBookFloat {
  0%, 100% { transform: rotate(-3deg) translateY(0); }
  50%      { transform: rotate(-3deg) translateY(-10px); }
}
.workbook-book { animation: aaBookFloat 5s ease-in-out infinite; }

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}
