/*
Theme Name: Hari Om Blog
Theme URI: https://www.hariomtoursandtravels.com
Author: OptiNest Solutions
Author URI: https://optinest.in
Description: Custom blog theme matching Hari Om Tours and Travels main website. Red and navy modern design.
Version: 1.0
License: GNU General Public License v2 or later
Text Domain: hariom-blog
*/

:root{
  --red:#e11d2a; --red-d:#b8141f; --ink:#141b2e; --ink-2:#1e2740;
  --amber:#f5a623; --grey:#f4f5f7; --line:#e7e9ee;
}
*{margin:0;padding:0;box-sizing:border-box;}
html,body{overflow-x:hidden;}
body{font-family:'Segoe UI',system-ui,Arial,sans-serif;color:#222;line-height:1.6;background:#fff;}
a{text-decoration:none;color:inherit;}
img{max-width:100%;display:block;}
.wrap{max-width:1200px;margin:0 auto;padding:0 18px;}
.btn{display:inline-block;background:var(--red);color:#fff;padding:13px 30px;border-radius:8px;font-weight:700;transition:.2s;border:0;cursor:pointer;}
.btn:hover{background:var(--red-d);transform:translateY(-2px);}
.btn-ghost{background:transparent;border:2px solid #fff;}
.btn-ghost:hover{background:#fff;color:var(--ink);}
.sec{padding:60px 0;}
.sec-head{text-align:center;max-width:640px;margin:0 auto 40px;}
.sec-head .kick{color:var(--red);font-weight:800;letter-spacing:2px;text-transform:uppercase;font-size:13px;}
.sec-head h2{font-size:34px;font-weight:800;color:var(--ink);margin:6px 0 10px;line-height:1.2;}
.sec-head p{color:#667;}
@media(max-width:600px){.sec-head h2{font-size:26px;}}

/* ---------- HEADER ---------- */
.hdr{background:#fff;box-shadow:0 2px 14px rgba(0,0,0,.07);position:sticky;top:0;z-index:600;}
.hdr .in{display:flex;align-items:center;justify-content:space-between;padding:14px 0;}
.brand{font-size:26px;font-weight:900;color:var(--red);line-height:1;}
.brand span{display:block;font-size:10px;letter-spacing:4px;color:var(--ink);font-weight:700;margin-top:3px;}
.nav{display:flex;gap:4px;align-items:center;}
.nav a{padding:9px 14px;font-weight:600;font-size:14px;color:#333;border-radius:6px;transition:.2s;}
.nav a:hover,.nav a.on{background:var(--red);color:#fff;}
.nav .callbtn{background:var(--ink);color:#fff;padding:9px 18px;border-radius:6px;}
.nav .callbtn:hover{background:var(--red);}
.burger{display:none;font-size:24px;background:none;border:0;color:var(--ink);cursor:pointer;}
@media(max-width:920px){
  .burger{display:block;}
  .nav{position:fixed;inset:64px 0 auto 0;background:#fff;flex-direction:column;padding:10px 18px 20px;gap:2px;box-shadow:0 10px 20px rgba(0,0,0,.1);transform:translateY(-120%);transition:.3s;}
  .nav.show{transform:translateY(0);}
  .nav a{width:100%;padding:12px;}
}

/* ---------- HERO ---------- */
.hero{position:relative;min-height:540px;overflow:hidden;background:var(--ink);}
.hero .slide{position:absolute;inset:0;opacity:0;transition:opacity .8s;display:flex;align-items:center;
  background-size:cover;background-position:center;}
.hero .slide.on{opacity:1;}
.hero .slide::before{content:'';position:absolute;inset:0;
  background:linear-gradient(105deg,rgba(20,27,46,.92) 0%,rgba(20,27,46,.72) 45%,rgba(20,27,46,.30) 100%);}
.hero .c{position:relative;color:#fff;max-width:640px;padding:40px 0;}
.hero .tag{display:inline-block;background:var(--red);padding:6px 16px;border-radius:30px;font-size:12px;font-weight:800;letter-spacing:1px;text-transform:uppercase;margin-bottom:16px;}
.hero h1{font-size:52px;font-weight:900;line-height:1.08;margin-bottom:14px;text-shadow:0 3px 16px rgba(0,0,0,.4);}
.hero p{font-size:19px;margin-bottom:26px;opacity:.95;max-width:520px;}
.hero .cta{display:flex;gap:14px;flex-wrap:wrap;}
@media(max-width:600px){.hero{min-height:460px;}.hero h1{font-size:32px;}.hero p{font-size:16px;}}
.dots{position:absolute;bottom:20px;left:0;right:0;display:flex;gap:8px;justify-content:center;z-index:3;}
.dots button{width:11px;height:11px;border-radius:50%;border:0;background:rgba(255,255,255,.5);cursor:pointer;}
.dots button.on{background:var(--red);width:28px;border-radius:6px;}

/* ---------- QUICK STRIP (contact bar under hero) ---------- */
.qstrip{background:var(--red);color:#fff;}
.qstrip .in{display:flex;flex-wrap:wrap;justify-content:space-around;gap:14px;padding:16px 0;text-align:center;}
.qstrip .qi{display:flex;align-items:center;gap:10px;font-weight:600;font-size:15px;}
.qstrip .qi i{font-size:22px;}

/* ---------- VEHICLE CARDS (primary) ---------- */
.vgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;}
@media(max-width:900px){.vgrid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:520px){.vgrid{grid-template-columns:1fr;}}
.vcard{position:relative;border-radius:14px;overflow:hidden;min-height:280px;display:flex;align-items:flex-end;
  background-size:cover;background-position:center;box-shadow:0 8px 22px rgba(0,0,0,.12);transition:.25s;}
.vcard:hover{transform:translateY(-6px);box-shadow:0 14px 30px rgba(0,0,0,.2);}
.vcard::before{content:'';position:absolute;inset:0;background:linear-gradient(to top,rgba(20,27,46,.92),rgba(20,27,46,.15) 60%,transparent);}
.vcard .vb{position:relative;padding:22px;color:#fff;width:100%;}
.vcard .vb i{font-size:26px;color:var(--amber);margin-bottom:8px;display:block;}
.vcard .vb h3{font-size:21px;font-weight:800;margin-bottom:4px;}
.vcard .vb p{font-size:13px;opacity:.9;margin-bottom:12px;}
.vcard .vb .go{display:inline-flex;align-items:center;gap:7px;background:var(--red);padding:8px 16px;border-radius:6px;font-weight:700;font-size:13px;}

/* ---------- QUOTE FORM ---------- */
.quote{background:var(--ink);position:relative;overflow:hidden;}
.quote::after{content:'';position:absolute;right:-120px;top:-120px;width:340px;height:340px;background:var(--red);opacity:.18;border-radius:50%;}
.quote .qg{display:grid;grid-template-columns:1fr 1.1fr;gap:44px;align-items:center;position:relative;}
@media(max-width:850px){.quote .qg{grid-template-columns:1fr;gap:28px;}}
.quote .ql h2{color:#fff;font-size:32px;font-weight:800;line-height:1.2;margin-bottom:14px;}
.quote .ql p{color:#c7cbd6;margin-bottom:18px;}
.quote .ql .pts li{color:#dfe2ea;list-style:none;padding:6px 0;display:flex;align-items:center;gap:10px;}
.quote .ql .pts i{color:var(--amber);}
.qform{background:#fff;border-radius:14px;padding:28px;box-shadow:0 20px 40px rgba(0,0,0,.3);}
.qform h3{font-size:20px;color:var(--ink);margin-bottom:4px;}
.qform .sub{font-size:13px;color:#889;margin-bottom:16px;}
.qform .row{display:flex;gap:12px;}
.qform .row>*{flex:1;}
.qform input,.qform select,.qform textarea{width:100%;padding:12px;border:1px solid #d5d8e0;border-radius:8px;font-size:14px;margin-bottom:12px;font-family:inherit;background:#fff;}
.qform input:focus,.qform select:focus,.qform textarea:focus{outline:0;border-color:var(--red);}
.qform .fbtn{width:100%;background:var(--red);color:#fff;border:0;padding:14px;border-radius:8px;font-weight:800;font-size:16px;cursor:pointer;transition:.2s;}
.qform .fbtn:hover{background:var(--red-d);}

/* ---------- WHY US ---------- */
.why{background:var(--grey);}
.wgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;}
@media(max-width:900px){.wgrid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:480px){.wgrid{grid-template-columns:1fr;}}
.wcard{background:#fff;border-radius:12px;padding:26px 22px;text-align:center;box-shadow:0 4px 14px rgba(0,0,0,.05);transition:.2s;}
.wcard:hover{transform:translateY(-4px);box-shadow:0 10px 24px rgba(0,0,0,.1);}
.wcard .ic{width:62px;height:62px;border-radius:50%;background:var(--red);color:#fff;display:flex;align-items:center;justify-content:center;font-size:26px;margin:0 auto 14px;}
.wcard h4{color:var(--ink);font-size:17px;margin-bottom:6px;}
.wcard p{font-size:14px;color:#667;}

/* ---------- PACKAGES (secondary) ---------- */
.pgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
@media(max-width:900px){.pgrid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:520px){.pgrid{grid-template-columns:1fr;}}
.pcard{border:1px solid var(--line);border-radius:12px;overflow:hidden;display:flex;flex-direction:column;background:#fff;transition:.2s;}
.pcard:hover{box-shadow:0 12px 26px rgba(0,0,0,.12);transform:translateY(-4px);}
.pcard .ph{background:var(--ink);color:#fff;text-align:center;padding:14px;font-weight:800;position:relative;}
.pcard .ph .price{display:block;color:var(--amber);font-size:13px;margin-top:3px;font-weight:700;}
.pcard .pi{height:150px;background:#e9e9e9 center/cover no-repeat;}
.pcard .pbody{padding:16px;flex:1;}
.pcard .pbody li{font-size:13px;color:#556;margin:6px 0;list-style:none;display:flex;gap:8px;}
.pcard .pbody li i{color:var(--red);margin-top:3px;}
.pcard .pbtn{display:block;text-align:center;background:var(--red);color:#fff;font-weight:700;padding:12px;}
.pcard .pbtn:hover{background:var(--red-d);}

/* ---------- STATS ---------- */
.stats{background:var(--ink);color:#fff;}
.sgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;text-align:center;}
@media(max-width:560px){.sgrid{grid-template-columns:repeat(2,1fr);}}
.stat i{font-size:28px;color:var(--amber);}
.stat b{display:block;font-size:34px;font-weight:900;margin-top:6px;}
.stat span{color:#aeb4c2;font-size:14px;}

/* ---------- FAQ ---------- */
.faq{max-width:860px;margin:0 auto;}
.fitem{border:1px solid var(--line);border-radius:10px;margin-bottom:12px;overflow:hidden;background:#fff;}
.fq{width:100%;text-align:left;background:#fff;border:0;padding:17px 50px 17px 20px;font-size:16px;font-weight:700;color:var(--ink);cursor:pointer;position:relative;}
.fq:hover{background:#fafafa;}
.fq .pm{position:absolute;right:20px;top:50%;transform:translateY(-50%);color:var(--red);font-size:22px;transition:.2s;}
.fitem.op .fq .pm{transform:translateY(-50%) rotate(45deg);}
.fa2{max-height:0;overflow:hidden;transition:max-height .3s;padding:0 20px;}
.fitem.op .fa2{max-height:220px;padding:0 20px 18px;}
.fa2 p{color:#556;font-size:15px;}

/* ---------- CTA STRIP ---------- */
.ctas{background:linear-gradient(100deg,var(--red),var(--red-d));color:#fff;text-align:center;padding:46px 0;}
.ctas h2{font-size:30px;font-weight:900;margin-bottom:8px;}
.ctas p{opacity:.95;margin-bottom:20px;}
.ctas .btns{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;}
.ctas .wbtn{background:#25D366;}
.ctas .wbtn:hover{background:#1da851;}
.ctas .cbtn{background:#fff;color:var(--red);}

/* ---------- FOOTER ---------- */
.ft{background:#0e1524;color:#aeb4c2;padding:56px 0 0;}
.ftg{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.3fr;gap:32px;padding-bottom:36px;}
@media(max-width:820px){.ftg{grid-template-columns:1fr 1fr;gap:26px;}}
@media(max-width:480px){.ftg{grid-template-columns:1fr;}}
.ft h4{color:#fff;font-size:16px;margin-bottom:16px;position:relative;padding-bottom:10px;}
.ft h4::after{content:'';position:absolute;left:0;bottom:0;width:34px;height:3px;background:var(--red);border-radius:2px;}
.ft .fbrand{font-size:24px;font-weight:900;color:var(--red);margin-bottom:10px;}
.ft p{font-size:14px;margin-bottom:10px;line-height:1.7;}
.ft a{color:#aeb4c2;font-size:14px;transition:.2s;}
.ft a:hover{color:var(--red);}
.ft .flinks a{display:block;padding:5px 0;}
.ft .flinks a::before{content:'\00BB';color:var(--red);margin-right:8px;}
.ft .contact-li{display:flex;gap:12px;margin-bottom:12px;font-size:14px;align-items:flex-start;}
.ft .contact-li i{color:var(--red);margin-top:4px;width:16px;}
.ft .social{display:flex;gap:10px;margin-top:14px;}
.ft .social a{width:38px;height:38px;border-radius:50%;background:#1b2334;display:flex;align-items:center;justify-content:center;color:#fff;}
.ft .social a:hover{background:var(--red);}
.ftbar{border-top:1px solid #1b2334;padding:18px 0;text-align:center;font-size:13px;}
.ftbar a{color:var(--red);font-weight:700;}

/* WhatsApp float */
.wafloat{position:fixed;bottom:22px;right:22px;width:58px;height:58px;background:#25D366;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 6px 18px rgba(0,0,0,.3);z-index:900;}
.wafloat i{color:#fff;font-size:30px;}

/* ---------- BLOG-SPECIFIC STYLES ---------- */
body.blog-body{background:#f4f5f7;}
.blog-wrap{max-width:1140px;margin:0 auto;padding:0 20px;}
.blog-banner{background:linear-gradient(135deg,var(--ink),var(--ink-2));color:#fff;padding:60px 0;text-align:center;}
.blog-banner h1{font-size:36px;font-weight:800;margin-bottom:8px;}
.blog-banner p{opacity:.85;font-size:16px;}
.blog-layout{display:grid;grid-template-columns:1fr 320px;gap:40px;padding:50px 0;}
@media(max-width:900px){.blog-layout{grid-template-columns:1fr;}}
.post-card{background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden;margin-bottom:30px;box-shadow:0 4px 14px rgba(0,0,0,.06);transition:.25s;}
.post-card:hover{transform:translateY(-4px);box-shadow:0 12px 28px rgba(0,0,0,.12);}
.post-thumb{height:230px;background:#e9e9e9 center/cover no-repeat;display:block;}
.post-body{padding:24px;}
.post-meta{font-size:13px;color:#889;margin-bottom:10px;}
.post-meta i{color:var(--red);margin-right:5px;}
.post-body h2{font-size:23px;margin-bottom:12px;line-height:1.3;}
.post-body h2 a{color:var(--ink);}
.post-body h2 a:hover{color:var(--red);}
.post-excerpt{color:#667;font-size:15px;line-height:1.7;margin-bottom:16px;}
.read-more{display:inline-flex;align-items:center;gap:6px;background:var(--red);color:#fff;padding:9px 20px;border-radius:8px;font-weight:700;font-size:14px;}
.read-more:hover{background:var(--red-d);}
/* single post */
.single-post{background:#fff;border-radius:14px;padding:36px;box-shadow:0 4px 14px rgba(0,0,0,.06);}
.single-post h1{font-size:32px;color:var(--ink);margin-bottom:14px;line-height:1.25;}
.single-post .post-hero{width:100%;border-radius:12px;margin:18px 0;}
.single-post p{color:#445;font-size:16px;line-height:1.85;margin-bottom:18px;}
.single-post h2,.single-post h3{color:var(--ink);margin:26px 0 12px;}
.single-post img{max-width:100%;height:auto;border-radius:10px;}
.single-post a{color:var(--red);text-decoration:underline;}
.single-post ul,.single-post ol{margin:0 0 18px 22px;color:#445;line-height:1.8;}
/* sidebar */
.blog-side .widget{background:#fff;border:1px solid var(--line);border-radius:14px;padding:22px;margin-bottom:24px;}
.blog-side .widget h3{font-size:18px;color:var(--ink);margin-bottom:14px;border-left:4px solid var(--red);padding-left:10px;}
.blog-side .widget ul{list-style:none;}
.blog-side .widget li{padding:8px 0;border-bottom:1px solid #eef0f4;}
.blog-side .widget li:last-child{border-bottom:0;}
.blog-side .widget a{color:#445;font-size:14px;}
.blog-side .widget a:hover{color:var(--red);}
.side-cta{background:linear-gradient(135deg,var(--red),var(--red-d));color:#fff;border-radius:14px;padding:26px;text-align:center;}
.side-cta h3{color:#fff;border:0;padding:0;font-size:20px;margin-bottom:8px;}
.side-cta p{font-size:14px;opacity:.9;margin-bottom:16px;}
.side-cta a{background:#fff;color:var(--red);padding:11px 22px;border-radius:8px;font-weight:800;display:inline-block;}
.pagination{display:flex;gap:8px;justify-content:center;margin-top:20px;flex-wrap:wrap;}
.pagination a,.pagination span{padding:9px 15px;border-radius:8px;background:#fff;border:1px solid var(--line);font-weight:700;color:var(--ink);}
.pagination .current{background:var(--red);color:#fff;border-color:var(--red);}


/* Logo image (matches main site) */
.brand{display:flex;align-items:center;}
.brand-img{height:52px;width:auto;max-width:220px;object-fit:contain;display:block;}
@media(max-width:600px){.brand-img{height:42px;max-width:170px;}}


/* Footer logo image */
.ft .fbrand-img{height:56px;width:auto;max-width:200px;object-fit:contain;display:block;margin-bottom:10px;}


/* ============================================================
   HIGH-SPECIFICITY OVERRIDES
   These sit last and use !important so no plugin/WP default
   CSS can break the header layout.
   ============================================================ */
body.blog-body .hdr .brand{display:flex !important;align-items:center !important;text-decoration:none !important;}
body.blog-body .hdr .brand-img{height:52px !important;width:auto !important;max-width:220px !important;object-fit:contain !important;display:block !important;}
@media(max-width:600px){
  body.blog-body .hdr .brand-img{height:40px !important;max-width:150px !important;}
}
body.blog-body .hdr .in{display:flex !important;align-items:center !important;justify-content:space-between !important;gap:20px;flex-wrap:nowrap;}
body.blog-body .nav{display:flex !important;gap:4px !important;align-items:center !important;flex-wrap:wrap;}
body.blog-body .nav a{
  padding:9px 14px !important;
  font-weight:600 !important;
  font-size:14px !important;
  color:#333 !important;
  border-radius:6px !important;
  text-decoration:none !important;
  border-bottom:0 !important;
  white-space:nowrap;
  line-height:1.2 !important;
}
body.blog-body .nav a:hover,
body.blog-body .nav a.on{background:#e11d2a !important;color:#fff !important;text-decoration:none !important;}
/* kill underlines site-wide in header/footer */
body.blog-body .hdr a,body.blog-body .ft a{text-decoration:none !important;}
body.blog-body .ft .fbrand-img{height:56px !important;width:auto !important;max-width:200px !important;object-fit:contain !important;}


/* ---- BANNER TITLE + MOBILE FIXES ---- */
body.blog-body .blog-banner{padding:50px 0 !important;}
body.blog-body .blog-banner h1,
body.blog-body .blog-banner h1 a{
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
  text-shadow:none !important;
  font-size:34px !important;
  line-height:1.25 !important;
  word-wrap:break-word;
  overflow-wrap:break-word;
}
body.blog-body .blog-banner p{color:#fff !important;-webkit-text-fill-color:#fff !important;}

/* Mobile: stop side-by-side cutting */
@media(max-width:900px){
  body.blog-body .blog-layout{grid-template-columns:1fr !important;gap:26px !important;padding:30px 0 !important;}
}
@media(max-width:600px){
  body.blog-body .blog-banner{padding:34px 0 !important;}
  body.blog-body .blog-banner h1{font-size:22px !important;}
  body.blog-body .blog-wrap{padding:0 14px !important;}
  body.blog-body .single-post{padding:20px !important;}
  body.blog-body .single-post h1{font-size:24px !important;}
  body.blog-body .post-body h2{font-size:19px !important;}
}
/* never let images/tables blow out the layout */
body.blog-body img,body.blog-body iframe,body.blog-body table{max-width:100% !important;height:auto;}
body.blog-body .single-post{overflow-wrap:break-word;}
