/* ============================================================
   CRAFTED REACH - 3D CORNER TILT & CLEAN DARK THEME
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800;900&family=Plus+Jakarta+Sans:wght@600;700;800;900&display=swap');

:root {
    --brand-teal: #00E5BC;
    --brand-cyan: #00B4D8;
    --brand-emerald: #05D550;
    --brand-gold: #F59E0B;
}

html {
    scroll-behavior: smooth;
    font-family: 'Outfit', sans-serif;
    background-color: #060B17;
}

h1, h2, h3, h4, .font-heading {
    font-family: 'Plus Jakarta Sans', sans-serif;
}

/* 1. Real 3D Corner Tilt Card Physics (Subtle & Smooth) */
.tilt-card {
    transition: transform 0.2s cubic-bezier(0.2, 0.8, 0.2, 1), border-color 0.25s ease-out, box-shadow 0.25s ease-out;
    transform-style: preserve-3d;
    will-change: transform;
    cursor: pointer;
}

.tilt-card:hover {
    border-color: rgba(0, 229, 188, 0.7) !important;
    box-shadow: 0 15px 35px -10px rgba(0, 229, 188, 0.25);
}

/* 2. Interactive Buttons */
.motion-btn {
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.motion-btn:hover {
    transform: translateY(-2px) scale(1.03);
    box-shadow: 0 10px 25px -5px rgba(0, 229, 188, 0.4);
}

.motion-btn:active {
    transform: scale(0.97);
}

/* 3. Glowing Featured Border */
@keyframes neonPulse {
    0%, 100% {
        box-shadow: 0 0 15px rgba(0, 229, 188, 0.3);
        border-color: rgba(0, 229, 188, 0.8);
    }
    50% {
        box-shadow: 0 0 30px rgba(0, 229, 188, 0.6);
        border-color: rgba(0, 229, 188, 1);
    }
}

.featured-glow {
    animation: neonPulse 3s infinite ease-in-out;
}

/* 4. Floating Sticky WhatsApp Button (Left bottom) */
.whatsapp-float-btn {
    animation: floatWhatsApp 4s ease-in-out infinite;
}

@keyframes floatWhatsApp {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-5px);
    }
}

/* 5. Custom Scrollbar */
::-webkit-scrollbar {
    width: 8px;
}
::-webkit-scrollbar-track {
    background: #060B17;
}
::-webkit-scrollbar-thumb {
    background: #101F42;
    border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
    background: #00E5BC;
}