/* Strona odpowiedzi z banerem eksperta i listą kontrolną (27.10.2026, akceptacja Mateusza).
   Ładowane przez Makieta → arkusze; dziś tylko /ulga-br/czym-jest-dzialalnosc-br/. */

/* Układ: tekst 820 px jak dotąd + kolumna z banerem */
.br-art-uklad{display:grid;grid-template-columns:minmax(0,820px) 320px;gap:72px;justify-content:center;align-items:start}
.br-art-uklad .mk-page{padding-left:0;padding-right:0;margin:0;width:auto}
.br-art-bok{padding-top:118px;position:sticky;top:12px;align-self:start}

/* Baner eksperta — układ z gebauergroup.pl, kolory B+R */
.br-ekspert{background:var(--ink);color:#fff;border-radius:var(--radius);overflow:hidden}
.br-ekspert-foto{aspect-ratio:16/13;background:#2d2c29}
.br-ekspert-foto img{width:100%;height:100%;object-fit:cover;object-position:50% 12%;display:block}
.br-ekspert-tresc{padding:22px 24px 24px}
.br-ekspert-kto{margin:0 0 12px;font-size:14px;line-height:1.4;color:rgba(255,255,255,.72)}
.br-ekspert-kto strong{color:#fff;font-weight:600}
.br-ekspert-tytul{margin:0 0 10px;font-size:24px;line-height:1.2;font-weight:500;letter-spacing:-.01em;color:#fff}
.br-ekspert-opis{margin:0 0 16px;font-size:16px;line-height:1.5;color:rgba(255,255,255,.8)}
.br-ekspert-lista{list-style:none;margin:0 0 20px;padding:0;display:grid;gap:8px}
.br-ekspert-lista li{display:flex;align-items:center;gap:10px;font-size:15px;color:#fff}
.br-ekspert-lista svg{width:20px;height:20px;flex:none;color:var(--orange)}
.br-ekspert-btn{width:100%;justify-content:center}

/* Lista kontrolna „4 pytania” zamiast punktorów — ten sam tekst */
.mk-body .br-test{list-style:none;padding:0;margin:4px 0 24px;display:grid;grid-template-columns:1fr 1fr;gap:12px;counter-reset:brtest}
.mk-body .br-test li{margin:0;position:relative;padding:18px 18px 18px 64px;background:#fff;border:1px solid var(--line);border-radius:var(--radius);counter-increment:brtest}
.mk-body .br-test li::after{content:counter(brtest);position:absolute;top:14px;right:16px;font-size:13px;font-weight:700;color:var(--muted);letter-spacing:.04em}
.br-test-ikona{position:absolute;left:16px;top:16px;width:36px;height:36px;border-radius:50%;background:var(--lime);display:grid;place-items:center;color:var(--orange)}
.br-test-ikona svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.mk-body .br-test li p{margin:0;font-size:17px;line-height:1.45;color:var(--ink);padding-right:14px}
.mk-body .br-test li p.br-test-uwaga{margin-top:8px;font-size:15px;color:var(--orange);font-weight:600}

/* „Zwykle nie są B+R” jako etykiety */
.br-nie{margin:0 0 18px;padding:16px 18px;border:1px dashed var(--line);border-radius:var(--radius)}
.mk-body .br-nie-label{margin:0 0 10px;font-size:15px;font-weight:700;color:var(--muted)}
.mk-body .br-nie-lista{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.mk-body .br-nie-lista li{margin:0;padding:6px 12px 6px 28px;position:relative;font-size:15px;line-height:1.3;background:var(--paper);border-radius:999px;color:var(--ink)}
/* Przykłady „B+R / nie B+R” jako rozwijane panele (czym-jest-dzialalnosc-br) */
.br-przyklady{margin:4px 0 28px;display:grid;gap:10px}
.br-przyklad{background:#fff;border:1px solid var(--line);border-radius:var(--radius);transition:border-color .2s}
.br-przyklad[open]{border-color:#c9c4b9}
.br-przyklad summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:14px;padding:14px 18px;font-size:18px;font-weight:600;line-height:1.3;color:var(--ink)}
.br-przyklad summary::-webkit-details-marker{display:none}
.br-przyklad summary:hover .br-przyklad-tytul{color:var(--orange)}
.br-przyklad-ikona{flex:none;width:36px;height:36px;border-radius:50%;background:var(--lime);display:grid;place-items:center;color:var(--orange)}
.br-przyklad svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.br-przyklad-strzalka{flex:none;margin:-4px 4px 0 auto;width:9px;height:9px;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:rotate(45deg);transition:transform .2s,margin .2s}
.br-przyklad[open] .br-przyklad-strzalka{transform:rotate(-135deg);margin-top:4px}
.br-przyklad-para{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:0 18px 18px}
.br-przyklad-tak,.br-przyklad-nie{padding:14px 16px;border-radius:var(--radius)}
.br-przyklad-tak{background:#e9f2ec}
.br-przyklad-nie{background:var(--paper)}
.mk-body .br-przyklad-para p{margin:0;font-size:16px;line-height:1.5;color:var(--ink)}
.mk-body .br-przyklad-para p.br-przyklad-etykieta{display:flex;align-items:center;gap:6px;margin:0 0 6px;font-size:14px;font-weight:700;letter-spacing:.02em}
.mk-body .br-przyklad-tak p.br-przyklad-etykieta{color:#2f7d4f}
.mk-body .br-przyklad-nie p.br-przyklad-etykieta{color:#b3322a}
.br-przyklad-etykieta svg{width:16px;height:16px;stroke-width:2.4}
@media(max-width:760px){.br-przyklad-para{grid-template-columns:1fr}.br-przyklad summary{font-size:17px;padding:12px 14px}.br-przyklad-para{padding:0 14px 14px}}

.mk-body .br-nie-lista li::before{content:"";position:absolute;left:12px;top:50%;width:9px;height:9px;transform:translateY(-50%);background:linear-gradient(45deg,transparent 42%,var(--muted) 42% 58%,transparent 58%),linear-gradient(-45deg,transparent 42%,var(--muted) 42% 58%,transparent 58%)}

/* Oś czasu terminu korekty (wstecz-i-korekta) */
.mk-body .br-os{list-style:none;margin:20px 0 24px;padding:22px 14px 20px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));background:#fff;border:1px solid var(--line);border-radius:var(--radius)}
.mk-body .br-os li{margin:0;padding:0 10px;position:relative;text-align:center}
.mk-body .br-os li:not(:last-child)::after{content:"";position:absolute;top:7px;left:50%;width:100%;height:2px;background:var(--line)}
.br-os-punkt{display:block;position:relative;z-index:1;width:16px;height:16px;margin:0 auto 10px;border-radius:50%;background:#fff;border:2px solid var(--muted);box-sizing:border-box}
.br-os-koniec .br-os-punkt{background:var(--orange);border-color:var(--orange)}
.mk-body .br-os p{margin:0}
.mk-body .br-os p.br-os-data{font-size:18px;font-weight:600;line-height:1.25;color:var(--ink)}
.mk-body .br-os-koniec p.br-os-data{color:var(--orange)}
.mk-body .br-os p.br-os-opis{margin-top:4px;font-size:15px;line-height:1.4;color:var(--muted)}
@media(max-width:560px){
  .mk-body .br-os{grid-template-columns:1fr;padding:18px 16px 2px}
  .mk-body .br-os li{padding:0 0 18px 30px;text-align:left}
  .mk-body .br-os li:not(:last-child)::after{top:16px;left:7px;width:2px;height:calc(100% - 16px)}
  .br-os-punkt{position:absolute;left:0;top:2px;margin:0}
}

/* Trzy poziomy weryfikacji (kontrola-i-interpretacja) */
.mk-body .br-etapy{list-style:none;padding:0;margin:8px 0 24px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;counter-reset:bretap}
.mk-body .br-etapy li{margin:0;position:relative;padding:16px;background:#fff;border:1px solid var(--line);border-radius:var(--radius);counter-increment:bretap}
.mk-body .br-etapy li::before{content:counter(bretap);display:grid;place-items:center;width:32px;height:32px;margin-bottom:10px;border-radius:50%;background:var(--lime);color:var(--orange);font-size:15px;font-weight:700}
.mk-body .br-etapy li:not(:last-child)::after{content:"";position:absolute;top:31px;right:-15px;width:14px;height:2px;background:var(--orange)}
.mk-body .br-etapy p{margin:0;font-size:15px;line-height:1.45;color:var(--ink)}
.mk-body .br-etapy p.br-etapy-tytul{margin-bottom:6px;font-size:17px;font-weight:600;line-height:1.3}
@media(max-width:760px){
  .mk-body .br-etapy{grid-template-columns:1fr}
  .mk-body .br-etapy li:not(:last-child)::after{top:auto;right:auto;bottom:-15px;left:31px;width:2px;height:14px}
}

/* Podział kwoty ulgi w przykładzie (strata) */
.br-podzial{margin:8px 0 24px;padding:16px 18px 18px;background:#fff;border:1px solid var(--line);border-radius:var(--radius)}
.mk-body .br-podzial-tytul{margin:0 0 10px;font-size:15px;font-weight:700;color:var(--muted)}
.br-podzial-pasek{display:grid;grid-template-columns:2fr 3fr;gap:3px}
.br-podzial-teraz,.br-podzial-potem{padding:12px 14px;border-radius:var(--radius);color:var(--ink)}
.br-podzial-teraz{background:var(--orange)}
.br-podzial-potem{background:var(--lime)}
.mk-body .br-podzial-pasek p{margin:0;font-size:14px;line-height:1.35;color:inherit}
.mk-body .br-podzial-pasek p.br-podzial-kwota{font-size:18px;font-weight:600}
@media(max-width:560px){.br-podzial-pasek{grid-template-columns:1fr}}

/* Poniżej 1190: jedna kolumna, baner poziomo pod tekstem. Zastępuje dolny blok kontaktu,
   który mówi to samo — inaczej to samo pytanie stoi dwa razy pod rząd. */
@media(max-width:1190px){
  .br-art-uklad{grid-template-columns:minmax(0,820px);gap:0}
  .br-art-uklad #kontakt{display:none}
  .br-art-bok{position:static;padding:0 0 56px}
  .br-ekspert{display:grid;grid-template-columns:minmax(200px,36%) 1fr}
  .br-ekspert-foto{aspect-ratio:auto;min-height:100%}
  .br-ekspert-tresc{padding:26px 28px;align-self:center}
  .br-ekspert-btn{width:auto}
}
@media(max-width:760px){.mk-body .br-test{grid-template-columns:1fr}}
@media(max-width:560px){
  .br-art-bok{padding-bottom:40px}
  .br-ekspert{display:block}
  .br-ekspert-foto{aspect-ratio:4/3}
  .br-ekspert-tresc{padding:20px 20px 22px}
  .br-ekspert-tytul{font-size:22px}
  .br-ekspert-btn{width:100%}
}
