/* Master CSS file - imports all components in correct dependency order */

/* 1. Base styles and variables (must load first) */
@import url('base.css');
@import url('breakpoints.css'); /* Standardized breakpoint reference */

/* 2. Shared components and utilities */
@import url('shared-components.css');

/* 3. Layout components */
@import url('navigation.css');
@import url('hero.css');

/* 4. Content sections */
@import url('video-elevator.css');
@import url('features.css');
@import url('gallery.css');
@import url('story.css');
@import url('character-gallery.css');
@import url('faq.css');
@import url('faq-carousel.css');

/* 5. Overlays and modals */
@import url('modals.css');

/* 6. Footer (last) */
@import url('footer.css');

/* ===========================================
   CRITICAL MOBILE OVERRIDES - MUST BE LAST
   =========================================== */

/* Character Gallery Navigation Buttons - Mobile Override */
@media screen and (max-width: 768px) {
  button.gif-nav {
    background: red !important;
    border: 3px solid blue !important;
    opacity: 1 !important;
    transition: none !important;
  }
  
  button.gif-nav.prev {
    left: 0 !important;
  }
  
  button.gif-nav.next {
    right: 0 !important;
  }
}