.patterns-main{padding:65px 0 95px}.patterns-main h1{font-size:clamp(2rem,4vw,3rem);margin:8px 0}.lead{color:var(--muted);line-height:2}.progress-box{background:#fff3fa;border:1px solid #f4d7e8;border-radius:22px;padding:24px;margin:28px 0}.progress-box strong{color:var(--magenta);font-size:2rem;margin-right:16px}.progress-box span{font-size:.9rem}.progress-track{height:11px;background:#f3dce9;border-radius:20px;overflow:hidden;margin-top:12px}.progress-track div{height:100%;background:#d0007f;width:0;transition:width .3s}.filters{display:flex;gap:10px;flex-wrap:wrap;margin:30px 0}.filters button{background:white;border:1px solid #ead5e1;border-radius:40px;padding:8px 18px;cursor:pointer;font-weight:700}.filters button.selected{background:#d0007f;color:white;border-color:#d0007f}.pattern-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.pattern-card{border:1px solid #eadce6;border-radius:22px;padding:24px;background:white;min-height:230px}.pattern-card.locked{background:#faf8fa;color:#8e8490}.pattern-card .category{font-size:.75rem;font-weight:800;letter-spacing:.12em;color:#d0007f}.pattern-card.locked .category{color:#9e94a0}.pattern-card h2{font-size:1.23rem;margin:13px 0}.pattern-card p{font-size:.9rem;color:#605763}.pattern-card.locked p{color:#8e8490}.pattern-card details{margin-top:14px}.pattern-card summary{cursor:pointer;font-weight:800;color:#d0007f}.pattern-card .example{padding:12px;background:#fff5fa;border-radius:12px}.pattern-card .related{margin-top:16px;display:flex;gap:7px;flex-wrap:wrap}.pattern-card .related a{border:1px solid #e7bfd7;border-radius:20px;padding:3px 10px;color:#a00061;font-size:.78rem;font-weight:800}.note{color:#817682;font-size:.83rem;margin-top:30px}@media(max-width:900px){.pattern-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:600px){.pattern-grid{grid-template-columns:1fr}.patterns-main{padding:40px 0 65px}}