:root {
            --primary: #4A6BF2;
            --secondary: #5CC4B8;
        }

        /* Hero */
        .hero {
            background: var(--primary);
            color: #fff;
            padding: 80px 20px;
            text-align: center;
        }

        .hero h1 {
            font-weight: 700;
            font-size: 2.8rem;
        }

        .sub {
            color: #666;
        }

        .section-title {
            color: var(--primary);
            font-weight: 700;
        }

        .card h5 {
            color: var(--secondary);
        }

        footer {
            background: var(--primary);
            color: #fff;
            padding: 25px;
            text-align: center;
            margin-top: 60px;
        }