/* ===== SkillSphere — global styles =====
   Design tokens:
   bg #FBF9F6 | ink #1C1715 | muted #5C534C | accent #EA580C
   Fonts: Space Grotesk (display) + Manrope (body) */

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  font-family: 'Manrope', sans-serif;
  color: #1C1715;
  background: #FBF9F6;
  -webkit-font-smoothing: antialiased;
}
a { text-decoration: none; color: inherit; }
input, textarea, select, button { font-family: inherit; }

@keyframes ssFloat  { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-14px); } }
@keyframes ssFloat2 { 0%,100% { transform: translateY(0); } 50% { transform: translateY(12px); } }
@keyframes ssSpin   { to { transform: rotate(360deg); } }

[data-sec] { scroll-margin-top: 90px; }

/* ===== Mobile nav ===== */
.burger { display: none; }
.nav-mobile { display: none; }
.nav-mobile.open { display: flex; }

/* ===== Hover cards ===== */
.card-hover { transition: transform 0.2s, box-shadow 0.2s; }
.card-hover:hover {
  transform: translateY(-4px);
  box-shadow: 0 18px 36px rgba(28,23,21,0.08);
  border-color: #F3C9A8 !important;
}

/* ===== FAQ accordion ===== */
.faq-a { display: none; }
.faq-item.open .faq-a { display: block; }
.faq-sign::before { content: "+"; }
.faq-item.open .faq-sign::before { content: "\2212"; }
.faq-item.open .faq-sign { background: #EA580C !important; color: #fff !important; }

/* ===== Approach tabs ===== */
.tab-btn {
  background: transparent; color: #C9C1B9; border: 1px solid #3A322C;
  font-weight: 700; font-size: 15px; padding: 12px 22px; border-radius: 999px; cursor: pointer;
}
.tab-btn.active { background: #EA580C; color: #fff; border-color: #EA580C; }
.tab-panel { display: none; }
.tab-panel.active { display: grid; }

/* ===== Pricing plan toggle ===== */
#plan-standard.active { background: #1C1715; color: #fff; }
#plan-express.active  { background: #EA580C; color: #fff; }

/* ===== FAQ category filter ===== */
.cat-btn.active { background: #1C1715 !important; color: #fff !important; border-color: #1C1715 !important; }

/* ===== Responsive ===== */
@media (max-width: 900px) {
  [data-hide-mobile] { display: none !important; }
  .burger { display: inline-flex !important; }
  [data-hero], [data-grid-3], [data-grid-2], [data-split],
  [data-tiers], [data-tl], [data-grid] { grid-template-columns: 1fr !important; }
  [data-team] { grid-template-columns: 1fr 1fr !important; }
  [data-compare] { font-size: 14px !important; }
}