From cc7d385c9f95d8b95d00c41538f4ffec0b665b9a Mon Sep 17 00:00:00 2001 From: Alejandro Veras Date: Thu, 1 Oct 2026 13:01:05 -0400 Subject: [PATCH] Make the Let's talk headline readable in light mode The difference blend renders white on white in light mode, so the light theme uses a solid navy headline over the ribbon instead. Co-Authored-By: Claude Opus 5.5 --- static/assets/home.css | 1 + 1 file changed, 1 insertion(+) diff --git a/static/assets/home.css b/static/assets/home.css index 29accc6..ef2f105 100644 --- a/static/assets/home.css +++ b/static/assets/home.css @@ -248,6 +248,7 @@ .ribbon { position: absolute; left: 50%; top: 50%; width: max(165%, 1900px); max-width: none; height: auto; transform: translate(-50%, -50%); animation: rib 14s ease-in-out infinite alternate; } @keyframes rib { from { transform: translate(-52%, -48%) rotate(-3deg) scale(1); } to { transform: translate(-48%, -52%) rotate(3deg) scale(1.06); } } .talk h2 { position: relative; z-index: 2; font-weight: 600; font-size: clamp(5rem, 23vw, 22rem); line-height: .9; letter-spacing: -0.07em; color: #fff; mix-blend-mode: difference; white-space: nowrap; } +:root[data-theme="light"] .talk h2 { mix-blend-mode: normal; color: #0b1220; text-shadow: 0 2px 30px rgba(255, 255, 255, .6); } .cbody { position: relative; z-index: 2; padding-inline: var(--gutter); display: flex; flex-direction: column; align-items: center; text-align: center; gap: 1.2rem; margin-top: 1rem; } .cbody .eyebrow { align-self: center; } .cbody h3 { font-weight: 500; font-size: clamp(1.8rem, 3.6vw, 3rem); letter-spacing: -0.045em; max-width: 22ch; line-height: 1.08; }