/* =========================================================================
   premium.css — additive premium polish + animations for the homepage.
   Pure transform/opacity (GPU-accelerated, no layout reflow → no CLS hit).
   Loaded only on the homepage; safe to remove this file + its <link> to revert.
   ========================================================================= */

/* ---- easing tokens ---- */
:root{ --prem-ease:cubic-bezier(.22,.61,.36,1); }

/* ---------------------------------------------------------------
   1) Scroll reveal (class is added by premium.js only to off-screen
      elements, so above-the-fold content is never hidden → no FOUC)
   --------------------------------------------------------------- */
.js-anim .pa-reveal{
  opacity:0; transform:translateY(34px);
  transition:opacity .7s var(--prem-ease), transform .7s var(--prem-ease);
}
.js-anim .pa-reveal.pa-in{ opacity:1; transform:none; }
/* staggered children (steps / benefit blocks / video cards) */
.js-anim .pa-d1{transition-delay:.08s}
.js-anim .pa-d2{transition-delay:.16s}
.js-anim .pa-d3{transition-delay:.24s}
.js-anim .pa-d4{transition-delay:.32s}

/* respect users who prefer no motion */
@media (prefers-reduced-motion: reduce){
  .js-anim .pa-reveal{opacity:1 !important; transform:none !important; transition:none !important}
  .center_content h2,.center_content p,.search_in_banner{animation:none !important}
}

/* ---------------------------------------------------------------
   2) Premium course / book cards — lift, soft shadow, image zoom
   --------------------------------------------------------------- */
.course_sec .course_inner{
  border-radius:16px; overflow:hidden; background:#fff;
  box-shadow:0 4px 18px rgba(17,28,53,.07);
  transition:transform .38s var(--prem-ease), box-shadow .38s var(--prem-ease);
  /* NOTE: do NOT set height/position here — .button_sec is position:absolute;bottom:0
     anchored to this .course_inner, and the card relies on its original min-height:434px */
}
.course_sec .course_inner:hover{
  transform:translateY(-10px);
  box-shadow:0 22px 46px rgba(17,28,53,.16);
}
.course_sec .course_img{ overflow:hidden; }
.course_sec .course_img img{ transition:transform .6s var(--prem-ease); will-change:transform; backface-visibility:hidden; }
.course_sec .course_inner:hover .course_img img{ transform:scale(1.07); }

/* ---------------------------------------------------------------
   3) How-it-works steps & benefit blocks — gentle hover lift
   --------------------------------------------------------------- */
.step, .benifit_inner{
  transition:transform .35s var(--prem-ease), box-shadow .35s var(--prem-ease);
  border-radius:14px;
}
.step:hover, .benifit_inner:hover{
  transform:translateY(-7px);
  box-shadow:0 16px 34px rgba(17,28,53,.10);
}

/* ---------------------------------------------------------------
   4) Premium buttons — lift + soft brand shadow + shine sweep
   --------------------------------------------------------------- */
.hover_button, .view_all_button, .view_all_feedback, a.view_all_button{
  position:relative; overflow:hidden;
  transition:transform .25s var(--prem-ease), box-shadow .25s var(--prem-ease), filter .25s var(--prem-ease);
}
.hover_button:hover, .view_all_button:hover, .view_all_feedback:hover{
  transform:translateY(-3px);
  box-shadow:0 12px 26px rgba(249,87,91,.38);
  filter:brightness(1.04);
}
/* subtle light sweep across filled brand buttons on hover */
.view_all_button::after, .hover_button::after{
  content:""; position:absolute; top:0; left:-130%; width:60%; height:100%;
  background:linear-gradient(120deg,transparent,rgba(255,255,255,.45),transparent);
  transform:skewX(-20deg); transition:left .6s var(--prem-ease); pointer-events:none;
}
.view_all_button:hover::after, .hover_button:hover::after{ left:130%; }

/* ---------------------------------------------------------------
   5) Hero — refined entrance for the headline / tagline / search
      (transform+opacity only; the LCP is the slider image, the nav
      paints first, so FCP/LCP are unaffected)
   --------------------------------------------------------------- */
.center_content h2{ animation:premUp .9s var(--prem-ease) both; }
.center_content p{ animation:premUp .9s .12s var(--prem-ease) both; }
.center_content .search_in_banner{ animation:premUp .9s .24s var(--prem-ease) both; }
.center_content > ul{ animation:premUp .9s .36s var(--prem-ease) both; }
@keyframes premUp{ from{opacity:0; transform:translateY(26px)} to{opacity:1; transform:none} }

/* ---------------------------------------------------------------
   6) Social / contact icons in the top bar — playful hover
   --------------------------------------------------------------- */
.top_header_social a img, .header_social a img{
  transition:transform .3s var(--prem-ease);
}
.top_header_social a:hover img, .header_social a:hover img{ transform:translateY(-3px) scale(1.12); }

/* smoother default for links/icons that animate */
.common_heading h3{ transition:color .3s var(--prem-ease); }

/* ---------------------------------------------------------------
   7) Remaining sections — testimonials, top scorers, videos, stats
   --------------------------------------------------------------- */

/* ====== Premium testimonial cards ====== */
.feedback_slider .feed_design{
  border-radius:18px; overflow:hidden;
  border:1px solid rgba(17,28,53,.05);
  box-shadow:0 14px 40px rgba(17,28,53,.10);
  transition:transform .4s var(--prem-ease), box-shadow .4s var(--prem-ease);
}
.feedback_slider .item:hover .feed_design{
  transform:translateY(-10px); box-shadow:0 26px 56px rgba(17,28,53,.17);
}
.feedback_slider .pd_C{ background:linear-gradient(180deg,#fff 0%,#f8faff 100%); }
/* decorative quote watermark (bring the double-arrow img inside so overflow:hidden won't clip it) */
.feedback_slider .pd_C img[src*="double_arrow"]{
  top:18px !important; right:20px !important; width:50px !important;
  opacity:.14; filter:grayscale(1);
}
/* gold star rating */
.feedback_slider .star .fa-star{ color:#e3e6ef; font-size:16px; letter-spacing:3px; }
.feedback_slider .star .fa-star.checked{ color:#f3c150; }
/* avatar — circular with a soft ring */
.feedback_slider .ll img{
  border-radius:50%; height:77px; object-fit:cover;
  border:3px solid rgba(255,255,255,.75);
  box-shadow:0 4px 14px rgba(0,0,0,.18);
}
.feedback_slider .lr h3{ color:#fff; font-weight:700; letter-spacing:.3px; }

/* ====== Premium top-scorer cards ====== */
.topper_sec .toper_description_Sec{
  border-radius:16px;
  box-shadow:0 12px 30px rgba(0,0,0,.28);
  transition:transform .4s var(--prem-ease), box-shadow .4s var(--prem-ease);
}
.topper_sec .item:hover .toper_description_Sec{
  transform:translateY(-10px); box-shadow:0 24px 50px rgba(0,0,0,.42);
}
.topper_sec .toper_description_Sec img{ transition:transform .6s var(--prem-ease); }
.topper_sec .item:hover .toper_description_Sec img{ transform:scale(1.05); }
/* frosted-glass name band with a brand accent line */
.topper_sec .toper_name{
  background:rgba(255,255,255,.85);
  -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);
  border-top:3px solid #ff585c;
  box-shadow:0 -6px 18px rgba(0,0,0,.08);
}

/* =========================================================================
   8) Premium++ : richer accents for testimonials & top scorers
   ========================================================================= */

/* --- Testimonials: gradient top accent + softer branded quote + brand glow --- */
.feedback_slider .feed_design{ position:relative; }
.feedback_slider .feed_design::after{      /* slim gradient accent across the top */
  content:""; position:absolute; top:0; left:0; right:0; height:5px;
  background:linear-gradient(90deg,#ff585c 0%,#ff9d6e 100%); z-index:3;
}
.feedback_slider .pd_C img[src*="double_arrow"]{   /* soft brand-tinted quote watermark */
  filter:none !important; opacity:.12 !important; width:56px !important;
}
.feedback_slider .item:hover .feed_design{   /* warm brand-tinted lift glow */
  box-shadow:0 26px 56px rgba(255,88,92,.16), 0 12px 26px rgba(17,28,53,.12);
}

/* --- Top scorers: gold "winner" treatment --- */
.topper_sec .toper_name{ border-top:none; }            /* replace pink line with gold below */
.topper_sec .toper_name::before{
  content:""; position:absolute; top:0; left:0; right:0; height:3px;
  background:linear-gradient(90deg,#bf953f,#fcf6ba,#bf953f);
}
.topper_sec .toper_description_Sec::after{             /* small gold medal star, top-right */
  content:"\2605"; position:absolute; top:12px; right:12px; z-index:4;
  width:34px; height:34px; line-height:34px; text-align:center;
  border-radius:50%; font-size:15px; color:#6b4e00;
  background:linear-gradient(145deg,#fcf6ba,#d4af37);
  box-shadow:0 3px 10px rgba(0,0,0,.32);
}
.topper_sec .item:hover .toper_description_Sec{        /* gold ring + deeper lift */
  box-shadow:0 24px 50px rgba(0,0,0,.42), 0 0 0 2px rgba(212,175,55,.55);
}

/* Recent-video cards — lift + shadow + thumbnail zoom + play-button glow */
.video_inner{
  border-radius:14px; overflow:hidden;
  transition:transform .35s var(--prem-ease), box-shadow .35s var(--prem-ease);
}
.video_inner:hover{ transform:translateY(-8px); box-shadow:0 18px 40px rgba(17,28,53,.18); }
.video_inner > img{ transition:transform .6s var(--prem-ease); }
.video_inner:hover > img{ transform:scale(1.06); }
.video_inner .play_button{ transition:box-shadow .3s var(--prem-ease), filter .3s var(--prem-ease); }
.video_inner:hover .play_button{ box-shadow:0 0 0 10px rgba(249,87,91,.22); filter:brightness(1.05); }

/* "Why choose us" stat tiles — lift; numbers count up via premium.js */
.counter_sec .container_inner{ transition:transform .35s var(--prem-ease); }
.counter_sec .container_inner:hover{ transform:translateY(-6px); }
.counter_sec h4.os{ font-variant-numeric:tabular-nums; } /* steady width while counting */