/* ─── Zone: Products — محصولات ─── */
.mk-page--products,
#mk-products {
    /* === Light mode (default) === */
    /* Brand / accent */
    --mk-primary: #e00d0d;
    --mk-primary-dark: #0cea86;
    --mk-primary-dark-2: #ea0c0c;
    --mk-primary-soft: rgba(6, 181, 212, 0.466);
    --mk-primary-soft-header: rgb(142 6 212 / 40%);
    --mk-primary-soft-background: rgb(221 196 189);

    /* Surfaces */
    --mk-surface: #7988ea;
    --mk-surface-2: #d0cde9c6;
    --mk-surface-3: #2a52a3;
    --mk-surface-4: #2e2860;
    --mk-surface-5:rgb(216, 220, 238);
    --mk-surface-6:#d4ca79;
    --mk-surface-7: #0f172a;
    --mk-surface-8: #2e2860;
    --mk-surface-9:#570707;
    --mk-surface-10:rgba(245, 157, 4, 0.344);

    /* Nav background Color */
    --mk-nav-color-1:rgb(61, 165, 225);
    --mk-nav-color-2:rgb(225, 179, 61);
    --mk-nav-color-3:rgb(155, 103, 208);
    --mk-nav-color-4:rgb(27, 82, 155);
    --mk-nav-color-5:rgb(166, 86, 215);
    --mk-nav-color-6:rgb(84, 53, 116);

    /* Borders */
    --mk-border: #000000;
    --mk-border-color: white;

    /* Text */
    --mk-text: #060505;
    --mk-text-header: #cb5c3a;
    --mk-text-2: #f5f4f4;
    --mk-muted: #f1e2e2;
    --mk-muted-2: #390b0b;
    --mk-muted-3: #0a0303;

    /* Semantic */
    --mk-success: #960505;
    --mk-Icon: #ea3e0c;
    --mk-TOR: #7ed5ee;

    /* Buttons */
    --mk-btn1: #294d99;
    --mk-btn1-H: #811717;

    /* Radius / Shadows / Ease */
    --mk-radius: 12px;
    --mk-radius-lg: 18px;
    --mk-shadow-sm: 0 1px 20px rgb(102 18 128);
    --mk-shadow: 0 4px 20px rgba(6, 182, 212, 0.12);
    --mk-shadow-lg: 0 16px 40px rgba(6, 182, 212, 0.18);
    --mk-ease: cubic-bezier(0.22, 1, 0.36, 1);

    /* Zone fonts */
    --zone-font-display: 'Diaplo', 'Mikhak-R', sans-serif;
    --zone-font-body: 'Mikhak-R', sans-serif;
}

/* ─── Dark mode ─── */
[data-theme="dark"] .mk-page--products,
[data-theme="dark"] #mk-products {
    /* Brand / accent */
    --mk-primary: #ff4444;
    --mk-primary-dark: #0cea86;
    --mk-primary-dark-2: #0cea86;
    --mk-primary-soft: rgb(187 209 223 / 44%);
    --mk-primary-soft-header: rgb(142 6 212 / 25%);
    --mk-primary-soft-background: rgb(20 46 77);

    /* Surfaces */
    --mk-surface: #0f172a;
    --mk-surface-2: #0b1220;
    --mk-surface-3: #1e293b;
    --mk-surface-4: #1a1a3a;
    --mk-surface-5: #111827;
    --mk-surface-6: #1e293b;
    --mk-surface-7: rgb(4, 7, 14);
    --mk-surface-8:#ad5612;
    --mk-surface-9:#d4b9f4;
    --mk-surface-10:#c91212c4;

    /* Nav background Color */
    --mk-nav-color-1:rgb(12, 35, 89);
    --mk-nav-color-2:rgb(46, 9, 68);
    --mk-nav-color-3:rgb(8, 3, 16);
    --mk-nav-color-4:rgb(27, 82, 155);
    --mk-nav-color-5:rgb(138, 79, 194);
    --mk-nav-color-6:rgb(37, 47, 90);

    /* Borders */
    --mk-border: #334155;
    --mk-border-color: #475569;

    /* Text */
    --mk-text: #f8fafc;
    --mk-text-header: #f8fafc;
    --mk-text-2: #e2e8f0;
    --mk-muted: #94a3b8;
    --mk-muted-2: #f1e2e2;
    --mk-muted-3: #f1e2e2;

    /* Semantic */
    --mk-success: #059669;
    --mk-Icon: #ff7043;
    --mk-TOR: #7ed5ee;

    /* Buttons */
    --mk-btn1: #1e293b;
    --mk-btn1-H: #334155;

    /* Radius / Shadows / Ease (structural — same as light) */
    --mk-radius: 12px;
    --mk-radius-lg: 18px;
    --mk-shadow-sm: 0 1px 20px rgba(0, 0, 0, 0.3);
    --mk-shadow: 0 4px 20px rgba(0, 0, 0, 0.25);
    --mk-shadow-lg: 0 16px 40px rgba(0, 0, 0, 0.4);
    --mk-ease: cubic-bezier(0.22, 1, 0.36, 1);

    /* Zone fonts */
    --zone-font-display: 'Diaplo', 'Mikhak-R', sans-serif;
    --zone-font-body: 'Mikhak-R', sans-serif;
}

/* FAQ intro — lead ????? + ???? ???? (???? ???? ??????) */
.mk-page--products .mk-faq-intro .mk-faq-lead {
    color: var(--mk-muted);
}

.mk-page--products .mk-faq-intro .mk-btn {
    font-size: 0.88rem;
}