/* SDO Kathib core: tokens, typography, reveal, Lenis support */
@font-face{font-family:"SDOK Thmanyah";src:url(../fonts/thmanyah-serif-display-regular.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"SDOK Thmanyah";src:url(../fonts/thmanyah-serif-display-medium.woff2) format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"SDOK Thmanyah";src:url(../fonts/thmanyah-serif-display-bold.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}
:root{--sdo-wine:#64283a;--sdo-sand:#b8a07e;--sdo-ink:#3c1a26;--sdo-muted:#85776b;--sdo-ivory:#f6f1ea;--sdo-surface:#fff;--sdo-ease:cubic-bezier(.16,1,.3,1)}
/* Derived tokens: everything follows the 4 brand colors set in Settings > SDO Kathib. */
:root{--sdo-line:color-mix(in srgb,var(--sdo-wine) 16%,transparent);--sdo-wine-deep:color-mix(in srgb,var(--sdo-wine) 74%,#000);--sdo-wine-soft:color-mix(in srgb,var(--sdo-wine) 86%,#fff);--sdo-sand-deep:color-mix(in srgb,var(--sdo-sand) 76%,#000);--sdo-sand-wash:color-mix(in srgb,var(--sdo-sand) 14%,transparent);--sdo-deep:var(--sdo-ink);--sdo-night:color-mix(in srgb,var(--sdo-wine) 22%,#0e0b0c)}
/* Heading font (brand: Thmanyah Serif Display). Settings > SDO Kathib can switch it off (--sdo-head-ff:inherit). */
:root{--sdo-head-ff:"SDOK Thmanyah",system-ui,"Segoe UI",Tahoma,sans-serif}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-smooth [data-lenis-prevent]{overscroll-behavior:contain}
.lenis.lenis-stopped{overflow:hidden}
.lenis.lenis-smooth iframe{pointer-events:none}
/* --sdo-accent: the one accent per tone (wine on light, sand on dark). --sdo-accent-ink: text on an accent fill. */
.sdo-w{--sdo-accent:var(--sdo-wine);--sdo-accent-ink:#fff;color:var(--sdo-ink);font-family:inherit;line-height:1.85;box-sizing:border-box}
.sdo-w *,.sdo-w *::before,.sdo-w *::after{box-sizing:border-box}
.sdo-title{margin:0 0 .45em;font-family:var(--sdo-head-ff);font-weight:700;font-size:clamp(1.8rem,4.2vw,3.1rem);line-height:1.35;color:var(--sdo-ink);max-width:18em;text-wrap:balance}
.sdo-lead{margin:0;color:var(--sdo-muted);max-width:36em;font-size:clamp(1rem,1.5vw,1.1rem);line-height:1.95;text-wrap:pretty}
.sdo-rv{opacity:0;transform:translate3d(0,22px,0);transition:opacity 1.1s var(--sdo-ease),transform 1.1s var(--sdo-ease);transition-delay:var(--d,0s)}
.sdo-rv.is-in{opacity:1;transform:none}
.sdo-editor .sdo-rv{opacity:1;transform:none;transition:none}
.sdo-w a:focus-visible,.sdo-w button:focus-visible{outline:2px solid var(--sdo-sand);outline-offset:3px}
@media (prefers-reduced-motion:reduce){.sdo-rv{opacity:1;transform:none;transition:none}}

/* Section head: eyebrow (short line + label) → title → lead. Alignment from the "محاذاة العنوان" control. */
.sdo-head{position:relative;margin-bottom:0}
.sdo-eyebrow{display:inline-flex;align-items:center;gap:12px;margin:0 0 1em;font-size:.92rem;font-weight:600;letter-spacing:.01em;color:var(--sdo-sand-deep)}
.sdo-eyebrow::before{content:"";flex:none;width:26px;height:1px;background:currentColor}
.sdo-tone--dark .sdo-eyebrow{color:var(--sdo-sand)}
.sdo-al--center .sdo-head{text-align:center}
.sdo-al--center .sdo-head .sdo-title,.sdo-al--center .sdo-head .sdo-lead{margin-inline:auto}
.sdo-al--end .sdo-head{text-align:end}
.sdo-al--end .sdo-head .sdo-title,.sdo-al--end .sdo-head .sdo-lead{margin-inline-start:auto}
/* Latin sub-labels inside Arabic blocks: same side as the Arabic line (no dir=ltr on blocks; <bdi> keeps word order). */
.sdo-w bdi{unicode-bidi:isolate}

/* Dark tone ("عنابي ليلي"): semantic tokens flip, brand tokens (--sdo-deep, --sdo-wine...) stay. */
.sdo-w.sdo-tone--dark{--sdo-ink:var(--sdo-ivory);--sdo-muted:color-mix(in srgb,var(--sdo-ivory) 62%,transparent);--sdo-line:color-mix(in srgb,var(--sdo-ivory) 13%,transparent);--sdo-surface:var(--sdo-night);--sdo-accent:var(--sdo-sand);--sdo-accent-ink:var(--sdo-deep);--sdo-sand-wash:color-mix(in srgb,var(--sdo-sand) 10%,transparent);background:var(--sdo-night);color:var(--sdo-ivory);padding:clamp(64px,11vw,140px) clamp(20px,5vw,72px)}
.sdo-w.sdo-tone--dark .sdo-title{color:var(--sdo-ivory)}
/* "خلفية القسم: شفافة" (class on the Elementor widget wrapper) */
.sdo-bgm-none .sdo-w{background:transparent!important}

/* Line icons: one set for every widget (includes/icons.php). .sdo-icbox = icon in a soft circle. */
.sdo-ico{display:block;width:1em;height:1em;flex:none}
.sdo-ico-el{display:inline-grid;place-items:center;line-height:1}
.sdo-ico-el i{font-size:1em}.sdo-ico-el svg{width:1em;height:1em;fill:currentColor}
.sdo-icbox{flex:none;display:inline-grid;place-items:center;width:var(--ib,52px);height:var(--ib,52px);border-radius:50%;font-size:calc(var(--ib,52px) * .44);color:var(--sdo-accent);background:var(--sdo-sand-wash);border:1px solid color-mix(in srgb,var(--sdo-sand) 30%,transparent);transition:background .6s var(--sdo-ease),color .6s var(--sdo-ease),border-color .6s var(--sdo-ease),transform .8s var(--sdo-ease)}
/* Forward arrow (points left in RTL) */
.sdo-arrow{display:inline-block;width:1.15em;height:1.15em;transition:transform .6s var(--sdo-ease)}
html:not([dir=rtl]) .sdo-arrow{transform:scaleX(-1)}
/* Shared buttons (new widgets): accent pill + ghost; the arrow slides on hover */
.sdo-btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:54px;padding:0 30px;border-radius:99px;border:1px solid var(--sdo-accent);background:var(--sdo-accent);color:var(--sdo-accent-ink);font-weight:600;line-height:1.3;text-decoration:none;transition:background .6s var(--sdo-ease),color .6s var(--sdo-ease),border-color .6s var(--sdo-ease),transform .6s var(--sdo-ease)}
.sdo-btn:hover{background:var(--sdo-wine-deep);border-color:var(--sdo-wine-deep);color:#fff;transform:translateY(-2px)}
.sdo-btn:hover .sdo-arrow{transform:translateX(-4px)}
html:not([dir=rtl]) .sdo-btn:hover .sdo-arrow{transform:scaleX(-1) translateX(-4px)}
.sdo-btn--ghost{background:transparent;color:var(--sdo-ink);border-color:color-mix(in srgb,var(--sdo-ink) 30%,transparent)}
.sdo-btn--ghost:hover{background:var(--sdo-ink);border-color:var(--sdo-ink);color:var(--sdo-surface)}
.sdo-tone--dark .sdo-btn:hover{background:var(--sdo-ivory);border-color:var(--sdo-ivory);color:var(--sdo-deep)}
.sdo-tone--dark .sdo-btn--ghost{color:var(--sdo-ivory);border-color:color-mix(in srgb,var(--sdo-ivory) 40%,transparent)}
.sdo-btn:focus-visible{outline:2px solid var(--sdo-sand);outline-offset:3px}
/* Brand wave mark: quiet visual accent */
.sdo-wmark{display:block;width:var(--wm,120px);height:auto;pointer-events:none}
.sdo-wmark path{stroke-width:1.6;stroke:var(--sdo-sand);opacity:.55}
.sdo-wmark path:nth-child(2){stroke:var(--sdo-accent);opacity:.35}
.sdo-wmark path:nth-child(3){opacity:.3}
.sdo-head .sdo-wmark{--wm:92px;margin:0 0 18px}
.sdo-al--center .sdo-head .sdo-wmark{margin-inline:auto}
.sdo-al--end .sdo-head .sdo-wmark{margin-inline-start:auto}

/* Community palettes (one per community, used by the explorer panel and the community page) */
.sdo-pal-wine{--sdo-p1:color-mix(in srgb,var(--sdo-wine-deep) 72%,#000);--sdo-p2:var(--sdo-wine-soft)}
.sdo-pal-rose{--sdo-p1:var(--sdo-wine-deep);--sdo-p2:color-mix(in srgb,var(--sdo-wine-soft) 78%,var(--sdo-sand))}
.sdo-pal-sand{--sdo-p1:var(--sdo-sand-deep);--sdo-p2:var(--sdo-wine)}
.sdo-pal-olive{--sdo-p1:color-mix(in srgb,var(--sdo-sand-deep) 72%,#2f2f0e);--sdo-p2:var(--sdo-wine)}
.sdo-pal-dusk{--sdo-p1:color-mix(in srgb,var(--sdo-wine-deep) 78%,#26203a);--sdo-p2:color-mix(in srgb,var(--sdo-sand-deep) 70%,var(--sdo-wine))}
.sdo-pal-deep{--sdo-p1:color-mix(in srgb,var(--sdo-wine-deep) 55%,#000);--sdo-p2:var(--sdo-wine-deep)}
@property --sdo-m1{syntax:'<color>';inherits:false;initial-value:#3a1420}
@property --sdo-m2{syntax:'<color>';inherits:false;initial-value:#7a3a4c}
