only when slug = "home"), so shared classes (.de-caps-h2, .de-caps-lead, .de-tile, .de-section) are refined here without touching any other page. What this pass fixes: 1. One serif voice. The hero eyebrow and the Know/Answer/Learn loop labels were set in Bitter while every other italic accent line (.de-caps-accent, .de-signature) uses Instrument Serif. They now all speak in Instrument Serif italic. 2. Headline -> body rhythm. 22px under a 64px caps headline was too tight; headlines now get a proper pause before their lead copy. 3. Body copy measure. Leads were 17px in a 503px column under 1000px-wide headlines - thin and narrow, with orphans. Now larger, a touch wider, balanced/pretty wrapping, tighter leading. 4. Small type legibility: industry tile labels (9.5px), loop card copy, proof-band copy all nudged up. 5. Section padding on one fluid scale instead of fixed values. ============================================================ */ /* --- 1. Hero ------------------------------------------------- */ .de-home-2026 .de-hero-caps-eyebrow { font-family: "Instrument Serif", var(--font-display); font-style: italic; font-size: clamp(30px, 3.2vw, 46px); line-height: 1.05; letter-spacing: -0.005em; margin: 0 0 clamp(18px, 1.8vw, 28px); } .de-home-2026 .de-hero-caps { margin-bottom: clamp(26px, 2.4vw, 38px); } .de-home-2026 .de-hero-caps-sub { font-size: clamp(17px, 1.25vw, 19.5px); line-height: 1.6; letter-spacing: -0.003em; color: rgba(238, 232, 222, 0.86); margin-bottom: clamp(32px, 2.8vw, 44px); } .de-home-2026 .de-ask-alt { margin-top: 20px; font-size: 14px; letter-spacing: 0.01em; } /* --- 2. Headline system ------------------------------------- */ .de-home-2026 .de-caps-h2 { margin-bottom: clamp(26px, 2.4vw, 38px); } /* The italic turn sits a hair further from the caps so the two voices read as statement + reply, not one crowded block. */ .de-home-2026 .de-caps-accent { margin-top: 0.14em; } .de-home-2026 .de-hook .de-caps-accent { margin-top: 0.5em; } /* --- 3. Lead copy -------------------------------------------- */ .de-home-2026 .de-caps-lead { font-size: clamp(17px, 1.25vw, 19.5px); line-height: 1.6; letter-spacing: -0.003em; max-width: 56ch; text-wrap: pretty; } .de-home-2026 .de-caps-lead + .de-caps-lead { margin-top: 1em !important; } /* Single-sentence leads: allowed a wider measure so they sit on one line on desktop, and balanced so they never leave a lone word when they do wrap. */ .de-home-2026 .de-learn-panel .de-caps-lead, .de-home-2026 .de-caps-lead[style*="margin-bottom"] { text-wrap: balance; max-width: 44em; } /* "Different organisations" lead: was muted grey at 17px, too faint against the cream. Brought into the body colour, with room before the card row. */ .de-home-2026 .de-caps-lead[style*="margin-bottom"] { color: var(--text-body); margin-bottom: clamp(40px, 3.6vw, 56px) !important; } /* --- 4. Flywheel --------------------------------------------- */ .de-home-2026 #flywheel-heading { margin-bottom: clamp(40px, 3.6vw, 56px) !important; } .de-home-2026 .de-loop-label { font-family: "Instrument Serif", var(--font-display); font-style: italic; font-size: clamp(20px, 1.9vw, 27px); letter-spacing: -0.005em; color: var(--de-cream); } .de-home-2026 .de-loop-cards { margin-top: clamp(44px, 4vw, 64px) !important; gap: 20px !important; } .de-home-2026 .de-loop-cards .de-mini-card { padding: 28px 28px 30px; } .de-home-2026 .de-loop-cards .de-mini-card h4 { font-size: 13px; letter-spacing: 0.12em; margin-bottom: 12px; } .de-home-2026 .de-loop-cards .de-mini-card p { font-size: 15.5px; line-height: 1.6; color: rgba(238, 232, 222, 0.8); text-wrap: pretty; } /* --- 5. BMRG proof band -------------------------------------- */ .de-home-2026 .de-proof-copy .de-eyebrow { font-size: 11.5px; letter-spacing: 0.2em; margin-bottom: 18px; } .de-home-2026 .de-proof-copy .de-caps-h2 { margin-bottom: 24px; } .de-home-2026 .de-proof-copy > p:not(.de-eyebrow) { font-size: 17.5px; line-height: 1.6; max-width: 50ch; text-wrap: pretty; margin-bottom: 0; } .de-home-2026 .de-proof-areas { margin: 26px 0 32px; } .de-home-2026 .de-proof-areas li { font-size: 11px; letter-spacing: 0.12em; padding: 8px 15px; } /* --- 6. Industry tiles --------------------------------------- */ .de-home-2026 .de-solution-card.de-tile .de-eyebrow { font-size: 11.5px; letter-spacing: 0.15em; line-height: 1.45; } /* --- 7. Close ------------------------------------------------ */ .de-home-2026 .de-close .de-caps-h2 { margin-bottom: clamp(32px, 2.8vw, 44px); } .de-home-2026 .de-signature { margin-top: clamp(32px, 2.8vw, 44px); font-size: clamp(21px, 1.8vw, 27px); } /* --- 8. Section rhythm --------------------------------------- */ .de-home-2026 .de-section { padding: clamp(96px, 8.4vw, 140px) 0; } .de-home-2026 .de-proof-band { padding: clamp(80px, 6.6vw, 112px) 0; } .de-home-2026 .de-hook { padding: clamp(140px, 11.5vw, 190px) 0; } @media (max-width: 860px) { .de-home-2026 .de-section { padding: 72px 0; } .de-home-2026 .de-proof-band { padding: 64px 0; } .de-home-2026 .de-hook { padding: 110px 0; } .de-home-2026 .de-hero-caps-sub br { display: none; } }