/* Shared feature-card geometry, with the category section layout from Figma 2322:1661. */
.tpx-product-features.tpx-category-how-to-choose {
    box-sizing: border-box;
    container-type: inline-size;
    margin-block: 0;
    background: var(--wp--preset--color--smoke, #f2f2f2);
    /*padding: clamp(48px, 6vw, 90px) clamp(24px, 4vw, 60px) clamp(40px, 4vw, 60px);*/
}
.tpx-category-how-to-choose .tpx-product-features-header {
    flex-direction: column;
    margin-bottom: var(--wp--preset--spacing--xl);
    max-width: 850px;
    margin-inline: auto;    
}
.tpx-category-how-to-choose .tpx-product-features-heading {
    max-width: 100%;
    font-family: var(--wp--preset--font-family--aktiv-grotesk-extended, aktiv-grotesk-extended, sans-serif);
    font-size: clamp(28px, 3.2vw, 45px);
    font-weight: 800;
    line-height: 1.125;
    letter-spacing: -.02em;
    text-align: center;
    text-transform: uppercase;
    text-box-trim: trim-both;
    text-box-edge: cap alphabetic;
    overflow-wrap: anywhere;
}
.tpx-category-how-to-choose .tpx-feature-navigation {
    justify-content: center;
    margin-top: 24px;
}
.tpx-category-how-to-choose .tpx-feature-track { padding-block: 0; }
.tpx-category-how-to-choose .tpx-feature-card {
    min-height: 221px;
    background: var(--wp--preset--color--white, #fff);
}
.tpx-category-how-to-choose .tpx-feature-card[data-has-popup="true"] {
    padding-bottom: 76px;
}
.tpx-category-how-to-choose .tpx-feature-icon {
    width: 60px;
    height: 60px;
    background: var(--wp--preset--color--smoke, #f2f2f2);
    border: 0;
}
.tpx-category-how-to-choose .tpx-feature-icon img {
    width: 36px;
    height: 36px;
}
/* Keep the whole-card popup target, with a visible control in its corner. */
.tpx-category-how-to-choose .tpx-feature-open::after,
.tpx-category-how-to-choose .tpx-feature-open-preview {
    content: '+';
    position: absolute;
    right: 22px;
    bottom: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: var(--wp--preset--color--smoke, #f2f2f2);
    color: #252525;
    font: 28px/1 sans-serif;
    transition: background .2s ease;
}
@media (hover: hover) {
    .tpx-category-how-to-choose .tpx-feature-open:hover::after {
        background: var(--wp--preset--color--warm-grey, #e6e6e6);
    }
}
@media (prefers-reduced-motion: reduce) {
    .tpx-category-how-to-choose .tpx-feature-open::after { transition: none; }
}
@container (min-width: 1000px) {
    .tpx-category-how-to-choose .tpx-feature-card { flex-basis: calc((100% - 48px) / 3); }
}