<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Learn JavaScript with Efiwe</title>
    <meta name="description" content="Interactive demonstrations of 218 Javascript methods and 432 properties.">
    <meta name="author" content="Learn JavaScript with Efiwe"> 
    <link rel="stylesheet" href="jsstyle.css" />
</head>
<body>
    <header class="header">
        <div class="header-container">
            <div class="header-brand">
                <div class="header-icon">
                    <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
                        <polyline points="16 18 22 12 16 6"></polyline>
                        <polyline points="8 6 2 12 8 18"></polyline>
                    </svg>
                </div>
                <div class="header-title-group">
                    <h1 class="header-title">Learn JavaScript with Efiwe</h1>
                    <p class="header-subtitle">Interactive demonstrations of 218 Javascript methods and 432 properties</p>
                </div>
            </div>
            <div class="header-search">
                <input type="text" id="search" placeholder="Search Challenges...">
            </div>
        </div>
    </header>
    <main class="container">
        <div class="card info-card">
            <div class="info-card-content">
                <svg class="info-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
                    <path d="M22 11.08V12a10 10 0 1 1-5.93-9.14"></path>
                    <polyline points="22 4 12 14.01 9 11.01"></polyline>
                </svg>
                <div class="info-text">
                    <p>After completing each challenge, you'll instantly see the result of your code displayed below — bringing your progress to life, one piece at a time.</p>
                </div>
            </div>
        </div>
        <div id="output"></div>
    </main>
    <script src="jsscript.js"></script>
</body>
</html>