@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800&family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&family=Hind+Siliguri:wght@300;400;500;600;700&display=swap');
@import url('https://fonts.cdnfonts.com/css/solaimanlipi');

:root {
    --primary-blue: #0f172a;
    /* Deeper professional blue */
    --accent-blue: #3b82f6;
    --accent-orange: #f97316;
    --bg-white: #ffffff;
    --bg-soft: #f8fafc;
    --text-main: #0f172a;
    --text-muted: #64748b;
    /* Font Stacks */
    --font-en-body: 'Plus Jakarta Sans', sans-serif;
    --font-en-heading: 'Outfit', sans-serif;
    --font-bn-body: 'SolaimanLipi', sans-serif;
    --font-bn-heading: 'Hind Siliguri', sans-serif;
}

body {
    font-family: var(--font-en-body);
    scroll-behavior: smooth;
    color: var(--text-main);
}

/* Language Specific Font Switching */
html[lang="bn"] body {
    font-family: var(--font-bn-body);
}

h1,
h2,
h3,
h4,
.font-heading {
    font-family: var(--font-en-heading);
}

html[lang="bn"] h1,
html[lang="bn"] h2,
html[lang="bn"] h3,
html[lang="bn"] h4,
html[lang="bn"] .font-heading,
html[lang="bn"] nav a {
    font-family: var(--font-bn-heading);
}

.glass-nav {
    background: rgba(255, 255, 255, 0.7);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-bottom: 1px solid rgba(255, 255, 255, 0.4);
}

.glass-card {
    background: rgba(255, 255, 255, 0.6);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.4);
}

.hero-gradient {
    background: radial-gradient(circle at top right, rgba(37, 99, 235, 0.12), transparent 40%),
        radial-gradient(circle at bottom left, rgba(59, 130, 246, 0.08), transparent 40%),
        radial-gradient(circle at center, rgba(37, 99, 235, 0.03), transparent 70%);
}

.service-card {
    transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    border: 1px solid rgba(0, 0, 0, 0.03);
}

.service-card:hover {
    transform: translateY(-12px) scale(1.02);
    box-shadow: 0 30px 60px -12px rgba(0, 0, 0, 0.08),
        0 18px 36px -18px rgba(0, 0, 0, 0.08);
    background: white;
}

.cta-button {
    transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.cta-button:hover {
    transform: translateY(-3px) scale(1.03);
    box-shadow: 0 20px 25px -5px rgba(37, 99, 235, 0.4);
}

/* Scroll Animations */
.reveal {
    opacity: 0;
    transform: translateY(40px);
    transition: all 1s cubic-bezier(0.22, 1, 0.36, 1);
}

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

/* Mobile Menu Transition */
#mobile-menu {
    transition: all 0.3s ease-in-out;
    max-height: 0;
    overflow: hidden;
}

#mobile-menu.active {
    max-height: 400px;
}