/* Himachal Online Cab — site-wide header & footer (2026) */
@font-face{font-family:'FontAwesome';src:url('../fonts/fontawesome-webfont.woff2?v=4.7.0') format('woff2'),url('../fonts/fontawesome-webfont.woff?v=4.7.0') format('woff');font-weight:normal;font-style:normal;font-display:swap}
body{overflow-x:hidden}
.dropdown-menu{opacity:0}

/* ================= HEADER ================= */
.hoc-header{--ha:#f5a000;--ha2:#ffb31f;--hk:#0b1222;--hk2:#26314d;--hm:#5d6680;--hl:#e5e8f0;--hs:#f5f7fb;
  background:#fff!important;font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  box-shadow:0 1px 0 rgba(11,18,34,.06);transition:box-shadow .3s;padding:0!important}
.hoc-header.bg-visible{box-shadow:0 12px 30px -14px rgba(11,18,34,.28)}
.hoc-header .top-head{display:none}
/* top bar */
.hoc-topbar{background:var(--hk);color:#c9cfdb;font-size:13px;height:38px;overflow:hidden;transition:height .3s,opacity .3s}
.hoc-topbar .container{height:100%;display:flex;align-items:center;justify-content:space-between;gap:16px}
.hoc-topbar-l{display:flex;align-items:center;gap:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hoc-topbar-l i{color:var(--ha)}
.hoc-topbar-r{display:flex;align-items:center;gap:22px;white-space:nowrap}
.hoc-topbar a{color:#e7eaf1!important;text-decoration:none!important;font-weight:600;display:inline-flex;align-items:center;gap:7px;transition:color .2s}
.hoc-topbar a:hover{color:var(--ha)!important}
.hoc-topbar a i{color:var(--ha)}
.hoc-topbar a.hoc-wa i{color:#25d366}
.hoc-header.bg-visible .hoc-topbar{height:0;opacity:0}
/* main bar */
.hoc-header .navbar-dark{background:#fff!important;padding:0!important;box-shadow:none!important;border:0!important}
.hoc-header .navbar-dark>.container{min-height:76px;display:flex;align-items:center;flex-wrap:wrap}
.hoc-header .navbar-brand{width:auto!important;padding:8px 0!important;margin:0 auto 0 0!important;background:transparent!important}
.hoc-header .navbar-brand img{height:56px;width:auto;display:block;transition:height .3s}
.hoc-header.bg-visible .navbar-brand img{height:50px}
.hoc-header #mainmenubar .navbar-nav{margin-top:0!important;align-items:center;gap:2px;background:transparent!important}
.hoc-header .navbar-nav>.nav-item{position:relative;font-size:14.5px!important;background:transparent!important;border:0!important}
.hoc-header .navbar-nav>.nav-item>.nav-link{color:var(--hk)!important;font-weight:600!important;text-transform:none!important;font-family:inherit!important;letter-spacing:0!important;
  padding:10px 14px!important;border-radius:10px;background:transparent!important;transition:background .2s,color .2s;border:0!important}
.hoc-header .navbar-nav>.nav-item>.nav-link:before{display:none!important}
.hoc-header .navbar-nav>.nav-item.dropdown>.nav-link{padding-right:30px!important}
.hoc-header .navbar-nav>.nav-item:hover>.nav-link{background:var(--hs)!important;color:var(--hk)!important}
.hoc-header .navbar-nav>.nav-item.active>.nav-link{color:var(--hk)!important}
.hoc-header .navbar-nav>.nav-item.active>.nav-link:after{content:"";position:absolute;left:14px;right:14px;bottom:3px;height:3px;border-radius:3px;background:var(--ha)}
.hoc-header .navbar-nav>.nav-item.dropdown.active>.nav-link:after{right:30px}
.hoc-header .drop-arrow:after{color:var(--hm)!important;background:transparent!important;font-size:14px!important;transition:transform .25s}
/* CTA */
.hoc-nav-cta{display:flex;align-items:center;gap:10px;margin-left:14px}
.hoc-btn-quote{display:inline-flex;align-items:center;gap:8px;padding:12px 20px;border-radius:999px;background:var(--hk);color:#fff!important;
  font-weight:800;font-size:14px;text-decoration:none!important;white-space:nowrap;box-shadow:0 10px 22px -10px rgba(11,18,34,.6);transition:transform .2s,background .2s,color .2s}
.hoc-btn-quote i{color:var(--ha);transition:color .2s}
.hoc-btn-quote:hover{background:var(--ha);color:var(--hk)!important;transform:translateY(-1px)}
.hoc-btn-quote:hover i{color:var(--hk)}
.hoc-nav-contact{display:none}
.hoc-nav-icons{display:none}

@media (min-width:992px){
  .hoc-header .navbar-nav>.nav-item.dropdown>.drop-arrow:after{right:12px!important;line-height:44px!important;top:0!important}
  .hoc-header .navbar-nav>.nav-item.dropdown:hover>.drop-arrow:after{transform:rotate(180deg)}
  .hoc-header .navbar-nav>li.dropdown>.dropdown-menu{top:calc(100% + 10px)!important;left:50%!important;transform:translateX(-50%) translateY(8px);
    border:1px solid var(--hl)!important;border-radius:16px!important;padding:8px!important;min-width:260px;
    box-shadow:0 24px 50px -16px rgba(11,18,34,.35)!important;background:#fff!important;transition:opacity .2s,transform .25s,visibility .2s!important;max-height:none!important}
  .hoc-header .navbar-nav>li.dropdown>.dropdown-menu:before{content:"";position:absolute;left:0;right:0;top:-14px;height:14px;background:transparent!important;border:0!important}
  .hoc-header .navbar-nav>li.dropdown:hover>.dropdown-menu{transform:translateX(-50%) translateY(0)}
  .hoc-header .navbar-nav .dropdown .dropdown-menu .dropdown-item{border-radius:10px;padding:9px 14px!important;font-size:14px!important;line-height:1.35!important;color:var(--hk)!important;
    font-weight:500;white-space:normal;background:transparent!important;border:0!important;transition:background .15s,padding .2s;text-transform:none!important}
  .hoc-header .navbar-nav .dropdown .dropdown-menu li{border:0!important;background:transparent!important}
  .hoc-header .navbar-nav .dropdown .dropdown-menu .dropdown-item:hover,
  .hoc-header .navbar-nav .dropdown .dropdown-menu .active>.dropdown-item{background:#fff4dc!important;color:var(--hk)!important;padding-left:18px!important}
}
@media (min-width:992px) and (max-width:1199px){
  .hoc-header .navbar-nav>.nav-item>.nav-link{padding:10px 8px!important;font-size:13.5px}
  .hoc-header .navbar-nav>.nav-item.dropdown>.nav-link{padding-right:24px!important}
  .hoc-header .navbar-nav>.nav-item.dropdown>.drop-arrow:after{right:6px!important}
  .hoc-header .navbar-brand img{height:46px}
  .hoc-btn-quote{padding:10px 14px;font-size:13px}
  .hoc-nav-cta{margin-left:6px}
}
@media (max-width:991px){
  .hoc-topbar{display:none}
  .hoc-header .navbar-dark>.container{min-height:66px;padding:0 12px!important;max-width:none}
  .hoc-header .navbar-brand{padding:6px 0!important}
  .hoc-header .navbar-brand img{height:46px!important;max-width:170px;object-fit:contain}
  .hoc-nav-icons{display:flex;align-items:center;gap:8px;margin-right:8px}
  .hoc-nav-icons a{width:40px;height:40px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:18px;text-decoration:none!important}
  .hoc-nav-icons .hoc-ic-call{background:var(--ha);color:var(--hk)!important}
  .hoc-nav-icons .hoc-ic-wa{background:#1fae5b;color:#fff!important;font-size:21px}
  .hoc-header .navbar-toggler{margin:0!important;padding:0!important;width:42px;height:42px;border-radius:12px!important;background:var(--hk)!important;border:0!important;
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;font-size:0!important}
  .hoc-header .navbar-toggler .hoc-bar{display:block;width:20px;height:2px;border-radius:2px;background:#fff;transition:transform .3s,opacity .2s}
  .hoc-header .navbar-toggler[aria-expanded="true"] .hoc-bar:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .hoc-header .navbar-toggler[aria-expanded="true"] .hoc-bar:nth-child(2){opacity:0}
  .hoc-header .navbar-toggler[aria-expanded="true"] .hoc-bar:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  .hoc-header #mainmenubar{flex-basis:100%;margin:0 -12px;max-height:calc(100vh - 66px);overflow-y:auto;background:#fff;border-top:1px solid var(--hl)}
  .hoc-header .navbar-dark .navbar-nav{max-height:none!important;overflow:visible!important;background:#fff!important;padding:8px 12px!important;
    display:flex!important;flex-direction:column!important;align-items:stretch!important;text-align:left!important;width:100%;gap:0}
  .hoc-header .navbar-nav>.nav-item{border-bottom:1px solid var(--hs)!important;width:100%;position:relative;text-align:left!important}
  .hoc-header .navbar-nav>.nav-item>.nav-link{display:block;text-align:left!important;padding:14px 8px!important;font-size:16px!important;border-radius:0}
  .hoc-header .navbar-nav .dropdown-menu{position:static!important;float:none!important;width:100%;text-align:left!important;opacity:1!important}
  .hoc-header .navbar-nav .drop-arrow{position:absolute;top:0;right:0;width:48px;height:52px}
  .hoc-header .navbar-nav .drop-arrow:after{position:absolute!important}
  .hoc-header .navbar-nav>.nav-item:hover>.nav-link{background:transparent!important}
  .hoc-header .navbar-nav>.nav-item.active>.nav-link{background:transparent!important;color:var(--hk)!important;box-shadow:inset 3px 0 0 var(--ha);padding-left:14px!important}
  .hoc-header .navbar-nav>.nav-item.active>.nav-link:after{display:none}
  .hoc-header .drop-arrow:after{width:48px!important;height:52px!important;line-height:52px!important;top:0!important;right:0!important;border:0!important;font-size:18px!important;color:var(--hk)!important}
  .hoc-header .navbar-nav>li:hover>.drop-arrow:after,.hoc-header .navbar-nav>li.active>.drop-arrow:after{background:transparent!important;color:var(--hk)!important}
  .hoc-header .navbar-nav .dropdown-menu{border:0!important;background:var(--hs)!important;border-radius:12px!important;margin:0 0 10px!important;padding:6px!important;box-shadow:none!important}
  .hoc-header .navbar-nav>li:has(>.dropdown-menu.show)>.drop-arrow:after{transform:rotate(180deg)}
  .hoc-header .navbar-nav .dropdown .dropdown-menu li{border:0!important;background:transparent!important}
  .hoc-header .navbar-nav .dropdown .dropdown-menu .dropdown-item{padding:11px 12px!important;font-size:15px!important;color:var(--hm)!important;border-radius:8px;white-space:normal;background:transparent!important;border:0!important}
  .hoc-header .navbar-nav .dropdown .dropdown-menu .dropdown-item:hover,
  .hoc-header .navbar-nav .dropdown .dropdown-menu .active>.dropdown-item{background:#fff4dc!important;color:var(--hk)!important}
  .hoc-nav-cta{flex-direction:column;align-items:stretch;margin:4px 12px 18px;gap:10px}
  .hoc-btn-quote{justify-content:center;padding:15px 20px;font-size:15.5px}
  .hoc-nav-contact{display:grid;grid-template-columns:1fr 1fr;gap:10px}
  .hoc-nav-contact a{display:flex;align-items:center;justify-content:center;gap:8px;padding:12px;border-radius:12px;background:var(--hs);color:var(--hk)!important;font-weight:700;font-size:14px;text-decoration:none!important}
  .hoc-nav-contact a i{color:var(--ha);font-size:16px}
  .hoc-nav-contact a.hoc-wa i{color:#1fae5b}
}
@media (max-width:380px){
  .hoc-header .navbar-brand img{max-width:140px;height:auto!important}
  .hoc-nav-icons a{width:36px;height:36px}
  .hoc-header .navbar-toggler{width:38px;height:38px}
}

/* ================= FOOTER ================= */
.hoc-footer{--fa:#f5a000;--fk:#0b1222;background:var(--fk);color:#aeb6c7;font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-size:15px;padding:0!important;margin:0}
.hoc-footer a{text-decoration:none!important}
.hoc-footer-top{padding:44px 0 0}
.hoc-is-home .hoc-footer-top{display:none}
.hoc-is-home .hoc-footer-main{padding-top:64px}
.hoc-footer-cta{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:30px 34px;border-radius:24px;background:linear-gradient(110deg,#f5a000,#ffc64d);color:var(--fk)}
.hoc-footer-cta h2{font-size:clamp(22px,2.6vw,30px);font-weight:800;letter-spacing:-.02em;color:var(--fk);margin:0 0 4px;line-height:1.15;text-transform:none}
.hoc-footer-cta p{margin:0;color:#3b2a05;font-weight:500}
.hoc-footer-cta-btns{display:flex;flex-wrap:wrap;gap:10px}
.hoc-fbtn{display:inline-flex;align-items:center;gap:9px;padding:14px 22px;border-radius:999px;font-weight:800;font-size:15px;white-space:nowrap;transition:transform .2s}
.hoc-fbtn:hover{transform:translateY(-2px)}
.hoc-fbtn-amb{background:var(--fk);color:#fff!important}
.hoc-fbtn-amb i{color:var(--fa)}
.hoc-fbtn-wa{background:#fff;color:var(--fk)!important}
.hoc-fbtn-wa i{color:#1fae5b;font-size:18px}
.hoc-footer-main{padding:56px 0 30px}
.hoc-fcol{margin-bottom:30px}
.hoc-flogo{display:inline-block;background:#fff;border-radius:14px;padding:8px 14px;margin-bottom:18px}
.hoc-flogo img{height:48px;width:auto;display:block}
.hoc-fabout{margin:0 0 18px;line-height:1.6;max-width:360px}
.hoc-fcontact{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.hoc-fcontact li{display:flex;gap:12px;align-items:flex-start;line-height:1.5}
.hoc-fcontact i{width:18px;text-align:center;color:var(--fa);margin-top:3px;flex:none}
.hoc-fcontact a{color:#e7eaf1!important;word-break:break-word}
.hoc-fcontact a:hover{color:var(--fa)!important}
.hoc-footer h3{color:#fff;font-size:16px;font-weight:800;letter-spacing:.02em;margin:6px 0 18px;text-transform:none}
.hoc-flinks{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.hoc-flinks a{color:#aeb6c7!important;transition:color .2s,padding .2s;display:inline-block;line-height:1.4}
.hoc-flinks a:hover{color:var(--fa)!important;padding-left:4px}
.hoc-fnews p{margin:0 0 12px;line-height:1.55}
.hoc-fnews .form-group{position:relative;margin:0}
.hoc-fnews .form-control{height:52px;border-radius:999px!important;border:1px solid #26314d!important;background:#141d33!important;color:#fff!important;padding:0 60px 0 20px;font-size:15px;box-shadow:none!important}
.hoc-fnews .form-control::placeholder{color:#7f89a0}
.hoc-fnews .form-control:focus{border-color:var(--fa)!important}
.hoc-fnews .btn{position:absolute;right:5px;top:5px;width:42px;height:42px;border-radius:50%!important;background:var(--fa)!important;color:var(--fk)!important;border:0!important;padding:0!important;display:flex;align-items:center;justify-content:center}
.hoc-fnews .validate-msg{font-size:13px;margin-top:6px}
.hoc-fsocial{display:flex;gap:10px;margin-top:20px}
.hoc-fsocial a{width:42px;height:42px;border-radius:12px;background:#141d33;color:#e7eaf1!important;display:flex;align-items:center;justify-content:center;font-size:17px;transition:background .2s,color .2s}
.hoc-fsocial a:hover{background:var(--fa);color:var(--fk)!important}
.hoc-footer-line{border-top:1px solid #1c2640;padding:20px 0;font-size:13.5px;color:#7f89a0}
.hoc-footer-line .text{text-align:center}
.hoc-footer-line a{color:#aeb6c7!important}
#back-to-top{background:var(--fk,#0b1222)!important;color:#f5a000!important;border-radius:12px!important}
@media (max-width:767px){
  .hoc-footer-top{padding:32px 0 0}
  .hoc-footer-cta{flex-direction:column;align-items:flex-start;padding:24px 20px;border-radius:20px}
  .hoc-footer-cta-btns{width:100%}
  .hoc-fbtn{flex:1 1 auto;justify-content:center;padding:14px 16px}
  .hoc-footer-main{padding:40px 0 10px}
  .hoc-footer-line{padding-bottom:84px}
}
