.elementor-4101 .elementor-element.elementor-element-7bd7a12{--display:flex;}:root{--page-title-display:none;}/* Start custom CSS *//* CLICKABLE CARD — +15% darker at rest + +15% darker on hover */
.hs-card{
  display:block;
  position:relative;
  cursor:pointer;
  text-decoration:none;
  border-radius:22px;
  overflow:hidden;

  border: 1px solid rgba(58,134,255,.22);
  box-shadow:
    0 18px 55px rgba(0,0,0,.45),
    0 0 0 1px rgba(255,255,255,.06) inset,
    0 0 30px rgba(58,134,255,.34); /* ✅ more blue */

  transform: translateY(0);
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
  will-change: transform;
}

/* Dark overlay (darker at rest) */
.hs-card::before{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(
    to top,
    rgba(0,0,0,.72) 0%,
    rgba(0,0,0,.34) 55%,
    rgba(0,0,0,.16) 100%
  );
  opacity: .53;                 /* ✅ +15% darker start */
  transition: opacity .22s ease;
  pointer-events:none;
  z-index:1;
}

.hs-card > *{
  position:relative;
  z-index:2;
}

/* Hover: lift + stronger blue glow */
.hs-card:hover{
  transform: translateY(-10px);
  border-color: rgba(58,134,255,.42);
  box-shadow:
    0 28px 85px rgba(0,0,0,.58),
    0 0 0 1px rgba(255,255,255,.08) inset,
    0 0 52px rgba(58,134,255,.56); /* ✅ more blue */
}

/* Hover overlay (darker) */
.hs-card:hover::before{
  opacity: .90;                 /* ✅ +15% darker hover */
}

.hs-card:active{
  transform: translateY(-6px) scale(.995);
}

/* HoopStudy FAQ - Modern Card Accordion (v2) */
.hs-faq .elementor-accordion-item{
  background: #ffffff !important;
  border: 1px solid rgba(15, 23, 42, .08) !important; /* softer */
  border-radius: 18px !important;
  overflow: hidden !important;
  margin: 0 0 16px 0 !important;
  box-shadow: 0 14px 40px rgba(2, 6, 23, .08) !important;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease !important;
}

/* Title row */
.hs-faq .elementor-tab-title{
  position: relative !important;
  padding: 20px 22px 20px 22px !important;
  font-weight: 700 !important;
  font-size: 16px !important;
  border: 0 !important;
  background: #ffffff !important;
}

/* Left accent bar (subtle) */
.hs-faq .elementor-tab-title::before{
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  top: 12px !important;
  bottom: 12px !important;
  width: 4px !important;
  background: rgba(58,134,255,.0) !important;
  border-radius: 999px !important;
  transition: background .18s ease !important;
}

/* Hover highlight */
.hs-faq .elementor-tab-title:hover{
  background: rgba(58,134,255,.06) !important;
}

/* Active state */
.hs-faq .elementor-tab-title.elementor-active{
  color: #0B0B0B !important;
}
.hs-faq .elementor-tab-title.elementor-active::before{
  background: rgba(58,134,255,.95) !important; /* your accent */
}

/* Content */
.hs-faq .elementor-tab-content{
  padding: 0 22px 18px 22px !important;
  border: 0 !important;
  color: #3B3B3B !important;
  font-size: 15px !important;
  line-height: 1.65 !important;
}

/* Lift on hover */
@media (hover:hover){
  .hs-faq .elementor-accordion-item:hover{
    transform: translateY(-3px) !important;
    border-color: rgba(58,134,255,.22) !important;
    box-shadow: 0 18px 55px rgba(2, 6, 23, .10) !important;
  }
}

/* Icon polish */
.hs-faq .elementor-accordion-icon{
  opacity: .85 !important;
}
.hs-faq .elementor-accordion-icon i{
  transition: transform .18s ease !important;
}
.hs-faq .elementor-tab-title.elementor-active .elementor-accordion-icon i{
  transform: rotate(45deg) !important; /* makes a + feel like an x on open */
}/* End custom CSS */