/* roulang page: index */
:root {
      --brand-main: #104F55;
      --brand-dark: #0A2628;
      --brand-accent: #E78B43;
      --brand-paper: #F7F8F6;
      --brand-border: #E2E8F0;
      --brand-text: #2D3748;
      --brand-muted: #64748B;
    }
    html {
      scroll-behavior: smooth;
      font-family: system-ui, -apple-system, "PingFang SC", "Lantinghei SC", "Microsoft YaHei", sans-serif;
    }
    body {
      background-color: var(--brand-paper);
      color: var(--brand-text);
      overflow-x: hidden;
    }
    .custom-shadow {
      box-shadow: 0 10px 30px -5px rgba(16, 79, 85, 0.07);
    }
    .hover-float {
      transition: all 0.25s cubic-bezier(0.165, 0.84, 0.44, 1);
    }
    .hover-float:hover {
      transform: translateY(-4px);
      box-shadow: 0 18px 36px -8px rgba(16, 79, 85, 0.14);
    }
    .btn-touch {
      min-height: 44px;
      min-width: 44px;
    }
    .bg-pattern {
      background-color: #104F55;
      background-image: radial-gradient(#1e6b73 1px, transparent 1px);
      background-size: 24px 24px;
    }
    .active-option {
      border-color: #104F55;
      background-color: #f0f7f7;
    }