:root {
  --ink: #171816;
  --paper: #f1f2ed;
  --card: #fafbf7;
  --red: #d9362b;
  --red-dark: #a92720;
  --grey: #62655e;
  --line: #cfd1ca;
  --max: 1160px;
  --radius: 4px;
}

* { box-sizing: border-box; }

html {
  scroll-behavior: smooth;
  background: var(--paper);
}

body {
  margin: 0;
  color: var(--ink);
  background: var(--paper);
  font-family: "Manrope", Arial, sans-serif;
  font-size: 17px;
  line-height: 1.58;
  -webkit-font-smoothing: antialiased;
}

a { color: inherit; text-underline-offset: 0.18em; }
a:hover { text-decoration-thickness: 2px; }

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible {
  outline: 3px solid var(--ink);
  outline-offset: 3px;
}

.skip-link {
  position: fixed;
  z-index: 100;
  top: 8px;
  left: 8px;
  padding: 10px 14px;
  transform: translateY(-180%);
  background: var(--ink);
  color: #fff;
}
.skip-link:focus { transform: translateY(0); }

.site-header {
  position: relative;
  z-index: 10;
  border-bottom: 1px solid var(--line);
  background: rgba(241, 242, 237, 0.97);
}

.header-inner,
.wrap {
  width: min(calc(100% - 40px), var(--max));
  margin-inline: auto;
}

.header-inner {
  min-height: 82px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
}

.brand { display: inline-flex; flex: 0 0 auto; }
.brand img { display: block; width: 180px; height: 42px; }

.nav-toggle {
  display: none;
  min-height: 44px;
  border: 1px solid var(--ink);
  border-radius: var(--radius);
  padding: 8px 13px;
  background: transparent;
  color: var(--ink);
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.site-nav { display: flex; align-items: center; gap: 22px; }
.site-nav a { font-size: 0.89rem; font-weight: 700; text-decoration: none; }
.site-nav a:hover { text-decoration: underline; }
.site-nav .nav-contact { color: var(--red-dark); }

.hero {
  padding: 68px 0 64px;
  border-bottom: 1px solid var(--ink);
}

.hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.65fr) minmax(250px, 0.65fr);
  gap: clamp(44px, 8vw, 112px);
  align-items: end;
}

.kicker,
.section-code,
.meta-label {
  margin: 0 0 18px;
  color: var(--red-dark);
  font: 700 0.76rem/1.2 ui-monospace, SFMono-Regular, Menlo, monospace;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}

h1,
h2,
h3,
p { margin-top: 0; }

h1 {
  max-width: 880px;
  margin-bottom: 26px;
  font-size: clamp(2.45rem, 6vw, 5.4rem);
  line-height: 0.96;
  letter-spacing: -0.052em;
}

.hero-lead {
  max-width: 770px;
  margin-bottom: 30px;
  color: #363833;
  font-size: clamp(1.08rem, 2vw, 1.31rem);
  line-height: 1.48;
}

.button-row { display: flex; flex-wrap: wrap; gap: 12px; }
.button {
  display: inline-flex;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  padding: 11px 18px;
  border: 2px solid var(--red);
  border-radius: var(--radius);
  background: var(--red);
  color: #fff;
  font-weight: 700;
  line-height: 1.2;
  text-decoration: none;
}
.button:hover { border-color: var(--red-dark); background: var(--red-dark); }
.button-secondary { background: transparent; color: var(--ink); border-color: var(--ink); }
.button-secondary:hover { background: var(--ink); color: #fff; }

.file-index {
  border-top: 4px solid var(--red);
  background: var(--card);
  padding: 22px;
}
.file-index p { margin-bottom: 12px; color: var(--grey); font-size: 0.84rem; }
.file-index ol { margin: 0; padding: 0; list-style: none; }
.file-index li { border-top: 1px solid var(--line); }
.file-index a { display: flex; justify-content: space-between; gap: 12px; padding: 11px 0; font-weight: 700; text-decoration: none; }
.file-index span { color: var(--grey); font: 500 0.72rem ui-monospace, SFMono-Regular, Menlo, monospace; }

.proof-strip {
  background: var(--ink);
  color: #fff;
}
.proof-inner {
  display: grid;
  grid-template-columns: minmax(180px, 0.46fr) 1fr;
  gap: 36px;
  align-items: center;
  padding-block: 30px;
}
.proof-number { margin: 0; color: #fff; font-size: clamp(2.4rem, 5vw, 4.4rem); font-weight: 700; line-height: 1; letter-spacing: -0.04em; }
.proof-number span { display: block; margin-top: 8px; color: #f3b2ad; font: 700 0.75rem/1.3 ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: 0.1em; text-transform: uppercase; }
.proof-copy p { margin: 0; }
.proof-copy strong { font-size: 1.18rem; }
.proof-note { margin-top: 8px !important; color: #cccec7; font-size: 0.9rem; }

.content-section { padding: 40px 0; border-bottom: 1px solid var(--line); }
.section-head {
  display: grid;
  grid-template-columns: minmax(190px, 0.45fr) 1fr;
  gap: 36px;
  margin-bottom: 34px;
}
.section-head h2,
.contact-panel h2 { margin-bottom: 0; font-size: clamp(1.85rem, 3.5vw, 3.1rem); line-height: 1.05; letter-spacing: -0.035em; }
.section-intro { max-width: 690px; margin-bottom: 0; color: var(--grey); font-size: 1.06rem; }

.service-list { border-top: 1px solid var(--ink); }
.service-row {
  display: grid;
  grid-template-columns: 80px minmax(180px, 0.5fr) 1fr;
  gap: 26px;
  padding: 28px 0;
  border-bottom: 1px solid var(--line);
}
.service-row:last-child { border-bottom: 0; }
.row-code { color: var(--red-dark); font: 700 0.75rem ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: 0.08em; }
.service-row h3 { margin-bottom: 8px; font-size: 1.23rem; line-height: 1.25; }
.service-row p { margin-bottom: 10px; color: #454741; }
.service-row p:last-child { margin-bottom: 0; }
.result { padding-left: 14px; border-left: 4px solid var(--red); color: var(--ink) !important; font-size: 0.94rem; }

.two-column,
.contact-panel {
  display: grid;
  grid-template-columns: 0.82fr 1.18fr;
  gap: clamp(38px, 7vw, 92px);
}

.steps { margin: 0; padding: 0; counter-reset: steps; list-style: none; }
.steps li { position: relative; padding: 0 0 25px 56px; border-left: 1px solid var(--line); }
.steps li:last-child { padding-bottom: 0; border-left-color: transparent; }
.steps li::before {
  content: counter(steps, decimal-leading-zero);
  counter-increment: steps;
  position: absolute;
  top: -2px;
  left: -19px;
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--red);
  color: #fff;
  font: 700 0.72rem ui-monospace, SFMono-Regular, Menlo, monospace;
}
.steps strong { display: block; margin-bottom: 4px; }
.steps p { margin-bottom: 0; color: var(--grey); }

.data-list { margin: 0; padding: 0; border-top: 1px solid var(--ink); list-style: none; }
.data-list li { padding: 13px 0 13px 28px; border-bottom: 1px solid var(--line); background: linear-gradient(var(--red), var(--red)) no-repeat 2px 22px / 9px 4px; }

.note-box { padding: 24px; border: 1px solid var(--ink); border-left: 4px solid var(--red); background: var(--card); }
.note-box h3 { margin-bottom: 9px; }
.note-box p:last-child { margin-bottom: 0; }

.related-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--ink); }
.related-link { display: block; min-height: 160px; padding: 22px; border-right: 1px solid var(--line); text-decoration: none; }
.related-link:last-child { border-right: 0; }
.related-link:hover { background: var(--card); }
.related-link .section-code { display: block; margin-bottom: 44px; }
.related-link strong { display: block; font-size: 1.1rem; }

.contact-section { padding: 40px 0; background: var(--card); border-bottom: 4px solid var(--red); }
.contact-copy { max-width: 680px; }
.contact-copy p { color: var(--grey); }
.contact-email { display: inline-block; margin: 6px 0 18px; color: var(--red-dark); font-size: clamp(1.15rem, 2.6vw, 1.65rem); font-weight: 700; overflow-wrap: anywhere; }
.contact-meta { padding-top: 20px; border-top: 1px solid var(--line); color: var(--grey); font-size: 0.91rem; }

.site-footer { padding: 26px 0 36px; }
.footer-inner { display: flex; justify-content: space-between; gap: 22px; color: var(--grey); font-size: 0.85rem; }
.footer-inner p { margin: 0; }
.footer-links { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 14px 20px; }

.scope-title { padding: 56px 0 38px; border-bottom: 4px solid var(--red); }
.scope-title h1 { max-width: 920px; font-size: clamp(2.3rem, 5vw, 4.6rem); }
.scope-title .hero-lead { margin-bottom: 0; }
.scope-meta { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--line); }
.scope-meta div { padding: 18px 22px; background: var(--card); }
.scope-meta dt { color: var(--grey); font: 700 0.7rem ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: 0.08em; text-transform: uppercase; }
.scope-meta dd { margin: 6px 0 0; font-weight: 700; }

.calculator-shell { padding: 58px 0 74px; }
.calculator-intro { max-width: 820px; margin-bottom: 34px; }
.calculator-intro h1 { font-size: clamp(2.25rem, 5vw, 4.5rem); }
.calculator-grid { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(290px, 0.7fr); gap: 32px; align-items: start; }
.calculator-panel, .calculator-results { padding: 28px; border: 1px solid var(--ink); background: var(--card); }
.scenario-row { display: grid; grid-template-columns: 1fr auto; gap: 12px; align-items: end; margin-bottom: 26px; }
.field-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.field { display: grid; gap: 6px; }
.field label { font-size: 0.88rem; font-weight: 700; }
.field small { color: var(--grey); }
.field input, .field select {
  width: 100%;
  min-height: 46px;
  border: 1px solid #72756e;
  border-radius: var(--radius);
  padding: 10px 12px;
  background: #fff;
  color: var(--ink);
  font: inherit;
}
.result-list { margin: 0; }
.result-list > div { display: grid; grid-template-columns: 1fr auto; gap: 20px; padding: 17px 0; border-bottom: 1px solid var(--line); }
.result-list dt { color: var(--grey); }
.result-list dd { margin: 0; font-weight: 700; text-align: right; }
.result-list .primary-result { margin: 0 -28px; padding: 21px 28px; background: var(--ink); color: #fff; }
.result-list .primary-result dt { color: #cccec7; }
.result-negative { color: var(--red-dark); }
.calculator-error { margin: 18px 0 0; padding: 12px; border-left: 4px solid var(--red); background: #fff0ee; color: #741b16; font-weight: 700; }
.calculator-note { margin-top: 22px; color: var(--grey); font-size: 0.9rem; }

@media (max-width: 900px) {
  .js .nav-toggle { display: inline-flex; align-items: center; }
  .js .site-nav {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    display: none;
    padding: 12px 20px 20px;
    border-bottom: 1px solid var(--ink);
    background: var(--paper);
  }
  .js .site-nav[data-open="true"] { display: grid; gap: 0; }
  .js .site-nav a { min-height: 46px; display: flex; align-items: center; border-bottom: 1px solid var(--line); }
  .hero-grid { grid-template-columns: 1fr; gap: 42px; }
  .file-index { max-width: 560px; }
  .section-head,
  .two-column,
  .contact-panel { grid-template-columns: 1fr; gap: 24px; }
  .related-grid { grid-template-columns: 1fr; }
  .related-link { min-height: 0; border-right: 0; border-bottom: 1px solid var(--line); }
  .related-link:last-child { border-bottom: 0; }
  .related-link .section-code { margin-bottom: 18px; }
  .calculator-grid { grid-template-columns: 1fr; }
}

@media (max-width: 680px) {
  body { font-size: 16px; }
  .header-inner, .wrap { width: min(calc(100% - 32px), var(--max)); }
  .header-inner { min-height: 70px; }
  .brand img { width: 154px; height: 36px; }
  .hero { padding: 46px 0 50px; }
  h1 { font-size: clamp(2.35rem, 13vw, 3.55rem); }
  .proof-inner { grid-template-columns: 1fr; gap: 14px; padding-block: 28px; }
  .content-section, .contact-section { padding: 28px 0; }
  .service-row { grid-template-columns: 42px 1fr; gap: 14px; }
  .service-row > div:last-child { grid-column: 2; }
  .scope-meta { grid-template-columns: 1fr; }
  .field-grid, .scenario-row { grid-template-columns: 1fr; }
  .footer-inner { display: grid; }
  .footer-links { justify-content: flex-start; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}

@media print {
  @page { size: A4; margin: 15mm 14mm; }
  body { background: #fff; color: #000; font-size: 10.5pt; line-height: 1.35; }
  .site-header, .site-footer, .button-row, .skip-link, .related-section { display: none !important; }
  .wrap { width: 100%; max-width: none; }
  .scope-title { padding: 0 0 8mm; }
  .scope-title h1 { font-size: 28pt; }
  .content-section { padding: 9mm 0; break-inside: avoid; }
  .service-row { padding: 5mm 0; break-inside: avoid; }
  .contact-section { padding: 9mm 0; background: #fff; border-top: 1px solid #000; }
  a { color: #000; text-decoration: none; }
}

/* Oferta usług: rzeczywiste projekty i formularz. */
.offer-page .hero{padding:48px 0}.offer-page .hero-grid{grid-template-columns:1.15fr 1fr;gap:44px;align-items:center}.offer-page h1{font-size:clamp(2.45rem,4.35vw,4rem);line-height:1.04;letter-spacing:-.045em;margin-bottom:22px}.offer-page .hero-lead{font-size:1.12rem;line-height:1.5;margin-bottom:24px}
.hero-media{margin:0}.hero-media img{display:block;width:100%;height:auto;aspect-ratio:1.56;object-fit:cover;border-radius:4px}.hero-media figcaption,.project-card figcaption{padding-top:8px;font-size:.76rem;color:var(--grey);line-height:1.35}
.offer-page .proof-inner{padding-block:22px;grid-template-columns:190px 1fr}.offer-page .proof-inner p{margin:0}.offer-page .proof-number{font-size:3rem}.offer-page .content-section{padding-block:36px}.offer-page .section-head{grid-template-columns:1fr 1fr;gap:40px;margin-bottom:26px;align-items:end}.offer-page h2{font-size:clamp(1.8rem,3vw,2.65rem);line-height:1.1;letter-spacing:-.035em}.offer-page .section-code{margin-bottom:12px}
.offer-row{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:48px;padding-block:24px;border-bottom:1px solid var(--line);align-items:center}.offer-row:last-child{border-bottom:0;padding-bottom:0}.offer-row h3{margin-bottom:8px;font-size:1.2rem;line-height:1.3}.offer-row p{margin-bottom:0;color:#454741;max-width:730px}.service-cta{display:inline-flex;align-items:center;justify-content:space-between;gap:14px;min-height:44px;color:var(--red-dark);font-size:.94rem;font-weight:700;text-decoration:none}.service-cta:hover{text-decoration:underline}.scope-note{margin:24px 0 0;border-left:3px solid var(--red);padding-left:15px;color:var(--grey);font-size:.9rem}
.projects-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}.projects-grid:has(.project-card:nth-child(2):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}.project-card figure{margin:0 0 16px}.project-card img{display:block;width:100%;height:auto;aspect-ratio:1.75;object-fit:cover;border-radius:4px}.project-card .project-meta{margin-bottom:8px;color:var(--red-dark);font-size:.76rem;font-weight:700;line-height:1.45}.project-card h3{font-size:1.16rem;line-height:1.3;margin-bottom:8px}.project-card>p:last-child{margin-bottom:0;color:#454741;font-size:.95rem}
.offer-page .contact-section{padding-block:36px}.offer-page .contact-panel{grid-template-columns:.75fr 1.25fr;gap:60px}.contact-intro h2{margin-bottom:18px}.contact-intro>p{color:#454741}.order-note{border-top:1px solid var(--line);margin-top:24px;padding-top:20px}.order-note h3{font-size:1rem;margin-bottom:6px}.order-note p{margin-bottom:0;color:var(--grey);font-size:.94rem}.direct-contact{margin:24px 0 0;font-size:.94rem}.direct-contact a{color:var(--red-dark);overflow-wrap:anywhere}
.lead-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 20px}.lead-form .full{grid-column:1/-1}.lead-form .form-intro{margin:0;font-size:.95rem}.lead-form input,.lead-form select,.lead-form textarea{width:100%;font:inherit}.lead-form textarea{border:1px solid #72756e;border-radius:4px;padding:10px 12px;background:#fff;color:var(--ink);resize:vertical;min-height:112px}.lead-form .optional{color:var(--grey);font-weight:400}.lead-form .error{color:#a92720;font-size:.87rem}.lead-form .error:empty,.form-status:empty,.turnstile-slot:empty{display:none}.lead-form [aria-invalid="true"]{border-color:#a92720}.honeypot{position:absolute;left:-9999px;width:1px!important;height:1px;opacity:0}.consent{display:flex;align-items:flex-start;gap:10px;font-size:.88rem;line-height:1.5}.lead-form .consent input{width:20px;height:20px;margin:2px 0 0;flex:0 0 auto;accent-color:var(--red-dark)}.form-delivery,.form-note{margin:0;color:var(--grey);font-size:.85rem;line-height:1.45}.lead-form button{font:inherit;font-weight:700;cursor:pointer}.lead-form button:disabled{opacity:.65;cursor:wait}.form-status{margin:0;padding:14px;border:1px solid var(--line);font-size:.94rem}.form-status.is-error{background:#fff0ee;color:#741b16;border-color:#a92720}.form-status.is-success{background:#eef5ee;color:#224c2d;border-color:#55755b}textarea:focus-visible{outline:3px solid var(--ink);outline-offset:3px}
.overview-links{display:grid;gap:10px}.overview-links a{min-height:44px;display:flex;align-items:center;color:var(--red-dark)}.offer-page .scope-title .hero-lead{margin-bottom:24px}.legal-page{padding-block:40px;max-width:850px}.legal-page h1{font-size:clamp(2rem,5vw,3.5rem);margin-top:30px}.legal-page h2{margin-top:30px}
@media(max-width:1024px){.offer-page .hero-grid{gap:30px}.offer-page .hero-media img{aspect-ratio:1.25}.offer-page .contact-panel{gap:32px}}
@media(max-width:900px){.offer-page .hero-grid{grid-template-columns:1fr;gap:24px}.offer-page .hero-media img{aspect-ratio:2.1}.offer-page .hero-media{max-width:640px}.offer-page .section-head,.offer-page .contact-panel{grid-template-columns:1fr;gap:24px}.offer-row{grid-template-columns:1fr 240px;gap:30px}.projects-grid{gap:20px}}
@media(max-width:680px){.offer-page .hero{padding-block:32px}.offer-page h1{font-size:clamp(2.4rem,10.2vw,2.9rem)}.offer-page .hero-lead{font-size:1.03rem}.offer-page .button-row{gap:10px}.offer-page .button-row .button{padding-inline:14px}.offer-page .proof-inner{grid-template-columns:1fr;gap:14px;padding-block:22px}.offer-page .proof-number{font-size:2.5rem}.offer-page .content-section,.offer-page .contact-section{padding-block:24px}.offer-page .section-head{gap:16px;margin-bottom:20px}.offer-row{grid-template-columns:1fr;gap:8px;padding-block:20px}.service-cta{justify-content:flex-start}.projects-grid,.projects-grid:has(.project-card:nth-child(2):last-child){grid-template-columns:1fr;gap:28px}.lead-form{gap:16px;grid-template-columns:1fr}.lead-form .full{grid-column:1}.contact-intro .direct-contact{margin-top:16px}}
@media print{.lead-form,.hero-media,.service-cta{display:none!important}.offer-row{grid-template-columns:1fr;break-inside:avoid}}
