@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;600;700;800&display=swap');
:root{
  --qc-navy:#0A1931;--qc-silver:#E5E5E5;--qc-royal:#007BFF;--qc-white:#FFFFFF;--qc-charcoal:#111111;
}
*{box-sizing:border-box}
body{background:var(--qc-white);color:var(--qc-charcoal);font-family:Manrope,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif}
a{text-decoration:none}
.container-narrow{max-width:1180px;margin:0 auto}

/* Smaller global typography */
html{font-size:15px} body{font-size:.95rem;line-height:1.6}
h1{font-size:1.8rem;line-height:1.2}
h2{font-size:1.4rem;line-height:1.25}
h3{font-size:1.2rem;line-height:1.3}
h4{font-size:1.05rem;line-height:1.35}
h5{font-size:1rem;line-height:1.4}
h6{font-size:.95rem;line-height:1.45}

/* NAV */
.navbar{background:var(--qc-white)!important;border-bottom:1px solid #e9ecf1}
.navbar .nav-link{color:var(--qc-navy)!important;font-weight:700;padding:.6rem .9rem;border-radius:.5rem;font-size:.95rem}
.navbar .nav-link:hover{color:var(--qc-royal)!important;background:#f2f6ff}
.brand-icon{width:44px;height:44px;background:linear-gradient(135deg,var(--qc-navy),var(--qc-royal));color:#fff;font-weight:900}
.center-nav{flex:1;display:flex;justify-content:center}
.btn{font-size:.95rem} .btn-lg{font-size:1rem}
.btn-primary{background:var(--qc-royal);border-color:var(--qc-royal)}
.btn-outline-primary{border-color:var(--qc-royal);color:var(--qc-royal)}
.btn-outline-primary:hover{background:var(--qc-royal);color:#fff}

/* HERO (reduced height + lighter overlay) */
.hero-wrap{position:relative;min-height:480px;background:url('https://www.trial.mijengomaterialsupplies.co.ke/wp-content/uploads/2025/10/property-management.png') center/cover no-repeat;display:flex;align-items:center}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(115deg, rgba(10,25,49,.45) 0%, rgba(10,25,49,.35) 55%, rgba(0,123,255,.25) 100%);z-index:1}
.hero{position:relative;z-index:2;color:#fff;padding:3.2rem 0}
.hero h1{font-weight:900;letter-spacing:.2px;font-size:clamp(1.1rem,2.6vw,1.75rem)}
.hero .lead{opacity:.97;font-size:.9rem;line-height:1.5}
.chips .chip{display:inline-block;border:1px solid rgba(255,255,255,.25);padding:.35rem .6rem;border-radius:2rem;margin-right:.35rem;margin-bottom:.35rem;background:rgba(255,255,255,.12)}

/* PAGE TITLE + BREADCRUMB */
.title-hero{position:relative;background:url('https://www.trial.mijengomaterialsupplies.co.ke/wp-content/uploads/2025/10/mining1.png') center/cover no-repeat;min-height:260px;display:flex;align-items:center}
.title-hero:before{content:"";position:absolute;inset:0;background:linear-gradient(96deg, rgba(0,123,255,.75), rgba(10,25,49,.88));}
.title-hero .inner{position:relative;z-index:2}
.title-hero h1{color:#fff;font-weight:800}
.breadcrumb .breadcrumb-item a{color:#fff}
.breadcrumb .breadcrumb-item+.breadcrumb-item::before{color:#fff;opacity:.8}
.breadcrumb .breadcrumb-item.active{color:#fff;opacity:.95}
.breadcrumb{font-size:.9rem}

/* SECTIONS + CARDS */
.section{padding:3.5rem 0}
.section-muted{background:#f7f9fb}
.card-elev{border:1px solid #eef2f6;border-radius:1rem;overflow:hidden;box-shadow:0 14px 36px rgba(0,0,0,.06);background:#fff;transition:transform .15s ease, box-shadow .2s}
.card-elev:hover{transform:translateY(-3px);box-shadow:0 22px 48px rgba(0,0,0,.08)}
.card-elev img{height:190px;object-fit:cover}
.card-elev .card-title{font-weight:800;color:var(--qc-navy)}
.section p,.section .card-elev p,.card-elev .card-body p,.card-elev .p-3 p,.section ul li{font-size:.9rem;line-height:1.55}

/* FOOTER */
.footer{background:var(--qc-navy);color:var(--qc-silver)}
.footer a{color:var(--qc-silver)}
.footer .copy{border-top:1px solid rgba(255,255,255,.15)}
.footer .small,.footer p,.footer div{font-size:.9rem}

/* Image blue overlay utility */
.img-blue { position: relative; display: block; }
.img-blue img { display: block; width: 100%; height: 190px; object-fit: cover; }
.img-blue::after { content: ""; position: absolute; inset: 0;
  background: linear-gradient(140deg, rgba(0,123,255,.22), rgba(10,25,49,.12));
  pointer-events: none; mix-blend-mode: multiply; }
@media (min-width: 992px) {
  .img-blue img { height: 190px; }
}
/* Taller image on detail pages */
.detail-visual.img-blue img { height: 100%; max-height: 420px; }


/* v14: Taller image for About visual on homepage */
.about-visual.img-blue img { height: 360px; }
@media (min-width: 992px) {
  .about-visual.img-blue img { height: 460px; }
}