@media(min-width: 1200px) {
   .hidden-1avdukk {
      display: none !important
   }
}

@media(min-width: 810px) and (max-width: 1199.98px) {
   .hidden-qq7i06 {
      display: none !important
   }
}

@media(max-width: 809.98px) {
   .hidden-428kol {
      display: none !important
   }
}

@media(max-width: 809.98px) {
   .hidden-hbbylz {
      display: none !important
   }
}

@media(min-width: 810px) and (max-width: 1199.98px) {
   .hidden-10bfaa4 {
      display: none !important
   }
}

@media(min-width: 1200px) {
   .hidden-9jza5 {
      display: none !important
   }
}

.framer-8rx25.framer-17tm096,
.framer-8rx25 .framer-17tm096 {
   display: block
}

.framer-8rx25.framer-1avdukk {
   height: min-content;
   overflow: var(--overflow-clip-fallback, clip);
   flex-flow: column;
   place-content: center flex-start;
   align-items: center;
   gap: 0;
   width: 1200px;
   padding: 0;
   display: flex;
   position: relative
}

.framer-8rx25 .framer-1lmri52 {
   max-width: 1120px;
   height: min-content;
   overflow: var(--overflow-clip-fallback, clip);
   flex-flow: column;
   flex: none;
   place-content: center flex-start;
   align-items: center;
   gap: 56px;
   width: 100%;
   padding: 128px 48px;
   display: flex;
   position: relative
}

.framer-8rx25 .framer-1hkkcxw {
   height: min-content;
   overflow: var(--overflow-clip-fallback, clip);
   flex-flow: column;
   flex: none;
   place-content: flex-start;
   align-items: flex-start;
   gap: 32px;
   width: 100%;
   padding: 0;
   display: flex;
   position: relative
}

.framer-8rx25 .framer-kan86p {
   height: min-content;
   overflow: var(--overflow-clip-fallback, clip);
   flex-flow: row;
   flex: none;
   place-content: center flex-start;
   align-items: center;
   gap: 12px;
   width: min-content;
   padding: 0;
   display: flex;
   position: relative
}

.framer-8rx25 .framer-7e0rtl {
   height: min-content;
   overflow: var(--overflow-clip-fallback, clip);
   will-change: var(--framer-will-change-override, transform);
   background-color: #e9fcff;
   border-radius: 6px;
   flex-flow: row;
   flex: none;
   place-content: center;
   align-items: center;
   gap: 0;
   width: min-content;
   padding: 7px 10px;
   display: flex;
   position: relative
}

.framer-8rx25 .framer-178ohia,
.framer-8rx25 .framer-17xt5g6,
.framer-8rx25 .framer-130n4e5,
.framer-8rx25 .framer-1x3itte {
   white-space: pre;
   flex: none;
   width: auto;
   height: auto;
   position: relative
}

.framer-8rx25 .framer-atjf4x {
   --framer-text-wrap: balance;
   white-space: pre-wrap;
   word-break: break-word;
   word-wrap: break-word;
   flex: none;
   width: 100%;
   max-width: 820px;
   height: auto;
   position: relative
}

.framer-8rx25 .framer-f9oopq {
   --framer-text-wrap: balance;
   white-space: pre-wrap;
   word-break: break-word;
   word-wrap: break-word;
   flex: none;
   width: 100%;
   max-width: 620px;
   height: auto;
   position: relative
}

.framer-8rx25 .framer-1hrfc9v {
   height: 420px;
   overflow: var(--overflow-clip-fallback, clip);
   will-change: var(--framer-will-change-override, transform);
   border-radius: 12px;
   flex: none;
   width: 100%;
   position: relative
}

.framer-8rx25 .framer-gln7zt {
   --framer-paragraph-spacing: 28px;
   white-space: pre-wrap;
   word-break: break-word;
   word-wrap: break-word;
   flex: none;
   width: 100%;
   max-width: 680px;
   height: auto;
   position: relative
}

.framer-8rx25 .framer-1akl9mx {
   --border-bottom-width: 0px;
   --border-color: #00000014;
   --border-left-width: 0px;
   --border-right-width: 0px;
   --border-style: solid;
   --border-top-width: 1px;
   max-width: 680px;
   height: min-content;
   overflow: var(--overflow-clip-fallback, clip);
   flex-flow: row;
   flex: none;
   place-content: center flex-end;
   align-items: center;
   width: 100%;
   padding: 32px 0 0;
   display: flex;
   position: relative
}

.framer-8rx25 .framer-p3rv88 {
   --1m6trwb: 0;
   --21h8s6: #000;
   --pgex8v: 1.5;
   aspect-ratio: 1;
   height: var(--framer-aspect-ratio-supported, 24px);
   flex: none;
   width: 24px;
   position: relative
}

.framer-7pd5f .framer-styles-preset-ip2010:not(.rich-text-wrapper),
.framer-7pd5f .framer-styles-preset-ip2010.rich-text-wrapper h4 {
   --framer-font-family: "Inter", "Inter Placeholder", sans-serif;
   --framer-font-family-bold: "Inter", sans-serif;
   --framer-font-family-bold-italic: "Inter", sans-serif;
   --framer-font-family-italic: "Inter", "Inter Placeholder", sans-serif;
   --framer-font-open-type-features: "blwf" on, "cv03" on, "cv04" on, "cv09" on, "cv11" on;
   --framer-font-size: 22px;
   --framer-font-style: normal;
   --framer-font-style-bold: normal;
   --framer-font-style-bold-italic: italic;
   --framer-font-style-italic: italic;
   --framer-font-variation-axes: normal;
   --framer-font-weight: 700;
   --framer-font-weight-bold: 900;
   --framer-font-weight-bold-italic: 900;
   --framer-font-weight-italic: 700;
   --framer-letter-spacing: -.04em;
   --framer-line-height: 1.4em;
   --framer-paragraph-spacing: 40px;
   --framer-text-alignment: start;
   --framer-text-color: #000;
   --framer-text-decoration: none;
   --framer-text-stroke-color: initial;
   --framer-text-stroke-width: initial;
   --framer-text-transform: none
}

.framer-g1qRI .framer-styles-preset-yezh60:not(.rich-text-wrapper),
.framer-g1qRI .framer-styles-preset-yezh60.rich-text-wrapper h5 {
   --framer-font-family: "Inter", "Inter Placeholder", sans-serif;
   --framer-font-family-bold: "Inter", sans-serif;
   --framer-font-family-bold-italic: "Inter", sans-serif;
   --framer-font-family-italic: "Inter", "Inter Placeholder", sans-serif;
   --framer-font-open-type-features: "blwf" on, "cv03" on, "cv04" on, "cv09" on, "cv11" on;
   --framer-font-size: 18px;
   --framer-font-style: normal;
   --framer-font-style-bold: normal;
   --framer-font-style-bold-italic: italic;
   --framer-font-style-italic: italic;
   --framer-font-variation-axes: normal;
   --framer-font-weight: 700;
   --framer-font-weight-bold: 900;
   --framer-font-weight-bold-italic: 900;
   --framer-font-weight-italic: 700;
   --framer-letter-spacing: -.04em;
   --framer-line-height: 1.4em;
   --framer-paragraph-spacing: 40px;
   --framer-text-alignment: start;
   --framer-text-color: #000;
   --framer-text-decoration: none;
   --framer-text-stroke-color: initial;
   --framer-text-stroke-width: initial;
   --framer-text-transform: none
}

.framer-cYAhq .framer-styles-preset-vwx48q:not(.rich-text-wrapper),
.framer-cYAhq .framer-styles-preset-vwx48q.rich-text-wrapper code {
   --framer-code-font-family: "Fragment Mono", monospace;
   --framer-code-font-style: normal;
   --framer-code-font-weight: 400;
   --framer-code-text-color: #111;
   --framer-font-size-scale: 1;
   background-color: #00000014;
   border-radius: 6px;
   padding: .1em .2em
}

.framer-8rx25[data-border=true]:after,
.framer-8rx25 [data-border=true]:after {
   content: "";
   border-width: var(--border-top-width, 0)var(--border-right-width, 0)var(--border-bottom-width, 0)var(--border-left-width, 0);
   border-color: var(--border-color, none);
   border-style: var(--border-style, none);
   box-sizing: border-box;
   border-radius: inherit;
   corner-shape: inherit;
   pointer-events: none;
   width: 100%;
   height: 100%;
   position: absolute;
   top: 0;
   left: 0
}

@media (min-width:810px) and (max-width:1199.98px) {
   .framer-8rx25.framer-1avdukk {
      width: 810px
   }

   .framer-8rx25 .framer-1lmri52 {
      gap: 48px;
      padding: 112px 40px
   }

   .framer-8rx25 .framer-1hrfc9v {
      height: 340px
   }
}

@media (max-width:809.98px) {
   .framer-8rx25.framer-1avdukk {
      width: 390px
   }

   .framer-8rx25 .framer-1lmri52 {
      gap: 40px;
      padding: 96px 24px
   }

   .framer-8rx25 .framer-1hkkcxw {
      gap: 24px
   }

   .framer-8rx25 .framer-kan86p {
      flex-wrap: wrap
   }

   .framer-8rx25 .framer-1hrfc9v {
      height: 220px
   }

   .framer-8rx25 .framer-1akl9mx {
      place-content: flex-start space-between;
      align-items: flex-start
   }
}

.framer-eivmu {
   -webkit-mask: var(--framer-icon-mask);
   aspect-ratio: 1;
   -webkit-mask: var(--framer-icon-mask);
   mask: var(--framer-icon-mask);
   width: 24px;
   display: block
}

/* Hero cliquable : logo du projet + bouton vers l'application hébergée */
.drz-logo-hero {
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   gap: 28px;
   width: 100%;
   max-width: 1120px;
   margin: 0 auto 48px;
   padding: 56px 24px;
   background: rgb(250, 250, 250);
   border-radius: 16px;
   box-sizing: border-box;
   text-decoration: none;
   transition: background .2s ease
}

.drz-logo-hero img {
   width: 260px;
   height: auto;
   transition: transform .2s ease
}

.drz-hero-cta {
   display: inline-flex;
   align-items: center;
   gap: 8px;
   background: rgb(247, 250, 190);
   color: #111;
   font-size: 15px;
   font-weight: 600;
   letter-spacing: -.01em;
   line-height: 1;
   padding: 14px 22px;
   border-radius: 10px;
   border: 1px solid rgba(0, 0, 0, .08);
   transition: background .2s ease, box-shadow .2s ease
}

a.drz-logo-hero:hover {
   background: rgb(246, 246, 246)
}

a.drz-logo-hero:hover img {
   transform: translateY(-3px)
}

a.drz-logo-hero:hover .drz-hero-cta {
   background: rgb(238, 244, 150);
   box-shadow: 0 2px 10px rgba(0, 0, 0, .08)
}

a.drz-logo-hero:focus-visible {
   outline: 2px solid #111;
   outline-offset: 3px
}

@media(prefers-reduced-motion:reduce) {

   .drz-logo-hero,
   .drz-logo-hero img,
   .drz-hero-cta {
      transition: none
   }

   a.drz-logo-hero:hover img {
      transform: none
   }
}

@media(max-width:809.98px) {
   .drz-logo-hero {
      padding: 36px 20px;
      margin-bottom: 32px;
      gap: 22px
   }

   .drz-logo-hero img {
      width: 180px
   }

   .drz-hero-cta {
      font-size: 14px;
      padding: 12px 18px;
      text-align: center
   }
}

/* Figures dans le corps de l'article */
.drz-art-fig {
   width: 100%;
   margin: 12px 0 4px;
   box-sizing: border-box
}

.drz-art-fig img {
   display: block;
   width: auto;
   max-width: 100%;
   max-height: 70vh;
   height: auto;
   margin: 0 auto;
   border-radius: 12px;
   background: #fff
}

.drz-art-fig--qr img {
   width: 240px;
   max-width: 240px
}

.drz-art-figcap {
   font-size: 14px;
   line-height: 1.5;
   color: #777;
   margin-top: 10px;
   text-align: center
}

/* Formules (KaTeX) */
/* Framer impose white-space:pre-wrap a .framer-text ; le saut de ligne avant
   </div> se voyait alors comme une ligne vide sous la formule. */
.drz-math {
   width: 100%;
   overflow-x: auto;
   padding: 4px 0;
   font-size: 18px;
   color: #111;
   white-space: normal
}

.drz-math .katex-display {
   margin: 6px 0
}

/* Fix : le conteneur meta (chip + date) était width:min-content, trop étroit. */
.framer-kan86p {
   width: auto !important
}

/* Tableau d'entrée avec notes en étoiles (déborde la colonne de texte de 680px) */
.drz-table-wrap {
   position: relative;
   left: 50%;
   transform: translateX(-50%);
   width: min(1024px, calc(100vw - 48px));
   overflow-x: auto;
   margin: 16px 0 6px;
   -webkit-overflow-scrolling: touch
}

.drz-star-table {
   border-collapse: collapse;
   width: 100%;
   min-width: 640px;
   font-size: 14px;
   line-height: 1.3
}

.drz-star-table th,
.drz-star-table td {
   padding: 8px 12px;
   border-bottom: 1px solid #ededed;
   text-align: center;
   white-space: nowrap
}

.drz-star-table thead th {
   font-size: 12px;
   font-weight: 600;
   color: #666;
   letter-spacing: -0.01em;
   border-bottom: 1px solid #d9d9d9;
   vertical-align: bottom
}

.drz-star-table tbody th {
   text-align: left;
   font-weight: 500;
   color: #111
}

.drz-star-table thead th:first-child {
   text-align: left
}

.drz-star-table tbody tr:last-child th,
.drz-star-table tbody tr:last-child td {
   border-bottom: none
}

.drz-stars {
   color: #111;
   letter-spacing: .5px
}

.drz-stars i {
   font-style: normal;
   color: #d8d8d8
}

@media(max-width:809.98px) {
   .drz-star-table {
      font-size: 13px;
      min-width: 600px
   }

   .drz-star-table th,
   .drz-star-table td {
      padding: 7px 9px
   }
}

/* Légendes hors .drz-art-fig (tableaux) : même style que les légendes de figures */
.framer-gln7zt .drz-art-figcap {
   font-size: 14px;
   line-height: 1.5;
   color: #777;
   margin-top: 10px;
   text-align: center
}

/* Figure large : déborde la colonne de texte (captures d'écran détaillées) */
.drz-art-fig--wide {
   position: relative;
   left: 50%;
   transform: translateX(-50%);
   width: min(1024px, calc(100vw - 48px))
}

.drz-art-fig--wide img {
   width: 100%;
   max-height: none;
   border: 1px solid #ededed
}

/* Puce de catégorie : width:min-content rognait les libellés de deux mots. */
.framer-7e0rtl {
   width: auto !important
}

.framer-7e0rtl .framer-text {
   white-space: nowrap
}

/* Blocs de code / sorties de terminal (pleine largeur de la colonne de texte) */
.drz-code {
   display: block;
   box-sizing: border-box;
   width: 100%;
   margin: 14px 0 6px;
   padding: 16px 18px;
   overflow-x: auto;
   background: #fafafa;
   border: 1px solid #ededed;
   border-radius: 10px;
   font-family: "Fragment Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
   font-size: 13px;
   line-height: 1.6;
   color: #111;
   white-space: pre;
   -webkit-overflow-scrolling: touch;
   tab-size: 2
}

.drz-code b {
   font-weight: 600
}

.drz-code i {
   font-style: normal;
   color: #8a8a8a
}

@media(max-width:809.98px) {
   .drz-code {
      font-size: 12px;
      padding: 14px
   }
}

/* Tableau documentaire (texte à gauche, deux colonnes) */
.drz-doc-table {
   border-collapse: collapse;
   width: 100%;
   min-width: 560px;
   font-size: 14px;
   line-height: 1.45
}

/* Framer impose white-space:pre-wrap aux cellules ; les retours a la ligne et
   l'indentation de la source se voyaient alors dans le tableau. */
.drz-doc-table th,
.drz-doc-table td {
   padding: 9px 12px;
   border-bottom: 1px solid #ededed;
   text-align: left;
   vertical-align: top;
   white-space: normal
}

.drz-doc-table thead th {
   font-size: 12px;
   font-weight: 600;
   color: #666;
   letter-spacing: -0.01em;
   border-bottom: 1px solid #d9d9d9
}

.drz-doc-table tbody th {
   font-weight: 500;
   color: #111;
   white-space: nowrap;
   font-family: "Fragment Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
   font-size: 12.5px
}

.drz-doc-table tbody tr.drz-doc-group th {
   padding-top: 16px;
   font-family: inherit;
   font-size: 13px;
   font-weight: 600;
   color: #666;
   border-bottom: 1px solid #d9d9d9;
   white-space: normal
}

.drz-doc-table tbody tr:last-child th,
.drz-doc-table tbody tr:last-child td {
   border-bottom: none
}

@media(max-width:809.98px) {
   .drz-doc-table {
      font-size: 13px;
      min-width: 520px
   }

   .drz-doc-table th,
   .drz-doc-table td {
      padding: 8px 9px
   }
}

/* Même filet pour les figures étroites que pour les figures larges. */
.drz-art-fig img {
   border: 1px solid #ededed
}

/* Appels de référence en exposant + bibliographie annotée */
/* Numérotation par compteur plutôt que par ::marker : le numéro est calé à
   droite dans sa colonne, la notice commence après une vraie gouttière, et
   les lignes suivantes s'alignent sous la première (retrait pendant).
   Sélecteurs longs et `padding-inline-start` à dessein : l'export Framer
   pose `ol.framer-text>li.framer-text{padding-inline-start:...}`, qui sinon
   écrase le retrait et fait retomber le numéro sur la première lettre. */
.framer-gln7zt ol.drz-biblio {
   list-style: none;
   counter-reset: drz-biblio;
   margin: 10px 0 6px;
   padding: 0;
   font-size: 15px;
   line-height: 1.55;
   color: #333
}

.framer-gln7zt ol.drz-biblio>li.framer-text {
   position: relative;
   margin: 0 0 18px;
   padding: 0;
   padding-inline-start: 52px;
   scroll-margin-top: 144px;
   counter-increment: drz-biblio
}

.framer-gln7zt ol.drz-biblio>li.framer-text::before {
   content: counter(drz-biblio) ".";
   position: absolute;
   left: 0;
   top: 1px;
   width: 34px;
   text-align: right;
   color: #999;
   font-size: 13px;
   font-variant-numeric: tabular-nums
}

.framer-gln7zt ol.drz-biblio>li.framer-text:target {
   background: #fbfbe8;
   border-radius: 6px;
   box-shadow: 0 0 0 8px #fbfbe8
}

.drz-biblio cite {
   font-style: normal;
   color: #111
}

.drz-biblio .drz-biblio-note {
   display: block;
   margin-top: 4px;
   color: #666
}

/* Framer applique white-space:pre-wrap a .framer-text ; la bibliographie est de la prose,
   pas du preformate et les retours a la ligne du source s'y voyaient a l'ecran. */
.framer-gln7zt ol.drz-biblio,
.framer-gln7zt ol.drz-biblio * {
   white-space: normal
}

@media(max-width:809.98px) {
   .framer-gln7zt ol.drz-biblio>li.framer-text {
      scroll-margin-top: 136px
   }

   .framer-gln7zt ol.drz-biblio {
      font-size: 14px
   }

   .framer-gln7zt ol.drz-biblio>li.framer-text {
      padding-inline-start: 38px
   }

   .framer-gln7zt ol.drz-biblio>li.framer-text::before {
      width: 24px
   }
}

/* Comparatif du paysage : tableau compact (11 critères), ligne du paquet mise
   en avant et liste « une ligne par outil ». */
.drz-star-table--compact {
   min-width: 0;
   table-layout: fixed;
   width: 100%
}

.drz-star-table--compact th,
.drz-star-table--compact td {
   padding: 8px 4px
}

.drz-star-table--compact thead th {
   white-space: normal;
   width: 78px;
   line-height: 1.2;
   font-size: 11.5px;
   hyphens: auto;
   -webkit-hyphens: auto
}

.drz-star-table--compact thead th:first-child,
.drz-star-table--compact tbody th {
   white-space: normal;
   width: 140px;
   hyphens: none;
   -webkit-hyphens: none
}

.drz-star-table--compact .drz-stars {
   font-size: 12.5px;
   letter-spacing: 0
}

.drz-star-table tbody tr.is-self th,
.drz-star-table tbody tr.is-self td {
   background: #fbfbe8
}

.drz-star-table tbody tr.is-self th {
   font-weight: 700
}

/* Framer impose white-space:pre-wrap a .framer-text ; les retours a la ligne et
   l'indentation de la source se voyaient dans les elements de liste. */
.drz-tool-list,.drz-tool-list li,.drz-tool-list li *{white-space:normal}
.framer-gln7zt ul.drz-tool-list {
   list-style: none;
   margin: 10px 0 6px;
   padding: 0;
   font-size: 15px;
   line-height: 1.55;
   color: #333
}

.framer-gln7zt ul.drz-tool-list>li {
   position: relative;
   margin: 0 0 12px;
   padding: 0;
   padding-inline-start: 22px
}

.framer-gln7zt ul.drz-tool-list>li::before {
   content: "";
   position: absolute;
   left: 4px;
   top: 9px;
   width: 6px;
   height: 6px;
   border-radius: 50%;
   background: #cfcfcf
}

.framer-gln7zt ul.drz-tool-list>li.is-self {
   background: #fbfbe8;
   border-radius: 6px;
   padding: 8px 10px 8px 22px;
   margin-left: -10px
}

.framer-gln7zt ul.drz-tool-list>li.is-self::before {
   background: #111;
   left: 10px;
   top: 17px
}

.framer-gln7zt ul.drz-tool-list strong {
   color: #111
}

/* Tableau documentaire dont la première colonne porte des mots, non du code :
   on annule la chasse fixe héritée de .drz-doc-table. */
.drz-doc-table--words tbody th {
   font-family: inherit;
   font-size: 13.5px;
   font-weight: 600
}

/* Appels de référence en exposant : sans cette règle, le a.framer-text
   intérieur reprend la taille pleine du corps (--framer-font-size) et le
   numéro s'affiche deux fois trop gros. line-height:0 pour ne pas creuser
   l'interligne de la ligne porteuse. */
.framer-gln7zt sup.drz-ref {
   font-size: .55em;
   line-height: 0;
   position: relative;
   vertical-align: baseline;
   top: -.55em
}

.framer-gln7zt sup.drz-ref a.framer-text {
   font-size: inherit !important
}