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

        :root {
            var(--bg-body): #F5F5F7;
            var(--font-sans): 'Plus Jakarta Sans', sans-serif;
        }

        body {
            font-family: var(--font-sans);
            background-color: #F5F5F7;
            color: #1A1A1E;
            overflow-x: hidden;
            -webkit-font-smoothing: antialiased;
        }

        /* Nav & Structure specifics */
        .nav-item {
            color: #71717A;
            transition: all 0.2s ease;
        }

        .nav-item.active {
            background: #000000;
            color: #FFFFFF;
            box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
        }

        .nav-item:hover:not(.active) {
            background: #F4F4F5;
            color: #18181B;
        }

        .mob-nav-item.active {
            color: #000000;
        }

        .mob-nav-item.active i {
            transform: scale(1.15) translateY(-2px);
        }

        .bento-row {
            background: white;
            border-radius: 24px;
            padding: 1.5rem;
            box-shadow: 0 4px 24px rgba(0, 0, 0, 0.02);
            border: 1px solid rgba(0, 0, 0, 0.03);
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 1rem;
            transition: transform 0.2s;
        }

        .bento-row:hover {
            transform: scale(1.01);
            box-shadow: 0 8px 32px rgba(0, 0, 0, 0.05);
        }