﻿                        .fg-page { max-width: 960px; margin: 0 auto; padding: 32px 20px 48px; }
                        .fg-hero { text-align: center; margin-bottom: 40px; }
                        .fg-hero h1 {
                            font-size: 28px; font-weight: 800; letter-spacing: -0.03em;
                            color: #e7e9ea; margin: 0 0 10px;
                        }
                        body.theme-light .fg-hero h1 { color: #0f1419; }
                        .fg-hero p { font-size: 15px; color: #8b98a5; margin: 0; line-height: 1.6; }
                        .fg-grid {
                            display: grid;
                            grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
                            gap: 20px;
                        }
                        .fg-card {
                            background: rgba(22,24,28,0.85);
                            border: 1px solid rgba(255,255,255,0.07);
                            border-radius: 16px;
                            padding: 24px;
                            transition: transform .2s, border-color .2s, box-shadow .2s;
                            position: relative; overflow: hidden;
                        }
                        .fg-card::before {
                            content: ''; position: absolute; top: 0; left: 0; right: 0;
                            height: 3px; border-radius: 16px 16px 0 0;
                            background: var(--fg-accent); opacity: 0;
                            transition: opacity .2s;
                        }
                        .fg-card:hover {
                            transform: translateY(-4px);
                            border-color: rgba(29,155,240,0.2);
                            box-shadow: 0 12px 40px rgba(0,0,0,0.3);
                        }
                        .fg-card:hover::before { opacity: 1; }
                        body.theme-light .fg-card {
                            background: #fff;
                            border-color: #eff3f4;
                        }
                        body.theme-light .fg-card:hover {
                            box-shadow: 0 8px 24px rgba(15,23,42,0.08);
                        }
                        .fg-card-icon {
                            width: 44px; height: 44px; border-radius: 12px;
                            display: flex; align-items: center; justify-content: center;
                            font-size: 20px; margin-bottom: 16px;
                        }
                        .fg-card h3 {
                            font-size: 17px; font-weight: 700; color: #e7e9ea;
                            margin: 0 0 4px; display: flex; align-items: center; gap: 8px;
                        }
                        body.theme-light .fg-card h3 { color: #0f1419; }
                        .fg-tag {
                            font-size: 10px; font-weight: 700; text-transform: uppercase;
                            letter-spacing: 0.5px; padding: 2px 7px; border-radius: 5px;
                        }
                        .fg-tag-pro { background: rgba(234,179,8,0.15); color: #eab308; }
                        .fg-tag-ai { background: rgba(168,85,247,0.15); color: #a855f7; }
                        .fg-tag-adv { background: rgba(59,130,246,0.15); color: #3b82f6; }
                        .fg-tag-ess { background: rgba(34,197,94,0.15); color: #22c55e; }
                        .fg-tag-risk { background: rgba(239,68,68,0.15); color: #ef4444; }
                        .fg-tag-vis { background: rgba(236,72,153,0.15); color: #ec4899; }
                        .fg-tag-beta { background: rgba(124,77,255,0.15); color: #7c4dff; }
                        .fg-card p {
                            font-size: 14px; line-height: 1.6; color: #8b98a5; margin: 10px 0 0;
                        }
                        body.theme-light .fg-card p { color: #536471; }
