.blog-hero{padding:100px 0;text-align:center;color:#fff;background:linear-gradient(110deg,#06182def,#075b75ef),url(assets/hero.png) center/cover}.blog-hero span,.article-cat{display:inline-block;background:#ffffff18;border:1px solid #ffffff35;padding:8px 16px;border-radius:25px;color:#9cecf5;font-weight:800}.blog-hero h1{font-size:52px;margin:14px 0}.blog-hero p{font-size:19px;color:#dbe8f4}.blog-area{background:#f4f8fc}.post-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}.post-card{background:#fff;border-radius:20px;overflow:hidden;box-shadow:0 14px 40px #082b5412;transition:.35s}.post-card:hover{transform:translateY(-8px);box-shadow:0 24px 55px #082b5422}.post-cover{height:190px;display:flex;justify-content:space-between;align-items:flex-start;padding:24px;background:radial-gradient(circle at 25% 20%,#18c6d977,transparent 32%),linear-gradient(135deg,#071a2f,#075b80);color:#fff}.post-cover span{padding:7px 12px;background:#ffffff18;border-radius:20px}.cover-icon{font-size:58px;color:#ffb703;align-self:center}.post-body{padding:26px}.post-meta{font-size:13px;color:#7a8798}.post-body h2{font-size:22px;line-height:1.55;color:#071a2f}.post-body p{color:#68768a;line-height:1.8}.read-more{color:#0866ff;font-weight:800}.pagination{text-align:center;margin-top:45px}.nav-links a,.nav-links span{display:inline-block;padding:10px 15px;background:#fff;margin:4px;border-radius:9px}.nav-links .current{background:#0866ff;color:#fff}.article-hero{padding:90px 0;color:#fff;background:radial-gradient(circle at 20% 20%,#18c6d955,transparent 30%),linear-gradient(115deg,#06182d,#07476c)}.article-head{max-width:900px;text-align:center}.article-head h1{font-size:clamp(34px,5vw,57px);line-height:1.35;margin:22px 0}.article-meta{color:#cbdbea}.article-layout{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:45px;align-items:start;padding-top:70px;padding-bottom:90px}.article-content{background:#fff;padding:45px;border-radius:22px;box-shadow:0 15px 45px #082b5410;font-size:18px;line-height:2;color:#344258}.article-content h2{font-size:30px;color:#071a2f;margin:45px 0 15px;border-right:5px solid #18c6d9;padding-right:14px}.article-content h3{font-size:23px;color:#0866ff}.article-content ul{background:#f4f8fc;padding:22px 45px 22px 20px;border-radius:14px}.article-content li{margin:8px 0}.article-content a{color:#0866ff;font-weight:700}.article-content blockquote{margin:30px 0;padding:20px 25px;background:#eef8ff;border-right:5px solid #0866ff;border-radius:12px}.article-side{position:sticky;top:110px}.side-box{background:#fff;padding:25px;border-radius:18px;box-shadow:0 12px 38px #082b5412;margin-bottom:20px}.side-box h3{color:#071a2f;margin-top:0}.side-box p{line-height:1.8;color:#68768a}.side-box .btn{width:100%;padding:11px}.side-box #auto-toc a{display:block;padding:11px 0;border-bottom:1px solid #edf1f6;color:#536278;font-weight:600}.side-box #auto-toc a:hover{color:#0866ff}.article-cta{margin-top:45px;padding:32px;border-radius:18px;background:linear-gradient(120deg,#071a2f,#075b80);color:#fff}.article-cta h3{color:#fff;margin-top:0}@media(max-width:900px){.post-grid{grid-template-columns:1fr 1fr}.article-layout{grid-template-columns:1fr}.article-side{position:static}.article-content{padding:30px}}@media(max-width:600px){.post-grid{grid-template-columns:1fr}.blog-hero h1{font-size:40px}.article-content{padding:22px;font-size:16px}.article-content h2{font-size:25px}.article-hero{padding:65px 0}}