:root{
  --navy:#061b43;
  --navy2:#0a2c66;
  --blue:#0b8cff;
  --blue2:#4bb6ff;
  --ink:#091426;
  --muted:#5c687a;
  --line:#e3e9f2;
  --soft:#f5f8fc;
  --white:#fff;
  --shadow:0 24px 70px rgba(6,27,67,.14);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:var(--ink);
  background:#fff;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit}
.wrap{width:min(1180px,calc(100% - 40px));margin:0 auto}
.site-header{
  position:sticky;top:0;z-index:50;
  background:rgba(255,255,255,.9);
  backdrop-filter:blur(16px);
  border-bottom:1px solid rgba(227,233,242,.8)
}
.nav{height:82px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand img{display:block;width:190px;height:auto}
.nav-actions{display:flex;align-items:center;gap:24px}
.nav-link{text-decoration:none;font-weight:700;color:var(--navy)}
.button{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:52px;padding:0 22px;border-radius:12px;
  text-decoration:none;font-weight:800;letter-spacing:-.01em;
  transition:.2s ease;border:1px solid transparent
}
.button:hover{transform:translateY(-2px)}
.button-small{min-height:44px;padding:0 18px;background:var(--navy);color:#fff}
.button-primary{background:linear-gradient(135deg,var(--blue),#0064ff);color:#fff;box-shadow:0 14px 34px rgba(11,140,255,.25)}
.button-ghost{background:#fff;border-color:var(--line);color:var(--navy)}
.hero{position:relative;overflow:hidden;background:linear-gradient(180deg,#fff 0%,#f6f9fe 100%)}
.hero-grid{
  position:absolute;inset:0;opacity:.35;pointer-events:none;
  background-image:linear-gradient(rgba(6,27,67,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(6,27,67,.04) 1px,transparent 1px);
  background-size:44px 44px;
  mask-image:linear-gradient(to bottom,black,transparent 80%)
}
.hero-inner{
  position:relative;display:grid;grid-template-columns:1.18fr .82fr;
  gap:72px;align-items:center;padding:94px 0 104px
}
.eyebrow{
  margin:0 0 14px;color:#0b63ce;text-transform:uppercase;
  letter-spacing:.14em;font-weight:900;font-size:.78rem
}
.hero h1,.section h2{letter-spacing:-.045em;line-height:1.03;margin:0;color:var(--navy)}
.hero h1{font-size:clamp(3.45rem, 6.1vw, 6.45rem);max-width:820px}
.hero h1 span{
  background:linear-gradient(100deg,var(--navy),var(--blue));
  -webkit-background-clip:text;background-clip:text;color:transparent
}
.lead{font-size:1.18rem;color:var(--muted);max-width:720px;margin:28px 0 0}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:34px}
.hero-note{margin-top:22px;color:#617086;font-size:.94rem;display:flex;align-items:center;gap:10px}
.dot{width:9px;height:9px;border-radius:50%;background:#13b66e;box-shadow:0 0 0 5px rgba(19,182,110,.12)}
.hero-panel{
  position:relative;overflow:hidden;background:linear-gradient(150deg,#061b43,#0b367a);
  color:#fff;padding:34px;border-radius:28px;box-shadow:var(--shadow);min-height:520px
}
.panel-glow{position:absolute;width:360px;height:360px;border-radius:50%;right:-160px;top:-160px;background:#148fff;filter:blur(6px);opacity:.2}
.hero-mark{width:100px;height:100px;object-fit:contain;display:block;margin-bottom:26px}
.panel-kicker{text-transform:uppercase;letter-spacing:.12em;font-size:.72rem;font-weight:900;color:#6fc1ff;margin:0 0 10px}
.hero-panel h2{font-size:2.5rem;line-height:1.02;margin:0 0 34px;color:#fff;letter-spacing:-.04em}
.steps{display:grid;gap:0}
.step{display:grid;grid-template-columns:46px 1fr;gap:14px;padding:18px 0;border-top:1px solid rgba(255,255,255,.12)}
.step span{font-size:.78rem;font-weight:900;color:#54b5ff;padding-top:3px}
.step strong{display:block;font-size:1.05rem;margin-bottom:3px}
.step small{color:#bac7d9;font-size:.9rem}
.section{padding:96px 0}
.section-head{max-width:800px;margin-bottom:44px}
.section h2{font-size:clamp(2.4rem,4.4vw,4rem)}
.section-head>p:last-child{color:var(--muted);font-size:1.08rem;margin-top:18px;max-width:720px}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.card{
  border:1px solid var(--line);border-radius:20px;padding:28px;background:#fff;
  min-height:245px;transition:.22s ease
}
.card:hover{transform:translateY(-4px);box-shadow:0 18px 45px rgba(6,27,67,.08);border-color:#c9d8eb}
.card .icon{
  width:40px;height:40px;border-radius:11px;background:#eef6ff;color:#0878e9;
  display:grid;place-items:center;font-size:.75rem;font-weight:900;margin-bottom:28px
}
.card h3{font-size:1.22rem;letter-spacing:-.02em;margin:0 0 10px;color:var(--navy)}
.card p{color:var(--muted);margin:0}
.card-accent{background:linear-gradient(145deg,#071d46,#0b367a);border-color:transparent;color:#fff}
.card-accent h3{color:#fff}.card-accent p{color:#c2d0e3}.card-accent a{display:inline-block;margin-top:20px;color:#6ec2ff;font-weight:800;text-decoration:none}
.card-accent .icon{background:rgba(255,255,255,.1);color:#fff}
.value{background:var(--soft)}
.value-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:80px}
.value-list{border-top:1px solid #d9e2ee}
.value-item{display:grid;grid-template-columns:.75fr 1.25fr;gap:30px;padding:28px 0;border-bottom:1px solid #d9e2ee}
.value-item strong{color:var(--navy);font-size:1.08rem}
.value-item p{margin:0;color:var(--muted)}
.cta{padding-top:78px;padding-bottom:78px}
.cta-box{
  border-radius:30px;padding:58px 64px;
  background:linear-gradient(135deg,#061b43 0%,#0a3474 64%,#0c71d8 130%);
  color:#fff;display:grid;grid-template-columns:1.25fr .75fr;gap:50px;align-items:center;
  position:relative;overflow:hidden
}
.cta-box:after{content:"";position:absolute;width:420px;height:420px;border:1px solid rgba(255,255,255,.08);border-radius:50%;right:-180px;bottom:-280px}
.cta .eyebrow{color:#72c5ff}
.cta h2{color:#fff;font-size:clamp(2.4rem,4.4vw,4.2rem)}
.cta p{color:#c9d6e8;max-width:650px}
.cta-actions{display:grid;gap:12px;position:relative;z-index:1}
.button-light{background:#fff;color:var(--navy)}
.button-outline-light{border-color:rgba(255,255,255,.35);color:#fff;background:rgba(255,255,255,.04)}
.footer{border-top:1px solid var(--line);padding:48px 0;color:#657287}
.footer-inner{display:grid;grid-template-columns:1.2fr .8fr auto;gap:35px;align-items:end}
.footer-logo{width:165px;height:auto;display:block}
.footer p{margin:12px 0 0}
.footer-contact{display:grid;gap:6px}
.footer-contact a{text-decoration:none;color:#46566d}
.footer-copy{text-align:right;font-size:.88rem}
@media (max-width:900px){
  .nav-link{display:none}
  .hero-inner,.value-grid,.cta-box{grid-template-columns:1fr}
  .hero-inner{gap:44px;padding:72px 0}
  .hero-panel{min-height:auto}
  .cards{grid-template-columns:repeat(2,1fr)}
  .value-grid{gap:42px}
  .footer-inner{grid-template-columns:1fr 1fr}.footer-copy{grid-column:1/-1;text-align:left}
}
@media (max-width:620px){
  .wrap{width:min(100% - 28px,1180px)}
  .nav{height:70px}.brand img{width:154px}.button-small{font-size:.88rem;padding:0 13px}
  .hero-inner{padding:58px 0 66px}
  .hero h1{font-size:clamp(2.7rem,13vw,4rem)}
  .lead{font-size:1.04rem}
  .hero-actions{display:grid}.hero-actions .button{width:100%}
  .hero-panel{padding:27px;border-radius:22px}
  .hero-panel h2{font-size:2.05rem}
  .section{padding:72px 0}
  .cards{grid-template-columns:1fr}
  .value-item{grid-template-columns:1fr;gap:8px}
  .cta-box{padding:38px 25px;border-radius:22px;gap:28px}
  .footer-inner{grid-template-columns:1fr;align-items:start}.footer-copy{grid-column:auto}
}

/* Telefon celowo schowany nisko — głównym kanałem kontaktu jest e-mail. */
.footer-phone {
  opacity: .58;
  font-size: .88em;
}
.footer-phone a {
  color: inherit;
  text-decoration: none;
}
.footer-phone a:hover {
  text-decoration: underline;
}


/* v5 — subtelny motyw marki i lokalny kontekst */
.hero {
  position: relative;
  overflow: hidden;
}

.hero::before,
.hero::after {
  content: "";
  position: absolute;
  pointer-events: none;
  z-index: 0;
}

.hero::before {
  width: 520px;
  height: 520px;
  right: -210px;
  top: -250px;
  border: 1px solid rgba(31, 111, 235, .12);
  border-radius: 50%;
  box-shadow:
    0 0 0 70px rgba(31, 111, 235, .035),
    0 0 0 150px rgba(6, 27, 67, .025);
}

.hero::after {
  width: 360px;
  height: 2px;
  right: 9%;
  bottom: 14%;
  background: linear-gradient(90deg, transparent, rgba(31,111,235,.18), transparent);
  transform: rotate(-38deg);
  transform-origin: center;
}

.hero-inner {
  position: relative;
  z-index: 1;
}

.service-area {
  margin: 18px 0 0;
  color: var(--muted, #637083);
  font-size: .94rem;
  line-height: 1.6;
}

.service-area strong {
  color: var(--ink, #061b43);
  font-weight: 700;
}

@media (max-width: 760px) {
  .hero::before {
    width: 360px;
    height: 360px;
    right: -220px;
    top: -170px;
  }
  .service-area {
    font-size: .9rem;
  }
}


/* v6 — accessibility + semantic FAQ */
.skip-link {
  position: fixed;
  left: 16px;
  top: 12px;
  z-index: 9999;
  padding: 10px 14px;
  background: #fff;
  color: #061b43;
  border-radius: 8px;
  box-shadow: 0 8px 30px rgba(6, 27, 67, .16);
  transform: translateY(-160%);
  transition: transform .15s ease;
}
.skip-link:focus {
  transform: translateY(0);
}

a:focus-visible,
button:focus-visible,
summary:focus-visible {
  outline: 3px solid rgba(31, 111, 235, .45);
  outline-offset: 3px;
}

.faq {
  background: #fff;
}
.faq-wrap {
  display: grid;
  grid-template-columns: .85fr 1.15fr;
  gap: 56px;
  align-items: start;
}
.faq-intro p:last-child {
  color: var(--muted, #637083);
  line-height: 1.7;
  max-width: 520px;
}
.faq-list {
  border-top: 1px solid rgba(6, 27, 67, .10);
}
.faq-list details {
  border-bottom: 1px solid rgba(6, 27, 67, .10);
  padding: 0;
}
.faq-list summary {
  cursor: pointer;
  list-style: none;
  position: relative;
  padding: 20px 42px 20px 0;
  font-weight: 700;
  color: var(--ink, #061b43);
}
.faq-list summary::-webkit-details-marker {
  display: none;
}
.faq-list summary::after {
  content: "+";
  position: absolute;
  right: 4px;
  top: 15px;
  font-size: 1.45rem;
  font-weight: 400;
  color: #1f6feb;
}
.faq-list details[open] summary::after {
  content: "−";
}
.faq-list details p {
  margin: -4px 0 20px;
  color: var(--muted, #637083);
  line-height: 1.7;
}

@media (max-width: 760px) {
  .faq-wrap {
    grid-template-columns: 1fr;
    gap: 24px;
  }
}


/* v8 — formularz kontaktowy */
.contact-grid {
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  gap: 48px;
  align-items: start;
}
.contact-copy > p:not(.eyebrow):not(.contact-note) {
  max-width: 620px;
}
.contact-note {
  margin-top: 18px;
  font-size: .92rem;
  opacity: .82;
  line-height: 1.65;
}
.contact-form {
  background: #fff;
  color: #061b43;
  border-radius: 18px;
  padding: 26px;
  box-shadow: 0 18px 55px rgba(6, 27, 67, .14);
}
.form-row {
  display: grid;
  gap: 7px;
  margin-bottom: 16px;
}
.form-row label {
  font-weight: 700;
  font-size: .94rem;
}
.optional {
  font-weight: 400;
  color: #6b7586;
}
.form-row input,
.form-row textarea {
  width: 100%;
  box-sizing: border-box;
  border: 1px solid rgba(6, 27, 67, .18);
  border-radius: 10px;
  background: #fff;
  color: #061b43;
  font: inherit;
  padding: 12px 13px;
}
.form-row textarea {
  resize: vertical;
  min-height: 132px;
}
.form-row input:focus,
.form-row textarea:focus {
  border-color: #1f6feb;
  outline: 3px solid rgba(31,111,235,.14);
}
.form-row small {
  color: #6b7586;
}
.form-submit {
  border: 0;
  cursor: pointer;
  margin-top: 2px;
}
.privacy-note {
  margin: 14px 0 0;
  font-size: .78rem;
  line-height: 1.55;
  color: #6b7586;
}
.privacy-note a {
  color: inherit;
  text-decoration: underline;
}
.hp-field {
  position: absolute !important;
  left: -10000px !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
}
.form-status {
  border-radius: 10px;
  padding: 12px 14px;
  margin-bottom: 16px;
  font-weight: 650;
}
.form-status.success {
  background: #eaf8ef;
  color: #176b38;
}
.form-status.error {
  background: #fff1f1;
  color: #9a2626;
}
@media (max-width: 760px) {
  .contact-grid {
    grid-template-columns: 1fr;
    gap: 28px;
  }
  .contact-form {
    padding: 20px;
  }
}


.legal-page {
  max-width: 820px;
}
.legal-page h1 {
  margin-bottom: 24px;
}
.legal-page p {
  color: var(--muted, #637083);
  line-height: 1.75;
}


/* v10 — czytelność sekcji kontaktowej i klauzuli prywatności */
.contact-copy {
  color: #0a2148;
}
.contact-copy .eyebrow {
  color: #0b63ce;
}
.contact-copy h2 {
  color: #071f46;
}
.contact-copy > p:not(.eyebrow):not(.contact-note),
.contact-note {
  color: #4b5d75;
  opacity: 1;
}
.contact-copy .button-light {
  color: #071f46;
  font-weight: 800;
}
.privacy-note {
  color: #44546b;
  opacity: 1;
}
.privacy-note a {
  color: #0b63ce;
  font-weight: 700;
  text-decoration-thickness: 1.5px;
  text-underline-offset: 2px;
}


/* v11 — final contact/privacy readability */
.contact-note {
  color: #33445f !important;
  opacity: 1 !important;
  font-weight: 500;
}

.privacy-note {
  color: #33445f !important;
  opacity: 1 !important;
  font-size: .84rem;
  line-height: 1.6;
}

.privacy-note strong {
  color: #102a52;
  font-weight: 800;
}

.privacy-note a {
  color: #0b63ce !important;
  font-weight: 800;
  text-decoration: underline;
  text-decoration-thickness: 1.5px;
  text-underline-offset: 2px;
}


/* v12 — final visual polish */
.hero h1 {
  font-size: clamp(3.5rem, 6.2vw, 6.6rem);
  line-height: .95;
}

/* Keep secondary contact copy in the same muted palette used elsewhere. */
.contact-copy > p:not(.eyebrow):not(.contact-note),
.contact-note {
  color: #5f6f86 !important;
  opacity: 1 !important;
  font-weight: 400;
}

/* Privacy block stays readable, but uses the same site palette. */
.privacy-note {
  color: #5f6f86 !important;
}

.privacy-note strong {
  color: #0a2148 !important;
}

@media (max-width: 760px) {
  .hero h1 {
    font-size: clamp(3rem, 14vw, 4.6rem);
  }
}

/* v14 — performance polish: contrast + lightweight rendered assets */


/* v16 — subtelny trust signal: Rzetelna Firma */
.trust-signal {
  margin-top: 18px;
  display: inline-grid;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  max-width: 660px;
  padding: 12px 14px;
  border: 1px solid rgba(6, 27, 67, .10);
  border-radius: 14px;
  background: rgba(255, 255, 255, .78);
  box-shadow: 0 10px 28px rgba(6, 27, 67, .05);
}
.trust-check {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: #eaf3ff;
  color: #0b63ce;
  font-weight: 800;
  font-size: 1rem;
}
.trust-signal strong {
  display: block;
  color: var(--ink, #061b43);
  font-size: .92rem;
  line-height: 1.35;
}
.trust-signal small {
  display: block;
  margin-top: 2px;
  color: var(--muted, #637083);
  font-size: .79rem;
  line-height: 1.4;
}
.trust-signal a {
  white-space: nowrap;
  color: #0b63ce;
  font-size: .83rem;
  font-weight: 700;
  text-decoration: none;
}
.trust-signal a:hover {
  text-decoration: underline;
}
@media (max-width: 760px) {
  .trust-signal {
    width: 100%;
    grid-template-columns: 34px minmax(0, 1fr);
  }
  .trust-signal a {
    grid-column: 2;
    justify-self: start;
  }
}

/* v16 final audit polish: stronger global eyebrow contrast + WebP rendered assets */

/* v17 — hero scale polish: headline reduced ~10% for better desktop balance */

/* v18 — AI visibility final: one evidence-led service page, no content farm */
.card-accent .card-secondary-link {
  margin-left: 16px;
  color: rgba(255,255,255,.86);
  font-weight: 700;
}
.service-hero {
  padding: 76px 0 52px;
  background: linear-gradient(180deg,#f5f8fc 0%,#fff 100%);
}
.service-hero h1 {
  max-width: 860px;
  margin: 10px 0 18px;
  color: var(--navy);
  font-size: clamp(2.7rem,6vw,5.2rem);
  line-height: .98;
  letter-spacing: -.045em;
}
.service-hero .lead {
  max-width: 780px;
  color: var(--muted);
  font-size: clamp(1.08rem,2vw,1.28rem);
  line-height: 1.65;
}
.breadcrumb { margin: 0 0 20px; font-size: .9rem; color: var(--muted); }
.breadcrumb a { color: var(--blue); text-decoration: none; }
.service-content { padding: 58px 0 88px; }
.service-article { max-width: 900px; }
.service-article h2 {
  margin: 50px 0 14px;
  color: var(--navy);
  font-size: clamp(1.65rem,3vw,2.35rem);
  line-height: 1.08;
  letter-spacing: -.025em;
}
.service-article p,
.service-article li { color: #39475b; line-height: 1.72; }
.service-article ul { padding-left: 1.25rem; }
.service-process {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 14px;
  margin: 24px 0 8px;
}
.service-process div {
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
}
.service-process strong { display:block; margin-bottom:6px; color:var(--navy); }
.service-process span { display:block; color:var(--muted); line-height:1.5; }
.service-note {
  margin: 28px 0;
  padding: 22px 24px;
  border: 1px solid rgba(6,27,67,.11);
  border-radius: 18px;
  background: #f7f9fc;
}
.service-note strong { display:block; margin-bottom:6px; color:var(--navy); }
.service-faq details { border-top: 1px solid var(--line); padding: 18px 0; }
.service-faq details:last-child { border-bottom: 1px solid var(--line); }
.service-faq summary { cursor:pointer; color:var(--navy); font-weight:800; }
.service-faq details p { margin:10px 0 0; }
.service-cta {
  margin-top: 52px;
  padding: 30px;
  border-radius: 22px;
  background: var(--navy);
  color: #fff;
}
.service-cta h2 { margin:0 0 12px; color:#fff; }
.service-cta p { color:rgba(255,255,255,.82); }
.service-cta .button { margin-top:10px; }
.service-backlink { margin-top:28px; }
.service-backlink a { font-weight:750; }
@media (max-width:760px) {
  .card-accent .card-secondary-link { margin-left:0; display:block; }
  .service-hero { padding:58px 0 38px; }
  .service-content { padding:38px 0 66px; }
  .service-process { grid-template-columns:1fr; }
  .service-cta { padding:24px; }
}


/* KB-IDEA-023 — approved hero balance / 2026-09-05 */
@media (min-width: 901px) {
  .hero-inner {
    grid-template-columns: minmax(0, 1.12fr) minmax(420px, .88fr);
    gap: 48px;
  }
  .hero h1 {
    font-size: clamp(3.75rem, 5.05vw, 5.55rem);
    line-height: .97;
    max-width: 780px;
  }
  .hero-line-first { white-space: nowrap; }
}
.hero-line { display:block; }
.hero-line-gradient {
  background:linear-gradient(100deg,var(--navy),var(--blue));
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.hero-ai-card {
  margin-top:14px;
  width:min(100%, 600px);
  display:flex;
  align-items:center;
  gap:13px;
  text-align:left;
  padding:11px 15px;
  border:1px solid #dbe8f7;
  border-radius:16px;
  background:linear-gradient(135deg,#f6fbff,#eef6ff);
  color:var(--navy);
  cursor:pointer;
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}
.hero-ai-card:hover {
  transform:translateY(-1px);
  border-color:#bfd9f6;
  box-shadow:0 10px 26px rgba(6,27,67,.07);
}
.hero-ai-card:focus-visible {outline:3px solid rgba(11,140,255,.22);outline-offset:3px}
.hero-ai-icon {
  flex:0 0 42px;
  width:42px;height:42px;
  display:grid;place-items:center;
  color:#087fe9;
  background:#e6f3ff;
  border-radius:13px;
}
.hero-ai-icon svg{width:32px;height:32px;display:block}
.hero-ai-copy{display:grid;gap:2px;min-width:0}
.hero-ai-copy strong{font-size:.98rem;color:#0871d8;line-height:1.2}
.hero-ai-copy small{font-size:.86rem;color:#66768b;line-height:1.35}

@media (max-width: 900px) {
  .hero-line-first { white-space: normal; }
  .hero-ai-card { width:100%; }
}
@media (max-width: 760px) {
  .hero h1 { font-size:clamp(2.9rem,12vw,4.3rem); }
  .hero-ai-card { margin-top:10px;padding:11px 13px; }
  .hero-ai-icon { flex-basis:40px;width:40px;height:40px; }
}

@media (min-width: 900px) {
  .kb-nowrap-desktop {
    white-space: nowrap;
  }
}

/* KARBOT DESIGN SYSTEM FINAL — BEGIN */

/*
  FINALNE ROLE TYPOGRAFICZNE / KOLORY

  heading      = ciemny granat
  body         = główny szaro-granat
  secondary    = tekst pomocniczy / meta
  accent       = linki / eyebrow / aktywne elementy
  on-dark      = tekst na granatowym tle
  on-dark-muted= tekst pomocniczy na granatowym tle

  Różnice poniżej są CELOWE, nie przypadkowe.
*/

:root {
  --kb-text-heading: #061b43;
  --kb-text-body: #5f6f86;
  --kb-text-secondary: #66768b;
  --kb-text-accent: #0b63ce;

  --kb-text-on-dark: #ffffff;
  --kb-text-on-dark-muted: #c9d6e8;
  --kb-accent-on-dark: #72c5ff;

  --kb-accent-primary: #0b8cff;

  --kb-size-body: 1rem;
  --kb-size-lead: 1.18rem;
  --kb-size-section-intro: 1.05rem;
  --kb-size-meta: .92rem;
  --kb-size-caption: .84rem;
  --kb-size-eyebrow: .78rem;
}


/* ---------- NAGŁÓWKI ---------- */

.hero h1,
.section h2,
.card h3,
.value-item strong,
.service-area strong,
.faq-list summary,
.contact-copy h2,
.trust-signal strong,
.service-hero h1,
.service-article h2,
.service-process strong,
.service-note strong,
.service-faq summary {
  color: var(--kb-text-heading);
}


/* ---------- GŁÓWNY TEKST ---------- */

.lead,
.section-head > p:last-child,
.card p,
.value-item p,
.faq-intro p:last-child,
.faq-list details p,
.contact-copy > p:not(.eyebrow):not(.contact-note),
.contact-note,
.legal-page p,
.service-hero .lead,
.service-article p,
.service-article li,
.service-process span {
  color: var(--kb-text-body);
}

.lead {
  font-size: var(--kb-size-lead);
}

.section-head > p:last-child {
  font-size: var(--kb-size-section-intro);
}


/* ---------- TEKST POMOCNICZY / META ---------- */

.hero-note,
.service-area,
.contact-note {
  color: var(--kb-text-secondary);
  font-size: var(--kb-size-meta);
}

.optional,
.form-row small {
  color: var(--kb-text-secondary);
}

.privacy-note,
.footer,
.trust-signal small {
  color: var(--kb-text-secondary);
}

.privacy-note {
  font-size: var(--kb-size-caption);
}

.footer-contact a {
  color: var(--kb-text-body);
}


/* ---------- NIEBIESKI AKCENT ---------- */

.eyebrow,
.faq-list summary::after,
.privacy-note a,
.trust-check,
.trust-signal a,
.breadcrumb a,
.hero-ai-copy strong {
  color: var(--kb-text-accent);
}

.eyebrow {
  font-size: var(--kb-size-eyebrow);
  text-transform: uppercase;
}


/* ---------- HERO AI ---------- */

.hero-ai-icon {
  color: var(--kb-accent-primary);
}

.hero-ai-copy small {
  color: var(--kb-text-secondary);
}


/* ---------- CIEMNE PANELE ---------- */

.hero-panel,
.hero-panel h2,
.cta-box,
.cta h2,
.service-cta,
.service-cta h2 {
  color: var(--kb-text-on-dark);
}

.step small,
.cta p,
.card-accent p,
.service-cta p,
.card-accent .card-secondary-link {
  color: var(--kb-text-on-dark-muted);
}

.panel-kicker,
.step span,
.cta .eyebrow,
.card-accent a {
  color: var(--kb-accent-on-dark);
}


/* ---------- FORMULARZ ---------- */

.contact-form,
.form-row input,
.form-row textarea {
  color: var(--kb-text-heading);
}


/*
  Wielkość liter:
  uppercase tylko dla eyebrow / kicker.
  Nagłówki, przyciski, linki i body pozostają normalnym sentence case.
*/

.panel-kicker {
  text-transform: uppercase;
}

/* KARBOT DESIGN SYSTEM FINAL — END */

/* KARBOT FINAL HEADING LOCK — BEGIN */

.hero-title-final .hero-line,
.why-title-final > span {
  display: block;
}

.hero-title-final .hero-accent {
  color: #0b7fe8;
}

@media (min-width: 1180px) {

  .hero-title-final {
    max-width: 820px !important;
    font-size: clamp(4.5rem, 5.1vw, 5.65rem) !important;
    line-height: .98 !important;
    letter-spacing: -.045em;
  }

  .hero-title-final .hero-line-1 {
    white-space: nowrap;
  }

  .why-title-final {
    font-size: clamp(3.45rem, 3.75vw, 4.15rem) !important;
    line-height: 1.02 !important;
  }

  .why-title-final > span {
    white-space: nowrap;
  }

  .contact-title-final {
    font-size: clamp(3.45rem, 3.8vw, 4.15rem) !important;
    line-height: 1.02 !important;
  }

  .contact-title-final > span {
    white-space: nowrap;
  }
}

@media (max-width: 1179px) {
  .hero-title-final .hero-line-1,
  .why-title-final > span,
  .contact-title-final > span {
    white-space: normal;
  }
}

/* KARBOT FINAL HEADING LOCK — END */


/* KARBOT HERO AI CARD HARD LOCK — BEGIN */

.hero-ai-card {
  appearance: none !important;
  -webkit-appearance: none !important;

  display: flex !important;
  align-items: center !important;
  gap: 14px !important;

  width: min(100%, 720px) !important;
  height: auto !important;
  min-height: 74px !important;

  margin: 14px 0 0 !important;
  padding: 11px 16px !important;

  border: 1px solid #d7e5f5 !important;
  border-radius: 17px !important;

  background: #f1f7fe !important;
  box-shadow: none !important;

  color: #061b43 !important;
  font: inherit !important;
  text-align: left !important;

  cursor: pointer !important;
}

.hero-ai-card:hover {
  border-color: #b9d7f7 !important;
  background: #eaf5ff !important;
}

.hero-ai-card-icon {
  display: grid !important;
  place-items: center !important;

  width: 48px !important;
  height: 48px !important;
  flex: 0 0 48px !important;

  border-radius: 13px !important;
  background: #e2f2ff !important;
  color: #0b8cff !important;
}

.hero-ai-card-icon svg {
  display: block !important;
  width: 27px !important;
  height: 27px !important;
  max-width: 27px !important;
  max-height: 27px !important;
}

.hero-ai-card-copy {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
  min-width: 0 !important;
}

.hero-ai-card-copy strong {
  color: #0b63ce !important;
  font-size: 1.02rem !important;
  line-height: 1.25 !important;
  font-weight: 800 !important;
}

.hero-ai-card-copy small {
  color: #66768b !important;
  font-size: .91rem !important;
  line-height: 1.35 !important;
  font-weight: 400 !important;
}

@media (max-width: 600px) {

  .hero-ai-card {
    min-height: 68px !important;
    padding: 10px 12px !important;
  }

  .hero-ai-card-icon {
    width: 44px !important;
    height: 44px !important;
    flex-basis: 44px !important;
  }
}

/* KARBOT HERO AI CARD HARD LOCK — END */

/* KARBOT CONTACT HEADING HARD FIX — BEGIN */

.contact-title-final {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;

  color: #061b43 !important;
  -webkit-text-fill-color: #061b43 !important;

  margin: 0 0 1.35rem 0 !important;
  padding: 0 !important;

  font-size: clamp(3.45rem, 3.8vw, 4.15rem) !important;
  font-weight: 800 !important;
  line-height: 1.02 !important;
  letter-spacing: -.035em !important;

  max-width: none !important;
  overflow: visible !important;

  text-indent: 0 !important;
  transform: none !important;
}

.contact-title-final > span {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;

  color: #061b43 !important;
  -webkit-text-fill-color: #061b43 !important;
}

@media (min-width:1180px) {
  .contact-title-final > span {
    white-space: nowrap !important;
  }
}

@media (max-width:1179px) {
  .contact-title-final > span {
    white-space: normal !important;
  }
}

/* KARBOT CONTACT HEADING HARD FIX — END */

/* KARBOT HERO POLISH FINAL — BEGIN */

/*
  1. Więcej miejsca dla dolnych elementów liter,
     szczególnie "g" w "czego".
*/
@media (min-width:1180px) {
  .hero-title-final {
    line-height: 1.035 !important;
  }

  .hero-title-final .hero-line-2 {
    padding-bottom: .055em !important;
  }
}


/*
  2. Hero AI wraca do zaakceptowanego wcześniej
     delikatnie niebieskiego wariantu.
*/
.hero-ai-card {
  background: #eef6ff !important;
  border-color: #cfe2f7 !important;
  color: #061b43 !important;

  font-family: inherit !important;
  font-style: normal !important;
}

.hero-ai-card:hover {
  background: #e7f3ff !important;
  border-color: #b8d8f7 !important;
}

.hero-ai-card-copy,
.hero-ai-card-copy strong,
.hero-ai-card-copy small {
  font-family: inherit !important;
  font-style: normal !important;
}

.hero-ai-card-copy strong {
  color: #087fe9 !important;
  font-size: 1.02rem !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
}

.hero-ai-card-copy small {
  color: #5f6f86 !important;
  font-size: .91rem !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
}

.hero-ai-card-icon {
  background: #dff0ff !important;
  color: #0b8cff !important;
}

/* KARBOT HERO POLISH FINAL — END */

/* KARBOT VISUAL CONSISTENCY PATCH — BEGIN */

/* 1) HERO: bez podcinania dolnych elementów liter, szczególnie "g" */
.hero h1 {
  line-height: 1.035 !important;
  overflow: visible !important;
}
.hero-line {
  display: block;
  padding-bottom: .05em;
}
.hero-line-gradient {
  padding-bottom: .065em;
}
.hero-copy {
  overflow: visible !important;
}

/* 2) GÓRNY CTA: "Wyślij zapytanie" jaśniejszy, bliżej brandowego błękitu */
.button-small {
  min-height: 44px;
  padding: 0 18px;
  color: #fff !important;
  background: linear-gradient(135deg, #1890ff 0%, #006dff 100%) !important;
  border-color: transparent !important;
  box-shadow: 0 12px 26px rgba(11,140,255,.20);
}
.button-small:hover {
  box-shadow: 0 14px 30px rgba(11,140,255,.26);
}

/* 3) KONTAKT: "Wyślij to, co masz." spójne z innymi dużymi nagłówkami */
.contact-copy h2 {
  font-family: inherit !important;
  font-weight: 700 !important;
  font-size: clamp(2.55rem, 4.2vw, 4.1rem) !important;
  line-height: 1.02 !important;
  letter-spacing: -.045em !important;
  color: var(--navy) !important;
  text-wrap: balance;
  margin: 0;
}

/* 4) ZNAK K NA GRANATOWEJ KARCIE: większy kontrast i odcięcie od tła */
.hero-mark {
  width: 108px;
  height: 108px;
  display: block;
  margin: 0 0 26px;
  padding: 10px;
  box-sizing: border-box;
  object-fit: contain;
  border-radius: 28px;
  background: linear-gradient(145deg, rgba(255,255,255,.12), rgba(255,255,255,.04)) !important;
  border: 1px solid rgba(255,255,255,.14);
  box-shadow:
    0 14px 34px rgba(0,0,0,.18),
    inset 0 1px 0 rgba(255,255,255,.08);
  filter: drop-shadow(0 8px 18px rgba(0,0,0,.18));
}

@media (max-width: 760px) {
  .hero h1 {
    line-height: 1.03 !important;
  }
  .hero-line,
  .hero-line-gradient {
    padding-bottom: .03em;
  }
  .contact-copy h2 {
    font-size: clamp(2.35rem, 10vw, 3.45rem) !important;
  }
  .hero-mark {
    width: 96px;
    height: 96px;
    padding: 9px;
    border-radius: 24px;
  }
}

/* KARBOT VISUAL CONSISTENCY PATCH — END */

/* KARBOT HERO FINAL TWO FIXES — BEGIN */


/* =========================================================
   H1 — SOLID COLORS
   Bez background-clip:text, żeby nie obcinać "g".
   ========================================================= */

.hero .hero-title-solid {
  overflow: visible !important;
  color: #061b43 !important;
  line-height: 1.04 !important;
}

.hero .hero-title-solid span {
  background: none !important;
  background-image: none !important;

  -webkit-background-clip: border-box !important;
  background-clip: border-box !important;

  color: inherit !important;
  -webkit-text-fill-color: currentColor !important;

  overflow: visible !important;
}

.hero .hero-title-solid .hero-solid-line {
  display: block !important;
  padding: 0 0 .075em 0 !important;
  overflow: visible !important;
}

.hero .hero-title-solid .hero-solid-blue {
  color: #0b7fe8 !important;
  -webkit-text-fill-color: #0b7fe8 !important;
}

@media (min-width: 1180px) {
  .hero .hero-title-solid {
    font-size: clamp(4.5rem, 5.1vw, 5.65rem) !important;
    letter-spacing: -.045em !important;
  }

  .hero .hero-title-solid .hero-solid-line-1,
  .hero .hero-title-solid .hero-solid-line-2 {
    white-space: nowrap !important;
  }
}


/* =========================================================
   LOGO K — wracamy do samego kółka.
   Bez pudełka. Tylko subtelne odcięcie od granatowego panelu.
   ========================================================= */

.hero-mark {
  width: 104px !important;
  height: 104px !important;

  padding: 0 !important;
  margin: 0 0 26px !important;

  border: 0 !important;
  outline: 0 !important;
  border-radius: 50% !important;

  background: transparent !important;
  box-shadow: none !important;

  object-fit: contain !important;

  filter:
    drop-shadow(0 0 1px rgba(255,255,255,.55))
    drop-shadow(0 0 12px rgba(58,169,255,.34))
    drop-shadow(0 9px 18px rgba(0,0,0,.22))
    brightness(1.06) !important;
}

@media (max-width:760px) {
  .hero .hero-title-solid {
    line-height: 1.035 !important;
  }

  .hero .hero-title-solid .hero-solid-line {
    padding-bottom: .06em !important;
  }

  .hero-mark {
    width: 96px !important;
    height: 96px !important;
  }
}


/* KARBOT HERO FINAL TWO FIXES — END */

/* KARBOT FINAL HERO GRADIENT — BEGIN */

/*
   Płynne przejście granat -> KarBot blue.
   Każda linia ma własny gradient, dzięki czemu efekt
   wygląda jak zaakceptowana wcześniejsza wersja,
   a nie jak trzy twarde bloki kolorystyczne.
*/

.hero .hero-title-gradient-final {
  display: block !important;

  margin: 0 !important;
  max-width: 830px !important;

  color: #061b43 !important;

  font-size: clamp(4.5rem, 5.1vw, 5.65rem) !important;
  font-weight: 800 !important;
  line-height: 1.035 !important;
  letter-spacing: -.045em !important;

  overflow: visible !important;
}

.hero .hero-title-gradient-final .hero-gradient-line {
  display: block !important;
  width: max-content !important;
  max-width: 100% !important;

  line-height: 1.035 !important;

  /*
     Ten zapas jest celowy:
     chroni descender "g" w "czego" przy background-clip:text.
  */
  padding: 0 .025em .13em 0 !important;
  margin: 0 0 -.085em 0 !important;

  overflow: visible !important;

  -webkit-background-clip: text !important;
  background-clip: text !important;

  color: transparent !important;
  -webkit-text-fill-color: transparent !important;

  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}

/* Nie musisz szukać. */
.hero .hero-gradient-line-1 {
  background-image:
    linear-gradient(
      90deg,
      #061b43 0%,
      #07306a 43%,
      #0862bd 67%,
      #0b8cff 100%
    ) !important;
}

/* Powiedz, czego */
.hero .hero-gradient-line-2 {
  background-image:
    linear-gradient(
      90deg,
      #061b43 0%,
      #07336f 42%,
      #0871d8 72%,
      #0b8cff 100%
    ) !important;
}

/* potrzebujesz. */
.hero .hero-gradient-line-3 {
  background-image:
    linear-gradient(
      90deg,
      #0872da 0%,
      #0a82eb 52%,
      #1497ff 100%
    ) !important;
}

@media (min-width: 1180px) {

  .hero .hero-gradient-line-1,
  .hero .hero-gradient-line-2,
  .hero .hero-gradient-line-3 {
    white-space: nowrap !important;
  }
}

@media (max-width: 1179px) {

  .hero .hero-title-gradient-final {
    font-size: clamp(2.9rem, 11vw, 4.6rem) !important;
  }

  .hero .hero-gradient-line {
    width: auto !important;
    white-space: normal !important;

    padding-bottom: .11em !important;
    margin-bottom: -.07em !important;
  }
}

/* KARBOT FINAL HERO GRADIENT — END */

/* KARBOT FINAL THREE V2 — BEGIN */


/* ============================================================
   1. HEADER AI
   ============================================================ */

.nav-actions {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

.nav-ai-chat-button {
  appearance: none !important;
  -webkit-appearance: none !important;

  width: 46px !important;
  height: 46px !important;
  flex: 0 0 46px !important;

  display: grid !important;
  place-items: center !important;

  padding: 0 !important;
  border: 0 !important;
  border-radius: 13px !important;

  color: #fff !important;

  background:
    linear-gradient(135deg,#1b98ff 0%,#0878eb 100%) !important;

  box-shadow:
    0 10px 25px rgba(11,140,255,.24),
    inset 0 1px 0 rgba(255,255,255,.22) !important;

  cursor: pointer !important;
  transition: transform .18s ease, box-shadow .18s ease !important;
}

.nav-ai-chat-button svg {
  width: 25px !important;
  height: 25px !important;
  display: block !important;
}

.nav-ai-chat-button:hover {
  transform: translateY(-2px) !important;
  box-shadow:
    0 14px 30px rgba(11,140,255,.32),
    inset 0 1px 0 rgba(255,255,255,.24) !important;
}


/* ============================================================
   2. HERO — pełny napis + płynny granat -> blue
   ============================================================ */

.hero-copy {
  min-width: 0 !important;
  overflow: visible !important;
}

.hero .hero-title-gradient-final {
  margin: 0 !important;

  max-width: none !important;
  overflow: visible !important;

  font-weight: 800 !important;
  line-height: 1.02 !important;
  letter-spacing: -.045em !important;
}

.hero .hero-gradient-line {
  display: block !important;

  width: max-content !important;
  max-width: none !important;

  white-space: nowrap !important;

  line-height: 1.02 !important;

  /*
    Zapas po prawej i na dole:
    - nie ucina "ć."
    - nie ucina ogonka "g"
  */
  padding-right: .14em !important;
  padding-bottom: .16em !important;

  margin-bottom: -.10em !important;

  overflow: visible !important;

  background-repeat: no-repeat !important;
  background-size: 100% 100% !important;

  -webkit-background-clip: text !important;
  background-clip: text !important;

  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
}


/* Nie musisz szukać. */
.hero .hero-gradient-line-1 {
  background-image:
    linear-gradient(
      90deg,
      #061b43 0%,
      #07316b 40%,
      #0870cf 69%,
      #0b8cff 100%
    ) !important;
}


/* Powiedz, czego */
.hero .hero-gradient-line-2 {
  background-image:
    linear-gradient(
      90deg,
      #061b43 0%,
      #07346e 42%,
      #0876da 73%,
      #0b8cff 100%
    ) !important;
}


/* potrzebujesz. */
.hero .hero-gradient-line-3 {
  background-image:
    linear-gradient(
      90deg,
      #0870cf 0%,
      #0a80e7 48%,
      #1396ff 100%
    ) !important;
}


/*
  Kluczowe:
  poprzednio tekst był za szeroki dla lewej kolumny.
  Teraz font jest o kilka procent mniejszy,
  dzięki czemu CAŁE "szukać." mieści się bez wchodzenia pod kartę.
*/
@media (min-width: 1180px) {

  .hero .hero-title-gradient-final {
    font-size:
      clamp(3.8rem,4vw,4.25rem) !important;
  }
}


@media (max-width: 1179px) {

  .hero .hero-title-gradient-final {
    font-size:
      clamp(2.85rem,10vw,4.15rem) !important;
  }

  .hero .hero-gradient-line {
    width: auto !important;
    max-width: 100% !important;
    white-space: normal !important;
  }
}


/* ============================================================
   3. K — większa miękka poświata
   ============================================================ */

.hero-mark {
  width: 104px !important;
  height: 104px !important;

  padding: 0 !important;
  margin: 0 0 26px !important;

  border: 0 !important;
  border-radius: 50% !important;

  background: transparent !important;
  box-shadow: none !important;

  object-fit: contain !important;
  overflow: visible !important;

  filter:
    drop-shadow(0 0 5px rgba(75,190,255,.95))
    drop-shadow(0 0 13px rgba(30,167,255,.72))
    drop-shadow(0 0 25px rgba(30,167,255,.46))
    drop-shadow(0 0 38px rgba(30,167,255,.24))
    brightness(1.07) !important;
}


@media (max-width:620px) {

  .nav-actions {
    gap: 7px !important;
  }

  .nav-ai-chat-button {
    width: 42px !important;
    height: 42px !important;
    flex-basis: 42px !important;
  }

  .nav-ai-chat-button svg {
    width: 23px !important;
    height: 23px !important;
  }

  .hero-mark {
    width: 96px !important;
    height: 96px !important;
  }
}


/* KARBOT FINAL THREE V2 — END */

/* KARBOT FINAL CLOSEOUT — BEGIN */


/* ============================================================
   TYPOGRAPHY SYSTEM
   Jedna rodzina fontu dla całego UI.
   Rozmiary pozostają różne CELOWO wg hierarchii.
   ============================================================ */

html,
body {
  font-family:
    Inter,
    ui-sans-serif,
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    sans-serif !important;
}

button,
input,
textarea,
select {
  font-family: inherit !important;
}

h1,
h2,
h3,
h4,
.button,
.nav-ai-chat-button {
  font-family: inherit !important;
}


/* ============================================================
   HERO — tylko odrobinę większy.
   Bez zmiany gradientu i bez ryzyka clippingu.
   ============================================================ */

@media (min-width:1180px) {
  .hero .hero-title-gradient-final {
    font-size:
      clamp(3.95rem,4.12vw,4.40rem) !important;
  }
}


/* ============================================================
   HEADER AI
   Jasny kafelek + niebieski dymek + mały badge AI.
   ============================================================ */

.nav-ai-chat-button {
  position: relative !important;
  overflow: visible !important;

  width: 46px !important;
  height: 46px !important;
  flex: 0 0 46px !important;

  display: grid !important;
  place-items: center !important;

  padding: 0 !important;

  color: #0b82f4 !important;
  background: #ffffff !important;

  border: 1px solid #d5e5f6 !important;
  border-radius: 13px !important;

  box-shadow:
    0 9px 22px rgba(7,74,145,.10),
    inset 0 1px 0 rgba(255,255,255,.9) !important;
}

.nav-ai-chat-button svg {
  width: 25px !important;
  height: 25px !important;
}

/* gwiazdka w ikonie też niebieska na białym tle */
.nav-ai-chat-button svg path:last-of-type {
  fill: #0b82f4 !important;
}

.nav-ai-chat-button::after {
  content: "AI";

  position: absolute;
  top: -7px;
  right: -9px;

  min-width: 24px;
  height: 18px;

  display: flex;
  align-items: center;
  justify-content: center;

  padding: 0 5px;

  border: 2px solid #fff;
  border-radius: 999px;

  background:
    linear-gradient(135deg,#20a4ff 0%,#087cf0 100%);

  color: #fff;

  font-family: inherit;
  font-size: 10px;
  line-height: 1;
  font-weight: 800;
  letter-spacing: .02em;

  box-shadow:
    0 5px 12px rgba(11,140,255,.25);
}

.nav-ai-chat-button:hover {
  color: #0878e8 !important;
  background: #f4f9ff !important;

  box-shadow:
    0 11px 25px rgba(7,74,145,.14) !important;
}


/* ============================================================
   K — obecna poświata zostaje dokładnie jak jest.
   ============================================================ */


/* Mobile */
@media (max-width:620px) {
  .nav-ai-chat-button {
    width: 42px !important;
    height: 42px !important;
    flex-basis: 42px !important;
  }

  .nav-ai-chat-button::after {
    top: -6px;
    right: -7px;
  }
}


/* KARBOT FINAL CLOSEOUT — END */

/* KARBOT CATEGORY CTA FINAL — BEGIN */

.karbot-category-cta-final {
    position: relative !important;
    overflow: hidden !important;

    background:
        radial-gradient(
            circle at 88% 12%,
            rgba(33, 151, 255, .24) 0%,
            rgba(33, 151, 255, .09) 25%,
            rgba(33, 151, 255, 0) 54%
        ),
        linear-gradient(
            145deg,
            #09265f 0%,
            #0d357d 52%,
            #12468f 100%
        ) !important;

    border:
        1px solid rgba(87, 180, 255, .30) !important;

    box-shadow:
        0 18px 42px rgba(7, 30, 74, .18),
        0 5px 14px rgba(8, 54, 126, .10),
        inset 0 1px 0 rgba(255, 255, 255, .08) !important;

    transform: translateY(-2px);
}


/* jasny nagłówek — naprawa czarnego tekstu */
.karbot-category-cta-final h3 {
    color: #ffffff !important;
}


/* tekst główny */
.karbot-category-cta-final p {
    color: rgba(255, 255, 255, .90) !important;
}


/* link główny */
.karbot-category-cta-final a {
    color: #68c1ff !important;
    text-decoration: none !important;
    font-weight: 700 !important;
}

.karbot-category-cta-final a:hover {
    color: #a7dcff !important;
}


/* drugi link */
.karbot-category-cta-final .card-secondary-link {
    color: #ffffff !important;
}


/* znak ? */
.karbot-category-cta-final .icon {
    color: #ffffff !important;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.14),
            rgba(255,255,255,.07)
        ) !important;

    border:
        1px solid rgba(255,255,255,.10) !important;

    box-shadow:
        0 8px 22px rgba(0,0,0,.16),
        inset 0 1px 0 rgba(255,255,255,.08) !important;
}


/* bardzo delikatne rozświetlenie tła */
.karbot-category-cta-final::after {
    content: "";
    position: absolute;
    width: 220px;
    height: 220px;
    right: -105px;
    bottom: -125px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(62, 171, 255, .17) 0%,
            rgba(62, 171, 255, 0) 70%
        );

    pointer-events: none;
}

.karbot-category-cta-final > * {
    position: relative;
    z-index: 1;
}


/* Mobile — bez niepotrzebnego unoszenia */
@media (max-width: 760px) {
    .karbot-category-cta-final {
        transform: none;
    }
}

/* KARBOT CATEGORY CTA FINAL — END */

/* KARBOT FINAL SCOPE CTA — BEGIN */

.karbot-scope-cta-final {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 13px !important;

    color: #061b43 !important;

    background:
        linear-gradient(
            180deg,
            #ffffff 0%,
            #f3f8fe 100%
        ) !important;

    border:
        1px solid #b9d6f1 !important;

    border-radius: 14px !important;

    box-shadow:
        0 9px 22px rgba(18, 77, 138, .10),
        0 2px 6px rgba(18, 77, 138, .06),
        inset 0 1px 0 rgba(255,255,255,.95) !important;

    text-decoration: none !important;

    transition:
        transform .18s ease,
        border-color .18s ease,
        box-shadow .18s ease,
        background .18s ease !important;
}

.karbot-scope-cta-final::after {
    content: "›";

    display: inline-block;

    color: #69aef0;

    font-size: 1.55em;
    font-weight: 500;
    line-height: .8;

    transform: translateY(-1px);

    transition:
        transform .18s ease,
        color .18s ease;
}

.karbot-scope-cta-final:hover {
    color: #061b43 !important;

    background:
        linear-gradient(
            180deg,
            #ffffff 0%,
            #eaf4ff 100%
        ) !important;

    border-color: #78b6ed !important;

    box-shadow:
        0 13px 28px rgba(18, 77, 138, .15),
        0 3px 8px rgba(18, 77, 138, .08),
        inset 0 1px 0 rgba(255,255,255,1) !important;

    transform: translateY(-2px);
}

.karbot-scope-cta-final:hover::after {
    color: #168df5;
    transform: translate(3px,-1px);
}

.karbot-scope-cta-final:focus-visible {
    outline: 3px solid rgba(22,141,245,.25) !important;
    outline-offset: 3px !important;
}


/* Mobile */
@media (max-width:620px) {
    .karbot-scope-cta-final {
        gap: 10px !important;
    }

    .karbot-scope-cta-final::after {
        font-size: 1.4em;
    }
}

/* KARBOT FINAL SCOPE CTA — END */


/* KARBOT WWW CONSISTENCY AUDIT — 2026-09-16
   One visual language across public pages. Homepage v19 remains the reference. */
:root{
  --kb-surface:#ffffff;
  --kb-surface-soft:#f6f9fe;
  --kb-surface-note:#f7f9fc;
  --kb-border:#e3e9f2;
  --kb-border-accent:#cfe4f8;
  --kb-ring:rgba(75,182,255,.42);
  --kb-link:#0b63ce;
}

/* Same hero palette + typography on every content/service page. */
.service-hero{
  background:linear-gradient(180deg,#fff 0%,#f6f9fe 100%);
  padding:76px 0 58px;
}
.service-hero h1{
  width:100%;max-width:1180px;
  margin:10px 0 18px;
  color:var(--kb-text-heading);
  font-size:clamp(2.65rem,4.45vw,4.15rem);
  line-height:1.02;
  letter-spacing:-.045em;
}
.service-hero .lead{color:var(--kb-text-body);max-width:820px}
.breadcrumb{color:var(--kb-text-secondary)}

/* One type/color hierarchy across subpages. */
.service-article,.practice-article{font-size:var(--kb-size-body)}
.service-article h2,.practice-article h2,.practice-upcoming h2{
  color:var(--kb-text-heading);
  font-size:clamp(1.65rem,3vw,2.35rem);
  line-height:1.08;letter-spacing:-.025em;
}
.practice-article h3,.practice-upcoming-card h3,.practice-card h2{
  color:var(--kb-text-heading);
}
.service-article p,.service-article li,.practice-article p,.practice-article li,
.practice-card p,.practice-upcoming-intro,.practice-upcoming-card p{
  color:var(--kb-text-body);
}
.practice-meta,.practice-card .practice-card-meta{color:var(--kb-text-secondary)}
.practice-article a:not(.button),.service-article a:not(.button),.service-backlink a{
  color:var(--kb-link);text-underline-offset:3px;
}

/* Shared light-card language. */
.service-process div,.service-note,.practice-card,.practice-upcoming-card,
.practice-author,.practice-download,.glossary-index a{
  border-color:var(--kb-border-accent);
}
.service-note,.practice-upcoming-card,.practice-author{
  background:var(--kb-surface-note);
}
.practice-card{background:var(--kb-surface)}

/* Primary actions: same blue button + permanent soft outer ring. */
.button-primary{
  background:linear-gradient(135deg,var(--blue),#0064ff);
  color:#fff;
  border:1px solid rgba(255,255,255,.88);
  box-shadow:0 0 0 4px var(--kb-ring),0 14px 34px rgba(11,140,255,.25);
}
.button-primary:hover{
  box-shadow:0 0 0 4px rgba(75,182,255,.55),0 17px 38px rgba(11,140,255,.30);
}
.button-primary:focus-visible{
  outline:3px solid rgba(11,99,206,.30);outline-offset:5px;
}
/* Secondary action is consistently white/outlined. */
.button-ghost{background:#fff;border-color:#b9d6f1;color:var(--kb-text-heading)}
.button-ghost:hover{border-color:#78b6ed;background:#f3f8fe}

/* Keep all page footers on the homepage component. */
.footer{color:var(--kb-text-secondary)}

/* Glossary: Polish first, foreign/industry equivalent clearly exposed. */
.glossary-index{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;
  margin:22px 0 38px;
}
.glossary-index a{
  display:block;padding:13px 15px;border:1px solid var(--kb-border-accent);
  border-radius:12px;background:#fff;color:var(--kb-text-heading)!important;
  text-decoration:none;font-weight:700;line-height:1.35;
}
.glossary-index a:hover{background:#f3f8fe;border-color:#78b6ed;transform:translateY(-1px)}
.glossary-term{
  margin:-5px 0 10px!important;color:var(--kb-text-secondary)!important;
  font-size:.93rem;line-height:1.5!important;
}
.glossary-term strong{color:var(--kb-text-accent)}

/* PDF/document action card. */
.practice-download{
  background:linear-gradient(135deg,#f7fbff,#eef6ff);
  border:1px solid var(--kb-border-accent);
}
.practice-download-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:18px}
.practice-download-actions .button{margin:0}

@media (min-width:1100px){
  .service-hero .kb-title-single-line{white-space:nowrap}
}
@media (max-width:760px){
  .service-hero{padding:58px 0 42px}
  .service-hero h1{font-size:clamp(2.45rem,10.5vw,3.45rem);line-height:1.04}
  .glossary-index{grid-template-columns:1fr}
}
@media (max-width:620px){
  .practice-download-actions{display:grid}
  .practice-download-actions .button{width:100%}
}

/* KARBOT FINAL UI POLISH — 2026-09-16
   Owner decision: no permanent decorative rings on primary CTA.
   Related content/card groups keep explicit left alignment. */
.button-primary{
  border-color:transparent;
  box-shadow:0 14px 34px rgba(11,140,255,.25);
}
.button-primary:hover{
  box-shadow:0 17px 38px rgba(11,140,255,.30);
}
/* Keep keyboard-only focus visible for accessibility; it is not a permanent decoration. */
.button-primary:focus-visible{
  outline:3px solid rgba(11,99,206,.30);
  outline-offset:4px;
}
.service-process > div,
.service-note,
.service-cta,
.practice-card,
.practice-upcoming-card,
.practice-author,
.practice-download,
.glossary-index a{
  text-align:left;
}
/* KARBOT FINAL UI POLISH — END */


/* KARBOT PRACTICE HUB ALIGNMENT — 2026-09-16
   Collection/hub pages use the standard 1180px left edge. Reading articles stay narrower. */
.practice-hero .wrap,
.practice-hub-content{
  text-align:left;
}
.practice-hub-content > p:first-child,
.practice-hub-content .practice-card > p{
  max-width:920px;
}
/* KARBOT PRACTICE HUB ALIGNMENT — END */