/*
 * Desktop resize correction for the Engineering and Assistance service pages.
 * Sections remain full width while text, icons and vertical rhythm are bounded.
 * Existing tablet/mobile layouts (<= 900px) remain unchanged.
 */

@media (min-width: 901px) {
  body.engineering-page .engineering-main,
  body.assistance-page .assistance-main {
    width: 100%;
    max-width: none;
    overflow-x: clip;
  }

  /* Engineering hero: independent background crop and bounded HTML content. */
  body.engineering-page .engineering-hero {
    height: clamp(690px, 49.65vw, 900px) !important;
    min-height: 690px !important;
    padding: 0 !important;
    background:
      radial-gradient(circle at 62% 34%, rgba(0, 0, 0, 0) 0 20%, rgba(0, 0, 0, 0.18) 45%, rgba(0, 0, 0, 0.66) 100%),
      linear-gradient(90deg, #000 0%, rgba(0, 0, 0, 0.98) 12%, rgba(0, 0, 0, 0.88) 25%, rgba(0, 0, 0, 0.35) 43%, rgba(0, 0, 0, 0.08) 66%, rgba(0, 0, 0, 0.45) 100%),
      linear-gradient(180deg, rgba(0, 0, 0, 0.55) 0%, rgba(0, 0, 0, 0.08) 38%, rgba(0, 0, 0, 0.2) 65%, #000 100%),
      url("assets/engineering/hero-photo.webp") 58% center / cover no-repeat,
      #000 !important;
  }

  body.engineering-page .engineering-hero__content {
    top: clamp(118px, 15.5%, 156px) !important;
    left: max(7vw, calc((100% - 1440px) / 2 + 84px)) !important;
    width: min(36%, 520px) !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }

  body.engineering-page .engineering-hero h1 {
    font-size: clamp(52px, 4.3vw, 72px) !important;
  }

  body.engineering-page .engineering-hero__content p {
    max-width: 460px !important;
    margin-top: clamp(28px, 2.3vw, 40px) !important;
    font-size: clamp(16px, 1.35vw, 20px) !important;
  }

  body.engineering-page .engineering-shortcuts {
    position: absolute !important;
    inset: auto max(5vw, calc((100% - 1440px) / 2 + 58px)) 58px !important;
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    align-items: start !important;
    gap: clamp(22px, 3vw, 54px) !important;
    width: auto !important;
    height: auto !important;
    pointer-events: none !important;
  }

  body.engineering-page .engineering-shortcuts a,
  body.engineering-page .engineering-shortcuts a:nth-child(n) {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    display: block !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    color: #fff !important;
    font-size: inherit !important;
    line-height: inherit !important;
    text-indent: 0 !important;
    pointer-events: auto !important;
  }

  body.engineering-page .engineering-shortcuts__visual {
    display: flex !important;
    height: clamp(82px, 7.2vw, 104px) !important;
    max-height: 104px !important;
    align-items: flex-end !important;
    justify-content: flex-start !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  body.engineering-page .engineering-shortcuts__visual img {
    width: auto !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 104px !important;
    object-fit: contain !important;
    object-position: center bottom !important;
  }

  body.engineering-page .engineering-shortcuts__label {
    display: block !important;
    margin-top: 12px !important;
    padding-left: 12px !important;
    color: #fff !important;
    font-size: clamp(14px, 1.35vw, 18px) !important;
    font-weight: 900 !important;
    line-height: 1.04 !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  body.engineering-page .engineering-services {
    width: 100% !important;
  }

  body.engineering-page .engineering-service {
    min-height: clamp(470px, 34vw, 610px) !important;
  }

  body.engineering-page .engineering-service h2 {
    font-size: clamp(40px, 3.4vw, 58px) !important;
  }

  body.engineering-page .engineering-service p {
    font-size: clamp(16px, 1.3vw, 19px) !important;
  }

  body.engineering-page .engineering-pilotage {
    height: clamp(560px, 34.8vw, 690px) !important;
    min-height: 560px !important;
    background:
      linear-gradient(90deg, #fff 0%, #fff 24%, rgba(255, 255, 255, 0.98) 34%, rgba(255, 255, 255, 0.83) 45%, rgba(255, 255, 255, 0.32) 60%, rgba(255, 255, 255, 0) 78%),
      linear-gradient(180deg, rgba(255, 255, 255, 0.88) 0%, rgba(255, 255, 255, 0.24) 22%, rgba(255, 255, 255, 0) 56%),
      url("assets/engineering/pilotage-photo.webp") 52% center / cover no-repeat,
      #fff !important;
  }

  body.engineering-page .engineering-pilotage__content {
    top: 16% !important;
    left: max(7vw, calc((100% - 1440px) / 2 + 84px)) !important;
    width: min(47%, 680px) !important;
  }

  /* Assistance hero: clean photo plus bounded selectable HTML and icons. */
  html.assistance-document body.assistance-page .assistance-hero {
    height: clamp(690px, 48.6vw, 900px) !important;
    min-height: 690px !important;
    padding: 0 !important;
    background:
      linear-gradient(180deg, rgba(0, 0, 0, 0.12) 0%, rgba(0, 0, 0, 0.16) 58%, #000 100%),
      linear-gradient(90deg, #000 0%, rgba(0, 0, 0, 0.9) 31%, rgba(0, 0, 0, 0.2) 64%, rgba(0, 0, 0, 0.5) 100%),
      url("assets/assistance/hero-clean.webp") 58% center / cover no-repeat,
      #000 !important;
  }

  html.assistance-document body.assistance-page .assistance-hero__seo {
    position: absolute !important;
    inset: clamp(118px, 15.5%, 156px) auto auto max(7vw, calc((100% - 1440px) / 2 + 84px)) !important;
    width: min(78%, 1120px) !important;
    height: auto !important;
    opacity: 1 !important;
    visibility: visible !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__seo h1 {
    width: min(46%, 540px) !important;
    margin: 0 0 30px !important;
    font-size: clamp(52px, 4.3vw, 72px) !important;
  }

  html.assistance-document body.assistance-page .assistance-hero__seo p {
    width: min(38%, 460px) !important;
    max-width: 460px !important;
    font-size: clamp(16px, 1.35vw, 20px) !important;
    line-height: 1.22 !important;
  }

  html.assistance-document body.assistance-page .assistance-hero__nav {
    position: relative !important;
    inset: auto !important;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    width: min(64%, 780px) !important;
    height: auto !important;
    margin: clamp(90px, 7.7vw, 112px) 0 0 !important;
    gap: clamp(34px, 4.2vw, 62px) !important;
    align-items: start !important;
    pointer-events: auto !important;
  }

  html.assistance-document body.assistance-page .assistance-service-link,
  html.assistance-document body.assistance-page .assistance-service-link:nth-child(n) {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    display: grid !important;
    grid-template-rows: clamp(82px, 7.2vw, 104px) auto !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    color: #fff !important;
    font-size: clamp(14px, 1.35vw, 18px) !important;
    line-height: 1.04 !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;
  }

  html.assistance-document body.assistance-page .assistance-service-link__icon {
    display: flex !important;
    width: auto !important;
    height: clamp(82px, 7.2vw, 104px) !important;
    max-height: 104px !important;
    align-items: flex-end !important;
    justify-content: flex-start !important;
    opacity: 1 !important;
  }

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

  html.assistance-document body.assistance-page .assistance-service-link > span:last-child {
    position: relative !important;
    display: block !important;
    padding-left: 0 !important;
    color: #fff !important;
    font-size: inherit !important;
    line-height: inherit !important;
    opacity: 1 !important;
  }

  html.assistance-document body.assistance-page .assistance-service-link > span:last-child::before {
    content: "" !important;
    position: absolute !important;
    top: 0.38em !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;
    opacity: 1 !important;
  }

  html.assistance-document body.assistance-page .assistance-visual-section--documentation {
    height: 38.194444vw !important;
    min-height: 0 !important;
    background: #fff url("assets/assistance/documentation-clean.webp") left top / cover no-repeat !important;
  }

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

  html.assistance-document body.assistance-page #documentation-formalisation-operationnelle::after {
    content: none !important;
    display: none !important;
  }

  html.assistance-document body.assistance-page .assistance-visual-section--documentation .assistance-visual-section__seo,
  html.assistance-document body.assistance-page .assistance-visual-section--support .assistance-visual-section__seo {
    position: absolute !important;
    inset: 14% 0 auto !important;
    width: 100% !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }

  html.assistance-document body.assistance-page .assistance-visual-section--documentation .assistance-visual-section__seo h2,
  html.assistance-document body.assistance-page .assistance-visual-section--support .assistance-visual-section__seo h2 {
    width: min(72vw, 920px) !important;
    max-width: 920px !important;
    margin: 0 auto clamp(34px, 3.3vw, 52px) !important;
    font-size: clamp(42px, 3.8vw, 60px) !important;
    text-align: center !important;
  }

  html.assistance-document body.assistance-page .assistance-visual-section--documentation .assistance-visual-section__seo p,
  html.assistance-document body.assistance-page .assistance-visual-section--support .assistance-visual-section__seo p {
    width: min(49%, 620px) !important;
    max-width: 620px !important;
    margin: 0 max(7vw, calc((100% - 1440px) / 2 + 84px)) 14px auto !important;
    font-size: clamp(16px, 1.25vw, 19px) !important;
    line-height: 1.22 !important;
  }

  html.assistance-document body.assistance-page .assistance-visual-section--formation {
    height: clamp(460px, 35.5vw, 620px) !important;
    min-height: 460px !important;
  }

  html.assistance-document body.assistance-page .assistance-visual-section--formation .assistance-visual-section__seo {
    inset: 11% max(7vw, calc((100% - 1440px) / 2 + 84px)) auto !important;
    grid-template-columns: minmax(0, 1fr) minmax(380px, 0.95fr) !important;
    column-gap: clamp(54px, 7vw, 110px) !important;
    width: auto !important;
    max-width: 1272px !important;
  }

  html.assistance-document body.assistance-page .assistance-visual-section--formation .assistance-visual-section__seo h2 {
    margin-bottom: clamp(42px, 3.8vw, 58px) !important;
    font-size: clamp(42px, 3.8vw, 60px) !important;
  }

  html.assistance-document body.assistance-page .assistance-visual-section--formation .assistance-visual-section__seo > p {
    width: auto !important;
    margin-bottom: 34px !important;
    font-size: clamp(17px, 1.25vw, 19px) !important;
  }

  html.assistance-document body.assistance-page .assistance-whitecard-tabs {
    gap: 14px !important;
  }

  html.assistance-document body.assistance-page .assistance-whitecard-tabs li {
    font-size: clamp(17px, 1.25vw, 19px) !important;
  }

  html.assistance-document body.assistance-page .assistance-feature-card {
    min-height: 230px !important;
    margin-top: 0 !important;
    padding: clamp(34px, 3vw, 48px) !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(16px, 1.2vw, 18px) !important;
  }

  html.assistance-document body.assistance-page .assistance-visual-section--support {
    height: 40.555556vw !important;
    min-height: 0 !important;
    background: #ededed url("assets/assistance-support-hypercare-final.png") left top / cover no-repeat !important;
  }

  html.assistance-document body.assistance-page .assistance-visual-section--support::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: 1 !important;
    display: block !important;
    background:
      linear-gradient(90deg, rgba(238, 238, 238, 0.06) 0%, rgba(238, 238, 238, 0.18) 20%, rgba(238, 238, 238, 0.48) 36%, rgba(238, 238, 238, 0.82) 48%, rgba(238, 238, 238, 0.97) 58%, #eee 68%, #eee 100%),
      linear-gradient(180deg, rgba(238, 238, 238, 0.72) 0%, rgba(238, 238, 238, 0.5) 28%, rgba(238, 238, 238, 0.28) 52%, rgba(238, 238, 238, 0.1) 76%, rgba(238, 238, 238, 0.02) 100%) !important;
    opacity: 1 !important;
    pointer-events: none !important;
  }
}

@media (min-width: 901px) and (max-width: 1100px) {
  body.engineering-page .engineering-hero,
  html.assistance-document body.assistance-page .assistance-hero {
    height: 760px !important;
    min-height: 760px !important;
  }
}

/* 2026-07-29 - Assistance desktop hero: exact PSD background and gradient.
   Text, pictograms and service links remain as the validated HTML layer. */
@media (min-width: 901px) {
  html.assistance-document body.assistance-page .assistance-hero {
    background: #000 url("assets/assistance/hero-psd-clean.webp") center center / cover no-repeat !important;
  }
}

/* 2026-07-30 - Desktop shortcut hover aligned with Engineering. */
@media (min-width: 901px) and (hover: hover) {
  html.assistance-document
    body.assistance-page
    .assistance-service-link__icon
    img {
    transition: transform 180ms ease !important;
  }

  html.assistance-document
    body.assistance-page
    .assistance-service-link:hover
    .assistance-service-link__icon
    img {
    transform: translateY(-4px) !important;
  }
}

/* 2026-07-29 - Mobile service heroes: shared rhythm and compact shortcut grids.
   Integration IT remains the visual reference; desktop rules stay untouched. */
@media (max-width: 900px) {
  body.engineering-page .engineering-hero__content h1,
  html.assistance-document body.assistance-page .assistance-hero__seo h1 {
    width: 100% !important;
    max-width: none !important;
    margin: 0 0 18px !important;
    font-size: 42px !important;
    line-height: 0.98 !important;
  }

  body.engineering-page .engineering-hero__content p,
  html.assistance-document body.assistance-page .assistance-hero__seo p {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    font-size: 16px !important;
    line-height: 1.22 !important;
  }

  body.engineering-page .engineering-shortcuts,
  html.assistance-document body.assistance-page .assistance-hero__nav {
    position: relative !important;
    inset: auto !important;
    display: grid !important;
    align-items: start !important;
    width: 100% !important;
    max-width: none !important;
    height: auto !important;
    margin: 42px 0 0 !important;
    pointer-events: auto !important;
  }

  body.engineering-page .engineering-shortcuts {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }

  html.assistance-document body.assistance-page .assistance-hero__nav {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 24px !important;
  }

  body.engineering-page .engineering-shortcuts a,
  body.engineering-page .engineering-shortcuts a:nth-child(n),
  html.assistance-document body.assistance-page .assistance-service-link,
  html.assistance-document body.assistance-page .assistance-service-link:nth-child(n) {
    position: relative !important;
    inset: auto !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 110px !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 0 !important;
    color: #fff !important;
    text-align: left !important;
    text-decoration: none !important;
    text-indent: 0 !important;
    pointer-events: auto !important;
  }

  body.engineering-page .engineering-shortcuts__visual,
  html.assistance-document body.assistance-page .assistance-service-link__icon {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 72px !important;
    max-width: none !important;
    max-height: 72px !important;
    margin: 0 !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  body.engineering-page .engineering-shortcuts__visual img,
  html.assistance-document body.assistance-page .assistance-service-link__icon img {
    display: block !important;
    width: auto !important;
    height: 72px !important;
    max-width: 100% !important;
    max-height: 72px !important;
    object-fit: contain !important;
    object-position: center !important;
    opacity: 1 !important;
  }

  html.assistance-document body.assistance-page .assistance-service-link__icon {
    align-items: flex-end !important;
  }

  html.assistance-document body.assistance-page .assistance-service-link__icon img {
    height: 66px !important;
    max-height: 66px !important;
    object-position: center bottom !important;
  }

  body.engineering-page .engineering-shortcuts__label,
  html.assistance-document body.assistance-page .assistance-service-link > span:last-child {
    position: relative !important;
    display: block !important;
    align-self: center !important;
    width: fit-content !important;
    max-width: 100% !important;
    margin: 8px 0 0 !important;
    padding: 0 0 0 12px !important;
    color: #fff !important;
    font-size: 14px !important;
    font-weight: 900 !important;
    line-height: 1.04 !important;
    text-align: left !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  body.engineering-page .engineering-shortcuts__label::before,
  html.assistance-document body.assistance-page .assistance-service-link > span:last-child::before {
    content: "" !important;
    position: absolute !important;
    top: 0.38em !important;
    left: 0 !important;
    display: block !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;
    visibility: visible !important;
    opacity: 1 !important;
  }
}

/* 2026-08-03 - Assistance desktop shortcut rhythm.
   Match the perceived spacing of the other service heroes while preserving
   the copy's left axis, the validated bottom clearance and all mobile rules. */
@media (min-width: 901px) {
  html.assistance-document body.assistance-page .assistance-hero__nav {
    width: 560px !important;
    column-gap: 40px !important;
    row-gap: 0 !important;
  }
}

/* 2026-08-03 - Very-wide desktop stabilization.
   Keep service backgrounds full width while aligning selectable content to
   the validated homepage 1120px container. Tablet/mobile rules are untouched. */
@media (min-width: 1600px) {
  body.engineering-page .engineering-main,
  body.engineering-page .engineering-hero,
  html.assistance-document body.assistance-page .assistance-main,
  html.assistance-document body.assistance-page .assistance-hero {
    width: 100% !important;
    max-width: none !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
  }

  body.engineering-page .engineering-hero__content,
  html.assistance-document body.assistance-page .assistance-hero__seo {
    left: calc(50% - 560px) !important;
  }

  body.engineering-page .engineering-shortcuts {
    right: auto !important;
    bottom: 181px !important;
    left: calc(50% - 560px) !important;
    width: 960px !important;
    column-gap: 54px !important;
    row-gap: 0 !important;
    transform: none !important;
  }

  html.assistance-document body.assistance-page .assistance-hero__seo {
    width: 1120px !important;
  }

  body.engineering-page .engineering-service h2,
  body.engineering-page .engineering-service p {
    right: auto !important;
    width: calc(100% - 40px) !important;
    transform: translateX(-50%) !important;
  }

  body.engineering-page .engineering-service:nth-child(odd) h2,
  body.engineering-page .engineering-service:nth-child(odd) p {
    left: calc(100% - 280px) !important;
  }

  body.engineering-page .engineering-service:nth-child(even) h2,
  body.engineering-page .engineering-service:nth-child(even) p {
    left: 280px !important;
  }

  body.engineering-page .engineering-service h2 {
    max-width: 520px !important;
  }

  body.engineering-page .engineering-service p {
    max-width: 500px !important;
  }

  body.engineering-page .engineering-pilotage__content {
    left: calc(50% - 560px) !important;
    width: 1120px !important;
  }

  body.engineering-page .engineering-pilotage h2 {
    width: 100% !important;
    max-width: 1120px !important;
    font-size: 68px !important;
  }

  body.engineering-page .engineering-pilotage p {
    width: 500px !important;
    max-width: 500px !important;
    font-size: 19px !important;
  }

  html.assistance-document body.assistance-page .assistance-visual-section--documentation,
  html.assistance-document body.assistance-page .assistance-visual-section--support {
    height: auto !important;
  }

  html.assistance-document body.assistance-page .assistance-visual-section--documentation {
    min-height: 733px !important;
    max-height: 733px !important;
  }

  html.assistance-document body.assistance-page .assistance-visual-section--support {
    min-height: 779px !important;
    max-height: 779px !important;
  }

  html.assistance-document body.assistance-page .assistance-visual-section--documentation .assistance-visual-section__seo p,
  html.assistance-document body.assistance-page .assistance-visual-section--support .assistance-visual-section__seo p {
    margin-right: calc(50% - 560px) !important;
  }

  html.assistance-document body.assistance-page .assistance-visual-section--formation .assistance-visual-section__seo {
    right: auto !important;
    left: 50% !important;
    width: 1120px !important;
    transform: translateX(-50%) !important;
  }
}

/* 2026-08-03 - Desktop shortcut row aligned with its hero copy.
   Assistance already follows this structure and remains the reference. */
@media (min-width: 901px) and (max-width: 1599px) {
  body.engineering-page .engineering-shortcuts {
    top: auto !important;
    right: auto !important;
    bottom: 31px !important;
    left: max(7vw, calc((100% - 1440px) / 2 + 84px)) !important;
    width: min(960px, 86%) !important;
    column-gap: 54px !important;
    row-gap: 0 !important;
    transform: none !important;
  }
}

@media (max-width: 720px) {
  body.engineering-page .engineering-hero__content p,
  html.assistance-document body.assistance-page .assistance-hero__seo p {
    font-size: 17px !important;
  }

  body.engineering-page .engineering-shortcuts,
  html.assistance-document body.assistance-page .assistance-hero__nav {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    column-gap: 18px !important;
    row-gap: 26px !important;
    margin-top: 34px !important;
  }

  body.engineering-page .engineering-shortcuts a,
  body.engineering-page .engineering-shortcuts a:nth-child(n),
  html.assistance-document body.assistance-page .assistance-service-link,
  html.assistance-document body.assistance-page .assistance-service-link:nth-child(n) {
    min-height: 113px !important;
  }

  body.engineering-page .engineering-shortcuts__label,
  html.assistance-document body.assistance-page .assistance-service-link > span:last-child {
    font-size: 16px !important;
  }

  body.engineering-page .engineering-shortcuts a:last-child,
  html.assistance-document body.assistance-page .assistance-service-link:last-child {
    grid-column: 1 / -1 !important;
    justify-self: center !important;
    width: calc((100% - 18px) / 2) !important;
  }
}

/* 2026-07-30 - Mobile/tablet only: targeted service-page visual tuning. */
@media (max-width: 900px) {
  body.engineering-page .engineering-hero {
    background:
      linear-gradient(
        180deg,
        rgba(0, 0, 0, 0.04) 0%,
        rgba(0, 0, 0, 0.46) 58%,
        rgba(0, 0, 0, 0.88) 100%
      ),
      linear-gradient(
        90deg,
        rgba(0, 0, 0, 0.88) 0%,
        rgba(0, 0, 0, 0.74) 45%,
        rgba(0, 0, 0, 0.18) 100%
      ),
      url("assets/engineering/hero-photo.webp") 62% center / cover no-repeat,
      #000 !important;
  }

  body.engineering-page .engineering-pilotage {
    background:
      linear-gradient(
        180deg,
        #fff 0%,
        #fff 50%,
        rgba(255, 255, 255, 0.91) 61%,
        rgba(255, 255, 255, 0.30) 80%,
        rgba(255, 255, 255, 0) 100%
      ),
      url("assets/engineering/pilotage-photo.webp") center bottom / cover no-repeat,
      #fff !important;
  }

  body.engineering-page
    .engineering-pilotage
    #engineering-pilotage-title {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
  }

  html.assistance-document body.assistance-page .assistance-hero {
    background:
      linear-gradient(
        180deg,
        rgba(0, 0, 0, 0.02) 0%,
        rgba(0, 0, 0, 0.32) 58%,
        rgba(0, 0, 0, 0.76) 100%
      ),
      linear-gradient(
        90deg,
        rgba(0, 0, 0, 0.78) 0%,
        rgba(0, 0, 0, 0.58) 45%,
        rgba(0, 0, 0, 0.10) 100%
      ),
      url("assets/assistance/hero-clean.webp") 62% center / cover no-repeat,
      #000 !important;
    height: auto !important;
    min-height: 0 !important;
    padding-bottom: clamp(24px, 6vw, 40px) !important;
  }

  body.engineering-page .contact-cta,
  html.assistance-document body.assistance-page .contact-cta {
    background-image:
      linear-gradient(
        180deg,
        rgba(0, 0, 0, 0.82) 0%,
        rgba(0, 0, 0, 0.66) 48%,
        rgba(0, 0, 0, 0.30) 100%
      ),
      var(--cta-image) !important;
    background-size: 100% 100%, cover !important;
    background-position: center center, 72% top !important;
    background-repeat: no-repeat !important;
  }
}

/* 2026-08-03 - Smartphone readability for the long pilotage copy.
   Keep the upper half white, then retain a protective translucent veil behind
   the last paragraphs before revealing the photograph at the bottom. */
@media (max-width: 720px) {
  body.engineering-page .engineering-pilotage {
    background:
      linear-gradient(
        180deg,
        #fff 0%,
        #fff 55%,
        rgba(255, 255, 255, 0.98) 66%,
        rgba(255, 255, 255, 0.90) 77%,
        rgba(255, 255, 255, 0.62) 87%,
        rgba(255, 255, 255, 0.20) 96%,
        rgba(255, 255, 255, 0) 100%
      ),
      url("assets/engineering/pilotage-photo.webp") center bottom / cover no-repeat,
      #fff !important;
  }
}

/* 2026-08-12 - Mobile-only parity with the validated Home/Integration CTA.
   The shared ::before already draws the dark veil. Keeping the image alone on
   the section prevents the older service rule from stacking a second veil. */
@media (max-width: 900px) {
  body.engineering-page .contact-cta,
  html.assistance-document body.assistance-page .contact-cta {
    min-height: 470px !important;
    background-image: var(--cta-image) !important;
    background-size: cover !important;
    background-position: 72% top !important;
    background-repeat: no-repeat !important;
  }

  body.engineering-page .contact-cta__inner,
  html.assistance-document body.assistance-page .contact-cta__inner {
    min-height: 470px !important;
    padding-top: 72px !important;
    align-items: flex-start !important;
  }
}

/* Mobile-only: spread the light-to-image transition over a wider area so the
   fade remains continuous behind the full copy instead of forming a band. */
@media (max-width: 720px) {
  body.engineering-page .engineering-pilotage {
    background:
      linear-gradient(
        180deg,
        #fff 0%,
        #fff 48%,
        rgba(255, 255, 255, 0.995) 57%,
        rgba(255, 255, 255, 0.97) 66%,
        rgba(255, 255, 255, 0.88) 75%,
        rgba(255, 255, 255, 0.68) 84%,
        rgba(255, 255, 255, 0.42) 91%,
        rgba(255, 255, 255, 0.16) 97%,
        rgba(255, 255, 255, 0) 100%
      ),
      url("assets/engineering/pilotage-photo.webp") center bottom / cover no-repeat,
      #fff !important;
  }
}


/* Keep the validated Documentation/Formation geometry, but make the shared
   edge immune to fractional-device-pixel rounding in Chromium/Opera. */
html.assistance-document body.assistance-page
  .assistance-visual-section--documentation {
  margin-bottom: 0 !important;
  border-bottom: 0 !important;
}

html.assistance-document body.assistance-page
  .assistance-visual-section--formation {
  margin-top: 0 !important;
  border-top: 0 !important;
}

@media (min-width: 901px) {
  html.assistance-document body.assistance-page
    .assistance-visual-section--formation {
    box-shadow: 0 -2px 0 #f7b000 !important;
  }
}

/* 2026-08-03 - Engineering-only client rollback.
   Restore the original edge-to-edge two-column composition without the
   artificial central gutters. Text uses a stable internal grid instead of
   per-card offsets, and the hero shortcuts share the copy's left axis. */
@media (min-width: 901px) {
  body.engineering-page .engineering-hero {
    --engineering-copy-left: max(7vw, calc((100% - 1440px) / 2 + 84px));
  }

  body.engineering-page .engineering-shortcuts {
    top: auto !important;
    right: auto !important;
    bottom: 56px !important;
    left: var(--engineering-copy-left) !important;
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    width: min(
      960px,
      calc(100% - var(--engineering-copy-left) - var(--engineering-copy-left))
    ) !important;
    column-gap: 40px !important;
    row-gap: 0 !important;
    transform: none !important;
  }

  body.engineering-page .engineering-services {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    column-gap: 0 !important;
    row-gap: 0 !important;
  }

  body.engineering-page .engineering-service,
  body.engineering-page .engineering-service:nth-child(n) {
    position: relative !important;
    display: grid !important;
    grid-template-rows: clamp(150px, 10vw, 174px) auto !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: clamp(500px, 32vw, 610px) !important;
    height: auto !important;
    align-content: start !important;
    box-sizing: border-box !important;
    padding: clamp(58px, 5vw, 78px) clamp(48px, 6vw, 92px)
      clamp(52px, 5vw, 72px) !important;
    margin: 0 !important;
    column-gap: 0 !important;
    row-gap: clamp(50px, 4vw, 76px) !important;
  }

  body.engineering-page .engineering-service h2,
  body.engineering-page .engineering-service:nth-child(n) h2,
  body.engineering-page .engineering-service p,
  body.engineering-page .engineering-service:nth-child(n) p {
    position: static !important;
    inset: auto !important;
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
    transform: none !important;
  }

  body.engineering-page .engineering-service h2,
  body.engineering-page .engineering-service:nth-child(n) h2 {
    align-self: start !important;
    margin: 0 !important;
    font-size: clamp(40px, 3.4vw, 58px) !important;
    line-height: 0.96 !important;
    text-align: center !important;
  }

  body.engineering-page .engineering-service p,
  body.engineering-page .engineering-service:nth-child(n) p {
    align-self: start !important;
    margin: 0 !important;
    font-size: clamp(16px, 1.3vw, 19px) !important;
    line-height: 1.27 !important;
  }
}

/* 2026-08-03 - Client video follow-up: one deterministic hero rhythm.
   Equal grid tracks keep label length from changing icon spacing. The rows
   retain the validated 56px clearance and never distribute with viewport
   width. */
@media (min-width: 901px) {
  body.engineering-page .engineering-shortcuts {
    right: auto !important;
    bottom: 56px !important;
    left: max(24px, calc(50% - 480px)) !important;
    width: min(960px, calc(100% - 48px)) !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    column-gap: 40px !important;
    transform: none !important;
  }

  html.assistance-document body.assistance-page .assistance-hero__seo {
    bottom: 56px !important;
  }

  html.assistance-document body.assistance-page .assistance-hero__nav {
    width: 600px !important;
    max-width: 100% !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    column-gap: 40px !important;
    justify-content: start !important;
  }

  html.assistance-document body.assistance-page .assistance-service-link,
  html.assistance-document body.assistance-page .assistance-service-link:nth-child(n) {
    justify-items: stretch !important;
  }

  html.assistance-document body.assistance-page .assistance-service-link__icon {
    justify-content: flex-start !important;
  }
}

/* The four Engineering cards share one bounded two-column system. This final
   declaration deliberately repeats only the container geometry so older
   per-card viewport rules cannot widen or offset the grid. */
@media (min-width: 901px) {
  body.engineering-page .engineering-services {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    width: min(1120px, calc(100% - 48px)) !important;
    max-width: 1120px !important;
    margin: 32px auto !important;
    column-gap: 32px !important;
    row-gap: 32px !important;
  }
}

/* Smartphone-only pilotage veil: keep the photograph visible at the bottom,
   while protecting the complete final paragraph rather than ending the fade
   midway through the copy. */
@media (max-width: 720px) {
  body.engineering-page .engineering-pilotage {
    background:
      linear-gradient(
        180deg,
        #fff 0%,
        #fff 64%,
        rgba(255, 255, 255, 0.99) 74%,
        rgba(255, 255, 255, 0.93) 84%,
        rgba(255, 255, 255, 0.70) 91%,
        rgba(255, 255, 255, 0.30) 97%,
        rgba(255, 255, 255, 0) 100%
      ),
      url("assets/engineering/pilotage-photo.webp") center bottom / cover no-repeat,
      #fff !important;
  }
}

/* 2026-08-03 - Final Engineering-only rollback lock. */
@media (min-width: 901px) {
  body.engineering-page .engineering-hero {
    --engineering-copy-left: max(24px, 7vw, calc(50% - 560px));
  }

  body.engineering-page .engineering-shortcuts {
    top: auto !important;
    right: auto !important;
    bottom: 56px !important;
    left: var(--engineering-copy-left) !important;
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    width: min(
      960px,
      calc(100% - var(--engineering-copy-left) - var(--engineering-copy-left))
    ) !important;
    column-gap: 40px !important;
    row-gap: 0 !important;
    transform: none !important;
  }

  body.engineering-page .engineering-services {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    column-gap: 0 !important;
    row-gap: 0 !important;
  }

  body.engineering-page .engineering-service,
  body.engineering-page .engineering-service:nth-child(n) {
    position: relative !important;
    display: grid !important;
    grid-template-rows: clamp(150px, 10vw, 174px) auto !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: clamp(500px, 32vw, 610px) !important;
    height: auto !important;
    align-content: start !important;
    box-sizing: border-box !important;
    padding: clamp(58px, 5vw, 78px) clamp(48px, 6vw, 92px)
      clamp(52px, 5vw, 72px) !important;
    margin: 0 !important;
    column-gap: 0 !important;
    row-gap: clamp(50px, 4vw, 76px) !important;
  }

  body.engineering-page .engineering-service h2,
  body.engineering-page .engineering-service:nth-child(n) h2,
  body.engineering-page .engineering-service p,
  body.engineering-page .engineering-service:nth-child(n) p {
    position: static !important;
    inset: auto !important;
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
    transform: none !important;
  }

  body.engineering-page .engineering-service h2,
  body.engineering-page .engineering-service:nth-child(n) h2 {
    align-self: start !important;
    margin: 0 !important;
    font-size: clamp(40px, 3.4vw, 58px) !important;
    line-height: 0.96 !important;
    text-align: center !important;
  }

  body.engineering-page .engineering-service p,
  body.engineering-page .engineering-service:nth-child(n) p {
    align-self: start !important;
    margin: 0 !important;
    font-size: clamp(16px, 1.3vw, 19px) !important;
    line-height: 1.27 !important;
  }
}

/* 2026-08-03 - Final desktop service-page rhythm.
   Keep a constant visual clearance below every shortcut row, restore the
   balanced three-column Assistance composition, and constrain Engineering
   copy to the same centered 1120px content grid at every desktop width. */
@media (min-width: 901px) {
  body.engineering-page .engineering-shortcuts {
    bottom: 56px !important;
  }

  html.assistance-document body.assistance-page .assistance-hero__seo {
    bottom: 56px !important;
    display: flex !important;
    height: auto !important;
    flex-direction: column !important;
  }

  html.assistance-document body.assistance-page .assistance-hero__nav {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    width: 640px !important;
    margin-top: auto !important;
    column-gap: 60px !important;
    row-gap: 0 !important;
  }

  body.engineering-page .engineering-service h2,
  body.engineering-page .engineering-service p {
    right: auto !important;
    width: calc(100% - 40px) !important;
    box-sizing: border-box !important;
    transform: none !important;
  }

  body.engineering-page .engineering-service h2 {
    max-width: 520px !important;
  }

  body.engineering-page .engineering-service p {
    max-width: 500px !important;
  }

  body.engineering-page .engineering-service:nth-child(odd) h2 {
    right: 20px !important;
    left: auto !important;
  }

  body.engineering-page .engineering-service:nth-child(odd) p {
    right: 30px !important;
    left: auto !important;
  }

  body.engineering-page .engineering-service:nth-child(even) h2 {
    right: auto !important;
    left: 20px !important;
  }

  body.engineering-page .engineering-service:nth-child(even) p {
    right: auto !important;
    left: 30px !important;
  }
}

/* 2026-08-03 - Shared desktop shortcut rhythm for internal service pages.
   A 160px visual column and a fixed gap match the six-column Integration row;
   Assistance stays compact instead of distributing three items over 960px. */
@media (min-width: 901px) {
  body.engineering-page .engineering-shortcuts {
    top: auto !important;
    right: auto !important;
    bottom: 56px !important;
    left: 50% !important;
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    width: min(960px, calc(100% - 48px)) !important;
    column-gap: 40px !important;
    row-gap: 0 !important;
    transform: translateX(-50%) !important;
  }

  body.engineering-page .engineering-shortcuts a,
  body.engineering-page .engineering-shortcuts a:nth-child(n),
  html.assistance-document body.assistance-page .assistance-service-link,
  html.assistance-document body.assistance-page .assistance-service-link:nth-child(n) {
    position: relative !important;
    inset: auto !important;
    display: grid !important;
    grid-template-rows: 104px auto !important;
    justify-items: stretch !important;
    align-items: start !important;
    width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 10px !important;
  }

  body.engineering-page .engineering-shortcuts__visual,
  html.assistance-document body.assistance-page .assistance-service-link__icon {
    display: flex !important;
    width: 100% !important;
    height: 104px !important;
    max-width: none !important;
    max-height: 104px !important;
    align-items: flex-end !important;
    justify-content: flex-start !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    padding-left: 12px !important;
  }

  body.engineering-page .engineering-shortcuts__visual img,
  html.assistance-document body.assistance-page .assistance-service-link__icon img {
    display: block !important;
    width: auto !important;
    height: 104px !important;
    max-width: 100% !important;
    max-height: 104px !important;
    margin: 0 !important;
    object-fit: contain !important;
    object-position: center bottom !important;
    transform: none;
  }

  body.engineering-page .engineering-shortcuts__label,
  html.assistance-document body.assistance-page .assistance-service-link > span:last-child {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    padding-left: 12px !important;
    text-align: left !important;
  }

  html.assistance-document body.assistance-page .assistance-hero__seo {
    bottom: 56px !important;
    display: flex !important;
    height: auto !important;
    flex-direction: column !important;
  }

  html.assistance-document body.assistance-page .assistance-hero__nav {
    position: relative !important;
    inset: auto !important;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    width: 560px !important;
    max-width: 100% !important;
    height: auto !important;
    margin: auto 0 0 !important;
    column-gap: 40px !important;
    row-gap: 0 !important;
    transform: none !important;
  }
}

/* Engineering cards use one bounded two-column grid at every desktop size.
   Card dimensions and gaps no longer depend on the viewport width. */
@media (min-width: 901px) {
  body.engineering-page .engineering-services {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    width: min(1120px, calc(100% - 48px)) !important;
    max-width: 1120px !important;
    margin: 32px auto !important;
    column-gap: 32px !important;
    row-gap: 32px !important;
  }

  body.engineering-page .engineering-service {
    position: relative !important;
    display: flex !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 520px !important;
    height: 520px !important;
    flex-direction: column !important;
    box-sizing: border-box !important;
    padding: 64px 48px 56px !important;
    margin: 0 !important;
  }

  body.engineering-page .engineering-service h2,
  body.engineering-page .engineering-service:nth-child(n) h2 {
    position: static !important;
    inset: auto !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    font-size: clamp(42px, 3.05vw, 54px) !important;
    line-height: 0.96 !important;
    text-align: center !important;
    transform: none !important;
  }

  body.engineering-page .engineering-service p,
  body.engineering-page .engineering-service:nth-child(n) p {
    position: static !important;
    inset: auto !important;
    width: 100% !important;
    max-width: none !important;
    margin: auto 0 0 !important;
    box-sizing: border-box !important;
    font-size: 18px !important;
    line-height: 1.27 !important;
    transform: none !important;
  }
}

@media (max-width: 900px) {
  body.engineering-page .engineering-hero,
  html.assistance-document body.assistance-page .assistance-hero {
    padding-bottom: 40px !important;
  }
}

@media (min-width: 1600px) {
  body.engineering-page .engineering-hero {
    --engineering-copy-left: calc(50% - 560px);
  }
}

@media (max-width: 720px) {
  body.engineering-page .engineering-pilotage {
    background:
      linear-gradient(
        180deg,
        #fff 0%,
        #fff 62%,
        rgba(255, 255, 255, 0.99) 72%,
        rgba(255, 255, 255, 0.92) 82%,
        rgba(255, 255, 255, 0.68) 90%,
        rgba(255, 255, 255, 0.28) 97%,
        rgba(255, 255, 255, 0) 100%
      ),
      url("assets/engineering/pilotage-photo.webp") center bottom / cover no-repeat,
      #fff !important;
  }
}

/* 2026-08-03 - Final client-video overrides. */
@media (min-width: 901px) {
  body.engineering-page .engineering-hero {
    --engineering-copy-left: max(7vw, calc((100% - 1440px) / 2 + 84px));
  }

  body.engineering-page .engineering-shortcuts {
    top: auto !important;
    right: auto !important;
    bottom: 56px !important;
    left: var(--engineering-copy-left) !important;
    width: min(
      960px,
      calc(100% - var(--engineering-copy-left) - var(--engineering-copy-left))
    ) !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    column-gap: 40px !important;
    row-gap: 0 !important;
    transform: none !important;
  }

  html.assistance-document body.assistance-page .assistance-hero__seo {
    bottom: 56px !important;
  }

  html.assistance-document body.assistance-page .assistance-hero__nav {
    width: 600px !important;
    max-width: 100% !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    column-gap: 40px !important;
  }

  html.assistance-document body.assistance-page .assistance-service-link,
  html.assistance-document body.assistance-page .assistance-service-link:nth-child(n) {
    justify-items: stretch !important;
  }

  html.assistance-document body.assistance-page .assistance-service-link__icon {
    justify-content: flex-start !important;
  }

  html.assistance-document body.assistance-page .assistance-service-link__icon img {
    height: 94px !important;
    max-height: 94px !important;
    margin: 0 !important;
    object-position: center bottom !important;
  }

  body.engineering-page .engineering-services {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    column-gap: 0 !important;
    row-gap: 0 !important;
  }

  body.engineering-page .engineering-service,
  body.engineering-page .engineering-service:nth-child(n) {
    position: relative !important;
    display: grid !important;
    grid-template-rows: clamp(160px, 12vw, 210px) auto !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: clamp(500px, 32vw, 610px) !important;
    height: auto !important;
    align-content: start !important;
    justify-items: center !important;
    box-sizing: border-box !important;
    padding: clamp(58px, 5vw, 78px) clamp(48px, 6vw, 92px)
      clamp(52px, 5vw, 72px) !important;
    margin: 0 !important;
    column-gap: 0 !important;
    row-gap: clamp(54px, 3.8vw, 72px) !important;
  }

  body.engineering-page .engineering-service h2,
  body.engineering-page .engineering-service:nth-child(n) h2,
  body.engineering-page .engineering-service p,
  body.engineering-page .engineering-service:nth-child(n) p {
    position: static !important;
    inset: auto !important;
    box-sizing: border-box !important;
    transform: none !important;
  }

  body.engineering-page .engineering-service h2,
  body.engineering-page .engineering-service:nth-child(n) h2 {
    align-self: start !important;
    width: min(100%, 520px) !important;
    max-width: 520px !important;
    margin: 0 !important;
    font-size: clamp(40px, 3.4vw, 58px) !important;
    line-height: 0.96 !important;
    text-align: center !important;
  }

  body.engineering-page .engineering-service p,
  body.engineering-page .engineering-service:nth-child(n) p {
    align-self: start !important;
    width: min(100%, 500px) !important;
    max-width: 500px !important;
    margin: 0 !important;
    font-size: clamp(16px, 1.3vw, 19px) !important;
    line-height: 1.27 !important;
  }
}

@media (min-width: 1600px) {
  body.engineering-page .engineering-hero {
    --engineering-copy-left: calc(50% - 560px);
  }
}

@media (max-width: 720px) {
  body.engineering-page .engineering-pilotage {
    background:
      linear-gradient(
        180deg,
        #fff 0%,
        #fff 48%,
        rgba(255, 255, 255, 0.995) 57%,
        rgba(255, 255, 255, 0.97) 66%,
        rgba(255, 255, 255, 0.88) 75%,
        rgba(255, 255, 255, 0.68) 84%,
        rgba(255, 255, 255, 0.42) 91%,
        rgba(255, 255, 255, 0.16) 97%,
        rgba(255, 255, 255, 0) 100%
      ),
      url("assets/engineering/pilotage-photo.webp") center bottom / cover no-repeat,
      #fff !important;
  }
}

@media (max-width: 900px) {
  body.engineering-page .contact-cta,
  html.assistance-document body.assistance-page .contact-cta {
    min-height: 470px !important;
    background-image: var(--cta-image) !important;
    background-size: cover !important;
    background-position: 72% top !important;
    background-repeat: no-repeat !important;
  }

  body.engineering-page .contact-cta__inner,
  html.assistance-document body.assistance-page .contact-cta__inner {
    min-height: 470px !important;
    padding-top: 72px !important;
    align-items: flex-start !important;
  }
}

/* Smartphone-only final corrections. These declarations deliberately follow
   every historical 720/900px rule; tablet and desktop remain unchanged. */
@media (max-width: 620px) {
  body.wms-site.engineering-page .contact-cta,
  html.assistance-document body.wms-site.assistance-page .contact-cta {
    background-position: 68% top !important;
  }

  /* Exactly one vertical fade: no lateral or radial overlay can create a
     white patch in the lower-right corner. */
  html.assistance-document body.assistance-page
    .assistance-visual-section--support {
    background:
      linear-gradient(
        180deg,
        #ededed 0%,
        #ededed 48%,
        rgba(237, 237, 237, 0.98) 55%,
        rgba(237, 237, 237, 0.84) 63%,
        rgba(237, 237, 237, 0.56) 71%,
        rgba(237, 237, 237, 0.24) 79%,
        rgba(237, 237, 237, 0) 87%
      ),
      url("assets/assistance-support-hypercare-final.png") left calc(100% + 1px) / auto 80%
        no-repeat,
      #ededed !important;
  }
}