/* Wspólna warstwa wyglądu dla strony głównej i /cennik: typografia nagłówków,
   etykiety i karty pakietów. Ładowana jako ostatnia, więc zmiana kart tutaj
   działa w obu miejscach naraz. */
:root{--teal-dark:#0B5F58;--pro-accent:#9c3526}

body{font-family:"Montserrat",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;font-size:17px}
h1,h2,h3{font-family:"Playfair Display",Georgia,"Times New Roman",serif;font-weight:600;font-synthesis:none;text-wrap:balance}
h2,.section h2{font-size:clamp(34px,4.4vw,56px);line-height:1.06;letter-spacing:-.03em}
.eyebrow{font-family:"DM Mono",ui-monospace,"SFMono-Regular",Consolas,monospace;font-size:12.5px;letter-spacing:.08em}

/* Nagłówek podstrony w tym samym charakterze co hero strony głównej */
.page-hero h1{font:600 clamp(40px,6vw,76px)/1.02 "Playfair Display",Georgia,"Times New Roman",serif;letter-spacing:-.03em}
.page-hero h1 em{font-style:normal;color:var(--teal-dark)}

/* --- Karty pakietów --- */
.section.pricing{background:var(--teal-dark);padding:84px 0}
.plans{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:45px}
.plans .plan{display:flex;flex-direction:column;padding:35px;background:#F7F3EA}
.plans .plan:nth-child(2){background:#E3F5F1}
.plans .plan h3{margin:0 0 15px;color:var(--teal-dark);font:600 clamp(22px,2vw,28px)/1.15 "Playfair Display",Georgia,"Times New Roman",serif;letter-spacing:-.024em}
.plans .plan:nth-child(2) h3{color:var(--pro-accent)}
.plans .plan>p:not(.price-note){min-height:48px;margin:0}
.plans .price{display:flex;align-items:flex-end;gap:12px;margin:27px 0}
.plans .price strong{font:600 clamp(58px,6vw,72px)/.95 "Montserrat",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;letter-spacing:normal}
.plans .price span{font-size:14px}
.plans .price-note{min-height:48px;margin:0;color:#40514e;font-size:13px;line-height:1.35}
.plans .plan .button{align-self:stretch;margin-top:34px}
.plans .plan ul{display:grid;gap:10px;margin:0;padding-left:0;list-style:none}
.plans .plan li{position:relative;padding:0 0 0 25px;font-size:16px;line-height:1.35}
.plans .plan li::before{content:"✓";position:absolute;left:0;top:0;color:var(--teal-dark);font-weight:800}
.plans .plan li span{display:block}
.plans .plan li small{display:block;margin-top:4px;color:#4d5e5b;font-size:13px;line-height:1.4}
/* Nagłówek sekcji cennika na ciemnym tle: jasny tekst, czytelny kontrast */
.section.pricing .eyebrow,.section.pricing h2,.section.pricing .intro{color:#F7F3EA}
.section.pricing h2 em{color:#E3F5F1}
/* Na /cennik karty stoją tuż pod nagłówkiem strony, bez pustego pasa */
.page-hero+.section.pricing{padding-top:56px}
.pricing-more{margin:28px 0 0;text-align:center}
.pricing-more a{color:#F7F3EA;font-weight:800;text-decoration:underline;text-underline-offset:4px}

/* --- Podstrony branżowe --- */
.industry-hero h1{font:600 clamp(40px,6vw,76px)/1.02 "Playfair Display",Georgia,"Times New Roman",serif;letter-spacing:-.03em}
.industry-hero h1 em{font-style:normal;color:var(--teal-dark)}
/* Główny przycisk podstrony branżowej: ten sam limonkowy przycisk co na stronie głównej */
.industry-hero .button.industry-cta{display:inline-flex;justify-self:start;align-self:start;margin-top:8px;padding:15px 22px;background:#B9F24A;color:#121416;box-shadow:6px 6px 0 #121416;text-decoration:none}
.industry-hero .button.industry-cta:hover{background:#c9ff63}
.industry-card h2{font-size:clamp(22px,2vw,28px);line-height:1.15;letter-spacing:-.024em}

/* --- Strony prawne: to dokument, więc śródtytuły zostają małe --- */
.legal-page h1{font-weight:600;letter-spacing:-.03em}
.legal-page h2{font:600 clamp(22px,2vw,26px)/1.2 "Playfair Display",Georgia,"Times New Roman",serif;letter-spacing:-.02em}
.legal-page .eyebrow{font-size:12.5px;letter-spacing:.08em}

/* --- Strona 404 --- */
.not-found h1{font:600 clamp(40px,6vw,64px)/1.05 "Playfair Display",Georgia,"Times New Roman",serif;letter-spacing:-.03em}
.not-found .button{background:#B9F24A;color:#121416}
.not-found .button:hover{background:#c9ff63}
.not-found h1 em{font-style:normal;color:var(--teal-dark)}

/* --- Menu mobilne na podstronach: ten sam hamburger i panel co na stronie głównej --- */
.nav-toggle{display:none;width:44px;height:44px;padding:0;flex:0 0 auto;flex-direction:column;align-items:center;justify-content:center;gap:5px;background:transparent;border:1px solid #121416;border-radius:0;cursor:pointer}
.nav-toggle span{display:block;width:19px;height:2px;background:#121416;transition:transform .22s ease,opacity .18s ease}
.nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.mobile-nav{position:fixed;left:0;right:0;top:69px;bottom:0;z-index:55;display:flex;flex-direction:column;gap:4px;padding:26px 20px calc(20px + env(safe-area-inset-bottom));overflow-y:auto;background:#F7F3EA;border-top:1px solid #121416}
.mobile-nav[hidden]{display:none}
.mobile-nav nav{display:flex;flex-direction:column}
.mobile-nav nav a{display:flex;align-items:center;min-height:56px;padding:0 2px;border-bottom:1px solid #c7cfce;color:#121416;font:600 19px "Montserrat",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;letter-spacing:-.02em;text-decoration:none}
.mobile-nav-cta{display:flex;align-items:center;justify-content:space-between;min-height:54px;margin-top:22px;padding:0 18px;background:#B9F24A;color:#121416;border:1px solid #121416;box-shadow:4px 4px 0 #121416;font:700 15px "Montserrat",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;text-decoration:none;cursor:pointer}
@media(min-width:761px){.mobile-nav{display:none}}
@media(prefers-reduced-motion:reduce){.nav-toggle span{transition:none}}

/* Pole-pułapka na boty w formularzach: niewidoczne dla ludzi i czytników ekranu */
.hp-field{position:absolute!important;left:-10000px!important;width:1px;height:1px;overflow:hidden}

.cookie-settings.link-like{border:0;background:none;padding:0;font:inherit;color:inherit;text-decoration:none;cursor:pointer}
.cookie-settings.link-like:hover{text-decoration:underline}

/* --- Baner zgody na cookies: ta sama wersja co na stronie głównej, na każdej stronie.
   Oba wybory są równie łatwe do kliknięcia, bo tylko taka zgoda jest ważna. --- */
/* starsze arkusze podstron układały baner w poziomie; tu wraca układ ze strony głównej */
.cookie-banner{display:block;gap:normal;align-items:normal}
.cookie-banner>div:first-child{max-width:none}
.cookie-banner-actions{flex-shrink:1}
.cookie-banner .button.secondary{border-color:#121416;color:#121416}
/* Baner zgody na cookies.
   Strona główna w ogóle nie ładowała stylów banera  -  były wyłącznie w legal.css,
   którego index.html nie wczytuje. Efekt: surowy HTML doklejony do dołu strony.
   Te reguły są w osobnym pliku, ładowanym wszędzie tam, gdzie działa consent.js. */

.cookie-banner {
  position: fixed;
  z-index: 80;
  left: 50%;
  bottom: 32px;
  width: min(620px, calc(100vw - 40px));
  padding: 26px 28px 24px;
  background: #F7F3EA;
  border: 1px solid #121416;
  box-shadow: 8px 8px 0 #121416, 0 24px 80px rgba(15, 17, 21, .22);
  animation: cookieIn .28s cubic-bezier(.22, .61, .36, 1) both;
}

body.cookie-open::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 69;
  pointer-events: none;
  background: rgba(15, 17, 21, .16);
}

/* akcent marki na górnej krawędzi */
.cookie-banner::before {
  content: "";
  position: absolute;
  left: -1px;
  right: -1px;
  top: -1px;
  height: 5px;
  background: #B9F24A;
}

.cookie-banner b {
  display: block;
  font: 700 18px "Montserrat",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  letter-spacing: -.02em;
  color: #121416;
  margin-bottom: 7px;
}

.cookie-banner p {
  margin: 0 0 10px;
  font: 400 14px/1.6 "Montserrat",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  color: rgba(18, 20, 22, .72);
}

.cookie-banner a {
  display: inline-block;
  font: 600 12px "Montserrat",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  color: #121416;
  text-decoration: none;
  border-bottom: 1px solid rgba(18, 20, 22, .3);
  padding-bottom: 1px;
  transition: border-color .16s ease, color .16s ease;
}
.cookie-banner a:hover { color: #0B5F58; border-bottom-color: #0B5F58; }

.cookie-banner-actions {
  display: flex;
  gap: 12px;
  margin-top: 18px;
}
.cookie-choices{display:flex;gap:12px;margin:8px 0;font:600 12px "Montserrat",system-ui,-apple-system,"Segoe UI",Arial,sans-serif}.cookie-choices label{display:inline-flex;align-items:center;gap:4px}.cookie-choices input{width:16px;height:16px;accent-color:#0B5F58}

/* Przyciski banera opisane wprost, bez polegania na .button  -
   ten styl jest rozrzucony po kilku arkuszach i różni się między nimi. */
.cookie-banner .button {
  flex: 1;
  min-height: 48px;
  padding: 0 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  border: 1px solid #121416;
  border-radius: 0;
  font: 700 13px "Montserrat",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  letter-spacing: -.01em;
  cursor: pointer;
  background: #B9F24A;
  color: #121416;
  box-shadow: 3px 3px 0 #121416;
  transition: transform .14s ease, box-shadow .14s ease, background-color .16s ease;
}
.cookie-banner .button:hover { background: #c9ff63; }
.cookie-banner .button:active { transform: translate(3px, 3px); box-shadow: 0 0 0 #121416; }

.cookie-banner .button.secondary {
  background: transparent;
  color: #121416;
  box-shadow: none;
  font-weight: 600;
}
.cookie-banner .button.secondary:hover { background: rgba(18, 20, 22, .06); }

@keyframes cookieIn {
  from { opacity: 0; transform: translate(-50%, 12px); }
  to   { opacity: 1; transform: translate(-50%, 0); }
}

/* --- mobile --- */
@media (max-width: 760px) {
  .cookie-banner {
    left: 12px;
    right: 12px;
    bottom: 12px;
    width: auto;
    padding: 12px;
    box-shadow: 4px 4px 0 #121416;
    animation-name: cookieInMobile;
  }
  .cookie-banner b { margin-bottom: 3px; font-size: 14px; }
  .cookie-banner p { margin-bottom: 5px; font-size: 12px; line-height: 1.35; }
  .cookie-banner a { font-size: 11px; }
  .cookie-banner-actions { flex-direction: row; gap: 7px; margin-top: 9px; }
  .cookie-banner .button { width: auto; min-height: 40px; padding: 0 8px; font-size: 11px; }
  .cookie-choices{gap:9px;margin:5px 0;font-size:11px}
  /* dolne CTA i baner nie mogą walczyć o to samo miejsce */
  body.cookie-open .mobile-cta { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .cookie-banner { animation: none; transform: translateX(-50%); }
  .cookie-banner .button,
  .cookie-banner a { transition: none; }
}

@media (max-width: 760px) and (prefers-reduced-motion: reduce) {
  .cookie-banner { transform: none; }
}

@keyframes cookieInMobile {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: none; }
}

@media(max-width:760px){
  body{font-size:16.5px}
  h2,.section h2{font-size:clamp(30px,8.4vw,38px)}
  .page-hero h1{font-size:clamp(38px,11vw,48px);line-height:1.06}
  .section.pricing{padding:64px 0}
  .page-hero+.section.pricing{padding-top:40px}
  .plans{grid-template-columns:1fr;gap:20px}
  .plans .plan>p:not(.price-note),.plans .price-note{min-height:0}
  .plans .price strong{font-size:58px}
  .plans .plan .button{margin-top:28px}
  .industry-hero h1{font-size:clamp(38px,11vw,48px);line-height:1.06}
  .industry-card h2{font-size:22px}
  /* obrazek miał atrybut height="900" bez height:auto, więc na telefonie zajmował ponad cały ekran */
  .industry-page .industry-visual img{height:auto}
  /* style-prawne.css powiększa nagłówki na telefonie regułą z !important */
  .legal-page h2{font-size:22px!important;line-height:1.2!important}
  .nav-toggle{display:flex}
  .site-header{position:sticky;top:0;z-index:60;background:#F7F3EA}
  .site-header .nav{height:69px;overflow:visible}
  .site-header .nav>nav,.site-header .nav>.nav-cta{display:none}
  body.nav-open{overflow:hidden}
  /* Tabela porównania na telefonie: nadal jedna tabela jak na desktopie.
     Nazwa cechy idzie nad wierszem, a Standard i Pro stoją obok siebie, więc nic nie wychodzi poza ekran. */
  .plan-table-wrap{overflow:visible;box-shadow:4px 4px 0 #121416}
  .plan-table{min-width:0}
  .plan-table thead tr,.plan-table tbody tr{display:grid;grid-template-columns:1fr 1fr}
  .plan-table thead th:first-child{display:none}
  .plan-table thead th{padding:11px 12px;font-size:14px}
  .plan-table tbody th{grid-column:1/-1;width:auto;padding:12px 12px 2px;border-bottom:0;background:transparent;color:#0B5F58;font:500 11px/1.3 "DM Mono",ui-monospace,monospace;letter-spacing:.08em;text-transform:uppercase}
  .plan-table tbody td{padding:4px 12px 12px;font-size:14px;line-height:1.4}
  .plan-table tbody tr{border-bottom:1px solid #cfd7d2;background:linear-gradient(90deg,#fffdf8 50%,#e3f5f1 50%)}
  .plan-table tbody tr:last-child{border-bottom:0}
  .plan-table tbody td{border-bottom:0}
}

/* --- Stopka: linki do oferty, branż i danych firmy (wszystkie strony) --- */
.site-footer{background:var(--ink);color:#d8e2da;padding:64px 0 28px;font-size:14px}
.site-footer a,.site-footer .link-like{color:#d8e2da;text-decoration:none}
.site-footer a:hover,.site-footer .link-like:hover{color:#fff;text-decoration:underline;text-underline-offset:3px}
.footer-grid{display:grid;grid-template-columns:1.35fr 1fr 1.25fr 1fr;gap:40px}
.footer-brand .brand-lockup img{display:block;width:172px;height:auto}
.footer-brand p{margin:20px 0 16px;max-width:330px;line-height:1.6}
.footer-mail{display:inline-block;font-weight:600;color:#fff!important}
.site-footer .footer-cta{display:inline-flex;gap:12px;align-items:center;margin-top:22px;padding:12px 16px;background:var(--lime);color:var(--ink)!important;font-weight:700;font-size:13px;border:1px solid var(--lime)}
.site-footer .footer-cta:hover{text-decoration:none;background:#fff;border-color:#fff}
.footer-title{margin:4px 0 16px;font:500 11.5px "DM Mono",ui-monospace,monospace;letter-spacing:.09em;color:var(--lime)}
.footer-col ul{list-style:none;margin:0;padding:0;display:grid;gap:11px}
.footer-col li{line-height:1.4}
.site-footer .cookie-settings{border:0;background:none;padding:0;font:inherit;cursor:pointer;text-align:left}
.footer-bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 24px;margin-top:52px;padding-top:22px;border-top:1px solid #2f3936}
.footer-bottom small{font-size:12px;color:#8e9b98}
@media(max-width:900px){.footer-grid{grid-template-columns:1fr 1fr;gap:36px 28px}.footer-brand{grid-column:1/-1}}
@media(max-width:760px){
  .site-footer{padding:48px 0 96px}
  .footer-grid{grid-template-columns:1fr;gap:30px}
  .footer-col ul{gap:4px}
  .footer-col a,.site-footer .cookie-settings{display:inline-block;padding:6px 0}
  .footer-bottom{flex-direction:column;margin-top:36px}
}
/* Okno zgód na cookies (consent.js): na środku ekranu, strona przyciemniona i zablokowana do czasu wyboru. */
html.zgody-otwarte,html.zgody-otwarte body{overflow:hidden}
html.zgody-otwarte .mobile-cta{display:none}
.zgody-tlo{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;padding:16px;background:rgba(15,17,21,.72);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);animation:zgodyTlo .2s ease both}
.zgody-okno{width:min(760px,100%);max-height:calc(100dvh - 32px);overflow:auto;background:#0f1115;color:#f5f3ee;border-top:4px solid #B9F24A;padding:30px 34px 28px;box-shadow:0 30px 90px rgba(0,0,0,.45);font-family:Montserrat,Arial,sans-serif;animation:zgodyOkno .28s cubic-bezier(.22,.61,.36,1) both}
.zgody-okno h2{margin:0 0 12px;font:600 26px/1.2 "Playfair Display",Georgia,serif;color:#fff}
.zgody-okno p{margin:0;font-size:15px;line-height:1.6;color:#d8e2da}
.zgody-okno a{color:#B9F24A;text-decoration:underline;text-underline-offset:3px}
.zgody-szczegoly{display:grid;gap:10px;margin:20px 0 0}
.zgody-szczegoly[hidden]{display:none}
.zgody-kategoria{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:12px 14px;border:1px solid #2b3036;cursor:pointer}
.zgody-kategoria span{display:grid;gap:2px}
.zgody-kategoria b{font-size:14px;color:#fff}
.zgody-kategoria small{font-size:12.5px;color:#aab4ae}
.zgody-kategoria input{flex:none;width:44px;height:24px;margin:0;appearance:none;-webkit-appearance:none;background:#3a4047;border-radius:999px;position:relative;cursor:pointer;transition:background .15s}
.zgody-kategoria input::after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;transition:transform .15s}
.zgody-kategoria input:checked{background:#00B8B0}
.zgody-kategoria input:checked::after{transform:translateX(20px)}
.zgody-kategoria input:disabled{opacity:.55;cursor:default}
.zgody-kategoria input:focus-visible{outline:2px solid #B9F24A;outline-offset:3px}
.zgody-stala{cursor:default}
.zgody-przyciski{display:flex;align-items:center;justify-content:flex-end;gap:12px;margin-top:24px;flex-wrap:wrap}
.zgody-przyciski button{font:700 14px Montserrat,Arial,sans-serif;min-height:48px;padding:0 24px;cursor:pointer;border-radius:0;transition:background .15s,color .15s}
.zgody-link{margin-right:auto;background:none;border:0;padding:0 4px!important;color:#f5f3ee;text-decoration:underline;text-underline-offset:4px}
.zgody-drugi{background:transparent;color:#fff;border:2px solid #f5f3ee}
.zgody-drugi:hover{background:rgba(255,255,255,.08)}
.zgody-glowny{background:#B9F24A;color:#0f1115;border:2px solid #B9F24A}
.zgody-glowny:hover{background:#c9ff63}
.zgody-przyciski button:focus-visible{outline:2px solid #B9F24A;outline-offset:3px}
@keyframes zgodyTlo{from{opacity:0}to{opacity:1}}
@keyframes zgodyOkno{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@media(max-width:640px){
  .zgody-tlo{place-items:end center;padding:10px}
  .zgody-okno{padding:22px 18px 18px}
  .zgody-okno h2{font-size:21px}
  .zgody-okno p{font-size:13.5px;line-height:1.55}
  .zgody-przyciski{flex-direction:column-reverse;align-items:stretch;gap:10px;margin-top:18px}
  .zgody-przyciski button{width:100%}
  .zgody-link{margin:4px 0 0;min-height:40px!important}
}
@media(prefers-reduced-motion:reduce){.zgody-tlo,.zgody-okno{animation:none}}

/* Linki do poradników z bloga (wstawia silnik/blog.mjs między znacznikami blog:poradniki) */
.blog-links{border-top:1px solid var(--ink,#121416)}
.blog-links h2{margin-bottom:28px}
.blog-links-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.blog-links-list li{display:flex;flex-direction:column;gap:8px;padding:20px;background:#fff;border:1px solid var(--ink,#121416)}
.blog-links-list a{color:var(--ink,#121416);font-weight:700;font-size:17px;line-height:1.35;text-underline-offset:3px}
.blog-links-list span{font-size:14px;line-height:1.55;color:#40514e}
.blog-links-all{display:inline-block;margin-top:22px;color:var(--ink,#121416);font-weight:600;text-underline-offset:3px}