@font-face{font-family:Ppneuemontreal;font-weight:400;font-style:normal;font-display:swap;
src:url("https://wf-cache.finary.com/64fb4d9ac1d7723434b54019/6508ad71f9095b350dcf6395_PPNeueMontreal-Regular.woff2") format("woff2")}
@font-face{font-family:Pptelegraf;font-weight:400;font-style:normal;font-display:swap;
src:url("https://wf-cache.finary.com/64fb4d9ac1d7723434b54019/6508aeb11c19e324fb851f72_PPTelegraf-Regular.woff2") format("woff2")}
#finary-actifs {
--n900: #f5f6f7;
--e: cubic-bezier(0.22, 1, 0.36, 1);
--txt2: #adb0b8;
--txt3: #6c717a;
--brand: #f1c086;
--or-2: #cfa370;
--fond: #000000;
--tuile: #151318;
--tuile-pleine: #151318;
--tuile-px: 70px;
--tuile-gap: 14px;
position: relative;
color: var(--n900);
background: var(--fond);
font-family: Ppneuemontreal, -apple-system, BlinkMacSystemFont, 'Helvetica Neue', sans-serif;
font-size: 16px;
font-weight: 400;
line-height: 1.5;
letter-spacing: normal;
text-align: left;
text-transform: none;
white-space: normal;
word-spacing: normal;
-webkit-text-size-adjust: 100%;
-webkit-font-smoothing: antialiased;
}
#finary-actifs, #finary-actifs *, #finary-actifs *::before, #finary-actifs *::after { box-sizing: border-box; }
#finary-actifs .fa {
position: relative;
overflow: hidden;
padding: 104px 24px;
background: var(--fond);
}
#finary-actifs .fa::after {
content: "";
position: absolute;
inset: 0;
pointer-events: none;
opacity: 0.055;
mix-blend-mode: overlay;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23g)'/%3E%3C/svg%3E");
background-size: 160px 160px;
}
#finary-actifs .fa-wrap {
display: grid;
grid-template-columns: minmax(0, 1fr) auto;
align-items: center;
gap: 72px;
max-width: 1180px;
margin: 0 auto;
}
#finary-actifs .fa-texte { max-width: 534px; }
#finary-actifs .fa-titre {
margin: 0 0 20px;
color: var(--n900);
font-family: Pptelegraf, sans-serif;
font-size: 56px;
line-height: 64px;
font-weight: 400;
text-align: left;
}
#finary-actifs .fa-lead {
max-width: 42ch;
margin: 0 0 36px;
color: #959ba4;
font-family: Ppneuemontreal, sans-serif;
font-size: 18px;
line-height: 140%;
text-align: left;
}
#finary-actifs .fa-treillis {
display: grid;
grid-template-columns: repeat(7, var(--tuile-px));
grid-auto-rows: var(--tuile-px);
gap: var(--tuile-gap);
}
#finary-actifs .fa-t {
grid-column: var(--c);
grid-row: var(--r);
display: grid;
place-items: center;
border-radius: 22%;
background: var(--tuile);
opacity: var(--o, 1);
}
#finary-actifs .fa-t.pleine {
background: var(--tuile-pleine);
--o: 1;
overflow: hidden;
}
#finary-actifs .fa-ic {
display: block;
width: 100%;
height: 100%;
max-width: none;
vertical-align: baseline;
border-radius: 22%;
transform: scale(1.38);
transform-origin: 100% 0%;
transition: transform 500ms var(--e), opacity 500ms var(--e);
will-change: transform;
}
@media (hover: hover) and (pointer: fine) {
#finary-actifs .fa-t.pleine:hover .fa-ic { transform: scale(1); }
}
#finary-actifs .fa-t.coeur {
--o: 1;
background: none;
box-shadow: none;
}
#finary-actifs .fa-marque {
display: block;
width: 100%;
height: 100%;
max-width: none;
vertical-align: baseline;
transition: opacity 500ms var(--e);
filter: drop-shadow(0 1px 2px rgba(19, 19, 20, 0.16))
drop-shadow(0 16px 26px rgba(19, 19, 20, 0.24));
}
#finary-actifs .fa-cta {
display: flex;
align-items: center;
justify-content: center;
width: max-content;
margin: 0;
padding: 24px 48px;
border: 0;
border-radius: 48px;
background: #f4be7e;
color: #141415;
text-decoration: none;
white-space: nowrap;
font-size: 14px;
line-height: 18px;
font-weight: 500;
cursor: pointer;
transition: background-color 200ms ease;
}
#finary-actifs .fa-cta:hover { background: #cfa370; }
#finary-actifs .fa-cta:focus-visible { outline: 2px solid var(--n900); outline-offset: 3px; }
@media (max-width: 1100px) {
#finary-actifs { --tuile-px: 62px; --tuile-gap: 12px; }
#finary-actifs .fa-wrap { gap: 48px; }
}
@media (max-width: 860px) {
#finary-actifs .fa { padding: 64px 48px; }
#finary-actifs .fa-wrap { grid-template-columns: minmax(0, 1fr); justify-items: center; gap: 40px; }
#finary-actifs .fa-texte { max-width: 560px; text-align: center; }
#finary-actifs .fa-titre, #finary-actifs .fa-lead { text-align: center; }
#finary-actifs .fa-lead { margin-left: auto; margin-right: auto; }
#finary-actifs .fa-cta { margin: 0 auto; }
}
@media (max-width: 700px) {
#finary-actifs .fa { padding: 64px 24px; }
#finary-actifs .fa-titre { font-size: 48px; line-height: 56px; }
#finary-actifs { --tuile-px: 62px; --tuile-gap: 12px; }
}
@media (prefers-reduced-motion: reduce) {
#finary-actifs .fa-cta { transition: none; }
}