/* ============================================================
   SHARED BLOG CSS — applies to all 3 blog article pages
   blog/kailash-mansarovar-yatra-guide
   blog/everest-base-camp-trek-preparation
   blog/leh-ladakh-bike-trip-packing-list
   ============================================================ */

/* POST HERO */
.post-hero{padding-top:70px;position:relative;height:480px;display:flex;align-items:flex-end}
.post-hero-bg{position:absolute;inset:0;z-index:0}
.post-hero-bg img{width:100%;height:100%;object-fit:cover;display:block}
.post-hero-bg::after{
  content:'';position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,.05) 0%,rgba(0,0,0,0) 30%,rgba(0,0,0,.45) 100%);
}
.post-hero-content{position:relative;z-index:1;padding:0 7% 3rem;max-width:900px}
.post-breadcrumb{display:flex;align-items:center;gap:.5rem;color:var(--muted);font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;margin-bottom:1rem}
.post-breadcrumb a{color:var(--gold);transition:opacity .2s}
.post-breadcrumb a:hover{opacity:.75}
.post-tag{display:inline-block;background:rgba(201,168,76,.15);border:1px solid rgba(201,168,76,.3);color:var(--gold);font-size:.7rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;padding:.3rem .8rem;border-radius:20px;margin-bottom:1rem}
.post-hero h1{font-family:var(--serif);font-size:clamp(1.8rem,4vw,3rem);font-weight:400;line-height:1.2;margin-bottom:.8rem}
.post-meta{color:var(--muted);font-size:.82rem}

/* POST CONTENT */
.post-wrap{max-width:980px;margin:0 auto;padding:60px 7%}
.post-content h2{font-family:var(--serif);font-size:1.7rem;font-weight:400;margin:2.5rem 0 1rem;color:var(--white)}
.post-content h3{font-size:1.05rem;font-weight:600;margin:1.8rem 0 .6rem;color:var(--gold-light)}
.post-content p{color:rgba(255,255,255,.78);line-height:1.9;margin-bottom:1.2rem;font-size:.97rem}
.post-content ul,.post-content ol{color:rgba(255,255,255,.78);line-height:1.9;padding-left:1.4rem;margin-bottom:1.2rem;font-size:.97rem}
.post-content li{margin-bottom:.4rem}
.post-content strong{color:var(--white);font-weight:600}

/* INFO BOX */
.info-box{background:var(--card);border:1px solid rgba(201,168,76,.25);border-left:3px solid var(--gold);border-radius:10px;padding:1.4rem 1.6rem;margin:2rem 0}
.info-box h4{color:var(--gold);font-size:.82rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;margin-bottom:.6rem}
.info-box p,.info-box ul{margin:0;color:var(--muted);font-size:.88rem}
.info-box ul{padding-left:1.2rem}
.info-box li{margin-bottom:.3rem}

/* DIVIDER & FIGURE */
.post-divider{width:60px;height:2px;background:var(--gold);margin:2.5rem 0;opacity:.4}
.post-figure{margin:2rem 0 2.4rem}
.post-figure img{width:100%;display:block;border-radius:18px;border:1px solid rgba(255,255,255,.08)}

/* POST CTA */
.post-cta{background:linear-gradient(135deg,var(--dark3),var(--card));border:1px solid rgba(201,168,76,.2);border-radius:16px;padding:2rem 2.2rem;margin:3rem 0;text-align:center}
.post-cta h3{font-family:var(--serif);font-size:1.5rem;font-weight:400;margin-bottom:.5rem}
.post-cta h3 em{color:var(--gold);font-style:italic}
.post-cta p{color:var(--muted);font-size:.88rem;margin-bottom:1.5rem}

/* BACK LINK */
.post-back{display:inline-flex;align-items:center;gap:.5rem;color:var(--muted);font-size:.85rem;transition:color .2s;margin-bottom:2rem}
.post-back:hover{color:var(--gold)}

/* RESPONSIVE */
@media(max-width:768px){
  .post-hero{height:400px}
  .post-hero-content{padding:0 5% 2.5rem}
  .post-wrap{padding:40px 5%}
  .btn-ghost{margin-left:0;margin-top:.8rem}
}