/* Charte Han Pixel, 11 oct. 2026. Chargée en dernier : elle prime sur le CSS v2.1.
   Graisse 300 seulement à partir de 24 px. Espacements plafonnés.
   Rail dès 820 px. Titres d'affichage plafonnés à 72 px.
   Clément, 21 h 57, repris par Han au §7 : le héros glisse de 12 px avec le fondu (500 ms).
   Partout ailleurs, fondu seulement. prefers-reduced-motion : aucun mouvement. */
:root{
  --nk-marin:#010C30; --nk-creme:#FEF9F3; --nk-ink:#010C30; --nk-cr-1:#FEF9F3;
  --marin:var(--nk-marin,#010C30);--creme:#FDF6EE;--electrique:#3713D0;--aqua:#7DCDEF;
  --nk-milieu-a:linear-gradient(120deg,#3713D0 0%,#3713D0 20%,#86267A 55%,#B0304F 82%,#D43829 100%);
  --nk-voile:linear-gradient(0deg,rgba(1,12,48,.72),rgba(1,12,48,.45));
  --nk-voile-fort:rgba(1,12,48,.62);
  --nk-font:Inter,Arial,sans-serif;
  --nk-w-display:300;
  --nk-w-regular:400;
  --nk-w-medium:500;
  --fs-body:1.125rem;
  --lh-body:1.6;
  --measure:68ch;
  --fs-small:.875rem;
  --fs-lead:clamp(1.25rem,1.6vw,1.5rem);
  --lh-lead:1.4;
  --fs-h1x:clamp(40px,5vw,72px);
  --fs-h2xl:clamp(30px,3.4vw,56px);
  --fs-h2:clamp(28px,3vw,48px);
  --fs-h3:clamp(22px,2vw,28px);
  --fs-stat:clamp(48px,5vw,72px);
  --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-5:24px; --s-6:32px; --s-7:48px; --s-8:64px; --s-9:80px;
  --sec:clamp(48px,6vw,80px);
  --sec-clair:clamp(40px,5vw,64px);
  --m:clamp(20px,5vw,72px);
  --container:1440px;
  --gutter:var(--s-5);
  --nk-r-pill:999px;
  --nk-r-card:20px;
  --nk-r-field:14px;
  --nk-r-img:16px;
  --nk-r-tag:999px;
  --fade-dur:500ms;
  --fade-ease:cubic-bezier(.2,.7,.2,1);
}
@media (max-width:599px){
  :root{--sec:clamp(32px,8vw,48px);--sec-clair:clamp(32px,8vw,48px)}
}

body{font-family:var(--nk-font);font-weight:400;font-size:var(--fs-body);line-height:var(--lh-body)}

/* Sous 24 px : graisse 400. 300 réservé aux titres qui font au moins 24 px. */
:is(p,li,dd,dt,figcaption,small,label,button,.lab,.num,.ec-kick,.ec-h-sub,.ec-sub,.lead,.lead2,.p,.ec-prose,.ec-prose p,.nk-chapeau,.btn,.scr){
  font-weight:400!important
}
:is(h1,h2,.h1s,.ec-h1,.nk-h1,.nk-h2,.ec-giga,.ec-tera,.giga,.tera){
  font-weight:300!important;
  overflow-wrap:break-word
}
:is(h1,.h1s,.ec-h1,.nk-h1){font-size:clamp(40px,5vw,72px)!important}
:is(h2,.nk-h2,.nk-real .nk-hd h2,.nk-stb .st-t){font-size:clamp(28px,3vw,48px)!important}
:is(.ec-giga,.ec-tera,.giga,.tera,.ft .big,.fig b,.ec-big,.spec,.band .big8,.ct-big,.cs-hm b,.cs-hcm b,.cs-rmg b,.cs-rc b,.ag-f b,.cu-one b,.story .yr,.kx-hero .ec-big,.feat2 .n,.cta2 h2,.nx2 .t,.ec-next-t){
  font-size:clamp(40px,5vw,72px)!important
}
.nk-h1--long,:is(h1,h2,.ec-h1).nk-h1--long{font-size:var(--fs-h2xl)!important;max-width:20ch}
h3,.nk-h3{font-weight:500;font-size:var(--fs-h3);line-height:1.2}

.nk-chapeau,.ec-prose>p.nk-chapeau{
  font-size:clamp(20px,1.6vw,24px)!important;
  line-height:1.4!important;
  font-weight:400!important;
  max-width:46ch
}
.ec-prose p,.nk-prose p{font-size:1.125rem;line-height:1.6;font-weight:400}
.ec-prose,.nk-prose{max-width:var(--measure)}
@media (max-width:899px){
  .ec-prose,.ec-prose p,.nk-prose,.nk-chapeau{max-width:none;width:100%}
}

/* Plafond d'espacement. Les sections claires sans visuel restent sous le plafond. */
:is(.sx,.qx,.kx,.cta2,.ec-sx,.nk-sec,.nk-real,.nk-stb){padding-block:var(--sec)!important}
main>section.sx:not(.dk):not(:has(img,video)),
main>section.qx:not(.dk):not(:has(img,video)){padding-block:var(--sec-clair)!important}
.ec-livre{padding-block:var(--sec-clair)!important}
.ec-livre::before{background:var(--nk-voile)!important}
.nk-sur-media{position:relative;isolation:isolate;color:var(--nk-cr-1)}
.nk-sur-media::before{content:"";position:absolute;inset:0;background:var(--nk-voile);z-index:-1}
.nk-sur-media :where(p,li,small,.lab){font-weight:400!important}

/* Rail : dès deux cartes, sous 820 px, jamais empilées. */
@media (max-width:820px){
  :is(.nk-rail,.rel,.ec-ix,.ec-rel,.nk-b1-g,.nk-st-grid,.nk-st-work,.ed-g,.bll,.tm-g,.tg,.br-g,.mod,.csg):has(> :not([hidden]) ~ :not([hidden])){
    display:flex!important;
    flex-flow:row nowrap!important;
    gap:16px;
    overflow-x:auto;
    overscroll-behavior-x:contain;
    scroll-snap-type:x mandatory;
    scroll-padding-inline:var(--m);
    scrollbar-width:none;
    margin-inline:calc(-1 * var(--m));
    padding-inline:var(--m);
    grid-template-columns:none!important
  }
  :is(.nk-rail,.rel,.ec-ix,.ec-rel,.nk-b1-g,.nk-st-grid,.nk-st-work,.ed-g,.bll,.tm-g,.tg,.br-g,.mod,.csg):has(> :not([hidden]) ~ :not([hidden])) > :not([hidden]){
    flex:0 0 78%!important;
    width:78%!important;
    max-width:78%!important;
    min-width:0!important;
    scroll-snap-align:start;
    grid-column:auto!important
  }
}

/* Le chiffre du héros fond encore, seulement quand le script pose html.js.
   Sans JS il est déjà blanc, comme à la fin du fondu. Le h1, lui, est lisible
   à la première image : 12 px, 200 ms, sans opacité 0 et sans masque mot par mot. */
@keyframes nk-fade{from{opacity:0}to{opacity:1}}
@keyframes nk-hero-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes nk-h1-in{from{transform:translateY(12px)}to{transform:none}}
:is(.hero h1,.chero h1,.ar-h h1,.ct2 h1,section.ec-ixh h1){
  animation:nk-hero-in var(--fade-dur) var(--fade-ease) both!important
}
html.js .ec-h .ec-h-k{
  animation:nk-hero-in var(--fade-dur) var(--fade-ease) both!important
}
html:not(.js) :is(.ec-h .ec-h-k,.ec-h .ec-h-kv,[data-count]){
  opacity:1!important;
  animation:none!important;
  transform:none!important
}
:is(.ec-h h1,.ec-h .ec-h1){
  opacity:1!important;
  overflow:visible!important;
  clip-path:none!important;
  animation:nk-h1-in 200ms var(--fade-ease) both!important
}
:is(.ec-h h1,.ec-h .ec-h1) :is(.split,.ec-w,.ec-w>span){
  display:inline!important;
  overflow:visible!important;
  opacity:1!important;
  transform:none!important;
  animation:none!important;
  clip-path:none!important
}
/* Hors fiche, le chrome reste un fondu. Les études v2.1 retrouvent le dévoilement,
   le mot à mot, le trait et la parallaxe (v2.js / v2.css). */
:is(.hero h1 .w>span,.mq,.marquee,.marquee span,.xpt){
  transform:none!important;
  animation:none!important;
  transition-property:opacity!important;
  transition-duration:var(--fade-dur)!important;
  transition-timing-function:var(--fade-ease)!important
}
:is(h2,h3,h4,a,button,li,cite,p,.ar,.mo,.svc-i,.gi,.cs-nxt,.card,.ec-card,.pm img,.pm .vp,.pro-r .st):is(:hover,:focus-visible),
:is(.pm:hover,.pm:focus-visible) img,
:is(.pm .vp,.pro-r .st,.gi b,.gi i){transform:none!important}
:is(.docs2 .doc,.ec-docs2 .doc):is(:hover,:focus-visible){transform:rotateY(-14deg) translateZ(0)!important}
:is(.dom-p [role=tabpanel],.qa .ans,dialog.dlg[open],.vx .player.mini,.ec-vx .player.ec-mini){
  animation-name:nk-fade!important;
  animation-duration:var(--fade-dur)!important
}
.ec-track{transform:none!important;overflow-x:auto;scroll-snap-type:x mandatory}
[data-fade]{opacity:1}
html.xm [data-fade],html.nk-js [data-fade]{opacity:0;transition:opacity var(--fade-dur) var(--fade-ease)}
html.xm [data-fade].is-in,html.nk-js [data-fade].is-in{opacity:1}
@media (prefers-reduced-motion:reduce){
  :is(.ec-h .ec-h-t,.ec-h h1,.ec-h .ec-h1,.ec-h .ec-h-k,.hero h1,.chero h1,.ar-h h1,.ct2 h1,section.ec-ixh h1),
  :is([data-rv],[data-rvx],[data-fade],.rv,.ec-split .ec-w>span,.split .ec-w>span,.hero h1 .w>span){
    opacity:1!important;transform:none!important;transition:none!important;animation:none!important
  }
  .qx blockquote .hl{background-size:100% .08em!important;transition:none!important}
  .hx-sig b,.hstrip .track,[data-px],[data-scrollshot] img{animation:none!important;transition:none!important;transform:none!important}
}
html.xr :is(.ec-h .ec-h-t,.ec-h h1,.ec-h .ec-h1,.ec-h .ec-h-k,.hero h1,.chero h1,.ar-h h1,.ct2 h1,section.ec-ixh h1),
html.ec-xr :is(.ec-h .ec-h-t,.ec-h h1,.ec-h .ec-h1,.ec-h .ec-h-k,.hero h1,.chero h1,.ar-h h1,.ct2 h1,section.ec-ixh h1){
  opacity:1!important;transform:none!important;transition:none!important;animation:none!important
}
html.xr .qx blockquote .hl,html.ec-xr .qx blockquote .hl{background-size:100% .08em!important;transition:none!important}
html.xr :is(.hx-sig b,.hstrip .track,[data-px],[data-scrollshot] img),
html.ec-xr :is(.hx-sig b,.hstrip .track,[data-px],[data-scrollshot] img){animation:none!important;transition:none!important;transform:none!important}
h1,.ec-h1,.h1s,.hero h1,.chero h1{font-weight:300!important}
.ec-h-sub{display:block!important;font-weight:400!important;max-width:46ch}
.ec-h.dk .ec-h-sub{color:var(--nk-creme)!important}
:is(.ec-h.lt,.ec-vignoble-h,.ec-mandat-06b-hero) .ec-h-sub{color:var(--nk-text-2)!important}
.tags{display:flex!important;flex-wrap:wrap!important;gap:8px;min-width:0}
.tags span{white-space:normal!important;overflow:visible!important;text-overflow:clip!important;max-width:100%}
.hd.on-dk{background:var(--nk-marin)!important;color:var(--nk-creme)!important}
.hd.on-dk :is(a,.ln,.lng,.lng a,.lng span,button):not(.btn){color:var(--nk-creme)!important;opacity:1!important}
.hd.on-dk:not(.sc):not(.open) .btn{background:#FEF9F3!important;color:var(--nk-marin)!important;border-color:#FEF9F3!important;opacity:1!important}
/* Héros Marin : le bandeau est lisible sans script (logo blanc, nav, langue, Parlons-en).
   html.js, posé dans le head, garde le départ sombre pour que le fondu de .on-dk reste l'entrée. */
body:has(main > section.dk:first-of-type) .hd:not(.sc):not(.open){
  background:var(--nk-marin)!important;
  color:var(--nk-creme)!important
}
body:has(main > section.dk:first-of-type) .hd:not(.sc):not(.open) :is(a,.ln,.lng,.lng a,.lng span,button):not(.btn){
  color:var(--nk-creme)!important;
  opacity:1!important
}
body:has(main > section.dk:first-of-type) .hd:not(.sc):not(.open) .lg{display:none!important}
body:has(main > section.dk:first-of-type) .hd:not(.sc):not(.open) .lg.lg-w{display:block!important}
body:has(main > section.dk:first-of-type) .hd:not(.sc):not(.open) .btn{
  background:#FEF9F3!important;
  color:var(--nk-marin)!important;
  border-color:#FEF9F3!important;
  opacity:1!important
}
html.js body:has(main > section.dk:first-of-type) .hd:not(.on-dk):not(.sc):not(.open){
  background:transparent!important;
  color:var(--nk-marin)!important
}
html.js body:has(main > section.dk:first-of-type) .hd:not(.on-dk):not(.sc):not(.open) :is(a,.ln,.lng,.lng a,.lng span,button):not(.btn){
  color:var(--nk-marin)!important
}
html.js body:has(main > section.dk:first-of-type) .hd:not(.on-dk):not(.sc):not(.open) .lg{display:block!important}
html.js body:has(main > section.dk:first-of-type) .hd:not(.on-dk):not(.sc):not(.open) .lg.lg-w{display:none!important}
html.js body:has(main > section.dk:first-of-type) .hd:not(.on-dk):not(.sc):not(.open) .btn{
  background:transparent!important;
  color:var(--nk-marin)!important;
  border-color:currentColor!important
}
.dk :is(a.ln,.ec-crumbs,.ec-crumbs a){color:var(--nk-creme)!important;opacity:1!important}
.ec-livre.nk-sur-media{background:var(--nk-milieu-a)!important;color:var(--nk-creme)!important}
.nk-sur-media::before{background:var(--nk-voile)!important}
.ec-livre.nk-sur-media::before{background:rgba(1,12,48,.72)!important;z-index:0!important}
.ec-livre .wrap{position:relative;z-index:1}
.ec-livre :is(.lab,.nk-chapeau,.ec-prose,.ec-prose p,.ec-prose li,.ec-suite-btn){color:var(--nk-creme)!important}
/* 24 px entre le libellé et le texte : le titre ne flotte pas dans un vide. */
.chap{margin-bottom:24px!important}
h1,h2,.ec-h1,.chap h2{overflow:visible!important}
/* Deux sections claires d'une fiche : le filet remplace le padding doublé. */
main>section:is(.sx,.qx,.ec-livre):not(.dk):has(+section:not(.dk):not(.bleed)){padding-bottom:var(--avant-filet)!important}
main>section:is(.sx,.qx,.ec-livre):not(.dk)+section:not(.dk):not(.bleed){padding-top:0!important}
/* Le chapeau est coupé côté serveur, en fin de phrase : aucun « … » en pleine phrase. */
.ec-prose>p.nk-chapeau{
  display:block!important;
  -webkit-line-clamp:unset!important;
  line-clamp:unset!important;
  -webkit-box-orient:unset!important;
  overflow:visible!important;
}
.ec-prose ol{margin:0 0 16px;padding-left:1.25em}
.ec-prose li{font-size:1.125rem;line-height:1.6;font-weight:400}
/* Cas suivant : voile plein à 78 %, photo floue pour que le texte du visuel ne traverse pas le titre. */
.nx2::before{content:none!important;background:none!important}
.nx2 .wrap{background:none!important}
.pied-z__media{position:absolute;inset:0;z-index:0;display:block;overflow:hidden}
.pied-z__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:blur(2px) saturate(.6);transform:none!important;opacity:1!important}
.pied-z__media::after{content:""!important;position:absolute;inset:0;z-index:1;background:rgb(1 12 48/.78)}
.nx2 .wrap,.nx2 .bar2{z-index:2!important}
.nx2 :is(.t,.lab,.go){color:var(--nk-creme)!important}
.hstrip .track figure:first-child img{object-fit:cover}
/* L'aplat jaune occupe la gauche du visuel. 70 % le laisse dans la carte et coupe
   « Change de tempo ». Le sujet tient dans un cadre 6/5 calé à 88,6 %. */
.hstrip .track figure:has(img.ec-rail-mid) .frame{aspect-ratio:6/5}
.hstrip .track img.ec-rail-mid{object-fit:cover;object-position:88.6% 50%}
.hstrip .track figure.ec-phone .frame{aspect-ratio:9/19.5}
.hstrip .track figure.ec-phone img{object-fit:cover;object-position:center top}
/* Sous le titre du cas suivant : le bas du visuel se ferme vers le Marin. */
.pied-z__media::before{content:""!important;position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(transparent, rgb(1 12 48/.9) 55%)}
/* Quatre livrables : à 375 la 4e reste pleine largeur. En large, grille 2×2,
   portraits calés en haut pour que Lez'Arts et le 4e cadre restent lisibles. */
.mos2:not(:has(.frame:nth-child(5))) .frame:nth-child(4){grid-column:1 / -1!important}
@media (max-width:900px){
  .mos2:not(:has(.frame:nth-child(5))) .frame:nth-child(4){aspect-ratio:3/4!important}
}
@media (min-width:901px){
  .mos2:not(:has(.frame:nth-child(5))){grid-template-columns:1fr 1fr!important}
  .mos2:not(:has(.frame:nth-child(5))) .frame:nth-child(n){grid-column:auto!important;grid-row:auto!important;aspect-ratio:4/5!important}
  .mos2:not(:has(.frame:nth-child(5))) .frame:nth-child(1),
  .mos2:not(:has(.frame:nth-child(5))) .frame:nth-child(2){aspect-ratio:4/3!important}
  .mos2:not(:has(.frame:nth-child(5))) .frame:nth-child(3) img,
  .mos2:not(:has(.frame:nth-child(5))) .frame:nth-child(4) img{object-position:center top!important}
}
.hero{padding-bottom:64px!important}
.marquee{overflow:hidden;white-space:nowrap}
.hero>.marquee{position:absolute!important;left:0;right:0;bottom:0;z-index:3}
.marquee__track{display:flex;flex-wrap:nowrap}
@media (max-width:599px){
  /* 40 + 40 : l'écart entre deux sections reste d'au plus 80 px. */
  :is(.stm,.fig,.spl,.qt,.pro,.grp,.ed,.svc,.br,.tm,.cta){padding-top:40px!important;padding-bottom:40px!important}
  :is(.fig,#equipe.tm){padding-bottom:0!important}
  .mx{padding-top:16px!important;padding-bottom:16px!important}
  .ft{padding-top:40px!important}
}
button.ec-suite-btn,
button.ec-more-btn:not([hidden]){
  display:inline-flex!important;align-items:center;gap:10px;
  min-height:48px;width:auto;height:auto;padding:0 22px 0 24px!important;
  border-radius:999px;border:1px solid rgba(1,12,48,.2);background:transparent;
  color:var(--marin);font:400 15px/1 Inter,system-ui,sans-serif;letter-spacing:.01em;
  margin-top:16px;cursor:pointer;transition:background .2s,color .2s,border-color .2s;
  text-decoration:none;text-underline-offset:0;box-sizing:border-box;
}
button.ec-suite-btn svg,button.ec-more-btn svg{width:18px;height:18px;transition:transform .25s}
button.ec-suite-btn:hover,button.ec-more-btn:hover{background:var(--marin);color:var(--creme);border-color:var(--marin)}
button.ec-more-btn:hover svg{transform:translateX(3px)}
button.ec-suite-btn:focus-visible,button.ec-more-btn:focus-visible{outline:2px solid var(--electrique)!important;outline-offset:3px!important}
button.ec-suite-btn .when-open,button.ec-more-btn .when-open{display:none}
button.ec-suite-btn[aria-expanded="true"] .when-closed,button.ec-more-btn[aria-expanded="true"] .when-closed{display:none}
button.ec-suite-btn[aria-expanded="true"] .when-open,button.ec-more-btn[aria-expanded="true"] .when-open{display:inline-flex;align-items:center;gap:10px}
.ec-livre :is(.ec-suite-btn,.ec-more-btn){border-color:rgba(253,246,238,.35);color:var(--creme)!important}
.ec-livre :is(.ec-suite-btn,.ec-more-btn):hover{background:var(--creme);color:var(--marin)!important;border-color:var(--creme)}
.ec-livre :is(.ec-suite-btn,.ec-more-btn):focus-visible{outline:2px solid var(--aqua)!important;outline-offset:3px!important}
.ec-ba .ba{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.ec-ba figure{margin:0}
.ec-ba .panel{aspect-ratio:4/3;border-radius:16px;display:grid;place-items:center;padding:12%}
.ec-ba .p1{background:#fff}.ec-ba .p2{background:#FEF9F3}
.ec-ba .p1 img{width:62%;height:auto;transform:translateY(-2%)}
.ec-ba .p2 img{width:74%;height:auto;transform:translateY(-2%)}
.ec-ba figcaption{margin-top:16px;font-size:15px}.ec-ba figcaption b{font-weight:500}.ec-ba figcaption span{color:rgba(1,12,48,.55)}
@media (max-width:700px){.ec-ba .ba{grid-template-columns:1fr}.ec-ba .panel{padding:14%}}
.ec-suite:focus,.ec-suite:focus-visible{outline:none}
.ec-suite:not([hidden]){animation:ecIn .3s ease both}
@keyframes ecIn{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:reduce){
  .ec-suite{animation:none!important}
  .ec-ba .p1 img,.ec-ba .p2 img{transform:none!important}
  button.ec-more-btn:hover svg{transform:none!important}
}
.nk-round{width:48px;height:48px;border-radius:50%;border:1px solid rgba(1,12,48,.2);background:transparent;color:var(--marin);display:inline-grid;place-items:center;padding:0;cursor:pointer;transition:background .2s,color .2s}
.nk-round svg{width:20px;height:20px}
.nk-round:hover{background:var(--marin);color:var(--creme);border-color:var(--marin)}
.nk-round:focus-visible{outline:2px solid var(--electrique)!important;outline-offset:3px!important}
.ec-livre .nk-round:focus-visible{outline:2px solid var(--aqua)!important;outline-offset:3px!important}
.nk-round:disabled{opacity:.35;cursor:default}
.ec-livre .nk-round{border-color:rgba(253,246,238,.35);color:var(--creme)}
.ec-livre .nk-round:hover{background:var(--creme);color:var(--marin)}
.ec-gal-ctrls{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:16px}
.ec-gal-counter{font-size:14px;color:rgba(1,12,48,.6);margin-left:8px;font-variant-numeric:tabular-nums}
.ec-livre .ec-gal-counter{color:rgba(253,246,238,.7)}
.ec-gal-ui{margin-top:8px}
@media (min-width:1024px){
  body[data-page="projet-image-de-marque"] .ec-h .ec-h-v{overflow:visible}
  body[data-page="projet-image-de-marque"] .ec-h .ec-h-v figcaption{overflow:visible;text-overflow:clip;white-space:normal;display:block;max-width:100%}
}
/* « Ce que nous avons livré » : le libellé et l'énoncé restent entiers, sans « Lire plus ». */
.ec-band .lab,
.ec-livre>.wrap>.lab,
.ec-band .ec-band-t,
.ec-band .ec-more .ec-band-t,
.ec-band .ec-more:not(.is-open) .ec-more-b>p{
  display:block!important;
  -webkit-line-clamp:unset!important;
  line-clamp:unset!important;
  -webkit-box-orient:unset!important;
  overflow:visible!important;
  max-height:none!important;
}
.ec-band .ec-more-btn{display:none!important}
/* Pubs 4:5 ou carrées : le cadre épouse le canvas, le texte n'est pas rogné. */
.hstrip .track figure.ec-ad .frame{aspect-ratio:4/5!important}
.hstrip .track figure.ec-ad.ec-ad-sq .frame{aspect-ratio:1/1!important}
.hstrip .track figure.ec-ad img,
.hstrip .track figure.ec-ad:first-child img{
  width:100%;
  height:100%;
  object-fit:contain!important;
  object-position:center!important;
}
@media (max-width:900px){
  /* Le héros ne réserve plus un écran vide : le contenu commence sous la nav. */
  body main>section.ec-h{
    height:auto!important;
    min-height:0!important;
    margin-top:0!important;
    padding-top:12px!important;
    justify-content:flex-start!important;
  }
  body main>section.ec-h .ec-h-g{
    height:auto!important;
    min-height:0!important;
    padding-top:0!important;
    justify-content:flex-start!important;
  }
  body main>section.ec-h .ec-h-v{
    position:relative!important;
    inset:auto!important;
    top:auto!important;
    right:auto!important;
    bottom:auto!important;
    left:auto!important;
    height:auto!important;
    width:100%!important;
  }
  /* Captures de site : le ratio du fichier, jamais un étirement. */
  :is(.browser,.phone,.ec-phone,.ec-page,.ec-frame-desk,.ec-frame-phone,.devrow) img,
  .scrollshot img,
  .ec-h-v .browser img{
    width:100%!important;
    height:auto!important;
    max-height:none!important;
    aspect-ratio:auto!important;
    object-fit:contain!important;
    object-position:center top!important;
  }
  :is(.browser,.phone,.ec-phone,.ec-page,.ec-frame-desk,.ec-frame-phone),
  .ec-h-v .browser,
  .ec-h-v .ec-hv,
  .ec-h-v>.frame:not(.ec-fit-4x3),
  .ec-phone .scrollshot{
    height:auto!important;
    aspect-ratio:auto!important;
    max-height:none!important;
  }
  body[data-page="projet-plateformes-applications"] .ec-h-v>.frame.ec-fit.ec-fit-4x3{
    aspect-ratio:4/3!important;
    width:100%!important;
    min-height:min(56vw,420px)!important;
  }
  body[data-page="projet-plateformes-applications"] .ec-h-v>.frame.ec-fit.ec-fit-4x3 :is(img,picture){
    width:100%!important;
    height:100%!important;
    object-fit:contain!important;
    object-position:center!important;
  }
  /* La fenêtre du héros reste plus courte que la page, pour que le défilement existe. */
  .ec-h .scrollshot,
  .browser .scrollshot{
    height:min(52vh,460px)!important;
    aspect-ratio:auto!important;
    overflow:hidden!important;
    max-height:none!important;
  }
  /* Bandeau : la pub 4:5 active tient entière, gouttières comprises. La suivante peut dépasser. */
  .hstrip{
    overflow-x:auto;
    overflow-y:hidden;
    scroll-snap-type:x mandatory;
    scroll-padding-inline:var(--m);
    scrollbar-width:none;
  }
  .hstrip .track{transform:none!important;padding-right:var(--m)}
  .hstrip .track figure{scroll-snap-align:start}
  .hstrip .track figure.ec-ad{
    align-self:flex-start;
    flex:0 0 calc(100vw - (2 * var(--m)));
    width:calc(100vw - (2 * var(--m)));
    max-width:calc(100vw - (2 * var(--m)));
    height:auto;
  }
  .hstrip .track figure.ec-ad .frame{
    width:100%;
    height:auto;
    max-height:none;
    aspect-ratio:4/5!important;
  }
  .hstrip .track figure.ec-ad.ec-ad-sq .frame{aspect-ratio:1/1!important}
}

.hstrip{
  overflow-x:auto;
  overflow-y:hidden;
  scroll-snap-type:x mandatory;
  scroll-padding-inline:var(--m);
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
  overscroll-behavior-x:contain;
}
.hstrip::-webkit-scrollbar{display:none}
.hstrip .track{display:flex;gap:16px;padding-inline:var(--m);will-change:auto;transform:none!important}
.hstrip .track figure{scroll-snap-align:start;scroll-margin-inline:var(--m)}
.hstrip--carousel{position:relative;cursor:grab}
.hstrip--carousel.is-dragging{cursor:grabbing;user-select:none}
.hstrip-arrows{position:absolute;right:max(var(--m),20px);bottom:clamp(16px,3vw,28px);display:flex;gap:8px;z-index:2;pointer-events:none}
.hstrip-arrows .nk-round{pointer-events:auto;opacity:.88;box-shadow:0 2px 12px rgba(1,12,48,.12)}
.hstrip.dk .hstrip-arrows .nk-round{border-color:rgba(253,246,238,.35);color:var(--creme)}
.browser [data-scrollshot]{cursor:ns-resize}
.deb-reseau-lead{margin:0 0 clamp(20px,3vw,32px);max-width:42ch;font-size:clamp(17px,2vw,20px);line-height:1.45}
.reseau-carte{margin:0;background:#F3ECE2;border-radius:16px;padding:clamp(16px,3vw,32px);box-sizing:border-box;overflow:hidden}
.reseau-carte img{width:100%;height:auto;display:block}
.reseau-legende{display:flex;flex-wrap:wrap;gap:4px 16px;align-items:center;margin-top:clamp(12px,2vw,20px);font:400 12px/1.4 Inter,sans-serif;letter-spacing:.06em;text-transform:uppercase;color:rgba(1,12,48,.65)}
.reseau-legende .pt{display:inline-block;width:8px;height:8px;border-radius:50%;background:#D43829;margin-right:8px;vertical-align:middle}
@media (min-width:768px){.deb-reseau-lead{max-width:48ch}}
/* Dîner (sites-web) : le téléphone du devrow ne doit pas recouvrir la section carte. */
section.deb-map{position:relative;z-index:4;isolation:isolate;background:var(--creme)}
@media (min-width:901px){
  section.sx:has(+section.bleed+section.deb-map) .devrow .m{margin-bottom:0}
  section.sx:has(+section.bleed+section.deb-map)+section.bleed{margin-top:-12vh}
}
section.sx:has(+section.bleed+section.deb-map) .devrow .phone[data-px]{transform:none!important}
/* Livrets : la figure paysage du bandeau ne déborde pas du viewport (audit Webba). */
body[data-slug="des-livrets-qui-donnent-le-ton-des-soirees-benefice"] .hstrip{
  overflow-x:clip;
  max-width:100%;
  box-sizing:border-box;
}
body[data-slug="des-livrets-qui-donnent-le-ton-des-soirees-benefice"] .hstrip .track{
  box-sizing:border-box;
  max-width:100%;
}
body[data-slug="des-livrets-qui-donnent-le-ton-des-soirees-benefice"] .hstrip .track figure{
  flex:0 0 min(100%,calc(100vw - (2 * var(--m))));
  max-width:calc(100vw - (2 * var(--m)));
  box-sizing:border-box;
  min-width:0;
}
body[data-slug="des-livrets-qui-donnent-le-ton-des-soirees-benefice"] .hstrip .track figure .frame,
body[data-slug="des-livrets-qui-donnent-le-ton-des-soirees-benefice"] .hstrip .track figure img{
  max-width:100%;
  box-sizing:border-box;
}
@media (min-width:768px) and (max-width:1439px){
  body[data-slug="des-livrets-qui-donnent-le-ton-des-soirees-benefice"] section.hstrip{
    overflow-x:clip;
    width:100%;
    max-width:100%;
  }
}
/* MOON : les anneaux SVG du héros restent dans la section. */
body[data-slug="moon-by-simaudio"] .ec-h{
  overflow:hidden;
}
body[data-slug="moon-by-simaudio"] .ec-rings{
  max-width:100%;
  overflow:hidden;
  contain:paint;
}
@media (min-width:768px) and (max-width:1439px){
  body[data-slug="moon-by-simaudio"] .ec-rings{
    width:min(52vw,100%);
  }
}
@media (min-width:901px) and (max-width:1279px){
  body[data-slug="moon-by-simaudio"] .ec-stage:has(.browser):has(.ec-phones){
    grid-template-columns:minmax(0,1fr);
  }
  body[data-slug="moon-by-simaudio"] .ec-phones{
    max-width:100%;
    flex-wrap:wrap;
    gap:clamp(8px,1.6vw,12px);
    justify-content:flex-start;
  }
  body[data-slug="moon-by-simaudio"] .ec-phones .ec-phone{
    width:min(132px,calc((100% - 24px) / 3));
    flex:0 1 min(132px,calc((100% - 24px) / 3));
    max-width:148px;
  }
}
@media (min-width:821px) and (max-width:1279px){
  .rel{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
/* 04 · Marques immersives (Summit Law, Rhum.HR) */
.ec-marque-immersif{overflow-x:clip;max-width:100%}
.ec-marque-immersif .ec-mi--cream{background:#FEF9F3}
.ec-marque-immersif .ec-mi--white{background:#fff}
.ec-mi-ph{display:flex;align-items:center;justify-content:center;min-height:200px;width:100%;height:100%;background:#FEF9F3;color:rgba(1,12,48,.55);font-size:15px;letter-spacing:.04em}
.ec-mi-s{padding:clamp(72px,10vh,140px) 0}
.ec-mi-sh .ec-mi-kick,.ec-mi-kick--lime{color:var(--corail);font-size:12px;letter-spacing:.14em;text-transform:uppercase}
.ec-mi-kick--light{color:rgba(254,249,243,.85)}
.ec-mi-sh h2,.ec-mi-logo-tx h2{font-size:clamp(32px,4vw,52px);font-weight:300;line-height:1.06;margin:14px 0 18px;letter-spacing:-.02em}
.ec-mi-lead{font-size:clamp(17px,2vw,20px);line-height:1.6;max-width:36ch;margin:0 0 24px;font-weight:300}
.ec-mi-note{font-size:13px;opacity:.6;margin-top:12px}
.ec-mi-meta{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 32px;font-size:14px;margin-top:32px}
.ec-mi-meta>div{min-width:0}
.ec-mi-meta dt{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--corail);margin-bottom:4px}
.ec-mi-meta dd{margin:0;overflow-wrap:break-word;word-wrap:break-word}
.ec-mi-meta--light dt{color:var(--corail)}
.ec-mi-hero--summit{margin-top:-72px;padding:calc(72px + clamp(20px,3vh,36px)) 0 clamp(28px,4vh,44px);min-height:0;height:auto;max-height:none;overflow:hidden}
.ec-mi-hero--summit .ec-mi-hero-in.wrap{width:100%;min-width:0;max-width:calc(1200px + 2 * var(--nk-gutter, var(--m)));margin-inline:auto;padding-inline:var(--nk-gutter, var(--m));container-type:normal;box-sizing:border-box}
body[data-page="projet"][data-slug="de-bos-law-a-summit-law-une-marque-qui-guide"] .ec-marque-immersif .ec-mi-hero--summit .ec-mi-hero-in.wrap,body[data-page="projet-marque-image-de-marque"] .ec-marque-immersif .ec-mi-hero--summit .ec-mi-hero-in.wrap{width:100%;min-width:0;max-width:calc(1200px + 2 * var(--nk-gutter, var(--m)));margin-inline:auto;padding-inline:var(--nk-gutter, var(--m));box-sizing:border-box;container-type:normal}
.ec-mi-hero--summit.ec-mi--cream{color:var(--marin)}
.ec-mi-hero--summit .ec-crumbs :is(ol,a){color:rgba(1,12,48,.6)}
.ec-mi-hero--summit .ec-crumbs li[aria-current="page"]{color:var(--marin)}
.ec-mi-hero--summit .ec-mi-hero-crumb{margin-bottom:clamp(16px,2.5vh,24px)}
.ec-mi-hero--summit .ec-mi-hero-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(16px,2vw,24px);align-items:center}
.ec-mi-hero--summit .ec-mi-hero-txt{grid-column:1/-1;display:flex;flex-direction:column;min-width:0}
.ec-mi-hero--summit .ec-mi-hero-txt .ec-kick{margin:0;color:var(--nk-text-2,#666B7E)}
.ec-mi-hero--summit .ec-h1{font-size:clamp(32px,8vw,48px);max-width:100%;line-height:1.04;text-wrap:balance;margin-top:12px}
.ec-mi-hero--summit .ec-sig{margin-top:16px}
.ec-mi-hero--summit .ec-mi-meta{margin-top:20px}
.ec-mi-hero--summit .ec-mi-hero-media{grid-column:1/-1;margin:0;min-width:0;overflow:hidden;border-radius:2px}
.ec-mi-hero--summit .ec-mi-hero-media picture{display:block;width:100%}
.ec-mi-hero--summit .ec-mi-hero-media img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;object-position:30% 50%;border-radius:2px;display:block}
@media (min-width:1024px){
 .ec-mi-hero--summit{padding:calc(72px + clamp(16px,2.5vh,28px)) 0 clamp(24px,3.5vh,40px)}
 .ec-mi-hero--summit .ec-mi-hero-txt{grid-column:1/span 5;align-self:center}
 .ec-mi-hero--summit .ec-mi-hero-media{grid-column:6/span 7;align-self:center;max-height:560px}
 .ec-mi-hero--summit .ec-h1{font-size:clamp(40px,3.6vw,56px);max-width:11em;margin-top:14px}
 .ec-mi-hero--summit .ec-mi-meta{margin-top:24px}
 .ec-mi-hero--summit .ec-mi-hero-media img{max-height:560px;object-position:35% 50%}
}
.ec-mi-hero-media{margin:0;min-width:0;min-height:0}
.ec-mi-hero-media img{width:100%;height:100%;object-fit:cover;display:block}
.ec-mi-logo-summit{display:grid;grid-template-columns:minmax(0,7fr) minmax(320px,5fr);min-height:min(90vh,800px);background:#002507;color:#EFE8E6}
.ec-mi-logo-mk{background:#EFE8E6;display:flex;align-items:center;justify-content:center;padding:clamp(40px,8vw,80px);min-width:0}
.ec-mi-logo-mk img{width:100%;max-width:720px;height:auto}
.ec-mi-logo-tx{display:flex;flex-direction:column;justify-content:flex-end;padding:clamp(56px,10vh,120px) var(--m);min-width:0;width:100%;max-width:56ch;box-sizing:border-box}
.ec-mi-logo-summit .ec-mi-logo-tx.wrap{margin-inline:0;max-width:56ch;width:100%;min-width:0;container-type:normal}
.ec-mi-kick--lime{color:#C7CD00}
.ec-mi-apps-summit{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:8px;padding:8px 0;background:#fff}
.ec-mi-apps-summit>div{min-width:0;overflow:hidden}
.ec-mi-apps-summit img,.ec-mi-apps-summit .ec-mi-ph{width:100%;height:100%;object-fit:cover;display:block}
.ec-mi-apps-a1{grid-column:1/-1;height:100vh;aspect-ratio:auto}
.ec-mi-apps-a2{grid-column:1/8;height:80vh;aspect-ratio:auto}
.ec-mi-apps-a3{grid-column:8/-1;height:80vh;aspect-ratio:auto}
.ec-mi-apps-a4{grid-column:1/-1;height:90vh;aspect-ratio:auto}
.ec-mi-sw-papier{border:1px solid rgba(1,12,48,.1)}
.ec-mi-s--before-footer{padding-bottom:clamp(88px,12vh,140px)}
.ec-mi-uni-row{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,9fr);gap:clamp(24px,4vw,64px);border-top:1px solid rgba(1,12,48,.15);padding-top:36px;margin-top:40px;align-items:start}
.ec-mi-uni-row h3{font-size:20px;font-weight:400;margin:0}
.ec-mi-uni-row small{display:block;font-size:13px;opacity:.6;margin-top:8px;line-height:1.5}
.ec-mi-sw{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0}
.ec-mi-sw div{min-height:160px;padding:16px;font-size:13px;display:flex;align-items:flex-end}
.ec-mi-spec img{width:100%;max-width:640px;display:block;mix-blend-mode:multiply}
.ec-mi-hero--rhum{background:var(--marin);color:var(--creme)}
.ec-mi-hero-nav{display:flex;justify-content:space-between;padding:28px var(--m);font-size:14px;gap:16px;flex-wrap:wrap}
.ec-mi-nav-muted{opacity:.7}
.ec-mi-hero-rhum-t{display:grid;grid-template-columns:minmax(0,8fr) minmax(0,4fr);gap:clamp(24px,4vw,48px);align-items:end;padding:40px 0 56px}
.ec-mi-hero--rhum .ec-h1{font-size:clamp(40px,5.5vw,84px);max-width:16ch;line-height:1.02}
.ec-mi-hero-media--bleed img{width:100%;height:100vh;max-height:none;object-fit:cover;display:block}
.ec-mi-cap{padding-bottom:clamp(40px,6vh,56px)}
.ec-mi-trio{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;background:#FEF9F3}
.ec-mi-trio-cta{margin:0;padding:0 clamp(20px,var(--m),60px) clamp(48px,8vh,72px);background:#FEF9F3}
.ec-mi-outline-btn{display:inline-flex;align-items:center;gap:8px;padding:12px 22px;border:1px solid currentColor;border-radius:var(--nk-r-pill);text-decoration:none;color:inherit;font-size:14px;letter-spacing:.02em}
.ec-mi-outline-btn:hover{border-color:var(--corail);color:var(--corail)}
.ec-mi-trio img,.ec-mi-trio .ec-mi-ph{width:100%;aspect-ratio:4/5;object-fit:cover;display:block}
.ec-mi-uni-rhum{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,4fr) minmax(0,3fr);min-height:min(80vh,720px)}
.ec-mi-uni-rhum>div{padding:clamp(28px,4vw,48px);display:flex;flex-direction:column;justify-content:space-between;min-width:0}
.ec-mi-big{font-size:clamp(72px,12vw,140px);font-weight:300;letter-spacing:-.05em;line-height:.9}
.ec-mi-team{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center}
.ec-mi-team figure{margin:0;min-width:0}
.ec-mi-team img{width:100%;aspect-ratio:1;object-fit:cover;display:block}
.ec-mi-team-tx{padding:clamp(40px,8vw,80px) var(--m)}
@media (max-width:760px){
 .ec-mi-hero-media--bleed img{height:70vh}
 .ec-mi-logo-summit{grid-template-columns:1fr}
 .ec-mi-apps-summit{grid-template-columns:1fr}
 .ec-mi-apps-summit>div{grid-column:1!important;height:auto!important;aspect-ratio:auto!important}
 .ec-mi-apps-a1 img,.ec-mi-apps-a1 .ec-mi-ph,.ec-mi-apps-a4 img,.ec-mi-apps-a4 .ec-mi-ph{aspect-ratio:3/4;height:auto}
 .ec-mi-apps-a2 img,.ec-mi-apps-a2 .ec-mi-ph,.ec-mi-apps-a3 img,.ec-mi-apps-a3 .ec-mi-ph{aspect-ratio:4/5;height:auto}
 .ec-mi-uni-row{grid-template-columns:1fr}
 .ec-mi-sw{grid-template-columns:1fr 1fr}
 .ec-mi-hero-rhum-t{grid-template-columns:1fr}
 .ec-mi-trio{grid-template-columns:1fr}
 .ec-mi-uni-rhum{grid-template-columns:1fr}
 .ec-mi-team{grid-template-columns:1fr}
}
@media (min-width:761px) and (max-width:1024px){
 .ec-mi-apps-a2,.ec-mi-apps-a3{grid-column:1/-1}
 .ec-mi-sw{grid-template-columns:repeat(2,minmax(0,1fr))}
}
/* 04 · Lot marque (12 études staging) */
.ec-marque-lot{overflow-x:clip;max-width:100%}
.ec-marque-lot .ec-m04--cream{background:#FEF9F3}
.ec-marque-lot .ec-m04--white{background:#fff}
.ec-marque-lot .ec-m04-hero-cap>.wrap,.ec-marque-lot .ec-m04-logo>.wrap,.ec-marque-lot .ec-m04-uni>.wrap,.ec-marque-lot .ec-m04-cmp>.wrap,.ec-marque-lot .ec-m04-liv>.wrap{width:100%;min-width:0;max-width:var(--w,1320px);margin-inline:auto;container-type:normal}
.ec-marque-lot .ec-m04-hero .ec-h-t,.ec-marque-lot .ec-m04-lead{max-width:56ch}
.ec-m04-hero-bg{z-index:0}
.ec-m04-fiche-ln{background:linear-gradient(90deg,#3713D0,#86267A,#B0304F,#D43829)}
/* Affilia : sous 760 px, les cartes du mandat s'empilent. Seul .rel (« Dans la même veine ») reste en rail. */
@media (max-width:760px){
  body[data-page="projet-affilia"] :is(.ec-af-tiles,.ec-af-ty,.ec-af-mo,.ec-af-apps,.ec-af-ctx).nk-rail:has(> :not([hidden])){
    display:flex!important;
    flex-direction:column!important;
    flex-wrap:nowrap!important;
    align-items:stretch;
    gap:16px;
    overflow:visible!important;
    margin-inline:0!important;
    padding-inline:0!important;
    width:100%!important;
    max-width:100%!important;
    scroll-snap-type:none!important;
    grid-template-columns:none!important;
  }
  body[data-page="projet-affilia"] :is(.ec-af-tiles,.ec-af-ty,.ec-af-mo,.ec-af-apps,.ec-af-ctx).nk-rail > :not([hidden]){
    flex:none!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    scroll-snap-align:unset!important;
    grid-column:auto!important;
  }
  body[data-page="projet-affilia"] .ec-af-mo > .ec-af-fig{aspect-ratio:1;height:auto!important;margin-inline:auto}
  body[data-page="projet-affilia"] .ec-af-mo > .ec-af-fig:has(img[src*="motif-banniere"]){max-width:422px!important}
  body[data-page="projet-affilia"] .ec-af-mo > .ec-af-fig:has(img[src*="motif-brochure-cercles"]){max-width:480px!important}
  body[data-page="projet-affilia"] .ec-af-mo > .ec-af-fig:has(img[src*="motif-brochure-x"]){max-width:563px!important}
  body[data-page="projet-affilia"] .ec-af-ty-img{max-width:458px;height:auto;min-height:0;aspect-ratio:458/255}
  body[data-page="projet-affilia"] .ec-af-ty-img img{max-height:255px}
}
/* Affilia : 761–1023 px, deux colonnes. Seul .rel (« Dans la même veine ») reste en rail (sous 820 px). */
@media (min-width:761px) and (max-width:1023px){
  body[data-page="projet-affilia"] :is(.ec-af-tiles,.ec-af-ty,.ec-af-mo,.ec-af-apps,.ec-af-ctx).nk-rail:has(> :not([hidden])){
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    flex-flow:unset!important;
    align-items:stretch;
    gap:16px;
    overflow:visible!important;
    margin-inline:0!important;
    padding-inline:0!important;
    width:100%!important;
    max-width:100%!important;
    scroll-snap-type:none!important;
  }
  body[data-page="projet-affilia"] :is(.ec-af-tiles,.ec-af-ty,.ec-af-mo,.ec-af-apps,.ec-af-ctx).nk-rail > :not([hidden]){
    flex:none!important;
    width:auto!important;
    max-width:none!important;
    min-width:0!important;
    scroll-snap-align:unset!important;
    grid-column:auto!important;
  }
  body[data-page="projet-affilia"] .ec-af-apps .ec-af-fig,
  body[data-page="projet-affilia"] .ec-af-ctx .ec-af-fig{height:auto!important;aspect-ratio:4/3}
  body[data-page="projet-affilia"] .ec-af-mo > .ec-af-fig{aspect-ratio:1;height:auto!important;margin-inline:auto}
  body[data-page="projet-affilia"] .ec-af-mo > .ec-af-fig:has(img[src*="motif-banniere"]){max-width:422px!important}
  body[data-page="projet-affilia"] .ec-af-mo > .ec-af-fig:has(img[src*="motif-brochure-cercles"]){max-width:480px!important}
  body[data-page="projet-affilia"] .ec-af-mo > .ec-af-fig:has(img[src*="motif-brochure-x"]){max-width:563px!important}
  /* Le width:auto du rail bat un max-width plus faible : la tuile photo doit remplir sa cellule. */
  body[data-page="projet-affilia"] .ec-af-ty.nk-rail > .ec-af-ty-img{
    width:100%!important;
    max-width:min(100%,458px)!important;
    min-width:0!important;
    height:auto!important;
    min-height:0!important;
    aspect-ratio:458/255;
    justify-self:stretch;
    overflow:hidden;
  }
  body[data-page="projet-affilia"] .ec-af-ty.nk-rail > .ec-af-ty-img img{
    width:100%!important;
    height:100%!important;
    max-width:100%!important;
    max-height:255px!important;
    object-fit:cover;
  }
}
/* Fichiers 828×1792 et 1080×1920 : le cadre reste à 1× ou moins. */
body[data-slug="la-vie-d-un-vignoble-publication-apres-publication"] .ec-vignoble-phones figure.ec-phone:has(img[src*="rideau-1.webp"]),
body[data-slug="la-vie-d-un-vignoble-publication-apres-publication"] .ec-vignoble-phones figure.ec-phone:has(img[src*="rideau-3.webp"]){
  width:min(100%,828px)!important;
  max-width:min(100%,828px)!important;
  justify-self:center;
}
body[data-slug="la-vie-d-un-vignoble-publication-apres-publication"] .ec-h-v>.frame.ec-fit.ec-phone{
  width:min(100%,828px)!important;
  max-width:min(100%,828px)!important;
  margin-inline:auto;
}
body[data-slug="la-vie-d-un-vignoble-publication-apres-publication"] .ec-vignoble-phones figure.ec-phone:has(img[src*="rideau-1.webp"]) img,
body[data-slug="la-vie-d-un-vignoble-publication-apres-publication"] .ec-vignoble-phones figure.ec-phone:has(img[src*="rideau-3.webp"]) img{
  width:100%!important;
  max-width:min(100%,828px)!important;
  height:auto!important;
  max-height:1792px!important;
}
body[data-slug="la-vie-d-un-vignoble-publication-apres-publication"] .ec-h-v>.frame.ec-fit.ec-phone img{
  max-width:min(100%,828px)!important;
  max-height:1792px!important;
}
body[data-slug="defi-28-jours"] figure.ec-mandat-livrable:has(img[src*="defi-animation_d28j-affiche"]){
  width:min(100%,1080px)!important;
  max-width:min(100%,1080px)!important;
  justify-self:center;
}
body[data-slug="defi-28-jours"] figure.ec-mandat-livrable:has(img[src*="defi-animation_d28j-affiche"]) .frame{
  width:100%;
  max-width:min(100%,1080px);
  height:auto;
  max-height:1920px;
  aspect-ratio:1080/1920;
}
body[data-slug="defi-28-jours"] figure.ec-mandat-livrable:has(img[src*="defi-animation_d28j-affiche"]) img{
  width:100%!important;
  max-width:min(100%,1080px)!important;
  height:auto!important;
  max-height:1920px!important;
  object-fit:contain!important;
}