/* roulang page: index */
:root{--paper:#f2eee8;--ink:#292426;--muted:#6d6464;--wine:#5d2948;--wine2:#431b34;--apricot:#e4b59b;--sage:#78867a;--line:#cfc4bc;--cream:#fffaf4;--shadow:0 10px 28px rgba(43,34,38,.1);--r:14px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:"PingFang SC","Microsoft YaHei","Noto Sans SC",Arial,sans-serif;font-size:16px;line-height:1.75}a{color:inherit;text-decoration:none}button,input{font:inherit}.grid-container{max-width:1200px}.topbar{height:36px;background:var(--ink);color:#eee4d9;font-size:13px}.topbar .grid-container{height:100%;display:flex;align-items:center;justify-content:space-between}.topbar span:nth-child(2){color:#cfc4bc}.site-head{background:rgba(255,250,244,.97);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:30}.navwrap{min-height:76px;display:flex;align-items:center;gap:28px}.brand{font-size:18px;font-weight:800;white-space:nowrap;color:var(--wine)}.brand:before{content:"";display:inline-block;width:17px;height:17px;margin-right:8px;vertical-align:-2px;background:var(--wine);clip-path:polygon(0 0,100% 0,100% 72%,72% 100%,0 100%);box-shadow:5px 5px 0 var(--apricot)}.navlinks{display:flex;gap:22px;align-items:stretch;flex:1}.navlinks a{padding:25px 2px 20px;font-size:15px;border-bottom:3px solid transparent;transition:.18s ease-out}.navlinks a:hover,.navlinks a.active{color:var(--wine);border-color:var(--wine)}.navcta,.btn{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 18px;border:1px solid var(--wine);border-radius:8px;background:var(--wine);color:#fffaf4;font-weight:700;cursor:pointer;transition:.18s ease-out}.navcta:hover,.btn:hover{background:var(--wine2);box-shadow:inset 0 0 0 1px var(--apricot);transform:translateY(-2px)}.btn.alt{background:transparent;color:var(--wine)}.btn.alt:hover{background:var(--apricot);color:var(--ink)}a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid var(--sage);outline-offset:3px}.hero{position:relative;overflow:hidden;padding:70px 0 55px;background:linear-gradient(110deg,#e9d7cc 0%,var(--paper) 56%,#e8d6dd 100%)}.hero:after{content:"01";position:absolute;right:5%;top:-55px;font-size:250px;font-weight:800;color:rgba(93,41,72,.06);line-height:1}.live{display:inline-flex;gap:8px;align-items:center;padding:5px 10px;background:var(--ink);color:#f5e9dd;font-size:12px;font-weight:700;letter-spacing:.08em}.dot{width:7px;height:7px;border-radius:50%;background:var(--apricot)}h1,h2,h3,p{margin-top:0}h1{max-width:850px;margin:18px 0;font-size:46px;line-height:1.18;letter-spacing:-.04em;font-weight:800}h2{font-size:30px;line-height:1.25;font-weight:800;letter-spacing:-.03em}h3{font-size:19px;line-height:1.4;font-weight:800}.lead{max-width:750px;color:#51484a;font-size:17px}.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:25px}.countdown{margin-top:38px;display:flex;gap:0;max-width:760px;border:1px solid var(--line);background:#f8f2eb}.countdown div{flex:1;padding:10px 14px;border-right:1px solid var(--line);font-size:13px}.countdown div:last-child{border:0}.countdown b{display:block;color:var(--wine);font-size:18px}.section{padding:88px 0;position:relative}.eyebrow{display:inline-flex;align-items:center;gap:8px;color:var(--wine);font-weight:800;font-size:13px;letter-spacing:.08em}.eyebrow i{display:inline-grid;place-items:center;width:25px;height:25px;border-radius:50%;background:var(--apricot);font-style:normal;color:var(--ink)}.intro{max-width:710px;color:var(--muted);margin:12px 0 30px}.rail{display:flex;gap:0;margin-top:36px}.rail-card{position:relative;flex:1;min-height:180px;padding:23px 20px;background:#e7e0d9;border:1px solid var(--line);border-right:0}.rail-card:last-child{border-right:1px solid var(--line)}.rail-card:nth-child(2){background:#f2d8c8}.rail-card:before{content:attr(data-no);display:block;color:var(--wine);font-weight:800;font-size:13px}.rail-card p{font-size:14px;color:var(--muted);line-height:1.65}.dark{background:var(--ink);color:#fbf1e7}.dark .intro{color:#d7c9c1}.feature{padding:19px 0;border-top:1px solid #665e60}.feature:last-child{border-bottom:1px solid #665e60}.feature small{color:var(--apricot);font-weight:800}.feature h3{margin:4px 0}.feature p{margin:0;color:#d7c9c1;font-size:14px}.command{margin-top:15px;padding:22px;background:#383033;border:1px solid #74676b;box-shadow:10px 10px 0 rgba(228,181,155,.22);clip-path:polygon(0 0,100% 0,100% 93%,93% 100%,0 100%)}.command-head{display:flex;justify-content:space-between;border-bottom:1px solid #665e60;padding-bottom:12px;color:#f5e6dc;font-weight:800}.status{color:#b8c5b9;font-size:12px}.command-row{display:flex;justify-content:space-between;padding:13px 0;border-bottom:1px solid #51494c;font-size:14px}.chip{display:inline-block;padding:3px 8px;background:#ead1c4;color:var(--wine);font-size:12px;font-weight:700}.results{background:#eee7df}.result-card{height:100%;padding:30px;background:var(--cream);border:1px solid var(--line);box-shadow:var(--shadow);clip-path:polygon(0 0,100% 0,100% 92%,94% 100%,0 100%)}.result-card strong{display:block;font-size:37px;line-height:1;color:var(--wine);margin:17px 0 10px}.notice{margin-top:22px;padding:17px 21px;border-left:5px solid var(--sage);background:#dfe4db}.quotes{display:grid;grid-template-columns:1fr 1.25fr 1fr;gap:18px;align-items:center}.quote{padding:23px;background:var(--cream);border:1px solid var(--line);box-shadow:var(--shadow)}.quote.main{padding:32px;background:#f3ddd2}.quote p{font-size:15px}.quote footer{color:var(--muted);font-size:13px}.news{background:#e9dfd8}.news-list{background:var(--cream);border:1px solid var(--line)}.news-item{display:flex;gap:15px;align-items:center;padding:16px 20px;border-bottom:1px solid var(--line);transition:.18s}.news-item:last-child{border:0}.news-item:hover{background:#f3ddd2;padding-left:25px}.news-item time{color:var(--wine);font-weight:800;font-size:13px;white-space:nowrap}.aside-note{padding:28px;background:var(--wine);color:#fff4eb;height:100%;clip-path:polygon(0 0,100% 0,100% 90%,93% 100%,0 100%)}.accordion{background:transparent}.accordion-item{margin-bottom:10px;border:1px solid var(--line);background:var(--cream)}.accordion-title{color:var(--ink);font-weight:700;font-size:16px}.accordion-title:hover,.accordion-title:focus{background:#f3ddd2;color:var(--wine)}.accordion-content{border-top:1px solid var(--line);border-left:4px solid var(--apricot);color:var(--muted)}.cta{padding:75px 0;background:var(--wine);color:#fff7f0;position:relative}.cta p{color:#ead8cf;max-width:650px}.cta .btn{background:var(--apricot);color:var(--ink);border-color:var(--apricot)}.cta .btn:hover{background:#f0c9b1}.cta .btn.alt{color:#fff7f0;border-color:#d9b9ad}.formcard{padding:22px;background:#f9eee6;color:var(--ink);box-shadow:var(--shadow)}label{font-size:13px;font-weight:700;color:var(--wine)}input{width:100%;height:45px;margin:6px 0 13px;padding:0 12px;border:1px solid #a89a94;background:#fffaf4;color:var(--ink)}input:focus{border-color:var(--wine);box-shadow:0 0 0 3px rgba(120,134,122,.3)}.foot{background:var(--ink);color:#eadfd5;padding:54px 0 82px}.foot h3{color:#fff4eb;font-size:16px}.foot p,.foot a{color:#cbbeb5;font-size:14px}.foot a:hover{color:var(--apricot)}.foot ul{margin:0;list-style:none}.foot li{margin:7px 0}.copyright{margin-top:34px;padding-top:20px;border-top:1px solid #5d5558;color:#aa9d96;font-size:13px}.mobile-bar{display:none}@media(max-width:1023px){.navlinks{gap:12px}.brand{font-size:16px}h1{font-size:39px}.section{padding:68px 0}}@media(max-width:639px){.topbar span:nth-child(2){display:none}.navwrap{min-height:62px;gap:10px}.navlinks{overflow-x:auto;gap:16px}.navlinks a{padding:19px 0 15px;white-space:nowrap;font-size:13px}.navcta{display:none}h1{font-size:31px}.hero{padding:52px 0 40px}.lead{font-size:15px}.countdown div{padding:8px;font-size:11px}.countdown b{font-size:15px}.section{padding:56px 0}.rail{display:block}.rail-card{border-right:1px solid var(--line);border-bottom:0;min-height:auto}.rail-card:last-child{border-bottom:1px solid var(--line)}.quotes{display:block}.quote,.quote.main{margin-bottom:14px;padding:22px}.news-item{align-items:flex-start}.aside-note{margin-top:16px}.mobile-bar{display:flex;position:fixed;bottom:0;left:0;right:0;z-index:40;padding:9px 14px;background:var(--ink);gap:10px}.mobile-bar .btn{flex:1;min-height:42px}.mobile-bar a:last-child{display:flex;align-items:center;color:#f3ddd2;font-size:13px}.foot{padding-bottom:100px}}

/* roulang page: category2 */
:root{
  --paper:#f2eee8;--ink:#292426;--muted:#6d6464;--wine:#5d2948;--wine2:#431b34;
  --apricot:#e4b59b;--sage:#78867a;--line:#cfc4bc;--cream:#fffaf4;
  --shadow:0 10px 28px rgba(43,34,38,.1);--r:14px
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:"PingFang SC","Microsoft YaHei","Noto Sans SC",Arial,sans-serif;font-size:16px;line-height:1.75}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button,input{font:inherit}
button{cursor:pointer}
.grid-container{max-width:1200px}
.topbar{height:36px;background:var(--ink);color:#eee4d9;font-size:13px}
.topbar .grid-container{height:100%;display:flex;align-items:center;justify-content:space-between}
.topbar span:nth-child(2){color:#cfc4bc}
.topbar a{color:var(--apricot);border-bottom:1px solid transparent}
.topbar a:hover{border-color:var(--apricot)}
.site-head{background:rgba(242,238,232,.98);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}
.navwrap{min-height:76px;display:flex;align-items:center;gap:28px}
.brand{font-size:18px;font-weight:800;white-space:nowrap;color:var(--wine)}
.brand:before{content:"";display:inline-block;width:17px;height:17px;margin-right:8px;vertical-align:-2px;background:var(--wine);clip-path:polygon(0 0,100% 0,100% 72%,72% 100%,0 100%);box-shadow:5px 5px 0 var(--apricot)}
.navlinks{display:flex;gap:22px;align-items:stretch;flex:1}
.navlinks a{padding:25px 2px 20px;font-size:15px;border-bottom:3px solid transparent;transition:.18s ease-out}
.navlinks a:hover,.navlinks a.active{color:var(--wine);border-color:var(--wine)}
.navcta,.btn{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 18px;border:1px solid var(--wine);border-radius:8px;background:var(--wine);color:#fffaf4;font-weight:700;transition:.18s ease-out}
.navcta:hover,.btn:hover{background:var(--wine2);box-shadow:inset 0 0 0 1px var(--apricot);transform:translateY(-2px)}
.btn.alt{background:transparent;color:var(--wine)}
.btn.alt:hover{background:var(--apricot);color:var(--ink)}
a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid var(--sage);outline-offset:3px}
.page-head{position:relative;overflow:hidden;padding:66px 0 52px;background:#eadbd2}
.page-head:after{content:"02";position:absolute;right:7%;top:-38px;font-size:230px;line-height:1;font-weight:800;color:rgba(93,41,72,.07)}
.breadcrumbs{margin:0 0 18px;color:var(--muted);font-size:13px}
.breadcrumbs a{color:var(--wine);font-weight:700}
.eyebrow{display:inline-flex;align-items:center;gap:8px;color:var(--wine);font-weight:800;font-size:13px;letter-spacing:.08em}
.eyebrow i{display:inline-grid;place-items:center;width:25px;height:25px;border-radius:50%;background:var(--apricot);font-style:normal;color:var(--ink)}
h1,h2,h3{color:var(--ink);margin-top:0;line-height:1.25}
h1{font-size:44px;font-weight:800;max-width:740px;margin:14px 0 15px}
h2{font-size:30px;font-weight:800}
h3{font-size:20px;font-weight:700}
.lead{max-width:760px;color:#51484a;font-size:17px}
.head-side{display:flex;justify-content:flex-end;align-items:center;height:100%}
.stack-visual{width:230px;height:170px;position:relative}
.stack-visual span{position:absolute;display:block;border:1px solid var(--wine);background:var(--cream);width:155px;height:112px;padding:16px;box-shadow:var(--shadow);clip-path:polygon(0 0,100% 0,100% 87%,87% 100%,0 100%)}
.stack-visual span:nth-child(1){right:2px;top:2px;transform:rotate(7deg);background:#f1d7ca}
.stack-visual span:nth-child(2){left:12px;top:28px;transform:rotate(-6deg)}
.stack-visual span:nth-child(3){left:35px;top:50px;transform:rotate(2deg);background:var(--ink);color:#f7e9de}
.stack-visual b{font-size:27px;color:var(--apricot);display:block}
.statuses{display:flex;gap:8px;flex-wrap:wrap;margin-top:22px}
.chip{display:inline-block;padding:3px 10px;background:#ead1c4;color:var(--wine);font-size:12px;font-weight:700;border:1px solid rgba(93,41,72,.12)}
.chip.sage{background:#dce3dc;color:#435447}
.section{padding:74px 0}
.section-title{display:flex;align-items:flex-start;gap:14px;margin-bottom:26px}
.section-title .number{display:grid;place-items:center;flex:0 0 34px;height:34px;border-radius:50%;background:var(--apricot);color:var(--wine);font-weight:800}
.section-title h2{margin:0}
.section-title p{color:var(--muted);margin:6px 0 0}
.filterbar{background:var(--cream);border:1px solid var(--line);padding:18px;box-shadow:0 5px 16px rgba(43,34,38,.05)}
.filterbar label,.searchbox label{display:block;font-size:12px;font-weight:800;color:var(--wine);margin-bottom:5px}
.filter-input{height:44px;margin:0;border:1px solid #a89a94;background:#fffaf4;padding:0 12px}
.filter-input:focus{border-color:var(--wine);box-shadow:0 0 0 3px rgba(120,134,122,.3)}
.filter-tags{display:flex;gap:8px;align-items:center;flex-wrap:wrap;height:100%}
.filter-tag{padding:7px 13px;border:1px solid var(--line);background:#f7f1eb;color:var(--muted);font-size:13px;border-radius:6px;transition:.18s}
.filter-tag:hover,.filter-tag.active{background:var(--apricot);border-color:var(--apricot);color:var(--ink)}
.route{position:relative;margin:26px 0 0;padding:10px 0 30px;display:flex;gap:0}
.route:before{content:"";position:absolute;left:4%;right:4%;top:32px;height:2px;background:var(--line)}
.route-node{position:relative;flex:1;text-align:center}
.route-dot{position:relative;z-index:1;display:inline-grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--paper);border:2px solid var(--wine);color:var(--wine);font-weight:800}
.route-node.active .route-dot{background:var(--wine);color:#fffaf4}
.route-node strong{display:block;margin-top:10px;font-size:14px}
.route-node small{display:block;color:var(--muted);font-size:12px}
.track-card{position:relative;display:flex;gap:24px;padding:24px;margin:0 0 22px;background:var(--cream);border:1px solid var(--line);box-shadow:var(--shadow);clip-path:polygon(0 0,100% 0,100% 93%,96% 100%,0 100%);transition:.2s ease-out}
.track-card:hover{transform:translateY(-4px);border-color:var(--apricot);box-shadow:0 13px 30px rgba(43,34,38,.14)}
.track-card.featured{padding:28px;background:#f3ddd2}
.card-cover{width:190px;min-width:190px;min-height:145px;position:relative;overflow:hidden;background:linear-gradient(135deg,#6a3b55,#2d2829 62%,#d6a891);border:1px solid rgba(93,41,72,.4);clip-path:polygon(0 0,92% 0,100% 13%,100% 100%,0 100%)}
.card-cover:before{content:"";position:absolute;inset:18px;border:1px solid rgba(255,250,244,.35);transform:rotate(-7deg)}
.card-cover:after{content:"";position:absolute;width:90px;height:90px;right:-22px;bottom:-25px;border:1px solid rgba(255,250,244,.35);border-radius:50%}
.cover-mark{position:absolute;left:14px;bottom:11px;color:#fff8f0;font-size:12px;letter-spacing:.12em}
.track-content{flex:1}
.track-meta{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:7px}
.track-content h3{margin:5px 0 7px}
.track-content p{color:var(--muted);font-size:14px;margin:0 0 13px;max-width:620px}
.update{color:var(--sage);font-size:12px;font-weight:800}
.tip-card{margin:8px 0 25px;padding:18px 22px;background:var(--apricot);border-left:5px solid var(--wine);color:var(--ink)}
.tip-card strong{color:var(--wine)}
.tip-card p{margin:3px 0 0;font-size:14px}
.searchbox{padding:27px;background:var(--ink);color:#fff6ee;margin-top:35px}
.searchbox h2{color:#fff6ee;font-size:25px;margin-bottom:6px}
.searchbox p{color:#d7c9c1;font-size:14px;margin-top:0}
.searchbox .filter-input{background:#fffaf4}
.search-actions{display:flex;gap:10px;align-items:end}
.index-links{padding:23px;background:#e7e0d9;border:1px solid var(--line);margin-top:25px}
.index-links h3{margin-bottom:10px}
.index-links a{display:block;padding:9px 0;border-bottom:1px solid var(--line);color:var(--wine);font-size:14px}
.index-links a:last-child{border:0}
.index-links a:hover{padding-left:5px;color:var(--wine2)}
.accordion{background:transparent}
.accordion-item{margin-bottom:10px;border:1px solid var(--line);background:var(--cream)}
.accordion-title{color:var(--ink);font-weight:700;font-size:16px}
.accordion-title:hover,.accordion-title:focus{background:#f3ddd2;color:var(--wine)}
.accordion-content{background:#fffaf4;color:var(--muted);font-size:14px}
.cta{padding:62px 0;background:var(--wine);color:#fff7f0}
.cta h2{color:#fff7f0;margin-bottom:10px}
.cta p{color:#ead8cf;max-width:680px}
.cta .btn{background:var(--apricot);color:var(--ink);border-color:var(--apricot)}
.cta .btn:hover{background:#f0c9b1}
.cta .btn.alt{color:#fff7f0;border-color:#d9b9ad}
.cta-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}
.foot{padding:55px 0 20px;background:var(--ink);color:#eee4d9}
.foot h3{color:#fff7f0;font-size:18px}
.foot p,.foot a{color:#cbbeb5;font-size:14px}
.foot a:hover{color:var(--apricot)}
.footer-brand{font-size:19px;font-weight:800;color:#fff7f0}
.footer-brand:before{content:"◆";color:var(--apricot);font-size:13px;margin-right:8px}
.footer-links{list-style:none;margin:0;padding:0}
.footer-links li{margin-bottom:7px}
.copyright{margin-top:34px;padding-top:20px;border-top:1px solid #5d5558;color:#aa9d96;font-size:13px}
.mobile-bar{display:none}
@media(max-width:1023px){
  h1{font-size:39px}.navwrap{gap:16px}.navlinks{gap:14px}
  .head-side{justify-content:flex-start;margin-top:25px}.section{padding:62px 0}
}
@media(max-width:639px){
  .topbar{height:34px;font-size:11px}.topbar span:nth-child(2){display:none}
  .navwrap{min-height:62px;gap:10px}.brand{font-size:15px}.navlinks{overflow-x:auto;gap:16px}
  .navlinks a{padding:19px 0 15px;white-space:nowrap;font-size:13px}.navcta{display:none}
  h1{font-size:31px}.page-head{padding:48px 0 38px}.lead{font-size:15px}
  .section{padding:52px 0}.route{display:block;margin-left:12px;padding:0 0 0 27px}
  .route:before{left:21px;right:auto;top:21px;bottom:21px;width:2px;height:auto}
  .route-node{display:flex;text-align:left;align-items:center;gap:12px;margin-bottom:18px}
  .route-dot{flex:0 0 42px}.route-node strong{margin:0}.route-node small{margin-left:auto}
  .track-card,.track-card.featured{display:block;padding:18px}.card-cover{width:100%;min-width:0;height:145px;min-height:0;margin-bottom:18px}
  .filter-tags{margin-top:15px}.search-actions{display:block}.search-actions .btn{width:100%;margin-top:10px}
  .mobile-bar{display:flex;position:fixed;bottom:0;left:0;right:0;z-index:40;padding:9px 14px;background:var(--ink);gap:10px}
  .mobile-bar .btn{flex:1;min-height:42px}.mobile-bar a:last-child{display:flex;align-items:center;color:#f3ddd2;font-size:13px}
}

/* roulang page: category1 */
:root{
  --paper:#f2eee8;
  --ink:#292426;
  --muted:#6d6464;
  --wine:#5d2948;
  --wine2:#431b34;
  --apricot:#e4b59b;
  --sage:#78867a;
  --line:#cfc4bc;
  --cream:#fffaf4;
  --soft:#ebe4dd;
  --brick:#9a584c;
  --shadow:0 10px 28px rgba(43,34,38,.10);
  --shadow-hover:0 14px 30px rgba(43,34,38,.15);
  --r:14px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:"PingFang SC","Microsoft YaHei","Noto Sans SC",Arial,sans-serif;
  font-size:16px;
  line-height:1.75;
}
body:before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-2;
  opacity:.32;
  background-image:radial-gradient(rgba(93,41,72,.12) .65px,transparent .65px);
  background-size:9px 9px;
  pointer-events:none;
}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button,input{font:inherit}
button{border:0}
.grid-container{max-width:1200px}
.skip-link{
  position:absolute;
  left:12px;
  top:-60px;
  z-index:100;
  padding:8px 13px;
  background:var(--wine);
  color:#fff;
  border-radius:0 0 8px 8px;
}
.skip-link:focus{top:0}
.topbar{
  height:36px;
  background:var(--ink);
  color:#eee4d9;
  font-size:13px;
}
.topbar .grid-container{
  height:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}
.topbar span:nth-child(2){color:#cfc4bc}
.topbar a{
  color:#f4d8c8;
  font-weight:700;
  border-bottom:1px solid transparent;
}
.topbar a:hover{border-color:var(--apricot)}
.site-head{
  position:sticky;
  top:0;
  z-index:30;
  background:rgba(242,238,232,.98);
  border-bottom:1px solid var(--line);
}
.navwrap{
  min-height:76px;
  display:flex;
  align-items:center;
  gap:28px;
}
.brand{
  font-size:18px;
  font-weight:800;
  white-space:nowrap;
  color:var(--wine);
  letter-spacing:-.03em;
}
.brand:before{
  content:"";
  display:inline-block;
  width:17px;
  height:17px;
  margin-right:8px;
  vertical-align:-2px;
  background:var(--wine);
  clip-path:polygon(0 0,100% 0,100% 72%,72% 100%,0 100%);
  box-shadow:5px 5px 0 var(--apricot);
}
.navlinks{
  display:flex;
  gap:22px;
  align-items:stretch;
  flex:1;
}
.navlinks a{
  padding:25px 2px 20px;
  font-size:15px;
  border-bottom:3px solid transparent;
  transition:.18s ease-out;
}
.navlinks a:hover,.navlinks a.active{
  color:var(--wine);
  border-color:var(--wine);
}
.navcta,.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:46px;
  padding:0 18px;
  border:1px solid var(--wine);
  border-radius:8px;
  background:var(--wine);
  color:#fffaf4;
  font-weight:700;
  cursor:pointer;
  transition:.18s ease-out;
}
.navcta:hover,.btn:hover{
  background:var(--wine2);
  box-shadow:inset 0 0 0 1px var(--apricot);
  transform:translateY(-2px);
}
.btn.alt{
  background:transparent;
  color:var(--wine);
}
.btn.alt:hover{background:var(--apricot);color:var(--ink)}
.btn.small{min-height:40px;padding:0 14px;font-size:14px}
.btn[disabled]{opacity:.48;cursor:not-allowed;transform:none}
a:focus-visible,button:focus-visible,input:focus-visible{
  outline:3px solid var(--sage);
  outline-offset:3px;
}
.page-hero{
  position:relative;
  overflow:hidden;
  padding:54px 0 48px;
  background:linear-gradient(105deg,#e7d4c8 0%,var(--paper) 55%,#ebdce1 100%);
  border-bottom:1px solid var(--line);
}
.page-hero:before{
  content:"02";
  position:absolute;
  right:6%;
  top:-82px;
  color:rgba(93,41,72,.075);
  font-size:230px;
  line-height:1;
  font-weight:800;
}
.breadcrumb{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
  margin-bottom:18px;
  color:var(--muted);
  font-size:13px;
}
.breadcrumb a{color:var(--wine);font-weight:700}
.breadcrumb span:last-child{color:var(--muted)}
.hero-copy{position:relative;z-index:1}
.hero-copy h1{
  max-width:730px;
  margin:0 0 14px;
  color:var(--ink);
  font-size:43px;
  line-height:1.18;
  letter-spacing:-.05em;
  font-weight:800;
}
.hero-copy p{
  max-width:700px;
  margin:0;
  color:#51484a;
  font-size:16px;
}
.hero-tags{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-top:21px;
}
.chip,.status,.tag{
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-height:27px;
  padding:3px 9px;
  border:1px solid rgba(93,41,72,.18);
  background:#ead1c4;
  color:var(--wine);
  font-size:12px;
  font-weight:800;
  line-height:1.25;
}
.status:before{
  content:"";
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--sage);
}
.status{background:#e1e7de;color:#405044;border-color:#bdc9b9}
.hero-stack{
  position:relative;
  height:215px;
  margin-top:7px;
}
.stack-card{
  position:absolute;
  width:235px;
  height:154px;
  padding:18px;
  border:1px solid rgba(41,36,38,.25);
  background:var(--cream);
  box-shadow:var(--shadow);
  clip-path:polygon(0 0,100% 0,100% 86%,88% 100%,0 100%);
}
.stack-card.back{
  top:35px;
  right:37px;
  background:#d7b7c3;
  transform:rotate(7deg);
}
.stack-card.mid{
  top:17px;
  right:13px;
  background:#e8c7b7;
  transform:rotate(2deg);
}
.stack-card.front{
  top:0;
  right:0;
  background:#fffaf4;
}
.stack-mini{
  display:flex;
  align-items:center;
  justify-content:space-between;
  color:var(--wine);
  font-size:12px;
  font-weight:800;
}
.stack-lines{margin-top:18px}
.stack-lines span{
  display:block;
  height:8px;
  margin-bottom:9px;
  background:#ddd2ca;
}
.stack-lines span:nth-child(1){width:76%;background:var(--wine)}
.stack-lines span:nth-child(2){width:92%}
.stack-lines span:nth-child(3){width:58%}
.section{padding:80px 0;position:relative}
.section-title{margin-bottom:28px}
.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:var(--wine);
  font-size:13px;
  font-weight:800;
  letter-spacing:.08em;
}
.eyebrow i{
  display:inline-grid;
  place-items:center;
  width:25px;
  height:25px;
  border-radius:50%;
  background:var(--apricot);
  color:var(--ink);
  font-size:12px;
  font-style:normal;
}
.section-title h2{
  margin:10px 0 8px;
  font-size:30px;
  line-height:1.25;
  font-weight:800;
  letter-spacing:-.04em;
}
.section-title p{max-width:700px;margin:0;color:var(--muted)}
.filter-bar{
  display:flex;
  align-items:center;
  gap:11px;
  padding:15px;
  margin-top:-28px;
  background:var(--cream);
  border:1px solid var(--line);
  box-shadow:0 8px 20px rgba(43,34,38,.06);
}
.filter-label{
  color:var(--muted);
  font-size:13px;
  white-space:nowrap;
}
.filter-links{
  display:flex;
  gap:8px;
  flex:1;
  overflow-x:auto;
  scrollbar-width:thin;
}
.filter-links button{
  flex:0 0 auto;
  min-height:35px;
  padding:0 11px;
  background:transparent;
  border:1px solid var(--line);
  color:var(--ink);
  cursor:pointer;
  font-size:13px;
  transition:.18s ease-out;
}
.filter-links button:hover,.filter-links button.active{
  border-color:var(--wine);
  background:#f1d8ca;
  color:var(--wine);
}
.filter-search{
  display:flex;
  align-items:center;
  min-width:215px;
  height:38px;
  padding:0 10px;
  border:1px solid var(--line);
  background:#fffaf4;
}
.filter-search input{
  width:100%;
  height:100%;
  margin:0;
  padding:0;
  border:0;
  background:transparent;
  font-size:13px;
  outline:0;
}
.filter-search:focus-within{
  border-color:var(--wine);
  box-shadow:0 0 0 3px rgba(120,134,122,.28);
}
.content-grid{margin-top:34px}
.content-list{padding-right:14px}
.browse-card{
  display:flex;
  gap:24px;
  margin-bottom:18px;
  padding:19px;
  background:var(--cream);
  border:1px solid var(--line);
  box-shadow:0 6px 16px rgba(43,34,38,.055);
  clip-path:polygon(0 0,100% 0,100% 94%,97% 100%,0 100%);
  transition:.2s ease-out;
}
.browse-card:hover{
  transform:translateY(-4px);
  border-color:var(--wine);
  box-shadow:var(--shadow-hover);
}
.cover{
  position:relative;
  flex:0 0 210px;
  min-height:157px;
  overflow:hidden;
  background:#44373c;
  clip-path:polygon(0 0,100% 0,100% 85%,86% 100%,0 100%);
}
.cover:before,.cover:after{
  content:"";
  position:absolute;
  border:1px solid rgba(255,250,244,.37);
}
.cover:before{
  width:130px;
  height:130px;
  top:17px;
  left:39px;
  border-radius:50%;
}
.cover:after{
  width:185px;
  height:92px;
  bottom:-22px;
  left:11px;
  transform:rotate(-11deg);
  background:rgba(228,181,155,.24);
}
.cover.c2{background:#5d2948}
.cover.c2:before{left:28px;border-radius:0;transform:rotate(45deg);background:rgba(228,181,155,.16)}
.cover.c2:after{background:rgba(242,238,232,.12);transform:rotate(12deg)}
.cover.c3{background:#667067}
.cover.c3:before{border-radius:50% 50% 0 0;left:45px;background:rgba(255,250,244,.11)}
.cover.c3:after{background:rgba(93,41,72,.25)}
.cover.c4{background:#795a63}
.cover.c4:before{width:110px;height:110px;left:49px;top:24px;background:rgba(242,238,232,.12)}
.cover-number{
  position:absolute;
  z-index:2;
  top:12px;
  left:13px;
  color:#fff7f0;
  font-size:13px;
  font-weight:800;
  letter-spacing:.08em;
}
.cover-caption{
  position:absolute;
  z-index:2;
  bottom:10px;
  left:13px;
  color:#f7e7dc;
  font-size:11px;
  letter-spacing:.08em;
}
.card-copy{display:flex;flex-direction:column;align-items:flex-start;min-width:0}
.card-meta{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
  margin-bottom:9px;
}
.card-copy h3{
  margin:0 0 8px;
  font-size:21px;
  line-height:1.35;
  font-weight:800;
}
.card-copy p{
  margin:0 0 14px;
  color:var(--muted);
  font-size:14px;
  line-height:1.72;
}
.read-link{
  margin-top:auto;
  color:var(--wine);
  font-size:14px;
  font-weight:800;
  border-bottom:1px solid currentColor;
  transition:.18s ease-out;
}
.read-link:hover{color:var(--wine2);padding-left:4px}
.notice-strip{
  display:flex;
  align-items:flex-start;
  gap:14px;
  margin:22px 0;
  padding:17px 20px;
  border-left:5px solid var(--sage);
  background:#e3e8df;
  color:#405044;
}
.notice-strip b{white-space:nowrap}
.notice-strip p{margin:0;font-size:14px;line-height:1.65}
.sidebar{padding-left:14px}
.side-card{
  margin-bottom:18px;
  padding:23px;
  background:#ece5de;
  border:1px solid var(--line);
  box-shadow:0 5px 13px rgba(43,34,38,.04);
  clip-path:polygon(0 0,100% 0,100% 93%,94% 100%,0 100%);
}
.side-card.dark{background:var(--ink);border-color:var(--ink);color:#f8ede6}
.side-card h3{
  margin:0 0 14px;
  font-size:17px;
  line-height:1.4;
  font-weight:800;
}
.side-card p{margin:0;color:var(--muted);font-size:14px;line-height:1.7}
.side-card.dark p{color:#d9cbc3}
.tag-cloud{display:flex;flex-wrap:wrap;gap:8px}
.tag-cloud a{
  padding:4px 8px;
  border-bottom:1px solid rgba(93,41,72,.35);
  color:var(--wine);
  font-size:13px;
  transition:.18s ease-out;
}
.tag-cloud a:hover{background:var(--apricot);color:var(--wine2)}
.tag-cloud a:nth-child(2n){font-size:15px;font-weight:700}
.update-list{list-style:none;margin:0;padding:0}
.update-list li{
  padding:12px 0;
  border-bottom:1px solid rgba(41,36,38,.14);
}
.update-list li:last-child{border-bottom:0}
.update-list small{display:block;color:var(--wine);font-weight:800}
.update-list a{font-size:14px;line-height:1.45}
.update-list a:hover{color:var(--wine)}
.rule-dot{
  display:inline-grid;
  place-items:center;
  width:25px;
  height:25px;
  margin-right:8px;
  border-radius:50%;
  background:var(--sage);
  color:#fff;
  font-size:13px;
}
.pagination{
  display:flex;
  gap:7px;
  justify-content:center;
  margin-top:34px;
}
.pagination a,.pagination span{
  display:inline-grid;
  place-items:center;
  min-width:38px;
  height:38px;
  border:1px solid var(--line);
  background:var(--cream);
  color:var(--ink);
  font-size:14px;
  font-weight:700;
}
.pagination a:hover{background:var(--apricot);border-color:var(--wine)}
.pagination .current{background:var(--wine);border-color:var(--wine);color:#fff}
.pagination .disabled{opacity:.45;cursor:not-allowed}
.faq-area{padding-top:12px}
.faq-summary{
  display:block;
  height:100%;
  padding:20px;
  border:1px solid var(--line);
  background:var(--cream);
  transition:.18s ease-out;
}
.faq-summary:hover{border-color:var(--wine);transform:translateY(-2px)}
.faq-summary h3{margin:0 0 8px;font-size:17px;line-height:1.45}
.faq-summary p{margin:0;color:var(--muted);font-size:14px;line-height:1.7}
.faq-summary span{display:inline-block;margin-top:12px;color:var(--wine);font-size:13px;font-weight:800}
.cta{
  position:relative;
  overflow:hidden;
  padding:57px 0;
  background:var(--wine);
  color:#fff7f0;
}
.cta:before{
  content:"";
  position:absolute;
  width:300px;
  height:300px;
  right:8%;
  top:-170px;
  border:1px solid rgba(255,250,244,.17);
  border-radius:50%;
}
.cta h2{
  margin:0 0 10px;
  font-size:31px;
  line-height:1.25;
  font-weight:800;
}
.cta p{max-width:700px;margin:0;color:#ead8cf}
.cta .btn{background:var(--apricot);border-color:var(--apricot);color:var(--ink)}
.cta .btn:hover{background:#f0c9b1}
.cta .btn.alt{background:transparent;border-color:#d9b9ad;color:#fff7f0}
.cta .btn.alt:hover{background:rgba(255,255,255,.1)}
.cta-actions{display:flex;gap:11px;flex-wrap:wrap;justify-content:flex-end}
.cta-rule{margin-top:15px;color:#dfc6ba;font-size:13px}
.foot{
  padding:54px 0 28px;
  background:var(--ink);
  color:#eee4d9;
  border-top:1px solid #554d50;
}
.foot-brand{
  margin:0 0 10px;
  color:#fff7f0;
  font-size:19px;
  font-weight:800;
}
.foot p,.foot a{color:#cbbeb5;font-size:14px}
.foot a{display:inline-block;margin-bottom:7px}
.foot a:hover{color:var(--apricot)}
.foot h3{margin:0 0 12px;color:#f3ddd2;font-size:14px;font-weight:800}
.footer-note{
  display:inline-block;
  padding:5px 9px;
  background:#3c3638;
  color:#d8c9bf;
  font-size:12px;
}
.copyright{
  margin-top:34px;
  padding-top:20px;
  border-top:1px solid #5d5558;
  color:#aa9d96;
  font-size:13px;
}
.mobile-bar{display:none}
@media(max-width:1023px){
  .navwrap{gap:14px}
  .navlinks{gap:14px}
  .hero-copy h1{font-size:38px}
  .content-list,.sidebar{padding:0}
  .sidebar{margin-top:20px}
  .filter-search{min-width:170px}
  .section{padding:68px 0}
}
@media(max-width:639px){
  body{font-size:15px;padding-bottom:65px}
  .topbar span:nth-child(2){display:none}
  .topbar .grid-container{padding:0 14px}
  .navwrap{min-height:62px;gap:10px;padding:0 14px}
  .brand{font-size:15px}
  .brand:before{width:14px;height:14px;margin-right:6px}
  .navlinks{gap:16px;overflow-x:auto}
  .navlinks a{padding:19px 0 15px;white-space:nowrap;font-size:13px}
  .navcta{display:none}
  .page-hero{padding:38px 0 35px}
  .page-hero:before{font-size:160px;right:-2%;top:-45px}
  .hero-copy h1{font-size:30px;line-height:1.22}
  .hero-copy p{font-size:15px}
  .hero-stack{height:168px;margin-top:23px}
  .stack-card{width:190px;height:129px;padding:14px}
  .stack-card.back{right:38px;top:29px}
  .stack-card.mid{right:13px;top:13px}
  .stack-lines{margin-top:13px}
  .section{padding:55px 0}
  .section-title h2{font-size:26px}
  .filter-bar{align-items:stretch;flex-direction:column;margin-top:-16px;padding:12px}
  .filter-links{padding-bottom:2px}
  .filter-search{width:100%;min-width:0}
  .content-grid{margin-top:26px}
  .browse-card{gap:16px;flex-direction:column;padding:15px}
  .cover{width:100%;min-height:160px;flex-basis:auto}
  .card-copy h3{font-size:19px}
  .notice-strip{padding:15px;gap:9px;flex-direction:column}
  .sidebar{margin-top:24px}
  .side-card{padding:19px}
  .cta{padding:49px 0}
  .cta h2{font-size:26px}
  .cta-actions{justify-content:flex-start;margin-top:22px}
  .mobile-bar{
    display:flex;
    position:fixed;
    bottom:0;
    left:0;
    right:0;
    z-index:45;
    gap:10px;
    padding:9px 14px;
    background:var(--ink);
    box-shadow:0 -4px 16px rgba(0,0,0,.12);
  }
  .mobile-bar .btn{flex:1;min-height:42px}
  .mobile-bar a:last-child{
    display:flex;
    align-items:center;
    color:#f3ddd2;
    font-size:13px;
    white-space:nowrap;
  }
}
