Alumica

Alumica Premium Landing Page
1. Global Vision & Aesthetic
Theme: High-end, futuristic Fintech/Automation landing page.
Color Palette: Deep black (#000) background, white primary text, orange-to-red gradients (#ff8a00 to #ea580c) for highlights.
Typography: 'Inter' font family, utilizing various weights (300 to 700). Use tracking-tight for headings and tracking-tighter for the logo.
Effects: Glassmorphism (blur/transparency), subtle glow effects, and precision borders.
2. Background Architecture
Layer 1 (Video): Full-screen fixed video background.
URL: https://cdn.sceneai.art/Hero%20Section%20Video/5a6cf9a9-9f93-4e44-88f3-cf666065daf7.mp4
Layer 2 (Overlay): A fixed black overlay at 40% opacity to ensure text legibility against the video motion.
3. Top Navigation (Header)
Position: Fixed to top, z-index 50.
Logo: A white rounded square icon with a black rotating diamond inside, followed by the text "Alumica".
Menu: A centered "nav-glass" pill-shaped container using backdrop-filter: blur(10px) and 5% white transparency.
Links: Home, Pricing, About Us, Blog, Contact (Home is active orange).
CTA: A "Sign In" button with a thin 20% white border and full-pill rounded corners.
4. Middle Hero Elements
Badge: A small, uppercase "Best Intelligence Layer 2026" badge with wide letter spacing and a blur background.
Main Heading: - Top line: "Redefining the Future of" (White-to-gray vertical gradient).
Bottom line: "Automation & Fintech" (Orange-to-red horizontal gradient).
Sub-headline: Clean, centered text at 60% white opacity explaining the value proposition.
Primary CTA Button:
Label: "Join Today".
Style: Large glass-pill button with a 1.5px animated rotating gradient border (orange/red).
Icon: A rounded orange circular arrow icon on the right side of the button.
5. Bottom Component
Visual: A small user community/avatar group image.
URL: https://cdn.sceneai.art/Hero%20Section%20Video/4c39c031-79d4-41e2-a6ab-bd1c49960765.png
Dimensions: Width must be exactly 130px.
Positioning: Placed 3.25rem below the main CTA button to provide breathing room.
Shadow: Include a deep 25px blur drop-shadow to create depth against the video.
6. Layout & Responsiveness
Alignment: All content centered vertically and horizontally.
Padding: Minimum 6px horizontal padding on mobile; standard 7xl max-width for desktop headers.
Interaction: Smooth transitions (0.3s) for all hover states on buttons and navigation links.