.better-case{--paper:#f2f2f2;--ink:#111;--accent:#ffc812}.better-hero{display:grid;grid-template-columns:1fr 1fr;background:#191919;color:white;min-height:730px;align-items:center;gap:3%}.better-hero .case-hero-copy{padding:45px 0 50px 12%}.better-hero h1{font-size:clamp(48px,5.4vw,86px);line-height:1.02}.better-hero h1 em{color:#ffc812;font-style:normal;font-family:inherit;font-weight:600}.better-hero figure{margin:0;padding:40px 12% 40px 0}.better-hero figure img{display:block;width:100%;height:auto}.better-hero figcaption{font-size:13px;color:#bbb;margin-top:14px}.better-hero-jump{display:inline-block;margin-top:25px;font-size:18px}.better-case .case-program{background:#ffc812;color:#111}.better-case .case-program span{color:#373019}.better-foundation{background:#e6e6e3}.better-principles{display:grid;grid-template-columns:repeat(3,1fr);gap:35px}.better-principles article{border-top:3px solid #ffc812;padding-top:25px}.better-principles span,.better-plan-grid span{font-size:12px;letter-spacing:.1em;font-weight:700}.better-principles h3{font-size:29px;line-height:1.15;margin:20px 0}.better-principles p,.better-plan-grid p{font-size:19px;line-height:1.7}.better-discovery-example{display:grid;grid-template-columns:1.2fr 1fr;gap:6%;margin-top:70px;align-items:center}.better-discovery-example img{display:block;width:100%;height:auto;border:1px solid #bbb}.better-discovery-example h3{font-size:32px;line-height:1.15;margin:18px 0}.better-discovery-example p{font-size:20px;line-height:1.7}.better-voice{background:#202020;color:#fafafa}.better-case .still-document-grid img{border-color:#aaa;box-shadow:none}.better-digital{background:#ddd}.better-browser{background:#121212;border:10px solid #121212;border-radius:14px;overflow:hidden;box-shadow:0 25px 45px #0002}.better-browser-bar{display:flex;align-items:center;gap:7px;padding:8px 5px 15px;color:#d4d4d4;font:12px Arial,sans-serif}.better-browser-bar i{width:6px;height:6px;border-radius:50%;background:#777}.better-browser-bar span{margin-left:18px}.better-browser video{display:block;width:100%;height:auto;background:#000}.better-applications{background:#fff}.better-applications>div:first-child{position:sticky;top:35px}.better-applications>div>p:not(.case-kicker){font-size:21px;line-height:1.7}.better-applications a{display:inline-block;font-size:19px;text-underline-offset:5px;margin-top:22px}.better-applications figure{margin:0}.better-applications figure img{width:100%;height:auto;display:block}.better-applications figcaption{font-size:15px;margin-top:18px}.better-planning{background:#eae8df}.better-plan-grid{display:grid;grid-template-columns:1fr 1fr;gap:35px}.better-plan-grid article{border-top:1px solid #8e8974;padding-top:22px}.better-plan-grid h3{font-size:29px;line-height:1.15;margin:18px 0}.better-style-reference{margin-top:55px;border-block:1px solid #8e8974;padding:22px 0}.better-style-reference summary{cursor:pointer;font-size:22px;line-height:1.5}.better-style-reference p{font-size:18px;line-height:1.7;max-width:850px;margin:20px 0}.better-style-reference video{display:block;width:100%;max-width:1000px;height:auto;background:#000}.better-case .case-end{background:#111}.better-case .case-end .button{background:#ffc812;color:#111}.better-case .case-section h2:after{background:#ffc812}
@media(max-width:850px){.better-hero{grid-template-columns:1fr;gap:0}.better-hero .case-hero-copy{padding:40px 6%}.better-hero h1{font-size:clamp(54px,8vw,80px)}.better-hero figure{padding:0 6% 40px;max-width:650px}.better-principles{grid-template-columns:1fr;gap:30px}.better-discovery-example{grid-template-columns:1fr;gap:25px;margin-top:45px}.better-applications>div:first-child{position:static}}@media(max-width:550px){.better-plan-grid{grid-template-columns:1fr}.better-hero h1{font-size:clamp(46px,11vw,65px)}.better-hero figure{padding-bottom:30px}.better-browser{border-width:5px}.better-browser-bar{font-size:10px;padding-bottom:10px}}
.better-conversation-story{background:#fafaf7}.better-conversation-visual{margin:0}.better-conversation-visual img{display:block;width:100%;height:auto}.better-conversation-visual figcaption{font-size:14px;line-height:1.6;margin-top:16px;max-width:850px;color:#555}.better-story-explanation{display:grid;grid-template-columns:1fr 1fr;gap:6%;margin-top:45px}.better-story-explanation h3{font-size:30px;line-height:1.15;margin:0 0 20px}.better-story-explanation p{font-size:20px;line-height:1.7}.better-audience-context{background:#222;color:#fff}.better-audience-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:30px}.better-audience-grid article{border-top:3px solid #ffc812;padding-top:25px}.better-audience-grid span,.better-name-family article>span{font-size:11px;letter-spacing:.09em;font-weight:700;line-height:1.7}.better-audience-grid span{color:#ffd54f}.better-audience-grid h3{font-size:26px;line-height:1.16;margin:20px 0}.better-audience-grid p{font-size:18px;line-height:1.7}.better-naming-context{background:#f5f1de}.better-name-family{display:grid;grid-template-columns:1fr 1fr;gap:6%}.better-name-family article{border-top:2px solid #bb9816;padding-top:25px;min-width:0}.better-name-family h3{font-size:31px;line-height:1.15;max-width:470px;margin:20px 0 30px}.better-name-family dl{margin:0}.better-name-family dl>div{border-top:1px solid #d1c9a9;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px;padding:18px 0;align-items:start}.better-name-family dt{font-size:20px;font-weight:700;line-height:1.4}.better-name-family dd{font-size:17px;line-height:1.6;margin:0}.better-hero figure:has(img[src*="brand-system"]){padding-right:8%;margin:0}.better-hero figure:has(img[src*="brand-system"]) img{box-shadow:0 20px 50px #0003}
@media(max-width:1000px){.better-audience-grid{grid-template-columns:1fr 1fr}}@media(max-width:850px){.better-story-explanation,.better-name-family{grid-template-columns:1fr;gap:35px}.better-hero figure:has(img[src*="brand-system"]){padding:0 6% 40px;max-width:none}}@media(max-width:550px){.better-audience-grid{grid-template-columns:1fr}.better-name-family dl>div{gap:15px}.better-name-family dt{font-size:18px}.better-name-family dd{font-size:16px}.better-story-explanation h3{font-size:27px}.better-conversation-visual img{min-height:0;object-fit:contain}}
