.feature-wrap { width: min(960px, calc(100% - 40px)); }
.breadcrumbs { margin-bottom: 28px; color: #b2bccd; font-size: 12px; }
.breadcrumbs a { color: var(--purple); }
.feature-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 18px; margin: 28px 0 12px; }
.feature-button { display: inline-flex; align-items: center; justify-content: center; padding: 13px 20px; border-radius: 12px; background: #6b4fc8; color: #fff !important; font-size: 14px; font-weight: 750; text-decoration: none; }
.feature-button:hover { background: #7e62db; }
.feature-actions > a:last-child { color: var(--purple); font-size: 14px; }
.feature-figure { margin: 30px 0 0; }
.feature-figure img { display: block; width: 100%; height: auto; border-radius: 16px; border: 1px solid var(--line); }
.feature-figure figcaption { margin-top: 10px; color: #b2bccd; font-size: 12px; }
.feature-steps { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 16px; padding: 0; list-style: none; counter-reset: steps; }
.feature-steps li { padding: 20px; border: 1px solid var(--line); background: var(--bg-soft); border-radius: 14px; counter-increment: steps; }
.feature-steps li::before { content: "0" counter(steps); color: var(--purple); font-weight: 800; }
.feature-steps h3 { margin: 10px 0; font-size: 17px; color: #fff; }
.feature-steps p { margin: 0; }
.feature-wrap section { scroll-margin-top: 100px; }
@media(max-width:640px) { .feature-steps { grid-template-columns:1fr; } .feature-wrap { width:calc(100% - 32px); } .feature-actions > a { width:100%; } }