Latest revision as of 05:45, 9 May 2026

500+ articles · Always free

Everything about
gay life.
In one place. Free.

Honest, life-saving articles on health, safety, culture, relationships, nightlife and more — written for the gay community, by the gay community.

Start Reading Browse Topics

Sexual HealthKink & BDSMDating & RelationshipsCommunity & IdentityCulture & HistoryFashion & StyleLife PlanningHarm ReductionHIV PreventionPrEP & STI TestingMental HealthChemsex Sexual HealthKink & BDSMDating & RelationshipsCommunity & IdentityCulture & HistoryFashion & StyleLife PlanningHarm ReductionHIV PreventionPrEP & STI TestingMental HealthChemsex

500+

Articles

2M+

Monthly Readers

80+

Topics

∞

Always Free

Why AlphaX.Wiki

Knowledge that actually matters

🛡️

Life-saving knowledge

From PrEP and STI testing to consent and mental health — information that makes a real difference in real life, written with care and precision by people who understand the community.

📖

Deep, honest articles

No clickbait. No headlines. Real, thorough articles that treat complex topics with the respect they deserve.

🔒

Private by default

No account. No tracking. No judgment. Read what you need — completely privately.

✍️

Community authors

Written by people who live this life. Reviewed for accuracy. Never by outside journalists.

🔍

Fully searchable

Find exactly what you need across all 500+ articles in seconds.

💙

Always free

No paywall. No premium tier. AlphaX.Wiki is free and will always be free.

Knowledge Areas

Explore by category

Eight areas covering every aspect of gay life.

Sexual Health

Dating, Sex & Relationships

Kink & BDSM

Culture, History & Politics

Fashion & Visual Signaling

Community & Identity

Drugs, Party Culture & Harm Reduction

Life Planning

Knowledge that saves lives

Everyone deserves access to honest, life-saving information about their own life.

Explore Articles

Entry Points

Choose your path

🏥

I want to stay healthy

Health, PrEP, STI testing, mental health

💬

I'm navigating relationships

Dating, intimacy, communication, boundaries

🔗

I'm exploring kink

Consent, safety, roles, practices

🏳️‍🌈

I'm finding community

Identity, belonging, visibility

🌙

I'm going out

Nightlife, harm reduction, chemsex

Latest

Recent articles

Community

Entering the Gay Scene for the First Time

What to expect, how to prepare, and where to start.

Health

Understanding PrEP and Modern HIV Prevention

A complete guide to PrEP, how it works, and how to access it.

Identity

Body Image Pressure in Gay Communities

Beauty ideals, self-perception, and navigating expectations.

Kink & BDSM

Understanding Consent in Power Exchange

What consent truly means and how it's practiced.

Relationships

Loneliness, Hookup Culture, and Emotional Well-Being

The tension between sexual freedom and connection.

Health

Navigating Intimacy After Sexual Trauma

Processing, healing, and the path back to connection.

Curated

Editor's selection

Health

Sexual Health in the Gay Community

Kink & BDSM

What Is BDSM?

Identity

Body Diversity and Attraction in Gay Communities

Health

Understanding Routine STI Testing

Nightlife

First Time at a Private Gay Sex Party

Relationships

Recovering Sexual Confidence After Breakups

Readers

What people say

"

The PrEP article literally saved my life. I didn't even know what it was before I found AlphaX.Wiki. Now I'm on it and feel safe.

J

James

Manchester, UK

"

When I came out I had no idea where to start. The articles on identity and community made me feel less alone — and actually helped me find my people.

D

Daniel

Berlin, Germany

"

Finally honest information about chemsex and harm reduction — no judgment, no moralising, just practical knowledge that actually helps.

A

Aviv

Tel Aviv, Israel

Newsletter

Stay informed.

Join 50,000+ readers. Weekly highlights, no spam, always free.

Homepage: Difference between revisions

Latest revision as of 05:45, 9 May 2026

Everything about
gay life.
In one place. Free.

Knowledge that actually matters

Explore by category

Knowledge that saves lives

Choose your path

Recent articles

Editor's selection

What people say

Stay informed.

Navigation menu

@@ Line 2: / Line 2: @@
 <link rel="preconnect" href="https://fonts.googleapis.com">
 <link href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700;800;900&family=Inter:wght@300;400;500;600&display=swap" rel="stylesheet">
-<script src="https://cdn.tailwindcss.com"></script>
 <style>
-    /* ── Alpha Orange Design System ───────────────────── */
+:root{--bg:#080808;--bg2:#0C0C0C;--card:rgba(255,255,255,.03);--cb:rgba(255,255,255,.07);--chov:rgba(255,106,33,.05);--chb:rgba(255,106,33,.35);--or:#FF6A21;--or2:#FF8C42;--tx:#FFFFFF;--tx2:#888888;--tx3:#444444;--grad:linear-gradient(135deg,#FF6A21,#FF8C42);}
-    :root {
+*{margin:0;padding:0;box-sizing:border-box;}
-      --bg:        #0D0D0D;
+html{scroll-behavior:smooth;}
-      --surface:   #1A1A1A;
+body{background:var(--bg);color:var(--tx);font-family:'Inter',sans-serif;line-height:1.6;overflow-x:hidden;}
-      --border:    #2E2E2E;
+h1,h2,h3,h4{font-family:'Space Grotesk',sans-serif;}
-      --orange:    #FF6A21;
+#prog{position:fixed;top:0;left:0;right:0;height:2px;background:var(--grad);z-index:9999;transform-origin:left;transform:scaleX(0);transition:transform .1s;}
-      --orange2:   #FF8C42;
+.nav{position:fixed;top:0;left:0;right:0;z-index:100;display:flex;align-items:center;justify-content:space-between;padding:0 2.5rem;height:60px;background:rgba(8,8,8,.85);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid rgba(255,255,255,.05);}
-      --text:      #FFFFFF;
+.nl{color:var(--tx2);text-decoration:none;font-size:.875rem;font-weight:500;transition:color .15s;}
-      --text-2:    #999999;
+.nl:hover{color:var(--tx);}
-      --text-3:    #666666;
+.nav-right{display:flex;align-items:center;gap:.75rem;}
-      --text-4:    #888888;
+.btn-p{background:var(--grad);color:#fff;padding:.5rem 1.25rem;border-radius:8px;font-size:.875rem;font-weight:700;text-decoration:none;transition:opacity .15s,transform .15s;}
-      --glow-sm:   0 0 20px rgba(255,106,33,.15);
+.btn-p:hover{opacity:.9;transform:translateY(-1px);}
-      --glow-md:   0 0 20px rgba(255,106,33,.40);
+.lsw{display:flex;gap:2px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.06);border-radius:8px;padding:3px;}
-      --glow-lg:   0 0 30px rgba(255,106,33,.60);
+.lb{padding:3px 8px;border-radius:5px;font-size:11px;font-weight:700;text-decoration:none;letter-spacing:.05em;transition:all .15s;}
-      --grad:      linear-gradient(135deg, #FF6A21, #FF8C42);
+.lb.on{background:var(--or);color:#fff;}
-    }
+.lb.av{color:#555;}
-    *, *::before, *::after { box-sizing: border-box; margin: 0; }
+.lb.av:hover{color:#aaa;}
-    html { scroll-behavior: smooth; }
+.lb.dim{color:#222;cursor:default;}
-    body {
+.tbtn{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.07);border-radius:8px;padding:5px 9px;cursor:pointer;font-size:14px;line-height:1;transition:background .15s;color:var(--tx2);}
-      background: var(--bg);
+.tbtn:hover{background:rgba(255,255,255,.09);}
-      font-family: 'Inter', sans-serif;
+.hero{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:120px 1rem 80px;position:relative;overflow:hidden;}
-      color: var(--text);
+.h-bg{position:absolute;inset:0;background:radial-gradient(ellipse 80% 60% at 20% 50%,rgba(255,106,33,.08) 0%,transparent 60%),radial-gradient(ellipse 60% 80% at 80% 20%,rgba(255,140,66,.06) 0%,transparent 60%),radial-gradient(ellipse 40% 40% at 50% 80%,rgba(255,80,0,.07) 0%,transparent 60%);pointer-events:none;}
-      overflow-x: hidden;
+.h-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);background-size:64px 64px;mask-image:radial-gradient(ellipse 80% 80% at 50% 50%,black 20%,transparent 100%);-webkit-mask-image:radial-gradient(ellipse 80% 80% at 50% 50%,black 20%,transparent 100%);pointer-events:none;}
-      -webkit-font-smoothing: antialiased;
+.h-badge{display:inline-flex;align-items:center;gap:.5rem;background:rgba(255,106,33,.1);border:1px solid rgba(255,106,33,.25);border-radius:100px;padding:.35rem 1rem;margin-bottom:2rem;font-size:.78rem;font-weight:600;color:var(--or);letter-spacing:.03em;}
-    }
+.h-dot{width:6px;height:6px;border-radius:50%;background:var(--or);animation:pulse 2s infinite;}
-    h1,h2,h3,h4,h5 { font-family: 'Space Grotesk', sans-serif; }
+@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(.8)}}
+.h-title{font-size:clamp(3rem,7.5vw,6rem);font-weight:900;line-height:.98;letter-spacing:-.04em;margin-bottom:1.5rem;}
-    /* ── Scrollbar ─────────────────────────────────── */
+.gt{background:var(--grad);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
-    ::-webkit-scrollbar { width: 4px; }
+.h-sub{font-size:clamp(1rem,2vw,1.15rem);color:var(--tx2);line-height:1.75;max-width:520px;margin:0 auto 2.5rem;}
-    ::-webkit-scrollbar-track { background: transparent; }
+.h-ctas{display:flex;gap:.75rem;justify-content:center;flex-wrap:wrap;}
-    ::-webkit-scrollbar-thumb { background: rgba(255,255,255,.05); border-radius: 2px; }
+.hcp{background:var(--grad);color:#fff;padding:.85rem 2.25rem;border-radius:12px;font-weight:700;font-size:1rem;text-decoration:none;box-shadow:0 0 40px rgba(255,106,33,.35);transition:transform .2s,box-shadow .2s;}
-    ::-webkit-scrollbar-thumb:hover { background: rgba(255,106,33,.20); }
+.hcp:hover{transform:translateY(-2px);box-shadow:0 0 60px rgba(255,106,33,.5);}
+.hcs{background:rgba(255,255,255,.07);color:#fff;padding:.85rem 2.25rem;border-radius:12px;font-weight:600;font-size:1rem;text-decoration:none;border:1px solid rgba(255,255,255,.1);transition:background .2s;}
-    /* ── Skip / focus ──────────────────────────────── */
+.hcs:hover{background:rgba(255,255,255,.11);}
-    .skip { position:fixed;top:-60px;left:12px;background:var(--orange);color:#fff;padding:8px 18px;border-radius:8px;font-weight:700;font-size:.85rem;z-index:9999;transition:top .2s; }
+.mq-wrap{overflow:hidden;padding:.75rem 0;border-top:1px solid rgba(255,255,255,.05);border-bottom:1px solid rgba(255,255,255,.05);}
-    .skip:focus { top:12px; }
+.mq-track{display:flex;animation:mq 35s linear infinite;}
-    *:focus-visible { outline:2px solid rgba(255,106,33,.7);outline-offset:3px;border-radius:4px; }
+.mq-track:hover{animation-play-state:paused;}
+.mq-item{flex-shrink:0;padding:.4rem 2rem;font-size:.78rem;font-weight:600;color:var(--tx3);letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;}
-    /* ── Progress bar ──────────────────────────────── */
+.mq-dot{flex-shrink:0;width:3px;height:3px;border-radius:50%;background:var(--or);margin:auto;opacity:.35;}
-    #prog { position:fixed;top:0;left:0;height:2px;z-index:9999;background:var(--grad);width:0;pointer-events:none; }
+@keyframes mq{from{transform:translateX(0)}to{transform:translateX(-50%)}}
+.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:rgba(255,255,255,.05);}
-    /* ── Navbar ────────────────────────────────────── */
+.stat{background:var(--bg);padding:2.5rem 2rem;text-align:center;}
-    .nav {
+.stat-n{font-size:2.8rem;font-weight:900;font-family:'Space Grotesk',sans-serif;}
-      position: fixed; top: 16px; left: 50%; transform: translateX(-50%);
+.stat-l{color:var(--tx2);font-size:.875rem;margin-top:.25rem;}
-      z-index: 50;
+.sec{padding:100px 1rem;}
-      background: rgba(13,13,13,.88);
+.sec-in{max-width:1100px;margin:0 auto;}
-      backdrop-filter: blur(24px); -webkit-backdrop-filter: blur(24px);
+.sec-hd{text-align:center;margin-bottom:56px;}
-      border: 1px solid var(--border);
+.stag{font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;color:var(--or);font-weight:700;}
-      border-radius: 999px;
+.stitle{font-size:clamp(2rem,4vw,2.8rem);font-weight:800;letter-spacing:-.03em;margin-top:.4rem;}
-      display: flex; align-items: center;
+.ssub{color:var(--tx2);margin-top:.75rem;font-size:1rem;}
-      padding: 0 6px 0 16px;
+.bento{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.05);border-radius:20px;overflow:hidden;}
-      height: 52px; gap: 6px;
+.bc{background:var(--bg2);padding:2.25rem;transition:background .2s;}
-      width: min(calc(100vw - 32px), 800px);
+.bc:hover{background:rgba(255,106,33,.04);}
-    }
+.bw{grid-column:span 2;}
-    .nav-logo { display:flex;align-items:center;flex-shrink:0;margin-right:4px; }
+.b-ic{font-size:2rem;margin-bottom:1rem;}
-    .nav-links { display:flex;align-items:center;gap:2px;flex:1; }
+.b-ti{font-size:1.05rem;font-weight:700;margin-bottom:.5rem;font-family:'Space Grotesk',sans-serif;}
-    .nav-link {
+.b-de{color:var(--tx2);font-size:.875rem;line-height:1.65;}
-      font-size:.83rem;font-weight:500;color:var(--text-2);
+.tg{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px;}
-      padding:6px 12px;border-radius:999px;text-decoration:none;
+.tc{position:relative;border-radius:16px;overflow:hidden;aspect-ratio:16/9;text-decoration:none;border:1px solid rgba(255,255,255,.06);transition:transform .25s,border-color .25s;}
-      transition:color .2s,background .2s;white-space:nowrap;
+.tc:hover{transform:translateY(-4px);border-color:rgba(255,106,33,.3);}
-    }
+.tc img{width:100%;height:100%;object-fit:cover;transition:transform .4s;}
-    .nav-link:hover { color:var(--text);background:rgba(255,255,255,.05); }
+.tc:hover img{transform:scale(1.05);}
-    .nav-right { display:flex;align-items:center;gap:6px;flex-shrink:0; }
+.to{position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.88) 0%,rgba(0,0,0,.15) 55%,transparent 100%);display:flex;align-items:flex-end;padding:1.25rem;}
-    .nav-admin {
+.tn{font-weight:700;font-size:1rem;color:#fff;font-family:'Space Grotesk',sans-serif;}
-      font-size:.76rem;font-weight:600;color:var(--text-3);
+.art-sc{display:flex;gap:14px;overflow-x:auto;padding-bottom:1rem;scrollbar-width:none;}
-      padding:6px 12px;border-radius:999px;
+.art-sc::-webkit-scrollbar{display:none;}
-      border:1px solid var(--border);
+.ac{flex-shrink:0;width:280px;background:var(--card);border:1px solid var(--cb);border-radius:16px;padding:1.5rem;text-decoration:none;transition:border-color .2s,background .2s,transform .2s;}
-      text-decoration:none;
+.ac:hover{border-color:var(--chb);background:var(--chov);transform:translateY(-2px);}
-      transition:color .2s,border-color .2s;white-space:nowrap;
+.atag{font-size:.65rem;letter-spacing:.1em;text-transform:uppercase;color:var(--or);font-weight:700;margin-bottom:.75rem;}
-      display:inline-flex;align-items:center;gap:5px;
+.ati{font-weight:700;color:var(--tx);font-size:.95rem;line-height:1.4;margin-bottom:.5rem;font-family:'Space Grotesk',sans-serif;}
-    }
+.ade{color:var(--tx2);font-size:.82rem;line-height:1.5;}
-    .nav-admin:hover { color:var(--text-2);border-color:rgba(255,106,33,.4); }
+.edg{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:10px;}
-    .btn-nav {
+.ec{background:var(--card);border:1px solid var(--cb);border-radius:12px;padding:1.25rem;text-decoration:none;transition:border-color .2s,background .2s;display:flex;flex-direction:column;gap:.5rem;}
-      font-size:.83rem;font-weight:700;color:#fff;
+.ec:hover{border-color:var(--chb);background:var(--chov);}
-      background: var(--grad);
+.etag{font-size:.65rem;letter-spacing:.1em;text-transform:uppercase;color:var(--or);font-weight:700;}
-      padding:8px 20px;border-radius:999px;border:none;cursor:pointer;
+.eti{font-weight:700;color:var(--tx);font-size:.95rem;line-height:1.4;font-family:'Space Grotesk',sans-serif;}
-      text-decoration:none;display:inline-flex;align-items:center;
+.pg{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:10px;}
-      transition:opacity .2s,box-shadow .2s;
+.pc{background:var(--card);border:1px solid var(--cb);border-radius:14px;padding:1.5rem;text-decoration:none;display:block;transition:border-color .2s,background .2s,transform .2s;}
-      box-shadow: var(--glow-sm);
+.pc:hover{border-color:var(--chb);background:var(--chov);transform:translateY(-2px);}
-    }
+.pi{font-size:1.5rem;margin-bottom:.75rem;}
-    .btn-nav:hover { opacity:.92;box-shadow:var(--glow-md); }
+.pt{font-weight:700;color:var(--tx);font-size:.9rem;margin-bottom:.3rem;font-family:'Space Grotesk',sans-serif;}
-    @media(max-width:640px){ .nav-links,.nav-admin{display:none;} }
+.ps{color:var(--tx3);font-size:.78rem;line-height:1.4;}
+.ctab{background:linear-gradient(135deg,rgba(255,106,33,.12) 0%,rgba(255,80,0,.05) 100%);border-top:1px solid rgba(255,106,33,.15);border-bottom:1px solid rgba(255,106,33,.15);padding:80px 1rem;text-align:center;}
-    /* ── Orange text gradient ──────────────────────── */
+.tsg{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px;}
-    .ot {
+.tsc{background:var(--card);border:1px solid var(--cb);border-radius:16px;padding:2rem;}
-      background: var(--grad);
+.tsq{font-size:3.5rem;line-height:.8;color:rgba(255,106,33,.2);font-family:'Space Grotesk',sans-serif;font-weight:900;margin-bottom:.5rem;}
-      -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
+.tst{color:var(--tx2);font-size:.95rem;line-height:1.75;margin-bottom:1.5rem;}
-    }
+.tsa{display:flex;align-items:center;gap:.75rem;}
+.tsav{width:40px;height:40px;border-radius:50%;background:var(--grad);display:flex;align-items:center;justify-content:center;font-weight:800;font-size:.9rem;flex-shrink:0;}
-    /* ── Buttons ───────────────────────────────────── */
+.tsn{font-weight:700;font-size:.9rem;}
-    .btn-primary {
+.tsc2{color:var(--tx3);font-size:.8rem;}
-      display:inline-flex;align-items:center;gap:8px;
+.nls{padding:100px 1rem;text-align:center;}
-      font-size:.92rem;font-weight:700;color:#fff;
+.nlf{display:flex;gap:.75rem;max-width:440px;margin:2rem auto 0;}
-      background: var(--grad);
+.nli{flex:1;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:10px;padding:.8rem 1.1rem;color:#fff;font-size:.95rem;outline:none;transition:border-color .2s;}
-      padding:14px 28px;border-radius:12px;border:none;cursor:pointer;
+.nli:focus{border-color:rgba(255,106,33,.4);}
-      text-decoration:none;
+.nlb{background:var(--grad);color:#fff;border:none;padding:.8rem 1.4rem;border-radius:10px;font-weight:700;font-size:.95rem;cursor:pointer;transition:opacity .15s;}
-      transition:transform .2s,box-shadow .2s,opacity .2s;
+.nlb:hover{opacity:.9;}
-      box-shadow: var(--glow-sm);
+.foot{border-top:1px solid rgba(255,255,255,.05);padding:4rem 1rem 2rem;background:var(--bg);}
-    }
+.fg{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:2fr repeat(3,1fr);gap:3rem;margin-bottom:3rem;}
-    .btn-primary:hover { transform:translateY(-1px);box-shadow:var(--glow-md);opacity:.93; }
+.fbp{color:var(--tx2);font-size:.875rem;line-height:1.6;max-width:240px;margin-top:.75rem;}
-    .btn-secondary {
+.fct{font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--tx3);font-weight:700;margin-bottom:1rem;}
-      display:inline-flex;align-items:center;gap:8px;
+.fl{display:flex;flex-direction:column;gap:.6rem;}
-      font-size:.92rem;font-weight:600;color:var(--text-2);
+.fl a{color:var(--tx2);text-decoration:none;font-size:.875rem;transition:color .15s;}
-      background: var(--surface);
+.fl a:hover{color:var(--tx);}
-      border:1px solid var(--border);
+.fb{max-width:1100px;margin:0 auto;border-top:1px solid rgba(255,255,255,.05);padding-top:1.5rem;display:flex;justify-content:space-between;flex-wrap:wrap;gap:1rem;}
-      padding:14px 28px;border-radius:12px;cursor:pointer;
+.fb span{color:var(--tx3);font-size:.8rem;}
-      text-decoration:none;
+.fade-up{opacity:0;transform:translateY(24px);transition:opacity .7s,transform .7s;}
-      transition:border-color .2s,color .2s;
+.fade-up.in{opacity:1;transform:none;}
-    }
+body.light-mode{--bg:#F4F4F2;--bg2:#ECECEA;--card:rgba(0,0,0,.03);--cb:rgba(0,0,0,.08);--chov:rgba(255,106,33,.04);--chb:rgba(255,106,33,.3);--tx:#111;--tx2:#555;--tx3:#999;}
-    .btn-secondary:hover { border-color:rgba(255,106,33,.5);color:var(--text); }
+body.light-mode .nav{background:rgba(244,244,242,.88);}
+body.light-mode .stat{background:var(--bg);}
+body.light-mode .bc{background:var(--bg2);}
+body.light-mode .bento,.light-mode .stats{background:rgba(0,0,0,.07);}
+body.light-mode .h-grid{background-image:linear-gradient(rgba(0,0,0,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(0,0,0,.04) 1px,transparent 1px);}
+body.light-mode .foot{background:var(--bg);}
+@media(max-width:900px){.bento{grid-template-columns:1fr;}.bw{grid-column:span 1;}.stats{grid-template-columns:repeat(2,1fr);}.fg{grid-template-columns:1fr 1fr;}}
+@media(max-width:600px){.nav-links-wrap{display:none;}.fg{grid-template-columns:1fr;}}
-    /* ── Section eyebrow ───────────────────────────── */
+/* AlphaX Banner */
-    .eyebrow {
+.alphax-banner{width:100%;background:linear-gradient(135deg,#0D0D0D 0%,#1a0800 50%,#0D0D0D 100%);border-bottom:1px solid rgba(255,106,33,.2);padding:80px 2rem 80px;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;margin-top:60px;}
-      display:inline-flex;align-items:center;gap:8px;
+.alphax-banner::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 70% 80% at 50% 50%,rgba(255,106,33,.12) 0%,transparent 70%);pointer-events:none;}
-      font-size:.70rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
+.alphax-banner::after{content:'';position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.015) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.015) 1px,transparent 1px);background-size:48px 48px;mask-image:radial-gradient(ellipse 90% 90% at 50% 50%,black 10%,transparent 100%);-webkit-mask-image:radial-gradient(ellipse 90% 90% at 50% 50%,black 10%,transparent 100%);pointer-events:none;}
-      color:var(--orange);
+.ab-inner{position:relative;z-index:1;text-align:center;max-width:900px;}
-    }
+.ab-eyebrow{display:inline-flex;align-items:center;gap:.5rem;background:rgba(255,106,33,.1);border:1px solid rgba(255,106,33,.3);border-radius:100px;padding:.3rem .9rem;font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--or);margin-bottom:1.5rem;}
-    .eyebrow::before { content:'';width:18px;height:1px;background:var(--orange);opacity:.55; }
+.ab-dot{width:6px;height:6px;border-radius:50%;background:var(--or);animation:pulse 2s infinite;}
+.ab-logo{font-family:'Space Grotesk',sans-serif;font-size:clamp(3.5rem,8vw,6.5rem);font-weight:900;letter-spacing:-.05em;line-height:.9;margin-bottom:1rem;}
+.ab-logo-a{background:linear-gradient(135deg,#FF6A21,#FF8C42,#FFB347);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
+.ab-logo-x{color:#fff;}
+.ab-tagline{font-size:clamp(1rem,2.5vw,1.3rem);color:rgba(255,255,255,.55);font-weight:400;letter-spacing:.02em;margin-bottom:2rem;line-height:1.5;}
+.ab-cta{display:inline-flex;align-items:center;gap:.6rem;background:var(--grad);color:#fff;padding:.7rem 1.8rem;border-radius:10px;font-weight:700;font-size:.95rem;text-decoration:none;box-shadow:0 0 30px rgba(255,106,33,.3);transition:transform .2s,box-shadow .2s;}
+.ab-cta:hover{transform:translateY(-2px);box-shadow:0 0 50px rgba(255,106,33,.5);}
+.ab-glow{position:absolute;width:600px;height:600px;border-radius:50%;background:radial-gradient(circle,rgba(255,106,33,.08) 0%,transparent 70%);top:50%;left:50%;transform:translate(-50%,-50%);pointer-events:none;}
-    /* ── Divider ───────────────────────────────────── */
+/* Enhanced modern styles */
-    .div-line { height:1px;background:var(--border); }
+.hero{padding-top:0 !important;}
+.h-badge{animation:float 3s ease-in-out infinite;}
-    /* ── Noise ─────────────────────────────────────── */
+@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
-    .noise { position:absolute;inset:0;pointer-events:none;opacity:.018;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)'/%3E%3C/svg%3E"); }
+.hcp{position:relative;overflow:hidden;}
+.hcp::after{content:'';position:absolute;top:-50%;left:-60%;width:200%;height:200%;background:linear-gradient(120deg,transparent,rgba(255,255,255,.08),transparent);transform:translateX(-100%);transition:transform .6s;}
-    /* ── Glow orbs ─────────────────────────────────── */
+.hcp:hover::after{transform:translateX(60%);}
-    .orb { position:absolute;border-radius:50%;filter:blur(100px);pointer-events:none; }
-    .orb-1 { width:500px;height:500px;background:rgba(255,106,33,.10);top:-160px;left:-80px;animation:drift 20s ease-in-out infinite alternate; }
-    .orb-2 { width:400px;height:400px;background:rgba(255,140,66,.07);top:-80px;right:-60px;animation:drift 16s ease-in-out infinite alternate-reverse; }
-    @keyframes drift { from{transform:translate(0,0)} to{transform:translate(30px,24px)} }
-    @media(prefers-reduced-motion:reduce){ .orb{animation:none!important} }
-    /* ── Grid lines ────────────────────────────────── */
-    .grid-bg {
-      position:absolute;inset:0;pointer-events:none;overflow:hidden;
-      background-image:
-        linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),
-        linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);
-      background-size:72px 72px;
-      mask-image:radial-gradient(ellipse 80% 60% at 50% 0%,black 0%,transparent 80%);
-    }
-    /* ── Feature cards ─────────────────────────────── */
-    .feat-card {
-      background: var(--surface);
-      border: 1px solid var(--border);
-      border-radius: 16px;
-      padding: 28px;
-      display:flex;flex-direction:column;gap:14px;
-      transition: border-color .2s, box-shadow .2s, transform .2s;
-    }
-    .feat-card:hover {
-      border-color: rgba(255,106,33,.30);
-      box-shadow: 0 8px 32px rgba(0,0,0,.4), var(--glow-sm);
-      transform: translateY(-2px);
-    }
-    .feat-icon {
-      width:44px;height:44px;border-radius:10px;
-      display:flex;align-items:center;justify-content:center;flex-shrink:0;
-      background: rgba(255,106,33,.10);
-      border: 1px solid rgba(255,106,33,.20);
-    }
-    .feat-title { font-size:1rem;font-weight:700;color:var(--text);line-height:1.3; }
-    .feat-body { font-size:.855rem;color:var(--text-2);line-height:1.72; }
-    /* ── Mockup ────────────────────────────────────── */
-    .mockup-wrap {
-      background: var(--surface);
-      border: 1px solid var(--border);
-      border-radius: 18px;
-      overflow: hidden;
-      box-shadow: 0 40px 100px rgba(0,0,0,.7), 0 0 0 1px rgba(255,255,255,.04), var(--glow-sm);
-    }
-    .mockup-bar {
-      background: #111111;
-      border-bottom: 1px solid var(--border);
-      padding: 12px 16px;
-      display: flex; align-items: center; gap: 10px;
-    }
-    .dot { width:11px;height:11px;border-radius:50%; }
-    .mockup-url {
-      flex:1;background:rgba(255,255,255,.04);border:1px solid var(--border);border-radius:6px;
-      padding:5px 12px;font-size:.74rem;color:var(--text-3);font-family:monospace;letter-spacing:.02em;
-    }
-    .mockup-body { padding:16px;display:flex;flex-direction:column;gap:8px; }
-    .mock-search {
-      background:rgba(255,255,255,.04);border:1px solid var(--border);
-      border-radius:8px;padding:10px 14px;
-      display:flex;align-items:center;gap:10px;color:var(--text-3);font-size:.82rem;
-      margin-bottom:4px;
-    }
-    .mock-article {
-      background:rgba(255,255,255,.025);
-      border:1px solid var(--border);
-      border-radius:10px;padding:12px 14px;
-      display:flex;align-items:center;gap:12px;
-      transition:background .2s,border-color .2s;cursor:default;
-    }
-    .mock-article:hover { background:rgba(255,106,33,.06);border-color:rgba(255,106,33,.25); }
-    .mock-dot { width:34px;height:34px;border-radius:8px;flex-shrink:0;display:flex;align-items:center;justify-content:center; }
-    .mock-title { font-size:.81rem;font-weight:600;color:rgba(255,255,255,.82);margin-bottom:3px; }
-    .mock-sub { font-size:.73rem;color:var(--text-3); }
-    .mock-badge {
-      margin-left:auto;flex-shrink:0;
-      font-size:.62rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
-      padding:3px 9px;border-radius:999px;
-      background:rgba(255,106,33,.12);border:1px solid rgba(255,106,33,.25);color:var(--orange);
-    }
-    .mock-badge-g {
-      font-size:.62rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
-      padding:3px 9px;border-radius:999px;margin-left:auto;flex-shrink:0;
-      background:rgba(61,220,132,.10);border:1px solid rgba(61,220,132,.22);color:#3DDC84;
-    }
-    /* ── Stats ─────────────────────────────────────── */
-    .stat-strip { display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--border);border-radius:16px;overflow:hidden; }
-    @media(max-width:600px){ .stat-strip{grid-template-columns:repeat(2,1fr);} }
-    .stat-cell { padding:2rem 1.5rem;text-align:center;border-right:1px solid var(--border);transition:background .2s; }
-    .stat-cell:last-child { border-right:none; }
-    .stat-cell:hover { background:rgba(255,106,33,.04); }
-    .stat-n { font-family:'Space Grotesk',sans-serif;font-size:clamp(2rem,3.5vw,3rem);font-weight:900;line-height:1;background:var(--grad);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text; }
-    /* ── Topic tiles ───────────────────────────────── */
-    .topic-grid { display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:10px; }
-    .topic-tile {
-      background:var(--surface);border:1px solid var(--border);border-radius:12px;
-      padding:18px 20px;text-decoration:none;display:flex;flex-direction:column;gap:8px;
-      transition:border-color .2s,background .2s,transform .2s,box-shadow .2s;cursor:pointer;
-    }
-    .topic-tile:hover {
-      background:rgba(255,106,33,.05);border-color:rgba(255,106,33,.30);
-      transform:translateY(-2px);box-shadow:0 8px 24px rgba(0,0,0,.4),var(--glow-sm);
-    }
-    .topic-icon { width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center; }
-    .topic-name { font-size:.88rem;font-weight:600;color:var(--text); }
-    .topic-count { font-size:.75rem;color:var(--text-3); }
-    /* ── Article cards ─────────────────────────────── */
-    .art-card {
-      background:var(--surface);border:1px solid var(--border);border-radius:16px;
-      padding:26px;text-decoration:none;display:flex;flex-direction:column;gap:12px;
-      transition:border-color .2s,box-shadow .2s,transform .2s;cursor:pointer;
-    }
-    .art-card:hover {
-      border-color:rgba(255,106,33,.30);
-      box-shadow:0 12px 40px rgba(0,0,0,.5),var(--glow-sm);
-      transform:translateY(-2px);
-    }
-    .art-title { font-family:'Space Grotesk',sans-serif;font-size:1rem;font-weight:700;color:var(--text);line-height:1.35;transition:color .2s; }
-    .art-card:hover .art-title { color:var(--orange2); }
-    .art-body { font-size:.845rem;color:var(--text-2);line-height:1.70; }
-    .art-cta { display:inline-flex;align-items:center;gap:5px;font-size:.78rem;font-weight:600;color:rgba(255,106,33,.65);margin-top:auto; }
-    .art-card:hover .art-cta { color:var(--orange); }
-    /* ── Tag pills ─────────────────────────────────── */
-    .tag {
-      display:inline-flex;align-items:center;
-      font-size:.66rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;
-      padding:3px 10px;border-radius:999px;
-    }
-    .t-orange { background:rgba(255,106,33,.12);border:1px solid rgba(255,106,33,.25);color:var(--orange); }
-    .t-green  { background:rgba(61,220,132,.10);border:1px solid rgba(61,220,132,.22);color:#3DDC84; }
-    .t-white  { background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);color:rgba(255,255,255,.65); }
-    /* ── Quote cards ───────────────────────────────── */
-    .q-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:14px; }
-    @media(max-width:900px){ .q-grid{grid-template-columns:1fr;} }
-    .q-card {
-      background:var(--surface);border:1px solid var(--border);border-radius:16px;
-      padding:28px;display:flex;flex-direction:column;gap:20px;
-    }
-    .q-text { font-size:.895rem;color:var(--text-2);line-height:1.78;font-style:italic; }
-    /* ── CTA band ──────────────────────────────────── */
-    .cta-band {
-      position:relative;overflow:hidden;
-      background:#111111;
-      border-top:1px solid var(--border);
-      border-bottom:1px solid var(--border);
-    }
-    .cta-band::before {
-      content:'';position:absolute;right:-100px;top:-100px;
-      width:400px;height:400px;border-radius:50%;
-      background:radial-gradient(circle,rgba(255,106,33,.12) 0%,transparent 65%);
-      pointer-events:none;
-    }
-    .cta-band::after {
-      content:'';position:absolute;left:-80px;bottom:-80px;
-      width:300px;height:300px;border-radius:50%;
-      background:radial-gradient(circle,rgba(255,140,66,.08) 0%,transparent 65%);
-      pointer-events:none;
-    }
-    /* ── Marquee ───────────────────────────────────── */
-    .mq-wrap { overflow:hidden; }
-    .mq-track { display:flex;width:max-content;animation:mq 40s linear infinite; }
-    @keyframes mq { from{transform:translateX(0)} to{transform:translateX(-50%)} }
-    @media(prefers-reduced-motion:reduce){ .mq-track{animation:none} }
-    /* ── Newsletter input ──────────────────────────── */
-    .nl-in {
-      background:var(--surface);border:1px solid var(--border);
-      color:var(--text);outline:none;border-radius:10px;
-      padding:13px 18px;font-size:.9rem;width:100%;
-      transition:border-color .2s,box-shadow .2s;font-family:'Inter',sans-serif;
-    }
-    .nl-in:focus { border-color:rgba(255,106,33,.55);box-shadow:0 0 0 3px rgba(255,106,33,.12); }
-    .nl-in::placeholder { color:var(--text-3); }
-    /* ── Fade-up ───────────────────────────────────── */
-    .fu { opacity:0;transform:translateY(22px);transition:opacity .65s ease,transform .65s ease; }
-    .fu.in { opacity:1;transform:none; }
-    .fu[data-d="1"]{transition-delay:.10s}
-    .fu[data-d="2"]{transition-delay:.18s}
-    .fu[data-d="3"]{transition-delay:.26s}
-    .fu[data-d="4"]{transition-delay:.34s}
-    .fu[data-d="5"]{transition-delay:.42s}
-    .fu[data-d="6"]{transition-delay:.50s}
-    @media(prefers-reduced-motion:reduce){ .fu{opacity:1!important;transform:none!important;transition:none!important} }
-    /* ── Path cards (Choose Your Path) ────────────── */
-    .path-card {
-      background: var(--surface);
-      border: 1px solid var(--border);
-      border-radius: 16px;
-      padding: 28px 26px;
-      text-decoration: none;
-      display: flex; flex-direction: column; gap: 10px;
-      transition: border-color .2s, box-shadow .2s, transform .2s;
-      cursor: pointer; position: relative; overflow: hidden;
-    }
-    .path-card::before {
-      content: '';
-      position: absolute; inset: 0;
-      background: linear-gradient(135deg, rgba(255,106,33,.04) 0%, transparent 60%);
-      opacity: 0; transition: opacity .2s;
-    }
-    .path-card:hover { border-color: rgba(255,106,33,.40); box-shadow: 0 8px 32px rgba(0,0,0,.4), var(--glow-sm); transform: translateY(-2px); }
-    .path-card:hover::before { opacity: 1; }
-    .path-card-wide { flex-direction: row; align-items: center; gap: 20px; }
-    .path-card-wide .path-desc { margin-right: auto; }
-    .path-num { font-size: .68rem; font-weight: 800; letter-spacing: .12em; color: var(--text-3); font-family: 'Space Grotesk', sans-serif; }
-    .path-icon-wrap { width: 44px; height: 44px; border-radius: 12px; background: rgba(255,106,33,.08); border: 1px solid rgba(255,106,33,.18); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
-    .path-title { font-family: 'Space Grotesk', sans-serif; font-size: 1.05rem; font-weight: 700; color: var(--text); line-height: 1.3; }
-    .path-desc { font-size: .855rem; color: var(--text-2); line-height: 1.65; }
-    .path-cta { display: inline-flex; align-items: center; gap: 5px; font-size: .78rem; font-weight: 600; color: rgba(255,106,33,.55); margin-top: 4px; transition: color .2s; }
-    .path-card:hover .path-cta { color: var(--orange); }
-    @media(max-width:700px) { .path-card-wide { flex-direction: column; align-items: flex-start; } }
-    /* ── Latest articles card ──────────────────────── */
-    .latest-card {
-      flex-shrink: 0; width: 240px; scroll-snap-align: start;
-      background: var(--surface); border: 1px solid var(--border); border-radius: 14px;
-      padding: 20px; text-decoration: none;
-      display: flex; flex-direction: column; gap: 10px;
-      transition: border-color .2s, transform .2s, box-shadow .2s;
-    }
-    .latest-card:hover { border-color: rgba(255,106,33,.30); transform: translateY(-2px); box-shadow: 0 8px 24px rgba(0,0,0,.4), var(--glow-sm); }
-    .latest-title { font-family: 'Space Grotesk', sans-serif; font-size: .9rem; font-weight: 700; color: var(--text); line-height: 1.35; transition: color .2s; }
-    .latest-card:hover .latest-title { color: var(--orange2); }
-    .latest-date { font-size: .72rem; color: var(--text-3); margin-top: auto; }
-    #latest-deck::-webkit-scrollbar { display: none; }
-    /* ── Knowledge area cards ──────────────────────── */
-    .area-card {
-      background: var(--surface); border: 1px solid var(--border); border-radius: 14px;
-      padding: 22px 20px; text-decoration: none;
-      display: flex; flex-direction: column; gap: 6px;
-      transition: border-color .2s, transform .2s, box-shadow .2s, background .2s;
-      cursor: pointer; position: relative;
-    }
-    .area-card:hover { border-color: rgba(255,106,33,.35); background: rgba(255,106,33,.03); transform: translateY(-2px); box-shadow: 0 8px 28px rgba(0,0,0,.4), var(--glow-sm); }
-    .area-icon { font-size: 1.5rem; line-height: 1; margin-bottom: 4px; }
-    .area-name { font-family: 'Space Grotesk', sans-serif; font-size: .92rem; font-weight: 700; color: var(--text); }
-    .area-desc { font-size: .78rem; color: var(--text-3); line-height: 1.55; }
-    .area-arrow { position: absolute; top: 20px; right: 18px; font-size: 1rem; color: var(--text-3); transition: color .2s, transform .2s; }
-    .area-card:hover .area-arrow { color: var(--orange); transform: translateX(3px); }
-    /* ── Responsive grids ──────────────────────────── */
-    @media(max-width:900px){.g3{grid-template-columns:1fr 1fr!important}}
-    @media(max-width:560px){.g3,.g2{grid-template-columns:1fr!important}}
-    @media(max-width:800px){.gfooter{grid-template-columns:1fr 1fr!important}}
-    @media(max-width:460px){.gfooter{grid-template-columns:1fr!important}}
-  </style>
-<style>@media(max-width:900px){#areas-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:480px){#areas-grid{grid-template-columns:1fr}}</style>
-<style>
-  .ft-link { font-size:.84rem;color:var(--text-3);text-decoration:none;transition:color .2s; }
-  .ft-link:hover { color:var(--orange); }
-  .sr-only { position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0; }
 </style>
+<div id="prog"></div>
-<div id="prog" aria-hidden="true"></div>
+<nav class="nav">
-<a href="#main" class="skip">Skip to content</a>
+   <a href="https://alphax.wiki/wiki/Homepage">
+     <img src="https://alphax.wiki/images/7/7a/Alphax_Wiki_logo_new.png" alt="AlphaX Wiki" style="height:32px;width:auto;">
-<!-- ═══════════════════════════════════════════════════
-     NAVBAR
-═══════════════════════════════════════════════════ -->
-<nav class="nav" role="navigation" aria-label="Main navigation">
-   <a href="https://alphax.wiki" class="nav-logo" aria-label="AlphaX Wiki home">
-     <img src="https://alphax.wiki/images/7/7a/Alphax_Wiki_logo_new.png" alt="AlphaX Wiki" style="height:34px;width:auto;object-fit:contain">
    </a>
-   <div class="nav-links">
+   <div class="nav-links-wrap" style="display:flex;gap:2.5rem;">
-     <a href="#features" class="nav-link">Features</a>
+     <a href="#features" class="nl">Features</a>
-     <a href="#topics"   class="nav-link">Topics</a>
+     <a href="#topics" class="nl">Topics</a>
-     <a href="#articles" class="nav-link">Articles</a>
+     <a href="#articles" class="nl">Articles</a>
-     <a href="#about"    class="nav-link">About</a>
+     <a href="#about" class="nl">About</a>
    </div>
    <div class="nav-right">
-     <a href="https://alphax.wiki/radmin" class="nav-admin" aria-label="Admin login">
+     <div class="lsw">
-       <svg width="12" height="12" fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+      <a href="https://alphax.wiki/wiki/Homepage" class="lb on">EN</a>
-        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5.121 17.804A13.937 13.937 0 0112 16c2.5 0 4.847.655 6.879 1.804M15 10a3 3 0 11-6 0 3 3 0 016 0z"/>
+      <a href="https://alphax.wiki/wiki/Homepage/de" class="lb av">DE</a>
-      </svg>
+       <span class="lb dim">FR</span>
-      Admin
+      <span class="lb dim">ES</span>
-    </a>
+      <span class="lb dim">PT</span>
-     <a href="https://alphax.wiki" class="btn-nav">Explore Free</a>
+    </div>
+    <button class="tbtn" id="tbtn" onclick="toggleTheme()">🌙</button>
+    <a href="https://alphax.wiki/radmin" style="color:var(--tx3);text-decoration:none;font-size:.8rem;">Admin</a>
+     <a href="#topics" class="btn-p">Explore Free</a>
    </div>
 </nav>
-<main id="main">
+<div class="alphax-banner">
+  <div class="ab-glow"></div>
+  <div class="ab-inner">
+    <div class="ab-eyebrow"><span class="ab-dot"></span> Free · Independent · Always Open</div>
+    <div class="ab-logo"><span class="ab-logo-a">Alpha</span><span class="ab-logo-x">X</span></div>
+    <p class="ab-tagline">The free knowledge platform for gay communities worldwide</p>
+    <a href="/wiki/Start_Here" class="ab-cta">Explore AlphaX →</a>
+  </div>
+</div>
-  <!-- ═══════════════════════════════════════════════════
+<section class="hero">
-       HERO
+   <div class="h-bg"></div>
-   ═══════════════════════════════════════════════════ -->
+   <div class="h-grid"></div>
-   <section style="position:relative;padding:180px 1rem 100px;overflow:hidden" aria-label="Hero">
+  <div class="h-badge"><span class="h-dot"></span>500+ articles · Always free</div>
-    <div class="orb orb-1" aria-hidden="true"></div>
+  <h1 class="h-title">Everything about<br>gay life.<br><span class="gt">In one place. Free.</span></h1>
-    <div class="orb orb-2" aria-hidden="true"></div>
+  <p class="h-sub">Honest, life-saving articles on health, safety, culture, relationships, nightlife and more — written for the gay community, by the gay community.</p>
-    <div class="grid-bg" aria-hidden="true"></div>
+  <div class="h-ctas">
-     <div class="noise" aria-hidden="true"></div>
+    <a href="#articles" class="hcp">Start Reading</a>
+     <a href="#topics" class="hcs">Browse Topics</a>
+  </div>
+</section>
-    <div style="max-width:860px;margin:0 auto;text-align:center;position:relative">
+<div class="mq-wrap">
+  <div class="mq-track">
-      <!-- Chip -->
+    <span class="mq-item">Sexual Health</span><span class="mq-dot"></span><span class="mq-item">Kink & BDSM</span><span class="mq-dot"></span><span class="mq-item">Dating & Relationships</span><span class="mq-dot"></span><span class="mq-item">Community & Identity</span><span class="mq-dot"></span><span class="mq-item">Culture & History</span><span class="mq-dot"></span><span class="mq-item">Fashion & Style</span><span class="mq-dot"></span><span class="mq-item">Life Planning</span><span class="mq-dot"></span><span class="mq-item">Harm Reduction</span><span class="mq-dot"></span><span class="mq-item">HIV Prevention</span><span class="mq-dot"></span><span class="mq-item">PrEP & STI Testing</span><span class="mq-dot"></span><span class="mq-item">Mental Health</span><span class="mq-dot"></span><span class="mq-item">Chemsex</span><span class="mq-dot"></span>
-      <a href="https://alphax.wiki/prep-complete-guide"
+    <span class="mq-item">Sexual Health</span><span class="mq-dot"></span><span class="mq-item">Kink & BDSM</span><span class="mq-dot"></span><span class="mq-item">Dating & Relationships</span><span class="mq-dot"></span><span class="mq-item">Community & Identity</span><span class="mq-dot"></span><span class="mq-item">Culture & History</span><span class="mq-dot"></span><span class="mq-item">Fashion & Style</span><span class="mq-dot"></span><span class="mq-item">Life Planning</span><span class="mq-dot"></span><span class="mq-item">Harm Reduction</span><span class="mq-dot"></span><span class="mq-item">HIV Prevention</span><span class="mq-dot"></span><span class="mq-item">PrEP & STI Testing</span><span class="mq-dot"></span><span class="mq-item">Mental Health</span><span class="mq-dot"></span><span class="mq-item">Chemsex</span><span class="mq-dot"></span>
-         style="display:inline-flex;align-items:center;gap:8px;background:rgba(255,106,33,.08);border:1px solid rgba(255,106,33,.22);border-radius:999px;padding:6px 14px 6px 8px;text-decoration:none;margin-bottom:2.5rem;transition:background .2s"
+  </div>
-         onmouseover="this.style.background='rgba(255,106,33,.14)'" onmouseout="this.style.background='rgba(255,106,33,.08)'"
+</div>
-         aria-label="New: Complete PrEP Guide">
-        <span style="background:var(--grad);color:#fff;font-size:.68rem;font-weight:800;letter-spacing:.07em;text-transform:uppercase;padding:3px 10px;border-radius:999px">New</span>
-        <span style="font-size:.82rem;color:var(--text-2)">Complete PrEP Guide just published</span>
-        <svg width="13" height="13" fill="none" stroke="var(--text-3)" viewBox="0 0 24 24" aria-hidden="true"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"/></svg>
-      </a>
-      <!-- H1 -->
+<div class="stats">
-      <h1 style="font-size:clamp(2.8rem,6vw,5.2rem);font-weight:900;line-height:1.06;letter-spacing:-.03em;margin-bottom:1.5rem;color:var(--text)">
+  <div class="stat"><div class="stat-n gt">500+</div><div class="stat-l">Articles</div></div>
-        Everything about gay life.<br>
+  <div class="stat"><div class="stat-n gt">2M+</div><div class="stat-l">Monthly Readers</div></div>
-        <span class="ot">In one place. Free.</span>
+  <div class="stat"><div class="stat-n gt">80+</div><div class="stat-l">Topics</div></div>
-      </h1>
+  <div class="stat"><div class="stat-n gt">∞</div><div class="stat-l">Always Free</div></div>
+</div>
-      <!-- Sub -->
-      <p style="font-size:clamp(1rem,2vw,1.18rem);color:var(--text-2);line-height:1.75;max-width:560px;margin:0 auto 2.8rem">
-+ honest, life-saving articles on health, safety, culture, relationships,
-        nightlife and more — written for the gay community, by the gay community.
-      </p>
-      <!-- CTAs -->
-      <div style="display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-bottom:3.5rem">
-        <a href="https://alphax.wiki" class="btn-primary">
-          Start Reading Free
-          <svg width="16" height="16" fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 8l4 4m0 0l-4 4m4-4H3"/></svg>
-        </a>
-        <a href="#topics" class="btn-secondary">Browse Topics</a>
-      </div>
-      <!-- Trust row -->
-      <div style="display:flex;flex-wrap:wrap;justify-content:center;gap:28px" role="list" aria-label="Trust indicators">
-        <div style="display:flex;align-items:center;gap:7px" role="listitem">
-          <svg width="14" height="14" fill="none" stroke="#3DDC84" viewBox="0 0 24 24" aria-hidden="true"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2.5" d="M5 13l4 4L19 7"/></svg>
-          <span style="font-size:.8rem;color:var(--text-3)">No account required</span>
-        </div>
-        <div style="display:flex;align-items:center;gap:7px" role="listitem">
-          <svg width="14" height="14" fill="none" stroke="#3DDC84" viewBox="0 0 24 24" aria-hidden="true"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2.5" d="M5 13l4 4L19 7"/></svg>
-          <span style="font-size:.8rem;color:var(--text-3)">Always free</span>
-        </div>
-        <div style="display:flex;align-items:center;gap:7px" role="listitem">
-          <svg width="14" height="14" fill="none" stroke="#3DDC84" viewBox="0 0 24 24" aria-hidden="true"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2.5" d="M5 13l4 4L19 7"/></svg>
-          <span style="font-size:.8rem;color:var(--text-3)">No judgment</span>
-        </div>
-        <div style="display:flex;align-items:center;gap:7px" role="listitem">
-          <svg width="14" height="14" fill="none" stroke="#3DDC84" viewBox="0 0 24 24" aria-hidden="true"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2.5" d="M5 13l4 4L19 7"/></svg>
-          <span style="font-size:.8rem;color:var(--text-3)">2M+ monthly readers</span>
-        </div>
-      </div>
-    </div>
-    <!-- Product mockup -->
+<section class="sec" id="features">
-    <div style="max-width:760px;margin:5rem auto 0;position:relative" class="fu">
+  <div class="sec-in">
-      <!-- Orange glow behind mockup -->
+    <div class="sec-hd fade-up">
-      <div style="position:absolute;inset:-30px;background:radial-gradient(ellipse 60% 40% at 50% 100%,rgba(255,106,33,.12) 0%,transparent 70%);pointer-events:none" aria-hidden="true"></div>
+      <div class="stag">Why AlphaX.Wiki</div>
-      <div class="mockup-wrap" style="position:relative">
+      <h2 class="stitle">Knowledge that actually matters</h2>
-        <div class="mockup-bar">
-          <div class="dot" style="background:#FF5F56"></div>
-          <div class="dot" style="background:#FFBD2E"></div>
-          <div class="dot" style="background:#27C93F"></div>
-          <div class="mockup-url">alphax.wiki</div>
-          <svg width="14" height="14" fill="none" stroke="var(--text-3)" viewBox="0 0 24 24" aria-hidden="true"><circle cx="11" cy="11" r="8"/><path d="m21 21-4.35-4.35"/></svg>
-        </div>
-        <div class="mockup-body">
-          <div class="mock-search">
-            <svg width="14" height="14" fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true"><circle cx="11" cy="11" r="8"/><path d="m21 21-4.35-4.35"/></svg>
-            Search: PrEP, coming out, darkroom, chemsex…
-          </div>
-          <div class="mock-article">
-            <div class="mock-dot" style="background:rgba(255,106,33,.10);border:1px solid rgba(255,106,33,.20)">
-              <svg width="15" height="15" fill="none" stroke="var(--orange)" viewBox="0 0 24 24" aria-hidden="true"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z"/></svg>
-            </div>
-            <div><div class="mock-title">The Complete PrEP Guide: Everything You Need to Know</div><div class="mock-sub">12 min · Health &amp; Safety</div></div>
-            <div class="mock-badge-g">Life-Saving</div>
-          </div>
-          <div class="mock-article">
-            <div class="mock-dot" style="background:rgba(255,255,255,.04);border:1px solid var(--border)">
-              <svg width="15" height="15" fill="none" stroke="var(--text-2)" viewBox="0 0 24 24" aria-hidden="true"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.663 17h4.673M12 3v1m6.364 1.636l-.707.707M21 12h-1M4 12H3m3.343-5.657l-.707-.707m2.828 9.9a5 5 0 117.072 0l-.548.547A3.374 3.374 0 0014 18.469V19a2 2 0 11-4 0v-.531c0-.895-.356-1.754-.988-2.386l-.548-.547z"/></svg>
-            </div>
-            <div><div class="mock-title">Darkroom Etiquette: How to Survive (and Thrive)</div><div class="mock-sub">7 min · Nightlife &amp; Culture</div></div>
-            <div class="mock-badge">Culture</div>
-          </div>
-          <div class="mock-article">
-            <div class="mock-dot" style="background:rgba(255,255,255,.04);border:1px solid var(--border)">
-              <svg width="15" height="15" fill="none" stroke="var(--text-2)" viewBox="0 0 24 24" aria-hidden="true"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"/></svg>
-            </div>
-            <div><div class="mock-title">Chemsex: Risks, Support &amp; Getting Help</div><div class="mock-sub">15 min · Harm Reduction</div></div>
-            <div class="mock-badge">Safety</div>
-          </div>
-          <div class="mock-article">
-            <div class="mock-dot" style="background:rgba(255,255,255,.04);border:1px solid var(--border)">
-              <svg width="15" height="15" fill="none" stroke="var(--text-2)" viewBox="0 0 24 24" aria-hidden="true"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343 6.343l-.707-.707m12.728 0l-.707.707M6.343 17.657l-.707.707M16 12a4 4 0 11-8 0 4 4 0 018 0z"/></svg>
-            </div>
-            <div><div class="mock-title">Coming Out to Family: A Practical, Honest Guide</div><div class="mock-sub">10 min · Coming Out</div></div>
-            <div class="mock-badge">Guide</div>
-          </div>
-        </div>
-      </div>
      </div>
-  </section>
+    <div class="bento">
+      <div class="bc bw fade-up"><div class="b-ic">🛡️</div><div class="b-ti">Life-saving knowledge</div><div class="b-de">From PrEP and STI testing to consent and mental health — information that makes a real difference in real life, written with care and precision by people who understand the community.</div></div>
+       <div class="bc fade-up"><div class="b-ic">📖</div><div class="b-ti">Deep, honest articles</div><div class="b-de">No clickbait. No headlines. Real, thorough articles that treat complex topics with the respect they deserve.</div></div>
-  <!-- ═══════════════════════════════════════════════════
+       <div class="bc fade-up"><div class="b-ic">🔒</div><div class="b-ti">Private by default</div><div class="b-de">No account. No tracking. No judgment. Read what you need — completely privately.</div></div>
-       MARQUEE
+       <div class="bc fade-up"><div class="b-ic">✍️</div><div class="b-ti">Community authors</div><div class="b-de">Written by people who live this life. Reviewed for accuracy. Never by outside journalists.</div></div>
-  ═══════════════════════════════════════════════════ -->
+       <div class="bc fade-up"><div class="b-ic">🔍</div><div class="b-ti">Fully searchable</div><div class="b-de">Find exactly what you need across all 500+ articles in seconds.</div></div>
-  <div class="mq-wrap" style="border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:14px 0" aria-hidden="true">
+       <div class="bc fade-up"><div class="b-ic">💙</div><div class="b-ti">Always free</div><div class="b-de">No paywall. No premium tier. AlphaX.Wiki is free and will always be free.</div></div>
-    <div class="mq-track">
-      <span style="margin:0 28px;font-size:.78rem;color:var(--text-3);font-weight:500">Health &amp; Safety</span><span style="color:rgba(255,255,255,.06)">·</span>
-      <span style="margin:0 28px;font-size:.78rem;color:var(--text-3);font-weight:500">PrEP &amp; HIV Prevention</span><span style="color:rgba(255,255,255,.06)">·</span>
-      <span style="margin:0 28px;font-size:.78rem;color:var(--text-3);font-weight:500">Darkroom Culture</span><span style="color:rgba(255,255,255,.06)">·</span>
-       <span style="margin:0 28px;font-size:.78rem;color:var(--text-3);font-weight:500">Coming Out</span><span style="color:rgba(255,255,255,.06)">·</span>
-      <span style="margin:0 28px;font-size:.78rem;color:var(--text-3);font-weight:500">Gay Relationships</span><span style="color:rgba(255,255,255,.06)">·</span>
-      <span style="margin:0 28px;font-size:.78rem;color:var(--text-3);font-weight:500">Mental Wellness</span><span style="color:rgba(255,255,255,.06)">·</span>
-      <span style="margin:0 28px;font-size:.78rem;color:var(--text-3);font-weight:500">Chemsex Safety</span><span style="color:rgba(255,255,255,.06)">·</span>
-      <span style="margin:0 28px;font-size:.78rem;color:var(--text-3);font-weight:500">LGBTQ+ Rights</span><span style="color:rgba(255,255,255,.06)">·</span>
-       <span style="margin:0 28px;font-size:.78rem;color:var(--text-3);font-weight:500">Nightlife &amp; Saunas</span><span style="color:rgba(255,255,255,.06)">·</span>
-      <span style="margin:0 28px;font-size:.78rem;color:var(--text-3);font-weight:500">Identity &amp; Community</span><span style="color:rgba(255,255,255,.06)">·</span>
-      <span style="margin:0 28px;font-size:.78rem;color:var(--text-3);font-weight:500">Dating &amp; Hookups</span><span style="color:rgba(255,255,255,.06)">·</span>
-      <span style="margin:0 28px;font-size:.78rem;color:var(--text-3);font-weight:500">Gay Travel</span><span style="color:rgba(255,255,255,.06)">·</span>
-      <span style="margin:0 28px;font-size:.78rem;color:var(--text-3);font-weight:500">Health &amp; Safety</span><span style="color:rgba(255,255,255,.06)">·</span>
-       <span style="margin:0 28px;font-size:.78rem;color:var(--text-3);font-weight:500">PrEP &amp; HIV Prevention</span><span style="color:rgba(255,255,255,.06)">·</span>
-      <span style="margin:0 28px;font-size:.78rem;color:var(--text-3);font-weight:500">Darkroom Culture</span><span style="color:rgba(255,255,255,.06)">·</span>
-      <span style="margin:0 28px;font-size:.78rem;color:var(--text-3);font-weight:500">Coming Out</span><span style="color:rgba(255,255,255,.06)">·</span>
-      <span style="margin:0 28px;font-size:.78rem;color:var(--text-3);font-weight:500">Gay Relationships</span><span style="color:rgba(255,255,255,.06)">·</span>
-       <span style="margin:0 28px;font-size:.78rem;color:var(--text-3);font-weight:500">Mental Wellness</span><span style="color:rgba(255,255,255,.06)">·</span>
-      <span style="margin:0 28px;font-size:.78rem;color:var(--text-3);font-weight:500">Chemsex Safety</span><span style="color:rgba(255,255,255,.06)">·</span>
-      <span style="margin:0 28px;font-size:.78rem;color:var(--text-3);font-weight:500">LGBTQ+ Rights</span><span style="color:rgba(255,255,255,.06)">·</span>
-       <span style="margin:0 28px;font-size:.78rem;color:var(--text-3);font-weight:500">Nightlife &amp; Saunas</span><span style="color:rgba(255,255,255,.06)">·</span>
-      <span style="margin:0 28px;font-size:.78rem;color:var(--text-3);font-weight:500">Identity &amp; Community</span><span style="color:rgba(255,255,255,.06)">·</span>
-      <span style="margin:0 28px;font-size:.78rem;color:var(--text-3);font-weight:500">Dating &amp; Hookups</span><span style="color:rgba(255,255,255,.06)">·</span>
-      <span style="margin:0 28px;font-size:.78rem;color:var(--text-3);font-weight:500">Gay Travel</span><span style="color:rgba(255,255,255,.06)">·</span>
      </div>
    </div>
+</section>
+<section class="sec" id="topics" style="background:var(--bg2);border-top:1px solid rgba(255,255,255,.04);border-bottom:1px solid rgba(255,255,255,.04);">
-  <!-- ═══════════════════════════════════════════════════
+  <div class="sec-in">
-       STATS
+    <div class="sec-hd fade-up">
-  ═══════════════════════════════════════════════════ -->
+      <div class="stag">Knowledge Areas</div>
-  <section style="padding:80px 1rem" aria-label="Statistics">
+      <h2 class="stitle">Explore by category</h2>
-    <div style="max-width:900px;margin:0 auto">
+      <p class="ssub">Eight areas covering every aspect of gay life.</p>
-      <div class="stat-strip fu" role="list">
-        <div class="stat-cell" role="listitem"><div class="stat-n">500+</div><div style="font-size:.74rem;color:var(--text-3);text-transform:uppercase;letter-spacing:.10em;margin-top:.5rem">Articles</div></div>
-        <div class="stat-cell" role="listitem"><div class="stat-n">2M+</div><div style="font-size:.74rem;color:var(--text-3);text-transform:uppercase;letter-spacing:.10em;margin-top:.5rem">Monthly Readers</div></div>
-        <div class="stat-cell" role="listitem"><div class="stat-n">80+</div><div style="font-size:.74rem;color:var(--text-3);text-transform:uppercase;letter-spacing:.10em;margin-top:.5rem">Topics</div></div>
-        <div class="stat-cell" role="listitem"><div class="stat-n">Free</div><div style="font-size:.74rem;color:var(--text-3);text-transform:uppercase;letter-spacing:.10em;margin-top:.5rem">Always</div></div>
-      </div>
      </div>
-  </section>
+     <div class="tg">
+       <a href="https://alphax.wiki/wiki/Category:Sexual_Health" class="tc"><img src="https://alphax.wiki/images/c/c2/Sexual_health.png" alt="Sexual Health" loading="lazy"><div class="to"><span class="tn">Sexual Health</span></div></a>
+       <a href="https://alphax.wiki/wiki/Category:Dating,_Sex_%26_Relationships" class="tc"><img src="https://alphax.wiki/images/6/6c/Dating_and_relationships.png" alt="Dating, Sex & Relationships" loading="lazy"><div class="to"><span class="tn">Dating, Sex & Relationships</span></div></a>
-  <!-- ═══════════════════════════════════════════════════
+      <a href="https://alphax.wiki/wiki/Category:Kink_%26_BDSM" class="tc"><img src="https://alphax.wiki/images/a/a1/Chain-image.png" alt="Kink & BDSM" loading="lazy"><div class="to"><span class="tn">Kink & BDSM</span></div></a>
-       FEATURES
+      <a href="https://alphax.wiki/wiki/Category:Culture,_History_%26_Politics" class="tc"><img src="https://alphax.wiki/images/2/25/Culture_History_Politics_Hero.png" alt="Culture, History & Politics" loading="lazy"><div class="to"><span class="tn">Culture, History & Politics</span></div></a>
-  ═══════════════════════════════════════════════════ -->
+      <a href="https://alphax.wiki/wiki/Category:Fashion_%26_Visual_Signaling" class="tc"><img src="https://alphax.wiki/images/8/86/Screenshot_2026-04-26_at_15.06.46.png" alt="Fashion & Visual Signaling" loading="lazy"><div class="to"><span class="tn">Fashion & Visual Signaling</span></div></a>
-  <section style="padding:80px 1rem" id="features" aria-labelledby="feat-h">
+      <a href="https://alphax.wiki/wiki/Category:Community_%26_Identity" class="tc"><img src="https://alphax.wiki/images/e/ed/Community_Identity_Hero.png" alt="Community & Identity" loading="lazy"><div class="to"><span class="tn">Community & Identity</span></div></a>
-     <div style="max-width:1100px;margin:0 auto">
+      <a href="https://alphax.wiki/wiki/Category:Drugs,_Party_Culture_%26_Harm_Reduction" class="tc"><img src="https://alphax.wiki/images/3/38/Drugs_Party_Culture_Hero.png" alt="Drugs, Party Culture & Harm Reduction" loading="lazy"><div class="to"><span class="tn">Drugs, Party Culture & Harm Reduction</span></div></a>
-       <div style="text-align:center;margin-bottom:56px" class="fu">
+      <a href="https://alphax.wiki/wiki/Category:Life_Planning" class="tc"><img src="https://alphax.wiki/images/7/74/Life_Planning_Hero.jpg" alt="Life Planning" loading="lazy"><div class="to"><span class="tn">Life Planning</span></div></a>
-        <div class="eyebrow" style="justify-content:center;margin-bottom:16px">Why AlphaX Wiki</div>
-        <h2 id="feat-h" style="font-size:clamp(1.8rem,3.5vw,2.8rem);font-weight:800;color:var(--text);letter-spacing:-.025em;line-height:1.15">
-          Built for the community.<br><span class="ot">Not an afterthought.</span>
-        </h2>
-      </div>
-       <div style="display:grid;grid-template-columns:repeat(3,1fr);gap:14px" class="g3 fu" data-d="1">
-        <div class="feat-card fu" data-d="1">
-          <div class="feat-icon"><svg width="20" height="20" fill="none" stroke="var(--orange)" viewBox="0 0 24 24" aria-hidden="true"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4.318 6.318a4.5 4.5 0 000 6.364L12 20.364l7.682-7.682a4.5 4.5 0 00-6.364-6.364L12 7.636l-1.318-1.318a4.5 4.5 0 00-6.364 0z"/></svg></div>
-          <div class="feat-title">Life-Saving Knowledge</div>
-          <div class="feat-body">From HIV prevention to chemsex harm reduction — some articles don't just inform, they protect. Written with clinical accuracy and zero shame.</div>
-        </div>
-        <div class="feat-card fu" data-d="2">
-          <div class="feat-icon"><svg width="20" height="20" fill="none" stroke="var(--orange)" viewBox="0 0 24 24" aria-hidden="true"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6.253v13m0-13C10.832 5.477 9.246 5 7.5 5S4.168 5.477 3 6.253v13C4.168 18.477 5.754 18 7.5 18s3.332.477 4.5 1.253m0-13C13.168 5.477 14.754 5 16.5 5c1.747 0 3.332.477 4.5 1.253v13C19.832 18.477 18.247 18 16.5 18c-1.746 0-3.332.477-4.5 1.253"/></svg></div>
-          <div class="feat-title">Deep, Honest Articles</div>
-          <div class="feat-body">No watered-down advice. Rich long-form articles that treat the reader as an intelligent adult navigating a real life — without heteronormative assumptions.</div>
-        </div>
-        <div class="feat-card fu" data-d="3">
-          <div class="feat-icon"><svg width="20" height="20" fill="none" stroke="var(--orange)" viewBox="0 0 24 24" aria-hidden="true"><circle cx="11" cy="11" r="8"/><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m21 21-4.35-4.35"/></svg></div>
-          <div class="feat-title">Find What You Need Fast</div>
-          <div class="feat-body">Search 500+ articles instantly. From PrEP to polyamory, darkroom etiquette to coming out at 40 — it's all indexed and searchable.</div>
-        </div>
-        <div class="feat-card fu" data-d="4">
-          <div class="feat-icon"><svg width="20" height="20" fill="none" stroke="var(--orange)" viewBox="0 0 24 24" aria-hidden="true"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 20h5v-2a3 3 0 00-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 015.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857m0 0a5.002 5.002 0 019.288 0M15 7a3 3 0 11-6 0 3 3 0 016 0z"/></svg></div>
-          <div class="feat-title">Built for the Community</div>
-          <div class="feat-body">Written by people who live this life. No journalists parachuting in. Real knowledge from real experience, reviewed for accuracy.</div>
-        </div>
-        <div class="feat-card fu" data-d="5">
-          <div class="feat-icon"><svg width="20" height="20" fill="none" stroke="var(--orange)" viewBox="0 0 24 24" aria-hidden="true"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z"/></svg></div>
-          <div class="feat-title">Private by Default</div>
-          <div class="feat-body">No account. No tracking your reads. No social logins. Come, read what you need, and leave. Your business stays your business.</div>
-        </div>
-        <div class="feat-card fu" data-d="6">
-          <div class="feat-icon"><svg width="20" height="20" fill="none" stroke="var(--orange)" viewBox="0 0 24 24" aria-hidden="true"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 10h18M7 15h1m4 0h1m-7 4h12a3 3 0 003-3V8a3 3 0 00-3-3H6a3 3 0 00-3 3v8a3 3 0 003 3z"/></svg></div>
-          <div class="feat-title">Forever Free</div>
-          <div class="feat-body">No paywalls. No premium tiers. No "unlock for $9/month." Every article, available to everyone — because this knowledge shouldn't have a price tag.</div>
-        </div>
-      </div>
      </div>
-   </section>
+   </div>
+</section>
+<div class="ctab">
+  <div style="max-width:600px;margin:0 auto;">
+    <h2 style="font-size:clamp(1.8rem,4vw,2.8rem);font-weight:900;letter-spacing:-.03em;margin-bottom:.75rem;">Knowledge that saves lives</h2>
+    <p style="color:var(--tx2);font-size:1.05rem;margin-bottom:2rem;">Everyone deserves access to honest, life-saving information about their own life.</p>
+    <a href="#articles" class="hcp">Explore Articles</a>
+  </div>
+</div>
-  <!-- ═══════════════════════════════════════════════════
+<section class="sec">
-       TOPICS
+  <div class="sec-in">
-  ═══════════════════════════════════════════════════ -->
+    <div class="sec-hd fade-up">
-  <section style="padding:80px 1rem;background:#111111;border-top:1px solid var(--border);border-bottom:1px solid var(--border)" id="topics" aria-labelledby="top-h">
+       <div class="stag">Entry Points</div>
-    <div style="max-width:1100px;margin:0 auto">
+      <h2 class="stitle">Choose your path</h2>
-      <div style="display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:44px" class="fu">
-        <div>
-          <div class="eyebrow" style="margin-bottom:14px">Browse Topics</div>
-          <h2 id="top-h" style="font-size:clamp(1.8rem,3vw,2.5rem);font-weight:800;color:var(--text);letter-spacing:-.025em">80+ subjects covered</h2>
-        </div>
-        <a href="https://alphax.wiki/topics" style="font-size:.85rem;color:var(--text-3);text-decoration:none;display:inline-flex;align-items:center;gap:6px;transition:color .2s"
-           onmouseover="this.style.color='var(--orange)'" onmouseout="this.style.color='var(--text-3)'">
-          View all topics <svg width="14" height="14" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 8l4 4m0 0l-4 4m4-4H3"/></svg>
-        </a>
-      </div>
-       <div class="topic-grid fu" data-d="1">
-        <a href="https://alphax.wiki/health-safety" class="topic-tile" aria-label="Health and Safety — 68 articles">
-          <div class="topic-icon" style="background:rgba(255,106,33,.10);border:1px solid rgba(255,106,33,.20)"><svg width="15" height="15" fill="none" stroke="var(--orange)" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z"/></svg></div>
-          <div class="topic-name">Health &amp; Safety</div><div class="topic-count">68 articles</div>
-        </a>
-        <a href="https://alphax.wiki/relationships" class="topic-tile" aria-label="Relationships — 54 articles">
-          <div class="topic-icon" style="background:rgba(255,255,255,.05);border:1px solid var(--border)"><svg width="15" height="15" fill="none" stroke="var(--text-2)" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4.318 6.318a4.5 4.5 0 000 6.364L12 20.364l7.682-7.682a4.5 4.5 0 00-6.364-6.364L12 7.636l-1.318-1.318a4.5 4.5 0 00-6.364 0z"/></svg></div>
-          <div class="topic-name">Relationships &amp; Dating</div><div class="topic-count">54 articles</div>
-        </a>
-        <a href="https://alphax.wiki/nightlife" class="topic-tile" aria-label="Nightlife — 41 articles">
-          <div class="topic-icon" style="background:rgba(255,255,255,.05);border:1px solid var(--border)"><svg width="15" height="15" fill="none" stroke="var(--text-2)" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.663 17h4.673M12 3v1m6.364 1.636l-.707.707M21 12h-1M4 12H3m3.343-5.657l-.707-.707m2.828 9.9a5 5 0 117.072 0l-.548.547A3.374 3.374 0 0014 18.469V19a2 2 0 11-4 0v-.531c0-.895-.356-1.754-.988-2.386l-.548-.547z"/></svg></div>
-          <div class="topic-name">Nightlife &amp; Culture</div><div class="topic-count">41 articles</div>
-        </a>
-        <a href="https://alphax.wiki/coming-out" class="topic-tile" aria-label="Coming Out — 37 articles">
-          <div class="topic-icon" style="background:rgba(255,255,255,.05);border:1px solid var(--border)"><svg width="15" height="15" fill="none" stroke="var(--text-2)" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343 6.343l-.707-.707m12.728 0l-.707.707M6.343 17.657l-.707.707M16 12a4 4 0 11-8 0 4 4 0 018 0z"/></svg></div>
-          <div class="topic-name">Coming Out</div><div class="topic-count">37 articles</div>
-        </a>
-        <a href="https://alphax.wiki/mental-health" class="topic-tile" aria-label="Mental Wellness — 48 articles">
-          <div class="topic-icon" style="background:rgba(255,255,255,.05);border:1px solid var(--border)"><svg width="15" height="15" fill="none" stroke="var(--text-2)" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4.5 12.75l6 6 9-13.5"/></svg></div>
-          <div class="topic-name">Mental Wellness</div><div class="topic-count">48 articles</div>
-        </a>
-        <a href="https://alphax.wiki/identity" class="topic-tile" aria-label="Community and Identity — 44 articles">
-          <div class="topic-icon" style="background:rgba(255,255,255,.05);border:1px solid var(--border)"><svg width="15" height="15" fill="none" stroke="var(--text-2)" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 20h5v-2a3 3 0 00-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 015.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857m0 0a5.002 5.002 0 019.288 0M15 7a3 3 0 11-6 0 3 3 0 016 0z"/></svg></div>
-          <div class="topic-name">Community &amp; Identity</div><div class="topic-count">44 articles</div>
-        </a>
-        <a href="https://alphax.wiki/chemsex" class="topic-tile" aria-label="Chemsex — 31 articles">
-          <div class="topic-icon" style="background:rgba(255,106,33,.08);border:1px solid rgba(255,106,33,.18)"><svg width="15" height="15" fill="none" stroke="var(--orange)" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"/></svg></div>
-          <div class="topic-name">Chemsex &amp; Harm Reduction</div><div class="topic-count">31 articles</div>
-        </a>
-        <a href="https://alphax.wiki/rights" class="topic-tile" aria-label="Legal Rights — 29 articles">
-          <div class="topic-icon" style="background:rgba(255,255,255,.05);border:1px solid var(--border)"><svg width="15" height="15" fill="none" stroke="var(--text-2)" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 6l3 1m0 0l-3 9a5.002 5.002 0 006.001 0M6 7l3 9M6 7l6-2m6 2l3-1m-3 1l-3 9a5.002 5.002 0 006.001 0M18 7l3 9m-3-9l-6-2m0-2v2m0 16V5m0 16H9m3 0h3"/></svg></div>
-          <div class="topic-name">Legal &amp; Rights</div><div class="topic-count">29 articles</div>
-        </a>
-        <a href="https://alphax.wiki/dating-apps" class="topic-tile"><div class="topic-icon" style="background:rgba(255,255,255,.05);border:1px solid var(--border)"><svg width="15" height="15" fill="none" stroke="var(--text-2)" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 18h.01M8 21h8a2 2 0 002-2V5a2 2 0 00-2-2H8a2 2 0 00-2 2v14a2 2 0 002 2z"/></svg></div><div class="topic-name">Dating Apps</div><div class="topic-count">22 articles</div></a>
-        <a href="https://alphax.wiki/sex-education" class="topic-tile"><div class="topic-icon" style="background:rgba(255,255,255,.05);border:1px solid var(--border)"><svg width="15" height="15" fill="none" stroke="var(--text-2)" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6.253v13m0-13C10.832 5.477 9.246 5 7.5 5S4.168 5.477 3 6.253v13C4.168 18.477 5.754 18 7.5 18s3.332.477 4.5 1.253m0-13C13.168 5.477 14.754 5 16.5 5c1.747 0 3.332.477 4.5 1.253v13C19.832 18.477 18.247 18 16.5 18c-1.746 0-3.332.477-4.5 1.253"/></svg></div><div class="topic-name">Sex Education</div><div class="topic-count">35 articles</div></a>
-        <a href="https://alphax.wiki/travel" class="topic-tile"><div class="topic-icon" style="background:rgba(255,255,255,.05);border:1px solid var(--border)"><svg width="15" height="15" fill="none" stroke="var(--text-2)" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3.055 11H5a2 2 0 012 2v1a2 2 0 002 2 2 2 0 012 2v2.945M8 3.935V5.5A2.5 2.5 0 0010.5 8h.5a2 2 0 012 2 2 2 0 104 0 2 2 0 012-2h1.064M15 20.488V18a2 2 0 012-2h3.064M21 12a9 9 0 11-18 0 9 9 0 0118 0z"/></svg></div><div class="topic-name">Gay Travel</div><div class="topic-count">19 articles</div></a>
-        <a href="https://alphax.wiki/found-family" class="topic-tile"><div class="topic-icon" style="background:rgba(255,255,255,.05);border:1px solid var(--border)"><svg width="15" height="15" fill="none" stroke="var(--text-2)" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 9l9-7 9 7v11a2 2 0 01-2 2H5a2 2 0 01-2-2z"/></svg></div><div class="topic-name">Found Family</div><div class="topic-count">17 articles</div></a>
-      </div>
      </div>
-  </section>
+    <div class="pg">
+      <a href="https://alphax.wiki/wiki/Category:Sexual_Health" class="pc"><div class="pi">🏥</div><div class="pt">I want to stay healthy</div><div class="ps">Health, PrEP, STI testing, mental health</div></a>
+       <a href="https://alphax.wiki/wiki/Category:Dating,_Sex_%26_Relationships" class="pc"><div class="pi">💬</div><div class="pt">I'm navigating relationships</div><div class="ps">Dating, intimacy, communication, boundaries</div></a>
-  <!-- ═══════════════════════════════════════════════════
+      <a href="https://alphax.wiki/wiki/Category:Kink_%26_BDSM" class="pc"><div class="pi">🔗</div><div class="pt">I'm exploring kink</div><div class="ps">Consent, safety, roles, practices</div></a>
-       LIFE-SAVING CALLOUT
+       <a href="https://alphax.wiki/wiki/Category:Community_%26_Identity" class="pc"><div class="pi">🏳️‍🌈</div><div class="pt">I'm finding community</div><div class="ps">Identity, belonging, visibility</div></a>
-  ═══════════════════════════════════════════════════ -->
+      <a href="https://alphax.wiki/wiki/Category:Drugs,_Party_Culture_%26_Harm_Reduction" class="pc"><div class="pi">🌙</div><div class="pt">I'm going out</div><div class="ps">Nightlife, harm reduction, chemsex</div></a>
-  <section class="cta-band" style="padding:80px 1rem" id="about" aria-labelledby="ls-h">
-    <div style="max-width:820px;margin:0 auto;text-align:center;position:relative" class="fu">
-       <div style="width:52px;height:52px;border-radius:14px;background:rgba(255,106,33,.12);border:1px solid rgba(255,106,33,.22);display:flex;align-items:center;justify-content:center;margin:0 auto 22px">
-        <svg width="22" height="22" fill="none" stroke="var(--orange)" viewBox="0 0 24 24" aria-hidden="true">
-          <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4.318 6.318a4.5 4.5 0 000 6.364L12 20.364l7.682-7.682a4.5 4.5 0 00-6.364-6.364L12 7.636l-1.318-1.318a4.5 4.5 0 00-6.364 0z"/>
-        </svg>
-      </div>
-      <h2 id="ls-h" style="font-size:clamp(1.8rem,3.5vw,2.8rem);font-weight:900;color:var(--text);letter-spacing:-.025em;margin-bottom:14px;line-height:1.15">
-        Knowledge that saves lives.
-      </h2>
-      <p style="font-size:1.05rem;color:var(--text-2);max-width:540px;margin:0 auto 34px;line-height:1.75">
-        From HIV prevention to recognising the risks of chemsex — some of these articles can change the course of a night, a relationship, or a life. No account. No judgment. Ever.
-      </p>
-       <a href="https://alphax.wiki/articles" class="btn-primary" style="margin:0 auto">
-        Start Reading Free
-        <svg width="15" height="15" fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 8l4 4m0 0l-4 4m4-4H3"/></svg>
-      </a>
      </div>
-   </section>
+   </div>
+</section>
-  <!-- ═══════════════════════════════════════════════════
-       CHOOSE YOUR PATH
-  ═══════════════════════════════════════════════════ -->
-  <section style="padding:80px 1rem" id="articles" aria-labelledby="path-h">
-    <div style="max-width:1100px;margin:0 auto">
-      <div style="text-align:center;margin-bottom:56px" class="fu">
-        <div class="eyebrow" style="justify-content:center;margin-bottom:16px">Start Here</div>
-        <h2 id="path-h" style="font-size:clamp(1.8rem,3.5vw,2.8rem);font-weight:900;color:var(--text);letter-spacing:-.025em;margin-bottom:12px">
-          Choose Your Path
-        </h2>
-        <p style="color:var(--text-2);font-size:1rem;max-width:480px;margin:0 auto;line-height:1.7">
-          Not sure where to begin? Pick the path that fits where you are right now.
-        </p>
-      </div>
-      <!-- 5 path cards: 3 top + 2 bottom -->
-      <div style="display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:14px" class="g3 fu" data-d="1">
-        <a href="https://alphax.wiki/Entering_the_Gay_Scene_for_the_First_Time" class="path-card" aria-label="I'm New — Just Curious">
-          <div class="path-num">01</div>
-          <div class="path-icon-wrap">
-            <svg width="22" height="22" fill="none" stroke="var(--orange)" viewBox="0 0 24 24" aria-hidden="true"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343 6.343l-.707-.707m12.728 0l-.707.707M6.343 17.657l-.707.707M16 12a4 4 0 11-8 0 4 4 0 018 0z"/></svg>
-          </div>
-          <div class="path-title">I'm New / Just Curious</div>
-          <div class="path-desc">Community basics, health, consent &amp; finding your people.</div>
-          <div class="path-cta">Explore <svg width="13" height="13" fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 8l4 4m0 0l-4 4m4-4H3"/></svg></div>
-        </a>
-        <a href="https://alphax.wiki/Fetish_%26_Kink_Library" class="path-card" aria-label="I Want to Explore Kink">
-          <div class="path-num">02</div>
-          <div class="path-icon-wrap">
-            <svg width="22" height="22" fill="none" stroke="var(--orange)" viewBox="0 0 24 24" aria-hidden="true"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17.657 18.657A8 8 0 016.343 7.343S7 9 9 10c0-2 .5-5 2.986-7C14 5 16.09 5.777 17.656 7.343A7.975 7.975 0 0120 13a7.975 7.975 0 01-2.343 5.657z"/><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.879 16.121A3 3 0 1012.015 11L11 14H9c0 .768.293 1.536.879 2.121z"/></svg>
-          </div>
-          <div class="path-title">I Want to Explore Kink</div>
-          <div class="path-desc">BDSM, fetishes, leather culture &amp; power dynamics.</div>
-          <div class="path-cta">Explore <svg width="13" height="13" fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 8l4 4m0 0l-4 4m4-4H3"/></svg></div>
-        </a>
-        <a href="https://alphax.wiki/Dynamics_%26_Relationships" class="path-card" aria-label="Improve My Relationship">
-          <div class="path-num">03</div>
-          <div class="path-icon-wrap">
-            <svg width="22" height="22" fill="none" stroke="var(--orange)" viewBox="0 0 24 24" aria-hidden="true"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4.318 6.318a4.5 4.5 0 000 6.364L12 20.364l7.682-7.682a4.5 4.5 0 00-6.364-6.364L12 7.636l-1.318-1.318a4.5 4.5 0 00-6.364 0z"/></svg>
-          </div>
-          <div class="path-title">Improve My Relationship</div>
-          <div class="path-desc">Communication, trust, non-monogamy &amp; intimacy.</div>
-          <div class="path-cta">Explore <svg width="13" height="13" fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 8l4 4m0 0l-4 4m4-4H3"/></svg></div>
-        </a>
-      </div>
-      <div style="display:grid;grid-template-columns:repeat(2,1fr);gap:14px" class="g2 fu" data-d="2">
-        <a href="https://alphax.wiki/Safety_%26_Consent" class="path-card path-card-wide" aria-label="I Care About Safety">
-          <div class="path-num">04</div>
-          <div class="path-icon-wrap">
-            <svg width="22" height="22" fill="none" stroke="var(--orange)" viewBox="0 0 24 24" aria-hidden="true"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z"/></svg>
-          </div>
-          <div class="path-title">I Care About Safety</div>
-          <div class="path-desc">Harm reduction, safe sex, PrEP, BDSM safety &amp; consent.</div>
-          <div class="path-cta">Explore <svg width="13" height="13" fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 8l4 4m0 0l-4 4m4-4H3"/></svg></div>
-        </a>
-        <a href="https://alphax.wiki/Advanced_Practices" class="path-card path-card-wide" aria-label="I Want Advanced Knowledge">
-          <div class="path-num">05</div>
-          <div class="path-icon-wrap">
-            <svg width="22" height="22" fill="none" stroke="var(--orange)" viewBox="0 0 24 24" aria-hidden="true"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.663 17h4.673M12 3v1m6.364 1.636l-.707.707M21 12h-1M4 12H3m3.343-5.657l-.707-.707m2.828 9.9a5 5 0 117.072 0l-.548.547A3.374 3.374 0 0014 18.469V19a2 2 0 11-4 0v-.531c0-.895-.356-1.754-.988-2.386l-.548-.547z"/></svg>
-          </div>
-          <div class="path-title">I Want Advanced Knowledge</div>
-          <div class="path-desc">Psychology, advanced BDSM, identity &amp; queer history.</div>
-          <div class="path-cta">Explore <svg width="13" height="13" fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 8l4 4m0 0l-4 4m4-4H3"/></svg></div>
-        </a>
-       </div>
+<section class="sec" id="articles" style="background:var(--bg2);border-top:1px solid rgba(255,255,255,.04);">
+  <div class="sec-in">
+    <div class="fade-up" style="margin-bottom:32px;">
+       <div class="stag">Latest</div>
+      <h2 class="stitle" style="text-align:left;">Recent articles</h2>
      </div>
-  </section>
+     <div class="art-sc">
+       <a href="https://alphax.wiki/wiki/Entering_the_Gay_Scene_for_the_First_Time" class="ac"><div class="atag">Community</div><div class="ati">Entering the Gay Scene for the First Time</div><div class="ade">What to expect, how to prepare, and where to start.</div></a>
+      <a href="https://alphax.wiki/wiki/Understanding_PrEP_and_Modern_HIV_Prevention" class="ac"><div class="atag">Health</div><div class="ati">Understanding PrEP and Modern HIV Prevention</div><div class="ade">A complete guide to PrEP, how it works, and how to access it.</div></a>
-  <!-- ═══════════════════════════════════════════════════
+      <a href="https://alphax.wiki/wiki/Body_Image_Pressure_in_Gay_Communities" class="ac"><div class="atag">Identity</div><div class="ati">Body Image Pressure in Gay Communities</div><div class="ade">Beauty ideals, self-perception, and navigating expectations.</div></a>
-       LATEST ARTICLES  –  horizontal scroll
+      <a href="https://alphax.wiki/wiki/Understanding_Consent_in_Power_Exchange" class="ac"><div class="atag">Kink & BDSM</div><div class="ati">Understanding Consent in Power Exchange</div><div class="ade">What consent truly means and how it's practiced.</div></a>
-  ═══════════════════════════════════════════════════ -->
+      <a href="https://alphax.wiki/wiki/Loneliness,_Hookup_Culture,_and_Emotional_Well-Being" class="ac"><div class="atag">Relationships</div><div class="ati">Loneliness, Hookup Culture, and Emotional Well-Being</div><div class="ade">The tension between sexual freedom and connection.</div></a>
-  <section style="padding:80px 1rem;background:#111111;border-top:1px solid var(--border);border-bottom:1px solid var(--border)" aria-labelledby="latest-h">
+      <a href="https://alphax.wiki/wiki/Navigating_Intimacy_After_Sexual_Trauma" class="ac"><div class="atag">Health</div><div class="ati">Navigating Intimacy After Sexual Trauma</div><div class="ade">Processing, healing, and the path back to connection.</div></a>
-     <div style="max-width:1100px;margin:0 auto">
-      <div style="display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:28px">
-        <div>
-          <div style="font-size:.73rem;font-weight:700;color:var(--orange);letter-spacing:.08em;text-transform:uppercase;margin-bottom:8px">&#8212; Fresh &amp; Recent</div>
-          <h2 id="latest-h" style="font-size:clamp(1.8rem,3vw,2.5rem);font-weight:800;color:var(--text);letter-spacing:-.025em">Latest Articles</h2>
-        </div>
-        <div style="display:flex;align-items:center;gap:8px">
-          <div style="position:relative">
-            <input id="latest-search-input" type="text" placeholder="Search latest…" oninput="filterLatestCards(this.value)" style="background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:9px 14px 9px 36px;color:var(--text);font-size:.88rem;width:200px;outline:none" />
-            <svg style="position:absolute;left:10px;top:50%;transform:translateY(-50%);pointer-events:none;opacity:.5" width="16" height="16" fill="none" stroke="currentColor" viewBox="0 0 24 24"><circle cx="11" cy="11" r="8"/><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 21l-4.35-4.35"/></svg>
-          </div>
-          <button onclick="scrollLatest(-1)" style="width:38px;height:38px;border-radius:50%;background:var(--surface);border:1px solid var(--border);color:var(--text);cursor:pointer;display:flex;align-items:center;justify-content:center">&#8249;</button>
-          <button onclick="scrollLatest(1)" style="width:38px;height:38px;border-radius:50%;background:var(--surface);border:1px solid var(--border);color:var(--text);cursor:pointer;display:flex;align-items:center;justify-content:center">&#8250;</button>
-        </div>
-       </div>
-      <div id="latest-deck" style="display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:12px;scrollbar-width:none">
-        <a href="https://alphax.wiki/Impact_of_Dating_Apps_on_Gay_Life" class="latest-card">
-          <div class="latest-title">Impact of Dating Apps on Gay Life</div>
-          <div style="display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:auto">
-            <span class="tag t-white">Dating</span>
-            <div class="latest-date">2026</div>
-          </div>
-        </a>
-        <a href="https://alphax.wiki/The_Loneliness_Epidemic_No_One_Talks_About_%E2%80%94_and_Why_It%E2%80%99s_Killing_Us" class="latest-card">
-          <div class="latest-title">The Loneliness Epidemic No One Talks About — and Why It’s Killing Us</div>
-          <div style="display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:auto">
-            <span class="tag t-white">Identity</span>
-            <div class="latest-date">2026</div>
-          </div>
-        </a>
-        <a href="https://alphax.wiki/Food_Play" class="latest-card">
-          <div class="latest-title">Food Play</div>
-          <div style="display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:auto">
-            <span class="tag t-white">Kink</span>
-            <div class="latest-date">2026</div>
-          </div>
-        </a>
-        <a href="https://alphax.wiki/Neoprene_Fetish" class="latest-card">
-          <div class="latest-title">Neoprene Fetish</div>
-          <div style="display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:auto">
-            <span class="tag t-white">Fetish</span>
-            <div class="latest-date">2026</div>
-          </div>
-        </a>
-        <a href="https://alphax.wiki/Watersports" class="latest-card">
-          <div class="latest-title">Watersports</div>
-          <div style="display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:auto">
-            <span class="tag t-white">Fetish</span>
-            <div class="latest-date">2026</div>
-          </div>
-        </a>
-        <a href="https://alphax.wiki/Boots_Fetish" class="latest-card">
-          <div class="latest-title">Boots Fetish</div>
-          <div style="display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:auto">
-            <span class="tag t-white">Fetish</span>
-            <div class="latest-date">2026</div>
-          </div>
-        </a>
-        <a href="https://alphax.wiki/Tattoos_Fetish" class="latest-card">
-          <div class="latest-title">Tattoos Fetish</div>
-          <div style="display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:auto">
-            <span class="tag t-white">Fetish</span>
-            <div class="latest-date">2026</div>
-          </div>
-        </a>
-        <a href="https://alphax.wiki/Piercings_Fetish" class="latest-card">
-          <div class="latest-title">Piercings Fetish</div>
-          <div style="display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:auto">
-            <span class="tag t-white">Fetish</span>
-            <div class="latest-date">2026</div>
-          </div>
-        </a>
-        <a href="https://alphax.wiki/Spandex_and_Lycra_Fetish" class="latest-card">
-          <div class="latest-title">Spandex and Lycra Fetish</div>
-          <div style="display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:auto">
-            <span class="tag t-white">Fetish</span>
-            <div class="latest-date">2026</div>
-          </div>
-        </a>
-        <a href="https://alphax.wiki/Masks_Fetish" class="latest-card">
-          <div class="latest-title">Masks Fetish</div>
-          <div style="display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:auto">
-            <span class="tag t-white">Fetish</span>
-            <div class="latest-date">2026</div>
-          </div>
-        </a>
-        <a href="https://alphax.wiki/Uniforms_Fetish" class="latest-card">
-          <div class="latest-title">Uniforms Fetish</div>
-          <div style="display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:auto">
-            <span class="tag t-white">Fetish</span>
-            <div class="latest-date">2026</div>
-          </div>
-        </a>
-        <a href="https://alphax.wiki/Socks_and_Used_Clothing_Fetish" class="latest-card">
-          <div class="latest-title">Socks and Used Clothing Fetish</div>
-          <div style="display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:auto">
-            <span class="tag t-white">Fetish</span>
-            <div class="latest-date">2026</div>
-          </div>
-        </a>
-        <a href="https://alphax.wiki/Hands_and_Gloves_Fetish" class="latest-card">
-          <div class="latest-title">Hands and Gloves Fetish</div>
-          <div style="display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:auto">
-            <span class="tag t-white">Fetish</span>
-            <div class="latest-date">2026</div>
-          </div>
-        </a>
-        <a href="https://alphax.wiki/Muscle_Worship" class="latest-card">
-          <div class="latest-title">Muscle Worship</div>
-          <div style="display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:auto">
-            <span class="tag t-white">Fetish</span>
-            <div class="latest-date">2026</div>
-          </div>
-        </a>
-        <a href="https://alphax.wiki/Armpits_Fetish" class="latest-card">
-          <div class="latest-title">Armpits Fetish</div>
-          <div style="display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:auto">
-            <span class="tag t-white">Fetish</span>
-            <div class="latest-date">2026</div>
-          </div>
-        </a>
-        <a href="https://alphax.wiki/Hair_Fetish" class="latest-card">
-          <div class="latest-title">Hair Fetish</div>
-          <div style="display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:auto">
-            <span class="tag t-white">Fetish</span>
-            <div class="latest-date">2026</div>
-          </div>
-        </a>
-        <a href="https://alphax.wiki/Sneakers_and_Sportswear_Fetish" class="latest-card">
-          <div class="latest-title">Sneakers and Sportswear Fetish</div>
-          <div style="display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:auto">
-            <span class="tag t-white">Fetish</span>
-            <div class="latest-date">2026</div>
-          </div>
-        </a>
-        <a href="https://alphax.wiki/Underwear_Fetish" class="latest-card">
-          <div class="latest-title">Underwear Fetish</div>
-          <div style="display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:auto">
-            <span class="tag t-white">Fetish</span>
-            <div class="latest-date">2026</div>
-          </div>
-        </a>
-        <a href="https://alphax.wiki/Sweat_and_Musk_Fetish" class="latest-card">
-          <div class="latest-title">Sweat and Musk Fetish</div>
-          <div style="display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:auto">
-            <span class="tag t-white">Fetish</span>
-            <div class="latest-date">2026</div>
-          </div>
-        </a>
-        <a href="https://alphax.wiki/Latex_and_Rubber_Fetish" class="latest-card">
-          <div class="latest-title">Latex and Rubber Fetish</div>
-          <div style="display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:auto">
-            <span class="tag t-white">Fetish</span>
-            <div class="latest-date">2026</div>
-          </div>
-        </a>
-      </div>
      </div>
-   </section>
+   </div>
+</section>
-  <!-- ═══════════════════════════════════════════════════
+<section class="sec">
-       EDITOR'S SELECTION
+  <div class="sec-in">
-  ═══════════════════════════════════════════════════ -->
+    <div class="sec-hd fade-up">
-  <section style="padding:80px 1rem" aria-labelledby="editor-h">
+      <div class="stag">Curated</div>
-    <div style="max-width:1100px;margin:0 auto">
+      <h2 class="stitle">Editor's selection</h2>
-      <div style="display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:44px" class="fu">
-        <div>
-          <div class="eyebrow" style="margin-bottom:14px">Curated Reads</div>
-          <h2 id="editor-h" style="font-size:clamp(1.8rem,3vw,2.5rem);font-weight:800;color:var(--text);letter-spacing:-.025em">Editor's Selection</h2>
-        </div>
-        <a href="https://alphax.wiki/Start_Here" style="font-size:.85rem;color:var(--text-3);text-decoration:none;display:inline-flex;align-items:center;gap:6px;transition:color .2s"
-           onmouseover="this.style.color='var(--orange)'" onmouseout="this.style.color='var(--text-3)'">
-          View all <svg width="14" height="14" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 8l4 4m0 0l-4 4m4-4H3"/></svg>
-        </a>
-      </div>
-      <div style="display:grid;grid-template-columns:repeat(3,1fr);gap:12px" class="g3 fu" data-d="1">
-        <a href="https://alphax.wiki/Aftercare_in_BDSM" class="art-card">
-          <div style="display:flex;align-items:center;justify-content:space-between;gap:8px">
-            <span class="tag t-orange">Editor's Pick</span>
-            <span style="font-size:.73rem;color:var(--text-3)">Safety</span>
-          </div>
-          <div class="art-title">Aftercare in BDSM</div>
-          <div class="art-body">Why aftercare matters, what it looks like in practice, and how to give and receive it properly.</div>
-          <div class="art-cta">Read <svg width="12" height="12" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 8l4 4m0 0l-4 4m4-4H3"/></svg></div>
-        </a>
-        <a href="https://alphax.wiki/Hookup_Culture_in_Gay_Communities" class="art-card">
-          <div style="display:flex;align-items:center;justify-content:space-between;gap:8px">
-            <span class="tag t-orange">Editor's Pick</span>
-            <span style="font-size:.73rem;color:var(--text-3)">Culture</span>
-          </div>
-          <div class="art-title">Hookup Culture in Gay Communities</div>
-          <div class="art-body">The sociology, the psychology, and the real-world dynamics of hookup culture in gay life.</div>
-          <div class="art-cta">Read <svg width="12" height="12" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 8l4 4m0 0l-4 4m4-4H3"/></svg></div>
-        </a>
-        <a href="https://alphax.wiki/Leather_Culture_%26_Community" class="art-card">
-          <div style="display:flex;align-items:center;justify-content:space-between;gap:8px">
-            <span class="tag t-orange">Editor's Pick</span>
-            <span style="font-size:.73rem;color:var(--text-3)">Culture</span>
-          </div>
-          <div class="art-title">Leather Culture &amp; Community</div>
-          <div class="art-body">History, codes, events and how leather culture shaped gay identity across decades.</div>
-          <div class="art-cta">Read <svg width="12" height="12" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 8l4 4m0 0l-4 4m4-4H3"/></svg></div>
-        </a>
-        <a href="https://alphax.wiki/Chosen_Family" class="art-card">
-          <div style="display:flex;align-items:center;justify-content:space-between;gap:8px">
-            <span class="tag t-orange">Editor's Pick</span>
-            <span style="font-size:.73rem;color:var(--text-3)">Community</span>
-          </div>
-          <div class="art-title">Chosen Family</div>
-          <div class="art-body">What chosen family means, how to build one, and why it's one of the most powerful forces in queer life.</div>
-          <div class="art-cta">Read <svg width="12" height="12" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 8l4 4m0 0l-4 4m4-4H3"/></svg></div>
-        </a>
-        <a href="https://alphax.wiki/Chemsex_%E2%80%94_A_Complete_Guide" class="art-card">
-          <div style="display:flex;align-items:center;justify-content:space-between;gap:8px">
-            <span class="tag t-orange">Editor's Pick</span>
-            <span style="font-size:.73rem;color:var(--text-3)">Harm Reduction</span>
-          </div>
-          <div class="art-title">Chemsex — A Complete Guide</div>
-          <div class="art-body">Everything you need to know about chemsex: the substances, the risks, the scene, and how to get help.</div>
-          <div class="art-cta">Read <svg width="12" height="12" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 8l4 4m0 0l-4 4m4-4H3"/></svg></div>
-        </a>
-        <a href="https://alphax.wiki/Why_Most_%E2%80%9CSubs%E2%80%9D_Fail_%E2%80%94_And_What_Real_Submission_Actually_Looks_Like" class="art-card">
-          <div style="display:flex;align-items:center;justify-content:space-between;gap:8px">
-            <span class="tag t-orange">Editor's Pick</span>
-            <span style="font-size:.73rem;color:var(--text-3);font-weight:600;text-transform:uppercase;letter-spacing:.04em">BDSM</span>
-          </div>
-          <div class="art-title">Why Most "Subs" Fail — And What Real Submission Actually Looks Like</div>
-          <div class="art-body">Most guys who call themselves "submissive" aren't submissive at all. What real submission actually requires — and why most people avoid it.</div>
-          <div class="art-cta">Read <svg width="12" height="12" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 8l4 4m0 0l-4 4m4-4H3"/></svg></div>
-        </a>
-      </div>
      </div>
-  </section>
+     <div class="edg">
+       <a href="https://alphax.wiki/wiki/Sexual_Health_in_the_Gay_Community" class="ec"><div class="etag">Health</div><div class="eti">Sexual Health in the Gay Community</div></a>
+      <a href="https://alphax.wiki/wiki/What_Is_BDSM" class="ec"><div class="etag">Kink & BDSM</div><div class="eti">What Is BDSM?</div></a>
-  <!-- ═══════════════════════════════════════════════════
+      <a href="https://alphax.wiki/wiki/Body_Diversity_and_Attraction_in_Gay_Communities" class="ec"><div class="etag">Identity</div><div class="eti">Body Diversity and Attraction in Gay Communities</div></a>
-       EXPLORE ALL KNOWLEDGE AREAS
+      <a href="https://alphax.wiki/wiki/Understanding_Routine_STI_Testing_in_Gay_Communities" class="ec"><div class="etag">Health</div><div class="eti">Understanding Routine STI Testing</div></a>
-  ═══════════════════════════════════════════════════ -->
+      <a href="https://alphax.wiki/wiki/First_Time_at_a_Private_Gay_Sex_Party" class="ec"><div class="etag">Nightlife</div><div class="eti">First Time at a Private Gay Sex Party</div></a>
-  <section style="padding:80px 1rem;background:#111111;border-top:1px solid var(--border);border-bottom:1px solid var(--border)" aria-labelledby="areas-h">
+      <a href="https://alphax.wiki/wiki/Recovering_Sexual_Confidence_After_Relationship_Breakups" class="ec"><div class="etag">Relationships</div><div class="eti">Recovering Sexual Confidence After Breakups</div></a>
-     <div style="max-width:1100px;margin:0 auto">
-      <div style="text-align:center;margin-bottom:52px" class="fu">
-        <div class="eyebrow" style="justify-content:center;margin-bottom:16px">Full Library</div>
-        <h2 id="areas-h" style="font-size:clamp(1.8rem,3.5vw,2.8rem);font-weight:900;color:var(--text);letter-spacing:-.025em;margin-bottom:12px">
-          Explore All Knowledge Areas
-        </h2>
-        <p style="color:var(--text-2);font-size:1rem;max-width:440px;margin:0 auto;line-height:1.7">
-          Eight pillars covering every corner of gay life — from safety to culture, kink to identity.
-        </p>
-      </div>
-       <div style="display:grid;grid-template-columns:repeat(4,1fr);gap:12px" class="fu" data-d="1" id="areas-grid">
-        <style>@media(max-width:900px){#areas-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:480px){#areas-grid{grid-template-columns:1fr}}</style>
-        <a href="https://alphax.wiki/Safety_%26_Consent" class="area-card">
-          <div class="area-icon">🛡️</div>
-          <div class="area-name">Safety &amp; Consent</div>
-          <div class="area-desc">PrEP, harm reduction, safe sex, consent frameworks</div>
-          <div class="area-arrow">→</div>
-        </a>
-        <a href="https://alphax.wiki/Fetish_%26_Kink_Library" class="area-card">
-          <div class="area-icon">🔥</div>
-          <div class="area-name">Fetish &amp; Kink Library</div>
-          <div class="area-desc">BDSM, leather, fetishes, gear and play</div>
-          <div class="area-arrow">→</div>
-        </a>
-        <a href="https://alphax.wiki/Dynamics_%26_Relationships" class="area-card">
-          <div class="area-icon">💑</div>
-          <div class="area-name">Dynamics &amp; Relationships</div>
-          <div class="area-desc">Non-monogamy, communication, intimacy, trust</div>
-          <div class="area-arrow">→</div>
-        </a>
-        <a href="https://alphax.wiki/Psychology_%26_Identity" class="area-card">
-          <div class="area-icon">🧠</div>
-          <div class="area-name">Psychology &amp; Identity</div>
-          <div class="area-desc">Mental health, shame, self-acceptance, coming out</div>
-          <div class="area-arrow">→</div>
-        </a>
-        <a href="https://alphax.wiki/Advanced_Practices" class="area-card">
-          <div class="area-icon">⚡</div>
-          <div class="area-name">Advanced Practices</div>
-          <div class="area-desc">Deep BDSM, edge play, queer theory, history</div>
-          <div class="area-arrow">→</div>
-        </a>
-        <a href="https://alphax.wiki/Culture_%26_Nightlife" class="area-card">
-          <div class="area-icon">🌃</div>
-          <div class="area-name">Culture &amp; Nightlife</div>
-          <div class="area-desc">Bars, saunas, darkrooms, pride, gay scenes</div>
-          <div class="area-arrow">→</div>
-        </a>
-        <a href="https://alphax.wiki/Drugs_%26_Harm_Reduction" class="area-card">
-          <div class="area-icon">💊</div>
-          <div class="area-name">Drugs &amp; Harm Reduction</div>
-          <div class="area-desc">Chemsex, substance risks, support resources</div>
-          <div class="area-arrow">→</div>
-        </a>
-        <a href="https://alphax.wiki/Fashion_%26_Visual_Signaling" class="area-card">
-          <div class="area-icon">👗</div>
-          <div class="area-name">Fashion &amp; Visual Signaling</div>
-          <div class="area-desc">Dress codes, hanky codes, identity through style</div>
-          <div class="area-arrow">→</div>
-        </a>
-      </div>
-      <div style="text-align:center;margin-top:36px" class="fu" data-d="1">
-        <a href="https://alphax.wiki/Start_Here" class="btn-primary" style="margin:0 auto">
-          Browse the Full Library
-          <svg width="15" height="15" fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 8l4 4m0 0l-4 4m4-4H3"/></svg>
-        </a>
-      </div>
      </div>
-   </section>
+   </div>
+</section>
-  <!-- ═══════════════════════════════════════════════════
+<section class="sec" style="background:var(--bg2);border-top:1px solid rgba(255,255,255,.04);">
-       TESTIMONIALS
+  <div class="sec-in">
-  ═══════════════════════════════════════════════════ -->
+    <div class="sec-hd fade-up">
-  <section style="padding:80px 1rem;background:#111111;border-top:1px solid var(--border);border-bottom:1px solid var(--border)" aria-labelledby="voices-h">
+      <div class="stag">Readers</div>
-    <div style="max-width:1100px;margin:0 auto">
+      <h2 class="stitle">What people say</h2>
-      <div style="text-align:center;margin-bottom:48px" class="fu">
-        <div class="eyebrow" style="justify-content:center;margin-bottom:14px">Community Voices</div>
-        <h2 id="voices-h" style="font-size:clamp(1.8rem,3vw,2.5rem);font-weight:800;color:var(--text);letter-spacing:-.025em">What readers say</h2>
-      </div>
-      <div class="q-grid fu" data-d="1">
-        <figure class="q-card">
-          <blockquote><p class="q-text">"The PrEP article was the first time I fully understood how it worked. I started taking it the following week. This site genuinely changed how I protect myself."</p></blockquote>
-          <figcaption style="display:flex;align-items:center;gap:12px">
-            <div style="width:36px;height:36px;border-radius:50%;background:var(--grad);display:flex;align-items:center;justify-content:center;font-size:.74rem;font-weight:800;color:#fff;flex-shrink:0;box-shadow:var(--glow-sm)" aria-hidden="true">M</div>
-            <div><div style="font-weight:700;font-size:.87rem;color:var(--text)">Marco, 24</div><div style="font-size:.75rem;color:var(--text-3)">Berlin</div></div>
-          </figcaption>
-        </figure>
-        <figure class="q-card">
-          <blockquote><p class="q-text">"When I first came out I was completely lost. AlphaX gave me the vocabulary, the context, and the confidence to start building my life in the gay community."</p></blockquote>
-          <figcaption style="display:flex;align-items:center;gap:12px">
-            <div style="width:36px;height:36px;border-radius:50%;background:var(--surface);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:.74rem;font-weight:800;color:var(--text-2);flex-shrink:0" aria-hidden="true">J</div>
-            <div><div style="font-weight:700;font-size:.87rem;color:var(--text)">James, 19</div><div style="font-size:.75rem;color:var(--text-3)">Manchester</div></div>
-          </figcaption>
-        </figure>
-        <figure class="q-card">
-          <blockquote><p class="q-text">"I sent the chemsex article to a friend who was struggling. He called the next day to say he'd booked a support session. No other resource did that for us."</p></blockquote>
-          <figcaption style="display:flex;align-items:center;gap:12px">
-            <div style="width:36px;height:36px;border-radius:50%;background:var(--surface);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:.74rem;font-weight:800;color:var(--text-2);flex-shrink:0" aria-hidden="true">R</div>
-            <div><div style="font-weight:700;font-size:.87rem;color:var(--text)">Rafi, 31</div><div style="font-size:.75rem;color:var(--text-3)">Tel Aviv</div></div>
-          </figcaption>
-        </figure>
-      </div>
      </div>
-  </section>
+    <div class="tsg">
+      <div class="tsc fade-up"><div class="tsq">"</div><div class="tst">The PrEP article literally saved my life. I didn't even know what it was before I found AlphaX.Wiki. Now I'm on it and feel safe.</div><div class="tsa"><div class="tsav">J</div><div><div class="tsn">James</div><div class="tsc2">Manchester, UK</div></div></div></div>
+       <div class="tsc fade-up"><div class="tsq">"</div><div class="tst">When I came out I had no idea where to start. The articles on identity and community made me feel less alone — and actually helped me find my people.</div><div class="tsa"><div class="tsav">D</div><div><div class="tsn">Daniel</div><div class="tsc2">Berlin, Germany</div></div></div></div>
-  <!-- ═══════════════════════════════════════════════════
+      <div class="tsc fade-up"><div class="tsq">"</div><div class="tst">Finally honest information about chemsex and harm reduction — no judgment, no moralising, just practical knowledge that actually helps.</div><div class="tsa"><div class="tsav">A</div><div><div class="tsn">Aviv</div><div class="tsc2">Tel Aviv, Israel</div></div></div></div>
-       NEWSLETTER
-  ═══════════════════════════════════════════════════ -->
-  <section style="padding:100px 1rem" aria-labelledby="nl-h">
-    <div style="max-width:480px;margin:0 auto;text-align:center" class="fu">
-      <div style="width:2px;height:40px;background:var(--grad);margin:0 auto 28px;border-radius:1px;box-shadow:var(--glow-sm)" aria-hidden="true"></div>
-      <div class="eyebrow" style="justify-content:center;margin-bottom:16px">Weekly Newsletter</div>
-       <h2 id="nl-h" style="font-size:clamp(1.8rem,3.5vw,2.8rem);font-weight:900;color:var(--text);letter-spacing:-.025em;line-height:1.12;margin-bottom:12px">
-        Stay in the <span class="ot">know.</span>
-      </h2>
-      <p style="color:var(--text-2);font-size:.95rem;line-height:1.72;margin-bottom:30px">
-        New articles every week. Health guides, deep-dives, community stories. No spam, unsubscribe anytime.
-      </p>
-      <form onsubmit="handleSub(event)" novalidate style="display:flex;flex-direction:column;gap:10px">
-        <label for="nl" class="sr-only">Email address</label>
-        <input id="nl" type="email" placeholder="your@email.com" class="nl-in" required aria-required="true" autocomplete="email">
-        <button type="submit" class="btn-primary" style="justify-content:center;width:100%">
-          <span id="nl-span">Subscribe Free</span>
-        </button>
-      </form>
-      <p style="font-size:.74rem;color:var(--text-3);margin-top:12px">Join 50,000+ readers. Free forever.</p>
      </div>
-   </section>
+   </div>
+</section>
-</main>
+<section class="nls" id="about">
+  <div style="max-width:500px;margin:0 auto;">
+    <div class="stag">Newsletter</div>
+    <h2 style="font-size:clamp(1.8rem,3vw,2.4rem);font-weight:800;letter-spacing:-.03em;margin-top:.5rem;">Stay informed.</h2>
+    <p style="color:var(--tx2);margin-top:.75rem;">Join 50,000+ readers. Weekly highlights, no spam, always free.</p>
+    <form class="nlf" onsubmit="return false;">
+      <input type="email" placeholder="your@email.com" class="nli">
+      <button type="submit" class="nlb">Subscribe</button>
+    </form>
+  </div>
+</section>
-<!-- ═══════════════════════════════════════════════════
+<footer class="foot">
-     FOOTER
+   <div class="fg">
-═══════════════════════════════════════════════════ -->
+     <div>
-<footer style="border-top:1px solid var(--border);padding:3rem 1rem 2rem;background:#0D0D0D" aria-label="Footer">
+       <img src="https://alphax.wiki/images/7/7a/Alphax_Wiki_logo_new.png" alt="AlphaX Wiki" style="height:28px;">
-   <div style="max-width:1100px;margin:0 auto">
+      <p class="fbp">A free, independent knowledge platform for gay communities worldwide.</p>
-     <div style="display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:2.5rem;margin-bottom:3rem" class="gfooter">
-       <div>
-        <a href="https://alphax.wiki" style="display:inline-flex;margin-bottom:16px" aria-label="AlphaX Wiki">
-          <img src="https://alphax.wiki/images/7/7a/Alphax_Wiki_logo_new.png" alt="AlphaX Wiki" style="height:42px;width:auto;object-fit:contain">
-        </a>
-        <p style="font-size:.82rem;color:var(--text-3);line-height:1.7;max-width:240px">
-          The world's biggest free gay lifestyle knowledge hub. Life-saving articles for everyone, always free.
-        </p>
-      </div>
-      <nav aria-label="Health">
-        <div style="font-size:.68rem;font-weight:700;color:var(--text-3);text-transform:uppercase;letter-spacing:.12em;margin-bottom:14px">Health</div>
-        <ul style="list-style:none;display:flex;flex-direction:column;gap:9px">
-          <li><a href="https://alphax.wiki/prep"          class="ft-link">PrEP Guide</a></li>
-          <li><a href="https://alphax.wiki/hiv"           class="ft-link">HIV &amp; AIDS</a></li>
-          <li><a href="https://alphax.wiki/sti"           class="ft-link">STI Prevention</a></li>
-          <li><a href="https://alphax.wiki/chemsex"       class="ft-link">Chemsex Safety</a></li>
-          <li><a href="https://alphax.wiki/mental-health" class="ft-link">Mental Health</a></li>
-        </ul>
-      </nav>
-      <nav aria-label="Lifestyle">
-        <div style="font-size:.68rem;font-weight:700;color:var(--text-3);text-transform:uppercase;letter-spacing:.12em;margin-bottom:14px">Lifestyle</div>
-        <ul style="list-style:none;display:flex;flex-direction:column;gap:9px">
-          <li><a href="https://alphax.wiki/coming-out"    class="ft-link">Coming Out</a></li>
-          <li><a href="https://alphax.wiki/relationships"  class="ft-link">Relationships</a></li>
-          <li><a href="https://alphax.wiki/nightlife"      class="ft-link">Nightlife</a></li>
-          <li><a href="https://alphax.wiki/dating-apps"    class="ft-link">Dating Apps</a></li>
-          <li><a href="https://alphax.wiki/travel"         class="ft-link">Gay Travel</a></li>
-        </ul>
-      </nav>
-      <nav aria-label="Site">
-        <div style="font-size:.68rem;font-weight:700;color:var(--text-3);text-transform:uppercase;letter-spacing:.12em;margin-bottom:14px">Site</div>
-        <ul style="list-style:none;display:flex;flex-direction:column;gap:9px">
-          <li><a href="https://alphax.wiki/about"    class="ft-link">Our Mission</a></li>
-          <li><a href="https://alphax.wiki/write"    class="ft-link">Contribute</a></li>
-          <li><a href="https://alphax.wiki/privacy"  class="ft-link">Privacy</a></li>
-          <li><a href="https://alphax.wiki/sitemap"  class="ft-link">Sitemap</a></li>
-          <li><a href="https://alphax.wiki/radmin"   class="ft-link">Admin Login</a></li>
-        </ul>
-      </nav>
-    </div>
-    <div class="div-line" style="margin-bottom:20px"></div>
-    <div style="display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px">
-      <p style="font-size:.78rem;color:var(--text-3)">&copy; 2025 AlphaX Wiki. Free knowledge for everyone. Always.</p>
-      <p style="font-size:.78rem;color:var(--text-3)">Made with love for the community</p>
      </div>
+    <div><div class="fct">Health</div><div class="fl"><a href="https://alphax.wiki/wiki/Category:Sexual_Health">Sexual Health</a><a href="https://alphax.wiki/wiki/Category:HIV_Prevention_%26_Treatment">HIV Prevention</a><a href="https://alphax.wiki/wiki/Category:STI_Awareness_%26_Testing">STI Testing</a><a href="https://alphax.wiki/wiki/Category:Sexual_Function_%26_Mental_Health">Mental Health</a></div></div>
+    <div><div class="fct">Lifestyle</div><div class="fl"><a href="https://alphax.wiki/wiki/Category:Dating,_Sex_%26_Relationships">Dating & Relationships</a><a href="https://alphax.wiki/wiki/Category:Kink_%26_BDSM">Kink & BDSM</a><a href="https://alphax.wiki/wiki/Category:Culture,_History_%26_Politics">Culture & History</a><a href="https://alphax.wiki/wiki/Category:Fashion_%26_Visual_Signaling">Fashion & Style</a></div></div>
+    <div><div class="fct">Site</div><div class="fl"><a href="https://alphax.wiki/wiki/Homepage">Home</a><a href="https://alphax.wiki/wiki/Topics">All Topics</a><a href="https://alphax.wiki/wiki/Special:AllPages">All Articles</a><a href="https://alphax.wiki/radmin">Admin</a></div></div>
+  </div>
+  <div class="fb">
+    <span>© 2024 AlphaX.Wiki · All content is for educational purposes only.</span>
+    <span>No account · No tracking · Always free</span>
    </div>
 </footer>
-<style>
-  .ft-link { font-size:.84rem;color:var(--text-3);text-decoration:none;transition:color .2s; }
-  .ft-link:hover { color:var(--orange); }
-  .sr-only { position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0; }
-</style>
-<script>
-  /* Progress bar */
-  const prog = document.getElementById('prog');
-  window.addEventListener('scroll', () => {
-    const h = document.documentElement;
-    prog.style.width = (h.scrollTop / (h.scrollHeight - h.clientHeight) * 100) + '%';
-  }, { passive: true });
-  /* Fade-up */
-  const io = new IntersectionObserver(entries => {
-    entries.forEach(e => { if (e.isIntersecting) { e.target.classList.add('in'); io.unobserve(e.target); } });
-  }, { threshold: 0.06, rootMargin: '0px 0px -36px 0px' });
-  document.querySelectorAll('.fu').forEach(el => io.observe(el));
-  /* Smooth anchor scroll */
-  document.querySelectorAll('a[href^="#"]').forEach(a => {
-    a.addEventListener('click', e => {
-      const t = document.querySelector(a.getAttribute('href'));
-      if (!t) return;
-      e.preventDefault();
-      window.scrollTo({ top: t.getBoundingClientRect().top + scrollY - 80, behavior: 'smooth' });
-    });
-  });
-  /* Newsletter */
-  function handleSub(e) {
-    e.preventDefault();
-    const inp = document.getElementById('nl');
-    const span = document.getElementById('nl-span');
-    if (!inp.value) return;
-    span.textContent = 'Subscribed!';
-    e.target.querySelector('button').style.background = 'linear-gradient(135deg,#3DDC84,#2BB870)';
-    e.target.querySelector('button').style.boxShadow = '0 0 20px rgba(61,220,132,.3)';
-    inp.value = '';
-    setTimeout(() => {
-      span.textContent = 'Subscribe Free';
-      e.target.querySelector('button').style.background = '';
-      e.target.querySelector('button').style.boxShadow = '';
-    }, 3500);
-  }
-  /* Latest deck scroll */
-  function scrollLatest(dir) {
-    document.getElementById('latest-deck').scrollBy({ left: dir * 520, behavior: 'smooth' }
-  function filterLatestCards(query) {
-    const q = query.toLowerCase().trim();
-    const cards = document.querySelectorAll('#latest-deck .latest-card');
-    cards.forEach(function(card) {
-      const title = card.querySelector('.latest-title');
-      const text = title ? title.textContent.toLowerCase() : '';
-      card.style.display = (!q || text.includes(q)) ? '' : 'none';
-    });
-  });
-  }
-</script>
 <script>
-  /* Progress bar */
+window.addEventListener('scroll',()=>{const p=window.scrollY/(document.body.scrollHeight-window.innerHeight);document.getElementById('prog').style.transform=`scaleX(${p})`;});
-  const prog = document.getElementById('prog');
+const obs=new IntersectionObserver(e=>e.forEach(i=>{if(i.isIntersecting){i.target.classList.add('in');obs.unobserve(i.target);}}),{threshold:.1});
-  window.addEventListener('scroll', () => {
+document.querySelectorAll('.fade-up').forEach(el=>obs.observe(el));
-    const h = document.documentElement;
+function toggleTheme(){const l=document.body.classList.toggle('light-mode');document.body.classList.toggle('dark-mode',!l);localStorage.setItem('theme',l?'light':'dark');document.getElementById('tbtn').textContent=l?'☀️':'🌙';}
-    prog.style.width = (h.scrollTop / (h.scrollHeight - h.clientHeight) * 100) + '%';
+(function(){const s=localStorage.getItem('theme');const pl=window.matchMedia('(prefers-color-scheme:light)').matches;const ul=s?s==='light':pl;document.body.classList.add(ul?'light-mode':'dark-mode');document.addEventListener('DOMContentLoaded',()=>{const b=document.getElementById('tbtn');if(b)b.textContent=ul?'☀️':'🌙';});})();
-  }, { passive: true });
-  /* Fade-up */
-  const io = new IntersectionObserver(entries => {
-    entries.forEach(e => { if (e.isIntersecting) { e.target.classList.add('in'); io.unobserve(e.target); } });
-  }, { threshold: 0.06, rootMargin: '0px 0px -36px 0px' });
-  document.querySelectorAll('.fu').forEach(el => io.observe(el));
-  /* Smooth anchor scroll */
-  document.querySelectorAll('a[href^="#"]').forEach(a => {
-    a.addEventListener('click', e => {
-      const t = document.querySelector(a.getAttribute('href'));
-      if (!t) return;
-      e.preventDefault();
-      window.scrollTo({ top: t.getBoundingClientRect().top + scrollY - 80, behavior: 'smooth' });
-    });
-  });
-  /* Newsletter */
-  function handleSub(e) {
-    e.preventDefault();
-    const inp = document.getElementById('nl');
-    const span = document.getElementById('nl-span');
-    if (!inp.value) return;
-    span.textContent = 'Subscribed!';
-    e.target.querySelector('button').style.background = 'linear-gradient(135deg,#3DDC84,#2BB870)';
-    e.target.querySelector('button').style.boxShadow = '0 0 20px rgba(61,220,132,.3)';
-    inp.value = '';
-    setTimeout(() => {
-      span.textContent = 'Subscribe Free';
-      e.target.querySelector('button').style.background = '';
-      e.target.querySelector('button').style.boxShadow = '';
-    }, 3500);
-  }
-  /* Latest deck scroll */
-  function scrollLatest(dir) {
-    document.getElementById('latest-deck').scrollBy({ left: dir * 520, behavior: 'smooth' });
-  }
 </script>
 </html>

Homepage: Difference between revisions

Latest revision as of 05:45, 9 May 2026

Everything aboutgay life.In one place. Free.

Knowledge that actually matters

Explore by category

Knowledge that saves lives

Choose your path

Recent articles

Editor's selection

What people say

Stay informed.

Navigation menu

Search

Everything about
gay life.
In one place. Free.