/* ZFLUENT — home "Course Categories" section (premium dark, animated pattern bg, glass cards).
   Self-contained. Scoped under .zf-cats. RTL via logical props. Respects prefers-reduced-motion. */

.zf-cats{
  position:relative;overflow:hidden;padding:96px 0 100px;isolation:isolate;
  background:radial-gradient(1200px 600px at 15% -10%, #241a4a 0%, transparent 55%),
             radial-gradient(1000px 700px at 90% 110%, #2a1d55 0%, transparent 50%),
             linear-gradient(160deg,#0c0a1c 0%,#12102b 55%,#0c0a1c 100%);
  color:#fff;
}

/* ---- Animated background layers ---- */
.zf-cats__bg{position:absolute;inset:0;z-index:-1;pointer-events:none;}
/* dotted grid */
.zf-cats__bg::before{
  content:'';position:absolute;inset:0;opacity:.5;
  background-image:radial-gradient(rgba(255,255,255,.08) 1px, transparent 1px);
  background-size:26px 26px;
  -webkit-mask-image:radial-gradient(ellipse 80% 70% at 50% 40%, #000 40%, transparent 100%);
  mask-image:radial-gradient(ellipse 80% 70% at 50% 40%, #000 40%, transparent 100%);
}
/* drifting colored blobs */
.zf-cats__blob{position:absolute;border-radius:50%;filter:blur(70px);opacity:.5;will-change:transform;}
.zf-cats__blob--1{width:420px;height:420px;top:-120px;inset-inline-start:-80px;
  background:radial-gradient(circle,#7a3ff2,transparent 68%);animation:zfDrift1 18s ease-in-out infinite;}
.zf-cats__blob--2{width:360px;height:360px;bottom:-100px;inset-inline-end:-60px;
  background:radial-gradient(circle,#a855f7,transparent 66%);animation:zfDrift2 22s ease-in-out infinite;}
.zf-cats__blob--3{width:300px;height:300px;top:40%;inset-inline-start:60%;
  background:radial-gradient(circle,#4f7cff,transparent 68%);opacity:.35;animation:zfDrift3 26s ease-in-out infinite;}
@keyframes zfDrift1{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(60px,50px) scale(1.12)}}
@keyframes zfDrift2{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-50px,-40px) scale(1.15)}}
@keyframes zfDrift3{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-40px,60px) scale(.9)}}

/* ---- Section header ---- */
.zf-cats__head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap;margin-bottom:52px;}
.zf-cats__eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:13px;font-weight:800;letter-spacing:.14em;
  text-transform:uppercase;color:#c9b8ff;margin-bottom:16px;}
.zf-cats__eyebrow::before{content:'';width:28px;height:2px;border-radius:2px;background:linear-gradient(90deg,#7a3ff2,#a855f7);}
.zf-cats__title{font-size:clamp(28px,3.4vw,44px);font-weight:900;line-height:1.12;letter-spacing:-.02em;margin:0;color:#fff;}
.zf-cats__title .fm-sec,.zf-cats__title em{font-style:normal;
  background:linear-gradient(120deg,#a855f7,#7a3ff2 50%,#4f7cff);-webkit-background-clip:text;background-clip:text;color:transparent;}
.zf-cats__cta{display:inline-flex;align-items:center;gap:9px;padding:13px 24px;border-radius:40px;flex:0 0 auto;
  font-size:14px;font-weight:800;color:#fff;white-space:nowrap;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.18);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);transition:.2s;}
.zf-cats__cta:hover{background:linear-gradient(135deg,#7a3ff2,#a855f7);border-color:transparent;color:#fff;transform:translateY(-2px);box-shadow:0 12px 26px rgba(122,63,242,.45);}
.zf-cats__cta i{transition:transform .2s;}
[dir="rtl"] .zf-cats__cta i{transform:scaleX(-1);}
.zf-cats__cta:hover i{transform:translateX(3px);}
[dir="rtl"] .zf-cats__cta:hover i{transform:scaleX(-1) translateX(3px);}

/* ---- Grid ---- */
.zf-cats__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
@media (max-width:991px){.zf-cats__grid{grid-template-columns:repeat(2,1fr);}}
@media (max-width:575px){.zf-cats__grid{grid-template-columns:1fr;}}

/* ---- Card ----
   Every card is the same skeleton: head (glyph + rating) → title → stats → foot (price + arrow).
   Rows are pinned so titles, stats and prices line up across the grid even when a card
   carries fewer stats than its neighbour. --accent is set per subject from the server. */
.zf-cat{
  --accent:#7a3ff2;
  position:relative;display:grid;grid-template-rows:auto auto 1fr auto;
  padding:24px 22px 18px;border-radius:22px;overflow:hidden;
  background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.03));
  border:1px solid rgba(255,255,255,.1);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  box-shadow:0 10px 30px rgba(0,0,0,.28);
  transition:transform .35s cubic-bezier(.2,.7,.3,1), border-color .35s, box-shadow .35s;
  /* scroll-reveal start state */
  opacity:0;transform:translateY(26px);
}
.zf-cats.is-in .zf-cat{opacity:1;transform:translateY(0);
  transition:transform .6s cubic-bezier(.2,.7,.3,1) calc(var(--i,0)*90ms), opacity .6s ease calc(var(--i,0)*90ms), border-color .35s, box-shadow .35s;}
.zf-cat::before{content:'';position:absolute;inset:0;border-radius:inherit;padding:1px;pointer-events:none;z-index:1;
  background:linear-gradient(140deg,var(--accent),transparent 45%,transparent 60%,rgba(255,255,255,.35));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;
  opacity:0;transition:opacity .35s;}
.zf-cat:hover{transform:translateY(-8px);border-color:rgba(168,85,247,.35);
  border-color:color-mix(in srgb,var(--accent) 45%,transparent);
  box-shadow:0 22px 50px rgba(0,0,0,.4);}
.zf-cat:hover::before{opacity:1;}

/* whole-card click target — sits under the real links so they stay individually focusable */
.zf-cat__link{position:absolute;inset:0;z-index:2;border-radius:inherit;}
.zf-cat__title a,.zf-cat__arrow{position:relative;z-index:3;}

/* accent glow, tinted per subject */
.zf-cat__glow{position:absolute;top:-45%;inset-inline-end:-25%;width:230px;height:230px;pointer-events:none;
  background:radial-gradient(circle,var(--accent),transparent 68%);opacity:.32;transition:opacity .35s;}
.zf-cat:hover .zf-cat__glow{opacity:.6;}

/* head: glyph + rating on one baseline */
.zf-cat__head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px;}
.zf-cat__media{width:58px;height:58px;flex:0 0 58px;border-radius:16px;
  display:flex;align-items:center;justify-content:center;font-size:28px;line-height:1;
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);
  background:color-mix(in srgb,var(--accent) 22%,transparent);
  border:1px solid color-mix(in srgb,var(--accent) 40%,transparent);
  color:#fff;font-weight:900;transition:transform .4s ease,box-shadow .35s;}
.zf-cat:hover .zf-cat__media{transform:translateY(-2px) scale(1.06);
  box-shadow:0 10px 24px color-mix(in srgb,var(--accent) 45%,transparent);}

/* rating badge — real average, or an honest "New" when nobody has reviewed yet */
.zf-cat__rating{display:inline-flex;align-items:center;gap:6px;padding:6px 11px;border-radius:30px;
  font-size:12.5px;font-weight:800;color:#fff;white-space:nowrap;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);}
.zf-cat__rating i{font-size:11px;color:#ffc24b;}
.zf-cat__rating small{font-weight:700;color:rgba(255,255,255,.55);font-size:11.5px;}
.zf-cat__rating--new{color:rgba(255,255,255,.7);font-weight:700;letter-spacing:.04em;text-transform:uppercase;font-size:11px;}

/* title */
.zf-cat__title{margin:0 0 14px;font-size:20px;font-weight:800;letter-spacing:-.01em;line-height:1.25;}
.zf-cat__title a{color:#fff;transition:color .2s;}
.zf-cat:hover .zf-cat__title a{color:#c9b8ff;}

/* stats — one per row so numbers align down the column instead of wrapping raggedly */
.zf-cat__stats{display:flex;flex-direction:column;align-items:flex-start;gap:9px;
  margin:0 0 18px;padding:0;list-style:none;}
.zf-cat__stats li{display:inline-flex;align-items:center;gap:9px;font-size:13px;font-weight:700;color:rgba(255,255,255,.78);}
.zf-cat__stats i{font-size:13px;width:16px;text-align:center;color:var(--accent);filter:brightness(1.5);}

/* foot: entry price + arrow, pinned to the bottom of every card */
.zf-cat__foot{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding-top:16px;border-top:1px solid rgba(255,255,255,.08);}
.zf-cat__price{display:inline-flex;align-items:baseline;gap:5px;font-size:19px;font-weight:900;color:#fff;line-height:1;}
.zf-cat__price small{font-size:12px;font-weight:700;color:rgba(255,255,255,.55);}
.zf-cat__arrow{width:38px;height:38px;flex:0 0 38px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);color:#fff;font-size:13px;transition:.25s;}
[dir="rtl"] .zf-cat__arrow i{transform:scaleX(-1);}
.zf-cat:hover .zf-cat__arrow{background:var(--accent);border-color:transparent;transform:translateX(3px);
  box-shadow:0 8px 18px color-mix(in srgb,var(--accent) 55%,transparent);}
[dir="rtl"] .zf-cat:hover .zf-cat__arrow{transform:translateX(-3px);}

/* reduced motion */
@media (prefers-reduced-motion:reduce){
  .zf-cats__blob{animation:none;}
  .zf-cat{opacity:1!important;transform:none!important;transition:border-color .3s,box-shadow .3s;}
}

/* =====================================================================
   HOME SKIN — unify every section to the purple-glass system.
   Scoped to body.zf-home so inner pages keep the stock theme.
   Re-skins existing theme classes (visual props only; layout untouched).
   ===================================================================== */
.zf-home{--a:#7a3ff2;--a2:#a855f7;--a3:#4f7cff;
  background:linear-gradient(180deg,#ffffff 0%,#faf8ff 100%);}

/* ---- Shared: section eyebrows + gradient title accents ---- */
.zf-home .section-title h6,
.zf-home .heading h6,
.zf-home .testimonials_text_block h6{
  color:var(--a)!important;font-weight:800!important;letter-spacing:.14em!important;text-transform:uppercase;font-size:13px!important;}
.zf-home h1 .fm-sec,
.zf-home h2 .fm-sec{
  background:linear-gradient(120deg,var(--a2),var(--a) 55%,var(--a3));
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;}

/* ---- Shared: buttons (educate-btn → premium gradient pill) ---- */
.zf-home .educate-btn{position:relative;display:inline-flex;align-items:center;gap:8px;
  padding:13px 26px;border-radius:40px;border:0;overflow:visible;
  background:linear-gradient(135deg,var(--a),var(--a2));color:#fff!important;
  font-weight:800;font-size:14px;line-height:1;box-shadow:0 10px 24px rgba(122,63,242,.32);transition:.22s;}
.zf-home .educate-btn:hover{transform:translateY(-2px);box-shadow:0 16px 32px rgba(122,63,242,.48);color:#fff!important;}
.zf-home .educate-btn.sec{background:linear-gradient(135deg,#12122e,#2a1d55);box-shadow:0 10px 24px rgba(18,18,46,.3);}
.zf-home .educate-btn.sm{padding:10px 20px;font-size:13px;}
.zf-home .educate-btn__curve{display:none!important;}
.zf-home .educate-btn::before,.zf-home .educate-btn::after{display:none!important;content:none!important;}
.zf-home .educate_link_btn{color:var(--a)!important;font-weight:800;transition:.2s;}
.zf-home .educate_link_btn:hover{color:var(--a2)!important;gap:6px;}

/* ---- Reveal helper for skinned cards ---- */
.zf-home .zf-up{opacity:0;transform:translateY(24px);
  transition:opacity .6s ease,transform .6s cubic-bezier(.2,.7,.3,1);}
.zf-home .is-in .zf-up,.zf-home .zf-up.is-in{opacity:1;transform:translateY(0);}

/* ---- Features ---- */
.zf-home .feature__card{position:relative;height:100%;overflow:hidden;
  background:#fff;border:1px solid rgba(23,21,37,.07);border-radius:20px;padding:28px 24px;
  box-shadow:0 10px 30px rgba(23,21,37,.06);transition:transform .3s,border-color .3s,box-shadow .3s;}
.zf-home .feature__card:hover{transform:translateY(-6px);border-color:rgba(122,63,242,.25);box-shadow:0 22px 46px rgba(122,63,242,.16);}
.zf-home .feature__icon{width:64px;height:64px;border-radius:16px;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,#f3eefe,#faf5ff);border:1px solid rgba(122,63,242,.14);margin-bottom:18px;transition:.3s;}
.zf-home .feature__icon img{width:32px;height:32px;object-fit:contain;transition:.3s;}
.zf-home .feature__card:hover .feature__icon{background:linear-gradient(135deg,var(--a),var(--a2));border-color:transparent;box-shadow:0 8px 18px rgba(122,63,242,.4);}
.zf-home .feature__card:hover .feature__icon img{filter:brightness(0) invert(1);}
.zf-home .feature__content h5{font-weight:800;letter-spacing:-.01em;}

/* ---- About cards ---- */
.zf-home .about__card{display:flex;gap:14px;align-items:flex-start;
  background:#fff;border:1px solid rgba(23,21,37,.07);border-radius:16px;padding:18px;
  box-shadow:0 8px 22px rgba(23,21,37,.05);transition:transform .3s,border-color .3s,box-shadow .3s;}
.zf-home .about__card:hover{transform:translateX(5px);border-color:rgba(122,63,242,.25);box-shadow:0 14px 30px rgba(122,63,242,.12);}
html[dir="rtl"] .zf-home .about__card:hover{transform:translateX(-5px);}
.zf-home .about__card__icon{width:54px;height:54px;flex:0 0 54px;border-radius:13px;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,#f3eefe,#faf5ff);border:1px solid rgba(122,63,242,.12);}
.zf-home .about__card__icon img{width:28px;height:28px;object-fit:contain;}

/* ---- Brands ---- */
.zf-home .brands-slider .brand img{filter:grayscale(1);opacity:.45;transition:.3s;}
.zf-home .brands-slider .brand:hover img{filter:none;opacity:1;}

/* ---- Course cards (static slider) ---- */
.zf-home .course__card{position:relative;overflow:hidden;
  background:#fff;border:1px solid rgba(23,21,37,.07);border-radius:22px;
  box-shadow:0 12px 34px rgba(23,21,37,.07);transition:transform .3s,border-color .3s,box-shadow .3s;}
.zf-home .course__card:hover{transform:translateY(-6px);border-color:rgba(122,63,242,.22);box-shadow:0 24px 52px rgba(122,63,242,.16);}
.zf-home .course__card__icon{transition:transform .35s;}
.zf-home .course__card:hover .course__card__icon{transform:scale(1.08) rotate(-4deg);}
.zf-home .course__card h4 a{font-weight:800;letter-spacing:-.01em;transition:color .2s;}
.zf-home .course__card h4 a:hover{color:var(--a);}
.zf-home .course_tag{border-radius:8px;}

/* ---- Team cards: content always visible, hover effect OUTSIDE the card (no cover) ---- */
.zf-home .team__card{border-radius:20px;padding:14px;background:transparent;
  transition:transform .35s cubic-bezier(.2,.7,.3,1),box-shadow .35s;}
.zf-home .team__card:hover{transform:translateY(-8px);}
/* image: fixed frame, subtle zoom on hover (clipped to its own rounded box) */
.zf-home .team__card .team__img_block{position:relative;overflow:hidden;border-radius:16px;}
.zf-home .team__card .team__img_block .team_img{width:100%;border-radius:16px;transition:transform .5s ease;}
.zf-home .team__card:hover .team__img_block .team_img{transform:scale(1.06);}
/* content: pull it OUT below the image as a static floating card — no absolute overlay */
.zf-home .team__card .team__content_block{
  position:relative!important;bottom:auto!important;top:auto!important;left:auto;right:auto;
  height:auto!important;margin:-46px 12px 0!important;padding:0;display:block!important;
  background:#fff;border:1px solid rgba(23,21,37,.07);border-radius:16px;
  box-shadow:0 14px 34px rgba(23,21,37,.12);backdrop-filter:none;-webkit-backdrop-filter:none;
  transition:box-shadow .35s,transform .35s;overflow:visible;}
.zf-home .team__card:hover .team__content_block{
  height:auto!important;align-content:normal!important;
  box-shadow:0 22px 46px rgba(122,63,242,.22);border-color:rgba(122,63,242,.25);}
.zf-home .team__card .team__content_block .team__text_block{padding:18px 16px!important;overflow:visible!important;align-content:normal!important;}
/* kill the theme's cover-fill animation */
.zf-home .team__card .text_block_bg_shape{display:none!important;}
/* keep the button always visible + on-brand */
.zf-home .team__card .team__content_block .educate-btn{margin-top:6px;}
.zf-home .team__info li{font-weight:700;justify-content:center;}
.zf-home .team__info .fa-star{color:#ffc24b;}
.zf-home .team__info li i{color:var(--a);}

/* ---- Discount banner (premium dark w/ pattern) ---- */
.zf-home .discount_banner{position:relative;overflow:hidden;border-radius:32px;margin:24px auto;padding:56px 0;isolation:isolate;
  background:radial-gradient(600px 400px at 12% 0%,rgba(122,63,242,.5),transparent 60%),
            radial-gradient(600px 400px at 100% 100%,rgba(79,124,255,.4),transparent 55%),
            linear-gradient(150deg,#0e0c22,#1c1740 60%,#0e0c22);color:#fff;}
.zf-home .discount_banner::before{content:'';position:absolute;inset:0;z-index:-1;opacity:.4;
  background-image:radial-gradient(rgba(255,255,255,.09) 1px,transparent 1px);background-size:24px 24px;
  -webkit-mask-image:radial-gradient(ellipse 70% 80% at 50% 50%,#000 40%,transparent);mask-image:radial-gradient(ellipse 70% 80% at 50% 50%,#000 40%,transparent);}
.zf-home .discount_banner .title,
.zf-home .discount_banner h2,
.zf-home .discount_banner h4,
.zf-home .discount_banner p{color:#fff;}
.zf-home .discount_banner .countdown h2{color:#fff;}
.zf-home .discount_banner .countdown h6{color:rgba(255,255,255,.7);}

/* ---- Testimonials ---- */
.zf-home .testimonial_card{background:#fff;border:1px solid rgba(23,21,37,.07);border-radius:24px;
  box-shadow:0 16px 44px rgba(23,21,37,.1);transition:transform .35s,box-shadow .35s;overflow:hidden;}
.zf-home .testimonial_card:hover{transform:translateY(-4px);box-shadow:0 24px 56px rgba(122,63,242,.16);}
.zf-home .testimonial .fa-star{color:#ffc24b;}
.zf-home .quote_mark{fill:rgba(122,63,242,.14);}

/* ---- Blogs ---- */
.zf-home .blog_card{position:relative;overflow:hidden;
  background:#fff;border:1px solid rgba(23,21,37,.07);border-radius:22px;
  box-shadow:0 12px 32px rgba(23,21,37,.07);transition:transform .3s,border-color .3s,box-shadow .3s;height:100%;}
.zf-home .blog_card:hover{transform:translateY(-6px);border-color:rgba(122,63,242,.22);box-shadow:0 22px 50px rgba(122,63,242,.15);}
.zf-home .blog_card_img_block{overflow:hidden;}
.zf-home .blog_card_img_block img{transition:transform .5s ease;width:100%;}
.zf-home .blog_card:hover .blog_card_img_block img{transform:scale(1.07);}
.zf-home .blog_card .date{background:linear-gradient(135deg,var(--a),var(--a2));color:#fff;border-radius:30px;font-weight:800;}
.zf-home .blog_title{font-weight:800;letter-spacing:-.01em;transition:color .2s;}
.zf-home .blog_title:hover{color:var(--a);}

/* ---- Contact banner (premium gradient w/ pattern) ---- */
.zf-home .contact_banner{position:relative;overflow:hidden;border-radius:32px;isolation:isolate;
  background:radial-gradient(600px 400px at 100% 0%,rgba(168,85,247,.55),transparent 55%),
            linear-gradient(135deg,#7a3ff2,#5a34d6 55%,#4f7cff);}
.zf-home .contact_banner::after{content:'';position:absolute;inset:0;z-index:-1;opacity:.35;
  background-image:radial-gradient(rgba(255,255,255,.14) 1px,transparent 1px);background-size:26px 26px;}
.zf-home .contact_banner .phone_number{color:#fff;font-weight:900;transition:.2s;}
.zf-home .contact_banner .phone_number:hover{opacity:.85;}