/* roulang page: index */
:root {
            --brand-primary: #0284c7;
            --brand-deep: #1e40af;
            --brand-teal: #0d9488;
            --brand-amber: #f59e0b;
        }
        .custom-card-shadow {
            box-shadow: 0 10px 30px -5px rgba(2, 132, 199, 0.08), 0 4px 6px -2px rgba(0, 0, 0, 0.03);
        }
        .custom-card-shadow:hover {
            box-shadow: 0 20px 35px -5px rgba(2, 132, 199, 0.16), 0 8px 10px -3px rgba(0, 0, 0, 0.05);
        }
        .text-gradient {
            background: linear-gradient(135deg, #0284c7 0%, #1e40af 100%);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
        }
        .bg-grid-pattern {
            background-size: 40px 40px;
            background-image: 
                linear-gradient(to right, rgba(255, 255, 255, 0.05) 1px, transparent 1px),
                linear-gradient(to bottom, rgba(255, 255, 255, 0.05) 1px, transparent 1px);
        }