/* Strona O nas (/nowa-strona-2/o-nas/, pakiet P3, 2026-10-10). Klasy .n2p-onas-*, wspolne z podstrony.css. */
.n2p-onas-hero-uklad{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);align-items:center;gap:calc(40*var(--u))}
.n2p-onas-hero h1{font-weight:600;font-size:max(38px,calc(46*var(--u)))}
.n2p-onas-przyciski{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.n2p-onas-hero-il{justify-self:center;width:min(100%,calc(360*var(--u)));height:auto;filter:drop-shadow(0 0 calc(50*var(--u)) rgba(255,106,26,.32))}

.n2p-onas-kto{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:calc(48*var(--u));align-items:center}
.n2p-onas-foto{margin:0;text-align:center}
/* grzegorz.webp to wycinek z przezroczystym tlem, uciety na lewej i dolnej krawedzi pliku.
   Ramka ma proporcje pliku i wyrazne tlo, wiec ciecie pokrywa sie z krawedzia karty (P9). */
.n2p-onas-foto-ramka{position:relative;aspect-ratio:738/900;overflow:hidden;border-radius:calc(20*var(--u));background:radial-gradient(circle at 62% 30%,rgba(255,106,26,.09),transparent 58%),linear-gradient(180deg,#fff 0%,var(--krem-2) 100%);border:1px solid rgba(17,22,42,.06);box-shadow:0 24px 50px -24px rgba(17,22,42,.35)}
.n2p-onas-foto img{width:100%;height:100%}
.n2p-onas-foto figcaption{margin-top:12px;font-size:14px;color:var(--szary)}
.n2p-onas-kto-tekst h2{margin-top:10px;font-size:max(30px,calc(34*var(--u)));letter-spacing:-.03em}
.n2p-onas-kto-tekst p{margin-top:16px;color:var(--tekst-2);font-size:max(16px,calc(10.5*var(--u)));line-height:1.65;max-width:62ch}
.n2p-onas-odznaki{list-style:none;padding:0;margin:26px 0 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.n2p-onas-odznaki li{display:flex;flex-direction:column;align-items:center;gap:10px;padding:18px 12px;background:#fff;border:1px solid rgba(17,22,42,.06);border-radius:14px;font-weight:600;font-size:14px;text-align:center;box-shadow:0 10px 24px -18px rgba(17,22,42,.3)}

.n2p-onas-zasady{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:calc(16*var(--u));margin-top:calc(32*var(--u))}
.n2p-onas-zasada{display:flex;gap:16px;align-items:flex-start;padding:max(22px,calc(20*var(--u)))}
.n2p-onas-zasada h3{font-size:17px;font-weight:700;letter-spacing:-.01em}
.n2p-onas-zasada p{margin-top:6px;color:var(--tekst-2);font-size:14.5px;line-height:1.6}

.n2p-onas-lead{margin:14px auto 0;max-width:62ch;color:var(--tekst-2)}
.n2p-onas-maska{list-style:none;margin:calc(32*var(--u)) 0 0;padding:max(20px,calc(20*var(--u)));display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:calc(36*var(--u));background:#fff;border:1px solid rgba(17,22,42,.06);border-radius:calc(18*var(--u));counter-reset:maska}
.n2p-onas-maska li{position:relative;padding:22px 16px;border-radius:14px;background:var(--krem-2);text-align:center}
.n2p-onas-maska li + li::before{content:"\2192";position:absolute;left:calc(-18*var(--u));top:50%;transform:translate(-50%,-50%);color:var(--pomarancz);font-weight:700;font-size:24px}
.n2p-onas-maska img{margin:0 auto;width:72px;height:72px;object-fit:contain;filter:drop-shadow(0 4px 8px rgba(22,33,62,.2))}
.n2p-onas-maska h3{margin-top:10px;font-size:16px;font-weight:700}
.n2p-onas-maska p{margin-top:6px;font-size:13.5px;color:var(--tekst-2);line-height:1.55}

.n2p-onas-liczby{list-style:none;padding:0;margin:calc(32*var(--u)) 0 0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:calc(16*var(--u))}
.n2p-onas-liczby li{padding:26px 20px;background:#fff;border:1px solid rgba(17,22,42,.06);border-radius:16px;text-align:center}
.n2p-onas-liczby b{display:block;color:var(--pomarancz);font-size:max(38px,calc(40*var(--u)));font-weight:700;letter-spacing:-.03em;line-height:1}
.n2p-onas-liczby span{display:block;margin-top:10px;color:var(--tekst-2);font-size:14px;line-height:1.5}

.n2p-onas-dane-uklad{max-width:900px}
.n2p-onas-dane{margin:calc(28*var(--u)) 0 0;padding:6px 26px}
.n2p-onas-dane > div{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:16px;padding:14px 0;border-bottom:1px solid rgba(17,22,42,.07)}
.n2p-onas-dane > div:last-child{border-bottom:0}
.n2p-onas-dane dt{font-weight:600}
.n2p-onas-dane dd{margin:0;color:var(--tekst-2)}
.n2p-onas-dane a{color:var(--pomarancz-2)}

@media (max-width:900px){
  .n2p-onas-hero-uklad,.n2p-onas-kto{grid-template-columns:1fr}
  .n2p-onas-hero-il{width:min(70%,300px);order:-1}
  .n2p-onas-foto{max-width:360px;margin:0 auto}
  .n2p-onas-zasady{grid-template-columns:1fr}
  .n2p-onas-maska{grid-template-columns:1fr;gap:34px}
  .n2p-onas-maska li + li::before{content:"\2193";left:50%;top:-17px}
  .n2p-onas-liczby{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:520px){
  .n2p-onas-odznaki{grid-template-columns:1fr}
  .n2p-onas-odznaki li{flex-direction:row;text-align:left;padding:12px 14px}
  .n2p-onas-dane{padding:4px 18px}
  .n2p-onas-dane > div{grid-template-columns:1fr;gap:2px}
}
.n2p-onas-hero .n2p-ap-okruszki{justify-content:flex-start}
.n2p--o-nas .n2-etykieta{text-transform:none;letter-spacing:0;font-size:15px;font-weight:600}