/* Malik public site design: generated from resources/views/malik/public/partials/{tokens,site-styles}.blade.php */
:root {
        --bg: #ecefca; --bg-soft: #f4f6e4; --card: #ffffff;
        --ink: #213448; --ink-2: #3a5166; --muted: #5f7383;
        --accent: #547792; --accent-strong: #40617a; --mist: #94b4c1;
        --on-ink: #ecefca;
        --border: rgba(148, 180, 193, .55); --border-soft: rgba(148, 180, 193, .32);
        --grid: rgba(33, 52, 72, .055);
        --success: #2e6b46; --warning: #8a6a1f; --danger: #a03434;
        --success-bg: #e3efe6; --warning-bg: #f5ecd6; --danger-bg: #f6e1e1;
        --shadow: 0 1px 2px rgba(33, 52, 72, .06), 0 8px 24px -18px rgba(33, 52, 72, .35);
        --r: 12px; --r-sm: 9px; --r-lg: 16px;
        --font: 'Space Grotesk', 'IBM Plex Sans Arabic', system-ui, sans-serif;
        --font-ar: 'IBM Plex Sans Arabic', 'Space Grotesk', system-ui, sans-serif;
        --mono: 'IBM Plex Mono', ui-monospace, monospace;
        color-scheme: light;
    }
    @media (prefers-color-scheme: dark) {
        :root:not([data-theme="light"]) {
            --bg: #101a26; --bg-soft: #142030; --card: #1a2a3c;
            --ink: #ecefca; --ink-2: #c9d6c4; --muted: #94b4c1;
            --accent: #94b4c1; --accent-strong: #b7cfd8; --mist: #547792;
            --on-ink: #213448;
            --border: rgba(148, 180, 193, .28); --border-soft: rgba(148, 180, 193, .16);
            --grid: rgba(148, 180, 193, .06);
            --success: #7fc49a; --warning: #e0b96a; --danger: #e08a8a;
            --success-bg: rgba(127, 196, 154, .14); --warning-bg: rgba(224, 185, 106, .14); --danger-bg: rgba(224, 138, 138, .14);
            --shadow: 0 1px 2px rgba(0, 0, 0, .4), 0 8px 24px -18px rgba(0, 0, 0, .6);
            color-scheme: dark;
        }
    }
    :root[data-theme="dark"] {
        --bg: #101a26; --bg-soft: #142030; --card: #1a2a3c;
        --ink: #ecefca; --ink-2: #c9d6c4; --muted: #94b4c1;
        --accent: #94b4c1; --accent-strong: #b7cfd8; --mist: #547792;
        --on-ink: #213448;
        --border: rgba(148, 180, 193, .28); --border-soft: rgba(148, 180, 193, .16);
        --grid: rgba(148, 180, 193, .06);
        --success: #7fc49a; --warning: #e0b96a; --danger: #e08a8a;
        --success-bg: rgba(127, 196, 154, .14); --warning-bg: rgba(224, 185, 106, .14); --danger-bg: rgba(224, 138, 138, .14);
        --shadow: 0 1px 2px rgba(0, 0, 0, .4), 0 8px 24px -18px rgba(0, 0, 0, .6);
        color-scheme: dark;
    }

    *, *::before, *::after { box-sizing: border-box; }
    html { -webkit-text-size-adjust: 100%; }
    body {
        margin: 0; min-height: 100vh; background: var(--bg-soft); color: var(--ink);
        font-family: var(--font); font-size: 16px; line-height: 1.6;
        background-image: linear-gradient(var(--grid) 1px, transparent 1px), linear-gradient(90deg, var(--grid) 1px, transparent 1px);
        background-size: 32px 32px;
    }
    html[dir="rtl"] body { font-family: var(--font-ar); }
    h1, h2, h3, h4 { line-height: 1.25; margin: 0 0 .5rem; color: var(--ink); letter-spacing: -.01em; }
    html[dir="rtl"] h1, html[dir="rtl"] h2, html[dir="rtl"] h3 { letter-spacing: 0; }
    p { margin: 0 0 1rem; }
    a { color: var(--accent-strong); }
    img, svg { max-width: 100%; }
    :focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

    .m-wrap { width: min(1160px, 100% - 32px); margin-inline: auto; }
    .m-center { display: grid; place-items: center; padding: 24px 16px; }
    .m-narrow { width: min(520px, 100%); }
    .m-card { background: var(--card); border: 1px solid var(--border-soft); border-radius: var(--r-lg); box-shadow: var(--shadow); padding: 24px; }
    .m-muted { color: var(--muted); }
    .m-small { font-size: .875rem; }
    .m-row { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
    .m-stack { display: flex; flex-direction: column; gap: 12px; }
    .m-eyebrow { font-family: var(--mono); font-size: .72rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--accent); margin: 0 0 .5rem; }
    html[dir="rtl"] .m-eyebrow { letter-spacing: 0; font-family: var(--font-ar); font-size: .78rem; }

    .m-btn {
        display: inline-flex; align-items: center; justify-content: center; gap: 8px;
        min-height: 44px; padding: 10px 18px; border-radius: var(--r-sm); border: 1px solid var(--ink);
        background: var(--ink); color: var(--on-ink); font: inherit; font-weight: 600; text-decoration: none; cursor: pointer;
        transition: background .15s, transform .15s;
    }
    .m-btn:hover { background: var(--accent-strong); border-color: var(--accent-strong); }
    .m-btn:active { transform: translateY(1px); }
    .m-btn[disabled] { opacity: .55; cursor: not-allowed; }
    .m-btn--ghost { background: transparent; color: var(--ink); border-color: var(--border); }
    .m-btn--ghost:hover { background: var(--bg); color: var(--ink); border-color: var(--accent); }
    .m-btn--block { width: 100%; }

    .m-input, .m-select, .m-textarea {
        width: 100%; min-height: 44px; padding: 10px 12px; border-radius: var(--r-sm); border: 1px solid var(--border);
        background: var(--card); color: var(--ink); font: inherit;
    }
    .m-textarea { min-height: 110px; resize: vertical; }
    .m-label { display: block; font-weight: 600; font-size: .9rem; margin-bottom: 6px; }
    .m-field { margin-bottom: 16px; }
    .m-error { color: var(--danger); font-size: .85rem; margin-top: 4px; }

    .m-badge { display: inline-flex; align-items: center; gap: 6px; padding: 2px 10px; border-radius: 999px; font-size: .78rem; font-weight: 600; background: var(--bg); color: var(--ink-2); }
    .m-badge--success { background: var(--success-bg); color: var(--success); }
    .m-badge--warning { background: var(--warning-bg); color: var(--warning); }
    .m-badge--danger { background: var(--danger-bg); color: var(--danger); }
    .m-alert { padding: 12px 16px; border-radius: var(--r); border: 1px solid var(--border-soft); background: var(--bg); }
    .m-alert--danger { background: var(--danger-bg); color: var(--danger); border-color: transparent; }
    .m-alert--success { background: var(--success-bg); color: var(--success); border-color: transparent; }

    .m-mark { display: inline-grid; place-items: center; width: 40px; height: 40px; border-radius: 10px; background: var(--ink); color: var(--on-ink); flex-shrink: 0; }
    .m-mark svg { width: 26px; height: 26px; }
    .m-wordmark { font-family: var(--mono); font-weight: 600; letter-spacing: .01em; }
    .m-wordmark span { color: var(--accent); }

    @media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; } }
/* ---------- Nav ---------- */
    .s-skip { position: absolute; inset-inline-start: 8px; top: -60px; z-index: 50; padding: 8px 14px; background: var(--ink); color: var(--on-ink); border-radius: var(--r-sm); }
    .s-skip:focus { top: 8px; }
    .s-nav { position: sticky; top: 0; z-index: 30; background: color-mix(in oklab, var(--bg-soft) 90%, transparent); backdrop-filter: blur(10px); border-bottom: 1px solid var(--border-soft); }
    .s-nav__in { display: flex; align-items: center; gap: 24px; min-height: 68px; }
    .s-logo { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; color: var(--ink); }
    .s-logo .m-mark { width: 34px; height: 34px; border-radius: 9px; }
    .s-logo .m-mark svg { width: 22px; height: 22px; }
    .s-logo__text { font-size: 1.02rem; }
    .s-nav__links { display: none; gap: 22px; }
    .s-nav__links a, .s-nav__login { color: var(--ink-2); text-decoration: none; font-weight: 500; }
    .s-nav__links a:hover, .s-nav__login:hover, .s-nav__links a[aria-current="page"] { color: var(--ink); text-decoration: underline; text-underline-offset: 6px; text-decoration-thickness: 1.5px; }
    .s-nav__tools { display: flex; align-items: center; gap: 8px; margin-inline-start: auto; }
    .s-tool { display: inline-grid; place-items: center; min-width: 40px; height: 40px; padding: 0 8px; border-radius: var(--r-sm); border: 1px solid var(--border-soft); background: transparent; color: var(--ink); font: inherit; font-weight: 600; text-decoration: none; cursor: pointer; }
    .s-tool:hover { border-color: var(--accent); }
    .s-ico { width: 18px; height: 18px; }
    .s-ico--moon { display: none; }
    :root[data-theme="dark"] .s-ico--sun { display: none; }
    :root[data-theme="dark"] .s-ico--moon { display: block; }
    @media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .s-ico--sun { display: none; } :root:not([data-theme="light"]) .s-ico--moon { display: block; } }
    .s-nav__btn { min-height: 40px; padding: 8px 14px; white-space: nowrap; }
    .s-nav__login { display: none; }
    @media (min-width: 960px) { .s-nav__links, .s-nav__login { display: flex; } }
    @media (max-width: 480px) { .s-logo__text { display: none; } .s-nav__in { gap: 12px; } }

    /* ---------- Type & sections ---------- */
    .s-section { padding: 80px 0; }
    .s-section--tight { padding: 48px 0; }
    .s-section--paper { background: var(--bg); border-block: 1px solid var(--border-soft); }
    .s-section__head { max-width: 700px; margin-bottom: 36px; }
    .s-h1 { font-size: clamp(2.1rem, 5.2vw, 3.7rem); font-weight: 700; letter-spacing: -.025em; line-height: 1.08; text-wrap: balance; }
    html[dir="rtl"] .s-h1 { letter-spacing: 0; line-height: 1.3; }
    .s-h2 { font-size: clamp(1.55rem, 3.1vw, 2.3rem); font-weight: 700; text-wrap: balance; }
    .s-h3 { font-size: 1.08rem; font-weight: 700; margin: 0 0 6px; }
    .s-lead { font-size: clamp(1.04rem, 1.6vw, 1.2rem); color: var(--ink-2); max-width: 620px; text-wrap: pretty; }
    .s-rule { height: 1px; background: var(--border-soft); border: 0; margin: 0; }
    .s-num { font-family: var(--mono); font-variant-numeric: tabular-nums; direction: ltr; unicode-bidi: isolate; }
    .s-link { font-weight: 600; color: var(--ink); text-underline-offset: 5px; }
    .s-link:hover { color: var(--accent-strong); }

    /* ---------- Hero ---------- */
    .s-hero { padding: 56px 0 80px; }
    .s-hero__grid { display: grid; gap: 44px; align-items: center; }
    @media (min-width: 980px) { .s-hero__grid { grid-template-columns: 1.15fr .85fr; gap: 64px; } }
    .s-hero__cta { margin-top: 28px; }
    .s-hero__note { margin-top: 16px; font-size: .92rem; color: var(--muted); display: flex; align-items: center; gap: 8px; }
    .s-hero__note::before { content: ""; width: 12px; height: 7px; border-left: 2px solid var(--success); border-bottom: 2px solid var(--success); transform: rotate(-45deg) translateY(-2px); flex: none; }
    .s-caption { margin-top: 12px; font-size: .84rem; color: var(--muted); }

    /* ---------- Signature: the build slip ---------- */
    .slip {
        --tear: 10px;
        position: relative; background: var(--card); color: var(--ink);
        font-family: var(--mono); font-size: .86rem; line-height: 1.55;
        padding: 26px 24px calc(22px + var(--tear));
        border: 1px solid var(--border-soft); border-bottom: 0;
        border-radius: var(--r) var(--r) 0 0; box-shadow: var(--shadow);
        /* Perforated tear edge */
        -webkit-mask: linear-gradient(#000 0 0) top / 100% calc(100% - var(--tear)) no-repeat,
                      radial-gradient(circle at 50% 100%, transparent 6px, #000 6.5px) bottom / 16px var(--tear) repeat-x;
                mask: linear-gradient(#000 0 0) top / 100% calc(100% - var(--tear)) no-repeat,
                      radial-gradient(circle at 50% 100%, transparent 6px, #000 6.5px) bottom / 16px var(--tear) repeat-x;
    }
    .slip__head { display: flex; justify-content: space-between; gap: 12px; padding-bottom: 12px; margin-bottom: 12px; border-bottom: 1px dashed var(--border); }
    .slip__title { font-weight: 600; letter-spacing: .04em; }
    .slip__meta { color: var(--muted); font-size: .76rem; text-align: end; }
    .slip__line { display: flex; align-items: baseline; gap: 8px; padding: 3px 0; }
    .slip__line > span:first-child { font-family: var(--font-ar); font-size: .9rem; }
    html[dir="ltr"] .slip__line > span:first-child { font-family: var(--font); }
    .slip__lead { flex: 1; min-width: 16px; border-bottom: 1px dotted var(--mist); transform: translateY(-4px); }
    .slip__amt { white-space: nowrap; font-variant-numeric: tabular-nums; direction: ltr; unicode-bidi: isolate; }
    .slip__line--muted { color: var(--muted); }
    .slip__line--minus .slip__amt { color: var(--success); }
    .slip__sep { border-top: 1px dashed var(--border); margin: 12px 0; }
    .slip__total { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
    .slip__total strong { font-size: 1.7rem; font-weight: 600; font-variant-numeric: tabular-nums; direction: ltr; unicode-bidi: isolate; }
    .slip__sub { color: var(--muted); font-size: .78rem; margin-top: 4px; }
    .slip__empty { color: var(--muted); padding: 18px 0; text-align: center; font-family: var(--font-ar); }
    .slip__line.is-new { animation: slip-in .35s ease-out; }
    @keyframes slip-in { from { opacity: 0; transform: translateY(-4px); } }
    .slip-explain { margin: 14px 0 0; padding: 14px 16px; border-radius: var(--r-sm); background: var(--bg); border: 1px solid var(--border-soft); font-size: .95rem; color: var(--ink-2); }
    .slip-explain p { margin: 0; }
    .slip-explain p + p { margin-top: 4px; color: var(--ink); font-weight: 600; }
    .slip-explain:empty { display: none; }

    /* ---------- Gains (what changes) ---------- */
    .s-gains { display: grid; gap: 0; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); border-top: 2px solid var(--ink); }
    .s-gain { padding: 22px 0 26px; border-bottom: 1px solid var(--border-soft); }
    @media (min-width: 700px) { .s-gain { padding-inline-end: 28px; } }
    .s-gain p { margin: 0; color: var(--ink-2); }

    /* ---------- Steps (a real sequence) ---------- */
    .s-steps3 { list-style: none; margin: 0; padding: 0; display: grid; gap: 16px; counter-reset: step; }
    @media (min-width: 860px) { .s-steps3 { grid-template-columns: repeat(3, 1fr); gap: 0; } }
    .s-step { position: relative; padding: 22px 24px 24px; background: var(--card); border: 1px solid var(--border-soft); border-radius: var(--r-lg); }
    @media (min-width: 860px) {
        .s-step { border-radius: 0; border-inline-start-width: 0; }
        .s-step:first-child { border-inline-start-width: 1px; border-start-start-radius: var(--r-lg); border-end-start-radius: var(--r-lg); }
        .s-step:last-child { border-start-end-radius: var(--r-lg); border-end-end-radius: var(--r-lg); }
        .s-step + .s-step { border-inline-start: 1px dashed var(--border); }
    }
    .s-step__n { display: inline-grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: var(--ink); color: var(--on-ink); font-family: var(--mono); font-weight: 600; margin-bottom: 14px; }
    .s-step p { margin: 0; color: var(--ink-2); }

    /* ---------- Packs ---------- */
    .s-packs { display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr)); }
    .s-pack { display: flex; flex-direction: column; gap: 8px; padding: 20px; text-decoration: none; color: inherit; background: var(--card); border: 1px solid var(--border-soft); border-radius: var(--r-lg); transition: border-color .15s, transform .15s; }
    .s-pack:hover, .s-pack:focus-visible { border-color: var(--ink); }
    .s-pack strong { font-size: 1.05rem; }
    .s-pack__price { font-size: .9rem; color: var(--ink-2); }
    .s-pack__price b { font-size: 1.05rem; font-weight: 600; color: var(--ink); }
    .s-pack__inc { font-size: .88rem; color: var(--muted); }
    .s-pack__go { margin-top: auto; padding-top: 6px; font-weight: 600; font-size: .9rem; }

    /* ---------- Catalogue (sector index) ---------- */
    .s-cat { display: grid; gap: 0; border-top: 1px solid var(--border); }
    @media (min-width: 900px) { .s-cat { grid-template-columns: repeat(2, 1fr); column-gap: 48px; } }
    .s-cat__sector { padding: 22px 0; border-bottom: 1px solid var(--border-soft); }
    .s-cat__head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin-bottom: 10px; }
    .s-cat__head h3 { font-size: 1.1rem; margin: 0; }
    .s-cat__count { font-family: var(--mono); font-size: .78rem; color: var(--muted); }
    .s-cat__list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
    .s-cat__list a { display: inline-flex; align-items: center; min-height: 36px; padding: 6px 12px; border-radius: 999px; border: 1px solid var(--border-soft); background: var(--card); color: var(--ink); text-decoration: none; font-size: .92rem; }
    .s-cat__list a:hover { border-color: var(--accent); background: var(--bg); }

    /* ---------- Core: spec sheet of what every subscription includes ---------- */
    .s-core { border-top: 2px solid var(--ink); }
    .s-core__group { display: grid; gap: 8px 32px; padding: 26px 0; border-bottom: 1px solid var(--border-soft); }
    @media (min-width: 900px) { .s-core__group { grid-template-columns: 220px 1fr; } }
    .s-core__group > h3 { font-size: .8rem; font-family: var(--mono); font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--accent); margin: 4px 0 0; }
    html[dir="rtl"] .s-core__group > h3 { font-family: var(--font-ar); font-size: .92rem; letter-spacing: 0; }
    .s-core__items { display: grid; gap: 18px 32px; margin: 0; padding: 0; list-style: none; }
    @media (min-width: 640px) { .s-core__items { grid-template-columns: repeat(2, 1fr); } }
    .s-core__items strong { display: block; margin-bottom: 2px; }
    .s-core__items span { color: var(--ink-2); font-size: .95rem; }
    .s-core--compact .s-core__group { padding: 18px 0; }

    /* ---------- Honest proof ---------- */
    .s-proof { display: grid; gap: 16px; }
    @media (min-width: 860px) { .s-proof { grid-template-columns: repeat(3, 1fr); } }
    .s-proof__item p { margin: 0; color: var(--ink-2); }
    .s-early { margin-top: 24px; border-inline-start: 4px solid var(--accent); }
    .s-early p { color: var(--ink-2); }
    .s-shots { display: grid; gap: 16px; margin-top: 14px; }
    @media (min-width: 860px) { .s-shots { grid-template-columns: repeat(3, 1fr); } }
    .s-shots figure { margin: 0; }
    .s-shots img { width: 100%; height: auto; border: 1px solid var(--border); border-radius: var(--r-lg); }
    .s-shots figcaption { margin-top: 6px; color: var(--muted); font-size: .9rem; }
    .s-price-tag small { color: var(--muted); font-size: .9rem; }

    /* Sign-up step one: business type cards */
    .s-types { display: grid; gap: 10px; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
    .s-type { position: relative; display: flex; flex-direction: column; gap: 4px; min-height: 76px; padding: 12px 14px; border: 1.5px solid var(--border-soft); border-radius: var(--r); background: var(--card); cursor: pointer; }
    .s-type:hover { border-color: var(--mist); }
    .s-type input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
    .s-type strong { font-size: .95rem; }
    .s-type span { color: var(--muted); font-size: .8rem; line-height: 1.4; }
    .s-type:has(input:checked) { border-color: var(--ink); box-shadow: inset 0 0 0 1px var(--ink); }
    .s-type:has(input:focus-visible) { outline: 2px solid var(--accent); outline-offset: 2px; }
    .s-type--other { border-style: dashed; }
    .s-suggested { margin: 0 0 10px; padding: 10px 14px; border-radius: var(--r-sm); background: var(--paper, var(--card)); font-size: .92rem; }
    .s-all-systems > summary { cursor: pointer; font-weight: 600; min-height: 44px; display: flex; align-items: center; color: var(--accent); }
    .s-all-systems[open] > summary { margin-bottom: 8px; }

    /* ---------- FAQ ---------- */
    .s-faq { border-top: 2px solid var(--ink); max-width: 860px; }
    .s-faq details { border-bottom: 1px solid var(--border-soft); }
    .s-faq summary { list-style: none; display: flex; justify-content: space-between; gap: 16px; padding: 18px 0; cursor: pointer; font-weight: 600; font-size: 1.04rem; }
    .s-faq summary::-webkit-details-marker { display: none; }
    .s-faq summary::after { content: '+'; font-family: var(--mono); color: var(--accent); font-size: 1.2rem; line-height: 1; }
    .s-faq details[open] summary::after { content: '−'; }
    .s-faq summary:focus-visible { outline-offset: 4px; }
    .s-faq details p { margin: 0 0 20px; color: var(--ink-2); max-width: 720px; }

    /* ---------- CTA band ---------- */
    .s-band { background: var(--ink); color: var(--on-ink); border-radius: 20px; padding: 40px 28px; display: grid; gap: 20px; }
    .s-band h2 { color: var(--on-ink); }
    .s-band p { color: color-mix(in oklab, var(--on-ink) 78%, transparent); margin: 0; }
    .s-band .m-btn { background: var(--on-ink); color: var(--ink); border-color: var(--on-ink); }
    .s-band .m-btn:hover { background: var(--mist); border-color: var(--mist); }
    .s-band .m-btn--ghost { background: transparent; color: var(--on-ink); border-color: color-mix(in oklab, var(--on-ink) 45%, transparent); }
    .s-band .m-btn--ghost:hover { background: color-mix(in oklab, var(--on-ink) 12%, transparent); color: var(--on-ink); }
    .s-band :focus-visible { outline-color: var(--on-ink); }
    @media (min-width: 860px) { .s-band { grid-template-columns: 1fr auto; align-items: center; padding: 48px; } }

    /* ---------- Pricing tables ---------- */
    .s-price-grid { display: grid; gap: 28px; }
    @media (min-width: 1000px) { .s-price-grid { grid-template-columns: 1fr 340px; align-items: start; } }
    .s-table { width: 100%; border-collapse: collapse; border-top: 2px solid var(--ink); }
    .s-table th, .s-table td { text-align: start; vertical-align: top; padding: 16px 12px 16px 0; border-bottom: 1px solid var(--border-soft); }
    html[dir="rtl"] .s-table th, html[dir="rtl"] .s-table td { padding: 16px 0 16px 12px; }
    .s-table thead th { font-family: var(--mono); font-size: .72rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); padding-block: 10px; }
    html[dir="rtl"] .s-table thead th { font-family: var(--font-ar); font-size: .84rem; letter-spacing: 0; }
    .s-table__price { white-space: nowrap; }
    .s-table__price b { font-family: var(--mono); font-size: 1.35rem; font-weight: 600; direction: ltr; unicode-bidi: isolate; }
    .s-table__price small { display: block; color: var(--muted); font-size: .8rem; }
    .s-table td.s-table__ex { color: var(--ink-2); font-size: .93rem; }
    .s-table__ex a { color: inherit; }
    @media (max-width: 640px) {
        .s-table thead { display: none; }
        .s-table, .s-table tbody, .s-table tr, .s-table th, .s-table td { display: block; width: 100%; }
        .s-table tr { padding: 14px 0; border-bottom: 1px solid var(--border-soft); }
        .s-table th, .s-table td, html[dir="rtl"] .s-table th, html[dir="rtl"] .s-table td { border: 0; padding: 2px 0; }
        .s-table__price b { font-size: 1.15rem; }
    }
    .s-incl { list-style: none; margin: 0; padding: 0; }
    .s-incl li { padding: 10px 0; border-bottom: 1px dashed var(--border); display: flex; gap: 10px; }
    .s-incl li:last-child { border-bottom: 0; }
    .s-incl li::before { content: ""; width: 7px; height: 7px; margin-top: .62em; border-radius: 50%; background: var(--accent); flex: none; }
    .s-own { display: grid; gap: 14px; }
    @media (min-width: 860px) { .s-own { grid-template-columns: repeat(3, 1fr); } }
    .s-own article { padding: 20px; border: 1px solid var(--border-soft); border-radius: var(--r-lg); background: var(--card); display: flex; flex-direction: column; gap: 8px; }
    .s-own ul { margin: 0; padding-inline-start: 18px; color: var(--ink-2); font-size: .93rem; }
    .s-own__price { margin-top: auto; font-size: .86rem; font-weight: 600; color: var(--accent-strong); }

    /* ---------- System page ---------- */
    .s-sys-grid { display: grid; gap: 40px; }
    @media (min-width: 980px) { .s-sys-grid { grid-template-columns: 1fr 1fr; gap: 56px; } }
    .s-list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--border); }
    .s-list li { padding: 12px 0; border-bottom: 1px solid var(--border-soft); color: var(--ink-2); }
    .s-list--pains li { color: var(--ink); }
    .s-list--pains li::before { content: "—"; color: var(--muted); margin-inline-end: 10px; }
    .s-list--gains li { display: flex; gap: 12px; color: var(--ink); }
    .s-list--gains li::before { content: ""; width: 12px; height: 7px; margin-top: .55em; border-left: 2px solid var(--success); border-bottom: 2px solid var(--success); transform: rotate(-45deg); flex: none; }
    .s-feats { display: grid; gap: 0 32px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); border-top: 2px solid var(--ink); }
    .s-feat { padding: 18px 0; border-bottom: 1px solid var(--border-soft); }
    .s-feat p { margin: 0; color: var(--ink-2); font-size: .95rem; }
    .s-chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
    .s-chips a, .s-chips span { display: inline-flex; align-items: center; gap: 6px; min-height: 36px; padding: 6px 12px; border-radius: 999px; border: 1px solid var(--border-soft); background: var(--card); color: var(--ink); text-decoration: none; font-size: .92rem; }
    .s-chips a:hover { border-color: var(--accent); }
    .s-price-tag { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 12px; margin-top: 18px; }
    .s-price-tag b { font-family: var(--mono); font-size: 1.5rem; font-weight: 600; }
    .s-price-tag span { color: var(--muted); font-size: .9rem; }

    /* ---------- Configurator ---------- */
    .cfg { display: grid; gap: 28px; padding: 32px 0 120px; }
    @media (min-width: 1040px) { .cfg { grid-template-columns: 1fr 380px; align-items: start; padding-bottom: 72px; } }
    .cfg--inline { padding-top: 0; }
    .cfg__step { margin-bottom: 36px; }
    .cfg__label { display: flex; align-items: baseline; gap: 12px; margin-bottom: 14px; }
    .cfg__num { font-family: var(--mono); font-size: .8rem; color: var(--accent); font-weight: 600; }
    .cfg__label h2, .cfg__label h3 { font-size: 1.25rem; margin: 0; }
    .cfg__options { display: grid; gap: 12px; }
    @media (min-width: 640px) { .cfg__options--2 { grid-template-columns: repeat(2, 1fr); } }
    .opt { position: relative; display: block; cursor: pointer; }
    .opt input { position: absolute; opacity: 0; pointer-events: none; }
    .opt__box { display: flex; flex-direction: column; gap: 4px; height: 100%; padding: 16px; border-radius: var(--r); border: 1.5px solid var(--border-soft); background: var(--card); transition: border-color .15s, background .15s; }
    .opt__box strong { font-size: 1rem; }
    .opt__box span { font-size: .88rem; color: var(--muted); }
    .opt:hover .opt__box { border-color: var(--mist); }
    .opt input:checked + .opt__box { border-color: var(--ink); background: var(--bg); box-shadow: inset 0 0 0 1px var(--ink); }
    .opt input:focus-visible + .opt__box { outline: 2px solid var(--accent); outline-offset: 2px; }
    .cfg__sector { border: 1px solid var(--border-soft); border-radius: var(--r); background: var(--card); margin-bottom: 10px; }
    .cfg__sector summary { list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 16px; cursor: pointer; font-weight: 600; min-height: 48px; }
    .cfg__sector summary::-webkit-details-marker { display: none; }
    .cfg__sector summary::after { content: '+'; font-family: var(--mono); color: var(--accent); }
    .cfg__sector[open] summary::after { content: '−'; }
    .cfg__picked { font-family: var(--mono); font-size: .76rem; color: var(--accent); margin-inline-start: auto; }
    .cfg__systems { display: grid; gap: 8px; padding: 0 16px 16px; }
    @media (min-width: 640px) { .cfg__systems { grid-template-columns: repeat(2, 1fr); } }
    .chk { display: flex; align-items: center; gap: 10px; min-height: 48px; padding: 8px 12px; border-radius: var(--r-sm); border: 1px solid var(--border-soft); cursor: pointer; }
    .chk:hover { border-color: var(--mist); }
    .chk input { width: 18px; height: 18px; accent-color: var(--ink); flex-shrink: 0; }
    .chk__name { flex: 1; font-size: .93rem; }
    .chk__price { font-family: var(--mono); font-size: .76rem; color: var(--muted); direction: ltr; white-space: nowrap; }
    .chk:has(input:checked) { border-color: var(--ink); background: var(--bg); }
    .chk:has(input:focus-visible) { outline: 2px solid var(--accent); outline-offset: 2px; }
    .seg { display: flex; flex-wrap: wrap; gap: 8px; }
    .seg label { cursor: pointer; position: relative; }
    .seg input { position: absolute; opacity: 0; }
    .seg span { display: inline-flex; flex-direction: column; align-items: center; min-width: 78px; padding: 8px 12px; border-radius: var(--r-sm); border: 1.5px solid var(--border-soft); background: var(--card); font-weight: 600; }
    .seg small { font-family: var(--mono); font-weight: 500; font-size: .7rem; color: var(--success); }
    .seg input:checked + span { border-color: var(--ink); background: var(--ink); color: var(--on-ink); }
    .seg input:checked + span small { color: var(--mist); }
    .seg input:focus-visible + span { outline: 2px solid var(--accent); outline-offset: 2px; }
    .num { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; max-width: 520px; }
    @media (max-width: 420px) { .num { grid-template-columns: 1fr; } }
    .cfg__aside { position: sticky; top: 88px; }
    .cfg__aside .m-btn { margin-top: 16px; }
    .cfg__fine { font-size: .8rem; color: var(--muted); margin-top: 12px; }

    /* Mobile: the slip total becomes a bottom bar */
    .cfg__bar { display: none; }
    @media (max-width: 1039px) {
        .cfg__aside { position: static; }
        .cfg__bar { display: flex; position: fixed; inset-inline: 0; bottom: 0; z-index: 25; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 16px calc(12px + env(safe-area-inset-bottom)); background: var(--card); border-top: 1px solid var(--border); box-shadow: 0 -8px 24px -18px rgba(0,0,0,.4); }
        .cfg__bar strong { font-family: var(--mono); font-size: 1.15rem; direction: ltr; unicode-bidi: isolate; }
        .cfg__bar[data-scoped]:not(.is-on) { display: none; }
    }

    /* ---------- Forms page ---------- */
    .s-form-grid { display: grid; gap: 28px; padding: 40px 0 72px; }
    @media (min-width: 980px) { .s-form-grid { grid-template-columns: 1fr 360px; align-items: start; } }
    .s-fieldset { border: 0; padding: 0; margin: 0 0 8px; }
    .s-fieldset > legend { font-family: var(--mono); font-size: .74rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--accent); padding: 0; margin-bottom: 12px; }
    html[dir="rtl"] .s-fieldset > legend { font-family: var(--font-ar); font-size: .86rem; letter-spacing: 0; }
    .s-two { display: grid; gap: 0 16px; }
    @media (min-width: 640px) { .s-two { grid-template-columns: 1fr 1fr; } }
    .s-check { display: flex; gap: 10px; align-items: flex-start; font-size: .92rem; }
    .s-check input { width: 18px; height: 18px; margin-top: 3px; accent-color: var(--ink); flex: none; }
    .s-hp { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
    .s-steps { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
    .s-steps li { display: grid; grid-template-columns: 28px 1fr; gap: 10px; }
    .s-steps b { font-family: var(--mono); color: var(--accent); }
    .s-kv { display: grid; grid-template-columns: auto 1fr; gap: 6px 16px; margin: 0; }
    .s-kv dt { color: var(--muted); }
    .s-kv dd { margin: 0; font-weight: 600; word-break: break-word; }
    .s-aside-block + .s-aside-block { margin-top: 22px; padding-top: 22px; border-top: 1px dashed var(--border); }

    /* ---------- Legal ---------- */
    .s-draft { background: var(--warning-bg); color: var(--warning); border-bottom: 1px solid currentColor; font-size: .86rem; padding: 10px 0; }
    .s-legal-grid { display: grid; gap: 32px; padding: 40px 0 72px; }
    @media (min-width: 980px) { .s-legal-grid { grid-template-columns: 240px minmax(0, 760px); gap: 56px; } }
    .s-legal-nav { font-size: .92rem; }
    @media (min-width: 980px) { .s-legal-nav { position: sticky; top: 92px; align-self: start; } }
    .s-legal-nav h2 { font-family: var(--mono); font-size: .72rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--accent); margin: 18px 0 6px; }
    html[dir="rtl"] .s-legal-nav h2 { font-family: var(--font-ar); font-size: .84rem; letter-spacing: 0; }
    .s-legal-nav ul { list-style: none; margin: 0; padding: 0; }
    .s-legal-nav a { display: block; padding: 6px 10px; margin-inline-start: -10px; border-radius: var(--r-sm); color: var(--ink-2); text-decoration: none; }
    .s-legal-nav a:hover { background: var(--bg); color: var(--ink); }
    .s-legal-nav a[aria-current="page"] { background: var(--ink); color: var(--on-ink); }
    @media (max-width: 979px) { .s-legal-nav { order: 2; border-top: 1px solid var(--border); padding-top: 8px; } }
    .s-legal__title { font-size: clamp(1.9rem, 4vw, 2.7rem); margin-bottom: 8px; }
    .s-legal__toc { margin: 24px 0 0; padding: 16px 20px; border: 1px solid var(--border-soft); border-radius: var(--r); background: var(--card); }
    .s-legal__toc ol { margin: 6px 0 0; padding-inline-start: 22px; columns: 2 220px; column-gap: 28px; font-size: .92rem; }
    .s-legal__toc a { color: var(--ink-2); }
    .s-legal__body { margin-top: 28px; border-top: 2px solid var(--ink); }
    .s-legal__item { padding: 22px 0; border-bottom: 1px solid var(--border-soft); scroll-margin-top: 90px; }
    .s-legal__item h2 { font-size: 1.08rem; margin: 0 0 8px; }
    .s-legal__item p, .s-legal__item li { margin: 0; color: var(--ink-2); line-height: 1.85; }
    .s-legal__item ul { margin: 0; padding-inline-start: 20px; }
    .s-legal__item li + li { margin-top: 6px; }
    .s-placeholder { background: var(--warning-bg); color: var(--warning); padding: 0 4px; border-radius: 4px; font-family: var(--mono); font-size: .86em; }

    /* ---------- Footer ---------- */
    .s-foot { margin-top: 40px; padding: 48px 0 32px; border-top: 1px solid var(--border); background: var(--bg-soft); }
    .s-foot__in { display: grid; gap: 32px; }
    @media (min-width: 860px) { .s-foot__in { grid-template-columns: 1.3fr repeat(3, 1fr); } }
    .s-foot__brand p { margin-top: 8px; max-width: 300px; }
    .s-foot__col h2 { font-family: var(--mono); font-size: .72rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--accent); margin: 0 0 10px; }
    html[dir="rtl"] .s-foot__col h2 { font-family: var(--font-ar); font-size: .84rem; letter-spacing: 0; }
    .s-foot__col ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
    .s-foot__col a { display: inline-block; padding: 4px 0; color: var(--ink-2); text-decoration: none; font-size: .93rem; }
    .s-foot__col a:hover { color: var(--ink); text-decoration: underline; text-underline-offset: 4px; }
    .s-foot__copy { grid-column: 1 / -1; margin: 0; padding-top: 20px; border-top: 1px solid var(--border-soft); }

    /* ---------- Available now ---------- */
    .s-live-legend { display: inline-flex; align-items: center; gap: 8px; margin: 10px 0 0; font-size: .86rem; color: var(--muted); }
    .s-live-dot { width: 8px; height: 8px; border-radius: 50%; background: #2f8f5b; box-shadow: 0 0 0 3px rgba(47, 143, 91, .18); flex: none; }
    .s-live-dot--soon { background: var(--muted); box-shadow: 0 0 0 3px rgba(148, 180, 193, .25); }
    .s-cat__list a.is-live::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #2f8f5b; margin-inline-end: 8px; flex: none; }
    .s-cat__list a.is-live { border-color: rgba(47, 143, 91, .45); }
    .s-live-tag { display: inline-block; margin-inline-start: 6px; padding: 1px 7px; border-radius: 999px; font-size: .7rem; font-weight: 600; color: #2f8f5b; background: rgba(47, 143, 91, .12); vertical-align: middle; }