html = r"""<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Learning Samurai — Free Early Learning Tools (Pre-K to 3rd Grade)</title>
  <meta name="description" content="Learning Samurai offers free, no-login, no-ads learning tools for kids Pre-K through 3rd grade. Spelling, sight words, basic math, beginner Spanish, progress tracking, and a parent dashboard. Powered by Data Samurai.">
  <style>
    :root{
      --bg: #0f172a;           /* slate-900 */
      --surface: #111827;      /* gray-900 */
      --muted-surface:#0b1225;
      --text: #e5e7eb;         /* gray-200 */
      --muted:#cbd5e1;         /* slate-300 */
      --brand:#06b6d4;         /* cyan-500 */
      --accent:#f59e0b;        /* amber-500 */
      --success:#10b981;       /* emerald-500 */
      --danger:#ef4444;        /* red-500 */
      --card:#0b1220;
      --border: #1f2937;       /* gray-800 */
      --shadow: 0 10px 30px rgba(0,0,0,.35);
      --radius: 14px;
    }
    *{box-sizing:border-box}
    html,body{margin:0;padding:0;background:linear-gradient(180deg,var(--bg),#030712);color:var(--text);font-family: system-ui,-apple-system,Segoe UI,Roboto,Inter,Arial,sans-serif;line-height:1.5}
    a{color:var(--brand);text-decoration:none}
    a:hover{text-decoration:underline}
    .container{max-width:1200px;margin:0 auto;padding:0 20px}
    header{position:sticky;top:0;z-index:50;background:rgba(3,7,18,.7);backdrop-filter: blur(8px);border-bottom:1px solid var(--border)}
    .nav{display:flex;align-items:center;justify-content:space-between;padding:14px 0}
    .logo{display:flex;align-items:center;gap:12px;font-weight:800;letter-spacing:.3px}
    .logo-icon{width:36px;height:36px;border-radius:8px;background: radial-gradient(100% 100% at 20% 20%, var(--brand),#0891b2 45%, #155e75 100%);display:grid;place-items:center;box-shadow:var(--shadow)}
    .logo-icon svg{width:22px;height:22px;fill:#001015}
    nav ul{display:flex;gap:22px;list-style:none;margin:0;padding:0}
    nav a{color:var(--text);opacity:.9}
    .btn{display:inline-flex;align-items:center;gap:10px;border:none;border-radius:999px;padding:12px 18px;font-weight:600;background:var(--brand);color:#00222a;cursor:pointer;box-shadow:var(--shadow)}
    .btn:hover{filter:brightness(1.05)}
    .btn.alt{background:transparent;border:1px solid var(--border);color:var(--text)}
    .hero{display:grid;grid-template-columns: 1.1fr .9fr;gap:40px;padding:56px 0 20px}
    .hero-card{background: radial-gradient(160% 120% at 10% 0%, #0a1a2f 0%, var(--card) 40%, #091021 100%);border:1px solid var(--border);border-radius:var(--radius);padding:28px;box-shadow:var(--shadow)}
    h1{font-size:clamp(28px,3.4vw,54px);line-height:1.1;margin:.2em 0 .35em}
    .eyebrow{display:inline-flex;align-items:center;gap:8px;background:rgba(6,182,212,.14);color:#88f4ff;padding:8px 12px;border:1px solid rgba(6,182,212,.3);border-radius:999px;font-size:14px}
    .points{display:grid;gap:10px;margin:20px 0}
    .point{display:flex;gap:12px;align-items:flex-start}
    .point .dot{width:10px;height:10px;border-radius:50%;background:var(--success);margin-top:8px;box-shadow:0 0 0 4px rgba(16,185,129,.15)}
    .hero-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:18px}
    .panel{background:linear-gradient(180deg,#0c1326,#0a0f1f);border:1px solid var(--border);border-radius:var(--radius);padding:18px}
    .badge-row{display:flex;gap:14px;flex-wrap:wrap}
    .badge{font-size:13px;padding:8px 12px;border:1px solid var(--border);border-radius:999px;background:rgba(255,255,255,.02)}
    .grid-3{display:grid;grid-template-columns: repeat(3,1fr);gap:18px}
    .card{background:linear-gradient(180deg,#0b1223,#09101f);border:1px solid var(--border);border-radius:var(--radius);padding:18px;box-shadow:var(--shadow)}
    .card h3{margin-top:4px;margin-bottom:8px}
    .card p{margin:.2em 0 .6em}
    .pill{display:inline-block;padding:6px 10px;border-radius:999px;background:rgba(245,158,11,.16);border:1px solid rgba(245,158,11,.35);color:#ffd699;font-size:12px;font-weight:700;letter-spacing:.2px}
    .apps{margin-top:8px;display:grid;gap:12px}
    .app{display:flex;justify-content:space-between;align-items:center;border:1px dashed var(--border);padding:12px;border-radius:12px;background:rgba(255,255,255,.02)}
    .app span{font-weight:600}
    .kpis{display:grid;grid-template-columns: repeat(4,1fr);gap:12px}
    .kpi{background:rgba(255,255,255,.03);border:1px solid var(--border);border-radius:12px;padding:14px;text-align:center}
    .kpi strong{display:block;font-size:24px}
    .section{padding:56px 0;border-top:1px solid var(--border)}
    .section h2{font-size:clamp(22px,2.6vw,34px);margin:.2em 0 .4em}
    .twocol{display:grid;grid-template-columns:1fr 1fr;gap:18px}
    .list{display:grid;gap:10px}
    .list li{margin-left:1rem}
    .accordion{border:1px solid var(--border);border-radius:12px;overflow:hidden}
    details{border-top:1px solid var(--border);background:#0a0f1f}
    details:first-of-type{border-top:none}
    summary{cursor:pointer;padding:16px 18px;font-weight:600;list-style:none}
    summary::-webkit-details-marker{display:none}
    .faq-body{padding:0 18px 18px;color:var(--muted)}
    form{display:grid;gap:12px}
    input, textarea, select{width:100%;padding:12px;border-radius:10px;border:1px solid var(--border);background:#0b1223;color:var(--text)}
    .muted{color:var(--muted)}
    .note{font-size:14px;color:var(--muted)}
    footer{padding:40px 0;border-top:1px solid var(--border);background:#05080f;color:var(--muted)}
    .cols{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:18px}
    .copyright{margin-top:18px;font-size:13px}
    .sponsor-cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:10px}
    .callout{background:linear-gradient(180deg,#0c231b,#0a1712);border:1px solid #123c30;padding:18px;border-radius:12px}
    .donation{background:linear-gradient(180deg,#231d0c,#17140a);border:1px solid #3c3212}
    .inline-tip{font-size:13px;background:rgba(6,182,212,.12);border:1px solid rgba(6,182,212,.35);padding:6px 10px;border-radius:999px}
    .mono{font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono","Courier New", monospace}
    @media (max-width: 960px){
      .hero{grid-template-columns:1fr}
      .grid-3{grid-template-columns: 1fr}
      .twocol{grid-template-columns: 1fr}
      .kpis{grid-template-columns:1fr 1fr}
      .cols{grid-template-columns:1fr 1fr}
      nav ul{display:none}
    }
    /* Simple accordion icon */
    summary::after{content:"+";float:right;color:var(--muted)}
    details[open] summary::after{content:"–"}
  </style>
</head>
<body>
<header>
  <div class="container nav">
    <div class="logo">
      <div class="logo-icon" aria-hidden="true">
        <svg viewBox="0 0 24 24" role="img" aria-label="Samurai helmet">
          <path d="M12 2c2 0 5 3 5 5v2l3 3-3 8H7L4 12l3-3V7c0-2 3-5 5-5Zm-3 7h6v2H9V9Zm-2 4h10l2 6H5l2-6Z"/>
        </svg>
      </div>
      <span>Learning Samurai</span>
      <span class="inline-tip">Powered by Data Samurai</span>
    </div>
    <nav aria-label="Primary">
      <ul>
        <li><a href="#apps">Apps</a></li>
        <li><a href="#how">How it works</a></li>
        <li><a href="#parents">Parents</a></li>
        <li><a href="#sponsors">Sponsors</a></li>
        <li><a href="#faq">FAQ</a></li>
        <li><a href="#feedback">Feedback</a></li>
      </ul>
    </nav>
    <div>
      <a class="btn alt" href="#demo">Try a demo</a>
      <button class="btn" onclick="document.getElementById('donate').scrollIntoView({behavior:'smooth'})">Donate</button>
    </div>
  </div>
</header>

<main>
  <section class="container hero" id="home">
    <div class="hero-card">
      <span class="eyebrow">Free, no-ads, no-login learning tools (Pre-K → 3rd grade)</span>
      <h1>Small, focused practice that fits real life.</h1>
      <p class="muted">Built for busy families and classrooms: quick, distraction-free activities for spelling, sight words, basic math, and beginner Spanish — accessible on any device, even in a grocery line.</p>

      <div class="points">
        <div class="point"><div class="dot"></div><div><strong>No downloads, no accounts, no ads.</strong> Kids stay on a single page.</div></div>
        <div class="point"><div class="dot"></div><div><strong>Smart hints & read-aloud.</strong> Letter counts, next-letter prompts, and word audio help kids progress.</div></div>
        <div class="point"><div class="dot"></div><div><strong>Progress visibility.</strong> See growth by session and over time; optional parent dashboard.</div></div>
      </div>

      <div class="hero-cta">
        <a class="btn" id="demo" href="#apps">Start practicing</a>
        <a class="btn alt" href="#parents">For parents</a>
        <a class="btn alt" href="#sponsors">For sponsors</a>
      </div>

      <div class="panel" style="margin-top:14px">
        <div class="badge-row">
          <span class="badge">Spelling & Sight Words</span>
          <span class="badge">Basic Math</span>
          <span class="badge">Beginner Spanish</span>
          <span class="badge">Progress Tracking</span>
          <span class="badge">Parent Dashboard</span>
          <span class="badge">Feedback Loop</span>
        </div>
      </div>
    </div>

    <div class="hero-card">
      <div class="kpis" aria-label="Why families choose us">
        <div class="kpi"><strong>0</strong><span>Ads & popups</span></div>
        <div class="kpi"><strong>1</strong><span>Page focus mode</span></div>
        <div class="kpi"><strong>5–10</strong><span>Minute sessions</span></div>
        <div class="kpi"><strong>100%</strong><span>Free to families</span></div>
      </div>
      <div style="margin-top:16px" class="callout donation">
        <span class="pill">Funded by donors & sponsors</span>
        <p class="muted">Like Wikipedia, we stay free through small donations and mission-aligned sponsors — not ads. Your support keeps learning distraction-free.</p>
        <div class="sponsor-cta">
          <button class="btn" onclick="document.getElementById('donate').scrollIntoView({behavior:'smooth'})">Donate</button>
          <a class="btn alt" href="#sponsors">Sponsor the mission</a>
        </div>
      </div>
    </div>
  </section>

  <section class="container section" id="apps">
    <h2>Try our early learning apps</h2>
    <p class="muted">Each app does one job well. Quick to start, easy to stick with, and friendly on any device.</p>
    <div class="grid-3 apps">
      <div class="card">
        <span class="pill">Live demo</span>
        <h3>Spelling Samurai</h3>
        <p>Reads words aloud, captures letter-by-letter input, and offers optional hints (letter count, next-letter reveal). Sight-word mode included.</p>
        <div class="app"><span>Start Spelling</span><a class="btn" href="#" aria-disabled="true">Open</a></div>
      </div>
      <div class="card">
        <span class="pill">In beta</span>
        <h3>Math Minis</h3>
        <p>Short practice for counting, addition, subtraction, and number sense — sized for 5–10 minute sessions.</p>
        <div class="app"><span>Try Math</span><a class="btn alt" href="#" aria-disabled="true">Preview</a></div>
      </div>
      <div class="card">
        <span class="pill">In beta</span>
        <h3>Spanish Sprouts</h3>
        <p>Beginner vocabulary with audio prompts. Practice numbers, colors, animals, and everyday words.</p>
        <div class="app"><span>Try Spanish</span><a class="btn alt" href="#" aria-disabled="true">Preview</a></div>
      </div>
    </div>
  </section>

  <section class="container section" id="how">
    <h2>How Learning Samurai works</h2>
    <div class="twocol">
      <div class="card">
        <h3>Simple sessions that fit real life</h3>
        <ul class="list">
          <li>Designed for “micro-moments”: in the car, waiting rooms, grocery lines.</li>
          <li>One-page focus keeps kids in the activity — no tabs or app-store traps.</li>
          <li>5–10 minute practice blocks with clear start/finish and gentle streaks.</li>
        </ul>
        <p class="note">Tip for iOS: use <span class="mono">Guided Access</span> to lock to a single page; Chromebooks/Android offer similar “screen pinning.”</p>
      </div>
      <div class="card">
        <h3>Progress you can see</h3>
        <ul class="list">
          <li><strong>Session view:</strong> accuracy, attempts, and time-on-task for that sitting.</li>
          <li><strong>Long-term view:</strong> trendlines, mastered skills, and gentle recommendations.</li>
          <li><strong>Parent dashboard (optional):</strong> privacy-first insights; share with a teacher if you choose.</li>
        </ul>
      </div>
    </div>
  </section>

  <section class="container section" id="parents">
    <h2>Built for busy parents (and caring mentors)</h2>
    <div class="twocol">
      <div class="card">
        <h3>What we automate</h3>
        <ul class="list">
          <li>Reading words/sentences aloud</li>
          <li>Collecting letter-by-letter input</li>
          <li>Providing structured hints and instant checks</li>
        </ul>
        <h3>What stays human</h3>
        <ul class="list">
          <li>Discussing word meanings & usage in sentences</li>
          <li>Celebrating wins and talking through mistakes</li>
          <li>Choosing the right pace and goals for your child</li>
        </ul>
      </div>
      <div class="card">
        <h3>Why it’s free (and calm)</h3>
        <ul class="list">
          <li>No ads, no tracking for resale, no addictive noise makers.</li>
          <li>Funded by grants, foundations, corporate sponsors, and optional parent donations.</li>
          <li>Privacy-first: we store only what’s needed to show progress — and you control sharing.</li>
        </ul>
        <div class="callout" id="donate">
          <h4 style="margin:0 0 6px">Support Learning Samurai</h4>
          <p class="muted">Your donation keeps access free for every family. Give once, or monthly — every bit helps.</p>
          <div class="sponsor-cta">
            <button class="btn">Donate now</button>
            <a class="btn alt" href="#sponsors">See sponsor options</a>
          </div>
          <p class="note">We follow a Wikipedia-style donation approach: appreciated but never required.</p>
        </div>
      </div>
    </div>
  </section>

  <section class="container section" id="sponsors">
    <h2>For Foundations & Corporate Sponsors</h2>
    <div class="twocol">
      <div class="card">
        <h3>Why sponsor Learning Samurai?</h3>
        <ul class="list">
          <li>High-impact access: free tools for Pre-K–3rd families across our region.</li>
          <li>Clear outcomes: usage, progress trends, and skill mastery (privacy-safe).</li>
          <li>Community alignment: complements teachers and parents; doesn’t replace them.</li>
        </ul>
        <div class="sponsor-cta">
          <button class="btn">Request a sponsor kit</button>
          <a class="btn alt" href="#feedback">Contact us</a>
        </div>
      </div>
      <div class="card">
        <h3>Sponsorship options</h3>
        <ul class="list">
          <li>Program underwriting (keep the platform ad-free)</li>
          <li>App-specific pilots (e.g., expand Spanish or Math units)</li>
          <li>Regional access drives (fund outreach across parishes)</li>
          <li>Research partnerships & independent evaluation</li>
        </ul>
        <p class="note">We can include tasteful “Supported by” recognition without interrupting the child’s experience.</p>
      </div>
    </div>
  </section>

  <section class="container section" id="feedback">
    <h2>Feedback makes us better</h2>
    <p class="muted">Tell us what your child loves, what needs fixing, and what subjects you’d like next. Choose a category and leave details — we read every note.</p>
    <div class="twocol">
      <form class="card" aria-label="Feedback form">
        <label>Category
          <select required>
            <option value="">Choose…</option>
            <option>User experience (Do kids enjoy it?)</option>
            <option>Bugs / Issues</option>
            <option>New subjects / Features</option>
            <option>Accessibility</option>
            <option>General</option>
          </select>
        </label>
        <label>Your email (optional)
          <input type="email" placeholder="you@example.com" aria-describedby="privacy-hint">
        </label>
        <label>Feedback
          <textarea rows="5" placeholder="Tell us what’s working, what’s not, or what to add next…" required></textarea>
        </label>
        <button class="btn" type="submit" aria-disabled="true">Send feedback</button>
        <span class="note" id="privacy-hint">We use your email only to follow up on your feedback. We’ll never sell your data.</span>
      </form>

      <div class="card">
        <h3>Roadmap (next up)</h3>
        <ul class="list">
          <li>Teacher view: share progress with a class code (no student emails needed)</li>
          <li>Spanish audio refinements; new vocab packs</li>
          <li>Math facts “sprints” with calming pacing</li>
          <li>Offline-friendly mode for spotty connections</li>
        </ul>
        <div class="callout" style="margin-top:10px">
          <strong>Educators:</strong> want to co-design a pilot? <a href="#feedback">Reach out</a> — we love design partners.
        </div>
      </div>
    </div>
  </section>

  <section class="container section" id="faq">
    <h2>FAQ</h2>
    <div class="accordion">
      <details>
        <summary>Do I need to download an app or create an account?</summary>
        <div class="faq-body">
          <p>No. Everything runs in the browser. No logins required for kids to practice. Parents can optionally create a dashboard for progress over time.</p>
        </div>
      </details>
      <details>
        <summary>How do you keep kids on one page?</summary>
        <div class="faq-body">
          <p>We design activities to stay within a single page and avoid distracting links. Most devices also offer a “single-app/page lock” (e.g., iOS Guided Access, Android screen pinning, Chromebook kiosk mode) that parents can enable.</p>
        </div>
      </details>
      <details>
        <summary>What data do you collect?</summary>
        <div class="faq-body">
          <p>Just enough to show learning progress (correct/incorrect attempts, time on task). We don’t sell data. Parent dashboards and teacher shares are opt-in and revocable.</p>
        </div>
      </details>
      <details>
        <summary>Why don’t you show definitions in the Spelling app?</summary>
        <div class="faq-body">
          <p>We intentionally leave definitions and usage to the parent/mentor to spark richer conversation. The app automates lower-value mechanics (reading prompts, checking letters) so you can focus on meaning and context.</p>
        </div>
      </details>
      <details>
        <summary>How are you funded?</summary>
        <div class="faq-body">
          <p>Grants, foundations, corporate sponsors, and optional parent donations. This keeps the experience calm, ad-free, and accessible to all families.</p>
        </div>
      </details>
    </div>
  </section>
</main>

<footer>
  <div class="container">
    <div class="cols">
      <div>
        <div class="logo" style="margin-bottom:8px">
          <div class="logo-icon" aria-hidden="true">
            <svg viewBox="0 0 24 24" role="img" aria-label="Samurai helmet">
              <path d="M12 2c2 0 5 3 5 5v2l3 3-3 8H7L4 12l3-3V7c0-2 3-5 5-5Zm-3 7h6v2H9V9Zm-2 4h10l2 6H5l2-6Z"/>
            </svg>
          </div>
          <span>Learning Samurai</span>
        </div>
        <p class="muted">Free, focused learning tools for children in Pre-K through 3rd grade — no ads, no logins. Proudly powered by Data Samurai.</p>
      </div>
      <div>
        <h4>Explore</h4>
        <ul class="list">
          <li><a href="#apps">Apps</a></li>
          <li><a href="#how">How it works</a></li>
          <li><a href="#parents">Parents</a></li>
          <li><a href="#sponsors">Sponsors</a></li>
          <li><a href="#faq">FAQ</a></li>
        </ul>
      </div>
      <div>
        <h4>Get involved</h4>
        <ul class="list">
          <li><a href="#feedback">Give feedback</a></li>
          <li><a href="#donate">Donate</a></li>
          <li><a href="#sponsors">Sponsor</a></li>
        </ul>
      </div>
      <div>
        <h4>Privacy</h4>
        <ul class="list">
          <li><a href="#">Privacy policy</a></li>
          <li><a href="#">Terms</a></li>
          <li><a href="#">Accessibility</a></li>
        </ul>
      </div>
    </div>
    <div class="copyright">© <span id="year"></span> Learning Samurai. All rights reserved. <span class="muted">Baton Rouge, LA</span></div>
  </div>
</footer>

<script>
  document.getElementById('year').textContent = new Date().getFullYear();
  // Placeholder handlers; wire to your backend/payment later.
  document.querySelectorAll('form').forEach(f => {
    f.addEventListener('submit', e => {
      e.preventDefault();
      alert('Thanks! Feedback submission wiring will go here.');
    });
  });
</script>
</body>
</html>"""
with open("/mnt/data/learning_samurai_home.html", "w", encoding="utf-8") as f:
    f.write(html)
"/mnt/data/learning_samurai_home.html"