/* ===== ANALOG — riquadri animati tile-bg (ramarro / aurora) ===== */

/* I contenitori dei riquadri diventano contesto di impilamento con angoli clip */
.card,
.aud,
.priv,
.cta-inner {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}

/* wrapper dello sfondo animato: riempie il riquadro, dietro il contenuto */
.tile-bg {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  overflow: hidden;
  background: #06090f;
}
.tile-bg canvas {
  display: block;
  width: 100%;
  height: 100%;
}

/* contenuto del riquadro sopra lo sfondo */
.card > *:not(.tile-bg),
.aud > *:not(.tile-bg),
.priv > *:not(.tile-bg),
.cta-inner > *:not(.tile-bg) {
  position: relative;
  z-index: 2;
}

/* testo dei riquadri: bianco intenso come i titoli, con ombra per la leggibilità */
.card p,
.aud p,
.priv p,
.cta .lead {
  color: var(--text);
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
}
.aud .num {
  color: var(--text);
  opacity: 0.85;
}

/* velo + vignettatura sopra il canvas per la leggibilità del testo */
.tile-bg::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
}
.tile-bg.ramarro::after {
  background: radial-gradient(
    130% 110% at 50% 26%,
    transparent 44%,
    rgba(0, 3, 1, 0.6) 100%
  ),
  rgba(2, 9, 5, 0.15);
}
.tile-bg.aurora::after {
  background: radial-gradient(
    130% 110% at 50% 26%,
    transparent 44%,
    rgba(1, 1, 6, 0.55) 100%
  ),
  rgba(6, 7, 18, 0.18);
}