.content-page{max-width:1120px}.content-page>.article>h1{max-width:900px}.content-page .article-lead{max-width:750px}.content-page .article>section{max-width:820px}.content-note{font-size:12px;line-height:1.7;color:#526174;max-width:780px;margin:20px 0 38px}.example-card{display:grid;grid-template-columns:1fr 1fr;gap:40px;padding:38px 0;border-top:1px solid var(--line)}.example-visual{min-height:340px;background:#edf2f5;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:24px;border-radius:14px}.example-visual canvas{display:block;width:auto;max-width:100%;height:auto;max-height:330px;object-fit:contain;box-shadow:0 6px 22px #15213114}.example-visual button{font:inherit;font-size:13px;font-weight:700;color:#101820;background:#fff;border:1px solid #d6dfe5;padding:11px 20px;border-radius:7px;cursor:pointer}.example-description h2{margin-top:0!important}.example-description p{font-size:14px;line-height:1.8;color:#526174}.preset-specs{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:22px 0}.preset-specs dt{font-size:11px;color:#526174}.preset-specs dd{font-size:14px;font-weight:700;margin:5px 0 0}.content-page ol{font-size:14px;line-height:1.9;color:#526174;padding-left:24px}.content-page li{padding-left:4px;margin:12px 0}.content-page .download-button{display:inline-flex;margin:16px 0;font-size:13px}.table-scroll{overflow-x:auto}.content-page table{min-width:400px}.content-page td a{text-decoration:underline}.how-copy>a+a{display:block;margin-top:12px}html[lang="fr"] .intro h1{font-size:clamp(48px,6.8vw,94px)}@media(max-width:650px){.example-card{grid-template-columns:1fr;gap:26px}.example-visual{min-height:280px}.example-visual canvas{max-height:300px}.content-page .main-nav{gap:14px}.preset-specs{gap:12px}.content-page .article>h1{font-size:36px}html[lang="fr"] .intro h1{font-size:43px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

@media(max-width:700px){.main-nav{gap:16px}.main-nav a[href="/guides/"]{display:none}.main-nav a[href="/examples/"],.main-nav a[href="/fr/exemples/"],.main-nav a:last-child{display:block;font-size:12px}.example-player.example-visual{min-height:250px}.header .logo{font-size:23px}}
.article a.download-button{color:#101b29;text-decoration:none;font-weight:700}.article a.download-button:hover{color:#081320}
