Report-it Kenya | Safe Reporting Platform
:root, [data-theme=”light”] {
–text-xs: clamp(0.75rem, 0.7rem + 0.25vw, 0.875rem);
–text-sm: clamp(0.875rem, 0.8rem + 0.35vw, 1rem);
–text-base: clamp(1rem, 0.95rem + 0.25vw, 1.125rem);
–text-lg: clamp(1.125rem, 1rem + 0.75vw, 1.5rem);
–text-xl: clamp(1.5rem, 1.2rem + 1.25vw, 2.25rem);
–text-2xl: clamp(2.3rem, 1.4rem + 3vw, 4.5rem);
–space-1: 0.25rem;
–space-2: 0.5rem;
–space-3: 0.75rem;
–space-4: 1rem;
–space-5: 1.25rem;
–space-6: 1.5rem;
–space-8: 2rem;
–space-10: 2.5rem;
–space-12: 3rem;
–space-16: 4rem;
–space-20: 5rem;
–space-24: 6rem;
–radius-sm: 0.375rem;
–radius-md: 0.75rem;
–radius-lg: 1.25rem;
–radius-xl: 1.75rem;
–color-bg: #f7f6f2;
–color-surface: #f9f8f5;
–color-surface-2: #ffffff;
–color-surface-offset: #edeae5;
–color-border: rgba(40, 37, 29, 0.11);
–color-divider: rgba(40, 37, 29, 0.08);
–color-text: #28251d;
–color-text-muted: #67655f;
–color-text-faint: #8b8982;
–color-text-inverse: #f9f8f4;
–color-primary: #0d5c63;
–color-primary-hover: #09474c;
–color-accent: #c68a2f;
–color-danger: #8f2f4e;
–shadow-sm: 0 1px 2px rgba(32, 28, 20, 0.06);
–shadow-md: 0 10px 30px rgba(32, 28, 20, 0.08);
–shadow-lg: 0 18px 48px rgba(32, 28, 20, 0.12);
–content-default: 1120px;
–font-display: ‘Instrument Serif’, Georgia, serif;
–font-body: ‘Inter’, Arial, sans-serif;
–transition: 180ms cubic-bezier(0.16, 1, 0.3, 1);
}
[data-theme=”dark”] {
–color-bg: #171614;
–color-surface: #1c1b19;
–color-surface-2: #22211f;
–color-surface-offset: #2a2927;
–color-border: rgba(238, 236, 231, 0.12);
–color-divider: rgba(238, 236, 231, 0.09);
–color-text: #e8e5de;
–color-text-muted: #beb9af;
–color-text-faint: #938f87;
–color-text-inverse: #171614;
–color-primary: #64a4ab;
–color-primary-hover: #8dbcc1;
–color-accent: #d3a85e;
–color-danger: #d46a91;
–shadow-sm: 0 1px 2px rgba(0,0,0,0.2);
–shadow-md: 0 10px 30px rgba(0,0,0,0.28);
–shadow-lg: 0 18px 48px rgba(0,0,0,0.35);
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
margin: 0;
min-height: 100vh;
font-family: var(–font-body);
font-size: var(–text-base);
line-height: 1.6;
background: var(–color-bg);
color: var(–color-text);
text-rendering: optimizeLegibility;
}
img, svg { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button, input, textarea, select { font: inherit; }
.skip-link {
position: absolute;
left: var(–space-4);
top: -3rem;
background: var(–color-primary);
color: var(–color-text-inverse);
padding: var(–space-3) var(–space-4);
border-radius: var(–radius-sm);
z-index: 100;
}
.skip-link:focus { top: var(–space-4); }
.container {
width: min(calc(100% – 2rem), var(–content-default));
margin-inline: auto;
}
.section {
padding-block: clamp(var(–space-12), 8vw, var(–space-24));
}
.eyebrow {
display: inline-flex;
align-items: center;
gap: var(–space-2);
font-size: var(–text-xs);
text-transform: uppercase;
letter-spacing: 0.14em;
color: var(–color-text-muted);
font-weight: 700;
}
.eyebrow::before {
content: “”;
width: 2.4rem;
height: 1px;
background: currentColor;
opacity: 0.5;
}
.site-header {
position: sticky;
top: 0;
z-index: 50;
backdrop-filter: blur(18px);
background: color-mix(in srgb, var(–color-bg) 88%, transparent);
border-bottom: 1px solid var(–color-divider);
}
.header-row {
display: flex;
align-items: center;
justify-content: space-between;
gap: var(–space-4);
padding: 0.9rem 0;
}
.brand {
display: inline-flex;
align-items: center;
gap: var(–space-3);
font-weight: 700;
letter-spacing: -0.02em;
}
.brand-mark {
width: 2.4rem;
height: 2.4rem;
border-radius: 0.8rem;
background: linear-gradient(145deg, var(–color-primary), color-mix(in srgb, var(–color-primary) 55%, var(–color-accent)));
color: white;
display: grid;
place-items: center;
box-shadow: var(–shadow-sm);
}
.brand-mark svg { width: 1.25rem; height: 1.25rem; }
.nav {
display: flex;
align-items: center;
gap: var(–space-5);
font-size: var(–text-sm);
color: var(–color-text-muted);
}
.nav a:hover, .nav a:focus-visible { color: var(–color-text); }
.header-actions {
display: flex;
align-items: center;
gap: var(–space-3);
}
.theme-toggle, .menu-toggle {
min-width: 44px;
min-height: 44px;
border-radius: 999px;
border: 1px solid var(–color-border);
background: var(–color-surface-2);
color: var(–color-text);
display: grid;
place-items: center;
cursor: pointer;
transition: transform var(–transition), border-color var(–transition), background var(–transition);
}
.theme-toggle:hover, .menu-toggle:hover { transform: translateY(-1px); }
.menu-toggle { display: none; }
.btn {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.6rem;
min-height: 46px;
padding: 0.9rem 1.2rem;
border-radius: 999px;
border: 1px solid transparent;
font-size: var(–text-sm);
font-weight: 700;
transition: transform var(–transition), background var(–transition), color var(–transition), border-color var(–transition), box-shadow var(–transition);
cursor: pointer;
}
.btn:hover { transform: translateY(-1px); }
.btn-primary {
background: var(–color-primary);
color: var(–color-text-inverse);
box-shadow: var(–shadow-sm);
}
.btn-primary:hover { background: var(–color-primary-hover); }
.btn-secondary {
background: transparent;
color: var(–color-text);
border-color: var(–color-border);
}
.hero {
padding-top: clamp(var(–space-12), 6vw, var(–space-20));
padding-bottom: var(–space-16);
}
.hero-grid {
display: grid;
grid-template-columns: 1.1fr 0.9fr;
gap: clamp(var(–space-8), 4vw, var(–space-16));
align-items: start;
}
.hero-copy h1 {
margin: var(–space-5) 0 var(–space-5);
font-family: var(–font-display);
font-size: var(–text-2xl);
line-height: 0.96;
letter-spacing: -0.035em;
max-width: 12ch;
}
.hero-copy p {
margin: 0 0 var(–space-6);
max-width: 62ch;
color: var(–color-text-muted);
}
.hero-actions {
display: flex;
flex-wrap: wrap;
gap: var(–space-3);
margin-bottom: var(–space-8);
}
.signal-row {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: var(–space-4);
padding-top: var(–space-6);
border-top: 1px solid var(–color-divider);
}
.signal strong {
display: block;
font-size: var(–text-lg);
line-height: 1.1;
margin-bottom: 0.2rem;
}
.signal span { color: var(–color-text-muted); font-size: var(–text-sm); }
.hero-panel {
position: relative;
background: linear-gradient(180deg, color-mix(in srgb, var(–color-surface-2) 78%, transparent), var(–color-surface));
border: 1px solid var(–color-border);
border-radius: var(–radius-xl);
padding: var(–space-6);
box-shadow: var(–shadow-lg);
overflow: hidden;
}
.hero-panel::before {
content: “”;
position: absolute;
inset: auto -10% 70% 45%;
height: 14rem;
background: radial-gradient(circle, color-mix(in srgb, var(–color-primary) 18%, transparent), transparent 65%);
pointer-events: none;
}
.mock-window {
border-radius: var(–radius-lg);
overflow: hidden;
border: 1px solid var(–color-border);
background: var(–color-surface-2);
}
.mock-top {
display: flex;
align-items: center;
gap: 0.45rem;
padding: 0.8rem 1rem;
border-bottom: 1px solid var(–color-divider);
background: var(–color-surface);
}
.dot {
width: 0.65rem;
height: 0.65rem;
border-radius: 999px;
background: var(–color-surface-offset);
}
.mock-body {
display: grid;
gap: var(–space-4);
padding: var(–space-5);
}
.mock-card, .step, .info-card, .faq-item, .form-shell, .cta-strip {
background: var(–color-surface);
border: 1px solid var(–color-border);
border-radius: var(–radius-lg);
}
.mock-card { padding: var(–space-4); }
.mock-card h3, .info-card h3, .step h3, .section-title { margin: 0 0 var(–space-3); }
.pill {
display: inline-flex;
align-items: center;
gap: 0.5rem;
font-size: var(–text-xs);
font-weight: 700;
letter-spacing: 0.08em;
text-transform: uppercase;
color: var(–color-primary);
background: color-mix(in srgb, var(–color-primary) 10%, var(–color-surface-2));
padding: 0.45rem 0.7rem;
border-radius: 999px;
margin-bottom: var(–space-3);
}
.stack {
display: grid;
gap: var(–space-4);
}
.section-head {
display: flex;
justify-content: space-between;
align-items: end;
gap: var(–space-5);
margin-bottom: var(–space-8);
}
.section-head p {
max-width: 56ch;
color: var(–color-text-muted);
margin: 0;
}
h2.section-title {
font-size: var(–text-xl);
line-height: 1.05;
font-family: var(–font-display);
letter-spacing: -0.03em;
}
.grid-3 {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: var(–space-5);
}
.info-card {
padding: var(–space-5);
box-shadow: var(–shadow-sm);
min-height: 100%;
}
.info-card p, .step p, .faq-item p, .form-shell p { color: var(–color-text-muted); }
.icon-chip {
width: 3rem;
height: 3rem;
border-radius: 1rem;
display: grid;
place-items: center;
background: color-mix(in srgb, var(–color-primary) 12%, var(–color-surface-2));
color: var(–color-primary);
margin-bottom: var(–space-4);
}
.process {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: var(–space-5);
}
.step {
padding: var(–space-5);
position: relative;
overflow: hidden;
}
.step-number {
font-size: var(–text-xs);
font-weight: 800;
letter-spacing: 0.12em;
text-transform: uppercase;
color: var(–color-accent);
margin-bottom: var(–space-4);
display: inline-block;
}
.band {
background: var(–color-surface);
border-block: 1px solid var(–color-divider);
}
.split {
display: grid;
grid-template-columns: 0.95fr 1.05fr;
gap: var(–space-6);
align-items: start;
}
.bullet-list {
display: grid;
gap: var(–space-4);
margin: 0;
padding: 0;
list-style: none;
}
.bullet-list li {
padding: 0 0 var(–space-4);
border-bottom: 1px solid var(–color-divider);
}
.bullet-list li:last-child { border-bottom: 0; padding-bottom: 0; }
.bullet-list strong { display: block; margin-bottom: 0.2rem; }
.form-shell {
padding: var(–space-5);
box-shadow: var(–shadow-md);
}
.demo-form {
display: grid;
gap: var(–space-4);
margin-top: var(–space-4);
}
.field {
display: grid;
gap: 0.45rem;
}
.field label {
font-size: var(–text-xs);
text-transform: uppercase;
letter-spacing: 0.08em;
font-weight: 700;
color: var(–color-text-muted);
}
.field input, .field select, .field textarea {
width: 100%;
border-radius: 1rem;
border: 1px solid var(–color-border);
background: var(–color-surface-2);
color: var(–color-text);
padding: 0.95rem 1rem;
outline: none;
}
.field textarea { min-height: 160px; resize: vertical; }
.field input:focus, .field select:focus, .field textarea:focus {
border-color: color-mix(in srgb, var(–color-primary) 60%, var(–color-border));
box-shadow: 0 0 0 4px color-mix(in srgb, var(–color-primary) 14%, transparent);
}
.field-row {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: var(–space-4);
}
.notice {
padding: var(–space-4);
border-radius: 1rem;
background: color-mix(in srgb, var(–color-accent) 10%, var(–color-surface-2));
border: 1px solid color-mix(in srgb, var(–color-accent) 24%, var(–color-border));
font-size: var(–text-sm);
}
.faq-grid {
display: grid;
gap: var(–space-4);
}
.faq-item { padding: var(–space-5); }
.cta-strip {
padding: clamp(var(–space-6), 4vw, var(–space-10));
display: flex;
justify-content: space-between;
gap: var(–space-5);
align-items: center;
background: linear-gradient(135deg, color-mix(in srgb, var(–color-primary) 9%, var(–color-surface)), var(–color-surface));
box-shadow: var(–shadow-md);
}
.site-footer {
padding: var(–space-8) 0 var(–space-12);
color: var(–color-text-muted);
font-size: var(–text-sm);
}
.footer-grid {
display: flex;
justify-content: space-between;
gap: var(–space-4);
padding-top: var(–space-6);
border-top: 1px solid var(–color-divider);
flex-wrap: wrap;
}
.fade-up {
opacity: 0;
transform: translateY(18px);
transition: opacity 700ms cubic-bezier(0.16,1,0.3,1), transform 700ms cubic-bezier(0.16,1,0.3,1);
}
.fade-up.in-view {
opacity: 1;
transform: translateY(0);
}
@media (max-width: 980px) {
.hero-grid, .split, .grid-3, .process { grid-template-columns: 1fr; }
.section-head, .cta-strip, .footer-grid { flex-direction: column; align-items: flex-start; }
.nav {
position: absolute;
top: calc(100% + 0.5rem);
left: 1rem;
right: 1rem;
display: none;
flex-direction: column;
align-items: flex-start;
padding: var(–space-4);
background: var(–color-surface-2);
border: 1px solid var(–color-border);
border-radius: var(–radius-lg);
box-shadow: var(–shadow-lg);
}
.nav.open { display: flex; }
.menu-toggle { display: grid; }
.header-actions .btn-secondary { display: none; }
}
@media (max-width: 720px) {
.field-row, .signal-row { grid-template-columns: 1fr; }
.hero-copy h1 { max-width: 10ch; }
}
@media (prefers-reduced-motion: reduce) {
html { scroll-behavior: auto; }
*, *::before, *::after { animation: none !important; transition: none !important; }
.fade-up { opacity: 1; transform: none; }
}
Skip to content
Secure public-interest reporting
Report concerns clearly, safely, and without confusion.
Use this website to receive reports about corruption, misconduct, abuse, fraud, unsafe practices, or other serious concerns. The page is written to help people understand what they can report, how information is handled, and what happens next.
Anonymous option
People can submit without adding contact details.
Clear review path
Set expectations for screening, escalation, and follow-up.
Mobile friendly
Designed for fast use on phones, tablets, and desktops.
Trusted intake
What can be reported
Corruption, fraud, abuse of office, procurement irregularities, harassment, safety incidents, academic misconduct, or other documented concerns.
Submission essentials
What happened, when it happened, where it happened, who was involved, and any files that support the account.
Safety reminder
Do not share identifying information unless you want follow-up contact. Emergency threats should be reported to the relevant emergency authority.
Purpose
A reporting page built for trust, not noise.
The design avoids sensational language and focuses on clarity. Visitors should immediately understand whether this platform fits their concern, what information is useful, and how their submission will be treated.
Safe framing
Tell users what this channel is for, what it is not for, and when emergency matters should go elsewhere.
Useful detail
Guide people to provide dates, locations, names, attachments, and a concise narrative that can actually be reviewed.
Privacy clarity
Be explicit about optional contact details, retention periods, review teams, and any limits to confidentiality.
Process
How reporting works on the site.
These steps can remain as page content even after you connect a real form plugin. They help reduce uncertainty and improve the quality of submissions.
Step 01
Prepare the facts
Ask the reporter to describe the event plainly, including date, location, institution, people involved, and available evidence.
Step 02
Choose anonymity
Let the person decide whether to stay anonymous or provide an email/phone number for updates.
Step 03
Review and next action
Explain that submissions are screened, acknowledged where possible, and referred internally according to policy.
Submission page
Paste your live form here, or use this layout as the page shell.
This section is intentionally ready for a WordPress Custom HTML block or a page-builder embed. You can keep the explanatory text on the left and replace the right-hand demo form with WPForms, Gravity Forms, Contact Form 7, or another secure reporting form.
Suggested categories. Corruption, fraud, abuse, safeguarding, harassment, safety, procurement irregularity, academic misconduct, cyber issue, other concern.Essential fields. Category, summary, full description, date, location, people involved, attachments, and optional contact details.Important warning. If anonymity matters, tell users not to identify themselves inside the free-text area or uploaded files.
Privacy
Plain-language privacy and handling statements.
This content is drafted so you can adapt it for your final legal and administrative process. Review it before publishing and align it with your actual reporting workflow.
What we collect
Information submitted through the form may include the details of the incident, supporting documents, optional contact information, and technical data needed to operate the website securely.
Why we collect it
We use submitted information to assess reported concerns, determine whether further review is needed, and manage follow-up where the reporter has chosen to provide contact details.
Limits to confidentiality
Information may be shared internally with authorised reviewers and, where required by law or policy, with competent authorities. State these limits clearly in your final live version.
Questions
Frequently asked questions.
These are useful on launch because they reduce hesitation and answer the concerns most users have before using a reporting channel.
Can someone report anonymously?
Yes. The page is written to support anonymous reporting. If anonymity is important, avoid typing your identity into the narrative field or uploading files that reveal it.
Will every report receive a reply?
Only promise replies where your operational process can support them. If no contact details are provided, you may not be able to respond directly.
What should not be submitted here?
Do not use this page for emergencies, urgent medical matters, or situations where immediate law-enforcement or emergency response is needed.
Ready to publish
Use this page as your full landing page or split it into Home, Report, Privacy, and FAQ.
Go to report section
(function () {
const root = document.documentElement;
const themeButton = document.querySelector(‘[data-theme-toggle]’);
const menuButton = document.querySelector(‘.menu-toggle’);
const nav = document.getElementById(‘site-nav’);
let theme = window.matchMedia(‘(prefers-color-scheme: dark)’).matches ? ‘dark’ : ‘light’;
root.setAttribute(‘data-theme’, theme);
const renderThemeIcon = () => {
themeButton.innerHTML = theme === ‘dark’
? ”
: ”;
themeButton.setAttribute(‘aria-label’, theme === ‘dark’ ? ‘Switch to light mode’ : ‘Switch to dark mode’);
};
renderThemeIcon();
themeButton.addEventListener(‘click’, function () {
theme = theme === ‘dark’ ? ‘light’ : ‘dark’;
root.setAttribute(‘data-theme’, theme);
renderThemeIcon();
});
if (menuButton && nav) {
menuButton.addEventListener(‘click’, function () {
const open = nav.classList.toggle(‘open’);
menuButton.setAttribute(‘aria-expanded’, String(open));
});
nav.querySelectorAll(‘a’).forEach(link => link.addEventListener(‘click’, () => {
nav.classList.remove(‘open’);
menuButton.setAttribute(‘aria-expanded’, ‘false’);
}));
}
document.getElementById(‘year’).textContent = new Date().getFullYear();
const observer = new IntersectionObserver((entries) => {
entries.forEach(entry => {
if (entry.isIntersecting) {
entry.target.classList.add(‘in-view’);
observer.unobserve(entry.target);
}
});
}, { threshold: 0.15 });
document.querySelectorAll(‘.fade-up’).forEach(el => observer.observe(el));
})();
Report-it! Kenya! 