/**
 * =====================================================
 * MUHTAWAK - MAIN STYLESHEET
 * =====================================================
 * 
 * This file imports all CSS modules in the correct order.
 * 
 * HOW TO ADD NEW STYLES:
 * 1. Create a new file in the appropriate folder
 * 2. Add an @import line below
 * 
 * =====================================================
 */

/* =========================================
   1. BASE (Foundation)
   Load first - variables, reset, typography
   ========================================= */
@import 'base/_variables.css';
@import 'base/_reset.css';
@import 'base/_typography.css';

/* =========================================
   2. COMPONENTS (Reusable pieces)
   Load second - buttons, cards, badges, forms
   ========================================= */
@import 'components/_nav.css';
@import 'components/_buttons.css';
@import 'components/_badges.css';
@import 'components/_cards.css';
@import 'components/_breadcrumbs.css';
@import 'components/_theme-toggle.css';
@import 'components/_editor-formats.css';
@import 'components/_footer.css';
@import 'components/_section-divider.css';
@import 'components/_section-header.css';

/* =========================================
   3. SECTIONS (Page-specific sections)
   Load third - hero, timeline, team, etc.
   ========================================= */
@import 'sections/_hero.css';
@import 'sections/_manifesto.css';
@import 'sections/_values.css';
@import 'sections/_team.css';
@import 'sections/_cta.css';
@import 'sections/_homepage.css';
@import 'sections/_products.css';
@import 'sections/_blog.css';
@import 'sections/_founders.css';
@import 'sections/_timeline.css';
@import 'sections/_ai-story.css';
@import 'sections/_stats.css';
@import 'sections/_clients.css';

/* =========================================
   4. UTILITIES (Helper classes)
   Load last - animations, spacing helpers
   ========================================= */
@import 'utilities/_animations.css';
@import 'utilities/_helpers.css';
@import 'utilities/_accessibility.css';


/**
 * =====================================================
 * CSS ARCHITECTURE GUIDE
 * =====================================================
 * 
 * NAMING CONVENTION (BEM):
 * 
 * .block {}           - Component container
 * .block__element {}  - Part of component
 * .block--modifier {} - Variation of component
 * 
 * EXAMPLES:
 * .card-team {}             - Team card block
 * .card-team__photo {}      - Photo element
 * .card-team--featured {}   - Featured modifier
 * 
 * =====================================================
 * 
 * FILE ORGANIZATION:
 * 
 * /base/      - Variables, reset, typography
 * /components/ - Reusable UI pieces (buttons, cards)
 * /sections/  - Page sections (hero, team, pricing)
 * /utilities/ - Helper classes (animations, spacing)
 * 
 * =====================================================
 * 
 * WHEN TO CREATE A NEW FILE:
 * 
 * - New component: /components/_[name].css
 * - New section: /sections/_[name].css
 * - New animation: Add to /utilities/_animations.css
 * 
 * =====================================================
 */
/* ORBITAL FORCE OVERRIDE: Fix for mysterious 700px body width limitation */
body {
   max-width: 100% !important;
   width: 100% !important;
   margin: 0 !important;
   overflow-x: hidden;
}