/* ══════════════════════════════════════════════════════════════════════
   vf-centers.css — v4.205.0 (update 205)
   ─────────────────────────────────────────────────────────────────────
   1) .vf-lang-note      — rectangle note: "page not available in your
                           language" (shown in English fallback)
   2) .vf-center-*       — Resource Center / Policy Center pages: wrap,
                           header, horizontal swipeable tabs, panel, empty
   3) .vf-guest-intro    — desktop guest sidebar: logo, home title,
                           "for the reader" / "for publishers" cards
   4) .vf-profit-*       — Profit Program page: hero, steps, revenue split,
                           interactive calculator, payout methods, notes
   5) .vf-doc-*          — policy document pages (About / Terms / Privacy /
                           Community Standards) + v4.205 additions:
                           .vf-doc-grid--ok  green ✓ allowed-uses grid
                           .vf-doc-reasons   live report-reasons list
                           .vf-brand-dl      brand page logo downloads
   ══════════════════════════════════════════════════════════════════════ */

/* ── 1) language note ─────────────────────────────────────────────── */
.vf-lang-note {
    display: flex;
    align-items: center;
    gap: 10px;
    max-width: 860px;
    margin: 0 auto 18px;
    padding: 12px 16px;
    border-radius: 12px;
    border: 1px solid rgba(217, 119, 6, .28);
    background: rgba(245, 158, 11, .10);
    color: #92400e;
    font-size: 13.5px;
    font-weight: 600;
    line-height: 1.55;
}
.vf-lang-note svg { flex-shrink: 0; color: #d97706; }
[data-bs-theme="dark"] .vf-lang-note,
.dark .vf-lang-note {
    border-color: rgba(251, 191, 36, .25);
    background: rgba(251, 191, 36, .08);
    color: #fcd34d;
}
[data-bs-theme="dark"] .vf-lang-note svg,
.dark .vf-lang-note svg { color: #fbbf24; }

/* ── 2) center pages ──────────────────────────────────────────────── */
.vf-center-wrap {
    max-width: 860px;
    margin: 0 auto;
}

.vf-center-head { margin-bottom: 18px; }
.vf-center-title {
    font-size: 18px;
    font-weight: 800;
    letter-spacing: -.01em;
    margin: 0 0 6px;
    color: var(--bs-body-color, #0f172a);
}
.vf-center-desc {
    margin: 0;
    font-size: 14.5px;
    line-height: 1.7;
    color: var(--bs-secondary-color, #64748b);
}

/* tabs — horizontal, swipeable, hidden scrollbar (same behaviour as the
   site's other tab bars) */
.vf-center-tabs {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding: 4px 0 10px;
    margin-bottom: 14px;
    border-bottom: 1px solid rgba(15, 23, 42, .08);
}
.vf-center-tabs::-webkit-scrollbar { display: none; }
[data-bs-theme="dark"] .vf-center-tabs,
.dark .vf-center-tabs {
    border-bottom-color: rgba(148, 163, 184, .14);
}

.vf-center-tab {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    border-radius: 999px;
    font-size: 13.5px;
    font-weight: 700;
    line-height: 1.25;
    white-space: nowrap;
    text-decoration: none;
    color: var(--bs-secondary-color, #475569);
    background: color-mix(in srgb, var(--vf-accent, #3e4e66) 7%, transparent);
    transition: background-color .18s ease, color .18s ease;
}
.vf-center-tab:hover {
    color: var(--vf-accent, #3e4e66);
    background: color-mix(in srgb, var(--vf-accent, #3e4e66) 15%, transparent);
}
.vf-center-tab.is-active {
    color: #fff;
    background: var(--vf-accent, #3e4e66);
}
.vf-center-tab.is-active:hover {
    color: #fff;
    background: var(--vf-accent, #3e4e66);
}
[data-bs-theme="dark"] .vf-center-tab,
.dark .vf-center-tab {
    color: #cbd5e1;
    background: rgba(148, 163, 184, .12);
}
[data-bs-theme="dark"] .vf-center-tab:hover,
.dark .vf-center-tab:hover { color: #f8fafc; }
[data-bs-theme="dark"] .vf-center-tab.is-active,
.dark .vf-center-tab.is-active {
    color: #fff;
    background: var(--vf-accent, #3e4e66);
}

.vf-center-panel {
    border-radius: 16px;
    background: var(--bs-body-bg, #fff);
    border: 1px solid rgba(15, 23, 42, .08);
    padding: 22px;
}
[data-bs-theme="dark"] .vf-center-panel,
.dark .vf-center-panel {
    background: rgba(15, 23, 42, .55);
    border-color: rgba(148, 163, 184, .14);
}

.vf-center-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    padding: 48px 20px;
    text-align: center;
    color: var(--bs-secondary-color, #64748b);
    font-size: 14.5px;
    font-weight: 600;
    border-radius: 16px;
    border: 1px dashed rgba(15, 23, 42, .16);
}
[data-bs-theme="dark"] .vf-center-empty,
.dark .vf-center-empty { border-color: rgba(148, 163, 184, .22); }

/* ── 3) guest sidebar (desktop only) ──────────────────────────────── */
.vf-guest-intro {
    display: flex;
    flex-direction: column;
    gap: 14px;
}
.vf-guest-intro__logo {
    display: flex;
    justify-content: center;
    padding: 10px 0 2px;
}
/* v4.202.0 (update 202) — the FULL logo lockup can be wider than the small
   mark: keep the 40px height but never let it overflow the 250px sidebar. */
.vf-guest-intro__logo img {
    max-width: 100%;
    width: auto;
    height: 40px;
    object-fit: contain;
}
.vf-guest-intro__home-title {
    text-align: center;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.6;
    color: var(--bs-body-color, #0f172a);
    padding: 0 6px 2px;
}

.vf-guest-intro__card-title {
    display: flex;
    align-items: center;
    gap: 7px;
    font-size: 14px;
    font-weight: 800;
    margin: 0 0 8px;
    color: var(--bs-body-color, #0f172a);
}
.vf-guest-intro__card-title svg { color: var(--vf-accent, #3e4e66); flex-shrink: 0; }
.vf-guest-intro__card-desc {
    margin: 0 0 12px;
    font-size: 12.8px;
    line-height: 1.75;
    color: var(--bs-secondary-color, #64748b);
}

/* buttons — light gray border, transparent background */
.vf-guest-intro__btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 9px 12px;
    border-radius: 10px;
    border: 1px solid rgba(148, 163, 184, .45);
    background: transparent;
    color: var(--bs-body-color, #334155);
    font-size: 12.8px;
    font-weight: 700;
    line-height: 1.4;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    transition: background-color .16s ease, border-color .16s ease;
}
.vf-guest-intro__btn:hover {
    background: rgba(148, 163, 184, .14);
    border-color: rgba(148, 163, 184, .7);
    color: var(--bs-body-color, #0f172a);
}
[data-bs-theme="dark"] .vf-guest-intro__btn,
.dark .vf-guest-intro__btn {
    border-color: rgba(148, 163, 184, .35);
    color: #cbd5e1;
}
[data-bs-theme="dark"] .vf-guest-intro__btn:hover,
.dark .vf-guest-intro__btn:hover {
    background: rgba(148, 163, 184, .12);
    color: #f8fafc;
}
.vf-guest-intro__btns {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

/* ── 4) profit program ────────────────────────────────────────────── */
.vf-profit { color: var(--bs-body-color, #0f172a); }

.vf-profit-section { margin-top: 34px; }
.vf-profit-section__title {
    font-size: 18px;
    font-weight: 800;
    margin: 0 0 16px;
    letter-spacing: -.01em;
}

/* hero */
.vf-profit-hero {
    display: flex;
    align-items: center;
    gap: 26px;
    padding: 26px;
    border-radius: 20px;
    background:
        radial-gradient(120% 140% at 100% 0%,
            color-mix(in srgb, var(--vf-accent, #3e4e66) 10%, transparent) 0%,
            transparent 55%),
        var(--bs-body-bg, #fff);
    border: 1px solid rgba(15, 23, 42, .08);
}
[data-bs-theme="dark"] .vf-profit-hero,
.dark .vf-profit-hero {
    background:
        radial-gradient(120% 140% at 100% 0%,
            color-mix(in srgb, var(--vf-accent, #3e4e66) 14%, transparent) 0%,
            transparent 55%),
        rgba(15, 23, 42, .55);
    border-color: rgba(148, 163, 184, .14);
}
.vf-profit-hero__text { flex: 1 1 56%; min-width: 0; }
.vf-profit-hero__art { flex: 1 1 44%; min-width: 0; max-width: 340px; margin-inline: auto; }

.vf-profit-kicker {
    display: inline-flex;
    align-items: center;
    padding: 5px 12px;
    border-radius: 999px;
    font-size: 11.5px;
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--vf-accent, #3e4e66);
    background: color-mix(in srgb, var(--vf-accent, #3e4e66) 10%, transparent);
    margin-bottom: 12px;
}
.vf-profit-hero__title {
    font-size: 18px;
    font-weight: 800;
    letter-spacing: -.02em;
    line-height: 1.2;
    margin: 0 0 10px;
}
.vf-profit-hero__lead {
    margin: 0 0 16px;
    font-size: 15px;
    line-height: 1.8;
    color: var(--bs-secondary-color, #64748b);
}

.vf-profit-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 18px;
}
.vf-profit-chip {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 10px 14px;
    border-radius: 12px;
    background: rgba(148, 163, 184, .1);
    border: 1px solid rgba(148, 163, 184, .22);
    min-width: 120px;
}
[data-bs-theme="dark"] .vf-profit-chip,
.dark .vf-profit-chip {
    background: rgba(148, 163, 184, .08);
    border-color: rgba(148, 163, 184, .16);
}
.vf-profit-chip__num {
    font-size: 18px;
    font-weight: 800;
    color: var(--vf-accent, #3e4e66);
    line-height: 1.2;
}
.vf-profit-chip__lbl {
    font-size: 11.5px;
    font-weight: 600;
    color: var(--bs-secondary-color, #64748b);
    line-height: 1.45;
}

.vf-profit-cta {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 11px 20px;
    border-radius: 12px;
    border: none;
    background: var(--vf-accent, #3e4e66);
    color: #fff;
    font-size: 14px;
    font-weight: 800;
    text-decoration: none;
    cursor: pointer;
    transition: filter .16s ease, transform .16s ease;
}
.vf-profit-cta:hover { filter: brightness(1.06); color: #fff; }

@media (max-width: 767.98px) {
    .vf-profit-hero { flex-direction: column; align-items: stretch; }
    .vf-profit-hero__art { max-width: 260px; }
}

/* steps */
.vf-profit-steps {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 14px;
}
.vf-profit-step {
    padding: 18px;
    border-radius: 16px;
    background: var(--bs-body-bg, #fff);
    border: 1px solid rgba(15, 23, 42, .08);
}
[data-bs-theme="dark"] .vf-profit-step,
.dark .vf-profit-step {
    background: rgba(15, 23, 42, .55);
    border-color: rgba(148, 163, 184, .14);
}
.vf-profit-step__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 12px;
    color: var(--vf-accent, #3e4e66);
    background: color-mix(in srgb, var(--vf-accent, #3e4e66) 10%, transparent);
    margin-bottom: 12px;
}
.vf-profit-step__t {
    font-size: 15px;
    font-weight: 800;
    margin: 0 0 6px;
}
.vf-profit-step__d {
    margin: 0;
    font-size: 13px;
    line-height: 1.75;
    color: var(--bs-secondary-color, #64748b);
}

/* revenue split */
.vf-profit-split {
    display: flex;
    align-items: center;
    gap: 26px;
    padding: 22px;
    border-radius: 18px;
    background: var(--bs-body-bg, #fff);
    border: 1px solid rgba(15, 23, 42, .08);
}
[data-bs-theme="dark"] .vf-profit-split,
.dark .vf-profit-split {
    background: rgba(15, 23, 42, .55);
    border-color: rgba(148, 163, 184, .14);
}
.vf-profit-split__chart { flex-shrink: 0; color: var(--bs-body-color, #0f172a); }
.vf-profit-split__text { flex: 1; min-width: 0; font-size: 14.5px; line-height: 1.85; }
.vf-profit-split__text > p { margin: 0 0 12px; }

.vf-profit-split__legend {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-bottom: 12px;
}
.vf-profit-legend__item {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: 13px;
    font-weight: 700;
}
.vf-dot {
    width: 10px;
    height: 10px;
    border-radius: 999px;
    background: rgba(148, 163, 184, .55);
    display: inline-block;
}
.vf-dot--accent { background: var(--vf-accent, #3e4e66); }

.vf-profit-split__example {
    padding: 10px 14px;
    border-radius: 10px;
    background: color-mix(in srgb, var(--vf-accent, #3e4e66) 7%, transparent);
    font-size: 13.5px;
    font-weight: 700;
    margin: 0;
}
/* v4.202.0 (update 202) — the "see the full Profit Program" link inside the
   example box (audience resource pages): readable in light AND dark mode. */
.vf-profit-split__example a {
    color: inherit;
    font-weight: 800;
    text-decoration: none;
}
.vf-profit-split__example a:hover {
    text-decoration: underline;
}

@media (max-width: 767.98px) {
    .vf-profit-split { flex-direction: column; align-items: flex-start; }
}

/* calculator */
.vf-profit-calc {
    padding: 22px;
    border-radius: 18px;
    background: var(--bs-body-bg, #fff);
    border: 1px solid rgba(15, 23, 42, .08);
}
[data-bs-theme="dark"] .vf-profit-calc,
.dark .vf-profit-calc {
    background: rgba(15, 23, 42, .55);
    border-color: rgba(148, 163, 184, .14);
}

.vf-profit-calc__controls {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 18px;
    margin-bottom: 20px;
}
.vf-profit-slider__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 8px;
}
.vf-profit-slider__lbl { font-size: 13px; font-weight: 700; }
.vf-profit-slider__val {
    font-size: 13px;
    font-weight: 800;
    color: var(--vf-accent, #3e4e66);
    background: color-mix(in srgb, var(--vf-accent, #3e4e66) 9%, transparent);
    border-radius: 999px;
    padding: 3px 11px;
    white-space: nowrap;
}

/* range input */
.vf-profit-slider input[type="range"] {
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    height: 6px;
    border-radius: 999px;
    background: rgba(148, 163, 184, .3);
    outline: none;
    cursor: pointer;
    margin: 6px 0;
}
.vf-profit-slider input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 20px;
    height: 20px;
    border-radius: 999px;
    background: var(--vf-accent, #3e4e66);
    border: 3px solid #fff;
    box-shadow: 0 2px 8px rgba(15, 23, 42, .28);
    cursor: grab;
}
.vf-profit-slider input[type="range"]::-moz-range-thumb {
    width: 14px;
    height: 14px;
    border-radius: 999px;
    background: var(--vf-accent, #3e4e66);
    border: 3px solid #fff;
    box-shadow: 0 2px 8px rgba(15, 23, 42, .28);
    cursor: grab;
}
[data-bs-theme="dark"] .vf-profit-slider input[type="range"]::-webkit-slider-thumb,
.dark .vf-profit-slider input[type="range"]::-webkit-slider-thumb {
    border-color: #0f172a;
}
[data-bs-theme="dark"] .vf-profit-slider input[type="range"]::-moz-range-thumb,
.dark .vf-profit-slider input[type="range"]::-moz-range-thumb {
    border-color: #0f172a;
}

.vf-profit-calc__results {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 12px;
}
.vf-profit-result {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 16px;
    border-radius: 14px;
    background: rgba(148, 163, 184, .1);
    border: 1px solid rgba(148, 163, 184, .2);
}
.vf-profit-result--hero {
    background: color-mix(in srgb, var(--vf-accent, #3e4e66) 9%, transparent);
    border-color: color-mix(in srgb, var(--vf-accent, #3e4e66) 26%, transparent);
}
.vf-profit-result__lbl { font-size: 12px; font-weight: 700; color: var(--bs-secondary-color, #64748b); }
.vf-profit-result__num { font-size: 22px; font-weight: 800; letter-spacing: -.01em; }
.vf-profit-result__num--muted { color: var(--bs-secondary-color, #64748b); font-size: 18px; }
.vf-profit-result--hero .vf-profit-result__num { color: var(--vf-accent, #3e4e66); }

.vf-profit-calc__methods { margin-top: 20px; }
.vf-profit-calc__methods-t { font-size: 14px; font-weight: 800; margin: 0 0 10px; }

.vf-profit-methods-table { overflow-x: auto; }
.vf-profit-mrow {
    display: grid;
    grid-template-columns: 1.4fr 1fr 1fr 1.2fr;
    gap: 8px;
    align-items: center;
    padding: 10px 12px;
    border-radius: 10px;
    font-size: 13px;
}
.vf-profit-mrow:not(:last-child) { border-bottom: 1px solid rgba(148, 163, 184, .18); }
.vf-profit-mrow--head {
    font-size: 11.5px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .03em;
    color: var(--bs-secondary-color, #64748b);
    background: rgba(148, 163, 184, .08);
    border-bottom: none;
}
.vf-profit-mrow__name { font-weight: 800; }
.vf-profit-mrow__after { font-weight: 800; color: var(--vf-accent, #3e4e66); }
.vf-profit-mrow__after.vf-profit-mrow__after--blocked {
    color: var(--bs-secondary-color, #64748b);
    font-weight: 600;
    font-size: 12px;
}
@media (max-width: 640px) {
    .vf-profit-mrow { grid-template-columns: 1.2fr 1fr 1.4fr; }
    .vf-profit-mrow > span:nth-child(3) { display: none; }
    .vf-profit-mrow--head > span:nth-child(3) { display: none; }
}

.vf-profit-calc__note {
    margin: 16px 0 0;
    font-size: 12.5px;
    color: var(--bs-secondary-color, #64748b);
}

/* payout methods */
.vf-profit-methods {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    gap: 12px;
}
.vf-profit-method {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px;
    border-radius: 14px;
    background: var(--bs-body-bg, #fff);
    border: 1px solid rgba(15, 23, 42, .08);
}
[data-bs-theme="dark"] .vf-profit-method,
.dark .vf-profit-method {
    background: rgba(15, 23, 42, .55);
    border-color: rgba(148, 163, 184, .14);
}
.vf-profit-method__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 11px;
    flex-shrink: 0;
    color: var(--vf-accent, #3e4e66);
    background: color-mix(in srgb, var(--vf-accent, #3e4e66) 10%, transparent);
}
.vf-profit-method__name { display: block; font-size: 14px; font-weight: 800; }
.vf-profit-method__meta {
    display: block;
    font-size: 12.5px;
    color: var(--bs-secondary-color, #64748b);
    margin-top: 3px;
    line-height: 1.6;
}
.vf-profit-method__sep { opacity: .6; margin-inline: 4px; }
.vf-profit-methods__note {
    margin: 14px 0 0;
    font-size: 13px;
    line-height: 1.8;
    color: var(--bs-secondary-color, #64748b);
}

/* notes */
.vf-profit-notes {
    margin: 0;
    padding: 0 0 0 2px;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.vf-profit-notes li {
    position: relative;
    padding-inline-start: 26px;
    font-size: 13.5px;
    line-height: 1.8;
    color: var(--bs-secondary-color, #64748b);
}
.vf-profit-notes li::before {
    content: "";
    position: absolute;
    inset-inline-start: 6px;
    top: .62em;
    width: 7px;
    height: 7px;
    border-radius: 999px;
    background: var(--vf-accent, #3e4e66);
}

/* ══ v4.202.0 (update 202) — resource pages: differentiators grid ══ */
/* بطاقات «كيف يختلف زيدجرام» — شبكة مقارنة عامودية: المنصات الأخرى
   مقابل زيدجرام، بنفس لغة بطاقات الخطوات أعلاه. */
.vf-profit-diff {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 14px;
}
.vf-profit-diff-card {
    padding: 18px;
    border-radius: 16px;
    background: var(--bs-body-bg, #fff);
    border: 1px solid rgba(15, 23, 42, .08);
    display: flex;
    flex-direction: column;
    gap: 10px;
}
[data-bs-theme="dark"] .vf-profit-diff-card,
.dark .vf-profit-diff-card {
    background: rgba(15, 23, 42, .55);
    border-color: rgba(148, 163, 184, .14);
}
.vf-profit-diff-card__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 11px;
    flex-shrink: 0;
    color: var(--vf-accent, #3e4e66);
    background: color-mix(in srgb, var(--vf-accent, #3e4e66) 10%, transparent);
}
.vf-profit-diff-card__t {
    font-size: 14.5px;
    font-weight: 800;
    margin: 0;
}
.vf-profit-diff-card__rows {
    display: flex;
    flex-direction: column;
    gap: 7px;
    margin: 0;
}
.vf-profit-diff-card__row {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    font-size: 13px;
    line-height: 1.7;
}
.vf-profit-diff-card__row--them { color: var(--bs-secondary-color, #64748b); }
.vf-profit-diff-card__row--us { color: var(--bs-body-color, #0f172a); font-weight: 600; }
.vf-profit-diff-card__mark { flex-shrink: 0; margin-top: .28em; }
.vf-profit-diff-card__mark--x { color: #94a3b8; }
.vf-profit-diff-card__mark--v { color: var(--vf-accent, #3e4e66); }
[data-bs-theme="dark"] .vf-profit-diff-card__row--us,
.dark .vf-profit-diff-card__row--us { color: #e2e8f0; }

/* ════════════════════════════════════════════════════════════════════
   v4.204.0 (update 204) — Policy Center document pages (About /
   Terms / Privacy). Long-form legal/about documents rendered by the
   bilingual partials page/_about_content.php, _terms_content.php and
   _privacy_content.php. Design language mirrors the vf-profit family
   (same radii, borders, color tokens) so the pages feel native inside
   the centers. Component map:
     .vf-doc-hero--flat   hero variant without illustration
     .vf-doc-meta         chips row (last-updated / applies-to)
     .vf-doc-toc          anchor chips table of contents
     .vf-doc-sec          numbered section (01 … 17)
     .vf-doc-p/--lead     paragraphs
     .vf-doc-sub          sub heading
     .vf-doc-list         bullet / titled bullet lists
     .vf-doc-own          ownership highlight box
     .vf-doc-note/.warn   info + danger boxes
     .vf-doc-grid         prohibitions grid (✗ cards)
     .vf-doc-ladder       numbered enforcement ladder
     .vf-doc-rel          related pages links
     .vf-doc-cta/.prose   About page CTA + prose
   ════════════════════════════════════════════════════════════════════ */

/* hero without the illustration */
.vf-doc-hero--flat .vf-profit-hero__text { flex: 1 1 100%; }

/* meta chips (date / scope) */
.vf-doc-meta { display: flex; flex-wrap: wrap; gap: 8px; }
.vf-doc-meta__chip {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 7px 13px;
    border-radius: 999px;
    font-size: 12.5px;
    font-weight: 700;
    color: var(--bs-secondary-color, #64748b);
    background: rgba(148, 163, 184, .12);
    border: 1px solid rgba(148, 163, 184, .26);
}
.vf-doc-meta__chip svg { color: var(--vf-accent, #3e4e66); flex-shrink: 0; }
.vf-doc-meta__chip--date {
    color: var(--vf-accent, #3e4e66);
    background: color-mix(in srgb, var(--vf-accent, #3e4e66) 9%, transparent);
    border-color: color-mix(in srgb, var(--vf-accent, #3e4e66) 28%, transparent);
}
[data-bs-theme="dark"] .vf-doc-meta__chip,
.dark .vf-doc-meta__chip {
    background: rgba(148, 163, 184, .09);
    border-color: rgba(148, 163, 184, .18);
    color: #94a3b8;
}

/* table of contents */
.vf-doc-toc {
    margin-top: 16px;
    padding: 16px 18px;
    border-radius: 16px;
    background: var(--bs-body-bg, #fff);
    border: 1px solid rgba(15, 23, 42, .08);
}
[data-bs-theme="dark"] .vf-doc-toc,
.dark .vf-doc-toc {
    background: rgba(15, 23, 42, .55);
    border-color: rgba(148, 163, 184, .14);
}
.vf-doc-toc__t {
    display: block;
    font-size: 11.5px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: var(--bs-secondary-color, #64748b);
    margin-bottom: 10px;
}
.vf-doc-toc__list {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}
.vf-doc-toc__link {
    display: inline-flex;
    align-items: center;
    padding: 6px 12px;
    border-radius: 999px;
    font-size: 12.5px;
    font-weight: 700;
    text-decoration: none;
    color: var(--bs-body-color, #334155);
    background: rgba(148, 163, 184, .1);
    border: 1px solid rgba(148, 163, 184, .2);
    transition: background-color .16s ease, border-color .16s ease, color .16s ease;
}
.vf-doc-toc__link:hover {
    color: var(--vf-accent, #3e4e66);
    background: color-mix(in srgb, var(--vf-accent, #3e4e66) 9%, transparent);
    border-color: color-mix(in srgb, var(--vf-accent, #3e4e66) 32%, transparent);
    text-decoration: none;
}
[data-bs-theme="dark"] .vf-doc-toc__link,
.dark .vf-doc-toc__link { color: #cbd5e1; background: rgba(148, 163, 184, .08); }

/* numbered sections */
.vf-doc-sec { margin-top: 30px; scroll-margin-top: 84px; }
.vf-doc-sec__title {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 17px;
    font-weight: 800;
    letter-spacing: -.01em;
    margin: 0 0 14px;
    color: var(--bs-body-color, #0f172a);
}
.vf-doc-sec__num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 38px;
    height: 38px;
    padding: 0 6px;
    border-radius: 11px;
    font-size: 13.5px;
    font-weight: 800;
    color: var(--vf-accent, #3e4e66);
    background: color-mix(in srgb, var(--vf-accent, #3e4e66) 10%, transparent);
    flex-shrink: 0;
}
.vf-doc-body { font-size: 14.5px; line-height: 1.95; }

/* paragraphs */
.vf-doc-p { margin: 0 0 12px; color: var(--bs-body-color, #1f2937); }
.vf-doc-p--lead {
    font-size: 15.5px;
    font-weight: 600;
    color: var(--bs-body-color, #0f172a);
    padding: 12px 16px;
    border-radius: 12px;
    background: color-mix(in srgb, var(--vf-accent, #3e4e66) 7%, transparent);
    border-inline-start: 3px solid var(--vf-accent, #3e4e66);
}
[data-bs-theme="dark"] .vf-doc-p,
.dark .vf-doc-p { color: #e2e8f0; }

/* sub heading */
.vf-doc-sub {
    font-size: 15px;
    font-weight: 800;
    margin: 20px 0 10px;
    color: var(--bs-body-color, #0f172a);
}

/* bullet lists */
.vf-doc-list { margin: 0 0 14px; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 9px; }
.vf-doc-list li {
    position: relative;
    padding-inline-start: 26px;
    font-size: 14px;
    line-height: 1.85;
    color: var(--bs-body-color, #1f2937);
}
[data-bs-theme="dark"] .vf-doc-list li,
.dark .vf-doc-list li { color: #e2e8f0; }
.vf-doc-list li::before {
    content: "";
    position: absolute;
    inset-inline-start: 7px;
    top: .72em;
    width: 7px;
    height: 7px;
    border-radius: 999px;
    background: var(--vf-accent, #3e4e66);
}
.vf-doc-list--titled li strong { color: var(--bs-body-color, #0f172a); font-weight: 800; }

/* ownership highlight box */
.vf-doc-own {
    position: relative;
    padding: 22px 22px 20px;
    border-radius: 18px;
    background:
        radial-gradient(130% 160% at 100% 0%,
            color-mix(in srgb, var(--vf-accent, #3e4e66) 12%, transparent) 0%,
            transparent 60%),
        var(--bs-body-bg, #fff);
    border: 1.5px solid color-mix(in srgb, var(--vf-accent, #3e4e66) 35%, transparent);
    margin: 4px 0 16px;
}
[data-bs-theme="dark"] .vf-doc-own,
.dark .vf-doc-own {
    background:
        radial-gradient(130% 160% at 100% 0%,
            color-mix(in srgb, var(--vf-accent, #3e4e66) 16%, transparent) 0%,
            transparent 60%),
        rgba(15, 23, 42, .6);
}
.vf-doc-own__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 14px;
    color: var(--vf-accent, #3e4e66);
    background: color-mix(in srgb, var(--vf-accent, #3e4e66) 12%, transparent);
    margin-bottom: 12px;
}
.vf-doc-own__t {
    font-size: 16.5px;
    font-weight: 800;
    margin: 0 0 8px;
    color: var(--bs-body-color, #0f172a);
}
.vf-doc-own__d { margin: 0 0 12px; font-size: 14.2px; line-height: 1.9; color: var(--bs-body-color, #1f2937); }
[data-bs-theme="dark"] .vf-doc-own__d,
.dark .vf-doc-own__d { color: #e2e8f0; }
.vf-doc-own__points { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 9px; }
.vf-doc-own__points li { display: flex; align-items: flex-start; gap: 9px; font-size: 13.5px; line-height: 1.75; font-weight: 600; color: var(--bs-body-color, #0f172a); }
[data-bs-theme="dark"] .vf-doc-own__points li,
.dark .vf-doc-own__points li { color: #e2e8f0; }
.vf-doc-own__points svg { flex-shrink: 0; margin-top: .22em; color: var(--vf-accent, #3e4e66); }

/* note / warn boxes */
.vf-doc-note, .vf-doc-warn {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 14px 16px;
    border-radius: 13px;
    font-size: 13.8px;
    line-height: 1.85;
    margin: 0 0 14px;
}
.vf-doc-note {
    background: color-mix(in srgb, var(--vf-accent, #3e4e66) 8%, transparent);
    border: 1px solid color-mix(in srgb, var(--vf-accent, #3e4e66) 25%, transparent);
    color: var(--bs-body-color, #1f2937);
}
.vf-doc-note svg { flex-shrink: 0; margin-top: .2em; color: var(--vf-accent, #3e4e66); }
.vf-doc-warn {
    background: rgba(229, 72, 77, .07);
    border: 1px solid rgba(229, 72, 77, .3);
    color: #8f1d21;
}
.vf-doc-warn svg { flex-shrink: 0; margin-top: .2em; color: #e5484d; }
[data-bs-theme="dark"] .vf-doc-warn,
.dark .vf-doc-warn {
    background: rgba(248, 113, 113, .08);
    border-color: rgba(248, 113, 113, .3);
    color: #fecaca;
}
[data-bs-theme="dark"] .vf-doc-note,
.dark .vf-doc-note { color: #e2e8f0; }

/* prohibitions grid */
.vf-doc-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 12px;
    margin: 0 0 14px;
}
.vf-doc-grid__item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 14px 15px;
    border-radius: 13px;
    background: var(--bs-body-bg, #fff);
    border: 1px solid rgba(229, 72, 77, .22);
}
[data-bs-theme="dark"] .vf-doc-grid__item,
.dark .vf-doc-grid__item {
    background: rgba(15, 23, 42, .55);
    border-color: rgba(248, 113, 113, .18);
}
.vf-doc-grid__x { flex-shrink: 0; margin-top: .28em; color: #e5484d; }
[data-bs-theme="dark"] .vf-doc-grid__x,
.dark .vf-doc-grid__x { color: #f87171; }
.vf-doc-grid__t { margin: 0 0 4px; font-size: 13.8px; font-weight: 800; color: var(--bs-body-color, #0f172a); }
.vf-doc-grid__d { margin: 0; font-size: 12.8px; line-height: 1.7; color: var(--bs-secondary-color, #64748b); }

/* enforcement ladder */
.vf-doc-ladder { display: flex; flex-direction: column; gap: 10px; margin: 0 0 14px; }
.vf-doc-ladder__step {
    display: flex;
    align-items: flex-start;
    gap: 13px;
    padding: 13px 16px;
    border-radius: 13px;
    background: var(--bs-body-bg, #fff);
    border: 1px solid rgba(15, 23, 42, .08);
}
[data-bs-theme="dark"] .vf-doc-ladder__step,
.dark .vf-doc-ladder__step {
    background: rgba(15, 23, 42, .55);
    border-color: rgba(148, 163, 184, .14);
}
.vf-doc-ladder__num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 800;
    color: var(--vf-accent, #3e4e66);
    background: color-mix(in srgb, var(--vf-accent, #3e4e66) 11%, transparent);
    flex-shrink: 0;
}
.vf-doc-ladder__t { margin: 0 0 3px; font-size: 14.2px; font-weight: 800; color: var(--bs-body-color, #0f172a); }
.vf-doc-ladder__d { margin: 0; font-size: 13.2px; line-height: 1.75; color: var(--bs-secondary-color, #64748b); }

/* related pages links */
.vf-doc-rel { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 12px; }
.vf-doc-rel__link {
    display: flex;
    align-items: center;
    gap: 13px;
    padding: 16px 18px;
    border-radius: 15px;
    background: var(--bs-body-bg, #fff);
    border: 1px solid rgba(15, 23, 42, .08);
    text-decoration: none;
    transition: border-color .16s ease, transform .16s ease;
}
.vf-doc-rel__link:hover { border-color: color-mix(in srgb, var(--vf-accent, #3e4e66) 45%, transparent); transform: translateY(-1px); text-decoration: none; }
[data-bs-theme="dark"] .vf-doc-rel__link,
.dark .vf-doc-rel__link {
    background: rgba(15, 23, 42, .55);
    border-color: rgba(148, 163, 184, .14);
}
.vf-doc-rel__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 12px;
    flex-shrink: 0;
    color: var(--vf-accent, #3e4e66);
    background: color-mix(in srgb, var(--vf-accent, #3e4e66) 10%, transparent);
}
.vf-doc-rel__t { flex: 1; min-width: 0; font-size: 14.5px; font-weight: 800; color: var(--bs-body-color, #0f172a); }
.vf-doc-rel__arrow { flex-shrink: 0; color: var(--bs-secondary-color, #94a3b8); }
[dir="rtl"] .vf-doc-rel__arrow { transform: scaleX(-1); }

/* About page: prose + CTA */
.vf-doc-prose p { margin: 0 0 12px; font-size: 14.5px; line-height: 1.95; color: var(--bs-body-color, #1f2937); }
[data-bs-theme="dark"] .vf-doc-prose p,
.dark .vf-doc-prose p { color: #e2e8f0; }
.vf-doc-formats {
    padding: 12px 16px;
    border-radius: 12px;
    background: rgba(148, 163, 184, .1);
    border: 1px solid rgba(148, 163, 184, .2);
    font-size: 13.8px;
    line-height: 1.85;
}
.vf-doc-cta {
    padding: 26px;
    border-radius: 20px;
    text-align: center;
    background:
        radial-gradient(120% 150% at 50% 0%,
            color-mix(in srgb, var(--vf-accent, #3e4e66) 12%, transparent) 0%,
            transparent 60%),
        var(--bs-body-bg, #fff);
    border: 1px solid rgba(15, 23, 42, .08);
}
[data-bs-theme="dark"] .vf-doc-cta,
.dark .vf-doc-cta {
    background:
        radial-gradient(120% 150% at 50% 0%,
            color-mix(in srgb, var(--vf-accent, #3e4e66) 16%, transparent) 0%,
            transparent 60%),
        rgba(15, 23, 42, .6);
    border-color: rgba(148, 163, 184, .14);
}
.vf-doc-cta__t { margin: 0 0 8px; font-size: 17.5px; font-weight: 800; color: var(--bs-body-color, #0f172a); }
.vf-doc-cta__d { margin: 0 0 18px; font-size: 14px; line-height: 1.8; color: var(--bs-secondary-color, #64748b); }
.vf-doc-cta__btns { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.vf-doc-cta__btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 11px 20px;
    border-radius: 12px;
    border: 1.5px solid rgba(148, 163, 184, .5);
    background: transparent;
    color: var(--bs-body-color, #334155);
    font-size: 14px;
    font-weight: 800;
    text-decoration: none;
    transition: background-color .16s ease, border-color .16s ease;
}
.vf-doc-cta__btn:hover { background: rgba(148, 163, 184, .14); color: var(--bs-body-color, #0f172a); text-decoration: none; }
[data-bs-theme="dark"] .vf-doc-cta__btn,
.dark .vf-doc-cta__btn { border-color: rgba(148, 163, 184, .35); color: #cbd5e1; }

/* print: clean document output */
@media print {
    .vf-doc-toc { display: none; }
    .vf-policy .vf-profit-section { margin-top: 18px; }
    .vf-doc-sec { break-inside: avoid-page; }
}

/* ════════════════════════════════════════════════════════════════════
   v4.205.0 (update 205) — Community Standards + Brand components
   ════════════════════════════════════════════════════════════════════ */

/* green ✓ variant of the doc grid (allowed uses on the Brand page) */
.vf-doc-grid--ok .vf-doc-grid__item {
    border-color: rgba(47, 158, 111, .28);
}
[data-bs-theme="dark"] .vf-doc-grid--ok .vf-doc-grid__item,
.dark .vf-doc-grid--ok .vf-doc-grid__item {
    background: rgba(15, 23, 42, .55);
    border-color: rgba(74, 222, 128, .2);
}
.vf-doc-grid--ok .vf-doc-grid__x { color: #2f9e6f; }
[data-bs-theme="dark"] .vf-doc-grid--ok .vf-doc-grid__x,
.dark .vf-doc-grid--ok .vf-doc-grid__x { color: #4ade80; }

/* live report reasons (Community Standards, section 08) */
.vf-doc-reasons {
    display: flex;
    flex-direction: column;
    gap: 9px;
    margin: 0 0 14px;
}
.vf-doc-reasons__item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 12px 15px;
    border-radius: 13px;
    background: var(--bs-body-bg, #fff);
    border: 1px solid rgba(15, 23, 42, .08);
}
[data-bs-theme="dark"] .vf-doc-reasons__item,
.dark .vf-doc-reasons__item {
    background: rgba(15, 23, 42, .55);
    border-color: rgba(148, 163, 184, .14);
}
.vf-doc-reasons__mark {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    margin-top: 2px;
    border-radius: 10px;
    background: color-mix(in srgb, var(--vf-accent, #3e4e66) 12%, transparent);
    color: var(--vf-accent, #3e4e66);
}
[data-bs-theme="dark"] .vf-doc-reasons__mark,
.dark .vf-doc-reasons__mark {
    background: rgba(148, 163, 184, .16);
    color: #cbd5e1;
}
.vf-doc-reasons__main { flex: 1 1 auto; min-width: 0; }
.vf-doc-reasons__text {
    margin: 0 0 7px;
    font-size: 13.8px;
    font-weight: 700;
    line-height: 1.7;
    color: var(--bs-body-color, #0f172a);
}
.vf-doc-reasons__badges { display: flex; flex-wrap: wrap; gap: 6px; }
.vf-doc-reasons__badge {
    display: inline-flex;
    align-items: center;
    padding: 3px 10px;
    border-radius: 999px;
    font-size: 11.5px;
    font-weight: 700;
    background: rgba(148, 163, 184, .14);
    color: var(--bs-secondary-color, #64748b);
}
[data-bs-theme="dark"] .vf-doc-reasons__badge,
.dark .vf-doc-reasons__badge {
    background: rgba(148, 163, 184, .14);
    color: #94a3b8;
}
.vf-doc-reasons__badge--paid {
    background: rgba(234, 160, 46, .14);
    color: #b07612;
}
[data-bs-theme="dark"] .vf-doc-reasons__badge--paid,
.dark .vf-doc-reasons__badge--paid {
    background: rgba(251, 191, 36, .14);
    color: #fbbf24;
}

/* brand page — logo downloads pack */
.vf-brand-dl {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(225px, 1fr));
    gap: 14px;
    margin: 0 0 16px;
}
.vf-brand-dl__card {
    display: flex;
    flex-direction: column;
    border-radius: 15px;
    border: 1px solid rgba(15, 23, 42, .08);
    background: var(--bs-body-bg, #fff);
    overflow: hidden;
    transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}
.vf-brand-dl__card:hover {
    transform: translateY(-2px);
    border-color: color-mix(in srgb, var(--vf-accent, #3e4e66) 35%, transparent);
    box-shadow: 0 10px 26px -14px rgba(15, 23, 42, .25);
}
[data-bs-theme="dark"] .vf-brand-dl__card,
.dark .vf-brand-dl__card {
    background: rgba(15, 23, 42, .55);
    border-color: rgba(148, 163, 184, .14);
}
[data-bs-theme="dark"] .vf-brand-dl__card:hover,
.dark .vf-brand-dl__card:hover {
    border-color: rgba(148, 163, 184, .3);
    box-shadow: 0 10px 26px -14px rgba(0, 0, 0, .6);
}
.vf-brand-dl__preview {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 118px;
    padding: 16px;
    background:
        repeating-conic-gradient(rgba(15, 23, 42, .04) 0% 25%, transparent 0% 50%)
        50% / 18px 18px,
        #f8fafc;
    border-bottom: 1px solid rgba(15, 23, 42, .06);
}
.vf-brand-dl__preview img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
}
.vf-brand-dl__preview--ondark {
    background:
        repeating-conic-gradient(rgba(255, 255, 255, .05) 0% 25%, transparent 0% 50%)
        50% / 18px 18px,
        #0f172a;
    border-bottom: 1px solid rgba(255, 255, 255, .08);
}
.vf-brand-dl__meta {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 12px 14px 6px;
}
.vf-brand-dl__title {
    font-size: 13.5px;
    font-weight: 800;
    color: var(--bs-body-color, #0f172a);
}
.vf-brand-dl__row {
    font-size: 12.3px;
    line-height: 1.6;
    color: var(--bs-secondary-color, #64748b);
}
.vf-brand-dl__src {
    align-self: flex-start;
    margin-top: 3px;
    padding: 2px 9px;
    border-radius: 999px;
    font-size: 10.8px;
    font-weight: 700;
    background: rgba(148, 163, 184, .16);
    color: var(--bs-secondary-color, #64748b);
}
[data-bs-theme="dark"] .vf-brand-dl__src,
.dark .vf-brand-dl__src { color: #94a3b8; }
.vf-brand-dl__src--admin {
    background: rgba(47, 158, 111, .13);
    color: #2f9e6f;
}
[data-bs-theme="dark"] .vf-brand-dl__src--admin,
.dark .vf-brand-dl__src--admin {
    background: rgba(74, 222, 128, .13);
    color: #4ade80;
}
.vf-brand-dl__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin: 10px 14px 14px;
    padding: 9px 14px;
    border-radius: 11px;
    background: var(--vf-accent, #3e4e66);
    color: #fff;
    font-size: 13px;
    font-weight: 800;
    text-decoration: none;
    transition: filter .16s ease;
}
.vf-brand-dl__btn:hover,
.vf-brand-dl__btn:focus {
    color: #fff;
    text-decoration: none;
    filter: brightness(1.12);
}

/* brand downloads print cleanly too */
@media print {
    .vf-brand-dl__btn { display: none; }
    .vf-brand-dl__card { break-inside: avoid-page; }
}