.eu-hero-art,
.eml-hero-art,
.edomain-visual,
.esr-visual,
.ec-contact-console,
.ereceive-hero-visual,
.ereceive-reassurance,
.exs-hero-media,
.eh-hero-visual,
.eaudit-hero aside,
.espeed-hero aside {
  position: relative;
  cursor: pointer;
  scroll-margin-top: 120px;
  transition: transform .24s ease, box-shadow .24s ease, filter .24s ease;
}

.eit-hero-scroll-label,
.ei-hero-scroll-trigger span,
.ep-hero-scroll-trigger span,
.es-hero-scroll-trigger span {
  position: absolute;
  z-index: 8;
  right: 16px;
  bottom: 16px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 9px 11px;
  border: 0;
  border-radius: 9px;
  background: rgba(16,16,18,.82);
  box-shadow: none;
  color: #fff;
  font: 700 9px "DM Sans",sans-serif;
  letter-spacing: .08em;
  line-height: 1.2;
  white-space: nowrap;
  opacity: 1;
  transform: none;
  pointer-events: none;
  transition: background .2s ease, transform .2s ease;
}
.eit-hero-scroll-label b,
.ei-hero-scroll-trigger b,
.ep-hero-scroll-trigger b { color: #ff5c20; }

.eu-hero-art:hover,
.eml-hero-art:hover,
.edomain-visual:hover,
.esr-visual:hover,
.ec-contact-console:hover,
.ereceive-hero-visual:hover,
.ereceive-reassurance:hover,
.exs-hero-media:hover,
.eh-hero-visual:hover,
.eaudit-hero aside:hover,
.espeed-hero aside:hover {
  transform: translateY(-4px);
  filter: brightness(1.035);
}

.eu-hero-art:hover .eit-hero-scroll-label,
.eml-hero-art:hover .eit-hero-scroll-label,
.edomain-visual:hover .eit-hero-scroll-label,
.esr-visual:hover .eit-hero-scroll-label,
.ec-contact-console:hover .eit-hero-scroll-label,
.ereceive-hero-visual:hover .eit-hero-scroll-label,
.ereceive-reassurance:hover .eit-hero-scroll-label,
.exs-hero-media:hover .eit-hero-scroll-label,
.eh-hero-visual:hover .eit-hero-scroll-label,
.eaudit-hero aside:hover .eit-hero-scroll-label,
.espeed-hero aside:hover .eit-hero-scroll-label,
.ei-hero-scroll-trigger:hover span,
.ei-hero-scroll-trigger:focus-visible span,
.ep-hero-scroll-trigger:hover span,
.ep-hero-scroll-trigger:focus-visible span,
.es-hero-scroll-trigger:hover span,
.es-hero-scroll-trigger:focus-visible span {
  background: rgba(16,16,18,.96);
  transform: translateY(-2px);
}

.eu-hero-art:focus-visible,
.eml-hero-art:focus-visible,
.edomain-visual:focus-visible,
.esr-visual:focus-visible,
.ec-contact-console:focus-visible,
.ereceive-hero-visual:focus-visible,
.ereceive-reassurance:focus-visible,
.exs-hero-media:focus-visible,
.eh-hero-visual:focus-visible,
.eaudit-hero aside:focus-visible,
.espeed-hero aside:focus-visible {
  outline: 3px solid #ff5c20;
  outline-offset: 5px;
}

.eu-hero-art { aspect-ratio: 1180/733; }
.eu-hero-art img {
  position: static !important;
  display: block;
  width: 100% !important;
  max-width: 100% !important;
  height: 100% !important;
  aspect-ratio: 1180/733 !important;
  object-fit: cover !important;
  transform: none;
  transition: filter .25s ease;
}
.eu-hero-art:hover img,
.eml-hero-art:hover img { transform:none; filter:brightness(1.035) contrast(1.015); }
.eml-hero-art img { transform:none; transition:filter .25s ease; }

.ei-hero-scroll-trigger,
.ei-hero-scroll-trigger:hover,
.ei-hero-scroll-trigger:focus,
.ei-hero-scroll-trigger:active {
  position: absolute;
  z-index: 3;
  right: 0;
  top: 0;
  width: 44%;
  height: 390px;
  padding: 0;
  border: 0;
  border-radius: 7px 7px 58px 7px;
  background: transparent !important;
  color: inherit;
  text-decoration: none;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
}
.ei-hero + section { scroll-margin-top: 92px; }
.ei-hero-scroll-trigger:hover { box-shadow:0 32px 75px rgba(23,23,25,.16); transform:translateY(-4px); }
.ei-hero-scroll-trigger:focus-visible { outline:3px solid #ff5c20; outline-offset:5px; }

.ep-hero-scroll-trigger,
.ep-hero-scroll-trigger:hover,
.ep-hero-scroll-trigger:focus,
.ep-hero-scroll-trigger:active {
  position: relative;
  z-index: 4;
  grid-area: visual;
  align-self: stretch;
  width: 100%;
  min-height: 360px;
  padding: 0;
  border: 0;
  border-radius: 7px 7px 64px 7px;
  background: transparent !important;
  color: inherit;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
}
.ep-hero-scroll-trigger:focus-visible { outline:3px solid #ff5c20; outline-offset:5px; }

.es-hero-scroll-trigger,
.es-hero-scroll-trigger:hover,
.es-hero-scroll-trigger:focus,
.es-hero-scroll-trigger:active {
  position:absolute;
  z-index:3;
  inset:0 0 auto;
  width:100%;
  height:min(23vw,305px);
  padding:0;
  border:0;
  border-radius:7px 7px 54px 7px;
  background:transparent!important;
  cursor:pointer;
  appearance:none;
}
.es-hero-scroll-trigger:hover{box-shadow:0 28px 65px rgba(23,23,25,.18);transform:translateY(-3px)}
.es-hero-scroll-trigger:focus-visible{outline:3px solid #ff5c20;outline-offset:5px}

@media(max-width:950px) {
  .ei-hero-scroll-trigger { top:auto; right:auto; left:0; bottom:0; width:min(100%,700px); height:min(55vw,390px); }
}
@media(max-width:900px) {
  .ep-hero-scroll-trigger,
  .ep-hero-scroll-trigger:hover,
  .ep-hero-scroll-trigger:focus,
  .ep-hero-scroll-trigger:active { min-height:260px; margin-top:45px; }
  .es-hero-scroll-trigger,.es-hero-scroll-trigger:hover,.es-hero-scroll-trigger:focus,.es-hero-scroll-trigger:active{height:min(50vw,330px)}
}
@media(max-width:600px) {
  .eit-hero-scroll-label,
  .ei-hero-scroll-trigger span,
  .ep-hero-scroll-trigger span,
  .es-hero-scroll-trigger span { right:10px; bottom:10px; padding:8px 10px; font-size:9px; }
  .ei-hero-scroll-trigger { height:54vw; border-radius:6px 6px 42px 6px; }
  .ep-hero-scroll-trigger,
  .ep-hero-scroll-trigger:hover,
  .ep-hero-scroll-trigger:focus,
  .ep-hero-scroll-trigger:active { min-height:210px; margin-top:34px; border-radius:6px 6px 42px 6px; }
  .es-hero-scroll-trigger,.es-hero-scroll-trigger:hover,.es-hero-scroll-trigger:focus,.es-hero-scroll-trigger:active{height:52vw;border-radius:6px 6px 42px 6px}
}

/* Sur écran tactile, l'état :hover peut rester actif après le toucher : la
 * pastille reste immobile et seul le défilement est déclenché. */
@media (hover: none) {
  .ei-hero-scroll-trigger:hover,
  .ep-hero-scroll-trigger:hover,
  .es-hero-scroll-trigger:hover,
  .eu-hero-art:hover,
  .eml-hero-art:hover,
  .edomain-visual:hover,
  .esr-visual:hover,
  .ec-contact-console:hover,
  .ereceive-hero-visual:hover,
  .ereceive-reassurance:hover,
  .exs-hero-media:hover,
  .eh-hero-visual:hover,
  .eaudit-hero aside:hover,
  .espeed-hero aside:hover {
    transform: none;
    box-shadow: none;
  }
}

/* Keep the call-to-scroll pill identical even when a page has broad rules for spans. */
.eit-hero-scroll-label {
  position: absolute !important;
  inset: auto 16px 16px auto !important;
  display: flex !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: calc(100% - 32px) !important;
  height: auto !important;
  margin: 0 !important;
  padding: 9px 11px !important;
  border: 0 !important;
  border-radius: 9px !important;
  background: rgba(16,16,18,.82) !important;
  color: #fff !important;
  font: 700 9px/1.2 "DM Sans",sans-serif !important;
  text-transform: none !important;
  letter-spacing: .08em !important;
  opacity: 1 !important;
}
@media(max-width:600px) {
  .eit-hero-scroll-label { inset:auto 10px 10px auto !important; padding:8px 10px !important; font-size:9px !important; }
}