@font-face{font-family:'Playfair Display';font-weight:700;font-style:normal;font-display:swap;src:url(/fonts/playfair-700.woff2) format('woff2')}
@font-face{font-family:'Wix Madefor Text';font-weight:400;font-style:normal;font-display:swap;src:url(/fonts/madefor-400.woff2) format('woff2')}
:root{--cream:#f6f2ec;--ink:#141414;--bronze:#7f6945;--muted:#636260;--serif:'Playfair Display',Georgia,serif;--sans:'Wix Madefor Text',system-ui,sans-serif;--ease:cubic-bezier(.23,1,.32,1)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--ink);font-family:var(--sans);font-size:15.8px;line-height:1.5;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,h5,h6{font-family:var(--serif);font-weight:700;margin:0;line-height:1.1}
p{margin:0}
img{display:block;max-width:100%}
a{color:inherit}
.skip{position:absolute;left:-999px;top:8px;background:var(--ink);color:var(--cream);padding:8px 14px;z-index:20}
.skip:focus{left:8px}
:focus-visible{outline:2px solid var(--bronze);outline-offset:3px}

/* En-tête */
.hd{height:64px;display:flex;align-items:center;gap:27px;padding:0 30px;background:var(--cream);position:relative;z-index:10}
.logo{font-family:var(--serif);font-weight:700;font-size:19.77px;letter-spacing:.15em;text-transform:uppercase;text-decoration:none;width:130px;line-height:1.05;flex:none}
.nav{display:flex;gap:27px;flex:1}
.nav a{font-size:13.84px;letter-spacing:.15em;text-transform:uppercase;text-decoration:none;padding:4px 0;background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;transition:background-size .3s var(--ease)}
.nav a:hover,.nav a[aria-current]{background-size:100% 1px}
.lang{display:flex;align-items:center;gap:8px;font-size:12px;margin-left:auto}
.burger{display:none;background:none;border:0;padding:10px;cursor:pointer}
.burger span{display:block;width:24px;height:2px;background:var(--ink);margin:5px 0}

/* Boutons */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 26px;border:.8px solid var(--ink);font-size:15.8px;text-decoration:none;cursor:pointer;font-family:var(--sans);transition:transform .16s var(--ease),background-color .2s,color .2s}
.btn:active{transform:scale(.97)}
.btn-fill{background:var(--bronze);color:var(--cream)}
.btn-fill:hover{background:#6a573a}
.btn-light{background:var(--cream);color:var(--ink);border-color:var(--bronze)}
.btn-light:hover{background:#fff}
.wide{width:100%;min-height:41px;border-color:var(--bronze)}

/* Hero */
.hero{position:relative;height:calc(100vh - 64px);min-height:520px;max-height:900px;color:#fff;display:grid;place-items:center;text-align:center;overflow:hidden}
.hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero::after{content:'';position:absolute;inset:0;background:rgba(0,0,0,.12)}
.hero-in{position:relative;z-index:2;padding:0 20px}
.kicker{font-size:13.84px;letter-spacing:.2em;text-transform:uppercase;margin-bottom:16px}
.hero h1{font-size:clamp(46px,6.3vw,91px);line-height:1.05}
.sub{font-size:17.8px;max-width:316px;margin:34px auto 0}
.btns{display:flex;gap:24px;justify-content:center;margin-top:44px;flex-wrap:wrap}
.hero .btn-fill{border-color:var(--ink)}

/* Intro */
.intro{display:grid;grid-template-columns:445px minmax(0,586px);gap:77px;justify-content:center;padding:79px 40px 80px;align-items:start}
.intro h2{font-size:clamp(38px,4.4vw,63px);line-height:1}
.intro-r{border-left:2px solid #d8d0c3;padding-left:0}
.intro-r p{font-size:17.8px;padding-left:0;margin-left:0}
.lnk,.more{color:var(--bronze);text-decoration:underline;text-underline-offset:4px;display:block;text-align:center;margin-top:34px}
.more{color:var(--ink);text-align:left;margin-top:34px;font-size:13.84px}
.lnk:hover,.more:hover{text-decoration-thickness:2px}

/* Grille d'accueil */
.grid2{display:grid;grid-template-columns:1fr 1fr;margin:0 40px}
.cell{aspect-ratio:1/1;overflow:hidden;position:relative;display:block}
.cell img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}
.cell:hover img{transform:scale(1.03)}
.cell.dark{background:var(--ink);color:var(--cream);display:grid;place-items:center;text-align:center;text-decoration:none;padding:40px 60px}
.cell.dark h3{font-size:clamp(28px,3.3vw,47.4px);line-height:1.1}
.banner{position:relative;height:clamp(360px,41vw,593px);overflow:hidden;margin-top:0}
.banner img{width:100%;height:100%;object-fit:cover}
.banner::after{content:'';position:absolute;inset:auto 0 0 0;height:30%;background:linear-gradient(transparent,rgba(0,0,0,.45))}
.banner p{position:absolute;left:40px;bottom:20px;color:#fff;font-size:17.8px;z-index:2}
.expo2{display:grid;grid-template-columns:496px 496px;gap:117px;justify-content:center;padding:138px 40px 120px}
.expo2 h5{font-size:27.7px;line-height:1.1;margin-bottom:12px}
.expo2 p{font-size:15.8px;margin-bottom:12px}
.expo2 .sm{font-size:13.84px}
.expo2 a{color:var(--bronze)}
.cta{background:var(--ink);color:#fff;text-align:center;padding:60px 20px 56px}
.cta h4{font-size:clamp(24px,2.5vw,35.6px);margin:0 auto 38px;max-width:861px}
.cta .btn{border-color:var(--cream)}

/* Pied de page */
.ft{padding:60px 20px;text-align:center}
.ft p{max-width:887px;margin:0 auto;font-size:13.84px}

/* Œuvres */
.series-h{padding:99px 40px 0}
.up{font-size:15.8px;letter-spacing:.15em;text-transform:uppercase}
.serie{display:grid;grid-template-columns:560px 520px;gap:65px;justify-content:center;align-items:center;padding:60px 40px 0}
.serie.rev{direction:rtl}
.serie.rev>*{direction:ltr}
.serie:last-of-type{padding-bottom:100px}
.pic{overflow:hidden;aspect-ratio:4/3}
.pic img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}
.pic:hover img{transform:scale(1.03)}
.serie h4{font-size:35.6px;line-height:1.1}
.serie .txt p{font-size:13.84px;margin-top:18px}

/* Démarche */
.dem{display:grid;grid-template-columns:546px 546px;gap:57px;justify-content:center;padding:78px 40px 0;align-items:start}
.dem h2{font-size:clamp(38px,4.4vw,63px);line-height:1;margin-bottom:56px}
.dem-t p{font-size:17.8px}
.dem-i img{width:100%;aspect-ratio:546/507;object-fit:cover}
.quote{text-align:center;padding:200px 40px 160px;max-width:1094px;margin:0 auto}
.quote h2{font-size:clamp(38px,4.4vw,63px);line-height:1.1}
.quote p{font-size:17.8px;margin-top:20px;text-transform:uppercase;letter-spacing:.15em}

/* Colonne centrale : expositions, presse */
.col{max-width:887px;margin:0 auto;padding:104px 20px 0}
.col+.col{padding-top:100px}
.col:last-of-type{padding-bottom:110px}
.col h3{font-size:clamp(32px,3.3vw,47.4px)}
.col h2{font-size:clamp(38px,4.4vw,63px);line-height:1}
.col>p{margin-top:24px}
.col a{color:var(--bronze)}
.yr{margin-top:40px}
.yr:first-of-type{margin-top:50px}
.yr h5{font-size:27.7px;color:var(--bronze)}
.yr p{max-width:666px;margin-top:12px;font-size:15.8px}
.pp{font-size:17.8px;margin-top:60px!important;padding-top:0}
.pp:first-of-type{margin-top:60px!important}

/* Parcours */
.par-h{display:grid;grid-template-columns:384px 1fr;gap:37px;padding:81px 40px 0;max-width:1308px;margin:0 auto}
.par-h h4{font-size:35.6px}
.par-h p{max-width:766px}
.par{max-width:1308px;margin:0 auto;padding:100px 40px 0}
.par:last-of-type{padding-bottom:100px}
.par h2{font-size:clamp(38px,4.4vw,63px);line-height:1}
.pr{margin-top:40px;max-width:575px}
.pr:first-of-type{margin-top:60px}
.pr p{font-size:15.8px}
.pr .m{font-size:13.84px;color:var(--muted);margin-top:7px}
.lead{font-size:17.8px;margin-top:20px;max-width:595px}
.lead a{color:var(--bronze)}
.cmd{display:grid;grid-template-columns:1fr 1fr;gap:60px 76px;margin-top:80px;padding:0 19px}
.cmd p{font-family:var(--serif);font-weight:700;font-size:27.7px;line-height:1.1}

/* Contact */
.cta-l{text-align:center;padding:100px 20px 0;max-width:927px;margin:0 auto}
.cta-l h3{font-size:clamp(30px,3.3vw,47.4px);margin-bottom:40px}
.cta-l .btn{border-color:var(--ink)}
.cform{max-width:793px;margin:0 auto;padding:130px 20px 100px;position:relative}
.cform h2{font-size:clamp(38px,4.4vw,63px);text-align:center;line-height:1}
.cform>p{text-align:center;max-width:595px;margin:24px auto 40px}
form label{display:block;font-size:14px;margin-bottom:22px}
form label span{margin-left:2px}
form input,form textarea{display:block;width:100%;margin-top:7px;font:inherit;font-size:15px;background:transparent;border:0;border-bottom:1px solid var(--ink);padding:10px 0;color:var(--ink);border-radius:0}
form textarea{border:1px solid var(--ink);padding:10px;resize:vertical}
form input:focus,form textarea:focus{outline:none;border-color:var(--bronze);box-shadow:0 1px 0 var(--bronze)}
.r2{display:grid;grid-template-columns:1fr 1fr;gap:0 48px}
.msg{margin-top:16px;text-align:center;font-size:14px}
.loc{text-align:right;margin-top:60px;font-size:13.84px;text-transform:uppercase;letter-spacing:.1em}

/* Pages de séries */
.back{display:inline-block;font-family:var(--serif);font-weight:700;font-size:19.77px;text-decoration:none;margin-bottom:24px}
.back:hover{text-decoration:underline}
.s-head{max-width:1308px;margin:0 auto;padding:23px 40px 40px}
.s-head.l80{padding-left:80px}
.s-head.l182{padding-left:182px}
.s-head h1{font-size:clamp(46px,6.3vw,91px);line-height:.95;max-width:900px;margin-bottom:26px}
.s-head p{max-width:900px;font-size:15.8px}
.s-head .sm{font-size:13.84px;margin-bottom:14px}
.s-head .big,.s-blk .big{font-size:17.8px;margin-top:24px}
.s-blk{max-width:1308px;margin:0 auto;padding:40px 40px 20px}
.s-blk.l80{padding-left:80px}
.s-blk.narrow{max-width:1100px;padding-bottom:90px}
.s-blk h2{font-size:clamp(38px,4.4vw,63px);line-height:1;max-width:1100px}
.s-blk>p:not(.big){font-size:15.8px;margin-top:22px}
.s-blk .big{margin-top:0;max-width:900px}
.s-blk .big+.big{margin-top:0}
.gal{display:grid;gap:50px 50px;margin-top:40px}
.g4{grid-template-columns:repeat(4,250px);justify-content:start;margin-bottom:-14px}
.g4 img{width:250px;aspect-ratio:250/313;object-fit:cover}
.g4+.g4{margin-top:50px}
.g4+.big{margin-top:40px}
.g4n{grid-template-columns:repeat(4,1fr);gap:28px;margin-top:0}
.g4n img{width:100%;aspect-ratio:276/340;object-fit:cover}
.s-blk.full{max-width:1308px;padding:40px}
.s-blk h6{font-size:24px;text-align:center;margin:70px 0 50px}
.g3{grid-template-columns:repeat(3,1fr);gap:28px;margin-top:0}
.g3 img.short{aspect-ratio:378/251;object-fit:cover;width:100%}
.g3 img.tall{aspect-ratio:378/564;object-fit:cover;width:100%}
.gal img{transition:transform .9s var(--ease)}
.gal figure{overflow:hidden}
/* Installations */
.i-top{max-width:1308px;margin:0 auto;padding:23px 40px 0;text-align:center}
.i-top .back{display:block;text-align:left;padding-left:142px}
.i-top h1{font-size:clamp(46px,5vw,72px);margin-top:24px}
.i-top p{font-size:17.8px;margin:20px 0 40px}
.i-intro{max-width:1126px;margin:0 auto;padding:40px 20px 20px}
.i-intro h2{font-size:35.6px}
.i-intro .sm3{font-size:12px;margin:16px 0 28px}
.i-intro p:last-child{font-size:17.8px}
.i-gal{max-width:1308px;margin:0 auto;padding:40px}
.i-gal .gal{margin:0}
.cap{font-size:13.84px;font-weight:700;font-family:var(--serif);text-align:center;margin:60px 0 80px;color:#000}
.legend{font-size:13.84px;margin-top:30px}
.i-idx{max-width:1308px;margin:0 auto;padding:60px 40px 0}
.ix{display:grid;grid-template-columns:476px 1fr;gap:117px;align-items:start;text-decoration:none;margin-bottom:40px}
.ix img{width:100%;height:auto;object-fit:cover;transition:transform .9s var(--ease)}
.ix h2{font-size:35.6px;margin-top:0}
.ix:hover h2{text-decoration:underline;text-underline-offset:6px}
.det{display:flex;align-items:center;gap:60px;max-width:1308px;margin:0 auto;padding:60px 80px 0}
.det .dpic{flex:none;max-width:60%}
.det img{width:100%;height:auto}
.det h5{font-size:27.7px}
.det .sm2{font-size:13.84px;margin-top:14px;max-width:600px}
.det:last-of-type{padding-bottom:100px}
@media (hover:hover) and (pointer:fine){.gal img:hover,.ix:hover img{transform:scale(1.02)}}
.gal,.ix .ixp{overflow:visible}

/* Tablette et mobile */
@media (max-width:1100px){
.intro,.expo2,.dem,.serie{grid-template-columns:1fr;gap:40px}
.serie.rev{direction:ltr}
.par-h{grid-template-columns:1fr}
.ix{grid-template-columns:1fr;gap:20px}
.det{flex-direction:column;align-items:flex-start;gap:24px;padding:50px 40px 0}
.det .dpic{width:100%!important;max-width:100%}
.g4{grid-template-columns:repeat(2,1fr)}
.g4 img{width:100%}
.g4n{grid-template-columns:repeat(2,1fr)}
.s-head.l80,.s-blk.l80,.s-head.l182{padding-left:40px}
.i-top .back{padding-left:0}
.cmd{grid-template-columns:1fr;padding:0}
}
@media (max-width:860px){
.hd{padding:0 16px;gap:12px}
.logo{width:auto;font-size:17px}
.logo{max-width:110px}
.nav{display:none}
.lang{margin-left:auto}
.burger{display:block}
body.menu .nav{display:flex;position:absolute;top:64px;left:0;right:0;flex-direction:column;background:var(--cream);padding:12px 24px 24px;gap:18px;border-bottom:1px solid #ddd5c8}
.grid2{margin:0}
.cell.dark{padding:24px}
.intro{padding:50px 20px}
.expo2{padding:60px 20px}
.col,.par,.par-h,.cta-l,.cform{padding-left:20px;padding-right:20px}
.r2{grid-template-columns:1fr}
.g3{grid-template-columns:1fr}
.s-head,.s-blk,.s-blk.full,.i-gal,.i-idx,.i-top{padding-left:20px;padding-right:20px}
.s-head.l80,.s-blk.l80,.s-head.l182{padding-left:20px}
.series-h{padding:50px 20px 0}
.serie{padding:40px 20px 0}
.banner p{left:20px}
.btns .btn{width:100%}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* Comportement identique au site Wix : pas d'animation d'entrée ni de défilement.
   Seuls restent le soulignement du menu et un survol rapide des boutons. */
.hero{height:clamp(560px,67.5vw,1240px);max-height:none}
.hero>img{object-position:50% 0}
.hero-in{margin-top:0}
.cell img,.pic img,.gal img,.ix img{transition:none}
.cell:hover img,.pic:hover img{transform:none}
.btn{transition:background-color .08s linear,color .08s linear,border-color .08s linear}
.btn:active{transform:none}
.serie .more,.cell.dark h3::after{transition:none}
@media (hover:hover) and (pointer:fine){.gal img:hover,.ix:hover img{transform:none}}

/* Finitions esthétiques (organisation inchangée) */
/* Couleurs des peintures : léger renfort de saturation et de contraste */
.hero>img,.cell img,.banner img,.pic img,.dem-i img,.gal img,.ix img,.dpic img{filter:saturate(1.1) contrast(1.05) brightness(1.01);image-rendering:auto}
/* Bloc « Rester un homme debout » écarté des blocs du haut */
.banner{margin-top:48px}
/* Ouverture des peintures de l'accueil (une seule fois, au premier affichage) */
.js .open{overflow:hidden}
.js .open img{clip-path:inset(0 0 100% 0);transform:scale(1.1);transition:clip-path 1.3s cubic-bezier(.23,1,.32,1),transform 1.9s cubic-bezier(.23,1,.32,1)}
.js .open.in img{clip-path:inset(0);transform:none}
.js .grid2 .cell:nth-child(even) img{clip-path:inset(100% 0 0 0)}
.js .grid2 .cell.open.in:nth-child(even) img{clip-path:inset(0)}
/* Finitions typographiques et de survol */
body{text-rendering:optimizeLegibility;font-kerning:normal}
h1,h2,h3,h4,h5,h6{text-wrap:balance}
p{text-wrap:pretty}
::selection{background:var(--bronze);color:var(--cream)}
.btn-fill{box-shadow:0 1px 0 rgba(0,0,0,.06)}
.pic,.cell,.dem-i,.gal img,.dpic img,.ix img{box-shadow:none}
.hero::after{background:linear-gradient(180deg,rgba(0,0,0,.08),rgba(0,0,0,.2))}
.hero h1,.kicker,.sub{text-shadow:0 1px 18px rgba(0,0,0,.28)}
@media (prefers-reduced-motion:reduce){.open img{clip-path:none!important;transform:none!important}}

/* Démarche : l'image se fond dans le fond du site (le blanc devient la couleur du site) */
.dem-i img{mix-blend-mode:multiply;filter:none;object-fit:contain;aspect-ratio:auto;width:100%;height:auto}
.dem-i{background:var(--cream)}

/* Œuvres : séries plus grandes, qui occupent toute la largeur */
.series-h{padding:80px 40px 0}
.serie{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(40px,6vw,110px);justify-content:stretch;align-items:center;padding:56px 40px 0;max-width:1700px;margin:0 auto}
.serie.rev{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr)}
.pic{aspect-ratio:4/3;position:relative}
.serie h4{font-size:clamp(32px,3.2vw,52px);line-height:1.08;transition:color .35s var(--ease)}
.serie .txt p{font-size:clamp(15px,1.15vw,18px);line-height:1.65;margin-top:22px;max-width:560px}
.serie .more{display:inline-block;font-size:clamp(14px,1vw,16px);margin-top:30px;text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 100%/100% 1px no-repeat;padding-bottom:3px;transition:background-size .4s var(--ease),color .3s,letter-spacing .4s var(--ease)}
.serie .more:hover{background-size:0 1px;letter-spacing:.03em;color:var(--bronze);transition:background-size .4s var(--ease),color .3s,letter-spacing .4s var(--ease)}
/* Survols : zoom doux de la peinture dans son cadre, titre qui se colore, filet qui se dessine */
.pic img{transition:transform 1.1s var(--ease),filter .6s}
.serie:hover .pic img{transform:scale(1.045)}
.serie:hover h4{color:var(--bronze)}
.serie .txt{position:relative}
.serie .txt::before{content:'';display:block;width:0;height:1px;background:var(--bronze);margin-bottom:26px;transition:width .8s var(--ease)}
.serie:hover .txt::before{width:72px}
.serie:last-of-type{padding-bottom:120px}
@media (max-width:1100px){.serie,.serie.rev{grid-template-columns:1fr;padding:40px 20px 0}}

/* Survols du reste du site */
.cell img{transition:transform 1.1s var(--ease)}
.cell:hover img{transform:scale(1.035)}
.cell.dark{transition:background-color .5s}
.cell.dark:hover{background:#1f1d1a}
.cell.dark h3{transition:transform .6s var(--ease)}
.cell.dark:hover h3{transform:translateY(-4px)}
.cell.dark h3::after{content:'';display:block;margin:16px auto 0;width:0;height:1px;background:#b79d72;transition:width .7s var(--ease);position:static;transform:none}
.cell.dark:hover h3::after{width:56px}
.dem-i img{transition:transform 1.1s var(--ease)}
.dem-i:hover img{transform:scale(1.02)}
.btn{transition:background-color .25s,color .25s,transform .25s var(--ease),box-shadow .3s}
.btn:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(20,20,20,.14)}
.btn:active{transform:translateY(0)}
@media (hover:hover) and (pointer:fine){.gal img{transition:transform 1s var(--ease)}.gal img:hover{transform:scale(1.025)}.ix:hover img{transform:scale(1.02)}}
.yr h5,.pp,.pr p{transition:color .3s,transform .4s var(--ease)}
@media (hover:hover){.yr:hover h5{transform:translateX(6px)}.pp:hover{color:var(--bronze);transform:translateX(8px)}}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* ===== Mouvement : entrée du hero, apparitions, en-tête, visionneuse, halos ===== */
@view-transition{navigation:auto}
@keyframes elHeroImg{from{scale:1.14}to{scale:1.03}}
@keyframes elMonte{from{opacity:0;translate:0 26px}to{opacity:1;translate:0 0}}
@keyframes elTitre{from{opacity:0;translate:0 30px;letter-spacing:.09em;filter:blur(10px)}to{opacity:1;translate:0 0;letter-spacing:0;filter:blur(0)}}
@keyframes elDerive{from{scale:1.03}to{scale:1.08}}
.hero>img{animation:elHeroImg 2.8s var(--ease) both,elDerive 28s ease-in-out 2.8s infinite alternate;will-change:scale,translate}
.hero .kicker{animation:elMonte 1s var(--ease) .35s both}
.hero h1{animation:elTitre 1.5s var(--ease) .5s both}
.hero .sub{animation:elMonte 1s var(--ease) 1s both}
.hero .btns{animation:elMonte 1s var(--ease) 1.2s both}
.hero{background:var(--ink)}

/* En-tête fixe : se range en descendant, revient en remontant */
.hd{position:sticky;top:0;transition:translate .5s var(--ease),box-shadow .4s,background-color .4s}
.hd.sc{background:rgba(246,242,236,.92);-webkit-backdrop-filter:saturate(1.4) blur(10px);backdrop-filter:saturate(1.4) blur(10px);box-shadow:0 1px 0 rgba(20,20,20,.08),0 10px 30px -22px rgba(20,20,20,.5)}
.hd.range{translate:0 -100%}
.prog{position:fixed;inset:0 0 auto 0;height:2px;background:var(--bronze);transform-origin:0 50%;transform:scaleX(0);z-index:30;pointer-events:none}
.logo{transition:letter-spacing .5s var(--ease),color .3s}
@media (hover:hover){.logo:hover{letter-spacing:.2em;color:var(--bronze)}}

/* Apparitions : visibles par défaut, cachées seulement quand le script est actif */
.mvon .mv{opacity:0;translate:0 24px;transition:opacity 1s var(--ease) var(--dl,0ms),translate 1.1s var(--ease) var(--dl,0ms)}
.mvon .mv.vu{opacity:1;translate:0 0}
.mvon .mvi{opacity:0;scale:1.05;translate:0 18px;transition:opacity 1.1s var(--ease) var(--dl,0ms),scale 1.6s var(--ease) var(--dl,0ms),translate 1.2s var(--ease) var(--dl,0ms)}
.mvon .mvi.vu{opacity:1;scale:1;translate:0 0}
.mvon .pic.mvi,.mvon .dem-i.mvi,.mvon .dpic.mvi{overflow:hidden}

/* Boutons : reflet qui traverse au survol, léger relief */
.btn{position:relative;overflow:hidden;transition:background-color .25s var(--ease),color .25s,border-color .25s,translate .35s var(--ease),box-shadow .35s var(--ease)}
.btn::after{content:'';position:absolute;inset:0;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.28) 50%,transparent 65%);translate:-120% 0;transition:translate .8s var(--ease);pointer-events:none}
@media (hover:hover){.btn:hover::after{translate:120% 0}.btn-fill:hover{box-shadow:0 10px 24px -12px rgba(127,105,69,.9)}}

/* Blocs sombres : halo bronze qui suit le curseur, filet qui se dessine */
.cta,.cell.dark{position:relative;isolation:isolate;overflow:hidden}
.cta::before,.cell.dark::before{content:'';position:absolute;inset:0;z-index:-1;background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%),rgba(127,105,69,.38),transparent 70%);opacity:0;transition:opacity .6s var(--ease)}
.cta.lit::before,.cell.dark.lit::before{opacity:1}
.cell.dark h3{position:relative;transition:translate .6s var(--ease),color .4s}
.cell.dark h3::after{content:'';display:block;width:0;height:1px;background:var(--bronze);margin:18px auto 0;transition:width .7s var(--ease)}
@media (hover:hover){.cell.dark:hover h3{translate:0 -4px;color:#fff}.cell.dark:hover h3::after{width:64px}}

/* Visionneuse */
.zoomable{cursor:zoom-in}
.zoomable:focus-visible{outline:2px solid var(--bronze);outline-offset:4px}
.lb{position:fixed;inset:0;z-index:60;background:rgba(14,13,12,.94);display:grid;place-items:center;opacity:0;transition:opacity .28s var(--ease);padding:56px 64px}
.lb[hidden]{display:none}
.lb.on{opacity:1}
.lb img{max-width:100%;max-height:100%;object-fit:contain;scale:.96;transition:scale .5s var(--ease);filter:none;box-shadow:0 30px 80px -20px #000}
.lb.on img{scale:1}
.lb button{position:absolute;background:none;border:0;color:#fff;font:300 2.6rem/1 var(--sans);cursor:pointer;width:56px;height:56px;border-radius:50%;transition:background-color .25s,scale .25s var(--ease)}
.lb button:hover{background:rgba(255,255,255,.12)}.lb button:active{scale:.94}
.lb-x{top:10px;right:10px}.lb-p{left:6px;top:50%;translate:0 -50%}.lb-n{right:6px;top:50%;translate:0 -50%}
@media (max-width:700px){.lb{padding:56px 8px}.lb-p,.lb-n{top:auto;bottom:6px;translate:none}}

@media (prefers-reduced-motion:reduce){
  .hero>img,.hero .kicker,.hero h1,.hero .sub,.hero .btns{animation:none}
  .mvon .mv,.mvon .mvi{opacity:1;translate:none;clip-path:none;scale:1;transition:none}
  .hd,.btn,.btn::after,.lb,.lb img{transition:none}
  .prog{display:none}
}

/* Cadrage : rien ne dépasse ni ne se coupe, quelle que soit la largeur */
html,body{overflow-x:clip}
h1,h2,h3,h4,.cell h3,.s-blk h2{overflow-wrap:normal;hyphens:manual;-webkit-hyphens:manual;word-break:normal;text-wrap:balance}
p,li,.cap{overflow-wrap:normal;hyphens:manual}
.cell h3{max-width:100%;padding-inline:12px;box-sizing:border-box}
@media (max-width:480px){
  .hero h1,.s-head h1,.i-top h1{font-size:clamp(32px,10.5vw,46px);line-height:1.08}
  .s-head,.series-h{padding-left:20px;padding-right:20px}
  .s-head.l80,.s-head.l182{padding-left:20px}
}

/* Titre h1 réservé aux lecteurs d'écran et aux moteurs de recherche (pages sans titre visible) */
.sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
/* Zones tactiles de 44 px sans changer l'apparence */
@media (pointer:coarse),(max-width:800px){
  .logo{display:inline-flex;align-items:center;min-height:44px}
  .burger{min-width:44px;min-height:44px}
  .lnk,.more,.back{padding-block:11px}
  .lnk,.more{margin-top:23px}
  .back{margin-bottom:13px}
  .lang{font-size:12px}
  .cell.dark h3{max-width:100%;overflow-wrap:normal;font-size:clamp(20px,6.4vw,28px);padding-inline:0}
}
@media (pointer:coarse),(max-width:800px){.serie .more{padding:11px 0 14px;margin-top:19px;background-position:0 calc(100% - 11px)}}

/* ===== Œuvres iconiques des séries : entrée en rideau, mise au point, survol ===== */
.mvon .pic.mvi{opacity:1;scale:1;translate:0 0;overflow:hidden;transition:none}
.mvon .pic.mvi img{clip-path:inset(0 0 100% 0);scale:1.14;transition:clip-path 1.25s cubic-bezier(.77,0,.175,1) var(--dl,0ms),scale 1.9s cubic-bezier(.23,1,.32,1) var(--dl,0ms)}
.mvon .serie.rev .pic.mvi img{clip-path:inset(0 0 0 100%)}
.mvon .pic.mvi.vu img{clip-path:inset(0);scale:1}
.pic{position:relative}
.pic::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(105deg,transparent 38%,rgba(255,255,255,.32) 50%,transparent 62%);transform:translateX(-120%)}
.mvon .pic.vu::after{animation:pic-reflet 1.4s cubic-bezier(.23,1,.32,1) calc(var(--dl,0ms) + .7s) 1 both}
@keyframes pic-reflet{to{transform:translateX(120%)}}
.serie .txt h4,.serie .txt p,.serie .txt .more{transition:opacity .9s var(--ease),translate 1s var(--ease)}
.mvon .serie .txt.mv:not(.vu) h4,.mvon .serie .txt.mv:not(.vu) p,.mvon .serie .txt.mv:not(.vu) .more{opacity:0;translate:0 14px}
.mvon .serie .txt.vu p{transition-delay:.12s}
.mvon .serie .txt.vu .more{transition-delay:.24s}
@media (hover:hover) and (pointer:fine){
  .pic img{transition:scale .9s cubic-bezier(.23,1,.32,1)}
  .mvon .pic.mvi.vu img{transition:scale .9s cubic-bezier(.23,1,.32,1)}
  .pic:hover img{scale:1.03}
}
@media (prefers-reduced-motion:reduce){.pic::after{display:none}.mvon .pic.mvi img{clip-path:none;scale:1;transition:none}.mvon .serie .txt.mv:not(.vu) *{opacity:1;translate:none}}

/* ===== Œuvres iconiques de l'accueil : apparition rapide, dès l'entrée, avec mouvement ===== */
.js .open img{clip-path:inset(0 0 100% 0);transform:scale(1.12);filter:saturate(1.1) contrast(1.05) blur(6px);transition:clip-path .85s cubic-bezier(.77,0,.175,1),transform 1.5s cubic-bezier(.23,1,.32,1),filter 1s cubic-bezier(.23,1,.32,1)}
.js .open.in img{clip-path:inset(0);transform:none;filter:saturate(1.1) contrast(1.05)}
.js .grid2 .cell:nth-child(2) img,.js .grid2 .cell:nth-child(3) img{transition-delay:.05s}
.js .grid2 .cell:nth-child(5) img{transition-delay:.1s}
.js .banner.open img{clip-path:inset(0 100% 0 0)}
.js .banner.open.in img{clip-path:inset(0)}
.js .banner.open p{opacity:0;translate:0 12px;transition:opacity .8s cubic-bezier(.23,1,.32,1) .5s,translate .9s cubic-bezier(.23,1,.32,1) .5s}
.js .banner.open.in p{opacity:1;translate:0 0}
.cell.open.in:not(.dark)::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.28) 50%,transparent 65%);transform:translateX(-120%);animation:cell-reflet 1.3s cubic-bezier(.23,1,.32,1) .5s 1 both}
@keyframes cell-reflet{to{transform:translateX(120%)}}
@media (prefers-reduced-motion:reduce){.js .open img,.js .banner.open p{clip-path:none!important;transform:none!important;filter:none!important;opacity:1!important;translate:none!important}.cell.open.in::after{display:none}}
.chr{margin-top:50px;max-width:860px}
.chy{display:grid;grid-template-columns:110px 1fr;gap:20px;padding:26px 0;border-top:1px solid rgba(0,0,0,.15)}
.chy h3{font-family:var(--serif);font-size:30px;line-height:1.1}
.chy ul{list-style:none;margin:0;padding:0;min-width:0}
.chy li{font-size:15.8px;line-height:1.5;margin-bottom:10px;overflow-wrap:normal}
@media (max-width:600px){.chy{grid-template-columns:1fr;gap:8px}}
.dem-intro .dem-t p+p{margin-top:1em}
.dem-intro h2{text-wrap:balance;font-size:clamp(30px,3.2vw,46px);line-height:1.1;margin-bottom:36px}
.dem-intro .dem-t{text-align:left}
.dem-intro .dem-i img{mix-blend-mode:normal;aspect-ratio:1/1;object-fit:cover}
.dem-pres{padding-top:110px}
.dem-pres h2{grid-column:1/-1;text-wrap:balance;margin-bottom:0}
@media(min-width:1000px){.dem-pres h2{white-space:nowrap;font-size:clamp(38px,3.9vw,56px)}}
@media(max-width:999px){.dem-pres h2{white-space:nowrap;font-size:clamp(14px,4.3vw,38px)}}

/* === Mobile : animations douces et retours au toucher === */
@keyframes elFondu{from{opacity:0}to{opacity:1}}
/* Texte lisible sur les peintures, sur petit écran */
@media (max-width:800px){.hero::after{background:linear-gradient(180deg,rgba(0,0,0,.26),rgba(0,0,0,.16) 45%,rgba(0,0,0,.36))}}
/* Retours au toucher (pas de survol sur téléphone) */
@media (hover:none){
  .btn,.cell,.serie .more,.lnk,.pp{-webkit-tap-highlight-color:transparent}
  .btn{transition:transform .14s var(--ease),background-color .14s linear,color .14s linear}
  .btn:active{transform:scale(.97)}
  .cell img,.pic img,.gal img,.ix img{transition:transform .5s var(--ease)}
  .cell:active img,.pic:active img,.gal img:active,.ix:active img{transform:scale(1.025)}
}
/* « Réduire les animations » activé sur le téléphone : on garde des fondus doux, sans glissement ni zoom */
@media (prefers-reduced-motion:reduce){
  .hero .kicker,.hero h1,.hero .sub,.hero .btns{animation:elFondu .9s ease both}
  .hero .kicker{animation-delay:.2s}.hero h1{animation-delay:.35s}.hero .sub{animation-delay:.7s}.hero .btns{animation-delay:.9s}
  .mvcalme .mv,.mvcalme .mvi{opacity:0;transition:opacity .9s ease var(--dl,0ms)!important}
  .mvcalme .mv.vu,.mvcalme .mvi.vu{opacity:1}
  .js .open img{opacity:0!important;transition:opacity .9s ease!important}
  .js .open.in img{opacity:1!important}
  .js .banner.open p{opacity:0!important;transition:opacity .9s ease .3s!important}
  .js .banner.open.in p{opacity:1!important}
  .prog{display:block}
}

/* === Fluidité et revue de presse === */
/* Les séries inversées (image à droite) restaient rognées : la règle plus spécifique l'emportait sur l'état révélé */
.mvon .serie.rev .pic.mvi.vu img{clip-path:inset(0)}
/* Haut de page fluide : plus d'animation de dérive en boucle sur la grande image (elle forçait un nouveau calcul à chaque image) */
.hero>img{animation:elHeroImg 2.8s var(--ease) both;will-change:auto}
@media (hover:none),(max-width:800px){.hero>img{filter:none}}
/* Revue de presse : liens */
.pp a.pl{color:inherit;text-decoration:underline;text-decoration-color:rgba(127,105,69,.45);text-underline-offset:4px;text-decoration-thickness:1px;transition:text-decoration-color .2s,color .2s}
.pp a.pl:hover,.pp a.pl:focus-visible{color:var(--bronze);text-decoration-color:currentColor}
.pp a.pl:focus-visible{outline:2px solid var(--bronze);outline-offset:4px}

/* === Titres de séries cliquables === */
.serie h4 a.ser-t{color:inherit;text-decoration:none;display:inline-block;background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;transition:color .3s var(--ease),background-size .45s var(--ease)}
.serie h4 a.ser-t:hover,.serie:hover h4 a.ser-t,.serie h4 a.ser-t:focus-visible{color:var(--bronze);background-size:100% 1px}
.serie h4 a.ser-t:focus-visible{outline:2px solid var(--bronze);outline-offset:4px}