/* Généré par node da/build-tokens.mjs. Ne pas éditer. */
:root {
  --color-menthe: #81C7B4;
  --color-petrole: #274D4B;
  --color-clair: #F0F5F4;
  --color-corail: #EA7B54;
  --color-texte: #212529;
  --color-blanc: #FFFFFF;
  --color-secondaire: #526663;
  --color-trait: #697E79;
  --color-erreur: #A4342B;
  --primitive-color-transparent: rgb(0 0 0 / 0);
  --primitive-font-family-red-hat-display: "Red Hat Display", Arial, sans-serif;
  --primitive-font-family-red-hat-text: "Red Hat Text", Arial, sans-serif;
  --primitive-font-weight-regular: 400;
  --primitive-font-weight-medium: 500;
  --primitive-font-weight-semibold: 600;
  --primitive-font-weight-bold: 700;
  --primitive-font-size-12: 12px;
  --primitive-font-size-13: 13px;
  --primitive-font-size-14: 14px;
  --primitive-font-size-16: 16px;
  --primitive-font-size-18: 18px;
  --primitive-font-size-20: 20px;
  --primitive-font-size-24: 24px;
  --primitive-font-size-28: 28px;
  --primitive-font-size-32: 32px;
  --primitive-font-size-36: 36px;
  --primitive-font-size-40: 40px;
  --primitive-font-size-48: 48px;
  --primitive-font-size-56: 56px;
  --primitive-font-size-64: 64px;
  --primitive-font-size-72: 72px;
  --primitive-line-height-display: 1.08;
  --primitive-line-height-heading: 1.2;
  --primitive-line-height-normal: 1.5;
  --primitive-line-height-relaxed: 1.65;
  --primitive-letter-spacing-tight: -0.8px;
  --primitive-letter-spacing-normal: 0px;
  --primitive-letter-spacing-wide: 0.5px;
  --primitive-spacing-0: 0px;
  --primitive-spacing-4: 4px;
  --primitive-spacing-8: 8px;
  --primitive-spacing-12: 12px;
  --primitive-spacing-16: 16px;
  --primitive-spacing-24: 24px;
  --primitive-spacing-32: 32px;
  --primitive-spacing-40: 40px;
  --primitive-spacing-44: 44px;
  --primitive-spacing-48: 48px;
  --primitive-spacing-64: 64px;
  --primitive-spacing-80: 80px;
  --primitive-spacing-96: 96px;
  --primitive-spacing-128: 128px;
  --primitive-spacing-1280: 1280px;
  --primitive-spacing-section-24: 24px;
  --primitive-spacing-section-32: 32px;
  --primitive-spacing-section-40: 40px;
  --primitive-spacing-section-48: 48px;
  --primitive-spacing-section-64: 64px;
  --primitive-spacing-section-80: 80px;
  --primitive-spacing-section-96: 96px;
  --primitive-border-radius-none: 0px;
  --primitive-border-radius-xs: 2px;
  --primitive-border-radius-sm: 4px;
  --primitive-border-radius-card: 8px;
  --primitive-border-radius-pill: 999px;
  --primitive-border-width-hair: 1px;
  --primitive-border-width-thick: 2px;
  --primitive-border-width-rule: 3px;
  --primitive-box-shadow-navigation-active: 0px 3px 0px 0px #274D4B;
  --primitive-box-shadow-ligne-ajoutee: 0px 0px 0px 2px #274D4B;
  --primitive-box-shadow-ligne-erreur: 0px 0px 0px 2px #A4342B;
  --primitive-box-shadow-focus-galerie: 0px 0px 0px 2px #274D4B;
  --primitive-opacity-disabled: 0.6;
  --primitive-duration-feedback: 160ms;
  --primitive-timing-function-out: cubic-bezier(0.2, 0.7, 0.2, 1);
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;
  --leading-display: 1.08;
  --leading-heading: 1.2;
  --leading-normal: 1.5;
  --leading-relaxed: 1.65;
  --tracking-tight: -0.8px;
  --tracking-normal: 0px;
  --tracking-wide: 0.5px;
  --font-sans: "Red Hat Text", Arial, sans-serif;
  --font-display: "Red Hat Display", Arial, sans-serif;
  --font-size-2xs: 12px;
  --font-size-xs: 13px;
  --font-size-sm: 14px;
  --font-size-body: 16px;
  --font-size-base: 16px;
  --font-size-md: 18px;
  --font-size-lg: 20px;
  --font-size-xl: 24px;
  --font-size-display-hero-min: 40px;
  --font-size-display-hero-max: 72px;
  --font-size-display-hero: clamp(40px, 5.3vw, 72px);
  --font-size-display-h1-min: 36px;
  --font-size-display-h1-max: 56px;
  --font-size-display-h1: clamp(36px, 4.2vw, 56px);
  --font-size-display-h2-min: 28px;
  --font-size-display-h2-max: 40px;
  --font-size-display-h2: clamp(28px, 3vw, 40px);
  --font-size-display-h3-min: 24px;
  --font-size-display-h3-max: 28px;
  --font-size-display-h3: clamp(24px, 2.2vw, 28px);
  --font-size-display-h4-min: 20px;
  --font-size-display-h4-max: 24px;
  --font-size-display-h4: clamp(20px, 2vw, 24px);
  --font-size-display-label-min: 18px;
  --font-size-display-label-max: 20px;
  --font-size-display-label: clamp(18px, 1.6vw, 20px);
  --space-0: 0px;
  --space-4: 4px;
  --space-8: 8px;
  --space-12: 12px;
  --space-16: 16px;
  --space-24: 24px;
  --space-32: 32px;
  --space-40: 40px;
  --space-44: 44px;
  --space-48: 48px;
  --space-64: 64px;
  --space-80: 80px;
  --space-96: 96px;
  --space-128: 128px;
  --space-1280: 1280px;
  --space-section-standard-min: 48px;
  --space-section-standard-max: 80px;
  --space-section-standard: clamp(48px, 6vw, 80px);
  --space-section-navigation-min: 24px;
  --space-section-navigation-max: 32px;
  --space-section-navigation: clamp(24px, 2.2vw, 32px);
  --space-section-entete-min: 40px;
  --space-section-entete-max: 64px;
  --space-section-entete: clamp(40px, 5vw, 64px);
  --space-section-colonnes-min: 32px;
  --space-section-colonnes-max: 64px;
  --space-section-colonnes: clamp(32px, 5vw, 64px);
  --space-section-produit-mono-min: 32px;
  --space-section-produit-mono-max: 64px;
  --space-section-produit-mono: clamp(32px, 5vw, 64px);
  --space-section-lecture-min: 48px;
  --space-section-lecture-max: 96px;
  --space-section-lecture: clamp(48px, 7vw, 96px);
  --space-section-promo-banniere-min: 24px;
  --space-section-promo-banniere-max: 40px;
  --space-section-promo-banniere: clamp(24px, 3vw, 40px);
  --radius-none: 0px;
  --radius-xs: 2px;
  --radius-sm: 4px;
  --radius-card: 8px;
  --radius-pill: 999px;
  --radius-btn: 0px;
  --border-hair: 1px;
  --border-thick: 2px;
  --border-rule: 3px;
  --shadow-navigation-active: 0px 3px 0px 0px #274D4B;
  --shadow-ligne-ajoutee: 0px 0px 0px 2px #274D4B;
  --shadow-ligne-erreur: 0px 0px 0px 2px #A4342B;
  --shadow-focus-galerie: 0px 0px 0px 2px #274D4B;
  --opacity-disabled: 0.6;
  --duration-feedback: 160ms;
  --ease-out: cubic-bezier(0.2, 0.7, 0.2, 1);
  --color-ink: #212529;
  --color-paper: #FFFFFF;
  --color-coral: #EA7B54;
  --color-page: #F0F5F4;
  --color-mist: #F0F5F4;
  --color-stone: #526663;
  --color-line: #697E79;
  --color-ok: #274D4B;
  --color-alert: #A4342B;
  --color-mint: #81C7B4;
  --color-teal: #274D4B;
  --color-action: #EA7B54;
  --color-on-action: #212529;
  --color-action-hover: #81C7B4;
  --color-link: #274D4B;
  --color-focus: #274D4B;
  --color-on-dark: #FFFFFF;
  --color-transparent: rgb(0 0 0 / 0);
  --container: 1280px;
  --gutter: 24px;
  --touch: 44px;
  --drawer-width: 480px;
  --header-height: 104px;
  --header-compact: 72px;
  --page-margin: 5%;
  --mobile-margin: 4%;
  --full: 100%;
  --viewport-height: 100dvh;
  --dialog-width: 1040px;
  --dialog-height: 92dvh;
  --logo-width: 112px;
  --logo-mobile: 80px;
  --hero-height: 520px;
  --hero-mobile: 280px;
  --measure: 48ch;
  --bar-height: 88px;
  --breakpoint-navigation: 850px;
  --zero: 0px;
  --z-header: 20;
  --z-mobile-buy: 30;
  --z-toast: 60;
}
@media (max-width: 850px) {
  .section { padding-inline: var(--mobile-margin); }
  .site-header { padding-inline: var(--mobile-margin); gap: var(--space-8); min-height: var(--header-compact); flex-wrap: wrap; }
  .brand img { width: var(--logo-mobile); }
  .menu-toggle { display: inline-flex; min-width: var(--touch); padding-inline: var(--space-8); font-size: var(--font-size-sm); }
  .site-header nav { display: none; order: 4; flex-basis: var(--full); align-items: stretch; flex-direction: column; gap: var(--space-4); }
  .site-header nav.open { display: flex; }
  .header-actions { gap: var(--space-8); }
  .header-actions a { font-size: var(--font-size-xs); }
  .announcement span { display: none; }
  .majority { flex-direction: column; align-items: flex-start; padding-inline: var(--mobile-margin); }
  .majority div { flex-wrap: wrap; }
  .hero { grid-template-columns: 1fr; }
  .hero-copy { padding: var(--space-40) var(--mobile-margin); }
  .hero figure { min-height: var(--hero-mobile); }
  .reassurance { grid-template-columns: 1fr; gap: var(--space-16); }
  .grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--space-32) var(--space-12); }
  .card h3 { font-size: var(--font-size-body); }
  .card .button { padding-inline: var(--space-8); font-size: var(--font-size-sm); }
  .row { grid-auto-columns: calc((var(--full) - var(--space-12)) / 2); gap: var(--space-32) var(--space-12); overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: var(--space-8); }
  .row .card { scroll-snap-align: start; }
  .detail { grid-template-columns: 1fr; gap: var(--space-24); }
  #product-dialog { padding: var(--space-16); max-height: var(--viewport-height); width: var(--full); height: var(--viewport-height); margin: var(--zero); overflow-y: auto; }
  #product-dialog .buy { position: sticky; bottom: var(--zero); background: var(--color-paper); padding-block: var(--space-8); }
  .swatches { grid-template-columns: repeat(2,minmax(0,1fr)); }
}