.home-pos-stage {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.home-pos-stage > picture {
  display: block;
  width: 100%;
  height: 100%;
}

#acasa .home-pos-stage > picture > img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 64% 50%;
}

.home-pos-screen {
  position: absolute;
  z-index: 1;
  inset: 0 auto auto 0;
  pointer-events: none;
  overflow: hidden;
  transform: translateZ(0);
}

.home-pos-screen > svg {
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.home-pos-screen .pos-screen-surface {
  fill: url("#pos-screen-surface-gradient");
  stroke: none;
  shape-rendering: geometricPrecision;
}

.home-pos-screen .pos-screen-grid {
  fill: url("#pos-screen-surface-gradient");
  opacity: .98;
}

.home-pos-screen text {
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  text-rendering: geometricPrecision;
}

.home-pos-screen .pos-screen-kicker {
  fill: #a9f5d8;
  font-weight: 850;
  letter-spacing: .1em;
}

.home-pos-screen .pos-screen-note {
  fill: #dca5f3;
  font-weight: 800;
  letter-spacing: .08em;
}

.home-pos-screen .home-pos-svg-label {
  fill: #f6fff9;
  font-weight: 850;
  letter-spacing: .025em;
}

.home-pos-screen .pos-screen-value {
  fill: #e9fff5;
  font-weight: 900;
  letter-spacing: .04em;
}

.home-pos-screen .pos-screen-status {
  fill: #b9e8d7;
  font-weight: 720;
  letter-spacing: .045em;
}

.home-pos-screen .pos-screen-badge {
  fill: #70eebb;
  font-weight: 850;
  letter-spacing: .08em;
}

.home-pos-screen .pos-screen-check {
  fill: #071511;
  font-weight: 950;
}

.home-pos-screen .pos-screen-step {
  fill: #70eebb;
  font-weight: 900;
  letter-spacing: .08em;
}

.home-pos-screen .pos-screen-live {
  fill: #70eebb;
}

.home-pos-screen .pos-panel {
  fill: #0a1d18;
  fill-opacity: .92;
  stroke: #8debc8;
  stroke-opacity: .58;
  stroke-width: 1.4;
  vector-effect: non-scaling-stroke;
}

.home-pos-screen .pos-panel-focus {
  fill: #12392e;
  stroke: #70eebb;
  stroke-width: 2.4;
}

.home-pos-screen .pos-panel-output {
  fill: #0d241e;
}

.home-pos-screen .pos-panel-step {
  fill: #091713;
  stroke-opacity: .35;
}

.home-pos-screen .pos-panel-step-active {
  fill: #12392e;
  stroke: #70eebb;
  stroke-opacity: .72;
}

.home-pos-screen .pos-status-rail {
  fill: #70eebb;
  fill-opacity: .08;
  stroke: #70eebb;
  stroke-opacity: .34;
  stroke-width: 1.2;
  vector-effect: non-scaling-stroke;
}

.home-pos-screen .pos-focus-ring {
  fill: #70eebb;
  stroke: #e6fff5;
  stroke-width: 2.2;
  vector-effect: non-scaling-stroke;
  transform-box: fill-box;
  transform-origin: center;
  animation: home-pos-focus 2.8s ease-in-out infinite;
}

.home-pos-screen .pos-flow-line {
  fill: none;
  stroke: #70eebb;
  stroke-width: 2.4;
  stroke-linecap: round;
  stroke-dasharray: 1;
  stroke-dashoffset: 1;
  vector-effect: non-scaling-stroke;
  animation: home-pos-flow 3.8s ease-in-out infinite;
}

.home-pos-screen .pos-flow-line-secondary {
  animation-delay: 1.1s;
}

@keyframes home-pos-flow {
  0%, 14% { stroke-dashoffset: 1; opacity: .35; }
  45%, 82% { stroke-dashoffset: 0; opacity: 1; }
  100% { stroke-dashoffset: -1; opacity: .35; }
}

@keyframes home-pos-focus {
  0%, 100% { opacity: .72; transform: scale(.82); }
  48%, 68% { opacity: 1; transform: scale(1.18); }
}

@media (max-width: 900px) {
  #acasa .td-media-hero .home-pos-stage {
    width: 100%;
    height: 100%;
    aspect-ratio: 9 / 16;
  }

  #acasa .td-media-hero .home-pos-stage > picture {
    height: 100%;
  }

  #acasa .td-media-hero .home-pos-stage > picture > img {
    width: 100%;
    height: 100%;
    aspect-ratio: auto;
    object-fit: cover;
    object-position: 54% 50%;
  }

  .home-pos-screen .pos-panel { stroke-width: 1.2; }
  .home-pos-screen .pos-panel-focus { stroke-width: 2; }
}

@media (prefers-reduced-motion: reduce) {
  .home-pos-screen .pos-flow-line,
  .home-pos-screen .pos-focus-ring {
    animation: none !important;
    opacity: 1;
    stroke-dashoffset: 0;
    transform: none;
  }
}

.motion-paused .home-pos-screen .pos-flow-line,
.motion-paused .home-pos-screen .pos-focus-ring {
  animation-play-state: paused !important;
}