.material-symbols-outlined {
            font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
        }
        .ambient-glow-sm {
            box-shadow: 0 0 20px rgba(75, 226, 119, 0.05);
        }
        .technical-grid {
            background-image: radial-gradient(rgba(75, 226, 119, 0.05) 1px, transparent 1px);
            background-size: 40px 40px;
        }
        
        .falling-pattern-container {
            position: fixed;
            inset: 0;
            z-index: -1;
            pointer-events: none;
            background-color: rgb(var(--rr-background));
            overflow: hidden;
        }
        .falling-element {
            position: absolute;
            width: 1px;
            height: 80px;
            background: linear-gradient(180deg, transparent, rgba(75, 226, 119, 0.4), transparent);
            filter: blur(0.5px);
            animation: fall linear infinite;
        }
        @keyframes fall {
            from { transform: translateY(-100px); opacity: 0; }
            10% { opacity: 1; }
            90% { opacity: 1; }
            to { transform: translateY(110vh); opacity: 0; }
        }

        .card-glow-hover {
            transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
            position: relative;
        }
        .card-glow-hover:hover {
            transform: translateY(-8px);
            box-shadow: 0 10px 40px -10px rgba(75, 226, 119, 0.3);
            border-color: rgba(75, 226, 119, 0.5);
            background-color: rgb(var(--rr-surface-container) / 0.8);
        }

        .interactive-btn {
            position: relative;
            overflow: hidden;
            transition: all 0.3s ease;
        }
        .interactive-btn::after {
            content: '';
            position: absolute;
            top: 50%;
            left: 50%;
            width: 300%;
            height: 300%;
            background: rgba(255,255,255,0.1);
            transform: translate(-50%, -50%) scale(0);
            border-radius: 50%;
            transition: transform 0.6s ease;
        }
        .interactive-btn:active::after {
            transform: translate(-50%, -50%) scale(1);
        }

        .metric-bar-grow {
            width: 0%;
            transition: width 1.5s cubic-bezier(0.1, 0.5, 0.5, 1);
        }
        .metric-bar-grow.active {
            width: var(--target-width);
        }
        .code-float {
            animation: float 6s ease-in-out infinite;
        }
        @keyframes float {
            0%, 100% { transform: translateY(0); }
            50% { transform: translateY(-10px); }
        }
        
        .tech-accent {
            font-family: monospace;
            font-size: 10px;
            color: rgba(75, 226, 119, 0.3);
            letter-spacing: 0.1em;
            text-transform: uppercase;
        }

        .pop-accent-hover:hover .material-symbols-outlined {
            color: #4be277 !important;
            transform: scale(1.2);
        }

        .terminal-shell {
            isolation: isolate;
            background:
                linear-gradient(145deg, rgb(7 13 31), rgb(17 24 42) 58%, rgb(22 30 48)),
                radial-gradient(circle at 12% 0%, rgba(75, 226, 119, 0.08), transparent 28%);
            box-shadow:
                0 22px 54px -34px rgba(75, 226, 119, 0.46),
                0 18px 40px -28px rgba(0, 0, 0, 0.98),
                inset 0 1px 0 rgba(255, 255, 255, 0.12),
                inset 0 0 0 1px rgba(255, 255, 255, 0.035);
        }

        .terminal-shell::before {
            content: "";
            position: absolute;
            inset: 42px 0 auto 0;
            height: 1px;
            background: linear-gradient(90deg, transparent, rgba(75, 226, 119, 0.68), transparent);
            z-index: 2;
        }

        .terminal-shell::after {
            content: "";
            position: absolute;
            inset: 43px 0 0;
            z-index: -1;
            background:
                linear-gradient(rgba(255, 255, 255, 0.035) 1px, transparent 1px),
                linear-gradient(90deg, rgba(255, 255, 255, 0.03) 1px, transparent 1px);
            background-size: 100% 34px, 38px 100%;
            opacity: 0.2;
            mask-image: linear-gradient(180deg, black, transparent 92%);
        }

        .terminal-topline {
            color: rgb(var(--rr-on-background) / 0.86);
        }

        .terminal-body {
            counter-reset: terminal-line;
        }

        .terminal-line {
            display: grid;
            grid-template-columns: 4.9rem minmax(0, 1fr);
            gap: 0.9rem;
            align-items: start;
            min-height: 2.35rem;
            padding: 0.52rem 0;
            border-bottom: 1px solid rgba(255, 255, 255, 0.07);
        }

        .terminal-prompt {
            color: rgba(93, 255, 142, 0.96);
            font-family: "SFMono-Regular", "Cascadia Code", "Liberation Mono", "Consolas", monospace;
            font-size: clamp(0.72rem, 0.95vw, 0.8rem);
            font-weight: 700;
            letter-spacing: 0.04em;
            text-transform: uppercase;
            white-space: nowrap;
            text-rendering: geometricPrecision;
        }

        .terminal-code {
            color: rgb(246 249 255);
            font-family: "SFMono-Regular", "Cascadia Code", "Liberation Mono", "Consolas", monospace;
            font-size: clamp(0.88rem, 1.25vw, 1rem);
            font-weight: 600;
            line-height: 1.62;
            min-width: 0;
            overflow: visible;
            text-shadow: none;
            text-rendering: geometricPrecision;
            -webkit-font-smoothing: antialiased;
        }

        .terminal-text {
            display: inline-block;
            width: auto;
            max-width: 100%;
            overflow: visible;
            vertical-align: bottom;
            white-space: normal;
        }

        .terminal-text.is-typing::after {
            content: "";
            display: inline-block;
            width: 0.54em;
            height: 1.08em;
            margin-left: 0.16rem;
            transform: translateY(0.18em);
            background: rgb(var(--rr-primary));
            box-shadow: 0 0 8px rgba(75, 226, 119, 0.26);
            animation: terminalCursor 0.95s steps(1) infinite;
        }

        .terminal-command {
            color: rgb(238 245 255);
        }

        .terminal-success {
            color: rgb(126 255 166);
        }

        .terminal-muted {
            color: rgb(222 232 248);
        }

        .terminal-cursor {
            display: inline-block;
            width: 0.58em;
            height: 1.15em;
            margin-left: 0.18rem;
            transform: translateY(0.18em);
            background: rgb(var(--rr-primary));
            box-shadow: 0 0 8px rgba(75, 226, 119, 0.28);
            opacity: 0;
        }

        .terminal-cursor.is-ready {
            animation: terminalCursor 1.1s steps(1) infinite;
        }

        @keyframes terminalCursor {
            0%, 46% { opacity: 1; }
            47%, 100% { opacity: 0.18; }
        }

        .terminal-status-dot {
            box-shadow: 0 0 8px rgba(75, 226, 119, 0.38);
        }

        .terminal-microbar {
            background: linear-gradient(90deg, rgba(75, 226, 119, 0.22), rgba(93, 255, 142, 0.92), rgba(204, 224, 255, 0.58));
            transform-origin: left;
            animation: terminalBar 5.8s cubic-bezier(0.16, 1, 0.3, 1) infinite;
        }

        @keyframes terminalBar {
            0%, 12% { transform: scaleX(0.16); opacity: 0.55; }
            42%, 76% { transform: scaleX(1); opacity: 1; }
            100% { transform: scaleX(0.78); opacity: 0.72; }
        }

        .status-chip,
        .stack-chip {
            border: 1px solid rgba(75, 226, 119, 0.28);
            background: rgba(75, 226, 119, 0.08);
        }

        .stack-card,
        .flow-step {
            background:
                linear-gradient(180deg, rgb(var(--rr-surface-container) / 0.86), rgb(var(--rr-surface-container-low) / 0.72)),
                linear-gradient(90deg, rgba(75, 226, 119, 0.08), transparent 44%);
        }

        .stack-card::after,
        .flow-step::after {
            content: "";
            position: absolute;
            inset: auto 1rem 0 1rem;
            height: 1px;
            background: linear-gradient(90deg, transparent, rgba(75, 226, 119, 0.55), transparent);
            transform: scaleX(0);
            transition: transform 0.45s cubic-bezier(0.16, 1, 0.3, 1);
        }

        .stack-card:hover::after,
        .flow-step:hover::after {
            transform: scaleX(1);
        }

        .flow-rail {
            background: linear-gradient(90deg, rgba(75, 226, 119, 0.08), rgba(75, 226, 119, 0.55), rgba(75, 226, 119, 0.08));
        }

        .signal-icon {
            background: radial-gradient(circle, rgba(75, 226, 119, 0.22), rgba(75, 226, 119, 0.04) 58%, transparent 59%);
        }

        @media (max-width: 767px) {
            .terminal-line {
                grid-template-columns: 1fr;
                gap: 0.12rem;
                min-height: 2.1rem;
                padding: 0.45rem 0;
            }

            .terminal-line:nth-child(4),
            .terminal-line:nth-child(6) {
                display: none;
            }

            .terminal-code {
                font-size: 0.68rem;
            }

            .terminal-prompt {
                font-size: 0.58rem;
            }

            .terminal-text {
                width: auto;
                white-space: normal;
                animation: none;
            }
        }

        @media (prefers-reduced-motion: reduce) {
            .terminal-text,
            .terminal-microbar {
                animation: none !important;
            }

            .terminal-text {
                width: auto;
            }
        }

        /* FAQ Accordion Styles */
        .faq-accordion-item {
            overflow: hidden;
            background:
                linear-gradient(180deg, rgb(var(--rr-surface-container) / 0.9), rgb(var(--rr-surface-container-low) / 0.76)),
                linear-gradient(90deg, rgba(75, 226, 119, 0.07), transparent 42%);
        }
        .faq-accordion-content {
            max-height: 0;
            transition: max-height 0.22s cubic-bezier(0.22, 1, 0.36, 1);
        }
        .faq-accordion-item.active .faq-accordion-content {
            max-height: 1000px;
            transition: max-height 0.26s cubic-bezier(0.22, 1, 0.36, 1);
        }
        .faq-accordion-item .chevron-icon {
            transition: transform 0.18s ease;
        }
        .faq-accordion-item.active .chevron-icon {
            transform: rotate(180deg);
        }

        .faq-question-kicker {
            color: rgb(var(--rr-primary));
            font-family: "SFMono-Regular", "Cascadia Code", "Liberation Mono", "Consolas", monospace;
            font-size: 0.65rem;
            letter-spacing: 0.16em;
            text-transform: uppercase;
        }

        .faq-answer {
            border-top: 1px solid rgba(255, 255, 255, 0.07);
            color: rgb(210 220 238);
        }

        .faq-answer-label {
            color: rgb(var(--rr-primary));
            font-family: "SFMono-Regular", "Cascadia Code", "Liberation Mono", "Consolas", monospace;
            font-size: 0.68rem;
            letter-spacing: 0.12em;
            text-transform: uppercase;
        }
