From 207e14c1d9c3c2005c15118be5886d86e7e6ed51 Mon Sep 17 00:00:00 2001 From: Michael Victory Date: Tue, 16 Jun 2026 12:01:24 -0700 Subject: [PATCH] =?UTF-8?q?OC=20mobile:=20fix=20horizontal=20overflow=20?= =?UTF-8?q?=E2=80=94=20in-flow=20footer=20content=20(flex,=20wraps),=20bod?= =?UTF-8?q?y=20overflow-x=20hidden,=20collapse=20mobile=20nav=20to=20logo+?= =?UTF-8?q?CTA?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-Authored-By: Claude Opus 4.8 --- style.css | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/style.css b/style.css index 7724c8d..688bfb3 100644 --- a/style.css +++ b/style.css @@ -30,6 +30,7 @@ body { font-size: 16px; line-height: 1.8; -webkit-font-smoothing: antialiased; + overflow-x: hidden; } .wrap { width: 100%; max-width: 1920px; margin: 0 auto; padding: 0 48px; } @@ -165,12 +166,12 @@ a.tel { text-decoration: none; } .promise { font-style: italic; color: var(--ink-soft); font-size: 0.95rem; } /* Footer — the full bg "open" logo dictates the size (aspect 4:1, no clip, no padding); content overlaid low-left */ -.site-footer { padding: 0; background: var(--navy); position: relative; overflow: hidden; aspect-ratio: 1267.11 / 316.97; } +.site-footer { padding: 0; background: var(--navy); position: relative; overflow: hidden; aspect-ratio: 1267.11 / 316.97; display: flex; align-items: flex-end; } .site-footer::before { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: 0.06; background: url(assets/brand/oc-mark-wh.svg) no-repeat center; background-size: 100% 100%; } -.footer-inner { position: absolute; left: 0; right: 0; bottom: 0; padding-bottom: 22px; } +.footer-inner { position: relative; width: 100%; padding-bottom: 22px; } .footer-brand { width: 128px; height: 27px; background-color: var(--cream); margin-bottom: 10px; } .footer-nav { display: flex; flex-wrap: wrap; gap: 22px; font-family: 'DM Sans', sans-serif; font-size: 0.7rem; font-weight: 400; text-transform: uppercase; letter-spacing: 0.13em; margin-bottom: 9px; } .footer-nav a { color: var(--cream-soft); text-decoration: none; } @@ -193,5 +194,5 @@ a:focus-visible, .btn:focus-visible { outline: 2px solid var(--amber); outline-o @media (max-width: 600px) { .wrap { padding: 0 22px; } .logo-mark { width: 146px; } - .nav-links a:not(.nav-cta):not(.nav-phone) { display: none; } + .nav-links a:not(.nav-cta) { display: none; } }