:root {
  --fg: #0b0b0f;
  --bg: #ffffff;
  --neon: #09a58b;
}
* {
  box-sizing: border-box;
}
html,
body {
  height: 100%;
}
body {
  margin: 0;
  background: var(--fg);
  color: var(--bg);
  display: flex;
  align-items: center;
  justify-content: center;
}

.page {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.logo {
  display: block;
  width: min(25vw, 120px);
  height: auto;
}

/* Animació via CSS (compatible a tot arreu) */
@keyframes pulse {
  0%,
  100% {
    filter: drop-shadow(0 0 3px var(--neon)) drop-shadow(0 0 8px var(--neon))
      drop-shadow(0 0 12px var(--neon));
  }
  50% {
    filter: drop-shadow(0 0 6px var(--neon)) drop-shadow(0 0 11px var(--neon))
      drop-shadow(0 0 22px var(--neon));
  }
}
.logo {
  color: var(--neon);
}
.logo path {
  /* color del logo des de CSS */
  fill: currentColor;
  /* glow + animació */
  /*animation: pulse 3.2s ease-in-out infinite;
  will-change: filter;*/
}
/* Si sospites que tens “reduir moviment”, comenta aquest bloc*/
@media (prefers-reduced-motion: reduce) {
  .logo path {
    animation: none;
  }
}