/* roulang page: index */
:root{
      --paper:#f5f1ea;
      --panel:#ece5da;
      --paper-deep:#e3dbcf;
      --ink:#282620;
      --brown:#453b31;
      --muted:#716c62;
      --olive:#6f7562;
      --terracotta:#b96843;
      --line:#d4ccbf;
      --white:#fffdf9;
      --radius:16px;
      --shadow:0 16px 40px rgba(69,59,49,.10);
      --content:1240px;
    }
    *{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.82;letter-spacing:.01em;
    }
    body:before{
      content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.24;
      background-image:radial-gradient(rgba(69,59,49,.16) .55px,transparent .7px);
      background-size:8px 8px;
    }
    a{color:inherit;text-decoration:none;transition:color .22s ease}
    img{display:block;max-width:100%}
    button,input,textarea,select{font:inherit}
    button{cursor:pointer}
    :focus-visible{outline:2px solid var(--terracotta);outline-offset:4px}
    .grid-container{max-width:var(--content);padding-left:28px;padding-right:28px}
    .site-header{
      position:sticky;top:0;z-index:20;background:rgba(245,241,234,.96);
      border-bottom:1px solid rgba(212,204,191,.88);
    }
    .nav-shell{height:82px;display:flex;align-items:center;justify-content:space-between;gap:30px}
    .brand{
      color:var(--brown);font-weight:800;font-size:18px;letter-spacing:.02em;
      white-space:nowrap;
    }
    .brand-mark{display:inline-block;width:10px;height:10px;margin-right:9px;background:var(--terracotta);vertical-align:middle}
    .desktop-nav{display:flex;align-items:center;gap:31px}
    .desktop-nav a,.mobile-menu a{
      position:relative;color:var(--muted);font-size:14px;font-weight:650;padding:8px 0;
    }
    .desktop-nav a:hover,.desktop-nav a.active{color:var(--brown)}
    .desktop-nav a.active:after{
      content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--terracotta);
    }
    .nav-action,.button-main,.button-plain{
      display:inline-flex;align-items:center;justify-content:center;gap:9px;
      min-height:45px;border:1px solid transparent;border-radius:999px;
      font-size:14px;font-weight:700;transition:transform .22s ease,background .22s ease,color .22s ease,border-color .22s ease;
    }
    .nav-action{padding:0 18px;background:var(--brown);color:var(--white)}
    .nav-action:hover,.button-main:hover{background:#2f2822;color:#fff;transform:translateY(-2px)}
    .mobile-toggle{
      display:none;border:0;background:transparent;color:var(--brown);padding:10px;font-size:24px;line-height:1;
    }
    .mobile-menu{display:none;border-top:1px solid var(--line);padding:12px 28px 22px}
    .mobile-menu a{display:block;padding:13px 0;border-bottom:1px solid var(--line)}
    .mobile-note{display:block;color:var(--muted);font-size:12px;padding-top:16px}
    .hero{padding:74px 0 58px}
    .hero-grid{align-items:stretch}
    .hero-copy{padding:40px 5% 42px 0;display:flex;flex-direction:column;justify-content:center}
    .eyebrow,.section-kicker{
      color:var(--olive);font-size:12px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;
    }
    h1,h2,h3,p{margin-top:0}
    h1{
      max-width:690px;margin:16px 0 25px;color:var(--brown);font-size:clamp(43px,5.1vw,70px);
      line-height:1.12;letter-spacing:-.05em;font-weight:850;
    }
    h2{color:var(--brown);font-size:clamp(30px,3.5vw,44px);line-height:1.18;letter-spacing:-.035em;font-weight:800;margin-bottom:18px}
    h3{font-size:21px;line-height:1.35;color:var(--brown);font-weight:780}
    .hero-copy p{max-width:610px;color:var(--muted);font-size:16px;line-height:1.95;margin-bottom:28px}
    .hero-actions{display:flex;flex-wrap:wrap;gap:12px}
    .button-main{background:var(--terracotta);color:#fff;padding:0 22px}
    .button-plain{background:transparent;border-color:var(--brown);color:var(--brown);padding:0 22px}
    .button-plain:hover{color:var(--white);background:var(--brown);transform:translateY(-2px)}
    .arrow{font-size:20px;line-height:1;transition:transform .2s ease}
    a:hover .arrow,button:hover .arrow{transform:translateX(4px)}
    .hero-art{
      min-height:520px;position:relative;overflow:hidden;border-radius:var(--radius);
      background:linear-gradient(145deg,#5b4b3d 0%,#342d27 47%,#737562 100%);
    }
    .hero-art:before{
      content:"";position:absolute;inset:0;opacity:.8;
      background:
        linear-gradient(90deg,transparent 0 31%,rgba(245,241,234,.13) 31% 32%,transparent 32%),
        radial-gradient(ellipse at 72% 25%,rgba(225,190,143,.42),transparent 32%),
        linear-gradient(135deg,transparent 45%,rgba(255,255,255,.13) 45% 46%,transparent 46%);
    }
    .hero-art:after{
      content:"";position:absolute;right:12%;bottom:-7%;width:47%;height:80%;
      border-radius:48% 48% 0 0;background:rgba(236,229,218,.35);
      box-shadow:-85px 54px 0 rgba(185,104,67,.23);
    }
    .art-caption{
      position:absolute;z-index:2;left:26px;bottom:26px;right:26px;padding:17px 18px;
      background:rgba(245,241,234,.93);border-left:3px solid var(--terracotta);color:var(--brown);
    }
    .art-caption strong{display:block;font-size:14px;letter-spacing:.08em}
    .art-caption span{display:block;margin-top:3px;font-size:12px;color:var(--muted)}
    .hero-strip{margin-top:32px;padding:17px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
    .strip-items{display:flex;flex-wrap:wrap;gap:0}
    .strip-item{padding:0 27px;border-right:1px solid var(--line);font-size:13px;color:var(--muted)}
    .strip-item:first-child{padding-left:0}.strip-item:last-child{border:0}
    .section{padding:112px 0}
    .section-head{max-width:710px;margin-bottom:49px}
    .section-head p{color:var(--muted);margin:0;max-width:655px}
    .services{padding-top:58px}
    .service-grid{border-top:1px solid var(--line)}
    .service-item{min-height:246px;padding:27px 27px 24px 0;border-bottom:1px solid var(--line);position:relative}
    .service-item:nth-child(2),.service-item:nth-child(4){padding-left:27px;border-left:1px solid var(--line)}
    .service-item.featured{background:var(--olive);padding:27px;color:var(--white)}
    .service-num{display:block;color:var(--terracotta);font-size:12px;font-weight:800;letter-spacing:.12em;margin-bottom:38px}
    .featured .service-num,.featured h3,.featured p{color:var(--white)}
    .service-item h3{margin-bottom:9px}.service-item p{font-size:14px;color:var(--muted);line-height:1.75;margin:0;max-width:260px}
    .service-link{position:absolute;right:18px;bottom:18px;font-size:23px;color:var(--terracotta)}
    .featured .service-link{color:var(--white)}
    .stats{background:var(--panel);padding:96px 0}
    .stats-head{display:flex;justify-content:space-between;gap:30px;align-items:end;margin-bottom:47px}
    .stats-head p{color:var(--muted);max-width:460px;margin:0}
    .stat{min-height:152px;padding:0 28px;border-left:1px solid #c7bdae}
    .stat:first-child{padding-left:0;border-left:0}
    .stat-number{display:block;color:var(--brown);font-size:66px;font-weight:850;line-height:1;letter-spacing:-.07em}
    .stat-label{display:block;margin-top:15px;font-size:13px;color:var(--muted);line-height:1.6}
    .feature-layout{align-items:stretch}
    .feature-main{padding-right:20px}
    .feature-image{
      min-height:405px;position:relative;border-radius:var(--radius) var(--radius) 0 0;overflow:hidden;
      background:linear-gradient(135deg,#b96c48,#c99067 37%,#6e735f 37%,#4a4a3e 100%);
    }
    .feature-image:before{content:"";position:absolute;width:48%;height:130%;left:26%;top:-14%;background:rgba(245,241,234,.23);transform:rotate(29deg)}
    .feature-image:after{content:"";position:absolute;inset:24px;border:1px solid rgba(255,255,255,.52)}
    .feature-text{background:var(--brown);padding:30px 34px;color:var(--white)}
    .feature-text h3{color:var(--white);font-size:27px;margin-bottom:10px}.feature-text p{margin:0;color:#ded5c8;font-size:14px}
    .side-features{display:flex;flex-direction:column;gap:20px}
    .small-feature{border:1px solid var(--line);background:var(--white);padding:20px;flex:1;transition:transform .25s ease,border .25s ease,box-shadow .25s ease}
    .small-feature:hover{transform:translateY(-4px);border-color:#a99a87;box-shadow:var(--shadow)}
    .small-art{height:137px;margin-bottom:19px;background:linear-gradient(135deg,#d7c7b4,#858a75);position:relative;overflow:hidden}
    .small-art.two{background:linear-gradient(115deg,#8c7865,#d6a47d 55%,#f0e8db 55%)}
    .small-art:after{content:"";position:absolute;left:18%;top:-10%;height:130%;width:25%;background:rgba(255,255,255,.24);transform:rotate(25deg)}
    .tag{display:inline-block;font-size:11px;color:var(--olive);font-weight:800;letter-spacing:.08em;margin-bottom:9px}
    .small-feature h3{font-size:19px;margin-bottom:6px}.small-feature p{margin-bottom:10px;color:var(--muted);font-size:13px;line-height:1.65}
    .text-link{font-size:13px;font-weight:800;color:var(--brown)}
    .paths{background:var(--white)}
    .path-intro{padding-right:11%;position:relative}
    .path-no{display:block;font-size:104px;color:var(--panel);font-weight:850;line-height:.8;letter-spacing:-.08em;margin-bottom:27px}
    .path-intro p{color:var(--muted);max-width:400px;margin-bottom:27px}
    .path-list{border-top:1px solid var(--line)}
    .path-item{display:flex;align-items:center;gap:19px;padding:21px 16px;border-bottom:1px solid var(--line);transition:background .22s ease,padding .22s ease}
    .path-item:hover{background:var(--panel);padding-left:24px}
    .path-index{color:var(--terracotta);font-size:12px;font-weight:800}
    .path-body{flex:1}.path-body strong{display:block;color:var(--brown);font-size:16px}.path-body span{display:block;color:var(--muted);font-size:13px;margin-top:2px}
    .faq{background:var(--paper-deep)}
    .faq-wrap{max-width:850px;margin:auto}
    .accordion{margin:0;background:transparent}
    .accordion-item{border-bottom:1px solid #c9beaf;background:transparent}
    .accordion-title{
      position:relative;padding:22px 47px 22px 46px;border:0!important;background:transparent!important;
      color:var(--brown);font-size:17px;font-weight:760;line-height:1.5;
    }
    .accordion-title:before{content:"+"!important;right:17px!important;top:50%!important;transform:translateY(-50%);font-size:23px;color:var(--terracotta)}
    .is-active>.accordion-title:before{content:"−"!important}
    .faq-number{position:absolute;left:0;color:var(--terracotta);font-size:12px;letter-spacing:.1em}
    .accordion-content{border:0!important;background:transparent;color:var(--muted);padding:0 46px 22px;font-size:14px;line-height:1.85}
    .contact{padding:103px 0;background:var(--brown);color:var(--white)}
    .contact h2{color:var(--white)}.contact-copy{padding-right:10%}.contact-copy p{color:#d9cfc1;max-width:480px}
    .contact-points{margin-top:25px;padding-top:22px;border-top:1px solid rgba(255,255,255,.2);display:flex;gap:22px;flex-wrap:wrap;font-size:13px;color:#d9cfc1}
    .contact-form{padding:28px;background:#f1eadd;color:var(--ink);border-radius:var(--radius)}
    .form-row{margin-bottom:14px}.form-row label{display:block;color:var(--brown);font-size:13px;font-weight:750;margin-bottom:5px}
    input,textarea{width:100%;background:var(--white);border:1px solid #cfc3b3;border-radius:0;box-shadow:none;color:var(--ink);padding:11px 12px;font-size:14px}
    input:focus,textarea:focus{border-color:var(--terracotta);box-shadow:0 0 0 3px rgba(185,104,67,.13);outline:0}
    textarea{min-height:88px;resize:vertical}
    .checkline{display:flex;gap:9px;align-items:flex-start;color:var(--muted);font-size:12px;line-height:1.55;margin:15px 0}
    .checkline input{width:16px;height:16px;margin-top:2px;accent-color:var(--terracotta)}
    .form-note{min-height:20px;margin:12px 0 0;color:var(--olive);font-size:13px}
    .site-footer{background:#25211d;color:#d9d1c6;padding:51px 0 24px}
    .footer-top{display:flex;justify-content:space-between;align-items:flex-start;gap:35px;padding-bottom:39px;border-bottom:1px solid rgba(255,255,255,.15)}
    .footer-brand{color:var(--white);font-weight:800;font-size:18px}.footer-brand p{font-size:13px;font-weight:400;color:#bcb2a4;max-width:330px;margin:12px 0 0}
    .footer-links{display:flex;gap:23px;flex-wrap:wrap;padding-top:7px}.footer-links a{font-size:13px;color:#d9d1c6}.footer-links a:hover{color:#fff}
    .footer-bottom{padding-top:20px;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;font-size:12px;color:#a99f92}
    .fade-in{animation:rise .55s ease both}@keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
    @media(max-width:1024px){
      .hero-copy{padding-right:7%}.hero-art{min-height:470px}.feature-main{padding-right:10px}
      .stats-head{display:block}.stats-head p{margin-top:12px}.stat-number{font-size:54px}
    }
    @media(max-width:767px){
      .grid-container{padding-left:20px;padding-right:20px}.nav-shell{height:68px}.desktop-nav,.nav-action{display:none}.mobile-toggle{display:block}
      .mobile-menu.is-open{display:block}.hero{padding:43px 0 35px}.hero-copy{padding:0 0 28px}h1{font-size:40px;letter-spacing:-.055em;margin:13px 0 20px}
      .hero-copy p{font-size:15px;line-height:1.85}.hero-art{min-height:310px}.art-caption{left:17px;right:17px;bottom:17px}.hero-strip{margin-top:22px}.strip-item{padding:5px 14px;font-size:12px}.strip-item:first-child{padding-left:0}
      .section{padding:68px 0}.section-head{margin-bottom:32px}.services{padding-top:39px}.service-item,.service-item:nth-child(2),.service-item:nth-child(4){padding:22px 20px;border-left:0}.service-item{min-height:190px}
      .stats{padding:65px 0}.stat{min-height:122px;padding:16px 14px;border-left:1px solid #c7bdae}.stat:nth-child(odd){border-left:0}.stat-number{font-size:48px}
      .feature-main{padding:0 0 20px}.feature-image{min-height:286px}.feature-text{padding:24px}.side-features{gap:15px}.small-feature{padding:16px}.small-art{height:112px}
      .path-intro{padding:0;margin-bottom:34px}.path-no{font-size:79px}.faq-wrap{max-width:none}.accordion-title{padding:18px 36px 18px 36px;font-size:16px}.accordion-content{padding:0 35px 18px;font-size:13px}
      .contact{padding:67px 0}.contact-copy{padding:0;margin-bottom:34px}.footer-top{display:block}.footer-links{margin-top:26px;gap:16px}.footer-bottom{display:block}.footer-bottom span{display:block;margin-bottom:7px}
    }
    @media(max-width:520px){
      .hero-actions{display:grid;grid-template-columns:1fr}.button-main,.button-plain{width:100%}.hero-art{min-height:275px}.service-grid .cell{width:100%}.strip-items{display:block}.strip-item{display:block;border:0;padding:4px 0}.stat-number{font-size:43px}
    }
    @media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* roulang page: category1 */
:root{
 --paper:#f5f1ea;
 --panel:#ece5da;
 --paper-deep:#e3dbcf;
 --ink:#282620;
 --brown:#453b31;
 --muted:#716c62;
 --olive:#6f7562;
 --terracotta:#b96843;
 --line:#d4ccbf;
 --white:#fffdf9;
 --radius:16px;
 --shadow:0 16px 40px rgba(69,59,49,.10);
 --content:1240px;
}
*{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.82;letter-spacing:.01em;
}
body:before{
 content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.22;
 background-image:radial-gradient(rgba(69,59,49,.15) .55px,transparent .72px);
 background-size:8px 8px;
}
a{color:inherit;text-decoration:none;transition:color .22s ease}
img{display:block;max-width:100%}
button,input,textarea,select{font:inherit}
button{cursor:pointer}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{
 outline:2px solid var(--terracotta);outline-offset:3px;
}
.grid-container{max-width:var(--content);padding-left:28px;padding-right:28px}
.site-header{
 position:sticky;top:0;z-index:20;background:rgba(245,241,234,.96);
 border-bottom:1px solid rgba(212,204,191,.88);
}
.nav-shell{height:82px;display:flex;align-items:center;justify-content:space-between;gap:30px}
.brand{
 color:var(--brown);font-weight:800;font-size:18px;letter-spacing:.02em;
 white-space:nowrap;
}
.brand-mark{display:inline-block;width:10px;height:10px;margin-right:9px;background:var(--terracotta);vertical-align:middle}
.desktop-nav{display:flex;align-items:center;gap:31px}
.desktop-nav a,.mobile-menu a{
 position:relative;color:var(--muted);font-size:14px;font-weight:650;padding:8px 0;
}
.desktop-nav a:hover,.desktop-nav a.active{color:var(--brown)}
.desktop-nav a.active:after{
 content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--terracotta);
}
.nav-action,.button-main,.button-plain{
 display:inline-flex;align-items:center;justify-content:center;gap:9px;
 min-height:45px;border:1px solid transparent;border-radius:999px;
 font-size:14px;font-weight:700;transition:transform .22s ease,background .22s ease,color .22s ease,border-color .22s ease;
}
.nav-action{padding:0 18px;background:var(--brown);color:var(--white)}
.nav-action:hover,.button-main:hover{background:#2f2822;color:#fff;transform:translateY(-2px)}
.mobile-toggle{
 display:none;border:0;background:transparent;color:var(--brown);padding:10px;font-size:24px;line-height:1;
}
.mobile-menu{display:none;border-top:1px solid var(--line);padding:12px 28px 22px}
.mobile-menu a{display:block;padding:13px 0;border-bottom:1px solid var(--line)}
.mobile-note{display:block;color:var(--muted);font-size:12px;padding-top:16px}
.arrow{font-size:20px;line-height:1;transition:transform .2s ease}
a:hover .arrow,button:hover .arrow{transform:translateX(4px)}

.page-head{
 padding:58px 0 48px;position:relative;overflow:hidden;border-bottom:1px solid var(--line);
}
.page-head:after{
 content:"";position:absolute;right:4%;top:16px;width:29%;height:160px;opacity:.48;
 background:repeating-linear-gradient(90deg,transparent 0 20px,rgba(111,117,98,.19) 20px 21px);
 transform:skewX(-16deg);
}
.breadcrumb{
 display:flex;align-items:center;flex-wrap:wrap;gap:9px;color:var(--muted);
 font-size:13px;margin-bottom:30px;
}
.breadcrumb a:hover{color:var(--terracotta)}
.breadcrumb .sep{color:#aaa093}
.page-head-grid{position:relative;z-index:1;align-items:end}
.kicker{
 display:block;margin-bottom:15px;color:var(--olive);font-size:12px;font-weight:800;
 letter-spacing:.14em;text-transform:uppercase;
}
h1,h2,h3,p{margin-top:0}
h1{
 max-width:760px;margin-bottom:0;color:var(--brown);font-size:54px;line-height:1.16;
 letter-spacing:-.035em;font-weight:800;
}
.head-note{
 max-width:350px;margin:0 0 5px auto;padding:22px 0 0 24px;border-left:1px solid var(--terracotta);
 color:var(--muted);font-size:15px;line-height:1.85;
}
.filter-bar{padding:22px 0;border-bottom:1px solid var(--line)}
.filter-inner{display:flex;align-items:center;gap:13px;overflow-x:auto;padding-bottom:2px}
.filter-label{flex:none;color:var(--brown);font-size:13px;font-weight:800;margin-right:7px}
.filter-item{
 flex:none;padding:7px 13px;border:1px solid transparent;border-radius:999px;
 color:var(--muted);font-size:13px;font-weight:700;
}
.filter-item:hover{color:var(--brown);border-color:var(--line)}
.filter-item.active{background:var(--brown);border-color:var(--brown);color:var(--white)}
.directory-section{padding:74px 0 112px}
.directory-layout{align-items:start}
.directory-aside{padding-right:37px}
.aside-block{padding:0 0 27px;margin-bottom:28px;border-bottom:1px solid var(--line)}
.aside-block:last-child{border-bottom:0}
.aside-title{
 margin-bottom:13px;color:var(--brown);font-size:13px;font-weight:800;letter-spacing:.08em;
}
.aside-block p{margin:0;color:var(--muted);font-size:13px;line-height:1.85}
.aside-links{margin:0;padding:0;list-style:none}
.aside-links li{border-top:1px solid rgba(212,204,191,.72)}
.aside-links a{
 display:flex;align-items:center;justify-content:space-between;padding:10px 0;
 color:var(--muted);font-size:14px;
}
.aside-links a:hover{color:var(--terracotta);padding-left:4px}
.hot-tags{display:flex;flex-wrap:wrap;gap:8px}
.hot-tags a{
 border-bottom:1px solid var(--line);color:var(--olive);font-size:12px;font-weight:700;
}
.hot-tags a:hover{border-color:var(--terracotta);color:var(--terracotta)}
.directory-main{padding-left:20px;border-left:1px solid var(--line)}
.directory-intro{
 display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:30px;
}
.directory-intro h2{margin:0;color:var(--brown);font-size:31px;line-height:1.25;letter-spacing:-.025em}
.directory-intro span{flex:none;color:var(--muted);font-size:13px}
.feature-entry{
 position:relative;overflow:hidden;margin-bottom:13px;border:1px solid var(--line);
 background:var(--white);border-radius:var(--radius);transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;
}
.feature-entry:hover{transform:translateY(-4px);border-color:#a99a87;box-shadow:var(--shadow)}
.feature-image{
 min-height:238px;position:relative;padding:31px;display:flex;align-items:flex-end;overflow:hidden;
 background:linear-gradient(118deg,#6f7562 0%,#474940 43%,#a95f43 43%,#bc7955 100%);
}
.feature-image:before{
 content:"";position:absolute;inset:0;
 background:linear-gradient(90deg,transparent 0 53%,rgba(245,241,234,.20) 53% 54%,transparent 54%),
 radial-gradient(circle at 79% 26%,rgba(245,241,234,.35),transparent 25%);
}
.feature-image:after{
 content:"";position:absolute;width:250px;height:250px;right:12%;bottom:-96px;
 border:1px solid rgba(255,253,249,.68);border-radius:50%;
}
.feature-number{position:relative;z-index:1;color:#fff;font-size:14px;font-weight:800;letter-spacing:.13em}
.feature-copy{padding:26px 30px 28px;position:relative}
.entry-meta{display:flex;gap:10px;align-items:center;margin-bottom:10px}
.entry-tag{color:var(--olive);font-size:12px;font-weight:800;letter-spacing:.06em}
.entry-date{color:var(--muted);font-size:12px}
.feature-copy h3,.entry-copy h3{color:var(--brown);font-size:25px;line-height:1.35;letter-spacing:-.02em}
.feature-copy h3{margin-bottom:9px}
.feature-copy p{max-width:680px;margin:0;color:var(--muted);font-size:14px}
.entry-arrow{
 position:absolute;right:27px;bottom:28px;color:var(--terracotta);font-size:22px;font-weight:400;
}
.entry-list{border-top:1px solid var(--line)}
.directory-entry{
 position:relative;display:grid;grid-template-columns:70px minmax(0,1fr) 34px;gap:20px;
 padding:27px 5px;border-bottom:1px solid var(--line);transition:background .22s ease,padding .22s ease;
}
.directory-entry:hover{background:rgba(236,229,218,.62);padding-left:14px;padding-right:14px}
.entry-no{padding-top:3px;color:var(--terracotta);font-weight:800;font-size:14px;letter-spacing:.08em}
.entry-copy h3{font-size:20px;margin-bottom:7px}
.entry-copy p{margin:0;color:var(--muted);font-size:14px;line-height:1.75;max-width:710px}
.entry-go{align-self:center;color:var(--brown);font-size:22px;transition:transform .2s ease}
.directory-entry:hover .entry-go{color:var(--terracotta);transform:translateX(4px)}
.editorial-banner{
 margin:36px 0;padding:0;background:var(--panel);border-radius:var(--radius);overflow:hidden;
 display:grid;grid-template-columns:42% 58%;min-height:214px;
}
.banner-art{
 position:relative;background:linear-gradient(138deg,#453b31,#625342 55%,#8d927c 55%);
 overflow:hidden;
}
.banner-art:before{
 content:"";position:absolute;left:20%;top:-14%;height:136%;width:48%;
 background:rgba(245,241,234,.17);transform:rotate(23deg);
}
.banner-art:after{
 content:"";position:absolute;left:22px;right:22px;top:22px;bottom:22px;border:1px solid rgba(255,255,255,.42);
}
.banner-copy{padding:28px 32px;display:flex;flex-direction:column;justify-content:center}
.banner-copy .entry-tag{margin-bottom:9px}
.banner-copy h3{margin:0 0 8px;color:var(--brown);font-size:23px;line-height:1.36}
.banner-copy p{margin:0;color:var(--muted);font-size:14px}
.pagination{display:flex;align-items:center;gap:14px;margin-top:39px}
.pagination a,.pagination span{
 display:inline-flex;align-items:center;justify-content:center;min-width:38px;height:38px;
 color:var(--muted);font-size:14px;font-weight:700;
}
.pagination .current{border:1px solid var(--brown);border-radius:999px;color:var(--brown)}
.pagination a:hover{color:var(--terracotta)}
.cta-panel{
 padding:48px 0;background:var(--brown);color:var(--white);
}
.cta-panel h2{margin:0 0 12px;color:var(--white);font-size:34px;line-height:1.3;letter-spacing:-.03em}
.cta-panel p{max-width:630px;margin:0;color:#ddd4c8;font-size:15px}
.cta-panel .button-main{margin-top:22px;background:var(--terracotta)}
.cta-panel .button-main:hover{background:#d27c54}
.site-footer{padding:47px 0 25px;background:#322b25;color:#ddd4c8}
.footer-top{display:flex;justify-content:space-between;gap:34px;padding-bottom:37px;border-bottom:1px solid rgba(236,229,218,.18)}
.footer-brand{max-width:460px;color:var(--white);font-size:18px;font-weight:800}
.footer-brand p{margin:10px 0 0;color:#c9beb0;font-size:13px;font-weight:400;line-height:1.8}
.footer-links{display:flex;align-items:flex-start;flex-wrap:wrap;justify-content:flex-end;gap:12px 24px;padding-top:7px}
.footer-links a{color:#d8cec0;font-size:13px}
.footer-links a:hover{color:#fff}
.footer-bottom{display:flex;justify-content:space-between;gap:20px;padding-top:20px;color:#a99d8f;font-size:12px}
@media (max-width:1024px){
 h1{font-size:46px}
 .directory-aside{padding-right:22px}
 .directory-main{padding-left:24px}
}
@media (max-width:767px){
 .grid-container{padding-left:20px;padding-right:20px}
 .nav-shell{height:68px;gap:12px}
 .brand{font-size:15px}
 .desktop-nav,.nav-action{display:none}
 .mobile-toggle{display:block}
 .mobile-menu.open{display:block}
 .page-head{padding:38px 0 34px}
 .page-head:after{width:46%;right:-12%;top:25px}
 .breadcrumb{margin-bottom:19px}
 h1{font-size:37px;line-height:1.2}
 .head-note{max-width:none;margin:23px 0 0;padding:14px 0 0;border-left:0;border-top:1px solid var(--terracotta)}
 .filter-bar{padding:15px 0}
 .directory-section{padding:54px 0 70px}
 .directory-layout{display:flex;flex-direction:column}
 .directory-aside{width:100%;padding:0;margin-bottom:26px}
 .directory-main{width:100%;padding:0;border-left:0}
 .aside-block{margin-bottom:20px;padding-bottom:20px}
 .directory-intro{margin-bottom:22px}
 .directory-intro h2{font-size:27px}
 .feature-image{min-height:186px}
 .feature-copy{padding:22px}
 .feature-copy h3{font-size:22px;padding-right:23px}
 .entry-arrow{right:21px;bottom:23px}
 .directory-entry{grid-template-columns:43px minmax(0,1fr) 24px;gap:10px;padding:22px 0}
 .directory-entry:hover{padding-left:8px;padding-right:8px}
 .entry-copy h3{font-size:18px}
 .editorial-banner{grid-template-columns:1fr;margin:28px 0}
 .banner-art{min-height:118px}
 .banner-copy{padding:23px}
 .cta-panel{padding:42px 0}
 .cta-panel h2{font-size:29px}
 .footer-top,.footer-bottom{display:block}
 .footer-links{justify-content:flex-start;padding-top:26px}
 .footer-bottom span{display:block;margin-bottom:8px}
}
@media (max-width:520px){
 .brand-mark{width:8px;height:8px;margin-right:6px}
 .mobile-menu{padding-left:20px;padding-right:20px}
 h1{font-size:34px}
 .filter-inner{gap:6px}
 .filter-label{display:none}
 .filter-item{padding:6px 10px}
 .feature-copy p,.entry-copy p{font-size:13px}
 .entry-meta{gap:7px}
 .entry-date{font-size:11px}
}
@media (prefers-reduced-motion:reduce){
 *,*:before,*:after{scroll-behavior:auto!important;transition:none!important}
}
