/* Public landing page polish inspired by modern LadiPage-style layouts. */
:root {
    --lp-primary: #3157ff;
    --lp-primary-dark: #1428a0;
    --lp-accent: #8a3ffc;
    --lp-orange: #ff8a22;
    --lp-ink: #101828;
    --lp-muted: #5f6f89;
    --lp-line: #dfe7f4;
    --lp-soft: #f4f7ff;
    --lp-shadow: 0 22px 60px rgba(39, 63, 125, .13);
}

html {
    scroll-behavior: smooth;
}

body {
    background:
        radial-gradient(circle at 0 0, rgba(138, 63, 252, .12), transparent 24rem),
        radial-gradient(circle at 100% 10%, rgba(49, 87, 255, .10), transparent 28rem),
        linear-gradient(180deg, #fbfcff 0%, #f3f6ff 42%, #ffffff 100%) !important;
    color: var(--lp-ink);
}

.navbar {
    border-bottom: 1px solid rgba(223, 231, 244, .82);
}

.navbar-brand {
    letter-spacing: 0;
}

.navbar .site-logo-img {
    width: 104px;
    filter: drop-shadow(0 10px 18px rgba(49, 87, 255, .16));
}

.banner-hero {
    background:
        radial-gradient(circle at 8% 12%, rgba(138, 63, 252, .18), transparent 20rem),
        linear-gradient(135deg, #f7f4ff 0%, #eff5ff 58%, #eef3ff 100%) !important;
    padding: 18px 0 0;
}

.banner-hero-link {
    max-width: 1920px;
    margin: 0 auto;
}

.banner-hero-image {
    border-radius: 0 0 34px 34px;
    box-shadow: 0 28px 78px rgba(49, 87, 255, .16);
}

.stat-strip {
    margin-top: -36px;
    border: 1px solid rgba(223, 231, 244, .95);
    box-shadow: var(--lp-shadow) !important;
}

.stat-number {
    color: var(--lp-primary) !important;
}

.section-eyebrow,
.badge-primary {
    background: #eef2ff !important;
    color: var(--lp-primary) !important;
    border: 1px solid #dfe7ff;
}

.type-tabs {
    border: 1px solid rgba(223, 231, 244, .95);
    box-shadow: var(--lp-shadow) !important;
}

.type-tabs .nav-link {
    text-decoration: none !important;
    color: #41516b;
}

.type-tabs .nav-link.active {
    background: linear-gradient(135deg, var(--lp-primary), var(--lp-accent)) !important;
    box-shadow: 0 16px 32px rgba(49, 87, 255, .24) !important;
}

.filter-box,
.showcase-shell,
.use-card,
.feature-card,
.step-card {
    border: 1px solid rgba(223, 231, 244, .95);
    box-shadow: var(--lp-shadow) !important;
}

.category-link {
    color: #40516c;
}

.category-link.active {
    background: linear-gradient(135deg, var(--lp-primary-dark), var(--lp-primary)) !important;
}

.showcase-card,
.bento-card {
    box-shadow: 0 18px 48px rgba(39, 63, 125, .14) !important;
}

.showcase-card:hover,
.bento-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 30px 70px rgba(39, 63, 125, .20) !important;
}

.btn-primary,
.btn-demo,
.hero-cta-primary {
    background: linear-gradient(135deg, var(--lp-primary), var(--lp-accent)) !important;
    border: 0 !important;
    color: #fff !important;
}

.btn-primary:hover,
.btn-demo:hover,
.hero-cta-primary:hover {
    filter: brightness(1.04);
    box-shadow: 0 18px 34px rgba(49, 87, 255, .22);
}

.btn-outline-primary {
    border-color: #cbd8ff;
    color: var(--lp-primary);
}

.btn-outline-primary:hover {
    background: var(--lp-primary);
    border-color: var(--lp-primary);
}

.bento-card {
    border-radius: 22px;
}

.glass-badge {
    background: rgba(255, 255, 255, .18);
    border: 1px solid rgba(255, 255, 255, .32);
}

.use-card-top,
.use-card-top.orange,
.use-card-top.pink,
.use-card-top.dark {
    background: linear-gradient(135deg, var(--lp-primary), var(--lp-accent)) !important;
    color: #fff !important;
}

.use-card-top.orange {
    background: linear-gradient(135deg, #ff8a22, #ffb84d) !important;
    color: #111827 !important;
}

.feature-icon {
    background: linear-gradient(135deg, var(--lp-primary), var(--lp-accent)) !important;
}

.final-cta {
    background:
        radial-gradient(circle at 14% 18%, rgba(255, 138, 34, .35), transparent 18rem),
        linear-gradient(135deg, var(--lp-primary-dark), var(--lp-primary)) !important;
    box-shadow: 0 30px 80px rgba(49, 87, 255, .22) !important;
}

.site-footer {
    background:
        radial-gradient(circle at 88% 18%, rgba(138, 63, 252, .22), transparent 18rem),
        linear-gradient(135deg, #101828, #172554) !important;
}

@media (max-width: 991.98px) {
    .banner-hero-image {
        border-radius: 0 0 24px 24px;
    }
}

@media (max-width: 767.98px) {
    .navbar .site-logo-img {
        width: 88px;
    }

    .banner-hero {
        min-height: 540px;
        padding: 22px 14px;
        background:
            linear-gradient(180deg, rgba(247, 244, 255, .88), rgba(238, 245, 255, .96)),
            url('/images/home-banner.png') center top / cover no-repeat !important;
    }

    .banner-mobile-content {
        border-radius: 22px;
        box-shadow: 0 22px 54px rgba(39, 63, 125, .18);
    }

    .banner-mobile-content h1 {
        font-size: 2.05rem;
    }

    .stat-strip {
        margin-top: 18px;
    }

    .type-tabs,
    .filter-box,
    .showcase-shell {
        border-radius: 18px;
    }

    .category-link {
        min-width: 148px;
    }

    .showcase-card:hover,
    .bento-card:hover,
    .use-card:hover,
    .feature-card:hover,
    .step-card:hover {
        transform: none;
    }
}
