/* roulang page: index */
:root{
      --bg: #0E1110;
      --bg-2: #141816;
      --bg-3: #F6F7F2;
      --card: #171C19;
      --card-2: #1E2420;
      --line: rgba(114,224,106,.18);
      --line-2: rgba(255,255,255,.10);
      --text: #F5F7F2;
      --text-dark: #1D241F;
      --muted: #A7B1A9;
      --muted-dark: #69726B;
      --brand: #72E06A;
      --brand-2: #9CF2C5;
      --brand-3: #B8FF4D;
      --shadow: 0 18px 60px rgba(0,0,0,.28);
      --shadow-soft: 0 12px 30px rgba(0,0,0,.18);
      --radius-xl: 30px;
      --radius-lg: 22px;
      --radius-md: 18px;
      --radius-sm: 14px;
      --container: 1240px;
      --nav-h: 82px;
    }

    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      font-family: "PingFang SC","Microsoft YaHei","Noto Sans SC",Arial,sans-serif;
      background:
        radial-gradient(circle at 12% 16%, rgba(114,224,106,.08), transparent 24%),
        radial-gradient(circle at 86% 18%, rgba(156,242,197,.07), transparent 22%),
        linear-gradient(180deg, #0B0F0E 0%, #101412 30%, #0E1110 100%);
      color:var(--text);
      line-height:1.75;
      text-rendering:optimizeLegibility;
      -webkit-font-smoothing:antialiased;
    }
    a{color:inherit;text-decoration:none;transition:all .25s ease}
    a:hover{color:var(--brand)}
    img{max-width:100%;display:block}
    button,input,textarea{font:inherit}
    ::selection{background:rgba(114,224,106,.28);color:#fff}
    :focus-visible{
      outline:0;
      box-shadow:0 0 0 4px rgba(114,224,106,.18), 0 0 0 1px rgba(114,224,106,.5) inset;
      border-radius:12px;
    }

    .container-fluid-shell{
      max-width:var(--container);
      margin:0 auto;
      padding-left:20px;
      padding-right:20px;
    }

    .site-header{
      position:sticky;
      top:0;
      z-index:1030;
      backdrop-filter:saturate(140%) blur(12px);
      background:rgba(14,17,16,.82);
      border-bottom:1px solid rgba(255,255,255,.07);
      transition:all .25s ease;
    }
    .site-header.scrolled{
      background:rgba(14,17,16,.94);
      box-shadow:0 10px 40px rgba(0,0,0,.25);
      border-bottom-color:rgba(114,224,106,.14);
    }
    .navbar{
      min-height:var(--nav-h);
      padding:0;
    }
    .navbar-brand{
      display:flex;
      align-items:center;
      gap:12px;
      font-weight:800;
      letter-spacing:.2px;
      color:var(--text);
      font-size:1.05rem;
    }
    .brand-mark{
      width:40px;height:40px;
      border-radius:14px;
      background:
        radial-gradient(circle at 30% 30%, rgba(255,255,255,.22), transparent 34%),
        linear-gradient(135deg, rgba(114,224,106,.24), rgba(156,242,197,.08));
      border:1px solid rgba(114,224,106,.28);
      box-shadow:0 0 0 1px rgba(114,224,106,.08) inset, 0 10px 24px rgba(0,0,0,.22);
      display:grid;
      place-items:center;
      position:relative;
      overflow:hidden;
    }
    .brand-mark svg{width:28px;height:28px}
    .brand-mark::after{
      content:"";
      position:absolute;
      inset:7px;
      border-radius:50%;
      border:1px solid rgba(184,255,77,.18);
    }
    .nav-link{
      color:rgba(245,247,242,.82);
      font-size:.98rem;
      font-weight:600;
      padding:.6rem .85rem!important;
      border-radius:999px;
    }
    .nav-link:hover,
    .nav-link:focus{
      color:#fff;
      background:rgba(114,224,106,.08);
    }
    .nav-link.active{
      color:#fff;
      background:rgba(114,224,106,.14);
      box-shadow:0 0 0 1px rgba(114,224,106,.22) inset;
    }
    .nav-cta{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap:.5rem;
      min-height:46px;
      padding:.74rem 1.2rem;
      border-radius:999px;
      color:#101411;
      font-weight:800;
      background:linear-gradient(135deg,var(--brand-3),var(--brand));
      box-shadow:0 16px 30px rgba(114,224,106,.22);
      border:0;
      white-space:nowrap;
    }
    .nav-cta:hover{
      transform:translateY(-2px);
      color:#101411;
      box-shadow:0 20px 40px rgba(114,224,106,.28);
    }

    .navbar-toggler{
      border:1px solid rgba(114,224,106,.22);
      background:rgba(114,224,106,.08);
      padding:.55rem .75rem;
      box-shadow:none!important;
    }
    .navbar-toggler-icon{
      filter:invert(1) brightness(1.5);
    }

    .section{
      position:relative;
      overflow:hidden;
    }
    .section-dark{
      background:
        linear-gradient(180deg, rgba(255,255,255,.01), rgba(255,255,255,0)),
        linear-gradient(180deg, #101412 0%, #0E1110 100%);
    }
    .section-light{
      background:linear-gradient(180deg, #F6F7F2 0%, #EEF1EA 100%);
      color:var(--text-dark);
    }
    .section-pad{
      padding:96px 0;
    }
    .section-pad-sm{
      padding:72px 0;
    }

    .hero{
      min-height:calc(100vh - var(--nav-h));
      display:flex;
      align-items:center;
      padding:44px 0 30px;
      position:relative;
    }
    .hero::before{
      content:"";
      position:absolute;
      inset:0;
      background:
        linear-gradient(90deg, rgba(255,255,255,.02) 1px, transparent 1px),
        linear-gradient(rgba(255,255,255,.02) 1px, transparent 1px);
      background-size:42px 42px;
      mask-image:linear-gradient(180deg, rgba(0,0,0,.65), transparent 90%);
      opacity:.28;
      pointer-events:none;
    }
    .hero::after{
      content:"";
      position:absolute;
      right:-6%;
      top:8%;
      width:420px;
      height:420px;
      border-radius:50%;
      border:1px solid rgba(114,224,106,.16);
      box-shadow:0 0 0 24px rgba(114,224,106,.03), 0 0 120px rgba(114,224,106,.06);
      pointer-events:none;
    }
    .hero-grid{
      position:relative;
      z-index:1;
      display:grid;
      grid-template-columns:1.1fr .9fr;
      gap:38px;
      align-items:center;
    }
    .eyebrow{
      display:inline-flex;
      align-items:center;
      gap:8px;
      padding:.38rem .78rem;
      border-radius:999px;
      background:rgba(114,224,106,.08);
      border:1px solid rgba(114,224,106,.18);
      color:var(--brand-2);
      font-size:.86rem;
      font-weight:700;
      letter-spacing:.08em;
      text-transform:none;
    }
    .eyebrow .dot{
      width:8px;height:8px;border-radius:50%;
      background:var(--brand);
      box-shadow:0 0 0 6px rgba(114,224,106,.12);
    }
    h1{
      font-size:clamp(2.2rem, 5.2vw, 4.25rem);
      line-height:1.12;
      font-weight:800;
      margin:18px 0 18px;
      letter-spacing:-.02em;
    }
    h2{
      font-size:clamp(1.75rem, 3vw, 2.8rem);
      line-height:1.18;
      font-weight:800;
      margin:0 0 16px;
      letter-spacing:-.01em;
    }
    h3{
      font-size:clamp(1.18rem, 1.6vw, 1.48rem);
      line-height:1.28;
      font-weight:750;
      margin:0 0 12px;
    }
    .hero-copy{
      color:rgba(245,247,242,.86);
      font-size:1.05rem;
      max-width:640px;
      margin-bottom:28px;
    }
    .hero-actions{
      display:flex;
      gap:12px;
      flex-wrap:wrap;
      margin-bottom:26px;
    }
    .btn-main,
    .btn-ghost,
    .btn-soft{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap:.5rem;
      border-radius:999px;
      font-weight:800;
      border:1px solid transparent;
      transition:all .25s ease;
      min-height:48px;
      padding:.8rem 1.2rem;
    }
    .btn-main{
      background:linear-gradient(135deg,var(--brand-3),var(--brand));
      color:#111612;
      box-shadow:0 16px 30px rgba(114,224,106,.20);
    }
    .btn-main:hover{
      color:#111612;
      transform:translateY(-2px);
      box-shadow:0 20px 36px rgba(114,224,106,.28);
    }
    .btn-ghost{
      background:transparent;
      color:var(--text);
      border-color:rgba(114,224,106,.24);
      box-shadow:0 0 0 1px rgba(114,224,106,.06) inset;
    }
    .btn-ghost:hover{
      color:#fff;
      background:rgba(114,224,106,.10);
      transform:translateY(-2px);
    }
    .btn-soft{
      background:rgba(255,255,255,.04);
      color:var(--text);
      border-color:rgba(255,255,255,.10);
    }
    .btn-soft:hover{
      color:#fff;
      background:rgba(255,255,255,.08);
      transform:translateY(-2px);
    }

    .chip-row{
      display:flex;
      flex-wrap:wrap;
      gap:10px;
      margin-top:18px;
    }
    .chip{
      display:inline-flex;
      align-items:center;
      gap:8px;
      padding:.55rem .8rem;
      border-radius:999px;
      background:rgba(255,255,255,.04);
      border:1px solid rgba(255,255,255,.10);
      color:rgba(245,247,242,.82);
      font-size:.88rem;
      font-weight:700;
    }
    .chip .mini-dot{
      width:8px;height:8px;border-radius:50%;
      background:var(--brand);
      box-shadow:0 0 0 5px rgba(114,224,106,.11);
    }

    .hero-panel{
      background:
        linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02)),
        linear-gradient(180deg, rgba(20,24,22,.96), rgba(12,15,14,.98));
      border:1px solid rgba(114,224,106,.18);
      border-radius:var(--radius-xl);
      box-shadow:var(--shadow);
      padding:24px;
      position:relative;
    }
    .hero-panel::before{
      content:"";
      position:absolute;
      inset:0;
      background:
        linear-gradient(90deg, transparent 0 49%, rgba(114,224,106,.05) 50%, transparent 51%) 0 0/100% 100%,
        linear-gradient(rgba(255,255,255,.03) 1px, transparent 1px) 0 0/100% 30px;
      opacity:.55;
      pointer-events:none;
      border-radius:inherit;
    }
    .panel-head{
      position:relative;
      z-index:1;
      display:flex;
      justify-content:space-between;
      gap:18px;
      align-items:flex-start;
      margin-bottom:20px;
    }
    .panel-title{
      font-size:1.06rem;
      font-weight:800;
      margin:0 0 6px;
    }
    .panel-sub{
      color:var(--muted);
      font-size:.92rem;
      margin:0;
    }
    .status-pill{
      display:inline-flex;
      align-items:center;
      gap:8px;
      padding:.45rem .72rem;
      border-radius:999px;
      background:rgba(114,224,106,.10);
      border:1px solid rgba(114,224,106,.18);
      color:#DFF8D9;
      font-size:.82rem;
      font-weight:700;
      white-space:nowrap;
    }
    .status-pill .s-dot{
      width:8px;height:8px;border-radius:50%;
      background:var(--brand);
      box-shadow:0 0 0 5px rgba(114,224,106,.12);
    }

    .entry-grid{
      position:relative;
      z-index:1;
      display:grid;
      grid-template-columns:repeat(2, minmax(0,1fr));
      gap:14px;
    }
    .entry-card{
      background:rgba(255,255,255,.03);
      border:1px solid rgba(255,255,255,.08);
      border-radius:22px;
      padding:16px;
      min-height:144px;
      transition:all .25s ease;
    }
    .entry-card:hover{
      transform:translateY(-3px);
      border-color:rgba(114,224,106,.26);
      box-shadow:0 16px 28px rgba(0,0,0,.24);
    }
    .entry-card .meta{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:10px;
      margin-bottom:14px;
    }
    .entry-card .label{
      color:#CBEBC8;
      font-weight:800;
      font-size:.9rem;
    }
    .entry-card .time{
      color:var(--muted);
      font-size:.82rem;
    }
    .entry-card p{
      margin:0 0 12px;
      color:rgba(245,247,242,.82);
      font-size:.92rem;
      line-height:1.7;
    }
    .tag-list{
      display:flex;
      flex-wrap:wrap;
      gap:8px;
    }
    .tag{
      display:inline-flex;
      align-items:center;
      gap:6px;
      padding:.34rem .62rem;
      border-radius:999px;
      background:rgba(114,224,106,.08);
      border:1px solid rgba(114,224,106,.16);
      color:#DFF8D9;
      font-size:.8rem;
      font-weight:700;
    }

    .trust-strip{
      margin-top:22px;
      display:grid;
      grid-template-columns:repeat(4, minmax(0,1fr));
      gap:12px;
      position:relative;
      z-index:1;
    }
    .trust-item{
      display:flex;
      align-items:center;
      gap:10px;
      padding:12px 14px;
      border-radius:18px;
      background:rgba(255,255,255,.035);
      border:1px solid rgba(255,255,255,.08);
      color:rgba(245,247,242,.84);
      font-size:.88rem;
      font-weight:700;
    }
    .trust-icon{
      width:32px;height:32px;
      border-radius:12px;
      display:grid;
      place-items:center;
      background:rgba(114,224,106,.10);
      border:1px solid rgba(114,224,106,.16);
      flex:none;
    }

    .section-title-wrap{
      max-width:820px;
      margin-bottom:28px;
    }
    .section-lead{
      color:var(--muted);
      font-size:1rem;
      margin:0;
    }
    .section-light .section-lead{color:var(--muted-dark)}
    .section-kicker{
      display:inline-flex;
      align-items:center;
      gap:8px;
      margin-bottom:14px;
      color:var(--brand);
      font-weight:800;
      letter-spacing:.08em;
      font-size:.84rem;
      text-transform:none;
    }

    .quick-entry{
      margin-top:-14px;
      padding-top:0;
      position:relative;
      z-index:2;
    }
    .entry-tiles{
      display:grid;
      grid-template-columns:repeat(2,minmax(0,1fr));
      gap:16px;
    }
    .tile{
      background:linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.02));
      border:1px solid rgba(114,224,106,.14);
      border-radius:var(--radius-lg);
      padding:22px;
      box-shadow:var(--shadow-soft);
      min-height:180px;
      transition:all .25s ease;
    }
    .tile:hover{
      transform:translateY(-3px);
      border-color:rgba(114,224,106,.25);
      box-shadow:0 16px 34px rgba(0,0,0,.18);
    }
    .tile .icon-badge{
      width:48px;height:48px;
      border-radius:16px;
      display:grid;
      place-items:center;
      margin-bottom:16px;
      background:rgba(114,224,106,.10);
      border:1px solid rgba(114,224,106,.20);
    }
    .tile p{
      margin:0 0 18px;
      color:inherit;
      opacity:.86;
    }

    .step-line{
      position:relative;
    }
    .step-line::before{
      content:"";
      position:absolute;
      left:14px;
      right:14px;
      top:47px;
      height:1px;
      background:linear-gradient(90deg, rgba(114,224,106,.08), rgba(114,224,106,.35), rgba(114,224,106,.08));
    }
    .step-grid{
      display:grid;
      grid-template-columns:repeat(3,minmax(0,1fr));
      gap:16px;
      position:relative;
      z-index:1;
    }
    .step-card{
      background:rgba(255,255,255,.03);
      border:1px solid rgba(114,224,106,.15);
      border-radius:24px;
      padding:22px;
      position:relative;
      overflow:hidden;
      min-height:200px;
      transition:all .25s ease;
    }
    .step-card:hover{
      transform:translateY(-4px);
      border-color:rgba(114,224,106,.28);
      box-shadow:var(--shadow-soft);
    }
    .step-num{
      width:38px;height:38px;
      border-radius:50%;
      display:grid;
      place-items:center;
      background:linear-gradient(135deg,var(--brand-3),var(--brand));
      color:#111612;
      font-weight:900;
      box-shadow:0 10px 18px rgba(114,224,106,.16);
      margin-bottom:14px;
    }
    .step-card p{
      color:inherit;
      opacity:.84;
      margin:0;
    }
    .step-card .foot{
      margin-top:18px;
      display:flex;
      gap:8px;
      flex-wrap:wrap;
    }

    .proof-wrap{
      display:grid;
      grid-template-columns:1.1fr .9fr;
      gap:18px;
    }
    .data-board{
      background:linear-gradient(180deg, rgba(20,24,22,.98), rgba(13,16,14,.98));
      border:1px solid rgba(114,224,106,.16);
      border-radius:var(--radius-xl);
      padding:24px;
      box-shadow:var(--shadow);
    }
    .data-grid{
      display:grid;
      grid-template-columns:repeat(2,minmax(0,1fr));
      gap:12px;
      margin-top:18px;
    }
    .data-card{
      padding:18px;
      border-radius:20px;
      background:rgba(255,255,255,.03);
      border:1px solid rgba(255,255,255,.08);
    }
    .data-value{
      font-size:1.7rem;
      font-weight:900;
      line-height:1;
      margin-bottom:8px;
      color:#F2FFF0;
    }
    .data-label{
      font-size:.9rem;
      color:rgba(245,247,242,.76);
      margin-bottom:6px;
      font-weight:700;
    }
    .data-note{
      font-size:.84rem;
      color:var(--muted);
      margin:0;
    }
    .feedback-stack{
      display:grid;
      gap:14px;
    }
    .feedback{
      background:#F7F8F4;
      color:var(--text-dark);
      border:1px solid rgba(20,24,22,.08);
      border-radius:24px;
      padding:18px 18px 16px;
      box-shadow:0 14px 30px rgba(14,17,16,.08);
    }
    .feedback .badge-row{
      display:flex;
      gap:8px;
      flex-wrap:wrap;
      margin-bottom:12px;
    }
    .feedback .mini-tag{
      display:inline-flex;
      align-items:center;
      gap:6px;
      padding:.28rem .58rem;
      border-radius:999px;
      background:rgba(114,224,106,.12);
      color:#1E281F;
      font-size:.78rem;
      font-weight:800;
    }
    .feedback p{
      margin:0;
      color:#334037;
      font-size:.95rem;
      line-height:1.8;
    }

    .update-list{
      display:grid;
      gap:12px;
      margin-top:18px;
    }
    .update-item{
      display:flex;
      gap:14px;
      padding:16px 18px;
      border-radius:22px;
      background:#FFFFFF;
      border:1px solid rgba(20,24,22,.08);
      box-shadow:0 10px 24px rgba(14,17,16,.05);
      color:var(--text-dark);
      align-items:flex-start;
    }
    .update-item .bullet{
      width:12px;
      height:12px;
      border-radius:50%;
      margin-top:7px;
      background:var(--brand);
      box-shadow:0 0 0 6px rgba(114,224,106,.12);
      flex:none;
    }
    .update-item strong{
      display:block;
      margin-bottom:4px;
    }
    .update-item span{
      color:var(--muted-dark);
      font-size:.92rem;
    }

    .accordion-wrap{
      max-width:100%;
    }
    .accordion{
      --bs-accordion-bg: transparent;
      --bs-accordion-color: var(--text);
      --bs-accordion-border-color: rgba(114,224,106,.16);
      --bs-accordion-btn-color: var(--text);
      --bs-accordion-btn-bg: rgba(255,255,255,.03);
      --bs-accordion-active-color: var(--text);
      --bs-accordion-active-bg: rgba(114,224,106,.08);
      --bs-accordion-btn-focus-box-shadow: 0 0 0 .25rem rgba(114,224,106,.16);
      --bs-accordion-btn-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none' viewBox='0 0 20 20'%3E%3Cpath stroke='%2372E06A' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.8' d='M5 7.5l5 5 5-5'/%3E%3C/svg%3E");
      --bs-accordion-btn-active-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none' viewBox='0 0 20 20'%3E%3Cpath stroke='%2372E06A' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.8' d='M5 12.5l5-5 5 5'/%3E%3C/svg%3E");
    }
    .accordion-item{
      background:rgba(255,255,255,.02);
      border:1px solid rgba(114,224,106,.14);
      border-radius:20px !important;
      overflow:hidden;
      box-shadow:0 12px 24px rgba(0,0,0,.10);
      margin-bottom:12px;
    }
    .accordion-button{
      border:0;
      padding:1rem 1.1rem;
      font-weight:800;
      color:var(--text);
      background:rgba(255,255,255,.03);
      box-shadow:none!important;
    }
    .accordion-button:not(.collapsed){
      color:var(--text);
      background:rgba(114,224,106,.08);
    }
    .accordion-button::after{
      filter:hue-rotate(75deg) saturate(1.5);
    }
    .accordion-body{
      padding:0 1.1rem 1rem;
      color:rgba(245,247,242,.84);
      line-height:1.85;
    }
    .section-light .accordion-item{
      background:#fff;
      border-color:rgba(20,24,22,.08);
    }
    .section-light .accordion-button{
      color:var(--text-dark);
      background:#fff;
    }
    .section-light .accordion-button:not(.collapsed){
      background:rgba(114,224,106,.10);
    }
    .section-light .accordion-body{
      color:#334037;
    }

    .cta-band{
      background:
        radial-gradient(circle at 18% 22%, rgba(114,224,106,.18), transparent 28%),
        radial-gradient(circle at 82% 18%, rgba(156,242,197,.10), transparent 26%),
        linear-gradient(135deg, #151915 0%, #0E1110 100%);
      border-top:1px solid rgba(114,224,106,.16);
      border-bottom:1px solid rgba(114,224,106,.14);
    }
    .cta-card{
      background:rgba(255,255,255,.03);
      border:1px solid rgba(114,224,106,.18);
      border-radius:32px;
      padding:30px;
      box-shadow:var(--shadow);
      display:grid;
      grid-template-columns:1fr auto;
      gap:20px;
      align-items:center;
    }
    .cta-card p{
      margin:0;
      color:rgba(245,247,242,.84);
      max-width:720px;
    }
    .cta-notes{
      display:flex;
      flex-wrap:wrap;
      gap:10px;
      margin-top:18px;
    }
    .note{
      display:inline-flex;
      align-items:center;
      gap:8px;
      padding:.46rem .72rem;
      border-radius:999px;
      background:rgba(255,255,255,.04);
      border:1px solid rgba(255,255,255,.08);
      color:rgba(245,247,242,.84);
      font-size:.88rem;
      font-weight:700;
    }

    .site-footer{
      background:#0B0F0E;
      color:rgba(245,247,242,.80);
      border-top:1px solid rgba(255,255,255,.07);
      padding:30px 0 18px;
    }
    .footer-top{
      display:grid;
      grid-template-columns:1.2fr .8fr .8fr;
      gap:24px;
      padding:16px 0 24px;
    }
    .footer-brand{
      display:flex;
      align-items:center;
      gap:12px;
      margin-bottom:14px;
      font-weight:800;
      font-size:1.05rem;
      color:#fff;
    }
    .footer-col h4{
      font-size:.96rem;
      margin:0 0 14px;
      font-weight:800;
      color:#fff;
    }
    .footer-links{
      display:grid;
      gap:10px;
    }
    .footer-links a{
      color:rgba(245,247,242,.76);
    }
    .footer-links a:hover{color:var(--brand)}
    .footer-note{
      color:var(--muted);
      font-size:.92rem;
      line-height:1.8;
      margin:0;
    }
    .footer-bottom{
      padding-top:16px;
      border-top:1px solid rgba(255,255,255,.08);
      display:flex;
      flex-wrap:wrap;
      gap:12px 18px;
      justify-content:space-between;
      align-items:center;
      color:rgba(245,247,242,.62);
      font-size:.86rem;
    }

    .light-card{
      background:#fff;
      color:var(--text-dark);
      border:1px solid rgba(20,24,22,.08);
      border-radius:24px;
      box-shadow:0 12px 30px rgba(14,17,16,.08);
    }
    .light-card .card-body{
      padding:22px;
    }

    .mini-list{
      display:grid;
      gap:12px;
    }
    .mini-row{
      display:flex;
      align-items:flex-start;
      gap:12px;
      padding:14px 0;
      border-bottom:1px solid rgba(20,24,22,.08);
    }
    .mini-row:last-child{border-bottom:0}
    .mini-index{
      width:30px;height:30px;
      border-radius:12px;
      display:grid;
      place-items:center;
      background:rgba(114,224,106,.12);
      color:#1A241C;
      font-weight:900;
      flex:none;
    }
    .mini-row strong{
      display:block;
      margin-bottom:4px;
    }
    .mini-row span{
      display:block;
      color:var(--muted-dark);
      font-size:.92rem;
      line-height:1.7;
    }

    .flow-tags{
      display:flex;
      flex-wrap:wrap;
      gap:10px;
      margin-top:12px;
    }
    .flow-tag{
      display:inline-flex;
      align-items:center;
      gap:8px;
      padding:.46rem .72rem;
      border-radius:999px;
      background:rgba(114,224,106,.08);
      border:1px solid rgba(114,224,106,.16);
      color:inherit;
      font-size:.88rem;
      font-weight:700;
    }

    @media (max-width: 1199.98px){
      .hero-grid,
      .proof-wrap{
        grid-template-columns:1fr;
      }
      .footer-top{
        grid-template-columns:1fr 1fr;
      }
    }

    @media (max-width: 991.98px){
      .navbar-collapse{
        margin-top:14px;
        padding:14px;
        border-radius:22px;
        background:rgba(255,255,255,.03);
        border:1px solid rgba(255,255,255,.08);
      }
      .nav-cta{
        width:100%;
      }
      .hero{
        min-height:auto;
        padding:40px 0 30px;
      }
      .section-pad{
        padding:76px 0;
      }
      .section-pad-sm{
        padding:60px 0;
      }
      .entry-tiles,
      .step-grid,
      .data-grid,
      .trust-strip,
      .footer-top{
        grid-template-columns:1fr 1fr;
      }
      .cta-card{
        grid-template-columns:1fr;
      }
      .step-line::before{display:none}
    }

    @media (max-width: 767.98px){
      .container-fluid-shell{
        padding-left:16px;
        padding-right:16px;
      }
      h1{font-size:clamp(2.05rem, 10vw, 2.7rem)}
      h2{font-size:clamp(1.55rem, 7vw, 2.2rem)}
      .hero-panel,
      .data-board,
      .tile,
      .step-card,
      .cta-card{
        border-radius:22px;
      }
      .hero-grid,
      .entry-tiles,
      .step-grid,
      .data-grid,
      .trust-strip,
      .footer-top{
        grid-template-columns:1fr;
      }
      .trust-item{
        justify-content:flex-start;
      }
      .hero-actions .btn-main,
      .hero-actions .btn-ghost{
        width:100%;
      }
      .hero-copy{
        font-size:1rem;
      }
      .entry-card{
        min-height:auto;
      }
      .section-pad{
        padding:62px 0;
      }
      .section-pad-sm{
        padding:50px 0;
      }
      .cta-card{
        padding:22px;
      }
      .footer-bottom{
        flex-direction:column;
        align-items:flex-start;
      }
    }

    @media (max-width: 575.98px){
      .navbar-brand{
        font-size:.96rem;
      }
      .brand-mark{
        width:36px;height:36px;border-radius:12px;
      }
      .nav-link{
        padding:.7rem .85rem!important;
      }
      .nav-cta,
      .btn-main,
      .btn-ghost,
      .btn-soft{
        min-height:44px;
      }
      .hero-panel,
      .data-board,
      .tile,
      .step-card,
      .feedback,
      .light-card,
      .update-item{
        border-radius:18px;
      }
      .panel-head{
        flex-direction:column;
      }
      .chip-row{
        gap:8px;
      }
      .chip,
      .tag,
      .note,
      .flow-tag{
        font-size:.8rem;
      }
    }

/* roulang page: category1 */
:root{
      --bg:#0e1110;
      --bg-2:#141816;
      --panel:#181d1a;
      --panel-2:#f6f7f2;
      --card:#1a201c;
      --card-light:#fbfcf8;
      --text:#f5f7f2;
      --text-dark:#1d241f;
      --muted:#a7b1a9;
      --muted-dark:#69726b;
      --line:rgba(114,224,106,.22);
      --line-strong:rgba(114,224,106,.38);
      --green:#72e06a;
      --green-2:#9cf2c5;
      --lime:#b8ff4d;
      --shadow:0 18px 60px rgba(0,0,0,.28);
      --shadow-soft:0 14px 34px rgba(0,0,0,.18);
      --radius-xl:30px;
      --radius-lg:22px;
      --radius-md:16px;
      --radius-sm:12px;
      --container:1280px;
      --space:clamp(20px,2.4vw,32px);
      --section-space:clamp(56px,7vw,112px);
      --header-h:80px;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      font-family:PingFang SC,Microsoft YaHei,Noto Sans SC,Arial,sans-serif;
      color:var(--text-dark);
      background:
        linear-gradient(180deg,#0e1110 0%, #111613 18%, #f5f7f2 18%, #f5f7f2 100%);
      line-height:1.75;
      overflow-x:hidden;
    }
    body::before{
      content:"";
      position:fixed;
      inset:0;
      pointer-events:none;
      background:
        linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px);
      background-size:36px 36px;
      mask-image:linear-gradient(180deg, rgba(0,0,0,.55), rgba(0,0,0,0) 78%);
      opacity:.26;
      z-index:0;
    }
    a{color:inherit;text-decoration:none}
    a:hover{color:inherit}
    img{max-width:100%;display:block}
    button,input,textarea,select{font:inherit}
    ::selection{background:rgba(114,224,106,.24);color:#fff}
    .container-fluid-shell{
      width:min(var(--container), calc(100% - 32px));
      margin-inline:auto;
      position:relative;
      z-index:1;
    }
    .site-header{
      position:sticky;
      top:0;
      z-index:1030;
      background:rgba(14,17,16,.68);
      backdrop-filter:saturate(145%) blur(12px);
      border-bottom:1px solid rgba(255,255,255,.08);
      box-shadow:0 1px 0 rgba(255,255,255,.04);
    }
    .site-header.scrolled{
      box-shadow:0 10px 30px rgba(0,0,0,.22);
      border-bottom-color:rgba(114,224,106,.14);
    }
    .navbar{
      min-height:var(--header-h);
      padding:.9rem 0;
    }
    .navbar-brand{
      display:inline-flex;
      align-items:center;
      gap:.78rem;
      color:#f7faf5;
      font-weight:800;
      letter-spacing:.02em;
      font-size:1.05rem;
    }
    .brand-mark{
      width:40px;height:40px;
      display:grid;place-items:center;
      flex:0 0 40px;
      filter:drop-shadow(0 0 12px rgba(114,224,106,.18));
    }
    .brand-mark svg{width:100%;height:100%}
    .navbar .nav-link{
      color:rgba(245,247,242,.74);
      font-weight:600;
      padding:.78rem 1rem;
      border-radius:999px;
      transition:all .2s ease;
      position:relative;
    }
    .navbar .nav-link:hover,
    .navbar .nav-link:focus{
      color:#fff;
      background:rgba(114,224,106,.08);
    }
    .navbar .nav-link.active{
      color:#fff;
      background:rgba(114,224,106,.12);
      box-shadow:inset 0 0 0 1px rgba(114,224,106,.18);
    }
    .nav-cta{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap:.52rem;
      min-height:44px;
      padding:.82rem 1.15rem;
      border-radius:999px;
      background:linear-gradient(135deg,var(--green) 0%, #9bf36d 100%);
      color:#0d130f;
      font-weight:800;
      box-shadow:0 12px 28px rgba(114,224,106,.22);
      transition:transform .18s ease, box-shadow .18s ease, filter .18s ease;
      white-space:nowrap;
    }
    .nav-cta:hover,
    .nav-cta:focus{
      transform:translateY(-2px);
      box-shadow:0 16px 34px rgba(114,224,106,.28);
      filter:brightness(1.03);
      color:#0d130f;
    }
    .navbar-toggler{
      border:1px solid rgba(114,224,106,.26);
      border-radius:14px;
      padding:.62rem .72rem;
      box-shadow:none!important;
    }
    .navbar-toggler:focus{box-shadow:0 0 0 .2rem rgba(114,224,106,.14)}
    .navbar-toggler-icon{
      background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath stroke='rgba(114,224,106,0.95)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
    }
    .navbar-collapse{
      transition:all .25s ease;
    }
    .hero{
      position:relative;
      overflow:hidden;
      padding:calc(var(--section-space) * .9) 0 clamp(42px, 6vw, 80px);
      background:
        radial-gradient(circle at 20% 20%, rgba(114,224,106,.18), transparent 28%),
        radial-gradient(circle at 80% 30%, rgba(156,242,197,.10), transparent 22%),
        linear-gradient(180deg, #111613 0%, #0e1110 100%);
      color:var(--text);
      border-bottom:1px solid rgba(114,224,106,.12);
    }
    .hero::after{
      content:"";
      position:absolute;
      inset:0;
      background:
        linear-gradient(115deg, transparent 0 40%, rgba(114,224,106,.09) 40.3%, transparent 40.6% 100%),
        linear-gradient(90deg, transparent 0 72%, rgba(255,255,255,.04) 72.2%, transparent 72.5%);
      opacity:.75;
      pointer-events:none;
    }
    .hero-grid{
      display:grid;
      grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);
      gap:clamp(22px, 4vw, 46px);
      align-items:center;
      position:relative;
      z-index:1;
    }
    .eyebrow{
      display:inline-flex;
      align-items:center;
      gap:.55rem;
      border-radius:999px;
      border:1px solid rgba(114,224,106,.24);
      padding:.45rem .8rem;
      font-size:.88rem;
      color:#d6f8d7;
      background:rgba(114,224,106,.06);
      letter-spacing:.04em;
    }
    .eyebrow .dot{
      width:8px;height:8px;border-radius:50%;
      background:var(--green);
      box-shadow:0 0 0 6px rgba(114,224,106,.12);
      flex:0 0 auto;
    }
    .hero h1{
      margin:.95rem 0 1rem;
      font-size:clamp(2.25rem, 5vw, 4rem);
      line-height:1.12;
      letter-spacing:-.03em;
      font-weight:800;
      max-width:11.5ch;
    }
    .hero p.lead{
      font-size:clamp(1.02rem, 1.85vw, 1.18rem);
      color:rgba(245,247,242,.82);
      max-width:44rem;
      margin:0 0 1.4rem;
    }
    .hero-actions{
      display:flex;
      flex-wrap:wrap;
      gap:.9rem;
      margin-bottom:1.35rem;
    }
    .btn-modern{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap:.55rem;
      min-height:48px;
      padding:.92rem 1.3rem;
      border-radius:999px;
      border:1px solid transparent;
      font-weight:800;
      transition:transform .18s ease, box-shadow .18s ease, background .18s ease, border-color .18s ease;
    }
    .btn-primary-modern{
      background:linear-gradient(135deg,var(--green) 0%, #9df462 100%);
      color:#0b120d;
      box-shadow:0 16px 34px rgba(114,224,106,.22);
    }
    .btn-primary-modern:hover,
    .btn-primary-modern:focus{
      transform:translateY(-2px);
      color:#0b120d;
      box-shadow:0 22px 44px rgba(114,224,106,.26);
    }
    .btn-secondary-modern{
      background:rgba(255,255,255,.03);
      border-color:rgba(114,224,106,.28);
      color:#eef3ec;
    }
    .btn-secondary-modern:hover,
    .btn-secondary-modern:focus{
      transform:translateY(-2px);
      background:rgba(114,224,106,.1);
      border-color:rgba(114,224,106,.42);
      color:#fff;
    }
    .trust-row{
      display:flex;
      flex-wrap:wrap;
      gap:.7rem;
      margin-top:1rem;
    }
    .trust-pill{
      display:inline-flex;
      align-items:center;
      gap:.45rem;
      padding:.55rem .82rem;
      border-radius:999px;
      font-size:.88rem;
      color:#dce7dd;
      border:1px solid rgba(255,255,255,.09);
      background:rgba(255,255,255,.03);
    }
    .trust-pill i{
      width:8px;height:8px;
      border-radius:50%;
      background:var(--green);
      box-shadow:0 0 0 4px rgba(114,224,106,.12);
      display:inline-block;
    }
    .hero-panel{
      background:linear-gradient(180deg, rgba(24,29,26,.96), rgba(17,20,18,.95));
      border:1px solid rgba(114,224,106,.18);
      border-radius:var(--radius-xl);
      box-shadow:var(--shadow);
      padding:clamp(18px, 2.4vw, 26px);
      position:relative;
      overflow:hidden;
    }
    .hero-panel::before{
      content:"";
      position:absolute;
      inset:-1px;
      background:
        radial-gradient(circle at 18% 20%, rgba(114,224,106,.16), transparent 28%),
        radial-gradient(circle at 84% 12%, rgba(156,242,197,.08), transparent 22%);
      pointer-events:none;
      opacity:.9;
    }
    .hero-panel > *{position:relative;z-index:1}
    .panel-top{
      display:flex;
      align-items:flex-start;
      justify-content:space-between;
      gap:1rem;
      margin-bottom:1rem;
    }
    .panel-top h2{
      font-size:1rem;
      margin:0;
      color:#fff;
      font-weight:800;
      letter-spacing:.02em;
    }
    .panel-status{
      display:inline-flex;
      align-items:center;
      gap:.45rem;
      color:#bff4be;
      font-size:.88rem;
      white-space:nowrap;
    }
    .status-dot{
      width:9px;height:9px;border-radius:50%;
      background:var(--green);
      box-shadow:0 0 0 6px rgba(114,224,106,.12);
      flex:0 0 auto;
    }
    .entry-matrix{
      display:grid;
      grid-template-columns:repeat(2,minmax(0,1fr));
      gap:.9rem;
      margin-bottom:1rem;
    }
    .entry-tile{
      min-height:100px;
      border-radius:22px;
      border:1px solid rgba(255,255,255,.09);
      background:rgba(255,255,255,.03);
      padding:1rem;
      transition:transform .18s ease, border-color .18s ease, background .18s ease;
    }
    .entry-tile:hover{
      transform:translateY(-2px);
      border-color:rgba(114,224,106,.28);
      background:rgba(114,224,106,.05);
    }
    .entry-tile .label{
      display:inline-flex;
      padding:.34rem .6rem;
      border-radius:999px;
      font-size:.78rem;
      color:#0d130f;
      background:linear-gradient(135deg,#b8ff4d 0%, #88ed76 100%);
      font-weight:800;
      margin-bottom:.7rem;
    }
    .entry-tile h3{
      font-size:1rem;
      margin:0 0 .35rem;
      color:#f6faf4;
      font-weight:750;
    }
    .entry-tile p{
      margin:0;
      color:rgba(245,247,242,.72);
      font-size:.93rem;
      line-height:1.65;
    }
    .step-list{
      margin:0;
      padding:0;
      list-style:none;
      display:grid;
      gap:.7rem;
    }
    .step-list li{
      display:flex;
      gap:.78rem;
      align-items:flex-start;
      padding:.86rem .9rem;
      border-radius:18px;
      border:1px solid rgba(114,224,106,.12);
      background:rgba(255,255,255,.02);
    }
    .step-no{
      width:34px;
      height:34px;
      border-radius:50%;
      display:grid;
      place-items:center;
      background:rgba(114,224,106,.14);
      color:#c8f5c3;
      font-weight:800;
      flex:0 0 auto;
      box-shadow:inset 0 0 0 1px rgba(114,224,106,.16);
    }
    .step-list strong{
      display:block;
      color:#f8fbf6;
      margin-bottom:.15rem;
      font-size:.96rem;
    }
    .step-list span{
      color:rgba(245,247,242,.7);
      font-size:.9rem;
      line-height:1.55;
    }
    .mini-note{
      margin-top:1rem;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:1rem;
      padding:1rem 1.05rem;
      border-radius:20px;
      background:rgba(255,255,255,.03);
      border:1px solid rgba(255,255,255,.08);
      color:rgba(245,247,242,.76);
      font-size:.92rem;
    }
    .mini-note strong{color:#fff}
    .section-band{
      padding:var(--section-space) 0;
      position:relative;
      z-index:1;
    }
    .section-title{
      margin-bottom:1.6rem;
    }
    .section-title .kicker{
      display:inline-flex;
      align-items:center;
      gap:.5rem;
      padding:.36rem .7rem;
      border-radius:999px;
      background:rgba(114,224,106,.08);
      color:#356d31;
      border:1px solid rgba(114,224,106,.18);
      font-weight:800;
      font-size:.84rem;
      letter-spacing:.04em;
    }
    .section-title h2{
      margin:.7rem 0 .5rem;
      font-size:clamp(1.8rem, 3vw, 2.75rem);
      line-height:1.18;
      font-weight:800;
      letter-spacing:-.03em;
      color:var(--text-dark);
    }
    .section-title p{
      margin:0;
      max-width:52rem;
      color:var(--muted-dark);
      font-size:1.02rem;
    }
    .step-flow{
      display:grid;
      grid-template-columns:repeat(3,minmax(0,1fr));
      gap:1rem;
      margin-top:1.2rem;
    }
    .flow-card{
      background:#fff;
      border-radius:var(--radius-lg);
      border:1px solid rgba(114,224,106,.12);
      box-shadow:var(--shadow-soft);
      padding:1.25rem 1.15rem 1.15rem;
      position:relative;
      overflow:hidden;
      transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    }
    .flow-card:hover{
      transform:translateY(-3px);
      border-color:rgba(114,224,106,.24);
      box-shadow:0 18px 42px rgba(19,23,20,.11);
    }
    .flow-card::before{
      content:"";
      position:absolute;
      inset:0 0 auto 0;
      height:4px;
      background:linear-gradient(90deg,var(--green),var(--lime));
    }
    .flow-head{
      display:flex;
      align-items:center;
      gap:.75rem;
      margin-bottom:.8rem;
    }
    .flow-index{
      width:42px;height:42px;
      border-radius:14px;
      display:grid;
      place-items:center;
      background:rgba(114,224,106,.12);
      color:#2b5a28;
      font-weight:900;
      box-shadow:inset 0 0 0 1px rgba(114,224,106,.22);
    }
    .flow-card h3{
      margin:0;
      font-size:1.1rem;
      font-weight:800;
      color:#182019;
    }
    .flow-card p{
      margin:0;
      color:var(--muted-dark);
      line-height:1.72;
      font-size:.98rem;
    }
    .flow-links{
      display:flex;
      flex-wrap:wrap;
      gap:.55rem;
      margin-top:1rem;
    }
    .chip{
      display:inline-flex;
      align-items:center;
      gap:.35rem;
      border-radius:999px;
      border:1px solid rgba(114,224,106,.18);
      background:rgba(114,224,106,.08);
      color:#2d5c2b;
      padding:.42rem .72rem;
      font-size:.84rem;
      font-weight:700;
    }
    .chip.active{
      background:linear-gradient(135deg,rgba(114,224,106,.18),rgba(156,242,197,.18));
      color:#143114;
      border-color:rgba(114,224,106,.3);
    }
    .main-section{
      padding-top:0;
    }
    .main-grid{
      display:grid;
      grid-template-columns:minmax(0,8.3fr) minmax(280px,3.7fr);
      gap:1.2rem;
      align-items:start;
    }
    .toolbar{
      background:#fff;
      border:1px solid rgba(114,224,106,.12);
      border-radius:var(--radius-lg);
      box-shadow:var(--shadow-soft);
      padding:1rem;
      margin-bottom:1rem;
    }
    .toolbar-top{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:1rem;
      flex-wrap:wrap;
      margin-bottom:.9rem;
    }
    .toolbar-top h3{
      margin:0;
      font-size:1.1rem;
      font-weight:800;
      color:#182019;
    }
    .toolbar-top span{
      color:var(--muted-dark);
      font-size:.92rem;
    }
    .search-wrap{
      position:relative;
      flex:1 1 280px;
    }
    .search-wrap input{
      width:100%;
      min-height:48px;
      border-radius:999px;
      border:1px solid rgba(114,224,106,.18);
      padding:0 1rem 0 3rem;
      background:#fdfefc;
      color:#182019;
      outline:none;
      transition:box-shadow .18s ease, border-color .18s ease, background .18s ease;
    }
    .search-wrap input::placeholder{color:#82908a}
    .search-wrap input:focus{
      border-color:rgba(114,224,106,.44);
      box-shadow:0 0 0 .22rem rgba(114,224,106,.13);
      background:#fff;
    }
    .search-ico{
      position:absolute;
      left:1rem;
      top:50%;
      transform:translateY(-50%);
      color:#6f7a72;
      pointer-events:none;
    }
    .filter-pills{
      display:flex;
      flex-wrap:wrap;
      gap:.55rem;
    }
    .filter-btn{
      border:1px solid rgba(114,224,106,.16);
      background:#f8faf6;
      color:#31402f;
      border-radius:999px;
      padding:.58rem .92rem;
      font-weight:700;
      font-size:.88rem;
      transition:all .18s ease;
      cursor:pointer;
    }
    .filter-btn:hover{
      transform:translateY(-1px);
      border-color:rgba(114,224,106,.28);
    }
    .filter-btn.active{
      background:linear-gradient(135deg,#e7f8df,#d8f9df);
      border-color:rgba(114,224,106,.38);
      color:#173315;
      box-shadow:0 10px 26px rgba(114,224,106,.14);
    }
    .content-grid{
      display:grid;
      grid-template-columns:repeat(2,minmax(0,1fr));
      gap:1rem;
    }
    .content-card{
      background:#fff;
      border-radius:var(--radius-lg);
      border:1px solid rgba(114,224,106,.12);
      overflow:hidden;
      box-shadow:var(--shadow-soft);
      transition:transform .18s ease, border-color .18s ease, box-shadow .18s ease;
      display:flex;
      flex-direction:column;
      min-height:100%;
    }
    .content-card:hover{
      transform:translateY(-3px);
      border-color:rgba(114,224,106,.24);
      box-shadow:0 18px 44px rgba(19,23,20,.12);
    }
    .card-band{
      height:78px;
      background:
        linear-gradient(120deg, rgba(114,224,106,.18), rgba(156,242,197,.05)),
        radial-gradient(circle at 20% 40%, rgba(114,224,106,.22), transparent 30%);
      border-bottom:1px solid rgba(114,224,106,.1);
      position:relative;
    }
    .card-band::after{
      content:"";
      position:absolute;
      inset:0;
      background:
        linear-gradient(90deg, transparent 0 25%, rgba(255,255,255,.26) 25.4%, transparent 25.8% 100%),
        linear-gradient(0deg, transparent 0 56%, rgba(255,255,255,.12) 56.2%, transparent 56.6% 100%);
      opacity:.35;
    }
    .card-body-wrap{
      padding:1.1rem 1.05rem 1rem;
      display:flex;
      flex-direction:column;
      gap:.9rem;
      flex:1 1 auto;
    }
    .content-card h3{
      font-size:1.1rem;
      line-height:1.34;
      margin:0;
      font-weight:800;
      color:#182019;
    }
    .content-card p{
      margin:0;
      color:var(--muted-dark);
      line-height:1.7;
      font-size:.96rem;
    }
    .meta-row{
      display:flex;
      flex-wrap:wrap;
      align-items:center;
      justify-content:space-between;
      gap:.7rem;
      margin-top:auto;
    }
    .tag-row{
      display:flex;
      flex-wrap:wrap;
      gap:.45rem;
    }
    .tag{
      display:inline-flex;
      align-items:center;
      gap:.3rem;
      padding:.35rem .58rem;
      border-radius:999px;
      font-size:.78rem;
      font-weight:700;
      color:#356d31;
      background:rgba(114,224,106,.08);
      border:1px solid rgba(114,224,106,.16);
    }
    .date{
      font-size:.82rem;
      color:#6d7770;
      white-space:nowrap;
    }
    .card-action{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap:.45rem;
      min-height:42px;
      padding:.64rem .92rem;
      border-radius:999px;
      background:#151a17;
      color:#fff;
      font-size:.88rem;
      font-weight:800;
      transition:transform .18s ease, background .18s ease, box-shadow .18s ease;
    }
    .card-action:hover,
    .card-action:focus{
      transform:translateY(-1px);
      color:#fff;
      background:#0f130f;
      box-shadow:0 10px 24px rgba(0,0,0,.12);
    }
    .sidebar{
      position:sticky;
      top:96px;
      display:grid;
      gap:1rem;
    }
    .side-card{
      background:#fff;
      border:1px solid rgba(114,224,106,.12);
      border-radius:var(--radius-lg);
      box-shadow:var(--shadow-soft);
      padding:1.05rem;
    }
    .side-card h3{
      margin:0 0 .75rem;
      font-size:1.02rem;
      font-weight:800;
      color:#19211b;
    }
    .alert-soft{
      border-radius:18px;
      border:1px solid rgba(114,224,106,.18);
      background:linear-gradient(180deg, rgba(114,224,106,.07), rgba(114,224,106,.03));
      padding:.95rem;
      color:#30402f;
    }
    .alert-soft strong{display:block;margin-bottom:.3rem;color:#183118}
    .alert-soft p{
      margin:0;
      color:#56615a;
      line-height:1.7;
      font-size:.93rem;
    }
    .mini-list{
      list-style:none;
      padding:0;
      margin:0;
      display:grid;
      gap:.7rem;
    }
    .mini-list li{
      display:flex;
      align-items:flex-start;
      gap:.68rem;
      color:#405045;
      font-size:.94rem;
      line-height:1.6;
    }
    .mini-list .bullet{
      width:10px;height:10px;border-radius:50%;
      margin-top:.45rem;
      background:var(--green);
      box-shadow:0 0 0 5px rgba(114,224,106,.12);
      flex:0 0 auto;
    }
    .popular-tags{
      display:flex;
      flex-wrap:wrap;
      gap:.55rem;
    }
    .popular-tags .tag{
      cursor:pointer;
    }
    .scenario{
      background:
        radial-gradient(circle at 20% 10%, rgba(114,224,106,.12), transparent 26%),
        linear-gradient(180deg, #f6f7f2 0%, #eef2ec 100%);
    }
    .scenario-grid{
      display:grid;
      grid-template-columns:minmax(0,1fr) minmax(0,1fr);
      gap:1rem;
      align-items:stretch;
    }
    .dashboard{
      border-radius:var(--radius-xl);
      background:linear-gradient(180deg, #151a17, #101412);
      color:#eef3eb;
      border:1px solid rgba(114,224,106,.16);
      box-shadow:var(--shadow);
      padding:1.2rem;
      overflow:hidden;
      position:relative;
    }
    .dashboard::before{
      content:"";
      position:absolute;
      inset:auto -15% -20% auto;
      width:240px;
      height:240px;
      border-radius:50%;
      border:1px solid rgba(114,224,106,.18);
      box-shadow:0 0 0 36px rgba(114,224,106,.04), 0 0 0 80px rgba(114,224,106,.02);
      opacity:.8;
    }
    .dashboard-head{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:1rem;
      margin-bottom:1rem;
      position:relative;
      z-index:1;
    }
    .dashboard-head h3{
      margin:0;
      font-size:1.12rem;
      font-weight:800;
    }
    .dashboard-head .live{
      display:inline-flex;
      align-items:center;
      gap:.45rem;
      color:#bff4be;
      font-size:.88rem;
    }
    .metric-grid{
      display:grid;
      grid-template-columns:repeat(2,minmax(0,1fr));
      gap:.8rem;
      position:relative;
      z-index:1;
    }
    .metric{
      border-radius:20px;
      background:rgba(255,255,255,.04);
      border:1px solid rgba(255,255,255,.08);
      padding:.95rem;
    }
    .metric .cap{
      font-size:.82rem;
      color:#b9c7bb;
      margin-bottom:.3rem;
    }
    .metric strong{
      font-size:1.08rem;
      display:block;
      color:#fff;
      line-height:1.3;
    }
    .metric span{
      display:block;
      color:rgba(245,247,242,.7);
      font-size:.88rem;
      margin-top:.25rem;
    }
    .feedback-stack{
      display:grid;
      gap:1rem;
    }
    .feedback-card{
      background:#fff;
      border:1px solid rgba(114,224,106,.12);
      border-radius:var(--radius-lg);
      box-shadow:var(--shadow-soft);
      padding:1.05rem 1rem;
    }
    .feedback-card .top{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:.8rem;
      margin-bottom:.75rem;
    }
    .feedback-card .top strong{
      font-size:1rem;
      color:#182019;
    }
    .feedback-card .badge{
      border-radius:999px;
      padding:.38rem .58rem;
      font-weight:800;
      color:#2a5a28;
      background:rgba(114,224,106,.1);
      border:1px solid rgba(114,224,106,.16);
    }
    .feedback-card p{
      margin:0;
      color:var(--muted-dark);
      line-height:1.72;
      font-size:.96rem;
    }
    .faq-area{
      background:#f7f9f4;
    }
    .faq-layout{
      display:grid;
      grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr);
      gap:1rem;
      align-items:start;
    }
    .faq-intro{
      background:#fff;
      border-radius:var(--radius-xl);
      border:1px solid rgba(114,224,106,.12);
      box-shadow:var(--shadow-soft);
      padding:1.2rem;
      position:sticky;
      top:96px;
    }
    .faq-intro h3{
      margin:0 0 .75rem;
      font-size:1.25rem;
      font-weight:800;
      color:#182019;
    }
    .faq-intro p{
      margin:0 0 1rem;
      color:var(--muted-dark);
      line-height:1.72;
    }
    .faq-mini{
      display:grid;
      gap:.65rem;
    }
    .faq-mini .row-item{
      display:flex;
      gap:.65rem;
      align-items:flex-start;
      color:#425046;
      font-size:.94rem;
      line-height:1.6;
    }
    .faq-mini .dot{
      width:10px;height:10px;border-radius:50%;
      background:var(--green);
      margin-top:.42rem;
      box-shadow:0 0 0 5px rgba(114,224,106,.12);
      flex:0 0 auto;
    }
    .faq-accordion .accordion-item{
      border:1px solid rgba(114,224,106,.12);
      border-radius:20px !important;
      overflow:hidden;
      background:#fff;
      box-shadow:var(--shadow-soft);
      margin-bottom:.85rem;
    }
    .faq-accordion .accordion-button{
      background:#fff;
      color:#182019;
      font-weight:800;
      padding:1rem 1rem;
      box-shadow:none!important;
    }
    .faq-accordion .accordion-button:not(.collapsed){
      background:linear-gradient(180deg, rgba(114,224,106,.09), rgba(114,224,106,.04));
      color:#173315;
    }
    .faq-accordion .accordion-button::after{
      background-image:none;
      content:"+";
      font-size:1.4rem;
      width:auto;
      height:auto;
      line-height:1;
      transform:none;
      color:#3c6738;
      font-weight:700;
    }
    .faq-accordion .accordion-button:not(.collapsed)::after{
      content:"–";
      color:#2c5b28;
    }
    .faq-accordion .accordion-body{
      color:var(--muted-dark);
      line-height:1.8;
      padding:0 1rem 1rem;
    }
    .cta-band{
      padding:0 0 var(--section-space);
    }
    .cta-shell{
      background:
        radial-gradient(circle at 20% 20%, rgba(114,224,106,.16), transparent 24%),
        radial-gradient(circle at 80% 10%, rgba(156,242,197,.08), transparent 18%),
        linear-gradient(180deg, #171b18, #0f1211);
      color:var(--text);
      border-radius:32px;
      border:1px solid rgba(114,224,106,.16);
      box-shadow:var(--shadow);
      padding:clamp(24px, 4vw, 36px);
      overflow:hidden;
      position:relative;
    }
    .cta-shell::after{
      content:"";
      position:absolute;
      inset:0;
      background:
        linear-gradient(120deg, transparent 0 62%, rgba(114,224,106,.08) 62.1%, transparent 62.5% 100%);
      pointer-events:none;
    }
    .cta-grid{
      display:grid;
      grid-template-columns:minmax(0,1.05fr) minmax(280px,.95fr);
      gap:1.1rem;
      align-items:center;
      position:relative;
      z-index:1;
    }
    .cta-shell h2{
      margin:0 0 .8rem;
      font-size:clamp(1.9rem, 3.8vw, 3rem);
      line-height:1.16;
      font-weight:800;
      letter-spacing:-.03em;
    }
    .cta-shell p{
      margin:0 0 1.15rem;
      color:rgba(245,247,242,.8);
      max-width:48rem;
      line-height:1.76;
      font-size:1.02rem;
    }
    .cta-list{
      display:grid;
      gap:.72rem;
      margin:0 0 1.25rem;
      padding:0;
      list-style:none;
    }
    .cta-list li{
      display:flex;
      align-items:flex-start;
      gap:.6rem;
      color:#e7f0e4;
      font-size:.95rem;
      line-height:1.65;
    }
    .cta-list .ok{
      width:18px;height:18px;border-radius:50%;
      background:rgba(114,224,106,.15);
      border:1px solid rgba(114,224,106,.3);
      display:grid;
      place-items:center;
      flex:0 0 auto;
      margin-top:.2rem;
      color:#9ef08d;
      font-weight:900;
      font-size:.8rem;
    }
    .cta-actions{
      display:flex;
      flex-wrap:wrap;
      gap:.8rem;
    }
    .cta-side{
      background:rgba(255,255,255,.03);
      border:1px solid rgba(255,255,255,.08);
      border-radius:24px;
      padding:1rem;
      display:grid;
      gap:.8rem;
      position:relative;
      z-index:1;
    }
    .cta-grid-mini{
      display:grid;
      grid-template-columns:repeat(2,minmax(0,1fr));
      gap:.75rem;
    }
    .cta-mini{
      min-height:90px;
      border-radius:20px;
      background:rgba(255,255,255,.04);
      border:1px solid rgba(255,255,255,.08);
      padding:.9rem;
    }
    .cta-mini span{
      display:block;
      color:#bfe5bb;
      font-size:.82rem;
      margin-bottom:.25rem;
    }
    .cta-mini strong{
      color:#fff;
      font-size:.98rem;
      line-height:1.4;
    }
    .site-footer{
      background:#0d120f;
      color:#e8f1e5;
      padding:clamp(34px, 5vw, 54px) 0 26px;
      border-top:1px solid rgba(114,224,106,.12);
      position:relative;
      z-index:1;
    }
    .footer-top{
      display:grid;
      grid-template-columns:1.35fr .9fr .9fr;
      gap:1rem;
      padding-bottom:1.2rem;
      border-bottom:1px solid rgba(255,255,255,.08);
    }
    .footer-brand{
      display:flex;
      align-items:center;
      gap:.75rem;
      margin-bottom:.8rem;
      font-weight:800;
      font-size:1.02rem;
    }
    .footer-note{
      margin:0;
      color:rgba(232,241,229,.74);
      line-height:1.75;
      max-width:32rem;
      font-size:.95rem;
    }
    .footer-col h4{
      margin:0 0 .8rem;
      font-size:1rem;
      font-weight:800;
      color:#fff;
    }
    .footer-links{
      display:grid;
      gap:.45rem;
    }
    .footer-links a{
      color:rgba(232,241,229,.76);
      padding:.12rem 0;
      width:fit-content;
      transition:color .18s ease, transform .18s ease;
    }
    .footer-links a:hover,
    .footer-links a:focus{
      color:#baf8b3;
      transform:translateX(2px);
    }
    .footer-bottom{
      display:flex;
      justify-content:space-between;
      gap:1rem;
      flex-wrap:wrap;
      padding-top:1rem;
      color:rgba(232,241,229,.68);
      font-size:.9rem;
    }
    .nav-link:focus-visible,
    .nav-cta:focus-visible,
    .btn-modern:focus-visible,
    .card-action:focus-visible,
    .filter-btn:focus-visible,
    .accordion-button:focus-visible,
    input:focus-visible{
      outline:none;
      box-shadow:0 0 0 .22rem rgba(114,224,106,.18);
    }
    .reveal{
      opacity:1;
      transform:none;
    }
    @media (max-width: 1199.98px){
      .hero-grid,
      .cta-grid,
      .faq-layout,
      .main-grid,
      .scenario-grid{
        grid-template-columns:1fr;
      }
      .sidebar,
      .faq-intro{
        position:relative;
        top:auto;
      }
      .footer-top{
        grid-template-columns:1fr 1fr;
      }
    }
    @media (max-width: 991.98px){
      .navbar{
        min-height:72px;
      }
      .navbar-collapse{
        margin-top:1rem;
        padding:1rem;
        border-radius:24px;
        background:rgba(15,19,17,.96);
        border:1px solid rgba(114,224,106,.12);
      }
      .navbar-nav{
        gap:.3rem;
      }
      .nav-cta{
        width:100%;
      }
      .hero h1{
        max-width:none;
      }
      .entry-matrix,
      .content-grid,
      .step-flow,
      .metric-grid,
      .cta-grid-mini{
        grid-template-columns:1fr;
      }
      .trust-row{
        gap:.55rem;
      }
      .hero-panel{
        order:2;
      }
    }
    @media (max-width: 767.98px){
      body{background:#f5f7f2}
      .hero{
        padding:3.2rem 0 2.5rem;
      }
      .section-band{
        padding:3.2rem 0;
      }
      .hero p.lead,
      .section-title p,
      .cta-shell p{
        font-size:.98rem;
      }
      .content-card,
      .flow-card,
      .side-card,
      .toolbar,
      .feedback-card{
        border-radius:20px;
      }
      .footer-top{
        grid-template-columns:1fr;
      }
      .footer-bottom{
        flex-direction:column;
      }
    }
    @media (max-width: 575.98px){
      .container-fluid-shell{
        width:min(100% - 20px, var(--container));
      }
      .hero h1{
        font-size:clamp(2.05rem, 10vw, 2.55rem);
      }
      .section-title h2,
      .cta-shell h2{
        font-size:clamp(1.7rem, 8vw, 2.25rem);
      }
      .hero-actions,
      .cta-actions{
        flex-direction:column;
      }
      .btn-modern,
      .nav-cta{
        width:100%;
      }
      .mini-note{
        flex-direction:column;
        align-items:flex-start;
      }
      .card-action{
        width:100%;
      }
      .meta-row{
        align-items:flex-start;
      }
    }

/* roulang page: category2 */
:root{
      --bg:#0e1110;
      --bg-2:#141816;
      --bg-3:#f6f7f2;
      --surface:#171b19;
      --surface-2:#1d221f;
      --surface-3:#eef2ea;
      --line:rgba(114,224,106,.18);
      --line-2:rgba(255,255,255,.08);
      --text:#f5f7f2;
      --text-2:#d9ded6;
      --muted:#9aa69d;
      --muted-2:#69726b;
      --accent:#72e06a;
      --accent-2:#b8ff4d;
      --accent-3:#9cf2c5;
      --dark:#111513;
      --shadow:0 18px 60px rgba(0,0,0,.28);
      --shadow-soft:0 12px 30px rgba(0,0,0,.18);
      --radius-xl:30px;
      --radius-lg:22px;
      --radius-md:16px;
      --radius-sm:12px;
      --container:1240px;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      font-family:PingFang SC, Microsoft YaHei, Noto Sans SC, Arial, sans-serif;
      background:
        radial-gradient(circle at 20% 0%, rgba(114,224,106,.10), transparent 28%),
        radial-gradient(circle at 80% 20%, rgba(156,242,197,.08), transparent 24%),
        linear-gradient(180deg, #0c0f0e 0%, #111512 38%, #f6f7f2 38%, #f6f7f2 100%);
      color:var(--text);
      line-height:1.75;
      overflow-x:hidden;
    }
    a{color:inherit;text-decoration:none;transition:.25s ease}
    img{max-width:100%;display:block}
    button,input,textarea,select{font:inherit}
    ::selection{background:rgba(114,224,106,.25);color:#fff}
    .container-fluid-shell{
      width:min(100%, var(--container));
      margin:0 auto;
      padding:0 20px;
    }
    .site-header{
      position:sticky;
      top:0;
      z-index:1040;
      background:rgba(14,17,16,.76);
      backdrop-filter:blur(18px);
      border-bottom:1px solid rgba(255,255,255,.06);
      transition:box-shadow .25s ease, background .25s ease, border-color .25s ease;
    }
    .site-header.is-scrolled{
      box-shadow:0 12px border-bottom-color:rgba(114,224,106,.14);
      background:rgba(13,16,15,.9);
    }
    .navbar{
      min-height:78px;
      padding:.75rem 0;
    }
    .navbar-brand{
      display:inline-flex;
      align-items:center;
      gap:.85rem;
      font-weight:800;
      letter-spacing:.02em;
      color:#f6faf4;
      font-size:1.08rem;
    }
    .brand-mark{
      width:38px;
      height:38px;
      border-radius:14px;
      display:inline-grid;
      place-items:center;
      background:linear-gradient(145deg, rgba(114,224,106,.18), rgba(156,242,197,.08));
      box-shadow:0 0 0 1px rgba(114,224,106,.18), inset 0 0 18px rgba(114,224,106,.06);
      flex:0 0 auto;
    }
    .brand-mark svg{width:32px;height:32px}
    .navbar-brand:hover{color:#fff;transform:translateY(-1px)}
    .navbar-nav{gap:.35rem}
    .nav-link{
      color:#dce4db;
      font-weight:600;
      padding:.8rem 1rem !important;
      border-radius:999px;
      position:relative;
    }
    .nav-link:hover,
    .nav-link:focus{
      color:#fff;
      background:rgba(114,224,106,.08);
    }
    .nav-link.active{
      color:#0d120e;
      background:linear-gradient(135deg, var(--accent), var(--accent-2));
      box-shadow:0 10px 24px rgba(114,224,106,.18);
    }
    .nav-link.active::after{
      content:"";
      position:absolute;
      left:16px;
      right:16px;
      bottom:9px;
      height:2px;
      border-radius:2px;
      background:rgba(13,18,14,.25);
      display:none;
    }
    .nav-cta{
      display:inline-flex;
      align-items:center;
      gap:.55rem;
      min-height:46px;
      padding:.8rem 1.2rem;
      border-radius:999px;
      color:#0c120d;
      font-weight:800;
      background:linear-gradient(135deg, #d8ff6c, #72e06a);
      box-shadow:0 12px 26px rgba(114,224,106,.22);
      border:1px solid rgba(255,255,255,.12);
    }
    .nav-cta:hover,
    .nav-cta:focus{
      transform:translateY(-2px);
      color:#071007;
      filter:brightness(1.03);
      box-shadow:0 18px 32px rgba(114,224,106,.28);
    }
    .navbar-toggler{
      border:1px solid rgba(114,224,106,.24);
      background:rgba(114,224,106,.06);
      border-radius:14px;
      padding:.55rem .72rem;
      box-shadow:none;
    }
    .navbar-toggler:focus{
      box-shadow:0 0 0 .22rem rgba(114,224,106,.18);
    }
    .navbar-toggler-icon{
      filter:brightness(0) invert(1);
    }
    .hero-section{
      position:relative;
      padding:96px 0 64px;
      background:
        linear-gradient(180deg, rgba(14,17,16,.96), rgba(20,24,22,.98)),
        radial-gradient(circle at 20% 20%, rgba(114,224,106,.14), transparent 25%),
        radial-gradient(circle at 85% 20%, rgba(156,242,197,.08), transparent 22%);
      color:var(--text);
      overflow:hidden;
    }
    .hero-section::before{
      content:"";
      position:absolute;
      inset:0;
      background-image:
        linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
      background-size:34px 34px;
      opacity:.18;
      pointer-events:none;
      mask-image:linear-gradient(180deg, rgba(0,0,0,.95), transparent 92%);
    }
    .hero-grid{
      position:relative;
      display:grid;
      grid-template-columns:1.08fr .92fr;
      gap:28px;
      align-items:stretch;
      z-index:1;
    }
    .eyebrow{
      display:inline-flex;
      align-items:center;
      gap:.5rem;
      color:var(--accent-3);
      font-size:.86rem;
      font-weight:700;
      letter-spacing:.12em;
      text-transform:uppercase;
      padding:.45rem .85rem;
      border-radius:999px;
      background:rgba(114,224,106,.09);
      border:1px solid rgba(114,224,106,.16);
      margin-bottom:1.1rem;
    }
    .hero-copy h1{
      margin:0;
      font-size:clamp(2.15rem, 5vw, 4rem);
      line-height:1.08;
      font-weight:800;
      letter-spacing:-.03em;
      max-width:10.5ch;
    }
    .hero-copy p{
      margin:1.2rem 0 0;
      max-width:40rem;
      color:#cfd7cf;
      font-size:1.04rem;
    }
    .hero-actions{
      display:flex;
      flex-wrap:wrap;
      gap:.85rem;
      margin-top:1.5rem;
    }
    .btn-primary-custom,
    .btn-outline-custom{
      min-height:48px;
      padding:.82rem 1.3rem;
      border-radius:999px;
      font-weight:800;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap:.55rem;
      text-decoration:none;
      transition:transform .25s ease, box-shadow .25s ease, background .25s ease, color .25s ease, border-color .25s ease;
      border:1px solid transparent;
    }
    .btn-primary-custom{
      background:linear-gradient(135deg, #d8ff6c, var(--accent));
      color:#071007;
      box-shadow:0 16px 30px rgba(114,224,106,.24);
    }
    .btn-primary-custom:hover,
    .btn-primary-custom:focus{
      transform:translateY(-2px);
      color:#071007;
      box-shadow:0 20px 36px rgba(114,224,106,.3);
      filter:brightness(1.02);
    }
    .btn-outline-custom{
      background:rgba(114,224,106,.06);
      color:#eaf0e8;
      border-color:rgba(114,224,106,.22);
    }
    .btn-outline-custom:hover,
    .btn-outline-custom:focus{
      transform:translateY(-2px);
      color:#fff;
      background:rgba(114,224,106,.12);
      border-color:rgba(114,224,106,.32);
    }
    .hero-trust{
      display:flex;
      flex-wrap:wrap;
      gap:.55rem;
      margin-top:1.35rem;
    }
    .trust-pill{
      display:inline-flex;
      align-items:center;
      gap:.45rem;
      padding:.45rem .82rem;
      border-radius:999px;
      border:1px solid rgba(255,255,255,.12);
      background:rgba(255,255,255,.04);
      color:#dbe2d9;
      font-size:.88rem;
    }
    .trust-dot{
      width:8px;
      height:8px;
      border-radius:50%;
      background:var(--accent);
      box-shadow:0 0 0 4px rgba(114,224,106,.12);
      flex:0 0 auto;
    }
    .hero-panel{
      background:linear-gradient(180deg, rgba(20,24,22,.94), rgba(17,21,19,.98));
      border:1px solid rgba(114,224,106,.16);
      border-radius:var(--radius-xl);
      box-shadow:var(--shadow);
      padding:1.2rem;
      position:relative;
      overflow:hidden;
    }
    .hero-panel::after{
      content:"";
      position:absolute;
      inset:auto -14% -34% auto;
      width:220px;
      height:220px;
      border-radius:50%;
      border:1px solid rgba(114,224,106,.16);
      box-shadow:0 0 0 18px rgba(114,224,106,.03);
      opacity:.65;
      pointer-events:none;
    }
    .panel-head{
      display:flex;
      justify-content:space-between;
      gap:1rem;
      align-items:flex-start;
      margin-bottom:1rem;
    }
    .panel-head strong{
      display:block;
      font-size:1.05rem;
      color:#fff;
    }
    .panel-head span{
      color:var(--muted);
      font-size:.92rem;
    }
    .status-grid{
      display:grid;
      grid-template-columns:repeat(2, minmax(0,1fr));
      gap:.8rem;
      margin-bottom:1rem;
    }
    .status-card{
      padding:.92rem .95rem;
      border-radius:18px;
      background:rgba(255,255,255,.03);
      border:1px solid rgba(255,255,255,.08);
    }
    .status-card .label{
      color:#aeb8b1;
      font-size:.84rem;
      margin-bottom:.35rem;
    }
    .status-card .value{
      font-size:1.05rem;
      font-weight:800;
      color:#fff;
    }
    .status-card .value em{
      font-style:normal;
      color:var(--accent);
    }
    .matrix-grid{
      display:grid;
      grid-template-columns:repeat(2, minmax(0,1fr));
      gap:.8rem;
      margin-top:.9rem;
    }
    .matrix-item{
      padding:1rem .95rem;
      border-radius:18px;
      background:linear-gradient(180deg, rgba(114,224,106,.08), rgba(255,255,255,.03));
      border:1px solid rgba(114,224,106,.15);
      min-height:92px;
    }
    .matrix-item .chip{
      display:inline-flex;
      align-items:center;
      gap:.35rem;
      font-size:.8rem;
      color:#dff4db;
      padding:.25rem .58rem;
      border-radius:999px;
      background:rgba(114,224,106,.12);
      margin-bottom:.55rem;
    }
    .matrix-item h3{
      font-size:1rem;
      margin:0 0 .35rem;
      color:#fff;
      font-weight:750;
    }
    .matrix-item p{
      margin:0;
      color:#c8d0c8;
      font-size:.9rem;
      line-height:1.6;
    }
    .panel-flow{
      margin-top:1rem;
      padding-top:1rem;
      border-top:1px dashed rgba(255,255,255,.12);
      color:#dfe6dc;
      display:flex;
      flex-wrap:wrap;
      gap:.5rem;
      font-size:.92rem;
    }
    .panel-flow strong{color:var(--accent-2)}
    .light-band,
    .dark-band{
      position:relative;
      padding:90px 0;
    }
    .light-band{
      background:linear-gradient(180deg, #f6f7f2 0%, #eef2ea 100%);
      color:#1c231e;
    }
    .dark-band{
      background:linear-gradient(180deg, #121614 0%, #171b19 100%);
      color:var(--text);
    }
    .section-head{
      display:flex;
      flex-wrap:wrap;
      justify-content:space-between;
      align-items:end;
      gap:1rem;
      margin-bottom:1.8rem;
    }
    .section-head h2{
      margin:0;
      font-size:clamp(1.8rem, 3vw, 2.75rem);
      line-height:1.12;
      font-weight:800;
      letter-spacing:-.03em;
    }
    .section-head p{
      margin:0;
      max-width:52rem;
      color:inherit;
      opacity:.82;
      font-size:1rem;
    }
    .section-tag{
      display:inline-flex;
      align-items:center;
      gap:.4rem;
      font-size:.82rem;
      font-weight:700;
      color:#eaf6e9;
      padding:.35rem .72rem;
      border-radius:999px;
      background:rgba(114,224,106,.09);
      border:1px solid rgba(114,224,106,.14);
      margin-bottom:.85rem;
    }
    .step-line{
      position:relative;
      display:grid;
      grid-template-columns:repeat(3, minmax(0,1fr));
      gap:1rem;
      margin-top:1.4rem;
    }
    .step-line::before{
      content:"";
      position:absolute;
      left:8.5%;
      right:8.5%;
      top:34px;
      height:1px;
      background:linear-gradient(90deg, transparent, rgba(114,224,106,.34), transparent);
    }
    .step-card{
      position:relative;
      background:rgba(255,255,255,.72);
      border:1px solid rgba(52,69,55,.08);
      border-radius:var(--radius-lg);
      box-shadow:0 12px 24px rgba(15,19,16,.05);
      padding:1.2rem 1.2rem 1.1rem;
      transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
      min-height:176px;
    }
    .step-card:hover{
      transform:translateY(-3px);
      box-shadow:0 18px 34px rgba(15,19,16,.08);
      border-color:rgba(114,224,106,.22);
    }
    .step-badge{
      width:48px;
      height:48px;
      border-radius:16px;
      display:grid;
      place-items:center;
      background:linear-gradient(145deg, rgba(114,224,106,.15), rgba(156,242,197,.08));
      color:#103112;
      font-weight:800;
      margin-bottom:.95rem;
      box-shadow:0 0 0 1px rgba(114,224,106,.16);
    }
    .step-card h3,
    .feature-card h3,
    .entry-card h3,
    .faq-copy h2,
    .cta-card h2{
      margin:0 0 .55rem;
      font-size:1.2rem;
      line-height:1.35;
      font-weight:750;
    }
    .step-card p,
    .feature-card p,
    .entry-card p,
    .faq-copy p,
    .cta-card p{
      margin:0;
      font-size:.98rem;
      line-height:1.75;
    }
    .feature-grid{
      display:grid;
      grid-template-columns:1.05fr .95fr;
      gap:1rem;
      align-items:start;
    }
    .feature-panel{
      background:rgba(255,255,255,.06);
      border:1px solid rgba(114,224,106,.14);
      border-radius:var(--radius-xl);
      box-shadow:var(--shadow);
      padding:1.25rem;
    }
    .feature-panel.light{
      background:#fff;
      color:#18201b;
    }
    .metrics-grid{
      display:grid;
      grid-template-columns:repeat(2, minmax(0,1fr));
      gap:.85rem;
    }
    .metric-box{
      background:linear-gradient(180deg, rgba(114,224,106,.08), rgba(255,255,255,.03));
      border:1px solid rgba(114,224,106,.14);
      border-radius:18px;
      padding:1rem;
      min-height:112px;
    }
    .metric-box .num{
      font-size:1.7rem;
      font-weight:800;
      line-height:1;
      color:var(--accent);
      margin-bottom:.45rem;
    }
    .metric-box .txt{
      color:#c8d2c8;
      font-size:.92rem;
      line-height:1.6;
    }
    .proof-cards{
      display:grid;
      gap:.9rem;
    }
    .proof-card{
      background:rgba(255,255,255,.04);
      border:1px solid rgba(255,255,255,.09);
      border-radius:24px;
      padding:1.15rem 1.2rem;
      box-shadow:0 12px 26px rgba(0,0,0,.12);
      transition:transform .25s ease, border-color .25s ease;
    }
    .proof-card:hover{
      transform:translateY(-2px);
      border-color:rgba(114,224,106,.2);
    }
    .proof-card .topline{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:1rem;
      margin-bottom:.6rem;
    }
    .proof-card .tag{
      display:inline-flex;
      align-items:center;
      gap:.35rem;
      color:#cdf5c8;
      font-size:.82rem;
      font-weight:700;
      padding:.28rem .62rem;
      border-radius:999px;
      background:rgba(114,224,106,.09);
      border:1px solid rgba(114,224,106,.14);
    }
    .proof-card strong{
      font-size:1.05rem;
      color:#fff;
    }
    .proof-card p{
      margin:0;
      color:#d1d8d0;
    }
    .entry-grid{
      display:grid;
      grid-template-columns:repeat(2, minmax(0,1fr));
      gap:1rem;
    }
    .entry-card{
      border-radius:28px;
      padding:1.2rem;
      background:linear-gradient(180deg, rgba(255,255,255,.96), rgba(237,241,232,.9));
      border:1px solid rgba(108,124,111,.12);
      box-shadow:0 16px 34px rgba(14,18,16,.06);
      transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
      min-height:210px;
      display:flex;
      flex-direction:column;
      justify-content:space-between;
    }
    .entry-card:hover{
      transform:translateY(-4px);
      border-color:rgba(114,224,106,.24);
      box-shadow:0 20px 40px rgba(14,18,16,.09);
    }
    .entry-card.accent{
      background:linear-gradient(180deg, rgba(114,224,106,.12), rgba(255,255,255,.92));
      border-color:rgba(114,224,106,.18);
    }
    .entry-card .meta{
      display:flex;
      flex-wrap:wrap;
      gap:.45rem;
      margin:.8rem 0;
    }
    .mini-pill{
      display:inline-flex;
      align-items:center;
      gap:.35rem;
      padding:.28rem .62rem;
      border-radius:999px;
      border:1px solid rgba(72,86,75,.12);
      color:#354039;
      background:rgba(255,255,255,.66);
      font-size:.8rem;
      font-weight:650;
    }
    .entry-card .bottom{
      display:flex;
      justify-content:space-between;
      align-items:center;
      gap:1rem;
      margin-top:1rem;
    }
    .entry-card .time{
      color:#69726b;
      font-size:.86rem;
    }
    .small-btn{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      min-height:42px;
      padding:.62rem 1rem;
      border-radius:999px;
      font-size:.9rem;
      font-weight:800;
      border:1px solid rgba(114,224,106,.22);
      background:rgba(114,224,106,.08);
      color:#132015;
    }
    .small-btn:hover,
    .small-btn:focus{
      transform:translateY(-1px);
      background:rgba(114,224,106,.14);
      color:#0b130d;
    }
    .faq-layout{
      display:grid;
      grid-template-columns:.9fr 1.1fr;
      gap:1.2rem;
      align-items:start;
    }
    .faq-copy{
      position:sticky;
      top:96px;
      background:linear-gradient(180deg, rgba(20,24,22,.96), rgba(16,20,18,.98));
      border:1px solid rgba(114,224,106,.14);
      color:#f5f7f2;
      border-radius:var(--radius-xl);
      padding:1.3rem;
      box-shadow:var(--shadow-soft);
    }
    .faq-copy h2{font-size:clamp(1.7rem, 3vw, 2.4rem)}
    .faq-copy p{color:#c8d0c8}
    .custom-accordion .accordion-item{
      background:transparent;
      border:0;
      margin-bottom:.9rem;
      border-radius:22px;
      overflow:hidden;
    }
    .custom-accordion .accordion-button{
      background:rgba(255,255,255,.96);
      color:#18201b;
      font-weight:750;
      border-radius:22px !important;
      box-shadow:0 10px 24px rgba(13,18,14,.05);
      padding:1rem 1.1rem;
    }
    .custom-accordion .accordion-button:not(.collapsed){
      background:rgba(114,224,106,.12);
      color:#102010;
      box-shadow:inset 0 0 0 1px rgba(114,224,106,.18);
    }
    .custom-accordion .accordion-button:focus{
      box-shadow:0 0 0 .22rem rgba(114,224,106,.14);
    }
    .custom-accordion .accordion-button::after{
      filter:hue-rotate(70deg) saturate(1.4);
    }
    .custom-accordion .accordion-body{
      background:rgba(255,255,255,.9);
      color:#223027;
      border:1px solid rgba(114,224,106,.12);
      border-top:0;
      border-radius:0 0 22px 22px;
      padding:1rem 1.1rem 1.05rem;
    }
    .cta-section{
      padding:0 0 90px;
      background:linear-gradient(180deg, #f6f7f2 0%, #eef2ea 100%);
    }
    .cta-card{
      position:relative;
      display:grid;
      grid-template-columns:1.1fr .9fr;
      gap:1rem;
      background:linear-gradient(135deg, #121715, #191e1b);
      color:#f5f7f2;
      border-radius:32px;
      padding:1.35rem;
      border:1px solid rgba(114,224,106,.16);
      box-shadow:0 22px 56px rgba(12,15,13,.18);
      overflow:hidden;
    }
    .cta-card::before{
      content:"";
      position:absolute;
      inset:0;
      background-image:
        linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px);
      background-size:38px 38px;
      opacity:.14;
      pointer-events:none;
    }
    .cta-card > *{position:relative;z-index:1}
    .cta-kicker{
      display:inline-flex;
      align-items:center;
      gap:.4rem;
      padding:.36rem .72rem;
      border-radius:999px;
      background:rgba(114,224,106,.1);
      color:#d7f7d2;
      border:1px solid rgba(114,224,106,.16);
      margin-bottom:.9rem;
      font-size:.84rem;
      font-weight:700;
    }
    .cta-side{
      background:linear-gradient(180deg, rgba(114,224,106,.10), rgba(255,255,255,.03));
      border:1px solid rgba(114,224,106,.14);
      border-radius:26px;
      padding:1rem;
      display:grid;
      gap:.75rem;
      align-content:start;
    }
    .check-list{
      margin:0;
      padding:0;
      list-style:none;
      display:grid;
      gap:.6rem;
    }
    .check-list li{
      display:flex;
      gap:.65rem;
      color:#d7dfd5;
      font-size:.96rem;
      line-height:1.7;
    }
    .check-list i{
      color:var(--accent);
      margin-top:.2rem;
      flex:0 0 auto;
    }
    .site-footer{
      background:#0d1110;
      color:#e8ede6;
      padding:64px 0 26px;
      border-top:1px solid rgba(255,255,255,.06);
    }
    .footer-top{
      display:grid;
      grid-template-columns:1.4fr .8fr .8fr;
      gap:1rem;
      padding-bottom:1.5rem;
    }
    .footer-brand{
      display:inline-flex;
      align-items:center;
      gap:.82rem;
      font-weight:800;
      font-size:1.04rem;
      margin-bottom:.9rem;
    }
    .footer-note{
      color:#a7b1a9;
      margin:0;
      max-width:34rem;
      line-height:1.8;
      font-size:.96rem;
    }
    .footer-col h4{
      font-size:1rem;
      margin:0 0 .85rem;
      color:#fff;
      font-weight:750;
    }
    .footer-links{
      display:grid;
      gap:.6rem;
    }
    .footer-links a{
      color:#c8d0c8;
      display:inline-flex;
      width:fit-content;
      gap:.3rem;
    }
    .footer-links a:hover,
    .footer-links a:focus{
      color:#fff;
      transform:translateX(2px);
    }
    .footer-bottom{
      display:flex;
      flex-wrap:wrap;
      gap:.7rem 1rem;
      justify-content:space-between;
      align-items:center;
      border-top:1px solid rgba(255,255,255,.08);
      padding-top:1rem;
      color:#93a097;
      font-size:.9rem;
    }
    .notice-bar{
      margin-top:1.1rem;
      display:flex;
      flex-wrap:wrap;
      gap:.5rem;
    }
    .notice-bar .mini-pill{
      background:rgba(255,255,255,.05);
      border-color:rgba(255,255,255,.08);
      color:#dbe2db;
    }
    .search-shell{
      display:flex;
      gap:.7rem;
      align-items:center;
      margin-top:1rem;
    }
    .search-shell .search-input{
      width:100%;
      min-height:48px;
      border-radius:999px;
      border:1px solid rgba(114,224,106,.18);
      background:rgba(255,255,255,.94);
      color:#18201b;
      padding:.74rem 1rem;
      outline:none;
    }
    .search-shell .search-input:focus{
      box-shadow:0 0 0 .22rem rgba(114,224,106,.14);
      border-color:rgba(114,224,106,.34);
    }
    .search-shell .search-input::placeholder{
      color:#7d877f;
    }
    .dark-band .section-head p,
    .dark-band .section-head h2{
      color:#f5f7f2;
    }
    .light-band .section-head p,
    .light-band .section-head h2{
      color:#1d241f;
    }
    .subtle-line{
      height:1px;
      background:linear-gradient(90deg, transparent, rgba(114,224,106,.26), transparent);
      margin:1rem 0 0;
    }
    .content-box{
      border-radius:24px;
      padding:1.15rem;
      border:1px solid rgba(114,224,106,.14);
      background:rgba(255,255,255,.04);
    }
    .content-box.light{
      background:#fff;
      color:#1b221d;
      box-shadow:0 14px 30px rgba(13,18,14,.05);
    }
    .content-box p{margin:0;color:inherit}
    @media (max-width: 1199.98px){
      .hero-grid,
      .feature-grid,
      .faq-layout,
      .cta-card,
      .footer-top{
        grid-template-columns:1fr;
      }
      .faq-copy{position:static}
    }
    @media (max-width: 991.98px){
      .navbar-collapse{
        margin-top:1rem;
        padding:1rem;
        border-radius:24px;
        background:rgba(15,18,17,.96);
        border:1px solid rgba(255,255,255,.08);
        box-shadow:var(--shadow);
      }
      .navbar-nav{
        align-items:stretch !important;
      }
      .nav-link,
      .nav-cta{
        width:100%;
        justify-content:space-between;
      }
      .step-line::before{display:none}
      .step-line,
      .entry-grid{
        grid-template-columns:1fr;
      }
      .metrics-grid,
      .status-grid,
      .matrix-grid{
        grid-template-columns:1fr 1fr;
      }
    }
    @media (max-width: 767.98px){
      .hero-section{
        padding:78px 0 54px;
      }
      .light-band,
      .dark-band{
        padding:64px 0;
      }
      .section-head{
        align-items:flex-start;
      }
      .section-head h2{
        font-size:clamp(1.6rem, 7vw, 2.2rem);
      }
      .hero-copy h1{
        max-width:none;
        font-size:clamp(2.1rem, 9vw, 3.5rem);
      }
      .status-grid,
      .matrix-grid,
      .metrics-grid{
        grid-template-columns:1fr;
      }
      .cta-card,
      .hero-panel,
      .feature-panel,
      .step-card,
      .entry-card,
      .proof-card,
      .content-box,
      .faq-copy{
        border-radius:22px;
      }
      .cta-actions .btn-primary-custom,
      .cta-actions .btn-outline-custom{
        width:100%;
      }
      .cta-actions{
        display:grid;
      }
      .footer-bottom{
        flex-direction:column;
        align-items:flex-start;
      }
    }
    @media (max-width: 575.98px){
      .container-fluid-shell{padding:0 16px}
      .hero-copy h1{font-size:clamp(2rem, 10vw, 2.8rem)}
      .navbar-brand{font-size:1rem}
      .brand-mark{width:34px;height:34px}
      .brand-mark svg{width:28px;height:28px}
      .cta-card,
      .hero-panel,
      .feature-panel{
        border-radius:20px;
      }
      .step-card,
      .entry-card,
      .proof-card{
        padding:1rem;
      }
      .small-btn,
      .btn-primary-custom,
      .btn-outline-custom,
      .nav-cta{
        min-height:44px;
      }
    }