/* roulang page: index */
:root{
      --bg-0:#050b14;
      --bg-1:#08111d;
      --bg-2:#0c1727;
      --panel:rgba(12, 23, 39, .72);
      --panel-strong:rgba(10, 21, 38, .9);
      --line:rgba(127, 209, 255, .16);
      --line-strong:rgba(93, 225, 255, .34);
      --text:#edf6ff;
      --muted:#90a8c4;
      --soft:#c8d7ea;
      --accent:#41e1ff;
      --accent-2:#6b85ff;
      --accent-3:#57f0b6;
      --accent-4:#ffd36c;
      --danger:#ff7e9a;
      --shadow:0 24px 60px rgba(0,0,0,.36);
      --shadow-soft:0 14px 32px rgba(0,0,0,.24);
      --radius-xl:22px;
      --radius-lg:18px;
      --radius-md:14px;
      --radius-sm:10px;
      --space-xl:92px;
      --space-lg:72px;
      --space-md:52px;
      --space-sm:28px;
      --container:1180px;
      --header-h:84px;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      min-height:100vh;
      color:var(--text);
      background:
        linear-gradient(180deg, #07111d 0%, #08111d 40%, #050b14 100%);
      font-family:"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans SC",sans-serif;
      line-height:1.7;
      letter-spacing:0;
      overflow-x:hidden;
    }
    body::before{
      content:"";
      position:fixed;
      inset:0;
      pointer-events:none;
      background:
        repeating-linear-gradient(90deg, rgba(255,255,255,.025) 0, rgba(255,255,255,.025) 1px, transparent 1px, transparent 120px),
        repeating-linear-gradient(180deg, rgba(255,255,255,.022) 0, rgba(255,255,255,.022) 1px, transparent 1px, transparent 120px),
        linear-gradient(120deg, rgba(65,225,255,.06) 0%, transparent 24%, transparent 76%, rgba(107,133,255,.06) 100%);
      opacity:.58;
      mix-blend-mode:screen;
      z-index:-2;
    }
    body::after{
      content:"";
      position:fixed;
      inset:0;
      pointer-events:none;
      background:
        linear-gradient(180deg, rgba(5,11,20,.08), rgba(5,11,20,.22)),
        linear-gradient(90deg, rgba(4,9,18,.22), transparent 16%, transparent 84%, rgba(4,9,18,.22));
      z-index:-1;
    }
    a{
      color:var(--text);
      text-decoration:none;
      transition:color .2s ease, opacity .2s ease, transform .2s ease, border-color .2s ease, box-shadow .2s ease, background .2s ease;
    }
    a:hover,a:focus{color:var(--accent)}
    img{max-width:100%;display:block}
    button,input,select,textarea{
      font:inherit;
    }
    .grid-container{
      max-width:var(--container);
      padding-left:1rem;
      padding-right:1rem;
    }
    .site-header{
      position:sticky;
      top:0;
      z-index:50;
      backdrop-filter:blur(18px);
      background:linear-gradient(180deg, rgba(5,11,20,.9), rgba(5,11,20,.72));
      border-bottom:1px solid rgba(127, 209, 255, .1);
    }
    .top-strip{
      border-bottom:1px solid rgba(127, 209, 255, .1);
      background:rgba(10,18,31,.42);
      font-size:12px;
      color:var(--muted);
    }
    .top-strip .grid-container{
      min-height:36px;
    }
    .top-strip .strip-inner{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:14px;
      padding:.35rem 0;
    }
    .strip-note,.strip-domain,.strip-action{
      display:inline-flex;
      align-items:center;
      gap:.45rem;
      white-space:nowrap;
    }
    .strip-action a{
      color:var(--soft);
      font-weight:600;
    }
    .strip-action a:hover{color:var(--accent)}
    .nav-shell{
      padding:.55rem 0;
    }
    .title-bar{
      display:flex;
      align-items:center;
      justify-content:space-between;
      background:transparent;
      padding:.2rem 0 .6rem;
    }
    .title-bar .menu-icon{
      width:42px;
      height:42px;
      position:relative;
      border-radius:12px;
      border:1px solid rgba(127, 209, 255, .14);
      background:rgba(10, 20, 36, .55);
      box-shadow:var(--shadow-soft);
    }
    .title-bar .menu-icon::after{
      background:#eff6ff;
      box-shadow:0 8px 0 #eff6ff, 0 -8px 0 #eff6ff;
    }
    .top-bar{
      background:transparent;
      padding:0;
    }
    .top-bar ul{
      background:transparent;
    }
    .brand{
      display:inline-flex;
      align-items:center;
      gap:.8rem;
      color:var(--text);
      font-weight:800;
      letter-spacing:0;
    }
    .brand:hover{color:var(--text)}
    .brand-mark{
      width:42px;
      height:42px;
      border-radius:14px;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      background:
        linear-gradient(135deg, rgba(65,225,255,.24), rgba(107,133,255,.18)),
        linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,0));
      border:1px solid rgba(127, 209, 255, .28);
      box-shadow:0 16px 28px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.18);
      color:var(--text);
      font-size:1rem;
      line-height:1;
      flex:none;
    }
    .brand-text{
      display:flex;
      flex-direction:column;
      line-height:1.2;
    }
    .brand-text strong{
      font-size:1rem;
      font-weight:800;
    }
    .brand-text span{
      font-size:.78rem;
      color:var(--muted);
      font-weight:500;
    }
    .menu.desktop-menu{
      gap:.5rem;
      align-items:center;
    }
    .menu.desktop-menu li a{
      position:relative;
      padding:.72rem 1rem;
      color:var(--soft);
      font-weight:700;
      border-radius:999px;
      transition:background .2s ease, color .2s ease, box-shadow .2s ease;
    }
    .menu.desktop-menu li a::after{
      content:"";
      position:absolute;
      left:14px;
      right:14px;
      bottom:8px;
      height:2px;
      border-radius:999px;
      background:linear-gradient(90deg, transparent, var(--accent), transparent);
      opacity:0;
      transform:scaleX(.72);
      transition:opacity .2s ease, transform .2s ease;
    }
    .menu.desktop-menu li a:hover,
    .menu.desktop-menu li a.is-active{
      color:var(--text);
      background:rgba(65,225,255,.08);
      box-shadow:inset 0 0 0 1px rgba(65,225,255,.16);
    }
    .menu.desktop-menu li a:hover::after,
    .menu.desktop-menu li a.is-active::after{
      opacity:1;
      transform:scaleX(1);
    }
    .section-wrap{
      padding:var(--space-xl) 0;
    }
    .section-wrap.tight{padding:var(--space-lg) 0}
    .hero-wrap{
      padding-top:28px;
      padding-bottom:var(--space-lg);
    }
    .hero-band{
      position:relative;
      overflow:hidden;
      border:1px solid rgba(127,209,255,.14);
      border-radius:28px;
      background:
        linear-gradient(135deg, rgba(8,18,31,.94), rgba(11,24,42,.76)),
        linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,0));
      box-shadow:var(--shadow);
    }
    .hero-band::before{
      content:"";
      position:absolute;
      inset:0;
      pointer-events:none;
      background:
        linear-gradient(120deg, rgba(65,225,255,.12), transparent 38%, transparent 62%, rgba(107,133,255,.1)),
        radial-gradient(1000px 300px at 0% 0%, rgba(65,225,255,.08), transparent 45%),
        radial-gradient(900px 280px at 100% 100%, rgba(107,133,255,.08), transparent 45%);
      opacity:.9;
    }
    .hero-content{
      position:relative;
      z-index:1;
      padding:2.2rem 0;
    }
    .kicker{
      display:inline-flex;
      align-items:center;
      gap:.5rem;
      padding:.38rem .76rem;
      border-radius:999px;
      border:1px solid rgba(65,225,255,.24);
      background:rgba(65,225,255,.08);
      color:var(--accent);
      font-size:.85rem;
      font-weight:700;
      box-shadow:inset 0 1px 0 rgba(255,255,255,.12);
    }
    .hero-title{
      margin:.95rem 0 .9rem;
      font-size:3.05rem;
      line-height:1.08;
      font-weight:800;
      letter-spacing:0;
      text-wrap:balance;
    }
    .hero-lead{
      max-width:44rem;
      color:var(--soft);
      font-size:1.05rem;
      margin-bottom:1.35rem;
    }
    .hero-actions{
      display:flex;
      flex-wrap:wrap;
      gap:.8rem;
      margin-bottom:1.3rem;
    }
    .button{
      margin:0;
      border:none;
      font-weight:700;
      letter-spacing:0;
      border-radius:14px;
      padding:.92rem 1.15rem;
      transition:transform .2s ease, box-shadow .2s ease, background .2s ease, border-color .2s ease, color .2s ease;
      display:inline-flex;
      align-items:center;
      gap:.55rem;
    }
    .button:focus,
    .button:focus-visible,
    input:focus,
    select:focus,
    textarea:focus{
      outline:none;
      box-shadow:0 0 0 3px rgba(65,225,255,.18), 0 0 0 1px rgba(65,225,255,.3) inset;
    }
    .button.btn-primary{
      color:#04101b;
      background:linear-gradient(135deg, #54ecff 0%, #76d6ff 46%, #87a1ff 100%);
      box-shadow:0 14px 30px rgba(65,225,255,.18), inset 0 1px 0 rgba(255,255,255,.38);
    }
    .button.btn-primary:hover{
      color:#04101b;
      transform:translateY(-2px);
      box-shadow:0 18px 38px rgba(65,225,255,.24), 0 0 0 1px rgba(65,225,255,.18) inset;
    }
    .button.btn-secondary{
      color:var(--text);
      background:rgba(12,22,37,.5);
      border:1px solid rgba(127,209,255,.22);
      box-shadow:inset 0 1px 0 rgba(255,255,255,.07);
    }
    .button.btn-secondary:hover{
      color:var(--text);
      transform:translateY(-2px);
      border-color:rgba(65,225,255,.34);
      background:rgba(12,22,37,.72);
      box-shadow:0 16px 28px rgba(0,0,0,.22);
    }
    .hero-stats{
      display:flex;
      flex-wrap:wrap;
      gap:.7rem;
      margin-top:1rem;
    }
    .chip{
      display:inline-flex;
      align-items:center;
      gap:.45rem;
      padding:.46rem .78rem;
      border-radius:999px;
      font-size:.84rem;
      font-weight:700;
      color:var(--soft);
      background:rgba(255,255,255,.04);
      border:1px solid rgba(127,209,255,.12);
    }
    .chip i{font-size:.9em}
    .chip.accent{
      color:#e9fbff;
      background:rgba(65,225,255,.12);
      border-color:rgba(65,225,255,.22);
    }
    .chip.success{
      color:#eafff5;
      background:rgba(87,240,182,.12);
      border-color:rgba(87,240,182,.2);
    }
    .chip.warn{
      color:#fff4d9;
      background:rgba(255,211,108,.12);
      border-color:rgba(255,211,108,.18);
    }
    .hero-visual{
      position:relative;
      z-index:1;
      padding:2.1rem 0 2.2rem;
    }
    .glass-card{
      position:relative;
      overflow:hidden;
      border-radius:var(--radius-xl);
      background:var(--panel);
      border:1px solid var(--line);
      box-shadow:var(--shadow-soft);
      backdrop-filter:blur(18px);
      -webkit-backdrop-filter:blur(18px);
    }
    .glass-card::before{
      content:"";
      position:absolute;
      inset:0;
      background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,0) 28%);
      pointer-events:none;
    }
    .hero-panel{
      padding:1.2rem;
    }
    .panel-head{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:.8rem;
      margin-bottom:1rem;
    }
    .panel-note{
      color:var(--muted);
      font-size:.84rem;
    }
    .big-score{
      display:flex;
      align-items:flex-end;
      gap:.5rem;
      margin-bottom:1rem;
    }
    .big-score strong{
      font-size:3rem;
      line-height:1;
      letter-spacing:0;
    }
    .big-score span{
      color:var(--muted);
      padding-bottom:.35rem;
      font-size:.92rem;
    }
    .score-copy{
      color:var(--soft);
      margin-bottom:1rem;
      font-size:.96rem;
    }
    .mini-matrix{
      display:grid;
      grid-template-columns:repeat(3, 1fr);
      gap:.7rem;
      margin-bottom:1rem;
    }
    .mini-tile{
      border-radius:16px;
      padding:.9rem .9rem .82rem;
      background:rgba(9,18,30,.62);
      border:1px solid rgba(127,209,255,.12);
    }
    .mini-tile .num{
      display:block;
      font-size:1.2rem;
      font-weight:800;
      color:var(--text);
      line-height:1.1;
    }
    .mini-tile .label{
      display:block;
      margin-top:.25rem;
      color:var(--muted);
      font-size:.78rem;
    }
    .quick-filter{
      margin-top:.8rem;
      padding-top:.95rem;
      border-top:1px solid rgba(127,209,255,.12);
    }
    .quick-filter label{
      display:block;
      margin-bottom:.55rem;
      color:var(--soft);
      font-size:.88rem;
      font-weight:700;
    }
    .quick-filter .input-group{
      margin-bottom:.85rem;
    }
    .quick-filter input,
    .apply-form input,
    .apply-form textarea,
    .apply-form select{
      width:100%;
      margin:0;
      height:3rem;
      border-radius:14px;
      color:var(--text);
      background:rgba(8,16,28,.72);
      border:1px solid rgba(127,209,255,.16);
      box-shadow:none;
      transition:border-color .2s ease, box-shadow .2s ease, background .2s ease;
    }
    .quick-filter input::placeholder,
    .apply-form input::placeholder,
    .apply-form textarea::placeholder{
      color:#6f87a5;
    }
    .input-group{
      gap:.6rem;
    }
    .input-group > :first-child,
    .input-group > :last-child{
      border-radius:14px;
    }
    .quick-filter .button{
      height:3rem;
      padding-inline:1rem;
      border-radius:14px;
    }
    .chip-row{
      display:flex;
      flex-wrap:wrap;
      gap:.55rem;
    }
    .micro-line{
      height:1px;
      background:linear-gradient(90deg, transparent, rgba(65,225,255,.36), transparent);
      margin:1rem 0;
    }
    .section-head{
      margin-bottom:1.5rem;
    }
    .section-kicker{
      display:inline-flex;
      align-items:center;
      gap:.45rem;
      padding:.34rem .72rem;
      border-radius:999px;
      border:1px solid rgba(127,209,255,.18);
      background:rgba(255,255,255,.04);
      color:var(--accent);
      font-weight:700;
      font-size:.84rem;
    }
    .section-title{
      margin:.85rem 0 .65rem;
      font-size:2.1rem;
      line-height:1.16;
      font-weight:800;
      letter-spacing:0;
    }
    .section-lead{
      margin:0;
      max-width:48rem;
      color:var(--muted);
      font-size:1rem;
    }
    .content-band{
      position:relative;
      padding:1.05rem;
      border-radius:var(--radius-xl);
      background:var(--panel);
      border:1px solid var(--line);
      box-shadow:var(--shadow-soft);
      backdrop-filter:blur(16px);
      -webkit-backdrop-filter:blur(16px);
      transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
    }
    .content-band:hover{
      transform:translateY(-4px);
      border-color:rgba(65,225,255,.26);
      box-shadow:0 18px 38px rgba(0,0,0,.28);
    }
    .feature-card{
      min-height:100%;
      padding:1.15rem 1.08rem 1.1rem;
      border-radius:var(--radius-xl);
      background:rgba(10,19,33,.66);
      border:1px solid rgba(127,209,255,.12);
      box-shadow:var(--shadow-soft);
      transition:transform .2s ease, border-color .2s ease, box-shadow .2s ease;
    }
    .feature-card:hover{
      transform:translateY(-4px);
      border-color:rgba(65,225,255,.25);
      box-shadow:0 18px 38px rgba(0,0,0,.26);
    }
    .feature-icon{
      width:46px;
      height:46px;
      border-radius:14px;
      display:flex;
      align-items:center;
      justify-content:center;
      margin-bottom:.85rem;
      color:var(--accent);
      background:linear-gradient(135deg, rgba(65,225,255,.14), rgba(107,133,255,.1));
      border:1px solid rgba(65,225,255,.18);
    }
    .feature-card h3,
    .scenario-card h3,
    .content-card h3,
    .news-card h3,
    .trust-card h3,
    .price-card h3,
    .cta-card h3{
      margin:0 0 .65rem;
      font-size:1.08rem;
      line-height:1.35;
      font-weight:800;
      letter-spacing:0;
    }
    .feature-card p,
    .scenario-card p,
    .content-card p,
    .news-card p,
    .trust-card p,
    .price-card p,
    .cta-card p{
      margin:0;
      color:var(--muted);
      font-size:.95rem;
    }
    .feature-tags,
    .content-tags,
    .news-meta{
      display:flex;
      flex-wrap:wrap;
      gap:.45rem;
      margin-top:.9rem;
    }
    .mini-tag{
      display:inline-flex;
      align-items:center;
      gap:.3rem;
      padding:.28rem .56rem;
      border-radius:999px;
      background:rgba(255,255,255,.04);
      border:1px solid rgba(127,209,255,.12);
      color:var(--soft);
      font-size:.78rem;
      font-weight:700;
    }
    .scenario-card{
      position:relative;
      height:100%;
      padding:1.1rem;
      border-radius:var(--radius-xl);
      background:linear-gradient(180deg, rgba(11,20,35,.7), rgba(11,20,35,.56));
      border:1px solid rgba(127,209,255,.12);
      box-shadow:var(--shadow-soft);
    }
    .scenario-card::after{
      content:"";
      position:absolute;
      left:1.1rem;
      right:1.1rem;
      bottom:1rem;
      height:3px;
      border-radius:999px;
      background:linear-gradient(90deg, rgba(65,225,255,.22), rgba(107,133,255,.66), rgba(87,240,182,.18));
      opacity:.9;
    }
    .step-badge{
      display:inline-flex;
      align-items:center;
      gap:.38rem;
      margin-bottom:.8rem;
      color:var(--accent);
      font-weight:800;
      font-size:.82rem;
    }
    .progress-soft{
      margin-top:1rem;
      height:7px;
      border-radius:999px;
      overflow:hidden;
      background:rgba(255,255,255,.05);
      border:1px solid rgba(127,209,255,.1);
    }
    .progress-soft span{
      display:block;
      height:100%;
      border-radius:inherit;
      background:linear-gradient(90deg, var(--accent), var(--accent-2), var(--accent-3));
    }
    .progress-label{
      display:flex;
      justify-content:space-between;
      align-items:center;
      margin-top:.55rem;
      color:var(--muted);
      font-size:.82rem;
    }
    .content-card{
      height:100%;
      overflow:hidden;
      border-radius:var(--radius-xl);
      background:rgba(10,19,33,.66);
      border:1px solid rgba(127,209,255,.12);
      box-shadow:var(--shadow-soft);
      transition:transform .2s ease, border-color .2s ease, box-shadow .2s ease;
    }
    .content-card:hover{
      transform:translateY(-4px);
      border-color:rgba(65,225,255,.24);
      box-shadow:0 18px 38px rgba(0,0,0,.26);
    }
    .content-cover{
      position:relative;
      height:164px;
      background:
        linear-gradient(135deg, rgba(65,225,255,.24), rgba(107,133,255,.08) 46%, rgba(87,240,182,.08)),
        linear-gradient(180deg, rgba(255,255,255,.1), transparent);
      border-bottom:1px solid rgba(127,209,255,.1);
    }
    .content-cover::before{
      content:"";
      position:absolute;
      inset:12px;
      border-radius:18px;
      border:1px solid rgba(255,255,255,.1);
      background:
        linear-gradient(120deg, rgba(255,255,255,.18), rgba(255,255,255,0) 35%),
        linear-gradient(160deg, rgba(8,16,28,.24), rgba(8,16,28,.06));
      box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
    }
    .content-cover .corner{
      position:absolute;
      top:14px;
      left:14px;
      z-index:1;
      display:inline-flex;
      align-items:center;
      padding:.32rem .55rem;
      border-radius:999px;
      color:#eafcff;
      background:rgba(7,16,29,.56);
      border:1px solid rgba(255,255,255,.12);
      font-size:.78rem;
      font-weight:700;
    }
    .content-body{
      padding:1.05rem 1.05rem 1rem;
    }
    .content-stats{
      display:flex;
      gap:.7rem;
      flex-wrap:wrap;
      margin-top:.85rem;
      color:var(--muted);
      font-size:.82rem;
    }
    .news-card{
      padding:1.1rem;
      border-radius:var(--radius-xl);
      background:rgba(10,19,33,.66);
      border:1px solid rgba(127,209,255,.12);
      box-shadow:var(--shadow-soft);
    }
    .news-list{
      list-style:none;
      margin:0;
      padding:0;
      display:grid;
      gap:.3rem;
    }
    .news-list li a{
      display:flex;
      justify-content:space-between;
      align-items:flex-start;
      gap:1rem;
      padding:.9rem .8rem;
      border-radius:14px;
      color:var(--text);
      background:rgba(255,255,255,.02);
      border:1px solid transparent;
    }
    .news-list li a:hover{
      color:var(--text);
      border-color:rgba(65,225,255,.18);
      background:rgba(65,225,255,.06);
      transform:translateY(-2px);
    }
    .news-title{
      flex:1;
      min-width:0;
    }
    .news-title strong{
      display:block;
      font-size:.98rem;
      line-height:1.45;
      margin-bottom:.32rem;
      font-weight:700;
      white-space:normal;
    }
    .news-title span{
      color:var(--muted);
      font-size:.82rem;
    }
    .news-time{
      flex:none;
      color:var(--muted);
      font-size:.8rem;
      padding-top:.15rem;
    }
    .side-panel{
      height:100%;
      padding:1.1rem;
      border-radius:var(--radius-xl);
      background:linear-gradient(180deg, rgba(11,20,35,.7), rgba(11,20,35,.56));
      border:1px solid rgba(127,209,255,.12);
      box-shadow:var(--shadow-soft);
    }
    .side-panel .mini-stack{
      display:grid;
      gap:.8rem;
      margin-top:.95rem;
    }
    .signal-row{
      display:flex;
      align-items:center;
      gap:.65rem;
      justify-content:space-between;
      padding:.84rem .9rem;
      border-radius:14px;
      background:rgba(255,255,255,.03);
      border:1px solid rgba(127,209,255,.1);
    }
    .signal-row strong{
      font-size:.96rem;
      font-weight:800;
    }
    .signal-row span{
      color:var(--muted);
      font-size:.82rem;
    }
    .bar-stack{
      display:grid;
      gap:.55rem;
      margin-top:1rem;
    }
    .bar-item{
      display:grid;
      gap:.3rem;
    }
    .bar-item .bar-head{
      display:flex;
      justify-content:space-between;
      align-items:center;
      color:var(--muted);
      font-size:.82rem;
    }
    .bar-track{
      height:8px;
      border-radius:999px;
      overflow:hidden;
      background:rgba(255,255,255,.05);
      border:1px solid rgba(127,209,255,.1);
    }
    .bar-track span{
      display:block;
      height:100%;
      border-radius:inherit;
      background:linear-gradient(90deg, var(--accent), var(--accent-2), var(--accent-3));
    }
    .trust-card{
      height:100%;
      padding:1.05rem;
      border-radius:var(--radius-xl);
      background:rgba(10,19,33,.66);
      border:1px solid rgba(127,209,255,.12);
      box-shadow:var(--shadow-soft);
    }
    .trust-icon{
      width:44px;
      height:44px;
      border-radius:14px;
      display:flex;
      align-items:center;
      justify-content:center;
      color:var(--accent-3);
      background:rgba(87,240,182,.12);
      border:1px solid rgba(87,240,182,.18);
      margin-bottom:.9rem;
    }
    .trust-list{
      list-style:none;
      margin:.9rem 0 0;
      padding:0;
      display:grid;
      gap:.55rem;
    }
    .trust-list li{
      display:flex;
      align-items:flex-start;
      gap:.55rem;
      color:var(--soft);
      font-size:.92rem;
    }
    .trust-list i{
      color:var(--accent);
      margin-top:.24rem;
      font-size:.82rem;
    }
    .price-card{
      height:100%;
      padding:1.2rem;
      border-radius:var(--radius-xl);
      background:rgba(10,19,33,.7);
      border:1px solid rgba(127,209,255,.12);
      box-shadow:var(--shadow-soft);
      display:flex;
      flex-direction:column;
      transition:transform .2s ease, border-color .2s ease, box-shadow .2s ease;
    }
    .price-card:hover{
      transform:translateY(-4px);
      border-color:rgba(65,225,255,.24);
      box-shadow:0 18px 38px rgba(0,0,0,.26);
    }
    .price-card.featured{
      border-color:rgba(65,225,255,.3);
      background:
        linear-gradient(180deg, rgba(16,29,48,.84), rgba(10,19,33,.76));
      box-shadow:0 24px 56px rgba(65,225,255,.08), 0 18px 38px rgba(0,0,0,.28);
      transform:translateY(-6px);
    }
    .price-tag{
      display:inline-flex;
      align-items:center;
      gap:.35rem;
      align-self:flex-start;
      margin-bottom:.8rem;
      padding:.34rem .62rem;
      border-radius:999px;
      color:#ebfbff;
      background:rgba(65,225,255,.12);
      border:1px solid rgba(65,225,255,.18);
      font-size:.78rem;
      font-weight:800;
    }
    .price-value{
      display:flex;
      align-items:flex-end;
      gap:.35rem;
      margin:.25rem 0 .8rem;
      line-height:1;
    }
    .price-value strong{
      font-size:2.45rem;
      font-weight:800;
      letter-spacing:0;
    }
    .price-value span{
      color:var(--muted);
      padding-bottom:.2rem;
      font-size:.88rem;
    }
    .price-list{
      list-style:none;
      margin:1rem 0 1.2rem;
      padding:0;
      display:grid;
      gap:.62rem;
      color:var(--soft);
    }
    .price-list li{
      display:flex;
      align-items:flex-start;
      gap:.55rem;
      font-size:.92rem;
    }
    .price-list i{
      color:var(--accent-3);
      margin-top:.2rem;
    }
    .price-card .button{
      margin-top:auto;
      width:100%;
      justify-content:center;
    }
    .faq-wrap{
      padding-top:.4rem;
    }
    .accordion{
      margin:0;
      border:none;
      background:transparent;
    }
    .accordion-item{
      overflow:hidden;
      margin-bottom:.85rem;
      border-radius:18px;
      border:1px solid rgba(127,209,255,.12);
      background:rgba(10,19,33,.68);
      box-shadow:var(--shadow-soft);
    }
    .accordion-title{
      position:relative;
      padding:1rem 1.05rem;
      color:var(--text);
      font-size:1rem;
      font-weight:800;
      line-height:1.45;
      border:none;
      background:transparent;
    }
    .accordion-title:hover,
    .accordion-title:focus{
      color:var(--accent);
      background:rgba(65,225,255,.04);
    }
    .accordion-title::before{
      right:1rem;
      top:50%;
      margin-top:-.62rem;
      width:1.1rem;
      height:1.1rem;
      color:var(--accent);
      font-size:1rem;
    }
    .accordion-content{
      padding:0 1.05rem 1.05rem;
      color:var(--muted);
      border:none;
      background:transparent;
    }
    .accordion-content p{
      margin:0;
    }
    .apply-card{
      padding:1.2rem;
      border-radius:var(--radius-xl);
      background:rgba(10,19,33,.72);
      border:1px solid rgba(127,209,255,.12);
      box-shadow:var(--shadow-soft);
    }
    .apply-form label{
      color:var(--soft);
      font-size:.88rem;
      font-weight:700;
      margin-bottom:.35rem;
    }
    .apply-form input,
    .apply-form select,
    .apply-form textarea{
      margin-bottom:1rem;
    }
    .apply-form textarea{
      min-height:120px;
      resize:vertical;
    }
    .form-note{
      color:var(--muted);
      font-size:.84rem;
      margin-top:.65rem;
    }
    .cta-line{
      display:flex;
      flex-wrap:wrap;
      gap:.8rem;
      margin-top:1rem;
    }
    footer{
      margin-top:var(--space-lg);
      padding:2.1rem 0 2.2rem;
      border-top:1px solid rgba(127,209,255,.1);
      background:rgba(7,12,22,.75);
    }
    .footer-grid{
      display:grid;
      grid-template-columns:1.4fr .8fr .9fr 1fr;
      gap:1.25rem;
    }
    .footer-brand{
      display:flex;
      align-items:center;
      gap:.8rem;
      margin-bottom:.9rem;
    }
    .footer-copy{
      color:var(--muted);
      font-size:.92rem;
      margin:0;
    }
    .footer-title{
      color:var(--text);
      font-size:.95rem;
      font-weight:800;
      margin:0 0 .8rem;
    }
    .footer-links{
      list-style:none;
      margin:0;
      padding:0;
      display:grid;
      gap:.55rem;
    }
    .footer-links a{
      color:var(--muted);
      font-size:.9rem;
    }
    .footer-links a:hover{color:var(--accent)}
    .footer-note{
      color:var(--muted);
      font-size:.86rem;
      margin:0;
    }
    .footer-bottom{
      margin-top:1.3rem;
      padding-top:1rem;
      border-top:1px solid rgba(127,209,255,.1);
      color:var(--muted);
      font-size:.82rem;
      display:flex;
      flex-wrap:wrap;
      justify-content:space-between;
      gap:.6rem;
    }
    .section-divider{
      height:1px;
      background:linear-gradient(90deg, transparent, rgba(65,225,255,.36), rgba(107,133,255,.22), transparent);
      margin:1.1rem 0;
    }
    .subtle-grid{
      display:grid;
      grid-template-columns:repeat(12, 1fr);
      gap:1rem;
    }
    .notice-row{
      display:flex;
      flex-wrap:wrap;
      gap:.55rem;
      margin-top:.9rem;
    }
    .notice{
      padding:.45rem .68rem;
      border-radius:999px;
      background:rgba(255,255,255,.04);
      border:1px solid rgba(127,209,255,.1);
      color:var(--soft);
      font-size:.82rem;
      font-weight:700;
    }
    .soft-card{
      padding:1rem;
      border-radius:20px;
      background:rgba(255,255,255,.03);
      border:1px solid rgba(127,209,255,.1);
    }
    .align-center{
      align-items:center;
    }
    .mobile-only{display:none}
    .desktop-only{display:block}
    .nav-compact{
      display:flex;
      justify-content:flex-end;
      align-items:center;
      gap:.8rem;
    }
    .mini-link{
      color:var(--soft);
      font-size:.9rem;
      font-weight:700;
      padding:.45rem .62rem;
      border-radius:999px;
      border:1px solid transparent;
    }
    .mini-link:hover{
      color:var(--text);
      border-color:rgba(65,225,255,.16);
      background:rgba(65,225,255,.05);
    }
    @media (max-width: 1023px){
      .hero-title{font-size:2.5rem}
      .section-title{font-size:1.85rem}
      .footer-grid{grid-template-columns:1fr 1fr}
      .mini-matrix{grid-template-columns:repeat(2, 1fr)}
      .desktop-only{display:none}
      .mobile-only{display:block}
    }
    @media (max-width: 767px){
      .top-strip .strip-inner{
        justify-content:center;
        text-align:center;
        flex-direction:column;
        gap:.15rem;
      }
      .hero-content{padding:1.6rem 0 1rem}
      .hero-visual{padding-top:0}
      .hero-title{font-size:2.05rem}
      .section-title{font-size:1.55rem}
      .section-wrap{padding:var(--space-lg) 0}
      .section-wrap.tight{padding:var(--space-md) 0}
      .button{width:100%;justify-content:center}
      .hero-actions{display:grid;grid-template-columns:1fr}
      .mini-matrix{grid-template-columns:1fr}
      .footer-grid{grid-template-columns:1fr}
      .content-cover{height:150px}
      .price-card.featured{transform:none}
      .title-bar{padding-bottom:.45rem}
      .title-bar-left .brand-text strong{font-size:.96rem}
    }
    @media (max-width: 520px){
      .hero-band{border-radius:22px}
      .hero-content,.hero-visual,.content-band,.feature-card,.scenario-card,.content-card,.news-card,.side-panel,.trust-card,.price-card,.apply-card{
        border-radius:20px;
      }
      .hero-title{font-size:1.8rem}
      .hero-lead,.section-lead{font-size:.94rem}
      .mini-tile .num{font-size:1.05rem}
      .menu.desktop-menu li a{padding:.6rem .82rem}
      .strip-domain{display:none}
    }

/* roulang page: category1 */
\n+    :root {\n+      --bg-0: #06101d;\n+      --bg-1: #091525;\n+      --bg-2: #0d1f38;\n+      --panel: rgba(12, 24, 43, 0.72);\n+      --panel-strong: rgba(14, 27, 50, 0.9);\n+      --line: rgba(126, 167, 255, 0.18);\n+      --line-strong: rgba(120, 229, 255, 0.32);\n+      --text: #ecf4ff;\n+      --muted: #9db2d1;\n+      --soft: #c9d8f2;\n+      --accent: #48e4ff;\n+      --accent-2: #7d8cff;\n+      --accent-3: #4df0b7;\n+      --danger: #ff8f8f;\n+      --shadow: 0 20px 50px rgba(2, 8, 24, 0.38);\n+      --shadow-soft: 0 12px 28px rgba(2, 8, 24, 0.24);\n+      --radius-lg: 22px;\n+      --radius-md: 16px;\n+      --radius-sm: 12px;\n+      --container: 1180px;\n+    }\n+\n+    * {\n+      box-sizing: border-box;\n+    }\n+\n+    html {\n+      scroll-behavior: smooth;\n+    }\n+\n+    body {\n+      margin: 0;\n+      color: var(--text);\n+      font-family: -apple-system, BlinkMacSystemFont, \"PingFang SC\", \"Hiragino Sans GB\", \"Microsoft YaHei\", \"Noto Sans SC\", sans-serif;\n+      line-height: 1.65;\n+      background:\n+        linear-gradient(180deg, rgba(7, 14, 26, 0.82), rgba(7, 14, 26, 0.94)),\n+        linear-gradient(120deg, rgba(11, 27, 51, 0.92), rgba(6, 16, 29, 0.96) 56%, rgba(10, 24, 46, 0.92)),\n+        repeating-linear-gradient(90deg, rgba(114, 183, 255, 0.04) 0 1px, transparent 1px 72px),\n+        repeating-linear-gradient(180deg, rgba(114, 183, 255, 0.03) 0 1px, transparent 1px 72px),\n+        var(--bg-0);\n+      background-attachment: fixed;\n+      text-rendering: optimizeLegibility;\n+      -webkit-font-smoothing: antialiased;\n+    }\n+\n+    body::before {\n+      content: \"\";\n+      position: fixed;\n+      inset: 0;\n+      pointer-events: none;\n+      background:\n+        linear-gradient(145deg, rgba(72, 228, 255, 0.08), transparent 38%),\n+        linear-gradient(315deg, rgba(125, 140, 255, 0.08), transparent 34%),\n+        linear-gradient(0deg, rgba(255, 255, 255, 0.02), rgba(255, 255, 255, 0.02));\n+      mix-blend-mode: screen;\n+      opacity: 0.9;\n+    }\n+\n+    a {\n+      color: inherit;\n+      text-decoration: none;\n+      transition: color .2s ease, opacity .2s ease, transform .2s ease, border-color .2s ease, background .2s ease, box-shadow .2s ease;\n+    }\n+\n+    img {\n+      max-width: 100%;\n+      display: block;\n+    }\n+\n+    button,\n+    input,\n+    select,\n+    textarea {\n+      font: inherit;\n+    }\n+\n+    button {\n+      cursor: pointer;\n+    }\n+\n+    :focus-visible {\n+      outline: 2px solid var(--accent);\n+      outline-offset: 3px;\n+    }\n+\n+    .grid-container {\n+      max-width: var(--container);\n+      padding-left: 1rem;\n+      padding-right: 1rem;\n+    }\n+\n+    .site-header {\n+      position: sticky;\n+      top: 0;\n+      z-index: 1000;\n+      backdrop-filter: blur(16px);\n+    }\n+\n+    .top-strip {\n+      border-bottom: 1px solid rgba(129, 172, 255, 0.1);\n+      background: rgba(5, 12, 22, 0.72);\n+      box-shadow: 0 1px 0 rgba(255,255,255,0.02) inset;\n+    }\n+\n+    .strip-inner {\n+      display: flex;\n+      align-items: center;\n+      justify-content: space-between;\n+      gap: 1rem;\n+      min-height: 40px;\n+      font-size: .82rem;\n+      color: var(--muted);\n+      letter-spacing: 0;\n+    }\n+\n+    .strip-note,\n+    .strip-domain,\n+    .strip-action a {\n+      display: inline-flex;\n+      align-items: center;\n+      gap: .5rem;\n+      white-space: nowrap;\n+    }\n+\n+    .strip-action a {\n+      color: var(--soft);\n+      padding: .3rem .72rem;\n+      border: 1px solid rgba(120, 229, 255, 0.18);\n+      border-radius: 999px;\n+      background: rgba(12, 24, 43, 0.56);\n+      box-shadow: inset 0 1px 0 rgba(255,255,255,0.05);\n+    }\n+\n+    .strip-action a:hover {\n+      color: #fff;\n+      border-color: rgba(120, 229, 255, 0.42);\n+      box-shadow: 0 0 0 1px rgba(72, 228, 255, 0.18), 0 10px 22px rgba(3, 16, 32, 0.25);\n+    }\n+\n+    .nav-shell {\n+      border-bottom: 1px solid rgba(129, 172, 255, 0.12);\n+      background: rgba(8, 16, 30, 0.84);\n+      box-shadow: 0 14px 34px rgba(0, 0, 0, 0.18);\n+    }\n+\n+    .title-bar,\n+    .top-bar {\n+      background: transparent;\n+      padding: .85rem 0;\n+    }\n+\n+    .title-bar {\n+      display: flex;\n+      align-items: center;\n+      justify-content: space-between;\n+    }\n+\n+    .brand {\n+      display: inline-flex;\n+      align-items: center;\n+      gap: .75rem;\n+      color: var(--text);\n+      min-width: 0;\n+    }\n+\n+    .brand-mark {\n+      width: 2.45rem;\n+      height: 2.45rem;\n+      border-radius: 14px;\n+      display: inline-flex;\n+      align-items: center;\n+      justify-content: center;\n+      background: linear-gradient(145deg, rgba(72, 228, 255, .22), rgba(125, 140, 255, .18));\n+      border: 1px solid rgba(120, 229, 255, .28);\n+      color: #fff;\n+      font-weight: 800;\n+      box-shadow: 0 0 0 1px rgba(255,255,255,0.03) inset, 0 0 28px rgba(72, 228, 255, 0.12);\n+      flex: 0 0 auto;\n+    }\n+\n+    .brand-text {\n+      display: flex;\n+      flex-direction: column;\n+      gap: .1rem;\n+      min-width: 0;\n+    }\n+\n+    .brand-text strong {\n+      font-size: 1rem;\n+      line-height: 1.1;\n+      letter-spacing: 0;\n+      white-space: nowrap;\n+    }\n+\n+    .brand-text span {\n+      font-size: .74rem;\n+      color: var(--muted);\n+      white-space: nowrap;\n+    }\n+\n+    .menu-icon {\n+      position: relative;\n+      width: 2.75rem;\n+      height: 2.75rem;\n+      border-radius: 14px;\n+      border: 1px solid rgba(120, 229, 255, .22);\n+      background: rgba(14, 27, 50, .68);\n+      box-shadow: inset 0 1px 0 rgba(255,255,255,.04);\n+    }\n+\n+    .menu-icon::after {\n+      background: #fff;\n+      box-shadow: 0 7px 0 #fff, 0 -7px 0 #fff;\n+      height: 2px;\n+      left: 50%;\n+      margin-left: -10px;\n+      width: 20px;\n+      top: 50%;\n+      margin-top: -1px;\n+    }\n+\n+    .top-bar-left,\n+    .top-bar-right {\n+      align-items: center;\n+    }\n+\n+    .nav-compact .menu {\n+      gap: .45rem;\n+      align-items: center;\n+      justify-content: flex-end;\n+    }\n+\n+    .menu.desktop-menu a {\n+      position: relative;\n+      padding: .7rem 1rem;\n+      color: var(--soft);\n+      border-radius: 999px;\n+    }\n+\n+    .menu.desktop-menu a:hover,\n+    .menu.desktop-menu a.is-active {\n+      color: #fff;\n+      background: rgba(72, 228, 255, 0.08);\n+    }\n+\n+    .menu.desktop-menu a.is-active::after {\n+      content: \"\";\n+      position: absolute;\n+      left: 18%;\n+      right: 18%;\n+      bottom: .2rem;\n+      height: 2px;\n+      border-radius: 999px;\n+      background: linear-gradient(90deg, transparent, var(--accent), transparent);\n+      box-shadow: 0 0 10px rgba(72, 228, 255, 0.45);\n+    }\n+\n+    .hero-zone,\n+    .section-band {\n+      position: relative;\n+      padding: 2rem 0;\n+    }\n+\n+    .hero-zone {\n+      padding-top: 2.3rem;\n+      padding-bottom: 1.2rem;\n+    }\n+\n+    .hero-shell,\n+    .panel-shell,\n+    .content-shell,\n+    .faq-shell,\n+    .cta-shell {\n+      background: linear-gradient(180deg, rgba(16, 30, 56, 0.78), rgba(10, 20, 38, 0.84));\n+      border: 1px solid var(--line);\n+      border-radius: var(--radius-lg);\n+      box-shadow: var(--shadow);\n+      backdrop-filter: blur(18px);\n+    }\n+\n+    .hero-shell {\n+      padding: 1.25rem;\n+      overflow: hidden;\n+    }\n+\n+    .kicker {\n+      display: inline-flex;\n+      align-items: center;\n+      gap: .45rem;\n+      padding: .38rem .78rem;\n+      border-radius: 999px;\n+      border: 1px solid rgba(120, 229, 255, 0.22);\n+      color: #dff9ff;\n+      background: rgba(11, 26, 46, 0.6);\n+      font-size: .8rem;\n+      letter-spacing: 0;\n+      margin-bottom: 1rem;\n+    }\n+\n+    .hero-title {\n+      margin: 0;\n+      font-weight: 800;\n+      font-size: clamp(2rem, 4vw, 3.5rem);\n+      line-height: 1.08;\n+      letter-spacing: 0;\n+      max-width: 12ch;\n+    }\n+\n+    .hero-copy {\n+      margin-top: 1rem;\n+      color: var(--soft);\n+      max-width: 44rem;\n+      font-size: 1rem;\n+    }\n+\n+    .hero-actions {\n+      display: flex;\n+      flex-wrap: wrap;\n+      gap: .8rem;\n+      margin-top: 1.25rem;\n+    }\n+\n+    .btn-glow,\n+    .btn-soft,\n+    .btn-mini {\n+      display: inline-flex;\n+      align-items: center;\n+      justify-content: center;\n+      gap: .5rem;\n+      border-radius: 999px;\n+      border: 1px solid transparent;\n+      padding: .82rem 1.08rem;\n+      font-weight: 700;\n+      letter-spacing: 0;\n+      line-height: 1;\n+      transform: translateY(0);\n+    }\n+\n+    .btn-glow {\n+      color: #031018;\n+      background: linear-gradient(135deg, #7df1ff, #56d6ff 45%, #93a3ff);\n+      box-shadow: 0 14px 32px rgba(72, 228, 255, 0.22), 0 0 0 1px rgba(126, 228, 255, 0.26) inset;\n+    }\n+\n+    .btn-glow:hover {\n+      color: #031018;\n+      transform: translateY(-1px);\n+      box-shadow: 0 18px 38px rgba(72, 228, 255, 0.28), 0 0 0 1px rgba(126, 228, 255, 0.34) inset;\n+    }\n+\n+    .btn-soft,\n+    .btn-mini {\n+      color: #dce9ff;\n+      background: rgba(12, 24, 43, 0.58);\n+      border-color: rgba(120, 229, 255, 0.22);\n+      box-shadow: inset 0 1px 0 rgba(255,255,255,0.04);\n+    }\n+\n+    .btn-soft:hover,\n+    .btn-mini:hover {\n+      color: #fff;\n+      transform: translateY(-1px);\n+      border-color: rgba(120, 229, 255, 0.42);\n+      box-shadow: 0 12px 26px rgba(4, 14, 28, 0.28);\n+    }\n+\n+    .hero-side {\n+      display: grid;\n+      gap: .85rem;\n+    }\n+\n+    .coupon-stack {\n+      display: grid;\n+      gap: .85rem;\n+    }\n+\n+    .ticket-card {\n+      position: relative;\n+      padding: 1rem;\n+      border-radius: var(--radius-md);\n+      background: linear-gradient(180deg, rgba(15, 30, 58, 0.85), rgba(11, 21, 39, 0.92));\n+      border: 1px solid rgba(127, 162, 255, 0.2);\n+      box-shadow: var(--shadow-soft);\n+      overflow: hidden;\n+    }\n+\n+    .ticket-card::before,\n+    .ticket-card::after {\n+      content: \"\";\n+      position: absolute;\n+      top: 50%;\n+      width: 16px;\n+      height: 16px;\n+      transform: translateY(-50%);\n+      border-radius: 50%;\n+      background: var(--bg-0);\n+      box-shadow: 0 0 0 1px rgba(120, 229, 255, 0.08) inset;\n+    }\n+\n+    .ticket-card::before { left: -8px; }\n+    .ticket-card::after { right: -8px; }\n+\n+    .ticket-main {\n+      min-height: 210px;\n+      display: flex;\n+      flex-direction: column;\n+      justify-content: space-between;\n+      border-color: rgba(72, 228, 255, 0.28);\n+      background:\n+        linear-gradient(180deg, rgba(21, 43, 79, 0.95), rgba(9, 18, 34, 0.95)),\n+        linear-gradient(145deg, rgba(72, 228, 255, 0.16), transparent 40%);\n+      box-shadow: 0 22px 48px rgba(4, 13, 27, 0.34), 0 0 0 1px rgba(72, 228, 255, 0.12) inset;\n+    }\n+\n+    .ticket-eyebrow,\n+    .meta-line,\n+    .mini-label,\n+    .chip,\n+    .tag {\n+      display: inline-flex;\n+      align-items: center;\n+      gap: .35rem;\n+      font-size: .76rem;\n+      color: #d8ecff;\n+      white-space: nowrap;\n+    }\n+\n+    .ticket-eyebrow {\n+      color: #baf7ff;\n+    }\n+\n+    .ticket-title {\n+      margin: .65rem 0 .45rem;\n+      font-size: 1.32rem;\n+      line-height: 1.18;\n+      font-weight: 800;\n+      letter-spacing: 0;\n+    }\n+\n+    .ticket-copy {\n+      color: var(--soft);\n+      font-size: .92rem;\n+      margin: 0;\n+      max-width: 28rem;\n+    }\n+\n+    .ticket-footer,\n+    .metric-row,\n+    .card-actions,\n+    .price-footer,\n+    .list-meta,\n+    .scenario-foot {\n+      display: flex;\n+      align-items: center;\n+      justify-content: space-between;\n+      gap: .75rem;\n+      flex-wrap: wrap;\n+    }\n+\n+    .metric-row {\n+      margin-top: 1rem;\n+    }\n+\n+    .metric {\n+      display: grid;\n+      gap: .1rem;\n+      min-width: 92px;\n+    }\n+\n+    .metric strong {\n+      font-size: 1.12rem;\n+      line-height: 1;\n+    }\n+\n+    .metric span {\n+      font-size: .76rem;\n+      color: var(--muted);\n+    }\n+\n+    .ticket-mini {\n+      display: grid;\n+      grid-template-columns: 1.1fr auto;\n+      gap: .75rem;\n+      align-items: center;\n+    }\n+\n+    .ticket-mini h3,\n+    .ticket-mini p,\n+    .section-title,\n+    .section-copy,\n+    .card-title,\n+    .card-copy,\n+    .faq-copy,\n+    .footer-copy,\n+    .footer-note {\n+      margin: 0;\n+    }\n+\n+    .ticket-mini h3 {\n+      font-size: 1rem;\n+      line-height: 1.28;\n+      margin-bottom: .3rem;\n+    }\n+\n+    .ticket-mini p {\n+      color: var(--muted);\n+      font-size: .86rem;\n+    }\n+\n+    .ticket-mark {\n+      width: 3.4rem;\n+      height: 3.4rem;\n+      border-radius: 14px;\n+      display: grid;\n+      place-items: center;\n+      background: linear-gradient(145deg, rgba(72, 228, 255, 0.18), rgba(125, 140, 255, 0.16));\n+      border: 1px solid rgba(120, 229, 255, 0.2);\n+      color: #fff;\n+      box-shadow: 0 0 0 1px rgba(255,255,255,0.03) inset;\n+      flex: 0 0 auto;\n+    }\n+\n+    .search-shell {\n+      margin-top: 1rem;\n+      padding: 1rem;\n+      border-radius: var(--radius-md);\n+      border: 1px solid var(--line);\n+      background: rgba(10, 20, 38, 0.72);\n+      box-shadow: var(--shadow-soft);\n+    }\n+\n+    .search-row {\n+      display: grid;\n+      grid-template-columns: 1.8fr 1fr 1fr auto;\n+      gap: .75rem;\n+      align-items: end;\n+    }\n+\n+    .field label {\n+      display: block;\n+      margin-bottom: .4rem;\n+      font-size: .82rem;\n+      color: var(--muted);\n+    }\n+\n+    .field input,\n+    .field select {\n+      width: 100%;\n+      height: 3rem;\n+      padding: 0 .95rem;\n+      border-radius: 14px;\n+      background: rgba(8, 17, 31, 0.9);\n+      color: var(--text);\n+      border: 1px solid rgba(120, 229, 255, 0.16);\n+      box-shadow: inset 0 1px 0 rgba(255,255,255,0.03);\n+      margin: 0;\n+    }\n+\n+    .field input::placeholder {\n+      color: rgba(157, 178, 209, 0.78);\n+    }\n+\n+    .field input:focus,\n+    .field select:focus {\n+      border-color: rgba(72, 228, 255, 0.5);\n+      box-shadow: 0 0 0 3px rgba(72, 228, 255, 0.12);\n+      background: rgba(7, 16, 31, 0.96);\n+    }\n+\n+    .chips {\n+      display: flex;\n+      flex-wrap: wrap;\n+      gap: .55rem;\n+      margin-top: .9rem;\n+    }\n+\n+    .chip,\n+    .tag {\n+      padding: .45rem .72rem;\n+      border-radius: 999px;\n+      border: 1px solid rgba(120, 229, 255, 0.16);\n+      background: rgba(12, 24, 43, 0.58);\n+      color: #dfeaff;\n+    }\n+\n+    .chip.is-active,\n+    .tag.is-active {\n+      border-color: rgba(72, 228, 255, 0.34);\n+      background: rgba(72, 228, 255, 0.1);\n+      box-shadow: 0 0 0 1px rgba(72, 228, 255, 0.14) inset;\n+    }\n+\n+    .section-title {\n+      font-size: 1.55rem;\n+      line-height: 1.18;\n+      font-weight: 800;\n+      letter-spacing: 0;\n+    }\n+\n+    .section-copy {\n+      color: var(--muted);\n+      margin-top: .5rem;\n+      max-width: 56rem;\n+    }\n+\n+    .section-head {\n+      display: flex;\n+      align-items: end;\n+      justify-content: space-between;\n+      gap: 1rem;\n+      margin-bottom: 1rem;\n+      flex-wrap: wrap;\n+    }\n+\n+    .panel-shell,\n+    .content-shell,\n+    .faq-shell,\n+    .cta-shell {\n+      padding: 1.15rem;\n+    }\n+\n+    .glass-card {\n+      position: relative;\n+      overflow: hidden;\n+      padding: 1rem;\n+      border-radius: var(--radius-md);\n+      background: linear-gradient(180deg, rgba(18, 32, 58, 0.8), rgba(9, 18, 34, 0.88));\n+      border: 1px solid rgba(120, 229, 255, 0.16);\n+      box-shadow: var(--shadow-soft);\n+      transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;\n+    }\n+\n+    .glass-card:hover {\n+      transform: translateY(-3px);\n+      border-color: rgba(72, 228, 255, 0.34);\n+      box-shadow: 0 16px 32px rgba(2, 8, 24, 0.32), 0 0 0 1px rgba(72, 228, 255, 0.08) inset;\n+    }\n+\n+    .feature-grid {\n+      display: grid;\n+      grid-template-columns: repeat(4, minmax(0, 1fr));\n+      gap: .9rem;\n+    }\n+\n+    .icon-badge {\n+      width: 2.6rem;\n+      height: 2.6rem;\n+      display: grid;\n+      place-items: center;\n+      border-radius: 14px;\n+      color: #fff;\n+      background: linear-gradient(145deg, rgba(72, 228, 255, 0.18), rgba(125, 140, 255, 0.16));\n+      border: 1px solid rgba(120, 229, 255, 0.18);\n+      margin-bottom: .85rem;\n+    }\n+\n+    .card-title {\n+      font-size: 1rem;\n+      line-height: 1.25;\n+      font-weight: 800;\n+      margin-bottom: .35rem;\n+    }\n+\n+    .card-copy {\n+      color: var(--muted);\n+      font-size: .88rem;\n+    }\n+\n+    .mini-line {\n+      margin-top: .9rem;\n+      height: 4px;\n+      border-radius: 999px;\n+      background: rgba(255,255,255,0.05);\n+      overflow: hidden;\n+    }\n+\n+    .mini-line span {\n+      display: block;\n+      height: 100%;\n+      border-radius: inherit;\n+      background: linear-gradient(90deg, var(--accent), var(--accent-2));\n+      box-shadow: 0 0 16px rgba(72, 228, 255, 0.26);\n+    }\n+\n+    .scenario-grid {\n+      display: grid;\n+      grid-template-columns: repeat(3, minmax(0, 1fr));\n+      gap: .9rem;\n+    }\n+\n+    .scenario-card {\n+      min-height: 220px;\n+      display: flex;\n+      flex-direction: column;\n+      justify-content: space-between;\n+    }\n+\n+    .scenario-top {\n+      display: flex;\n+      align-items: center;\n+      justify-content: space-between;\n+      gap: .75rem;\n+      margin-bottom: .9rem;\n+    }\n+\n+    .scenario-step {\n+      width: 2.4rem;\n+      height: 2.4rem;\n+      border-radius: 50%;\n+      display: grid;\n+      place-items: center;\n+      background: rgba(72, 228, 255, 0.1);\n+      border: 1px solid rgba(72, 228, 255, 0.18);\n+      color: #dff9ff;\n+      font-weight: 800;\n+    }\n+\n+    .scenario-bar {\n+      margin-top: 1rem;\n+      height: 10px;\n+      border-radius: 999px;\n+      background: rgba(255,255,255,0.05);\n+      overflow: hidden;\n+    }\n+\n+    .scenario-bar span {\n+      display: block;\n+      height: 100%;\n+      border-radius: inherit;\n+      background: linear-gradient(90deg, rgba(77, 240, 183, 0.95), rgba(72, 228, 255, 0.95));\n+    }\n+\n+    .catalog-layout {\n+      display: grid;\n+      grid-template-columns: 1.1fr .45fr;\n+      gap: .95rem;\n+    }\n+\n+    .entry-grid {\n+      display: grid;\n+      grid-template-columns: repeat(2, minmax(0, 1fr));\n+      gap: .9rem;\n+    }\n+\n+    .entry-card {\n+      padding: 0;\n+      overflow: hidden;\n+    }\n+\n+    .entry-cover {\n+      min-height: 110px;\n+      padding: .9rem;\n+      background:\n+        linear-gradient(145deg, rgba(72, 228, 255, 0.16), rgba(125, 140, 255, 0.16)),\n+        linear-gradient(180deg, rgba(8, 17, 31, 0.2), rgba(8, 17, 31, 0.5));\n+      border-bottom: 1px solid rgba(120, 229, 255, 0.12);\n+      display: flex;\n+      flex-direction: column;\n+      justify-content: space-between;\n+      position: relative;\n+    }\n+\n+    .entry-cover::after {\n+      content: \"\";\n+      position: absolute;\n+      inset: 0;\n+      background: linear-gradient(90deg, transparent 0, rgba(255,255,255,0.05) 48%, transparent 100%);\n+      transform: skewX(-14deg) translateX(-60%);\n+      opacity: .55;\n+    }\n+\n+    .entry-cover > * {\n+      position: relative;\n+      z-index: 1;\n+    }\n+\n+    .entry-body {\n+      padding: .95rem;\n+    }\n+\n+    .entry-head {\n+      display: flex;\n+      align-items: start;\n+      justify-content: space-between;\n+      gap: .75rem;\n+    }\n+\n+    .entry-title {\n+      margin: 0;\n+      font-size: 1.03rem;\n+      line-height: 1.32;\n+      font-weight: 800;\n+    }\n+\n+    .entry-copy {\n+      color: var(--muted);\n+      font-size: .88rem;\n+      margin-top: .55rem;\n+    }\n+\n+    .entry-stats {\n+      display: flex;\n+      flex-wrap: wrap;\n+      gap: .5rem;\n+      margin-top: .8rem;\n+    }\n+\n+    .mini-tag {\n+      padding: .34rem .58rem;\n+      border-radius: 999px;\n+      font-size: .75rem;\n+      color: #dff3ff;\n+      background: rgba(12, 24, 43, 0.7);\n+      border: 1px solid rgba(120, 229, 255, 0.14);\n+    }\n+\n+    .stat-pill {\n+      padding: .32rem .55rem;\n+      border-radius: 999px;\n+      font-size: .75rem;\n+      color: #aaf6ff;\n+      background: rgba(72, 228, 255, 0.08);\n+      border: 1px solid rgba(72, 228, 255, 0.18);\n+    }\n+\n+    .catalog-aside {\n+      display: grid;\n+      gap: .9rem;\n+    }\n+\n+    .aside-card {\n+      padding: 1rem;\n+    }\n+\n+    .aside-title {\n+      margin: 0 0 .75rem;\n+      font-size: 1rem;\n+      font-weight: 800;\n+    }\n+\n+    .check-list {\n+      list-style: none;\n+      margin: 0;\n+      padding: 0;\n+      display: grid;\n+      gap: .65rem;\n+    }\n+\n+    .check-list li {\n+      display: flex;\n+      gap: .6rem;\n+      align-items: flex-start;\n+      color: var(--soft);\n+      font-size: .9rem;\n+    }\n+\n+    .check-list i {\n+      color: var(--accent);\n+      margin-top: .15rem;\n+      flex: 0 0 auto;\n+    }\n+\n+    .side-meter {\n+      margin-top: .9rem;\n+      display: grid;\n+      gap: .6rem;\n+    }\n+\n+    .meter-row {\n+      display: grid;\n+      gap: .3rem;\n+    }\n+\n+    .meter-row .meter-label {\n+      display: flex;\n+      align-items: center;\n+      justify-content: space-between;\n+      font-size: .76rem;\n+      color: var(--muted);\n+    }\n+\n+    .meter-bar {\n+      height: 8px;\n+      border-radius: 999px;\n+      background: rgba(255,255,255,0.05);\n+      overflow: hidden;\n+    }\n+\n+    .meter-bar span {\n+      display: block;\n+      height: 100%;\n+      border-radius: inherit;\n+      background: linear-gradient(90deg, var(--accent), var(--accent-2));\n+    }\n+\n+    .pagination-shell {\n+      display: flex;\n+      justify-content: space-between;\n+      align-items: center;\n+      gap: 1rem;\n+      flex-wrap: wrap;\n+      margin-top: 1rem;\n+      padding-top: 1rem;\n+      border-top: 1px solid rgba(120, 229, 255, 0.14);\n+    }\n+\n+    .pagination-list {\n+      display: flex;\n+      flex-wrap: wrap;\n+      gap: .45rem;\n+      list-style: none;\n+      margin: 0;\n+      padding: 0;\n+    }\n+\n+    .pagination-list a {\n+      min-width: 2.3rem;\n+      height: 2.3rem;\n+      display: inline-flex;\n+      align-items: center;\n+      justify-content: center;\n+      border-radius: 999px;\n+      border: 1px solid rgba(120, 229, 255, 0.16);\n+      background: rgba(12, 24, 43, 0.6);\n+      color: var(--soft);\n+      padding: 0 .75rem;\n+    }\n+\n+    .pagination-list a.is-active,\n+    .pagination-list a:hover {\n+      color: #fff;\n+      border-color: rgba(72, 228, 255, 0.35);\n+      background: rgba(72, 228, 255, 0.12);\n+      box-shadow: 0 0 0 1px rgba(72, 228, 255, 0.12) inset;\n+    }\n+\n+    .price-grid {\n+      display: grid;\n+      grid-template-columns: repeat(3, minmax(0, 1fr));\n+      gap: .9rem;\n+    }\n+\n+    .price-card {\n+      display: flex;\n+      flex-direction: column;\n+      gap: .9rem;\n+      min-height: 100%;\n+    }\n+\n+    .price-card.is-featured {\n+      border-color: rgba(72, 228, 255, 0.34);\n+      transform: translateY(-4px);\n+      box-shadow: 0 20px 40px rgba(2, 8, 24, 0.36), 0 0 0 1px rgba(72, 228, 255, 0.12) inset;\n+      background: linear-gradient(180deg, rgba(17, 34, 61, 0.9), rgba(8, 16, 30, 0.94));\n+    }\n+\n+    .price-head {\n+      display: flex;\n+      align-items: center;\n+      justify-content: space-between;\n+      gap: 1rem;\n+    }\n+\n+    .price-name {\n+      margin: 0;\n+      font-size: 1.02rem;\n+      font-weight: 800;\n+    }\n+\n+    .price-value {\n+      font-size: 2rem;\n+      font-weight: 800;\n+      line-height: 1;\n+      letter-spacing: 0;\n+    }\n+\n+    .price-value small {\n+      font-size: .86rem;\n+      color: var(--muted);\n+      font-weight: 500;\n+      margin-left: .25rem;\n+    }\n+\n+    .price-note {\n+      color: var(--muted);\n+      font-size: .88rem;\n+    }\n+\n+    .price-list {\n+      list-style: none;\n+      margin: 0;\n+      padding: 0;\n+      display: grid;\n+      gap: .6rem;\n+    }\n+\n+    .price-list li {\n+      display: flex;\n+      gap: .55rem;\n+      align-items: flex-start;\n+      color: var(--soft);\n+      font-size: .88rem;\n+    }\n+\n+    .price-list i {\n+      color: var(--accent-3);\n+      margin-top: .14rem;\n+      flex: 0 0 auto;\n+    }\n+\n+    .faq-shell .accordion {\n+      background: transparent;\n+      margin-bottom: 0;\n+    }\n+\n+    .faq-shell .accordion-item {\n+      border: 1px solid rgba(120, 229, 255, 0.14);\n+      border-radius: 16px;\n+      overflow: hidden;\n+      margin-bottom: .8rem;\n+      background: rgba(10, 20, 38, 0.66);\n+      box-shadow: var(--shadow-soft);\n+    }\n+\n+    .faq-shell .accordion-title {\n+      background: transparent;\n+      color: var(--text);\n+      font-weight: 700;\n+      font-size: .98rem;\n+      padding: 1rem 1rem 1rem 3rem;\n+      border: 0;\n+    }\n+\n+    .faq-shell .accordion-title:hover,\n+    .faq-shell .accordion-title:focus {\n+      background: rgba(72, 228, 255, 0.05);\n+      color: #fff;\n+    }\n+\n+    .faq-shell .accordion-content {\n+      color: var(--soft);\n+      border: 0;\n+      background: rgba(10, 20, 38, 0.42);\n+      padding: 0 1rem 1rem 1rem;\n+    }\n+\n+    .cta-shell {\n+      display: grid;\n+      grid-template-columns: 1.4fr auto;\n+      gap: 1rem;\n+      align-items: center;\n+    }\n+\n+    .cta-title {\n+      margin: 0;\n+      font-size: 1.4rem;\n+      font-weight: 800;\n+      line-height: 1.2;\n+    }\n+\n+    .cta-copy {\n+      margin: .55rem 0 0;\n+      color: var(--muted);\n+    }\n+\n+    .cta-actions {\n+      display: flex;\n+      gap: .75rem;\n+      flex-wrap: wrap;\n+      justify-content: flex-end;\n+    }\n+\n+    footer {\n+      margin-top: 2rem;\n+      padding: 0 0 2rem;\n+      color: var(--soft);\n+    }\n+\n+    .footer-grid {\n+      display: grid;\n+      grid-template-columns: 1.25fr .8fr .8fr 1fr;\n+      gap: 1rem;\n+      padding: 1.15rem 0 1rem;\n+      border-top: 1px solid rgba(120, 229, 255, 0.14);\n+    }\n+\n+    .footer-brand {\n+      display: inline-flex;\n+      align-items: center;\n+      gap: .75rem;\n+      margin-bottom: .8rem;\n+    }\n+\n+    .footer-title {\n+      margin: 0 0 .8rem;\n+      font-size: .98rem;\n+      font-weight: 800;\n+      color: #fff;\n+    }\n+\n+    .footer-links {\n+      list-style: none;\n+      margin: 0;\n+      padding: 0;\n+      display: grid;\n+      gap: .55rem;\n+    }\n+\n+    .footer-links a {\n+      color: var(--soft);\n+    }\n+\n+    .footer-links a:hover {\n+      color: #fff;\n+    }\n+\n+    .footer-copy,\n+    .footer-note {\n+      color: var(--muted);\n+      font-size: .9rem;\n+    }\n+\n+    .footer-bottom {\n+      padding-top: 1rem;\n+      border-top: 1px solid rgba(120, 229, 255, 0.12);\n+      display: flex;\n+      justify-content: space-between;\n+      gap: 1rem;\n+      flex-wrap: wrap;\n+      font-size: .84rem;\n+      color: var(--muted);\n+    }\n+\n+    .section-anchor {\n+      scroll-margin-top: 110px;\n+    }\n+\n+    @media screen and (max-width: 1023px) {\n+      .feature-grid,\n+      .scenario-grid,\n+      .price-grid,\n+      .footer-grid {\n+        grid-template-columns: repeat(2, minmax(0, 1fr));\n+      }\n+\n+      .catalog-layout,\n+      .cta-shell {\n+        grid-template-columns: 1fr;\n+      }\n+\n+      .cta-actions {\n+        justify-content: flex-start;\n+      }\n+\n+      .search-row {\n+        grid-template-columns: 1fr 1fr;\n+      }\n+\n+      .entry-grid {\n+        grid-template-columns: 1fr;\n+      }\n+    }\n+\n+    @media screen and (max-width: 639px) {\n+      .strip-inner {\n+        gap: .55rem;\n+        align-items: flex-start;\n+        flex-direction: column;\n+        padding: .5rem 0;\n+      }\n+\n+      .hero-zone,\n+      .section-band {\n+        padding: 1.25rem 0;\n+      }\n+\n+      .hero-shell,\n+      .panel-shell,\n+      .content-shell,\n+      .faq-shell,\n+      .cta-shell {\n+        padding: .95rem;\n+      }\n+\n+      .hero-title {\n+        max-width: none;\n+      }\n+\n+      .hero-copy {\n+        font-size: .95rem;\n+      }\n+\n+      .search-row,\n+      .feature-grid,\n+      .scenario-grid,\n+      .price-grid,\n+      .footer-grid,\n+      .entry-grid {\n+        grid-template-columns: 1fr;\n+      }\n+\n+      .ticket-main {\n+        min-height: 0;\n+      }\n+\n+      .ticket-mini {\n+        grid-template-columns: 1fr;\n+      }\n+\n+      .ticket-mark {\n+        width: 2.9rem;\n+        height: 2.9rem;\n+      }\n+\n+      .section-head,\n+      .ticket-footer,\n+      .pagination-shell,\n+      .footer-bottom {\n+        align-items: flex-start;\n+        flex-direction: column;\n+      }\n+\n+      .cta-actions {\n+        width: 100%;\n+      }\n+\n+      .cta-actions a,\n+      .hero-actions a,\n+      .pagination-list a {\n+        width: 100%;\n+      }\n+\n+      .btn-glow,\n+      .btn-soft,\n+      .btn-mini {\n+        width: 100%;\n+      }\n+    }\n+
