diff --git a/docker/frontend/src/styles/landing.css b/docker/frontend/src/styles/landing.css index a50d628..15c7c24 100644 --- a/docker/frontend/src/styles/landing.css +++ b/docker/frontend/src/styles/landing.css @@ -48,6 +48,9 @@ --lp-ink-amber: hsl(var(--accent-h) var(--accent-s) 32%); } [data-theme="light"] .lp-hero h1 { background: linear-gradient(100deg, #14161c 8%, var(--lp-amber) 62%, var(--lp-red) 98%); -webkit-background-clip: text; background-clip: text; } +/* Plain amber on white fails contrast, so the label sweep starts from the + darker ink accent the theme already defines for text on the page. */ +[data-theme="light"] .lp-stat span { background: linear-gradient(100deg, var(--lp-ink-amber), var(--lp-red)); -webkit-background-clip: text; background-clip: text; } [data-theme="light"] .lp-glow { opacity: 0.5; } [data-theme="light"] .lp-btn, [data-theme="light"] .lp-tool, @@ -251,7 +254,17 @@ html { scroll-behavior: smooth; scroll-padding-top: 116px; } padding: 16px 18px; } .lp-stat b { display: block; font-family: var(--lp-display); font-size: 26px; } -.lp-stat span { color: var(--lp-muted); font-family: var(--lp-mono); font-size: 10.5px; letter-spacing: 0.14em; } +.lp-stat span { + font-family: var(--lp-mono); + font-size: 10.5px; + letter-spacing: 0.14em; + /* The same accent→film-red sweep the hero headline carries, in the theme's + own accent so the colour group in the Theme menu still retints it. */ + background: linear-gradient(100deg, var(--lp-amber), var(--lp-red)); + -webkit-background-clip: text; + background-clip: text; + color: transparent; +} /* --- 3. film strip marquee ---------------------------------------------- */ .lp-marquee { overflow: hidden; border-top: 1px solid var(--lp-line); border-bottom: 1px solid var(--lp-line); background: var(--lp-bg2); padding: 26px 0; }