*{box-sizing:border-box}body{margin:0;background:#f5f7f3;color:#18322a;font:16px system-ui,sans-serif}main{max-width:72rem;margin:auto;padding:clamp(1rem,5vw,3rem)}header{margin-bottom:2rem}header p{margin:0 0 .5rem;color:#326754;font-weight:700}h1{margin:0;font-size:clamp(2rem,5vw,3.25rem);overflow-wrap:anywhere}ul{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,14rem),1fr));gap:1rem}li{min-width:0;background:#fff;border:1px solid #d9e4dd;border-radius:.75rem;overflow:hidden}li img{display:block;width:100%;aspect-ratio:1;object-fit:contain;background:#e9f0eb}li div{padding:1rem}h2{margin:0;font-size:1rem;overflow-wrap:anywhere}li p{margin:.5rem 0 0;font-weight:700}button{color:#fff;background:#21634e;padding:.65rem 1rem;border:0;border-radius:.4rem;font:inherit;cursor:pointer}button:disabled{opacity:.6;cursor:wait}