/* Home hero slide copy stays synchronized with the active background image. */
body[data-page="home"] .hero-copy-stage {
  position: relative;
  display: grid;
  width: min(760px, 100%);
}

/* The storytelling reveal system must not override the slideshow's active state. */
body[data-page="home"].storytelling-ready .hero-slide.story-image-reveal {
  opacity: 0;
  clip-path: none;
  transform: scale(1.015);
  transition:
    opacity 1400ms var(--ease-premium),
    transform 1800ms var(--ease-premium),
    filter 1800ms var(--ease-premium);
}

body[data-page="home"].storytelling-ready .hero-slide.story-image-reveal.is-active {
  opacity: 1;
  transform: scale(1);
}

body[data-page="home"] .hero-copy-stage .hero-content {
  grid-area: 1 / 1;
  width: 100%;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translate3d(0, calc(var(--hero-copy-y, 0px) + 18px), 0);
  transition:
    opacity 560ms ease,
    transform 760ms cubic-bezier(0.22, 1, 0.36, 1),
    visibility 0s linear 760ms;
}

body[data-page="home"] .hero-copy-stage .hero-content.is-active {
  opacity: var(--hero-content-opacity, 1);
  visibility: visible;
  pointer-events: auto;
  transform: translate3d(0, var(--hero-copy-y, 0px), 0);
  transition-delay: 90ms, 90ms, 0s;
}

body[data-page="home"] .hero-slider-dots {
  grid-area: 1 / 1;
  align-self: end;
  justify-self: start;
  z-index: 3;
  margin: 0 0 clamp(52px, 6vw, 78px) var(--home-hero-copy-offset, clamp(11px, 1.1vw, 15px));
}

body[data-page="home"] .hero-slide-controls,
body[data-page="home"] .hero-slide-button,
body[data-page="home"] .hero-slider-dots,
body[data-page="home"] .hero-slider-dots button {
  pointer-events: auto;
}

body[data-page="home"] .hero-slide-controls {
  z-index: 8;
}

@media (max-width: 760px) {
  body[data-page="home"] .hero-slider-dots {
    margin-left: 11px;
  }
}

@media (prefers-reduced-motion: reduce) {
  body[data-page="home"] .hero-copy-stage .hero-content {
    transform: none;
    transition: none;
  }
}

/* Each reference uses its own natural aspect ratio. Artwork and live type
   share the same fitted canvas, so neither is stretched or cropped on desktop. */
#home-hero.hero-reference {
  /* Start beneath the header's bottom border, without an exposed white seam. */
  --hero-header-space: calc(var(--arotec-utility-height, 30.6px) + var(--arotec-main-height, 80px));
  --hero-stage-height: calc(100svh - var(--hero-header-space) - 46px);
  height: 100svh;
  min-height: 0;
  max-height: none;
  padding: 0;
  display: block;
  background: #fff;
  color: #05183e;
  isolation: isolate;
}
#home-hero::before,
#home-hero::after { display: none; }
#home-hero .hero-slides,
#home-hero .hero-copy-stage {
  position: absolute;
  inset: var(--hero-header-space) 0 auto;
  width: 100%;
  height: var(--hero-stage-height);
  min-height: 0;
  max-width: none;
  margin: 0;
  padding: 0;
  display: block;
  overflow: hidden;
  transform: translateY(calc(var(--hero-bg-y, 0px) * -0.08));
}
#home-hero .hero-slides { z-index: 0; }
#home-hero .hero-copy-stage { z-index: 2; }
#home-hero .hero-slide,
#home-hero .hero-content {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  min-height: 0;
  max-width: none;
  margin: 0;
  padding: 0 !important;
  background: transparent;
}
#home-hero .hero-slide {
  opacity: 0;
  transform: scale(1.012);
  clip-path: none;
  transition: opacity 1400ms ease, transform 1800ms cubic-bezier(.22,1,.36,1);
}
#home-hero .hero-slide.is-active { opacity: 1; transform: scale(1); }
#home-hero .hero-content {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(14px);
}
#home-hero .hero-content.is-active {
  opacity: var(--hero-content-opacity, 1);
  visibility: visible;
  transform: translateY(0);
}
#home-hero .hero-reference-frame {
  position: absolute;
  top: 50%;
  left: 50%;
  width: min(100%, calc(var(--hero-stage-height) * (var(--hero-aspect))));
  aspect-ratio: var(--hero-aspect);
  transform: translate(-50%, -50%);
  container-type: inline-size;
}
#home-hero .hero-reference-art { display: block; width: 100%; height: auto; }
#home-hero .hero-reference-copy {
  position: absolute;
  text-align: left;
  font-family: var(--site-font, "DM Sans", sans-serif);
}
#home-hero .hero-content--why .hero-reference-copy { left: 4.65%; top: 22%; width: 34.5%; }
#home-hero .hero-content--impact .hero-reference-copy { left: 57%; top: 16.8%; width: 41%; }
#home-hero .hero-content--experience .hero-reference-copy { left: 19.65%; top: 5.9%; width: 61%; }
#home-hero .hero-title {
  --arotec-display-size: 3.27cqw;
  --arotec-display-weight: 800;
  --arotec-display-line-height: 1.08;
  --arotec-display-letter-spacing: -0.045em;
  max-width: none;
  width: 100%;
  margin: 0;
  color: #05183e !important;
  text-wrap: initial;
  white-space: normal;
  text-shadow: none;
  font-stretch: normal;
}
#home-hero .hero-content--impact .hero-title { --arotec-display-size: 3.8cqw; }
#home-hero .hero-content--experience .hero-title { --arotec-display-size: 3.7cqw; }
#home-hero :is(.hero-reference-eyebrow, .hero-reference-support, .hero-reference-body) {
  font-family: var(--site-font, "DM Sans", sans-serif) !important;
  color: #05183e !important;
  padding: 0;
  max-width: none;
  text-shadow: none;
  text-wrap: initial;
}
#home-hero .hero-reference-eyebrow {
  font-size: 1.35cqw !important;
  line-height: 1.3 !important;
  font-weight: 700 !important;
  letter-spacing: .025em !important;
  margin: 0 0 1cqw;
}
#home-hero .hero-reference-support {
  font-size: 2.03cqw !important;
  font-weight: 800 !important;
  line-height: 1.18 !important;
  letter-spacing: -.03em !important;
  margin: .9cqw 0 0;
}
#home-hero .hero-reference-body {
  font-size: 1.4cqw !important;
  line-height: 1.42 !important;
  letter-spacing: -.025em !important;
  font-weight: 400 !important;
  margin: 1.2cqw 0 0;
}
#home-hero .hero-content--impact .hero-reference-body { font-size: 1.55cqw !important; margin-top: 1.9cqw; }
#home-hero .hero-content--experience .hero-reference-eyebrow { font-size: 1.05cqw !important; letter-spacing: .24em !important; margin-bottom: .7cqw; }
#home-hero .hero-content--experience .hero-reference-support { font-size: 1.6cqw !important; margin-top: .55cqw; }
#home-hero .hero-content--experience .hero-reference-body { font-size: 1.35cqw !important; line-height: 1.32 !important; margin-top: .4cqw; max-width: 47cqw; }
#home-hero .hero-reference-cta {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.4cqw;
  min-height: 3.7cqw;
  padding: .7cqw 1.55cqw;
  margin-top: 1.6cqw;
  border: 1.5px solid #11264a;
  border-radius: 3px;
  background: rgb(255 255 255 / 35%);
  color: #05183e;
  font-family: var(--site-font, "DM Sans", sans-serif);
  font-size: 1.15cqw !important;
  line-height: 1.25 !important;
  font-weight: 800;
  letter-spacing: .01em;
  text-decoration: none;
  white-space: nowrap;
  pointer-events: auto;
  transition: background .2s ease, box-shadow .2s ease;
}
#home-hero .hero-reference-cta .ph { font-size: 1.65cqw; }
#home-hero .hero-reference-cta:hover { background: #fff; box-shadow: 0 4px 18px #08204020; }
#home-hero :is(a, button):focus-visible { outline: 3px solid #1e84c7; outline-offset: 4px; }
#home-hero .hero-content--impact .hero-reference-cta { min-height: 4.4cqw; font-size: 1.35cqw !important; margin-top: 2.1cqw; padding-inline: 2.2cqw; }
#home-hero .hero-content--experience .hero-reference-cta { min-height: 2.7cqw; padding: .45cqw 1.3cqw; margin-top: 1.1cqw; }
#home-hero :is(.hero-art-labels, .hero-reference-process, .hero-reference-topics) { list-style: none; padding: 0; margin: 0; }
#home-hero .hero-art-labels li {
  position: absolute;
  left: var(--label-x);
  top: var(--label-y);
  transform: translateY(-50%);
  color: #fff;
  font-family: var(--site-font, "DM Sans", sans-serif);
  font-size: .78cqw !important;
  line-height: 1.2 !important;
  font-weight: 600 !important;
  letter-spacing: .06em !important;
  white-space: nowrap;
  text-shadow: 0 1px 5px #0005;
}
#home-hero .hero-content--impact .hero-art-labels li { transform: translate(-50%, -50%); font-size: 2.5cqw !important; font-weight: 700 !important; letter-spacing: -.02em !important; }
#home-hero .hero-reference-process { display: flex; justify-content: space-between; align-items: center; gap: .7cqw; margin-top: 2.6cqw; }
#home-hero .hero-reference-process li { display: flex; align-items: center; gap: .7cqw; font-size: 1.12cqw !important; line-height: 1.3 !important; font-weight: 800 !important; white-space: nowrap; }
#home-hero .hero-reference-process li:not(:last-child)::after { content: "→"; font-size: 1.5cqw; font-weight: 400; }
/* Keep topics in the same flow as the CTA: wrapping copy cannot overlap them. */
#home-hero .hero-reference-topics {
  position: static;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  width: fit-content;
  max-width: 100%;
  margin: clamp(24px, 2.5svh, 30px) 0 0;
  gap: 12px clamp(12px, 1.5cqw, 24px);
}
#home-hero .hero-reference-topics li { font-family: var(--site-font, "DM Sans", sans-serif); font-size: clamp(12px, 1.1cqw, 20px) !important; line-height: 1.3 !important; font-weight: 700 !important; white-space: nowrap; text-shadow: 0 1px 3px rgb(255 255 255 / .85); }
#home-hero .hero-reference-topics li + li { padding-left: clamp(12px, 1.5cqw, 24px); border-left: 1px solid rgb(37 65 94 / .5); }
#home-hero .hero-slide-controls {
  position: absolute;
  inset: auto auto 5px 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  gap: 14px;
  width: auto;
  padding: 0;
  margin: 0;
}
#home-hero .hero-slide-button { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; min-width: 34px; padding: 7px; border: 1px solid #10274733; border-radius: 50%; background: #fff; color: #102747; box-shadow: none; }
#home-hero .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
#home-hero .hero-slide-button svg { width: 18px; height: 18px; }
#home-hero .hero-slide-button .ph { font-size: 18px; }
#home-hero .hero-slide-button:hover { background: #eaf4fa; transform: none; }
#home-hero .hero-slider-dots { position: static; display: flex; gap: 10px; padding: 0; margin: 0; transform: none; }
#home-hero .hero-slider-dots button { width: 9px; height: 9px; min-width: 9px; padding: 0; border: 0; background: #b8c6d4; box-shadow: none; }
#home-hero .hero-slider-dots button.is-active { width: 25px; border-radius: 8px; background: #102747; }
#home-hero .hero-scroll-progress { height: 2px; background: transparent; }
@media (max-width: 1060px) {
  #home-hero.hero-reference { --hero-header-space: var(--arotec-main-height, 94px); }
}
/* Desktop fills the viewport below the header. Keep the artwork proportional
   while fitting the live copy independently to the visible area. */
@media (min-width: 761px) {
  #home-hero.hero-reference {
    --hero-stage-height: calc(100svh - var(--hero-header-space));
  }
  #home-hero :is(.hero-slides, .hero-copy-stage) { transform: none; }
  #home-hero .hero-reference-frame {
    inset: 0;
    width: 100%;
    height: 100%;
    aspect-ratio: auto;
    transform: none;
  }
  #home-hero .hero-reference-art { width: 100%; height: 100%; object-fit: cover; }
  #home-hero .hero-slide--experience .hero-reference-art { object-position: center top; }
  #home-hero .hero-title { margin: 0 !important; }
  #home-hero .hero-slide--why::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgb(255 255 255 / .45), rgb(255 255 255 / .2) 32%, transparent 52%);
    pointer-events: none;
  }
  #home-hero .hero-content--why .hero-reference-copy {
    left: 5%;
    top: 48%;
    width: 36%;
    transform: translateY(-50%);
  }
  #home-hero .hero-content--why .hero-title { --arotec-display-size: clamp(36px, min(3.6cqw, 7svh), 76px); }
  #home-hero .hero-content--why .hero-reference-body { font-size: clamp(17px, min(1.45cqw, 2.7svh), 28px) !important; }
  #home-hero .hero-content--impact .hero-reference-copy {
    left: 57%;
    top: 48%;
    width: 39%;
    transform: translateY(-50%);
  }
  #home-hero .hero-content--impact .hero-title { --arotec-display-size: clamp(36px, min(3.65cqw, 7svh), 76px); }
  #home-hero .hero-content--impact .hero-reference-support { font-size: clamp(19px, min(1.95cqw, 3.5svh), 38px) !important; }
  #home-hero .hero-content--impact .hero-reference-body { font-size: clamp(17px, min(1.45cqw, 2.7svh), 28px) !important; margin-top: 1.4cqw; }
  #home-hero .hero-content--impact .hero-reference-process { margin-top: 1.7cqw; }
  #home-hero .hero-content--impact .hero-reference-cta { margin-top: 1.6cqw; }
  #home-hero .hero-content--experience .hero-reference-copy {
    left: 28%;
    top: clamp(32px, 5svh, 64px);
    width: 65%;
  }
  #home-hero .hero-content--experience .hero-title { --arotec-display-size: clamp(34px, min(3.4cqw, 6.2svh), 70px); }
  #home-hero .hero-content--experience .hero-reference-eyebrow { font-size: clamp(12px, 1cqw, 18px) !important; margin-bottom: .5cqw; }
  #home-hero .hero-content--experience .hero-reference-support { font-size: clamp(17px, min(1.45cqw, 2.7svh), 28px) !important; }
  #home-hero .hero-content--experience .hero-reference-body { font-size: clamp(16px, min(1.3cqw, 2.4svh), 25px) !important; max-width: 49cqw; }
  #home-hero .hero-content--experience .hero-reference-cta { margin-top: .9cqw; }
  #home-hero .hero-art-labels {
    position: absolute;
    top: 50%;
    left: 50%;
    width: max(100%, calc(var(--hero-stage-height) * (var(--hero-aspect))));
    aspect-ratio: var(--hero-aspect);
    transform: translate(-50%, -50%);
    container-type: inline-size;
    pointer-events: none;
  }
  #home-hero .hero-content--why .hero-art-labels li:is(:nth-child(2), :nth-child(5)) {
    transform: translate(-100%, -50%);
    margin-left: -2.8cqw;
  }
  #home-hero .hero-slide-controls {
    bottom: 14px;
    gap: 8px;
    padding: 4px 8px;
    border: 1px solid rgb(255 255 255 / .2);
    border-radius: 30px;
    background: rgb(255 255 255 / .3);
    backdrop-filter: blur(6px);
    box-shadow: none;
    transition: background-color 180ms ease;
  }
  #home-hero .hero-slide-controls:is(:hover, :focus-within) { background: rgb(255 255 255 / .75); }
  #home-hero .hero-slide-button { width: 32px; height: 32px; min-width: 32px; border-color: transparent; background: transparent; color: #40566e; backdrop-filter: none; }
  #home-hero .hero-slide-button svg { width: 16px; height: 16px; }
  #home-hero .hero-slide-button .ph { font-size: 16px; }
  #home-hero .hero-slide-button:is(:hover, :focus-visible) { background: rgb(255 255 255 / .6); }
  #home-hero .hero-slide-controls button:focus-visible { outline: 2px solid #40566e; outline-offset: 3px; }
  #home-hero .hero-slider-dots { gap: 2px; }
  #home-hero .hero-slider-dots button { display: grid; place-items: center; width: 24px; height: 24px; min-width: 24px; background: transparent; }
  #home-hero .hero-slider-dots button::before { content: ""; width: 6px; height: 6px; border-radius: 8px; background: rgb(64 86 110 / .35); transition: width 180ms ease, background-color 180ms ease; }
  #home-hero .hero-slider-dots button.is-active { width: 24px; background: transparent; }
  #home-hero .hero-slider-dots button.is-active::before { width: 18px; background: #40566e; }
}
/* Match the site's desktop gutters on narrative text only. Keep each column's
   image-facing edge and all artwork/callout coordinates in place. */
@media (min-width: 1200px) {
  #home-hero .hero-content--why .hero-reference-copy {
    left: var(--arotec-content-left);
    top: 40%;
    width: calc(41% - var(--arotec-content-left));
  }
  #home-hero .hero-content--why .hero-title { --arotec-display-size: clamp(36px, min(3.35cqw, 7svh), 76px); }
  #home-hero .hero-content--impact .hero-reference-copy {
    right: var(--arotec-content-right);
    width: auto;
  }
  #home-hero .hero-content--impact :is(.hero-reference-process, .hero-reference-process li) { gap: .45cqw; }
  #home-hero .hero-content--experience .hero-reference-copy {
    left: max(28%, var(--arotec-content-left));
    width: min(65%, calc(72% - var(--arotec-content-right)));
  }
}
@media (max-width: 760px) {
  #home-hero.hero-reference { --hero-stage-height: max(700px, calc(100svh - var(--hero-header-space) - 48px)); height: calc(var(--hero-stage-height) + var(--hero-header-space) + 48px); min-height: 0; }
  #home-hero .hero-reference-frame { width: 100%; aspect-ratio: auto; height: 100%; top: 0; left: 0; transform: none; }
  #home-hero .hero-reference-art { position: absolute; bottom: 0; height: 45%; object-fit: cover; object-position: center; }
  #home-hero .hero-slide--experience .hero-reference-art { height: 41%; }
  #home-hero .hero-slide--impact .hero-reference-art { height: 47%; object-fit: cover; object-position: left; left: -34.5%; width: 250%; max-width: none; }
  #home-hero .hero-reference-copy { left: 6% !important; top: 4% !important; width: 88% !important; }
  #home-hero .hero-title { --arotec-display-size: clamp(26px, 7.2cqw, 48px) !important; --arotec-display-line-height: 1.08; }
  #home-hero .hero-content .hero-reference-eyebrow { font-size: 12px !important; margin-bottom: 12px !important; }
  #home-hero .hero-content .hero-reference-support { font-size: 17px !important; margin-top: 12px !important; }
  #home-hero .hero-content .hero-reference-body { font-size: 15px !important; line-height: 1.45 !important; margin-top: 12px !important; max-width: none !important; }
  #home-hero .hero-content .hero-reference-cta { font-size: 12px !important; min-height: 42px !important; padding: 9px 15px !important; margin-top: 18px !important; gap: 18px; }
  #home-hero .hero-content .hero-reference-cta .ph { font-size: 19px; }
  #home-hero .hero-reference-process { margin-top: 18px; gap: 5px; }
  #home-hero .hero-reference-process li { font-size: 9px !important; gap: 4px; }
  #home-hero .hero-reference-process li::after { font-size: 14px !important; }
  #home-hero .hero-art-labels { display: none; }
  #home-hero .hero-reference-topics { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); width: 100%; margin-top: 24px; gap: 12px 16px; }
  #home-hero .hero-reference-topics li { font-size: 11px !important; }
  #home-hero .hero-reference-topics li + li { padding-left: 0; border-left: 0; }
  #home-hero .hero-reference-topics li:nth-child(even) { padding-left: 16px; border-left: 1px solid rgb(37 65 94 / .5); }
}
@media (prefers-reduced-motion: reduce) {
  #home-hero :is(.hero-slide, .hero-content, .hero-slides, .hero-copy-stage) { transform: none; transition: none; }
}

/* Reserve enough width for the original 36px tablet heading's complete words.
   The unchanged font now uses fewer lines, lifting the action clear of the
   original background annotation instead of covering it. */
@media (min-width: 761px) and (max-width: 1199px) {
  #home-hero .hero-content--why .hero-reference-copy { width: 42%; }
}

/* Lift tablet narrative glyphs clear of the unchanged runner photograph. */
@media (min-width: 761px) and (max-width: 1199px) {
  #home-hero .hero-content--why .hero-reference-copy { top: 44%; }
}

/* Human Experience: align the live translated copy to the supplied collage.
   Both layers share one proportional canvas, keeping type clear of the photos. */
@media (min-width: 761px) {
  #home-hero :is(.hero-slide--experience, .hero-content--experience) .hero-reference-frame {
    inset: 0 auto auto 50%;
    width: max(100%, calc(var(--hero-stage-height) * 32 / 15));
    height: auto;
    aspect-ratio: 32 / 15;
    transform: translateX(-50%);
  }
  #home-hero .hero-slide--experience .hero-reference-art { height: auto; }
  #home-hero .hero-content--experience .hero-reference-copy {
    left: 27.35%;
    top: 10.8%;
    width: 43%;
    transform: none;
  }
  #home-hero .hero-content--experience .hero-title {
    --arotec-display-size: 3.25cqw;
    --arotec-display-weight: 800;
  }
  #home-hero .hero-content--experience .hero-reference-eyebrow {
    font-size: .85cqw !important;
    letter-spacing: .25em !important;
    margin: 0 0 .55cqw !important;
  }
  #home-hero .hero-content--experience .hero-reference-support {
    font-size: 1.45cqw !important;
    line-height: 1.15 !important;
    margin-top: .35cqw !important;
  }
  #home-hero .hero-content--experience .hero-reference-body {
    font-size: 1.13cqw !important;
    line-height: 1.28 !important;
    margin-top: .28cqw !important;
    max-width: 36cqw;
  }
  #home-hero .hero-content--experience .hero-reference-cta {
    font-size: 1.05cqw !important;
    min-height: 2cqw;
    padding: .35cqw 1cqw;
    margin-top: 1.05cqw;
    gap: .9cqw;
    border-radius: 2px;
  }
  #home-hero .hero-content--experience .hero-reference-cta .ph { font-size: 1.2cqw; }
  #home-hero .hero-content--experience .hero-reference-topics {
    width: 41cqw;
    margin: 1.05cqw 0 0;
    justify-content: space-around;
    flex-wrap: nowrap;
    gap: 0;
  }
  #home-hero .hero-content--experience .hero-reference-topics li {
    font-size: .98cqw !important;
    line-height: 1.25 !important;
    text-shadow: none;
    text-align: center;
    flex: 1 1 auto;
  }
  #home-hero .hero-content--experience .hero-reference-topics li + li { padding-left: 1.2cqw; }
  /* Translations keep their native typefaces and a clear band above the art. */
  html:not(:lang(en)) #home-hero .hero-content--experience .hero-reference-copy { top: 8%; }
  html:not(:lang(en)) #home-hero .hero-content--experience .hero-title { --arotec-display-size: 2.9cqw; --arotec-display-line-height: 1.08; }
  html:not(:lang(en)) #home-hero .hero-content--experience .hero-reference-support { font-size: 1.22cqw !important; }
  html:not(:lang(en)) #home-hero .hero-content--experience .hero-reference-body { font-size: 1.05cqw !important; max-width: 40cqw; }
}
/* Keep the collage and translated copy inside tall tablet viewports. */
@media (min-width: 761px) and (max-aspect-ratio: 4 / 3) {
  #home-hero :is(.hero-slide--experience, .hero-content--experience) .hero-reference-frame {
    inset: 0;
    width: 100%;
    height: 100%;
    aspect-ratio: auto;
    transform: none;
  }
  #home-hero .hero-slide--experience { background: #edf6ff; }
  #home-hero .hero-slide--experience .hero-reference-art {
    position: absolute;
    inset: auto 0 0;
    width: 100%;
    height: 45%;
    object-fit: contain;
    object-position: center bottom;
  }
  #home-hero .hero-content--experience .hero-reference-copy,
  html:not(:lang(en)) #home-hero .hero-content--experience .hero-reference-copy {
    left: 12%;
    top: 8%;
    width: 76%;
  }
  #home-hero .hero-content--experience .hero-title,
  html:not(:lang(en)) #home-hero .hero-content--experience .hero-title {
    --arotec-display-size: clamp(32px, 4.8cqw, 50px);
    --arotec-display-line-height: 1.08;
  }
  #home-hero .hero-content--experience .hero-reference-eyebrow {
    font-size: clamp(12px, 1.5cqw, 16px) !important;
    margin-bottom: 10px !important;
  }
  #home-hero .hero-content--experience .hero-reference-support,
  html:not(:lang(en)) #home-hero .hero-content--experience .hero-reference-support {
    font-size: clamp(17px, 2.15cqw, 22px) !important;
    line-height: 1.3 !important;
    margin-top: 12px !important;
  }
  #home-hero .hero-content--experience .hero-reference-body,
  html:not(:lang(en)) #home-hero .hero-content--experience .hero-reference-body {
    font-size: clamp(16px, 2cqw, 20px) !important;
    line-height: 1.4 !important;
    max-width: 100%;
    margin-top: 10px !important;
  }
  #home-hero .hero-content--experience .hero-reference-cta {
    font-size: 15px !important;
    min-height: 42px;
    padding: 9px 15px;
    margin-top: 18px;
    gap: 18px;
  }
  #home-hero .hero-content--experience .hero-reference-cta .ph { font-size: 19px; }
  #home-hero .hero-content--experience .hero-reference-topics {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr);
    width: 100%;
    margin-top: 22px;
    gap: 12px 16px;
  }
  #home-hero .hero-content--experience .hero-reference-topics li {
    font-size: clamp(12px, 1.55cqw, 16px) !important;
    text-align: left;
    white-space: normal;
  }
  #home-hero .hero-content--experience .hero-reference-topics li + li { padding-left: 0; border-left: 0; }
  #home-hero .hero-content--experience .hero-reference-topics li:nth-child(even) { padding-left: 16px; border-left: 1px solid rgb(37 65 94 / .5); }
}
@media (max-width: 760px) {
  #home-hero .hero-slide--experience .hero-reference-art { height: 41%; object-fit: contain; object-position: center bottom; }
}