.hwt-cfe-wrapper {
  position: relative;
  width: 100%;
  isolation: isolate; 
  padding: 15.9rem 0em;
  overflow: hidden;
}

.hwt-cfe-content {
  position: relative;
  z-index: 2; 
  text-align: left;

}

.hwt-cfe-headline {
  margin: 0 0 .5em 0;
  color: #FFF;
  margin-left: 8%;
  margin-bottom: 2.1875em;
}

.hwt-cfe-body {
  margin: 0;
  color: inherit;
  width: 35%;
  margin-left: 26%;
  font-weight: 300;
}

.hwt-cfe-stage {
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  z-index: 1; 
  pointer-events: none;
  width: var(--hwt-cfe-size);
  height: var(--hwt-cfe-size);
  overflow: visible;
  display: grid;
  place-items: center;
  width: 60%;
}
.hwt-cfe-stage svg, .hwt-cfe-stage img, .hwt-cfe-img  {
  max-width: 100%;
}
.hwt-cfe-img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform-origin: 50% 50%;
  opacity: var(--hwt-cfe-img-opacity, 0.35);
  transform: translate(-50%, -50%);
}

.hwt-cfe-img img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.hwt-cfe-img-inner img {
  transform: scale(var(--hwt-cfe-inner-scale, .72));
}

.hwt-cfe-textcircle {
  position: absolute;
  top: 50%;
  left: 50%;
  transform-origin: 50% 50%;
  pointer-events: none;
  opacity: 0.4;
}

.hwt-cfe-textbuild {
  position: relative;
  width: 100%;
  height: 100%;
}

.hwt-cfe-textbuild .char {
  position: absolute;
  top: 50%;
  left: 50%;
  font: inherit;
  text-transform: uppercase;
  letter-spacing: 0.125em;
  white-space: pre;
  transform-origin: 0 0;
  transform: rotate(var(--a)) translate(var(--r)) rotate(90deg);
}

@keyframes hwt-cfe-rot-centered {
  from { transform: translate(-50%, -50%) rotate(0deg); }
  to   { transform: translate(-50%, -50%) rotate(360deg); }
}

.spin {
  animation: hwt-cfe-rot-centered 20s linear infinite;
}

.reverse {
  animation-direction: reverse;
}

.hwt-cfe-img-outer         { animation-duration: var(--speed-img-outer, 40s); }
.hwt-cfe-img-inner         { animation-duration: var(--speed-img-inner, 28s); }
.hwt-cfe-textcircle-outer  { animation-duration: var(--speed-txt-outer, 30s); }
.hwt-cfe-textcircle-inner  { animation-duration: var(--speed-txt-inner, 22s); }

.hwt-cfe-textcircle svg { overflow: visible; }   
.hwt-cfe-textcircle text { dominant-baseline: middle; }