/* Assistance operationnelle fidelity layer.
   Loaded after styles.css and scoped to assistance-operationnelle.html only. */

html.assistance-document,
html.assistance-document body.assistance-page {
  min-height: 100%;
  overflow-x: hidden !important;
  overflow-y: auto !important;
}

html.assistance-document:not(.coming-soon-active) body.assistance-page .coming-soon-page {
  display: none !important;
  height: 0 !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

html.assistance-document.coming-soon-active body.assistance-page .assistance-main {
  display: none !important;
}

body.assistance-page .assistance-main {
  position: relative !important;
  width: 100% !important;
  overflow: hidden !important;
  background: #fff !important;
}

body.assistance-page .assistance-hero,
body.assistance-page .assistance-visual-section {
  position: relative !important;
  isolation: isolate !important;
  width: 100% !important;
  min-height: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background-repeat: no-repeat !important;
  background-attachment: scroll !important;
  background-blend-mode: normal !important;
  filter: none !important;
  mix-blend-mode: normal !important;
}

body.assistance-page .assistance-hero::before,
body.assistance-page .assistance-hero::after,
body.assistance-page .assistance-visual-section::before,
body.assistance-page .assistance-visual-section::after {
  content: none !important;
  display: none !important;
}

html.assistance-document body.assistance-page .assistance-hero::before,
html.assistance-document body.assistance-page .assistance-hero::after,
html.assistance-document body.assistance-page .assistance-visual-section--documentation::before,
html.assistance-document body.assistance-page .assistance-visual-section--documentation::after,
html.assistance-document body.assistance-page .assistance-visual-section--formation::before,
html.assistance-document body.assistance-page .assistance-visual-section--formation::after,
html.assistance-document body.assistance-page .assistance-visual-section--support::before,
html.assistance-document body.assistance-page .assistance-visual-section--support::after,
body.assistance-page .assistance-visual-section--documentation::before,
body.assistance-page .assistance-visual-section--documentation::after,
body.assistance-page .assistance-visual-section--formation::before,
body.assistance-page .assistance-visual-section--formation::after,
body.assistance-page .assistance-visual-section--support::before,
body.assistance-page .assistance-visual-section--support::after {
  content: none !important;
  display: none !important;
  opacity: 0 !important;
  background: none !important;
  filter: none !important;
  transform: none !important;
  pointer-events: none !important;
}

body.assistance-page .assistance-hero__seo,
body.assistance-page .assistance-visual-section__seo {
  position: absolute !important;
  z-index: 2 !important;
  display: block !important;
  overflow: visible !important;
  opacity: 1 !important;
  filter: none !important;
  transform: none !important;
  text-shadow: none !important;
  pointer-events: auto !important;
  user-select: text !important;
}

body.assistance-page .assistance-hero__seo *,
body.assistance-page .assistance-visual-section__seo * {
  filter: none !important;
  text-shadow: none !important;
}

body.assistance-page .assistance-hero {
  height: 48.611111vw !important;
  background: #000 url("assets/assistance/hero.webp") center top / 100% auto no-repeat !important;
}

body.assistance-page .assistance-hero__seo {
  top: 24.6% !important;
  left: 11.35% !important;
  width: 39.5% !important;
  color: #fff !important;
}

body.assistance-page .assistance-hero__seo h1 {
  margin: 0 0 2.45vw !important;
  color: #f7b000 !important;
  font-size: clamp(54px, 4.75vw, 137px) !important;
  font-weight: 400 !important;
  line-height: 0.9 !important;
  letter-spacing: 0 !important;
}

body.assistance-page .assistance-hero__seo p {
  width: 29.7vw !important;
  max-width: none !important;
  margin: 0 !important;
  color: #fff !important;
  font-size: clamp(16px, 1.18vw, 34px) !important;
  font-weight: 700 !important;
  line-height: 1.14 !important;
}

body.assistance-page .assistance-hero__seo p span {
  color: #f7b000 !important;
}

body.assistance-page .assistance-hero__nav {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 2.95vw !important;
  width: 48.25vw !important;
  margin: 6.85vw 0 0 !important;
}

body.assistance-page .assistance-service-link {
  display: grid !important;
  grid-template-rows: 7.2vw auto !important;
  align-items: start !important;
  gap: 0.9vw !important;
  color: #fff !important;
  font-size: clamp(19px, 1.5vw, 43px) !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  text-decoration: none !important;
}

body.assistance-page .assistance-service-link::before,
body.assistance-page .assistance-service-link > span:last-child::before {
  filter: none !important;
}

body.assistance-page .assistance-service-link__icon {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  height: 7.2vw !important;
}

body.assistance-page .assistance-service-link__icon img {
  display: block !important;
  width: auto !important;
  height: 7.2vw !important;
  max-width: 8.1vw !important;
  max-height: 7.2vw !important;
  object-fit: contain !important;
  object-position: left center !important;
  opacity: 1 !important;
  filter: none !important;
}

/* The desktop hero export already contains the exact maquette typography,
   pictograms and dark gradient. Keep anchors in place without creating a
   second visible text layer. */
body.assistance-page .assistance-hero__seo {
  opacity: 0 !important;
}

body.assistance-page .assistance-visual-section__seo h2 {
  margin: 0 !important;
  color: #000 !important;
  font-size: clamp(44px, 4.28vw, 123px) !important;
  font-weight: 400 !important;
  line-height: 0.93 !important;
  letter-spacing: 0 !important;
}

body.assistance-page .assistance-visual-section__seo p,
body.assistance-page .assistance-visual-section__seo li {
  color: #000 !important;
  font-size: clamp(17px, 1.24vw, 36px) !important;
  font-weight: 400 !important;
  line-height: 1.14 !important;
  letter-spacing: 0 !important;
}

body.assistance-page .assistance-visual-section__seo strong {
  font-weight: 900 !important;
}

body.assistance-page .assistance-visual-section--documentation {
  height: 38.194444vw !important;
  background: #fff url("assets/assistance/documentation.webp") center top / 100% auto no-repeat !important;
}

body.assistance-page .assistance-visual-section--documentation .assistance-visual-section__seo {
  inset: 10.45% 7.35% auto 0 !important;
}

body.assistance-page .assistance-visual-section--documentation .assistance-visual-section__seo h2 {
  max-width: 73vw !important;
  margin: 0 auto 4.05vw !important;
  text-align: center !important;
}

body.assistance-page .assistance-visual-section--documentation .assistance-visual-section__seo p {
  width: 43.7vw !important;
  margin: 0 0 1.02vw auto !important;
}

body.assistance-page .assistance-visual-section--formation {
  height: 44.097222vw !important;
  background: #f7b000 !important;
}

body.assistance-page .assistance-visual-section--formation .assistance-visual-section__seo {
  inset: 14.25% 11.45% auto 11.45% !important;
  display: grid !important;
  grid-template-columns: 42.6% 42.4% !important;
  column-gap: 15% !important;
  align-items: start !important;
}

body.assistance-page .assistance-visual-section--formation .assistance-visual-section__seo h2 {
  grid-column: 1 / -1 !important;
  margin: 0 0 4.2vw !important;
  text-align: center !important;
}

body.assistance-page .assistance-visual-section--formation .assistance-visual-section__seo > p {
  width: 35.9vw !important;
  margin: 0 0 3.15vw !important;
  font-weight: 700 !important;
}

body.assistance-page .assistance-visual-section--formation .assistance-visual-section__seo ul {
  display: grid !important;
  gap: 1.08vw !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

body.assistance-page .assistance-visual-section--formation .assistance-visual-section__seo li {
  position: relative !important;
  padding-left: 1.05em !important;
  color: #000 !important;
  font-weight: 900 !important;
}

body.assistance-page .assistance-visual-section--formation .assistance-visual-section__seo li::before {
  content: "›" !important;
  position: absolute !important;
  left: 0 !important;
  top: -0.03em !important;
  color: #fff !important;
}

body.assistance-page .assistance-feature-card {
  grid-column: 2 !important;
  grid-row: 2 / span 3 !important;
  width: 100% !important;
  min-height: 13.65vw !important;
  margin: 0.2vw 0 0 !important;
  padding: 3.2vw 4vw !important;
  background: #fff3df !important;
}

body.assistance-page .assistance-feature-card p {
  width: auto !important;
  margin: 0 0 2.35vw !important;
}

body.assistance-page .assistance-feature-card__icons {
  margin: 0 !important;
}

body.assistance-page .assistance-feature-card__icons img {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  opacity: 1 !important;
  filter: none !important;
}

body.assistance-page .assistance-visual-section--support {
  height: 40.555556vw !important;
  background: #ededed url("assets/assistance-support-hypercare-final.png") center top / 100% auto no-repeat !important;
}

body.assistance-page .assistance-visual-section--support .assistance-visual-section__seo {
  inset: 13.1% 7.3% auto 0 !important;
}

body.assistance-page .assistance-visual-section--support .assistance-visual-section__seo h2 {
  max-width: 72vw !important;
  margin: 0 auto 3.65vw !important;
  text-align: center !important;
}

body.assistance-page .assistance-visual-section--support .assistance-visual-section__seo p {
  width: 43.6vw !important;
  margin: 0 0 1.02vw auto !important;
}

body.assistance-page .contact-cta {
  margin-top: 0 !important;
}

/* The PSD exports for Documentation and Support already contain the exact
   maquette gradient and type placement. Keep the semantic HTML in the DOM,
   but prevent a second visible text layer from altering the pixel rendering. */
body.assistance-page .assistance-visual-section--documentation .assistance-visual-section__seo,
body.assistance-page .assistance-visual-section--support .assistance-visual-section__seo {
  opacity: 0 !important;
  pointer-events: none !important;
}

@media (max-width: 900px) {
  html.assistance-document body.assistance-page,
  body.assistance-page .assistance-main {
    width: 100% !important;
    overflow-x: hidden !important;
  }

  body.assistance-page .assistance-hero {
    height: auto !important;
    min-height: 760px !important;
    padding: 104px 18px 58px !important;
    background:
      linear-gradient(90deg, #000 0%, rgba(0, 0, 0, 0.94) 46%, rgba(0, 0, 0, 0.58) 76%, #000 100%),
      url("assets/assistance/hero-clean.webp") 64% top / auto 100% no-repeat !important;
  }

  body.assistance-page .assistance-hero__seo,
  body.assistance-page .assistance-visual-section__seo,
  body.assistance-page .assistance-visual-section--documentation .assistance-visual-section__seo,
  body.assistance-page .assistance-visual-section--formation .assistance-visual-section__seo,
  body.assistance-page .assistance-visual-section--support .assistance-visual-section__seo {
    position: relative !important;
    inset: auto !important;
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    overflow: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }

  body.assistance-page .assistance-hero__seo h1 {
    width: 100% !important;
    max-width: 354px !important;
    margin: 0 0 24px !important;
    font-size: 46px !important;
    line-height: 0.92 !important;
  }

  body.assistance-page .assistance-hero__seo p {
    width: 100% !important;
    max-width: 354px !important;
    font-size: 15px !important;
    line-height: 1.16 !important;
  }

  body.assistance-page .assistance-hero__nav {
    display: grid !important;
    grid-template-columns: 1fr !important;
    width: 100% !important;
    max-width: 354px !important;
    margin-top: 38px !important;
    gap: 18px !important;
  }

  body.assistance-page .assistance-service-link {
    grid-template-columns: 54px minmax(0, 1fr) !important;
    grid-template-rows: auto !important;
    align-items: center !important;
    gap: 14px !important;
    font-size: 18px !important;
    line-height: 1.05 !important;
  }

  body.assistance-page .assistance-service-link__icon,
  body.assistance-page .assistance-service-link__icon img {
    width: 52px !important;
    height: 48px !important;
    max-width: 52px !important;
    max-height: 48px !important;
    object-position: center !important;
  }

  body.assistance-page .assistance-visual-section {
    height: auto !important;
    min-height: 0 !important;
    padding: 62px 18px !important;
    overflow: hidden !important;
  }

  body.assistance-page .assistance-visual-section--documentation {
    min-height: 690px !important;
    padding-bottom: 310px !important;
    background: #fff url("assets/assistance/documentation-clean.webp") left bottom / auto 56% no-repeat !important;
  }

  body.assistance-page .assistance-visual-section--support {
    min-height: 720px !important;
    padding-bottom: 320px !important;
    background: #ededed url("assets/assistance-support-hypercare-final.png") left bottom / auto 58% no-repeat !important;
  }

  body.assistance-page .assistance-visual-section--formation {
    min-height: 0 !important;
    padding: 72px 18px 76px !important;
    background: #f7b000 !important;
  }

  body.assistance-page .assistance-visual-section--documentation .assistance-visual-section__seo h2,
  body.assistance-page .assistance-visual-section--support .assistance-visual-section__seo h2 {
    width: 100% !important;
    max-width: 354px !important;
    margin: 0 0 28px !important;
    font-size: 35px !important;
    line-height: 0.98 !important;
    text-align: left !important;
  }

  body.assistance-page .assistance-visual-section--documentation .assistance-visual-section__seo p,
  body.assistance-page .assistance-visual-section--support .assistance-visual-section__seo p {
    width: 100% !important;
    max-width: 354px !important;
    margin: 0 0 14px !important;
    font-size: 15.5px !important;
    line-height: 1.18 !important;
  }

  body.assistance-page .assistance-visual-section--formation .assistance-visual-section__seo h2 {
    width: 100% !important;
    max-width: 354px !important;
    margin: 0 auto 30px !important;
    font-size: 36px !important;
    line-height: 0.98 !important;
    text-align: center !important;
  }

  body.assistance-page .assistance-visual-section--formation .assistance-visual-section__seo > p {
    width: 100% !important;
    max-width: 354px !important;
    margin: 0 0 28px !important;
    font-size: 15px !important;
    line-height: 1.15 !important;
  }

  body.assistance-page .assistance-visual-section--formation .assistance-visual-section__seo ul {
    width: 100% !important;
    max-width: 354px !important;
    display: grid !important;
    gap: 12px !important;
    margin: 0 0 28px !important;
  }

  body.assistance-page .assistance-visual-section--formation .assistance-visual-section__seo li {
    font-size: 15.5px !important;
    line-height: 1.15 !important;
    padding-left: 16px !important;
  }

  body.assistance-page .assistance-feature-card {
    width: 100% !important;
    max-width: 354px !important;
    min-height: 0 !important;
    margin: 30px 0 0 !important;
    padding: 24px 18px !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }

  body.assistance-page .assistance-feature-card p {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 0 22px !important;
    font-size: 15px !important;
    line-height: 1.12 !important;
  }

  body.assistance-page .assistance-feature-card__icons {
    width: 100% !important;
    overflow: hidden !important;
  }

body.assistance-page .assistance-feature-card__icons img {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
  }
}

/* 2026-07-01 - Final desktop lock: the supplied maquette export carries the
   exact dark gradient, title, copy and icon labels. Keep the clickable anchors
   in place without drawing a second visible layer over the export. */
@media (min-width: 721px) {
  html.assistance-document body.assistance-page .assistance-hero {
    height: 48.611111vw !important;
    min-height: 0 !important;
    background: #000 url("assets/assistance/hero.webp") center top / 100% auto no-repeat !important;
  }

  html.assistance-document body.assistance-page .assistance-hero__seo {
    opacity: 0 !important;
    filter: none !important;
    text-shadow: none !important;
  }
}

/* 2026-07-02 - Bandeau d'icones assistance harmonise avec Intégration IT. */
@media (min-width: 721px) {
  html.assistance-document body.assistance-page .assistance-hero {
    height: 48.611111vw !important;
    min-height: 0 !important;
    background: #000 url("assets/assistance/hero-clean.webp") center top / 100% auto no-repeat !important;
  }

  html.assistance-document body.assistance-page .assistance-hero__seo {
    opacity: 1 !important;
    filter: none !important;
    text-shadow: none !important;
    top: 18.9% !important;
    left: 11.35% !important;
    width: 41% !important;
    z-index: 3 !important;
  }

  html.assistance-document body.assistance-page .assistance-hero__seo h1 {
    margin: 0 0 2.7vw !important;
    font-size: clamp(50px, 4.4vw, 126px) !important;
    font-weight: 400 !important;
    line-height: 0.92 !important;
  }

  html.assistance-document body.assistance-page .assistance-hero__seo p {
    width: 31.5vw !important;
    max-width: none !important;
    font-size: clamp(16px, 1.1vw, 31px) !important;
    font-weight: 800 !important;
    line-height: 1.16 !important;
  }

  html.assistance-document body.assistance-page .assistance-hero__nav {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 6.2vw !important;
    width: 45.6vw !important;
    margin: 7.15vw 0 0 !important;
    align-items: end !important;
  }

  html.assistance-document body.assistance-page .assistance-service-link {
    display: block !important;
    min-width: 0 !important;
    color: #fff !important;
    text-decoration: none !important;
    font-size: clamp(18px, 1.04vw, 30px) !important;
    font-weight: 900 !important;
    line-height: 1.04 !important;
    letter-spacing: 0 !important;
  }

  html.assistance-document body.assistance-page .assistance-service-link__icon {
    display: flex !important;
    height: 6.15vw !important;
    max-height: 177px !important;
    align-items: flex-end !important;
    justify-content: flex-start !important;
    margin: 0 0 clamp(10px, 0.58vw, 17px) !important;
  }

  html.assistance-document body.assistance-page .assistance-service-link__icon img {
    display: block !important;
    width: auto !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
    object-position: left bottom !important;
    opacity: 1 !important;
    filter: none !important;
  }

  html.assistance-document body.assistance-page .assistance-service-link > span:last-child {
    position: relative !important;
    display: block !important;
    padding-left: clamp(8px, 0.5vw, 14px) !important;
  }

  html.assistance-document body.assistance-page .assistance-service-link > span:last-child::before {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    top: 0.36em !important;
    left: 0 !important;
    width: 0 !important;
    height: 0 !important;
    border-top: 0.22em solid transparent !important;
    border-bottom: 0.22em solid transparent !important;
    border-left: 0.32em solid #f7b000 !important;
  }
}

@media (max-width: 720px) {
  html.assistance-document body.assistance-page .assistance-hero__seo {
    opacity: 1 !important;
  }

  html.assistance-document body.assistance-page .assistance-service-link__icon {
    height: clamp(56px, 17vw, 82px) !important;
  }

  html.assistance-document body.assistance-page .assistance-service-link {
    font-size: clamp(18px, 5.8vw, 24px) !important;
    line-height: 1.04 !important;
  }
}

/* 2026-07-02 - Assistance: retour au bandeau export maquette, zones cliquables invisibles. */
@media (min-width: 721px) {
  html.assistance-document body.assistance-page .assistance-hero {
    height: 48.611111vw !important;
    min-height: 0 !important;
    background: #000 url("assets/assistance/hero.webp") center top / 100% 100% no-repeat !important;
    overflow: hidden !important;
  }

  html.assistance-document body.assistance-page .assistance-hero::before,
  html.assistance-document body.assistance-page .assistance-hero::after {
    content: none !important;
    display: none !important;
  }

  html.assistance-document body.assistance-page .assistance-hero__seo {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    opacity: 1 !important;
    pointer-events: none !important;
    filter: none !important;
    text-shadow: none !important;
    z-index: 5 !important;
  }

  html.assistance-document body.assistance-page .assistance-hero__seo h1,
  html.assistance-document body.assistance-page .assistance-hero__seo p {
    display: none !important;
  }

  html.assistance-document body.assistance-page .assistance-hero__nav {
    position: absolute !important;
    inset: 0 !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    pointer-events: none !important;
  }

  html.assistance-document body.assistance-page .assistance-service-link {
    position: absolute !important;
    display: block !important;
    top: 61.0% !important;
    height: 31.5% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    color: transparent !important;
    font-size: 0 !important;
    line-height: 0 !important;
    text-decoration: none !important;
    text-indent: -9999px !important;
    pointer-events: auto !important;
    -webkit-tap-highlight-color: transparent !important;
  }

  html.assistance-document body.assistance-page .assistance-service-link:nth-child(1) {
    left: 10.5% !important;
    width: 14.2% !important;
  }

  html.assistance-document body.assistance-page .assistance-service-link:nth-child(2) {
    left: 27.2% !important;
    width: 14.3% !important;
  }

  html.assistance-document body.assistance-page .assistance-service-link:nth-child(3) {
    left: 44.0% !important;
    width: 14.1% !important;
  }

  html.assistance-document body.assistance-page .assistance-service-link *,
  html.assistance-document body.assistance-page .assistance-service-link::before,
  html.assistance-document body.assistance-page .assistance-service-link > span:last-child::before {
    visibility: hidden !important;
  }
}

/* 2026-07-02 - Assistance mobile/tablette.
   Bloc volontairement limite aux petits ecrans pour ne pas modifier le desktop valide. */
@media (max-width: 900px) {
  html.assistance-document,
  html.assistance-document body.assistance-page {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
  }

  html.assistance-document body.assistance-page .assistance-hero {
    height: auto !important;
    min-height: 0 !important;
    padding: 112px 22px 54px !important;
    background:
      linear-gradient(180deg, rgba(0, 0, 0, 0.06) 0%, rgba(0, 0, 0, 0.58) 58%, #000 100%),
      linear-gradient(90deg, #000 0%, rgba(0, 0, 0, 0.86) 44%, rgba(0, 0, 0, 0.32) 100%),
      url("assets/assistance/hero-clean.webp") 61% center / cover no-repeat,
      #000 !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
  }

  html.assistance-document body.assistance-page .assistance-hero::before,
  html.assistance-document body.assistance-page .assistance-hero::after {
    content: none !important;
    display: none !important;
  }

  html.assistance-document body.assistance-page .assistance-hero__seo {
    position: relative !important;
    inset: auto !important;
    top: auto !important;
    left: auto !important;
    width: min(100%, 680px) !important;
    height: auto !important;
    margin: 0 !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    filter: none !important;
    text-shadow: none !important;
    z-index: 2 !important;
  }

  html.assistance-document body.assistance-page .assistance-hero__seo h1,
  html.assistance-document body.assistance-page .assistance-hero__seo p {
    display: block !important;
    width: auto !important;
    max-width: 620px !important;
  }

  html.assistance-document body.assistance-page .assistance-hero__seo h1 {
    margin: 0 0 28px !important;
    color: #f7b000 !important;
    font-size: clamp(46px, 13vw, 76px) !important;
    font-weight: 900 !important;
    line-height: 0.92 !important;
  }

  html.assistance-document body.assistance-page .assistance-hero__seo p {
    color: #fff !important;
    font-size: clamp(18px, 5vw, 25px) !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
  }

  html.assistance-document body.assistance-page .assistance-hero__nav {
    position: relative !important;
    inset: auto !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    width: 100% !important;
    height: auto !important;
    margin: 42px 0 0 !important;
    gap: 14px !important;
    pointer-events: auto !important;
  }

  html.assistance-document body.assistance-page .assistance-service-link {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    width: 100% !important;
    height: auto !important;
    min-height: 92px !important;
    display: grid !important;
    grid-template-columns: 82px 1fr !important;
    align-items: center !important;
    column-gap: 18px !important;
    margin: 0 !important;
    padding: 12px 0 !important;
    overflow: visible !important;
    color: #fff !important;
    font-size: inherit !important;
    line-height: inherit !important;
    text-indent: 0 !important;
    text-decoration: none !important;
    pointer-events: auto !important;
  }

  html.assistance-document body.assistance-page .assistance-service-link *,
  html.assistance-document body.assistance-page .assistance-service-link::before,
  html.assistance-document body.assistance-page .assistance-service-link > span:last-child::before {
    visibility: visible !important;
  }

  html.assistance-document body.assistance-page .assistance-service-link__icon {
    display: flex !important;
    width: 82px !important;
    height: 82px !important;
    max-height: none !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
  }

  html.assistance-document body.assistance-page .assistance-service-link__icon img {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
    object-position: center !important;
    filter: none !important;
    opacity: 1 !important;
  }

  html.assistance-document body.assistance-page .assistance-service-link > span:last-child {
    position: relative !important;
    display: block !important;
    padding-left: 18px !important;
    color: #fff !important;
    font-size: clamp(21px, 6vw, 29px) !important;
    font-weight: 900 !important;
    line-height: 1.03 !important;
  }

  html.assistance-document body.assistance-page .assistance-service-link > span:last-child::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 0.38em !important;
    width: 0 !important;
    height: 0 !important;
    border-top: 0.22em solid transparent !important;
    border-bottom: 0.22em solid transparent !important;
    border-left: 0.32em solid #f7b000 !important;
  }

  html.assistance-document body.assistance-page .assistance-visual-section {
    height: auto !important;
    min-height: 0 !important;
    padding: clamp(58px, 13vw, 88px) 22px !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
  }

  html.assistance-document body.assistance-page .assistance-visual-section::before,
  html.assistance-document body.assistance-page .assistance-visual-section::after {
    content: none !important;
    display: none !important;
  }

  html.assistance-document body.assistance-page .assistance-visual-section__seo,
  html.assistance-document body.assistance-page .assistance-visual-section--documentation .assistance-visual-section__seo,
  html.assistance-document body.assistance-page .assistance-visual-section--formation .assistance-visual-section__seo,
  html.assistance-document body.assistance-page .assistance-visual-section--support .assistance-visual-section__seo {
    position: relative !important;
    inset: auto !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    width: min(100%, 680px) !important;
    max-width: 680px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    transform: none !important;
    opacity: 1 !important;
    text-shadow: none !important;
    color: #000 !important;
    z-index: 2 !important;
  }

  html.assistance-document body.assistance-page .assistance-visual-section__seo h2 {
    margin: 0 0 clamp(28px, 7vw, 42px) !important;
    font-size: clamp(34px, 9vw, 50px) !important;
    font-weight: 900 !important;
    line-height: 0.98 !important;
    text-align: center !important;
    color: #000 !important;
  }

  html.assistance-document body.assistance-page .assistance-visual-section__seo p,
  html.assistance-document body.assistance-page .assistance-visual-section__seo li {
    font-size: clamp(16px, 4.3vw, 20px) !important;
    line-height: 1.18 !important;
    color: #000 !important;
  }

  html.assistance-document body.assistance-page .assistance-visual-section--documentation {
    padding-bottom: clamp(240px, 66vw, 390px) !important;
    background:
      linear-gradient(90deg, rgba(255, 255, 255, 0.36) 0%, rgba(255, 255, 255, 0.92) 54%, #fff 100%),
      url("assets/assistance/documentation-clean.webp") 22% bottom / auto 70% no-repeat,
      #fff !important;
  }

  html.assistance-document body.assistance-page .assistance-visual-section--formation {
    background: #f2f2f2 !important;
  }

  html.assistance-document body.assistance-page .assistance-visual-section--formation .assistance-visual-section__seo ul {
    display: grid !important;
    gap: 14px !important;
    margin: 28px 0 !important;
    padding: 0 !important;
  }

  html.assistance-document body.assistance-page .assistance-visual-section--formation .assistance-visual-section__seo li {
    font-weight: 800 !important;
  }

  html.assistance-document body.assistance-page .assistance-feature-card {
    position: relative !important;
    width: 100% !important;
    margin: 30px 0 0 !important;
    padding: 28px 24px !important;
    background: rgba(247, 176, 0, 0.84) !important;
    transform: none !important;
  }

  html.assistance-document body.assistance-page .assistance-feature-card p {
    max-width: none !important;
    font-size: clamp(16px, 4.3vw, 20px) !important;
    line-height: 1.18 !important;
  }

  html.assistance-document body.assistance-page .assistance-feature-card__icons {
    margin-top: 26px !important;
  }

  html.assistance-document body.assistance-page .assistance-feature-card__icons img {
    width: min(100%, 430px) !important;
    height: auto !important;
    object-fit: contain !important;
  }

  html.assistance-document body.assistance-page .assistance-visual-section--support {
    padding-bottom: clamp(240px, 66vw, 390px) !important;
    background:
      linear-gradient(90deg, rgba(255, 255, 255, 0.04) 0%, rgba(255, 255, 255, 0.2) 52%, rgba(237, 237, 237, 0.7) 82%, #ededed 100%),
      url("assets/assistance-support-hypercare-final.png") 20% bottom / auto 72% no-repeat,
      #ededed !important;
  }
}

@media (max-width: 480px) {
  html.assistance-document body.assistance-page .assistance-hero {
    padding: 96px 16px 44px !important;
  }

  html.assistance-document body.assistance-page .assistance-service-link {
    grid-template-columns: 68px 1fr !important;
  }

  html.assistance-document body.assistance-page .assistance-service-link__icon {
    width: 68px !important;
    height: 68px !important;
  }
}

/* 2026-07-02 - Verrou final Assistance.
   Desktop = export maquette exact avec zones cliquables invisibles.
   Mobile/tablette = grille HTML lisible, harmonisee sur le bandeau Intégration IT. */
@media (min-width: 721px) {
  html.assistance-document body.assistance-page .assistance-hero {
    height: 48.611111vw !important;
    min-height: 0 !important;
    background: #000 url("assets/assistance/hero.webp") center top / 100% 100% no-repeat !important;
    overflow: hidden !important;
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
  }

  html.assistance-document body.assistance-page .assistance-hero::before,
  html.assistance-document body.assistance-page .assistance-hero::after {
    content: none !important;
    display: none !important;
  }

  html.assistance-document body.assistance-page .assistance-hero__seo {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    opacity: 1 !important;
    pointer-events: none !important;
    z-index: 6 !important;
  }

  html.assistance-document body.assistance-page .assistance-hero__seo h1,
  html.assistance-document body.assistance-page .assistance-hero__seo p {
    display: none !important;
  }

  html.assistance-document body.assistance-page .assistance-hero__nav {
    position: absolute !important;
    inset: 0 !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    pointer-events: none !important;
  }

  html.assistance-document body.assistance-page .assistance-service-link {
    position: absolute !important;
    display: block !important;
    top: 61.0% !important;
    height: 31.5% !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    color: transparent !important;
    font-size: 0 !important;
    line-height: 0 !important;
    text-indent: -9999px !important;
    pointer-events: auto !important;
    -webkit-tap-highlight-color: transparent !important;
  }

  html.assistance-document body.assistance-page .assistance-service-link:nth-child(1) {
    left: 10.55% !important;
    width: 14.1% !important;
  }

  html.assistance-document body.assistance-page .assistance-service-link:nth-child(2) {
    left: 27.2% !important;
    width: 14.25% !important;
  }

  html.assistance-document body.assistance-page .assistance-service-link:nth-child(3) {
    left: 43.95% !important;
    width: 14.35% !important;
  }

  html.assistance-document body.assistance-page .assistance-service-link *,
  html.assistance-document body.assistance-page .assistance-service-link::before,
  html.assistance-document body.assistance-page .assistance-service-link > span:last-child::before {
    visibility: hidden !important;
    opacity: 0 !important;
  }
}

@media (max-width: 900px) {
  html.assistance-document body.assistance-page .assistance-hero {
    min-height: 760px !important;
    padding: 112px 22px 56px !important;
    background:
      linear-gradient(180deg, rgba(0, 0, 0, 0.04) 0%, rgba(0, 0, 0, 0.56) 58%, #000 100%),
      linear-gradient(90deg, #000 0%, rgba(0, 0, 0, 0.87) 45%, rgba(0, 0, 0, 0.28) 100%),
      url("assets/assistance/hero-clean.webp") 62% center / cover no-repeat,
      #000 !important;
  }

  html.assistance-document body.assistance-page .assistance-hero__seo {
    position: relative !important;
    inset: auto !important;
    width: min(100%, 680px) !important;
    height: auto !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }

  html.assistance-document body.assistance-page .assistance-hero__seo h1,
  html.assistance-document body.assistance-page .assistance-hero__seo p {
    display: block !important;
  }

  html.assistance-document body.assistance-page .assistance-hero__nav {
    position: relative !important;
    inset: auto !important;
    display: grid !important;
    width: 100% !important;
    height: auto !important;
    margin: 44px 0 0 !important;
    grid-template-columns: 1fr !important;
    gap: 14px !important;
    pointer-events: auto !important;
  }

  html.assistance-document body.assistance-page .assistance-service-link {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    width: 100% !important;
    height: auto !important;
    min-height: 92px !important;
    display: grid !important;
    grid-template-columns: 82px minmax(0, 1fr) !important;
    align-items: center !important;
    column-gap: 18px !important;
    padding: 12px 0 !important;
    overflow: visible !important;
    color: #fff !important;
    font-size: inherit !important;
    line-height: inherit !important;
    text-indent: 0 !important;
    pointer-events: auto !important;
  }

  html.assistance-document body.assistance-page .assistance-service-link *,
  html.assistance-document body.assistance-page .assistance-service-link::before,
  html.assistance-document body.assistance-page .assistance-service-link > span:last-child::before {
    visibility: visible !important;
    opacity: 1 !important;
  }

  html.assistance-document body.assistance-page .assistance-service-link__icon {
    display: flex !important;
    width: 82px !important;
    height: 82px !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
  }

  html.assistance-document body.assistance-page .assistance-service-link__icon img {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
    object-position: center !important;
    filter: none !important;
    opacity: 1 !important;
  }

  html.assistance-document body.assistance-page .assistance-service-link > span:last-child {
    position: relative !important;
    display: block !important;
    padding-left: 18px !important;
    color: #fff !important;
    font-size: clamp(21px, 6vw, 29px) !important;
    font-weight: 900 !important;
    line-height: 1.03 !important;
  }

  html.assistance-document body.assistance-page .assistance-service-link > span:last-child::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 0.38em !important;
    width: 0 !important;
    height: 0 !important;
    border-top: 0.22em solid transparent !important;
    border-bottom: 0.22em solid transparent !important;
    border-left: 0.32em solid #f7b000 !important;
  }
}

@media (max-width: 480px) {
  html.assistance-document body.assistance-page .assistance-service-link {
    grid-template-columns: 68px minmax(0, 1fr) !important;
  }

  html.assistance-document body.assistance-page .assistance-service-link__icon {
    width: 68px !important;
    height: 68px !important;
  }
}

/* 2026-07-06 - White cards integrated inside the validated yellow formation section. */
html.assistance-document body.assistance-page .assistance-visual-section--formation,
html.assistance-document body.assistance-page .assistance-visual-section--formation * {
  box-sizing: border-box !important;
}

html.assistance-document body.assistance-page .assistance-whitecard-tabs {
  grid-column: 1 !important;
  grid-row: 3 !important;
}

html.assistance-document body.assistance-page .assistance-whitecard-tabs li {
  display: block !important;
  color: #000 !important;
  font-size: clamp(18px, 1.36vw, 39px) !important;
  line-height: 1.14 !important;
  font-weight: 900 !important;
}

html.assistance-document body.assistance-page .assistance-whitecard-tab {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  appearance: none !important;
  background: transparent !important;
  color: inherit !important;
  cursor: pointer !important;
  font: inherit !important;
  letter-spacing: 0 !important;
  text-align: left !important;
}

html.assistance-document body.assistance-page .assistance-whitecard-tab:not(.is-active):not(:hover):not(:focus-visible) {
  color: #000 !important;
}

html.assistance-document body.assistance-page .assistance-whitecard-tab:hover,
html.assistance-document body.assistance-page .assistance-whitecard-tab:focus-visible,
html.assistance-document body.assistance-page .assistance-whitecard-tab.is-active {
  color: #fff !important;
}

html.assistance-document body.assistance-page .assistance-visual-section--formation .assistance-visual-section__seo > p {
  font-size: clamp(18px, 1.36vw, 39px) !important;
  line-height: 1.13 !important;
  font-weight: 700 !important;
}

html.assistance-document body.assistance-page .assistance-visual-section--formation .assistance-feature-card p,
html.assistance-document body.assistance-page .assistance-visual-section--formation .assistance-feature-panel p {
  font-size: clamp(18px, 1.34vw, 38px) !important;
  line-height: 1.12 !important;
}

html.assistance-document body.assistance-page .assistance-whitecard-tab:focus-visible {
  outline: 2px solid #fff !important;
  outline-offset: 5px !important;
}

html.assistance-document body.assistance-page .assistance-feature-card--stage {
  overflow: hidden !important;
}

html.assistance-document body.assistance-page .assistance-feature-panel {
  width: 100% !important;
  opacity: 0 !important;
  transform: translateY(14px) !important;
  transition: opacity 300ms ease, transform 300ms ease !important;
}

html.assistance-document body.assistance-page .assistance-feature-panel.is-active {
  opacity: 1 !important;
  transform: translateY(0) !important;
}

html.assistance-document body.assistance-page .assistance-feature-panel[hidden],
html.assistance-document body.assistance-page .assistance-feature-card--mobile[hidden] {
  display: none !important;
}

html.assistance-document body.assistance-page .assistance-feature-panel.is-animating,
html.assistance-document body.assistance-page .assistance-feature-card--mobile.is-animating {
  animation: assistanceWhitecardIn 320ms ease both !important;
}

html.assistance-document body.assistance-page .assistance-feature-card--mobile {
  display: none !important;
}

html.assistance-document body.assistance-page .assistance-feature-card__icons img[src*="integration-icon-strips-transparent"] {
  width: 108% !important;
  max-width: none !important;
  margin-left: -4% !important;
}

@keyframes assistanceWhitecardIn {
  from {
    opacity: 0;
    transform: translateY(14px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (min-width: 901px) {
  html.assistance-document body.assistance-page .assistance-hero {
    --assistance-hero-desktop-offset: clamp(126px, 7.4vw, 190px);
    height: calc(48.611111vw + var(--assistance-hero-desktop-offset)) !important;
    padding-top: 0 !important;
    background-position: center var(--assistance-hero-desktop-offset) !important;
    background-size: 100% auto !important;
    background-repeat: no-repeat !important;
    background-color: #000 !important;
  }

  html.assistance-document body.assistance-page .assistance-hero__seo {
    top: 0 !important;
  }
}

@media (max-width: 900px) {
  html.assistance-document body.assistance-page .assistance-hero {
    padding-top: clamp(122px, 29vw, 170px) !important;
  }

  html.assistance-document body.assistance-page .assistance-feature-card--stage {
    display: none !important;
  }

  html.assistance-document body.assistance-page .assistance-feature-card--mobile {
    display: block !important;
    width: 100% !important;
    max-width: 354px !important;
    margin: 16px 0 6px !important;
    opacity: 0 !important;
    transform: translateY(12px) !important;
  }

  html.assistance-document body.assistance-page .assistance-feature-card--mobile.is-active {
    opacity: 1 !important;
    transform: translateY(0) !important;
  }

  html.assistance-document body.assistance-page .assistance-whitecard-tabs li {
    padding-left: 16px !important;
    font-size: clamp(17px, 4.8vw, 21px) !important;
    line-height: 1.15 !important;
  }

  html.assistance-document body.assistance-page .assistance-whitecard-tab {
    line-height: 1.15 !important;
  }

  html.assistance-document body.assistance-page .assistance-visual-section--formation .assistance-visual-section__seo > p,
  html.assistance-document body.assistance-page .assistance-visual-section--formation .assistance-feature-card p,
  html.assistance-document body.assistance-page .assistance-visual-section--formation .assistance-feature-panel p {
    font-size: clamp(16px, 4.4vw, 19px) !important;
    line-height: 1.14 !important;
  }
}

/* 2026-07-06 - Mobile: keep the open white-card title readable on the light panel. */
@media (max-width: 900px) {
  html.assistance-document body.assistance-page .assistance-visual-section--formation .assistance-whitecard-tab.is-active,
  html.assistance-document body.assistance-page .assistance-visual-section--formation .assistance-whitecard-tab[aria-selected="true"],
  html.assistance-document body.assistance-page .assistance-visual-section--formation .assistance-whitecard-tab.is-active:hover,
  html.assistance-document body.assistance-page .assistance-visual-section--formation .assistance-whitecard-tab.is-active:focus-visible {
    color: #f7b000 !important;
  }
}

/* 2026-07-26 - Debrief client 2: Assistance white cards open only on explicit click. */
html.assistance-document body.assistance-page .assistance-feature-panel[hidden],
html.assistance-document body.assistance-page .assistance-feature-card--mobile[hidden] {
  display: none !important;
}

html.assistance-document body.assistance-page .assistance-whitecard-tab {
  cursor: pointer;
}

html.assistance-document body.assistance-page .assistance-whitecard-tab:not(.is-active):not(:hover):not(:focus-visible) {
  color: #000 !important;
}

@media (hover: hover) {
  html.assistance-document body.assistance-page .assistance-whitecard-tab:hover {
    color: #f7b000 !important;
  }
}

/* 2026-07-29 - Formation tabs: fixed arrow/text grid and readable states. */
html.assistance-document body.assistance-page .assistance-whitecard-tabs li {
  display: grid !important;
  grid-template-columns: 0.5em minmax(0, 1fr) !important;
  column-gap: 0.56em !important;
  align-items: center !important;
  padding-left: 0 !important;
}

html.assistance-document body.assistance-page .assistance-whitecard-tabs li::before {
  position: static !important;
  grid-column: 1 !important;
  grid-row: 1 !important;
  align-self: center !important;
  width: 0.5em !important;
  line-height: 1 !important;
  text-align: center !important;
  transform: none !important;
}

html.assistance-document body.assistance-page .assistance-whitecard-tab {
  grid-column: 2 !important;
  grid-row: 1 !important;
  color: #000 !important;
  text-decoration: none !important;
}

html.assistance-document body.assistance-page .assistance-feature-card--mobile {
  grid-column: 1 / -1 !important;
}

html.assistance-document body.assistance-page .assistance-whitecard-tab:not(.is-active):hover {
  color: #000 !important;
  text-decoration: none !important;
}

html.assistance-document body.assistance-page .assistance-visual-section--formation .assistance-whitecard-tab.is-active,
html.assistance-document body.assistance-page .assistance-visual-section--formation .assistance-whitecard-tab[aria-selected="true"],
html.assistance-document body.assistance-page .assistance-visual-section--formation .assistance-whitecard-tab.is-active:hover,
html.assistance-document body.assistance-page .assistance-visual-section--formation .assistance-whitecard-tab.is-active:focus-visible {
  color: #fff !important;
  text-decoration: none !important;
}

html.assistance-document body.assistance-page .assistance-whitecard-tab:focus-visible {
  outline: none !important;
}

/* 2026-07-29 - Assistance smartphone-only visual corrections. */
@media (max-width: 720px) {
  /* Formation tabs: keep every label readable and restore a regular arrow column. */
  html.assistance-document body.assistance-page .assistance-visual-section--formation .assistance-whitecard-tab,
  html.assistance-document body.assistance-page .assistance-visual-section--formation .assistance-whitecard-tab.is-active,
  html.assistance-document body.assistance-page .assistance-visual-section--formation .assistance-whitecard-tab[aria-selected="true"],
  html.assistance-document body.assistance-page .assistance-visual-section--formation .assistance-whitecard-tab.is-active:hover,
  html.assistance-document body.assistance-page .assistance-visual-section--formation .assistance-whitecard-tab.is-active:focus-visible {
    color: #000 !important;
    text-decoration: none !important;
  }

  html.assistance-document body.assistance-page .assistance-whitecard-tabs li::before {
    content: "" !important;
    position: static !important;
    display: block !important;
    justify-self: center !important;
    width: 0 !important;
    height: 0 !important;
    border-top: 0.22em solid transparent !important;
    border-bottom: 0.22em solid transparent !important;
    border-left: 0.34em solid #f7b000 !important;
    color: transparent !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  /* The pilotage source has a white plate: blend it into the orange card without
     altering the icon file or the alignment of the strip. */
  html.assistance-document body.assistance-page
    .assistance-feature-card--mobile[data-assistance-whitecard-mobile="pilotage"]
    .assistance-feature-card__icons,
  html.assistance-document body.assistance-page
    .assistance-feature-card--mobile[data-assistance-whitecard-mobile="pilotage"]
    .assistance-feature-card__icons img {
    background: transparent !important;
  }

  html.assistance-document body.assistance-page
    .assistance-feature-card--mobile[data-assistance-whitecard-mobile="pilotage"]
    .assistance-feature-card__icons img {
    mix-blend-mode: darken !important;
  }

  /* Natural mobile image-to-light-background transitions. The photographs begin
     below the copy, remain clear on the left and fade progressively to the right. */
  html.assistance-document body.assistance-page .assistance-visual-section--documentation {
    background:
      linear-gradient(
        90deg,
        rgba(255, 255, 255, 0) 0%,
        rgba(255, 255, 255, 0) 42%,
        rgba(255, 255, 255, 0.18) 58%,
        rgba(255, 255, 255, 0.76) 82%,
        #fff 100%
      ),
      url("assets/assistance/documentation-clean.webp") left bottom / auto 46% no-repeat,
      #fff !important;
  }

  html.assistance-document body.assistance-page .assistance-visual-section--support {
    background:
      linear-gradient(
        90deg,
        rgba(237, 237, 237, 0) 0%,
        rgba(237, 237, 237, 0) 42%,
        rgba(237, 237, 237, 0.2) 58%,
        rgba(237, 237, 237, 0.78) 82%,
        #ededed 100%
      ),
      url("assets/assistance-support-hypercare-final.png") left bottom / auto 46% no-repeat,
      #ededed !important;
  }
}

@media (max-width: 720px) and (hover: hover) {
  html.assistance-document body.assistance-page
    .assistance-visual-section--formation
    .assistance-whitecard-tab:not(.is-active):hover {
    color: #f7b000 !important;
  }
}

/* 2026-07-30 - Mobile/tablet only: natural image fades for Documentation and Support. */
@media (max-width: 900px) {
  html.assistance-document body.assistance-page .assistance-visual-section--documentation {
    background:
      linear-gradient(
        180deg,
        #fff 0%,
        #fff 45%,
        rgba(255, 255, 255, 0.98) 51%,
        rgba(255, 255, 255, 0.76) 57%,
        rgba(255, 255, 255, 0.28) 65%,
        rgba(255, 255, 255, 0) 75%
      ),
      linear-gradient(
        90deg,
        rgba(255, 255, 255, 0) 0%,
        rgba(255, 255, 255, 0) 70%,
        rgba(255, 255, 255, 0.12) 82%,
        rgba(255, 255, 255, 0.52) 92%,
        #fff 100%
      ),
      url("assets/assistance/documentation-clean.webp") left bottom / auto 56% no-repeat,
      #fff !important;
  }

  html.assistance-document body.assistance-page .assistance-visual-section--support {
    background:
      linear-gradient(
        180deg,
        #ededed 0%,
        #ededed 45%,
        rgba(237, 237, 237, 0.98) 51%,
        rgba(237, 237, 237, 0.76) 57%,
        rgba(237, 237, 237, 0.28) 65%,
        rgba(237, 237, 237, 0) 75%
      ),
      linear-gradient(
        90deg,
        rgba(237, 237, 237, 0) 0%,
        rgba(237, 237, 237, 0) 70%,
        rgba(237, 237, 237, 0.12) 82%,
        rgba(237, 237, 237, 0.52) 92%,
        #ededed 100%
      ),
      url("assets/assistance-support-hypercare-final.png") left bottom / auto 56% no-repeat,
      #ededed !important;
  }
}