/* roulang page: index */
:root {
      --color-primary: #0D5C58;
      --color-primary-dark: #082B29;
      --color-accent: #E07A5F;
      --color-accent-hover: #c9654b;
      --color-bg-light: #F8F7F4;
      --color-text-main: #23272A;
      --color-text-sub: #5A626A;
      --color-border: #E5E7EB;
    }
    body {
      font-family: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "WenQuanYi Micro Hei", sans-serif;
      color: var(--color-text-main);
      background-color: var(--color-bg-light);
      scroll-behavior: smooth;
    }
    .text-primary { color: var(--color-primary); }
    .bg-primary { background-color: var(--color-primary); }
    .bg-primary-dark { background-color: var(--color-primary-dark); }
    .text-accent { color: var(--color-accent); }
    .bg-accent { background-color: var(--color-accent); }
    .border-primary { border-color: var(--color-primary); }
    .hover-bg-accent:hover { background-color: var(--color-accent-hover); }
    .hero-bg {
      background-image: linear-gradient(rgba(8, 43, 41, 0.88), rgba(13, 92, 88, 0.85)), url('/assets/images/f9ddeca17f3c8e5a.webp');
      background-size: cover;
      background-position: center;
    }
    .dark-section-bg {
      background-image: linear-gradient(rgba(8, 43, 41, 0.95), rgba(8, 43, 41, 0.98)), url('/assets/images/1a44f8bcc14350a3.webp');
      background-size: cover;
      background-position: center;
    }
    .custom-scroll::-webkit-scrollbar {
      width: 6px;
    }
    .custom-scroll::-webkit-scrollbar-thumb {
      background-color: #cbd5e1;
      border-radius: 4px;
    }