<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Nerdworks — The Collector's Showcase</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,400;0,500;0,600;0,700;0,800;1,400;1,600&family=JetBrains+Mono:wght@400;500;700&display=swap" rel="stylesheet">
<style>
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
img { display: block; max-width: 100%; }
a { text-decoration: none; color: inherit; }
ul { list-style: none; }
:root {
--green-deep: #1A3D25;
--green-mid: #266038;
--green-bright: #217E52;
--green-light: #D4EAD9;
--green-pale: #EAF5ED;
--dark: #1A1E1A;
--grey-dark: #3D4A3F;
--grey: #6B7E6E;
--grey-mid: #9DB0A0;
--grey-light: #C8D9CB;
--border: #DDE8DF;
--bg: #F6FBF7;
--bg-warm: #FFFFFF;
--text: #1A2B1C;
--text-muted: #5A6E5C;
--font-sans: 'Plus Jakarta Sans', sans-serif;
--font-mono: 'JetBrains Mono', monospace;
--content-width: 1400px;
}
body {
font-family: var(--font-sans);
background: var(--bg);
color: var(--text);
line-height: 1.6;
font-size: 15px;
}
.container {
max-width: var(--content-width);
margin: 0 auto;
padding: 0 40px;
}
/* NAV */
.nav {
position: sticky;
top: 0;
z-index: 100;
background: var(--bg-warm);
border-bottom: 1px solid var(--border);
padding: 0 40px;
}
.nav__inner {
max-width: var(--content-width);
margin: 0 auto;
display: flex;
align-items: center;
gap: 48px;
height: 60px;
}
.nav__logo {
font-size: 14px;
font-weight: 800;
letter-spacing: 0.12em;
text-transform: uppercase;
color: var(--dark);
flex-shrink: 0;
}
.nav__logo .works { color: var(--green-mid); }
.nav__links {
display: flex;
gap: 32px;
flex: 1;
}
.nav__links a {
font-size: 13px;
font-weight: 500;
color: var(--grey-dark);
transition: color 0.2s;
}
.nav__links a.active { color: var(--green-mid); font-weight: 600; }
.nav__links a:hover { color: var(--green-mid); }
.nav__actions {
display: flex;
gap: 20px;
align-items: center;
}
.nav__icon {
width: 20px;
height: 20px;
color: var(--grey-dark);
cursor: pointer;
}
.nav__icon svg { width: 20px; height: 20px; fill: currentColor; }
/* HERO */
.hero {
background: var(--bg-warm);
padding: 64px 40px 72px;
border-bottom: 1px solid var(--border);
}
.hero__inner {
max-width: var(--content-width);
margin: 0 auto;
display: grid;
grid-template-columns: 1fr 1fr;
gap: 64px;
align-items: center;
}
.hero__eyebrow {
font-family: var(--font-mono);
font-size: 10px;
font-weight: 500;
letter-spacing: 0.18em;
text-transform: uppercase;
color: var(--green-mid);
margin-bottom: 16px;
display: flex;
align-items: center;
gap: 8px;
}
.hero__eyebrow::before {
content: '';
width: 20px;
height: 2px;
background: var(--green-mid);
display: inline-block;
}
.hero__title {
font-size: 60px;
font-weight: 800;
line-height: 1.05;
letter-spacing: -0.03em;
color: var(--dark);
margin-bottom: 20px;
}
.hero__subtitle {
font-size: 15px;
color: var(--text-muted);
line-height: 1.75;
max-width: 400px;
margin-bottom: 36px;
}
.hero__ctas {
display: flex;
gap: 12px;
}
.btn {
display: inline-flex;
align-items: center;
padding: 13px 24px;
border-radius: 4px;
font-size: 13px;
font-weight: 600;
cursor: pointer;
transition: all 0.2s;
}
.btn--primary {
background: var(--green-mid);
color: #fff;
}
.btn--primary:hover { background: var(--green-bright); }
.btn--outline {
background: transparent;
color: var(--dark);
border: 1.5px solid var(--border);
}
.btn--outline:hover { border-color: var(--grey-mid); background: var(--bg); }
.hero__visual {
position: relative;
}
.hero__product-img {
width: 100%;
height: 440px;
object-fit: cover;
border-radius: 8px;
}
.hero__note {
position: absolute;
bottom: 20px;
left: 20px;
background: var(--bg-warm);
border-radius: 6px;
padding: 16px 18px;
box-shadow: 0 8px 32px rgba(0,0,0,0.12);
max-width: 220px;
}
.hero__note-label {
font-family: var(--font-mono);
font-size: 9px;
letter-spacing: 0.14em;
text-transform: uppercase;
color: var(--green-mid);
margin-bottom: 6px;
}
.hero__note-text {
font-size: 12px;
color: var(--text-muted);
line-height: 1.5;
}
/* FRESH */
.fresh {
padding: 64px 40px;
background: var(--bg);
}
.fresh__inner {
max-width: var(--content-width);
margin: 0 auto;
}
.section-header {
display: flex;
justify-content: space-between;
align-items: baseline;
margin-bottom: 32px;
}
.section-eyebrow {
font-family: var(--font-mono);
font-size: 10px;
letter-spacing: 0.16em;
text-transform: uppercase;
color: var(--green-mid);
margin-bottom: 6px;
}
.section-title {
font-size: 24px;
font-weight: 700;
color: var(--dark);
}
.section-link {
font-size: 13px;
font-weight: 600;
color: var(--green-mid);
}
.product-grid {
display: grid;
grid-template-columns: repeat(5, 1fr);
gap: 16px;
}
.product-card {
background: var(--bg-warm);
border-radius: 8px;
border: 1px solid var(--border);
overflow: hidden;
transition: box-shadow 0.2s, transform 0.2s;
}
.product-card:hover {
box-shadow: 0 8px 24px rgba(0,0,0,0.08);
transform: translateY(-2px);
}
.product-card__img-wrap {
aspect-ratio: 3/4;
overflow: hidden;
}
.product-card__img-wrap img {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 0.3s;
}
.product-card:hover .product-card__img-wrap img { transform: scale(1.04); }
.product-card__info {
padding: 14px;
}
.product-card__category {
font-family: var(--font-mono);
font-size: 10px;
letter-spacing: 0.1em;
text-transform: uppercase;
color: var(--grey-mid);
margin-bottom: 4px;
}
.product-card__name {
font-size: 13px;
font-weight: 600;
color: var(--dark);
line-height: 1.4;
margin-bottom: 10px;
}
.product-card__footer {
display: flex;
justify-content: space-between;
align-items: center;
}
.product-card__price {
font-size: 16px;
font-weight: 700;
color: var(--dark);
}
.product-card__add {
width: 32px;
height: 32px;
border-radius: 50%;
background: var(--green-mid);
color: #fff;
display: flex;
align-items: center;
justify-content: center;
font-size: 20px;
font-weight: 300;
cursor: pointer;
}
/* STAFF FAVES */
.staff {
padding: 72px 40px;
background: var(--green-pale);
border-top: 1px solid var(--border);
border-bottom: 1px solid var(--border);
}
.staff__inner {
max-width: var(--content-width);
margin: 0 auto;
}
.staff__header {
text-align: center;
margin-bottom: 40px;
}
.staff__eyebrow {
font-family: var(--font-mono);
font-size: 10px;
letter-spacing: 0.16em;
text-transform: uppercase;
color: var(--green-mid);
margin-bottom: 10px;
}
.staff__title {
font-size: 28px;
font-weight: 700;
color: var(--dark);
}
.staff-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 20px;
}
.staff-card {
background: var(--bg-warm);
border-radius: 8px;
overflow: hidden;
border: 1px solid var(--border);
}
.staff-card__img {
width: 100%;
height: 220px;
object-fit: cover;
}
.staff-card__body {
padding: 20px;
}
.staff-card__label {
font-family: var(--font-mono);
font-size: 10px;
letter-spacing: 0.12em;
text-transform: uppercase;
color: var(--green-mid);
margin-bottom: 8px;
}
.staff-card__quote {
font-size: 14px;
font-style: italic;
color: var(--text);
line-height: 1.7;
font-weight: 500;
margin-bottom: 16px;
}
.staff-card__author {
font-size: 12px;
color: var(--grey);
font-weight: 500;
}
/* EXPLORE BY GAME */
.explore {
padding: 64px 40px;
background: var(--bg-warm);
}
.explore__inner {
max-width: var(--content-width);
margin: 0 auto;
}
.game-strip {
display: flex;
gap: 12px;
margin-top: 28px;
overflow-x: auto;
padding-bottom: 4px;
}
.game-chip {
position: relative;
flex-shrink: 0;
width: 130px;
height: 80px;
border-radius: 6px;
overflow: hidden;
cursor: pointer;
}
.game-chip img {
width: 100%;
height: 100%;
object-fit: cover;
filter: brightness(0.65);
transition: filter 0.2s;
}
.game-chip:hover img { filter: brightness(0.85); }
.game-chip__label {
position: absolute;
bottom: 8px;
left: 10px;
font-size: 12px;
font-weight: 700;
color: #fff;
}
/* EVENTS */
.events {
padding: 64px 40px;
background: var(--bg);
}
.events__inner {
max-width: var(--content-width);
margin: 0 auto;
}
.events-grid {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 16px;
margin-top: 32px;
}
.event-card {
background: var(--bg-warm);
border: 1px solid var(--border);
border-radius: 8px;
padding: 24px;
display: flex;
gap: 20px;
align-items: flex-start;
}
.event-card__date {
flex-shrink: 0;
width: 48px;
height: 52px;
background: var(--dark);
border-radius: 4px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.event-card__day {
font-size: 22px;
font-weight: 800;
color: #fff;
line-height: 1;
}
.event-card__month {
font-size: 9px;
font-weight: 600;
letter-spacing: 0.1em;
text-transform: uppercase;
color: rgba(255,255,255,0.6);
}
.event-card__name {
font-size: 15px;
font-weight: 700;
color: var(--dark);
margin-bottom: 4px;
}
.event-card__desc {
font-size: 13px;
color: var(--text-muted);
margin-bottom: 14px;
}
.event-card__btn {
display: inline-block;
padding: 7px 16px;
background: var(--dark);
color: #fff;
border-radius: 3px;
font-size: 12px;
font-weight: 600;
letter-spacing: 0.04em;
}
/* EDITORIAL BLOCK */
.editorial-block {
padding: 0 40px;
background: var(--bg);
}
.editorial-block__inner {
max-width: var(--content-width);
margin: 0 auto;
background: var(--dark);
border-radius: 8px;
display: grid;
grid-template-columns: 1fr 1fr;
overflow: hidden;
}
.editorial-block__img {
width: 100%;
height: 320px;
object-fit: cover;
}
.editorial-block__content {
padding: 48px;
display: flex;
flex-direction: column;
justify-content: center;
}
.editorial-block__eyebrow {
font-family: var(--font-mono);
font-size: 10px;
letter-spacing: 0.16em;
text-transform: uppercase;
color: var(--green-bright);
margin-bottom: 12px;
}
.editorial-block__title {
font-size: 28px;
font-weight: 800;
color: #fff;
line-height: 1.2;
margin-bottom: 12px;
}
.editorial-block__desc {
font-size: 14px;
color: rgba(255,255,255,0.65);
line-height: 1.7;
margin-bottom: 24px;
}
.btn--green {
background: var(--green-mid);
color: #fff;
padding: 12px 22px;
border-radius: 4px;
font-size: 13px;
font-weight: 600;
display: inline-flex;
align-items: center;
width: fit-content;
}
/* BLOG */
.blog {
padding: 64px 40px 80px;
background: var(--bg-warm);
}
.blog__inner {
max-width: var(--content-width);
margin: 0 auto;
}
.article-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 24px;
margin-top: 32px;
}
.article-card {
border-radius: 6px;
overflow: hidden;
border: 1px solid var(--border);
background: var(--bg);
}
.article-card__img {
width: 100%;
height: 180px;
object-fit: cover;
}
.article-card__body {
padding: 20px;
}
.article-card__tag {
font-family: var(--font-mono);
font-size: 10px;
letter-spacing: 0.12em;
text-transform: uppercase;
color: var(--green-mid);
margin-bottom: 8px;
}
.article-card__title {
font-size: 15px;
font-weight: 700;
color: var(--dark);
line-height: 1.4;
margin-bottom: 8px;
}
.article-card__excerpt {
font-size: 13px;
color: var(--text-muted);
line-height: 1.6;
}
/* NEWSLETTER */
.newsletter {
padding: 64px 40px;
background: var(--dark);
}
.newsletter__inner {
max-width: var(--content-width);
margin: 0 auto;
display: grid;
grid-template-columns: 1fr 1fr;
gap: 64px;
align-items: center;
}
.newsletter__title {
font-size: 30px;
font-weight: 800;
color: #fff;
margin-bottom: 8px;
}
.newsletter__subtitle {
font-size: 14px;
color: rgba(255,255,255,0.55);
line-height: 1.6;
}
.newsletter__form {
display: flex;
gap: 0;
border-radius: 4px;
overflow: hidden;
border: 1px solid rgba(255,255,255,0.15);
}
.newsletter__input {
flex: 1;
padding: 14px 20px;
background: rgba(255,255,255,0.08);
border: none;
outline: none;
color: #fff;
font-family: var(--font-sans);
font-size: 14px;
}
.newsletter__input::placeholder { color: rgba(255,255,255,0.35); }
.newsletter__btn {
padding: 14px 22px;
background: var(--green-mid);
border: none;
color: #fff;
font-family: var(--font-sans);
font-size: 13px;
font-weight: 700;
letter-spacing: 0.04em;
cursor: pointer;
}
/* FOOTER */
.footer {
background: var(--dark);
border-top: 1px solid rgba(255,255,255,0.08);
padding: 48px 40px;
}
.footer__inner {
max-width: var(--content-width);
margin: 0 auto;
}
.footer__top {
display: grid;
grid-template-columns: 200px repeat(4, 1fr);
gap: 40px;
margin-bottom: 48px;
}
.footer__logo {
font-size: 13px;
font-weight: 800;
letter-spacing: 0.12em;
text-transform: uppercase;
color: #fff;
}
.footer__logo .works { color: var(--green-bright); }
.footer__col-title {
font-size: 11px;
font-weight: 700;
letter-spacing: 0.1em;
text-transform: uppercase;
color: rgba(255,255,255,0.4);
margin-bottom: 16px;
}
.footer__col a {
display: block;
font-size: 13px;
color: rgba(255,255,255,0.6);
margin-bottom: 10px;
}
.footer__col a:hover { color: #fff; }
.footer__bottom {
border-top: 1px solid rgba(255,255,255,0.08);
padding-top: 24px;
display: flex;
justify-content: space-between;
}
.footer__copy { font-size: 12px; color: rgba(255,255,255,0.35); }
@media (max-width: 768px) {
.nav__links { display: none; }
.hero__inner { grid-template-columns: 1fr; }
.hero__title { font-size: 40px; }
.product-grid { grid-template-columns: repeat(2, 1fr); }
.staff-grid { grid-template-columns: 1fr; }
.events-grid { grid-template-columns: 1fr; }
.article-grid { grid-template-columns: 1fr; }
.editorial-block__inner { grid-template-columns: 1fr; }
.newsletter__inner { grid-template-columns: 1fr; }
.footer__top { grid-template-columns: 1fr 1fr; }
}
</style>
</head>
<body>
<nav class="nav">
<div class="nav__inner">
<a href="#" class="nav__logo"><span class="nerd">NERD</span><span class="works">WORKS</span></a>
<ul class="nav__links">
<li><a href="#" class="active">Home</a></li>
<li><a href="#">New Arrivals</a></li>
<li><a href="#">Events</a></li>
<li><a href="#">Community</a></li>
</ul>
<div class="nav__actions">
<span class="nav__icon">
<svg viewBox="0 0 24 24"><path d="M15.5 14h-.79l-.28-.27A6.47 6.47 0 0 0 16 9.5 6.5 6.5 0 1 0 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"/></svg>
</span>
<span class="nav__icon">
<svg viewBox="0 0 24 24"><path d="M7 18c-1.1 0-1.99.9-1.99 2S5.9 22 7 22s2-.9 2-2-.9-2-2-2zM1 2v2h2l3.6 7.59-1.35 2.45c-.16.28-.25.61-.25.96C5 16.1 6.9 18 9 18h12v-2H9.42c-.14 0-.25-.11-.25-.25l.03-.12.9-1.63H19c.75 0 1.41-.41 1.75-1.03l3.58-6.49A1 1 0 0 0 23.43 5H5.21l-.94-2H1z"/></svg>
</span>
</div>
</div>
</nav>
<section class="hero">
<div class="hero__inner">
<div class="hero__content">
<div class="hero__eyebrow">Nerdworks Archival Supply</div>
<h1 class="hero__title">The<br>Collector's<br>Showcase</h1>
<p class="hero__subtitle">Hand-picked trading cards, board games, and miniatures for collectors and players who demand the extraordinary.</p>
<div class="hero__ctas">
<a href="#" class="btn btn--primary">Browse the Collection</a>
<a href="#" class="btn btn--outline">This Week's Events</a>
</div>
</div>
<div class="hero__visual">
<img class="hero__product-img" src="https://camcom.dev/wp-content/uploads/2026/04/trading-cards-mtg-display.jpg" alt="Collection showcase">
<div class="hero__note">
<div class="hero__note-label">Curator's Note</div>
<div class="hero__note-text">This week's spotlight: Prismatic Evolutions — sealed stock arriving Friday.</div>
</div>
</div>
</div>
</section>
<section class="fresh">
<div class="fresh__inner">
<div class="section-header">
<div>
<div class="section-eyebrow">Curator #1</div>
<h2 class="section-title">Fresh on the shelf</h2>
</div>
<a href="#" class="section-link">View All Arrivals →</a>
</div>
<div class="product-grid">
<div class="product-card">
<div class="product-card__img-wrap">
<img src="https://camcom.dev/wp-content/uploads/2026/04/product-pokemon-etb.jpg" alt="Pokemon Prismatic ETB">
</div>
<div class="product-card__info">
<div class="product-card__category">Pokemon TCG</div>
<div class="product-card__name">Prismatic Evolutions Collector Booster Box</div>
<div class="product-card__footer">
<span class="product-card__price">£54.99</span>
<span class="product-card__add">+</span>
</div>
</div>
</div>
<div class="product-card">
<div class="product-card__img-wrap">
<img src="https://camcom.dev/wp-content/uploads/2026/04/trading-cards-mtg-display.jpg" alt="MTG Foundations">
</div>
<div class="product-card__info">
<div class="product-card__category">Magic: The Gathering</div>
<div class="product-card__name">MTG Foundations Collector Booster Box</div>
<div class="product-card__footer">
<span class="product-card__price">£189.99</span>
<span class="product-card__add">+</span>
</div>
</div>
</div>
<div class="product-card">
<div class="product-card__img-wrap">
<img src="https://camcom.dev/wp-content/uploads/2026/04/trading-cards-pokemon-stack.jpg" alt="Lorcana">
</div>
<div class="product-card__info">
<div class="product-card__category">Disney Lorcana</div>
<div class="product-card__name">Lorcana Shimmering Skies Booster Box</div>
<div class="product-card__footer">
<span class="product-card__price">£79.99</span>
<span class="product-card__add">+</span>
</div>
</div>
</div>
<div class="product-card">
<div class="product-card__img-wrap">
<img src="https://camcom.dev/wp-content/uploads/2026/04/playing-cards.jpg" alt="One Piece">
</div>
<div class="product-card__info">
<div class="product-card__category">One Piece TCG</div>
<div class="product-card__name">One Piece TCO Starter Deck</div>
<div class="product-card__footer">
<span class="product-card__price">£12.99</span>
<span class="product-card__add">+</span>
</div>
</div>
</div>
<div class="product-card">
<div class="product-card__img-wrap">
<img src="https://camcom.dev/wp-content/uploads/2026/04/board-game-setup.jpg" alt="Star Wars Unlimited">
</div>
<div class="product-card__info">
<div class="product-card__category">Star Wars TCG</div>
<div class="product-card__name">Star Wars Unlimited Booster Box</div>
<div class="product-card__footer">
<span class="product-card__price">£84.99</span>
<span class="product-card__add">+</span>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="staff">
<div class="staff__inner">
<div class="staff__header">
<div class="staff__eyebrow">The Curator's Selection</div>
<h2 class="staff__title">Staff favourites this week</h2>
</div>
<div class="staff-grid">
<div class="staff-card">
<img class="staff-card__img" src="https://camcom.dev/wp-content/uploads/2026/04/board-game-setup.jpg" alt="Staff pick">
<div class="staff-card__body">
<div class="staff-card__label">Board Game Curator</div>
<p class="staff-card__quote">"The texture of these boards is unmatched in modern gaming. Every component speaks to the care put into the design."</p>
<div class="staff-card__author">— Kieran S., Board Game Lead</div>
</div>
</div>
<div class="staff-card">
<img class="staff-card__img" src="https://camcom.dev/wp-content/uploads/2026/04/figurines-miniatures.jpg" alt="Staff pick">
<div class="staff-card__body">
<div class="staff-card__label">Miniatures Lead</div>
<p class="staff-card__quote">"A beginner's gateway into the deepest lore in hobby history. This set has everything you need to get started."</p>
<div class="staff-card__author">— Marcus T., Miniatures Lead</div>
</div>
</div>
<div class="staff-card">
<img class="staff-card__img" src="https://camcom.dev/wp-content/uploads/2026/04/trading-cards-playing.jpg" alt="Staff pick">
<div class="staff-card__body">
<div class="staff-card__label">TCG Archivist</div>
<p class="staff-card__quote">"The artwork on the new Umbreon card stopped my heart. A must-have for any Eeveelution collector."</p>
<div class="staff-card__author">— Jordan C., TCG Specialist</div>
</div>
</div>
</div>
</div>
</section>
<section class="explore">
<div class="explore__inner">
<div class="section-header">
<h2 class="section-title">Explore by Game</h2>
</div>
<div class="game-strip">
<div class="game-chip">
<img src="https://camcom.dev/wp-content/uploads/2026/04/product-pokemon-etb.jpg" alt="Pokemon">
<span class="game-chip__label">Pokémon TCG</span>
</div>
<div class="game-chip">
<img src="https://camcom.dev/wp-content/uploads/2026/04/trading-cards-mtg.jpg" alt="MTG">
<span class="game-chip__label">Magic</span>
</div>
<div class="game-chip">
<img src="https://camcom.dev/wp-content/uploads/2026/04/trading-cards-pokemon-stack.jpg" alt="Lorcana">
<span class="game-chip__label">Lorcana</span>
</div>
<div class="game-chip">
<img src="https://camcom.dev/wp-content/uploads/2026/04/board-game-setup.jpg" alt="Board Games">
<span class="game-chip__label">Board Games</span>
</div>
<div class="game-chip">
<img src="https://camcom.dev/wp-content/uploads/2026/04/figurines-miniatures.jpg" alt="Warhammer">
<span class="game-chip__label">Warhammer</span>
</div>
<div class="game-chip">
<img src="https://camcom.dev/wp-content/uploads/2026/04/gaming-controller.jpg" alt="Accessories">
<span class="game-chip__label">Accessories</span>
</div>
</div>
</div>
</section>
<section class="events">
<div class="events__inner">
<div class="section-header">
<h2 class="section-title">This week at the shop</h2>
<a href="#" class="section-link">Live Schedule →</a>
</div>
<div class="events-grid">
<div class="event-card">
<div class="event-card__date">
<span class="event-card__day">15</span>
<span class="event-card__month">Apr</span>
</div>
<div>
<div class="event-card__name">Friday Night Magic</div>
<div class="event-card__desc">Standard format tournament. Beginner friendly. All skill levels welcome. All ages OK. Prizes for top 4 participants.</div>
<a href="#" class="event-card__btn">Book a Spot</a>
</div>
</div>
<div class="event-card">
<div class="event-card__date">
<span class="event-card__day">16</span>
<span class="event-card__month">Apr</span>
</div>
<div>
<div class="event-card__name">Pokémon League</div>
<div class="event-card__desc">Earn League Points and exclusive promos. Free play and trading. Exclusive League points for participants. All ages.</div>
<a href="#" class="event-card__btn">Register Free</a>
</div>
</div>
</div>
</div>
</section>
<section class="editorial-block" style="padding-bottom: 64px; padding-top: 0;">
<div class="editorial-block__inner">
<img class="editorial-block__img" src="https://camcom.dev/wp-content/uploads/2026/04/product-pokemon-etb.jpg" alt="Editorial">
<div class="editorial-block__content">
<div class="editorial-block__eyebrow">Roof Five Archive</div>
<h2 class="editorial-block__title">Pokémon Prismatic Evolutions — The Complete Guide</h2>
<p class="editorial-block__desc">Discover every secret rare, holographic variant, and special illustration in the year's most anticipated set. Our curatorial team has documented every card for the archival record.</p>
<a href="#" class="btn--green">Explore the Set</a>
</div>
</div>
</section>
<section class="blog">
<div class="blog__inner">
<div class="section-header">
<div>
<div class="section-eyebrow">Nerdworks Editorial</div>
<h2 class="section-title">From the Counter</h2>
</div>
</div>
<div class="article-grid">
<div class="article-card">
<img class="article-card__img" src="https://camcom.dev/wp-content/uploads/2026/04/board-game-setup.jpg" alt="Article">
<div class="article-card__body">
<div class="article-card__tag">Strategy Guide</div>
<h3 class="article-card__title">Building competitive decks on a budget this season</h3>
<p class="article-card__excerpt">You don't need to drop a thousand pounds to compete. We break the budget building strategies for this format.</p>
</div>
</div>
<div class="article-card">
<img class="article-card__img" src="https://camcom.dev/wp-content/uploads/2026/04/trading-cards-pokemon-stack.jpg" alt="Article">
<div class="article-card__body">
<div class="article-card__tag">New Release</div>
<h3 class="article-card__title">Everything you need to know about Prismatic Evolutions</h3>
<p class="article-card__excerpt">From pull rates to rare variants, this is the definitive guide to the biggest Pokémon set in years.</p>
</div>
</div>
<div class="article-card">
<img class="article-card__img" src="https://camcom.dev/wp-content/uploads/2026/04/trading-cards-playing.jpg" alt="Article">
<div class="article-card__body">
<div class="article-card__tag">Community</div>
<h3 class="article-card__title">Friday Night Magic: A Beginner's Survival Guide</h3>
<p class="article-card__excerpt">Nervous about your first tournament? We asked our regulars for the advice they wish someone had given them.</p>
</div>
</div>
</div>
</div>
</section>
<section class="newsletter">
<div class="newsletter__inner">
<div>
<h2 class="newsletter__title">Join the Nerdworks community</h2>
<p class="newsletter__subtitle">Get the first word on new archival arrivals, restock alerts, and exclusive audit registrations directly in your inbox.</p>
</div>
<div class="newsletter__form">
<input class="newsletter__input" type="email" placeholder="Your email address">
<button class="newsletter__btn">Sign Up</button>
</div>
</div>
</section>
<footer class="footer">
<div class="footer__inner">
<div class="footer__top">
<div class="footer__logo"><span class="nerd">NERD</span><span class="works">WORKS</span></div>
<div class="footer__col">
<div class="footer__col-title">Shop</div>
<a href="#">New Arrivals</a>
<a href="#">The Vault</a>
<a href="#">Board Games</a>
<a href="#">Miniatures</a>
</div>
<div class="footer__col">
<div class="footer__col-title">Community</div>
<a href="#">Events</a>
<a href="#">League Play</a>
<a href="#">Newsletter</a>
<a href="#">Discord</a>
</div>
<div class="footer__col">
<div class="footer__col-title">Info</div>
<a href="#">About Us</a>
<a href="#">Blog</a>
<a href="#">Store Hours</a>
<a href="#">Contact</a>
</div>
<div class="footer__col">
<div class="footer__col-title">Help</div>
<a href="#">Shipping</a>
<a href="#">Returns</a>
<a href="#">FAQ</a>
<a href="#">Track Order</a>
</div>
</div>
<div class="footer__bottom">
<span class="footer__copy">© 2026 Nerdworks. All rights reserved.</span>
<span class="footer__copy">Privacy · Terms · Accessibility</span>
</div>
</div>
</footer>
</body>
</html>