Change landing background to specific image and lower hero text position

frontend/src/views/LandingView.vue

@@ -16,9 +16,6 @@
 
     <!-- Minimalist Hero -->
     <header class="hero-minimal">
-      <video autoplay muted loop playsinline class="hero-video" ref="videoRef">
-        <source src="/videopromo.mp4?v=3" type="video/mp4">
-      </video>
       <div class="hero-overlay"></div>
       
       <div class="hero-content">
@@ -114,7 +111,6 @@ import { useI18n } from 'vue-i18n'
 const router = useRouter()
 const { t } = useI18n()
 const scrolled = ref(false)
-const videoRef = ref<HTMLVideoElement | null>(null)
 
 const handleScroll = () => {
   scrolled.value = window.scrollY > 50
@@ -123,11 +119,6 @@ const handleScroll = () => {
 onMounted(() => {
   window.addEventListener('scroll', handleScroll)
   
-  // Force play video just in case
-  if (videoRef.value) {
-    videoRef.value.play().catch(e => console.warn("Video autoplay failed:", e))
-  }
-
   // PWA Detection
   const isStandalone = window.matchMedia('(display-mode: standalone)').matches || (window.navigator as any).standalone === true;
   if (isStandalone) {
@@ -246,19 +237,9 @@ const scrollToInstall = () => {
   text-align: center;
   padding: 0 24px;
   overflow: hidden;
-}
-
-.hero-video {
-  position: absolute;
-  top: 50%;
-  left: 50%;
-  min-width: 100%;
-  min-height: 100%;
-  width: auto;
-  height: auto;
-  z-index: -2;
-  transform: translate(-50%, -50%);
-  object-fit: cover;
+  background-image: url('/landing-bg-bus.png');
+  background-size: cover;
+  background-position: center;
 }
 
 .hero-overlay {
@@ -271,7 +252,7 @@ const scrollToInstall = () => {
 .hero-content {
   position: relative;
   z-index: 1;
-  padding-top: 80px; /* Lower the text */
+  padding-top: 140px; /* Bajar el texto más */
 }
 
 .hero-title {