*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Space Grotesk',sans-serif;background:var(--bg-cream);color:var(--text-dark);overflow-x:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
a{text-decoration:none;color:inherit}
ul{list-style:none}
img{max-width:100%;display:block}
:root{
  --blue:#2845EE;--blue-d:#1d35c7;--blue-l:#dce5fc;--blue-m:#c9d7fb;
  --purple:#7c3aed;--dark:#131826;--muted:#556275;--border:#d5dbe5;
  --cyan:#0ea5e9;
  --bg-cream:#ebedf2;--bg-cream-card:#ebedf2;--bg-cream-alt:#e2e6ec;--bg-cream-soft:#f2f4f8;
  --border-soft:rgba(255,255,255,0.75);--border-card:rgba(255,255,255,0.9);
  --text-dark:#131826;--text-sub:#4a5568;
  --grad:linear-gradient(135deg,#2845EE,#7c3aed);
  --grad-blue:linear-gradient(135deg,#2845EE 0%,#1e38d6 100%);
  --grad-dark:linear-gradient(135deg,#131826,#1e293b);
  --shadow:10px 12px 26px rgba(166,175,195,0.42), -10px -10px 24px #ffffff;
  --shadow-lg:14px 18px 34px rgba(166,175,195,0.48), -12px -12px 28px #ffffff;
  --shadow-soft:6px 8px 18px rgba(166,175,195,0.38), -6px -6px 16px #ffffff;
  --shadow-inset:inset 4px 4px 9px rgba(166,175,195,0.45), inset -4px -4px 9px #ffffff;
  --mono:'JetBrains Mono',monospace;
}
.g-text{background:var(--grad);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.sw{max-width:1240px;margin:0 auto;padding:96px 32px}
.sl{font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:2.5px;text-transform:uppercase;color:var(--blue);margin-bottom:12px;display:inline-block}
.st{font-size:clamp(30px,4vw,48px);font-weight:800;line-height:1.08;color:var(--text-dark);margin-bottom:16px;letter-spacing:-1px}
.st.w{color:#fff}
.ss{font-size:16px;color:var(--muted);max-width:560px;line-height:1.8}
.ss.w{color:#94a3b8}
.center{text-align:center}
.center .ss{margin:0 auto}
.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease}
.reveal-l{opacity:0;transform:translateX(-28px);transition:opacity .7s ease,transform .7s ease}
.reveal-r{opacity:0;transform:translateX(28px);transition:opacity .7s ease,transform .7s ease}
.reveal.v,.reveal-l.v,.reveal-r.v{opacity:1;transform:none}

/* MOBILE HERO TERMINAL */
.hero-mobile-term{display:none;margin-top:8px}
.scroll-progress{position:fixed;top:0;left:0;height:3px;width:0%;background:var(--grad);z-index:2100;transition:width .1s linear}

/* PHOTO BANNER MOTION */
.photo-banner{position:relative;min-height:360px;overflow:hidden;background:linear-gradient(135deg,#060919 0%,#0f1742 35%,#1f104d 70%,#090d24 100%);background-size:250% 250%;animation:pbBgMotion 6s ease-in-out infinite alternate;display:flex;align-items:center}
@keyframes pbBgMotion{0%{background-position:0% 20%}50%{background-position:100% 80%}100%{background-position:0% 20%}}
.photo-banner::before{content:'';position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.18) 1.5px,transparent 1.5px);background-size:26px 26px;opacity:.5;animation:pbGridMove 8s linear infinite}
@keyframes pbGridMove{0%{background-position:0 0}100%{background-position:52px 52px}}
.pb-glow{position:absolute;border-radius:50%;filter:blur(60px);opacity:.7;pointer-events:none}
.pb-glow.g1{width:440px;height:440px;background:#2845EE;top:-80px;left:-60px;animation:orbFloat1 4.5s ease-in-out infinite alternate}
.pb-glow.g2{width:400px;height:400px;background:#8B3EF2;bottom:-100px;right:-40px;animation:orbFloat2 5s ease-in-out infinite alternate}
.pb-glow.g3{width:300px;height:300px;background:#22D3EE;top:25%;left:45%;opacity:.5;animation:orbFloat3 4s ease-in-out infinite alternate}
.pb-glow.g4{width:300px;height:300px;background:#ec4899;bottom:10%;left:15%;opacity:.4;animation:orbFloat4 4.8s ease-in-out infinite alternate}
@keyframes orbFloat1{0%{transform:translate(0,0) scale(0.95)}100%{transform:translate(120px,70px) scale(1.25)}}
@keyframes orbFloat2{0%{transform:translate(0,0) scale(1)}100%{transform:translate(-130px,-80px) scale(1.3)}}
@keyframes orbFloat3{0%{transform:translate(-50%,-50%) scale(0.9)}100%{transform:translate(-20%,-20%) scale(1.4)}}
@keyframes orbFloat4{0%{transform:translate(0,0) scale(1)}100%{transform:translate(90px,-70px) scale(1.3)}}
.pb-particles{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.p-dot{position:absolute;border-radius:50%;background:#fff;opacity:.6;animation:pFloat 3s ease-in-out infinite alternate}
.p1{width:5px;height:5px;top:20%;left:15%;animation-duration:2.5s;animation-delay:0s;box-shadow:0 0 10px #60a5fa}
.p2{width:6px;height:6px;top:65%;left:25%;animation-duration:3.2s;animation-delay:.4s;box-shadow:0 0 14px #c084fc}
.p3{width:5px;height:5px;top:30%;left:80%;animation-duration:2.8s;animation-delay:.8s;box-shadow:0 0 10px #22d3ee}
.p4{width:6px;height:6px;top:70%;left:75%;animation-duration:3.5s;animation-delay:.3s;box-shadow:0 0 14px #818cf8}
.p5{width:5px;height:5px;top:15%;left:60%;animation-duration:2.6s;animation-delay:.6s;box-shadow:0 0 10px #38bdf8}
.p6{width:7px;height:7px;top:45%;left:90%;animation-duration:3.8s;animation-delay:1s;box-shadow:0 0 16px #f472b6}
@keyframes pFloat{0%{transform:translateY(0) scale(1);opacity:.4}100%{transform:translateY(-35px) scale(1.6);opacity:1}}
.photo-banner .pb-overlay{position:relative;z-index:2;width:100%;display:flex;align-items:center;justify-content:center;padding:64px 20px}
.photo-banner .pb-in{text-align:center;color:#fff;max-width:960px;width:100%}
.pb-title{font-size:clamp(26px,4vw,46px);font-weight:800;letter-spacing:-1px;margin-bottom:38px;line-height:1.2;background:linear-gradient(90deg,#ffffff 0%,#93c5fd 25%,#e9d5ff 50%,#93c5fd 75%,#ffffff 100%);background-size:200% auto;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:titleShimmer 4s linear infinite}
@keyframes titleShimmer{0%{background-position:0% center}100%{background-position:200% center}}
.pb-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;justify-content:center;max-width:920px;margin:0 auto}
.pb-stat{background:rgba(255,255,255,.07);border:1.5px solid rgba(255,255,255,.18);backdrop-filter:blur(16px);border-radius:22px;padding:28px 22px;text-align:center;position:relative;overflow:hidden;box-shadow:0 14px 40px rgba(0,0,0,.35),inset 0 1px 1px rgba(255,255,255,.2);transition:all .3s cubic-bezier(0.2,0.8,0.2,1)}
.pb-stat::before{content:'';position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(circle,rgba(255,255,255,.15) 0%,transparent 60%);opacity:0;transition:opacity .3s ease;pointer-events:none}
.pb-stat:hover::before{opacity:1}
.pb-stat-1{animation:floatCard1 2.8s ease-in-out infinite alternate}
.pb-stat-2{animation:floatCard2 3.1s ease-in-out infinite alternate;animation-delay:.3s}
.pb-stat-3{animation:floatCard3 2.7s ease-in-out infinite alternate;animation-delay:.6s}
.pb-stat-4{animation:floatCard4 3.3s ease-in-out infinite alternate;animation-delay:.9s}
@keyframes floatCard1{0%{transform:translateY(0) rotate(0deg);box-shadow:0 10px 30px rgba(59,91,255,.25)}100%{transform:translateY(-14px) rotate(-1deg);box-shadow:0 22px 48px rgba(59,91,255,.45)}}
@keyframes floatCard2{0%{transform:translateY(0) rotate(0deg);box-shadow:0 10px 30px rgba(139,62,242,.25)}100%{transform:translateY(-16px) rotate(1.2deg);box-shadow:0 24px 52px rgba(139,62,242,.45)}}
@keyframes floatCard3{0%{transform:translateY(0) rotate(0deg);box-shadow:0 10px 30px rgba(34,211,238,.2)}100%{transform:translateY(-13px) rotate(-1deg);box-shadow:0 20px 45px rgba(34,211,238,.4)}}
@keyframes floatCard4{0%{transform:translateY(0) rotate(0deg);box-shadow:0 10px 30px rgba(236,72,153,.25)}100%{transform:translateY(-15px) rotate(1deg);box-shadow:0 22px 50px rgba(236,72,153,.45)}}
.pb-stat:hover{background:rgba(255,255,255,.14);border-color:rgba(96,165,250,.8);transform:translateY(-20px) scale(1.06) !important;box-shadow:0 28px 60px rgba(59,91,255,.5) !important}
.pb-stat strong{display:block;font-size:clamp(30px,3.8vw,48px);font-weight:800;letter-spacing:-1.5px;line-height:1.05;margin-bottom:8px;background:linear-gradient(135deg,#60a5fa,#c084fc,#38bdf8);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;text-shadow:0 0 25px rgba(96,165,250,.4)}
.pb-stat span{font-size:12px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:#cbd5e1;display:block}
@media(max-width:768px){.pb-stats{grid-template-columns:repeat(2,1fr);gap:16px}.pb-stat{padding:22px 16px}}
@media(max-width:420px){.pb-stats{grid-template-columns:1fr 1fr;gap:12px}.pb-stat strong{font-size:26px}.pb-stat span{font-size:10.5px}}

/* TILT */
.tilt{transform-style:preserve-3d;transition:transform .15s ease}

/* NAV - Pure Neumorphic Soft UI Theme */
.nav{
  position:fixed;
  top:14px;
  left:20px;
  right:20px;
  z-index:10000 !important;
  background:linear-gradient(145deg, #f7f9fd 0%, #e5e9f2 100%);
  border-radius:50px;
  border:1px solid rgba(215,222,235,0.8);
  box-shadow:0 4px 18px rgba(15,23,42,0.06), 0 1px 3px rgba(15,23,42,0.03);
  transition:all .35s cubic-bezier(0.16,1,0.3,1);
  overflow:visible;
}
.nav.menu-open{
  z-index:10001 !important;
  overflow:visible!important;
}
.nav::before,
.nav::after{
  content:none;
  display:none;
}
.nav.s{
  background:linear-gradient(145deg, #f8fafd 0%, #e2e7f0 100%);
  border-color:rgba(200,210,225,0.9);
  box-shadow:0 8px 24px rgba(15,23,42,0.08), 0 2px 6px rgba(15,23,42,0.04);
}
.nav.nav-hidden{
  transform:translateY(-160%) !important;
  pointer-events:none !important;
  opacity:0 !important;
}
.nav-in{width:100%;max-width:100%;margin:0;padding:0 16px 0 18px;height:66px;display:flex;align-items:center;justify-content:space-between;gap:10px;position:relative;z-index:2;min-width:0;box-sizing:border-box}
.nav-logo{display:flex;align-items:center;gap:10px;flex-shrink:0;text-decoration:none;margin-right:6px}
.nav-ico{width:40px;height:40px;object-fit:contain;background:transparent;border-radius:0;padding:0;border:none;box-shadow:none;mix-blend-mode:multiply;transition:all .28s cubic-bezier(0.16,1,0.3,1)}
.nav-logo:hover .nav-ico{transform:translateY(-2px) scale(1.05);box-shadow:none;filter:drop-shadow(0 3px 6px rgba(150,164,188,0.4))}
.nav-txt strong{font-size:14.5px;font-weight:800;color:#131826;display:block;line-height:1.2;letter-spacing:-0.3px;white-space:nowrap}
.nav-txt strong em{color:var(--blue);font-style:normal}
.nav-txt small{font-size:10px;color:#64748b;font-weight:600;letter-spacing:0.2px;display:block;white-space:nowrap}
.nav-ul{display:flex;align-items:center;gap:2px;margin:0 0 0 auto;background:linear-gradient(145deg, #ffffff 0%, #e8ecf6 100%);border:1.5px solid rgba(215,222,235,0.9);border-radius:50px;padding:4px 6px;box-shadow:0 4px 14px rgba(15,23,42,0.08), 0 1px 3px rgba(15,23,42,0.04);transition:all .3s cubic-bezier(0.16,1,0.3,1);max-width:calc(100% - 195px);overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;flex-shrink:1;white-space:nowrap}
.nav-ul::-webkit-scrollbar{display:none}
.nav-ul:hover{box-shadow:0 6px 18px rgba(15,23,42,0.1), 0 2px 5px rgba(15,23,42,0.05)}
.nav-ul a{display:inline-flex;align-items:center;gap:3.5px;font-size:11px;font-weight:650;color:#475569;padding:5px 8px;border-radius:50px;border:1px solid transparent;background:transparent;box-shadow:none;transition:all .22s cubic-bezier(0.16,1,0.3,1);white-space:nowrap;text-decoration:none;user-select:none}
.nav-ul a svg{width:12px;height:12px;flex-shrink:0;color:#64748b;transition:all .22s cubic-bezier(0.16,1,0.3,1)}
.nav-ul a:hover{color:var(--blue);background:#ffffff;border-color:rgba(215,222,235,0.8);box-shadow:0 2px 6px rgba(15,23,42,0.08);transform:translateY(-1px)}
.nav-ul a:hover svg{color:var(--blue);transform:scale(1.15)}
.nav-ul a:active{background:#e2e6f0;box-shadow:inset 1px 1px 3px rgba(15,23,42,0.1);transform:translateY(0.5px) scale(0.98)}
.nav-ul a.on{background:linear-gradient(145deg, #3d75fd 0%, #2558ea 50%, #1742d4 100%);color:#ffffff;border-color:transparent;box-shadow:0 3px 10px rgba(23,66,212,0.35);text-shadow:0 1px 2px rgba(10,25,90,0.35);font-weight:700;transform:translateY(-0.5px)}
.nav-ul a.on svg{color:#ffffff;transform:scale(1.1);filter:drop-shadow(0 1px 2px rgba(10,25,90,0.3))}
.nav-ul a.on:hover{background:linear-gradient(145deg, #4880ff 0%, #2c60f2 50%, #1a47dc 100%);box-shadow:0 4px 14px rgba(23,66,212,0.42);transform:translateY(-1px);color:#ffffff}
.nav-ul a.on:active{box-shadow:inset 2px 2px 4px rgba(8,20,95,0.4);transform:translateY(0.5px) scale(0.98)}
.nav-btn{background:linear-gradient(145deg, #3d75fd 0%, #2558ea 50%, #1742d4 100%);color:#ffffff;box-shadow:0 4px 14px rgba(23,66,212,0.35);border:none;border-radius:50px;font-weight:700;transition:all .25s ease}
.nav-btn:hover{transform:translateY(-2px) scale(1.03);box-shadow:0 6px 18px rgba(23,66,212,0.45)}
.nav-btn:active{transform:translateY(0.5px) scale(0.98);box-shadow:inset 2px 2px 4px rgba(8,20,95,0.4)}
.hbg{
  display:none;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  width:40px;
  height:40px;
  background:linear-gradient(135deg, rgba(255,255,255,0.85) 0%, rgba(238,244,255,0.55) 50%, rgba(220,235,255,0.75) 100%);
  backdrop-filter:blur(16px) saturate(180%);
  -webkit-backdrop-filter:blur(16px) saturate(180%);
  border:1.5px solid rgba(255,255,255,0.95);
  border-radius:12px;
  box-shadow:0 6px 18px -2px rgba(59,91,255,0.18), 0 2px 6px rgba(15,23,42,0.06), inset 0 1px 2px rgba(255,255,255,1), inset 0 -1px 2px rgba(59,91,255,0.14);
  cursor:pointer;
  padding:0;
  margin-left:auto;
  gap:5px;
  transition:all .3s cubic-bezier(0.4,0,0.2,1);
  position:relative;
  z-index:10005;
  pointer-events:auto;
  -webkit-tap-highlight-color:transparent;
  touch-action:manipulation;
}
.hbg:hover{
  background:linear-gradient(135deg, rgba(255,255,255,0.95) 0%, rgba(228,239,255,0.75) 100%);
  border-color:rgba(255,255,255,1);
  box-shadow:0 8px 24px -2px rgba(59,91,255,0.28), inset 0 1px 2px rgba(255,255,255,1), inset 0 -1px 2px rgba(59,91,255,0.22);
  transform:scale(1.04);
}
.hbg span{
  display:block;
  width:20px;
  height:2.2px;
  background:var(--text-dark);
  border-radius:3px;
  transition:all .3s cubic-bezier(0.4,0,0.2,1);
  transform-origin:center;
  pointer-events:none;
}
.hbg.active{
  background:linear-gradient(135deg, rgba(238,244,255,0.95) 0%, rgba(215,232,255,0.85) 100%);
  border-color:rgba(59,91,255,0.4);
  box-shadow:0 6px 22px -2px rgba(59,91,255,0.3), inset 0 1px 2px rgba(255,255,255,1);
}
.hbg.active span:nth-child(1){
  transform:translateY(7px) rotate(45deg);
  background:var(--blue);
}
.hbg.active span:nth-child(2){
  opacity:0;
  transform:scaleX(0);
}
.hbg.active span:nth-child(3){
  transform:translateY(-7px) rotate(-45deg);
  background:var(--blue);
}

/* Mobile Navigation Backdrop Overlay */
.nav-overlay{
  position:fixed;
  inset:0;
  background:rgba(8,11,22,0.48);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  z-index:9990;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .35s cubic-bezier(0.16,1,0.3,1), visibility .35s ease, backdrop-filter .35s ease;
}
.nav-overlay.open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}
body.nav-open-lock{
  overflow:hidden!important;
}

/* HERO */
.hero{
  min-height:100vh;
  margin-top:0;
  background-color:var(--bg-cream);
  background-image:
    linear-gradient(to right, rgba(45,38,28,0.04) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(45,38,28,0.04) 1px, transparent 1px);
  background-size:46px 46px;
  background-position:-1px -1px;
  position:relative;
  overflow:hidden;
  display:flex;
  align-items:center;
  padding:118px 0 60px;
}
.hero-deco{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:0}

/* HERO GLOW ORBS - LIVE FLOATING BACKGROUND BLOBS */
.hero-glow-orb{position:absolute;border-radius:50%;pointer-events:none;will-change:transform}
.hero-glow-orb.orb-1{
  width:620px;height:620px;
  background:radial-gradient(circle at 40% 40%, rgba(40,69,238,0.16) 0%, rgba(147,197,253,0.1) 45%, transparent 72%);
  top:-100px;right:-80px;filter:blur(65px);
  animation:heroOrbFloat1 13s ease-in-out infinite alternate;
}
.hero-glow-orb.orb-2{
  width:540px;height:540px;
  background:radial-gradient(circle at 50% 50%, rgba(220,210,180,0.2) 0%, rgba(40,69,238,0.08) 45%, transparent 70%);
  bottom:-120px;left:-90px;filter:blur(60px);
  animation:heroOrbFloat2 15s ease-in-out infinite alternate;
}
.hero-glow-orb.orb-3{
  width:440px;height:440px;
  background:radial-gradient(circle at 45% 45%, rgba(14,165,233,0.12) 0%, rgba(40,69,238,0.08) 50%, transparent 72%);
  top:28%;right:12%;filter:blur(52px);
  animation:heroOrbFloat3 11s ease-in-out infinite alternate;
}
.hero-glow-orb.orb-4{
  width:380px;height:380px;
  background:radial-gradient(circle at 50% 50%, rgba(225,215,190,0.18) 0%, rgba(40,69,238,0.06) 45%, transparent 70%);
  top:-40px;left:18%;filter:blur(48px);
  animation:heroOrbFloat4 16s ease-in-out infinite alternate;
}
.hero-glow-orb.orb-5{
  width:480px;height:480px;
  background:radial-gradient(circle at 40% 40%, rgba(40,69,238,0.12) 0%, rgba(215,205,175,0.14) 48%, transparent 72%);
  bottom:-60px;right:6%;filter:blur(58px);
  animation:heroOrbFloat5 14s ease-in-out infinite alternate;
}

@keyframes heroOrbFloat1{
  0%{transform:translate3d(0,0,0) scale(1)}
  50%{transform:translate3d(-80px,50px,0) scale(1.14)}
  100%{transform:translate3d(-140px,-35px,0) scale(0.94)}
}
@keyframes heroOrbFloat2{
  0%{transform:translate3d(0,0,0) scale(0.96)}
  50%{transform:translate3d(85px,-60px,0) scale(1.16)}
  100%{transform:translate3d(140px,35px,0) scale(1)}
}
@keyframes heroOrbFloat3{
  0%{transform:translate3d(0,0,0) scale(1)}
  50%{transform:translate3d(-60px,-50px,0) scale(1.18)}
  100%{transform:translate3d(45px,60px,0) scale(1.04)}
}
@keyframes heroOrbFloat4{
  0%{transform:translate3d(0,0,0) scale(1)}
  50%{transform:translate3d(60px,70px,0) scale(1.12)}
  100%{transform:translate3d(-35px,100px,0) scale(0.94)}
}
@keyframes heroOrbFloat5{
  0%{transform:translate3d(0,0,0) scale(0.95)}
  50%{transform:translate3d(-75px,-55px,0) scale(1.15)}
  100%{transform:translate3d(55px,-90px,0) scale(0.92)}
}

/* HERO FLOATING 3D GLASS BUBBLES */
.hero-bubble{
  position:absolute;
  border-radius:50%;
  pointer-events:none;
  background:radial-gradient(circle at 30% 28%, rgba(255,255,255,0.92) 0%, rgba(255,255,255,0.45) 20%, rgba(59,91,255,0.14) 55%, rgba(139,62,242,0.2) 80%, rgba(34,211,238,0.26) 100%);
  border:1.5px solid rgba(255,255,255,0.85);
  box-shadow:
    0 12px 32px -4px rgba(59,91,255,0.12),
    inset 0 3px 6px rgba(255,255,255,0.95),
    inset 0 -3px 8px rgba(59,91,255,0.15);
  backdrop-filter:blur(4px);
  -webkit-backdrop-filter:blur(4px);
  will-change:transform;
}
.hero-bubble::before{
  content:'';
  position:absolute;
  top:15%;
  left:20%;
  width:24%;
  height:18%;
  border-radius:50%;
  background:rgba(255,255,255,0.95);
  transform:rotate(-35deg);
  filter:blur(0.5px);
}
.hero-bubble::after{
  content:'';
  position:absolute;
  bottom:18%;
  right:20%;
  width:14%;
  height:12%;
  border-radius:50%;
  background:rgba(255,255,255,0.6);
  filter:blur(1px);
}

/* Bubble Placements & Animations */
.hb-1{width:130px;height:130px;top:12%;right:10%;animation:bMov1 8.5s ease-in-out infinite alternate}
.hb-2{width:86px;height:86px;top:32%;right:24%;animation:bMov2 10s ease-in-out infinite alternate}
.hb-3{width:64px;height:64px;top:60%;right:7%;animation:bMov3 7.5s ease-in-out infinite alternate}
.hb-4{width:108px;height:108px;bottom:10%;right:18%;animation:bMov4 11.5s ease-in-out infinite alternate}
.hb-5{width:76px;height:76px;bottom:22%;left:6%;animation:bMov5 9s ease-in-out infinite alternate}
.hb-6{width:56px;height:56px;top:16%;left:44%;animation:bMov6 10.5s ease-in-out infinite alternate}
.hb-7{width:48px;height:48px;top:46%;left:50%;animation:bMov7 8s ease-in-out infinite alternate}
.hb-8{width:38px;height:38px;top:8%;right:36%;animation:bMov8 7s ease-in-out infinite alternate}
.hb-9{width:32px;height:32px;bottom:20%;right:40%;animation:bMov9 8.5s ease-in-out infinite alternate}
.hb-10{width:24px;height:24px;top:72%;left:28%;animation:bMov10 6.5s ease-in-out infinite alternate}
.hb-11{width:92px;height:92px;bottom:6%;left:36%;animation:bMov11 12.5s ease-in-out infinite alternate}
.hb-12{width:42px;height:42px;top:26%;left:16%;animation:bMov12 9.5s ease-in-out infinite alternate}

@keyframes bMov1{
  0%{transform:translate3d(0,0,0) rotate(0deg)}
  50%{transform:translate3d(-40px,-45px,0) rotate(10deg)}
  100%{transform:translate3d(30px,-75px,0) rotate(-8deg)}
}
@keyframes bMov2{
  0%{transform:translate3d(0,0,0) rotate(0deg)}
  50%{transform:translate3d(35px,-40px,0) rotate(-12deg)}
  100%{transform:translate3d(-25px,-60px,0) rotate(10deg)}
}
@keyframes bMov3{
  0%{transform:translate3d(0,0,0)}
  50%{transform:translate3d(-30px,35px,0)}
  100%{transform:translate3d(35px,-30px,0)}
}
@keyframes bMov4{
  0%{transform:translate3d(0,0,0) scale(1)}
  50%{transform:translate3d(-45px,-40px,0) scale(1.08)}
  100%{transform:translate3d(25px,-55px,0) scale(0.95)}
}
@keyframes bMov5{
  0%{transform:translate3d(0,0,0)}
  50%{transform:translate3d(40px,-35px,0)}
  100%{transform:translate3d(-30px,-50px,0)}
}
@keyframes bMov6{
  0%{transform:translate3d(0,0,0) scale(1)}
  50%{transform:translate3d(-25px,40px,0) scale(1.12)}
  100%{transform:translate3d(35px,25px,0) scale(0.9)}
}
@keyframes bMov7{
  0%{transform:translate3d(0,0,0)}
  50%{transform:translate3d(30px,-30px,0)}
  100%{transform:translate3d(-35px,-40px,0)}
}
@keyframes bMov8{
  0%{transform:translate3d(0,0,0)}
  50%{transform:translate3d(-24px,30px,0)}
  100%{transform:translate3d(25px,-25px,0)}
}
@keyframes bMov9{
  0%{transform:translate3d(0,0,0)}
  50%{transform:translate3d(20px,-25px,0)}
  100%{transform:translate3d(-18px,20px,0)}
}
@keyframes bMov10{
  0%{transform:translate3d(0,0,0)}
  50%{transform:translate3d(-18px,-24px,0)}
  100%{transform:translate3d(18px,-35px,0)}
}
@keyframes bMov11{
  0%{transform:translate3d(0,0,0) scale(1)}
  50%{transform:translate3d(35px,-45px,0) scale(1.08)}
  100%{transform:translate3d(-30px,-25px,0) scale(0.94)}
}
@keyframes bMov12{
  0%{transform:translate3d(0,0,0)}
  50%{transform:translate3d(-25px,30px,0)}
  100%{transform:translate3d(26px,-35px,0)}
}
.hero-in{max-width:1320px;margin:0 auto;padding:0 36px;display:flex;justify-content:flex-start;align-items:center;text-align:left;position:relative;z-index:1;width:100%}
.hero-left{display:flex;flex-direction:column;align-items:flex-start;text-align:left;max-width:820px;width:100%}
.hero-badge{display:inline-flex;align-items:center;gap:8px;background:var(--bg-cream-card);backdrop-filter:blur(12px);border:1.5px solid var(--border-card);border-radius:50px;padding:7px 18px;font-size:12px;font-weight:700;letter-spacing:.5px;color:var(--blue);margin-bottom:22px;box-shadow:var(--shadow-soft)}
.hb-dot{width:8px;height:8px;border-radius:50%;background:var(--blue);box-shadow:0 0 8px rgba(40,69,238,.7);animation:pulseDot 2s infinite}
@keyframes pulseDot{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.25);opacity:.7}}
.hero-h1{font-size:clamp(34px,4.3vw,54px);font-weight:800;color:var(--text-dark);line-height:1.15;margin-bottom:28px;letter-spacing:-1.5px;text-align:left}
.hero-underline{position:relative;display:inline-block;padding-bottom:6px}
.hero-underline::after{content:'';position:absolute;bottom:0;left:0;width:0%;height:5px;background:linear-gradient(90deg,#2845EE,#7c3aed,#0ea5e9);border-radius:4px;transition:width 0.8s cubic-bezier(0.25,1,0.5,1);box-shadow:0 2px 10px rgba(40,69,238,.35)}
.hero-underline.active::after{width:100%}
.typing-cursor{display:inline-block;color:var(--blue);font-weight:400;margin-left:2px;animation:cursorBlink 0.7s infinite;transition:opacity 0.5s ease}
@keyframes cursorBlink{0%,100%{opacity:1}50%{opacity:0}}
.hero-p{font-size:16px;color:var(--text-sub);line-height:1.75;margin-bottom:30px;max-width:510px}
.hero-btns{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin-bottom:0;justify-content:flex-start;width:100%}
.btn-blue{background:linear-gradient(135deg,#2845EE,#1d35c7);color:#fff;padding:13px 28px;border-radius:50px;font-size:14px;font-weight:700;transition:all .25s ease;box-shadow:0 8px 24px -2px rgba(40,69,238,.38), inset 0 1px 1px rgba(255,255,255,.35);border:1px solid rgba(255,255,255,.2);display:inline-flex;align-items:center;gap:8px}
.btn-blue:hover{background:linear-gradient(135deg,#1d35c7,#15289f);transform:translateY(-2px);box-shadow:0 12px 30px rgba(40,69,238,.48)}
.btn-blue svg{transition:transform .2s ease}
.btn-blue:hover svg{transform:translateX(3px)}
.btn-out{background:var(--bg-cream-soft);backdrop-filter:blur(10px);border:1.5px solid var(--border-card);color:var(--text-dark);padding:12px 26px;border-radius:50px;font-size:14px;font-weight:700;transition:all .25s ease;display:inline-flex;align-items:center;gap:8px;box-shadow:0 4px 16px rgba(45,38,28,.04), inset 0 1px 0 #fff}
.btn-out:hover{background:var(--bg-cream-card);border-color:var(--blue);color:var(--blue);transform:translateY(-2px);box-shadow:0 6px 20px rgba(40,69,238,.16)}
.hero-trust{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.hero-trust.liquid-glass{
  display:inline-flex;
  align-items:center;
  gap:16px;
  padding:10px 22px;
  background:radial-gradient(135% 120% at 20% 0%, rgba(253,252,249,0.95) 0%, rgba(245,243,237,0.8) 100%);
  backdrop-filter:blur(20px) saturate(160%);
  -webkit-backdrop-filter:blur(20px) saturate(160%);
  border-radius:50px;
  border:1.5px solid rgba(255,255,255,1);
  box-shadow:0 10px 28px -4px rgba(45,38,28,0.06), 0 2px 8px rgba(45,38,28,0.02), inset 0 1.5px 2px rgba(255,255,255,1), inset 0 -1px 2px rgba(40,69,238,0.04);
  margin-top:24px;
}
.trust-item{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600;color:#64748b}
.trust-glass-sep{width:1.5px;height:18px;background:linear-gradient(to bottom, rgba(59,91,255,0.05), rgba(59,91,255,0.35), rgba(59,91,255,0.05));border-radius:2px;flex-shrink:0}
.trust-score strong{color:var(--blue);font-weight:800}
.trust-stars{color:#f59e0b;font-size:12px;letter-spacing:1px;filter:drop-shadow(0 1px 3px rgba(245,158,11,0.4))}
.trust-lbl{color:#64748b;font-size:11px;font-weight:600}
.trust-svg{width:14px;height:14px;flex-shrink:0}
.trust-svg.prj-svg{color:var(--blue)}
.trust-svg.cli-svg{color:#7c3aed}
.hero-mobile-visual{display:none}
@keyframes flt{from{transform:translateY(0)}to{transform:translateY(-16px)}}

/* SIGNATURE: LIVE TERMINAL CARD */
.term-card{background:var(--dark);border-radius:16px;padding:0;box-shadow:0 24px 60px rgba(8,11,22,.35);border:1px solid rgba(255,255,255,.08);animation:flt 6s ease-in-out infinite alternate;overflow:hidden}
.term-top{display:flex;align-items:center;gap:8px;padding:14px 18px;background:rgba(255,255,255,.03);border-bottom:1px solid rgba(255,255,255,.06)}
.term-dot{width:10px;height:10px;border-radius:50%}
.term-dot.r{background:#ff5f57}.term-dot.y{background:#febc2e}.term-dot.g{background:#28c840}
.term-title{margin-left:8px;font-family:var(--mono);font-size:11px;color:#8b93a8;letter-spacing:.5px}
.term-body{padding:22px 20px 28px;font-family:var(--mono);font-size:13px;line-height:2;min-height:190px}
.term-line{color:#8b93a8;white-space:pre-wrap;word-break:break-word}
.term-prompt{color:var(--cyan)}
.term-out{color:#c7d3f5}
.term-out .ok{color:#4ade80}
.term-cursor{display:inline-block;width:7px;height:15px;background:var(--cyan);vertical-align:middle;margin-left:2px;animation:blink 1s step-end infinite}
@keyframes blink{50%{opacity:0}}

.fbadge{position:absolute;background:var(--bg-cream-card);border:1px solid var(--border-card);border-radius:50px;padding:10px 16px;display:flex;align-items:center;gap:8px;box-shadow:var(--shadow-soft);font-size:12px;font-weight:600;color:var(--text-dark);white-space:nowrap}
.fbd{width:7px;height:7px;border-radius:50%;flex-shrink:0}
.fbd.g{background:#22c55e;box-shadow:0 0 8px rgba(34,197,94,.6)}
.fbd.b{background:var(--blue);box-shadow:0 0 8px rgba(59,91,255,.6)}
.fb-tl{top:-8px;left:-16px;animation:flt 5s ease-in-out 1s infinite alternate}
.fb-br{bottom:8px;right:-16px;animation:flt 5s ease-in-out 2s infinite alternate}

/* MARQUEE */
.mq{background:var(--blue);padding:14px 0;overflow:hidden;position:relative;z-index:10}
.mq-top{display:none!important}
.mq-track{display:flex;gap:28px;white-space:nowrap;animation:mqs 28s linear infinite;width:max-content}
.mq-track span{font-size:12px;font-weight:600;color:rgba(255,255,255,.7);text-transform:uppercase;letter-spacing:2px}
.mq-track .dot{color:rgba(255,255,255,.4)}
@keyframes mqs{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* VISION MISSION */
.vmc{background:linear-gradient(180deg,var(--bg-cream) 0%,var(--bg-cream-card) 50%,var(--bg-cream) 100%);position:relative}
.vmc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:56px}
.vmc-card{background:var(--bg-cream-card);border-radius:24px;padding:40px 32px;border:1px solid var(--border-card);box-shadow:var(--shadow-soft);transition:all .3s ease}
.vmc-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-4px);border-color:var(--blue-m)}
.vmc-ico{width:70px;height:70px;border-radius:20px;display:flex;align-items:center;justify-content:center;margin-bottom:24px;transition:all .35s ease;position:relative;overflow:hidden;box-shadow:0 8px 24px rgba(40,69,238,.14)}
.vmc-card:hover .vmc-ico{transform:scale(1.12) translateY(-3px) rotate(-3deg);box-shadow:0 14px 30px rgba(40,69,238,.24)}
.vmc-card h3{font-size:20px;font-weight:800;color:var(--text-dark);margin-bottom:12px;letter-spacing:-.5px}
.vmc-card p{font-size:15px;color:var(--muted);line-height:1.75}

/* SERVICES */
.services{background:linear-gradient(180deg,var(--bg-cream-card) 0%,var(--bg-cream) 100%);position:relative}
.svc-head{display:grid;grid-template-columns:1fr auto;gap:40px;align-items:center;margin-bottom:56px}
.svc-head-right{display:flex;flex-direction:column;align-items:flex-end;gap:14px;text-align:right;min-width:260px}
.svc-head-right p{font-size:15px;color:var(--muted);text-align:right;max-width:260px;line-height:1.7}
.svc-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;align-items:start}
.svc-card{background:var(--bg-cream-card);border:1.5px solid var(--border-card);border-radius:22px;padding:28px 22px;position:relative;transition:all .35s cubic-bezier(0.16,1,0.3,1);cursor:pointer;overflow:hidden;box-shadow:var(--shadow-soft);user-select:none;-webkit-user-select:none}
.svc-card:hover{border-color:var(--blue);box-shadow:var(--shadow-lg);transform:translateY(-4px)}
.svc-card.is-open{border-color:var(--blue);box-shadow:0 16px 36px rgba(40,69,238,0.18), -6px -6px 20px #ffffff;background:linear-gradient(180deg, #ffffff 0%, var(--bg-cream-card) 100%)}
.svc-ico{width:60px;height:60px;border-radius:16px;display:flex;align-items:center;justify-content:center;margin-bottom:20px;transition:all .3s ease;box-shadow:0 8px 22px rgba(40,69,238,.12);position:relative;overflow:hidden}
.svc-ico img{width:100%;height:100%;object-fit:cover;border-radius:16px}
.svc-card:hover .svc-ico{transform:scale(1.12) translateY(-2px) rotate(-3deg);box-shadow:0 14px 30px rgba(40,69,238,.22)}
.ic-b{background:linear-gradient(135deg,#eff6ff,#dbeafe);color:var(--blue);border:1px solid #bfdbfe}
.ic-p{background:linear-gradient(135deg,#f5f3ff,#ede9fe);color:var(--purple);border:1px solid #ddd6fe}
.ic-c{background:linear-gradient(135deg,#ecfeff,#cffafe);color:#0891b2;border:1px solid #a5f3fc}
.ic-g{background:linear-gradient(135deg,#f0fdf4,#dcfce7);color:#16a34a;border:1px solid #bbf7d0}
.ic-o{background:linear-gradient(135deg,#fff7ed,#ffedd5);color:#ea580c;border:1px solid #fed7aa}
.ic-pk{background:linear-gradient(135deg,#fdf2f8,#fce7f3);color:#db2777;border:1px solid #fbcfe8}
.svc-num{font-family:var(--mono);font-size:10px;font-weight:700;color:#cbd5e1;letter-spacing:2px;margin-bottom:8px}
.svc-card h3{font-size:14px;font-weight:700;color:var(--text-dark);margin-bottom:8px;line-height:1.35}
.svc-card p{font-size:12px;color:var(--muted);line-height:1.65}
.svc-arrow{position:absolute;top:22px;right:22px;width:26px;height:26px;border-radius:50%;border:1px solid var(--border-card);display:flex;align-items:center;justify-content:center;font-size:12px;color:#cbd5e1;transition:all .35s cubic-bezier(0.16,1,0.3,1)}
.svc-card:hover .svc-arrow{background:var(--blue);border-color:var(--blue);color:#fff;transform:translate(2px,-2px)}
.svc-card.is-open .svc-arrow{background:var(--blue);border-color:var(--blue);color:#fff;transform:rotate(90deg) scale(1.08)}
.svc-line{position:absolute;bottom:0;left:0;right:0;height:3px;background:var(--grad);transform:scaleX(0);transform-origin:left;transition:transform .3s}
.svc-card:hover .svc-line, .svc-card.is-open .svc-line{transform:scaleX(1)}

/* ── ULTRA-MODERN SERVICE SLIP & TICKET UI ── */
.svc-trigger-btn{
  display:inline-flex;
  align-items:center;
  gap:7px;
  margin-top:14px;
  padding:7px 16px;
  background:linear-gradient(145deg, #ffffff 0%, #edf1f8 100%);
  border:1.5px solid rgba(40, 69, 238, 0.16);
  border-radius:50px;
  font-size:11.5px;
  font-weight:700;
  color:var(--blue);
  box-shadow:0 3px 8px rgba(166, 175, 195, 0.25), inset 0 1px 1px #ffffff;
  transition:all .25s cubic-bezier(0.16, 1, 0.3, 1);
  cursor:pointer;
  pointer-events:none; /* card handles click */
}
.svc-card:hover .svc-trigger-btn{
  background:linear-gradient(135deg, #2845EE 0%, #1d35c7 100%);
  color:#ffffff;
  border-color:transparent;
  transform:translateY(-1px);
  box-shadow:0 6px 16px rgba(40, 69, 238, 0.35);
}
.svc-card.is-open .svc-trigger-btn{
  background:rgba(40, 69, 238, 0.08);
  color:var(--blue);
  border-color:rgba(40, 69, 238, 0.25);
  box-shadow:none;
}
.stb-arrow{
  font-size:11px;
  transition:transform .3s cubic-bezier(0.16, 1, 0.3, 1);
  display:inline-block;
}
.svc-card.is-open .stb-arrow{
  transform:rotate(180deg);
}

/* Slip Drawer Container */
.svc-slip{
  max-height:0;
  opacity:0;
  overflow:hidden;
  transform:translateY(-10px) scale(0.98);
  transition:max-height .48s cubic-bezier(0.16, 1, 0.3, 1),
             opacity .32s ease,
             transform .35s cubic-bezier(0.16, 1, 0.3, 1),
             margin .32s ease;
  margin-top:0;
  width:100%;
}
.svc-card.is-open .svc-slip{
  max-height:650px;
  opacity:1;
  transform:translateY(0) scale(1);
  margin-top:16px;
}

/* Digital Ticket / Slip Card */
.svc-slip-card{
  background:linear-gradient(180deg, #ffffff 0%, #f8faff 100%);
  border-radius:20px;
  border:1.5px solid rgba(40, 69, 238, 0.16);
  padding:18px 15px 15px;
  position:relative;
  box-shadow:
    0 16px 36px -6px rgba(40, 69, 238, 0.14),
    0 4px 12px rgba(15, 23, 42, 0.04),
    inset 0 1px 0 #ffffff;
}
/* Perforated ticket top */
.svc-slip-card::before{
  content:'';
  position:absolute;
  top:-2px;
  left:16px;
  right:16px;
  height:3px;
  background:radial-gradient(circle, var(--blue) 1.2px, transparent 1.6px);
  background-size:9px 3px;
  opacity:0.45;
}

/* Slip Header */
.svc-slip-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:12px;
  padding-bottom:9px;
  border-bottom:1px dashed rgba(40, 69, 238, 0.18);
}
.ssh-left{
  display:flex;
  align-items:center;
  gap:7px;
}
.ssh-dot{
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--blue);
  box-shadow:0 0 8px rgba(40, 69, 238, 0.6);
  animation:sshPulse 2s infinite ease-in-out;
}
@keyframes sshPulse{
  0%,100%{opacity:1;transform:scale(1)}
  50%{opacity:0.4;transform:scale(0.85)}
}
.ssh-label{
  font-family:var(--mono);
  font-size:10px;
  font-weight:800;
  color:var(--blue);
  letter-spacing:1.2px;
  text-transform:uppercase;
}
.ssh-badge{
  font-size:10px;
  font-weight:750;
  color:#15803d;
  background:#dcfce7;
  border:1px solid rgba(34, 197, 94, 0.3);
  padding:2.5px 8px;
  border-radius:50px;
}

/* Feature Chips 2x2 Grid */
.svc-chips-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin-bottom:12px;
}
.svc-chip{
  display:flex;
  align-items:center;
  gap:7px;
  background:#ffffff;
  border:none;
  box-shadow:0 0 0 1px rgba(40,69,238,0.1), 0 2px 5px rgba(15,23,42,0.03);
  padding:8px 9px;
  border-radius:12px;
  transition:all .22s ease;
}
.svc-chip:hover{
  box-shadow:0 0 0 1.5px rgba(40,69,238,0.3), 0 4px 10px rgba(40,69,238,0.08);
  background:#f6f8ff;
  transform:translateY(-1px);
}
.sfc-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  width:18px;
  height:18px;
  flex-shrink:0;
  border:none;
  outline:none;
  background:none;
  box-shadow:none;
}
.sfc-icon svg{
  display:block;
  width:14px;
  height:14px;
  border:none;
  outline:none;
  overflow:visible;
}
.sfc-text{
  font-size:11px;
  font-weight:700;
  color:var(--text-dark);
  line-height:1.25;
  word-break:break-word;
}

/* Trust / Guarantee Strip */
.svc-guar-strip{
  display:flex;
  align-items:center;
  justify-content:space-around;
  background:rgba(40, 69, 238, 0.04);
  border:1px solid rgba(40, 69, 238, 0.09);
  border-radius:12px;
  padding:7px 10px;
  margin-bottom:14px;
  text-align:center;
}
.sgs-col{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:1px;
}
.sgs-val{
  font-size:11px;
  font-weight:800;
  color:#0f172a;
  line-height:1.2;
}
.sgs-sub{
  font-size:9.5px;
  color:#64748b;
  font-weight:600;
  line-height:1.2;
}
.sgs-divider{
  width:1px;
  height:20px;
  background:rgba(40, 69, 238, 0.16);
}

/* 3D Tactile WhatsApp Action Button */
.svc-wa-button{
  display:flex;
  align-items:center;
  justify-content:space-between;
  background:linear-gradient(135deg, #25D366 0%, #128C7E 100%);
  padding:10px 14px;
  border-radius:50px;
  text-decoration:none !important;
  color:#ffffff !important;
  box-shadow:
    0 8px 20px rgba(37, 211, 102, 0.35),
    inset 0 1.5px 1.5px rgba(255, 255, 255, 0.55),
    inset 0 -2px 4px rgba(10, 80, 50, 0.35);
  transition:all .26s cubic-bezier(0.16, 1, 0.3, 1);
  position:relative;
  overflow:hidden;
  width:100%;
  box-sizing:border-box;
}
.svc-wa-button::before{
  content:'';
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:48%;
  background:linear-gradient(180deg, rgba(255, 255, 255, 0.32) 0%, rgba(255, 255, 255, 0) 100%);
  border-radius:50px 50px 0 0;
  pointer-events:none;
}
.svc-wa-button:hover{
  transform:translateY(-2px);
  box-shadow:0 12px 26px rgba(37, 211, 102, 0.48);
  background:linear-gradient(135deg, #22c55e 0%, #0f766e 100%);
  color:#ffffff !important;
}
.svc-wa-button:active{
  transform:scale(0.98);
}
.swb-pulse-wrap{
  width:32px;
  height:32px;
  background:rgba(255, 255, 255, 0.22);
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  box-shadow:0 2px 6px rgba(0, 0, 0, 0.1);
  position:relative;
  z-index:1;
}
.swb-wa-icon{
  display:block;
}
.swb-text-wrap{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  flex:1;
  margin:0 10px;
  text-align:left;
  position:relative;
  z-index:1;
}
.swb-main-text{
  font-size:12.5px;
  font-weight:800;
  color:#ffffff;
  line-height:1.2;
  letter-spacing:-0.2px;
}
.swb-sub-text{
  font-size:9.5px;
  color:rgba(255, 255, 255, 0.88);
  font-weight:600;
  letter-spacing:0.2px;
}
.swb-arrow-icon{
  font-size:13px;
  color:#ffffff;
  transition:transform .2s ease;
  position:relative;
  z-index:1;
}
.svc-wa-button:hover .swb-arrow-icon{
  transform:translateX(4px);
}

@media(max-width:480px){
  .svc-chips-grid{
    grid-template-columns:1fr;
    gap:6px;
  }
}

/* TWO COL FEATURE */
.feature{background:linear-gradient(180deg,#edf2fc 0%,var(--bg-cream) 100%)}
.feat-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.feat-card{background:var(--bg-cream-card);border-radius:26px;padding:44px 40px;border:1px solid var(--border-card);box-shadow:var(--shadow-soft)}
.feat-ico-wrap{width:68px;height:68px;border-radius:20px;display:flex;align-items:center;justify-content:center;margin-bottom:24px;transition:all .35s ease;position:relative;overflow:hidden;box-shadow:0 8px 24px rgba(40,69,238,.15)}
.feat-card:hover .feat-ico-wrap{transform:scale(1.12) translateY(-3px) rotate(-3deg);box-shadow:0 14px 30px rgba(40,69,238,.25)}
.fi-blue{background:var(--blue);box-shadow:0 6px 20px rgba(40,69,238,.3)}
.fi-grad{background:var(--grad);box-shadow:0 6px 20px rgba(124,58,237,.3)}
.feat-card h3{font-size:24px;font-weight:800;color:var(--text-dark);margin-bottom:12px;letter-spacing:-.5px}
.feat-card>p{font-size:15px;color:var(--muted);line-height:1.75;margin-bottom:28px}
.feat-checks{display:flex;flex-direction:column;gap:12px;margin-bottom:28px}
.feat-check{display:flex;align-items:center;gap:12px;font-size:14px;font-weight:600;color:var(--text-dark)}
.fck{width:22px;height:22px;background:var(--blue);border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.btn-solid{display:inline-block;background:var(--blue);color:#fff;padding:12px 28px;border-radius:50px;font-size:14px;font-weight:700;transition:all .25s ease;box-shadow:0 6px 20px rgba(40,69,238,.25),inset 0 1px 0 rgba(255,255,255,0.35)}
.btn-solid:hover{background:var(--blue-d);transform:translateY(-1px)}

/* ABOUT */
.about{background:var(--bg-cream)}
.about-in{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
.about-checks{display:flex;flex-direction:column;gap:12px;margin:24px 0 32px}
.ack{display:flex;align-items:center;gap:12px;font-size:15px;font-weight:500;color:var(--text-dark)}
.ack-ico{width:24px;height:24px;background:var(--blue);border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.about-stat-box{background:linear-gradient(135deg,#0B1130 0%,#1B1150 55%,#2A0F4A 100%);border-radius:24px;padding:36px 32px;border:1px solid rgba(139,62,242,.25);position:relative;overflow:hidden;box-shadow:0 20px 60px rgba(59,91,255,.18)}
.about-stat-box::before{content:'';position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.06) 1px,transparent 1px);background-size:22px 22px;opacity:.7;pointer-events:none}
.about-stat-box::after{content:'';position:absolute;top:-80px;right:-80px;width:250px;height:250px;background:radial-gradient(circle,rgba(139,62,242,.3),transparent 70%);pointer-events:none}
.stat-title{font-size:10px;font-weight:800;letter-spacing:3px;text-transform:uppercase;color:#a78bfa;margin-bottom:24px;position:relative;z-index:1;display:flex;align-items:center;gap:8px}
.stat-title::before{content:'';width:18px;height:2px;background:linear-gradient(90deg,#2845EE,#8B3EF2);border-radius:2px}
.stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;position:relative;z-index:1}
.stat-item{background:rgba(255,255,255,.06);padding:28px 20px;border-radius:18px;border:1px solid rgba(255,255,255,.1);text-align:center;transition:all .3s ease;position:relative;overflow:hidden;backdrop-filter:blur(8px)}
.stat-item::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(59,91,255,.08),rgba(139,62,242,.08));opacity:0;transition:opacity .3s}
.stat-item:hover{border-color:rgba(139,62,242,.5);transform:translateY(-4px);box-shadow:0 12px 32px rgba(139,62,242,.2)}
.stat-item:hover::before{opacity:1}
.stat-item strong{display:block;font-size:42px;font-weight:900;background:linear-gradient(135deg,#fff,#a78bfa);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:-2px;line-height:1;margin-bottom:8px}
.stat-item span{font-size:11px;color:#94a3b8;font-weight:700;text-transform:uppercase;letter-spacing:1.5px;display:block}

/* INTERNSHIP */
.internship{background:linear-gradient(160deg,#edf2fc 0%,var(--bg-cream) 100%)}
.int-badge{display:inline-flex;align-items:center;gap:8px;background:var(--blue);color:#fff;border-radius:50px;padding:8px 20px;font-size:12px;font-weight:700;letter-spacing:1px;text-transform:uppercase;margin-bottom:20px}
.int-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start}
.int-left h2{font-size:clamp(28px,3.5vw,44px);font-weight:800;letter-spacing:-1px;margin-bottom:16px}
.int-left p{font-size:15px;color:var(--muted);line-height:1.8;margin-bottom:28px}
.int-meta{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:28px}
.int-meta-item{background:var(--bg-cream-card);border:1px solid var(--border-card);border-radius:18px;padding:16px 12px;text-align:center;transition:all .3s ease;display:flex;flex-direction:column;align-items:center;box-sizing:border-box;box-shadow:var(--shadow-soft)}
.int-meta-item:hover{border-color:var(--blue);transform:translateY(-2px);box-shadow:var(--shadow-soft)}
.int-meta-ico{width:40px;height:40px;background:var(--blue-l);border-radius:10px;display:flex;align-items:center;justify-content:center;color:var(--blue);margin-bottom:10px;flex-shrink:0;transition:all .3s ease}
.int-meta-ico svg{margin:0;display:block}
.int-meta-item:hover .int-meta-ico{background:var(--blue);color:#fff}
.int-meta-txt{display:flex;flex-direction:column;align-items:center;gap:2px}
.int-meta-txt strong{display:block;font-size:13px;font-weight:700;color:var(--blue)}
.int-meta-txt span{font-size:11px;color:var(--muted)}
.int-benefits-title{font-size:11px;font-weight:800;letter-spacing:2px;text-transform:uppercase;color:var(--text-dark);margin-bottom:16px;display:flex;align-items:center;gap:10px}
.int-benefits-title::after{content:'';flex:1;height:1px;background:var(--border-card)}
.benefits-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.benefit-item{background:var(--bg-cream-card);border:1px solid var(--border-card);border-radius:18px;padding:16px 18px;display:flex;align-items:center;gap:12px;transition:all .3s ease;box-shadow:var(--shadow-soft)}
.benefit-item:hover{border-color:var(--blue);box-shadow:var(--shadow-soft);transform:translateY(-2px)}
.ben-ico{width:40px;height:40px;background:var(--blue-l);border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0;color:var(--blue)}
.ben-txt strong{display:block;font-size:13px;font-weight:700;color:var(--text-dark)}
.ben-txt span{font-size:11px;color:var(--muted)}

/* TEAM / LEADERSHIP SECTION BACKGROUND */
.team{background:linear-gradient(180deg,var(--bg-cream-card) 0%,var(--bg-cream) 40%,var(--bg-cream-alt) 100%);position:relative;overflow:hidden;border-top:1px solid var(--border-soft);border-bottom:1px solid var(--border-card)}
.team::before{content:'';position:absolute;top:-100px;left:50%;transform:translateX(-50%);width:1100px;height:500px;background:radial-gradient(ellipse at 50% 10%,rgba(40,69,238,0.06) 0%,rgba(34,211,238,0.03) 40%,transparent 70%);pointer-events:none}
.team-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.tc{background:var(--bg-cream-card);border:1px solid var(--border-card);border-radius:22px;padding:32px 26px;transition:all .3s ease;position:relative;overflow:hidden;box-shadow:var(--shadow-soft)}
.tc::after{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:var(--grad);opacity:0;transition:opacity .3s}
.tc:hover{border-color:rgba(40,69,238,.25);box-shadow:var(--shadow-lg);transform:translateY(-5px)}
.tc:hover::after{opacity:1}
.tc-avatar{width:56px;height:56px;border-radius:16px;background:var(--grad);display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:800;color:#fff;margin-bottom:16px}
.tc h3{font-size:19px;font-weight:800;color:var(--text-dark);margin-bottom:8px;letter-spacing:-.5px}
.tc-tags{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:16px}
.tc-tag{font-size:10px;font-weight:700;letter-spacing:1px;text-transform:uppercase;padding:4px 12px;border-radius:50px}
.td{color:var(--blue);background:var(--blue-m)}
.tv{color:var(--purple);background:#ede9fe}
.ta{color:#0891b2;background:#cffafe}
.tg{color:#16a34a;background:#dcfce7}
.to{color:#ea580c;background:#ffedd5}
.tc-skills{display:flex;flex-direction:column;gap:8px}
.tc-skill{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted);font-weight:500}
.sk-dot{width:5px;height:5px;border-radius:50%;background:var(--blue);flex-shrink:0}

/* WHY US */
.why{background:linear-gradient(180deg,var(--bg-cream) 0%,var(--bg-cream-card) 50%,var(--bg-cream) 100%);position:relative}
.why-in{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
.why-cards{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.wc{background:var(--bg-cream-card);border:1px solid var(--border-card);border-radius:22px;padding:28px 24px;transition:all .3s cubic-bezier(0.16,1,0.3,1);box-shadow:var(--shadow-soft)}
.wc:hover{border-color:var(--blue);box-shadow:var(--shadow-soft);transform:translateY(-3px);background:var(--bg-cream-soft)}
.wc-ico{width:60px;height:60px;background:var(--bg-cream-card);border:1px solid var(--border-card);border-radius:18px;display:flex;align-items:center;justify-content:center;margin-bottom:18px;box-shadow:0 8px 24px rgba(40,69,238,.14);transition:all .35s ease;position:relative;overflow:hidden}
.wc:hover .wc-ico{transform:scale(1.12) translateY(-2px) rotate(-3deg);box-shadow:0 14px 30px rgba(40,69,238,.24)}
.wc h4{font-size:16px;font-weight:700;color:var(--text-dark);margin-bottom:8px}
.wc p{font-size:13px;color:var(--muted);line-height:1.65}

/* MENTORSHIP */
.mentorship{background:linear-gradient(180deg,var(--bg-cream-card) 0%,var(--bg-cream) 50%,var(--bg-cream-alt) 100%);position:relative}
.mentor-badge{display:inline-flex;align-items:center;gap:8px;background:var(--blue-m);color:var(--blue);border-radius:50px;padding:6px 16px;font-size:11px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;margin-bottom:16px}
.mentor-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:40px}
.mentor-card{background:var(--bg-cream-card);border:1px solid var(--border-card);border-radius:22px;padding:30px 22px;transition:all .3s cubic-bezier(0.16,1,0.3,1);position:relative;overflow:hidden;box-shadow:var(--shadow-soft)}
.mentor-card::after{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:var(--grad);opacity:0;transition:opacity .3s}
.mentor-card:hover{border-color:var(--blue);box-shadow:var(--shadow-lg);transform:translateY(-5px)}
.mentor-card:hover::after{opacity:1}
.mentor-ico{width:56px;height:56px;border-radius:14px;display:flex;align-items:center;justify-content:center;margin-bottom:20px;background:var(--blue-l);border:1px solid var(--blue-m);color:var(--blue);transition:all .3s ease}
.mentor-card:hover .mentor-ico{background:linear-gradient(135deg,#2845EE,#1d35c7);color:#ffffff;border-color:transparent;transform:translateY(-2px);box-shadow:0 8px 20px rgba(40,69,238,.25)}
.mentor-ico svg{width:26px;height:26px;transition:transform .3s ease}
.mentor-card:hover .mentor-ico svg{transform:scale(1.08)}
.mentor-card h3{font-size:16px;font-weight:700;color:var(--text-dark);margin-bottom:8px;line-height:1.35}
.mentor-card p{font-size:12.5px;color:var(--muted);line-height:1.65}
.mentor-cta{margin-top:40px;background:linear-gradient(135deg,#0B1130,#1B1150 55%,#2A0F4A);border-radius:22px;padding:36px 40px;display:flex;align-items:center;justify-content:space-between;gap:28px;color:#fff;position:relative;overflow:hidden}
.mentor-cta::before{content:'';position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.09) 1px,transparent 1px);background-size:24px 24px;opacity:.5}
.mentor-cta-txt{position:relative;z-index:1;max-width:580px}
.mentor-cta-txt h3{font-size:clamp(20px,2.8vw,28px);font-weight:800;letter-spacing:-.5px;margin-bottom:0}
.mentor-cta-txt p{font-size:13.5px;color:#cbd5e1;line-height:1.6}
.mentor-cta-btn{position:relative;z-index:1;background:var(--grad);color:#fff;padding:12px 28px;border-radius:50px;font-size:13.5px;font-weight:700;white-space:nowrap;box-shadow:0 6px 20px rgba(40,69,238,.35);transition:all .2s;flex-shrink:0}
.mentor-cta-btn:hover{transform:translateY(-2px);box-shadow:0 8px 28px rgba(124,58,237,.45)}

/* HIRING */
.hiring{background:linear-gradient(160deg,#edf2fc 0%,var(--bg-cream) 100%)}
.hiring-badge{display:inline-flex;align-items:center;gap:8px;background:#dcfce7;color:#16a34a;border-radius:50px;padding:6px 16px;font-size:11px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;margin-bottom:16px;animation:pulseGreen 2s infinite}
@keyframes pulseGreen{0%,100%{box-shadow:0 0 0 0 rgba(22,163,74,.3)}50%{box-shadow:0 0 0 8px rgba(22,163,74,0)}}
.hiring-in{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start}
.hiring-left h2{font-size:clamp(28px,3.5vw,44px);font-weight:800;letter-spacing:-1px;margin-bottom:16px}
.hiring-left p{font-size:15px;color:var(--muted);line-height:1.8;margin-bottom:24px}
.positions-list{display:flex;flex-direction:column;gap:10px;margin-bottom:28px}
.pos-item{display:flex;align-items:center;gap:12px;padding:14px 18px;background:var(--bg-cream-card);border:1px solid var(--border-card);border-radius:16px;font-size:14px;font-weight:600;color:var(--text-dark);transition:all .3s ease;box-shadow:var(--shadow-soft)}
.pos-item:hover{border-color:var(--blue);box-shadow:var(--shadow-soft);transform:translateX(4px)}
.pos-dot{width:8px;height:8px;border-radius:50%;background:var(--blue);flex-shrink:0}
.hiring-right{display:grid;grid-template-columns:1fr;gap:16px}
.hr-box{background:var(--bg-cream-card);border:1px solid var(--border-card);border-radius:22px;padding:24px 28px;box-shadow:var(--shadow-soft)}
.hr-box-title{display:flex;align-items:center;gap:10px;font-size:12px;font-weight:800;letter-spacing:2px;text-transform:uppercase;color:var(--text-dark);margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid var(--border-card)}
.hr-box-title svg{color:var(--blue)}
.hr-list{display:flex;flex-direction:column;gap:8px}
.hr-list li{display:flex;align-items:flex-start;gap:8px;font-size:13px;color:var(--muted);line-height:1.5}
.hr-list li::before{content:'•';color:var(--blue);font-weight:800;flex-shrink:0;margin-top:1px}

/* PARTNERSHIP */
.partner{background:linear-gradient(135deg,#0c2363 0%,#153ea8 40%,#1e50d8 75%,#1b3ca0 100%);position:relative;overflow:hidden;border-top:1px solid rgba(255,255,255,.2);border-bottom:1px solid rgba(255,255,255,.2);padding:90px 0}
.partner::before{content:'';position:absolute;top:-120px;right:-120px;width:500px;height:500px;background:radial-gradient(circle,rgba(34,211,238,.3),transparent 65%);pointer-events:none}
.partner::after{content:'';position:absolute;bottom:-120px;left:-120px;width:500px;height:500px;background:radial-gradient(circle,rgba(255,255,255,.15),transparent 65%);pointer-events:none}
.partner-in{display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:center;position:relative;z-index:1}
.partner-left h2{font-size:clamp(30px,3.8vw,46px);font-weight:900;color:#ffffff;letter-spacing:-1.2px;margin-bottom:18px;line-height:1.15}
.partner-left h2 .b-text{background:linear-gradient(135deg,#67e8f9 0%,#a5f3fc 50%,#ffffff 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.partner-left p.partner-lead{font-size:15px;color:#e0e7ff;line-height:1.8;margin-bottom:28px}
.partner-orgs{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-bottom:24px}
.org-card{background:rgba(255,255,255,.1);border:1.5px solid rgba(255,255,255,.2);border-radius:16px;padding:12px 14px;display:flex;align-items:center;gap:12px;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);transition:all .28s cubic-bezier(0.16,1,0.3,1);box-shadow:0 8px 24px rgba(0,0,0,.15)}
.org-card:hover{border-color:#67e8f9;transform:translateY(-3px);background:rgba(255,255,255,.18);box-shadow:0 12px 30px rgba(0,0,0,.25)}
.org-card.org-card-lead{grid-column:1 / -1;background:linear-gradient(135deg,rgba(255,255,255,0.18) 0%,rgba(56,189,248,0.12) 100%);border-color:rgba(103,232,249,0.45)}
.org-card-ico{width:46px;height:46px;border-radius:12px;background:#ffffff;box-shadow:0 4px 14px rgba(0,0,0,.2);border:1px solid rgba(255,255,255,.6);padding:3px;display:flex;align-items:center;justify-content:center;flex-shrink:0;overflow:hidden}
.org-card-ico img{width:100%;height:100%;object-fit:contain;border-radius:8px}
.org-card-txt strong{display:block;font-size:13.5px;font-weight:800;color:#ffffff;line-height:1.25;margin-bottom:2px}
.org-card-txt span{display:block;font-size:10.5px;color:#cbd5e1;font-weight:500;line-height:1.3}
@media(max-width:640px){.partner-orgs{grid-template-columns:1fr;gap:10px}}
.partner-quote{background:rgba(255,255,255,.1);border-left:4px solid #38bdf8;border-radius:0 16px 16px 0;padding:20px 24px;border:1px solid rgba(255,255,255,.2);border-left:4px solid #38bdf8;backdrop-filter:blur(10px)}
.partner-quote p{font-size:13.5px;color:#f1f5f9;line-height:1.75;font-style:italic;margin:0}
.partner-quote strong{color:#67e8f9;font-style:normal}
.partner-obj{background:rgba(255,255,255,.1);border:1.5px solid rgba(255,255,255,.22);border-radius:22px;padding:28px 30px;backdrop-filter:blur(14px);box-shadow:0 24px 60px rgba(0,0,0,.2)}
.partner-obj-title{display:flex;align-items:center;gap:10px;font-size:11px;font-weight:800;letter-spacing:2.5px;text-transform:uppercase;color:#a5f3fc;margin-bottom:20px;padding-bottom:12px;border-bottom:1px solid rgba(255,255,255,.15)}
.partner-obj-title svg{color:#38bdf8}
.pobj-list{display:flex;flex-direction:column;gap:12px}
.pobj-item{display:flex;align-items:flex-start;gap:12px;font-size:13.5px;color:#f1f5f9;line-height:1.6}
.pobj-check{width:18px;height:18px;border-radius:50%;background:rgba(34,211,238,.25);border:1px solid #38bdf8;display:flex;align-items:center;justify-content:center;color:#67e8f9;flex-shrink:0;margin-top:2px}
.partner-reps{margin-top:18px;background:rgba(255,255,255,.1);border:1.5px solid rgba(255,255,255,.22);border-radius:22px;padding:24px 28px;backdrop-filter:blur(14px);box-shadow:0 24px 60px rgba(0,0,0,.2)}
.partner-reps-title{display:flex;align-items:center;gap:10px;font-size:11px;font-weight:800;letter-spacing:2.5px;text-transform:uppercase;color:#a5f3fc;margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid rgba(255,255,255,.15)}
.partner-reps-title svg{color:#38bdf8}
.partner-reps-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.rep-box{background:rgba(255,255,255,.08);border-radius:14px;padding:16px 18px;border:1px solid rgba(255,255,255,.18);display:flex;align-items:center;gap:14px;transition:all .3s ease}
.rep-box:hover{border-color:#67e8f9;background:rgba(255,255,255,.16);transform:translateY(-2px);box-shadow:0 8px 24px rgba(0,0,0,.2)}
.rep-avatar{width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:800;color:#fff;flex-shrink:0;overflow:hidden}
.rep-avatar img{width:100%;height:100%;object-fit:cover;object-position:top center;display:block}
.rep-av-1{background:#ffffff;box-shadow:0 4px 12px rgba(0,0,0,.2);border:1px solid rgba(255,255,255,.4)}
.rep-av-2{background:#ffffff;box-shadow:0 4px 12px rgba(0,0,0,.2);border:1px solid rgba(255,255,255,.4)}
.rep-av-3{background:#ffffff;box-shadow:0 4px 12px rgba(0,0,0,.2);border:1px solid rgba(255,255,255,.4)}
.rep-av-4{background:#ffffff;box-shadow:0 4px 12px rgba(0,0,0,.2);border:1px solid rgba(255,255,255,.4)}
.rep-av-5{background:#ffffff;box-shadow:0 4px 12px rgba(0,0,0,.2);border:1px solid rgba(255,255,255,.4)}
.rep-info strong{display:block;font-size:14px;font-weight:800;color:#ffffff;margin-bottom:2px}
.rep-info span{font-size:11px;color:#cbd5e1;line-height:1.35;display:block}

/* COURSERA-STYLE CLEAN ROW CAROUSEL */
.courses{background:var(--bg-cream);padding:24px 0}
.courses-intro{font-size:14px;color:var(--text-sub);max-width:820px;line-height:1.6;margin-bottom:28px}
.courses-grid-row{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:20px;
  width:100%;
  margin-bottom:28px;
}
.coursera-card{
  background:var(--bg-cream-card);
  border:1px solid var(--border-card);
  border-radius:18px;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  text-decoration:none;
  color:var(--text-dark);
  transition:all .25s ease;
  box-shadow:var(--shadow-soft);
}
.coursera-card:hover{
  border-color:var(--blue);
  transform:translateY(-4px);
  box-shadow:var(--shadow-lg);
}
.coursera-thumb{
  width:100%;
  height:148px;
  overflow:hidden;
  background:#0f172a;
}
.coursera-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  transition:transform .4s ease;
}
.coursera-card:hover .coursera-thumb img{
  transform:scale(1.04);
}
.coursera-body{
  padding:14px 16px 16px;
  display:flex;
  flex-direction:column;
  flex:1;
}
.coursera-org{
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:8px;
}
.coursera-org-ico{
  width:22px;
  height:22px;
  border-radius:4px;
  object-fit:contain;
  border:1px solid var(--border-card);
  flex-shrink:0;
}
.coursera-org-name{
  font-size:12px;
  color:var(--text-sub);
  font-weight:500;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.coursera-title{
  font-size:14.5px;
  font-weight:700;
  color:var(--text-dark);
  line-height:1.35;
  margin-bottom:10px;
  min-height:38px;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.coursera-type{
  font-size:11.5px;
  color:var(--muted);
  margin-bottom:14px;
  font-weight:500;
}
.coursera-pill{
  display:inline-flex;
  align-items:center;
  padding:4px 12px;
  border:1px solid var(--border-card);
  border-radius:50px;
  font-size:11.5px;
  font-weight:600;
  color:var(--text-dark);
  background:var(--bg-cream-soft);
  box-shadow:var(--shadow-inset);
  width:fit-content;
  margin-top:auto;
}

/* Show more button (Coursera blue outline button) */
.coursera-btn-row{
  display:flex;
  gap:12px;
  align-items:center;
  flex-wrap:wrap;
  margin-top:6px;
}
.btn-coursera-more{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:11px 26px;
  background:var(--grad-blue);
  color:#ffffff !important;
  border-radius:50px;
  font-size:13.5px;
  font-weight:800;
  text-decoration:none;
  transition:all .25s ease;
  box-shadow:0 6px 20px rgba(40,69,238,0.25),inset 0 1px 0 rgba(255,255,255,0.35);
  border:none;
}
.btn-coursera-more:hover{
  background:linear-gradient(135deg, #1d35c7, #152696);
  transform:translateY(-2px);
  box-shadow:0 10px 28px rgba(40,69,238,0.38);
  color:#ffffff !important;
}
.btn-coursera-form{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:10.5px 22px;
  background:var(--bg-cream-soft);
  color:var(--blue) !important;
  border:1.5px solid var(--blue);
  border-radius:50px;
  font-size:13.5px;
  font-weight:700;
  text-decoration:none;
  transition:all .25s ease;
  box-shadow:var(--shadow-soft);
}
.btn-coursera-form:hover{
  background:rgba(40,69,238,0.06);
  transform:translateY(-1px);
}
.coursera-card.coursera-more-card{
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  outline:none !important;
  padding:0 !important;
  text-decoration:none !important;
  min-height:260px !important;
  height:100% !important;
  flex:0 0 200px !important;
  align-self:stretch !important;
}
.coursera-card.coursera-more-card:hover{
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  transform:translateY(-2px) !important;
}
.coursera-more-inner{
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  width:100% !important;
  height:100% !important;
  flex:1 !important;
  margin:auto !important;
}
.more-card-btn{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:8px !important;
  padding:12px 24px !important;
  background:var(--grad-blue) !important;
  color:#ffffff !important;
  border-radius:50px !important;
  font-size:14px !important;
  font-weight:700 !important;
  box-shadow:0 6px 20px rgba(40,69,238,0.28),inset 0 1px 0 rgba(255,255,255,0.35) !important;
  border:none !important;
  outline:none !important;
  text-decoration:none !important;
  white-space:nowrap !important;
  transition:all .25s ease !important;
}
.more-card-btn:hover{
  transform:scale(1.05) !important;
  box-shadow:0 10px 26px rgba(40,69,238,0.42) !important;
}

/* ── DEDICATED STANDALONE COURSES SECTION ── */
.dedicated-courses{
  background:var(--bg-cream);
  padding:44px 0 84px;
  position:relative;
}
.dc-top-bar{
  display:flex;
  align-items:center;
  margin-bottom:24px;
}
.dc-back-btn{
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-size:13.5px;
  font-weight:700;
  color:var(--blue) !important;
  text-decoration:none;
    padding:10px 22px;
    border-radius:50px;
    background:radial-gradient(120% 120% at 15% 0%, rgba(253,252,249,0.96) 0%, rgba(245,243,237,0.85) 50%, rgba(253,252,249,0.95) 100%);
    border:1.5px solid var(--border-card);
    backdrop-filter:blur(16px) saturate(180%);
    -webkit-backdrop-filter:blur(16px) saturate(180%);
    box-shadow:var(--shadow-soft);
    transition:all .3s cubic-bezier(0.16, 1, 0.3, 1);
    position:relative;
    overflow:hidden;
  }
  .dc-back-btn::before{
    content:'';
    position:absolute;
    top:0;
    left:0;
    right:0;
    height:50%;
    background:linear-gradient(180deg, rgba(255,255,255,0.65) 0%, rgba(255,255,255,0) 100%);
    border-radius:50px 50px 0 0;
    pointer-events:none;
  }
  .dc-back-btn:hover{
    background:var(--bg-cream-card);
    color:var(--blue) !important;
    transform:translateX(-4px);
    box-shadow:var(--shadow-lg);
    border-color:var(--blue);
  }
  .dc-head{
    margin-bottom:28px;
  }
  /* ── DEDICATED COURSES LIQUID GLASS SEARCH & SUGGESTIONS ── */
  .dc-search-wrap{
    max-width:540px;
    width:100%;
    margin:0 auto 26px;
    position:relative;
    z-index:40;
  }
  .dc-search-box{
    display:flex;
    align-items:center;
    gap:12px;
    padding:8px 18px;
    border-radius:50px;
    background:var(--bg-cream-card);
    border:1.5px solid var(--border-card);
    backdrop-filter:blur(18px) saturate(190%);
    -webkit-backdrop-filter:blur(18px) saturate(190%);
    box-shadow:var(--shadow-soft);
    transition:all .3s cubic-bezier(0.16,1,0.3,1);
    position:relative;
    overflow:hidden;
  }
  .dc-search-box::before{
    content:'';
    position:absolute;
    top:0;
    left:0;
    right:0;
    height:50%;
    background:linear-gradient(180deg, rgba(255,255,255,0.7) 0%, rgba(255,255,255,0) 100%);
    border-radius:50px 50px 0 0;
    pointer-events:none;
  }
  .dc-search-box:focus-within{
    border-color:var(--blue);
    background:var(--bg-cream-card);
    box-shadow:0 10px 28px rgba(40,69,238,0.15);
    transform:translateY(-1px);
  }
  .dc-search-icon{
    color:var(--blue);
    flex-shrink:0;
    position:relative;
    z-index:1;
  }
  .dc-search-input{
    flex:1;
    border:none;
    outline:none;
    background:transparent;
    font-size:13.5px;
    font-weight:600;
    color:var(--text-dark);
    font-family:inherit;
    position:relative;
    z-index:1;
  }
  .dc-search-input::placeholder{
    color:var(--muted);
    font-weight:500;
  }
  .dc-search-clear{
    border:none;
    background:rgba(148,163,184,0.18);
    border-radius:50%;
    width:22px;
    height:22px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    color:#64748b;
    position:relative;
    z-index:1;
    transition:all .2s ease;
    padding:0;
  }
  .dc-search-clear:hover{
    background:rgba(239,68,68,0.15);
    color:#ef4444;
    transform:scale(1.08);
  }
  .dc-suggestions-dropdown{
    position:absolute;
    top:calc(100% + 8px);
    left:0;
    right:0;
    background:var(--bg-cream-card);
    backdrop-filter:blur(20px) saturate(190%);
    -webkit-backdrop-filter:blur(20px) saturate(190%);
    border-radius:20px;
    border:1.5px solid var(--border-card);
    box-shadow:var(--shadow-lg);
    padding:8px;
    max-height:310px;
    overflow-y:auto;
    z-index:100;
    animation:dcFadeDown .2s cubic-bezier(0.16,1,0.3,1);
  }
@keyframes dcFadeDown{
  from{opacity:0;transform:translateY(-8px)}
  to{opacity:1;transform:translateY(0)}
}
.dc-suggestion-item{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:10px 14px;
  border-radius:12px;
  cursor:pointer;
  transition:all .2s ease;
  gap:10px;
}
.dc-suggestion-item:hover, .dc-suggestion-item.highlighted{
  background:var(--bg-cream-soft);
}
.dc-sugg-left{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
}
.dc-sugg-icon{
  width:28px;
  height:28px;
  border-radius:8px;
  background:rgba(40,69,238,0.1);
  color:var(--blue);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:13px;
  flex-shrink:0;
}
.dc-sugg-title{
  font-size:13px;
  font-weight:700;
  color:var(--text-dark);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.dc-sugg-title mark{
  background:rgba(40,69,238,0.15);
  color:var(--blue);
  border-radius:3px;
  padding:0 2px;
}
.dc-sugg-cat{
  font-size:10.5px;
  font-weight:800;
  color:var(--blue);
  background:rgba(40,69,238,0.08);
  padding:3px 8px;
  border-radius:20px;
  white-space:nowrap;
  flex-shrink:0;
}
.dc-no-results{
  grid-column:1 / -1;
  text-align:center;
  padding:48px 20px;
  background:var(--bg-cream-card);
  border-radius:20px;
  border:1.5px solid var(--border-card);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  box-shadow:var(--shadow-soft);
}
.dc-no-results-icon{
  font-size:36px;
  margin-bottom:12px;
}
.dc-no-results h3{
  font-size:18px;
  font-weight:800;
  color:var(--text-dark);
  margin-bottom:6px;
}
.dc-no-results p{
  font-size:13px;
  color:var(--text-sub);
  margin-bottom:18px;
}
@keyframes dcCardPulse{
  0%{box-shadow:0 0 0 0 rgba(40,69,238,0.5)}
  70%{box-shadow:0 0 0 12px rgba(40,69,238,0)}
  100%{box-shadow:0 0 0 0 rgba(40,69,238,0)}
}
.dc-card-highlighted{
  animation:dcCardPulse 1.8s ease;
  border-color:var(--blue) !important;
}
.dc-filters-wrap{
  display:flex;
  justify-content:center;
  margin-bottom:34px;
  width:100%;
}
.dc-filters{
  display:inline-flex;
  flex-wrap:nowrap;
  align-items:center;
  gap:3px;
  justify-content:center;
  background:linear-gradient(145deg, #ffffff 0%, #edf1f8 100%);
  padding:5px 7px;
  border-radius:50px;
  border:1.5px solid rgba(255, 255, 255, 0.95);
  box-shadow:0 12px 30px rgba(145, 160, 185, 0.32), 0 4px 10px rgba(145, 160, 185, 0.16), inset 0 1.5px 2px #ffffff;
  max-width:100%;
  overflow-x:auto;
  scrollbar-width:none;
  -ms-overflow-style:none;
}
.dc-filters::-webkit-scrollbar{
  display:none;
}
.dc-filter-btn{
  background:transparent;
  border:none;
  box-shadow:none;
  padding:7px 15px;
  border-radius:50px;
  font-size:12.5px;
  font-weight:600;
  color:#475569;
  cursor:pointer;
  transition:all .22s cubic-bezier(0.16, 1, 0.3, 1);
  outline:none;
  white-space:nowrap;
  flex-shrink:0;
}
.dc-filter-btn:hover{
  color:#2558ea;
  background:rgba(255, 255, 255, 0.9);
  box-shadow:0 3px 8px rgba(150, 164, 188, 0.25), inset 0 1px 1px #ffffff;
  transform:translateY(-1px);
}
.dc-filter-btn.active{
  background:linear-gradient(145deg, #3d75fd 0%, #2558ea 50%, #1742d4 100%);
  color:#ffffff;
  font-weight:700;
  box-shadow:0 5px 15px rgba(23, 66, 212, 0.42), 0 2px 4px rgba(15, 23, 42, 0.12), inset 0 1.5px 2px rgba(255, 255, 255, 0.55), inset 0 -2px 3px rgba(10, 25, 110, 0.45);
  text-shadow:0 1px 2px rgba(10, 25, 90, 0.3);
  transform:none;
}
.dedicated-courses .sw{
  max-width:1380px;
  padding:80px 24px;
}
.dc-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:20px;
  margin-bottom:48px;
}
.dc-card{
  background:var(--bg-cream-card);
  border:1px solid var(--border-card);
  border-radius:22px;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  transition:all .3s cubic-bezier(0.16,1,0.3,1);
  box-shadow:var(--shadow-soft);
  position:relative;
}
.dc-card:hover{
  transform:translateY(-5px);
  border-color:rgba(59,91,255,0.4);
  box-shadow:0 16px 36px rgba(59,91,255,0.14);
}
.dc-card::before{
  content:'';
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:3.5px;
  background:linear-gradient(90deg,#2845EE,#8B3EF2,#22D3EE);
  opacity:0;
  transition:opacity .3s ease;
  z-index:3;
}
.dc-card:hover::before{
  opacity:1;
}
.dc-card-thumb{
  aspect-ratio:16/9;
  height:auto;
  position:relative;
  overflow:hidden !important;
  background:#0f172a;
  cursor:pointer;
  border-radius:0 0 28px 28px !important;
  border-bottom:2px solid rgba(255, 255, 255, 0.95) !important;
  box-shadow:0 4px 14px rgba(155, 168, 195, 0.22) !important;
}
.dc-card-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:0 0 28px 28px !important;
  transition:transform .4s ease;
}
.dc-card:hover .dc-card-thumb img{
  transform:scale(1.05);
}
.dc-card-badge-top{
  position:absolute;
  top:12px;
  left:12px;
  z-index:2;
  display:flex;
  gap:6px;
  flex-wrap:wrap;
}
.dc-tag-open{
  background:rgba(34,197,94,0.92);
  color:#fff;
  font-size:10px;
  font-weight:800;
  padding:3.5px 10px;
  border-radius:50px;
  backdrop-filter:blur(8px);
  letter-spacing:.4px;
}
.dc-tag-cat{
  background:rgba(15,23,42,0.85);
  color:#fff;
  font-size:9.5px;
  font-weight:800;
  padding:3.5px 10px;
  border-radius:50px;
  backdrop-filter:blur(8px);
  letter-spacing:.4px;
  text-transform:uppercase;
}
.dc-card-body{
  padding:16px 18px 20px;
  display:flex;
  flex-direction:column;
  flex:1;
}
.dc-card-org{
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:8px;
  cursor:pointer;
}
.dc-card-org-ico{
  width:18px;
  height:18px;
  border-radius:4px;
  object-fit:contain;
}
.dc-card-org-name{
  font-size:11px;
  color:#64748b;
  font-weight:600;
}
.dc-card-title{
  font-size:15px;
  font-weight:800;
  color:var(--text-dark);
  line-height:1.35;
  margin-bottom:4px;
  min-height:42px;
  cursor:pointer;
  transition:color .2s ease;
}
.dc-card-title:hover{
  color:var(--blue);
}

/* View Info Toggle Button - Clean Soft Minimal Theme */
.dc-btn-toggle-info{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  width:100%;
  padding:7px 14px;
  background:rgba(255, 255, 255, 0.72) !important;
  border:1px solid rgba(166, 175, 195, 0.35) !important;
  border-radius:50px !important;
  font-family:inherit;
  font-size:11.5px;
  font-weight:600;
  color:#475569 !important;
  cursor:pointer;
  margin:8px 0 12px;
  box-shadow:0 1px 3px rgba(0, 0, 0, 0.04) !important;
  position:relative;
  overflow:hidden;
  transition:all .25s ease;
  outline:none;
}
.dc-btn-toggle-info::before{
  display:none !important;
}
.dc-btn-toggle-info:hover{
  background:#ffffff !important;
  border-color:rgba(40, 69, 238, 0.45) !important;
  color:var(--blue) !important;
  transform:translateY(-1px) !important;
  box-shadow:0 3px 10px rgba(40, 69, 238, 0.12) !important;
}
.dc-btn-toggle-info .dc-toggle-text{
  position:relative;
  z-index:1;
  letter-spacing:.2px;
}
.dc-btn-toggle-info .dc-toggle-arrow{
  position:relative;
  z-index:1;
  color:var(--blue);
  transition:transform .3s cubic-bezier(0.16, 1, 0.3, 1);
}
.dc-card.is-expanded .dc-btn-toggle-info{
  background:#eef2ff !important;
  border-color:rgba(40, 69, 238, 0.45) !important;
  color:var(--blue) !important;
  box-shadow:none !important;
}
.dc-card.is-expanded .dc-btn-toggle-info .dc-toggle-arrow{
  transform:rotate(180deg);
}

/* Collapsible Details (Hidden by default, shown on click/View Info) */
.dc-card-details{
  max-height:0;
  opacity:0;
  overflow:hidden;
  transition:max-height .35s cubic-bezier(0.4, 0, 0.2, 1), opacity .25s ease;
  margin:0;
}
.dc-card.is-expanded .dc-card-details{
  max-height:600px;
  opacity:1;
  margin-bottom:12px;
}
.dc-card:not(.is-expanded) .dc-card-desc,
.dc-card:not(.is-expanded) .dc-card-topics{
  display:none !important;
}
.dc-card.is-expanded .dc-card-desc{
  display:block !important;
}
.dc-card.is-expanded .dc-card-topics{
  display:flex !important;
}
.dc-card-desc{
  font-size:12.5px;
  color:var(--text-sub);
  line-height:1.55;
  margin-bottom:12px;
}
.dc-card-topics{
  display:flex;
  flex-direction:column;
  gap:7px;
  margin-bottom:14px;
  padding-top:12px;
  border-top:1px solid var(--border-soft);
}
.dc-topic-item{
  display:flex;
  align-items:flex-start;
  gap:7px;
  font-size:11.5px;
  color:var(--text-sub);
  font-weight:600;
  line-height:1.4;
}
.dc-topic-item svg{
  color:#22c55e;
  flex-shrink:0;
  margin-top:2px;
}
.dc-card-meta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:8px 12px;
  background:linear-gradient(135deg, rgba(255,255,255,0.85) 0%, rgba(240,246,255,0.55) 50%, rgba(255,255,255,0.75) 100%);
  border-radius:50px;
  border:1.5px solid rgba(255,255,255,0.95);
  backdrop-filter:blur(16px) saturate(180%);
  -webkit-backdrop-filter:blur(16px) saturate(180%);
  box-shadow:0 6px 20px -3px rgba(59,91,255,0.08), 0 2px 6px rgba(15,23,42,0.03), inset 0 1.5px 2px rgba(255,255,255,1), inset 0 -1px 2px rgba(59,91,255,0.06);
  margin-bottom:12px;
  font-size:11px;
  color:var(--text-sub);
  font-weight:700;
  position:relative;
  overflow:hidden;
  transition:all .3s ease;
}
.dc-card-meta::before{
  content:'';
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:50%;
  background:linear-gradient(180deg, rgba(255,255,255,0.7) 0%, rgba(255,255,255,0) 100%);
  border-radius:50px 50px 0 0;
  pointer-events:none;
}
.dc-card-meta span{
  position:relative;
  z-index:1;
  display:inline-flex;
  align-items:center;
  gap:5px;
}
.dc-card:hover .dc-card-meta{
  background:linear-gradient(135deg, rgba(255,255,255,0.95) 0%, rgba(235,245,255,0.7) 100%);
  box-shadow:0 8px 24px -3px rgba(59,91,255,0.14), inset 0 2px 2px rgba(255,255,255,1), inset 0 -1px 2px rgba(59,91,255,0.08);
}
.dc-card-actions{
  display:flex;
  gap:7px;
  margin-top:auto;
}
.btn-dc-enroll{
  flex:1;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  padding:10px 14px;
  background:linear-gradient(135deg,#2845EE,#1d35c7);
  color:#ffffff !important;
  border-radius:50px;
  font-size:12px;
  font-weight:700;
  text-decoration:none;
  border:none;
  font-family:inherit;
  cursor:pointer;
  transition:all .25s ease;
  box-shadow:0 4px 14px rgba(40,69,238,0.25),inset 0 1px 0 rgba(255,255,255,0.35);
  white-space:nowrap;
}
.btn-dc-enroll:hover{
  transform:translateY(-2px);
  box-shadow:0 8px 22px rgba(40,69,238,0.38);
}
.btn-dc-wa{
  width:40px;
  height:40px;
  border-radius:50px;
  background:#22c55e;
  color:#ffffff !important;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  flex-shrink:0;
  transition:all .25s ease;
  box-shadow:0 4px 14px rgba(34,197,94,0.25);
}
.btn-dc-wa:hover{
  background:#16a34a;
  transform:translateY(-2px);
}

/* ── COURSE ENROLLMENT MODAL (LIQUID GLASS THEME) ── */
.dc-modal-overlay{
  position:fixed;
  inset:0;
  z-index:99999;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:20px;
  opacity:0;
  visibility:hidden;
  transition:opacity .3s cubic-bezier(0.16, 1, 0.3, 1), visibility .3s;
}
.dc-modal-overlay.active{
  opacity:1;
  visibility:visible;
}
.dc-modal-backdrop{
  position:absolute;
  inset:0;
  background:rgba(8, 11, 22, 0.75);
  backdrop-filter:blur(10px) saturate(180%);
  -webkit-backdrop-filter:blur(10px) saturate(180%);
}
.dc-modal-container{
  position:relative;
  z-index:2;
  width:100%;
  max-width:660px;
  max-height:92vh;
  display:flex;
  min-width:0;
  box-sizing:border-box;
}
.dc-modal-card{
  width:100%;
  min-width:0;
  box-sizing:border-box;
  background:linear-gradient(135deg, #ffffff 0%, var(--bg-cream-card) 100%);
  border:1.5px solid var(--border-card);
  border-radius:26px;
  box-shadow:0 25px 60px -10px rgba(15, 23, 42, 0.25), inset 0 1.5px 0 #ffffff;
  padding:32px 30px;
  position:relative;
  overflow-y:auto;
  overflow-x:hidden;
  max-height:92vh;
  transform:scale(0.92) translateY(16px);
  transition:transform .35s cubic-bezier(0.16, 1, 0.3, 1);
}
.dc-modal-overlay.active .dc-modal-card{
  transform:scale(1) translateY(0);
}
.dc-modal-close{
  position:absolute;
  top:16px;
  right:16px;
  width:28px;
  height:28px;
  border-radius:50%;
  background:rgba(15, 23, 42, 0.05);
  border:1px solid rgba(15, 23, 42, 0.08);
  color:#64748b;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition:all .2s ease;
  z-index:3;
  outline:none;
}
.dc-modal-close:hover{
  background:#fee2e2;
  border-color:#fca5a5;
  color:#ef4444;
  transform:rotate(90deg);
}
.dc-modal-head{
  margin-bottom:24px;
}
.dc-modal-badge{
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:4px 12px;
  background:rgba(34, 197, 94, 0.1);
  border:1px solid rgba(34, 197, 94, 0.25);
  border-radius:50px;
  font-size:11px;
  font-weight:700;
  color:#15803d;
  margin-bottom:10px;
}
.dc-pulse-dot{
  width:7px;
  height:7px;
  border-radius:50%;
  background:#22c55e;
  box-shadow:0 0 0 0 rgba(34, 197, 94, 0.7);
  animation:dcPulse 1.8s infinite;
}
@keyframes dcPulse{
  0%{box-shadow:0 0 0 0 rgba(34, 197, 94, 0.7)}
  70%{box-shadow:0 0 0 8px rgba(34, 197, 94, 0)}
  100%{box-shadow:0 0 0 0 rgba(34, 197, 94, 0)}
}
.dc-modal-title{
  font-size:clamp(20px, 3vw, 24px);
  font-weight:800;
  color:var(--text-dark);
  line-height:1.25;
  margin-bottom:6px;
}
.dc-modal-subtitle{
  font-size:13px;
  color:var(--text-sub);
  line-height:1.5;
  margin:0;
}
.dc-form-grid{
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:16px;
  margin-bottom:20px;
}
.dc-col-full{
  grid-column:1 / -1;
}
.dc-form-group{
  display:flex;
  flex-direction:column;
  gap:6px;
}
.dc-form-label{
  font-size:12px;
  font-weight:700;
  color:#334155;
  display:flex;
  align-items:center;
  gap:4px;
}
.dc-req{
  color:#ef4444;
}
.dc-input-wrap{
  position:relative;
  display:flex;
  align-items:center;
}
.dc-input-icon{
  position:absolute;
  left:13px;
  color:#94a3b8;
  pointer-events:none;
  transition:color .2s;
}
.dc-form-input,
.dc-form-select,
.dc-form-textarea{
  width:100%;
  padding:10px 14px 10px 38px;
  background:var(--bg-cream-soft);
  border:1.5px solid var(--border-card);
  border-radius:14px;
  font-family:inherit;
  font-size:13px;
  color:var(--text-dark);
  outline:none;
  transition:all .2s ease;
  box-shadow:var(--shadow-inset);
}
.dc-form-textarea{
  padding-left:38px;
  resize:vertical;
}
.dc-form-input:focus,
.dc-form-select:focus,
.dc-form-textarea:focus{
  border-color:var(--blue);
  box-shadow:0 0 0 3.5px rgba(40, 69, 238, 0.15);
}
.dc-form-input:focus ~ .dc-input-icon,
.dc-form-select:focus ~ .dc-input-icon,
.dc-form-textarea:focus ~ .dc-input-icon{
  color:var(--blue);
}
@keyframes dcFieldShake{
  0%, 100%{transform:translateX(0)}
  20%, 60%{transform:translateX(-6px)}
  40%, 80%{transform:translateX(6px)}
}
.dc-form-input.is-invalid,
.dc-form-select.is-invalid{
  border-color:#ef4444 !important;
  background:#fff8f8 !important;
  box-shadow:0 0 0 3.5px rgba(239, 68, 68, 0.2) !important;
  animation:dcFieldShake 0.35s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;
}
.dc-form-input.is-invalid ~ .dc-input-icon{
  color:#ef4444 !important;
}
.dc-error-msg{
  font-size:11.5px;
  color:#ef4444;
  font-weight:700;
  display:none;
  margin-top:2px;
}
.dc-error-msg.visible{
  display:block;
}
.dc-form-submit-wrap{
  display:flex;
  flex-direction:column;
  gap:10px;
  align-items:center;
}
.btn-dc-submit-enroll{
  width:100%;
  padding:13px 24px;
  background:linear-gradient(135deg, #2845EE 0%, #1d35c7 50%, #7c3aed 100%);
  color:#ffffff !important;
  border:none;
  border-radius:50px;
  font-family:inherit;
  font-size:14px;
  font-weight:800;
  letter-spacing:.3px;
  cursor:pointer;
  transition:all .25s ease;
  box-shadow:0 8px 24px rgba(40, 69, 238, 0.35), inset 0 1px 0 rgba(255,255,255,0.35);
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
}
.btn-dc-submit-enroll:hover{
  transform:translateY(-2px);
  box-shadow:0 12px 30px rgba(40, 69, 238, 0.45);
}
.dc-form-guarantee{
  display:flex;
  align-items:center;
  gap:6px;
  font-size:11.5px;
  font-weight:600;
  color:#64748b;
}

/* Success State */
.dc-enroll-success{
  text-align:center;
  padding:12px 6px;
}
.dc-success-badge-icon{
  width:72px;
  height:72px;
  border-radius:50%;
  background:rgba(34, 197, 94, 0.12);
  border:2px solid rgba(34, 197, 94, 0.3);
  display:flex;
  align-items:center;
  justify-content:center;
  margin:0 auto 16px;
  box-shadow:0 10px 25px rgba(34, 197, 94, 0.2);
}
.dc-success-title{
  font-size:22px;
  font-weight:800;
  color:var(--text-dark);
  margin-bottom:6px;
}
.dc-success-subtitle{
  font-size:13.5px;
  color:#64748b;
  margin-bottom:20px;
  line-height:1.5;
}
.dc-receipt-box{
  background:var(--bg-cream-soft);
  border:1.5px dashed var(--border-card);
  border-radius:16px;
  padding:16px 20px;
  text-align:left;
  margin-bottom:22px;
}
.dc-receipt-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:8px 0;
  border-bottom:1px solid var(--border-card);
  font-size:13px;
}
.dc-receipt-row:last-child{
  border-bottom:none;
}
.dc-receipt-label{
  color:#64748b;
  font-weight:600;
}
.dc-receipt-id{
  font-family:var(--mono);
  background:rgba(40, 69, 238, 0.08);
  color:var(--blue);
  padding:2px 8px;
  border-radius:6px;
  font-size:12px;
}
.dc-success-actions{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.btn-dc-success-wa{
  width:100%;
  padding:13px 20px;
  background:#22c55e;
  color:#ffffff !important;
  border-radius:50px;
  font-size:14px;
  font-weight:800;
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  transition:all .25s ease;
  box-shadow:0 8px 24px rgba(34, 197, 94, 0.35);
}
.btn-dc-success-wa:hover{
  background:#16a34a;
  transform:translateY(-2px);
  box-shadow:0 12px 30px rgba(34, 197, 94, 0.45);
}
.btn-dc-close-succ{
  background:transparent;
  border:1px solid var(--border-card);
  color:#64748b;
  padding:10px 18px;
  border-radius:50px;
  font-size:13px;
  font-weight:700;
  cursor:pointer;
  transition:all .2s;
  outline:none;
}
.btn-dc-close-succ:hover{
  background:var(--bg-cream-soft);
  color:var(--text-dark);
}

/* ── GAMIFIED CONTROLS IN ENROLLMENT MODAL ── */
.dc-gamified-grid{
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:10px;
}
.dc-gamified-grid.dc-grid-3{
  grid-template-columns:repeat(3, 1fr);
  gap:8px;
}
.dc-game-chip{
  background:var(--bg-cream-card);
  border:1px solid var(--border-card);
  border-radius:16px;
  padding:10px 12px;
  display:flex;
  align-items:center;
  gap:8px;
  cursor:pointer;
  transition:all .22s cubic-bezier(0.16, 1, 0.3, 1);
  user-select:none;
  position:relative;
  overflow:hidden;
  box-shadow:var(--shadow-soft);
}
.dc-grid-3 .dc-game-chip{
  padding:8px 8px;
  gap:6px;
}
.dc-game-chip:hover{
  border-color:rgba(59, 91, 255, 0.45);
  background:linear-gradient(135deg, rgba(238, 245, 255, 0.95) 0%, rgba(245, 243, 255, 0.85) 100%);
  transform:translateY(-1.5px);
}
.dc-game-chip.is-active{
  border-color:var(--blue);
  background:linear-gradient(135deg, rgba(59, 91, 255, 0.09) 0%, rgba(139, 62, 242, 0.09) 100%);
  box-shadow:0 0 0 2px rgba(59, 91, 255, 0.22), 0 6px 18px rgba(59, 91, 255, 0.12);
}
.dc-game-ico{
  width:32px;
  height:32px;
  border-radius:10px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  background:rgba(59, 91, 255, 0.08);
  transition:all .22s ease;
}
.dc-grid-3 .dc-game-ico{
  width:26px;
  height:26px;
  border-radius:8px;
}
.dc-grid-3 .dc-game-ico svg{
  width:16px;
  height:16px;
}
.dc-game-chip:hover .dc-game-ico{
  transform:scale(1.08);
  background:rgba(59, 91, 255, 0.14);
}
.dc-game-chip.is-active .dc-game-ico{
  background:linear-gradient(135deg, rgba(59, 91, 255, 0.18) 0%, rgba(139, 62, 242, 0.18) 100%);
  transform:scale(1.08);
}
.dc-game-ico svg{
  width:20px;
  height:20px;
  display:block;
}
.dc-game-info{
  display:flex;
  flex-direction:column;
  text-align:left;
  line-height:1.2;
  min-width:0;
}
.dc-game-title{
  font-size:12px;
  font-weight:800;
  color:var(--text-dark);
  margin-bottom:2px;
}
.dc-grid-3 .dc-game-title{
  font-size:11px;
  letter-spacing:-0.2px;
  white-space:nowrap;
}
.dc-game-chip.is-active .dc-game-title{
  color:var(--blue);
}
.dc-game-sub{
  font-size:10px;
  color:#64748b;
  font-weight:600;
}
.dc-grid-3 .dc-game-sub{
  font-size:8.5px;
  white-space:nowrap;
}
.dc-game-badge{
  font-family:var(--mono);
  font-size:8.5px;
  font-weight:800;
  padding:2.5px 7.5px;
  border-radius:5px;
  background:linear-gradient(135deg, #2845EE, #1d35c7);
  color:#ffffff;
  letter-spacing:.5px;
  margin-left:auto;
  flex-shrink:0;
  box-shadow:0 2px 6px rgba(40, 69, 238, 0.28);
  transition:all .22s ease;
}
.dc-grid-3 .dc-game-badge{
  font-size:7.5px;
  padding:2px 5.5px;
  border-radius:4px;
  letter-spacing:0.2px;
}
.dc-game-chip:hover .dc-game-badge{
  box-shadow:0 3px 10px rgba(59, 91, 255, 0.4);
  transform:scale(1.04);
}
.dc-game-chip.is-active .dc-game-badge{
  background:linear-gradient(135deg, #2563eb, #8B3EF2);
  color:#ffffff;
  box-shadow:0 3px 12px rgba(59, 91, 255, 0.45);
}

@media(max-width:640px){
  .dc-modal-card{
    padding:26px 18px;
  }
  .dc-form-grid{
    grid-template-columns:1fr;
    gap:14px;
  }
  .dc-gamified-grid,
  .dc-gamified-grid.dc-grid-3{
    grid-template-columns:1fr;
    gap:8px;
  }
}

@media(max-width:1200px){
  .dc-grid{
    grid-template-columns:repeat(3,1fr);
    gap:18px;
  }
}
@media(max-width:960px){
  .dc-grid{
    grid-template-columns:repeat(2,1fr);
    gap:16px;
  }
}

@media(max-width:768px){
  .dc-filters-wrap{
    display:flex !important;
    justify-content:flex-start !important;
    overflow-x:auto !important;
    -webkit-overflow-scrolling:touch !important;
    scrollbar-width:none !important;
    -ms-overflow-style:none !important;
    padding:4px 2px 14px !important;
    margin-bottom:20px !important;
    width:100% !important;
  }
  .dc-filters-wrap::-webkit-scrollbar{
    display:none !important;
  }
  .dc-filters{
    max-width:none !important;
    width:max-content !important;
    flex-shrink:0 !important;
    flex-wrap:nowrap !important;
    margin:0 !important;
  }
  .dc-filter-btn{
    padding:7px 15px !important;
    font-size:12px !important;
    white-space:nowrap !important;
    flex-shrink:0 !important;
  }
  /* Specific Categories: Horizontal swipe carousel in mobile mode */
  .dc-grid.dc-grid-scrollable{
    display:flex !important;
    overflow-x:auto !important;
    scroll-snap-type:x mandatory !important;
    -webkit-overflow-scrolling:touch !important;
    gap:16px !important;
    padding-bottom:16px !important;
    margin:0 -18px 36px !important;
    padding-left:18px !important;
    padding-right:18px !important;
    scrollbar-width:thin !important;
  }
  .dc-grid.dc-grid-scrollable::-webkit-scrollbar{
    height:4px !important;
  }
  .dc-grid.dc-grid-scrollable::-webkit-scrollbar-thumb{
    background:#cbd5e1 !important;
    border-radius:4px !important;
  }
  .dc-grid.dc-grid-scrollable .dc-card{
    flex:0 0 285px !important;
    width:285px !important;
    max-width:285px !important;
    scroll-snap-align:start !important;
  }

  /* "All Courses" Category: YouTube-style vertical feed (scroll down naturally) */
  .dc-grid.dc-grid-vertical,
  .dc-grid:not(.dc-grid-scrollable){
    display:flex !important;
    flex-direction:column !important;
    gap:20px !important;
    margin:0 0 40px !important;
    padding:0 !important;
    overflow:visible !important;
    width:100% !important;
  }
  .dc-grid.dc-grid-vertical .dc-card,
  .dc-grid:not(.dc-grid-scrollable) .dc-card{
    width:100% !important;
    max-width:100% !important;
    flex:none !important;
    border-radius:20px !important;
    box-shadow:0 8px 24px rgba(15,23,42,0.06) !important;
  }
  .dc-grid.dc-grid-vertical .dc-card-thumb,
  .dc-grid:not(.dc-grid-scrollable) .dc-card-thumb{
    height:auto !important;
    aspect-ratio:16/9 !important;
    width:100% !important;
  }
  .dc-grid.dc-grid-vertical .dc-card-body,
  .dc-grid:not(.dc-grid-scrollable) .dc-card-body{
    padding:18px 16px !important;
  }
  .dc-grid.dc-grid-vertical .dc-card-title,
  .dc-grid:not(.dc-grid-scrollable) .dc-card-title{
    font-size:17px !important;
    line-height:1.3 !important;
    margin-bottom:6px !important;
  }
  .dc-grid.dc-grid-vertical .dc-card-desc,
  .dc-grid:not(.dc-grid-scrollable) .dc-card-desc{
    font-size:12.5px !important;
    line-height:1.55 !important;
    margin-bottom:12px !important;
  }
  .dc-search-wrap{
    margin-bottom:18px !important;
  }
}
@media(max-width:640px){
  .dc-grid{
    grid-template-columns:1fr;
    gap:18px;
  }
}

@media(max-width:1024px){
  .courses-grid-row{
    grid-template-columns:repeat(2,1fr);
    gap:16px;
  }
}
@media(max-width:768px){
  .courses-grid-row{
    display:flex;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
    gap:14px;
    padding-bottom:12px;
    margin:0 -16px;
    padding-left:16px;
    padding-right:16px;
  }
  .courses-grid-row::-webkit-scrollbar{
    height:4px;
  }
  .courses-grid-row::-webkit-scrollbar-thumb{
    background:#cbd5e1;
    border-radius:4px;
  }
  .coursera-card{
    flex:0 0 250px;
    scroll-snap-align:start;
  }
  .coursera-thumb{
    height:135px;
  }
}

/* CONTACT */
.contact{background:linear-gradient(180deg,#edf2fc 0%,var(--bg-cream) 100%)}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:start}
.cbox{background:var(--bg-cream-card);border-radius:26px;padding:40px;box-shadow:var(--shadow-soft);border:1px solid var(--border-card)}
.cbox h3{font-size:20px;font-weight:800;margin-bottom:28px;color:var(--text-dark);letter-spacing:-.5px}
.ci{display:flex;align-items:flex-start;gap:14px;padding:16px 0;border-bottom:1px solid var(--border-card)}
.ci:last-of-type{border-bottom:none;padding-bottom:0}
.ci-ico{width:42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0;overflow:hidden}
.ci-ico img{width:100%;height:100%;object-fit:cover;border-radius:12px}
.ci-ph{background:none}
.ci-em{background:none}
.ci-lbl{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:2px;color:var(--muted);margin-bottom:3px}
.ci-val{font-size:15px;font-weight:600;color:var(--text-dark);transition:color .2s}
.ci-val:hover{color:var(--blue)}
.ctag{margin-top:24px;font-size:20px;font-weight:800;line-height:1.4;letter-spacing:-.5px}
.sg{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:20px}
.sl-btn{display:flex;align-items:center;gap:12px;border:1px solid var(--border-card);padding:13px 14px;border-radius:16px;font-size:13px;font-weight:600;color:var(--text-dark);background:var(--bg-cream-soft);transition:all .25s ease;position:relative;overflow:hidden;box-shadow:var(--shadow-soft)}
.sl-btn:hover{border-color:transparent;color:#fff;transform:translateY(-2px);box-shadow:0 8px 20px rgba(0,0,0,.12)}
.sl-btn.fb:hover{background:#1877f2}.sl-btn.tt:hover{background:#000000}.sl-btn.ig:hover{background:linear-gradient(135deg,#f09433,#dc2743,#bc1888)}.sl-btn.wa:hover{background:#25d366}.sl-btn.wg:hover{background:#128c7e}.sl-btn.gm:hover{background:#ea4335}
.sl-ico{width:34px;height:34px;border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0;color:#fff}
.si-fb{background:#1877f2}.si-tt{background:#000000;box-shadow:0 3px 10px rgba(0,0,0,.35)}.si-ig{background:linear-gradient(135deg,#f09433,#dc2743,#bc1888)}.si-wa{background:#25d366}.si-wg{background:#128c7e}.si-gm{background:#ea4335}
.sl-txt strong{font-size:13px;font-weight:700;display:block}
.sl-txt small{font-size:10px;color:var(--muted)}
.sl-btn:hover .sl-txt small{color:rgba(255,255,255,.7)}
.btn-wa-big{display:flex;align-items:center;justify-content:center;gap:10px;background:#22c55e;color:#fff;padding:15px;border-radius:50px;font-size:15px;font-weight:700;box-shadow:0 4px 20px rgba(34,197,94,.25);transition:all .2s}
.btn-wa-big:hover{background:#16a34a;transform:translateY(-2px)}

/* FOOTER */
.footer{background:#080B16;border-top:1px solid rgba(255,255,255,.08);position:relative}
.ft-in{max-width:1200px;margin:0 auto;padding:56px 32px 40px;display:grid;grid-template-columns:2fr 1fr 1fr;gap:40px;border-bottom:1px solid rgba(255,255,255,.08)}
.ft-logo{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.ft-ico{width:36px;height:36px;object-fit:contain;border-radius:8px}
.ft-name{font-size:16px;font-weight:800;color:#fff;display:block}
.ft-name em{color:#60a5fa;font-style:normal}
.ft-sub{font-size:11px;color:#94a3b8;font-weight:500}
.ft-desc{font-size:14px;color:#cbd5e1;line-height:1.75;max-width:380px}
.ft-col h4{font-size:12px;font-weight:800;color:#fff;letter-spacing:2px;text-transform:uppercase;margin-bottom:18px}
.ft-col a{display:block;font-size:14px;color:#94a3b8;margin-bottom:10px;transition:all .2s ease;font-weight:500}
.ft-col a:hover{color:#60a5fa;transform:translateX(3px)}
.ft-soc{display:flex;gap:10px;flex-wrap:wrap}
.ft-soc a{width:38px;height:38px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:#e2e8f0;transition:all .25s ease}
.ft-soc a:hover{background:var(--blue);color:#fff;border-color:var(--blue);transform:translateY(-2px);box-shadow:0 6px 16px rgba(59,91,255,.35)}
.ft-bot{max-width:1200px;margin:0 auto;padding:24px 32px;text-align:center}
.ft-bot p{font-size:13px;color:#64748b;font-weight:500}

/* CHATBOT */
.cfab{position:fixed;bottom:28px;right:28px;width:56px;height:56px;background:#0c1c4f;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:997;box-shadow:0 8px 30px rgba(59,91,255,.45);transition:all .35s cubic-bezier(0.16,1,0.3,1);border:2px solid #38bdf8;padding:2px;overflow:hidden}
.cfab:hover{transform:scale(1.08) translateY(-2px);box-shadow:0 14px 40px rgba(59,91,255,.6);border-color:#60a5fa}
.cfab.active{transform:scale(0.95);box-shadow:0 4px 18px rgba(59,91,255,.4);border-color:#60a5fa}
.cfab img{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block;transition:transform .35s cubic-bezier(0.16,1,0.3,1)}
.cfab:hover img{transform:scale(1.05)}
.cwin{position:fixed;bottom:96px;right:28px;width:340px;background:var(--bg-cream-card);border-radius:24px;box-shadow:0 24px 80px rgba(15,23,42,.18),0 4px 20px rgba(40,69,238,.12);z-index:996;display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--border-card);max-height:480px;opacity:0;visibility:hidden;pointer-events:none;transform:scale(0.82) translateY(24px);transform-origin:bottom right;transition:opacity .28s cubic-bezier(0.4,0,0.2,1),transform .32s cubic-bezier(0.4,0,0.2,1),visibility .32s cubic-bezier(0.4,0,0.2,1);will-change:transform,opacity}
.cwin.open{opacity:1;visibility:visible;pointer-events:auto;transform:scale(1) translateY(0);transition:opacity .36s cubic-bezier(0.16,1,0.3,1),transform .4s cubic-bezier(0.16,1,0.3,1),visibility .4s cubic-bezier(0.16,1,0.3,1)}
@media(max-width:640px){
  .cwin{
    bottom:82px;
    right:12px;
    left:12px;
    width:auto;
    max-width:calc(100vw - 24px);
    max-height:min(520px, calc(100dvh - 100px));
    border-radius:22px;
    transform-origin:bottom center;
  }
}
.ch{background:linear-gradient(135deg,#0c2363,#1e50d8);padding:16px 18px;display:flex;align-items:center;justify-content:space-between}
.ch-l{display:flex;align-items:center;gap:12px}
.ch-av{width:42px;height:42px;background:#080e22;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:0 0 14px rgba(34,211,238,.5);border:2px solid #38bdf8;overflow:hidden;padding:0}
.ch-av img{width:100%;height:100%;object-fit:cover;display:block;border-radius:50%}
.ch-l strong{display:flex;align-items:center;gap:6px;font-size:14.5px;color:#fff;font-weight:700;letter-spacing:-.2px}
.ch-l small{font-size:11px;color:rgba(255,255,255,.85);display:flex;align-items:center;gap:4px}
.ch-r{display:flex;align-items:center;gap:6px}
.ch-trash{background:none;border:none;color:rgba(255,255,255,.75);cursor:pointer;display:flex;align-items:center;justify-content:center;padding:4px 6px;border-radius:6px;transition:all .2s}
.ch-trash:hover{color:#ef4444;background:rgba(255,255,255,.15);transform:scale(1.08)}
.ch-x{background:none;border:none;color:rgba(255,255,255,.75);cursor:pointer;font-size:14px;transition:color .2s;display:flex;align-items:center;justify-content:center;padding:4px 6px;border-radius:6px}
.ch-x:hover{color:#fff;background:rgba(255,255,255,.15)}
.cbody{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:10px}
.cm.bot .cb{background:var(--bg-cream-soft);color:var(--text-dark);border:1px solid var(--border-card);padding:11px 14px;border-radius:4px 14px 14px 14px;font-size:13px;line-height:1.6;max-width:88%}
.cm.usr{align-self:flex-end}
.cm.usr .cb{background:var(--grad);color:#fff;padding:11px 14px;border-radius:14px 4px 14px 14px;font-size:13px;line-height:1.6;max-width:88%}
.cqr{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
.cqr button{background:linear-gradient(145deg, #ffffff 0%, #e8edf5 100%);border:none;color:#2845EE;box-shadow:0 6px 14px -2px rgba(155, 168, 195, 0.4), inset 0 2px 3px #ffffff, inset 0 -2px 4px rgba(166, 175, 195, 0.4);padding:7px 14px;border-radius:50px;font-size:11px;font-weight:700;cursor:pointer;transition:all .2s;font-family:'Space Grotesk',sans-serif}
.cqr button:hover{background:linear-gradient(135deg, #3d75fd 0%, #2b64f5 50%, #1a4ee5 100%);color:#fff;box-shadow:0 8px 18px -2px rgba(26, 72, 230, 0.45), inset 0 2px 4px rgba(255,255,255,0.5), inset 0 -2px 4px rgba(10,30,130,0.5);transform:translateY(-1px)}
.cfoot{display:flex;gap:8px;padding:10px;border-top:1px solid var(--border-card)}
.cfoot input{flex:1;border:1px solid var(--border-card);background:var(--bg-cream-soft);border-radius:50px;padding:8px 14px;font-size:13px;outline:none;font-family:'Space Grotesk',sans-serif;color:var(--text-dark)}
.cfoot input:focus{border-color:rgba(40,69,238,.4)}
.csend{width:34px;height:34px;background:var(--grad);border:none;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:opacity .2s}
.csend:hover{opacity:.85}
.csend:disabled{opacity:.4;cursor:not-allowed}
.c-typing{display:flex;align-items:center;gap:4px;padding:12px 16px!important;width:fit-content}
.c-typing span{width:6px;height:6px;background:var(--blue);border-radius:50%;display:inline-block;animation:cDot 1.4s infinite ease-in-out}
.c-typing span:nth-child(1){animation-delay:-0.32s}
.c-typing span:nth-child(2){animation-delay:-0.16s}
@keyframes cDot{0%,80%,100%{transform:scale(0);opacity:0.3}40%{transform:scale(1);opacity:1}}
.cm.bot .cb a{color:var(--blue);font-weight:700;text-decoration:underline;word-break:break-all}
.cm.bot .cb strong{color:var(--text-dark)}
.cm.bot .cb ul{margin:6px 0 6px 16px;padding:0}
.cm.bot .cb li{margin-bottom:4px}
.c-action-btn{display:inline-flex;align-items:center;gap:6px;margin-top:8px;background:var(--grad);color:#fff!important;text-decoration:none!important;padding:7px 14px;border-radius:8px;font-size:11.5px;font-weight:700;box-shadow:0 2px 8px rgba(59,91,255,.25);transition:transform .2s}
.c-action-btn:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(59,91,255,.35)}

/* ── BACK TO TOP BUTTON ── */
.back-to-top{
  position:fixed;
  bottom:96px;
  right:28px;
  width:48px;
  height:48px;
  background:linear-gradient(135deg,#0c1c4f,#131f4a);
  border:1.5px solid rgba(56,189,248,0.45);
  border-radius:50%;
  color:#38bdf8;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  z-index:995;
  box-shadow:0 8px 24px rgba(15,23,42,0.35),0 0 12px rgba(56,189,248,0.15);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(16px) scale(0.9);
  transition:opacity .32s cubic-bezier(0.16,1,0.3,1),transform .32s cubic-bezier(0.16,1,0.3,1),visibility .32s,background .25s,border-color .25s,box-shadow .25s;
}
.back-to-top.show{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateY(0) scale(1);
}
.back-to-top:hover{
  transform:translateY(-3px) scale(1.08);
  color:#ffffff;
  background:linear-gradient(135deg,#2845EE,#1d35c7);
  border-color:#60a5fa;
  box-shadow:0 12px 28px rgba(40,69,238,0.45),0 0 18px rgba(96,165,250,0.35);
}
.back-to-top:active{
  transform:scale(0.92);
}

/* ── AI SIDE PEEKER TAB (Shows on scroll when AI FAB tucks) ── */
.ai-peeker{
  position:fixed;
  bottom:32px;
  right:0;
  z-index:998;
  display:flex;
  align-items:center;
  gap:7px;
  background:linear-gradient(135deg,#0c1c4f 0%,#152968 50%,#1e50d8 100%);
  border:1.5px solid #38bdf8;
  border-right:none;
  border-radius:18px 0 0 18px;
  padding:8px 10px 8px 12px;
  color:#ffffff;
  cursor:pointer;
  box-shadow:-4px 8px 24px rgba(12,28,79,0.5),0 0 14px rgba(56,189,248,0.25);
  transform:translateX(108%);
  transition:transform .35s cubic-bezier(0.16,1,0.3,1),box-shadow .25s ease;
  user-select:none;
  -webkit-user-select:none;
}
.ai-peeker.show{
  transform:translateX(0);
}
.ai-peeker:hover{
  transform:translateX(-4px);
  box-shadow:-6px 10px 28px rgba(59,91,255,0.55),0 0 20px rgba(96,165,250,0.4);
}
.ai-peeker-arrow{
  color:#38bdf8;
  animation:peekerNudge 1.8s ease-in-out infinite;
  flex-shrink:0;
}
@keyframes peekerNudge{
  0%,100%{transform:translateX(0)}
  50%{transform:translateX(-3px)}
}
.ai-peeker-avatar{
  width:24px;
  height:24px;
  border-radius:50%;
  overflow:hidden;
  border:1.5px solid #38bdf8;
  flex-shrink:0;
}
.ai-peeker-avatar img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.ai-peeker-text{
  font-family:var(--mono);
  font-size:11px;
  font-weight:700;
  letter-spacing:1px;
  color:#ffffff;
}

/* ── CFAB TUCKED / SLIDE-INTO-EDGE STATE ── */
.cfab.tucked{
  transform:translateX(120px) scale(0.85)!important;
  opacity:0!important;
  pointer-events:none!important;
}
.cfab.pop-attention{
  animation:popAttention .5s cubic-bezier(0.16,1,0.3,1);
}
@keyframes popAttention{
  0%{transform:scale(0.8)}
  50%{transform:scale(1.15)}
  100%{transform:scale(1)}
}

/* ── DESKTOP VS MOBILE BANNER DISPLAY ── */
.desktop-banner-only{display:block}
.mobile-banner-only{display:none}

/* RESPONSIVE & MOBILE OPTIMIZATIONS */
@media(max-width:1024px){
  .hero-right,.desktop-only-device-mockup{display:none!important}
  .nav{overflow:visible!important}
  .nav-btn{display:none}
  .hbg{
    display:flex;
    position:relative;
    z-index:10005;
    cursor:pointer;
    pointer-events:auto;
    -webkit-tap-highlight-color:transparent;
    touch-action:manipulation;
    transition:all .35s cubic-bezier(0.34, 1.4, 0.64, 1);
  }
  .hbg:active{
    transform:scale(0.92);
  }
  .hbg span{
    transition:transform .38s cubic-bezier(0.34, 1.4, 0.64, 1), opacity .25s ease, background .3s ease;
    transform-origin:center;
  }
  .hbg.active{
    transform:rotate(90deg) scale(1.04);
  }
  .hbg.active span:nth-child(1){
    transform:translateY(7px) rotate(45deg);
    background:var(--blue);
  }
  .hbg.active span:nth-child(2){
    opacity:0;
    transform:scaleX(0) translateX(8px);
  }
  .hbg.active span:nth-child(3){
    transform:translateY(-7px) rotate(-45deg);
    background:var(--blue);
  }
  .nav-ul{
    display:flex;
    flex-direction:column;
    position:fixed;
    top:74px;
    left:14px;
    right:14px;
    background:#ffffff !important;
    padding:16px 14px 20px;
    border:1px solid rgba(215,222,235,0.85);
    box-shadow:0 16px 40px rgba(15,23,42,0.18), 0 4px 12px rgba(15,23,42,0.08);
    border-radius:24px;
    gap:4px;
    z-index:10002 !important;
    max-height:calc(100vh - 90px);
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
    transform-origin:top center;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:translateY(-14px) scale(0.96);
    filter:none !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
    transition:transform .28s cubic-bezier(0.16, 1, 0.3, 1), opacity .22s ease, visibility .28s;
  }
  .nav-ul.open{
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transform:translateY(0) scale(1)!important;
    filter:none !important;
  }
  .nav-ul li{
    width:100%;
    opacity:0;
    transform:translateY(-10px);
    transition:opacity .2s ease, transform .2s ease;
  }
  .nav-ul.open li{
    opacity:1!important;
    transform:translateY(0)!important;
    transition:opacity .36s cubic-bezier(0.16, 1, 0.3, 1), transform .42s cubic-bezier(0.16, 1, 0.3, 1)!important;
  }
  .nav-ul.open li:nth-child(1){transition-delay:0.03s!important}
  .nav-ul.open li:nth-child(2){transition-delay:0.06s!important}
  .nav-ul.open li:nth-child(3){transition-delay:0.09s!important}
  .nav-ul.open li:nth-child(4){transition-delay:0.12s!important}
  .nav-ul.open li:nth-child(5){transition-delay:0.15s!important}
  .nav-ul.open li:nth-child(6){transition-delay:0.18s!important}
  .nav-ul.open li:nth-child(7){transition-delay:0.21s!important}
  .nav-ul.open li:nth-child(8){transition-delay:0.24s!important}
  .nav-ul.open li:nth-child(9){transition-delay:0.27s!important}
  .nav-ul.open li:nth-child(10){transition-delay:0.30s!important}
  .nav-ul.open li:nth-child(11){transition-delay:0.33s!important}
  .nav-ul.open li:nth-child(12){transition-delay:0.36s!important}
  .nav-ul:not(.open) li{transition-delay:0s!important}

  .nav-ul li a{
    display:flex;
    align-items:center;
    gap:12px;
    padding:11px 14px;
    font-size:13.5px;
    font-weight:650;
    color:#1e293b;
    border-radius:14px;
    width:100%;
    min-height:44px;
    box-sizing:border-box;
    border:1px solid transparent;
    transition:all .22s cubic-bezier(0.16, 1, 0.3, 1);
    text-decoration:none;
  }
  .nav-ul li a svg{
    width:16px;
    height:16px;
    color:#64748b;
    transition:all .22s cubic-bezier(0.16, 1, 0.3, 1);
    flex-shrink:0;
  }
  .nav-ul li a:hover,
  .nav-ul li a:focus{
    background:linear-gradient(135deg, rgba(59,91,255,0.08) 0%, rgba(139,62,242,0.05) 100%);
    border-color:rgba(59,91,255,0.2);
    color:var(--blue);
    transform:translateX(5px);
  }
  .nav-ul li a:hover svg,
  .nav-ul li a:focus svg{
    color:var(--blue);
    transform:scale(1.18) rotate(-4deg);
  }
  .nav-ul li a:active{
    transform:scale(0.97) translateX(3px);
  }
  .nav-ul li a.on{
    background:linear-gradient(135deg,#2845EE,#1d35c7);
    color:#ffffff;
    box-shadow:0 6px 18px rgba(40,69,238,0.35);
    border-color:transparent;
  }
  .nav-ul li a.on svg{
    color:#ffffff;
    transform:scale(1.1);
  }
  .nav-ul::-webkit-scrollbar{width:4px}
  .nav-ul::-webkit-scrollbar-thumb{background:rgba(148,163,184,0.35);border-radius:4px}
  .svc-grid{grid-template-columns:repeat(2,1fr)}
  .team-grid{grid-template-columns:repeat(2,1fr)}
  .mentor-grid{grid-template-columns:repeat(2,1fr)}
  .about-in,.why-in,.hiring-in,.partner-in,.int-grid,.feat-grid{grid-template-columns:1fr;gap:36px}
  .lead-grid{grid-template-columns:repeat(2,1fr);gap:20px}
}

@media(max-width:768px){
  /* GLOBAL MOBILE FIX - No horizontal scroll */
  html,body{max-width:100%!important;overflow-x:hidden!important}
  section,div,header,footer,nav{max-width:100%!important;box-sizing:border-box!important}

  /* Banner display switch */
  .desktop-banner-only{display:none!important}
  .mobile-banner-only{display:block!important}

  /* Section Spacing & Typography */
  .sw{padding:36px 18px!important;max-width:100%!important;width:100%!important;box-sizing:border-box!important;overflow:hidden!important}
  .st{font-size:clamp(24px,6.5vw,32px)!important;line-height:1.2!important;letter-spacing:-.8px!important;margin-bottom:12px!important}
  .ss{font-size:14px!important;line-height:1.65!important}
  .sl{font-size:10.5px!important;letter-spacing:2px!important;margin-bottom:8px!important}

  /* Header & Navigation - Liquid Glass Theme with Circle-Type Curved Bottom Corners */
  .nav{
    height:60px!important;
    border-radius:0 0 28px 28px!important;
    background:radial-gradient(135% 120% at 15% 0%, rgba(253,252,249,0.92) 0%, rgba(245,244,239,0.82) 50%, rgba(253,252,249,0.9) 100%)!important;
    backdrop-filter:blur(24px) saturate(190%)!important;
    -webkit-backdrop-filter:blur(24px) saturate(190%)!important;
    border-bottom:1.5px solid var(--border-soft)!important;
    border-left:1px solid var(--border-soft)!important;
    border-right:1px solid var(--border-soft)!important;
    border-top:none!important;
    box-shadow:0 4px 18px rgba(15,23,42,0.06), 0 1px 3px rgba(15,23,42,0.03)!important;
    position:fixed!important;
    overflow:visible!important;
    z-index:10000!important;
  }
  .nav::before,
  .nav::after{
    content:none!important;
    display:none!important;
  }
  .nav.s{
    background:radial-gradient(135% 120% at 15% 0%, rgba(250,249,245,0.96) 0%, rgba(245,244,239,0.9) 50%, rgba(250,249,245,0.95) 100%)!important;
    border-bottom-color:var(--border-card)!important;
    box-shadow:0 8px 24px rgba(15,23,42,0.08), 0 2px 6px rgba(15,23,42,0.04)!important;
  }
  .nav-in{height:60px!important;padding:0 16px 0 16px!important;width:100%!important;box-sizing:border-box!important;display:flex!important;align-items:center!important;justify-content:space-between!important;position:relative!important;z-index:2!important}
  .nav-logo{gap:8px!important;flex-shrink:0!important;margin-left:0!important}
  .nav-ico{width:32px!important;height:32px!important}
  .nav-txt strong{font-size:12.5px!important}
  .nav-txt small{font-size:9px!important}
  .nav-btn{display:none!important}
  .hbg{
    display:flex!important;
    width:38px!important;
    height:38px!important;
    flex-shrink:0!important;
    margin-left:auto!important;
    margin-right:0!important;
    background:var(--bg-cream-soft)!important;
    backdrop-filter:blur(20px) saturate(190%)!important;
    -webkit-backdrop-filter:blur(20px) saturate(190%)!important;
    border:1.5px solid var(--border-card)!important;
    border-radius:12px!important;
    box-shadow:var(--shadow-soft)!important;
    transition:all .35s cubic-bezier(0.34, 1.4, 0.64, 1)!important;
    position:relative!important;
    z-index:10005!important;
    cursor:pointer!important;
    pointer-events:auto!important;
    -webkit-tap-highlight-color:transparent!important;
    touch-action:manipulation!important;
  }
  .hbg:active{
    transform:scale(0.92)!important;
  }
  .hbg span{
    display:block!important;
    width:19px!important;
    height:2.2px!important;
    background:var(--text-dark)!important;
    border-radius:3px!important;
    pointer-events:none!important;
    transition:transform .38s cubic-bezier(0.34, 1.4, 0.64, 1), opacity .25s ease, background .3s ease!important;
    transform-origin:center!important;
  }
  .hbg.active{
    background:linear-gradient(135deg, rgba(238,244,255,0.98) 0%, rgba(215,232,255,0.9) 100%)!important;
    border-color:rgba(40,69,238,0.45)!important;
    box-shadow:0 8px 24px -2px rgba(40,69,238,0.32), inset 0 1.5px 2px rgba(255,255,255,1)!important;
    transform:rotate(90deg) scale(1.04)!important;
  }
  .hbg.active span:nth-child(1){
    transform:translateY(7px) rotate(45deg)!important;
    background:var(--blue)!important;
  }
  .hbg.active span:nth-child(2){
    opacity:0!important;
    transform:scaleX(0) translateX(8px)!important;
  }
  .hbg.active span:nth-child(3){
    transform:translateY(-7px) rotate(-45deg)!important;
    background:var(--blue)!important;
  }
  .nav-ul{
    display:flex!important;
    flex-direction:column!important;
    position:fixed!important;
    top:66px!important;
    left:10px!important;
    right:10px!important;
    width:auto!important;
    background:radial-gradient(135% 120% at 20% 0%, rgba(253,252,249,0.98) 0%, rgba(245,244,239,0.95) 55%, rgba(253,252,249,0.98) 100%)!important;
    backdrop-filter:blur(32px) saturate(200%)!important;
    -webkit-backdrop-filter:blur(32px) saturate(200%)!important;
    border-radius:26px!important;
    padding:14px 12px 18px!important;
    box-shadow:0 16px 40px rgba(15,23,42,0.18), 0 4px 12px rgba(15,23,42,0.08)!important;
    border:1px solid rgba(215,222,235,0.85)!important;
    gap:4px!important;
    z-index:9999!important;
    max-height:calc(100vh - 80px)!important;
    overflow-y:auto!important;
    -webkit-overflow-scrolling:touch!important;
    transform-origin:top right!important;
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
    transform:translateY(-20px) scale(0.94)!important;
    filter:blur(10px)!important;
    transition:transform .32s cubic-bezier(0.22, 1, 0.36, 1), opacity .25s cubic-bezier(0.22, 1, 0.36, 1), filter .25s ease, visibility .32s!important;
    will-change:transform,opacity,filter!important;
  }
  .nav-ul.open{
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transform:translateY(0) scale(1)!important;
    filter:blur(0px)!important;
    transition:transform .44s cubic-bezier(0.16, 1, 0.3, 1), opacity .32s cubic-bezier(0.16, 1, 0.3, 1), filter .35s ease, visibility .44s!important;
  }
  .nav-ul li{
    width:100%!important;
    opacity:0!important;
    transform:translateY(-10px)!important;
    transition:opacity .2s ease, transform .2s ease!important;
  }
  .nav-ul.open li{
    opacity:1!important;
    transform:translateY(0)!important;
    transition:opacity .36s cubic-bezier(0.16, 1, 0.3, 1), transform .42s cubic-bezier(0.16, 1, 0.3, 1)!important;
  }
  .nav-ul.open li:nth-child(1){transition-delay:0.03s!important}
  .nav-ul.open li:nth-child(2){transition-delay:0.06s!important}
  .nav-ul.open li:nth-child(3){transition-delay:0.09s!important}
  .nav-ul.open li:nth-child(4){transition-delay:0.12s!important}
  .nav-ul.open li:nth-child(5){transition-delay:0.15s!important}
  .nav-ul.open li:nth-child(6){transition-delay:0.18s!important}
  .nav-ul.open li:nth-child(7){transition-delay:0.21s!important}
  .nav-ul.open li:nth-child(8){transition-delay:0.24s!important}
  .nav-ul.open li:nth-child(9){transition-delay:0.27s!important}
  .nav-ul.open li:nth-child(10){transition-delay:0.30s!important}
  .nav-ul.open li:nth-child(11){transition-delay:0.33s!important}
  .nav-ul.open li:nth-child(12){transition-delay:0.36s!important}
  .nav-ul:not(.open) li{transition-delay:0s!important}

  .nav-ul li a{
    display:flex!important;
    align-items:center!important;
    gap:12px!important;
    padding:11px 14px!important;
    font-size:13.5px!important;
    font-weight:650!important;
    color:var(--text-dark)!important;
    border-radius:14px!important;
    width:100%!important;
    min-height:44px!important;
    box-sizing:border-box!important;
    border:1px solid transparent!important;
    transition:all .22s cubic-bezier(0.16, 1, 0.3, 1);
    text-decoration:none!important;
  }
  .nav-ul li a svg{
    width:16px!important;
    height:16px!important;
    color:#64748b!important;
    transition:all .22s cubic-bezier(0.16, 1, 0.3, 1);
    flex-shrink:0!important;
  }
  .nav-ul li a:hover,
  .nav-ul li a:focus{
    background:linear-gradient(135deg, rgba(40,69,238,0.08) 0%, rgba(124,58,237,0.05) 100%)!important;
    border-color:rgba(40,69,238,0.2)!important;
    color:var(--blue)!important;
    transform:translateX(5px)!important;
  }
  .nav-ul li a:hover svg,
  .nav-ul li a:focus svg{
    color:var(--blue)!important;
    transform:scale(1.18) rotate(-4deg)!important;
  }
  .nav-ul li a:active{
    transform:scale(0.97) translateX(3px)!important;
  }
  .nav-ul li a.on{
    background:linear-gradient(135deg,#2845EE,#1d35c7)!important;
    color:#ffffff!important;
    box-shadow:0 6px 18px rgba(40,69,238,0.35)!important;
    border-color:transparent!important;
  }
  .nav-ul li a.on svg{
    color:#ffffff!important;
    transform:scale(1.1)!important;
  }
  .nav-ul::-webkit-scrollbar{width:4px!important}
  .nav-ul::-webkit-scrollbar-thumb{background:rgba(148,163,184,0.35)!important;border-radius:4px!important}

  /* Hero Section - Vertically Balanced & Filled Mobile View */
  .hero{
    min-height:auto!important;
    margin-top:0!important;
    padding:96px 0 46px!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:flex-start!important;
    justify-content:flex-start!important;
    background-color:var(--bg-cream)!important;
    background-image:
      linear-gradient(to right, rgba(45,38,28,0.04) 1px, transparent 1px),
      linear-gradient(to bottom, rgba(45,38,28,0.04) 1px, transparent 1px)!important;
    background-size:38px 38px!important;
    background-position:-1px -1px!important;
    overflow:hidden!important;
    width:100%!important;
  }
  .hero-deco{display:block!important;opacity:0.85!important}
  .hero-glow-orb{filter:blur(40px)!important}
  .hero-glow-orb.orb-1{width:320px!important;height:320px!important;top:-50px!important;right:-60px!important}
  .hero-glow-orb.orb-2{width:280px!important;height:280px!important;bottom:-50px!important;left:-60px!important}
  .hero-glow-orb.orb-3{display:none!important}
  .hero-glow-orb.orb-4{display:none!important}
  .hero-glow-orb.orb-5{width:250px!important;height:250px!important}
  .hero-bubble{transform:scale(0.7)}
  .hero-right,.desktop-only-device-mockup{display:none!important}
  .hero-in{
    padding:0 14px!important;
    width:100%!important;
    max-width:100%!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:flex-start!important;
    box-sizing:border-box!important;
  }
  .hero-left{
    max-width:100%!important;
    width:100%!important;
    text-align:left!important;
    align-items:flex-start!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:flex-start!important;
    margin:0!important;
  }
  .hero-badge{display:none!important}
  .hero-h1{
    font-size:clamp(32px,8.8vw,40px)!important;
    line-height:1.16!important;
    margin-bottom:26px!important;
    letter-spacing:-1px!important;
    word-break:break-word!important;
    text-align:left!important;
    font-weight:800!important;
    color:var(--text-dark)!important;
  }
  .hero-p{display:none!important}
  .hero-btns{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:10px!important;
    width:100%!important;
    max-width:100%!important;
    margin-bottom:20px!important;
    box-sizing:border-box!important;
  }
  .btn-blue,.btn-out{
    width:100%!important;
    min-height:48px!important;
    height:48px!important;
    padding:0 8px!important;
    font-size:13px!important;
    font-weight:700!important;
    border-radius:50px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    text-align:center!important;
    white-space:nowrap!important;
    gap:6px!important;
    box-sizing:border-box!important;
    flex:none!important;
  }
  .btn-blue svg,.btn-out svg{width:15px!important;height:15px!important;flex-shrink:0!important}
  .hero-mobile-visual{display:none!important}

  /* Liquid Glass Rating Bar - Strictly Single Row with Comfortable Size */
  .hero-trust.liquid-glass{
    display:flex!important;
    flex-direction:row!important;
    flex-wrap:nowrap!important;
    white-space:nowrap!important;
    align-items:center!important;
    justify-content:space-between!important;
    width:100%!important;
    max-width:100%!important;
    box-sizing:border-box!important;
    padding:9px 10px!important;
    min-height:48px!important;
    margin-top:0!important;
    background:radial-gradient(120% 120% at 15% 0%, rgba(253,252,249,0.96) 0%, rgba(245,244,239,0.85) 50%, rgba(253,252,249,0.95) 100%)!important;
    backdrop-filter:blur(28px) saturate(190%)!important;
    -webkit-backdrop-filter:blur(28px) saturate(190%)!important;
    border-radius:50px!important;
    border:1.5px solid var(--border-card)!important;
    box-shadow:
      0 14px 34px -4px rgba(45,38,28,0.08),
      0 4px 14px rgba(45,38,28,0.03),
      inset 0 2px 3px #ffffff!important;
    position:relative!important;
    overflow:hidden!important;
  }
  .hero-trust.liquid-glass::before{
    content:''!important;
    position:absolute!important;
    top:0!important;
    left:0!important;
    right:0!important;
    height:50%!important;
    background:linear-gradient(180deg, rgba(255,255,255,0.8) 0%, rgba(255,255,255,0) 100%)!important;
    border-radius:50px 50px 0 0!important;
    pointer-events:none!important;
  }
  .hero-trust.liquid-glass::after{
    content:''!important;
    position:absolute!important;
    top:1px!important;
    left:14px!important;
    right:14px!important;
    height:1px!important;
    background:linear-gradient(90deg, transparent, rgba(255,255,255,1), transparent)!important;
    pointer-events:none!important;
  }
  .trust-item{
    display:inline-flex!important;
    align-items:center!important;
    gap:3px!important;
    font-size:10px!important;
    color:#334155!important;
    white-space:nowrap!important;
    flex-shrink:0!important;
    position:relative!important;
    z-index:1!important;
  }
  .trust-item strong,.trust-num strong{
    color:var(--text-dark)!important;
    font-weight:800!important;
    font-size:10.5px!important;
  }
  .trust-score strong{
    color:var(--blue)!important;
    font-weight:800!important;
    font-size:11px!important;
  }
  .trust-stars{
    color:#f59e0b!important;
    font-size:9px!important;
    letter-spacing:-0.5px!important;
    margin-right:1px!important;
    filter:drop-shadow(0 1px 2px rgba(245,158,11,0.4))!important;
  }
  .trust-svg{
    width:11px!important;
    height:11px!important;
    flex-shrink:0!important;
  }
  .trust-svg.prj-svg{color:var(--blue)!important}
  .trust-svg.cli-svg{color:#7c3aed!important}
  .trust-lbl{
    color:#64748b!important;
    font-size:9.5px!important;
    font-weight:600!important;
  }
  .trust-glass-sep{
    display:block!important;
    width:1px!important;
    height:16px!important;
    background:linear-gradient(to bottom, rgba(40,69,238,0.05), rgba(40,69,238,0.35), rgba(40,69,238,0.05))!important;
    border-radius:2px!important;
    flex-shrink:0!important;
    margin:0 1px!important;
  }
  @media(max-width:380px){
    .hero-btns{gap:6px!important}
    .btn-blue,.btn-out{font-size:11.8px!important;padding:0 4px!important;gap:4px!important;border-radius:50px!important}
    .hero-trust.liquid-glass{padding:8px 6px!important}
    .trust-item{font-size:9px!important;gap:2px!important}
    .trust-stars{font-size:8px!important;letter-spacing:-1px!important}
    .trust-score strong{font-size:10px!important}
    .trust-num strong{font-size:9.5px!important}
    .trust-lbl{font-size:8.5px!important}
    .trust-svg{width:10px!important;height:10px!important}
  }
  .mq-sub{display:none!important}

  /* Photo Banner / Live Stats */
  .photo-banner{min-height:auto!important;padding:40px 0!important;width:100%!important;overflow:hidden!important}
  .photo-banner .pb-overlay{padding:0 16px!important}
  .pb-title{font-size:clamp(22px,5.5vw,28px)!important;margin-bottom:22px!important;line-height:1.25!important}
  .pb-stats{grid-template-columns:1fr 1fr!important;gap:10px!important;width:100%!important}
  .pb-stat{padding:18px 12px!important;border-radius:16px!important;animation:none!important;transform:none!important}
  .pb-stat strong{font-size:clamp(24px,6vw,30px)!important;margin-bottom:4px!important}
  .pb-stat span{font-size:10.5px!important}

  /* Services Section - Curved Circle-Type Top Border */
  .services{
    background:var(--bg-cream-card)!important;
    border-radius:36px 36px 0 0!important;
    border:1.5px solid var(--border-card)!important;
    border-bottom:none!important;
    box-shadow:0 -12px 36px -4px rgba(45,38,28,0.05)!important;
    position:relative!important;
    z-index:5!important;
    margin-top:-22px!important;
  }
  .svc-head{display:flex!important;flex-direction:column!important;gap:14px!important;align-items:flex-start!important;margin-bottom:24px!important}
  .svc-head-right{display:none!important}
  .svc-grid{display:flex!important;flex-direction:column!important;gap:12px!important;width:100%!important}
  .svc-card{padding:20px 18px!important;border-radius:16px!important;width:100%!important;box-sizing:border-box!important;display:flex!important;flex-direction:column!important;align-items:flex-start!important}
  .svc-ico{width:50px!important;height:50px!important;margin-bottom:12px!important}
  .svc-num{font-size:10px!important;margin-bottom:6px!important}
  .svc-card h3{font-size:15.5px!important;font-weight:700!important;margin-bottom:6px!important}
  .svc-card p{font-size:13px!important;line-height:1.6!important}
  .svc-arrow{top:18px!important;right:18px!important}

  /* Vision, Mission & Values */
  .vmc-grid{grid-template-columns:1fr!important;gap:12px!important;margin-top:20px!important}
  .vmc-card{padding:20px 18px!important;border-radius:16px!important}
  .vmc-ico{width:52px!important;height:52px!important;margin-bottom:14px!important}
  .vmc-card h3{font-size:17px!important}
  .vmc-card p{font-size:13.5px!important}

  /* Two Column Features */
  .feat-grid{grid-template-columns:1fr!important;gap:16px!important}
  .feat-card{padding:22px 18px!important;border-radius:16px!important}
  .feat-card h3{font-size:19px!important}
  .feat-card>p{font-size:13.5px!important;margin-bottom:18px!important}
  .btn-solid{width:100%!important;text-align:center!important;justify-content:center!important;min-height:48px!important;display:flex!important;align-items:center!important;border-radius:50px!important}

  /* About & Numbers */
  .about-in{grid-template-columns:1fr!important;gap:24px!important}
  .about-stat-box{padding:20px 16px!important;border-radius:16px!important;width:100%!important}
  .stat-grid{grid-template-columns:1fr 1fr!important;gap:10px!important}
  .stat-item{padding:16px 10px!important;border-radius:14px!important}
  .stat-item strong{font-size:26px!important}
  .stat-item span{font-size:10px!important}

  /* Why Us */
  .why-in{grid-template-columns:1fr!important;gap:20px!important}
  .why-cards{grid-template-columns:1fr!important;gap:10px!important}
  .wc{padding:18px 16px!important;border-radius:14px!important}

  /* Internship */
  .int-grid{grid-template-columns:1fr!important;gap:22px!important}
  .int-left{font-size:clamp(22px,6vw,28px)!important;margin-bottom:16px!important}
  .int-meta{display:flex!important;flex-direction:column!important;gap:10px!important;margin-bottom:20px!important}
  .int-meta-item{padding:12px 16px!important;border-radius:18px!important;background:var(--bg-cream-card)!important;border:1px solid var(--border-card)!important;box-shadow:var(--shadow-soft)!important;display:flex!important;flex-direction:row!important;align-items:center!important;gap:14px!important;text-align:left!important;transform:none!important}
  .int-meta-ico{width:40px!important;height:40px!important;border-radius:10px!important;background:var(--blue-l)!important;color:var(--blue)!important;margin:0!important;flex-shrink:0!important}
  .int-meta-ico svg{width:20px!important;height:20px!important;margin:0!important;display:block!important}
  .int-meta-txt{display:flex!important;flex-direction:column!important;align-items:flex-start!important;gap:2px!important;text-align:left!important;flex:1!important}
  .int-meta-txt strong{font-size:13.5px!important;font-weight:700!important;color:var(--blue)!important;line-height:1.25!important}
  .int-meta-txt span{font-size:11px!important;font-weight:500!important;color:var(--muted)!important;line-height:1.25!important}
  .int-banner-card{border-radius:16px!important;width:100%!important;overflow:hidden!important}

  /* Mentorship */
  .mentor-banner-wrap{margin:18px 0!important;border-radius:16px!important;width:100%!important;overflow:hidden!important}
  .mentor-cta{flex-direction:column!important;text-align:center!important;padding:22px 16px!important;border-radius:16px!important;gap:14px!important;margin-top:20px!important}
  .mentor-cta-txt h3{font-size:17px!important}
  .mentor-cta-txt p{font-size:13px!important}
  .mentor-cta-btn{width:100%!important;justify-content:center!important;text-align:center!important;min-height:48px!important;display:flex!important;align-items:center!important}

  /* Hiring & Partnership */
  .hiring-in{grid-template-columns:1fr!important;gap:22px!important}
  .positions-list{gap:8px!important;margin-bottom:18px!important}
  .pos-item{padding:12px 14px!important;font-size:13.5px!important;border-radius:12px!important;min-height:48px!important}
  .hiring-banner-card{border-radius:16px!important;overflow:hidden!important;width:100%!important}
  .partner{padding:44px 0!important;overflow:hidden!important}
  .partner-in{grid-template-columns:1fr!important;gap:24px!important}
  .partner-left h2{font-size:clamp(22px,6vw,28px)!important}
  .partner-left p.partner-lead{font-size:13.5px!important;margin-bottom:18px!important}
  .partner-orgs{flex-direction:column!important;gap:8px!important;width:100%!important}
  .org-card{width:100%!important;min-width:unset!important;padding:12px 14px!important;border-radius:12px!important}
  .partner-quote{padding:14px 16px!important}
  .partner-obj{padding:18px 14px!important;border-radius:16px!important}
  .partner-reps{padding:18px 14px!important;border-radius:16px!important;margin-top:12px!important}
  .partner-reps-grid{grid-template-columns:1fr!important;gap:10px!important}

  /* Leadership & Team - Mobile Horizontal Scroll Carousel (Like Courses) */
  .lead-section-wrap{margin-bottom:20px!important}

  /* ── SMOOTH MOBILE CAROUSEL WRAPPER ── */
  .lead-grid-perspective{
    overflow:visible!important;
    margin:0 -18px 0!important;
    padding-bottom:8px!important;
    position:relative!important;
  }
  .lead-grid{
    display:flex!important;
    grid-template-columns:none!important;
    overflow-x:auto!important;
    scroll-snap-type:x mandatory!important;
    -webkit-overflow-scrolling:touch!important;
    overscroll-behavior-x:contain!important;
    gap:16px!important;
    padding:20px calc(50% - 130px) 24px!important;
    scroll-padding:0 calc(50% - 130px)!important;
    margin:0!important;
    width:auto!important;
    max-width:none!important;
    scrollbar-width:none!important;
    -ms-overflow-style:none!important;
  }
  .lead-grid::-webkit-scrollbar{
    display:none!important;
  }
  .lead-card{
    flex:0 0 260px!important;
    width:260px!important;
    min-width:260px!important;
    max-width:260px!important;
    scroll-snap-align:center!important;
    scroll-snap-stop:always!important;
    border-radius:22px!important;
    overflow:hidden!important;
    opacity:1!important;
    border:1.5px solid rgba(255,255,255,0.12)!important;
    box-shadow:0 14px 34px -6px rgba(10,15,30,0.5),0 0 0 1px rgba(255,255,255,0.06)!important;
    transition:box-shadow 0.28s ease, border-color 0.28s ease, transform 0.28s ease!important;
    user-select:none!important;
  }
  .lead-card:first-child{
    margin-left:0!important;
  }
  .lead-card:last-child{
    margin-right:0!important;
  }
  /* Active card in smooth zoom carousel */
  .lead-card.cube-active{
    box-shadow:0 24px 60px -8px rgba(59,91,255,0.55),0 0 0 2px rgba(96,165,250,0.5)!important;
    border-color:rgba(96,165,250,0.65)!important;
  }
  /* Carousel Navigation Buttons & Dots */
  .lead-carousel-nav{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:14px!important;
    margin-top:8px!important;
    margin-bottom:14px!important;
  }
  .lead-nav-btn{
    width:36px!important;
    height:36px!important;
    border-radius:50%!important;
    background:rgba(255,255,255,0.08)!important;
    border:1px solid rgba(255,255,255,0.18)!important;
    color:#ffffff!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    cursor:pointer!important;
    transition:all .2s ease!important;
    backdrop-filter:blur(8px)!important;
    -webkit-backdrop-filter:blur(8px)!important;
    padding:0!important;
  }
  .lead-nav-btn:active{
    transform:scale(0.9)!important;
    background:rgba(59,91,255,0.35)!important;
    border-color:rgba(96,165,250,0.5)!important;
  }
  .lead-dots{
    display:flex!important;
    align-items:center!important;
    gap:8px!important;
  }
  .lead-dot{
    width:8px!important;
    height:8px!important;
    border-radius:50%!important;
    background:rgba(255,255,255,0.25)!important;
    border:none!important;
    padding:0!important;
    cursor:pointer!important;
    transition:all .3s cubic-bezier(0.16,1,0.3,1)!important;
  }
  .lead-dot.active{
    width:24px!important;
    border-radius:10px!important;
    background:linear-gradient(90deg,#2845EE,#60a5fa)!important;
    box-shadow:0 0 12px rgba(40,69,238,0.65)!important;
  }
  .lead-card-photo-wrap{aspect-ratio:1/1.05!important}
  .lead-card-body{padding:16px 16px 18px!important}
  .team-grid{grid-template-columns:1fr 1fr!important;gap:12px!important;width:100%!important;max-width:100%!important}
  .tc{border-radius:16px!important;width:100%!important;overflow:hidden!important}

  /* Courses */
  .courses-grid{grid-template-columns:1fr!important;gap:18px!important}
  .cc{border-radius:16px!important}
  .cc-thumb{height:190px!important}
  .cc-body{padding:18px 14px!important}
  .btn-enroll{min-height:48px!important;display:flex!important;align-items:center!important;justify-content:center!important}
  .cbanner{flex-direction:column!important;text-align:center!important;padding:20px 16px!important;border-radius:16px!important;gap:12px!important}
  .btn-reg{width:100%!important;min-height:48px!important;display:flex!important;align-items:center!important;justify-content:center!important}

  /* Contact & Social */
  .contact-grid{grid-template-columns:1fr!important;gap:16px!important}
  .cbox{padding:20px 16px!important;border-radius:16px!important}
  .sg{grid-template-columns:1fr!important;gap:8px!important}
  .sl-btn{padding:12px 14px!important;min-height:48px!important;border-radius:12px!important}
  .btn-wa-big{min-height:48px!important;font-size:14px!important;border-radius:12px!important}

  /* Footer & Chatbot */
  .ft-in{grid-template-columns:1fr!important;gap:22px!important;padding:32px 16px 20px!important}
  .ft-bot{padding:16px!important}
  .cfab{bottom:16px!important;right:16px!important;width:50px!important;height:50px!important}
  .back-to-top{bottom:74px!important;right:16px!important;width:42px!important;height:42px!important}
  .ai-peeker{bottom:20px!important;padding:6px 8px 6px 10px!important}
  .cwin{left:10px!important;right:10px!important;width:auto!important;bottom:74px!important;max-height:72vh!important;border-radius:16px!important;transform-origin:bottom right!important}

  /* Popup Modal */
  .popup-box{max-width:min(380px,calc(100vw - 24px))!important;border-radius:18px!important;margin:0 auto!important}
}

@media(max-width:480px){
  .nav{top:10px!important;left:10px!important;right:10px!important}
  .nav-ul{top:86px!important;max-height:calc(100vh - 100px)!important}
  .nav-in{padding:0 14px!important}
  .nav-ico{width:34px!important;height:34px!important}
  .nav-txt strong{font-size:13px!important}
  .nav-txt small{font-size:8.5px!important}
  .stat-grid{grid-template-columns:1fr 1fr!important;gap:8px!important}
  .stat-item{padding:14px 8px!important}
  .stat-num{font-size:24px!important}
  .ft-bot p{font-size:11.5px!important}
  .cfab{bottom:14px!important;right:14px!important;width:46px!important;height:46px!important}
  .back-to-top{bottom:68px!important;right:14px!important;width:38px!important;height:38px!important}
  .ai-peeker{bottom:16px!important;padding:5px 7px 5px 9px!important}
}

/* ── MENTORSHIP POSTER POPUP ── */
.popup-overlay{position:fixed;inset:0;background:rgba(15,23,42,0.82);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);z-index:30000!important;display:none;align-items:center;justify-content:center;padding:16px;opacity:0;animation:popoverIn .35s ease forwards}
@keyframes popoverIn{to{opacity:1}}
.popup-box{background:var(--bg-cream-card);border-radius:24px;max-width:min(460px,calc(100vw - 32px));width:100%;position:relative;box-shadow:0 30px 90px rgba(15,23,42,.35);animation:popboxIn .35s ease both;transform:scale(.94) translateY(16px);overflow:hidden;border:1.5px solid var(--border-card)}
@keyframes popboxIn{to{transform:scale(1) translateY(0)}}
.popup-close{position:absolute;top:12px;right:12px;width:34px;height:34px;background:rgba(19,24,38,0.75);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,0.3);border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:14px;color:#ffffff;transition:all .2s;z-index:10}
.popup-close:hover{background:rgba(239,68,68,0.9);border-color:transparent;transform:scale(1.1)}
.popup-poster-wrap{position:relative;width:100%;overflow:hidden}
.popup-poster-btns{display:flex;gap:10px;padding:14px 18px 18px;background:var(--bg-cream-card);border-top:1px solid var(--border-soft)}
.popup-poster-btns a{flex:1;text-align:center;padding:13px 14px;border-radius:50px;font-size:13.5px;font-weight:700;transition:all .25s ease;display:inline-flex;align-items:center;justify-content:center}
.popup-apply{background:var(--grad-blue);color:#fff;box-shadow:0 4px 16px rgba(40,69,238,.3);border:1px solid rgba(255,255,255,0.2)}
.popup-apply:hover{background:linear-gradient(135deg,#1e38d6,#15289f);transform:translateY(-2px);box-shadow:0 8px 24px rgba(40,69,238,.45)}
.popup-later{background:var(--bg-cream-soft);color:var(--text-sub);border:1px solid var(--border-soft)}
.popup-later:hover{background:var(--bg-cream-alt);color:var(--text-dark)}

/* Mobile Square Aspect Ratio for Announcement Banner & Mentorship + Button Adjustment */
@media(max-width: 768px){
  .popup-box{
    max-width:min(360px, calc(100vw - 28px))!important;
    max-height:min(90vh, 650px)!important;
    display:flex!important;
    flex-direction:column!important;
    border-radius:20px!important;
  }
  .popup-poster-wrap .mobile-banner-only img{
    width:100%!important;
    height:auto!important;
    max-height:54vh!important;
    object-fit:cover!important;
    object-position:center top!important;
    display:block!important;
  }
  .mentor-banner-wrap .mobile-banner-only img{
    width:100%!important;
    aspect-ratio:1/1!important;
    object-fit:cover!important;
    object-position:center top!important;
    display:block!important;
  }
  .popup-poster-btns{
    flex-direction:column!important;
    gap:8px!important;
    padding:12px 16px 15px!important;
  }
  .popup-poster-btns a{
    width:100%!important;
    flex:none!important;
    text-align:center!important;
    padding:12px 14px!important;
    border-radius:50px!important;
    font-size:13.5px!important;
    white-space:nowrap!important;
    box-sizing:border-box!important;
  }
  .popup-apply{
    min-height:44px!important;
    box-shadow:0 6px 18px rgba(40,69,238,0.35)!important;
  }
  .popup-later{
    min-height:36px!important;
    padding:9px 14px!important;
    font-size:12.5px!important;
    background:var(--bg-cream-soft)!important;
    border:1px solid var(--border-soft)!important;
    color:var(--muted)!important;
  }
}

/* ── MOBILE TOUCH STATES ── */
@media (hover: none) and (pointer: coarse) {
  /* Service cards - persistent tap effect via JS class */
  .svc-card:active,.svc-card.tapped{border-color:var(--blue);box-shadow:0 16px 48px rgba(59,91,255,.12);transform:translateY(-3px)}
  .svc-card:active .svc-arrow,.svc-card.tapped .svc-arrow{color:var(--blue);transform:translate(3px,-3px)}
  .svc-card:active .svc-line,.svc-card.tapped .svc-line{transform:scaleX(1)}
  .svc-card.tapped{background:#fafbff}

  /* Team cards */
  .tc:active,.tc.tapped{border-color:rgba(59,91,255,.25);box-shadow:var(--shadow-lg);transform:translateY(-3px)}
  .tc:active::after,.tc.tapped::after{opacity:1}

  /* VMC cards */
  .vmc-card:active,.vmc-card.tapped{box-shadow:var(--shadow-lg);transform:translateY(-3px);border-color:var(--blue-m)}

  /* Why cards */
  .wc:active,.wc.tapped{border-color:var(--blue);box-shadow:var(--shadow-soft);background:var(--bg-cream-soft)}

  /* Benefit items internship */
  .benefit-item:active{border-color:var(--blue);box-shadow:var(--shadow-soft);transform:translateY(-2px)}

  /* Hiring position items */
  .pos-item:active{border-color:var(--blue);box-shadow:var(--shadow-soft);transform:translateX(4px)}

  /* Social buttons */
  .sl-btn.fb:active{background:#1877f2;color:#fff;border-color:transparent}
  .sl-btn.tt:active{background:#0f172a;color:#fff;border-color:transparent}
  .sl-btn.ig:active{background:linear-gradient(135deg,#f09433,#dc2743,#bc1888);color:#fff;border-color:transparent}
  .sl-btn.wa:active{background:#25d366;color:#fff;border-color:transparent}
  .sl-btn.wg:active{background:#128c7e;color:#fff;border-color:transparent}
  .sl-btn.gm:active{background:#ea4335;color:#fff;border-color:transparent}
  .sl-btn:active .sl-txt small{color:rgba(255,255,255,.7)}

  /* Buttons */
  .btn-blue:active{background:var(--blue-d);transform:scale(.97)}
  .btn-out:active{background:var(--blue-l);transform:scale(.97)}
  .btn-solid:active{background:var(--blue-d);transform:scale(.97)}
  .btn-enroll:active{background:var(--blue-d);transform:scale(.97)}
  .btn-reg:active{background:var(--blue-d);transform:scale(.97)}
  .btn-wa-big:active{background:#16a34a;transform:scale(.97)}
  .nav-btn:active{background:var(--blue-d);transform:scale(.97)}

  /* Course cards */
  .cc:active{border-color:rgba(59,91,255,.3);box-shadow:var(--shadow-lg);transform:translateY(-4px)}
  .cc:active::after{opacity:1}

  /* Feature cards */
  .feat-card:active{box-shadow:0 16px 40px rgba(59,91,255,.12)}

  /* Footer social */
  .ft-soc a:active{background:var(--blue);color:#fff;border-color:var(--blue)}

  /* HR boxes */
  .hr-box:active{border-color:var(--blue-m)}

  /* Popup buttons */
  .popup-apply:active{transform:scale(.97)}
  .popup-later:active{background:#e2e8f0}
  .popup-close:active{background:#e2e8f0;transform:scale(.95)}

  /* Chatbot */
  .cfab:active{transform:scale(.95)}
  .cqr button:active{background:var(--blue);color:#fff;border-color:var(--blue)}

  /* Nav mobile links */
  .nav-ul.open li a:active{background:var(--blue-l);border-color:var(--blue-m);color:var(--blue)}

  /* Partner orgs */
  .org-pill:active{background:rgba(255,255,255,.12)}

  /* About stat items */
  .stat-item:active{border-color:var(--blue);box-shadow:0 4px 16px rgba(59,91,255,.15)}
}

/* Mobile Touch Targets and Micro-Interactions */
@media(max-width:768px){
  .btn-blue,.btn-out,.btn-solid,.btn-enroll,.btn-reg{min-height:48px;display:inline-flex;align-items:center;justify-content:center}
  .sl-btn{min-height:50px}
  .nav-ul.open li a{min-height:46px}
  .pos-item{min-height:48px}
  .benefit-item{min-height:48px}
  .hero-stats{flex-wrap:wrap;gap:14px}
  .svc-card{padding:22px 18px}
  .svc-ico{width:46px;height:46px;margin-bottom:14px}
}
@media(max-width:480px){
  .hero-h1{font-size:clamp(26px,7.5vw,36px)}
  .st{font-size:clamp(24px,6.5vw,32px)}
  .svc-grid{grid-template-columns:1fr;gap:14px}
  .sg{grid-template-columns:1fr;gap:8px}
}

/* ── LEADERSHIP (Enterprise Luxury Card Design) ── */
.lead-section-wrap{text-align:center;max-width:760px;margin:0 auto 48px}
.lead-dept-badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  background:radial-gradient(120% 120% at 15% 0%, rgba(255,255,255,0.98) 0%, rgba(235,243,255,0.85) 50%, rgba(255,255,255,0.95) 100%);
  border:1.5px solid rgba(255,255,255,0.95);
  backdrop-filter:blur(24px) saturate(180%);
  -webkit-backdrop-filter:blur(24px) saturate(180%);
  color:var(--blue);
  border-radius:50px;
  padding:8px 20px;
  font-size:11.5px;
  font-weight:700;
  letter-spacing:1.8px;
  text-transform:uppercase;
  margin-bottom:16px;
  box-shadow:0 12px 32px -4px rgba(59,91,255,0.12), 0 4px 12px rgba(15,23,42,0.04), inset 0 1.5px 2px rgba(255,255,255,1), inset 0 -1px 2px rgba(59,91,255,0.06);
  position:relative;
  overflow:hidden;
}
.lead-dept-badge::before{
  content:'';
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:50%;
  background:linear-gradient(180deg, rgba(255,255,255,0.85) 0%, rgba(255,255,255,0) 100%);
  border-radius:50px 50px 0 0;
  pointer-events:none;
}
.lead-dept-badge::after{
  content:'';
  position:absolute;
  top:1px;
  left:14px;
  right:14px;
  height:1px;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,1), transparent);
  pointer-events:none;
}
.lead-dept-badge svg{color:var(--blue);flex-shrink:0;position:relative;z-index:1}
.lead-dept-badge span{position:relative;z-index:1}
.lead-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:20px;margin-bottom:24px}
.lead-card{background:linear-gradient(160deg,#0d1527 0%,#090e1c 55%,#060a14 100%);border:1.5px solid rgba(255,255,255,0.09);border-radius:24px;overflow:hidden;position:relative;transition:all .35s cubic-bezier(0.16,1,0.3,1);cursor:pointer;display:flex;flex-direction:column;box-shadow:0 18px 40px -12px rgba(15,23,42,0.14),0 0 0 1px rgba(15,23,42,0.03)}
.lead-card::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 80% 20%,rgba(59,91,255,0.14) 0%,transparent 65%);pointer-events:none;z-index:1;transition:opacity .35s ease}
.lead-card:hover,.lead-card.tapped{transform:translateY(-8px);box-shadow:0 30px 60px -15px rgba(59,91,255,0.28),0 0 0 1.5px rgba(96,165,250,0.4);border-color:rgba(96,165,250,0.4)}
.lead-card:hover::before{opacity:1.5}

/* Card Photo Container */
.lead-card-photo-wrap{position:relative;width:100%;aspect-ratio:1/1.08;overflow:hidden;background:linear-gradient(180deg,#111d3d 0%,#081022 100%)}
.lead-card-photo-wrap img{width:100%;height:100%;object-fit:cover;object-position:center 10%;display:block;transition:transform .45s cubic-bezier(0.16,1,0.3,1)}
.lead-card:hover .lead-card-photo-wrap img{transform:scale(1.05)}
.lead-card-photo-overlay{position:absolute;inset:0;background:linear-gradient(to bottom,transparent 55%,rgba(13,21,39,0.92) 95%,#0d1527 100%);pointer-events:none}

/* Card Body / Info */
.lead-card-body{padding:18px 20px 22px;position:relative;z-index:2;display:flex;flex-direction:column;flex:1}

/* Member Badges */
.lead-badge{display:inline-flex;align-items:center;gap:6px;font-size:10px;font-weight:800;letter-spacing:1px;text-transform:uppercase;padding:5px 12px;border-radius:50px;width:fit-content;margin-bottom:12px;color:#ffffff;line-height:1}
.lead-badge.bg-amber{background:linear-gradient(135deg,#f59e0b,#d97706);box-shadow:0 4px 14px rgba(217,119,6,0.38)}
.lead-badge.bg-purple{background:linear-gradient(135deg,#8b5cf6,#6366f1);box-shadow:0 4px 14px rgba(139,92,246,0.38)}
.lead-badge.bg-blue{background:linear-gradient(135deg,#2845EE,#8B3EF2);box-shadow:0 4px 14px rgba(40,69,238,0.38)}
.lead-badge.bg-cyan{background:linear-gradient(135deg,#06b6d4,#2563eb);box-shadow:0 4px 14px rgba(6,182,212,0.38)}
.lead-badge.bg-green{background:linear-gradient(135deg,#10b981,#059669);box-shadow:0 4px 14px rgba(16,185,129,0.38)}

/* Member Name & Subtitle */
.lead-card-body h3{font-size:18.5px;font-weight:800;color:#ffffff;line-height:1.25;margin-bottom:6px;letter-spacing:-0.3px}
.lead-card-desc{font-size:11.5px;color:#94a3b8;line-height:1.55;margin-bottom:12px;min-height:36px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* Feature Pill */
.lead-card-pill{display:inline-flex;align-items:center;gap:6px;font-size:10.5px;font-weight:600;color:#cbd5e1;background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.12);padding:5px 12px;border-radius:50px;width:fit-content;margin-bottom:14px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.lead-card-pill svg{color:#38bdf8;flex-shrink:0}

/* Action CTA link */
.lead-card-cta{display:flex;align-items:center;justify-content:space-between;font-size:11px;font-weight:800;letter-spacing:1px;text-transform:uppercase;color:#38bdf8;margin-top:auto;padding-top:14px;border-top:1px solid rgba(255,255,255,0.08);transition:all .25s ease}
.lead-card-cta svg{transition:transform .25s ease}
.lead-card:hover .lead-card-cta{color:#67e8f9}
.lead-card:hover .lead-card-cta svg{transform:translateX(4px)}
.lead-carousel-nav{display:none}

@media(min-width:901px) and (max-width:1200px){.lead-grid{grid-template-columns:repeat(3,1fr);gap:20px}}
@media(min-width:769px) and (max-width:900px){.lead-grid{grid-template-columns:repeat(2,1fr);gap:20px}}

/* ── TEAM PROFILE MODAL (Executive Luxury Dossier) ── */
.tm-overlay{position:fixed;inset:0;background:rgba(6,9,19,0.86);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);z-index:3000;display:none;align-items:center;justify-content:center;padding:20px 16px;opacity:0;transition:opacity .3s cubic-bezier(0.16,1,0.3,1)}
.tm-overlay.open{display:flex;opacity:1}
.tm-modal{background:linear-gradient(165deg,#0d1527 0%,#090e1c 55%,#050812 100%);border:1.5px solid rgba(255,255,255,0.14);border-radius:26px;width:100%;max-width:640px;max-height:90vh;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 32px 90px -10px rgba(0,0,0,0.8),0 0 0 1px rgba(59,91,255,0.18);animation:tmPop .35s cubic-bezier(.2,.8,.2,1) both;position:relative}
@keyframes tmPop{from{transform:scale(.92) translateY(24px);opacity:0}to{transform:scale(1) translateY(0);opacity:1}}
.tm-modal-top{display:flex;align-items:center;gap:18px;padding:22px 24px 18px;background:radial-gradient(ellipse at 85% 0%,rgba(59,91,255,0.22) 0%,transparent 65%),linear-gradient(180deg,rgba(255,255,255,0.04) 0%,transparent 100%);border-bottom:1px solid rgba(255,255,255,0.08);position:relative;flex-shrink:0}
.tm-photo-wrap{position:relative;flex-shrink:0}
.tm-modal-photo{width:76px;height:76px;border-radius:18px;object-fit:cover;object-position:top center;border:2px solid rgba(255,255,255,0.22);box-shadow:0 8px 24px rgba(0,0,0,0.4),0 0 0 1px rgba(59,91,255,0.3);display:block}
.tm-status-dot{position:absolute;bottom:-2px;right:-2px;width:14px;height:14px;background:#10b981;border:2.5px solid #0d1527;border-radius:50%;box-shadow:0 0 8px rgba(16,185,129,0.8);animation:statusPulse 2s infinite ease-in-out}
@keyframes statusPulse{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.18);opacity:.85}}
.tm-modal-info{flex:1;min-width:0;padding-right:44px}
.tm-modal-name{font-size:22px;font-weight:800;color:#ffffff;letter-spacing:-0.4px;margin:4px 0 6px;line-height:1.2}
.tm-modal-role-badge{display:inline-flex;align-items:center;gap:6px;font-size:10px;font-weight:800;letter-spacing:0.8px;text-transform:uppercase;padding:4px 12px;border-radius:50px;max-width:100%;white-space:normal;line-height:1.35;word-break:break-word;box-sizing:border-box}
.tm-modal-role-badge.cto{background:linear-gradient(135deg,rgba(59,91,255,0.35),rgba(139,92,246,0.35));color:#93c5fd;border:1px solid rgba(59,91,255,.45)}
.tm-modal-role-badge.co{background:linear-gradient(135deg,rgba(139,92,246,0.35),rgba(99,102,241,0.35));color:#c4b5fd;border:1px solid rgba(139,92,246,.45)}
.tm-modal-role-badge.ld{background:linear-gradient(135deg,rgba(6,182,212,0.3),rgba(37,99,235,0.3));color:#67e8f9;border:1px solid rgba(6,182,212,.4)}
.tm-modal-role-badge.ad{background:linear-gradient(135deg,rgba(34,197,94,0.3),rgba(16,185,129,0.3));color:#86efac;border:1px solid rgba(34,197,94,.4)}
.tm-modal-role-badge.fd{background:linear-gradient(135deg,rgba(245,158,11,0.35),rgba(217,119,6,0.35));color:#fde68a;border:1px solid rgba(245,158,11,.45)}
.tm-modal-org{font-size:12px;color:#94a3b8;display:flex;align-items:center;gap:6px;font-weight:500}
.tm-modal-org svg{color:var(--blue);flex-shrink:0}
.tm-close{position:absolute;top:50%;right:18px;transform:translateY(-50%);width:32px;height:32px;background:rgba(255,255,255,0.08);border:1px solid rgba(255,255,255,0.18);border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;color:rgba(255,255,255,0.75);font-size:13px;transition:all .2s;line-height:1;flex-shrink:0;z-index:20}
.tm-close:hover{background:rgba(239,68,68,0.8);border-color:transparent;color:#fff;transform:translateY(-50%) rotate(90deg) scale(1.06)}
.tm-modal-body{overflow-y:auto;padding:22px 26px 24px;display:flex;flex-direction:column;gap:20px}
.tm-modal-body::-webkit-scrollbar{width:5px}
.tm-modal-body::-webkit-scrollbar-track{background:rgba(255,255,255,.04)}
.tm-modal-body::-webkit-scrollbar-thumb{background:rgba(255,255,255,.15);border-radius:4px}
.tm-stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.tm-stat-card{background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.08);border-radius:12px;padding:10px 12px;display:flex;flex-direction:column;gap:2px;text-align:center}
.tm-stat-val{font-size:12.5px;font-weight:700;color:#ffffff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tm-stat-lbl{font-size:10px;font-weight:600;letter-spacing:0.6px;text-transform:uppercase;color:#64748b}
.tm-section-label{font-size:10.5px;font-weight:800;letter-spacing:2px;text-transform:uppercase;color:#94a3b8;margin-bottom:10px;display:flex;align-items:center;gap:8px}
.tm-section-label svg{color:var(--blue);flex-shrink:0}
.tm-section-label::after{content:'';flex:1;height:1px;background:rgba(255,255,255,0.08)}
.tm-bio-box{background:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.07);border-left:3px solid var(--blue);border-radius:0 12px 12px 0;padding:12px 16px;font-size:13px;line-height:1.65;color:#cbd5e1}
.tm-qual-box{background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.08);border-radius:14px;padding:14px 16px;display:flex;flex-direction:column;gap:9px}
.tm-qual-item{display:flex;align-items:flex-start;gap:10px;font-size:12.5px;color:#e2e8f0;line-height:1.5}
.tm-qual-icon{width:18px;height:18px;border-radius:50%;background:rgba(59,91,255,0.2);color:#60a5fa;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:1px}
.tm-qual-icon svg{width:11px;height:11px}
.tm-skills-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.tm-skill-tag{background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.08);border-radius:10px;padding:9px 12px;font-size:11.5px;font-weight:600;color:#cbd5e1;display:flex;align-items:center;gap:8px;transition:all .2s ease}
.tm-skill-tag:hover{background:rgba(59,91,255,0.15);border-color:rgba(96,165,250,0.35);color:#ffffff;transform:translateY(-1px)}
.tm-skill-icon{font-size:14px;flex-shrink:0}
.tm-modal-footer{padding:16px 26px 20px;border-top:1px solid rgba(255,255,255,0.08);background:rgba(8,12,22,0.95);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.tm-btn-wa{width:100%;background:#22c55e;color:#ffffff;padding:13px 20px;border-radius:14px;font-size:14px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;gap:10px;text-decoration:none;transition:all .25s ease;box-shadow:0 4px 16px rgba(34,197,94,0.35)}
.tm-btn-wa:hover{background:#16a34a;transform:translateY(-1px);box-shadow:0 6px 22px rgba(34,197,94,0.45);color:#fff}
@media(max-width:560px){
  .tm-modal{border-radius:22px!important;max-height:92vh!important;margin:0 4px!important}
  .tm-modal-top{padding:16px 14px 14px!important;gap:12px!important;position:relative!important}
  .tm-modal-photo{width:60px!important;height:60px!important}
  .tm-modal-info{padding-right:42px!important}
  .tm-modal-role-badge{font-size:9px!important;padding:3.5px 10px!important;letter-spacing:0.6px!important}
  .tm-modal-name{font-size:18px!important}
  .tm-close{top:50%!important;right:14px!important;transform:translateY(-50%)!important;width:30px!important;height:30px!important;font-size:12px!important}
  .tm-modal-body{padding:16px 14px 18px!important;gap:16px!important}
  .tm-stats-grid{gap:6px!important}
  .tm-stat-card{padding:8px 6px!important}
  .tm-stat-val{font-size:11px!important}
  .tm-stat-lbl{font-size:8.5px!important}
  .tm-skills-grid{grid-template-columns:1fr!important;gap:6px!important}
  .tm-modal-footer{padding:14px 16px 16px!important}
  .tm-btn-wa{width:100%!important;min-height:46px!important}
}

/* ── PRELOADER ANIMATION ── */
#preloader {
  position: fixed;
  inset: 0;
  width: 100vw;
  height: 100vh;
  background: #ffffff !important;
  background-color: #ffffff !important;
  z-index: 9999999;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  transition: opacity 0.8s cubic-bezier(0.4, 0, 0.2, 1), visibility 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}
#preloader.fade-out {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
.preloader-inner {
  position: relative;
  width: 86%;
  max-width: 860px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #ffffff !important;
  background-color: #ffffff !important;
}
#preloader video {
  width: 100%;
  height: auto;
  max-width: 860px;
  object-fit: contain;
  background: #ffffff !important;
  background-color: #ffffff !important;
}
.preloader-skip-btn {
  position: absolute;
  top: 20px;
  right: 20px;
  z-index: 10000000;
  background: rgba(15, 23, 42, 0.75);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  color: #ffffff;
  border: 1.5px solid rgba(255, 255, 255, 0.25);
  padding: 8px 18px;
  border-radius: 50px;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 6px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.25);
  transition: all 0.25s ease;
}
.preloader-skip-btn:hover {
  background: var(--blue);
  border-color: var(--blue);
  transform: scale(1.04);
}

/* ── MENTORSHIP & INTERNSHIP SHOWCASE COMPONENTS ── */
.mentor-showcase-box{background:linear-gradient(135deg,#070e28 0%,#111d4e 45%,#1f124a 100%);border-radius:24px;padding:40px 36px;color:#fff;border:1.5px solid rgba(255,255,255,0.12);box-shadow:0 24px 60px rgba(7,14,40,0.35);position:relative;overflow:hidden}
.mentor-showcase-box::before{content:'';position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,0.08) 1px,transparent 1px);background-size:24px 24px;pointer-events:none}
.ms-badge{display:inline-flex;align-items:center;gap:8px;background:rgba(59,91,255,0.25);border:1px solid rgba(59,91,255,0.45);color:#93c5fd;padding:6px 16px;border-radius:50px;font-size:11px;font-weight:800;letter-spacing:1.5px;text-transform:uppercase;margin-bottom:18px}
.ms-title{font-size:clamp(22px,3.2vw,34px);font-weight:800;line-height:1.2;margin-bottom:16px;letter-spacing:-0.8px}
.ms-desc{font-size:14.5px;color:#cbd5e1;line-height:1.75;max-width:720px;margin-bottom:32px}
.ms-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;position:relative;z-index:1;margin-bottom:28px}
.ms-card{background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.12);backdrop-filter:blur(8px);border-radius:16px;padding:20px;display:flex;align-items:flex-start;gap:14px;transition:all .3s ease}
.ms-card:hover{background:rgba(255,255,255,0.12);border-color:rgba(96,165,250,0.5);transform:translateY(-2px)}
.ms-ico{width:42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:20px;flex-shrink:0}
.ms-card strong{display:block;font-size:15px;font-weight:700;color:#fff;margin-bottom:4px}
.ms-card p{font-size:12.5px;color:#94a3b8;line-height:1.5;margin:0}
.ms-footer-pills{display:flex;flex-wrap:wrap;gap:10px;align-items:center;position:relative;z-index:1}
.ms-pill{background:rgba(255,255,255,0.08);border:1px solid rgba(255,255,255,0.16);padding:6px 14px;border-radius:50px;font-size:12px;font-weight:600;color:#e0e7ff;display:inline-flex;align-items:center;gap:6px}
@media(max-width:768px){
  .mentor-showcase-box{padding:26px 20px;border-radius:20px}
  .ms-grid{grid-template-columns:1fr;gap:12px}
  .ms-card{padding:16px}
}

.int-perks-card{background:linear-gradient(135deg,#0c1d47 0%,#152b68 100%);border-radius:24px;padding:34px 28px;color:#fff;border:1.5px solid rgba(255,255,255,0.12);box-shadow:0 18px 48px rgba(12,29,71,0.3)}
.int-perks-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px;padding-bottom:16px;border-bottom:1px solid rgba(255,255,255,0.12)}
.int-perks-head strong{font-size:18px;font-weight:800;color:#fff;letter-spacing:-0.3px}
.int-perks-head span{font-size:11px;font-weight:800;color:#86efac;background:rgba(34,197,94,0.2);border:1px solid rgba(34,197,94,0.35);padding:4px 12px;border-radius:50px;letter-spacing:1px;text-transform:uppercase}
.int-perks-list{display:flex;flex-direction:column;gap:12px}
.int-perk-item{display:flex;align-items:flex-start;gap:12px;font-size:13.5px;color:#e2e8f0;line-height:1.55}
.int-perk-check{width:20px;height:20px;border-radius:50%;background:rgba(59,91,255,0.3);border:1.5px solid #60a5fa;display:flex;align-items:center;justify-content:center;color:#93c5fd;flex-shrink:0;margin-top:2px}
@media(max-width:768px){.int-perks-card{padding:24px 18px;border-radius:20px}}

/* ── OUR PROJECTS (STANDALONE PORTFOLIO SECTION) ── */
.projects{
  background:linear-gradient(180deg,var(--bg-cream) 0%,var(--bg-cream-card) 50%,var(--bg-cream) 100%);
  position:relative;
  overflow:hidden;
  border-top:1px solid var(--border-soft);
}
.projects::before{
  content:'';
  position:absolute;
  top:-80px;
  left:50%;
  transform:translateX(-50%);
  width:1200px;
  height:480px;
  background:radial-gradient(ellipse at 50% 10%, rgba(40,69,238,0.06) 0%, rgba(14,165,233,0.03) 40%, transparent 70%);
  pointer-events:none;
}
.projects-header{
  text-align:center;
  max-width:820px;
  margin:0 auto 36px;
}
.projects-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  background:radial-gradient(120% 120% at 15% 0%, rgba(253,252,249,0.98) 0%, rgba(245,243,237,0.9) 50%, rgba(253,252,249,0.96) 100%);
  border:1.5px solid var(--border-card);
  backdrop-filter:blur(24px) saturate(180%);
  -webkit-backdrop-filter:blur(24px) saturate(180%);
  color:var(--blue);
  border-radius:50px;
  padding:6px 18px;
  font-size:11px;
  font-weight:700;
  letter-spacing:1.4px;
  text-transform:uppercase;
  margin-bottom:18px;
  white-space:nowrap;
  max-width:100%;
  box-shadow:var(--shadow-soft);
}
.projects-badge svg{
  flex-shrink:0;
  width:14px;
  height:14px;
}
.projects-badge span{
  white-space:nowrap;
}
.projects-stats-row{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:16px;
  max-width:1080px;
  margin:0 auto 44px;
}
.pstat-card{
  background:var(--bg-cream-card);
  border:1px solid var(--border-card);
  border-radius:20px;
  padding:20px 18px;
  text-align:center;
  box-shadow:var(--shadow-soft);
  transition:all .3s ease;
  position:relative;
  overflow:hidden;
}
.pstat-card::after{
  content:'';
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:3px;
  background:var(--grad);
  opacity:0;
  transition:opacity .3s;
}
.pstat-card:hover{
  transform:translateY(-3px);
  border-color:var(--blue);
  box-shadow:var(--shadow-lg);
}
.pstat-card:hover::after{
  opacity:1;
}
.pstat-num{
  display:block;
  font-size:clamp(26px,3vw,38px);
  font-weight:900;
  letter-spacing:-1px;
  line-height:1.1;
  background:linear-gradient(135deg,#2845EE,#7c3aed);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
  margin-bottom:4px;
}
.pstat-lbl{
  font-size:11.5px;
  font-weight:700;
  color:var(--muted);
  text-transform:uppercase;
  letter-spacing:1px;
}
.projects-filter-wrap{
  display:flex;
  justify-content:center;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
  margin-bottom:42px;
}
.pfilter-btn{
  background:var(--bg-cream-soft);
  border:1.5px solid var(--border-card);
  color:var(--text-dark);
  padding:9px 20px;
  border-radius:50px;
  font-size:12.5px;
  font-weight:700;
  cursor:pointer;
  transition:all .25s ease;
  backdrop-filter:blur(12px);
  outline:none;
}
.pfilter-btn:hover{
  border-color:var(--blue);
  color:var(--blue);
  background:var(--bg-cream-card);
  transform:translateY(-1px);
}
.pfilter-btn.active{
  background:var(--grad-blue);
  color:#ffffff;
  border-color:transparent;
  box-shadow:0 6px 20px rgba(40,69,238,0.35);
  transform:translateY(-1px);
}
.projects-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:16px;
  margin-bottom:48px;
}
.project-card{
  background:var(--bg-cream-card);
  border:1px solid var(--border-card);
  border-radius:20px;
  overflow:hidden;
  box-shadow:var(--shadow-soft);
  transition:all .3s cubic-bezier(0.16,1,0.3,1);
  display:flex;
  flex-direction:column;
  position:relative;
}
.project-card:hover{
  transform:translateY(-4px);
  border-color:rgba(40,69,238,0.35);
  box-shadow:var(--shadow-lg);
}
.project-card::before{
  content:'';
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:3.5px;
  background:linear-gradient(90deg,#2845EE,#7c3aed,#0ea5e9);
  opacity:0;
  transition:opacity .3s ease;
  z-index:2;
}
.project-card:hover::before{
  opacity:1;
}
.project-banner{
  height:115px;
  position:relative;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:12px 14px;
}
.project-banner-bg{
  position:absolute;
  inset:0;
  background-size:cover;
  background-position:center;
  transition:transform .4s ease;
}
.project-card:hover .project-banner-bg{
  transform:scale(1.05);
}
.project-banner-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(19,24,38,0.15) 0%,rgba(19,24,38,0.85) 100%);
  z-index:1;
}
.project-status-badge{
  position:absolute;
  top:10px;
  left:10px;
  z-index:2;
  background:rgba(19,24,38,0.8);
  backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,0.25);
  border-radius:50px;
  padding:3px 9px;
  font-size:9.5px;
  font-weight:700;
  color:#fff;
  display:inline-flex;
  align-items:center;
  gap:5px;
  letter-spacing:.3px;
}
.pstatus-dot{
  width:5px;
  height:5px;
  border-radius:50%;
  background:#22c55e;
  box-shadow:0 0 6px rgba(34,197,94,0.8);
}
.project-category-tag{
  display:none !important;
}
.project-icon-float{
  display:none !important;
}
.project-body{
  padding:16px 14px 14px;
  display:flex;
  flex-direction:column;
  flex:1;
}
.project-title{
  font-size:14px;
  font-weight:750;
  color:var(--text-dark);
  margin-bottom:6px;
  line-height:1.35;
  letter-spacing:-.3px;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  min-height:38px;
}
.project-desc{
  font-size:11.8px;
  color:var(--text-sub);
  line-height:1.55;
  margin-bottom:12px;
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
  min-height:54px;
}
.project-tags{
  display:flex;
  flex-wrap:wrap;
  gap:4px;
  margin-bottom:12px;
  min-height:46px;
  align-content:flex-start;
}
.ptag{
  font-family:var(--mono);
  font-size:9px;
  font-weight:600;
  color:var(--text-sub);
  background:var(--bg-cream-soft);
  border:1px solid var(--border-soft);
  padding:2px 6px;
  border-radius:6px;
}
.project-metrics-pill{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:7px 10px;
  background:var(--bg-cream-soft);
  border:1px solid var(--border-soft);
  border-radius:12px;
  margin-bottom:12px;
  margin-top:auto;
}
.pm-label{
  font-size:10px;
  font-weight:600;
  color:var(--muted);
  display:inline-flex;
  align-items:center;
  gap:4px;
}
.pm-label svg{
  width:12px;
  height:12px;
}
.pm-val{
  font-size:10.5px;
  font-weight:800;
  color:var(--blue);
}
.project-footer-btns{
  display:flex;
  gap:8px;
  align-items:center;
}
.btn-pview{
  flex:1;
  text-align:center;
  background:var(--text-dark);
  color:#ffffff;
  padding:8px 10px;
  border-radius:50px;
  font-size:11.5px;
  font-weight:700;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  transition:all .2s ease;
  border:1px solid var(--text-dark);
  text-decoration:none;
  white-space:nowrap;
}
.btn-pview:hover{
  background:var(--blue);
  border-color:var(--blue);
  transform:translateY(-1px);
}
.btn-pwa{
  width:36px;
  height:36px;
  border-radius:50px;
  background:#25D366;
  border:none;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  transition:all .2s ease;
  flex-shrink:0;
  text-decoration:none;
  box-shadow:0 3px 10px rgba(37,211,102,0.3);
}
.btn-pwa:hover{
  background:#20ba59;
  color:#fff;
  transform:translateY(-1px) scale(1.05);
  box-shadow:0 5px 14px rgba(37,211,102,0.45);
}
.projects-cta-banner{
  background:linear-gradient(135deg,#070B19 0%,#111936 50%,#1F1142 100%);
  border-radius:24px;
  padding:42px 40px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
  position:relative;
  overflow:hidden;
  border:1.5px solid rgba(255,255,255,0.12);
  box-shadow:0 20px 50px rgba(7,11,25,0.3);
}
.projects-cta-banner::before{
  content:'';
  position:absolute;
  inset:0;
  background-image:radial-gradient(rgba(255,255,255,0.1) 1px,transparent 1px);
  background-size:24px 24px;
  opacity:.4;
}
.pcta-text{
  position:relative;
  z-index:1;
  max-width:620px;
}
.pcta-text h3{
  font-size:clamp(22px,3vw,32px);
  font-weight:800;
  color:#ffffff;
  letter-spacing:-.8px;
  margin-bottom:10px;
  line-height:1.2;
}
.pcta-text p{
  font-size:14px;
  color:#cbd5e1;
  line-height:1.6;
}
.pcta-btn-wrap{
  position:relative;
  z-index:1;
  display:flex;
  gap:12px;
  flex-shrink:0;
  flex-wrap:wrap;
}
.btn-pcta-wa{
  background:var(--grad-blue);
  color:#fff;
  padding:14px 26px;
  border-radius:50px;
  font-size:13.5px;
  font-weight:700;
  box-shadow:0 8px 24px rgba(40,69,238,0.35);
  border:1px solid rgba(255,255,255,0.2);
  display:inline-flex;
  align-items:center;
  gap:8px;
  transition:all .2s;
  white-space:nowrap;
}
.btn-pcta-wa:hover{
  background:linear-gradient(135deg,#1d35c7,#15289f);
  transform:translateY(-2px);
  box-shadow:0 12px 30px rgba(40,69,238,0.45);
}
.btn-pcta-out{
  background:rgba(255,255,255,0.08);
  border:1.5px solid rgba(255,255,255,0.22);
  color:#ffffff;
  padding:14px 24px;
  border-radius:50px;
  font-size:13.5px;
  font-weight:700;
  display:inline-flex;
  align-items:center;
  gap:8px;
  transition:all .2s;
  white-space:nowrap;
}
.btn-pcta-out:hover{
  background:rgba(255,255,255,0.16);
  border-color:rgba(255,255,255,0.5);
  transform:translateY(-2px);
}

@media(max-width:1024px){
  .projects-grid{
    display:flex !important;
    overflow-x:auto !important;
    scroll-snap-type:x mandatory !important;
    -webkit-overflow-scrolling:touch !important;
    gap:14px !important;
    padding-bottom:14px !important;
    margin:0 -16px 36px !important;
    padding-left:16px !important;
    padding-right:16px !important;
  }
  .projects-grid::-webkit-scrollbar{
    height:4px !important;
  }
  .projects-grid::-webkit-scrollbar-thumb{
    background:#cbd5e1 !important;
    border-radius:4px !important;
  }
  .project-card{
    flex:0 0 270px !important;
    width:270px !important;
    max-width:270px !important;
    scroll-snap-align:start !important;
  }
}
@media(max-width:768px){
  .projects-badge{
    padding:5px 14px !important;
    font-size:9.5px !important;
    letter-spacing:1px !important;
    gap:6px !important;
    white-space:nowrap !important;
    border-radius:999px !important;
    line-height:1.2 !important;
    max-width:calc(100% - 20px) !important;
  }
  .projects-badge svg{
    width:12px !important;
    height:12px !important;
    flex-shrink:0 !important;
  }
  .projects-badge span{
    white-space:nowrap !important;
  }
  .project-card{
    flex:0 0 260px !important;
    width:260px !important;
    max-width:260px !important;
  }
}
@media(max-width:380px){
  .projects-badge{
    padding:4px 10px !important;
    font-size:8.2px !important;
    letter-spacing:0.5px !important;
    gap:5px !important;
  }
  .projects-badge svg{
    width:11px !important;
    height:11px !important;
  }
  .project-card{
    flex:0 0 240px !important;
    width:240px !important;
    max-width:240px !important;
  }
}


.standalone-section {
  display: none !important;
}
.standalone-section.active-standalone {
  display: block !important;
  padding-top: 68px !important;
}
@media(max-width:768px){
  .standalone-section.active-standalone {
    padding-top: 60px !important;
  }
}

/* When in Standalone Mode, completely hide all Group A sections including HERO with !important */
body.standalone-mode #home,
body.standalone-mode .hero,
body.standalone-mode .mq,
body.standalone-mode #services,
body.standalone-mode .photo-banner,
body.standalone-mode #top-courses,
body.standalone-mode .courses,
body.standalone-mode #mission,
body.standalone-mode #why,
body.standalone-mode #about,
body.standalone-mode #contact {
  display: none !important;
}

/* ==========================================================================
   NEUMORPHISM UI MASTER THEME (Soft Extruded Light-Grey & Blue Accent Design)
   ========================================================================== */

/* 1. Global Canvas & Typography */
body {
  background: #ebedf2 !important;
  color: #131826 !important;
}

/* All main section wrappers uniform soft porcelain Neumorphic base */
.hero, .services, .photo-banner, .vmc, .feature, .about, .why, .mentorship, 
.hiring, .team, .partner, .courses, .dedicated-courses, .projects, .contact, .ft {
  background: #ebedf2 !important;
  background-image: none !important;
}

/* 2. Top Navigation Bar (Pure Neumorphic Soft Extrusion Theme - Clean Without Outer White Fade) */
.nav {
  position: fixed !important;
  top: 14px !important;
  left: 20px !important;
  right: 20px !important;
  z-index: 1000 !important;
  background: linear-gradient(145deg, #f7f9fd 0%, #e5e9f2 100%) !important;
  border-radius: 50px !important;
  border: 1px solid rgba(215, 222, 235, 0.8) !important;
  box-shadow: 
    0 4px 18px rgba(15, 23, 42, 0.06),
    0 1px 3px rgba(15, 23, 42, 0.03) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.3s ease, background 0.35s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.35s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.35s cubic-bezier(0.16, 1, 0.3, 1) !important;
  overflow: visible !important;
}
.nav::before, .nav::after {
  display: none !important;
}
.nav.s {
  background: linear-gradient(145deg, #f8fafd 0%, #e2e7f0 100%) !important;
  border-color: rgba(200, 210, 225, 0.9) !important;
  box-shadow: 
    0 8px 24px rgba(15, 23, 42, 0.08),
    0 2px 6px rgba(15, 23, 42, 0.04) !important;
}
.nav.nav-hidden {
  transform: translateY(-160%) !important;
  pointer-events: none !important;
  opacity: 0 !important;
}
.nav-in {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 16px 0 18px !important;
  height: 66px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  position: relative !important;
  z-index: 2 !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}
.nav-logo {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  flex-shrink: 0 !important;
  text-decoration: none !important;
  margin-right: 6px !important;
}
.nav-ico {
  width: 40px !important;
  height: 40px !important;
  object-fit: contain !important;
  background: transparent !important;
  border-radius: 0 !important;
  padding: 0 !important;
  border: none !important;
  box-shadow: none !important;
  mix-blend-mode: multiply !important;
  transition: all .28s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
.nav-logo:hover .nav-ico {
  transform: translateY(-2px) scale(1.05) !important;
  box-shadow: none !important;
  filter: drop-shadow(0 3px 6px rgba(150, 164, 188, 0.4)) !important;
}
.nav-txt strong {
  font-size: 14.5px !important;
  font-weight: 800 !important;
  color: #131826 !important;
  display: block !important;
  line-height: 1.2 !important;
  letter-spacing: -0.3px !important;
  white-space: nowrap !important;
}
.nav-txt strong em {
  color: var(--blue) !important;
  font-style: normal !important;
}
.nav-txt small {
  font-size: 10px !important;
  color: #64748b !important;
  font-weight: 600 !important;
  letter-spacing: 0.2px !important;
  display: block !important;
  white-space: nowrap !important;
}

/* Quick Link Bar (Signature Extruded Neumorphic Pill Floating Island) */
.nav-ul {
  display: flex !important;
  align-items: center !important;
  gap: 2px !important;
  margin: 0 0 0 auto !important;
  background: linear-gradient(145deg, #ffffff 0%, #e8ecf6 100%) !important;
  border: 1.5px solid rgba(255, 255, 255, 0.95) !important;
  border-radius: 50px !important;
  padding: 4px 6px !important;
  box-shadow: 
    5px 7px 18px rgba(140, 155, 180, 0.42),
    2px 3px 6px rgba(140, 155, 180, 0.2),
    inset 1px 1px 2px rgba(255, 255, 255, 0.95),
    inset -1px -1px 2px rgba(140, 155, 180, 0.15) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  transition: all .3s cubic-bezier(0.16, 1, 0.3, 1) !important;
  max-width: calc(100% - 195px) !important;
  overflow-x: auto !important;
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
  flex-shrink: 1 !important;
  white-space: nowrap !important;
}
.nav-ul::-webkit-scrollbar {
  display: none !important;
}
.nav-ul:hover {
  box-shadow: 
    6px 9px 22px rgba(135, 150, 178, 0.48),
    2px 3px 7px rgba(135, 150, 178, 0.25),
    -5px -5px 12px #ffffff,
    inset 1px 1px 2px rgba(255, 255, 255, 1) !important;
}

/* Nav Item Links */
.nav-ul a {
  display: inline-flex !important;
  align-items: center !important;
  gap: 3.5px !important;
  font-size: 11px !important;
  font-weight: 650 !important;
  color: #475569 !important;
  padding: 5px 8px !important;
  border-radius: 50px !important;
  border: 1px solid transparent !important;
  background: transparent !important;
  box-shadow: none !important;
  transition: all .22s cubic-bezier(0.16, 1, 0.3, 1) !important;
  white-space: nowrap !important;
  text-decoration: none !important;
  user-select: none !important;
}
.nav-ul a svg {
  width: 12px !important;
  height: 12px !important;
  flex-shrink: 0 !important;
  color: #64748b !important;
  transition: all .22s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

/* Hover: Tactile Soft Porcelain Raised Button */
.nav-ul a:hover {
  color: var(--blue) !important;
  background: #ffffff !important;
  border-color: rgba(255, 255, 255, 0.9) !important;
  box-shadow: 
    2px 4px 9px rgba(145, 158, 182, 0.38),
    -2px -2px 6px #ffffff,
    inset 0 1px 1px #ffffff !important;
  transform: translateY(-1px) !important;
}
.nav-ul a:hover svg {
  color: var(--blue) !important;
  transform: scale(1.15) !important;
}

/* Pressed / Active Click state for inactive items */
.nav-ul a:active {
  background: #e2e6f0 !important;
  box-shadow: 
    inset 2px 2px 5px rgba(140, 155, 180, 0.5),
    inset -2px -2px 5px #ffffff !important;
  transform: translateY(0.5px) scale(0.98) !important;
}

/* Active Item: 3D Neumorphic Tactile Blue Jewel Pill */
.nav-ul a.on {
  background: linear-gradient(145deg, #3d75fd 0%, #2558ea 50%, #1742d4 100%) !important;
  color: #ffffff !important;
  border-color: transparent !important;
  box-shadow: 
    3px 5px 14px rgba(23, 66, 212, 0.46),
    0 2px 4px rgba(15, 23, 42, 0.12),
    -2px -2px 6px rgba(255, 255, 255, 0.8),
    inset 0 2px 3px rgba(255, 255, 255, 0.55),
    inset 0 -2px 4px rgba(10, 25, 110, 0.45) !important;
  text-shadow: 0 1px 2px rgba(10, 25, 90, 0.35) !important;
  font-weight: 700 !important;
  transform: translateY(-0.5px) !important;
}
.nav-ul a.on svg {
  color: #ffffff !important;
  transform: scale(1.1) !important;
  filter: drop-shadow(0 1px 2px rgba(10, 25, 90, 0.3)) !important;
}
.nav-ul a.on:hover {
  background: linear-gradient(145deg, #4880ff 0%, #2c60f2 50%, #1a47dc 100%) !important;
  box-shadow: 
    4px 7px 18px rgba(23, 66, 212, 0.52),
    -2px -2px 6px rgba(255, 255, 255, 0.9),
    inset 0 2px 3px rgba(255, 255, 255, 0.65),
    inset 0 -2px 4px rgba(10, 25, 110, 0.5) !important;
  transform: translateY(-1px) !important;
  color: #ffffff !important;
}
.nav-ul a.on:active {
  box-shadow: 
    inset 3px 3px 6px rgba(8, 20, 95, 0.65),
    inset -2px -2px 5px rgba(255, 255, 255, 0.35) !important;
  transform: translateY(0.5px) scale(0.98) !important;
}

/* Nav Action Button */
.nav-btn {
  background: linear-gradient(145deg, #3d75fd 0%, #2558ea 50%, #1742d4 100%) !important;
  color: #ffffff !important;
  box-shadow: 
    5px 7px 18px rgba(23, 66, 212, 0.42),
    -3px -3px 8px #ffffff,
    inset 0 2px 3px rgba(255, 255, 255, 0.5),
    inset 0 -2px 4px rgba(10, 25, 110, 0.45) !important;
  border: none !important;
  border-radius: 50px !important;
  font-weight: 700 !important;
  transition: all .25s ease !important;
}
.nav-btn:hover {
  transform: translateY(-2px) scale(1.03) !important;
  box-shadow: 
    6px 9px 22px rgba(23, 66, 212, 0.5),
    -4px -4px 10px #ffffff,
    inset 0 2px 4px rgba(255, 255, 255, 0.6) !important;
}
.nav-btn:active {
  transform: translateY(0.5px) scale(0.98) !important;
  box-shadow: 
    inset 3px 3px 6px rgba(8, 20, 95, 0.6),
    inset -2px -2px 5px rgba(255, 255, 255, 0.3) !important;
}

/* Hamburger Button (Clean Tactile Squircle) */
.hbg {
  background: linear-gradient(145deg, #f7f9fd 0%, #ebedf3 100%) !important;
  border: 1px solid rgba(215, 222, 235, 0.85) !important;
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.08) !important;
  border-radius: 14px !important;
}
.hbg:hover {
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.12) !important;
  transform: scale(1.04) !important;
}
.hbg.active {
  background: #e2e6ee !important;
  box-shadow: inset 1px 1px 3px rgba(15, 23, 42, 0.12) !important;
  transform: scale(0.98) !important;
}

/* Compact Laptop Screens (1024px - 1440px) Nav Ul Fit */
@media(max-width: 1440px) and (min-width: 769px) {
  .nav {
    left: 12px !important;
    right: 12px !important;
    top: 10px !important;
  }
  .nav-in {
    padding: 0 14px !important;
    gap: 8px !important;
  }
  .nav-logo {
    gap: 8px !important;
  }
  .nav-ico {
    width: 36px !important;
    height: 36px !important;
  }
  .nav-txt strong {
    font-size: 13.5px !important;
  }
  .nav-txt small {
    font-size: 9.5px !important;
  }
  .nav-ul {
    padding: 3.5px 5px !important;
    gap: 1.5px !important;
    max-width: calc(100% - 175px) !important;
  }
  .nav-ul a {
    font-size: 10.5px !important;
    padding: 4.5px 6.5px !important;
    gap: 3px !important;
  }
  .nav-ul a svg {
    width: 11px !important;
    height: 11px !important;
  }
}
@media(max-width: 1200px) and (min-width: 769px) {
  .nav-in {
    padding: 0 10px !important;
  }
  .nav-txt small {
    display: none !important;
  }
  .nav-ul {
    max-width: calc(100% - 150px) !important;
    overflow-x: auto !important;
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
  }
  .nav-ul::-webkit-scrollbar {
    display: none !important;
  }
  .nav-ul a {
    font-size: 10px !important;
    padding: 4px 5.5px !important;
    gap: 2.5px !important;
  }
}

/* Mobile Neumorphic Header & Dropdown */
@media(max-width: 768px) {
  .nav {
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 60px !important;
    border-radius: 0 0 26px 26px !important;
    border-top: none !important;
    box-shadow: 
      0 4px 18px rgba(15, 23, 42, 0.08),
      0 1px 3px rgba(15, 23, 42, 0.04) !important;
  }
  .nav-in {
    height: 60px !important;
    padding: 0 16px !important;
  }
  .nav-ul {
    top: 68px !important;
    left: 12px !important;
    right: 12px !important;
    background: #ffffff !important;
    box-shadow: 
      0 16px 40px rgba(15, 23, 42, 0.18),
      0 4px 12px rgba(15, 23, 42, 0.08) !important;
    border: 1px solid rgba(200, 210, 225, 0.8) !important;
    border-radius: 24px !important;
    padding: 14px 10px 18px !important;
    z-index: 10002 !important;
    filter: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
  .nav-ul li a {
    background: transparent !important;
    border: 1px solid transparent !important;
    box-shadow: none !important;
    border-radius: 14px !important;
    color: #1e293b !important;
    font-size: 13.5px !important;
    font-weight: 650 !important;
    padding: 11px 14px !important;
  }
  .nav-ul li a:hover,
  .nav-ul li a:focus {
    background: linear-gradient(145deg, #ffffff 0%, #e6ebf3 100%) !important;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.08) !important;
    color: var(--blue) !important;
    transform: translateX(4px) !important;
  }
  .nav-ul li a:active {
    background: #e2e6ee !important;
    box-shadow: inset 1px 1px 3px rgba(15, 23, 42, 0.1) !important;
  }
  .nav-ul li a.on {
    background: linear-gradient(145deg, #3d75fd 0%, #2558ea 50%, #1742d4 100%) !important;
    color: #ffffff !important;
    box-shadow: 0 4px 14px rgba(23, 66, 212, 0.4) !important;
  }
}

/* 3. HERO Section (Soft Neumorphic Feel) */
.hero {
  background: #ebedf2 !important;
  background-image: radial-gradient(#cbd3df 1.5px, transparent 1.5px) !important;
  background-size: 32px 32px !important;
}
.hero-glow-orb {
  opacity: 0.08 !important;
}
.hero-bubble {
  background: #ebedf2 !important;
  border: none !important;
  box-shadow: 6px 8px 16px rgba(155, 168, 192, 0.38), -3px -3px 10px rgba(255, 255, 255, 0.5) !important;
}
.hero-badge {
  background: linear-gradient(145deg, #f2f5fb 0%, #e3e7f0 100%) !important;
  border: none !important;
  border-radius: 50px !important;
  box-shadow: 6px 8px 18px rgba(155, 168, 192, 0.38), -3px -3px 10px rgba(255, 255, 255, 0.5) !important;
  color: var(--blue) !important;
}
.hero-h1 {
  color: #131826 !important;
}
.hero-trust.liquid-glass {
  background: linear-gradient(145deg, #f2f5fb 0%, #e3e7f0 100%) !important;
  border: none !important;
  border-radius: 50px !important;
  box-shadow: 10px 12px 28px rgba(155, 168, 192, 0.42), -6px -6px 16px rgba(255, 255, 255, 0.5) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
.trust-item {
  color: #4a5568 !important;
}
.trust-glass-sep {
  background: linear-gradient(to bottom, transparent, rgba(166, 175, 195, 0.4), transparent) !important;
}
.fbadge {
  background: linear-gradient(145deg, #f2f5fb 0%, #e3e7f0 100%) !important;
  border: none !important;
  border-radius: 24px !important;
  box-shadow: 8px 10px 22px rgba(155, 168, 192, 0.4), -4px -4px 12px rgba(255, 255, 255, 0.5) !important;
}

/* 4. Interactive 3D Pill Buttons (Figma Claymorphic Tactile Style) */
.btn-blue, .btn-solid, .btn-pcta-wa, .btn-dc-enroll, .btn-dc-submit-enroll, 
.btn-coursera-more, .more-card-btn, .mentor-cta-btn, .btn-pview, #dcResetSearchBtn, .btn-dc-close-succ {
  background: linear-gradient(145deg, #3d75fd 0%, #2b64f5 50%, #1a4ee5 100%) !important;
  color: #ffffff !important;
  border: none !important;
  outline: none !important;
  border-radius: 50px !important;
  box-shadow: 
    0 14px 28px -4px rgba(26, 72, 230, 0.42),
    0 6px 12px -2px rgba(15, 23, 42, 0.16),
    inset 0 3px 6px rgba(255, 255, 255, 0.55),
    inset 0 -4px 8px rgba(10, 30, 130, 0.48),
    inset 2px 2px 5px rgba(255, 255, 255, 0.35),
    inset -2px -2px 6px rgba(10, 30, 130, 0.35) !important;
  text-shadow: 0 1px 2px rgba(10, 25, 90, 0.25) !important;
  transition: all .28s cubic-bezier(0.4, 0, 0.2, 1) !important;
  font-weight: 700 !important;
}
.btn-blue:hover, .btn-solid:hover, .btn-pcta-wa:hover, .btn-dc-enroll:hover, .btn-dc-submit-enroll:hover, 
.btn-coursera-more:hover, .more-card-btn:hover, .mentor-cta-btn:hover, .btn-pview:hover, #dcResetSearchBtn:hover, .btn-dc-close-succ:hover {
  background: linear-gradient(145deg, #487dfd 0%, #356ef8 50%, #2053ea 100%) !important;
  color: #ffffff !important;
  box-shadow: 
    0 18px 36px -4px rgba(26, 72, 230, 0.52),
    0 8px 16px -2px rgba(15, 23, 42, 0.2),
    inset 0 3px 6px rgba(255, 255, 255, 0.65),
    inset 0 -4px 8px rgba(10, 30, 130, 0.55),
    inset 2px 2px 6px rgba(255, 255, 255, 0.45),
    inset -2px -2px 6px rgba(10, 30, 130, 0.45) !important;
  transform: translateY(-2px) !important;
}
.btn-blue:active, .btn-solid:active, .btn-pcta-wa:active, .btn-dc-enroll:active, .btn-dc-submit-enroll:active, 
.btn-coursera-more:active, .more-card-btn:active, .mentor-cta-btn:active, .btn-pview:active, #dcResetSearchBtn:active, .btn-dc-close-succ:active {
  box-shadow: 
    0 4px 10px rgba(26, 72, 230, 0.25),
    inset 0 4px 10px rgba(8, 24, 105, 0.65),
    inset 0 -2px 6px rgba(255, 255, 255, 0.3) !important;
  transform: translateY(1px) scale(0.98) !important;
}

/* WhatsApp 3D Tactile Pill Buttons */
.btn-wa-big, .btn-dc-wa, .btn-pwa, .btn-dc-success-wa {
  background: linear-gradient(135deg, #36da70 0%, #22c55e 50%, #159b44 100%) !important;
  color: #ffffff !important;
  border: none !important;
  outline: none !important;
  border-radius: 50px !important;
  box-shadow: 
    0 14px 28px -4px rgba(34, 197, 94, 0.42),
    0 6px 12px -2px rgba(15, 23, 42, 0.16),
    inset 0 3px 6px rgba(255, 255, 255, 0.55),
    inset 0 -4px 8px rgba(14, 95, 42, 0.48),
    inset 2px 2px 5px rgba(255, 255, 255, 0.35),
    inset -2px -2px 6px rgba(14, 95, 42, 0.35) !important;
  text-shadow: 0 1px 2px rgba(10, 70, 30, 0.25) !important;
  transition: all .28s cubic-bezier(0.4, 0, 0.2, 1) !important;
  font-weight: 700 !important;
}
.btn-wa-big:hover, .btn-dc-wa:hover, .btn-pwa:hover, .btn-dc-success-wa:hover {
  background: linear-gradient(135deg, #42e07a 0%, #27cf64 50%, #19a84b 100%) !important;
  color: #ffffff !important;
  box-shadow: 
    0 18px 36px -4px rgba(34, 197, 94, 0.52),
    0 8px 16px -2px rgba(15, 23, 42, 0.2),
    inset 0 3px 6px rgba(255, 255, 255, 0.65),
    inset 0 -4px 8px rgba(14, 95, 42, 0.55),
    inset 2px 2px 6px rgba(255, 255, 255, 0.45),
    inset -2px -2px 6px rgba(14, 95, 42, 0.45) !important;
  transform: translateY(-2px) !important;
}
.btn-wa-big:active, .btn-dc-wa:active, .btn-pwa:active, .btn-dc-success-wa:active {
  box-shadow: 
    0 4px 10px rgba(34, 197, 94, 0.25),
    inset 0 4px 10px rgba(10, 75, 32, 0.65),
    inset 0 -2px 6px rgba(255, 255, 255, 0.3) !important;
  transform: translateY(1px) scale(0.98) !important;
}

/* Secondary 3D Porcelain Pill Buttons */
.btn-out, .btn-coursera-form, .btn-pcta-out, .dc-back-btn, .dc-btn-toggle-info {
  background: linear-gradient(145deg, #ffffff 0%, #e8edf5 100%) !important;
  color: #2845EE !important;
  border: none !important;
  outline: none !important;
  border-radius: 50px !important;
  box-shadow: 
    0 12px 26px -4px rgba(155, 168, 195, 0.45),
    0 5px 10px -2px rgba(15, 23, 42, 0.08),
    inset 0 3px 5px #ffffff,
    inset 0 -4px 7px rgba(166, 175, 195, 0.45),
    inset 2px 2px 5px #ffffff,
    inset -2px -2px 5px rgba(166, 175, 195, 0.35) !important;
  transition: all .28s cubic-bezier(0.4, 0, 0.2, 1) !important;
  font-weight: 700 !important;
}
.btn-out:hover, .btn-coursera-form:hover, .btn-pcta-out:hover, .dc-back-btn:hover, .dc-btn-toggle-info:hover {
  background: linear-gradient(145deg, #ffffff 0%, #f0f3fa 100%) !important;
  color: #1a3ad4 !important;
  box-shadow: 
    0 16px 32px -4px rgba(145, 160, 185, 0.52),
    0 8px 14px -2px rgba(15, 23, 42, 0.12),
    inset 0 3px 5px #ffffff,
    inset 0 -4px 7px rgba(155, 165, 188, 0.5),
    inset 2px 2px 6px #ffffff,
    inset -2px -2px 6px rgba(155, 165, 188, 0.4) !important;
  transform: translateY(-2px) !important;
}
.btn-out:active, .btn-coursera-form:active, .btn-pcta-out:active, .dc-back-btn:active, .dc-btn-toggle-info:active {
  box-shadow: 
    0 4px 10px rgba(155, 168, 195, 0.3),
    inset 0 4px 8px rgba(166, 175, 195, 0.55),
    inset 0 -2px 5px #ffffff !important;
  transform: translateY(1px) scale(0.98) !important;
}

/* 5. PHOTO BANNER / STATS BANNER (Accurate Soft Neumorphism like Image 1 & 3) */
.photo-banner {
  background: #ebedf2 !important;
  border-top: 1.5px solid rgba(255,255,255,0.95) !important;
  border-bottom: 1.5px solid #d5dbe5 !important;
  padding: 64px 20px !important;
  min-height: auto !important;
}
.photo-banner::before, .pb-glow, .pb-particles {
  display: none !important;
}
.pb-title {
  background: linear-gradient(135deg, #131826 0%, #2845EE 65%, #7c3aed 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  animation: none !important;
  margin-bottom: 36px !important;
}
.pb-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 26px;
  justify-content: center;
  max-width: 980px;
  margin: 0 auto;
}
.pb-stat {
  background: linear-gradient(145deg, #f2f5fb 0%, #e3e7f0 100%) !important;
  border: none !important;
  border-radius: 44px !important;
  box-shadow: 
    16px 20px 48px rgba(155, 168, 195, 0.46),
    6px 8px 18px rgba(155, 168, 195, 0.25),
    -8px -8px 28px rgba(255, 255, 255, 0.55),
    -4px -4px 12px rgba(255, 255, 255, 0.4) !important;
  padding: 42px 28px !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  animation: none !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
.pb-stat:hover {
  background: linear-gradient(145deg, #f6f9ff 0%, #e0e5ee 100%) !important;
  box-shadow: 
    20px 26px 56px rgba(145, 160, 185, 0.54),
    8px 10px 22px rgba(145, 160, 185, 0.3),
    -10px -10px 32px rgba(255, 255, 255, 0.6),
    -5px -5px 14px rgba(255, 255, 255, 0.45) !important;
  transform: translateY(-6px) !important;
}
.pb-stat strong {
  background: linear-gradient(135deg, #2845EE, #7c3aed) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  text-shadow: none !important;
  font-size: clamp(34px, 4vw, 50px) !important;
  font-weight: 800 !important;
  display: block !important;
  margin-bottom: 8px !important;
  letter-spacing: -1.5px !important;
}
.pb-stat span {
  color: #556275 !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  letter-spacing: 1.8px !important;
  text-transform: uppercase !important;
  display: block !important;
}

/* 6. PARTNERSHIP SECTION (Neumorphic Conversion) */
.partner {
  background: #ebedf2 !important;
  border-top: 1px solid rgba(255,255,255,0.8) !important;
  border-bottom: 1px solid rgba(166,175,195,0.25) !important;
}
.partner::before, .partner::after {
  display: none !important;
}
.partner-left h2 {
  color: #131826 !important;
}
.partner-left h2 .b-text {
  background: linear-gradient(135deg, #2845EE 0%, #0ea5e9 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}
.partner-left p.partner-lead {
  color: #475569 !important;
}
.org-card {
  background: linear-gradient(145deg, #f2f5fb 0%, #e3e7f0 100%) !important;
  border: none !important;
  border-radius: 44px !important;
  box-shadow: 
    16px 20px 48px rgba(155, 168, 195, 0.46),
    6px 8px 18px rgba(155, 168, 195, 0.25),
    -8px -8px 28px rgba(255, 255, 255, 0.55),
    -4px -4px 12px rgba(255, 255, 255, 0.4) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
.org-card:hover {
  background: linear-gradient(145deg, #f6f9ff 0%, #e0e5ee 100%) !important;
  box-shadow: 
    20px 26px 56px rgba(145, 160, 185, 0.54),
    8px 10px 22px rgba(145, 160, 185, 0.3),
    -10px -10px 32px rgba(255, 255, 255, 0.6) !important;
  transform: translateY(-5px) !important;
}
.org-card.org-card-lead {
  background: linear-gradient(145deg, #f4f7fc 0%, #e2e6ef 100%) !important;
  border: none !important;
  border-radius: 44px !important;
  box-shadow: 
    16px 20px 48px rgba(155, 168, 195, 0.46),
    -8px -8px 28px rgba(255, 255, 255, 0.55) !important;
}
.org-card-ico {
  background: #ebedf2 !important;
  border: none !important;
  border-radius: 20px !important;
  box-shadow: inset 3px 3px 7px rgba(166, 175, 195, 0.38), inset -2px -2px 5px rgba(255, 255, 255, 0.7) !important;
}
.org-card-txt strong {
  color: #131826 !important;
}
.org-card-txt span {
  color: #5c667a !important;
}
.partner-quote {
  background: #ebedf2 !important;
  border: none !important;
  border-left: 4px solid var(--blue) !important;
  box-shadow: inset 4px 4px 9px rgba(166, 175, 195, 0.38), inset -4px -4px 9px #ffffff !important;
  border-radius: 0 28px 28px 0 !important;
  backdrop-filter: none !important;
}
.partner-quote p {
  color: #334155 !important;
}
.partner-quote strong {
  color: var(--blue) !important;
}
.partner-obj {
  background: linear-gradient(145deg, #f2f5fb 0%, #e3e7f0 100%) !important;
  border: none !important;
  border-radius: 46px !important;
  box-shadow: 
    18px 24px 50px rgba(155, 168, 192, 0.45),
    -8px -8px 28px rgba(255, 255, 255, 0.55) !important;
  backdrop-filter: none !important;
}
.partner-obj-title {
  color: var(--blue) !important;
  border-bottom: 1.5px solid rgba(166, 175, 195, 0.25) !important;
}
.partner-obj-title svg {
  color: var(--blue) !important;
}
.pobj-item {
  color: #334155 !important;
}
.pobj-check {
  background: #ebedf2 !important;
  border: none !important;
  border-radius: 50% !important;
  box-shadow: 3px 3px 7px rgba(166, 175, 195, 0.35), -2px -2px 5px #ffffff !important;
  color: var(--blue) !important;
}
.partner-reps {
  background: linear-gradient(145deg, #f2f5fb 0%, #e3e7f0 100%) !important;
  border: none !important;
  border-radius: 46px !important;
  box-shadow: 
    18px 24px 50px rgba(155, 168, 192, 0.45),
    -8px -8px 28px rgba(255, 255, 255, 0.55) !important;
  backdrop-filter: none !important;
}
.partner-reps-title {
  color: var(--blue) !important;
  border-bottom: 1.5px solid rgba(166, 175, 195, 0.25) !important;
}
.rep-box {
  background: linear-gradient(145deg, #f2f5fb 0%, #e3e7f0 100%) !important;
  border: none !important;
  border-radius: 28px !important;
  box-shadow: 8px 10px 24px rgba(155, 168, 192, 0.4), -4px -4px 14px rgba(255, 255, 255, 0.5) !important;
}
.rep-box:hover {
  background: linear-gradient(145deg, #f6f9ff 0%, #e0e5ee 100%) !important;
  box-shadow: 12px 14px 28px rgba(145, 160, 185, 0.48), -5px -5px 16px rgba(255, 255, 255, 0.5) !important;
  transform: translateY(-3px) !important;
}
.rep-avatar {
  background: #ebedf2 !important;
  box-shadow: 4px 4px 9px rgba(166, 175, 195, 0.35), -2px -2px 6px rgba(255, 255, 255, 0.5) !important;
  border: none !important;
}
.rep-info strong {
  color: #131826 !important;
}
.rep-info span {
  color: #5c667a !important;
}

/* 7. Cards across all sections (Neumorphic Extruded Cards - Image 1 Soft Curvature) */
.svc-grid {
  gap: 24px !important;
}
.vmc-card, .svc-card, .feat-card, .wc, .mentor-card, .coursera-card, .dc-card, 
.project-card, .tc, .lead-card, .pos-item, .hr-box, .int-meta-item, .benefit-item, .cbox {
  background: linear-gradient(145deg, #f2f5fb 0%, #e3e7f0 100%) !important;
  border: none !important;
  border-radius: 44px !important;
  box-shadow: 
    16px 20px 48px rgba(155, 168, 195, 0.46),
    6px 8px 18px rgba(155, 168, 195, 0.25),
    -8px -8px 28px rgba(255, 255, 255, 0.55),
    -4px -4px 12px rgba(255, 255, 255, 0.4) !important;
  transition: all .32s cubic-bezier(0.16,1,0.3,1) !important;
}
.svc-card {
  padding: 38px 28px !important;
}
.vmc-card:hover, .svc-card:hover, .feat-card:hover, .wc:hover, .mentor-card:hover, 
.coursera-card:hover, .dc-card:hover, .project-card:hover, .tc:hover, .lead-card:hover {
  background: linear-gradient(145deg, #f6f9ff 0%, #e0e5ee 100%) !important;
  box-shadow: 
    20px 26px 56px rgba(145, 160, 185, 0.54),
    8px 10px 22px rgba(145, 160, 185, 0.3),
    -10px -10px 32px rgba(255, 255, 255, 0.6),
    -5px -5px 14px rgba(255, 255, 255, 0.45) !important;
  transform: translateY(-6px) !important;
}
.svc-arrow {
  top: 28px !important;
  right: 28px !important;
  background: #ebedf2 !important;
  border: none !important;
  box-shadow: inset 2.5px 2.5px 5px rgba(166, 175, 195, 0.4), inset -2.5px -2.5px 5px #ffffff !important;
  color: #64748b !important;
  border-radius: 50% !important;
}
.svc-card:hover .svc-arrow {
  background: var(--blue) !important;
  color: #ffffff !important;
  box-shadow: 3px 4px 12px rgba(40, 69, 238, 0.45) !important;
}
.svc-num {
  color: #7e8c9f !important;
  font-weight: 800 !important;
  margin-bottom: 12px !important;
}
.svc-card h3 {
  color: #131826 !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  margin-bottom: 10px !important;
}
.svc-card p {
  color: #556275 !important;
  font-size: 12.5px !important;
  line-height: 1.65 !important;
}
.svc-ico {
  border-radius: 22px !important;
  filter: drop-shadow(4px 6px 14px rgba(160, 175, 200, 0.32)) !important;
  margin-bottom: 22px !important;
}

/* 8. Neumorphic Icon Wells */
.svc-ico, .vmc-ico, .wc-ico, .mentor-ico, .int-meta-ico, .ben-ico {
  background: #ebedf2 !important;
  box-shadow: inset 4px 4px 8px rgba(166, 175, 195, 0.38), inset -4px -4px 8px #ffffff !important;
  border: none !important;
  border-radius: 22px !important;
}
.feat-ico-wrap {
  box-shadow: 6px 8px 18px rgba(166, 175, 195, 0.38), -6px -6px 16px #ffffff !important;
  border: none !important;
  border-radius: 22px !important;
}

/* 9. About Section Stat Box & Numbers */
.about-stat-box {
  background: linear-gradient(145deg, #f2f5fb 0%, #e3e7f0 100%) !important;
  border: none !important;
  border-radius: 48px !important;
  box-shadow: 
    18px 24px 50px rgba(155, 168, 192, 0.45),
    -8px -8px 28px rgba(255, 255, 255, 0.55) !important;
}
.about-stat-box::before, .about-stat-box::after {
  display: none !important;
}
.stat-title {
  color: var(--blue) !important;
}
.stat-title::before {
  background: var(--blue) !important;
}
.stat-item {
  background: #ebedf2 !important;
  border: none !important;
  border-radius: 22px !important;
  box-shadow: inset 4px 4px 9px rgba(166, 175, 195, 0.4), inset -4px -4px 9px #ffffff !important;
}
.stat-item::before {
  display: none !important;
}
.stat-item strong {
  background: linear-gradient(135deg, #2845EE, #7c3aed) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}
.stat-item span {
  color: #5c667a !important;
}

/* 10. Mentorship CTA & Showcase Box */
.mentor-cta {
  background: linear-gradient(145deg, #f2f5fb 0%, #e3e7f0 100%) !important;
  border: none !important;
  border-radius: 44px !important;
  box-shadow: 
    16px 20px 48px rgba(155, 168, 195, 0.46),
    6px 8px 18px rgba(155, 168, 195, 0.25),
    -8px -8px 28px rgba(255, 255, 255, 0.55),
    -4px -4px 12px rgba(255, 255, 255, 0.4) !important;
  color: #131826 !important;
}
.mentor-cta::before {
  display: none !important;
}
.mentor-cta-txt h3 {
  color: #131826 !important;
}
.mentor-cta-txt p {
  color: #475569 !important;
}
.mentor-showcase-box {
  background: linear-gradient(145deg, #f2f5fb 0%, #e3e7f0 100%) !important;
  border: none !important;
  border-radius: 44px !important;
  box-shadow: 
    16px 20px 48px rgba(155, 168, 195, 0.46),
    6px 8px 18px rgba(155, 168, 195, 0.25),
    -8px -8px 28px rgba(255, 255, 255, 0.55),
    -4px -4px 12px rgba(255, 255, 255, 0.4) !important;
  color: #131826 !important;
}
.mentor-showcase-box::before {
  display: none !important;
}
.ms-title {
  color: #131826 !important;
}
.ms-desc {
  color: #475569 !important;
}
.ms-card {
  background: linear-gradient(145deg, #f2f5fb 0%, #e3e7f0 100%) !important;
  border: none !important;
  box-shadow: 8px 10px 24px rgba(155, 168, 192, 0.4), -4px -4px 14px rgba(255, 255, 255, 0.5) !important;
  border-radius: 22px !important;
}
.ms-card strong {
  color: #131826 !important;
}
.ms-card p {
  color: #64748b !important;
}
.ms-ico {
  background: #ebedf2 !important;
  box-shadow: inset 3px 3px 6px rgba(166, 175, 195, 0.35), inset -2px -2px 4px rgba(255, 255, 255, 0.6) !important;
  border-radius: 14px !important;
}
.ms-pill {
  background: #ebedf2 !important;
  border: none !important;
  box-shadow: 4px 4px 9px rgba(166, 175, 195, 0.35), -2px -2px 6px rgba(255, 255, 255, 0.5) !important;
  border-radius: 50px !important;
  color: var(--blue) !important;
  font-weight: 700 !important;
}
.int-perks-card {
  background: linear-gradient(145deg, #f2f5fb 0%, #e3e7f0 100%) !important;
  border: none !important;
  border-radius: 44px !important;
  box-shadow: 
    16px 20px 48px rgba(155, 168, 195, 0.46),
    6px 8px 18px rgba(155, 168, 195, 0.25),
    -8px -8px 28px rgba(255, 255, 255, 0.55),
    -4px -4px 12px rgba(255, 255, 255, 0.4) !important;
  color: #131826 !important;
}
.int-perks-head strong {
  color: #131826 !important;
}
.int-perk-item {
  color: #334155 !important;
}

/* 11. Search Boxes, Filter Tabs & Form Inputs */
.dc-search-wrap {
  max-width: 500px !important;
  width: 100% !important;
  margin: 0 auto 22px !important;
  position: relative !important;
  z-index: 40 !important;
}
.dc-search-box {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 9px 20px !important;
  border-radius: 50px !important;
  background: linear-gradient(145deg, #ffffff 0%, #edf1f8 100%) !important;
  border: 1.5px solid rgba(255, 255, 255, 0.95) !important;
  box-shadow: 
    0 10px 26px rgba(150, 164, 188, 0.28),
    0 3px 8px rgba(150, 164, 188, 0.15),
    inset 0 1.5px 2px rgba(255, 255, 255, 1) !important;
  transition: all .25s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
.dc-search-box::before {
  display: none !important;
}
.dc-search-box:hover {
  transform: translateY(-2px) !important;
  box-shadow: 
    0 14px 32px rgba(145, 160, 185, 0.35),
    0 4px 10px rgba(145, 160, 185, 0.18),
    inset 0 1.5px 2px #ffffff !important;
}
.dc-search-box:focus-within {
  background: #ffffff !important;
  border-color: rgba(59, 130, 246, 0.8) !important;
  box-shadow: 
    0 12px 30px rgba(40, 69, 238, 0.22),
    0 0 0 3px rgba(40, 69, 238, 0.12),
    inset 0 1.5px 2px #ffffff !important;
  transform: translateY(-1px) !important;
}
.dc-search-icon {
  color: #3b82f6 !important;
  flex-shrink: 0 !important;
}
.dc-search-input {
  color: #1e293b !important;
  font-size: 13.5px !important;
  font-weight: 550 !important;
}
.dc-search-input::placeholder {
  color: #94a3b8 !important;
  font-weight: 500 !important;
}
.dc-filters-wrap {
  display: flex !important;
  justify-content: center !important;
  margin-bottom: 34px !important;
  width: 100% !important;
}
.dc-filters {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-wrap: nowrap !important;
  gap: 3px !important;
  background: linear-gradient(145deg, #ffffff 0%, #edf1f8 100%) !important;
  border: 1.5px solid rgba(255, 255, 255, 0.95) !important;
  border-radius: 50px !important;
  box-shadow: 
    0 12px 30px rgba(145, 160, 185, 0.32),
    0 4px 10px rgba(145, 160, 185, 0.16),
    inset 0 1.5px 2px #ffffff !important;
  padding: 5px 7px !important;
  backdrop-filter: none !important;
  max-width: 100% !important;
  overflow-x: auto !important;
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
}
.dc-filters::-webkit-scrollbar {
  display: none !important;
}
.dc-filter-btn {
  color: #475569 !important;
  border-radius: 50px !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  padding: 7px 15px !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  flex-shrink: 0 !important;
  transition: all .22s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
.dc-filter-btn:hover {
  background: rgba(255, 255, 255, 0.9) !important;
  box-shadow: 0 3px 8px rgba(150, 164, 188, 0.25), inset 0 1px 1px #ffffff !important;
  color: #2558ea !important;
  transform: translateY(-1px) !important;
}
.dc-filter-btn.active {
  background: linear-gradient(145deg, #3d75fd 0%, #2558ea 50%, #1742d4 100%) !important;
  color: #ffffff !important;
  font-weight: 700 !important;
  box-shadow: 
    0 5px 15px rgba(23, 66, 212, 0.42),
    0 2px 4px rgba(15, 23, 42, 0.12),
    inset 0 1.5px 2px rgba(255, 255, 255, 0.55),
    inset 0 -2px 3px rgba(10, 25, 110, 0.45) !important;
  text-shadow: 0 1px 2px rgba(10, 25, 90, 0.3) !important;
  transform: none !important;
}

/* Mobile Suggestion Bar (Horizontally Scrollable Pill Capsule Matching Reference Image) */
@media(max-width: 900px) {
  .dedicated-courses .sw {
    overflow: visible !important;
  }
  .dc-search-wrap {
    max-width: 100% !important;
    margin-bottom: 20px !important;
  }
  .dc-search-box {
    padding: 8px 18px !important;
  }
  .dc-filters-wrap {
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    width: calc(100% + 36px) !important;
    max-width: calc(100% + 36px) !important;
    margin-left: -18px !important;
    margin-right: -18px !important;
    padding: 6px 18px 14px 18px !important;
    margin-bottom: 24px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
    box-sizing: border-box !important;
  }
  .dc-filters-wrap::-webkit-scrollbar {
    display: none !important;
  }
  .dc-filters {
    display: inline-flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    gap: 4px !important;
    min-width: max-content !important;
    background: linear-gradient(145deg, #ffffff 0%, #edf1f8 100%) !important;
    border: 1.5px solid rgba(255, 255, 255, 0.95) !important;
    border-radius: 50px !important;
    box-shadow: 
      0 10px 24px rgba(145, 160, 185, 0.32),
      0 3px 8px rgba(145, 160, 185, 0.16),
      inset 0 1.5px 2px #ffffff !important;
    padding: 5px 8px !important;
    margin: 0 !important;
    overflow: visible !important;
  }
  .dc-filter-btn {
    padding: 7px 14px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    color: #334155 !important;
    white-space: nowrap !important;
    flex-shrink: 0 !important;
    border-radius: 50px !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    transition: all .2s ease !important;
  }
  .dc-filter-btn:hover {
    color: #2558ea !important;
    background: rgba(255, 255, 255, 0.85) !important;
  }
  .dc-filter-btn.active {
    padding: 7px 18px !important;
    font-size: 12.5px !important;
    font-weight: 700 !important;
    border-radius: 50px !important;
    background: linear-gradient(145deg, #3d75fd 0%, #2558ea 50%, #1742d4 100%) !important;
    color: #ffffff !important;
    box-shadow: 
      0 4px 14px rgba(23, 66, 212, 0.42),
      inset 0 1.5px 2px rgba(255, 255, 255, 0.55),
      inset 0 -2px 3px rgba(10, 25, 110, 0.45) !important;
    text-shadow: 0 1px 2px rgba(10, 25, 90, 0.3) !important;
  }
}
.dc-form-input, .dc-form-select, .dc-form-textarea {
  background: #ebedf2 !important;
  border: none !important;
  border-radius: 18px !important;
  box-shadow: inset 4px 4px 8px rgba(166, 175, 195, 0.38), inset -4px -4px 8px #ffffff !important;
  color: #131826 !important;
}
.dc-form-input:focus, .dc-form-select:focus, .dc-form-textarea:focus {
  border: none !important;
  box-shadow: inset 4px 4px 8px rgba(166, 175, 195, 0.48), inset -4px -4px 8px #ffffff, 0 0 0 2px rgba(40,69,238,0.2) !important;
}
.dc-suggestions-dropdown {
  background: linear-gradient(145deg, #f4f7fc 0%, #e3e7f0 100%) !important;
  border: none !important;
  border-radius: 26px !important;
  box-shadow: 14px 18px 36px rgba(155, 168, 192, 0.45), -6px -6px 18px rgba(255, 255, 255, 0.5) !important;
}
.dc-suggestion-item:hover, .dc-suggestion-item.highlighted {
  background: #e2e5ec !important;
  box-shadow: inset 2px 2px 5px rgba(166, 175, 195, 0.35), inset -2px -2px 5px #ffffff !important;
  border-radius: 12px !important;
}

/* 12. Team & Leadership (Neumorphic Conversion) */
.lead-dept-badge {
  background: #ebedf2 !important;
  border: none !important;
  border-radius: 50px !important;
  box-shadow: 5px 6px 14px rgba(166, 175, 195, 0.35), -3px -3px 8px rgba(255, 255, 255, 0.5) !important;
  color: var(--blue) !important;
}
.lead-card {
  background: linear-gradient(145deg, #f2f5fb 0%, #e3e7f0 100%) !important;
  border: none !important;
  box-shadow: 
    16px 20px 48px rgba(155, 168, 195, 0.46),
    6px 8px 18px rgba(155, 168, 195, 0.25),
    -8px -8px 28px rgba(255, 255, 255, 0.55),
    -4px -4px 12px rgba(255, 255, 255, 0.4) !important;
  border-radius: 44px !important;
}
.lead-card:hover {
  background: linear-gradient(145deg, #f6f9ff 0%, #e0e5ee 100%) !important;
  box-shadow: 
    20px 26px 56px rgba(145, 160, 185, 0.54),
    8px 10px 22px rgba(145, 160, 185, 0.3),
    -10px -10px 32px rgba(255, 255, 255, 0.6),
    -5px -5px 14px rgba(255, 255, 255, 0.45) !important;
  transform: translateY(-6px) !important;
}
.lead-card-body h3 {
  color: #131826 !important;
}
.lead-card-desc {
  color: #525d72 !important;
}
.lead-card-pill {
  background: #ebedf2 !important;
  border: none !important;
  border-radius: 50px !important;
  box-shadow: inset 2px 2px 5px rgba(166, 175, 195, 0.35), inset -2px -2px 5px #ffffff !important;
  color: #334155 !important;
}
.lead-card-cta {
  color: var(--blue) !important;
  border-top: 1.5px solid rgba(166, 175, 195, 0.25) !important;
}
.lead-card-photo-wrap {
  background: linear-gradient(180deg,#111d3d 0%,#081022 100%) !important;
  border-radius: 44px 44px 28px 28px !important;
  overflow: hidden !important;
  box-shadow: 0 6px 16px rgba(155, 168, 195, 0.25) !important;
}
.lead-card-photo-wrap img {
  border-radius: 0 0 28px 28px !important;
}
.lead-card-photo-overlay {
  background: none !important;
}

/* 13. Projects & Case Studies */
.projects-badge {
  background: #ebedf2 !important;
  border: none !important;
  border-radius: 50px !important;
  box-shadow: 5px 6px 14px rgba(166, 175, 195, 0.35), -3px -3px 8px rgba(255, 255, 255, 0.5) !important;
  color: var(--blue) !important;
}
.project-title {
  color: #131826 !important;
}
.project-desc {
  color: #525d72 !important;
}
.ptag {
  background: #ebedf2 !important;
  box-shadow: inset 2px 2px 5px rgba(166, 175, 195, 0.35), inset -2px -2px 5px #ffffff !important;
  border: none !important;
  border-radius: 50px !important;
  color: var(--blue) !important;
}
.btn-pview {
  background: linear-gradient(135deg, #2845EE, #1d35c7) !important;
  border-radius: 50px !important;
  box-shadow: 6px 8px 18px rgba(40, 69, 238, 0.4), -3px -3px 8px rgba(255, 255, 255, 0.4) !important;
  color: #ffffff !important;
}
.btn-pwa {
  background: #ebedf2 !important;
  border: none !important;
  border-radius: 50px !important;
  box-shadow: 5px 6px 14px rgba(166, 175, 195, 0.38), -3px -3px 8px rgba(255, 255, 255, 0.5) !important;
  color: #25D366 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: all 0.25s cubic-bezier(0.16,1,0.3,1) !important;
}
.btn-pwa svg {
  fill: #25D366 !important;
  transition: all 0.25s cubic-bezier(0.16,1,0.3,1) !important;
}
.btn-pwa:hover {
  background: #25D366 !important;
  border-color: #25D366 !important;
  box-shadow: 0 6px 18px rgba(37, 211, 102, 0.45) !important;
  transform: translateY(-2px) scale(1.06) !important;
}
.btn-pwa:hover svg {
  fill: #ffffff !important;
}

/* 14. Modals, Banner Containers & Popups */
.dc-modal-card, .tm-modal, .hiring-banner-card, .int-banner-card, .mentor-banner-wrap {
  background: linear-gradient(145deg, #f4f7fc 0%, #e3e7f0 100%) !important;
  border: none !important;
  border-radius: 48px !important;
  box-shadow: 
    18px 24px 50px rgba(145, 160, 185, 0.48),
    6px 8px 18px rgba(145, 160, 185, 0.25) !important;
  color: #131826 !important;
}
.dc-modal-head, .tm-modal-top {
  border-bottom: 1.5px solid rgba(166, 175, 195, 0.25) !important;
  background: transparent !important;
}
.tm-modal-footer {
  border-top: 1.5px solid rgba(166, 175, 195, 0.25) !important;
  background: transparent !important;
}
/* Fix close button - white on white background fix */
.tm-close {
  background: rgba(15, 23, 42, 0.08) !important;
  border: 1px solid rgba(15, 23, 42, 0.18) !important;
  color: #475569 !important;
}
.tm-close:hover {
  background: rgba(239, 68, 68, 0.15) !important;
  border-color: rgba(239, 68, 68, 0.5) !important;
  color: #ef4444 !important;
}
/* Fix name title - was white on white */
.tm-modal-name {
  color: #131826 !important;
}
/* Fix role badge colors for light background */
.tm-modal-role-badge {
  background: rgba(40, 69, 238, 0.1) !important;
  color: var(--blue) !important;
  border-color: rgba(40, 69, 238, 0.3) !important;
}
/* Fix org text */
.tm-modal-org {
  color: #64748b !important;
}
/* Fix section labels */
.tm-section-label {
  color: #64748b !important;
}
.tm-section-label::after {
  background: rgba(166, 175, 195, 0.35) !important;
}
/* Fix status dot border to match light bg */
.tm-status-dot {
  border-color: #ebedf2 !important;
}
/* Fix photo border */
.tm-modal-photo {
  border-color: rgba(166, 175, 195, 0.4) !important;
  box-shadow: 0 4px 14px rgba(155, 168, 195, 0.3) !important;
}
.tm-stat-card {
  background: #ebedf2 !important;
  border: none !important;
  border-radius: 22px !important;
  box-shadow: inset 3px 3px 7px rgba(166, 175, 195, 0.38), inset -3px -3px 7px #ffffff !important;
}
.tm-stat-val {
  color: var(--blue) !important;
}
.tm-stat-lbl {
  color: #64748b !important;
}
.tm-bio-box {
  background: #ebedf2 !important;
  border: none !important;
  border-left: 4px solid var(--blue) !important;
  border-radius: 0 22px 22px 0 !important;
  box-shadow: inset 4px 4px 8px rgba(166, 175, 195, 0.38), inset -4px -4px 8px #ffffff !important;
  color: #334155 !important;
}
.tm-qual-box {
  background: linear-gradient(145deg, #f2f5fb 0%, #e3e7f0 100%) !important;
  border: none !important;
  border-radius: 22px !important;
  box-shadow: 6px 8px 18px rgba(166, 175, 195, 0.35), -5px -5px 14px #ffffff !important;
}
.tm-qual-item {
  color: #334155 !important;
}
.tm-skill-tag {
  background: #ebedf2 !important;
  border: none !important;
  border-radius: 50px !important;
  box-shadow: 3px 3px 8px rgba(166, 175, 195, 0.35), -3px -3px 8px #ffffff !important;
  color: #334155 !important;
}
.dc-game-chip {
  background: linear-gradient(145deg, #f2f5fb 0%, #e3e7f0 100%) !important;
  border: 2px solid transparent !important;
  border-radius: 22px !important;
  box-shadow: 6px 8px 18px rgba(166, 175, 195, 0.35), -6px -6px 16px #ffffff !important;
}
.dc-game-chip.is-active {
  background: linear-gradient(135deg, rgba(40, 69, 238, 0.08) 0%, rgba(124, 58, 237, 0.08) 100%) !important;
  border: 2px solid var(--blue) !important;
  box-shadow: 0 0 0 3px rgba(40, 69, 238, 0.15), 6px 8px 18px rgba(166, 175, 195, 0.25), -4px -4px 12px rgba(255, 255, 255, 0.6) !important;
}
.dc-game-chip.is-active .dc-game-title {
  color: var(--blue) !important;
}
.dc-game-title {
  color: #131826 !important;
}
.dc-game-sub {
  color: #64748b !important;
}

/* 15. Contact Section, Social Chips & WhatsApp CTA */
.cbox {
  padding: 42px 32px !important;
  border-radius: 44px !important;
  border: none !important;
  background: linear-gradient(145deg, #f2f5fb 0%, #e3e7f0 100%) !important;
  box-shadow: 
    16px 20px 48px rgba(155, 168, 195, 0.46),
    6px 8px 18px rgba(155, 168, 195, 0.25),
    -8px -8px 28px rgba(255, 255, 255, 0.55),
    -4px -4px 12px rgba(255, 255, 255, 0.4) !important;
}
.ci {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  padding: 16px 0 !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.2) !important;
}
.ci:last-of-type {
  border-bottom: none !important;
  padding-bottom: 0 !important;
}
.ci-ico {
  background: transparent !important;
  box-shadow: none !important;
  border: none !important;
}
.sl-btn {
  background: linear-gradient(145deg, #f2f5fb 0%, #e3e7f0 100%) !important;
  border: none !important;
  border-radius: 22px !important;
  box-shadow: 7px 9px 20px rgba(155, 168, 192, 0.4), -6px -6px 18px #ffffff !important;
  transition: all .28s cubic-bezier(0.16,1,0.3,1) !important;
}
.sl-btn:hover {
  transform: translateY(-3px) scale(1.02) !important;
  border-color: transparent !important;
}
.sl-txt strong {
  color: #131826 !important;
  transition: color .2s ease !important;
}
.sl-txt small {
  color: #64748b !important;
  transition: color .2s ease !important;
}
.sl-btn:hover .sl-txt strong {
  color: #ffffff !important;
}
.sl-btn:hover .sl-txt small {
  color: rgba(255, 255, 255, 0.85) !important;
}
.sl-ico {
  width: 36px !important;
  height: 36px !important;
  border-radius: 10px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
  border: none !important;
  overflow: hidden !important;
  transition: transform 0.25s ease, background 0.25s ease !important;
}
.sl-btn:hover .sl-ico {
  transform: scale(1.08) !important;
}

/* Individual Brand Base & Hover Styles */
.si-fb {
  background: #1877f2 !important;
  box-shadow: 0 3px 10px rgba(24, 119, 242, 0.4) !important;
  color: #ffffff !important;
}
.sl-btn.fb:hover {
  background: #1877f2 !important;
  box-shadow: 0 10px 24px rgba(24, 119, 242, 0.45) !important;
}
.sl-btn.fb:hover .sl-ico {
  background: rgba(255, 255, 255, 0.2) !important;
  box-shadow: none !important;
}

.si-tt {
  background: #000000 !important;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.4) !important;
  color: #ffffff !important;
}
.sl-btn.tt:hover {
  background: #000000 !important;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.5) !important;
}
.sl-btn.tt:hover .sl-ico {
  background: rgba(255, 255, 255, 0.15) !important;
  box-shadow: none !important;
}

.si-ig {
  background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%) !important;
  box-shadow: 0 3px 10px rgba(214, 36, 159, 0.4) !important;
  color: #ffffff !important;
}
.sl-btn.ig:hover {
  background: linear-gradient(135deg, #833ab4, #fd1d1d, #fcb045) !important;
  box-shadow: 0 10px 24px rgba(225, 48, 108, 0.45) !important;
}
.sl-btn.ig:hover .sl-ico {
  background: rgba(255, 255, 255, 0.2) !important;
  box-shadow: none !important;
}

.si-wa {
  background: #25d366 !important;
  box-shadow: 0 3px 10px rgba(37, 211, 102, 0.4) !important;
  color: #ffffff !important;
}
.sl-btn.wa:hover {
  background: #25d366 !important;
  box-shadow: 0 10px 24px rgba(37, 211, 102, 0.45) !important;
}
.sl-btn.wa:hover .sl-ico {
  background: rgba(255, 255, 255, 0.2) !important;
  box-shadow: none !important;
}

.si-wg {
  background: #25d366 !important;
  box-shadow: 0 3px 10px rgba(37, 211, 102, 0.4) !important;
  color: #ffffff !important;
}
.sl-btn.wg:hover {
  background: #25d366 !important;
  box-shadow: 0 10px 24px rgba(37, 211, 102, 0.45) !important;
}
.sl-btn.wg:hover .sl-ico {
  background: rgba(255, 255, 255, 0.2) !important;
  box-shadow: none !important;
}

.si-gm {
  background: #ffffff !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
}
.sl-btn.gm:hover {
  background: #ea4335 !important;
  box-shadow: 0 10px 24px rgba(234, 67, 53, 0.45) !important;
}
.sl-btn.gm:hover .sl-ico {
  background: #ffffff !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2) !important;
}

/* 16. Floating Elements & Chatbot FAB (3D Figma Tactile Style) */
.cfab {
  background: linear-gradient(145deg, #3d75fd 0%, #2b64f5 50%, #1a4ee5 100%) !important;
  border: none !important;
  outline: none !important;
  border-radius: 50px !important;
  box-shadow: 
    0 14px 28px -4px rgba(26, 72, 230, 0.45),
    0 6px 12px -2px rgba(15, 23, 42, 0.18),
    inset 0 3px 6px rgba(255, 255, 255, 0.55),
    inset 0 -4px 8px rgba(10, 30, 130, 0.48),
    inset 2px 2px 5px rgba(255, 255, 255, 0.35),
    inset -2px -2px 6px rgba(10, 30, 130, 0.35) !important;
  transition: all .28s cubic-bezier(0.4, 0, 0.2, 1) !important;
}
.cfab:hover {
  transform: translateY(-2px) scale(1.06) !important;
  box-shadow: 
    0 18px 36px -4px rgba(26, 72, 230, 0.55),
    0 8px 16px -2px rgba(15, 23, 42, 0.22),
    inset 0 3px 6px rgba(255, 255, 255, 0.65),
    inset 0 -4px 8px rgba(10, 30, 130, 0.55),
    inset 2px 2px 6px rgba(255, 255, 255, 0.45),
    inset -2px -2px 6px rgba(10, 30, 130, 0.45) !important;
}
.cfab:active {
  transform: translateY(1px) scale(0.97) !important;
  box-shadow: 
    0 4px 10px rgba(26, 72, 230, 0.25),
    inset 0 4px 10px rgba(8, 24, 105, 0.65),
    inset 0 -2px 6px rgba(255, 255, 255, 0.3) !important;
}
.scroll-progress {
  background: linear-gradient(90deg, #2845EE, #7c3aed, #0ea5e9) !important;
}

/* 17. Responsive Touch Targets */
@media(max-width:768px){
  .vmc-card, .svc-card, .feat-card, .wc, .mentor-card, .coursera-card, .dc-card, 
  .project-card, .tc, .lead-card, .pos-item, .hr-box, .int-meta-item, .benefit-item, .cbox, .pb-stat, .org-card {
    border-radius: 32px !important;
    border: none !important;
  }
}

/* ─────────────────────────────────────────────────────────────
   18. PERFORMANCE OPTIMIZATIONS (Fast, Smooth 60fps Loading)
   ───────────────────────────────────────────────────────────── */

/* Modern Content-Visibility for Below-the-Fold Heavy Sections */
.dedicated-courses,
.partner,
.projects,
.team,
.lead-grid,
.hiring,
.internship,
.mentorship,
.footer {
  content-visibility: auto;
  contain-intrinsic-size: 1px 900px;
}

/* GPU Hardware Acceleration & Compositing for Silky 60fps Scrolling */
.cfab,
.cwin,
.ai-peeker,
.popup-box,
.back-to-top,
.svc-card,
.project-card,
.lead-card {
  transform: translateZ(0);
  -webkit-transform: translateZ(0);
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

/* Zero CLS image container stabilization */
.coursera-thumb,
.dc-card-thumb,
.project-banner {
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: rgba(15, 23, 42, 0.6);
}

.coursera-thumb img,
.dc-card-thumb img,
.project-banner img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Preloader video hardware decoding optimization */
#loadingVideo {
  will-change: transform;
  transform: translateZ(0);
  object-fit: cover;
}

/* ── MINIMALIST MODERN RECOMMENDATION SLIDE & CHIPS ── */
.int-rec-wrap {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-top: 6px;
  width: 100%;
  max-width: 100%;
  min-width: 0;
}
.int-rec-chips {
  display: flex;
  gap: 6px;
  overflow-x: auto;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  padding: 4px 2px 6px;
  scrollbar-width: none;
  -ms-overflow-style: none;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;
  touch-action: pan-x;
}
.int-rec-chips::-webkit-scrollbar {
  display: none;
}
.int-chip {
  padding: 5px 12px;
  background: var(--bg-cream-soft, #f8fafd);
  border: 1px solid var(--border-card, #e2e8f0);
  border-radius: 50px;
  font-size: 11.5px;
  font-weight: 600;
  color: #475569;
  cursor: pointer;
  white-space: nowrap;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
  user-select: none;
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}
.int-chip:hover {
  background: #ffffff;
  color: var(--blue, #2845EE);
  border-color: rgba(40, 69, 238, 0.4);
  transform: translateY(-1px);
}
.int-chip.is-active {
  background: linear-gradient(135deg, #2845EE 0%, #1d35c7 100%) !important;
  color: #ffffff !important;
  border-color: #2845EE !important;
  box-shadow: 0 4px 12px rgba(40, 69, 238, 0.28);
  font-weight: 700;
}

/* ── MODERN MINIMALIST CV UPLOAD COMPONENT ── */
.int-upload-box {
  position: relative;
  border: 1.5px dashed var(--border-card, #cbd5e1);
  border-radius: 14px;
  background: var(--bg-cream-soft, #f8fafd);
  padding: 10px 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  cursor: pointer;
  transition: all 0.2s ease;
}
.int-upload-box:hover {
  border-color: var(--blue, #2845EE);
  background: #ffffff;
}
.int-upload-box.has-file {
  border-color: #22c55e;
  background: rgba(34, 197, 94, 0.04);
}
.int-upload-left {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  flex: 1;
}
.int-upload-icon {
  width: 32px;
  height: 32px;
  border-radius: 9px;
  background: rgba(40, 69, 238, 0.08);
  color: var(--blue, #2845EE);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: all 0.2s ease;
}
.int-upload-box.has-file .int-upload-icon {
  background: rgba(34, 197, 94, 0.15);
  color: #16a34a;
}
.int-upload-text {
  min-width: 0;
  flex: 1;
}
.int-upload-title {
  font-size: 12px;
  font-weight: 700;
  color: #1e293b;
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.int-upload-sub {
  font-size: 10.5px;
  color: #94a3b8;
  display: block;
}
.int-upload-btn {
  padding: 5px 12px;
  background: #ffffff;
  border: 1px solid var(--border-card, #cbd5e1);
  border-radius: 50px;
  font-size: 11px;
  font-weight: 700;
  color: var(--text-dark, #0f172a);
  white-space: nowrap;
  flex-shrink: 0;
  cursor: pointer;
  transition: all 0.2s ease;
}
.int-upload-box:hover .int-upload-btn {
  background: var(--blue, #2845EE);
  color: #ffffff;
  border-color: var(--blue, #2845EE);
}
.int-remove-btn {
  display: none;
  background: rgba(239, 68, 68, 0.1);
  color: #ef4444;
  border: none;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  cursor: pointer;
  flex-shrink: 0;
  transition: all 0.2s ease;
}
.int-remove-btn:hover {
  background: #ef4444;
  color: #ffffff;
}
.int-upload-box.has-file .int-upload-btn {
  display: none;
}
.int-upload-box.has-file .int-remove-btn {
  display: flex;
}

/* ── DEDICATED MOBILE OPTIMIZATIONS FOR INTERNSHIP & ENROLLMENT MODALS ── */
@media (max-width: 768px) {
  .dc-modal-overlay {
    padding: 12px 10px !important;
    align-items: center !important;
    justify-content: center !important;
    overflow-x: hidden !important;
  }
  .dc-modal-container {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 auto !important;
  }
  .dc-modal-card {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    padding: 22px 16px !important;
    border-radius: 24px !important;
    max-height: 90vh !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    box-sizing: border-box !important;
    box-shadow: 0 16px 40px rgba(15, 23, 42, 0.32) !important;
    -webkit-overflow-scrolling: touch;
  }
  .dc-modal-head {
    margin-bottom: 16px !important;
    gap: 10px !important;
  }
  .dc-modal-title {
    font-size: 18px !important;
    line-height: 1.3 !important;
    word-break: break-word !important;
  }
  .dc-modal-close {
    width: 32px !important;
    height: 32px !important;
    flex-shrink: 0 !important;
  }
  .dc-enroll-form {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }
  .dc-form-grid {
    display: flex !important;
    flex-direction: column !important;
    gap: 13px !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin-bottom: 18px !important;
  }
  .dc-form-group,
  .dc-col-full {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    grid-column: auto !important;
  }
  .dc-form-label {
    font-size: 12.5px !important;
    font-weight: 700 !important;
    color: #1e293b !important;
    margin-bottom: 3px !important;
  }
  .dc-input-wrap {
    width: 100% !important;
    min-width: 0 !important;
  }
  .dc-form-input,
  .dc-form-select,
  .dc-form-textarea {
    font-size: 16px !important; /* Prevents auto-zoom on iOS Safari */
    padding: 11px 14px 11px 40px !important;
    min-width: 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
    border-radius: 14px !important;
    line-height: 1.35 !important;
  }
  .dc-input-icon {
    left: 13px !important;
  }
  /* Modern recommendation chips on mobile: wrap cleanly into pill tags */
  .int-rec-wrap {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-top: 6px !important;
  }
  .int-rec-chips {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
    overflow-x: visible !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    padding: 2px 0 4px !important;
  }
  .int-chip {
    white-space: normal !important;
    padding: 6px 12px !important;
    font-size: 11.5px !important;
    line-height: 1.25 !important;
    min-height: 32px !important;
    border-radius: 50px !important;
    flex-shrink: 0 !important;
  }
  /* Upload CV container mobile optimization */
  .int-upload-box {
    width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    padding: 10px 12px !important;
    gap: 10px !important;
  }
  .int-upload-left {
    min-width: 0 !important;
    flex: 1 !important;
    gap: 8px !important;
    overflow: hidden !important;
  }
  .int-upload-icon {
    width: 30px !important;
    height: 30px !important;
    flex-shrink: 0 !important;
  }
  .int-upload-text {
    min-width: 0 !important;
    flex: 1 !important;
    overflow: hidden !important;
  }
  .int-upload-title {
    font-size: 12px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    max-width: 160px !important;
  }
  .int-upload-sub {
    font-size: 10px !important;
  }
  .int-upload-btn {
    padding: 6px 12px !important;
    font-size: 11px !important;
    flex-shrink: 0 !important;
  }
  .btn-dc-submit-enroll {
    padding: 13px 20px !important;
    font-size: 15px !important;
    min-height: 48px !important;
    border-radius: 50px !important;
  }
  /* Success Card Receipt on mobile */
  .dc-receipt-box {
    padding: 14px !important;
    border-radius: 14px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
  .dc-receipt-row {
    font-size: 12.5px !important;
    gap: 6px !important;
    flex-wrap: wrap !important;
  }
  .dc-receipt-label {
    font-size: 12px !important;
  }
  .dc-receipt-id {
    font-size: 11.5px !important;
  }
  .btn-dc-success-wa {
    font-size: 13px !important;
    padding: 12px 14px !important;
  }
}

@media (max-width: 380px) {
  .dc-modal-overlay {
    padding: 8px 6px !important;
  }
  .dc-modal-card {
    padding: 18px 12px !important;
    border-radius: 20px !important;
  }
  .dc-modal-title {
    font-size: 16px !important;
  }
  .int-upload-title {
    max-width: 110px !important;
  }
  .int-chip {
    padding: 5px 9px !important;
    font-size: 11px !important;
  }
}

/* ══════════════════════════════════════════════════════════════════════════
   14. DEPARTMENT INTERNEES & TEAMS (MOBILE & PC SCROLLABLE BAR + SLIDER)
   ══════════════════════════════════════════════════════════════════════════ */
.dept-internees-section {
  margin-top: 54px;
  padding-top: 44px;
  border-top: 1.5px solid rgba(166, 175, 195, 0.3);
  position: relative;
}
.dept-header-wrap {
  text-align: center;
  max-width: 760px;
  margin: 0 auto 30px;
}
.dept-badge-glow {
  background: #ffffff !important;
  color: var(--blue, #2845EE) !important;
  border: 1px solid rgba(40, 69, 238, 0.18) !important;
  box-shadow: 0 4px 14px rgba(40, 69, 238, 0.12), -2px -2px 6px #ffffff !important;
  margin-bottom: 12px;
}
.dept-section-title {
  margin-bottom: 8px;
}

/* ── HORIZONTAL SCROLLABLE DEPARTMENT BAR ── */
.dept-bar-wrapper {
  position: relative;
  display: flex;
  align-items: center;
  max-width: 960px;
  margin: 0 auto 30px;
  padding: 6px;
  background: linear-gradient(145deg, #e4e8f0 0%, #edf1f8 100%);
  border-radius: 60px;
  box-shadow: inset 4px 4px 10px rgba(166, 175, 195, 0.42), inset -4px -4px 10px #ffffff;
  border: 1.5px solid rgba(255, 255, 255, 0.85);
  gap: 6px;
}
.dept-bar-scroll-btn {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  border: none;
  background: linear-gradient(145deg, #f2f5fb 0%, #e3e7f0 100%);
  color: var(--text-dark, #131826);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  flex-shrink: 0;
  box-shadow: 3px 4px 10px rgba(166, 175, 195, 0.35), -2px -2px 6px #ffffff;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
  z-index: 2;
  padding: 0;
}
.dept-bar-scroll-btn:hover {
  transform: scale(1.06);
  color: var(--blue, #2845EE);
  box-shadow: 4px 6px 14px rgba(40, 69, 238, 0.28), -2px -2px 6px #ffffff;
}
.dept-bar-scroll-btn:active {
  transform: scale(0.94);
}
.dept-scroll-bar {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  scroll-behavior: smooth;
  scrollbar-width: none;
  -ms-overflow-style: none;
  -webkit-overflow-scrolling: touch;
  padding: 4px 6px;
  width: 100%;
}
.dept-scroll-bar::-webkit-scrollbar {
  display: none;
}
.dept-tab {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 18px;
  border-radius: 50px;
  border: none;
  background: transparent;
  color: #4b5563;
  font-size: 13px;
  font-weight: 700;
  white-space: nowrap;
  cursor: pointer;
  transition: all 0.28s cubic-bezier(0.16, 1, 0.3, 1);
  user-select: none;
  flex-shrink: 0;
  box-shadow: none;
}
.dept-tab:hover {
  color: var(--blue, #2845EE);
  background: rgba(255, 255, 255, 0.6);
  transform: translateY(-1px);
}
.dept-tab.is-active {
  background: linear-gradient(135deg, #2845EE 0%, #1d35c7 100%) !important;
  color: #ffffff !important;
  box-shadow: 4px 6px 18px rgba(40, 69, 238, 0.38), 0 2px 6px rgba(0, 0, 0, 0.08) !important;
  transform: translateY(-1px);
}
.dept-tab-icon {
  font-size: 15px;
  line-height: 1;
}
.dept-tab-badge {
  font-size: 10.5px;
  padding: 3px 8px;
  border-radius: 20px;
  background: rgba(0, 0, 0, 0.07);
  color: inherit;
  font-weight: 700;
  transition: all 0.2s ease;
}
.dept-tab.is-active .dept-tab-badge {
  background: rgba(255, 255, 255, 0.24) !important;
  color: #ffffff !important;
}

/* ── CAROUSEL PERSPECTIVE & TRACK ── */
.dept-carousel-perspective {
  width: 100%;
  max-width: 1140px;
  margin: 0 auto;
  position: relative;
  overflow: hidden;
  border-radius: 34px;
}
.dept-slider-track {
  display: flex;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scroll-behavior: smooth;
  scrollbar-width: none;
  -ms-overflow-style: none;
  gap: 0;
  width: 100%;
  user-select: none;
}
.dept-slider-track::-webkit-scrollbar {
  display: none;
}
.dept-slide {
  flex: 0 0 100%;
  width: 100%;
  min-width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  scroll-snap-align: start;
  scroll-snap-stop: always;
  background: linear-gradient(145deg, #f2f5fb 0%, #e3e7f0 100%);
  border-radius: 34px;
  padding: 30px 28px 36px;
  box-shadow: 
    16px 20px 48px rgba(155, 168, 195, 0.46),
    6px 8px 18px rgba(155, 168, 195, 0.25),
    -8px -8px 28px rgba(255, 255, 255, 0.55),
    -4px -4px 12px rgba(255, 255, 255, 0.4);
  border: 1.5px solid rgba(255, 255, 255, 0.85);
  transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

/* Slide Header Bar */
.dept-card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 24px;
  padding-bottom: 18px;
  border-bottom: 1.5px solid rgba(166, 175, 195, 0.25);
  flex-wrap: wrap;
  gap: 12px;
}
.dept-banner-left {
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.dept-banner-badge {
  font-size: 18px;
  font-weight: 800;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #131826;
  letter-spacing: -0.3px;
}
.dept-banner-role {
  font-size: 12px;
  color: #556275;
  font-weight: 600;
}
.dept-pill-count {
  font-size: 12px;
  font-weight: 700;
  padding: 6px 16px;
  border-radius: 50px;
  background: #ffffff;
  color: var(--blue, #2845EE);
  box-shadow: 4px 6px 14px rgba(166, 175, 195, 0.3), -2px -2px 6px #ffffff;
  border: 1px solid rgba(255, 255, 255, 0.9);
}

/* ── MEMBERS GRID ── */
.dept-members-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

/* Internee Card */
.internee-card {
  background: linear-gradient(145deg, #ffffff 0%, #f4f7fc 100%);
  border-radius: 22px;
  padding: 20px 18px;
  display: flex;
  align-items: center;
  gap: 15px;
  box-shadow: 6px 8px 18px rgba(166, 175, 195, 0.28), -4px -4px 12px #ffffff;
  border: 1.5px solid rgba(255, 255, 255, 0.95);
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
  position: relative;
  overflow: hidden;
}
.internee-card:hover {
  transform: translateY(-5px);
  box-shadow: 12px 18px 32px rgba(155, 168, 195, 0.42), -6px -6px 18px #ffffff;
  border-color: rgba(40, 69, 238, 0.35);
}
.internee-avatar {
  width: 52px;
  height: 52px;
  border-radius: 17px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  font-weight: 800;
  color: #ffffff;
  flex-shrink: 0;
  position: relative;
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.12);
  letter-spacing: 0.5px;
}
.av-creative { background: linear-gradient(135deg, #8B5CF6 0%, #EC4899 100%); }
.av-technical { background: linear-gradient(135deg, #2563EB 0%, #06B6D4 100%); }
.av-media { background: linear-gradient(135deg, #F59E0B 0%, #EF4444 100%); }
.av-researcher { background: linear-gradient(135deg, #10B981 0%, #059669 100%); }

.internee-pulse-dot {
  position: absolute;
  top: -2px;
  right: -2px;
  width: 11px;
  height: 11px;
  background: #10B981;
  border: 2px solid #ffffff;
  border-radius: 50%;
  box-shadow: 0 0 8px #10B981;
}
.internee-details {
  display: flex;
  flex-direction: column;
  gap: 3px;
  overflow: hidden;
  flex: 1;
}
.internee-name {
  font-size: 15px;
  font-weight: 800;
  color: #131826;
  letter-spacing: 0.3px;
  margin: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-transform: uppercase;
}
.internee-role {
  font-size: 11.5px;
  color: #556275;
  font-weight: 600;
  margin: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.internee-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 5px;
}
.itag {
  font-size: 10.5px;
  font-weight: 700;
  padding: 3px 9px;
  border-radius: 50px;
  display: inline-block;
  white-space: nowrap;
}
.itag-creative { background: #ede9fe; color: #7c3aed; }
.itag-technical { background: #dbeafe; color: #1d4ed8; }
.itag-media { background: #ffedd5; color: #c2410c; }
.itag-researcher { background: #d1fae5; color: #047857; }

/* ── CAROUSEL ARROWS & DOTS ── */
.dept-carousel-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  margin-top: 24px;
}
.dept-nav-arrow {
  width: 42px !important;
  height: 42px !important;
  border-radius: 50% !important;
  background: linear-gradient(145deg, #f2f5fb 0%, #e3e7f0 100%) !important;
  color: var(--text-dark, #131826) !important;
  border: 1.5px solid rgba(255, 255, 255, 0.9) !important;
  box-shadow: 4px 6px 14px rgba(166, 175, 195, 0.35), -3px -3px 8px #ffffff !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
  padding: 0 !important;
}
.dept-nav-arrow:hover {
  transform: scale(1.08) !important;
  color: var(--blue, #2845EE) !important;
  box-shadow: 6px 8px 18px rgba(40, 69, 238, 0.28), -3px -3px 8px #ffffff !important;
}
.dept-nav-arrow:active {
  transform: scale(0.92) !important;
}
.dept-dots {
  display: flex;
  align-items: center;
  gap: 8px;
}

/* ── RESPONSIVE DESIGN (TABLET & MOBILE) ── */
@media (min-width: 769px) and (max-width: 1040px) {
  .dept-members-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
  }
}
@media (max-width: 768px) {
  .dept-internees-section {
    margin-top: 42px;
    padding-top: 36px;
  }
  .dept-bar-wrapper {
    max-width: 100%;
    border-radius: 30px;
    padding: 5px;
    margin-bottom: 22px;
  }
  .dept-bar-scroll-btn {
    display: none !important;
  }
  .dept-tab {
    padding: 8px 14px;
    font-size: 12px;
    gap: 6px;
  }
  .dept-tab-text {
    font-size: 12px;
  }
  .dept-tab-badge {
    font-size: 10px;
    padding: 2px 7px;
  }
  .dept-carousel-perspective {
    border-radius: 26px;
    margin: 0 -8px;
    width: calc(100% + 16px);
  }
  .dept-slide {
    border-radius: 26px;
    padding: 22px 16px 26px;
  }
  .dept-card-header {
    margin-bottom: 18px;
    padding-bottom: 14px;
  }
  .dept-banner-badge {
    font-size: 16px;
  }
  .dept-members-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
  }
  .internee-card {
    padding: 14px 12px;
    gap: 10px;
    border-radius: 18px;
  }
  .internee-avatar {
    width: 44px;
    height: 44px;
    font-size: 14px;
    border-radius: 14px;
  }
  .internee-name {
    font-size: 13px;
  }
  .internee-role {
    font-size: 10.5px;
  }
  .itag {
    font-size: 9.5px;
    padding: 2px 7px;
  }
}
@media (max-width: 520px) {
  .dept-members-grid {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .internee-card {
    padding: 12px 12px;
  }
}