/wire-template.
<!DOCTYPE html>
<?xml encoding="utf-8"?><?xml encoding="utf-8"?><?xml encoding="utf-8"?><?xml encoding="utf-8"?><?xml encoding="utf-8"?><?xml encoding="utf-8"?><?xml encoding="utf-8"?><?xml encoding="utf-8"?><?xml encoding="utf-8"?><?xml encoding="utf-8"?><?xml encoding="utf-8"?><html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Lightsaber Guides & Tips — The Blog — ARTSABERS</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=Manrope:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&family=Orbitron:wght@400;500;600;700;800&family=Onest:wght@400;500;600;700&display=swap" rel="stylesheet">
<style>:root {
/* Ember ombre (chromatic — accents only) */
--ember-glow: #FFB347;
--ember-bright: #FF9540;
--ember: #FF7A2E;
--ember-forge: #E85D18;
--ember-deep: #D14810;
--ember-smoulder: #8B2E08;
--ember-scar: #5A1A00;
--ember-fixed: #2A0800;
/* Hull ladder (chromatic — dark greys) */
--carbon: #060606;
--void: #0A0A0A;
--charcoal: #141414;
--charcoal-warm: #161412;
--hull-panel: #1A1A1A;
--hull-panel-lift: #242424;
--hull-panel-dark: #0F0F0F;
--hull-chrome-shadow: #2E2E2E;
--hull-edge: #363636;
/* Chrome highlights (chromatic — whites) */
--chrome-highlight: #FAFAFA;
--chrome-glint: #E8E4DD;
--chrome-warm: #F5F0E8;
--chrome-dim: #B8B0A6;
/* Surface semantics (role names — for backgrounds + text) */
--bg-page: var(--carbon);
--bg-hero: var(--carbon);
--bg-body: var(--carbon);
--bg-card: var(--hull-panel);
--bg-card-lift: var(--hull-panel-lift);
--bg-nav: var(--carbon);
--bg-footer: var(--carbon);
--bg-chip: rgba(255, 122, 46, 0.08);
--bg-avatar: var(--hull-panel-lift);
--bg-section: var(--charcoal);
--bg-section-warm: var(--charcoal-warm);
--text-heading: var(--chrome-highlight);
--text-body: var(--chrome-warm);
--text-meta: var(--chrome-dim);
--text-on-ember: var(--ember-fixed);
--border-panel-top: rgba(250, 250, 250, 0.30);
--border-hairline: rgba(255, 122, 46, 0.70);
--border-ghost: rgba(184, 176, 166, 0.15);
/* Type */
--font-display: 'Orbitron', system-ui, sans-serif;
--font-body: 'Onest', system-ui, sans-serif;
/* Shadow tokens */
--panel-lift: inset 0 1px 0 rgba(250, 250, 250, 0.08), 0 8px 24px -8px rgba(0, 0, 0, 0.9);
--ember-glow-sm: 0 0 16px rgba(255, 122, 46, 0.35);
--ember-glow-md: 0 0 32px rgba(255, 122, 46, 0.55);
--ember-seam-glow: 0 0 24px rgba(255, 122, 46, 0.40);
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html, body {
background: var(--bg-page);
color: var(--text-body);
font-family: var(--font-body);
font-size: 16px;
line-height: 1.55;
-webkit-font-smoothing: antialiased;
}
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
/* -------------------- SITE NAV -------------------- */
.site-nav {
background: var(--bg-nav);
border-bottom: 1px solid rgba(250, 250, 250, 0.04);
box-shadow: inset 0 1px 0 rgba(250, 250, 250, 0.06);
position: relative;
z-index: 10;
}
.site-nav__inner {
max-width: 1360px;
margin: 0 auto;
padding: 22px 40px;
display: flex;
align-items: center;
justify-content: space-between;
gap: 40px;
}
.site-nav__brand {
font-family: var(--font-display);
font-weight: 700;
font-size: 20px;
letter-spacing: 0.18em;
text-transform: uppercase;
color: var(--chrome-highlight);
}
.site-nav__brand-mark {
color: var(--ember);
}
.site-nav__links {
display: flex;
align-items: center;
gap: 32px;
list-style: none;
}
.site-nav__link {
font-family: var(--font-display);
font-size: 12px;
font-weight: 500;
letter-spacing: 0.14em;
text-transform: uppercase;
color: var(--chrome-warm);
padding: 6px 0;
border-bottom: 1px solid transparent;
transition: color 0.2s ease, border-color 0.2s ease;
}
.site-nav__link:hover {
color: var(--chrome-highlight);
border-bottom-color: var(--ember);
}
.site-nav__actions {
display: flex;
align-items: center;
gap: 20px;
font-family: var(--font-display);
font-size: 12px;
font-weight: 500;
letter-spacing: 0.14em;
text-transform: uppercase;
color: var(--chrome-dim);
}
.site-nav__action-cart {
color: var(--chrome-highlight);
}
.site-nav__action-badge {
display: inline-block;
margin-left: 6px;
padding: 2px 6px;
background: var(--ember);
color: var(--ember-fixed);
font-family: var(--font-display);
font-size: 10px;
font-weight: 700;
letter-spacing: 0.06em;
}
/* -------------------- CATEGORY HERO — panel-joint pattern, ~460px -------------------- */
.category-hero {
background: var(--bg-hero);
position: relative;
overflow: hidden;
min-height: 460px;
display: flex;
align-items: center;
border-bottom: 1px solid rgba(255, 122, 46, 0.50);
box-shadow: 0 8px 32px -8px rgba(255, 122, 46, 0.30);
}
.category-hero::before {
/* Panel-joint hairline pattern — subtle horizontal seams */
content: "";
position: absolute;
inset: 0;
background-image:
linear-gradient(180deg, transparent 0%, transparent calc(28% - 1px), rgba(250, 250, 250, 0.05) 28%, transparent calc(28% + 1px)),
linear-gradient(180deg, transparent 0%, transparent calc(62% - 1px), rgba(250, 250, 250, 0.04) 62%, transparent calc(62% + 1px)),
linear-gradient(180deg, transparent 0%, transparent calc(84% - 1px), rgba(250, 250, 250, 0.03) 84%, transparent calc(84% + 1px));
pointer-events: none;
}
.category-hero::after {
/* Warm ember bleed from left edge — reactor glow behind hull */
content: "";
position: absolute;
top: 0;
bottom: 0;
left: 0;
width: 40%;
background: radial-gradient(ellipse at 0% 50%, rgba(255, 122, 46, 0.12) 0%, transparent 70%);
pointer-events: none;
}
.category-hero__inner {
max-width: 1200px;
margin: 0 auto;
padding: 72px 40px 64px;
position: relative;
z-index: 2;
width: 100%;
}
.category-hero__breadcrumb {
font-family: var(--font-display);
font-size: 12px;
font-weight: 500;
letter-spacing: 0.14em;
text-transform: uppercase;
color: var(--chrome-dim);
margin-bottom: 22px;
display: flex;
align-items: center;
gap: 10px;
}
.category-hero__breadcrumb a {
color: var(--chrome-dim);
transition: color 0.2s ease;
}
.category-hero__breadcrumb a:hover {
color: var(--chrome-warm);
}
.category-hero__breadcrumb-sep {
color: var(--chrome-dim);
opacity: 0.5;
}
.category-hero__breadcrumb-current {
color: var(--ember);
}
.category-hero__eyebrow {
display: inline-flex;
align-items: center;
gap: 10px;
margin-bottom: 22px;
font-family: var(--font-display);
font-size: 11px;
font-weight: 600;
letter-spacing: 0.20em;
text-transform: uppercase;
color: var(--ember);
border-left: 2px solid var(--ember);
padding-left: 14px;
}
.category-hero__title {
font-family: var(--font-display);
font-size: 68px;
font-weight: 700;
line-height: 1.02;
letter-spacing: 0.8px;
color: var(--chrome-highlight);
margin-bottom: 20px;
max-width: 22ch;
}
.category-hero__subtitle {
font-family: var(--font-body);
font-size: 19px;
font-weight: 400;
line-height: 1.5;
color: var(--chrome-warm);
max-width: 62ch;
margin-bottom: 26px;
}
.category-hero__meta {
padding-top: 20px;
border-top: 1px solid rgba(250, 250, 250, 0.06);
max-width: 62ch;
font-family: var(--font-display);
font-size: 12px;
font-weight: 500;
letter-spacing: 0.14em;
text-transform: uppercase;
color: var(--chrome-dim);
display: flex;
align-items: center;
gap: 12px;
}
.category-hero__meta-count {
color: var(--chrome-warm);
}
.category-hero__meta-sep {
color: var(--chrome-dim);
opacity: 0.5;
}
/* -------------------- CATEGORY FILTER CHIP ROW -------------------- */
.category-filter {
background: var(--bg-section);
padding: 28px 40px;
border-bottom: 1px solid rgba(250, 250, 250, 0.04);
position: relative;
box-shadow: inset 0 1px 0 rgba(250, 250, 250, 0.03);
}
.category-filter__inner {
max-width: 1200px;
margin: 0 auto;
display: flex;
align-items: center;
gap: 20px;
flex-wrap: wrap;
}
.category-filter__label {
font-family: var(--font-display);
font-size: 11px;
font-weight: 500;
letter-spacing: 0.18em;
text-transform: uppercase;
color: var(--chrome-dim);
}
.category-filter__list {
display: flex;
flex-wrap: wrap;
gap: 10px;
list-style: none;
}
.category-filter__chip {
display: inline-flex;
align-items: center;
gap: 8px;
padding: 10px 16px;
background: transparent;
color: var(--chrome-warm);
font-family: var(--font-display);
font-size: 12px;
font-weight: 500;
letter-spacing: 0.12em;
text-transform: uppercase;
border: 1px solid rgba(184, 176, 166, 0.18);
transition: border-color 0.2s ease, background 0.2s ease, color 0.2s ease;
}
.category-filter__chip:hover {
border-color: rgba(255, 122, 46, 0.50);
color: var(--chrome-highlight);
}
.category-filter__chip-count {
color: var(--chrome-dim);
font-size: 11px;
font-weight: 500;
}
.category-filter__chip--active {
border-color: var(--ember);
background: rgba(232, 93, 24, 0.10);
color: var(--chrome-highlight);
box-shadow: inset 0 1px 0 rgba(250, 250, 250, 0.08), 0 0 16px rgba(255, 122, 46, 0.20);
}
.category-filter__chip--active .category-filter__chip-count {
color: var(--ember);
}
/* -------------------- BLOG GRID SECTION -------------------- */
.blog-grid {
padding: 80px 40px 40px;
background: var(--bg-page);
}
.blog-grid__inner {
max-width: 1200px;
margin: 0 auto;
}
.blog-grid__header {
margin-bottom: 44px;
}
.blog-grid__eyebrow {
font-family: var(--font-display);
font-size: 11px;
font-weight: 600;
letter-spacing: 0.20em;
text-transform: uppercase;
color: var(--ember);
margin-bottom: 14px;
display: flex;
align-items: center;
gap: 12px;
}
.blog-grid__eyebrow::before {
content: "";
display: inline-block;
width: 24px;
height: 1px;
background: var(--ember);
box-shadow: 0 0 8px rgba(255, 122, 46, 0.60);
}
.blog-grid__title {
font-family: var(--font-display);
font-size: 34px;
font-weight: 700;
line-height: 1.15;
letter-spacing: 0.8px;
color: var(--chrome-highlight);
margin-bottom: 10px;
max-width: 26ch;
}
.blog-grid__lede {
font-family: var(--font-body);
font-size: 16px;
color: var(--chrome-dim);
max-width: 56ch;
}
.blog-grid__grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 28px;
}
/* Post card — reuse of related-card block (MAS64 catalogue) */
.post-card {
background: var(--bg-card);
box-shadow: var(--panel-lift);
position: relative;
overflow: hidden;
display: flex;
flex-direction: column;
transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.post-card::before {
content: "";
position: absolute;
top: 0;
left: 0;
right: 0;
height: 1px;
background: rgba(250, 250, 250, 0.32);
z-index: 3;
}
.post-card:hover {
transform: translateY(-2px);
box-shadow: inset 0 1px 0 rgba(250, 250, 250, 0.14), 0 12px 32px -8px rgba(0, 0, 0, 0.95), 0 0 20px rgba(255, 122, 46, 0.10);
}
.post-card__media {
position: relative;
aspect-ratio: 4 / 3;
overflow: hidden;
background: var(--hull-panel-dark);
}
.post-card__image {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 0.4s ease;
}
.post-card:hover .post-card__image { transform: scale(1.03); }
.post-card__media::after {
content: "";
position: absolute;
inset: 0;
background: linear-gradient(180deg, transparent 60%, rgba(6, 6, 6, 0.65) 100%);
pointer-events: none;
}
.post-card__body {
padding: 22px 24px 26px;
display: flex;
flex-direction: column;
gap: 14px;
flex: 1;
}
.post-card__chip {
display: inline-flex;
align-self: flex-start;
padding: 5px 10px;
font-family: var(--font-display);
font-size: 10px;
font-weight: 600;
letter-spacing: 0.16em;
text-transform: uppercase;
color: var(--ember);
border: 1px solid rgba(255, 122, 46, 0.40);
background: rgba(255, 122, 46, 0.05);
}
.post-card__title {
font-family: var(--font-display);
font-size: 19px;
font-weight: 600;
line-height: 1.28;
color: var(--chrome-highlight);
margin-top: 2px; letter-spacing: 0.8px; }
.post-card__excerpt {
font-family: var(--font-body);
font-size: 14px;
line-height: 1.55;
color: var(--chrome-warm);
}
.post-card__meta {
font-family: var(--font-display);
font-size: 11px;
font-weight: 500;
letter-spacing: 0.14em;
text-transform: uppercase;
color: var(--chrome-dim);
margin-top: auto;
padding-top: 8px;
border-top: 1px solid rgba(184, 176, 166, 0.10);
display: flex;
align-items: center;
gap: 10px;
justify-content: space-between;
}
.post-card__meta-date {
display: inline-flex;
align-items: center;
gap: 8px;
}
.post-card__meta-date::before {
content: "";
display: inline-block;
width: 4px;
height: 4px;
background: var(--ember);
border-radius: 50%;
box-shadow: 0 0 8px rgba(255, 122, 46, 0.50);
}
.post-card__meta-read {
color: var(--chrome-warm);
}
.post-card__cta {
font-family: var(--font-display);
font-size: 12px;
font-weight: 600;
letter-spacing: 0.14em;
text-transform: uppercase;
color: var(--ember);
display: inline-flex;
align-items: center;
gap: 8px;
padding-top: 6px;
}
/* -------------------- EMPTY STATE SIGNAL -------------------- */
.empty-state {
padding: 60px 40px 100px;
background: var(--bg-page);
}
.empty-state__inner {
max-width: 780px;
margin: 0 auto;
text-align: center;
}
.empty-state__hairline {
height: 1px;
background: linear-gradient(90deg, transparent 0%, var(--ember) 20%, var(--ember-glow) 50%, var(--ember) 80%, transparent 100%);
box-shadow: 0 0 12px rgba(255, 122, 46, 0.50);
margin-bottom: 48px;
}
.empty-state__eyebrow {
font-family: var(--font-display);
font-size: 11px;
font-weight: 600;
letter-spacing: 0.20em;
text-transform: uppercase;
color: var(--chrome-dim);
margin-bottom: 16px;
}
.empty-state__title {
font-family: var(--font-display);
font-size: 26px;
font-weight: 700;
line-height: 1.2;
letter-spacing: 0.8px;
color: var(--chrome-highlight);
margin-bottom: 14px;
}
.empty-state__body {
font-family: var(--font-body);
font-size: 16px;
line-height: 1.6;
color: var(--chrome-warm);
margin-bottom: 34px;
max-width: 58ch;
margin-left: auto;
margin-right: auto;
}
.empty-state__actions {
display: flex;
gap: 16px;
justify-content: center;
flex-wrap: wrap;
}
.empty-state__cta {
display: inline-flex;
align-items: center;
gap: 10px;
padding: 14px 26px;
font-family: var(--font-display);
font-size: 12px;
font-weight: 600;
letter-spacing: 0.14em;
text-transform: uppercase;
color: var(--ember);
border: 1px solid rgba(255, 122, 46, 0.50);
background: transparent;
transition: background 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, color 0.2s ease;
}
.empty-state__cta:hover {
background: rgba(255, 122, 46, 0.06);
border-color: var(--ember);
color: var(--chrome-highlight);
box-shadow: 0 0 20px rgba(255, 122, 46, 0.25);
}
.empty-state__cta-arrow {
font-size: 14px;
}
/* -------------------- NEWSLETTER CAPTURE BAND -------------------- */
.newsletter {
background: var(--bg-hero);
padding: 88px 40px 96px;
position: relative;
overflow: hidden;
border-top: 1px solid rgba(255, 122, 46, 0.30);
border-bottom: 1px solid rgba(255, 122, 46, 0.30);
box-shadow: inset 0 8px 32px -12px rgba(255, 122, 46, 0.30), inset 0 -8px 32px -12px rgba(255, 122, 46, 0.30);
}
.newsletter::before {
content: "";
position: absolute;
inset: 0;
background-image:
linear-gradient(180deg, transparent 0%, transparent calc(28% - 1px), rgba(250, 250, 250, 0.05) 28%, transparent calc(28% + 1px)),
linear-gradient(180deg, transparent 0%, transparent calc(62% - 1px), rgba(250, 250, 250, 0.04) 62%, transparent calc(62% + 1px)),
linear-gradient(180deg, transparent 0%, transparent calc(84% - 1px), rgba(250, 250, 250, 0.03) 84%, transparent calc(84% + 1px));
pointer-events: none;
}
.newsletter::after {
content: "";
position: absolute;
top: 0;
bottom: 0;
right: 0;
width: 45%;
background: radial-gradient(ellipse at 100% 50%, rgba(255, 122, 46, 0.14) 0%, transparent 70%);
pointer-events: none;
}
.newsletter__inner {
max-width: 1000px;
margin: 0 auto;
position: relative;
z-index: 2;
display: grid;
grid-template-columns: 1.1fr 1fr;
gap: 56px;
align-items: center;
}
.newsletter__eyebrow {
font-family: var(--font-display);
font-size: 11px;
font-weight: 600;
letter-spacing: 0.22em;
text-transform: uppercase;
color: var(--ember);
margin-bottom: 16px;
display: flex;
align-items: center;
gap: 12px;
}
.newsletter__eyebrow::before {
content: "";
width: 24px;
height: 1px;
background: var(--ember);
box-shadow: 0 0 8px rgba(255, 122, 46, 0.60);
}
.newsletter__title {
font-family: var(--font-display);
font-size: 36px;
font-weight: 700;
line-height: 1.12;
letter-spacing: 0.8px;
color: var(--chrome-highlight);
margin-bottom: 16px;
max-width: 20ch;
}
.newsletter__body {
font-family: var(--font-body);
font-size: 16px;
color: var(--chrome-warm);
max-width: 46ch;
line-height: 1.55;
}
.newsletter__form {
display: flex;
flex-direction: column;
gap: 18px;
}
.newsletter__field-label {
font-family: var(--font-display);
font-size: 11px;
font-weight: 500;
letter-spacing: 0.18em;
text-transform: uppercase;
color: var(--chrome-dim);
}
.newsletter__input {
background: transparent;
border: none;
border-bottom: 1px solid var(--hull-panel-lift);
padding: 12px 0;
font-family: var(--font-body);
font-size: 16px;
color: var(--chrome-warm);
outline: none;
transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.newsletter__input::placeholder {
color: var(--chrome-dim);
opacity: 0.6;
}
.newsletter__input:focus {
border-bottom-color: var(--ember);
box-shadow: 0 4px 12px -8px rgba(255, 122, 46, 0.60);
}
.newsletter__submit {
align-self: flex-start;
margin-top: 6px;
padding: 14px 28px;
background: transparent;
border: 1px solid rgba(255, 122, 46, 0.50);
font-family: var(--font-display);
font-size: 12px;
font-weight: 600;
letter-spacing: 0.14em;
text-transform: uppercase;
color: var(--ember);
cursor: pointer;
transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
}
.newsletter__submit:hover {
background: rgba(255, 122, 46, 0.08);
border-color: var(--ember);
color: var(--chrome-highlight);
box-shadow: 0 0 20px rgba(255, 122, 46, 0.30);
}
.newsletter__consent {
font-family: var(--font-body);
font-size: 12px;
color: var(--chrome-dim);
line-height: 1.5;
margin-top: 4px;
}
/* -------------------- SITE FOOTER -------------------- */
.site-footer {
background: var(--bg-footer);
padding: 72px 40px 40px;
position: relative;
border-top: 1px solid rgba(255, 122, 46, 0.30);
box-shadow: 0 -8px 24px -8px rgba(255, 122, 46, 0.20);
}
.site-footer::before {
content: "";
position: absolute;
top: 0;
left: 0;
right: 0;
height: 1px;
background: linear-gradient(90deg, transparent 0%, var(--ember) 30%, var(--ember-glow) 50%, var(--ember) 70%, transparent 100%);
opacity: 0.7;
}
.site-footer__inner {
max-width: 1200px;
margin: 0 auto;
}
.site-footer__grid {
display: grid;
grid-template-columns: 1.4fr 1fr 1fr 1fr;
gap: 60px;
padding-bottom: 48px;
border-bottom: 1px solid rgba(250, 250, 250, 0.05);
}
.site-footer__brand-mark {
font-family: var(--font-display);
font-weight: 700;
font-size: 24px;
letter-spacing: 0.16em;
text-transform: uppercase;
color: var(--chrome-highlight);
margin-bottom: 18px;
}
.site-footer__brand-mark span {
color: var(--ember);
}
.site-footer__brand-blurb {
font-family: var(--font-body);
font-size: 14px;
color: var(--chrome-dim);
line-height: 1.55;
max-width: 32ch;
}
.site-footer__col-title {
font-family: var(--font-display);
font-size: 11px;
font-weight: 600;
letter-spacing: 0.8px;
text-transform: uppercase;
color: var(--chrome-highlight);
margin-bottom: 20px;
}
.site-footer__col ul { list-style: none; }
.site-footer__col li {
font-family: var(--font-body);
font-size: 14px;
color: var(--chrome-dim);
margin-bottom: 12px;
transition: color 0.2s ease;
}
.site-footer__col li:hover { color: var(--chrome-warm); }
.site-footer__legal {
padding-top: 28px;
display: flex;
align-items: center;
justify-content: space-between;
gap: 20px;
font-family: var(--font-display);
font-size: 11px;
letter-spacing: 0.14em;
text-transform: uppercase;
color: var(--chrome-dim);
}
.site-footer__legal-links {
display: flex;
gap: 24px;
list-style: none;
}
/* -------------------- RESPONSIVE -------------------- */
@media (max-width: 900px) {
.site-nav__links { display: none; }
.site-nav__inner { padding: 18px 20px; }
.category-hero { min-height: 380px; }
.category-hero__inner { padding: 56px 24px 44px; }
.category-hero__title { font-size: 42px; letter-spacing: 0.8px; }
.category-hero__subtitle { font-size: 16px; }
.category-filter { padding: 20px 24px; }
.category-filter__inner { gap: 14px; }
.blog-grid { padding: 56px 24px 32px; }
.blog-grid__title { font-size: 26px; letter-spacing: 0.8px; }
.blog-grid__grid { grid-template-columns: 1fr 1fr; gap: 20px; }
.empty-state { padding: 40px 24px 72px; }
.empty-state__title { font-size: 22px; letter-spacing: 0.8px; }
.newsletter { padding: 64px 24px 72px; }
.newsletter__inner { grid-template-columns: 1fr; gap: 32px; }
.newsletter__title { font-size: 28px; letter-spacing: 0.8px; }
.site-footer { padding: 56px 24px 32px; }
.site-footer__grid { grid-template-columns: 1fr 1fr; gap: 40px; }
.site-footer__legal { flex-direction: column; align-items: flex-start; gap: 12px; }
.site-footer__legal-links { flex-wrap: wrap; gap: 16px; }
}
@media (max-width: 480px) {
.site-nav__inner { padding: 16px 20px; }
.site-nav__brand { font-size: 16px; }
.category-hero { min-height: 340px; }
.category-hero__title { font-size: 32px; letter-spacing: 0.8px; }
.category-hero__breadcrumb { font-size: 11px; flex-wrap: wrap; }
.blog-grid__grid { grid-template-columns: 1fr; }
.empty-state__actions { flex-direction: column; align-items: stretch; }
.empty-state__cta { justify-content: center; }
.site-footer__grid { grid-template-columns: 1fr; gap: 32px; }
}
/* =====================================================================
BLOCK: product-feature — inline advert (archive placements)
Non-triggering class name per BBAS18 ad-blocker safety lock.
===================================================================== */
.product-feature {
position: relative;
grid-column: 1 / -1;
width: 100%;
max-width: 1100px;
margin: 32px auto;
padding: 0;
background: var(--charcoal-warm, #161412);
border-top: 1px solid rgba(255,122,46,0.55);
border-bottom: 1px solid rgba(255,122,46,0.55);
box-shadow: 0 -2px 40px rgba(255,122,46,0.18), 0 2px 40px rgba(255,122,46,0.18);
overflow: hidden;
isolation: isolate;
}
.product-feature:hover .product-feature__img { transform: scale(1.03); }
.product-feature__eyebrow::before {
content: "";
display: inline-block;
width: 32px;
height: 1px;
background: #FF7A2E;
box-shadow: 0 0 8px rgba(255,122,46,0.6);
}
.product-feature__review-count::before {
content: "·";
margin-right: 8px;
color: #B8B0A6;
}
.product-feature__specs li {
font-family: 'Space Grotesk', sans-serif;
font-size: 11px;
font-weight: 500;
letter-spacing: 0.16em;
text-transform: uppercase;
color: #E5E2E1;
padding: 6px 12px;
border: 1px solid rgba(184,176,166,0.35);
background: rgba(20,20,20,0.4);
}
.product-feature__pills li {
font-family: 'Space Grotesk', sans-serif;
font-size: 11px;
font-weight: 600;
letter-spacing: 0.18em;
text-transform: uppercase;
color: #FFB347;
padding: 6px 14px;
border: 1px solid rgba(255,122,46,0.4);
background: rgba(255,122,46,0.06);
}
.product-feature__stock::before {
content: "";
width: 9px;
height: 9px;
background: #FF7A2E;
border-radius: 50%;
box-shadow: 0 0 10px rgba(255,122,46,0.7);
}
.product-feature__cta:hover {
background: rgba(255,122,46,0.14);
box-shadow: 0 0 24px rgba(255,122,46,0.35);
color: #FAFAFA;
}
@media (max-width: 720px) {
.product-feature__inner { grid-template-columns: 1fr; }
.product-feature__copy { padding: 28px 24px 32px; }
.product-feature__title { font-size: 22px; letter-spacing: 0.8px; }
.product-feature__actions { flex-wrap: wrap; }
.product-feature__stat-grid { grid-template-columns: 1fr 1fr; gap: 16px; }
.product-feature__stat-value { font-size: 22px; }
.product-feature__badge { top: 12px; left: 12px; font-size: 9px; padding: 6px 10px; }
}
/* orbitron-retrofit: title-em italic kill */
[class*="__title"] em, [class*="__title"] i,
[class*="-title"] em, [class*="-title"] i,
[class*="__heading"] em, [class*="__heading"] i,
[class*="-heading"] em, [class*="-heading"] i { font-style: normal; }
/* -- Reconciled from family 14002 canonical 12840:tf-newsletter-signup -- */
.container { width: 100%; max-width: 1440px; margin: 0 auto; padding: 0 48px; }
/* =========================================================
CAPTURE BAND — full orange ombre (biggest ember moment)
========================================================= */
.capture {
position: relative;
background: linear-gradient(180deg, var(--ember-glow) 0%, var(--ember-bright) 25%, var(--ember) 55%, var(--ember-forge) 100%);
padding: 140px 0;
box-shadow:
inset 0 2px 0 rgba(255,235,180,0.55),
inset 0 -1px 0 rgba(90,26,0,0.55),
0 -12px 40px -8px rgba(255,122,46,0.55);
overflow: hidden;
}
.capture::before {
content: "";
position: absolute;
inset: 0;
background:
radial-gradient(ellipse at 20% 30%, rgba(255,235,180,0.35) 0%, rgba(255,235,180,0) 55%),
radial-gradient(ellipse at 80% 70%, rgba(209,72,16,0.35) 0%, rgba(209,72,16,0) 60%);
pointer-events: none;
}
.capture__inner {
position: relative;
display: grid;
grid-template-columns: 1fr 1fr;
gap: 60px;
align-items: center;
z-index: 2;
}
.capture__copy { max-width: 620px; }
.capture__eyebrow {
font-family: var(--font-display);
font-size: 11px;
font-weight: 600;
letter-spacing: 0.28em;
text-transform: uppercase;
color: var(--on-primary-fixed);
opacity: 0.72;
margin-bottom: 20px;
}
.capture__title {
font-family: var(--font-display);
font-size: clamp(48px, 5.5vw, 78px);
font-weight: 700;
line-height: 0.95;
letter-spacing: 0.8px;
text-transform: uppercase;
color: var(--on-primary-fixed);
margin-bottom: 24px;
}
.capture__sub {
font-family: var(--font-display);
font-size: 20px;
font-weight: 500;
line-height: 1.4;
color: var(--on-primary-fixed);
opacity: 0.86;
max-width: 520px;
}
.capture__form {
display: flex;
flex-direction: column;
gap: 20px;
padding: 44px;
background: rgba(20,20,20,0.94);
box-shadow:
inset 0 1px 0 rgba(250,250,250,0.2),
0 30px 60px -20px rgba(0,0,0,0.7);
}
.capture__form-lbl {
font-family: var(--font-display);
font-size: 11px;
font-weight: 500;
letter-spacing: 0.24em;
text-transform: uppercase;
color: var(--ember-glow);
}
.capture__form-input {
background: transparent;
border: 0;
border-bottom: 1px solid rgba(184,176,166,0.35);
padding: 14px 0;
font-family: var(--font-body);
font-size: 17px;
color: var(--chrome-warm);
outline: none;
transition: border-color 200ms ease, box-shadow 200ms ease;
width: 100%;
}
.capture__form-input::placeholder { color: var(--chrome-dim); opacity: 0.7; }
.capture__form-input:focus {
border-bottom-color: var(--ember);
box-shadow: 0 2px 12px -2px rgba(255,122,46,0.4);
}
.capture__form-cta {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 10px;
padding: 20px 30px;
background: linear-gradient(180deg, var(--ember-glow) 0%, var(--ember) 50%, var(--ember-deep) 100%);
color: var(--on-primary-fixed);
font-family: var(--font-display);
font-size: 12px;
font-weight: 700;
letter-spacing: 0.20em;
text-transform: uppercase;
box-shadow: var(--ember-glow-sm);
transition: box-shadow 200ms ease;
margin-top: 8px;
}
.capture__form-cta:hover { box-shadow: var(--ember-glow-md); }
.capture__form-fine {
font-family: var(--font-body);
font-size: 12px;
color: var(--chrome-dim);
line-height: 1.5;
}
@media (max-width: 640px) {
.container { padding: 0 24px; }
.promo-bar__inner { gap: 16px; font-size: 10px; }
.promo-bar__item { gap: 16px; }
.hero__telemetry-row { flex-wrap: wrap; gap: 20px; }
.hero__tagline { display: none; }
.trust-bar__row { grid-template-columns: 1fr 1fr; row-gap: 24px; }
.trust-bar__cell { border-right: 0; padding: 4px 12px; }
.saber-core__grid { grid-template-columns: 1fr; }
.faction-grid { grid-template-columns: 1fr; }
.faction-tile { height: 340px; }
.section-head { flex-direction: column; align-items: flex-start; gap: 24px; }
.section-head__right { text-align: left; }
.capture { padding: 90px 0; }
.site-footer__grid { grid-template-columns: 1fr; gap: 40px; }
.site-footer__base { flex-direction: column; align-items: flex-start; gap: 20px; }
}
/* -- Reconciled from family 14015 canonical 13184:tf-cross-sell-strip-1 -- */
/* =====================================================================
BLOCK: product-feature — inline advert (long-form only)
Product variant shown here. Variant classes: --product, --category, --newsletter, --promotion.
===================================================================== */
.product-feature {
/* Break out of the article's reading column and centre on the viewport.
Reading column max-width is ~68ch (~660px); the block wants 1100px. */
position: relative;
width: min(1100px, calc(100vw - 48px));
margin-left: 50%;
margin-right: 0;
margin-top: 120px;
margin-bottom: 120px;
transform: translateX(-50%);
padding: 0;
background: var(--charcoal-warm, #161412);
border-top: 1px solid rgba(255,122,46,0.55);
border-bottom: 1px solid rgba(255,122,46,0.55);
box-shadow: 0 -2px 40px rgba(255,122,46,0.18), 0 2px 40px rgba(255,122,46,0.18);
overflow: hidden;
isolation: isolate;
}
.product-feature__inner {
position: relative;
z-index: 2;
display: grid;
grid-template-columns: 380px 1fr;
gap: 0;
align-items: stretch;
}
.product-feature__media {
position: relative;
background: #0a0a0a;
overflow: hidden;
min-width: 0;
min-height: 100%;
}
.product-feature__img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
transition: transform 0.4s ease;
}
.product-feature:hover .product-feature__img { transform: scale(1.03); }
.product-feature__copy {
padding: 48px 52px 48px 48px;
display: flex;
flex-direction: column;
justify-content: center;
gap: 16px;
}
.product-feature__eyebrow {
font-family: var(--font-display, 'Space Grotesk', sans-serif);
font-size: 13px;
font-weight: 600;
letter-spacing: 0.24em;
text-transform: uppercase;
color: var(--ember-glow, #FFB347);
margin: 0;
display: inline-flex;
align-items: center;
gap: 12px;
text-shadow: 0 0 20px rgba(255,122,46,0.35);
}
.product-feature__eyebrow::before {
content: "";
display: inline-block;
width: 32px;
height: 1px;
background: var(--ember, #FF7A2E);
box-shadow: 0 0 8px rgba(255,122,46,0.6);
}
.product-feature__title {
font-family: var(--font-display, 'Space Grotesk', sans-serif);
font-size: 30px;
font-weight: 500;
line-height: 1.12;
letter-spacing: 0.8px;
color: var(--chrome-highlight, #FAFAFA);
margin: 0;
}
.product-feature__lede {
font-family: var(--font-body, 'Manrope', sans-serif);
font-size: 16px;
line-height: 1.55;
color: var(--chrome-warm, #E5E2E1);
margin: 0;
opacity: 0.9;
}
.product-feature__actions {
display: flex;
align-items: center;
gap: 20px;
margin-top: 6px;
}
.product-feature__price {
font-family: var(--font-display, 'Space Grotesk', sans-serif);
font-size: 22px;
font-weight: 500;
color: var(--ember, #FF7A2E);
letter-spacing: 0.01em;
}
.product-feature__cta {
font-family: var(--font-display, 'Space Grotesk', sans-serif);
font-size: 12px;
font-weight: 600;
letter-spacing: 0.16em;
text-transform: uppercase;
color: var(--chrome-warm, #E5E2E1);
text-decoration: none;
padding: 12px 22px;
border: 1px solid rgba(255,122,46,0.55);
background: rgba(255,122,46,0.06);
transition: background 0.2s, box-shadow 0.2s, color 0.2s;
display: inline-flex;
align-items: center;
gap: 6px;
}
.product-feature__cta:hover {
background: rgba(255,122,46,0.14);
box-shadow: 0 0 24px rgba(255,122,46,0.35);
color: var(--chrome-highlight, #FAFAFA);
}
.product-feature__bloom {
position: absolute;
z-index: 1;
right: -140px;
bottom: -140px;
width: 420px;
height: 420px;
background: radial-gradient(circle, rgba(255,179,71,0.16) 0%, rgba(255,122,46,0.08) 35%, transparent 68%);
filter: blur(12px);
pointer-events: none;
}
.product-feature__bloom--tl {
right: auto;
bottom: auto;
left: -100px;
top: -100px;
width: 380px;
height: 380px;
background: radial-gradient(circle, rgba(255,179,71,0.28) 0%, rgba(255,122,46,0.14) 30%, transparent 65%);
}
/* Enrichment elements — badge, rating, specs, stock, enhanced CTA */
.product-feature__media { position: relative; }
.product-feature__badge {
position: absolute;
top: 20px;
left: 20px;
padding: 8px 14px;
border: 1px solid rgba(255,122,46,0.85);
background: rgba(6,6,6,0.85);
backdrop-filter: blur(4px);
color: var(--ember-glow, #FFB347);
font-family: 'Space Grotesk', sans-serif;
font-size: 10px;
font-weight: 600;
letter-spacing: 0.22em;
text-transform: uppercase;
z-index: 3;
text-shadow: 0 0 12px rgba(255,122,46,0.4);
}
.product-feature__rating {
display: flex;
align-items: center;
gap: 10px;
margin: -2px 0;
}
.product-feature__stars {
color: var(--ember, #FF7A2E);
font-size: 16px;
letter-spacing: 0.05em;
text-shadow: 0 0 12px rgba(255,122,46,0.35);
}
.product-feature__rating-value {
font-family: 'Space Grotesk', sans-serif;
font-size: 14px;
font-weight: 600;
color: var(--chrome-highlight, #FAFAFA);
}
.product-feature__review-count {
font-family: 'Manrope', sans-serif;
font-size: 13px;
color: var(--chrome-dim, #B8B0A6);
}
.product-feature__review-count::before {
content: "·";
margin-right: 8px;
color: var(--chrome-dim, #B8B0A6);
}
.product-feature__specs {
display: flex;
flex-wrap: wrap;
gap: 8px;
list-style: none;
margin: 0;
padding: 0;
}
.product-feature__specs li {
font-family: 'Space Grotesk', sans-serif;
font-size: 11px;
font-weight: 500;
letter-spacing: 0.16em;
text-transform: uppercase;
color: var(--chrome-warm, #E5E2E1);
padding: 6px 12px;
border: 1px solid rgba(184,176,166,0.35);
background: rgba(20,20,20,0.4);
}
.product-feature__stock {
display: inline-flex;
align-items: center;
gap: 10px;
font-family: 'Space Grotesk', sans-serif;
font-size: 12px;
font-weight: 600;
letter-spacing: 0.16em;
text-transform: uppercase;
color: var(--ember-glow, #FFB347);
margin-top: 4px;
}
.product-feature__stock::before {
content: "";
width: 9px;
height: 9px;
background: var(--ember, #FF7A2E);
border-radius: 50%;
box-shadow: 0 0 10px rgba(255,122,46,0.7);
}
.product-feature__cta {
font-size: 13px;
padding: 14px 26px;
letter-spacing: 0.18em;
}
.product-feature__actions {
margin-top: 8px;
padding-top: 20px;
border-top: 1px solid rgba(255,122,46,0.25);
}
@media (max-width: 720px) {
.product-feature__inner { grid-template-columns: 1fr; }
.product-feature__media { aspect-ratio: 16 / 9; }
.product-feature__copy { padding: 28px 24px 32px; }
.product-feature__title { font-size: 22px; letter-spacing: 0.8px; }
.product-feature__actions { flex-wrap: wrap; }
.product-feature__specs li { font-size: 10px; padding: 5px 10px; }
.product-feature__badge { top: 12px; left: 12px; font-size: 9px; padding: 6px 10px; }
}
</style>
</head>
<body>
<!-- SITE NAV — MAS64 verbatim -->
<nav class="site-nav" aria-label="Primary">
<div class="site-nav__inner">
<a href="/" class="site-nav__brand">ARTS<span class="site-nav__brand-mark">A</span>BERS</a>
<ul class="site-nav__links">
<li><a href="/lightsabers" class="site-nav__link">Lightsabers</a></li>
<li><a href="/cosplay-helmets" class="site-nav__link">Cosplay Helmets</a></li>
<li><a href="/parts-accessories" class="site-nav__link">Parts & Accessories</a></li>
<li><a href="/offers-deals" class="site-nav__link">Offers & Deals</a></li>
<li><a href="/blog" class="site-nav__link">Blog & News</a></li>
</ul>
<div class="site-nav__actions">
<a href="/account" class="site-nav__action">Account</a>
<a href="/cart" class="site-nav__action site-nav__action-cart">Cart<span class="site-nav__action-badge">0</span></a>
</div>
</div>
</nav>
<!-- CATEGORY HERO — panel-joint pattern, breadcrumb, eyebrow, title, subtitle, post-count meta -->
<a id="tf-hero-utility-1" data-tf-family="hero-utility" style="display:contents"></a>
<header class="category-hero">
<div class="category-hero__inner">
<a id="tf-breadcrumb-1" data-tf-family="breadcrumb" style="display:contents"></a>
<nav class="category-hero__breadcrumb" aria-label="Breadcrumb">
<a href="/blog">The Blog</a>
<span class="category-hero__breadcrumb-sep">/</span>
<span class="category-hero__breadcrumb-current">Lightsaber Guides & Tips</span>
</nav>
<div class="category-hero__eyebrow">Category</div>
<h1 class="category-hero__title">Lightsaber Guides & Tips</h1>
<p class="category-hero__subtitle">Buyer's guides, build breakdowns, and care advice from the workshop bench.</p>
<div class="category-hero__meta">
<span class="category-hero__meta-count">3 posts</span>
<span class="category-hero__meta-sep">·</span>
<span>Sorted newest first</span>
</div>
</div>
</header>
<!-- CATEGORY FILTER CHIP ROW — Lightsaber Guides & Tips active -->
<a id="tf-filter-chip-strip-1" data-tf-family="filter-chip-strip" style="display:contents"></a>
<section class="category-filter" aria-label="Filter by category">
<div class="category-filter__inner">
<div class="category-filter__label">Filter</div>
<ul class="category-filter__list">
<li><a href="/blog" class="category-filter__chip">All <span class="category-filter__chip-count">(12)</span></a></li>
<li><a href="/blog/category/artsabers-news" class="category-filter__chip">ARTSABERS News <span class="category-filter__chip-count">(7)</span></a></li>
<li><a href="/blog/category/lightsaber-guides-tips" class="category-filter__chip category-filter__chip--active" aria-current="page">Lightsaber Guides & Tips <span class="category-filter__chip-count">(3)</span></a></li>
<li><a href="/blog/category/lore-short-stories" class="category-filter__chip">Lore & Short Stories <span class="category-filter__chip-count">(2)</span></a></li>
</ul>
</div>
</section>
<!-- BLOG GRID — IN THIS CATEGORY -->
<a id="tf-other-1" data-tf-family="other" style="display:contents"></a>
<section class="blog-grid" aria-label="Posts in this category">
<div class="blog-grid__inner">
<div class="blog-grid__header">
<div class="blog-grid__eyebrow">In This Category</div>
<h2 class="blog-grid__title">Everything from the guides bench.</h2>
<p class="blog-grid__lede">Sorted by newest first.</p>
</div>
<div class="blog-grid__grid">
<a href="/blog/forged-in-fire-and-beskar" class="post-card">
<div class="post-card__media">
<img class="post-card__image" src="https://artsabers.com/wp-content/uploads/sites/10/2025/03/Mandalorian-Helmet-600x600.jpg" alt="Mandalorian helmet against dark background">
</div>
<div class="post-card__body">
<span class="post-card__chip">Lightsaber Guides & Tips</span>
<h3 class="post-card__title">Forged in Fire and Beskar: Why You Need Both a Saber and a Helmet</h3>
<p class="post-card__excerpt">Building a full Mandalorian kit means matching the blade to the beskar. Here's how helmet weight, saber balance, and duelling grade actually work together — from the workshop bench.</p>
<div class="post-card__meta">
<span class="post-card__meta-date">12 Jun 2026</span>
<span class="post-card__meta-read">8 min read</span>
</div>
<span class="post-card__cta">Read <span aria-hidden="true">→</span></span>
</div>
</a>
<a href="/blog/choosing-your-saber-core" class="post-card">
<div class="post-card__media">
<img class="post-card__image" src="https://artsabers.com/wp-content/uploads/sites/10/2025/03/Apprentice-Black-Duelling-Lightsaber-RGB-X-600x600.jpg" alt="Apprentice Black duelling lightsaber, RGB-X Saber Core">
</div>
<div class="post-card__body">
<span class="post-card__chip">Lightsaber Guides & Tips</span>
<h3 class="post-card__title">Choosing Your Saber Core: Xenopixel V3 vs Proffie 2.2 vs Neopixel</h3>
<p class="post-card__excerpt">Xenopixel is out-of-the-box brilliant, Proffie is endlessly tweakable, and a plain neopixel is quietly the best value in the catalogue. Here's how to pick the Saber Core that fits your build.</p>
<div class="post-card__meta">
<span class="post-card__meta-date">15 May 2026</span>
<span class="post-card__meta-read">6 min read</span>
</div>
<span class="post-card__cta">Read <span aria-hidden="true">→</span></span>
</div>
</a>
<a href="/blog/light-duelling-vs-heavy-duelling" class="post-card">
<div class="post-card__media">
<img class="post-card__image" src="https://artsabers.com/wp-content/uploads/sites/10/2025/03/The-Fighter-Black-Lightsaber-Xenopixel-V3-600x600.jpg" alt="The Fighter Black lightsaber, Xenopixel V3">
</div>
<div class="post-card__body">
<span class="post-card__chip">Lightsaber Guides & Tips</span>
<h3 class="post-card__title">Light-Duelling vs Heavy-Duelling: Which Grade Fits Your Play Style</h3>
<p class="post-card__excerpt">Blade thickness, polycarbonate wall gauge, and hilt weight all shift when you go up a duelling grade. Here's what changes, what it costs, and which grade is genuinely right for how you use your saber.</p>
<div class="post-card__meta">
<span class="post-card__meta-date">3 May 2026</span>
<span class="post-card__meta-read">9 min read</span>
</div>
<span class="post-card__cta">Read <span aria-hidden="true">→</span></span>
</div>
</a>
</div>
</div>
</section>
<!-- EMPTY-STATE SIGNAL — no pagination, 2 CTAs -->
<a id="tf-cross-sell-strip-1" data-tf-family="cross-sell-strip" style="display:contents"></a>
<aside class="product-feature product-feature--product" role="complementary" aria-label="Featured product">
<div class="product-feature__inner">
<div class="product-feature__media">
<img class="product-feature__img" src="https://artsabers.com/wp-content/uploads/sites/10/2025/03/The-Fighter-Black-Lightsaber-Xenopixel-V3-600x600.jpg" alt="The Fighter Black Lightsaber, Xenopixel V3" loading="lazy">
<span class="product-feature__badge">Editor’s Pick</span>
</div>
<div class="product-feature__copy">
<p class="product-feature__eyebrow">Readers also chose</p>
<h3 class="product-feature__title">The Fighter — Xenopixel V3</h3>
<div class="product-feature__rating">
<span class="product-feature__stars" aria-hidden="true">★★★★★</span>
<span class="product-feature__rating-value">4.9</span>
<span class="product-feature__review-count">247 reviews</span>
</div>
<p class="product-feature__lede">Duelling grade certified. Xenopixel core, silver-forged hilt. Made for the collector who fights with what they own.</p>
<ul class="product-feature__specs">
<li>Xenopixel V3 core</li>
<li>32″ blade</li>
<li>Duelling grade</li>
</ul>
<div class="product-feature__stock">In stock · Ships in 24h</div>
<div class="product-feature__actions">
<span class="product-feature__price">$389</span>
<a href="/product/the-fighter-black-lightsaber-xenopixel-v3/" class="product-feature__cta">See The Fighter →</a>
</div>
</div>
</div>
<span class="product-feature__bloom" aria-hidden="true"></span>
</aside>
<a id="tf-empty-state-1" data-tf-family="empty-state" style="display:contents"></a>
<section class="empty-state" aria-label="End of category">
<div class="empty-state__inner">
<div class="empty-state__hairline"></div>
<div class="empty-state__eyebrow">End of Category</div>
<h2 class="empty-state__title">You've reached the end of the category.</h2>
<p class="empty-state__body">More Lightsaber Guides & Tips coming as we build them out — the workshop keeps writing.</p>
<div class="empty-state__actions">
<a href="/blog" class="empty-state__cta">Back to The Blog <span class="empty-state__cta-arrow" aria-hidden="true">→</span></a>
<a href="/blog/category/lore-short-stories" class="empty-state__cta">Read Lore & Short Stories <span class="empty-state__cta-arrow" aria-hidden="true">→</span></a>
</div>
</div>
</section>
<!-- NEWSLETTER CAPTURE BAND -->
<a id="tf-newsletter-signup-1" data-tf-family="newsletter-signup" style="display:contents"></a>
<section class="capture">
<div class="container">
<div class="capture__inner">
<div class="capture__copy">
<div class="capture__eyebrow">◆ Join the comms</div>
<h2 class="capture__title">From factory floor<br>to your inbox.</h2>
<p class="capture__sub">Get 10% off your first saber, plus early access to new drops, ARTSABERS Exclusives, and the workshop pieces that never make it to the public catalogue.</p>
</div>
<div class="capture__form">
<span class="capture__form-lbl">Comms · Signal In</span>
<input class="capture__form-input" type="email" placeholder="your@email.com">
<button class="capture__form-cta">Open the signal →</button>
<span class="capture__form-fine">One drop a week. Unsubscribe with one click. We never share your details.</span>
</div>
</div>
</div>
</section>
<!-- SITE FOOTER — MAS64 verbatim -->
<footer class="site-footer" aria-label="Site footer">
<div class="site-footer__inner">
<div class="site-footer__grid">
<div class="site-footer__col site-footer__col--brand">
<div class="site-footer__brand-mark">ARTS<span>A</span>BERS</div>
<p class="site-footer__brand-blurb">Hundreds of sabers. One trusted retailer. Every character, every Saber Core, every duelling grade — from factory floor to your door.</p>
</div>
<div class="site-footer__col">
<div class="site-footer__col-title">Shop</div>
<ul>
<li><a href="/lightsabers">Lightsabers</a></li>
<li><a href="/cosplay-helmets">Cosplay Helmets</a></li>
<li><a href="/parts-accessories">Parts & Accessories</a></li>
<li><a href="/offers-deals">Offers & Deals</a></li>
<li><a href="/bundles">Bundles</a></li>
</ul>
</div>
<div class="site-footer__col">
<div class="site-footer__col-title">Read</div>
<ul>
<li><a href="/blog">Blog & News</a></li>
<li><a href="/guides">Buying Guides</a></li>
<li><a href="/lore">Lore & Short Stories</a></li>
<li><a href="/about">About ARTSABERS</a></li>
<li><a href="/press">Press</a></li>
</ul>
</div>
<div class="site-footer__col">
<div class="site-footer__col-title">Support</div>
<ul>
<li><a href="/contact">Contact Us</a></li>
<li><a href="/shipping">Shipping & Delivery</a></li>
<li><a href="/returns">Returns & Warranty</a></li>
<li><a href="/track">Track My Order</a></li>
<li><a href="/faq">FAQs</a></li>
</ul>
</div>
</div>
<div class="site-footer__legal">
<div>© 2026 ARTSABERS. All rights reserved.</div>
<ul class="site-footer__legal-links">
<li><a href="/privacy">Privacy</a></li>
<li><a href="/terms">Terms</a></li>
<li><a href="/cookies">Cookies</a></li>
</ul>
</div>
</div>
</footer>
</body>
</html>