/* BUTTONS */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; font-family:var(--font-heading); font-weight:var(--fw-semibold); border-radius:var(--radius-md); transition:all var(--transition-base); cursor:pointer; border:none; text-decoration:none; white-space:nowrap; }
.btn--sm { padding:8px 18px; font-size:var(--text-sm); }
.btn--md { padding:12px 28px; font-size:var(--text-base); }
.btn--lg { padding:16px 36px; font-size:var(--text-lg); }
.btn--primary { background:var(--color-primary); color:var(--color-white); }
.btn--primary:hover { background:var(--color-primary-dark); transform:translateY(-2px); box-shadow:0 6px 20px rgba(79,70,229,0.35); }
.btn--accent { background:var(--color-accent); color:var(--color-text-primary); }
.btn--accent:hover { background:var(--color-accent-dark); transform:translateY(-2px); }
.btn--outline { background:transparent; color:var(--color-primary); border:2px solid var(--color-primary); }
.btn--outline:hover { background:var(--color-primary); color:white; }
.btn--ghost { background:rgba(255,255,255,0.15); color:white; backdrop-filter:blur(8px); border:1px solid rgba(255,255,255,0.3); }
.btn--ghost:hover { background:rgba(255,255,255,0.25); }

/* NAVBAR */
.navbar { position:fixed; top:0; left:0; right:0; z-index:1000; background:white; box-shadow:0 2px 12px rgba(0,0,0,0.06); }
.navbar__inner { display:flex; align-items:center; justify-content:space-between; height:72px; }
.navbar__links { display:none; }
@media (min-width:1024px) { .navbar__links { display:flex; gap:32px; } }
.nav-link { font-family:var(--font-heading); font-size:15px; font-weight:var(--fw-medium); color:var(--color-text-primary); transition:color var(--transition-base); padding-bottom:4px; }
.nav-link:hover, .nav-link.active { color:var(--color-primary); border-bottom:2px solid var(--color-primary); }
.navbar__cta { display:none; }
@media (min-width:1024px) { .navbar__cta { display:inline-flex; } }
.navbar__hamburger { display:flex; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:4px; }
@media (min-width:1024px) { .navbar__hamburger { display:none; } }
.navbar__hamburger span { display:block; width:24px; height:2px; background:var(--color-text-primary); transition:all var(--transition-base); border-radius:2px; }
.navbar__hamburger.active span:nth-child(1) { transform:rotate(45deg) translate(5px,5px); }
.navbar__hamburger.active span:nth-child(2) { opacity:0; }
.navbar__hamburger.active span:nth-child(3) { transform:rotate(-45deg) translate(5px,-5px); }
.navbar__drawer { position:fixed; top:72px; right:-100%; width:280px; height:calc(100vh - 72px); background:white; box-shadow:-4px 0 24px rgba(0,0,0,0.1); padding:32px 24px; transition:right var(--transition-slow); z-index:999; display:flex; flex-direction:column; }
.navbar__drawer.open { right:0; }
.navbar__drawer ul { display:flex; flex-direction:column; gap:0; }
.navbar__drawer a { display:block; font-family:var(--font-heading); font-size:var(--text-lg); font-weight:var(--fw-semibold); color:var(--color-text-primary); padding:16px 0; border-bottom:1px solid var(--color-border); }
.navbar__drawer a:hover { color:var(--color-primary); }
.navbar.scrolled { box-shadow:0 4px 24px rgba(0,0,0,0.12); backdrop-filter:blur(12px); }
.no-scroll { overflow:hidden; }

/* COURSE CARD */
.course-card { background:var(--color-surface); border-radius:var(--radius-xl); box-shadow:var(--shadow-card); overflow:hidden; transition:transform var(--transition-base),box-shadow var(--transition-base); border:1px solid var(--color-border); }
.course-card:hover { transform:translateY(-6px); box-shadow:var(--shadow-lg); }
.course-card__thumb { position:relative; height:200px; overflow:hidden; }
.course-card__thumb img { width:100%; height:100%; object-fit:cover; transition:transform 400ms ease; }
.course-card:hover .course-card__thumb img { transform:scale(1.06); }
.course-card__badge { position:absolute; top:12px; left:12px; background:var(--color-accent); color:var(--color-text-primary); font-size:11px; font-weight:700; padding:3px 10px; border-radius:var(--radius-full); text-transform:uppercase; letter-spacing:0.5px; }
.course-card__body { padding:20px; }
.course-card__category { font-size:var(--text-xs); font-weight:var(--fw-semibold); color:var(--color-primary); text-transform:uppercase; letter-spacing:1px; margin-bottom:8px; }
.course-card__title { font-family:var(--font-heading); font-size:var(--text-lg); font-weight:var(--fw-bold); color:var(--color-text-primary); margin-bottom:12px; line-height:var(--lh-snug); }
.course-card__meta { display:flex; gap:16px; font-size:var(--text-sm); color:var(--color-text-muted); margin-bottom:10px; }
.course-card__rating { display:flex; align-items:center; gap:6px; font-size:var(--text-sm); }
.stars { color:var(--color-accent); }
.rating-val { font-weight:var(--fw-bold); color:var(--color-text-primary); }
.rating-count { color:var(--color-text-muted); }
.course-card__price { display:flex; align-items:center; gap:10px; margin-top:12px; }
.price-discounted { font-size:var(--text-xl); font-weight:var(--fw-bold); color:var(--color-text-primary); }
.price-original { font-size:var(--text-sm); color:var(--color-text-muted); text-decoration:line-through; }
.price-tag { background:#FEF3C7; color:#92400E; font-size:11px; font-weight:700; padding:2px 8px; border-radius:4px; }
.course-card__footer { padding:16px 20px; border-top:1px solid var(--color-border); display:flex; gap:10px; }

/* FACULTY CARD */
.faculty-card { background:var(--color-surface); border-radius:var(--radius-xl); overflow:hidden; box-shadow:var(--shadow-card); text-align:center; padding-bottom:20px; transition:transform var(--transition-base); }
.faculty-card:hover { transform:translateY(-4px); }
.faculty-card__photo { height:240px; overflow:hidden; }
.faculty-card__photo img { width:100%; height:100%; object-fit:cover; object-position:top; }
.faculty-card__info { padding:16px 20px 0; }
.faculty-card__name { font-size:var(--text-lg); font-weight:var(--fw-bold); color:var(--color-text-primary); }
.faculty-card__qual { font-size:var(--text-sm); color:var(--color-primary); font-weight:var(--fw-medium); margin:4px 0; }
.faculty-card__exp { font-size:var(--text-sm); color:var(--color-text-muted); }
.faculty-card__tags { display:flex; flex-wrap:wrap; gap:6px; justify-content:center; margin-top:12px; }
.tag { background:var(--color-secondary); color:var(--color-primary); font-size:11px; font-weight:600; padding:4px 10px; border-radius:var(--radius-full); }

/* STAT CARD */
.stat-card { text-align:center; padding:32px 20px; }
.stat-card__icon { font-size:40px; margin-bottom:12px; }
.stat-card__number { font-family:var(--font-heading); font-size:var(--text-5xl); font-weight:var(--fw-black); color:var(--color-primary); line-height:1; margin-bottom:8px; }
.stat-card__label { font-size:var(--text-base); color:var(--color-text-secondary); font-weight:var(--fw-medium); }

/* TESTIMONIAL CARD */
.testimonial-card { background:var(--color-surface); border-radius:var(--radius-xl); padding:32px; box-shadow:var(--shadow-card); border-left:4px solid var(--color-primary); position:relative; }
.testimonial-card__quote { font-size:80px; line-height:0.5; color:var(--color-primary); opacity:0.15; font-family:Georgia,serif; margin-bottom:16px; }
.testimonial-card__text { font-family:var(--font-body); font-size:var(--text-base); color:var(--color-text-secondary); line-height:var(--lh-loose); }
.testimonial-card__footer { display:flex; align-items:center; gap:14px; margin-top:24px; }
.testimonial-card__photo { width:52px; height:52px; border-radius:50%; object-fit:cover; }
.testimonial-card__name { font-weight:var(--fw-bold); font-size:var(--text-base); color:var(--color-text-primary); }
.testimonial-card__detail { font-size:var(--text-sm); color:var(--color-success); font-weight:var(--fw-medium); }
.testimonial-card__stars { color:var(--color-accent); font-size:18px; margin-top:16px; }

/* WHATSAPP FLOAT */
.whatsapp-float { position:fixed; bottom:28px; right:28px; width:56px; height:56px; background:#25D366; border-radius:var(--radius-full); display:flex; align-items:center; justify-content:center; box-shadow:0 4px 20px rgba(37,211,102,0.4); z-index:9999; transition:transform var(--transition-spring),box-shadow var(--transition-base); animation:whatsappPulse 2.5s ease infinite; }
.whatsapp-float:hover { transform:scale(1.12); box-shadow:0 6px 28px rgba(37,211,102,0.55); }
.whatsapp-float__label { display:none; }

/* MOBILE STICKY BAR */
.sticky-enquire { display:none; position:fixed; bottom:0; left:0; right:0; background:var(--color-primary); padding:12px 20px; z-index:9998; gap:12px; }
@media (max-width:767px) { .sticky-enquire { display:flex; } }
.sticky-enquire__call { flex:1; background:white; color:var(--color-primary); border-radius:var(--radius-md); padding:10px; text-align:center; font-family:var(--font-heading); font-weight:var(--fw-semibold); font-size:var(--text-sm); text-decoration:none; }
.sticky-enquire__enquire { flex:1; background:var(--color-accent); color:var(--color-text-primary); border-radius:var(--radius-md); padding:10px; text-align:center; font-family:var(--font-heading); font-weight:var(--fw-bold); font-size:var(--text-sm); text-decoration:none; }

/* FOOTER */
.footer { background:#111827; padding:64px 0 0; }
.footer__grid { display:grid; grid-template-columns:1fr; gap:40px; }
@media (min-width:768px) { .footer__grid { grid-template-columns:repeat(2,1fr); } }
@media (min-width:1024px) { .footer__grid { grid-template-columns:2fr 1fr 1fr 1.5fr; } }
.footer__logo { font-family:var(--font-heading); font-size:1.4rem; font-weight:900; color:white; margin-bottom:12px; }
.footer__logo span { color:var(--color-accent); }
.footer__tagline { color:#9CA3AF; font-size:var(--text-sm); margin-bottom:20px; }
.footer__socials { display:flex; gap:12px; }
.footer__socials a { width:36px; height:36px; background:#1F2937; color:#9CA3AF; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:12px; font-weight:700; transition:all var(--transition-base); }
.footer__socials a:hover { background:var(--color-primary); color:white; }
.footer__heading { font-family:var(--font-heading); font-size:var(--text-sm); font-weight:var(--fw-bold); color:white; margin-bottom:20px; text-transform:uppercase; letter-spacing:1px; }
.footer__links { display:flex; flex-direction:column; gap:12px; }
.footer__links li, .footer__links a { color:#9CA3AF; font-size:var(--text-sm); line-height:1.6; }
.footer__links a:hover { color:#F5F3FF; }
.footer__bottom { border-top:1px solid #1F2937; margin-top:48px; padding:24px 0; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; }
.footer__bottom p, .footer__bottom a { color:#6B7280; font-size:var(--text-sm); }
.footer__bottom a:hover { color:#9CA3AF; }

/* FAQ */
.faq-item { border-bottom:1px solid var(--color-border); }
.faq-question { width:100%; text-align:left; padding:20px 0; font-family:var(--font-heading); font-weight:var(--fw-semibold); font-size:var(--text-lg); display:flex; justify-content:space-between; align-items:center; background:none; border:none; cursor:pointer; color:var(--color-text-primary); }
.faq-answer { max-height:0; overflow:hidden; transition:max-height 350ms cubic-bezier(0.4,0,0.2,1),padding 350ms ease; color:var(--color-text-secondary); font-family:var(--font-body); line-height:var(--lh-loose); font-size:var(--text-base); }
.faq-item.active .faq-answer { max-height:400px; padding-bottom:20px; }
.faq-icon { transition:transform 300ms ease; font-size:20px; flex-shrink:0; }
.faq-item.active .faq-icon { transform:rotate(45deg); }

/* TABS */
.tab-btn { background:white; border:1px solid var(--color-border); color:var(--color-text-secondary); font-family:var(--font-heading); font-size:var(--text-sm); font-weight:600; padding:8px 20px; border-radius:var(--radius-full); cursor:pointer; transition:all var(--transition-base); }
.tab-btn.active, .tab-btn:hover { background:var(--color-primary); color:white; border-color:var(--color-primary); }
.tab-content { opacity:0; transform:translateY(10px); transition:all 250ms ease; pointer-events:none; display:none; }
.tab-content.active { opacity:1; transform:translateY(0); display:grid; pointer-events:all; }
