.material-symbols-outlined {
            font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
            vertical-align: middle;
        }
        .bg-grid-pattern {
            background-image: radial-gradient(#0F2A4A10 1px, transparent 1px);
            background-size: 20px 20px;
        }
        .bg-paper-texture {
            background-image: url("https://www.transparenttextures.com/patterns/p6.png");
        }
        .clip-slant {
            clip-path: polygon(0 0, 100% 0, 100% 90%, 0 100%);
        }
        .circular-gauge {
            --percentage: 0;
            width: 120px;
            height: 120px;
            border-radius: 50%;
            background: radial-gradient(closest-side, #0F2A4A 79%, transparent 80% 100%),
                        conic-gradient(var(--color) calc(var(--percentage) * 1%), #ffffff20 0);
        }
        .custom-mask-1 {
            clip-path: polygon(10% 0%, 100% 0%, 90% 100%, 0% 100%);
        }
        .custom-mask-2 {
            clip-path: polygon(0 15%, 100% 0, 100% 85%, 0 100%);
        }

.material-symbols-outlined {
            font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
        }
        .step-line::before {
            content: '';
            position: absolute;
            left: 20px;
            top: 40px;
            bottom: -20px;
            width: 2px;
            background: #e1e3e4;
        }
        .last-step-line::before {
            display: none;
        }

.material-symbols-outlined {
            font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
        }
        .bento-card {
            transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.3s ease;
        }
        .bento-card:hover {
            transform: translateY(-8px);
            box-shadow: 0px 12px 30px rgba(15, 42, 74, 0.12);
        }
        .glass-nav {
            backdrop-filter: blur(12px);
            background: rgba(248, 249, 250, 0.85);
        }

.material-symbols-outlined {
            font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 48;
        }
        .text-shadow-subtle {
            text-shadow: 0 2px 4px rgba(15, 42, 74, 0.1);
        }
        .bento-grid {
            display: grid;
            grid-template-columns: repeat(12, 1fr);
            gap: 24px;
        }

.material-symbols-outlined {
            font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
            display: inline-block;
            vertical-align: middle;
        }
        .hero-pattern {
            background-image: radial-gradient(circle at 2px 2px, rgba(15, 42, 74, 0.05) 1px, transparent 0);
            background-size: 32px 32px;
        }

.material-symbols-outlined {
            font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
        }
        .bento-card-gradient {
            background: linear-gradient(135deg, rgba(255,255,255,1) 0%, rgba(248,249,250,1) 100%);
        }
        .text-glow-navy {
            text-shadow: 0 0 20px rgba(15, 42, 74, 0.15);
        }