
.tf-open{background:var(--tf-paper)}
.tf-open__in{display:grid;gap:2rem;padding-top:1.6rem;padding-bottom:2.4rem;align-items:start}
.tf-open__mosaic{display:flex;gap:.6rem;justify-content:center;margin:0;width:100%;max-width:56.7rem;justify-self:center}
.tf-open__mosaic figure{margin:0;overflow:hidden;background:var(--tint);display:flex;align-items:center;justify-content:center;aspect-ratio:1}
.tf-open__main{flex:2 1 0;min-width:0}
.tf-open__side{flex:.985 1 0;min-width:0;display:flex;flex-direction:column;gap:.6rem;justify-content:space-between}
.tf-open__main img{display:block;width:100%;height:100%;object-fit:cover;max-width:none}
.tf-open__side img{display:block;width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply}
.tf-open__box{min-width:0;display:grid;gap:1.4rem;justify-items:start}
.tf-open__box .tf-kicker{margin:0}
.banner__text p{font-size:1.8rem;margin:0;color:var(--tf-ink2);max-width:52rem}
.banner__buttons{display:flex;flex-wrap:wrap;gap:1rem}
.banner__buttons .button{flex:1 1 auto}
.tf-flag{display:grid;grid-template-columns:7.6rem minmax(0,1fr);gap:1.4rem;align-items:center;padding:.8rem;border:.1rem solid var(--tf-line);width:100%;max-width:52rem;position:relative}
.tf-flag__img{width:7.6rem;height:7.6rem;background:var(--tint);display:flex;align-items:center;justify-content:center}
.tf-flag__img img{display:block;max-width:7.6rem;max-height:7.6rem;width:auto;height:auto;mix-blend-mode:multiply}
.tf-flag__body{display:grid;gap:.3rem;min-width:0}
.tf-flag__name{margin:0;font-weight:700;font-size:1.8rem;line-height:1.2}
.tf-flag__name a{text-decoration:none}
.tf-flag__name a:hover{text-decoration:underline;text-underline-offset:.3rem}
.tf-flag__price{margin:0;font-size:1.4rem}
.tf-flag__price b{font-size:1.8rem;margin-right:.4rem}
.tf-flag__price span{font-family:var(--tf-mono);font-size:1.25rem;color:var(--tf-ink2)}
@media screen and (min-width:37.5em){.tf-open__mosaic{width:45.2rem}}
@media screen and (min-width:46.875em) and (max-width:61.873em){
 .tf-open__in{grid-template-columns:minmax(0,46%) minmax(0,1fr);gap:2.4rem}
 .tf-open__mosaic{width:100%}
}
@media screen and (min-width:61.875em){
 .tf-open__in{grid-template-columns:auto minmax(0,1fr);gap:4rem;padding-top:2rem;padding-bottom:1.6rem}
 .tf-open__mosaic{width:57.2rem}
 .banner__buttons .button{flex:0 1 auto}
}
@media screen and (min-width:73.75em) and (max-width:87.498em){.tf-open__mosaic{width:51.2rem}}
@media screen and (min-width:87.5em){.tf-open__mosaic{width:66.2rem;max-width:none}}
/* шаги базы: линованный ряд ячеек — номер, кадр на поле линии, шаг, что он делает, изделия шага, переход */
.tf-routine{display:grid;grid-template-columns:1fr;margin:0;padding:0;list-style:none;border-top:.1rem solid var(--tf-ink);border-left:.1rem solid var(--tf-line)}
.tf-stepcell{position:relative;display:grid;grid-template-columns:16rem minmax(0,1fr);grid-template-rows:auto auto auto 1fr;gap:.4rem 1.6rem;align-content:start;padding:1.6rem;border-right:.1rem solid var(--tf-line);border-bottom:.1rem solid var(--tf-line);min-width:0}
.tf-stepcell__no{grid-column:2;margin:0;font-family:var(--tf-mono);font-size:1.3rem;letter-spacing:.1em;color:var(--tf-clay)}
.tf-stepcell__img{grid-column:1;grid-row:1 / span 4;width:16rem;height:16rem;background:var(--tint);display:flex;align-items:center;justify-content:center;overflow:hidden}
.tf-stepcell__img img{display:block;max-width:min(16rem,var(--cap,16rem));max-height:16rem;width:auto;height:auto;mix-blend-mode:multiply}
.tf-stepcell h3{grid-column:2;font-family:var(--font-heading-family);font-weight:400;font-size:2.8rem;line-height:1}
.tf-stepcell__what{grid-column:2;margin:0;font-size:1.5rem}
.tf-stepcell__names{grid-column:1 / -1;margin:.8rem 0 0;font-family:var(--tf-mono);font-size:1.25rem;color:var(--tf-ink2)}
.tf-stepcell .tf-link{grid-column:1 / -1;justify-self:start;align-self:end;font-size:1.5rem;min-height:4.4rem}
@media screen and (max-width:24.373em){.tf-stepcell{grid-template-columns:11rem minmax(0,1fr)}.tf-stepcell__img{width:11rem;height:11rem}.tf-stepcell__img img{max-width:min(11rem,var(--cap,11rem));max-height:11rem}}
@media screen and (min-width:46.875em){
 .tf-routine{grid-template-columns:repeat(var(--n,5),minmax(0,1fr))}
 .tf-stepcell{grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto auto auto 1fr auto;gap:.6rem;padding:1.6rem 1.4rem 1.2rem}
 .tf-stepcell__no,.tf-stepcell h3,.tf-stepcell__what{grid-column:1}
 .tf-stepcell__img{grid-row:auto;width:100%;height:auto;aspect-ratio:1}
 .tf-stepcell__img img{max-width:min(100%,var(--cap,20rem));max-height:100%}
 .tf-stepcell__names{margin:0}
}
/* доска «популярных»: ведущая ячейка во всю ширину (сцена + текст), под ней плитки рядами */
.tf-board{--rg:1.6rem}
@media screen and (max-width:37.498em){.tf-board{--rg:.8rem}.tf-board .tf-card__body{padding:1rem 1rem 1.2rem}.tf-board .tf-card__name{font-size:1.6rem}.tf-board .tf-card__btn{font-size:1.15rem;padding:.6rem .4rem;letter-spacing:.02em}.tf-board .tf-dot{width:1.5rem;height:1.5rem}.tf-board .tf-dots{gap:.3rem}}
@media screen and (max-width:22.498em){.tf-board .tf-card-li{--k:1}}
.tf-board__lead{flex:1 1 100%;display:grid;gap:0;border:.1rem solid var(--tf-ink);background:var(--tf-paper);min-width:0}
.tf-board__leadimg{background:var(--tint);display:flex;align-items:center;justify-content:center;overflow:hidden}
.tf-board__leadimg img{display:block;width:100%;height:auto;mix-blend-mode:multiply}
.tf-board__leadbody{display:grid;gap:.9rem;align-content:center;justify-items:start;padding:2rem 1.6rem;min-width:0}
.tf-board__name{font-family:var(--font-heading-family);font-weight:400;font-size:clamp(2.6rem,2.6vw,3.6rem);line-height:1.05}
.tf-board__name a{text-decoration:none}
.tf-board__name a:hover{text-decoration:underline;text-underline-offset:.4rem;text-decoration-thickness:.1rem}
.tf-board__fact{margin:0;font-size:1.7rem;color:var(--tf-ink2)}
.tf-board__price{margin:0;font-size:1.5rem}
.tf-board__price b{font-size:2.2rem;margin-right:.6rem}
.tf-board__price span{font-family:var(--tf-mono);font-size:1.3rem;color:var(--tf-ink2)}
@media screen and (min-width:46.875em){.tf-board__lead{grid-template-columns:minmax(0,44rem) minmax(0,1fr)}.tf-board__leadbody{padding:3.2rem}}
