/* ═══════════════════════════════════════════════════════════════════════════
   membrAIn v3 — shared ambience + motion layer
   ONE source of truth for the "next-stage" feel across every page. Drop-in:
     <link rel="stylesheet" href="/v3.css">   (before the page's own <style> is fine)
     <script src="/v3.js" defer></script>
   Purely additive: adds a fixed aurora/grain backdrop and opt-in scroll-reveal.
   Respects prefers-reduced-motion. Uses each page's existing --bg, so it inherits
   whatever palette variable name the page already defines (falls back to #070910).
   ═══════════════════════════════════════════════════════════════════════════ */

/* Aurora + grain backdrop — one fixed layer, GPU-cheap, pointer-transparent.
   z-index:-1 keeps it BEHIND all page content without having to touch any other
   element's stacking/position (an earlier body>* lift broke position:fixed modals).
   A body child at z-index:-1 still paints above the page's propagated background. */
.v3-amb{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.v3-amb::before,.v3-amb::after{
  content:'';position:absolute;width:min(60vw,900px);height:min(60vw,900px);
  border-radius:50%;filter:blur(120px);opacity:.14;will-change:transform;
}
.v3-amb::before{background:radial-gradient(circle,#34e2c8,transparent 60%);top:-42vh;left:-14vw;animation:v3drift1 28s cubic-bezier(.22,.9,.28,1) infinite alternate}
.v3-amb::after{background:radial-gradient(circle,#5aa8f5,transparent 60%);top:-46vh;right:-18vw;animation:v3drift2 34s cubic-bezier(.22,.9,.28,1) infinite alternate}
@keyframes v3drift1{to{transform:translate(120px,60px) scale(1.08)}}
@keyframes v3drift2{to{transform:translate(-140px,90px) scale(.94)}}
.v3-grain{position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.4;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .035 0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E")}

/* Scroll-reveal: elements tagged [data-v3reveal] rise in as they enter view. */
[data-v3reveal]{opacity:0;transform:translateY(16px);transition:opacity .6s cubic-bezier(.22,.9,.28,1),transform .6s cubic-bezier(.22,.9,.28,1)}
[data-v3reveal].v3-in{opacity:1;transform:none}

/* Shared focus ring — accessibility polish that was missing site-wide. */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{
  outline:2px solid rgba(52,226,200,.6);outline-offset:2px;border-radius:6px
}

@media(prefers-reduced-motion:reduce){
  .v3-amb::before,.v3-amb::after{animation:none}
  [data-v3reveal]{opacity:1;transform:none;transition:none}
}