/* ===== base-typography ===== */
body{background-color:#fbfbfe;color:#1e293b;overflow-x:hidden}
.teacher-card{flex:0 0 300px}
.teacher-photo{padding:20px;background:none}
.teacher-photo img{border-radius:20px}
.teacher-info{padding:0 16px 18px;margin-top:-15px}
.teacher-info h4{font-family:anek bangla,serif;font-weight:500;font-style:normal;font-size:20px}
.teacher-info p{font-family:anek bangla,serif;font-weight:300;font-style:normal}
.icon-card{display:flex;justify-content:space-between;align-items:center;border-radius:20px;box-shadow:0 4px 15px rgba(0,0,0,.02);transition:transform .3s ease,box-shadow .3s ease;cursor:pointer;border:1px solid rgba(0,0,0,.03);position:relative;margin-left:3rem}
.icon-card .text-content{display:flex;flex-direction:column;gap:2px;rotate:-15deg;position:absolute;right:20px}
.text-content h2{font-size:13px;font-weight:600;line-height:1.2;letter-spacing:-.5px}
.underline-svg{width:60px;height:15px;margin-top:4px;align-self:flex-end}
.icon-circle{width:35px;height:35px;border-radius:50%;display:flex;justify-content:center;align-items:center;flex-shrink:0;margin-left:10px}
.icon-circle svg{width:24px;height:24px}
.card-pink h2{color:#C2185B}
.pink-stroke{color:#C2185B}
.icon-pink{background-color:#FCE4EC;color:#C2185B}
.card-orange h2{color:#E65100}
.orange-stroke{color:#E65100}
.icon-orange{background-color:#FFE0B2;color:#E65100}
.card-blue h2{color:#1565C0}
.blue-stroke{color:#1565C0}
.icon-blue{background-color:#E3F2FD;color:#1565C0}
.grid-wrapper{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-bottom:2rem}
.item-card{background:#FFF;border-radius:24px;padding:5px 0;position:relative;overflow:hidden;box-shadow:0 10px 30px rgba(0,0,0,.03),0 1px 3px rgba(0,0,0,.02);cursor:pointer;display:flex;flex-direction:column;justify-content:space-between;border:1px solid rgba(255,255,255,.8);max-height:7rem}
.item-card .card-content{display:flex;gap:10px;align-items:center;z-index:2;position:relative}
.item-card .icon-3d-wrapper{position:relative;width:80px;height:80px;flex-shrink:0;display:flex;justify-content:center;align-items:center}
.item-card .icon-bg{position:absolute;inset:0;border-radius:20px;transition:all .4s ease}
.item-card.icon-svg{width:55px;height:55px;z-index:2;transition:transform .4s ease}
.item-card .text-content{display:flex;flex-direction:column;padding-top:4px;rotate:0deg;position:unset}
.item-card .text-content h2{font-size:20px;font-weight:700;color:#1A202C;line-height:1.1;margin-bottom:2px}
.item-card .text-content h3{font-size:16px;font-weight:600;color:#1A202C;margin-bottom:8px}
.item-card .text-content .divider{width:30px;height:3px;border-radius:2px;margin-bottom:10px}
.item-card .text-content p{font-size:15px;color:#3e4348;line-height:1.5;font-weight:400}
.item-card .arrow-btn{position:absolute;bottom:34%;right:24px;width:40px;height:40px;border-radius:50%;display:flex;justify-content:center;align-items:center;transition:all .3s ease;z-index:3}
.item-card img{height:3rem}
.item-card .arrow-btn svg{width:18px;height:18px}
.item-card-blue .card-bg-shape{background:#4A90E2}
.item-card-blue .icon-bg{background:linear-gradient(135deg,#E3F2FD,#BBDEFB)}
.item-card-blue .blue-divider{background:#4A90E2}
.item-card-blue .arrow-btn{background:#4A90E2;color:#FFF}
.item-card-pink .card-bg-shape{background:#F06292}
.item-card-pink .icon-bg{background:linear-gradient(135deg,#FCE4EC,#F8BBD0)}
.item-card-pink .pink-divider{background:#F06292}
.item-card-pink .arrow-btn{background:#F06292;color:#FFF}
.item-card-orange .card-bg-shape{background:#FF9800}
.item-card-orange .icon-bg{background:linear-gradient(135deg,#FFF3E0,#FFE0B2)}
.item-card-orange .orange-divider{background:#FF9800}
.item-card-orange .arrow-btn{background:#FF9800;color:#FFF}
.item-card-green .card-bg-shape{background:#4CAF50}
.item-card-green .icon-bg{background:linear-gradient(135deg,#E8F5E9,#C8E6C9)}
.item-card-green .green-divider{background:#4CAF50}
.item-card-green .arrow-btn{background:#4CAF50;color:#FFF}
@media (max-width:1024px){.grid-wrapper{grid-template-columns:repeat(2,1fr)}}
@media (max-width:600px){
.grid-wrapper{grid-template-columns:repeat(2,1fr);gap:12px}
.item-card{padding:5px;border-radius:10px}
.item-card .card-content{gap:2px;justify-content:start}
.item-card .icon-svg{width:40px;height:40px}
.item-card .text-content h2{font-size:20px}
.item-card .text-content h3{font-size:13px;margin-bottom:4px}
.item-card .text-content p{font-size:9px}
.item-card .arrow-btn{width:32px;height:32px;bottom:36%;right:16px}
.item-card .arrow-btn svg{width:14px;height:14px}
.item-card img{height:2.5rem}
.icon-card .text-content h2{font-size:10px}
}

/* ===== smooth course slider ===== */
.wlac-slider{position:relative;overflow:hidden;width:100%;touch-action:pan-y;user-select:none;-webkit-user-select:none}
.wlac-slider-track{display:flex;gap:20px;width:max-content;cursor:grab;transform:translate3d(0,0,0);will-change:transform;backface-visibility:hidden;-webkit-backface-visibility:hidden;transition:none}
.wlac-slider-track.dragging{cursor:grabbing}
.wlac-slide-item{flex:0 0 auto;width:260px;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.wlac-slide-item img{-webkit-user-drag:none;user-drag:none;pointer-events:none}
.wlac-slide-item[data-aos]{will-change:transform,opacity}
@media (max-width:640px){
.wlac-slider{touch-action:pan-y}
.wlac-slider-track{gap:12px}
.wlac-slide-item{width:260px}
}
.course-thumb{aspect-ratio:auto}
@media (max-width:480px){
.content-section h1{font-size:23px;margin:5px}
}

/* ===== custom-effects ===== */
.ribbon-diagonal{clip-path:polygon(0 0,100% 0,100% 100%,0 85%)}
.custom-shadow{box-shadow:0 4px 20px -2px rgba(27,22,66,.08)}
.card-hover{margin-top:1rem;padding-top:10px}
.card-hover:hover{transform:translateY(-4px);box-shadow:0 12px 28px -4px rgba(27,22,66,.12);border:1px solid #625be8}
.hero-section{position:relative;width:100%;padding:60px 20px;text-align:center;background-color:#f4f7fb;animation:slideInFromLeft 1.2s ease-out forwards;opacity:0;transform:translateX(-100px)}
@keyframes slideInFromLeft{0%{opacity:0;transform:translateX(-100px)}100%{opacity:1;transform:translateX(0)}}
.blob-1,.blob-2{position:absolute;border-radius:50%;filter:blur(80px);z-index:-1}
.blob-1{width:300px;height:300px;background:#e0d4ff;top:10%;left:-10%}
.blob-2{width:250px;height:250px;background:#d4e6ff;bottom:10%;right:-5%}
.top-heading{font-size:14px;letter-spacing:4px;color:#7a8a9e;font-weight:600;margin-bottom:20px;text-transform:uppercase}
.main-title{font-size:54px;font-weight:700;line-height:1.3;color:#1a1a1a;margin-bottom:10px}
.main-title .highlight{color:#6b3ce6}
.description{font-size:19px;color:#556070;line-height:1.6;max-width:650px;margin:0 auto 40px auto}
.side-text{position:absolute;font-size:20px;color:#8a9bb0;font-weight:500;line-height:1.4;opacity:.7}
.left-side-text{top:25%;left:5%;transform:rotate(-8deg);text-align:left}
.right-side-text{top:25%;right:5%;transform:rotate(8deg);text-align:right}
.side-text::after{content:'';display:block;width:80px;height:2px;background:#8a9bb0;margin-top:10px;border-radius:2px}
.left-side-text::after{transform:rotate(-15deg)}
.right-side-text::after{transform:rotate(15deg);margin-left:auto}
.button-container{display:flex;justify-content:center;align-items:center;gap:20px;flex-wrap:wrap}
.nav-btn{display:flex;align-items:center;gap:10px;background:#fff;border:none;padding:10px 24px;border-radius:50px;font-size:16px;font-weight:600;color:#333;cursor:pointer;box-shadow:0 4px 15px rgba(0,0,0,.04);transition:all .3s ease}
.nav-btn:hover{transform:translateY(-3px);box-shadow:0 8px 25px rgba(0,0,0,.08)}
.icon-box{display:flex;justify-content:center;align-items:center;width:32px;height:32px;border-radius:50%;color:#fff;font-size:14px}
.icon-course{background-color:#00b894}
.icon-book{background-color:#ff4757}
.icon-exam{background-color:#0984e3}
.icon-guide{background-color:#00b894}
@media (max-width:768px){
.hero-section{padding:30px 20px}
.top-heading{font-size:12px;margin-bottom:15px}
.main-title{font-size:24px}
.description{font-size:16px}
.side-text{display:none}
.nav-btn{padding:6px 12px;font-size:12px}
.button-container{gap:5px}
.icon-box{width:20px;height:20px;font-size:12px}
}
.cards-container{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;width:100%;max-width:1400px}
.card{position:relative;border-radius:20px;padding:22px 14px;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden;min-height:180px;transition:transform .3s ease,box-shadow .3s ease;animation:fadeInUp .8s ease-out forwards;opacity:0;transform:translateY(20px)}
.card::before{content:'';position:absolute;width:150px;height:150px;border-radius:50%;top:16px;right:-40px;opacity:.4;z-index:0}
.card::after{content:'';position:absolute;width:80px;height:80px;border-radius:50%;bottom:-20px;left:-20px;opacity:.3;z-index:0}
.card:nth-child(1){animation-delay:.1s}
.card:nth-child(2){animation-delay:.2s}
.card:nth-child(3){animation-delay:.3s}
.card:nth-child(4){animation-delay:.4s}
@keyframes fadeInUp{to{opacity:1;transform:translateY(0)}}
.card:hover{transform:translateY(-5px);box-shadow:0 15px 30px rgba(0,0,0,.08)}
.card-content{position:relative;z-index:1}
.top-bar{width:40px;height:6px;border-radius:10px;margin-bottom:15px}
.card h3{font-size:18px;font-weight:700;color:#0f172a;line-height:1.2;margin-bottom:5px}
.card p{font-size:13px;font-weight:500;color:#475569;margin-bottom:25px}
.card-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:8px 16px;border-radius:50px;color:#fff;font-size:14px;font-weight:600;text-decoration:none;border:none;cursor:pointer;transition:all .3s ease;width:fit-content}
.card-btn i{transition:transform .3s ease}
.card-btn:hover i{transform:translateX(5px)}
.card-icon{position:absolute;right:10px;bottom:4.5rem;font-size:55px;z-index:1;opacity:.9;transition:transform .4s ease}
.card:hover .card-icon{transform:scale(1.08) rotate(5deg)}
.card-blue::before{background-color:#dbeafe}
.card-blue::after{background-color:#bfdbfe}
.card-blue .top-bar{background-color:#3b82f6}
.card-blue .card-btn{background-color:#2563eb}
.card-blue .card-btn:hover{background-color:#1d4ed8;box-shadow:0 5px 15px rgba(37,99,235,.4)}
.card-blue .card-icon{color:#1e3a8a}
.card-green{background-color:#f0fdf4}
.card-green::before{background-color:#dcfce7}
.card-green::after{background-color:#bbf7d0}
.card-green .top-bar{background-color:#10b981}
.card-green .card-btn{background-color:#059669}
.card-green .card-btn:hover{background-color:#047857;box-shadow:0 5px 15px rgba(5,150,105,.4)}
.card-green .card-icon{color:#064e3b}
.card-orange::before{background-color:#ffedd5}
.card-orange::after{background-color:#fed7aa}
.card-orange .top-bar{background-color:#f97316}
.card-orange .card-btn{background-color:#ea580c}
.card-orange .card-btn:hover{background-color:#c2410c;box-shadow:0 5px 15px rgba(234,88,12,.4)}
.card-orange .card-icon{color:#7c2d12}
.card-purple{background-color:#f5f3ff}
.card-purple::before{background-color:#ede9fe}
.card-purple::after{background-color:#ddd6fe}
.card-purple .top-bar{background-color:#8b5cf6}
.card-purple .card-btn{background-color:#7c3aed}
.card-purple .card-btn:hover{background-color:#6d28d9;box-shadow:0 5px 15px rgba(124,58,237,.4)}
.card-purple .card-icon{color:#4c1d95}
@media (max-width:1024px){.cards-container{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){
.cards-container{grid-template-columns:repeat(2,1fr);gap:6px}
.card{padding:15px;min-height:150px}
.card h3{font-size:15px;font-weight:600}
.card p{font-size:11px;margin-bottom:15px}
.card-btn{padding:6px 14px;font-size:12px}
.card-icon{font-size:35px;bottom:4rem;right:0}
.top-bar{width:35px;height:4px;margin-bottom:10px}
}
.course-rating{display:flex;align-items:center;gap:6px;margin:4px 0 8px}
.star-wrap{position:relative;display:inline-block;line-height:0}
.star-row{display:flex;gap:2px;white-space:nowrap}
.star-row svg{flex:0 0 16px}
.star-empty svg{fill:#d1d5db}
.star-fill{position:absolute;top:0;left:0;overflow:hidden}
.star-fill svg{fill:#f5b301}
.course-rating .rating-text{font-size:12px;color:#3b3a3d}
.wlac-scrollbar{display:flex;align-items:center;gap:10px;width:100%;margin-top:18px}
.wlac-scrollbar-track{flex:1;height:10px;background:transparent;border-radius:999px;position:relative}
.wlac-scrollbar-thumb{position:absolute;top:0;left:0;height:100%;background:#9ca3af;border-radius:999px;cursor:grab;transition:background .2s ease}
.wlac-scrollbar-thumb:hover,.wlac-scrollbar-thumb.dragging{background:#6b7280;cursor:grabbing}
.wlac-scrollbar-arrow{flex:0 0 auto;width:24px;height:24px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;color:#9ca3af;cursor:pointer;padding:0;transition:color .2s ease}
.wlac-scrollbar-arrow svg{width:18px;height:18px}
.wlac-scrollbar-arrow:hover{color:#4b5563}
.wlac-scrollbar-arrow:disabled{opacity:.3;cursor:default}

/* ===== exam centre steps ===== */
.ecs-wrap{background:#f4f7fb;border-radius:28px;padding:48px 28px;border:1px solid rgba(0,0,0,.04);position:relative;overflow:hidden}
.ecs-wrap::before,.ecs-wrap::after{content:'';position:absolute;border-radius:50%;filter:blur(80px);z-index:0}
.ecs-wrap::before{width:260px;height:260px;background:#e0d4ff;top:-5%;left:-8%}
.ecs-wrap::after{width:220px;height:220px;background:#d4e6ff;bottom:-10%;right:-6%}
.ecs-eyebrow{position:relative;z-index:1;display:inline-flex;align-items:center;gap:6px;background:#fff;color:#6b3ce6;font-size:12px;font-weight:700;letter-spacing:1px;padding:6px 16px;border-radius:999px;border:1px solid rgba(107,60,230,.15);box-shadow:0 4px 15px rgba(0,0,0,.04);margin-bottom:14px}
.ecs-title{position:relative;z-index:1;background:linear-gradient(135deg,#3d00ff 0%,#008eff 50%,#ff3376 100%);-webkit-text-fill-color:transparent;color:#0000;-webkit-background-clip:text;background-clip:text;font-size:28px;font-weight:800;line-height:1.35}
.ecs-title .ecs-highlight{color:#6b3ce6}
.ecs-grid{position:relative;z-index:1;display:grid;grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;align-items:center;gap:12px;margin-top:36px}
.ecs-card{background:#fff;border:1px solid rgba(0,0,0,.05);border-radius:20px;padding:28px 20px;text-align:center;position:relative;height:100%;box-shadow:0 4px 15px rgba(0,0,0,.04)}
.ecs-num{position:absolute;top:-16px;left:50%;transform:translateX(-50%);width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:13px;color:#fff;box-shadow:0 4px 12px rgba(0,0,0,.15)}
.ecs-num-blue{background:#0984e3}
.ecs-num-orange{background:#e17055}
.ecs-num-cyan{background:#00b894}
.ecs-num-pink{background:#ff4757}
.ecs-icon{width:64px;height:64px;border-radius:18px;display:flex;align-items:center;justify-content:center;margin:12px auto 18px;font-size:24px;color:#fff}
.ecs-icon-blue{background:#0984e3}
.ecs-icon-orange{background:#e17055}
.ecs-icon-cyan{background:#00b894}
.ecs-icon-pink{background:#ff4757}
.ecs-card h4{color:#1a1a1a;font-size:15px;font-weight:700;margin-bottom:8px;line-height:1.4}
.ecs-card p{color:#556070;font-size:13px;line-height:1.6}
.ecs-arrow{width:60px;height:24px;display:flex;align-items:center;justify-content:center;position:relative;z-index:1}
.ecs-arrow-blue{color:#0984e3}
.ecs-arrow-orange{color:#e17055}
.ecs-arrow-pink{color:#ff4757}
@media (max-width:1024px){
.ecs-grid{grid-template-columns:1fr 1fr;gap:40px 16px}
.ecs-arrow{display:none}
.ecs-title{font-size:22px}
}
@media (max-width:640px){
.ecs-wrap{padding:32px 16px;border-radius:20px}
.ecs-grid{grid-template-columns:1fr}
.ecs-title{font-size:20px}
}

/* ===== fx carousel (fade) ===== */
.fx-carousel{position:relative;width:100%;overflow:hidden;border-radius:20px}
.fx-track{display:flex;align-items:center;justify-content:center;position:relative;width:100%}
.fx-slide{position:absolute;inset:0;opacity:0;transition:opacity .8s ease;pointer-events:none}
.fx-slide.active{position:relative;opacity:1;pointer-events:auto}
.fx-slide img{width:100%;height:auto;display:block;object-fit:cover}
.fx-nav{display:none;visibility:hidden;position:absolute;top:50%;transform:translateY(-50%);width:36px;height:36px;border:none;border-radius:50%;background:rgba(255,255,255,.85);color:#1e293b;font-size:22px;line-height:1;cursor:pointer;z-index:3;box-shadow:0 4px 12px rgba(0,0,0,.15);transition:background .2s}
.fx-nav:hover{background:#fff}
.fx-prev{left:10px}
.fx-next{right:10px}
.fx-dots{position:absolute;bottom:10px;left:50%;transform:translateX(-50%);display:flex;gap:6px;z-index:3}
.fx-dot{width:8px;height:8px;border-radius:50%;border:none;padding:0;background:rgba(255,255,255,.6);cursor:pointer;transition:all .3s}
.fx-dot.active{background:#6b3ce6;width:22px;border-radius:999px}
.hero-section{overflow:hidden}
.fx-carousel.fx-bg{position:absolute;inset:0;border-radius:0;z-index:-1}
.fx-carousel.fx-bg .fx-track,.fx-carousel.fx-bg .fx-slide{height:100%}
.fx-carousel.fx-bg .fx-slide.active{position:absolute}
.fx-carousel.fx-bg .fx-slide img{height:100%;opacity:.35}
.fx-carousel.fx-bg .fx-dots{bottom:14px}

/* ===== typing animation ===== */
.typing-h1{min-height:2.6em}
.typing-cursor{display:inline-block;width:3px;height:1em;margin-left:3px;background:#6b3ce6;vertical-align:-.1em;animation:typingBlink .8s steps(1) infinite}
.typing-cursor.done{animation:typingBlink .8s steps(1) 3;opacity:0}
@keyframes typingBlink{0%,50%{opacity:1}50.01%,100%{opacity:0}}
@media (max-width:480px){.typing-h1{min-height:3.2em}}

/* ===== checklist ===== */
.checklist-card{display:flex}
.checklist-grid{margin:0 8rem}
.checklist-card .card-image{max-width:28rem}
@media (max-width:768px){
.checklist-card{display:block}
.checklist-grid{margin:auto}
}

/* ===== success gallery ===== */
.sg-section{overflow:hidden}
.sg-marquee{overflow:hidden;width:100%;padding:6px 0;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 40px,#000 calc(100% - 40px),transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 40px,#000 calc(100% - 40px),transparent 100%)}
.sg-marquee+.sg-marquee{margin-top:12px}
.sg-track{display:flex;align-items:center;gap:12px;width:max-content;will-change:transform}
.sg-item{flex:none;width:160px;aspect-ratio:4/3;border-radius:16px;overflow:hidden;background:#e2e8f0;box-shadow:0 1px 2px rgba(0,0,0,.06)}
.sg-item img{width:100%;height:100%;object-fit:cover;display:block}
@media (min-width:640px){.sg-item{width:190px}}
@media (min-width:1024px){.sg-item{width:220px}}
.sg-marquee--right .sg-track{animation:sg-scroll-right linear infinite;animation-duration:18s;transform:translate3d(-50%,0,0)}
.sg-marquee--left .sg-track{animation:sg-scroll-left linear infinite;animation-duration:18s}
@keyframes sg-scroll-right{from{transform:translate3d(-50%,0,0)}to{transform:translate3d(0,0,0)}}
@keyframes sg-scroll-left{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}
@media (prefers-reduced-motion:reduce){
.sg-marquee--right .sg-track,.sg-marquee--left .sg-track{animation:none}
}

/* ===== section reveal (static, no JS injection => no flash) ===== */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1)}
.reveal.in-view{opacity:1;transform:translateY(0)}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}