/* roulang page: index */
:root {
            --primary: #4F46E5;
            --primary-hover: #4338CA;
            --dark: #0F172A;
            --text-main: #1E293B;
            --text-sub: #64748B;
            --border: #E2E8F0;
            --bg-alt: #F8FAFC;
        }
        * { box-sizing: border-box; }
        body { color: var(--text-main); background-color: #FFFFFF; }
        .bento-card {
            transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
        }
        .bento-card:hover {
            transform: translateY(-4px);
            box-shadow: 0 12px 24px -10px rgba(15, 23, 42, 0.08);
            border-color: #CBD5E1;
        }
        details summary::-webkit-details-marker { display: none; }
        details[open] summary svg { transform: rotate(180deg); }