{"id":196,"date":"2025-07-08T14:21:42","date_gmt":"2025-07-08T14:21:42","guid":{"rendered":"https:\/\/grinely.com\/?page_id=196"},"modified":"2025-12-04T15:42:38","modified_gmt":"2025-12-04T15:42:38","slug":"work","status":"publish","type":"page","link":"https:\/\/grinely.com\/en\/work\/","title":{"rendered":"Work"},"content":{"rendered":"<div data-elementor-type=\"wp-page\" data-elementor-id=\"196\" class=\"elementor elementor-196\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-2e8bcb1 e-con-full e-flex e-con e-parent\" data-id=\"2e8bcb1\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-0f42012 elementor-widget elementor-widget-html\" data-id=\"0f42012\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<style>\r\n  \/* === Overrides des styles bouton du th\u00e8me === *\/\r\n  #work-container button,\r\n  #work-container [type=button],\r\n  #work-container [type=submit] {\r\n    background-color: transparent !important;\r\n    border: 1px solid transparent !important;\r\n    border-radius: 0 !important;\r\n    color: inherit !important;\r\n    padding: 0 !important;\r\n    margin: 0 !important;\r\n    font-size: inherit !important;\r\n    font-weight: inherit !important;\r\n    transition: none !important;\r\n  }\r\n\r\n  \/* 0) Full\u2010height layout *\/\r\n  html, body { height: 100%; margin: 0; }\r\n  #work-container {\r\n    display: flex;\r\n    flex-direction: column;\r\n    min-height: 100vh;\r\n    position: relative;\r\n    width: 100%;\r\n    font-family: \"Plus Jakarta Sans\", Sans-serif;\r\n    font-size: 0.8rem;\r\n    color: #fff;\r\n  }\r\n  .work-list { flex: 1; overflow-y: auto; }\r\n\r\n  \/* 1) Columns: Client | Project | Role | Statut | Year *\/\r\n  .work-header,\r\n  .work-list .work-item {\r\n    display: grid;\r\n    grid-template-columns: 2fr 2fr 5fr 2fr auto;\r\n    font-size: 0.8rem;\r\n    font-weight: 400;\r\n  }\r\n\r\n  \/* 3) Header *\/\r\n  .work-header {\r\n    font-weight: 400 !important;\r\n    text-transform: uppercase;\r\n    padding: .5rem 0;\r\n    border-top: 1px solid rgba(255,255,255,0.1);\r\n    border-bottom: 1px solid rgba(255,255,255,0.1);\r\n  }\r\n  .work-header span { padding: 0 .5rem; }\r\n  .h-client  { text-align: left; }\r\n  .h-project { text-align: left; }\r\n  .h-role    { text-align: left; }\r\n  .h-status  { text-align: left; }\r\n  .h-year    { text-align: right; }\r\n\r\n  \/* 4) List items *\/\r\n  .work-list .work-item {\r\n    align-items: center;\r\n    padding: .2rem 0;\r\n    cursor: pointer;\r\n  }\r\n  .work-item span { padding: 0 .5rem; }\r\n\r\n  \/* 5) Disabled rows *\/\r\n  .work-item.disabled { opacity: 0.5; pointer-events: none; }\r\n  .work-item.disabled span { color: #777 !important; }\r\n\r\n  \/* 6) Overlay preview *\/\r\n  #preview-overlay {\r\n    position: fixed;\r\n    display: none;\r\n    z-index: 1000;\r\n    pointer-events: none;\r\n    box-shadow: 0 4px 12px rgba(0,0,0,0.3);\r\n    width: 300px;\r\n  }\r\n\r\n  \/* 7) Detail view *\/\r\n  #project-detail { display: none; padding-bottom: 1rem; }\r\n  #detail-row {\r\n    display: grid;\r\n    grid-template-columns: 2fr 2fr 5fr 2fr auto;\r\n    padding: .5rem 0;\r\n    border-bottom: 1px solid rgba(255,255,255,0.1);\r\n  }\r\n  #detail-row span { padding: 0 .5rem; color: #fff; }\r\n  #detail-content {\r\n    display: grid;\r\n    grid-template-columns: 1fr 2fr;\r\n    gap: 1rem;\r\n    margin-top: 1rem;\r\n    height: calc(100vh - 200px);\r\n    white-space: pre-line;\r\n  }\r\n  .detail-description { position: sticky; top: 1rem; color: #fff; white-space: pre-line; }\r\n\r\n  \/* --- (NOUVEAU) Styles \u00e9l\u00e9gants et responsives pour les assets --- *\/\r\n  .detail-assets { \r\n    overflow-y: auto; \r\n    scrollbar-width: none; \r\n    -ms-overflow-style: none; \r\n  }\r\n  .detail-assets::-webkit-scrollbar { width: 0; height: 0; }\r\n\r\n  .detail-assets .asset {             \/* un conteneur par m\u00e9dia pour g\u00e9rer l\u2019espacement *\/\r\n    margin-bottom: 1rem;\r\n  }\r\n\r\n  .detail-assets .asset-img {         \/* images *\/\r\n    display: block;\r\n    width: 100%;\r\n    height: auto;\r\n  }\r\n\r\n  .detail-assets .asset-video,        \/* <video> fichier *\/\r\n  .detail-assets .asset-frame {       \/* <iframe> (Vimeo, etc.) *\/\r\n    display: block;\r\n    width: 100%;\r\n    aspect-ratio: 16 \/ 9;             \/* ratio propre, moderne *\/\r\n    background: #000;                  \/* fond pour \u00e9viter le flash *\/\r\n    border: 0;\r\n  }\r\n\r\n  \/* 8) Close button *\/\r\n  #closeDetail {\r\n    margin-top: .5rem;\r\n    background: none;\r\n    border: none;\r\n    color: #e53e3e !important;\r\n    cursor: pointer;\r\n    display: inline-flex;\r\n    align-items: center;\r\n  }\r\n  #closeDetail::before {\r\n    content: \"Close\";\r\n    font-size: 1rem;\r\n    margin-right: .25rem;\r\n    color: #e53e3e !important;\r\n  }\r\n  #closeDetail::after {\r\n    content: \"\u00d7\";\r\n    font-size: 1.5rem;\r\n    line-height: 1;\r\n    color: #e53e3e !important;\r\n  }\r\n  \r\n  \/* ===== RESPONSIVE TABLE (mobile) ===== *\/\r\n\/* < 768px : on masque ROLE (col 3) et STATUT (col 4), et on resserre la grille *\/\r\n@media (max-width: 768px){\r\n  \/* Header : cacher les libell\u00e9s ROLE + STATUT *\/\r\n  .work-header .h-role,\r\n  .work-header .h-status { display:none !important; }\r\n\r\n  \/* Lignes : cacher les cellules 3 (ROLE) et 4 (STATUT) *\/\r\n  .work-list .work-item span:nth-child(3),\r\n  .work-list .work-item span:nth-child(4) { display:none !important; }\r\n\r\n  \/* D\u00e9tail (la ligne r\u00e9cap en haut du panneau) : idem *\/\r\n  #detail-row span:nth-child(3),\r\n  #detail-row span:nth-child(4) { display:none !important; }\r\n\r\n  \/* Nouvelle grille = Client | Project | Year *\/\r\n  .work-header,\r\n  .work-list .work-item,\r\n  #detail-row {\r\n    grid-template-columns: 2fr 5fr auto !important;\r\n  }\r\n\r\n  \/* Aligner l'ann\u00e9e \u00e0 droite comme avant *\/\r\n  .h-year,\r\n  .work-list .work-item span:last-child,\r\n  #detail-row span:last-child { text-align: right; }\r\n}\r\n\r\n\/* ===== D\u00c9TAIL : description au-dessus, assets dessous (mobile) ===== *\/\r\n@media (max-width: 768px){\r\n  #detail-content{\r\n    display: block;           \/* on empile *\/\r\n    height: auto;             \/* plus de hauteur forc\u00e9e *\/\r\n    margin-top: 1rem;\r\n  }\r\n  .detail-description{\r\n    position: relative;       \/* plus de sticky sur mobile *\/\r\n    top: 0;\r\n    margin-bottom: 1rem;      \/* espace avant les assets *\/\r\n  }\r\n  .detail-assets{\r\n    max-height: none;         \/* laisse le contenu prendre sa place *\/\r\n    overflow: visible;        \/* pas de scroll interne sur mobile *\/\r\n  }\r\n}\r\n\r\n\/* (optionnel) un peu de respiration g\u00e9n\u00e9rale sur petit \u00e9cran *\/\r\n@media (max-width: 480px){\r\n  #work-container{ font-size: .9rem; }\r\n  .work-header, .work-list .work-item{ padding: .45rem 0; }\r\n}\r\n\r\n<\/style>\r\n\r\n<div id=\"work-container\">\r\n  <!-- Header -->\r\n  <div class=\"work-header\">\r\n    <span class=\"h-client\">Client<\/span>\r\n    <span class=\"h-project\">Project<\/span>\r\n    <span class=\"h-role\">Role<\/span>\r\n    <span class=\"h-status\">Statut<\/span>\r\n    <span class=\"h-year\">Year<\/span>\r\n  <\/div>\r\n\r\n  <!-- List -->\r\n   <div class=\"work-list\">\r\n       <div class=\"work-item\"\r\n         data-preview=\"https:\/\/grinely.com\/wp-content\/uploads\/2025\/12\/amandine-itw-thumb.jpg\"\r\n         data-description=\"Pour accompagner la strat\u00e9gie de communication du Groupe Cube, nous avons produit une s\u00e9rie d\u2019interviews internes, valorisant les parcours et les expertises de leurs \u00e9quipes.Dans cet \u00e9pisode, Amandine, assistante de direction, revient sur son parcours au sein du groupe depuis 2016, et sur la cr\u00e9ation de la branche Cube Entretien & Services, sp\u00e9cialis\u00e9e dans les interventions rapides et l\u2019entretien technique.L\u2019interview a \u00e9t\u00e9 con\u00e7ue pour renforcer la communication RH du groupe, en mettant en avant la proximit\u00e9, la stabilit\u00e9 des \u00e9quipes, et leur r\u00f4le actif dans la structuration des services.<b>Directed by Studio GrinelyFilmed by Nathanael Le Gac<\/b>\"\r\n         data-assets=\"https:\/\/player.vimeo.com\/video\/1143456227\">\r\n      <span>Groupe Cube<\/span>\r\n      <span>Employee ITW<\/span>\r\n      <span>Creative + Production<\/span>\r\n      <span>Complete<\/span>\r\n      <span>2025<\/span>\r\n    <\/div>\r\n    <div class=\"work-item\"\r\n         data-preview=\"https:\/\/grinely.com\/wp-content\/uploads\/2025\/12\/Portrait5\uf022VLADIMIRCAUCHEMAR_ERS2025\u00a9Nathanael_Le_Gac-scaled.jpg\"\r\n         data-description=\"Invit\u00e9s par les Eurock\u00e9ennes de Belfort, nous avons rejoint l\u2019\u00e9quipe pour capter l\u2019\u00e9dition 2025 de R\u00e9sidence Secondaire.Un rendez-vous unique, o\u00f9 la sc\u00e9nographie, la lumi\u00e8re et la musique se r\u00e9pondent dans une atmosph\u00e8re brute et immersive.Au programme : TRYM, Vladimir Cauchemar, Marion di Napoli, NTO, CESTLATEUF! et un set visuel sign\u00e9 VISIONZ.Nous avons capt\u00e9 l\u2019\u00e9nergie de la soir\u00e9e \u00e0 travers une s\u00e9rie de photos et des plans pens\u00e9s pour prolonger l\u2019exp\u00e9rience au-del\u00e0 de la sc\u00e8ne.<b>Stills by Nathanael Le GACMotion by Ilias Qerchi<\/b>\"\r\n         data-assets=\"https:\/\/player.vimeo.com\/video\/1143458568,https:\/\/grinely.com\/wp-content\/uploads\/2025\/12\/Portrait5\uf022VLADIMIRCAUCHEMAR_ERS2025\u00a9Nathanael_Le_Gac-scaled.jpg,https:\/\/grinely.com\/wp-content\/uploads\/2025\/12\/DOS3\uf022VLADIMIRCAUCHEMAR_ERS2025\u00a9Nathanael_Le_Gac-scaled.jpg,https:\/\/grinely.com\/wp-content\/uploads\/2025\/12\/Portrait_public\uf022MarionDiNapoli_ERS2025\u00a9Nathanael_Le_Gac-scaled.jpg,\">\r\n      <span>Eurock\u00e9ennes<\/span>\r\n      <span>ERS 2025<\/span>\r\n      <span>Creative + Production<\/span>\r\n      <span>Complete<\/span>\r\n      <span>2025<\/span>\r\n    <\/div>\r\n    <div class=\"work-item\"\r\n         data-preview=\"https:\/\/grinely.com\/wp-content\/uploads\/2025\/12\/emaus-thumb.jpg\"\r\n         data-description=\"Le Groupe Cube a souhait\u00e9 mettre en lumi\u00e8re son partenaire historique, Emma\u00fcs Montb\u00e9liard, \u00e0 travers une vid\u00e9o port\u00e9e par l\u2019humain.Dans ce film, Thierry, pr\u00e9sident de l\u2019association, et Paul, compagnon, partagent leur parcours, leur engagement, et la r\u00e9alit\u00e9 du quotidien Emma\u00fcs.Une passion, une cause, et une histoire de vie bouleversante.Une vid\u00e9o qui a du sens, et qui donne du sens, pens\u00e9e comme un geste de reconnaissance et d\u2019appui, fid\u00e8le aux valeurs partag\u00e9es entre Cube et Emma\u00fcs : solidarit\u00e9, transmission, dignit\u00e9.<b>Directed by Studio GrinelyFilmed by Nathanael Le Gac<\/b>\"\r\n         data-assets=\"https:\/\/player.vimeo.com\/video\/1121786111\">\r\n      <span>Emma\u00fcs x Groupe Cube<\/span>\r\n      <span>Life<\/span>\r\n      <span>Creative + Production<\/span>\r\n      <span>Complete<\/span>\r\n      <span>2025<\/span>\r\n    <\/div>\r\n      <div class=\"work-item\"\r\n         data-preview=\"https:\/\/grinely.com\/wp-content\/uploads\/2025\/08\/DSC05373-scaled.jpg\"\r\n         data-description=\"Un clip o\u00f9 l\u2019\u00e9nergie brute se m\u00eale \u00e0 une atmosph\u00e8re sombre et tranchante.Jeux d\u2019ombres, \u00e9clairages secs, pr\u00e9sence marqu\u00e9e : chaque plan traduit l\u2019attitude et l\u2019univers du morceau.Rythm\u00e9e et intense, fid\u00e8le \u00e0 l\u2019identit\u00e9 de ME3ZA.<b>Directed by Ilias Qerchi<\/b>\"\r\n         data-assets=\"https:\/\/player.vimeo.com\/video\/1112015009\">\r\n      <span>ME3ZA<\/span>\r\n      <span>WEB<\/span>\r\n      <span>Creative + Production<\/span>\r\n      <span>Complete<\/span>\r\n      <span>2025<\/span>\r\n    <\/div>\r\n    <div class=\"work-item\"\r\n     data-preview=\"https:\/\/grinely.com\/wp-content\/uploads\/2025\/08\/4.png\"\r\n     data-description=\"Studio Grinely a accompagn\u00e9 Kongs FC pour une soir\u00e9e o\u00f9 l\u2019intensit\u00e9 brute rencontre l\u2019histoire humaine.Notre mission : capturer l\u2019instant. Pas seulement les combats, mais tout ce qui les entoure.La tension. Les regards. Les silences. L\u2019avant. L\u2019apr\u00e8s.\u00c0 travers la photo et la vid\u00e9o, on a racont\u00e9 les combattants au-del\u00e0 de la cage \u2014 leurs \u00e9motions, leurs rituels, leur fiert\u00e9.Sans artifices. Sans mise en sc\u00e8ne. Juste du vrai, cadr\u00e9 avec intention.On a aussi construit une strat\u00e9gie de diffusion fid\u00e8le \u00e0 l\u2019\u00e9v\u00e9nement : brute, percutante, au plus proche du v\u00e9cu.Une histoire racont\u00e9e avec les poings, mais grav\u00e9e par l\u2019image.<b>Directed by Nathanael LE GAC<\/b>\"\r\n     data-assets=\"https:\/\/player.vimeo.com\/video\/1109638839,https:\/\/player.vimeo.com\/video\/1111995847,https:\/\/grinely.com\/wp-content\/uploads\/2025\/08\/6.png,https:\/\/grinely.com\/wp-content\/uploads\/2025\/08\/1.png,https:\/\/grinely.com\/wp-content\/uploads\/2025\/08\/2.png,https:\/\/grinely.com\/wp-content\/uploads\/2025\/08\/4.png,https:\/\/grinely.com\/wp-content\/uploads\/2025\/08\/5.png\">\r\n  <span>Kongs FC<\/span>\r\n  <span>Contenders Summer 2025<\/span>\r\n  <span>Creative + Production + Strategy<\/span>\r\n  <span>Complete<\/span>\r\n  <span>2025<\/span>\r\n<\/div>\r\n\r\n      <div class=\"work-item\"\r\n         data-preview=\"https:\/\/grinely.com\/wp-content\/uploads\/2025\/08\/DSC03847-scaled.jpg\"\r\n         data-description=\"Dans le cadre d\u2019une s\u00e9rie de contenus destin\u00e9s \u00e0 valoriser l\u2019humain au c\u0153ur de l\u2019entreprise, nous avons r\u00e9alis\u00e9 l\u2019interview de Fabian, chef d\u2019\u00e9quipe chez MS Couverture.Notre mission a \u00e9t\u00e9 d\u2019assurer la direction artistique et la direction de la photographie : r\u00e9flexion sur le cadre, d\u00e9finition de l\u2019ambiance visuelle, gestion de la lumi\u00e8re et du son, captation multi-cam\u00e9ras, puis montage et \u00e9talonnage.Au-del\u00e0 de la technique, l\u2019objectif \u00e9tait clair : donner la parole \u00e0 ceux qui font l\u2019entreprise.\u00c0 travers ses mots, Fabian incarne la rigueur, la passion et le savoir-faire qui animent les \u00e9quipes de MS Couverture au quotidien.Un format simple et authentique, pens\u00e9 pour renforcer l\u2019image de marque et instaurer une communication plus humaine.<b>Directed by Studio GrinelyFilmed by Nathanael Le Gac<\/b>\"\r\n         data-assets=\"https:\/\/player.vimeo.com\/video\/1114224033\">\r\n      <span>MS Couverture<\/span>\r\n      <span>Employee ITW<\/span>\r\n      <span>Creative + Production + Strategy<\/span>\r\n      <span>Complete<\/span>\r\n      <span>2025<\/span>\r\n    <\/div>\r\n      <div class=\"work-item\"\r\n         data-preview=\"https:\/\/grinely.com\/wp-content\/uploads\/2025\/08\/DSC03910-scaled.jpg\"\r\n         data-description=\"Studio Grinely a accompagn\u00e9 MS Couverture pour mettre en lumi\u00e8re l\u2019un de ses chantiers phares : la r\u00e9fection compl\u00e8te d\u2019une toiture Rue Defferre.Cette vid\u00e9o ne se contente pas de montrer des images de travaux : elle nous plonge au c\u0153ur du chantier, guid\u00e9s par le chef d\u2019\u00e9quipe lui-m\u00eame.\u00c0 travers ses explications en direct, on d\u00e9couvre non seulement les \u00e9tapes techniques, mais aussi la vision et la rigueur qui animent ses \u00e9quipes.Nous avons voulu que la vid\u00e9o refl\u00e8te \u00e0 la fois la ma\u00eetrise technique et l\u2019humain :Des plans d\u00e9taill\u00e9s pour valoriser la qualit\u00e9 des finitions.Des images d\u2019ensemble pour illustrer l\u2019ampleur et l\u2019organisation du chantier.Une narration incarn\u00e9e par le chef d\u2019\u00e9quipe, pour un lien direct et authentique avec le spectateur.Au-del\u00e0 d\u2019un simple reportage, c\u2019est un outil de communication puissant qui renforce l\u2019image de marque de MS Couverture, appuie la qualit\u00e9 de ses r\u00e9alisations et met en avant la confiance que l\u2019on peut accorder \u00e0 ses \u00e9quipes.<b>Directed by Studio GrinelyFilmed by Nathanael Le Gac<\/b>\"\r\n         data-assets=\"https:\/\/player.vimeo.com\/video\/1109642258\">\r\n      <span>MS Couverture<\/span>\r\n      <span>Rue Defferre<\/span>\r\n      <span>Creative + Production + Strategy<\/span>\r\n      <span>Complete<\/span>\r\n      <span>2025<\/span>\r\n    <\/div>\r\n    <div class=\"work-item disabled\"\r\n         data-preview=\"https:\/\/via.placeholder.com\/300x169\"\r\n         data-description=\"D\u00e9tails du projet Alpha\"\r\n         data-assets=\"https:\/\/via.placeholder.com\/300x169\">\r\n      <span>Tayem<\/span>\r\n      <span>Live Session<\/span>\r\n      <span>Creative + Production<\/span>\r\n      <span>In Progress<\/span>\r\n      <span>2025<\/span>\r\n    <\/div>\r\n      <div class=\"work-item disabled\"\r\n         data-preview=\"https:\/\/via.placeholder.com\/300x169\"\r\n         data-description=\"D\u00e9tails du projet Alpha\"\r\n         data-assets=\"https:\/\/via.placeholder.com\/300x169\">\r\n      <span>Tayem<\/span>\r\n      <span class='secret'>4 Sac vers l'Ohio<\/span>\r\n      <span>Creative + Production<\/span>\r\n      <span>In Progress<\/span>\r\n      <span>2025<\/span>\r\n    <\/div>\r\n      <div class=\"work-item disabled\"\r\n         data-preview=\"https:\/\/via.placeholder.com\/300x169\"\r\n         data-description=\"D\u00e9tails du projet Alpha\"\r\n         data-assets=\"https:\/\/via.placeholder.com\/300x169\">\r\n      <span>Djiro<\/span>\r\n      <span class=\"secret\">Carla Bruni<\/span>\r\n      <span>Creative + Production<\/span>\r\n      <span>Complete<\/span>\r\n      <span>2025<\/span>\r\n    <\/div>\r\n      <div class=\"work-item\"\r\n         data-preview=\"https:\/\/grinely.com\/wp-content\/uploads\/2025\/08\/Capture-decran-2025-08-14-131959.png\"\r\n         data-description=\"Ici, pas de surench\u00e8re visuelle.L\u2019ambiance est volontairement apais\u00e9e, port\u00e9e par une m\u00e9lodie de piano et la lumi\u00e8re douce des fins de journ\u00e9e.Nous avons construit une narration qui se d\u00e9ploie dans les paysages marocains \u2014 vastes \u00e9tendues, couchers de soleil dor\u00e9s, silhouettes en mouvement.Chaque plan laisse respirer l\u2019image, pour laisser place \u00e0 l\u2019\u00e9motion et \u00e0 la sinc\u00e9rit\u00e9 du morceau.Ce clip est pens\u00e9 comme une bulle suspendue : un espace hors du temps o\u00f9 l\u2019image et le son se r\u00e9pondent, pour ancrer dans la m\u00e9moire la po\u00e9sie et la sensibilit\u00e9 de Djiro.<b>Directed by Ilias Qerchi<\/b>\"\r\n         data-assets=\"https:\/\/player.vimeo.com\/video\/1096629764\">\r\n      <span>Djiro<\/span>\r\n      <span>Eau de Javel<\/span>\r\n      <span>Creative + Production<\/span>\r\n      <span>Complete<\/span>\r\n      <span>2025<\/span>\r\n    <\/div>\r\n    <div class=\"work-item\"\r\n         data-preview=\"https:\/\/grinely.com\/wp-content\/uploads\/2025\/08\/DSC09677.jpg\"\r\n         data-description=\"Nous avons pris en charge l\u2019aspect cr\u00e9atif, la production et la strat\u00e9gie, en imaginant une ambiance qui souligne le caract\u00e8re design de la pi\u00e8ce.Apr\u00e8s avoir d\u00e9fini la direction artistique, nous avons trouv\u00e9 le lieu id\u00e9al : un immense entrep\u00f4t vide, \u00e0 l\u2019architecture brute, offrant un contraste saisissant avec les lignes soign\u00e9es du mobilier.Sur place, nous avons cr\u00e9\u00e9 un environnement minimaliste o\u00f9 la lumi\u00e8re et l\u2019espace amplifient la pr\u00e9sence du produit.Le r\u00e9sultat : un visuel o\u00f9 le pouf Thalia se d\u00e9tache avec force, entre sophistication et simplicit\u00e9.<b>Directed by Studio GrinelyFilmed by Nathanael Le Gac<\/b>\"\r\n         data-assets=\"https:\/\/player.vimeo.com\/video\/1109958796\">\r\n      <span>Meubles Bernardot<\/span>\r\n      <span>Packshot Thalia<\/span>\r\n      <span>Creative + Production + Strategy<\/span>\r\n      <span>Complete<\/span>\r\n      <span>2025<\/span>\r\n    <\/div>\r\n      <div class=\"work-item\"\r\n         data-preview=\"https:\/\/grinely.com\/wp-content\/uploads\/2025\/08\/DSC09695-2-scaled.jpg\"\r\n         data-description=\"Le Glam s\u2019impose par son tissu 3D ultra-moderne et son orange \u00e9clatant.Install\u00e9 dans un immense entrep\u00f4t vide, il prend toute son ampleur. L\u2019espace brut devient un \u00e9crin, amplifiant ses lignes et sa couleur vibrante.Un contraste voulu : la froideur industrielle contre la chaleur du tissu.Pour accentuer cette dualit\u00e9, un sound design inattendu \u2014 le chant de la nature dans un lieu o\u00f9 elle n\u2019existe pas \u2014 vient troubler la perception et marquer la m\u00e9moire.<b>Directed by Studio GrinelyFilmed by Nathanael Le Gac<\/b>\"\r\n         data-assets=\"https:\/\/player.vimeo.com\/video\/1097576165\">\r\n      <span>XXL Maison<\/span>\r\n      <span>Packshot Glam<\/span>\r\n      <span>Creative + Production + Strategy<\/span>\r\n      <span>Complete<\/span>\r\n      <span>2025<\/span>\r\n    <\/div>\r\n    <div class=\"work-item\"\r\n         data-preview=\"https:\/\/grinely.com\/wp-content\/uploads\/2025\/08\/DSC09546.jpg\"\r\n         data-description=\"Le RalphM s\u2019installe au milieu du b\u00e9ton brut de l\u2019entrep\u00f4t.Un tapis, quelques \u00e9l\u00e9ments choisis\u2026 et l\u2019ambiance se transforme, presque comme \u00e0 la maison.Le d\u00e9cor industriel, loin de toute id\u00e9e de confort, devient l\u2019\u00e9crin inattendu du canap\u00e9.Une mani\u00e8re de montrer que le RalphM trouve sa place partout \u2014 m\u00eame l\u00e0 o\u00f9 on ne l\u2019attend pas.<b>Directed by Studio GrinelyFilmed by Nathanael Le Gac<\/b>\"\r\n         data-assets=\"https:\/\/player.vimeo.com\/video\/1108049155\">\r\n      <span>Meubles Bernardot<\/span>\r\n      <span>Packshot RalphM<\/span>\r\n      <span>Creative + Production + Strategy<\/span>\r\n      <span>Complete<\/span>\r\n      <span>2025<\/span>\r\n    <\/div>\r\n    <div class=\"work-item\"\r\n         data-preview=\"https:\/\/grinely.com\/wp-content\/uploads\/2025\/08\/giles_itw_prev.png\"\r\n         data-description=\"Un \u00e9change avec Gilles Bernardot, directeur de Meubles Bernardot et de ses enseignes.Un moment pens\u00e9 pour marquer l\u2019ouverture d\u2019une nouvelle \u00e8re : raconter l\u2019histoire de l\u2019entreprise, sa vision et l\u2019\u00e9volution de son image.Tourn\u00e9e directement en magasin, l\u2019interview s\u2019inscrit dans une ambiance soign\u00e9e, align\u00e9e sur l\u2019esth\u00e9tique que Meubles Bernardot souhaite transmettre.Un format humain, qui donne un visage et une voix \u00e0 la marque.<b>Directed by Studio GrinelyFilmed by Nathanael Le Gac<\/b>\"\r\n         data-assets=\"https:\/\/player.vimeo.com\/video\/1108051599\">\r\n      <span>Meubles Bernardot<\/span>\r\n      <span>Director ITW<\/span>\r\n      <span>Creative + Production + Strategy<\/span>\r\n      <span>Complete<\/span>\r\n      <span>2025<\/span>\r\n    <\/div>\r\n    <div class=\"work-item\"\r\n         data-preview=\"https:\/\/grinely.com\/wp-content\/uploads\/2025\/08\/Capture-decran-2025-08-14-141444.png\"\r\n         data-description=\"Un clip sombre et nerveux, pens\u00e9 pour coller \u00e0 l\u2019\u00e9nergie brute d\u2019un morceau trap.Des \u00e9clats lumineux qui tranchent dans l\u2019obscurit\u00e9, une Dodge Charger qui impose sa pr\u00e9sence, et une mise en sc\u00e8ne simple mais rythm\u00e9e, port\u00e9e par le beat.Une direction artistique brute, sans fioritures, o\u00f9 chaque plan sert le son et son atmosph\u00e8re \u00e9lectrique.<b>Directed by Ilias Qerchi<\/b>\"\r\n         data-assets=\"https:\/\/player.vimeo.com\/video\/1096630190\">\r\n      <span>TWENTG<\/span>\r\n      <span>Dead<\/span>\r\n      <span>Creative + Production<\/span>\r\n      <span>Complete<\/span>\r\n      <span>2025<\/span>\r\n    <\/div>\r\n    <div class=\"work-item\"\r\n         data-preview=\"https:\/\/grinely.com\/wp-content\/uploads\/2025\/08\/DSC07282-2-scaled.jpg\"\r\n         data-description=\"Premi\u00e8re vid\u00e9o d\u2019une s\u00e9rie pens\u00e9e pour montrer en toute transparence le savoir-faire de MS Couverture.Un chantier technique et local, pr\u00e9sent\u00e9 avec un style naturel et authentique, sans artifices.L\u2019objectif : marquer une nouvelle \u00e9tape dans la communication de l\u2019entreprise, en ouvrant les coulisses de son travail et en valorisant l\u2019expertise des \u00e9quipes sur le terrain.<b>Directed by Studio GrinelyFilmed by Nathanael Le Gac<\/b>\"\r\n         data-assets=\"https:\/\/player.vimeo.com\/video\/1109959721\">\r\n      <span>MS Couverture<\/span>\r\n      <span>Maison Interg\u00e9n\u00e9ration<\/span>\r\n      <span>Creative + Production + Strategy<\/span>\r\n      <span>Complete<\/span>\r\n      <span>2025<\/span>\r\n    <\/div>\r\n    <div class=\"work-item\"\r\n         data-preview=\"https:\/\/grinely.com\/wp-content\/uploads\/2025\/08\/seb_iitw_prev.jpg\"\r\n         data-description=\"Une rencontre avec S\u00e9bastien, chef d\u2019\u00e9quipe chez MS Couverture.Cette interview s\u2019inscrit dans la volont\u00e9 de l\u2019entreprise de mettre en avant ses talents et d\u2019humaniser sa communication.\u00c0 travers ses mots, on d\u00e9couvre son parcours, son r\u00f4le et sa vision du m\u00e9tier, refl\u00e9tant l\u2019engagement et la passion qui animent les \u00e9quipes au quotidien.<b>Directed by Studio GrinelyFilmed by Nathanael Le Gac<\/b>\"\r\n         data-assets=\"https:\/\/player.vimeo.com\/video\/1109960368\">\r\n      <span>MS Couverture<\/span>\r\n      <span>Employee ITW<\/span>\r\n      <span>Creative + Production + Strategy<\/span>\r\n      <span>Complete<\/span>\r\n      <span>2025<\/span>\r\n    <\/div>\r\n    <div class=\"work-item\"\r\n         data-preview=\"https:\/\/grinely.com\/wp-content\/uploads\/2025\/08\/242KAY-ODYSSEUS.png\"\r\n         data-description=\"Un street clip aux multiples ambiances, con\u00e7u pour \u00e9pouser l\u2019\u00e9nergie et la structure du morceau.Tourn\u00e9 principalement de nuit, il alterne entre rues \u00e9clair\u00e9es par les n\u00e9ons, plans serr\u00e9s charg\u00e9s d\u2019\u00e9motion et s\u00e9quences plus a\u00e9r\u00e9es, laissant respirer la musique.L\u2019esth\u00e9tique oscille entre r\u00e9alisme brut et touches visuelles plus travaill\u00e9es, offrant un voyage visuel qui colle \u00e0 l\u2019atmosph\u00e8re singuli\u00e8re d\u2019Odysse\u00fcs.<b>Directed by Ilias Qerchi<\/b>\"\r\n         data-assets=\"https:\/\/player.vimeo.com\/video\/1096624184\">\r\n      <span>242Kay<\/span>\r\n      <span>Odysse\u00fcs<\/span>\r\n      <span>Creative + Production<\/span>\r\n      <span>Complete<\/span>\r\n      <span>2024<\/span>\r\n    <\/div>\r\n    <div class=\"work-item\"\r\n         data-preview=\"https:\/\/grinely.com\/wp-content\/uploads\/2025\/08\/gif_cube.gif\"\r\n         data-description=\"Un accompagnement sur une ann\u00e9e compl\u00e8te pour repenser l\u2019image et la strat\u00e9gie de marque du Groupe Cube.Objectif : moderniser la perception du secteur du b\u00e2timent, renforcer la visibilit\u00e9 et cr\u00e9er des formats engageants \u2013 en ligne comme hors ligne \u2013 pour faire rayonner leurs savoir-faire et leurs valeurs.Nous avons imagin\u00e9 et produit une s\u00e9rie de contenus vari\u00e9s, m\u00ealant authenticit\u00e9 et esth\u00e9tique, afin de redorer l\u2019image des m\u00e9tiers du b\u00e2timent, favoriser l\u2019interaction, et instaurer une communication transparente avec le public.<b>Directed by Studio Grinely<\/b>\"\r\n         data-assets=\"https:\/\/player.vimeo.com\/video\/1008089597,https:\/\/player.vimeo.com\/video\/1009930094,https:\/\/player.vimeo.com\/video\/1040082216,https:\/\/player.vimeo.com\/video\/1053009824,https:\/\/player.vimeo.com\/video\/1053001495\">\r\n      <span>Groupe Cube<\/span>\r\n      <span>New Vision<\/span>\r\n      <span>360\u00b0<\/span>\r\n      <span>Complete<\/span>\r\n      <span>2024<\/span>\r\n    <\/div>\r\n    <!-- \u2026 autres items \u2026 -->\r\n  <\/div>\r\n\r\n  <!-- Detail panel -->\r\n  <div id=\"project-detail\">\r\n    <div id=\"detail-row\"><\/div>\r\n    <div id=\"detail-content\">\r\n      <div class=\"detail-description\">\r\n        <p id=\"detail-text\"><\/p>\r\n        <button id=\"closeDetail\" type=\"button\"><\/button>\r\n      <\/div>\r\n      <div class=\"detail-assets\"><\/div>\r\n    <\/div>\r\n  <\/div>\r\n<\/div>\r\n\r\n<div id=\"preview-overlay\"><\/div>\r\n\r\n<script>\r\n\/* === Secret\/noise pour certains champs === *\/\r\nconst NOISE_CHARS =\r\n  'ABCDEFGHIJKLMNOPQRSTUVWXYZ' +\r\n  'abcdefghijklmnopqrstuvwxyz' +\r\n  '0123456789' +\r\n  '!@#$%^&*()[]{}<>?\/|\\\\';\r\n\r\nfunction randomNoise(n) {\r\n  let s = '';\r\n  for (let i = 0; i < n; i++) {\r\n    s += NOISE_CHARS[Math.floor(Math.random() * NOISE_CHARS.length)];\r\n  }\r\n  return s;\r\n}\r\nfunction makeSecret(el) {\r\n  if (!el.dataset.orig) el.dataset.orig = el.textContent;\r\n  const len = el.dataset.orig.length;\r\n  el.textContent = randomNoise(len);\r\n}\r\n\r\n\/* === Outils assets === *\/\r\n\/\/ Transforme une URL Vimeo \"normale\" en URL d'embed propre\r\nfunction normalizeVimeo(url) {\r\n  const m = url.match(\/vimeo\\.com\\\/(?:video\\\/)?(\\d+)\/);\r\n  if (m && m[1]) {\r\n    return `https:\/\/player.vimeo.com\/video\/${m[1]}?byline=0&title=0&portrait=0`;\r\n  }\r\n  return url;\r\n}\r\n\r\n\/\/ Cr\u00e9e le bon HTML selon le type d'asset (image \/ fichier vid\u00e9o \/ vimeo \/ fallback iframe)\r\nfunction assetHTML(url) {\r\n  const clean = (url || '').trim();\r\n  if (!clean) return '';\r\n  const lower = clean.toLowerCase();\r\n  const isImg   = \/\\.(png|jpe?g|gif|webp|avif)$\/i.test(lower);\r\n  const isVideo = \/\\.(mp4|webm|ogg)$\/i.test(lower);\r\n  const isVimeo = \/vimeo\\.com\/.test(lower);\r\n\r\n  if (isImg) {\r\n    return `<div class=\"asset\"><img decoding=\"async\" class=\"asset-img\" src=\"${clean}\" alt=\"\"><\/div>`;\r\n  }\r\n  if (isVideo) {\r\n    return `\r\n      <div class=\"asset\">\r\n        <video class=\"asset-video\" controls playsinline preload=\"metadata\">\r\n          <source src=\"${clean}\">\r\n        <\/video>\r\n      <\/div>`;\r\n  }\r\n  if (isVimeo) {\r\n    const embed = normalizeVimeo(clean);\r\n    return `\r\n      <div class=\"asset\">\r\n        <iframe\r\n          class=\"asset-frame\"\r\n          src=\"${embed}\"\r\n          allow=\"autoplay; fullscreen; picture-in-picture\"\r\n          allowfullscreen\r\n          title=\"Video\">\r\n        <\/iframe>\r\n      <\/div>`;\r\n  }\r\n  \/\/ fallback: on traite comme iframe (autres providers)\r\n  return `\r\n    <div class=\"asset\">\r\n      <iframe\r\n        class=\"asset-frame\"\r\n        src=\"${clean}\"\r\n        allow=\"autoplay; fullscreen; picture-in-picture\"\r\n        allowfullscreen>\r\n      <\/iframe>\r\n    <\/div>`;\r\n}\r\n\r\n\/* === Sanitize data-description (autorise b\/strong\/i\/em\/br) + retours \u00e0 la ligne === *\/\r\nfunction sanitizeDesc(s) {\r\n  if (s == null) return '';\r\n\r\n  \/\/ 0) Normaliser les sauts de ligne \"cach\u00e9s\" par certains \u00e9diteurs\/trads\r\n  \/\/    (TranslatePress, encodage HTML, etc.)\r\n  let t = String(s)\r\n    \/\/ entit\u00e9s HTML les plus courantes pour le newline\r\n    .replace(\/&#x0a;|&#xa;|&#10;|&#13;|&NewLine;\/gi, '\\n')\r\n    \/\/ cas o\u00f9 le texte contient la s\u00e9quence \\n en litt\u00e9ral\r\n    .replace(\/\\\\n\/g, '\\n')\r\n    \/\/ s\u00e9parateurs Unicode (rare mais safe)\r\n    .replace(\/\\u2028|\\u2029\/g, '\\n');\r\n\r\n  \/\/ 1) On \u00e9chappe tout\r\n  const tmp = document.createElement('div');\r\n  tmp.textContent = t;\r\n  let html = tmp.innerHTML;\r\n\r\n  \/\/ 2) On r\u00e9-autorise seulement ces balises\r\n  \/\/    (ajoute \"p\", \"u\", \"ul\", \"li\" si tu veux en autoriser d\u2019autres)\r\n  html = html.replace(\/&lt;(\\\/?)(b|strong|i|em|br|p)\\s*&gt;\/gi, '<$1$2>');\r\n\r\n    \/\/ 3) Transformer les \\n en <br> (et double \\n en <br><br>)\r\n  html = html\r\n    .replace(\/\\r?\\n\\r?\\n\/g, '<br><br>')\r\n    .replace(\/\\r?\\n\/g, '<br>');\r\n\r\n  \/\/ 4) Ceinture+bretelles : certains &amp;#10; survivent\r\n  html = html.replace(\/&amp;#(?:10|x0a);\/gi, '<br>');\r\n\r\n  \/\/ 5) Si \"Directed by\" ou \"Produced by\" appara\u00eet coll\u00e9, force un saut avant\r\n  html = html.replace(\/(<b>Directed)\/gi, '<br><br>$1');\r\n  html = html.replace(\/(<b>Produced)\/gi, '<br><br>$1');\r\n\r\n  return html;\r\n\r\n}\r\n\r\n\r\n\/* === Logic liste \/ preview \/ d\u00e9tail === *\/\r\ndocument.addEventListener('DOMContentLoaded', () => {\r\n  \/\/ Secret\/noise\r\n  const secrets = document.querySelectorAll('.work-item span.secret');\r\n  secrets.forEach(makeSecret);\r\n  setInterval(() => secrets.forEach(makeSecret), 60);\r\n\r\n  const list        = document.querySelector('.work-list');\r\n  const overlay     = document.getElementById('preview-overlay');\r\n  const detailView  = document.getElementById('project-detail');\r\n  const detailRow   = document.getElementById('detail-row');\r\n  const detailText  = document.getElementById('detail-text'); \/\/ <p>, on va y mettre du HTML\r\n  const assetsCon   = detailView.querySelector('.detail-assets');\r\n  const closeBtn    = document.getElementById('closeDetail');\r\n  const items       = Array.from(list.children);\r\n\r\n  function openDetail(item) {\r\n    \/\/ 1) Ligne du tableau copi\u00e9e en header d\u00e9tail\r\n    detailRow.innerHTML = item.innerHTML;\r\n\r\n    \/\/ 2) Texte (HTML autoris\u00e9 + conversions <br>)\r\n    const raw = item.dataset.description || '';\r\n    detailText.innerHTML = sanitizeDesc(raw);\r\n\r\n    \/\/ 3) Assets\r\n    assetsCon.innerHTML = '';\r\n    (item.dataset.assets || '')\r\n      .split(',')\r\n      .map(s => s.trim())\r\n      .filter(Boolean)\r\n      .forEach(u => assetsCon.insertAdjacentHTML('beforeend', assetHTML(u)));\r\n\r\n    \/\/ 4) Afficher panneau d\u00e9tail\r\n    list.style.display       = 'none';\r\n    detailView.style.display = 'block';\r\n    overlay.style.display    = 'none';\r\n  }\r\n\r\n  \/\/ interactions ligne\r\n  items.forEach(item => {\r\n    if (item.classList.contains('disabled')) return;\r\n\r\n    item.addEventListener('click', () => openDetail(item));\r\n\r\n    item.addEventListener('mouseenter', () => {\r\n      const url = item.dataset.preview;\r\n      if (!url) return;\r\n\r\n      \/\/ preview (169px de haut) \u2014 vid\u00e9o (Vimeo\/MP4) ou image\r\n      if (\/vimeo\\.com|\\.(mp4|webm|ogg)$\/i.test(url)) {\r\n        overlay.innerHTML = `\r\n          <iframe\r\n            src=\"${normalizeVimeo(url)}\"\r\n            allow=\"autoplay; fullscreen\"\r\n            frameborder=\"0\"\r\n            allowfullscreen\r\n            style=\"width:100%;height:100%;object-fit:cover;\">\r\n          <\/iframe>`;\r\n        overlay.style.height = '169px';\r\n      } else {\r\n        overlay.innerHTML = `<img decoding=\"async\" src=\"${url}\" style=\"width:100%;height:auto;object-fit:cover;\">`;\r\n        overlay.style.height = 'auto';\r\n      }\r\n\r\n      const r = item.getBoundingClientRect();\r\n      overlay.style.top     = `${r.top}px`;\r\n      overlay.style.right   = '10px';\r\n      overlay.style.display = 'block';\r\n    });\r\n\r\n    item.addEventListener('mouseleave', () => {\r\n      overlay.style.display = 'none';\r\n    });\r\n  });\r\n\r\n  \/\/ fermeture d\u00e9tail\r\n  closeBtn.addEventListener('click', () => {\r\n    detailView.style.display = 'none';\r\n    list.style.display       = 'block';\r\n  });\r\n});\r\n<\/script>\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>","protected":false},"excerpt":{"rendered":"<p>Client Project Role Statut Year Directed by Studio Grinely Filmed by Nathanael Le Gac\u00a0\u00bb data-assets=\u00a0\u00bbhttps:\/\/player.vimeo.com\/video\/1143456227&Prime;> Groupe Cube Employee ITW Creative + Production Complete 2025 Stills by Nathanael Le GAC Motion by Ilias Qerchi\u00a0\u00bb data-assets=\u00a0\u00bbhttps:\/\/player.vimeo.com\/video\/1143458568,https:\/\/grinely.com\/wp-content\/uploads\/2025\/12\/Portrait5\uf022VLADIMIRCAUCHEMAR_ERS2025\u00a9Nathanael_Le_Gac-scaled.jpg,https:\/\/grinely.com\/wp-content\/uploads\/2025\/12\/DOS3\uf022VLADIMIRCAUCHEMAR_ERS2025\u00a9Nathanael_Le_Gac-scaled.jpg,https:\/\/grinely.com\/wp-content\/uploads\/2025\/12\/Portrait_public\uf022MarionDiNapoli_ERS2025\u00a9Nathanael_Le_Gac-scaled.jpg,\u00a0\u00bb> Eurock\u00e9ennes ERS 2025 Creative + Production Complete 2025 Directed by Studio Grinely Filmed by Nathanael Le Gac\u00a0\u00bb data-assets=\u00a0\u00bbhttps:\/\/player.vimeo.com\/video\/1121786111&Prime;> Emma\u00fcs x Groupe [&hellip;]<\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"footnotes":""},"class_list":["post-196","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/grinely.com\/en\/wp-json\/wp\/v2\/pages\/196","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/grinely.com\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/grinely.com\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/grinely.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/grinely.com\/en\/wp-json\/wp\/v2\/comments?post=196"}],"version-history":[{"count":590,"href":"https:\/\/grinely.com\/en\/wp-json\/wp\/v2\/pages\/196\/revisions"}],"predecessor-version":[{"id":1368,"href":"https:\/\/grinely.com\/en\/wp-json\/wp\/v2\/pages\/196\/revisions\/1368"}],"wp:attachment":[{"href":"https:\/\/grinely.com\/en\/wp-json\/wp\/v2\/media?parent=196"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}