@font-face {
  font-family: "PG Lusion Aeonik";
  src: url("media/services-lusion/Aeonik-Regular.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

.a1-hero__copy {
  --a1-print-circle-drop: clamp(42px, 1.05em, 48px);
  /* Editorial type stays in the open left quarter and never crosses the central printer. */
  width: min(25vw, 360px);
  max-width: calc(25vw - var(--pad));
  color: #11191d;
  text-shadow: 0 1px 0 rgba(255,255,255,.72), 0 14px 32px rgba(16,25,29,.16);
}

.a1-hero__copy #a1-hero-title {
  position: relative;
  z-index: 0;
  isolation: isolate;
  width: 100%;
  max-width: 100%;
  gap: 0;
  font-family: "PG Lusion Aeonik", "Helvetica Neue", Arial, sans-serif;
  /* Fits entirely in the open left quarter at the widest desktop frame. */
  font-size: clamp(42px, 3.35vw, 50px);
  font-weight: 400;
  letter-spacing: -0.035em;
  line-height: .96;
  transform: translate3d(var(--pg-lusion-title-x, 0px), 0, 0);
  will-change: transform;
}

/* One broad atmosphere belongs to the whole headline, never to a single word. */
.a1-hero__copy #a1-hero-title::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: -1.25em -1.8em;
  pointer-events: none;
  /* A shadow in the scene, not a pale label behind the changing word. */
  background: radial-gradient(ellipse at 34% 47%, rgba(8,15,19,.22) 0%, rgba(8,15,19,.11) 44%, rgba(8,15,19,0) 78%);
  filter: blur(28px);
}

.a1-hero__copy #a1-hero-title > .a1-hero__headline-line {
  display: block;
  width: fit-content;
  margin-top: 0;
  font-size: 1em;
  font-weight: 400;
  letter-spacing: inherit;
  white-space: nowrap;
}

.a1-hero__copy #a1-hero-title > .a1-hero__headline-line--fixed {
  position: relative;
  align-self: center;
  color: #3e555a;
  font-family: inherit;
  font-size: .78em;
  font-weight: 400;
  letter-spacing: -.04em;
  margin: .16em auto 0;
  text-shadow: 0 0 14px rgba(255,255,255,.38), 0 4px 18px rgba(16,25,29,.1);
  z-index: 2;
  transition: transform .58s cubic-bezier(.2,.88,.28,1);
}

[data-a1-hero-copy] > .a1-hero__promise,
[data-a1-hero-copy] > .a1-hero__cta {
  transition: transform .58s cubic-bezier(.2,.88,.28,1);
  will-change: transform;
}

.a1-hero.is-print-lowered .a1-hero__headline-line--fixed,
.a1-hero.is-print-lowered [data-a1-hero-copy] > .a1-hero__promise,
.a1-hero.is-print-lowered [data-a1-hero-copy] > .a1-hero__cta {
  /* The print line, its anchored circle and the supporting content
     below descend as one visual unit; the upper headline stays fixed. */
  transform: translate3d(0,var(--a1-print-circle-drop),0) !important;
}

/* The supplied 8:3 video stays behind both text lines. Screen compositing makes
   its black plate transparent while preserving every original painted frame. */
#a1-hero-title .a1-hero__circle-video {
  position: absolute;
  z-index: -1;
  left: 50%;
  top: 50%;
  width: 132%;
  aspect-ratio: 8 / 3;
  overflow: hidden;
  pointer-events: none;
  opacity: 0;
  transform: translate(-50%,-50%);
  transition: opacity .12s linear;
  /* The primary WebM carries real alpha. Screen is retained solely so the
     black MP4 fallback also has no visible plate in older browsers. */
  mix-blend-mode: screen;
}

#a1-hero-title .a1-hero__circle-video video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  background: transparent;
}

#a1-hero-title .a1-hero__circle-video img {
  display: none;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.a1-hero.is-circle-playing #a1-hero-title .a1-hero__circle-video,
.a1-hero.is-circle-complete #a1-hero-title .a1-hero__circle-video { opacity: 1; }

.a1-hero.is-circle-complete #a1-hero-title .a1-hero__circle-video video { display:none; }
.a1-hero.is-circle-complete #a1-hero-title .a1-hero__circle-video img { display:block; }

/* The hero may animate its background meanwhile, but the complete headline
   cannot leave laterally or fade before the supplied stroke actually ends. */
.a1-hero:not(.is-circle-complete) .a1-hero__copy {
  transform: translate3d(0,0,0);
  opacity: 1;
}

.a1-hero.is-circle-final-hold .a1-hero__copy {
  transform: translate3d(0,0,0);
  opacity: 1;
}

/* Circle treatment deliberately deferred: this preview only evaluates the
   underlined constant word. */
.a1-hero__copy #a1-hero-title > .a1-hero__headline-line--fixed::after {
  display: none;
}

.lusion-headline__line {
  position: relative;
  bottom: 0.135em;
  overflow: hidden;
}

#a1-hero-title .a1-hero__headline-slot {
  display: inline-grid;
  position: relative;
  z-index: 0;
  vertical-align: baseline;
  overflow: hidden;
  line-height: 1;
  width: auto !important;
  margin-top: 0 !important;
  color: inherit !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  filter: none !important;
  font: inherit !important;
  font-size: 1em !important;
  font-weight: 400 !important;
  letter-spacing: inherit !important;
  text-shadow: inherit !important;
}

/* The legibility haze follows the letterforms, never a rectangular container. */
#a1-hero-title .a1-hero__headline-swap-region {
  display: inline-grid;
  vertical-align: baseline;
  width: auto !important;
  margin: 0 !important;
  color: #11191d !important;
  font: inherit !important;
  font-size: 1em !important;
  font-weight: 400 !important;
  letter-spacing: inherit !important;
  line-height: 1 !important;
  text-shadow: inherit !important;
}

/* The constant word is the anchor of the exchange: quieter than the service
   label, but deliberately more present than the changing word. */
#a1-hero-title [data-a1-headline-prefix] {
  display: inline-block;
  color: #64777b;
  font-size: 1.07em;
  letter-spacing: -.045em;
  position: relative;
  text-shadow: 0 0 16px rgba(255,255,255,.42), 0 4px 18px rgba(16,25,29,.14);
}

/* Magi's transparent brush asset is physically separated from the glyph box.
   The narrow viewport crops its large transparent canvas and reveals the
   painted pixels from left to right without scaling the reveal itself. */
#a1-hero-title .a1-hero__prefix-brush {
  position: absolute;
  z-index: -1;
  left: -.015em;
  top: calc(100% + .08em);
  width: 104%;
  height: .27em;
  overflow: hidden;
  pointer-events: none;
  clip-path: inset(0 var(--a1-brush-reveal-right, 100%) 0 0);
  will-change: clip-path;
}

#a1-hero-title .a1-hero__prefix-brush img {
  position: absolute;
  left: 0;
  top: 50%;
  display: block;
  width: 100%;
  height: auto;
  max-width: none;
  transform: translateY(-50%);
  background: transparent;
}



.a1-hero__headline-slot > span {
  grid-area: 1 / 1;
  display: block;
  color: inherit !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  filter: blur(0);
  font: inherit !important;
  font-size: 1em !important;
  font-weight: inherit !important;
  letter-spacing: inherit !important;
  line-height: 1 !important;
  text-shadow: none !important;
  transform: translate3d(0,0,0);
  opacity: 1;
  transition: transform .52s cubic-bezier(.2,.88,.28,1), opacity .24s ease, filter .24s ease;
  will-change: transform, opacity, filter;
}

.a1-hero__headline-slot > [data-a1-headline-piece] {
  transform: translate3d(0,116%,0);
  opacity: 0;
  filter: blur(5px);
  transition-delay: 0s;
}

.a1-hero.is-word-swapped .a1-hero__headline-slot > [data-a1-headline-idea] {
  transform: translate3d(0,128%,0) rotate(1.1deg);
  opacity: 0;
  filter: blur(3px);
}

.a1-hero.is-word-swapped .a1-hero__headline-slot > [data-a1-headline-piece] {
  transform: translate3d(0,0,0);
  opacity: 1;
  filter: blur(0);
  transition-delay: .22s;
}


@media (min-aspect-ratio: 21/9) {
  .a1-hero__copy #a1-hero-title {
    font-size: clamp(42px, 3.2vw, 50px);
  }
}

@media (max-width: 812px) and (min-width: 701px) {
  .a1-hero__copy {
    width: min(25vw, 360px);
  }

  .a1-hero__copy #a1-hero-title {
    width: auto;
    font-size: clamp(40px, 5.4vw, 54px);
  }
}

@media (max-width: 700px) {
  .a1-hero__copy { width:min(82vw,360px); max-width:none; color:#11191d; }
}

@media (max-width: 560px) {
  .a1-hero__copy {
    width: min(82vw, 360px);
    max-width: none;
  }

  .a1-hero__copy #a1-hero-title {
    width: 100%;
    font-size: clamp(40px, 12.8vw, 54px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .a1-hero__copy #a1-hero-title,
  .a1-hero__headline-slot > span {
    transform: none !important;
    will-change: auto;
  }

  .a1-hero__headline-slot > [data-a1-headline-piece] { display: none; }
  #a1-hero-title .a1-hero__prefix-brush {
    clip-path: none;
    will-change: auto;
  }
  .a1-hero__copy #a1-hero-title > .a1-hero__headline-line--fixed,
  .a1-hero.is-print-lowered [data-a1-hero-copy] > .a1-hero__promise,
  .a1-hero.is-print-lowered [data-a1-hero-copy] > .a1-hero__cta { transform:translate3d(0,var(--a1-print-circle-drop),0)!important; }
  #a1-hero-title .a1-hero__circle-video { opacity:1; transition:none; }
  #a1-hero-title .a1-hero__circle-video video { display:none; }
  #a1-hero-title .a1-hero__circle-video img { display:block; }
}
