optimizations

resources/views/web/home.blade.php

@@ -1,9 +1,10 @@
 @extends('layouts.nova')
 
+@section('meta-description', $meta['description'])
+@section('meta-keywords', $meta['keywords'])
+
 @push('head')
     <title>{{ $meta['title'] }}</title>
-    <meta name="description" content="{{ $meta['description'] }}">
-    <meta name="keywords"    content="{{ $meta['keywords'] }}">
     <link rel="canonical"    href="{{ $meta['canonical'] }}">
 
     {{-- Open Graph --}}
@@ -53,15 +54,23 @@
 @section('main-class', '')
 
 @section('content')
+    @include('web.home.hero', ['artwork' => $props['hero'] ?? null])
+
     {{-- Inline props for the React component (avoids data-attribute length limits) --}}
     <script id="homepage-props" type="application/json">
         {!! json_encode($props, JSON_UNESCAPED_SLASHES | JSON_UNESCAPED_UNICODE | JSON_HEX_TAG | JSON_HEX_AMP) !!}
     </script>
 
-    <div id="homepage-root" class="min-h-screen">
+    <div id="homepage-root" class="min-h-[40vh]">
         {{-- Loading skeleton (replaced by React on hydration) --}}
-        <div class="flex min-h-[60vh] items-center justify-center">
-            <div class="h-8 w-8 animate-spin rounded-full border-4 border-nova-500 border-t-transparent"></div>
+        <div class="space-y-10 px-4 pt-10 sm:px-6 lg:px-8">
+            <div class="h-14 rounded-2xl bg-nova-800/70"></div>
+            <div class="grid gap-4 lg:grid-cols-4">
+                <div class="aspect-video rounded-2xl bg-nova-800/70"></div>
+                <div class="aspect-video rounded-2xl bg-nova-800/70"></div>
+                <div class="aspect-video rounded-2xl bg-nova-800/70"></div>
+                <div class="aspect-video rounded-2xl bg-nova-800/70"></div>
+            </div>
         </div>
     </div>