.recipe{flex-wrap:wrap;align-items:center;gap:10px 12px;margin-top:32px;display:flex}.recipe__slot{font:400 .8rem/1 var(--f-ui);color:#fff;background:var(--slot);align-items:center;gap:10px;padding:8px 14px 8px 8px;display:inline-flex;box-shadow:inset 3px 3px #00000080,inset -3px -3px #ffffff12,0 0 0 3px #0a0c0d}.recipe__icon{background:#00000040;place-items:center;width:32px;height:32px;display:grid}.recipe__icon svg{width:22px;height:22px}.recipe__op{font:400 2rem/1 var(--f-pixel);color:var(--muted)}.recipe__arrow{clip-path:polygon(0 30%,65% 30%,65% 0,100% 50%,65% 100%,65% 70%,0 70%);background:#3a4045;width:44px;height:14px;position:relative}.recipe__arrow span{background:var(--cyan);transform-origin:0;position:absolute;inset:0;transform:scaleX(0)}.recipe.is-in .recipe__arrow span{transition:transform 1.1s steps(8,end) .5s;transform:scaleX(1)}.recipe__slot--result{color:var(--navy);background:var(--cyan);box-shadow:inset 3px 3px 0 #ffffff59, inset -3px -3px 0 #0003, 0 0 0 3px var(--navy), 0 0 24px #5ce1e666}html:not(.js) .recipe__arrow span{transform:scaleX(1)}.features{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);grid-template-areas:"sa la""lb sb";align-items:center;gap:clamp(28px,4vw,48px) clamp(24px,4vw,56px);display:grid}.features__shot-a{grid-area:sa}.features__shot-b{grid-area:sb}.features__list-a{grid-area:la}.features__list-b{grid-area:lb}.feature-list{gap:14px;display:grid}.feature{color:#fff;transition:transform .3s var(--ease-spring), background-color .3s;background:linear-gradient(#4a5056,#3a4045);align-items:center;gap:16px;padding:12px 18px 12px 12px;display:flex;position:relative;overflow:hidden;box-shadow:0 0 0 3px #0a0c0d,inset 0 3px #ffffff2e,inset 0 -4px #0000004d}.feature__icon{background:var(--slot);flex:none;place-items:center;width:48px;height:48px;display:grid;box-shadow:inset 3px 3px #00000080,inset -3px -3px #ffffff12}.feature__icon svg{width:28px;height:28px;transition:transform .45s var(--ease-spring)}.feature__label{font:400 .9rem/1.35 var(--f-ui);letter-spacing:.02em;text-transform:uppercase;text-shadow:2px 2px #00000073;flex:1}.feature__check{color:var(--cyan);opacity:.35;transition:opacity .3s, transform .35s var(--ease-spring)}.feature__check svg{width:16px}@media (hover:hover){.feature:hover{background:linear-gradient(#2f7f86,#1f5f66);transform:translate(6px)}.feature:hover .feature__icon svg{transform:scale(1.2)rotate(-10deg)}.feature:hover .feature__check{opacity:1;transform:scale(1.3)}}@media (max-width:860px){.features{grid-template-columns:1fr;grid-template-areas:"sa""la""sb""lb"}}
