/* =========================================================
   MN MEDIA · STEP 49 · Brand Motion
   Scattered Points + PixelDrift, no controls
   ========================================================= */

.step49-brand-motion{
  --s49-bg:#050605;
  --s49-white:#fff;
  --s49-muted:rgba(255,255,255,.44);
  position:relative;
  background:var(--s49-bg);
  color:var(--s49-white);
  overflow:hidden;
}

.step49-brand-stage{
  position:relative;
  min-height:clamp(620px,88svh,920px);
  overflow:hidden;
  background:#050605;
}

.step49-brand-stage::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:
    radial-gradient(circle at 50% 44%,rgba(216,240,36,.055),transparent 24%),
    linear-gradient(180deg,rgba(255,255,255,.016),transparent 30%,transparent 72%,rgba(255,255,255,.018));
}

.step49-brand-canvas{
  position:absolute;
  inset:0;
  z-index:0;
  display:block;
  width:100%;
  height:100%;
}

.step49-brand-ui{
  position:absolute;
  z-index:3;
  top:clamp(24px,3vw,42px);
  left:clamp(20px,4vw,68px);
  right:clamp(20px,4vw,68px);
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:18px;
  pointer-events:none;
}

.step49-brand-kicker,
.step49-brand-mode{
  margin:0;
  font-size:.63rem;
  line-height:1;
  font-weight:850;
  letter-spacing:.16em;
}

.step49-brand-kicker{color:#fff}
.step49-brand-mode{
  color:var(--s49-muted);
  transition:opacity .2s ease,transform .25s ease,color .25s ease;
}
.step49-brand-mode.is-changing{
  opacity:0;
  transform:translateY(-6px);
}

.step49-brand-footer{
  position:absolute;
  z-index:3;
  left:clamp(20px,4vw,68px);
  right:clamp(20px,4vw,68px);
  bottom:clamp(24px,3vw,42px);
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:30px;
  pointer-events:none;
}

.step49-brand-footer p{
  margin:0;
  display:grid;
  gap:7px;
}
.step49-brand-footer strong{
  font-size:.68rem;
  letter-spacing:.14em;
}
.step49-brand-footer p span{
  color:var(--s49-muted);
  font-size:.76rem;
  line-height:1.35;
}

.step49-brand-pulse{
  width:42px;
  height:1px;
  background:#fff;
  transform-origin:right center;
  animation:step49pulse 1.8s ease-in-out infinite;
}
@keyframes step49pulse{
  0%,100%{transform:scaleX(.34);opacity:.34}
  50%{transform:scaleX(1);opacity:1}
}

.step49-sr-only{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  padding:0!important;
  margin:-1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;
  border:0!important;
}

@media (max-width:760px){
  .step49-brand-stage{
    min-height:72svh;
  }
  .step49-brand-ui{
    top:22px;
    left:16px;
    right:16px;
  }
  .step49-brand-footer{
    left:16px;
    right:16px;
    bottom:20px;
  }
  .step49-brand-mode{display:none}
  .step49-brand-footer p span{font-size:.7rem}
  .step49-brand-pulse{width:28px}
}

@media (prefers-reduced-motion:reduce){
  .step49-brand-pulse{animation:none}
}