/* =============================================================
   VOKSER DESIGN SYSTEM — MAIN ENTRY POINT
   Import order matters. Do not reorder.

   Usage (HTML):
     <link rel="stylesheet" href="path/to/vokser-ds.css">
     <link rel="stylesheet" href="path/to/client/[project].css"> ← client override

   Usage (JS bundler):
     import 'vokser-ds/vokser-ds.css';
     import 'vokser-ds/tokens/client-override-template.css';
   ============================================================= */

@import './tokens/base.css';
@import './styles/reset.css';
@import './styles/typography.css';
@import './styles/layout.css';

/* ── Primitives ──────────────────────────────────────────────── */
@import './components/button/componentButton.css';
@import './components/card/componentCard.css';
@import './components/badge/componentBadge.css';
@import './components/form/componentForm.css';
@import './components/form/componentFormCheckbox.css';
@import './components/form/componentFormRadio.css';
@import './components/form/componentFormToggle.css';
@import './components/alert/componentAlert.css';
@import './components/stats/componentStats.css';
@import './components/quote/componentQuote.css';
@import './components/article-card/componentArticleCard.css';
@import './components/team-card/componentTeamCard.css';
@import './components/feature-card/componentFeatureCard.css';
@import './components/pricing-card/componentPricingCard.css';
@import './components/testimonial-card/componentTestimonialCard.css';
@import './components/content-box/componentContentBox.css';
@import './components/usp-box/componentUspBox.css';
@import './components/icon-list/componentIconList.css';
@import './components/icon-grid/lucide-icons.css';
@import './components/icon-grid/componentIconGrid.css';
@import './components/image-grid/componentImageGrid.css';
@import './components/spec-table/componentSpecTable.css';
@import './components/pull-quote/componentPullQuote.css';
@import './components/figure/componentFigure.css';
@import './components/tag/componentTag.css';
@import './components/bento/componentBento.css';
@import './components/flip-card/componentFlipCard.css';
@import './components/marquee/componentMarquee.css';
@import './components/marketing-page/componentMarketingPage.css';

/* ── Section components ──────────────────────────────────────── */
@import './components/nav/componentNav.css';
@import './components/hero/componentHero.css';
@import './components/page-header/componentPageHeader.css';
@import './components/cta-banner/componentCtaBanner.css';
@import './components/footer/componentFooter.css';
@import './components/logo-strip/componentLogoStrip.css';
@import './components/process-steps/componentProcessSteps.css';
@import './components/article-header/componentArticleHeader.css';
@import './components/author-bio/componentAuthorBio.css';
@import './components/article-pagination/componentArticlePagination.css';
@import './components/share-bar/componentShareBar.css';

/* ── Interactive ─────────────────────────────────────────────── */
@import './components/accordion/componentAccordion.css';
@import './components/faq/componentFaq.css';
@import './components/tabs/componentTabs.css';
@import './components/modal/componentModal.css';
@import './components/drawer/componentDrawer.css';
@import './components/toast/componentToast.css';
@import './components/reading-progress/componentReadingProgress.css';
@import './components/toc/componentToc.css';
@import './components/article-layout/componentArticleLayout.css';

/* ── Reduced motion safety net ──────────────────────────────────
   Catches any animation/transition not already given a targeted
   override elsewhere. Higher-specificity rules (e.g. the marquee's
   own reduced-motion block) still win where both use !important. */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}