:root {
    --bg: #050505;
    --bg-soft: #0A0A0A;
    --card: #141414;
    --border: rgba(255,255,255,0.08);
    --text: #FFFFFF;
    --muted: #B8B8B8;
    --blue: #3B82F6;
    --purple: #7C3AED;
    --green: #10B981;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
    margin: 0;
    font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    background:
        linear-gradient(180deg, rgba(5,5,5,0.78), rgba(5,5,5,0.94)),
        url('../images/ai-consulting-hero.png') center top / cover fixed,
        linear-gradient(180deg, var(--bg), var(--bg-soft) 45%, var(--bg));
    color: var(--text);
    letter-spacing: 0;
}

a { color: var(--text); text-decoration: none; }
a:hover { color: var(--blue); }
p { color: var(--muted); line-height: 1.75; }
h1, h2, h3, h4, h5, h6 { letter-spacing: 0; font-weight: 800; }

.nav-glass {
    background: rgba(5,5,5,0.58);
    border-bottom: 1px solid var(--border);
    backdrop-filter: blur(18px);
}
.navbar-toggler { border-color: var(--border); }
.navbar-toggler-icon { filter: invert(1); }
.nav-link { color: rgba(255,255,255,0.76); font-weight: 600; font-size: 0.92rem; }
.nav-link:hover, .nav-link.active { color: #fff; }

.brand-mark {
    display: inline-flex;
    align-items: center;
    gap: 0.72rem;
    color: #fff;
    font-weight: 900;
    letter-spacing: 0;
}
.logo-mark {
    width: 2.65rem;
    height: 2.65rem;
    flex: 0 0 auto;
    filter: drop-shadow(0 0 18px rgba(59,130,246,0.34));
}
.brand-text {
    color: #fff;
    line-height: 1;
    white-space: nowrap;
}
.navbar-brand .brand-text {
    font-size: 1.02rem;
}

.btn { border-radius: 0.55rem; font-weight: 700; }
.btn-premium {
    color: #fff;
    background: linear-gradient(135deg, var(--blue), var(--purple));
    border: 1px solid rgba(255,255,255,0.12);
    box-shadow: 0 15px 44px rgba(59,130,246,0.25);
}
.btn-premium:hover { color: #fff; transform: translateY(-1px); box-shadow: 0 18px 54px rgba(124,58,237,0.32); }
.btn-outline-light { border-color: rgba(255,255,255,0.22); color: #fff; }

.hero {
    min-height: 100vh;
    display: flex;
    align-items: center;
    position: relative;
    overflow: hidden;
    padding: 9rem 0 5rem;
}
#particleCanvas { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0.75; }
.hero-content { position: relative; z-index: 1; }
.hero h1, .page-hero h1 {
    font-size: clamp(3rem, 7vw, 6.8rem);
    line-height: 0.95;
    max-width: 950px;
}
.hero-copy { font-size: 1.18rem; max-width: 780px; }
.eyebrow {
    color: var(--green);
    text-transform: uppercase;
    letter-spacing: 0.14rem;
    font-weight: 800;
    font-size: 0.76rem;
    margin-bottom: 1rem;
}

.section-pad { padding: 6.5rem 0; }
.surface-band {
    background: linear-gradient(180deg, rgba(255,255,255,0.025), rgba(255,255,255,0.01));
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
}
.section-head { max-width: 760px; margin-bottom: 2.5rem; }
.section-head h2, .cta-band h2 { font-size: clamp(2rem, 4vw, 3.6rem); }

.glass-card, .dashboard-preview, .quote-card {
    position: relative;
    background: linear-gradient(180deg, rgba(255,255,255,0.055), rgba(255,255,255,0.025)), var(--card);
    border: 1px solid var(--border);
    border-radius: 0.75rem;
    padding: 1.6rem;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.06), 0 24px 70px rgba(0,0,0,0.28);
}
.glass-card::before {
    content: "";
    position: absolute;
    inset: -1px;
    border-radius: inherit;
    padding: 1px;
    background: linear-gradient(135deg, rgba(59,130,246,0.38), rgba(124,58,237,0), rgba(16,185,129,0.25));
    mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    mask-composite: exclude;
    pointer-events: none;
}
.glass-card:hover { transform: translateY(-4px); box-shadow: 0 30px 90px rgba(59,130,246,0.12); }
.glass-card h2 { font-size: 1.35rem; }
.glass-card h3 { font-size: 1.15rem; }

.icon-pill {
    width: 3rem;
    height: 3rem;
    display: grid;
    place-items: center;
    border-radius: 0.65rem;
    color: #fff;
    font-weight: 900;
    background: rgba(59,130,246,0.16);
    border: 1px solid rgba(59,130,246,0.35);
    margin-bottom: 1.2rem;
}

.dashboard-preview {
    min-height: 460px;
    overflow: hidden;
}
.dash-top { display: flex; gap: 0.45rem; margin-bottom: 1rem; }
.dash-top span { width: 0.75rem; height: 0.75rem; border-radius: 50%; background: rgba(255,255,255,0.25); }
.dash-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.metric-card, .chart-card {
    min-height: 132px;
    border-radius: 0.65rem;
    border: 1px solid var(--border);
    background: rgba(255,255,255,0.04);
    padding: 1rem;
}
.metric-card small { color: var(--muted); }
.metric-card strong { display: block; font-size: 2.2rem; margin-top: 0.45rem; }
.chart-card { grid-column: span 2; min-height: 160px; display: flex; align-items: end; overflow: hidden; }
.mini-line, .chart-wave {
    width: 100%;
    height: 54px;
    background: linear-gradient(135deg, transparent 25%, rgba(59,130,246,0.7), rgba(16,185,129,0.7));
    clip-path: polygon(0 78%, 15% 50%, 32% 60%, 50% 28%, 70% 46%, 100% 12%, 100% 100%, 0 100%);
    animation: floatLine 4s ease-in-out infinite;
}
.mini-bars { display: flex; align-items: end; gap: 0.35rem; height: 52px; }
.mini-bars i { flex: 1; border-radius: 0.3rem; background: linear-gradient(var(--purple), var(--blue)); animation: bars 2.6s ease-in-out infinite; }
.mini-bars i:nth-child(1) { height: 35%; }
.mini-bars i:nth-child(2) { height: 70%; animation-delay: 0.2s; }
.mini-bars i:nth-child(3) { height: 52%; animation-delay: 0.4s; }
.mini-bars i:nth-child(4) { height: 86%; animation-delay: 0.6s; }
.pulse-dot { width: 2rem; height: 2rem; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 0 rgba(16,185,129,0.42); animation: pulse 1.8s infinite; }

.industry-cloud { display: flex; flex-wrap: wrap; gap: 1rem; }
.industry-cloud span, .tag {
    display: inline-flex;
    border: 1px solid var(--border);
    background: rgba(255,255,255,0.045);
    border-radius: 999px;
    padding: 0.75rem 1rem;
    color: #fff;
    font-weight: 700;
}
.tag { color: var(--green); padding: 0.35rem 0.7rem; font-size: 0.75rem; margin-bottom: 1rem; }

.stats-strip {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    border: 1px solid var(--border);
    border-radius: 0.75rem;
    overflow: hidden;
    background: rgba(255,255,255,0.035);
}
.stats-strip div { padding: 2rem; border-right: 1px solid var(--border); }
.stats-strip div:last-child { border-right: 0; }
.stats-strip strong { display: block; font-size: 3rem; color: #fff; }
.stats-strip span { color: var(--muted); }
.result { color: var(--green); }

.timeline { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; }
.timeline-item { border-top: 1px solid rgba(59,130,246,0.48); padding-top: 1.4rem; }
.timeline-item span { color: var(--blue); font-weight: 900; }
.quote-card { min-height: 230px; font-size: 1.2rem; line-height: 1.7; }
.quote-card span { display: block; color: var(--green); font-size: 0.9rem; margin-top: 1.2rem; }

.page-hero {
    padding: 11rem 0 5rem;
    background: linear-gradient(135deg, rgba(59,130,246,0.12), rgba(124,58,237,0.08), rgba(5,5,5,0.92));
    border-bottom: 1px solid var(--border);
}
.page-hero p { max-width: 820px; font-size: 1.1rem; }
.contact-line { border-top: 1px solid var(--border); padding-top: 1rem; margin-top: 1rem; display: grid; gap: 0.3rem; }
.contact-line span { color: var(--muted); }

.form-control, .form-select {
    background: rgba(255,255,255,0.06);
    border: 1px solid var(--border);
    color: #fff;
    min-height: 3.1rem;
}
.form-control:focus, .form-select:focus { background: rgba(255,255,255,0.08); color: #fff; border-color: var(--blue); box-shadow: 0 0 0 0.2rem rgba(59,130,246,0.18); }
.form-select option { background: #111; }
label { color: #fff; font-weight: 700; margin-bottom: 0.45rem; }

.cta-band { background: linear-gradient(135deg, rgba(59,130,246,0.16), rgba(124,58,237,0.12)); border-top: 1px solid var(--border); }
.footer { padding: 4rem 0 2rem; background: #050505; border-top: 1px solid var(--border); }
.footer a { display: block; color: var(--muted); margin-bottom: 0.55rem; }
.footer h6 { color: #fff; margin-bottom: 1rem; }
.footer-brand { display: inline-flex !important; color: #fff !important; }`r`n.footer-brand .logo-mark { width: 3rem; height: 3rem; }
.footer-bottom { border-top: 1px solid var(--border); margin-top: 3rem; padding-top: 1.5rem; display: flex; justify-content: space-between; gap: 1rem; color: var(--muted); }

.reveal { opacity: 0; transform: translateY(20px); transition: 0.75s ease; }
.reveal.in-view { opacity: 1; transform: translateY(0); }

.admin-auth, .admin-page { min-height: 100vh; background: #050505; }
.admin-auth { display: grid; place-items: center; padding: 1rem; }
.login-card { width: min(100%, 430px); }
.login-card h1 { font-size: 2rem; margin-bottom: 1.5rem; }
.admin-shell { display: grid; grid-template-columns: 280px 1fr; min-height: 100vh; }
.admin-shell aside { border-right: 1px solid var(--border); padding: 1.5rem; background: rgba(255,255,255,0.025); }
.admin-shell nav { display: grid; gap: 0.7rem; margin-top: 2rem; }
.admin-shell nav a { color: var(--muted); padding: 0.85rem 1rem; border-radius: 0.55rem; }
.admin-shell nav a.active, .admin-shell nav a:hover { color: #fff; background: rgba(59,130,246,0.14); }
.admin-shell main { padding: 2rem; }
.admin-top { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-bottom: 2rem; }
.stat-admin strong { display: block; font-size: 3rem; }
.stat-admin span, .inquiry-meta { color: var(--muted); }
.table { --bs-table-bg: transparent; }
.inquiry-card.unread { border-color: rgba(16,185,129,0.38); }
.inquiry-meta { display: flex; flex-wrap: wrap; gap: 0.7rem; font-size: 0.9rem; }

@keyframes floatLine { 50% { transform: translateY(-8px); } }
@keyframes bars { 50% { transform: scaleY(0.72); } }
@keyframes pulse { 70% { box-shadow: 0 0 0 18px rgba(16,185,129,0); } 100% { box-shadow: 0 0 0 0 rgba(16,185,129,0); } }

@media (max-width: 991px) {
    .navbar-collapse { padding: 1rem 0; }
    .hero { padding-top: 8rem; }
    .stats-strip, .timeline, .admin-shell { grid-template-columns: 1fr; }
    .stats-strip div { border-right: 0; border-bottom: 1px solid var(--border); }
    .stats-strip div:last-child { border-bottom: 0; }
    .admin-shell aside { border-right: 0; border-bottom: 1px solid var(--border); }
}

@media (max-width: 576px) {
    .section-pad { padding: 4.5rem 0; }
    .hero h1, .page-hero h1 { font-size: 3rem; }
    .dash-grid { grid-template-columns: 1fr; }
    .chart-card { grid-column: span 1; }
    .footer-bottom, .admin-top { flex-direction: column; align-items: flex-start; }
}

.service-card {
    overflow: hidden;
    display: flex;
    flex-direction: column;
}
.service-card > h2,
.service-card > h3,
.service-card > p,
.service-card > a {
    position: relative;
    z-index: 2;
}
.service-card a {
    color: #fff;
    font-weight: 800;
    margin-top: auto;
}
.service-visual {
    position: relative;
    z-index: 1;
    width: 100%;
    aspect-ratio: 2 / 1;
    min-height: 150px;
    margin: -0.35rem -0.35rem 1.35rem;
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 0.7rem;
    overflow: hidden;
    background:
        linear-gradient(135deg, rgba(59,130,246,0.12), rgba(124,58,237,0.09), rgba(16,185,129,0.055)),
        rgba(255,255,255,0.025);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.05), 0 18px 46px rgba(0,0,0,0.22);
}
.service-card.compact .service-visual {
    min-height: 118px;
    margin-bottom: 1.15rem;
}
.service-visual::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.11), transparent);
    transform: translateX(-115%);
    animation: svcScan 5s ease-in-out infinite;
    pointer-events: none;
}
.service-visual::after {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 74% 40%, color-mix(in srgb, var(--service-accent) 28%, transparent), transparent 38%);
    opacity: 0.9;
    pointer-events: none;
}
.service-visual svg {
    position: relative;
    z-index: 1;
    width: 100%;
    height: 100%;
    display: block;
}
.svc-line {
    stroke-dasharray: 18 16;
    animation: svcDash 4.8s linear infinite;
}
.svc-line-b {
    animation-duration: 6.4s;
    animation-direction: reverse;
}
.svc-bars rect {
    transform-box: fill-box;
    transform-origin: center bottom;
    animation: svcBars 2.6s ease-in-out infinite;
}
.svc-bars rect:nth-child(2) { animation-delay: 0.2s; }
.svc-bars rect:nth-child(3) { animation-delay: 0.4s; }
.svc-bars rect:nth-child(4) { animation-delay: 0.6s; }
.svc-orbit {
    transform-box: fill-box;
    transform-origin: center;
    animation: svcOrbit 9s linear infinite;
}
.svc-core {
    filter: drop-shadow(0 0 10px var(--service-accent));
    animation: svcPulse 1.9s ease-in-out infinite;
}
.svc-nodes circle {
    filter: drop-shadow(0 0 8px rgba(59,130,246,0.6));
    animation: svcNode 2.7s ease-in-out infinite;
}
.svc-nodes circle:nth-child(2) { animation-delay: 0.25s; }
.svc-nodes circle:nth-child(3) { animation-delay: 0.5s; }
.svc-nodes circle:nth-child(4) { animation-delay: 0.75s; }
.svc-nodes circle:nth-child(5) { animation-delay: 1s; }
.service-visual-1 .svc-bars rect { animation-duration: 3.2s; }
.service-visual-2 .svc-orbit { animation-duration: 7.4s; }
.service-visual-3 .svc-line { animation-duration: 3.8s; }
.service-visual-4 .svc-nodes circle { animation-duration: 2.1s; }
.service-visual-5::before { animation-duration: 4.1s; }

@keyframes svcScan {
    0%, 42% { transform: translateX(-115%); opacity: 0; }
    52% { opacity: 1; }
    72%, 100% { transform: translateX(115%); opacity: 0; }
}
@keyframes svcDash { to { stroke-dashoffset: -136; } }
@keyframes svcBars {
    0%, 100% { transform: scaleY(0.68); opacity: 0.72; }
    50% { transform: scaleY(1); opacity: 1; }
}
@keyframes svcOrbit { to { transform: rotate(360deg); } }
@keyframes svcPulse {
    0%, 100% { transform: scale(1); opacity: 0.84; }
    50% { transform: scale(1.35); opacity: 1; }
}
@keyframes svcNode {
    0%, 100% { opacity: 0.5; transform: scale(0.86); }
    50% { opacity: 1; transform: scale(1.25); }
}

@media (prefers-reduced-motion: reduce) {
    .service-visual::before,
    .svc-line,
    .svc-bars rect,
    .svc-orbit,
    .svc-core,
    .svc-nodes circle {
        animation: none;
    }
}

@media (max-width: 576px) {
    .service-visual {
        min-height: 132px;
    }
    .service-card.compact .service-visual {
        min-height: 118px;
    }
}
.svc-target,
.svc-gear,
.svc-spark,
.svc-workshop circle {
    transform-box: fill-box;
    transform-origin: center;
}
.svc-target { animation: svcFloat 4.4s ease-in-out infinite; }
.svc-panels rect,
.svc-chat rect,
.svc-flow rect,
.svc-pipeline ellipse,
.svc-pipeline path,
.svc-workshop rect {
    animation: svcPanelGlow 3.8s ease-in-out infinite;
}
.svc-panels rect:nth-child(2),
.svc-chat rect:nth-child(2),
.svc-flow rect:nth-child(2) { animation-delay: 0.35s; }
.svc-panels rect:nth-child(3),
.svc-flow rect:nth-child(3) { animation-delay: 0.7s; }
.svc-chat { animation: svcFloat 5s ease-in-out infinite; }
.svc-spark { animation: svcSpark 2.4s ease-in-out infinite; transform-box: fill-box; transform-origin: center; }
.svc-flow rect { transform-box: fill-box; transform-origin: center; }
.svc-flow rect:nth-child(1) { animation-delay: 0s; }
.svc-flow rect:nth-child(2) { animation-delay: 0.35s; }
.svc-flow rect:nth-child(3) { animation-delay: 0.7s; }
.svc-gear { animation: svcOrbit 6.5s linear infinite; }
.svc-pipeline { animation: svcFloat 4.8s ease-in-out infinite; }
.svc-network circle { animation-duration: 2.25s; }
.service-visual-dashboard .svc-bars rect { animation-duration: 2.1s; }
.service-visual-training .svc-workshop circle { animation: svcNode 2.5s ease-in-out infinite; }
.service-visual-training .svc-workshop circle:nth-child(2) { animation-delay: 0.35s; }
.service-visual-training .svc-workshop circle:nth-child(3) { animation-delay: 0.7s; }

@keyframes svcFloat {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}
@keyframes svcPanelGlow {
    0%, 100% { opacity: 0.72; }
    50% { opacity: 1; }
}
@keyframes svcSpark {
    0%, 100% { opacity: 0.72; transform: scale(0.94) rotate(0deg); }
    50% { opacity: 1; transform: scale(1.08) rotate(6deg); }
}
/* Mugah DeepTech Academy */
.academy-body { background-attachment: fixed; }
.academy-hero { min-height: 92vh; display:flex; align-items:center; padding:9rem 0 5rem; border-bottom:1px solid var(--border); }
.academy-hero h1 { font-size: clamp(3rem, 6vw, 6.2rem); line-height:.96; max-width: 980px; }
.academy-hero p { max-width: 780px; font-size: 1.12rem; }
.academy-orb-card { min-height: 420px; border:1px solid var(--border); border-radius:.85rem; background:linear-gradient(145deg, rgba(59,130,246,.12), rgba(124,58,237,.09), rgba(16,185,129,.06)); position:relative; overflow:hidden; display:grid; place-items:center; box-shadow:0 30px 90px rgba(0,0,0,.3); }
.academy-orb-card span { position:absolute; border:1px solid rgba(255,255,255,.14); padding:.8rem 1rem; border-radius:999px; background:rgba(255,255,255,.055); font-weight:800; animation: academyFloat 5s ease-in-out infinite; }
.academy-orb-card span:nth-child(1){top:18%;left:16%}.academy-orb-card span:nth-child(2){top:30%;right:14%;animation-delay:.5s}.academy-orb-card span:nth-child(3){bottom:24%;left:20%;animation-delay:1s}.academy-orb-card span:nth-child(4){bottom:18%;right:10%;animation-delay:1.5s}.academy-orb-card strong{font-size:2.4rem}
.academy-page-hero { background: linear-gradient(135deg, rgba(59,130,246,.13), rgba(124,58,237,.09), rgba(5,5,5,.95)); }
.academy-course-card { overflow:hidden; }
.course-meta { display:flex; flex-wrap:wrap; gap:.55rem; color:var(--muted); }
.course-meta span { border:1px solid var(--border); border-radius:999px; padding:.35rem .65rem; background:rgba(255,255,255,.04); font-size:.85rem; }
.academy-list { color:var(--muted); line-height:1.8; padding-left:1.2rem; }
.sticky-card { position:sticky; top:6.5rem; }
.auth-section { min-height:100vh; display:grid; place-items:center; padding:8rem 1rem 4rem; }
.academy-progress { height:.72rem; background:rgba(255,255,255,.08); border-radius:999px; overflow:hidden; }
.academy-progress div { height:100%; border-radius:999px; background:linear-gradient(90deg,var(--blue),var(--purple),var(--green)); animation: progressGlow 2.5s ease-in-out infinite; }
.lesson-shell { display:grid; grid-template-columns: 340px 1fr; min-height:100vh; background:#050505; }
.lesson-sidebar { border-right:1px solid var(--border); padding:1.5rem; position:sticky; top:0; height:100vh; overflow:auto; background:rgba(255,255,255,.025); }
.lesson-sidebar h3 { font-size:1.1rem; }
.lesson-link { display:flex; gap:.75rem; align-items:center; color:var(--muted); padding:.75rem; border-radius:.55rem; margin-bottom:.35rem; }
.lesson-link span { width:1.7rem; height:1.7rem; display:grid; place-items:center; border:1px solid var(--border); border-radius:50%; font-size:.8rem; }
.lesson-link.active,.lesson-link:hover { color:#fff; background:rgba(59,130,246,.14); }
.lesson-content { padding:5rem; max-width:1050px; }
.lesson-content h1 { font-size:clamp(2.2rem,4vw,4.5rem); }
.video-placeholder { min-height:320px; border:1px solid var(--border); border-radius:.85rem; display:grid; place-items:center; color:var(--muted); background:linear-gradient(135deg, rgba(59,130,246,.12), rgba(124,58,237,.08)); margin:2rem 0; font-weight:800; }
.quiz-question { border-bottom:1px solid var(--border); padding:1.5rem 0; }
.quiz-option { display:block; border:1px solid var(--border); border-radius:.55rem; padding:.9rem 1rem; margin:.65rem 0; background:rgba(255,255,255,.035); color:var(--muted); cursor:pointer; }
.quiz-option:hover { border-color:rgba(59,130,246,.5); color:#fff; }
.certificate-wrap { padding-top:9rem; }
.certificate-card { background:#f7f7f2; color:#111; border:10px solid #111; outline:2px solid #7C3AED; padding:4rem; text-align:center; max-width:1000px; margin:auto; }
.certificate-card p,.certificate-card .eyebrow { color:#333; }.certificate-card h1{font-size:3.2rem}.certificate-card h2{font-size:2.8rem;color:#111}.certificate-card h3{color:#3B82F6}.certificate-meta{display:flex;justify-content:center;gap:2rem;flex-wrap:wrap;margin-top:2rem;color:#333}
@keyframes academyFloat { 50% { transform: translateY(-12px); } }
@keyframes progressGlow { 50% { filter: brightness(1.25); } }
@media(max-width:991px){.lesson-shell{grid-template-columns:1fr}.lesson-sidebar{position:relative;height:auto}.lesson-content{padding:2rem}.academy-hero{padding-top:8rem}.academy-orb-card{min-height:300px}}
@media print { body * { visibility:hidden; } #certificate, #certificate * { visibility:visible; } #certificate { position:absolute; inset:0; margin:0; max-width:none; } .nav-glass,.footer,.btn { display:none!important; } }

/* Premium Academy Animation Layer */
.page-enter body { opacity: 0; transform: translateY(8px); }
.page-enter.page-enter-active body { opacity: 1; transform: translateY(0); transition: opacity .55s ease, transform .55s ease; }
.academy-hero { position: relative; overflow: hidden; }
.academy-hero::before { content:""; position:absolute; inset:0; background-image: radial-gradient(circle, rgba(255,255,255,.38) 1px, transparent 1px); background-size: 72px 72px; opacity:.16; animation: academyParticles 18s linear infinite; pointer-events:none; }
.academy-orb-card::before { content:""; position:absolute; width:72%; height:72%; border:1px solid rgba(59,130,246,.25); border-radius:50%; animation: svcOrbit 14s linear infinite; }
.learning-animation { margin: 2rem 0; min-height: 280px; border:1px solid var(--border); border-radius:.9rem; background:linear-gradient(135deg, rgba(59,130,246,.12), rgba(124,58,237,.08), rgba(16,185,129,.045)); display:grid; grid-template-columns: .85fr 1.15fr; gap:1.5rem; align-items:center; padding:1.4rem; overflow:hidden; position:relative; }
.learning-animation::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg, transparent, rgba(255,255,255,.075), transparent); transform:translateX(-120%); animation: svcScan 5.6s ease-in-out infinite; }
.anim-copy { position:relative; z-index:2; }
.anim-copy span { color:var(--green); font-size:.76rem; text-transform:uppercase; letter-spacing:.12rem; font-weight:900; }
.anim-copy h3 { font-size:1.55rem; margin:.5rem 0; }
.learning-animation svg { width:100%; min-height:220px; position:relative; z-index:1; }
.ai-links path { fill:none; stroke:url(#none); stroke:#3B82F6; stroke-width:2; stroke-opacity:.5; stroke-dasharray:18 12; animation: svcDash 4s linear infinite; }
.ai-nodes circle { fill:#101c32; stroke:#3B82F6; stroke-width:3; filter:drop-shadow(0 0 10px rgba(59,130,246,.5)); animation: svcNode 2.4s ease-in-out infinite; }
.ai-nodes circle:nth-child(3n) { stroke:#10B981; animation-delay:.4s; }.ai-nodes circle:nth-child(2n) { stroke:#7C3AED; animation-delay:.7s; }
.ai-pulse-node { fill:none; stroke:#10B981; stroke-width:3; opacity:.6; animation: svcPulse 2s ease-in-out infinite; }
.data-transform, .prompt-flow, .sql-stage, .agent-grid, .ml-plane { position:relative; z-index:2; min-height:220px; display:flex; align-items:center; justify-content:center; gap:1rem; }
.raw-table, .mini-dashboard, .db-table, .result-table, .prompt-box, .generated-stack { border:1px solid var(--border); border-radius:.75rem; background:rgba(255,255,255,.055); padding:1rem; min-width:130px; }
.raw-table i, .db-table i, .generated-stack b, .result-table b { display:block; height:10px; border-radius:999px; background:rgba(255,255,255,.28); margin:.65rem 0; animation: rowLoad 2.5s ease-in-out infinite; }
.flow-arrow { color:#fff; font-size:2rem; animation: arrowMove 1.8s ease-in-out infinite; }
.kpi-count { font-size:2.5rem; font-weight:900; color:#fff; }
.dash-bars { display:flex; align-items:end; gap:.45rem; height:72px; }.dash-bars b { width:18px; border-radius:8px; background:linear-gradient(var(--blue),var(--purple)); animation: svcBars 2.2s ease-in-out infinite; }.dash-bars b:nth-child(1){height:34%}.dash-bars b:nth-child(2){height:74%;animation-delay:.2s}.dash-bars b:nth-child(3){height:52%;animation-delay:.4s}.dash-bars b:nth-child(4){height:88%;animation-delay:.6s}
.mini-dashboard path { fill:none; stroke:#10B981; stroke-width:5; stroke-linecap:round; }
.ml-plane { border:1px solid var(--border); border-radius:.85rem; background:rgba(255,255,255,.035); overflow:hidden; }
.ml-plane i { position:absolute; width:14px; height:14px; border-radius:50%; background:#3B82F6; animation: classifyA 4s ease-in-out infinite; }.ml-plane i:nth-child(n+5){background:#10B981;animation-name:classifyB}.ml-plane i:nth-child(1){left:18%;top:30%}.ml-plane i:nth-child(2){left:32%;top:42%}.ml-plane i:nth-child(3){left:24%;top:62%}.ml-plane i:nth-child(4){left:42%;top:26%}.ml-plane i:nth-child(5){right:22%;top:28%}.ml-plane i:nth-child(6){right:34%;top:54%}.ml-plane i:nth-child(7){right:18%;top:68%}.ml-plane i:nth-child(8){right:42%;top:34%}.ml-plane span{position:absolute;height:2px;width:70%;background:linear-gradient(90deg,transparent,#fff,transparent);transform:rotate(-18deg);opacity:.35}
.prompt-box { animation: promptSend 3.6s ease-in-out infinite; }.generated-stack strong { color:#fff; display:block; margin-top:.8rem; }
.query-chip { position:absolute; top:18px; left:22px; background:rgba(59,130,246,.18); border:1px solid rgba(59,130,246,.35); border-radius:999px; color:#fff; padding:.6rem .9rem; animation: queryTravel 4s ease-in-out infinite; }
.agent-grid { display:grid; grid-template-columns:repeat(2,120px); gap:1rem; }.agent-card,.agent-hub { border:1px solid var(--border); border-radius:.75rem; background:rgba(255,255,255,.06); color:#fff; font-weight:900; padding:1rem; text-align:center; animation: agentWork 3s ease-in-out infinite; }.agent-card:nth-child(2){animation-delay:.25s}.agent-card:nth-child(3){animation-delay:.5s}.agent-card:nth-child(4){animation-delay:.75s}.agent-hub{position:absolute;inset:auto;left:50%;top:50%;transform:translate(-50%,-50%);background:linear-gradient(135deg,var(--blue),var(--purple));}
.video-placeholder { grid-template-columns:1fr; gap:.6rem; }.video-placeholder lottie-player { width:150px; height:150px; }
.progress-ring { width:86px; height:86px; border-radius:50%; display:grid; place-items:center; position:relative; box-shadow:0 0 28px rgba(59,130,246,.18); }.progress-ring::before{content:"";position:absolute;inset:9px;border-radius:50%;background:#121212}.progress-ring div,.progress-ring small{position:relative;z-index:1}.progress-ring strong{font-size:1.35rem}.progress-ring small{position:absolute;bottom:-1.4rem;color:var(--muted);font-size:.75rem}.continue-pulse{position:relative;overflow:hidden}.continue-pulse::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at var(--mx,50%) var(--my,50%),rgba(59,130,246,.14),transparent 36%);opacity:.9;pointer-events:none}.completed-slide{animation: slideSoft .7s ease both}.quiz-result-anim{display:flex;align-items:center;gap:1rem;border:1px solid var(--border);border-radius:.85rem;padding:1.2rem;margin-bottom:1.5rem;background:rgba(255,255,255,.045)}.quiz-result-anim.passed{border-color:rgba(16,185,129,.45);box-shadow:0 0 40px rgba(16,185,129,.1)}.quiz-score-orb{width:96px;height:96px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,var(--blue),var(--purple));box-shadow:0 0 34px rgba(59,130,246,.25)}.quiz-score-orb strong{font-size:2rem}.certificate-reveal{display:grid;place-items:center;margin-bottom:1.5rem}.unlock-ring{width:86px;height:86px;border-radius:50%;border:2px solid rgba(16,185,129,.6);animation: unlockPulse 1.8s ease-in-out infinite}.unlock-card{margin-top:-54px;background:linear-gradient(135deg,var(--blue),var(--purple));padding:.75rem 1.1rem;border-radius:.55rem;font-weight:900}.certificate-card{animation: certReveal .9s ease both}.premium-confetti{position:fixed;inset:0;pointer-events:none;z-index:9999}.premium-confetti i{position:absolute;top:-20px;width:8px;height:14px;border-radius:2px;animation: confettiFall 3s ease-in forwards}.admin-shell aside{transition:width .25s ease, background .25s ease}.admin-shell nav a{transition:transform .2s ease,background .2s ease}.admin-shell nav a:hover{transform:translateX(4px)}.stat-admin{transition:transform .25s ease,box-shadow .25s ease}.stat-admin:hover{transform:translateY(-4px);box-shadow:0 24px 70px rgba(59,130,246,.14)}
@keyframes academyParticles{to{background-position:140px 140px}}@keyframes rowLoad{50%{transform:scaleX(.55);background:var(--service-accent,#3B82F6)}}@keyframes arrowMove{50%{transform:translateX(8px);color:var(--green)}}@keyframes classifyA{50%{transform:translate(28px,8px)}}@keyframes classifyB{50%{transform:translate(-28px,-8px)}}@keyframes promptSend{50%{transform:translateX(18px);border-color:rgba(59,130,246,.5)}}@keyframes queryTravel{50%{left:42%;background:rgba(16,185,129,.18)}}@keyframes agentWork{50%{transform:translateY(-8px);border-color:rgba(59,130,246,.5)}}@keyframes slideSoft{from{opacity:0;transform:translateX(-14px)}to{opacity:1;transform:translateX(0)}}@keyframes unlockPulse{50%{transform:scale(1.14);box-shadow:0 0 36px rgba(16,185,129,.24)}}@keyframes certReveal{from{opacity:0;transform:translateY(20px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes confettiFall{to{transform:translateY(105vh) rotate(720deg);opacity:0}}
@media(max-width:768px){.learning-animation{grid-template-columns:1fr}.agent-grid{grid-template-columns:repeat(2,1fr)}.progress-ring{width:74px;height:74px}}