/* Демо «Берёзовый уголь»: стили слоя эффектов (см. fx.js). */
:root{--fx:#ffb15c;--fx-ink:#24160d;--fx-bg:#100f0e}
.contacts{isolation:isolate}
.fx-mark{font-family:Georgia,"Times New Roman",serif;font-style:italic;font-weight:400;text-transform:none;letter-spacing:-.03em}
/* искры */
.fx-embers{position:absolute;inset:0;z-index:-1;width:100%;height:100%;pointer-events:none;mix-blend-mode:screen}
.fx-trail{position:fixed;inset:0;z-index:2147483550;width:100%;height:100%;pointer-events:none;mix-blend-mode:screen}
.fx-glow{position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(420px circle at var(--gx,70%) var(--gy,45%),rgba(255,150,70,.2),transparent 62%);mix-blend-mode:screen;opacity:0;transition:opacity .5s}
.fx-glow.on{opacity:1}
/* карточки каталога */
.product-grid{perspective:1100px}
.product-card{transition:transform .4s,border-color .4s,box-shadow .4s,rotate .25s ease-out}
.fx-shine{position:absolute;inset:0;z-index:1;pointer-events:none;background:radial-gradient(240px circle at var(--sx,50%) var(--sy,0%),rgba(255,214,160,.2),transparent 62%);opacity:0;transition:opacity .3s}
.product-card:hover .fx-shine{opacity:1}
.add-product{position:relative;z-index:2;--ring:255,177,92;animation:fx-ring 2.6s ease-out infinite}
.product-card:nth-child(2) .add-product{animation-delay:.6s}
.product-card:nth-child(3) .add-product{animation-delay:1.2s}
.product-card:nth-child(4) .add-product{animation-delay:1.8s}
@keyframes fx-ring{0%{box-shadow:0 0 0 0 rgba(var(--ring),.5)}70%,100%{box-shadow:0 0 0 14px rgba(var(--ring),0)}}
.fx-num{font-variant-numeric:tabular-nums}
/* шаги: линия-фитиль загорается по очереди, номер вспыхивает */
.fx-step{position:relative}
.fx-step::before{content:"";position:absolute;left:0;right:0;top:-1px;height:2px;background:linear-gradient(90deg,#ff7a2f,#ffd09b);box-shadow:0 0 14px rgba(255,140,60,.7);transform:scaleX(0);transform-origin:0 50%;animation:fx-fuse 9s linear infinite;animation-delay:calc(var(--k)*3s)}
.fx-step>span{animation:fx-fuse-n 9s linear infinite;animation-delay:calc(var(--k)*3s)}
@keyframes fx-fuse{0%{transform:scaleX(0);opacity:1}30%,33%{transform:scaleX(1);opacity:1}40%,100%{transform:scaleX(1);opacity:0}}
@keyframes fx-fuse-n{0%,33%{color:#ffd09b;text-shadow:0 0 18px rgba(255,150,70,.9)}40%,100%{text-shadow:none}}
/* «жар-метр» в заказе */
.fx-heat{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;margin-top:22px;font:600 10px/1.2 system-ui,-apple-system,"Segoe UI",sans-serif;letter-spacing:2px;color:#d9c3a5;--p:0}
.fx-heat i{position:relative;height:6px;border-radius:3px;background:rgba(255,255,255,.1);overflow:hidden}
.fx-heat b{position:absolute;inset:0;border-radius:3px;background:linear-gradient(90deg,#b3541e,#ff7a2f 55%,#ffd09b);transform:scaleX(var(--p));transform-origin:0 50%;transition:transform .7s cubic-bezier(.2,.7,.2,1);box-shadow:0 0 12px rgba(255,140,60,.8)}
.fx-heat em{min-width:13em;font-style:normal;letter-spacing:.4px;font-size:12px;text-align:right;color:#ffd09b}
/* товар летит в заказ */
.fx-fly{position:fixed;z-index:2147483500;object-fit:contain;pointer-events:none;filter:drop-shadow(0 16px 18px rgba(0,0,0,.5))}
.fx-cart{position:fixed;right:16px;bottom:16px;z-index:2147483000;display:flex;align-items:center;gap:10px;padding:10px 16px 10px 18px;border-radius:100px;background:#e39956;color:#24160d;font:600 13px/1.2 system-ui,-apple-system,"Segoe UI",sans-serif;text-decoration:none;box-shadow:0 12px 30px rgba(0,0,0,.45);opacity:0;visibility:hidden;transform:translateY(20px);transition:opacity .35s,transform .45s cubic-bezier(.2,.7,.2,1),visibility 0s .35s}
.fx-cart.show{opacity:1;visibility:visible;transform:none;transition:opacity .35s,transform .45s cubic-bezier(.2,.7,.2,1)}
.fx-cart.show.near{opacity:0;visibility:hidden;transform:translateY(20px)}
.fx-cart b{display:grid;place-items:center;min-width:24px;height:24px;padding:0 6px;border-radius:12px;background:#24160d;color:#ffd09b;font-weight:700;font-variant-numeric:tabular-nums}
.fx-cart em{font-style:normal;font-variant-numeric:tabular-nums;white-space:nowrap}
.fx-cart.bump{animation:fx-bump .5s cubic-bezier(.2,.7,.2,1)}
@keyframes fx-bump{0%{scale:1}35%{scale:1.16}100%{scale:1}}
.fx-pop{animation:fx-pop .45s cubic-bezier(.2,.7,.2,1)}
@keyframes fx-pop{0%{scale:1}40%{scale:1.14}100%{scale:1}}
#order-total{display:inline-block;transform-origin:100% 60%}
@media (max-width:640px){.fx-cart{right:10px;bottom:56px}.fx-heat{grid-template-columns:auto 1fr}.fx-heat em{grid-column:1/-1;min-width:0;text-align:left}}