[object Object]

← back to CelebritySignatures

front page: Gucci-style Signature Edit hero — No. 001 Abraham Lincoln

f4f874574fc6be251343ac0967a1585c4604ee34 · 2026-09-09 11:01:55 -0700 · Steve

Redesign public/index.html hero into an editorial 'Signature Edit': real
public-domain Lincoln signature (Wikimedia, attributed, links to /a/Q91) +
the 3 real wear blanks (tee/hat/socks) + softened hero-bg. Adds a clearly
labeled AI 'campaign' accent (Lincoln dressed in the products; not a photo).
Preserves all existing hooks (burger/drawer/grid/sort/artistPop/api fetch).
Honors the project's never-invent-a-signature rule. Local only; not deployed.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01U2uvgXWs4FjLd6eDBDNUxP

Files touched

Diff

commit f4f874574fc6be251343ac0967a1585c4604ee34
Author: Steve <steve@designerwallcoverings.com>
Date:   Wed Sep 9 11:01:55 2026 -0700

    front page: Gucci-style Signature Edit hero — No. 001 Abraham Lincoln
    
    Redesign public/index.html hero into an editorial 'Signature Edit': real
    public-domain Lincoln signature (Wikimedia, attributed, links to /a/Q91) +
    the 3 real wear blanks (tee/hat/socks) + softened hero-bg. Adds a clearly
    labeled AI 'campaign' accent (Lincoln dressed in the products; not a photo).
    Preserves all existing hooks (burger/drawer/grid/sort/artistPop/api fetch).
    Honors the project's never-invent-a-signature rule. Local only; not deployed.
    
    Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
    Claude-Session: https://claude.ai/code/session_01U2uvgXWs4FjLd6eDBDNUxP
---
 public/assets/campaign-lincoln.jpg | Bin 0 -> 2291268 bytes
 public/index.html                  |  71 ++++++++++++++++++++++++++++++++++---
 2 files changed, 67 insertions(+), 4 deletions(-)

diff --git a/public/assets/campaign-lincoln.jpg b/public/assets/campaign-lincoln.jpg
new file mode 100644
index 0000000..a495006
Binary files /dev/null and b/public/assets/campaign-lincoln.jpg differ
diff --git a/public/index.html b/public/index.html
index f704ee6..4e3388c 100644
--- a/public/index.html
+++ b/public/index.html
@@ -244,6 +244,38 @@
   .ap-shop a + a { background:#fff; color:var(--ink); }
   .ap-cta { display:flex; flex-wrap:wrap; justify-content:center; gap:10px; }
   @media(max-width:700px){ .shop-actions a { min-height:44px; } .ap-shop a { flex:1; text-align:center; } }
+  /* ── Gucci-style editorial "Signature Edit" hero + campaign accent (front page) ── */
+  .hero--edit .hero-inner { max-width:1080px; padding:56px 24px 44px; text-align:center; position:relative; z-index:2; }
+  .hero--edit .hero-bg { opacity:.07; filter:saturate(.6); }
+  .hero--edit::after { content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
+    background:radial-gradient(ellipse 62% 58% at 50% 42%, rgba(251,250,247,.95), rgba(251,250,247,.55) 60%, rgba(251,250,247,0) 82%); }
+  .edit-kicker { font-size:12px; letter-spacing:.28em; text-transform:uppercase; color:var(--muted); }
+  .edit-head { font:400 clamp(34px,6vw,74px)/1.02 'Playfair Display',Georgia,serif; letter-spacing:-.01em; margin:14px 0 0; }
+  .edit-head em { font-style:italic; }
+  .edit-sub { font:italic 400 18px/1.6 'Playfair Display',Georgia,serif; color:#4a463f; max-width:600px; margin:14px auto 24px; }
+  .edit-sig { display:flex; flex-direction:column; align-items:center; gap:9px; margin:4px auto 30px; }
+  .edit-sig img { max-width:min(440px,82%); height:auto; }
+  .edit-sig .attr { font-size:12px; color:var(--muted); }
+  .edit-sig .attr a { color:var(--green,#1d7a36); text-decoration:none; }
+  .edit-trio { display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(10px,2vw,24px); max-width:820px; margin:0 auto 28px; }
+  .edit-piece { display:block; text-decoration:none; color:inherit; }
+  .edit-piece .ph { aspect-ratio:1/1; background:#fff; border:1px solid var(--line); border-radius:10px; overflow:hidden; }
+  .edit-piece .ph img { width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
+  .edit-piece:hover .ph img { transform:scale(1.045); }
+  .edit-piece .pl { margin-top:9px; font:600 15px 'Playfair Display',Georgia,serif; }
+  .edit-piece .pn { font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--muted); margin-top:2px; }
+  @media(max-width:640px){ .edit-trio{ grid-template-columns:1fr; max-width:320px; } }
+  .campaign { position:relative; display:grid; grid-template-columns:1.05fr 1fr; align-items:stretch; background:#141210; color:#f4f1ea; border-bottom:1px solid var(--line); }
+  .campaign .cimg img { width:100%; height:100%; object-fit:cover; display:block; min-height:360px; }
+  .campaign .ctxt { padding:clamp(30px,5vw,76px); display:flex; flex-direction:column; justify-content:center; gap:15px; }
+  .campaign .ck { font-size:12px; letter-spacing:.26em; text-transform:uppercase; opacity:.6; }
+  .campaign .ch2 { font:400 clamp(26px,4vw,48px)/1.04 'Playfair Display',Georgia,serif; margin:0; }
+  .campaign .ch2 em { font-style:italic; }
+  .campaign p { opacity:.78; line-height:1.7; max-width:44ch; font-size:14.5px; margin:0; }
+  .campaign a.clink { width:max-content; font-size:12px; letter-spacing:.18em; text-transform:uppercase; color:#f4f1ea; border-bottom:1px solid rgba(244,241,234,.5); padding-bottom:5px; text-decoration:none; }
+  .campaign a.clink:hover { border-bottom-color:#f4f1ea; }
+  .campaign .rendering { font-size:11px; letter-spacing:.02em; opacity:.5; margin:0; }
+  @media(max-width:760px){ .campaign{ grid-template-columns:1fr; } }
 </style>
 <!-- Google Analytics 4 (G-2HEVP6TD0J) -->
 <script async src="https://www.googletagmanager.com/gtag/js?id=G-2HEVP6TD0J"></script>
@@ -278,20 +310,51 @@
 </div>
 
 <!-- HERO -->
-<section class="hero">
+<section class="hero hero--edit">
   <div class="hero-bg" aria-hidden="true"></div>
   <div class="hero-inner">
-    <img class="hero-logo" src="/assets/logo-celebsig.png" alt="Celebrity Signatures">
-    <p class="hero-tag">Seven thousand authentic signatures — artists, authors, presidents, founders — every one traced to a real archival source.</p>
+    <span class="edit-kicker">The Signature Edit № 001 · Abraham Lincoln</span>
+    <h1 class="edit-head">Wear a piece <em>of history.</em></h1>
+    <p class="edit-sub">Every piece carries an authentic signature, traced to a real archive — never invented. First: the hand of Abraham Lincoln.</p>
+    <div class="edit-sig">
+      <img src="https://upload.wikimedia.org/wikipedia/commons/c/c0/Abraham_Lincoln_1862_signature.svg" alt="Authentic 1862 signature of Abraham Lincoln" loading="lazy">
+      <span class="attr">Abraham Lincoln · d. 1865 · public domain, Wikimedia Commons · <a href="/a/Q91">view the source →</a></span>
+    </div>
+    <div class="edit-trio">
+      <a class="edit-piece" href="/wear" aria-label="Shop the Tee">
+        <div class="ph"><img src="/assets/garments/classic-tee-white.jpg" alt="The Signature Tee" loading="lazy"></div>
+        <div class="pl">The Tee</div><div class="pn">Signature Ready-to-Wear</div>
+      </a>
+      <a class="edit-piece" href="/wear" aria-label="Shop the Hat">
+        <div class="ph"><img src="/assets/garments/bucket-hat-white.jpg" alt="The Signature Hat" loading="lazy"></div>
+        <div class="pl">The Hat</div><div class="pn">Signature Headwear</div>
+      </a>
+      <a class="edit-piece" href="/wear" aria-label="Shop the Socks">
+        <div class="ph"><img src="/assets/garments/crew-socks-white.jpg" alt="The Signature Socks" loading="lazy"></div>
+        <div class="pl">The Socks</div><div class="pn">Signature Legwear</div>
+      </a>
+    </div>
     <div class="hero-ctas">
       <a class="hbtn" href="#collection">Browse the collection</a>
+      <a class="hbtn ghost" href="/wear">Shop the Lincoln edit</a>
       <a class="hbtn ghost" href="/murals">Order a mural</a>
-      <a class="hbtn ghost" href="/wear">Shop clothing</a>
       <a class="hbtn ghost" href="/game">Play the games</a>
     </div>
   </div>
 </section>
 
+<!-- CAMPAIGN — clearly-labeled artistic rendering (AI), not a photograph -->
+<section class="campaign">
+  <div class="cimg"><img src="/assets/campaign-lincoln.jpg" alt="Editorial artistic rendering of Abraham Lincoln in the Signature Edit" loading="lazy"></div>
+  <div class="ctxt">
+    <span class="ck">The Campaign · № 001</span>
+    <h2 class="ch2">Signed, <em>Mr. Lincoln.</em></h2>
+    <p>Our first icon, styled in the full Signature Edit — the hat, the shirt, the socks. His authentic 1862 autograph runs through every thread.</p>
+    <a class="clink" href="/wear">Shop the Lincoln edit →</a>
+    <p class="rendering">Artistic rendering — a stylized depiction of Abraham Lincoln (public domain). Not a photograph.</p>
+  </div>
+</section>
+
 <!-- LEFT DRAWER (all browse controls live here) -->
 <div class="dback" id="dback" hidden></div>
 <aside class="drawer" id="drawer" aria-label="Browse options">

← 3693ec3 wear: add all-over-print signature shirts (camp button-up +  ·  back to CelebritySignatures  ·  wear: put Abraham Lincoln's signature on the ACTUAL product 2a4de6d →