/* roulang page: index */
:root {
            --ink: #172127;
            --muted: #68777b;
            --paper: #f7f8f5;
            --white: #ffffff;
            --line: #dfe7e2;
            --green: #1c7c68;
            --green-deep: #125748;
            --mint: #dff1e8;
            --lime: #cbe86a;
            --orange: #f19a5b;
            --dark: #182b2b;
            --radius-lg: 26px;
            --radius-md: 15px;
            --shadow: 0 18px 50px rgba(31, 61, 54, .09);
            --shadow-hover: 0 24px 60px rgba(31, 61, 54, .16);
        }

        * { box-sizing: border-box; }
        html { scroll-behavior: smooth; }
        body {
            margin: 0;
            color: var(--ink);
            background: var(--paper);
            font-family: "Noto Sans SC", "Manrope", sans-serif;
            line-height: 1.75;
            overflow-x: hidden;
        }
        a { color: inherit; text-decoration: none; }
        a:hover { color: var(--green); }
        img { display: block; max-width: 100%; }
        button, input { font: inherit; }
        .container { max-width: 1180px; }
        .announcement {
            background: var(--dark);
            color: #dcebe3;
            font-size: 13px;
            letter-spacing: .03em;
            padding: 9px 0;
        }
        .announcement strong { color: var(--lime); font-weight: 700; }
        .site-header {
            position: sticky;
            top: 0;
            z-index: 1000;
            background: rgba(247,248,245,.94);
            border-bottom: 1px solid rgba(223,231,226,.86);
            backdrop-filter: blur(18px);
        }
        .navbar { min-height: 78px; }
        .brand {
            display: inline-flex;
            align-items: center;
            gap: 11px;
            color: var(--dark);
            font-size: 19px;
            font-weight: 900;
            letter-spacing: -.03em;
        }
        .brand-mark {
            width: 34px;
            height: 34px;
            display: grid;
            place-items: center;
            border-radius: 11px;
            background: var(--lime);
            color: var(--dark);
            font-family: "Manrope", sans-serif;
            font-size: 15px;
            font-weight: 900;
            box-shadow: 4px 4px 0 var(--green);
        }
        .navbar-nav { gap: 7px; }
        .nav-link {
            position: relative;
            color: #4f605f !important;
            font-size: 14px;
            font-weight: 700;
            padding: 10px 15px !important;
            border-radius: 9px;
            transition: .25s ease;
        }
        .nav-link:hover, .nav-link.active {
            color: var(--green) !important;
            background: #e8f1eb;
        }
        .nav-link.active::after {
            content: "";
            position: absolute;
            left: 15px;
            right: 15px;
            bottom: 4px;
            height: 2px;
            border-radius: 2px;
            background: var(--orange);
        }
        .nav-tools {
            display: flex;
            align-items: center;
            gap: 10px;
        }
        .search-box {
            width: 170px;
            height: 40px;
            display: flex;
            align-items: center;
            gap: 8px;
            padding: 0 12px;
            color: var(--muted);
            background: var(--white);
            border: 1px solid var(--line);
            border-radius: 10px;
        }
        .search-box input {
            width: 100%;
            min-width: 0;
            border: 0;
            outline: 0;
            color: var(--ink);
            background: transparent;
            font-size: 13px;
        }
        .icon-btn {
            width: 40px;
            height: 40px;
            display: grid;
            place-items: center;
            color: var(--green-deep);
            background: var(--mint);
            border: 0;
            border-radius: 10px;
            transition: .25s ease;
        }
        .icon-btn:hover { color: var(--white); background: var(--green); transform: translateY(-2px); }
        .btn-primary-custom, .btn-outline-custom {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 8px;
            min-height: 46px;
            padding: 0 20px;
            border-radius: 10px;
            font-size: 14px;
            font-weight: 800;
            transition: .25s ease;
        }
        .btn-primary-custom {
            color: var(--dark);
            background: var(--lime);
            border: 1px solid var(--lime);
            box-shadow: 0 7px 0 rgba(28,124,104,.16);
        }
        .btn-primary-custom:hover { color: var(--dark); transform: translateY(-3px); box-shadow: 0 10px 0 rgba(28,124,104,.18); }
        .btn-outline-custom {
            color: var(--green-deep);
            background: transparent;
            border: 1px solid #a9c7b8;
        }
        .btn-outline-custom:hover { color: var(--white); background: var(--green); border-color: var(--green); }
        .hero {
            position: relative;
            min-height: 645px;
            display: flex;
            align-items: center;
            overflow: hidden;
            background: var(--dark);
            color: var(--white);
        }
        .hero::before {
            content: "";
            position: absolute;
            inset: 0;
            opacity: .38;
            background: linear-gradient(90deg, #182b2b 6%, rgba(24,43,43,.84) 42%, rgba(24,43,43,.19)), url("https://images.unsplash.com/photo-1511512578047-dfb367046420?auto=format&fit=crop&w=1900&q=88") center/cover;
        }
        .hero::after {
            content: "";
            position: absolute;
            right: -100px;
            bottom: -160px;
            width: 540px;
            height: 540px;
            border: 1px solid rgba(203,232,106,.35);
            border-radius: 50%;
            box-shadow: 0 0 0 46px rgba(203,232,106,.05), 0 0 0 92px rgba(203,232,106,.04);
        }
        .hero-content { position: relative; z-index: 1; padding: 92px 0 105px; }
        .eyebrow {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            margin-bottom: 22px;
            color: var(--lime);
            font-family: "Manrope", sans-serif;
            font-size: 12px;
            font-weight: 800;
            letter-spacing: .14em;
            text-transform: uppercase;
        }
        .eyebrow::before {
            content: "";
            width: 25px;
            height: 2px;
            background: var(--orange);
        }
        .hero h1 {
            max-width: 720px;
            margin: 0 0 23px;
            font-size: clamp(42px, 5.5vw, 76px);
            line-height: 1.1;
            letter-spacing: -.06em;
            font-weight: 900;
        }
        .hero h1 span { color: var(--lime); }
        .hero-copy {
            max-width: 650px;
            margin-bottom: 31px;
            color: #d4e2dc;
            font-size: 17px;
            line-height: 2;
        }
        .hero-actions { display: flex; flex-wrap: wrap; gap: 12px; }
        .hero .btn-outline-custom { color: #e8f4ed; border-color: rgba(232,244,237,.5); }
        .hero .btn-outline-custom:hover { color: var(--dark); background: var(--white); border-color: var(--white); }
        .hero-strip {
            position: absolute;
            right: 7%;
            bottom: 34px;
            z-index: 2;
            display: flex;
            gap: 0;
            padding: 0;
            border: 1px solid rgba(255,255,255,.18);
            border-radius: 13px;
            background: rgba(15,34,32,.74);
            backdrop-filter: blur(14px);
        }
        .hero-stat { min-width: 145px; padding: 14px 20px; border-right: 1px solid rgba(255,255,255,.16); }
        .hero-stat:last-child { border-right: 0; }
        .hero-stat b { display: block; color: var(--lime); font: 800 23px "Manrope", sans-serif; }
        .hero-stat span { color: #b9cec4; font-size: 12px; }
        .section { padding: 104px 0; }
        .section-soft { background: #edf4ef; }
        .section-dark { color: var(--white); background: var(--dark); }
        .section-head { max-width: 700px; margin-bottom: 50px; }
        .section-kicker {
            margin-bottom: 12px;
            color: var(--green);
            font: 800 12px "Manrope", sans-serif;
            letter-spacing: .13em;
            text-transform: uppercase;
        }
        .section-dark .section-kicker { color: var(--lime); }
        .section h2 {
            margin: 0 0 16px;
            color: var(--dark);
            font-size: clamp(30px, 4vw, 49px);
            line-height: 1.23;
            letter-spacing: -.05em;
            font-weight: 900;
        }
        .section-dark h2 { color: var(--white); }
        .section-head p { margin: 0; color: var(--muted); font-size: 16px; }
        .section-dark .section-head p { color: #bed0c7; }
        .feature-grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: 30px; align-items: stretch; }
        .feature-image {
            min-height: 380px;
            border-radius: var(--radius-lg);
            background: linear-gradient(180deg, transparent 30%, rgba(15,34,32,.8)), url("https://images.unsplash.com/photo-1550745165-9bc0b252726f?auto=format&fit=crop&w=1200&q=85") center/cover;
            position: relative;
            overflow: hidden;
        }
        .image-caption { position: absolute; left: 28px; right: 28px; bottom: 25px; color: var(--white); }
        .image-caption strong { display: block; margin-bottom: 5px; font-size: 21px; }
        .image-caption span { color: #d7e8df; font-size: 13px; }
        .feature-list { display: grid; gap: 14px; }
        .feature-item {
            display: flex;
            gap: 17px;
            padding: 22px;
            background: var(--white);
            border: 1px solid var(--line);
            border-radius: var(--radius-md);
            transition: .25s ease;
        }
        .feature-item:hover { transform: translateX(5px); box-shadow: var(--shadow); border-color: #afd0bd; }
        .feature-icon {
            flex: 0 0 42px;
            height: 42px;
            display: grid;
            place-items: center;
            color: var(--green-deep);
            background: var(--mint);
            border-radius: 12px;
            font-weight: 900;
        }
        .feature-item h3 { margin: 0 0 5px; font-size: 17px; font-weight: 800; }
        .feature-item p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.75; }
        .pain-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
        .pain-card {
            min-height: 220px;
            padding: 28px;
            border-top: 3px solid var(--orange);
            background: var(--white);
            border-radius: 0 0 var(--radius-md) var(--radius-md);
            box-shadow: 0 6px 22px rgba(31,61,54,.04);
        }
        .pain-card .number { margin-bottom: 28px; color: var(--orange); font: 800 13px "Manrope", sans-serif; }
        .pain-card h3 { margin: 0 0 12px; font-size: 19px; font-weight: 800; }
        .pain-card p { margin: 0; color: var(--muted); font-size: 14px; }
        .solution-layout { display: grid; grid-template-columns: .8fr 1.2fr; gap: 65px; align-items: center; }
        .solution-note { padding: 28px; background: var(--mint); border-left: 4px solid var(--green); border-radius: 0 var(--radius-md) var(--radius-md) 0; }
        .solution-note p { margin: 0; color: var(--green-deep); font-size: 15px; }
        .steps { display: grid; gap: 0; }
        .step {
            position: relative;
            display: grid;
            grid-template-columns: 58px 1fr;
            gap: 17px;
            padding-bottom: 31px;
        }
        .step:not(:last-child)::after {
            content: "";
            position: absolute;
            top: 42px;
            left: 20px;
            width: 1px;
            height: calc(100% - 30px);
            background: #b9d4c3;
        }
        .step-number {
            position: relative;
            z-index: 1;
            width: 42px;
            height: 42px;
            display: grid;
            place-items: center;
            color: var(--white);
            background: var(--green);
            border-radius: 50%;
            font: 800 14px "Manrope", sans-serif;
        }
        .step h3 { margin: 6px 0 5px; font-size: 18px; font-weight: 800; }
        .step p { margin: 0; color: var(--muted); font-size: 14px; }
        .scene-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
        .scene-card { min-height: 290px; position: relative; overflow: hidden; border-radius: var(--radius-md); background: var(--dark); }
        .scene-card img { width: 100%; height: 100%; object-fit: cover; opacity: .74; transition: .35s ease; }
        .scene-card:hover img { transform: scale(1.06); opacity: .9; }
        .scene-content { position: absolute; inset: auto 21px 20px; color: var(--white); }
        .scene-content b { display: block; margin-bottom: 7px; font-size: 20px; }
        .scene-content span { color: #d7e9df; font-size: 13px; }
        .trust-row { display: grid; grid-template-columns: 1fr 1fr; gap: 55px; align-items: center; }
        .quote {
            position: relative;
            padding: 38px;
            color: #e7f0eb;
            background: #223b39;
            border-radius: var(--radius-lg);
        }
        .quote::before { content: "“"; position: absolute; top: 18px; left: 28px; color: var(--lime); font: 900 62px Georgia, serif; line-height: 1; }
        .quote p { margin: 24px 0 23px; font-size: 18px; line-height: 1.9; }
        .quote small { color: #a9c5b8; }
        .trust-points { display: grid; gap: 19px; }
        .trust-point { display: flex; gap: 15px; padding-bottom: 19px; border-bottom: 1px solid #d5e4dc; }
        .trust-point:last-child { border-bottom: 0; }
        .check { flex: 0 0 25px; height: 25px; display: grid; place-items: center; color: var(--dark); background: var(--lime); border-radius: 50%; font-weight: 900; }
        .trust-point h3 { margin: 0 0 3px; font-size: 16px; font-weight: 800; }
        .trust-point p { margin: 0; color: var(--muted); font-size: 13px; }
        .news-grid { display: grid; grid-template-columns: 1.15fr .85fr .85fr; gap: 18px; }
        .news-card { overflow: hidden; background: var(--white); border: 1px solid var(--line); border-radius: var(--radius-md); transition: .25s ease; }
        .news-card:hover { transform: translateY(-5px); box-shadow: var(--shadow-hover); }
        .news-card img { width: 100%; height: 180px; object-fit: cover; }
        .news-card:first-child img { height: 230px; }
        .news-body { padding: 22px; }
        .news-tag { color: var(--orange); font: 800 11px "Manrope", sans-serif; letter-spacing: .08em; }
        .news-body h3 { margin: 10px 0 8px; font-size: 18px; line-height: 1.45; font-weight: 800; }
        .news-body p { margin: 0; color: var(--muted); font-size: 13px; }
        .plans { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
        .plan { padding: 30px; background: #213836; border: 1px solid #365750; border-radius: var(--radius-md); }
        .plan.featured { background: var(--lime); color: var(--dark); border-color: var(--lime); transform: translateY(-10px); }
        .plan-label { color: var(--lime); font-size: 12px; font-weight: 800; letter-spacing: .1em; }
        .featured .plan-label { color: var(--green-deep); }
        .plan h3 { margin: 13px 0 8px; font-size: 24px; font-weight: 900; }
        .plan p { min-height: 54px; margin: 0 0 22px; color: #bbcec5; font-size: 13px; }
        .featured p { color: #355c4d; }
        .plan ul { display: grid; gap: 9px; margin: 0; padding: 18px 0 0; border-top: 1px solid rgba(255,255,255,.17); list-style: none; color: #d7e5df; font-size: 13px; }
        .featured ul { color: #31594b; border-color: rgba(22,70,55,.2); }
        .plan li::before { content: "＋"; margin-right: 7px; color: var(--lime); font-weight: 900; }
        .featured li::before { color: var(--green); }
        .assurance {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 30px;
            padding: 32px 38px;
            background: var(--mint);
            border: 1px solid #c4dfd0;
            border-radius: var(--radius-lg);
        }
        .assurance h2 { margin: 0 0 8px; font-size: 25px; }
        .assurance p { margin: 0; color: var(--muted); font-size: 14px; }
        .assurance-badges { display: flex; flex-wrap: wrap; gap: 9px; }
        .badge-custom { padding: 9px 13px; color: var(--green-deep); background: var(--white); border: 1px solid #c2dbcd; border-radius: 8px; font-size: 12px; font-weight: 800; }
        .contact-section { padding: 96px 0 108px; background: #fffdf7; }
        .contact-box { display: grid; grid-template-columns: .9fr 1.1fr; gap: 60px; align-items: center; }
        .contact-box h2 { margin: 0 0 15px; color: var(--dark); font-size: 40px; line-height: 1.25; font-weight: 900; letter-spacing: -.04em; }
        .contact-box > div > p { color: var(--muted); font-size: 15px; }
        .contact-meta { display: flex; gap: 25px; margin-top: 28px; }
        .contact-meta strong { display: block; color: var(--green); font: 800 24px "Manrope", sans-serif; }
        .contact-meta span { color: var(--muted); font-size: 12px; }
        .contact-form { padding: 30px; background: var(--white); border: 1px solid var(--line); border-radius: var(--radius-lg); box-shadow: var(--shadow); }
        .form-label { margin-bottom: 6px; color: var(--dark); font-size: 13px; font-weight: 800; }
        .form-control { height: 46px; border-color: var(--line); border-radius: 9px; font-size: 14px; }
        .form-control:focus { border-color: var(--green); box-shadow: 0 0 0 3px rgba(28,124,104,.12); }
        .contact-form textarea.form-control { height: 90px; resize: vertical; }
        .form-note { margin: 13px 0 0; color: var(--muted); font-size: 11px; }
        .site-footer { padding: 58px 0 25px; color: #b7cbc0; background: #142725; }
        .footer-grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1fr; gap: 30px; padding-bottom: 45px; border-bottom: 1px solid rgba(214,237,224,.15); }
        .footer-brand { color: var(--white); }
        .footer-desc { max-width: 300px; margin: 20px 0 0; color: #9eb8aa; font-size: 13px; }
        .footer-title { margin-bottom: 16px; color: var(--lime); font-size: 13px; font-weight: 800; }
        .footer-links { display: grid; gap: 9px; margin: 0; padding: 0; list-style: none; font-size: 13px; }
        .footer-links a { color: #b7cbc0; transition: .2s ease; }
        .footer-links a:hover { color: var(--lime); }
        .copyright { display: flex; justify-content: space-between; gap: 20px; padding-top: 22px; color: #809b8c; font-size: 12px; }
        @media (max-width: 991px) {
            .nav-tools { display: none; }
            .hero-strip { position: relative; right: auto; bottom: auto; margin: 28px 0 0; width: max-content; max-width: 100%; }
            .hero-content { padding: 75px 0 80px; }
            .feature-grid, .solution-layout, .trust-row, .contact-box { grid-template-columns: 1fr; gap: 32px; }
            .feature-image { min-height: 330px; }
            .contact-box { gap: 20px; }
        }
        @media (max-width: 767px) {
            .navbar { min-height: 67px; }
            .brand { font-size: 16px; }
            .hero { min-height: auto; }
            .hero h1 { font-size: 43px; }
            .hero-copy { font-size: 15px; line-height: 1.85; }
            .hero-strip { display: grid; grid-template-columns: repeat(3, 1fr); width: 100%; }
            .hero-stat { min-width: 0; padding: 11px 8px; text-align: center; }
            .hero-stat b { font-size: 18px; }
            .hero-stat span { font-size: 10px; }
            .section { padding: 72px 0; }
            .section h2, .contact-box h2 { font-size: 32px; }
            .pain-grid, .scene-grid, .plans, .news-grid { grid-template-columns: 1fr; }
            .news-card:first-child img, .news-card img { height: 190px; }
            .plan.featured { transform: none; }
            .assurance { display: block; padding: 26px; }
            .assurance-badges { margin-top: 20px; }
            .footer-grid { grid-template-columns: 1fr 1fr; }
            .footer-grid > div:first-child { grid-column: 1 / -1; }
            .copyright { display: block; }
            .copyright span { display: block; margin-top: 7px; }
        }
        @media (max-width: 520px) {
            .announcement { font-size: 11px; text-align: center; }
            .hero-content { padding: 58px 0 65px; }
            .hero-actions { display: grid; }
            .hero-actions a { width: 100%; }
            .hero-strip { margin-top: 25px; }
            .feature-image { min-height: 250px; }
            .contact-form { padding: 22px; }
            .footer-grid { grid-template-columns: 1fr; }
            .footer-grid > div:first-child { grid-column: auto; }
        }

/* roulang page: category1 */
:root {
      --ink:#172127;--muted:#68777b;--paper:#f7f8f5;--white:#fff;--line:#dfe7e2;
      --green:#1c7c68;--green-deep:#125748;--mint:#dff1e8;--lime:#cbe86a;
      --orange:#f19a5b;--dark:#182b2b;--radius-lg:26px;--radius-md:15px;
      --shadow:0 18px 50px rgba(31,61,54,.09);--shadow-hover:0 24px 60px rgba(31,61,54,.16);
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{margin:0;color:var(--ink);background:var(--paper);font-family:"Noto Sans SC","Manrope",sans-serif;line-height:1.75;overflow-x:hidden}
    a{color:inherit;text-decoration:none}a:hover{color:var(--green)}
    img{display:block;max-width:100%}button,input{font:inherit}
    .container{max-width:1180px}
    .site-header{position:sticky;top:0;z-index:1000;background:rgba(247,248,245,.94);border-bottom:1px solid rgba(223,231,226,.86);backdrop-filter:blur(18px)}
    .navbar{min-height:78px}.brand{display:inline-flex;align-items:center;gap:11px;color:var(--dark);font-size:19px;font-weight:900;letter-spacing:-.03em}
    .brand-mark{width:34px;height:34px;display:grid;place-items:center;border-radius:11px;background:var(--lime);color:var(--dark);font-family:"Manrope",sans-serif;font-size:15px;font-weight:900;box-shadow:4px 4px 0 var(--green)}
    .navbar-nav{gap:7px}.nav-link{position:relative;color:#4f605f!important;font-size:14px;font-weight:700;padding:10px 15px!important;border-radius:9px;transition:.25s ease}
    .nav-link:hover,.nav-link.active{color:var(--green)!important;background:#e8f1eb}
    .nav-link.active:after{content:"";position:absolute;left:15px;right:15px;bottom:4px;height:2px;border-radius:2px;background:var(--orange)}
    .nav-tools{display:flex;align-items:center;gap:10px}.search-box{width:170px;height:40px;display:flex;align-items:center;gap:8px;padding:0 12px;color:var(--muted);background:var(--white);border:1px solid var(--line);border-radius:10px}
    .search-box input{width:100%;min-width:0;border:0;outline:0;color:var(--ink);background:transparent;font-size:13px}
    .icon-btn{width:40px;height:40px;display:grid;place-items:center;color:var(--green-deep);background:var(--mint);border:0;border-radius:10px;transition:.25s ease}
    .icon-btn:hover{color:var(--white);background:var(--green);transform:translateY(-2px)}
    .btn-primary-custom,.btn-outline-custom{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:0 20px;border-radius:10px;font-size:14px;font-weight:800;transition:.25s ease}
    .btn-primary-custom{color:var(--dark);background:var(--lime);border:1px solid var(--lime);box-shadow:0 7px 0 rgba(28,124,104,.16)}
    .btn-primary-custom:hover{color:var(--dark);transform:translateY(-3px);box-shadow:0 10px 0 rgba(28,124,104,.18)}
    .btn-outline-custom{color:var(--green-deep);background:transparent;border:1px solid #a9c7b8}
    .btn-outline-custom:hover{color:var(--white);background:var(--green);border-color:var(--green)}
    .eyebrow{display:inline-flex;align-items:center;gap:8px;margin-bottom:18px;color:var(--orange);font-family:"Manrope",sans-serif;font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
    .eyebrow:before{content:"";width:25px;height:2px;background:var(--lime)}
    .hero-inner{padding:88px 0 86px}.hero-ai{background:var(--dark);color:var(--white);position:relative;overflow:hidden}
    .hero-ai:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(24,43,43,.98) 8%,rgba(24,43,43,.86) 48%,rgba(24,43,43,.3)),url("https://images.unsplash.com/photo-1518770660439-4636190af475?auto=format&fit=crop&w=1900&q=88") center/cover;opacity:.9}
    .hero-ai .container{position:relative;z-index:1}.hero-title{max-width:760px;font-size:clamp(42px,5.5vw,72px);line-height:1.12;letter-spacing:-.06em;font-weight:900;margin:0 0 22px}
    .hero-title span{color:var(--lime)}.hero-copy{max-width:650px;color:#d7e4dc;font-size:17px;margin-bottom:30px}
    .hero-actions{display:flex;gap:12px;flex-wrap:wrap}.hero-actions .btn-outline-custom{color:var(--white);border-color:rgba(255,255,255,.38)}
    .roadmap{margin-top:58px;display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid rgba(255,255,255,.25)}
    .roadmap-item{position:relative;padding:19px 16px 0 0;color:#b5c8c0;font-size:13px}.roadmap-item:before{content:"";position:absolute;top:-6px;left:0;width:11px;height:11px;border-radius:50%;background:var(--orange);box-shadow:0 0 0 5px rgba(241,154,91,.18)}
    .roadmap-item strong{display:block;color:var(--white);font-size:15px;margin-bottom:3px}.roadmap-item.current strong{color:var(--lime)}
    .section{padding:88px 0}.section-soft{background:#edf4ef}.section-dark{background:var(--dark);color:var(--white)}
    .section-heading{max-width:680px;margin-bottom:42px}.section-heading h2{font-size:clamp(28px,4vw,46px);line-height:1.2;letter-spacing:-.045em;margin:0 0 14px;font-weight:900}.section-heading p{color:var(--muted);margin:0}.section-dark .section-heading p{color:#b9cbc3}
    .feature-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:22px}.feature-panel{min-height:330px;padding:32px;border-radius:var(--radius-lg);background:var(--white);border:1px solid var(--line);box-shadow:var(--shadow)}
    .feature-panel.dark-panel{background:#23443e;color:var(--white);border-color:#315b51;background-image:url("https://images.unsplash.com/photo-1550751827-4bd374c3f58b?auto=format&fit=crop&w=1100&q=80");background-size:cover;background-position:center}
    .feature-panel.dark-panel:before{content:"";display:block;position:absolute}.feature-panel h3{font-size:26px;line-height:1.35;margin:0 0 14px;font-weight:900}.feature-panel p{color:var(--muted);margin-bottom:20px}.dark-panel p{color:#d2e2d9}
    .mini-label{display:inline-block;padding:5px 10px;border-radius:20px;background:var(--mint);color:var(--green-deep);font-size:12px;font-weight:800;margin-bottom:24px}.dark-panel .mini-label{background:var(--lime)}
    .insight-list{display:grid;gap:12px;margin-top:28px}.insight-item{display:flex;align-items:flex-start;gap:12px;padding-top:13px;border-top:1px solid var(--line);font-size:14px}.insight-item b{color:var(--green);font-family:"Manrope",sans-serif;font-size:18px}
    .extension-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.extension-card{padding:25px;background:var(--white);border:1px solid var(--line);border-radius:var(--radius-md);transition:.25s ease}.extension-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-hover);border-color:#b9d7c7}
    .extension-icon{width:44px;height:44px;display:grid;place-items:center;border-radius:13px;background:var(--mint);color:var(--green-deep);font-weight:900;font-family:"Manrope",sans-serif;margin-bottom:21px}.extension-card h3{font-size:19px;margin:0 0 8px}.extension-card p{font-size:14px;color:var(--muted);margin:0}
    .timeline{display:grid;grid-template-columns:180px 1fr;gap:0;border-top:1px solid rgba(255,255,255,.2)}.timeline-row{display:contents}.timeline-date,.timeline-content{padding:24px 0;border-bottom:1px solid rgba(255,255,255,.16)}.timeline-date{color:var(--lime);font-family:"Manrope",sans-serif;font-weight:800}.timeline-content h3{font-size:20px;margin:0 0 5px}.timeline-content p{color:#bdcec6;margin:0;font-size:14px}
    .scene-layout{display:grid;grid-template-columns:.8fr 1.2fr;gap:50px;align-items:start}.scene-layout .section-heading{margin-bottom:0}.scene-list{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.scene-list a{padding:19px 20px;background:var(--white);border:1px solid var(--line);border-radius:12px;font-weight:800;display:flex;justify-content:space-between;transition:.2s ease}.scene-list a:after{content:"↗";color:var(--orange)}.scene-list a:hover{border-color:var(--green);color:var(--green);transform:translateX(3px)}
    .updates{display:grid;grid-template-columns:1fr 1fr;gap:18px}.update-item{display:grid;grid-template-columns:100px 1fr;gap:22px;padding:22px 0;border-top:1px solid var(--line)}.update-date{color:var(--green);font-family:"Manrope",sans-serif;font-weight:800;font-size:13px}.update-item h3{font-size:18px;margin:0 0 5px}.update-item p{font-size:14px;color:var(--muted);margin:0}
    .cta-band{padding:58px 0;background:var(--lime)}.cta-wrap{display:flex;align-items:center;justify-content:space-between;gap:30px}.cta-wrap h2{font-size:clamp(28px,4vw,42px);line-height:1.2;margin:0 0 8px;letter-spacing:-.04em}.cta-wrap p{margin:0;color:#42584d}.cta-band .btn-primary-custom{background:var(--dark);color:var(--white);border-color:var(--dark);box-shadow:0 7px 0 rgba(24,43,43,.18)}
    .site-footer{padding:62px 0 24px;background:#142424;color:#d4e2dc}.footer-grid{display:grid;grid-template-columns:1.5fr repeat(3,1fr);gap:40px;padding-bottom:48px}.footer-brand{color:var(--white)}.footer-desc{max-width:280px;color:#9fb5aa;font-size:14px;margin:20px 0 0}.footer-title{color:var(--lime);font-size:13px;font-weight:800;margin-bottom:15px}.footer-links{list-style:none;padding:0;margin:0;display:grid;gap:9px;color:#a9bdb3;font-size:14px}.footer-links a:hover{color:var(--lime)}.copyright{display:flex;justify-content:space-between;gap:15px;padding-top:20px;border-top:1px solid rgba(255,255,255,.14);color:#829b90;font-size:12px}
    :focus-visible{outline:3px solid rgba(241,154,91,.55);outline-offset:3px}
    @media (max-width:991px){.nav-tools{padding:15px 0 8px;flex-wrap:wrap}.search-box{flex:1}.roadmap{grid-template-columns:repeat(2,1fr);row-gap:20px}.feature-grid,.scene-layout{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr 1fr}.hero-inner{padding-top:72px}}
    @media (max-width:767px){.navbar{min-height:68px}.extension-grid,.updates{grid-template-columns:1fr}.hero-inner{padding:66px 0 62px}.hero-title{font-size:43px}.hero-copy{font-size:15px}.section{padding:62px 0}.feature-panel{padding:24px;min-height:auto}.timeline{grid-template-columns:88px 1fr}.timeline-date,.timeline-content{padding:18px 0}.scene-list{grid-template-columns:1fr}.cta-wrap{align-items:flex-start;flex-direction:column}.footer-grid{grid-template-columns:1fr 1fr;gap:30px}.footer-grid>div:first-child{grid-column:1/-1}.copyright{flex-direction:column;gap:5px}}
    @media (max-width:520px){.roadmap{grid-template-columns:1fr}.roadmap-item{padding-left:22px;padding-top:0;border-left:1px solid rgba(255,255,255,.2);border-top:0}.roadmap-item:before{left:-6px;top:3px}.footer-grid{grid-template-columns:1fr}.footer-grid>div:first-child{grid-column:auto}.copyright{font-size:11px}}

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