hero: dramatic image-less luxury band (deep editorial, hairline frame, oversized serif, scroll cue)

45568d8e7b66952da52e4f41507d65ee900fd4a7 · 2026-08-05 13:31:39 -0700 · Steve Abrams

Files touched

M build.mjs
M public/index.html
M public/style.css

Diff

commit 45568d8e7b66952da52e4f41507d65ee900fd4a7
Author: Steve Abrams <steve@designerwallcoverings.com>
Date:   Wed Aug 5 13:31:39 2026 -0700

    hero: dramatic image-less luxury band (deep editorial, hairline frame, oversized serif, scroll cue)
---
 build.mjs         | 5 +++--
 public/index.html | 5 +++--
 public/style.css  | 8 ++++++++
 3 files changed, 14 insertions(+), 4 deletions(-)

diff --git a/build.mjs b/build.mjs
index 15f0bd9..1856c7d 100644
--- a/build.mjs
+++ b/build.mjs
@@ -165,12 +165,13 @@ ${footer}
 
 // ---- home ----
 const homeBody = `
-  <section class="hero">
+  <section class="hero home-hero">
     <div class="wrap">
-      <p class="eyebrow">THE 90210 EDIT</p>
+      <p class="eyebrow">The 90210 Edit</p>
       <h1>Beverly Hills, beyond the postcard.</h1>
       <p class="sub">An independent guide to the city’s real estate, shopping, dining, culture, and the quiet corners
         locals love — stories worth slowing down for.</p>
+      <a href="#guides" class="scrollcue">Explore</a>
     </div>
   </section>
   <section class="feed">
diff --git a/public/index.html b/public/index.html
index 9f0dea7..51f0c50 100644
--- a/public/index.html
+++ b/public/index.html
@@ -31,12 +31,13 @@
     </div>
   </header>
 
-  <section class="hero">
+  <section class="hero home-hero">
     <div class="wrap">
-      <p class="eyebrow">THE 90210 EDIT</p>
+      <p class="eyebrow">The 90210 Edit</p>
       <h1>Beverly Hills, beyond the postcard.</h1>
       <p class="sub">An independent guide to the city’s real estate, shopping, dining, culture, and the quiet corners
         locals love — stories worth slowing down for.</p>
+      <a href="#guides" class="scrollcue">Explore</a>
     </div>
   </section>
   <section class="feed">
diff --git a/public/style.css b/public/style.css
index a91c1e4..0ae2aae 100644
--- a/public/style.css
+++ b/public/style.css
@@ -81,3 +81,11 @@ p{margin:0 0 1.1em}
 .site-foot a{border-bottom:1px solid var(--line)}
 .site-foot a:hover{border-color:var(--ink)}
 @media(max-width:640px){.wrap{padding:0 22px}.post-card{padding:32px 26px}.site-head nav{gap:20px}}
+
+/* dramatic home hero — image-less luxury band */
+.hero.home-hero{background:#151310;color:#f6f3ec;border:0;position:relative;padding:clamp(96px,15vw,190px) 0}
+.hero.home-hero::before{content:"";position:absolute;inset:22px;border:1px solid rgba(246,243,236,.22);pointer-events:none}
+.hero.home-hero .eyebrow{color:rgba(246,243,236,.6)}
+.hero.home-hero h1{color:#fff;font-weight:400;font-size:clamp(3rem,8vw,6.4rem);letter-spacing:.01em}
+.hero.home-hero .sub{color:rgba(246,243,236,.78)}
+.hero.home-hero .scrollcue{display:inline-block;margin-top:2.4em;font-family:var(--ui);text-transform:uppercase;letter-spacing:.28em;font-size:.66rem;color:rgba(246,243,236,.6);border-bottom:1px solid rgba(246,243,236,.4);padding-bottom:4px}

← 864d15d redesign: Gucci-caliber luxury system (Cormorant Garamond + · back to Beverlyhillsvideos · auto-save: 2026-08-05T13:42:25 (2 files) — public/style.css 8ecee7b →