/* POWERTECH+ Theme */
:root{--brand-blue:#0d6efd;--brand-orange:#ff7a00}
body{font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif}
.btn-warning{--bs-btn-bg:var(--brand-orange);--bs-btn-border-color:var(--brand-orange)}
.btn-outline-warning{--bs-btn-color:var(--brand-orange);--bs-btn-border-color:var(--brand-orange)}
.text-primary{color:var(--brand-blue)!important}
.bg-primary{background-color:var(--brand-blue)!important}
.badge.bg-primary-subtle{background:#e8f0fe}
.card{border-radius:12px}
.navbar-brand{letter-spacing:.3px}

/* Decorative, image-free hero banners */
.hero{--start:#0d6efd;--end:#6f42c1;position:relative;color:#fff;background:
linear-gradient(135deg,var(--start),var(--end));
overflow:hidden}
.hero .container{position:relative;z-index:2}
/* soft pattern */
.hero::before{content:"";position:absolute;inset:0;background-image:
linear-gradient(transparent 0,rgba(255,255,255,.06) 1px),
linear-gradient(90deg,transparent 0,rgba(255,255,255,.06) 1px);
background-size:24px 24px;opacity:.35}
/* bottom wave */
.hero::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:60px;background-repeat:no-repeat;background-size:100% 60px;background-position:bottom center;
background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 120' preserveAspectRatio='none'><path fill='%23ffffff' d='M0,64L60,80C120,96,240,128,360,122.7C480,117,600,75,720,58.7C840,43,960,53,1080,69.3C1200,85,1320,107,1380,117.3L1440,128L1440,0L1380,0C1320,0,1200,0,1080,0C960,0,840,0,720,0C600,0,480,0,360,0C240,0,120,0,60,0L0,0Z'/></svg>")}

/* Color variants */
.hero--contact{--start:#0d6efd;--end:#20c997}
.hero--inscription{--start:#6f42c1;--end:#d63384}
.hero--formations{--start:#0d6efd;--end:#6610f2}
.hero--about{--start:#20c997;--end:#0d6efd}

/* Elevate cards and sections a bit */
.card.shadow-sm{box-shadow:0 .5rem 1rem rgba(0,0,0,.06)!important}
.section-divider{height:1px;background:linear-gradient(90deg,transparent,rgba(0,0,0,.08),transparent)}

/* Alternate animated hero design */
.hero-alt{--start:#0d6efd;--mid:#6f42c1;--end:#d63384;position:relative;color:#111;overflow:hidden;background:radial-gradient(1200px 600px at -10% -20%,rgba(255,255,255,.35),transparent 60%),
radial-gradient(900px 500px at 110% 10%,rgba(255,255,255,.35),transparent 60%),
linear-gradient(120deg,var(--start),var(--mid),var(--end));}
.hero-alt .container{position:relative;z-index:3}
.hero-alt::before,.hero-alt::after{content:"";position:absolute;border-radius:50%;filter:blur(40px);opacity:.35}
.hero-alt::before{width:280px;height:280px;left:-60px;top:-60px;background:rgba(255,255,255,.7);animation:float1 10s ease-in-out infinite}
.hero-alt::after{width:360px;height:360px;right:-80px;bottom:-80px;background:rgba(0,0,0,.12);animation:float2 12s ease-in-out infinite}
.hero-alt .edge{position:absolute;left:0;right:0;bottom:-1px;height:80px;background:linear-gradient(to right,rgba(255,255,255,.6),rgba(255,255,255,1));clip-path:polygon(0 40%,100% 0,100% 100%,0 100%);z-index:2}
@keyframes float1{0%,100%{transform:translateY(0)}50%{transform:translateY(20px)}}
@keyframes float2{0%,100%{transform:translateY(0)}50%{transform:translateY(-20px)}}

.hero-alt--contact{--start:#20c997;--mid:#0d6efd;--end:#6f42c1}
.hero-alt--inscription{--start:#6f42c1;--mid:#d63384;--end:#fd7e14}
.hero-alt--formations{--start:#0d6efd;--mid:#6610f2;--end:#20c997}
.hero-alt--about{--start:#20c997;--mid:#0d6efd;--end:#6f42c1}
/* Program-specific variants */
.hero-alt--ceiamp{--start:#0d6efd;--mid:#20c997;--end:#198754}
.hero-alt--ceiacm{--start:#6f42c1;--mid:#d63384;--end:#0d6efd}
.hero-alt--ceiasi{--start:#0d6efd;--mid:#6610f2;--end:#0dcaf0}
/* Homepage variant */
.hero-alt--home{--start:#0d6efd;--mid:#20c997;--end:#6f42c1}

/* Glassmorphism cards */
.glass-card{background:rgba(255,255,255,.55)!important;border:1px solid rgba(255,255,255,.4)!important;box-shadow:0 .75rem 2rem rgba(0,0,0,.08);backdrop-filter:saturate(160%) blur(12px);-webkit-backdrop-filter:saturate(160%) blur(12px)}
.glass-card .card-body{background:transparent}

/* Glass navbar */
.navbar.glass-nav{background:rgba(255,255,255,.6)!important;border-bottom:1px solid rgba(0,0,0,.06)!important;backdrop-filter:saturate(160%) blur(10px);-webkit-backdrop-filter:saturate(160%) blur(10px)}
.navbar.glass-nav .nav-link{color:#111;opacity:.85}
.navbar.glass-nav .nav-link:hover,.navbar.glass-nav .nav-link:focus{opacity:1}
.navbar.glass-nav .nav-link.active{position:relative;font-weight:600}
.navbar.glass-nav .nav-link.active::after{content:"";position:absolute;left:.5rem;right:.5rem;bottom:-.35rem;height:2px;background:var(--brand-blue);border-radius:2px}

/* AI-style hero for homepage */
.ai-hero{position:relative;background:linear-gradient(180deg,#f8fbff, #ffffff);overflow:hidden}
.ai-hero .container{position:relative;z-index:2}
.ai-network{position:absolute;inset:0;z-index:1;opacity:.9;pointer-events:none}
.ai-network .grid-line{stroke:#e6f0ff;stroke-width:1}
.ai-network .link{stroke:#8cb8ff;stroke-width:1.5;stroke-linecap:round;fill:none;stroke-dasharray:6 10;animation:dash 6s linear infinite}
.ai-network .link.alt{stroke:#67d4c9;animation-duration:8s}
.ai-network .node{fill:#0d6efd;filter:drop-shadow(0 0 6px rgba(13,110,253,.6));animation:pulse 3.5s ease-in-out infinite}
.ai-network .node.alt{fill:#20c997;animation-duration:4.5s}
@keyframes dash{to{stroke-dashoffset:-200}}
@keyframes pulse{0%,100%{opacity:.6;r:2.2}50%{opacity:1;r:3.4}}

/* New animated gradient hero (clean IA vibe) */
.hero-animated{position:relative;color:#111;overflow:hidden;isolation:isolate;
background:
radial-gradient(1200px 600px at 10% -20%, rgba(255,255,255,.5), transparent 60%),
radial-gradient(900px 500px at 90% 0%, rgba(255,255,255,.35), transparent 60%),
linear-gradient(120deg, #ffffff, #f7f9fc, #ffffff);
background-size:120% 120%;
animation:heroGradientShift 16s ease-in-out infinite alternate}
.hero-animated .container{position:relative;z-index:3}
.hero-animated::before{content:"";position:absolute;inset:-20%;background:conic-gradient(from 0deg, rgba(255,255,255,.0), rgba(255,255,255,.25), rgba(255,255,255,.0) 70%);filter:blur(60px);mix-blend-mode:soft-light;animation:heroRotate 28s linear infinite}
.hero-animated::after{content:"";position:absolute;left:-10%;top:-10%;width:120%;height:120%;background:
radial-gradient(200px 200px at 20% 30%, rgba(255,255,255,.35), transparent 60%),
radial-gradient(260px 260px at 80% 25%, rgba(255,255,255,.25), transparent 60%);
animation:heroDrift 20s ease-in-out infinite alternate}
.hero-animated .edge{position:absolute;left:0;right:0;bottom:-1px;height:80px;background:linear-gradient(to right,rgba(255,255,255,.6),rgba(255,255,255,1));clip-path:polygon(0 40%,100% 0,100% 100%,0 100%);z-index:2}
@keyframes heroGradientShift{0%{background-position:0% 0%}100%{background-position:100% 100%}}
@keyframes heroRotate{to{transform:rotate(360deg)}}
@keyframes heroDrift{0%{transform:translateY(0)}100%{transform:translateY(18px)}}

/* Dark variant for homepage hero */
.hero-animated.hero-dark{background:linear-gradient(180deg,#000,#000)}

/* Floating glass shapes */
.hero-shape{position:absolute;z-index:2;border-radius:12px;background:rgba(255,255,255,.25);border:1px solid rgba(255,255,255,.45);box-shadow:0 .75rem 2rem rgba(0,0,0,.06);backdrop-filter:saturate(160%) blur(10px);-webkit-backdrop-filter:saturate(160%) blur(10px)}
.hero-shape.s1{width:50px;height:50px;left:4%;top:18%;transform:rotate(-6deg);animation:floatA 9s ease-in-out infinite}
.hero-shape.s2{width:72px;height:34px;left:70%;top:26%;transform:rotate(8deg);animation:floatB 11s ease-in-out infinite}
.hero-shape.s3{width:36px;height:36px;left:86%;top:50%;border-radius:50%;animation:floatC 10s ease-in-out infinite}
/* extra small floating squares/circles */
.hero-shape.s4{width:32px;height:32px;left:15%;top:42%;animation:floatA 10s ease-in-out infinite reverse}
.hero-shape.s5{width:28px;height:28px;left:58%;top:18%;animation:floatB 12s ease-in-out infinite reverse}
.hero-shape.s6{width:40px;height:22px;left:78%;top:58%;transform:rotate(-4deg);animation:floatC 13s ease-in-out infinite reverse}
.hero-shape.s7{width:24px;height:24px;left:32%;top:28%;border-radius:50%;animation:floatB 9s ease-in-out infinite}
.hero-shape.s8{width:44px;height:44px;left:8%;top:65%;animation:floatA 12s ease-in-out infinite}
@keyframes floatA{0%,100%{transform:translateY(0) rotate(-6deg)}50%{transform:translateY(10px) rotate(-3deg)}}
@keyframes floatB{0%,100%{transform:translateY(0) rotate(8deg)}50%{transform:translateY(-12px) rotate(12deg)}}
@keyframes floatC{0%,100%{transform:translateY(0)}50%{transform:translateY(12px)}}

/* tiny glowing dots "un peu partout" */
.hero-dot{position:absolute;z-index:1;width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.85);box-shadow:0 0 10px rgba(255,255,255,.6),0 0 20px rgba(255,255,255,.35);opacity:.8;animation:twinkle 3.6s ease-in-out infinite}
.hero-dot.d1{left:12%;top:22%;animation-delay:.2s}
.hero-dot.d2{left:28%;top:12%;animation-delay:.8s}
.hero-dot.d3{left:44%;top:34%;animation-delay:1.4s}
.hero-dot.d4{left:62%;top:16%;animation-delay:.5s}
.hero-dot.d5{left:76%;top:40%;animation-delay:1.1s}
.hero-dot.d6{left:88%;top:20%;animation-delay:1.9s}
.hero-dot.d7{left:22%;top:58%;animation-delay:2.2s}
.hero-dot.d8{left:54%;top:52%;animation-delay:2.8s}
@keyframes twinkle{0%,100%{opacity:.3;transform:scale(.9)}50%{opacity:1;transform:scale(1.1)}}