/* === Klimatron — Malnet | main.css (built) === */

/* === _tokens.css === */
/* === Design tokens (per spec §8) === */

:root {
  /* Paleta */
  --color-ink:        #0A2540;
  --color-ink-soft:   #1F3A5F;
  --color-mute:       #5C7891;

  --color-paper:      #FFFFFF;
  --color-cream:      #F7F9FC;
  --color-line:       #E3E9F0;

  --color-cool:       #06B6D4;
  --color-cool-deep:  #0891B2;
  --color-cool-mist:  #ECFEFF;

  --color-warm:       #F97316;
  --color-warm-deep:  #EA580C;

  --color-success:    #10B981;
  --color-warning:    #F59E0B;
  --color-danger:     #EF4444;

  /* Hero overlay tokens */
  --hero-overlay-light:  linear-gradient(180deg, rgba(10,37,64,0) 0%, rgba(10,37,64,0.35) 40%, rgba(10,37,64,0.85) 100%);
  --hero-overlay-medium: linear-gradient(180deg, rgba(10,37,64,0) 0%, rgba(10,37,64,0.20) 40%, rgba(10,37,64,0.70) 100%);
  --hero-overlay-dark:   linear-gradient(180deg, rgba(10,37,64,0) 0%, rgba(10,37,64,0.15) 50%, rgba(10,37,64,0.55) 100%);

  /* Typografia */
  --font-display: "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-body:    "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;

  --fs-h1:    clamp(2.25rem, 1.6rem + 3.2vw, 4.5rem);
  --fs-h2:    clamp(1.75rem, 1.3rem + 2.2vw, 3.25rem);
  --fs-h3:    clamp(1.375rem, 1.15rem + 1.1vw, 2rem);
  --fs-h4:    clamp(1.125rem, 1.05rem + 0.4vw, 1.375rem);
  --fs-body:  clamp(1rem, 0.95rem + 0.25vw, 1.125rem);
  --fs-small: 0.875rem;

  /* Spacing — 8-pkt grid */
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  24px;
  --space-6:  32px;
  --space-7:  48px;
  --space-8:  64px;
  --space-9:  96px;
  --space-10: 128px;

  /* Promienie */
  --radius-sm:   6px;
  --radius-md:   12px;
  --radius-lg:   20px;
  --radius-pill: 999px;

  /* Cienie */
  --shadow-1:    0 1px 2px rgba(10, 37, 64, 0.06);
  --shadow-2:    0 4px 12px rgba(10, 37, 64, 0.08);
  --shadow-3:    0 12px 32px rgba(10, 37, 64, 0.12);
  --shadow-glow: 0 0 0 4px rgba(6, 182, 212, 0.15);

  /* Easing */
  --ease-out-quint:    cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in-out-circ:  cubic-bezier(0.85, 0, 0.15, 1);
  --ease-spring:       cubic-bezier(0.34, 1.56, 0.64, 1);

  /* Czas trwania */
  --dur-instant:  120ms;
  --dur-fast:     220ms;
  --dur-normal:   340ms;
  --dur-slow:     500ms;
  --dur-marquee:   28s;
  --dur-kenburns:  12s;
  --dur-slider:    5s;

  /* Container */
  --container-max: 1280px;
  --container-pad: clamp(1rem, 4vw, 2.5rem);

  /* Layout */
  --header-h:         72px;
  --header-h-mobile:  60px;
}

/* === _reset.css === */
/* === Reset (modern minimal) === */

*, *::before, *::after { box-sizing: border-box; }

* { margin: 0; padding: 0; }

html {
  -webkit-text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  scroll-behavior: smooth;
  scroll-padding-top: var(--header-h);
}

body {
  min-height: 100vh;
  line-height: 1.5;
  color: var(--color-ink);
  background: var(--color-paper);
  font-family: var(--font-body);
  font-size: var(--fs-body);
  font-weight: 400;
  -webkit-tap-highlight-color: transparent;
}

img, picture, video, canvas, svg {
  display: block;
  max-width: 100%;
  height: auto;
}

input, button, textarea, select {
  font: inherit;
  color: inherit;
}

button {
  background: none;
  border: 0;
  cursor: pointer;
}

a {
  color: inherit;
  text-decoration: none;
}

ul, ol { list-style: none; }

table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* Focus widoczny dla nawigacji klawiaturowej */
:focus-visible {
  outline: 2px solid var(--color-cool);
  outline-offset: 3px;
  border-radius: var(--radius-sm);
}

/* Selection */
::selection {
  background: var(--color-cool);
  color: var(--color-paper);
}

/* HTML hidden attribute — wymuszamy display:none nawet jak komponent ma własny display:flex/grid */
[hidden] { display: none !important; }

/* === MOBILE OPTIMIZATIONS === */

/* Touch action — usuwa 300ms tap delay na touchscreenach */
button, a, input, select, textarea, [role="button"] {
  touch-action: manipulation;
}

/* Zapobieganie horizontal scroll na mobile */
html, body {
  overflow-x: hidden;
  max-width: 100vw;
}

/* iOS auto-zoom prevention — input fields musi mieć min 16px font na mobile */
@media (max-width: 599px) {
  input[type="text"],
  input[type="email"],
  input[type="tel"],
  input[type="number"],
  input[type="search"],
  input[type="password"],
  input[type="url"],
  input[type="date"],
  select,
  textarea {
    font-size: 16px !important;
  }
}

/* Touch target minimum 44×44 (Apple HIG / WCAG 2.5.5) na touch devices */
@media (hover: none) and (pointer: coarse) {
  .footer-link,
  .footer-contact__link,
  .mobile-drawer a,
  .primary-nav a,
  .breadcrumbs a,
  .lightbox__nav,
  .lightbox__close,
  .pagination a,
  .pagination span,
  .text-link {
    min-height: 44px;
  }
  .footer-list li a,
  .mobile-drawer .menu > li > a {
    display: inline-flex;
    align-items: center;
  }
}

/* Lepsza wybieralność tekstu i wyłączenie call-out na touch */
button, a {
  -webkit-touch-callout: none;
}

/* Reduced motion — globalny szkielet (komponenty mają własne overrides) */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* === _typography.css === */
/* === Typography === */

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-display);
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: -0.02em;
  color: var(--color-ink);
}

h1 { font-size: var(--fs-h1); }
h2 { font-size: var(--fs-h2); }
h3 { font-size: var(--fs-h3); }
h4 { font-size: var(--fs-h4); }
h5 { font-size: 1.125rem; }
h6 { font-size: 1rem; }

p, li {
  font-size: var(--fs-body);
  line-height: 1.65;
  color: var(--color-ink-soft);
  font-weight: 400;
  max-width: 70ch;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.entry-content {
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.entry-content p,
.entry-content li,
.entry-content dt,
.entry-content dd,
.entry-content td,
.entry-content th {
  font-weight: 400;
}
.entry-content strong,
.entry-content b {
  font-weight: 600;
}

p + p,
.entry-content > * + * {
  margin-top: var(--space-4);
}

.entry-content {
  max-width: 70ch;
}

/* Cennik / Referencje — pełna szerokość, bez ograniczenia 70ch */
.page-template-page-cennik .entry-content,
.page-template-page-cennik .entry-content p,
.page-template-page-cennik .entry-content ul,
.page-template-page-cennik .entry-content ol,
.page-template-page-referencje .entry-content,
.page-template-page-referencje .entry-content p,
.page-template-page-referencje .entry-content ul,
.page-template-page-referencje .entry-content ol {
  max-width: none;
}

.entry-content h2 { margin-top: var(--space-7); margin-bottom: var(--space-4); }
.entry-content h3 { margin-top: var(--space-6); margin-bottom: var(--space-3); }
.entry-content h4 { margin-top: var(--space-5); margin-bottom: var(--space-3); }

.entry-content ul,
.entry-content ol {
  padding-left: var(--space-5);
  max-width: 70ch;
}
.entry-content ul { list-style: none; }
.entry-content ul > li {
  position: relative;
  padding-left: var(--space-4);
  margin-bottom: var(--space-2);
}
.entry-content ul > li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.7em;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--color-cool);
}
.entry-content ol {
  list-style: decimal;
  list-style-position: outside;
}
.entry-content ol > li {
  margin-bottom: var(--space-2);
  padding-left: var(--space-2);
}

.entry-content blockquote {
  margin: var(--space-6) 0;
  padding: var(--space-4) var(--space-5);
  border-left: 3px solid var(--color-cool);
  background: var(--color-cool-mist);
  border-radius: 0 var(--radius-md) var(--radius-md) 0;
  font-size: 1.125rem;
  color: var(--color-ink);
}

.entry-content a:not(.btn):not(.btn--primary):not(.btn--ghost):not(.btn--ink) {
  color: var(--color-cool-deep);
  text-decoration: underline;
  text-underline-offset: 0.2em;
  text-decoration-thickness: 1.5px;
  transition: color var(--dur-fast) var(--ease-out-quint);
}
.entry-content a:not(.btn):not(.btn--primary):not(.btn--ghost):not(.btn--ink):hover {
  color: var(--color-warm-deep);
}

/* Buttony w entry-content — nie dziedziczą stylów linka */
.entry-content a.btn,
.entry-content a.btn--primary,
.entry-content a.btn--ghost,
.entry-content a.btn--ink {
  text-decoration: none;
}
.entry-content a.btn--primary,
.entry-content a.btn--primary:hover,
.entry-content a.btn--primary:focus {
  color: var(--color-paper);
}
.entry-content a.btn--ink,
.entry-content a.btn--ink:hover,
.entry-content a.btn--ink:focus {
  color: var(--color-paper);
}

/* Lead — pierwszy paragraf w entry-content */
.entry-content > p:first-of-type,
.entry-content .oferta-lead {
  font-size: 1.25rem;
  font-weight: 400;
  color: var(--color-ink);
  line-height: 1.55;
  margin-bottom: var(--space-6);
  padding: var(--space-5) var(--space-5);
  background: linear-gradient(135deg, var(--color-cool-mist) 0%, rgba(236, 254, 255, 0.4) 100%);
  border-left: 3px solid var(--color-cool);
  border-radius: 0 var(--radius-md) var(--radius-md) 0;
  max-width: none;
}

/* === Single-oferta: bogate stylowanie treści === */

.single-oferta .entry-content {
  max-width: none;
}

.single-oferta .entry-content h2 {
  position: relative;
  font-size: clamp(1.375rem, 1.1rem + 1.1vw, 1.75rem);
  margin-top: var(--space-8);
  margin-bottom: var(--space-4);
  padding-left: var(--space-4);
  border-left: 4px solid var(--color-cool);
  line-height: 1.2;
}
.single-oferta .entry-content h2::after {
  content: '';
  display: block;
  width: 60px;
  height: 3px;
  background: linear-gradient(90deg, var(--color-cool) 0%, var(--color-cool-deep) 100%);
  margin-top: var(--space-2);
  border-radius: 2px;
}

.single-oferta .entry-content h2:first-child {
  margin-top: var(--space-5);
}

.single-oferta .entry-content h3 {
  font-size: 1.125rem;
  margin-top: var(--space-5);
  margin-bottom: var(--space-2);
  color: var(--color-ink);
  line-height: 1.3;
}

.single-oferta .entry-content p {
  font-size: 1.0625rem;
  line-height: 1.7;
  color: var(--color-ink-soft);
  max-width: 70ch;
}

.single-oferta .entry-content strong {
  color: var(--color-ink);
  font-weight: 700;
}

.single-oferta .entry-content em {
  color: var(--color-cool-deep);
  font-style: italic;
}

/* Listy bullet — cyan kropka + lepsze odstępy */
.single-oferta .entry-content ul {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  margin-block: var(--space-4) var(--space-5);
  padding-left: 0;
}

.single-oferta .entry-content ul > li {
  position: relative;
  padding-left: var(--space-5);
  margin: 0;
  line-height: 1.65;
  color: var(--color-ink-soft);
}

.single-oferta .entry-content ul > li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.65em;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--color-cool) 0%, var(--color-cool-deep) 100%);
  box-shadow: 0 0 0 3px rgba(6, 182, 212, 0.12);
}

.single-oferta .entry-content ul > li > strong:first-child {
  display: inline;
}

/* Listy numerowane (kroki "Jak pracujemy") — kółka z numerami */
.single-oferta .entry-content ol {
  list-style: none;
  counter-reset: oferta-step;
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  margin-block: var(--space-4) var(--space-5);
  padding-left: 0;
}

.single-oferta .entry-content ol > li {
  counter-increment: oferta-step;
  position: relative;
  padding-left: 56px;
  padding-top: 4px;
  min-height: 44px;
  line-height: 1.65;
  color: var(--color-ink-soft);
}

.single-oferta .entry-content ol > li::before {
  content: counter(oferta-step);
  position: absolute;
  left: 0;
  top: 0;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, var(--color-cool) 0%, var(--color-cool-deep) 100%);
  color: var(--color-paper);
  border-radius: 50%;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 1.125rem;
  box-shadow: 0 4px 12px rgba(6, 182, 212, 0.25);
  font-variant-numeric: tabular-nums;
}

/* FAQ section — h3 + p jako style "akordeon-look" */
.single-oferta .entry-content h2 + h3 {
  margin-top: var(--space-3);
}

/* Każde h3 w FAQ — subtle background card */
.single-oferta .entry-content > h3 {
  position: relative;
  padding: var(--space-4) var(--space-5) 0;
  background: var(--color-paper);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-md) var(--radius-md) 0 0;
  border-bottom: 0;
  margin-top: var(--space-4);
  font-family: var(--font-display);
  font-weight: 700;
  color: var(--color-ink);
}

.single-oferta .entry-content > h3::before {
  content: '?';
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  background: var(--color-cool);
  color: var(--color-paper);
  border-radius: 50%;
  font-size: 0.875rem;
  font-weight: 700;
  margin-right: var(--space-2);
  vertical-align: middle;
}

/* Paragraf bezpośrednio po h3 = odpowiedź FAQ */
.single-oferta .entry-content > h3 + p {
  padding: var(--space-3) var(--space-5) var(--space-4);
  background: var(--color-paper);
  border: 1px solid var(--color-line);
  border-top: 0;
  border-radius: 0 0 var(--radius-md) var(--radius-md);
  margin-top: 0;
  margin-bottom: 0;
  max-width: none;
}

@media (prefers-reduced-motion: reduce) {
  .single-oferta .entry-content ol > li::before,
  .single-oferta .entry-content ul > li::before {
    box-shadow: none;
  }
}

strong, b { font-weight: 700; color: var(--color-ink); }
em, i { font-style: italic; }

small { font-size: var(--fs-small); }

code {
  font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace;
  background: var(--color-cream);
  padding: 0.1em 0.3em;
  border-radius: var(--radius-sm);
  font-size: 0.9em;
}

hr {
  border: 0;
  height: 1px;
  background: var(--color-line);
  margin: var(--space-7) 0;
}

/* === _layout.css === */
/* === Layout === */

.container {
  width: 100%;
  max-width: var(--container-max);
  padding-inline: var(--container-pad);
  margin-inline: auto;
}

.container--narrow { max-width: 880px; }
.container--reading { max-width: 720px; }

/* Sekcje */
.section { padding-block: var(--space-8); }
.section--lg { padding-block: var(--space-9); }
.section--cream { background: var(--color-cream); }
.section--ink { background: var(--color-ink); color: var(--color-paper); }
.section--ink h1, .section--ink h2, .section--ink h3 { color: var(--color-paper); }
.section--ink p { color: rgba(255,255,255,0.85); }

/* Site header — zawsze białe tło z blur, niezależnie od hero. Klasa .is-scrolled dodaje tylko mocniejszy shadow. */
.site-header {
  position: sticky;
  top: 0;
  left: 0;
  right: 0;
  z-index: 100;
  background: rgba(255, 255, 255, 0.92);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  box-shadow: var(--shadow-1);
  padding-block: 15px;
  display: flex;
  align-items: center;
  transition: box-shadow var(--dur-fast) var(--ease-out-quint),
              background var(--dur-fast) var(--ease-out-quint),
              padding-block var(--dur-fast) var(--ease-out-quint);
}

.site-header.is-scrolled {
  background: rgba(255, 255, 255, 0.96);
  box-shadow: var(--shadow-2);
}

.site-header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}

.site-logo {
  display: inline-flex;
  align-items: center;
  gap: var(--space-3);
  color: var(--color-ink);
  text-decoration: none;
}

.site-logo__icon {
  display: block;
  width: auto;
  height: 40px;
  flex: 0 0 auto;
}

.site-logo__text {
  font-family: var(--font-display);
  font-weight: 800;
  font-size: 1.375rem;
  letter-spacing: 0.04em;
  color: var(--color-ink);
  line-height: 1;
}

@media (max-width: 599px) {
  .site-logo__icon { height: 32px; }
  .site-logo__text { font-size: 1.125rem; }
}

/* === Footer === */

.site-footer {
  position: relative;
  background:
    radial-gradient(ellipse 60% 50% at 100% 0%, rgba(6, 182, 212, 0.10) 0%, transparent 60%),
    linear-gradient(180deg, var(--color-ink) 0%, #061B2F 100%);
  color: rgba(255, 255, 255, 0.78);
  margin-top: var(--space-9);
  font-size: 0.9375rem;
  line-height: 1.6;
  font-weight: 400;
}

.site-footer,
.site-footer * {
  font-weight: 400 !important;
}

/* Wyjątek — nagłówki w footerze pogrubione */
.site-footer h2,
.site-footer h3,
.site-footer h4,
.site-footer .footer-col__title,
.site-footer .site-footer__brand-name {
  font-weight: 700 !important;
}

.home .site-footer {
  margin-top: 0;
}

/* Strony z full-width banerem CTA (".cta-banner") nie potrzebują dodatkowego marginesu nad footerem */
main:has(.cta-banner) + .site-footer,
body:has(.cta-banner) .site-footer {
  margin-top: 0;
}

.site-footer::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent 0%,
    rgba(6, 182, 212, 0.45) 35%,
    rgba(6, 182, 212, 0.55) 50%,
    rgba(6, 182, 212, 0.45) 65%,
    transparent 100%
  );
}

/* --- Top brand strip --- */
.site-footer__top {
  padding: var(--space-7) 0 var(--space-6);
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.site-footer__top .container {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-3);
}
@media (min-width: 860px) {
  .site-footer__top .container {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-6);
  }
}

.site-footer__brand {
  display: inline-flex;
  align-items: center;
  gap: var(--space-3);
  text-decoration: none;
}

.site-footer__logo {
  display: block;
  width: auto;
  height: 44px;
  filter: brightness(200%) saturate(0%);
  transition: transform var(--dur-fast) var(--ease-out-quint);
}
.site-footer__brand:hover .site-footer__logo {
  transform: rotate(-6deg) scale(1.05);
}

.site-footer__brand-name {
  font-family: var(--font-display);
  font-weight: 800;
  font-size: 1.5rem;
  letter-spacing: 0.05em;
  color: var(--color-paper);
}

.site-footer__claim {
  margin: 0;
  font-family: var(--font-display);
  font-size: 1.0625rem;
  color: rgba(255, 255, 255, 0.7);
  font-style: italic;
  line-height: 1.4;
  max-width: 40ch;
}

/* --- Main grid --- */
.site-footer__main {
  padding-block: var(--space-8);
}

.site-footer__grid {
  display: grid;
  gap: var(--space-7);
  grid-template-columns: 1fr;
}
@media (min-width: 600px) {
  .site-footer__grid {
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-7) var(--space-6);
  }
}
@media (min-width: 1100px) {
  .site-footer__grid {
    grid-template-columns: 1.4fr 1fr 1fr 1.2fr;
    gap: var(--space-7);
  }
}

.footer-col__title {
  position: relative;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 0.875rem;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--color-paper);
  margin: 0 0 var(--space-4);
  padding-bottom: var(--space-3);
}
.footer-col__title::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  width: 32px;
  height: 2px;
  background: var(--color-cool);
  border-radius: 1px;
}

/* --- Listy w stopce --- */
.footer-list {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  list-style: none;
  padding: 0;
  margin: 0;
}

.footer-link {
  display: inline-block;
  position: relative;
  color: rgba(255, 255, 255, 0.78);
  text-decoration: none;
  transition: color var(--dur-fast) var(--ease-out-quint),
              transform var(--dur-fast) var(--ease-out-quint),
              padding var(--dur-fast) var(--ease-out-quint);
}
.footer-link:hover {
  color: var(--color-cool);
  padding-left: 6px;
}
.footer-link::before {
  content: '→';
  position: absolute;
  left: -10px;
  opacity: 0;
  transition: opacity var(--dur-fast) var(--ease-out-quint),
              left var(--dur-fast) var(--ease-out-quint);
}
.footer-link:hover::before {
  opacity: 1;
  left: -14px;
}

/* --- Kolumna kontakt z ikonami --- */
.footer-contact {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.footer-contact__item {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);
  color: rgba(255, 255, 255, 0.85);
  line-height: 1.5;
}

.footer-contact__item svg {
  flex: 0 0 auto;
  margin-top: 2px;
  color: var(--color-cool);
  transition: transform var(--dur-fast) var(--ease-spring);
}

.footer-contact__item:hover svg {
  transform: scale(1.15);
}

.footer-contact__link {
  color: var(--color-paper);
  text-decoration: none;
  font-weight: 500;
  transition: color var(--dur-fast) var(--ease-out-quint);
}
.footer-contact__link:hover {
  color: var(--color-cool);
}

/* --- Kolumna CTA --- */
.footer-col--cta {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-3);
}

.footer-col__text {
  color: rgba(255, 255, 255, 0.7);
  font-size: 0.9375rem;
  line-height: 1.5;
  margin: 0;
  max-width: 36ch;
}

.footer-col__cta {
  margin-top: var(--space-3);
}

.footer-col__phone {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  margin-top: var(--space-2);
  padding: var(--space-2) var(--space-3);
  border-radius: var(--radius-pill);
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.12);
  color: var(--color-paper);
  font-family: var(--font-display);
  font-weight: 600;
  font-size: 0.95rem;
  text-decoration: none;
  transition: background var(--dur-fast) var(--ease-out-quint),
              border-color var(--dur-fast) var(--ease-out-quint),
              transform var(--dur-fast) var(--ease-out-quint);
}
.footer-col__phone svg { color: var(--color-cool); }
.footer-col__phone:hover {
  background: rgba(6, 182, 212, 0.15);
  border-color: rgba(6, 182, 212, 0.5);
  transform: translateY(-2px);
}

/* --- Bottom bar --- */
.site-footer__bottom {
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  padding-block: var(--space-4) var(--space-5);
  font-size: 0.875rem;
  color: rgba(255, 255, 255, 0.55);
}

.site-footer__bottom-inner {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  align-items: flex-start;
}

@media (min-width: 600px) {
  .site-footer__bottom-inner {
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
  }
}

.site-footer__nip {
  display: inline-block;
  margin-left: var(--space-2);
  opacity: 0.75;
}

.site-footer__credit a {
  color: var(--color-paper);
  font-weight: 500;
}
.site-footer__credit a:hover {
  color: var(--color-cool);
}

/* Skip link */
.skip-link {
  position: absolute;
  top: -100px;
  left: var(--space-4);
  z-index: 999;
  background: var(--color-warm);
  color: var(--color-paper);
  padding: var(--space-3) var(--space-4);
  border-radius: var(--radius-md);
  font-weight: 600;
}
.skip-link:focus { top: var(--space-4); }

/* Site main — wrapper na content */
.site-main { min-height: 50vh; }

/* === _components.css === */
/* === Components === */

/* --- Buttons --- */

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  padding: 0.875rem 1.5rem;
  font-family: var(--font-display);
  font-weight: 600;
  font-size: 1rem;
  line-height: 1;
  border-radius: var(--radius-pill);
  border: 2px solid transparent;
  cursor: pointer;
  transition: transform var(--dur-fast) var(--ease-out-quint),
              background var(--dur-fast) var(--ease-out-quint),
              border-color var(--dur-fast) var(--ease-out-quint),
              color var(--dur-fast) var(--ease-out-quint),
              box-shadow var(--dur-fast) var(--ease-out-quint);
  text-decoration: none;
  white-space: nowrap;
}

.btn--primary {
  background: var(--color-warm);
  color: var(--color-paper);
  box-shadow: var(--shadow-2);
}
.btn--primary:hover {
  background: var(--color-warm-deep);
  transform: translateY(-2px);
  box-shadow: var(--shadow-3);
}
.btn--primary:active { transform: translateY(0); }

.btn--ghost {
  background: transparent;
  color: var(--color-paper);
  border-color: rgba(255,255,255,0.6);
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
.btn--ghost::before {
  content: '';
  position: absolute;
  inset: 0;
  background: var(--color-cool-mist);
  transform: translateY(101%);
  transition: transform var(--dur-fast) var(--ease-out-quint);
  z-index: -1;
}
.btn--ghost:hover {
  border-color: var(--color-cool);
  color: var(--color-ink);
}
.btn--ghost:hover::before { transform: translateY(0); }

.btn--ink {
  background: var(--color-ink);
  color: var(--color-paper);
}
.btn--ink:hover { background: var(--color-ink-soft); transform: translateY(-2px); }

.btn--lg { padding: 1rem 2rem; font-size: 1.0625rem; }
.btn--sm { padding: 0.5rem 1rem; font-size: 0.875rem; }

.btn--icon-after::after {
  content: '→';
  display: inline-block;
  transition: transform var(--dur-fast) var(--ease-out-quint);
}
.btn--icon-after:hover::after { transform: translateX(4px); }

/* --- Pill — telefon w headerze --- */

.btn--phone,
.primary-nav a.btn--phone,
.site-header .btn--phone {
  background: var(--color-warm);
  color: #fff;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  gap: var(--space-2);
  padding: 0.625rem 1.125rem;
  font-weight: 700;
  border-radius: var(--radius-pill);
  font-size: 0.95rem;
  line-height: 1;
  white-space: nowrap;
  box-shadow: var(--shadow-2);
  text-decoration: none;
}
.btn--phone:hover,
.primary-nav a.btn--phone:hover,
.site-header .btn--phone:hover {
  background: var(--color-warm-deep);
  color: #fff;
  transform: translateY(-2px);
}
.btn--phone svg,
.primary-nav a.btn--phone svg {
  display: inline-block;
  width: 1.1em;
  height: 1.1em;
  flex-shrink: 0;
  color: #fff;
  fill: currentColor;
}

/* --- Cards --- */

.card {
  display: flex;
  flex-direction: column;
  background: var(--color-paper);
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-1);
  transition: transform var(--dur-normal) var(--ease-out-quint),
              box-shadow var(--dur-normal) var(--ease-out-quint);
  position: relative;
}
.card:hover { transform: translateY(-4px); box-shadow: var(--shadow-3); }

.card__media {
  aspect-ratio: 3/2;
  overflow: hidden;
  background: var(--color-cream);
  position: relative;
}
.card__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--dur-slow) var(--ease-out-quint);
}
.card:hover .card__media img { transform: scale(1.05); }

.card__body { padding: var(--space-5); display: flex; flex-direction: column; flex: 1; gap: var(--space-3); }
.card__title { font-size: 1.375rem; line-height: 1.2; transition: color var(--dur-fast) var(--ease-out-quint); }
.card:hover .card__title { color: var(--color-cool-deep); }
.card__excerpt { color: var(--color-mute); font-size: 0.95rem; }
.card__footer { margin-top: auto; }

/* --- Karta oferty (hero thumbnail + gradient overlay + arrow icon) --- */

.card--oferta {
  position: relative;
  display: block;
  aspect-ratio: 4/3;
  min-height: 280px;
  border-radius: var(--radius-lg);
  overflow: hidden;
  color: var(--color-paper);
  text-decoration: none;
  isolation: isolate;
  box-shadow: var(--shadow-2);
  background: var(--color-ink);
  transition: transform var(--dur-normal) var(--ease-out-quint),
              box-shadow var(--dur-normal) var(--ease-out-quint);
}
.card--oferta:hover {
  transform: translateY(-6px);
  box-shadow: var(--shadow-3);
}

.card--oferta__media {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
}
.card--oferta__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 700ms var(--ease-out-quint);
}
.card--oferta:hover .card--oferta__media img {
  transform: scale(1.06);
}

.card--oferta__shade {
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(180deg,
      rgba(10, 37, 64, 0.0) 0%,
      rgba(10, 37, 64, 0.05) 40%,
      rgba(10, 37, 64, 0.55) 70%,
      rgba(10, 37, 64, 0.92) 100%);
  pointer-events: none;
}

.card--oferta__body {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 2;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--space-4);
  padding: var(--space-6);
}

.card--oferta__text {
  flex: 1 1 auto;
  min-width: 0;
}

.card--oferta__title {
  color: var(--color-paper);
  font-family: var(--font-display);
  font-weight: 700;
  font-size: clamp(1.375rem, 1.05rem + 1.2vw, 1.75rem);
  line-height: 1.15;
  letter-spacing: -0.01em;
  margin: 0;
  text-wrap: balance;
  transition: transform var(--dur-fast) var(--ease-out-quint);
}
.card--oferta:hover .card--oferta__title {
  transform: translateX(2px);
}

.card--oferta__excerpt {
  color: rgba(255, 255, 255, 0.85);
  font-size: 0.9375rem;
  line-height: 1.5;
  margin: 8px 0 0;
  max-width: 38ch;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.card--oferta__arrow {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.14);
  border: 1px solid rgba(255, 255, 255, 0.32);
  color: var(--color-paper);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  transition: background var(--dur-fast) var(--ease-out-quint),
              border-color var(--dur-fast) var(--ease-out-quint),
              transform var(--dur-fast) var(--ease-spring),
              color var(--dur-fast) var(--ease-out-quint);
}
.card--oferta__arrow svg {
  display: block;
  transition: transform var(--dur-fast) var(--ease-out-quint);
}
.card--oferta:hover .card--oferta__arrow {
  background: var(--color-warm);
  border-color: var(--color-warm);
  transform: scale(1.08);
}
.card--oferta:hover .card--oferta__arrow svg {
  transform: translateX(2px);
}

.card--oferta:focus-visible {
  outline: 3px solid var(--color-cool);
  outline-offset: 3px;
}

/* Wariant „wide" — ostatnia karta w siatce 3-kol w trzech rzędach (Nawadnianie itp.) */
.card--oferta.is-wide {
  aspect-ratio: 21/9;
  min-height: 220px;
}
.card--oferta.is-wide .card--oferta__title {
  font-size: clamp(1.5rem, 1.1rem + 1.5vw, 2rem);
}
.card--oferta.is-wide .card--oferta__excerpt {
  max-width: 60ch;
}

/* --- About: intro --- */

.about-intro__grid {
  display: grid;
  gap: var(--space-7);
  grid-template-columns: 1fr;
  align-items: start;
}
@media (min-width: 1100px) {
  .about-intro__grid {
    grid-template-columns: 5fr 7fr;
    gap: var(--space-9);
  }
}

.about-intro__title {
  font-size: clamp(1.75rem, 1.3rem + 2.2vw, 3rem);
  line-height: 1.05;
  letter-spacing: -0.02em;
  margin-top: var(--space-3);
  text-wrap: balance;
}

.about-intro__copy p {
  font-size: 1.0625rem;
  line-height: 1.7;
  color: var(--color-ink-soft);
}
.about-intro__copy p + p { margin-top: var(--space-4); }
.about-intro__copy strong { color: var(--color-ink); font-weight: 600; }

.about-intro__lede {
  font-size: 1.1875rem !important;
  color: var(--color-ink) !important;
  font-weight: 400;
  line-height: 1.55 !important;
}

/* --- About: stats row --- */

.about-stats {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--space-3);
  margin-top: var(--space-8);
  padding: 0;
  list-style: none;
}
@media (min-width: 860px) {
  .about-stats {
    grid-template-columns: repeat(4, 1fr);
    gap: var(--space-5);
  }
}

.stat {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: var(--space-5);
  background: var(--color-paper);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-lg);
  text-align: left;
  position: relative;
  overflow: hidden;
  transition: transform var(--dur-normal) var(--ease-out-quint),
              border-color var(--dur-normal) var(--ease-out-quint),
              box-shadow var(--dur-normal) var(--ease-out-quint);
}
.stat::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 4px;
  height: 100%;
  background: linear-gradient(180deg, var(--color-cool) 0%, var(--color-cool-deep) 100%);
  opacity: 0;
  transition: opacity var(--dur-fast) var(--ease-out-quint);
}
.stat:hover {
  transform: translateY(-3px);
  border-color: var(--color-cool);
  box-shadow: var(--shadow-2);
}
.stat:hover::before { opacity: 1; }

.stat__value {
  font-family: var(--font-display);
  font-weight: 800;
  font-size: clamp(2rem, 1.6rem + 1.8vw, 2.75rem);
  line-height: 1;
  letter-spacing: -0.03em;
  color: var(--color-ink);
  font-variant-numeric: tabular-nums;
}
.stat__label {
  font-size: 0.875rem;
  color: var(--color-mute);
  margin-top: 6px;
}

/* --- About: features grid --- */

.features-grid {
  display: grid;
  gap: var(--space-4);
  grid-template-columns: 1fr;
  margin-top: var(--space-7);
}
@media (min-width: 600px) { .features-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1100px) { .features-grid { grid-template-columns: repeat(3, 1fr); gap: var(--space-5); } }

.feature-card {
  display: flex;
  align-items: flex-start;
  gap: var(--space-4);
  padding: var(--space-5);
  background: var(--color-paper);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-lg);
  transition: transform var(--dur-normal) var(--ease-out-quint),
              box-shadow var(--dur-normal) var(--ease-out-quint),
              border-color var(--dur-normal) var(--ease-out-quint);
}
.feature-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow-2);
  border-color: var(--color-cool);
}

/* Wariant kompaktowy — tylko ikona + tytuł (bez opisu), wycentrowane pionowo */
.feature-card--compact {
  align-items: center;
}
.feature-card--compact .feature-card__title {
  margin: 0;
}

.feature-card__icon {
  flex: 0 0 auto;
  width: 48px;
  height: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-md);
  background: var(--color-cool-mist);
  color: var(--color-cool-deep);
  transition: background var(--dur-fast) var(--ease-out-quint),
              color var(--dur-fast) var(--ease-out-quint),
              transform var(--dur-fast) var(--ease-spring);
}
.feature-card__icon svg {
  display: block;
  width: 24px;
  height: 24px;
}
.feature-card:hover .feature-card__icon {
  background: var(--color-cool);
  color: var(--color-paper);
  transform: scale(1.06);
}

.feature-card__body { min-width: 0; }
.feature-card__title {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 1.0625rem;
  line-height: 1.25;
  color: var(--color-ink);
  margin: 0 0 6px;
}
.feature-card__desc {
  font-size: 0.9375rem;
  line-height: 1.55;
  color: var(--color-mute);
  margin: 0;
}

.about-features__cert {
  display: inline-flex;
  align-items: center;
  gap: var(--space-3);
  margin: var(--space-7) auto 0;
  padding: var(--space-3) var(--space-5);
  background: var(--color-paper);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-pill);
  color: var(--color-ink);
  font-size: 0.9375rem;
  font-weight: 500;
  box-shadow: var(--shadow-1);
}
.about-features .container { display: flex; flex-direction: column; align-items: center; }
.about-features .features-grid,
.about-features .section-header { width: 100%; }
.about-features__cert svg { color: var(--color-warm); }

/* --- About: brands --- */

.brands-grid {
  display: grid;
  gap: var(--space-3);
  grid-template-columns: repeat(2, 1fr);
  margin-top: var(--space-6);
}
@media (min-width: 600px) { .brands-grid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 860px) { .brands-grid { grid-template-columns: repeat(4, 1fr); } }
@media (min-width: 1100px) { .brands-grid { grid-template-columns: repeat(7, 1fr); } }

.brand-chip {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 80px;
  padding: var(--space-4) var(--space-3);
  background: var(--color-paper);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-md);
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 1.0625rem;
  letter-spacing: 0.02em;
  color: var(--color-ink);
  text-align: center;
  transition: transform var(--dur-fast) var(--ease-out-quint),
              border-color var(--dur-fast) var(--ease-out-quint),
              box-shadow var(--dur-fast) var(--ease-out-quint),
              color var(--dur-fast) var(--ease-out-quint),
              background var(--dur-fast) var(--ease-out-quint);
  cursor: default;
}
.brand-chip:hover {
  transform: translateY(-3px);
  border-color: var(--color-cool);
  background: var(--color-cool-mist);
  color: var(--color-cool-deep);
  box-shadow: var(--shadow-2);
}
.brand-chip__name {
  position: relative;
}
.brand-chip__name::before {
  content: '';
  position: absolute;
  bottom: -6px;
  left: 50%;
  transform: translateX(-50%) scaleX(0);
  width: 24px;
  height: 2px;
  background: var(--color-cool);
  transition: transform var(--dur-fast) var(--ease-out-quint);
}
.brand-chip:hover .brand-chip__name::before {
  transform: translateX(-50%) scaleX(1);
}

/* --- Karta aktualności --- */

.card--aktualnosc {
  display: grid;
  grid-template-columns: 80px 1fr;
  gap: var(--space-5);
  padding: var(--space-5);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-lg);
  background: var(--color-paper);
  transition: transform var(--dur-normal) var(--ease-out-quint),
              box-shadow var(--dur-normal) var(--ease-out-quint),
              border-color var(--dur-normal) var(--ease-out-quint);
}
.card--aktualnosc:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-2);
  border-color: var(--color-cool);
}
.card--aktualnosc .date {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: var(--color-cool-mist);
  border-radius: var(--radius-md);
  padding: var(--space-3);
  font-family: var(--font-display);
}
.card--aktualnosc .date__day { font-size: 1.75rem; font-weight: 700; color: var(--color-cool-deep); line-height: 1; }
.card--aktualnosc .date__month { font-size: 0.75rem; text-transform: uppercase; color: var(--color-mute); letter-spacing: 0.05em; }

/* --- Section header --- */

.section-header {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  margin-bottom: var(--space-7);
  text-align: center;
  align-items: center;
}
.section-header__eyebrow {
  font-family: var(--font-display);
  font-size: 0.875rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--color-cool-deep);
}
.section-header__title { max-width: 22ch; }
.section-header__lead { color: var(--color-mute); max-width: 60ch; }

/* --- Breadcrumbs --- */

.breadcrumbs {
  font-size: var(--fs-small);
  color: var(--color-mute);
  margin-bottom: var(--space-3);
}
.breadcrumbs a { color: var(--color-mute); transition: color var(--dur-fast) var(--ease-out-quint); }
.breadcrumbs a:hover { color: var(--color-ink); }
.breadcrumbs .sep { margin-inline: var(--space-2); opacity: 0.5; }

/* --- Page header (mały hero dla page'y stałych, max 400px) --- */

.page-header {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: var(--space-7) 0 var(--space-5);
  margin-bottom: var(--space-7);
  background-color: var(--color-ink);
  background-size: cover;
  background-position: center 40%;
  color: var(--color-paper);
  min-height: 220px;
  max-height: 400px;
  height: clamp(220px, 32vw, 400px);
  display: flex;
  align-items: flex-end;
}

/* Picture element jako tło — bardziej wydajne (responsive sources) */
.page-header__bg {
  position: absolute;
  inset: 0;
  z-index: -2;
  display: block;
  pointer-events: none;
}
.page-header__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 40%;
}

.page-header__overlay {
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(
    180deg,
    rgba(10, 37, 64, 0.45) 0%,
    rgba(10, 37, 64, 0.55) 50%,
    rgba(10, 37, 64, 0.85) 100%
  );
  pointer-events: none;
}

.page-header > .container,
.page-header > .container.page-header__inner {
  position: relative;
  z-index: 1;
}

.page-header h1 {
  color: var(--color-paper);
  text-shadow: 0 2px 16px rgba(0, 0, 0, 0.4);
  margin: 0;
  font-size: clamp(1.75rem, 1.4rem + 1.6vw, 2.75rem);
}

.page-header p {
  color: rgba(255, 255, 255, 0.85);
  margin-top: var(--space-2);
}

.page-header .breadcrumbs {
  color: rgba(255, 255, 255, 0.7);
  margin-bottom: var(--space-2);
}

.page-header .breadcrumbs a {
  color: rgba(255, 255, 255, 0.85);
  transition: color var(--dur-fast) var(--ease-out-quint);
}

.page-header .breadcrumbs a:hover {
  color: var(--color-cool);
}

.page-header .breadcrumbs .sep {
  color: rgba(255, 255, 255, 0.4);
}

.page-header .entry-content {
  color: rgba(255, 255, 255, 0.9);
}

.page-header__inner {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

/* --- Form (CF7 base) --- */

.wpcf7 { max-width: 720px; }
.wpcf7-form-control-wrap { display: block; position: relative; }
.wpcf7 label,
.wpcf7-form .field-label {
  display: block;
  font-family: var(--font-display);
  font-weight: 600;
  font-size: 0.875rem;
  margin-bottom: var(--space-2);
  color: var(--color-ink);
}

.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 textarea,
.wpcf7 select {
  width: 100%;
  background: var(--color-paper);
  border: 0;
  border-bottom: 2px solid var(--color-line);
  border-radius: 0;
  padding: var(--space-3) 0;
  font-size: 1rem;
  color: var(--color-ink);
  transition: border-color var(--dur-fast) var(--ease-out-quint);
}
.wpcf7 input:focus,
.wpcf7 textarea:focus,
.wpcf7 select:focus {
  outline: 0;
  border-bottom-color: var(--color-cool);
}
.wpcf7 textarea { min-height: 140px; resize: vertical; }

.wpcf7 .wpcf7-list-item { margin-left: 0; }
.wpcf7 input[type="checkbox"] { transform: scale(1.2); margin-right: var(--space-2); accent-color: var(--color-cool); }

.wpcf7 .wpcf7-submit {
  margin-top: var(--space-5);
  background: var(--color-warm);
  color: var(--color-paper);
  border: 0;
  border-radius: var(--radius-pill);
  padding: 0.875rem 2rem;
  font-weight: 600;
  cursor: pointer;
  transition: transform var(--dur-fast) var(--ease-out-quint),
              background var(--dur-fast) var(--ease-out-quint),
              box-shadow var(--dur-fast) var(--ease-out-quint);
  box-shadow: var(--shadow-2);
}
.wpcf7 .wpcf7-submit:hover { background: var(--color-warm-deep); transform: translateY(-2px); box-shadow: var(--shadow-3); }

.wpcf7-not-valid-tip {
  color: var(--color-warm-deep);
  font-size: 0.875rem;
  margin-top: var(--space-1);
}
.wpcf7-not-valid {
  border-bottom-color: var(--color-warm-deep) !important;
  animation: shake 220ms var(--ease-out-quint);
}
.wpcf7 form.sent .wpcf7-response-output {
  border: 0;
  background: var(--color-cool-mist);
  color: var(--color-cool-deep);
  border-radius: var(--radius-md);
  padding: var(--space-4);
  margin-top: var(--space-5);
  font-weight: 600;
}

/* Honeypot field */
.klimatron-honey { position: absolute; left: -10000px; opacity: 0; pointer-events: none; }

/* --- Partners marquee --- */

.partners-strip {
  overflow: hidden;
  padding: var(--space-6) 0;
  background: var(--color-cream);
  position: relative;
}
.partners-strip__track {
  display: flex;
  gap: var(--space-8);
  animation: marquee var(--dur-marquee) linear infinite;
  width: max-content;
}
.partners-strip:hover .partners-strip__track { animation-play-state: paused; }
.partners-strip__item {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  height: 60px;
  filter: grayscale(1) opacity(0.6);
  transition: filter 400ms var(--ease-out-quint);
}
.partners-strip:hover .partners-strip__item { filter: grayscale(0) opacity(1); }
.partners-strip__item img { height: 100%; width: auto; max-width: 200px; object-fit: contain; }

/* --- Hamburger --- */

.hamburger {
  width: 44px;
  height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 5px;
  cursor: pointer;
  background: transparent;
  border-radius: var(--radius-sm);
  transition: background var(--dur-fast) var(--ease-out-quint);
}
.hamburger:hover { background: var(--color-cream); }
.hamburger span {
  display: block;
  width: 22px;
  height: 2px;
  background: var(--color-ink);
  border-radius: 2px;
  transform-origin: center;
  transition: transform var(--dur-fast) var(--ease-out-quint),
              opacity var(--dur-fast) var(--ease-out-quint);
}
.hamburger.is-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.hamburger.is-open span:nth-child(2) { opacity: 0; }
.hamburger.is-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* --- Mobile drawer --- */

.mobile-drawer {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  width: min(88vw, 360px);
  background: linear-gradient(180deg, var(--color-ink) 0%, #061B2F 100%);
  color: var(--color-paper);
  padding: var(--space-5) var(--space-5) var(--space-7);
  z-index: 200;
  transform: translateX(100%);
  transition: transform var(--dur-normal) var(--ease-out-quint);
  overflow-y: auto;
  display: flex;
  flex-direction: column;
}
.mobile-drawer.is-open { transform: translateX(0); }

.mobile-drawer__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: var(--space-4);
  margin-bottom: var(--space-4);
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.mobile-drawer__brand {
  font-family: var(--font-display);
  font-weight: 800;
  font-size: 1.125rem;
  letter-spacing: 0.05em;
  color: var(--color-paper);
}

.mobile-drawer__close {
  width: 40px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 50%;
  color: var(--color-paper);
  cursor: pointer;
  transition: background var(--dur-fast) var(--ease-out-quint),
              transform var(--dur-fast) var(--ease-spring),
              border-color var(--dur-fast) var(--ease-out-quint);
}
.mobile-drawer__close:hover {
  background: var(--color-warm);
  border-color: var(--color-warm);
  transform: rotate(90deg);
}

.mobile-drawer ul {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  margin: 0;
  padding: 0;
  flex: 1;
}

.mobile-drawer a {
  display: block;
  padding: var(--space-3) 0;
  font-family: var(--font-display);
  font-size: 1.0625rem;
  color: var(--color-paper);
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  opacity: 0;
  transform: translateX(20px);
  animation: drawer-item-in 400ms var(--ease-out-quint) forwards;
  transition: color var(--dur-fast) var(--ease-out-quint),
              padding-left var(--dur-fast) var(--ease-out-quint);
}
.mobile-drawer a:hover,
.mobile-drawer .current-menu-item > a {
  color: var(--color-cool);
  padding-left: var(--space-2);
}
.mobile-drawer.is-open li:nth-child(1) a { animation-delay: 80ms; }
.mobile-drawer.is-open li:nth-child(2) a { animation-delay: 120ms; }
.mobile-drawer.is-open li:nth-child(3) a { animation-delay: 160ms; }
.mobile-drawer.is-open li:nth-child(4) a { animation-delay: 200ms; }
.mobile-drawer.is-open li:nth-child(5) a { animation-delay: 240ms; }
.mobile-drawer.is-open li:nth-child(6) a { animation-delay: 280ms; }
.mobile-drawer.is-open li:nth-child(7) a { animation-delay: 320ms; }
.mobile-drawer.is-open li:nth-child(8) a { animation-delay: 360ms; }

/* === Mobile drawer — submenu (rozwijane Oferty) === */

.mobile-drawer .menu-item-has-children {
  position: relative;
}

.mobile-drawer__submenu-toggle {
  position: absolute;
  top: 8px;
  right: 0;
  width: 36px;
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 50%;
  color: var(--color-paper);
  cursor: pointer;
  transition: background var(--dur-fast) var(--ease-out-quint),
              transform var(--dur-fast) var(--ease-out-quint);
  z-index: 2;
}

.mobile-drawer__submenu-toggle svg {
  transition: transform var(--dur-fast) var(--ease-out-quint);
}

.mobile-drawer__submenu-toggle:hover {
  background: rgba(6, 182, 212, 0.2);
}

.mobile-drawer .menu-item-has-children.is-open .mobile-drawer__submenu-toggle {
  background: var(--color-cool);
  border-color: var(--color-cool);
}

.mobile-drawer .menu-item-has-children.is-open .mobile-drawer__submenu-toggle svg {
  transform: rotate(180deg);
}

.mobile-drawer .sub-menu {
  list-style: none;
  margin: 0;
  padding: 0;
  max-height: 0;
  overflow: hidden;
  transition: max-height var(--dur-normal) var(--ease-out-quint);
}

.mobile-drawer .menu-item-has-children.is-open .sub-menu {
  max-height: 800px;
}

.mobile-drawer .sub-menu li a {
  display: flex !important;
  align-items: center;
  gap: var(--space-3);
  padding: 10px 0 10px var(--space-4) !important;
  font-size: 0.95rem !important;
  font-weight: 400 !important;
  color: rgba(255, 255, 255, 0.75) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
  /* Reset animation z parent — submenu items pojawiają się statycznie */
  opacity: 1 !important;
  transform: none !important;
  animation: none !important;
}

.mobile-drawer .sub-menu li a:hover,
.mobile-drawer .sub-menu .current-menu-item > a {
  color: var(--color-cool) !important;
  padding-left: var(--space-5) !important;
}

.mobile-drawer .sub-menu .mega-menu__icon {
  width: 28px;
  height: 28px;
  background: rgba(6, 182, 212, 0.15);
  color: var(--color-cool);
  border-radius: 6px;
}

@media (prefers-reduced-motion: reduce) {
  .mobile-drawer .sub-menu,
  .mobile-drawer__submenu-toggle svg { transition: none; }
}

/* CTA section w drawer */
.mobile-drawer__cta {
  margin-top: var(--space-5);
  padding-top: var(--space-5);
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.mobile-drawer .mobile-drawer__btn,
.mobile-drawer__cta .mobile-drawer__btn {
  display: inline-flex !important;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  width: 100%;
  padding: 14px 20px;
  font-size: 1rem;
  line-height: 1;
  white-space: nowrap;
  border-radius: var(--radius-pill);
  opacity: 1 !important;
  transform: none !important;
  animation: none !important;
  border-bottom: 0 !important;
}
.mobile-drawer__btn svg {
  flex: 0 0 auto;
  display: inline-block;
}

.mobile-drawer .mobile-drawer__phone,
.mobile-drawer__cta .mobile-drawer__phone {
  display: inline-flex !important;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  gap: var(--space-3);
  padding: 12px 18px !important;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.15) !important;
  border-radius: var(--radius-md);
  color: var(--color-paper) !important;
  text-decoration: none !important;
  line-height: 1;
  white-space: nowrap;
  transition: background var(--dur-fast) var(--ease-out-quint),
              border-color var(--dur-fast) var(--ease-out-quint),
              transform var(--dur-fast) var(--ease-out-quint);
  opacity: 1 !important;
  transform: none !important;
  animation: none !important;
  padding-left: 18px !important;
}
.mobile-drawer__phone:hover {
  background: rgba(6, 182, 212, 0.15) !important;
  border-color: rgba(6, 182, 212, 0.5) !important;
  transform: translateY(-2px) !important;
  padding-left: 18px !important;
  color: var(--color-paper) !important;
}
.mobile-drawer__phone svg {
  flex: 0 0 auto;
  color: var(--color-cool);
}
.mobile-drawer__phone-label {
  flex: 0 0 auto;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: rgba(255, 255, 255, 0.6);
  font-weight: 600;
}
.mobile-drawer__phone-number {
  margin-left: auto;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 1rem;
  color: var(--color-paper);
  letter-spacing: 0.02em;
}

.mobile-drawer__overlay {
  position: fixed;
  inset: 0;
  background: rgba(10,37,64,0.6);
  backdrop-filter: blur(4px);
  z-index: 150;
  opacity: 0;
  pointer-events: none;
  transition: opacity var(--dur-normal) var(--ease-out-quint);
}
.mobile-drawer__overlay.is-open { opacity: 1; pointer-events: auto; }

/* --- Kontakt: dane kontaktowe z ikonami --- */

.kontakt-data {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.kontakt-data__item {
  display: flex;
  align-items: flex-start;
  gap: var(--space-4);
  padding: var(--space-4);
  background: var(--color-paper);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-md);
  transition: border-color var(--dur-fast) var(--ease-out-quint),
              box-shadow var(--dur-fast) var(--ease-out-quint),
              transform var(--dur-fast) var(--ease-out-quint);
}

.kontakt-data__item:hover {
  border-color: var(--color-cool);
  box-shadow: var(--shadow-1);
  transform: translateY(-2px);
}

.kontakt-data__icon {
  flex: 0 0 auto;
  width: 44px;
  height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-md);
  background: var(--color-cool-mist);
  color: var(--color-cool-deep);
  transition: background var(--dur-fast) var(--ease-out-quint),
              color var(--dur-fast) var(--ease-out-quint),
              transform var(--dur-fast) var(--ease-spring);
}

.kontakt-data__item:hover .kontakt-data__icon {
  background: var(--color-cool);
  color: var(--color-paper);
  transform: scale(1.06) rotate(-4deg);
}

.kontakt-data__body {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.kontakt-data__label {
  font-family: var(--font-display);
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--color-mute);
}

.kontakt-data__value {
  color: var(--color-ink);
  font-size: 1rem;
  line-height: 1.5;
  text-decoration: none;
  word-break: break-word;
}

a.kontakt-data__value {
  transition: color var(--dur-fast) var(--ease-out-quint);
}
a.kontakt-data__value:hover {
  color: var(--color-cool-deep);
}

.kontakt-data__value--strong {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 1.25rem;
  letter-spacing: 0.01em;
}

/* === Cennik === */

.cennik-disclaimer {
  display: flex;
  align-items: flex-start;
  gap: var(--space-4);
  padding: var(--space-5);
  margin: var(--space-5) 0 var(--space-7);
  background: linear-gradient(135deg, #FFF7ED 0%, #FFEDD5 100%);
  border: 1px solid var(--color-warm);
  border-left: 4px solid var(--color-warm-deep);
  border-radius: var(--radius-md);
  color: var(--color-ink);
}

.cennik-disclaimer svg {
  flex: 0 0 auto;
  color: var(--color-warm-deep);
  margin-top: 2px;
}

.cennik-disclaimer > div {
  flex: 1;
  font-size: 0.9375rem;
  line-height: 1.55;
}

.cennik-disclaimer strong {
  color: var(--color-warm-deep);
  font-weight: 700;
}

.cennik-disclaimer em {
  color: var(--color-ink);
  font-style: normal;
  font-weight: 700;
  background: rgba(249, 115, 22, 0.18);
  padding: 0 4px;
  border-radius: 3px;
}

.cennik-disclaimer a {
  color: var(--color-warm-deep);
  font-weight: 600;
  text-decoration: underline;
}

/* --- Tabela cennika (desktop) --- */

.entry-content .cennik-table,
.entry-content table.cennik-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  margin: var(--space-4) 0 var(--space-7);
  background: var(--color-paper);
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-1);
  font-size: 0.9375rem;
}

.entry-content .cennik-table thead th {
  background: linear-gradient(135deg, var(--color-ink) 0%, var(--color-ink-soft) 100%);
  color: var(--color-paper);
  text-align: left;
  padding: var(--space-4) var(--space-5);
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 0.8125rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  border-bottom: 0;
}

.entry-content .cennik-table thead th:first-child {
  border-top-left-radius: var(--radius-lg);
}
.entry-content .cennik-table thead th:last-child {
  border-top-right-radius: var(--radius-lg);
  text-align: right;
}

.entry-content .cennik-table tbody tr {
  transition: background var(--dur-fast) var(--ease-out-quint);
}

.entry-content .cennik-table tbody tr:hover {
  background: var(--color-cool-mist);
}

.entry-content .cennik-table tbody td {
  padding: var(--space-4) var(--space-5);
  border-bottom: 1px solid var(--color-line);
  vertical-align: middle;
  color: var(--color-ink-soft);
  line-height: 1.45;
}

.entry-content .cennik-table tbody tr:last-child td {
  border-bottom: 0;
}

.entry-content .cennik-table tbody td:first-child {
  font-weight: 600;
  color: var(--color-ink);
  font-family: var(--font-display);
}

.entry-content .cennik-table tbody td:nth-child(2) {
  color: var(--color-mute);
  font-size: 0.875rem;
}

.entry-content .cennik-table tbody td:last-child {
  text-align: right;
  white-space: nowrap;
}

.entry-content .cennik-table tbody td:last-child strong {
  font-family: var(--font-display);
  font-size: 1rem;
  font-weight: 700;
  color: var(--color-cool-deep);
  letter-spacing: -0.01em;
}

/* --- Tabela cennika (mobile, < 768px) --- */

@media (max-width: 767px) {
  .entry-content .cennik-table {
    background: transparent;
    box-shadow: none;
    border-radius: 0;
  }

  .entry-content .cennik-table thead {
    display: none;
  }

  .entry-content .cennik-table tbody tr {
    display: block;
    margin-bottom: var(--space-3);
    padding: var(--space-4);
    background: var(--color-paper);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-1);
  }

  .entry-content .cennik-table tbody tr:hover {
    background: var(--color-paper);
    border-color: var(--color-cool);
  }

  .entry-content .cennik-table tbody td {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: var(--space-3);
    padding: 8px 0;
    border-bottom: 1px solid var(--color-line);
    text-align: right !important;
    font-size: 0.875rem;
  }

  .entry-content .cennik-table tbody td:last-child {
    border-bottom: 0;
    padding-top: var(--space-2);
  }

  .entry-content .cennik-table tbody td::before {
    content: attr(data-label);
    flex: 0 0 auto;
    font-family: var(--font-display);
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--color-mute);
    text-align: left;
  }

  .entry-content .cennik-table tbody td:first-child {
    font-size: 1rem;
    padding-bottom: var(--space-2);
  }
  .entry-content .cennik-table tbody td:first-child::before {
    display: none;
  }
  .entry-content .cennik-table tbody td:first-child {
    justify-content: flex-start;
    text-align: left !important;
  }

  .entry-content .cennik-table tbody td:last-child strong {
    font-size: 1.0625rem;
  }
}

/* --- CTA box w cenniku/referencjach --- */

.cennik-cta {
  margin: var(--space-7) 0 var(--space-3);
  padding: var(--space-6);
  background: linear-gradient(135deg, var(--color-ink) 0%, var(--color-ink-soft) 100%);
  border-radius: var(--radius-lg);
  text-align: center;
  color: var(--color-paper);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-3);
}

.cennik-cta h3 {
  color: var(--color-paper);
  margin: 0;
  font-size: clamp(1.25rem, 1.1rem + 0.6vw, 1.5rem);
  border: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}

.cennik-cta h3::before {
  display: none !important;
}

.cennik-cta p {
  color: rgba(255, 255, 255, 0.85);
  margin: 0 auto;
  max-width: 50ch;
  font-size: 1rem;
}

.cennik-cta .btn {
  margin-top: var(--space-2);
}

/* --- Archive oferta — streszczenie nad boxami --- */

.oferta-archive-intro {
  max-width: 880px;
  margin: 0 auto var(--space-7);
  text-align: center;
  padding: 0 var(--space-3);
}

.oferta-archive-intro .section-header__eyebrow {
  margin-bottom: var(--space-3);
  display: inline-block;
}

.oferta-archive-intro__text {
  font-size: clamp(1rem, 0.95rem + 0.4vw, 1.1875rem);
  line-height: 1.65;
  color: var(--color-ink-soft);
  margin: 0;
  max-width: none;
  text-wrap: pretty;
}

.oferta-archive-intro__text strong {
  color: var(--color-ink);
  font-weight: 600;
  background: linear-gradient(180deg, transparent 60%, rgba(6, 182, 212, 0.18) 60%);
  padding: 0 2px;
}

/* --- Sidebar (single-oferta) --- */

.oferta-sidebar {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}

/* --- Sidebar menu — lista 7 ofert z aktywną pozycją --- */

.oferta-menu {
  background: var(--color-paper);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-1);
  transition: box-shadow var(--dur-fast) var(--ease-out-quint);
}
.oferta-menu:hover {
  box-shadow: var(--shadow-2);
}

.oferta-menu__header {
  padding: var(--space-5) var(--space-5) var(--space-3);
  border-bottom: 1px solid var(--color-line);
  background:
    linear-gradient(135deg, var(--color-paper) 0%, var(--color-cream) 100%);
}

.oferta-menu__eyebrow {
  display: block;
  font-family: var(--font-display);
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--color-cool-deep);
  margin-bottom: 4px;
}

.oferta-menu__title {
  font-family: var(--font-display);
  font-size: 1.0625rem;
  font-weight: 700;
  color: var(--color-ink);
  margin: 0;
  line-height: 1.2;
  letter-spacing: -0.01em;
}

.oferta-menu__list {
  list-style: none;
  margin: 0;
  padding: var(--space-2) 0;
  display: flex;
  flex-direction: column;
}

.oferta-menu__item {
  position: relative;
}

/* Indicator po lewej — animowany od góry przy hover/active */
.oferta-menu__item::before {
  content: '';
  position: absolute;
  left: 0;
  top: 6px;
  bottom: 6px;
  width: 3px;
  background: linear-gradient(180deg, var(--color-cool) 0%, var(--color-cool-deep) 100%);
  border-radius: 0 2px 2px 0;
  transform: scaleY(0);
  transform-origin: center;
  opacity: 0;
  transition: transform var(--dur-normal) var(--ease-out-quint),
              opacity var(--dur-fast) var(--ease-out-quint);
}

.oferta-menu__item:hover::before,
.oferta-menu__item.is-active::before {
  transform: scaleY(1);
  opacity: 1;
}

.oferta-menu__link {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  padding: 12px var(--space-5);
  color: var(--color-ink-soft);
  font-family: var(--font-display);
  font-weight: 500;
  font-size: 0.9375rem;
  line-height: 1.3;
  text-decoration: none;
  transition: color var(--dur-fast) var(--ease-out-quint),
              background var(--dur-fast) var(--ease-out-quint),
              padding-left var(--dur-fast) var(--ease-out-quint);
}

.oferta-menu__link:hover {
  background: linear-gradient(90deg, var(--color-cool-mist) 0%, transparent 100%);
  color: var(--color-cool-deep);
  padding-left: calc(var(--space-5) + 8px);
}

.oferta-menu__item.is-active .oferta-menu__link {
  background: linear-gradient(90deg, var(--color-cool-mist) 0%, rgba(236, 254, 255, 0.3) 100%);
  color: var(--color-ink);
  font-weight: 700;
  padding-left: calc(var(--space-5) + 8px);
  cursor: default;
}

.oferta-menu__icon {
  width: 36px;
  height: 36px;
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  background: var(--color-cool-mist);
  color: var(--color-cool-deep);
  transition: background var(--dur-fast) var(--ease-out-quint),
              color var(--dur-fast) var(--ease-out-quint),
              transform var(--dur-fast) var(--ease-spring);
}

.oferta-menu__icon svg {
  width: 18px;
  height: 18px;
  display: block;
}

.oferta-menu__link:hover .oferta-menu__icon {
  background: var(--color-cool);
  color: var(--color-paper);
  transform: scale(1.08) rotate(-4deg);
}

.oferta-menu__item.is-active .oferta-menu__icon {
  background: linear-gradient(135deg, var(--color-cool) 0%, var(--color-cool-deep) 100%);
  color: var(--color-paper);
  box-shadow: 0 4px 12px rgba(6, 182, 212, 0.3);
}

.oferta-menu__label {
  flex: 1;
  min-width: 0;
}

.oferta-menu__arrow {
  font-size: 1.125rem;
  color: var(--color-cool);
  opacity: 0;
  transform: translateX(-8px);
  transition: opacity var(--dur-fast) var(--ease-out-quint),
              transform var(--dur-fast) var(--ease-out-quint);
}

.oferta-menu__link:hover .oferta-menu__arrow,
.oferta-menu__item.is-active .oferta-menu__arrow {
  opacity: 1;
  transform: translateX(0);
}

@media (prefers-reduced-motion: reduce) {
  .oferta-menu__item::before,
  .oferta-menu__icon,
  .oferta-menu__arrow,
  .oferta-menu__link {
    transition: none !important;
  }
}
.sidebar-box {
  padding: var(--space-5);
  border-radius: var(--radius-lg);
  background: var(--color-cream);
}
.sidebar-box--cta {
  background: var(--color-ink);
  color: var(--color-paper);
}
.sidebar-box--cta h3 { color: var(--color-paper); margin-bottom: var(--space-3); }
.sidebar-box--cta p { color: rgba(255,255,255,0.85); }
.sidebar-box--cta .btn { margin-top: var(--space-4); width: 100%; }

/* --- Sticky bottom CTA bar (mobile) --- */

.sticky-cta-bar {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  display: none;
  align-items: stretch;
  background: var(--color-paper);
  border-top: 1px solid var(--color-line);
  z-index: 90;
  padding: var(--space-2);
  gap: var(--space-2);
  box-shadow: 0 -4px 12px rgba(10,37,64,0.06);
}
.sticky-cta-bar .btn { flex: 1; padding: var(--space-3); }
@media (max-width: 859px) { .has-hero-kenburns .sticky-cta-bar { display: flex; } }

/* === GDPR / Cookie consent banner === */

.gdpr-banner {
  position: fixed;
  left: 16px;
  right: 16px;
  bottom: 16px;
  z-index: 999;
  max-width: 540px;
  background: linear-gradient(180deg, var(--color-paper) 0%, var(--color-cream) 100%);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-lg);
  box-shadow: 0 24px 60px rgba(10, 37, 64, 0.18);
  padding: var(--space-5);
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 280ms var(--ease-out-quint),
              transform 280ms var(--ease-out-quint);
  pointer-events: none;
}

.gdpr-banner.is-visible {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

@media (min-width: 600px) {
  .gdpr-banner {
    left: auto;
    right: 24px;
    bottom: 24px;
    max-width: 480px;
  }
}

.gdpr-banner__inner {
  display: grid;
  grid-template-columns: 40px 1fr;
  gap: var(--space-3) var(--space-4);
  align-items: start;
}

.gdpr-banner__icon {
  width: 40px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--color-cool-mist);
  color: var(--color-cool-deep);
  border-radius: var(--radius-md);
  flex: 0 0 auto;
}

.gdpr-banner__content {
  min-width: 0;
}

.gdpr-banner__title {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 1.0625rem;
  margin: 0 0 6px;
  color: var(--color-ink);
  line-height: 1.3;
}

.gdpr-banner__text {
  font-size: 0.875rem;
  line-height: 1.5;
  color: var(--color-ink-soft);
  margin: 0;
}

.gdpr-banner__text a {
  color: var(--color-cool-deep);
  text-decoration: underline;
  text-underline-offset: 2px;
}

.gdpr-banner__actions {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
  margin-top: var(--space-3);
  align-items: center;
}

.gdpr-banner__actions .btn {
  flex: 1 1 auto;
  min-width: 0;
}

.gdpr-banner__btn-ghost {
  color: var(--color-ink) !important;
  border-color: var(--color-line) !important;
}

.gdpr-banner__settings {
  background: none;
  border: 0;
  padding: 8px 12px;
  margin: 0;
  color: var(--color-mute);
  font-family: var(--font-display);
  font-weight: 500;
  font-size: 0.875rem;
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 2px;
  flex: 0 0 auto;
  transition: color var(--dur-fast) var(--ease-out-quint);
}
.gdpr-banner__settings:hover {
  color: var(--color-cool-deep);
}

/* Settings panel */
.gdpr-banner__panel {
  grid-column: 1 / -1;
  margin-top: var(--space-4);
  padding-top: var(--space-4);
  border-top: 1px solid var(--color-line);
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.gdpr-banner__panel h4 {
  font-family: var(--font-display);
  font-size: 0.875rem;
  font-weight: 700;
  margin: 0 0 var(--space-2);
  color: var(--color-ink);
}

.gdpr-toggle {
  display: flex;
  gap: var(--space-3);
  padding: var(--space-3);
  background: var(--color-paper);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-md);
  cursor: pointer;
  transition: border-color var(--dur-fast) var(--ease-out-quint);
}

.gdpr-toggle:hover { border-color: var(--color-cool); }

.gdpr-toggle input {
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  margin-top: 3px;
  accent-color: var(--color-cool);
}

.gdpr-toggle__body { flex: 1; min-width: 0; }
.gdpr-toggle__body strong {
  display: block;
  font-family: var(--font-display);
  font-size: 0.9375rem;
  color: var(--color-ink);
  margin-bottom: 2px;
}
.gdpr-toggle__body small {
  display: block;
  font-size: 0.8125rem;
  color: var(--color-mute);
  line-height: 1.4;
}

.gdpr-toggle input:disabled + .gdpr-toggle__body {
  opacity: 0.7;
}

@media (prefers-reduced-motion: reduce) {
  .gdpr-banner { transition: none; }
}

/* === Galeria — siatka 4-kol z kwadratowymi zdjęciami === */

.gallery-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--space-3);
  margin-top: var(--space-5);
}

@media (max-width: 1099px) {
  .gallery-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 599px) {
  .gallery-grid { grid-template-columns: repeat(2, 1fr); gap: var(--space-2); }
}

.gallery-item {
  position: relative;
  display: block;
  aspect-ratio: 1 / 1;
  width: 100%;
  background: var(--color-cream);
  border: 0;
  padding: 0;
  margin: 0;
  border-radius: var(--radius-md);
  overflow: hidden;
  cursor: zoom-in;
  isolation: isolate;
  transition: transform var(--dur-fast) var(--ease-out-quint),
              box-shadow var(--dur-fast) var(--ease-out-quint);
}

.gallery-item:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow-3);
}

.gallery-item:focus-visible {
  outline: 3px solid var(--color-cool);
  outline-offset: 3px;
}

.gallery-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 700ms var(--ease-out-quint);
}

.gallery-item:hover img {
  transform: scale(1.08);
}

.gallery-item__zoom {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(0.7);
  width: 56px;
  height: 56px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(10, 37, 64, 0.85);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border-radius: 50%;
  color: var(--color-paper);
  opacity: 0;
  pointer-events: none;
  transition: opacity var(--dur-fast) var(--ease-out-quint),
              transform var(--dur-fast) var(--ease-spring);
  z-index: 2;
}

.gallery-item:hover .gallery-item__zoom,
.gallery-item:focus-visible .gallery-item__zoom {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
}

@media (prefers-reduced-motion: reduce) {
  .gallery-item img,
  .gallery-item__zoom { transition: none; }
}

/* === Lightbox === */

.lightbox {
  position: fixed;
  inset: 0;
  z-index: 1000;
  background: rgba(10, 37, 64, 0.96);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  display: none;
  align-items: center;
  justify-content: center;
  padding: clamp(60px, 8vw, 80px) clamp(60px, 6vw, 80px);
  animation: lightbox-fade-in 240ms var(--ease-out-quint);
}

.lightbox.is-open {
  display: flex;
}

@keyframes lightbox-fade-in {
  from { opacity: 0; }
  to   { opacity: 1; }
}

.lightbox__figure {
  margin: 0;
  max-width: 100%;
  max-height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.lightbox__img {
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  border-radius: var(--radius-md);
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.6);
  animation: lightbox-zoom-in 280ms var(--ease-out-quint);
}

@keyframes lightbox-zoom-in {
  from { opacity: 0; transform: scale(0.94); }
  to   { opacity: 1; transform: scale(1); }
}

@media (prefers-reduced-motion: reduce) {
  .lightbox,
  .lightbox__img { animation: none; }
}

.lightbox__close {
  position: absolute;
  top: 16px;
  right: 16px;
  width: 48px;
  height: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.25);
  border-radius: 50%;
  color: var(--color-paper);
  cursor: pointer;
  transition: background var(--dur-fast) var(--ease-out-quint),
              transform var(--dur-fast) var(--ease-out-quint),
              border-color var(--dur-fast) var(--ease-out-quint);
}

.lightbox__close:hover {
  background: var(--color-warm);
  border-color: var(--color-warm);
  transform: rotate(90deg);
}

.lightbox__nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 56px;
  height: 56px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 50%;
  color: var(--color-paper);
  cursor: pointer;
  transition: background var(--dur-fast) var(--ease-out-quint),
              transform var(--dur-fast) var(--ease-spring),
              border-color var(--dur-fast) var(--ease-out-quint);
}

.lightbox__nav--prev { left: 16px; }
.lightbox__nav--next { right: 16px; }

.lightbox__nav:hover {
  background: var(--color-cool);
  border-color: var(--color-cool);
  transform: translateY(-50%) scale(1.08);
}

.lightbox__counter {
  position: absolute;
  bottom: 24px;
  left: 50%;
  transform: translateX(-50%);
  padding: 6px 16px;
  background: rgba(0, 0, 0, 0.4);
  border-radius: 999px;
  color: rgba(255, 255, 255, 0.85);
  font-family: var(--font-display);
  font-size: 0.875rem;
  font-weight: 500;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.05em;
}

@media (max-width: 599px) {
  .lightbox { padding: 60px 12px; }
  .lightbox__nav {
    width: 44px;
    height: 44px;
  }
  .lightbox__nav--prev { left: 8px; }
  .lightbox__nav--next { right: 8px; }
}

/* --- Cool list / CTA section (legacy box variant) --- */

.cta-section {
  background: linear-gradient(135deg, var(--color-ink) 0%, var(--color-ink-soft) 100%);
  color: var(--color-paper);
  border-radius: var(--radius-lg);
  padding: var(--space-7);
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  align-items: center;
}
.cta-section h2 { color: var(--color-paper); }
.cta-section p { color: rgba(255,255,255,0.85); margin: 0 auto; }
.cta-section .btn { margin-top: var(--space-2); }

/* --- CTA banner full-width z parallax background --- */

.cta-banner {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  color: var(--color-paper);
  padding-block: clamp(80px, 12vw, 160px);
  background: var(--color-ink);
}

.cta-banner__bg {
  position: absolute;
  inset: -10% 0 -10%;
  z-index: -2;
  display: block;
  pointer-events: none;
  will-change: transform;
}
.cta-banner__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.cta-banner__overlay {
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    radial-gradient(ellipse 80% 60% at center, rgba(10, 37, 64, 0.22) 0%, rgba(10, 37, 64, 0.42) 100%),
    linear-gradient(180deg, rgba(10, 37, 64, 0.25) 0%, rgba(10, 37, 64, 0.35) 100%);
  pointer-events: none;
}

.cta-banner__content {
  position: relative;
  z-index: 1;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-5);
}

.cta-banner__title {
  color: var(--color-paper);
  font-size: clamp(1.75rem, 1.3rem + 2.4vw, 3rem);
  line-height: 1.1;
  letter-spacing: -0.02em;
  max-width: 22ch;
  margin: 0;
  text-wrap: balance;
  text-shadow: 0 2px 24px rgba(0, 0, 0, 0.45);
}

.cta-banner__lead {
  color: rgba(255, 255, 255, 0.92);
  font-size: clamp(1rem, 0.95rem + 0.3vw, 1.125rem);
  line-height: 1.6;
  max-width: 56ch;
  margin: 0;
  text-shadow: 0 1px 12px rgba(0, 0, 0, 0.4);
}

.cta-banner__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  justify-content: center;
  margin-top: var(--space-2);
}

.cta-banner .cta-banner__ghost {
  color: var(--color-paper);
  border-color: rgba(255, 255, 255, 0.5);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
.cta-banner .cta-banner__ghost:hover {
  color: var(--color-ink);
  border-color: var(--color-cool);
}

@media (prefers-reduced-motion: reduce) {
  .cta-banner__bg { transform: none !important; }
}

/* --- Pagination --- */

.pagination {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
  justify-content: center;
  margin-top: var(--space-7);
}
.pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  height: 40px;
  border-radius: var(--radius-md);
  border: 1px solid var(--color-line);
  background: var(--color-paper);
  font-weight: 600;
  font-family: var(--font-display);
  transition: background var(--dur-fast), color var(--dur-fast), border-color var(--dur-fast);
}
.pagination .page-numbers:hover { border-color: var(--color-cool); color: var(--color-cool-deep); }
.pagination .page-numbers.current {
  background: var(--color-ink);
  color: var(--color-paper);
  border-color: var(--color-ink);
}

/* --- Skeleton loading --- */

.skeleton {
  background: linear-gradient(90deg, var(--color-cream) 0%, #ECF0F5 50%, var(--color-cream) 100%);
  background-size: 200% 100%;
  animation: shimmer 1500ms infinite linear;
  border-radius: var(--radius-md);
}

/* --- 404 page --- */

.error-page {
  min-height: 70vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  gap: var(--space-5);
  padding-block: var(--space-9);
  position: relative;
}
.error-page__title { max-width: 18ch; }
.error-page__lead { max-width: 50ch; }
.error-page__suggestions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  margin-top: var(--space-5);
  justify-content: center;
}

/* === _hero.css === */
/* === Hero === */

.hero {
  position: relative;
  width: 100%;
  overflow: hidden;
  isolation: isolate;
  background: var(--color-ink);
  color: var(--color-paper);
}

.hero__image,
.hero picture {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.hero__image img,
.hero picture img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.hero__overlay {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 1;
}

.hero[data-brightness="light"] .hero__overlay { background: var(--hero-overlay-light); }
.hero[data-brightness="medium"] .hero__overlay { background: var(--hero-overlay-medium); }
.hero[data-brightness="dark"] .hero__overlay { background: var(--hero-overlay-dark); }

.hero__content {
  position: relative;
  z-index: 2;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding-block: var(--space-7);
  padding-top: 30vh;
  gap: var(--space-4);
}

.hero__eyebrow {
  font-family: var(--font-display);
  font-size: 0.875rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--color-cool-mist);
  opacity: 0.9;
}

.hero__title {
  color: var(--color-paper);
  max-width: 22ch;
  text-wrap: balance;
}

.hero__lead {
  color: rgba(255,255,255,0.92);
  font-size: 1.125rem;
  max-width: 56ch;
}

.hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  margin-top: var(--space-3);
}

/* --- Hero entry animation (title wjeżdża z dołu) --- */

.hero__title,
.hero__lead,
.hero__actions {
  opacity: 0;
  transform: translateY(40px);
  animation: hero-fade-in 700ms var(--ease-out-quint) forwards;
}
.hero__title  { animation-delay: 200ms; }
.hero__lead   { animation-delay: 350ms; }
.hero__actions { animation-delay: 500ms; }

/* --- Single-oferta hero with Ken Burns --- */

.hero--oferta {
  height: clamp(380px, 50vh, 580px);
}

@media (min-width: 600px) {
  .hero--oferta { height: clamp(480px, 55vh, 640px); }
}
@media (min-width: 1100px) {
  .hero--oferta { height: clamp(580px, 65vh, 720px); }
}

.hero__image--kenburns img {
  animation: kenburns var(--dur-kenburns) var(--ease-in-out-circ) infinite alternate;
  will-change: transform;
}

/* --- Home slider hero (Swiper container) --- */

.hero--home {
  height: 100vh;
  min-height: 600px;
  max-height: 900px;
}
.hero--home .swiper {
  width: 100%;
  height: 100%;
}
.hero--home .swiper-slide {
  position: relative;
  display: flex;
  align-items: stretch;
}
.hero--home .swiper-slide picture {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.hero--home .swiper-slide picture img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.hero--home .swiper-slide-active picture img {
  animation: kenburns var(--dur-slider) linear forwards;
}
.hero--home .hero__overlay { z-index: 1; }
.hero--home .hero__content { z-index: 2; padding-bottom: var(--space-9); padding-top: 35vh; }

/* --- Slider pagination dots --- */

.hero--home .swiper-pagination {
  bottom: var(--space-5) !important;
  display: flex;
  justify-content: center;
  gap: var(--space-2);
}
.hero--home .swiper-pagination-bullet {
  width: 24px;
  height: 3px;
  border-radius: 0;
  background: rgba(255,255,255,0.4);
  opacity: 1;
  transition: background var(--dur-fast) var(--ease-out-quint);
  position: relative;
  overflow: hidden;
}
.hero--home .swiper-pagination-bullet-active {
  background: rgba(255,255,255,0.4);
}
.hero--home .swiper-pagination-bullet-active::before {
  content: '';
  position: absolute;
  inset: 0;
  background: var(--color-cool);
  transform: scaleX(0);
  transform-origin: left;
  animation: progress-bar var(--dur-slider) linear forwards;
}

/* --- Slider arrows --- */

.hero--home .swiper-button-prev,
.hero--home .swiper-button-next {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: rgba(10, 37, 64, 0.35);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  border: 1px solid rgba(255,255,255,0.5);
  color: var(--color-paper);
  z-index: 20;
  cursor: pointer;
  transition: background var(--dur-fast) var(--ease-out-quint),
              transform var(--dur-fast) var(--ease-spring),
              border-color var(--dur-fast) var(--ease-out-quint);
}

.hero--home .swiper-pagination {
  z-index: 20;
}
.hero--home .swiper-button-prev:hover,
.hero--home .swiper-button-next:hover {
  background: var(--color-cool);
  border-color: var(--color-cool);
  transform: scale(1.08);
}
.hero--home .swiper-button-prev::after,
.hero--home .swiper-button-next::after {
  font-size: 1.25rem;
  font-weight: 700;
}

@media (max-width: 859px) {
  .hero--home .swiper-button-prev,
  .hero--home .swiper-button-next { display: none; }
}

/* --- Reduced motion overrides --- */

@media (prefers-reduced-motion: reduce) {
  .hero__title,
  .hero__lead,
  .hero__actions {
    opacity: 1;
    transform: none;
    animation: none;
  }
  .hero__image--kenburns img,
  .hero--home .swiper-slide-active picture img,
  .hero--home .swiper-pagination-bullet-active::before {
    animation: none !important;
  }
}

/* === _animations.css === */
/* === Keyframes & scroll-reveal === */

@keyframes hero-fade-in {
  from { opacity: 0; transform: translateY(40px); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes kenburns {
  from { transform: scale(1.0); }
  to   { transform: scale(1.06); }
}

@keyframes marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

@keyframes shimmer {
  from { background-position: 200% 0; }
  to   { background-position: -200% 0; }
}

@keyframes shake {
  0%   { transform: translateX(0); }
  25%  { transform: translateX(-4px); }
  50%  { transform: translateX(4px); }
  75%  { transform: translateX(-2px); }
  100% { transform: translateX(0); }
}

@keyframes progress-bar {
  from { transform: scaleX(0); }
  to   { transform: scaleX(1); }
}

@keyframes drawer-item-in {
  from { opacity: 0; transform: translateX(20px); }
  to   { opacity: 1; transform: translateX(0); }
}

/* --- Scroll-reveal classes (active by IntersectionObserver in JS) --- */

.reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 700ms var(--ease-out-quint),
              transform 700ms var(--ease-out-quint);
  will-change: opacity, transform;
}
.reveal.is-visible { opacity: 1; transform: translateY(0); }

.reveal--paragraph { transition-duration: 500ms; transition-delay: 100ms; }
.reveal--image {
  transform: translateY(0) scale(0.96);
  transition: opacity 800ms var(--ease-out-quint),
              transform 800ms var(--ease-out-quint);
}
.reveal--image.is-visible { transform: translateY(0) scale(1); }

/* Stagger w siatkach */
.reveal-grid > * {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 600ms var(--ease-out-quint),
              transform 600ms var(--ease-out-quint);
}
.reveal-grid.is-visible > * { opacity: 1; transform: translateY(0); }
.reveal-grid.is-visible > *:nth-child(1) { transition-delay: 0ms; }
.reveal-grid.is-visible > *:nth-child(2) { transition-delay: 80ms; }
.reveal-grid.is-visible > *:nth-child(3) { transition-delay: 160ms; }
.reveal-grid.is-visible > *:nth-child(4) { transition-delay: 240ms; }
.reveal-grid.is-visible > *:nth-child(5) { transition-delay: 320ms; }
.reveal-grid.is-visible > *:nth-child(6) { transition-delay: 400ms; }
.reveal-grid.is-visible > *:nth-child(7) { transition-delay: 480ms; }

/* Tekstowy underline animation */
.text-link {
  display: inline-block;
  position: relative;
}
.text-link::after {
  content: '';
  position: absolute;
  bottom: -2px;
  left: 0;
  height: 1.5px;
  width: 100%;
  background: var(--color-cool);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform var(--dur-fast) var(--ease-out-quint);
}
.text-link:hover::after { transform: scaleX(1); }

@media (prefers-reduced-motion: reduce) {
  .reveal,
  .reveal--paragraph,
  .reveal--image,
  .reveal-grid > * {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}

/* === _responsive.css === */
/* === Responsive (mobile-first, breakpointy: 600/860/1100/1440) === */

/* --- Primary nav widoczność --- */
.primary-nav { display: none; }
.hamburger   { display: inline-flex; }

@media (min-width: 1100px) {
  .primary-nav { display: flex; align-items: center; gap: var(--space-4); }
  .hamburger   { display: none; }
}

.primary-nav ul {
  display: flex;
  align-items: center;
  gap: var(--space-2);
}
.primary-nav a {
  display: inline-block;
  padding: var(--space-3) var(--space-3);
  font-family: var(--font-display);
  font-weight: 600;
  font-size: 0.95rem;
  color: var(--color-ink);
  position: relative;
  transition: color var(--dur-fast) var(--ease-out-quint);
}
.primary-nav a:hover {
  color: var(--color-cool-deep);
}
.primary-nav > ul > li > a::after,
.primary-nav .menu > li > a::after {
  content: '';
  position: absolute;
  left: var(--space-3);
  right: var(--space-3);
  bottom: 8px;
  height: 2px;
  background: var(--color-cool);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 200ms var(--ease-out-quint);
}
.primary-nav > ul > li > a:hover::after,
.primary-nav .menu > li > a:hover::after,
.primary-nav .current-menu-item > a::after,
.primary-nav .current-menu-parent > a::after {
  transform: scaleX(1);
}

/* === Mega-menu (desktop) === */

.primary-nav .menu-item-has-children {
  position: relative;
}

.primary-nav .menu-item-has-children > a {
  padding-right: calc(var(--space-3) + 18px);
  position: relative;
}

.primary-nav .menu-item-has-children > a::before {
  content: '';
  position: absolute;
  right: var(--space-3);
  top: 50%;
  width: 7px;
  height: 7px;
  margin-top: -5px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg);
  transform-origin: 70% 70%;
  transition: transform var(--dur-fast) var(--ease-out-quint);
  pointer-events: none;
}
.primary-nav .menu-item-has-children:hover > a::before,
.primary-nav .menu-item-has-children:focus-within > a::before {
  transform: rotate(-135deg);
  margin-top: -2px;
}

.primary-nav .sub-menu {
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%) translateY(8px);
  min-width: 600px;
  max-width: 90vw;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 4px;
  padding: var(--space-3);
  margin: 0;
  list-style: none;
  background: var(--color-paper);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-3);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity var(--dur-fast) var(--ease-out-quint),
              transform var(--dur-fast) var(--ease-out-quint),
              visibility var(--dur-fast);
  z-index: 200;
}

.primary-nav .menu-item-has-children:hover > .sub-menu,
.primary-nav .menu-item-has-children:focus-within > .sub-menu {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateX(-50%) translateY(4px);
}

/* Górny "ząb" wskazujący parent */
.primary-nav .sub-menu::before {
  content: '';
  position: absolute;
  top: -8px;
  left: 50%;
  transform: translateX(-50%) rotate(45deg);
  width: 14px;
  height: 14px;
  background: var(--color-paper);
  border-top: 1px solid var(--color-line);
  border-left: 1px solid var(--color-line);
}

.primary-nav .sub-menu li {
  margin: 0;
}

.primary-nav .sub-menu a {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-3);
  border-radius: var(--radius-md);
  font-family: var(--font-display);
  font-weight: 500;
  font-size: 0.95rem;
  color: var(--color-ink);
  transition: background var(--dur-fast) var(--ease-out-quint),
              color var(--dur-fast) var(--ease-out-quint),
              padding-left var(--dur-fast) var(--ease-out-quint);
}

.primary-nav .sub-menu a::after {
  display: none;
}
.primary-nav .sub-menu a::before {
  display: none;
}

.primary-nav .sub-menu a:hover {
  background: var(--color-cool-mist);
  color: var(--color-cool-deep);
}

.primary-nav .sub-menu .current-menu-item > a {
  background: var(--color-cool-mist);
  color: var(--color-cool-deep);
  font-weight: 700;
}

.mega-menu__icon {
  flex: 0 0 auto;
  width: 32px;
  height: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  background: var(--color-cool-mist);
  color: var(--color-cool-deep);
  transition: background var(--dur-fast) var(--ease-out-quint),
              color var(--dur-fast) var(--ease-out-quint),
              transform var(--dur-fast) var(--ease-spring);
}

.primary-nav .sub-menu a:hover .mega-menu__icon,
.primary-nav .sub-menu .current-menu-item > a .mega-menu__icon {
  background: var(--color-cool);
  color: var(--color-paper);
  transform: scale(1.06);
}

@media (prefers-reduced-motion: reduce) {
  .primary-nav .sub-menu,
  .mega-menu__icon { transition: none; }
}

/* --- Grids: oferta archive (7 kart) ---
 * Mobile: 1 kol — wszystkie 1×1.
 * Tablet (600+): 2 kol — 1-sza karta full-width (Klimatyzacja jako feature).
 * Desktop (1100+): 3 kol — 1-sza karta full-width (cinemascope) + 6 kart w 2×3.
 */

.grid-oferta {
  display: grid;
  gap: var(--space-5);
  grid-template-columns: 1fr;
}

@media (min-width: 600px) {
  .grid-oferta {
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-5);
  }
  .grid-oferta > :nth-child(1) {
    grid-column: 1 / -1;
  }
  .grid-oferta > :nth-child(1).card--oferta {
    aspect-ratio: 16/9;
  }
}

@media (min-width: 1100px) {
  .grid-oferta {
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-6);
  }
  .grid-oferta > :nth-child(1) {
    grid-column: 1 / -1;
  }
  .grid-oferta > :nth-child(1).card--oferta {
    aspect-ratio: 24/7;
    min-height: 280px;
  }
}

/* Wariant cross-link na single-oferta — 4 równe karty bez wide */
.grid-oferta--cross > :nth-child(1) {
  grid-column: auto !important;
}
.grid-oferta--cross > :nth-child(1).card--oferta {
  aspect-ratio: 4/3 !important;
  min-height: 280px;
}

@media (min-width: 600px) {
  .grid-oferta--cross {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1100px) {
  .grid-oferta--cross {
    grid-template-columns: repeat(4, 1fr) !important;
    gap: var(--space-5);
  }
}

/* --- Grids: aktualnosc archive --- */

.grid-aktualnosc {
  display: grid;
  gap: var(--space-4);
  grid-template-columns: 1fr;
}
@media (min-width: 860px) {
  .grid-aktualnosc { grid-template-columns: repeat(2, 1fr); }
}

/* --- Grid: home services --- */

.grid-home-services {
  display: grid;
  gap: var(--space-5);
  grid-template-columns: 1fr;
}
@media (min-width: 600px) { .grid-home-services { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1100px) {
  .grid-home-services {
    grid-template-columns: repeat(3, 1fr);
    grid-auto-rows: minmax(360px, auto);
  }
  .grid-home-services > :nth-child(1) {
    grid-row: span 2;
  }
}

/* --- Single-oferta layout ---
 * Mobile: 1 kolumna, treść najpierw, sidebar pod treścią.
 * Desktop (1100+): 2 kolumny — sidebar lewa (4fr), treść prawa (8fr).
 */

.layout-oferta {
  display: grid;
  gap: var(--space-7);
  grid-template-columns: 1fr;
}
.layout-oferta > .oferta-sidebar { order: 2; }
.layout-oferta > article         { order: 1; }

@media (min-width: 1100px) {
  .layout-oferta {
    grid-template-columns: 4fr 8fr;
  }
  .layout-oferta > .oferta-sidebar { order: 0; }
  .layout-oferta > article         { order: 0; }
}

/* --- About grid --- */
.about-grid {
  display: grid;
  gap: var(--space-6);
  grid-template-columns: 1fr;
  align-items: center;
}
@media (min-width: 860px) {
  .about-grid { grid-template-columns: 1fr 1fr; }
}
@media (min-width: 1100px) {
  .about-grid { grid-template-columns: 5fr 7fr; }
}

/* --- Galeria masonry --- */
.gallery-masonry {
  column-count: 1;
  column-gap: var(--space-4);
}
.gallery-masonry > * {
  break-inside: avoid;
  margin-bottom: var(--space-4);
}
@media (min-width: 600px) { .gallery-masonry { column-count: 2; } }
@media (min-width: 1100px) { .gallery-masonry { column-count: 3; } }

/* --- Mapa kontakt --- */
.contact-map {
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-2);
  aspect-ratio: 4/3;
  background: var(--color-cream);
}
.contact-map iframe { width: 100%; height: 100%; border: 0; }
@media (min-width: 860px) { .contact-map { aspect-ratio: 16/9; } }

/* --- Contact two-column --- */

.contact-grid {
  display: grid;
  gap: var(--space-7);
  grid-template-columns: 1fr;
}
@media (min-width: 1100px) {
  .contact-grid { grid-template-columns: 5fr 7fr; }
}

/* --- Page header sm --- */
.page-header__inner { display: flex; flex-direction: column; gap: var(--space-2); }
@media (min-width: 600px) { .page-header { padding: var(--space-9) 0 var(--space-6); } }

/* Kontener — header padding na mobile */
@media (max-width: 599px) {
  .site-header { height: var(--header-h-mobile); }
}

/* === _wycena.css === */
/* === Wycena wizard — full styling === */

.wycena-pageheader { padding-block: var(--space-7); }

.wycena {
  max-width: 880px;
  margin: 0 auto;
  position: relative;
}

/* --- Progress bar --- */

.wycena-progress {
  position: relative;
  margin-bottom: var(--space-8);
}

.wycena-progress__steps {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  list-style: none;
  margin: 0;
  padding: 0;
  position: relative;
  z-index: 2;
}

.wycena-progress__step {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-2);
  text-align: center;
}

.wycena-progress__dot {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--color-paper);
  border: 2px solid var(--color-line);
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 0.95rem;
  color: var(--color-mute);
  transition: background var(--dur-fast) var(--ease-out-quint),
              border-color var(--dur-fast) var(--ease-out-quint),
              color var(--dur-fast) var(--ease-out-quint),
              transform var(--dur-fast) var(--ease-spring);
}

.wycena-progress__step.is-done .wycena-progress__dot {
  background: var(--color-cool);
  border-color: var(--color-cool);
  color: var(--color-paper);
}
.wycena-progress__step.is-done .wycena-progress__dot::after {
  content: '✓';
  font-size: 1rem;
}
.wycena-progress__step.is-done .wycena-progress__dot {
  font-size: 0;
}

.wycena-progress__step.is-active .wycena-progress__dot {
  border-color: var(--color-cool);
  color: var(--color-cool-deep);
  transform: scale(1.1);
  box-shadow: 0 0 0 4px rgba(6, 182, 212, 0.15);
}

.wycena-progress__label {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: 0.8125rem;
  color: var(--color-mute);
  letter-spacing: 0.02em;
}
.wycena-progress__step.is-active .wycena-progress__label,
.wycena-progress__step.is-done .wycena-progress__label {
  color: var(--color-ink);
}

.wycena-progress__line {
  position: absolute;
  top: 17px;
  left: 12.5%;
  right: 12.5%;
  height: 2px;
  background: var(--color-line);
  z-index: 1;
  border-radius: 1px;
  overflow: hidden;
}
.wycena-progress__fill {
  height: 100%;
  width: 0%;
  background: linear-gradient(90deg, var(--color-cool) 0%, var(--color-cool-deep) 100%);
  transition: width var(--dur-slow) var(--ease-out-quint);
}

@media (max-width: 599px) {
  .wycena-progress__label { font-size: 0.6875rem; }
}

/* --- Restore draft --- */

.wycena-restore {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  padding: var(--space-3) var(--space-4);
  background: var(--color-cool-mist);
  border: 1px solid var(--color-cool);
  border-radius: var(--radius-md);
  margin-bottom: var(--space-5);
}
.wycena-restore p {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  margin: 0;
  color: var(--color-cool-deep);
  font-weight: 500;
}
.wycena-restore p svg { color: var(--color-cool); }
.wycena-restore__actions { display: flex; gap: var(--space-2); flex-wrap: wrap; }

/* --- Step container + animation --- */

.wycena-step { display: none; }
.wycena-step.is-active {
  display: block;
  animation: wycena-fade-in 340ms var(--ease-out-quint);
}

@keyframes wycena-fade-in {
  from { opacity: 0; transform: translateX(20px); }
  to   { opacity: 1; transform: translateX(0); }
}

@media (prefers-reduced-motion: reduce) {
  .wycena-step.is-active { animation: none; }
}

.wycena-step__header {
  margin-bottom: var(--space-6);
  text-align: center;
}
.wycena-step__title {
  font-size: clamp(1.5rem, 1.2rem + 1.4vw, 2.25rem);
  margin: 0 0 var(--space-2);
}
.wycena-step__lead {
  color: var(--color-mute);
  margin: 0 auto;
  max-width: 56ch;
}

.wycena-step__actions {
  display: flex;
  justify-content: space-between;
  gap: var(--space-3);
  margin-top: var(--space-7);
  padding-top: var(--space-5);
  border-top: 1px solid var(--color-line);
  flex-wrap: wrap;
  position: relative;
}
.wycena-step__actions > * { flex: 0 1 auto; }

/* Hint nad przyciskiem „Dalej" — pojawia się po wyborze usługi */
.wycena-step__actions.is-ready::before {
  content: '↓ Świetnie! Kliknij Dalej';
  position: absolute;
  top: -12px;
  right: 0;
  padding: 4px 12px;
  background: var(--color-cool);
  color: var(--color-paper);
  border-radius: var(--radius-pill);
  font-family: var(--font-display);
  font-weight: 600;
  font-size: 0.75rem;
  letter-spacing: 0.02em;
  white-space: nowrap;
  animation: wycena-hint-bounce 1.6s ease-out 2;
  pointer-events: none;
}

@keyframes wycena-hint-bounce {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-4px); }
}

/* Pulsujący button po selekcji */
[data-next-step].is-pulse:not(:disabled) {
  animation: wycena-cta-pulse 1.5s var(--ease-out-quint) 2;
}

@keyframes wycena-cta-pulse {
  0%   { transform: translateY(0);    box-shadow: 0 0 0 0 rgba(249, 115, 22, 0.6); }
  50%  { transform: translateY(-3px); box-shadow: 0 0 0 14px rgba(249, 115, 22, 0); }
  100% { transform: translateY(0);    box-shadow: 0 0 0 0 rgba(249, 115, 22, 0); }
}

@media (prefers-reduced-motion: reduce) {
  .wycena-step__actions.is-ready::before,
  [data-next-step].is-pulse:not(:disabled) {
    animation: none;
  }
}

/* --- Step 1: tile cards --- */

.wycena-tiles {
  display: grid;
  gap: var(--space-3);
  grid-template-columns: 1fr;
}
@media (min-width: 600px) { .wycena-tiles { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1100px) { .wycena-tiles { grid-template-columns: repeat(3, 1fr); } }

.wycena-tile {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-3);
  padding: var(--space-5);
  background: var(--color-paper);
  border: 2px solid var(--color-line);
  border-radius: var(--radius-lg);
  text-align: left;
  cursor: pointer;
  transition: transform var(--dur-fast) var(--ease-out-quint),
              border-color var(--dur-fast) var(--ease-out-quint),
              box-shadow var(--dur-fast) var(--ease-out-quint),
              background var(--dur-fast) var(--ease-out-quint);
}

.wycena-tile:hover {
  transform: translateY(-4px);
  border-color: var(--color-cool);
  box-shadow: var(--shadow-2);
}

.wycena-tile.is-selected {
  border-color: var(--color-cool);
  background: var(--color-cool-mist);
  box-shadow: var(--shadow-2), 0 0 0 4px rgba(6, 182, 212, 0.15);
}

.wycena-tile__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: var(--radius-md);
  background: var(--color-cool-mist);
  color: var(--color-cool-deep);
  transition: background var(--dur-fast) var(--ease-out-quint),
              color var(--dur-fast) var(--ease-out-quint),
              transform var(--dur-fast) var(--ease-spring);
}
.wycena-tile__icon svg { width: 28px; height: 28px; }

.wycena-tile.is-selected .wycena-tile__icon,
.wycena-tile:hover .wycena-tile__icon {
  background: var(--color-cool);
  color: var(--color-paper);
  transform: scale(1.06);
}

.wycena-tile__title {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 1.0625rem;
  color: var(--color-ink);
  line-height: 1.2;
}
.wycena-tile__desc {
  color: var(--color-mute);
  font-size: 0.875rem;
  line-height: 1.45;
}

/* --- Form fields --- */

.wycena-fields {
  display: grid;
  gap: var(--space-4);
  grid-template-columns: 1fr;
}
@media (min-width: 600px) {
  .wycena-fields { grid-template-columns: repeat(2, 1fr); }
}

.wycena-field { display: flex; flex-direction: column; gap: 6px; }
.wycena-field--wide { grid-column: 1 / -1; }

.wycena-field.is-hidden {
  display: none;
}
.wycena-field.is-shown {
  animation: wycena-field-in 280ms var(--ease-out-quint);
}
@keyframes wycena-field-in {
  from { opacity: 0; max-height: 0; }
  to   { opacity: 1; max-height: 600px; }
}

.wycena-label {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: 0.875rem;
  color: var(--color-ink);
  display: inline-block;
}
.wycena-required { color: var(--color-warm-deep); margin-left: 2px; }

.wycena-field input[type="text"],
.wycena-field input[type="tel"],
.wycena-field input[type="email"],
.wycena-field input[type="number"],
.wycena-field select,
.wycena-field textarea {
  width: 100%;
  padding: 12px 14px;
  font-size: 0.9375rem;
  font-family: var(--font-body);
  color: var(--color-ink);
  background: var(--color-paper);
  border: 1.5px solid var(--color-line);
  border-radius: var(--radius-md);
  transition: border-color var(--dur-fast) var(--ease-out-quint),
              box-shadow var(--dur-fast) var(--ease-out-quint);
}

.wycena-field input:focus,
.wycena-field select:focus,
.wycena-field textarea:focus {
  outline: none;
  border-color: var(--color-cool);
  box-shadow: 0 0 0 3px rgba(6, 182, 212, 0.15);
}

.wycena-field input.is-invalid,
.wycena-field select.is-invalid,
.wycena-field textarea.is-invalid {
  border-color: var(--color-warm-deep);
}
.wycena-field input.is-valid {
  border-color: var(--color-success);
}

.wycena-field textarea { resize: vertical; min-height: 100px; }

.wycena-helper {
  font-size: 0.8125rem;
  color: var(--color-mute);
  margin: 0;
  line-height: 1.4;
}

.wycena-error {
  font-size: 0.8125rem;
  color: var(--color-warm-deep);
  margin: 0;
  min-height: 1em;
}
.wycena-error:empty { display: none; }

/* --- Radio + checkbox group --- */

.wycena-radios,
.wycena-checkboxes {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.wycena-radios label,
.wycena-checkboxes label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  background: var(--color-paper);
  border: 1.5px solid var(--color-line);
  border-radius: var(--radius-pill);
  font-size: 0.875rem;
  color: var(--color-ink);
  cursor: pointer;
  transition: border-color var(--dur-fast) var(--ease-out-quint),
              background var(--dur-fast) var(--ease-out-quint),
              color var(--dur-fast) var(--ease-out-quint);
}

.wycena-radios label:hover,
.wycena-checkboxes label:hover {
  border-color: var(--color-cool);
}

.wycena-radios input[type="radio"],
.wycena-checkboxes input[type="checkbox"] {
  margin: 0;
  accent-color: var(--color-cool);
  cursor: pointer;
}

.wycena-radios label:has(input:checked),
.wycena-checkboxes label:has(input:checked) {
  background: var(--color-cool-mist);
  border-color: var(--color-cool);
  color: var(--color-cool-deep);
  font-weight: 500;
}

/* --- Zgody (RODO) --- */

.wycena-zgody {
  margin-top: var(--space-6);
  padding-top: var(--space-5);
  border-top: 1px solid var(--color-line);
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.wycena-zgoda {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);
  cursor: pointer;
  font-size: 0.9375rem;
  line-height: 1.5;
  color: var(--color-ink-soft);
}

.wycena-zgoda input[type="checkbox"] {
  flex: 0 0 auto;
  margin-top: 3px;
  width: 18px;
  height: 18px;
  accent-color: var(--color-cool);
  cursor: pointer;
}

.wycena-zgoda__text { flex: 1; }

.wycena-rodo-toggle {
  background: none;
  border: 0;
  padding: 0;
  margin: 0 0 0 4px;
  color: var(--color-cool-deep);
  font-weight: 600;
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.wycena-rodo-toggle:hover { color: var(--color-warm-deep); }

.wycena-rodo-text {
  margin-top: var(--space-3);
  padding: var(--space-4);
  background: var(--color-cream);
  border-radius: var(--radius-md);
  font-size: 0.875rem;
  line-height: 1.55;
  color: var(--color-ink-soft);
}
.wycena-rodo-text h4 { margin: 0 0 var(--space-3); font-size: 1rem; color: var(--color-ink); }
.wycena-rodo-text p { margin: 0 0 var(--space-3); }
.wycena-rodo-text p:last-child { margin: 0; }

/* --- Honeypot (skryty dla user) --- */

.wycena-honey {
  position: absolute;
  left: -10000px;
  top: -10000px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

/* --- Status messages --- */

.wycena-status {
  margin-top: var(--space-5);
  padding: 0;
  font-size: 0.9375rem;
  border-radius: var(--radius-md);
}
.wycena-status:empty { display: none; }
.wycena-status--pending {
  padding: var(--space-3) var(--space-4);
  background: var(--color-cool-mist);
  color: var(--color-cool-deep);
}
.wycena-status--error {
  padding: var(--space-3) var(--space-4);
  background: #FEF2F2;
  color: var(--color-warm-deep);
  border: 1px solid var(--color-warm);
}

/* --- Submit loading --- */

[data-submit].is-loading {
  position: relative;
  pointer-events: none;
  opacity: 0.7;
}
[data-submit].is-loading::after {
  content: '';
  position: absolute;
  right: 16px;
  top: 50%;
  width: 16px;
  height: 16px;
  margin-top: -8px;
  border: 2px solid rgba(255, 255, 255, 0.3);
  border-top-color: var(--color-paper);
  border-radius: 50%;
  animation: wycena-spin 700ms linear infinite;
}
@keyframes wycena-spin { to { transform: rotate(360deg); } }

/* --- Step 4: success --- */

.wycena-success {
  text-align: center;
  padding-block: var(--space-7);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-4);
}

.wycena-success__icon {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  background: var(--color-success);
  color: var(--color-paper);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: var(--space-3);
  animation: wycena-pop 600ms var(--ease-spring);
}
@keyframes wycena-pop {
  0%   { transform: scale(0); opacity: 0; }
  60%  { transform: scale(1.15); }
  100% { transform: scale(1); opacity: 1; }
}

.wycena-success__title {
  font-size: clamp(1.75rem, 1.4rem + 1.4vw, 2.5rem);
  margin: 0;
}

.wycena-success__numer {
  font-family: var(--font-display);
  font-size: 1.125rem;
  background: var(--color-cream);
  padding: var(--space-3) var(--space-5);
  border-radius: var(--radius-pill);
  margin: 0;
  letter-spacing: 0.02em;
}
.wycena-success__numer strong {
  color: var(--color-cool-deep);
  font-size: 1.25rem;
  font-weight: 800;
  letter-spacing: 0.05em;
  font-variant-numeric: tabular-nums;
}

.wycena-success__copy {
  text-align: left;
  max-width: 440px;
  margin: var(--space-3) auto 0;
}
.wycena-success__copy h3 {
  font-size: 1.0625rem;
  color: var(--color-ink);
  margin: 0 0 var(--space-3);
}
.wycena-success__copy ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}
.wycena-success__copy ul li {
  position: relative;
  padding-left: 24px;
  color: var(--color-ink-soft);
  line-height: 1.5;
}
.wycena-success__copy ul li::before {
  content: '✓';
  position: absolute;
  left: 0;
  color: var(--color-cool);
  font-weight: 700;
}

.wycena-success__urgent {
  margin: var(--space-3) 0;
  font-size: 0.9375rem;
  color: var(--color-mute);
}
.wycena-success__urgent a {
  color: var(--color-warm-deep);
  font-weight: 700;
  text-decoration: none;
}

.wycena-success__actions {
  display: flex;
  gap: var(--space-3);
  flex-wrap: wrap;
  justify-content: center;
  margin-top: var(--space-4);
}

/* --- Wycena promo banner (page-kontakt) --- */

.wycena-promo {
  background: linear-gradient(135deg, var(--color-cool-mist) 0%, #D9F8FB 100%);
  border: 1px solid var(--color-cool);
  border-radius: var(--radius-lg);
  padding: var(--space-5) var(--space-6);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  margin-bottom: var(--space-7);
}
.wycena-promo__text { flex: 1 1 280px; }
.wycena-promo__title {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 1.125rem;
  color: var(--color-ink);
  margin: 0 0 4px;
}
.wycena-promo__lead {
  margin: 0;
  color: var(--color-ink-soft);
  font-size: 0.9375rem;
}


@media print { .site-header,.site-footer,.hamburger,.mobile-drawer,.sticky-cta-bar { display: none !important; } body { color:#000; background:#fff; } }