/* roulang page: index */
:root {
            --color-primary: #14261c;
            --color-secondary: #c59a49;
            --color-accent: #233d2f;
            --color-bg-light: #f8f6f0;
            --color-border: #e2dbcb;
            --color-text-main: #1f2923;
            --color-text-muted: #5e6b63;
        }
        body {
            background-color: var(--color-bg-light);
            color: var(--color-text-main);
            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
            -webkit-font-smoothing: antialiased;
        }
        .tea-hero-pattern {
            background-image: linear-gradient(rgba(20, 38, 28, 0.82), rgba(20, 38, 28, 0.90)), url('/assets/images/4e34eedd1aa2aab7.webp');
            background-size: cover;
            background-position: center;
        }
        .tea-banner-bg {
            background-image: linear-gradient(rgba(20, 38, 28, 0.88), rgba(20, 38, 28, 0.88)), url('/assets/images/588650d7241bce53.webp');
            background-size: cover;
            background-position: center;
        }
        .nav-grid-icon:hover {
            transform: translateY(-2px);
            box-shadow: 0 4px 12px rgba(197, 154, 73, 0.15);
        }
        .card-tea-hover {
            transition: all 0.25s ease-in-out;
        }
        .card-tea-hover:hover {
            transform: translateY(-3px);
            border-color: #c59a49;
            box-shadow: 0 10px 24px -6px rgba(20, 38, 28, 0.08);
        }

/* roulang page: category1 */
:root {
      --color-primary: #14261c;
      --color-secondary: #c59a49;
      --color-accent: #233d2f;
      --color-bg-light: #f8f6f0;
      --color-border: #e2dbcb;
      --color-text-main: #1f2923;
      --color-text-muted: #5e6b63;
    }
    body {
      background-color: var(--color-bg-light);
      color: var(--color-text-main);
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
      -webkit-font-smoothing: antialiased;
    }
    .tea-hero-pattern {
      background-image: linear-gradient(rgba(20, 38, 28, 0.88), rgba(20, 38, 28, 0.94)), url('/assets/images/4e34eedd1aa2aab7.webp');
      background-size: cover;
      background-position: center;
    }
    .tea-banner-bg {
      background-image: linear-gradient(rgba(20, 38, 28, 0.88), rgba(20, 38, 28, 0.88)), url('/assets/images/588650d7241bce53.webp');
      background-size: cover;
      background-position: center;
    }
    .nav-grid-icon:hover {
      transform: translateY(-2px);
      box-shadow: 0 4px 12px rgba(197, 154, 73, 0.15);
    }
    .card-tea-hover {
      transition: all 0.25s ease-in-out;
    }
    .card-tea-hover:hover {
      transform: translateY(-3px);
      border-color: #c59a49;
      box-shadow: 0 10px 24px -6px rgba(20, 38, 28, 0.08);
    }
    /* 优惠券票面撕裂边框效果 */
    .coupon-ticket {
      position: relative;
      background: radial-gradient(circle at left, transparent 10px, #ffffff 11px) left,
                  radial-gradient(circle at right, transparent 10px, #ffffff 11px) right;
      background-size: 51% 100%;
      background-repeat: no-repeat;
    }
    .coupon-ticket-dark {
      position: relative;
      background: radial-gradient(circle at left, #14261c 10px, #1c3326 11px) left,
                  radial-gradient(circle at right, #14261c 10px, #1c3326 11px) right;
      background-size: 51% 100%;
      background-repeat: no-repeat;
    }
    .dash-line-vert {
      border-left: 2px dashed #d8cfbe;
    }