@import url('https://fonts.googleapis.com/css2?family=Vazirmatn:wght@400;500;600;700;800&display=swap');
*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:'Vazirmatn',sans-serif;
  background:linear-gradient(160deg,#FDE7F6 0%,#E7F0FF 45%,#FFF6DE 100%);
  color:#3B3355;
  min-height:100vh;
}
a{text-decoration:none;color:inherit;}
img{max-width:100%;display:block;}
.wrap{max-width:1100px;margin:0 auto;padding:0 24px;}

header{display:flex;align-items:center;justify-content:space-between;padding:20px 24px;max-width:1100px;margin:0 auto;flex-wrap:wrap;gap:14px;}
.logo{display:flex;align-items:center;gap:10px;}
.logo-icon{width:40px;height:40px;border-radius:12px;flex-shrink:0;display:block;}
.logo-text{font-weight:800;font-size:17px;}
nav.top-nav{display:flex;align-items:center;gap:22px;font-size:13.5px;font-weight:700;color:#6B5D89;}
nav.top-nav a:hover{color:#B45FC9;}
.btn{display:inline-flex;align-items:center;gap:8px;border:none;cursor:pointer;font-family:inherit;font-weight:700;}
.btn-primary{padding:9px 20px;border-radius:10px;background:linear-gradient(90deg,#C084FC,#F472B6);color:#fff;font-size:13.5px;}
.btn-large{padding:14px 28px;border-radius:12px;background:linear-gradient(90deg,#C084FC,#F472B6);color:#fff;font-size:15px;box-shadow:0 10px 30px rgba(192,132,252,0.4);}

.breadcrumb{max-width:760px;margin:10px auto 0;padding:0 24px;font-size:12.5px;color:#8B7CA8;}
.breadcrumb a{color:#B45FC9;font-weight:700;}

/* ===== Blog index ===== */
.blog-hero{max-width:760px;margin:36px auto 0;padding:0 24px;text-align:center;}
.badge{display:inline-flex;align-items:center;gap:6px;background:#fff;padding:6px 14px;border-radius:20px;font-size:12px;font-weight:700;color:#B45FC9;margin-bottom:18px;box-shadow:0 4px 14px rgba(180,95,201,0.12);}
.blog-hero h1{font-size:clamp(26px,4.5vw,38px);font-weight:800;line-height:1.4;margin-bottom:16px;}
.gradient-text{background:linear-gradient(90deg,#C084FC,#F472B6);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.blog-hero p{font-size:15px;color:#8B7CA8;line-height:1.9;}

.post-grid{max-width:980px;margin:50px auto 0;padding:0 24px 40px;display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:22px;}
.post-card{background:#fff;border-radius:20px;overflow:hidden;box-shadow:0 8px 26px rgba(196,132,252,0.12);display:flex;flex-direction:column;transition:transform .18s ease,box-shadow .18s ease;}
.post-card:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(196,132,252,0.2);}
.post-card .cover{height:150px;display:flex;align-items:center;justify-content:center;overflow:hidden;}
.post-card .cover img{width:130px;height:130px;}
.post-card-body{padding:20px 20px 24px;display:flex;flex-direction:column;gap:10px;flex:1;}
.post-tag{display:inline-flex;align-self:flex-start;font-size:11px;font-weight:800;color:#B45FC9;background:#F7EEFF;padding:4px 11px;border-radius:20px;}
.post-card h2{font-size:16.5px;font-weight:800;line-height:1.6;}
.post-card p{font-size:13px;color:#8B7CA8;line-height:1.85;flex:1;}
.post-more{font-size:12.5px;font-weight:800;color:#B45FC9;margin-top:4px;}

/* ===== Single post ===== */
.post-header{max-width:760px;margin:22px auto 0;padding:0 24px;text-align:center;}
.post-header .post-tag{margin-bottom:16px;}
.post-header h1{font-size:clamp(24px,4.4vw,36px);font-weight:800;line-height:1.5;margin-bottom:16px;}
.post-meta{display:flex;align-items:center;justify-content:center;gap:16px;font-size:12.5px;color:#8B7CA8;flex-wrap:wrap;}

.cover-placeholder{max-width:760px;margin:28px auto 0;padding:0 24px;}
.cover-placeholder .box{
  border-radius:24px;height:220px;display:flex;align-items:center;justify-content:center;
  box-shadow:0 10px 34px rgba(196,132,252,0.16);overflow:hidden;
}
.cover-placeholder .box img{width:190px;height:190px;}

article.post-body{max-width:720px;margin:36px auto 0;padding:0 24px 20px;font-size:15.5px;line-height:2.15;color:#4B4166;}
article.post-body h2{font-size:21px;font-weight:800;color:#3B3355;margin:38px 0 16px;}
article.post-body h3{font-size:17px;font-weight:800;color:#3B3355;margin:26px 0 12px;}
article.post-body p{margin-bottom:18px;}
article.post-body ul,article.post-body ol{margin:0 0 20px;padding-inline-start:26px;}
article.post-body li{margin-bottom:10px;}
article.post-body strong{color:#3B3355;}
article.post-body blockquote{
  background:linear-gradient(120deg,#FBF3FF,#F3F0FF);
  border-radius:16px;padding:18px 20px;margin:26px 0;
  border-right:4px solid #C084FC;font-weight:700;color:#3B3355;font-size:15px;
}

.inline-cta{max-width:720px;margin:34px auto;padding:0 24px;}
.inline-cta .box{
  background:linear-gradient(120deg,#3B3355,#5B3B7A);border-radius:20px;
  padding:26px 24px;text-align:center;color:#fff;
}
.inline-cta h3{color:#fff;font-size:17px;margin-bottom:8px;}
.inline-cta p{color:rgba(255,255,255,0.75);font-size:13.5px;margin-bottom:18px;line-height:1.85;}

.faq{max-width:720px;margin:10px auto 0;padding:0 24px 10px;}
.faq h2{font-size:21px;font-weight:800;color:#3B3355;margin-bottom:18px;}
.faq-item{background:#fff;border-radius:14px;padding:18px 20px;margin-bottom:12px;box-shadow:0 6px 18px rgba(196,132,252,0.08);}
.faq-item .q{font-weight:800;font-size:14.5px;color:#3B3355;margin-bottom:8px;display:flex;gap:8px;}
.faq-item .a{font-size:13.5px;color:#6B5D89;line-height:1.9;}

.related{max-width:980px;margin:60px auto 0;padding:0 24px;}
.related h2{font-size:20px;font-weight:800;text-align:center;margin-bottom:26px;}

footer{text-align:center;padding:60px 24px 30px;color:#8B7CA8;font-size:12px;}

@media (max-width:600px){
  header{justify-content:space-between;}
  nav.top-nav{order:3;width:100%;justify-content:center;}
}