/* AI2U Main CSS Entry Point */

/* Import Base Styles */
@import url('./base/reset.css');
@import url('./base/typography.css');
@import url('./base/storm-overrides.css');

/* Import Components */
@import url('./components/navbar.css');
@import url('./components/hero.css');
@import url('./components/docs.css');
@import url('./components/philosophy.css');
@import url('./components/footer.css');
@import url('./components/u-icons.css');

/* Import Sections */
@import url('./sections/ai-tools.css');
@import url('./sections/features.css');
@import url('./sections/tools.css');
@import url('./sections/cta.css');

/* Import Pages */
@import url('./pages/index-cards.css');

/* Import Effects */
@import url('./effects/glass.css');
@import url('./effects/gradients.css');
@import url('./effects/animations.css');

/* Global Styles using Spellbook Variables */
body {
    background: var(--background-color);
    color: var(--text-color);
    position: relative;
    min-height: 100vh;
}

/* Premium Background Effects */
body::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: 
        radial-gradient(circle at 20% 50%, color-mix(in srgb, var(--primary-color) 5%, transparent) 0%, transparent 50%),
        radial-gradient(circle at 80% 80%, color-mix(in srgb, var(--accent-color) 3%, transparent) 0%, transparent 50%),
        radial-gradient(circle at 50% 20%, color-mix(in srgb, var(--secondary-color) 4%, transparent) 0%, transparent 50%);
    pointer-events: none;
    z-index: 1;
}

/* Main content above backgrounds */
main {
    position: relative;
    z-index: 2;
}

main.sb-min-h-screen {
    min-height: 0;
    height: calc(100vh - 64px);
}

main.min-h-screen-override {
    min-height: 0;
    height: auto !important;
}

/* Utility Classes */
.container {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 1rem;
}

.section {
    padding: 4rem 0;
}

/* Screen Reader Only */
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
}