/* ============================================
   VPN & Security — page-specific overrides
   Inherits structure from ../ai-implementing/index.css
   ============================================ */

.svc-page.svc-theme-vpn {
    --svc-r: 16;
    --svc-g: 185;
    --svc-b: 129;
    --svc-r2: 6;
    --svc-g2: 182;
    --svc-b2: 212;
    --svc-r3: 110;
    --svc-g3: 231;
    --svc-b3: 183;
    --svc-text: #6ee7b7;
}

/* ============================================
   Fortress hero visual animations
   ============================================ */

/* Outer protection rings — expand from 80 → 200, fade out, stagger */
.svc-fortress .vf-pulse {
    transform-origin: 240px 240px;
    transform-box: fill-box;
    animation: vfPulse 3s ease-out infinite;
}
.svc-fortress .vf-pulse-2 { animation-delay: -1s; }
.svc-fortress .vf-pulse-3 { animation-delay: -2s; }

@keyframes vfPulse {
    0%   { transform: scale(1);   opacity: 0.55; }
    100% { transform: scale(2.5); opacity: 0; }
}

/* Outer dashed orbit — slow rotation */
.svc-fortress .vf-orbit {
    transform-origin: 240px 240px;
    transform-box: fill-box;
    animation: vfOrbit 60s linear infinite;
}

@keyframes vfOrbit { to { transform: rotate(360deg); } }

/* Orbiting tokens — rotate around center */
.svc-fortress .vf-orbit-tokens > g {
    transform-origin: 240px 240px;
    transform-box: fill-box;
    animation: vfOrbitTokens 18s linear infinite;
}
.svc-fortress .vf-orbit-tokens > g:nth-child(2) { animation-duration: 22s; animation-direction: reverse; }
.svc-fortress .vf-orbit-tokens > g:nth-child(3) { animation-duration: 25s; }

@keyframes vfOrbitTokens { to { transform: rotate(360deg); } }

/* Token glow */
.svc-fortress .vf-token {
    transform-origin: center;
    transform-box: fill-box;
    animation: vfTokenGlow 2s ease-in-out infinite;
}
.svc-fortress .vf-token-2 { animation-delay: -0.7s; }
.svc-fortress .vf-token-3 { animation-delay: -1.4s; }

@keyframes vfTokenGlow {
    0%, 100% { transform: scale(1);    filter: drop-shadow(0 0 0 transparent); }
    50%      { transform: scale(1.25); filter: drop-shadow(0 0 6px currentColor); }
}

/* Shield gentle glow */
.svc-fortress .vf-shield {
    transform-origin: 240px 240px;
    transform-box: fill-box;
    animation: vfShield 4s ease-in-out infinite;
}

@keyframes vfShield {
    0%, 100% { filter: drop-shadow(0 0 0 transparent); }
    50%      { filter: drop-shadow(0 0 18px rgba(16, 185, 129, 0.55)); }
}

/* Inner shield border slow rotation */
.svc-fortress .vf-shield-inner {
    transform-origin: 240px 245px;
    transform-box: fill-box;
    animation: vfShieldInner 22s linear infinite;
}

@keyframes vfShieldInner { to { transform: rotate(360deg); } }

/* Core check pulse */
.svc-fortress .vf-core {
    transform-origin: 240px 245px;
    transform-box: fill-box;
    animation: vfCorePulse 2.4s ease-in-out infinite;
}

@keyframes vfCorePulse {
    0%, 100% { transform: scale(1);    }
    50%      { transform: scale(1.06); }
}

@media (prefers-reduced-motion: reduce) {
    .svc-fortress .vf-pulse, .svc-fortress .vf-orbit, .svc-fortress .vf-orbit-tokens > g,
    .svc-fortress .vf-token, .svc-fortress .vf-shield, .svc-fortress .vf-shield-inner, .svc-fortress .vf-core {
        animation: none !important;
    }
}