:root{
  --green:#0a7a3c;
  --green-2:#13a052;
  --lime:#58c45d;
  --ink:#132126;
  --slate:#57666c;
  --soft:#f3f7f4;
  --line:#dfe8e2;
  --white:#fff;
  --gold:#b69a58;
  --shadow:0 20px 50px rgba(16,38,27,.12);
  --radius:22px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:#fff;line-height:1.6}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.container{width:min(1180px,92%);margin:auto}
.topbar{background:#0d2419;color:#dce8df;font-size:.84rem}
.topbar .container{display:flex;justify-content:space-between;gap:20px;padding:9px 0}
.navbar{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.94);backdrop-filter:blur(14px);border-bottom:1px solid rgba(15,50,28,.08)}
.nav{height:82px;display:flex;align-items:center;justify-content:space-between;gap:28px}
.brand{display:flex;align-items:center;gap:12px;min-width:280px}
.brand img{width:58px;height:58px;object-fit:contain;border-radius:50%}
.brand strong{font-size:.93rem;line-height:1.12;letter-spacing:.01em}
.brand span{display:block;color:var(--green);font-size:.72rem;margin-top:4px;font-weight:800;letter-spacing:.08em}
.navlinks{display:flex;align-items:center;gap:22px;font-size:.91rem;font-weight:700}
.navlinks a{padding:29px 0;position:relative}
.navlinks a:after{content:"";position:absolute;left:0;right:100%;bottom:19px;height:2px;background:var(--green);transition:.25s}
.navlinks a:hover:after,.navlinks a.active:after{right:0}
.nav-cta,.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;border-radius:999px;padding:13px 20px;font-weight:800;border:1px solid transparent;transition:.2s}
.nav-cta,.btn-primary{background:var(--green);color:white}
.btn-primary:hover,.nav-cta:hover{background:#075f2e;transform:translateY(-1px)}
.btn-secondary{background:#fff;border-color:#cfe0d4;color:var(--ink)}
.btn-secondary:hover{border-color:var(--green);color:var(--green)}
.menu-btn{display:none;background:none;border:0;font-size:1.5rem}
.hero{position:relative;overflow:hidden;background:
 radial-gradient(circle at 82% 18%,rgba(88,196,93,.32),transparent 22%),
 linear-gradient(135deg,#082619 0%,#0d5f35 55%,#0b7a3c 100%);
 color:#fff}
.hero:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);background-size:44px 44px;mask-image:linear-gradient(to bottom,black,transparent 90%)}
.hero .container{min-height:680px;display:grid;grid-template-columns:1.15fr .85fr;gap:54px;align-items:center;position:relative}
.kicker{text-transform:uppercase;font-weight:900;letter-spacing:.18em;font-size:.79rem;color:#9ce5ae}
.hero h1{font-size:clamp(3.1rem,6vw,5.7rem);line-height:.94;letter-spacing:-.055em;margin:14px 0 22px;max-width:860px}
.hero h1 em{font-style:normal;color:#8fe39f}
.hero p{max-width:720px;font-size:1.13rem;color:#e2eee6;margin-bottom:30px}
.actions{display:flex;gap:12px;flex-wrap:wrap}
.hero .btn-secondary{background:transparent;color:#fff;border-color:rgba(255,255,255,.35)}
.statpanel{background:rgba(255,255,255,.095);border:1px solid rgba(255,255,255,.2);border-radius:32px;padding:30px;backdrop-filter:blur(10px);box-shadow:0 30px 70px rgba(0,0,0,.2)}
.statpanel .logo-mark{width:100px;margin:0 0 30px auto;border-radius:50%;background:white;padding:4px}
.stat{padding:18px 0;border-top:1px solid rgba(255,255,255,.16)}
.stat:first-of-type{border-top:0}
.stat b{font-size:1.7rem;display:block}
.stat span{font-size:.9rem;color:#dbe9df}
.section{padding:92px 0}
.section.soft{background:var(--soft)}
.section.dark{background:#0e2118;color:#fff}
.section-head{display:flex;justify-content:space-between;gap:40px;align-items:end;margin-bottom:42px}
.section-head h2{font-size:clamp(2.2rem,4vw,3.7rem);letter-spacing:-.04em;line-height:1.03;margin:.3rem 0}
.section-head p{max-width:620px;color:var(--slate);margin:0}
.dark .section-head p{color:#c6d4cb}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:26px}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:30px;box-shadow:0 12px 36px rgba(11,52,29,.055)}
.card h3{font-size:1.28rem;margin:.2rem 0 .5rem}
.card p{color:var(--slate);margin:0}
.icon{width:48px;height:48px;border-radius:15px;background:#e7f6eb;color:var(--green);display:grid;place-items:center;font-size:1.35rem;font-weight:900;margin-bottom:18px}
.feature{display:grid;grid-template-columns:.88fr 1.12fr;gap:54px;align-items:center}
.visual{min-height:470px;border-radius:30px;background:
 linear-gradient(145deg,rgba(9,116,56,.9),rgba(10,42,29,.95)),
 repeating-linear-gradient(45deg,rgba(255,255,255,.05) 0 2px,transparent 2px 20px);
 padding:38px;color:#fff;display:flex;flex-direction:column;justify-content:end;box-shadow:var(--shadow);position:relative;overflow:hidden}
.visual:after{content:"";position:absolute;width:300px;height:300px;border:44px solid rgba(255,255,255,.06);border-radius:50%;top:-70px;right:-80px}
.visual small{font-weight:900;letter-spacing:.14em;color:#9ce5ae}
.visual h3{font-size:2.3rem;line-height:1.02;max-width:480px;margin:10px 0}
.checks{display:grid;gap:14px;margin:24px 0}
.check{display:flex;gap:12px;align-items:flex-start}
.check i{width:25px;height:25px;border-radius:50%;background:#e2f3e7;color:var(--green);font-style:normal;font-weight:900;display:grid;place-items:center;flex:0 0 25px}
.project-card{position:relative;min-height:360px;padding:32px;border-radius:26px;overflow:hidden;background:linear-gradient(160deg,#e6efe8,#cbded0);display:flex;flex-direction:column;justify-content:end}
.project-card:before{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(7,37,23,.88),rgba(7,37,23,.05) 72%)}
.project-card > *{position:relative;color:white}
.project-card .tag{align-self:flex-start;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.25);padding:7px 11px;border-radius:99px;font-size:.75rem;font-weight:800;margin-bottom:12px}
.project-card h3{font-size:1.55rem;margin:0 0 6px}
.project-card p{margin:0;color:#ddebe2}
.project-card.kumasi{background:linear-gradient(140deg,#859d91,#315b47)}
.project-card.sunyani{background:linear-gradient(140deg,#9ba795,#47664a)}
.project-card.hotel{background:linear-gradient(140deg,#828d88,#344943)}
.process{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.step{padding:25px 24px;border-left:2px solid var(--green);background:#fff;color:#132126;border-radius:0 18px 18px 0}
.step b{display:block;color:var(--green);font-size:.78rem;letter-spacing:.13em}
.step h3{margin:6px 0 8px}
.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:36px}
.metric{padding:26px;border-radius:18px;background:#fff;border:1px solid var(--line)}
.metric strong{display:block;font-size:2rem;color:var(--green)}
.metric span{font-size:.86rem;color:var(--slate)}
.cta{background:linear-gradient(135deg,#0f3222,#08733b);color:#fff;border-radius:34px;padding:52px;display:flex;align-items:center;justify-content:space-between;gap:35px}
.cta h2{font-size:2.5rem;line-height:1.06;margin:0 0 8px}
.cta p{margin:0;color:#dbe9e0;max-width:680px}
.pagehero{background:linear-gradient(135deg,#0f2c20,#08733b);color:#fff;padding:95px 0 70px}
.pagehero h1{font-size:clamp(2.8rem,5vw,4.8rem);line-height:.97;letter-spacing:-.04em;margin:.4rem 0}
.pagehero p{max-width:760px;color:#dce9e0;font-size:1.08rem}
.split{display:grid;grid-template-columns:1fr 1fr;gap:42px;align-items:start}
.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:20px}
table{border-collapse:collapse;width:100%;background:white}
th,td{text-align:left;padding:16px;border-bottom:1px solid var(--line);vertical-align:top}
th{background:#0f3725;color:#fff;font-size:.78rem;letter-spacing:.08em;text-transform:uppercase}
tr:last-child td{border-bottom:0}
.footer{background:#0a1d14;color:#d9e6dd;padding:60px 0 25px}
.footer-grid{display:grid;grid-template-columns:1.35fr 1fr 1fr 1fr;gap:40px}
.footer h4{color:white;margin-top:0}
.footer a{display:block;color:#bcd0c3;margin:8px 0}
.footer .brand{min-width:0;color:white}
.footer .brand img{background:white;padding:3px}
.legal{border-top:1px solid rgba(255,255,255,.12);margin-top:40px;padding-top:22px;font-size:.8rem;color:#92aa9a}
.form{display:grid;gap:14px}
.form input,.form textarea,.form select{width:100%;padding:14px 15px;border:1px solid #d2ded6;border-radius:12px;font:inherit}
.form textarea{min-height:145px;resize:vertical}
.note{font-size:.82rem;color:var(--slate)}
@media (max-width:980px){
 .navlinks{display:none;position:absolute;top:82px;left:0;right:0;background:#fff;padding:20px 4%;box-shadow:var(--shadow);flex-direction:column;align-items:flex-start}
 .navlinks.open{display:flex}
 .navlinks a{padding:7px 0}
 .navlinks a:after{display:none}
 .menu-btn{display:block}
 .nav-cta{display:none}
 .hero .container,.feature,.split{grid-template-columns:1fr}
 .hero .container{padding:70px 0}
 .statpanel{max-width:620px}
 .grid-3,.process{grid-template-columns:repeat(2,1fr)}
 .metrics{grid-template-columns:repeat(2,1fr)}
 .footer-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:650px){
 .topbar{display:none}
 .brand{min-width:0}
 .brand strong{font-size:.76rem}
 .brand span{font-size:.62rem}
 .grid-3,.grid-2,.process,.metrics,.footer-grid{grid-template-columns:1fr}
 .section{padding:68px 0}
 .section-head{display:block}
 .hero h1{font-size:3rem}
 .cta{padding:34px;display:block}
 .cta .actions{margin-top:25px}
}

.project-card{background-size:cover!important;background-position:center!important}
.project-card.knust-img{background-image:url('../images/knust-main.png')!important}
.project-card.uenr-img{background-image:url('../images/uenr-main.jpg')!important}
.project-card.stu-img{background-image:url('../images/stu-main.jpg')!important}
.gallery{display:grid;grid-template-columns:2fr 1fr 1fr;gap:12px;margin-top:24px}.gallery img{width:100%;height:220px;object-fit:cover;border-radius:16px}.gallery img:first-child{height:452px;grid-row:span 2}.project-detail{margin-bottom:70px}.project-meta{display:flex;gap:10px;flex-wrap:wrap;margin:12px 0 20px}.project-meta span{background:#e7f6eb;color:#0a7a3c;border-radius:999px;padding:7px 11px;font-size:.78rem;font-weight:800}@media(max-width:700px){.gallery{grid-template-columns:1fr}.gallery img,.gallery img:first-child{height:230px;grid-row:auto}}

/* FIX: Development lifecycle cards */
.section.dark .process .step {
    background: #ffffff !important;
    color: #132126 !important;
    padding: 24px !important;
    min-height: 150px !important;
    border-radius: 18px !important;
    display: block !important;
}

.section.dark .process .step b {
    display: block !important;
    color: #18a852 !important;
    font-size: 14px !important;
    margin-bottom: 16px !important;
}

.section.dark .process .step h3 {
    color: #132126 !important;
    font-size: 20px !important;
    margin: 0 0 10px !important;
    display: block !important;
}

.section.dark .process .step p {
    color: #5b6460 !important;
    display: block !important;
    margin: 0 !important;
    line-height: 1.5 !important;
}
/* SHOW LIFECYCLE CARD TEXT */
.section.dark .process .step h3 {
    color: #132126 !important;
    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
    -webkit-text-fill-color: #132126 !important;
}

.section.dark .process .step p {
    color: #5b6460 !important;
    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
    -webkit-text-fill-color: #5b6460 !important;
}