/* ===== Vaffe Invest — background atmosphere ===== */
/* Subtle, brand-derived ambient effects.
   - Every decorative layer lives on a ::before / ::after pseudo-element only.
   - Layers sit BELOW content (z-index:0, content lifted to z-index:1), never
     capture pointer events, and never shift layout (position:absolute;inset:0).
   - Colours are derived ONLY from the existing gold accent (#c9a044 ->
     rgb 201,160,68) as low-opacity variants. No new hues are introduced.
   - Motion is slow (18s) and fully disabled under prefers-reduced-motion. */

/* --- Dark, dramatic sections: soft gold radial glow blobs --- */
.alt,
.footer,
.cta-band{position:relative;isolation:isolate;overflow:hidden}

.alt::before,
.footer::before,
.cta-band::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  background:
    radial-gradient(42% 60% at 88% 8%, rgba(201,160,68,.12), rgba(201,160,68,0) 70%),
    radial-gradient(38% 55% at 6% 96%, rgba(201,160,68,.07), rgba(201,160,68,0) 72%);
}

/* Keep all content above the decorative layer — no layout movement,
   only paint order (position:relative with no offsets). */
.alt > *,
.footer > *,
.cta-band > *{position:relative;z-index:1}

/* --- Footer: a faint gold dot grid for extra depth, fading out downward --- */
.footer::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  background-image:radial-gradient(rgba(201,160,68,.08) 1px, transparent 1.4px);
  background-size:24px 24px;
  -webkit-mask-image:linear-gradient(180deg, rgba(0,0,0,.9), transparent 62%);
  mask-image:linear-gradient(180deg, rgba(0,0,0,.9), transparent 62%);
}

/* --- Light sections: a single, very subtle off-centre warm glow --- */
.section:not(.alt){position:relative}
.section:not(.alt)::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  background:radial-gradient(50% 45% at 100% 0%, rgba(201,160,68,.045), rgba(201,160,68,0) 70%);
}
.section:not(.alt) > *{position:relative;z-index:1}

/* --- Gentle drift: slow, barely perceptible, motion-safe only --- */
@media (prefers-reduced-motion: no-preference){
  .alt::before,
  .cta-band::before{animation:vi-atmos-drift 18s ease-in-out infinite alternate}
}
@keyframes vi-atmos-drift{
  from{transform:translate3d(0,0,0) scale(1)}
  to{transform:translate3d(-1.5%,1.5%,0) scale(1.06)}
}
@media (prefers-reduced-motion: reduce){
  .alt::before,
  .cta-band::before{animation:none}
}