/* roulang page: index */
:root{
      --ink:#263b35;
      --deep:#1f302b;
      --orange:#c85c36;
      --sand:#ede5d7;
      --paper:#f7f5f0;
      --cream:#f6f1e8;
      --text:#26312d;
      --muted:#6e7771;
      --line:#d9d6ce;
      --radius:12px;
      --shadow:0 12px 30px rgba(31,48,43,.09);
      --ease:all .25s ease;
    }
    *{box-sizing:border-box;margin:0;padding:0}
    html{scroll-behavior:smooth}
    body{font-family:"Microsoft YaHei","PingFang SC","Noto Sans SC",Arial,sans-serif;color:var(--text);background:var(--paper);line-height:1.8;font-size:16px}
    a{color:inherit;text-decoration:none}
    img{display:block;max-width:100%;object-fit:cover}
    button,input,textarea{font:inherit}
    button{cursor:pointer}
    :focus-visible{outline:3px solid rgba(200,92,54,.45);outline-offset:3px}
    .container{width:min(1200px,calc(100% - 96px));margin:auto}
    .notice{height:38px;background:var(--deep);color:rgba(246,241,232,.72);font-size:13px}
    .notice .container{height:100%;display:flex;align-items:center;justify-content:space-between}
    .notice a{color:var(--cream);border-bottom:1px solid rgba(246,241,232,.5)}
    header{position:relative;z-index:5;background:var(--ink);color:var(--cream)}
    .nav{height:78px;display:flex;align-items:center;gap:42px}
    .logo{font-weight:800;font-size:21px;letter-spacing:.03em;white-space:nowrap}
    .logo small{display:block;color:#d7b39f;font-size:10px;letter-spacing:.2em;line-height:1.2}
    .menu{display:flex;align-items:center;gap:30px;margin-left:auto}
    .menu a{height:78px;display:flex;align-items:center;position:relative;color:rgba(246,241,232,.72);font-size:15px}
    .menu a:hover,.menu a.active{color:var(--cream)}
    .menu a.active:after{content:"";position:absolute;bottom:19px;left:0;width:24px;height:3px;background:var(--orange)}
    .nav-action{padding:10px 17px;border:1px solid rgba(246,241,232,.35);color:var(--cream);font-size:14px;transition:var(--ease)}
    .nav-action:hover{background:var(--orange);border-color:var(--orange);color:#fff}
    .menu-toggle{display:none;background:none;border:0;color:var(--cream);font-size:24px}
    .hero{position:relative;overflow:hidden;background:var(--deep);color:var(--cream);min-height:615px}
    .hero:before{content:"";position:absolute;inset:0;opacity:.18;background-image:linear-gradient(rgba(246,241,232,.2) 1px,transparent 1px),linear-gradient(90deg,rgba(246,241,232,.2) 1px,transparent 1px);background-size:72px 72px;transform:skewY(-8deg) scale(1.2)}
    .hero .container{position:relative;display:grid;grid-template-columns:1.12fr .88fr;gap:66px;align-items:center;min-height:615px}
    .eyebrow,.section-kicker{color:var(--orange);font-size:13px;font-weight:700;letter-spacing:.16em;text-transform:uppercase}
    .hero h1{font-size:clamp(38px,5vw,58px);line-height:1.23;letter-spacing:-.04em;margin:20px 0 24px;max-width:620px}
    .hero p{max-width:600px;color:rgba(246,241,232,.75);font-size:17px;line-height:1.9}
    .actions{display:flex;gap:13px;margin-top:34px;flex-wrap:wrap}
    .btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 22px;border:1px solid transparent;border-radius:5px;font-size:15px;font-weight:700;transition:var(--ease)}
    .btn.primary{background:var(--orange);color:#fff}
    .btn.primary:hover{background:#a94c2d;transform:translateY(-2px)}
    .btn.ghost{border-color:rgba(246,241,232,.45);color:var(--cream)}
    .btn.ghost:hover{border-color:var(--orange);color:#fff;transform:translateY(-2px)}
    .hero-visual{height:445px;position:relative;background:url('/assets/images/backpic/back-1.webp') center/cover;border:1px solid rgba(246,241,232,.2)}
    .hero-visual:after{content:"";position:absolute;inset:0;background:linear-gradient(140deg,rgba(31,48,43,.18),rgba(31,48,43,.78))}
    .visual-label{position:absolute;z-index:1;background:rgba(246,241,232,.92);color:var(--ink);padding:13px 17px;font-size:13px;line-height:1.5;box-shadow:var(--shadow)}
    .visual-label strong{display:block;font-size:18px}
    .label-a{top:28px;left:-24px}.label-b{right:-20px;top:145px;background:var(--orange);color:#fff}.label-c{bottom:27px;left:36px}
    .info-strip{background:#253a34;border-top:1px solid rgba(246,241,232,.15)}
    .info-strip .container{display:grid;grid-template-columns:repeat(3,1fr)}
    .info-item{padding:19px 24px 19px 0;border-right:1px solid rgba(246,241,232,.13);display:flex;gap:15px;align-items:center}
    .info-item:last-child{border:0;padding-left:24px}.info-item:first-child{padding-left:0}
    .info-no{color:var(--orange);font-size:13px;font-weight:800}.info-item b{display:block;font-size:15px}.info-item span{display:block;color:rgba(246,241,232,.6);font-size:12px}
    .section{padding:112px 0}.section-head{margin-bottom:46px}.section-head h2{font-size:35px;line-height:1.3;color:var(--ink);margin-top:10px;letter-spacing:-.03em}.section-head p{color:var(--muted);max-width:600px;margin-top:15px}
    .guide{display:grid;grid-template-columns:28% 1fr;gap:76px}
    .side-title{border-left:3px solid var(--orange);padding-left:20px}.side-title h2{font-size:32px;color:var(--ink);line-height:1.35}.side-title p{color:var(--muted);font-size:14px;margin-top:16px}.text-link{display:inline-flex;margin-top:30px;color:var(--orange);font-weight:700;border-bottom:1px solid var(--orange);padding-bottom:3px}
    .guide-list{border-top:1px solid var(--line)}
    .guide-row{display:grid;grid-template-columns:55px 1fr 28px;gap:20px;align-items:center;padding:26px 20px;border-bottom:1px solid var(--line);transition:var(--ease)}
    .guide-row:hover{background:var(--sand);padding-left:28px}.guide-row .num{color:var(--orange);font-weight:800}.guide-row h3{font-size:20px;color:var(--ink)}.guide-row p{color:var(--muted);font-size:14px;margin-top:5px}.arrow{font-size:23px;color:var(--orange);transition:var(--ease)}.guide-row:hover .arrow{transform:translateX(5px)}
    .category-section{background:var(--sand)}.category-layout{display:grid;grid-template-columns:1.08fr .92fr;gap:28px}.feature-card{background:var(--deep);color:var(--cream);overflow:hidden;border-radius:var(--radius);box-shadow:var(--shadow)}.feature-img{height:245px;width:100%;opacity:.82}.feature-body{padding:26px 30px 30px}.tag{display:inline-block;color:var(--orange);font-size:12px;font-weight:800;letter-spacing:.1em;margin-bottom:11px}.feature-body h3{font-size:27px;line-height:1.4}.feature-body p{color:rgba(246,241,232,.68);margin:11px 0 22px;font-size:14px}.feature-body a{color:#f0b09a;font-weight:700}
    .index-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.index-card{border:1px solid rgba(38,59,53,.2);padding:23px 20px;min-height:170px;transition:var(--ease)}.index-card:hover{background:rgba(247,245,240,.72);border-color:var(--orange);transform:translateY(-2px)}.index-card b{color:var(--orange);font-size:13px}.index-card h3{color:var(--ink);font-size:18px;margin:12px 0 6px}.index-card p{font-size:13px;color:var(--muted);line-height:1.7}.all-link{display:block;border-top:1px solid rgba(38,59,53,.2);margin-top:30px;padding-top:18px;color:var(--ink);font-weight:700}.all-link span{color:var(--orange);margin-left:8px}
    .process{background:var(--paper)}.process-line{display:grid;grid-template-columns:repeat(4,1fr);position:relative;margin-top:60px}.process-line:before{content:"";position:absolute;top:10px;left:7%;right:7%;height:1px;background:var(--line)}.step{position:relative;padding-right:28px}.step-no{width:21px;height:21px;background:var(--paper);border:2px solid var(--orange);display:flex;align-items:center;justify-content:center;color:var(--orange);font-size:10px;font-weight:800;position:relative}.step h3{margin:22px 0 8px;color:var(--ink);font-size:19px}.step p{color:var(--muted);font-size:14px}
    .editorial{display:grid;grid-template-columns:1fr .85fr;gap:62px;align-items:start}.article-feature{background:var(--cream);border:1px solid var(--line);padding-bottom:24px}.article-feature img{height:250px;width:100%}.article-feature .article-copy{padding:22px 24px}.article-feature h3{font-size:23px;color:var(--ink);line-height:1.45}.article-feature p{font-size:14px;color:var(--muted);margin:10px 0 17px}.article-meta{font-size:12px;color:var(--orange);margin-bottom:10px}.article-list{border-top:1px solid var(--line)}.article-item{display:grid;grid-template-columns:60px 1fr 20px;gap:15px;padding:19px 0;border-bottom:1px solid var(--line);align-items:center}.article-item small{color:var(--orange);font-weight:700}.article-item h3{font-size:16px;color:var(--ink)}.article-item:hover h3{color:var(--orange)}
    .faq{background:var(--cream)}.faq-layout{display:grid;grid-template-columns:.75fr 1.25fr;gap:90px}.faq-list{border-top:1px solid var(--line)}.faq-item{border-bottom:1px solid var(--line)}.faq-q{width:100%;border:0;background:none;text-align:left;padding:20px 3px;display:flex;justify-content:space-between;align-items:center;color:var(--ink);font-weight:700}.faq-q span:last-child{color:var(--orange);font-size:22px}.faq-a{max-height:0;overflow:hidden;color:var(--muted);font-size:14px;transition:max-height .28s ease}.faq-item.open .faq-a{max-height:150px;padding:0 28px 20px 3px}.faq-item.open .faq-q span:last-child{transform:rotate(45deg)}
    .contact{background:var(--deep);color:var(--cream)}.contact-layout{display:grid;grid-template-columns:.85fr 1.15fr;gap:90px;align-items:start}.contact h2{font-size:34px;line-height:1.4;margin:12px 0 15px}.contact p{color:rgba(246,241,232,.68);font-size:14px}.contact-note{margin-top:28px;padding-left:16px;border-left:2px solid var(--orange);font-size:13px;color:rgba(246,241,232,.7)}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.field{display:flex;flex-direction:column;gap:7px}.field.full{grid-column:1/-1}.field label{font-size:13px;color:rgba(246,241,232,.75)}.field input,.field textarea{background:rgba(246,241,232,.08);border:1px solid rgba(246,241,232,.22);color:var(--cream);padding:12px 14px;border-radius:4px;min-height:46px}.field textarea{min-height:112px;resize:vertical}.field input:focus,.field textarea:focus{border-color:var(--orange);outline:none}.form-foot{display:flex;align-items:center;gap:18px;margin-top:18px}.privacy{font-size:12px;color:rgba(246,241,232,.5)}
    footer{background:#182722;color:rgba(246,241,232,.65);padding:58px 0 24px}.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1.3fr;gap:40px}.footer-brand .logo{color:var(--cream);display:block;margin-bottom:15px}.footer-brand p,.footer-col p{font-size:13px;line-height:1.8}.footer-col h3{color:var(--cream);font-size:14px;margin-bottom:14px}.footer-col a{display:block;font-size:13px;margin:8px 0}.footer-col a:hover{color:#f0b09a}.copyright{border-top:1px solid rgba(246,241,232,.12);margin-top:42px;padding-top:19px;display:flex;justify-content:space-between;font-size:12px}
    @media(max-width:1024px){.container{width:min(100% - 56px,900px)}.hero .container{gap:35px}.guide{gap:35px}.faq-layout,.contact-layout{gap:45px}.footer-grid{grid-template-columns:1.5fr 1fr 1fr}}
    @media(max-width:768px){.notice .container{justify-content:center}.notice a{display:none}.nav{height:68px}.menu{display:none;position:absolute;top:68px;left:0;right:0;background:var(--ink);padding:12px 28px 22px;flex-direction:column;align-items:stretch;gap:0;box-shadow:0 15px 25px rgba(0,0,0,.15)}.menu.show{display:flex}.menu a{height:48px}.menu a.active:after{bottom:10px}.nav-action{display:none}.menu-toggle{display:block;margin-left:auto}.hero .container{display:flex;flex-direction:column;align-items:stretch;padding-top:70px;padding-bottom:0;min-height:0}.hero{min-height:0}.hero-visual{height:310px;margin:44px 12px 0 24px}.info-strip .container{grid-template-columns:1fr}.info-item,.info-item:first-child,.info-item:last-child{padding:15px 0;border-right:0;border-bottom:1px solid rgba(246,241,232,.13)}.section{padding:76px 0}.guide,.category-layout,.editorial,.faq-layout,.contact-layout{grid-template-columns:1fr}.guide{gap:40px}.side-title h2{font-size:28px}.process-line{grid-template-columns:1fr;gap:28px;margin-top:35px}.process-line:before{left:10px;top:10px;bottom:10px;width:1px;height:auto;right:auto}.step{padding-left:45px;padding-right:0}.step-no{position:absolute;left:0;top:0}.step h3{margin-top:0}.editorial,.faq-layout,.contact-layout{gap:40px}.footer-grid{grid-template-columns:1fr 1fr}.footer-brand{grid-column:1/-1}}
    @media(max-width:520px){.container{width:calc(100% - 40px)}.notice{font-size:12px}.hero h1{font-size:36px}.hero p{font-size:15px}.actions .btn{width:100%}.hero-visual{height:260px;margin-left:12px}.label-a{left:-12px}.label-b{right:-12px}.label-c{left:20px}.guide-row{grid-template-columns:35px 1fr 20px;gap:10px;padding:21px 8px}.guide-row h3{font-size:17px}.index-grid,.form-grid{grid-template-columns:1fr}.field.full{grid-column:auto}.form-foot{align-items:flex-start;flex-direction:column}.form-foot .btn{width:100%}.feature-body h3{font-size:23px}.footer-grid{grid-template-columns:1fr}.copyright{display:block}.copyright span{display:block;margin-top:8px}}

/* roulang page: category1 */
:root{
      --ink:#263b35;
      --deep:#1f302b;
      --orange:#c85c36;
      --sand:#ede5d7;
      --paper:#f7f5f0;
      --cream:#f6f1e8;
      --text:#26312d;
      --muted:#6e7771;
      --line:#d9d6ce;
      --radius:12px;
      --shadow:0 12px 30px rgba(31,48,43,.09);
      --ease:all .25s ease;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{margin:0;font-family:"Microsoft YaHei","PingFang SC","Noto Sans SC",Arial,sans-serif;color:var(--text);background:var(--paper);line-height:1.8;font-size:16px}
    a{color:inherit;text-decoration:none}
    img{display:block;max-width:100%;object-fit:cover}
    button,input,textarea{font:inherit}
    button{cursor:pointer}
    .container{width:min(1200px,calc(100% - 96px));margin:auto}
    .notice{height:36px;background:#1a2925;color:rgba(246,241,232,.7);font-size:12px}
    .notice .container{height:100%;display:flex;align-items:center;justify-content:space-between}
    .notice a{color:var(--cream);border-bottom:1px solid rgba(246,241,232,.5)}
    header{position:relative;z-index:5;background:var(--ink);color:var(--cream)}
    .nav{height:78px;display:flex;align-items:center;gap:42px}
    .logo{font-weight:800;font-size:21px;letter-spacing:.03em;white-space:nowrap}
    .logo small{display:block;color:#d7b39f;font-size:10px;letter-spacing:.2em;line-height:1.2}
    .menu{display:flex;align-items:center;gap:30px;margin-left:auto}
    .menu a{height:78px;display:flex;align-items:center;position:relative;color:rgba(246,241,232,.72);font-size:15px}
    .menu a:hover,.menu a.active{color:var(--cream)}
    .menu a.active:after{content:"";position:absolute;bottom:19px;left:0;width:24px;height:3px;background:var(--orange)}
    .nav-action{padding:10px 17px;border:1px solid rgba(246,241,232,.35);color:var(--cream);font-size:14px;transition:var(--ease)}
    .nav-action:hover{background:var(--orange);border-color:var(--orange);color:#fff}
    .menu-toggle{display:none;background:none;border:0;color:var(--cream);font-size:24px}
    .page-banner{padding:76px 0 70px;background:var(--paper);overflow:hidden}
    .banner-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:70px;align-items:center}
    .crumb{font-size:13px;color:var(--muted);margin-bottom:22px}
    .crumb a:hover{color:var(--orange)}
    .banner-copy h1{font-size:clamp(34px,4.5vw,52px);line-height:1.25;letter-spacing:-.04em;color:var(--ink);margin:0 0 20px}
    .banner-copy p{max-width:650px;color:var(--muted);font-size:16px;line-height:1.9;margin:0}
    .banner-art{height:300px;position:relative;background:url('/assets/images/backpic/back-2.webp') center/cover;border-radius:var(--radius);overflow:hidden;border:1px solid var(--line)}
    .banner-art:after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(31,48,43,.2),rgba(31,48,43,.75))}
    .art-note{position:absolute;z-index:1;right:24px;bottom:22px;color:var(--cream);border-left:3px solid var(--orange);padding-left:14px;font-size:13px;letter-spacing:.06em}
    .category-nav{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--cream)}
    .category-nav .container{display:flex;align-items:center;gap:12px;padding:14px 0;overflow-x:auto}
    .category-nav a{flex:0 0 auto;padding:7px 15px;border:1px solid transparent;color:var(--muted);font-size:14px;transition:var(--ease)}
    .category-nav a:hover{border-color:var(--orange);color:var(--orange)}
    .category-nav a.active{background:var(--ink);color:var(--cream);border-color:var(--ink)}
    .content-section{padding:88px 0}
    .content-layout{display:grid;grid-template-columns:minmax(0,2fr) minmax(260px,1fr);gap:66px;align-items:start}
    .section-heading{margin-bottom:30px}
    .section-heading .kicker{color:var(--orange);font-size:13px;font-weight:700;letter-spacing:.14em}
    .section-heading h2{color:var(--ink);font-size:32px;line-height:1.35;margin:10px 0}
    .section-heading p{color:var(--muted);max-width:650px;margin:0}
    .featured{display:grid;grid-template-columns:1fr 1fr;background:var(--deep);color:var(--cream);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);margin-bottom:38px}
    .featured img{height:100%;min-height:280px;width:100%}
    .featured-copy{padding:30px}
    .tag{display:inline-block;color:#efad91;font-size:12px;font-weight:800;letter-spacing:.1em;margin-bottom:12px}
    .featured h3{font-size:25px;line-height:1.45;margin:0 0 13px}
    .featured p{color:rgba(246,241,232,.7);font-size:14px;margin:0 0 20px}
    .meta{color:#d9a08b;font-size:12px;margin-bottom:17px}
    .read-link{color:#f0b09a;font-weight:700;font-size:14px}
    .read-link span{display:inline-block;transition:var(--ease)}
    .read-link:hover span{transform:translateX(5px)}
    .resource-list{border-top:1px solid var(--line)}
    .resource-item{display:grid;grid-template-columns:72px minmax(0,1fr) 24px;gap:18px;align-items:center;padding:24px 12px;border-bottom:1px solid var(--line);transition:var(--ease)}
    .resource-item:hover{background:var(--sand);padding-left:20px}
    .resource-date{color:var(--orange);font-size:12px;font-weight:700}
    .resource-item h3{color:var(--ink);font-size:18px;line-height:1.45;margin:0 0 5px}
    .resource-item p{color:var(--muted);font-size:14px;line-height:1.75;margin:0}
    .resource-arrow{font-size:21px;color:var(--orange);transition:var(--ease)}
    .resource-item:hover .resource-arrow{transform:translateX(4px)}
    .sidebar{display:flex;flex-direction:column;gap:22px}
    .side-box{border-top:3px solid var(--ink);padding:22px 22px 24px;background:var(--cream)}
    .side-box h2{font-size:20px;color:var(--ink);margin:0 0 17px}
    .index-list{list-style:none;padding:0;margin:0}
    .index-list li{border-bottom:1px solid var(--line)}
    .index-list a{display:flex;gap:12px;padding:11px 0;color:var(--muted);font-size:14px;transition:var(--ease)}
    .index-list a span{color:var(--orange);font-weight:700}
    .index-list a:hover,.index-list a.current{color:var(--ink);padding-left:5px}
    .quick-box{background:var(--sand)}
    .quick-links a{display:block;padding:10px 0;border-bottom:1px solid rgba(38,59,53,.16);font-size:14px;color:var(--ink)}
    .quick-links a:last-child{border-bottom:0}
    .quick-links a:hover{color:var(--orange)}
    .assist-box{background:var(--deep);color:var(--cream);padding:25px 23px}
    .assist-box h2{color:var(--cream);font-size:20px;margin:0 0 10px}
    .assist-box p{color:rgba(246,241,232,.68);font-size:14px;margin:0 0 20px}
    .assist-box .btn{width:100%}
    .pagination{display:flex;gap:8px;margin-top:28px}
    .pagination a,.pagination span{min-width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line);color:var(--muted);font-size:13px}
    .pagination .selected{background:var(--ink);border-color:var(--ink);color:var(--cream)}
    .pagination .disabled{opacity:.45}
    .extension{padding:80px 0;background:var(--sand)}
    .extension-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:28px}
    .extension-head h2{font-size:32px;color:var(--ink);margin:0}
    .extension-head p{color:var(--muted);font-size:14px;margin:0}
    .extension-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
    .extension-item{display:grid;grid-template-columns:45px 1fr 20px;gap:12px;align-items:start;background:var(--paper);padding:24px;border:1px solid transparent;transition:var(--ease)}
    .extension-item:hover{border-color:var(--orange);transform:translateY(-2px);box-shadow:var(--shadow)}
    .extension-item b{color:var(--orange);font-size:13px}
    .extension-item h3{color:var(--ink);font-size:18px;margin:0 0 6px}
    .extension-item p{color:var(--muted);font-size:13px;line-height:1.75;margin:0}
    .extension-item i{font-style:normal;color:var(--orange);font-size:21px}
    .contact-strip{padding:48px 0;background:var(--deep);color:var(--cream)}
    .contact-inner{display:flex;justify-content:space-between;align-items:center;gap:35px}
    .contact-inner h2{font-size:28px;margin:0 0 8px}
    .contact-inner p{color:rgba(246,241,232,.68);font-size:14px;margin:0}
    .btn.primary{background:var(--orange);color:#fff}
    .btn.primary:hover{background:#a94c2d;transform:translateY(-2px)}
    footer{background:var(--ink);color:var(--cream);padding:68px 0 24px}
    .footer-grid{display:grid;grid-template-columns:2.5fr 1fr 1fr 1.5fr;gap:35px}
    .footer-brand .logo{display:inline-block;margin-bottom:17px}
    .footer-brand p,.footer-col p{color:rgba(246,241,232,.62);font-size:14px;line-height:1.8;margin:0}
    .footer-col{display:flex;flex-direction:column;gap:8px}
    .footer-col h3{color:var(--cream);font-size:15px;margin:0 0 9px}
    .footer-col a{color:rgba(246,241,232,.65);font-size:14px;transition:var(--ease)}
    .footer-col a:hover{color:#efad91}
    .copyright{display:flex;justify-content:space-between;gap:20px;border-top:1px solid rgba(246,241,232,.14);padding-top:20px;margin-top:55px;color:rgba(246,241,232,.42);font-size:12px}
    a:focus-visible,button:focus-visible{outline:3px solid rgba(200,92,54,.45);outline-offset:3px}
    @media(max-width:1024px){
      .container{width:min(100% - 56px,900px)}
      .nav{gap:22px}
      .menu{gap:18px}
      .banner-grid{gap:35px}
      .content-layout{gap:35px}
      .footer-grid{grid-template-columns:2fr 1fr 1fr}
      .footer-col:last-child{grid-column:2 / 4}
    }
    @media(max-width:768px){
      .container{width:calc(100% - 40px)}
      .notice .container{font-size:11px}
      .nav{height:70px}
      .menu{display:none;position:absolute;top:70px;left:0;right:0;background:var(--ink);padding:8px 20px 20px;flex-direction:column;align-items:stretch;gap:0;box-shadow:0 12px 22px rgba(0,0,0,.18)}
      .menu.open{display:flex}
      .menu a{height:50px;border-bottom:1px solid rgba(246,241,232,.1)}
      .menu a.active:after{bottom:10px}
      .nav-action{margin-left:auto}
      .menu-toggle{display:block}
      .page-banner{padding:52px 0}
      .banner-grid{grid-template-columns:1fr}
      .banner-art{height:220px}
      .content-section{padding:62px 0}
      .content-layout{grid-template-columns:1fr}
      .featured{grid-template-columns:1fr}
      .featured img{height:220px;min-height:0}
      .sidebar{display:grid;grid-template-columns:1fr 1fr}
      .assist-box{grid-column:1 / -1}
      .extension{padding:58px 0}
      .extension-head{display:block}
      .extension-head p{margin-top:10px}
      .contact-inner{display:block}
      .contact-inner .btn{margin-top:22px}
      .footer-grid{grid-template-columns:1fr 1fr}
      .footer-col:last-child{grid-column:auto}
      .copyright{display:block}
      .copyright span{display:block;margin-top:5px}
    }
    @media(max-width:520px){
      .container{width:calc(100% - 36px)}
      .notice a{display:none}
      .logo{font-size:18px}
      .nav-action{display:none}
      .banner-copy h1{font-size:34px}
      .category-nav .container{width:100%;padding-left:18px;padding-right:18px}
      .resource-item{grid-template-columns:52px minmax(0,1fr) 18px;gap:10px;padding:20px 4px}
      .resource-item h3{font-size:16px}
      .resource-item p{font-size:13px}
      .sidebar{display:block}
      .side-box{margin-bottom:18px}
      .extension-grid{grid-template-columns:1fr}
      .extension-item{padding:20px 16px}
      .footer-grid{grid-template-columns:1fr}
      .footer-col:last-child{grid-column:auto}
    }
