/* ===== مقاله‌ها و مجله: نوار بالا همراه اسکرول + چیدمان دسکتاپ ===== */
html{scroll-padding-top:72px}
/* صفحه‌ی مقاله */
.top{position:-webkit-sticky;position:sticky;top:0;z-index:40;background:rgba(251,249,248,.86);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
/* صفحه‌ی مجله (kbeauty) */
.journal-page-top{position:-webkit-sticky;position:sticky;top:0;z-index:40;margin:-18px -16px 20px;padding:14px 16px;background:rgba(244,247,253,.88);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
@media(max-width:520px){.journal-page-top{margin:-14px -12px 16px;padding:12px}}

@media(min-width:900px){
/* --- مقاله --- */
body:has(.cover){max-width:1100px}
.top{padding:18px 44px}
.top a{font-size:13.5px;padding:10px 20px;transition:transform .2s,box-shadow .2s}
.top a:not(.brand):hover{transform:translateY(-2px);box-shadow:0 10px 22px rgba(40,52,110,.16)}
.top .brand{font-size:26px}
.crumbs{padding:6px 44px 0;font-size:13px}
.cover{margin:16px 44px 0;border-radius:36px}
.cover img{aspect-ratio:2.6}
article{max-width:800px;margin:0 auto;padding:34px 24px 10px}
.meta{font-size:13px}
h1{font-size:40px;line-height:1.6;margin:14px 0 10px}
.lead{font-size:18.5px;line-height:2.1}
.content h2{font-size:24px;margin:38px 0 8px;padding-right:18px}
.content p,.content li{font-size:17px;line-height:2.2}
.note{font-size:13.5px;margin-top:34px;padding:18px 22px}
.cta{margin:44px auto 0;max-width:800px;padding:38px 30px;border-radius:32px}
.cta h2{font-size:22px}.cta p{font-size:15px}
.btn{font-size:15px;padding:13px 32px;transition:transform .2s,filter .2s}.btn:hover{transform:translateY(-2px);filter:brightness(1.12)}
.related{padding:48px 44px 8px}.related h2{font-size:24px;margin-bottom:18px}
.rel-list{grid-template-columns:repeat(3,1fr);gap:22px}
.rel{flex-direction:column;transition:transform .25s,box-shadow .25s}
.rel:hover{transform:translateY(-5px);box-shadow:0 18px 36px rgba(61,77,130,.18)}
.rel img{width:100%;min-width:0;aspect-ratio:1.55}
.rel div{padding:16px 18px 18px}.rel small{font-size:12px}.rel b{font-size:15.5px}
.foot{margin-top:44px;padding:30px 44px 44px;font-size:13px}
.foot nav{gap:26px;font-size:14px}
/* --- مجله --- */
body:has(.journal-page-wrap){max-width:1240px!important}
.journal-page-wrap{max-width:1180px;padding:18px 44px 64px}
.journal-page-top{margin:-18px -44px 26px;padding:18px 44px}
.journal-back{font-size:14px;padding:11px 20px;transition:transform .2s,box-shadow .2s}
.journal-back:hover{transform:translateY(-2px);box-shadow:0 10px 22px rgba(40,48,100,.14)}
.journal-page-wrap .title h1{font-size:44px}
.journal-intro{font-size:16px}
.journal-page-wrap .journal-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:28px}
.journal-page-wrap .journal-card{flex-direction:column;min-height:0;border-radius:26px;transition:transform .25s,box-shadow .25s}
.journal-page-wrap .journal-card:hover{transform:translateY(-6px);box-shadow:0 20px 40px rgba(61,77,130,.18)}
.journal-page-wrap .journal-card>img{width:100%;max-width:none;min-width:0;height:210px;min-height:0;aspect-ratio:auto}
.journal-page-wrap .journal-card-body{padding:18px 20px 20px;justify-content:flex-start;align-items:flex-start}
.journal-page-wrap .journal-card-body h3{font-size:17px;margin:8px 0 6px}
.journal-page-wrap .journal-card-body p{font-size:13.5px;margin-bottom:14px}
.journal-page-wrap .journal-kicker{font-size:12px}
.journal-page-wrap .journal-meta{font-size:13px}
}
@media(min-width:900px){
.journal-end-note{max-width:880px;margin-left:auto;margin-right:auto}
body>.section{max-width:1180px;margin-left:auto;margin-right:auto;padding-left:44px;padding-right:44px}
}

/* v28: نوار اسکرول سفارشی SERENE — مرواریدی با گرادیان لاوندر/صورتی/آبی */
html{scrollbar-width:thin;scrollbar-color:#b9a6ee #f3eefb}
@supports selector(::-webkit-scrollbar){html{scrollbar-width:auto;scrollbar-color:auto}}
::-webkit-scrollbar{width:12px;height:12px}
::-webkit-scrollbar-track{background:linear-gradient(180deg,#eef7ff,#fff4fa 50%,#f1ecff);box-shadow:inset 1px 0 0 rgba(143,155,224,.18)}
::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#a8c5f8 0%,#c3aef2 48%,#f2b2d2 100%);border-radius:999px;border:3px solid transparent;background-clip:padding-box;box-shadow:inset 0 0 0 1px rgba(255,255,255,.55),inset 0 6px 8px rgba(255,255,255,.35)}
::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,#8fb2f5 0%,#b196ee 48%,#ee95c1 100%);background-clip:padding-box}
::-webkit-scrollbar-thumb:active{background:linear-gradient(180deg,#7f9fe8,#9f82e3 48%,#e17fb0);background-clip:padding-box}
::-webkit-scrollbar-corner{background:transparent}