diff --git a/app/globals.css b/app/globals.css index 74b5945..e89af09 100644 --- a/app/globals.css +++ b/app/globals.css @@ -492,9 +492,17 @@ svg { align-content: start; gap: var(--space-3); padding-block: clamp(0.4rem, 2vw, 1rem); + max-width: 56rem; + margin-inline: auto; + text-align: center; min-width: 0; } +.hero-copy h1 { + max-width: none; + margin-inline: auto; +} + .eyebrow { margin: 0; color: oklch(80% 0.1 246); @@ -535,19 +543,23 @@ h3 { } .hero-lede { - max-width: 32rem; + max-width: 38rem; + margin-inline: auto; margin-bottom: 0; color: var(--text-muted); font-size: clamp(1rem, 0.45vw + 0.93rem, 1.15rem); line-height: 1.38; + text-align: center; } .hero-local-trust { - max-width: 32rem; - margin: var(--space-2) 0 0; + max-width: 38rem; + margin-inline: auto; + margin-top: var(--space-2); color: var(--blue); font-size: var(--step--1); font-weight: 700; + text-align: center; } .trust-list, @@ -561,6 +573,7 @@ h3 { .trust-list { display: grid; gap: 0.45rem; + justify-items: center; color: var(--text-muted); } @@ -621,6 +634,7 @@ h3 { flex-wrap: wrap; gap: var(--space-3); align-items: center; + justify-content: center; margin-top: var(--space-1); } @@ -3508,6 +3522,13 @@ textarea::placeholder { } @media (min-width: 760px) { + .trust-list { + display: flex; + flex-wrap: wrap; + justify-content: center; + gap: var(--space-4); + } + .site-header { grid-template-columns: auto 1fr auto; } @@ -3844,10 +3865,6 @@ textarea::placeholder { max-width: 100%; } - .hero-lede { - max-width: 100%; - } - .hero-copy { padding-right: 0; }