.brand-stage{--brand-ink:#151923;--brand-line:#465c7c26;--brand-card:#fff;--brand-muted:#5b6980;padding-block:clamp(24px,4vw,56px) clamp(40px,6vw,88px);overflow-x:clip}:where(.dark) .brand-stage{--brand-ink:#f1f4f8;--brand-line:#ffffff1f;--brand-card:#0a0b10;--brand-muted:#9aa5ba}.brand-word{text-align:center;font-family:var(--font-instrument);letter-spacing:-.02em;white-space:nowrap;color:#0000;background-image:url(/images-solutions/branding-identite-visuelle-studio.webp);background-position:50%;background-size:cover;-webkit-background-clip:text;background-clip:text;margin:0;padding:0 3vw .3em;font-size:30vw;line-height:1.05;position:relative}:where(.dark) .brand-word{-webkit-text-stroke:1px #ffffff47;background-image:linear-gradient(#ffffff38,#ffffff38),url(/images-solutions/branding-supports-communication-studio.webp)}.brand-word:after{content:none}.brand-rows{gap:clamp(14px,2vw,24px);width:min(1160px,100% - 35px);margin:clamp(24px,4vw,48px) auto 0;display:grid}.brand-row{border:1px solid var(--brand-line);background:var(--brand-card);border-radius:28px;gap:12px;padding:clamp(16px,2vw,24px);display:grid}.brand-swatches{grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;display:grid}.brand-swatch{letter-spacing:.04em;color:#fff;border-radius:18px;align-items:flex-end;min-height:clamp(84px,14vw,150px);padding:12px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px;font-weight:700;display:flex}.brand-swatch[data-light]{color:#12131a}.brand-type{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;display:grid}.brand-type>div{background:var(--brand-line);min-height:clamp(96px,14vw,150px);color:var(--brand-ink);border-radius:18px;align-content:center;gap:6px;padding:8px 16px;display:grid}.brand-type b{font-size:clamp(54px,8vw,104px);font-weight:700;line-height:.9}.brand-type .brand-serif{font-family:var(--font-instrument);font-style:italic;font-weight:400}.brand-type small{letter-spacing:.04em;color:var(--brand-muted);font-size:12px;font-weight:600}.brand-logos{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;display:grid}.brand-logo{border:1px solid var(--brand-line);color:#12131a;background:#fff;border-radius:18px;place-items:center;min-height:clamp(84px,12vw,130px);display:grid}.brand-logo[data-tone=ink]{color:#fff;background:#12131a}.brand-logo[data-tone=coral]{color:#12131a;background:#ff4d5e}.brand-logo[data-tone=blue]{color:#fff;background:#0000b6}.brand-logo span{font-family:var(--font-instrument);align-items:center;gap:.5em;font-size:clamp(18px,2vw,28px);display:inline-flex}.brand-logo svg{width:1.7em;height:auto}@media (width<=767px){.brand-swatches{grid-template-columns:repeat(6,minmax(0,1fr))}.brand-swatch{grid-column:span 2}.brand-swatch:nth-child(n+4){grid-column:span 3}.brand-logos{grid-template-columns:repeat(2,minmax(0,1fr))}.brand-type{grid-template-columns:1fr}}@media (prefers-reduced-motion:no-preference){@supports (animation-timeline:view()){.brand-row{animation-timing-function:linear;animation-fill-mode:both;animation-timeline:view();animation-range:cover cover 35%}.brand-row-1,.brand-row-3{animation-name:brand-from-left}.brand-row-2{animation-name:brand-from-right}}}@media (prefers-reduced-motion:no-preference) and (width>=1024px){@supports (animation-timeline:view()){.brand-stage{view-timeline:--brand block;height:260svh;padding-block:0}.brand-pin{height:100svh;position:sticky;top:0;overflow:clip}.brand-word{text-align:left;transform-origin:0 0;padding:0 0 .3em;font-size:4.6vw;line-height:1;animation-name:brand-word;animation-timing-function:linear;animation-fill-mode:both;animation-timeline:--brand;animation-range:contain;position:absolute;top:96px;left:max(17.5px,50vw - 580px)}.brand-word:after{content:attr(data-text);color:var(--brand-ink);-webkit-text-stroke:0;animation-name:brand-solid;animation-timing-function:linear;animation-fill-mode:both;animation-timeline:--brand;animation-range:contain;position:absolute;inset:0}.brand-rows{grid-template-rows:1fr 1.25fr 1fr;gap:min(2.2svh,20px);height:calc(100svh - 4.6vw - 160px);margin:0;position:absolute;top:calc(4.6vw + 132px);left:50%;translate:-50%}.brand-row{align-content:center;padding-block:10px;animation-timeline:--brand}.brand-row-1{animation-name:brand-pin-left;animation-range:contain 20% contain 34%}.brand-row-2{animation-name:brand-pin-right;animation-range:contain 27% contain 41%}.brand-row-3{animation-name:brand-pin-left;animation-range:contain 34% contain 48%}.brand-swatch,.brand-logo,.brand-type>div{height:100%;min-height:0}.brand-type b{font-size:min(8vw,12svh)}.brand-row{grid-template-rows:minmax(0,1fr)}.brand-swatches,.brand-type,.brand-logos{grid-template-rows:minmax(0,1fr);height:100%}}}@keyframes brand-word{0%,8%{animation-timing-function:cubic-bezier(.4,0,.15,1);translate:min(3vw - 17.5px,580px - 47vw) calc(50svh - 15.6vw - 96px);scale:6.8}26%,to{translate:0;scale:1}}@keyframes brand-pin-left{0%{opacity:0;transform:translate(-9vw)}to{opacity:1;transform:none}}@keyframes brand-pin-right{0%{opacity:0;transform:translate(9vw)}to{opacity:1;transform:none}}@keyframes brand-solid{0%,12%{opacity:0}26%,to{opacity:1}}@keyframes brand-from-left{0%{transform:translate(-4vw)}to{transform:none}}@keyframes brand-from-right{0%{transform:translate(4vw)}to{transform:none}}@media (width<=767px){@keyframes brand-from-left{0%{transform:translate(-14px)}to{transform:none}}@keyframes brand-from-right{0%{transform:translate(14px)}to{transform:none}}}.brand-sec{overflow-x:clip}.brand-chip{width:64px;height:64px;font-family:var(--font-instrument);color:#fff;border-radius:18px;place-items:center;font-size:30px;font-style:italic;font-weight:700;display:grid}.brand-chip[data-tone=coral]{color:#12131a;background:#ff4d5e}.brand-chip[data-tone=cyan]{color:#12131a;background:#17b6ff}.brand-chip[data-tone=citron]{color:#12131a;background:#ffe45c}.brand-chip[data-tone=ink]{background:#12131a}.brand-chip[data-tone=blue]{background:#0000b6}@media (prefers-reduced-motion:no-preference){@supports (animation-timeline:view()){.brand-in-left,.brand-in-right{animation-timing-function:linear;animation-fill-mode:both;animation-timeline:view();animation-range:cover cover 35%}.brand-in-left{animation-name:brand-sec-left}.brand-in-right{animation-name:brand-sec-right}}}@keyframes brand-sec-left{0%{transform:translate(-4vw)}to{transform:none}}@keyframes brand-sec-right{0%{transform:translate(4vw)}to{transform:none}}@media (width<=767px){@keyframes brand-sec-left{0%{transform:translate(-14px)}to{transform:none}}@keyframes brand-sec-right{0%{transform:translate(14px)}to{transform:none}}}