@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap');
:root{--navy:#020817;--panel:#081a39;--gold:#d8a63e;--gold2:#f3cf78;--white:#f8fbff;--muted:#a9b4c7;--line:rgba(255,255,255,.12);--max:1180px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at 80% 12%,rgba(23,76,155,.24),transparent 30%),linear-gradient(145deg,#01040d,#061630);color:var(--white);font-family:Inter,Arial,sans-serif;line-height:1.7}a{color:inherit;text-decoration:none}header{position:sticky;top:0;z-index:20;background:rgba(2,8,23,.84);backdrop-filter:blur(16px);border-bottom:1px solid var(--line)}nav{max-width:var(--max);margin:auto;padding:.8rem 1.2rem;display:flex;align-items:center;justify-content:space-between;gap:1rem}.brand{font-weight:900;color:var(--gold2);letter-spacing:.05em}.navlinks{display:flex;gap:.6rem;flex-wrap:wrap}.navlinks a{padding:.65rem .8rem;border-radius:999px;font-weight:800;font-size:.84rem}.navlinks a:hover{background:rgba(255,255,255,.07)}main{max-width:var(--max);margin:auto;padding:4.5rem 1.2rem 6rem}.hero{display:grid;grid-template-columns:1fr .8fr;gap:1.2rem;align-items:stretch}.card{background:linear-gradient(145deg,rgba(8,26,57,.92),rgba(2,8,23,.96));border:1px solid var(--line);border-radius:30px;padding:1.7rem;box-shadow:0 26px 80px rgba(0,0,0,.3)}.eyebrow{color:var(--gold2);font-weight:900;letter-spacing:.16em;text-transform:uppercase;font-size:.78rem}.hero h1{font-size:clamp(3rem,7vw,6.8rem);line-height:.9;letter-spacing:-.07em;margin:.65rem 0 1.1rem}.hero p,.card p{color:var(--muted)}.visual{min-height:420px;display:grid;place-items:center;position:relative;overflow:hidden}.orb{width:min(300px,72%);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 34% 28%,#fff8cf 0 4%,#ffc84d 8%,#1a64b9 29%,#061a40 68%);box-shadow:0 0 70px rgba(50,136,255,.25)}.visual:after{content:"";position:absolute;width:78%;height:45%;border:1px solid rgba(243,207,120,.5);border-radius:50%;transform:rotate(-18deg)}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:1rem}.grid .card h2{margin:.2rem 0 .5rem;font-size:1.3rem}.tag{display:inline-flex;padding:.4rem .65rem;border:1px solid rgba(216,166,62,.25);border-radius:999px;background:rgba(216,166,62,.08);color:var(--gold2);font-weight:800;font-size:.78rem}.cta{margin-top:1rem;display:flex;gap:.7rem;flex-wrap:wrap}.btn{display:inline-flex;padding:.8rem 1rem;border-radius:999px;font-weight:900;border:1px solid rgba(255,255,255,.18)}.btn.primary{background:linear-gradient(135deg,var(--gold2),var(--gold));color:#09101d;border:0}.notice{margin-top:1rem;color:#91a0b7;font-size:.9rem}.skip{position:fixed;left:1rem;top:-70px;background:var(--gold2);color:#07101f;padding:.7rem 1rem;z-index:100;border-radius:10px;font-weight:900}.skip:focus{top:1rem}@media(max-width:850px){.hero,.grid{grid-template-columns:1fr}.visual{min-height:300px}.navlinks{display:none}}

/* Shared RD NovaSphere connected-pattern background for all secondary pages */
#page-pattern{
  position:fixed;
  inset:0;
  width:100vw;
  height:100vh;
  z-index:0;
  pointer-events:none;
  opacity:.82;
}
body{position:relative;min-height:100vh;isolation:isolate}
body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-2;
  pointer-events:none;
  background:
    radial-gradient(circle at 82% 14%,rgba(34,95,190,.20),transparent 30%),
    radial-gradient(circle at 15% 22%,rgba(216,166,62,.07),transparent 24%),
    linear-gradient(145deg,#01040d 0%,#020817 46%,#061630 100%);
}
header,main,footer,.skip{position:relative;z-index:2}
.card{background:linear-gradient(145deg,rgba(8,26,57,.82),rgba(2,8,23,.88));-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
@media(max-width:700px){#page-pattern{opacity:.62}}
@media(prefers-reduced-motion:reduce){#page-pattern{opacity:.45}}


/* 2026 refinement: clearer hierarchy, responsive polish, and accessible motion */
:root{--radius:26px;--focus:0 0 0 4px rgba(216,166,62,.18)}
html{scroll-padding-top:88px}
body{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
nav{min-height:76px}.brand{display:inline-flex;align-items:center;gap:.55rem}.brand:before{content:"✦";font-size:.8rem;color:var(--gold);filter:drop-shadow(0 0 8px rgba(216,166,62,.5))}
.card{border-radius:var(--radius);transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease}.card:hover{border-color:rgba(243,207,120,.22);box-shadow:0 28px 80px rgba(0,0,0,.34)}
.hero>.card:first-child{display:flex;flex-direction:column;justify-content:center}.hero h1{text-wrap:balance}.card p{max-width:72ch}.btn{align-items:center;justify-content:center;transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease}.btn:hover{transform:translateY(-2px);border-color:rgba(243,207,120,.42)}.btn.primary:hover{box-shadow:0 14px 34px rgba(216,166,62,.22)}
a:focus-visible,button:focus-visible,input:focus-visible{outline:none;box-shadow:var(--focus)}
.trust-strip{margin-top:1rem;display:grid;grid-template-columns:repeat(4,1fr);gap:1px;border:1px solid var(--line);border-radius:18px;overflow:hidden;background:var(--line)}.trust-strip span{padding:.85rem 1rem;text-align:center;background:rgba(3,12,30,.82);color:#dce5f4;font-size:.76rem;font-weight:800;letter-spacing:.04em}.trust-strip span:before{content:"✓";color:var(--gold2);margin-right:.45rem}
@media(max-width:850px){main{padding-top:2.2rem}.hero h1{font-size:clamp(2.8rem,13vw,5rem)}.trust-strip{grid-template-columns:1fr 1fr}.navlinks{display:flex}.navlinks a:nth-child(2){display:none}}
@media(max-width:520px){nav{padding:.7rem 1rem}.navlinks a{padding:.55rem .5rem;font-size:.75rem}.card{padding:1.25rem;border-radius:22px}.trust-strip{grid-template-columns:1fr}.hero{gap:.85rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.card,.btn{transition:none}.card:hover,.btn:hover{transform:none}}

/* Project-specific hero illustrations */
.project-visual{min-height:430px;isolation:isolate;background:radial-gradient(circle at 50% 42%,rgba(46,115,213,.17),transparent 34%),linear-gradient(145deg,rgba(7,23,51,.88),rgba(2,8,23,.95))}
.project-visual:before{content:"";position:absolute;inset:8%;border-radius:26px;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:30px 30px;mask-image:radial-gradient(circle,#000 22%,transparent 76%);opacity:.5}
.pv-stage{position:relative;width:min(320px,78%);aspect-ratio:1;display:grid;place-items:center}
.pv-caption{position:absolute;left:1.35rem;right:1.35rem;bottom:1.25rem;display:flex;justify-content:space-between;gap:1rem;color:#91a0b7;font-size:.74rem}.pv-caption b{color:var(--gold2)}
.pv-ring{position:absolute;inset:5%;border:1px solid rgba(243,207,120,.42);border-radius:50%;animation:pvSpin 20s linear infinite}.pv-ring.r2{inset:16% -3%;transform:rotate(62deg);border-color:rgba(93,169,255,.32);animation-duration:25s;animation-direction:reverse}
.pv-node{position:absolute;width:12px;height:12px;border-radius:50%;background:#f3cf78;box-shadow:0 0 0 6px rgba(243,207,120,.09),0 0 24px rgba(243,207,120,.72)}
.pv-node.blue{background:#69b5ff;box-shadow:0 0 0 6px rgba(105,181,255,.09),0 0 24px rgba(105,181,255,.68)}

/* ABLE AI: voice, chat and accessibility */
.able-core{position:relative;width:74%;height:62%;border-radius:32px;background:linear-gradient(145deg,rgba(11,44,92,.92),rgba(3,14,33,.96));border:1px solid rgba(104,180,255,.28);box-shadow:0 24px 70px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;gap:8px;padding:1.3rem}
.able-core:before{content:"AI";position:absolute;top:18px;left:20px;color:#f3cf78;font-weight:900;letter-spacing:.12em;font-size:.72rem}
.wave{width:8px;border-radius:99px;background:linear-gradient(#f3cf78,#4ba6ff);box-shadow:0 0 16px rgba(75,166,255,.35);animation:wave 1.25s ease-in-out infinite}.wave:nth-child(1){height:24%}.wave:nth-child(2){height:44%;animation-delay:.1s}.wave:nth-child(3){height:70%;animation-delay:.2s}.wave:nth-child(4){height:48%;animation-delay:.3s}.wave:nth-child(5){height:82%;animation-delay:.4s}.wave:nth-child(6){height:52%;animation-delay:.5s}.wave:nth-child(7){height:30%;animation-delay:.6s}
.able-bubble{position:absolute;right:-7%;bottom:10%;padding:.68rem .82rem;border-radius:18px 18px 4px 18px;background:rgba(4,17,39,.85);border:1px solid rgba(243,207,120,.26);font-size:.72rem;font-weight:800;color:#dce8fb;backdrop-filter:blur(12px)}

/* Trust Afric: trust shield and connected evidence */
.trust-core{position:relative;width:68%;aspect-ratio:.86;background:linear-gradient(145deg,#173f7e,#071a3a);clip-path:polygon(50% 0,92% 18%,84% 72%,50% 100%,16% 72%,8% 18%);display:grid;place-items:center;box-shadow:0 0 65px rgba(42,126,238,.25);filter:drop-shadow(0 24px 40px rgba(0,0,0,.4))}
.trust-core:before{content:"AF";font-size:clamp(3.2rem,7vw,5.6rem);font-weight:900;letter-spacing:-.08em;color:#f8fbff;text-shadow:0 10px 30px rgba(0,0,0,.4)}
.trust-core:after{content:"TRUST";position:absolute;bottom:18%;font-size:.68rem;letter-spacing:.24em;color:#f3cf78;font-weight:900}
.trust-link{position:absolute;height:1px;background:linear-gradient(90deg,transparent,rgba(243,207,120,.7),transparent);transform-origin:left center}.trust-link.l1{width:34%;left:3%;top:30%;transform:rotate(13deg)}.trust-link.l2{width:34%;right:2%;top:35%;transform:rotate(164deg)}.trust-link.l3{width:30%;left:7%;bottom:22%;transform:rotate(-19deg)}.trust-link.l4{width:30%;right:6%;bottom:22%;transform:rotate(198deg)}

/* Grasmere: learning, growth and community */
.school-core{position:relative;width:78%;height:66%;display:grid;place-items:end center}
.school-building{width:74%;height:58%;border-radius:12px 12px 20px 20px;background:linear-gradient(145deg,#f7d77f,#d89f32);position:relative;box-shadow:0 24px 55px rgba(0,0,0,.38)}
.school-building:before{content:"";position:absolute;left:-10%;right:-10%;top:-34%;height:42%;background:#fff2c6;clip-path:polygon(50% 0,100% 100%,0 100%);filter:drop-shadow(0 10px 18px rgba(0,0,0,.22))}
.school-building:after{content:"LEARN";position:absolute;inset:0;display:grid;place-items:center;color:#0a1832;font-weight:900;letter-spacing:.16em}
.school-door{position:absolute;bottom:0;left:50%;transform:translateX(-50%);width:22%;height:42%;border-radius:8px 8px 0 0;background:#0a224d}
.school-leaf{position:absolute;width:42px;height:72px;border-radius:80% 0 80% 0;background:linear-gradient(145deg,#8fd27a,#2d8c61);right:7%;top:3%;transform:rotate(28deg);box-shadow:0 0 24px rgba(80,190,117,.25)}

/* Interactive Web Lab: layered browser interfaces */
.web-core{position:relative;width:82%;height:68%}.browser{position:absolute;border:1px solid rgba(104,180,255,.25);background:linear-gradient(145deg,rgba(9,35,75,.94),rgba(3,14,34,.96));border-radius:20px;box-shadow:0 22px 55px rgba(0,0,0,.38);overflow:hidden}.browser.main{inset:8% 4% 4% 8%}.browser.small{width:48%;height:44%;right:-6%;bottom:-4%;transform:rotate(4deg)}.browser:before{content:"•••";display:block;height:34px;padding:.2rem .8rem;color:#f3cf78;letter-spacing:.2em;border-bottom:1px solid rgba(255,255,255,.08)}.code-lines{padding:1rem;display:grid;gap:.55rem}.code-lines i{display:block;height:8px;border-radius:99px;background:linear-gradient(90deg,#68b4ff,#f3cf78);opacity:.78}.code-lines i:nth-child(2){width:68%}.code-lines i:nth-child(3){width:84%}.code-lines i:nth-child(4){width:52%}

/* Analytics: data dashboard */
.analytics-core{position:relative;width:82%;height:70%;border-radius:26px;background:linear-gradient(145deg,rgba(8,35,77,.94),rgba(2,13,31,.96));border:1px solid rgba(104,180,255,.25);box-shadow:0 24px 60px rgba(0,0,0,.4);padding:1.2rem;display:grid;grid-template-columns:1.2fr .8fr;gap:.9rem}
.chart-card{border-radius:18px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);position:relative;overflow:hidden}.bars{position:absolute;inset:18% 12% 12%;display:flex;align-items:flex-end;gap:10px}.bars i{flex:1;border-radius:8px 8px 2px 2px;background:linear-gradient(#68b4ff,#1a5aa6);box-shadow:0 0 18px rgba(104,180,255,.18)}.bars i:nth-child(1){height:32%}.bars i:nth-child(2){height:58%}.bars i:nth-child(3){height:44%}.bars i:nth-child(4){height:78%;background:linear-gradient(#f3cf78,#c18c28)}.bars i:nth-child(5){height:66%}.spark{position:absolute;inset:18% 10%}.spark svg{width:100%;height:100%}.metric-stack{display:grid;gap:.9rem}.metric{border-radius:16px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);padding:.8rem}.metric b{display:block;color:#f3cf78;font-size:1.2rem}.metric span{font-size:.68rem;color:#9fb0c8}

/* Human–AI collaboration: dual intelligence bridge */
.collab-core{position:relative;width:80%;height:72%;display:flex;align-items:center;justify-content:space-between}.mind{width:42%;aspect-ratio:1;border-radius:50%;display:grid;place-items:center;font-weight:900;font-size:clamp(2.4rem,6vw,4.5rem);box-shadow:0 0 50px rgba(47,128,235,.2)}.mind.human{background:radial-gradient(circle at 35% 28%,#fff4cd 0 4%,#f3cf78 9%,#9a5d2d 42%,#2a1422 78%)}.mind.ai{background:radial-gradient(circle at 35% 28%,#e6f5ff 0 4%,#68b4ff 10%,#185bb1 43%,#07152f 78%)}.mind span{color:#fff;text-shadow:0 8px 26px rgba(0,0,0,.38)}.bridge{position:absolute;left:40%;right:40%;height:5px;border-radius:99px;background:linear-gradient(90deg,#f3cf78,#fff,#68b4ff);box-shadow:0 0 24px rgba(255,255,255,.28)}.bridge:before,.bridge:after{content:"";position:absolute;top:50%;width:12px;height:12px;border-radius:50%;background:white;transform:translateY(-50%)}.bridge:before{left:-4px}.bridge:after{right:-4px}

/* NovaGem: faceted gem */
.gem-core{position:relative;width:72%;aspect-ratio:1;display:grid;place-items:center}.gem{width:76%;height:72%;clip-path:polygon(50% 0,88% 24%,100% 58%,50% 100%,0 58%,12% 24%);background:conic-gradient(from 210deg,#fff3c4,#f1c04f,#d88626,#6d2d2d,#154b89,#68b4ff,#fff3c4);box-shadow:0 0 70px rgba(243,207,120,.26);filter:drop-shadow(0 24px 34px rgba(0,0,0,.45));position:relative}.gem:before{content:"";position:absolute;inset:12%;clip-path:inherit;border:2px solid rgba(255,255,255,.35);background:linear-gradient(145deg,rgba(255,255,255,.28),transparent 50%)}.gem-label{position:absolute;bottom:8%;padding:.5rem .75rem;border-radius:999px;background:rgba(3,14,32,.78);border:1px solid rgba(243,207,120,.3);font-size:.72rem;font-weight:900;color:#f3cf78;letter-spacing:.1em}

/* Sample scholar: profile and evidence card */
.sample-core{position:relative;width:76%;height:68%;display:grid;grid-template-columns:.8fr 1.2fr;gap:.8rem;padding:1rem;border-radius:28px;background:linear-gradient(145deg,rgba(9,34,75,.94),rgba(3,14,34,.96));border:1px solid rgba(104,180,255,.24);box-shadow:0 24px 60px rgba(0,0,0,.4)}.sample-avatar{border-radius:22px;background:linear-gradient(145deg,#f3cf78,#8e5c25);display:grid;place-items:center;color:#07101f;font-size:2.2rem;font-weight:900}.sample-info{display:grid;align-content:center;gap:.55rem}.sample-info i{height:9px;border-radius:99px;background:linear-gradient(90deg,#68b4ff,#f3cf78);opacity:.8}.sample-info i:nth-child(2){width:72%}.sample-info i:nth-child(3){width:86%}.sample-info i:nth-child(4){width:58%}

@keyframes pvSpin{to{transform:rotate(360deg)}}@keyframes wave{50%{transform:scaleY(.58);opacity:.7}}
@media(max-width:850px){.project-visual{min-height:340px}.pv-caption{font-size:.68rem}.analytics-core{width:88%}}
@media(prefers-reduced-motion:reduce){.pv-ring,.wave{animation:none!important}}