Background: black and gray topography contour pattern

Layered repeating-radial-gradients at four focal points
create organic topo map contours. Grid overlay removed.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Stephen Groundwater
2026-10-04 12:20:19 -04:00
parent 8e16cb51e3
commit ad6d0d760f

View File

@ -21,7 +21,20 @@ html { scroll-behavior: smooth; }
body {
font-family: var(--mono);
background: var(--bg);
background-color: #0c0c0e;
background-image:
repeating-radial-gradient(ellipse 620px 420px at 18% 32%,
transparent 0px, transparent 36px,
rgba(44, 46, 62, 0.55) 37px, transparent 38px),
repeating-radial-gradient(ellipse 520px 360px at 78% 62%,
transparent 0px, transparent 46px,
rgba(44, 46, 62, 0.45) 47px, transparent 48px),
repeating-radial-gradient(ellipse 700px 280px at 52% 88%,
transparent 0px, transparent 30px,
rgba(44, 46, 62, 0.35) 31px, transparent 32px),
repeating-radial-gradient(ellipse 380px 520px at 88% 18%,
transparent 0px, transparent 54px,
rgba(44, 46, 62, 0.4) 55px, transparent 56px);
color: var(--gray-hi);
line-height: 1.6;
font-size: 16px;
@ -100,17 +113,7 @@ body {
overflow: hidden;
}
.hero-grid {
position: absolute;
inset: 0;
background-image:
linear-gradient(var(--border) 1px, transparent 1px),
linear-gradient(90deg, var(--border) 1px, transparent 1px);
background-size: 48px 48px;
opacity: 0.25;
pointer-events: none;
mask-image: radial-gradient(ellipse 80% 100% at 50% 0%, black 30%, transparent 100%);
}
.hero-grid { display: none; }
.hero .container { position: relative; z-index: 1; }