/* =====================================================================
   قوالب السلايدر — تُختار من اللوحة: الإعدادات ← السلايدر والواجهة ← قالب السلايدر
   wipe (الافتراضي في sections.css) · cinema · split · coverflow · shutters · showcase
   ===================================================================== */

/* ---------------------------------------------------------------- السينمائي */
.slider--cinema .slide.is-active .slide-bg,
html[dir="ltr"] .slider--cinema .slide.is-active .slide-bg { animation: cine-in 1.8s cubic-bezier(.2, .6, .2, 1) both; }
@keyframes cine-in { from { opacity: 0; transform: scale(1.12); filter: blur(14px) saturate(.6); } to { opacity: 1; transform: none; filter: none; } }
.slider--cinema .slide.is-leaving .slide-bg { animation: cine-out 1.3s ease both; }
@keyframes cine-out { to { opacity: 0; transform: scale(1.04); } }
.slider--cinema .slide-shade,
html[dir="ltr"] .slider--cinema .slide-shade { background: radial-gradient(ellipse at center, rgba(4, 30, 37, .25) 0%, rgba(4, 30, 37, .78) 75%), linear-gradient(0deg, rgba(4, 30, 37, .75), transparent 45%); }
.slider--cinema::before, .slider--cinema::after { content: ""; position: absolute; inset-inline: 0; z-index: 6; height: clamp(18px, 5.5vh, 54px); background: #02161b; pointer-events: none; transition: transform 1.2s var(--ease-out) .2s; }
.slider--cinema::before { top: 0; transform: translateY(-100%); }
.slider--cinema::after { bottom: 0; transform: translateY(100%); }
.slider--cinema.is-ready::before, .slider--cinema.is-ready::after { transform: none; }
.slider--cinema .slide-content { align-items: center; text-align: center; padding-bottom: 8.5rem; }
.slider--cinema .slide-content > * { max-width: 60rem; }
.slider--cinema .slide-kicker { align-self: center; background: none; border: 0; backdrop-filter: none; letter-spacing: .25em; text-transform: uppercase; font-size: .85rem; padding: 0 0 .9rem; position: relative; }
html[lang="ar"] .slider--cinema .slide-kicker { letter-spacing: 0; font-size: 1rem; }
.slider--cinema .slide-kicker::after { content: ""; position: absolute; bottom: 0; inset-inline: 30%; height: 2px; background: var(--accent); transform: scaleX(0); transition: transform 1.2s var(--ease-out) .9s; }
.slider--cinema .slide.is-active .slide-kicker::after { transform: scaleX(1); }
.slider--cinema .slide-kicker .pulse-dot { display: none; }
.slider--cinema .slide-title { font-size: clamp(2.6rem, 7.4vw, 6.4rem); line-height: 1.08; letter-spacing: -.02em; text-shadow: 0 10px 40px rgba(0, 0, 0, .35); }
html[lang="ar"] .slider--cinema .slide-title { line-height: 1.3; letter-spacing: 0; }
.js .slider--cinema .slide .slide-content > .slide-title { opacity: 1; transform: none; animation: none; }
.slider--cinema .slide-title .w { display: inline-block; opacity: 0; transform: translateY(.45em) scale(.96); filter: blur(10px); }
.slider--cinema .slide.is-active .slide-title .w { animation: word-in 1.1s var(--ease-out) both; animation-delay: calc(.5s + var(--w) * .11s); }
.slider--cinema .slide.is-leaving .slide-title .w { opacity: 1; transform: none; filter: none; animation: word-out .5s ease both; animation-delay: calc(var(--w) * .03s); }
@keyframes word-in { to { opacity: 1; transform: none; filter: blur(0); } }
@keyframes word-out { to { opacity: 0; transform: translateY(-.3em); filter: blur(6px); } }
.slider--cinema .slide-text { margin-inline: auto; }
.slider--cinema .slide-actions, .slider--cinema .slide-meta { justify-content: center; }
.slider--cinema .slider-ui { justify-content: center; bottom: calc(clamp(18px, 5.5vh, 54px) + 1.2rem); }
.slider--cinema .slider-dots { flex: 0 1 640px; }
.slider--cinema .slider-count { display: none; }

/* ---------------------------------------------------------------- المنقسم */
.slider--split { background: radial-gradient(circle at 15% 20%, color-mix(in srgb, var(--brand) 55%, transparent), transparent 55%), var(--deep); }
.slider--split .slide-bg { inset: 0; inset-inline-start: 46%; clip-path: polygon(14% 0, 100% 0, 100% 100%, 0 100%); }
html[dir="rtl"] .slider--split .slide-bg { inset-inline-start: 46%; clip-path: polygon(0 0, 86% 0, 100% 100%, 0 100%); }
.slider--split .slide.is-active .slide-bg { animation: split-in 1.4s cubic-bezier(.75, 0, .2, 1) both; }
html[dir="rtl"] .slider--split .slide.is-active .slide-bg { animation-name: split-in-rtl; }
@keyframes split-in { from { clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%); } to { clip-path: polygon(14% 0, 100% 0, 100% 100%, 0 100%); } }
@keyframes split-in-rtl { from { clip-path: polygon(0 0, 0 0, 0 100%, 0 100%); } to { clip-path: polygon(0 0, 86% 0, 100% 100%, 0 100%); } }
.slider--split .slide.is-leaving .slide-bg { animation: none; }
.slider--split .slide-bg > img { transform: scale(1.05); }
.slider--split .slide-shade, html[dir="ltr"] .slider--split .slide-shade { inset-inline-start: 46%; background: linear-gradient(0deg, rgba(4, 30, 37, .45), transparent 40%); clip-path: inherit; }
.slider--split .slide-content > * { max-width: min(34rem, 40vw); }
.slider--split .slide-title { font-size: clamp(2.1rem, 4.4vw, 3.9rem); }
.slider--split .slide::after { content: attr(data-num); position: absolute; z-index: 2; bottom: 5.5rem; inset-inline-start: var(--gutter); font: 800 clamp(6rem, 14vw, 12rem)/1 var(--font-display); color: transparent; -webkit-text-stroke: 1.5px rgba(255, 255, 255, .14); pointer-events: none; opacity: 0; transform: translateY(40px); transition: opacity 1s .5s, transform 1.2s var(--ease-out) .5s; }
.slider--split .slide.is-active::after { opacity: 1; transform: none; }
.slider--split .slide-art { inset: 0; }
.slider--split .slider-ui { inset-inline-end: auto; width: min(34rem, 40vw); margin-inline-start: var(--gutter); padding: 0; }
.slider--split .slider-dots .dot { max-width: 90px; }
.slider--split .dot-label { display: none; }
.slider--split .slide-content::before { content: ""; width: 64px; height: 4px; border-radius: 4px; background: var(--accent); margin-bottom: 1.4rem; transform-origin: inline-start; transform: scaleX(0); transition: transform 1s var(--ease-out) .35s; }
.slider--split .slide.is-active .slide-content::before { transform: scaleX(1); }

/* ---------------------------------------------------------------- البطاقات ثلاثية الأبعاد */
.slider--coverflow { perspective: 1600px; background: #031a20; }
.slider--coverflow .slide, .slider--coverflow .slide.is-active, .slider--coverflow .slide.is-leaving { visibility: visible; pointer-events: none; z-index: auto; }
.slider--coverflow .slide-blur { z-index: 0; }
.slider--coverflow .slide-shade { z-index: 1; }
.slider--coverflow .slide:not(.is-active) .slide-shade { visibility: hidden; }
.slider--coverflow .slide-blur { position: absolute; inset: -60px; background: var(--img, linear-gradient(135deg, var(--deep), var(--brand))) center / cover; filter: blur(42px) saturate(1.3) brightness(.55); opacity: 0; transition: opacity 1.2s ease; }
.slider--coverflow .slide.is-active .slide-blur { opacity: 1; }
.slider--coverflow .slide-shade, html[dir="ltr"] .slider--coverflow .slide-shade { background: linear-gradient(90deg, rgba(3, 26, 32, .1), rgba(3, 26, 32, .7)); opacity: 0; transition: opacity 1s; }
html[dir="ltr"] .slider--coverflow .slide-shade { background: linear-gradient(270deg, rgba(3, 26, 32, .1), rgba(3, 26, 32, .7)); }
.slider--coverflow .slide.is-active .slide-shade { opacity: 1; }
.slider--coverflow .slide-bg {
  --step: min(15vw, 210px);
  inset: auto; top: 50%; inset-inline-end: 9vw; width: min(36vw, 500px); aspect-ratio: 4 / 5; z-index: calc(20 - var(--abs, 0));
  border-radius: 26px; box-shadow: 0 40px 80px -30px rgba(0, 0, 0, .7), 0 0 0 1px rgba(255, 255, 255, .12);
  pointer-events: auto; cursor: pointer; transform-style: preserve-3d;
  transform: translateY(-50%) translateX(calc(var(--off, 0) * var(--step) * -1)) translateZ(calc(var(--abs, 0) * -170px)) rotateY(calc(var(--off, 0) * 32deg));
  opacity: calc(1 - var(--abs, 0) * .28); filter: brightness(calc(1 - var(--abs, 0) * .22));
  transition: transform 1.1s cubic-bezier(.2, .75, .2, 1), opacity 1.1s, filter 1.1s;
  animation: none !important;
}
html[dir="rtl"] .slider--coverflow .slide-bg { transform: translateY(-50%) translateX(calc(var(--off, 0) * var(--step))) translateZ(calc(var(--abs, 0) * -170px)) rotateY(calc(var(--off, 0) * -32deg)); }
.slider--coverflow .slide.is-active .slide-bg { cursor: default; }
.slider--coverflow .slide-bg > img { transform: scale(1.04); }
.slider--coverflow .slide.is-active .slide-bg > img { animation: kenburns calc(var(--dur, 7s) + 2s) linear both; }
.slider--coverflow .slide-bg::after { content: ""; position: absolute; inset: 0; border-radius: inherit; background: linear-gradient(115deg, rgba(255, 255, 255, .22), transparent 40%); pointer-events: none; }
.slider--coverflow .slide-content { pointer-events: auto; z-index: 30; }
.slider--coverflow .slide:not(.is-active) .slide-content { visibility: hidden; }
.slider--coverflow .slide-content > * { max-width: min(34rem, 44vw); }
.slider--coverflow .slide-title { font-size: clamp(2rem, 4.2vw, 3.8rem); }
.slider--coverflow .slider-ui { z-index: 40; }
.slider--coverflow .dot-label { display: none; }
.slider--coverflow .slider-dots .dot { max-width: 70px; }

/* ---------------------------------------------------------------- الستائر */
.slider--shutters .slide-bg,
.slider--shutters .slide.is-active .slide-bg,
html[dir="ltr"] .slider--shutters .slide.is-active .slide-bg { animation: none; clip-path: none; }
.slider--shutters .slide-bg > img { opacity: 0; transform: none; }
.slider--shutters .slide.is-active .slide-bg > img { animation: shut-img 0s linear 1.25s forwards, kenburns-soft calc(var(--dur, 7s) + 2s) linear 1.25s both; }
@keyframes shut-img { to { opacity: 1; } }
@keyframes kenburns-soft { from { transform: scale(1); } to { transform: scale(1.07); } }
.slider:not(.is-ready).slider--shutters .slide.is-active .slide-bg > img { animation: none; opacity: 1; }
.slider--shutters .strips { position: absolute; inset: 0; }
.slider--shutters .strip { position: absolute; top: 0; bottom: 0; left: calc(var(--k) * 100% / 6); width: calc(100% / 6 + 1px); overflow: hidden; }
.slider--shutters .strip > i { position: absolute; top: 0; bottom: 0; left: calc(var(--k) * -100%); width: 600%; background: var(--img) center / cover; }
.slider--shutters .slide.is-active .strip { animation: strip-in .95s cubic-bezier(.8, 0, .2, 1) both; animation-delay: calc(var(--k) * .07s); }
.slider--shutters .slide.is-active .strip:nth-child(even) { animation-name: strip-in-up; }
html[dir="rtl"] .slider--shutters .slide.is-active .strip { animation-delay: calc((5 - var(--k)) * .07s); }
@keyframes strip-in { from { transform: translateY(-101%); } to { transform: none; } }
@keyframes strip-in-up { from { transform: translateY(101%); } to { transform: none; } }
.slider:not(.is-ready).slider--shutters .strip { animation: none !important; }
.slider--shutters .slide.is-active .slide-bg > img ~ .strips { animation: strips-hide 0s linear 1.3s forwards; }
@keyframes strips-hide { to { visibility: hidden; } }
.slider--shutters .slide.is-active .slide-art { animation: cine-in 1.4s ease both; }
.slider--shutters .slide-title { font-size: clamp(2.3rem, 5.6vw, 4.5rem); }
.slider--shutters .slide-content::after { content: ""; position: absolute; inset-inline-start: var(--gutter); top: 0; bottom: 0; width: 1px; background: linear-gradient(transparent, rgba(255, 255, 255, .35), transparent); opacity: .6; }

/* ---------------------------------------------------------------- المعرض الدائري */
.slider--showcase .slide.is-active .slide-bg,
html[dir="ltr"] .slider--showcase .slide.is-active .slide-bg { animation: orb-in 1.5s cubic-bezier(.7, 0, .2, 1) both; }
@keyframes orb-in { from { clip-path: circle(0% at var(--cx, 50%) var(--cy, 88%)); } to { clip-path: circle(150% at var(--cx, 50%) var(--cy, 88%)); } }
.slider--showcase .slide-content { justify-content: flex-end; padding-bottom: 10rem; }
.slider--showcase .slide-content > * { max-width: 40rem; }
.slider--showcase .slide-content { --glass: rgba(4, 30, 37, .38); }
.slider--showcase .slide-title { font-size: clamp(2.1rem, 4.6vw, 4rem); }
.slider--showcase .slide-shade, html[dir="ltr"] .slider--showcase .slide-shade { background: linear-gradient(0deg, rgba(4, 30, 37, .9) 8%, rgba(4, 30, 37, .2) 60%, rgba(4, 30, 37, .35)); }
.slider--showcase .slider-ui { align-items: center; }
.slider--showcase .slider-dots { justify-content: center; gap: .7rem; }
.slider--showcase .slider-dots .dot { flex: 0 0 auto; max-width: none; width: clamp(64px, 8vw, 104px); opacity: .55; padding: 0; position: relative; transition: opacity .3s, transform .4s var(--ease-out); }
.slider--showcase .slider-dots .dot.is-active { opacity: 1; transform: translateY(-6px); }
.slider--showcase .dot-thumb { display: block; aspect-ratio: 16 / 10; border-radius: 12px; overflow: hidden; border: 2px solid rgba(255, 255, 255, .25); transition: border-color .3s; }
.slider--showcase .dot.is-active .dot-thumb { border-color: var(--accent); }
.slider--showcase .dot-thumb img, .slider--showcase .dot-thumb > span { width: 100%; height: 100%; object-fit: cover; display: block; }
.slider--showcase .dot-thumb .art-0 { background: linear-gradient(135deg, var(--deep), var(--brand)); }
.slider--showcase .dot-thumb .art-1 { background: linear-gradient(135deg, #0a3e49, var(--brand-2)); }
.slider--showcase .dot-thumb .art-2 { background: linear-gradient(135deg, var(--deep), color-mix(in srgb, var(--accent) 45%, var(--brand))); }
.slider--showcase .dot-thumb .art-3 { background: linear-gradient(160deg, var(--ink), var(--brand)); }
.slider--showcase .dot-bar { margin-top: .45rem; }
.slider--showcase .dot-label { display: none; }

/* ---------------------------------------------------------------- الجوال */
@media (max-width: 760px) {
  .slider--split .slide-bg, html[dir="rtl"] .slider--split .slide-bg { inset: 0 0 52% 0; clip-path: polygon(0 0, 100% 0, 100% 88%, 0 100%); }
  .slider--split .slide.is-active .slide-bg, html[dir="rtl"] .slider--split .slide.is-active .slide-bg { animation-name: split-in-m; }
  @keyframes split-in-m { from { clip-path: polygon(0 0, 100% 0, 100% 0, 0 0); } to { clip-path: polygon(0 0, 100% 0, 100% 88%, 0 100%); } }
  .slider--split .slide-shade, html[dir="ltr"] .slider--split .slide-shade { inset: 0 0 52% 0; }
  .slider--split .slide-content > *, .slider--split .slider-ui { max-width: none; width: auto; }
  .slider--split .slider-ui { margin-inline: var(--gutter); }
  .slider--split .slide::after { bottom: auto; top: 40%; font-size: 5rem; }

  .slider--coverflow .slide-bg, html[dir="rtl"] .slider--coverflow .slide-bg { --step: 34vw; top: calc(var(--header-h) + 1rem); inset-inline-end: 50%; width: 58vw; aspect-ratio: 4 / 4.4; margin-inline-end: -29vw; transform: translateX(calc(var(--off, 0) * var(--step))) scale(calc(1 - var(--abs, 0) * .14)) rotateY(calc(var(--off, 0) * -24deg)); }
  html[dir="ltr"] .slider--coverflow .slide-bg { transform: translateX(calc(var(--off, 0) * var(--step) * -1)) scale(calc(1 - var(--abs, 0) * .14)) rotateY(calc(var(--off, 0) * 24deg)); }
  .slider--coverflow .slide-content > * { max-width: none; }
  .slider--coverflow .slide-title { font-size: clamp(1.7rem, 7vw, 2.3rem); }
  .slider--coverflow .slide-shade, html[dir="ltr"] .slider--coverflow .slide-shade { background: linear-gradient(0deg, rgba(3, 26, 32, .95) 35%, transparent 70%); }

  .slider--cinema .slide-content { padding-bottom: 6.5rem; justify-content: center; }
  .slider--showcase .slide-content { padding-bottom: 8.5rem; }
  .slider--showcase .slider-arrows { display: none; }
  .slider--showcase .slider-dots .dot { width: 58px; }
}

/* تقليل الحركة: نُبقي الانتقال بسيطاً */
@media (prefers-reduced-motion: reduce) {
  .slider[class*="slider--"] .slide.is-active .slide-bg,
  .slider[class*="slider--"] .strip,
  .slider--cinema .slide-title .w { animation: none !important; opacity: 1; transform: none; filter: none; clip-path: none; }
  .slider--shutters .slide.is-active .slide-bg > img { opacity: 1; animation: none; }
  .slider--coverflow .slide-bg { transition: none; }
}

/* الشريحة المغادرة في قالب الستائر تبقى ظاهرة تحت الستائر الجديدة */
.slider--shutters .slide.is-leaving .slide-bg > img { opacity: 1; }
.slider--shutters .slide.is-leaving .strips { visibility: hidden; }

/* النصوص الطويلة (شرائح المشاريع) لا تتجاوز ثلاثة أسطر في القوالب التي يجاور فيها النص الصورة */
.slider--split .slide-text, .slider--coverflow .slide-text, .slider--showcase .slide-text, .slider--cinema .slide-text { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; }
