/* SIBHUSHWANA GROUP — FRESH / PEOPLE-FIRST COLOURWAY
   Alternate client presentation. Retains layout and functionality from v3.
   Palette: eucalyptus, deep teal, soft sage, warm white, charcoal.
*/
:root {
  --ink: #173D37;
  --carbon: #1E4A42;
  --charcoal: #28584E;
  --graphite: #3A6B60;
  --red: #25866F;
  --red-hover: #176B58;
  --red-deep: #125647;
  --red-glow: rgba(37,134,111,.18);
  --red-tint: #E6F2ED;
  --paper: #FFFEFB;
  --mist: #F2F6F1;
  --line: #DDE7DF;
  --line-dark: rgba(255,255,255,.15);
  --text: #24332F;
  --muted: #62716B;
  --faint: #82918A;
  --silver: #C7D3CC;
  --text-inverse: #F7FBF8;
  --muted-inverse: #D0DDD6;
  --shadow-red: 0 10px 28px -8px rgba(37,134,111,.2);
}
body { background: var(--paper); color: var(--text); }
h1,h2,h3,h4 { color: var(--ink); }
::selection { background: #25866F; color: #fff; }
:focus-visible { outline-color: #25866F; }

/* Lighter, welcoming navigation */
.topbar { background: #EAF2EC; color: #53675E; border-bottom: 1px solid #DDE7DF; }
.topbar-tag { color: #23745F; }
.topbar a:hover { color: #173D37; }
.site-header {
  background: rgba(255,254,251,.94);
  border-bottom: 1px solid #E1E9E2;
  box-shadow: 0 5px 22px rgba(25,55,45,.05);
}
.nav-link { color: #425A51; }
.nav-link:hover { color: #173D37; background: #EDF4EF; }
.nav-link[aria-current="page"] { color: #173D37; }
.nav-link[aria-current="page"]::after { background: #25866F; }
.nav-toggle { color: #173D37; }
.nav-toggle svg { stroke: #173D37; }
.nav-cta .btn-ghost { color: #31564A; border-color: #C9D9CF; background: #fff; }
.nav-cta .btn-ghost:hover { color: #173D37; background: #EDF4EF; border-color: #AFC8B9; }
.drawer { background: #173D37; }
.drawer-menu a::after { color: #8BC7A8; }
.btn-primary { background: #25866F; box-shadow: 0 8px 22px rgba(37,134,111,.18); }
.btn-primary:hover { background: #176B58; }
.btn-outline { border-color: #25866F; color: #176B58; }
.btn-outline:hover { background: #25866F; color: #fff; }
.kicker { color: #23745F; }
.kicker::before { background: #61A88A; }
.bg-ink .kicker { color: #B5E0C8; }

/* Fresh, bright hero: service-led rather than security-led */
.hero {
  background: #F0F5EF;
  color: #24332F;
}
.hero-media {
  background: url("../assets/images/svc-janitorial.jpg") center right / cover no-repeat;
  opacity: 1;
}
.hero-media::before {
  background:
    linear-gradient(90deg, rgba(245,249,243,.99) 0%, rgba(245,249,243,.96) 38%, rgba(245,249,243,.76) 58%, rgba(245,249,243,.12) 100%);
}
.hero h1 { color: #173D37; }
.hero h1 .red { color: #25866F; }
.hero-lede { color: #52665D; }
.hero-kicker {
  color: #456258; border-color: #D4E3D8; background: rgba(255,255,255,.72);
}
.hero-kicker strong { color: #173D37; }
.hero-kicker .dot { background: #55A77F; box-shadow: 0 0 10px rgba(85,167,127,.4); }
.hero-point {
  color: #31564A; background: rgba(255,255,255,.82);
  border-color: #D4E3D8; backdrop-filter: blur(8px);
}
.hero-point svg { color: #25866F; }
.hero-stats {
  background: rgba(255,255,255,.88);
  border-top: 1px solid #DDE7DF;
  backdrop-filter: blur(8px);
}
.stat b { color: #173D37; }
.stat b em { color: #25866F; }
.stat span { color: #60746A; }
@media (max-width: 900px) {
  .hero-media::before {
    background: linear-gradient(180deg, rgba(245,249,243,.48) 0%, rgba(245,249,243,.94) 42%, #F0F5EF 78%);
  }
}

/* Soft sage feature panels; retain a deep-green contrast section only in footer */
.bg-ink { background: #EAF2EC; color: #24332F; }
.bg-ink h2, .bg-ink h3 { color: #173D37; }
.bg-ink .section-head p { color: #5C7066; }
.bg-ink .kicker { color: #23745F; }
.bg-ink .btn-ghost { color: #31564A; border-color: #BFD3C5; background: rgba(255,255,255,.55); }
.bg-ink .btn-ghost:hover { color: #173D37; background: #fff; }
.bg-ink .hero-point { color: #31564A; }
.card, .service-card, .feature-card { border-color: #E0E9E1; }
a:hover { color: #176B58; }

/* Deep eucalyptus footer grounds the identity without making the whole site dark */
.site-footer { background: #173D37; color: #D0DDD6; }
.footer-cta { border-color: rgba(255,255,255,.16); }
.footer-cta h2, .footer-heading { color: #fff; }
.footer-links a:hover, .footer-address a:hover { color: #B5E0C8; }
.footer-badge { border-color: rgba(255,255,255,.22); }
.footer-bottom { border-color: rgba(255,255,255,.16); }
.footer-brand img { background: #fff; border-radius: 5px; padding: 4px; }

/* Light page banners and cards */
.page-hero, .inner-hero { background: #EAF2EC; }
.breadcrumbs { color: #62766B; }
.badge, .pill { background: #E6F2ED; color: #176B58; }
input:focus, select:focus, textarea:focus { border-color: #25866F !important; box-shadow: 0 0 0 3px rgba(37,134,111,.12); }