/* ============================================================
   Blok poznaj-hero — hero fazowy (ruda → narzędzie)
   Klasy scopowane pod .poznaj-hero-block (bez kolizji z hero-slider).
   ============================================================ */
.poznaj-hero-block{position:relative;min-height:100vh;display:flex;align-items:flex-end;padding:120px clamp(20px,5vw,56px) 64px;overflow:hidden}
.poznaj-hero-block .phero-media{position:absolute;inset:0;z-index:0;overflow:hidden;background:var(--ink)}
.poznaj-hero-block .phero-video,
.poznaj-hero-block .phero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1.2s ease;will-change:opacity}
.poznaj-hero-block .phero-img{background-size:cover;background-position:center}
.poznaj-hero-block .phero-video.on,
.poznaj-hero-block .phero-img.on{opacity:1}
/* gdy brak jakichkolwiek mediów — subtelne rudne tło */
.poznaj-hero-block .phero-media:not(:has(.on[style])):not(:has(video.on)){background:
  radial-gradient(90% 90% at 68% 42%,rgba(124,45,26,.35),transparent 60%),
  linear-gradient(120deg,#160d0a,#0c0907)}
.poznaj-hero-block .phero-mask{position:absolute;inset:0;z-index:1;pointer-events:none;
  background:
   linear-gradient(90deg,rgba(12,9,7,.92) 0%,rgba(12,9,7,.72) 34%,rgba(12,9,7,.30) 62%,rgba(124,45,26,.12) 100%),
   linear-gradient(180deg,rgba(12,9,7,.5) 0%,transparent 28%,transparent 52%,rgba(12,9,7,.88) 100%),
   radial-gradient(120% 90% at 50% 50%,transparent 52%,rgba(12,9,7,.5) 100%)}
.poznaj-hero-block .phero-mask::after{content:"";position:absolute;inset:0;mix-blend-mode:color;opacity:.32;
  background:linear-gradient(120deg,rgba(226,80,57,.5),rgba(201,123,74,.35) 60%,rgba(124,45,26,.4))}
.poznaj-hero-block .phero-tint{position:absolute;inset:0;z-index:1;pointer-events:none;mix-blend-mode:overlay;opacity:.38;
  background:radial-gradient(80% 80% at 68% 42%,rgba(237,163,107,.4),transparent 60%)}
.poznaj-hero-block .phero-copy{position:relative;z-index:3;max-width:640px}
.poznaj-hero-block h1{font-size:clamp(46px,7vw,104px);font-weight:900;line-height:.92;margin-bottom:8px}
.poznaj-hero-block h1 .hl{color:transparent;background:linear-gradient(100deg,var(--copper-hi),var(--blood) 55%,var(--blood-deep));-webkit-background-clip:text;background-clip:text}
.poznaj-hero-block .lead{max-width:500px;font-size:clamp(16px,1.5vw,19px);color:var(--muted);margin:24px 0 20px}
.poznaj-hero-block .lead strong{color:var(--bone);font-weight:600}
.poznaj-hero-block .disarm{display:inline-flex;align-items:center;gap:12px;border-left:2px solid var(--blood);padding:10px 0 10px 16px;margin:6px 0 30px;font-family:var(--body);font-size:15px;color:var(--copper-hi);font-style:italic;max-width:480px}
.poznaj-hero-block .phero-scrollcue{position:absolute;bottom:26px;right:clamp(20px,5vw,56px);z-index:3;display:flex;align-items:center;gap:12px;font-family:var(--mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.poznaj-hero-block .phero-scrollcue .ln{width:40px;height:1px;background:var(--copper);position:relative;overflow:hidden}
.poznaj-hero-block .phero-scrollcue .ln::after{content:"";position:absolute;inset:0;background:var(--blood);animation:scrollcue 2s ease-in-out infinite}
@keyframes scrollcue{0%{transform:translateX(-100%)}100%{transform:translateX(100%)}}
.poznaj-hero-block .fe2o3{position:absolute;top:96px;right:clamp(20px,5vw,56px);z-index:3;font-family:var(--mono);font-size:11px;letter-spacing:.1em;color:var(--copper-hi);border:1px solid var(--line);background:rgba(12,9,7,.55);backdrop-filter:blur(6px);padding:6px 12px}
.poznaj-hero-block .forge-steps{display:flex;gap:10px;margin-top:38px;align-items:stretch;max-width:560px}
.poznaj-hero-block .forge-step{display:flex;flex-direction:column;gap:9px;cursor:pointer;opacity:.45;transition:.4s;flex:1}
.poznaj-hero-block .forge-step.on{opacity:1}
.poznaj-hero-block .forge-step .dot{width:100%;height:3px;background:var(--hair-2);position:relative;overflow:hidden}
.poznaj-hero-block .forge-step.on .dot::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--blood),var(--copper-hi));transform:translateX(-100%);animation:pheroStepFill var(--step-dur,6s) linear forwards}
.poznaj-hero-block .forge-step.done .dot{background:var(--blood-deep)}
@keyframes pheroStepFill{to{transform:translateX(0)}}
.poznaj-hero-block .forge-step .st-i{font-family:var(--mono);font-size:10px;color:var(--muted-2)}
.poznaj-hero-block .forge-step.on .st-i{color:var(--copper)}
.poznaj-hero-block .forge-step .st-n{font-family:var(--disp);font-weight:700;font-size:15px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.poznaj-hero-block .forge-step.on .st-n{color:var(--bone)}
@media(max-width:560px){.poznaj-hero-block .forge-steps{flex-wrap:wrap}.poznaj-hero-block .forge-step .st-n{font-size:12px}}
@media(prefers-reduced-motion:reduce){.poznaj-hero-block .phero-scrollcue .ln::after{animation:none}}