/*
Theme Name:  UIGC BeTheme Child
Description: UNIVEN Innovative Growth Company — Innovation is part of our DNA
Template:    betheme
Version:     1.7.4
Author:      Early Birds
*/

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap');

/* =========================================================
   UIGC DESIGN SYSTEM
   Clean · Modern · Professional · Innovation-led
   Green #81B944 · Black #000 · White #FFF
   ========================================================= */
:root {
  --green:     #81B944;
  --green-d:   #5E8E2A;
  --green-l:   #9FD062;
  --green-bg:  #F5FAF0;
  --green-dim: rgba(129,185,68,0.10);

  --ink:       #0A0A0A;   /* near-black for headings */
  --ink-l:     #1A1A1A;
  --ink-2:     #2A2A2A;

  --bg:        #FFFFFF;
  --bg2:       #FAFAFA;
  --bg3:       #F4F4F4;
  --bg-dark:   #0A0A0A;   /* used selectively for high-contrast sections */

  --tx:        #1A1A1A;
  --txm:       #4A4A4A;
  --txmu:      #6B6B6B;
  --txl:       #9A9A9A;

  --bd:        #E5E5E5;
  --bd-mid:    #D0D0D0;
  --bd-dark:   #1A1A1A;

  --sh-sm:     0 2px 12px rgba(0,0,0,0.05);
  --sh-md:     0 8px 32px rgba(0,0,0,0.08);
  --sh-lg:     0 20px 60px rgba(0,0,0,0.12);
  --sh-g:      0 4px 20px rgba(129,185,68,0.25);
  --rad:       8px;
}

.fm-hero h1 span,
.fm-page-header h1 span {
  color: var(--green);
}

.uigc-managed-page-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 56px;
  align-items: start;
}
.uigc-managed-page-grid.has-sidebar {
  grid-template-columns: minmax(0, 1fr) 300px;
}
@media (max-width: 900px) {
  .uigc-managed-page-grid.has-sidebar { grid-template-columns: 1fr; }
  .uigc-managed-page-grid aside { position: static !important; }
}

/* ── Reset / Base ────────────────────────────────────────── */
.uigc-page *, .uigc-page *::before, .uigc-page *::after { box-sizing:border-box; }
.uigc-page { font-family:'Inter',sans-serif; color:var(--tx); background:var(--bg); margin:0; }
.uigc-page img { max-width:100%; display:block; }
.uigc-page a { color:inherit; text-decoration:none; }
.uigc-page p { margin:0; }
.uigc-managed-richtext p,
.uigc-managed-content p { margin:0 0 18px; }
.uigc-managed-richtext p:last-child,
.uigc-managed-content p:last-child { margin-bottom:0; }
.uigc-managed-richtext ul,
.uigc-managed-content ul { list-style:disc; padding-left:22px; margin:0 0 18px; }
.uigc-managed-richtext ol,
.uigc-managed-content ol { padding-left:22px; margin:0 0 18px; }
.uigc-managed-content h2,
.uigc-managed-content h3,
.uigc-managed-content h4 { color:var(--ink); margin:28px 0 12px; }
.uigc-page ul { margin:0; padding:0; list-style:none; }

/* ── Buttons ─────────────────────────────────────────────── */
.uigc-page .bt {
  display:inline-flex;align-items:center;gap:8px;
  background:var(--ink);color:#fff;font-weight:700;font-size:14px;
  padding:13px 26px;border-radius:6px;letter-spacing:.02em;
  transition:background .2s,transform .15s;border:1.5px solid var(--ink);
}
.uigc-page .bt:hover { background:var(--green);border-color:var(--green);color:#000;transform:translateY(-1px); }

.uigc-page .bg {
  display:inline-flex;align-items:center;gap:8px;
  background:var(--green);color:#000;font-weight:700;font-size:14px;
  padding:13px 26px;border-radius:6px;letter-spacing:.02em;
  transition:background .2s,transform .15s;box-shadow:var(--sh-g);
}
.uigc-page .bg:hover { background:var(--green-d);color:#fff;transform:translateY(-1px); }

.uigc-page .bo {
  display:inline-flex;align-items:center;gap:8px;
  background:transparent;color:var(--ink);font-weight:600;font-size:14px;
  padding:12px 24px;border-radius:6px;border:1.5px solid var(--bd-mid);
  transition:border-color .2s,color .2s;
}
.uigc-page .bo:hover { border-color:var(--green);color:var(--green-d); }

/* ── Section helpers ─────────────────────────────────────── */
.uigc-page .sec { padding:96px 48px; }
.uigc-page .sec-in { max-width:1200px;margin:0 auto; }
.uigc-page .slbl {
  display:inline-flex;align-items:center;gap:10px;
  font-family:'Inter',sans-serif;font-size:11px;color:var(--green-d);
  letter-spacing:.16em;text-transform:uppercase;margin-bottom:16px;
}
.uigc-page .slbl::before { content:'';width:24px;height:1.5px;background:var(--green); }
.uigc-page .stit {
  font-family:'Inter',sans-serif;font-size:clamp(32px,4vw,52px);
  font-weight:800;color:var(--ink);line-height:1.1;letter-spacing:-.02em;margin:0 0 16px;
}

/* =========================================================
   TOP BAR
   ========================================================= */
.uigc-page .fm-topbar {
  background:var(--ink);padding:9px 48px;
  display:flex;align-items:center;justify-content:space-between;
  font-family:'Inter',sans-serif;font-size:11px;color:rgba(255,255,255,.55);
  flex-wrap:wrap;gap:8px;
}
.uigc-page .fm-topbar strong { color:#fff; }
.uigc-page .fm-topbar a { color:rgba(255,255,255,.55);transition:color .2s; }
.uigc-page .fm-topbar a:hover { color:var(--green-l); }
.uigc-page .fm-topbar .topbar-badge {
  background:var(--green);color:#000;font-weight:800;font-size:10px;
  letter-spacing:.1em;text-transform:uppercase;padding:3px 9px;border-radius:2px;
}

/* =========================================================
   NAV
   ========================================================= */
.uigc-page #fm-nav {
  position:sticky;top:0;z-index:200;
  background:rgba(255,255,255,.97);backdrop-filter:blur(16px);
  border-bottom:1px solid var(--bd);box-shadow:var(--sh-sm);
  display:flex;align-items:center;justify-content:space-between;
  padding:0 48px;height:72px;
}
.uigc-page .nav-logo img { height:38px;width:auto; }
.uigc-page .nav-site-title {
  color:var(--ink);font-size:18px;font-weight:800;line-height:1.2;
}
.uigc-page .nav-links {
  display:flex;align-items:center;list-style:none;margin:0;padding:0;gap:2px;
}
.uigc-page .nav-links .menu-item { position:relative;margin:0; }
.uigc-page .nav-links a {
  font-size:14px;font-weight:500;color:var(--txm);padding:8px 16px;border-radius:6px;
  transition:color .2s,background .2s;
}
.uigc-page .nav-links > .menu-item-has-children > a {
  display:flex;align-items:center;gap:8px;
}
.uigc-page .nav-links > .menu-item-has-children > a::after {
  content:'';width:6px;height:6px;border-right:1.5px solid currentColor;
  border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-2px);
  transition:transform .2s;
}
.uigc-page .nav-links a:hover { color:var(--ink);background:var(--bg3); }
.uigc-page .nav-links a.active,
.uigc-page .nav-links .current-menu-item > a,
.uigc-page .nav-links .current-menu-ancestor > a { color:var(--green-d); }
@media(min-width:769px) {
  .uigc-page .nav-links .sub-menu {
    position:absolute;top:100%;left:0;z-index:500;display:block;
    min-width:250px;list-style:none;margin:0;padding:8px;
    background:#fff;border:1px solid var(--bd);border-radius:10px;
    box-shadow:0 14px 36px rgba(0,0,0,.16);
    opacity:0;visibility:hidden;pointer-events:none;
    transform:translateY(8px);transition:opacity .18s,transform .18s,visibility .18s;
  }
  .uigc-page .nav-links .sub-menu .menu-item { width:100%; }
  .uigc-page .nav-links .sub-menu a {
    display:block;width:100%;padding:11px 13px;border-radius:7px;
    color:var(--txm);line-height:1.35;white-space:normal;
  }
  .uigc-page .nav-links .sub-menu a:hover,
  .uigc-page .nav-links .sub-menu .current-menu-item > a {
    color:var(--green-d);background:var(--bg3);
  }
  .uigc-page .nav-links .menu-item-has-children:hover > .sub-menu,
  .uigc-page .nav-links .menu-item-has-children:focus-within > .sub-menu,
  .uigc-page .nav-links .menu-item-has-children.menu-item-dropdown-open > .sub-menu {
    opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0);
  }
  .uigc-page .nav-links .menu-item-has-children.menu-item-dropdown-open > a::after {
    transform:rotate(225deg) translate(-1px,-1px);
  }
}
.uigc-page .live-btn {
  display:flex;align-items:center;gap:8px;background:var(--green);color:#000;
  font-size:13px;font-weight:700;letter-spacing:.02em;
  padding:10px 22px;border-radius:6px;
  transition:background .2s,transform .15s;
  box-shadow:var(--sh-g);
}
.uigc-page .live-btn:hover { background:var(--green-d);color:#fff;transform:translateY(-1px); }

.uigc-page .hamburger {
  display:none;flex-direction:column;gap:5px;cursor:pointer;
  background:none;border:none;padding:4px;
}
.uigc-page .hamburger span { width:24px;height:2px;background:var(--ink);border-radius:1px;transition:all .3s;display:block; }
.uigc-page .hamburger.open span:nth-child(1) { transform:rotate(45deg) translate(5px,5px); }
.uigc-page .hamburger.open span:nth-child(2) { opacity:0; }
.uigc-page .hamburger.open span:nth-child(3) { transform:rotate(-45deg) translate(5px,-5px); }

.uigc-page .fm-mobile-menu {
  display:none;position:fixed;top:72px;left:0;right:0;bottom:0;
  background:#fff;z-index:190;padding:24px;flex-direction:column;gap:4px;
  border-top:1px solid var(--bd);overflow-y:auto;
}
.uigc-page .fm-mobile-menu.open { display:flex; }
.uigc-page .fm-mobile-menu-links {
  list-style:none;margin:0;padding:0;
}
.uigc-page .fm-mobile-menu-links .sub-menu {
  display:none;list-style:none;margin:0;padding:0 0 0 20px;
}
.uigc-page .fm-mobile-menu-links .menu-item-dropdown-open > .sub-menu {
  display:block;
}
.uigc-page .fm-mobile-menu-links .menu-item-has-children > a::after {
  content:'+';margin-left:auto;color:var(--green-d);font-size:22px;line-height:1;
}
.uigc-page .fm-mobile-menu-links .menu-item-has-children.menu-item-dropdown-open > a::after {
  content:'−';
}
.uigc-page .fm-mobile-menu a {
  font-size:18px;padding:16px;border-bottom:1px solid var(--bd);
  color:var(--ink);display:flex;justify-content:space-between;border-radius:6px;
}
.uigc-page .fm-mobile-menu a:hover { background:var(--bg3); }
.uigc-page .fm-mobile-menu .current-menu-item > a,
.uigc-page .fm-mobile-menu .current-menu-ancestor > a { color:var(--green-d); }

/* =========================================================
   HERO — Clean, professional, whitespace-rich
   ========================================================= */
.uigc-page .fm-hero {
  position:relative;overflow:hidden;
  padding:64px 48px 72px;min-height:calc(100vh - 72px);
  display:flex;align-items:flex-end;
}
.uigc-page .fm-hero::before {
  content:'';position:absolute;top:0;left:0;width:4px;height:100%;background:var(--green);z-index:3;
}
.uigc-page .fm-hero-scrim {
  position:absolute;inset:0;z-index:1;
  background:linear-gradient(to top, rgba(0,0,0,.88) 0%, rgba(0,0,0,.55) 22%, rgba(0,0,0,.1) 45%, rgba(0,0,0,0) 58%);
}

/* =========================================================
   STATS
   ========================================================= */
.uigc-page .stats { background:var(--ink); }
.uigc-page .stat-n { color:var(--green);font-weight:700; }
.uigc-page .stat-l { color:rgba(255,255,255,.55); }

/* =========================================================
   CARDS
   ========================================================= */
.uigc-page .card {
  background:#fff;border:1px solid var(--bd);border-radius:12px;
  padding:32px;transition:border-color .2s,box-shadow .2s,transform .2s;
  --ink:#0A0A0A; --txm:#4A4A4A; --txmu:#6B6B6B; --txl:#9A9A9A; --bd:#E5E5E5;
}
.uigc-page .card:hover { border-color:var(--green);box-shadow:var(--sh-md);transform:translateY(-3px); }

/* ── Dark section utility ─────────────────────────────────
   Redefines the shared text-color variables in scope, so any
   heading/paragraph already using var(--ink)/var(--txm)/var(--txmu)
   automatically becomes legible on black — no per-element overrides
   needed. Used to alternate sections between white and black. */
.uigc-page .sec-dark {
  background:#0A0A0A !important;
  --ink:#fff; --txm:rgba(255,255,255,.75); --txmu:rgba(255,255,255,.55); --txl:rgba(255,255,255,.45); --bd:rgba(255,255,255,.15);
}
.uigc-page .sec-dark .slbl { color:var(--green-l); }

/* Entity card – has accent line */
.uigc-page .ent-card {
  background:#fff;border:1px solid var(--bd);padding:40px;
  position:relative;overflow:hidden;transition:transform .25s,box-shadow .25s;
  --ink:#0A0A0A; --txm:#4A4A4A; --txmu:#6B6B6B; --txl:#9A9A9A; --bd:#E5E5E5;
}
.uigc-page .ent-card:hover { transform:translateY(-3px);box-shadow:var(--sh-md); }
.uigc-page .ent-card::before {
  content:'';position:absolute;top:0;left:0;width:0;height:3px;
  background:var(--green);transition:width .3s;
}
.uigc-page .ent-card:hover::before { width:100%; }

/* =========================================================
   FOOTER
   ========================================================= */
.uigc-page .ipgh-footer {
  background:var(--ink);color:rgba(255,255,255,.55);
  padding:64px 48px 0;border-top:3px solid var(--green);
}
.uigc-page .ipgh-footer .fin { max-width:1200px;margin:0 auto; }
.uigc-page .ipgh-footer .fgrid {
  display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:48px;
  padding-bottom:48px;border-bottom:1px solid rgba(255,255,255,.1);
}
.uigc-page .ipgh-footer .fh {
  font-family:'Inter',sans-serif;font-size:11px;color:var(--green);
  letter-spacing:.14em;text-transform:uppercase;margin-bottom:16px;
}
.uigc-page .ipgh-footer .flinks li { margin-bottom:10px; }
.uigc-page .ipgh-footer .flinks a { font-size:14px;color:rgba(255,255,255,.55);transition:color .2s; }
.uigc-page .ipgh-footer .flinks a:hover { color:#fff; }
.uigc-page .ipgh-footer .fbot {
  display:flex;justify-content:space-between;align-items:center;
  padding:20px 0;font-family:'Inter',sans-serif;font-size:11px;
  color:rgba(255,255,255,.3);flex-wrap:wrap;gap:8px;
}
.uigc-page .fsocs { display:flex;gap:8px; }
.uigc-page .fsoc {
  width:34px;height:34px;border-radius:6px;border:1px solid rgba(255,255,255,.15);
  color:rgba(255,255,255,.5);display:flex;align-items:center;justify-content:center;
  font-size:13px;transition:border-color .2s,color .2s,background .2s;
}
.uigc-page .fsoc:hover { border-color:var(--green);color:var(--green);background:rgba(129,185,68,.1); }

/* =========================================================
   PAGE HEADER (inner pages)
   ========================================================= */
.uigc-page .fm-page-header {
  background:var(--ink);padding:64px 48px 56px;
  position:relative;overflow:hidden;
  border-bottom:3px solid var(--green);
}
.uigc-page .fm-page-header-in { max-width:1200px;margin:0 auto;position:relative;z-index:2; }
.uigc-page .fm-breadcrumb {
  display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-bottom:14px;
  font-family:'Inter',sans-serif;font-size:11px;letter-spacing:.1em;text-transform:uppercase;
}
.uigc-page .fm-breadcrumb a { color:rgba(255,255,255,.5);transition:color .2s; }
.uigc-page .fm-breadcrumb a:hover { color:var(--green); }
.uigc-page .fm-breadcrumb span { color:rgba(255,255,255,.3); }
.uigc-page .fm-page-title {
  font-family:'Inter',sans-serif;font-weight:800;
  font-size:clamp(28px,4vw,52px);letter-spacing:-.02em;
  color:#fff;line-height:1;margin:0;
}

/* =========================================================
   FLOATING BACK TO TOP
   ========================================================= */
.uigc-page .back-top {
  position:fixed;bottom:24px;right:24px;background:var(--green);color:#000;
  width:44px;height:44px;border-radius:8px;display:flex;align-items:center;justify-content:center;
  font-size:18px;font-weight:700;box-shadow:var(--sh-g);text-decoration:none;
  z-index:300;transition:background .2s,transform .2s;
}
.uigc-page .back-top:hover { background:var(--ink);color:var(--green);transform:translateY(-2px); }

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media(max-width:1024px) {
  .uigc-page .ipgh-footer .fgrid { grid-template-columns:1fr 1fr;gap:32px; }
}
@media(max-width:768px) {
  .uigc-page .sec { padding:64px 24px; }
  .uigc-page .fm-hero { padding:64px 24px;min-height:auto; }
  .uigc-page .fm-topbar,.uigc-page #fm-nav,.uigc-page .fm-page-header,.uigc-page .ipgh-footer { padding-left:24px;padding-right:24px; }
  .uigc-page .nav-links { display:none; }
  .uigc-page .hamburger { display:flex; }
  .uigc-page .ipgh-footer .fgrid { grid-template-columns:1fr; }

  /* Stack every two-column section layout into a single column,
     so content reflows onto the next line instead of squeezing/
     overflowing horizontally — matches Bootstrap's column-collapse
     behaviour. Covers Our Story, Human Capital, Our Mandate cards,
     In the Community, Home Base, Follow Us, and Connect. */
  .uigc-page .sec-in > div[style*="grid-template-columns:1"],
  .uigc-page .sec-in > div > div[style*="grid-template-columns:1"],
  .uigc-page section > div[style*="grid-template-columns:1"] {
    grid-template-columns: 1fr !important;
  }

  /* Fixed-count grids (repeat(N,1fr)) don't auto-adjust like the
     auto-fit/minmax ones do, so they need explicit mobile rules.
     Our Mandate's 4 cards go 2-by-2 rather than squeezing into
     one row or stacking fully to one column. */
  .uigc-page section[id="our-mandate"] div[style*="repeat(4,1fr)"] {
    grid-template-columns: repeat(2,1fr) !important;
  }
}

/* =========================================================
   LOGO — natural display, no transformations
   ========================================================= */
.uigc-page .nav-logo {
  display: flex;
  align-items: center;
  text-decoration: none;
}
.uigc-page .nav-logo img {
  display: block;
  height: 42px !important;
  width: auto !important;
  max-width: none !important;
  object-fit: contain;
  background: transparent;
  padding: 0;
  margin: 0;
  border: none;
}

/* ── Nav logo ──────────────────────────────────────────────── */
.uigc-page .nav-logo img {
  display: block;
  height: 72px !important;
  width: auto !important;
  max-width: none !important;
  object-fit: contain;
  background: transparent;
  padding: 0;
  margin: 0;
  border: none;
}