.feature-thumbnail-preview {
    position: relative;
    container-type: inline-size;
    overflow: hidden;
    color: #284631;
}
.feature-thumbnail-preview::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
}
.feature-thumbnail-copy {
    position: absolute;
    left: 5%;
    top: 12%;
    width: 58%;
    z-index: 1;
    font-weight: 700;
    line-height: 1.25;
}
.feature-thumbnail-copy > span,
.feature-thumbnail-copy > strong,
.feature-thumbnail-copy > small { display: block; }
.feature-thumbnail-copy > span { font-size: 8cqw; white-space: nowrap; }
.feature-thumbnail-copy > strong { font-size: 10cqw; margin: 2% 0; white-space: nowrap; }
.feature-thumbnail-copy > .feature-thumbnail-count { font-size: 9.4cqw; }
.feature-thumbnail-copy b { font-size: 1.08em; }
.feature-thumbnail-copy > small {
    font-size: max(11px, 3.6cqw);
    line-height: 1.45;
    font-weight: 500;
    margin-top: 6%;
    padding: 0;
    max-width: 92%;
}
.feature-thumbnail-peeler::after { background: linear-gradient(90deg, #e2e9d9aa, #e2e9d933 48%, transparent 67%); }
.feature-thumbnail-pen { color: #193f61; }
.feature-thumbnail-pen .feature-thumbnail-copy { top: 15%; }
.feature-thumbnail-pen .feature-thumbnail-copy > strong { font-size: 9.4cqw; }
.feature-thumbnail-pen::after { background: linear-gradient(90deg, #c6e0f066, #c6e0f022 49%, transparent 65%); }
.feature-thumbnail-fabric { color: #7c3543; }
.feature-thumbnail-fabric .feature-thumbnail-copy { top: 17%; }
.feature-thumbnail-fabric::after { background: linear-gradient(90deg, #fff1e733, transparent 60%); }
.feature-thumbnail-wallet { color: #382b20; }
.feature-thumbnail-wallet .feature-thumbnail-copy { top: 7%; }
.feature-thumbnail-wallet::after { background: linear-gradient(90deg, #ebbc60ee, #ebbc60cc 35%, #ebbc6033 59%, transparent 70%); }
.feature-thumbnail-guitar { color: #3b3158; }
.feature-thumbnail-guitar .feature-thumbnail-copy { top: 19%; width: 68%; }
.feature-thumbnail-guitar .feature-thumbnail-copy > strong { font-size: 9.2cqw; }
.feature-thumbnail-guitar::after { background: linear-gradient(90deg, #ccc0e355, #ccc0e311 55%, transparent 72%); }
.feature-thumbnail-paper { color: #164750; }
.feature-thumbnail-paper .feature-thumbnail-copy { left: 49%; top: 19%; width: 48%; }
.feature-thumbnail-paper::after { background: linear-gradient(270deg, #fff1ddee, #fff1dddd 30%, #fff1dd33 52%, transparent 64%); }
.feature-thumbnail-comparison { display: grid; grid-template-columns: repeat(2, minmax(0, 343px)); gap: 24px; align-items: start; }
.feature-thumbnail-comparison-section { margin-bottom: 48px; scroll-margin-top: 180px; }
.feature-thumbnail-comparison-section > h2 { font-size: 20px; margin-bottom: 20px; }
.feature-thumbnail-comparison > section { min-width: 0; }
.feature-thumbnail-comparison h3 { font-size: 15px; color: var(--gray); font-weight: 500; margin-bottom: 12px; }
.feature-thumbnail-index { display: flex; flex-wrap: wrap; gap: 12px 24px; margin-bottom: 36px; }
@media (max-width: 640px) {
    .feature-thumbnail-comparison { grid-template-columns: minmax(0, 1fr); gap: 24px; }
}