/*
        |--------------------------------------------------------------------------
        | LANDING PAGE
        |--------------------------------------------------------------------------
        */

        .landing-navbar {

            backdrop-filter: blur(12px);

            background: var(--bs-dark-rgb);

            border-bottom: 1px solid var(--bs-secondary-rgb);

            color: white;
        }

        .hero {

            position: relative;

            overflow: hidden;

            padding: 7rem 0 5rem;

            background:
                radial-gradient(circle at top right,
                    rgba(52, 152, 219, .15),
                    transparent 35%),
                radial-gradient(circle at left,
                    rgba(0, 188, 140, .12),
                    transparent 35%);
        }

        .hero-title {

            font-size: clamp(2.5rem, 6vw, 4.5rem);

            font-weight: 700;

            line-height: 1.1;

            margin-bottom: 1.5rem;
        }

        .hero-subtitle {

            max-width: 760px;

            margin: 0 auto;

            font-size: 1.15rem;

            opacity: .78;

            line-height: 1.8;
        }

        .hero-actions {

            margin-top: 2.5rem;
        }

        .hero-device {

            margin-top: 5rem;
        }

        .hero-device .card {

            border-radius: 1.5rem;
        }

        /*
        |--------------------------------------------------------------------------
        | SECTION
        |--------------------------------------------------------------------------
        */

        .landing-section {

            padding: 6rem 0;
        }

        .section-title {

            font-size: 2.2rem;

            font-weight: 700;

            margin-bottom: 1rem;
        }

        .section-subtitle {

            max-width: 760px;

            margin: 0 auto;

            opacity: .75;

            line-height: 1.8;
        }

        /*
        |--------------------------------------------------------------------------
        | FEATURE CARD
        |--------------------------------------------------------------------------
        */

        .feature-card {

            height: 100%;

            padding: 2rem;

            border-radius: 1.25rem;

            background: var(--bs-card-bg);

            border: 1px solid var(--bs-card-border-color);

            transition: .25s;
        }

        .feature-card:hover {

            transform: translateY(-6px);
        }

        .feature-icon {

            width: 72px;

            height: 72px;

            border-radius: 1rem;


            color: var(--bs-primary);

            display: flex;

            align-items: center;

            justify-content: center;

            font-size: 2rem;

            margin-bottom: 1.5rem;
        }

        .feature-title {

            font-size: 1.2rem;

            font-weight: 600;

            margin-bottom: .75rem;
        }

        .feature-text {

            opacity: .75;

            line-height: 1.7;
        }

        /*
        |--------------------------------------------------------------------------
        | DOWNLOAD BOX
        |--------------------------------------------------------------------------
        */

        .download-box {

            padding: 3rem;

            border-radius: 1.5rem;

            background:
                linear-gradient(135deg,
                    rgba(52, 152, 219, .14),
                    rgba(0, 188, 140, .08));

            border: 1px solid var(--bs-card-border-color);
        }

        /*
        |--------------------------------------------------------------------------
        | CONTACT
        |--------------------------------------------------------------------------
        */

        .contact-card {

            max-width: 760px;

            margin: 0 auto;

            padding: 2rem;

            border-radius: 1.5rem;

            background: var(--bs-body-color);

            border: 1px solid var(--bs-card-border-color);
        }

        .form-control {

            min-height: 48px;

            border-radius: .9rem;
        }

        textarea.form-control {

            min-height: 140px;
        }

        /*
        |--------------------------------------------------------------------------
        | FOOTER
        |--------------------------------------------------------------------------
        */

        .landing-footer {

            border-top: 1px solid var(--border-color-soft);
        }