/* GBpass Custom Styles */

html {
    scroll-behavior: smooth;
}

/* Header scroll effect */
.header-scrolled {
    box-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1);
}

/* FAQ animation */
.faq-content {
    transition: max-height 0.3s ease-out;
}

.faq-icon-rotated {
    transform: rotate(180deg);
}

/* Mobile menu animation */
#mobile-menu {
    transition: max-height 0.3s ease-out;
}

/* Material Symbols */
.material-symbols-outlined {
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
    line-height: 1;
    display: inline-block;
    vertical-align: middle;
    user-select: none;
}

.ms-filled {
    font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

/* Hero Security Diagram Animations */
@keyframes shieldPulse {
    0%, 100% { filter: drop-shadow(0 0 6px rgba(0, 120, 212, 0.5)); }
    50%       { filter: drop-shadow(0 0 18px rgba(0, 120, 212, 0.9)); }
}

@keyframes dashFlow {
    to { stroke-dashoffset: -24; }
}

@keyframes statusBlink {
    0%, 100% { opacity: 1; }
    50%       { opacity: 0.3; }
}

@keyframes orbitSpin {
    from { transform: rotate(0deg); transform-origin: 230px 192px; }
    to   { transform: rotate(360deg); transform-origin: 230px 192px; }
}

.shield-glow {
    animation: shieldPulse 3s ease-in-out infinite;
}

.dash-flow {
    stroke-dasharray: 6 6;
    animation: dashFlow 1.5s linear infinite;
}

.status-dot {
    animation: statusBlink 2s ease-in-out infinite;
}