/* Realizacje: ciemny start z „murem” zrzutów (trzy kolumny płyną w pionie, przechylone w 3D), ciemne sekcje Sellteo,
   agentów AI i demo, jasne strony klientów i projekty sklepów, ciemne zakończenie. Karty przybliżają zrzut po najechaniu. */
.btn.bialy{background:#fff;border-color:#fff;color:var(--ink)}
.btn.bialy:hover{background:#E6E8FF;border-color:#E6E8FF;color:var(--ink)}
.link.jasny{color:#fff;border-color:#22D3EE}
.link.jasny:hover{color:#A5F3FC}

/* start */
.rz-hero{position:relative;overflow:hidden;min-height:min(calc(100svh - 64px),820px);display:flex;align-items:center;color:#fff;padding:clamp(60px,8vw,120px) 0;
  background:radial-gradient(40% 60% at 15% 55%,rgba(79,70,229,.28),transparent 70%),linear-gradient(180deg,#04050D,#0A0D26)}
.rz-mur{position:absolute;top:-10%;bottom:-10%;right:-6%;width:62%;perspective:1600px;pointer-events:none;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 30%),linear-gradient(180deg,transparent,#000 14%,#000 86%,transparent);-webkit-mask-composite:source-in;
  mask-image:linear-gradient(90deg,transparent,#000 30%);}
.rz-mur::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#04050D,transparent 18%,transparent 82%,#0A0D26)}
.rz-mur-in{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;height:100%;transform:rotateY(-20deg) rotateX(14deg) rotateZ(4deg);transform-origin:30% 50%}
.rz-kol{display:flex;flex-direction:column;gap:18px;animation:rz-plyn 60s linear infinite}
.rz-kol.k1{animation-duration:78s;animation-direction:reverse}
.rz-kol.k2{animation-duration:68s}
.rz-kol img{width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;object-position:top;border-radius:10px;box-shadow:0 30px 60px -24px rgba(0,0,0,.9),0 0 0 1px rgba(255,255,255,.12)}
@keyframes rz-plyn{to{transform:translateY(-50%)}}
.rz-txt{position:relative;z-index:2}
.rz-znak{display:inline-flex;align-items:center;gap:10px;margin-bottom:22px;font-weight:600;font-size:14.5px;color:rgba(255,255,255,.62)}
.rz-znak::before{content:"";width:9px;height:9px;border-radius:50%;background:#34D399;box-shadow:0 0 0 4px rgba(52,211,153,.18),0 0 18px #34D399}
.rz-txt h1{max-width:11ch;font-size:clamp(44px,5.6vw,88px);letter-spacing:-.04em;line-height:.96}
.rz-txt .lead{margin-top:24px;max-width:44ch;color:rgba(255,255,255,.74)}
.rz-cta{display:flex;align-items:center;gap:16px 26px;flex-wrap:wrap;margin-top:32px}

/* wspólne: karty przybliżają zrzut */
.proj .shot,a.shot{position:relative;overflow:hidden}
.proj .shot img,a.shot img{transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.proj:hover .shot img,a.shot:hover img{transform:scale(1.045)}
.proj:hover .shot,a.shot:hover{box-shadow:0 30px 60px -26px rgba(79,70,229,.55),0 0 0 1px rgba(99,102,241,.45)}
.proj .go,.row .go{border-bottom-color:#4F46E5}
.proj .go::after,.row .go::after{content:" ↗";color:#4F46E5}

/* sekcje ciemne */
.rz-ciemna{color:#fff;background:radial-gradient(60% 420px at 50% 0%,rgba(79,70,229,.22),transparent 70%),linear-gradient(180deg,#0A0D26,#05060F)}
.rz-ciemna.rz-ai{background:linear-gradient(180deg,#05060F,#0A0D26)}
.rz-ciemna.rz-dema{background:radial-gradient(50% 60% at 15% 100%,rgba(6,182,212,.14),transparent 70%),linear-gradient(180deg,#0A0D26,#05060F)}
.rz-ciemna .head h2{font-size:clamp(34px,4.4vw,64px);letter-spacing:-.03em}
.rz-ciemna .lead{color:rgba(255,255,255,.72)}
.rz-ciemna .link{color:#fff;border-color:#22D3EE}
.rz-ciemna .proj p,.rz-ciemna .body p:last-of-type{color:rgba(255,255,255,.7)}
.rz-ciemna .tags,.rz-ciemna .tags i{color:#67E8F9}
.rz-ciemna .foot{border-color:rgba(255,255,255,.12)}
.rz-ciemna .num{background:linear-gradient(120deg,#fff 30%,#A5B4FC 70%,#67E8F9);-webkit-background-clip:text;background-clip:text;color:transparent}
.rz-ciemna .num small{color:rgba(255,255,255,.6);-webkit-text-fill-color:rgba(255,255,255,.6)}
.rz-ciemna .go{color:#fff;border-bottom-color:#22D3EE}
.rz-ciemna .go::after{color:#22D3EE}
.rz-ciemna .shot{box-shadow:0 40px 80px -30px rgba(0,0,0,.9),0 0 0 1px rgba(255,255,255,.14)}
.rz-ciemna .proj:hover .shot{box-shadow:0 30px 70px -24px rgba(34,211,238,.4),0 0 0 1px rgba(103,232,249,.5)}
.rz-ciemna .feat{position:relative}
.rz-ciemna .feat .shot::before{content:"";position:absolute;z-index:-1;inset:8% 4% 12%;border-radius:50%;background:radial-gradient(closest-side,rgba(99,102,241,.45),rgba(6,182,212,.18) 60%,transparent);filter:blur(34px)}
.rz-ciemna .feat .shot{overflow:visible;background:none}
.rz-ciemna .feat .shot img{border-radius:var(--r)}
.rz-ciemna .g3 .proj,.rz-ciemna .grid2 .proj{padding:14px 14px 18px;border-radius:16px;background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.015));box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.rz-ciemna .g3 .proj .body,.rz-ciemna .grid2 .proj .body{padding:0 6px}

/* jasne: numery w kolorze kina */
.row .idx{background:linear-gradient(135deg,#4F46E5,#06B6D4);-webkit-background-clip:text;background-clip:text;color:transparent}

/* zakończenie */
.rz-koniec{color:#fff;background:radial-gradient(55% 80% at 85% 100%,rgba(79,70,229,.38),transparent 70%),radial-gradient(35% 50% at 10% 0%,rgba(6,182,212,.14),transparent 70%),linear-gradient(180deg,#0A0D26,#05060F)}
.rz-koniec .lead{color:rgba(255,255,255,.72)}
.rz-koniec p:last-child{align-items:center;gap:20px 28px!important}

@media (max-width:900px){
  .rz-hero{min-height:0;align-items:flex-start;padding-bottom:300px}
  .rz-mur{top:auto;bottom:-40px;height:360px;right:-10%;width:120%;-webkit-mask-image:linear-gradient(180deg,transparent,#000 40%);mask-image:linear-gradient(180deg,transparent,#000 40%)}
  .rz-mur-in{grid-template-columns:repeat(3,1fr);transform:rotateX(30deg) rotateZ(-6deg)}
}
@media (prefers-reduced-motion:reduce){.rz-kol{animation:none}.proj .shot img,a.shot img{transition:none}}