/* ============================================================
   Safyeldin Theme v3 - Work Forward Executive design system
   ============================================================ */

/* ---------- Design tokens (overridden live by the Customizer) ----------
   Brand Guideline 2026 - v1.0:
   Midnight Slate #0B131A • Crisp Ice #F8FAFC • Digital Violet #7C3AED
   Electric Sky #00D2FF • Cyber Yellow #FFDF00 • Deep Petrol #365C6C
--------------------------------------------------------------- */
:root {
  --accent: #365C6C;              /* Deep Petrol */
  --accent-dark: #23424F;
  --accent-shadow: rgba(54, 92, 108, 0.35);
  --accent-soft: rgba(54, 92, 108, 0.10);
  --ink: #0B131A;                 /* Midnight Slate */
  --ink-soft: #46586A;
  --footer-bg: #0B131A;
  --bg-soft: #F8FAFC;             /* Crisp Ice */
  --sf-border: #E5EDF3;
  --sf-border-strong: #D6E1EA;
  --yellow: #FFDF00;              /* Cyber Yellow — للتأكيدات المهمة فقط */
  --violet: #7C3AED;              /* Digital Violet */
  --sky: #00D2FF;                 /* Electric Sky */
  --radius: 18px;
}

/* ---------- RTL hard guarantee ----------
   الثيم عربي بالكامل — الاتجاه مضمون هنا في الـ CSS
   حتى لو إعدادات لغة ووردبريس مش عربية (الوسم dir بييجي من header.php كطبقة تانية). */
html, body { direction: rtl; }

/* ---------- Helpers ---------- */
.sf-container { max-width: 1180px; margin-inline: auto; padding-inline: 24px; }
.sf-row { display: flex; gap: 24px; }
.sf-hide-sm { display: initial; }
.sf-hide-lg { display: none; }

@media (max-width: 900px) {
  .sf-hide-sm { display: none; }
  .sf-hide-lg { display: initial; }
}

/* ---------- Typography & tokens ---------- */
.sf-heading { font-family: 'Alexandria', sans-serif; }
.sf-body { font-family: 'Readex Pro', sans-serif; }

body.sf-theme,
body.sf-theme button,
body.sf-theme input,
body.sf-theme select,
body.sf-theme textarea {
  font-family: 'Readex Pro', sans-serif;
}

/* ---------- Buttons ---------- */
.sf-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  border-radius: 12px;
  padding: 13px 26px;
  background: var(--yellow);
  color: var(--ink) !important;
  font-family: 'Alexandria', sans-serif;
  font-weight: 700;
  text-decoration: none;
  border: 2px solid var(--yellow);
  cursor: pointer;
  transition: all 0.25s ease;
  box-shadow: 0 10px 24px -12px rgba(255, 223, 0, 0.55);
}
.sf-btn:hover { transform: translateY(-2px); background: #F0CE00; border-color: #F0CE00; }
.sf-btn svg { width: 17px; height: 17px; }

.sf-btn--ghost {
  background: #fff;
  color: var(--ink) !important;
  border-color: var(--sf-border-strong);
}
.sf-btn--ghost:hover { background: var(--bg-soft); border-color: var(--accent); color: var(--accent-dark) !important; }

.sf-btn--dark { background: var(--ink); border-color: var(--ink); }
.sf-btn--dark:hover { opacity: 0.9; background: var(--ink); border-color: var(--ink); }

.sf-btn--sm { padding: 9px 18px; font-size: 13px; border-radius: 10px; }

.sf-link-arrow {
  display: inline-flex; align-items: center; gap: 7px;
  color: var(--accent-dark); font-family: 'Alexandria', sans-serif; font-weight: 700; font-size: 14px;
  text-decoration: none;
  transition: gap 0.2s ease, color 0.2s ease;
}
.sf-link-arrow:hover { color: var(--ink); }
.sf-link-arrow svg { width: 15px; height: 15px; }

/* ---------- Highlight pills (CSS-highlighted words) ---------- */
.hl {
  background: rgba(255, 223, 0, 0.30);   /* Cyber Yellow soft */
  color: var(--ink);
  border-radius: 999px;
  padding: 0.08em 0.5em;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}
body.sf-theme h1 .hl,
body.sf-theme h2 .hl { background: transparent; color: var(--ink); box-shadow: inset 0 -0.34em 0 rgba(255, 223, 0, 0.5); border-radius: 0; padding-inline: 0.12em; }
.hl-ring {
  display: inline-block;
  background: #fff;
  color: var(--ink);
  border: 2px solid var(--accent);
  border-radius: 999px;
  padding: 0.02em 0.44em;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}

/* ---------- Header ---------- */
.sf-header {
  position: sticky; top: 0; z-index: 50;
  background: rgba(255, 255, 255, 0.86);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--sf-border);
}
.sf-header__inner {
  display: flex; align-items: center; justify-content: space-between;
  height: 76px; gap: 24px;
}
.sf-brand { display: flex; align-items: center; gap: 12px; text-decoration: none; }
.sf-brand__mark {
  width: 44px; height: 44px; border-radius: 14px;
  background: linear-gradient(135deg, var(--ink) 0%, #16324F 100%);
  color: #fff; font-family: 'Alexandria', sans-serif;
  display: flex; align-items: center; justify-content: center;
  font-weight: 900; font-size: 17px; letter-spacing: 0.5px;
  flex-shrink: 0;
}
.sf-brand__mark .sf-brand__f { color: #fff; }
.sf-brand__mark .sf-brand__s { color: var(--accent); }
.sf-brand__logo { height: 46px; width: auto; display: block; }
@media (max-width: 1000px) { .sf-brand__logo { height: 40px; } }
.sf-brand__name { font-family: 'Alexandria', sans-serif; font-weight: 800; font-size: 15px; color: var(--ink); line-height: 1.2; }
.sf-brand__role { font-size: 11px; color: var(--ink-soft); }
.sf-brand__logo { max-width: 220px; max-height: 48px; width: auto; height: auto; }
.custom-logo { max-height: 48px; width: auto; height: auto; }

.sf-nav { display: flex; align-items: center; gap: 28px; }
.sf-nav ul { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: 26px; }
.sf-nav a {
  text-decoration: none; color: var(--ink-soft); font-size: 14.5px; font-weight: 500;
  transition: color 0.2s ease;
}
.sf-nav a:hover { color: var(--accent-dark); }
.sf-nav > ul > li > a { position: relative; padding-inline: 2px; }
.sf-nav > ul > li > a::after {
  content: ""; position: absolute; bottom: -6px; right: 0; width: 0; height: 2px;
  border-radius: 2px; background: var(--accent); transition: width 0.25s ease;
}
.sf-nav > ul > li > a:hover::after { width: 100%; }

.sf-burger {
  display: none; align-items: center; justify-content: center;
  width: 44px; height: 44px; border-radius: 12px;
  border: 1px solid var(--sf-border-strong); background: #fff; color: var(--ink);
  cursor: pointer;
}
.sf-burger svg { width: 21px; height: 21px; }
.sf-burger .ico-close { display: none; }
.sf-menu-open .sf-burger { background: var(--bg-soft); border-color: var(--accent); }
.sf-menu-open .sf-burger .ico-open { display: none; }
.sf-menu-open .sf-burger .ico-close { display: inline-flex; }

.sf-mobile-backdrop {
  position: fixed; inset: 0; top: 0; z-index: 40;
  background: rgba(11, 19, 26, 0.45);
  opacity: 0; pointer-events: none;
  transition: opacity 0.25s ease;
}
.sf-menu-open .sf-mobile-backdrop {
  opacity: 1; pointer-events: auto;
}

.sf-mobile-toggle { display: none; }
.sf-menu-open .sf-mobile-menu { display: block; }
.sf-menu-open .sf-burger { background: var(--bg-soft); }
.sf-mobile-menu {
  display: none;
  position: relative; z-index: 45;
  border-top: 1px solid var(--sf-border);
  background: #fff;
  padding: 18px 24px 24px;
  box-shadow: 0 30px 50px -30px rgba(11, 19, 26, 0.35);
  animation: sf-menu-in 0.22s ease;
}
@keyframes sf-menu-in { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: translateY(0); } }
.sf-mobile-menu ul { list-style: none; margin: 0 0 16px; padding: 0; }
.sf-mobile-menu li a {
  display: block; padding: 11px 4px; text-decoration: none;
  font-family: 'Alexandria', sans-serif; font-weight: 600; font-size: 14.5px; color: var(--ink);
  border-bottom: 1px dashed var(--sf-border);
}
.sf-mobile-menu li:last-child a { border-bottom: 0; }
.sf-mobile-menu li a:hover { color: var(--accent-dark); }

@media (max-width: 1000px) {
  .sf-nav { display: none; }
  .sf-burger { display: inline-flex; }
}

/* ---------- Section shells ---------- */
.sf-section { padding: 84px 0; }
.sf-section--soft { background: var(--bg-soft); }
.sf-section--alt { background: #fff; }
.sf-sec-head { max-width: 760px; margin-inline: auto; text-align: center; margin-bottom: 52px; }
.sf-sec-head--start { text-align: right; margin-inline: 0; }
.sf-kicker {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: 'Alexandria', sans-serif; font-size: 12px; font-weight: 700;
  color: var(--accent-dark); background: var(--accent-soft);
  padding: 7px 16px; border-radius: 999px; margin-bottom: 18px;
}
.sf-sec-head h2 {
  font-family: 'Alexandria', sans-serif; font-size: clamp(26px, 4vw, 40px);
  font-weight: 900; color: var(--ink); line-height: 1.42; margin: 0 0 14px;
}
.sf-sec-head p { margin: 0; color: var(--ink-soft); font-size: 15.5px; line-height: 1.9; }

/* ---------- Hero ---------- */
.sf-hero { padding: 64px 0 40px; background: #fff; overflow: hidden; }
.sf-hero__title {
  font-family: 'Alexandria', sans-serif;
  font-size: clamp(30px, 4.6vw, 52px);
  font-weight: 900; line-height: 1.34; color: var(--ink);
  margin: 0 0 18px; letter-spacing: -0.3px;
}
.sf-hero__text { color: var(--ink-soft); font-size: 16px; line-height: 2; max-width: 56ch; margin: 0 0 30px; }
.sf-hero__actions { display: flex; flex-wrap: wrap; gap: 14px; margin-bottom: 38px; }

.sf-hero__grid {
  display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 56px; align-items: center;
}
.sf-hero__quote {
  display: inline-flex; align-items: center; gap: 10px; margin-bottom: 22px;
  padding: 8px 16px; border: 1px solid var(--sf-border-strong); border-radius: 999px;
  background: #fff; box-shadow: 0 4px 14px -8px rgba(15, 39, 64, 0.18);
  font-size: 12.5px; color: var(--ink-soft);
}
.sf-hero__quote .dot { width: 9px; height: 9px; border-radius: 50%; background: var(--accent); }
.sf-hero__quote b { font-family: 'Alexandria', sans-serif; color: var(--accent-dark); font-size: 12.5px; }

.sf-cred {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px;
  border-top: 1px solid var(--sf-border); padding-top: 26px;
}
.sf-cred div {
  background: var(--bg-soft); border: 1px solid var(--sf-border); border-radius: 14px;
  padding: 12px 14px;
}
.sf-cred span.sf-cred__k { font-size: 10.5px; font-weight: 600; color: var(--ink-soft); letter-spacing: 0.4px; display: block; }
.sf-cred span.sf-cred__v { font-family: 'Alexandria', sans-serif; font-size: 12px; font-weight: 800; color: var(--accent-dark); display: block; margin-top: 4px; }

@media (max-width: 980px) {
  .sf-hero__grid { grid-template-columns: 1fr; gap: 40px; }
  .sf-cred { grid-template-columns: repeat(2, 1fr); }
}

/* Hero visual card */
.sf-hero-visual { position: relative; max-width: 430px; margin-inline: auto; width: 100%; }
.sf-hero-visual__card {
  background: #fff; border: 1px solid var(--sf-border-strong);
  border-radius: 26px; padding: 14px;
  box-shadow: 0 30px 60px -30px rgba(15, 39, 64, 0.35);
  position: relative;
}
.sf-hero-visual__img {
  border-radius: 20px; overflow: hidden;
  background: linear-gradient(180deg, var(--accent-soft) 0%, #fff 90%);
  display: flex; align-items: flex-end; justify-content: center;
}
.sf-hero-visual__img img { width: 100%; height: auto; max-height: 460px; object-fit: cover; display: block; }
.sf-hero-visual__chip {
  position: absolute; bottom: -22px; right: 24px; z-index: 2;
  display: flex; align-items: center; gap: 12px;
  background: #fff; border: 1px solid var(--sf-border-strong); border-radius: 16px;
  padding: 12px 16px; box-shadow: 0 16px 30px -20px rgba(15, 39, 64, 0.4);
}
.sf-hero-visual__chip b {
  width: 44px; height: 44px; border-radius: 13px; background: var(--accent); color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-family: 'Alexandria', sans-serif; font-weight: 900; font-size: 14px; flex-shrink: 0;
}
.sf-hero-visual__chip span { font-family: 'Alexandria', sans-serif; font-weight: 700; font-size: 12.5px; color: var(--ink); display: block; }
.sf-hero-visual__chip small { font-size: 10.5px; color: var(--ink-soft); }
.sf-hero-visual__badge {
  position: absolute; top: -16px; left: -8px; z-index: 2;
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--yellow); border: 1px dashed rgba(11, 19, 26, 0.28); border-radius: 999px;
  padding: 9px 16px; font-size: 11.5px; font-weight: 700; color: var(--ink);
  font-family: 'Alexandria', sans-serif;
  transform: rotate(-2.5deg);
  box-shadow: 0 12px 24px -16px rgba(11, 19, 26, 0.35);
}
.sf-hero-visual__badge .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--ink); }

/* ---------- Stats ---------- */
.sf-stats {
  display: grid; grid-template-columns: repeat(4, 1fr);
  background: #fff; border: 1px solid var(--sf-border); border-radius: 22px;
  overflow: hidden; margin-top: 56px;
}
.sf-stat { padding: 26px 20px; text-align: center; border-inline-end: 1px solid var(--sf-border); }
.sf-stat:last-child { border-inline-end: 0; }
.sf-stat b { display: block; font-family: 'Alexandria', sans-serif; font-weight: 900; font-size: 32px; color: var(--ink); line-height: 1; }
.sf-stat span { display: block; margin-top: 9px; font-size: 12.5px; color: var(--ink-soft); }
@media (max-width: 900px) {
  .sf-stats { grid-template-columns: repeat(2, 1fr); }
  .sf-stat:nth-child(2) { border-inline-end: 0; }
  .sf-stat:nth-child(-n+2) { border-bottom: 1px solid var(--sf-border); }
}

/* ---------- Logos strip ---------- */
.sf-logos { padding: 40px 0 72px; background: #fff; }
.sf-logos__title { text-align: center; color: var(--ink-soft); font-size: 12px; letter-spacing: 1px; margin-bottom: 26px; }
.sf-logos__row { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; }
.sf-logos__row span {
  font-family: 'Alexandria', sans-serif; font-weight: 700; font-size: 13px;
  color: var(--ink-soft); background: var(--bg-soft);
  border: 1px solid var(--sf-border); border-radius: 12px;
  padding: 12px 22px; transition: all 0.2s ease;
}
.sf-logos__row span:hover { color: var(--accent-dark); border-color: var(--accent); transform: translateY(-2px); background: #fff; }

/* ---------- About split sections ---------- */
.sf-about { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: center; }
.sf-about h2 {
  font-family: 'Alexandria', sans-serif; font-size: clamp(25px, 3.4vw, 36px);
  font-weight: 900; line-height: 1.5; color: var(--ink); margin: 0 0 16px;
}
.sf-about p.main { color: var(--ink-soft); font-size: 15px; line-height: 2.05; margin: 0 0 26px; }
.sf-about__visual { position: relative; max-width: 480px; margin-inline: auto; width: 100%; }

/* Visual A: كارت خطوات نظام العمل — Dark Petrol + Yellow/Sky/Violet */
.sf-visual-steps {
  position: relative; border-radius: 26px; overflow: hidden;
  background: linear-gradient(150deg, #0B131A 0%, #16303C 60%, #365C6C 140%);
  box-shadow: 0 30px 60px -32px rgba(11, 19, 26, 0.6);
  padding: 36px 30px;
}
.sf-visual-steps::before {
  content: ""; position: absolute; inset: 0;
  background-image: radial-gradient(rgba(255, 255, 255, 0.10) 1.4px, transparent 1.4px);
  background-size: 20px 20px; opacity: 0.55; pointer-events: none;
}
.sf-visual-steps__head {
  position: relative; z-index: 1; display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 14px; gap: 12px;
}
.sf-visual-steps__title { font-family: 'Alexandria', sans-serif; font-weight: 800; font-size: 15px; color: #fff; }
.sf-visual-steps__logo { height: 30px; width: auto; opacity: 0.9; }
.sf-step {
  position: relative; z-index: 1;
  display: flex; gap: 14px; align-items: flex-start;
  padding: 17px 0; border-bottom: 1px dashed rgba(255, 255, 255, 0.18);
}
.sf-step:last-child { border-bottom: 0; padding-bottom: 4px; }
.sf-step > b {
  width: 40px; height: 40px; border-radius: 13px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  font-family: 'Alexandria', sans-serif; font-weight: 900; font-size: 12.5px;
}
.sf-step--1 > b { background: var(--yellow); color: var(--ink); }
.sf-step--2 > b { background: var(--sky); color: #06263A; }
.sf-step--3 > b { background: var(--violet); color: #fff; }
.sf-step h4 { font-family: 'Alexandria', sans-serif; font-size: 15px; font-weight: 800; color: #fff; margin: 2px 0 5px; }
.sf-step p { margin: 0; font-size: 12px; color: #A9BCCB; line-height: 1.9; }

/* Visual B: كارت اقتباس الهوية — Midnight Slate + Yellow */
.sf-visual-quote {
  position: relative; border-radius: 26px; overflow: hidden;
  background: radial-gradient(circle at 88% 12%, rgba(124, 58, 237, 0.35) 0%, transparent 55%),
              radial-gradient(circle at 8% 95%, rgba(0, 210, 255, 0.18) 0%, transparent 50%),
              #0B131A;
  box-shadow: 0 30px 60px -32px rgba(11, 19, 26, 0.6);
  padding: 40px 34px 96px;
}
.sf-visual-quote__q { font-family: 'Alexandria', sans-serif; font-weight: 900; font-size: 18px; color: #B9C6D4; letter-spacing: 0.5px; margin-bottom: 14px; }
.sf-visual-quote__mark {
  font-family: 'Alexandria', sans-serif; font-weight: 900;
  font-size: clamp(26px, 3vw, 34px); line-height: 1.55; color: #fff;
  margin: 0 0 18px;
}
.sf-visual-quote__mark em { font-style: normal; color: var(--yellow); }
.sf-visual-quote__mark em, .sf-visual-quote__mark .hl { background: none; border-radius: 0; padding: 0; box-shadow: inset 0 -0.26em 0 rgba(255, 223, 0, 0.22); color: var(--yellow); }
.sf-visual-quote__by { display: flex; align-items: center; gap: 10px; color: #9FB0C4; font-size: 12.5px; }
.sf-visual-quote__by b { color: #fff; font-family: 'Alexandria', sans-serif; font-size: 12.5px; }
.sf-visual-quote__dots { display: flex; gap: 6px; margin-bottom: 20px; }
.sf-visual-quote__dots i { width: 9px; height: 9px; border-radius: 50%; }
.sf-visual-quote__dots i:nth-child(1) { background: var(--yellow); }
.sf-visual-quote__dots i:nth-child(2) { background: var(--sky); }
.sf-visual-quote__dots i:nth-child(3) { background: var(--violet); }
.sf-visual-quote img.sf-visual-steps__logo { position: absolute; bottom: 26px; right: 34px; height: 34px; }

/* Floating chip (مشترك بين الفيجوالات) */
.sf-about__chip {
  position: absolute; bottom: -20px; right: 20px; z-index: 3;
  background: #fff; border: 1px solid var(--sf-border-strong); border-radius: 16px;
  padding: 13px 18px; display: flex; align-items: center; gap: 12px;
  box-shadow: 0 18px 34px -20px rgba(11, 19, 26, 0.4);
}
.sf-about__chip b {
  width: 46px; height: 46px; border-radius: 13px; background: var(--yellow); color: var(--ink);
  display: flex; align-items: center; justify-content: center;
  font-family: 'Alexandria', sans-serif; font-weight: 900; font-size: 13px;
}
.sf-about__chip span { font-family: 'Alexandria', sans-serif; font-size: 12.5px; font-weight: 700; color: var(--ink); display: block; }
.sf-about__chip small { font-size: 10.5px; color: var(--ink-soft); }
@media (max-width: 980px) {
  .sf-about { grid-template-columns: 1fr; gap: 44px; }
  .sf-about__chip { bottom: -26px; }
}

/* ---------- Services cards ---------- */
.sf-cards-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.sf-card {
  position: relative; background: #fff; border: 1px solid var(--sf-border-strong);
  border-radius: 22px; padding: 30px 26px; overflow: hidden;
  display: flex; flex-direction: column; gap: 14px;
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}
.sf-card:hover { transform: translateY(-5px); box-shadow: 0 24px 44px -26px rgba(15, 39, 64, 0.35); border-color: var(--accent); }
.sf-card__tag {
  align-self: flex-start; font-family: 'Alexandria', sans-serif; font-size: 11px; font-weight: 700;
  color: var(--accent-dark); background: var(--accent-soft);
  border-radius: 999px; padding: 5px 12px;
}
.sf-card__icon {
  width: 46px; height: 46px; border-radius: 14px;
  background: var(--accent-soft); color: var(--accent-dark);
  display: flex; align-items: center; justify-content: center;
}
.sf-card__icon svg { width: 22px; height: 22px; }
.sf-card h3 { font-family: 'Alexandria', sans-serif; font-size: 17.5px; font-weight: 800; color: var(--ink); margin: 0; line-height: 1.6; }
.sf-card p { color: var(--ink-soft); font-size: 13.5px; line-height: 1.95; margin: 0; flex: 1; }
.sf-card__foot { display: flex; align-items: center; justify-content: space-between; padding-top: 14px; border-top: 1px dashed var(--sf-border-strong); }
.sf-card--accent { background: var(--accent); border-color: var(--accent); color: #fff; }
.sf-card--accent:hover { border-color: var(--accent-dark); }
.sf-card--accent h3 { color: #fff; }
.sf-card--accent p { color: rgba(255, 255, 255, 0.85); }
.sf-card--accent .sf-card__tag { background: rgba(255, 255, 255, 0.18); color: #fff; }
.sf-card--accent .sf-card__icon { background: rgba(255, 255, 255, 0.18); color: #fff; }
.sf-card--accent .sf-card__foot { border-top-color: rgba(255, 255, 255, 0.25); }
.sf-card--accent .sf-link-arrow { color: #fff; }
.sf-card--accent .sf-card__corner { color: rgba(255, 255, 255, 0.5); }
.sf-card__corner { color: #C3D0DA; position: absolute; top: 22px; left: 22px; }
.sf-card__corner svg { width: 20px; height: 20px; }
@media (max-width: 980px) { .sf-cards-3 { grid-template-columns: 1fr; } }

/* ---------- Training & partnerships (ticket-style cards) ---------- */
.sf-train__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.sf-partner {
  position: relative; background: #fff; border: 1px dashed var(--sf-border-strong);
  border-radius: 22px; padding: 28px 24px;
  display: flex; flex-direction: column; gap: 12px; flex: 1;
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}
.sf-partner:hover { transform: translateY(-5px); box-shadow: 0 24px 44px -26px rgba(11, 19, 26, 0.35); border-color: var(--accent); border-style: solid; }
.sf-partner__logo {
  width: 54px; height: 54px; border-radius: 16px;
  display: flex; align-items: center; justify-content: center;
  font-family: 'Alexandria', sans-serif; font-weight: 900; font-size: 13px;
  margin-bottom: 6px;
}
.sf-partner__logo svg { width: 26px; height: 26px; }
.sf-partner__logo--petrol { background: var(--accent-soft); color: var(--accent-dark); }
.sf-partner__logo--sky { background: rgba(0, 210, 255, 0.14); color: #0077A3; }
.sf-partner__logo--yellow { background: rgba(255, 223, 0, 0.26); color: #8A6D00; }
.sf-partner__logo--violet { background: rgba(124, 58, 237, 0.14); color: #7C3AED; font-size: 14px; }
.sf-partner small { font-family: 'Alexandria', sans-serif; font-size: 10.5px; font-weight: 700; letter-spacing: 0.5px; text-transform: uppercase; }
.sf-partner--petrol small { color: var(--accent-dark); }
.sf-partner--sky small { color: #0077A3; }
.sf-partner--yellow small { color: #8A6D00; }
.sf-partner--violet small { color: #7C3AED; }
.sf-partner h3 { font-family: 'Alexandria', sans-serif; font-weight: 800; font-size: 16.5px; color: var(--ink); margin: 0; line-height: 1.6; }
.sf-partner p { margin: 0; font-size: 13px; color: var(--ink-soft); line-height: 1.95; flex: 1; }
.sf-partner__foot { padding-top: 12px; border-top: 1px solid var(--sf-border); display: flex; justify-content: space-between; gap: 8px; font-family: 'Alexandria', sans-serif; font-size: 11.5px; font-weight: 700; }
.sf-partner--petrol .sf-partner__foot { color: var(--accent-dark); }
.sf-partner--sky .sf-partner__foot { color: #0077A3; }
.sf-partner--yellow .sf-partner__foot { color: #8A6D00; }
.sf-partner--violet .sf-partner__foot { color: #7C3AED; }

.sf-pillars {
  background: #fff; border: 1px solid var(--sf-border-strong); border-radius: 26px;
  padding: 40px 34px; box-shadow: 0 24px 50px -30px rgba(11, 19, 26, 0.25);
  margin-top: 26px;
}
.sf-pillars > h3 { font-family: 'Alexandria', sans-serif; font-weight: 900; font-size: clamp(18px, 2.4vw, 24px); color: var(--ink); text-align: center; margin: 0 0 26px; }
.sf-pillars__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.sf-pillar { background: var(--bg-soft); border: 1px solid var(--sf-border); border-radius: 18px; padding: 18px; }
.sf-pillar b {
  width: 34px; height: 34px; border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  font-family: 'Alexandria', sans-serif; font-weight: 900; font-size: 11px; margin-bottom: 12px;
}
.sf-pillar--1 b { background: var(--accent); color: var(--yellow); }
.sf-pillar--2 b { background: var(--sky); color: #0B131A; }
.sf-pillar--3 b { background: var(--violet); color: #fff; }
.sf-pillar h4 { font-family: 'Alexandria', sans-serif; font-weight: 700; font-size: 13.5px; color: var(--ink); margin: 0 0 6px; }
.sf-pillar p { margin: 0; font-size: 12px; color: var(--ink-soft); line-height: 1.9; }
.sf-train__cta { text-align: center; margin-top: 30px; }
.sf-train__cta span { display: block; font-size: 12px; color: var(--ink-soft); margin-bottom: 6px; }
.sf-train__cta a { display: inline-flex; align-items: center; gap: 8px; font-family: 'Alexandria', sans-serif; font-weight: 700; font-size: 13.5px; color: var(--ink); text-decoration: none; background: var(--yellow); padding: 11px 20px; border-radius: 9px; transition: all 0.2s ease; }
.sf-train__cta a:hover { background: #F0CE00; text-decoration: none; transform: translateY(-2px); }
.sf-train__cta a:hover { color: var(--ink); text-decoration: underline; }
.sf-train__cta a svg { width: 15px; height: 15px; }
@media (max-width: 1080px) { .sf-train__grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 980px) { .sf-pillars__grid { grid-template-columns: 1fr; } }
@media (max-width: 620px) { .sf-train__grid { grid-template-columns: 1fr; } }

/* ---------- Tools (calculators) — بنية الديزاين الأول: inputs يمين + كارت أبيض للمخرجات ---------- */
.sf-tabs { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; margin-bottom: 34px; }
.sf-tab {
  display: inline-flex; align-items: center; gap: 9px;
  font-family: 'Alexandria', sans-serif; font-weight: 700; font-size: 13px;
  padding: 14px 22px; border-radius: 16px; border: 1.5px solid var(--sf-border-strong);
  background: var(--bg-soft); color: #3B4B5C; cursor: pointer; transition: all 0.2s ease;
  box-shadow: 0 8px 18px -12px rgba(11, 19, 26, 0.2);
}
.sf-tab svg { width: 16px; height: 16px; }
.sf-tab--violet svg { color: var(--violet); }
.sf-tab--sky svg { color: #008DBF; }
.sf-tab--yellow svg { color: #B78900; }
.sf-tab:hover { background: #fff; border-color: var(--accent); color: var(--accent-dark); }
.sf-tab.is-active { background: var(--accent); border-color: var(--accent); color: #fff; box-shadow: 0 14px 28px -14px var(--accent-shadow); }
.sf-tab.is-active svg { color: var(--yellow); }

.sf-calc {
  background: var(--bg-soft); border: 1px solid var(--sf-border-strong); border-radius: 28px;
  padding: 38px 34px; box-shadow: 0 28px 56px -32px rgba(11, 19, 26, 0.28);
}
.sf-calc__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; }
.sf-calc__out {
  background: #fff; border: 1px solid var(--sf-border); border-radius: 20px;
  padding: 24px 22px; display: flex; flex-direction: column; gap: 16px;
  box-shadow: 0 12px 26px -18px rgba(11, 19, 26, 0.2);
  height: 100%;
}
.sf-calc__badge {
  align-self: flex-start; font-family: 'Alexandria', sans-serif; font-size: 11px; font-weight: 800;
  color: var(--accent-dark); background: var(--accent-soft);
  padding: 5px 13px; border-radius: 999px;
}
.sf-calc__foot {
  margin-top: auto; border-top: 1px solid var(--sf-border); padding-top: 13px;
  display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap;
  font-size: 11.5px; color: var(--ink-soft);
}
.sf-calc__foot a { font-family: 'Alexandria', sans-serif; font-weight: 700; font-size: 11.5px; color: var(--accent-dark); text-decoration: none; }
.sf-calc__foot a:hover { color: var(--ink); text-decoration: underline; }
.sf-calc__h { font-family: 'Alexandria', sans-serif; font-weight: 800; font-size: 18px; color: var(--ink); margin: 0 0 6px; }
.sf-calc__s { font-size: 12.5px; color: var(--ink-soft); margin: 0 0 22px; }
.sf-field label { display: block; font-size: 11.5px; font-weight: 600; color: var(--ink); margin-bottom: 7px; }
.sf-field .sf-strong { color: var(--accent-dark); font-family: 'Alexandria', sans-serif; }
.sf-qcard { background: #fff; border: 1px solid var(--sf-border); border-radius: 15px; padding: 15px 17px; }
.sf-qcard + .sf-qcard { margin-top: 12px; }
.sf-qcard label { margin-bottom: 8px; }
.sf-input, .sf-select, .sf-textarea {
  width: 100%; border: 1px solid var(--sf-border-strong); background: #fff;
  border-radius: 12px; padding: 11px 14px; font-size: 13.5px; color: var(--ink);
  outline: none; transition: border-color 0.2s ease, box-shadow 0.2s ease;
  box-shadow: 0 4px 10px -8px rgba(11, 19, 26, 0.15);
}
.sf-input:focus, .sf-select:focus, .sf-textarea:focus { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); background: #fff; }
.sf-select { appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%2347566B' stroke-width='2.4'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: left 13px center; padding-left: 36px; }
.sf-textarea { resize: vertical; min-height: 86px; }

.sf-out-card { background: var(--bg-soft); border: 1px solid var(--sf-border); border-radius: 16px; padding: 16px; }
.sf-out-card > span:first-child { font-size: 11px; color: var(--ink-soft); display: block; }
.sf-out-card b { display: block; font-family: 'Alexandria', sans-serif; font-weight: 900; font-size: 22px; color: var(--ink); margin-top: 6px; }

.sf-bars { margin-top: 24px; }
.sf-bar-row + .sf-bar-row { margin-top: 13px; }
.sf-bar-tops { display: flex; justify-content: space-between; font-size: 12px; margin-bottom: 6px; }
.sf-bar-tops span { color: var(--ink-soft); }
.sf-bar-tops b { font-family: 'Alexandria', sans-serif; color: var(--accent-dark); }
.sf-bar-track { height: 9px; background: var(--sf-border); border-radius: 999px; overflow: hidden; }
.sf-bar-fill { height: 100%; border-radius: 999px; background: var(--accent); transition: width 0.35s ease; }
.sf-bar-fill--violet { background: var(--violet); }
.sf-bar-fill--sky { background: var(--sky); }
.sf-bar-fill--amber { background: #F59E0B; }

.sf-input-range { width: 100%; height: 7px; -webkit-appearance: none; appearance: none; background: var(--sf-border); border-radius: 999px; outline: none; margin: 8px 0 2px; }
.sf-input-range::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 20px; height: 20px; border-radius: 50%; background: var(--accent); border: 3px solid #fff; box-shadow: 0 2px 8px rgba(15, 39, 64, 0.35); cursor: pointer; }
.sf-input-range::-moz-range-thumb { width: 20px; height: 20px; border-radius: 50%; background: var(--accent); border: 3px solid #fff; box-shadow: 0 2px 8px rgba(15, 39, 64, 0.35); cursor: pointer; }
.sf-quiz-dial { display: flex; align-items: center; justify-content: center; flex-direction: column; width: 128px; height: 128px; margin: 18px auto; border-radius: 50%; border: 5px solid var(--accent-soft); background: #fff; }
.sf-quiz-dial b { font-family: 'Alexandria', sans-serif; font-weight: 900; font-size: 34px; color: var(--ink); }
.sf-quiz-dial span { font-size: 11px; color: var(--ink-soft); }
.sf-quiz-box { border-radius: 16px; border: 1.5px solid #E7D18A; background: #FBF4DC; padding: 18px; }
.sf-quiz-box.is-good { border-color: #9BDDB1; background: #EAF9F0; }
.sf-quiz-box.is-bad { border-color: #F3ACB0; background: #FDF0F0; }
.sf-quiz-box h4 { font-family: 'Alexandria', sans-serif; font-weight: 800; font-size: 14.5px; margin: 0 0 6px; color: #9C6F0A; }
.sf-quiz-box.is-good h4 { color: #157F3D; }
.sf-quiz-box.is-bad h4 { color: #C0392B; }
.sf-quiz-box p { margin: 0; font-size: 12.5px; color: var(--ink-soft); line-height: 1.9; }
.sf-out-ratio-good { color: #157F3D; }
.sf-out-ratio-warn { color: #B7791F; }
@media (max-width: 980px) { .sf-calc__grid { grid-template-columns: 1fr; } }

/* ---------- Video section ---------- */
.sf-video-section { background: var(--bg-soft); }
.sf-video-wrap {
  position: relative; margin-inline: auto; max-width: 900px; aspect-ratio: 16 / 9;
  background: var(--ink); border-radius: 24px; overflow: hidden;
  border: 1px solid var(--sf-border-strong); box-shadow: 0 34px 70px -34px rgba(15, 39, 64, 0.55);
}
.sf-video-wrap iframe, .sf-video-wrap video { width: 100%; height: 100%; border: 0; display: block; }
.sf-video-fallback { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 18px; padding: 24px; background:
  radial-gradient(circle at 20% 30%, rgba(0, 210, 255, 0.22) 0%, transparent 55%),
  radial-gradient(circle at 85% 80%, rgba(124, 58, 237, 0.28) 0%, transparent 50%),
  var(--ink); text-align: center; }
.sf-video-fallback::before { content: ""; position: absolute; inset: 0; background-image: radial-gradient(rgba(255,255,255,0.08) 1.3px, transparent 1.3px); background-size: 22px 22px; }
.sf-video-fallback__btn { width: 78px; height: 78px; border-radius: 50%; background: var(--yellow); border: 0; color: var(--ink); display: flex; align-items: center; justify-content: center; cursor: pointer; transition: transform 0.2s ease; position: relative; z-index: 1; }
.sf-video-fallback__btn svg { width: 30px; height: 30px; margin-left: -3px; }
.sf-video-fallback__btn:hover { transform: scale(1.08); }
.sf-video-fallback span { color: #B9C6D4; font-size: 13px; position: relative; z-index: 1; }

/* ---------- Blogs ---------- */
.sf-blog-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.sf-post-card {
  display: flex; flex-direction: column; background: #fff;
  border: 1px solid var(--sf-border-strong); border-radius: 22px; overflow: hidden;
  color: inherit; text-decoration: none;
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}
.sf-post-card:hover { transform: translateY(-5px); box-shadow: 0 26px 46px -28px rgba(15, 39, 64, 0.35); border-color: var(--accent); }
.sf-post-card__img { aspect-ratio: 16/10; overflow: hidden; background: var(--bg-soft); }
.sf-post-card__img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.4s ease; }
.sf-post-card:hover .sf-post-card__img img { transform: scale(1.05); }
.sf-post-card__ph { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; background: linear-gradient(135deg, var(--accent-soft), #fff 65%); color: var(--accent); }
.sf-post-card__ph svg { width: 44px; height: 44px; }
.sf-post-card__body { padding: 22px; display: flex; flex-direction: column; gap: 9px; flex: 1; }
.sf-post-card__meta { display: flex; align-items: center; gap: 10px; font-size: 11px; color: var(--ink-soft); }
.sf-post-card__cat { font-family: 'Alexandria', sans-serif; font-weight: 700; color: var(--accent-dark); background: var(--accent-soft); border-radius: 999px; padding: 3px 10px; }
.sf-post-card h3 { font-family: 'Alexandria', sans-serif; font-size: 15.5px; font-weight: 800; color: var(--ink); line-height: 1.68; margin: 0; }
.sf-post-card__excerpt { color: var(--ink-soft); font-size: 12.5px; line-height: 1.9; margin: 0; flex: 1; }
.sf-post-card__more { margin-top: 10px; padding-top: 13px; border-top: 1px dashed var(--sf-border-strong); color: var(--accent-dark); font-weight: 700; font-size: 12px; display: flex; align-items: center; justify-content: space-between; }
.sf-post-card__more svg { width: 15px; height: 15px; }
.sf-blog-foot { margin-top: 40px; text-align: center; }
@media (max-width: 980px) { .sf-blog-grid { grid-template-columns: 1fr; } }

/* ---------- Testimonials ---------- */
.sf-tst { background: linear-gradient(160deg, var(--accent-dark) 0%, var(--accent) 100%); border-radius: 30px; padding: 52px 40px; position: relative; overflow: hidden; color: #fff; }
.sf-tst::before { content: ""; position: absolute; top: -80px; left: -80px; width: 320px; height: 320px; border-radius: 50%; background: rgba(255, 255, 255, 0.08); }
.sf-tst::after { content: ""; position: absolute; bottom: -100px; right: -60px; width: 300px; height: 300px; border-radius: 50%; background: rgba(255, 255, 255, 0.06); }
.sf-tst__head { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 30px; position: relative; z-index: 1; flex-wrap: wrap; }
.sf-tst__head h2 { font-family: 'Alexandria', sans-serif; font-weight: 900; font-size: clamp(23px, 3vw, 31px); margin: 0; }
.sf-tst__arrows { display: flex; gap: 10px; }
.sf-tst__arrow { width: 42px; height: 42px; border-radius: 12px; background: rgba(255, 255, 255, 0.14); border: 1px solid rgba(255, 255, 255, 0.28); color: #fff; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: background 0.2s ease; }
.sf-tst__arrow:hover { background: rgba(255, 255, 255, 0.28); }
.sf-tst__arrow svg { width: 18px; height: 18px; }
.sf-tst__track { display: flex; gap: 18px; scroll-snap-type: x mandatory; overflow-x: auto; scrollbar-width: none; position: relative; z-index: 1; padding-bottom: 6px; }
.sf-tst__track::-webkit-scrollbar { display: none; }
.sf-tst-item { flex: 0 0 calc(33.33% - 12px); min-width: 260px; scroll-snap-align: start; background: #fff; border-radius: 18px; padding: 24px 22px; display: flex; flex-direction: column; gap: 14px; }
.sf-tst-item__stars { color: #F5A623; display: flex; gap: 2px; }
.sf-tst-item__stars svg { width: 15px; height: 15px; fill: currentColor; stroke: none; }
.sf-tst-item p { margin: 0; color: var(--ink-soft); font-size: 13px; line-height: 2; flex: 1; }
.sf-tst-item__who { display: flex; align-items: center; gap: 12px; }
.sf-tst-item__who b { width: 40px; height: 40px; border-radius: 12px; background: var(--accent-soft); color: var(--accent-dark); font-family: 'Alexandria', sans-serif; font-weight: 800; display: flex; align-items: center; justify-content: center; font-size: 13px; }
.sf-tst-item__who span { font-family: 'Alexandria', sans-serif; font-weight: 700; font-size: 13px; color: var(--ink); display: block; }
.sf-tst-item__who small { color: var(--ink-soft); font-size: 11px; }
@media (max-width: 980px) { .sf-tst-item { flex-basis: 88%; } }

/* ---------- Consultation ---------- */
.sf-consult { background: var(--bg-soft); }
.sf-consult__card {
  background: #fff; border: 1px solid var(--sf-border-strong); border-radius: 28px;
  padding: 44px 40px; display: grid; grid-template-columns: 1.05fr 0.95fr; gap: 44px;
  position: relative; overflow: hidden; box-shadow: 0 28px 60px -36px rgba(15, 39, 64, 0.4);
}
.sf-consult__card::before { content: ""; position: absolute; top: -70px; left: -70px; width: 240px; height: 240px; background: var(--accent-soft); border-radius: 50%; filter: blur(4px); }
.sf-consult__left { position: relative; z-index: 1; }
.sf-consult__left h2 { font-family: 'Alexandria', sans-serif; font-size: clamp(24px, 3vw, 33px); font-weight: 900; color: var(--ink); line-height: 1.5; margin: 0 0 14px; }
.sf-consult__left > p { color: var(--ink-soft); font-size: 14px; line-height: 2.05; margin: 0 0 24px; }
.sf-contact-row { display: flex; align-items: center; gap: 13px; padding: 11px 0; }
.sf-contact-row__icon { width: 40px; height: 40px; border-radius: 12px; background: var(--accent-soft); color: var(--accent-dark); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.sf-contact-row__icon svg { width: 18px; height: 18px; }
.sf-contact-row small { display: block; color: var(--ink-soft); font-size: 10.5px; }
.sf-contact-row a { text-decoration: none; color: var(--ink); font-weight: 600; font-size: 13.5px; font-family: 'Alexandria', sans-serif; }
.sf-contact-row a:hover { color: var(--accent-dark); }
.sf-free-callout { margin-top: 22px; background: #EAF9F0; border: 1px solid #9BDDB1; border-radius: 16px; padding: 15px 17px; display: flex; gap: 13px; align-items: flex-start; }
.sf-free-callout__icon { width: 34px; height: 34px; border-radius: 10px; background: #D2F2DE; color: #157F3D; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.sf-free-callout__icon svg { width: 16px; height: 16px; }
.sf-free-callout h4 { font-family: 'Alexandria', sans-serif; font-size: 12.5px; font-weight: 800; color: #157F3D; margin: 2px 0 4px; }
.sf-free-callout p { margin: 0; font-size: 11.5px; color: #2F6B41; line-height: 1.85; }
.sf-free-callout a { display: inline-block; margin-top: 6px; color: #157F3D; font-weight: 700; font-size: 11.5px; text-decoration: underline; }

.sf-consult__form { position: relative; z-index: 1; background: var(--bg-soft); border: 1px solid var(--sf-border); border-radius: 20px; padding: 26px 24px; }
.sf-consult__form h3 { font-family: 'Alexandria', sans-serif; font-size: 15.5px; font-weight: 800; color: var(--ink); margin: 0 0 4px; }
.sf-consult__form > p { margin: 0 0 16px; font-size: 11.5px; color: var(--ink-soft); }
.sf-field + .sf-field { margin-top: 12px; }
.sf-form-body { display: flex; flex-direction: column; }
.sf-btn--full { width: 100%; justify-content: center; margin-top: 16px; }
.sf-form-status { display: none; margin-top: 14px; border-radius: 12px; padding: 11px 14px; font-size: 12.5px; line-height: 1.8; }
.sf-form-status.is-ok { display: block; background: #EAF9F0; border: 1px solid #9BDDB1; color: #157F3D; }
.sf-form-status.is-err { display: block; background: #FDF0F0; border: 1px solid #F3ACB0; color: #C0392B; }
.sf-hp { position: absolute; opacity: 0; pointer-events: none; height: 0; width: 0; }
@media (max-width: 980px) { .sf-consult__card { grid-template-columns: 1fr; padding: 28px 22px; gap: 30px; } }

/* ---------- Footer ---------- */
.sf-footer { background: var(--footer-bg); color: #CBD6E4; padding: 64px 0 0; position: relative; overflow: hidden; }
.sf-footer::before {
  content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background:
    radial-gradient(circle at 90% 10%, rgba(124, 58, 237, 0.22) 0%, transparent 42%),
    radial-gradient(circle at 6% 90%, rgba(0, 210, 255, 0.15) 0%, transparent 40%),
    radial-gradient(rgba(255, 255, 255, 0.05) 1.3px, transparent 1.3px);
  background-size: auto, auto, 22px 22px;
}
.sf-footer .sf-container { position: relative; z-index: 1; }
.sf-footer__top { display: grid; grid-template-columns: 1fr 1.4fr; gap: 44px; align-items: center; padding-bottom: 46px; }
.sf-footer__brand { display: flex; align-items: center; gap: 12px; }
.sf-footer__brand .sf-brand__mark { border: 1px solid rgba(255, 255, 255, 0.16); }
.sf-footer__brand .sf-brand__logo { height: 54px; }
.sf-footer__brand .custom-logo { max-height: 56px; }
.sf-footer__tagline { margin-top: 14px; color: #9FB0C4; font-size: 13px; }
.sf-footer__social { display: flex; gap: 10px; margin-top: 20px; }
.sf-footer__social a { width: 42px; height: 42px; border-radius: 12px; border: 1px solid rgba(255, 255, 255, 0.16); color: #CBD6E4; display: flex; align-items: center; justify-content: center; text-decoration: none; transition: all 0.2s ease; }
.sf-footer__social a:hover { border-color: var(--yellow); color: #fff; background: rgba(255, 223, 0, 0.14); }
.sf-footer__social svg { width: 17px; height: 17px; }

.sf-talk { display: grid; grid-template-columns: auto auto; align-items: center; gap: 26px; justify-content: start; }
.sf-talk__title {
  font-family: 'Alexandria', sans-serif; font-weight: 900; letter-spacing: 0.4px;
  font-size: clamp(40px, 6.4vw, 74px); line-height: 1.2; margin: 0;
  background: linear-gradient(100deg, #FFFFFF 12%, rgba(0, 210, 255, 0.85) 48%, rgba(255, 223, 0, 0.92) 95%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.sf-talk__btnwrap { display: flex; flex-direction: column; gap: 10px; }
.sf-talk__text { color: #9FB0C4; font-size: 13px; margin: 0; }

.sf-widgets { padding-top: 8px; }
.sf-widgets::before { content: ""; display: block; border-top: 1px solid rgba(255, 255, 255, 0.1); margin-bottom: 30px; }

.sf-footer__bar { border-top: 1px solid rgba(255, 255, 255, 0.1); padding: 20px 0 24px; }
.sf-footer__bar-inner { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.sf-footer__menu ul { list-style: none; display: flex; flex-wrap: wrap; gap: 20px; margin: 0; padding: 0; }
.sf-footer__menu a { color: #8FA0B4; text-decoration: none; font-size: 12.5px; }
.sf-footer__menu a:hover { color: #fff; }
.sf-footer__copy { color: #8FA0B4; font-size: 12px; margin: 0; }
@media (max-width: 900px) {
  .sf-footer__top { grid-template-columns: 1fr; gap: 34px; }
  .sf-talk { flex-direction: column; align-items: flex-start; gap: 16px; }
}

/* ---------- Generic pages / blog listing ---------- */
.sf-page-head { padding: 72px 0 44px; text-align: center; }
.sf-page-head h1 { font-family: 'Alexandria', sans-serif; font-size: clamp(27px, 4vw, 44px); font-weight: 900; color: var(--ink); margin: 0 0 12px; line-height: 1.4; }
.sf-page-head p { color: var(--ink-soft); max-width: 640px; margin: 0 auto; font-size: 15px; line-height: 1.95; }

.sf-featured-card {
  background: #fff; border: 1px solid var(--sf-border-strong); border-radius: 26px;
  box-shadow: 0 26px 50px -30px rgba(15, 39, 64, 0.35); overflow: hidden; margin-bottom: 44px;
}
.sf-featured-card__grid { display: grid; grid-template-columns: 7fr 5fr; }
.sf-featured-card__body { padding: 36px 32px; display: flex; flex-direction: column; gap: 14px; }
.sf-featured-card__badge { font-family: 'Alexandria', sans-serif; font-size: 11px; font-weight: 800; color: var(--ink); background: var(--yellow); border-radius: 999px; padding: 5px 12px; align-self: flex-start; }
.sf-featured-card__body h2 { font-family: 'Alexandria', sans-serif; font-size: clamp(19px, 2.4vw, 26px); font-weight: 900; color: var(--ink); line-height: 1.55; margin: 0; }
.sf-featured-card__body h2 a { color: inherit; text-decoration: none; transition: color 0.2s ease; }
.sf-featured-card__body h2 a:hover { color: var(--accent-dark); }
.sf-featured-card__body p { margin: 0; color: var(--ink-soft); font-size: 13.5px; line-height: 2; }
.sf-featured-card__side { background: linear-gradient(135deg, var(--ink) 0%, #1B2A38 100%); color: #fff; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; padding: 30px; text-align: center; position: relative; overflow: hidden; }
.sf-featured-card__side::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 50% 120%, rgba(0, 210, 255, 0.3) 0%, transparent 60%), radial-gradient(rgba(255,255,255,0.07) 1.3px, transparent 1.3px); background-size: 100% 100%, 20px 20px; }
.sf-featured-card__side div { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; gap: 10px; }
.sf-featured-card__side svg { width: 34px; height: 34px; color: var(--accent); }
.sf-featured-card__side .tag { font-family: 'Alexandria', sans-serif; font-size: 11px; color: var(--accent); }
.sf-featured-card__side .ttl { font-family: 'Alexandria', sans-serif; font-weight: 800; font-size: 16px; }
.sf-featured-card__more { display: flex; align-items: center; justify-content: space-between; padding-top: 4px; }
@media (max-width: 900px) { .sf-featured-card__grid { grid-template-columns: 1fr; } }

.sf-entry { max-width: 780px; margin-inline: auto; }
.sf-entry__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; font-size: 12px; color: var(--ink-soft); margin-bottom: 18px; }
.sf-entry__cat { font-family: 'Alexandria', sans-serif; font-weight: 800; font-size: 11.5px; color: var(--accent-dark); background: var(--accent-soft); padding: 4px 12px; border-radius: 999px; }
.sf-entry h1.sf-entry__title { font-family: 'Alexandria', sans-serif; font-size: clamp(26px, 4vw, 40px); font-weight: 900; color: var(--ink); line-height: 1.42; margin: 0 0 14px; }
.sf-entry__fig img { width: 100%; border-radius: 24px; margin: 26px 0; box-shadow: 0 26px 50px -28px rgba(15, 39, 64, 0.3); }
.sf-entry__summary {
  background: var(--accent-soft); border-right: 4px solid var(--accent);
  border-radius: 14px; padding: 16px 20px; margin-bottom: 26px;
}
.sf-entry__summary b { font-family: 'Alexandria', sans-serif; font-size: 12px; color: var(--accent-dark); display: block; margin-bottom: 5px; }
.sf-entry__summary p { margin: 0; font-size: 13px; color: var(--ink-soft); line-height: 2; }
.sf-entry__content { font-size: 16px; line-height: 2.15; color: #2E3D4D; }
.sf-entry__content > * + * { margin-top: 1.2em; }
.sf-entry__content h1, .sf-entry__content h2, .sf-entry__content h3, .sf-entry__content h4 {
  font-family: 'Alexandria', sans-serif; color: var(--ink); line-height: 1.6; margin-top: 1.8em;
}
.sf-entry__content h2 { font-size: 25px; font-weight: 800; }
.sf-entry__content h3 { font-size: 19px; font-weight: 800; }
.sf-entry__content h2::before, .sf-entry__content h3::before { content: "# "; color: var(--accent); }
.sf-entry__content a { color: var(--accent-dark); text-decoration: underline; text-decoration-color: var(--accent); text-underline-offset: 3px; }
.sf-entry__content ul, .sf-entry__content ol { padding-right: 26px; padding-left: 0; }
.sf-entry__content ul li { list-style: disc; }
.sf-entry__content ol li { list-style: decimal; }
.sf-entry__content li + li { margin-top: 0.5em; }
.sf-entry__content blockquote {
  margin: 1.4em 0; padding: 16px 22px; background: var(--bg-soft);
  border-right: 4px solid var(--accent); border-radius: 14px; color: var(--ink-soft);
}
.sf-entry__content img, .sf-entry__content video, .sf-entry__content iframe { max-width: 100%; border-radius: 16px; }
.sf-entry__content code { background: var(--bg-soft); border: 1px solid var(--sf-border); border-radius: 6px; padding: 2px 7px; font-size: 0.9em; direction: ltr; display: inline-block; }
.sf-entry__content pre { direction: ltr; text-align: left; background: var(--ink); color: #DCE7F2; border-radius: 14px; padding: 18px 22px; overflow-x: auto; }
.wp-block-button__link, .wp-block-image img, .wp-block-embed iframe, .wp-block-embed video { max-width: 100%; }
.alignwide { max-width: 1000px; margin-inline: auto; }
.alignfull { margin-inline: calc(50% - 50vw); max-width: 100vw; width: calc(100vw - (100vw - 100%)); }

.sf-author-box { background: #fff; border: 1px solid var(--sf-border-strong); border-radius: 22px; padding: 26px; margin-top: 40px; display: flex; gap: 18px; align-items: flex-start; }
.sf-author-box__av { width: 58px; height: 58px; border-radius: 16px; background: var(--ink); color: var(--accent); font-family: 'Alexandria', sans-serif; font-weight: 900; display: flex; align-items: center; justify-content: center; font-size: 17px; flex-shrink: 0; }
.sf-author-box h4 { font-family: 'Alexandria', sans-serif; color: var(--ink); font-weight: 800; margin: 0; font-size: 14.5px; }
.sf-author-box p { margin: 6px 0 0; font-size: 12.5px; color: var(--ink-soft); line-height: 1.95; }
.sf-author-box__links { display: flex; gap: 14px; margin-top: 10px; font-size: 12px; }
.sf-author-box__links a { color: var(--accent-dark); text-decoration: none; font-weight: 700; font-family: 'Alexandria', sans-serif; }
.sf-author-box__links a:hover { text-decoration: underline; }

.sf-cta-banner {
  max-width: 780px; margin: 44px auto 0; text-align: center;
  background: linear-gradient(135deg, var(--ink) 0%, #1B2A38 100%);
  border-radius: 26px; padding: 40px 30px; color: #fff; position: relative; overflow: hidden; }
.sf-cta-banner::before { content: ""; position: absolute; inset: 0; background-image: radial-gradient(rgba(255, 255, 255, 0.08) 1.3px, transparent 1.3px); background-size: 20px 20px; }
}
.sf-cta-banner .chip { display: inline-block; background: rgba(255, 255, 255, 0.12); color: var(--yellow); font-family: 'Alexandria', sans-serif; font-size: 11px; font-weight: 800; padding: 6px 14px; border-radius: 999px; margin-bottom: 14px; }
.sf-cta-banner h3 { font-family: 'Alexandria', sans-serif; font-weight: 900; font-size: 24px; margin: 0 0 10px; position: relative; z-index: 1; }
.sf-cta-banner .chip { position: relative; z-index: 1; }
.sf-cta-banner p { position: relative; z-index: 1; color: #B9C6D4; font-size: 13px; margin: 0 0 22px; line-height: 1.95; }
.sf-cta-banner .sf-btn { position: relative; z-index: 1; }

/* Pagination */
.sf-pagination { display: flex; justify-content: center; gap: 8px; margin-top: 40px; flex-wrap: wrap; }
.sf-pagination .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 42px; height: 42px; padding: 0 12px; border-radius: 12px; border: 1px solid var(--sf-border-strong); background: #fff; color: var(--ink-soft); text-decoration: none; font-weight: 700; font-size: 13px; transition: all 0.2s ease; }
.sf-pagination .page-numbers:hover { border-color: var(--accent); color: var(--accent-dark); }
.sf-pagination .page-numbers.current { background: var(--accent); border-color: var(--accent); color: #fff; }

/* ---------- Comments ---------- */
.sf-comments { max-width: 780px; margin: 52px auto 0; }
.sf-comments-title { font-family: 'Alexandria', sans-serif; font-weight: 800; color: var(--ink); font-size: 19px; }
.comment-list { list-style: none; margin: 0 0 30px; padding: 0; }
.comment-list .comment { background: #fff; border: 1px solid var(--sf-border); border-radius: 18px; padding: 20px 22px; margin-top: 14px; }
.comment-list .children { list-style: none; margin: 14px 0 0; padding-right: 22px; }
.comment-author { display: flex; align-items: center; gap: 10px; margin-bottom: 7px; }
.comment-author .avatar { border-radius: 12px; }
.comment-author .says { display: none; }
.comment-author .fn { font-family: 'Alexandria', sans-serif; font-weight: 700; color: var(--ink); font-size: 13.5px; }
.comment-metadata { font-size: 11px; color: var(--ink-soft); margin-bottom: 8px; }
.comment-metadata a { color: inherit; text-decoration: none; }
.comment-content { font-size: 13px; color: #2E3D4D; line-height: 2; }
.comment-content p { margin: 0 0 8px; }
.reply a { color: var(--accent-dark); font-size: 12px; font-weight: 700; text-decoration: none; }
.comment-respond { background: #fff; border: 1px solid var(--sf-border-strong); border-radius: 20px; padding: 26px 24px; }
.comment-respond h3 { font-family: 'Alexandria', sans-serif; font-weight: 800; font-size: 16px; color: var(--ink); margin: 0 0 16px; }
.comment-respond label { display: block; font-size: 11.5px; font-weight: 600; margin-bottom: 6px; color: var(--ink); }
.comment-respond .submit { background: var(--accent); color: #fff; border: 0; border-radius: 12px; padding: 12px 26px; font-family: 'Alexandria', sans-serif; font-weight: 700; cursor: pointer; }
.comment-form { display: grid; gap: 12px; }
.comment-form p { margin: 0; }
.comment-form input:not([type="submit"]):not([type="checkbox"]), .comment-form textarea { width: 100%; border: 1px solid var(--sf-border-strong); background: var(--bg-soft); border-radius: 12px; padding: 11px 14px; font-size: 13.5px; outline: none; }
.comment-form input:focus, .comment-form textarea:focus { border-color: var(--accent); background: #fff; }
.comment-form-cookies-consent { display: flex; align-items: center; gap: 8px; font-size: 11.5px; color: var(--ink-soft); }
.comment-form .logged-in-as, .comment-notes { font-size: 12px; color: var(--ink-soft); margin: 0; }
.bypostauthor { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }

/* ---------- 404 / no results ---------- */
.sf-404 { padding: 96px 0; text-align: center; }
.sf-404__num { font-family: 'Alexandria', sans-serif; font-weight: 900; font-size: clamp(70px, 12vw, 130px); line-height: 1; background: linear-gradient(120deg, var(--sky), var(--violet)); -webkit-background-clip: text; background-clip: text; color: transparent; margin: 0; }
.sf-404 h1 { font-family: 'Alexandria', sans-serif; font-weight: 800; color: var(--ink); font-size: clamp(20px, 3vw, 28px); margin: 14px 0 10px; }
.sf-404 p { color: var(--ink-soft); margin: 0 0 26px; }
.sf-searchform { display: flex; gap: 10px; max-width: 480px; margin-inline: auto; }
.sf-searchform input { flex: 1; border: 1px solid var(--sf-border-strong); background: #fff; border-radius: 12px; padding: 12px 16px; font-size: 13.5px; outline: none; }
.sf-searchform input:focus { border-color: var(--accent); }
.sf-searchform button { background: var(--ink); color: #fff; border: 0; border-radius: 12px; padding: 0 20px; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.sf-searchform button svg { width: 17px; height: 17px; }

/* ---------- Videos page (TikTok style) ---------- */
.sf-tt { background: var(--bg-soft); min-height: 100vh; padding-bottom: 40px; }
.sf-tt__strip { background: var(--ink); color: #CBD6E4; position: sticky; top: 76px; z-index: 30; padding: 12px 0; }
.sf-tt__strip-inner { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.sf-tt__tags { display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none; }
.sf-tt__tags::-webkit-scrollbar { display: none; }
.sf-tt__tags span { font-family: 'Alexandria', sans-serif; font-size: 11.5px; font-weight: 700; padding: 6px 14px; border-radius: 999px; background: rgba(255, 255, 255, 0.08); border: 1px solid rgba(255, 255, 255, 0.14); white-space: nowrap; }
.sf-tt__tags span.is-active { background: var(--accent); border-color: var(--accent); color: #fff; }
.sf-tt__nav { display: flex; gap: 8px; }
.sf-tt__navbtn { width: 34px; height: 34px; border-radius: 50%; background: rgba(255, 255, 255, 0.1); border: 1px solid rgba(255, 255, 255, 0.18); color: #fff; display: flex; align-items: center; justify-content: center; cursor: pointer; }
.sf-tt__navbtn:hover { background: var(--accent); border-color: var(--accent); }
.sf-tt__navbtn svg { width: 16px; height: 16px; }
.sf-tt__viewport { height: calc(100vh - 122px); overflow-y: auto; scroll-snap-type: y mandatory; max-width: 480px; margin-inline: auto; padding-top: 14px; }
.sf-tt__card { height: calc(100vh - 122px); scroll-snap-align: start; scroll-snap-stop: always; padding: 8px 6px; display: flex; }
.sf-tt__inner {
  position: relative; width: 100%; border-radius: 24px; overflow: hidden;
  border: 1px solid #1C3550; background: linear-gradient(180deg, #13293F 0%, #0B1A2B 100%);
  color: #fff; display: flex; flex-direction: column; justify-content: space-between;
  box-shadow: 0 30px 60px -30px rgba(11, 26, 43, 0.8);
}
.sf-tt__top { display: flex; align-items: center; justify-content: space-between; position: relative; z-index: 6; padding: 15px 16px; background: linear-gradient(180deg, rgba(0, 0, 0, 0.55), transparent); }
.sf-tt__top-left { display: flex; align-items: center; gap: 9px; font-family: 'Alexandria', sans-serif; font-size: 11.5px; font-weight: 700; }
.sf-tt__live { width: 9px; height: 9px; border-radius: 50%; background: #F43F5E; }
.sf-tt__open { color: var(--yellow); font-weight: 700; font-size: 11px; text-decoration: none; display: flex; align-items: center; gap: 6px; }
.sf-tt__open svg { width: 13px; height: 13px; }
.sf-tt__embed-wrap { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; overflow-y: auto; scrollbar-width: none; background: #000; z-index: 4; }
.sf-tt__embed-wrap::-webkit-scrollbar { display: none; }
.sf-tt__play-wrap { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; text-align: center; padding: 26px; z-index: 3; }
.sf-tt__play { width: 72px; height: 72px; border-radius: 50%; background: rgba(255, 255, 255, 0.12); border: 2px solid var(--accent); color: #fff; display: flex; align-items: center; justify-content: center; }
.sf-tt__play svg { width: 26px; height: 26px; margin-left: -3px; }
.sf-tt__episode { font-family: 'Alexandria', sans-serif; font-size: 10.5px; font-weight: 800; color: #fff; background: var(--accent); padding: 5px 12px; border-radius: 999px; }
.sf-tt__play-wrap h3 { font-family: 'Alexandria', sans-serif; font-weight: 900; font-size: 21px; line-height: 1.55; margin: 2px 0; max-width: 270px; }
.sf-tt__play-wrap p { font-size: 11.5px; color: #A9B8C9; margin: 0; max-width: 280px; }
.sf-tt__side { position: absolute; bottom: 96px; left: 12px; z-index: 7; display: flex; flex-direction: column; align-items: center; gap: 16px; }
.sf-tt__side button, .sf-tt__side a { display: flex; flex-direction: column; align-items: center; gap: 4px; background: transparent; border: 0; color: #fff; text-decoration: none; font-size: 10.5px; font-weight: 700; cursor: pointer; padding: 0; }
.sf-tt__side .ico { width: 40px; height: 40px; border-radius: 50%; background: rgba(0, 0, 0, 0.45); backdrop-filter: blur(6px); border: 0; display: flex; align-items: center; justify-content: center; transition: color 0.2s ease; }
.sf-tt__side button:hover .ico, .sf-tt__side a:hover .ico { color: var(--accent); }
.sf-tt__side svg { width: 18px; height: 18px; }
.sf-tt__side .ico--cta { background: rgba(255, 223, 0, 0.28); border: 1.5px solid var(--yellow); }
.sf-tt__bottom { position: relative; z-index: 6; padding: 14px 16px; background: linear-gradient(0deg, rgba(0, 0, 0, 0.75) 20%, rgba(0, 0, 0, 0.4)); }
.sf-tt__handle { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.sf-tt__handle b { font-family: 'Alexandria', sans-serif; font-size: 13px; }
.sf-tt__handle span { color: var(--accent); font-size: 11px; font-weight: 600; }
.sf-tt__bottom p.pp { font-size: 11px; color: #C3CFDB; margin: 0 0 8px; line-height: 1.9; }
.sf-tt__sound { display: flex; align-items: center; gap: 7px; font-size: 10.5px; color: #8FA0B4; }
.sf-tt__sound svg { width: 13px; height: 13px; color: var(--yellow); }
.sf-tt__fab { position: fixed; bottom: 18px; inset-inline-start: 50%; transform: translateX(-50%); margin-inline-start: 0; z-index: 40; background: var(--ink); border: 1px solid rgba(255, 255, 255, 0.16); border-radius: 999px; padding: 9px 16px; display: flex; align-items: center; gap: 14px; font-size: 11.5px; }
.sf-tt__fab a, .sf-tt__fab button { color: #CBD6E4; text-decoration: none; background: transparent; border: 0; display: flex; align-items: center; gap: 6px; font-weight: 600; font-size: 11.5px; cursor: pointer; }
.sf-tt__fab a:hover, .sf-tt__fab button:hover { color: #fff; }
.sf-tt__fab svg { width: 14px; height: 14px; }
.sf-tt__fab .sep { color: rgba(255, 255, 255, 0.2); }

/* ---------- Free consultation page ---------- */
.sf-free-hero { padding: 64px 0 30px; text-align: center; }
.sf-free-hero h1 { font-family: 'Alexandria', sans-serif; font-size: clamp(27px, 4vw, 44px); font-weight: 900; color: var(--ink); line-height: 1.4; margin: 0 0 14px; }
.sf-free-hero > p { color: var(--ink-soft); max-width: 660px; margin: 0 auto; font-size: 15px; line-height: 2; }
.sf-free-elig { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 40px; }
@media (max-width: 900px) { .sf-free-elig { grid-template-columns: 1fr; } }
.sf-faq { max-width: 720px; margin: 56px auto 0; }
.sf-faq__item { background: #fff; border: 1px solid var(--sf-border-strong); border-radius: 16px; padding: 18px 22px; margin-bottom: 14px; }
.sf-faq__item h4 { font-family: 'Alexandria', sans-serif; font-weight: 800; color: var(--accent-dark); font-size: 14px; margin: 0 0 7px; }
.sf-faq__item p { margin: 0; font-size: 12.5px; color: var(--ink-soft); line-height: 1.95; }

/* ---------- Misc ---------- */
::selection { background: var(--yellow); color: var(--ink); }
body.sf-theme { background: #fff; color: var(--ink); -webkit-font-smoothing: antialiased; }
img { user-select: none; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 6px; }
input[type="range"] { accent-color: var(--accent); }
::-webkit-scrollbar { width: 9px; height: 9px; }
::-webkit-scrollbar-track { background: var(--bg-soft); }
::-webkit-scrollbar-thumb { background: #C3D0DA; border-radius: 8px; }
::-webkit-scrollbar-thumb:hover { background: var(--accent); }
.screen-reader-text { border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); height: 1px; width: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; }
.skip-link { position: absolute; top: -48px; right: 12px; z-index: 60; background: var(--ink); color: #fff; padding: 10px 16px; border-radius: 10px; font-size: 12px; }
.skip-link:focus { top: 12px; color: #fff; }
.no-scrollbar { scrollbar-width: none; }
.no-scrollbar::-webkit-scrollbar { display: none; }

/* ============================================================
   v3.2 — Sharpness pass (ألوان أجرأ + زوايا حادة) + إصلاح الـ panels
   ============================================================ */

/* إصلاح: الـ hidden attribute بيتقاوض من الرعاية display:grid في الحاسبات */
[hidden] { display: none !important; }

/* ---------- زوايا حادة (الحد الأقصى للانحناء 14-16 بكسل بدل 26-30) ---------- */
.sf-btn { border-radius: 9px; }
.sf-btn--sm { border-radius: 7px; }
.sf-tab { border-radius: 8px; box-shadow: none; }
.sf-tab:hover { transform: translateY(-1px); }
.sf-tab.is-active { transform: translateY(-1px); }
.sf-input, .sf-select, .sf-textarea { border-radius: 7px; box-shadow: none; }
.sf-searchform input, .sf-searchform button { border-radius: 7px; }
.sf-out-card, .sf-qcard, .sf-pillar, .sf-partner, .sf-tst-item, .sf-faq__item,
.comment-list .comment, .sf-form-status, .sf-quiz-box { border-radius: 8px; }
.sf-partner__logo { border-radius: 9px; }
.sf-card, .sf-post-card, .sf-author-box { border-radius: 10px; }
.sf-stats { border-radius: 12px; }
.sf-calc, .sf-calc__out, .sf-consult__card, .sf-consult__form,
.sf-featured-card, .sf-cta-banner, .sf-video-wrap, .sf-pillars,
.sf-visual-steps, .sf-visual-quote, .comment-respond { border-radius: 14px; }
.sf-tst { border-radius: 16px; }
.sf-step > b { border-radius: 8px; }
.sf-contact-row__icon { border-radius: 8px; }
.sf-hero-visual__card { border-radius: 12px; }
.sf-hero-visual__img { border-radius: 9px; }
.sf-hero-visual__chip, .sf-hero-visual__chip b, .sf-about__chip, .sf-about__chip b { border-radius: 8px; }
.sf-hero-visual__badge { border-radius: 4px; }
.sf-logos__row span { border-radius: 6px; }
.sf-tt__inner { border-radius: 12px; }

/* ---------- ألوان أجرأ (روح) ---------- */
/* الكايكر: أصفر البراند بدل الرمادي الباهت */
.sf-kicker { background: var(--yellow); color: var(--ink); }
/* الأرقام: لون مختلف لكل رقم */
.sf-stat:nth-child(2) b { color: #7C3AED; }
.sf-stat:nth-child(3) b { color: #008DBF; }
.sf-stat:nth-child(4) b { color: #B7791F; }
/* أيقونات كروت الخدمات: سماوي وبنفسجي */
.sf-cards-3 .sf-card:nth-child(2) .sf-card__icon { background: rgba(0, 210, 255, 0.16); color: #008DBF; }
.sf-cards-3 .sf-card:nth-child(3) .sf-card__icon { background: rgba(124, 58, 237, 0.14); color: #7C3AED; }
/* خط ملون فوق كل كارت خدمة */
.sf-card { border-top: 3px solid var(--sky); }
.sf-card--accent { border-top-color: var(--yellow); }
.sf-cards-3 .sf-card:nth-child(2) { border-top-color: var(--sky); }
.sf-cards-3 .sf-card:nth-child(3) { border-top-color: var(--violet); }
/* خلفيات الأقسام الناعمة اشفالت بالسماوي تفتيح مش باهتة */
.sf-section--soft { background: #F0F6FA; }
/* الكلمة المميزة على الداكن (تشهد العميل): أزرق زايد */
body.sf-theme .sf-tst .hl { background: none; color: var(--yellow); box-shadow: inset 0 -0.26em 0 rgba(255, 223, 0, 0.20); border-radius: 0; padding-inline: 0.08em; }
/* لوحة الـ Hero أصغر ألوان وفي */
.sf-hero__quote b { color: var(--accent-dark); }

/* ============================================================
   v3.3 — CTA أصفر عالي المنفاذ + Tooltips للمصطلحات
   ============================================================ */

/* رابط CTA داخل الحاسبات: يبقى زرار أصفر واضح بدل كلمة رابطة عادية */
.sf-calc__foot a {
  background: var(--yellow);
  color: var(--ink) !important;
  padding: 10px 18px;
  border-radius: 9px;
  transition: all 0.2s ease;
  box-shadow: 0 8px 18px -10px rgba(255, 223, 0, 0.55);
}
.sf-calc__foot a:hover { background: #F0CE00; text-decoration: none; transform: translateY(-2px); }

/* Tooltip بسيط لمصطلحات الحاسبات (hover على الديسكتوب / tap على الموبايل) */
.sf-tip {
  position: relative;
  display: inline-flex; align-items: center; justify-content: center;
  width: 15px; height: 15px; border-radius: 50%;
  background: var(--accent-soft); color: var(--accent-dark);
  font-size: 9.5px; font-weight: 800; font-family: 'Alexandria', sans-serif;
  cursor: help; vertical-align: middle; margin-inline-start: 5px;
  outline: none;
}
.sf-tip:hover, .sf-tip:focus { background: var(--accent-dark); color: #fff; }
.sf-tip::after {
  content: attr(data-tip);
  position: absolute; bottom: calc(100% + 8px); right: 50%;
  transform: translateX(50%);
  background: var(--ink); color: #fff;
  font-family: 'Readex Pro', sans-serif; font-weight: 400; font-size: 11px;
  line-height: 1.7; white-space: normal; width: max-content; max-width: 230px;
  padding: 8px 12px; border-radius: 8px;
  opacity: 0; visibility: hidden; pointer-events: none;
  transition: opacity 0.15s ease;
  z-index: 30;
  box-shadow: 0 10px 24px -10px rgba(11, 19, 26, 0.5);
}
.sf-tip:hover::after, .sf-tip:focus::after { opacity: 1; visibility: visible; }
.sf-tip::before {
  content: '';
  position: absolute; bottom: calc(100% + 2px); right: 50%;
  transform: translateX(50%);
  border: 5px solid transparent; border-top-color: var(--ink);
  opacity: 0; visibility: hidden; pointer-events: none;
  transition: opacity 0.15s ease; z-index: 30;
}
.sf-tip:hover::before, .sf-tip:focus::before { opacity: 1; visibility: visible; }