/* Congo Soft Services — Largeur contenu : 85% desktop · 90% mobile */

:root {
  --layout-width-desktop: 85%;
  --layout-width-mobile: 90%;
  --layout-width: var(--layout-width-desktop);
}

#css-page-content,
#css-page-content main {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

/* Desktop : 85% */
@media (min-width: 901px) {
  .container,
  .navwrap,
  .css-footer__wrap,
  .css-lire-section .container,
  #css-page-content > section > .container,
  #css-page-content > section .container,
  #css-page-content main > section > .container,
  #css-page-content main section > .container,
  #css-page-content section > .container,
  #css-page-content .css-shell,
  .pageHero > .container,
  .hero > .container {
    width: var(--layout-width-desktop) !important;
    max-width: var(--layout-width-desktop) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: clamp(12px, 1.5vw, 20px) !important;
    padding-right: clamp(12px, 1.5vw, 20px) !important;
    box-sizing: border-box !important;
  }
}

/* Mobile & tablette : 90% */
@media (max-width: 900px) {
  .container,
  .navwrap,
  .css-footer__wrap,
  .css-lire-section .container,
  #css-page-content > section > .container,
  #css-page-content > section .container,
  #css-page-content main > section > .container,
  #css-page-content main section > .container,
  #css-page-content section > .container,
  #css-page-content .css-shell,
  .pageHero > .container,
  .hero > .container,
  .navlinks {
    width: var(--layout-width-mobile) !important;
    max-width: var(--layout-width-mobile) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
  }
}

#css-page-content .css-shell > .container,
.css-shell > .container {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.pageHero,
.hero,
.section {
  width: 100% !important;
  max-width: 100% !important;
}

.product,
.cta {
  max-width: 100%;
}
