/* Blog (home.php / single.php) — fully scoped under .blog-page so nothing collides with global theme styles. */
.blog-page{--orange:#ff4d13;--dark:#101722;--muted:#6b7280;--line:#e7e9ee;--soft:#f6f8fb;background:#fff;color:#101722}
.blog-page *{box-sizing:border-box}
.blog-page .page{overflow:hidden}.blog-page .hero{min-height:340px;display:grid;grid-template-columns:46% 54%;position:relative;align-items:center;background:linear-gradient(90deg,#fff 0%,#fff 40%,#eff7ff 100%);border-bottom:1px solid #edf0f4;overflow:hidden}.blog-page .hero:before{content:"";position:absolute;left:0;top:0;bottom:0;width:180px;background:url('../images/water-splash.png') left center/contain no-repeat;opacity:.3;z-index:1;pointer-events:none}.blog-page .hero:after{content:none!important;background:none!important;display:none!important}.blog-page .hero h1 span,.blog-page .hero h1 b{color:var(--orange)}.blog-page .heroText{padding:0 0 0 72px;z-index:2}.blog-page .eyebrow{color:var(--orange);font-weight:900;font-size:14px;letter-spacing:.02em}.blog-page .hero h1{font-size:44px;line-height:1.1;margin:14px 0 14px;letter-spacing:-1.5px;max-width:560px}.blog-page .hero h1 b,.blog-page .hero h1 span{color:var(--orange)}.blog-page .hero p{font-size:16px;line-height:1.7;color:#343b47;max-width:520px}.blog-page .heroVisual{position:relative;height:100%;min-height:340px;overflow:hidden;z-index:2}.blog-page .heroPhoto{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center right;z-index:1;display:block}.blog-page .heroVisual:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#fff 0%,rgba(255,255,255,.92) 8%,rgba(255,255,255,0) 30%);z-index:3;pointer-events:none}.blog-page .content{padding:32px 72px 40px}.blog-page .tabs{display:flex;gap:10px;margin:0 0 26px}.blog-page .tabs button{padding:10px 18px;border-radius:8px;background:#f4f6f9;color:#111827;font-weight:700;font-size:14px}.blog-page .tabs .on{background:var(--orange);color:white}.blog-page .blogLayout{display:grid;grid-template-columns:1fr 320px;gap:40px}.blog-page .grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;align-items:start}.blog-page .postCard{background:white;border:1px solid var(--line);border-radius:10px;overflow:hidden;box-shadow:0 8px 22px rgba(15,23,42,.05);transition:.22s;display:flex;flex-direction:column}.blog-page .postCard:hover{transform:translateY(-4px);box-shadow:0 24px 45px rgba(15,23,42,.09)}.blog-page .postCard img{height:150px;width:100%;object-fit:cover}.blog-page .postBody{padding:16px 18px}.blog-page .meta{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.blog-page .meta span{background:#fff2ed;color:var(--orange);padding:5px 10px;border-radius:20px;font-size:11px;font-weight:800}.blog-page .meta small, .blog-page .pop small{color:#7b8493;font-size:12px}.blog-page .postCard h3{font-size:17px;line-height:1.3;margin:0 0 10px}.blog-page .postCard p{color:#5c6574;line-height:1.6;font-size:14px;margin:0 0 14px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.blog-page .readMore{display:inline-flex;align-items:center;gap:6px;color:var(--orange);font-weight:800;text-decoration:none;font-size:14px}.blog-page .sidebar{display:flex;flex-direction:column;gap:20px}.blog-page .search{height:50px;border:1px solid var(--line);border-radius:10px;display:flex;align-items:center;padding:0 16px;box-shadow:0 8px 22px rgba(15,23,42,.05)}.blog-page .search input{flex:1;border:0;outline:0;font-size:15px}.blog-page .sideBox{border-bottom:1px solid var(--line);padding-bottom:18px}.blog-page .sideBox h3{font-size:19px;margin:0 0 14px;position:relative}.blog-page .sideBox h3:after{content:"";display:block;width:36px;height:3px;background:var(--orange);margin-top:10px;border-radius:4px}.blog-page .cat{display:flex;align-items:center;justify-content:space-between;padding:9px 12px;border-radius:8px;font-weight:700;font-size:14px;color:#303744}.blog-page .cat.selected{background:#fff1eb;color:var(--orange)}.blog-page .pop{display:grid;grid-template-columns:66px 1fr;gap:12px;margin-bottom:12px}.blog-page .pop img{width:66px;height:54px;border-radius:8px;object-fit:cover}.blog-page .pop b{font-size:13px;line-height:1.3;display:block}.blog-page .helpBox{background:linear-gradient(135deg,#fff3ed,#fff);padding:22px;border-radius:12px;position:relative;overflow:hidden}.blog-page .helpBox:after{content:"";position:absolute;right:-30px;bottom:-42px;width:180px;height:140px;background:url('../images/water-splash.png') center/contain no-repeat;opacity:.25}.blog-page .helpBox h3{color:var(--orange);font-size:19px;margin:0 0 10px}.blog-page .helpBox p{line-height:1.6;color:#505968;font-size:14px;margin:0 0 16px}.blog-page .pager{grid-column:1/-1;display:flex;justify-content:center;gap:8px;margin-top:6px}.blog-page .pager button{width:38px;height:38px;border:1px solid var(--line);background:#fff;border-radius:8px;font-weight:800;font-size:14px}.blog-page .pager .activePage{background:var(--orange);color:white;border-color:var(--orange)}@media(max-width:1000px){.blog-page .hero{min-height:0;grid-template-columns:1fr;padding:40px 20px 0;text-align:center}.blog-page .heroText{padding:0}.blog-page .hero h1,.blog-page .hero p{margin-left:auto;margin-right:auto}.blog-page .hero h1{font-size:42px}.blog-page .heroVisual{height:240px;margin-top:24px}.blog-page .content{padding:34px 20px}.blog-page .blogLayout{grid-template-columns:1fr}.blog-page .grid{grid-template-columns:1fr}.blog-page .footerTop{padding:40px 20px;grid-template-columns:1fr}.blog-page .tabs{overflow:auto}.blog-page .heroVisual:before{display:none}}
/* ---------- SINGLE POST ---------- */
.blog-single .single-head { background: var(--soft); border-bottom: 1px solid var(--line); padding: 44px 72px; }
.blog-single .single-head-inner { max-width: 1180px; margin: 0 auto; }
.blog-single .single-back { color: var(--orange); font-weight: 800; text-decoration: none; font-size: 14px; }
.blog-single .single-meta { display: flex; align-items: center; gap: 14px; margin: 18px 0 12px; }
.blog-single .single-meta span { background: #fff2ed; color: var(--orange); padding: 7px 12px; border-radius: 20px; font-size: 12px; font-weight: 800; }
.blog-single .single-meta small { color: #7b8493; }
.blog-single .single-head h1 { font-size: 40px; line-height: 1.18; letter-spacing: -1px; margin: 0; max-width: 900px; }
.blog-single .single-article { min-width: 0; }
.blog-single .single-hero-img { width: 100%; height: 380px; object-fit: cover; border-radius: 14px; margin-bottom: 32px; }
.blog-single .single-body { color: #3f4654; line-height: 1.9; font-size: 17px; }
.blog-single .single-body p { margin: 0 0 22px; }
.blog-single .single-body h2 { font-size: 28px; margin: 36px 0 16px; color: var(--dark); }
.blog-single .single-body h3 { font-size: 22px; margin: 30px 0 14px; color: var(--dark); }
.blog-single .single-body img { max-width: 100%; border-radius: 12px; margin: 20px 0; }
.blog-single .single-body a { color: var(--orange); }
.blog-single .single-body ul, .blog-single .single-body ol { padding-left: 20px; margin: 0 0 22px; }
.blog-single .single-body li { margin: 8px 0; }
.blog-single .single-share { display: flex; align-items: center; gap: 12px; margin: 40px 0 0; padding-top: 26px; border-top: 1px solid var(--line); }
.blog-single .single-share span { font-weight: 800; }
.blog-single .single-share a { width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 50%; color: var(--dark); text-decoration: none; font-weight: 700; transition: .2s ease; }
.blog-single .single-share a:hover { background: var(--orange); color: #fff; border-color: var(--orange); }
@media (max-width: 1000px) {
	.blog-single .single-head { padding: 32px 20px; }
	.blog-single .single-head h1 { font-size: 30px; }
	.blog-single .single-hero-img { height: 240px; }
}
