frontend fixes

app/[locale]/contact/page.tsx

@@ -179,7 +179,7 @@ export default function ContactPage() {
 
               <div className="p-6 md:p-10 bg-white rounded-2xl md:rounded-3xl border border-neutral-medium shadow-sm animate-fade-in">
                 <Heading level={4} className="mb-4 md:mb-6">{t('hours.title')}</Heading>
-                <ul className="space-y-2 md:space-y-4">
+                <ul className="space-y-2 md:space-y-4 list-none m-0 p-0">
                   <li className="flex justify-between items-center pb-2 md:pb-4 border-b border-neutral-medium text-sm md:text-base">
                     <span className="font-bold text-primary">{t('hours.weekdays')}</span>
                     <span className="text-text-secondary">{t('hours.weekdaysTime')}</span>

app/[locale]/team/page.tsx

@@ -1,3 +1,5 @@
+'use client';
+
 import { useTranslations } from 'next-intl';
 import { getTranslations } from 'next-intl/server';
 import { Metadata } from 'next';
@@ -5,6 +7,7 @@ import JsonLd from '@/components/JsonLd';
 import { getBreadcrumbSchema, SITE_URL } from '@/lib/schema';
 import { Section, Container, Heading, Badge, Button } from '@/components/ui';
 import Image from 'next/image';
+import Lightbox from '@/components/Lightbox';
 import Reveal from '@/components/Reveal';
 
 interface TeamPageProps {
@@ -42,6 +45,17 @@ export async function generateMetadata({ params: { locale } }: TeamPageProps): P
 export default function TeamPage() {
   const t = useTranslations('Team');
 
+  const [lightboxOpen, setLightboxOpen] = React.useState(false);
+  const [lightboxIndex, setLightboxIndex] = React.useState(0);
+
+  const teamGalleryImages = [
+    '/uploads/2024/12/DSC07539-Large-600x400.webp',
+    '/uploads/2024/12/DSC07460-Large-600x400.webp',
+    '/uploads/2024/12/DSC07469-Large-600x400.webp',
+    '/uploads/2024/12/DSC07433-Large-600x400.webp',
+    '/uploads/2024/12/DSC07387-Large-600x400.webp'
+  ];
+
   return (
     <div className="flex flex-col min-h-screen bg-neutral-light">
       <JsonLd
@@ -280,21 +294,29 @@ export default function TeamPage() {
             <span className="text-white">{t('gallery.title')}</span>
           </Heading>
           <div className="grid grid-cols-2 md:grid-cols-5 gap-3 md:gap-6">
-            {[
-              '/uploads/2024/12/DSC07539-Large-600x400.webp',
-              '/uploads/2024/12/DSC07460-Large-600x400.webp',
-              '/uploads/2024/12/DSC07469-Large-600x400.webp',
-              '/uploads/2024/12/DSC07433-Large-600x400.webp',
-              '/uploads/2024/12/DSC07387-Large-600x400.webp'
-            ].map((src, idx) => (
-              <div key={idx} className="relative aspect-[3/4] rounded-2xl md:rounded-[32px] overflow-hidden group shadow-2xl">
+            {teamGalleryImages.map((src, idx) => (
+              <button
+                key={idx}
+                onClick={() => {
+                  setLightboxIndex(idx);
+                  setLightboxOpen(true);
+                }}
+                className="relative aspect-[3/4] rounded-2xl md:rounded-[32px] overflow-hidden group shadow-2xl cursor-pointer"
+              >
                 <Image src={src} alt={t('gallery.title')} fill className="object-cover transition-transform duration-1000 group-hover:scale-110" />
                 <div className="absolute inset-0 bg-primary-dark/40 group-hover:bg-transparent transition-all duration-500" />
                 <div className="absolute inset-0 border-0 group-hover:border-[8px] md:group-hover:border-[12px] border-white/10 transition-all duration-500 pointer-events-none" />
-              </div>
+              </button>
             ))}
           </div>
         </Container>
+
+        <Lightbox
+          isOpen={lightboxOpen}
+          images={teamGalleryImages}
+          initialIndex={lightboxIndex}
+          onClose={() => setLightboxOpen(false)}
+        />
       </Section>
     </div>
   );