/* roulang page: index */
:root {
        --color-brand-blue: #1A56DB;
        --color-brand-orange: #F97316;
        --color-accent-green: #10B981;
        --color-accent-amber: #F59E0B;
        --color-slate-title: #0F172A;
        --color-slate-body: #334155;
        --color-slate-muted: #64748B;
        --color-bg-base: #F8FAFC;
        --color-card-bg: #FFFFFF;
      }
      body {
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
        background-color: var(--color-bg-base);
        color: var(--color-slate-body);
        -webkit-font-smoothing: antialiased;
      }
      .badge-glow {
        box-shadow: 0 0 15px rgba(249, 115, 22, 0.35);
      }
      .custom-card-shadow {
        box-shadow: 0 4px 20px -2px rgba(15, 23, 42, 0.06), 0 2px 6px -1px rgba(15, 23, 42, 0.04);
      }
      .custom-card-shadow:hover {
        box-shadow: 0 20px 25px -5px rgba(15, 23, 42, 0.1), 0 10px 10px -5px rgba(15, 23, 42, 0.04);
      }
      .hero-grid-pattern {
        background-size: 32px 32px;
        background-image: linear-gradient(to right, rgba(226, 232, 240, 0.4) 1px, transparent 1px),
                          linear-gradient(to bottom, rgba(226, 232, 240, 0.4) 1px, transparent 1px);
      }