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&oauth2_token_id=1660875299&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?&r=pad&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&oauth2_token_id=1660875299&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'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?&r=pad&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&oauth2_token_id=1660875299&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&oauth2_token_id=1660875299&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?&r=pad&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&oauth2_token_id=1660875299&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?&r=pad&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&oauth2_token_id=1660875299&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?&r=pad&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&oauth2_token_id=1660875299&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?&r=pad&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&oauth2_token_id=1660875299&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?&r=pad&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&oauth2_token_id=1660875299&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?&r=pad&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&oauth2_token_id=1660875299&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?&r=pad&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&oauth2_token_id=1660875299&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&oauth2_token_id=1660875299&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&oauth2_token_id=1660875299&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?&r=pad&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&oauth2_token_id=1660875299&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&oauth2_token_id=1660875299&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&oauth2_token_id=1660875299&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&oauth2_token_id=1660875299&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&oauth2_token_id=1660875299&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&oauth2_token_id=1660875299&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&oauth2_token_id=1660875299&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 & 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&oauth2_token_id=1660875299&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&oauth2_token_id=1660875299&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&oauth2_token_id=1660875299&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&oauth2_token_id=1660875299&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&oauth2_token_id=1660875299&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 & 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'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.