/* Scoped to the comparison: existing mockup styles and pages are unchanged. */
.lettering-comparison .brand{gap:14px;flex-shrink:0}
.lettering-comparison .brand>.authentic-wordmark{width:290px;min-width:0;line-height:1.2}
.lettering-comparison .authentic-wordmark>img{width:100%;height:auto;max-width:100%;object-fit:contain}
.lettering-comparison .brand small{margin-top:10px;font-size:10px;letter-spacing:.075em}
@media(max-width:1050px) and (min-width:801px){.lettering-comparison header{gap:16px}.lettering-comparison .brand>.authentic-wordmark{width:245px}.lettering-comparison nav{gap:12px}}
@media(max-width:800px){.lettering-comparison .brand>.authentic-wordmark{width:290px}.lettering-comparison .brand small{font-size:9px}}
@media(min-width:801px) and (max-width:1000px){.lettering-comparison header{flex-wrap:wrap;gap:0}.lettering-comparison .menu-toggle{display:flex;align-items:center;gap:10px;border:1px solid var(--line);padding:9px 12px;background:transparent;font-size:12px;min-height:44px}.lettering-comparison nav{display:none;flex-basis:100%;flex-direction:column;align-items:stretch;padding:15px 0 5px;gap:0}.lettering-comparison nav.open{display:flex}.lettering-comparison nav a{padding:11px 0}.lettering-comparison nav .button{margin-top:8px}}
@media(max-width:620px){.lettering-comparison header{gap:0;padding:10px 16px}.lettering-comparison .brand{gap:8px}.lettering-comparison .brand>.authentic-wordmark{width:clamp(139px,40vw,245px)}.lettering-comparison .brand small{font-size:7px;letter-spacing:.035em;margin-top:7px}.lettering-comparison .logo.truck-brandmark{width:62px;height:56px;flex-basis:62px}.lettering-comparison .menu-toggle{gap:6px;padding:8px;min-height:44px}.lettering-comparison .preview-comparison{flex-wrap:wrap;gap:6px 14px}}
@media(max-width:360px){.lettering-comparison .brand>.authentic-wordmark{width:139px}.lettering-comparison .logo.truck-brandmark{width:56px;height:51px;flex-basis:56px}.lettering-comparison .brand small{font-size:6.5px}}