Add floating lang toggle on mobile, fades out on scroll

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

src/routes/[[lang]]/+page.svelte

@@ -443,6 +443,9 @@
   </div>
 </footer>
 
+<!-- FLOATING LANG TOGGLE — visible only at top, fades out when nav appears -->
+<a href="{alt.prefix || '/'}" class="lang-float {scrollY > 100 ? 'hidden' : ''}">{alt.lang.toUpperCase()}</a>
+
 <!-- FLOATING WHATSAPP -->
 <a
   href="https://wa.me/50662692083?text=Hola%2C%20vi%20su%20sitio%20web%20y%20me%20interesan%20sus%20servicios."
@@ -927,6 +930,35 @@
   }
   .map-wrap:hover iframe { filter: saturate(0.8) brightness(0.85) contrast(1.1); }
 
+  /* ── FLOATING LANG TOGGLE ── */
+  .lang-float {
+    position: fixed;
+    top: 18px;
+    right: 20px;
+    z-index: 70;
+    width: 36px;
+    height: 36px;
+    border-radius: 50%;
+    border: 1px solid rgba(212,160,68,0.4);
+    background: rgba(10,10,10,0.6);
+    backdrop-filter: blur(8px);
+    -webkit-backdrop-filter: blur(8px);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    font-family: 'Cinzel', serif;
+    font-size: 10px;
+    letter-spacing: 0.05em;
+    color: #D4A044;
+    transition: opacity 0.4s, transform 0.4s;
+  }
+  .lang-float.hidden {
+    opacity: 0;
+    pointer-events: none;
+    transform: translateY(-8px);
+  }
+  @media (min-width: 1024px) { .lang-float { display: none; } }
+
   /* ── SOCIAL ICONS ── */
   .social-icon {
     width: 40px;

src/routes/[[lang]]/about/+page.svelte

@@ -227,6 +227,9 @@
   </div>
 </footer>
 
+<!-- FLOATING LANG TOGGLE -->
+<a href="{alt.prefix}/about" class="lang-float {scrollY > 50 ? 'hidden' : ''}">{alt.lang.toUpperCase()}</a>
+
 <!-- FLOATING WHATSAPP -->
 <a
   href="https://wa.me/50662692083?text=Hola%2C%20vi%20su%20sitio%20web%20y%20me%20interesan%20sus%20servicios."
@@ -373,6 +376,35 @@
   }
   @media (min-width: 640px) { .about-hero { min-height: 80vh; } }
 
+  /* ── FLOATING LANG TOGGLE ── */
+  .lang-float {
+    position: fixed;
+    top: 18px;
+    right: 20px;
+    z-index: 70;
+    width: 36px;
+    height: 36px;
+    border-radius: 50%;
+    border: 1px solid rgba(212,160,68,0.4);
+    background: rgba(10,10,10,0.6);
+    backdrop-filter: blur(8px);
+    -webkit-backdrop-filter: blur(8px);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    font-family: 'Cinzel', serif;
+    font-size: 10px;
+    letter-spacing: 0.05em;
+    color: #D4A044;
+    transition: opacity 0.4s, transform 0.4s;
+  }
+  .lang-float.hidden {
+    opacity: 0;
+    pointer-events: none;
+    transform: translateY(-8px);
+  }
+  @media (min-width: 1024px) { .lang-float { display: none; } }
+
   /* ── BUTTONS ── */
   .btn-gold {
     font-family: 'Cinzel', serif;