/* roulang page: index */
:root {
            --primary: #0F4C3A;
            --primary-hover: #0b392b;
            --accent: #E87A5D;
            --accent-hover: #d26549;
            --bg-warm: #F9F9F7;
            --bg-card: #FFFFFF;
            --bg-dark: #1A211E;
            --text-heading: #121A16;
            --text-body: #4A5550;
            --text-muted: #8C9A93;
            --border-light: rgba(15, 76, 58, 0.08);
            --shadow-subtle: 0 10px 30px -10px rgba(15, 76, 58, 0.06);
        }
        body {
            font-family: -apple-system, "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
            background-color: var(--bg-warm);
            color: var(--text-body);
            overflow-x: hidden;
            scroll-behavior: smooth;
        }
        .container-custom {
            max-width: 1280px;
            margin-left: auto;
            margin-right: auto;
            padding-left: 1.25rem;
            padding-right: 1.25rem;
        }
        .bg-primary-custom { background-color: var(--primary); }
        .bg-accent-custom { background-color: var(--accent); }
        .text-primary-custom { color: var(--primary); }
        .text-accent-custom { color: var(--accent); }
        .border-custom { border-color: var(--border-light); }
        .shadow-soft { box-shadow: var(--shadow-subtle); }
        .transition-base { transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1); }
        .card-hover:hover {
            transform: translateY(-3px);
            box-shadow: 0 15px 35px -10px rgba(15, 76, 58, 0.12);
        }