/* =========================
   GLOBAL REVEAL ANIMATION
========================= */

.reveal {
    opacity: 0;
    transform: translateY(40px);
    transition: all .7s cubic-bezier(.22, .61, .36, 1);
}

.reveal.show {
    opacity: 1;
    transform: none;
}

/* Variations */
.reveal-left {
    transform: translateX(-60px);
}

.reveal-right {
    transform: translateX(60px);
}

.reveal-zoom {
    transform: scale(.85);
}

.reveal-left.show,
.reveal-right.show,
.reveal-zoom.show {
    transform: none;
}

/* =========================
   CARD HOVER LIFT
========================= */
.panel,
.stat-card,
.gc-svc-card {
    transition: transform .25s ease, box-shadow .25s ease;
}

.panel:hover,
.stat-card:hover,
.gc-svc-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 20px 40px rgba(0, 0, 0, .08);
}

/* =========================
   BUTTON MICRO ANIMATION
========================= */
.btn {
    transition: all .2s ease;
}

.btn:hover {
    transform: translateY(-2px);
}

/* =========================
   IMAGE ZOOM ON HOVER
========================= */
.img-hover {
    overflow: hidden;
}

.img-hover img {
    transition: transform .6s ease;
}

.img-hover:hover img {
    transform: scale(1.08);
}

/* =========================
   FADE BASE
========================= */
.fade {
    opacity: 0;
    transition: opacity .9s ease, transform .9s ease;
}

/* Directions */
.fade-up {
    transform: translateY(40px);
}

.fade-down {
    transform: translateY(-40px);
}

.fade-left {
    transform: translateX(-40px);
}

.fade-right {
    transform: translateX(40px);
}

/* When visible */
.fade.show {
    opacity: 1;
    transform: none;
}

/* Optional smooth feel */
.fade-slow {
    transition-duration: 1.2s;
}

.fade-fast {
    transition-duration: .5s;
}

.reveal,
.fade {
    will-change: opacity, transform;
}

.reveal,
.fade {
    will-change: opacity, transform;
}