/*
Theme Name: Skynetlabs Premium Theme
Theme URI: https://skynetjoe.com
Author: Skynetlabs
Author URI: https://skynetjoe.com
Description: High-end WordPress theme with React Native-level animations for AI automation agency. Features advanced micro-animations, particle backgrounds, 3D transforms, and custom cursor effects.
Version: 2025.1.0
Requires at least: 6.0
Tested up to: 6.4
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: skynetlabs
Tags: automation, ai, agency, business, portfolio, modern, dark, animated

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.
*/

/* ============================================
   🎨 THEME INFORMATION
   ============================================

   SKYNETLABS PREMIUM THEME - 2025

   A cutting-edge WordPress theme designed specifically for AI automation agencies.
   Features React Native-level animations, advanced micro-interactions, and modern
   design patterns.

   FEATURES:
   ✓ React Native-level animations
   ✓ Particle background system
   ✓ Custom cursor effects
   ✓ 3D card transformations
   ✓ Magnetic buttons
   ✓ Scroll-triggered animations
   ✓ Glass morphism design
   ✓ Gradient mesh backgrounds
   ✓ Advanced typography system
   ✓ Mobile-optimized
   ✓ Dark theme
   ✓ Performance optimized

   INCLUDED FILES:
   - design-system.css (Color palette, typography, spacing)
   - animations.css (Keyframes, effects, transitions)
   - components.css (UI components library)
   - animations.js (JavaScript animation engine)
   - app.js (Main application logic)

   CUSTOMIZATION:
   All design tokens are defined in design-system.css using CSS custom properties.
   You can easily customize colors, fonts, spacing, and animations by modifying
   the :root variables.

   SUPPORT:
   For support, visit: https://skynetjoe.com/support
   Documentation: https://skynetjoe.com/docs
   Email: [email protected]

   ============================================ */

/* ============================================
   📦 THEME IMPORTS
   ============================================ */

/* Design system loaded via functions.php */
/* Animations loaded via functions.php */
/* Components loaded via functions.php */

/* ============================================
   🎯 THEME-SPECIFIC STYLES
   ============================================ */

/* WordPress Core Styles */
.alignleft {
  float: left;
  margin-right: var(--space-6);
  margin-bottom: var(--space-4);
}

.alignright {
  float: right;
  margin-left: var(--space-6);
  margin-bottom: var(--space-4);
}

.aligncenter {
  display: block;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: var(--space-4);
}

.wp-caption {
  max-width: 100%;
}

.wp-caption-text {
  font-size: var(--text-sm);
  color: var(--gray-500);
  text-align: center;
  padding: var(--space-2);
}

.sticky {
  /* Sticky post styles */
}

.bypostauthor {
  /* Post author styles */
}

/* Screen Reader Text */
.screen-reader-text {
  clip: rect(1px, 1px, 1px, 1px);
  position: absolute !important;
  height: 1px;
  width: 1px;
  overflow: hidden;
}

.screen-reader-text:focus {
  background-color: var(--gray-100);
  border-radius: var(--radius-sm);
  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
  clip: auto !important;
  color: var(--skynet-dark);
  display: block;
  font-size: var(--text-sm);
  font-weight: var(--weight-bold);
  height: auto;
  left: 5px;
  line-height: normal;
  padding: var(--space-4) var(--space-6);
  text-decoration: none;
  top: 5px;
  width: auto;
  z-index: 100000;
}

/* ============================================
   🎨 ADDITIONAL THEME STYLES
   ============================================ */

/* Page transitions */
body {
  transition: opacity var(--duration-normal) var(--ease-out);
}

body.page-transition-exit {
  opacity: 0;
}

/* Print styles */
@media print {
  .navbar,
  .footer,
  .btn,
  .cta-section {
    display: none !important;
  }

  body {
    background: white !important;
    color: black !important;
  }
}

/* Custom cursor styles (added by animations.js) */
/* Particle canvas styles */
[data-particle-canvas] {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

/* ============================================
   🚀 PERFORMANCE OPTIMIZATIONS
   ============================================ */

/* GPU acceleration for animations */
.hero,
.card,
.btn,
[data-tilt],
[data-magnetic] {
  transform: translateZ(0);
  will-change: transform;
}

/* Optimize font rendering */
body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

/* Image optimization */
img {
  max-width: 100%;
  height: auto;
  display: block;
}

/* ============================================
   📱 RESPONSIVE UTILITIES
   ============================================ */

/* Hide/show on mobile */
@media (max-width: 768px) {
  .hide-mobile {
    display: none !important;
  }
}

@media (min-width: 769px) {
  .hide-desktop {
    display: none !important;
  }
}

/* ============================================
   🎨 THEME COLORS
   ============================================ */

/*
Primary Brand Color: #00F0FF (Electric Cyan)
Secondary Brand Color: #7B61FF (Purple)
Dark Background: #0A0E27 (Deep Space Blue)

All colors are defined in design-system.css
Customize by modifying CSS custom properties in :root
*/

/* ============================================
   📝 CREDITS
   ============================================ */

/*
Theme by: Skynetlabs
Website: https://skynetjoe.com
Email: [email protected]
Year: 2025
*/