Member Signup Content

Member Signup Content: 🎣 Noah Fens – Mem...

<style>
  #noah-signup, #noah-signup * { box-sizing: border-box; }
  #noah-signup{
    --ink:#0b122a; --muted:#64748b; --bg:#f6f8fb; --card:#ffffff; --border:#e6eaf4;
    --accent:#6d28d9; --accent-2:#22c55e; --ring:rgba(109,40,217,.2);
    --radius:18px; --gap:18px;
    font-family: Roboto, ui-sans-serif, system-ui, -apple-system, Segoe UI, Arial, "Noto Sans", "Apple Color Emoji","Segoe UI Emoji";
    color:var(--ink); background:var(--bg); padding:clamp(16px,3vw,28px); border-radius:var(--radius);
  }
  #noah-signup .card{ background:var(--card); border:1px solid var(--border); border-radius:var(--radius);
    padding:clamp(16px,2.5vw,28px); box-shadow:0 10px 30px rgba(11,18,42,.07); }
  #noah-signup .hero{ display:grid; gap:8px; margin-bottom:var(--gap);
    background:linear-gradient(135deg, rgba(109,40,217,.10), rgba(34,197,94,.10));
    border:1px solid var(--border); border-radius:var(--radius); padding:clamp(16px,2.5vw,26px);
    position:relative; overflow:hidden; }
  #noah-signup .hero::after{ content:"🐟"; position:absolute; right:14px; bottom:8px;
    font-size:clamp(44px,7vw,72px); opacity:.2; }
  #noah-signup .hero h1{ margin:0; font-size:clamp(22px,3.2vw,32px); line-height:1.15;
    background:linear-gradient(90deg, var(--accent), var(--accent-2));
    -webkit-background-clip:text; background-clip:text; color:transparent; }
  #noah-signup .hero p{ margin:0; color:var(--muted); }
  #noah-signup .grid{ display:grid; gap:var(--gap); grid-template-columns:1fr; }
  @media (min-width:900px){ #noah-signup .grid{ grid-template-columns:1.2fr .8fr; align-items:start; } }
  #noah-signup .btn{ display:inline-flex; align-items:center; gap:.5em; padding:12px 16px; border-radius:999px;
    text-decoration:none; background:var(--accent); color:#fff; font-weight:700; border:1px solid rgba(0,0,0,.06);
    box-shadow:0 6px 16px var(--ring); transition:transform .06s ease; white-space:nowrap; }
  #noah-signup .btn:hover{ transform:translateY(-1px); }
  #noah-signup .btn.secondary{ background:var(--accent-2); }
  #noah-signup .cta-row{ display:flex; flex-wrap:wrap; gap:10px; margin-top:10px; }
  #noah-signup .alt{ border:1px dashed var(--accent-2); border-radius:14px; padding:14px 16px;
    background:linear-gradient(180deg, #fff 0%, #fafcff 100%); }
  #noah-signup .alt h3{ margin:0 0 8px; font-size:18px; line-height:1.2; }
  #noah-signup ul{ list-style:none; padding:0; margin:8px 0 0; display:grid; gap:10px; }
  #noah-signup ul li{ background:#fff; border:1px solid var(--border); border-radius:12px; padding:10px 12px;
    box-shadow:0 6px 18px rgba(11,18,42,.04); display:flex; gap:8px; align-items:flex-start; }
  #noah-signup .perk{ margin-top:var(--gap); background:#fff; border:1px solid var(--border);
    border-radius:14px; padding:14px 16px; }
  #noah-signup .perk h3{ margin:0 0 8px; font-size:18px; }
</style>
<div id="noah-signup" role="region" aria-label="Noah Fens Member Sign-Up">
<div class="card">
<div class="hero" aria-live="polite">
<h1>🎣 Noah Fens &ndash; Member Sign-Up</h1>
<p>Welcome, brave soul. Join the club (we&rsquo;re sorry and impressed).</p>
</div>
<div class="grid">
<section aria-labelledby="joining-info">
<h2 id="joining-info" style="margin: 0 0 10px; font-size: 20px;">Joining</h2>
<p>** You could join with a membership code**</p>
<p><strong>Note:</strong> If you have one already, please first sign-in (if you're not already) using the login/sign-up button to begin. If you're already logged in, a box will display below where you can add your voucher code, check it is valid, and then 'come on in'!!</p>
</section>

<aside class="alt" aria-labelledby="alt-join">
<h3 id="alt-join">Other ways you might be added</h3>
<ul>
<li>🧑&zwj;💻
<div><strong>Admin Trigger:</strong> A group admin can add you directly from the admin panel or menu.</div>
</li>
<li>📦
<div><strong>CSV Upload:</strong> Bulk add via spreadsheet import.</div>
</li>
<li>🪝
<div><strong>Webhook:</strong> Automatic join triggered by an external system event.</div>
</li>
<li>🔗
<div><strong>Customised URL Trigger:</strong> A special link that can add you with just a simple click.</div>
</li>
</ul>
</aside>
</div>
<section class="perk" aria-labelledby="perks">
<h3 id="perks">Perks you absolutely didn&rsquo;t ask for 🏅</h3>
<ul>
<li>🧠 Exclusive Ignorance (match the master himself)</li>
<li>🙋 Official Endorsement (&ldquo;I know Noah Fens.&rdquo; &mdash; people: &ldquo;Who?&rdquo;)</li>
<li>🪑 Priority seating (bring your own chair)</li>
</ul>
</section>
<section class="perk" aria-labelledby="perks">and more!! (but we haven't necessarily made it up yet...)</section>
</div>
</div>

🎣 Noah Fens – Member Sign-Up

Welcome, brave soul. Join the club (we’re sorry and impressed).

Joining

** You could join with a membership code**

Note: If you have one already, please first sign-in (if you're not already) using the login/sign-up button to begin. If you're already logged in, a box will display below where you can add your voucher code, check it is valid, and then 'come on in'!!

Perks you absolutely didn’t ask for 🏅

🧠 Exclusive Ignorance (match the master himself)
🙋 Official Endorsement (“I know Noah Fens.” — people: “Who?”)
🪑 Priority seating (bring your own chair)

and more!! (but we haven't necessarily made it up yet...)

Sign-In / Register

Member Signup Content

🎣 Noah Fens – Member Sign-Up

Joining

Perks you absolutely didn’t ask for 🏅

Please wait ...