{"id":6,"date":"2026-06-01T13:42:29","date_gmt":"2026-06-01T13:42:29","guid":{"rendered":"https:\/\/stillmaterials.com\/?page_id=6"},"modified":"2026-06-01T14:11:35","modified_gmt":"2026-06-01T14:11:35","slug":"home","status":"publish","type":"page","link":"https:\/\/stillmaterials.com\/","title":{"rendered":"Home"},"content":{"rendered":"\t\t
\n\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\r\n\r\n\r\n \r\n \r\n Steel Materials Company (SMC) Ltd | Agro-Processing & Construction Materials<\/title>\r\n <meta name=\"description\" content=\"Steel Materials Company (SMC) Ltd - A Rwandan company diversifying into agro-processing with a modern maize processing plant in Rwamagana District.\">\r\n \r\n <!-- Fonts -->\r\n <link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n <link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\r\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Playfair+Display:wght@400;600;700&family=Source+Sans+3:wght@300;400;500;600;700&display=swap\" rel=\"stylesheet\">\r\n \r\n <!-- Phosphor Icons -->\r\n <script src=\"https:\/\/unpkg.com\/@phosphor-icons\/web@2.0.3\"><\/script>\r\n \r\n <style>\r\n \/* ========================================\r\n CSS Custom Properties\r\n ======================================== *\/\r\n :root {\r\n --color-primary: #1B5E20;\r\n --color-primary-light: #2E7D32;\r\n --color-secondary: #F9A825;\r\n --color-accent: #E65100;\r\n --color-bg-light: #F5F5F0;\r\n --color-bg-dark: #1A1A1A;\r\n --color-text-primary: #212121;\r\n --color-text-secondary: #5D4037;\r\n --color-text-muted: #757575;\r\n --color-white: #FFFFFF;\r\n \r\n --font-serif: 'Playfair Display', Georgia, serif;\r\n --font-sans: 'Source Sans 3', -apple-system, sans-serif;\r\n \r\n --shadow-sm: 0 2px 8px rgba(0,0,0,0.08);\r\n --shadow-md: 0 4px 16px rgba(0,0,0,0.1);\r\n --shadow-lg: 0 8px 32px rgba(0,0,0,0.12);\r\n \r\n --transition-fast: 200ms ease;\r\n --transition-base: 300ms ease;\r\n --transition-slow: 500ms ease-out;\r\n }\r\n\r\n \/* ========================================\r\n Reset & Base Styles\r\n ======================================== *\/\r\n *, *::before, *::after {\r\n box-sizing: border-box;\r\n margin: 0;\r\n padding: 0;\r\n }\r\n\r\n html {\r\n scroll-behavior: smooth;\r\n }\r\n\r\n body {\r\n font-family: var(--font-sans);\r\n font-size: 16px;\r\n line-height: 1.6;\r\n color: var(--color-text-primary);\r\n background-color: var(--color-white);\r\n -webkit-font-smoothing: antialiased;\r\n }\r\n\r\n img {\r\n max-width: 100%;\r\n height: auto;\r\n }\r\n\r\n a {\r\n text-decoration: none;\r\n color: inherit;\r\n }\r\n\r\n button {\r\n font-family: inherit;\r\n cursor: pointer;\r\n border: none;\r\n background: none;\r\n }\r\n\r\n \/* ========================================\r\n Utility Classes\r\n ======================================== *\/\r\n .container {\r\n max-width: 1200px;\r\n margin: 0 auto;\r\n padding: 0 24px;\r\n }\r\n\r\n .section {\r\n padding: 80px 0;\r\n }\r\n\r\n @media (max-width: 768px) {\r\n .section {\r\n padding: 48px 0;\r\n }\r\n }\r\n\r\n .section-eyebrow {\r\n font-size: 13px;\r\n font-weight: 600;\r\n letter-spacing: 2px;\r\n text-transform: uppercase;\r\n color: var(--color-accent);\r\n margin-bottom: 12px;\r\n }\r\n\r\n .section-title {\r\n font-family: var(--font-serif);\r\n font-size: clamp(28px, 5vw, 42px);\r\n font-weight: 700;\r\n color: var(--color-text-primary);\r\n line-height: 1.2;\r\n margin-bottom: 16px;\r\n }\r\n\r\n .section-subtitle {\r\n font-size: 18px;\r\n color: var(--color-text-muted);\r\n max-width: 600px;\r\n }\r\n\r\n .text-center {\r\n text-align: center;\r\n }\r\n\r\n .text-center .section-subtitle {\r\n margin: 0 auto;\r\n }\r\n\r\n \/* Animation Classes *\/\r\n .fade-up {\r\n opacity: 0;\r\n transform: translateY(30px);\r\n transition: opacity 0.6s ease-out, transform 0.6s ease-out;\r\n }\r\n\r\n .fade-up.visible {\r\n opacity: 1;\r\n transform: translateY(0);\r\n }\r\n\r\n .stagger-1 { transition-delay: 100ms; }\r\n .stagger-2 { transition-delay: 200ms; }\r\n .stagger-3 { transition-delay: 300ms; }\r\n .stagger-4 { transition-delay: 400ms; }\r\n .stagger-5 { transition-delay: 500ms; }\r\n\r\n \/* ========================================\r\n Buttons\r\n ======================================== *\/\r\n .btn {\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n gap: 8px;\r\n padding: 14px 32px;\r\n font-size: 15px;\r\n font-weight: 600;\r\n border-radius: 6px;\r\n transition: all var(--transition-base);\r\n }\r\n\r\n .btn-primary {\r\n background-color: var(--color-accent);\r\n color: var(--color-white);\r\n }\r\n\r\n .btn-primary:hover {\r\n background-color: #BF360C;\r\n transform: translateY(-2px);\r\n box-shadow: var(--shadow-md);\r\n }\r\n\r\n .btn-secondary {\r\n background-color: transparent;\r\n color: var(--color-white);\r\n border: 2px solid var(--color-white);\r\n }\r\n\r\n .btn-secondary:hover {\r\n background-color: var(--color-white);\r\n color: var(--color-primary);\r\n }\r\n\r\n .btn-outline {\r\n background-color: transparent;\r\n color: var(--color-primary);\r\n border: 2px solid var(--color-primary);\r\n }\r\n\r\n .btn-outline:hover {\r\n background-color: var(--color-primary);\r\n color: var(--color-white);\r\n }\r\n\r\n \/* ========================================\r\n Navigation\r\n ======================================== *\/\r\n .nav {\r\n position: fixed;\r\n top: 0;\r\n left: 0;\r\n right: 0;\r\n z-index: 1000;\r\n padding: 20px 0;\r\n transition: all var(--transition-base);\r\n }\r\n\r\n .nav.scrolled {\r\n background-color: var(--color-white);\r\n box-shadow: var(--shadow-sm);\r\n padding: 12px 0;\r\n }\r\n\r\n .nav.scrolled .nav-link {\r\n color: var(--color-text-primary);\r\n }\r\n\r\n .nav.scrolled .nav-logo {\r\n color: var(--color-primary);\r\n }\r\n\r\n .nav-inner {\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-between;\r\n }\r\n\r\n .nav-logo {\r\n display: flex;\r\n align-items: center;\r\n gap: 10px;\r\n font-family: var(--font-serif);\r\n font-size: 20px;\r\n font-weight: 700;\r\n color: var(--color-white);\r\n transition: color var(--transition-base);\r\n }\r\n\r\n .nav-logo-icon {\r\n width: 40px;\r\n height: 40px;\r\n background: linear-gradient(135deg, var(--color-secondary), var(--color-accent));\r\n border-radius: 8px;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n color: var(--color-white);\r\n font-weight: 700;\r\n font-size: 18px;\r\n }\r\n\r\n .nav-links {\r\n display: flex;\r\n align-items: center;\r\n gap: 32px;\r\n list-style: none;\r\n }\r\n\r\n .nav-link {\r\n font-size: 15px;\r\n font-weight: 500;\r\n color: var(--color-white);\r\n transition: color var(--transition-fast);\r\n position: relative;\r\n }\r\n\r\n .nav-link::after {\r\n content: '';\r\n position: absolute;\r\n bottom: -4px;\r\n left: 0;\r\n width: 0;\r\n height: 2px;\r\n background-color: var(--color-secondary);\r\n transition: width var(--transition-base);\r\n }\r\n\r\n .nav-link:hover::after,\r\n .nav-link.active::after {\r\n width: 100%;\r\n }\r\n\r\n .nav-cta {\r\n padding: 10px 24px;\r\n font-size: 14px;\r\n }\r\n\r\n .nav.scrolled .nav-cta {\r\n background-color: var(--color-primary);\r\n color: var(--color-white);\r\n }\r\n\r\n \/* Mobile Menu *\/\r\n .nav-toggle {\r\n display: none;\r\n flex-direction: column;\r\n gap: 5px;\r\n padding: 8px;\r\n }\r\n\r\n .nav-toggle span {\r\n width: 24px;\r\n height: 2px;\r\n background-color: var(--color-white);\r\n transition: all var(--transition-base);\r\n }\r\n\r\n .nav.scrolled .nav-toggle span {\r\n background-color: var(--color-text-primary);\r\n }\r\n\r\n @media (max-width: 768px) {\r\n .nav-toggle {\r\n display: flex;\r\n }\r\n\r\n .nav-links {\r\n position: fixed;\r\n top: 0;\r\n right: -100%;\r\n width: 280px;\r\n height: 100vh;\r\n background-color: var(--color-white);\r\n flex-direction: column;\r\n align-items: flex-start;\r\n padding: 80px 32px 32px;\r\n gap: 24px;\r\n box-shadow: var(--shadow-lg);\r\n transition: right var(--transition-base);\r\n }\r\n\r\n .nav-links.open {\r\n right: 0;\r\n }\r\n\r\n .nav-link {\r\n color: var(--color-text-primary);\r\n font-size: 18px;\r\n }\r\n\r\n .nav-toggle.active span:nth-child(1) {\r\n transform: rotate(45deg) translate(5px, 5px);\r\n }\r\n\r\n .nav-toggle.active span:nth-child(2) {\r\n opacity: 0;\r\n }\r\n\r\n .nav-toggle.active span:nth-child(3) {\r\n transform: rotate(-45deg) translate(5px, -5px);\r\n }\r\n }\r\n\r\n \/* Mobile Menu Overlay *\/\r\n .nav-overlay {\r\n position: fixed;\r\n top: 0;\r\n left: 0;\r\n right: 0;\r\n bottom: 0;\r\n background-color: rgba(0,0,0,0.5);\r\n opacity: 0;\r\n visibility: hidden;\r\n transition: all var(--transition-base);\r\n z-index: 999;\r\n }\r\n\r\n .nav-overlay.open {\r\n opacity: 1;\r\n visibility: visible;\r\n }\r\n\r\n \/* ========================================\r\n Hero Section\r\n ======================================== *\/\r\n .hero {\r\n min-height: 100vh;\r\n display: flex;\r\n align-items: center;\r\n position: relative;\r\n overflow: hidden;\r\n background: linear-gradient(135deg, rgba(27, 94, 32, 0.9), rgba(26, 26, 26, 0.85)),\r\n url('https:\/\/images.unsplash.com\/photo-1574323347407-f5e1ad6d020b?auto=format&fit=crop&w=1920&q=80') center\/cover no-repeat;\r\n }\r\n\r\n .hero::before {\r\n content: '';\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n right: 0;\r\n bottom: 0;\r\n background: linear-gradient(180deg, rgba(0,0,0,0.3) 0%, transparent 50%, rgba(0,0,0,0.4) 100%);\r\n }\r\n\r\n .hero-content {\r\n position: relative;\r\n z-index: 1;\r\n max-width: 700px;\r\n }\r\n\r\n .hero-badge {\r\n display: inline-flex;\r\n align-items: center;\r\n gap: 8px;\r\n background-color: rgba(255,255,255,0.15);\r\n padding: 8px 16px;\r\n border-radius: 50px;\r\n color: var(--color-white);\r\n font-size: 14px;\r\n font-weight: 500;\r\n margin-bottom: 24px;\r\n backdrop-filter: blur(10px);\r\n }\r\n\r\n .hero-badge i {\r\n color: var(--color-secondary);\r\n }\r\n\r\n .hero-title {\r\n font-family: var(--font-serif);\r\n font-size: clamp(36px, 7vw, 64px);\r\n font-weight: 700;\r\n color: var(--color-white);\r\n line-height: 1.1;\r\n margin-bottom: 24px;\r\n }\r\n\r\n .hero-title span {\r\n color: var(--color-secondary);\r\n }\r\n\r\n .hero-subtitle {\r\n font-size: 18px;\r\n color: rgba(255,255,255,0.9);\r\n margin-bottom: 40px;\r\n max-width: 540px;\r\n line-height: 1.7;\r\n }\r\n\r\n .hero-actions {\r\n display: flex;\r\n gap: 16px;\r\n flex-wrap: wrap;\r\n }\r\n\r\n .hero-scroll {\r\n position: absolute;\r\n bottom: 40px;\r\n left: 50%;\r\n transform: translateX(-50%);\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n gap: 8px;\r\n color: var(--color-white);\r\n opacity: 0.8;\r\n animation: bounce 2s infinite;\r\n }\r\n\r\n .hero-scroll span {\r\n font-size: 12px;\r\n letter-spacing: 1px;\r\n text-transform: uppercase;\r\n }\r\n\r\n @keyframes bounce {\r\n 0%, 20%, 50%, 80%, 100% { transform: translateX(-50%) translateY(0); }\r\n 40% { transform: translateX(-50%) translateY(-10px); }\r\n 60% { transform: translateX(-50%) translateY(-5px); }\r\n }\r\n\r\n \/* ========================================\r\n About Section\r\n ======================================== *\/\r\n .about {\r\n background-color: var(--color-white);\r\n }\r\n\r\n .about-grid {\r\n display: grid;\r\n grid-template-columns: 1fr 1fr;\r\n gap: 64px;\r\n align-items: center;\r\n }\r\n\r\n .about-content .section-subtitle {\r\n margin-bottom: 24px;\r\n }\r\n\r\n .about-features {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 20px;\r\n margin-top: 32px;\r\n }\r\n\r\n .about-feature {\r\n display: flex;\r\n align-items: flex-start;\r\n gap: 16px;\r\n }\r\n\r\n .about-feature-icon {\r\n width: 48px;\r\n height: 48px;\r\n background-color: var(--color-bg-light);\r\n border-radius: 12px;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n color: var(--color-primary);\r\n font-size: 24px;\r\n flex-shrink: 0;\r\n }\r\n\r\n .about-feature-text h4 {\r\n font-weight: 600;\r\n margin-bottom: 4px;\r\n }\r\n\r\n .about-feature-text p {\r\n font-size: 14px;\r\n color: var(--color-text-muted);\r\n }\r\n\r\n .about-image {\r\n position: relative;\r\n border-radius: 16px;\r\n overflow: hidden;\r\n box-shadow: var(--shadow-lg);\r\n }\r\n\r\n .about-image img {\r\n width: 100%;\r\n height: 400px;\r\n object-fit: cover;\r\n display: block;\r\n }\r\n\r\n .about-image-badge {\r\n position: absolute;\r\n bottom: 24px;\r\n left: 24px;\r\n background-color: var(--color-secondary);\r\n color: var(--color-text-primary);\r\n padding: 16px 24px;\r\n border-radius: 12px;\r\n font-weight: 700;\r\n box-shadow: var(--shadow-md);\r\n }\r\n\r\n .about-image-badge span {\r\n display: block;\r\n font-size: 12px;\r\n font-weight: 500;\r\n text-transform: uppercase;\r\n letter-spacing: 1px;\r\n opacity: 0.8;\r\n }\r\n\r\n @media (max-width: 900px) {\r\n .about-grid {\r\n grid-template-columns: 1fr;\r\n gap: 40px;\r\n }\r\n\r\n .about-image {\r\n order: -1;\r\n }\r\n\r\n .about-image img {\r\n height: 300px;\r\n }\r\n }\r\n\r\n \/* ========================================\r\n Vision & Mission Section\r\n ======================================== *\/\r\n .vision-mission {\r\n background-color: var(--color-bg-light);\r\n }\r\n\r\n .vm-grid {\r\n display: grid;\r\n grid-template-columns: repeat(2, 1fr);\r\n gap: 40px;\r\n }\r\n\r\n .vm-card {\r\n background-color: var(--color-white);\r\n padding: 48px;\r\n border-radius: 16px;\r\n box-shadow: var(--shadow-sm);\r\n transition: all var(--transition-base);\r\n position: relative;\r\n overflow: hidden;\r\n }\r\n\r\n .vm-card::before {\r\n content: '';\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n width: 4px;\r\n height: 100%;\r\n background: linear-gradient(180deg, var(--color-secondary), var(--color-accent));\r\n transform: scaleY(0);\r\n transition: transform var(--transition-base);\r\n }\r\n\r\n .vm-card:hover {\r\n transform: translateY(-4px);\r\n box-shadow: var(--shadow-lg);\r\n }\r\n\r\n .vm-card:hover::before {\r\n transform: scaleY(1);\r\n }\r\n\r\n .vm-icon {\r\n width: 64px;\r\n height: 64px;\r\n background: linear-gradient(135deg, var(--color-primary), var(--color-primary-light));\r\n border-radius: 16px;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n color: var(--color-white);\r\n font-size: 28px;\r\n margin-bottom: 24px;\r\n }\r\n\r\n .vm-card h3 {\r\n font-family: var(--font-serif);\r\n font-size: 28px;\r\n margin-bottom: 16px;\r\n color: var(--color-text-primary);\r\n }\r\n\r\n .vm-card p {\r\n color: var(--color-text-secondary);\r\n line-height: 1.8;\r\n }\r\n\r\n @media (max-width: 768px) {\r\n .vm-grid {\r\n grid-template-columns: 1fr;\r\n }\r\n\r\n .vm-card {\r\n padding: 32px;\r\n }\r\n }\r\n\r\n \/* ========================================\r\n Values Section\r\n ======================================== *\/\r\n .values {\r\n background-color: var(--color-white);\r\n }\r\n\r\n .values-grid {\r\n display: grid;\r\n grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));\r\n gap: 24px;\r\n margin-top: 48px;\r\n }\r\n\r\n .value-card {\r\n background-color: var(--color-bg-light);\r\n padding: 32px;\r\n border-radius: 12px;\r\n border: 2px solid transparent;\r\n transition: all var(--transition-base);\r\n }\r\n\r\n .value-card:hover {\r\n border-color: var(--color-secondary);\r\n transform: translateY(-4px);\r\n box-shadow: var(--shadow-md);\r\n }\r\n\r\n .value-icon {\r\n width: 56px;\r\n height: 56px;\r\n background: linear-gradient(135deg, var(--color-secondary), var(--color-accent));\r\n border-radius: 12px;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n color: var(--color-white);\r\n font-size: 26px;\r\n margin-bottom: 20px;\r\n }\r\n\r\n .value-card h3 {\r\n font-size: 20px;\r\n font-weight: 600;\r\n margin-bottom: 12px;\r\n color: var(--color-text-primary);\r\n }\r\n\r\n .value-card p {\r\n font-size: 15px;\r\n color: var(--color-text-muted);\r\n line-height: 1.6;\r\n }\r\n\r\n \/* ========================================\r\n Project Section\r\n ======================================== *\/\r\n .project {\r\n background: linear-gradient(135deg, var(--color-primary), var(--color-primary-light));\r\n color: var(--color-white);\r\n position: relative;\r\n overflow: hidden;\r\n }\r\n\r\n .project::before {\r\n content: '';\r\n position: absolute;\r\n top: 0;\r\n right: 0;\r\n width: 50%;\r\n height: 100%;\r\n background: url('https:\/\/images.unsplash.com\/photo-1558618666-fcd25c85cd64?auto=format&fit=crop&w=800&q=80') center\/cover;\r\n opacity: 0.2;\r\n }\r\n\r\n .project-grid {\r\n display: grid;\r\n grid-template-columns: 1fr 1fr;\r\n gap: 64px;\r\n align-items: center;\r\n position: relative;\r\n }\r\n\r\n .project-content .section-eyebrow {\r\n color: var(--color-secondary);\r\n }\r\n\r\n .project-content .section-title {\r\n color: var(--color-white);\r\n }\r\n\r\n .project-content .section-subtitle {\r\n color: rgba(255,255,255,0.85);\r\n }\r\n\r\n .project-features {\r\n display: grid;\r\n grid-template-columns: repeat(2, 1fr);\r\n gap: 20px;\r\n margin-top: 32px;\r\n }\r\n\r\n .project-feature {\r\n background-color: rgba(255,255,255,0.1);\r\n padding: 20px;\r\n border-radius: 12px;\r\n backdrop-filter: blur(10px);\r\n }\r\n\r\n .project-feature i {\r\n font-size: 32px;\r\n color: var(--color-secondary);\r\n margin-bottom: 12px;\r\n display: block;\r\n }\r\n\r\n .project-feature h4 {\r\n font-size: 16px;\r\n font-weight: 600;\r\n margin-bottom: 4px;\r\n }\r\n\r\n .project-feature p {\r\n font-size: 14px;\r\n opacity: 0.8;\r\n }\r\n\r\n .project-image {\r\n position: relative;\r\n border-radius: 16px;\r\n overflow: hidden;\r\n box-shadow: var(--shadow-lg);\r\n }\r\n\r\n .project-image img {\r\n width: 100%;\r\n height: 400px;\r\n object-fit: cover;\r\n }\r\n\r\n @media (max-width: 900px) {\r\n .project-grid {\r\n grid-template-columns: 1fr;\r\n }\r\n\r\n .project::before {\r\n display: none;\r\n }\r\n\r\n .project-image {\r\n display: none;\r\n }\r\n }\r\n\r\n @media (max-width: 480px) {\r\n .project-features {\r\n grid-template-columns: 1fr;\r\n }\r\n }\r\n\r\n \/* ========================================\r\n Stats Section\r\n ======================================== *\/\r\n .stats {\r\n background-color: var(--color-bg-light);\r\n }\r\n\r\n .stats-grid {\r\n display: grid;\r\n grid-template-columns: repeat(4, 1fr);\r\n gap: 32px;\r\n }\r\n\r\n .stat-item {\r\n text-align: center;\r\n padding: 24px;\r\n }\r\n\r\n .stat-number {\r\n font-family: var(--font-serif);\r\n font-size: clamp(36px, 5vw, 48px);\r\n font-weight: 700;\r\n color: var(--color-primary);\r\n line-height: 1;\r\n margin-bottom: 8px;\r\n }\r\n\r\n .stat-label {\r\n font-size: 14px;\r\n font-weight: 600;\r\n letter-spacing: 1px;\r\n text-transform: uppercase;\r\n color: var(--color-text-muted);\r\n }\r\n\r\n @media (max-width: 900px) {\r\n .stats-grid {\r\n grid-template-columns: repeat(2, 1fr);\r\n }\r\n }\r\n\r\n @media (max-width: 480px) {\r\n .stats-grid {\r\n grid-template-columns: 1fr;\r\n }\r\n }\r\n\r\n \/* ========================================\r\n Founder Section\r\n ======================================== *\/\r\n .founder {\r\n background-color: var(--color-white);\r\n }\r\n\r\n .founder-content {\r\n max-width: 800px;\r\n margin: 0 auto;\r\n text-align: center;\r\n }\r\n\r\n .founder-quote {\r\n position: relative;\r\n padding: 40px;\r\n background-color: var(--color-bg-light);\r\n border-radius: 16px;\r\n margin-top: 40px;\r\n }\r\n\r\n .founder-quote::before {\r\n content: '\"';\r\n font-family: var(--font-serif);\r\n font-size: 120px;\r\n color: var(--color-secondary);\r\n opacity: 0.3;\r\n position: absolute;\r\n top: 10px;\r\n left: 30px;\r\n line-height: 1;\r\n }\r\n\r\n .founder-quote blockquote {\r\n font-family: var(--font-serif);\r\n font-size: 20px;\r\n font-style: italic;\r\n color: var(--color-text-primary);\r\n line-height: 1.8;\r\n margin-bottom: 24px;\r\n position: relative;\r\n z-index: 1;\r\n }\r\n\r\n .founder-info {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n gap: 16px;\r\n }\r\n\r\n .founder-avatar {\r\n width: 56px;\r\n height: 56px;\r\n background: linear-gradient(135deg, var(--color-primary), var(--color-accent));\r\n border-radius: 50%;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n color: var(--color-white);\r\n font-size: 24px;\r\n font-weight: 600;\r\n }\r\n\r\n .founder-details {\r\n text-align: left;\r\n }\r\n\r\n .founder-details h4 {\r\n font-weight: 600;\r\n color: var(--color-text-primary);\r\n }\r\n\r\n .founder-details span {\r\n font-size: 14px;\r\n color: var(--color-text-muted);\r\n }\r\n\r\n \/* ========================================\r\n Contact Section\r\n ======================================== *\/\r\n .contact {\r\n background-color: var(--color-bg-light);\r\n }\r\n\r\n .contact-grid {\r\n display: grid;\r\n grid-template-columns: 1fr 1fr;\r\n gap: 64px;\r\n }\r\n\r\n .contact-info h3 {\r\n font-family: var(--font-serif);\r\n font-size: 28px;\r\n margin-bottom: 24px;\r\n color: var(--color-text-primary);\r\n }\r\n\r\n .contact-info > p {\r\n color: var(--color-text-secondary);\r\n margin-bottom: 32px;\r\n line-height: 1.7;\r\n }\r\n\r\n .contact-details {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 20px;\r\n }\r\n\r\n .contact-item {\r\n display: flex;\r\n align-items: flex-start;\r\n gap: 16px;\r\n }\r\n\r\n .contact-item-icon {\r\n width: 48px;\r\n height: 48px;\r\n background-color: var(--color-primary);\r\n border-radius: 12px;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n color: var(--color-white);\r\n font-size: 20px;\r\n flex-shrink: 0;\r\n }\r\n\r\n .contact-item h4 {\r\n font-weight: 600;\r\n margin-bottom: 4px;\r\n color: var(--color-text-primary);\r\n }\r\n\r\n .contact-item p {\r\n color: var(--color-text-muted);\r\n font-size: 15px;\r\n }\r\n\r\n .contact-form {\r\n background-color: var(--color-white);\r\n padding: 40px;\r\n border-radius: 16px;\r\n box-shadow: var(--shadow-md);\r\n }\r\n\r\n .contact-form h3 {\r\n font-family: var(--font-serif);\r\n font-size: 24px;\r\n margin-bottom: 24px;\r\n color: var(--color-text-primary);\r\n }\r\n\r\n .form-group {\r\n margin-bottom: 20px;\r\n }\r\n\r\n .form-group label {\r\n display: block;\r\n font-size: 14px;\r\n font-weight: 600;\r\n margin-bottom: 8px;\r\n color: var(--color-text-primary);\r\n }\r\n\r\n .form-group input,\r\n .form-group textarea {\r\n width: 100%;\r\n padding: 14px 16px;\r\n font-family: inherit;\r\n font-size: 15px;\r\n border: 2px solid #E0E0E0;\r\n border-radius: 8px;\r\n transition: all var(--transition-fast);\r\n background-color: var(--color-white);\r\n }\r\n\r\n .form-group input:focus,\r\n .form-group textarea:focus {\r\n outline: none;\r\n border-color: var(--color-primary);\r\n }\r\n\r\n .form-group textarea {\r\n min-height: 120px;\r\n resize: vertical;\r\n }\r\n\r\n .form-group.error input,\r\n .form-group.error textarea {\r\n border-color: #D32F2F;\r\n }\r\n\r\n .form-error {\r\n font-size: 13px;\r\n color: #D32F2F;\r\n margin-top: 6px;\r\n display: none;\r\n }\r\n\r\n .form-group.error .form-error {\r\n display: block;\r\n }\r\n\r\n .form-submit {\r\n width: 100%;\r\n margin-top: 8px;\r\n }\r\n\r\n .form-success {\r\n display: none;\r\n text-align: center;\r\n padding: 40px;\r\n }\r\n\r\n .form-success.show {\r\n display: block;\r\n }\r\n\r\n .form-success i {\r\n font-size: 64px;\r\n color: var(--color-primary);\r\n margin-bottom: 16px;\r\n }\r\n\r\n .form-success h4 {\r\n font-size: 24px;\r\n margin-bottom: 8px;\r\n color: var(--color-text-primary);\r\n }\r\n\r\n .form-success p {\r\n color: var(--color-text-muted);\r\n }\r\n\r\n @media (max-width: 900px) {\r\n .contact-grid {\r\n grid-template-columns: 1fr;\r\n gap: 40px;\r\n }\r\n }\r\n\r\n \/* ========================================\r\n Footer\r\n ======================================== *\/\r\n .footer {\r\n background-color: var(--color-bg-dark);\r\n color: var(--color-white);\r\n padding: 64px 0 32px;\r\n }\r\n\r\n .footer-grid {\r\n display: grid;\r\n grid-template-columns: 2fr 1fr 1fr 1fr;\r\n gap: 48px;\r\n margin-bottom: 48px;\r\n }\r\n\r\n .footer-brand p {\r\n color: rgba(255,255,255,0.7);\r\n margin-top: 16px;\r\n font-size: 15px;\r\n line-height: 1.7;\r\n }\r\n\r\n .footer-title {\r\n font-size: 16px;\r\n font-weight: 600;\r\n margin-bottom: 20px;\r\n color: var(--color-white);\r\n }\r\n\r\n .footer-links {\r\n list-style: none;\r\n display: flex;\r\n flex-direction: column;\r\n gap: 12px;\r\n }\r\n\r\n .footer-links a {\r\n color: rgba(255,255,255,0.7);\r\n font-size: 15px;\r\n transition: color var(--transition-fast);\r\n }\r\n\r\n .footer-links a:hover {\r\n color: var(--color-secondary);\r\n }\r\n\r\n .footer-social {\r\n display: flex;\r\n gap: 12px;\r\n margin-top: 20px;\r\n }\r\n\r\n .footer-social a {\r\n width: 40px;\r\n height: 40px;\r\n background-color: rgba(255,255,255,0.1);\r\n border-radius: 8px;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n color: var(--color-white);\r\n font-size: 20px;\r\n transition: all var(--transition-base);\r\n }\r\n\r\n .footer-social a:hover {\r\n background-color: var(--color-secondary);\r\n transform: translateY(-2px);\r\n }\r\n\r\n .footer-bottom {\r\n padding-top: 32px;\r\n border-top: 1px solid rgba(255,255,255,0.1);\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: center;\r\n flex-wrap: wrap;\r\n gap: 16px;\r\n }\r\n\r\n .footer-bottom p {\r\n color: rgba(255,255,255,0.6);\r\n font-size: 14px;\r\n }\r\n\r\n .footer-bottom-links {\r\n display: flex;\r\n gap: 24px;\r\n }\r\n\r\n .footer-bottom-links a {\r\n color: rgba(255,255,255,0.6);\r\n font-size: 14px;\r\n transition: color var(--transition-fast);\r\n }\r\n\r\n .footer-bottom-links a:hover {\r\n color: var(--color-white);\r\n }\r\n\r\n @media (max-width: 900px) {\r\n .footer-grid {\r\n grid-template-columns: repeat(2, 1fr);\r\n }\r\n }\r\n\r\n @media (max-width: 600px) {\r\n .footer-grid {\r\n grid-template-columns: 1fr;\r\n }\r\n\r\n .footer-bottom {\r\n flex-direction: column;\r\n text-align: center;\r\n }\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n <!-- Navigation -->\r\n <nav class=\"nav\" id=\"nav\">\r\n <div class=\"container nav-inner\">\r\n <a href=\"#\" class=\"nav-logo\">\r\n <div class=\"nav-logo-icon\">S<\/div>\r\n <span>SMC Ltd<\/span>\r\n <\/a>\r\n \r\n <ul class=\"nav-links\" id=\"navLinks\">\r\n <li><a href=\"#about\" class=\"nav-link\">About<\/a><\/li>\r\n <li><a href=\"#vision\" class=\"nav-link\">Vision<\/a><\/li>\r\n <li><a href=\"#values\" class=\"nav-link\">Values<\/a><\/li>\r\n <li><a href=\"#project\" class=\"nav-link\">Project<\/a><\/li>\r\n <li><a href=\"#founder\" class=\"nav-link\">Leadership<\/a><\/li>\r\n <li><a href=\"#contact\" class=\"nav-link\">Contact<\/a><\/li>\r\n <li><a href=\"#contact\" class=\"btn btn-primary nav-cta\">Get In Touch<\/a><\/li>\r\n <\/ul>\r\n \r\n <button class=\"nav-toggle\" id=\"navToggle\" aria-label=\"Toggle menu\">\r\n <span><\/span>\r\n <span><\/span>\r\n <span><\/span>\r\n <\/button>\r\n <\/div>\r\n <\/nav>\r\n \r\n <div class=\"nav-overlay\" id=\"navOverlay\"><\/div>\r\n\r\n <!-- Hero Section -->\r\n <section class=\"hero\" id=\"hero\">\r\n <div class=\"container\">\r\n <div class=\"hero-content\">\r\n <div class=\"hero-badge fade-up\">\r\n <i class=\"ph ph-star\"><\/i>\r\n Established 2010 | Rwanda\r\n <\/div>\r\n <h1 class=\"hero-title fade-up stagger-1\">\r\n Building Rwanda's <span>Agricultural Future<\/span>\r\n <\/h1>\r\n <p class=\"hero-subtitle fade-up stagger-2\">\r\n Steel Materials Company (SMC) Ltd is expanding beyond construction materials into agro-processing, establishing a modern maize processing plant to empower farmers and deliver quality products to Rwandan households.\r\n <\/p>\r\n <div class=\"hero-actions fade-up stagger-3\">\r\n <a href=\"#about\" class=\"btn btn-primary\">Explore Our Vision<\/a>\r\n <a href=\"#contact\" class=\"btn btn-secondary\">Contact Us<\/a>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n \r\n <a href=\"#about\" class=\"hero-scroll\">\r\n <i class=\"ph ph-caret-down\"><\/i>\r\n <span>Scroll Down<\/span>\r\n <\/a>\r\n <\/section>\r\n\r\n <!-- About Section -->\r\n <section class=\"section about\" id=\"about\">\r\n <div class=\"container\">\r\n <div class=\"about-grid\">\r\n <div class=\"about-content\">\r\n <span class=\"section-eyebrow fade-up\">About SMC Ltd<\/span>\r\n <h2 class=\"section-title fade-up stagger-1\">From Construction Excellence to Agricultural Innovation<\/h2>\r\n <p class=\"section-subtitle fade-up stagger-2\">\r\n Founded in Kigali in 2010, Steel Materials Company has built a strong reputation in Rwanda's construction materials sector. Today, we're leveraging our expertise and commitment to quality to diversify into agro-processing \u2014 a strategic priority under Rwanda's National Strategy for Transformation (NST1) and Vision 2050.\r\n <\/p>\r\n \r\n <div class=\"about-features\">\r\n <div class=\"about-feature fade-up stagger-3\">\r\n <div class=\"about-feature-icon\">\r\n <i class=\"ph ph-map-pin\"><\/i>\r\n <\/div>\r\n <div class=\"about-feature-text\">\r\n <h4>Headquartered in Kigali<\/h4>\r\n <p>Strategic base for nationwide operations with expansion into Rwamagana District.<\/p>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"about-feature fade-up stagger-4\">\r\n <div class=\"about-feature-icon\">\r\n <i class=\"ph ph-users-three\"><\/i>\r\n <\/div>\r\n <div class=\"about-feature-text\">\r\n <h4>Farmer-Inclusive Approach<\/h4>\r\n <p>Direct partnerships with local maize farmers to ensure quality sourcing and community benefit.<\/p>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"about-feature fade-up stagger-5\">\r\n <div class=\"about-feature-icon\">\r\n <i class=\"ph ph-trend-up\"><\/i>\r\n <\/div>\r\n <div class=\"about-feature-text\">\r\n <h4>Strategic Growth<\/h4>\r\n <p>Diversifying into high-demand maize flour and animal feed production.<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"about-image fade-up\">\r\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1500937386664-56d1dfef3854?auto=format&fit=crop&w=800&q=80\" alt=\"Rwanda agricultural landscape\">\r\n <div class=\"about-image-badge\">\r\n <span>Since<\/span>\r\n 2010\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <!-- Vision & Mission Section -->\r\n <section class=\"section vision-mission\" id=\"vision\">\r\n <div class=\"container\">\r\n <div class=\"text-center\">\r\n <span class=\"section-eyebrow fade-up\">Our Direction<\/span>\r\n <h2 class=\"section-title fade-up stagger-1\">Vision & Mission<\/h2>\r\n <p class=\"section-subtitle fade-up stagger-2\">\r\n Driving Rwanda's agricultural industrialization through quality, sustainability, and farmer empowerment.\r\n <\/p>\r\n <\/div>\r\n \r\n <div class=\"vm-grid\">\r\n <div class=\"vm-card fade-up stagger-3\">\r\n <div class=\"vm-icon\">\r\n <i class=\"ph ph-eye\"><\/i>\r\n <\/div>\r\n <h3>Our Vision<\/h3>\r\n <p>To become a leading producer of high-quality maize flour and animal feed in Rwanda through modern, efficient, and farmer-inclusive value chain systems.<\/p>\r\n <\/div>\r\n \r\n <div class=\"vm-card fade-up stagger-4\">\r\n <div class=\"vm-icon\">\r\n <i class=\"ph ph-target\"><\/i>\r\n <\/div>\r\n <h3>Our Mission<\/h3>\r\n <p>To empower farmers, reduce post-harvest losses, and deliver nutritious, affordable maize products to Rwandan households and livestock owners.<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <!-- Core Values Section -->\r\n <section class=\"section values\" id=\"values\">\r\n <div class=\"container\">\r\n <div class=\"text-center\">\r\n <span class=\"section-eyebrow fade-up\">What Guides Us<\/span>\r\n <h2 class=\"section-title fade-up stagger-1\">Our Core Values<\/h2>\r\n <p class=\"section-subtitle fade-up stagger-2\">\r\n These principles shape every decision we make and every relationship we build.\r\n <\/p>\r\n <\/div>\r\n \r\n <div class=\"values-grid\">\r\n <div class=\"value-card fade-up stagger-2\">\r\n <div class=\"value-icon\">\r\n <i class=\"ph ph-shield-check\"><\/i>\r\n <\/div>\r\n <h3>Quality & Safety<\/h3>\r\n <p>We maintain rigorous standards at every stage, from sourcing to production, ensuring safe and reliable products.<\/p>\r\n <\/div>\r\n \r\n <div class=\"value-card fade-up stagger-3\">\r\n <div class=\"value-icon\">\r\n <i class=\"ph ph-lightbulb\"><\/i>\r\n <\/div>\r\n <h3>Innovation & Efficiency<\/h3>\r\n <p>We embrace modern technology and optimized processes to maximize value for farmers and customers alike.<\/p>\r\n <\/div>\r\n \r\n <div class=\"value-card fade-up stagger-4\">\r\n <div class=\"value-icon\">\r\n <i class=\"ph ph-handshake\"><\/i>\r\n <\/div>\r\n <h3>Farmer Empowerment<\/h3>\r\n <p>We partner directly with local farmers, providing fair prices, training, and stable market access.<\/p>\r\n <\/div>\r\n \r\n <div class=\"value-card fade-up stagger-5\">\r\n <div class=\"value-icon\">\r\n <i class=\"ph ph-leaf\"><\/i>\r\n <\/div>\r\n <h3>Sustainability<\/h3>\r\n <p>We are committed to environmentally responsible operations that protect Rwanda's natural resources.<\/p>\r\n <\/div>\r\n \r\n <div class=\"value-card fade-up stagger-2\">\r\n <div class=\"value-icon\">\r\n <i class=\"ph ph-scales\"><\/i>\r\n <\/div>\r\n <h3>Integrity & Transparency<\/h3>\r\n <p>We conduct business with honesty and openness, building trust with all stakeholders.<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <!-- Project Section -->\r\n <section class=\"section project\" id=\"project\">\r\n <div class=\"container\">\r\n <div class=\"project-grid\">\r\n <div class=\"project-content\">\r\n <span class=\"section-eyebrow fade-up\">New Initiative<\/span>\r\n <h2 class=\"section-title fade-up stagger-1\">Modern Maize Processing Plant<\/h2>\r\n <p class=\"section-subtitle fade-up stagger-2\">\r\n SMC is establishing a state-of-the-art maize processing facility in Rwamagana District. This strategic expansion will transform raw maize into high-quality flour and nutritious animal feed, serving both domestic households and the livestock industry.\r\n <\/p>\r\n \r\n <div class=\"project-features fade-up stagger-3\">\r\n <div class=\"project-feature\">\r\n <i class=\"ph ph-factory\"><\/i>\r\n <h4>Modern Facility<\/h4>\r\n <p>Equipped with latest processing technology<\/p>\r\n <\/div>\r\n <div class=\"project-feature\">\r\n <i class=\"ph ph-wheat\"><\/i>\r\n <h4>Quality Output<\/h4>\r\n <p>Premium maize flour & animal feed<\/p>\r\n <\/div>\r\n <div class=\"project-feature\">\r\n <i class=\"ph ph-user-focus\"><\/i>\r\n <h4>Farmer Partnerships<\/h4>\r\n <p>Direct sourcing from local growers<\/p>\r\n <\/div>\r\n <div class=\"project-feature\">\r\n <i class=\"ph ph-package\"><\/i>\r\n <h4>Job Creation<\/h4>\r\n <p>Employment for local communities<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"project-image fade-up stagger-4\">\r\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1560493676-04071c5f467b?auto=format&fit=crop&w=800&q=80\" alt=\"Maize processing facility\">\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <!-- Stats Section -->\r\n <section class=\"section stats\" id=\"stats\">\r\n <div class=\"container\">\r\n <div class=\"stats-grid\">\r\n <div class=\"stat-item fade-up stagger-1\">\r\n <div class=\"stat-number\" data-target=\"2010\">0<\/div>\r\n <div class=\"stat-label\">Year Established<\/div>\r\n <\/div>\r\n \r\n <div class=\"stat-item fade-up stagger-2\">\r\n <div class=\"stat-number\" data-target=\"14\">0<\/div>\r\n <div class=\"stat-label\">Years in Business<\/div>\r\n <\/div>\r\n \r\n <div class=\"stat-item fade-up stagger-3\">\r\n <div class=\"stat-number\" data-target=\"50\">0<\/div>\r\n <div class=\"stat-label\">Local Farmers Partnered<\/div>\r\n <\/div>\r\n \r\n <div class=\"stat-item fade-up stagger-4\">\r\n <div class=\"stat-number\" data-target=\"2025\">0<\/div>\r\n <div class=\"stat-label\">Plant Launch Target<\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <!-- Founder Section -->\r\n <section class=\"section founder\" id=\"founder\">\r\n <div class=\"container\">\r\n <div class=\"founder-content\">\r\n <span class=\"section-eyebrow fade-up\">Leadership<\/span>\r\n <h2 class=\"section-title fade-up stagger-1\">Message from the Founder<\/h2>\r\n \r\n <div class=\"founder-quote fade-up stagger-2\">\r\n <blockquote>\r\n \"At SMC, we believe in Rwanda's limitless potential. Our expansion into agro-processing is more than a business decision \u2014 it's a commitment to supporting our farmers, reducing dependency on imports, and contributing to a food-secure Rwanda. We are proud to be part of the nation's journey toward industrial transformation under Vision 2050.\"\r\n <\/blockquote>\r\n \r\n <div class=\"founder-info\">\r\n <div class=\"founder-avatar\">AM<\/div>\r\n <div class=\"founder-details\">\r\n <h4>Athanasie Mukeshimana<\/h4>\r\n <span>Founder & Managing Director<\/span>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <!-- Contact Section -->\r\n <section class=\"section contact\" id=\"contact\">\r\n <div class=\"container\">\r\n <div class=\"contact-grid\">\r\n <div class=\"contact-info\">\r\n <span class=\"section-eyebrow fade-up\">Get In Touch<\/span>\r\n <h2 class=\"section-title fade-up stagger-1\">Let's Build Something Together<\/h2>\r\n <p class=\"fade-up stagger-2\">\r\n Whether you're a farmer interested in partnership, a supplier, or an investor exploring opportunities, we'd love to hear from you.\r\n <\/p>\r\n \r\n <div class=\"contact-details\">\r\n <div class=\"contact-item fade-up stagger-3\">\r\n <div class=\"contact-item-icon\">\r\n <i class=\"ph ph-map-pin\"><\/i>\r\n <\/div>\r\n <div>\r\n <h4>Office Location<\/h4>\r\n <p>Kigali, Rwanda<br>Expansion: Rwamagana District<\/p>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"contact-item fade-up stagger-4\">\r\n <div class=\"contact-item-icon\">\r\n <i class=\"ph ph-envelope\"><\/i>\r\n <\/div>\r\n <div>\r\n <h4>Email Us<\/h4>\r\n <p>info@smc Rwanda.com<br>invest@smc Rwanda.com<\/p>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"contact-item fade-up stagger-5\">\r\n <div class=\"contact-item-icon\">\r\n <i class=\"ph ph-clock\"><\/i>\r\n <\/div>\r\n <div>\r\n <h4>Business Hours<\/h4>\r\n <p>Monday - Friday: 8:00 AM - 5:00 PM<br>Saturday: 9:00 AM - 1:00 PM<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"contact-form fade-up stagger-3\" id=\"contactForm\">\r\n <h3>Send Us a Message<\/h3>\r\n \r\n <form id=\"inquiryForm\">\r\n <div class=\"form-group\">\r\n <label for=\"name\">Full Name *<\/label>\r\n <input type=\"text\" id=\"name\" name=\"name\" placeholder=\"Enter your full name\" required>\r\n <span class=\"form-error\">Please enter your name<\/span>\r\n <\/div>\r\n \r\n <div class=\"form-group\">\r\n <label for=\"email\">Email Address *<\/label>\r\n <input type=\"email\" id=\"email\" name=\"email\" placeholder=\"Enter your email\" required>\r\n <span class=\"form-error\">Please enter a valid email address<\/span>\r\n <\/div>\r\n \r\n <div class=\"form-group\">\r\n <label for=\"company\">Company \/ Organization<\/label>\r\n <input type=\"text\" id=\"company\" name=\"company\" placeholder=\"Enter company name (optional)\">\r\n <\/div>\r\n \r\n <div class=\"form-group\">\r\n <label for=\"message\">Message *<\/label>\r\n <textarea id=\"message\" name=\"message\" placeholder=\"Tell us about your inquiry...\" required><\/textarea>\r\n <span class=\"form-error\">Please enter your message<\/span>\r\n <\/div>\r\n \r\n <button type=\"submit\" class=\"btn btn-primary form-submit\">\r\n <i class=\"ph ph-paper-plane-tilt\"><\/i>\r\n Send Message\r\n <\/button>\r\n <\/form>\r\n \r\n <div class=\"form-success\" id=\"formSuccess\">\r\n <i class=\"ph ph-check-circle\"><\/i>\r\n <h4>Message Sent!<\/h4>\r\n <p>Thank you for reaching out. We'll get back to you within 2 business days.<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <!-- Footer -->\r\n <footer class=\"footer\">\r\n <div class=\"container\">\r\n <div class=\"footer-grid\">\r\n <div class=\"footer-brand\">\r\n <a href=\"#\" class=\"nav-logo\" style=\"color: var(--color-white);\">\r\n <div class=\"nav-logo-icon\">S<\/div>\r\n <span>Steel Materials Company<\/span>\r\n <\/a>\r\n <p>A Rwandan company building strength in construction and growth in agro-processing. Committed to quality, sustainability, and farmer empowerment.<\/p>\r\n <\/div>\r\n \r\n <div>\r\n <h4 class=\"footer-title\">Quick Links<\/h4>\r\n <ul class=\"footer-links\">\r\n <li><a href=\"#about\">About Us<\/a><\/li>\r\n <li><a href=\"#vision\">Vision & Mission<\/a><\/li>\r\n <li><a href=\"#values\">Our Values<\/a><\/li>\r\n <li><a href=\"#project\">Maize Project<\/a><\/li>\r\n <\/ul>\r\n <\/div>\r\n \r\n <div>\r\n <h4 class=\"footer-title\">Contact<\/h4>\r\n <ul class=\"footer-links\">\r\n <li><a href=\"#contact\">Get In Touch<\/a><\/li>\r\n <li>info@smc Rwanda.com<\/li>\r\n <li>Kigali, Rwanda<\/li>\r\n <\/ul>\r\n <\/div>\r\n \r\n <div>\r\n <h4 class=\"footer-title\">Follow Us<\/h4>\r\n <div class=\"footer-social\">\r\n <a href=\"#\" aria-label=\"LinkedIn\"><i class=\"ph ph-linkedin-logo\"><\/i><\/a>\r\n <a href=\"#\" aria-label=\"Twitter\"><i class=\"ph ph-twitter-logo\"><\/i><\/a>\r\n <a href=\"#\" aria-label=\"Facebook\"><i class=\"ph ph-facebook-logo\"><\/i><\/a>\r\n <a href=\"#\" aria-label=\"Instagram\"><i class=\"ph ph-instagram-logo\"><\/i><\/a>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"footer-bottom\">\r\n <p>© <span id=\"currentYear\"><\/span> Steel Materials Company (SMC) Ltd. All rights reserved.<\/p>\r\n <div class=\"footer-bottom-links\">\r\n <a href=\"#\">Privacy Policy<\/a>\r\n <a href=\"#\">Terms of Service<\/a>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/footer>\r\n\r\n <script>\r\n \/\/ ========================================\r\n \/\/ Navigation Functionality\r\n \/\/ ========================================\r\n const nav = document.getElementById('nav');\r\n const navToggle = document.getElementById('navToggle');\r\n const navLinks = document.getElementById('navLinks');\r\n const navOverlay = document.getElementById('navOverlay');\r\n const navLinkItems = document.querySelectorAll('.nav-link');\r\n\r\n \/\/ Scroll detection for nav background\r\n function handleNavScroll() {\r\n if (window.scrollY > 50) {\r\n nav.classList.add('scrolled');\r\n } else {\r\n nav.classList.remove('scrolled');\r\n }\r\n }\r\n\r\n window.addEventListener('scroll', handleNavScroll);\r\n handleNavScroll();\r\n\r\n \/\/ Mobile menu toggle\r\n function toggleMobileMenu() {\r\n navToggle.classList.toggle('active');\r\n navLinks.classList.toggle('open');\r\n navOverlay.classList.toggle('open');\r\n document.body.style.overflow = navLinks.classList.contains('open') ? 'hidden' : '';\r\n }\r\n\r\n navToggle.addEventListener('click', toggleMobileMenu);\r\n navOverlay.addEventListener('click', toggleMobileMenu);\r\n\r\n \/\/ Close mobile menu on link click\r\n navLinkItems.forEach(link => {\r\n link.addEventListener('click', () => {\r\n if (navLinks.classList.contains('open')) {\r\n toggleMobileMenu();\r\n }\r\n });\r\n });\r\n\r\n \/\/ Active link highlighting based on scroll\r\n const sections = document.querySelectorAll('section[id]');\r\n\r\n function highlightActiveSection() {\r\n const scrollY = window.scrollY;\r\n \r\n sections.forEach(section => {\r\n const sectionHeight = section.offsetHeight;\r\n const sectionTop = section.offsetTop - 100;\r\n const sectionId = section.getAttribute('id');\r\n \r\n if (scrollY > sectionTop && scrollY <= sectionTop + sectionHeight) {\r\n navLinkItems.forEach(link => {\r\n link.classList.remove('active');\r\n if (link.getAttribute('href') === `#${sectionId}`) {\r\n link.classList.add('active');\r\n }\r\n });\r\n }\r\n });\r\n }\r\n\r\n window.addEventListener('scroll', highlightActiveSection);\r\n\r\n \/\/ ========================================\r\n \/\/ Scroll Animations (Intersection Observer)\r\n \/\/ ========================================\r\n const fadeElements = document.querySelectorAll('.fade-up');\r\n\r\n const fadeObserver = new IntersectionObserver((entries) => {\r\n entries.forEach(entry => {\r\n if (entry.isIntersecting) {\r\n entry.target.classList.add('visible');\r\n fadeObserver.unobserve(entry.target);\r\n }\r\n });\r\n }, {\r\n threshold: 0.1,\r\n rootMargin: '0px 0px -50px 0px'\r\n });\r\n\r\n fadeElements.forEach(el => fadeObserver.observe(el));\r\n\r\n \/\/ ========================================\r\n \/\/ Stats Counter Animation\r\n \/\/ ========================================\r\n const statNumbers = document.querySelectorAll('.stat-number');\r\n let statsAnimated = false;\r\n\r\n function animateCounter(element) {\r\n const target = parseInt(element.dataset.target);\r\n const duration = 2000;\r\n const startTime = performance.now();\r\n \r\n function updateCounter(currentTime) {\r\n const elapsed = currentTime - startTime;\r\n const progress = Math.min(elapsed \/ duration, 1);\r\n \r\n \/\/ Ease out quad\r\n const easeProgress = 1 - (1 - progress) * (1 - progress);\r\n const currentValue = Math.floor(easeProgress * target);\r\n \r\n element.textContent = currentValue;\r\n \r\n if (progress < 1) {\r\n requestAnimationFrame(updateCounter);\r\n } else {\r\n element.textContent = target;\r\n }\r\n }\r\n \r\n requestAnimationFrame(updateCounter);\r\n }\r\n\r\n const statsSection = document.getElementById('stats');\r\n \r\n const statsObserver = new IntersectionObserver((entries) => {\r\n entries.forEach(entry => {\r\n if (entry.isIntersecting && !statsAnimated) {\r\n statsAnimated = true;\r\n statNumbers.forEach(stat => animateCounter(stat));\r\n statsObserver.unobserve(entry.target);\r\n }\r\n });\r\n }, { threshold: 0.3 });\r\n\r\n statsObserver.observe(statsSection);\r\n\r\n \/\/ ========================================\r\n \/\/ Contact Form Handling\r\n \/\/ ========================================\r\n const inquiryForm = document.getElementById('inquiryForm');\r\n const formSuccess = document.getElementById('formSuccess');\r\n\r\n function validateEmail(email) {\r\n const re = \/^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$\/;\r\n return re.test(email);\r\n }\r\n\r\n function showError(input) {\r\n const formGroup = input.closest('.form-group');\r\n formGroup.classList.add('error');\r\n }\r\n\r\n function clearError(input) {\r\n const formGroup = input.closest('.form-group');\r\n formGroup.classList.remove('error');\r\n }\r\n\r\n \/\/ Clear errors on input\r\n inquiryForm.querySelectorAll('input, textarea').forEach(input => {\r\n input.addEventListener('input', () => clearError(input));\r\n });\r\n\r\n inquiryForm.addEventListener('submit', function(e) {\r\n e.preventDefault();\r\n \r\n const name = document.getElementById('name');\r\n const email = document.getElementById('email');\r\n const message = document.getElementById('message');\r\n \r\n let isValid = true;\r\n \r\n \/\/ Validate name\r\n if (!name.value.trim()) {\r\n showError(name);\r\n isValid = false;\r\n }\r\n \r\n \/\/ Validate email\r\n if (!email.value.trim() || !validateEmail(email.value)) {\r\n showError(email);\r\n isValid = false;\r\n }\r\n \r\n \/\/ Validate message\r\n if (!message.value.trim()) {\r\n showError(message);\r\n isValid = false;\r\n }\r\n \r\n if (isValid) {\r\n \/\/ Show success message\r\n inquiryForm.style.display = 'none';\r\n formSuccess.classList.add('show');\r\n \r\n \/\/ Reset form (hidden)\r\n inquiryForm.reset();\r\n \r\n \/\/ Log form data (in real scenario, this would be sent to server)\r\n console.log('Form submitted:', {\r\n name: name.value,\r\n email: email.value,\r\n company: document.getElementById('company').value,\r\n message: message.value\r\n });\r\n }\r\n });\r\n\r\n \/\/ ========================================\r\n \/\/ Footer Year\r\n \/\/ ========================================\r\n document.getElementById('currentYear').textContent = new Date().getFullYear();\r\n\r\n \/\/ ========================================\r\n \/\/ Smooth Scroll for Anchor Links\r\n \/\/ ========================================\r\n document.querySelectorAll('a[href^=\"#\"]').forEach(anchor => {\r\n anchor.addEventListener('click', function(e) {\r\n e.preventDefault();\r\n const target = document.querySelector(this.getAttribute('href'));\r\n if (target) {\r\n const offsetTop = target.offsetTop - 80;\r\n window.scrollTo({\r\n top: offsetTop,\r\n behavior: 'smooth'\r\n });\r\n }\r\n });\r\n });\r\n <\/script>\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Steel Materials Company (SMC) Ltd | Agro-Processing & Construction Materials S SMC Ltd About Vision Values Project Leadership Contact Get In Touch Established 2010 | Rwanda Building Rwanda’s Agricultural Future Steel Materials Company (SMC) Ltd is expanding beyond construction materials into agro-processing, establishing a modern maize processing plant to empower farmers and deliver quality products […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"footnotes":""},"class_list":["post-6","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/stillmaterials.com\/index.php?rest_route=\/wp\/v2\/pages\/6","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/stillmaterials.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/stillmaterials.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/stillmaterials.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/stillmaterials.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=6"}],"version-history":[{"count":10,"href":"https:\/\/stillmaterials.com\/index.php?rest_route=\/wp\/v2\/pages\/6\/revisions"}],"predecessor-version":[{"id":34,"href":"https:\/\/stillmaterials.com\/index.php?rest_route=\/wp\/v2\/pages\/6\/revisions\/34"}],"wp:attachment":[{"href":"https:\/\/stillmaterials.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=6"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}