/* Preloader */
.loader { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: var(--white); z-index: 9999; display: flex; justify-content: center; align-items: center; transition: opacity 0.5s ease; }
.spinner { width: 40px; height: 40px; border: 4px solid var(--gray); border-top-color: var(--primary); border-radius: 50%; animation: spin 1s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

/* Scroll Progress & Back to Top */
.scroll-progress { position: fixed; top: 0; left: 0; height: 3px; background: var(--primary); z-index: 10000; width: 0%; transition: width 0.1s; }
.back-to-top { position: fixed; bottom: 30px; right: 30px; width: 50px; height: 50px; background: var(--black); color: var(--white); border: none; border-radius: 50%; cursor: pointer; opacity: 0; visibility: hidden; transition: var(--transition); z-index: 90; box-shadow: var(--shadow-md); display: flex; justify-content: center; align-items: center; }
.back-to-top.show { opacity: 1; visibility: visible; }
.back-to-top:hover { background: var(--primary); color: var(--black); transform: translateY(-5px); }

/* Intersection Observer Utility Classes */
.reveal { opacity: 0; visibility: hidden; }
.reveal.active { opacity: 1; visibility: visible; }

.fade-up.active { animation: fadeUp 0.8s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
.zoom-in.active { animation: zoomIn 0.6s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
.slide-left.active { animation: slideLeft 0.8s ease forwards; }
.slide-right.active { animation: slideRight 0.8s ease forwards; }

.delay-100 { animation-delay: 0.1s; }
.delay-200 { animation-delay: 0.2s; }

@keyframes fadeUp { from { opacity: 0; transform: translateY(40px); } to { opacity: 1; transform: translateY(0); } }
@keyframes zoomIn { from { opacity: 0; transform: scale(0.9); } to { opacity: 1; transform: scale(1); } }
@keyframes slideLeft { from { opacity: 0; transform: translateX(-30px); } to { opacity: 1; transform: translateX(0); } }
@keyframes slideRight { from { opacity: 0; transform: translateX(30px); } to { opacity: 1; transform: translateX(0); } }

/* Pulse CTA */
.pulse { box-shadow: 0 0 0 0 rgba(255, 193, 7, 0.7); animation: pulseAnim 2s infinite; }
@keyframes pulseAnim {
    0% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(255, 193, 7, 0.7); }
    70% { transform: scale(1); box-shadow: 0 0 0 15px rgba(255, 193, 7, 0); }
    100% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(255, 193, 7, 0); }
}