/* =========================================================
   منظمة نعمة — كتل الصفحة الرئيسية القابلة للإضافة والترتيب
   ========================================================= */
.blk-bg-tint { background: var(--tint); }
.blk-bg-dark { background: var(--deep); color: #fff; }
.blk-bg-dark h2, .blk-bg-dark h3 { color: #fff; }
.blk-bg-dark .section-head p, .blk-bg-dark p { color: rgba(255,255,255,.82); }
.blk-bg-accent { background: linear-gradient(140deg, var(--accent-soft), #fff 70%); }

/* قائمة مختصرة */
.blk-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .6rem; }
.blk-list a { display: flex; align-items: center; gap: 1rem; padding: 1rem 1.3rem; border-radius: var(--radius-sm); background: var(--white); border: 1px solid var(--line); text-decoration: none; color: var(--ink); transition: transform .4s var(--ease-out), box-shadow .4s; }
.blk-list a:hover { transform: translateY(-3px); box-shadow: var(--shadow); }
.blk-list b { flex: 1; } .bl-date { font-size: .85rem; color: var(--ink-soft); min-width: 7rem; }
.blk-bg-dark .blk-list a { background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.12); color: #fff; }

/* نص مع صورة */
.blk-ti-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 6vw, 5rem); align-items: center; }
.blk-ti-grid.is-start .blk-ti-media { order: -1; }
.blk-ti-text h2 { font-size: clamp(1.8rem, 3.6vw, 2.8rem); line-height: 1.3; }
.blk-ti-text .prose { font-size: 1.1rem; margin-bottom: 1.6rem; color: var(--ink-soft); }
.blk-bg-dark .blk-ti-text .prose { color: rgba(255,255,255,.85); }
.blk-ti-media { position: relative; }
.blk-ti-media > img, .blk-ti-media > .cover--art { position: relative; z-index: 1; width: 100%; aspect-ratio: 4 / 3.2; object-fit: cover; border-radius: 26px; box-shadow: var(--shadow-lg); }
.blk-ti-deco { position: absolute; inset: 12% -6% -6% 12%; border-radius: 26px; background: linear-gradient(140deg, var(--accent), var(--brand-2)); opacity: .35; z-index: 0; transform: rotate(-3deg); transition: transform 1s var(--ease-out); }
html[dir="rtl"] .blk-ti-deco { inset: 12% 12% -6% -6%; transform: rotate(3deg); }
.blk-ti-media:hover .blk-ti-deco { transform: rotate(0); }

/* دعوة لاتخاذ إجراء */
.blk-cta { position: relative; overflow: hidden; isolation: isolate; color: #fff; background: linear-gradient(120deg, var(--brand), var(--deep)); }
.blk-cta--accent { background: linear-gradient(120deg, var(--accent), color-mix(in srgb, var(--accent) 60%, var(--brand-2))); color: var(--ink); }
.blk-cta--dark { background: var(--ink); }
.blk-cta-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; }
.blk-cta:has(.blk-cta-bg)::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(4,30,37,.88), rgba(4,30,37,.55)); }
.blk-cta::after { content: ""; position: absolute; width: 36rem; aspect-ratio: 1; border-radius: 50%; inset-inline-end: -10rem; top: -18rem; z-index: -1; background: radial-gradient(circle, rgba(255,255,255,.18), transparent 65%); animation: drift 20s ease-in-out infinite alternate; }
.blk-cta-inner { display: flex; align-items: center; justify-content: space-between; gap: 2rem; flex-wrap: wrap; padding-block: clamp(3rem, 7vw, 5rem); }
.blk-cta h2 { font-size: clamp(1.8rem, 4vw, 2.8rem); color: inherit; margin-bottom: .4rem; }
.blk-cta p { margin: 0; max-width: 40rem; opacity: .9; }
.blk-cta-actions { display: flex; gap: .7rem; flex-wrap: wrap; }

/* العدادات كقسم */
.blk-counters-grid { grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 1rem; }
.blk-counters-grid .mc-item { padding: 2rem 1rem; background: var(--white); }
.blk-bg-dark .blk-counters-grid .mc-item { background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.12); }
.blk-bg-dark .mc-item b { color: var(--accent); } .blk-bg-dark .mc-item > span { color: rgba(255,255,255,.8); }

/* بطاقات المميزات */
.blk-feat-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(var(--cols, 3), minmax(0, 1fr)); gap: 1rem; }
.blk-feat-grid li > a, .blk-feat-grid li:not(:has(> a)) { display: block; height: 100%; padding: 1.8rem; border-radius: var(--radius); background: var(--white); border: 1px solid var(--line); text-decoration: none; color: var(--ink); transition: transform .5s var(--ease-out), box-shadow .5s; }
.blk-feat-grid li > a:hover, .blk-feat-grid li:not(:has(> a)):hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); }
.blk-feat-grid h3 { font-size: 1.2rem; margin: 0 0 .4rem; } .blk-feat-grid p { margin: 0; color: var(--ink-soft); }
.blk-bg-dark .blk-feat-grid li > a, .blk-bg-dark .blk-feat-grid li:not(:has(> a)) { background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.12); color: #fff; }
@media (max-width: 900px) { .blk-feat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* الشهادات */
.testi { position: relative; max-width: 860px; margin-inline: auto; }
.testi-track { display: grid; }
.testi-item { grid-area: 1 / 1; margin: 0; text-align: center; padding: 1rem 1rem 0; opacity: 0; transform: translateY(14px); transition: opacity .6s, transform .8s var(--ease-out); pointer-events: none; }
.testi-item.is-active { opacity: 1; transform: none; pointer-events: auto; }
.testi-q { width: 54px; height: 54px; color: var(--accent); margin: 0 auto .6rem; display: block; }
.testi blockquote { margin: 0; font: 500 clamp(1.2rem, 2.4vw, 1.6rem)/1.8 var(--font-display); }
.testi figcaption { display: inline-flex; align-items: center; gap: .8rem; margin-top: 1.4rem; text-align: start; }
.testi figcaption img, .testi .avatar { width: 54px; height: 54px; border-radius: 50%; object-fit: cover; }
.testi figcaption b { display: block; } .testi figcaption small { color: var(--ink-soft); }
.blk-bg-dark .testi figcaption small { color: rgba(255,255,255,.75); }
.testi-dots { display: flex; justify-content: center; gap: .5rem; margin-top: 1.6rem; }
.testi-dots button { width: 10px; height: 10px; border-radius: 999px; border: 0; background: var(--line); cursor: pointer; transition: width .4s var(--ease-out), background .3s; padding: 0; }
.testi-dots button.is-active { width: 30px; background: var(--brand); }

/* الخطوات */
.blk-steps-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(min(var(--n, 4), 4), minmax(0, 1fr)); gap: 1.2rem; position: relative; }
.blk-steps-list::before { content: ""; position: absolute; top: 28px; inset-inline: 10%; height: 2px; background: repeating-linear-gradient(90deg, var(--brand) 0 8px, transparent 8px 16px); opacity: .4; }
.blk-steps-list li { position: relative; text-align: center; padding: 0 .5rem; }
.bs-num { position: relative; display: grid; place-items: center; width: 58px; height: 58px; margin: 0 auto 1rem; border-radius: 50%; background: var(--ink); color: var(--accent); font: 800 1.3rem var(--font-display); box-shadow: 0 0 0 8px var(--paper); }
.blk-bg-tint .bs-num { box-shadow: 0 0 0 8px var(--tint); }
.blk-steps-list h3 { font-size: 1.15rem; margin: 0 0 .3rem; } .blk-steps-list p { margin: 0; color: var(--ink-soft); font-size: .98rem; }
@media (max-width: 760px) {
  .blk-steps-list { grid-template-columns: 1fr; gap: .9rem; }
  .blk-steps-list::before { display: none; }
  .blk-steps-list li { display: grid; grid-template-columns: auto 1fr; text-align: start; column-gap: 1rem; }
  .bs-num { grid-row: span 2; margin: 0; width: 46px; height: 46px; font-size: 1.1rem; box-shadow: none; }
}

/* فيديو بعرض كامل */
.blk-vban { position: relative; overflow: hidden; isolation: isolate; min-height: 70vh; display: grid; place-items: center; text-align: center; color: #fff; background: var(--deep); }
.blk-vban-bg { position: absolute; inset: -8% 0; width: 100%; height: 116%; object-fit: cover; z-index: -2; }
.blk-vban::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(circle at center, rgba(4,30,37,.35), rgba(4,30,37,.8)); }
.blk-vban-inner { display: grid; justify-items: center; gap: .8rem; padding-block: 5rem; }
.blk-vban .play { position: relative; left: auto; top: auto; translate: none; width: 110px; height: 110px; margin-bottom: 1rem; }
.blk-vban .play::before { content: ""; position: absolute; inset: 0; border-radius: 50%; border: 2px solid rgba(255,255,255,.4); animation: ring-out 2.4s ease-out infinite; }
@keyframes ring-out { from { transform: scale(.75); opacity: 1; } to { transform: scale(1.4); opacity: 0; } }
.blk-vban h2 { color: #fff; font-size: clamp(2rem, 5vw, 3.4rem); max-width: 22ch; margin: 0; }
.blk-vban p { max-width: 40rem; color: rgba(255,255,255,.88); font-size: 1.15rem; margin: 0; }

/* التواصل */
.blk-contact-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: .8rem; }
.blk-contact-grid .contact-card { text-decoration: none; color: var(--ink); }
.blk-contact-grid .contact-card span:not(.cc-label):not(.cc-icon) { font: 600 1.02rem var(--font-display); }

/* المسافات */
.blk-spacer--sm { height: 1.5rem; } .blk-spacer--md { height: 3.5rem; } .blk-spacer--lg { height: 6rem; }
.blk-spacer hr { border: 0; height: 1px; background: var(--line); margin: 0; position: relative; top: 50%; }

@media (max-width: 860px) {
  .blk-ti-grid { grid-template-columns: 1fr; }
  .blk-ti-grid .blk-ti-media { order: -1; }
  .blk-cta-inner { flex-direction: column; align-items: stretch; text-align: center; }
  .blk-cta-actions { justify-content: center; }
  .blk-cta-actions .btn { flex: 1 1 100%; }
  .blk-feat-grid { grid-template-columns: 1fr; }
  .blk-vban { min-height: 56vh; }
  .bl-date { display: none; }
}

/* الشريط العلوي فوق الترويسة */
.topbar { position: fixed; inset-inline: 0; top: 0; z-index: 101; height: 36px; background: var(--ink); color: rgba(255,255,255,.85); font-size: .85rem; transition: transform .45s var(--ease-out); }
.topbar-inner { height: 100%; display: flex; align-items: center; gap: 1.4rem; }
.tb-text { margin: 0; flex: 1; font-weight: 600; color: var(--accent); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tb-contacts, .tb-social { display: flex; align-items: center; gap: 1rem; }
.topbar a { color: inherit; text-decoration: none; display: inline-flex; align-items: center; gap: .35rem; }
.topbar a:hover { color: #fff; }
.tb-social .ico { width: 1rem; height: 1rem; }
.site-header.has-topbar { top: 36px; }
body:has(.topbar) main > :first-child { margin-top: 36px; }
body:has(.site-header.is-hidden) .topbar, body:has(.site-header.is-scrolled) .topbar { transform: translateY(-100%); }
body:has(.site-header.is-scrolled) .site-header.has-topbar { top: 0; }
@media (max-width: 760px) { .tb-contacts { display: none; } .tb-text { font-size: .8rem; } }
@media (min-width: 981px) { .footer-grid { grid-template-columns: 1.4fr repeat(calc(var(--fcols, 3) - 1), 1fr); } }
.footer-links { columns: 1; }
.footer-links.is-2col { columns: 2; }
