/* EVZONE logo (CSS-only). Set --s on .evzone-logo to scale (1.0 = full size). */
.evzone-logo {
  --s: 1;
  position: relative;
  display: inline-block;
  font-family: 'Orbitron', sans-serif;
  -webkit-font-smoothing: antialiased;
}
.evzone-logo .logo-bg {
  position: absolute;
  inset: calc(10px * var(--s)) calc(-30px * var(--s)) calc(30px * var(--s)) calc(-30px * var(--s));
  /* background removed — plate is now transparent; only the purple glow remains */
  clip-path: polygon(4% 20%, 30% 20%, 35% 0%, 100% 0%, 95% 75%, 75% 100%, 10% 100%, 0% 60%);
  box-shadow:
    0 0 calc(25px * var(--s)) rgba(180,70,255,.45),
    0 calc(10px * var(--s)) calc(40px * var(--s)) rgba(0,0,0,.9);
  z-index: 0;
}
.evzone-logo .logo {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: flex-end;
  line-height: .85;
}
.evzone-logo .ev,
.evzone-logo .zone {
  font-size: calc(170px * var(--s));
  font-weight: 900;
  font-style: italic;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  transform: skewX(-12deg);
}
.evzone-logo .ev {
  background-image: linear-gradient(180deg,
    #f2b6ff 0%, #ca78ff 18%, #a442ff 42%, #7c2cff 70%, #45108d 100%);
  -webkit-text-stroke: calc(3px * var(--s)) #f3c6ff;
  text-shadow:
    0 0 calc(10px * var(--s)) rgba(204,102,255,.9),
    0 0 calc(25px * var(--s)) rgba(153,51,255,.8),
    0 0 calc(40px * var(--s)) rgba(153,51,255,.5);
}
.evzone-logo .zone {
  margin-left: calc(-10px * var(--s));
  background-image: linear-gradient(180deg,
    #ffffff 0%, #f4f4f4 15%, #d9dce5 45%, #bfc5d3 75%, #8f97a8 100%);
  -webkit-text-stroke: calc(2px * var(--s)) #f5f5f5;
  text-shadow:
    0 0 calc(6px * var(--s)) rgba(255,255,255,.7),
    0 0 calc(18px * var(--s)) rgba(255,255,255,.25);
}
.evzone-logo .subtitle {
  position: relative;
  z-index: 2;
  margin-top: calc(-10px * var(--s));
  text-align: center;
  font-size: calc(28px * var(--s));
  font-weight: 700;
  letter-spacing: calc(12px * var(--s));
  text-transform: uppercase;
  color: #d05bff;
  text-shadow:
    0 0 calc(8px * var(--s)) rgba(208,91,255,.9),
    0 0 calc(18px * var(--s)) rgba(208,91,255,.6);
}
.evzone-logo .subtitle::before,
.evzone-logo .subtitle::after {
  content: '';
  position: absolute;
  top: 50%;
  width: calc(120px * var(--s));
  height: calc(5px * var(--s));
  border-radius: calc(20px * var(--s));
  transform: translateY(-50%);
}
.evzone-logo .subtitle::before {
  right: 100%;
  margin-right: calc(20px * var(--s));
  background: linear-gradient(90deg, #7b2cff, #ff7cff);
  box-shadow: 0 0 calc(15px * var(--s)) #b14cff;
}
.evzone-logo .subtitle::after {
  left: 100%;
  margin-left: calc(20px * var(--s));
  background: linear-gradient(90deg, #ff7cff, #7b2cff);
  box-shadow: 0 0 calc(15px * var(--s)) #b14cff;
}
.evzone-logo .glow {
  position: absolute;
  left: 50%;
  bottom: calc(-25px * var(--s));
  width: 80%;
  height: calc(25px * var(--s));
  transform: translateX(-50%);
  background: radial-gradient(ellipse,
    rgba(180,70,255,.85) 0%, rgba(180,70,255,.25) 50%, transparent 80%);
  filter: blur(calc(10px * var(--s)));
  z-index: 1;
}

/* Compact variant: no plate, no subtitle, no glow — just the EVZONE wordmark
   for use in narrow header bars. Apply class "evzone-logo--compact". */
.evzone-logo--compact .logo-bg,
.evzone-logo--compact .subtitle,
.evzone-logo--compact .glow { display: none; }
.evzone-logo--compact .ev,
.evzone-logo--compact .zone {
  text-shadow: 0 0 calc(6px * var(--s)) rgba(204,102,255,.8);
}