/* Header / Navbar */
.header{
  position:sticky;top:16px;z-index:60;margin:0 auto;backdrop-filter:blur(6px);
}
.navbar{
  display:flex;align-items:center;justify-content:space-between;padding:12px 20px;background:rgba(255,255,255,0.6);border-radius:14px;border:1px solid var(--border);box-shadow:var(--shadow-soft)
}
.navbar .brand{display:flex;align-items:center;gap:12px}
.navbar .nav-items{display:flex;gap:20px;align-items:center}
.navbar a{padding:8px 12px;border-radius:12px;transition:all .25s ease}
.navbar a:hover{transform:translateY(-3px);background:linear-gradient(135deg,var(--color-primary),var(--color-secondary));color:white}
/* Buttons */
.btn{
  display:inline-flex;align-items:center;gap:8px;padding:10px 18px;border-radius:999px;background:linear-gradient(135deg,var(--color-primary),var(--color-secondary));color:white;border:none;cursor:pointer;box-shadow:0 8px 24px rgba(79,111,255,0.18);transition:transform .18s ease,box-shadow .18s ease
}
.btn:active{transform:translateY(1px)}
.btn--ghost{background:transparent;color:var(--color-primary);border:1px solid var(--border)}
/* Hero */
.hero{padding:80px 0;position:relative}
.hero .hero-inner{display:flex;gap:40px;align-items:center}
.hero .headline{font-size:2.4rem}
.hero .ctas{display:flex;gap:12px;margin-top:20px}
.hero-illustration{flex:1}
.hero-copy{flex:1}
.hero-bg{position:absolute;inset:0;z-index:-1;background:radial-gradient(800px 400px at 10% 10%, rgba(79,111,255,0.12), transparent 20%), radial-gradient(600px 300px at 90% 90%, rgba(0,212,255,0.07), transparent 20%);border-radius:40px}
/* Cards */
.card--course{display:flex;gap:16px;align-items:center;padding:16px}
.course-image{width:120px;height:80px;flex-shrink:0;border-radius:12px;overflow:hidden}
.course-meta{flex:1}
.price-badge{background:linear-gradient(135deg,var(--color-accent),var(--color-primary));color:white;padding:6px 10px;border-radius:999px;font-weight:700}
/* Book cards */
.book-card{perspective:1200px}
.book-inner{transform-style:preserve-3d;transition:transform .45s cubic-bezier(.2,.9,.3,1)}
.book-card:hover .book-inner{transform:rotateY(8deg) translateY(-6px)}
/* Tables */
.table{width:100%;border-collapse:collapse;background:transparent}
.table th, .table td{padding:12px;border-bottom:1px solid var(--border)}
/* Testimonials */
.testimonial{padding:18px;border-radius:16px;background:linear-gradient(180deg,rgba(127,90,255,0.06),rgba(79,111,255,0.03));box-shadow:var(--shadow-soft)}
/* Footer components */
.footer-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
@media (max-width:900px){.footer-grid{grid-template-columns:repeat(2,1fr)}}