fix: move @import out of @layer to fix SVG figure styles on homepage

@import rules inside @layer blocks are invalid CSS and get ignored by
browsers at runtime. This caused components.css and figures.css to never
load, rendering the WhitepaperHero SVG as a solid black rectangle.

Move both imports to the top of style.css using the layered import
syntax (@import '...' layer(components)) which is the correct way to
assign imported styles to a cascade layer.

Generated with [Devin](https://cli.devin.ai/docs)

Co-Authored-By: Devin <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Author: LessUp

docs/.vitepress/theme/style.css

@@ -3,6 +3,10 @@
    Modern CSS Architecture with Cascade Layers
    ============================================ */
 
+/* @import rules must come before all other rules */
+@import './styles/components.css' layer(components);
+@import './styles/figures.css' layer(components);
+
 /* Layer Declaration - Order defines priority */
 @layer reset, tokens, fonts, base, layout, components, utilities, overrides;
 
@@ -544,9 +548,7 @@
    Layer: Components
    ============================================ */
 @layer components {
-  /* Import component styles */
-  @import './styles/components.css';
-  @import './styles/figures.css';
+  /* Component styles imported at top of file via @import ... layer(components) */
 }
 
 /* ============================================