/* /features/<slug>: one page per job people search for */
.feature { max-width: 46rem; margin: 0 auto; padding: 0 20px 72px; color: var(--ink); }
.feature .crumbs { font-size: 13px; color: rgba(0, 0, 0, .45); margin-bottom: 14px; }
.feature .crumbs a { color: rgba(0, 0, 0, .55); text-decoration: none; }
.feature .crumbs a:hover { color: var(--ink); text-decoration: underline; }
.feature h1 { font-size: 36px; line-height: 1.1; margin-bottom: 16px; }
.feature .lead { font-size: 18px; line-height: 1.6; color: rgba(0, 0, 0, .72); }
.feature a { color: #0d47b8; text-decoration: underline; text-underline-offset: 2px; }
.feature .actions { margin-top: 24px; }
.feature .btn { display: inline-block; line-height: 1.5; padding: 11px 22px; border-radius: 9999px; background: #121212; color: #fff; text-decoration: none; font-size: 15px; font-weight: 500; text-align: center; }
.feature .btn:hover { background: #2a2a2a; }
.feature .sub { margin-top: 10px; font-size: 13px; color: rgba(0, 0, 0, .48); }
.feature .shot { margin: 32px 0 8px; }
.feature .shot img { display: block; width: 100%; height: auto; border-radius: 20px; box-shadow: 0 0 0 1px rgba(0, 0, 0, .06), 0 18px 44px rgba(0, 20, 50, .12); }
.feature section { margin-top: 40px; }
.feature h2 { font-size: 22px; letter-spacing: -.02em; margin-bottom: 10px; }
.feature section > p { font-size: 16px; line-height: 1.65; color: rgba(0, 0, 0, .72); }
.feature .points, .feature .notes { padding-left: 20px; }
.feature .points li, .feature .notes li { font-size: 16px; line-height: 1.6; color: rgba(0, 0, 0, .72); }
.feature .points li + li, .feature .notes li + li { margin-top: 6px; }
.feature .qa { padding: 16px 0; border-top: 1px solid rgba(0, 0, 0, .08); }
.feature .qa h3 { font-size: 16px; font-weight: 600; margin-bottom: 4px; }
.feature .qa p { font-size: 15.5px; line-height: 1.6; color: rgba(0, 0, 0, .72); }
.feature .end { padding: 28px; border-radius: 24px; background: #fff; box-shadow: 0 0 0 1px rgba(0, 0, 0, .06), 0 12px 32px rgba(0, 20, 50, .05); }
.feature .end > p { font-size: 16px; line-height: 1.65; color: rgba(0, 0, 0, .72); }
.feature .more { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; margin-top: 20px; }
.feature .more a { display: inline-block; padding: 7px 13px; border-radius: 9999px; background: #f1f1f4; color: var(--ink); text-decoration: none; font-size: 13px; font-weight: 500; }
.feature .more a:hover { background: #e7e7ec; }
@media (min-width: 640px) { .feature h1 { font-size: 48px; } }