/* Live-safe responsive stabilization. The original visual design is preserved;
   these rules only correct header/logo behavior, overflow and small-screen layout. */
html,body{max-width:100%;overflow-x:hidden}
img,video,svg{max-width:100%}
.row>*{min-width:0}

/* Transparent logo: white on the hero, original colour on the sticky white header. */
#header{top:0;padding-top:4px}
#header .navbar{padding:14px 0}
#header .navbar>.container{display:flex;align-items:center;gap:10px;flex-wrap:nowrap}
#header .navbar-brand{position:relative;display:flex;align-items:center;justify-content:center;flex:0 0 174px;width:174px;height:86px;margin:0;padding:0;background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important;overflow:visible}
#header .navbar-brand .brand-logo{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;transition:opacity .25s ease,transform .3s ease}
#header .navbar-brand .brand-logo-white{opacity:1}
#header .navbar-brand .brand-logo-color{opacity:0}
#header .navbar-collapse{min-width:0}
#header .navbar-nav{gap:1px;white-space:nowrap}
#header .nav-link{font-size:14px;padding:10px 9px!important}
#header .navbar .theme-btn{margin-left:10px;padding:12px 19px;white-space:nowrap;font-size:13px}

#header.fixed{padding-top:0;background:rgba(255,255,255,.97);box-shadow:0 8px 30px rgba(3,25,56,.12);backdrop-filter:blur(14px)}
#header.fixed .navbar{padding:5px 0;min-height:76px}
#header.fixed .navbar-brand{flex-basis:145px;width:145px;height:68px}
#header.fixed .navbar-brand .brand-logo-white{opacity:0}
#header.fixed .navbar-brand .brand-logo-color{opacity:1}

/* Off-canvas remains light, therefore it intentionally uses the coloured transparent logo. */
#header .offcanvas-header{min-height:96px;background:#fff}
#header .offcanvas-header img{display:block;width:150px!important;height:auto!important;max-height:80px;object-fit:contain;background:transparent!important;border:0!important;border-radius:0!important}
#header .offcanvas-body{background:#fff}
#header .mobile-erp-login{margin:20px 20px 0}

/* General responsive safeguards without restyling the supplied page sections. */
.container{width:100%;padding-left:clamp(15px,2vw,24px);padding-right:clamp(15px,2vw,24px)}
.section-title{font-size:clamp(30px,4vw,48px)}
.py-120{padding-top:clamp(64px,8vw,120px);padding-bottom:clamp(64px,8vw,120px)}
.page-banner,.about-hero,.services-hero,.fleet-hero,.hse-hero,.career-hero,.contact-hero,.privacy-hero,.faq-hero,.certificate-hero{overflow:hidden}
.theme-btn,input,select,textarea,button{max-width:100%}

@media(max-width:1399.98px) and (min-width:1200px){
  #header .navbar-brand{flex-basis:150px;width:150px;height:76px}
  #header .navbar-nav{gap:0}
  #header .nav-link{font-size:12.8px;padding:9px 7px!important}
  #header .navbar .theme-btn{margin-left:7px;padding:11px 14px;font-size:12.5px}
}

@media(max-width:1199.98px){
  #header{padding:6px 10px 0}
  #header .navbar{padding:5px 8px;min-height:76px;border-radius:0;background:rgba(5,25,55,.88);box-shadow:none;backdrop-filter:blur(8px)}
  #header .navbar>.container{padding-left:0;padding-right:0}
  #header .navbar-brand{flex-basis:140px;width:140px;height:66px}
  #header .navbar-toggler{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:8px;background:rgba(255,255,255,.10)}
  #header .navbar-toggler i{color:#fff;font-size:25px}
  #header.fixed{padding:0 10px;background:transparent;box-shadow:none;backdrop-filter:none}
  #header.fixed .navbar{min-height:72px;padding:4px 8px;background:rgba(255,255,255,.98);box-shadow:0 8px 26px rgba(0,0,0,.12)}
  #header.fixed .navbar-brand{flex-basis:134px;width:134px;height:62px}
  #header.fixed .navbar-toggler{background:#eef4fb}
  #header.fixed .navbar-toggler i{color:#0a3976}
}

@media(max-width:767.98px){
  #header{padding:5px 7px 0}
  #header .navbar{padding:4px 7px;min-height:68px}
  #header .navbar-brand{flex-basis:122px;width:122px;height:58px}
  #header .navbar-toggler{width:40px;height:40px}
  .hero{padding-top:92px}
  .hero-content h1,.about-hero h1,.services-hero h1,.fleet-hero h1,.hse-hero h1,.career-hero h1,.contact-hero h1,.privacy-hero h1,.faq-hero h1,.certificate-hero h1{overflow-wrap:anywhere}
  .section-title{line-height:1.2}
}

@media(max-width:575.98px){
  #header .navbar-brand{flex-basis:112px;width:112px;height:53px}
  #header .offcanvas{width:min(88vw,330px)}
  .footer-logo{height:auto;max-height:74px;width:min(210px,80%)}
}