/* roulang page: index */
:root {
            --brand-primary: #C4542B;
            --brand-primary-dark: #A84420;
            --brand-primary-light: #E07A4F;
            --brand-secondary: #2E3E42;
            --brand-secondary-dark: #1E2A2C;
            --brand-bg: #F9F6F1;
            --brand-surface: #FFFFFF;
            --brand-text: #2B2B2B;
            --brand-text-muted: #6B6B6B;
            --brand-text-light: #A8A8A8;
            --brand-border: #E8E2D8;
            --brand-accent: #D4A24E;
            --brand-success: #4A8B5C;
            --brand-radius: 14px;
            --brand-radius-sm: 8px;
            --brand-radius-lg: 20px;
            --brand-shadow: 0 4px 20px rgba(0,0,0,0.06);
            --brand-shadow-hover: 0 12px 36px rgba(0,0,0,0.1);
            --brand-transition: all 0.25s ease;
            --brand-font: "PingFang SC","Microsoft YaHei","Helvetica Neue",sans-serif;
        }
        *,*::before,*::after{box-sizing:border-box;}
        html{scroll-behavior:smooth;}
        body{
            font-family:var(--brand-font);
            background-color:var(--brand-bg);
            color:var(--brand-text);
            line-height:1.7;
            margin:0;
            padding:0;
            -webkit-font-smoothing:antialiased;
        }
        a{text-decoration:none;color:inherit;}
        a:hover{color:var(--brand-primary);}
        img{max-width:100%;height:auto;}
        .site-wrapper{overflow-x:hidden;}

        /* Header & Nav */
        .site-header{
            background:rgba(249,246,241,0.95);
            backdrop-filter:blur(16px);
            -webkit-backdrop-filter:blur(16px);
            border-bottom:1px solid var(--brand-border);
            padding:0.6rem 0;
            position:sticky;
            top:0;
            z-index:1050;
            box-shadow:0 1px 12px rgba(0,0,0,0.03);
        }
        .site-header .navbar-brand{
            font-weight:700;
            font-size:1.35rem;
            color:var(--brand-secondary-dark);
            display:flex;
            align-items:center;
            gap:0.5rem;
            letter-spacing:0.02em;
        }
        .site-header .navbar-brand .brand-icon{
            width:38px;height:38px;
            background:var(--brand-primary);
            border-radius:10px;
            display:inline-flex;
            align-items:center;
            justify-content:center;
            color:#fff;
            font-size:1.1rem;
            flex-shrink:0;
        }
        .navbar-custom .nav-link{
            color:var(--brand-text);
            font-weight:500;
            font-size:1rem;
            padding:0.5rem 1rem;
            position:relative;
            transition:var(--brand-transition);
        }
        .navbar-custom .nav-link:hover,
        .navbar-custom .nav-link:focus{
            color:var(--brand-primary);
        }
        .navbar-custom .nav-link.active{
            color:var(--brand-primary);
            font-weight:600;
        }
        .navbar-custom .nav-link.active::after{
            content:'';
            position:absolute;
            bottom:0.2rem;
            left:1rem;
            right:1rem;
            height:2px;
            background:var(--brand-primary);
            border-radius:2px;
        }
        .activity-chips{
            display:flex;
            align-items:center;
            gap:0.45rem;
            margin-left:1.25rem;
            flex-wrap:wrap;
        }
        .activity-chip{
            font-size:0.72rem;
            font-weight:600;
            padding:0.28rem 0.7rem;
            border-radius:20px;
            letter-spacing:0.03em;
            white-space:nowrap;
        }
        .chip-warm{background:#FFF0E5;color:#C4542B;border:1px solid #F5D5C2;}
        .chip-live{background:#E8F4EB;color:#3E7D4E;border:1px solid #C4DDCA;}
        .chip-replay{background:#EEF0F5;color:#5A6A7A;border:1px solid #D5D9E2;}
        .navbar-toggler{
            border:1px solid var(--brand-border);
            border-radius:8px;
            padding:0.4rem 0.7rem;
            font-size:1.2rem;
            color:var(--brand-text);
        }
        .navbar-toggler:focus{
            box-shadow:0 0 0 3px rgba(196,84,43,0.15);
            outline:none;
        }
        @media (max-width: 991.98px){
            .activity-chips{margin-left:0;margin-top:0.5rem;}
            .navbar-custom .nav-link.active::after{display:none;}
            .navbar-custom .nav-link{padding:0.45rem 0.75rem;}
        }

        /* Hero */
        .hero-section{
            background:linear-gradient(160deg,#1E2A2C 0%,#2E3E42 45%,#3A4A4E 100%);
            color:#fff;
            padding:5rem 0 5.5rem;
            position:relative;
            overflow:hidden;
        }
        .hero-section::before{
            content:'';
            position:absolute;
            top:-30%;
            right:-10%;
            width:60%;
            height:150%;
            background:radial-gradient(ellipse at center,rgba(196,84,43,0.22) 0%,transparent 65%);
            pointer-events:none;
        }
        .hero-section::after{
            content:'';
            position:absolute;
            bottom:-12%;
            left:-5%;
            width:45%;
            height:60%;
            background:radial-gradient(ellipse at center,rgba(212,162,78,0.12) 0%,transparent 60%);
            pointer-events:none;
        }
        .hero-content{
            position:relative;
            z-index:2;
        }
        .hero-badge{
            display:inline-block;
            background:rgba(196,84,43,0.3);
            color:#FFD9C7;
            font-size:0.82rem;
            font-weight:600;
            padding:0.4rem 1.1rem;
            border-radius:30px;
            border:1px solid rgba(255,255,255,0.15);
            letter-spacing:0.03em;
            margin-bottom:1.3rem;
        }
        .hero-title{
            font-size:2.8rem;
            font-weight:800;
            line-height:1.25;
            margin-bottom:1.2rem;
            letter-spacing:0.01em;
        }
        .hero-title .highlight{
            color:var(--brand-primary-light);
            position:relative;
        }
        .hero-desc{
            font-size:1.05rem;
            color:rgba(255,255,255,0.75);
            max-width:600px;
            line-height:1.85;
            margin-bottom:1.8rem;
        }
        .hero-cta{
            display:flex;
            gap:0.8rem;
            flex-wrap:wrap;
        }
        .btn-brand{
            background:var(--brand-primary);
            color:#fff;
            font-weight:600;
            padding:0.75rem 2rem;
            border-radius:30px;
            border:none;
            transition:var(--brand-transition);
            box-shadow:0 4px 18px rgba(196,84,43,0.35);
            font-size:0.98rem;
        }
        .btn-brand:hover,
        .btn-brand:focus{
            background:var(--brand-primary-dark);
            box-shadow:0 8px 28px rgba(196,84,43,0.45);
            transform:translateY(-2px);
            color:#fff;
        }
        .btn-outline-light-custom{
            background:rgba(255,255,255,0.08);
            color:#fff;
            font-weight:600;
            padding:0.75rem 2rem;
            border-radius:30px;
            border:1px solid rgba(255,255,255,0.30);
            transition:var(--brand-transition);
            font-size:0.98rem;
        }
        .btn-outline-light-custom:hover,
        .btn-outline-light-custom:focus{
            background:rgba(255,255,255,0.18);
            border-color:rgba(255,255,255,0.5);
            color:#fff;
            transform:translateY(-2px);
        }
        .hero-stats{
            display:flex;
            gap:1.8rem;
            margin-top:2rem;
            flex-wrap:wrap;
        }
        .hero-stat{
            text-align:left;
        }
        .hero-stat-num{
            font-size:1.8rem;
            font-weight:800;
            color:#fff;
            line-height:1.2;
        }
        .hero-stat-label{
            font-size:0.82rem;
            color:rgba(255,255,255,0.55);
        }
        .hero-panel{
            background:rgba(255,255,255,0.06);
            border:1px solid rgba(255,255,255,0.12);
            border-radius:var(--brand-radius-lg);
            padding:1.75rem 1.5rem;
            backdrop-filter:blur(10px);
            -webkit-backdrop-filter:blur(10px);
            position:relative;
            z-index:2;
        }
        .panel-title{
            font-size:0.88rem;
            font-weight:600;
            color:rgba(255,255,255,0.7);
            letter-spacing:0.05em;
            margin-bottom:1rem;
        }
        .panel-list{
            list-style:none;
            margin:0;
            padding:0;
        }
        .panel-list li{
            display:flex;
            align-items:center;
            gap:0.7rem;
            padding:0.65rem 0;
            border-bottom:1px solid rgba(255,255,255,0.08);
            font-size:0.9rem;
            color:rgba(255,255,255,0.8);
        }
        .panel-list li:last-child{border-bottom:none;}
        .panel-list .rank{
            width:26px;height:26px;
            border-radius:50%;
            background:rgba(255,255,255,0.12);
            display:inline-flex;
            align-items:center;
            justify-content:center;
            font-size:0.72rem;
            font-weight:700;
            flex-shrink:0;
            color:#fff;
        }
        .panel-list .rank.hot{
            background:var(--brand-primary);
        }
        @media (max-width: 991.98px){
            .hero-title{font-size:2.1rem;}
            .hero-section{padding:3.5rem 0 4rem;}
            .hero-panel{margin-top:2rem;}
            .hero-desc{font-size:0.98rem;}
        }
        @media (max-width: 575.98px){
            .hero-title{font-size:1.7rem;}
            .hero-stats{gap:1rem;}
            .hero-stat-num{font-size:1.4rem;}
            .hero-cta .btn{padding:0.6rem 1.4rem;font-size:0.9rem;}
        }

        /* Section Shared */
        .section-block{padding:4.5rem 0;}
        .section-block.alt-bg{background:#F0EBE3;}
        .section-block.dark-bg{background:var(--brand-secondary-dark);color:#fff;}
        .section-tag{
            display:inline-block;
            font-size:0.78rem;
            font-weight:700;
            letter-spacing:0.08em;
            text-transform:uppercase;
            color:var(--brand-primary);
            margin-bottom:0.7rem;
        }
        .section-title{
            font-size:2rem;
            font-weight:700;
            margin-bottom:1rem;
            line-height:1.3;
        }
        .section-desc{
            font-size:1rem;
            color:var(--brand-text-muted);
            max-width:720px;
            line-height:1.8;
        }
        .dark-bg .section-title{color:#fff;}
        .dark-bg .section-desc{color:rgba(255,255,255,0.65);}
        .dark-bg .section-tag{color:var(--brand-primary-light);}

        /* 优惠阶梯 */
        .ladder-wrap{
            display:flex;
            flex-direction:column;
            gap:1.2rem;
        }
        .ladder-item{
            background:var(--brand-surface);
            border-radius:var(--brand-radius);
            border:1px solid var(--brand-border);
            padding:1.5rem 1.75rem;
            display:flex;
            align-items:center;
            gap:1.25rem;
            transition:var(--brand-transition);
            position:relative;
            box-shadow:var(--brand-shadow);
        }
        .ladder-item:hover{
            box-shadow:var(--brand-shadow-hover);
            transform:translateY(-2px);
            border-color:var(--brand-primary-light);
        }
        .ladder-step{
            width:46px;height:46px;
            border-radius:50%;
            background:var(--brand-bg);
            display:flex;
            align-items:center;
            justify-content:center;
            font-weight:800;
            font-size:1.1rem;
            color:var(--brand-primary);
            flex-shrink:0;
            border:2px solid var(--brand-primary);
        }
        .ladder-item:nth-child(2) .ladder-step{
            background:var(--brand-primary);
            color:#fff;
            border-color:var(--brand-primary);
        }
        .ladder-item:nth-child(3) .ladder-step{
            background:var(--brand-secondary);
            color:#fff;
            border-color:var(--brand-secondary);
        }
        .ladder-info{flex:1;}
        .ladder-name{
            font-weight:700;
            font-size:1.1rem;
            margin-bottom:0.3rem;
        }
        .ladder-desc{
            font-size:0.9rem;
            color:var(--brand-text-muted);
            margin-bottom:0;
        }
        .ladder-bonus{
            font-size:0.9rem;
            font-weight:600;
            color:var(--brand-primary);
            white-space:nowrap;
        }
        @media (max-width: 767.98px){
            .ladder-item{flex-direction:column;align-items:flex-start;padding:1.2rem;}
            .ladder-bonus{white-space:normal;}
        }

        /* 套餐对比 */
        .plan-card{
            background:var(--brand-surface);
            border-radius:var(--brand-radius-lg);
            border:1px solid var(--brand-border);
            padding:2rem 1.75rem;
            height:100%;
            display:flex;
            flex-direction:column;
            transition:var(--brand-transition);
            position:relative;
            box-shadow:var(--brand-shadow);
        }
        .plan-card:hover{
            box-shadow:var(--brand-shadow-hover);
            transform:translateY(-4px);
        }
        .plan-card.recommended{
            border:2px solid var(--brand-primary);
            background:linear-gradient(180deg,#FFFDFC 0%,#FFF8F5 100%);
        }
        .plan-badge{
            position:absolute;
            top:-12px;
            left:50%;
            transform:translateX(-50%);
            background:var(--brand-primary);
            color:#fff;
            font-size:0.75rem;
            font-weight:700;
            padding:0.3rem 1.2rem;
            border-radius:20px;
            letter-spacing:0.05em;
            white-space:nowrap;
        }
        .plan-name{
            font-size:1.25rem;
            font-weight:700;
            margin-bottom:0.5rem;
            text-align:center;
        }
        .plan-price{
            text-align:center;
            font-size:2.3rem;
            font-weight:800;
            color:var(--brand-primary);
            margin-bottom:0.4rem;
        }
        .plan-price small{
            font-size:0.9rem;
            font-weight:500;
            color:var(--brand-text-muted);
        }
        .plan-desc{
            text-align:center;
            font-size:0.88rem;
            color:var(--brand-text-muted);
            margin-bottom:1.5rem;
        }
        .plan-features{
            list-style:none;
            margin:0 0 1.5rem;
            padding:0;
            flex:1;
        }
        .plan-features li{
            padding:0.45rem 0;
            font-size:0.9rem;
            color:var(--brand-text);
            display:flex;
            align-items:flex-start;
            gap:0.6rem;
        }
        .plan-features li i{
            color:var(--brand-success);
            margin-top:0.25rem;
            flex-shrink:0;
        }
        .plan-features li.disabled{
            color:var(--brand-text-light);
        }
        .plan-features li.disabled i{
            color:#D0D0D0;
        }
        .btn-plan{
            width:100%;
            padding:0.7rem 1.2rem;
            border-radius:30px;
            font-weight:600;
            border:1px solid var(--brand-primary);
            background:transparent;
            color:var(--brand-primary);
            transition:var(--brand-transition);
            text-align:center;
            font-size:0.95rem;
        }
        .btn-plan:hover{
            background:var(--brand-primary);
            color:#fff;
            transform:translateY(-2px);
            box-shadow:0 6px 20px rgba(196,84,43,0.3);
        }
        .plan-card.recommended .btn-plan{
            background:var(--brand-primary);
            color:#fff;
            border-color:var(--brand-primary);
        }
        .plan-card.recommended .btn-plan:hover{
            background:var(--brand-primary-dark);
            box-shadow:0 8px 24px rgba(196,84,43,0.4);
            transform:translateY(-2px);
        }

        /* 保障条 */
        .assurance-card{
            background:var(--brand-surface);
            border-radius:var(--brand-radius);
            border:1px solid var(--brand-border);
            padding:1.4rem 1.25rem;
            display:flex;
            align-items:flex-start;
            gap:0.9rem;
            height:100%;
            transition:var(--brand-transition);
            box-shadow:var(--brand-shadow);
        }
        .assurance-card:hover{
            box-shadow:var(--brand-shadow-hover);
            transform:translateY(-3px);
        }
        .assurance-icon{
            width:40px;height:40px;
            border-radius:10px;
            background:var(--brand-bg);
            display:flex;
            align-items:center;
            justify-content:center;
            color:var(--brand-primary);
            font-size:1.15rem;
            flex-shrink:0;
        }
        .assurance-title{
            font-weight:600;
            font-size:0.98rem;
            margin-bottom:0.3rem;
        }
        .assurance-desc{
            font-size:0.83rem;
            color:var(--brand-text-muted);
            margin-bottom:0;
            line-height:1.6;
        }
        .policy-note{
            background:var(--brand-bg);
            border-radius:var(--brand-radius);
            padding:1.5rem 1.75rem;
            margin-top:2rem;
            border-left:4px solid var(--brand-accent);
            font-size:0.9rem;
            color:var(--brand-text-muted);
            line-height:1.8;
        }

        /* 资讯 */
        .news-left{
            background:var(--brand-surface);
            border-radius:var(--brand-radius-lg);
            border:1px solid var(--brand-border);
            padding:1.5rem 1.75rem;
            box-shadow:var(--brand-shadow);
        }
        .news-left .news-title{
            font-weight:600;
            font-size:1.1rem;
            margin-bottom:1.1rem;
            padding-bottom:0.7rem;
            border-bottom:1px solid var(--brand-border);
        }
        .news-link-list{
            list-style:none;
            margin:0;
            padding:0;
        }
        .news-link-list li{
            padding:0.75rem 0;
            border-bottom:1px solid #F5F0E8;
            transition:var(--brand-transition);
        }
        .news-link-list li:last-child{border-bottom:none;}
        .news-link-list a{
            display:flex;
            align-items:flex-start;
            gap:0.75rem;
            color:var(--brand-text);
            font-size:0.92rem;
            line-height:1.55;
            transition:var(--brand-transition);
        }
        .news-link-list a:hover{
            color:var(--brand-primary);
        }
        .news-cat{
            font-size:0.72rem;
            font-weight:600;
            color:var(--brand-primary);
            background:#FFF0E5;
            padding:0.2rem 0.6rem;
            border-radius:4px;
            white-space:nowrap;
            flex-shrink:0;
            margin-top:0.15rem;
        }
        .news-cat.cat-green{color:#3E7D4E;background:#E8F4EB;}
        .news-cat.cat-blue{color:#4A6FA5;background:#E8EFF7;}
        .news-right .recommend-card{
            background:var(--brand-surface);
            border-radius:var(--brand-radius-lg);
            overflow:hidden;
            border:1px solid var(--brand-border);
            transition:var(--brand-transition);
            box-shadow:var(--brand-shadow);
            height:100%;
        }
        .news-right .recommend-card:hover{
            box-shadow:var(--brand-shadow-hover);
            transform:translateY(-3px);
        }
        .recommend-card img{
            width:100%;
            height:180px;
            object-fit:cover;
            display:block;
        }
        .recommend-body{
            padding:1.2rem 1.3rem;
        }
        .recommend-body h5{
            font-size:0.98rem;
            font-weight:700;
            margin-bottom:0.4rem;
            line-height:1.5;
        }
        .recommend-body p{
            font-size:0.82rem;
            color:var(--brand-text-muted);
            margin-bottom:0;
            line-height:1.6;
        }

        /* 限时入口 */
        .flash-section{
            background:linear-gradient(135deg,#1E2A2C 0%,#3A2E28 50%,#5A3A28 100%);
            color:#fff;
            border-radius:var(--brand-radius-lg);
            padding:3rem 2.5rem;
            position:relative;
            overflow:hidden;
        }
        .flash-section::after{
            content:'';
            position:absolute;
            top:-40%;
            right:-20%;
            width:55%;
            height:180%;
            background:radial-gradient(ellipse at center,rgba(196,84,43,0.30) 0%,transparent 65%);
            pointer-events:none;
        }
        .flash-title{
            font-size:1.8rem;
            font-weight:800;
            margin-bottom:0.8rem;
            position:relative;
            z-index:2;
        }
        .flash-desc{
            font-size:0.98rem;
            color:rgba(255,255,255,0.7);
            max-width:560px;
            line-height:1.75;
            position:relative;
            z-index:2;
        }
        .flash-count{
            display:flex;
            gap:0.8rem;
            margin-top:1.2rem;
            position:relative;
            z-index:2;
        }
        .flash-count-item{
            background:rgba(255,255,255,0.1);
            border:1px solid rgba(255,255,255,0.2);
            border-radius:10px;
            padding:0.5rem 0.9rem;
            text-align:center;
            min-width:56px;
        }
        .flash-count-num{
            font-size:1.4rem;
            font-weight:800;
            color:#fff;
        }
        .flash-count-label{
            font-size:0.7rem;
            color:rgba(255,255,255,0.55);
        }
        .btn-flash{
            background:var(--brand-primary);
            color:#fff;
            font-weight:700;
            padding:0.85rem 2.2rem;
            border-radius:30px;
            border:none;
            transition:var(--brand-transition);
            font-size:1rem;
            position:relative;
            z-index:2;
            box-shadow:0 6px 24px rgba(196,84,43,0.4);
        }
        .btn-flash:hover{
            background:var(--brand-primary-dark);
            transform:translateY(-2px);
            box-shadow:0 10px 32px rgba(196,84,43,0.5);
            color:#fff;
        }
        @media (max-width: 767.98px){
            .flash-section{padding:2rem 1.5rem;}
            .flash-title{font-size:1.4rem;}
            .flash-count-item{min-width:46px;padding:0.4rem 0.6rem;}
            .flash-count-num{font-size:1.1rem;}
        }

        /* Footer */
        .site-footer{
            background:var(--brand-secondary-dark);
            color:rgba(255,255,255,0.75);
            padding:3.5rem 0 2rem;
        }
        .footer-brand{
            font-size:1.3rem;
            font-weight:700;
            color:#fff;
            display:flex;
            align-items:center;
            gap:0.6rem;
            margin-bottom:0.8rem;
        }
        .footer-brand .brand-icon{
            width:32px;height:32px;
            background:var(--brand-primary);
            border-radius:8px;
            display:inline-flex;
            align-items:center;
            justify-content:center;
            font-size:0.85rem;
            color:#fff;
        }
        .footer-desc{
            font-size:0.85rem;
            color:rgba(255,255,255,0.5);
            max-width:400px;
            line-height:1.7;
            margin-bottom:1.2rem;
        }
        .footer-links{
            list-style:none;
            margin:0;
            padding:0;
        }
        .footer-links li{
            padding:0.3rem 0;
        }
        .footer-links a{
            color:rgba(255,255,255,0.6);
            font-size:0.88rem;
            transition:var(--brand-transition);
        }
        .footer-links a:hover{
            color:#fff;
        }
        .footer-bottom{
            border-top:1px solid rgba(255,255,255,0.1);
            margin-top:2.2rem;
            padding-top:1.4rem;
            font-size:0.78rem;
            color:rgba(255,255,255,0.4);
            text-align:center;
        }

        /* 底部固定转化条 */
        .fixed-cta{
            position:fixed;
            bottom:0;
            left:0;
            right:0;
            background:rgba(30,42,44,0.97);
            backdrop-filter:blur(10px);
            -webkit-backdrop-filter:blur(10px);
            padding:0.8rem 1.5rem;
            display:flex;
            align-items:center;
            justify-content:space-between;
            gap:1rem;
            z-index:1040;
            border-top:2px solid var(--brand-primary);
            transform:translateY(100%);
            transition:transform 0.35s ease;
        }
        .fixed-cta.show{
            transform:translateY(0);
        }
        .fixed-cta-text{
            color:#fff;
            font-size:0.9rem;
            font-weight:500;
        }
        .fixed-cta-text strong{
            color:var(--brand-primary-light);
        }
        .fixed-cta .btn{
            flex-shrink:0;
        }
        @media (max-width: 575.98px){
            .fixed-cta{padding:0.6rem 0.9rem;gap:0.6rem;}
            .fixed-cta-text{font-size:0.8rem;}
            .fixed-cta .btn{padding:0.5rem 1.1rem;font-size:0.82rem;}
        }

        /* focus accessibility */
        a:focus-visible,
        button:focus-visible{
            outline:3px solid rgba(196,84,43,0.5);
            outline-offset:2px;
        }

        /* Utility */
        .text-brand{color:var(--brand-primary) !important;}
        .bg-brand{background:var(--brand-primary) !important;}

/* roulang: framework shim */
/* 覆盖 Bootstrap 等对 a/btn 的全局默认，避免导航出现下划线/蓝链 */
.site-header a,.site-header a:hover,.navbar a,.navbar a:hover,.nav-links a,.nav-links a:hover,header nav a,header nav a:hover{text-decoration:none}
.site-header .btn,.navbar .btn,.nav-cta{text-decoration:none}