/* O nas — style tylko dla tej podstrony. Tokeny i komponenty bazowe z site.css. */

/* hero: przelot dronem nad biurowcem (własny film), dwie linie nagłówka */
.hero--onas .hero-h1{max-width:14ch}
.hero--onas .hero__sub{max-width:48ch}
.hero--onas .film video,.hero--onas .film img{object-position:50% 45%}

/* skąd jesteśmy: tekst + oś czasu, która rysuje się w miarę przewijania */
.origin{display:grid;gap:clamp(2.5rem,6vw,5rem);grid-template-columns:1fr;align-items:start}
@media (min-width:900px){.origin{grid-template-columns:minmax(0,6fr) minmax(0,5fr)}.origin__text{position:sticky;top:calc(16px + 62px + 2.5rem)}}
.origin__text p+p{margin-top:1rem}
.origin__addr{font-size:.9375rem;color:var(--fg-faint);padding-top:1.25rem;margin-top:1.75rem!important;border-top:1px solid var(--hairline)}
.tl{list-style:none;margin:0;padding:.35rem 0 0 2.25rem;position:relative}
.tl::before,.tl__line{position:absolute;left:5px;top:.35rem;bottom:.35rem;width:1px}
.tl::before{content:"";background:var(--hairline)}
.tl__line{background:var(--fg);opacity:.4;transform-origin:top}
@supports (animation-timeline:view()){
  .tl__line{opacity:1;scale:1 0;animation:tl-draw linear both;animation-timeline:view();animation-range:cover 10% cover 70%}
}
@keyframes tl-draw{to{scale:1 1}}
.tl__i{position:relative;padding:0 0 clamp(1.75rem,3vw,2.5rem)}
.tl__i:last-child{padding-bottom:0}
.tl__dot{position:absolute;left:calc(-2.25rem + 1px);top:.5em;width:9px;height:9px;border-radius:50%;background:var(--bg);border:1px solid rgb(250 250 250 / .38);box-shadow:0 0 0 0 rgb(115 96 223 / 0);transition:background 500ms var(--ease-soft),border-color 500ms var(--ease-soft),box-shadow 700ms var(--ease-out)}
.tl__i b{display:block;font-weight:500;font-size:clamp(1.125rem,1.6vw,1.375rem);letter-spacing:-.018em;line-height:1.25}
.tl__i p{margin-top:.4rem;font-size:.9375rem;max-width:42ch}
.tl__i b,.tl__i p{opacity:.42;translate:0 6px;transition:opacity 640ms var(--ease-out),translate 640ms var(--ease-out)}
.tl__i.is-on b,.tl__i.is-on p{opacity:1;translate:0 0}
.tl__i.is-on .tl__dot{background:var(--accent);border-color:var(--accent);box-shadow:0 0 0 5px rgb(115 96 223 / .18)}

/* misja: jedyna „zaprojektowana powierzchnia” na stronie – zorza z ziarnem, jedno duże zdanie */
.mission{position:relative;isolation:isolate;overflow:hidden;text-align:center;padding-block:clamp(7rem,14vw,13rem)}
.mission__bg{position:absolute;inset:0;z-index:-1;pointer-events:none;mask-image:linear-gradient(to bottom,transparent,#000 22%,#000 78%,transparent);-webkit-mask-image:linear-gradient(to bottom,transparent,#000 22%,#000 78%,transparent)}
.mission__aurora{position:absolute;inset:-25%;filter:blur(90px);opacity:.55;background:radial-gradient(40% 46% at 32% 40%,#7360DF 0%,transparent 62%),radial-gradient(34% 40% at 70% 30%,#C8B6FF 0%,transparent 64%),radial-gradient(48% 54% at 58% 82%,#3B6BFF 0%,transparent 66%);animation:aurora-drift 34s var(--ease-soft) infinite alternate;will-change:transform}
@keyframes aurora-drift{to{transform:translate3d(-3%,2%,0) scale(1.09)}}
.mission__bg::after{content:"";position:absolute;inset:0;opacity:.07;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.mission .eyebrow{margin:0}
.mission__text{margin:1rem auto 0;max-width:15ch;font-size:clamp(2.25rem,5.6vw,5rem);font-weight:500;line-height:1.04;letter-spacing:-.034em;text-wrap:balance}
.mission__body{margin:clamp(1.75rem,3vw,2.5rem) auto 0;max-width:54ch;display:grid;gap:1rem}
.mission__body p{max-width:none;font-size:clamp(1.0625rem,1.3vw,1.1875rem)}
.mission__body p:last-child{color:var(--fg)}
.mission__pillars{list-style:none;margin:clamp(3rem,5vw,4.5rem) auto 0;padding:0;display:grid;gap:1.25rem;grid-template-columns:1fr;max-width:62rem;text-align:left}
@media (min-width:768px){.mission__pillars{grid-template-columns:repeat(3,1fr);gap:clamp(1.5rem,3vw,3rem)}}
.mission__pillars li{padding-top:1.1rem;border-top:1px solid rgb(255 255 255 / .16)}
.mission__pillars b{display:block;font-weight:500;font-size:1.125rem;letter-spacing:-.018em}
.mission__pillars span{display:block;margin-top:.4rem;font-size:.9375rem;color:var(--fg-muted)}

/* komunikacja: trzy fakty + przykładowa rozmowa, wiadomość po wiadomości */
.talk{display:grid;gap:clamp(2.5rem,6vw,5rem);grid-template-columns:1fr;align-items:start}
@media (min-width:900px){.talk{grid-template-columns:minmax(0,5fr) minmax(0,7fr)}.talk__text{position:sticky;top:calc(16px + 62px + 2.5rem)}}
.talk__facts{margin:clamp(2rem,3vw,2.5rem) 0 0}
.talk__facts div{padding:1.15rem 0;border-top:1px solid var(--hairline)}
.talk__facts div:last-child{border-bottom:1px solid var(--hairline)}
.talk__facts dt{font-weight:500;font-size:1.125rem;letter-spacing:-.018em}
.talk__facts dd{margin:.35rem 0 0;font-size:.9375rem;color:var(--fg-muted);max-width:44ch}
.chat{margin:0;border:1px solid var(--hairline);border-radius:var(--r-lg);background:#0E0F12;box-shadow:inset 0 1px 0 rgb(255 255 255 / .06);overflow:hidden}
.chat__head{display:flex;align-items:center;gap:.85rem;padding:.9rem 1.25rem;border-bottom:1px solid var(--hairline)}
.chat__ava{width:40px;height:40px;border-radius:50%;overflow:hidden;background:#141227;flex:none;border:1px solid var(--hairline)}
.chat__ava img{display:block;width:100%;height:100%;object-fit:cover;transform-origin:50% 30%;scale:1.9;translate:0 2px}
.chat__head b{display:block;font-weight:500;line-height:1.2}
.chat__head b+span{font-size:.8125rem;color:var(--fg-faint)}
.chat__day{margin-left:auto;font-size:.8125rem;color:var(--fg-faint)}
.chat__body{display:flex;flex-direction:column;gap:.6rem;padding:1.25rem clamp(1rem,2vw,1.5rem) 1.5rem}
.msg{position:relative;max-width:min(80%,36ch);padding:.7rem .95rem;border-radius:18px;font-size:.9375rem;line-height:1.45}
.msg p{margin:0;max-width:none;color:var(--fg)}
.msg time{display:block;margin-top:.3rem;font-size:.6875rem;color:var(--fg-faint);text-align:right;font-variant-numeric:tabular-nums}
.msg--in{align-self:flex-start;background:rgb(255 255 255 / .07);border:1px solid rgb(255 255 255 / .08);border-bottom-left-radius:6px}
.msg--out{align-self:flex-end;background:rgb(115 96 223 / .22);border:1px solid rgb(115 96 223 / .32);border-bottom-right-radius:6px}
.msg--file{display:flex;align-items:center;gap:.75rem;padding:.7rem 1rem .7rem .8rem}
.msg__doc{width:30px;height:38px;border-radius:5px;flex:none;background:rgb(255 255 255 / .1);border:1px solid rgb(255 255 255 / .18);position:relative}
.msg__doc::before,.msg__doc::after{content:"";position:absolute;left:7px;right:7px;height:2px;border-radius:1px;background:rgb(250 250 250 / .45)}
.msg__doc::before{top:12px}.msg__doc::after{top:19px;right:12px}
.msg--file p b{display:block;font-weight:500;line-height:1.3}
.msg--file p span{font-size:.75rem;color:var(--fg-faint)}
.chat figcaption{padding:.9rem 1.25rem 1rem;border-top:1px solid var(--hairline);font-size:.8125rem;color:var(--fg-faint)}

/* zasady partnerstwa: pięć kart układa się na stosie w miarę przewijania */
.pact{display:grid;gap:1rem;margin-top:clamp(3rem,5vw,4.5rem)}
.pcard{position:sticky;top:calc(16px + 62px + 1.25rem + var(--i) * 1rem);--p:0}
.pcard__in{position:relative;overflow:hidden;background:#0E0F12;border:1px solid var(--hairline);border-radius:var(--r-lg);box-shadow:inset 0 1px 0 rgb(255 255 255 / .06);padding:clamp(4.5rem,9vw,6rem) clamp(1.25rem,3vw,3rem) clamp(2rem,4vw,3rem);min-height:clamp(18rem,42vh,23rem);display:flex;flex-direction:column;justify-content:center;gap:1rem;transform-origin:50% 0;scale:calc(1 - var(--p) * .05)}
.pcard__in::after{content:"";position:absolute;inset:0;background:var(--bg);opacity:calc(var(--p) * .62);pointer-events:none}
.pcard__top{position:absolute;left:clamp(1.25rem,3vw,3rem);right:clamp(1.25rem,3vw,3rem);top:clamp(1.25rem,2.4vw,1.75rem);display:flex;justify-content:space-between;align-items:center;gap:1rem;font-size:.8125rem;color:var(--fg-faint);font-variant-numeric:tabular-nums}
.pcard__tag{padding:.3rem .7rem;border-radius:var(--r-pill);border:1px solid rgb(115 96 223 / .55);color:var(--fg);font-size:.75rem;letter-spacing:.02em}
.pcard__tag--soft{border-color:var(--hairline);color:var(--fg-muted)}
.pcard h3{font-size:clamp(1.5rem,3vw,2.5rem);font-weight:500;letter-spacing:-.028em;line-height:1.08;max-width:18ch;text-wrap:balance}
.pcard p{font-size:clamp(1rem,1.2vw,1.125rem);max-width:56ch}

/* zespół: awatary w układzie bento, założyciele większi, rola po najechaniu */
.bento{list-style:none;margin:clamp(3rem,5vw,4.5rem) 0 0;padding:0;display:grid;gap:clamp(.6rem,1.2vw,1rem);grid-template-columns:repeat(2,1fr)}
@media (min-width:768px){.bento{grid-template-columns:repeat(4,1fr)}}
.bento li{position:relative;aspect-ratio:1;border-radius:var(--r-lg);overflow:hidden;background:#141227;border:1px solid var(--hairline)}
.bento__big{grid-column:span 2;grid-row:span 2}
.bento figure{margin:0;position:absolute;inset:0}
.bento img{position:absolute;inset:-3% 0 0;width:100%;height:106%;object-fit:cover;object-position:50% 40%;animation:drift 7s ease-in-out infinite;animation-delay:calc(var(--i) * -.85s);transition:scale 700ms var(--ease-soft)}
.bento li:hover img{scale:1.04}
@keyframes drift{50%{translate:0 -5px}}
.bento figcaption{position:absolute;inset:auto 0 0 0;padding:2.75rem .9rem .85rem;background:linear-gradient(to top,rgb(8 9 10 / .88),rgb(8 9 10 / 0));display:grid;gap:.1rem}
.bento__big figcaption{padding:3.5rem 1.25rem 1.15rem}
.bento b{font-weight:500;font-size:1rem;letter-spacing:-.014em;line-height:1.2}
.bento__big b{font-size:clamp(1.25rem,2vw,1.625rem)}
.bento figcaption span{font-size:.75rem;color:rgb(250 250 250 / .64)}
.bento__big figcaption span{font-size:.875rem}
.bento em{font-style:normal;font-size:.8125rem;line-height:1.4;color:var(--fg-muted);max-height:0;opacity:0;translate:0 6px;overflow:hidden;transition:max-height 420ms var(--ease-out),opacity 420ms var(--ease-out),translate 420ms var(--ease-out),margin 420ms var(--ease-out)}
.bento li:hover em,.bento li:focus-within em,.bento__big em{max-height:4rem;opacity:1;translate:0 0;margin-top:.35rem}
.bento__big em{font-size:.9375rem;max-width:34ch}
.bento__note{aspect-ratio:1;background:var(--surface);display:grid;align-content:end;padding:1rem}
.bento__note b{display:block;font-size:1.0625rem;letter-spacing:-.016em;margin-bottom:.35rem}
.bento__note p{font-size:.875rem;color:var(--fg-muted);max-width:none;line-height:1.45}
@media (max-width:767px){.bento__note{grid-column:span 2;aspect-ratio:auto;min-height:7rem}}

/* opinie: jeden duży cytat, dwa mniejsze, gwiazdki, wolny pas logotypów */
.rev__score{display:flex;align-items:center;flex-wrap:wrap;gap:.5rem .75rem;margin-top:1.25rem;font-size:.9375rem;color:var(--fg-muted);max-width:none}
.rev__score b{font-weight:500;color:var(--fg)}
.stars{display:inline-flex;gap:2px}
.stars svg{width:15px;height:15px;fill:var(--accent)}
.rev{display:grid;gap:clamp(2rem,4vw,3.5rem);margin-top:clamp(3rem,5vw,4.5rem);grid-template-columns:1fr}
@media (min-width:900px){.rev{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}}
.rev figure{margin:0;display:flex;flex-direction:column;gap:1.25rem;padding-top:1.5rem;border-top:1px solid var(--hairline)}
.rev blockquote{margin:0;text-wrap:pretty;color:var(--fg)}
.rev__lead blockquote{font-size:clamp(1.375rem,2.4vw,2.125rem);font-weight:500;letter-spacing:-.024em;line-height:1.22}
.rev__more{display:grid;gap:clamp(1.5rem,2.5vw,2.25rem);align-content:start}
.rev__more blockquote{font-size:1.0625rem;line-height:1.5;color:var(--fg-muted)}
.rev figcaption{margin-top:auto;font-size:.8125rem;color:var(--fg-faint)}
.rev figcaption b{display:block;font-weight:500;color:var(--fg-muted);font-size:.9375rem}
.marq{margin-top:clamp(3.5rem,6vw,5.5rem);padding-block:1.6rem;border-block:1px solid var(--hairline);overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.marq__track{display:flex;width:max-content;animation:marq 70s linear infinite}
.marq:hover .marq__track{animation-play-state:paused}
.marq__half{display:flex;align-items:center;gap:clamp(2.5rem,5vw,4.5rem);padding-right:clamp(2.5rem,5vw,4.5rem);flex:none}
.marq img{height:28px;width:auto;display:block;opacity:.72;transition:opacity var(--d-hover) var(--ease-soft)}
.marq img:hover{opacity:1}
@keyframes marq{to{transform:translateX(-50%)}}
.marq__note{margin-top:1rem;font-size:.8125rem;color:var(--fg-faint);max-width:none}
.marq__note a{color:var(--fg-muted);border-bottom:1px solid var(--hairline)}
.marq__note a:hover{color:var(--fg)}

/* zakończenie: rozmowa + co się wydarzy */
.end{display:grid;gap:clamp(2.5rem,6vw,5rem);grid-template-columns:1fr;align-items:start}
@media (min-width:900px){.end{grid-template-columns:minmax(0,6fr) minmax(0,6fr)}}
.end__actions{display:flex;align-items:center;gap:1.5rem;flex-wrap:wrap;margin-top:2rem}
.end__actions .btn--ghost{font-size:1.0625rem;font-variant-numeric:tabular-nums}
.end__meta{margin-top:1.25rem;font-size:.9375rem;color:var(--fg-faint);max-width:none}
.end__meta a{color:var(--fg-muted)}
.end__meta a:hover{color:var(--fg)}
.next{list-style:none;margin:0;padding:0;border-top:1px solid var(--hairline)}
@media (min-width:900px){.next{margin-top:.6rem}}
.next li{display:grid;grid-template-columns:2.25rem minmax(0,1fr);gap:1rem;padding:1.35rem 0;border-bottom:1px solid var(--hairline)}
.next__n{width:2rem;height:2rem;border-radius:50%;border:1px solid var(--hairline);display:grid;place-items:center;font-size:.8125rem;color:var(--fg-muted);font-variant-numeric:tabular-nums}
.next b{display:block;font-weight:500;font-size:1.125rem;letter-spacing:-.018em}
.next p{margin-top:.35rem;font-size:.9375rem;max-width:none}

@media (prefers-reduced-motion:reduce){
  .mission__aurora,.bento img,.marq__track{animation:none}
  .tl__line{animation:none;scale:1 1;opacity:.4}
  .tl__i b,.tl__i p{opacity:1;translate:0 0;transition:none}
  .tl__dot{background:var(--accent);border-color:var(--accent);box-shadow:none}
  .pcard__in{scale:1}
  .pcard__in::after{opacity:0}
}