PageSourceSearch

https://lights.lu/cases

html lights.lu collected 2026-10-06 12:39:21 UTC 58,657 bytes, 922 lines download raw bytes

1<!DOCTYPE html>
2<html lang="en" dir="ltr" prefix="og: https://ogp.me/ns#">
3
4  <head>
5
6    <!-- Google Tag Manager -->
7    
7<script>
vendor: 343 bytes, lines 7-11
7(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
8    new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
9    j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
10    'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
11    })(window,document,'script','dataLayer','
11GTM-MNQ868QR
vendor: 3 bytes, line 11
11');
11</script>
11
12    <!-- End Google Tag Manager -->
13
14    <meta charset="utf-8" />
15<link rel="canonical" href="https://lights.lu/cases" />
16<meta property="og:site_name" content="Lights" />
17<meta property="og:url" content="https://lights.lu/cases" />
18<meta property="og:title" content="Cases" />
19<meta property="og:image" content="https://lights.lu/themes/lights/src/img/meta-social.jpg" />
20<meta property="og:image:secure_url" content="https://lights.lu/themes/lights/src/img/meta-social.jpg" />
21<meta name="Generator" content="Drupal 11 (https://www.drupal.org)" />
22<meta name="MobileOptimized" content="width" />
23<meta name="HandheldFriendly" content="true" />
24<meta name="viewport" content="width=device-width, initial-scale=1.0" />
25<link rel="alternate" hreflang="en" href="https://lights.lu/cases" />
26
27    <title>Cases | Lights</title>
28    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
29            <link rel="stylesheet" media="all" href="https://lights.lu/themes/lights/dist/assets/app-CEbamLQM.css" crossorigin />
30    <link rel="icon" href="/themes/lights/src/img/favicon.svg">
31    
31<script src="/themes/lights/src/js/outdated-browser-rework.min.js"></script>
31
32    
32<script>
33      outdatedBrowserRework({ fullscreen: true, isUnknownBrowserOK: true });
34    </script>
34
35    <style type="text/css">
36      .scroller-text-item { will-change: clip-path; }
37      .scroller-text-inner { will-change: transform, opacity; }
38      [data-scroller]:not([data-played]) { opacity: 0 !important; }
39      [x-cloak] { display: none; }
40    </style>
41
42    <!-- Google tag (gtag.js) -->
vendor: 68 bytes, lines 42-43
42
43    <script async src="https://www.googletagmanager.com/gtag/js?id=
43G-8M3SETMC6G
vendor: 16 bytes, lines 43-44
43"></script>
44    
44<script>
45      
vendor: 145 bytes, lines 45-48
45window.dataLayer = window.dataLayer || [];
46      function gtag(){dataLayer.push(arguments);}
47      gtag('js', new Date());
48      gtag('config', '
48G-8M3SETMC6G
vendor: 8 bytes, lines 48-49
48');
49    
49</script>
49
50
51  </head>
52
53      <body class="font-sans text-base text-black antialiased leading-relaxed overflow-x-hidden transition-colors duration-500 :loading path-node page-node-type-page node-7 template-cases bg-yellow" style="background-color: #FFDEDE;">
54  
55    <!-- Google Tag Manager (noscript) -->
vendor: 72 bytes, lines 55-56
55
56    <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=
56GTM-MNQ868QR
vendor: 91 bytes, lines 56-58
56"
57    height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
58    
58<!-- End Google Tag Manager (noscript) -->
59
60    <div id="outdated"></div>
61        <a href="#main-content" class="sr-only focus:not-sr-only">
62  Skip to main content
63</a>
64
65<a id="main-content" tabindex="-1"></a>
66
67
68<div x-data="$store.loader" x-init="setup()" class="loader bg-pink fixed inset-0 z-40 flex items-center justify-center">
69  <div class="w-48"></div>
70</div>
71
72
73<header role="banner" class="header fixed left-0 top-0 right-0 z-30 flex flex-col mix-blend-difference">
74  <div class="container pt-10 grid grid-cols-3 items-center lg:pt-16 lg:px-12 lg:max-w-none">
75
76        <div class="header-social">
77      <a href="https://www.instagram.com/lights.prod/" target="_blank" class="block relative flex items-center justify-center group w-6 h-6 lg:w-12 lg:h-12 lg:p-3">
78        <div class="text-white transition-transform duration-300 ease-out group-hover:scale-110">
79          <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" class="w-full fill-current">
80  <path d="M12 9a3 3 0 1 0 0 6 3 3 0 0 0 0-6zm0-2a5 5 0 1 1 0 10 5 5 0 0 1 0-10zm6.5-.25a1.25 1.25 0 0 1-2.5 0 1.25 1.25 0 0 1 2.5 0zM12 4c-2.474 0-2.878.007-4.029.058-.784.037-1.31.142-1.798.332-.434.168-.747.369-1.08.703a2.89 2.89 0 0 0-.704 1.08c-.19.49-.295 1.015-.331 1.798C4.006 9.075 4 9.461 4 12c0 2.474.007 2.878.058 4.029.037.783.142 1.31.331 1.797.17.435.37.748.702 1.08.337.336.65.537 1.08.703.494.191 1.02.297 1.8.333C9.075 19.994 9.461 20 12 20c2.474 0 2.878-.007 4.029-.058.782-.037 1.309-.142 1.797-.331.433-.169.748-.37 1.08-.702.337-.337.538-.65.704-1.08.19-.493.296-1.02.332-1.8.052-1.104.058-1.49.058-4.029 0-2.474-.007-2.878-.058-4.029-.037-.782-.142-1.31-.332-1.798a2.911 2.911 0 0 0-.703-1.08 2.884 2.884 0 0 0-1.08-.704c-.49-.19-1.016-.295-1.798-.331C14.925 4.006 14.539 4 12 4zm0-2c2.717 0 3.056.01 4.122.06 1.065.05 1.79.217 2.428.465.66.254 1.216.598 1.772 1.153a4.908 4.908 0 0 1 1.153 1.772c.247.637.415 1.363.465 2.428.047 1.066.06 1.405.06 4.122 0 2.717-.01 3.056-.06 4.122-.05 1.065-.218 1.79-.465 2.428a4.883 4.883 0 0 1-1.153 1.772 4.915 4.915 0 0 1-1.772 1.153c-.637.247-1.363.415-2.428.465-1.066.047-1.405.06-4.122.06-2.717 0-3.056-.01-4.122-.06-1.065-.05-1.79-.218-2.428-.465a4.89 4.89 0 0 1-1.772-1.153 4.904 4.904 0 0 1-1.153-1.772c-.248-.637-.415-1.363-.465-2.428C2.013 15.056 2 14.717 2 12c0-2.717.01-3.056.06-4.122.05-1.066.217-1.79.465-2.428a4.88 4.88 0 0 1 1.153-1.772A4.897 4.897 0 0 1 5.45 2.525c.638-.248 1.362-.415 2.428-.465C8.944 2.013 9.283 2 12 2z"/>
81</svg>
82        </div>
83        <div class="hidden absolute inset-0 z-0 bg-white opacity-0 rounded-full transform scale-50 transition-all duration-300 ease-out group-hover:opacity-5 group-hover:scale-100 lg:block"></div>
84      </a>
85    </div>
86
87        <div x-data="$store.logo" class="header-logo relative">
88      <a
89        x-bind:class="{ '-translate-y-full opacity-0 pointer-events-none' : pageBack, 'translate-y-0 opacity-100 pointer-events-auto': !pageBack }"
90        href="/"
91        class="block mx-auto text-white w-20 transform transition-all duration-500 ease-out lg:w-24">
92        
93<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 120 89" class="fill-current w-full">
94  <path fill="none" d="M0 0h120v88.71H0z"/>
95  <path d="M119.71 4.42a1.23 1.23 0 0 0-1.72-.15c-5.58 4.69-10.73 9.86-15.37 15.48-.68-.83-1.46-1.57-2.32-2.22-1.81-1.43-2.64-1.75-3.41-1.33-.66.38-.88 1.23-.49 1.89-.13 1.93-.54 3.83-1.23 5.64a16.87 16.87 0 0 1-3.29 6.34c-.29.26-.55.4-.68.36-.09-.03-2.05-.76-1.44-12.99.28-1.66.52-3.28.71-4.82a331.5 331.5 0 0 0 8.98-5.23c.55-.4.67-1.17.27-1.72-.35-.48-1-.64-1.53-.38C95.5 6.92 93 8.37 90.83 9.61c.48-4.67.59-8.06.6-8.39a1.22 1.22 0 0 0-1.25-1.2c-.58.01-1.06.42-1.18.99 0 .06-.71 4.71-1.23 10.33-3.38 1.88-5.48 2.96-5.51 2.98-.63.26-.93.97-.68 1.6.26.63.97.93 1.6.68.07-.03.13-.06.19-.1.03-.02 1.58-.81 4.15-2.22-.04.49-.07.99-.1 1.49-.03.46-.05.9-.08 1.33-.71 4.69-1.98 9.29-3.78 13.68-.66 1.56-1.42 3.07-2.26 4.54-.07-.57-.12-1.23-.17-1.75-.25-3.02-.5-6.14-2.75-6.32-2.44-.2-4.84 3.68-6.87 7.49-.25.48-.5.96-.73 1.42.05-.86.11-1.79.17-2.76 2.18-4.4 4.07-8.93 5.65-13.57.87-2.61 3.53-10.57 1.27-13.14a2.813 2.813 0 0 0-3.44-.53c-1.5.6-2.59 2.8-3.55 7.13-.81 4-1.39 8.04-1.75 12.11a226.6 226.6 0 0 0-.6 7.36c-.77 1.55-1.57 3.06-2.38 4.49-1.14 2.02-2.37 4.14-3.6 6.25.05-2.28.07-4.67.07-7.18 0-.68-.55-1.23-1.23-1.23-.62 0-1.13.46-1.21 1.07-.43-.57-1.08-.94-1.79-1.03h-.09c-2.89 0-5.49 5.53-5.87 8.63-.14.87-.16 1.76-.05 2.63-2.32 3.34-3.91 4.56-4.13 4.61-.43-.77-.65-1.65-.61-2.53-.09-1.42-.09-2.85-.02-4.27.03-.48.04-.96.01-1.44-.08-.67-.69-1.15-1.37-1.07-.49.06-.9.41-1.04.89-1.15 4.42-3.83 11.91-6.14 13.19-.17.12-.38.16-.58.11-.02 0-1.61-.73-1.46-8.59.07-2.69.28-5.37.63-8.04 3.08-5.15 5.9-10.45 8.44-15.88 3.39-7.44 3.27-9.69 2.89-10.75a2.02 2.02 0 0 0-1.63-1.37c-2.24-.32-4.36 1.47-6.29 5.34a56.687 56.687 0 0 0-4.06 12.3 105.2 105.2 0 0 0-1.71 9.54c-.44.74-.89 1.49-1.34 2.25A325.492 325.492 0 0 1 .25 86.75c-.41.54-.3 1.31.25 1.72.48.36 1.14.32 1.58-.09a322.992 322.992 0 0 0 32.65-44.31c-.07 1.08-.12 2.12-.14 3.11-.13 6.66.91 10.25 3.17 10.97.84.26 1.75.15 2.51-.3 2.03-1.12 3.81-4.58 5.11-7.88.3 1.68.91 2.92 2.11 3.32 1.61.53 3.88-1.42 6.25-4.64.47.55 1.06.99 1.73 1.27.3.1.61.15.93.14 1.08-.04 2.09-.55 2.77-1.4.3-.33.57-.69.81-1.07v.25C52.8 60.06 46.9 70.48 49.22 75.04a4.184 4.184 0 0 0 3.58 2.21 4.4 4.4 0 0 0 3.53-1.24c3.38-3.06 5.41-12.28 6.07-27.44l.76-1.3c1.7-2.88 3.45-5.86 5.03-8.67-.11 2.24-.16 3.66-.16 3.69 0 .68.53 1.24 1.21 1.24.49 0 .94-.28 1.14-.73.01-.03 1.4-3.36 3.16-6.69 2.67-5.06 4.08-6.14 4.52-6.38.37 1.31.59 2.66.63 4.02.22 2.68.38 4.62 1.94 4.89 1.32.23 2.43-.75 5.16-6.88.66-1.5 1.23-3.03 1.71-4.59.56 4.17 1.81 5.26 3 5.61.88.26 2.23.19 3.72-1.64 1.61-2.31 2.82-4.88 3.57-7.59.43-1.34.75-2.71.96-4.1.69.51 1.32 1.1 1.87 1.75.14.24.26.48.38.71-1.73 2.47-2.76 4.59-2.62 5.98.05.73.46 1.39 1.09 1.75 1.15.64 2.6.4 3.49-.57 1.28-1.29 1.88-3.78.83-6.83.57-.76 1.25-1.61 2.05-2.55 4.21-4.87 8.8-9.4 13.73-13.53.51-.44.57-1.21.14-1.72ZM75.88 8.34c.39 0 1.06 2.52-1.46 10.21-.8 2.44-1.8 5.07-2.92 7.72l.06-.62c.34-3.97.91-7.91 1.69-11.81 1.08-4.96 2.24-5.5 2.62-5.5ZM39.39 29.4c.84-4.05 2.14-7.99 3.87-11.75 1.21-2.42 3-4.27 3.47-4.01s-.14 2.68-2.78 8.51c-1.35 2.98-3.1 6.42-5.18 10.18.19-.99.4-1.97.62-2.93Zm15.29 44.8c-.43.44-1.03.67-1.65.62-1.13-.11-1.48-.56-1.64-.88-.52-1.03-.51-3.6 2.52-9.99 1.53-3.24 3.58-6.94 5.77-10.74-1.03 14.89-3.43 19.56-5.01 21Zm2.76-27.22c-.66.73-.95.63-1.24.62-.64-.04-1.47-1.02-1.47-2.42 0-3.18 2.13-7.32 3.59-7.64.5.19.91.57 1.11 1.07.85 1.65-.22 6.42-2 8.37Zm44-19.91c-.14.22-.46.58-.62.46s.6-2.51 1.07-2.51c.41 0-.14 1.54-.46 2.05Zm-54.36 7.87c.92 0 1.67.75 1.67 1.67 0 .92-.75 1.67-1.67 1.67-.92 0-1.67-.75-1.67-1.67 0-.92.75-1.67 1.67-1.67Z" />
96</svg>
97      </a>
98      <div
99        x-cloak
100        x-bind:class="{ 'translate-y-0 opacity-100' : pageBack, 'translate-y-full opacity-0 pointer-events-none': !pageBack }"
101        class="absolute inset-0 flex items-center justify-center text-white transform transition-all duration-500 ease-out">
102        <a href="/cases" class="inline-block group">
103          <span class="block text-white">Back</span>
104          <div class="h-px w-full relative mt-1">
105            <span class="block absolute z-10 inset-0 bg-white opacity-20"></span>
106            <span class="block absolute z-0 inset-0 bg-white scale-x-0 transition-transform duration-300 ease-out origin-right group-hover:origin-left group-hover:scale-x-100"></span>
107          </div>
108        </a>
109      </div>
110    </div>
111
112        <div class="header-menu-btn flex justify-end">
113      <button
114        x-data
115        x-cloak
116        x-on:click="!$store.menu.isPlaying ? $store.menu.toggle() : false;"
117        class="header-menu-btn flex items-center space-x-4 group">
118        <div class="relative overflow-hidden hidden lg:block">
119          <div
120            x-bind:class="{ '-translate-y-full pr-1' : $store.menu.opened }"
121            class="transition-all duration-700 ease-in-out">
122            <span class="block uppercase text-xs text-white text-white">Menu</span>
123            <span class="block uppercase text-xs absolute inset-0 translate-y-full text-white text-white">Close</span>
124          </div>
125        </div>
126        <div class="w-8 h-8 relative flex items-center justify-center rounded-full lg:w-12 lg:h-12">
127          <div
128            x-bind:class="{ 'h-[2px]' : $store.menu.opened, 'h-3' : !$store.menu.opened }"
129            class="w-full relative z-10 flex flex-col justify-between transition-all duration-300 ease-out group-hover:px-2 lg:group-hover:px-3">
130            <div class="w-full h-[2px] bg-white"></div>
131            <div class="w-full h-[2px] bg-white"></div>
132          </div>
133          <div class="absolute inset-0 z-0 bg-white opacity-0 rounded-full transform scale-50 transition-all duration-300 ease-out group-hover:opacity-5 group-hover:scale-100"></div>
134        </div>
135      </button>
136    </div>
137
138  </div>
139</header>
140
141<div
142  x-data
143  x-show="$store.menu.opened"
144  x-cloak
145  class="menu fixed z-20 inset-0 flex items-center pt-16">
146  <div class="container relative z-10 lg:flex lg:items-center lg:max-w-none lg:px-0 lg:flex-row-reverse">
147
148        <div class="menu-navigation mb-16 space-y-6 lg:mb-0 lg:w-1/2 lg:space-y-8">
149
150                <nav class="block">
151    <ul class="menu-navigation-list space-y-1">
152            <li class="block will-change-transform">
153        <a 
154          href="/about" 
155           class="menu-navigation-link inline-block group"
156          x-on:click="if($el.classList.contains('is-active')) { $store.menu.close(); }">
157          <span class="font-serif text-black text-fluid-sm transition-tracking duration-500 ease-out tracking-tight group-hover:tracking-normal">About us</span>
158          <div class="h-px w-full relative mt-0.5">
159            <span class="menu-navigation-link-underline block absolute z-0 inset-0 bg-black scale-x-0 transition-transform duration-500 ease-out origin-right group-hover:origin-left group-hover:scale-x-100"></span>
160          </div>
161        </a>
162      </li>
163            <li class="block will-change-transform">
164        <a 
165          href="/cases" 
166           class="menu-navigation-link inline-block group"
167          x-on:click="if($el.classList.contains('is-active')) { $store.menu.close(); }">
168          <span class="font-serif text-black text-fluid-sm transition-tracking duration-500 ease-out tracking-tight group-hover:tracking-normal">Works</span>
169          <div class="h-px w-full relative mt-0.5">
170            <span class="menu-navigation-link-underline block absolute z-0 inset-0 bg-black scale-x-0 transition-transform duration-500 ease-out origin-right group-hover:origin-left group-hover:scale-x-100"></span>
171          </div>
172        </a>
173      </li>
174            <li class="block will-change-transform">
175        <a 
176          href="/contact" 
177           class="menu-navigation-link inline-block group"
178          x-on:click="if($el.classList.contains('is-active')) { $store.menu.close(); }">
179          <span class="font-serif text-black text-fluid-sm transition-tracking duration-500 ease-out tracking-tight group-hover:tracking-normal">Contact</span>
180          <div class="h-px w-full relative mt-0.5">
181            <span class="menu-navigation-link-underline block absolute z-0 inset-0 bg-black scale-x-0 transition-transform duration-500 ease-out origin-right group-hover:origin-left group-hover:scale-x-100"></span>
182          </div>
183        </a>
184      </li>
185          </ul>
186  </nav>
187  
188
189
190
191            <div class="grid grid-cols-2 max-w-sm">
192
193        <div class="menu-contacts not-italic leading-relaxed text-xs text-black space-y-1 lg:text-sm">
194          <span class="block will-change-transform">
195            <a href="mailto:[email protected]
196" class="text-xs text-black lg:text-sm">[email protected]
197</a>
198          </span>
199          <span class="block will-change-transform">
200            <a href="tel:+35226302889" class="text-xs text-black lg:text-sm">+352 26 30 28 89</a>
201          </span>
202        </div>
203
204        <address class="menu-address not-italic leading-relaxed text-xs text-black space-y-1 lg:text-sm">
205          <span class="block will-change-transform">Explose S.à r. l.</span>
206          <span class="block will-change-transform">1535° Creative Hub</span>
207          <span class="block will-change-transform">115c, rue Emile Mark</span>
208          <span class="block will-change-transform">L-4620 Differdange</span>
209        </address>
210
211      </div>
212
213            
214    </div>
215
216        <div class="menu-video w-5/6 ml-auto lg:w-1/2">
217      <div class="menu-video-inner aspect-video mx-auto will-change-transform lg:w-5/12 lg:aspect-[4/6]">
218        <video x-data="loopPlayer()" muted loop autoplay playsinline disablePictureInPicture disableRemotePlayback preload="none" poster="https://i.vimeocdn.com/video/1527074036-56a0094c1edcc3347f2a80b0a60a5fb142f08bd5048a9007620b5d6558cdc659-d_960x540?r=pad" class="w-full h-full object-cover">
219  <source src="https://player.vimeo.com/progressive_redirect/playback/760381635/rendition/540p/file.mp4?loc=external&amp;oauth2_token_id=1660875299&amp;signature=8c008b184a6aaa8b777244da61a933a2eda65c10f88b998708d41906f7e5eaae#t=26,41" type="video/mp4">
220</video>
221      </div>
222    </div>
223
224  </div>
225
226  <div class="menu-bg absolute inset-0 bg-pink z-0"></div>
227
228</div>
229
230
231<main role="main" class="main relative z-10 pt-40 lg:pt-56 xl:pt-64 2xl:pt-72" data-router-wrapper>
232  <article data-router-view="node" class="">
233
234  <div class="space-y-16 md:space-y-24 lg:space-y-28 xl:space-y-32 2xl:space-y-48">
235
236        <div class="container">
237      <div class="space-y-8 text-center">
238        <h1 class="font-serif tracking-tight text-fluid-xl" data-scroller="title">It’s ok to stare</h1>
239        <p class="md:text-xl xl:text-2xl" data-scroller="fadein" data-scroller-delay="0.4">Audiovisual anomalies for human audiences.</p>
240      </div>
241    </div>
242
243        <div class="container" x-data="cases">
244
245            
246      <div data-results class="max-w-screen-xl mx-auto">
247        <div class="views-element-container"><div class="js-view-dom-id-1dae5d6c30872e0bd8d6962eeda7e0b91ffb50b7b0475ecfdd34080bcf56645b">
248  
249  
250  
251
252  
253  
254  
255
256  
257<ul class="cases space-y-16 lg:space-y-24 xl:space-y-32 2xl:space-y-48">
258    <li class="cases-item w-10/12 lg:w-5/6 odd:ml-auto :portrait">
259    <a 
260  x-data="caseThumbnail()"
261  x-show="activeFilter == 'all' || activeFilter == ''"
262  href="/cases/draganov" 
263  class="case-teaser block group space-y-2 md:space-y-4 lg:space-y-6">
264  <div class="case-teaser-video aspect-video relative">
265    <div class="absolute inset-0 transition-transform will-change-transform	duration-500 ease-out group-hover:scale-95">
266      <div class="absolute inset-0 z-10 transition-opacity duration-250 group-hover:opacity-0">
267        <img src="https://i.vimeocdn.com/video/2194235550-232e739c080409697d1d50f13e1c05f3844346bd25a6f05056fb9d70fa9b5796-d_960x540?&amp;r=pad&amp;region=us" alt="" class="w-full h-full object-cover" />
268      </div>
269      <video muted loop playsinline disablePictureInPicture disableRemotePlayback class="w-full h-full object-cover z-0">
270        <source src="https://player.vimeo.com/progressive_redirect/playback/1221512662/rendition/540p/file.mp4%20%28540p%29.mp4?loc=external&amp;oauth2_token_id=1660875299&amp;signature=8e998ff3cabf99fe5dd278ffea2137e6bc4c44a0d419d4855d85a25eb74a4b13" type="video/mp4">
271      </video>
272    </div>
273  </div>
274  <div class="space-y-1 lg:space-y-2 xl:space-y-4">
275    <h2 class="block font-serif text-3xl md:text-4xl lg:text-5xl xl:text-6xl" data-scroller="title">Draganov</h2>
276        <span data-scroller="fadein" class="block text-sm">L&#039;Olympia, Paris</span>
277      </div>
278</a>
279  </li>
280    <li class="cases-item w-10/12 lg:w-5/6 odd:ml-auto">
281    <a 
282  x-data="caseThumbnail()"
283  x-show="activeFilter == 'all' || activeFilter == ''"
284  href="/cases/manal-ssada-session" 
285  class="case-teaser block group space-y-2 md:space-y-4 lg:space-y-6">
286  <div class="case-teaser-video aspect-video relative">
287    <div class="absolute inset-0 transition-transform will-change-transform	duration-500 ease-out group-hover:scale-95">
288      <div class="absolute inset-0 z-10 transition-opacity duration-250 group-hover:opacity-0">
289        <img src="https://i.vimeocdn.com/video/2196037288-3d2c17433428f41ccd2a324b023fe306485178d18a7b2fdb397fffad750efb51-d_960x540?&amp;r=pad&amp;region=us" alt="" class="w-full h-full object-cover" />
290      </div>
291      <video muted loop playsinline disablePictureInPicture disableRemotePlayback class="w-full h-full object-cover z-0">
292        <source src="https://player.vimeo.com/progressive_redirect/playback/1184458142/rendition/540p/file.mp4%20%28540p%29.mp4?loc=external&amp;oauth2_token_id=1660875299&amp;signature=f3bf74f3cbfe15f70fc816a10736809fba1fe0a067e1bf97a10fe1c676e4b95c#t=300,420" type="video/mp4">
293      </video>
294    </div>
295  </div>
296  <div class="space-y-1 lg:space-y-2 xl:space-y-4">
297    <h2 class="block font-serif text-3xl md:text-4xl lg:text-5xl xl:text-6xl" data-scroller="title">Manal · Ssada Session</h2>
298        <span data-scroller="fadein" class="block text-sm">One stage, infinite worlds</span>
299      </div>
300</a>
301  </li>
302    <li class="cases-item w-10/12 lg:w-5/6 odd:ml-auto">
303    <a 
304  x-data="caseThumbnail()"
305  x-show="activeFilter == 'all' || activeFilter == ''"
306  href="/cases/content-uncontained" 
307  class="case-teaser block group space-y-2 md:space-y-4 lg:space-y-6">
308  <div class="case-teaser-video aspect-video relative">
309    <div class="absolute inset-0 transition-transform will-change-transform	duration-500 ease-out group-hover:scale-95">
310      <div class="absolute inset-0 z-10 transition-opacity duration-250 group-hover:opacity-0">
311        <img src="https://i.vimeocdn.com/video/1527074036-56a0094c1edcc3347f2a80b0a60a5fb142f08bd5048a9007620b5d6558cdc659-d_960x540?r=pad" alt="" class="w-full h-full object-cover" />
312      </div>
313      <video muted loop playsinline disablePictureInPicture disableRemotePlayback class="w-full h-full object-cover z-0">
314        <source src="https://player.vimeo.com/progressive_redirect/playback/760381635/rendition/540p/file.mp4?loc=external&amp;oauth2_token_id=1660875299&amp;signature=8c008b184a6aaa8b777244da61a933a2eda65c10f88b998708d41906f7e5eaae#t=8,15" type="video/mp4">
315      </video>
316    </div>
317  </div>
318  <div class="space-y-1 lg:space-y-2 xl:space-y-4">
319    <h2 class="block font-serif text-3xl md:text-4xl lg:text-5xl xl:text-6xl" data-scroller="title">Content, uncontained.</h2>
320        <span data-scroller="fadein" class="block text-sm">Lights Brandfilm</span>
321      </div>
322</a>
323  </li>
324    <li class="cases-item w-10/12 lg:w-5/6 odd:ml-auto :portrait">
325    <a 
326  x-data="caseThumbnail()"
327  x-show="activeFilter == 'all' || activeFilter == ''"
328  href="/cases/stormy" 
329  class="case-teaser block group space-y-2 md:space-y-4 lg:space-y-6">
330  <div class="case-teaser-video aspect-video relative">
331    <div class="absolute inset-0 transition-transform will-change-transform	duration-500 ease-out group-hover:scale-95">
332      <div class="absolute inset-0 z-10 transition-opacity duration-250 group-hover:opacity-0">
333        <img src="https://i.vimeocdn.com/video/2195760327-1707c3c4e05a9e6c6de252f33f54b5afbb721f866ff1d61bafadef5a09968507-d_960x540?&amp;r=pad&amp;region=us" alt="" class="w-full h-full object-cover" />
334      </div>
335      <video muted loop playsinline disablePictureInPicture disableRemotePlayback class="w-full h-full object-cover z-0">
336        <source src="https://player.vimeo.com/progressive_redirect/playback/1222726850/rendition/540p/file.mp4%20%28540p%29.mp4?loc=external&amp;oauth2_token_id=1660875299&amp;signature=4ef5204e2ac577eaba0a475426f8d73d0844e2f3566544b562f273edbe50caed" type="video/mp4">
337      </video>
338    </div>
339  </div>
340  <div class="space-y-1 lg:space-y-2 xl:space-y-4">
341    <h2 class="block font-serif text-3xl md:text-4xl lg:text-5xl xl:text-6xl" data-scroller="title">Stormy</h2>
342        <span data-scroller="fadein" class="block text-sm">Desperado Experience</span>
343      </div>
344</a>
345  </li>
346    <li class="cases-item w-10/12 lg:w-5/6 odd:ml-auto">
347    <a 
348  x-data="caseThumbnail()"
349  x-show="activeFilter == 'all' || activeFilter == ''"
350  href="/cases/immersive-installation-creative-day" 
351  class="case-teaser block group space-y-2 md:space-y-4 lg:space-y-6">
352  <div class="case-teaser-video aspect-video relative">
353    <div class="absolute inset-0 transition-transform will-change-transform	duration-500 ease-out group-hover:scale-95">
354      <div class="absolute inset-0 z-10 transition-opacity duration-250 group-hover:opacity-0">
355        <img src="https://i.vimeocdn.com/video/2203363910-37ed4b3107cfa2dad5282a6bdd2adb052f882495af27e4306222faf52e3a9d82-d_960x540?&amp;r=pad&amp;region=us" alt="" class="w-full h-full object-cover" />
356      </div>
357      <video muted loop playsinline disablePictureInPicture disableRemotePlayback class="w-full h-full object-cover z-0">
358        <source src="https://player.vimeo.com/progressive_redirect/playback/1127160843/rendition/540p/file.mp4%20%28540p%29.mp4?loc=external&amp;oauth2_token_id=1660875299&amp;signature=f3379079de5f6bfcfd2b83778dbfc5fac7b2f8656ee0c8b1b429ec90634a37cb#t=45,75" type="video/mp4">
359      </video>
360    </div>
361  </div>
362  <div class="space-y-1 lg:space-y-2 xl:space-y-4">
363    <h2 class="block font-serif text-3xl md:text-4xl lg:text-5xl xl:text-6xl" data-scroller="title">Immersive installation · Creative day</h2>
364        <span data-scroller="fadein" class="block text-sm">Creative Miners V2.0</span>
365      </div>
366</a>
367  </li>
368    <li class="cases-item w-10/12 lg:w-5/6 odd:ml-auto">
369    <a 
370  x-data="caseThumbnail()"
371  x-show="activeFilter == 'all' || activeFilter == ''"
372  href="/cases/turning-tables" 
373  class="case-teaser block group space-y-2 md:space-y-4 lg:space-y-6">
374  <div class="case-teaser-video aspect-video relative">
375    <div class="absolute inset-0 transition-transform will-change-transform	duration-500 ease-out group-hover:scale-95">
376      <div class="absolute inset-0 z-10 transition-opacity duration-250 group-hover:opacity-0">
377        <img src="https://i.vimeocdn.com/video/2080595986-6d25e1046afc142b5c5afa6b79a5a8f0e87da2249d6ea96d2e6833c4a2a37421-d_960x540?&amp;r=pad&amp;region=us" alt="" class="w-full h-full object-cover" />
378      </div>
379      <video muted loop playsinline disablePictureInPicture disableRemotePlayback class="w-full h-full object-cover z-0">
380        <source src="https://player.vimeo.com/progressive_redirect/playback/1135308392/rendition/540p/file.mp4?loc=external&amp;oauth2_token_id=1660875299&amp;signature=c290327a304085bb2ed3ebf74731b648d16349d00ebc05ae5a05b73898407123#t=3,60" type="video/mp4">
381      </video>
382    </div>
383  </div>
384  <div class="space-y-1 lg:space-y-2 xl:space-y-4">
385    <h2 class="block font-serif text-3xl md:text-4xl lg:text-5xl xl:text-6xl" data-scroller="title">Turning Tables</h2>
386        <span data-scroller="fadein" class="block text-sm">Intergalactic</span>
387      </div>
388</a>
389  </li>
390    <li class="cases-item w-10/12 lg:w-5/6 odd:ml-auto">
391    <a 
392  x-data="caseThumbnail()"
393  x-show="activeFilter == 'all' || activeFilter == ''"
394  href="/cases/merendina-x-draganov" 
395  class="case-teaser block group space-y-2 md:space-y-4 lg:space-y-6">
396  <div class="case-teaser-video aspect-video relative">
397    <div class="absolute inset-0 transition-transform will-change-transform	duration-500 ease-out group-hover:scale-95">
398      <div class="absolute inset-0 z-10 transition-opacity duration-250 group-hover:opacity-0">
399        <img src="https://i.vimeocdn.com/video/2082172390-1e0e418236288a9f73f891a9383ded907764a04304e071b9a0459c5a15ba80c7-d_960x540?&amp;r=pad&amp;region=us" alt="" class="w-full h-full object-cover" />
400      </div>
401      <video muted loop playsinline disablePictureInPicture disableRemotePlayback class="w-full h-full object-cover z-0">
402        <source src="https://player.vimeo.com/progressive_redirect/playback/1136474476/rendition/540p/file.mp4?loc=external&amp;oauth2_token_id=1660875299&amp;signature=1bde03fdab731de29559c3323d95c372cf1f6b03ea8ba84354a9ad43024fa610" type="video/mp4">
403      </video>
404    </div>
405  </div>
406  <div class="space-y-1 lg:space-y-2 xl:space-y-4">
407    <h2 class="block font-serif text-3xl md:text-4xl lg:text-5xl xl:text-6xl" data-scroller="title">Merendina X Draganov</h2>
408        <span data-scroller="fadein" class="block text-sm">Tsswirtek</span>
409      </div>
410</a>
411  </li>
412    <li class="cases-item w-10/12 lg:w-5/6 odd:ml-auto :portrait">
413    <a 
414  x-data="caseThumbnail()"
415  x-show="activeFilter == 'all' || activeFilter == ''"
416  href="/cases/manal-summer-tour" 
417  class="case-teaser block group space-y-2 md:space-y-4 lg:space-y-6">
418  <div class="case-teaser-video aspect-video relative">
419    <div class="absolute inset-0 transition-transform will-change-transform	duration-500 ease-out group-hover:scale-95">
420      <div class="absolute inset-0 z-10 transition-opacity duration-250 group-hover:opacity-0">
421        <img src="https://i.vimeocdn.com/video/2196067964-4206743eee11ade46f3338ae8e5048ac131bc7427e9b751734691ea745a98cb3-d_960x540?&amp;r=pad&amp;region=us" alt="" class="w-full h-full object-cover" />
422      </div>
423      <video muted loop playsinline disablePictureInPicture disableRemotePlayback class="w-full h-full object-cover z-0">
424        <source src="https://player.vimeo.com/progressive_redirect/playback/1222697491/rendition/540p/file.mp4%20%28540p%29.mp4?loc=external&amp;oauth2_token_id=1660875299&amp;signature=9511a83e9ec44269750486f815897d9ff69889d60e6ef2cd009931138a722868" type="video/mp4">
425      </video>
426    </div>
427  </div>
428  <div class="space-y-1 lg:space-y-2 xl:space-y-4">
429    <h2 class="block font-serif text-3xl md:text-4xl lg:text-5xl xl:text-6xl" data-scroller="title">Manal · Summer Tour</h2>
430        <span data-scroller="fadein" class="block text-sm">The full live experience, show after show</span>
431      </div>
432</a>
433  </li>
434    <li class="cases-item w-10/12 lg:w-5/6 odd:ml-auto">
435    <a 
436  x-data="caseThumbnail()"
437  x-show="activeFilter == 'all' || activeFilter == ''"
438  href="/cases/exhibit" 
439  class="case-teaser block group space-y-2 md:space-y-4 lg:space-y-6">
440  <div class="case-teaser-video aspect-video relative">
441    <div class="absolute inset-0 transition-transform will-change-transform	duration-500 ease-out group-hover:scale-95">
442      <div class="absolute inset-0 z-10 transition-opacity duration-250 group-hover:opacity-0">
443        <img src="https://i.vimeocdn.com/video/2082210999-a242f198d58aa0b14ede77e1a10118bf691afb991de99bed010155e97ccf4451-d_960x540?&amp;r=pad&amp;region=us" alt="" class="w-full h-full object-cover" />
444      </div>
445      <video muted loop playsinline disablePictureInPicture disableRemotePlayback class="w-full h-full object-cover z-0">
446        <source src="https://player.vimeo.com/progressive_redirect/playback/1136502678/rendition/540p/file.mp4?loc=external&amp;oauth2_token_id=1660875299&amp;signature=33916a6bcf447fecf5af8c2ddcacba783a0950122014bb3463b8e00c50d4590f" type="video/mp4">
447      </video>
448    </div>
449  </div>
450  <div class="space-y-1 lg:space-y-2 xl:space-y-4">
451    <h2 class="block font-serif text-3xl md:text-4xl lg:text-5xl xl:text-6xl" data-scroller="title">Exhibit</h2>
452        <span data-scroller="fadein" class="block text-sm">Shortfilm</span>
453      </div>
454</a>
455  </li>
456    <li class="cases-item w-10/12 lg:w-5/6 odd:ml-auto">
457    <a 
458  x-data="caseThumbnail()"
459  x-show="activeFilter == 'all' || activeFilter == ''"
460  href="/cases/stork-fiction" 
461  class="case-teaser block group space-y-2 md:space-y-4 lg:space-y-6">
462  <div class="case-teaser-video aspect-video relative">
463    <div class="absolute inset-0 transition-transform will-change-transform	duration-500 ease-out group-hover:scale-95">
464      <div class="absolute inset-0 z-10 transition-opacity duration-250 group-hover:opacity-0">
465        <img src="https://i.vimeocdn.com/video/2082218069-1961f6641ce294b217a5d7256f8787cc796c7145447df1a39d0e87af9dc0c8e5-d_960x540?&amp;r=pad&amp;region=us" alt="" class="w-full h-full object-cover" />
466      </div>
467      <video muted loop playsinline disablePictureInPicture disableRemotePlayback class="w-full h-full object-cover z-0">
468        <source src="https://player.vimeo.com/progressive_redirect/playback/835592388/rendition/540p/file.mp4?loc=external&amp;oauth2_token_id=1660875299&amp;signature=5e2a8534a7da2a6d03681114896a447473aa72066522b087c521a39c81114a11#t=259,285" type="video/mp4">
469      </video>
470    </div>
471  </div>
472  <div class="space-y-1 lg:space-y-2 xl:space-y-4">
473    <h2 class="block font-serif text-3xl md:text-4xl lg:text-5xl xl:text-6xl" data-scroller="title">Stork Fiction</h2>
474        <span data-scroller="fadein" class="block text-sm">Short film</span>
475      </div>
476</a>
477  </li>
478    <li class="cases-item w-10/12 lg:w-5/6 odd:ml-auto">
479    <a 
480  x-data="caseThumbnail()"
481  x-show="activeFilter == 'all' || activeFilter == ''"
482  href="/cases/visa-music" 
483  class="case-teaser block group space-y-2 md:space-y-4 lg:space-y-6">
484  <div class="case-teaser-video aspect-video relative">
485    <div class="absolute inset-0 transition-transform will-change-transform	duration-500 ease-out group-hover:scale-95">
486      <div class="absolute inset-0 z-10 transition-opacity duration-250 group-hover:opacity-0">
487        <img src="https://i.vimeocdn.com/video/1522215922-fcb9d5e04fd4465f3a8c79189c62b52b2ec678e9356d961d645bfe289eb6b14e-d_960x540?r=pad" alt="" class="w-full h-full object-cover" />
488      </div>
489      <video muted loop playsinline disablePictureInPicture disableRemotePlayback class="w-full h-full object-cover z-0">
490        <source src="https://player.vimeo.com/progressive_redirect/playback/757548168/rendition/540p/file.mp4?loc=external&amp;oauth2_token_id=1660875299&amp;signature=c655358023f0bded91b52df76ef1268e628cb9242d161318de8c2950038da440#t=2,28" type="video/mp4">
491      </video>
492    </div>
493  </div>
494  <div class="space-y-1 lg:space-y-2 xl:space-y-4">
495    <h2 class="block font-serif text-3xl md:text-4xl lg:text-5xl xl:text-6xl" data-scroller="title">Visa For Music</h2>
496        <span data-scroller="fadein" class="block text-sm">Audiovisual live session production</span>
497      </div>
498</a>
499  </li>
500    <li class="cases-item w-10/12 lg:w-5/6 odd:ml-auto">
501    <a 
502  x-data="caseThumbnail()"
503  x-show="activeFilter == 'all' || activeFilter == ''"
504  href="/cases/craft-30" 
505  class="case-teaser block group space-y-2 md:space-y-4 lg:space-y-6">
506  <div class="case-teaser-video aspect-video relative">
507    <div class="absolute inset-0 transition-transform will-change-transform	duration-500 ease-out group-hover:scale-95">
508      <div class="absolute inset-0 z-10 transition-opacity duration-250 group-hover:opacity-0">
509        <img src="https://i.vimeocdn.com/video/1533123043-fa3f02cb10766402d6a9a0780b4d7796ef0606ffaad7fa53417b25563b4ab69c-d_960x540?r=pad" alt="" class="w-full h-full object-cover" />
510      </div>
511      <video muted loop playsinline disablePictureInPicture disableRemotePlayback class="w-full h-full object-cover z-0">
512        <source src="https://player.vimeo.com/progressive_redirect/playback/707551691/rendition/540p/file.mp4?loc=external&amp;oauth2_token_id=1660875299&amp;signature=23d360ec67707aa677f8e4ed1ba38095763a26b1ef155d5fd5d55b1fc3477d41#t=12,36" type="video/mp4">
513      </video>
514    </div>
515  </div>
516  <div class="space-y-1 lg:space-y-2 xl:space-y-4">
517    <h2 class="block font-serif text-3xl md:text-4xl lg:text-5xl xl:text-6xl" data-scroller="title">Craft 3.0</h2>
518        <span data-scroller="fadein" class="block text-sm">Event design</span>
519      </div>
520</a>
521  </li>
522    <li class="cases-item w-10/12 lg:w-5/6 odd:ml-auto">
523    <a 
524  x-data="caseThumbnail()"
525  x-show="activeFilter == 'all' || activeFilter == ''"
526  href="/cases/42-luxembourg" 
527  class="case-teaser block group space-y-2 md:space-y-4 lg:space-y-6">
528  <div class="case-teaser-video aspect-video relative">
529    <div class="absolute inset-0 transition-transform will-change-transform	duration-500 ease-out group-hover:scale-95">
530      <div class="absolute inset-0 z-10 transition-opacity duration-250 group-hover:opacity-0">
531        <img src="https://i.vimeocdn.com/video/2082188765-ef9fa64f033af6baf1792f667128d8a134ed14f756871449a44234e5d7efb0cc-d_960x540?&amp;r=pad&amp;region=us" alt="" class="w-full h-full object-cover" />
532      </div>
533      <video muted loop playsinline disablePictureInPicture disableRemotePlayback class="w-full h-full object-cover z-0">
534        <source src="https://player.vimeo.com/progressive_redirect/playback/1082167728/rendition/540p/file.mp4?loc=external&amp;oauth2_token_id=1660875299&amp;signature=27bcc7d1e41fa7fb1dee8dc0f9eaae0082b71c5a9a465096c5e1ea11891c01c3" type="video/mp4">
535      </video>
536    </div>
537  </div>
538  <div class="space-y-1 lg:space-y-2 xl:space-y-4">
539    <h2 class="block font-serif text-3xl md:text-4xl lg:text-5xl xl:text-6xl" data-scroller="title">42 Luxembourg</h2>
540        <span data-scroller="fadein" class="block text-sm">Life at 42</span>
541      </div>
542</a>
543  </li>
544    <li class="cases-item w-10/12 lg:w-5/6 odd:ml-auto">
545    <a 
546  x-data="caseThumbnail()"
547  x-show="activeFilter == 'all' || activeFilter == ''"
548  href="/cases/1535-creative-days" 
549  class="case-teaser block group space-y-2 md:space-y-4 lg:space-y-6">
550  <div class="case-teaser-video aspect-video relative">
551    <div class="absolute inset-0 transition-transform will-change-transform	duration-500 ease-out group-hover:scale-95">
552      <div class="absolute inset-0 z-10 transition-opacity duration-250 group-hover:opacity-0">
553        <img src="https://i.vimeocdn.com/video/1525763296-a60b176c65b49da56e26c4bf77a716972868c6fc5255d94c9e3ac6d48c100335-d_960x540?r=pad" alt="" class="w-full h-full object-cover" />
554      </div>
555      <video muted loop playsinline disablePictureInPicture disableRemotePlayback class="w-full h-full object-cover z-0">
556        <source src="https://player.vimeo.com/progressive_redirect/playback/657833256/rendition/540p/file.mp4?loc=external&amp;oauth2_token_id=1660875299&amp;signature=b15901b7fcdd5a7cffd0d1b039d81bf774d7dfdb1cd57af48fcf82bd3bdca8b9#t=26,53" type="video/mp4">
557      </video>
558    </div>
559  </div>
560  <div class="space-y-1 lg:space-y-2 xl:space-y-4">
561    <h2 class="block font-serif text-3xl md:text-4xl lg:text-5xl xl:text-6xl" data-scroller="title">1535 Creative Days</h2>
562        <span data-scroller="fadein" class="block text-sm">Event design</span>
563      </div>
564</a>
565  </li>
566    <li class="cases-item w-10/12 lg:w-5/6 odd:ml-auto">
567    <a 
568  x-data="caseThumbnail()"
569  x-show="activeFilter == 'all' || activeFilter == ''"
570  href="/cases/govtech-lab" 
571  class="case-teaser block group space-y-2 md:space-y-4 lg:space-y-6">
572  <div class="case-teaser-video aspect-video relative">
573    <div class="absolute inset-0 transition-transform will-change-transform	duration-500 ease-out group-hover:scale-95">
574      <div class="absolute inset-0 z-10 transition-opacity duration-250 group-hover:opacity-0">
575        <img src="https://i.vimeocdn.com/video/1514463907-a17c45d4a2e9d322d6acb8acd4a630d0b60a4a305a1cc6689c29c867e82b7d8f-d_960x540?r=pad" alt="" class="w-full h-full object-cover" />
576      </div>
577      <video muted loop playsinline disablePictureInPicture disableRemotePlayback class="w-full h-full object-cover z-0">
578        <source src="https://player.vimeo.com/progressive_redirect/playback/753605742/rendition/540p/file.mp4?loc=external&amp;oauth2_token_id=1660875299&amp;signature=25a782f0583395796dd39360c9a2fae8d0c0989120587f214282968b1a039518#t=20,60" type="video/mp4">
579      </video>
580    </div>
581  </div>
582  <div class="space-y-1 lg:space-y-2 xl:space-y-4">
583    <h2 class="block font-serif text-3xl md:text-4xl lg:text-5xl xl:text-6xl" data-scroller="title">Govtech Lab</h2>
584        <span data-scroller="fadein" class="block text-sm">Experiment. Exchange. Innovate.</span>
585      </div>
586</a>
587  </li>
588    <li class="cases-item w-10/12 lg:w-5/6 odd:ml-auto">
589    <a 
590  x-data="caseThumbnail()"
591  x-show="activeFilter == 'all' || activeFilter == ''"
592  href="/cases/serge-tonnar-meets-cipa" 
593  class="case-teaser block group space-y-2 md:space-y-4 lg:space-y-6">
594  <div class="case-teaser-video aspect-video relative">
595    <div class="absolute inset-0 transition-transform will-change-transform	duration-500 ease-out group-hover:scale-95">
596      <div class="absolute inset-0 z-10 transition-opacity duration-250 group-hover:opacity-0">
597        <img src="https://i.vimeocdn.com/video/1526100927-b81f366a7454879cfadb0ebdf0af5e44cf74d6601eff58303c3ce375ff853771-d_960x540?r=pad" alt="" class="w-full h-full object-cover" />
598      </div>
599      <video muted loop playsinline disablePictureInPicture disableRemotePlayback class="w-full h-full object-cover z-0">
600        <source src="https://player.vimeo.com/progressive_redirect/playback/730004096/rendition/540p/file.mp4?loc=external&amp;oauth2_token_id=1660875299&amp;signature=cef73d5d96420c5886075ecfe090cd3a855788b3c39dab933f097c1aed4e35f4#t=30,40" type="video/mp4">
601      </video>
602    </div>
603  </div>
604  <div class="space-y-1 lg:space-y-2 xl:space-y-4">
605    <h2 class="block font-serif text-3xl md:text-4xl lg:text-5xl xl:text-6xl" data-scroller="title">Serge Tonnar meets CIPA</h2>
606        <span data-scroller="fadein" class="block text-sm">Meng Boma</span>
607      </div>
608</a>
609  </li>
610    <li class="cases-item w-10/12 lg:w-5/6 odd:ml-auto">
611    <a 
612  x-data="caseThumbnail()"
613  x-show="activeFilter == 'all' || activeFilter == ''"
614  href="/cases/wanterfeeling" 
615  class="case-teaser block group space-y-2 md:space-y-4 lg:space-y-6">
616  <div class="case-teaser-video aspect-video relative">
617    <div class="absolute inset-0 transition-transform will-change-transform	duration-500 ease-out group-hover:scale-95">
618      <div class="absolute inset-0 z-10 transition-opacity duration-250 group-hover:opacity-0">
619        <img src="https://i.vimeocdn.com/video/1526313246-33483fcd34696da3eb9568e88f02c856a8450204c6873668ebfa5c2789b89abb-d_960x540?r=pad" alt="" class="w-full h-full object-cover" />
620      </div>
621      <video muted loop playsinline disablePictureInPicture disableRemotePlayback class="w-full h-full object-cover z-0">
622        <source src="https://player.vimeo.com/progressive_redirect/playback/646497338/rendition/540p/file.mp4?loc=external&amp;oauth2_token_id=1660875299&amp;signature=936f189672f33c945b3ce9c543a7c1ab2e7c14691a14c7995e19ff39712db8a6#t=39,49" type="video/mp4">
623      </video>
624    </div>
625  </div>
626  <div class="space-y-1 lg:space-y-2 xl:space-y-4">
627    <h2 class="block font-serif text-3xl md:text-4xl lg:text-5xl xl:text-6xl" data-scroller="title">Wanterfeeling</h2>
628        <span data-scroller="fadein" class="block text-sm">Sanem Castle</span>
629      </div>
630</a>
631  </li>
632    <li class="cases-item w-10/12 lg:w-5/6 odd:ml-auto">
633    <a 
634  x-data="caseThumbnail()"
635  x-show="activeFilter == 'all' || activeFilter == ''"
636  href="/cases/luxembourg-science-center" 
637  class="case-teaser block group space-y-2 md:space-y-4 lg:space-y-6">
638  <div class="case-teaser-video aspect-video relative">
639    <div class="absolute inset-0 transition-transform will-change-transform	duration-500 ease-out group-hover:scale-95">
640      <div class="absolute inset-0 z-10 transition-opacity duration-250 group-hover:opacity-0">
641        <img src="https://i.vimeocdn.com/video/1031194377-3ead58d3dbd3eea2d55b7c292a54f35b67952736d2aa64b521165825313a8575-d_960x540?r=pad" alt="" class="w-full h-full object-cover" />
642      </div>
643      <video muted loop playsinline disablePictureInPicture disableRemotePlayback class="w-full h-full object-cover z-0">
644        <source src="https://player.vimeo.com/progressive_redirect/playback/498319807/rendition/540p/file.mp4?loc=external&amp;oauth2_token_id=1660875299&amp;signature=e4e664a662760aff31824ca23e639b728c8ed5b08c7046960d3c5c9f009d1c0b#t=1,10" type="video/mp4">
645      </video>
646    </div>
647  </div>
648  <div class="space-y-1 lg:space-y-2 xl:space-y-4">
649    <h2 class="block font-serif text-3xl md:text-4xl lg:text-5xl xl:text-6xl" data-scroller="title">Luxembourg Science Center</h2>
650        <span data-scroller="fadein" class="block text-sm">Audiovisual production</span>
651      </div>
652</a>
653  </li>
654    <li class="cases-item w-10/12 lg:w-5/6 odd:ml-auto">
655    <a 
656  x-data="caseThumbnail()"
657  x-show="activeFilter == 'all' || activeFilter == ''"
658  href="/cases/1535deg-creative-week" 
659  class="case-teaser block group space-y-2 md:space-y-4 lg:space-y-6">
660  <div class="case-teaser-video aspect-video relative">
661    <div class="absolute inset-0 transition-transform will-change-transform	duration-500 ease-out group-hover:scale-95">
662      <div class="absolute inset-0 z-10 transition-opacity duration-250 group-hover:opacity-0">
663        <img src="https://i.vimeocdn.com/video/1463071660-f4dc230701ace56b042837de4614e111da2ba0cb656989dc10e57999c152f5fc-d_960x540?r=pad" alt="" class="w-full h-full object-cover" />
664      </div>
665      <video muted loop playsinline disablePictureInPicture disableRemotePlayback class="w-full h-full object-cover z-0">
666        <source src="https://player.vimeo.com/progressive_redirect/playback/646795351/rendition/540p/file.mp4?loc=external&amp;oauth2_token_id=1660875299&amp;signature=ae8c57e1f7c87de9c6d300cf033a54d74e1110a3f483db6f3cbdc6dfd289a706" type="video/mp4">
667      </video>
668    </div>
669  </div>
670  <div class="space-y-1 lg:space-y-2 xl:space-y-4">
671    <h2 class="block font-serif text-3xl md:text-4xl lg:text-5xl xl:text-6xl" data-scroller="title">1535° Creative Week</h2>
672        <span data-scroller="fadein" class="block text-sm">Digital event, concept &amp; production</span>
673      </div>
674</a>
675  </li>
676    <li class="cases-item w-10/12 lg:w-5/6 odd:ml-auto">
677    <a 
678  x-data="caseThumbnail()"
679  x-show="activeFilter == 'all' || activeFilter == ''"
680  href="/cases/lidl-trek-cycling-team" 
681  class="case-teaser block group space-y-2 md:space-y-4 lg:space-y-6">
682  <div class="case-teaser-video aspect-video relative">
683    <div class="absolute inset-0 transition-transform will-change-transform	duration-500 ease-out group-hover:scale-95">
684      <div class="absolute inset-0 z-10 transition-opacity duration-250 group-hover:opacity-0">
685        <img src="https://i.vimeocdn.com/video/1691526992-e46ad68a0a5ce7dd4eb28e85f0fab78d573ad4b2331411d0b4874cc06c7a6b00-d_960x540?r=pad" alt="" class="w-full h-full object-cover" />
686      </div>
687      <video muted loop playsinline disablePictureInPicture disableRemotePlayback class="w-full h-full object-cover z-0">
688        <source src="https://player.vimeo.com/progressive_redirect/playback/841193040/rendition/540p/file.mp4?loc=external&amp;oauth2_token_id=1660875299&amp;signature=0d18313cd5b867276852aa40c23d57388cd791f8db8663ba78c418339bb813be" type="video/mp4">
689      </video>
690    </div>
691  </div>
692  <div class="space-y-1 lg:space-y-2 xl:space-y-4">
693    <h2 class="block font-serif text-3xl md:text-4xl lg:text-5xl xl:text-6xl" data-scroller="title">Lidl-Trek Cycling team</h2>
694        <span data-scroller="fadein" class="block text-sm">Digital brand activation</span>
695      </div>
696</a>
697  </li>
698    <li class="cases-item w-10/12 lg:w-5/6 odd:ml-auto">
699    <a 
700  x-data="caseThumbnail()"
701  x-show="activeFilter == 'all' || activeFilter == ''"
702  href="/cases/krounebierg-aquatic-center" 
703  class="case-teaser block group space-y-2 md:space-y-4 lg:space-y-6">
704  <div class="case-teaser-video aspect-video relative">
705    <div class="absolute inset-0 transition-transform will-change-transform	duration-500 ease-out group-hover:scale-95">
706      <div class="absolute inset-0 z-10 transition-opacity duration-250 group-hover:opacity-0">
707        <img src="https://i.vimeocdn.com/video/1693058378-06fc772c924d7ff4eab9cfe606830f78ea10d740cd6355e2f7e02c73471dc1c3-d_960x540?r=pad" alt="" class="w-full h-full object-cover" />
708      </div>
709      <video muted loop playsinline disablePictureInPicture disableRemotePlayback class="w-full h-full object-cover z-0">
710        <source src="https://player.vimeo.com/progressive_redirect/playback/842106154/rendition/540p/file.mp4?loc=external&amp;oauth2_token_id=1660875299&amp;signature=7bd9a78e9af53003dbad5dc0e68d4ca579b21350d0a9dee1b435a103a1dc56fd" type="video/mp4">
711      </video>
712    </div>
713  </div>
714  <div class="space-y-1 lg:space-y-2 xl:space-y-4">
715    <h2 class="block font-serif text-3xl md:text-4xl lg:text-5xl xl:text-6xl" data-scroller="title">Krounebierg Aquatic Center</h2>
716        <span data-scroller="fadein" class="block text-sm">Audiovisual production</span>
717      </div>
718</a>
719  </li>
720    <li class="cases-item w-10/12 lg:w-5/6 odd:ml-auto">
721    <a 
722  x-data="caseThumbnail()"
723  x-show="activeFilter == 'all' || activeFilter == ''"
724  href="/cases/lxb-street" 
725  class="case-teaser block group space-y-2 md:space-y-4 lg:space-y-6">
726  <div class="case-teaser-video aspect-video relative">
727    <div class="absolute inset-0 transition-transform will-change-transform	duration-500 ease-out group-hover:scale-95">
728      <div class="absolute inset-0 z-10 transition-opacity duration-250 group-hover:opacity-0">
729        <img src="https://i.vimeocdn.com/video/1471662429-0ed1113eff4ece213249aa56b4de79ac747081cc7727bba1eb2444aa779e778a-d_960x540?r=pad" alt="" class="w-full h-full object-cover" />
730      </div>
731      <video muted loop playsinline disablePictureInPicture disableRemotePlayback class="w-full h-full object-cover z-0">
732        <source src="https://player.vimeo.com/progressive_redirect/playback/731199074/rendition/540p/file.mp4?loc=external&amp;oauth2_token_id=1660875299&amp;signature=85ff34aa4f2d189ca164004ae50257b013a1e3bcb9ff55ff6115554c79fdc946" type="video/mp4">
733      </video>
734    </div>
735  </div>
736  <div class="space-y-1 lg:space-y-2 xl:space-y-4">
737    <h2 class="block font-serif text-3xl md:text-4xl lg:text-5xl xl:text-6xl" data-scroller="title">LXB Street</h2>
738        <span data-scroller="fadein" class="block text-sm">Aftermovie</span>
739      </div>
740</a>
741  </li>
742    <li class="cases-item w-10/12 lg:w-5/6 odd:ml-auto">
743    <a 
744  x-data="caseThumbnail()"
745  x-show="activeFilter == 'all' || activeFilter == ''"
746  href="/cases/sozial-nohalteg-solidaresch" 
747  class="case-teaser block group space-y-2 md:space-y-4 lg:space-y-6">
748  <div class="case-teaser-video aspect-video relative">
749    <div class="absolute inset-0 transition-transform will-change-transform	duration-500 ease-out group-hover:scale-95">
750      <div class="absolute inset-0 z-10 transition-opacity duration-250 group-hover:opacity-0">
751        <img src="https://i.vimeocdn.com/video/1696711498-e3ac95099c19871a6c924132aa297d6623df54041057fbdaedfd1db5679c1a05-d_960x540?r=pad" alt="" class="w-full h-full object-cover" />
752      </div>
753      <video muted loop playsinline disablePictureInPicture disableRemotePlayback class="w-full h-full object-cover z-0">
754        <source src="https://player.vimeo.com/progressive_redirect/playback/819783380/rendition/540p/file.mp4?loc=external&amp;oauth2_token_id=1660875299&amp;signature=02f90883deca5c353a6ec0bfe8b4dec571ac17baa45fa78f88aa53c30268830d" type="video/mp4">
755      </video>
756    </div>
757  </div>
758  <div class="space-y-1 lg:space-y-2 xl:space-y-4">
759    <h2 class="block font-serif text-3xl md:text-4xl lg:text-5xl xl:text-6xl" data-scroller="title">Sozial. Nohalteg. Solidaresch.</h2>
760        <span data-scroller="fadein" class="block text-sm">Short documentary</span>
761      </div>
762</a>
763  </li>
764    <li class="cases-item w-10/12 lg:w-5/6 odd:ml-auto">
765    <a 
766  x-data="caseThumbnail()"
767  x-show="activeFilter == 'all' || activeFilter == ''"
768  href="/cases/creative-days" 
769  class="case-teaser block group space-y-2 md:space-y-4 lg:space-y-6">
770  <div class="case-teaser-video aspect-video relative">
771    <div class="absolute inset-0 transition-transform will-change-transform	duration-500 ease-out group-hover:scale-95">
772      <div class="absolute inset-0 z-10 transition-opacity duration-250 group-hover:opacity-0">
773        <img src="https://i.vimeocdn.com/video/1765801713-35dd0e529745f81b615f20d21980db480de8df9ffd2883e03630c72296290a9f-d_960x540?r=pad" alt="" class="w-full h-full object-cover" />
774      </div>
775      <video muted loop playsinline disablePictureInPicture disableRemotePlayback class="w-full h-full object-cover z-0">
776        <source src="https://player.vimeo.com/progressive_redirect/playback/881744548/rendition/540p/file.mp4?loc=external&amp;oauth2_token_id=1660875299&amp;signature=897a04721106402a9b73a21925b50701144eff840b2c8b2b02b7beeceae3a9da" type="video/mp4">
777      </video>
778    </div>
779  </div>
780  <div class="space-y-1 lg:space-y-2 xl:space-y-4">
781    <h2 class="block font-serif text-3xl md:text-4xl lg:text-5xl xl:text-6xl" data-scroller="title">Creative Days </h2>
782        <span data-scroller="fadein" class="block text-sm">Events &amp; Experiences, Video production</span>
783      </div>
784</a>
785  </li>
786  </ul>
787
788    
789
790  
791  
792
793  
794  
795</div>
796</div>
797
798      </div>
799
800    </div>
801
802            <div>
803      <a href="/contact" class="block relative h-screen bg-black lg:h-auto lg:aspect-[4/3]">
804  <div class="absolute inset-0 z-10 flex items-center justify-center">
805    <div class="container">
806      <div class="max-w-screen-xl mx-auto text-center space-y-8 lg:space-y-16">
807        <span class="block text-white text-sm lg:text-base" data-scroller="fadein">You have a project ?</span>
808        <h4 class="font-serif text-white text-fluid-lg transition-tracking duration-500 ease-out tracking-tight hover:tracking-normal" data-scroller="title">Let&#039;s talk</h4>
809      </div>
810    </div>
811  </div>
812  <div class="absolute inset-0 z-0 cover">
813            
814  <picture>
815                  <source srcset="/sites/default/files/styles/1600/public/upload/media/image/2022-10/Lights%20-%20Behind%20the%20scene_181.webp?itok=RgkvNZmU 1x, /sites/default/files/styles/2000/public/upload/media/image/2022-10/Lights%20-%20Behind%20the%20scene_181.webp?itok=wlALmVbv 2x" media="(min-width: 1600px)" type="image/webp" width="1600" height="1067"/>
816              <source srcset="/sites/default/files/styles/1280/public/upload/media/image/2022-10/Lights%20-%20Behind%20the%20scene_181.webp?itok=vLEOan_x 1x, /sites/default/files/styles/1600/public/upload/media/image/2022-10/Lights%20-%20Behind%20the%20scene_181.webp?itok=RgkvNZmU 2x" media="(min-width: 1280px)" type="image/webp" width="1280" height="853"/>
817              <source srcset="/sites/default/files/styles/640/public/upload/media/image/2022-10/Lights%20-%20Behind%20the%20scene_181.webp?itok=EOp_r4IK 1x, /sites/default/files/styles/1280/public/upload/media/image/2022-10/Lights%20-%20Behind%20the%20scene_181.webp?itok=vLEOan_x 2x" media="(min-width: 640px)" type="image/webp" width="640" height="427"/>
818              <source srcset="/sites/default/files/styles/640/public/upload/media/image/2022-10/Lights%20-%20Behind%20the%20scene_181.webp?itok=EOp_r4IK 1x, /sites/default/files/styles/1280/public/upload/media/image/2022-10/Lights%20-%20Behind%20the%20scene_181.webp?itok=vLEOan_x 2x" media="(min-width: 0px)" type="image/webp" width="640" height="427"/>
819              <source srcset="/sites/default/files/styles/1600/public/upload/media/image/2022-10/Lights%20-%20Behind%20the%20scene_181.jpg?itok=RgkvNZmU 1x, /sites/default/files/styles/2000/public/upload/media/image/2022-10/Lights%20-%20Behind%20the%20scene_181.jpg?itok=wlALmVbv 2x" media="(min-width: 1600px)" type="image/jpeg" width="1600" height="1067"/>
820              <source srcset="/sites/default/files/styles/1280/public/upload/media/image/2022-10/Lights%20-%20Behind%20the%20scene_181.jpg?itok=vLEOan_x 1x, /sites/default/files/styles/1600/public/upload/media/image/2022-10/Lights%20-%20Behind%20the%20scene_181.jpg?itok=RgkvNZmU 2x" media="(min-width: 1280px)" type="image/jpeg" width="1280" height="853"/>
821              <source srcset="/sites/default/files/styles/640/public/upload/media/image/2022-10/Lights%20-%20Behind%20the%20scene_181.jpg?itok=EOp_r4IK 1x, /sites/default/files/styles/1280/public/upload/media/image/2022-10/Lights%20-%20Behind%20the%20scene_181.jpg?itok=vLEOan_x 2x" media="(min-width: 640px)" type="image/jpeg" width="640" height="427"/>
822              <source srcset="/sites/default/files/styles/640/public/upload/media/image/2022-10/Lights%20-%20Behind%20the%20scene_181.jpg?itok=EOp_r4IK 1x, /sites/default/files/styles/1280/public/upload/media/image/2022-10/Lights%20-%20Behind%20the%20scene_181.jpg?itok=vLEOan_x 2x" media="(min-width: 0px)" type="image/jpeg" width="640" height="427"/>
823                  <img width="640" height="427" src="/sites/default/files/styles/640/public/upload/media/image/2022-10/Lights%20-%20Behind%20the%20scene_181.jpg?itok=EOp_r4IK" alt="" loading="lazy" class="w-full" />
824
825  </picture>
826
827
828          </div>
829</a>    </div>
830    
831  </div>
832
833</article>
834
835
836</main>
837
838
839<div
840  x-data="$store.player"
841  x-init="setup"
842  x-show="isOpened"
843  x-transition.opacity.duration.500ms
844  x-cloak
845  class="player fixed z-50 inset-0 bg-black flex items-center">
846
847    <div x-show="playerCtaBtnVisible" x-transition.opacity.duration.500ms class="absolute inset-0 z-40 flex items-center justify-center z-30">
848    <button x-on:click="play()" data-plyr="play-cta" class="block w-16 h-16 bg-white flex items-center rounded-full justify-center">
849      <div class="w-8 h-8 text-black">
850        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" class="w-full fill-current">
851  <path d="M9 8.482v7.036L15.03 12 9 8.482zM7.752 5.44l10.508 6.13a.5.5 0 0 1 0 .863l-10.508 6.13A.5.5 0 0 1 7 18.128V5.871a.5.5 0 0 1 .752-.432z"/>
852</svg>
853      </div>
854    </button>
855  </div>
856
857    <div x-show="loader || playerCtaBtnVisible" x-transition.opacity.duration.500ms class="absolute bg-black flex items-center justify-center inset-0 z-20">
858    <div class="aspect-video w-full">
859      <div class="absolute inset-0 flex items-center justify-center z-10">
860        <div class="w-12 h-12 text-white animate-spin">
861          <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" class="w-full fill-current">
862  <path d="M12 3a9 9 0 0 1 9 9h-2a7 7 0 0 0-7-7V3z"/>
863</svg>
864        </div>
865      </div>
866      <img x-bind:src="poster" alt="" class="w-full h-full relative z-0 object-cover" />
867    </div>
868  </div>
869
870    <div x-show="infosVisible" class="player-infos absolute left-0 top-0 right-0 z-10 flex justify-between p-8 bg-gradient-to-b from-black/50 lg:p-16">
871    <div>
872      <h3
873        x-text="title"
874        class="font-serif text-xl text-white sm:text-2xl md:text-3xl lg:text-4xl 2xl:text-5xl"></h3>
875      <span
876        x-text="subtitle"
877        class="block text-sm text-white font-sans mt-2 lg:text-base"></span>
878    </div>
879    <div>
880      <button x-on:click="close" class="text-sm text-white lg:text-base">Close</button>
881    </div>
882  </div>
883
884    <div class="player-video-wrapper aspect-video w-full relative z-0">
885    <div class="player-video" data-plyr-provider="vimeo" x-bind:data-plyr-embed-id="url"></div>
886  </div>
887
888</div>
889
890
891<div
892  x-data="$store.cursor"
893  x-init="setup()"
894  x-cloak
895  class="hidden fixed pointer-events-none z-40 left-0 top-0 opacity-0 mix-blend-difference lg:block">
896  <div
897    x-bind:class="{ 'w-2 h-2': style == 'default', 'w-24 h-24': style == 'play' }"
898    class="bg-white flex items-center justify-center rounded-full transition-all duration-150 ease-out">
899    <template x-if="style == 'play'">
900      <div class="w-6 h-6 text-black">
901        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" class="w-full fill-current">
902  <path d="M9 8.482v7.036L15.03 12 9 8.482zM7.752 5.44l10.508 6.13a.5.5 0 0 1 0 .863l-10.508 6.13A.5.5 0 0 1 7 18.128V5.871a.5.5 0 0 1 .752-.432z"/>
903</svg>
904      </div>
905    </template>
906  </div>
907</div>
908
909
910<div x-data="$store.neon" x-init="reset()" x-cloak class="neon bg-gradient-to-b from-pink to-green fixed inset-0 z-20 blur-3xl pointer-events-none"></div>
911
912
913
914
915
916
917
918
919    
919<script type="module" src="https://lights.lu/themes/lights/dist/assets/app-BEmUXqIM.js" crossorigin></script>
919
920  </body>
921
922</html>

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.