/* B. Jeden ciag. Jezyk rolki A przeniesiony na strone: jedno tlo z poswiata przez cala strone,
   tekst litera po literze z rozmycia (jeden standard dla h1 i tytulow), ramki jak karty z glebi,
   w makiecie karty produktu skan zdjecia z telefonu zanim suwak odsloni kadr na stronie.
   Zero kresek miedzy sekcjami. */
.mB{--glow:rgba(201,165,139,.30)}
.mB .glow{position:fixed;left:50%;top:50%;width:140vmax;height:140vmax;margin:-70vmax 0 0 -70vmax;pointer-events:none;z-index:0;background:radial-gradient(circle 36vmax at 50% 50%,var(--glow),rgba(201,165,139,0) 70%);will-change:transform;transform:translate3d(var(--gx,20vw),var(--gy,-20vh),0)}
.mB section{border-top:none;position:relative;z-index:1;padding:clamp(60px,8.5vh,110px) 0}
.mB footer{position:relative;z-index:1}
.mB .form-sec{padding-top:0}

/* ramki jak karty: miekki cien otoczenia, wejscie z glebi */
.mB .frame{box-shadow:0 60px 120px -60px rgba(21,20,15,.38),0 1px 0 rgba(255,255,255,.7) inset;transition:transform 1.1s var(--ease-out),opacity 1.1s var(--ease-out),filter 1.1s var(--ease-out)}
.mB .frame.rv{transform:translateY(56px) scale(.95);filter:blur(10px)}
.mB .frame.rv.in{transform:none;filter:none}
.mB.js #fit .split__media .frame{opacity:0;transform:translateY(56px) scale(.95);filter:blur(10px)}
.mB #fit .split.in .split__media .frame{opacity:1;transform:none;filter:none;transition-delay:.15s}

/* litera po literze z rozmycia: jeden standard dla h1 i tytulow sekcji */
.mB .w{display:inline-block;white-space:nowrap}
.mB .ch{display:inline-block;opacity:0;filter:blur(8px);transform:translateY(.28em);transition:opacity .7s var(--ease-out),filter .7s var(--ease-out),transform .7s var(--ease-out);transition-delay:calc(var(--i,0)*var(--cs,22ms) + var(--d0,0ms))}
.mB .in .ch{opacity:1;filter:none;transform:none}
.mB .head.rv{opacity:1;transform:none;filter:none}
.mB .head.rv .meta{opacity:0;transition:opacity .8s var(--ease-out) .5s}
.mB .head.rv.in .meta{opacity:1}
.mB.js .form-hero__copy>p,.mB.js .form-hero__copy #briefOpen{opacity:0;transform:translateY(14px);filter:blur(6px);transition:opacity .9s var(--ease-out),transform .9s var(--ease-out),filter .9s var(--ease-out)}
.mB .form-hero__copy.in>p,.mB .form-hero__copy.in #briefOpen{opacity:1;transform:none;filter:none;transition-delay:.6s}

/* hero: powolne osiadanie kadru po zaladowaniu, potem paralaksa; tekst wchodzi po kolei */
@property --hz{syntax:'<number>';inherits:false;initial-value:1.08}
.mB .hero img{transform:scale(var(--hz)) translate3d(0,var(--hpy,0px),0);transform-origin:50% 30%;animation:bHz 7s var(--ease-out) both}
@keyframes bHz{from{--hz:1.08}to{--hz:1}}
.mB .hero__copy{transform:translate3d(0,var(--hcy,0px),0);opacity:var(--hco,1)}
.mB.js .hero__copy .eyebrow,.mB.js .hero__sub,.mB.js .hero__cta,.mB.js .hero__ai{opacity:0;transform:translateY(14px);filter:blur(6px);transition:opacity .9s var(--ease-out),transform .9s var(--ease-out),filter .9s var(--ease-out)}
.mB.ready .hero__copy .eyebrow{opacity:1;transform:none;filter:none;transition-delay:.2s}
.mB.ready .hero__sub{opacity:1;transform:none;filter:none;transition-delay:1.15s}
.mB.ready .hero__cta{opacity:1;transform:none;filter:none;transition-delay:1.35s}
.mB.ready .hero__ai{opacity:1;transform:none;filter:none;transition-delay:1.55s}

/* skan zdjecia z telefonu w makiecie (sekwencja z rolki: linia, punkty, potem suwak odslania kadr) */
.mB .scan{position:absolute;inset:0;z-index:6;pointer-events:none;opacity:0;transition:opacity .35s var(--ease-io)}
.mB .scan.on{opacity:1}
.mB .scan__line{position:absolute;left:0;right:0;top:0;height:1px;background:var(--ink);opacity:.85;box-shadow:0 0 0 1px rgba(250,250,248,.5)}
.mB .scan__pt{position:absolute;display:flex;align-items:center;gap:7px;transform:translate(-3px,-3px) translateY(4px);opacity:0;transition:opacity .45s var(--ease-out),transform .45s var(--ease-out)}
.mB .scan__pt.on{opacity:1;transform:translate(-3px,-3px)}
.mB .scan__pt i{width:6px;height:6px;border-radius:50%;background:var(--ink);flex:none;box-shadow:0 0 0 2px rgba(250,250,248,.9)}
.mB .scan__pt b{font:400 9px/1 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.1em;text-transform:uppercase;color:var(--ink);background:rgba(250,250,248,.92);padding:4px 6px;white-space:nowrap}

/* modele: twarz przenika z rozmycia */
.mB .reel__img{transition:opacity .8s var(--ease-io),filter .8s var(--ease-io);filter:blur(8px)}
.mB .reel__img.is-on{filter:none}

/* portfolio: kadry wyplywaja z glebi, jeden po drugim */
.mB .acc__item>input:checked~.acc__body .grid figure,
.mB .frame.in .acc__item--peek>.acc__body .grid figure{animation:bEmerge .9s var(--ease-out) both;animation-delay:calc(var(--k,0)*45ms)}
@keyframes bEmerge{from{opacity:0;transform:translateY(22px) scale(.97);filter:blur(8px)}to{opacity:1;transform:none;filter:none}}

/* portfolio, podglad "Minimal" przed otwarciem: zaslona dochodzi do czystego papieru 10% przed kreska (bez szarego ogona),
   a dol kadrow rozmywa sie w glab (standard: glebia = rozmycie) */
.mB #work .acc__item--peek>.acc__body .acc__peekhit{background:linear-gradient(rgba(250,250,248,0) 12%,rgba(250,250,248,.22) 34%,rgba(250,250,248,.55) 52%,rgba(250,250,248,.84) 68%,rgba(250,250,248,.98) 82%,var(--paper) 90%)}
.mB #work .acc__item--peek>.acc__body::after{content:'';position:absolute;left:0;right:0;bottom:0;height:72%;pointer-events:none;z-index:1;-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);-webkit-mask-image:linear-gradient(rgba(0,0,0,0),#000 65%);mask-image:linear-gradient(rgba(0,0,0,0),#000 65%)}
.mB #work .acc__item>input:checked~.acc__body::after{display:none}

@media(prefers-reduced-motion:reduce){
  .mB .ch,.mB .frame.rv,.mB #fit .split__media .frame,.mB .hero__copy .eyebrow,.mB .hero__sub,.mB .hero__cta,.mB .hero__ai,.mB .form-hero__copy>p,.mB .form-hero__copy #briefOpen{opacity:1;transform:none;filter:none;transition:none}
  .mB .hero img{animation:none;transform:none}
  .mB .reel__img{filter:none}
  .mB .acc__item>input:checked~.acc__body .grid figure,.mB .frame.in .acc__item--peek>.acc__body .grid figure{animation:none}
  .mB .glow{transform:none}
}
