/* style.css */

/* Tivora Brand Colors */
:root {
    --tivora-navy: #151B2E;
    --tivora-blue: #2A64F6;
    --tivora-purple: #8B3DFF;
}

body {
    font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    color: var(--tivora-navy);
}

/* Navbar Styling */
#brand-logo {
    max-height: 50px;
}

.nav-link {
    font-weight: 500;
    color: var(--tivora-navy);
}

/* Gradient Button */
.btn-brand {
    background: linear-gradient(135deg, var(--tivora-blue), var(--tivora-purple));
    color: white;
    border: none;
    font-weight: 500;
}

.btn-brand:hover {
    background: linear-gradient(135deg, var(--tivora-purple), var(--tivora-blue));
    color: white;
    opacity: 0.9;
}

/* Typography & Utilities */
.text-gradient {
    background: linear-gradient(135deg, var(--tivora-blue), var(--tivora-purple));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.bg-light-gray {
    background-color: #F8F9FA;
}

.coming-soon-link {
    color: var(--tivora-blue);
    transition: color 0.3s ease;
}

.coming-soon-link:hover {
    color: var(--tivora-purple);
}
/* Footer Hover Effects */
.hover-white:hover {
    color: #ffffff !important;
    transition: color 0.3s ease;
} 


/******************WhatsApp footer Floating*************/

    /* WhatsApp Floating Button CSS */
    .floating-whatsapp {
        position: fixed;
        bottom: 30px;
        right: 30px;
        z-index: 9999; 
        display: flex;
        border-radius: 14px; /* Helps the shadow wrap smoothly around the image corners */
        box-shadow: 0px 10px 30px rgba(0, 0, 0, 0.15);
        transition: transform 0.3s ease, box-shadow 0.3s ease;
    }

    .floating-whatsapp:hover {
        transform: translateY(-5px) scale(1.05);
        box-shadow: 0px 14px 34px rgba(37, 211, 102, 0.3);
    }

    .whatsapp-icon-img {
        width: 60px;
        height: 60px;
        object-fit: contain;
    }

    /* Mobile Responsive Adjustments */
    @media (max-width: 768px) {
        .floating-whatsapp {
            bottom: 20px;
            right: 20px;
        }
        .whatsapp-icon-img {
            width: 55px;
            height: 55px;
        }
    }
