/* ==========================================================================
   3D Coverflow Carousel  —  صفحة "خدماتنا مقترح2" (post 4439)
   منقول حرفياً عن مكوّن 21st.dev: نفس المعادلات والإزاحات والمنحنيات.
   البدائل اللونية فقط: #0c0a09/#171311 -> #551C3D ، #c5a880 -> #EC7676 ،
   #f3f0ea -> #F5E1E0 ، وكل ظلال الأسود -> rgba(85,28,61,a).
   ========================================================================== */

/* ---------- الخطوط: تعريف يدوي (إليمنتور لا يطبع thmanyah إلا عند استخدامه) ---------- */
@font-face{font-family:'thmanyah display';font-style:normal;font-weight:300;font-display:swap;src:url('https://alrweaa.com/wp-content/uploads/2026/08/thmanyahserifdisplay-Light.woff2') format('woff2')}
@font-face{font-family:'thmanyah display';font-style:normal;font-weight:400;font-display:swap;src:url('https://alrweaa.com/wp-content/uploads/2026/08/thmanyahserifdisplay-Regular.woff2') format('woff2')}
@font-face{font-family:'thmanyah display';font-style:normal;font-weight:500;font-display:swap;src:url('https://alrweaa.com/wp-content/uploads/2026/08/thmanyahserifdisplay-Medium.woff2') format('woff2')}
@font-face{font-family:'thmanyah display';font-style:normal;font-weight:600;font-display:swap;src:url('https://alrweaa.com/wp-content/uploads/2026/08/thmanyahserifdisplay-Bold.woff2') format('woff2')}
@font-face{font-family:'thmanyah display';font-style:normal;font-weight:800;font-display:swap;src:url('https://alrweaa.com/wp-content/uploads/2026/08/thmanyahserifdisplay-Black.woff2') format('woff2')}

/* ---------- الجذر ---------- */
/* ---------- الجوال: القسم يملأ عرض الشاشة ----------
   Astra يفرض padding:0 20px على .ast-container — يُلغى لهذه الصفحة وحدها */
@media (max-width:767px){
  body.page-id-4439 .ast-container{padding-left:0 !important;padding-right:0 !important;max-width:100% !important;}
}

.cf-root{
  --cf-primary:#551C3D;
  --cf-accent:#EC7676;
  --cf-soft:#F5E1E0;
  --cf-white:#FFFFFF;
  --cf-bg:#3A132A;   /* الخلفية الأغمق — بطلب العميل */
  --cf-d:58,19,42;   /* #3A132A — خلفية حاوية البطاقات والتدرجات */

  --cf-x1:285px;   /* إزاحة البطاقة المجاورة  (الأصل) */
  --cf-x2:510px;   /* إزاحة البطاقة الثانية   (الأصل) */
  --cf-card-w:330px;
  --cf-card-h:500px;
  --cf-stage-h:520px;

  --width:100%;
  --content-width:100%;

  position:relative !important;
  display:flex !important;
  width:100% !important;
  max-width:none !important;
  min-height:760px !important;
  height:auto !important;
  align-items:center !important;
  justify-content:center !important;
  overflow:hidden !important;
  padding:48px 0 !important;
  margin:0 !important;
  background-color:var(--cf-bg);
  color:var(--cf-white);
  font-family:'Cairo',system-ui,-apple-system,sans-serif;
  direction:rtl;
  text-align:center;
  isolation:isolate;
  -webkit-user-select:none;user-select:none;
}

/* ---------- خلفية الأجواء ---------- */
.cf-root .cf-bg{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  overflow:hidden !important;
  pointer-events:none;
  z-index:0;
  padding:0 !important;margin:0 !important;
}
.cf-root .cf-bg-img{
  display:block;width:100%;height:100%;object-fit:cover;
  filter:brightness(.22) blur(32px);
  transform:scale(1.15);
  transition:opacity 1000ms ease, filter 1000ms ease;
}
.cf-root .cf-bg-veil{
  position:absolute;inset:0;
  background:radial-gradient(circle at center, rgba(var(--cf-d),.30) 0%, rgba(var(--cf-d),.92) 100%);
}

/* ---------- الغلاف الداخلي ---------- */
.cf-root .cf-inner{
  position:relative !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  width:100% !important;
  max-width:1152px !important;
  height:auto !important;
  margin:0 auto !important;
  padding:0 16px !important;
  z-index:10;
}

/* ---------- العنوان العلوي ---------- */
.cf-root .cf-eyebrow{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:12px !important;
  width:auto !important;height:auto !important;
  margin:0 0 32px !important;padding:0 !important;
}
.cf-root .cf-eyebrow::before,
.cf-root .cf-eyebrow::after{content:"";flex:0 0 36px;width:36px;height:1px;}
.cf-root .cf-eyebrow::before{background:linear-gradient(90deg,transparent,var(--cf-accent));}
.cf-root .cf-eyebrow::after{background:linear-gradient(90deg,var(--cf-accent),transparent);}
.cf-root .cf-eyebrow-t{
  font-family:'Cairo',sans-serif !important;
  font-size:.8rem !important;font-weight:700 !important;
  letter-spacing:normal !important;line-height:1.7 !important;
  color:var(--cf-accent) !important;margin:0 !important;padding:0 !important;
}

/* ---------- المسرح ثلاثي الأبعاد ---------- */
.cf-root .cf-stage{
  position:relative !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:100% !important;
  height:var(--cf-stage-h) !important;
  margin:0 0 32px !important;padding:0 !important;
  perspective:1400px;
}

/* ---------- البطاقة ---------- */
.cf-root .cf-card{
  --x:0px;--s:.4;--r:0deg;
  position:absolute;
  width:var(--cf-card-w);
  height:var(--cf-card-h);
  border-radius:18px;
  overflow:hidden;
  background-color:var(--cf-bg);
  border:1px solid rgba(255,255,255,.12);
  transform-origin:center center;
  transform:translateX(var(--x)) scale(var(--s)) rotateY(var(--r));
  opacity:0;z-index:0;
  filter:brightness(.4) blur(2px);
  box-shadow:0 15px 35px rgba(var(--cf-d),.5);
  cursor:pointer;
  transition:transform 800ms cubic-bezier(.25,1,.5,1),
             opacity   800ms cubic-bezier(.25,1,.5,1),
             filter    800ms cubic-bezier(.25,1,.5,1),
             box-shadow 800ms cubic-bezier(.25,1,.5,1);
  will-change:transform,opacity;
}
.cf-root .cf-card.is-c { --x:0px;              --s:1;   --r:0deg;   opacity:1;   z-index:30; filter:brightness(1);                  cursor:default;
  box-shadow:0 25px 60px rgba(var(--cf-d),.9), 0 0 35px rgba(236,118,118,.25);}
.cf-root .cf-card.is-n1{ --x:var(--cf-x1);     --s:.84; --r:-24deg; opacity:.65; z-index:20; filter:brightness(.75);}
.cf-root .cf-card.is-n2{ --x:var(--cf-x2);     --s:.68; --r:-38deg; opacity:.38; z-index:10; filter:brightness(.55) blur(1px);}
.cf-root .cf-card.is-p1{ --x:calc(var(--cf-x1) * -1); --s:.84; --r:24deg; opacity:.65; z-index:20; filter:brightness(.75);}
.cf-root .cf-card.is-p2{ --x:calc(var(--cf-x2) * -1); --s:.68; --r:38deg; opacity:.38; z-index:10; filter:brightness(.55) blur(1px);}

/* صورة البطاقة */
.cf-root .cf-card-img{position:absolute !important;inset:0 !important;width:100% !important;height:100% !important;margin:0 !important;padding:0 !important;display:block !important;}
img.cf-card-img,
.cf-root .cf-card-img img{width:100% !important;height:100% !important;object-fit:cover !important;display:block !important;border-radius:0 !important;}

/* التعتيم المتدرّج */
.cf-root .cf-vignette{
  position:absolute;inset:0;z-index:10;pointer-events:none;
  background:linear-gradient(180deg,
    rgba(var(--cf-d),.40) 0%,
    rgba(var(--cf-d),.10) 25%,
    rgba(var(--cf-d),.68) 60%,
    rgba(var(--cf-d),.96) 100%);
}

/* محتوى البطاقة */
.cf-root .cf-content{
  position:relative;width:100%;height:100%;
  padding:20px 18px 22px;
  display:flex;flex-direction:column;justify-content:space-between;
  text-align:center;z-index:20;
  opacity:0;transform:translateY(16px);pointer-events:none;
  transition:opacity 500ms ease, transform 500ms ease;
}
.cf-root .cf-card.is-c .cf-content{opacity:1;transform:translateY(0);pointer-events:auto;}

.cf-root .cf-tag-wrap{width:100%;text-align:right;padding-inline-end:4px;}
.cf-root .cf-tag{
  display:inline-block;
  font-family:'Cairo',sans-serif !important;
  font-size:.78rem !important;font-weight:600 !important;
  letter-spacing:normal !important;
  color:rgba(255,255,255,.9) !important;
  text-shadow:0 2px 6px rgba(var(--cf-d),.8);
  margin:0 !important;padding:0 !important;
}

.cf-root .cf-body{
  display:flex;flex-direction:column;align-items:center;
  gap:3px;margin-top:auto;padding-bottom:4px;
}
/* مطابق حرفياً لـ card-title-s في صفحة الخدمات (2052) */
.cf-root .cf-t1{
  /* الطباعة واللون انتقلا إلى الصنف العام «عناوين بطاقات الخدمات» في إليمنتور */
  letter-spacing:normal !important;
  margin:0 !important;padding:0 !important;
  text-shadow:0 3px 12px rgba(var(--cf-d),.95);
}
.cf-root .cf-rule{
  width:34px;height:2px;border-radius:2px;
  background-color:var(--cf-accent);
  margin:5px auto 4px;
  box-shadow:0 0 8px rgba(236,118,118,.7);
}
.cf-root .cf-desc{
  font-family:'Cairo',sans-serif !important;
  font-size:.82rem !important;font-weight:400 !important;font-style:normal !important;
  color:rgba(255,255,255,.9) !important;
  max-width:280px;margin:0 auto 10px !important;padding:0 !important;
  line-height:1.65 !important;
  text-shadow:0 2px 8px rgba(var(--cf-d),.9);
}
.cf-root .cf-cta{
  display:inline-flex !important;align-items:center;justify-content:center;gap:6px;
  padding:7px 18px !important;
  border:0 !important;border-radius:9999px !important;
  background:linear-gradient(135deg, var(--cf-accent) 0%, var(--cf-soft) 100%) !important;
  color:var(--cf-primary) !important;
  font-family:'Cairo',sans-serif !important;
  font-size:.72rem !important;font-weight:800 !important;
  letter-spacing:normal !important;line-height:1.6 !important;
  text-decoration:none !important;
  box-shadow:0 4px 14px rgba(var(--cf-d),.4), 0 0 15px rgba(236,118,118,.3);
  cursor:pointer;
  transition:transform 200ms ease, box-shadow 200ms ease;
}
.cf-root .cf-cta:hover{transform:translateY(-1px);box-shadow:0 6px 18px rgba(var(--cf-d),.5), 0 0 20px rgba(236,118,118,.45);}
.cf-root .cf-cta:focus-visible{outline:2px solid var(--cf-white);outline-offset:2px;}
.cf-root .cf-cta-ico{display:inline-flex;transform:scaleX(-1);} /* السهم يشير لليسار في RTL */

/* ---------- أزرار التنقّل ---------- */
.cf-root .cf-nav{
  position:absolute;top:50%;transform:translateY(-50%);
  width:46px;height:46px;border-radius:50%;
  background-color:rgba(var(--cf-d),.55);
  border:1px solid rgba(255,255,255,.2);
  color:var(--cf-white);
  display:flex;align-items:center;justify-content:center;
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  cursor:pointer;padding:0;
  box-shadow:0 8px 24px rgba(var(--cf-d),.4);
  z-index:40;
  transition:transform 200ms ease, background-color 200ms ease;
}
.cf-root .cf-nav:hover{background-color:rgba(var(--cf-d),.8);}
.cf-root .cf-nav:focus-visible{outline:2px solid var(--cf-accent);outline-offset:2px;}
.cf-root .cf-nav--prev{left:24px;}
.cf-root .cf-nav--next{right:24px;}
.cf-root .cf-nav svg{width:20px;height:20px;flex:0 0 20px;display:block;}

/* ---------- النقاط ---------- */
.cf-root .cf-dots{
  display:flex !important;align-items:center !important;justify-content:center !important;
  gap:8px !important;width:auto !important;height:auto !important;
  margin:0 !important;padding:0 !important;z-index:30;
}
.cf-root .cf-dot{
  height:8px;width:8px;border:0;padding:0;
  border-radius:9999px;
  background-color:rgba(255,255,255,.25);
  cursor:pointer;
  transition:width 300ms ease, background-color 300ms ease, box-shadow 300ms ease;
}
.cf-root .cf-dot.is-active{
  width:28px;background-color:var(--cf-accent);
  box-shadow:0 0 10px rgba(236,118,118,.7);
}
.cf-root .cf-dot:focus-visible{outline:2px solid var(--cf-white);outline-offset:2px;}

/* ---------- الحاوية المصدر (مخفية على الواجهة، ظاهرة في المحرر) ---------- */
body:not(.elementor-editor-active) .cf-root .cf-source{display:none !important;}
.elementor-editor-active .cf-root .cf-source{
  position:relative;z-index:50;width:100%;max-width:1152px;margin:24px auto 0;
  padding:16px;border:1px dashed rgba(255,255,255,.35);border-radius:12px;
}
.cf-root .cf-live{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}

/* ---------- التجاوب ---------- */
@media (max-width:1024px){
  .cf-root{--cf-x1:250px;--cf-x2:440px;--cf-card-w:300px;--cf-card-h:455px;--cf-stage-h:480px;min-height:700px !important;}
  .cf-root .cf-nav--prev{left:8px;}
  .cf-root .cf-nav--next{right:8px;}
}
@media (max-width:767px){
  .cf-root{--cf-x1:155px;--cf-x2:265px;--cf-card-w:240px;--cf-card-h:370px;--cf-stage-h:430px;min-height:600px !important;padding:36px 0 !important;}
  .cf-root .cf-content{padding:14px 13px 16px;}
  .cf-root .cf-desc{font-size:.75rem !important;max-width:200px;margin-bottom:8px !important;}
  .cf-root .cf-cta{padding:6px 14px !important;font-size:.68rem !important;}
  .cf-root .cf-nav{width:40px;height:40px;}
  .cf-root .cf-nav svg{width:17px;height:17px;flex:0 0 17px;}
  .cf-root .cf-nav--prev{left:2px;}
  .cf-root .cf-nav--next{right:2px;}
}

/* ---------- تقليل الحركة ---------- */
@media (prefers-reduced-motion:reduce){
  .cf-root .cf-card,
  .cf-root .cf-content,
  .cf-root .cf-bg-img,
  .cf-root .cf-dot,
  .cf-root .cf-cta,
  .cf-root .cf-nav{transition:none !important;}
  .cf-root .cf-card{filter:none !important;}
}
