/* roulang page: index */
:root {
      --brand-primary: #2e6fce;
      --brand-primary-hover: #1f58ac;
      --brand-primary-soft: #eaf2ff;
      --brand-secondary: #58a7a1;
      --surface-main: #f7f9fc;
      --surface-card: #ffffff;
      --surface-muted: #eef3f8;
      --text-strong: #14243a;
      --text-body: #40536b;
      --text-muted: #7890a8;
      --border-soft: #dce6f0;
      --warm-accent: #e9a66c;
      --shadow-card: 0 14px 36px rgba(35, 75, 118, .08);
      --shadow-hover: 0 18px 42px rgba(35, 75, 118, .15);
      --radius-card: 18px;
      --radius-button: 10px;
      --content-max-width: 1210px;
    }

    *, *::before, *::after { box-sizing: border-box; }
    html { scroll-behavior: smooth; }
    body {
      margin: 0;
      color: var(--text-body);
      background: var(--surface-main);
      font-family: "PingFang SC", "Microsoft YaHei", "Noto Sans SC", sans-serif;
      font-size: 16px;
      line-height: 1.8;
      overflow-x: hidden;
    }
    a { color: inherit; text-decoration: none; }
    a:hover { color: var(--brand-primary); }
    img { max-width: 100%; display: block; }
    button, input, select { font: inherit; }
    button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible {
      outline: 3px solid rgba(46,111,206,.28);
      outline-offset: 3px;
    }
    .container { max-width: var(--content-max-width); }
    .site-header {
      background: rgba(255,255,255,.96);
      border-bottom: 1px solid var(--border-soft);
      position: relative;
      z-index: 10;
    }
    .brand-row {
      min-height: 78px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 22px;
    }
    .brand {
      display: inline-flex;
      align-items: center;
      gap: 12px;
      color: var(--text-strong);
      font-weight: 800;
      font-size: 20px;
      letter-spacing: 0;
      white-space: nowrap;
    }
    .brand-mark {
      width: 40px;
      height: 40px;
      border-radius: 12px;
      background: var(--brand-primary);
      color: #fff;
      display: grid;
      place-items: center;
      font-weight: 800;
      box-shadow: 0 8px 18px rgba(46,111,206,.2);
    }
    .header-tools { display: flex; align-items: center; gap: 12px; }
    .header-search {
      width: 210px;
      height: 42px;
      border: 1px solid var(--border-soft);
      border-radius: var(--radius-button);
      background: var(--surface-main);
      color: var(--text-body);
      padding: 0 14px;
    }
    .header-search::placeholder { color: var(--text-muted); }
    .btn-main, .btn-light, .btn-text {
      min-height: 44px;
      border-radius: var(--radius-button);
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      padding: 10px 18px;
      font-weight: 700;
      transition: .22s ease;
      border: 1px solid transparent;
    }
    .btn-main { color: #fff; background: var(--brand-primary); }
    .btn-main:hover { color: #fff; background: var(--brand-primary-hover); transform: translateY(-2px); box-shadow: 0 9px 20px rgba(46,111,206,.2); }
    .btn-main:active, .btn-light:active { transform: translateY(0); }
    .btn-light { color: var(--brand-primary); background: #fff; border-color: #b9cfe9; }
    .btn-light:hover { color: var(--brand-primary-hover); background: var(--brand-primary-soft); border-color: var(--brand-primary); }
    .btn-text { color: var(--brand-primary); padding-left: 0; padding-right: 0; }
    .btn-text:hover { text-decoration: underline; }
    .menu-toggle { display: none; border: 1px solid var(--border-soft); background: #fff; color: var(--text-strong); border-radius: 9px; padding: 8px 11px; }

    .icon-nav {
      border-top: 1px solid #eef3f7;
      padding: 12px 0 14px;
    }
    .nav-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 10px;
    }
    .nav-item {
      display: flex;
      align-items: center;
      gap: 10px;
      min-height: 48px;
      padding: 8px 14px;
      border: 1px solid transparent;
      border-radius: 11px;
      color: var(--text-body);
      transition: .2s ease;
    }
    .nav-item:hover { background: var(--brand-primary-soft); color: var(--brand-primary); border-color: #cfe0f8; }
    .nav-item.active { background: var(--brand-primary); color: #fff; box-shadow: 0 6px 14px rgba(46,111,206,.17); }
    .nav-icon {
      width: 27px;
      height: 27px;
      border-radius: 8px;
      display: grid;
      place-items: center;
      background: var(--surface-muted);
      color: var(--brand-primary);
      font-size: 13px;
      font-weight: 800;
    }
    .nav-item.active .nav-icon { background: rgba(255,255,255,.18); color: #fff; }
    .nav-label { font-size: 14px; font-weight: 700; }

    .hero {
      position: relative;
      min-height: 610px;
      display: flex;
      align-items: center;
      background:
        linear-gradient(rgba(46,111,206,.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(46,111,206,.045) 1px, transparent 1px),
        #f5f9ff;
      background-size: 34px 34px;
      border-bottom: 1px solid var(--border-soft);
      overflow: hidden;
    }
    .hero::after {
      content: "";
      position: absolute;
      right: -80px;
      top: 30px;
      width: 360px;
      height: 360px;
      border: 1px solid rgba(46,111,206,.12);
      border-radius: 50%;
    }
    .hero-content { position: relative; z-index: 1; padding: 76px 0 84px; }
    .eyebrow, .section-kicker {
      display: inline-flex;
      align-items: center;
      gap: 7px;
      color: var(--brand-primary);
      font-size: 13px;
      font-weight: 800;
      letter-spacing: .04em;
      text-transform: uppercase;
    }
    h1, h2, h3 { color: var(--text-strong); line-height: 1.25; margin: 0; font-weight: 800; }
    h1 { font-size: clamp(38px, 5vw, 64px); max-width: 700px; margin: 17px 0 22px; }
    h2 { font-size: clamp(28px, 3.5vw, 40px); }
    h3 { font-size: 20px; }
    .hero-copy { max-width: 650px; font-size: 18px; color: var(--text-body); }
    .hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
    .hero-note { margin-top: 23px; color: var(--text-muted); font-size: 13px; }
    .hero-index {
      background: #fff;
      border: 1px solid #cfe0f4;
      border-radius: 22px;
      box-shadow: var(--shadow-card);
      padding: 22px;
      position: relative;
      z-index: 1;
    }
    .index-top { display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid var(--border-soft); padding-bottom: 16px; }
    .index-title { color: var(--text-strong); font-weight: 800; }
    .status-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--brand-secondary); display: inline-block; margin-right: 6px; }
    .index-list { list-style: none; padding: 0; margin: 5px 0 0; }
    .index-list li { display: flex; align-items: center; gap: 12px; padding: 15px 0; border-bottom: 1px solid #edf2f6; }
    .index-list li:last-child { border-bottom: 0; }
    .index-number { color: var(--brand-primary); font-weight: 800; font-size: 13px; min-width: 29px; }
    .index-list strong { display: block; color: var(--text-strong); font-size: 15px; }
    .index-list small { color: var(--text-muted); font-size: 12px; }
    .count-chip { margin-left: auto; background: var(--brand-primary-soft); color: var(--brand-primary); border-radius: 7px; padding: 3px 8px; font-size: 12px; white-space: nowrap; }

    .section { padding: 96px 0; }
    .section-muted { background: #eef4fa; border-top: 1px solid var(--border-soft); border-bottom: 1px solid var(--border-soft); }
    .section-head { max-width: 690px; margin-bottom: 40px; }
    .section-head h2 { margin: 11px 0 14px; }
    .section-head p { margin: 0; color: var(--text-muted); }
    .feature-rail { display: grid; grid-template-columns: 1.18fr .82fr 1fr; gap: 20px; align-items: stretch; }
    .feature-card {
      background: var(--surface-card);
      border: 1px solid var(--border-soft);
      border-radius: var(--radius-card);
      box-shadow: var(--shadow-card);
      padding: 26px;
      transition: .22s ease;
      display: flex;
      flex-direction: column;
      min-height: 255px;
    }
    .feature-card:nth-child(2) { margin-top: 30px; }
    .feature-card:nth-child(3) { margin-top: 12px; }
    .feature-card:hover, .result-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-hover); border-color: #b4cdec; }
    .feature-symbol { color: var(--brand-primary); font-size: 25px; margin-bottom: 24px; }
    .feature-card p { color: var(--text-muted); font-size: 14px; margin: 12px 0 20px; }
    .feature-card .btn-text { margin-top: auto; }

    .scene-wrap { display: grid; grid-template-columns: .76fr 1.24fr; gap: 54px; align-items: center; }
    .scene-copy p { color: var(--text-muted); margin: 18px 0 25px; }
    .scene-tabs { display: flex; flex-wrap: wrap; gap: 8px; }
    .scene-tab { border: 1px solid var(--border-soft); background: #fff; color: var(--text-body); padding: 8px 13px; border-radius: 8px; font-size: 13px; }
    .scene-tab.selected { color: #fff; background: var(--brand-primary); border-color: var(--brand-primary); }
    .pathway { border-left: 2px solid #c9dbef; padding-left: 25px; }
    .path-step { position: relative; padding: 2px 0 26px; }
    .path-step:last-child { padding-bottom: 0; }
    .path-step::before { content: ""; position: absolute; left: -32px; top: 8px; width: 12px; height: 12px; border: 3px solid var(--brand-primary); background: #fff; border-radius: 50%; }
    .path-step strong { color: var(--text-strong); display: block; margin-bottom: 5px; }
    .path-step span { color: var(--text-muted); font-size: 14px; }

    .result-layout { display: grid; grid-template-columns: .9fr 1.1fr; gap: 22px; }
    .result-card { background: #fff; border: 1px solid var(--border-soft); border-radius: var(--radius-card); padding: 25px; box-shadow: var(--shadow-card); transition: .22s ease; }
    .result-card.large { grid-row: span 2; background: var(--brand-primary); color: #fff; border-color: var(--brand-primary); }
    .result-card.large h3, .result-card.large p { color: #fff; }
    .result-card h3 { margin: 14px 0 10px; }
    .result-card p { color: var(--text-muted); font-size: 14px; margin-bottom: 20px; }
    .result-label { font-size: 12px; font-weight: 800; color: var(--brand-primary); }
    .large .result-label { color: #bdd7ff; }
    .metric-row { display: flex; gap: 28px; margin: 30px 0; }
    .metric strong { display: block; font-size: 31px; line-height: 1; }
    .metric small { color: var(--text-muted); font-size: 12px; }
    .large .metric small { color: #d5e5fa; }
    .tag-list { display: flex; flex-wrap: wrap; gap: 8px; }
    .tag { background: var(--brand-primary-soft); color: var(--brand-primary); border-radius: 7px; padding: 4px 9px; font-size: 12px; }
    .large .tag { color: #e7f0ff; background: rgba(255,255,255,.15); }

    .tiers { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; align-items: start; }
    .tier { background: #fff; border: 1px solid var(--border-soft); border-radius: 16px; padding: 25px; box-shadow: var(--shadow-card); }
    .tier.highlight { border: 2px solid var(--brand-primary); position: relative; margin-top: -12px; }
    .tier-badge { color: var(--brand-primary); background: var(--brand-primary-soft); border-radius: 6px; display: inline-block; padding: 4px 8px; font-size: 12px; font-weight: 800; }
    .tier h3 { margin: 18px 0 7px; }
    .tier p { min-height: 55px; color: var(--text-muted); font-size: 14px; }
    .tier ul { list-style: none; padding: 0; margin: 20px 0; }
    .tier li { padding: 8px 0; border-top: 1px solid #edf2f6; color: var(--text-body); font-size: 14px; }
    .tier li::before { content: "✓"; color: var(--brand-secondary); font-weight: 800; margin-right: 8px; }

    .info-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
    .info-panel { border: 1px solid var(--border-soft); background: #fff; border-radius: 16px; padding: 25px; box-shadow: var(--shadow-card); }
    .info-panel h3 { margin-bottom: 10px; }
    .info-panel p { color: var(--text-muted); font-size: 14px; margin: 0; }
    .info-list { list-style: none; padding: 0; margin: 14px 0 0; }
    .info-list li { display: flex; justify-content: space-between; gap: 15px; border-top: 1px solid #edf2f6; padding: 11px 0; font-size: 14px; }
    .info-list a { color: var(--brand-primary); font-weight: 700; }

    .faq .accordion-item { border: 1px solid var(--border-soft); border-radius: 12px !important; overflow: hidden; margin-bottom: 12px; background: #fff; }
    .faq .accordion-button { color: var(--text-strong); background: #fff; font-weight: 700; box-shadow: none; padding: 19px 22px; }
    .faq .accordion-button:not(.collapsed) { color: var(--brand-primary); background: var(--brand-primary-soft); }
    .faq .accordion-body { color: var(--text-body); font-size: 14px; padding: 0 22px 20px; background: var(--brand-primary-soft); }

    .cta-band { background: var(--text-strong); color: #fff; padding: 66px 0; }
    .cta-band h2 { color: #fff; margin-bottom: 13px; }
    .cta-band p { color: #c5d2e2; max-width: 680px; margin: 0; }
    .cta-actions { display: flex; align-items: center; gap: 18px; justify-content: flex-end; }
    .cta-band .btn-light { border: 0; background: #fff; }
    .site-footer { background: #f0f5fa; border-top: 1px solid var(--border-soft); padding: 48px 0 25px; }
    .footer-grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr; gap: 42px; }
    .footer-brand p { color: var(--text-muted); font-size: 14px; max-width: 330px; margin: 14px 0 0; }
    .footer-title { color: var(--text-strong); font-weight: 800; margin-bottom: 13px; }
    .footer-links { list-style: none; padding: 0; margin: 0; }
    .footer-links li { margin: 7px 0; color: var(--text-muted); font-size: 14px; }
    .footer-bottom { border-top: 1px solid var(--border-soft); margin-top: 38px; padding-top: 18px; display: flex; justify-content: space-between; gap: 20px; color: var(--text-muted); font-size: 12px; }
    .top-button { position: fixed; right: 22px; bottom: 22px; width: 43px; height: 43px; border: 1px solid var(--border-soft); background: #fff; color: var(--brand-primary); border-radius: 10px; box-shadow: var(--shadow-card); cursor: pointer; opacity: 0; pointer-events: none; transition: .2s; }
    .top-button.visible { opacity: 1; pointer-events: auto; }
    .top-button:hover { background: var(--brand-primary); color: #fff; }

    @media (min-width: 768px) {
      .nav-grid { grid-template-columns: repeat(2, 1fr); }
    }
    @media (min-width: 992px) {
      .nav-grid { grid-template-columns: repeat(2, 1fr); }
    }
    @media (min-width: 1200px) {
      .nav-grid { grid-template-columns: repeat(2, 1fr); }
    }
    @media (max-width: 991px) {
      .header-search { width: 160px; }
      .hero { min-height: auto; }
      .hero-content { padding: 65px 0 72px; }
      .feature-rail, .result-layout { grid-template-columns: 1fr 1fr; }
      .feature-card:first-child { grid-column: span 2; }
      .feature-card:nth-child(2), .feature-card:nth-child(3) { margin-top: 0; }
      .scene-wrap { gap: 30px; }
    }
    @media (max-width: 767px) {
      .brand-row { min-height: 67px; }
      .brand { font-size: 16px; }
      .brand-mark { width: 34px; height: 34px; border-radius: 9px; }
      .header-tools .header-search, .header-tools .btn-main { display: none; }
      .menu-toggle { display: inline-block; }
      .icon-nav { display: none; padding: 8px 0 12px; }
      .icon-nav.open { display: block; }
      .nav-grid { grid-template-columns: 1fr 1fr; }
      .nav-item { min-height: 45px; padding: 7px 9px; }
      .hero-content { padding: 55px 0 58px; }
      h1 { font-size: 38px; }
      .hero-copy { font-size: 16px; }
      .hero-actions { display: grid; grid-template-columns: 1fr; }
      .hero-actions a { width: 100%; }
      .hero-index { margin-top: 38px; }
      .section { padding: 65px 0; }
      .feature-rail, .result-layout, .scene-wrap, .tiers, .info-grid { grid-template-columns: 1fr; }
      .feature-card:first-child { grid-column: auto; }
      .result-card.large { grid-row: auto; }
      .tier.highlight { margin-top: 0; }
      .cta-actions { justify-content: flex-start; margin-top: 25px; flex-wrap: wrap; }
      .footer-grid { grid-template-columns: 1fr 1fr; gap: 28px; }
      .footer-brand { grid-column: span 2; }
      .footer-bottom { flex-direction: column; gap: 6px; }
    }
    @media (max-width: 520px) {
      .container { padding-left: 20px; padding-right: 20px; }
      .nav-grid { grid-template-columns: 1fr; }
      .nav-item { min-height: 43px; }
      h1 { font-size: 34px; }
      .footer-grid { grid-template-columns: 1fr; }
      .footer-brand { grid-column: auto; }
    }

/* roulang page: category1 */
:root {
      --brand-primary:#2e6fce;--brand-primary-hover:#1f58ac;--brand-primary-soft:#eaf2ff;
      --brand-secondary:#58a7a1;--surface-main:#f7f9fc;--surface-card:#fff;--surface-muted:#eef3f8;
      --text-strong:#14243a;--text-body:#40536b;--text-muted:#7890a8;--border-soft:#dce6f0;
      --warm-accent:#e9a66c;--shadow-card:0 14px 36px rgba(35,75,118,.08);
      --shadow-hover:0 18px 42px rgba(35,75,118,.15);--radius-card:18px;--radius-button:10px;
      --content-max-width:1210px;
    }
    *,*::before,*::after{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{margin:0;color:var(--text-body);background:var(--surface-main);font-family:"PingFang SC","Microsoft YaHei","Noto Sans SC",sans-serif;font-size:16px;line-height:1.8;overflow-x:hidden}
    a{color:inherit;text-decoration:none;transition:.2s ease} a:hover{color:var(--brand-primary)}
    img{display:block;max-width:100%} button,input,select{font:inherit}
    button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid rgba(46,111,206,.28);outline-offset:3px}
    .container{max-width:var(--content-max-width)}
    .site-header{background:rgba(255,255,255,.97);border-bottom:1px solid var(--border-soft);position:relative;z-index:10}
    .brand-row{min-height:78px;display:flex;align-items:center;justify-content:space-between;gap:22px}
    .brand{display:inline-flex;align-items:center;gap:12px;color:var(--text-strong);font-weight:800;font-size:20px;white-space:nowrap}
    .brand-mark{width:40px;height:40px;border-radius:12px;background:var(--brand-primary);color:#fff;display:grid;place-items:center;font-weight:800;box-shadow:0 8px 18px rgba(46,111,206,.2)}
    .header-tools{display:flex;align-items:center;gap:12px}
    .header-search{width:210px;height:42px;border:1px solid var(--border-soft);border-radius:var(--radius-button);background:var(--surface-main);color:var(--text-body);padding:0 14px}
    .header-search::placeholder{color:var(--text-muted)}
    .btn-main,.btn-light,.btn-text{min-height:44px;border-radius:var(--radius-button);display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 18px;font-weight:700;transition:.22s ease;border:1px solid transparent}
    .btn-main{color:#fff;background:var(--brand-primary)} .btn-main:hover{color:#fff;background:var(--brand-primary-hover);transform:translateY(-2px);box-shadow:0 9px 20px rgba(46,111,206,.2)}
    .btn-light{color:var(--brand-primary);background:#fff;border-color:#b9cfe9}.btn-light:hover{color:var(--brand-primary-hover);background:var(--brand-primary-soft);border-color:var(--brand-primary)}
    .btn-text{color:var(--brand-primary);padding-left:0;padding-right:0}.btn-text:hover{text-decoration:underline}
    .menu-toggle{display:none;border:1px solid var(--border-soft);background:#fff;color:var(--text-strong);border-radius:9px;padding:8px 11px}
    .icon-nav{border-top:1px solid #eef3f7;padding:12px 0 14px}.nav-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
    .nav-item{display:flex;align-items:center;gap:10px;min-height:48px;padding:8px 14px;border:1px solid transparent;border-radius:11px;color:var(--text-body)}
    .nav-item:hover{background:var(--brand-primary-soft);color:var(--brand-primary);border-color:#cfe0f8}.nav-item.active{background:var(--brand-primary);color:#fff;box-shadow:0 6px 14px rgba(46,111,206,.17)}
    .nav-icon{width:27px;height:27px;border-radius:8px;display:grid;place-items:center;background:var(--surface-muted);color:var(--brand-primary);font-size:13px;font-weight:800}.nav-item.active .nav-icon{background:rgba(255,255,255,.18);color:#fff}.nav-label{font-size:14px;font-weight:700}
    .page-hero{padding:72px 0 62px;background:linear-gradient(rgba(46,111,206,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(46,111,206,.045) 1px,transparent 1px),#f5f9ff;background-size:34px 34px;border-bottom:1px solid var(--border-soft)}
    .eyebrow,.section-kicker{display:inline-flex;align-items:center;gap:7px;color:var(--brand-primary);font-size:13px;font-weight:800;letter-spacing:.04em}
    h1,h2,h3{color:var(--text-strong);font-weight:800;line-height:1.28;margin:0 0 18px} h1{font-size:clamp(34px,5vw,58px);letter-spacing:-.03em} h2{font-size:34px} h3{font-size:20px}
    .lead{font-size:18px;max-width:720px;color:var(--text-body);margin:0}
    .crumbs{font-size:13px;color:var(--text-muted);margin-bottom:20px}.crumbs a{color:var(--brand-primary)}
    .section{padding:88px 0}.section-head{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:30px}.section-head p{max-width:570px;margin:0;color:var(--text-muted)}
    .filter-panel{margin-top:-28px;position:relative;z-index:2;background:#fff;border:1px solid var(--border-soft);border-radius:var(--radius-card);box-shadow:var(--shadow-card);padding:22px}
    .search-box{height:48px;border:1px solid var(--border-soft);border-radius:10px;background:var(--surface-main);padding:0 15px;width:100%;color:var(--text-body)}.search-box:focus{border-color:var(--brand-primary);background:#fff}
    .filter-label{display:block;color:var(--text-strong);font-size:13px;font-weight:800;margin-bottom:6px}
    .filter-select{height:48px;border:1px solid var(--border-soft);border-radius:10px;background:#fff;color:var(--text-body);width:100%;padding:0 12px}
    .tag-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}.tag{display:inline-flex;align-items:center;padding:5px 12px;border-radius:20px;background:var(--brand-primary-soft);color:var(--brand-primary);font-size:13px;font-weight:700;border:1px solid transparent}.tag:hover,.tag.active{background:var(--brand-primary);color:#fff}
    .result-line{display:flex;justify-content:space-between;align-items:center;margin:30px 0 18px;color:var(--text-muted);font-size:14px}.result-line strong{color:var(--text-strong)}
    .series-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
    .series-card{display:grid;grid-template-columns:116px 1fr;gap:20px;background:var(--surface-card);border:1px solid var(--border-soft);border-radius:var(--radius-card);padding:18px;box-shadow:var(--shadow-card);transition:.22s ease}
    .series-card:hover{transform:translateY(-3px);border-color:#b9d2f0;box-shadow:var(--shadow-hover)}
    .cover{min-height:148px;border-radius:13px;background:linear-gradient(145deg,#dcecff,#f4f8fd);border:1px solid #cfe0f4;display:flex;align-items:flex-end;padding:12px;color:var(--brand-primary);font-weight:800;font-size:13px}
    .card-meta{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px}.card-meta span{font-size:12px;color:var(--text-muted)}.series-card h3{margin-bottom:8px}.series-card p{margin:0 0 12px;font-size:14px;color:var(--text-body);line-height:1.7}
    .card-link{color:var(--brand-primary);font-size:14px;font-weight:800}.card-link:hover{text-decoration:underline}
    .empty-state{display:none;text-align:center;padding:48px 20px;background:#fff;border:1px dashed #b9cfe9;border-radius:var(--radius-card);color:var(--text-muted)}
    .feature-strip{background:var(--surface-muted);border:1px solid var(--border-soft);border-radius:var(--radius-card);padding:26px}.feature-strip strong{display:block;color:var(--text-strong);font-size:20px;margin-bottom:5px}.feature-strip p{margin:0;color:var(--text-muted)}
    .faq-list{max-width:860px;margin:0 auto}.accordion-item{border:1px solid var(--border-soft)!important;border-radius:13px!important;overflow:hidden;margin-bottom:12px;background:#fff}.accordion-button{color:var(--text-strong);font-weight:800;background:#fff;box-shadow:none!important;padding:19px 22px}.accordion-button:not(.collapsed){color:var(--brand-primary);background:var(--brand-primary-soft)}.accordion-body{color:var(--text-body);padding:0 22px 21px}
    .cta{padding:62px 0;background:#eaf2ff;border-top:1px solid #d3e2f5;border-bottom:1px solid #d3e2f5}.cta-box{display:flex;align-items:center;justify-content:space-between;gap:26px}.cta h2{margin-bottom:8px}.cta p{margin:0;color:var(--text-body)}
    .site-footer{background:#f0f5fa;border-top:1px solid var(--border-soft);padding:58px 0 20px}.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:40px}.footer-brand p{max-width:370px;color:var(--text-muted);font-size:14px;margin:18px 0 0}.footer-title{color:var(--text-strong);font-weight:800;margin-bottom:13px}.footer-links{list-style:none;padding:0;margin:0}.footer-links li{margin:8px 0;color:var(--text-muted);font-size:14px}.footer-links a:hover{color:var(--brand-primary)}.footer-bottom{display:flex;justify-content:space-between;gap:20px;border-top:1px solid var(--border-soft);margin-top:42px;padding-top:18px;color:var(--text-muted);font-size:13px}
    .back-top{position:fixed;right:22px;bottom:22px;width:42px;height:42px;border:1px solid #b9cfe9;border-radius:50%;background:#fff;color:var(--brand-primary);box-shadow:var(--shadow-card);cursor:pointer;opacity:0;visibility:hidden;transition:.2s}.back-top.show{opacity:1;visibility:visible}.back-top:hover{background:var(--brand-primary);color:#fff}
    @media(max-width:768px){.header-tools .header-search,.header-tools .btn-main{display:none}.menu-toggle{display:block}.icon-nav{display:none}.icon-nav.open{display:block}.nav-grid{grid-template-columns:1fr}.page-hero{padding:52px 0 58px}.section{padding:64px 0}.section-head{display:block}.section-head p{margin-top:10px}.series-grid{grid-template-columns:1fr}.cta-box{display:block}.cta-box .btn-main{margin-top:22px}.footer-grid{grid-template-columns:1fr 1fr;gap:28px}.footer-brand{grid-column:1/-1}.footer-bottom{display:block}.footer-bottom span{display:block;margin-top:6px}}
    @media(max-width:520px){.brand{font-size:16px}.brand-mark{width:36px;height:36px}.filter-panel{padding:16px}.series-card{grid-template-columns:88px 1fr;gap:13px;padding:13px}.cover{min-height:128px;padding:9px;font-size:12px}.series-card h3{font-size:17px}.footer-grid{grid-template-columns:1fr}}
