/* roulang page: index */
:root{
      --ink:#111827;
      --ink-2:#273244;
      --muted:#667085;
      --soft:#f6f1e8;
      --paper:#fffaf2;
      --white:#ffffff;
      --line:rgba(17,24,39,.12);
      --line-strong:rgba(17,24,39,.18);
      --brand:#c8732c;
      --brand-dark:#9b541d;
      --brand-soft:#fff0df;
      --gold:#e8b65f;
      --green:#2f8d6a;
      --red:#d45d45;
      --night:#121826;
      --night-2:#1f2937;
      --radius-xs:10px;
      --radius-sm:14px;
      --radius-md:22px;
      --radius-lg:32px;
      --shadow-sm:0 10px 26px rgba(17,24,39,.08);
      --shadow-md:0 18px 52px rgba(17,24,39,.14);
      --shadow-lg:0 28px 80px rgba(17,24,39,.20);
      --container:1160px;
      --ease:cubic-bezier(.2,.8,.2,1);
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",Arial,sans-serif;
      color:var(--ink);
      background:
        radial-gradient(circle at 8% 0%, rgba(232,182,95,.22), transparent 34%),
        radial-gradient(circle at 88% 18%, rgba(200,115,44,.13), transparent 30%),
        linear-gradient(180deg,#fffaf2 0%,#fbf7f0 42%,#ffffff 100%);
      line-height:1.7;
      text-rendering:optimizeLegibility;
      overflow-x:hidden;
    }
    a{color:inherit;text-decoration:none;transition:color .25s var(--ease),background .25s var(--ease),border-color .25s var(--ease),transform .25s var(--ease)}
    a:hover{color:var(--brand-dark)}
    img{max-width:100%;display:block}
    button,input,textarea{font:inherit}
    button{border:0}
    ::selection{background:rgba(200,115,44,.22);color:var(--ink)}
    .container-custom{width:min(var(--container), calc(100% - 40px));margin:0 auto}
    .skip-link{
      position:absolute;left:16px;top:-60px;background:var(--ink);color:#fff;padding:10px 14px;border-radius:999px;z-index:9999
    }
    .skip-link:focus{top:14px;outline:3px solid rgba(232,182,95,.7)}
    .site-header{
      position:sticky;
      top:0;
      z-index:1000;
      background:rgba(255,250,242,.82);
      backdrop-filter:blur(18px);
      border-bottom:1px solid rgba(17,24,39,.08);
      transition:box-shadow .25s var(--ease),background .25s var(--ease);
    }
    .site-header.is-scrolled{box-shadow:0 12px 40px rgba(17,24,39,.09);background:rgba(255,250,242,.94)}
    .navbar{padding:14px 0}
    .brand-mark{
      display:inline-flex;align-items:center;gap:10px;
      font-weight:900;letter-spacing:-.03em;font-size:1.22rem;color:var(--ink)
    }
    .brand-mark__icon{
      width:40px;height:40px;border-radius:14px;
      background:linear-gradient(135deg,var(--ink) 0%,#313b4d 48%,var(--brand) 100%);
      color:#fff;display:grid;place-items:center;
      font-size:.88rem;font-weight:900;box-shadow:0 12px 28px rgba(17,24,39,.16)
    }
    .brand-mark__text{display:flex;flex-direction:column;line-height:1.1}
    .brand-mark__sub{font-size:.68rem;color:var(--muted);letter-spacing:.18em;font-weight:700;margin-top:4px}
    .navbar-toggler{
      border:1px solid var(--line);
      border-radius:14px;
      padding:9px 11px;
      box-shadow:none!important;
      background:#fff;
    }
    .nav-pill{
      display:flex;
      align-items:center;
      gap:10px;
      background:rgba(255,255,255,.72);
      border:1px solid var(--line);
      border-radius:999px;
      padding:6px;
      box-shadow:0 8px 30px rgba(17,24,39,.05);
    }
    .nav-link{
      color:var(--ink-2);
      font-weight:800;
      border-radius:999px;
      padding:9px 18px!important;
      position:relative;
    }
    .nav-link:hover,.nav-link.active{
      color:var(--ink);
      background:var(--brand-soft);
    }
    .nav-action{
      display:flex;
      align-items:center;
      gap:10px;
      margin-left:14px;
    }
    .mini-search{
      min-width:210px;
      display:flex;align-items:center;gap:8px;
      background:#fff;
      border:1px solid var(--line);
      border-radius:999px;
      padding:8px 12px;
      color:var(--muted);
    }
    .mini-search input{
      width:100%;
      border:0;outline:0;background:transparent;
      color:var(--ink);font-size:.92rem;
    }
    .mini-search input::placeholder{color:#98a2b3}
    .btn-brand,.btn-ghost,.btn-darkline{
      display:inline-flex;align-items:center;justify-content:center;gap:9px;
      border-radius:999px;
      padding:12px 20px;
      font-weight:900;
      letter-spacing:-.01em;
      transition:transform .25s var(--ease),box-shadow .25s var(--ease),background .25s var(--ease),border-color .25s var(--ease),color .25s var(--ease);
      cursor:pointer;
      white-space:nowrap;
    }
    .btn-brand{
      background:var(--brand);
      color:#fff!important;
      box-shadow:0 16px 34px rgba(200,115,44,.28);
    }
    .btn-brand:hover{background:var(--brand-dark);transform:translateY(-2px);box-shadow:0 22px 42px rgba(200,115,44,.33)}
    .btn-ghost{background:#fff;color:var(--ink)!important;border:1px solid var(--line)}
    .btn-ghost:hover{border-color:rgba(200,115,44,.45);transform:translateY(-2px);box-shadow:var(--shadow-sm)}
    .btn-darkline{background:rgba(255,255,255,.08);color:#fff!important;border:1px solid rgba(255,255,255,.2)}
    .btn-darkline:hover{background:rgba(255,255,255,.16);transform:translateY(-2px)}
    .btn-brand:focus-visible,.btn-ghost:focus-visible,.btn-darkline:focus-visible,.nav-link:focus-visible,.form-control:focus{
      outline:3px solid rgba(232,182,95,.5);
      outline-offset:3px;
      box-shadow:none;
    }
    main{overflow:hidden}
    section{position:relative}
    .section-pad{padding:88px 0}
    .section-head{
      display:flex;
      justify-content:space-between;
      align-items:end;
      gap:26px;
      margin-bottom:34px;
    }
    .eyebrow{
      display:inline-flex;
      align-items:center;
      gap:8px;
      width:max-content;
      color:var(--brand-dark);
      background:rgba(200,115,44,.09);
      border:1px solid rgba(200,115,44,.16);
      border-radius:999px;
      padding:7px 12px;
      font-weight:900;
      font-size:.86rem;
      margin-bottom:14px;
    }
    .eyebrow::before{
      content:"";
      width:7px;height:7px;border-radius:50%;
      background:var(--brand);
      box-shadow:0 0 0 5px rgba(200,115,44,.12)
    }
    .section-title{
      margin:0;
      font-size:clamp(2rem,4vw,3.8rem);
      line-height:1.06;
      letter-spacing:-.06em;
      font-weight:950;
      color:var(--ink);
    }
    .section-desc{
      margin:14px 0 0;
      color:var(--muted);
      font-size:1.05rem;
      max-width:650px;
    }
    .hero{
      min-height:760px;
      display:flex;
      align-items:center;
      padding:58px 0 80px;
    }
    .hero-stage{
      position:relative;
      border-radius:42px;
      overflow:hidden;
      background:
        linear-gradient(115deg,rgba(18,24,38,.92) 0%,rgba(31,41,55,.80) 36%,rgba(200,115,44,.52) 100%),
        radial-gradient(circle at 74% 20%,rgba(232,182,95,.45),transparent 30%),
        var(--night);
      min-height:650px;
      box-shadow:var(--shadow-lg);
      border:1px solid rgba(255,255,255,.14);
      isolation:isolate;
    }
    .hero-stage::before{
      content:"";
      position:absolute;inset:0;
      background:
        linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
      background-size:44px 44px;
      opacity:.55;
      z-index:-1;
    }
    .hero-stage::after{
      content:"";
      position:absolute;
      right:-100px;bottom:-180px;
      width:520px;height:520px;border-radius:50%;
      background:rgba(232,182,95,.20);
      filter:blur(12px);
      z-index:-1;
    }
    .hero-layout{
      display:grid;
      grid-template-columns:minmax(0,1.05fr) minmax(320px,.75fr);
      gap:36px;
      align-items:center;
      padding:58px;
      min-height:650px;
    }
    .hero-copy{color:#fff;max-width:720px}
    .hero-copy .eyebrow{
      background:rgba(255,255,255,.1);
      border-color:rgba(255,255,255,.16);
      color:#ffe3bd;
    }
    h1{
      margin:0;
      font-size:clamp(2.65rem,6vw,6.25rem);
      line-height:.94;
      letter-spacing:-.075em;
      font-weight:950;
    }
    .hero-lead{
      margin:24px 0 0;
      color:rgba(255,255,255,.78);
      font-size:clamp(1.04rem,1.6vw,1.2rem);
      max-width:680px;
    }
    .hero-actions{
      display:flex;
      flex-wrap:wrap;
      gap:14px;
      margin-top:32px;
    }
    .hero-points{
      display:grid;
      grid-template-columns:repeat(3, minmax(0,1fr));
      gap:12px;
      margin-top:34px;
      max-width:680px;
    }
    .hero-point{
      padding:16px;
      border-radius:22px;
      background:rgba(255,255,255,.09);
      border:1px solid rgba(255,255,255,.14);
      backdrop-filter:blur(14px);
      color:#fff;
    }
    .hero-point b{
      display:block;
      font-size:1.32rem;
      line-height:1;
      letter-spacing:-.04em;
      margin-bottom:7px;
    }
    .hero-point span{font-size:.88rem;color:rgba(255,255,255,.70)}
    .vertical-reel{
      position:relative;
      min-height:560px;
      display:grid;
      place-items:center;
      perspective:1200px;
    }
    .reel-card{
      width:min(330px,100%);
      aspect-ratio:9/15.5;
      border-radius:36px;
      background:linear-gradient(180deg,#fff7ed 0%,#fff 56%,#f7ead8 100%);
      color:var(--ink);
      padding:22px;
      box-shadow:0 34px 90px rgba(0,0,0,.30);
      border:1px solid rgba(255,255,255,.55);
      transform:rotate(-2deg);
      position:relative;
      overflow:hidden;
    }
    .reel-card::before{
      content:"";
      position:absolute;inset:12px;
      border-radius:28px;
      border:1px solid rgba(17,24,39,.08);
      pointer-events:none;
    }
    .reel-top{
      display:flex;
      justify-content:space-between;
      align-items:center;
      font-weight:950;
      font-size:.86rem;
      color:var(--muted);
    }
    .reel-visual{
      margin:18px 0;
      height:220px;
      border-radius:28px;
      background:
        radial-gradient(circle at 22% 24%,rgba(232,182,95,.85),transparent 23%),
        radial-gradient(circle at 72% 30%,rgba(47,141,106,.36),transparent 24%),
        linear-gradient(135deg,#222b3b 0%,#915222 100%);
      position:relative;
      overflow:hidden;
    }
    .reel-visual span{
      position:absolute;
      width:90px;height:90px;border-radius:24px;
      background:rgba(255,255,255,.14);
      border:1px solid rgba(255,255,255,.28);
      backdrop-filter:blur(10px);
      transform:rotate(14deg);
    }
    .reel-visual span:nth-child(1){left:28px;bottom:34px}
    .reel-visual span:nth-child(2){right:34px;top:28px;width:66px;height:66px;border-radius:20px}
    .reel-title{
      font-size:1.6rem;
      line-height:1.08;
      letter-spacing:-.06em;
      font-weight:950;
      margin:0 0 12px;
    }
    .reel-list{
      list-style:none;
      padding:0;margin:0;
      display:grid;gap:10px;
    }
    .reel-list li{
      display:flex;align-items:center;gap:10px;
      color:var(--ink-2);
      font-weight:800;
      font-size:.95rem;
    }
    .reel-list i{
      width:22px;height:22px;border-radius:50%;
      display:grid;place-items:center;
      background:var(--brand-soft);color:var(--brand-dark);
      font-style:normal;font-size:.78rem;
    }
    .floating-note{
      position:absolute;
      border-radius:20px;
      padding:14px 16px;
      background:rgba(255,255,255,.9);
      border:1px solid rgba(255,255,255,.6);
      box-shadow:0 18px 50px rgba(0,0,0,.18);
      color:var(--ink);
      font-weight:900;
      animation:floaty 5s var(--ease) infinite;
    }
    .floating-note small{display:block;color:var(--muted);font-weight:800;margin-top:2px}
    .note-a{left:0;top:92px}
    .note-b{right:-10px;bottom:110px;animation-delay:.8s}
    @keyframes floaty{
      0%,100%{transform:translateY(0)}
      50%{transform:translateY(-12px)}
    }
    .progress-section{padding:8px 0 86px}
    .progress-wrap{
      display:grid;
      grid-template-columns:minmax(0,.82fr) minmax(300px,.45fr);
      gap:22px;
      align-items:stretch;
    }
    .progress-card,.side-proof,.tier-card,.wall-card,.scenario-panel,.step-card,.story-band,.news-panel,.faq-card,.cta-panel{
      background:rgba(255,255,255,.82);
      border:1px solid var(--line);
      border-radius:var(--radius-lg);
      box-shadow:var(--shadow-sm);
    }
    .progress-card{padding:34px}
    .progress-top{
      display:flex;justify-content:space-between;gap:20px;align-items:flex-start;margin-bottom:26px
    }
    .big-number{
      font-size:clamp(3rem,7vw,6rem);
      line-height:.88;
      font-weight:950;
      letter-spacing:-.08em;
      color:var(--ink);
    }
    .progress-label{
      display:inline-flex;
      padding:9px 14px;
      border-radius:999px;
      background:rgba(47,141,106,.1);
      color:#237657;
      font-weight:950;
      white-space:nowrap;
    }
    .progress-bar-shell{
      height:18px;border-radius:999px;background:#efe6d8;overflow:hidden;border:1px solid rgba(17,24,39,.06)
    }
    .progress-bar-fill{
      width:72%;
      height:100%;
      border-radius:999px;
      background:linear-gradient(90deg,var(--brand) 0%,var(--gold) 100%);
      box-shadow:0 10px 28px rgba(200,115,44,.25);
      position:relative;
    }
    .progress-meta{
      display:grid;
      grid-template-columns:repeat(3,1fr);
      gap:12px;
      margin-top:24px;
    }
    .meta-item{
      padding:16px;border-radius:20px;background:#fff7ed;border:1px solid rgba(200,115,44,.12)
    }
    .meta-item b{display:block;font-size:1.35rem;letter-spacing:-.04em}
    .meta-item span{color:var(--muted);font-size:.9rem}
    .side-proof{
      padding:28px;
      display:flex;
      flex-direction:column;
      justify-content:space-between;
      overflow:hidden;
      position:relative;
      background:linear-gradient(180deg,#fff 0%,#fff6eb 100%);
    }
    .side-proof::after{
      content:"";
      position:absolute;right:-60px;bottom:-70px;width:190px;height:190px;border-radius:50%;background:rgba(232,182,95,.25)
    }
    .side-proof h3,.tier-card h3,.scenario-panel h3,.step-card h3,.news-panel h3,.faq-card h3{font-weight:950;letter-spacing:-.04em}
    .proof-list{list-style:none;margin:18px 0 0;padding:0;display:grid;gap:13px}
    .proof-list li{
      display:flex;gap:12px;align-items:flex-start;color:var(--ink-2);font-weight:750
    }
    .proof-list i{
      width:28px;height:28px;flex:0 0 28px;border-radius:10px;display:grid;place-items:center;
      background:var(--ink);color:#fff;font-style:normal;font-size:.82rem;
    }
    .rewards-section{
      padding:88px 0;
      background:linear-gradient(180deg,rgba(255,255,255,.26),rgba(246,241,232,.62));
    }
    .tier-layout{
      display:grid;
      grid-template-columns:.78fr 1.05fr .78fr;
      gap:18px;
      align-items:stretch;
    }
    .tier-card{
      padding:28px;
      position:relative;
      overflow:hidden;
      transition:transform .25s var(--ease),box-shadow .25s var(--ease),border-color .25s var(--ease);
    }
    .tier-card:hover{
      transform:translateY(-6px);
      box-shadow:var(--shadow-md);
      border-color:rgba(200,115,44,.28);
    }
    .tier-card.featured{
      background:linear-gradient(180deg,#172033 0%,#111827 100%);
      color:#fff;
      transform:translateY(-18px);
      box-shadow:var(--shadow-lg);
      border-color:rgba(255,255,255,.14);
    }
    .tier-card.featured:hover{transform:translateY(-24px)}
    .tier-badge{
      display:inline-flex;padding:7px 11px;border-radius:999px;
      background:var(--brand-soft);color:var(--brand-dark);
      font-size:.82rem;font-weight:950;margin-bottom:14px;
    }
    .featured .tier-badge{background:rgba(232,182,95,.16);color:#ffe4bb;border:1px solid rgba(232,182,95,.22)}
    .price{
      display:flex;align-items:flex-end;gap:6px;margin:18px 0 16px;
      font-weight:950;letter-spacing:-.06em;
    }
    .price strong{font-size:3.15rem;line-height:1}
    .price span{color:var(--muted);font-weight:850;margin-bottom:7px}
    .featured .price span,.featured p,.featured li{color:rgba(255,255,255,.72)}
    .tier-list{list-style:none;padding:0;margin:22px 0;display:grid;gap:12px}
    .tier-list li{display:flex;gap:10px;align-items:flex-start;color:var(--ink-2)}
    .tier-list li::before{
      content:"✓";flex:0 0 23px;width:23px;height:23px;border-radius:50%;
      display:grid;place-items:center;background:rgba(47,141,106,.12);color:var(--green);font-weight:950;font-size:.82rem;
    }
    .featured .tier-list li::before{background:rgba(232,182,95,.16);color:#ffd89b}
    .wall-section{padding:88px 0 76px}
    .wall-wrap{
      display:grid;
      grid-template-columns:minmax(260px,.42fr) minmax(0,1fr);
      gap:28px;
      align-items:start;
    }
    .wall-summary{
      padding:32px;
      border-radius:var(--radius-lg);
      background:var(--ink);
      color:#fff;
      box-shadow:var(--shadow-md);
      position:sticky;
      top:104px;
    }
    .wall-summary .section-title{color:#fff;font-size:clamp(2rem,4vw,3.5rem)}
    .wall-summary p{color:rgba(255,255,255,.74);margin-top:16px}
    .avatar-row{display:flex;margin-top:24px}
    .avatar{
      width:44px;height:44px;border-radius:50%;
      display:grid;place-items:center;
      background:linear-gradient(135deg,#fff1db,#d8944d);
      color:var(--ink);
      font-weight:950;
      border:3px solid var(--ink);
      margin-left:-10px;
    }
    .avatar:first-child{margin-left:0}
    .wall-grid{
      columns:2 280px;
      column-gap:18px;
    }
    .wall-card{
      break-inside:avoid;
      padding:22px;
      margin-bottom:18px;
      transition:transform .25s var(--ease),box-shadow .25s var(--ease);
    }
    .wall-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-md)}
    .wall-card header{display:flex;justify-content:space-between;gap:14px;align-items:center;margin-bottom:12px}
    .wall-card b{font-weight:950}
    .wall-card small{
      color:var(--brand-dark);
      background:var(--brand-soft);
      border-radius:999px;
      padding:5px 9px;
      font-weight:900;
      white-space:nowrap;
    }
    .wall-card p{margin:0;color:var(--ink-2)}
    .scenario-section{
      padding:88px 0;
      background:#fff;
    }
    .scenario-grid{
      display:grid;
      grid-template-columns:minmax(0,.95fr) minmax(320px,.75fr);
      gap:24px;
      align-items:stretch;
    }
    .scenario-panel{padding:34px;overflow:hidden}
    .scene-tabs{
      display:flex;flex-wrap:wrap;gap:10px;margin:24px 0 26px
    }
    .scene-tab{
      padding:10px 14px;border-radius:999px;border:1px solid var(--line);
      background:#fff;color:var(--ink-2);font-weight:900;
    }
    .scene-tab.active{background:var(--ink);color:#fff;border-color:var(--ink)}
    .demo-flow{
      display:grid;gap:14px;margin-top:24px
    }
    .flow-item{
      display:grid;grid-template-columns:44px 1fr;gap:14px;align-items:start;
      padding:16px;border-radius:20px;background:#fff8ee;border:1px solid rgba(200,115,44,.12)
    }
    .flow-item span{
      width:44px;height:44px;border-radius:16px;background:var(--brand);color:#fff;
      display:grid;place-items:center;font-weight:950;
    }
    .flow-item h4{margin:0 0 3px;font-weight:950;letter-spacing:-.03em}
    .flow-item p{margin:0;color:var(--muted)}
    .scene-board{
      border-radius:var(--radius-lg);
      background:linear-gradient(160deg,#101828,#273244);
      color:#fff;
      padding:28px;
      box-shadow:var(--shadow-lg);
      display:flex;
      flex-direction:column;
      justify-content:space-between;
      min-height:420px;
      position:relative;
      overflow:hidden;
    }
    .scene-board::before{
      content:"";
      position:absolute;right:-60px;top:-80px;width:230px;height:230px;border-radius:50%;background:rgba(232,182,95,.25)
    }
    .board-card{
      position:relative;
      padding:20px;
      border-radius:24px;
      background:rgba(255,255,255,.1);
      border:1px solid rgba(255,255,255,.14);
      backdrop-filter:blur(12px);
      margin-top:16px;
    }
    .board-card strong{display:block;font-size:2rem;letter-spacing:-.05em;line-height:1}
    .board-card span{color:rgba(255,255,255,.72)}
    .starter-section{padding:88px 0;background:linear-gradient(180deg,#fff 0%,#fbf2e6 100%)}
    .steps-line{
      display:grid;
      grid-template-columns:repeat(4,1fr);
      gap:16px;
      counter-reset:step;
    }
    .step-card{
      padding:24px;
      position:relative;
      overflow:hidden;
      transition:transform .25s var(--ease),box-shadow .25s var(--ease);
    }
    .step-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-md)}
    .step-card::before{
      counter-increment:step;
      content:"0" counter(step);
      display:inline-grid;place-items:center;
      width:42px;height:42px;border-radius:15px;
      background:var(--ink);color:#fff;
      font-weight:950;margin-bottom:22px;
    }
    .step-card p{color:var(--muted);margin-bottom:0}
    .story-section{padding:92px 0;background:#fff}
    .story-band{
      display:grid;
      grid-template-columns:minmax(0,.78fr) minmax(300px,.48fr);
      gap:24px;
      padding:40px;
      background:
        linear-gradient(135deg,rgba(255,255,255,.86),rgba(255,242,222,.78)),
        radial-gradient(circle at 85% 20%,rgba(232,182,95,.28),transparent 28%);
      overflow:hidden;
    }
    .story-quote{
      border-left:4px solid var(--brand);
      padding-left:22px;
      font-size:1.55rem;
      line-height:1.35;
      letter-spacing:-.04em;
      font-weight:950;
      margin:22px 0 0;
    }
    .story-metrics{
      display:grid;
      gap:14px;
    }
    .story-metric{
      padding:20px;
      border-radius:24px;
      background:#fff;
      border:1px solid var(--line);
      box-shadow:0 10px 28px rgba(17,24,39,.06);
    }
    .story-metric b{display:block;font-size:2.15rem;line-height:1;font-weight:950;letter-spacing:-.06em}
    .story-metric span{color:var(--muted);font-weight:800}
    .news-section{padding:88px 0;background:#111827;color:#fff}
    .news-section .section-title{color:#fff}
    .news-section .section-desc{color:rgba(255,255,255,.66)}
    .news-layout{
      display:grid;
      grid-template-columns:minmax(0,1fr) 340px;
      gap:24px;
      align-items:start;
    }
    .news-panel{
      padding:28px;
      background:rgba(255,255,255,.07);
      border-color:rgba(255,255,255,.12);
      box-shadow:none;
    }
    .news-list{list-style:none;margin:0;padding:0;display:grid;gap:4px}
    .news-list li a{
      display:grid;
      grid-template-columns:110px 1fr auto;
      gap:16px;
      align-items:center;
      padding:18px 0;
      border-bottom:1px solid rgba(255,255,255,.12);
      color:#fff;
    }
    .news-list li:last-child a{border-bottom:0}
    .news-date{
      color:#ffd9a8;
      font-weight:950;
      font-size:.92rem;
    }
    .news-title{
      font-weight:900;
      letter-spacing:-.02em;
    }
    .news-arrow{color:rgba(255,255,255,.42);transition:transform .25s var(--ease),color .25s var(--ease)}
    .news-list a:hover .news-arrow{transform:translateX(4px);color:#fff}
    .recommend-card{
      padding:26px;
      border-radius:var(--radius-lg);
      background:linear-gradient(180deg,#fff8ed,#f4d7ad);
      color:var(--ink);
      position:sticky;
      top:104px;
    }
    .recommend-card h3{font-weight:950;letter-spacing:-.04em}
    .recommend-card p{color:var(--ink-2)}
    .tag-cloud{display:flex;flex-wrap:wrap;gap:9px;margin-top:20px}
    .tag{
      display:inline-flex;padding:8px 11px;border-radius:999px;
      background:rgba(255,255,255,.72);border:1px solid rgba(17,24,39,.09);
      font-weight:900;font-size:.86rem;color:var(--ink-2)
    }
    .faq-section{padding:88px 0;background:#fffaf2}
    .faq-grid{
      display:grid;
      grid-template-columns:minmax(260px,.42fr) minmax(0,1fr);
      gap:28px;
      align-items:start;
    }
    .faq-card{padding:30px;position:sticky;top:104px}
    .accordion{
      display:grid;gap:14px;
    }
    .accordion-item{
      border:1px solid var(--line)!important;
      border-radius:24px!important;
      overflow:hidden;
      background:#fff;
      box-shadow:0 10px 26px rgba(17,24,39,.05);
    }
    .accordion-button{
      padding:21px 24px;
      font-weight:950;
      color:var(--ink);
      background:#fff!important;
      box-shadow:none!important;
      letter-spacing:-.02em;
    }
    .accordion-button:not(.collapsed){color:var(--brand-dark)}
    .accordion-button:focus{box-shadow:none;outline:3px solid rgba(232,182,95,.45);outline-offset:-3px}
    .accordion-body{padding:0 24px 24px;color:var(--muted)}
    .final-cta{padding:92px 0 110px;background:#fff}
    .cta-panel{
      display:grid;
      grid-template-columns:minmax(0,.82fr) minmax(320px,.55fr);
      gap:30px;
      padding:42px;
      background:
        linear-gradient(135deg,#111827 0%,#1f2937 58%,#8d501e 100%);
      color:#fff;
      overflow:hidden;
      position:relative;
      box-shadow:var(--shadow-lg);
    }
    .cta-panel::after{
      content:"";
      position:absolute;right:-140px;top:-140px;width:360px;height:360px;border-radius:50%;
      background:rgba(232,182,95,.24);filter:blur(3px)
    }
    .cta-panel .section-title{color:#fff}
    .cta-panel p{color:rgba(255,255,255,.70)}
    .support-form{
      position:relative;
      background:rgba(255,255,255,.1);
      border:1px solid rgba(255,255,255,.16);
      border-radius:28px;
      padding:24px;
      backdrop-filter:blur(14px);
    }
    .support-form label{font-weight:900;color:#fff;margin-bottom:8px}
    .form-control{
      border-radius:16px;
      border:1px solid rgba(255,255,255,.18);
      background:rgba(255,255,255,.92);
      padding:13px 14px;
      color:var(--ink);
    }
    .form-control::placeholder{color:#98a2b3}
    .form-hint{font-size:.88rem;color:rgba(255,255,255,.62);margin-top:12px}
    .toast-msg{
      display:none;
      margin-top:14px;
      color:#dbf7e9;
      background:rgba(47,141,106,.18);
      border:1px solid rgba(47,141,106,.25);
      border-radius:16px;
      padding:12px 14px;
      font-weight:850;
    }
    .toast-msg.show{display:block}
    .site-footer{
      background:#0b101b;
      color:rgba(255,255,255,.72);
      padding:44px 0 28px;
    }
    .footer-top{
      display:flex;
      justify-content:space-between;
      align-items:flex-start;
      gap:26px;
      padding-bottom:28px;
      border-bottom:1px solid rgba(255,255,255,.10);
    }
    .footer-brand .brand-mark{color:#fff}
    .footer-brand p{margin:14px 0 0;max-width:520px;color:rgba(255,255,255,.62)}
    .footer-links{
      display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end
    }
    .footer-links a{
      padding:9px 13px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);color:rgba(255,255,255,.78);font-weight:850
    }
    .footer-links a:hover{background:rgba(255,255,255,.12);color:#fff}
    .footer-bottom{
      display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;
      padding-top:22px;font-size:.92rem;color:rgba(255,255,255,.52)
    }
    @media (max-width: 1024px){
      :root{--container:920px}
      .mini-search{display:none}
      .hero-layout{grid-template-columns:1fr;padding:42px}
      .vertical-reel{min-height:470px}
      .reel-card{width:300px}
      .note-a{left:8%}.note-b{right:8%}
      .progress-wrap,.scenario-grid,.story-band,.cta-panel,.news-layout{grid-template-columns:1fr}
      .tier-layout{grid-template-columns:1fr 1fr}
      .tier-card.featured{grid-column:1 / -1;transform:none;order:-1}
      .tier-card.featured:hover{transform:translateY(-6px)}
      .steps-line{grid-template-columns:repeat(2,1fr)}
      .wall-wrap,.faq-grid{grid-template-columns:1fr}
      .wall-summary,.faq-card,.recommend-card{position:relative;top:auto}
    }
    @media (max-width: 768px){
      .container-custom{width:min(100% - 28px,var(--container))}
      .navbar-collapse{
        margin-top:14px;
        padding:16px;
        background:rgba(255,255,255,.92);
        border:1px solid var(--line);
        border-radius:24px;
        box-shadow:var(--shadow-sm);
      }
      .nav-pill{display:block;border-radius:20px;background:transparent;border:0;box-shadow:none;padding:0}
      .nav-link{margin-bottom:8px}
      .nav-action{margin-left:0;margin-top:8px}
      .nav-action .btn-brand{width:100%}
      .section-pad,.rewards-section,.wall-section,.scenario-section,.starter-section,.story-section,.news-section,.faq-section,.final-cta{padding:66px 0}
      .section-head{display:block}
      .hero{padding:24px 0 54px;min-height:auto}
      .hero-stage{border-radius:30px;min-height:auto}
      .hero-layout{padding:28px;gap:22px;min-height:auto}
      .hero-points{grid-template-columns:1fr}
      .hero-actions .btn-brand,.hero-actions .btn-darkline,.hero-actions .btn-ghost{width:100%}
      .vertical-reel{min-height:420px}
      .floating-note{display:none}
      .progress-top{display:block}
      .progress-label{margin-top:16px}
      .progress-meta{grid-template-columns:1fr}
      .tier-layout,.steps-line{grid-template-columns:1fr}
      .wall-grid{columns:1}
      .story-band,.cta-panel{padding:28px;border-radius:28px}
      .news-list li a{grid-template-columns:1fr auto;gap:8px}
      .news-date{grid-column:1 / -1}
      .footer-top{display:block}
      .footer-links{justify-content:flex-start;margin-top:20px}
    }
    @media (max-width: 520px){
      h1{font-size:2.76rem}
      .section-title{font-size:2.12rem}
      .brand-mark__sub{display:none}
      .hero-layout{padding:22px}
      .reel-card{width:260px;border-radius:30px;padding:18px}
      .reel-visual{height:180px}
      .progress-card,.side-proof,.tier-card,.wall-summary,.wall-card,.scenario-panel,.faq-card,.news-panel{padding:22px}
      .scene-board{min-height:360px;padding:22px}
      .big-number{font-size:3.4rem}
      .price strong{font-size:2.65rem}
      .cta-panel{padding:24px}
      .support-form{padding:18px}
    }

/* 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}
