/***   xs: 30rem  =  ~480px  /  sm: 37.5rem  =  ~600px   /   md: 64rem  =  ~1024px   /  lg: 80rem  = ~1280px   /   xl: 90rem  =  ~1440px    ***/
/*
@supports(--css: variables) {



  @include breakpoint(lg) {
    body {
      --space-unit:  1em;
      --text-base-size: 1em;
      --text-scale-ratio: 1.2;
    }
  }

}
*/
/*** GRID ***/
@media (min-width: 90rem) { .hero { height: var(--container-height-md); }
  .container--adaptive { max-width: var(--container-width-xl); }
  .col--xl { flex-grow: 1; flex-basis: 0; max-width: 100%; }
  .col--xl-1 { flex-basis: 8.33%; max-width: 8.33%; }
  .col--xl-2 { flex-basis: 16.66%; max-width: 16.66%; }
  .col--xl-3 { flex-basis: 25%; max-width: 25%; }
  .col--xl-4 { flex-basis: 33.33%; max-width: 33.33%; }
  .col--xl-5 { flex-basis: 41.66%; max-width: 41.66%; }
  .col--xl-6 { flex-basis: 50%; max-width: 50%; }
  .col--xl-7 { flex-basis: 58.33%; max-width: 58.33%; }
  .col--xl-8 { flex-basis: 66.66%; max-width: 66.66%; }
  .col--xl-9 { flex-basis: 75%; max-width: 75%; }
  .col--xl-10 { flex-basis: 83.33%; max-width: 83.33%; }
  .col--xl-11 { flex-basis: 91.66%; max-width: 91.66%; }
  .col--xl-12 { flex-basis: 100%; max-width: 100%; }
  @supports (grid-area: auto) { .features__grid { grid-template-columns: repeat(3, 1fr); }
    .features--icon .features__grid { grid-template-columns: repeat(4, 1fr) !important; } } }

@media (max-width: 90rem) { .hide--xl { display: none !important; }
  .container--adaptive { max-width: var(--container-width-md); }
  .text-component__img--outset { width: calc(100% + 2 * var(--space-xxl)); }
  .text-component__img--outset:not(.text-component__img--right) { margin-left: calc(-1 * var(--space-xxl)); }
  .text-component__img--left, .text-component__img--right { width: 50%; }
  .text-component__img--right.text-component__img--outset { margin-right: calc(-1 * var(--space-xxl)); } }

@media (min-width: 80rem) { .main-footer__nav { width: auto; }
  .main-footer__nav-item { grid-gap: var(--space-xs); }
  .main-footer__nav-item a, .main-footer__nav-item div p { font-size: 0.9em; }
  .col--lg { flex-grow: 1; flex-basis: 0; max-width: 100%; }
  .col--lg-1 { flex-basis: 8.33%; max-width: 8.33%; }
  .col--lg-2 { flex-basis: 16.66%; max-width: 16.66%; }
  .col--lg-3 { flex-basis: 25%; max-width: 25%; }
  .col--lg-4 { flex-basis: 33.33%; max-width: 33.33%; }
  .col--lg-5 { flex-basis: 41.66%; max-width: 41.66%; }
  .col--lg-6 { flex-basis: 50%; max-width: 50%; }
  .col--lg-7 { flex-basis: 58.33%; max-width: 58.33%; }
  .col--lg-8 { flex-basis: 66.66%; max-width: 66.66%; }
  .col--lg-9 { flex-basis: 75%; max-width: 75%; }
  .col--lg-10 { flex-basis: 83.33%; max-width: 83.33%; }
  .col--lg-11 { flex-basis: 91.66%; max-width: 91.66%; }
  .col--lg-12 { flex-basis: 100%; max-width: 100%; } }

@media (max-width: 80rem) { .hide--lg { display: none !important; }
  .main-header__nav-item { margin-left: var(--space-sm); }
  .main-footer__content { display: flex; flex-wrap: wrap; justify-content: space-around; }
  .cta-banner__text { padding-left: var(--space-md); }
  .cta-banner--img-no-padding .cta-banner__text { padding-left: var(--space-md); } }

@media (min-width: 64rem) { .col--md { flex-grow: 1; flex-basis: 0; max-width: 100%; }
  .col--md-1 { flex-basis: 8.33%; max-width: 8.33%; }
  .col--md-2 { flex-basis: 16.66%; max-width: 16.66%; }
  .col--md-3 { flex-basis: 25%; max-width: 25%; }
  .col--md-4 { flex-basis: 33.33%; max-width: 33.33%; }
  .col--md-5 { flex-basis: 41.66%; max-width: 41.66%; }
  .col--md-6 { flex-basis: 50%; max-width: 50%; }
  .col--md-7 { flex-basis: 58.33%; max-width: 58.33%; }
  .col--md-8 { flex-basis: 66.66%; max-width: 66.66%; }
  .col--md-9 { flex-basis: 75%; max-width: 75%; }
  .col--md-10 { flex-basis: 83.33%; max-width: 83.33%; }
  .col--md-11 { flex-basis: 91.66%; max-width: 91.66%; }
  .col--md-12 { flex-basis: 100%; max-width: 100%; }
  .main-header__logo { width: 11em; }
  .main-header__layout { padding: 0; display: table; width: 100%; display: flex; justify-content: space-between; align-items: center; }
  .main-header__nav { margin-top: 0; font-size: 0.875em; padding: 0; background-color: transparent; position: static; width: auto; box-shadow: none; display: block; }
  .main-header__nav-label { position: absolute; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); }
  .main-header__nav-list { display: flex; align-items: center; }
  .main-header__nav-item { margin-bottom: 0; margin-left: var(--space-md); }
  .main-header__nav-divider { height: 1em; width: 1px; }
  .main-header__nav-trigger { display: none; }
  .main-footer__content { display: flex; justify-content: space-between; }
  .cta-banner__text { text-align: left; }
  .cta-banner__buttons { justify-content: flex-start; }
  .cta-banner--img-no-padding .cta-banner__img { align-self: end; }
  .cta-banner--text-center .cta-banner__text { text-align: center; }
  .cta-banner--text-center .cta-banner__buttons { justify-content: center; }
  .testimonials__card { display: flex; flex-direction: column; }
  .testimonials__card footer { margin-top: auto; }
  @supports (grid-area: auto) { .testimonials__grid { display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: var(--space-sm); }
    .testimonials__grid > * { margin-bottom: 0; } } }

@media (max-width: 64rem) { .container--adaptive { max-width: var(--container-width-sm); }
  .features .features--icon .features__grid { grid-gap: var(--space-sm); }
  .hide--md { display: none !important; }
  .more-container .features__item { max-width: 25%; }
  .slideshow[data-swipe="on"] .slideshow__control { display: block; }
  .slideshow__control button { height: 64px; width: 32px; }
  .slideshow__control .icon { width: 32px; height: 32px; }
  .slideshow__navigation { height: 40px; }
  .slideshow__nav-item button { font-size: 10px; }
  .slideshow__nav-item button::before { font-size: 16px; }
  .slideshow__item { height: 400px; }
  section.features--icon .flex { flex-wrap: wrap; }
  section.features--icon .flex > * { width: 100%; max-width: initial; flex-basis: initial; }
  .features__item .features__title { font-size: var(--text-md); }
  .features--icon [data-icon]::before { font-size: var(--text-xxl); }
  .main-header__nav-item { margin-left: var(--space-xs); }
  .btn { padding: var(--space-sm); }
  footer { flex-wrap: wrap; }
  footer > * { width: 100%; } }

@media (min-width: 50rem) { .col--sm { flex-grow: 1; flex-basis: 0; max-width: 100%; }
  .col--sm-1 { flex-basis: 8.33%; max-width: 8.33%; }
  .col--sm-2 { flex-basis: 16.66%; max-width: 16.66%; }
  .col--sm-3 { flex-basis: 25%; max-width: 25%; }
  .col--sm-4 { flex-basis: 33.33%; max-width: 33.33%; }
  .col--sm-5 { flex-basis: 41.66%; max-width: 41.66%; }
  .col--sm-6 { flex-basis: 50%; max-width: 50%; }
  .col--sm-7 { flex-basis: 58.33%; max-width: 58.33%; }
  .col--sm-8 { flex-basis: 66.66%; max-width: 66.66%; }
  .col--sm-9 { flex-basis: 75%; max-width: 75%; }
  .col--sm-10 { flex-basis: 83.33%; max-width: 83.33%; }
  .col--sm-11 { flex-basis: 91.66%; max-width: 91.66%; }
  .col--sm-12 { flex-basis: 100%; max-width: 100%; }
  .text-component__block--left, .text-component__block--right, .text-component__img--left, .text-component__img--right { width: 45%; }
  .text-component__block--left img, .text-component__block--right img, .text-component__img--left img, .text-component__img--right img { width: 100%; }
  .text-component__block--left, .text-component__img--left { float: left; margin-right: calc(var(--space-md) * var(--text-vspace-multiplier, 1)); }
  .text-component__block--right, .text-component__img--right { float: right; margin-left: calc(var(--space-md) * var(--text-vspace-multiplier, 1)); }
  @supports (grid-area: auto) { .features__grid { display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: var(--space-sm); }
    .features--icon .features__grid { grid-template-columns: repeat(4, 1fr); grid-gap: var(--space-lg); }
    .features__item { margin-bottom: 0; padding: var(--space-sm); } } }

@media (max-width: 50rem) { @supports (grid-area: auto) { .features__grid { display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: var(--space-sm); }
    .features--icon .features__grid { grid-template-columns: repeat(4, 1fr); grid-gap: var(--space-lg); }
    .features__item { margin-bottom: 0; padding: var(--space-sm); } }
  .container--adaptive { max-width: var(--container-width-xs); }
  .hide--sm { display: none !important; }
  .features--icon .features__grid { grid-template-columns: repeat(2, 1fr); }
  section.features--icon .flex--space-between { justify-content: center; }
  .features__item .features__title { font-size: var(--text-lg); }
  .slideshow__item { height: 280px; }
  .features__grid { grid-template-columns: repeat(2, 1fr); }
  .more-container .features__item { max-width: 50%; }
  .tabs { flex-wrap: wrap; }
  .tabs > * { width: 100%; }
  .tabs__controls li { width: 50%; }
  .hero__content p { font-size: var(--text-xl); }
  .hero__content h1 { font-size: var(--text-xxxl); }
  .btn--md { font-size: var(--text-xs); }
  .hero { height: var(--container-height-xxxs); }
  .hero .hero__content { margin-top: 4em; }
  .tabs__controls li { width: 100%; }
  .hp .hero { height: var(--container-height-xxs); }
  .hp .hero__content { margin-top: 0; }
  .margin-bottom--lg { margin-bottom: var(--space-sm); }
  .features--icon .features__grid { grid-template-columns: repeat(1, 1fr); }
  .margin-top--lg { margin-top: var(--space-sm); }
  .main-header__nav { top: 6.3em; } }

@media (min-width: 30rem) { .col--xs { flex-grow: 1; flex-basis: 0; max-width: 100%; }
  .col--xs-1 { flex-basis: 8.33%; max-width: 8.33%; }
  .col--xs-2 { flex-basis: 16.66%; max-width: 16.66%; }
  .col--xs-3 { flex-basis: 25%; max-width: 25%; }
  .col--xs-4 { flex-basis: 33.33%; max-width: 33.33%; }
  .col--xs-5 { flex-basis: 41.66%; max-width: 41.66%; }
  .col--xs-6 { flex-basis: 50%; max-width: 50%; }
  .col--xs-7 { flex-basis: 58.33%; max-width: 58.33%; }
  .col--xs-8 { flex-basis: 66.66%; max-width: 66.66%; }
  .col--xs-9 { flex-basis: 75%; max-width: 75%; }
  .col--xs-10 { flex-basis: 83.33%; max-width: 83.33%; }
  .col--xs-11 { flex-basis: 91.66%; max-width: 91.66%; }
  .col--xs-12 { flex-basis: 100%; max-width: 100%; }
  .steps__list { margin-bottom: initial; align-items: flex-start; }
  @supports (grid-area: auto) { .steps__list { display: grid; align-items: start; grid-template-columns: repeat(var(--steps-number), 1fr); } }
  .step { width: calc(100%/var(--steps-number)); justify-content: center; text-align: center; position: relative; margin-bottom: initial; padding: 0 var(--space-xs); }
  @supports (grid-area: auto) { .step { width: auto; } }
  .step__label { margin-top: calc(var(--space-xxs) + var(--step-circle-size)/2); }
  .step__separator { position: absolute; height: var(--step-separator-line-stroke); width: calc(100% - var(--step-circle-size) - var(--step-separator-line-gap)*2); top: calc(var(--step-separator-line-stroke) * -1/2); left: calc(50% + var(--step-circle-size)/2 + var(--step-separator-line-gap)); margin: 0; background-color: var(--color-contrast-low); color: transparent; text-indent: 100%; white-space: nowrap; overflow: hidden; }
  .step--completed .step__separator { background-color: var(--color-primary); }
  .step__circle { line-height: var(--step-circle-size); display: flex; justify-content: center; align-items: center; background-color: var(--color-contrast-low); width: var(--step-circle-size); height: var(--step-circle-size); border-radius: 50%; position: absolute; left: calc(50% - var(--step-circle-size)/2); top: calc(var(--step-circle-size) * -1/2); font-size: var(--step-circle-font-size); }
  .step__circle .icon { width: var(--step-circle-font-size); height: var(--step-circle-font-size); color: inherit; }
  .step--completed .step__circle, .step--current .step__circle { background-color: var(--color-primary); color: var(--color-white); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
  .main-footer__content { display: flex; flex-wrap: wrap; justify-content: center; }
  .main-footer__nav-item { padding-right: var(--space-lg); }
  .main-footer__content { padding-top: var(--space-md); }
  .main-footer__logo a { padding-bottom: var(--space-sm); } }

@media (max-width: 30rem) { .slideshow[data-swipe="on"] .slideshow__control { display: none; /* hide arrows on mobile if swipe is enabled */ }
  .js .slideshow__control { display: none; }
  .bandeau .flex { flex-wrap: wrap; }
  .bandeau .flex > * { width: 100%; }
  .bandeau .flex .bandeau-item { border-bottom: 1px solid #FFF; border-right: none; }
  .bandeau .flex .bandeau-item:last-child { border-bottom: none; }
  .main-footer__nav-item { width: 100%; }
  .container--adaptive { max-width: var(--container-width-xs); }
  .container--adaptive-sm { max-width: var(--container-width-xs); }
  .container--adaptive-md { max-width: var(--container-width-xs); }
  .hide--xs { display: none !important; }
  .step__circle { display: none; }
  .steps { background-color: var(--color-contrast-lower); padding: var(--component-padding); }
  .picto-step .step__separator { border: none; }
  .step__separator { margin: 0 var(--space-xs); }
  .step__separator[data-icon]:before { display: block; color: inherit; }
  h1 { font-size: var(--text-xl); line-height: 1; }
  .table__inner { padding: 0; }
  .table th, .table td { padding: var(--space-xxs); }
  .single-point > a { width: 12px; height: 12px; }
  .single-point > a::after { height: 2px; width: 12px; }
  .single-point > a::before { height: 12px; width: 2px; }
  .single-point::after { width: 15px; height: 15px; top: -1.5px; left: -1.5px; }
  .single-point h2 { font-size: var(--text-sm); }
  .hero--img img { max-width: 110%; min-width: 110%; }
  #protocole.container--adaptive { width: 100%; }
  .text-box { margin: var(--space-sm); }
  .content--list { padding: 0; }
  .content--list li[data-icon]::before { margin-right: var(--space-xs); margin-left: 0; }
  .main-footer__logo { width: 100%; }
  .hero.hero--img { overflow: hidden; }
  #traitement-thermique-ou-chimique span { display: block; } }

@media not all and (max-width: 90rem) { .display--xl { display: none !important; } }

@media not all and (max-width: 80rem) { .display--lg { display: none !important; } }

@media not all and (max-width: 64rem) { .display--md { display: none !important; } }

@media not all and (max-width: 50rem) { .display--sm { display: none !important; } }

@media not all and (max-width: 30rem) { .display--xs { display: none !important; } }