/* =========================================================
   Animations & transitions (optional layer)
   To remove: delete the two lines in index.html that load
   css/animations.css and js/animations.js. Nothing else changes.
   ========================================================= */

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

/* ---------- Scroll reveal ---------- */
.anim-ready [data-reveal] {
  opacity: 0;
  transform: translate3d(0, 28px, 0);
  transition: opacity .8s var(--ease-out), transform .9s var(--ease-out);
  transition-delay: var(--d, 0ms);
  will-change: opacity, transform;
}
.anim-ready [data-reveal="fade"] { transform: none; }
.anim-ready [data-reveal="left"] { transform: translate3d(-36px, 0, 0); }
.anim-ready [data-reveal="right"] { transform: translate3d(36px, 0, 0); }
.anim-ready [data-reveal="zoom"] { transform: scale(.94); }
.anim-ready [data-reveal].is-in { opacity: 1; transform: none; will-change: auto; }

/* ---------- Hero entrance ---------- */
.anim-ready .hero__bg-img-wrap img {
  transform: scale(1.08);
  transition: transform 2.4s var(--ease-out);
}
.anim-ready.is-loaded .hero__bg-img-wrap img { transform: scale(1); }
.anim-ready .hero__bg-shade { opacity: .55; transition: opacity 1.6s var(--ease-soft); }
.anim-ready.is-loaded .hero__bg-shade { opacity: 1; }

.anim-ready .hero [data-hero] {
  opacity: 0;
  transform: translate3d(0, 24px, 0);
  transition: opacity .9s var(--ease-out), transform 1s var(--ease-out);
  transition-delay: var(--d, 0ms);
}
.anim-ready.is-loaded .hero [data-hero] { opacity: 1; transform: none; }

/* shimmer sweep across the hero accent line, once */
.hero__title em {
  background: linear-gradient(100deg, var(--gold) 0%, var(--gold) 40%, #fff3c4 50%, var(--gold) 60%, var(--gold) 100%);
  background-size: 250% 100%;
  background-position: 100% 0;
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
}
.anim-ready.is-loaded .hero__title em { animation: shimmer 2.2s var(--ease-soft) 1.1s 1 both; }
@keyframes shimmer { from { background-position: 100% 0; } to { background-position: 0 0; } }

/* ---------- Header ---------- */
.site-nav { transition: box-shadow .35s var(--ease-soft), background-color .35s; }
.site-nav.is-scrolled { box-shadow: 0 8px 24px -16px rgba(35,31,32,.35); }
.site-nav__logo img { transition: transform .4s var(--ease-out); }
.site-nav__logo:hover img { transform: scaleY(-1) scale(1.03); }
.site-nav__link { position: relative; }
.site-nav__link::after {
  content: ""; position: absolute; left: 8px; right: 8px; bottom: 4px; height: 2px; border-radius: 2px;
  background: var(--gold); transform: scaleX(0); transform-origin: left; transition: transform .35s var(--ease-out);
}
.site-nav__link:hover::after { transform: scaleX(1); }

/* ---------- Buttons: lift + soft glow ---------- */
.btn-nav, .btn-hero, .btn-lg, .btn-pkg, .btn-outline-gold, .btn-pill, .btn-share, .finder__submit, .round-btn, .tab {
  transition: transform .3s var(--ease-out), box-shadow .3s var(--ease-out), background-color .25s, color .25s, border-color .25s, filter .25s;
}
.btn-nav:hover, .btn-hero--primary:hover, .btn-lg--gold:hover, .finder__submit:hover, .btn-pkg--gold:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 22px -10px rgba(236,192,43,.75);
}
.btn-hero--ghost:hover, .btn-lg--outline:hover, .btn-outline-gold:hover, .btn-pill:hover, .btn-share:hover, .btn-pkg--tint:hover, .btn-pkg--grey:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 20px -12px rgba(0,0,0,.35);
}
.btn-nav:active, .btn-hero:active, .btn-lg:active, .btn-pkg:active, .finder__submit:active, .round-btn:active { transform: translateY(0) scale(.98); }
.round-btn:hover { transform: translateY(-2px); box-shadow: 0 10px 20px -10px rgba(236,192,43,.8); }
.round-btn img { transition: transform .3s var(--ease-out); }
.round-btn--solid:hover img { transform: translateX(2px); }
.round-btn--outline:hover img { transform: scaleX(-1) translateX(2px); }
.tab:not(.is-active):hover { transform: translateY(-1px); background: #fffaf0; }
.btn-hero img, .btn-lg img { transition: transform .35s var(--ease-out); }
.btn-hero:hover img, .btn-lg:hover img { transform: rotate(-8deg) scale(1.08); }
.hero__campus-link img, .btn-pill img, .btn-pkg--gold img { transition: transform .3s var(--ease-out); }
.hero__campus-link:hover img, .btn-pill:hover img, .btn-pkg--gold:hover img { transform: translateX(3px); }

/* ---------- Finder ---------- */
.finder__input, .finder__select { transition: border-color .25s, box-shadow .25s, background-color .25s; }
.finder__input:focus, .finder__select:focus { box-shadow: 0 0 0 3px rgba(251,191,36,.18); }
.finder__live i { animation: blink 1.8s ease-in-out infinite; }
.finder__title i, .hero__badge-dot { animation: glow 2.4s ease-in-out infinite; }
@keyframes blink { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }
@keyframes glow { 0%, 100% { box-shadow: 0 0 0 0 rgba(236,192,43,.55); } 50% { box-shadow: 0 0 0 4px rgba(236,192,43,0); } }

/* ---------- Stats strip ---------- */
.live-pill i { animation: blink 1.2s ease-in-out infinite; }
.stats__badge { transition: transform .4s var(--ease-out), background-color .3s; }
.stats__item:hover .stats__badge { transform: rotate(-10deg) scale(1.1); background: rgba(251,191,36,.2); }

/* ---------- Doctor cards ---------- */
.doctor-card { transition: transform .45s var(--ease-out), box-shadow .45s var(--ease-out); }
.doctor-card:hover { transform: translateY(-6px); box-shadow: 0 24px 40px -22px rgba(28,25,23,.55); }
.doctor-card__photo img { transition: transform .8s var(--ease-out); }
.doctor-card:hover .doctor-card__photo img { transform: scale(1.06); }
.doctor-card__cta img { transition: transform .35s var(--ease-out); }
.doctor-card:hover .doctor-card__cta img { transform: translate(3px, -3px); }
.doctor-card__cta { transition: border-color .35s; }
.doctor-card:hover .doctor-card__cta { border-top-color: rgba(236,192,43,.7); }

/* ---------- Staff banner ---------- */
.staff-banner { background-size: 140% 100%; background-position: 0 0; transition: background-position 1.2s var(--ease-out); }
.staff-banner:hover { background-position: 100% 0; }
.avatars span { transition: transform .35s var(--ease-out); }
.staff-banner:hover .avatars span:nth-child(1) { transform: translateY(-3px); }
.staff-banner:hover .avatars span:nth-child(2) { transform: translateY(-3px); transition-delay: .05s; }
.staff-banner:hover .avatars span:nth-child(3) { transform: translateY(-3px); transition-delay: .1s; }

/* ---------- Department cards ---------- */
.dept-card__media-crop img { transition: transform 1s var(--ease-out); }
.dept-card:hover .dept-card__media-crop img { transform: scale(1.08); }
.dept-card__media::after { transition: opacity .5s var(--ease-soft); }
.dept-card:hover .dept-card__media::after { opacity: .75; }
.dept-card__num { transition: background-color .35s, color .35s, border-color .35s, transform .35s var(--ease-out); }
.dept-card:hover .dept-card__num { background: #fbbf24; color: #000; border-color: #fbbf24; transform: scale(1.06); }
.dept-card__body { transition: transform .5s var(--ease-out); }
.dept-card:hover .dept-card__body { transform: translateY(-6px); }

/* ---------- Amenity cards ---------- */
.amenity { transition: transform .45s var(--ease-out), box-shadow .45s var(--ease-out); }
.amenity:hover { transform: translateY(-6px); box-shadow: 0 26px 40px -26px rgba(127,86,0,.55); }
.amenity__icon { transition: transform .45s var(--ease-out); }
.amenity:hover .amenity__icon { transform: translateY(-3px) rotate(-6deg); }

/* ---------- Package cards ---------- */
.pkg-card { transition: transform .45s var(--ease-out), box-shadow .45s var(--ease-out); }
.pkg-card:hover { transform: translateY(-4px); box-shadow: 0 30px 40px -18px rgba(0,0,0,.45), 0 8px 10px -6px rgba(0,0,0,.1); }
.pkg-card__media img { transition: transform 1s var(--ease-out); }
.pkg-card:hover .pkg-card__media img { transform: scale(1.05); }
.pkg-list li { transition: transform .3s var(--ease-out); }
.pkg-list li:hover { transform: translateX(4px); }

/* ---------- Testimonials ---------- */
.review__photo .review__layer--top img { transition: transform 1.2s var(--ease-out); }
.review__photo:hover .review__layer--top img { transform: scale(1.04); }
.anim-ready .review__rating img { opacity: 0; transform: scale(.4) rotate(-40deg); transition: opacity .4s, transform .5s var(--ease-out); }
.anim-ready .review.is-in .review__rating img { opacity: 1; transform: none; }
.review__rating img:nth-child(2) { transition-delay: .08s; }
.review__rating img:nth-child(3) { transition-delay: .16s; }
.review__rating img:nth-child(4) { transition-delay: .24s; }
.review__rating img:nth-child(5) { transition-delay: .32s; }

/* ---------- FAQ ---------- */
.accordion { transition: box-shadow .35s var(--ease-soft), border-color .35s, background-color .35s; }
.accordion:hover { border-color: #ecd9b2; box-shadow: 0 10px 24px -18px rgba(127,86,0,.45); }
.accordion.is-open { background: rgba(255,255,255,.5); }
.accordion__icon { transition: transform .4s var(--ease-out), background-color .3s; }
.accordion:hover .accordion__icon { background: #fde68a; }
.accordion.is-open .accordion__panel { animation: panelIn .45s var(--ease-out); }
@keyframes panelIn { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }

/* ---------- Visit block ---------- */
.map__img img { transition: transform 1.2s var(--ease-out); }
.map:hover .map__img img { transform: scale(1.06); }
.map__pill { animation: float 3.2s ease-in-out infinite; }
@keyframes float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-4px); } }
.place { transition: transform .3s var(--ease-out), border-color .3s, background-color .3s; }
.place:hover { transform: translateY(-2px); border-color: #fde68a; background: #fffdf5; }
.campus-card__pin span { animation: glow 2.4s ease-in-out infinite; }

/* ---------- Footer ---------- */
.footer-links a { display: inline-block; transition: color .25s, transform .3s var(--ease-out); }
.footer-links a:hover { transform: translateX(3px); }
.socials a { transition: background-color .25s, transform .3s var(--ease-out); }
.socials a:hover { transform: translateY(-3px); background: #d4a017; }
.hours__open i { animation: blink 1.8s ease-in-out infinite; }

/* ---------- Back-to-top button ---------- */
.to-top {
  position: fixed; right: 24px; bottom: 24px; z-index: 50; width: 44px; height: 44px; border-radius: 9999px;
  background: var(--gold); color: var(--ink); display: flex; align-items: center; justify-content: center;
  box-shadow: 0 12px 24px -10px rgba(0,0,0,.45);
  opacity: 0; transform: translateY(16px); pointer-events: none;
  transition: opacity .35s var(--ease-soft), transform .35s var(--ease-out), box-shadow .3s;
}
.to-top.is-visible { opacity: 1; transform: none; pointer-events: auto; }
.to-top:hover { transform: translateY(-3px); box-shadow: 0 16px 28px -10px rgba(236,192,43,.8); }
.to-top svg { width: 18px; height: 18px; }

/* ---------- Respect reduced-motion preferences ---------- */
@media (prefers-reduced-motion: reduce) {
  .anim-ready [data-reveal], .anim-ready .hero [data-hero], .anim-ready .review__rating img { opacity: 1 !important; transform: none !important; }
  .hero__title em { -webkit-text-fill-color: currentColor; background: none; }
}