/* Szata 2026 — nowa szata graficzna na istniejącym układzie strony.
   Ładowana jako ostatni arkusz; nie zmienia struktury, tylko wygląd.
   Czcionki Inter i Manrope (SIL OFL) są na naszym serwerze, bez Google Fonts. */

@font-face { font-family: "Inter"; font-style: normal; font-display: swap; font-weight: 100 900; src: url("/assets/fonts/inter-latin-ext.woff2") format("woff2-variations"), url("/assets/fonts/inter-latin-ext.woff2") format("woff2"); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: "Inter"; font-style: normal; font-display: swap; font-weight: 100 900; src: url("/assets/fonts/inter-latin.woff2") format("woff2-variations"), url("/assets/fonts/inter-latin.woff2") format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: "Manrope"; font-style: normal; font-display: swap; font-weight: 200 800; src: url("/assets/fonts/manrope-latin-ext.woff2") format("woff2-variations"), url("/assets/fonts/manrope-latin-ext.woff2") format("woff2"); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: "Manrope"; font-style: normal; font-display: swap; font-weight: 200 800; src: url("/assets/fonts/manrope-latin.woff2") format("woff2-variations"), url("/assets/fonts/manrope-latin.woff2") format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }

:root {
  --ink: #1F2421;
  --muted: #5F635D;
  --accent: #B64C32;
  --accent-deep: #923A24;
  --paper: #F6F2EB;
  --soft: #F6F2EB;
  --sand: #ECE4D7;
  --line: #E4DBCD;
  --surface: #FFFFFF;
  --sage: #3F6B4A;
  --f-display: "Manrope", "Segoe UI", system-ui, sans-serif;
  --f-body: "Inter", "Segoe UI", system-ui, sans-serif;
  --r-sm: 10px;
  --r-md: 16px;
  --r-lg: 24px;
  --sh: 0 1px 2px rgba(31,36,33,.04), 0 10px 30px -14px rgba(31,36,33,.18);
  --sh-hover: 0 2px 4px rgba(31,36,33,.05), 0 22px 44px -18px rgba(31,36,33,.30);
}

/* ---------- Typografia ---------- */
html body { font-family: var(--f-body) !important; color: var(--ink); -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
html body input, html body textarea, html body select, html body button { font-family: var(--f-body) !important; }
html body h1, html body h2, html body h3, html body h4,
html body .banner-title, html body .tech-title {
  font-family: var(--f-display) !important;
  font-weight: 800 !important;
  letter-spacing: -0.028em !important;
  text-wrap: balance;
}
html body h3 { font-weight: 700 !important; letter-spacing: -0.015em !important; }
html body .home-page .banner-slide .banner-title,
html body.home-page .banner-slide .banner-title { font-weight: 800 !important; line-height: 1.02 !important; }
html body .eyebrow {
  font-family: var(--f-body) !important;
  font-weight: 600 !important;
  letter-spacing: .12em !important;
  display: inline-flex; align-items: center; gap: 10px;
}
html body .eyebrow::before { content: ""; width: 20px; height: 2px; border-radius: 2px; background: currentColor; flex: none; }

/* ---------- Nagłówek ---------- */
html body > header {
  background: rgba(246,242,235,.82) !important;
  backdrop-filter: saturate(1.4) blur(14px);
  -webkit-backdrop-filter: saturate(1.4) blur(14px);
  border-bottom: 1px solid rgba(228,219,205,.75) !important;
  box-shadow: none !important;
}
html body header .brand-slogan, html body header a.logo .brand-slogan, html body > header .logo span.brand-slogan {
  font-family: var(--f-display) !important;
  font-style: italic !important;
  font-weight: 600 !important;
  letter-spacing: .01em !important;
  color: var(--accent) !important;
}
html body header .mobile-header-actions {
  background: var(--surface) !important;
  border: 0 !important;
  border-radius: 999px !important;
  padding: 3px !important;
  box-shadow: inset 0 0 0 1px var(--line), 0 4px 14px -8px rgba(31,36,33,.25) !important;
  gap: 2px !important;
  overflow: visible !important;
}
html body header .mobile-header-actions > .hdr-ico,
html body header .mobile-header-actions > .menu,
html body header .mobile-header-actions > button,
html body header .mobile-header-actions > a {
  border: 0 !important;
  border-radius: 999px !important;
  background: transparent !important;
  box-shadow: none !important;
}
html body header .mobile-header-actions > *:hover { background: var(--paper) !important; }
html body header nav .nav-box {
  border-radius: 999px !important;
  border-color: var(--line) !important;
  font-family: var(--f-body) !important;
  font-weight: 500 !important;
}
html body header nav .hdr-ico { border-radius: 999px !important; }

/* ---------- Przyciski ---------- */
html body .btn {
  border-radius: 999px !important;
  font-family: var(--f-body) !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  transition: transform .25s ease, background-color .25s ease, box-shadow .25s ease !important;
}
html body .btn:not(.hero-contact):not([style*="transparent"]) { box-shadow: 0 10px 22px -12px rgba(182,76,50,.75) !important; }
html body .btn:hover { transform: translateY(-2px); }
html body .text-link { font-weight: 600 !important; }

/* ---------- Hero (układ bez zmian) ---------- */
html body .banner-slide .build-time-badge {
  background: rgba(255,255,255,.14) !important;
  border: 1px solid rgba(255,255,255,.28) !important;
  border-radius: 18px !important;
  padding: 12px 18px !important;
  backdrop-filter: blur(14px) saturate(1.3);
  -webkit-backdrop-filter: blur(14px) saturate(1.3);
  width: fit-content !important;
  max-width: 100% !important;
}
html body .banner-slide .build-time-badge strong { font-family: var(--f-display) !important; font-weight: 700 !important; }
html body .hero-contact {
  background: rgba(255,255,255,.12) !important;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
html body .photo-label {
  border-radius: 999px !important;
  background: rgba(255,255,255,.9) !important;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

/* ---------- Karty: białe, bez ramek, miękki cień ---------- */
html body .trust-process-card,
html body .card,
html body .comparison-row:not(.comparison-head),
html body .documentation-highlight,
html body .faq-list details,
html body .privacy-notice,
html body .parcel-details {
  background: var(--surface) !important;
  border: 0 !important;
  border-radius: var(--r-md) !important;
  box-shadow: var(--sh) !important;
}
html body .card { overflow: hidden !important; transition: transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s ease !important; }
html body .card:hover { transform: translateY(-4px); box-shadow: var(--sh-hover) !important; }
html body .card .card-image { border-radius: 0 !important; overflow: hidden; }
html body .card .card-image img { transition: transform .8s cubic-bezier(.2,.7,.2,1); }
html body .card:hover .card-image img { transform: scale(1.04); }
html body .card h3 { font-size: 1.45rem !important; }
html body .card .card-bottom strong { font-family: var(--f-display) !important; font-weight: 800 !important; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
html body .card .card-area strong { font-family: var(--f-display) !important; font-weight: 700 !important; font-variant-numeric: tabular-nums; }
html body .card .delivery-time {
  border: 0 !important;
  border-left: 0 !important;
  background: var(--paper) !important;
  border-radius: var(--r-sm) !important;
}
html body .card .mobile-card-cta { border-radius: 999px !important; }
html body .tag, html body .card-label {
  border-radius: 999px !important;
  border: 0 !important;
  background: var(--paper) !important;
  font-family: var(--f-body) !important;
  font-weight: 500 !important;
}
html body .tag-new { background: var(--accent) !important; color: #fff !important; }
html body .permit-badge { border-radius: 999px !important; }

/* Kroki 1-2-3 */
html body .trust-process-card .tile-icon {
  border-radius: 12px !important;
  background: var(--accent) !important;
  color: #fff !important;
  border: 0 !important;
  font-family: var(--f-display) !important;
  font-weight: 800 !important;
}

/* Porównanie i dokumentacja */
html body .documentation-list li {
  border: 0 !important;
  border-radius: var(--r-sm) !important;
  background: var(--paper) !important;
  box-shadow: none !important;
}
html body .comparison-row strong[role="cell"]:first-of-type { font-weight: 700 !important; }
html body .comparison-head { border-radius: var(--r-md) !important; border: 0 !important; background: var(--ink) !important; }

/* Ciemny pas i pas konfiguratora */
html body .plot-check { border-radius: 0 !important; }
html body .section.dark .feature-list > * { border-radius: var(--r-md) !important; }

/* FAQ */
html body .faq-list details { padding: 4px 6px !important; margin-bottom: 10px !important; }
html body .faq-list summary { font-family: var(--f-display) !important; font-weight: 700 !important; letter-spacing: -.01em; }

/* Formularz */
html body .inquiry-form input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
html body .inquiry-form textarea,
html body .inquiry-form select {
  border: 1px solid var(--line) !important;
  border-radius: 12px !important;
  background: var(--surface) !important;
  box-shadow: none !important;
  transition: border-color .2s, box-shadow .2s !important;
}
html body .inquiry-form input:focus, html body .inquiry-form textarea:focus, html body .inquiry-form select:focus {
  border-color: var(--accent) !important;
  box-shadow: 0 0 0 4px rgba(182,76,50,.14) !important;
  outline: none !important;
}

/* Stopka */
html body .footer-social a { border-radius: 999px !important; }

/* Zaokrąglenia zdjęć w treści */
html body .section.dark img, html body .split img { border-radius: var(--r-lg) !important; }

/* Fokus z klawiatury */
html body :focus-visible { outline: 3px solid var(--accent) !important; outline-offset: 3px; }

@media (prefers-reduced-motion: reduce) {
  html body .card, html body .card .card-image img, html body .btn { transition: none !important; }
  html body .card:hover, html body .btn:hover { transform: none; }
}
