.reading-progress{position:fixed;top:0;left:0;height:3px;background:linear-gradient(90deg,var(--color-primary),var(--color-secondary));z-index:200;width:0%;transition:width .1s linear}.blog-hero{background:var(--gradient-hero);padding:120px 0 80px}.blog-hero .breadcrumb{display:flex;gap:8px;font-size:13px;color:#ffffff80;margin-bottom:24px}.blog-hero .breadcrumb a{color:#ffffffb3;text-decoration:none}.blog-hero .breadcrumb a:hover{color:#fff}.blog-hero__cat{display:inline-block;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:1.5px;color:var(--color-secondary);background:#8bc64026;padding:5px 12px;border-radius:20px;margin-bottom:16px}.blog-hero__title{font-size:var(--text-4xl);font-weight:900;color:#fff;line-height:1.15;margin-bottom:16px;max-width:760px}.blog-hero__excerpt{font-size:var(--text-lg);color:#ffffffbf;line-height:1.6;max-width:640px;margin-bottom:32px}.blog-hero__meta{display:flex;align-items:center;justify-content:space-between;max-width:640px}.blog-hero__author{display:flex;align-items:center;gap:12px}.blog-hero__avatar{width:40px;height:40px;border-radius:50%;background:#ffffff26;color:#fff;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:800}.blog-hero__author-name{display:block;color:#fff;font-size:14px;font-weight:600}.blog-hero__author-role{display:block;color:#ffffff80;font-size:12px}.blog-hero__details{display:flex;gap:8px;color:#ffffff80;font-size:13px}.blog-featured-img{background:var(--color-white);padding:40px 0 0;position:relative;z-index:1}.blog-featured-img__wrap{max-width:860px;margin:0 auto}.blog-featured-img__placeholder{background:linear-gradient(135deg,#e8f4fb,#f0f4f8,#e4eef5);border-radius:16px;height:360px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;color:var(--color-primary);border:1px solid var(--color-border)}.blog-featured-img__placeholder span{font-size:13px;color:var(--color-text-muted);font-weight:500}.blog-featured-img__real{border-radius:16px;width:100%;height:360px;object-fit:cover;border:1px solid var(--color-border)}.blog-content{padding:48px 0 80px;background:var(--color-white)}.blog-layout{display:grid;grid-template-columns:1fr 280px;gap:56px;align-items:start}.article-body{max-width:100%}.article-body h2{font-size:var(--text-2xl);font-weight:800;color:var(--color-dark);margin:48px 0 16px;line-height:1.3;scroll-margin-top:80px}.article-body h2:first-child{margin-top:0}.article-body h3{font-size:var(--text-xl);font-weight:700;color:var(--color-dark);margin:32px 0 12px}.article-body p{font-size:16px;color:#555;line-height:1.85;margin-bottom:20px}.article-body ul,.article-body ol{font-size:16px;color:#555;line-height:1.85;margin-bottom:20px;padding-left:24px}.article-body li{margin-bottom:8px}.article-body strong{color:var(--color-dark)}.article-body table{width:100%;border-collapse:collapse;margin:28px 0;font-size:14px;border:1px solid var(--color-border);border-radius:var(--radius-lg);overflow:hidden}.article-body th{text-align:left;padding:12px 16px;background:var(--color-dark);font-weight:700;color:#fff;font-size:13px}.article-body td{padding:11px 16px;border-bottom:1px solid var(--color-border);color:#555}.article-body tr:nth-child(2n) td{background:var(--color-bg)}.article-body .callout{background:var(--color-tag-bg);border-left:4px solid var(--color-primary);border-radius:0 12px 12px 0;padding:20px 24px;margin:32px 0;font-size:15px;line-height:1.7;color:#444}.article-body .callout strong{color:var(--color-primary)}.article-body .callout--tip{background:#f0faf0;border-left-color:var(--color-secondary)}.article-body .callout--tip strong{color:#4a8c1c}.article-body .callout--warning{background:#fff8f0;border-left-color:#f59e0b}.article-body .callout--warning strong{color:#b45309}.blog-sidebar{position:sticky;top:80px;display:flex;flex-direction:column;gap:24px}.toc{background:var(--color-bg);border-radius:12px;padding:20px}.toc__title{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:1.5px;color:var(--color-text-muted);margin-bottom:12px}.toc__nav{display:flex;flex-direction:column;gap:0}.toc__link{display:block;font-size:13px;color:var(--color-text-muted);text-decoration:none;padding:6px 0 6px 12px;border-left:2px solid transparent;transition:all .15s;line-height:1.4}.toc__link:hover{color:var(--color-primary)}.toc__link.is-active{color:var(--color-primary);border-left-color:var(--color-primary);font-weight:600}.sidebar-share__title{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:1.5px;color:var(--color-text-muted);margin-bottom:10px}.sidebar-share__buttons{display:flex;gap:8px}.share-btn{width:40px;height:40px;border-radius:10px;border:1px solid var(--color-border);background:var(--color-white);cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--color-text-muted);transition:all .15s}.share-btn:hover{border-color:var(--color-primary);color:var(--color-primary)}.share-btn--wa:hover{background:#25d366;color:#fff;border-color:#25d366}.share-btn--li:hover{background:#0077b5;color:#fff;border-color:#0077b5}.share-btn--x:hover{background:#000;color:#fff;border-color:#000}.share-btn--copy:hover{background:var(--color-primary);color:#fff;border-color:var(--color-primary)}.sidebar-cta{background:linear-gradient(135deg,#006199,#0085ca 55%,#5a9a30);border-radius:12px;padding:24px;color:#fff;position:relative;overflow:hidden}.sidebar-cta:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 90% 10%,rgba(132,189,0,.35),transparent 60%);pointer-events:none}.sidebar-cta>*{position:relative;z-index:1}.sidebar-cta__label{font-size:11px;text-transform:uppercase;letter-spacing:1.5px;color:#ffffff80;margin-bottom:8px}.sidebar-cta__title{font-size:17px;font-weight:800;margin-bottom:8px}.sidebar-cta__text{font-size:13px;color:#ffffffb3;line-height:1.5;margin-bottom:16px}.blog-related{background:var(--color-bg);padding:64px 0}.blog-related__title{font-size:var(--text-2xl);font-weight:800;color:var(--color-dark);margin-bottom:28px}.blog-related__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.related-card{background:var(--color-white);border:1px solid var(--color-border);border-radius:12px;overflow:hidden;text-decoration:none;transition:box-shadow .2s;display:flex;flex-direction:column}.related-card:hover{box-shadow:var(--shadow-card-hover)}.related-card__img{height:140px;background:linear-gradient(135deg,#e8f4fb,#f0f4f8,#e4eef5);display:flex;align-items:center;justify-content:center;color:var(--color-primary)}.related-card__img img{width:100%;height:100%;object-fit:cover}.related-card__body{padding:20px;display:flex;flex-direction:column;flex:1}.related-card__cat{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--color-primary);margin-bottom:10px}.related-card__title{font-size:15px;font-weight:700;color:var(--color-dark);line-height:1.4;margin-bottom:12px;flex:1}.related-card__read{font-size:13px;color:var(--color-primary);font-weight:600}.container{max-width:1280px;margin:0 auto;padding:0 48px}@media(max-width:900px){.blog-layout{grid-template-columns:1fr}.blog-sidebar{position:static;flex-direction:row;flex-wrap:wrap;gap:16px}.toc,.sidebar-cta{flex:1;min-width:200px}.blog-related__grid{grid-template-columns:1fr}}@media(max-width:600px){.blog-hero__title{font-size:var(--text-3xl)}.blog-hero__meta{flex-direction:column;align-items:flex-start;gap:12px}.container{padding:0 20px}.sidebar-share__buttons{gap:6px}.blog-featured-img__placeholder,.blog-featured-img__real{height:200px}.related-card__img{height:100px}}
