@font-face{font-family:"Helvetica Neue LT Pro";src:url("/scripts/structural/fonts/HelveticaNeueLTPro-Roman-BF6a4a7b13de507.otf") format("opentype");font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:"Helvetica Neue LT Pro";src:url("/scripts/structural/fonts/HelveticaNeueLTPro-Md-BF6a4a7b13d6e9b.otf") format("opentype");font-style:normal;font-weight:500;font-display:swap}

:root{--paper:#f9f8f3;--ink:#000;--muted:#9e9e9e;--gutter:1.4423vw}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:var(--paper);color:var(--ink);font-family:"Helvetica Neue LT Pro","Helvetica Neue",Helvetica,Arial,sans-serif;font-size:14px;line-height:1.3;letter-spacing:-1px}
.site-scroll-content{position:relative;min-height:100%}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button{font:inherit;color:inherit}
p,h1,h2,figure{margin:0}
a:focus-visible,button:focus-visible{outline:2px solid #bc2827;outline-offset:5px}
.skip-link{position:fixed;left:16px;top:-80px;z-index:100;background:var(--paper);padding:12px}
.skip-link:focus{top:12px}

.site-header{height:66px;position:relative;z-index:20}
.brand{position:absolute;top:12px;left:var(--gutter);height:44px;display:flex;align-items:center;font-weight:500;font-size:15px;line-height:1}
.home .brand{visibility:hidden}
.menu-toggle{position:fixed;top:12px;right:12px;width:44px;height:44px;padding:6px;border:0;background:transparent;cursor:pointer;z-index:30}
.menu-toggle img{width:32px;transition:transform .25s}
.menu-toggle[aria-expanded=true] img{transform:rotate(45deg)}
.menu{position:fixed;right:80px;top:12px;height:44px;display:flex;gap:30px;align-items:center;background:transparent;padding:0 8px;z-index:25}
.menu[hidden]{display:none}
.menu a{font-size:15px;font-weight:500;line-height:1}
.menu a:hover{color:#9e9e9e;text-decoration:none}

.site-footer{display:flex;justify-content:space-between;padding:26px var(--gutter) 14px;font-size:max(15px,1.04vw);color:var(--ink);letter-spacing:-1px}
.site-footer a{color:var(--ink)}
.site-footer a:hover{color:var(--muted);text-decoration:none}

.archive{position:relative;margin-top:-66px;height:224.5vw;min-height:720px}
.archive-title{position:absolute;left:34.615%;top:18.365vw;width:30.77%;text-align:center}
.archive-title h1{font-size:inherit}
.archive-title p{margin-top:8px;font-weight:400;color:#000}
.collage{position:absolute;display:block}
.collage img{position:absolute;max-width:none}
.collage-caption{position:absolute;bottom:-40px;left:0;white-space:nowrap}
.collage-caption h2{font-size:16px;font-weight:500;line-height:1.15;color:#000}
.collage-caption p{font-size:13px;font-weight:500;color:var(--muted);letter-spacing:-1px}
.collage.right .collage-caption{left:auto;right:0;text-align:right}
.collage-acause{left:6%;top:33vw;width:48%;height:31vw}
.collage-ssm{left:51%;top:62.5vw;width:41.5%;height:36.5vw}
.collage-encore{left:5.1%;top:100.5vw;width:46%;height:32.5vw}
.collage-club{left:51.6%;top:138vw;width:46.1%;height:34.5vw}
.collage-shirts{left:3%;top:177.5vw;width:46%;height:36vw}

.projects-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(64px,6vw,120px) var(--gutter);padding:8vw var(--gutter) 20px}
.project-card .cover{width:100%;aspect-ratio:1.38;object-fit:cover}
@media(min-width:701px) and (hover:hover) and (pointer:fine){
 .projects-grid .project-card{transition:opacity .2s ease}
 .projects-grid .project-card:hover{opacity:.8}
}
@media(prefers-reduced-motion:reduce){.projects-grid .project-card{transition:none}}
@media(min-width:701px){.projects-grid .project-card .cover.cover-ssm{object-position:center 62%}}
.project-card h1,.project-card h2{font-size:16px;font-weight:500;line-height:1.1;margin-top:16px}
.project-card p{font-size:13px;font-weight:500;color:var(--muted)}

.project-intro{display:grid;grid-template-columns:1fr 1fr 3fr 1fr;gap:var(--gutter);padding:81px var(--gutter) 68px;min-height:284px}
.project-intro h1{font-size:20px;font-weight:600;line-height:1.02;max-width:195px}
.intro-services dt,.intro-description h2{font-size:14px;font-weight:400;color:var(--ink)}
.intro-services{margin:0}
.intro-services dd{margin:0}
.intro-description p+p{margin-top:18px}
.project-website{display:inline-block;margin-top:3px}
.project-website:hover,.intro-description a:hover{color:var(--muted);text-decoration:none}

.gallery{display:flex;flex-direction:column;gap:0}
.gallery .full{width:100%;height:auto}
.gallery .wide{aspect-ratio:1.69;object-fit:cover}
.gallery-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--gutter);padding:var(--gutter)}
.gallery-row img{width:100%;height:100%;object-fit:cover;aspect-ratio:1/1.025}
.gallery-row.thirds{grid-template-columns:repeat(3,1fr)}
.gallery-row.thirds img{aspect-ratio:auto;height:auto;object-fit:contain}
.gallery-row.shirts img{object-fit:contain;aspect-ratio:1}
.gallery-inset{padding:7vw 14vw}
.gallery-inset img{width:100%}
.gallery-ssm{background:#eee}
.gallery-ssm .gallery-row{align-items:center;padding:4vw 12vw;gap:10vw}
.gallery-ssm .gallery-row img{object-fit:contain;aspect-ratio:4/5}

.about-main{position:relative;height:max(660px,46.5vw);min-height:calc(100vh - 60px);margin-top:-66px;padding-top:66px}
.about-lede,.about-text,.about-bag h2{font-size:max(15px,1.171875vw);font-weight:400;line-height:1.3}
.about-lede{position:absolute;left:9%;top:25px}
.about-lede span{display:block;padding-left:max(24px,1.875vw)}
.about-lede .about-lede-first{padding-left:0}
.portrait{position:absolute;left:5.8%;top:15.9vw;width:20.8%;transform:rotate(-4deg)}
.portrait img{width:100%}
.about-text{position:absolute}
.about-city{left:34.35%;top:14.9vw;width:14.5%}
.about-studies{left:34.35%;top:22.2vw;width:14.5%}
.about-work{left:50.9%;top:30.6vw;width:14.5%}
.about-stories{left:34.35%;top:45.3vw;width:14.5%}
.about-contact{left:83.7%;top:45.3vw;width:15%}
.about-contact a:hover{color:var(--muted);text-decoration:none}
.about-bag{position:absolute;left:67.3%;top:10.7vw;width:29%;height:28vw}
.about-bag h2{margin:0}
.bag-items{position:relative;width:100%;height:31vw;margin-top:1.4vw}
.bag-item{position:absolute;display:block;margin:0;padding:0;border:0;background:transparent;touch-action:none;user-select:none;cursor:grab;translate:var(--drag-x,0) var(--drag-y,0);z-index:1}
.bag-item:active{cursor:grabbing}
.bag-item.is-dragging{z-index:60}
.bag-item img{display:block;width:100%;height:auto;object-fit:contain;pointer-events:none;-webkit-user-drag:none}
.bag-items .cartes{width:23%;left:7%;top:.1vw;transform:rotate(-8deg)}
.bag-items .mots-croises{width:52%;left:35%;top:3.1vw;transform:rotate(5deg)}
.bag-items .crayon{width:4.2%;left:76%;top:-3.8vw;transform:rotate(128deg)}
.bag-items .harmonica{width:39%;left:16%;top:9.6vw;transform:rotate(8deg)}
.bag-items .sachets{width:27%;left:64%;top:20.2vw;transform:rotate(11deg)}
.bag-items .appareil-photo{width:46%;left:6%;top:19.2vw;transform:rotate(7deg)}
.about .site-footer{margin-top:0}

.play-scene{position:relative;height:58vw;min-height:420px;overflow:hidden;margin-top:3vw}
.play-scene .scene-piece{position:absolute;border:0;padding:0;background:none;cursor:grab;touch-action:none;user-select:none}
.scene-piece:active{cursor:grabbing}
.scene-piece img{width:100%;height:auto;pointer-events:none}
.scene-instruction{text-align:center;margin:20px 0 10px}

.cursor-dot{width:9px;height:9px;position:fixed;left:0;top:0;background:transparent;border-radius:50%;pointer-events:none;z-index:35;display:none}
.cursor-dot::after{content:"";position:absolute;left:50%;top:50%;width:9px;height:9px;background:#080808;border-radius:50%;transform:translate(-50%,-50%);transition:width .18s ease-out,height .18s ease-out}
body.has-pointer .cursor-dot:not(.cursor-dot-front){display:block}
body:has(a[href]:not([aria-disabled="true"]):hover,button:enabled:not(.bag-item):not([aria-disabled="true"]):hover,input:enabled:hover,select:enabled:hover,textarea:enabled:hover,summary:hover,label[for]:hover,[role="button"]:not([aria-disabled="true"]):hover,[role="link"]:not([aria-disabled="true"]):hover) .cursor-dot::after{width:12px;height:12px}

.home .site-footer{padding-top:20px}
.media-fallback{width:100%;object-fit:cover}
.motion-video{display:block;width:100%;height:auto}
.not-found{padding:15vh 8vw}
.not-found h1{font-size:36px;margin-bottom:24px}

@media(min-width:1600px){
  body{font-size:16px}
  .project-intro{padding-top:6.3vw;padding-bottom:5.3vw}
  .site-header{height:5.15vw}
  .archive{margin-top:-5.15vw}
  .about-main{max-width:1600px;margin-left:auto;margin-right:auto}
}

@media(max-width:700px){
  :root{--gutter:16px}
  body{font-size:14px;letter-spacing:-1px}
  .site-header{height:72px}
  .brand{top:26px}
  .menu-toggle{top:15px;right:10px}
  .menu{top:0;right:0;left:0;height:74px;gap:16px;justify-content:space-between;padding:0 72px 0 18px;background:var(--paper);box-shadow:none}
  .archive{height:auto;min-height:0;display:flex;flex-direction:column}
  .archive-title{position:relative;left:auto;top:auto;align-self:center}
  .collage{position:relative!important;left:auto!important;top:auto!important;height:59vw}
  .collage-caption{white-space:normal}
  .projects-grid{grid-template-columns:1fr;gap:56px 0;padding:40px 0 20px}
  .project-card .cover{aspect-ratio:1}
  .project-card h2{margin-top:12px}
  .project-intro{padding:34px 16px 38px;grid-template-columns:1fr 1fr;gap:30px 14px;min-height:0}
  .project-intro h1{font-size:20px;max-width:180px}
  .intro-description{grid-column:1/-1;max-width:560px}
  .intro-description p{font-size:15px;line-height:1.4}
  .gallery-row{gap:10px;padding:10px}
  .gallery-row.thirds{grid-template-columns:1fr;padding:28px 18%;gap:25px}
  .gallery-inset{padding:25px 7%}
  .gallery-ssm .gallery-row{padding:24px 5%;gap:20px}
  .about-main{display:flex;flex-direction:column;padding:15px 24px;gap:27px}
  .about-lede,.portrait,.about-text,.about-bag{position:relative;left:auto;top:auto;max-width:none;width:auto}
  .about-contact{margin-left:8%}
  .bag-items{max-width:360px;margin-left:auto;margin-right:auto}
  .play-scene{height:80vw;min-height:300px}
  .scene-instruction{font-size:12px;padding:0 16px}
  .site-footer{padding:32px 16px 16px}
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition:none!important;animation:none!important}
}


/* Ajustements vérifiés sur les pages de référence. */

.motion-video{height:56.25vw;object-fit:contain;background:#121212}

@media(max-width:700px){
  .about-main{height:auto;min-height:0}
  .motion-video{height:auto}
  .about .site-footer{margin-top:24px}
}


/* ReadyMag agrandit sa maquette desktop de 1040 px avec la fenêtre. */

@media(min-width:701px){
  .home .collage-caption h2,
  .project-card h1,
  .project-card h2{
    font-size:max(17px,1.63461538vw);
    line-height:1.05
  }

  .home .collage-caption p,
  .project-card p{
    font-size:max(12px,1.05769231vw);
    line-height:1.15
  }

  .home .archive-title p{
    font-size:max(12px,1.15384615vw)
  }

  .menu a,
  .brand{
    font-size:max(13px,1.25vw)
  }
}


/* Collages fixes et légendes légèrement plus aérées. */

.home .collage-caption h2,
.project-card h1,
.project-card h2{
  line-height:1
}

.home .collage-caption p,
.project-card p{
  line-height:1;
  margin-top:1px
}

.collage-art{
  position:absolute;
  inset:0
}

@media(max-width:700px){
  .project-card h1,
  .project-card h2{
    font-size:17px
  }

  .project-card p{
    font-size:12px
  }
}


/* Position des légendes par projet. */

.collage-acause .collage-caption{
  transform:translateY(-20px)
}

.collage-ssm .collage-caption,
.collage-club .collage-caption{
  transform:translateY(18px)
}


/* Une seule zone de survol pilote les objets, chacun autour de son centre. */

@media(prefers-reduced-motion:no-preference){
  .home .collage-art img{
    pointer-events:none;
    transform-origin:center;
    translate:0 0;
    rotate:0deg;
    transition:
      translate .65s cubic-bezier(.22,.61,.36,1),
      rotate .65s cubic-bezier(.22,.61,.36,1)
  }

  .home .collage-art img.art-object-1{
    --hover-x:-4px;
    --hover-y:-5px;
    --hover-angle:-2deg
  }

  .home .collage-art img.art-object-2{
    --hover-x:4px;
    --hover-y:-3px;
    --hover-angle:2deg
  }

  .home .collage-art img.art-object-3{
    --hover-x:-3px;
    --hover-y:4px;
    --hover-angle:1.5deg
  }

  .home .collage-art img.art-object-4{
    --hover-x:5px;
    --hover-y:2px;
    --hover-angle:-2deg
  }

  .home .collage-art img.art-object-5{
    --hover-x:-2px;
    --hover-y:4px;
    --hover-angle:2.5deg
  }
}

@media(min-width:701px) and (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
  .home .collage-art::before{
    content:"";
    position:absolute;
    inset:-10px
  }

  .home .collage:hover .collage-art img{
    translate:var(--hover-x) var(--hover-y);
    rotate:var(--hover-angle)
  }
}


/* Même grille mobile sur chaque page. */

@media(max-width:700px){
  .site-header{
    position:fixed;
    inset:0 0 auto;
    height:74px;
    display:grid;
    grid-template-columns:max-content max-content max-content 44px;
    justify-content:space-between;
    align-items:center;
    padding:0 10px 0 12px;
    background:var(--paper)
  }

  body{
    padding-top:74px
  }

  .site-header .brand{
    position:static;
    grid-column:1;
    grid-row:1;
    font-size:16px;
    font-weight:500;
    line-height:1;
    white-space:nowrap
  }

  .site-header .menu{
    display:contents
  }

  .site-header .menu[hidden]{
    display:none
  }

  .site-header .menu-home{
    display:none
  }

  .site-header .menu a.menu-projects{
    grid-column:2;
    grid-row:1
  }

  .site-header .menu a.menu-about{
    grid-column:3;
    grid-row:1
  }

  .site-header .menu a{
    font-size:16px;
    white-space:nowrap
  }

  .site-header .menu-toggle{
    position:static;
    grid-column:4;
    grid-row:1
  }
}


/* Sur mobile, images bord à bord et légendes légèrement en retrait. */

@media(max-width:700px){
  .projects-grid .project-card h1,
  .projects-grid .project-card h2,
  .projects-grid .project-card p{
    margin-left:var(--gutter);
    margin-right:var(--gutter)
  }

  .projects-grid .project-card p{
    margin-top:0
  }
}


/* Typographie commune aux pages de projet et vidéo finale Acause. */

.project .project-intro h1{
  font-size:max(19px,1.8vw);
  font-weight:500;
  line-height:1;
  color:var(--ink);
  max-width:none
}

.project .intro-services,
.project .intro-description,
.project .intro-services dt,
.project .intro-description h2,
.project .project-website{
  font-size:max(15px,1.171875vw);
  line-height:1.3
}

.project-acause-studio .gallery > .motion-video:last-child{
  width:100%;
  height:auto;
  object-fit:contain;
  background:var(--paper)
}

@media(max-width:700px){
  .project .project-intro h1{
    font-size:17px
  }

  .project .intro-description p{
    font-size:15px
  }
}


/* Vidéos sans interface. */

.motion-video{
  pointer-events:none
}

.motion-video::-webkit-media-controls{
  display:none!important
}

.project-acause-studio{
  position:relative
}

.project-acause-studio .site-footer{
  position:absolute;
  bottom:0;
  left:0;
  width:100%;
  z-index:1;
  background:transparent
}


/* SSM */

.ssm-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:var(--gutter);
  padding:var(--gutter)
}

.ssm-panel{
  aspect-ratio:1/1.025;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  background:#121212
}

.ssm-panel img,
.ssm-panel .motion-video{
  display:block;
  height:auto;
  object-fit:contain;
  background:#121212
}

.ssm-papers img{width:80%}
.ssm-brandmark img{width:58%}

.ssm-cards img{
  width:100%;
  height:100%;
  object-fit:cover
}

.ssm-screen .motion-video{
  width:86%;
  height:86%
}

@media(max-width:700px){
  .ssm-grid{
    grid-template-columns:1fr
  }
}

.project-studio-sauve-morissette .gallery > .motion-video{
  background:#121212
}


/* Encore Encore. */

.project-encore-encore{
  position:relative
}

.project-encore-encore .encore-gallery{
  position:relative;
  background:#000
}

.project-encore-encore .encore-grid-section{
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#000
}

.project-encore-encore .encore-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:var(--gutter);
  width:48.1%
}

.project-encore-encore .encore-grid img{
  display:block;
  width:100%;
  height:auto
}

.project-encore-encore .site-footer{
  position:absolute;
  bottom:0;
  left:0;
  width:100%;
  z-index:2;
  background:#000;
  color:#777;
  border:0;
  box-shadow:0 6px 0 #000
}

.project-encore-encore .site-footer a{
  color:#777
}


/* Lightbox Encore Encore. */

.lightbox-trigger{
  display:block;
  width:100%;
  padding:0;
  border:0;
  background:transparent;
  cursor:pointer
}

.lightbox-trigger img{
  display:block;
  width:100%;
  height:auto
}

body.lightbox-open{
  overflow:hidden
}

.lightbox{
  position:fixed;
  inset:0;
  z-index:70;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:5vh 5vw;
  background:rgba(0,0,0,.94);
  opacity:0;
  transition:opacity .18s ease-out
}

.lightbox[hidden]{
  display:none
}

.lightbox.is-open{
  opacity:1
}

.lightbox-image{
  display:block;
  max-width:90vw;
  max-height:90vh;
  width:auto;
  height:auto;
  object-fit:contain
}

.lightbox-close{
  position:fixed;
  top:12px;
  right:12px;
  z-index:2;
  width:44px;
  height:44px;
  padding:6px;
  border:0;
  background:transparent;
  cursor:pointer
}

.lightbox-close img{
  width:32px;
  height:32px;
  filter:invert(1);
  transform:rotate(45deg)
}

.lightbox-trigger:focus,
.lightbox-trigger:focus-visible,
.lightbox-close:focus,
.lightbox-close:focus-visible{
  outline:none;
  box-shadow:none
}

.lightbox-trigger:focus-visible{
  opacity:.85
}

.lightbox-close:focus-visible{
  opacity:.65
}

@media(max-width:700px){
  .lightbox{
    padding:70px 16px 24px
  }

  .lightbox-image{
    max-width:calc(100vw - 32px);
    max-height:calc(100vh - 94px)
  }

  .lightbox-close{
    top:15px
  }
}


/* CLUB DE QUARTIER */

.project-club-de-quartier .club-posters{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:var(--gutter);
  padding:var(--gutter);
  background:var(--paper)
}

.project-club-de-quartier .club-posters img{
  width:100%;
  height:auto;
  display:block;
  box-shadow:0 8px 18px rgba(0,0,0,.24),0 2px 5px rgba(0,0,0,.10)
}

.project-club-de-quartier .club-photo-pair{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:var(--gutter);
  padding:var(--gutter);
  background:var(--paper)
}

.project-club-de-quartier .club-photo-pair img{
  display:block;
  width:100%;
  height:34vw;
  object-fit:cover
}

.project-club-de-quartier .club-motion-video{
  display:block;
  width:28%;
  height:auto!important;
  margin:6vw auto 9vw;
  object-fit:contain;
  background:transparent
}

.project-club-de-quartier .club-play-scene{
  height:50.5vw;
  min-height:0;
  margin-top:0;
  overflow:hidden
}

@media(min-width:701px){
  .project-club-de-quartier .club-play-scene{overflow:visible}
}

.project-club-de-quartier .club-play-scene .scene-piece{
  position:absolute;
  border:0;
  padding:0;
  background:none;
  cursor:grab;
  touch-action:none;
  user-select:none
}

.project-club-de-quartier .club-play-scene .scene-piece:active{
  cursor:grabbing
}

.project-club-de-quartier .club-play-scene .scene-piece img{
  width:100%;
  height:auto;
  pointer-events:none
}

.project-club-de-quartier .scene-instruction{
  position:relative;
  top:0;
  margin:0;
  padding:2.5vw 16px 2.5vw;
  text-align:center;
  font-size:max(15px,1.171875vw);
  line-height:1.3
}

.project-club-de-quartier .site-footer{
  padding-top:0
}


/* Scroll desktop. */

@media(min-width:701px){
  html.js-scroll,
  html.js-scroll body{
    width:100%;
    height:100%;
    overflow:hidden
  }

  .site-scroll{
    position:absolute;
    inset:0;
    overflow-x:hidden;
    overflow-y:auto;
    padding-top:66px;
    background:transparent
  }

  .site-scroll-content{
    position:relative;
    min-height:100%;
    background:transparent
  }

  body.lightbox-open .site-scroll{
    overflow:hidden
  }
}

@media(min-width:1600px){
  .site-scroll{
    padding-top:5.15vw
  }
}


/* Curseur desktop. */

@media(hover:hover) and (pointer:fine){
  html,
  body,
  body *,
  body *::before,
  body *::after{
    cursor:none!important
  }

  a[href],img{-webkit-user-drag:none}

  .cursor-dot{
    z-index:35
  }

  .brand,
  .menu,
  .menu-toggle{
    z-index:40
  }

  body .cursor-dot:not(.cursor-dot-front){
    mix-blend-mode:difference!important
  }

  body .cursor-dot:not(.cursor-dot-front)::after{
    background:var(--paper)!important
  }

  body.cursor-over-header .cursor-dot:not(.cursor-dot-front){
    display:none!important;
    visibility:hidden!important;
    opacity:0!important
  }

  .cursor-dot-front{
    z-index:2147483647!important;
    display:none!important;
    visibility:visible!important;
    opacity:1!important;
    mix-blend-mode:normal!important;
    isolation:isolate!important;
    filter:none!important
  }

  .cursor-dot-front::after{
    background:var(--cursor-front-color,#080808)!important;
    mix-blend-mode:normal!important;
    filter:none!important;
    opacity:1!important
  }

  body.has-pointer.cursor-over-header .cursor-dot-front{
    display:block!important
  }

  body.lightbox-open .cursor-dot:not(.cursor-dot-front){
    z-index:80
  }

  .cursor-scroll-shield{
    position:fixed;
    inset:0;
    z-index:2147483646;
    background:transparent;
    pointer-events:none;
    cursor:none!important
  }

  .cursor-scroll-shield.is-active{
    pointer-events:auto
  }
}


/* Navigation fixe et mix-blend après le header. */

@media(min-width:701px){
  .site-header{
    z-index:auto
  }

  body:not(.home) .brand{
    position:fixed;
    top:12px;
    left:var(--gutter);
    z-index:40
  }

  body:not(.home):not(.content-blend) .brand,
  body:not(.home):not(.content-blend) .menu{
    color:var(--ink)!important;
    -webkit-text-fill-color:var(--ink)!important;
    mix-blend-mode:normal!important
  }

  body:not(.home):not(.content-blend) .menu a,
  body:not(.home):not(.content-blend) .menu a:visited{
    color:var(--ink)!important;
    -webkit-text-fill-color:var(--ink)!important;
    opacity:1
  }

  body:not(.home):not(.content-blend) .menu a:hover{
    color:var(--muted)!important;
    -webkit-text-fill-color:var(--muted)!important;
    opacity:1
  }

  body:not(.home):not(.content-blend) .menu-toggle{
    mix-blend-mode:normal!important
  }

  body:not(.home):not(.content-blend) .menu-toggle img{
    filter:none!important
  }

  body:not(.home).content-blend .brand,
  body:not(.home).content-blend .menu,
  .home .menu{
    color:var(--paper)!important;
    -webkit-text-fill-color:var(--paper)!important;
    mix-blend-mode:difference!important
  }

  body:not(.home).content-blend .menu a,
  body:not(.home).content-blend .menu a:visited,
  .home .menu a,
  .home .menu a:visited{
    color:var(--paper)!important;
    -webkit-text-fill-color:var(--paper)!important;
    opacity:1
  }

  body:not(.home).content-blend .menu a:hover,
  .home .menu a:hover{
    color:#777!important;
    -webkit-text-fill-color:#777!important;
    opacity:1
  }

  body:not(.home).content-blend .menu-toggle{
    mix-blend-mode:difference!important
  }

  body:not(.home).content-blend .menu-toggle img{
    filter:invert(1)!important
  }
}


/* Accueil : conserver le + noir, indépendamment du menu. */

@media(min-width:701px){
  .home .menu-toggle{
    mix-blend-mode:normal!important
  }

  .home .menu-toggle img{
    filter:none!important
  }
}


/* MOBILE */

@media(max-width:700px){

  .project-club-de-quartier .club-posters{
    grid-template-columns:1fr;
    gap:38px;
    width:68%;
    padding:56px 0 64px
  }

  .project-club-de-quartier .club-posters img{
    box-shadow:
      0 5px 14px rgba(0,0,0,.18),
      0 1px 3px rgba(0,0,0,.12)
  }

  .project-club-de-quartier .club-photo-pair{
    grid-template-columns:1fr;
    gap:10px;
    padding:0 10px 10px
  }


  .project-club-de-quartier .club-motion-video{
    width:100%;
    height:auto!important;
    margin:56px auto 20px
  }

  .project-club-de-quartier .club-play-scene{
    height:80vw;
    min-height:300px
  }

  .project-club-de-quartier .scene-instruction{
    top:0;
    padding:0 16px 10px;
    font-size:15px;
    line-height:1.3
  }
}


@media(hover:none),(pointer:coarse){

  html,
  body,
  body *{
    cursor:auto!important
  }

  .cursor-dot,
  .cursor-dot-front,
  .cursor-scroll-shield{
    display:none!important
  }
}


@media(max-width:700px){

  .site-header{
    z-index:30
  }

  .site-header .brand,
  .site-header .menu,
  .site-header .menu-toggle{
    mix-blend-mode:normal!important
  }

  .site-header .brand,
  .site-header .menu,
  .site-header .menu a{
    color:#000!important;
    -webkit-text-fill-color:#000!important
  }

  .site-header .menu-toggle img{
    filter:none!important
  }
}


/* Aligner le bord du + avec la marge latérale des images. */

@media(min-width:701px){
  .menu-toggle{
    right:calc(var(--gutter) - 6px)
  }

  .menu{
    right:calc(var(--gutter) + 62px)
  }
}


/* Collage des cinq chandails et drum interactif. */

.merch-collage{
  position:relative;
  height:52vw;
  margin:5vw 0 2vw
}

.merch-shirt{
  position:absolute;
  width:27.5%;
  aspect-ratio:1;
  transform:rotate(var(--shirt-angle,0deg))
}

.merch-shirt img{
  position:absolute;
  width:166.67%;
  max-width:none;
  left:-33.33%;
  top:-33.33%;
  pointer-events:none
}

.merch-shirt-pleure{
  left:2%;
  top:30%;
  --shirt-angle:-7deg;
  --shirt-move:-8px;
  z-index:2
}

.merch-shirt-encore{
  left:20%;
  top:12%;
  --shirt-angle:3deg;
  --shirt-move:8px;
  z-index:3
}

.merch-shirt-gab{
  left:38%;
  top:3%;
  --shirt-angle:-2deg;
  --shirt-move:-8px;
  z-index:1
}

.merch-shirt-etoile{
  left:49%;
  top:31%;
  --shirt-angle:-6deg;
  --shirt-move:8px;
  z-index:4
}

.merch-shirt-rond{
  left:66.5%;
  top:21%;
  --shirt-angle:5deg;
  --shirt-move:-8px;
  z-index:5
}

@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
  .merch-shirt{
    transition:translate .55s ease
  }

  .merch-shirt:hover{
    translate:var(--shirt-move) -12px
  }
}


/* Drum Encore Encore */

.merch-drum{
  padding:5vw 0 1vw;
  text-align:center
}

.drum-toggle{
  display:flex;
  align-items:center;
  justify-content:center;

  width:48vw;
  height:auto;
  aspect-ratio:1.07 / 1;

  margin:0 auto;
  padding:0;

  border:0;
  background:transparent;
  overflow:hidden;
  cursor:pointer
}

.drum-toggle img{
  display:block
}

.drum-toggle img[hidden]{
  display:none
}

/* Mockup : conserve son comportement actuel. */

.drum-mockup{
  width:60%;
  height:auto;
  object-fit:contain
}

/* Photo : grand cadrage presque carré comme la référence ReadyMag. */

.drum-photo{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center
}

.merch-drum p{
  font-size:max(15px,1.171875vw);
  margin:28px 0 20px
}


@media(max-width:700px){

  .merch-collage{
    height:125vw;
    margin:12vw 0 8vw
  }

  .merch-shirt{
    width:45%
  }

  .merch-shirt-pleure{
    left:3%;
    top:4%
  }

  .merch-shirt-encore{
    left:49%;
    top:13%
  }

  .merch-shirt-gab{
    left:4%;
    top:37%
  }

  .merch-shirt-etoile{
    left:49%;
    top:46%
  }

  .merch-shirt-rond{
    left:25%;
    top:66%
  }

  .drum-toggle{
    width:90vw;
    height:auto;
    aspect-ratio:1.07 / 1
  }

  .drum-mockup{
    width:75%
  }
}
/* SSM : capture ordinateur entre les deux paires de visuels. */
.ssm-desktop{grid-column:1/-1;display:flex;align-items:center;justify-content:center;background:#121212;margin:0 calc(-1 * var(--gutter));min-height:51.923vw}
.ssm-desktop img{width:79.23%;height:auto;border:1px solid #303030;border-radius:12px}
@media(min-width:701px){
  .project-studio-sauve-morissette .project-intro{min-height:26.56vw}
  .project-studio-sauve-morissette .gallery > .motion-video{height:57.692vw}
}
@media(max-width:700px){.ssm-desktop{min-height:65vw;padding:24px 0}.ssm-desktop img{width:90%}}

/* Club : dimensions desktop mesurées sur la référence. */
@media(min-width:701px){
 .project-club-de-quartier .club-hero{height:64.909vw;object-fit:cover}
 .project-club-de-quartier .club-posters{grid-template-columns:repeat(3,minmax(0,1fr));gap:6.538vw;padding:11.538vw 4.23vw 8.654vw}
 .project-club-de-quartier .club-photo-pair{padding:0 var(--gutter);gap:var(--gutter)}
 .project-club-de-quartier .club-photo-pair img{height:41.827vw;object-fit:cover}
 .project-club-de-quartier .club-motion-video{width:82.31%;margin:5.72vw auto 7.5vw}
}

.drum-photo:not([hidden]){animation:drum-photo-appear .35s ease-in both}
@keyframes drum-photo-appear{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){.drum-photo:not([hidden]){animation:none}}

/* Drum : mêmes marges pour le mockup et la photo, comme la référence. */
@media(min-width:701px){
 .merch-drum{padding-bottom:0}
 .drum-toggle{aspect-ratio:1432 / 1334}
 .merch-drum p{margin:1.4423vw 0 0}
 .project-encore-encore-encore .site-footer{padding-top:20px}
}

/* Centre le groupe de chandails entre le hero et le mockup visible. */
@media(min-width:701px){.merch-collage{top:7.9vw}}

/* Keep blocked videos playable, including Safari autoplay restrictions. */
.motion-video.video-playback-fallback{pointer-events:auto;cursor:pointer}
.motion-video.video-playback-fallback::-webkit-media-controls{display:flex!important}

/* Navigation usable before JS has initialized, including failed script loads. */
html:not(.js-navigation) .menu[hidden]{display:flex}
html:not(.js-navigation) .menu-toggle{display:none}
@media(max-width:700px){html:not(.js-navigation) .site-header{display:block;height:auto;min-height:74px}html:not(.js-navigation) .brand{display:block;padding:12px}html:not(.js-navigation) .menu[hidden]{position:static;display:flex;height:auto;padding:12px;flex-wrap:wrap}html:not(.js-navigation) body{padding-top:120px}}

/* Mobile : compositions relevées dans les enregistrements du 6 octobre. */
.mobile-only{display:none}
@media(max-width:700px){
 :root{--gutter:13px;--paper:#f9f8f1}
 html{overflow-x:hidden;overscroll-behavior-x:none}
  body{padding-top:58px;overflow-x:hidden;overscroll-behavior-x:none}
 .site-header{height:58px;padding:0 10px 0 13px}
 .site-header .brand,.site-header .menu a{font-size:4.375vw;letter-spacing:-.21875vw}
 .site-header .menu .menu-language{position:absolute;right:13px;top:58px;padding:8px 12px;background:var(--paper);font-size:12px;line-height:1}
 .site-header .menu-toggle{width:40px;height:40px;padding:5px}
 .site-header .menu-toggle img{width:30px;height:30px}
 .site-footer{position:static!important;background:transparent!important;padding:36px 13px 18px!important;font-size:14px;letter-spacing:-.5px;color:var(--ink)!important}
 .site-footer a{color:inherit!important}
 /* Accueil : même rythme, objets et légendes de la référence. */
 .home .archive{margin-top:-58px;padding-top:219px;gap:130px;padding-bottom:70px}
 .home .archive-title{width:88%;margin-bottom:0}
 .home .archive-title p{font-size:18px;margin-top:0px}
 .home .collage{width:88%;margin-left:6%;margin-bottom:28px}
 .home .collage-acause{margin-top:90px;height:59vw}
 .home .collage-caption{bottom:-28px}
 .home .collage-acause .collage-caption{bottom:-52px}
 .home .collage-acause{margin-bottom:52px}
 .home .collage-club .collage-caption{bottom:-64px}
 .home .collage-club{margin-top:-30px;margin-bottom:64px}
 .home .collage-encore .collage-caption{bottom:-20px}
 .home .collage-shirts .collage-caption{bottom:16px}
 .home .collage-shirts{margin-top:-30px;margin-bottom:0}
 .home .collage-caption h2{font-size:20px;line-height:1}
 .home .collage-caption p{max-width:none;font-size:15px;line-height:1.1;margin-top:2px}
 .home .collage-acause .collage-caption,.home .collage-ssm .collage-caption,.home .collage-club .collage-caption{transform:none}
 .home .collage-ssm{height:95.6vw;margin-top:-18px}
 .home .collage-ssm img.art-object-1{top:-3%!important;z-index:3}
 .home .collage-ssm img.art-object-2{left:3%!important;top:-2%!important;width:69.7%!important;z-index:1}
 .home .collage-ssm img.art-object-3{top:11%!important;z-index:2}
 .home .collage-ssm img.art-object-4{left:61%!important;transform:rotate(-3deg)!important;z-index:4}
 .home .collage-encore{height:105vw;margin-bottom:38px}
 .home .collage-encore img.art-object-1{left:7.5%!important;top:0!important;width:84.5%!important;transform:rotate(2deg)!important}
 .home .collage-encore img.art-object-2{display:none}
 .home .collage-club{height:90vw}
 .home .collage-club img.art-object-1{left:39.5%!important;top:12.5%!important;width:57.3%!important;transform:rotate(7deg)!important;z-index:2}
 .home .collage-club img.art-object-2{left:4%!important;top:0!important;width:54.55%!important;transform:rotate(-7deg)!important;z-index:1}
 .home .collage-shirts{height:111.64vw}
 .home .collage-shirts img.art-object-1{left:23%!important;top:0!important;width:73.5%!important}
 .home .collage-shirts img.art-object-2{left:4%!important;top:23%!important;width:70.7%!important}
 /* Projets : couvertures portrait et légendes compactes. */
 .projects-grid{padding:38px 0 0;gap:76px}
 .project-cover-picture{display:block}
 .projects-grid .cover{aspect-ratio:4/5;object-fit:cover}
 .projects-grid .project-card h2{font-size:24px;margin:17px 13px 0}
 .projects-grid .project-card p{font-size:14px;font-weight:500;line-height:1.1;margin:2px 13px 0}
 /* Le visuel d'ouverture précède le texte sur chaque projet. */
 .project main > *{order:3}
 .project{--mobile-hero-height:210vw;--mobile-intro-shift:-40px;--mobile-hero-text-gap:2px;--mobile-title-services-gap:7px;--mobile-services-description-gap:26px;--mobile-description-gallery-gap:148px}
 .project-encore-encore,.project-club-de-quartier,.project-encore-encore-encore{--mobile-hero-text-gap:-58px}
 .project-encore-encore{--mobile-hero-text-gap:-83px}
 .project main{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:var(--mobile-hero-height) auto;gap:12px;padding:0 13px}
 .project .gallery{display:contents}
 .project .gallery > *{order:3}
 .project .project-intro{order:2;display:block;padding:0;min-height:0;margin:calc(var(--mobile-hero-text-gap) + var(--mobile-intro-shift) + var(--mobile-intro-offset,0px)) 0 var(--mobile-description-gallery-gap)}
 .project-acause-studio .project-intro{position:relative;z-index:1;background:var(--paper)}
 .project .project-intro h1{font-size:30px;line-height:1;letter-spacing:-1px;margin:0 0 var(--mobile-title-services-gap)}
 .project .intro-services{font-size:16px;line-height:1;min-height:42px;letter-spacing:-.21875vw;color:var(--muted)}
 .project .intro-services dt,.project .intro-description h2{display:none}
 .project .intro-description{margin-top:var(--mobile-services-description-gap);max-width:none;font-size:max(15px,1.15384615vw);line-height:1.25}
 .project .project-website{font-size:max(15px,1.15384615vw);line-height:1.25}
 .project .intro-description p{font-size:4.375vw;line-height:1.07142857;letter-spacing:-.21875vw}
 .project .intro-description p+p{margin-top:18px}
 .project .gallery .full{width:100%;height:auto;aspect-ratio:auto;object-fit:contain}
 .project .gallery-row{display:flex;flex-direction:column;gap:12px;padding:0}
 .project .gallery-row img{height:auto;aspect-ratio:auto;object-fit:contain}
 .project .gallery-row picture{display:block;width:100%}
 .project .gallery-row picture img{width:100%}
 /* Acause : animation portrait, puis images empilées. */
 .project-acause-studio .gallery > .motion-video:last-child{order:1;width:118vw;max-width:none;margin:0 calc(-13px - 9vw);height:calc(118vw * 16 / 9);aspect-ratio:9/16;object-fit:cover;align-self:start;clip-path:inset(0 7.628%)}
 .project-acause-studio .acause-lightbox{display:block}
 .project-acause-studio .acause-lightbox img{width:100%;height:auto;aspect-ratio:auto}
 .project-acause-studio .gallery > .gallery-row.acause-business-cards{flex-direction:column-reverse}
 .project-acause-studio .gallery > .acause-signatures,.project-acause-studio .gallery > .gallery-row.acause-extra-posters{display:none}
 .project-acause-studio .gallery-inset{padding:0}
 /* SSM : animation, téléphone, papiers, ordinateur, cartes, marque. */
 .project-studio-sauve-morissette .gallery > .motion-video{order:1;width:calc(100% + 26px);margin:0 -13px;height:190.625vw;object-fit:contain;align-self:start}
 .project-studio-sauve-morissette .project-intro>div.intro-heading{position:relative}
 .project-studio-sauve-morissette .project-website{font-weight:700;position:absolute;right:0;top:4px;font-size:16px;letter-spacing:-.7px;margin:0}
 .ssm-grid{display:flex;flex-direction:column;padding:0;gap:12px}
 .ssm-panel{flex-shrink:0;aspect-ratio:1/1.2}
 .ssm-screen{order:1}.ssm-papers{order:2}.ssm-desktop{order:3}.ssm-cards{order:4}.ssm-brandmark{order:5}
 .ssm-screen .motion-video{width:86%;height:90%}
 .ssm-papers img{width:80%}
 .ssm-desktop{margin:0;min-height:120vw;padding:0}
 .ssm-desktop img{width:92%;border-radius:7px}
 .ssm-cards img{width:56%;height:auto;object-fit:contain}
 .ssm-brandmark img{width:58%}
 /* Encore : un hero portrait et une grille 3 × 2 centrée. */
 .project-encore-encore .encore-hero{order:1;display:block;overflow:hidden;height:calc(170vw - 15px)}
 .project-encore-encore .encore-hero img{width:94%;height:auto;margin:0 auto -15px}
 .project-encore-encore .encore-grid-section{order:3;min-height:0;padding:76px 16px}
 .project-encore-encore .encore-grid{width:100%}
 .project-encore-encore .encore-instruction{display:block;order:4;font-size:15px;line-height:1.2;margin-top:-4px}
 .project-encore-encore .site-footer{background:transparent!important;color:#000!important;padding-top:80px!important;box-shadow:none}
 /* Club : illustration en ouverture, puis affiches, téléphone et photos. */
 .project-club-de-quartier .club-play-scene{order:1;height:170vw;min-height:0;margin:0}
 .project-club-de-quartier .scene-instruction{display:none}
 .project-club-de-quartier .club-posters{order:3;width:100%;padding:0;margin:0;gap:12px}
 .project-club-de-quartier .club-posters img{box-shadow:none}
 .project-club-de-quartier .club-posters img.club-poster-gardening{order:1}.project-club-de-quartier .club-posters img.club-poster-sewing{order:2}.project-club-de-quartier .club-posters img.club-poster-reading{order:3}
 .project-club-de-quartier .club-motion-video{order:4;width:48%;margin:125px auto 145px}
 .project-club-de-quartier .club-hero{order:5;width:100%;height:auto;object-fit:contain}
 .project-club-de-quartier .club-photo-pair{order:6;display:flex;flex-direction:column-reverse;padding:0;gap:12px}
 .project-club-de-quartier .club-photo-pair img{width:100%;height:auto;aspect-ratio:auto;object-fit:contain}
 .project-club-de-quartier .club-play-scene .scene-piece{transform:none!important}
 .project-club-de-quartier .scene-piece.scene-ribbon,.project-club-de-quartier .scene-piece.scene-watering-can,.project-club-de-quartier .scene-piece.scene-radishes{display:none}
 .project-club-de-quartier .scene-piece.scene-clothes{left:var(--scene-x,2%)!important;width:75%!important}
 .project-club-de-quartier .scene-piece.scene-purple-flower{display:none}
 /* Chandails : composition verticale puis deux cadrages de la corde à linge. */
 .project-encore-encore-encore .merch-collage{order:1;margin:0 -13px;align-self:start;width:calc(100% + 26px);top:0}
 .project-encore-encore-encore .merch-rope{order:3;overflow:hidden}
 .project-encore-encore-encore .merch-rope img{width:100%;height:112vw!important;object-fit:cover!important;object-position:left}
 .project-encore-encore-encore .merch-mobile-photo{display:block;order:4;height:112vw;overflow:hidden}
 .project-encore-encore-encore .merch-mobile-photo img{width:235%;max-width:none;margin-left:-135%;height:auto}
 .project-encore-encore-encore .merch-drum{order:5}
 .project-encore-encore-encore .drum-toggle{width:100%;aspect-ratio:.92/1}
 .project-encore-encore-encore .merch-drum p{margin:32px 0 0;font-size:13px}
 /* À propos : portrait vertical, textes décalés et objets déplaçables. */
 .about-main{padding:0 13px;gap:0;margin:0}
 .about-lede{margin:0;width:100%;font-size:17px;line-height:1;letter-spacing:-.6px}
 .about-lede span{padding-left:0}
 .about-lede .about-lede-first{max-width:80px}
 .portrait{width:64%;margin:62px auto 90px;transform:none}
 .about-text,.about-bag h2{font-size:17px;line-height:1.05;letter-spacing:-.7px}
 .about-city{align-self:flex-end;margin:0 0 74px;text-align:right}
 .about-studies{width:46%;max-width:none;margin:0 0 46px}
 .about-work{width:48%;max-width:none;margin:0 0 88px}
 .about-work br,.about-stories br{display:none}
 .about-stories{align-self:flex-end;width:47%;max-width:none;margin:0 0 90px;text-align:right}
 .about-bag{order:6;width:100%;height:133vw;margin:0}
 .bag-items{width:100%;height:127vw;max-width:none;margin:53px 0 0}
 .bag-items .cartes{width:29%;left:12%;top:3%;transform:rotate(-6deg)}
 .bag-items .mots-croises{width:56%;left:42%;top:16%;transform:rotate(5deg)}
 .bag-items .crayon{width:3.7%;left:68%;top:-2%;transform:rotate(-30deg)}
 .bag-items .harmonica{width:46%;left:13%;top:29%;transform:rotate(5deg)}
 .bag-items .appareil-photo{width:47%;left:5%;top:53%;transform:rotate(7deg)}
 .bag-items .sachets{width:29%;left:63%;top:74%;transform:rotate(6deg)}
 .about-contact{order:7;margin:34px 0 0;width:100%;font-size:17px}
 .about .site-footer{margin:0;padding-top:44px!important}
 .lightbox{background:rgba(0,0,0,.5)}
 .lightbox-close{top:12px;right:10px}
}

/* Mobile project photographs share the reference portrait frame (15:16). */
@media(max-width:700px){
 .project main{--project-image-height:calc((100vw - 26px) * 16 / 15)}
 .project .gallery img:not(.merch-shirt img):not(.scene-piece img):not(.encore-hero img):not(.ssm-grid img):not(.encore-grid img):not(.club-posters img):not(.drum-mockup):not(.acause-brand-composition img):not(.gallery-inset img):not(.merch-mobile-photo img):not(.merch-rope img):not(.acause-lightbox img):not(.club-hero):not(.club-photo-pair img){width:100%!important;height:var(--project-image-height)!important;aspect-ratio:15/16!important;object-fit:cover!important;object-position:center;max-width:none;margin:0}
 .project .gallery-inset{padding:0}
 .project .ssm-panel,.project .ssm-desktop{height:var(--project-image-height);min-height:0;aspect-ratio:15/16;padding:0;margin:0;overflow:hidden}
 .project .ssm-desktop img{border-radius:0}
 .project .merch-rope,.project .merch-mobile-photo{height:var(--project-image-height)}
 .project .merch-mobile-photo img{object-position:right}
 .project .drum-toggle{height:var(--project-image-height);aspect-ratio:15/16}
 .project .encore-grid-section{padding:0;background:transparent}
 .project .encore-grid{display:flex;flex-direction:column;gap:12px}
 .project .encore-grid button{width:100%;margin:0;padding:0}
}

@media(max-width:700px){
 .project-studio-sauve-morissette .ssm-panel,.project-studio-sauve-morissette .ssm-desktop{height:calc((100vw - 26px) * 4 / 3);aspect-ratio:3/4;min-height:0;display:flex;align-items:center;justify-content:center;background:#121212}
 .project-studio-sauve-morissette .ssm-grid img{height:auto;aspect-ratio:auto;object-fit:contain;max-height:90%;margin:0}
 .project-studio-sauve-morissette .ssm-desktop img{width:92%;border-radius:12px}
}

/* Logos kept as separate vector assets over the supplied paper texture. */
.acause-brand-composition{position:relative;width:100%;aspect-ratio:15/16;overflow:hidden}
.acause-brand-composition .acause-paper{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.acause-logo-grid{position:absolute;inset:7% 4%;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:5% 7%;align-items:center;justify-items:center}
.acause-logo-grid img{width:100%;height:100%;min-width:0;min-height:0;max-width:100%;max-height:100%;object-fit:contain}
.acause-brand-desktop{display:none}
@media(min-width:701px){
 .acause-brand-composition{aspect-ratio:auto}
 .acause-brand-composition .acause-paper,.acause-brand-composition .acause-logo-grid{display:none}
 .acause-brand-composition .acause-brand-desktop{display:block;width:100%;height:auto}
 .project-acause-studio .gallery-row > img[src$="MOCKUP%20POSTER%2002.webp"]{object-position:center bottom}
}
@media(max-width:700px){
 .project .gallery .acause-brand-composition img{width:100%!important;height:100%!important;aspect-ratio:auto!important;object-fit:contain!important}
 .project .gallery .acause-brand-composition .acause-paper{object-fit:cover!important}
 .project-acause-studio .gallery-inset{height:var(--project-image-height);display:flex;align-items:center;justify-content:center}
 .project .gallery .gallery-inset img{width:100%!important;height:auto!important;aspect-ratio:auto!important;object-fit:contain!important}
 .project-acause-studio .acause-lightbox img{object-position:50% center!important}
 .project-acause-studio .acause-mobile-poster img{object-position:center 65%!important}
 .project-studio-sauve-morissette .ssm-screen .motion-video{width:100%;height:100%;object-fit:contain}
 .project-studio-sauve-morissette .ssm-papers img{width:100%;max-height:100%}
 .project-studio-sauve-morissette .ssm-cards img{width:100%;max-height:100%}
 .project-studio-sauve-morissette .ssm-brandmark img{width:64%}
}

@media(max-width:700px){
 .project-encore-encore .encore-grid-section{padding:76px 16px 84px;background:#000}
 .project-encore-encore .encore-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
 .project-encore-encore .encore-grid button{width:100%;padding:0}
 .project-encore-encore .encore-grid img{width:100%;height:auto;aspect-ratio:auto;object-fit:contain}
 .project-encore-encore .encore-instruction{font-size:16px;letter-spacing:-.7px;text-align:left;line-height:1.15}
 .project-club-de-quartier .club-posters{width:84%;margin:0 auto;gap:50px}
 .project-club-de-quartier .club-posters img{width:100%;height:auto;aspect-ratio:auto;object-fit:contain}
 .project .gallery .club-hero,.project .gallery .club-photo-pair img{height:calc((100vw - 26px) * 1.47)!important;aspect-ratio:1/1.47!important;object-fit:cover!important}
 .project-club-de-quartier .club-motion-video{width:175%;max-width:none;margin:155px -37.5% 165px;clip-path:inset(0 21.43%)}
}

@media(max-width:700px){
 .project-encore-encore-encore .merch-collage{height:calc(170vw - 16px)}
 .project-encore-encore-encore .merch-shirt{width:65%}
 .project-encore-encore-encore .merch-shirt-pleure{left:6.5%;top:2.7vw;--shirt-angle:-7deg;z-index:1}
 .project-encore-encore-encore .merch-shirt-encore{left:32.5%;top:calc(24.4vw - 20px);--shirt-angle:3deg;z-index:2}
 .project-encore-encore-encore .merch-shirt-gab{left:4%;top:calc(55.7vw - 30px);--shirt-angle:0deg;z-index:3}
 .project-encore-encore-encore .merch-shirt-etoile{left:32.5%;top:calc(83.8vw - 40px);--shirt-angle:-6deg;z-index:4}
 .project-encore-encore-encore .merch-shirt-rond{left:14%;top:calc(121.4vw - 60px);--shirt-angle:5deg;z-index:5}
 .project-encore-encore-encore .merch-mobile-photo{position:relative}
 .project .gallery .merch-mobile-photo img{position:absolute;width:250%!important;height:auto!important;aspect-ratio:auto!important;left:-140%;top:-16%;margin:0!important;object-fit:contain!important}
 .project-encore-encore-encore .merch-drum{padding:0}
 .project-encore-encore-encore .drum-mockup{width:75%;height:auto;object-fit:contain;transform: translate(0px, 15px)}
 .project-encore-encore-encore .merch-drum p{margin-top:24px}
}

@media(max-width:700px){
 .project-club-de-quartier .scene-piece.scene-books{left:var(--scene-x,-7%)!important}
 .project-club-de-quartier .scene-piece.scene-tomato{width:23%!important}
 .project-club-de-quartier .scene-piece.scene-sewing-tool{left:var(--scene-x,72%)!important;width:29%!important}
 .project-club-de-quartier .scene-piece.scene-clothes{transform:rotate(12deg)!important}
 .project-club-de-quartier .scene-piece.scene-stacked-pots{width:62%!important}
 .project-club-de-quartier .scene-piece.scene-pink-pot{left:var(--scene-x,62%)!important;transform:rotate(15deg)!important}
}

@media(max-width:700px){
 .project .gallery .merch-rope img{width:100%;height:var(--project-image-height)!important;object-fit:cover!important;object-position:left!important;transform:translateX(-41px) scale(1.14);transform-origin:left center}
 .project-club-de-quartier .scene-piece.scene-scissors{transform:rotate(-110deg)!important}
}

@media(max-width:700px){.project-encore-encore-encore .drum-photo{transform:scale(1.15)}}

@media(max-width:700px){
 .project-studio-sauve-morissette .ssm-screen .motion-video{width:107%;height:107%;max-width:none}
 .project-studio-sauve-morissette .ssm-papers img,.project-studio-sauve-morissette .ssm-cards img{width:107%;max-width:none;max-height:none}
 .project-encore-encore .encore-hero{margin-top:0;align-self:start}
}

/* Second reference pass: align the Club objects in the mobile scene. */
@media(max-width:700px){
 .project-club-de-quartier .club-play-scene{margin-top:0;align-self:start}
 .project-club-de-quartier .scene-piece.scene-tomatoes{left:var(--scene-x,calc(64% - 5px))!important;top:var(--scene-y,26%)!important;width:40%!important}
 .project-club-de-quartier .scene-piece.scene-scissors{left:var(--scene-x,35%)!important;top:var(--scene-y,33.3%)!important;width:34%!important}
 .project-club-de-quartier .scene-piece.scene-books{top:var(--scene-y,27.5%)!important;width:56%!important}
 .project-club-de-quartier .scene-piece.scene-tomato{left:var(--scene-x,48%)!important;top:var(--scene-y,43.5%)!important;transform:rotate(30deg)!important}
 .project-club-de-quartier .scene-piece.scene-clothes{top:var(--scene-y,3%)!important}
 .project-club-de-quartier .scene-piece.scene-sewing-tool{top:var(--scene-y,11%)!important;transform:rotate(275deg)!important}
 .project-club-de-quartier .scene-piece.scene-blue-flower{left:var(--scene-x,40.25%)!important;top:var(--scene-y,calc(64.7% + 13px))!important;width:26.5%!important}
 .project-club-de-quartier .scene-piece.scene-stacked-pots{left:var(--scene-x,calc(51.5% - 5px))!important;top:var(--scene-y,64%)!important}
 .project-club-de-quartier .scene-piece.scene-red-flower{left:var(--scene-x,-1%)!important;top:var(--scene-y,57%)!important;width:42%!important}
 .project-club-de-quartier .scene-piece.scene-yellow-book{left:var(--scene-x,calc(37.5% - 5px))!important;top:var(--scene-y,calc(77.7% + 11px))!important;width:32%!important;transform:rotate(7deg)!important}
 .project-club-de-quartier .scene-piece.scene-pink-book{left:var(--scene-x,calc(32.75% - 5px))!important;top:var(--scene-y,calc(82% + 7px))!important;width:38.5%!important}
 .project-club-de-quartier .scene-piece.scene-pink-pot{top:var(--scene-y,3%)!important;width:12.5%!important}
}

@media(max-width:700px){
 .project-acause-studio .acause-lightbox{display:flex;align-items:center;justify-content:center;height:var(--project-image-height);overflow:hidden;background:#121212}
 .project.project-acause-studio .gallery .acause-lightbox img{flex:none;width:100%;height:100%;max-width:none;aspect-ratio:auto;object-fit:cover}
}

@media(min-width:701px){
 .project-club-de-quartier .scene-tomatoes{left:var(--scene-x,35.9%)!important}
 .project-club-de-quartier .scene-books{top:var(--scene-y,calc(17% - 1.5px))!important}
}
.lightbox-frame{display:contents}
@media(max-width:700px){
 .project-encore-encore .lightbox-close img{width:24px;height:24px}
}

@media(max-width:700px){
 .projects-grid .project-card .cover.cover-merch{object-position:39% center}
}

/* Use the homepage subtitle weight on project service labels. */
.project .intro-services{font-weight:400}
@media(max-width:700px){
 .project .intro-services{font-weight:500}
 body{--mobile-text-size:4.375vw}
 .project .intro-description p,.about .about-text,.project .project-website,.project .scene-instruction,.project .encore-instruction,.project .merch-drum p{font-size:var(--mobile-text-size)!important}
}

@media(max-width:700px){
 .project-club-de-quartier .club-play-scene .scene-piece{pointer-events:none;touch-action:auto;cursor:default}
}

@media(min-width:701px){
 .project-studio-sauve-morissette .site-footer{padding-top:46px}
 .project-acause-studio .acause-lightbox{display:block;overflow:hidden;background:#121212}
 .project-acause-studio .acause-lightbox img{width:calc(100% + 1px);max-width:none;margin-bottom:-1px}
 .home .archive{height:242vw}
 .home .collage-ssm{top:65.5vw}
 .home .collage-encore{top:106.5vw}
 .home .collage-club{top:calc(147vw + 24px)}
 .home .collage-shirts{top:calc(189.5vw + 32px)}
 .home .collage-ssm .collage-caption{transform:translate(16px,30px)}
 .home .collage-shirts .collage-caption{bottom:-64px}
}

/* About is a single desktop canvas; all positions use that canvas width. */
@media(min-width:701px){
 .about .site-scroll{padding-top:0;overflow-y:hidden}
 .about .site-scroll-content{height:100dvh;min-height:0;display:flex;flex-direction:column}
 .about .about-main{container-type:inline-size;flex:1;min-height:0;height:auto;width:min(100%,1600px,calc((100dvh - 66px)*1.98));max-width:none;margin:0 auto;padding:0}
 .about .about-lede,.about .about-text,.about .about-bag h2{font-size:max(15px,1.171875cqw)}
 .about .about-lede{top:25px}
 .about .about-lede span{padding-left:max(24px,1.875cqw)}
 .about .about-lede .about-lede-first{padding-left:0}
 .about .portrait{top:15.9cqw}
 .about .about-main{--about-grid-gap:15px;--about-grid-column:calc((100% - 7 * var(--about-grid-gap)) / 6)}
 .about .about-city,.about .about-studies,.about .about-stories{left:calc(3 * var(--about-grid-gap) + 2 * var(--about-grid-column));width:var(--about-grid-column)}
 .about .about-work{left:calc(4 * var(--about-grid-gap) + 3 * var(--about-grid-column));width:var(--about-grid-column)}
 .about .about-city br,.about .about-studies br,.about .about-work br,.about .about-stories br{display:none}
 .about .about-city{top:14.9cqw}
 .about .about-studies{top:22.2cqw}
 .about .about-work{top:30.6cqw}
 .about .about-stories,.about .about-contact{top:45.3cqw}
 .about .about-bag{top:10.7cqw;height:28cqw}
 .about .bag-items{height:31cqw;margin-top:1.4cqw}
 .about .bag-items .cartes{top:.1cqw}
 .about .bag-items .mots-croises{top:3.1cqw}
 .about .bag-items .crayon{top:-3.8cqw}
 .about .bag-items .harmonica{top:9.6cqw}
 .about .bag-items .sachets{top:20.2cqw}
 .about .bag-items .appareil-photo{top:19.2cqw}
 .about .site-footer{flex:none;padding-top:26px;padding-bottom:14px}
}

/* CMS visibility flags retain the original gallery containers and slot references. */
.cms-media-hidden{display:none!important}

.cms-added-media{width:100%;min-width:0}.cms-added-media.cms-added-half{width:calc(50% - 7.5px)}
@media(max-width:700px){.cms-added-media.cms-added-half{width:100%}.project-acause-studio .gallery>.cms-native-mobile-opening{order:1;width:118vw;max-width:none;margin:0 calc(-13px - 9vw);height:calc(118vw * 16 / 9);aspect-ratio:9/16;object-fit:cover;align-self:start;clip-path:inset(0 7.628%)}}

/* A wrapper containing only hidden media must not reserve height or grid gaps. */
.cms-empty-media-container{display:none!important}

@media(min-width:701px){.project .gallery .gallery-row>.cms-reference-full{grid-column:1/-1!important;width:100%!important;max-width:100%!important;flex-basis:100%!important}.project .gallery .gallery-row>.cms-reference-half{grid-column:auto!important}.project .gallery>picture.cms-reference-full{width:100%!important;display:block}.project .gallery>img.cms-reference-full{width:100%!important;max-width:100%!important}}

[data-cms-lightbox="true"]{cursor:zoom-in}.cms-media-lightbox{width:min(1200px,94vw);max-height:94dvh;padding:40px 16px 16px;overflow:auto}.cms-media-lightbox>button{position:absolute;right:10px;top:6px;font-size:24px;background:transparent;border:0;cursor:pointer}.cms-media-lightbox>.cms-lightbox-content{display:block;width:100%!important;max-width:100%!important;height:auto;max-height:80dvh;object-fit:contain;clip-path:none!important;margin:0!important}

.cms-media-lightbox{background:transparent!important;box-shadow:none;border:0}.cms-media-lightbox::backdrop{background:rgba(0,0,0,.94)}.cms-media-lightbox>button{color:#fff}.cms-media-lightbox>.cms-lightbox-content{background-color:transparent}
@media(max-width:700px){.cms-media-lightbox::backdrop{background:rgba(0,0,0,.5)}.cms-media-lightbox{width:100vw;max-width:100vw;padding:50px 13px;max-height:100dvh}.cms-media-lightbox>img.cms-lightbox-content{max-height:none!important;height:auto}}

/* All media use the Encore Encore lightbox interaction and framing. */
@media(max-width:700px){
 .lightbox{padding:50px 13px;overflow-y:auto}
 .lightbox-frame{display:block;position:relative;width:100%;flex:none;margin:auto}
 .lightbox-image{width:100%;max-width:none;max-height:none;height:auto}
 .lightbox-close{display:none}
}

/* Desktop standalone full-width photographs share the reference frame, independent of viewport height. */
@media(min-width:701px){
 .project .gallery img[data-cms-full-width-frame="true"]{
  height:auto!important;min-height:0!important;aspect-ratio:1.69!important;object-fit:cover!important;
 }
}

/* Optional introduction link follows the SSM title placement. */
.project .intro-heading .project-website{display:block;overflow-wrap:anywhere}
@media(max-width:700px){
 .project .intro-heading{display:flex;align-items:baseline;justify-content:space-between;gap:15px}
 .project .intro-heading h1{min-width:0}
 .project .intro-heading .project-website{position:static;margin:0;max-width:50%;text-align:right;flex-shrink:0}
}

.intro-link-mobile-description{display:none}
@media(max-width:700px){
 .project .intro-heading .intro-link-desktop{display:none}
 .project .project-intro>.intro-link-mobile-description{display:block;position:static;text-align:left;max-width:none;margin:var(--mobile-services-description-gap) 0 0}
}

/* Imported shirt compositions retain their authored frames and overflow. */
[data-cms-merch-slot]>.cms-composition-object{pointer-events:auto}
.project .gallery .merch-rope img[data-cms-merch-cropped="true"],
.project .gallery .merch-mobile-photo img[data-cms-merch-cropped="true"]{position:static!important;left:auto!important;top:auto!important;width:100%!important;height:100%!important;margin:0!important;transform:none!important;object-fit:cover!important;object-position:center!important}

@media(min-width:701px){
 .project.cms-photo-footer-overlay main{padding-bottom:0!important;margin-bottom:0!important}
 .project.cms-photo-footer-overlay .site-footer{position:absolute!important;left:0;bottom:0;width:100%;z-index:2;background:transparent!important;box-shadow:none}
}

@media(min-width:701px){.project.cms-photo-footer-overlay .gallery,.project.cms-photo-footer-overlay .cms-terminal-photo{padding-bottom:0!important;margin-bottom:0!important}}

@media(max-width:700px){
 .project [data-cms-mobile-frame="true"]{margin-bottom:3px!important}
 .project .cms-after-mobile-composition{margin-top:0!important}
 .project .cms-last-mobile-composition{margin-bottom:15px!important}
 .project.cms-mobile-composition-hero main{grid-template-rows:auto auto!important}
}

/* Explicit mobile presets apply to frames, independently of the desktop grid. */
@media(max-width:700px){
 .project [data-cms-mobile-format]{height:var(--cms-mobile-height)!important;min-height:0!important;max-height:none!important;aspect-ratio:var(--cms-mobile-ratio)!important;overflow:hidden}
 .project img[data-cms-mobile-format],.project video[data-cms-mobile-format]{object-fit:cover!important}
 .project .gallery>.cms-native-mobile-opening[data-cms-mobile-format]{width:100%;max-width:100%;margin:0;clip-path:none}
 .project picture[data-cms-mobile-format]>img,.project .acause-lightbox[data-cms-mobile-format]>img,.project .gallery-inset[data-cms-mobile-format]>img{width:100%!important;height:100%!important;aspect-ratio:auto!important;object-fit:cover!important;margin:0}
 .project .ssm-panel[data-cms-mobile-format]>img,.project .ssm-panel[data-cms-mobile-format]>video,.project .ssm-desktop[data-cms-mobile-format]>img{max-width:100%;max-height:100%;object-fit:contain!important}
 .project .merch-rope[data-cms-mobile-format]>img,.project .merch-mobile-photo[data-cms-mobile-format]>img{height:100%!important}
 .project-encore-encore .encore-grid-section[data-cms-media-id]{padding:0;min-height:0}
}

@media(max-width:700px){
 .project .gallery [data-cms-mobile-format="hero"]{width:100vw!important;max-width:none!important;margin-left:-13px!important;margin-right:-13px!important;align-self:start;object-fit:cover!important}
}

.cms-video-crop-frame{position:relative;overflow:hidden}

@media(min-width:701px){
 .cms-managed-empty{display:none!important}
 .project .gallery>.cms-managed-row{display:grid;grid-template-columns:repeat(var(--cms-columns),minmax(0,1fr));gap:15px;padding:0 15px;margin:15px 0 0;width:100%}
 .cms-managed-row[data-columns="1"]{--cms-columns:1}
 .cms-managed-row[data-columns="2"]{--cms-columns:2}
 .project .gallery>.cms-managed-row[data-horizontal="false"]{margin-top:0!important}
 .project .gallery>.cms-managed-row[data-horizontal="true"]{margin-top:15px!important}
 .project .gallery>.cms-managed-row[data-horizontal="false"]+*:not(.cms-managed-row){margin-top:0!important}
 .project .gallery>.cms-managed-row[data-horizontal="true"]+*:not(.cms-managed-row){margin-top:15px!important}
 .project .gallery>.cms-managed-row[data-vertical="false"]{padding-left:0;padding-right:0;column-gap:0}
 .project .gallery .cms-managed-cell{position:relative!important;display:block;width:100%!important;max-width:100%!important;margin:0!important;padding:0!important;height:auto!important;min-height:0!important;aspect-ratio:var(--cms-managed-ratio)!important;overflow:hidden;grid-column:auto!important}
 .project .gallery img.cms-managed-cell,.project .gallery video.cms-managed-cell{object-fit:cover}
 .project .gallery img.cms-format-cell,.project .gallery video.cms-format-cell{object-fit:cover!important;transform:none!important}
 .project .gallery picture.cms-managed-cell>img,.project .gallery .cms-format-cell>img,.project .gallery .cms-format-cell>video:not(.cms-cropped-video){width:100%!important;height:100%!important;max-width:none!important;object-fit:cover!important;aspect-ratio:auto!important;margin:0!important}
 .project .gallery>.cms-managed-row[data-last="true"]{margin-bottom:0!important;padding-bottom:0!important}
}

/* A terminal half-width row keeps its lower gutter. */
@media(min-width:701px){.project .gallery>.cms-managed-row[data-last="true"][data-columns="2"][data-horizontal="true"]{padding-bottom:15px!important}}
.cms-page-bottom-space{flex:none;clear:both}

@media(max-width:700px){.project.cms-standard-project .gallery>[data-cms-mobile-opening="true"]{order:1!important}.project.cms-standard-project main{grid-template-rows:auto auto}}

@media(max-width:700px){
 .project.cms-standard-project{--mobile-intro-gap:50px}
 /* The grid already contributes 12px between the hero and the introduction. */
 .project.cms-standard-project .project-intro{margin-top:calc(var(--mobile-intro-gap) - 12px + var(--mobile-intro-offset,0px))}
}

@media(max-width:700px){.project.cms-explicit-mobile-hero main{grid-template-rows:auto auto!important}.project.cms-explicit-mobile-hero .gallery>[data-cms-mobile-opening="true"]{order:1!important}.project.cms-explicit-mobile-hero .gallery>:not([data-cms-mobile-opening="true"]){order:3!important}}

@media(max-width:700px){
 .project.cms-explicit-mobile-hero{--mobile-intro-gap:50px}
 .project.cms-explicit-mobile-hero .project-intro{margin-top:calc(var(--mobile-intro-gap) - 12px + var(--mobile-intro-offset,0px))!important}
}

/* Newly added home objects inherit the same hover motion as the original collages. */
@media(prefers-reduced-motion:no-preference){
 .home .collage-art img{--hover-x:-4px;--hover-y:-5px;--hover-angle:-2deg}
 .home .collage-art img:not([class*="art-object-"]):nth-child(5n+2){--hover-x:4px;--hover-y:-3px;--hover-angle:2deg}
 .home .collage-art img:not([class*="art-object-"]):nth-child(5n+3){--hover-x:-3px;--hover-y:4px;--hover-angle:1.5deg}
 .home .collage-art img:not([class*="art-object-"]):nth-child(5n+4){--hover-x:5px;--hover-y:2px;--hover-angle:-2deg}
 .home .collage-art img:not([class*="art-object-"]):nth-child(5n+5){--hover-x:-2px;--hover-y:4px;--hover-angle:2.5deg}
}

/* Déplacement des illustrations identique aux objets de la page À propos. */
.scene-piece{translate:var(--drag-x,0) var(--drag-y,0)}
.scene-piece img{-webkit-user-drag:none}
@media(max-width:700px){.scene-piece{translate:none}}

/* Le curseur reste devant les objets même après leur passage au premier plan. */
body.has-pointer .cursor-dot:not(.cursor-dot-front){z-index:2147483646!important}

/* Maintient le masquage pendant la capture du pointeur et les états actifs. */
@media(hover:hover) and (pointer:fine){
 html:not([data-cms-preview]),
 html:not([data-cms-preview]) body,
 html:not([data-cms-preview]) body * ,
 html:not([data-cms-preview]) body *::before,
 html:not([data-cms-preview]) body *::after{cursor:none!important}
 html:not([data-cms-preview]) img,
 html:not([data-cms-preview]) a{-webkit-user-drag:none}
}

@media(min-width:701px){
 .about .about-lede{left:var(--about-introduction-left,calc(var(--gutter) + 155px))}
}

/* Mélange permanent, y compris au-dessus des liens et pendant le drag. */
@media(hover:hover) and (pointer:fine){
 html:not([data-cms-preview]) body.has-pointer .cursor-dot:not(.cursor-dot-front){
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  mix-blend-mode:difference!important;
  isolation:auto!important
 }
 html:not([data-cms-preview]) body .cursor-dot-front{display:none!important}
}

/* Sur mobile le menu est display:contents : le mélange porte sur ses liens. */
html body .site-header .menu,
html body .site-header .menu-toggle{mix-blend-mode:difference!important}
html body .site-header .menu a,
html body .site-header .menu a:visited,
html body .site-header .menu a:hover{
 color:var(--paper)!important;
 -webkit-text-fill-color:var(--paper)!important;
 opacity:1
}
@media(min-width:701px) and (hover:hover) and (pointer:fine){
 html body.home .site-header .menu a:hover{
  color:#777!important;
  -webkit-text-fill-color:#777!important
 }
}
html body .site-header .menu-toggle img{filter:invert(1)!important}
@media(max-width:700px){
 html body .site-header .menu a{mix-blend-mode:difference!important}
}

/* Le fond du hero SSM reste strictement dans la hauteur mobile commune. */
@media(max-width:700px){
 .project-studio-sauve-morissette{--mobile-hero-height:calc(170vw + 85px)}
 .project-studio-sauve-morissette .gallery>[data-cms-mobile-opening="true"]{
  height:var(--mobile-hero-height)!important;
  min-height:0!important;
  max-height:var(--mobile-hero-height)!important;
  background-color:#131313!important;
  isolation:isolate;
  box-sizing:border-box!important;
  overflow:hidden!important
 }
 .project-studio-sauve-morissette .gallery>[data-cms-mobile-opening="true"]>video{
  background-color:#131313!important;
  max-height:100%!important;
  object-fit:contain!important;
  mix-blend-mode:lighten;
  -webkit-mask-image:linear-gradient(to bottom,transparent,#000 24px,#000 calc(100% - 24px),transparent);
  mask-image:linear-gradient(to bottom,transparent,#000 24px,#000 calc(100% - 24px),transparent)
 }
}

/* Les bords de la vidéo sont couverts par un calque opaque indépendant. */
.ssm-hero-video-window{position:relative;flex:none;overflow:hidden;background:#131313;isolation:isolate}
.ssm-hero-video-window::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(to top,#131313 0 8px,transparent 64px),linear-gradient(to bottom,#131313 0 4px,transparent 24px),linear-gradient(to right,#131313 0 4px,transparent 16px),linear-gradient(to left,#131313 0 4px,transparent 16px)}