/* Wdrożenie AI w firmie: dokłada do /przewodnik/przewodnik.css (papier, tusz, rdza, pikselowe kroje, przycisk, ceny) bloki strony
   pakietu: hero z Chrupkiem, porównanie czat a agent, program godzina po godzinie, narzędzia, pytania i zapytanie.
   Jedna kolumna na telefonie, bez gradientów, rozmyć i pasków z lewej; przyciski kwadratowe z twardym cieniem. */
.w-hero { padding-bottom: 18px; }
.w-hero-w { display: grid; gap: 8px 28px; align-items: center; }
@media (min-width: 820px) { .w-hero-w { grid-template-columns: 1fr 256px; } }
.w-lokalnie { margin: 0 0 16px; color: var(--szary); }
.w-akcje { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 22px; margin: 0; }
.w-link, .w-dalej a, .linki a { font-family: VT323, ui-monospace, monospace; font-size: 22px; display: inline-flex; align-items: center; min-height: 44px; }
.w-chrupek { margin: 0; justify-self: center; }
.w-chrupek img { display: block; width: 256px; max-width: 100%; height: auto; image-rendering: pixelated; }

.w-sekcja { padding: 26px 0 18px; border-top: 2px dashed var(--post-linia); scroll-margin-top: 8px; }
.w-sekcja h2 { font-size: 46px; }
.w-sekcja h3 { color: var(--tusz); font-size: 30px; margin: 0 0 6px; }
.w-lead { font-size: 18px; max-width: 40em; margin: 0 0 14px; }
.w-nad { margin: 0; font-family: VT323, ui-monospace, monospace; font-size: 20px; color: var(--temat); }
.w-sekcja ul, .w-sekcja ol { margin: 0; padding-left: 20px; }
.w-sekcja li { margin: 0 0 4px; }

.w-karta { background: var(--kafel); padding: 14px; margin: 0 3px; min-width: 0;
  box-shadow: 0 -3px 0 0 var(--tusz), 0 3px 0 0 var(--tusz), -3px 0 0 0 var(--tusz), 3px 0 0 0 var(--tusz); }
.porownanie { display: grid; gap: 18px; margin: 0 0 16px; }
@media (min-width: 720px) { .porownanie { grid-template-columns: 1fr 1fr; } }
.w-karta-agent { box-shadow: 0 -3px 0 0 var(--tusz), 0 3px 0 0 var(--tusz), -3px 0 0 0 var(--tusz), 3px 0 0 0 var(--tusz), 7px 7px 0 0 var(--zielen); }
.przyklad-zycie { background: var(--post); border: 2px solid var(--post-linia); padding: 12px 14px; max-width: 46em; }
.przyklad-zycie p { margin: 0; }
.w-pytanie { font-weight: 700; margin: 2px 0 4px !important; }

.godziny { list-style: none; padding: 0 !important; display: grid; gap: 18px; margin: 0 0 18px !important; }
@media (min-width: 720px) { .godziny { grid-template-columns: 1fr 1fr; } }
.godziny .w-karta h3 { color: var(--rdza); }
.efekt { margin: 8px 0 0; padding-top: 6px; border-top: 2px dashed var(--linia); }
.przygotuj { max-width: 46em; }
.przygotuj h3 { font-size: 26px; }

.zostaje { list-style: none; padding: 0 !important; display: grid; gap: 0 24px; }
@media (min-width: 720px) { .zostaje { grid-template-columns: 1fr 1fr; } }
.zostaje li { display: grid; padding: 8px 0; border-bottom: 1px solid var(--linia); margin: 0 !important; }
.zostaje b { font-family: VT323, ui-monospace, monospace; font-weight: 400; font-size: 23px; line-height: 1.1; color: var(--temat); }

.narzedzia { list-style: none; padding: 0 !important; display: grid; gap: 0 24px; }
@media (min-width: 720px) { .narzedzia { grid-template-columns: 1fr 1fr; } }
.narzedzia li { margin: 0 !important; border-bottom: 1px solid var(--linia); }
.narzedzia a { display: grid; grid-template-columns: 32px 1fr; gap: 0 12px; padding: 10px 0; color: var(--tusz); text-decoration: none; min-height: 44px; }
.narzedzia a:hover b, .narzedzia a:focus-visible b { color: var(--rdza); text-decoration: underline; }
.narzedzia img { grid-row: span 3; image-rendering: pixelated; margin-top: 4px; }
.narzedzia b { font-family: VT323, ui-monospace, monospace; font-weight: 400; font-size: 23px; line-height: 1.1; color: var(--temat); }
.narzedzia small { color: var(--szary); font-size: 13px; overflow-wrap: anywhere; }
.w-dalej { margin: 6px 0 0; }

#cennik .ceny { gap: 14px; padding: 0; margin: 0 3px 12px; }
@media (min-width: 720px) { #cennik .ceny { grid-template-columns: repeat(3, 1fr); } }
#cennik .ceny > li { align-content: start; margin: 0; }
.cena-zapytaj { color: var(--rdza); }
.ceny .cena-co { margin: 6px 0 0; padding-left: 18px; font-size: 14px; color: var(--tusz); }
.ceny .cena-co li { display: list-item; margin: 0 0 2px; padding: 0; background: none; border: 0; }
.cena-wartosc { display: block; font-size: 13px; color: var(--szary); margin-top: 6px; }
.uslugi-stale { margin: 12px 0 4px; font-weight: 700; max-width: 40em; }

.faq { display: grid; gap: 14px 28px; }
@media (min-width: 720px) { .faq { grid-template-columns: 1fr 1fr; } }
.faq-p h3 { font-size: 26px; line-height: 1.05; }
.faq-p p { margin: 0; }

.cta-kroki { max-width: 46em; }
.linki { list-style: none; padding: 0 !important; display: flex; flex-wrap: wrap; gap: 0 18px; }
.zasady { margin-top: 16px; max-width: 46em; background: var(--biel); border: 2px solid var(--linia); padding: 12px 14px; }
.zasady h3 { font-size: 24px; }
.zasady li { font-size: 14px; }

@media (max-width: 480px) { .w-sekcja h2 { font-size: 40px; } }