:root{--page-title-display:none;}/* Start custom CSS for html, class: .elementor-element-227c680 */:root{
  --navy:#0b2447;
  --navy-2:#13315c;
  --blue:#1e73e8;
  --ink:#1c2733;
  --muted:#6b7685;
  --bg:#f6f8fc;
  --white:#ffffff;
  --radius:18px;
  --shadow:0 10px 30px rgba(11,36,71,0.08);
  --shadow-hover:0 26px 50px rgba(11,36,71,0.28);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  background:var(--bg);
  color:var(--ink);
}
a{text-decoration:none;color:inherit;}

/* ===== HERO / PAGE HEADING ===== */
.hero{
  position:relative;
  overflow:hidden;
  text-align:center;
  padding:64px 24px 60px;
  background:
    radial-gradient(circle at 12% 20%, rgba(30,115,232,0.16), transparent 45%),
    radial-gradient(circle at 88% 15%, rgba(139,92,246,0.14), transparent 40%),
    radial-gradient(circle at 50% 100%, rgba(22,163,74,0.10), transparent 45%),
    var(--bg);
}
.hero-badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  background:var(--white);
  border:1px solid #dfe8f7;
  padding:9px 20px;
  border-radius:30px;
  font-size:13px;
  font-weight:700;
  letter-spacing:0.4px;
  color:var(--blue);
  box-shadow:var(--shadow);
  margin-bottom:22px;
}
.hero-badge .dot{
  width:7px;height:7px;border-radius:50%;
  background:linear-gradient(135deg,#1e73e8,#8b5cf6);
}
.hero h1{
  font-size:clamp(28px,4.6vw,44px);
  font-weight:800;
  margin:0 0 16px;
  color:var(--navy);
  line-height:1.25;
}
.hero h1 .accent{
  background:linear-gradient(90deg,#1e73e8 0%, #8b5cf6 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.hero p{
  max-width:640px;
  margin:0 auto;
  color:var(--muted);
  font-size:16px;
  line-height:1.7;
}

/* ===== GRID ===== */
.courses-section{
  max-width:1200px;
  margin:0 auto;
  padding:20px 24px 80px;
}
.courses-grid{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:24px;
}

/* ===== CARD BASE ===== */
.course-card{
  position:relative;
  display:block;
  border-radius:var(--radius);
  overflow:hidden;
  min-height:270px;
  box-shadow:var(--shadow);
  isolation:isolate;
  transition:transform .4s cubic-bezier(.2,.8,.2,1), box-shadow .4s ease;
}
.course-card:hover{
  transform:translateY(-10px);
  box-shadow:var(--shadow-hover);
}

.card-bg{
  position:absolute;
  inset:0;
  background-size:cover;
  background-position:center;
  transform:scale(1.05);
  transition:transform .6s ease;
  z-index:0;
}
.course-card:hover .card-bg{transform:scale(1.15);}

.gradient-bg{background-image:none !important;}

/* color-tinted overlay so every card feels premium & on-brand, never plain white */
.overlay{
  position:absolute;
  inset:0;
  z-index:1;
  transition:opacity .4s ease;
}
.course-card:hover .overlay{opacity:0.92;}

/* per-course color themes */
.cc-ai .overlay{background:linear-gradient(160deg, rgba(88,28,213,0.88) 0%, rgba(139,92,246,0.75) 55%, rgba(30,15,80,0.9) 100%);}
.cc-ai .gradient-bg{background:linear-gradient(160deg,#5b21b6,#8b5cf6 60%,#2e1065);}

.cc-fbauto .overlay{background:linear-gradient(160deg, rgba(15,45,110,0.9) 0%, rgba(30,115,232,0.72) 55%, rgba(9,26,64,0.92) 100%);}
.cc-fbauto .gradient-bg{background:linear-gradient(160deg,#0f2d6e,#1e73e8 60%,#091a40);}

.cc-yt .overlay{background:linear-gradient(160deg, rgba(153,17,17,0.9) 0%, rgba(230,45,45,0.72) 55%, rgba(70,8,8,0.92) 100%);}
.cc-yt .gradient-bg{background:linear-gradient(160deg,#991111,#e62d2d 60%,#460808);}

.cc-graphic .overlay{background:linear-gradient(160deg, rgba(190,24,93,0.88) 0%, rgba(236,72,153,0.72) 55%, rgba(88,8,44,0.92) 100%);}
.cc-graphic .gradient-bg{background:linear-gradient(160deg,#be185d,#ec4899 60%,#58082c);}

.cc-web .overlay{background:linear-gradient(160deg, rgba(6,95,120,0.9) 0%, rgba(6,182,212,0.72) 55%, rgba(4,50,64,0.92) 100%);}
.cc-web .gradient-bg{background:linear-gradient(160deg,#065f78,#06b6d4 60%,#043240);}

.cc-shopify .overlay{background:linear-gradient(160deg, rgba(10,80,45,0.9) 0%, rgba(22,163,74,0.72) 55%, rgba(6,45,25,0.92) 100%);}
.cc-shopify .gradient-bg{background:linear-gradient(160deg,#0a502d,#16a34a 60%,#062d19);}

.cc-fbmark .overlay{background:linear-gradient(160deg, rgba(15,45,110,0.9) 0%, rgba(30,115,232,0.72) 55%, rgba(9,26,64,0.92) 100%);}
.cc-fbmark .gradient-bg{background:linear-gradient(160deg,#0f2d6e,#1e73e8 60%,#091a40);}

.cc-fiverr .overlay{background:linear-gradient(160deg, rgba(154,84,10,0.9) 0%, rgba(245,158,11,0.75) 55%, rgba(90,48,4,0.92) 100%);}
.cc-fiverr .gradient-bg{background:linear-gradient(160deg,#9a540a,#f59e0b 60%,#5a3004);}

/* ===== TOP-TO-BOTTOM "LOADING" ACCENT LINE ===== */
.bar{
  position:absolute;
  top:0;
  left:0;
  width:4px;
  height:0%;
  background:linear-gradient(180deg, #ffffff 0%, rgba(255,255,255,0.5) 100%);
  z-index:3;
  transition:height .6s cubic-bezier(.2,.8,.2,1);
}
.course-card:hover .bar{height:100%;}

/* a soft scanning sweep from top to bottom on hover, for the premium feel */
.course-card::after{
  content:"";
  position:absolute;
  left:0;right:0;top:-100%;
  height:100%;
  background:linear-gradient(180deg, rgba(255,255,255,0.22), rgba(255,255,255,0) 70%);
  z-index:2;
  transition:top .7s cubic-bezier(.2,.8,.2,1);
  pointer-events:none;
}
.course-card:hover::after{top:100%;}

/* ===== BADGE ===== */
.badge{
  position:absolute;
  top:16px;right:16px;
  z-index:4;
  background:rgba(255,255,255,0.18);
  border:1px solid rgba(255,255,255,0.4);
  backdrop-filter:blur(4px);
  color:var(--white);
  font-size:11px;
  font-weight:700;
  letter-spacing:0.4px;
  text-transform:uppercase;
  padding:6px 12px;
  border-radius:20px;
}

/* ===== ICON BADGE ===== */
.icon-badge{
  position:absolute;
  top:16px;left:16px;
  z-index:4;
  width:46px;height:46px;
  border-radius:14px;
  background:rgba(255,255,255,0.16);
  border:1px solid rgba(255,255,255,0.35);
  backdrop-filter:blur(4px);
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--white);
  transition:transform .4s ease, background .4s ease;
}
.icon-badge svg{width:22px;height:22px;}
.course-card:hover .icon-badge{
  transform:scale(1.1) rotate(-6deg);
  background:rgba(255,255,255,0.28);
}

/* ===== CARD TEXT CONTENT ===== */
.card-content{
  position:relative;
  z-index:4;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  height:100%;
  min-height:270px;
  padding:18px 20px 22px 24px;
}
.title{
  color:var(--white);
  font-size:19px;
  font-weight:800;
  margin-bottom:8px;
  letter-spacing:0.2px;
}
.desc{
  color:rgba(255,255,255,0.88);
  font-size:13.5px;
  line-height:1.6;
  max-width:95%;
}

/* ===== RESPONSIVE ===== */
@media (max-width:1080px){
  .courses-grid{grid-template-columns:repeat(3,1fr);}
}
@media (max-width:760px){
  .courses-grid{grid-template-columns:repeat(2,1fr); gap:16px;}
  .course-card,.card-content{min-height:230px;}
  .hero{padding:50px 20px 40px;}
}
@media (max-width:480px){
  .courses-grid{grid-template-columns:1fr;}
  .course-card,.card-content{min-height:210px;}
  .title{font-size:18px;}
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-211eab4 */:root{
  --navy:#0b2447;
  --navy-2:#13315c;
  --blue:#1e73e8;
  --ink:#1c2733;
  --muted:#6b7685;
  --bg:#f6f8fc;
  --white:#ffffff;
  --radius:18px;
  --shadow:0 10px 30px rgba(11,36,71,0.08);
  --shadow-hover:0 26px 50px rgba(11,36,71,0.22);
}

*{box-sizing:border-box;}
body{
  margin:0;
  font-family:'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  background:var(--bg);
  color:var(--ink);
}

.hero-badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  background:var(--white);
  border:1px solid #dfe8f7;
  padding:9px 20px;
  border-radius:30px;
  font-size:13px;
  font-weight:700;
  letter-spacing:0.4px;
  color:var(--blue);
  box-shadow:var(--shadow);
  margin-bottom:20px;
}
.hero-badge .dot{
  width:7px;height:7px;border-radius:50%;
  background:linear-gradient(135deg,#1e73e8,#8b5cf6);
}
.hero-badge.center{display:flex;width:fit-content;margin-left:auto;margin-right:auto;}

.accent{
  background:linear-gradient(90deg,#1e73e8 0%, #8b5cf6 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

/* ===================== STATS SECTION ===================== */
.stats-section{
  max-width:1200px;
  margin:0 auto;
  padding:70px 24px 20px;
}
.stats-heading{
  text-align:center;
  max-width:700px;
  margin:0 auto 44px;
}
.stats-heading h2{
  font-size:clamp(24px,4vw,36px);
  font-weight:800;
  color:var(--navy);
  margin:0 0 14px;
  line-height:1.3;
}
.stats-heading p{
  color:var(--muted);
  font-size:15px;
  line-height:1.7;
  margin:0;
}

.stats-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:22px;
}
.stat-card{
  position:relative;
  border-radius:var(--radius);
  padding:28px 22px;
  color:var(--white);
  overflow:hidden;
  box-shadow:var(--shadow);
  transition:transform .4s cubic-bezier(.2,.8,.2,1), box-shadow .4s ease;
}
.stat-card:hover{
  transform:translateY(-8px);
  box-shadow:var(--shadow-hover);
}
.stat-card::after{
  content:"";
  position:absolute;
  right:-30px;top:-30px;
  width:120px;height:120px;
  background:rgba(255,255,255,0.10);
  border-radius:50%;
}
.stat-blue{background:linear-gradient(155deg,#1e73e8,#0f2d6e);}
.stat-purple{background:linear-gradient(155deg,#8b5cf6,#5b21b6);}
.stat-green{background:linear-gradient(155deg,#22c55e,#0a502d);}
.stat-orange{background:linear-gradient(155deg,#f59e0b,#9a540a);}

.stat-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  width:48px;height:48px;
  border-radius:14px;
  background:rgba(255,255,255,0.18);
  border:1px solid rgba(255,255,255,0.35);
  margin-bottom:18px;
  position:relative;
  z-index:1;
}
.stat-icon svg{width:22px;height:22px;}
.stat-num{
  display:block;
  font-size:32px;
  font-weight:800;
  margin-bottom:4px;
  position:relative;
  z-index:1;
}
.stat-label{
  display:block;
  font-size:15px;
  font-weight:700;
  margin-bottom:8px;
  position:relative;
  z-index:1;
}
.stat-sub{
  display:block;
  font-size:12.5px;
  line-height:1.6;
  color:rgba(255,255,255,0.85);
  position:relative;
  z-index:1;
}

/* ===================== TESTIMONIAL SECTION ===================== */
.testimonial-section{
  max-width:1200px;
  margin:0 auto;
  padding:70px 24px 90px;
  text-align:center;
}
.section-title{
  font-size:clamp(24px,4vw,36px);
  font-weight:800;
  color:var(--navy);
  margin:0 0 14px;
}
.section-sub{
  max-width:640px;
  margin:0 auto 44px;
  color:var(--muted);
  font-size:15px;
  line-height:1.7;
}

.testimonial-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:22px;
  text-align:left;
}
.t-card{
  position:relative;
  border-radius:var(--radius);
  padding:28px 22px 24px;
  color:var(--white);
  box-shadow:var(--shadow);
  overflow:hidden;
  transition:transform .4s cubic-bezier(.2,.8,.2,1), box-shadow .4s ease;
}
.t-card:hover{
  transform:translateY(-8px);
  box-shadow:var(--shadow-hover);
}
.t-blue{background:linear-gradient(160deg,#1e73e8,#0f2d6e);}
.t-green{background:linear-gradient(160deg,#22c55e,#0a502d);}
.t-pink{background:linear-gradient(160deg,#ec4899,#831843);}
.t-purple{background:linear-gradient(160deg,#8b5cf6,#5b21b6);}

.quote-icon{
  display:block;
  font-size:44px;
  font-weight:800;
  line-height:1;
  color:rgba(255,255,255,0.35);
  margin-bottom:6px;
  font-family:Georgia,serif;
}
.t-text{
  font-size:14px;
  line-height:1.7;
  color:rgba(255,255,255,0.95);
  margin:0 0 16px;
  min-height:96px;
}
.t-stars{
  color:#ffd23d;
  font-size:14px;
  letter-spacing:2px;
  margin-bottom:16px;
}
.t-person{
  display:flex;
  align-items:center;
  gap:12px;
  border-top:1px solid rgba(255,255,255,0.2);
  padding-top:16px;
}
.avatar{
  width:42px;height:42px;
  border-radius:50%;
  background:rgba(255,255,255,0.2);
  border:1.5px solid rgba(255,255,255,0.45);
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:800;
  font-size:13px;
  flex-shrink:0;
}
.t-meta{display:flex;flex-direction:column;}
.t-name{font-weight:700;font-size:14px;}
.t-role{font-size:12px;color:rgba(255,255,255,0.75);}

/* ===================== RESPONSIVE ===================== */
@media (max-width:1080px){
  .stats-grid, .testimonial-grid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:560px){
  .stats-grid, .testimonial-grid{grid-template-columns:1fr;}
  .stats-section, .testimonial-section{padding-left:20px;padding-right:20px;}
}/* End custom CSS */