/* roulang page: index */
:root {
            --ink: #182331;
            --muted: #697586;
            --paper: #f7f8fa;
            --panel: #ffffff;
            --line: #e3e7ec;
            --accent: #e0523f;
            --accent-dark: #b93d30;
            --lime: #d9ed68;
            --navy: #1c2d3d;
            --shadow: 0 18px 50px rgba(24,35,49,.09);
            --soft-shadow: 0 8px 25px rgba(24,35,49,.06);
            --radius: 18px;
        }
        *, *::before, *::after { box-sizing: border-box; }
        html { scroll-behavior: smooth; }
        body {
            margin: 0;
            color: var(--ink);
            background: var(--paper);
            font-family: "Noto Sans SC", "DM Sans", sans-serif;
            line-height: 1.7;
            -webkit-font-smoothing: antialiased;
        }
        a { color: inherit; text-decoration: none; transition: color .2s ease, opacity .2s ease; }
        a:hover { color: var(--accent); }
        img { max-width: 100%; display: block; }
        button, input { font: inherit; }
        button:focus-visible, a:focus-visible, input:focus-visible {
            outline: 3px solid rgba(224,82,63,.3);
            outline-offset: 3px;
        }
        .container { max-width: 1160px; }
        .site-header {
            background: rgba(247,248,250,.93);
            border-bottom: 1px solid rgba(227,231,236,.9);
            position: sticky;
            top: 0;
            z-index: 20;
            backdrop-filter: blur(16px);
        }
        .navbar { min-height: 78px; }
        .brand {
            display: inline-flex;
            align-items: center;
            gap: 11px;
            color: var(--ink);
            font-size: 18px;
            font-weight: 800;
            letter-spacing: 0;
            line-height: 1.2;
        }
        .brand-mark {
            width: 34px;
            height: 34px;
            border-radius: 10px;
            display: grid;
            place-items: center;
            color: var(--ink);
            background: var(--lime);
            font-size: 14px;
            font-weight: 800;
        }
        .nav-pills-custom {
            gap: 6px;
            background: #eef1f3;
            border-radius: 13px;
            padding: 5px;
        }
        .nav-pills-custom .nav-link {
            color: var(--muted);
            font-size: 14px;
            border-radius: 9px;
            padding: 7px 16px;
        }
        .nav-pills-custom .nav-link:hover,
        .nav-pills-custom .nav-link.active {
            color: var(--ink);
            background: #fff;
            box-shadow: 0 3px 10px rgba(24,35,49,.08);
        }
        .header-action, .btn-primary-custom, .btn-dark-custom {
            border: 0;
            border-radius: 10px;
            font-weight: 700;
            padding: 11px 18px;
            transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
        }
        .header-action, .btn-primary-custom { color: #fff; background: var(--accent); }
        .header-action:hover, .btn-primary-custom:hover {
            color: #fff;
            background: var(--accent-dark);
            transform: translateY(-2px);
            box-shadow: 0 9px 20px rgba(224,82,63,.2);
        }
        .btn-dark-custom { color: #fff; background: var(--navy); }
        .btn-dark-custom:hover { color: #fff; background: #10202d; transform: translateY(-2px); }
        .hero {
            padding: 74px 0 64px;
            background: #eef1f3;
            overflow: hidden;
        }
        .eyebrow, .section-kicker {
            color: var(--accent);
            font-size: 12px;
            font-weight: 800;
            letter-spacing: .12em;
            text-transform: uppercase;
        }
        .hero h1 {
            max-width: 720px;
            margin: 15px 0 20px;
            font-size: clamp(38px, 5vw, 68px);
            line-height: 1.12;
            letter-spacing: 0;
            font-weight: 800;
        }
        .hero-copy { max-width: 650px; color: var(--muted); font-size: 17px; }
        .hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
        .hero-strip {
            margin-top: 48px;
            border: 1px solid var(--line);
            border-radius: var(--radius);
            background: #fff;
            box-shadow: var(--shadow);
            overflow: hidden;
        }
        .strip-main { padding: 27px 30px; }
        .strip-side {
            padding: 27px 30px;
            color: #fff;
            background: var(--navy);
        }
        .coupon-label { color: var(--accent); font-size: 12px; font-weight: 800; letter-spacing: .1em; }
        .coupon-title { font-size: 25px; font-weight: 800; margin: 7px 0 4px; }
        .coupon-note { color: var(--muted); font-size: 14px; }
        .strip-side strong { display: block; color: var(--lime); font-size: 29px; line-height: 1; margin-bottom: 7px; }
        .strip-side span { color: #c9d2d9; font-size: 13px; }
        section { padding: 92px 0; }
        .section-heading { max-width: 650px; margin-bottom: 42px; }
        .section-heading h2 { margin: 10px 0 12px; font-size: clamp(28px, 3.5vw, 44px); line-height: 1.2; font-weight: 800; }
        .section-heading p { margin: 0; color: var(--muted); }
        .benefit-list { border-top: 1px solid var(--line); }
        .benefit-item {
            display: grid;
            grid-template-columns: 58px 1fr 28px;
            align-items: center;
            gap: 18px;
            padding: 24px 0;
            border-bottom: 1px solid var(--line);
        }
        .benefit-no { color: var(--accent); font-size: 13px; font-weight: 800; }
        .benefit-item h3 { margin: 0 0 4px; font-size: 20px; }
        .benefit-item p { margin: 0; color: var(--muted); font-size: 14px; }
        .benefit-arrow { color: var(--accent); font-size: 22px; }
        .stats-band { color: #fff; background: var(--navy); padding: 57px 0; }
        .stat { padding: 0 28px; border-left: 1px solid rgba(255,255,255,.18); }
        .stat:first-child { border-left: 0; }
        .stat strong { display: block; color: var(--lime); font-size: 39px; line-height: 1.1; }
        .stat span { display: block; margin-top: 8px; color: #cad4dc; font-size: 14px; }
        .lead-section { background: #fff; }
        .lead-panel {
            padding: 42px;
            background: #f1f3f3;
            border: 1px solid var(--line);
            border-radius: var(--radius);
        }
        .lead-panel h2 { font-size: 32px; line-height: 1.25; font-weight: 800; margin: 8px 0 14px; }
        .lead-panel p { color: var(--muted); }
        .form-control {
            min-height: 50px;
            border: 1px solid #d7dde2;
            border-radius: 10px;
            background: #fff;
            padding: 12px 14px;
        }
        .form-control:focus { border-color: var(--accent); box-shadow: 0 0 0 4px rgba(224,82,63,.1); }
        .form-hint { margin-top: 13px; color: var(--muted); font-size: 12px; }
        .news-layout { display: grid; grid-template-columns: 1.4fr .8fr; gap: 55px; }
        .news-list { border-top: 1px solid var(--line); }
        .news-row {
            display: flex;
            justify-content: space-between;
            gap: 20px;
            padding: 20px 0;
            border-bottom: 1px solid var(--line);
        }
        .news-row h3 { margin: 0 0 5px; font-size: 17px; }
        .news-row p { margin: 0; color: var(--muted); font-size: 13px; }
        .news-date { white-space: nowrap; color: var(--muted); font-size: 12px; }
        .featured-note {
            padding: 27px;
            border-radius: var(--radius);
            color: #fff;
            background: var(--accent);
            box-shadow: var(--soft-shadow);
        }
        .featured-note h3 { margin: 10px 0; font-size: 24px; line-height: 1.3; }
        .featured-note p { color: #ffe3df; font-size: 14px; }
        .text-link { display: inline-flex; margin-top: 10px; color: var(--lime); font-weight: 700; }
        .assurance { background: #f0f2ee; }
        .assurance-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
        .assurance-card {
            padding: 25px;
            border: 1px solid var(--line);
            border-radius: 14px;
            background: rgba(255,255,255,.68);
        }
        .assurance-icon {
            width: 38px;
            height: 38px;
            display: grid;
            place-items: center;
            border-radius: 10px;
            color: var(--ink);
            background: var(--lime);
            font-weight: 800;
        }
        .assurance-card h3 { margin: 18px 0 7px; font-size: 18px; }
        .assurance-card p { margin: 0; color: var(--muted); font-size: 14px; }
        .faq-wrap { max-width: 850px; }
        .accordion-item { border: 0; border-bottom: 1px solid var(--line); background: transparent; }
        .accordion-button { padding: 22px 0; color: var(--ink); background: transparent; box-shadow: none; font-weight: 700; }
        .accordion-button:not(.collapsed) { color: var(--accent); background: transparent; box-shadow: none; }
        .accordion-button::after { background-size: 14px; }
        .accordion-body { padding: 0 35px 23px 0; color: var(--muted); font-size: 14px; }
        .privacy-box {
            padding: 24px 28px;
            border-left: 4px solid var(--lime);
            color: var(--muted);
            background: #fff;
            box-shadow: var(--soft-shadow);
            font-size: 14px;
        }
        .privacy-box strong { color: var(--ink); }
        footer { color: #cbd4da; background: var(--navy); padding: 48px 0 24px; }
        footer .brand { color: #fff; }
        .footer-copy { max-width: 410px; margin-top: 15px; color: #9eacb5; font-size: 13px; }
        .footer-links { display: flex; gap: 24px; justify-content: flex-end; font-size: 14px; }
        .footer-links a:hover { color: var(--lime); }
        .copyright { margin-top: 40px; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.14); color: #8d9ba5; font-size: 12px; }
        @media (max-width: 991px) {
            .navbar-collapse { padding: 18px 0 8px; }
            .nav-pills-custom { width: fit-content; }
            .header-action { margin-top: 12px; }
            .news-layout { gap: 30px; }
        }
        @media (max-width: 767px) {
            .navbar { min-height: 68px; }
            .brand { font-size: 15px; }
            .hero { padding: 54px 0 42px; }
            .hero h1 { font-size: 39px; }
            section { padding: 65px 0; }
            .hero-strip { margin-top: 34px; }
            .strip-main, .strip-side, .lead-panel { padding: 24px; }
            .strip-side { text-align: left; }
            .stat { margin-bottom: 25px; padding-left: 18px; }
            .stat:nth-child(3), .stat:nth-child(4) { margin-bottom: 0; }
            .news-layout, .assurance-grid { grid-template-columns: 1fr; }
            .footer-links { justify-content: flex-start; margin-top: 28px; flex-wrap: wrap; }
        }
        @media (max-width: 520px) {
            .hero-actions .btn { width: 100%; }
            .benefit-item { grid-template-columns: 38px 1fr 20px; gap: 11px; }
            .benefit-item h3 { font-size: 17px; }
            .news-row { display: block; }
            .news-date { display: block; margin-top: 8px; }
            .stat strong { font-size: 32px; }
        }

/* 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}