/* ============================================================
   RentGo Kenya — front-end overrides & polish
   Loaded after the theme CSS so these rules win.
   Accent: #F5B754
   ============================================================ */
:root{ --rg-accent:#F5B754; --rg-dark:#29313A; }

/* ---- Uniform service card images ---- */
.our-service .service-image{ overflow:hidden; border-radius:14px; }
.our-service .service-image img,
.our-service .service-image figure img{
    width:100%; height:240px; object-fit:cover; display:block;
    transition:transform .5s ease;
}
.our-service .service-item:hover .service-image img{ transform:scale(1.06); }

/* even spacing between service cards (row + col) */
.our-service .row > [class*="col-"]{ margin-bottom:30px; }
.our-service .service-item{
    height:100%; display:flex; flex-direction:column;
    background:#fff; border-radius:16px; padding:16px;
    box-shadow:0 10px 30px rgba(0,0,0,.06);
    transition:box-shadow .3s ease, transform .3s ease;
}
.our-service .service-item:hover{ box-shadow:0 18px 50px rgba(0,0,0,.12); transform:translateY(-4px); }
.our-service .service-body{ flex:1; display:flex; flex-direction:column; padding:18px 8px 8px; }

/* visible title hover colour */
.our-service .service-content h3 a,
.service-content h3 a{ transition:color .25s ease; }
.our-service .service-content h3 a:hover,
.service-content h3 a:hover{ color:var(--rg-accent) !important; }
.readmore-btn{ transition:color .25s ease; }
.readmore-btn:hover{ color:var(--rg-accent) !important; }

/* ---- Uniform fleet card images + spacing ---- */
.our-fleets .row > [class*="col-"]{ margin-bottom:30px; }
.our-fleets .fleets-item{ height:100%; }
.our-fleets .fleets-item-image{ overflow:hidden; border-radius:14px; }
.our-fleets .fleets-item-image img,
.our-fleets .fleets-item-image figure img{
    width:100%; height:230px; object-fit:cover; display:block;
    transition:transform .5s ease;
}
.our-fleets .fleets-item:hover .fleets-item-image img{ transform:scale(1.06); }

/* ---- Section vertical rhythm: keep CTA from crowding the footer ---- */
.our-cta{ padding:90px 0; }
.our-cta + .main-footer,
.our-cta + footer{ margin-top:0; }
.our-service{ padding:90px 0; }
.our-fleets{ padding:90px 0; }

/* ---- Breadcrumb polish ---- */
.page-header .breadcrumb{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; justify-content:center; }
.page-header .breadcrumb-item a{ color:#fff; opacity:.85; }
.page-header .breadcrumb-item a:hover{ color:var(--rg-accent); opacity:1; }
.page-header .breadcrumb-item.active{ color:var(--rg-accent); }
.page-header .breadcrumb-item + .breadcrumb-item::before{ content:"/"; color:rgba(255,255,255,.6); padding-right:6px; }

/* ---- Contact info icons (now that Font Awesome works) ---- */
.contact-info-item .icon-box{
    width:48px; height:48px; min-width:48px; border-radius:12px;
    display:flex; align-items:center; justify-content:center;
    background:var(--rg-accent); color:#1a1205; font-size:18px;
}
.contact-info-item h3{ font-size:16px; margin:0 0 2px; }
.contact-info-item p{ margin:0; }

/* ---- Footer contact icons spacing ---- */
.footer-contact-info i, .footer-links i{ color:var(--rg-accent); margin-right:8px; }

/* ---- Generic image-anime safety (no overflow) ---- */
figure.image-anime{ overflow:hidden; }

/* ---- Responsive image heights ---- */
@media (max-width:767px){
    .our-service .service-image img,
    .our-fleets .fleets-item-image img{ height:200px; }
}
