/* Strony programu partnerskiego (/partner, /partner/rejestracja) — wspólny styl. */
@font-face { font-family: "Fraunces"; src: url(/static/fonts/fraunces-latin-wght-normal.woff2) format("woff2"); font-weight: 300 900; font-display: swap; unicode-range: U+0000-00FF, U+2000-206F, U+20AC; }
@font-face { font-family: "Fraunces"; src: url(/static/fonts/fraunces-latin-ext-wght-normal.woff2) format("woff2"); font-weight: 300 900; font-display: swap; unicode-range: U+0100-02AF; }
@font-face { font-family: "Jakarta"; src: url(/static/fonts/plus-jakarta-sans-latin-wght-normal.woff2) format("woff2"); font-weight: 200 800; font-display: swap; unicode-range: U+0000-00FF, U+2000-206F, U+20AC; }
@font-face { font-family: "Jakarta"; src: url(/static/fonts/plus-jakarta-sans-latin-ext-wght-normal.woff2) format("woff2"); font-weight: 200 800; font-display: swap; unicode-range: U+0100-02AF; }
:root { --ak: #1f3a5f; --tlo: #fdfbf7; --tlo2: #f4efe6; --karta: #fff; --tekst: #1c1a17; --szary: #6e675d; --linia: rgba(28,26,23,.1); --zloto: #b8893b; --ok: #0f766e; --zle: #b91c1c; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--tlo); color: var(--tekst); font: 16px/1.6 Jakarta, system-ui, sans-serif; -webkit-font-smoothing: antialiased; }
a { color: var(--ak); }
h1, h2, h3 { font-family: Fraunces, Georgia, serif; font-weight: 500; line-height: 1.15; letter-spacing: -.01em; margin: 0 0 .5em; }
.w { max-width: 1120px; margin: 0 auto; padding: 0 20px; }
header { position: sticky; top: 0; z-index: 5; background: rgba(253,251,247,.92); backdrop-filter: blur(10px); border-bottom: 1px solid var(--linia); }
header .w { display: flex; align-items: center; justify-content: space-between; height: 62px; }
.marka { font-family: Fraunces, serif; font-size: 22px; color: var(--tekst); text-decoration: none; }
.marka small { font-family: Jakarta, sans-serif; font-size: 12px; color: var(--szary); letter-spacing: .08em; text-transform: uppercase; margin-left: 8px; }
.g { display: inline-flex; align-items: center; justify-content: center; gap: 8px; background: var(--ak); color: #fff; border: 0; border-radius: 4px; padding: 14px 26px; font: 600 16px Jakarta, sans-serif; text-decoration: none; cursor: pointer; transition: transform .15s, box-shadow .15s; }
.g:hover { opacity: .9; }
.g:disabled { opacity: .55; cursor: wait; transform: none; }
.g.drugi { background: transparent; color: var(--tekst); border: 1px solid var(--linia); }
.g.maly { padding: 9px 18px; font-size: 14px; }
.hero { padding: 72px 0 40px; }
.hero .w { display: grid; grid-template-columns: 1.15fr .85fr; gap: 48px; align-items: center; }
.etyk { display: inline-block; font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--zloto); font-weight: 700; margin-bottom: 14px; }
.hero h1 { font-size: clamp(36px, 5.4vw, 62px); }
.hero h1 em { font-style: italic; color: var(--ak); }
.lead { font-size: 19px; color: var(--szary); max-width: 560px; }
.cta { display: flex; gap: 12px; flex-wrap: wrap; margin: 28px 0 12px; }
.drobne { font-size: 13px; color: var(--szary); }
.licznik { background: var(--karta); border: 1px solid var(--linia); border-radius: 6px; padding: 30px;  }
.licznik .duza { font-family: Fraunces, serif; font-size: 54px; line-height: 1; color: var(--ak); }
.licznik .rzad { display: flex; justify-content: space-between; gap: 16px; padding: 14px 0; border-top: 1px solid var(--linia); }
.licznik .rzad:first-of-type { border-top: 0; }
.licznik b { font-size: 20px; }
section { padding: 56px 0; }
.sek-tytul { max-width: 640px; margin-bottom: 30px; }
.sek-tytul h2 { font-size: clamp(28px, 3.6vw, 40px); }
.sek-tytul p { color: var(--szary); margin: 0; }
.siatka { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.oferta { background: var(--karta); border-radius: 6px; overflow: hidden; border: 1px solid var(--linia); display: flex; flex-direction: column; }
.oferta .foto { aspect-ratio: 4/3; background: var(--tlo2) center/cover no-repeat; position: relative; }
.oferta .prow { position: absolute; left: 0; bottom: 0; background: var(--tekst); color: #fff; padding: 8px 14px; font-weight: 600; font-size: 13px; letter-spacing: .02em; }
.oferta .tr { padding: 16px 18px 18px; }
.oferta .cena { font-family: Fraunces, serif; font-size: 24px; }
.oferta .param { color: var(--szary); font-size: 14px; }
.oferta { color: inherit; text-decoration: none; transition: transform .15s; } .oferta:hover { transform: translateY(-2px); }
.oferta .nr { font-size: 12px; color: var(--szary); letter-spacing: .04em; }
.oferta .prow .calk { font-weight: 400; font-size: 12px; opacity: .85; }
.oferta .prow small { font-weight: 400; opacity: .8; }
.na-zywo { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin: -6px 0 18px; font-size: 16px; }
.na-zywo b { font-family: Fraunces, serif; font-size: 22px; }
.kropka { width: 9px; height: 9px; border-radius: 50%; background: #16a34a; box-shadow: 0 0 0 0 rgba(22,163,74,.5); animation: puls 2s infinite; }
@keyframes puls { 70% { box-shadow: 0 0 0 8px rgba(22,163,74,0); } 100% { box-shadow: 0 0 0 0 rgba(22,163,74,0); } }
.wkrotce { background: var(--tlo2); } .wkrotce h2 { margin: 8px 0 10px; } .wkrotce p { max-width: 640px; color: var(--szary); }
.wkrotce .liczby { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 22px; max-width: 640px; }
.wkrotce .liczby div { background: var(--karta); border: 1px solid var(--linia); border-radius: 6px; padding: 16px; }
.wkrotce .liczby b { display: block; font-family: Fraunces, serif; font-size: 28px; }
.wkrotce .liczby span { color: var(--szary); font-size: 14px; }
.pusto { background: var(--tlo2); border-radius: 6px; padding: 28px; color: var(--szary); }
.kroki { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; counter-reset: k; }
.krok { background: var(--karta); border: 1px solid var(--linia); border-radius: 6px; padding: 24px; }
.krok::before { counter-increment: k; content: "0" counter(k); display: block; font-family: Fraunces, serif; font-size: 30px; color: var(--zloto); margin-bottom: 10px; }
.krok h3 { font-size: 20px; }
.krok p { margin: 0; color: var(--szary); font-size: 15px; }
.atuty { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 30px; }
.atut { background: var(--karta); border: 1px solid var(--linia); border-radius: 6px; padding: 18px; }
.atut svg { width: 28px; height: 28px; fill: none; stroke: var(--ak); stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; display: block; margin-bottom: 10px; }
.atut b { display: block; margin-bottom: 4px; } .atut span { color: var(--szary); font-size: 14px; }
.fair { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.fair-koniec { margin-top: 22px; font-family: Fraunces, serif; font-size: 22px; }
.korzysci { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px 40px; list-style: none; padding: 0; margin: 0; }
.korzysci li { padding-left: 34px; position: relative; }
.korzysci li::before { content: ""; position: absolute; left: 0; top: 13px; width: 18px; height: 1px; background: var(--zloto); }
.korzysci b { display: block; }
.korzysci span { color: var(--szary); font-size: 15px; }
.cennik { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.cennik.trzy { grid-template-columns: repeat(3, 1fr); }
.plan { background: var(--karta); border: 1px solid var(--linia); border-radius: 6px; padding: 30px; }
.plan.wyr { border: 2px solid var(--ak); }
.plan .kw { font-family: Fraunces, serif; font-size: 46px; line-height: 1.1; }
.plan .kw small { font-size: 18px; color: var(--szary); }
.rej { background: var(--tekst); color: #f5f1ea; border-radius: 8px; padding: 44px; display: grid; grid-template-columns: .9fr 1.1fr; gap: 44px; }
.rej h2 { color: #fff; font-size: clamp(28px, 3.6vw, 40px); }
.rej p { color: #cfc8bc; }
.formularz { background: var(--karta); color: var(--tekst); border-radius: 6px; padding: 26px; }
.pole { margin-bottom: 14px; }
.pole label { display: block; font-weight: 600; font-size: 14px; margin-bottom: 6px; }
.pole input { width: 100%; font: 16px Jakarta, sans-serif; padding: 13px 14px; border: 1px solid var(--linia); border-radius: 12px; background: #fff; color: var(--tekst); }
.pole input:focus { outline: 2px solid var(--ak); border-color: transparent; }
.dwa { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.firma { background: var(--tlo2); border-radius: 14px; padding: 14px 16px; margin: 4px 0 16px; font-size: 15px; }
.firma b { display: block; font-size: 16px; }
.uwaga { border-radius: 12px; padding: 12px 14px; font-size: 14px; margin: 0 0 14px; background: #fff7ed; border: 1px solid #fed7aa; }
.uwaga.ok { background: #f0fdfa; border-color: #99f6e4; }
.zgoda { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; margin: 10px 0 16px; }
.zgoda input { width: 20px; height: 20px; margin-top: 2px; flex: none; accent-color: var(--ak); }
.blad { color: var(--zle); font-size: 14px; min-height: 20px; margin: 6px 0 0; }
details { border-top: 1px solid var(--linia); padding: 16px 0; }
details summary { cursor: pointer; font-weight: 600; font-size: 17px; list-style: none; }
details summary::after { content: "+"; float: right; color: var(--szary); }
details[open] summary::after { content: "–"; }
details p { color: var(--szary); margin: 10px 0 0; }
footer { border-top: 1px solid var(--linia); padding: 30px 0 46px; color: var(--szary); font-size: 14px; }
footer .w { display: flex; gap: 20px; flex-wrap: wrap; justify-content: space-between; }
@media (max-width: 900px) {
  .atuty, .fair { grid-template-columns: 1fr 1fr; }
  .hero .w, .rej, .cennik, .cennik.trzy { grid-template-columns: 1fr; }
  .siatka { grid-template-columns: 1fr 1fr; }
  .kroki { grid-template-columns: 1fr 1fr; }
  .rej { padding: 28px 20px; }
}
@media (max-width: 560px) {
  .atuty, .fair { grid-template-columns: 1fr; }
  .wkrotce .liczby { grid-template-columns: 1fr 1fr 1fr; gap: 8px; } .wkrotce .liczby b { font-size: 20px; } .wkrotce .liczby div { padding: 10px; }
  .hero { padding-top: 40px; }
  .siatka, .kroki, .korzysci, .dwa { grid-template-columns: 1fr; }
  .marka small { display: none; }
}
.kto { font-size: 16px; color: var(--tekst); max-width: 580px; margin: 0 0 16px; padding-left: 14px; border-left: 2px solid var(--zloto); }
/* Rodzaj konta w rejestracji: biuro / niezależny pośrednik (5.11) */
.typ-konta { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 18px; }
.typ-konta button { border: 1.5px solid var(--linia); background: transparent; color: inherit; border-radius: 8px; padding: 12px 10px; font: inherit; font-weight: 600; cursor: pointer; text-align: center; line-height: 1.3; }
.typ-konta button[aria-checked="true"] { border-color: var(--ak, #1f4e79); background: rgba(31, 78, 121, .08); color: var(--ak, #1f4e79); }
@media (max-width: 520px) { .typ-konta { grid-template-columns: 1fr; } }
.freelancer-sek { background: var(--tlo2, #f4efe6); }
/* Zielony CTA dla niezależnych pośredników obok niebieskiego dla biur (Seba 5.11); na telefonie pod spodem */
.g.zielony { background: #15803d; color: #fff; }
.g.zielony:hover { background: #166534; }
.cta-para { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.cta-para .g { width: 100%; text-align: center; }
@media (max-width: 640px) { .cta-para { grid-template-columns: 1fr; } .cta .g:not(.drugi) { width: 100%; } }
/* Odznaki App Store / Google Play przy opisie apki (5.11): obie 40 px netto (przycięte do znaku), lewa krawędź równo z tekstem, odstęp 8 px;
   gdy się nie mieszczą obok siebie — jedna pod drugą */
.odznaki { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: flex-start; gap: 8px; margin-top: 12px; }
.odznaki a { display: block; line-height: 0; }
.odznaki img { height: 40px; width: auto; display: block; }
.wyst-tyt { margin: 22px 0 12px; font-size: 18px; }
/* Dwulinijkowe CTA (Seba 5.11): tekst główny 600 + mniejsza, rozjaśniona druga linia; oba tej samej wysokości */
.g.g2 { flex-direction: column; gap: 2px; padding: 10px 22px; min-height: 58px; line-height: 1.2; text-align: center; }
.g.g2 span { font-weight: 600; }
.g.g2 small { font-size: 13px; font-weight: 500; opacity: .82; }
.cta { align-items: stretch; }
/* Hero: niebieski + zielony zawsze razem (równa szerokość, maks. 560 px), „Zobacz oferty →” pod nimi; ramka statystyk bez łamania kwot */
.cta-hero { margin: 28px 0 12px; max-width: 560px; }
.cta-hero .cta-para { grid-template-columns: 1fr 1fr; }
.link-oferty { display: inline-block; margin-top: 12px; font-weight: 600; color: var(--ak); text-decoration: none; }
.link-oferty:hover { text-decoration: underline; }
@media (max-width: 520px) { .cta-hero .cta-para { grid-template-columns: 1fr; } }
.rzad b { white-space: nowrap; }
/* nadtytuł hero: długa wersja na szerokich, krótka na telefonie (5.11) */
.etyk-kr { display: none; }
@media (max-width: 600px) { .etyk-dl { display: none; } .etyk-kr { display: inline; } }