html{scroll-padding-top:110px}.pattern-directory{padding:60px var(--pad);background:#f3f2ee;border-bottom:1px solid #44305c22}.pattern-directory h2{font-size:clamp(40px,5vw,64px);margin:0 0 16px;line-height:1}.pattern-directory>p{font-size:15px;margin:0 0 30px;max-width:650px}.pattern-directory-grid{display:grid;grid-template-columns:1.2fr 1.2fr 1fr;gap:35px;margin-bottom:24px}.pattern-directory-grid h3{font:600 16px Arial,sans-serif;margin:0 0 14px;color:#44305c}.pattern-directory-grid a{display:flex;justify-content:space-between;gap:16px;padding:13px 0;border-top:1px solid #44305c22;font-size:14px}.pattern-directory a:hover,.pattern-next a:hover{color:#70518f}.pattern-directory a:focus-visible,.pattern-next a:focus-visible{outline:2px solid #44305c;outline-offset:4px}.pattern-next{padding:45px var(--pad);display:grid;grid-template-columns:1fr 1fr;gap:30px;background:#efede7;border-top:1px solid #44305c22}.pattern-next h2{font-size:clamp(30px,4vw,46px);margin:0;line-height:1.1}.pattern-next-links{display:flex;flex-direction:column;gap:16px;justify-content:center;font-size:14px}.pattern-gallery>.listing-library{margin-top:24px;margin-bottom:35px}.pattern-header nav{gap:20px}@media(max-width:720px){.pattern-directory{padding:40px 22px}.pattern-directory-grid{grid-template-columns:1fr;gap:28px}.pattern-next{grid-template-columns:1fr;padding:35px 22px}.pattern-page .pattern-header{height:auto;flex-wrap:wrap;gap:15px}.pattern-header nav{width:100%;flex-wrap:wrap;overflow:visible;gap:12px 16px;padding-bottom:5px}.pattern-header nav a{flex:none}html{scroll-padding-top:135px}}