/* roulang page: index */
:root{
  --bg:#f4f2eb;
  --card:#ffffff;
  --text:#1f232b;
  --sub:#676c78;
  --weak:#8f94a0;
  --line:#e4e1d8;
  --brand-a:#e1485a;
  --brand-b:#7254c6;
  --brand-grad:linear-gradient(135deg,#e1485a,#7254c6);
  --amber:#f4b95f;
  --ok:#58a681;
  --toolbar:#edeae2;
  --nav-bg:#fbfaf7;
  --radius-lg:20px;
  --radius-md:14px;
  --radius-sm:8px;
  --shadow-sm:0 1px 2px rgba(30,30,30,.05);
  --shadow-card:0 12px 32px rgba(50,30,50,.08);
  --shadow-accent:0 18px 42px rgba(113,70,150,.16);
}
*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
body{
  margin:0;
  font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","HarmonyOS Sans","Microsoft YaHei",system-ui,sans-serif;
  background:var(--bg);
  color:var(--text);
  line-height:1.75;
  font-size:16px;
}
img{display:block;max-width:100%;height:auto;}
a{color:inherit;text-decoration:none;}
input,button,textarea,select{font:inherit;}
input:focus-visible,button:focus-visible,a:focus-visible,summary:focus-visible{
  outline:2px dashed rgba(225,72,90,.8);
  outline-offset:3px;
  border-radius:6px;
}
a:hover{color:var(--brand-a);}
.wrap{max-width:1200px;margin:0 auto;padding:0 24px;position:relative;}

/* top toolbar */
.topbar{background:var(--toolbar);border-bottom:1px solid var(--line);font-size:13px;color:var(--sub);}
.topbar .wrap{min-height:40px;display:flex;align-items:center;gap:18px;}
.topbar .tb-title{color:var(--text);font-weight:600;letter-spacing:.02em;white-space:nowrap;}
.topbar .tb-title span{color:var(--brand-b);}
.topbar .tb-note{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--weak);}
.topbar .tb-links{display:flex;gap:4px;flex-shrink:0;}
.topbar .tb-links a{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:6px;color:var(--sub);transition:background .2s,color .2s;}
.topbar .tb-links a:hover{background:#e4e0d6;color:var(--text);}

/* main nav */
.main-header{background:rgba(251,250,247,.96);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:80;}
.main-header .wrap{min-height:72px;display:flex;align-items:center;gap:32px;}
.logo{display:inline-flex;align-items:center;gap:10px;flex-shrink:0;color:var(--text);}
.logo .logo-mark{width:42px;height:42px;display:flex;align-items:center;justify-content:center;background:var(--brand-grad);color:#fff;border-radius:12px;font-weight:700;font-size:20px;box-shadow:0 6px 16px rgba(114,84,198,.24);}
.logo .logo-txt{display:flex;flex-direction:column;line-height:1.1;}
.logo .logo-name{font-size:21px;font-weight:700;}
.logo .logo-desc{font-size:11px;color:var(--weak);letter-spacing:.08em;margin-top:3px;}
.main-nav{flex:1;display:flex;justify-content:center;}
.main-nav .nav-list{display:flex;list-style:none;margin:0;padding:0;gap:6px;}
.main-nav .nav-list a{display:block;padding:10px 15px;border-radius:8px;color:var(--text);font-weight:500;font-size:15px;transition:background .2s,color .2s;}
.main-nav .nav-list a:hover{background:#f1ede4;color:var(--text);}
.main-nav .nav-list a.is-active{background:#f9ecec;color:var(--brand-a);font-weight:600;}
.header-actions{flex-shrink:0;display:flex;gap:8px;}
.header-actions a{padding:6px 11px;border-radius:6px;border:1px solid var(--line);color:var(--sub);font-size:13px;transition:all .2s;}
.header-actions a:hover{border-color:var(--brand-b);color:var(--brand-b);background:#fbfaff;}
.nav-toggle{display:none;align-items:center;justify-content:center;width:42px;height:42px;border-radius:10px;border:1px solid var(--line);background:#fff;color:var(--text);cursor:pointer;}
.nav-toggle svg{width:22px;height:22px;}
@media (max-width:1023px){
  .main-header .wrap{gap:14px;}
  .main-nav{display:none;position:absolute;top:100%;left:0;right:0;background:var(--nav-bg);border-bottom:1px solid var(--line);box-shadow:0 16px 34px rgba(30,30,30,.08);padding:12px 18px 20px;}
  .main-nav.open{display:block;}
  .main-nav .nav-list{flex-direction:column;gap:2px;}
  .main-nav .nav-list a{padding:11px 10px;}
  .nav-toggle{display:inline-flex;}
  .header-actions{display:none;}
}
@media (max-width:760px){
  .topbar .wrap{flex-wrap:wrap;min-height:auto;padding-top:6px;padding-bottom:6px;gap:4px;}
  .topbar .tb-note{display:none;}
  .topbar .tb-links{width:100%;justify-content:flex-end;}
  .main-header .wrap{min-height:64px;}
}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;border:0;border-radius:10px;font-weight:600;font-size:15px;line-height:1.2;padding:13px 22px;cursor:pointer;transition:transform .2s,box-shadow .2s,background .2s,border-color .2s;}
.btn svg{width:17px;height:17px;}
.btn-gradient{background:var(--brand-grad);color:#fff;box-shadow:0 8px 20px rgba(114,84,198,.2);}
.btn-gradient:hover{color:#fff;transform:translate(-1px,-2px);box-shadow:0 14px 28px rgba(114,84,198,.3);}
.btn-white{background:#fff;color:var(--text);box-shadow:0 6px 16px rgba(0,0,0,.08);}
.btn-white:hover{color:var(--text);transform:translate(-1px,-2px);box-shadow:0 12px 24px rgba(0,0,0,.12);}
.btn-ghost{background:transparent;border:1px solid var(--line);color:var(--sub);}
.btn-ghost:hover{border-color:var(--brand-b);color:var(--brand-b);background:rgba(114,84,198,.04);transform:translate(-1px,-2px);}
.btn:active{transform:translateY(2px);}
.link-arrow{display:inline-flex;align-items:center;gap:6px;font-weight:600;color:var(--brand-a);}
.link-arrow svg{width:15px;height:15px;transition:transform .2s;}
.link-arrow:hover svg{transform:translateX(4px);}
.link-arrow:hover{color:var(--brand-b);}

/* page hero */
.page-hero{
  padding:44px 0 26px;
  background:radial-gradient(circle at 85% 18%,rgba(225,72,90,.06),transparent 30%),radial-gradient(circle at 10% 90%,rgba(114,84,198,.1),transparent 30%),var(--bg);
}
.breadcrumb-top{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  font-size:13px;
  color:var(--weak);
  align-items:center;
  margin:0 0 16px;
}
.breadcrumb-top a:hover{color:var(--brand-a);}
.breadcrumb-top .sep{color:#c8c5bc;}
.page-hero h1{
  font-size:38px;
  line-height:1.3;
  margin:0;
  font-weight:700;
  letter-spacing:-.01em;
}
.page-hero .hero-lead{
  margin:14px 0 0;
  max-width:780px;
  color:var(--sub);
  font-size:16px;
}
.state-line{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:20px;
}
.state-chip{
  display:inline-flex;
  align-items:center;
  gap:7px;
  background:#fff;
  border:1px solid var(--line);
  color:var(--sub);
  border-radius:999px;
  padding:6px 12px;
  font-size:13px;
}
.state-chip b{color:var(--text);font-weight:600;}
.state-chip::before{
  content:"";
  display:inline-block;
  width:7px;height:7px;
  border-radius:99px;
  background:var(--ok);
}
@media (max-width:520px){
  .page-hero{padding-top:30px;}
  .page-hero h1{font-size:27px;}
}

/* main content and sidebar */
.cat-main-area{
  padding:28px 0 80px;
}
.cat-layout{
  display:grid;
  grid-template-columns:minmax(0,1fr) 330px;
  gap:36px;
  align-items:start;
}
@media (max-width:900px){
  .cat-layout{grid-template-columns:1fr;}
  .cat-sidebar{order:-1;}
}
.cap-desc{
  background:#fff;
  border:1px solid var(--line);
  border-left:4px solid var(--brand-b);
  border-radius:12px;
  padding:16px 20px;
  margin-bottom:26px;
  font-size:14px;
  color:var(--sub);
}
.cap-desc strong{color:var(--text);}

/* category card list */
.cat-card-list{
  display:grid;
  gap:24px;
}
.cap-card{
  display:grid;
  grid-template-columns:250px minmax(0,1fr);
  background:var(--card);
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  overflow:hidden;
  box-shadow:var(--shadow-sm);
  transition:box-shadow .25s,transform .25s;
}
.cap-card:hover{
  transform:translateY(-3px);
  box-shadow:var(--shadow-card);
}
.cap-card.reverse .cap-cover{order:2;}
.cap-cover{
  position:relative;
  min-height:160px;
  background-color:#e4e1d8;
  overflow:hidden;
}
.cap-cover img{
  width:100%;
  height:100%;
  object-fit:cover;
  position:absolute;
  inset:0;
}
.cap-cover .cover-meta{
  position:absolute;
  left:10px;bottom:10px;
  background:rgba(30,30,30,.68);
  color:#fff;
  backdrop-filter:blur(4px);
  font-size:11px;
  padding:4px 9px;
  border-radius:6px;
}
.cap-body{
  padding:22px 22px 18px;
  display:flex;
  flex-direction:column;
}
.cap-tags{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:9px;}
.cap-tags span{font-size:12px;background:#f5f1ea;border:1px solid var(--line);color:var(--sub);padding:3px 9px;border-radius:6px;}
.cap-tags span.hot{background:#fbe9e7;border-color:#f2aca0;color:var(--brand-a);}
.cap-body h2{margin:0;font-size:19px;line-height:1.45;font-weight:700;}
.cap-body p{margin:8px 0 4px;color:var(--sub);font-size:14.5px;}
.cap-foot{
  margin-top:auto;
  padding-top:14px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.cap-foot .fit-note{
  font-size:12px;
  color:var(--weak);
  display:inline-flex;
  align-items:center;
  gap:5px;
}
.cap-foot .fit-note::before{
  content:"";
  width:6px;height:6px;
  border-radius:99px;
  background:var(--ok);
}
@media (max-width:600px){
  .cap-card,.cap-card.reverse{grid-template-columns:1fr;}
  .cap-cover{min-height:120px;order:-1!important;position:relative;}
  .cap-cover img{position:static;height:120px;}
}

/* sidebar */
.cat-sidebar{
  display:grid;
  gap:20px;
  position:sticky;
  top:90px;
}
.sidebar-card{
  background:#fff;
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  padding:20px 18px;
  box-shadow:var(--shadow-sm);
}
.sidebar-card h3{
  margin:0 0 12px;
  font-size:16px;
  font-weight:700;
  padding-bottom:10px;
  border-bottom:1px dashed var(--line);
}
.scene-list{list-style:none;margin:0;padding:0;}
.scene-list li{border-bottom:1px solid #f1eee8;}
.scene-list li:last-child{border:0;}
.scene-list a{
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 2px;
  color:var(--sub);
  font-size:14px;
  transition:all .2s;
}
.scene-list a:hover{
  color:var(--brand-b);
  background:#fbfaf6;
  padding-left:8px;
}
.scene-list .s-icon{
  width:28px;height:28px;
  border-radius:8px;
  background:#e9e6f6;
  display:flex;align-items:center;justify-content:center;
  color:var(--brand-b);
  flex-shrink:0;
}
.scene-list .s-icon svg{width:15px;height:15px;}
.scene-list .count{
  margin-left:auto;
  background:#f2efe8;
  color:var(--weak);
  font-size:12px;
  border-radius:99px;
  padding:1px 8px;
}
.check-card{
  background:linear-gradient(160deg,#f7f0ff,#fff6f2);
  border-color:#e2d5ef;
}
.check-card .check-input{
  display:flex;
  gap:8px;
  margin-top:10px;
}
.check-card .check-input input{
  flex:1;
  min-width:0;
  border:1px solid var(--line);
  border-radius:9px;
  background:#fff;
  padding:9px 10px;
  font-size:13px;
  color:var(--text);
}
.check-card .check-input .btn{
  padding:9px 14px;
  font-size:13px;
  white-space:nowrap;
}
.faq-mini-list{
  list-style:none;
  margin:0;
  padding:0;
}
.faq-mini-list li{
  padding:10px 0;
  border-bottom:1px dashed var(--line);
}
.faq-mini-list li:last-child{border:0;}
.faq-mini-list details summary{
  font-size:14px;
  font-weight:600;
  cursor:pointer;
  color:var(--text);
}
.faq-mini-list details p{
  margin:8px 0 0;
  font-size:13.5px;
  color:var(--sub);
}
.faq-mini-list details summary::-webkit-details-marker{display:none;}
.faq-mini-list details summary::before{content:"＋ ";color:var(--brand-b);}
.faq-mini-list details[open] summary::before{content:"－ ";color:var(--brand-b);}

/* cat cta */
.cat-bottom-cta{
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  background:#fff;
  padding:26px 0;
}
.cat-bottom-cta .wrap{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:22px;
}
.cat-bottom-cta p{margin:0;}
.cat-bottom-cta strong{font-size:16px;}
.cat-bottom-cta small{display:block;color:var(--weak);font-size:13px;}
@media (max-width:760px){
  .cat-bottom-cta .wrap{flex-direction:column;align-items:stretch;text-align:left;}
}

/* footer */
.service-notes{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:30px 0;}
.service-notes .wrap{display:grid;grid-template-columns:1.1fr 1.4fr .7fr;gap:26px;align-items:start;}
.service-note-title h3{font-size:16px;margin:0 0 6px;font-weight:700;}
.service-note-title p{margin:0;font-size:13px;color:var(--weak);}
.service-note-list{display:flex;flex-wrap:wrap;gap:8px;}
.service-note-list a{font-size:13px;color:var(--sub);border:1px solid var(--line);background:#faf9f5;padding:6px 12px;border-radius:8px;transition:all .2s;}
.service-note-list a:hover{color:var(--brand-b);border-color:#c9bee8;background:#fff;}
.service-note-state{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--sub);}
.service-note-state::before{content:"";width:9px;height:9px;border-radius:99px;background:var(--ok);box-shadow:0 0 0 3px rgba(88,166,129,.18);}
@media (max-width:860px){.service-notes .wrap{grid-template-columns:1fr;}}
.footer{background:#fbfaf7;padding:58px 0 22px;color:var(--sub);}
.footer-grid{display:grid;grid-template-columns:1.5fr repeat(3,1fr);gap:36px;padding-bottom:30px;border-bottom:1px solid var(--line);margin-bottom:18px;}
.footer-brand .logo{margin-bottom:12px;}
.footer-brand .brand-ps{font-size:13px;color:var(--weak);margin:10px 0 0;max-width:24em;}
.footer h4{color:var(--text);font-size:15px;font-weight:600;margin:0 0 12px;}
.footer-list{list-style:none;margin:0;padding:0;display:grid;gap:8px;}
.footer-list a{font-size:14px;color:var(--sub);}
.footer-list a:hover{color:var(--brand-a);}
.footer-bottom{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;font-size:12px;color:var(--weak);}
@media (max-width:860px){.footer-grid{grid-template-columns:1fr 1fr;}}
@media (max-width:520px){.footer-grid{grid-template-columns:1fr;gap:24px;}}

/* roulang page: category1 */
:root{
 --bg:#f4f2eb;
 --card:#ffffff;
 --text:#1f232b;
 --sub:#676c78;
 --weak:#8f94a0;
 --line:#e4e1d8;
 --brand-a:#e1485a;
 --brand-b:#7254c6;
 --brand-grad:linear-gradient(135deg,#e1485a,#7254c6);
 --amber:#f4b95f;
 --ok:#58a681;
 --toolbar:#edeae2;
 --nav-bg:#fbfaf7;
 --radius-lg:20px;
 --radius-md:14px;
 --radius-sm:8px;
 --shadow-sm:0 1px 2px rgba(30,30,30,.05);
 --shadow-card:0 12px 32px rgba(50,30,50,.08);
 --shadow-accent:0 18px 42px rgba(113,70,150,.16);
}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
body{
 margin:0;
 font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","HarmonyOS Sans","Microsoft YaHei",system-ui,sans-serif;
 background:var(--bg);
 color:var(--text);
 line-height:1.75;
 font-size:16px;
}
*,*::before,*::after{box-sizing:border-box;}
img{display:block;max-width:100%;height:auto;}
a{color:inherit;text-decoration:none;}
input,button,textarea,select{font:inherit;}
input:focus-visible,button:focus-visible,a:focus-visible,summary:focus-visible{
 outline:2px dashed rgba(225,72,90,.8);
 outline-offset:3px;
 border-radius:6px;
}
a:hover{color:var(--brand-a);}
.wrap{max-width:1200px;margin:0 auto;padding-left:24px;padding-right:24px;}
.site-header{position:relative;z-index:90;}
.topbar{background:var(--toolbar);border-bottom:1px solid var(--line);font-size:13px;color:var(--sub);}
.topbar .wrap{min-height:40px;display:flex;align-items:center;gap:18px;}
.topbar .tb-title{color:var(--text);font-weight:600;letter-spacing:.02em;white-space:nowrap;}
.topbar .tb-title span{color:var(--brand-b);}
.topbar .tb-note{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--weak);}
.topbar .tb-links{display:flex;gap:4px;flex-shrink:0;}
.topbar .tb-links a{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:6px;color:var(--sub);transition:background .2s,color .2s;line-height:1.5;}
.topbar .tb-links a:hover{background:#e4e0d6;color:var(--text);}
.topbar .tb-links svg{width:14px;height:14px;}
.main-header{background:rgba(251,250,247,.96);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:80;}
.main-header .wrap{min-height:72px;display:flex;align-items:center;gap:32px;}
.logo{display:inline-flex;align-items:center;gap:10px;flex-shrink:0;color:var(--text);}
.logo .logo-mark{width:42px;height:42px;display:flex;align-items:center;justify-content:center;background:var(--brand-grad);color:#fff;border-radius:12px;font-weight:700;font-size:20px;box-shadow:0 6px 16px rgba(114,84,198,.24);}
.logo .logo-txt{display:flex;flex-direction:column;line-height:1.1;}
.logo .logo-name{font-size:21px;font-weight:700;}
.logo .logo-desc{font-size:11px;color:var(--weak);letter-spacing:.08em;margin-top:3px;}
.main-nav{flex:1;display:flex;justify-content:center;}
.nav-list{display:flex;list-style:none;margin:0;padding:0;gap:6px;}
.main-nav .nav-list a{display:block;padding:10px 15px;border-radius:8px;color:var(--text);font-weight:500;font-size:15px;transition:background .2s,color .2s;}
.main-nav .nav-list a:hover{background:#f1ede4;color:var(--text);}
.main-nav .nav-list a.is-active{background:#f9ecec;color:var(--brand-a);font-weight:600;}
.header-actions{flex-shrink:0;display:flex;gap:8px;}
.header-actions a{padding:6px 11px;border-radius:6px;border:1px solid var(--line);color:var(--sub);font-size:13px;transition:all .2s;}
.header-actions a:hover{border-color:var(--brand-b);color:var(--brand-b);background:#fbfaff;}
.nav-toggle{display:none;align-items:center;justify-content:center;width:42px;height:42px;border-radius:10px;border:1px solid var(--line);background:#fff;color:var(--text);cursor:pointer;}
.nav-toggle svg{width:22px;height:22px;}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;border:0;border-radius:10px;font-weight:600;font-size:15px;line-height:1.2;padding:13px 22px;cursor:pointer;transition:transform .2s,box-shadow .2s,background .2s,border-color .2s,color .2s;}
.btn svg{width:17px;height:17px;}
.btn-gradient{background:var(--brand-grad);color:#fff;box-shadow:0 8px 20px rgba(114,84,198,.2);}
.btn-gradient:hover{color:#fff;transform:translate(-1px,-2px);box-shadow:0 14px 28px rgba(114,84,198,.3);}
.btn-white{background:#fff;color:var(--text);box-shadow:0 6px 16px rgba(0,0,0,.08);}
.btn-white:hover{color:var(--text);transform:translate(-1px,-2px);box-shadow:0 12px 24px rgba(0,0,0,.12);}
.btn-ghost{background:transparent;border:1px solid var(--line);color:var(--sub);}
.btn-ghost:hover{border-color:var(--brand-b);color:var(--brand-b);background:rgba(114,84,198,.04);transform:translate(-1px,-2px);}
.btn:active{transform:translateY(2px);}
.btn-block{width:100%;}
.btn-smaller{padding:10px 16px;font-size:14px;}
.link-arrow{display:inline-flex;align-items:center;gap:6px;font-weight:600;color:var(--brand-a);}
.link-arrow svg{width:15px;height:15px;transition:transform .2s;}
.link-arrow:hover svg{transform:translateX(4px);}
.link-arrow:hover{color:var(--brand-b);}
.page-hero{
 padding:46px 0 30px;
 background:
  radial-gradient(circle at 82% 16%,rgba(225,72,90,.07),transparent 32%),
  radial-gradient(circle at 10% 90%,rgba(114,84,198,.1),transparent 30%),
  var(--bg);
}
.breadcrumb-top{margin:0 0 20px;font-size:14px;color:var(--weak);display:flex;flex-wrap:wrap;gap:6px;align-items:center;}
.breadcrumb-top a{color:var(--weak);}
.breadcrumb-top a:hover{color:var(--brand-a);}
.breadcrumb-top .bc-arrow{color:#c8c2b7;}
.page-hero h1{
 font-size:40px;
 line-height:1.32;
 margin:0;
 font-weight:700;
 letter-spacing:-.01em;
 color:var(--text);
}
.page-hero .hero-lead{
 margin:16px 0 0;
 max-width:820px;
 color:var(--sub);
 font-size:16px;
}
.hero-state{margin-top:26px;display:flex;flex-wrap:wrap;gap:10px;}
.state-chip{
 display:inline-flex;
 align-items:center;
 gap:8px;
 background:#fff;
 border:1px solid var(--line);
 color:var(--sub);
 border-radius:999px;
 padding:7px 13px;
 font-size:13px;
 box-shadow:var(--shadow-sm);
}
.state-chip b{color:var(--text);font-weight:700;}
.state-chip::before{
 content:"";
 display:inline-block;
 width:7px;height:7px;
 border-radius:99px;
 background:var(--ok);
}
.cat-main-area{padding:16px 0 70px;}
.grid-container.wide{max-width:1200px;padding-left:24px;padding-right:24px;}
.cat-grid-row{row-gap:0;}
.layout-main{margin-bottom:26px;}
.layout-side{margin-bottom:12px;}
.layout-side .side-card{margin-bottom:22px;}
.vid-route-card{
 background:var(--card);
 border:1px solid var(--line);
 border-radius:var(--radius-lg);
 padding:23px 26px 26px;
 margin-bottom:34px;
 box-shadow:var(--shadow-sm);
}
.vid-route-head{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:12px;}
.vid-route-head h2{margin:0;font-size:19px;font-weight:700;}
.vid-route-head p{margin:0;font-size:13px;color:var(--weak);}
.vid-route-track{position:relative;display:flex;align-items:stretch;gap:8px;overflow-x:auto;padding:14px 2px 8px;scrollbar-width:thin;}
.route-node{
 position:relative;
 flex:1 1 0;
 min-width:132px;
 background:#fbfaf6;
 border:1px solid var(--line);
 border-radius:var(--radius-md);
 padding:13px 14px 12px;
 font-size:14px;
 font-weight:600;
 color:var(--text);
 line-height:1.5;
 z-index:1;
}
.route-node em{display:block;font-style:normal;font-size:12px;font-weight:400;color:var(--weak);margin-top:2px;}
.route-node::after{
 content:"";
 position:absolute;
 top:50%;
 right:-8px;
 width:14px;
 height:2px;
 background:linear-gradient(90deg,var(--brand-a),var(--brand-b));
 z-index:2;
}
.route-node:last-child::after{display:none;}
.route-tag{display:inline-flex;align-items:center;gap:6px;color:var(--brand-a);font-size:12px;background:rgba(225,72,90,.08);padding:3px 9px;border-radius:999px;margin-bottom:8px;}
.section-intro{
 display:flex;
 flex-direction:column;
 gap:8px;
 margin:0 0 22px;
}
.section-intro h2{
 margin:0;
 font-size:28px;
 font-weight:700;
 line-height:1.4;
}
.section-intro h2 span{color:var(--brand-b);}
.section-intro p{margin:0;color:var(--sub);font-size:15px;max-width:720px;}
.section-intro .slot-dot{
 display:inline-flex;width:10px;height:10px;border-radius:99px;
 background:var(--brand-grad);margin-right:9px;
}
.cap-card-list{display:grid;gap:22px;}
.cap-card{
 display:grid;
 grid-template-areas:"media content";
 grid-template-columns:270px minmax(0,1fr);
 background:var(--card);
 border:1px solid var(--line);
 border-radius:var(--radius-lg);
 overflow:hidden;
 box-shadow:var(--shadow-sm);
 scroll-margin-top:130px;
 transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;
}
.cap-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-card);border-color:#ddd9cf;}
.cap-card.is-flip{grid-template-areas:"content media";grid-template-columns:minmax(0,1fr) 270px;}
.cap-card .cap-media{grid-area:media;position:relative;background:#efe8dc;min-height:220px;}
.cap-media .thumb-fallback{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--weak);font-weight:600;background:#eee9de;letter-spacing:.05em;}
.cap-media img{position:relative;width:100%;height:100%;min-height:220px;object-fit:cover;}
.cap-card .cap-info{grid-area:content;padding:25px 28px 22px;display:flex;flex-direction:column;}
.cap-tag-row{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px;}
.chip-tag{
 display:inline-flex;
 align-items:center;
 background:#f6f1e8;
 color:#7c5860;
 border:1px solid #e9e0d4;
 border-radius:999px;
 padding:4px 10px;
 font-size:12px;
 line-height:1.5;
}
.chip-tag.grad-tag{
 background:rgba(114,84,198,.07);
 color:#5c43a1;
 border-color:rgba(114,84,198,.18);
}
.cap-card h3{margin:0;font-size:19px;font-weight:700;line-height:1.5;}
.cap-card h3 a{color:inherit;}
.cap-card h3 a:hover{color:var(--brand-b);}
.cap-desc{margin:10px 0 0;color:var(--sub);font-size:15px;}
.cap-readmore{
 margin-top:auto;
 border-top:1px dashed #e7e2d8;
 padding-top:12px;
}
.cap-readmore summary{
 list-style:none;
 cursor:pointer;
 display:inline-flex;
 align-items:center;
 gap:7px;
 color:var(--brand-a);
 font-size:14px;
 font-weight:600;
 padding:6px 0;
 transition:color .2s;
}
.cap-readmore summary::-webkit-details-marker{display:none;}
.cap-readmore summary:hover{color:var(--brand-b);}
.cap-readmore summary .plus-arrow{display:inline-flex;transition:transform .2s;}
.cap-readmore summary .plus-arrow svg{width:15px;height:15px;}
.cap-readmore[open] summary .plus-arrow{transform:rotate(90deg);}
.readmore-body{
 background:#faf8f3;
 border:1px solid #eee9df;
 border-radius:10px;
 padding:11px 14px;
 margin-top:8px;
 color:var(--sub);
 font-size:14px;
}
.side-card{
 background:var(--card);
 border:1px solid var(--line);
 border-radius:var(--radius-lg);
 padding:22px;
 box-shadow:var(--shadow-sm);
}
.side-card.side-dark{
 color:#fff;
 border:0;
 position:relative;
 overflow:hidden;
 background:
  linear-gradient(205deg,rgba(225,72,90,.12),rgba(31,35,43,.26)),
  linear-gradient(140deg,rgba(31,35,43,.82),rgba(44,36,72,.9)),
  url('/assets/images/backpic/back-2.jpg') center/cover no-repeat;
}
.side-card h3{margin:0 0 14px;font-size:19px;font-weight:700;color:var(--text);}
.side-card.side-dark h3{color:#fff;}
.side-card .side-sub{margin:0 0 10px;color:var(--sub);font-size:14px;}
.side-card.side-dark .side-sub,.side-card.side-dark p{color:rgba(255,255,255,.84);}
.scene-list{margin:0;padding:0;list-style:none;}
.scene-list li{border-bottom:1px solid #efece5;}
.scene-list li:last-child{border-bottom:0;}
.scene-list a{
 display:flex;
 align-items:center;
 gap:10px;
 padding:12px 4px;
 color:var(--text);
 font-size:15px;
 transition:background .2s,color .2s;
 border-radius:8px;
}
.scene-list a:hover{background:#f5f1e9;color:var(--brand-a);}
.scene-list svg{width:17px;height:17px;color:var(--brand-b);flex-shrink:0;}
.scene-list .scene-count{margin-left:auto;background:#f4efe6;color:var(--weak);font-size:12px;border-radius:99px;padding:2px 9px;flex-shrink:0;}
.side-dark .scene-list a{color:rgba(255,255,255,.92);}
.side-dark .scene-list a:hover{background:rgba(255,255,255,.1);color:#fff;}
.side-dark .scene-list li{border-color:rgba(255,255,255,.14);}
.side-dark .scene-list svg{color:var(--amber);}
.side-dark .scene-count{background:rgba(255,255,255,.12);color:#fff;}
.selfcheck-input-wrap{display:flex;flex-direction:column;gap:10px;}
.selfcheck-input-wrap input{
 width:100%;
 border:1px solid var(--line);
 background:#fff;
 border-radius:10px;
 padding:10px 13px;
 color:var(--text);
 transition:border-color .2s,box-shadow .2s;
}
.selfcheck-input-wrap input::placeholder{color:var(--weak);}
.selfcheck-input-wrap input:focus{border-color:var(--brand-b);box-shadow:0 0 0 3px rgba(114,84,198,.12);}
.selfcheck-input-wrap label{font-size:13px;color:var(--sub);margin-bottom:-3px;}
.side-dark input{background:#fff;color:var(--text);}
.check-empty{
 margin-top:10px;
 color:#b74b45;
 background:rgba(215,87,74,.08);
 border:1px solid rgba(215,87,74,.2);
 border-radius:8px;
 padding:8px 11px;
 font-size:13px;
}
.faq-stack details{
 border:1px solid var(--line);
 border-radius:12px;
 background:#fcfbf7;
 margin-bottom:10px;
 overflow:hidden;
 transition:border-color .2s,background .2s;
}
.faq-stack details[open]{background:#fff;border-color:#dcd7cb;}
.faq-stack summary{
 list-style:none;
 display:flex;
 align-items:center;
 justify-content:space-between;
 gap:12px;
 min-height:46px;
 padding:10px 13px;
 font-size:14px;
 font-weight:600;
 color:var(--text);
 cursor:pointer;
}
.faq-stack summary::-webkit-details-marker{display:none;}
.faq-stack summary .faq-arrow{color:var(--brand-b);flex-shrink:0;transition:transform .2s;}
.faq-stack summary .faq-arrow svg{display:block;width:16px;height:16px;}
.faq-stack details[open] summary .faq-arrow{transform:rotate(90deg);}
.faq-stack details p{
 margin:0;
 padding:0 14px 12px;
 color:var(--sub);
 font-size:13px;
 line-height:1.75;
}
.cat-bottom-cta{padding:8px 0 72px;}
.cat-cta-bar{
 display:flex;
 align-items:center;
 justify-content:space-between;
 gap:22px;
 background:var(--card);
 border:1px solid var(--line);
 border-radius:var(--radius-lg);
 padding:22px 26px;
 box-shadow:var(--shadow-sm);
 flex-wrap:wrap;
}
.cat-cta-bar p{margin:0;font-size:16px;color:var(--text);font-weight:600;}
.cat-cta-bar small{display:block;font-size:13px;font-weight:400;color:var(--weak);margin-top:3px;}
.cat-cta-bar .btn{flex-shrink:0;}
.service-notes{background:#eae6db;border-bottom:1px solid var(--line);padding:22px 0;}
.service-notes .wrap{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,2fr) auto;gap:22px;align-items:center;}
.service-note-title h3{margin:0;font-size:17px;color:var(--text);}
.service-note-title p{margin:4px 0 0;font-size:13px;color:var(--sub);}
.service-note-list{display:flex;flex-wrap:wrap;gap:8px 18px;justify-content:center;}
.service-note-list a{position:relative;display:inline-flex;align-items:center;font-size:14px;color:var(--sub);padding:5px 0;transition:color .2s;}
.service-note-list a::before{content:"";width:5px;height:5px;border-radius:99px;background:var(--brand-b);margin-right:8px;}
.service-note-list a:hover{color:var(--brand-a);}
.service-note-state{font-size:13px;color:var(--ok);background:rgba(88,166,129,.08);border:1px solid rgba(88,166,129,.22);padding:6px 13px;border-radius:999px;white-space:nowrap;}
.footer{background:#fbfaf7;padding:62px 0 0;border-top:1px solid var(--line);}
.footer-grid{
 display:grid;
 grid-template-columns:1.6fr 1fr 1fr 1fr;
 gap:36px 30px;
 padding-bottom:42px;
}
.footer .footer-brand p.brand-ps{margin:16px 0 0;color:var(--sub);font-size:14px;line-height:1.8;padding-right:24px;}
.footer-grid h4{margin:0 0 14px;font-size:15px;font-weight:700;color:var(--text);}
.footer-list{list-style:none;margin:0;padding:0;}
.footer-list li{margin-bottom:4px;}
.footer-list a{display:block;padding:7px 0;color:var(--sub);font-size:14px;transition:color .2s,padding-left .2s;border-radius:6px;}
.footer-list a:hover{color:var(--brand-a);padding-left:5px;}
.footer-bottom{
 border-top:1px solid var(--line);
 padding:20px 0;
 display:flex;
 flex-wrap:wrap;
 gap:8px 24px;
 justify-content:space-between;
 font-size:13px;
 color:var(--weak);
}
@media(max-width:1023px){
 .main-header .wrap{gap:14px;}
 .main-nav{display:none;position:absolute;top:100%;left:0;right:0;background:var(--nav-bg);border-bottom:1px solid var(--line);box-shadow:0 16px 34px rgba(30,30,30,.08);padding:12px 18px 20px;}
 .main-nav.open{display:block;}
 .main-nav .nav-list{flex-direction:column;gap:2px;}
 .main-nav .nav-list a{padding:12px 10px;}
 .nav-toggle{display:inline-flex;}
 .header-actions{display:none;}
 .topbar .wrap{flex-wrap:wrap;min-height:auto;padding-top:6px;padding-bottom:6px;gap:4px;}
 .topbar .tb-note{display:none;}
 .topbar .tb-links{width:100%;justify-content:flex-end;}
 .main-header .wrap{min-height:64px;}
 .cap-card,.cap-card.is-flip{grid-template-areas:"content";grid-template-columns:minmax(0,1fr);}
 .cap-card .cap-media{min-height:190px;}
 .cap-media img{min-height:190px;}
 .route-node{min-width:160px;}
 .cat-cta-bar{flex-direction:column;align-items:flex-start;}
 .service-notes .wrap{grid-template-columns:1fr;gap:12px;}
 .service-note-list{justify-content:flex-start;}
 .footer-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
 .page-hero h1{font-size:30px;}
 .section-intro h2{font-size:23px;}
 .grid-container.wide{max-width:100%;padding-left:20px;padding-right:20px;}
}
@media(max-width:639px){
 .page-hero{padding-top:30px;}
 .page-hero h1{font-size:25px;}
 .page-hero .hero-lead{font-size:15px;}
 .hero-state{flex-direction:column;align-items:flex-start;}
 .vid-route-card{padding:17px 15px 18px;}
 .cap-card .cap-media,.cap-media img{min-height:180px;}
 .cap-card .cap-info{padding:18px 17px;}
 .cap-card h3{font-size:17px;}
 .route-node{min-width:132px;}
 .grid-container.wide{padding-left:16px;padding-right:16px;}
 .footer-grid{grid-template-columns:1fr;gap:28px;}
 .footer .footer-brand p.brand-ps{padding-right:0;}
 .footer-bottom{flex-direction:column;gap:4px;}
}