.examples-section{border-top:1px solid var(--line)}.examples-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:32px 24px;align-items:start}.example-card{min-width:0}.example-card:first-child{grid-column:1/-1}.example-link{display:block;border:1px solid var(--line);border-radius:18px;overflow:hidden;background:#181a1d;transition:border-color .25s,box-shadow .25s}.example-link:hover{border-color:#7d8189;box-shadow:0 18px 50px #0004}.example-link:focus-visible{outline:2px solid #e5e8ed;outline-offset:6px}.example-browser{height:34px;display:flex;align-items:center;gap:5px;padding:0 14px;border-bottom:1px solid #ffffff12}.example-browser i{width:5px;height:5px;border-radius:50%;background:#5f6268}.example-browser span{margin:auto;font-size:.58rem;color:#a6a9b0;letter-spacing:.08em;padding-right:25px}.example-image{overflow:hidden;background:#e9e5dc}.example-image img{width:100%;height:auto;aspect-ratio:1200/850;object-fit:cover;transition:transform .6s cubic-bezier(.16,1,.3,1)}.example-card:first-child .example-image img{aspect-ratio:1200/650;object-position:center 42%}.example-link:hover img{transform:scale(1.025)}.example-meta{display:flex;justify-content:space-between;gap:16px;align-items:center;padding:20px 3px 0}.example-meta h3{font:600 1.2rem Manrope,sans-serif;letter-spacing:-.04em;margin:0 0 5px}.example-meta p{color:var(--muted);font-size:.8rem;margin:0}.example-open{font-size:.75rem;color:#d6d9de;white-space:nowrap}.example-open span{display:inline-grid;place-items:center;border:1px solid var(--line);width:30px;height:30px;border-radius:50%;margin-left:6px}.examples-note{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:40px;padding-top:24px;border-top:1px solid var(--line)}.examples-note p{max-width:540px;margin:0;color:var(--muted);font-size:.82rem}@media(min-width:821px){.example-card:first-child .example-link{width:86%}.example-card:first-child .example-meta{width:86%}.example-card:nth-child(2){margin-top:32px}.example-card:nth-child(3){margin-top:0}}@media(max-width:820px){.examples-grid{gap:28px 18px}.example-meta{align-items:flex-start}.example-open{font-size:0}.example-open span{font-size:1rem}}@media(max-width:560px){.examples-grid{grid-template-columns:1fr;gap:32px}.example-card:first-child{grid-column:auto}.example-card:first-child .example-image img{aspect-ratio:1200/850}.example-meta h3{font-size:1.1rem}.examples-note{align-items:flex-start;flex-direction:column}.examples-note .btn{width:100%}}@media(prefers-reduced-motion:reduce){.example-image img,.example-link{transition:none}}
