/* roulang page: index */
:root {
        --color-primary: #0F243E;
        --color-accent: #C5A262;
        --color-bg-light: #F8FAFC;
        --color-text-main: #1E293B;
        --color-text-muted: #64748B;
        --color-border: #E2E8F0;
      }
      * {
        box-sizing: border-box;
        margin: 0;
        padding: 0;
      }
      body {
        font-family: system-ui, -apple-system, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
        line-height: 1.68;
        color: var(--color-text-main);
        background-color: var(--color-bg-light);
        -webkit-font-smoothing: antialiased;
      }
      .diagonal-hero {
        position: relative;
        overflow: hidden;
        background: linear-gradient(135deg, rgba(15, 36, 62, 0.94) 0%, rgba(10, 25, 47, 0.98) 100%), url('/assets/images/4d8e85fde6cdcfc9.webp') center/cover no-repeat;
        clip-path: polygon(0 0, 100% 0, 100% 92%, 0 100%);
      }
      @media (max-width: 768px) {
        .diagonal-hero {
          clip-path: polygon(0 0, 100% 0, 100% 96%, 0 100%);
        }
      }
      .card-hover {
        transition: transform 0.25s ease, box-shadow 0.25s ease;
      }
      .card-hover:hover {
        transform: translateY(-4px);
        box-shadow: 0 12px 24px -6px rgba(15, 36, 62, 0.12);
      }
      .accordion-content {
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.3s ease-out;
      }
      .accordion-item.active .accordion-content {
        max-height: 280px;
      }
      .accordion-item.active .chevron-icon {
        transform: rotate(180deg);
      }
      .scroll-container::-webkit-scrollbar {
        height: 6px;
      }
      .scroll-container::-webkit-scrollbar-thumb {
        background-color: #CBD5E1;
        border-radius: 9999px;
      }