/* ==========================================================================
   SUEVORA — site-engine.css
   Shared across every page (not homepage-only). Three things live here:
   1. .sv-ambient — the fixed full-viewport canvas site-engine.js paints a
      quiet particle field onto, sitting behind all real content everywhere,
      not just the homepage hero. Inert, z-index -1, no interaction.
   2. .sv-glass — a utility class pages apply to panels/cards that should
      read as the "glass, slightly warped" surface from the reference
      sites. Pure CSS (backdrop-filter + a faint chromatic edge) so it
      costs nothing extra over what the browser already does for a normal
      panel — no per-element WebGL.
   3. .sv-glitch-veil — the full-screen transition overlay shown for a few
      frames when you click an internal link, giving page-to-page jumps a
      deliberate "scene cut" instead of a plain reload flash.
   Every rule degrades to nothing under prefers-reduced-motion or print.
   ========================================================================== */

.sv-ambient{
    position:fixed;inset:0;z-index:-1;pointer-events:none;display:block;
    width:100%;height:100%;opacity:.5;
}
@media print{.sv-ambient{display:none;}}

.sv-glass{
    position:relative;
    background:rgba(8,23,17,.55);
    -webkit-backdrop-filter:blur(14px) saturate(130%);
    backdrop-filter:blur(14px) saturate(130%);
    border:1px solid rgba(47,174,111,.22);
    box-shadow:0 1px 0 rgba(255,255,255,.04) inset, 0 18px 40px -22px rgba(0,0,0,.65);
}
.sv-glass::before{
    content:"";position:absolute;inset:0;pointer-events:none;
    background:linear-gradient(135deg, rgba(126,240,171,.05), transparent 40%);
    mix-blend-mode:screen;
}

.sv-glitch-veil{
    position:fixed;inset:0;z-index:12000;pointer-events:none;
    opacity:0;background:#020806;
    display:flex;align-items:center;justify-content:center;
}
.sv-glitch-veil.active{
    opacity:1;
    animation:sv-glitch-flicker .38s steps(2,end) 1;
}
.sv-glitch-veil .sv-glitch-bar{
    position:absolute;left:0;right:0;height:3px;background:rgba(126,240,171,.5);
    mix-blend-mode:screen;transform:scaleX(0);
}
@keyframes sv-glitch-flicker{
    0%{opacity:0;}
    15%{opacity:1;}
    35%{opacity:.2;}
    55%{opacity:1;}
    100%{opacity:1;}
}
@media (prefers-reduced-motion: reduce){
    .sv-glitch-veil{display:none !important;}
}

/* custom cursor, shared across every page */
body.sv-cursor-active{cursor:none;}
body.sv-cursor-active a,body.sv-cursor-active button,body.sv-cursor-active input,
body.sv-cursor-active .sv-glass{cursor:none;}
.sv-cursor-dot,.sv-cursor-ring{
    position:fixed;top:0;left:0;z-index:13000;pointer-events:none;
    border-radius:50%;transform:translate3d(-50%,-50%,0);will-change:transform;
}
.sv-cursor-dot{width:6px;height:6px;margin:-3px 0 0 -3px;background:#7ef0ab;}
.sv-cursor-ring{
    width:30px;height:30px;margin:-15px 0 0 -15px;
    border:1px solid rgba(126,240,171,.55);
    transition:width .2s ease,height .2s ease,margin .2s ease,border-color .2s ease;
}
body.sv-cursor-hover .sv-cursor-ring{
    width:52px;height:52px;margin:-26px 0 0 -26px;border-color:#c8f24c;
}
@media(max-width:900px){.sv-cursor-dot,.sv-cursor-ring{display:none;}}