
.cu24 {
  --cu24-unit: 2.66667vw;
  background: #fff;
  color: #000;
  font: 400 calc(var(--cu24-unit) * 1.4)/1.15 "Atlas Cuberto Suisse", sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.cu24 .cu24-container {
  margin-inline: auto;
  padding-inline: calc(var(--cu24-unit) * 1.5);
}
.cu24 .cu24-intro { position: relative; }
.cu24 .cu24-caption {
  margin: 0 0 calc(var(--cu24-unit) * 2.4);
  font: inherit;
  font-size: calc(var(--cu24-unit) * 1.4);
  line-height: 110%;
  letter-spacing: normal;
  text-transform: uppercase;
}
.cu24 .cu24-lede {
  max-width: 94%;
  color: inherit;
  font-size: calc(var(--cu24-unit) * 2);
  line-height: 130%;
  letter-spacing: .01em;
}
.cu24 .cu24-word-mask {
  display: inline-block;
  overflow: clip;
  margin: -.2em;
  vertical-align: top;
}
.cu24 .cu24-word { display: inline-block; padding: .2em; }
.cu24 .cu24-services { margin-top: calc(var(--cu24-unit) * 8); }
.cu24 .cu24-main { position: relative; }
.cu24 .cu24-items {
  display: grid;
  gap: var(--cu24-unit);
}
.cu24 .cu24-item {
  position: relative;
  overflow: hidden;
  padding: calc(var(--cu24-unit) * 3);
  border-radius: calc(var(--cu24-unit) * 2);
}
.cu24 .cu24-fill {
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: #eee;
}
.cu24 .cu24-art {
  position: absolute;
  inset: auto 0 0;
  opacity: 0;
  mix-blend-mode: lighten;
}
.cu24 .cu24-art img {
  display: inline-block;
  width: 100%;
  height: 100%;
  vertical-align: top;
  object-fit: cover;
  object-position: bottom center;
}
.cu24 .cu24-head {
  position: relative;
  display: grid;
  gap: calc(var(--cu24-unit) * 1.6);
}
.cu24 .cu24-num {
  margin-bottom: calc(var(--cu24-unit) * .8);
  font-size: calc(var(--cu24-unit) * 2);
  line-height: 110%;
  opacity: .2;
  transition: opacity .2s;
}
.cu24 .cu24-title {
  font: inherit;
  font-size: calc(var(--cu24-unit) * 3.2);
  line-height: 110%;
  letter-spacing: normal;
  overflow-wrap: normal;
}
.cu24 .cu24-toggle {
  display: block;
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  text-align: inherit;
  cursor: auto;
}
.cu24 .cu24-static-title { display: none; }
.cu24 .cu24-accordion {
  display: grid;
  grid-template-rows: 0fr;
  align-items: start;
  transition: grid-template-rows 1.2s cubic-bezier(.16,1,.3,1);
}
.cu24 .cu24-content {
  position: relative;
  min-height: 0;
  overflow: hidden;
  opacity: 0;
  transition: opacity .2s;
}
.cu24 .cu24-copy {
  max-width: none;
  margin: calc(var(--cu24-unit) * 2.4) 0 0;
  color: inherit;
  font-size: calc(var(--cu24-unit) * 2);
  line-height: 140%;
  letter-spacing: .02em;
}
.cu24 .cu24-action { margin: calc(var(--cu24-unit) * 2.4) 0 calc(var(--cu24-unit) * 7); }
.cu24 .cu24-link {
  display: inline-flex;
  position: relative;
  align-items: center;
  gap: calc(var(--cu24-unit) * 1.6);
  color: inherit;
  font-size: calc(var(--cu24-unit) * 2);
  line-height: 140%;
  letter-spacing: .02em;
  text-decoration: none;
}
.cu24 .cu24-link-label { position: relative; z-index: 2; display: block; overflow: hidden; }
.cu24 .cu24-link-label span {
  display: block;
  transition: transform .8s cubic-bezier(.16,1,.3,1);
}
.cu24 .cu24-link-label span::after {
  content: attr(data-text);
  position: absolute;
  top: 100%;
  left: 0;
  transform: scale(.9);
  transition: transform .4s;
}
.cu24 .cu24-link-icon {
  display: grid;
  place-items: center;
  width: calc(var(--cu24-unit) * 4);
  height: calc(var(--cu24-unit) * 4);
  border-radius: 50%;
  background: currentColor;
  font-size: calc(var(--cu24-unit) * 1.4);
  line-height: 1;
  transition: opacity .2s, transform .4s;
}
.cu24 .cu24-link-icon svg { width: 1em; height: 1em; filter: invert(); }
.cu24 .cu24-item[data-open] { color: #fff; }
.cu24 .cu24-item[data-open] .cu24-fill { background: #000; }
.cu24 .cu24-item[data-open] .cu24-art,
.cu24 .cu24-item[data-open] .cu24-content { opacity: 1; }
.cu24 .cu24-item[data-open] .cu24-content { transition-duration: .6s; }
.cu24 .cu24-item[data-open] .cu24-accordion { grid-template-rows: 1fr; }
.cu24 .cu24-item[data-open] .cu24-num { opacity: .5; }
@media (pointer: fine) {
  .cu24 .cu24-link:hover .cu24-link-label span { transform: translateY(-100%); }
  .cu24 .cu24-link:hover .cu24-link-label span::after { transform: scale(1); }
  .cu24 .cu24-link:hover .cu24-link-icon {
    transition: transform .7s cubic-bezier(.34,4.56,.64,1);
    transform: scale(.95);
  }
}
@media (min-width: 768px) {
  .cu24 { --cu24-unit: min(.625vw, 10px); }
  .cu24 .cu24-container { max-width: 1600px; padding-inline: calc(var(--cu24-unit) * 24); }
  .cu24 .cu24-intro .cu24-container { display: flex; }
  .cu24 .cu24-caption {
    flex: 0 0 28%;
    margin-bottom: calc(var(--cu24-unit) * 6.5);
    font-size: calc(var(--cu24-unit) * 1.6);
  }
  .cu24 .cu24-intro-copy { flex: 1; min-width: 0; }
  .cu24 .cu24-lede { max-width: 86%; font-size: calc(var(--cu24-unit) * 2.56); }
  .cu24 .cu24-services { margin-top: calc(var(--cu24-unit) * 12); }
  .cu24 .cu24-item { padding: calc(var(--cu24-unit) * 6); }
  .cu24 .cu24-art { left: auto; }
  .cu24 .cu24-head { display: flex; flex-direction: row-reverse; justify-content: space-between; align-items: center; }
  .cu24 .cu24-num { margin: 0; font-size: calc(var(--cu24-unit) * 2.6); text-align: right; transition: none; }
  .cu24 .cu24-title { font-size: calc(var(--cu24-unit) * 4.2); }
  .cu24 .cu24-static-title { display: inline; }
  .cu24 .cu24-toggle { display: none; }
  .cu24 .cu24-accordion { grid-template-rows: 1fr; transition: none; }
  .cu24 .cu24-items[data-measuring] .cu24-accordion { grid-template-rows: 1fr !important; }
  .cu24 .cu24-content, .cu24 .cu24-item[data-open] .cu24-content { transition: none; }
  .cu24 .cu24-copy { max-width: calc(var(--cu24-unit) * 56); margin-top: calc(var(--cu24-unit) * 3.2); }
  .cu24 .cu24-action { margin-bottom: 0; }
}
@media (min-width: 768px) and (prefers-reduced-motion: reduce) {
  .cu24 .cu24-item { color: #fff; }
  .cu24 .cu24-fill { background: #000; }
  .cu24 .cu24-art, .cu24 .cu24-content { opacity: 1; }
  .cu24 .cu24-num { opacity: .5; }
}
