Lumina

LUMINA VISION CINEMATIC INTERFACE
[GLOBAL SETTINGS & ENVIRONMENT]

Background Video: URL(https://cdn.sceneai.art/Hero%20Section%20Video/9ad5cc99-2fa4-4154-bcc2-5c9ec152778e.mp4).

Video Positioning: 100% opacity. Anchor strictly to the RIGHT SIDE using transform-origin: right center. Scale: 1.3 (130%). Use object-fit: cover and object-position: right center.

Video Post-Processing: brightness(1.1), contrast(1.1).

Global Layout: Navigation, Hero, and Footer must maintain exactly 70px left and right padding.

Text Protection: Apply a deep left-aligned black-to-transparent overlay: linear-gradient(to right, rgba(0,0,0,1) 0%, rgba(0,0,0,0.85) 30%, rgba(0,0,0,0) 85%).

[LAYER 1: TOP NAVIGATION]

Logo (Left): Square frame with a glowing blue node icon. Text "auto-automation" in bold uppercase, 11px size, with 0.5em tracking.

Links (Center-Right): Sentence case, regular weight, 0.85rem size. White color with 60% opacity. Links: Home, About, Photos, Crew, Contact. Align ml-auto mr-12.

Play Button (Far Right): Circular frosted glass button (52px diameter). 12px backdrop-blur. 1px white border at 25% opacity. Centered white play icon. Position strictly at the far right edge of the 70px side padding.

[LAYER 2: MIDDLE HERO ELEMENTS]

Vertical Alignment: Shift entire Hero block upward using translate-y-[-12%].

Element 1 (Tag): "INITIALIZE VISION" pill label. Font: 9px bold uppercase. Tracking: 0.4em. Spacing: 12px vertical gap below it.

Element 2 (Heading): "Intelligence Unbound". Font: 80px bold sans-serif. Line-height: 1.0. Tracking: tight. Spacing: 16px vertical gap below it.

Element 3 (Subheading): Regular weight text. Font: 16px size. Opacity: 60% white. Max-width area: strictly 430px. Spacing: 30px vertical gap below it.

Element 4 (Primary Button):

Shape: Capsule/Pill shape. Padding: 14px vertical, 26.5px horizontal.

Material: Frosted Glass base (rgba(255,255,255,0.25)) with 40px backdrop-blur and internal glow shadow.

Text: Bold uppercase 12px. STRICTLY REMOVE ALL TEXT SHADOWS.

Orbital Border: 2.5px conic-gradient stroke (#3b82f6, #a855f7, #ec4899, #f8a170, #eab308).

Animation: The gradient source must be 10x larger (1000%) than the button, performing a continuous 6-second orbital rotation.

Interaction: Arrow icon nudges +5px on hover.

[LAYER 3: BOTTOM ELEMENTS]

Label: "AUTO-AUTOMATION ECOSYSTEM" centered. Font: 9px bold. Tracking: 0.6em. Opacity: 25%.

Ticker: Infinite auto-scrolling row. Logos must be Grayscale at 55% opacity.

Logo Specs: Icons: 15px height. Text: 11px size.

Brand Names: Google, Cust.io, Hummel, Copper, Tesla.

Placement: Push as far to the bottom as possible while maintaining the 70px side padding.