@charset "utf-8";
h1,h2,h3,h4,h5,h6,pre,code,address,caption,cite,code,em,th,p,a,li,td,b,div,span{font:400 12px "Poppins", "Lucida Grande", "Lucida Sans Unicode", "Arial";color:#333;}
html{font:400 100% "Poppins", "Open Sans", "Lucida Grande", "Lucida Sans Unicode", "Arial"; -ms-text-size-adjust:100%; -webkit-text-size-adjust:none; line-height:1.2; color:#333;}
html{font-size: 100px;}
.pw1400 { max-width: 14rem; width: 100%; margin: 0 auto; }
h1 { color: #000; font-size: 0.32rem; font-weight: 700; }
h2 { color: #333; font-size: 0.24rem; }
h3 { color: #000; font-size: 0.36rem; font-weight: 500; text-align: center; margin-bottom: 0.4rem; }
h4 { color: #333; font-size: 0.26rem; font-weight: 500;} 

#ar { direction: rtl; }
#ar .author-head img { margin-right: 0; margin-left: 0.3rem; }
#ar .author-article a { margin-right: 0; margin-left: 0.3rem; }

/* banner */
.author-banner { background: url(../author/img/author-bannerbg.png) top center no-repeat; background-size: contain; padding-top: 1rem; margin-bottom: 0.8rem; }
.author-info { border-radius: 24px; border: 1px solid #FFF; background: rgba(255, 255, 255, 0.60); box-shadow: 0 4px 15.5px 0 rgba(200, 234, 255, 0.25), 0 4px 40px 0 rgba(177, 210, 230, 0.25); backdrop-filter: blur(250px); padding: 0.6rem 1.5rem; box-sizing: border-box; }
.author-head { display: flex; align-items: center; justify-content: center; }
.author-head img { border-radius: 50%; margin-right: 0.3rem; width: 2rem; height: 2rem; }

.author-text { color: #000; font-size: 0.18rem; margin: 0.4rem auto; }
.author-article a { display: inline-block; padding: 0.14rem 0.32rem; color: #000; font-size: 0.2rem; text-decoration: none; font-weight: 500; border-radius: 0.6rem; background: radial-gradient(47.43% 41.95% at 50.19% 50.85%, #FFF 0%, rgba(255, 255, 255, 0.00) 100%), radial-gradient(107.47% 91.26% at 50.19% 14.41%, #E2FAFF 0%, #E4EDFF 100%), rgba(255, 255, 255, 0.70); backdrop-filter: blur(1.5px); margin-right: 0.3rem; }
.author-article a:hover { background: radial-gradient(51.27% 50.85% at 50.23% 125.42%, #C8DEFF 0%, rgba(200, 222, 255, 0.00) 100%), radial-gradient(45.15% 49.15% at 50.23% -18.64%, #C8DEFF 0%, rgba(200, 222, 255, 0.00) 100%), radial-gradient(55.15% 63.56% at 50% 50%, #63A3FF 0%, rgba(84, 154, 255, 0.00) 100%), #3689FB; color: #fff; }

/* top article */
.top-article { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 0.4rem; margin-bottom: 0.8rem; }
a.top-article-item { border-radius: 0.16rem;border: 1px solid #D4EAFF;backdrop-filter: blur(1.5px); padding: 0.4rem 0.2rem; width: 4.4rem; box-sizing: border-box; text-decoration: none; }
a.top-article-item:hover { background-color: #F2F9FF; }
a.top-article-item p { color: #333; font-size: 0.16rem; margin: 0.15rem auto 0.2rem; }
a.top-article-item span { display: inline-block; color: #3689FB; font-size: 0.16rem; border-radius: 0.06rem; background: #D9E9FF; padding: 0.04rem 0.1rem;}

/* all article */
.all-article { margin-bottom: 0.8rem; }
.all-article-item { display: flex; justify-content: space-between; flex-wrap: nowrap; gap: 0.4rem; border-bottom: 2px dashed #E5E5F2; padding: 0.4rem 0; }
.all-article-item h4 a { color: #333; font-size: 0.26rem; font-weight: 500; text-decoration: none; }
.all-article-item h4 a:hover { color: #2376FF; }
.all-article-item:first-child { padding: 0 0 0.4rem; }
.all-article-item:nth-child(5) { border-bottom: none; padding: 0.4rem 0 0; }
.all-article-left, .all-article-right { max-width: 6.8rem; width: 100%; }
.all-article-item p { color: #333; font-size: 0.16rem; margin: 0.1rem auto 0.2rem; }
.all-article-item span { display: inline-block; color: #3689FB; font-size: 0.16rem; border-radius: 0.06rem; background: #D9E9FF; padding: 0.04rem 0.1rem;}

/* page */
.pagination-controls { margin-top: 60px; color: #999; font-size: 20px; font-weight: 500; display: flex; align-items: center; justify-content: center;}
.pagination-controls button { color: #999;font-size: 20px; font-weight: 500; border-radius: 6px; border: 1px solid #E5E5F2; background-color: #fff; margin: 0 11px; padding: 3px 15px; cursor: pointer;}
.pagination-controls .btn-prev,
.pagination-controls .btn-next {color: #7E7E7E;  display: flex; align-items: center;}
.pagination-controls button.active,
.pagination-controls button:hover { background-color: #227BFB; color: white;  border-color: #227BFB;}
.pagination-controls button:hover svg path { fill: #fff;}
.pagination-controls span.dot { margin: 0 4px;}
@media screen and (max-width: 1500px) {
    .pw1400 { width: 94%; }
}

@media screen and (max-width: 1215px) {
 .top-article { justify-content: space-around; }
 a.top-article-item { width: 5.8rem; }
}

@media screen and (max-width: 765px) {
    .pw1400 { width: 90%; }
    h1 { font-size: 0.38rem; }
    h2 { font-size: 0.28rem; }
    h3 { font-size: 0.48rem; }
    h4 { font-size: 0.32rem; }
    .top-article, .all-article { margin-bottom: 0.6rem; }
    .author-banner { padding-top: 0.8rem; margin-bottom: 0.6rem; }
    .author-info { padding: 0.3rem; }
    .author-head img { width: 1rem; height: 1rem; }
    .author-text { margin: 0.2rem auto; font-size: 0.24rem; }
    .author-article a { margin: 0.2rem 0.1rem; font-size: 0.26rem; padding: 0.2rem 0.3rem; }

    a.top-article-item { width: 100%; }
    a.top-article-item p { font-size: 0.26rem; }
    a.top-article-item span { font-size: 0.24rem; }

    .all-article-item h4 a { font-size: 0.32rem; }
    .all-article-item p { font-size: 0.26rem; }
    .all-article-item span { font-size: 0.24rem; }

    .all-article-item { flex-direction: column; justify-content: space-around; gap: 0.8rem; flex-wrap: wrap; border-bottom: none; }
    .pagination-controls { margin-top: 30px;}
    .pagination-controls button {  font-size: 0.24rem; margin: 0 4px; padding: 0.04rem 0.14rem; }
}