/* ============================================================
   strona-partnerzy - master partner page, v2 (2026-10-21: less copy, more air, photo slots).
   Layered on assets/css/base.css (shared tokens and components).
   Look: light brand hero with the form card beside the H1 and a photo under the copy, proof strip,
   one accent per section, photo alternating sides on desktop, navy closing band.
   Photo slots (swap the file, no HTML change): assets/img/foto-hero.webp 3:2, foto-edu.webp 1:1,
   foto-prezes.webp 1:1 (team strip, closing form) and foto-prezes-2.webp 1:1 ("Kim jesteśmy"): the owner's two new
   photos of Eugeniusz, alternating down the page (2026-10-22). Every slot is cropped with object-fit: cover.
   ============================================================ */
:root {
  --money-ink: #cc4422; /* darkest stop of the CTA gradient: 4.7:1 on white */
  --money-bg: #fff4f0;
  --paper: #fbf7f1; /* warm paper: only #dla-kogo and #prowizja */
  --sand: #f4ece1;
  --sand-line: #e8dccb;
  --measure: 62ch; /* longest body line */
  --block-gap: clamp(32px, 5vw, 64px); /* gap between blocks inside a section */
}

/* ---------- Header ---------- */
.site-header {
  position: relative;
  z-index: 5;
}
.brand img {
  height: 30px;
  width: auto;
}
.header-phone .ico {
  width: 18px;
  height: 18px;
  color: var(--coral-600);
}
@media (max-width: 420px) {
  .brand img {
    height: 24px;
  }
  .header-phone {
    font-size: 0.95rem;
  }
}

/* ---------- Photo slot (shared) ---------- */
.photo {
  margin: 0;
  overflow: hidden;
  border-radius: var(--r-lg);
  background: var(--tint);
  box-shadow: var(--sh-md);
}
.photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* ---------- Hero ---------- */
.hero {
  position: relative;
  overflow: hidden;
  padding: clamp(24px, 5vw, 64px) 0 clamp(40px, 6vw, 88px);
  background:
    radial-gradient(
      55% 60% at 92% 0%,
      rgba(255, 109, 77, 0.14),
      transparent 62%
    ),
    radial-gradient(60% 55% at 0% 0%, rgba(17, 67, 109, 0.09), transparent 58%),
    linear-gradient(180deg, var(--tint-50), #fff 78%);
}
.hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
  gap: clamp(28px, 5vw, 72px);
  align-items: center;
}
.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  background: #fff;
  color: var(--navy);
  font-weight: 600;
  font-size: 0.86rem;
  padding: 7px 14px;
  border-radius: var(--pill);
  box-shadow: var(--sh-sm);
  border: 1px solid var(--line);
  line-height: 1.3;
}
.eyebrow .dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--coral);
  box-shadow: 0 0 0 4px rgba(255, 109, 77, 0.18);
  flex: 0 0 auto;
}
.hero h1 {
  font-size: clamp(2rem, 1.1rem + 3.2vw, 3.35rem);
  line-height: 1.08;
  margin-top: 18px;
  letter-spacing: -0.025em;
}
.h1-money {
  display: block;
  color: var(--money-ink);
  font-size: 1.12em;
  letter-spacing: -0.03em;
  margin-bottom: 0.06em;
}
.hero-lead {
  margin-top: 18px;
  font-size: clamp(1.05rem, 1rem + 0.35vw, 1.22rem);
  color: var(--navy-700);
  line-height: 1.5;
  max-width: 40ch;
}
.hero-actions {
  margin-top: 22px;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}
.hero-photo {
  margin-top: 30px;
  aspect-ratio: 3 / 2;
  max-width: 560px;
}

/* hero form card */
.hero-form {
  position: relative;
}
.form-title {
  margin-bottom: 6px;
}
.form-sub {
  color: var(--muted);
  font-size: 0.95rem;
  line-height: 1.5;
  margin-bottom: 18px;
}
.form-success-title {
  display: block;
  font-size: 1.2rem;
  color: var(--ok-text);
}
.form-success p {
  margin-top: 6px;
  font-weight: 600;
}
.form-success a {
  color: var(--ok-text);
  font-weight: 700;
  white-space: nowrap;
}

@media (min-width: 981px) {
  .hero-actions {
    display: none;
  } /* the form card itself is the CTA on desktop */
  /* the amount stays the biggest thing; the rest of the H1 fits two lines beside the form */
  .h1-rest {
    display: block;
    font-size: 0.8em;
    line-height: 1.12;
    text-wrap: balance;
  }
  .hero-form {
    padding: 32px 34px;
  }
  .hero-form .form-note {
    font-size: 0.8rem;
  }
}
@media (max-width: 980px) {
  .hero-grid {
    grid-template-columns: minmax(0, 1fr);
  }
  .hero-photo {
    max-width: none;
    margin-top: 26px;
  }
}
@media (max-width: 560px) {
  .hero-actions .btn {
    width: 100%;
  }
  .eyebrow {
    font-size: 0.8rem;
    padding: 6px 12px;
  }
  .hero-photo {
    margin-top: 22px;
    border-radius: var(--r);
  }
}

/* ---------- Proof strip ---------- */
.proof {
  padding-block: 22px;
  border-bottom: 1px solid var(--line);
  background: #fff;
}
/* a word from the prezes (owner 2026-10-22: Z1, Eugeniusz alone): photo, quote, signature, lawyers */
.proof:has(.z1) {
  padding-block: clamp(24px, 4vw, 40px);
  border-bottom: 0;
}
.z1 {
  margin: 0;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  grid-template-areas: "faces quote" "faces sign" "faces law";
  align-items: center;
  gap: 10px 32px;
  padding: clamp(20px, 3vw, 32px) clamp(20px, 3.4vw, 40px);
  background: var(--tint-50);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
}
.z1-faces {
  grid-area: faces;
  display: flex;
}
.z1-faces img {
  width: 120px;
  height: 120px;
  border-radius: 50%;
  object-fit: cover;
  object-position: 50% 25%;
  border: 4px solid #fff;
  box-shadow: var(--sh-md);
  background: var(--tint);
}
.z1-quote {
  grid-area: quote;
  margin: 0;
}
.z1-quote p {
  margin: 0;
  max-width: 46ch;
  font-size: clamp(1.12rem, 1rem + 0.5vw, 1.4rem);
  line-height: 1.4;
  font-weight: 600;
  color: var(--ink);
  letter-spacing: -0.01em;
  text-wrap: balance;
}
.z1-sign {
  grid-area: sign;
  display: flex;
  flex-wrap: wrap;
  gap: 2px 22px;
  font-size: 0.9rem;
  color: var(--muted);
}
.z1-sign strong {
  color: var(--ink);
  font-weight: 600;
}
.z1-law {
  grid-area: law;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  justify-self: start;
  margin-top: 6px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--navy);
  text-decoration: none;
}
.z1-law:hover span:last-child {
  text-decoration: underline;
}
.avatars.z-mini img {
  width: 32px;
  height: 32px;
  border-width: 2px;
}
.avatars.z-mini img + img {
  margin-left: -9px;
}
/* owner 2026-10-23: on phones the face stands next to the quote, not above it */
@media (max-width: 640px) {
  .z1 {
    grid-template-columns: auto minmax(0, 1fr);
    grid-template-areas: "faces quote" "faces sign" "law law";
    align-items: start;
    gap: 8px 14px;
  }
  .z1-faces img {
    width: 68px;
    height: 68px;
    border-width: 3px;
  }
  .z1-quote p {
    font-size: 1.02rem;
    line-height: 1.38;
  }
  .z1-sign {
    flex-direction: column;
    font-size: 0.85rem;
  }
}
.avatars {
  display: flex;
  flex: 0 0 auto;
}
.avatars img {
  width: 46px;
  height: 46px;
  object-position: 50% 20%;
  border-radius: 50%;
  object-fit: cover;
  border: 3px solid #fff;
  box-shadow: var(--sh-sm);
  background: var(--tint);
}
.avatars img + img {
  margin-left: -12px;
}

/* ---------- Shared bits ---------- */
.section-head {
  margin-bottom: clamp(32px, 5vw, 60px);
}
.section-head h2 {
  text-wrap: balance;
}
.section-warm {
  background: linear-gradient(180deg, var(--paper), var(--sand));
}
.card-ico {
  display: grid;
  place-items: center;
  width: 52px;
  height: 52px;
  border-radius: 14px;
  background: var(--tint);
  color: var(--navy);
  flex: 0 0 auto;
}
.card-ico .ico {
  width: 25px;
  height: 25px;
}
.section-warm .card-ico {
  background: #fff;
  color: var(--money-ink);
  box-shadow: var(--sh-sm);
}

/* ---------- For beginners: three figures + photo (photo right on desktop) ---------- */
.edu-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
  gap: var(--block-gap);
  align-items: center;
}
.edu-stats {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 18px;
}
.edu-stats li {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--r);
  padding: 20px 24px 22px;
  box-shadow: var(--sh-sm);
}
.stat {
  display: block;
  font-size: clamp(1.9rem, 1.3rem + 1.8vw, 2.6rem);
  line-height: 1.05;
  font-weight: 750;
  letter-spacing: -0.03em;
  color: var(--money-ink);
  white-space: nowrap;
}
.edu-stats li > span {
  display: block;
  margin-top: 8px;
  max-width: 46ch;
  font-size: 1rem;
  line-height: 1.55;
}
.edu-photo {
  aspect-ratio: 1 / 1;
}
@media (max-width: 900px) {
  .edu-grid {
    grid-template-columns: minmax(0, 1fr);
  }
  .edu-photo {
    order: -1;
    aspect-ratio: 16 / 10;
    width: 100%;
    max-width: 640px;
    justify-self: center; /* owner 2026-11-04: centred under the centred heading, not stuck to the left */
  }
  .edu-photo img {
    object-position: 50% 28%;
  }
}

/* ---------- Why it sells: three open columns, no frames ---------- */
.why-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(28px, 4vw, 56px);
}
.why-item .card-ico {
  margin-bottom: 18px;
}
.why-item h3 {
  font-size: 1.18rem;
  margin-bottom: 8px;
}
.why-item p {
  font-size: 1rem;
  line-height: 1.6;
  max-width: 34ch;
}
@media (max-width: 900px) {
  .why-list {
    grid-template-columns: minmax(0, 1fr);
    gap: 26px;
  }
  .why-item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    column-gap: 16px;
    align-items: start;
  }
  .why-item .card-ico {
    grid-row: span 2;
    margin: 0;
  }
  .why-item p {
    max-width: var(--measure);
  }
}

/* ---------- Who it is for ---------- */
.who-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
}
.who-card {
  background: #fff;
  border: 1px solid var(--sand-line);
  border-radius: var(--r-lg);
  padding: 28px 26px;
  box-shadow: var(--sh-sm);
}
.who-card h3 {
  margin-top: 18px;
  font-size: 1.18rem;
}
.who-sub {
  margin-top: 8px;
  color: var(--muted);
  font-size: 0.92rem;
  line-height: 1.45;
}
.who-card p:not(.who-sub) {
  margin-top: 14px;
  font-size: 0.98rem;
  line-height: 1.55;
}
@media (max-width: 900px) {
  .who-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 14px;
  }
  .who-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    column-gap: 14px;
    align-items: center;
    padding: 20px;
    border-radius: var(--r);
  }
  .who-card h3 {
    margin: 0;
    font-size: 1.08rem;
  }
  .who-card .who-sub,
  .who-card p:not(.who-sub) {
    grid-column: 1 / -1;
  }
  .who-card .who-sub {
    margin-top: 12px;
  }
  .who-card p:not(.who-sub) {
    margin-top: 8px;
  }
  .who-card .card-ico {
    width: 44px;
    height: 44px;
    border-radius: 12px;
  }
  .who-card .card-ico .ico {
    width: 22px;
    height: 22px;
  }
}

/* ---------- How it works: four steps, one vertical timeline from the left (owner 2026-11-04) ---------- */
.section-head-start {
  margin-left: 0;
  text-align: left;
}
.how-steps {
  max-width: 680px;
}
.flow {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 10px;
}
.flow li {
  position: relative;
  display: grid;
  grid-template-columns: 56px minmax(0, 1fr);
  gap: 18px;
  align-items: start;
  padding: 14px 18px 14px 0;
}
/* the connector line between the step icons */
.flow li:not(:last-child)::after {
  content: "";
  position: absolute;
  left: 27px;
  top: 72px;
  bottom: -24px;
  width: 2px;
  border-radius: 2px;
  background: #cfdae5;
}
.flow-ico {
  display: grid;
  place-items: center;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: #fff;
  color: var(--money-ink);
  border: 2px solid #ffd3c7;
  box-shadow: var(--sh-sm);
  position: relative;
  z-index: 1;
}
.flow-ico .ico {
  width: 24px;
  height: 24px;
}
.flow-who {
  display: inline-block;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #fff;
  background: var(--money-ink);
  border-radius: var(--pill);
  padding: 2px 10px;
  line-height: 1.5;
}
.flow-body h3 {
  margin-top: 6px;
  font-size: 1.2rem;
}
.flow-body p {
  margin-top: 4px;
  font-size: 1rem;
  line-height: 1.55;
}
/* our step: the one block with a filled band, so "resztę bierzemy na siebie" is visible at a glance */
.flow .flow-we {
  background: linear-gradient(135deg, var(--navy), var(--navy-800));
  border-radius: var(--r);
  padding: 18px 20px 18px 14px;
  margin-left: -14px;
  grid-template-columns: 56px minmax(0, 1fr);
  box-shadow: var(--sh-md);
}
/* inside the navy band: no line; it starts again below the band (left = band padding + icon centre) */
.flow li.flow-we:not(:last-child)::after {
  top: auto;
  height: 24px;
  left: 41px;
}
.flow .flow-we .flow-ico {
  background: rgba(255, 255, 255, 0.12);
  border-color: rgba(255, 255, 255, 0.3);
  color: #fff;
  box-shadow: none;
}
.flow .flow-we .flow-who {
  background: #fff;
  color: var(--navy);
}
.flow .flow-we h3 {
  color: #fff;
}
.flow .flow-we p {
  color: #dce8f3;
}
.flow .flow-pay .flow-ico {
  background: var(--money-ink);
  border-color: var(--money-ink);
  color: #fff;
}
.flow-note {
  display: flex;
  gap: 10px;
  align-items: center;
  margin-top: 22px;
  font-weight: 600;
  font-size: 0.95rem;
  color: var(--navy-800);
}
.flow-note .ico {
  width: 20px;
  height: 20px;
  color: var(--coral-600);
}


/* ---------- Money (warm band) ---------- */
.money-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
  gap: var(--block-gap);
  align-items: center;
}
.money-big {
  margin-top: 16px;
  font-size: clamp(2.3rem, 1.4rem + 3.4vw, 3.8rem);
  font-weight: 750;
  line-height: 1.02;
  letter-spacing: -0.03em;
  color: var(--money-ink);
}
.money-for {
  margin-top: 8px;
  font-weight: 600;
  color: var(--navy-800);
}
.example {
  margin-top: 22px;
  background: #fff;
  border: 1px solid var(--sand-line);
  border-radius: var(--r);
  padding: 16px 20px;
  box-shadow: var(--sh-sm);
  max-width: 480px;
}
.example-tag {
  display: inline-block;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--kicker-ink);
  background: var(--money-bg);
  border: 1px solid #ffd3c7;
  border-radius: var(--pill);
  padding: 2px 10px;
  margin-bottom: 6px;
}
.example p {
  font-weight: 700;
  color: var(--ink);
  font-size: 1.1rem;
  line-height: 1.4;
}
/* commission calculator (owner 2026-10-21): two sliders inside the example card */
.calc-row {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: baseline;
  gap: 2px 12px;
  margin-top: 10px;
  font-size: 0.92rem;
}
.calc-row label {
  color: var(--muted);
}
.calc-row output {
  font-weight: 700;
  color: var(--ink);
  font-variant-numeric: tabular-nums;
}
.calc input[type="range"] {
  display: block;
  width: 100%;
  height: var(--tap);
  margin: 0;
  accent-color: var(--money-ink);
  cursor: pointer;
}
.example .calc-result {
  margin-top: 6px;
  padding-top: 12px;
  border-top: 1px solid var(--sand-line);
  font-weight: 600;
  font-size: 1rem;
}
.calc-result strong {
  display: block;
  color: var(--money-ink);
  font-size: 1.45rem;
  line-height: 1.25;
  font-variant-numeric: tabular-nums;
}
.example .calc-note {
  margin-top: 4px;
  font-weight: 400;
  font-size: 0.85rem;
  color: var(--muted);
}
.money-main > .btn {
  margin-top: 28px;
}
.money-facts {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 18px;
}
.money-facts li {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 16px;
  align-items: start;
  background: #fff;
  border: 1px solid var(--sand-line);
  border-radius: var(--r);
  padding: 22px 24px;
  box-shadow: var(--sh-sm);
}
.money-facts .card-ico {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: var(--money-bg);
  box-shadow: none;
}
.money-facts .card-ico .ico {
  width: 22px;
  height: 22px;
}
.money-facts h3 {
  font-size: 1.1rem;
  margin-bottom: 6px;
}
.money-facts p {
  font-size: 0.98rem;
  line-height: 1.55;
}
@media (max-width: 900px) {
  .money-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* ---------- Who we are: the person you meet left, the lawyers right (owner 2026-10-21) ---------- */
.about-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: var(--block-gap);
  align-items: center;
}
/* brand line above the two columns (owner 2026-10-21: the swiadczeniawspierajace.pl logo in "Kim jesteśmy") */
.about-brand {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 28px;
  padding-bottom: 28px;
  margin-bottom: 36px;
  border-bottom: 1px solid var(--line);
}
.about-logo {
  height: 40px;
  width: auto;
}
.about-brand p {
  margin: 0;
  flex: 1 1 320px;
  max-width: 56ch;
  color: var(--muted);
  font-size: 0.98rem;
  line-height: 1.5;
}
@media (max-width: 560px) {
  /* owner 2026-10-23: on phones the logo, its line and the Facebook badge are centred */
  .about-brand {
    justify-content: center;
    text-align: center;
    padding-bottom: 22px;
    margin-bottom: 26px;
  }
  .about-logo {
    height: 30px;
  }
  .about-brand p {
    font-size: 0.94rem;
  }
  .about-brand .fb-badge {
    text-align: left;
  }
}
/* Facebook followers next to the logo (owner 2026-10-22: "A, ale logo też") */
.fb-badge {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 7px 16px 7px 7px;
  border-radius: var(--pill);
  background: #fff;
  border: 1px solid var(--line);
  box-shadow: var(--sh-sm);
  color: var(--text);
  font-size: 0.92rem;
  line-height: 1.3;
  text-decoration: none;
}
.fb-badge strong {
  color: var(--ink);
}
.fb-ico {
  flex: 0 0 auto;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--navy); /* owner 2026-11-04: our navy instead of Facebook blue */
  display: grid;
  place-items: center;
}
.fb-ico svg {
  width: 18px;
  height: 18px;
  fill: #fff;
}
.fb-badge:hover strong {
  text-decoration: underline;
}
.about-people > .lawyers-label:first-child {
  margin-top: 0;
}
.ceo-card {
  margin: 0;
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr);
  gap: 24px;
  align-items: center;
  background: var(--tint-50);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  padding: 24px;
}
.ceo-card img {
  width: 150px;
  height: 150px;
  border-radius: 50%;
  object-fit: cover;
  border: 4px solid #fff;
  box-shadow: var(--sh-md);
  background: var(--tint);
}
.ceo-card figcaption {
  display: flex;
  flex-direction: column;
}
.ceo-card strong {
  font-size: 1.4rem;
  line-height: 1.2;
  letter-spacing: -0.015em;
}
.ceo-role {
  font-size: 0.95rem;
  color: var(--muted);
  font-weight: 600;
}
.ceo-line {
  margin-top: 12px;
  font-weight: 600;
  color: var(--navy-800);
  line-height: 1.45;
}
.lawyers-label {
  margin-top: 28px;
  font-size: 0.92rem;
  font-weight: 600;
  color: var(--muted);
}
.lawyer-cards {
  list-style: none;
  padding: 0;
  margin: 14px 0 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center; /* five people: three over two, the short row centred */
  gap: 14px;
}
.lawyer-cards > li {
  flex: 0 0 calc((100% - 28px) / 3);
  min-width: 0;
}
.lawyer-card {
  margin: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.lawyer-card img {
  width: 92px;
  height: 92px;
  border-radius: 50%;
  object-fit: cover;
  object-position: 50% 20%;
  border: 3px solid #fff;
  box-shadow: var(--sh-sm);
  background: var(--tint);
}
.lawyer-card figcaption {
  margin-top: 10px;
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.lawyer-card strong {
  font-size: 0.95rem;
  line-height: 1.3;
  color: var(--ink);
}
.lawyer-card figcaption > span {
  font-size: 0.85rem;
  color: var(--muted);
}
@media (max-width: 900px) {
  .about-grid {
    grid-template-columns: minmax(0, 1fr);
  }
  .about-people {
    max-width: 620px;
  }
}
@media (max-width: 560px) {
  .ceo-card {
    grid-template-columns: 104px minmax(0, 1fr);
    gap: 16px;
    padding: 18px;
    border-radius: var(--r);
  }
  .ceo-card img {
    width: 104px;
    height: 104px;
  }
  .ceo-card strong {
    font-size: 1.18rem;
  }
  .ceo-line {
    margin-top: 8px;
    font-size: 0.95rem;
  }
  .lawyers-label {
    text-align: center; /* owner 2026-10-23, over the centred cards */
  }
  .lawyer-cards {
    gap: 8px;
  }
  .lawyer-cards > li {
    flex-basis: calc((100% - 16px) / 3);
  }
  .lawyer-card img {
    width: 72px;
    height: 72px;
  }
  .lawyer-card strong {
    font-size: 0.85rem;
  }
  .lawyer-card figcaption > span {
    font-size: 0.8rem;
  }
}

/* ---------- Footer note (the amounts disclaimer lives here, not in the hero) ---------- */
.footer-note {
  max-width: 78ch;
  font-size: 0.82rem;
  line-height: 1.5;
}
.site-footer .footer-note + p {
  margin-top: 10px;
}

/* ---------- FAQ ---------- */
#pytania .faq-list {
  gap: 10px;
}
/* owner 2026-11-04: on phones the first five questions, the rest behind one button; landing.js adds
   .faq-collapsible, so without JS every question shows and the button stays hidden */
.faq-more {
  display: none;
}
@media (max-width: 620px) {
  .faq-list.faq-collapsible:not(.is-expanded) > .faq-item:nth-child(n + 6) {
    display: none;
  }
  .faq-list.faq-collapsible:not(.is-expanded) + .faq-more {
    display: flex;
    width: 100%;
    margin-top: 14px;
  }
}

/* ---------- Closing navy band ---------- */
.final-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
  gap: var(--block-gap);
  align-items: start;
}
/* three steps to the first client (owner picked closing version C, 2026-11-04) */
.final-steps {
  list-style: none;
  padding: 0;
  margin: 24px 0 0;
  display: grid;
  gap: 16px;
}
.final-steps li {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr);
  gap: 14px;
  align-items: start;
}
.final-steps b {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--coral);
  color: #fff;
  font-weight: 800;
}
.final-steps strong {
  display: block;
  font-size: 1.05rem;
}
.final-steps span {
  display: block;
  margin-top: 2px;
  line-height: 1.5;
}
.final-ceo {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: -6px 0 18px;
  padding: 10px 12px;
  border-radius: 12px;
  background: var(--navy-50, #eef4fa);
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--ink);
  line-height: 1.35;
}
.final-ceo img {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid #fff;
  flex: 0 0 auto;
}
.final-phone {
  margin-top: 20px;
  font-weight: 600;
}
.final-phone a {
  font-weight: 700;
  white-space: nowrap;
}
@media (max-width: 900px) {
  .final-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* ---------- Footer ---------- */
/* the logo takes one text line, so the about text starts level with the contact and address lines (owner 2026-10-21) */
.site-footer .brand {
  display: flex;
  min-height: 0;
  height: 24px;
}
.site-footer .brand img {
  height: 24px;
}
.footer-about {
  margin-top: 6px;
  max-width: 40ch;
}
.site-footer p + p {
  margin-top: 6px;
}

/* ---------- Sticky bar ---------- */
.sticky-money {
  display: flex;
  flex-direction: column;
  line-height: 1.2;
  flex: 0 1 auto;
  min-width: 0;
}
.sticky-money strong {
  color: var(--money-ink);
  font-size: 0.92rem;
}
.sticky-money span {
  font-size: 0.78rem;
  color: var(--muted);
}
.sticky-cta .btn {
  flex: 0 0 auto;
}

/* ---------- Phones ---------- */
@media (max-width: 620px) {
  .section {
    padding-block: 44px;
  }
  .section-head {
    margin-bottom: 26px;
  }
  .hero-photo {
    aspect-ratio: 16 / 9;
  }
  .edu-photo {
    aspect-ratio: 2 / 1;
  }
  .edu-photo img {
    object-position: 50% 22%;
  }
  .who-card {
    padding: 18px;
  }
  .who-card .who-sub {
    margin-top: 10px;
  }
  .section-head p {
    font-size: 1rem;
  }
  .hero {
    padding-bottom: 36px;
  }
  .hero-form {
    padding: 22px 18px;
  }
  .proof {
    padding-block: 18px;
  }
  .edu-stats {
    gap: 12px;
  }
  .edu-stats li {
    padding: 16px 18px 18px;
  }
  .edu-stats li > span {
    font-size: 0.96rem;
    line-height: 1.5;
  }
  .flow li {
    grid-template-columns: 46px minmax(0, 1fr);
    gap: 14px;
    padding: 8px 0;
  }
  .flow li:not(:last-child)::after {
    left: 22px;
    top: 56px;
    bottom: -18px;
  }
  .flow li.flow-we:not(:last-child)::after {
    top: auto;
    height: 18px;
    left: 32px;
  }
  .flow-ico {
    width: 46px;
    height: 46px;
  }
  .flow-ico .ico {
    width: 21px;
    height: 21px;
  }
  .flow .flow-we {
    grid-template-columns: 46px minmax(0, 1fr);
    margin-left: -10px;
    padding: 14px 14px 14px 10px;
  }
  .flow-body h3 {
    font-size: 1.08rem;
  }
  .flow-body p {
    font-size: 0.95rem;
  }
  .flow-note {
    margin-top: 16px;
    font-size: 0.92rem;
  }
  .money-big {
    margin-top: 10px;
  }
  .example {
    padding: 13px 16px;
  }
  .money-main > .btn {
    margin-top: 22px;
  }
  .money-facts {
    gap: 12px;
  }
  .money-facts li {
    padding: 16px;
    gap: 12px;
  }
  .money-facts .card-ico {
    width: 40px;
    height: 40px;
  }
  .money-facts p {
    font-size: 0.94rem;
  }
  .money-main .btn {
    width: 100%;
  }
  .lawyers-label {
    margin-top: 22px;
  }
  .faq-item summary {
    padding: 12px 18px;
    font-size: 0.98rem;
  }
  .faq-body {
    padding: 0 18px 16px;
  }
  .form-sub {
    margin-bottom: 14px;
  }
  .form-note {
    font-size: 0.8rem;
  }
  .site-footer {
    padding-block: 28px;
    font-size: 0.88rem;
  }
  .site-footer .footer-grid {
    gap: 12px;
  }
  .footer-legal {
    margin-top: 16px;
    padding-top: 12px;
  }
}