@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap');

/* ─── Base ─── */
html {
    scroll-behavior: smooth;
}

body {
    font-family: 'Inter', sans-serif;
}

/* ─── Hero overlay ─── */
.overlay {
    background: rgba(0, 0, 0, 0.5);
}

/* ─── Animations ─── */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes slideInRight {
    from {
        transform: translateX(110%);
        opacity: 0;
    }
    to {
        transform: translateX(0);
        opacity: 1;
    }
}

@keyframes countUp {
    from { opacity: 0; transform: scale(0.8); }
    to   { opacity: 1; transform: scale(1); }
}

.animate-fade-in {
    animation: fadeInUp 0.9s ease both;
}

.animate-slide-in {
    animation: slideInRight 0.45s cubic-bezier(.22,.68,0,1.2) both;
}

/* ─── Scroll reveal ─── */
.reveal {
    opacity: 0;
    transform: translateY(28px);
    transition: opacity 0.6s ease, transform 0.6s ease;
}

.reveal.visible {
    opacity: 1;
    transform: translateY(0);
}

/* ─── Navbar transition on scroll ─── */
nav {
    transition: box-shadow 0.3s ease, background-color 0.3s ease;
}

/* ─── Counter animation ─── */
.stat-value {
    animation: countUp 0.8s ease both;
    animation-play-state: paused;
}

.stat-value.counted {
    animation-play-state: running;
}

/* ─── Form focus ring ─── */
.form-field:focus {
    outline: none;
    border-color: #2563eb;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.15);
}

.form-field.error {
    border-color: #ef4444;
}

/* ─── Service card image zoom ─── */
.service-card .card-img {
    transition: transform 0.4s ease;
}

.service-card:hover .card-img {
    transform: scale(1.06);
}

/* ─── WhatsApp pulse ─── */
@keyframes pulse-green {
    0%, 100% { box-shadow: 0 0 0 0 rgba(34,197,94,.6); }
    50%       { box-shadow: 0 0 0 12px rgba(34,197,94,0); }
}

#whatsapp-btn {
    animation: pulse-green 2s infinite;
}