/* Supplements the compiled Tailwind stylesheet with the motion the original site rendered via JavaScript. */
html, body { background-color: #0A0A0B; }

/* Fade-up on first view */
.js .reveal { opacity: 0; transform: translateY(28px); transition: opacity .6s cubic-bezier(.22,1,.36,1), transform .6s cubic-bezier(.22,1,.36,1), border-color .3s, background-color .3s; }
.js .reveal.reveal-sm { transform: translateY(16px); transition-duration: .45s, .45s, .3s, .3s; }
.js .reveal.in { opacity: 1; transform: none; }

/* Hero entrance */
.enter { animation: enter .8s cubic-bezier(.22,1,.36,1) both; }
@keyframes enter { from { opacity: 0; transform: translateY(28px); } to { opacity: 1; transform: none; } }
.scroll-hint { animation: fade .6s 1s both; }
@keyframes fade { from { opacity: 0; } to { opacity: 1; } }
.bob { display: inline-block; animation: bob 1.8s ease-in-out infinite; }
@keyframes bob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(6px); } }

/* Accordion */
.acc-body { display: grid; grid-template-rows: 0fr; opacity: 0; transition: grid-template-rows .32s cubic-bezier(.22,1,.36,1), opacity .32s cubic-bezier(.22,1,.36,1); }
.acc-body > div { overflow: hidden; min-height: 0; }
.acc.open .acc-body { grid-template-rows: 1fr; opacity: 1; }

/* Services panel crossfade */
.panel-img { opacity: 0; transform: scale(1.04); transition: opacity .5s cubic-bezier(.22,1,.36,1), transform .5s cubic-bezier(.22,1,.36,1); }
.panel-img.active { opacity: 1; transform: scale(1); }
.panel-text.active { animation: panel-in .35s cubic-bezier(.22,1,.36,1) both; }
@keyframes panel-in { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }

/* Process step markers */
.step-dot { border-color: rgba(255,255,255,0.15); color: #94A3B8; transition: border-color .5s, color .5s; }
.step-dot.in { border-color: rgba(0,229,255,0.6); color: #00E5FF; }

.appt-flash { animation: enter .5s cubic-bezier(.22,1,.36,1) both; }

@media (prefers-reduced-motion: reduce) {
  .enter, .scroll-hint, .bob, .panel-text.active, .appt-flash { animation: none; }
  .js .reveal { opacity: 1; transform: none; }
}