/* Le brief, l'image et ses formats partagent la même scène. */
/* Le titre et la campagne ont chacun leur place dès le premier écran.
   Les deux groupes de sens restent complets aux largeurs de recette. */
[aria-labelledby=c1] .v3-display:not(#_):not(#_):not(#_){font-size:clamp(55px,5.2vw,83.2px);line-height:1.06;max-width:100%}
@media(max-width:860px){[aria-labelledby=c1] .v3-display:not(#_):not(#_):not(#_){font-size:clamp(32px,10vw,54px);line-height:1.08}}
@media(max-width:360px){[aria-labelledby=c1] .v3-display:not(#_):not(#_):not(#_){font-size:30px}}
/* Sur les téléphones courts, conserver la campagne et son accès à l'écran. */
@media(max-width:860px) and (max-height:700px){
 main > [aria-labelledby=c1]:first-child > .r-heros-matiere:not(#_):not(#_):not(#_):not(#_){height:clamp(190px,34svh,238px)}
 main > [aria-labelledby=c1]:first-child .v3-label:not(#_):not(#_):not(#_){margin-bottom:10px}
 main > [aria-labelledby=c1]:first-child .v3-lead:not(#_):not(#_):not(#_){margin-top:14px}
 main > [aria-labelledby=c1]:first-child .v3-actions:not(#_):not(#_):not(#_){margin-top:16px}
}
.visual-fabrique>.v3-inner:not(#_):not(#_){gap:0}
.vf-scene{position:relative;min-height:clamp(340px,47svh,520px);margin-top:32px;isolation:isolate}
.vf-brief{box-sizing:border-box;max-width:46ch;min-height:inherit;padding:24px 0}
@media(min-width:701px){.vf-brief{width:calc(44% - 32px)}}
.vf-label{font-size:12px;line-height:1.5;letter-spacing:.1em;text-transform:uppercase;margin:0 0 20px}
.vf-brief .vf-concept{font-size:clamp(35px,3.5vw,51px);line-height:1.1;letter-spacing:-.025em;margin:0 0 24px}
.vf-brief>p:not(.vf-concept):not(.vf-label){font-size:17px;line-height:1.5;max-width:46ch}
.vf-creation{position:absolute;inset:0 0 0 44%;margin:0;transition:transform 640ms cubic-bezier(.22,1,.36,1),opacity 280ms}
.vf-creation img{display:block;object-fit:cover;object-position:65% 50%;width:100%;height:calc(100% - 28px)}
.vf-creation figcaption,.vf-formats figcaption{font-size:15px;line-height:1.5;margin-top:6px}
.visual-fabrique[data-etape=creation] .vf-creation{inset:0;transform:none}
.visual-fabrique[data-etape=creation] .vf-brief,.visual-fabrique[data-etape=formats] .vf-brief{visibility:hidden}
.vf-formats{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:24px;visibility:hidden;perspective:1400px}
.vf-formats figure{margin:0;min-width:0;flex:1}
.vf-formats img{display:block;width:100%;object-fit:cover;object-position:65% 50%}
.vf-paysage{flex:1.77!important}.vf-paysage img{aspect-ratio:16/9}
.vf-carre img{aspect-ratio:1}.vf-portrait{flex:.56!important}.vf-portrait img{aspect-ratio:9/16}
.visual-fabrique[data-etape=formats] .vf-creation{visibility:hidden}
.visual-fabrique[data-etape=formats] .vf-formats{visibility:visible}
.vf-commandes{display:flex;flex-wrap:wrap;align-items:center;gap:16px 28px;margin:24px 0 8px}
.vf-reset{background:none;border:0;border-bottom:1px solid currentColor;color:inherit;padding:10px 0;font:17px/1.5 inherit;min-height:44px;cursor:pointer}
.vf-statut{font-size:15px;line-height:1.5;margin:0;max-width:48ch}
.vf-commandes [hidden]{display:none}
img[src$="selune-lumiere-salee.webp"]{object-position:65% 50%}
@media(max-width:700px){
 .vf-scene{min-height:390px;margin-top:24px}
 .vf-brief{max-width:none;min-height:0;padding:0 0 20px}.vf-brief .vf-concept{font-size:35px;line-height:1.1;margin-bottom:16px}
 .vf-brief .vf-direction{margin-bottom:0}
 .vf-creation{position:relative;inset:auto;height:240px}
 .visual-fabrique[data-etape=brief] .vf-scene{min-height:0}
 .visual-fabrique[data-etape=creation] .vf-brief,.visual-fabrique[data-etape=formats] .vf-brief{display:none}
 .visual-fabrique[data-etape=creation] .vf-creation{height:390px}
 .visual-fabrique[data-etape=formats] .vf-creation{display:none}
 .vf-formats{gap:12px;flex-wrap:wrap;align-content:center;align-items:center}
 .vf-formats figure{flex-basis:28%!important}.vf-formats .vf-paysage{flex:0 0 100%!important}
 .vf-formats .vf-paysage img{max-height:190px}.vf-formats .vf-carre img{max-height:170px}.vf-formats .vf-portrait img{max-height:210px;width:auto;max-width:100%;margin:auto}
 .vf-commandes{gap:12px 20px}.vf-statut{flex-basis:100%}
}
@media(prefers-reduced-motion:reduce){.vf-scene *{transition:none!important}}
.reduce-motion .vf-scene *{transition:none!important}

/* La scène garde son emprise entre les étapes. Aucun cadre absolu ne dépasse
   sur le titre ou la commande, y compris sur un téléphone court. */
.visual-fabrique>.v3-inner:not(#_):not(#_){display:block;flex:none;width:100%}
.visual-fabrique .v3-head:not(#_):not(#_){flex:none;margin:0;align-items:end}
.vf-scene{height:clamp(340px,47svh,520px);min-height:0}
.vf-brief{min-height:0}
.vf-commandes{min-height:94px;margin-top:28px}
.vf-commandes>.vf-statut{max-width:44ch}
@media(max-width:700px){
 .visual-fabrique:not(#_):not(#_){padding-block:76px 28px;min-height:100svh;height:auto}
 .visual-fabrique .v3-head:not(#_):not(#_){gap:12px;margin:0}
 .visual-fabrique .v3-head .v3-label{margin-bottom:12px}
 .visual-fabrique .v3-head .v3-lead:not(#_):not(#_){font-size:17px;line-height:1.45;margin:0}
 .vf-scene,.visual-fabrique[data-etape=brief] .vf-scene{height:360px;min-height:360px;margin-top:24px}
 .vf-brief{height:100%;padding:24px 0 0}
 .vf-brief .vf-label{margin-bottom:20px}
 .vf-brief .vf-concept{font-size:35px;line-height:1.1;margin-bottom:20px}
 .vf-brief>p:not(.vf-label):not(.vf-concept){font-size:17px;line-height:1.5}
 .visual-fabrique[data-etape=brief] .vf-creation{display:none}
 .visual-fabrique[data-etape=creation] .vf-creation{position:absolute;inset:0;height:100%}
 .vf-creation img{height:calc(100% - 28px);object-fit:contain}
 .vf-formats{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:172px 176px;gap:12px;align-items:center;align-content:start}
 .vf-formats figure{display:flex;flex-direction:column;justify-content:center;max-height:100%;height:100%;min-height:0}
 .vf-formats .vf-paysage{grid-column:1/-1}
 .vf-formats img{min-height:0;object-fit:contain;flex:1 1 0;height:0;max-height:none;width:100%;aspect-ratio:auto}
 .vf-formats .vf-portrait img{width:100%;max-height:none}
 .vf-formats figcaption{flex:none;margin:6px 0 0;font-size:15px;line-height:1.4}
 .vf-commandes{display:block;min-height:128px;margin:20px 0 8px}
 .vf-commandes>.vf-statut{margin-top:10px;font-size:15px;line-height:1.5}
}

@media(max-width:700px){.vf-formats .vf-carre img{width:148px;height:148px;flex:0 0 148px;max-width:100%;align-self:center;object-fit:cover;object-position:68% 50%}}

@media(min-width:701px){
 .vf-formats{max-width:calc((clamp(340px,47svh,520px) - 28px) * 3.34 + 48px);margin-inline:auto}
 .vf-formats img{height:auto}
}

.visual-collaboration>.v3-inner:not(#_):not(#_){justify-content:center;gap:36px}
.visual-collaboration .v3-head:not(#_):not(#_){flex:0 0 auto;align-items:end;margin:0}
.visual-collaboration .v3-carousel{flex:0 0 auto}

@media(max-width:700px) and (max-height:740px){
 .visual-fabrique:not(#_):not(#_){padding-block:56px 20px}
 .visual-fabrique .v3-head .v3-intitule-source{display:none}
 .visual-fabrique .v3-head .v3-lead:not(#_):not(#_){font-size:15px;line-height:1.5}
 .vf-scene,.visual-fabrique[data-etape=brief] .vf-scene{height:244px;min-height:244px;margin-top:16px}
 .vf-brief{padding-top:12px}.vf-brief .vf-concept{font-size:29px;line-height:1.1;margin-bottom:12px}
 .vf-brief .vf-label{margin-bottom:12px}.vf-brief>p:not(.vf-label):not(.vf-concept){font-size:15px;line-height:1.5;margin:0}
 .vf-formats{grid-template-rows:116px 116px;gap:12px}
 .vf-formats .vf-carre img{width:89px;height:89px;flex-basis:89px}
 .vf-commandes{margin-top:16px;min-height:120px}
}

/* Les familles montrent des livrables différents, jusque dans leur composition. */
.visual-livrables .v3-media:not(#_):not(#_){height:clamp(156px,28svh,270px);position:relative;overflow:hidden;flex:none;margin:0 0 20px}
.visual-livrables .v3-media img:not(#_):not(#_){width:100%;height:100%;object-fit:cover;object-position:66% 50%}
.vl-identite{display:flex;flex-direction:column;align-items:center;justify-content:center;background:#f8f3e7;color:#383a2d}
.vl-identite strong{font-family:Georgia,serif;font-weight:400;font-size:clamp(35px,3.5vw,48px);letter-spacing:.15em;line-height:1;margin-left:.15em}
.vl-monogramme{font:italic 24px/1 Georgia,serif;border:1px solid #7e8068;border-radius:50%;width:36px;height:36px;display:grid;place-items:center;margin-bottom:20px}
.vl-signature{font-size:12px;letter-spacing:.18em;margin-top:14px}
.vl-trait{width:32px;height:1px;background:#7e8068;margin-top:20px}
.vl-campagne::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#142d3b99,transparent 72%);pointer-events:none}
.vl-campagne figcaption{position:absolute;inset:20px;z-index:1;color:#fff8ea;display:flex;flex-direction:column;justify-content:space-between}
.vl-campagne figcaption span{font:17px/1.2 Georgia,serif;letter-spacing:.12em}
.vl-campagne figcaption strong{font:400 clamp(24px,2.5vw,34px)/1.03 Georgia,serif;letter-spacing:-.02em}
.vl-mouvement img{position:absolute;inset:0}.vl-mouvement img:not(:first-child){opacity:0}
.vl-mouvement figcaption{position:absolute;z-index:2;inset:auto 20px 20px;color:#fff8ea;font:24px/1.1 Georgia,serif;letter-spacing:.14em;text-shadow:0 1px 6px #142d3b}
.vl-mouvement figcaption span{display:block;margin-top:8px;font:15px/1.4 Archivo,Arial,sans-serif;letter-spacing:0}
.vl-course{position:absolute;z-index:3;left:0;bottom:0;width:100%;height:3px;background:var(--n-paper);transform:scaleX(0);transform-origin:left}
.vl-lancer{border:0;padding:0;background:none;cursor:pointer;text-align:left;align-self:flex-start;font-family:inherit;margin-top:12px}
@media(max-width:860px){
 .visual-livrables .v3-media:not(#_):not(#_){height:clamp(140px,19svh,176px);margin-bottom:14px}
 .vl-identite strong{font-size:32px}.vl-monogramme{width:26px;height:26px;font-size:20px;margin-bottom:10px}.vl-signature{margin-top:10px}.vl-trait{margin-top:10px}
 .vl-campagne figcaption{inset:14px}.vl-campagne figcaption strong{font-size:25px}
}