/**
 * Blog page styles.
 */

.wr-blog-content .wr-page-hero{
	background:var(--wr-navy);
	padding:calc(var(--wr-header-h) + var(--wr-admin-bar-h) + 3rem) 2rem 70px;
	position:relative;
	overflow:hidden;
	text-align:center;
}

.wr-blog-content .wr-page-hero::before{
	content:'';
	position:absolute;
	top:-200px;
	right:-200px;
	width:600px;
	height:600px;
	background:radial-gradient(circle,rgba(150,73,227,.25) 0%,transparent 70%);
	pointer-events:none;
}

.wr-blog-content .wr-page-hero::after{
	content:'';
	position:absolute;
	bottom:-100px;
	left:-100px;
	width:500px;
	height:500px;
	background:radial-gradient(circle,rgba(0,148,242,.2) 0%,transparent 70%);
	pointer-events:none;
}

.wr-blog-content .wr-page-hero-inner{
	max-width:700px;
	margin:0 auto;
	position:relative;
	z-index:1;
}

.wr-blog-content .wr-page-hero h1{
	font-size:3rem;
	font-weight:900;
	color:#fff;
	line-height:1.1;
	margin-bottom:1.2rem;
}

.wr-blog-content .wr-page-hero h1 em{
	font-style:normal;
	background:linear-gradient(135deg,#FF6B00,#ff9a3c);
	-webkit-background-clip:text;
	-webkit-text-fill-color:transparent;
	background-clip:text;
}

.wr-blog-content .wr-page-hero p{
	color:rgba(255,255,255,.7);
	font-size:1.05rem;
	line-height:1.7;
	max-width:560px;
	margin:0 auto;
}

.wr-blog-content .wr-badge{
	display:inline-flex;
	align-items:center;
	gap:8px;
	background:rgba(255,107,0,.15);
	border:1px solid rgba(255,107,0,.3);
	color:#FF6B00;
	padding:6px 14px;
	border-radius:100px;
	font-size:.82rem;
	font-weight:600;
	margin-bottom:1.5rem;
}

.wr-blog-section{padding:80px 2rem;background:#fff}
.wr-blog-inner{max-width:1200px;margin:24px auto}

.wr-blog-filter-bar{display:flex;align-items:center;gap:10px;margin-bottom:3rem;flex-wrap:wrap}
.wr-blog-filter-btn{
	padding:7px 18px;
	border-radius:100px;
	font-size:.83rem;
	font-weight:600;
	border:1px solid var(--wr-border,#e5e7eb);
	color:var(--wr-muted,#6b7280);
	background:#fff;
	transition:all .2s;
	display:inline-block;
}
.wr-blog-filter-btn:hover,.wr-blog-filter-btn.active{background:var(--wr-navy,#010B44);color:#fff;border-color:var(--wr-navy,#010B44)}
.wr-blog-filter-btn.active.orange{background:var(--wr-orange,#FF6B00);border-color:var(--wr-orange,#FF6B00)}

.wr-blog-featured{
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:0;
	border-radius:20px;
	overflow:hidden;
	border:1px solid var(--wr-border,#e5e7eb);
	margin-bottom:3rem;
	transition:box-shadow .25s;
	color:inherit;
}
.wr-blog-featured:hover{box-shadow:0 20px 50px rgba(1,11,68,.1)}

.wr-blog-featured-thumb{
	background:linear-gradient(135deg,var(--wr-navy,#010B44),#0a1566);
	min-height:300px;
	display:flex;
	align-items:center;
	justify-content:center;
	position:relative;
	overflow:hidden;
}
.wr-blog-featured-thumb::before{
	content:'';
	position:absolute;
	top:-50px;
	right:-50px;
	width:300px;
	height:300px;
	background:radial-gradient(circle,rgba(255,107,0,.3) 0%,transparent 70%);
}
.wr-blog-featured-emoji{font-size:6rem;position:relative;z-index:1}
.wr-blog-featured-img,.wr-blog-card-img{width:100%;height:100%;object-fit:cover;display:block}
.wr-blog-featured-thumb .wr-blog-featured-img{min-height:300px}

.wr-blog-featured-body{padding:2.5rem;display:flex;flex-direction:column;justify-content:center}
.wr-blog-post-meta{display:flex;align-items:center;gap:10px;margin-bottom:1rem;flex-wrap:wrap}
.wr-blog-post-tag{
	display:inline-flex;
	padding:3px 12px;
	border-radius:100px;
	font-size:.72rem;
	font-weight:700;
	text-transform:uppercase;
	letter-spacing:.4px;
}
.wr-blog-post-tag.tutorial{background:rgba(0,148,242,.1);color:#0078c8}
.wr-blog-post-tag.update{background:rgba(255,107,0,.1);color:#e05500}
.wr-blog-post-tag.guide{background:rgba(0,200,100,.1);color:#00a84e}
.wr-blog-post-tag.tips{background:rgba(150,73,227,.1);color:#7a35c8}
.wr-blog-post-tag.news{background:rgba(255,107,0,.15);color:#e05500}
.wr-blog-post-date{font-size:.78rem;color:var(--wr-muted,#6b7280)}
.wr-blog-featured-body h2{font-size:1.7rem;font-weight:800;color:var(--wr-text,#1a1f3c);line-height:1.25;margin-bottom:.8rem}
.wr-blog-featured-body p{font-size:.9rem;color:var(--wr-muted,#6b7280);line-height:1.7;margin-bottom:1.5rem}
.wr-blog-post-footer{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.wr-blog-post-author{display:flex;align-items:center;gap:10px}
.wr-blog-author-avatar{
	width:34px;height:34px;border-radius:50%;
	background:linear-gradient(135deg,#010B44,#0094F2);
	display:flex;align-items:center;justify-content:center;
	color:#fff;font-size:.78rem;font-weight:700;flex-shrink:0;
}
.wr-blog-author-name{font-size:.82rem;font-weight:600;color:var(--wr-text,#1a1f3c)}
.wr-blog-author-role{font-size:.72rem;color:var(--wr-muted,#6b7280)}
.wr-blog-read-more{
	display:inline-flex;align-items:center;gap:6px;
	padding:9px 18px;background:var(--wr-navy,#010B44);color:#fff;
	border-radius:8px;font-size:.85rem;font-weight:600;transition:all .2s;
}
.wr-blog-read-more:hover{background:#0a1566;transform:translateY(-1px)}
.wr-blog-read-more.orange{background:var(--wr-orange,#FF6B00)}
.wr-blog-read-more.orange:hover{background:#e55f00}

.wr-blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;margin-bottom:3rem}
.wr-blog-card{
	border:1px solid var(--wr-border,#e5e7eb);
	border-radius:16px;overflow:hidden;transition:all .25s;
	display:flex;flex-direction:column;color:inherit;
}
.wr-blog-card:hover{transform:translateY(-4px);box-shadow:0 16px 40px rgba(1,11,68,.1);border-color:transparent}
.wr-blog-card-thumb{
	min-height:160px;display:flex;align-items:center;justify-content:center;
	font-size:3.5rem;position:relative;overflow:hidden;
}
.wr-blog-card-thumb.navy{background:linear-gradient(135deg,var(--wr-navy,#010B44),#0a1566)}
.wr-blog-card-thumb.orange{background:linear-gradient(135deg,#FF6B00,#ff9a3c)}
.wr-blog-card-thumb.blue{background:linear-gradient(135deg,#0078c8,#0094F2)}
.wr-blog-card-thumb.purple{background:linear-gradient(135deg,#7a35c8,#9649E3)}
.wr-blog-card-thumb.green{background:linear-gradient(135deg,#00a84e,#00c864)}
.wr-blog-card-body{padding:1.4rem;flex:1;display:flex;flex-direction:column}
.wr-blog-card-body .wr-blog-post-meta{margin-bottom:.7rem}
.wr-blog-card-body h3{font-size:1rem;font-weight:700;color:var(--wr-text,#1a1f3c);line-height:1.35;margin-bottom:.6rem;flex:1}
.wr-blog-card-body p{font-size:.82rem;color:var(--wr-muted,#6b7280);line-height:1.6;margin-bottom:1rem}
.wr-blog-card-footer{
	display:flex;align-items:center;justify-content:space-between;
	margin-top:auto;padding-top:.8rem;border-top:1px solid var(--wr-border,#e5e7eb);
}
.wr-blog-read-time{font-size:.75rem;color:var(--wr-muted,#6b7280)}
.wr-blog-card-link{font-size:.78rem;font-weight:600;color:var(--wr-orange,#FF6B00)}

.wr-blog-newsletter{
	background:var(--wr-light,#F4F6FB);
	border-radius:20px;padding:3rem;text-align:center;
	margin-bottom:3rem;border:1px solid var(--wr-border,#e5e7eb);
}
.wr-blog-newsletter h3{font-size:1.5rem;font-weight:800;color:var(--wr-text,#1a1f3c);margin-bottom:.6rem}
.wr-blog-newsletter p{font-size:.9rem;color:var(--wr-muted,#6b7280);margin-bottom:1.5rem}
.wr-blog-newsletter-form{display:flex;gap:10px;max-width:440px;margin:0 auto;flex-wrap:wrap}
.wr-blog-newsletter-input{
	flex:1;min-width:200px;padding:11px 16px;
	border:1px solid var(--wr-border,#e5e7eb);border-radius:10px;
	font-size:.9rem;font-family:inherit;outline:none;color:var(--wr-text,#1a1f3c);
}
.wr-blog-newsletter-input:focus{border-color:var(--wr-orange,#FF6B00)}
.wr-blog-newsletter-btn{
	padding:11px 22px;background:var(--wr-orange,#FF6B00);color:#fff;
	border:none;border-radius:10px;font-size:.9rem;font-weight:700;
	cursor:pointer;transition:all .2s;white-space:nowrap;
}
.wr-blog-newsletter-btn:hover{background:#e55f00;transform:translateY(-1px)}
.wr-blog-newsletter-note{font-size:.75rem;color:var(--wr-muted,#6b7280);margin-top:.8rem}

.wr-blog-load-more-wrap{text-align:center;padding:1rem 0}
.wr-blog-load-more{
	padding:13px 36px;border:2px solid var(--wr-navy,#010B44);
	color:var(--wr-navy,#010B44);border-radius:10px;
	font-size:.92rem;font-weight:700;cursor:pointer;
	transition:all .2s;background:#fff;
}
.wr-blog-load-more:hover{background:var(--wr-navy,#010B44);color:#fff}
.wr-blog-load-more:disabled{opacity:.5;cursor:not-allowed}

.wr-blog-layout{display:grid;grid-template-columns:1fr 280px;gap:3rem;align-items:start}
.wr-blog-sidebar-card{
	background:var(--wr-light,#F4F6FB);
	border-radius:16px;padding:1.5rem;margin-bottom:1.5rem;
	border:1px solid var(--wr-border,#e5e7eb);
}
.wr-blog-sidebar-title{
	font-size:.88rem;font-weight:700;color:var(--wr-text,#1a1f3c);
	margin-bottom:1rem;text-transform:uppercase;letter-spacing:.5px;
}
.wr-blog-topic-list{list-style:none;margin:0;padding:0}
.wr-blog-topic-list li{border-bottom:1px solid var(--wr-border,#e5e7eb)}
.wr-blog-topic-list li:last-child{border-bottom:none}
.wr-blog-topic-list a{
	display:flex;align-items:center;justify-content:space-between;
	padding:7px 0;font-size:.85rem;transition:color .2s;color:inherit;
}
.wr-blog-topic-list a:hover{color:var(--wr-orange,#FF6B00)}
.wr-blog-topic-list span{
	background:rgba(1,11,68,.08);color:var(--wr-text,#1a1f3c);
	padding:2px 8px;border-radius:100px;font-size:.72rem;font-weight:600;
}
.wr-blog-popular{
	display:flex;gap:12px;padding:8px 0;
	border-bottom:1px solid var(--wr-border,#e5e7eb);color:inherit;
}
.wr-blog-popular:last-child{border-bottom:none}
.wr-blog-popular-num{font-size:1.5rem;font-weight:900;color:var(--wr-border,#e5e7eb);min-width:28px}
.wr-blog-popular-text{font-size:.82rem;font-weight:600;color:var(--wr-text,#1a1f3c);line-height:1.4;transition:color .2s}
.wr-blog-popular:hover .wr-blog-popular-text{color:var(--wr-orange,#FF6B00)}
.wr-blog-popular-date{font-size:.72rem;color:var(--wr-muted,#6b7280);margin-top:3px}

.wr-blog-cta-banner{
	background:linear-gradient(135deg,var(--wr-navy,#010B44),#0a1566);
	border-radius:16px;padding:1.8rem;text-align:center;color:#fff;margin-bottom:1.5rem;
}
.wr-blog-cta-banner h4{font-size:1.05rem;font-weight:800;margin-bottom:.5rem}
.wr-blog-cta-banner p{font-size:.8rem;color:rgba(255,255,255,.7);margin-bottom:1rem;line-height:1.5}
.wr-blog-cta-banner-btn{
	display:block;padding:10px 0;background:var(--wr-orange,#FF6B00);
	color:#fff;border-radius:8px;font-size:.88rem;font-weight:700;transition:all .2s;
}
.wr-blog-cta-banner-btn:hover{background:#e55f00}

.wr-blog-version-row{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.wr-blog-version-pill{
	background:rgba(0,200,100,.12);color:#00a84e;
	padding:5px 14px;border-radius:100px;font-size:.85rem;font-weight:700;
}
.wr-blog-version-date{font-size:.78rem;color:var(--wr-muted,#6b7280)}
.wr-blog-version-desc{font-size:.8rem;color:var(--wr-muted,#6b7280);line-height:1.6;margin-bottom:12px}
.wr-blog-version-link{font-size:.82rem;font-weight:600;color:var(--wr-orange,#FF6B00)}

.wr-blog-empty{
	text-align:center;padding:3rem 1rem;
	background:var(--wr-light,#F4F6FB);border-radius:16px;margin-bottom:3rem;
}
.wr-blog-empty p{color:var(--wr-muted,#6b7280);margin-bottom:1.5rem}

.wr-blog-toast{
	position:fixed;bottom:2rem;right:2rem;
	background:var(--wr-navy,#010B44);color:#fff;
	padding:12px 20px;border-radius:10px;font-size:.88rem;font-weight:600;
	opacity:0;transform:translateY(10px);transition:all .3s;z-index:200;pointer-events:none;
}
.wr-blog-toast.wr-show{opacity:1;transform:translateY(0)}

/* Single post */
.wr-blog-single-hero .wr-blog-single-meta{justify-content:center}
.wr-blog-single-hero h1{font-size:2.4rem;margin-bottom:.8rem}
.wr-blog-single-byline{color:rgba(255,255,255,.65);font-size:.95rem}
.wr-blog-article{max-width:760px;margin:0 auto;padding:3rem 2rem 2rem}
.wr-blog-article-featured{margin-bottom:2rem;border-radius:16px;overflow:hidden}
.wr-blog-article-featured img{width:100%;height:auto;display:block}
.wr-blog-article-content{font-size:1rem;line-height:1.8;color:var(--wr-text,#1a1f3c)}
.wr-blog-article-content h2,.wr-blog-article-content h3{margin:2rem 0 1rem;font-weight:800}
.wr-blog-article-content p{margin-bottom:1.2rem}
.wr-blog-article-content ul,.wr-blog-article-content ol{margin:0 0 1.2rem 1.5rem}
.wr-blog-article-content img{max-width:100%;height:auto;border-radius:12px}
.wr-blog-article-content a{color:var(--wr-orange,#FF6B00)}
.wr-blog-article-nav{padding-top:2rem;border-top:1px solid var(--wr-border,#e5e7eb)}
.wr-blog-back-link{font-size:.9rem;font-weight:600;color:var(--wr-navy,#010B44)}
.wr-blog-back-link:hover{color:var(--wr-orange,#FF6B00)}

/* Single post layout + plugin promo sidebar */
.wr-blog-single-section{padding:0 2rem 80px;background:#fff}
.wr-blog-single-layout{align-items:start}
.wr-blog-single-layout .wr-blog-main{min-width:0}
.wr-blog-single-layout .wr-blog-article{max-width:none;margin:0;padding:0}
.wr-blog-single-sidebar{position:sticky;top:calc(var(--wr-header-h, 80px) + var(--wr-admin-bar-h, 0px) + 1.5rem)}

.wr-blog-plugin-promo-list{list-style:none;margin:0;padding:0}
.wr-blog-plugin-promo-list li{border-bottom:1px solid var(--wr-border,#e5e7eb)}
.wr-blog-plugin-promo-list li:last-child{border-bottom:none}
.wr-blog-plugin-promo-item{
	display:flex;gap:12px;padding:14px 0;color:inherit;transition:opacity .2s;
}
.wr-blog-plugin-promo-item:hover{opacity:.92}
.wr-blog-plugin-promo-item:hover .wr-blog-plugin-promo-name{color:var(--wr-orange,#FF6B00)}
.wr-blog-plugin-promo-icon{
	position:relative;width:48px;height:48px;flex-shrink:0;
}
.wr-blog-plugin-promo-icon img{
	width:48px;height:48px;border-radius:12px;display:block;
	box-shadow:0 4px 12px rgba(1,11,68,.08);
}
.wr-blog-plugin-promo-emoji{
	display:none;width:48px;height:48px;border-radius:12px;
	align-items:center;justify-content:center;
	background:linear-gradient(135deg,var(--wr-navy,#010B44),#0a1566);
	font-size:1.4rem;
}
.wr-blog-plugin-promo-body{display:flex;flex-direction:column;gap:4px;min-width:0}
.wr-blog-plugin-promo-name{
	font-size:.88rem;font-weight:700;color:var(--wr-text,#1a1f3c);
	line-height:1.3;transition:color .2s;
}
.wr-blog-plugin-promo-desc{
	font-size:.76rem;color:var(--wr-muted,#6b7280);line-height:1.5;
}
.wr-blog-plugin-promo-link{
	font-size:.72rem;font-weight:600;color:var(--wr-orange,#FF6B00);margin-top:2px;
}

@media(max-width:900px){
	.wr-blog-layout{grid-template-columns:1fr}
	.wr-blog-grid{grid-template-columns:1fr 1fr}
	.wr-blog-single-sidebar{position:static}
}

@media(max-width:768px){
	.wr-blog-content .wr-page-hero{padding:calc(var(--wr-header-h) + var(--wr-admin-bar-h) + 1.5rem) 1rem 50px}
	.wr-blog-content .wr-page-hero h1{font-size:2.2rem}
	.wr-blog-section{padding:60px 1rem}
	.wr-blog-featured{grid-template-columns:1fr}
	.wr-blog-grid{grid-template-columns:1fr}
	.wr-blog-article{padding:2rem 1rem}
	.wr-blog-single-section{padding:0 1rem 60px}
	.wr-blog-single-hero h1{font-size:1.85rem}
}
