/* Ikhwezi Mageba -- brand polish pass (deploy-10)
   Additive only: extends site.css, changes nothing it defines.
   Visual language borrowed from the printed business card / company-profile
   artwork (fine engineering grid, corner registration marks, ribbon accent)
   so that large plain sections pick up the same "graphic feel" as the
   printed collateral instead of sitting as flat white space. */

.im-blueprint {
  position: relative;
  isolation: isolate;
}
.im-blueprint::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  opacity: .55;
  background-image:
    linear-gradient(rgba(48,80,128,.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(48,80,128,.07) 1px, transparent 1px);
  background-size: 2.25rem 2.25rem, 2.25rem 2.25rem;
  -webkit-mask-image: radial-gradient(ellipse 75% 100% at 50% 0%, #000 55%, transparent 100%);
  mask-image: radial-gradient(ellipse 75% 100% at 50% 0%, #000 55%, transparent 100%);
}

.im-corner-marks { position: relative; }
.im-corner-marks::before,
.im-corner-marks::after {
  content: "";
  position: absolute;
  width: 1.6rem;
  height: 1.6rem;
  border: 1.5px solid #6080a0;
  opacity: .55;
  pointer-events: none;
}
.im-corner-marks::before { top: -.6rem; left: -.6rem; border-right: 0; border-bottom: 0; }
.im-corner-marks::after { bottom: -.6rem; right: -.6rem; border-left: 0; border-top: 0; }

/* Ribbon divider -- same navy/corporate-blue/medium-blue family as the palette table */
.im-ribbon {
  height: 4px;
  background-image: linear-gradient(90deg, #205070 0%, #305080 45%, #6080a0 100%);
}

/* Paper-card treatment, echoing the embossed business-card photography */
.im-paper-card {
  position: relative;
  border-radius: .75rem;
  overflow: hidden;
  border: 1px solid #b0c0d0;
  background: linear-gradient(155deg, #205070 0%, #305080 60%, #6080a0 130%);
  color: #fff;
  padding: 2rem;
}
.im-paper-card::after {
  content: "";
  position: absolute;
  inset: 0;
  background-image: radial-gradient(120% 90% at 100% 0%, rgba(255,255,255,.12), transparent 55%);
  pointer-events: none;
}

/* Section eyebrow tick, reusing the ribbon gradient instead of flat green */
.im-tick { display: inline-block; width: 2rem; height: 2px; background-image: linear-gradient(90deg,#205070,#6080a0); vertical-align: middle; margin-right: .5rem; }

@media (max-width: 640px) {
  .im-blueprint::before { background-size: 1.5rem 1.5rem, 1.5rem 1.5rem; }
}

.im-wa-float{position:fixed;right:1.1rem;bottom:1.1rem;z-index:60;display:flex;align-items:center;gap:.5rem;background:#25D366;color:#fff;padding:.75rem 1rem;border-radius:999px;box-shadow:0 12px 30px -10px rgba(0,0,0,.45);font:600 .82rem/1 "Manrope",sans-serif;text-decoration:none}
.im-wa-float:hover{filter:brightness(1.05)}

/* ---- Title-only organogram (deploy-11), replaces raster org-chart images ---- */
.im-org { display: flex; flex-direction: column; align-items: center; padding: 1.25rem .5rem .5rem; }
.im-org-box {
  background: #e8eef3;
  border: 1px solid #b0c0d0;
  color: #205070;
  font-weight: 700;
  font-size: .72rem;
  letter-spacing: .01em;
  text-align: center;
  border-radius: .35rem;
  padding: .55rem .6rem;
  line-height: 1.25;
  min-width: 9rem;
}
.im-org-leaf { background: #f2f5f7; font-weight: 600; color: #305080; min-width: 7rem; }
.im-org-tier { display: flex; justify-content: center; }
.im-org-tier + .im-org-tier::before,
.im-org-tier + .im-org-leads::before { content: ""; }
.im-org-connector { width: 1.5px; height: 1.15rem; background: #b0c0d0; }
.im-org-leads {
  display: flex;
  justify-content: center;
  gap: 1.1rem;
  flex-wrap: wrap;
  position: relative;
  padding-top: 1.15rem;
  margin-top: -1px;
  border-top: 1.5px solid #b0c0d0;
  width: 100%;
}
.im-org-branch { display: flex; flex-direction: column; align-items: center; gap: .5rem; position: relative; }
.im-org-branch::before { content: ""; position: absolute; top: -1.15rem; left: 50%; width: 1.5px; height: 1.15rem; background: #b0c0d0; }
.im-org-children { display: flex; gap: .5rem; flex-wrap: wrap; justify-content: center; position: relative; padding-top: .85rem; border-top: 1.5px solid #b0c0d0; margin-top: .3rem; width: 100%; }
.im-org-children::before { content:""; }
@media (max-width: 640px) {
  .im-org-leads { gap: .7rem; }
  .im-org-box { min-width: 7.2rem; font-size: .66rem; }
}

/* ---- Gallery page (deploy-11) ---- */
.im-gallery-filters { display: flex; flex-wrap: wrap; gap: .5rem; }
.im-gallery-filter {
  font: 700 .72rem/1 "Manrope", sans-serif;
  text-transform: uppercase;
  letter-spacing: .08em;
  padding: .55rem 1rem;
  border-radius: 999px;
  border: 1px solid #b0c0d0;
  background: #fff;
  color: #305080;
  cursor: pointer;
  transition: background .15s, color .15s;
}
.im-gallery-filter.is-active,
.im-gallery-filter:hover { background: #205070; border-color: #205070; color: #fff; }

.im-gallery-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: .85rem;
}
@media (min-width: 640px) { .im-gallery-grid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1024px) { .im-gallery-grid { grid-template-columns: repeat(4, 1fr); } }

.im-gallery-item {
  position: relative;
  display: block;
  border: 1px solid #b0c0d0;
  border-radius: .5rem;
  overflow: hidden;
  padding: 0;
  cursor: zoom-in;
  background: #e8eef3;
  aspect-ratio: 4 / 3;
}
.im-gallery-item img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .5s; }
.im-gallery-item:hover img { transform: scale(1.06); }
.im-gallery-item-label {
  position: absolute; inset: auto 0 0 0;
  background: linear-gradient(0deg, rgba(21,55,77,.88), transparent);
  color: #fff; text-align: left;
  padding: 1.4rem .65rem .5rem;
  font: 600 .68rem/1.25 "Manrope", sans-serif;
  opacity: 0; transform: translateY(6px);
  transition: opacity .2s, transform .2s;
}
.im-gallery-item-label em { display: block; font-style: normal; font-size: .58rem; letter-spacing: .1em; text-transform: uppercase; color: #b0c0d0; margin-bottom: .15rem; }
.im-gallery-item:hover .im-gallery-item-label,
.im-gallery-item:focus-visible .im-gallery-item-label { opacity: 1; transform: translateY(0); }
.im-gallery-item.is-hidden { display: none; }

.im-lightbox {
  position: fixed; inset: 0; z-index: 100;
  background: rgba(10,20,30,.92);
  display: none;
  align-items: center; justify-content: center;
  padding: 3rem 1rem;
}
.im-lightbox.is-open { display: flex; }
.im-lightbox-figure { max-width: 90vw; max-height: 84vh; text-align: center; }
.im-lightbox-figure img { max-width: 90vw; max-height: 74vh; border-radius: .4rem; box-shadow: 0 30px 80px -20px rgba(0,0,0,.6); }
.im-lightbox-figure figcaption { color: #e0e0e0; font: 600 .8rem/1.4 "Manrope", sans-serif; margin-top: .9rem; }
.im-lightbox-close, .im-lightbox-nav {
  position: absolute; background: rgba(255,255,255,.1); color: #fff; border: 1px solid rgba(255,255,255,.3);
  border-radius: 999px; cursor: pointer; display: flex; align-items: center; justify-content: center;
}
.im-lightbox-close { top: 1.2rem; right: 1.2rem; width: 2.5rem; height: 2.5rem; font-size: 1.4rem; line-height: 1; }
.im-lightbox-nav { top: 50%; transform: translateY(-50%); width: 3rem; height: 3rem; font-size: 1.8rem; }
.im-lightbox-prev { left: 1rem; } .im-lightbox-next { right: 1rem; }
.im-lightbox-close:hover, .im-lightbox-nav:hover { background: rgba(255,255,255,.22); }
@media (max-width: 640px) { .im-lightbox-nav { width: 2.4rem; height: 2.4rem; font-size: 1.4rem; } }

/* ---- Organogram, graph style (deploy-13) ---- */
.im-org-wrap { overflow-x: auto; padding-bottom: .35rem; }
.im-org-svg { width: 100%; min-width: 760px; height: auto; display: block; }
.im-node {
  height: 100%;
  display: flex; align-items: center; gap: .5rem;
  background: #fff;
  border: 1px solid #e2e6ea;
  border-top: 3px solid #205070;
  border-radius: .4rem;
  padding: 0 .55rem;
  box-shadow: 0 2px 6px -2px rgba(21,55,77,.18);
  box-sizing: border-box;
}
.im-node-icon {
  flex: none;
  width: 1.9rem; height: 1.9rem;
  border-radius: 999px;
  display: flex; align-items: center; justify-content: center;
}
.im-node-text { display: flex; flex-direction: column; line-height: 1.2; min-width: 0; }
.im-node-text strong { color: #17324a; font-family: "Manrope", sans-serif; }
.im-node-text em { font-style: normal; color: #305080; font-weight: 600; margin-top: .1rem; }

/* ---- Video items in gallery (deploy-14) ---- */
.im-gallery-item.im-gallery-video .im-gallery-play {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  pointer-events: none;
}
.im-gallery-item.im-gallery-video .im-gallery-play span {
  width: 2.6rem; height: 2.6rem; border-radius: 999px;
  background: rgba(21,55,77,.55); backdrop-filter: blur(2px);
  display: flex; align-items: center; justify-content: center;
  border: 1.5px solid rgba(255,255,255,.85);
}
.im-gallery-item.im-gallery-video .im-gallery-play svg { margin-left: 2px; }
.im-lightbox-figure video { max-width: 90vw; max-height: 74vh; border-radius: .4rem; box-shadow: 0 30px 80px -20px rgba(0,0,0,.6); background:#000; }