/* ═══════════════════════════════════════════════════════════════
   SVM CLASSES — Design System  |  Warm Amber Theme
   Primary: #BA7517  Accent: #EF9F27  Text: #1A1A1A
═══════════════════════════════════════════════════════════════ */

/* ─── TOKENS ─────────────────────────────────────────────────── */
:root {
  --primary:      #BA7517;
  --accent:       #EF9F27;
  --primary-dark: #9d6112;
  --pt10:  rgba(186,117,23,.09);
  --at14:  rgba(239,159,39,.14);
  --white:  #FFFFFF;
  --text:   #1A1A1A;
  --muted:  #555555;
  --border: #E8E8E8;
  --sh-sm:  0 2px  8px  rgba(186,117,23,.10);
  --sh-md:  0 6px  20px rgba(186,117,23,.14);
  --sh-lg:  0 14px 40px rgba(186,117,23,.20);
  --r:      12px;
  --r-lg:   20px;
  --r-pill: 999px;
  --sp:     8px;
  --ease:   0.3s ease;
  /* Legacy aliases */
  --accent-saffron:      #EF9F27;
  --accent-saffron-dark: #BA7517;
  --accent-gold:         #EF9F27;
  --primary-blue:        #BA7517;
  --text-muted:          #555555;
  --bg-white:            #FFFFFF;
  --bg-light:            rgba(186,117,23,.05);
  --border-color:        #E8E8E8;
  --border-radius:       12px;
  --shadow-md:           0 6px 20px rgba(186,117,23,.14);
}

/* ─── RESET ──────────────────────────────────────────────────── */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; }
body {
  font-family:'Segoe UI',system-ui,-apple-system,sans-serif;
  font-size:16px; line-height:1.65;
  color:var(--text); background:var(--white);
  overflow-x:hidden;
}
img { max-width:100%; height:auto; display:block; }
a   { color:inherit; text-decoration:none; }
ul  { list-style:none; }
button { cursor:pointer; }

@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after {
    animation-duration:0.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:0.01ms !important;
  }
  html { scroll-behavior:auto; }
}

/* ─── TYPE ───────────────────────────────────────────────────── */
h1 { font-size:clamp(2rem,5vw,3.2rem);     font-weight:800; line-height:1.10; }
h2 { font-size:clamp(1.6rem,3.5vw,2.4rem); font-weight:700; line-height:1.20; }
h3 { font-size:clamp(1.05rem,2vw,1.3rem);  font-weight:600; }
h4 { font-size:1rem; font-weight:600; }

/* ─── LAYOUT ─────────────────────────────────────────────────── */
.container { max-width:1200px; margin:0 auto; padding:0 calc(var(--sp)*3); width:100%; }
.section-padding { padding:calc(var(--sp)*11) 0; }
.text-center { text-align:center; }
.grid-2 { display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:calc(var(--sp)*6); align-items:center; }
.grid-3 { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:calc(var(--sp)*3.5); }
.grid-4 { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:calc(var(--sp)*3); }

/* ─── LABELS / BADGES ────────────────────────────────────────── */
.label, .badge {
  display:inline-block;
  background:var(--at14); color:var(--primary);
  font-size:.78rem; font-weight:700;
  text-transform:uppercase; letter-spacing:.12em;
  padding:4px 14px; border-radius:var(--r-pill);
  margin-bottom:calc(var(--sp)*2);
}
.badge-saffron { background:var(--at14);              color:var(--primary); }
.badge-blue    { background:rgba(186,117,23,.12);     color:var(--primary-dark); }
.badge-gold    { background:rgba(239,159,39,.18);     color:var(--primary); }

.section-title {
  font-size:clamp(1.6rem,3vw,2.3rem); font-weight:700;
  color:var(--text); margin-bottom:calc(var(--sp)*2);
}
.section-title span, .section-head span { color:var(--primary); }

/* ─── CARDS ──────────────────────────────────────────────────── */
.card {
  background:var(--white);
  border:1px solid var(--border);
  border-radius:var(--r-lg);
  padding:calc(var(--sp)*4);
  transition:transform var(--ease),box-shadow var(--ease),border-color var(--ease);
}
.card:hover {
  transform:translateY(-5px);
  box-shadow:var(--sh-lg);
  border-color:rgba(186,117,23,.25);
}

/* ─── BUTTONS ────────────────────────────────────────────────── */
.btn {
  display:inline-flex; align-items:center; gap:8px;
  padding:12px 28px; border-radius:var(--r-pill);
  font-size:1rem; font-weight:600;
  border:2px solid transparent;
  transition:all var(--ease); cursor:pointer;
  text-align:center;
}
.btn-primary {
  background:var(--primary); color:var(--white); border-color:var(--primary);
}
.btn-primary:hover {
  background:var(--primary-dark); border-color:var(--primary-dark);
  transform:translateY(-2px);
  box-shadow:0 8px 24px rgba(186,117,23,.38);
}
.btn-secondary {
  background:var(--accent); color:var(--white); border-color:var(--accent);
}
.btn-secondary:hover {
  background:#d48c20; transform:translateY(-2px);
  box-shadow:0 8px 24px rgba(239,159,39,.38);
}
.btn-outline {
  background:transparent; color:var(--primary); border-color:var(--primary);
}
.btn-outline:hover {
  background:var(--pt10); transform:translateY(-2px);
}
.btn-ghost {
  background:transparent; color:var(--white);
  border-color:rgba(255,255,255,.65);
}
.btn-ghost:hover { background:rgba(255,255,255,.12); transform:translateY(-2px); }

@keyframes pulse-ring {
  0%,100% { box-shadow:0 0 0 0   rgba(186,117,23,.45); }
  50%      { box-shadow:0 0 0 10px rgba(186,117,23,.00); }
}
.btn-primary.pulse { animation:pulse-ring 2.2s ease infinite; }

/* ─── KEYFRAMES ──────────────────────────────────────────────── */
@keyframes fadeUp   { from{opacity:0;transform:translateY(22px)} to{opacity:1;transform:none} }
@keyframes floatBob { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-10px)} }
@keyframes waveMove { to{transform:translateX(-50%)} }
@keyframes blinkCaret { 0%,100%{border-color:var(--accent)} 50%{border-color:transparent} }
@keyframes fadeIn { from{opacity:0} to{opacity:1} }

/* ─── SCROLL REVEAL ──────────────────────────────────────────── */
.reveal       { opacity:0; transform:translateY(28px);  transition:opacity .7s ease,transform .7s ease; }
.reveal-left  { opacity:0; transform:translateX(-36px); transition:opacity .7s ease,transform .7s ease; }
.reveal-right { opacity:0; transform:translateX( 36px); transition:opacity .7s ease,transform .7s ease; }
.reveal.in,.reveal-left.in,.reveal-right.in { opacity:1; transform:none; }
.d1{transition-delay:.08s} .d2{transition-delay:.16s}
.d3{transition-delay:.24s} .d4{transition-delay:.32s}
.d5{transition-delay:.40s} .d6{transition-delay:.48s}

/* ════════════════════════════════════════════════════════════════
   NAVIGATION
════════════════════════════════════════════════════════════════ */
header {
  position:fixed; top:0; left:0; right:0; z-index:900;
  background: linear-gradient(180deg, rgba(10,3,0,0.72) 0%, rgba(10,3,0,0.08) 100%);
  transition:background var(--ease),box-shadow var(--ease);
}
.header-container {
  max-width:1340px; margin:0 auto;
  padding:0 calc(var(--sp)*3);
  height:68px;
  display:flex; align-items:center; justify-content:space-between;
}
.logo-link {
  display:flex; align-items:center; gap:10px;
  color:var(--white); transition:color var(--ease); flex-shrink:0;
}
.logo-img {
  height:48px; width:auto;
  object-fit: contain;
  filter: brightness(0) invert(1);
  transition: filter var(--ease);
}
header.scrolled .logo-img { filter: none; }
.logo-text-wrapper { display:flex; flex-direction:column; }
.logo-text {
  font-size:1.1rem; font-weight:800; line-height:1.1;
  color:var(--white); transition:color var(--ease);
}
.logo-sub {
  font-size:.65rem; font-weight:500; letter-spacing:.05em;
  color:rgba(255,255,255,.75); transition:color var(--ease);
}
header.scrolled { background:var(--white); box-shadow:0 2px 18px rgba(0,0,0,.08); }
header.scrolled .logo-text { color:var(--text); }
header.scrolled .logo-sub  { color:var(--muted); }

.nav-links {
  display:flex; align-items:center; gap:calc(var(--sp)*2.75); flex-wrap:nowrap;
}
.nav-links a {
  font-size:.85rem; font-weight:500; letter-spacing:.01em;
  color:rgba(255,255,255,.88); position:relative;
  transition:color var(--ease); white-space:nowrap;
}

/* subtle divider between content & utility groups */
.nav-sep {
  width:1px; height:14px; flex-shrink:0;
  background:rgba(255,255,255,.18); border-radius:1px;
}
header.scrolled .nav-sep { background:rgba(0,0,0,.12); }
.nav-links a::after {
  content:''; position:absolute; bottom:-3px; left:0;
  height:2px; width:0;
  background:var(--accent); border-radius:2px;
  transition:width var(--ease);
}
.nav-links a:hover::after,.nav-links a.active::after { width:100%; }
.nav-links a:hover,.nav-links a.active { color:var(--accent); }
header.scrolled .nav-links a { color:var(--text); }
header.scrolled .nav-links a:hover,
header.scrolled .nav-links a.active { color:var(--primary); }
.nav-links .btn { padding:8px 16px; font-size:.82rem; }
.nav-links .btn::after { display:none; }
.nav-links .btn-primary { color:#fff !important; }

.header-cta { display:flex; gap:8px; align-items:center; }
.header-cta .btn { padding:8px 16px; font-size:.82rem; }

.mobile-toggle {
  display:none; flex-direction:column; gap:5px;
  background:none; border:none; padding:4px;
}
.mobile-toggle span {
  display:block; width:24px; height:2px;
  background:var(--white); border-radius:2px; transition:all var(--ease);
}
header.scrolled .mobile-toggle span { background:var(--text); }
.mobile-toggle.open span:nth-child(1){transform:rotate(45deg) translate(5px,5px)}
.mobile-toggle.open span:nth-child(2){opacity:0}
.mobile-toggle.open span:nth-child(3){transform:rotate(-45deg) translate(5px,-5px)}

.mobile-nav-menu {
  display:none; position:fixed;
  top:68px; left:0; right:0; z-index:899;
  background:var(--white);
  box-shadow:0 10px 30px rgba(0,0,0,.10);
  padding:calc(var(--sp)*2);
  flex-direction:column; gap:2px;
  opacity:0; transform:translateY(-8px);
  transition:opacity var(--ease),transform var(--ease);
}
.mobile-nav-menu.open { display:flex; opacity:1; transform:none; }
.mobile-nav-menu a {
  padding:11px 16px; border-radius:8px;
  font-weight:500; color:var(--text); transition:background var(--ease);
}
.mobile-nav-menu a:hover,.mobile-nav-menu a.active { background:var(--pt10); color:var(--primary); }
.mobile-nav-menu .btn-primary {
  background:var(--primary); color:#fff !important;
  text-align:center; border-radius:8px; margin-top:4px;
}
.mobile-nav-menu .btn-primary:hover { background:var(--accent); }

/* ─── Desktop Nav Dropdown ────────────────────────────────────────── */
.nav-dropdown { position:relative; display:flex; align-items:center; }
.nav-dd-trigger {
  display:flex; align-items:center; gap:3px; cursor:pointer;
  font-size:.85rem; font-weight:500; letter-spacing:.01em;
  color:rgba(255,255,255,.88); position:relative;
  transition:color var(--ease); white-space:nowrap;
}
.nav-dd-trigger::after {
  content:''; position:absolute; bottom:-3px; left:0;
  height:2px; width:0; background:var(--accent); border-radius:2px;
  transition:width var(--ease);
}
.nav-dropdown:hover .nav-dd-trigger::after { width:100%; }
.nav-dropdown:hover .nav-dd-trigger { color:var(--accent); }
header.scrolled .nav-dd-trigger { color:var(--text); }
header.scrolled .nav-dropdown:hover .nav-dd-trigger { color:var(--primary); }
.nav-dd-trigger > i { font-size:.85em; transition:transform var(--ease); }
.nav-dropdown:hover .nav-dd-trigger > i { transform:rotate(180deg); }

/* Main panel — vertical list of two tab rows */
.nav-dd-panel {
  position:absolute; top:100%; left:50%;
  transform:translateX(-50%) translateY(-8px);
  background:var(--white); border-radius:10px;
  box-shadow:0 8px 32px rgba(0,0,0,.13);
  padding:18px 5px 5px; /* top padding bridges the gap visually */
  display:flex; flex-direction:column; gap:2px;
  opacity:0; visibility:hidden; pointer-events:none;
  transition:opacity var(--ease), transform var(--ease);
  min-width:170px; z-index:999;
}
/* visible card sits below the transparent bridge */
.nav-dd-panel::before {
  content:''; position:absolute; top:18px; left:0; right:0; bottom:0;
  background:var(--white); border-radius:10px;
  border:1px solid var(--border);
  box-shadow:0 8px 32px rgba(0,0,0,.13); z-index:-1;
}
.nav-dropdown:hover .nav-dd-panel,
.nav-dropdown:focus-within .nav-dd-panel {
  opacity:1; visibility:visible; pointer-events:auto;
  transform:translateX(-50%) translateY(0);
}

/* Each row (NCERT Solutions / CBSE) */
.nav-dd-item {
  position:relative;
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:10px 14px; border-radius:7px;
  font-size:.85rem; font-weight:600; color:var(--text);
  cursor:default; white-space:nowrap;
  transition:background var(--ease), color var(--ease);
}
.nav-dd-item:hover { background:var(--pt10); color:var(--primary); }
.nav-dd-item > i {
  font-size:.88em; opacity:.55;
  transition:transform var(--ease), opacity var(--ease);
}
.nav-dd-item:hover > i { opacity:1; transform:translateX(3px); }

/* Flyout sub-menu that appears to the right */
.nav-dd-sub {
  position:absolute; left:100%; top:-5px;
  /* left padding bridges the gap so hover doesn't break */
  padding:5px 5px 5px 10px;
  display:flex; flex-direction:column; gap:2px;
  min-width:210px; z-index:1000;
  opacity:0; visibility:hidden; pointer-events:none;
  transform:translateX(-6px);
  transition:opacity var(--ease), transform var(--ease), visibility 0s var(--ease);
}
/* visible card positioned inside the padding bridge */
.nav-dd-sub::before {
  content:''; position:absolute; top:0; left:10px; right:0; bottom:0;
  background:var(--white); border-radius:10px;
  border:1px solid var(--border);
  box-shadow:0 8px 28px rgba(0,0,0,.12); z-index:-1;
}
.nav-dd-item:hover .nav-dd-sub {
  opacity:1; visibility:visible; pointer-events:auto;
  transform:translateX(0);
  transition:opacity var(--ease), transform var(--ease), visibility 0s;
}
.nav-dd-sub a {
  padding:9px 13px; border-radius:7px;
  font-size:.79rem; font-weight:500; color:var(--text);
  white-space:nowrap; display:block;
  transition:background var(--ease), color var(--ease);
}
.nav-dd-sub a:hover { background:var(--pt10); color:var(--primary); }
.nav-dd-sub a::after { display:none !important; }

/* Flat links inside a panel (no flyout) */
a.nav-dd-link {
  display:block; padding:10px 14px; border-radius:7px;
  font-size:.85rem; font-weight:600; color:var(--text);
  white-space:nowrap; text-decoration:none;
  transition:background var(--ease), color var(--ease);
}
a.nav-dd-link:hover { background:var(--pt10); color:var(--primary); }
a.nav-dd-link::after { display:none !important; }

/* ─── Mobile Nav Dropdown ─────────────────────────────────────────── */
.mobile-dd { display:flex; flex-direction:column; }
.mobile-dd-toggle {
  display:flex; align-items:center; justify-content:space-between;
  padding:11px 16px; border-radius:8px;
  font-weight:500; color:var(--text);
  cursor:pointer; transition:background var(--ease);
  font-size:inherit;
}
.mobile-dd-toggle:hover { background:var(--pt10); color:var(--primary); }
.mobile-dd-toggle.open { background:var(--pt10); color:var(--primary); }
.mobile-dd-toggle i { transition:transform var(--ease); font-size:.9em; }
.mobile-dd-toggle.open i { transform:rotate(180deg); }
.mobile-dd-items {
  display:none; flex-direction:column;
  padding:0 8px 6px 8px;
}
.mobile-dd-items.open { display:flex; }
.mobile-dd-label {
  font-size:.69rem; font-weight:700; text-transform:uppercase;
  letter-spacing:.07em; color:var(--muted);
  padding:8px 16px 3px; margin-top:4px;
}
.mobile-dd-items a {
  padding:8px 16px; border-radius:8px;
  font-size:.84rem; font-weight:500; color:var(--text);
  transition:background var(--ease);
}
.mobile-dd-items a:hover { background:var(--pt10); color:var(--primary); }

/* ─── Study Material Page ─────────────────────────────────────────── */
.sm-tabs { display:flex; gap:4px; border-bottom:2px solid var(--border); margin-bottom:40px; }
.sm-tab-btn {
  padding:11px 26px; border:none; background:none;
  font-family:inherit; font-size:.92rem; font-weight:600;
  color:var(--muted); cursor:pointer; border-bottom:3px solid transparent;
  margin-bottom:-2px; border-radius:8px 8px 0 0;
  transition:color var(--ease), border-color var(--ease), background var(--ease);
}
.sm-tab-btn:hover { color:var(--primary); background:var(--pt10); }
.sm-tab-btn.active { color:var(--primary); border-bottom-color:var(--primary); background:var(--pt10); }
.sm-tab-pane { display:none; }
.sm-tab-pane.active { display:block; }

.sm-subject-section { margin-bottom:48px; }
.sm-subject-title {
  font-size:1.1rem; font-weight:700; color:var(--text);
  margin-bottom:18px; display:flex; align-items:center; gap:10px;
}
.sm-subject-title::after {
  content:''; flex:1; height:1px; background:var(--border);
}
.sm-cards-grid {
  display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:16px;
}
.sm-card {
  border:1.5px solid var(--border); border-radius:12px;
  padding:20px; display:flex; flex-direction:column; gap:12px;
  transition:border-color var(--ease), box-shadow var(--ease), transform var(--ease);
  background:var(--white);
}
.sm-card:hover {
  border-color:var(--primary); box-shadow:0 4px 18px rgba(186,117,23,.12);
  transform:translateY(-2px);
}
.sm-card-icon {
  width:44px; height:44px; border-radius:10px;
  background:var(--at14); display:flex; align-items:center; justify-content:center;
  font-size:1.3rem; color:var(--primary);
}
.sm-card-title { font-size:.93rem; font-weight:700; color:var(--text); }
.sm-card-meta { font-size:.78rem; color:var(--muted); }
.sm-card-btn {
  margin-top:auto; display:inline-flex; align-items:center; gap:6px;
  font-size:.80rem; font-weight:700; color:var(--primary);
  padding:7px 16px; border-radius:99px;
  border:1.5px solid var(--primary);
  transition:background var(--ease), color var(--ease);
  width:fit-content;
}
.sm-card-btn:hover { background:var(--primary); color:#fff; }

.sm-cbse-grid {
  display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:16px;
}
.sm-cbse-card {
  border:1.5px solid var(--border); border-radius:12px;
  padding:22px 18px; text-align:center;
  display:flex; flex-direction:column; align-items:center; gap:10px;
  transition:border-color var(--ease), box-shadow var(--ease), transform var(--ease);
  background:var(--white); cursor:pointer;
}
.sm-cbse-card:hover {
  border-color:var(--primary); box-shadow:0 4px 18px rgba(186,117,23,.12);
  transform:translateY(-3px);
}
.sm-cbse-icon {
  width:52px; height:52px; border-radius:14px;
  background:linear-gradient(135deg,var(--primary),var(--accent));
  display:flex; align-items:center; justify-content:center;
  font-size:1.5rem; color:#fff;
}
.sm-cbse-name { font-size:.92rem; font-weight:700; color:var(--text); }
.sm-cbse-desc { font-size:.75rem; color:var(--muted); line-height:1.4; }
.sm-cbse-card .sm-card-btn { margin:0; }

.sm-coming-soon {
  display:inline-flex; align-items:center; gap:5px;
  font-size:.75rem; font-weight:600;
  color:var(--muted); background:rgba(0,0,0,.04);
  padding:4px 12px; border-radius:99px; margin-top:4px;
}

@media(max-width:600px) {
  .sm-cards-grid { grid-template-columns:1fr 1fr; }
  .sm-cbse-grid  { grid-template-columns:repeat(3,1fr); }
  .sm-tab-btn    { padding:10px 16px; font-size:.84rem; }
}

/* ════════════════════════════════════════════════════════════════
   HERO — Full (Homepage)
════════════════════════════════════════════════════════════════ */
.hero-full {
  min-height:100vh;
  background:linear-gradient(140deg,#160600 0%,#3a1a00 45%,#5e2e00 75%,var(--primary) 100%);
  display:flex; align-items:center;
  position:relative; overflow:hidden;
  padding:calc(68px + var(--sp)*7) 0 calc(var(--sp)*10);
}
.hero-radial {
  position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(ellipse at 15% 55%,rgba(239,159,39,.09),transparent 55%),
             radial-gradient(ellipse at 80% 15%,rgba(186,117,23,.13),transparent 45%);
}
.orb {
  position:absolute; border-radius:50%;
  background:rgba(239,159,39,.06); pointer-events:none;
  animation:floatBob 6s ease-in-out infinite;
}
.orb-1{width:320px;height:320px;top:8%;right:8%;animation-delay:0s}
.orb-2{width:180px;height:180px;top:62%;right:24%;animation-delay:2s}
.orb-3{width:90px;height:90px;top:32%;right:4%;animation-delay:4s}

.hero-content-wrap { position:relative; z-index:2; width:100%; }
.hero-content { max-width:660px; }

.hero-badge {
  display:inline-flex; align-items:center; gap:8px;
  background:rgba(239,159,39,.13);
  border:1px solid rgba(239,159,39,.28);
  color:var(--accent); font-size:.83rem; font-weight:600;
  padding:5px 15px; border-radius:var(--r-pill);
  margin-bottom:calc(var(--sp)*3);
  animation:fadeUp .7s ease both;
}
.badge-dot {
  width:7px; height:7px; border-radius:50%; background:var(--accent);
  animation:pulse-ring 2s ease infinite;
}

.hero-title {
  color:var(--white);
  margin-bottom:calc(var(--sp)*3);
  animation:fadeUp .8s .08s ease both;
}
.hero-title .accent-text { color:var(--accent); }
#tw-text {
  color:var(--accent);
  border-right:2.5px solid var(--accent); padding-right:2px;
  animation:blinkCaret .8s step-end infinite;
}

.hero-desc {
  color:rgba(255,255,255,.72); font-size:1.08rem; max-width:520px;
  margin-bottom:calc(var(--sp)*4);
  animation:fadeUp .8s .16s ease both;
}
.hero-buttons {
  display:flex; gap:14px; flex-wrap:wrap;
  margin-bottom:calc(var(--sp)*3);
  animation:fadeUp .8s .24s ease both;
}
.hero-rating {
  display:inline-flex; align-items:center; gap:10px;
  animation:fadeUp .8s .32s ease both;
  margin-bottom:calc(var(--sp)*5);
}
.rating-badge {
  background:var(--accent); color:#fff;
  padding:6px 12px; border-radius:8px;
  font-weight:800; font-size:.95rem;
  display:flex; align-items:center; gap:4px;
}
.rating-text { font-size:.82rem; color:rgba(255,255,255,.70); font-weight:600; }

.hero-image-area {
  position:relative; z-index:2;
  display:flex; justify-content:center;
}
.hero-main-img { border-radius:var(--r-lg); max-width:480px; width:100%; }
.floating-card {
  position:absolute; background:var(--white);
  border-radius:var(--r); padding:12px 16px;
  display:flex; align-items:center; gap:12px;
  box-shadow:var(--sh-lg);
  animation:floatBob 4s ease-in-out infinite;
}
.floating-card-1 { bottom:10%; left:-5%; animation-delay:0s; }
.floating-card-2 { top:15%; right:-5%; animation-delay:2s; }
.floating-card i  { font-size:1.8rem; color:var(--primary); }
.floating-card-text strong, .floating-card-text h4 { font-size:.9rem; margin-bottom:2px; display:block; color:var(--text); }
.floating-card-text p  { font-size:.75rem; color:var(--muted) !important; }

.hero-stats-row {
  display:flex; gap:calc(var(--sp)*5); flex-wrap:wrap;
  animation:fadeUp .8s .4s ease both;
}
.hero-stat strong {
  display:block; font-size:1.7rem; font-weight:800;
  color:var(--accent); line-height:1;
}
.hero-stat span { font-size:.78rem; color:rgba(255,255,255,.60); }

.hero-wave {
  position:absolute; bottom:-1px; left:0; right:0;
  overflow:hidden; line-height:0; pointer-events:none;
}
.wave-track { display:flex; width:200%; animation:waveMove 11s linear infinite; }
.wave-track svg { flex:0 0 50%; height:72px; }

/* ─── HERO — Inner Pages ─────────────────────────────────────── */
.hero {
  background:linear-gradient(140deg,#160600 0%,#3a1a00 50%,var(--primary) 100%);
  padding:calc(68px + var(--sp)*5) 0 calc(var(--sp)*8);
  position:relative; overflow:hidden; text-align:center;
}
.hero h1 { color:var(--white); margin-bottom:calc(var(--sp)*2); }
.hero p   { color:rgba(255,255,255,.72); }
.hero .badge,.hero .label { background:rgba(239,159,39,.18); color:var(--accent); }

/* ─── TRUST BADGES BAR ───────────────────────────────────────── */
.trust-badges { background:var(--pt10); padding:calc(var(--sp)*4) 0; }
.badges-wrapper {
  display:flex; align-items:center; justify-content:center;
  gap:calc(var(--sp)*6); flex-wrap:wrap;
}
.badge-item { display:flex; align-items:center; gap:14px; }
.badge-item i { font-size:2rem; color:var(--primary); flex-shrink:0; }
.badge-item-text h4 { font-size:.95rem; margin-bottom:2px; }
.badge-item-text p  { font-size:.78rem; color:var(--muted); }

/* ─── FEATURE CARDS ──────────────────────────────────────────── */
.feature-card { text-align:center; }
.feature-icon-wrapper {
  width:60px; height:60px; border-radius:14px;
  background:var(--at14);
  display:flex; align-items:center; justify-content:center;
  margin:0 auto calc(var(--sp)*2); color:var(--primary);
}
.feature-icon-wrapper i { font-size:1.6rem; }
.feature-card h3 { margin-bottom:calc(var(--sp)*1); }
.feature-card p  { color:var(--muted); font-size:.9rem; margin-bottom:calc(var(--sp)*2); }
.feature-link {
  font-size:.85rem; font-weight:600; color:var(--primary);
  display:inline-flex; align-items:center; gap:4px;
  transition:gap var(--ease);
}
.feature-link:hover { gap:8px; }

/* ─── STATS BAR ──────────────────────────────────────────────── */
.stats { background:linear-gradient(135deg,var(--primary),#d48c20); }
.stats-grid {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:calc(var(--sp)*4); text-align:center;
}
.stat-item { padding:calc(var(--sp)*3) 0; }
.stat-number {
  font-size:2.8rem; font-weight:800; line-height:1;
  color:var(--white); margin-bottom:6px;
  display:block;
}
.stat-item p { color:rgba(255,255,255,.80); font-size:.88rem; }

/* ─── SCORER CARDS ───────────────────────────────────────────── */
.score-green { background:rgba(16,185,129,.10); color:#0a8a5a; }
.score-blue  { background:var(--pt10); color:var(--primary); }

/* ─── COURSE CARDS ───────────────────────────────────────────── */
.course-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(320px,1fr));
  gap:calc(var(--sp)*4);
}
.course-card { border-radius:var(--r-lg); overflow:hidden; }
.course-header { margin-bottom:calc(var(--sp)*2); }
.course-header h3 { font-size:1.3rem; margin:calc(var(--sp)*1) 0 4px; }
.course-price { font-size:.85rem; color:var(--muted); font-weight:500; }
.course-features { display:flex; flex-direction:column; gap:10px; margin-bottom:calc(var(--sp)*3); }
.course-features li { display:flex; align-items:flex-start; gap:10px; font-size:.9rem; }
.course-features li i { color:var(--primary); font-size:1.1rem; flex-shrink:0; margin-top:2px; }

/* ─── ABOUT / FACULTY ────────────────────────────────────────── */
.about-grid {
  display:grid; grid-template-columns:360px 1fr;
  gap:calc(var(--sp)*7); align-items:flex-start;
}
.faculty-img-wrapper { position:relative; }
.faculty-img { border-radius:var(--r-lg); width:100%; box-shadow:var(--sh-lg); }
.about-bullets { display:flex; flex-direction:column; gap:calc(var(--sp)*3); }
.about-bullet  { display:flex; gap:14px; }
.about-bullet-icon {
  width:44px; height:44px; border-radius:10px;
  background:var(--at14);
  display:flex; align-items:center; justify-content:center;
  color:var(--primary); font-size:1.3rem; flex-shrink:0;
}
.about-bullet-text h4 { margin-bottom:4px; }
.about-bullet-text p  { font-size:.88rem; color:var(--muted); }

/* ─── CONTACT ────────────────────────────────────────────────── */
.contact-grid {
  display:grid; grid-template-columns:1fr 1fr;
  gap:calc(var(--sp)*7); align-items:flex-start;
}
.contact-info-list { display:flex; flex-direction:column; gap:calc(var(--sp)*3); }
.contact-item { display:flex; gap:14px; align-items:flex-start; }
.contact-icon {
  width:44px; height:44px; border-radius:10px;
  background:var(--at14);
  display:flex; align-items:center; justify-content:center;
  color:var(--primary); font-size:1.3rem; flex-shrink:0;
}
.contact-text h4 { margin-bottom:4px; }
.contact-text p,.contact-text a { font-size:.9rem; color:var(--muted); transition:color var(--ease); }
.contact-text a:hover { color:var(--primary); }

.enquiry-form {
  background:var(--pt10);
  border:1px solid rgba(186,117,23,.18);
  border-radius:var(--r-lg);
  padding:calc(var(--sp)*4);
}
.enquiry-form h3 { color:var(--primary) !important; margin-bottom:calc(var(--sp)*3) !important; font-family:inherit !important; text-align:center; }
.form-group { margin-bottom:calc(var(--sp)*2.5); }
.form-group label {
  display:block; font-size:.85rem; font-weight:600;
  margin-bottom:6px; color:var(--text);
}
.form-control {
  width:100%; padding:11px 16px;
  border:1.5px solid var(--border); border-radius:var(--r);
  font-size:.95rem; background:var(--white); color:var(--text);
  outline:none; transition:border-color var(--ease);
  font-family:inherit;
}
.form-control:focus { border-color:var(--primary); }
select.form-control { appearance:none; cursor:pointer; }

.map-container {
  border-radius:var(--r-lg); overflow:hidden;
  height:380px; box-shadow:var(--sh-md);
  margin-top:calc(var(--sp)*5);
}
.map-container iframe { width:100%; height:100%; border:none; }

/* ─── TESTIMONIALS ───────────────────────────────────────────── */
.testimonials-section { background:var(--pt10); }
.testimonials-slider  { max-width:700px; margin:0 auto; text-align:center; }
.testimonial-slide    { padding:calc(var(--sp)*3) 0; }
.quote-icon  { font-size:2.5rem; color:var(--primary); margin-bottom:calc(var(--sp)*2); }
.testimonial-text  { color:var(--muted); font-size:1rem; font-style:italic; line-height:1.75; margin-bottom:calc(var(--sp)*3); }
.testimonial-stars { color:var(--accent); font-size:1.1rem; margin-bottom:calc(var(--sp)*1.5); }
.testimonial-author { font-size:1.05rem; font-weight:700; color:var(--text); margin-bottom:4px; }
.testimonial-school { font-size:.82rem; color:var(--muted); }
.slider-dots { display:flex; justify-content:center; gap:8px; margin-top:calc(var(--sp)*3); }
.slider-dot {
  width:10px; height:10px; border-radius:50%;
  background:rgba(186,117,23,.25); border:none; cursor:pointer;
  transition:background var(--ease);
}
.slider-dot.active { background:var(--primary); }

/* testi page cards */
.testi-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(300px,1fr));
  gap:calc(var(--sp)*3.5);
}
.testi-card {
  background:var(--white); border:1px solid var(--border);
  border-radius:var(--r-lg); padding:calc(var(--sp)*4);
  transition:transform var(--ease),box-shadow var(--ease);
}
.testi-card:hover { transform:translateY(-4px); box-shadow:var(--sh-lg); }
.testi-quote { font-size:3rem; line-height:1; font-family:Georgia,serif; color:var(--accent); opacity:.55; }
.stars { display:flex; gap:2px; margin-bottom:calc(var(--sp)*1.5); }
.star  { color:var(--accent); font-size:.95rem; }
.testi-author {
  display:flex; align-items:center; gap:11px;
  border-top:1px solid var(--border); padding-top:calc(var(--sp)*2);
}
.author-av {
  width:42px; height:42px; border-radius:50%; flex-shrink:0;
  background:linear-gradient(135deg,var(--primary),var(--accent));
  display:flex; align-items:center; justify-content:center;
  color:#fff; font-weight:700; font-size:.95rem;
}
.author-info strong { display:block; font-size:.88rem; }
.author-info span   { font-size:.78rem; color:var(--muted); }

.testi-photo-card { display:flex; gap:20px; align-items:flex-start; }
.testi-photo-card img {
  width:80px; height:80px; border-radius:50%;
  object-fit:cover; border:3px solid var(--accent); flex-shrink:0;
}

/* ─── SCREENSHOT GALLERY ─────────────────────────────────────── */
.screenshot-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(200px,1fr));
  gap:calc(var(--sp)*2.5);
}
.screenshot-card {
  position:relative; border-radius:var(--r); overflow:hidden;
  cursor:pointer; border:2px solid var(--border);
  transition:border-color var(--ease),transform var(--ease),box-shadow var(--ease);
}
.screenshot-card:hover { border-color:var(--primary); transform:translateY(-3px); box-shadow:var(--sh-lg); }
.screenshot-card img { width:100%; display:block; }
.screenshot-overlay {
  position:absolute; inset:0; background:rgba(186,117,23,.55);
  display:flex; align-items:center; justify-content:center;
  opacity:0; transition:opacity var(--ease);
}
.screenshot-overlay i { font-size:2rem; color:#fff; }
.screenshot-card:hover .screenshot-overlay { opacity:1; }

.lightbox {
  position:fixed; inset:0; z-index:2000;
  background:rgba(0,0,0,.90);
  display:flex; align-items:center; justify-content:center;
  opacity:0; pointer-events:none; transition:opacity var(--ease);
}
.lightbox.open { opacity:1; pointer-events:all; }
.lightbox-content {
  max-width:90vw; max-height:90vh;
  border-radius:var(--r); box-shadow:0 20px 60px rgba(0,0,0,.5);
}
.lightbox-close {
  position:absolute; top:20px; right:20px;
  background:rgba(255,255,255,.15); border:none; color:#fff;
  border-radius:50%; width:40px; height:40px;
  display:flex; align-items:center; justify-content:center;
  font-size:1.4rem; cursor:pointer; transition:background var(--ease);
}
.lightbox-close:hover { background:rgba(255,255,255,.3); }

/* ─── RESULTS / ACHIEVERS ────────────────────────────────────── */
.results-landing-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(340px,1fr));
  gap:calc(var(--sp)*4);
}
.results-landing-card { text-align:center; }
.results-landing-card > i { font-size:3rem; color:var(--primary); display:block; margin-bottom:calc(var(--sp)*2); }

.top-achievers-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(230px,1fr));
  gap:calc(var(--sp)*3); margin-bottom:calc(var(--sp)*5);
}
.achiever-card { text-align:center; }
.achiever-avatar {
  width:64px; height:64px; border-radius:50%;
  background:linear-gradient(135deg,var(--primary),var(--accent));
  color:#fff; font-weight:800; font-size:1.1rem;
  display:flex; align-items:center; justify-content:center;
  margin:0 auto calc(var(--sp)*2);
  box-shadow:0 4px 14px rgba(186,117,23,.28);
}
.achiever-card h4 { margin-bottom:4px; }
.achiever-details { font-size:.8rem; color:var(--muted); margin-bottom:calc(var(--sp)*2); }
.achiever-scores { display:flex; flex-wrap:wrap; gap:6px; justify-content:center; }
.achiever-score-badge {
  font-size:.75rem; font-weight:700; padding:3px 10px;
  border-radius:var(--r-pill);
  background:var(--pt10); color:var(--primary);
}

.results-filter-row,.results-filter-bar { display:flex; gap:12px; flex-wrap:wrap; margin-bottom:calc(var(--sp)*4); align-items:center; }
.results-filter-row select,
.results-filter-row input[type=text],
.year-select {
  padding:10px 14px; border:1.5px solid var(--border); border-radius:var(--r);
  font-size:.9rem; outline:none; transition:border-color var(--ease); font-family:inherit;
  background:var(--white); color:var(--text); cursor:pointer;
}
.results-filter-row select:focus,
.results-filter-row input:focus,
.year-select:focus { border-color:var(--primary); }

.search-input-wrapper {
  display:flex; align-items:center; gap:10px;
  border:1.5px solid var(--border); border-radius:var(--r);
  padding:0 14px; background:var(--white); flex:1; min-width:220px;
  transition:border-color var(--ease);
}
.search-input-wrapper:focus-within { border-color:var(--primary); }
.search-input-wrapper i { color:var(--muted); font-size:1.1rem; flex-shrink:0; }
.search-input {
  border:none; outline:none; padding:10px 0;
  font-size:.9rem; background:transparent; color:var(--text);
  font-family:inherit; width:100%;
}
.text-saffron { color:var(--primary); font-weight:700; }

.results-table-wrap,.results-table-container { overflow-x:auto; border-radius:var(--r); box-shadow:var(--sh-md); }
.results-table { width:100%; border-collapse:collapse; font-size:.9rem; }
.results-table thead th {
  background:var(--primary); color:#fff;
  padding:13px 16px; font-weight:600; text-align:left; white-space:nowrap;
}
.results-table thead th:first-child { border-radius:var(--r) 0 0 0; }
.results-table thead th:last-child  { border-radius:0 var(--r) 0 0; }
.results-table tbody td { padding:11px 16px; border-bottom:1px solid var(--border); }
.results-table tbody tr:last-child td { border-bottom:none; }
.results-table tbody tr:nth-child(even) td { background:var(--pt10); }
.results-table tbody tr:hover td { background:var(--at14); }
.score-100 { color:#0a8a5a; font-weight:700; }
.score-90  { color:var(--primary); font-weight:600; }
.student-name  { font-weight:600; }
.student-school { font-size:.85rem; color:var(--muted); }
.student-school i { color:var(--primary); margin-right:4px; }
.score-cell   { font-weight:600; text-align:center; }
.score-perfect { color:#0a8a5a; }
.student-rank {
  display:inline-flex; align-items:center; gap:4px;
  background:var(--at14); color:var(--primary);
  padding:2px 8px; border-radius:var(--r-pill); font-weight:700; font-size:.82rem;
}
.student-rank i { font-size:.9rem; }

/* ─── VIDEO SECTION ──────────────────────────────────────────── */
.category-filter { display:flex; gap:10px; flex-wrap:wrap; margin-bottom:calc(var(--sp)*5); }
.filter-btn {
  padding:8px 20px; border-radius:var(--r-pill);
  border:2px solid var(--border); background:var(--white);
  font-size:.88rem; font-weight:600; color:var(--muted);
  cursor:pointer; transition:all var(--ease);
}
.filter-btn:hover,.filter-btn.active { background:var(--primary); color:#fff; border-color:var(--primary); }

.video-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(300px,1fr));
  gap:calc(var(--sp)*3.5);
}
.video-card { border-radius:var(--r-lg); overflow:hidden; border:1px solid var(--border); background:var(--white); transition:transform var(--ease),box-shadow var(--ease); }
.video-card:hover { transform:translateY(-4px); box-shadow:var(--sh-lg); }
.video-embed,.video-wrapper { position:relative; width:100%; padding-bottom:56.25%; background:#000; }
.video-embed iframe,.video-wrapper iframe { position:absolute; inset:0; width:100%; height:100%; border:none; }
.video-info { padding:calc(var(--sp)*2.5) calc(var(--sp)*3) calc(var(--sp)*3); }
.video-info h3,.video-info h4 { font-size:1rem; margin-bottom:8px; }
.video-info p  { font-size:.83rem; color:var(--muted); }
.video-meta { display:flex; gap:12px; align-items:center; font-size:.8rem; color:var(--muted); flex-wrap:wrap; }
.video-category { background:var(--at14); color:var(--primary); padding:2px 10px; border-radius:var(--r-pill); font-size:.75rem; font-weight:600; }

/* ─── APP PROMO ──────────────────────────────────────────────── */
.app-promo {
  background:linear-gradient(135deg,#1a0a00,#3a1a00,var(--primary));
  color:var(--white);
}
.app-wrapper {
  display:grid; grid-template-columns:1fr auto;
  gap:calc(var(--sp)*7); align-items:center;
}
.app-content .badge { background:rgba(239,159,39,.18); color:var(--accent); }
.app-content h2 { color:var(--white); margin:calc(var(--sp)*2) 0; font-size:clamp(1.5rem,3vw,2rem); }
.app-content p  { color:rgba(255,255,255,.72); margin-bottom:calc(var(--sp)*4); max-width:520px; }
.app-ctas { display:flex; gap:20px; align-items:center; flex-wrap:wrap; }
.playstore-btn { height:50px; width:auto; }
.qr-code-wrapper { display:flex; align-items:center; gap:12px; }
.qr-code { width:72px; height:72px; border-radius:8px; background:#fff; }
.qr-text { font-size:.78rem; color:rgba(255,255,255,.70); line-height:1.5; }
.qr-text strong { color:rgba(255,255,255,.90); }
.app-mockup { display:flex; justify-content:flex-end; }
.mockup-main { max-height:380px; width:auto; filter:drop-shadow(0 20px 40px rgba(0,0,0,.4)); }

/* ─── ENROLL / CTA SECTION ───────────────────────────────────── */
.enroll-cta {
  background:linear-gradient(140deg,#160600 0%,#3a1a00 50%,var(--primary) 100%);
  position:relative; overflow:hidden; text-align:center;
}
.enroll-cta-radial {
  position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(ellipse at 20% 50%,rgba(239,159,39,.10),transparent 55%),
             radial-gradient(ellipse at 80% 25%,rgba(186,117,23,.13),transparent 45%);
}
.enroll-cta .container { position:relative; z-index:2; }
.enroll-cta h2 { color:var(--white); margin-bottom:calc(var(--sp)*2); }
.enroll-cta p  { color:rgba(255,255,255,.70); max-width:520px; margin:0 auto calc(var(--sp)*6); }
.cta-btn-row { display:flex; justify-content:center; gap:16px; flex-wrap:wrap; }

/* ─── FOOTER ─────────────────────────────────────────────────── */
footer {
  background:#140500;
  color:rgba(255,255,255,.65);
  padding:calc(var(--sp)*9) 0 calc(var(--sp)*4);
}
.footer-grid {
  display:grid; grid-template-columns:2fr 1fr 1fr 1.2fr;
  gap:calc(var(--sp)*6); margin-bottom:calc(var(--sp)*7);
}
.footer-col h3 {
  font-size:.85rem; font-weight:700;
  text-transform:uppercase; letter-spacing:.09em;
  color:var(--white); margin-bottom:calc(var(--sp)*3);
}
.footer-logo-desc { font-size:.83rem; line-height:1.75; max-width:280px; margin-top:calc(var(--sp)*2); }
.footer-links { display:flex; flex-direction:column; gap:calc(var(--sp)*1.5); }
.footer-links a { font-size:.83rem; transition:color var(--ease); }
.footer-links li a { display:block; }
.footer-links a:hover { color:var(--accent); }
.footer-contact { display:flex; flex-direction:column; gap:calc(var(--sp)*2); }
.footer-contact li { display:flex; gap:10px; font-size:.83rem; align-items:flex-start; }
.footer-contact li i { color:var(--accent); flex-shrink:0; margin-top:2px; }
.footer-socials { display:flex; gap:9px; margin-top:calc(var(--sp)*3); }
.social-icon {
  width:34px; height:34px; border-radius:8px;
  background:rgba(255,255,255,.08);
  display:flex; align-items:center; justify-content:center;
  color:rgba(255,255,255,.65); font-size:1rem;
  transition:background var(--ease),color var(--ease);
}
.social-icon:hover { background:var(--primary); color:#fff; }
.footer-bottom {
  border-top:1px solid rgba(255,255,255,.08);
  padding-top:calc(var(--sp)*3.5);
  display:flex; justify-content:space-between; align-items:center;
  flex-wrap:wrap; gap:12px; font-size:.78rem;
}
.footer-policy-links { display:flex; gap:16px; flex-wrap:wrap; }
.footer-policy-links a { color:rgba(255,255,255,.50); font-size:.78rem; transition:color var(--ease); }
.footer-policy-links a:hover { color:var(--accent); }

/* ─── WHATSAPP WIDGET ────────────────────────────────────────── */
.whatsapp-widget {
  position:fixed; bottom:80px; right:22px; z-index:800;
  display:flex; flex-direction:column; align-items:flex-end; gap:12px;
}
.wa-trigger {
  width:52px; height:52px; border-radius:50%;
  background:#25D366;
  display:flex; align-items:center; justify-content:center;
  cursor:pointer; box-shadow:0 4px 18px rgba(37,211,102,.4);
  transition:transform var(--ease); position:relative;
}
.wa-trigger:hover { transform:scale(1.1); }
.wa-trigger i { font-size:1.8rem; color:#fff; }
.wa-badge {
  position:absolute; top:-2px; right:-2px;
  width:12px; height:12px; border-radius:50%;
  background:#ef4444; border:2px solid #fff;
  animation:pulse-ring 2s infinite;
}
.wa-bubble {
  background:#fff; border-radius:var(--r-lg);
  box-shadow:0 8px 32px rgba(0,0,0,.15);
  width:300px; overflow:hidden;
  display:none;
}
.wa-bubble.open { display:block; }
.wa-header {
  background:#075E54;
  padding:14px 16px; display:flex; align-items:center; gap:12px;
}
.wa-avatar {
  width:40px; height:40px; border-radius:50%; background:#25D366;
  display:flex; align-items:center; justify-content:center;
  color:#fff; font-weight:700; font-size:.9rem;
}
.wa-header-info h4 { color:#fff; font-size:.9rem; margin-bottom:2px; }
.wa-header-info p  { color:rgba(255,255,255,.70); font-size:.75rem; }
.wa-body { padding:16px; }
.wa-msg {
  background:#f0fdf4; border-radius:0 var(--r) var(--r) var(--r);
  padding:12px 14px; font-size:.82rem; color:var(--text);
  line-height:1.55; margin-bottom:14px;
}
.wa-msg-meta { font-size:.7rem; color:var(--muted); margin-top:6px; text-align:right; }
.wa-btn {
  display:flex; align-items:center; justify-content:center; gap:8px;
  background:#25D366; color:#fff; padding:10px; border-radius:8px;
  font-weight:600; font-size:.88rem; transition:background var(--ease);
}
.wa-btn:hover { background:#1da851; }
.wa-btn i { font-size:1.2rem; }

/* ─── SCROLL-TO-TOP ──────────────────────────────────────────── */
.scroll-top {
  position:fixed; bottom:22px; right:22px; z-index:799;
  width:42px; height:42px; border-radius:50%;
  background:var(--primary); color:#fff; border:none;
  display:flex; align-items:center; justify-content:center;
  box-shadow:var(--sh-md);
  opacity:0; transform:translateY(14px);
  transition:opacity var(--ease),transform var(--ease),background var(--ease);
}
.scroll-top.show { opacity:1; transform:none; }
.scroll-top:hover { background:var(--accent); }

/* ─── DEMO MODAL ─────────────────────────────────────────────── */
.modal-overlay {
  position:fixed; inset:0; z-index:1000;
  background:rgba(0,0,0,.55);
  display:flex; align-items:center; justify-content:center;
  padding:calc(var(--sp)*3);
  opacity:0; pointer-events:none; transition:opacity var(--ease);
}
.modal-overlay.open { opacity:1; pointer-events:all; }
.modal-card {
  background:var(--white); border-radius:var(--r-lg);
  width:100%; max-width:480px; overflow:hidden;
  box-shadow:0 20px 60px rgba(0,0,0,.2);
  position:relative;
  transform:scale(.95); transition:transform var(--ease);
}
.modal-overlay.open .modal-card { transform:scale(1); }
.modal-close {
  position:absolute; top:12px; right:12px;
  background:rgba(255,255,255,.3); border:none; color:#fff;
  border-radius:50%; width:34px; height:34px;
  display:flex; align-items:center; justify-content:center;
  font-size:1.3rem; z-index:2; transition:background var(--ease);
}
.modal-close:hover { background:rgba(255,255,255,.5); }
.modal-header-banner {
  background:linear-gradient(135deg,var(--primary),var(--accent));
  padding:calc(var(--sp)*3.5) calc(var(--sp)*4); text-align:center;
}
.modal-header-banner h3 { color:#fff; font-size:1.25rem; margin-bottom:4px; }
.modal-header-banner p  { color:rgba(255,255,255,.80); font-size:.85rem; }
.modal-body { padding:calc(var(--sp)*4); }

/* ─── RESPONSIVE ─────────────────────────────────────────────── */
@media (max-width:1100px) {
  .about-grid { grid-template-columns:1fr 1fr; gap:calc(var(--sp)*5); }
}
@media (max-width:1260px) {
  .nav-links    { display:none; }
  .header-cta   { display:none; }
  .mobile-toggle { display:flex; }
  .footer-grid  { grid-template-columns:1fr 1fr; }
  .about-grid   { grid-template-columns:1fr; }
  .contact-grid { grid-template-columns:1fr; }
  .app-wrapper  { grid-template-columns:1fr; }
  .app-mockup   { display:none; }
  .hero-full .grid-2 { grid-template-columns:1fr; }
  .hero-image-area { display:none; }
}
@media (max-width:600px) {
  .section-padding { padding:calc(var(--sp)*7) 0; }
  .footer-grid  { grid-template-columns:1fr; }
  .footer-bottom { flex-direction:column; text-align:center; }
  .hero-stats-row { gap:calc(var(--sp)*3); }
  .grid-2 { grid-template-columns:1fr; }
  .badges-wrapper { gap:calc(var(--sp)*3); }
}


/* ── Thank You Popup ──────────────────────────────────────────── */
#thankyou-popup {
  position: fixed;
  inset: 0;
  z-index: 2000;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0,0,0,.55);
  backdrop-filter: blur(4px);
  opacity: 0;
  pointer-events: none;
  transition: opacity .3s ease;
}
#thankyou-popup.open {
  opacity: 1;
  pointer-events: all;
}
.ty-card {
  background: #fff;
  border-radius: 24px;
  padding: 48px 36px 40px;
  max-width: 380px;
  width: calc(100% - 40px);
  text-align: center;
  box-shadow: 0 24px 72px rgba(0,0,0,.22);
  transform: scale(.88) translateY(20px);
  transition: transform .35s cubic-bezier(.34,1.56,.64,1);
}
#thankyou-popup.open .ty-card {
  transform: scale(1) translateY(0);
}
.ty-icon-wrap {
  width: 76px; height: 76px; border-radius: 50%;
  background: linear-gradient(135deg, #22c55e, #16a34a);
  display: flex; align-items: center; justify-content: center;
  margin: 0 auto 24px;
  box-shadow: 0 8px 28px rgba(34,197,94,.35);
  animation: ty-pop .5s cubic-bezier(.34,1.56,.64,1) .15s both;
}
@keyframes ty-pop {
  from { transform: scale(0); opacity: 0; }
  to   { transform: scale(1); opacity: 1; }
}
.ty-icon-wrap svg { width: 36px; height: 36px; }
.ty-card h2 {
  font-size: 1.6rem; font-weight: 800;
  color: #1a1a1a; margin-bottom: 12px;
}
.ty-card p {
  font-size: .95rem; color: #555;
  line-height: 1.65; margin-bottom: 28px;
}
.ty-card p strong { color: var(--primary); }
.ty-close-btn {
  display: inline-block;
  padding: 13px 36px;
  background: linear-gradient(135deg, var(--primary), var(--accent));
  color: #fff; border: none; border-radius: 99px;
  font-size: .95rem; font-weight: 700;
  cursor: pointer; font-family: inherit;
  letter-spacing: .02em;
  transition: transform .2s, box-shadow .2s;
  box-shadow: 0 4px 18px rgba(186,117,23,.35);
}
.ty-close-btn:hover { transform: translateY(-2px); box-shadow: 0 8px 28px rgba(186,117,23,.45); }

/* ── SVM Admission Chatbot ──────────────────────────────────────── */
#svm-chatbot {
  position: fixed;
  bottom: 80px;
  right: 22px;
  left: auto;
  z-index: 850;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0;
}
#svm-chat-trigger {
  width: 56px; height: 56px; border-radius: 50%;
  background: #25D366;
  border: none; color: #fff; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 4px 22px rgba(37,211,102,.45);
  transition: transform .25s ease, box-shadow .25s ease;
  position: relative;
}
#svm-chat-trigger:hover { transform: scale(1.10); box-shadow: 0 6px 30px rgba(37,211,102,.65); }
#svm-chat-trigger[aria-expanded="true"] { transform: scale(1.05); }
.svm-trigger-badge {
  position: absolute; top: -3px; right: -3px;
  width: 18px; height: 18px; border-radius: 50%;
  background: #ef4444; border: 2px solid #fff;
  font-size: .6rem; font-weight: 800; color: #fff;
  display: flex; align-items: center; justify-content: center;
  animation: pulse-ring 2s ease infinite;
}
#svm-chat-window {
  position: absolute;
  bottom: 68px; right: 0; left: auto;
  width: 340px;
  background: #fff;
  border-radius: 18px;
  box-shadow: 0 16px 56px rgba(0,0,0,.18);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  max-height: 520px;
  opacity: 0;
  transform: translateY(12px) scale(.97);
  pointer-events: none;
  transition: opacity .25s ease, transform .25s ease;
}
#svm-chat-window.open {
  opacity: 1;
  transform: translateY(0) scale(1);
  pointer-events: all;
}
.svm-chat-header {
  background: #075E54;
  padding: 14px 16px;
  display: flex; align-items: center; justify-content: space-between;
  flex-shrink: 0;
}
.svm-chat-header-left { display: flex; align-items: center; gap: 10px; }
.svm-chat-av {
  width: 38px; height: 38px; border-radius: 50%;
  background: rgba(255,255,255,.22);
  color: #fff; font-weight: 800; font-size: .82rem;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.svm-chat-header h4 { color: #fff; font-size: .9rem; margin-bottom: 1px; font-weight: 700; }
.svm-chat-header p  { color: rgba(255,255,255,.78); font-size: .7rem; margin: 0; }
.svm-chat-header .online-dot {
  display: inline-block; width: 7px; height: 7px;
  border-radius: 50%; background: #4ade80;
  margin-right: 4px; vertical-align: middle;
}
#svm-chat-close {
  background: rgba(255,255,255,.2); border: none; color: #fff;
  width: 28px; height: 28px; border-radius: 50%; cursor: pointer;
  font-size: 1rem; display: flex; align-items: center; justify-content: center;
  transition: background .2s; flex-shrink: 0;
}
#svm-chat-close:hover { background: rgba(255,255,255,.38); }
#svm-chat-messages {
  flex: 1; overflow-y: auto;
  padding: 14px 12px 8px;
  display: flex; flex-direction: column; gap: 10px;
  background: #faf7f2;
  min-height: 180px; max-height: 310px;
  scroll-behavior: smooth;
}
#svm-chat-messages::-webkit-scrollbar { width: 4px; }
#svm-chat-messages::-webkit-scrollbar-track { background: transparent; }
#svm-chat-messages::-webkit-scrollbar-thumb { background: rgba(186,117,23,.25); border-radius: 4px; }
.svm-msg { display: flex; flex-direction: column; gap: 3px; max-width: 100%; }
.svm-msg-user { align-items: flex-end; }
.svm-msg-bot  { align-items: flex-start; }
.svm-msg-bubble {
  padding: 10px 13px; border-radius: 14px;
  font-size: .86rem; line-height: 1.55;
  max-width: 82%; word-break: break-word;
}
.svm-msg-user .svm-msg-bubble {
  background: linear-gradient(135deg, var(--primary), var(--accent));
  color: #fff; border-bottom-right-radius: 4px;
}
.svm-msg-bot .svm-msg-bubble {
  background: #fff; color: #1a1a1a;
  border-bottom-left-radius: 4px;
  box-shadow: 0 2px 8px rgba(0,0,0,.07);
}
.svm-msg-time { font-size: .66rem; color: #bbb; padding: 0 4px; }
.svm-typing { display: flex; gap: 5px; align-items: center; padding: 11px 14px !important; }
.svm-typing span {
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--primary); opacity: .4;
  animation: svmTypingDot .9s ease infinite;
}
.svm-typing span:nth-child(2) { animation-delay: .15s; }
.svm-typing span:nth-child(3) { animation-delay: .30s; }
@keyframes svmTypingDot {
  0%,80%,100% { opacity: .3; transform: translateY(0); }
  40%          { opacity: 1;  transform: translateY(-4px); }
}
.svm-quick-chips { display: flex; flex-wrap: wrap; gap: 6px; padding: 2px 0 4px; }
.svm-chip {
  padding: 6px 11px;
  background: #fff; border: 1.5px solid var(--primary);
  border-radius: 99px; font-size: .75rem; font-weight: 600;
  color: var(--primary); cursor: pointer;
  transition: background .18s, color .18s; font-family: inherit;
}
.svm-chip:hover { background: var(--primary); color: #fff; }
.svm-chat-footer {
  padding: 10px 12px; border-top: 1px solid #eee;
  background: #fff; flex-shrink: 0;
}
.svm-chat-input-row { display: flex; gap: 8px; align-items: center; }
#svm-chat-input {
  flex: 1; border: 1.5px solid #e4e4e4;
  border-radius: 99px; padding: 9px 14px;
  font-size: .86rem; outline: none; font-family: inherit;
  transition: border-color .2s; min-width: 0;
}
#svm-chat-input:focus { border-color: var(--primary); }
#svm-chat-input:disabled { opacity: .6; }
#svm-chat-send {
  width: 38px; height: 38px; border-radius: 50%;
  background: #25D366;
  border: none; color: #fff; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; transition: transform .2s, opacity .2s;
}
#svm-chat-send:hover:not(:disabled) { transform: scale(1.1); }
#svm-chat-send:disabled { opacity: .5; cursor: default; }
#svm-chat-send.loading svg { animation: spin .8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.svm-chat-hint { font-size: .65rem; color: #bbb; text-align: right; margin-top: 4px; }
#svm-lead-panel {
  flex: 1; display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  padding: 28px 22px 20px; background: #faf7f2;
}
.svm-lead-intro { text-align: center; margin-bottom: 22px; }
.svm-lead-icon { display: block; font-size: 2rem; margin-bottom: 10px; }
.svm-lead-intro h4 { font-size: .98rem; font-weight: 700; color: #1a1a1a; margin-bottom: 7px; }
.svm-lead-intro p  { font-size: .81rem; color: #666; line-height: 1.55; }
.svm-lead-fields { width: 100%; display: flex; flex-direction: column; gap: 10px; }
.svm-lead-input {
  width: 100%; padding: 11px 14px;
  border: 1.5px solid #e4e4e4; border-radius: 10px;
  font-size: .88rem; font-family: inherit; outline: none;
  background: #fff; color: #1a1a1a; transition: border-color .2s;
}
.svm-lead-input:focus { border-color: var(--primary); }
.svm-lead-input::placeholder { color: #bbb; }
.svm-lead-btn {
  width: 100%; padding: 12px;
  background: linear-gradient(135deg, var(--primary), var(--accent));
  color: #fff; border: none; border-radius: 10px;
  font-size: .9rem; font-weight: 700; cursor: pointer;
  font-family: inherit; letter-spacing: .02em;
  transition: opacity .2s, transform .18s; margin-top: 2px;
}
.svm-lead-btn:hover:not(:disabled) { opacity: .9; transform: translateY(-1px); }
.svm-lead-btn:disabled { opacity: .55; cursor: default; transform: none; }
.svm-lead-error { font-size: .75rem; color: #dc2626; text-align: center; min-height: 14px; }
.svm-lead-privacy { font-size: .67rem; color: #bbb; text-align: center; margin-top: 14px; line-height: 1.4; }
@media (max-width: 480px) {
  #svm-chatbot { right: 12px; bottom: 70px; }
  #svm-chat-window { width: calc(100vw - 28px); right: 0; bottom: 68px; }
}

/* ─── AUTH MODAL ──────────────────────────────────────────────── */
.svm-auth-overlay {
  position:fixed; inset:0; z-index:3000;
  display:flex; align-items:center; justify-content:center;
  background:rgba(0,0,0,.55); backdrop-filter:blur(5px);
  opacity:0; pointer-events:none; transition:opacity .25s ease;
  padding:16px;
}
.svm-auth-overlay.open { opacity:1; pointer-events:all; }
.svm-auth-card {
  background:#fff; border-radius:20px;
  padding:32px 28px 28px; width:100%; max-width:480px;
  position:relative; max-height:90vh; overflow-y:auto;
  box-shadow:0 24px 60px rgba(0,0,0,.22);
  animation:authSlideIn .28s ease;
}
@keyframes authSlideIn {
  from { transform:translateY(24px); opacity:0; }
  to   { transform:translateY(0);    opacity:1; }
}
.svm-auth-close {
  position:absolute; top:14px; right:16px;
  background:none; border:none; font-size:1.5rem;
  color:#999; cursor:pointer; line-height:1; padding:4px 8px;
  border-radius:8px; transition:background .2s,color .2s;
}
.svm-auth-close:hover { background:#f3f3f3; color:#333; }
.svm-auth-logo-wrap {
  display:flex; align-items:center; gap:12px; margin-bottom:22px;
}
.svm-auth-logo-box {
  width:42px; height:42px; border-radius:10px;
  background:linear-gradient(135deg,var(--primary-dark),var(--accent));
  display:flex; align-items:center; justify-content:center;
  flex-shrink:0;
}
.svm-auth-logo-box span { color:#fff; font-weight:900; font-size:.9rem; letter-spacing:.04em; }
.svm-auth-logo-title { font-size:1rem; font-weight:700; color:var(--text); line-height:1.2; }
.svm-auth-logo-sub { font-size:.72rem; color:var(--text-muted); }
.svm-auth-tabs {
  display:flex; gap:4px; background:#f5f5f5;
  border-radius:10px; padding:4px; margin-bottom:22px;
}
.svm-auth-tab {
  flex:1; background:none; border:none; padding:9px 0;
  border-radius:7px; font-size:.88rem; font-weight:600;
  color:var(--text-muted); cursor:pointer; transition:all .2s;
  font-family:inherit;
}
.svm-auth-tab.active { background:#fff; color:var(--primary); box-shadow:0 2px 8px rgba(0,0,0,.08); }
.svm-auth-panel { display:none; }
.svm-auth-panel.active { display:block; }
.svm-auth-row { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.svm-auth-field { display:flex; flex-direction:column; gap:5px; margin-bottom:14px; }
.svm-auth-field label { font-size:.78rem; font-weight:600; color:var(--text); }
.svm-auth-field input,
.svm-auth-field select {
  border:1.5px solid var(--border); border-radius:9px;
  padding:10px 13px; font-size:.88rem; font-family:inherit;
  color:var(--text); background:#fff; transition:border-color .2s,box-shadow .2s;
  outline:none;
}
.svm-auth-field input:focus,
.svm-auth-field select:focus { border-color:var(--primary); box-shadow:0 0 0 3px rgba(186,117,23,.12); }
.svm-auth-err {
  background:#fef2f2; border:1px solid #fca5a5; border-radius:8px;
  color:#dc2626; font-size:.8rem; padding:8px 12px;
  margin-bottom:12px; display:none;
}
.svm-auth-btn {
  width:100%; padding:13px; background:linear-gradient(135deg,var(--primary-dark),var(--accent));
  color:#fff; border:none; border-radius:10px;
  font-size:.95rem; font-weight:700; font-family:inherit;
  cursor:pointer; transition:opacity .2s,transform .2s;
  box-shadow:0 4px 16px rgba(186,117,23,.30); margin-bottom:14px;
}
.svm-auth-btn:hover:not(:disabled) { opacity:.92; transform:translateY(-1px); }
.svm-auth-btn:disabled { opacity:.55; cursor:default; transform:none; }
.svm-google-btn {
  width:100%; display:flex; align-items:center; justify-content:center; gap:10px;
  padding:11px; background:#fff; color:#3c4043;
  border:1.5px solid #dadce0; border-radius:10px;
  font-size:.88rem; font-weight:600; cursor:pointer;
  transition:background .15s, box-shadow .15s; margin-bottom:14px;
}
.svm-google-btn:hover { background:#f8f8f8; box-shadow:0 2px 8px rgba(0,0,0,.10); }
.svm-auth-divider {
  display:flex; align-items:center; gap:10px;
  color:var(--text-muted); font-size:.78rem; margin-bottom:14px;
}
.svm-auth-divider::before,.svm-auth-divider::after {
  content:''; flex:1; height:1px; background:var(--border);
}
.svm-auth-switch { text-align:center; font-size:.82rem; color:var(--text-muted); margin:0; }
.svm-auth-switch a { color:var(--primary); font-weight:600; text-decoration:none; }
.svm-auth-switch a:hover { text-decoration:underline; }
.svm-forgot-link { display:block; text-align:right; font-size:.75rem; color:var(--text-muted); margin-top:5px; text-decoration:none; transition:color .2s; }
.svm-forgot-link:hover { color:var(--primary); }
.svm-forgot-desc { font-size:.85rem; color:var(--text-muted); margin-bottom:18px; line-height:1.6; }
.svm-auth-ok { background:#f0fdf4; border:1px solid #86efac; border-radius:8px; color:#16a34a; font-size:.82rem; padding:10px 14px; margin-bottom:12px; display:none; }
@media (max-width:480px) {
  .svm-auth-row { grid-template-columns:1fr; gap:0; }
  .svm-auth-card { padding:24px 18px 20px; }
}

/* ─── HEADER LOGIN BUTTON ─────────────────────────────────────── */
.svm-login-wrap { display:flex; align-items:center; }
.btn-auth-outline {
  display:flex; align-items:center; gap:6px;
  padding:8px 16px; border:1.5px solid var(--primary);
  border-radius:99px; background:transparent;
  color:var(--primary); font-size:.82rem; font-weight:700;
  cursor:pointer; font-family:inherit;
  transition:background .2s,color .2s;
  white-space:nowrap;
}
.btn-auth-outline:hover { background:var(--primary); color:#fff; }
.btn-auth-outline i { font-size:1rem; }

/* ─── LOGGED-IN USER CHIP ─────────────────────────────────────── */
.svm-user-chip {
  position:relative; display:flex; align-items:center; gap:7px;
  padding:5px 12px 5px 6px; border-radius:99px;
  background:rgba(186,117,23,.10); cursor:pointer;
  transition:background .2s; user-select:none;
}
.svm-user-chip:hover { background:rgba(186,117,23,.18); }
.svm-user-avatar {
  width:30px; height:30px; border-radius:50%;
  background:linear-gradient(135deg,var(--primary-dark),var(--accent));
  color:#fff; font-size:.82rem; font-weight:800;
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
.svm-user-name { font-size:.82rem; font-weight:700; color:var(--primary-dark); max-width:80px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.svm-user-drop {
  position:absolute; top:calc(100% + 8px); right:0;
  background:#fff; border-radius:10px; padding:6px;
  box-shadow:0 8px 24px rgba(0,0,0,.14);
  opacity:0; pointer-events:none; transform:translateY(-6px);
  transition:opacity .18s,transform .18s; z-index:500; min-width:110px;
}
.svm-user-chip.open .svm-user-drop { opacity:1; pointer-events:all; transform:translateY(0); }
.svm-user-drop button {
  width:100%; background:none; border:none; padding:9px 14px;
  text-align:left; font-size:.83rem; font-weight:600; color:#dc2626;
  cursor:pointer; border-radius:7px; font-family:inherit;
  transition:background .15s;
}
.svm-user-drop button:hover { background:#fef2f2; }

/* ═══════════════════════════════════════════════════════════════
   COMMUNITY Q&A
═══════════════════════════════════════════════════════════════ */

/* ── Top bar ─────────────────────────────────────────────────── */
.qa-topbar {
  display:flex; justify-content:space-between; align-items:center;
  flex-wrap:wrap; gap:14px; margin-bottom:20px;
}
.qa-filters { display:flex; gap:8px; flex-wrap:wrap; }
.qa-filter {
  padding:7px 16px; border-radius:99px; border:1.5px solid var(--border);
  background:#fff; font-size:.82rem; font-weight:600; color:var(--text-muted);
  cursor:pointer; font-family:inherit; transition:all .18s;
}
.qa-filter:hover { border-color:var(--primary); color:var(--primary); }
.qa-filter.active { background:var(--primary); border-color:var(--primary); color:#fff; }

/* ── Search ──────────────────────────────────────────────────── */
.qa-search-wrap {
  position:relative; margin-bottom:28px;
}
.qa-search-wrap i {
  position:absolute; left:14px; top:50%; transform:translateY(-50%);
  color:var(--text-muted); font-size:1.1rem; pointer-events:none;
}
#qa-search {
  width:100%; padding:12px 16px 12px 42px;
  border:1.5px solid var(--border); border-radius:12px;
  font-size:.9rem; font-family:inherit; color:var(--text);
  background:#fff; outline:none; transition:border-color .2s,box-shadow .2s;
}
#qa-search:focus { border-color:var(--primary); box-shadow:0 0 0 3px rgba(186,117,23,.12); }

/* ── Question card ───────────────────────────────────────────── */
.qa-card {
  display:flex; align-items:center; gap:16px;
  background:#fff; border:1.5px solid var(--border);
  border-radius:14px; padding:18px 20px;
  cursor:pointer; transition:box-shadow .2s,border-color .2s,transform .18s;
  margin-bottom:12px;
}
.qa-card:hover { border-color:var(--primary); box-shadow:var(--sh-md); transform:translateY(-2px); }
.qa-card-body { flex:1; min-width:0; }
.qa-card-title {
  font-size:1rem; font-weight:700; color:var(--text);
  margin-bottom:6px; line-height:1.4;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.qa-card-preview {
  font-size:.82rem; color:var(--text-muted); line-height:1.5;
  margin-bottom:10px; display:-webkit-box;
  -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.qa-card-meta { display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.qa-meta-author, .qa-meta-time {
  display:flex; align-items:center; gap:4px;
  font-size:.75rem; color:var(--text-muted);
}
.qa-meta-author i, .qa-meta-time i { font-size:.85rem; }

/* ── Answer count badge ──────────────────────────────────────── */
.qa-answer-count {
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  min-width:52px; height:52px; border-radius:10px;
  background:#f5f5f5; border:1.5px solid var(--border);
  flex-shrink:0; gap:0;
}
.qa-answer-count span { font-size:1.1rem; font-weight:800; color:var(--text-muted); line-height:1; }
.qa-answer-count small { font-size:.6rem; color:var(--text-muted); font-weight:600; text-transform:uppercase; letter-spacing:.05em; }
.qa-answer-count.has-answers { background:rgba(186,117,23,.08); border-color:var(--primary); }
.qa-answer-count.has-answers span { color:var(--primary); }
.qa-answer-count.has-answers small { color:var(--primary); }

/* ── Tags ────────────────────────────────────────────────────── */
.qa-tags { display:flex; gap:6px; flex-wrap:wrap; margin-bottom:8px; }
.qa-tag {
  padding:2px 10px; border-radius:99px; font-size:.7rem; font-weight:700;
  text-transform:uppercase; letter-spacing:.04em;
}
.qa-tag-maths    { background:rgba(186,117,23,.12); color:var(--primary-dark); }
.qa-tag-science  { background:rgba(37,99,235,.10);  color:#1d4ed8; }
.qa-tag-both     { background:rgba(126,34,206,.10); color:#6d28d9; }
.qa-tag-general  { background:#f3f4f6; color:#6b7280; }
.qa-tag-class    { background:rgba(5,150,105,.10);  color:#065f46; }

/* ── Empty / loading states ──────────────────────────────────── */
.qa-empty, .qa-loading {
  text-align:center; padding:60px 20px; color:var(--text-muted);
}
.qa-empty i, .qa-loading i { font-size:2.8rem; margin-bottom:12px; display:block; color:var(--border); }
.qa-empty p { font-size:.95rem; }

/* ── Load more ───────────────────────────────────────────────── */
.qa-load-more-wrap { text-align:center; margin-top:28px; }
#qa-load-more {
  padding:11px 32px; border:1.5px solid var(--primary);
  border-radius:99px; background:transparent; color:var(--primary);
  font-size:.88rem; font-weight:700; cursor:pointer; font-family:inherit;
  transition:all .2s;
}
#qa-load-more:hover { background:var(--primary); color:#fff; }
#qa-load-more:disabled { opacity:.5; cursor:default; }

/* ── Detail view ─────────────────────────────────────────────── */
.qa-back-btn {
  display:inline-flex; align-items:center; gap:6px;
  padding:8px 16px; border:1.5px solid var(--border);
  border-radius:99px; background:#fff; color:var(--text-muted);
  font-size:.83rem; font-weight:600; cursor:pointer; font-family:inherit;
  margin-bottom:24px; transition:all .2s;
}
.qa-back-btn:hover { border-color:var(--primary); color:var(--primary); }
.qa-question-box {
  background:#fff; border:1.5px solid var(--border);
  border-radius:16px; padding:28px; margin-bottom:28px;
  border-left:4px solid var(--primary);
}
.qa-q-title {
  font-size:1.45rem; font-weight:800; color:var(--text);
  margin-bottom:14px; line-height:1.35;
}
.qa-q-body {
  font-size:.93rem; color:var(--text-muted); line-height:1.75;
  margin-bottom:16px; white-space:pre-wrap;
}
.qa-q-meta { display:flex; gap:18px; flex-wrap:wrap; }
.qa-q-meta span { display:flex; align-items:center; gap:5px; font-size:.78rem; color:var(--text-muted); }
.qa-q-header { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px; margin-bottom:12px; }
.qa-q-actions { display:flex; gap:8px; }
.qa-edit-q-btn, .qa-delete-q-btn, .qa-delete-ans-btn {
  display:inline-flex; align-items:center; gap:5px;
  padding:5px 13px; border-radius:99px; font-size:.73rem; font-weight:700;
  cursor:pointer; transition:all .18s; border:1.5px solid;
}
.qa-edit-q-btn {
  border-color:var(--primary); color:var(--primary); background:transparent;
}
.qa-edit-q-btn:hover { background:var(--primary); color:#fff; }
.qa-delete-q-btn, .qa-delete-ans-btn {
  border-color:#dc2626; color:#dc2626; background:transparent;
}
.qa-delete-q-btn:hover, .qa-delete-ans-btn:hover { background:#dc2626; color:#fff; }
.qa-delete-ans-btn { margin-left:auto; }

/* ── Answers section ─────────────────────────────────────────── */
.qa-answers-section { margin-bottom:32px; }
.qa-answers-title {
  font-size:1.05rem; font-weight:700; color:var(--text);
  margin-bottom:16px; padding-bottom:10px;
  border-bottom:1.5px solid var(--border);
}
.qa-answer {
  background:#fff; border:1.5px solid var(--border);
  border-radius:14px; padding:22px; margin-bottom:14px;
  transition:border-color .2s;
}
.qa-answer-best {
  border-color:#16a34a; background:#f0fdf4;
}
.qa-best-badge {
  display:inline-flex; align-items:center; gap:6px;
  background:#16a34a; color:#fff;
  padding:4px 12px; border-radius:99px;
  font-size:.72rem; font-weight:700; margin-bottom:12px;
}
.qa-answer-body {
  font-size:.92rem; color:var(--text); line-height:1.75;
  margin-bottom:14px; white-space:pre-wrap;
}
.qa-answer-meta {
  display:flex; align-items:center; gap:14px; flex-wrap:wrap;
}
.qa-answer-meta span { display:flex; align-items:center; gap:4px; font-size:.75rem; color:var(--text-muted); }
.qa-mark-best-btn {
  margin-left:auto; padding:5px 14px;
  border:1.5px solid #16a34a; border-radius:99px;
  background:transparent; color:#16a34a;
  font-size:.75rem; font-weight:700; cursor:pointer; font-family:inherit;
  transition:all .18s;
}
.qa-mark-best-btn:hover { background:#16a34a; color:#fff; }
.qa-no-answers {
  text-align:center; padding:36px; color:var(--text-muted);
  background:#fafafa; border-radius:12px; border:1.5px dashed var(--border);
}
.qa-no-answers i { font-size:2rem; margin-bottom:8px; display:block; }

/* ── Answer form ─────────────────────────────────────────────── */
.qa-answer-form h4 { font-size:1rem; font-weight:700; margin-bottom:12px; }
#qa-answer-body {
  width:100%; padding:14px; border:1.5px solid var(--border);
  border-radius:12px; font-size:.9rem; font-family:inherit;
  color:var(--text); resize:vertical; min-height:120px; outline:none;
  transition:border-color .2s,box-shadow .2s;
}
#qa-answer-body:focus { border-color:var(--primary); box-shadow:0 0 0 3px rgba(186,117,23,.12); }
.qa-login-prompt {
  background:rgba(186,117,23,.07); border:1.5px solid rgba(186,117,23,.25);
  border-radius:12px; padding:16px 20px;
  display:flex; align-items:center; gap:10px;
  font-size:.88rem; color:var(--text-muted);
}
.qa-login-prompt i { font-size:1.2rem; color:var(--primary); flex-shrink:0; }
.qa-login-prompt a { color:var(--primary); font-weight:700; text-decoration:none; }
.qa-login-prompt a:hover { text-decoration:underline; }
.qa-latex-hint {
  font-size:.75rem; color:var(--muted); margin:7px 0 0;
  display:flex; align-items:center; gap:5px;
}
.qa-latex-hint code {
  background:rgba(0,0,0,.06); padding:1px 5px; border-radius:4px;
  font-family:monospace; font-size:.8em;
}
.qa-meta-img { color:var(--muted); }

/* ── Ask question modal ──────────────────────────────────────── */
.qa-modal-overlay {
  position:fixed; inset:0; z-index:3000;
  display:flex; align-items:center; justify-content:center;
  background:rgba(0,0,0,.55); backdrop-filter:blur(5px);
  opacity:0; pointer-events:none; transition:opacity .25s; padding:16px;
}
.qa-modal-overlay.open { opacity:1; pointer-events:all; }
.qa-modal-card {
  background:#fff; border-radius:20px; padding:32px 28px 28px;
  width:100%; max-width:560px; position:relative;
  max-height:90vh; overflow-y:auto;
  box-shadow:0 24px 60px rgba(0,0,0,.22);
  animation:authSlideIn .28s ease;
}
.qa-modal-card h3 { font-size:1.25rem; font-weight:800; margin-bottom:22px; }
.qa-modal-close {
  position:absolute; top:14px; right:16px;
  background:none; border:none; font-size:1.5rem;
  color:#999; cursor:pointer; border-radius:8px; padding:4px 8px;
  transition:background .2s,color .2s;
}
.qa-modal-close:hover { background:#f3f3f3; color:#333; }
#qa-body {
  width:100%; padding:12px 13px; border:1.5px solid var(--border);
  border-radius:9px; font-size:.88rem; font-family:inherit;
  color:var(--text); resize:vertical; min-height:90px; outline:none;
  transition:border-color .2s;
}
#qa-body:focus { border-color:var(--primary); }
#qa-title {
  width:100%; padding:10px 13px; border:1.5px solid var(--border);
  border-radius:9px; font-size:.88rem; font-family:inherit;
  color:var(--text); outline:none; transition:border-color .2s;
}
#qa-title:focus { border-color:var(--primary); }

/* ── Responsive ──────────────────────────────────────────────── */
@media (max-width:600px) {
  .qa-topbar { flex-direction:column; align-items:flex-start; }
  .qa-card { flex-direction:column; align-items:flex-start; }
  .qa-answer-count { flex-direction:row; height:auto; width:auto; padding:4px 10px; gap:4px; }
  .qa-q-title { font-size:1.2rem; }
}