/* Układ 2026-10-20: skrócona strona główna, chmura dokumentów jako główny produkt, dodatki jako lista, CTA zamiast formularza, czytelniejsze czcionki na telefonie. */

/* Główny produkt + dodatki */
.mk-product{padding-top:24px}
.mk-product-grid{display:grid;grid-template-columns:1.25fr 1fr;gap:28px;align-items:start}
.mk-main{display:flex;flex-direction:column;background:var(--ink);color:var(--white);border-radius:var(--radius);padding:44px;position:relative;overflow:hidden}
.mk-main .small-tag{color:var(--lime-bright)}
.mk-main h3{font-size:44px;line-height:1.02;letter-spacing:-.05em;margin:18px 0 14px}
.mk-main h3 em{font-style:normal;color:var(--lime-bright)}
.mk-main>p{color:#d1ddc4;font-size:15px;line-height:1.6;max-width:520px;margin:0 0 26px}
.mk-points{list-style:none;margin:0 0 30px;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:22px 28px}
.mk-points li{display:grid;grid-template-columns:34px 1fr;gap:4px 12px;align-items:start}
.mk-points li>span{grid-row:span 2;font-size:11px;font-weight:800;color:var(--lime-bright);padding-top:3px}
.mk-points strong{font-size:16px;line-height:1.3}
.mk-points p{margin:0;color:#c3cdb9;font-size:13px;line-height:1.55}
.mk-price{display:flex;flex-wrap:wrap;gap:10px 26px;align-items:baseline;border-top:1px solid #ffffff26;padding-top:22px;margin-top:auto}
.mk-price div{display:flex;flex-direction:column}
.mk-price small{font-size:10px;letter-spacing:.12em;font-weight:800;color:#c3cdb9}
.mk-price b{font-size:26px;letter-spacing:-.03em}
.mk-price b span{font-size:13px;font-weight:600;color:#c3cdb9}
.mk-main-actions{display:flex;flex-wrap:wrap;gap:12px 22px;align-items:center;margin-top:24px}
.mk-main-actions .button{background:var(--lime-bright);color:var(--ink)}
.mk-main-actions .text-link{color:var(--white)}

.mk-addons{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:34px}
.mk-addons h3{font-size:30px;line-height:1.08;letter-spacing:-.04em;margin:12px 0 10px}
.mk-addons>p{color:var(--muted);font-size:14px;line-height:1.6;margin:0 0 14px}
.mk-addon-group{font-size:10px;letter-spacing:.14em;font-weight:800;color:#6f805e;margin:22px 0 4px}
.mk-addon{display:grid;grid-template-columns:1fr auto;gap:2px 16px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line);transition:padding .3s var(--ease)}
.mk-addon:last-of-type{border-bottom:0}
.mk-addon strong{font-size:16px}
.mk-addon span{grid-column:1;color:var(--muted);font-size:13px;line-height:1.5}
.mk-addon svg{grid-row:1/span 2;grid-column:2;width:20px;height:20px;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.mk-addon:hover{padding-left:6px}
.mk-addon:hover strong{color:var(--coral)}

/* Krótkie wezwanie do kontaktu zamiast formularza */
.mk-cta{padding-bottom:80px}
.mk-cta-box{display:grid;grid-template-columns:1.2fr 1fr;gap:30px 60px;align-items:center;background:var(--lime);border-radius:var(--radius);padding:56px}
.mk-cta-box h2{margin:0}
.mk-cta-box p{font-size:15px;line-height:1.6;margin:0 0 22px;color:var(--ink)}
.mk-cta-actions{display:flex;flex-wrap:wrap;gap:14px 24px;align-items:center}
.mk-cta-actions .email-link{font-weight:750}
.mk-cta-note{display:flex;gap:8px;align-items:center;font-size:12px;margin-top:18px;color:var(--muted)}
.mk-cta-note svg{width:16px;height:16px;stroke:currentColor;stroke-width:2.4;fill:none}

/* Przyklejony przycisk na telefonie */
.mk-sticky{display:none}

@media(max-width:1100px){
  .mk-product-grid{grid-template-columns:1fr}
  .mk-cta-box{grid-template-columns:1fr}
}
@media(max-width:640px){
  .mk-main{padding:28px 22px}
  .mk-main h3{font-size:34px}
  .mk-main>p{font-size:14px}
  .mk-points{grid-template-columns:1fr;gap:16px}
  .mk-points strong{font-size:15px}
  .mk-price b{font-size:22px}
  .mk-addons{padding:24px 20px}
  .mk-addons h3{font-size:26px}
  .mk-cta-box{padding:32px 22px}
  .mk-cta-box p{font-size:14px}
  .mk-cta-actions .button{width:100%}
  /* na telefonie zdjęcie przy „Dla kogo” tylko wydłuża stronę */
  #dla-kogo .industry-photo{display:none}
  .mk-sticky{display:flex;position:fixed;left:12px;right:12px;bottom:12px;z-index:60;justify-content:space-between;align-items:center;gap:12px;background:var(--ink);color:var(--white);border-radius:12px;padding:14px 18px;font-weight:750;font-size:14px;box-shadow:0 10px 30px #25362b40;transform:translateY(140%);transition:transform .35s var(--ease)}
  .mk-sticky svg{width:20px;height:20px;stroke:currentColor;stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round}
  .mk-sticky.show{transform:none}
  body{padding-bottom:76px}
}
@media(prefers-reduced-motion:reduce){.mk-sticky{transition:none}}

/* Czytelność na telefonie: minimalne rozmiary tekstu.
   style.css i arkusze podstron mają na ≤640/700 px wiele reguł 8–13 px; tu ustawiamy dolne granice dla treści.
   !important jest celowe – nadpisuje dziesiątki pojedynczych reguł bez ich przepisywania.
   Pomijamy elementy poglądowe (makieta okna z plikami, animacja kopii, zdjęcie w hero), gdzie małe napisy są częścią ilustracji. */
@media(max-width:700px){
  body{font-size:16px}
  main :is(p,li,dd,dt,label,legend,td,th,.plain-list,.checklist,.faq-answer):not(.document-window *,.dr-stage *,.hero-visual *,.detail-art *){font-size:16px!important;line-height:1.6}
  main :is(.scope-note,.security-note,.form-privacy,.price-note,.business-offer-note,.demo-disclaimer,.demo-footnote,.contact-note,.mk-cta-note,.pricing-clarification,.bundle-disclaimer,.bundle-result-note,.calc-help,.article-meta,.breadcrumb):not(.document-window *,.dr-stage *){font-size:14px!important;line-height:1.55}
  main :is(.eyebrow,.small-tag,.chapter-label,.offer-heading>span,.backup-topline .small-tag):not(.document-window *,.dr-stage *,.hero-visual *){font-size:11px!important;letter-spacing:.1em}
  main :is(.button,.text-link,.service-link,.email-link,.business-offer-link,.start-alternative):not(.document-window *){font-size:15px!important}
  .faq-list summary{font-size:17px!important;line-height:1.4}
  .contact-form :is(input,textarea,select),.bundle-form select{font-size:16px!important} /* 16 px zapobiega powiększaniu strony przy wpisywaniu na iPhonie */
  .contact-form :is(input,textarea)::placeholder{font-size:16px!important}
  .need-options label>span{font-size:14px!important}
  #navigation a{font-size:17px}
  .footer-top p{font-size:15px!important}
  .footer-top>div>a:not(.brand){font-size:15px!important;line-height:1.5}
  .footer-bottom p,.footer-bottom .company-details,.footer-bottom a,.footer-legal-links a{font-size:13px!important;line-height:1.6}
  .hero-proof{font-size:12px!important}
  .backup-tabs button{font-size:12px!important}
  .backup-controls>span{font-size:13px!important}
}

/* Opóźnienia punktów kopii w animacji (wcześniej style="--k:N" w HTML – blokowane przez CSP style-src 'self'). */
#wc-backup-pts rect:nth-child(1){--k:0}#wc-backup-pts rect:nth-child(2){--k:1}#wc-backup-pts rect:nth-child(3){--k:2}#wc-backup-pts rect:nth-child(4){--k:3}#wc-backup-pts rect:nth-child(5){--k:4}#wc-backup-pts rect:nth-child(6){--k:5}#wc-backup-pts rect:nth-child(7){--k:6}#wc-backup-pts rect:nth-child(8){--k:7}#wc-backup-pts rect:nth-child(9){--k:8}#wc-backup-pts rect:nth-child(10){--k:9}#wc-backup-pts rect:nth-child(11){--k:10}#wc-backup-pts rect:nth-child(12){--k:11}#wc-backup-pts rect:nth-child(13){--k:12}#wc-backup-pts rect:nth-child(14){--k:13}#wc-backup-pts rect:nth-child(15){--k:14}#wc-backup-pts rect:nth-child(16){--k:15}#wc-backup-pts rect:nth-child(17){--k:16}#wc-backup-pts rect:nth-child(18){--k:17}#wc-backup-pts rect:nth-child(19){--k:18}#wc-backup-pts rect:nth-child(20){--k:19}#wc-backup-pts rect:nth-child(21){--k:20}#wc-backup-pts rect:nth-child(22){--k:21}#wc-backup-pts rect:nth-child(23){--k:22}#wc-backup-pts rect:nth-child(24){--k:23}#wc-backup-pts rect:nth-child(25){--k:24}#wc-backup-pts rect:nth-child(26){--k:25}#wc-backup-pts rect:nth-child(27){--k:26}#wc-backup-pts rect:nth-child(28){--k:27}#wc-backup-pts rect:nth-child(29){--k:28}#wc-backup-pts rect:nth-child(30){--k:29}
