#hero-section,
.hero-section {
  background-image:
    linear-gradient(90deg, rgba(0,0,0,.92) 0%, rgba(0,0,0,.72) 42%, rgba(0,0,0,.18) 100%),
    radial-gradient(circle at 75% 25%, rgba(166,107,232,.7), transparent 30%),
    url('https://images.unsplash.com/photo-1501386761578-eac5c94b800a?auto=format&fit=crop&w=1800&q=90');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}









/* ===== ASLE Simple FAQ — reusable via class .asle-faq ===== */

/* Wrapper: one bordered rounded card */
.asle-faq .elementor-accordion {
  border: 1px solid #ececec;
  border-radius: 16px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 18px 50px rgba(0,0,0,.05);
}

/* Remove per-item borders; hairline divider between rows only */
.asle-faq .elementor-accordion-item {
  border: 0;
}
.asle-faq .elementor-accordion-item + .elementor-accordion-item {
  border-top: 1px solid #ececec;
}

/* Question row (closed): green, bold, icon pushed right */
.asle-faq .elementor-tab-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 24px 30px;
  font-size: 19px;
  font-weight: 800;
  color: #078b61;
  background: #fff;
  transition: background .18s ease, color .18s ease;
}
.asle-faq .elementor-tab-title a { color: #078b61; }

/* Question row (open): tinted header, purple text */
.asle-faq .elementor-tab-title.elementor-active {
  background: #f3eefb;
  color: #7b55b7;
}
.asle-faq .elementor-tab-title.elementor-active a { color: #7b55b7; }

/* +/- icon on the right, colour follows state */
.asle-faq .elementor-tab-title .elementor-accordion-icon {
  order: 2;
  margin: 0;
  color: #078b61;
}
.asle-faq .elementor-tab-title.elementor-active .elementor-accordion-icon {
  color: #7b55b7;
}

/* Answer body */
.asle-faq .elementor-tab-content {
  padding: 20px 30px 26px;
  font-size: 16px;
  color: #5b5b5b;
  background: #fff;
  border: 0;
}

/* Mobile */
@media (max-width: 620px) {
  .asle-faq .elementor-tab-title { padding: 20px 18px; font-size: 16px; }
  .asle-faq .elementor-tab-content { padding: 16px 18px 22px; }
}
















/* =======================================================================
   ASLE FLIP BOX  —  reusable custom CSS
   Apply the class  asle-flip  to each Flip Box widget:
   Widget > Advanced > CSS Classes >  asle-flip
   Paste this block once in Appearance > Customize > Additional CSS
   ======================================================================= */
.asle-flip .elementor-flip-box{
  height:280px;
  border-radius:20px;
  overflow:hidden;
  box-shadow:0 12px 28px rgba(30,20,50,.07);
}
.asle-flip .elementor-flip-box__layer{border-radius:20px;overflow:hidden}

/* ---- FRONT ---- */
.asle-flip .elementor-flip-box__front{
  background:#fff;
  border:1px solid #eceaf2;
}
.asle-flip .elementor-flip-box__front .elementor-flip-box__layer__overlay{
  padding:24px 20px;
  display:flex;align-items:center;justify-content:center;
  position:relative;
}
/* gradient accent bar across the top of the front face */
.asle-flip .elementor-flip-box__front .elementor-flip-box__layer__overlay:before{
  content:"";position:absolute;top:0;left:0;right:0;height:4px;
  background:linear-gradient(90deg,#7b55b7,#078b61);
}
.asle-flip .elementor-flip-box__front .elementor-flip-box__layer__inner{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  width:100%;
}
/* logo: capped, centred, never stretched or cropped */
.asle-flip .elementor-flip-box__image{
  height:92px;width:100%;
  display:flex;align-items:center;justify-content:center;
  margin:0 0 14px;
}
.asle-flip .elementor-flip-box__image img{
  width:auto !important;
  height:auto !important;
  max-height:92px;
  max-width:80%;
  object-fit:contain;
}
.asle-flip .elementor-flip-box__front .elementor-flip-box__layer__title{
  font-size:14px;font-weight:800;text-transform:uppercase;letter-spacing:.3px;
  line-height:1.35;color:#242424;margin:0;
}
.asle-flip .elementor-flip-box__front .elementor-flip-box__layer__description{
  margin-top:8px;
  font-size:10.5px;font-weight:800;letter-spacing:1px;text-transform:uppercase;
  color:#078b61;background:#e7f3ee;border-radius:999px;padding:4px 12px;
  display:inline-block;
}

/* ---- BACK ---- */
.asle-flip .elementor-flip-box__back{
  background:linear-gradient(140deg,#6f45c0 0%,#7b55b7 45%,#0b7a58 100%);
  color:#fff;
}
.asle-flip .elementor-flip-box__back .elementor-flip-box__layer__overlay{
  padding:26px 22px;display:flex;align-items:center;justify-content:center;
}
.asle-flip .elementor-flip-box__back .elementor-flip-box__layer__title{
  font-size:13.5px;font-weight:800;text-transform:uppercase;letter-spacing:.3px;
  line-height:1.35;color:#fff;margin:0 0 12px;
}
.asle-flip .elementor-flip-box__back .elementor-flip-box__layer__description{
  font-size:12.5px;line-height:1.55;color:#fff;
}
.asle-flip .elementor-flip-box__back a{color:#fff;text-decoration:underline}
.asle-flip .elementor-flip-box__back a:hover{opacity:.85}

/* ---- BUTTON ---- */
.asle-flip .elementor-flip-box__button{
  margin-top:16px;
  background:#fff !important;color:#7b55b7 !important;
  font-size:11.5px;font-weight:800;text-transform:uppercase;letter-spacing:.8px;
  padding:9px 18px;border-radius:999px;border:0;
  transition:transform .2s ease;
}
.asle-flip .elementor-flip-box__button:hover{transform:translateY(-2px)}
/* hide the button when no link was set (avoids dead "Click Here") */
.asle-flip .elementor-flip-box__button:not([href]){display:none}

/* ---- MODIFIER: taller card for long organisation names ---- */
.asle-flip--tall .elementor-flip-box{height:320px}

/* ---- MODIFIER: no logo, wordmark style front ---- */
.asle-flip--text .elementor-flip-box__front .elementor-flip-box__layer__title{
  font-family:Georgia,serif;font-style:italic;text-transform:none;
  font-size:19px;font-weight:400;color:#7b55b7;
}

/* ---- accessibility + motion ---- */
.asle-flip .elementor-flip-box:focus-visible{outline:3px solid #a66be8;outline-offset:3px}
@media (prefers-reduced-motion:reduce){
  .asle-flip .elementor-flip-box__layer{transition:none !important}
}
@media(max-width:767px){
  .asle-flip .elementor-flip-box{height:260px}
  .asle-flip .elementor-flip-box__image{height:78px}
  .asle-flip .elementor-flip-box__image img{max-height:78px}
}
/* ===================== end ASLE FLIP BOX CSS ===================== 













/* =======================================================================
   ASLE DECORATIVE LINES  —  reusable
   For empty containers used as rules/ticks beside headings.
   Elementor gives empty containers a min-height, which is why they
   render as large blocks. These rules collapse them to thin lines.

   Apply:  asle-rule   -> the long gradient line after a section title
           asle-tick   -> the short purple bar before a sub-heading
   ======================================================================= */
.asle-rule{
  flex:1 1 auto !important;
  align-self:center !important;
  height:2px !important;
  min-height:0 !important;
  padding:0 !important;
  border-radius:2px;
  background:linear-gradient(90deg,#8bc6ad,rgba(139,198,173,0)) !important;
}
.asle-tick{
  flex:0 0 22px !important;
  width:22px !important;
  align-self:center !important;
  height:3px !important;
  min-height:0 !important;
  padding:0 !important;
  border-radius:2px;
  background:#a66be8 !important;
}
/* keep them from stretching inside flex rows */
.asle-rule > .e-con-inner,
.asle-tick > .e-con-inner{min-height:0 !important;padding:0 !important}

/* hide the decorative lines on small screens, they add no meaning */
@media(max-width:767px){
  .asle-rule{display:none !important}
}
/* ================== end ASLE DECORATIVE LINES ================== */