/* ===========================================================
   AD BETONZAUN · MONOLITH v2 — Per-page inline styles
   Merged from source <style> blocks (index, modell, ueber-uns, faq, kontakt, agb etc.)
   =========================================================== */


/* ===== index.html ===== */
/* =========== HOME-SPECIFIC · v7 =========== */

/* Kill native number spinners everywhere on this page */
input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
input[type=number] { -moz-appearance: textfield; appearance: textfield; }

/* Custom stepper (± buttons) */
.stepper {
  display: inline-flex; flex-direction: column;
  border: 1px solid var(--gold); margin-left: 8px;
  align-self: center;
}
.stepper button {
  background: transparent; border: 0; color: var(--gold-light);
  width: 26px; height: 20px; cursor: pointer;
  display: grid; place-items: center;
  font-family: var(--sans); font-size: 11px; line-height: 1;
  transition: background .15s, color .15s;
  padding: 0;
}
.stepper button:hover { background: var(--gold); color: var(--ink); }
.stepper button:first-child { border-bottom: 1px solid var(--gold); }
.stepper svg { display: block; }

/* Hero select caret */
.hero-select-wrap { position: relative; }
.hero-select-wrap::after {
  content: ''; position: absolute; right: 0; top: 50%; transform: translateY(-30%);
  width: 8px; height: 8px; border-right: 1px solid var(--gold); border-bottom: 1px solid var(--gold);
  rotate: 45deg; pointer-events: none;
}

/* Animated counter */
.counter-num { font-variant-numeric: tabular-nums; font-feature-settings: 'tnum'; }

/* Pillar card with photo backdrop */
.pillar {
  position: relative; padding: 48px 40px;
  background: var(--bg);
  border-right: 1px solid var(--line-2);
  overflow: hidden; min-height: 440px;
  display: flex; flex-direction: column; justify-content: space-between;
  transition: transform .4s cubic-bezier(.2,.7,.2,1);
}
.pillar:last-child { border-right: none; }
.pillar__bg {
  position: absolute; inset: 0; z-index: 0;
  background-size: cover; background-position: center;
  opacity: .22;  /* always visible, not only on hover */
  transition: opacity .5s ease, transform .8s cubic-bezier(.2,.7,.2,1);
  filter: grayscale(0.15) contrast(1.05);
}
.pillar::before {
  content: ''; position: absolute; inset: 0; z-index: 0;
  background: linear-gradient(180deg, rgba(247,243,234,.88) 0%, rgba(247,243,234,.94) 100%);
  pointer-events: none;
}
.pillar:hover .pillar__bg { opacity: .40; transform: scale(1.04); }
.pillar:hover { transform: translateY(-4px); }
.pillar__inner { position: relative; z-index: 1; display: flex; flex-direction: column; height: 100%; }
.pillar__num {
  font-family: var(--serif); font-size: 112px; line-height: .85;
  color: var(--gold); font-weight: 500; margin: 12px 0 28px;
  font-style: italic;
}
.pillar__title { font-family: var(--serif); font-size: 28px; line-height: 1.1; font-weight: 500; letter-spacing: -.01em; }
.pillar__body { color: var(--ink-dim); margin-top: 20px; font-size: 15px; line-height: 1.6; flex: 1; }
.pillar__foot { margin-top: 32px; padding-top: 16px; border-top: 1px solid var(--line-2); font-family: var(--mono); font-size: 10px; letter-spacing: .22em; color: var(--gold); text-transform: uppercase; font-weight: 600; display: flex; justify-content: space-between; }

/* Sechs Schritte: improved timeline with photos */
.proc-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: start; }
.proc-step {
  display: grid; grid-template-columns: 72px 1fr; gap: 24px;
  padding: 32px 0; border-bottom: 1px solid var(--line);
  align-items: start;
}
.proc-step:last-child { border-bottom: none; }
.proc-step__num {
  font-family: var(--serif); font-size: 56px; line-height: 1;
  color: var(--gold); font-weight: 500; font-style: italic;
}
.proc-step__body h4 { font-family: var(--serif); font-size: 26px; font-weight: 500; margin: 0 0 10px; letter-spacing: -.005em; }
.proc-step__body p { color: var(--ink-dim); margin: 0 0 12px; font-size: 15px; line-height: 1.6; }
.proc-step__week {
  display: inline-block; font-family: var(--mono); font-size: 10px; letter-spacing: .2em;
  color: var(--gold); text-transform: uppercase; font-weight: 600;
  padding: 4px 10px; border: 1px solid var(--line-2); margin-top: 6px;
}
.proc-sticky { position: sticky; top: 96px; }
.proc-sticky__img {
  aspect-ratio: 4/5; overflow: hidden; background: #2a241a; position: relative;
}
.proc-sticky__img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.proc-sticky__img::after {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(180deg, transparent 60%, rgba(0,0,0,.55));
}
.proc-sticky__label {
  position: absolute; left: 20px; bottom: 20px; right: 20px; color: #fff; z-index: 2;
  text-shadow: 0 2px 8px rgba(0,0,0,.5);
}

/* Leaflet home map */
#de-map { width: 100%; height: 560px; background: var(--bg-2); border: 1px solid var(--line-2); overflow: hidden; position: relative; }
#de-map .leaflet-container { background: var(--bg-2); }
#de-map .leaflet-tile { filter: saturate(0.9) contrast(1.02); }
.ad-pin-home {
  width: 12px; height: 12px; border-radius: 50%;
  background: var(--gold); border: 2px solid #fff;
  box-shadow: 0 2px 6px rgba(0,0,0,.35);
}
.ad-depot-home {
  width: 18px; height: 18px;
  background: var(--ink); border: 2px solid var(--gold);
  box-shadow: 0 2px 8px rgba(0,0,0,.5);
}
.leaflet-popup-content { font-family: var(--sans); font-size: 13px; line-height: 1.5; }
.leaflet-popup-content b { font-family: var(--serif); font-size: 16px; font-weight: 500; color: var(--ink); }
.leaflet-popup-content .kicker-mini { font-family: var(--mono); font-size: 9px; letter-spacing: .18em; color: var(--gold); text-transform: uppercase; margin-bottom: 4px; }

/* Google-style review card (homepage version) */
.g-review {
  background: #fff; border: 1px solid var(--line);
  padding: 24px; display: flex; flex-direction: column;
  transition: box-shadow .2s, border-color .2s;
}
.g-review:hover { border-color: var(--line-2); box-shadow: 0 8px 28px rgba(20,17,11,.08); }
.g-review__head { display: flex; align-items: flex-start; gap: 12px; }
.g-review__avatar {
  width: 40px; height: 40px; border-radius: 50%;
  display: grid; place-items: center;
  font-family: var(--sans); font-size: 16px; font-weight: 500;
  color: #fff; flex-shrink: 0;
}
.g-review__id { flex: 1; min-width: 0; }
.g-review__name { font-size: 14px; font-weight: 500; color: #1f1f1f; line-height: 1.2; }
.g-review__meta { font-size: 12px; color: #5f6368; margin-top: 2px; }
.g-review__g {
  width: 18px; height: 18px; border-radius: 50%;
  display: grid; place-items: center; flex-shrink: 0;
  background: #fff; box-shadow: 0 0 0 1px #e8eaed;
  font-size: 10px; color: #5f6368; font-weight: 600;
}
.g-review__rating { display: flex; align-items: center; gap: 8px; margin: 14px 0 6px; }
.g-review__stars { color: #fbbc04; font-size: 15px; letter-spacing: .08em; }
.g-review__date { font-size: 13px; color: #5f6368; }
.g-review__text { color: #3c4043; font-size: 14px; line-height: 1.55; margin: 4px 0 16px; flex: 1; }
.g-review__photos { display: flex; gap: 6px; margin-top: 4px; }
.g-review__photos img {
  width: 68px; height: 68px; object-fit: cover; display: block;
  border-radius: 6px; background: var(--bg-2);
}
.g-review__helpful {
  margin-top: 14px; padding-top: 12px; border-top: 1px solid #e8eaed;
  font-size: 12px; color: #5f6368; display: flex; gap: 14px;
}

/* Objection card — richer */
.obj-card {
  padding: 40px 36px; background: var(--bg);
  border: 1px solid var(--line); position: relative;
  display: flex; flex-direction: column; gap: 16px; min-height: 100%;
}
.obj-card__q {
  font-family: var(--serif); font-size: 26px; line-height: 1.25;
  color: var(--ink); font-weight: 500; font-style: italic;
}
.obj-card__label {
  position: absolute; top: -12px; left: 28px;
  background: var(--gold); color: var(--ink);
  font-family: var(--mono); font-size: 9.5px; letter-spacing: .25em;
  padding: 4px 10px; font-weight: 600; text-transform: uppercase;
}
.obj-card__fact {
  display: grid; grid-template-columns: auto 1fr; gap: 14px; align-items: baseline;
  margin-top: 4px; padding: 14px; background: var(--bg-2);
  border-left: 2px solid var(--gold);
}
.obj-card__fact-num { font-family: var(--serif); font-size: 36px; color: var(--gold); font-weight: 500; line-height: 1; }
.obj-card__fact-txt { font-size: 13px; color: var(--ink-dim); line-height: 1.5; }

/* Final CTA · asymmetric layout */
.final-cta {
  display: grid; grid-template-columns: 1.3fr 1fr; gap: 80px;
  align-items: center;
}
.final-cta__paths {
  display: grid; grid-template-columns: 1fr; gap: 12px;
}
.final-cta__path {
  display: grid; grid-template-columns: 48px 1fr auto; gap: 20px; align-items: center;
  padding: 22px 24px; background: #1d1910;
  border: 1px solid #2a241a; transition: all .25s;
}
.final-cta__path:hover { background: #2a241a; border-color: var(--gold-light); transform: translateX(4px); }
.final-cta__path-n {
  width: 44px; height: 44px; border: 1px solid var(--gold-light);
  display: grid; place-items: center; color: var(--gold-light);
  font-family: var(--serif); font-size: 22px; font-style: italic;
}
.final-cta__path-label { font-family: var(--serif); font-size: 20px; color: #f0ead9; font-weight: 500; }
.final-cta__path-sub { font-family: var(--mono); font-size: 10.5px; letter-spacing: .2em; color: #8a7f6b; text-transform: uppercase; margin-top: 4px; }
.final-cta__path-arr { font-family: var(--serif); font-size: 28px; color: var(--gold-light); font-style: italic; }

/* SEO Footer · premium sitemap */
.seo-footer {
  background: var(--bg-dark); color: #9c9280;
  padding: 96px 0 32px; border-top: 6px solid var(--gold);
}
.seo-footer__top { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr 1fr; gap: 48px; margin-bottom: 64px; padding-bottom: 56px; border-bottom: 1px solid #2a241a; }
.seo-footer__brand h3 { font-family: var(--serif); font-size: 38px; font-weight: 500; margin: 0 0 14px; color: #f0ead9; letter-spacing: -.01em; }
.seo-footer__brand h3 em { color: var(--gold-light); }
.seo-footer__brand-logo { display: inline-block; margin: 0 0 20px; line-height: 0; }
.seo-footer__brand-logo img { height: 50px; width: auto; display: block; filter: brightness(0) invert(1); opacity: .92; transition: opacity .2s; }
.seo-footer__brand-logo:hover img { opacity: 1; }
.seo-footer__brand p { line-height: 1.65; font-size: 14px; max-width: 340px; }
.seo-footer__brand-meta { margin-top: 20px; padding-top: 16px; border-top: 1px solid #2a241a; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; font-family: var(--mono); font-size: 10px; letter-spacing: .18em; color: #6f6552; text-transform: uppercase; }
.seo-footer__brand-meta b { display: block; color: var(--gold-light); font-weight: 500; font-family: var(--serif); font-size: 20px; letter-spacing: 0; margin-bottom: 2px; font-style: italic; }
.seo-footer h4 { font-family: var(--mono); font-size: 10.5px; letter-spacing: .28em; color: var(--gold-light); margin: 0 0 18px; font-weight: 600; text-transform: uppercase; }
.seo-footer ul { list-style: none; margin: 0; padding: 0; }
.seo-footer li { margin-bottom: 10px; font-size: 13.5px; }
.seo-footer a { color: #c4bba7; transition: color .15s; }
.seo-footer a:hover { color: var(--gold-light); }
.seo-footer__seo-strip { padding: 24px 0; border-bottom: 1px solid #2a241a; margin-bottom: 24px; }
.seo-footer__seo-strip h5 { font-family: var(--mono); font-size: 10px; letter-spacing: .25em; color: #6f6552; margin: 0 0 14px; font-weight: 600; text-transform: uppercase; }
.seo-footer__seo-strip .tags {
  display: flex; flex-wrap: wrap; gap: 8px 20px;
  font-family: var(--sans); font-size: 12px; color: #6f6552;
}
.seo-footer__seo-strip .tags a { color: #8a7f6b; }
.seo-footer__bottom { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 16px; font-family: var(--mono); font-size: 10.5px; letter-spacing: .18em; color: #6f6552; text-transform: uppercase; }
.seo-footer__bottom a { color: #9c9280; }
.seo-footer__bottom a:hover { color: var(--gold-light); }

/* Hide stock footer on home (we render our own below) */
body[data-page="home"] > footer.footer { display: none !important; }

/* Kollektion preview · higher contrast */
.on-dark .k-card p { color: #d4cbb6 !important; }

/* Bestseller card hover */
.best-card { transition: box-shadow .25s, transform .25s; }
.best-card:hover { box-shadow: 0 20px 60px -30px rgba(184,137,31,.35); }

@media (max-width: 1100px) {
  .pillar { min-height: 380px; padding: 36px 28px; }
  .proc-grid { grid-template-columns: 1fr; gap: 40px; }
  .proc-sticky { position: static; }
  .final-cta { grid-template-columns: 1fr; gap: 48px; }
  .seo-footer__top { grid-template-columns: 1fr 1fr 1fr 1fr; gap: 32px; }
  .seo-footer__brand { grid-column: 1 / -1; max-width: 760px; }
}

/* v15.57 — footer responsive (Adam: znaki sie dziwnie ukladaly jak wasko) */
@media (max-width: 880px) {
  .seo-footer { padding: 56px 0 24px !important; }
  .seo-footer__top { grid-template-columns: repeat(2, 1fr); gap: 28px 24px; margin-bottom: 40px; padding-bottom: 36px; }
  .seo-footer__brand { grid-column: 1 / -1; }
  .seo-footer__brand p { max-width: 100%; }
  .seo-footer__brand-meta { grid-template-columns: repeat(4, 1fr); }
  .seo-footer h4 { margin-bottom: 12px !important; font-size: 11px !important; letter-spacing: .2em !important; }
  .seo-footer li { margin-bottom: 8px; font-size: 13px; }
  .seo-footer__seo-strip h5 { font-size: 9.5px; letter-spacing: .14em; word-break: keep-all; }
  .seo-footer__seo-strip .tags { font-size: 11.5px; gap: 6px 14px; }
  .seo-footer__bottom { flex-direction: column; align-items: flex-start; gap: 12px; font-size: 10px; letter-spacing: .12em; text-align: left; }
}
@media (max-width: 540px) {
  .seo-footer__top { grid-template-columns: 1fr; gap: 28px; }
  .seo-footer__brand-meta { grid-template-columns: repeat(2, 1fr); gap: 14px; }
  .seo-footer__brand-meta b { font-size: 18px; }
  .seo-footer__seo-strip .tags { gap: 4px 10px; font-size: 11px; }
  .seo-footer__seo-strip .tags span { display: none; } /* ukryj separatory · żeby nie psuły układu */
  .seo-footer__seo-strip .tags a { padding: 3px 8px; background: rgba(212,175,55,.06); border-radius: 4px; }
  .seo-footer__bottom > div:first-child { font-size: 9.5px; line-height: 1.5; letter-spacing: .08em; }
  .seo-footer__bottom > div:last-child { gap: 14px !important; }
}
.ml-pop-backdrop {
  position: fixed; inset: 0; z-index: 9000;
  background: rgba(13, 11, 7, .72);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  display: flex; align-items: center; justify-content: center;
  padding: 24px;
  opacity: 0; pointer-events: none;
  transition: opacity .4s ease;
}
.ml-pop-backdrop.is-open { opacity: 1; pointer-events: auto; }
.ml-pop {
  max-width: 920px; width: 100%;
  background: #14110b; color: #f0ead9;
  border: 1px solid #2a241a;
  display: grid; grid-template-columns: 1.05fr 1fr;
  box-shadow: 0 40px 120px -40px rgba(0,0,0,.8);
  transform: translateY(20px) scale(.98);
  transition: transform .5s cubic-bezier(.2,.7,.2,1) .1s;
  position: relative;
  max-height: 90vh;
  overflow: auto;
}
.ml-pop-backdrop.is-open .ml-pop { transform: translateY(0) scale(1); }
.ml-pop__vis {
  background: radial-gradient(ellipse 80% 60% at 50% 40%, rgba(212,175,55,.12), transparent 65%), #0d0b07;
  padding: 48px 40px; display: flex; flex-direction: column; justify-content: space-between;
  position: relative; overflow: hidden;
  border-right: 1px solid #2a241a;
}
.ml-pop__vis::before {
  content: ''; position: absolute; inset: 0;
  background-image:
    repeating-linear-gradient(0deg, transparent 0, transparent 16px, rgba(212,175,55,.04) 16px, rgba(212,175,55,.04) 17px);
  pointer-events: none;
}
.ml-pop__mark {
  font-family: var(--mono); font-size: 10px; letter-spacing: .28em;
  text-transform: uppercase; color: #d4af37; font-weight: 600;
  border: 1px solid #3d3420; padding: 8px 14px;
  display: inline-flex; align-items: center; gap: 8px;
  align-self: flex-start;
  position: relative; z-index: 1;
}
.ml-pop__headline {
  font-family: var(--serif); font-weight: 500;
  font-size: 52px; line-height: .98; letter-spacing: -.02em;
  color: #f0ead9; margin: 28px 0 0;
  position: relative; z-index: 1;
}
.ml-pop__headline em { color: #d4af37; font-style: italic; font-weight: 500; }
.ml-pop__sig {
  font-family: var(--serif); font-style: italic; font-size: 18px;
  color: #a9a293; margin: 0;
  border-top: 1px solid #2a241a; padding-top: 20px;
  position: relative; z-index: 1;
}
.ml-pop__body {
  padding: 48px 44px; display: flex; flex-direction: column; gap: 24px;
}
.ml-pop__eyebrow {
  font-family: var(--mono); font-size: 10px; letter-spacing: .25em;
  text-transform: uppercase; color: #d4af37; font-weight: 600;
}
.ml-pop__body h3 {
  font-family: var(--serif); font-size: 28px; line-height: 1.15;
  font-weight: 500; color: #f0ead9; margin: 0; letter-spacing: -.01em;
}
.ml-pop__body p { color: #c4bba7; font-size: 15.5px; line-height: 1.6; margin: 0; }
.ml-pop__specs {
  display: grid; grid-template-columns: 1fr 1fr; gap: 1px;
  background: #2a241a; border: 1px solid #2a241a;
}
.ml-pop__specs > div { background: #14110b; padding: 16px 18px; }
.ml-pop__specs .n { font-family: var(--serif); font-size: 22px; color: #d4af37; font-weight: 500; line-height: 1; margin-bottom: 4px; }
.ml-pop__specs .l { font-family: var(--mono); font-size: 9.5px; letter-spacing: .18em; text-transform: uppercase; color: #a9a293; }
.ml-pop__actions { display: flex; flex-direction: column; gap: 10px; margin-top: 4px; }
.ml-pop__btn {
  display: inline-flex; align-items: center; justify-content: space-between;
  padding: 16px 22px;
  font-family: var(--mono); font-size: 11px; letter-spacing: .18em;
  text-transform: uppercase; font-weight: 600;
  transition: all .2s;
  cursor: pointer; border: 1px solid transparent;
}
.ml-pop__btn--primary { background: #d4af37; color: #14110b; }
.ml-pop__btn--primary:hover { background: #f0ead9; }
.ml-pop__btn--ghost { background: transparent; color: #a9a293; border-color: #2a241a; }
.ml-pop__btn--ghost:hover { color: #d4af37; border-color: #3d3420; }
.ml-pop__close {
  position: absolute; top: 14px; right: 14px; z-index: 2;
  width: 36px; height: 36px;
  background: transparent; border: 1px solid #2a241a; color: #a9a293;
  cursor: pointer; font-size: 20px; line-height: 1;
  display: flex; align-items: center; justify-content: center;
  transition: all .15s;
}
.ml-pop__close:hover { border-color: #d4af37; color: #d4af37; }
@media (max-width: 780px) {
  .ml-pop { grid-template-columns: 1fr; max-height: 94vh; }
  .ml-pop__vis { border-right: none; border-bottom: 1px solid #2a241a; padding: 32px 28px; }
  .ml-pop__vis::before { display: none; }
  .ml-pop__headline { font-size: 38px; }
  .ml-pop__body { padding: 32px 28px; }
}

/* ===== kollektion.html — refreshed 2026-05-04 ===== */
.koll-hero {
  padding: 56px 0 48px;
  border-bottom: 1px solid var(--line);
  background: linear-gradient(180deg, var(--bg-2) 0%, var(--bg) 100%);
}
.koll-hero__crumbs {
  display: flex; gap: 10px; align-items: center;
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.18em;
  color: var(--ink-mute); text-transform: uppercase; margin-bottom: 28px;
}
.koll-hero__crumbs a { color: var(--ink-mute); text-decoration: none; transition: color .15s; }
.koll-hero__crumbs a:hover { color: var(--gold); }
.koll-hero__crumbs strong { color: var(--ink); font-weight: 500; }
.koll-hero__head {
  display: flex; justify-content: space-between; align-items: center;
  flex-wrap: wrap; gap: 16px; margin-bottom: 24px;
}
.koll-hero__meta { display: flex; gap: 10px; flex-wrap: wrap; margin: 0; }
.koll-hero__chip {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 7px 14px;
  background: var(--ink); color: #f5efe0;
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.22em; text-transform: uppercase;
  border-radius: 0;
}
.koll-hero__chip:nth-child(2) { background: var(--gold); color: var(--bg-dark); }
.koll-hero__chip:nth-child(3) { background: transparent; color: var(--ink); border: 1px solid var(--ink); }
.koll-hero__jump {
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--gold); text-decoration: none;
  border-bottom: 1px solid var(--gold); padding-bottom: 4px;
  transition: color .15s, border-color .15s;
}
.koll-hero__jump:hover { color: var(--ink); border-bottom-color: var(--ink); }
.koll-hero__title { max-width: 1000px; margin-bottom: 28px; color: var(--ink); }
.koll-hero__lede { max-width: 720px; color: var(--ink); font-size: 18px; line-height: 1.6; }
.koll-hero__lede strong { color: var(--gold); font-weight: 500; }

/* ===== Sechs Familien — visual table-of-contents (replicates front-page grid) ===== */
.koll-families-section {
  background: var(--bg-dark);
  padding: 96px 0;
  color: #f0ead9;
}
.koll-families-section__head { margin-bottom: 64px; max-width: 1180px; }
.koll-families-section__head .eyebrow { color: var(--gold-light); }
.koll-families-section__head h2 { color: #f5efe0; }
.koll-families-section__head h2 em { color: var(--gold-light); font-style: italic; }
.koll-families-section__head .lede { color: #c4bba7; }

.koll-families {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 1px; background: #2a241a; border: 1px solid #2a241a;
}
.koll-family {
  display: flex; flex-direction: column;
  background: #0e0b07; text-decoration: none;
  transition: background .25s ease;
}
.koll-family:hover { background: #14100a; }
.koll-family--active { background: #14100a; outline: 2px solid var(--gold); outline-offset: -2px; }

.koll-family__img {
  position: relative; aspect-ratio: 4/3; overflow: hidden; background: #2a241a;
}
.koll-family__img img {
  width: 100%; height: 100%; object-fit: cover; display: block;
  transition: transform .8s ease;
}
.koll-family:hover .koll-family__img img { transform: scale(1.04); }
.koll-family__overlay {
  position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(180deg, rgba(0,0,0,.65) 0%, rgba(0,0,0,.2) 35%, rgba(0,0,0,.25) 55%, rgba(0,0,0,.88) 100%);
}
.koll-family__top {
  position: absolute; left: 24px; top: 24px; right: 24px;
  color: var(--gold-light); font-family: var(--mono); font-size: 10px;
  letter-spacing: 0.22em;
  pointer-events: none; /* 2026-05-04 — let parent <a> receive clicks */
}
.koll-family__hero {
  position: absolute; left: 24px; bottom: 20px; right: 24px; color: #f0ead9;
  pointer-events: none;
}
.koll-family__name {
  font-family: var(--serif); font-size: 44px; line-height: .95;
  font-weight: 500; letter-spacing: -.01em;
}
.koll-family__sub {
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.2em;
  margin-top: 6px; color: var(--gold-light);
}
.koll-family__body {
  padding: 28px 28px 32px; border-top: 1px solid #2a241a; flex: 1;
  display: flex; flex-direction: column;
}
.koll-family__desc {
  color: #c4bba7; font-size: 13.5px; line-height: 1.55; margin: 0 0 20px; flex: 1;
}
.koll-family__foot {
  display: flex; justify-content: space-between; align-items: baseline;
  font-family: var(--mono); font-size: 10px; letter-spacing: .18em;
  color: #8a7f6b; border-top: 1px solid #2a241a; padding-top: 16px;
}
.koll-family__cta { color: var(--gold-light); transition: color .15s; }
.koll-family:hover .koll-family__cta { color: #f5efe0; }

.koll-families-section__strip {
  margin-top: 40px;
  display: flex; justify-content: space-between; align-items: center;
  gap: 32px; padding: 24px 0; border-top: 1px solid #2a241a;
  flex-wrap: wrap; font-family: var(--mono); font-size: 11px;
  letter-spacing: .18em; color: #9c9280;
}
.koll-families-section__strip a {
  color: var(--gold-light); text-decoration: none;
  border-bottom: 1px solid var(--gold-light); padding-bottom: 2px;
}

/* Inline Familie intro shown above the grid when filter is active */
.koll-fam-intro {
  display: grid; grid-template-columns: auto 1fr; gap: 28px;
  background: var(--bg-2); border-left: 3px solid var(--gold);
  padding: 32px 36px; margin: 0 0 40px;
  align-items: start;
}
.koll-fam-intro__no {
  font-family: var(--serif); font-size: 64px; font-weight: 400;
  color: var(--gold); line-height: 1; letter-spacing: -.02em;
}
.koll-fam-intro__sub {
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.22em;
  text-transform: uppercase; color: var(--gold); margin-bottom: 8px;
}
.koll-fam-intro__title {
  font-family: var(--serif); font-size: 36px; font-weight: 500;
  margin: 0 0 14px; color: var(--ink); letter-spacing: -.01em;
}
.koll-fam-intro__body {
  font-size: 15.5px; line-height: 1.65; color: var(--ink-dim); margin: 0; max-width: 700px;
}

/* Tablet/mobile families */
@media (max-width: 980px) {
  .koll-families { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
  .koll-families-section { padding: 64px 0; }
  .koll-families { grid-template-columns: 1fr; }
  .koll-family__name { font-size: 36px; }
  .koll-fam-intro { grid-template-columns: 1fr; gap: 12px; padding: 24px 20px; }
  .koll-fam-intro__no { font-size: 44px; }
  .koll-fam-intro__title { font-size: 26px; }
  .koll-hero__head { flex-direction: column; align-items: flex-start; }
}

/* v15.56 — sidebar 200px węższy + auto-fit grid (2-3-4 cards adaptywnie) */
.koll-layout {
  display: grid; grid-template-columns: 200px 1fr; gap: 48px;
  padding: 48px 0 80px;
}
.sidebar {
  position: sticky; top: 100px; align-self: start;
  max-height: calc(100vh - 120px); overflow-y: auto;
  padding-right: 12px;
}
/* Custom thin scrollbar dla sidebar */
.sidebar::-webkit-scrollbar { width: 4px; }
.sidebar::-webkit-scrollbar-thumb { background: var(--line); border-radius: 2px; }
.sidebar::-webkit-scrollbar-thumb:hover { background: var(--gold); }

/* New sidebar — v15.55 minimalist premium */
.koll-sidebar { padding-right: 4px; }
.koll-sidebar__group {
  padding: 18px 0;
  border-bottom: 1px solid var(--line);
}
.koll-sidebar__group:first-child { padding-top: 0; }
.koll-sidebar__group:last-child { border-bottom: 0; }
.koll-sidebar__h {
  display: flex; align-items: baseline; gap: 10px;
  font-family: var(--serif); font-size: 15.5px; font-weight: 500;
  color: var(--ink); margin: 0 0 12px;
  letter-spacing: -0.005em;
}
.koll-sidebar__hno {
  font-family: var(--mono); font-size: 9.5px; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--gold-dark, #9d6e1f); font-weight: 700;
}
/* v15.55 — hint texts hidden by default (zbyt gadane), tylko bardzo małe */
.koll-sidebar__hint {
  font-size: 11px; line-height: 1.4; color: var(--ink-mute);
  margin: 0 0 8px; font-style: italic; opacity: .65;
  display: none; /* ukryte całkowicie na desktop, opcjonalnie na hover sekcji */
}
.koll-sidebar__chips {
  display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px;
}
.koll-chip {
  display: inline-flex; align-items: center;
  padding: 6px 12px;
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.05em;
  background: var(--bg-2); color: var(--ink-dim);
  border: 1px solid var(--line); text-decoration: none;
  transition: all .15s ease;
}
.koll-chip:hover { background: var(--ink); color: var(--bg); border-color: var(--ink); }
.koll-chip--active { background: var(--gold); color: var(--bg-dark); border-color: var(--gold); font-weight: 600; }
.koll-sidebar__reset {
  margin-top: 24px; padding-top: 20px; border-top: 2px solid var(--gold);
}
.koll-sidebar__reset a {
  display: block; padding: 10px 14px; background: var(--gold);
  color: var(--bg-dark); text-align: center;
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.18em;
  text-transform: uppercase; text-decoration: none; font-weight: 600;
  transition: background .15s;
}
.koll-sidebar__reset a:hover { background: var(--gold-light); }

/* v15.55 — Filter items premium slim */
.filter-item {
  display: flex; justify-content: space-between; align-items: center; gap: 8px;
  padding: 7px 10px; font-size: 13.5px; color: var(--ink-dim);
  cursor: pointer; transition: all .18s ease;
  text-decoration: none; border-radius: 6px;
  margin: 1px -8px;
}
.filter-item:hover { color: var(--ink); background: var(--bg-2); }
.filter-item--active { color: var(--ink); background: rgba(212,175,55,.08); font-weight: 600; border-left: 2px solid var(--gold); padding-left: 8px; border-radius: 0 6px 6px 0; }
.filter-item__count {
  font-family: var(--mono); font-size: 10px; color: var(--ink-mute);
  flex-shrink: 0; padding: 2px 7px; background: #fff;
  border: 1px solid var(--line); border-radius: 999px; min-width: 24px; text-align: center;
  font-weight: 600;
}
.filter-item--active .filter-item__count { color: var(--gold); border-color: var(--gold); }
.filter-item__sub {
  font-size: 11px; color: var(--ink-mute); font-family: var(--mono);
  letter-spacing: 0.05em; margin-left: auto; margin-right: 6px;
}
.filter-item__roman {
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.15em;
  color: var(--gold); min-width: 28px; font-weight: 500;
}
.filter-item--family { padding-left: 12px; }
.filter-item--family.filter-item--active { padding-left: 9px; }
.filter-item--ml .filter-item__dot { color: var(--gold); margin-right: 8px; font-size: 12px; }
.filter-item--reset { color: var(--gold); font-style: italic; }
.koll-sort a { text-decoration: none; color: var(--ink-dim); cursor: pointer; }
.koll-sort a.active { color: var(--gold); }
.koll-sort a:hover { color: var(--ink); }

.sidebar input[type="range"] {
  width: 100%; -webkit-appearance: none; appearance: none;
  height: 1px; background: var(--line-2); margin: 16px 0 8px;
}
.sidebar input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none; appearance: none;
  width: 14px; height: 14px; background: var(--gold);
  border-radius: 50%; cursor: pointer;
}
.range-vals { display: flex; justify-content: space-between; font-family: var(--mono); font-size: 11px; color: var(--ink-mute); }

.koll-top {
  display: flex; justify-content: space-between; align-items: baseline;
  margin-bottom: 32px; padding-bottom: 24px; border-bottom: 1px solid var(--line);
}
.koll-top__count { font-family: var(--serif); font-size: 24px; color: var(--ink); }
.koll-top__count em { color: var(--gold); }
.koll-sort {
  display: flex; gap: 24px; font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.15em; text-transform: uppercase; color: var(--ink-mute);
}
.koll-sort span { cursor: pointer; }
.koll-sort span.active { color: var(--gold); }

/* v15.55 — mobile: sidebar staje się drawer-style above-grid */
@media (max-width: 900px) {
  .koll-layout { grid-template-columns: 1fr; gap: 24px; padding: 24px 0 60px; }
  .sidebar { position: relative; top: 0; max-height: none; padding-right: 0;
    background: #fff; border: 1px solid var(--line); border-radius: 10px; padding: 18px 18px 12px; }
  .koll-sidebar__group { padding: 12px 0; }
  .koll-sidebar__h { font-size: 14px; }
  .filter-item { font-size: 13px; padding: 6px 8px; }
}

/* v15.55 — style intro slim (mniej padding, więcej kompaktowo) */
.koll-style-intro {
  background: var(--bg-2); border-left: 3px solid var(--gold);
  padding: 22px 26px; margin: 0 0 26px;
  border-radius: 0 6px 6px 0;
}
.koll-style-intro__label {
  font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.22em;
  text-transform: uppercase; color: var(--gold); margin-bottom: 10px;
}
.koll-style-intro__title {
  font-family: var(--serif); font-size: 24px; font-weight: 500;
  margin: 0 0 12px; color: var(--ink); line-height: 1.25;
}
.koll-style-intro__body {
  font-size: 15px; line-height: 1.65; color: var(--ink-dim); margin: 0;
}
.koll-style-intro__body strong { color: var(--ink); font-weight: 500; font-family: var(--serif); }
.koll-style-intro__body a { font-family: var(--mono); font-size: 11px; letter-spacing: 0.15em; text-transform: uppercase; text-decoration: none; }

/* v15.56 — auto-fit grid: minmax 290px = 2-3-4 kart adaptywnie wg szerokości */
.koll-grid-full {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(290px, 1fr));
  gap: 28px 22px;
}
@media (max-width: 720px) { .koll-grid-full { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 20px 14px; } }
@media (max-width: 460px) { .koll-grid-full { grid-template-columns: 1fr; gap: 18px; } }

.koll-item {
  cursor: pointer;
  display: flex; flex-direction: column;
  background: #fff;
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid transparent;
  transition: transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s, border-color .25s;
  text-decoration: none;
  color: var(--ink);
}
.koll-item:hover {
  transform: translateY(-4px);
  box-shadow: 0 18px 40px -14px rgba(20,17,11,.18), 0 0 0 1px rgba(212,175,55,.15);
  border-color: rgba(212,175,55,.35);
}
.koll-item__img {
  aspect-ratio: 4/3; /* v15.55b — pasuje do real photos 768×576 (4:3 landscape) */
  background: linear-gradient(180deg, #f7f1e3 0%, var(--bg-2) 100%);
  overflow: hidden; position: relative;
  padding: 0;
  border-bottom: 1px solid var(--line);
}
/* v15.55b — cover wypełnia całość, dopasowane do 4:3 box (Adam: nie rozciągaj na pionowo) */
.koll-item__img img { width:100%;height:100%;object-fit:cover;object-position:center center; transition: transform .6s; }
.koll-item:hover .koll-item__img img { transform: scale(1.06); }
.koll-item__img--placeholder {
  display: flex; align-items: center; justify-content: center;
  background-image: repeating-linear-gradient(45deg, var(--bg-2) 0, var(--bg-2) 14px, var(--bg-3) 14px, var(--bg-3) 28px);
}
.koll-item__img-fallback {
  font-family: var(--serif); font-style: italic; font-size: 28px;
  color: var(--ink-mute); letter-spacing: 0.02em; text-align: center;
  padding: 0 20px;
}
.koll-item__img--placeholder::after {
  content: 'Foto folgt'; position: absolute; bottom: 14px; right: 14px;
  font-family: var(--mono); font-size: 9px; letter-spacing: 0.2em;
  color: var(--ink-mute); text-transform: uppercase;
}
/* v15.55 — premium badges na cards */
.koll-num {
  position: absolute; top: 12px; left: 12px; z-index: 3;
  font-family: var(--mono); font-size: 9.5px; letter-spacing: 0.18em;
  color: var(--gold-light); background: rgba(20,17,11,.92); padding: 5px 10px;
  font-weight: 700; backdrop-filter: blur(4px);
  border-radius: 3px; border: 1px solid rgba(212,175,55,.25);
}
.koll-badge {
  position: absolute; top: 12px; right: 12px; z-index: 3;
  font-family: var(--mono); font-size: 8.5px; letter-spacing: 0.16em;
  color: var(--ink); background: var(--gold); padding: 4px 9px; text-transform: uppercase;
  font-weight: 700; border-radius: 3px;
  box-shadow: 0 2px 8px rgba(212,175,55,.4);
}
.koll-badge--ml {
  background: #14110b; color: #d4af37;
  font-weight: 700; letter-spacing: .18em;
}

/* Modern Line 2026 promo strip at top of grid */
.ml-promo {
  grid-column: 1 / -1;
  display: grid; grid-template-columns: 1fr auto;
  gap: 40px; align-items: center;
  padding: 36px 40px;
  background: #14110b; color: #f0ead9;
  border: 1px solid #2a241a;
  margin-bottom: 8px;
}
.ml-promo__eyebrow {
  font-family: var(--mono); font-size: 10px; letter-spacing: .25em;
  text-transform: uppercase; color: #d4af37; font-weight: 600;
  margin-bottom: 10px;
}
.ml-promo h3 {
  font-family: var(--serif); font-size: 30px; font-weight: 500;
  margin: 0 0 6px; letter-spacing: -.01em; line-height: 1.1;
}
.ml-promo h3 em { color: #d4af37; font-style: italic; }
.ml-promo p { color: #c4bba7; margin: 0; font-size: 14.5px; max-width: 540px; }
.ml-promo__cta {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 14px 22px;
  background: #d4af37; color: #14110b;
  font-family: var(--mono); font-size: 10px; letter-spacing: .2em;
  text-transform: uppercase; font-weight: 700;
  white-space: nowrap;
  transition: background .2s;
}
.ml-promo__cta:hover { background: #f0ead9; }
/* v15.55 — card body premium */
.koll-item__body {
  display: flex; justify-content: space-between; align-items: flex-start;
  padding: 18px 20px 8px; gap: 14px;
}
.koll-item__name { font-family: var(--serif); font-size: 19px; color: var(--ink); margin: 0 0 4px; font-weight: 500; line-height: 1.2; letter-spacing: -.005em; }
.koll-item__sub { font-size: 10.5px; color: var(--ink-mute); font-family: var(--mono); letter-spacing: 0.1em; text-transform: uppercase; font-weight: 600; }
.koll-item__price { font-family: var(--mono); color: var(--gold-dark, #9d6e1f); font-size: 12.5px; letter-spacing: 0.04em; text-align: right; white-space: nowrap; font-weight: 700; }
.koll-item__price small { color: var(--ink-mute); display: block; font-size: 9.5px; font-weight: 500; margin-top: 2px; letter-spacing: .06em; }

.koll-item__meta-bar {
  display: flex; gap: 10px; padding: 10px 20px 16px;
  font-family: var(--mono); font-size: 9.5px; letter-spacing: 0.14em;
  color: var(--ink-mute); text-transform: uppercase;
  border-top: 1px solid var(--line);
  margin-top: 4px;
  padding-top: 12px;
}
.koll-item__meta-bar span { padding: 3px 7px; background: var(--bg-2, #faf6ec); border-radius: 3px; }
.koll-item__meta-bar span::before { content: '· '; margin-right: 6px; color: var(--line-2); }
.koll-item__meta-bar span:first-child::before { display: none; }
.koll-pagination {
  display: flex; gap: 6px; justify-content: center; align-items: center;
  margin: 72px 0 32px; flex-wrap: wrap;
  font-family: var(--mono); font-size: 12px; letter-spacing: .14em; text-transform: uppercase;
}
.koll-pagination a, .koll-pagination span > span.current {
  display: inline-block; padding: 12px 18px; border: 1px solid var(--line);
  color: var(--ink-2); text-decoration: none; transition: all .2s; background: transparent;
}
.koll-pagination a:hover { border-color: var(--ink); color: var(--ink); background: var(--bg-2); }
.koll-pagination .current { background: var(--ink); color: var(--bg); border-color: var(--ink); }
.koll-pagination .dots { padding: 12px 6px; color: var(--ink-mute); border: 0; }

@media (max-width: 1024px) {
  .koll-layout { grid-template-columns: 1fr; gap: 40px; }
  .sidebar { position: static; max-height: none; }
  .koll-grid-full { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
  .koll-grid-full { grid-template-columns: 1fr; }
}

/* ===== modell.html ===== */
/* ============ MODELL-SPEZIFISCH ============ */
.m-tab-nav { display:flex; flex-direction:column; gap:2px; }
.m-tab-btn {
  display:block; width:100%; text-align:left;
  padding:16px 20px;
  background:#fff; border:1px solid var(--line);
  font-family:var(--mono); font-size:11px; letter-spacing:.2em;
  text-transform:uppercase; color:var(--ink-mute);
  cursor:pointer; transition:all .15s;
}
.m-tab-btn:hover { color:var(--ink); border-color:var(--gold); }
.m-tab-btn--active { background:var(--ink); color:var(--bg); border-color:var(--ink); }
.m-tab-btn__sub { display:block; font-family:var(--serif); font-style:italic; font-size:13px; letter-spacing:0; text-transform:none; margin-top:4px; color:var(--gold); font-weight:400; }
.m-tab-btn--active .m-tab-btn__sub { color:var(--gold-light); }

.m-tab { display:none; }
.m-tab--active { display:block; }

.m-spec-table { width:100%; border-collapse:collapse; }
.m-spec-table td { padding:16px 0; border-bottom:1px solid var(--line); vertical-align:top; }
.m-spec-table td:first-child { color:var(--ink-mute); font-size:15px; width:44%; padding-right:24px; }
.m-spec-table td:last-child { font-family:var(--serif); font-size:18px; color:var(--ink); }
.m-spec-table .m-row--hl td:last-child { color:var(--gold); font-weight:500; }
.m-spec-table .m-row--last td { border-bottom:2px solid var(--ink); }

/* ============================================================
   .sp-tech — single-product spec, 4 grouped sections (light variant of .nl-tech)
   2026-05-04 — replaces the long .m-spec-table on PDP for readability
   ============================================================ */

.sp-tech__group {
  margin-top: 56px;
  padding-top: 40px;
  border-top: 1px solid var(--line-2);
}
.sp-tech__group:first-of-type { margin-top: 56px; }

.sp-tech__head {
  display: grid; grid-template-columns: auto 1fr; gap: 24px;
  align-items: start; margin-bottom: 28px;
}
.sp-tech__num {
  font-family: var(--serif); font-size: 56px; font-weight: 400;
  line-height: 1; color: var(--ink-mute); letter-spacing: -0.02em;
  font-feature-settings: "lnum"; opacity: .55;
}
.sp-tech__num--gold { color: var(--gold); opacity: 1; }
.sp-tech__label {
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.22em;
  text-transform: uppercase; color: var(--gold); margin-bottom: 8px; font-weight: 500;
}
.sp-tech__label--gold { color: var(--gold); }
.sp-tech__title {
  font-family: var(--serif); font-size: 28px; font-weight: 500;
  color: var(--ink); margin: 0; letter-spacing: -0.01em; line-height: 1.25;
}

.sp-tech__grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 1px;
  background: var(--line-2); border: 1px solid var(--line-2);
}
.sp-tech__cell {
  display: flex; flex-direction: column; gap: 10px;
  padding: 22px 26px; background: #fff;
  transition: background 200ms ease;
}
.sp-tech__cell:hover { background: var(--bg-2); }
.sp-tech__cell--accent {
  background: linear-gradient(135deg, rgba(212,175,55,0.08) 0%, #fff 100%);
  border-left: 3px solid var(--gold);
  padding-left: 23px;
}
.sp-tech__k {
  font-family: var(--mono); font-size: 12px; letter-spacing: 0.16em;
  text-transform: uppercase; color: #5a5142; font-weight: 600;  /* z #7a7160 → #5a5142 (7:1) */
}
.sp-tech__v {
  font-family: var(--serif); font-size: 19px; line-height: 1.4;
  color: var(--ink); font-weight: 400;
}
.sp-tech__v sub { font-size: 12px; }
.sp-tech__v--mono {
  font-family: var(--mono); font-size: 15px;
  letter-spacing: 0.04em; color: var(--ink); font-weight: 600;
}
.sp-tech__sub {
  font-family: var(--serif); font-size: 13.5px;
  color: #5a5142; line-height: 1.5;
  margin-top: 2px;
}
.sp-tech__pill {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 10px;
  font-family: var(--mono); font-size: 10.5px;
  letter-spacing: 0.14em; text-transform: uppercase; font-weight: 700;
  border-radius: 3px;
}
.sp-tech__pill--ok {
  background: #e8f3ea; color: #2a6b3a;
  border: 1px solid #c5e3cc;
}
.sp-tech__pill--ok::before {
  content: ''; width: 6px; height: 6px; border-radius: 50%;
  background: #3a8c4f;
  box-shadow: 0 0 0 2px rgba(58,140,79,.2);
}
.sp-tech__cell--accent .sp-tech__v { color: var(--gold); font-weight: 500; }

/* SAFETY: jeśli grupa ma odd-number cells (np. tylko 1 wartość), ostatni zajmuje pełną szerokość żeby nie było pustego beż-tła */
.sp-tech__grid > .sp-tech__cell:only-child { grid-column: 1 / -1; }
.sp-tech__grid > .sp-tech__cell:nth-child(odd):last-child { grid-column: 1 / -1; }

/* Garantie group — premium plate */
.sp-tech__group--garantie {
  margin-top: 72px; padding-top: 48px;
  border-top: 2px solid var(--gold);
  position: relative;
}
.sp-tech__group--garantie::before {
  content: "★"; position: absolute; top: -14px; left: 0;
  width: 28px; height: 28px; background: var(--bg-2);
  color: var(--gold); display: grid; place-items: center;
  font-size: 16px; line-height: 1;
}
.sp-tech__warranty {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px;
  background: var(--gold); border: 1px solid var(--gold); margin-top: 8px;
}
.sp-tech__group--garantie .sp-tech__warranty:has(> :nth-child(3):last-child) {
  grid-template-columns: repeat(3, 1fr);
}
.sp-warr {
  background: linear-gradient(180deg, #fff 0%, var(--bg-2) 100%);
  padding: 36px 24px 32px; text-align: center;
  display: flex; flex-direction: column; align-items: center; gap: 4px;
}
.sp-warr__n {
  font-family: var(--serif); font-size: 72px; font-weight: 400;
  color: var(--ink); line-height: 1; letter-spacing: -0.04em;
  font-feature-settings: "lnum";
}
.sp-warr__u {
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.22em;
  text-transform: uppercase; color: var(--gold); margin-top: 12px; font-weight: 500;
}
.sp-warr__t {
  font-family: var(--serif); font-size: 16px; color: var(--ink-dim);
  font-style: italic; margin-top: 6px; line-height: 1.3;
}

/* Tablet */
@media (max-width: 980px) {
  .sp-tech__head { gap: 18px; margin-bottom: 24px; }
  .sp-tech__num { font-size: 44px; }
  .sp-tech__title { font-size: 22px; }
  .sp-tech__warranty { grid-template-columns: repeat(2, 1fr); }
  .sp-warr__n { font-size: 60px; }
}

/* Mobile */
@media (max-width: 640px) {
  .sp-tech__group { margin-top: 40px; padding-top: 28px; }
  .sp-tech__group--garantie { margin-top: 48px; padding-top: 36px; }
  .sp-tech__head { gap: 14px; margin-bottom: 20px; }
  .sp-tech__num { font-size: 36px; }
  .sp-tech__title { font-size: 19px; }
  .sp-tech__grid { grid-template-columns: 1fr; }
  .sp-tech__cell { padding: 18px 20px; gap: 8px; }
  .sp-tech__v { font-size: 17px; }
  .sp-tech__warranty { grid-template-columns: repeat(2, 1fr); }
  .sp-warr { padding: 28px 16px 24px; }
  .sp-warr__n { font-size: 52px; }
  .sp-warr__t { font-size: 14px; }
}

.m-step {
  display:grid; grid-template-columns: 80px 1fr;
  gap:32px; padding:32px 0;
  border-top:1px solid var(--line);
}
.m-step:last-child { border-bottom:1px solid var(--line); }
.m-step__num {
  font-family:var(--serif); font-size:52px; font-weight:500;
  color:var(--gold); line-height:.9; font-style:italic;
}
.m-step__title {
  font-family:var(--serif); font-size:24px; margin:0 0 10px;
  font-weight:500; color:var(--ink);
}
.m-step__meta {
  font-family:var(--mono); font-size:10px; letter-spacing:.2em;
  color:var(--ink-mute); text-transform:uppercase; margin-bottom:14px;
}
.m-step__body { font-size:15px; line-height:1.7; color:var(--ink-dim); }
.m-step__body p { margin:0 0 10px; }
.m-step__body strong { color:var(--ink); font-weight:600; }

.m-cert {
  display:grid; grid-template-columns:180px 1fr auto; gap:32px;
  padding:28px 0; border-bottom:1px solid var(--line);
  align-items:start;
}
.m-cert__logo {
  aspect-ratio:1; background:var(--ink); color:var(--gold);
  display:flex; align-items:center; justify-content:center;
  font-family:var(--serif); font-size:32px; font-style:italic; font-weight:500;
}
.m-cert__title { font-family:var(--serif); font-size:22px; margin:0 0 6px; font-weight:500; }
.m-cert__no { font-family:var(--mono); font-size:10px; letter-spacing:.15em; color:var(--gold); text-transform:uppercase; }
.m-cert__desc { font-size:14px; line-height:1.65; color:var(--ink-dim); margin-top:12px; max-width:520px; }
.m-cert__date { font-family:var(--mono); font-size:11px; color:var(--ink-mute); text-align:right; }

.m-vs {
  display:grid; grid-template-columns:1fr 1fr 1fr 1fr;
  gap:0; background:var(--line); border:1px solid var(--line);
}
.m-vs__col { background:#fff; padding:32px 24px; }
.m-vs__col--us { background:var(--ink); color:var(--bg); }
.m-vs__head {
  font-family:var(--mono); font-size:10px; letter-spacing:.15em;
  color:var(--ink-mute); text-transform:uppercase; margin-bottom:10px;
}
.m-vs__col--us .m-vs__head { color:var(--gold); }
.m-vs__name {
  font-family:var(--serif); font-size:22px; font-weight:500; margin:0 0 20px;
  color:inherit;
}
.m-vs__row {
  display:flex; justify-content:space-between;
  padding:10px 0; border-top:1px solid var(--line);
  font-size:13px; gap:12px;
}
.m-vs__col--us .m-vs__row { border-top-color:#2a241a; }
.m-vs__row span:first-child { color:inherit; opacity:.65; }
.m-vs__row strong { font-weight:600; text-align:right; }

.m-pflege {
  display:grid; grid-template-columns:repeat(4,1fr); gap:1px;
  background:var(--line); border:1px solid var(--line);
}
.m-pflege__item { background:#fff; padding:32px 24px; }
.m-pflege__num { font-family:var(--serif); font-size:40px; color:var(--gold); font-weight:500; font-style:italic; line-height:1; }
.m-pflege__title { font-family:var(--serif); font-size:20px; margin:14px 0 8px; font-weight:500; }
.m-pflege__body { font-size:13px; line-height:1.6; color:var(--ink-dim); }

.m-usecase {
  display:grid; grid-template-columns:1fr 2fr; gap:40px;
  padding:36px 0; border-top:1px solid var(--line);
  align-items:start;
}
.m-usecase:last-child { border-bottom:1px solid var(--line); }
.m-usecase__img {
  aspect-ratio: 4/3;
  background-size: cover; background-position: center;
  position: relative;
}
.m-usecase__img::after {
  content: attr(data-tag);
  position: absolute; bottom: 12px; left: 12px;
  background: rgba(0,0,0,.8); color: #fff;
  padding: 6px 10px; font-family: var(--mono);
  font-size: 10px; letter-spacing: .15em; font-weight: 700;
}
.m-usecase__title { font-family:var(--serif); font-size:28px; margin:0 0 8px; font-weight:500; }
.m-usecase__eyebrow { font-family:var(--mono); font-size:10px; letter-spacing:.2em; text-transform:uppercase; color:var(--gold); margin-bottom:6px; }
.m-usecase__body { font-size:15px; line-height:1.7; color:var(--ink-dim); margin:12px 0 18px; }
.m-usecase__specs { display:flex; gap:24px; flex-wrap:wrap; font-family:var(--mono); font-size:11px; color:var(--ink-mute); letter-spacing:.1em; text-transform:uppercase; padding-top:14px; border-top:1px solid var(--line); }
.m-usecase__specs strong { color:var(--ink); font-family:var(--serif); font-style:italic; font-size:14px; letter-spacing:0; text-transform:none; font-weight:500; }

.m-faq details {
  border-bottom: 1px solid var(--line);
  padding: 22px 0;
}
.m-faq summary {
  list-style: none; cursor: pointer;
  display: flex; justify-content: space-between; align-items: start; gap: 24px;
  font-family: var(--serif); font-size: 20px; font-weight: 500;
  color: var(--ink);
}
.m-faq summary::-webkit-details-marker { display: none; }
.m-faq summary::after {
  content: '+'; font-family: var(--serif); font-size: 28px;
  color: var(--gold); transition: transform .2s;
  line-height: .7;
}
.m-faq details[open] summary::after { transform: rotate(45deg); }
.m-faq-body { padding-top: 14px; color: var(--ink-dim); line-height: 1.75; font-size: 15px; max-width: 860px; }
.m-faq-body p { margin: 0 0 10px; }

.m-inline-cta {
  display:inline-flex; align-items:center; gap:12px;
  padding:14px 24px; background:var(--gold); color:var(--ink);
  font-family:var(--mono); font-size:11px; letter-spacing:.2em; text-transform:uppercase;
  font-weight:700; text-decoration:none;
  margin-top:20px;
}
.m-inline-cta:hover { background:var(--ink); color:var(--gold); }

.m-metric {
  display:grid; grid-template-columns:repeat(4,1fr); gap:0;
  border-top:1px solid var(--line); border-bottom:1px solid var(--line);
  margin:48px 0;
}
.m-metric__item { padding:32px 28px; border-right:1px solid var(--line); }
.m-metric__item:last-child { border-right:0; }
.m-metric__v { font-family:var(--serif); font-size:48px; color:var(--ink); font-weight:500; line-height:1; }
.m-metric__v em { color:var(--gold); font-style:italic; }
.m-metric__l { font-family:var(--mono); font-size:10px; letter-spacing:.15em; color:var(--ink-mute); text-transform:uppercase; margin-top:10px; }
.m-metric__sub { font-size:13px; color:var(--ink-dim); margin-top:6px; line-height:1.5; }

/* ===== ueber-uns.html ===== */

/* ===== faq.html ===== */
.faq-item {
  border-bottom: 1px solid var(--line);
  padding: 28px 0;
}
.faq-item summary {
  list-style: none; cursor: pointer;
  display: grid; grid-template-columns: 56px 1fr 32px;
  gap: 24px; align-items: start;
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-num {
  font-family: var(--serif); font-style: italic; font-size: 28px;
  color: var(--gold); font-weight: 500; line-height: 1;
}
.faq-q {
  font-family: var(--serif); font-size: 24px;
  line-height: 1.3; color: var(--ink); font-weight: 500;
  margin: 0;
}
.faq-toggle {
  font-family: var(--serif); font-size: 32px;
  color: var(--ink-mute); font-weight: 300;
  line-height: .6; text-align: right;
  transition: transform .2s;
}
.faq-item[open] .faq-toggle { transform: rotate(45deg); color: var(--gold); }
.faq-answer {
  color: var(--ink-dim); line-height: 1.7;
  padding: 20px 0 8px 80px;
  font-size: 16px;
  max-width: 900px;
}
.faq-answer p { margin: 0 0 14px; }
.faq-answer strong { color: var(--ink); font-weight: 600; }

/* ===== kontakt.html ===== */
        .chip { padding:10px 18px; background:transparent; color:var(--ink-dim); border:1.5px solid var(--line-2); font-family:var(--mono); font-size:11px; letter-spacing:.15em; cursor:pointer; transition:all .15s; }
        .chip:hover { border-color:var(--ink); color:var(--ink); }
        .chip.is-active { background:var(--ink); color:var(--bg); border-color:var(--ink); }
        .k-upload { border:2px dashed var(--line-2); padding:24px; text-align:center; cursor:pointer; transition:all .15s; background:var(--bg-2); }
        .k-upload:hover { border-color:var(--gold); background:#fff; }
        .k-upload.is-drag { border-color:var(--gold); background:#fff8e8; }
        .k-file-list { display:flex; flex-direction:column; gap:8px; margin-top:12px; }
        .k-file-item { display:flex; justify-content:space-between; align-items:center; padding:10px 14px; background:#fff; border:1px solid var(--line); font-size:13px; font-family:var(--mono); }
        .k-file-item button { background:none; border:0; color:var(--ink-mute); cursor:pointer; font-family:var(--mono); font-size:11px; letter-spacing:.1em; }
        .k-file-item button:hover { color:#c00; }

/* ===== konfigurator.html ===== */
/* ============================================================
   KONFIGURATOR · V4 STYLES
   Bazuje na site/style.css (tokens + nav + typografia)
   ============================================================ */

:root {
  --k-bg: #f4efe3;
  --k-bg-2: #ebe5d3;
  --k-bg-dark: #1a1714;
  --k-bg-dark-2: #0f0d0b;
  --k-ink: #1a1714;
  --k-ink-2: #3a332a;
  --k-ink-mute: #6a6456;
  --k-ink-dim: #8a8470;
  --k-gold: #c9a961;
  --k-gold-2: #a88845;
  --k-gold-light: #e4cd98;
  --k-line: #d4c9aa;
  --k-line-2: #b8a878;
  --k-green: #55703a;
  --k-red: #8a4535;
}

body.k3 {
  background: var(--k-bg);
  color: var(--k-ink);
  font-family: 'Inter', -apple-system, sans-serif;
  margin: 0;
  line-height: 1.5;
}

/* ====== SHARED TYPOGRAPHY ====== */
.k3 em { font-family: 'Cormorant Garamond', serif; font-style: italic; font-weight: 500; color: var(--k-gold); }

/* ====== STATUS BANNER ====== */
.k3-status {
  position: sticky;
  top: 76px; /* below global .nav (height 76) */
  z-index: 50;
  background: #fff;
  border-bottom: 1px solid var(--k-line);
  box-shadow: 0 2px 8px rgba(0,0,0,.06);
  margin-top: 0;
}
@media (max-width: 720px) {
  .k3-status { top: 64px; }
}
.k3-status__inner {
  max-width: 1600px; margin: 0 auto;
  padding: 14px 28px;
  display: flex; align-items: center; gap: 20px;
}
.k3-status__now {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; font-weight: 700;
  letter-spacing: .2em; text-transform: uppercase;
  color: #fff; background: var(--k-ink);
  padding: 6px 12px; border-left: 3px solid var(--k-gold);
  flex-shrink: 0;
}
.k3-status__text {
  flex: 1; font-size: 14px; color: var(--k-ink-2);
}
.k3-status__text strong { color: var(--k-ink); font-weight: 600; }
.k3-status__help {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; font-weight: 700;
  letter-spacing: .15em; text-transform: uppercase;
  padding: 8px 14px; border: 1px solid var(--k-line-2);
  background: transparent; color: var(--k-ink-2);
  cursor: pointer; flex-shrink: 0;
}
.k3-status__help:hover { background: var(--k-gold); color: #fff; border-color: var(--k-gold); }

/* ====== STEPPER ====== */
.k3-stepper {
  max-width: 1600px; margin: 0 auto;
  padding: 20px 28px 0;
  display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px;
}
.k3-step {
  background: #fff; border: 1px solid var(--k-line);
  padding: 14px 16px; cursor: pointer;
  text-align: left; transition: all .2s;
  display: flex; flex-direction: column; gap: 4px;
  position: relative;
}
.k3-step:hover { border-color: var(--k-gold); }
.k3-step--active {
  background: var(--k-ink); color: #fff;
  border-color: var(--k-ink);
}
.k3-step--active::before {
  content: ""; position: absolute; left: 0; top: 0;
  width: 3px; height: 100%; background: var(--k-gold);
}
.k3-step__head { display: flex; align-items: center; gap: 10px; }
.k3-step__num {
  font-family: 'Cormorant Garamond', serif;
  font-size: 24px; line-height: 1;
  color: var(--k-gold); font-weight: 500;
  font-style: italic;
}
.k3-step__label {
  font-family: 'JetBrains Mono', monospace;
  font-size: 9px; letter-spacing: .18em;
  text-transform: uppercase; font-weight: 700;
  color: var(--k-ink-mute);
}
.k3-step--active .k3-step__label { color: var(--k-gold-light); }
.k3-step__title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 17px; font-weight: 500;
}
.k3-step--active .k3-step__title { color: #fff; }
.k3-step__val {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; color: var(--k-gold);
  margin-top: 2px; letter-spacing: .05em;
}

/* ====== MAIN GRID ====== */
.k3-main {
  max-width: 1600px; margin: 0 auto;
  padding: 24px 28px 200px;
  display: grid; grid-template-columns: 1fr 420px; gap: 28px;
}
.k3-left {
  background: #fff;
  border: 1px solid var(--k-line);
  padding: 40px;
}

/* ====== PANEL ====== */
.k3-panel { display: none; }
.k3-panel--active { display: block; animation: panelIn .3s; }
@keyframes panelIn { from { opacity: 0; transform: translateY(8px);} to { opacity: 1; transform: translateY(0);} }

/* ====== INTRO ====== */
.k3-intro {
  display: flex; gap: 24px; margin-bottom: 32px;
  padding-bottom: 28px; border-bottom: 1px solid var(--k-line);
}
.k3-intro__num {
  font-family: 'Cormorant Garamond', serif;
  font-size: 96px; line-height: .85; font-weight: 400;
  color: var(--k-gold); font-style: italic;
  padding-right: 28px; border-right: 1px solid var(--k-line-2);
}
.k3-intro__body { flex: 1; }
.k3-intro__eyebrow {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: .25em;
  font-weight: 700; color: var(--k-gold);
  text-transform: uppercase; margin-bottom: 8px;
}
.k3-intro__title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 42px; font-weight: 500; line-height: 1.05;
  margin: 0 0 12px; letter-spacing: -.02em;
}
.k3-intro__sub {
  font-size: 15px; color: var(--k-ink-2);
  line-height: 1.55; max-width: 620px; margin: 0;
}

/* ====== HOW-TO BOX ====== */
.k3-howto {
  display: flex; gap: 16px;
  padding: 18px 20px;
  background: var(--k-bg-2);
  border-left: 4px solid var(--k-gold);
  margin-bottom: 28px;
}
.k3-howto__icon {
  width: 36px; height: 36px;
  background: var(--k-ink); color: var(--k-gold);
  font-family: 'Cormorant Garamond', serif;
  font-size: 20px; font-weight: 500; font-style: italic;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.k3-howto__title {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: .18em;
  font-weight: 700; color: var(--k-gold-2);
  text-transform: uppercase; margin-bottom: 4px;
}
.k3-howto__text { font-size: 13px; color: var(--k-ink-2); line-height: 1.55; }

/* ====== CATEGORY TABS ====== */
.k3-cat-tabs {
  display: flex; flex-wrap: wrap; gap: 0;
  margin-bottom: 20px; border-bottom: 2px solid var(--k-line);
}
.k3-cat-tab {
  background: transparent; border: 0;
  padding: 14px 18px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; letter-spacing: .1em;
  font-weight: 700; color: var(--k-ink-mute);
  text-transform: uppercase; cursor: pointer;
  border-bottom: 3px solid transparent;
  margin-bottom: -2px;
  display: flex; align-items: center; gap: 8px;
}
.k3-cat-tab span {
  background: var(--k-bg-2); color: var(--k-ink);
  padding: 2px 8px; font-size: 10px;
}
.k3-cat-tab:hover { color: var(--k-ink); }
.k3-cat-tab--active {
  color: var(--k-ink); border-bottom-color: var(--k-gold);
}
.k3-cat-tab--active span { background: var(--k-gold); color: #fff; }

/* ====== MODEL GRID ====== */
.k3-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px;
}
.k3-card {
  background: #fff; border: 1px solid var(--k-line);
  padding: 0; text-align: left; cursor: pointer;
  transition: all .2s; position: relative;
  overflow: hidden;
}
.k3-card:hover { border-color: var(--k-gold); transform: translateY(-2px); box-shadow: 0 8px 20px rgba(0,0,0,.08); }
.k3-card--sel {
  border: 2px solid var(--k-ink); outline: 3px solid var(--k-gold);
  outline-offset: -6px;
}
.k3-card__img {
  width: 100%; aspect-ratio: 4/3;
  background-size: cover; background-position: center;
  background-color: #ddd;
  border-bottom: 1px solid var(--k-line);
}
.k3-card__body { padding: 14px 16px; }
.k3-card__num {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: .15em;
  font-weight: 700; color: var(--k-gold-2);
  text-transform: uppercase; margin-bottom: 6px;
  display: flex; justify-content: space-between;
}
.k3-card__grp {
  background: var(--k-ink); color: var(--k-gold);
  padding: 2px 6px; font-size: 9px;
}
.k3-card__name {
  font-family: 'Cormorant Garamond', serif;
  font-size: 20px; font-weight: 500; color: var(--k-ink);
  margin-bottom: 4px;
}
.k3-card__desc { font-size: 12px; color: var(--k-ink-mute); line-height: 1.45; }
.k3-card__badge {
  position: absolute; top: 10px; left: 10px;
  background: var(--k-gold); color: #fff;
  padding: 4px 10px; font-family: 'JetBrains Mono', monospace;
  font-size: 9px; letter-spacing: .15em;
  font-weight: 700; text-transform: uppercase;
}
.k3-card__check {
  position: absolute; top: 0; left: 0; right: 0;
  background: var(--k-ink); color: var(--k-gold);
  padding: 6px 12px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: .18em; font-weight: 700;
  text-align: center;
}
.k3-card__check::before { content: "✓  MANUELL GEWÄHLT"; }
.k3-card--sel .k3-card__img { margin-top: 28px; }

/* ====== BIG-OPT (sided, painting) ====== */
.k3-big-opts { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.k3-big-opts--3 { grid-template-columns: 1fr 1fr 1fr; }
.k3-big-opt {
  display: flex; gap: 20px;
  padding: 24px;
  background: #fff;
  border: 1px solid var(--k-line);
  cursor: pointer; text-align: left;
  transition: all .2s;
  position: relative;
  align-items: flex-start;
}
.k3-big-opt:hover { border-color: var(--k-gold); }
.k3-big-opt--disabled {
  opacity: .45;
  cursor: not-allowed;
  pointer-events: none;
  background: repeating-linear-gradient(135deg, var(--k-bg) 0 8px, var(--k-bg-2) 8px 16px);
}
.k3-big-opt--disabled:hover { border-color: var(--k-rule); }
.k3-big-opt--sel {
  border: 2px solid var(--k-ink);
  background: var(--k-bg-2);
  outline: 3px solid var(--k-gold);
  outline-offset: -6px;
}
.k3-big-opt__icon {
  width: 56px; height: 56px;
  background: var(--k-ink); color: var(--k-gold);
  font-family: 'Cormorant Garamond', serif;
  font-size: 28px; font-weight: 500; font-style: italic;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.k3-big-opt__main { flex: 1; }
.k3-big-opt__head {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: 16px; margin-bottom: 8px;
}
.k3-big-opt__title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 24px; font-weight: 500; color: var(--k-ink);
}
.k3-big-opt__price {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; letter-spacing: .1em;
  font-weight: 700; color: var(--k-gold-2);
  text-transform: uppercase;
}
.k3-big-opt__desc { font-size: 13px; color: var(--k-ink-2); line-height: 1.55; }
.k3-big-opt__check {
  position: absolute; top: 0; left: 0; right: 0;
  background: var(--k-ink); color: var(--k-gold);
  padding: 6px 14px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: .18em; font-weight: 700;
  text-transform: uppercase;
  display: flex; align-items: center; justify-content: space-between;
}
.k3-big-opt__check::before { content: "✓  MANUELL GEWÄHLT"; }
.k3-big-opt--sel { padding-top: 52px; }

/* ====== HEIGHT GRID ====== */
.k3-heights { display: grid; grid-template-columns: repeat(6, 1fr); gap: 10px; margin-bottom: 32px; }
.k3-h-opt {
  background: #fff; border: 1px solid var(--k-line);
  padding: 18px 10px; cursor: pointer; text-align: center;
  transition: all .2s; position: relative;
}
.k3-h-opt:hover { border-color: var(--k-gold); }
.k3-h-opt--sel { background: var(--k-ink); color: #fff; border-color: var(--k-ink); }
.k3-h-opt__v {
  font-family: 'Cormorant Garamond', serif;
  font-size: 32px; font-weight: 500; line-height: 1;
}
.k3-h-opt__v span { font-size: 13px; color: var(--k-gold); margin-left: 2px; }
.k3-h-opt--sel .k3-h-opt__v span { color: var(--k-gold-light); }
.k3-h-opt__m {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: .05em;
  color: var(--k-ink-mute); margin-top: 4px;
}
.k3-h-opt--sel .k3-h-opt__m { color: var(--k-gold-light); }
.k3-h-opt__tag {
  position: absolute; top: -8px; right: 8px;
  background: var(--k-gold); color: #fff;
  padding: 2px 6px; font-family: 'JetBrains Mono', monospace;
  font-size: 9px; font-weight: 700; letter-spacing: .1em;
}

/* ====== SECTION TITLE ====== */
.k3-sec-title {
  display: flex; align-items: baseline; gap: 14px;
  margin: 32px 0 16px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--k-line);
}
.k3-sec-title__n {
  font-family: 'Cormorant Garamond', serif;
  font-size: 24px; color: var(--k-gold); font-style: italic;
}
.k3-sec-title__name {
  font-family: 'Cormorant Garamond', serif;
  font-size: 22px; font-weight: 500; color: var(--k-ink);
}
.k3-sec-title__hint {
  flex: 1; font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: .15em;
  color: var(--k-ink-mute); text-transform: uppercase;
  text-align: right;
}

/* ====== COLORS ====== */
.k3-color-group { margin-bottom: 24px; }
.k3-color-group__title {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; letter-spacing: .18em;
  font-weight: 700; color: var(--k-gold-2);
  text-transform: uppercase; margin-bottom: 10px;
}
.k3-color-group__title span {
  color: var(--k-ink-mute); font-weight: 400; letter-spacing: .05em;
  text-transform: none; margin-left: 6px;
}
.k3-color-grid {
  display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px;
}
.k3-color {
  background: #fff; border: 1px solid var(--k-line);
  padding: 8px; cursor: pointer; position: relative;
  transition: all .2s;
}
.k3-color:hover { border-color: var(--k-gold); }
.k3-color--sel { border: 2px solid var(--k-ink); outline: 2px solid var(--k-gold); outline-offset: -4px; }
.k3-color__sw {
  width: 100%; aspect-ratio: 3/2;
  border: 1px solid rgba(0,0,0,.1);
  margin-bottom: 6px;
}
.k3-color__n { font-size: 11px; color: var(--k-ink-2); line-height: 1.3; }
.k3-color__ok {
  position: absolute; top: 4px; right: 4px;
  width: 22px; height: 22px;
  background: var(--k-ink); color: var(--k-gold);
  display: flex; align-items: center; justify-content: center;
  font-size: 12px; font-weight: 700;
}

/* ====== ACCESSORIES ====== */
.k3-acc-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.k3-acc {
  background: #fff; border: 1px solid var(--k-line);
  padding: 16px; transition: all .2s;
}
.k3-acc--sel { border-color: var(--k-gold); background: var(--k-bg-2); }
.k3-acc__head {
  display: flex; justify-content: space-between; gap: 16px;
  align-items: flex-start; margin-bottom: 10px;
}
.k3-acc__name {
  font-family: 'Cormorant Garamond', serif;
  font-size: 17px; font-weight: 500; color: var(--k-ink);
}
.k3-acc__desc { font-size: 12px; color: var(--k-ink-mute); margin-top: 2px; }
.k3-acc__price {
  font-family: 'Cormorant Garamond', serif;
  font-size: 20px; font-weight: 500; color: var(--k-gold-2);
  white-space: nowrap;
}
.k3-acc__price span { font-size: 11px; color: var(--k-ink-mute); }
.k3-acc__qty {
  display: flex; align-items: center; gap: 12px;
  padding-top: 10px; border-top: 1px solid var(--k-line);
}
.k3-acc__qty button {
  width: 32px; height: 32px; border: 1px solid var(--k-line-2);
  background: #fff; cursor: pointer; font-size: 18px;
  font-weight: 700; color: var(--k-ink);
}
.k3-acc__qty button:hover { background: var(--k-ink); color: #fff; }
.k3-acc__qty span {
  font-family: 'Cormorant Garamond', serif;
  font-size: 22px; font-weight: 500; min-width: 24px; text-align: center;
}
.k3-acc__sum {
  margin-left: auto; font-family: 'JetBrains Mono', monospace;
  font-size: 12px; font-weight: 700; color: var(--k-gold-2);
}

/* ====== MAP ====== */
.k3-mapsubtabs { display: flex; gap: 0; margin-bottom: 20px; border-bottom: 2px solid var(--k-line); }
.k3-mapsubtab {
  padding: 12px 20px; background: transparent; border: 0;
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; letter-spacing: .1em; font-weight: 700;
  color: var(--k-ink-mute); cursor: pointer;
  border-bottom: 3px solid transparent; margin-bottom: -2px;
  text-transform: uppercase;
}
.k3-mapsubtab--active { color: var(--k-ink); border-bottom-color: var(--k-gold); }

.k3-mapsearch {
  display: flex; gap: 8px; align-items: center;
  padding: 12px; background: var(--k-bg-2); margin-bottom: 0;
  border: 1px solid var(--k-line);
}
.k3-mapsearch input {
  flex: 1; padding: 10px 14px; border: 1px solid var(--k-line-2);
  background: #fff; font-size: 14px;
}
#k3-map { width: 100%; height: 480px; min-height: 320px; border: 1px solid var(--k-line); border-top: 0; position: relative; margin-bottom: 32px; }
.k3-map-resize {
  position: absolute; right: 0; bottom: 0;
  width: 36px; height: 36px;
  background: var(--k-ink); color: var(--k-gold);
  cursor: ns-resize; z-index: 500;
  display: flex; align-items: center; justify-content: center;
  font-size: 14px; letter-spacing: 2px;
  box-shadow: 0 0 0 2px #fff;
}
.k3-map-resize:hover { background: var(--k-gold); color: var(--k-ink); }
.k3-cursor-hint {
  position: absolute; z-index: 600;
  background: rgba(26,24,18,.92); color: #fff;
  padding: 6px 10px; pointer-events: none;
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: .15em; font-weight: 700;
  opacity: 0; transition: opacity .15s;
  text-transform: uppercase;
  box-shadow: 0 2px 8px rgba(0,0,0,.3);
}
.k3-cursor-hint--show { opacity: 1; }

/* ====== LAYER SWITCHER ====== */
.k3-layer-switcher {
  display: flex; align-items: center; gap: 6px;
  padding: 10px 12px;
  background: var(--k-bg-2);
  border: 1px solid var(--k-line);
  border-top: 0;
  flex-wrap: wrap;
}
.k3-layer-switcher__label {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: .15em;
  font-weight: 700; color: var(--k-ink-mute);
  text-transform: uppercase; margin-right: 6px;
}
.k3-layer-btn {
  padding: 7px 12px;
  background: #fff;
  border: 1px solid var(--k-line-2);
  color: var(--k-ink-2);
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: .1em; font-weight: 700;
  text-transform: uppercase; cursor: pointer;
  display: inline-flex; align-items: center; gap: 6px;
  transition: all .15s;
}
.k3-layer-btn:hover { border-color: var(--k-gold); color: var(--k-ink); }
.k3-layer-btn--active {
  background: var(--k-ink); color: var(--k-gold);
  border-color: var(--k-ink);
}
.k3-layer-btn__icon {
  font-size: 13px; line-height: 1;
}

.k3-maptools {
  display: flex; flex-direction: column; gap: 14px;
  padding: 16px; background: var(--k-ink);
  border: 1px solid var(--k-ink); border-top: 0;
}
.k3-tool-hint {
  color: #ede5cf; font-size: 13px; line-height: 1.65;
  padding: 14px 18px;
  background: #0e0b07; border-left: 3px solid var(--k-gold);
}
.k3-tool-hint strong { color: var(--k-gold); font-weight: 600; }
.k3-tool-hint__num {
  display: inline-block;
  font-family: 'JetBrains Mono', monospace;
  font-weight: 700; color: var(--k-gold);
  font-size: 11px; letter-spacing: .15em;
  margin-right: 4px; margin-left: 12px;
}
.k3-tool-hint__num:first-child { margin-left: 0; }
.k3-tool-actions {
  display: flex; gap: 10px; align-items: center; flex-wrap: wrap;
}
.k3-flash {
  position: absolute; left: 50%; top: 24px;
  transform: translate(-50%, -16px);
  background: rgba(26,24,18,.95); color: var(--k-gold);
  padding: 12px 22px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px; letter-spacing: .15em; font-weight: 700;
  text-transform: uppercase;
  opacity: 0; pointer-events: none;
  transition: opacity .25s, transform .25s;
  box-shadow: 0 8px 24px rgba(0,0,0,.4);
  border-left: 3px solid var(--k-gold);
  z-index: 700;
}
.k3-flash--show { opacity: 1; transform: translate(-50%, 0); }
#k3-mapwrap { position: relative; }
.k3-tool {
  padding: 8px 14px;
  background: transparent; border: 1px solid var(--k-line-2);
  color: var(--k-line); cursor: pointer;
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: .1em; font-weight: 700;
  text-transform: uppercase;
}
.k3-tool:hover { background: var(--k-gold); color: #fff; border-color: var(--k-gold); }
.k3-tool--active { background: var(--k-gold); color: #fff; border-color: var(--k-gold); }
.k3-tool--danger:hover { background: var(--k-red); border-color: var(--k-red); }
.k3-tool--divider { height: 20px; width: 1px; background: var(--k-line-2); border: 0; pointer-events: none; }
.k3-btn-sm {
  padding: 8px 14px; background: var(--k-ink); color: #fff;
  font-family: 'JetBrains Mono', monospace; font-size: 10px;
  font-weight: 700; letter-spacing: .1em; border: 0; cursor: pointer;
  text-transform: uppercase;
}
.k3-btn-sm--ghost { background: transparent; color: var(--k-ink); border: 1px solid var(--k-ink); }

.k3-length {
  margin-left: auto; display: flex; align-items: center; gap: 10px;
  padding: 6px 14px; background: var(--k-gold); color: var(--k-ink);
}
.k3-length__v {
  font-family: 'Cormorant Garamond', serif;
  font-size: 24px; font-weight: 500; line-height: 1;
}
.k3-length__l {
  font-family: 'JetBrains Mono', monospace;
  font-size: 9px; letter-spacing: .15em;
  font-weight: 700; text-transform: uppercase;
}

.k3-vertex {
  width: 38px; height: 38px; background: var(--k-gold);
  border: 4px solid #fff; border-radius: 50%;
  box-shadow: 0 4px 14px rgba(0,0,0,.55), 0 0 0 2px rgba(0,0,0,.25); cursor: grab;
  display: flex; align-items: center; justify-content: center;
  font-family: 'Cormorant Garamond', serif;
  font-size: 20px; font-weight: 700; color: #1a1812;
  line-height: 1;
}
.k3-vertex--first { 
  background: var(--k-green); color: #fff;
  animation: firstPulse 2s infinite; 
}
.k3-vertex--first:hover { transform: scale(1.15); cursor: pointer; }
.k3-vertex--last {
  box-shadow: 0 4px 14px rgba(0,0,0,.55), 0 0 0 6px rgba(201,169,97,.35);
}
@keyframes firstPulse { 
  0%,100% { box-shadow: 0 2px 8px rgba(0,0,0,.5), 0 0 0 0 rgba(85,112,58,.6);} 
  50% { box-shadow: 0 2px 8px rgba(0,0,0,.5), 0 0 0 14px rgba(85,112,58,0);} 
}
.leaflet-div-icon { background: transparent; border: 0; }

/* Segment length labels */
.k3-seglbl {
  display: inline-block;
  padding: 3px 8px;
  background: #1a1812;
  color: var(--k-gold);
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; font-weight: 700;
  letter-spacing: .04em;
  border: 1px solid var(--k-gold);
  border-radius: 2px;
  white-space: nowrap;
  box-shadow: 0 2px 6px rgba(0,0,0,.35);
}
.k3-seglbl--ghost {
  background: rgba(26,24,18,.85);
  color: #fff;
  border-color: rgba(201,169,97,.6);
  border-style: dashed;
}

/* Tooltip dla vertexów */
.leaflet-tooltip.k3-mt {
  background: #1a1812; color: var(--k-gold);
  border: 1px solid var(--k-gold);
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: .1em;
  font-weight: 700; text-transform: uppercase;
  padding: 3px 8px;
  box-shadow: 0 2px 6px rgba(0,0,0,.35);
}
.leaflet-tooltip.k3-mt::before { border-top-color: var(--k-gold); }

.k3-manual { display: none; }
.k3-inp-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.k3-inp { background: #fff; border: 1px solid var(--k-line); padding: 16px 18px 14px; position: relative; display:flex; flex-direction:column; min-height:104px; }
.k3-inp label {
  display: block; font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: .15em; font-weight: 700;
  color: var(--k-gold-2); text-transform: uppercase; margin-bottom: 10px;
}
.k3-inp input {
  width: 100%; border: 0; background: transparent;
  font-family: 'Cormorant Garamond', serif; font-size: 32px; font-weight: 500;
  color: var(--k-ink); outline: 0; padding-right: 90px;
}
.k3-inp-suffix {
  position: absolute; right: 18px; bottom: 14px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; color: var(--k-ink-mute); font-weight: 700;
}

/* ====== FORM ====== */
.k3-form {
  display: grid; grid-template-columns: 1fr 1fr; gap: 16px;
}
.k3-form label {
  display: block; font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: .15em; font-weight: 700;
  color: var(--k-gold-2); text-transform: uppercase; margin-bottom: 6px;
}
.k3-form input, .k3-form textarea {
  width: 100%; padding: 12px 14px;
  border: 1px solid var(--k-line); background: #fff;
  font-family: inherit; font-size: 15px;
}
.k3-form input:focus, .k3-form textarea:focus { outline: 0; border-color: var(--k-gold); }
.k3-form__row { grid-column: 1 / -1; }
.k3-time { display: flex; flex-wrap: wrap; gap: 8px; }
.k3-time .k3-tool { color: var(--k-ink); border-color: var(--k-line-2); background: #fff; }

/* ====== CHIPS (Rückruf-Zeitraum etc) ====== */
.k3-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.k3-chip {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; letter-spacing: .08em;
  font-weight: 700; text-transform: uppercase;
  padding: 11px 16px;
  border: 1.5px solid var(--k-line-2);
  background: #fff; color: var(--k-ink);
  cursor: pointer; transition: all .15s ease;
  white-space: nowrap;
}
.k3-chip:hover { border-color: var(--k-gold-2); background: var(--k-bg-2); }
.k3-chip--active {
  background: var(--k-ink); color: #fff;
  border-color: var(--k-ink);
  box-shadow: inset 0 0 0 2px var(--k-gold);
}

/* ====== UPLOAD ====== */
.k3-upload {
  border: 2px dashed var(--k-line-2);
  background: var(--k-bg-2);
  padding: 32px 24px;
  text-align: center;
  cursor: pointer;
  transition: all .2s;
}
.k3-upload:hover, .k3-upload.is-drag {
  border-color: var(--k-gold);
  background: #fff;
}
.k3-file-row {
  display: flex; justify-content: space-between; align-items: center;
  padding: 10px 14px; background: #fff; border: 1px solid var(--k-line);
  font-family: 'JetBrains Mono', monospace; font-size: 12px;
}
.k3-file-row button {
  background: none; border: 0; color: var(--k-ink-mute);
  cursor: pointer; font-family: inherit; font-size: 11px; letter-spacing: .1em;
}
.k3-file-row button:hover { color: #c00; }

/* ====== DISCLAIMER IN PRICE WIDGET ====== */
.k3-price__disclaimer {
  margin-top: 14px; padding: 10px 12px;
  border: 1px dashed rgba(201,169,97,.4);
  background: rgba(201,169,97,.08);
  font-family: 'Inter', sans-serif;
  font-size: 10.5px; line-height: 1.5;
  color: #d6cdb8; letter-spacing: .01em;
  text-align: left;
}

/* ====== LEGAL NOTICE (pod formularzem) ====== */
.k3-legal-notice {
  display: flex; gap: 16px;
  margin-top: 28px; padding: 20px 22px;
  background: #fffbe8;
  border: 1px solid #d4c9aa;
  border-left: 4px solid var(--k-gold-2);
}
.k3-legal-notice__ic {
  font-family: 'Cormorant Garamond', serif;
  font-size: 42px; line-height: 1;
  color: var(--k-gold-2); flex-shrink: 0;
  margin-top: -4px;
}
.k3-legal-notice__body {
  flex: 1; font-size: 13px; line-height: 1.65;
  color: var(--k-ink-2);
}
.k3-legal-notice__body strong {
  display: block; font-family: 'JetBrains Mono', monospace;
  font-size: 11px; letter-spacing: .12em;
  text-transform: uppercase; color: var(--k-ink);
  margin-bottom: 8px;
}
.k3-legal-notice__body strong:not(:first-child) {
  display: inline; text-transform: none; letter-spacing: 0;
  font-family: inherit; font-size: inherit; color: var(--k-ink);
  margin-bottom: 0;
}
.k3-time .k3-tool--active { color: #fff; }

/* ====== RIGHT PANEL ====== */
.k3-right { position: sticky; top: 150px; height: fit-content; }
.k3-side {
  background: var(--k-bg-dark);
  color: var(--k-bg); padding: 28px;
  border: 1px solid #2a2520;
}
.k3-side__title {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: .2em;
  font-weight: 700; color: var(--k-gold);
  text-transform: uppercase; margin-bottom: 6px;
}
.k3-side__subtitle {
  font-family: 'Cormorant Garamond', serif;
  font-size: 24px; font-weight: 500; color: #fff;
  margin-bottom: 20px;
}

/* ====== FENCE PREVIEW ====== */
.k3-preview {
  position: relative;
  aspect-ratio: 4/3;
  margin-bottom: 20px;
  background: #2a2520;
  overflow: hidden;
}
#k3-preview-fence {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
}
.k3-fence-img {
  position: absolute; inset: 0;
  background-size: cover; background-position: center;
}
.k3-fence-overlay {
  position: absolute; inset: 0;
  pointer-events: none; transition: all .3s;
}
.k3-fence-height-label {
  position: absolute; left: 10px; top: 10px;
  background: rgba(0,0,0,.7); color: var(--k-gold-light);
  padding: 6px 10px; font-family: 'JetBrains Mono', monospace;
  font-size: 11px; font-weight: 700; letter-spacing: .1em;
}
.k3-fence-twoside {
  position: absolute; right: 10px; top: 10px;
  background: var(--k-gold); color: var(--k-ink);
  padding: 6px 10px; font-family: 'JetBrains Mono', monospace;
  font-size: 10px; font-weight: 700; letter-spacing: .1em;
}
.k3-fence-colorchip {
  position: absolute; left: 10px; bottom: 56px;
  display: flex; align-items: center; gap: 8px;
  background: rgba(0,0,0,.82);
  padding: 7px 11px 7px 8px;
  border: 1px solid rgba(183,144,58,.3);
  backdrop-filter: blur(4px);
}
.k3-fence-colorchip__dot {
  width: 18px; height: 18px;
  border: 1px solid rgba(255,255,255,.35);
  box-shadow: 0 0 0 1px rgba(0,0,0,.5);
  flex-shrink: 0;
}
.k3-fence-colorchip__name {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; font-weight: 700;
  letter-spacing: .1em; text-transform: uppercase;
  color: var(--k-gold-light);
}
.k3-fence-placeholder {
  color: var(--k-gold); font-family: 'Cormorant Garamond', serif;
  font-size: 18px; font-style: italic; text-align: center;
  padding: 20px;
}
.k3-preview__label {
  position: absolute; bottom: 0; left: 0; right: 0;
  padding: 12px; background: linear-gradient(to top, rgba(0,0,0,.9), transparent);
  color: #fff; font-family: 'Cormorant Garamond', serif;
  font-size: 18px; font-weight: 500;
}
.k3-preview__tag {
  position: absolute; top: 10px; right: 10px;
  background: var(--k-red); color: #fff;
  padding: 4px 8px; font-family: 'JetBrains Mono', monospace;
  font-size: 9px; font-weight: 700; letter-spacing: .15em;
  animation: pulse 2s infinite;
  display: none;
}

/* ====== SUMMARY TABLE ====== */
.k3-sum { margin-bottom: 20px; }
.k3-sum__row {
  display: flex; justify-content: space-between;
  padding: 8px 0; border-bottom: 1px solid #2a2520;
  font-size: 13px;
}
.k3-sum__l {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: .15em;
  color: #8a7f66; text-transform: uppercase; font-weight: 700;
}
.k3-sum__v { color: #f0ead9; text-align: right; font-weight: 500; }
.k3-sum__v--gold { color: var(--k-gold-light); }
.k3-sum__row--dot { display: flex; align-items: center; gap: 8px; }
#sum-color-dot {
  width: 16px; height: 16px; border: 1px solid rgba(255,255,255,.2);
  flex-shrink: 0;
}

/* ====== PRICE BOX ====== */
.k3-price {
  padding: 20px;
  background: var(--k-bg-dark-2); color: var(--k-bg);
  position: relative; overflow: hidden;
  border-left: 4px solid var(--k-gold);
}
.k3-price__label {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: .2em;
  color: var(--k-gold-light); font-weight: 700;
  text-transform: uppercase;
}
.k3-price__empty {
  font-family: 'Cormorant Garamond', serif; font-style: italic;
  font-size: 17px; color: #c4bba7; margin-top: 12px;
}
.k3-price__v {
  font-family: 'Cormorant Garamond', serif; font-size: 44px;
  font-weight: 500; line-height: 1; margin: 8px 0 6px;
}
.k3-price__sub {
  font-family: 'JetBrains Mono', monospace; font-size: 10px;
  letter-spacing: .12em; color: #c4bba7; text-transform: uppercase;
}

/* ====== BREAKDOWN ====== */
.k3-breakdown {
  margin-top: 24px; background: var(--k-bg-2);
  border: 1px solid var(--k-line); padding: 20px;
}
.k3-bd-empty {
  font-family: 'Cormorant Garamond', serif; font-style: italic;
  color: var(--k-ink-mute); font-size: 15px; text-align: center;
}
.k3-bd-head {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: .2em;
  color: var(--k-gold-2); font-weight: 700;
  text-transform: uppercase; padding: 14px 0 6px;
  margin-top: 8px; border-top: 1px solid var(--k-line);
}
.k3-bd-row {
  display: flex; justify-content: space-between;
  padding: 8px 0; border-bottom: 1px dashed var(--k-line);
  gap: 20px; align-items: baseline;
}
.k3-bd-row--sub { background: rgba(201,169,97,.08); padding: 10px 8px; margin: 4px -8px; }
.k3-bd-row__n { font-size: 13px; color: var(--k-ink); font-weight: 500; }
.k3-bd-row__d {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; color: var(--k-ink-mute);
  margin-top: 2px; letter-spacing: .02em;
}
.k3-bd-row__v {
  font-family: 'Cormorant Garamond', serif;
  font-size: 18px; font-weight: 500; color: var(--k-ink);
  white-space: nowrap;
}
.k3-bd-total {
  display: flex; justify-content: space-between;
  align-items: center; padding: 28px 32px;
  background: #14110b;
  margin: 20px -20px -20px -20px;
  border-top: 4px solid var(--k-gold);
}
.k3-bd-total__l {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; letter-spacing: .2em;
  font-weight: 700; color: #e8d9a8; text-transform: uppercase;
  line-height: 1.4;
}
.k3-bd-total__l small { display:block; color:#8a7f62; font-size:9px; font-weight:500; margin-top:4px; letter-spacing:.15em; }
.k3-bd-total__v {
  font-family: 'Cormorant Garamond', serif;
  font-size: 56px; font-weight: 500; color: var(--k-gold);
  line-height: 1;
}

/* ====== LIVE ACTIVITY ====== */
.k3-live {
  margin-top: 16px; padding: 12px;
  background: #111; color: #c4bba7;
  border-left: 3px solid var(--k-green);
}
.k3-live__dot {
  display: inline-block; width: 7px; height: 7px;
  border-radius: 50%; background: var(--k-green);
  margin-right: 6px; animation: livepulse 2s infinite;
}
@keyframes livepulse { 0%,100% { opacity: 1;} 50% { opacity: .4;} }
.k3-live__l {
  font-family: 'JetBrains Mono', monospace;
  font-size: 9px; letter-spacing: .2em;
  color: var(--k-green); font-weight: 700;
  text-transform: uppercase;
}
.k3-live__t {
  font-family: 'Cormorant Garamond', serif;
  font-size: 13px; margin-top: 4px; font-style: italic;
  transition: opacity .3s;
}
.k3-live__t strong { color: #f0ead9; font-style: normal; font-weight: 600; }

/* ====== ZERO-DOWN BOX ====== */
.k3-zero {
  margin-top: 14px; padding: 14px;
  background: #fff; border: 1px solid var(--k-gold);
  display: flex; gap: 12px; align-items: center;
}
.k3-zero__m {
  font-family: 'Cormorant Garamond', serif; font-size: 36px;
  line-height: 1; color: var(--k-gold-2); font-weight: 500;
}
.k3-zero__t {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: .15em;
  color: var(--k-ink); font-weight: 700;
  text-transform: uppercase; line-height: 1.4;
}

/* ====== STICKY CTA ====== */
.k3-sticky-cta {
  position: fixed; left: 0; right: 0; bottom: 0;
  z-index: 80; background: #fff; border-top: 1px solid var(--k-line);
  box-shadow: 0 -4px 20px rgba(0,0,0,.12);
  padding: 14px 28px;
  display: flex; align-items: center; gap: 20px;
  max-width: 1600px; margin: 0 auto;
}
.k3-sticky-cta__left {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; letter-spacing: .2em;
  color: var(--k-ink-mute); font-weight: 700;
  text-transform: uppercase; flex-shrink: 0;
}
.k3-sticky-cta__mid {
  flex: 1; font-size: 14px; color: var(--k-ink-2);
}
.k3-sticky-cta__mid strong { color: var(--k-ink); font-weight: 600; }
.k3-sticky-cta__btns { display: flex; gap: 8px; }
.k3-sticky-cta__back, .k3-sticky-cta__next {
  padding: 12px 24px; border: 1px solid var(--k-ink); background: #fff;
  color: var(--k-ink); font-family: 'JetBrains Mono', monospace;
  font-size: 11px; letter-spacing: .15em; font-weight: 700;
  text-transform: uppercase; cursor: pointer;
}
.k3-sticky-cta__back:disabled { opacity: .3; cursor: not-allowed; }
.k3-sticky-cta__next { background: var(--k-ink); color: #fff; }
.k3-sticky-cta__next:hover { background: var(--k-gold); border-color: var(--k-gold); }

/* ====== ONBOARDING ====== */
.k3-onboard {
  position: fixed; inset: 0; z-index: 100;
  background: rgba(0,0,0,.7);
  display: none; align-items: center; justify-content: center;
  padding: 40px;
}
.k3-onboard--show { display: flex; }
.k3-onboard__box {
  background: #fff; max-width: 720px;
  padding: 48px 56px; position: relative;
  border-top: 4px solid var(--k-gold);
}
.k3-onboard__close {
  position: absolute; top: 16px; right: 16px;
  background: transparent; border: 0; font-size: 28px;
  color: var(--k-ink-mute); cursor: pointer;
}
.k3-onboard__eyebrow {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; letter-spacing: .25em; color: var(--k-gold);
  font-weight: 700; text-transform: uppercase; margin-bottom: 12px;
}
.k3-onboard__title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 42px; font-weight: 500; line-height: 1.1;
  margin: 0 0 16px;
}
.k3-onboard__intro { font-size: 15px; color: var(--k-ink-2); line-height: 1.6; margin: 0 0 28px; }
.k3-onboard__steps {
  display: grid; grid-template-columns: repeat(6, 1fr);
  gap: 8px; margin-bottom: 28px;
}
.k3-onboard__step {
  padding: 14px 6px; text-align: center;
  background: var(--k-bg-2); border: 1px solid var(--k-line);
  font-size: 11px; line-height: 1.3; position: relative;
}
.k3-onboard__step::before {
  content: attr(data-n);
  display: block; font-family: 'Cormorant Garamond', serif;
  font-size: 24px; color: var(--k-gold); font-style: italic;
  margin-bottom: 4px;
}
.k3-onboard__cta { display: flex; gap: 12px; justify-content: flex-end; }
.k3-onboard__skip {
  background: transparent; border: 0;
  color: var(--k-ink-mute); text-decoration: underline;
  font-size: 13px; cursor: pointer; padding: 12px 16px;
}

/* ====== SUCCESS ====== */
.k3-success { text-align: center; padding: 64px 20px; }
.k3-success__check {
  width: 88px; height: 88px; border-radius: 50%;
  background: var(--k-gold); color: var(--k-ink);
  font-family: 'Cormorant Garamond', serif; font-size: 48px;
  display: inline-flex; align-items: center; justify-content: center;
  margin-bottom: 24px; font-weight: 500;
  animation: successIn .6s;
}
@keyframes successIn { from { transform: scale(0); opacity: 0;} 60% { transform: scale(1.2);} to { transform: scale(1); opacity: 1;} }

/* ====== MOBILE ====== */
@media (max-width: 1100px) {
  .k3-stepper { grid-template-columns: repeat(3, 1fr); }
  .k3-main { grid-template-columns: 1fr; padding: 20px 16px 200px; }
  .k3-left { padding: 24px 20px; }
  .k3-right { position: relative; top: auto; }
  .k3-intro__num { font-size: 64px; padding-right: 16px; }
  .k3-intro__title { font-size: 30px; }
  .k3-grid { grid-template-columns: 1fr 1fr; }
  .k3-color-grid { grid-template-columns: repeat(3, 1fr); }
  .k3-big-opts { grid-template-columns: 1fr; }
  .k3-big-opts--3 { grid-template-columns: 1fr; }
  .k3-heights { grid-template-columns: repeat(3, 1fr); }
  .k3-acc-grid { grid-template-columns: 1fr; }
  .k3-form { grid-template-columns: 1fr; }
  .k3-inp-row { grid-template-columns: 1fr; }
  .k3-sticky-cta__left { display: none; }
  .k3-sticky-cta__mid { font-size: 13px; }
  .k3-onboard__steps { grid-template-columns: repeat(3, 1fr); }
}

/* ===== referenzen.html ===== */

/* ===== manufaktur.html ===== */

/* ===== modern-line.html ===== */
/* === Modern Line 2026 — page-scoped === */
.ml-hero {
  background: #0d0b07;
  color: #f0ead9;
  padding: 140px 0 110px;
  position: relative;
  overflow: hidden;
  border-bottom: 1px solid #2a241a;
}
.ml-hero::before {
  content: '';
  position: absolute; inset: 0;
  background:
    radial-gradient(ellipse 70% 50% at 80% 30%, rgba(212,175,55,.07), transparent 60%),
    radial-gradient(ellipse 50% 40% at 20% 80%, rgba(184,137,31,.05), transparent 60%);
  pointer-events: none;
}
.ml-hero__grid { display: grid; grid-template-columns: 1.3fr 1fr; gap: 80px; align-items: end; position: relative; z-index: 1; }
.ml-hero__mark {
  display: inline-flex; align-items: center; gap: 12px;
  padding: 10px 18px; border: 1px solid #3d3420;
  background: rgba(20,17,11,.6);
  font-family: var(--mono); font-size: 10px; letter-spacing: .28em;
  text-transform: uppercase; color: #d4af37; font-weight: 600;
  margin-bottom: 36px;
}
.ml-hero__mark span.dia { color: #d4af37; font-size: 11px; }
.ml-hero h1 {
  font-family: var(--serif); font-weight: 500;
  font-size: clamp(52px, 6.5vw, 104px);
  line-height: .98; letter-spacing: -.025em;
  margin: 0; color: #f0ead9;
}
.ml-hero h1 em { color: #d4af37; font-style: italic; font-weight: 500; }
.ml-hero__sub {
  font-size: 19px; line-height: 1.55; color: #c4bba7;
  max-width: 460px; margin: 0;
}
.ml-hero__sub strong { color: #f0ead9; font-weight: 500; }

.ml-hero__facts {
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: 1px; background: #2a241a;
  margin-top: 88px; border: 1px solid #2a241a;
  position: relative; z-index: 1;
}
.ml-fact { background: #14110b; padding: 28px 24px; }
.ml-fact__n { font-family: var(--serif); font-size: 42px; color: #d4af37; font-weight: 500; line-height: 1; margin-bottom: 8px; }
.ml-fact__l { font-family: var(--mono); font-size: 10px; letter-spacing: .22em; text-transform: uppercase; color: #a9a293; }

/* What it is */
.ml-pitch { padding: 110px 0; border-bottom: 1px solid var(--line); }
.ml-pitch__grid { display: grid; grid-template-columns: 1fr 1.4fr; gap: 96px; }
.ml-pitch__side { position: sticky; top: 120px; align-self: start; }
.ml-pitch__side .eyebrow { margin-bottom: 24px; }
.ml-pitch__side h2 { font-family: var(--serif); font-size: 48px; line-height: 1.05; font-weight: 500; letter-spacing: -.015em; margin: 0 0 24px; }
.ml-pitch__side h2 em { color: var(--gold); font-style: italic; }
.ml-pitch__side p { color: var(--ink-dim); font-size: 16px; max-width: 340px; }
.ml-pillars { display: grid; gap: 0; border-top: 1px solid var(--line); }
.ml-pillar {
  display: grid; grid-template-columns: 64px 1fr;
  gap: 32px; padding: 36px 0;
  border-bottom: 1px solid var(--line);
}
.ml-pillar__num { font-family: var(--serif); font-size: 36px; color: var(--gold); font-weight: 500; line-height: 1; }
.ml-pillar__body h3 { font-family: var(--serif); font-size: 26px; font-weight: 500; margin: 0 0 8px; }
.ml-pillar__body p { color: var(--ink-dim); font-size: 15.5px; margin: 0; }
.ml-pillar__body p strong { color: var(--ink); font-weight: 500; }

/* Grid of 10 */
.ml-lineup { padding: 110px 0; background: var(--bg-2); border-bottom: 1px solid var(--line); }
.ml-lineup__head {
  display: grid; grid-template-columns: 1fr 1fr; gap: 60px;
  align-items: end; margin-bottom: 64px;
}
.ml-lineup__head h2 { font-family: var(--serif); font-size: 54px; font-weight: 500; margin: 12px 0 0; line-height: 1.02; letter-spacing: -.015em; }
.ml-lineup__head h2 em { color: var(--gold); font-style: italic; }
.ml-lineup__head p { color: var(--ink-dim); font-size: 16px; max-width: 480px; margin: 0; }
.ml-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 24px; }
.ml-card {
  background: #fff;
  border: 1px solid var(--line);
  display: block;
  transition: transform .25s, box-shadow .25s, border-color .25s;
  position: relative;
}
.ml-card:hover { transform: translateY(-3px); border-color: var(--gold); box-shadow: 0 18px 40px -24px rgba(20,17,11,.25); }
.ml-card__img {
  aspect-ratio: 4/5;
  background: var(--bg-2) no-repeat center/cover;
  position: relative; overflow: hidden;
  border-bottom: 1px solid var(--line);
}
.ml-card__img::before {
  content: '◆ ML'; position: absolute; top: 10px; left: 10px;
  background: #14110b; color: #d4af37;
  font-family: var(--mono); font-size: 9px; letter-spacing: .18em;
  padding: 5px 8px; font-weight: 700;
}
.ml-card__body { padding: 18px 18px 20px; }
.ml-card__num { font-family: var(--mono); font-size: 10px; letter-spacing: .2em; color: var(--ink-mute); text-transform: uppercase; margin-bottom: 6px; }
.ml-card__name { font-family: var(--serif); font-size: 22px; font-weight: 500; line-height: 1.1; margin: 0 0 6px; letter-spacing: -.005em; }
.ml-card__meta { font-size: 13px; color: var(--ink-dim); margin: 0; }
.ml-card__cta {
  margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--line);
  display: flex; justify-content: space-between; align-items: center;
  font-family: var(--mono); font-size: 10px; letter-spacing: .18em;
  text-transform: uppercase; color: var(--gold);
}

/* Inclusion strip */
.ml-incl {
  padding: 96px 0;
  background: #14110b; color: #f0ead9;
  border-bottom: 1px solid #2a241a;
}
.ml-incl__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 96px; align-items: center; }
.ml-incl h2 { font-family: var(--serif); font-size: 48px; line-height: 1.05; font-weight: 500; color: #f0ead9; margin: 12px 0 0; letter-spacing: -.015em; }
.ml-incl h2 em { color: #d4af37; font-style: italic; }
.ml-incl__list { list-style: none; margin: 0; padding: 0; }
.ml-incl__list li {
  display: grid; grid-template-columns: 28px 1fr;
  gap: 16px; padding: 18px 0;
  border-bottom: 1px solid #2a241a;
}
.ml-incl__list li:first-child { border-top: 1px solid #2a241a; }
.ml-incl__list .t { font-family: var(--serif); font-size: 20px; color: #f0ead9; font-weight: 500; }
.ml-incl__list .d { color: #a9a293; font-size: 14.5px; margin-top: 3px; line-height: 1.5; }
.ml-incl__list .c { color: #d4af37; font-family: var(--mono); font-size: 14px; font-weight: 600; line-height: 1.2; }

/* Price ribbon */
.ml-price {
  padding: 80px 0; border-bottom: 1px solid var(--line);
  background: var(--bg);
}
.ml-price__box {
  border: 1px solid var(--line-2);
  padding: 56px 64px;
  display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 64px;
  align-items: center;
  background: linear-gradient(180deg, #fff 0%, var(--bg) 100%);
}
.ml-price__label { font-family: var(--mono); font-size: 10px; letter-spacing: .22em; text-transform: uppercase; color: var(--ink-mute); margin-bottom: 10px; }
.ml-price__big { font-family: var(--serif); font-size: 64px; line-height: 1; font-weight: 500; letter-spacing: -.02em; color: var(--ink); }
.ml-price__big em { color: var(--gold); font-style: italic; }
.ml-price__note { color: var(--ink-dim); font-size: 14px; line-height: 1.55; margin-top: 10px; }
.ml-price__btn {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 18px 28px; background: var(--ink); color: #f0ead9;
  font-family: var(--mono); font-size: 11px; letter-spacing: .18em;
  text-transform: uppercase; font-weight: 600;
  border: 1px solid var(--ink);
  transition: background .2s;
}
.ml-price__btn:hover { background: var(--gold); border-color: var(--gold); color: #14110b; }

/* FAQ mini */
.ml-faq { padding: 96px 0; }
.ml-faq__grid { display: grid; grid-template-columns: 1fr 1.6fr; gap: 80px; }
.ml-faq__side h2 { font-family: var(--serif); font-size: 42px; font-weight: 500; margin: 12px 0 0; line-height: 1.05; }
.ml-faq__side h2 em { color: var(--gold); font-style: italic; }
.ml-faq details {
  border-bottom: 1px solid var(--line);
  padding: 22px 0;
}
.ml-faq details:first-child { border-top: 1px solid var(--line); }
.ml-faq summary {
  list-style: none; cursor: pointer;
  display: flex; justify-content: space-between; align-items: center;
  font-family: var(--serif); font-size: 20px; font-weight: 500;
  color: var(--ink);
}
.ml-faq summary::-webkit-details-marker { display: none; }
.ml-faq summary::after { content: '+'; font-family: var(--mono); color: var(--gold); font-size: 22px; }
.ml-faq details[open] summary::after { content: '–'; }
.ml-faq details p { margin: 14px 0 0; color: var(--ink-dim); font-size: 15.5px; line-height: 1.65; max-width: 620px; }

/* Final CTA */
.ml-cta {
  padding: 110px 0;
  background: #14110b; color: #f0ead9;
  text-align: center;
}
.ml-cta h2 { font-family: var(--serif); font-size: clamp(42px, 5vw, 72px); font-weight: 500; margin: 0 0 24px; line-height: 1.02; letter-spacing: -.02em; color: #f0ead9; }
.ml-cta h2 em { color: #d4af37; font-style: italic; }
.ml-cta p { font-size: 17px; color: #c4bba7; max-width: 560px; margin: 0 auto 40px; }
.ml-cta__row { display: inline-flex; gap: 16px; }
.ml-cta__btn {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 18px 32px;
  font-family: var(--mono); font-size: 11px; letter-spacing: .18em;
  text-transform: uppercase; font-weight: 600;
  transition: all .2s;
}
.ml-cta__btn--primary { background: #d4af37; color: #14110b; border: 1px solid #d4af37; }
.ml-cta__btn--primary:hover { background: #f0ead9; border-color: #f0ead9; }
.ml-cta__btn--ghost { background: transparent; color: #f0ead9; border: 1px solid #3d3420; }
.ml-cta__btn--ghost:hover { border-color: #d4af37; color: #d4af37; }

@media (max-width: 1100px) {
  .ml-grid { grid-template-columns: repeat(3, 1fr); }
  .ml-hero__grid, .ml-pitch__grid, .ml-incl__grid, .ml-lineup__head, .ml-faq__grid { grid-template-columns: 1fr; gap: 40px; }
  .ml-hero__facts { grid-template-columns: repeat(2, 1fr); }
  .ml-price__box { grid-template-columns: 1fr; gap: 32px; padding: 36px; }
}
@media (max-width: 640px) {
  .ml-grid { grid-template-columns: repeat(2, 1fr); }
}

/* ===== ar-preview.html ===== */
/* ====== AR-Preview · page-scoped ====== */
.ar-hero {
  background: #0d0b07; color: #f0ead9;
  padding: 120px 0 80px;
  border-bottom: 1px solid #2a241a;
  position: relative; overflow: hidden;
}
.ar-hero::before {
  content: ''; position: absolute; inset: 0;
  background:
    radial-gradient(ellipse 60% 50% at 85% 30%, rgba(212,175,55,.08), transparent 60%),
    radial-gradient(ellipse 50% 40% at 15% 80%, rgba(184,137,31,.05), transparent 60%);
  pointer-events: none;
}
.ar-hero__grid { display: grid; grid-template-columns: 1.2fr 1fr; gap: 80px; align-items: end; position: relative; z-index: 1; }
.ar-hero__mark {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 8px 14px; border: 1px solid #3d3420;
  font-family: var(--mono); font-size: 10px; letter-spacing: .25em;
  text-transform: uppercase; color: #d4af37; font-weight: 600;
  margin-bottom: 32px;
}
.ar-hero__mark .dot { width: 7px; height: 7px; border-radius: 50%; background: #d4af37; box-shadow: 0 0 10px #d4af37; animation: pulse 2s infinite; }
@keyframes pulse { 0%,100% { opacity: 1; } 50% { opacity: .4; } }
.ar-hero h1 {
  font-family: var(--serif); font-weight: 500;
  font-size: clamp(48px, 6vw, 92px);
  line-height: .98; letter-spacing: -.022em;
  margin: 0; color: #f0ead9;
}
.ar-hero h1 em { color: #d4af37; font-style: italic; font-weight: 500; }
.ar-hero__sub {
  font-size: 19px; line-height: 1.55; color: #c4bba7;
  max-width: 440px; margin: 0;
}
.ar-hero__sub strong { color: #f0ead9; font-weight: 500; }
.ar-hero__strip {
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: 1px; background: #2a241a;
  margin-top: 64px; border: 1px solid #2a241a;
  position: relative; z-index: 1;
}
.ar-stat { background: #14110b; padding: 22px 20px; }
.ar-stat__n { font-family: var(--serif); font-size: 32px; color: #d4af37; font-weight: 500; line-height: 1; margin-bottom: 6px; }
.ar-stat__l { font-family: var(--mono); font-size: 10px; letter-spacing: .22em; text-transform: uppercase; color: #a9a293; }

/* === Studio === */
.ar-studio { padding: 80px 0; border-bottom: 1px solid var(--line); }
.ar-studio__head { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: end; margin-bottom: 48px; }
.ar-studio__head h2 { font-family: var(--serif); font-size: 48px; line-height: 1.05; font-weight: 500; margin: 12px 0 0; letter-spacing: -.015em; }
.ar-studio__head h2 em { color: var(--gold); font-style: italic; }
.ar-studio__head p { color: var(--ink-dim); font-size: 16px; max-width: 480px; margin: 0; }

.ar-app {
  display: grid; grid-template-columns: 1fr 380px;
  gap: 0; min-height: 640px;
  border: 1px solid var(--line-2);
  background: #fff;
}
.ar-canvas-wrap {
  position: relative; background: #14110b;
  display: flex; align-items: center; justify-content: center;
  overflow: hidden;
  border-right: 1px solid var(--line-2);
  min-height: 640px;
}
.ar-canvas {
  max-width: 100%; max-height: 100%;
  display: block;
}
.ar-dropzone {
  position: absolute; inset: 32px;
  border: 2px dashed #3d3420;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  color: #a9a293; text-align: center; padding: 40px;
  transition: all .2s;
}
.ar-dropzone.is-drag { border-color: #d4af37; background: rgba(212,175,55,.05); color: #d4af37; }
.ar-dropzone__icon {
  width: 72px; height: 72px; border: 1px solid #3d3420;
  display: flex; align-items: center; justify-content: center;
  font-size: 32px; color: #d4af37; margin-bottom: 24px;
  font-family: var(--serif);
}
.ar-dropzone h3 { font-family: var(--serif); font-size: 30px; color: #f0ead9; font-weight: 500; margin: 0 0 10px; letter-spacing: -.01em; }
.ar-dropzone h3 em { color: #d4af37; font-style: italic; }
.ar-dropzone p { margin: 0 0 24px; max-width: 420px; line-height: 1.55; font-size: 15px; }
.ar-dropzone__btn {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 14px 26px; background: #d4af37; color: #14110b;
  font-family: var(--mono); font-size: 11px; letter-spacing: .2em;
  text-transform: uppercase; font-weight: 700;
  cursor: pointer; border: none;
  transition: all .2s;
}
.ar-dropzone__btn:hover { background: #f0ead9; }
.ar-dropzone__alt {
  display: flex; gap: 18px; margin-top: 20px;
  font-family: var(--mono); font-size: 10px; letter-spacing: .18em;
  text-transform: uppercase;
}
.ar-dropzone__alt button {
  background: transparent; color: #a9a293; border: none;
  cursor: pointer; padding: 6px 0;
  border-bottom: 1px solid #3d3420;
  font-family: var(--mono); font-size: 10px; letter-spacing: .18em;
  text-transform: uppercase;
}
.ar-dropzone__alt button:hover { color: #d4af37; border-bottom-color: #d4af37; }
.ar-dropzone__samples {
  margin-top: 30px; padding-top: 24px; border-top: 1px solid #2a241a;
  width: 100%; max-width: 460px;
}
.ar-dropzone__samples-label { font-family: var(--mono); font-size: 9.5px; letter-spacing: .2em; text-transform: uppercase; color: #7a7160; margin-bottom: 12px; }
.ar-sample-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.ar-sample-row button {
  aspect-ratio: 4/3; padding: 0;
  background: #2a241a; border: 1px solid #3d3420;
  cursor: pointer; overflow: hidden; position: relative;
  transition: border-color .15s;
}
.ar-sample-row button:hover { border-color: #d4af37; }
.ar-sample-row button img { width: 100%; height: 100%; object-fit: cover; }

/* Progress overlay */
.ar-progress {
  position: absolute; inset: 0; background: rgba(13,11,7,.92);
  display: none; flex-direction: column; align-items: center; justify-content: center;
  z-index: 10; color: #f0ead9; text-align: center; padding: 40px;
}
.ar-progress.is-on { display: flex; }
.ar-progress__title { font-family: var(--serif); font-size: 36px; font-weight: 500; margin: 0 0 24px; letter-spacing: -.01em; }
.ar-progress__title em { color: #d4af37; font-style: italic; }
.ar-progress__bar {
  width: 320px; height: 2px; background: #2a241a;
  position: relative; margin: 0 0 20px;
}
.ar-progress__bar-fill {
  position: absolute; top: 0; left: 0; height: 100%;
  background: #d4af37;
  transition: width .4s ease;
}
.ar-progress__step {
  font-family: var(--mono); font-size: 10.5px; letter-spacing: .22em;
  text-transform: uppercase; color: #d4af37;
  min-height: 16px;
}
.ar-progress__log {
  margin-top: 28px; font-family: var(--mono); font-size: 11px;
  color: #7a7160; text-align: left; width: 320px;
  max-height: 120px; overflow: hidden;
  line-height: 1.8;
}
.ar-progress__log div { opacity: .6; }
.ar-progress__log div.is-done { opacity: 1; color: #a9a293; }
.ar-progress__log div.is-done::before { content: '✓ '; color: #55703a; }

/* === Sidebar controls === */
.ar-side {
  display: flex; flex-direction: column;
  background: var(--bg);
  overflow-y: auto;
}
.ar-side__section {
  padding: 28px 28px 24px;
  border-bottom: 1px solid var(--line);
}
.ar-side__section h4 {
  font-family: var(--mono); font-size: 10px; letter-spacing: .22em;
  text-transform: uppercase; color: var(--gold); font-weight: 600;
  margin: 0 0 16px;
}
.ar-model-pick { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.ar-model-pick button {
  aspect-ratio: 1/1; padding: 0;
  border: 1.5px solid var(--line); background: var(--bg-2);
  cursor: pointer; overflow: hidden; position: relative;
  transition: all .15s;
}
.ar-model-pick button:hover { border-color: var(--gold); }
.ar-model-pick button.is-sel { border-color: var(--ink); box-shadow: 0 0 0 3px var(--bg), 0 0 0 4px var(--ink); }
.ar-model-pick button img { width: 100%; height: 100%; object-fit: cover; }
.ar-model-pick button .ml-chip {
  position: absolute; top: 3px; left: 3px;
  font-family: var(--mono); font-size: 7px; letter-spacing: .1em;
  background: #14110b; color: #d4af37; padding: 2px 4px;
  font-weight: 700;
}
.ar-model-meta {
  margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--line);
  display: flex; justify-content: space-between; align-items: baseline;
}
.ar-model-meta__name { font-family: var(--serif); font-size: 20px; font-weight: 500; margin: 0; }
.ar-model-meta__id { font-family: var(--mono); font-size: 10px; letter-spacing: .18em; color: var(--ink-mute); text-transform: uppercase; }

.ar-slider-row { margin-bottom: 18px; }
.ar-slider-row:last-child { margin-bottom: 0; }
.ar-slider-row__head {
  display: flex; justify-content: space-between; align-items: baseline;
  margin-bottom: 8px;
}
.ar-slider-row__label { font-size: 13px; color: var(--ink-dim); }
.ar-slider-row__val { font-family: var(--mono); font-size: 12px; color: var(--ink); font-weight: 500; }
.ar-slider-row input[type=range] {
  width: 100%; -webkit-appearance: none; appearance: none;
  height: 2px; background: var(--line-2);
}
.ar-slider-row input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none; width: 16px; height: 16px;
  background: var(--gold); border-radius: 50%; cursor: pointer;
}
.ar-slider-row input[type=range]::-moz-range-thumb {
  width: 16px; height: 16px; background: var(--gold); border: none;
  border-radius: 50%; cursor: pointer;
}

.ar-color-row { display: flex; gap: 10px; }
.ar-color-row button {
  width: 36px; height: 36px; border: 1.5px solid var(--line);
  cursor: pointer; position: relative; padding: 0;
  transition: transform .1s;
}
.ar-color-row button.is-sel { border-color: var(--ink); transform: scale(1.1); }
.ar-color-row button::after {
  content: attr(data-name); position: absolute; top: 42px; left: 50%;
  transform: translateX(-50%); font-family: var(--mono); font-size: 9px;
  letter-spacing: .15em; text-transform: uppercase; color: var(--ink-mute);
  white-space: nowrap; opacity: 0; transition: opacity .15s;
  pointer-events: none;
}
.ar-color-row button:hover::after, .ar-color-row button.is-sel::after { opacity: 1; }

.ar-actions {
  margin-top: auto;
  padding: 24px 28px;
  display: flex; flex-direction: column; gap: 10px;
  background: #14110b;
}
.ar-actions__btn {
  display: inline-flex; align-items: center; justify-content: space-between;
  padding: 14px 20px; cursor: pointer; border: 1px solid transparent;
  font-family: var(--mono); font-size: 11px; letter-spacing: .18em;
  text-transform: uppercase; font-weight: 600;
  transition: all .2s;
}
.ar-actions__btn--primary { background: #d4af37; color: #14110b; }
.ar-actions__btn--primary:hover { background: #f0ead9; }
.ar-actions__btn--ghost { background: transparent; color: #a9a293; border-color: #2a241a; }
.ar-actions__btn--ghost:hover { color: #d4af37; border-color: #3d3420; }
.ar-actions__btn:disabled { opacity: .4; cursor: not-allowed; }

/* === AI recommendation card === */
.ar-rec {
  margin-top: 24px;
  padding: 20px 22px;
  background: linear-gradient(180deg, #fff, var(--bg-2));
  border: 1px solid var(--line-2);
  position: relative;
}
.ar-rec__badge {
  position: absolute; top: -9px; left: 18px;
  font-family: var(--mono); font-size: 9px; letter-spacing: .22em;
  background: #14110b; color: #d4af37; padding: 4px 10px;
  text-transform: uppercase; font-weight: 600;
}
.ar-rec h5 { font-family: var(--serif); font-size: 20px; font-weight: 500; margin: 6px 0 8px; }
.ar-rec h5 em { color: var(--gold); font-style: italic; }
.ar-rec p { font-size: 13.5px; color: var(--ink-dim); margin: 0; line-height: 1.55; }
.ar-rec__loading { display: flex; align-items: center; gap: 10px; font-family: var(--mono); font-size: 11px; color: var(--ink-mute); letter-spacing: .1em; }
.ar-rec__dot { width: 6px; height: 6px; background: var(--gold); border-radius: 50%; animation: pulse 1.2s infinite; }

/* === How it works (3 steps) === */
.ar-how { padding: 96px 0; background: var(--bg-2); border-bottom: 1px solid var(--line); }
.ar-how__head { max-width: 680px; margin-bottom: 64px; }
.ar-how__head h2 { font-family: var(--serif); font-size: 48px; line-height: 1.05; font-weight: 500; margin: 12px 0 0; letter-spacing: -.015em; }
.ar-how__head h2 em { color: var(--gold); font-style: italic; }
.ar-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; }
.ar-step {
  background: #fff; border: 1px solid var(--line);
  padding: 36px 32px 32px;
  position: relative;
}
.ar-step__n {
  font-family: var(--serif); font-size: 56px; color: var(--gold);
  font-weight: 500; line-height: 1; margin-bottom: 20px;
  letter-spacing: -.02em;
}
.ar-step h3 { font-family: var(--serif); font-size: 24px; font-weight: 500; margin: 0 0 10px; }
.ar-step p { color: var(--ink-dim); font-size: 15px; line-height: 1.6; margin: 0; }
.ar-step__vis {
  margin-top: 24px; aspect-ratio: 16/10;
  background: var(--bg-2); border: 1px solid var(--line);
  position: relative; overflow: hidden;
  background-size: cover; background-position: center;
}
.ar-step__vis-label {
  position: absolute; bottom: 10px; left: 10px;
  font-family: var(--mono); font-size: 9px; letter-spacing: .2em;
  background: rgba(20,17,11,.85); color: #d4af37;
  padding: 4px 8px; text-transform: uppercase;
}

/* === Before/After demo === */
.ar-ba { padding: 96px 0; border-bottom: 1px solid var(--line); }
.ar-ba__head { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: end; margin-bottom: 48px; }
.ar-ba__head h2 { font-family: var(--serif); font-size: 48px; line-height: 1.05; font-weight: 500; margin: 12px 0 0; letter-spacing: -.015em; }
.ar-ba__head h2 em { color: var(--gold); font-style: italic; }
.ar-ba__slider {
  position: relative; aspect-ratio: 16/9; max-width: 1280px; margin: 0 auto;
  border: 1px solid var(--line-2); overflow: hidden;
  background: #000; cursor: ew-resize;
  user-select: none;
}
.ar-ba__img {
  position: absolute; inset: 0;
  background-size: cover; background-position: center;
}
.ar-ba__img--after { clip-path: inset(0 0 0 50%); }
.ar-ba__handle {
  position: absolute; top: 0; bottom: 0; left: 50%; width: 2px;
  background: #d4af37; transform: translateX(-50%);
  pointer-events: none;
}
.ar-ba__handle::before {
  content: ''; position: absolute; top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 48px; height: 48px; background: #d4af37;
  border-radius: 50%;
  box-shadow: 0 4px 12px rgba(0,0,0,.3);
}
.ar-ba__handle::after {
  content: '◀ ▶'; position: absolute; top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  color: #14110b; font-size: 11px; letter-spacing: 2px;
  font-weight: 700; font-family: var(--mono);
}
.ar-ba__tag {
  position: absolute; top: 16px; font-family: var(--mono);
  font-size: 10px; letter-spacing: .22em; text-transform: uppercase;
  padding: 6px 12px; background: rgba(20,17,11,.85); color: #f0ead9;
}
.ar-ba__tag--b { left: 16px; }
.ar-ba__tag--a { right: 16px; color: #d4af37; }

/* === Privacy note === */
.ar-priv {
  padding: 80px 0; border-bottom: 1px solid var(--line);
  background: var(--bg-2);
}
.ar-priv__grid {
  display: grid; grid-template-columns: 1fr 1.5fr; gap: 80px; align-items: start;
  max-width: 1100px; margin: 0 auto;
}
.ar-priv h2 { font-family: var(--serif); font-size: 38px; line-height: 1.05; font-weight: 500; margin: 12px 0 0; letter-spacing: -.015em; }
.ar-priv h2 em { color: var(--gold); font-style: italic; }
.ar-priv ul { list-style: none; padding: 0; margin: 0; }
.ar-priv li {
  display: grid; grid-template-columns: 24px 1fr; gap: 14px;
  padding: 14px 0; border-bottom: 1px solid var(--line);
  font-size: 15px; color: var(--ink-dim);
}
.ar-priv li:first-child { border-top: 1px solid var(--line); }
.ar-priv li .c { color: var(--gold); font-weight: 700; }
.ar-priv li strong { color: var(--ink); font-weight: 500; }

/* === Final CTA === */
.ar-cta { padding: 110px 0; background: #14110b; color: #f0ead9; text-align: center; }
.ar-cta h2 { font-family: var(--serif); font-size: clamp(40px, 5vw, 68px); font-weight: 500; margin: 0 0 24px; line-height: 1.02; letter-spacing: -.02em; color: #f0ead9; }
.ar-cta h2 em { color: #d4af37; font-style: italic; }
.ar-cta p { font-size: 17px; color: #c4bba7; max-width: 560px; margin: 0 auto 40px; }
.ar-cta__row { display: inline-flex; gap: 16px; }
.ar-cta__btn {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 18px 32px;
  font-family: var(--mono); font-size: 11px; letter-spacing: .18em;
  text-transform: uppercase; font-weight: 600;
  transition: all .2s;
}
.ar-cta__btn--primary { background: #d4af37; color: #14110b; border: 1px solid #d4af37; }
.ar-cta__btn--primary:hover { background: #f0ead9; border-color: #f0ead9; }
.ar-cta__btn--ghost { background: transparent; color: #f0ead9; border: 1px solid #3d3420; }
.ar-cta__btn--ghost:hover { border-color: #d4af37; color: #d4af37; }

@media (max-width: 1100px) {
  .ar-hero__grid, .ar-studio__head, .ar-how__head, .ar-ba__head, .ar-priv__grid { grid-template-columns: 1fr; gap: 40px; }
  .ar-app { grid-template-columns: 1fr; }
  .ar-canvas-wrap { min-height: 460px; border-right: none; border-bottom: 1px solid var(--line-2); }
  .ar-steps { grid-template-columns: 1fr; }
  .ar-hero__strip { grid-template-columns: repeat(2, 1fr); }
}

/* ===== agb.html ===== */
  .legal-wrap { max-width: 800px; margin: 0 auto; padding: 96px 20px; }
  .legal-wrap h1 { font-family: var(--serif); font-size: 72px; font-weight: 500; letter-spacing: -.015em; line-height: .95; margin: 0 0 12px; }
  .legal-wrap h1 em { font-style: italic; color: var(--gold); }
  .legal-wrap h2 { font-family: var(--serif); font-size: 30px; font-weight: 500; letter-spacing: -.01em; margin: 56px 0 16px; padding-top: 24px; border-top: 1px solid var(--line-2); }
  .legal-wrap h2 .num { color: var(--gold); font-style: italic; margin-right: 14px; }
  .legal-wrap h3 { font-family: var(--serif); font-size: 20px; font-weight: 500; margin: 28px 0 8px; font-style:italic; color:var(--ink-dim); }
  .legal-wrap p, .legal-wrap li { font-size: 15px; line-height: 1.7; color: var(--ink); }
  .legal-wrap p { margin: 0 0 12px; }
  .legal-wrap ol, .legal-wrap ul { padding-left: 24px; margin: 0 0 12px; }
  .legal-wrap li { margin-bottom: 4px; }
  .legal-wrap strong { font-weight: 600; }
  .legal-wrap .intro { color: var(--ink-dim); font-size: 13.5px; line-height: 1.7; margin-bottom: 48px; font-family: var(--mono); letter-spacing: .02em; }
  .legal-wrap .box { background: var(--bg-2); border-left: 3px solid var(--gold); padding: 20px 24px; margin: 16px 0 20px; }
  .legal-wrap .box p:last-child { margin-bottom: 0; }
  .legal-wrap .toc { background:#fff; border:1px solid var(--line); padding: 20px 24px; margin: 32px 0 48px; font-size: 14px; }
  .legal-wrap .toc ol { padding-left: 20px; margin: 0; }
  .legal-wrap .toc a { color: var(--ink); text-decoration: none; border-bottom: 1px dotted var(--line-2); }
  .legal-wrap .toc a:hover { color: var(--gold); border-bottom-color: var(--gold); }

/* ===== datenschutz.html ===== */
  .legal-wrap { max-width: 800px; margin: 0 auto; padding: 96px 20px; }
  .legal-wrap h1 { font-family: var(--serif); font-size: 72px; font-weight: 500; letter-spacing: -.015em; line-height: .95; margin: 0 0 12px; }
  .legal-wrap h1 em { font-style: italic; color: var(--gold); }
  .legal-wrap h2 { font-family: var(--serif); font-size: 32px; font-weight: 500; letter-spacing: -.01em; margin: 64px 0 20px; padding-top: 32px; border-top: 1px solid var(--line-2); }
  .legal-wrap h2 .num { color: var(--gold); font-style: italic; margin-right: 14px; }
  .legal-wrap h3 { font-family: var(--serif); font-size: 22px; font-weight: 500; margin: 32px 0 8px; }
  .legal-wrap p, .legal-wrap li { font-size: 15.5px; line-height: 1.7; color: var(--ink); }
  .legal-wrap p { margin: 0 0 14px; }
  .legal-wrap ul, .legal-wrap ol { padding-left: 24px; margin: 0 0 16px; }
  .legal-wrap li { margin-bottom: 6px; }
  .legal-wrap strong { font-weight: 600; }
  .legal-wrap .intro { color: var(--ink-dim); font-size: 13.5px; line-height: 1.7; margin-bottom: 48px; font-family: var(--mono); letter-spacing: .02em; }
  .legal-wrap .kv { display: grid; grid-template-columns: 200px 1fr; gap: 8px 32px; margin: 16px 0 24px; }
  .legal-wrap .kv dt { font-family: var(--mono); font-size: 11px; letter-spacing: .15em; text-transform: uppercase; color: var(--ink-mute); padding-top: 3px; }
  .legal-wrap .kv dd { margin: 0; font-size: 15.5px; }
  .legal-wrap .box { background: var(--bg-2); border-left: 3px solid var(--gold); padding: 20px 24px; margin: 16px 0 24px; }
  .legal-wrap .box p:last-child { margin-bottom: 0; }
  .legal-wrap table { width:100%; border-collapse: collapse; margin: 16px 0 24px; font-size: 13.5px; }
  .legal-wrap th, .legal-wrap td { border:1px solid var(--line-2); padding: 10px 12px; text-align:left; vertical-align: top; }
  .legal-wrap th { background:var(--bg-2); font-family: var(--mono); font-size: 10.5px; letter-spacing: .15em; text-transform: uppercase; color: var(--ink-mute); font-weight: 500;}

/* ===== impressum.html ===== */
  .legal-wrap { max-width: 800px; margin: 0 auto; padding: 96px 20px; }
  .legal-wrap h1 { font-family: var(--serif); font-size: 72px; font-weight: 500; letter-spacing: -.015em; line-height: .95; margin: 0 0 12px; }
  .legal-wrap h1 em { font-style: italic; color: var(--gold); }
  .legal-wrap h2 { font-family: var(--serif); font-size: 32px; font-weight: 500; letter-spacing: -.01em; margin: 64px 0 20px; padding-top: 32px; border-top: 1px solid var(--line-2); }
  .legal-wrap h2 .num { color: var(--gold); font-style: italic; margin-right: 14px; }
  .legal-wrap h3 { font-family: var(--serif); font-size: 22px; font-weight: 500; margin: 32px 0 8px; }
  .legal-wrap p, .legal-wrap li { font-size: 15.5px; line-height: 1.7; color: var(--ink); }
  .legal-wrap p { margin: 0 0 14px; }
  .legal-wrap ul, .legal-wrap ol { padding-left: 24px; margin: 0 0 16px; }
  .legal-wrap li { margin-bottom: 6px; }
  .legal-wrap strong { font-weight: 600; }
  .legal-wrap .intro { color: var(--ink-dim); font-size: 13.5px; line-height: 1.7; margin-bottom: 48px; font-family: var(--mono); letter-spacing: .02em; }
  .legal-wrap .kv { display: grid; grid-template-columns: 200px 1fr; gap: 8px 32px; margin: 16px 0 24px; }
  .legal-wrap .kv dt { font-family: var(--mono); font-size: 11px; letter-spacing: .15em; text-transform: uppercase; color: var(--ink-mute); padding-top: 3px; }
  .legal-wrap .kv dd { margin: 0; font-size: 15.5px; }

/* =============================================================
   MODERN LINE · MEGA rebuild 2026-04-24 23:55 · added sections:
   hero-collage, title, ctas, compare-table, colors, card badges,
   price cta-col, cta-trust
   ============================================================= */

/* Hero collage overlay */
.ml-hero { min-height: 720px; }
.ml-hero__bg {
  position: absolute; inset: 0; display: grid;
  grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(2, 1fr);
  gap: 2px; z-index: 0; opacity: .28;
}
.ml-hero__tile { background: #2a241a no-repeat center/cover; }
.ml-hero__veil {
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(13,11,7,.55) 0%, rgba(13,11,7,.78) 55%, rgba(13,11,7,.95) 100%);
  z-index: 1;
}
.ml-hero__content { position: relative; z-index: 2; }
.ml-hero__title {
  font-family: var(--serif); font-weight: 500;
  font-size: clamp(52px, 6.5vw, 104px);
  line-height: .98; letter-spacing: -.025em;
  margin: 0 0 32px; color: #f0ead9;
}
.ml-hero__title em { color: #d4af37; font-style: italic; font-weight: 500; }
.ml-hero__ctas {
  display: flex; flex-wrap: wrap; gap: 14px; margin-top: 32px;
}
.ml-fact__n span {
  font-size: 16px; color: #a07617; margin-left: 3px; letter-spacing: 0; font-weight: 500;
}

/* Card additions */
.ml-card__badge {
  position: absolute; top: 12px; left: 12px;
  background: #14110b; color: #d4af37;
  font-family: var(--mono); font-size: 9.5px; letter-spacing: 0.2em;
  padding: 6px 10px; font-weight: 700; text-transform: uppercase; z-index: 2;
}
.ml-card__price { color: var(--ink); font-family: var(--serif); font-size: 15px; font-style: italic; letter-spacing: 0; text-transform: none; }
.ml-card__arrow { color: var(--gold); }
.ml-card__img::before { display: none; } /* replaced by .ml-card__badge */

/* Compare table */
.ml-compare { padding: 110px 0; background: #fff; border-bottom: 1px solid var(--line); }
.ml-compare h2 em { color: var(--gold); font-style: italic; }
.ml-compare__table {
  margin-top: 48px; border: 1px solid var(--line);
  background: #fff;
}
.ml-compare__row {
  display: grid; grid-template-columns: 1.1fr 1.4fr 1.6fr;
  border-bottom: 1px solid var(--line);
}
.ml-compare__row:last-child { border-bottom: 0; }
.ml-compare__row--head {
  background: var(--ink); color: var(--bg);
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.2em;
  text-transform: uppercase;
}
.ml-compare__cell {
  padding: 22px 28px;
  border-right: 1px solid var(--line);
  font-size: 15px; line-height: 1.5;
  display: flex; align-items: center;
}
.ml-compare__cell:last-child { border-right: 0; }
.ml-compare__cell strong { font-family: var(--serif); font-size: 17px; font-weight: 500; color: var(--ink); }
.ml-compare__cell--hl {
  background: linear-gradient(180deg, rgba(212,175,55,0.05), rgba(212,175,55,0.08));
  color: var(--ink);
  font-weight: 500;
  border-left: 3px solid var(--gold);
}
.ml-compare__row--head .ml-compare__cell--hl {
  background: #1d1910; color: var(--gold-light);
  border-left: 3px solid var(--gold-light);
}

/* Colors block */
.ml-colors { padding: 110px 0; background: var(--bg-2); border-bottom: 1px solid var(--line); }
.ml-colors h2 em { color: var(--gold); font-style: italic; }
.ml-colors__grid {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px;
  margin-top: 56px;
}
.ml-color {
  background: #fff; border: 1px solid var(--line);
  padding: 0; transition: transform .2s, box-shadow .2s;
}
.ml-color:hover { transform: translateY(-3px); box-shadow: 0 12px 30px -18px rgba(20,17,11,.25); }
.ml-color__swatch {
  aspect-ratio: 3/2; background: var(--c, #666);
  border-bottom: 1px solid var(--line);
}
.ml-color__name {
  font-family: var(--serif); font-size: 22px; font-weight: 500;
  padding: 18px 20px 4px;
}
.ml-color__ral {
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.18em;
  color: var(--ink-mute); text-transform: uppercase;
  padding: 0 20px 20px;
}

/* Price block additions */
.ml-price__cta-col { display: flex; flex-direction: column; gap: 10px; align-items: flex-end; }
.ml-price__btn--ghost {
  background: transparent; color: #f0ead9;
  border: 1px solid rgba(240,234,217,0.3);
}
.ml-price__btn--ghost:hover { background: rgba(240,234,217,0.1); }

/* CTA trust row */
.ml-cta__trust {
  margin-top: 48px; display: flex; flex-wrap: wrap; justify-content: center; gap: 14px 28px;
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.2em;
  color: #9c9280; text-transform: uppercase;
}
.ml-cta__trust span { white-space: nowrap; }

/* Responsive tuning */
@media (max-width: 1200px) {
  .ml-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1024px) {
  .ml-hero { padding: 96px 0 80px; min-height: auto; }
  .ml-hero__grid { grid-template-columns: 1fr; gap: 40px; align-items: start; }
  .ml-pitch__grid { grid-template-columns: 1fr; gap: 48px; }
  .ml-pitch__side { position: static; }
  .ml-grid { grid-template-columns: repeat(3, 1fr); }
  .ml-compare__row { grid-template-columns: 1fr 1fr 1fr; }
  .ml-colors__grid { grid-template-columns: repeat(2, 1fr); }
  .ml-lineup__head { grid-template-columns: 1fr; gap: 20px; }
}
@media (max-width: 720px) {
  .ml-hero__facts { grid-template-columns: 1fr 1fr; }
  .ml-hero__ctas { flex-direction: column; }
  .ml-hero__ctas .btn { width: 100%; justify-content: center; }
  .ml-grid { grid-template-columns: 1fr 1fr; gap: 12px; }
  .ml-compare__cell { padding: 14px 16px; font-size: 14px; }
  .ml-compare__row { grid-template-columns: 1fr; }
  .ml-compare__cell { border-right: 0; border-bottom: 1px solid var(--line); }
  .ml-compare__row:last-child .ml-compare__cell:last-child { border-bottom: 0; }
  .ml-colors__grid { grid-template-columns: 1fr 1fr; }
  .ml-price__cta-col { align-items: stretch; }
}

/* ===========================================================
   NEUE LINIE / MODERN LINE 2026 — landing page (rebuild 2026-04-24)
   =========================================================== */

.nl-hero { position: relative; padding: 140px 0 96px; background: var(--bg-dark); color: #f0ead9; overflow: hidden; }
.nl-hero__bg { position: absolute; inset: 0; background-size: cover; background-position: center; opacity: 0.35; filter: contrast(1.05) saturate(0.9); }
.nl-hero__overlay { position: absolute; inset: 0; background: linear-gradient(135deg, rgba(20,17,11,0.92) 0%, rgba(20,17,11,0.72) 60%, rgba(20,17,11,0.90) 100%); }
.nl-hero__inner { position: relative; z-index: 2; }
.nl-hero__eyebrow { font-family: var(--mono); font-size: 11px; letter-spacing: 0.28em; text-transform: uppercase; color: var(--gold-light); margin-bottom: 24px; display: inline-flex; align-items: center; gap: 10px; }
.nl-hero__dia { color: var(--gold-light); font-size: 14px; }
.nl-hero__title { font-family: var(--serif); font-weight: 500; font-size: clamp(44px, 6.5vw, 96px); line-height: 1.02; letter-spacing: -0.02em; margin: 0 0 28px; color: #f6eed8; }
.nl-hero__title em { color: var(--gold-light); font-style: italic; }
.nl-hero__lede { font-size: 20px; line-height: 1.6; color: #c4bba7; max-width: 780px; margin-bottom: 56px; }
.nl-hero__lede strong { color: #f0ead9; font-weight: 500; }
.nl-hero__facts { display: grid; grid-template-columns: repeat(4, 1fr); gap: 32px; padding: 40px 0; border-top: 1px solid rgba(212, 175, 55, 0.2); border-bottom: 1px solid rgba(212, 175, 55, 0.2); margin-bottom: 48px; }
.nl-fact__n { font-family: var(--serif); font-size: 46px; font-weight: 500; color: var(--gold-light); line-height: 1; letter-spacing: -0.02em; }
.nl-fact__l { font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.2em; text-transform: uppercase; color: #9c9280; margin-top: 8px; line-height: 1.5; }
.nl-hero__cta { display: flex; gap: 16px; flex-wrap: wrap; margin-bottom: 40px; }
.nl-hero__price { display: inline-flex; align-items: baseline; gap: 16px; padding: 16px 24px; background: rgba(212, 175, 55, 0.1); border-left: 3px solid var(--gold-light); }
.nl-hero__price-val { font-family: var(--serif); font-size: 36px; font-weight: 500; color: var(--gold-light); line-height: 1; }

.nl-benefits { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; margin-top: 56px; }
.nl-benefit { padding: 36px 30px; background: #fff; border: 1px solid var(--line); transition: all .25s ease; }
.nl-benefit:hover { border-color: var(--gold); box-shadow: 0 10px 30px rgba(20,17,11,0.08); transform: translateY(-2px); }
.nl-benefit__n { font-family: var(--serif); font-size: 28px; font-weight: 500; font-style: italic; color: var(--gold); margin-bottom: 16px; letter-spacing: 0.02em; }
.nl-benefit__title { font-family: var(--serif); font-size: 22px; font-weight: 500; color: var(--ink); margin: 0 0 12px; }
.nl-benefit__body { font-size: 14.5px; line-height: 1.65; color: var(--ink-dim); margin: 0; }
.nl-benefit__body strong { color: var(--ink); font-weight: 500; }

/* Rückseite proof — werks-glatte Rückseite z prawdziwym zdjęciem */
.nl-rueck { padding-bottom: 96px; }
.nl-rueck__grid { display: grid; grid-template-columns: 1.05fr 1fr; gap: 64px; align-items: center; padding-top: 80px; border-top: 1px solid var(--line); }
.nl-rueck__media { margin: 0; position: relative; }
.nl-rueck__media img { width: 100%; height: auto; display: block; border: 1px solid var(--line); box-shadow: 0 24px 60px -32px rgba(20,17,11,.35); }
.nl-rueck__media figcaption { font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--ink-mute); margin-top: 14px; text-align: center; }
.nl-rueck__body h2 em { color: var(--gold); font-style: italic; }
.nl-rueck__bullets { list-style: none; padding: 0; margin: 28px 0 0; }
.nl-rueck__bullets li { padding: 16px 0; border-top: 1px solid var(--line); font-size: 15px; line-height: 1.65; color: var(--ink-dim); }
.nl-rueck__bullets li:last-child { border-bottom: 1px solid var(--line); }
.nl-rueck__bullets strong { display: block; color: var(--ink); font-family: var(--serif); font-size: 17px; font-weight: 500; margin-bottom: 4px; }
.nl-rueck__note { margin-top: 28px; padding: 18px 22px; background: var(--bg-2); border-left: 3px solid var(--gold-light); font-size: 14px; line-height: 1.6; color: var(--ink-dim); }
.nl-rueck__note a { text-decoration: none; font-family: var(--mono); font-size: 11px; letter-spacing: 0.15em; text-transform: uppercase; margin-left: 8px; }
@media (max-width: 900px) {
  .nl-rueck__grid { grid-template-columns: 1fr; gap: 36px; padding-top: 56px; }
}

.nl-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; margin-top: 56px; }
.nl-card { display: block; text-decoration: none; color: var(--ink); background: #fff; border: 1px solid var(--line); transition: all .25s ease; overflow: hidden; }
.nl-card:hover { border-color: var(--gold); box-shadow: 0 16px 40px rgba(20,17,11,0.12); transform: translateY(-4px); }
.nl-card__img { aspect-ratio: 5/4; position: relative; background: #fff; overflow: hidden; padding: 20px; }
/* v15.27 — białe tło (Adam: „daj białe tło") · contain żeby cały model był widoczny */
.nl-card__img img { width: 100%; height: 100%; object-fit: contain; object-position: center bottom; transition: transform .5s; }
.nl-card:hover .nl-card__img img { transform: scale(1.05); }
.nl-card__badge { position: absolute; top: 14px; left: 14px; background: var(--ink); color: var(--gold-light); padding: 6px 12px; font-family: var(--mono); font-size: 10px; letter-spacing: 0.2em; text-transform: uppercase; font-weight: 500; }
.nl-card__num { position: absolute; top: 14px; right: 14px; background: var(--gold); color: var(--bg); padding: 6px 12px; font-family: var(--mono); font-size: 11px; letter-spacing: 0.18em; font-weight: 600; }
.nl-card__body { padding: 24px; }
.nl-card__title { font-family: var(--serif); font-size: 22px; font-weight: 500; margin: 0 0 6px; color: var(--ink); }
.nl-card__meta { font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.15em; color: var(--ink-mute); text-transform: uppercase; margin-bottom: 12px; }
.nl-card__price { font-family: var(--sans); font-size: 15px; color: var(--ink-dim); padding-top: 12px; border-top: 1px solid var(--line); }
.nl-card__price strong { color: var(--gold); font-weight: 600; }
.nl-card__price small { color: var(--ink-mute); margin-left: 6px; }

.nl-compare { margin-top: 48px; border: 1px solid var(--line); background: #fff; }
.nl-compare__row { display: grid; grid-template-columns: 1.2fr 1fr 1.2fr; gap: 0; padding: 0; border-bottom: 1px solid var(--line); align-items: stretch; }
.nl-compare__row:last-child { border-bottom: 0; }
.nl-compare__row > div { padding: 20px 24px; font-size: 15px; line-height: 1.5; color: var(--ink-2); border-right: 1px solid var(--line); }
.nl-compare__row > div:last-child { border-right: 0; }
.nl-compare__row > div:first-child { font-family: var(--serif); font-size: 16.5px; color: var(--ink); background: var(--bg-2); }
.nl-compare__row .is-hl { color: var(--gold); font-family: var(--serif); font-size: 16px; background: rgba(212, 175, 55, 0.05); }
.nl-compare__row--head > div { font-family: var(--mono); font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; background: var(--ink) !important; color: var(--gold-light) !important; font-weight: 600; }
.nl-compare__row--accent { background: var(--bg-2); }
.nl-compare__row--accent > div { font-weight: 500; font-size: 17px; }
.nl-compare__row--accent .is-hl { font-size: 19px; font-weight: 600; }

/* legacy .nl-spec — kept for backwards-compat where the table-based markup still exists */
.nl-spec { width: 100%; margin-top: 48px; border-collapse: collapse; font-family: var(--serif); }
.nl-spec td { padding: 18px 20px; border-bottom: 1px solid #332b1d; color: #e8e0c8; font-size: 17px; line-height: 1.5; }
.nl-spec td:first-child { color: #b8ad92; font-family: var(--mono); font-size: 12px; letter-spacing: 0.18em; text-transform: uppercase; width: 38%; font-weight: 500; }
.nl-spec td:last-child { color: #f5efe0; font-weight: 500; }
.nl-spec tr.is-hl td { color: var(--gold-light); background: rgba(212,175,55,0.08); padding-top: 22px; padding-bottom: 22px; font-size: 18px; }
.nl-spec tr.is-hl td:first-child { color: var(--gold); }
.nl-spec tr:last-child td { border-bottom: 0; }

.nl-steps { display: grid; grid-template-columns: 1fr 1fr; gap: 40px 48px; margin-top: 56px; }
.nl-step { display: grid; grid-template-columns: auto 1fr; gap: 24px; align-items: start; }
.nl-step__num { font-family: var(--serif); font-size: 56px; font-weight: 500; color: var(--gold); line-height: 1; letter-spacing: -0.02em; }
.nl-step__body h4 { font-family: var(--serif); font-size: 22px; font-weight: 500; margin: 6px 0 10px; color: var(--ink); }
.nl-step__meta { font-family: var(--mono); font-size: 10px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--gold); }
.nl-step__body p { font-size: 15px; line-height: 1.65; color: var(--ink-dim); margin: 0; }
.nl-step__body p strong { color: var(--ink); font-weight: 500; }

@media (max-width: 1024px) {
  .nl-hero__facts { grid-template-columns: 1fr 1fr; }
  .nl-benefits { grid-template-columns: 1fr 1fr; }
  .nl-grid { grid-template-columns: 1fr 1fr; }
  .nl-steps { grid-template-columns: 1fr; }
  .nl-compare__row { grid-template-columns: 1fr; }
  .nl-compare__row > div { border-right: 0; border-bottom: 1px solid var(--line); }
  .nl-compare__row > div:last-child { border-bottom: 0; }
  .nl-compare__row > div:first-child { font-weight: 600; }
}
@media (max-width: 720px) {
  .nl-hero { padding: 80px 0 56px; }
  .nl-hero__title { font-size: 44px; }
  .nl-hero__facts { grid-template-columns: 1fr; }
  .nl-benefits { grid-template-columns: 1fr; }
  .nl-grid { grid-template-columns: 1fr; }
  .nl-fact__n { font-size: 36px; }
}


/* =============================================================
   NL-ATMO · v15.5 atmosphere gallery (full-bleed magazine layout)
   Adam: „lepsze zdjęcia dać na modern wizytówkę i rozbuduj"
   ============================================================= */
.nl-atmo {
  background: var(--ink);
  color: #f5efe0;
  padding: 0 0 0;
  position: relative;
  overflow: hidden;
}
.nl-atmo__head {
  padding: 96px 0 56px;
  background: linear-gradient(180deg, var(--ink) 0%, #1a160e 100%);
}
.nl-atmo__head .eyebrow { color: var(--gold-light); }
.nl-atmo__head h2 {
  color: #fff;
  font-family: var(--serif); font-weight: 500;
  letter-spacing: -0.01em;
}
.nl-atmo__head h2 em { color: var(--gold); font-style: italic; }
.nl-atmo__head .lede { color: #c4bba7; }

.nl-atmo__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-auto-rows: 240px;
  gap: 4px;
  padding: 0 4px;
}
.nl-atmo__cell {
  position: relative;
  margin: 0;
  overflow: hidden;
  background: #14110b;
  cursor: pointer;
}
.nl-atmo__cell--big  { grid-column: span 2; grid-row: span 2; }
.nl-atmo__cell--tall { grid-row: span 2; }
.nl-atmo__cell--wide { grid-column: span 2; }
.nl-atmo__cell img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform .8s cubic-bezier(.2,.7,.2,1), filter .4s ease;
  filter: brightness(.92) saturate(1.05);
}
.nl-atmo__cell:hover img {
  transform: scale(1.06);
  filter: brightness(1) saturate(1.1);
}
.nl-atmo__cell::after {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(180deg, transparent 50%, rgba(0,0,0,.65) 100%);
  pointer-events: none;
}
.nl-atmo__cap {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  padding: 18px 22px;
  z-index: 2;
  display: flex; flex-direction: column; gap: 4px;
  color: #fff;
  transform: translateY(8px);
  transition: transform .3s ease;
}
.nl-atmo__cell:hover .nl-atmo__cap { transform: translateY(0); }
.nl-atmo__cap-name {
  font-family: var(--serif);
  font-size: 16px; font-weight: 500;
  line-height: 1.2;
  letter-spacing: -0.005em;
}
.nl-atmo__cell--big .nl-atmo__cap-name { font-size: 22px; }
.nl-atmo__cap-land {
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--gold-light);
  font-weight: 600;
}

/* Strip ze statystykami pod galerią */
.nl-atmo__strip {
  background: #0d0b07;
  border-top: 1px solid rgba(212,175,55,.2);
  padding: 36px 0;
}
/* v15.15 — strip stoi sam (bez galerii nad sobą) */
.nl-atmo__strip--solo { border-top: 0; padding: 28px 0; }
.nl-atmo:has(.nl-atmo__strip--solo) { background: #0d0b07; padding: 0; }
.nl-atmo__strip-inner {
  display: grid;
  grid-template-columns: repeat(4, 1fr) auto;
  gap: 32px;
  align-items: center;
}
.nl-atmo__strip-stat {
  display: flex; flex-direction: column; gap: 4px;
  padding-right: 20px;
  border-right: 1px solid rgba(212,175,55,.18);
}
.nl-atmo__strip-stat:nth-child(4) { border-right: 0; }
.nl-atmo__strip-num {
  font-family: var(--serif);
  font-size: 38px; font-weight: 500;
  color: var(--gold-light);
  line-height: 1;
  letter-spacing: -0.015em;
}
.nl-atmo__strip-num span {
  font-size: 18px;
  color: var(--gold);
  font-family: var(--mono);
  font-weight: 600;
  margin-left: 2px;
}
.nl-atmo__strip-lbl {
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: #c4bba7;
  line-height: 1.5;
  margin-top: 4px;
}
.nl-atmo__strip-cta {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 14px 24px;
  background: var(--gold);
  color: var(--ink);
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.16em; text-transform: uppercase; font-weight: 700;
  text-decoration: none;
  transition: background .2s ease, transform .2s ease;
}
.nl-atmo__strip-cta:hover {
  background: var(--gold-light);
  transform: translateY(-2px);
}

/* RESPONSIVE */
@media (max-width: 1180px) {
  .nl-atmo__grid {
    grid-template-columns: repeat(3, 1fr);
    grid-auto-rows: 220px;
  }
  .nl-atmo__cell--big { grid-column: span 2; grid-row: span 2; }
  .nl-atmo__cell--wide { grid-column: span 3; }
  .nl-atmo__strip-inner { grid-template-columns: repeat(2, 1fr); gap: 24px; }
  .nl-atmo__strip-cta { grid-column: 1 / -1; justify-content: center; }
  .nl-atmo__strip-stat:nth-child(2) { border-right: 0; }
}
@media (max-width: 720px) {
  .nl-atmo__head { padding: 56px 0 36px; }
  .nl-atmo__grid {
    grid-template-columns: 1fr 1fr;
    grid-auto-rows: 180px;
    gap: 3px; padding: 0 3px;
  }
  .nl-atmo__cell--big,
  .nl-atmo__cell--tall,
  .nl-atmo__cell--wide { grid-column: span 2; grid-row: span 1; }
  .nl-atmo__cell--big { grid-row: span 2; }
  .nl-atmo__cap { padding: 14px 16px; }
  .nl-atmo__cap-name { font-size: 14px; }
  .nl-atmo__cell--big .nl-atmo__cap-name { font-size: 18px; }
  .nl-atmo__strip-inner { grid-template-columns: 1fr 1fr; gap: 20px; }
  .nl-atmo__strip-num { font-size: 28px; }
  .nl-atmo__strip-stat { border-right: 0; padding-right: 0; }
}


/* =============================================================
   NEUE LINIE 2026 · page-modern-line.php (user rebuild) · .nl-* classes
   9 sections: Hero / Benefits / Gallery / Compare / Spec / Process / Garantie / FAQ / CTA
   ============================================================= */

/* I. Hero */
.nl-hero {
  position: relative; overflow: hidden;
  padding: 130px 0 110px; min-height: 620px;
  background: #0d0b07; color: #f0ead9;
  border-bottom: 1px solid #2a241a;
}
.nl-hero__bg {
  position: absolute; inset: 0;
  background: no-repeat center/cover; opacity: .85;
  filter: contrast(1.05) saturate(1.05);
}
.nl-hero__overlay {
  position: absolute; inset: 0;
  background:
    /* horizontal fade — text side dark, image side breathes */
    linear-gradient(90deg, rgba(13,11,7,.92) 0%, rgba(13,11,7,.78) 35%, rgba(13,11,7,.30) 70%, rgba(13,11,7,.10) 100%),
    /* subtle bottom shadow for footer-CTA legibility */
    linear-gradient(180deg, transparent 60%, rgba(13,11,7,.55) 100%),
    /* gold accent glow */
    radial-gradient(ellipse 50% 40% at 80% 30%, rgba(212,175,55,.18), transparent 65%);
}
.nl-hero__inner { position: relative; z-index: 2; }

/* Split layout — text left, real-photo collage right (replaces dark single-image hero) */
.nl-hero--split .nl-hero__inner {
  display: grid; grid-template-columns: 1.05fr 1fr; gap: 56px; align-items: center;
}
.nl-hero--split .nl-hero__copy { max-width: 640px; }
.nl-hero__photos {
  position: relative;
  display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr;
  gap: 12px; aspect-ratio: 1.05/1;
  align-self: stretch; padding: 0;
}
.nl-hero__photo {
  position: relative; overflow: hidden; display: block; text-decoration: none;
  background: #14110b; border: 1px solid rgba(212,175,55,.18);
  box-shadow: 0 24px 60px -28px rgba(0,0,0,.65);
  transition: transform .35s cubic-bezier(.2,.7,.2,1), border-color .35s, box-shadow .35s;
}
.nl-hero__photo img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .8s cubic-bezier(.2,.7,.2,1); }
.nl-hero__photo:hover { border-color: var(--gold-light); box-shadow: 0 30px 80px -28px rgba(212,175,55,.35); transform: translateY(-2px); }
.nl-hero__photo:hover img { transform: scale(1.04); }
.nl-hero__photo--main   { grid-column: 1 / 3; grid-row: 1 / 2; }
.nl-hero__photo--top    { grid-column: 1 / 2; grid-row: 2 / 3; }
.nl-hero__photo--bottom { grid-column: 2 / 3; grid-row: 2 / 3; }
.nl-hero__photo-badge {
  position: absolute; top: 14px; left: 14px;
  background: rgba(20,17,11,.85); color: var(--gold-light);
  padding: 8px 14px; font-family: var(--mono); font-size: 10.5px;
  letter-spacing: 0.2em; text-transform: uppercase; font-weight: 600;
  backdrop-filter: blur(6px);
}
.nl-hero__photo-num {
  position: absolute; top: 14px; right: 14px;
  background: var(--gold); color: #14110b;
  padding: 8px 14px; font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.18em; font-weight: 700;
}
.nl-hero__photo-num--sm { padding: 5px 10px; font-size: 10px; }
.nl-hero__photos-tag {
  position: absolute; bottom: -34px; right: 0;
  font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.18em;
  text-transform: uppercase; color: rgba(212,175,55,.55);
}
@media (max-width: 1024px) {
  .nl-hero--split .nl-hero__inner { grid-template-columns: 1fr; gap: 64px; }
  .nl-hero__photos { aspect-ratio: 1.4/1; max-height: 420px; }
  .nl-hero__photos-tag { bottom: -28px; }
}
@media (max-width: 600px) {
  .nl-hero__photos { grid-template-columns: 1fr; grid-template-rows: 1.3fr 1fr; aspect-ratio: 1/1; max-height: none; }
  .nl-hero__photo--main { grid-column: 1; grid-row: 1; }
  .nl-hero__photo--top  { grid-column: 1; grid-row: 2; }
  .nl-hero__photo--bottom { display: none; }
}

.nl-hero__eyebrow {
  display: inline-flex; align-items: center; gap: 12px;
  padding: 10px 18px; border: 1px solid rgba(212,175,55,.35);
  background: rgba(20,17,11,.55);
  font-family: var(--mono); font-size: 10px; letter-spacing: .28em;
  text-transform: uppercase; color: #d4af37; font-weight: 600;
  margin-bottom: 32px;
}
.nl-hero__dia { color: #d4af37; font-size: 11px; }
.nl-hero__title {
  font-family: var(--serif); font-weight: 500;
  font-size: clamp(50px, 6.4vw, 102px);
  line-height: .98; letter-spacing: -.025em;
  margin: 0 0 28px; color: #f0ead9;
}
.nl-hero__title em { color: #d4af37; font-style: italic; font-weight: 500; }
.nl-hero__lede {
  font-size: 19px; line-height: 1.6; color: #c4bba7;
  max-width: 640px; margin: 0 0 40px;
}
.nl-hero__lede strong { color: #f0ead9; font-weight: 500; }

.nl-hero__facts {
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: 1px; background: #2a241a;
  margin: 48px 0 40px; border: 1px solid #2a241a;
}
.nl-fact { background: #14110b; padding: 26px 24px; }
.nl-fact__n {
  font-family: var(--serif); font-size: 38px; color: #d4af37;
  font-weight: 500; line-height: 1; margin-bottom: 10px;
}
.nl-fact__l {
  font-family: var(--mono); font-size: 10px; letter-spacing: .22em;
  text-transform: uppercase; color: #a9a293; line-height: 1.5;
}

.nl-hero__cta {
  display: flex; flex-wrap: wrap; gap: 14px; margin-bottom: 40px;
}
.nl-hero__price {
  display: inline-flex; align-items: center; gap: 16px;
  padding: 16px 24px; background: rgba(240,234,217,0.04);
  border: 1px solid rgba(212,175,55,.2); margin-top: 16px;
}
.nl-hero__price-val {
  font-family: var(--serif); font-size: 32px; color: #d4af37; font-weight: 500;
  letter-spacing: -.01em;
}
.nl-hero__price .kicker { color: #a9a293; }

/* II. Benefits */
.nl-benefits {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 0; margin-top: 64px; border: 1px solid var(--line);
  background: var(--line);
}
.nl-benefit {
  padding: 36px 32px; background: #fff;
  transition: background .2s;
}
.nl-benefit:hover { background: var(--bg-2); }
.nl-benefit__n {
  font-family: var(--serif); font-size: 38px; color: var(--gold);
  font-weight: 500; line-height: 1; margin-bottom: 18px; font-style: italic;
}
.nl-benefit__title {
  font-family: var(--serif); font-size: 22px; font-weight: 500;
  margin: 0 0 12px; color: var(--ink); letter-spacing: -.005em;
}
.nl-benefit__body {
  font-size: 14.5px; line-height: 1.65; color: var(--ink-dim); margin: 0;
}
.nl-benefit__body strong { color: var(--ink); font-weight: 500; }

/* III. Galerie grid */
.nl-grid {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px;
  margin-top: 56px;
}
.nl-card {
  background: #fff; border: 1px solid var(--line);
  display: block; text-decoration: none; color: inherit;
  transition: transform .2s, box-shadow .2s, border-color .2s;
  position: relative;
}
.nl-card:hover {
  transform: translateY(-3px); border-color: var(--gold);
  box-shadow: 0 18px 40px -24px rgba(20,17,11,.25);
}
.nl-card__img {
  aspect-ratio: 5/4;
  background: #fff;
  position: relative; overflow: hidden;
  border-bottom: 1px solid var(--line);
  padding: 20px;
}
/* v15.27 — Adam: „daj białe tło" (z dark gradient v15.24) */
.nl-card__img img {
  width: 100%; height: 100%; object-fit: contain; object-position: center bottom; display: block;
  transition: transform .6s;
}
.nl-card:hover .nl-card__img img { transform: scale(1.04); }
.nl-card__badge {
  position: absolute; top: 10px; left: 10px;
  background: #14110b; color: #d4af37;
  font-family: var(--mono); font-size: 9.5px; letter-spacing: .2em;
  padding: 5px 9px; font-weight: 700; text-transform: uppercase; z-index: 2;
}
.nl-card__num {
  position: absolute; top: 10px; right: 10px;
  background: rgba(255,255,255,0.92); color: var(--ink);
  font-family: var(--mono); font-size: 9.5px; letter-spacing: .18em;
  padding: 5px 9px; font-weight: 700; z-index: 2;
}
.nl-card__body { padding: 18px 18px 22px; }
.nl-card__title {
  font-family: var(--serif); font-size: 22px; font-weight: 500;
  margin: 0 0 6px; line-height: 1.15;
}
.nl-card__meta {
  font-family: var(--mono); font-size: 10px; letter-spacing: .16em;
  color: var(--ink-mute); text-transform: uppercase; margin-bottom: 14px;
}
.nl-card__price {
  font-family: var(--serif); font-size: 15px; color: var(--ink-dim);
  padding-top: 12px; border-top: 1px solid var(--line);
}
.nl-card__price strong { color: var(--gold); font-weight: 500; font-style: italic; font-size: 17px; }
.nl-card__price small { color: var(--ink-mute); font-size: 11px; }

/* IV. Compare table */
.nl-compare {
  margin-top: 48px; border: 1px solid var(--line); background: #fff;
}
.nl-compare__row {
  display: grid; grid-template-columns: 1.1fr 1.2fr 1.4fr;
  border-bottom: 1px solid var(--line);
}
.nl-compare__row:last-child { border-bottom: 0; }
.nl-compare__row > div {
  padding: 18px 24px; border-right: 1px solid var(--line);
  font-size: 15px; line-height: 1.5; display: flex; align-items: center;
}
.nl-compare__row > div:last-child { border-right: 0; }
.nl-compare__row > div:first-child {
  font-family: var(--serif); font-size: 17px; font-weight: 500; color: var(--ink);
}
.nl-compare__row--head {
  background: var(--ink); color: var(--bg);
  font-family: var(--mono); font-size: 11px; letter-spacing: .22em;
  text-transform: uppercase;
}
.nl-compare__row--head > div:first-child { font-family: var(--mono); color: var(--bg); font-size: 11px; }
.nl-compare__row .is-hl {
  background: linear-gradient(180deg, rgba(212,175,55,.06), rgba(212,175,55,.1));
  color: var(--ink); font-weight: 500;
  border-left: 3px solid var(--gold);
}
.nl-compare__row--head .is-hl { background: #1d1910; color: var(--gold-light); border-left: 3px solid var(--gold-light); }
.nl-compare__row--accent { background: var(--bg-2); }
.nl-compare__row--accent > div:first-child { color: var(--gold); font-style: italic; }

/* ============================================================
   V. Technische Spezifikation — grouped card-grid (on dark)
   Replaces the old .nl-spec table for far better readability
   ============================================================ */

.nl-tech .container > .eyebrow + h2 em { color: var(--gold-light); font-style: italic; }

/* Each thematic group: Material / Konstruktion / Performance / Garantie */
.nl-tech__group {
  margin-top: 56px;
  padding-top: 40px;
  border-top: 1px solid rgba(212,175,55,0.18);
}
.nl-tech__group:first-of-type { margin-top: 64px; }

/* Group header: "01" + label + title */
.nl-tech__head {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 24px;
  align-items: start;
  margin-bottom: 32px;
}
.nl-tech__num {
  font-family: var(--serif);
  font-size: 56px;
  font-weight: 400;
  line-height: 1;
  color: rgba(212,175,55,0.55);
  letter-spacing: -0.02em;
  font-feature-settings: "lnum";
}
.nl-tech__num--gold { color: var(--gold); }
.nl-tech__label {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--gold-light);
  margin-bottom: 8px;
}
.nl-tech__title {
  font-family: var(--serif);
  font-size: 28px;
  font-weight: 400;
  color: #f5efe0;
  margin: 0;
  letter-spacing: -0.01em;
  line-height: 1.25;
}

/* 2-column grid of spec cells */
.nl-tech__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1px;
  background: rgba(212,175,55,0.12);
  border: 1px solid rgba(212,175,55,0.12);
}
.nl-tech__cell {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 22px 26px;
  background: var(--bg-dark);
  transition: background 200ms ease;
}
.nl-tech__cell:hover {
  background: #1a1610;
}
.nl-tech__k {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: #b8ad92;
  font-weight: 500;
}
.nl-tech__v {
  font-family: var(--serif);
  font-size: 19px;
  line-height: 1.4;
  color: #f5efe0;
  font-weight: 400;
}
.nl-tech__v sub { font-size: 12px; }

/* Garantie group — premium plate with 4 big numbers */
.nl-tech__group--garantie {
  margin-top: 72px;
  padding-top: 48px;
  border-top: 2px solid var(--gold);
  position: relative;
}
.nl-tech__group--garantie::before {
  content: "★";
  position: absolute;
  top: -14px;
  left: 0;
  width: 28px;
  height: 28px;
  background: var(--bg-dark);
  color: var(--gold);
  display: grid;
  place-items: center;
  font-size: 16px;
  line-height: 1;
}
.nl-tech__warranty {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  background: var(--gold);
  border: 1px solid var(--gold);
  margin-top: 8px;
}
.nl-warr {
  background: linear-gradient(180deg, #1a1610 0%, var(--bg-dark) 100%);
  padding: 36px 24px 32px;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
}
.nl-warr__n {
  font-family: var(--serif);
  font-size: 72px;
  font-weight: 400;
  color: var(--gold-light);
  line-height: 1;
  letter-spacing: -0.04em;
  font-feature-settings: "lnum";
  text-shadow: 0 2px 24px rgba(212,175,55,0.18);
}
.nl-warr__u {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--gold);
  margin-top: 12px;
}
.nl-warr__t {
  font-family: var(--serif);
  font-size: 16px;
  color: #e8e0c8;
  font-style: italic;
  margin-top: 6px;
  line-height: 1.3;
}

/* Tablet */
@media (max-width: 980px) {
  .nl-tech__head { gap: 18px; margin-bottom: 24px; }
  .nl-tech__num { font-size: 44px; }
  .nl-tech__title { font-size: 22px; }
  .nl-tech__warranty { grid-template-columns: repeat(2, 1fr); }
  .nl-warr__n { font-size: 60px; }
}

/* Mobile */
@media (max-width: 640px) {
  .nl-tech__group { margin-top: 40px; padding-top: 28px; }
  .nl-tech__group--garantie { margin-top: 48px; padding-top: 36px; }
  .nl-tech__head { gap: 14px; margin-bottom: 20px; }
  .nl-tech__num { font-size: 36px; }
  .nl-tech__title { font-size: 19px; }
  .nl-tech__grid { grid-template-columns: 1fr; }
  .nl-tech__cell { padding: 18px 20px; gap: 8px; }
  .nl-tech__v { font-size: 17px; }
  .nl-tech__warranty { grid-template-columns: repeat(2, 1fr); }
  .nl-warr { padding: 28px 16px 24px; }
  .nl-warr__n { font-size: 52px; }
  .nl-warr__t { font-size: 14px; }
}

/* VI. Process steps */
.nl-steps {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 32px;
}
.nl-step {
  display: grid; grid-template-columns: 64px 1fr; gap: 24px;
  padding: 28px 0; border-top: 1px solid var(--line);
}
.nl-step:last-child, .nl-step:nth-last-child(2) { border-bottom: 0; }
.nl-step__num {
  font-family: var(--serif); font-size: 42px; color: var(--gold);
  font-weight: 500; line-height: 1; font-style: italic;
}
.nl-step__meta {
  font-family: var(--mono); font-size: 10px; letter-spacing: .22em;
  text-transform: uppercase; color: var(--ink-mute); margin-bottom: 6px;
}
.nl-step__body h4 {
  font-family: var(--serif); font-size: 22px; font-weight: 500;
  margin: 0 0 8px; letter-spacing: -.005em;
}
.nl-step__body p {
  font-size: 14.5px; line-height: 1.6; color: var(--ink-dim); margin: 0;
}
.nl-step__body strong { color: var(--ink); font-weight: 500; }

/* Responsive */
@media (max-width: 1100px) {
  .nl-benefits { grid-template-columns: repeat(2, 1fr); }
  .nl-grid { grid-template-columns: repeat(3, 1fr); }
  .nl-hero__facts { grid-template-columns: repeat(2, 1fr); }
  .nl-compare__row { grid-template-columns: 1fr 1fr 1.2fr; }
  .nl-steps { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  .nl-hero { padding: 80px 0 72px; min-height: auto; }
  .nl-hero__title { font-size: 44px; }
  .nl-benefits { grid-template-columns: 1fr; }
  .nl-grid { grid-template-columns: 1fr 1fr; gap: 12px; }
  .nl-hero__facts { grid-template-columns: 1fr; }
  .nl-compare__row { grid-template-columns: 1fr; }
  .nl-compare__row > div { border-right: 0; border-bottom: 1px solid var(--line); padding: 12px 18px; }
  .nl-compare__row:last-child > div:last-child { border-bottom: 0; }
  .nl-hero__cta { flex-direction: column; }
  .nl-hero__cta .btn { width: 100%; justify-content: center; }
}

/* =============================================================
   /metall/ page-metall.php — Doppelstabmatten · Tore · Pforten
   ============================================================= */
.mt-hero {
  position: relative; padding: 120px 0 100px; min-height: 560px;
  background: #0d0b07 url('../monolith/img/metal/dsm-hero.jpg') no-repeat center/cover;
  color: #f0ead9; border-bottom: 1px solid #2a241a;
}
.mt-hero__overlay {
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(13,11,7,.80) 0%, rgba(13,11,7,.92) 100%);
}
.mt-hero__inner { position: relative; z-index: 2; }
.mt-hero__cta { display: flex; gap: 14px; margin-top: 36px; flex-wrap: wrap; }
.mt-hero__facts {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px;
  background: #2a241a; margin-top: 56px; border: 1px solid #2a241a;
}
.mt-hero__facts > div {
  background: #14110b; padding: 22px 20px;
  font-family: var(--mono); font-size: 10.5px; letter-spacing: .2em;
  text-transform: uppercase; color: #a9a293; line-height: 1.5;
}
.mt-hero__facts strong {
  display: block; font-family: var(--serif); font-size: 30px; color: #d4af37;
  font-weight: 500; letter-spacing: -.01em; text-transform: none; margin-bottom: 6px;
}

.mt-cats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.mt-cat {
  display: block; background: #fff;
  border: 1px solid var(--line); text-decoration: none; color: inherit;
  transition: transform .2s, box-shadow .2s, border-color .2s;
  overflow: hidden;
}
.mt-cat:hover { transform: translateY(-3px); border-color: var(--gold); box-shadow: 0 18px 40px -24px rgba(20,17,11,.25); }
.mt-cat__media {
  position: relative; height: 180px; background-position: center; background-size: cover;
  background-color: #2a241a;
}
.mt-cat__media::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(20,17,11,0) 40%, rgba(20,17,11,.55) 100%);
}
.mt-cat__body { padding: 28px 28px 32px; }
.mt-cat__num {
  font-family: var(--serif); font-size: 38px; color: var(--gold);
  font-style: italic; font-weight: 500; line-height: 1; margin-bottom: 16px;
}
.mt-cat h3 { font-family: var(--serif); font-size: 26px; font-weight: 500; margin: 0 0 10px; }
.mt-cat p { font-size: 14.5px; line-height: 1.6; color: var(--ink-dim); margin: 0 0 16px; }
.mt-cat__meta {
  padding-top: 14px; border-top: 1px solid var(--line);
  font-family: var(--mono); font-size: 10.5px; letter-spacing: .18em;
  color: var(--gold); text-transform: uppercase;
}

.mt-spec-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; }
.mt-spec { padding: 32px 28px; background: #fff; border-left: 3px solid var(--gold); }
.mt-spec__title { font-family: var(--serif); font-size: 26px; font-weight: 500; margin-bottom: 8px; }
.mt-spec__desc { font-size: 15px; color: var(--ink-dim); line-height: 1.6; margin-bottom: 18px; }
.mt-spec ul { margin: 0; padding-left: 22px; font-size: 14px; line-height: 1.7; color: var(--ink-2); }

.mt-heights {
  display: grid; grid-template-columns: repeat(8, 1fr); gap: 8px;
  margin-top: 24px; max-width: 720px;
}
.mt-heights > div {
  padding: 14px 0; text-align: center; background: #fff;
  border: 1px solid var(--line); font-family: var(--mono); font-size: 12.5px;
  letter-spacing: .1em; color: var(--ink-2);
}

.mt-inline-note {
  margin-top: 40px; padding: 24px 28px;
  background: #14110b; color: #c4bba7;
  font-size: 14.5px; line-height: 1.65;
  border-left: 3px solid var(--gold-light);
}
.mt-inline-note strong { color: #f0ead9; font-family: var(--serif); font-weight: 500; }

.mt-gates { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
.mt-gate {
  background: #fff; border: 1px solid var(--line);
  position: relative; overflow: hidden;
}
.mt-gate__media {
  position: relative; height: 200px; background-position: center; background-size: cover;
  background-color: #2a241a;
}
.mt-gate__media::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(20,17,11,0) 50%, rgba(20,17,11,.50) 100%);
}
.mt-gate__body { padding: 28px 28px 32px; }
.mt-gate__tag {
  position: absolute; top: 14px; right: 14px;
  background: rgba(20,17,11,.85); padding: 6px 12px;
  font-family: var(--mono); font-size: 10px; letter-spacing: .2em;
  color: var(--gold-light); text-transform: uppercase; z-index: 2;
}
.mt-gate h3 { font-family: var(--serif); font-size: 28px; font-weight: 500; margin: 0 0 12px; }
.mt-gate p { font-size: 14.5px; line-height: 1.6; color: var(--ink-dim); margin: 0 0 20px; }
.mt-gate__stats { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; padding-top: 18px; border-top: 1px solid var(--line); }
.mt-gate__stats > div {
  font-family: var(--mono); font-size: 11px; letter-spacing: .12em;
  color: var(--ink-mute); text-transform: uppercase; line-height: 1.5;
}
.mt-gate__stats strong {
  display: block; font-family: var(--serif); font-size: 15px; color: var(--ink);
  font-weight: 500; letter-spacing: 0; text-transform: none; margin-bottom: 4px;
}

.mt-auto-block {
  margin-top: 72px; padding: 48px 40px;
  background: var(--ink); color: var(--bg);
}
.mt-auto-block h3 { color: #f0ead9; margin: 0 0 32px; }
.mt-auto-block h3 em { color: var(--gold-light); }
.mt-auto-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px 32px; }
.mt-auto-grid > div {
  font-size: 13px; line-height: 1.6; color: #c4bba7;
  padding: 16px 0; border-top: 1px solid #2a241a;
}
.mt-auto-grid strong {
  display: block; font-family: var(--serif); font-size: 17px; color: #f0ead9;
  font-weight: 500; margin-bottom: 6px;
}

/* === Schnellpreis-Konfigurator (page-metall.php · Sektion IV.B) === */
.mt-calc__grid {
  display: grid; grid-template-columns: 1.4fr 1fr; gap: 56px;
  margin-top: 56px;
}
.mt-calc__row { padding: 22px 0; border-top: 1px solid #2a241a; }
.mt-calc__row:first-child { border-top: 0; padding-top: 0; }
.mt-calc__lbl {
  display: flex; justify-content: space-between; align-items: baseline;
  margin-bottom: 12px;
}
.mt-calc__lbl strong {
  font-family: var(--serif); font-size: 17px; font-weight: 500;
  color: #f6eed8; letter-spacing: -0.01em;
}
.mt-calc__lbl .kicker { color: #9c9280; }
.mt-calc__opts { display: grid; gap: 6px; }
.mt-calc__opts--2 { grid-template-columns: 1fr 1fr; }
.mt-calc__opts--8 { grid-template-columns: repeat(8, 1fr); }
.mt-calc__btn {
  -webkit-appearance: none; appearance: none;
  display: flex; flex-direction: column; gap: 4px;
  padding: 14px 12px; background: #14110b; color: #c4bba7;
  border: 1px solid #2a241a; cursor: pointer;
  font-family: var(--mono); font-size: 11.5px; letter-spacing: 0.04em;
  text-align: left; transition: border-color .15s, background .15s, color .15s, transform .12s;
  border-radius: 0; line-height: 1.35;
}
.mt-calc__btn:hover:not(.is-active):not(:disabled) {
  border-color: var(--gold); color: var(--gold-light); transform: translateY(-1px);
}
.mt-calc__btn.is-active {
  background: var(--gold); color: #14110b; border-color: var(--gold);
}
.mt-calc__btn.is-active .mt-calc__btn-s { color: #4a3a10; }
.mt-calc__btn--small {
  padding: 10px 0; text-align: center; font-size: 12px; gap: 0;
  align-items: center; justify-content: center;
}
.mt-calc__btn-t { font-family: var(--serif); font-size: 14px; color: #f6eed8; letter-spacing: 0; font-weight: 500; }
.mt-calc__btn:hover .mt-calc__btn-t,
.mt-calc__btn.is-active .mt-calc__btn-t { color: inherit; }
.mt-calc__btn-s { font-size: 10.5px; color: #8a8170; letter-spacing: 0.06em; }

#mt-calc-len:focus { outline: none; border-color: var(--gold-light); }
#mt-calc-len { -moz-appearance: textfield; }
#mt-calc-len::-webkit-outer-spin-button,
#mt-calc-len::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

.mt-calc__result {
  background: #0a0805; border: 1px solid #2a241a; border-left: 3px solid var(--gold);
  padding: 32px 28px; align-self: start; position: sticky; top: 100px;
}
.mt-calc__total {
  margin-top: 12px;
  font-family: var(--serif); font-size: clamp( 38px, 5vw, 54px );
  font-weight: 500; color: var(--gold); line-height: 1;
  letter-spacing: -0.01em;
}
.mt-calc__per-m { margin-top: 8px; color: #9c9280; }
.mt-calc__per-m span { color: #f6eed8; }
.mt-calc__breakdown {
  margin: 28px 0 0; padding: 20px 0 0;
  border-top: 1px solid #2a241a;
  display: grid; grid-template-columns: 1fr auto; gap: 8px 16px;
  font-family: var(--mono); font-size: 12px; letter-spacing: 0.06em;
}
.mt-calc__breakdown dt { color: #8a8170; }
.mt-calc__breakdown dd { margin: 0; color: #c4bba7; text-align: right; }
.mt-calc__note {
  margin-top: 20px; padding: 14px 16px; background: #14110b;
  font-size: 12px; line-height: 1.55; color: #8a8170;
  border-left: 2px solid var(--gold-light);
}
@media (max-width: 900px) {
  .mt-calc__grid { grid-template-columns: 1fr; gap: 36px; }
  .mt-calc__opts--8 { grid-template-columns: repeat(4, 1fr); }
  .mt-calc__result { position: static; }
}
@media (max-width: 520px) {
  .mt-calc__opts--2 { grid-template-columns: 1fr; }
  .mt-calc__opts--8 { grid-template-columns: repeat(2, 1fr); }
}

/* === Standort landing pages — districts cloud + project cards + related grid === */
.st-districts__cloud {
  display: flex; flex-wrap: wrap; gap: 8px; margin-top: 28px;
}
.st-district-tag {
  padding: 10px 18px; background: var(--bg-2); border: 1px solid var(--line);
  font-family: var(--mono); font-size: 12px; letter-spacing: 0.06em;
  color: var(--ink-2); text-decoration: none;
  transition: background .15s, border-color .15s, color .15s, transform .12s;
}
.st-district-tag:hover {
  background: var(--ink); color: var(--gold-light); border-color: var(--ink);
  transform: translateY(-1px);
}

.st-projects__grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px;
  margin-top: 40px;
}
.st-project-card {
  background: #fff; border: 1px solid var(--line);
  padding: 28px 26px; position: relative;
  border-left: 3px solid var(--gold);
  transition: transform .2s, box-shadow .2s;
}
.st-project-card:hover { transform: translateY(-3px); box-shadow: 0 18px 36px -20px rgba(20,17,11,.2); }
.st-project-card__head {
  display: flex; justify-content: space-between; align-items: center;
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.18em;
  color: var(--gold); text-transform: uppercase; margin-bottom: 14px;
}
.st-project-card__year { font-weight: 700; }
.st-project-card__len {
  background: var(--ink); color: var(--gold-light); padding: 4px 10px;
  letter-spacing: 0.12em;
}
.st-project-card__model {
  font-family: var(--serif); font-size: 22px; font-weight: 500;
  color: var(--ink); margin: 0 0 6px; line-height: 1.2;
}
.st-project-card__loc {
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.12em;
  color: var(--ink-mute); text-transform: uppercase; margin-bottom: 14px;
}
.st-project-card__note {
  font-size: 14px; line-height: 1.55; color: var(--ink-dim); margin: 0;
  padding-top: 14px; border-top: 1px solid var(--line);
}

.st-related__grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px;
  margin-top: 36px;
}
.st-related-tile {
  display: block; padding: 24px 22px; background: var(--bg-2);
  border: 1px solid var(--line); text-decoration: none; color: inherit;
  transition: all .2s;
}
.st-related-tile:hover {
  background: var(--ink); border-color: var(--ink);
}
.st-related-tile:hover .st-related-tile__lbl,
.st-related-tile:hover .st-related-tile__title,
.st-related-tile:hover .st-related-tile__sub { color: inherit; }
.st-related-tile:hover .st-related-tile__title { color: var(--gold-light); }
.st-related-tile:hover .st-related-tile__lbl { color: var(--gold-light); }
.st-related-tile:hover .st-related-tile__sub { color: #c4bba7; }
.st-related-tile__lbl {
  font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.2em;
  color: var(--gold); text-transform: uppercase; margin-bottom: 10px;
  font-weight: 600;
}
.st-related-tile__title {
  font-family: var(--serif); font-size: 22px; font-weight: 500;
  color: var(--ink); margin-bottom: 6px;
}
.st-related-tile__sub {
  font-size: 13px; line-height: 1.5; color: var(--ink-dim);
}

@media (max-width: 1024px) {
  .st-projects__grid { grid-template-columns: repeat(2, 1fr); }
  .st-related__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
  .st-projects__grid, .st-related__grid { grid-template-columns: 1fr; }
}

/* === RAL color grid (page-farben.php) === */
.ral-group { margin-bottom: 64px; }
.ral-group__head { margin-bottom: 32px; max-width: 720px; }
.ral-group__head h2 { font-family: var(--serif); font-size: 32px; font-weight: 500; margin: 0 0 8px; color: var(--ink); }
.ral-group__note { font-family: var(--mono); font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--gold); margin: 0; }
.ral-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px; }
.ral-card {
  position: relative; padding: 22px 18px 60px;
  border: 1px solid rgba(20,17,11,0.08);
  display: flex; flex-direction: column; gap: 4px;
  min-height: 130px; transition: transform .2s, box-shadow .2s;
  cursor: default;
}
.ral-card:hover { transform: translateY(-3px); box-shadow: 0 18px 36px -16px rgba(20,17,11,0.4); }
.ral-card__code { font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.18em; opacity: 0.72; text-transform: uppercase; }
.ral-card__name { font-family: var(--serif); font-size: 18px; font-weight: 500; line-height: 1.2; }
.ral-card__bs {
  position: absolute; top: 12px; right: 12px;
  background: rgba(20,17,11,0.85); color: #d4af37;
  padding: 4px 9px; font-family: var(--mono); font-size: 9px;
  letter-spacing: 0.18em; text-transform: uppercase;
  font-weight: 600; backdrop-filter: blur(4px);
}
.ral-card__hex { position: absolute; bottom: 14px; left: 18px; font-family: var(--mono); font-size: 10px; letter-spacing: 0.12em; opacity: 0.55; }
.ral-note {
  margin-top: 32px; padding: 24px 28px;
  background: #fff; border-left: 3px solid var(--gold);
  font-size: 14px; line-height: 1.65; color: var(--ink-dim);
}
.ral-note strong { color: var(--ink); font-family: var(--serif); font-weight: 500; }
@media (max-width: 1100px) { .ral-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 600px) { .ral-grid { grid-template-columns: repeat(2, 1fr); } .ral-group__head h2 { font-size: 26px; } }

/* === Service-Garantien — 8 USPs (front-page.php § VIII.e) === */
.sv-grid-section { background: linear-gradient(180deg, var(--bg-2) 0%, #f1ead8 100%); padding: 96px 0 112px; border-top: 1px solid var(--line); }
.sv-grid {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px;
  margin-bottom: 56px;
}
.sv-card {
  background: #fff; border: 1px solid var(--line); padding: 32px 28px 28px;
  position: relative; transition: transform .25s, border-color .25s, box-shadow .25s;
  display: flex; flex-direction: column;
}
.sv-card:hover {
  transform: translateY(-4px); border-color: var(--gold);
  box-shadow: 0 24px 48px -28px rgba(20,17,11,.25);
}
.sv-card__num {
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.22em;
  color: var(--gold); font-weight: 600; margin-bottom: 18px;
}
.sv-card__title {
  font-family: var(--serif); font-size: 24px; font-weight: 500;
  line-height: 1.15; margin: 0 0 14px; color: var(--ink);
  letter-spacing: -0.01em;
}
.sv-card__title em { color: var(--gold); font-style: italic; }
.sv-card__body {
  font-size: 14.5px; line-height: 1.6; color: var(--ink-dim);
  margin: 0 0 20px; flex-grow: 1;
}
.sv-card__tag {
  margin-top: auto; padding-top: 14px; border-top: 1px solid var(--line);
  font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.12em;
  text-transform: uppercase; color: var(--gold);
}
.sv-grid__footer {
  display: grid; grid-template-columns: 1.4fr auto; gap: 32px;
  align-items: center; padding: 28px 32px;
  background: var(--ink); color: #c4bba7; border-left: 3px solid var(--gold);
}
.sv-grid__footer p {
  margin: 0; font-family: var(--serif); font-size: 18px;
  line-height: 1.5; color: #f0ead9; font-style: italic;
}
.sv-grid__footer .btn { white-space: nowrap; }

@media (max-width: 1100px) { .sv-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) {
  .sv-grid { grid-template-columns: 1fr; }
  .sv-grid__footer { grid-template-columns: 1fr; gap: 20px; }
}

.mt-finishes { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.mt-finish { padding: 26px 24px; background: #fff; border: 1px solid var(--line); }
.mt-finish__title { font-family: var(--serif); font-size: 22px; font-weight: 500; margin-bottom: 10px; }
.mt-finish__body { font-size: 14px; line-height: 1.65; color: var(--ink-dim); }

@media (max-width: 1024px) {
  .mt-cats, .mt-gates, .mt-finishes, .mt-auto-grid { grid-template-columns: repeat(2, 1fr); }
  .mt-spec-grid { grid-template-columns: 1fr; }
  .mt-heights { grid-template-columns: repeat(4, 1fr); }
  .mt-hero__facts { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 720px) {
  .mt-cats, .mt-gates, .mt-finishes, .mt-auto-grid { grid-template-columns: 1fr; }
  .mt-heights { grid-template-columns: repeat(2, 1fr); }
  .mt-hero__facts { grid-template-columns: 1fr; }
  .mt-auto-block { padding: 32px 24px; }
}

/* =============================================================
   /zubehor/ page-zubehor.php — Betonblöcke cennik 18 · CE/EI180/REI360
   ============================================================= */
.zb-hero {
  position: relative; padding: 120px 0 100px; min-height: 560px;
  background: #14110b; color: #f0ead9;
  border-bottom: 1px solid #2a241a;
}
.zb-hero__overlay {
  position: absolute; inset: 0;
  background:
    radial-gradient(ellipse 60% 50% at 70% 30%, rgba(212,175,55,.10), transparent 60%),
    linear-gradient(180deg, transparent 0%, rgba(13,11,7,.6) 100%);
}
.zb-hero__inner { position: relative; z-index: 2; }
.zb-hero__cta { display: flex; gap: 14px; margin-top: 36px; flex-wrap: wrap; }
.zb-hero__facts {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px;
  background: #2a241a; margin-top: 56px; border: 1px solid #2a241a;
}
.zb-hero__facts > div {
  background: #0d0b07; padding: 22px 20px;
  font-family: var(--mono); font-size: 10.5px; letter-spacing: .2em;
  text-transform: uppercase; color: #a9a293; line-height: 1.5;
}
.zb-hero__facts strong {
  display: block; font-family: var(--serif); font-size: 28px; color: #d4af37;
  font-weight: 500; letter-spacing: -.01em; text-transform: none; margin-bottom: 6px;
}

.zb-use { display: grid; grid-template-columns: repeat(2, 1fr); gap: 28px; }
.zb-use__card {
  padding: 36px 32px; background: #fff; border: 1px solid var(--line);
}
.zb-use__n {
  font-family: var(--serif); font-size: 48px; color: var(--gold);
  font-style: italic; font-weight: 500; line-height: 1; margin-bottom: 18px;
}
.zb-use__card h3 { font-family: var(--serif); font-size: 28px; font-weight: 500; margin: 0 0 12px; }
.zb-use__card p { font-size: 15px; line-height: 1.65; color: var(--ink-dim); margin: 0; }
.zb-use__card p strong { color: var(--ink); font-weight: 500; }

.zb-table { border: 1px solid var(--line); background: #fff; }
.zb-table__head,
.zb-table__row {
  display: grid; grid-template-columns: 2fr 1fr 1fr;
  border-bottom: 1px solid var(--line);
}
.zb-table__row:last-child { border-bottom: 0; }
.zb-table__head > div,
.zb-table__row > div {
  padding: 18px 24px; font-size: 15px;
}
.zb-table__head {
  background: var(--ink); color: var(--bg);
  font-family: var(--mono); font-size: 11px; letter-spacing: .22em;
  text-transform: uppercase;
}
.zb-table__head > div { color: var(--bg); font-family: var(--mono); font-size: 11px; }
.zb-table__size {
  font-family: var(--serif); font-size: 17px; font-weight: 500; color: var(--ink);
}
.zb-table__weight {
  font-family: var(--mono); font-size: 12.5px; letter-spacing: .08em;
  color: var(--ink-mute);
}
.zb-table__price {
  font-family: var(--serif); font-size: 19px; color: var(--gold);
  font-weight: 500; font-style: italic; text-align: right;
}
.zb-table__row:nth-child(odd of .zb-table__row) { background: var(--bg-2); }

.zb-notes { display: grid; gap: 10px; font-size: 14px; line-height: 1.7; color: var(--ink-dim); }
.zb-notes strong { color: var(--ink); font-weight: 500; }

.zb-montage { display: grid; grid-template-columns: 1.6fr 1fr; gap: 56px; align-items: start; }
.zb-montage h3 { margin: 0; }
.zb-montage__box {
  padding: 32px 28px; background: #14110b; color: #f0ead9;
  text-align: center;
}
.zb-montage__icon { font-size: 46px; color: var(--gold-light); margin-bottom: 14px; }
.zb-montage__box h4 { font-family: var(--serif); font-size: 22px; font-weight: 500; margin: 0 0 12px; color: #f0ead9; }
.zb-montage__box p { font-size: 14px; line-height: 1.6; color: #c4bba7; margin: 0 0 20px; }
.zb-montage__price {
  padding-top: 16px; border-top: 1px solid #2a241a;
  font-family: var(--mono); font-size: 13px; color: var(--gold-light); line-height: 1.6;
}

.zb-certs { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: #2a241a; border: 1px solid #2a241a; }
.zb-cert { padding: 32px 26px; background: #0d0b07; text-align: center; }
.zb-cert__code {
  font-family: var(--serif); font-size: 40px; color: #d4af37;
  font-weight: 500; line-height: 1; letter-spacing: -.02em; margin-bottom: 18px;
}
.zb-cert h4 { font-family: var(--serif); font-size: 18px; font-weight: 500; color: #f0ead9; margin: 0 0 10px; }
.zb-cert p { font-size: 13px; line-height: 1.6; color: #a9a293; margin: 0; }

@media (max-width: 1024px) {
  .zb-use { grid-template-columns: 1fr; }
  .zb-montage { grid-template-columns: 1fr; }
  .zb-certs { grid-template-columns: repeat(2, 1fr); }
  .zb-hero__facts { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 720px) {
  .zb-certs { grid-template-columns: 1fr; }
  .zb-table__head, .zb-table__row { grid-template-columns: 1.4fr 1fr 1fr; }
  .zb-table__head > div, .zb-table__row > div { padding: 12px 14px; font-size: 13.5px; }
  .zb-hero__facts { grid-template-columns: 1fr; }
}

/* =============================================================
   HOME-PAGE POLISH · 2026-04-25 · visual/UX sweep
   - Pillars BG always visible (done inline)
   - Map saturated (done inline)
   - Stronger buttons (on-dark + gold variants)
   - Family tile "FAMILIE N°I · 13 MODELLE" top label with chip bg
   - Proces '6 Schritte' improvements
   - TCO Rechnung table polish
   - Einwände redesign
   - FAQ peek (3 questions instead of just CTA)
   - Final CTA separation from footer
   - Reviews: more readable avatars + photos
   ============================================================= */

/* === Family tile (Kollektion preview) — top label visible always === */
.section.on-dark a[href*="/stil/"] [style*="FAMILIE N"],
.section.on-dark .koll-family__top {
  /* inline style adds; we reinforce via text-shadow fallback */
  text-shadow: 0 2px 8px rgba(0,0,0,.9), 0 0 2px rgba(0,0,0,.7);
  font-weight: 700 !important;
}

/* Button upgrade — "ALLE ANSEHEN", "KOLLEKTIONSBUCH ÖFFNEN", "ATLAS" */
.btn--filled {
  padding: 18px 32px;
  font-size: 13px;
  letter-spacing: 0.22em;
  font-weight: 700;
  box-shadow: 0 6px 20px -8px rgba(184, 137, 31, 0.4);
  transition: all .25s cubic-bezier(.2,.7,.2,1);
}
.btn--filled:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 28px -8px rgba(184, 137, 31, 0.55);
}
.btn--filled.btn--lg {
  padding: 22px 40px;
  font-size: 14px;
}
/* On-dark variant of filled — use gold, more prominence */
.on-dark .btn--filled,
.ml-cta .btn--filled,
.on-dark .btn--lg.btn--filled {
  background: var(--gold-light);
  color: var(--bg-dark);
  border-color: var(--gold-light);
}
.on-dark .btn--filled:hover,
.ml-cta .btn--filled:hover {
  background: #f0ead9;
  border-color: #f0ead9;
  color: var(--bg-dark);
  box-shadow: 0 12px 32px -10px rgba(212, 175, 55, 0.6);
}

/* Ghost buttons on-dark — white outline, readable */
.on-dark .btn:not(.btn--filled):not(.btn--gold):not(.btn--ghost) {
  border-color: rgba(240, 234, 217, 0.28);
  color: #f0ead9;
  background: transparent;
}
.on-dark .btn:not(.btn--filled):not(.btn--gold):not(.btn--ghost):hover {
  background: rgba(240, 234, 217, 0.08);
  border-color: #f0ead9;
  color: #f0ead9;
}

/* "KOLLEKTIONSBUCH ÖFFNEN" inline link — make it look like button chip */
.section.on-dark a[style*="border-bottom:1px solid var(--gold-light)"]:hover {
  color: #f0ead9 !important;
  border-bottom-color: #f0ead9 !important;
}

/* Bestseller cards — stronger typography (for N°34 Premium style cards) */
.bestseller-card,
.bs-card,
.fam-card {
  background: #fff;
  border: 1px solid var(--line);
  padding: 0;
  transition: transform .25s, box-shadow .25s, border-color .25s;
}
.bestseller-card:hover,
.bs-card:hover,
.fam-card:hover {
  transform: translateY(-4px);
  border-color: var(--gold);
  box-shadow: 0 20px 44px -20px rgba(20, 17, 11, 0.3);
}

/* === Proces "6 Schritte" section — bigger, more readable === */
.proc-step__body h4 {
  font-size: 28px !important;
  line-height: 1.15;
  margin-bottom: 12px;
  color: var(--ink);
}
.proc-step__body p {
  font-size: 16.5px !important;
  line-height: 1.65 !important;
  color: var(--ink-2) !important;
}
.proc-step__body p strong { color: var(--ink); font-weight: 600; }
.proc-step__week {
  font-size: 11px !important;
  padding: 6px 14px !important;
  letter-spacing: 0.22em !important;
  font-weight: 700 !important;
  background: var(--ink);
  color: var(--gold-light);
  border: 1px solid var(--ink) !important;
}

/* Process timeline pills (Tag 1 · Tag 1–3 · Woche 1–2 · …) */
.proc-pill-strip {
  display: flex; flex-wrap: wrap; gap: 10px;
  padding: 16px 0; margin: 24px 0 48px;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.proc-pill {
  padding: 8px 14px; background: var(--bg-2);
  border: 1px solid var(--line-2);
  font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--ink-2); font-weight: 600;
}
.proc-pill--active { background: var(--ink); color: var(--gold-light); border-color: var(--ink); }

/* Big "0 €" callout under process */
.proc-zero-callout {
  text-align: center; padding: 64px 32px; margin: 64px 0 0;
  background: var(--ink); color: var(--bg);
  border: 2px solid var(--gold);
}
.proc-zero-callout__small {
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.26em;
  color: var(--gold-light); text-transform: uppercase; margin-bottom: 20px;
}
.proc-zero-callout__num {
  font-family: var(--serif); font-size: clamp(96px, 14vw, 180px);
  font-weight: 500; color: var(--gold); line-height: 0.95;
  letter-spacing: -0.03em;
}
.proc-zero-callout__desc {
  max-width: 640px; margin: 32px auto 0;
  font-size: 16px; line-height: 1.6; color: #c4bba7;
}

/* === TCO "Ehrliche Rechnung" table polish === */
.tco-table {
  width: 100%; border-collapse: separate; border-spacing: 0;
  margin-top: 32px; background: #fff; border: 1px solid var(--line);
}
.tco-table thead {
  background: var(--ink); color: var(--bg);
}
.tco-table th {
  padding: 18px 22px; text-align: left;
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.22em;
  text-transform: uppercase; font-weight: 600;
}
.tco-table th:nth-child(n+2) { text-align: right; }
.tco-table td {
  padding: 22px; border-bottom: 1px solid var(--line);
  vertical-align: top;
}
.tco-table tbody tr:last-child td { border-bottom: none; }
.tco-table tr.tco-hl { background: linear-gradient(180deg, rgba(212,175,55,.06), rgba(212,175,55,.12)); }
.tco-table tr.tco-hl td:first-child {
  border-left: 3px solid var(--gold);
}
.tco-table td:first-child {
  font-family: var(--serif); font-size: 19px; font-weight: 500; color: var(--ink);
}
.tco-table td small {
  display: block; font-family: var(--mono); font-size: 10.5px;
  letter-spacing: 0.1em; color: var(--ink-mute); text-transform: uppercase;
  margin-top: 4px; font-weight: 500;
}
.tco-table td:nth-child(n+2) {
  text-align: right; font-family: var(--serif); font-size: 17px; font-weight: 500;
  color: var(--ink);
}
.tco-table td.tco-total {
  font-family: var(--serif); font-size: 22px; color: var(--gold); font-style: italic; font-weight: 500;
}

/* === Einwände section — more interesting than narrow columns === */
.einwand-grid {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 28px; margin-top: 56px;
}
.einwand-card {
  background: #fff; padding: 40px 36px;
  border: 1px solid var(--line);
  position: relative;
  transition: transform .25s, box-shadow .25s;
  display: flex; flex-direction: column;
  min-height: 480px;
}
.einwand-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 24px 48px -28px rgba(20, 17, 11, 0.35);
}
.einwand-card__label {
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.28em;
  color: var(--gold); text-transform: uppercase; font-weight: 700;
  margin-bottom: 24px;
  display: inline-block;
  padding: 6px 12px;
  border: 1px solid var(--gold);
  background: rgba(184, 137, 31, 0.05);
}
.einwand-card__q {
  font-family: var(--serif); font-size: 24px; font-weight: 500;
  line-height: 1.25; color: var(--ink);
  margin: 0 0 20px;
  font-style: italic;
  quotes: "»" "«";
}
.einwand-card__a {
  font-size: 15.5px; line-height: 1.65; color: var(--ink-2);
  margin: 0 0 24px; flex: 1;
}
.einwand-card__stat {
  margin-top: auto;
  padding: 24px; background: var(--ink); color: var(--bg);
  text-align: center;
}
.einwand-card__stat-num {
  font-family: var(--serif); font-size: 48px; font-weight: 500;
  color: var(--gold-light); line-height: 1; margin-bottom: 10px;
  font-style: italic;
}
.einwand-card__stat-txt {
  font-size: 13px; line-height: 1.5; color: #c4bba7; margin: 0 0 10px;
}
.einwand-card__stat-src {
  font-family: var(--mono); font-size: 9.5px; letter-spacing: 0.2em;
  color: var(--gold-light); text-transform: uppercase;
  padding-top: 10px; border-top: 1px solid #2a241a;
}

/* =============================================================
   v15.26 STRONA GŁÓWNA — „0 € bis Woche 14" closing strip rebuild
   Adam: „to nic nie wnosi popraw to" (sekcja była pusta wizualnie)
   ============================================================= */
.zero-strip {
  margin-top: 64px;
  padding: 56px 56px 48px;
  background: linear-gradient(135deg, var(--ink) 0%, #1a160e 100%);
  color: #f5efe0;
  position: relative;
  overflow: hidden;
  border-left: 4px solid var(--gold);
  box-shadow: 0 24px 56px rgba(20,17,11,.25);
}
.zero-strip::before {
  content: '';
  position: absolute; top: 0; right: 0;
  width: 280px; height: 100%;
  background: radial-gradient(circle at top right, rgba(212,175,55,.18) 0%, transparent 60%);
  pointer-events: none;
}

/* Hero number */
.zero-strip__hero {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 56px;
  align-items: center;
  padding-bottom: 40px;
  border-bottom: 1px solid rgba(212,175,55,.2);
  margin-bottom: 40px;
}
.zero-strip__eye {
  font-family: var(--mono); font-size: 12px;
  letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--gold-light); font-weight: 700;
  margin-bottom: 16px;
}
.zero-strip__num-wrap {
  display: flex; align-items: center; gap: 24px;
  position: relative;
}
.zero-strip__num {
  font-family: var(--serif); font-size: clamp(120px, 16vw, 200px);
  line-height: .85; color: var(--gold);
  font-weight: 500; letter-spacing: -.04em;
  text-shadow: 0 4px 20px rgba(212,175,55,.25);
}
.zero-strip__cur {
  font-family: var(--serif); font-size: clamp(80px, 11vw, 140px);
  line-height: .9; color: var(--gold);
  font-weight: 400; letter-spacing: -.02em;
}
.zero-strip__seal {
  margin-left: auto;
  color: var(--gold);
  opacity: .55;
  transition: opacity .4s ease, transform .8s ease;
  flex-shrink: 0;
}
.zero-strip__seal:hover { opacity: 1; transform: rotate(-12deg); }
.zero-strip__lede {
  font-family: var(--serif); font-size: 21px;
  line-height: 1.45; color: #d8d0bb;
  margin: 0;
  grid-column: 1 / 2;
}
.zero-strip__lede strong { color: var(--gold-light); font-weight: 600; }

/* "Was Sie NICHT zahlen" — 4 punkty */
.zero-strip__not {
  margin-bottom: 48px;
}
.zero-strip__not-head {
  display: flex; align-items: center; gap: 16px;
  margin-bottom: 22px;
}
.zero-strip__not-eye {
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--gold); font-weight: 700;
  flex-shrink: 0;
}
.zero-strip__not-rule {
  flex: 1;
  height: 1px;
  background: linear-gradient(90deg, var(--gold) 0%, transparent 100%);
}
.zero-strip__not-list {
  list-style: none; padding: 0; margin: 0;
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}
.zero-strip__not-list li {
  display: flex; align-items: flex-start; gap: 12px;
  padding: 18px 20px;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(212,175,55,.15);
}
.zero-strip__x {
  width: 28px; height: 28px;
  display: grid; place-items: center;
  background: rgba(220,53,69,.15);
  color: #ff8b95;
  border: 1px solid rgba(220,53,69,.4);
  border-radius: 50%;
  font-family: var(--serif); font-size: 14px;
  font-weight: 600; line-height: 1;
  flex-shrink: 0;
}
.zero-strip__not-list li > div {
  display: flex; flex-direction: column; gap: 3px;
  min-width: 0;
}
.zero-strip__not-list strong {
  font-family: var(--serif); font-size: 16px;
  color: #fff; font-weight: 600;
  letter-spacing: -0.005em;
  line-height: 1.25;
}
.zero-strip__not-list span {
  font-family: var(--mono); font-size: 10.5px;
  letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--gold-light); font-weight: 600;
  line-height: 1.4;
}

/* Timeline 4-step */
.zero-strip__time {
  padding-top: 32px;
  border-top: 1px solid rgba(212,175,55,.2);
}
.zero-strip__time-track {
  display: grid;
  grid-template-columns: 1fr auto 1fr auto 1fr auto 1fr;
  gap: 16px;
  align-items: flex-start;
}
.zero-strip__time-step {
  display: flex; flex-direction: column; align-items: center;
  text-align: center;
  gap: 8px;
}
.zero-strip__time-dot {
  width: 64px; height: 64px;
  display: grid; place-items: center;
  background: var(--ink);
  color: #c4bba7;
  border: 2px solid rgba(212,175,55,.4);
  border-radius: 50%;
  font-family: var(--serif); font-size: 14px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: -0.005em;
}
.zero-strip__time-dot--zero {
  background: rgba(212,175,55,.08);
  color: var(--gold-light);
  border-color: rgba(212,175,55,.5);
}
.zero-strip__time-dot--pay {
  background: linear-gradient(135deg, var(--gold) 0%, #c79f30 100%);
  color: var(--ink);
  border-color: var(--gold);
  box-shadow: 0 4px 16px rgba(212,175,55,.4);
  font-weight: 700;
}
.zero-strip__time-w {
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--gold-light); font-weight: 700;
  margin-top: 2px;
}
.zero-strip__time-w--pay { color: var(--gold); }
.zero-strip__time-lbl {
  font-family: var(--serif); font-size: 13.5px;
  color: #d8d0bb; line-height: 1.4;
  max-width: 130px;
}
.zero-strip__time-line {
  height: 2px;
  background: linear-gradient(90deg, rgba(212,175,55,.5) 0%, rgba(212,175,55,.2) 100%);
  align-self: center;
  margin-top: 24px; /* center on dot */
  position: relative;
}
.zero-strip__time-line--last {
  background: linear-gradient(90deg, rgba(212,175,55,.2) 0%, var(--gold) 100%);
}

@media (max-width: 980px) {
  .zero-strip { padding: 40px 32px; }
  .zero-strip__hero { grid-template-columns: 1fr; gap: 24px; padding-bottom: 32px; }
  .zero-strip__not-list { grid-template-columns: 1fr 1fr; }
  .zero-strip__time-track { grid-template-columns: 1fr; gap: 24px; }
  .zero-strip__time-line { display: none; }
}
@media (max-width: 720px) {
  .zero-strip { padding: 32px 22px; }
  .zero-strip__num { font-size: 100px; }
  .zero-strip__cur { font-size: 72px; }
  .zero-strip__seal { display: none; }
  .zero-strip__lede { font-size: 17px; }
  .zero-strip__not-list { grid-template-columns: 1fr; }
}


/* =============================================================
   v15.29 METALL · 4 sekcje wzbogacone wizualnie
   Adam: „ulepsz Automatisierung, Schnellpreis, Farben, Formularz (sticky kontakt)"
   ============================================================= */

/* --- 1. AUTOMATISIERUNG (.mt-auto-block) — 6 cards z ikonami zamiast plain text --- */
.mt-auto-block {
  margin-top: 64px;
  padding: 48px;
  background: linear-gradient(135deg, var(--ink) 0%, #1a160e 100%);
  color: #f5efe0;
  border-left: 4px solid var(--gold);
  box-shadow: 0 16px 40px rgba(20,17,11,.18);
  position: relative;
  overflow: hidden;
}
.mt-auto-block::before {
  content: '';
  position: absolute; top: 0; right: 0;
  width: 280px; height: 280px;
  background: radial-gradient(circle at top right, rgba(212,175,55,.16) 0%, transparent 65%);
  pointer-events: none;
}
.mt-auto-block .display-3 {
  color: #fff;
  margin: 0 0 32px;
  position: relative; z-index: 1;
}
.mt-auto-block .display-3 em { color: var(--gold-light); font-style: italic; }
.mt-auto-grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 16px !important;
  position: relative; z-index: 1;
}
.mt-auto-grid > div {
  display: flex !important; align-items: flex-start; gap: 14px;
  padding: 22px !important;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(212,175,55,.18);
  border-left: 3px solid var(--gold);
  font-family: var(--serif);
  font-size: 14.5px !important;
  line-height: 1.55 !important;
  color: #d8d0bb !important;
  transition: all .25s ease;
  position: relative;
}
.mt-auto-grid > div:hover {
  background: rgba(212,175,55,.06);
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(0,0,0,.2);
}
.mt-auto-grid > div::before {
  content: '';
  display: block;
  width: 38px; height: 38px;
  flex-shrink: 0;
  background: var(--gold); color: var(--ink);
  border-radius: 50%;
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="%2314110b" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="20 6 9 17 4 12"/></svg>');
  background-position: center; background-repeat: no-repeat;
  box-shadow: 0 3px 10px rgba(212,175,55,.35);
}
.mt-auto-grid > div strong {
  display: block;
  font-family: var(--mono); font-size: 11.5px !important;
  letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--gold) !important; font-weight: 700;
  margin-bottom: 4px;
}

/* --- 2. SCHNELLPREIS-KONFIGURATOR (.mt-calc) — premium polish --- */
.mt-calc__total {
  font-family: var(--serif) !important;
  font-size: 64px !important;
  color: var(--gold) !important;
  font-weight: 500;
  letter-spacing: -0.02em;
  line-height: 1;
  text-shadow: 0 4px 20px rgba(212,175,55,.25);
  margin: 12px 0 4px;
}
.mt-calc__per-m {
  font-family: var(--mono); font-size: 12px;
  letter-spacing: 0.14em;
  color: var(--gold-light) !important;
  font-weight: 600;
}
.mt-calc__breakdown {
  margin: 24px 0 0;
  padding: 20px 0;
  border-top: 1px solid rgba(212,175,55,.18);
  border-bottom: 1px solid rgba(212,175,55,.18);
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 8px 16px;
  font-family: var(--mono); font-size: 11.5px;
  letter-spacing: 0.08em;
}
.mt-calc__breakdown dt { color: #c4bba7; font-weight: 600; }
.mt-calc__breakdown dd {
  margin: 0; text-align: right;
  font-family: var(--serif); font-size: 14px;
  color: #fff; font-weight: 600;
  letter-spacing: -0.005em;
}
.mt-calc__btn {
  background: rgba(255,255,255,.04) !important;
  border: 1px solid rgba(212,175,55,.18) !important;
  color: #d8d0bb !important;
  transition: all .2s ease;
}
.mt-calc__btn:hover {
  background: rgba(212,175,55,.08) !important;
  border-color: var(--gold) !important;
  color: #fff !important;
}
.mt-calc__btn.is-active {
  background: linear-gradient(135deg, var(--gold) 0%, #c79f30 100%) !important;
  border-color: var(--gold) !important;
  color: var(--ink) !important;
  box-shadow: 0 4px 14px rgba(212,175,55,.35);
}
.mt-calc__btn-t {
  display: block;
  font-family: var(--serif); font-size: 15px;
  font-weight: 600;
  letter-spacing: -0.005em;
}
.mt-calc__btn-s {
  display: block;
  font-family: var(--mono); font-size: 10.5px;
  letter-spacing: 0.1em;
  margin-top: 3px;
  opacity: .85;
}
.mt-calc__result {
  background: linear-gradient(180deg, rgba(0,0,0,.35) 0%, rgba(0,0,0,.55) 100%);
  border: 1px solid rgba(212,175,55,.25);
  border-left: 4px solid var(--gold);
  padding: 32px !important;
  position: sticky;
  top: 100px;
  align-self: start;
  box-shadow: 0 16px 40px rgba(0,0,0,.3);
}
.mt-calc__note {
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px solid rgba(212,175,55,.15);
  font-family: var(--serif); font-size: 13px;
  line-height: 1.55; color: #c4bba7;
}

/* --- 3. FARBEN & VEREDELUNG (.mt-finishes) — 3 premium cards z swatch --- */
.mt-finishes {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 20px !important;
  margin-top: 48px !important;
}
.mt-finish {
  position: relative;
  background: #fff !important;
  border: 1px solid var(--line) !important;
  border-left: 4px solid var(--gold) !important;
  padding: 0 !important;
  overflow: hidden;
  transition: all .25s ease;
  box-shadow: 0 6px 20px rgba(20,17,11,.04);
}
.mt-finish:hover {
  transform: translateY(-3px);
  box-shadow: 0 16px 36px rgba(20,17,11,.1);
  border-color: var(--gold);
}
.mt-finish::before {
  content: '';
  display: block;
  height: 140px;
  background: linear-gradient(135deg, #9aa0a8 0%, #787f87 100%); /* domyślne dla feuerverzinkt */
  border-bottom: 1px solid var(--line);
}
.mt-finish:nth-child(2)::before {
  background: linear-gradient(135deg, #d4af37 0%, #9d6e1f 50%, #c79f30 100%); /* gold dla RAL */
}
.mt-finish:nth-child(3)::before {
  background: linear-gradient(135deg, #2a3a4a 0%, #1a2a3a 100%); /* dark dla PVC anthrazit */
}
.mt-finish__title {
  font-family: var(--serif) !important;
  font-size: 22px !important;
  color: var(--ink) !important;
  font-weight: 600 !important;
  letter-spacing: -0.005em !important;
  padding: 22px 26px 8px !important;
  margin: 0 !important;
}
.mt-finish__body {
  font-family: var(--serif); font-size: 14.5px;
  line-height: 1.6;
  color: #4a4335 !important;
  padding: 0 26px 24px !important;
  margin: 0 !important;
}

/* --- 4. ANFRAGE-FORMULARZ (.sp-contact) — sticky scroll po prawej --- */
.sp-contact {
  position: sticky;
  top: 100px;
  align-self: start;
  background: linear-gradient(180deg, var(--bg-2) 0%, #fdfaf3 100%);
  border: 1px solid var(--line);
  border-left: 4px solid var(--gold);
  padding: 32px;
  box-shadow: 0 12px 32px rgba(20,17,11,.06);
}
.sp-contact__eyebrow {
  font-size: 12px !important;
  color: var(--gold) !important;
  letter-spacing: 0.22em !important;
  font-weight: 700;
}
.sp-contact__block {
  margin-top: 22px;
  padding-top: 22px;
  border-top: 1px solid var(--line);
}
.sp-contact__block:first-of-type { padding-top: 22px; }
.sp-contact__label {
  font-size: 11px !important;
  color: var(--gold) !important;
  letter-spacing: 0.18em !important;
  font-weight: 700 !important;
  text-transform: uppercase;
}
.sp-contact__value {
  font-family: var(--serif);
  font-size: 19px;
  color: var(--ink);
  font-weight: 500;
  margin-top: 6px;
  letter-spacing: -0.005em;
}
.sp-contact__value--big { font-size: 24px; }
.sp-contact__value a { color: var(--ink); text-decoration: none; }
.sp-contact__value a:hover { color: var(--gold); }
.sp-contact__meta {
  font-size: 11px !important;
  color: #5a5142 !important;
  margin-top: 4px;
}
.sp-contact__trust {
  margin-top: 28px;
  padding-top: 22px;
  border-top: 1px solid var(--line);
  display: flex; flex-direction: column; gap: 8px;
  font-family: var(--mono); font-size: 12px;
  letter-spacing: 0.06em;
  color: var(--ink);
  font-weight: 600;
}
.sp-contact__trust > div::first-letter { color: var(--gold); }

/* RESPONSIVE */
@media (max-width: 1100px) {
  .mt-auto-grid { grid-template-columns: repeat(2, 1fr) !important; }
  .mt-finishes { grid-template-columns: 1fr !important; }
  .mt-finish::before { height: 100px; }
  .sp-contact { position: static; }
  .mt-calc__result { position: static; }
}
@media (max-width: 720px) {
  .mt-auto-block { padding: 32px 22px; }
  .mt-auto-grid { grid-template-columns: 1fr !important; }
  .mt-calc__total { font-size: 48px !important; }
  .sp-contact { padding: 24px 22px; }
}


/* =============================================================
   v15.25 METALL · sub-nav anchor-bar + Doppelstab section rebuild
   Adam: „rozbuduj to czytelniej sekcje, zrób linki SEO"
   ============================================================= */

/* SUB-NAV anchor-bar (sticky after hero) */
.mt-subnav {
  position: sticky; top: 76px;       /* pod main nav */
  z-index: 50;
  background: var(--bg-2);
  border-top: 1px solid var(--gold);
  border-bottom: 1px solid var(--line);
  box-shadow: 0 4px 12px rgba(20,17,11,.04);
  padding: 14px 0;
}
.mt-subnav__inner {
  display: flex; align-items: center; gap: 24px;
  flex-wrap: wrap;
}
.mt-subnav__label {
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.18em; text-transform: uppercase;
  color: #5a5142; font-weight: 700;
  flex-shrink: 0;
}
.mt-subnav__links {
  list-style: none; padding: 0; margin: 0;
  display: flex; flex-wrap: wrap; gap: 6px;
}
.mt-subnav__link {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 8px 14px;
  background: #fff;
  border: 1px solid var(--line);
  font-family: var(--mono); font-size: 11.5px;
  letter-spacing: 0.1em; text-transform: uppercase; font-weight: 700;
  color: var(--ink);
  text-decoration: none;
  transition: all .2s ease;
}
.mt-subnav__link:hover {
  background: var(--ink); color: #fff; border-color: var(--ink);
}
.mt-subnav__link--accent {
  background: linear-gradient(135deg, #fffbf0 0%, #fef0c4 100%);
  border-color: var(--gold);
}
.mt-subnav__link--accent:hover { background: var(--gold); color: var(--ink); border-color: var(--gold); }
.mt-subnav__num {
  display: inline-grid; place-items: center;
  min-width: 22px; height: 22px;
  padding: 0 6px;
  background: var(--gold); color: var(--ink);
  font-size: 10px; font-weight: 700;
  border-radius: 100px;
}
.mt-subnav__link:hover .mt-subnav__num { background: var(--gold-light); color: var(--ink); }

/* DOPPELSTAB section — rebuild */
.dsm-sec { padding: 96px 0 !important; }
.dsm-sec h2 em { color: var(--gold); font-style: italic; }

.dsm-toc {
  display: flex; flex-wrap: wrap; gap: 8px;
  margin: 32px 0 48px;
  padding: 16px 20px;
  background: linear-gradient(135deg, #fffbf0 0%, #fff 100%);
  border: 1px solid var(--gold);
  border-left: 4px solid var(--gold);
}
.dsm-toc a {
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.12em; text-transform: uppercase; font-weight: 700;
  color: var(--ink);
  text-decoration: none;
  padding: 6px 12px;
  background: #fff;
  border: 1px solid var(--line);
  transition: all .2s ease;
}
.dsm-toc a:hover {
  background: var(--gold); color: var(--ink);
  border-color: var(--gold);
  transform: translateY(-1px);
}

.dsm-hero {
  margin: 0 0 56px;
  position: relative;
  aspect-ratio: 21/9;
  overflow: hidden;
  background: #2a241a;
  box-shadow: 0 16px 40px rgba(20,17,11,.12);
}
.dsm-hero img {
  width: 100%; height: 100%;
  object-fit: cover; display: block;
}
.dsm-hero figcaption {
  position: absolute; bottom: 0; left: 0; right: 0;
  display: flex; justify-content: space-between; gap: 16px;
  padding: 16px 24px;
  background: linear-gradient(180deg, transparent, rgba(20,17,11,.85));
  color: #f5efe0;
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.16em; text-transform: uppercase; font-weight: 600;
}
.dsm-hero figcaption span:last-child { color: var(--gold-light); }

.dsm-anchor-section {
  margin-top: 64px;
  scroll-margin-top: 160px; /* offset dla sticky main-nav + sub-nav */
}
.dsm-h3 {
  display: flex; align-items: baseline; gap: 16px;
  font-family: var(--serif); font-size: 32px;
  color: var(--ink); font-weight: 500;
  letter-spacing: -0.01em; line-height: 1.2;
  margin: 0 0 12px;
  padding-bottom: 14px;
  border-bottom: 2px solid var(--gold);
}
.dsm-h3__num {
  font-family: var(--mono); font-size: 14px;
  letter-spacing: 0.16em; color: var(--gold);
  font-weight: 700;
  padding: 4px 10px;
  background: var(--ink);
  border-radius: 3px;
  flex-shrink: 0;
}
.dsm-h3-sub {
  font-family: var(--serif); font-size: 15.5px;
  color: #4a4335; line-height: 1.55;
  margin: 0 0 24px;
}

/* Drahttypen — wzbogacenie istniejącego .mt-spec */
.dsm-sec .mt-spec-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-top: 24px; }
.dsm-sec .mt-spec {
  background: #fff;
  border: 1px solid var(--line);
  border-left: 4px solid var(--gold);
  padding: 26px 28px;
  position: relative;
}
.mt-spec__badge {
  display: inline-block;
  font-family: var(--mono); font-size: 10px;
  letter-spacing: 0.18em; text-transform: uppercase; font-weight: 700;
  background: var(--ink); color: var(--gold);
  padding: 4px 10px;
  margin-bottom: 12px;
}
.mt-spec__badge--gold { background: var(--gold); color: var(--ink); }
.mt-spec__price {
  margin-top: 16px; padding-top: 14px;
  border-top: 1px solid var(--line);
  font-family: var(--mono); font-size: 12px;
  letter-spacing: 0.12em; text-transform: uppercase;
  color: #4a4335; font-weight: 600;
}
.mt-spec__price strong { color: var(--gold); font-size: 16px; font-family: var(--serif); font-weight: 600; letter-spacing: -0.005em; text-transform: none; }

/* Wysokości — bar-chart wizualny */
.dsm-heights {
  display: grid;
  grid-template-columns: repeat(8, 1fr);
  gap: 8px;
  margin-top: 16px;
}
.dsm-h-card {
  background: #fff;
  border: 1px solid var(--line);
  padding: 14px 10px 16px;
  text-align: center;
  position: relative;
  transition: all .2s ease;
}
.dsm-h-card:hover {
  border-color: var(--gold);
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(20,17,11,.08);
}
.dsm-h-card--star {
  background: linear-gradient(135deg, #fffbf0 0%, #fff 100%);
  border-color: var(--gold);
}
.dsm-h-card__bar {
  width: 6px; height: 60px;
  background: var(--bg-2);
  margin: 0 auto 12px;
  position: relative;
  display: flex; align-items: flex-end;
  border-radius: 2px;
}
.dsm-h-card__bar-fill {
  width: 100%;
  background: linear-gradient(180deg, var(--gold) 0%, #c79f30 100%);
  border-radius: 2px;
}
.dsm-h-card--star .dsm-h-card__bar-fill { background: linear-gradient(180deg, var(--ink), #2a241a); }
.dsm-h-card__num {
  font-family: var(--serif); font-size: 18px;
  color: var(--ink); font-weight: 600;
  letter-spacing: -0.01em; line-height: 1;
}
.dsm-h-card__num span {
  font-family: var(--mono); font-size: 9px;
  letter-spacing: 0.1em; color: var(--gold);
  margin-left: 2px; font-weight: 600;
}
.dsm-h-card__lbl {
  font-family: var(--mono); font-size: 9.5px;
  letter-spacing: 0.1em; text-transform: uppercase;
  color: #5a5142; font-weight: 700;
  margin-top: 6px;
}
.dsm-h-card__use {
  font-family: var(--serif); font-size: 11.5px;
  color: #4a4335; line-height: 1.4;
  margin-top: 4px;
}

/* Farben & Beschichtung */
.dsm-finish {
  display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px;
}
.dsm-finish__card {
  background: #fff; border: 1px solid var(--line);
  padding: 18px 16px;
  text-align: center;
  transition: all .2s ease;
}
.dsm-finish__card:hover {
  border-color: var(--gold);
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(20,17,11,.08);
}
.dsm-finish__icon {
  width: 56px; height: 56px;
  border-radius: 50%;
  margin: 0 auto 12px;
  border: 1px solid rgba(20,17,11,.2);
  box-shadow: 0 2px 8px rgba(20,17,11,.15);
}
.dsm-finish__card strong {
  display: block;
  font-family: var(--serif); font-size: 14.5px;
  color: var(--ink); font-weight: 600;
  margin-bottom: 6px;
}
.dsm-finish__card span {
  display: block;
  font-family: var(--serif); font-size: 12.5px;
  color: #4a4335; line-height: 1.45;
}

/* Sichtschutz-Optionen */
.dsm-sicht-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.dsm-sicht-card {
  background: #fff; border: 1px solid var(--line);
  border-left: 3px solid var(--gold);
  padding: 22px 24px;
  position: relative;
  transition: all .2s ease;
}
.dsm-sicht-card:hover {
  transform: translateX(4px);
  box-shadow: 0 8px 20px rgba(20,17,11,.06);
}
.dsm-sicht-card__num {
  position: absolute; top: 18px; right: 18px;
  width: 32px; height: 32px;
  display: grid; place-items: center;
  background: var(--gold); color: var(--ink);
  font-family: var(--serif); font-size: 16px; font-weight: 600;
  border-radius: 50%;
}
.dsm-sicht-card strong {
  display: block;
  font-family: var(--serif); font-size: 17px;
  color: var(--ink); font-weight: 600;
  margin-bottom: 6px;
  padding-right: 40px;
}
.dsm-sicht-card p {
  font-family: var(--serif); font-size: 14px;
  color: #4a4335; line-height: 1.55;
  margin: 0;
}
.dsm-sicht-card p strong {
  display: inline; font-size: inherit; padding-right: 0;
  color: var(--ink);
}

/* Galerie */
.dsm-gallery {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr;
  grid-template-rows: 240px 240px;
  gap: 8px;
}
.dsm-gallery__tile {
  position: relative; overflow: hidden;
  background: #2a241a;
  text-decoration: none;
}
.dsm-gallery__tile:nth-child(1) { grid-row: 1 / 3; grid-column: 1 / 2; }
.dsm-gallery__tile img {
  width: 100%; height: 100%;
  object-fit: cover; display: block;
  transition: transform .5s cubic-bezier(.2,.7,.2,1);
}
.dsm-gallery__tile:hover img { transform: scale(1.06); }
.dsm-gallery__cap {
  position: absolute; bottom: 0; left: 0; right: 0;
  padding: 12px 16px;
  background: linear-gradient(180deg, transparent, rgba(20,17,11,.85));
  color: #f5efe0;
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.12em; font-weight: 600;
}

/* Use-cases */
.dsm-uses {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px;
}
.dsm-use {
  background: #fff; border: 1px solid var(--line);
  padding: 22px 24px;
  transition: all .2s ease;
}
.dsm-use:hover {
  border-color: var(--gold);
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(20,17,11,.06);
}
.dsm-use__icon {
  font-size: 32px; line-height: 1;
  margin-bottom: 12px;
}
.dsm-use strong {
  display: block;
  font-family: var(--serif); font-size: 17px;
  color: var(--ink); font-weight: 600;
  margin-bottom: 8px;
}
.dsm-use p {
  font-family: var(--serif); font-size: 14px;
  color: #4a4335; line-height: 1.55;
  margin: 0;
}
.dsm-use p em { color: var(--gold); font-style: italic; font-weight: 600; }

/* CTA bottom */
.dsm-cta {
  margin-top: 56px;
  padding: 28px 32px;
  background: linear-gradient(135deg, var(--ink) 0%, #1a160e 100%);
  color: #f5efe0;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 24px;
  align-items: center;
  border-left: 4px solid var(--gold);
  box-shadow: 0 12px 32px rgba(20,17,11,.18);
}
.dsm-cta__text strong {
  display: block;
  font-family: var(--serif); font-size: 22px;
  color: #fff; font-weight: 500;
  letter-spacing: -0.01em;
  margin-bottom: 4px;
}
.dsm-cta__text span {
  display: block;
  font-family: var(--mono); font-size: 11.5px;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--gold-light); font-weight: 600;
}
.dsm-cta__btns { display: flex; gap: 12px; flex-shrink: 0; }
.dsm-cta__btns .btn--filled {
  background: var(--gold); color: var(--ink); border-color: var(--gold);
}
.dsm-cta__btns .btn--filled:hover { background: var(--gold-light); border-color: var(--gold-light); }
.dsm-cta__btns .btn:not(.btn--filled) {
  color: #f5efe0;
  border-color: rgba(245,239,224,.4);
}
.dsm-cta__btns .btn:not(.btn--filled):hover {
  background: rgba(245,239,224,.1);
  border-color: var(--gold-light);
}

@media (max-width: 1100px) {
  .mt-subnav { top: 64px; }
  .dsm-heights { grid-template-columns: repeat(4, 1fr); }
  .dsm-finish { grid-template-columns: repeat(3, 1fr); }
  .dsm-uses { grid-template-columns: 1fr 1fr; }
  .dsm-gallery { grid-template-columns: 1fr 1fr; grid-template-rows: 200px 200px 200px; }
  .dsm-gallery__tile:nth-child(1) { grid-row: 1 / 3; }
}
@media (max-width: 720px) {
  .mt-subnav { padding: 10px 0; position: static; }
  .mt-subnav__inner { gap: 12px; }
  .mt-subnav__label { width: 100%; }
  .mt-subnav__link { font-size: 10.5px; padding: 7px 10px; }
  .dsm-toc { padding: 12px 14px; }
  .dsm-h3 { font-size: 22px; flex-direction: column; gap: 8px; align-items: flex-start; }
  .dsm-sec .mt-spec-grid { grid-template-columns: 1fr; }
  .dsm-heights { grid-template-columns: repeat(2, 1fr); }
  .dsm-finish { grid-template-columns: 1fr 1fr; }
  .dsm-sicht-grid { grid-template-columns: 1fr; }
  .dsm-uses { grid-template-columns: 1fr; }
  .dsm-cta { grid-template-columns: 1fr; }
  .dsm-cta__btns { flex-direction: column; }
  .dsm-cta__btns .btn { justify-content: center; }
  .dsm-gallery { grid-template-columns: 1fr; grid-template-rows: repeat(5, 200px); }
  .dsm-gallery__tile:nth-child(1) { grid-row: 1; grid-column: 1; }
}


/* =============================================================
   v15.22 STRONA GŁÓWNA — manifest-quote + versprech-head premium
   Adam: „odstara to strona główna, masz pliki grafiki, własny gust, pomyśl"
   ============================================================= */

/* --- MANIFEST PULL-QUOTE — premium 2-col z fotografią produkcji --- */
.manifest { padding: 0; } /* zero padding — photo wypełnia od krawędzi do krawędzi */
.manifest--cinematic { padding-top: 32px; padding-bottom: 96px; }

/* v15.44 — RESTRUKTURA: full-bleed photo, cytat OVERLAY, proofs pod nim
   Photo dominuje na 100% szerokości. Sztywne ramy GO. */
.manifest__grid {
  display: grid;
  grid-template-columns: 1fr 1.5fr;
  gap: 48px;
  align-items: center;
} /* legacy fallback — nie używane v15.44+ */
.manifest__quote { position: relative; }
.manifest__monogram {
  position: absolute;
  top: -40px; right: -20px;
  font-family: var(--serif);
  font-size: clamp(140px, 18vw, 240px);
  color: rgba(212,175,55,.06);
  font-style: italic; font-weight: 500;
  letter-spacing: -.04em;
  line-height: 1;
  pointer-events: none;
  z-index: 0;
}
.manifest__open {
  display: block;
  font-family: var(--serif);
  font-size: clamp(80px, 10vw, 160px);
  line-height: .6;
  color: var(--gold);
  font-style: italic; font-weight: 500;
  margin-bottom: -10px;
  position: relative; z-index: 1;
}
.manifest__text {
  font-family: var(--serif);
  font-size: clamp(28px, 3.4vw, 46px);
  line-height: 1.2;
  color: var(--ink);
  margin: 0;
  font-weight: 400;
  letter-spacing: -.012em;
  text-wrap: balance;
  position: relative; z-index: 1;
}
.manifest__text em { color: var(--gold); font-style: italic; }
.manifest__sig {
  margin-top: 44px;
  padding-top: 24px;
  border-top: 1px solid var(--line-2);
  display: flex; justify-content: space-between; align-items: center;
  gap: 24px;
  position: relative; z-index: 1;
}
.manifest__sig-name strong {
  display: block;
  font-family: var(--serif);
  font-size: 22px; font-weight: 500;
  color: var(--ink);
  letter-spacing: -.005em;
}
.manifest__sig-name span {
  display: block; margin-top: 4px;
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.18em; text-transform: uppercase;
  color: #5a5142; font-weight: 600;
}
.manifest__sig-stamp {
  color: var(--gold);
  flex-shrink: 0;
  opacity: .85;
  transition: opacity .3s ease, transform .3s ease;
}
.manifest__sig-stamp:hover { opacity: 1; transform: rotate(-6deg); }

/* v15.43 BONUS — manifest proof points (mini stats-strip pod cytatem Adama) */
.manifest__proofs {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-top: 36px;
  padding-top: 28px;
  border-top: 1px solid var(--line-2);
}
.manifest__proof {
  position: relative;
  z-index: 1;
}
.manifest__proof-num {
  font-family: var(--serif);
  font-size: clamp(28px, 3vw, 38px);
  font-weight: 500;
  line-height: 1;
  color: var(--ink);
  letter-spacing: -0.015em;
}
.manifest__proof-num span {
  color: var(--gold);
  font-size: 0.55em;
  margin-left: 2px;
}
.manifest__proof-lbl {
  margin-top: 8px;
  font-family: var(--mono);
  font-size: 10.5px;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: var(--ink-mute);
  font-weight: 600;
  line-height: 1.4;
}

/* Manifest responsive override (Adam: „mega rozbuduj") */
@media (max-width: 1100px) {
  .manifest__grid { grid-template-columns: 1fr; gap: 48px; }
  .manifest__photo { aspect-ratio: 16/10; max-height: 540px; }
}
@media (max-width: 640px) {
  .manifest__proofs { grid-template-columns: 1fr; gap: 16px; padding-top: 22px; margin-top: 28px; }
  .manifest__photo { aspect-ratio: 4/3; }
  .manifest__photo::before, .manifest__photo > .manifest__photo-corner { width: 24px; height: 24px; }
}

.manifest__photo {
  position: relative;
  margin: 0;
  /* v15.43 — Adam: „ostre krawędzie, zdjęcie sprzedaje" → 0px radius, większy aspect
     16:10 (1.6) — szeroki cinematic format, bardziej dramatic niż 3/2 */
  aspect-ratio: 16/10;
  overflow: hidden;
  background: #2a241a;
  box-shadow: 0 32px 80px -20px rgba(20,17,11,.45),
              0 0 0 1px rgba(20,17,11,.08);
  border-radius: 0; /* OSTRE krawędzie — Adam wymaga */
  /* Premium frame border (subtle gold-line akcent w rogach) */
  position: relative;
}
.manifest__photo::before {
  /* corner-decoration top-left */
  content: '';
  position: absolute;
  top: 14px; left: 14px;
  width: 36px; height: 36px;
  border-top: 2px solid rgba(212,175,55,.85);
  border-left: 2px solid rgba(212,175,55,.85);
  z-index: 3;
  pointer-events: none;
}
.manifest__photo > .manifest__photo-corner {
  /* corner-decoration bottom-right (przez span w HTML) */
  position: absolute;
  bottom: 14px; right: 14px;
  width: 36px; height: 36px;
  border-bottom: 2px solid rgba(212,175,55,.85);
  border-right: 2px solid rgba(212,175,55,.85);
  z-index: 3;
  pointer-events: none;
}
.manifest__photo img {
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  filter: contrast(1.08) saturate(1.02) brightness(1.02);
  transition: transform 1.2s cubic-bezier(.2,.7,.2,1);
}
.manifest__photo:hover img { transform: scale(1.06); }
.manifest__photo:hover img { transform: scale(1.04); }
.manifest__photo::after {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(180deg, transparent 50%, rgba(0,0,0,.55) 100%);
  pointer-events: none;
}
.manifest__photo-cap {
  position: absolute; bottom: 0; left: 0; right: 0;
  display: flex; justify-content: space-between; align-items: end;
  padding: 22px 24px;
  color: #fff;
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.18em; text-transform: uppercase;
  font-weight: 600;
  z-index: 2;
  text-shadow: 0 2px 8px rgba(0,0,0,.6);
}
.manifest__photo-cap-eye { color: var(--gold-light); }


/* --- VERSPRECH HEAD — premium 3-col z stempel-stamp SVG --- */
.versprech-head {
  display: grid;
  grid-template-columns: 1.1fr 1fr auto;
  gap: 56px;
  align-items: center;
  margin-bottom: 80px;
}
.versprech-head__title { min-width: 0; }
.versprech-head__title h2 em { color: var(--gold); font-style: italic; }
.versprech-head__lede {
  border-left: 3px solid var(--gold);
  padding-left: 24px;
}
.versprech-head__lede .lede {
  font-size: 17px; line-height: 1.65; margin: 0;
  color: #4a4335;
}
.versprech-head__lede .lede strong { color: var(--ink); font-weight: 600; }
.versprech-head__bullets {
  list-style: none; padding: 0;
  margin: 22px 0 0;
  display: flex; flex-direction: column; gap: 8px;
}
.versprech-head__bullets li {
  font-family: var(--mono); font-size: 12px;
  letter-spacing: 0.12em; text-transform: uppercase;
  color: #4a4335; font-weight: 700;
  display: flex; align-items: center; gap: 10px;
  line-height: 1.4;
}
.versprech-head__check {
  display: inline-grid; place-items: center;
  width: 22px; height: 22px;
  background: var(--gold); color: var(--ink);
  border-radius: 50%;
  font-size: 13px; font-weight: 700;
  flex-shrink: 0;
  box-shadow: 0 2px 6px rgba(212,175,55,.3);
}
.versprech-head__stamp {
  color: var(--gold);
  flex-shrink: 0;
  opacity: .9;
  transition: transform .5s ease, opacity .3s ease;
}
.versprech-head__stamp:hover { opacity: 1; transform: rotate(-12deg); }

@media (max-width: 1100px) {
  .manifest__grid { grid-template-columns: 1fr; gap: 40px; }
  .manifest__photo { aspect-ratio: 16/9; max-height: 480px; }
  .versprech-head { grid-template-columns: 1fr 1fr; }
  .versprech-head__stamp { grid-column: 1 / -1; justify-self: center; margin-top: 16px; }
}
@media (max-width: 720px) {
  .manifest { padding: 56px 0; }
  .manifest__sig { flex-direction: column; align-items: flex-start; gap: 18px; }
  .versprech-head { grid-template-columns: 1fr; gap: 32px; }
  .versprech-head__lede { padding-left: 18px; }
  .versprech-head__stamp svg { width: 110px; height: 110px; }
}


/* === FAQ peek v15.20 — 2-col z visual side panel + numerowane karty === */
.faq-peek-wrap { margin-top: 72px; }
.faq-peek-head { max-width: 760px; margin-bottom: 40px; }
.faq-peek-head h3 em { color: var(--gold); font-style: italic; }
.faq-peek-lede {
  margin-top: 18px;
  font-family: var(--serif); font-size: 16.5px;
  color: #4a4335; line-height: 1.6;
  max-width: 640px;
}

.faq-peek-grid {
  display: grid;
  grid-template-columns: 1.5fr 1fr;
  gap: 32px;
  align-items: start;
}

/* Lewa: pytania */
.faq-peek {
  display: grid; gap: 14px; margin: 0;
}
.faq-peek__item {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 18px; align-items: flex-start;
  background: #fff; border: 1px solid var(--line);
  border-left: 4px solid var(--gold);
  padding: 22px 26px;
  transition: border-color .2s, transform .2s, box-shadow .2s;
  box-shadow: 0 4px 14px rgba(20,17,11,.04);
}
.faq-peek__item:hover {
  transform: translateX(4px);
  box-shadow: 0 12px 28px rgba(20,17,11,.08);
  border-color: var(--gold);
}
.faq-peek__num {
  font-family: var(--serif); font-size: 28px;
  color: var(--gold); font-weight: 600;
  letter-spacing: -0.02em; line-height: 1;
  width: 36px; text-align: center;
}
.faq-peek__body { min-width: 0; }
.faq-peek__q {
  font-family: var(--serif); font-size: 19px; font-weight: 600;
  color: var(--ink); margin: 0 0 8px; line-height: 1.3;
  letter-spacing: -0.005em;
}
.faq-peek__q::before { content: none; }
.faq-peek__a {
  font-family: var(--serif);
  font-size: 14.5px; line-height: 1.65;
  color: #4a4335; margin: 0;
}
.faq-peek__a strong { color: var(--ink); font-weight: 600; }

/* Prawa: visual side panel — Adam-call CTA */
.faq-peek-side {
  position: relative;
  background: linear-gradient(135deg, var(--ink) 0%, #1a160e 100%);
  color: #f5efe0;
  padding: 32px 28px;
  border-left: 4px solid var(--gold);
  box-shadow: 0 12px 32px rgba(20,17,11,.18);
  overflow: hidden;
  border-radius: 4px;
}
.faq-peek-side::before {
  content: '';
  position: absolute; top: 0; right: 0;
  width: 140px; height: 140px;
  background: radial-gradient(circle at top right, rgba(212,175,55,.18) 0%, transparent 70%);
  pointer-events: none;
}
.faq-peek-side__pulse {
  position: absolute; top: 22px; right: 22px;
  width: 10px; height: 10px; border-radius: 50%;
  background: #2faa53;
  box-shadow: 0 0 0 4px rgba(47,170,83,.25);
}
.faq-peek-side__pulse::after {
  content: ''; position: absolute; inset: -4px;
  border-radius: 50%; border: 2px solid #2faa53;
  animation: faqpulse 2s ease-out infinite;
}
@keyframes faqpulse { 0% { transform: scale(1); opacity: .8; } 100% { transform: scale(2.4); opacity: 0; } }
.faq-peek-side__title {
  font-family: var(--serif);
  font-size: 36px; font-weight: 500;
  margin: 8px 0 12px;
  color: #fff; line-height: 1;
  letter-spacing: -0.015em;
}
.faq-peek-side__title em { color: var(--gold-light); font-style: italic; }
.faq-peek-side__sub {
  font-family: var(--serif); font-size: 15px;
  color: #c4bba7; line-height: 1.5;
  margin: 0 0 24px;
}
.faq-peek-side__phone {
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-rows: auto auto;
  gap: 4px 14px;
  align-items: center;
  padding: 18px 0;
  border-top: 1px solid rgba(212,175,55,.18);
  border-bottom: 1px solid rgba(212,175,55,.18);
}
.faq-peek-side__phone-icon {
  grid-row: 1 / 3;
  width: 44px; height: 44px;
  display: grid; place-items: center;
  background: var(--gold); color: var(--ink);
  border-radius: 50%;
  box-shadow: 0 4px 12px rgba(212,175,55,.4);
}
.faq-peek-side__phone-num {
  font-family: var(--serif); font-size: 22px;
  color: #fff; font-weight: 500;
  letter-spacing: -0.005em;
  text-decoration: none;
  line-height: 1.1;
}
.faq-peek-side__phone-num:hover { color: var(--gold-light); }
.faq-peek-side__phone-meta {
  font-family: var(--mono); font-size: 10.5px;
  letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--gold-light); font-weight: 600;
}
.faq-peek-side__divider {
  text-align: center;
  font-family: var(--mono); font-size: 10.5px;
  letter-spacing: 0.22em; text-transform: uppercase;
  color: rgba(245,239,224,.45);
  margin: 14px 0;
  position: relative;
}
.faq-peek-side__wa {
  display: flex; align-items: center; justify-content: center; gap: 10px;
  padding: 14px 18px;
  background: #25d366; color: #fff;
  text-decoration: none;
  font-family: var(--mono); font-size: 12px;
  letter-spacing: 0.14em; text-transform: uppercase; font-weight: 700;
  border-radius: 3px;
  transition: background .2s, transform .2s;
  box-shadow: 0 4px 12px rgba(37,211,102,.3);
}
.faq-peek-side__wa:hover { background: #1da851; transform: translateY(-2px); }
.faq-peek-side__stats {
  display: grid; grid-template-columns: 1fr 1fr; gap: 12px;
  margin-top: 22px;
  padding-top: 18px;
  border-top: 1px solid rgba(212,175,55,.18);
}
.faq-peek-side__stats div { text-align: center; }
.faq-peek-side__stats strong {
  display: block;
  font-family: var(--serif); font-size: 22px;
  color: var(--gold-light); font-weight: 600;
  letter-spacing: -0.01em; line-height: 1;
}
.faq-peek-side__stats span {
  display: block;
  font-family: var(--mono); font-size: 9.5px;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: #c4bba7; font-weight: 600;
  margin-top: 4px; line-height: 1.4;
}

.faq-peek__cta {
  margin-top: 40px; display: flex; justify-content: space-between;
  align-items: center; flex-wrap: wrap; gap: 20px;
  padding-top: 28px; border-top: 1px solid var(--line);
}
.faq-peek__cta-note {
  font-family: var(--mono); font-size: 12px; letter-spacing: 0.16em;
  color: #5a5142; text-transform: uppercase; font-weight: 700;
}

/* RESPONSIVE */
@media (max-width: 980px) {
  .faq-peek-grid { grid-template-columns: 1fr; gap: 24px; }
  .faq-peek-side { padding: 24px 22px; }
  .faq-peek-side__title { font-size: 28px; }
}
@media (max-width: 720px) {
  .faq-peek__item { grid-template-columns: 1fr; gap: 4px; padding: 18px 20px; }
  .faq-peek__num { width: auto; text-align: left; font-size: 22px; }
  .faq-peek__q { font-size: 17px; }
  .faq-peek__cta { flex-direction: column; align-items: flex-start; }
}

/* === Google Reviews grid — more, cleaner === */
.reviews-strip {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 24px; margin-top: 48px;
}
.g-review__avatar--initials {
  letter-spacing: 0.05em;
}
.g-review__photos-mini {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px;
  margin-top: 10px;
}
.g-review__photos-mini > div {
  aspect-ratio: 1; background: var(--bg-2) no-repeat center/cover;
  cursor: pointer; transition: transform .2s;
}
.g-review__photos-mini > div:hover { transform: scale(1.04); }

/* === Home final CTA — separation from footer === */
.home-final-cta {
  padding: 140px 0 160px !important;
  position: relative;
  margin-bottom: 0;
}
.home-final-cta::after {
  content: ''; position: absolute; bottom: 0; left: 0; right: 0;
  height: 8px;
  background: linear-gradient(90deg, transparent, var(--gold), transparent);
  opacity: 0.6;
}
.home-final-cta__three {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 1px; background: #2a241a; border: 1px solid #2a241a;
  margin: 56px auto 0; max-width: 1000px;
}
.home-final-cta__option {
  background: #0d0b07; padding: 40px 36px;
  text-decoration: none; color: #f0ead9;
  transition: background .2s;
  display: flex; flex-direction: column; gap: 14px;
  position: relative;
}
.home-final-cta__option:hover { background: #14110b; }
.home-final-cta__option-num {
  font-family: var(--serif); font-size: 36px; color: var(--gold-light);
  font-weight: 500; font-style: italic; line-height: 1;
}
.home-final-cta__option-title {
  font-family: var(--serif); font-size: 22px; font-weight: 500;
  margin: 4px 0; color: #f0ead9;
}
.home-final-cta__option-desc {
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.18em;
  color: #a9a293; text-transform: uppercase; line-height: 1.5;
}
.home-final-cta__option-arrow {
  margin-top: auto; color: var(--gold-light); font-family: var(--serif);
  font-size: 28px; align-self: flex-end; line-height: 1;
}

/* === Certifikation badges at bottom — more consistent === */
.cert-strip { gap: 36px !important; }
.cert-badge { opacity: 0.85; transition: opacity .2s; }
.cert-badge:hover { opacity: 1; }

/* === Lightbox overlay — translucent so page breathes through (user request 2026-04-25) === */
.sp-lightbox {
  background: rgba(20, 17, 11, 0.55) !important;
  backdrop-filter: blur(2px) !important;
  -webkit-backdrop-filter: blur(2px) !important;
}
.sp-lightbox__img {
  box-shadow: 0 30px 90px rgba(0, 0, 0, 0.65), 0 0 0 1px rgba(255, 255, 255, 0.08);
}
.sp-lightbox.sp-lightbox--light {
  background: rgba(20, 17, 11, 0.45) !important;
}

/* === Responsive tuning for all home sections === */
@media (max-width: 1024px) {
  .einwand-grid { grid-template-columns: 1fr; gap: 20px; }
  .einwand-card { min-height: auto; }
  .home-final-cta__three { grid-template-columns: 1fr; }
  .reviews-strip { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 720px) {
  .proc-zero-callout { padding: 40px 24px; }
  .proc-zero-callout__num { font-size: 84px; }
  .tco-table { font-size: 13px; }
  .tco-table th, .tco-table td { padding: 14px 12px; }
  .reviews-strip { grid-template-columns: 1fr; }
  .home-final-cta { padding: 80px 0 100px !important; }
  .btn--filled.btn--lg { padding: 18px 28px; font-size: 13px; }
}

/* =============================================================
   BESTSELLER GRID · home §III (rebuild 2026-04-25 01:45)
   ============================================================= */
.bs-section { padding: 110px 0; background: var(--bg); }

.bs-head {
  display: grid; grid-template-columns: 1.2fr 1fr;
  gap: 48px; align-items: end;
  margin-bottom: 64px;
}
.bs-head > a.btn { justify-self: end; align-self: end; }

.bs-grid {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

.bs-card {
  display: flex; flex-direction: column;
  background: #fff; border: 1px solid var(--line);
  text-decoration: none; color: inherit;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
  position: relative; overflow: hidden;
}
.bs-card:hover {
  transform: translateY(-4px);
  border-color: var(--gold);
  box-shadow: 0 28px 60px -28px rgba(20, 17, 11, 0.35);
}

.bs-card__rank {
  position: absolute; top: 16px; right: 16px; z-index: 2;
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.2em;
  font-weight: 700; text-transform: uppercase;
  background: rgba(20, 17, 11, 0.82); color: var(--gold-light);
  padding: 6px 10px;
}

.bs-card__img {
  aspect-ratio: 5/4;
  position: relative; overflow: hidden;
  background: linear-gradient(180deg, #f4ede0 0%, var(--bg-2) 100%);
  border-bottom: 1px solid var(--line);
  padding: 16px;
}
/* v15.24 — Adam: „oddal trochę zdjęcia bo nie widać całych" — contain + padding zamiast cover-crop */
.bs-card__img img {
  width: 100%; height: 100%;
  object-fit: contain;
  object-position: center bottom;
  display: block;
  transition: transform .6s cubic-bezier(.2, .7, .2, 1);
}
.bs-card:hover .bs-card__img img { transform: scale(1.04); }

.bs-card__badge {
  position: absolute; top: 16px; left: 16px; z-index: 2;
  background: var(--ink); color: var(--gold-light);
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.22em;
  padding: 6px 10px; font-weight: 700; text-transform: uppercase;
  border: 1px solid var(--gold);
}

/* v15.42b — Adam: „biale tlo ma byc!!!" — karty Neue Linie miały dark gradient bg
   na zdjęciu, ale Adam chce białe tło tak samo jak Standard. Zostaje tylko gold-stroke
   wokół całej karty żeby była wyróżniona jako Neue Linie. */
.bs-card--nl .bs-card__img {
  background: #fff;
  border-bottom: 1px solid var(--line);
}
.bs-card--nl .bs-card__img img { filter: none; }
.bs-card--nl {
  border: 1px solid var(--gold-light, #d4af37);
  box-shadow: 0 0 0 1px rgba(212, 175, 55, .15) inset;
}
.bs-card--nl:hover {
  border-color: var(--gold, #9d6e1f);
  box-shadow: 0 28px 60px -28px rgba(20, 17, 11, 0.35), 0 0 0 1px rgba(212, 175, 55, .25) inset;
}
.bs-card--nl .bs-card__badge {
  background: var(--gold-light, #d4af37); color: var(--ink);
  border-color: var(--gold, #9d6e1f);
}

.bs-card__body {
  padding: 26px 28px 28px;
  display: flex; flex-direction: column; gap: 18px;
  flex: 1;
}

/* v15.42a — Adam: „karty zlepione" — zmiana z grid 1fr/auto (cena obok tytułu)
   na flex-column (cena POD tytułem). Tytuł i cena nie nachodzą na siebie nawet
   przy wąskich kartach (<340px) */
.bs-card__head {
  display: flex; flex-direction: column;
  gap: 16px; align-items: stretch;
}
.bs-card__head > div:first-child { width: 100%; min-width: 0; }

.bs-card__num {
  font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.22em;
  color: var(--gold); font-weight: 700; text-transform: uppercase;
  margin-bottom: 6px;
}

.bs-card__name {
  font-family: var(--serif); font-size: 26px; font-weight: 500;
  margin: 0; line-height: 1.15; letter-spacing: -0.01em;
  color: var(--ink);
  overflow-wrap: break-word; word-wrap: break-word; hyphens: auto;
}

/* v15.42a — cena pod tytułem, gold border-top, "PRO LFD. METER" prawo (margin-left:auto) */
.bs-card__price {
  display: flex; align-items: baseline; gap: 10px;
  width: 100%;
  padding-top: 14px;
  border-top: 1px solid rgba(217,209,189,.6);
  white-space: nowrap;
}
.bs-card__price-num {
  font-family: var(--serif); font-size: 30px; font-weight: 500;
  color: var(--gold); line-height: 1; letter-spacing: -0.02em;
  flex-shrink: 0;
}
.bs-card__price-num em {
  font-size: 20px; font-style: normal;
  color: var(--gold); margin-left: 2px;
}
.bs-card__price-unit {
  font-family: var(--mono); font-size: 9.5px; letter-spacing: 0.16em;
  color: var(--ink-mute); text-transform: uppercase;
  margin-left: auto;
  flex-shrink: 1; min-width: 0;
}

.bs-card__meta {
  display: flex; flex-wrap: wrap; gap: 8px 20px;
  padding-top: 16px; padding-bottom: 4px;
  border-top: 1px solid var(--line);
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.14em;
  color: var(--ink-mute); text-transform: uppercase;
}
.bs-card__meta strong {
  color: var(--ink); font-family: var(--serif); font-size: 15px;
  font-weight: 500; letter-spacing: 0; margin-right: 2px;
}
.bs-card__rating { color: var(--gold); font-weight: 600; letter-spacing: 0.05em; }

.bs-card__cta {
  display: flex; justify-content: space-between; align-items: center;
  margin-top: auto;
  padding-top: 16px; border-top: 1px solid var(--line);
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--ink-dim); font-weight: 600;
}
.bs-card__arrow {
  color: var(--gold); font-size: 16px; letter-spacing: 0;
  transition: transform .2s ease;
}
.bs-card:hover .bs-card__arrow { transform: translateX(4px); }

.bs-bottom {
  margin-top: 40px; padding-top: 24px;
  border-top: 1px solid var(--line);
  display: flex; justify-content: space-between; align-items: center;
  flex-wrap: wrap; gap: 16px;
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.18em;
  color: var(--ink-mute); text-transform: uppercase;
}
.bs-bottom a {
  color: var(--gold); border-bottom: 1px solid var(--gold);
  padding-bottom: 2px; text-decoration: none;
  transition: color .2s;
}
.bs-bottom a:hover { color: var(--ink); border-bottom-color: var(--ink); }

@media (max-width: 1100px) {
  .bs-head { grid-template-columns: 1fr; gap: 24px; }
  .bs-head > a.btn { justify-self: start; }
  .bs-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 720px) {
  .bs-section { padding: 72px 0; }
  .bs-grid { grid-template-columns: 1fr; }
  .bs-card__name { font-size: 24px; }
  .bs-card__price-num { font-size: 26px; }
  .bs-card__price-unit { font-size: 9px; }
}

/* =============================================================
   ATELIER MOSAIC · home §VIII.a (clickable tiles + lightbox)
   ============================================================= */
.atelier-mosaic {
  display: grid; grid-template-columns: repeat(12, 1fr);
  grid-auto-rows: 120px; gap: 6px;
}
.atelier-tile {
  transition: transform .3s ease;
  display: block;
}
.atelier-tile::after {
  content: '⊕'; position: absolute; top: 14px; right: 14px;
  width: 36px; height: 36px; border-radius: 50%;
  background: rgba(20, 17, 11, 0.72); color: var(--gold-light);
  font-size: 18px; line-height: 36px; text-align: center;
  opacity: 0; transform: translateY(-4px);
  transition: opacity .2s, transform .2s;
  pointer-events: none; z-index: 3;
}
.atelier-tile:hover { transform: scale(1.008); }
.atelier-tile:hover img { transform: scale(1.06); }
.atelier-tile:hover::after { opacity: 1; transform: translateY(0); }
.atelier-tile:focus-visible { outline: 3px solid var(--gold); outline-offset: -3px; }

@media (max-width: 1024px) {
  .atelier-mosaic { grid-template-columns: repeat(6, 1fr); grid-auto-rows: 110px; }
  .atelier-tile { grid-column-end: span min(6, var(--cs, 12)) !important; }
}

/* ============================================================
   .sp-quickform — compact lead form right under the PDP hero
   2026-05-04 — replaces "skoki do dolnej #anfrage": user wybiera w hero,
   te same wartości natychmiast widzi w recap i wysyła w jednym kliknięciu
   ============================================================ */

.sp-quickform {
  background: #fff;
  padding: 80px 0 88px;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.sp-quickform__head { max-width: 880px; margin: 0 auto 56px; text-align: center; }
.sp-quickform__head .eyebrow { color: var(--gold); }
.sp-quickform__head h2 { color: var(--ink); }
.sp-quickform__head h2 em { color: var(--gold); font-style: italic; }
.sp-quickform__head .lede { color: var(--ink-dim); margin-left: auto; margin-right: auto; max-width: 640px; }
.sp-quickform__head .lede strong { color: var(--ink); font-weight: 500; }

.sp-quickform__grid {
  display: grid;
  grid-template-columns: 360px 1fr;
  gap: 48px;
  align-items: start;
  max-width: 1180px; margin: 0 auto;
}

/* Recap card (sticky) — left column */
.sp-quickform__recap {
  background: var(--bg-2);
  padding: 32px 28px;
  border-left: 4px solid var(--gold);
  position: sticky; top: 100px;
  box-shadow: 0 4px 24px rgba(20,17,11,0.04);
}
.sp-quickform__recap-eyebrow {
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.22em;
  text-transform: uppercase; color: var(--gold); font-weight: 700;
  margin-bottom: 20px;
}
.sp-quickform__recap-list { list-style: none; margin: 0; padding: 0; }
.sp-quickform__recap-list li {
  display: flex; justify-content: space-between; align-items: baseline; gap: 12px;
  padding: 14px 0; border-bottom: 1px solid var(--line);
}
.sp-quickform__recap-list li:last-of-type { border-bottom: 0; }
.sp-quickform__recap-k {
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--ink-mute); font-weight: 500;
}
.sp-quickform__recap-v {
  font-family: var(--serif); font-size: 17px; color: var(--ink);
  font-weight: 500; text-align: right; line-height: 1.3;
}
.sp-quickform__recap-total {
  margin-top: 14px; padding: 18px 20px !important;
  background: var(--ink); color: var(--bg);
  border-bottom: 0 !important;
}
.sp-quickform__recap-total .sp-quickform__recap-k { color: var(--gold-light); }
.sp-quickform__recap-price {
  font-family: var(--serif); font-size: 32px; color: var(--gold);
  font-weight: 500; letter-spacing: -.02em;
}
.sp-quickform__recap-note {
  margin-top: 18px; font-size: 12px; color: var(--ink-mute);
  font-style: italic; line-height: 1.5;
}
.sp-quickform__recap-back {
  display: inline-block; margin-top: 16px;
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--gold);
  text-decoration: none; border-bottom: 1px solid var(--gold);
  padding-bottom: 3px; transition: color .15s, border-color .15s;
}
.sp-quickform__recap-back:hover { color: var(--ink); border-bottom-color: var(--ink); }

/* Form column — right */
.sp-quickform__form {
  background: #fff;
  padding: 0;
}

/* Trust strip below */
.sp-quickform__trust {
  margin-top: 48px; max-width: 1180px; margin-left: auto; margin-right: auto;
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px;
  padding: 24px 0; border-top: 1px solid var(--line);
  font-family: var(--mono); font-size: 12px; letter-spacing: 0.08em;
  color: var(--ink-dim); text-transform: uppercase; font-weight: 500;
  text-align: center;
}

/* Compact form variant — adb-form--compact (rendered by [adb_form compact="true"]) */
.adb-form--compact { padding: 0; background: transparent; box-shadow: none; }
.adb-form--compact .adb-form__section {
  padding: 0; border: 0; margin: 0;
}
.adb-form--compact .adb-form__section legend {
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.22em;
  text-transform: uppercase; color: var(--gold); font-weight: 700;
  padding: 0 0 16px; border-bottom: 2px solid var(--ink);
  width: 100%; margin-bottom: 24px;
}
.adb-form--compact .adb-form__grid { grid-template-columns: 1fr 1fr; gap: 16px; }
.adb-form--compact .adb-form__field--full { grid-column: 1 / -1; }
.adb-form--compact .adb-form__field input,
.adb-form--compact .adb-form__field textarea,
.adb-form--compact .adb-form__field select {
  font-size: 15px; padding: 12px 14px;
  border: 1px solid var(--line-2); background: #fff;
  font-family: var(--sans);
}
.adb-form--compact .adb-form__field input:focus,
.adb-form--compact .adb-form__field textarea:focus {
  outline: 2px solid var(--gold); outline-offset: -1px;
}
.adb-form--compact .adb-form__submit {
  width: 100%;
  background: var(--ink); color: var(--bg);
  padding: 18px 24px; font-size: 15px; font-weight: 600;
  letter-spacing: 0.05em; text-transform: none;
  border: 0; cursor: pointer; transition: background .15s;
  font-family: var(--sans);
  margin-top: 16px;
}
.adb-form--compact .adb-form__submit:hover { background: var(--gold); color: var(--ink); }
.adb-form--compact .adb-form__privacy {
  font-size: 12px; color: var(--ink-mute); margin-top: 12px;
  text-align: center; font-style: italic;
}
.adb-form--compact .adb-form__consent {
  font-size: 13px; line-height: 1.5; color: var(--ink-dim);
  display: flex; gap: 10px; align-items: flex-start;
  padding: 16px 18px; background: var(--bg-2); border-left: 3px solid var(--gold);
  margin-top: 20px;
}
.adb-form--compact .adb-form__consent input { margin-top: 3px; flex-shrink: 0; }

/* Tablet/mobile */
@media (max-width: 980px) {
  .sp-quickform { padding: 56px 0 64px; }
  .sp-quickform__head { margin-bottom: 40px; }
  .sp-quickform__grid { grid-template-columns: 1fr; gap: 32px; }
  .sp-quickform__recap { position: static; }
  .sp-quickform__trust { grid-template-columns: 1fr 1fr; gap: 12px; text-align: left; }
}
@media (max-width: 640px) {
  .sp-quickform { padding: 40px 0 48px; }
  .sp-quickform__recap-list li { padding: 12px 0; }
  .sp-quickform__recap-v { font-size: 15px; }
  .sp-quickform__recap-price { font-size: 26px; }
  .adb-form--compact .adb-form__grid { grid-template-columns: 1fr; }
  .sp-quickform__trust { grid-template-columns: 1fr; }
}

/* ============================================================
   .sp-len-* — compact length picker (input + unit + quick presets)
   2026-05-04 — replaces full-width input that wasted space for 2-3 digits
   ============================================================ */

.sp-len-wrap { display: flex; flex-direction: column; gap: 10px; }
.sp-len-wrap .sp-len-row { display: flex; align-items: stretch; gap: 0; }
.sp-len-input {
  width: 110px;
  padding: 12px 14px;
  border: 1px solid var(--line-2);
  border-right: 0;
  font-family: var(--serif);
  font-size: 22px;
  text-align: right;
  background: #fff;
  color: var(--ink);
  -moz-appearance: textfield;
}
.sp-len-input::-webkit-outer-spin-button,
.sp-len-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.sp-len-input:focus { outline: 2px solid var(--gold); outline-offset: -2px; }
.sp-len-unit {
  display: inline-flex; align-items: center;
  padding: 0 16px;
  background: var(--bg-2);
  border: 1px solid var(--line-2);
  font-family: var(--mono);
  font-size: 14px;
  font-weight: 500;
  color: var(--ink-mute);
  letter-spacing: 0.05em;
}
.sp-len-wrap { flex-direction: row; align-items: center; flex-wrap: wrap; gap: 0 8px; }
.sp-len-wrap .sp-len-input + .sp-len-unit { margin-right: 12px; }

.sp-len-quick {
  display: flex; gap: 4px; flex: 1; min-width: 0;
}
.sp-len-quick__btn {
  flex: 1;
  min-width: 38px;
  padding: 10px 6px;
  background: #fff;
  border: 1px solid var(--line-2);
  font-family: var(--mono);
  font-size: 12px;
  letter-spacing: 0.05em;
  color: var(--ink-dim);
  cursor: pointer;
  transition: all .15s ease;
  text-align: center;
}
.sp-len-quick__btn:hover { background: var(--bg-2); color: var(--ink); }
.sp-len-quick__btn.is-active {
  background: var(--gold);
  color: var(--bg-dark);
  border-color: var(--gold);
  font-weight: 700;
}

/* ============================================================
   .sp-calc-result — bright Vorkalkulation card (replaces dark cramped one)
   ============================================================ */

.sp-calc-result {
  margin-top: 28px;
  padding: 24px 28px;
  background: linear-gradient(135deg, #1a1610 0%, var(--bg-dark) 100%);
  color: #f5efe0;
  position: relative;
  border-left: 4px solid var(--gold);
  transition: box-shadow .35s ease;
}
.sp-calc-result.is-pulse {
  animation: sp-calc-pulse .55s ease-out;
}
@keyframes sp-calc-pulse {
  0%   { box-shadow: 0 0 0 0 rgba(212,175,55,0.55); }
  60%  { box-shadow: 0 0 0 12px rgba(212,175,55,0); }
  100% { box-shadow: 0 0 0 0 rgba(212,175,55,0); }
}
.sp-calc-result__head {
  display: flex; flex-direction: column; gap: 4px;
  margin-bottom: 14px;
}
.sp-calc-result__label {
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.28em; color: var(--gold);
  font-weight: 700;
}
.sp-calc-result__sub {
  font-family: var(--mono); font-size: 10.5px;
  letter-spacing: 0.12em; color: rgba(245,239,224,0.55);
  text-transform: uppercase;
}
.sp-calc-result__num {
  display: flex; align-items: baseline; gap: 8px;
  margin: 6px 0 16px;
}
.sp-calc-result__total {
  font-family: var(--serif);
  font-size: 56px;
  font-weight: 500;
  color: var(--gold-light);
  line-height: 1;
  letter-spacing: -0.02em;
  font-feature-settings: "lnum";
  text-shadow: 0 2px 24px rgba(212,175,55,0.25);
}
.sp-calc-result__cur {
  font-family: var(--serif);
  font-size: 38px;
  color: var(--gold);
  font-weight: 400;
  line-height: 1;
}
.sp-calc-result__foot {
  display: flex; justify-content: space-between;
  padding-top: 14px; border-top: 1px solid rgba(212,175,55,0.18);
  font-family: var(--mono); font-size: 11.5px;
  color: rgba(245,239,224,0.78);
  letter-spacing: 0.08em;
}
.sp-calc-result__foot strong { color: var(--gold-light); font-weight: 700; }

/* ============================================================
   .sp-why — "Warum dieses Modell" section (replaces generic § I copy)
   ============================================================ */

.sp-why__head { max-width: 880px; margin: 0 auto 64px; text-align: center; }
.sp-why__head .eyebrow { color: var(--gold); }
.sp-why__head h2 em { color: var(--gold); font-style: italic; }
.sp-why__head .lede { margin-left: auto; margin-right: auto; }

.sp-why__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
  max-width: 1080px; margin: 0 auto;
}
.sp-why__pt {
  padding: 36px 32px;
  background: #fff;
  border: 1px solid var(--line);
  display: flex; flex-direction: column; gap: 14px;
  position: relative;
  transition: transform .25s ease, border-color .25s ease;
}
.sp-why__pt:hover {
  transform: translateY(-3px);
  border-color: var(--gold);
}
.sp-why__num {
  font-family: var(--serif);
  font-size: 56px;
  font-weight: 400;
  color: var(--gold);
  line-height: 1;
  letter-spacing: -0.02em;
  opacity: .85;
}
.sp-why__title {
  font-family: var(--serif);
  font-size: 22px;
  font-weight: 500;
  color: var(--ink);
  margin: 0;
  letter-spacing: -0.005em;
}
.sp-why__body {
  font-size: 14.5px;
  line-height: 1.65;
  color: var(--ink-dim);
  margin: 0;
}

/* ============================================================
   .sp-reviews — Google reviews carousel (4 per page, prev/next/dots/flags)
   2026-05-04 v2: Adam: „mam 70+ opinii a tu są tylko 4... carousel po 4 przechodzą,
   większe napisy, flagi narodowości, inicjały imię+nazwisko."
   ============================================================ */

.sp-reviews__head {
  display: grid;
  grid-template-columns: 340px 1fr;
  gap: 56px;
  align-items: center;
  margin-bottom: 56px;
}
.sp-reviews__badge {
  display: flex;
  gap: 18px;
  align-items: center;
  padding: 28px 28px;
  background: #fff;
  border: 1px solid var(--line);
  border-left: 4px solid #4285F4;
  box-shadow: 0 4px 24px rgba(20,17,11,0.04);
}
.sp-reviews__rating-row { display: flex; align-items: baseline; gap: 8px; }
.sp-reviews__stars { color: #f4b400; font-size: 18px; letter-spacing: 1.5px; line-height: 1; }
.sp-reviews__rating {
  font-family: var(--serif); font-size: 38px;
  font-weight: 500; color: var(--ink);
  line-height: 1; letter-spacing: -0.02em;
}
.sp-reviews__count {
  font-family: var(--mono); font-size: 13px;
  color: var(--ink-mute);
}
.sp-reviews__source {
  margin-top: 8px;
  font-family: var(--mono); font-size: 12px;
  color: var(--ink-mute); letter-spacing: 0.05em;
}
.sp-reviews__source strong { color: var(--ink); font-weight: 600; }
.sp-reviews__headline .eyebrow { color: var(--gold); }
.sp-reviews__headline h2 em { color: var(--gold); font-style: italic; }
.sp-reviews__headline .lede strong { color: var(--ink); font-weight: 500; }

/* Carousel */
.sp-reviews__carousel {
  position: relative;
  margin-bottom: 32px;
}
.sp-reviews__viewport {
  overflow: hidden;
  margin: 0 -12px;
}
.sp-reviews__track {
  display: flex;
  flex-wrap: nowrap;
  transition: transform .55s cubic-bezier(.4,0,.2,1);
  will-change: transform;
}
.sp-review {
  flex: 0 0 25%;
  max-width: 25%;
  padding: 0 12px;
  box-sizing: border-box;
  display: flex;
}
.sp-review > * { /* not the inline children of <article>, but if we wrap... */ }

/* Inner card via descendant — keep .sp-review as flex-track item AND visual card */
.sp-review {
  background: transparent !important;
  border: 0 !important;
  flex-direction: column;
}
/* Real visual surface: pseudo-wrapper through padding/box on direct children */
.sp-review {
  position: relative;
}
.sp-review::before {
  content: '';
  position: absolute;
  inset: 0 12px;
  background: #fff;
  border: 1px solid var(--line);
  transition: border-color .2s, transform .2s, box-shadow .2s;
  z-index: 0;
}
.sp-review:hover::before {
  border-color: var(--gold);
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(20,17,11,0.08);
}
.sp-review > * { position: relative; z-index: 1; }
.sp-review .sp-review__head,
.sp-review .sp-review__body,
.sp-review .sp-review__author {
  margin-left: 12px; margin-right: 12px;
}
.sp-review .sp-review__head    { padding: 24px 22px 0; margin-left: 0; margin-right: 0; }
.sp-review .sp-review__body    { padding: 16px 22px 0; margin-left: 0; margin-right: 0; flex: 1; }
.sp-review .sp-review__author  { padding: 16px 22px 24px; margin: 16px 0 0; border-top: 1px solid var(--line); position: relative; }
.sp-review .sp-review__author { margin-left: 12px; margin-right: 12px; padding-left: 22px; padding-right: 22px; }

.sp-review__head {
  display: flex; justify-content: space-between; align-items: center;
}
.sp-review__stars { color: #f4b400; font-size: 17px; letter-spacing: 2px; }
.sp-review__date {
  font-family: var(--mono); font-size: 11.5px;
  color: var(--ink-mute); letter-spacing: 0.1em;
}
.sp-review__body {
  font-family: var(--serif); font-size: 17px;
  line-height: 1.65; color: var(--ink);
  margin: 0; font-style: italic;
  position: relative;
}
.sp-review__author {
  display: flex; align-items: center; gap: 14px;
}
.sp-review__avatar {
  width: 48px; height: 48px;
  background: linear-gradient(135deg, var(--gold) 0%, #c79f30 100%);
  color: var(--bg-dark);
  display: grid; place-items: center;
  font-family: var(--serif); font-size: 18px; font-weight: 600;
  border-radius: 50%;
  flex-shrink: 0;
  letter-spacing: -0.02em;
  box-shadow: 0 2px 8px rgba(212,175,55,0.25);
}
.sp-review__author-meta { min-width: 0; flex: 1; }
.sp-review__name { font-family: var(--serif); font-size: 17px; color: var(--ink); font-weight: 500; line-height: 1.2; }
.sp-review__loc {
  font-family: var(--mono); font-size: 11.5px;
  color: var(--ink-mute); letter-spacing: 0.06em;
  margin-top: 4px;
  display: inline-flex; align-items: center; gap: 6px;
}
.sp-review__flag { font-size: 14px; line-height: 1; }

/* Carousel navigation */
.sp-reviews__nav {
  display: flex; gap: 12px; align-items: center;
  justify-content: center;
  margin-top: 28px;
  font-family: var(--mono); font-size: 12px;
  color: var(--ink-mute); letter-spacing: 0.12em;
}
.sp-reviews__nav-btn {
  width: 44px; height: 44px;
  background: #fff;
  border: 1px solid var(--line-2);
  font-family: var(--serif); font-size: 22px;
  color: var(--ink);
  cursor: pointer;
  display: grid; place-items: center;
  transition: all .15s ease;
  line-height: 1;
}
.sp-reviews__nav-btn:hover:not(:disabled) {
  background: var(--ink); color: var(--bg);
  border-color: var(--ink);
}
.sp-reviews__nav-btn:disabled {
  opacity: .35; cursor: not-allowed;
}
.sp-reviews__nav-counter {
  min-width: 60px; text-align: center;
  font-weight: 600; color: var(--ink);
}

.sp-reviews__dots {
  display: flex; justify-content: center; gap: 8px;
  margin-top: 16px;
}
.sp-reviews__dot {
  width: 10px; height: 10px;
  background: var(--line-2);
  border: 0;
  border-radius: 50%;
  cursor: pointer;
  transition: all .15s ease;
  padding: 0;
}
.sp-reviews__dot:hover { background: var(--ink-mute); }
.sp-reviews__dot.is-active {
  background: var(--gold);
  width: 24px; border-radius: 5px;
}

.sp-reviews__cta { text-align: center; padding-top: 32px; border-top: 1px solid var(--line); margin-top: 32px; }
.sp-reviews__link {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 16px 32px;
  background: #4285F4; color: #fff;
  font-family: var(--mono); font-size: 12.5px;
  letter-spacing: 0.16em; text-transform: uppercase; font-weight: 600;
  text-decoration: none;
  transition: background .15s, transform .15s;
}
.sp-reviews__link:hover { background: #3367d6; transform: translateY(-1px); }

/* ============================================================
   .sp-related — unified compact related-products grid
   2026-05-04: Adam: „tytuły za duże, odstępy, opisy nieczytelne"
   ============================================================ */

.sp-related__head { margin-bottom: 40px; max-width: 880px; }
.sp-related__head .eyebrow { color: var(--gold); }
.sp-related__head h2 em { color: var(--gold); font-style: italic; }

.sp-related__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}
.sp-related__card {
  background: #fff;
  border: 1px solid var(--line);
  text-decoration: none;
  color: var(--ink);
  transition: all .2s ease;
  display: flex; flex-direction: column;
  overflow: hidden;
}
.sp-related__card:hover {
  border-color: var(--gold);
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(20,17,11,0.08);
}
.sp-related__img {
  aspect-ratio: 1 / 1;
  background-size: cover;
  background-position: center;
  background-color: var(--bg-2);
  position: relative;
}
.sp-related__num {
  position: absolute; top: 12px; left: 12px;
  padding: 5px 10px;
  background: rgba(255,255,255,0.95);
  font-family: var(--mono); font-size: 10.5px;
  letter-spacing: 0.18em; color: var(--gold);
  font-weight: 700;
}
.sp-related__body {
  padding: 18px 18px 16px;
  display: flex; flex-direction: column; gap: 6px;
  flex: 1;
}
.sp-related__title {
  font-family: var(--serif); font-size: 17px;
  font-weight: 500; color: var(--ink);
  margin: 0; line-height: 1.25;
  letter-spacing: -0.005em;
}
.sp-related__excerpt {
  font-size: 12.5px;
  color: var(--ink-mute);
  line-height: 1.5;
  margin: 4px 0 0;
  flex: 1;
}
.sp-related__foot {
  display: flex; justify-content: space-between; align-items: baseline;
  padding-top: 12px; border-top: 1px solid var(--line);
  margin-top: 12px;
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.08em;
}
.sp-related__price { color: var(--ink); }
.sp-related__price strong { color: var(--gold); font-size: 14px; font-weight: 700; font-family: var(--serif); }
.sp-related__cta { color: var(--gold); }

/* (.sp-final removed 2026-05-04 — Adam: „obrzydliwie wygląda".) */

/* ============================================================
   2026-05-05 v14 — Adam-asset integration
   .mf-infografik · .nl-dim · .mt-lamellen · .ub-print
   ============================================================ */

/* MANUFAKTUR · Original Infografik 4-Schritte */
.mf-infografik {
  padding: 64px 0 96px;
  background: linear-gradient(180deg, #fdfaf3 0%, #fff 100%);
}
.mf-infografik__head { max-width: 720px; margin-bottom: 32px; }
.mf-infografik__head h2 em { color: var(--gold); font-style: italic; }
.mf-infografik__media {
  background: #fff;
  padding: 24px;
  border: 1px solid var(--line);
  box-shadow: 0 16px 48px -12px rgba(20,17,11,.08);
  margin: 0;
  text-align: center;
}
.mf-infografik__media img {
  max-width: 100%; height: auto; display: block;
  margin: 0 auto;
}
.mf-infografik__media figcaption {
  margin-top: 18px;
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.15em; text-transform: uppercase;
  color: var(--ink-mute); font-weight: 500;
}


/* MODERN-LINE · Dimensions Infografik */
.nl-dim {
  padding: 96px 0;
  background: linear-gradient(180deg, #fff 0%, var(--bg-2) 100%);
}
.nl-dim__grid {
  display: grid; grid-template-columns: 1fr 1.2fr;
  gap: 64px; align-items: center;
}
.nl-dim__media {
  background: #fff;
  padding: 32px;
  border: 1px solid var(--line);
  box-shadow: 0 16px 48px -12px rgba(20,17,11,.08);
}
.nl-dim__media img {
  width: 100%; height: auto; display: block;
  max-width: 480px; margin: 0 auto;
}
.nl-dim__body h2 em { color: var(--gold); font-style: italic; }
.nl-dim__lead {
  font-family: var(--serif); font-size: 18px;
  line-height: 1.65; color: var(--ink-dim);
  margin: 24px 0 28px;
}
.nl-dim__lead strong { color: var(--ink); font-weight: 600; }
.nl-dim__bullets {
  list-style: none; padding: 0; margin: 0;
  display: flex; flex-direction: column; gap: 12px;
  border-left: 3px solid var(--gold);
  padding-left: 22px;
}
.nl-dim__bullets li {
  font-size: 14.5px; line-height: 1.55;
  color: var(--ink-dim); font-family: var(--serif);
}
.nl-dim__bullets li strong {
  color: var(--ink); font-weight: 600;
  display: inline-block; min-width: 130px;
}


/* METAL · Lamellen-Zäune */
.mt-lamellen { padding: 96px 0; background: #fff; }
.mt-lamellen__head { max-width: 720px; margin-bottom: 48px; }
.mt-lamellen__head h2 em { color: var(--gold); font-style: italic; }
.mt-lamellen__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-auto-rows: 220px;
  gap: 8px;
  grid-auto-flow: dense;
  margin-bottom: 32px;
}
.mt-lamellen__tile {
  position: relative; overflow: hidden;
  background: var(--bg-2);
  text-decoration: none; cursor: zoom-in;
}
.mt-lamellen__tile--big { grid-column: span 2; grid-row: span 2; }
.mt-lamellen__tile img {
  width: 100%; height: 100%; object-fit: cover; display: block;
  transition: transform .55s cubic-bezier(.4,0,.2,1);
}
.mt-lamellen__tile:hover img { transform: scale(1.06); }
.mt-lamellen__overlay {
  position: absolute; inset: 0;
  display: flex; flex-direction: column; justify-content: flex-end;
  padding: 14px 16px;
  background: linear-gradient(180deg, transparent 0%, transparent 60%, rgba(0,0,0,.85) 100%);
  opacity: 0; transition: opacity .25s;
  pointer-events: none;
  color: #f5efe0;
}
.mt-lamellen__tile:hover .mt-lamellen__overlay { opacity: 1; }
.mt-lamellen__overlay span {
  font-family: var(--mono); font-size: 10px;
  letter-spacing: 0.18em; color: var(--gold-light);
  font-weight: 700;
}
.mt-lamellen__overlay strong {
  font-family: var(--serif); font-size: 17px;
  color: #f5efe0; font-weight: 500;
  margin-top: 4px;
}
.mt-lamellen__features {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}
.mt-lamellen__feat {
  padding: 14px 18px;
  background: var(--bg-2);
  border-left: 3px solid var(--gold);
  font-size: 13.5px; color: var(--ink-dim);
  line-height: 1.5;
}
.mt-lamellen__feat strong { color: var(--ink); font-weight: 600; }


/* UEBER-UNS · Print Heritage (Ulotka A5) — REMOVED 2026-05-05 v15
   Adam: „te zdjęcia nic nie wnoszą tak mi się wydaje dlatego je usuń". */


/* RESPONSIVE — wszystkie nowe v14 komponenty */
@media (max-width: 1100px) {
  .nl-dim__grid { grid-template-columns: 1fr; gap: 40px; }
  .nl-dim__media { max-width: 480px; margin: 0 auto; }
  .mt-lamellen__grid { grid-template-columns: repeat(3, 1fr); }
  .mt-lamellen__features { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 720px) {
  .mf-infografik, .nl-dim, .mt-lamellen { padding: 56px 0; }
  .mt-lamellen__grid { grid-template-columns: 1fr 1fr; grid-auto-rows: 160px; }
  .mt-lamellen__overlay { opacity: 1; }
  .mt-lamellen__features { grid-template-columns: 1fr; }
  .nl-dim__bullets li strong { display: block; min-width: 0; }
}

/* ============================================================
   2026-05-05 v13 — /ueber-uns/ tech expansion: counter + map + vs + eco + partners + press
   Adam: „rozbuduj sekcje o nas dalej, masz materiały, technologicznie lepsza strona"
   ============================================================ */

/* Counter — żywe number-up; data-counter spans inherit parent typografii */
[data-counter] { display: inline-block; font-variant-numeric: tabular-nums; }


/* ============================================================
   .ub-map — v15.3 PL→DE storytelling + Google Maps + Cities-grid
   ============================================================ */
.ub-map {
  padding: 120px 0;
  background: linear-gradient(180deg, #fff 0%, #fdfaf3 100%);
  border-top: 1px solid var(--line);
}
.ub-map__head { max-width: 820px; margin-bottom: 40px; }
.ub-map__head h2 em { color: var(--gold); font-style: italic; }
.ub-map__head .lede strong { color: var(--ink); font-weight: 600; }

/* ---- STORYTELLING BANNER: PL → 5 Werktage → DE ---- */
.ub-map__story {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 0;
  background: var(--ink);
  color: #f5efe0;
  margin-bottom: 32px;
  box-shadow: 0 12px 36px rgba(20,17,11,.18);
  border: 1px solid rgba(212,175,55,.2);
}
.ub-map__story-side {
  padding: 32px 36px;
  display: flex; flex-direction: column; gap: 8px;
  position: relative;
}
.ub-map__story-side--from {
  background: linear-gradient(135deg, #1a160e 0%, #14110b 100%);
}
.ub-map__story-side--to {
  background: linear-gradient(135deg, #14110b 0%, #1a160e 100%);
  text-align: right;
  align-items: flex-end;
}
.ub-map__story-flag {
  width: 48px; height: 32px;
  display: block;
  box-shadow: 0 4px 12px rgba(0,0,0,.3);
  margin-bottom: 12px;
}
.ub-map__story-flag svg { display: block; width: 100%; height: 100%; }
.ub-map__story-label {
  font-family: var(--mono); font-size: 10.5px;
  letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--gold); font-weight: 700;
}
.ub-map__story-name {
  font-family: var(--serif); font-size: 28px;
  font-weight: 500; line-height: 1.1;
  color: #fff; letter-spacing: -0.015em;
  margin-top: 4px;
}
.ub-map__story-meta {
  font-family: var(--serif); font-size: 14px;
  color: #c4bba7; line-height: 1.5;
  margin-top: 4px;
}

/* Środkowy "arrow" segment z LKW + label */
.ub-map__story-arrow {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 24px 28px;
  background: var(--gold);
  color: var(--ink);
  position: relative;
  min-width: 200px;
}
.ub-map__story-arrow::before,
.ub-map__story-arrow::after {
  content: '';
  position: absolute;
  top: 0; bottom: 0;
  width: 0;
  border-top: solid transparent;
  border-bottom: solid transparent;
}
.ub-map__story-arrow::before {
  left: -24px;
  border-top-width: 80px;
  border-bottom-width: 80px;
  border-right: 24px solid var(--gold);
}
.ub-map__story-arrow::after {
  right: -24px;
  border-top-width: 80px;
  border-bottom-width: 80px;
  border-left: 24px solid var(--gold);
}
.ub-map__story-truck {
  width: 56px; height: auto;
  color: var(--ink);
  margin-bottom: 8px;
}
.ub-map__story-arrow-line {
  display: flex; align-items: center; gap: 8px;
  text-align: center;
}
.ub-map__story-arrow-label {
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.1em; text-transform: uppercase;
  font-weight: 700; line-height: 1.4;
  color: var(--ink);
}
.ub-map__story-arrow-label small {
  font-size: 9.5px; font-weight: 600;
  letter-spacing: 0.06em;
  color: rgba(20,17,11,.7);
  text-transform: none;
}
.ub-map__story-arrow-tip {
  width: 18px; height: 18px;
  flex-shrink: 0;
}

/* ---- LAYOUT: mapa + cities-grid ---- */
.ub-map__layout {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 24px;
  align-items: start;
}
/* v15.7 — Custom SVG map (prawdziwy kształt DE z Wikimedia, gold-style) zamiast Google Maps embed */
.ub-map__embed {
  background: linear-gradient(180deg, #fdfaf3 0%, #fff 100%);
  border: 1px solid var(--line);
  padding: 0;
  box-shadow: 0 12px 32px rgba(20,17,11,.06);
  overflow: hidden;
}
.ub-map__svg-wrap {
  position: relative;
  display: flex; flex-direction: column;
}
.ub-map__svg-de {
  display: block;
  width: 100%;
  height: 540px;
  background: linear-gradient(180deg, #fdfaf3 0%, #f7eed8 100%);
  border-bottom: 1px solid var(--line);
}
.ub-map__svg-bar {
  display: flex; align-items: center; justify-content: space-between;
  flex-wrap: wrap; gap: 16px;
  padding: 14px 20px;
  background: var(--ink);
  color: #f5efe0;
}
.ub-map__svg-bar-legend {
  display: flex; flex-wrap: wrap; gap: 18px;
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.05em; line-height: 1.5;
}
.ub-map__svg-bar-item {
  display: inline-flex; align-items: center; gap: 8px;
  color: #c4bba7;
}
.ub-map__svg-bar-item strong {
  color: var(--gold);
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
.ub-map__swatch {
  display: inline-block;
  width: 12px; height: 12px;
  border-radius: 2px;
  flex-shrink: 0;
}
.ub-map__swatch--de {
  background: var(--gold);
  border: 1px solid rgba(20,17,11,.5);
}
.ub-map__swatch--pl {
  background: #dc143c;
  border-radius: 50%;
  border: 2px solid #fff;
  box-shadow: 0 0 0 1px rgba(220,20,60,.5);
}
.ub-map__svg-bar-link {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 8px 14px;
  background: var(--gold);
  color: var(--ink);
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.12em; text-transform: uppercase; font-weight: 700;
  text-decoration: none;
  transition: background .2s ease;
}
.ub-map__svg-bar-link:hover { background: var(--gold-light); }

/* ---- CITIES PANEL (right) ---- */
.ub-map__cities {
  display: flex; flex-direction: column; gap: 18px;
  background: #fff;
  border: 1px solid var(--line);
  padding: 24px 26px;
  box-shadow: 0 12px 32px rgba(20,17,11,.04);
  position: sticky; top: 100px;
}
.ub-map__cities-eyebrow {
  font-family: var(--mono); font-size: 10.5px;
  letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--gold); font-weight: 700;
}
.ub-map__cities-title {
  font-family: var(--serif); font-size: 22px;
  color: var(--ink); font-weight: 500;
  line-height: 1.2; letter-spacing: -0.01em;
  margin: 6px 0 0;
}
.ub-map__cities-sub {
  font-family: var(--serif); font-size: 13.5px;
  color: var(--ink-dim); line-height: 1.5;
  margin: 8px 0 0;
}
.ub-map__cities-grid {
  display: flex; flex-wrap: wrap; gap: 6px;
  margin: 4px 0 0;
}
.ub-map__city {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 10px 6px 8px;
  background: linear-gradient(135deg, #fffbf0 0%, #fff 100%);
  border: 1px solid var(--line);
  border-left: 3px solid var(--gold);
  font-family: var(--serif); font-size: 13px;
  color: var(--ink); font-weight: 500;
  line-height: 1.2;
  transition: background .2s ease, transform .2s ease;
}
.ub-map__city:hover {
  background: #fff5d9;
  transform: translateY(-1px);
}
.ub-map__city-pin {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--gold);
  box-shadow: 0 0 0 2px rgba(212,175,55,.2);
  flex-shrink: 0;
}
.ub-map__city-land {
  font-family: var(--mono); font-size: 9.5px;
  letter-spacing: 0.06em;
  color: var(--ink-mute); font-weight: 600;
  background: var(--bg-2);
  padding: 1px 5px;
  border-radius: 2px;
  margin-left: 2px;
}
.ub-map__cities-foot {
  margin-top: 8px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
  display: flex; flex-direction: column; gap: 10px;
}
.ub-map__cities-foot-row {
  display: flex; align-items: flex-start; gap: 10px;
  font-family: var(--serif); font-size: 13px;
  color: var(--ink-dim); line-height: 1.5;
}
.ub-map__cities-foot-row svg {
  color: var(--gold); flex-shrink: 0;
  margin-top: 1px;
}
.ub-map__cities-foot-row strong {
  color: var(--ink); font-weight: 600;
  display: block;
}

/* ---- RESPONSIVE ---- */
@media (max-width: 1180px) {
  .ub-map__story { grid-template-columns: 1fr; }
  .ub-map__story-side--to { text-align: left; align-items: flex-start; }
  .ub-map__story-arrow { padding: 20px 28px; min-width: 0; flex-direction: row; gap: 16px; }
  .ub-map__story-arrow::before,
  .ub-map__story-arrow::after { display: none; }
  .ub-map__story-truck { margin-bottom: 0; transform: rotate(0); }
}
@media (max-width: 980px) {
  .ub-map__layout { grid-template-columns: 1fr; gap: 24px; }
  .ub-map__cities { position: static; }
}
@media (max-width: 720px) {
  .ub-map { padding: 64px 0; }
  .ub-map__story-side { padding: 24px 22px; }
  .ub-map__story-name { font-size: 22px; }
  .ub-map__svg-de { height: 420px; }
  .ub-map__svg-bar { padding: 12px 16px; flex-direction: column; align-items: stretch; }
  .ub-map__svg-bar-legend { flex-direction: column; gap: 8px; font-size: 10.5px; }
  .ub-map__svg-bar-link { justify-content: center; }
  .ub-map__cities { padding: 20px 22px; }
}


/* ============================================================
   .ub-vs — Im Vergleich (v15.2 — premium card-layout, gold VS-divider)
   ============================================================ */
.ub-vs {
  padding: 120px 0;
  background: linear-gradient(180deg, #fff 0%, #fdfaf3 100%);
}
.ub-vs__head { max-width: 800px; margin-bottom: 48px; }
.ub-vs__head h2 em { color: var(--gold); font-style: italic; }
.ub-vs__head .lede { color: var(--ink-dim); }

.ub-vs__list {
  list-style: none; margin: 0; padding: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
}
.ub-vs__card {
  background: #fff;
  border: 1px solid var(--line);
  box-shadow: 0 6px 24px rgba(20,17,11,.04);
  display: flex; flex-direction: column;
  overflow: hidden;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.ub-vs__card:hover {
  transform: translateY(-3px);
  box-shadow: 0 16px 40px rgba(20,17,11,.08);
  border-color: rgba(212,175,55,.4);
}

/* HEADER — icon + Merkmal */
.ub-vs__card-head {
  display: flex; align-items: center; gap: 14px;
  padding: 18px 22px;
  background: linear-gradient(180deg, #fdfaf3 0%, #fff 100%);
  border-bottom: 1px solid var(--line);
}
.ub-vs__icon {
  width: 44px; height: 44px;
  display: grid; place-items: center;
  background: var(--ink);
  color: var(--gold);
  border-radius: 50%;
  flex-shrink: 0;
  box-shadow: 0 4px 14px rgba(20,17,11,.18), inset 0 0 0 1px rgba(212,175,55,.25);
}
.ub-vs__icon svg {
  width: 20px; height: 20px;
  display: block;
}
.ub-vs__merkmal {
  font-family: var(--mono); font-size: 13px;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--ink); font-weight: 700;
  line-height: 1.3;
  margin: 0;
}

/* COMPARE — 2 sides + gold VS-divider */
.ub-vs__compare {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  flex: 1;
  position: relative;
}
.ub-vs__side {
  padding: 20px 22px;
  display: flex; flex-direction: column; gap: 8px;
  min-width: 0;
}
.ub-vs__side--us {
  background: linear-gradient(135deg, #fffbf0 0%, #fff 100%);
  border-right: 0;
}
.ub-vs__side--them {
  background: #fafaf6;
}
.ub-vs__side-label {
  display: flex; align-items: center; gap: 8px;
  font-family: var(--mono); font-size: 11.5px;
  letter-spacing: 0.14em; text-transform: uppercase; font-weight: 700;
  margin-bottom: 6px;
}
.ub-vs__side--us .ub-vs__side-label { color: var(--gold); }   /* #9d6e1f - WCAG AA OK */
.ub-vs__side--them .ub-vs__side-label { color: #6b5a3a; }      /* darkened from #a89478 → 6.4:1 contrast OK */
.ub-vs__mark {
  width: 16px; height: 16px;
  flex-shrink: 0; display: block;
}
.ub-vs__mark--us { color: var(--gold); }
.ub-vs__mark--them { color: #6b5a3a; opacity: 1; }

.ub-vs__value {
  font-family: var(--serif);
  font-size: 19px; line-height: 1.3;
  font-weight: 600;
  color: var(--ink);
  letter-spacing: -0.01em;
}
.ub-vs__side--them .ub-vs__value {
  color: var(--ink-dim);                /* z var(--ink-mute) → ciemniejsze (8.5:1 vs 4.6:1) */
  font-style: italic;
  font-weight: 500;
}
.ub-vs__detail {
  margin: 0;
  font-family: var(--serif);
  font-size: 14.5px; line-height: 1.6;  /* z 13px → 14.5px (czytelniejsze dla 55+) */
  color: var(--ink-dim);
}
.ub-vs__side--them .ub-vs__detail {
  color: #5a5142;                        /* z #9c9280 → ~7:1 contrast, czytelne */
  font-style: italic;
}

/* GOLD VS-DIVIDER */
.ub-vs__divider {
  width: 1px;
  background: linear-gradient(180deg, transparent 0%, var(--line) 15%, var(--line) 85%, transparent 100%);
  position: relative;
  display: flex; align-items: center; justify-content: center;
}
.ub-vs__divider-text {
  position: absolute;
  width: 32px; height: 32px;
  display: grid; place-items: center;
  background: var(--ink);
  color: var(--gold);
  font-family: var(--serif);
  font-size: 12px; font-style: italic;
  font-weight: 600;
  letter-spacing: 0.05em;
  border-radius: 50%;
  box-shadow: 0 2px 8px rgba(20,17,11,.15), inset 0 0 0 1px rgba(212,175,55,.3);
  text-transform: lowercase;
}

.ub-vs__footnote {
  margin-top: 36px; padding: 20px 24px;
  background: #fff;
  border: 1px solid var(--line);
  border-left: 4px solid var(--gold);
  font-family: var(--serif);
  font-size: 14.5px; color: var(--ink-dim); line-height: 1.7;  /* z 13.5 → 14.5px */
}
.ub-vs__footnote strong { color: var(--ink); font-weight: 600; }

/* RESPONSIVE breakpoints — premium scaling */
@media (max-width: 1180px) {
  .ub-vs__list { grid-template-columns: 1fr; gap: 16px; }
}
@media (max-width: 720px) {
  .ub-vs__compare { grid-template-columns: 1fr; }
  .ub-vs__divider {
    width: 100%; height: 1px;
    background: linear-gradient(90deg, transparent 0%, var(--line) 15%, var(--line) 85%, transparent 100%);
    padding: 0;
  }
  .ub-vs__divider-text {
    width: 26px; height: 26px;
    font-size: 11px;
  }
  .ub-vs__side { padding: 18px 20px; }
  .ub-vs__card-head { padding: 14px 20px; }
}


/* ============================================================
   .ub-eco — Nachhaltigkeit
   ============================================================ */
.ub-eco { padding: 120px 0; background: var(--bg-2); }
.ub-eco__head { max-width: 800px; margin-bottom: 56px; }
.ub-eco__head h2 em { color: var(--gold); font-style: italic; }

.ub-eco__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}
.ub-eco__card {
  background: #fff; border: 1px solid var(--line);
  padding: 32px 28px;
  display: flex; flex-direction: column; gap: 12px;
  transition: all .25s ease;
}
.ub-eco__card:hover {
  border-color: var(--gold); transform: translateY(-3px);
  box-shadow: 0 12px 32px rgba(20,17,11,.06);
}
.ub-eco__card--featured {
  background: linear-gradient(135deg, #fffbf0 0%, #fff 100%);
  border-color: var(--gold); border-width: 2px;
  box-shadow: 0 8px 24px rgba(212,175,55,.12);
  grid-column: span 1;
}
.ub-eco__num {
  font-family: var(--serif); font-size: 56px;
  color: var(--gold); font-weight: 500;
  line-height: 1; letter-spacing: -0.02em;
}
.ub-eco__num span { font-size: 28px; color: var(--gold); margin-left: 4px; }
.ub-eco__unit {
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--gold); font-weight: 600;
}
.ub-eco__card h3 {
  font-family: var(--serif); font-size: 21px;
  color: var(--ink); font-weight: 500;
  margin: 8px 0 0; letter-spacing: -0.005em;
  line-height: 1.25;
}
.ub-eco__card p {
  font-size: 14px; line-height: 1.65;
  color: var(--ink-dim); margin: 0;
}
.ub-eco__card p strong { color: var(--ink); font-weight: 600; }
.ub-eco__source {
  font-family: var(--mono); font-size: 10px;
  letter-spacing: 0.1em; color: var(--ink-mute);
  margin-top: auto; padding-top: 12px;
  border-top: 1px solid var(--line);
  text-transform: uppercase;
}


/* ============================================================
   .ub-partners — Came/Nice/banki/etc
   ============================================================ */
.ub-partners { padding: 120px 0; background: #fff; }
.ub-partners__head { max-width: 800px; margin-bottom: 56px; }
.ub-partners__head h2 em { color: var(--gold); font-style: italic; }

.ub-partners__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}
.ub-partner {
  background: var(--bg-2); border: 1px solid var(--line);
  padding: 28px 26px;
  display: flex; flex-direction: column; gap: 10px;
  transition: all .25s ease;
}
.ub-partner:hover {
  background: #fff;
  border-color: var(--gold);
  transform: translateY(-3px);
}
.ub-partner__cat {
  font-family: var(--mono); font-size: 10px;
  letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--gold); font-weight: 700;
}
.ub-partner h3 {
  font-family: var(--serif); font-size: 22px;
  color: var(--ink); font-weight: 500;
  margin: 4px 0; letter-spacing: -0.01em;
}
.ub-partner p {
  font-size: 14px; line-height: 1.6;
  color: var(--ink-dim); margin: 0;
}
.ub-partner p strong { color: var(--ink); font-weight: 600; }


/* .ub-press — REMOVED 2026-05-05 v15 (Adam: „poniżej masz opinię Google więc nie musisz tego wrzucać"). */


/* ============================================================
   .ub-grevs / .ub-grev — v15.1 standalone Google-Reviews block
   (własna nazwa klas — żadnych kolizji z .sp-* carousel z innych stron)
   ============================================================ */
.ub-grevs {
  background: var(--bg-2);
  padding: 96px 0;
}
.ub-grevs__head {
  display: grid;
  grid-template-columns: minmax(280px, 360px) 1fr;
  gap: 56px;
  align-items: start;
  margin-bottom: 48px;
}
.ub-grevs__badge {
  display: flex; align-items: center; gap: 16px;
  padding: 22px 26px;
  background: #fff;
  border: 1px solid var(--line);
  border-left: 4px solid #4285F4;
  box-shadow: 0 8px 24px rgba(20,17,11,.04);
}
.ub-grevs__rating-row { display: flex; align-items: baseline; gap: 8px; }
.ub-grevs__stars { color: #f4b400; font-size: 18px; letter-spacing: 1.5px; line-height: 1; }
.ub-grevs__rating { font-family: var(--serif); font-size: 28px; color: var(--ink); font-weight: 500; line-height: 1; letter-spacing: -0.02em; }
.ub-grevs__count { font-family: var(--mono); font-size: 12px; color: var(--ink-mute); letter-spacing: 0.06em; }
.ub-grevs__source { font-family: var(--mono); font-size: 11.5px; color: var(--ink-dim); letter-spacing: 0.04em; line-height: 1.55; margin-top: 6px; }
.ub-grevs__source strong { color: var(--ink); font-weight: 600; }
.ub-grevs__headline .eyebrow { color: var(--gold); }
.ub-grevs__headline h2 em { color: var(--gold); font-style: italic; }

.ub-grevs__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
}
.ub-grev {
  display: grid;
  grid-template-columns: 160px 1fr;
  gap: 0;
  background: #fff;
  border: 1px solid var(--line);
  box-shadow: 0 4px 16px rgba(20,17,11,.04);
  transition: transform .2s ease, box-shadow .2s ease;
  overflow: hidden;
  margin: 0;
  min-height: 200px;
}
.ub-grev:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 32px rgba(20,17,11,.08);
}
.ub-grev__photo {
  position: relative;
  display: block;
  background: var(--bg-2);
  overflow: hidden;
  text-decoration: none;
}
.ub-grev__photo img {
  position: absolute;
  inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .35s ease;
}
.ub-grev__photo:hover img { transform: scale(1.05); }
.ub-grev__photo-badge {
  position: absolute; bottom: 8px; left: 8px;
  background: rgba(0,0,0,.72); color: #fff;
  padding: 4px 8px; border-radius: 3px;
  font-family: var(--mono); font-size: 10px;
  letter-spacing: 0.05em; font-weight: 600;
  display: inline-flex; align-items: center; gap: 5px;
}
.ub-grev__body {
  padding: 18px 20px 20px;
  display: flex; flex-direction: column;
  min-width: 0;
  gap: 12px;
}
.ub-grev__top {
  display: flex; justify-content: space-between; align-items: flex-start;
  gap: 12px;
}
.ub-grev__author {
  display: flex; align-items: center; gap: 10px;
  min-width: 0;
}
.ub-grev__avatar {
  width: 38px; height: 38px;
  background: linear-gradient(135deg, var(--gold) 0%, #c79f30 100%);
  color: var(--bg-dark);
  display: grid; place-items: center;
  font-family: var(--serif); font-size: 14px; font-weight: 600;
  border-radius: 50%;
  flex-shrink: 0;
  letter-spacing: -0.01em;
  box-shadow: 0 2px 6px rgba(212,175,55,.25);
}
.ub-grev__meta { min-width: 0; }
.ub-grev__name {
  font-family: var(--serif); font-size: 15px;
  color: var(--ink); font-weight: 600;
  line-height: 1.2;
}
.ub-grev__loc {
  font-family: var(--mono); font-size: 10.5px;
  color: var(--ink-mute); letter-spacing: 0.04em;
  margin-top: 3px;
}
.ub-grev__right {
  text-align: right; display: flex; flex-direction: column; gap: 2px;
  flex-shrink: 0;
}
.ub-grev__stars { color: #f4b400; font-size: 13px; letter-spacing: 1.5px; line-height: 1; }
.ub-grev__date {
  font-family: var(--mono); font-size: 10.5px;
  color: var(--ink-mute); letter-spacing: 0.04em;
}
.ub-grev__text {
  font-family: var(--serif); font-size: 14.5px;
  line-height: 1.55; color: var(--ink-dim);
  margin: 0; padding: 0;
  font-style: italic;
}

.ub-grevs__cta { text-align: center; padding-top: 36px; margin-top: 36px; border-top: 1px solid var(--line); }
.ub-grevs__link {
  display: inline-flex; align-items: center; gap: 10px;
  background: #4285F4; color: #fff;
  padding: 14px 28px;
  font-family: var(--mono); font-size: 12px;
  letter-spacing: 0.12em; text-transform: uppercase; font-weight: 600;
  text-decoration: none;
  transition: background .2s ease, transform .2s ease;
  border-radius: 3px;
}
.ub-grevs__link:hover { background: #3367d6; transform: translateY(-1px); }


/* RESPONSIVE — wszystkie nowe ub-* sekcje (ub-vs ma własne breakpointy w bloku wyżej) */
@media (max-width: 1100px) {
  .ub-map__layout { grid-template-columns: 1fr; gap: 32px; }
  .ub-map__stats { position: static; }
  .ub-eco__grid, .ub-partners__grid { grid-template-columns: repeat(2, 1fr); }
  .ub-grevs__head { grid-template-columns: 1fr; gap: 28px; }
  .ub-grevs__grid { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  .ub-map, .ub-eco, .ub-partners, .ub-grevs { padding: 64px 0; }
  .ub-map__embed iframe { height: 360px; }
  .ub-map__stat-num { font-size: 26px; }
  .ub-eco__grid, .ub-partners__grid { grid-template-columns: 1fr; }
  .ub-eco__num { font-size: 42px; }
  .ub-grev { grid-template-columns: 1fr; min-height: 0; }
  .ub-grev__photo { min-height: 200px; }
  .ub-grev__photo img { position: static; height: 200px; }
  .ub-grev__top { flex-wrap: wrap; }
}

/* 2026-05-04 v12 — Anchor scroll offset for sticky nav (76px) + breathing room.
   Adam: „klikam familie=modern i tylko odświeża, nie przenosi do produktów" → fix
   przez make_url() #alle-modelle hash + ten scroll-margin żeby nav nie zasłaniał. */
#alle-modelle, #familien {
  scroll-margin-top: 96px;
}

/* ============================================================
   2026-05-04 v10 — autonomous 2h work expansion
   .fz-* finanzierung · .th-* 3d-planung · .ar-* ar-preview ·
   .tr-* tore · .zb-* zubehor · .fq-* faq
   ============================================================ */

/* shared HERO base for new pages */
.fz-hero, .th-hero, .ar-hero, .tr-hero, .zb-hero, .fq-hero {
  position: relative;
  min-height: 580px;
  padding: 80px 0 64px;
  color: var(--ink);
  background: linear-gradient(180deg, #fff 0%, #fdfaf3 100%);
  border-bottom: 1px solid var(--line);
  overflow: hidden;
}
.fz-hero__inner, .ar-hero__inner, .zb-hero__inner, .fq-hero__inner { max-width: 1180px; position: relative; z-index: 2; }
.fz-hero__crumbs, .th-hero__crumbs, .ar-hero__crumbs, .tr-hero__crumbs, .zb-hero__crumbs, .fq-hero__crumbs {
  display: flex; gap: 10px; align-items: center;
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.18em;
  color: var(--ink-mute); text-transform: uppercase; margin-bottom: 24px;
}
.fz-hero__crumbs a, .th-hero__crumbs a, .ar-hero__crumbs a, .tr-hero__crumbs a, .zb-hero__crumbs a, .fq-hero__crumbs a { color: var(--ink-mute); text-decoration: none; }
.fz-hero__crumbs strong, .th-hero__crumbs strong, .ar-hero__crumbs strong, .tr-hero__crumbs strong, .zb-hero__crumbs strong, .fq-hero__crumbs strong { color: var(--ink); }
.fz-hero__chip, .ar-hero__chip, .zb-hero__chip, .fq-hero__chip {
  display: inline-block; padding: 8px 16px;
  background: var(--gold); color: var(--bg-dark);
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.22em; text-transform: uppercase;
  font-weight: 700; margin-bottom: 24px;
}
.fz-hero__title, .ar-hero__title, .zb-hero__title, .fq-hero__title {
  font-family: var(--serif); font-size: clamp(36px, 5vw, 64px);
  font-weight: 500; line-height: 1.05;
  letter-spacing: -0.02em; color: var(--ink);
  margin: 0 0 24px;
}
.fz-hero__title em, .ar-hero__title em, .zb-hero__title em, .fq-hero__title em { color: var(--gold); font-style: italic; font-weight: 400; }
.fz-hero__lede, .ar-hero__lede, .zb-hero__lede, .fq-hero__lede {
  font-family: var(--serif); font-size: 18px;
  line-height: 1.65; color: var(--ink-dim);
  margin: 0 0 32px; max-width: 760px;
}
.fz-hero__lede strong, .ar-hero__lede strong, .zb-hero__lede strong, .fq-hero__lede strong { color: var(--ink); font-weight: 600; }
.fz-hero__facts, .zb-hero__facts {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px;
  background: var(--line-2); border: 1px solid var(--line-2);
}
.fz-hero__facts > div, .zb-hero__facts > div {
  background: #fff; padding: 18px 16px;
  display: flex; flex-direction: column; gap: 4px;
}
.fz-hero__facts strong, .zb-hero__facts strong {
  font-family: var(--serif); font-size: 24px;
  color: var(--gold); font-weight: 500; line-height: 1;
}
.fz-hero__facts span, .zb-hero__facts span {
  font-family: var(--mono); font-size: 10.5px;
  color: var(--ink-mute); letter-spacing: 0.1em;
  text-transform: uppercase; line-height: 1.4;
}

/* dark hero variant for /tore/, /3d-planung/ */
.tr-hero, .th-hero {
  background: var(--bg-dark);
  color: #f5efe0;
  min-height: 640px;
}
.tr-hero__inner, .th-hero__inner { max-width: 1180px; position: relative; z-index: 2; }
.tr-hero__bg, .th-hero__bg { position: absolute; inset: 0; z-index: 0; }
.tr-hero__bg img, .th-hero__bg img { width: 100%; height: 100%; object-fit: cover; opacity: .35; filter: blur(2px) grayscale(.3); }
.tr-hero__overlay, .th-hero__overlay {
  position: absolute; inset: 0; z-index: 1;
  background: linear-gradient(135deg, rgba(14,11,7,.94) 0%, rgba(28,24,18,.78) 50%, rgba(14,11,7,.96) 100%);
}
.tr-hero__crumbs, .th-hero__crumbs { color: rgba(245,239,224,.6); }
.tr-hero__crumbs a, .th-hero__crumbs a { color: rgba(245,239,224,.6); }
.tr-hero__crumbs strong, .th-hero__crumbs strong { color: var(--gold-light); }
.tr-hero__chip, .th-hero__chip {
  display: inline-block; padding: 8px 16px;
  background: rgba(212,175,55,.15); color: var(--gold-light);
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.22em; text-transform: uppercase;
  border-left: 3px solid var(--gold); margin-bottom: 28px;
}
.tr-hero__title, .th-hero__title {
  font-family: var(--serif); font-size: clamp(40px, 5.5vw, 72px);
  font-weight: 500; line-height: 1.05;
  letter-spacing: -0.02em; color: #f5efe0; margin: 0 0 28px;
}
.tr-hero__title em, .th-hero__title em { color: var(--gold-light); font-style: italic; font-weight: 400; }
.tr-hero__lede, .th-hero__lede {
  font-family: var(--serif); font-size: 18px;
  line-height: 1.65; color: #c4bba7; margin: 0 0 40px; max-width: 720px;
}
.tr-hero__lede strong, .th-hero__lede strong { color: #f5efe0; font-weight: 500; }
.tr-hero__facts, .th-hero__facts {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px;
  background: rgba(212,175,55,.18); border: 1px solid rgba(212,175,55,.18); margin-bottom: 32px;
}
.tr-hero__facts > div, .th-hero__facts > div {
  background: rgba(0,0,0,.45); padding: 22px 20px;
  display: flex; flex-direction: column; gap: 6px;
}
.tr-hero__facts strong, .th-hero__facts strong {
  font-family: var(--serif); font-size: 28px;
  color: var(--gold-light); font-weight: 500; line-height: 1;
}
.tr-hero__facts span, .th-hero__facts span {
  font-family: var(--mono); font-size: 11px;
  color: rgba(245,239,224,.6); letter-spacing: 0.1em;
  text-transform: uppercase; line-height: 1.4;
}
.tr-hero__cta, .th-hero__cta { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 8px; }


/* ============================================================
   .fz-* — FINANZIERUNG specific
   ============================================================ */
.fz-examples { padding: 96px 0; background: #fff; }
.fz-examples__head { max-width: 800px; margin-bottom: 48px; }
.fz-examples__head h2 em { color: var(--gold); font-style: italic; }
.fz-examples__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.fz-example {
  background: var(--bg-2); border: 1px solid var(--line);
  padding: 32px 28px;
  display: flex; flex-direction: column;
  position: relative;
  transition: all .25s ease;
}
.fz-example:hover { border-color: var(--gold); transform: translateY(-3px); box-shadow: 0 12px 32px rgba(20,17,11,.06); }
.fz-example--featured {
  background: linear-gradient(135deg, #fffbf0 0%, #fff 100%);
  border-color: var(--gold);
  border-width: 2px;
  box-shadow: 0 8px 24px rgba(212,175,55,.12);
}
.fz-example__badge {
  position: absolute; top: -12px; left: 24px;
  background: var(--gold); color: var(--bg-dark);
  font-family: var(--mono); font-size: 10.5px;
  letter-spacing: 0.18em; text-transform: uppercase;
  font-weight: 700; padding: 5px 12px;
}
.fz-example__head .kicker { color: var(--gold); }
.fz-example__head h3 { font-family: var(--serif); font-size: 22px; color: var(--ink); font-weight: 500; margin: 6px 0 4px; }
.fz-example__total { font-family: var(--serif); font-size: 17px; color: var(--ink-dim); font-weight: 500; }
.fz-example__total small { font-family: var(--mono); font-size: 11px; color: var(--ink-mute); display: block; margin-top: 2px; letter-spacing: 0.05em; }
.fz-example__rate {
  margin: 24px 0;
  padding: 24px 0; border-top: 2px solid var(--gold); border-bottom: 1px solid var(--line);
  display: flex; align-items: baseline; gap: 12px;
}
.fz-example__rate-num {
  font-family: var(--serif); font-size: 56px;
  color: var(--gold); font-weight: 500; line-height: 1;
  letter-spacing: -0.02em;
}
.fz-example__rate-num small { font-size: 28px; color: var(--gold); margin-left: 4px; }
.fz-example__rate-meta {
  font-family: var(--mono); font-size: 11px;
  color: var(--ink-mute); letter-spacing: 0.12em;
  text-transform: uppercase;
}
.fz-example__list { list-style: none; padding: 0; margin: 0 0 8px; display: flex; flex-direction: column; gap: 8px; }
.fz-example__list li { font-size: 13.5px; color: var(--ink-dim); }
.fz-examples__note { margin-top: 32px; font-size: 13px; color: var(--ink-mute); font-style: italic; }
.fz-examples__note strong { color: var(--ink); font-weight: 600; }

.fz-flow { padding: 96px 0; background: var(--bg-2); }
.fz-flow__head { max-width: 720px; margin-bottom: 48px; }
.fz-flow__head h2 em { color: var(--gold); font-style: italic; }
.fz-flow__list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 0; }
.fz-flow__list li {
  display: grid; grid-template-columns: 80px 1fr; gap: 32px;
  padding: 28px 0; border-top: 1px solid var(--line);
  align-items: start;
}
.fz-flow__list li:last-child { border-bottom: 1px solid var(--line); }
.fz-flow__num {
  width: 60px; height: 60px;
  background: var(--gold); color: var(--bg-dark);
  display: grid; place-items: center;
  font-family: var(--serif); font-size: 28px; font-weight: 600;
}
.fz-flow__list h3 { font-family: var(--serif); font-size: 22px; color: var(--ink); font-weight: 500; margin: 0 0 8px; }
.fz-flow__list p { font-size: 14.5px; line-height: 1.65; color: var(--ink-dim); margin: 0; }
.fz-flow__list p strong { color: var(--ink); font-weight: 600; }

.fz-banks { padding: 96px 0; background: #fff; }
.fz-banks__head { max-width: 800px; margin-bottom: 48px; }
.fz-banks__head h2 em { color: var(--gold); font-style: italic; }
.fz-banks__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.fz-bank {
  background: #fff; border: 1px solid var(--line);
  padding: 28px 26px;
  position: relative;
}
.fz-bank--featured {
  background: var(--ink); color: #f5efe0;
  border-color: var(--ink);
}
.fz-bank__badge {
  position: absolute; top: -12px; left: 22px;
  background: var(--gold); color: var(--bg-dark);
  font-family: var(--mono); font-size: 10.5px;
  letter-spacing: 0.18em; text-transform: uppercase;
  font-weight: 700; padding: 5px 12px;
}
.fz-bank__name { font-family: var(--serif); font-size: 22px; color: var(--ink); font-weight: 500; }
.fz-bank--featured .fz-bank__name { color: var(--gold-light); }
.fz-bank__meta {
  font-family: var(--mono); font-size: 10.5px;
  color: var(--ink-mute); letter-spacing: 0.08em; margin-top: 4px;
}
.fz-bank--featured .fz-bank__meta { color: rgba(245,239,224,.55); }
.fz-bank__list {
  list-style: none; padding: 0; margin: 16px 0 0;
  display: flex; flex-direction: column; gap: 8px;
  font-size: 13.5px; color: var(--ink-dim);
}
.fz-bank--featured .fz-bank__list li { color: rgba(245,239,224,.85); }


/* ============================================================
   .th-* — 3D-PLANUNG specific
   ============================================================ */
.th-flow { padding: 96px 0; background: #fff; }
.th-flow__head { max-width: 720px; margin-bottom: 48px; }
.th-flow__head h2 em { color: var(--gold); font-style: italic; }
.th-flow__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; }
.th-flow__step {
  background: var(--bg-2); border: 1px solid var(--line);
  padding: 32px 28px;
  display: flex; flex-direction: column; gap: 12px;
  position: relative;
  transition: all .25s ease;
}
.th-flow__step:hover { border-color: var(--gold); transform: translateY(-3px); }
.th-flow__step-num {
  position: absolute; top: 22px; right: 26px;
  font-family: var(--serif); font-size: 36px;
  color: var(--ink-mute); opacity: .25; line-height: 1;
}
.th-flow__step-icon {
  width: 56px; height: 56px;
  background: var(--ink); color: var(--gold-light);
  display: grid; place-items: center;
}
.th-flow__step h3 { font-family: var(--serif); font-size: 22px; color: var(--ink); font-weight: 500; margin: 0; }
.th-flow__step p { font-size: 14.5px; line-height: 1.65; color: var(--ink-dim); margin: 0; }
.th-flow__step p strong { color: var(--ink); font-weight: 600; }

.th-demo { padding: 96px 0; background: var(--bg-2); }
.th-demo__head { max-width: 800px; margin-bottom: 48px; }
.th-demo__head h2 em { color: var(--gold); font-style: italic; }
.th-demo__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.th-demo__panel { margin: 0; position: relative; }
.th-demo__panel img { width: 100%; aspect-ratio: 4/3; object-fit: cover; display: block; }
.th-demo__label {
  position: absolute; top: 12px; left: 12px;
  background: var(--ink); color: var(--gold-light);
  padding: 6px 12px;
  font-family: var(--mono); font-size: 10px;
  letter-spacing: 0.18em; text-transform: uppercase;
  font-weight: 700;
}
.th-demo__panel--final { box-shadow: 0 8px 32px rgba(212,175,55,.2); border: 2px solid var(--gold); }
.th-demo__panel figcaption {
  margin-top: 12px;
  font-family: var(--serif); font-size: 14px;
  color: var(--ink-dim); line-height: 1.5;
}
.th-demo__panel figcaption strong { color: var(--ink); font-weight: 600; }

.th-features { padding: 96px 0; background: #fff; }
.th-features__head { max-width: 720px; margin-bottom: 48px; }
.th-features__head h2 em { color: var(--gold); font-style: italic; }
.th-features__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.th-features__item {
  background: var(--bg-2); padding: 18px 20px;
  display: flex; gap: 14px; align-items: center;
  font-size: 14.5px; color: var(--ink);
  border-left: 3px solid var(--gold);
}
.th-features__item strong { color: var(--gold); font-size: 18px; }


/* ============================================================
   .ar-* — AR-PREVIEW specific
   ============================================================ */
.ar-hero__inner { display: grid; grid-template-columns: 1.2fr 1fr; gap: 56px; align-items: center; }
.ar-hero__cta { display: flex; gap: 14px; flex-wrap: wrap; margin-bottom: 32px; }
.ar-hero__trust { display: flex; flex-direction: column; gap: 6px; font-family: var(--mono); font-size: 11px; color: var(--ink-mute); letter-spacing: 0.05em; }

.ar-hero__phone { display: flex; flex-direction: column; align-items: center; gap: 12px; }
.ar-hero__phone-frame {
  width: 100%; max-width: 320px;
  aspect-ratio: 9/16; background: var(--ink);
  border-radius: 32px;
  padding: 12px;
  box-shadow: 0 24px 48px -12px rgba(20,17,11,.25);
  position: relative;
}
.ar-hero__phone-frame::before {
  content: ''; position: absolute; top: 16px; left: 50%; transform: translateX(-50%);
  width: 80px; height: 6px; background: #2a241a; border-radius: 4px;
}
.ar-hero__phone-screen {
  width: 100%; height: 100%; border-radius: 24px; overflow: hidden;
  position: relative;
}
.ar-hero__phone-screen img { width: 100%; height: 100%; object-fit: cover; }
.ar-hero__phone-overlay {
  position: absolute; bottom: 0; left: 0; right: 0;
  padding: 16px;
  background: linear-gradient(180deg, transparent 0%, rgba(0,0,0,.85) 100%);
}
.ar-hero__phone-badge {
  display: inline-block; padding: 6px 12px;
  background: var(--gold); color: var(--bg-dark);
  font-family: var(--mono); font-size: 10px;
  letter-spacing: 0.15em; text-transform: uppercase;
  font-weight: 700;
}
.ar-hero__phone-caption {
  font-family: var(--mono); font-size: 11px;
  color: var(--ink-mute); letter-spacing: 0.1em;
  text-transform: uppercase;
}

.ar-flow { padding: 96px 0; background: var(--bg-2); }
.ar-flow__head { max-width: 720px; margin-bottom: 48px; }
.ar-flow__head h2 em { color: var(--gold); font-style: italic; }
.ar-flow__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.ar-flow__step {
  background: #fff; border: 1px solid var(--line);
  padding: 32px 28px;
}
.ar-flow__step-num {
  font-family: var(--serif); font-size: 56px;
  color: var(--gold); font-weight: 500;
  line-height: 1; margin-bottom: 16px;
}
.ar-flow__step h3 { font-family: var(--serif); font-size: 22px; color: var(--ink); font-weight: 500; margin: 0 0 12px; }
.ar-flow__step p { font-size: 14.5px; line-height: 1.65; color: var(--ink-dim); margin: 0; }

.ar-tool { padding: 96px 0; background: #fff; }
.ar-tool__card {
  background: var(--bg-2);
  border: 2px dashed var(--gold);
  padding: 56px 48px;
  text-align: center;
}
.ar-tool__icon {
  display: inline-grid; place-items: center;
  width: 96px; height: 96px;
  background: var(--ink); color: var(--gold-light);
  border-radius: 50%; margin-bottom: 24px;
}
.ar-tool__card h2 em { color: var(--gold); font-style: italic; }
.ar-tool__lede { font-family: var(--serif); font-size: 17px; line-height: 1.65; color: var(--ink-dim); margin: 24px 0 32px; max-width: 640px; margin-left: auto; margin-right: auto; }
.ar-tool__cta { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; margin-bottom: 16px; }
.ar-tool__note { font-size: 13px; color: var(--ink-mute); font-style: italic; margin: 0; }

.ar-examples { padding: 96px 0; background: var(--bg-2); }
.ar-examples__head { max-width: 720px; margin-bottom: 48px; }
.ar-examples__head h2 em { color: var(--gold); font-style: italic; }
.ar-examples__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.ar-example { margin: 0; }
.ar-example img { width: 100%; aspect-ratio: 4/3; object-fit: cover; display: block; }
.ar-example figcaption {
  margin-top: 14px;
  display: flex; flex-direction: column; gap: 4px;
}
.ar-example figcaption span {
  font-family: var(--mono); font-size: 10.5px;
  letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--gold); font-weight: 600;
}
.ar-example figcaption strong {
  font-family: var(--serif); font-size: 17px;
  color: var(--ink); font-weight: 500;
}


/* ============================================================
   .tr-* — TORE specific
   ============================================================ */
.tr-groups { padding: 96px 0; background: #fff; }
.tr-groups__head { max-width: 720px; margin-bottom: 48px; }
.tr-groups__head h2 em { color: var(--gold); font-style: italic; }
.tr-groups__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.tr-group {
  background: #fff; border: 1px solid var(--line);
  display: flex; flex-direction: column;
  position: relative;
  transition: all .25s ease;
}
.tr-group:hover { border-color: var(--gold); transform: translateY(-3px); box-shadow: 0 12px 32px rgba(20,17,11,.06); }
.tr-group--featured { border-color: var(--gold); border-width: 2px; box-shadow: 0 8px 24px rgba(212,175,55,.12); }
.tr-group__badge {
  position: absolute; top: -12px; left: 22px; z-index: 2;
  background: var(--gold); color: var(--bg-dark);
  font-family: var(--mono); font-size: 10.5px;
  letter-spacing: 0.18em; text-transform: uppercase;
  font-weight: 700; padding: 5px 12px;
}
.tr-group__media { position: relative; aspect-ratio: 4/3; overflow: hidden; }
.tr-group__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.tr-group__num {
  position: absolute; top: 16px; right: 18px;
  font-family: var(--serif); font-size: 32px;
  color: var(--gold-light); font-weight: 500;
  background: var(--ink); padding: 6px 14px;
}
.tr-group__body { padding: 28px 26px; flex: 1; display: flex; flex-direction: column; }
.tr-group__body h3 { font-family: var(--serif); font-size: 24px; color: var(--ink); font-weight: 500; margin: 6px 0 12px; }
.tr-group__body p { font-size: 14.5px; line-height: 1.65; color: var(--ink-dim); margin: 0 0 16px; }
.tr-group__specs { list-style: none; padding: 0 0 16px; margin: 0 0 16px; border-bottom: 1px solid var(--line); display: flex; flex-direction: column; gap: 6px; font-size: 13.5px; color: var(--ink-dim); }
.tr-group__specs strong { color: var(--ink); font-weight: 600; min-width: 90px; display: inline-block; }
.tr-group__price { font-family: var(--serif); font-size: 16px; color: var(--ink); margin-top: auto; }
.tr-group__price strong { color: var(--gold); font-size: 22px; font-weight: 600; }

.tr-auto { padding: 96px 0; background: var(--bg-2); }
.tr-auto__head { max-width: 720px; margin-bottom: 48px; }
.tr-auto__head h2 em { color: var(--gold); font-style: italic; }
.tr-auto__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.tr-auto__feat {
  background: #fff; border: 1px solid var(--line);
  padding: 24px 22px;
  display: flex; flex-direction: column; gap: 10px;
}
.tr-auto__feat-icon { width: 48px; height: 48px; background: var(--ink); color: var(--gold-light); display: grid; place-items: center; }
.tr-auto__feat h3 { font-family: var(--serif); font-size: 18px; color: var(--ink); font-weight: 500; margin: 0; }
.tr-auto__feat p { font-size: 13px; line-height: 1.55; color: var(--ink-dim); margin: 0; }

.tr-set { padding: 96px 0; background: #fff; }
.tr-set__head { max-width: 720px; margin-bottom: 48px; }
.tr-set__head h2 em { color: var(--gold); font-style: italic; }
.tr-set__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.tr-set__media img { width: 100%; aspect-ratio: 4/3; object-fit: cover; display: block; }
.tr-set__body h3 { font-family: var(--serif); font-size: 28px; color: var(--ink); font-weight: 500; margin: 8px 0 20px; }
.tr-set__list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 12px; }
.tr-set__list li {
  display: flex; justify-content: space-between; align-items: baseline;
  gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--line);
  font-size: 14px; color: var(--ink-dim);
}
.tr-set__list strong { color: var(--ink); font-weight: 500; flex: 1; }
.tr-set__list span { font-family: var(--mono); font-size: 14px; color: var(--ink); font-weight: 600; flex-shrink: 0; }
.tr-set__total { background: var(--ink); color: #f5efe0 !important; padding: 18px 22px !important; margin-top: 12px; border: 0 !important; }
.tr-set__total strong { color: var(--gold-light) !important; font-size: 17px; }
.tr-set__total span { color: var(--gold-light) !important; font-family: var(--serif) !important; font-size: 26px !important; font-weight: 500 !important; }
.tr-set__total small { color: rgba(245,239,224,.55); font-size: 11px; font-family: var(--mono); display: block; letter-spacing: 0.08em; }
.tr-set__note { margin-top: 16px; font-size: 12.5px; color: var(--ink-mute); font-style: italic; }


/* ============================================================
   .zb-* — ZUBEHOR (Betonblöcke) specific
   ============================================================ */
.zb-uses { padding: 96px 0; background: #fff; }
.zb-uses__head { max-width: 720px; margin-bottom: 48px; }
.zb-uses__head h2 em { color: var(--gold); font-style: italic; }
.zb-uses__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 22px; }
.zb-use {
  background: var(--bg-2); border: 1px solid var(--line);
  padding: 32px 28px;
  display: flex; flex-direction: column; gap: 14px;
  position: relative;
  transition: all .25s ease;
}
.zb-use:hover { border-color: var(--gold); transform: translateY(-3px); }
.zb-use__num {
  position: absolute; top: 22px; right: 26px;
  font-family: var(--serif); font-size: 36px;
  color: var(--ink-mute); opacity: .25; line-height: 1;
}
.zb-use__icon {
  width: 56px; height: 56px;
  background: var(--ink); color: var(--gold-light);
  display: grid; place-items: center;
}
.zb-use h3 { font-family: var(--serif); font-size: 22px; color: var(--ink); font-weight: 500; margin: 0; }
.zb-use p { font-size: 14.5px; line-height: 1.65; color: var(--ink-dim); margin: 0; }
.zb-use p strong { color: var(--ink); font-weight: 600; }
.zb-use__bullets { list-style: none; padding: 12px 0 0; margin: 4px 0 0; border-top: 1px solid var(--line); display: flex; flex-direction: column; gap: 6px; font-size: 13px; color: var(--ink-dim); }

.zb-prices { padding: 96px 0; background: var(--bg-2); }
.zb-prices__head { max-width: 720px; margin-bottom: 48px; }
.zb-prices__head h2 em { color: var(--gold); font-style: italic; }
.zb-prices__table {
  background: #fff; border: 1px solid var(--line);
  display: flex; flex-direction: column;
}
.zb-prices__row {
  display: grid; grid-template-columns: 1.5fr 1fr 1fr 2fr;
  gap: 16px; padding: 16px 24px;
  border-top: 1px solid var(--line);
  font-size: 14px; color: var(--ink-dim); align-items: center;
}
.zb-prices__row:first-child { border-top: 0; }
.zb-prices__row--head {
  background: var(--ink); color: #f5efe0;
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.15em; text-transform: uppercase;
  font-weight: 700;
}
.zb-prices__row--head { color: var(--gold-light) !important; }
.zb-prices__row--featured { background: linear-gradient(135deg, #fffbf0 0%, #fff 100%); border-left: 3px solid var(--gold); }
.zb-prices__row strong { color: var(--ink); font-weight: 600; }
.zb-prices__note { margin-top: 16px; font-size: 13px; color: var(--ink-mute); font-style: italic; }
.zb-prices__cta { text-align: center; margin-top: 32px; }

.zb-system { padding: 96px 0; background: #fff; }
.zb-system__grid { display: grid; grid-template-columns: 1fr 1.2fr; gap: 56px; align-items: center; }
.zb-system__media { background: var(--bg-2); padding: 32px; }
.zb-system__svg { width: 100%; max-width: 400px; margin: 0 auto; }
.zb-system__body h2 em { color: var(--gold); font-style: italic; }
.zb-system__lead { font-family: var(--serif); font-size: 17px; line-height: 1.65; color: var(--ink-dim); margin: 24px 0 24px; }
.zb-system__lead strong { color: var(--ink); font-weight: 600; }
.zb-system__points { display: flex; flex-direction: column; gap: 12px; }
.zb-system__point {
  padding: 14px 18px;
  background: var(--bg-2);
  border-left: 3px solid var(--gold);
  font-size: 14px; color: var(--ink-dim);
}
.zb-system__point strong { color: var(--ink); font-weight: 600; }


/* ============================================================
   .fq-* — FAQ accordion specific
   ============================================================ */
.fq-nav { padding: 24px 0 48px; background: #fff; }
.fq-nav__chips { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
.fq-nav__chip {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 12px 20px;
  background: var(--bg-2); border: 1px solid var(--line);
  font-family: var(--serif); font-size: 14.5px;
  color: var(--ink); text-decoration: none; font-weight: 500;
  transition: all .15s;
}
.fq-nav__chip:hover { background: var(--ink); color: #f5efe0; border-color: var(--ink); }
.fq-nav__chip-icon {
  display: inline-grid; place-items: center;
  width: 28px; height: 28px;
  background: var(--gold); color: var(--bg-dark);
  font-family: var(--serif); font-size: 14px; font-weight: 700;
}
.fq-nav__chip em {
  font-style: normal; font-family: var(--mono); font-size: 11px;
  color: var(--ink-mute); padding: 2px 8px; background: #fff; border: 1px solid var(--line);
  margin-left: 4px; min-width: 24px; text-align: center;
}

.fq-cat { padding: 64px 0; background: #fff; }
.fq-cat:nth-child(odd) { background: var(--bg-2); }
.fq-cat__head {
  display: flex; gap: 24px; align-items: center;
  margin-bottom: 32px;
  padding-bottom: 24px;
  border-bottom: 2px solid var(--gold);
}
.fq-cat__icon {
  width: 64px; height: 64px;
  background: var(--ink); color: var(--gold-light);
  display: grid; place-items: center;
  font-family: var(--serif); font-size: 32px; font-weight: 600;
  flex-shrink: 0;
}
.fq-cat__head h2 { color: var(--ink); margin: 0; flex: 1; }
.fq-cat__count {
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.15em; text-transform: uppercase;
  color: var(--gold); font-weight: 600;
}
.fq-cat__list { display: flex; flex-direction: column; gap: 8px; }
.fq-item {
  background: #fff; border: 1px solid var(--line);
  transition: border-color .15s;
}
.fq-cat:nth-child(odd) .fq-item { background: #fff; }
.fq-item[open] { border-color: var(--gold); }
.fq-item__q {
  display: flex; justify-content: space-between; align-items: center;
  gap: 16px; padding: 18px 24px;
  cursor: pointer;
  font-family: var(--serif); font-size: 17px;
  color: var(--ink); font-weight: 500;
  list-style: none;
  user-select: none;
}
.fq-item__q::-webkit-details-marker { display: none; }
.fq-item__icon {
  width: 28px; height: 28px;
  background: var(--bg-2); color: var(--ink);
  display: grid; place-items: center;
  font-family: var(--mono); font-size: 18px; font-weight: 600;
  transition: all .25s;
  flex-shrink: 0;
}
.fq-item[open] .fq-item__icon { background: var(--gold); color: var(--bg-dark); transform: rotate(45deg); }
.fq-item__a {
  padding: 0 24px 22px;
  font-family: var(--serif); font-size: 15.5px;
  line-height: 1.7; color: var(--ink-dim);
}
.fq-item__a a { color: var(--gold); text-decoration: none; border-bottom: 1px solid var(--gold); }
.fq-item__a strong { color: var(--ink); font-weight: 600; }


/* ============================================================
   RESPONSIVE — wszystkie nowe komponenty
   ============================================================ */
@media (max-width: 1100px) {
  .fz-examples__grid, .fz-banks__grid, .ar-flow__grid, .tr-groups__grid,
  .tr-auto__grid, .zb-uses__grid, .ar-examples__grid, .th-features__grid,
  .th-demo__grid, .th-flow__grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .ar-hero__inner { grid-template-columns: 1fr; }
  .ar-hero__phone { max-width: 280px; margin: 0 auto; }
  .tr-set__grid { grid-template-columns: 1fr; }
  .zb-system__grid { grid-template-columns: 1fr; gap: 40px; }
  .zb-prices__row { grid-template-columns: 1.5fr 1fr 1fr; }
  .zb-prices__row > div:nth-child(4) { grid-column: 1 / -1; font-size: 12.5px; color: var(--ink-mute); }
  .fz-hero__facts, .zb-hero__facts, .tr-hero__facts, .th-hero__facts { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 720px) {
  .fz-examples__grid, .fz-banks__grid, .ar-flow__grid, .tr-groups__grid,
  .tr-auto__grid, .zb-uses__grid, .ar-examples__grid, .th-features__grid,
  .th-demo__grid, .th-flow__grid {
    grid-template-columns: 1fr;
  }
  .fz-hero__facts, .zb-hero__facts, .tr-hero__facts, .th-hero__facts { grid-template-columns: 1fr; }
  .fz-hero__title, .ar-hero__title, .zb-hero__title, .fq-hero__title { font-size: clamp(28px, 7vw, 40px); }
  .tr-hero__title, .th-hero__title { font-size: clamp(32px, 7vw, 44px); }
  .fz-flow__list li { grid-template-columns: 50px 1fr; gap: 18px; padding: 20px 0; }
  .fz-flow__num { width: 44px; height: 44px; font-size: 22px; }
  .fz-example__rate-num { font-size: 42px; }
  .ar-tool__card { padding: 40px 24px; }
  .ar-tool__icon { width: 72px; height: 72px; }
  .zb-prices__row { grid-template-columns: 1fr; gap: 8px; padding: 14px 18px; }
  .zb-prices__row--head { display: none; }
  .fq-cat__head { gap: 16px; }
  .fq-cat__icon { width: 48px; height: 48px; font-size: 24px; }
  .fq-item__q { font-size: 15px; padding: 16px 18px; }
  .fq-item__a { font-size: 14.5px; padding: 0 18px 18px; }
  .fq-nav__chips { gap: 6px; }
  .fq-nav__chip { padding: 10px 14px; font-size: 13px; }
}

/* ============================================================
   .mf-* — MANUFAKTUR page (eigene Produktion proof)
   2026-05-04 v8 — Adam: „rozbuduj realnie dalej"
   ============================================================ */

.mf-hero {
  position: relative;
  min-height: 720px;
  padding: 80px 0 96px;
  color: #f5efe0;
  overflow: hidden;
  background: var(--bg-dark);
}
.mf-hero__bg { position: absolute; inset: 0; z-index: 0; }
.mf-hero__bg img {
  width: 100%; height: 100%; object-fit: cover; display: block;
  opacity: .35; filter: blur(2px) grayscale(.2);
}
.mf-hero__overlay {
  position: absolute; inset: 0; z-index: 1;
  background: linear-gradient(135deg, rgba(14,11,7,.94) 0%, rgba(28,24,18,.78) 50%, rgba(14,11,7,.96) 100%);
}
.mf-hero__inner { position: relative; z-index: 2; max-width: 1180px; }
.mf-hero__crumbs {
  display: flex; gap: 10px; align-items: center;
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.18em;
  color: rgba(245,239,224,.6); text-transform: uppercase; margin-bottom: 24px;
}
.mf-hero__crumbs a { color: rgba(245,239,224,.6); text-decoration: none; }
.mf-hero__crumbs a:hover { color: var(--gold-light); }
.mf-hero__crumbs strong { color: var(--gold-light); font-weight: 500; }
.mf-hero__chip {
  display: inline-block; padding: 8px 16px;
  background: rgba(212,175,55,.15);
  color: var(--gold-light);
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.22em; text-transform: uppercase;
  border-left: 3px solid var(--gold);
  margin-bottom: 28px;
}
.mf-hero__title {
  font-family: var(--serif);
  font-size: clamp(40px, 5.5vw, 72px);
  font-weight: 500; line-height: 1.05;
  letter-spacing: -0.02em; color: #f5efe0;
  margin: 0 0 28px; max-width: 1080px;
}
.mf-hero__title em { color: var(--gold-light); font-style: italic; font-weight: 400; }
.mf-hero__lede {
  font-family: var(--serif); font-size: 18px;
  line-height: 1.65; color: #c4bba7;
  margin: 0 0 40px; max-width: 720px;
}
.mf-hero__lede strong { color: #f5efe0; font-weight: 500; }
.mf-hero__facts {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px;
  background: rgba(212,175,55,.18); border: 1px solid rgba(212,175,55,.18);
  margin-bottom: 40px;
}
.mf-hero__facts > div {
  background: rgba(0,0,0,.45); padding: 24px 22px;
  display: flex; flex-direction: column; gap: 6px;
}
.mf-hero__facts strong {
  font-family: var(--serif); font-size: 36px;
  color: var(--gold-light); font-weight: 500;
  line-height: 1; letter-spacing: -0.02em;
}
.mf-hero__facts strong small {
  font-size: 18px; color: var(--gold); margin-left: 4px;
}
.mf-hero__facts span {
  font-family: var(--mono); font-size: 11px;
  color: rgba(245,239,224,.6); letter-spacing: 0.1em;
  text-transform: uppercase; line-height: 1.4;
}
.mf-hero__cta { display: flex; gap: 14px; flex-wrap: wrap; }


/* PROCESS — 6 steps */
.mf-process { padding: 120px 0; background: linear-gradient(180deg,#fff 0%,#fdfaf3 100%); }
.mf-process__head { max-width: 800px; margin-bottom: 64px; }
.mf-process__head h2 em { color: var(--gold); font-style: italic; }
.mf-process__grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px;
}
.mf-process__step {
  background: #fff;
  border: 1px solid var(--line);
  padding: 32px 28px;
  display: flex; flex-direction: column; gap: 14px;
  position: relative;
  transition: all .25s ease;
}
.mf-process__step:hover {
  border-color: var(--gold);
  transform: translateY(-4px);
  box-shadow: 0 12px 32px rgba(20,17,11,.06);
}
.mf-process__step-num {
  position: absolute; top: 22px; right: 26px;
  font-family: var(--serif); font-size: 36px;
  color: var(--ink-mute); opacity: .25;
  line-height: 1; font-weight: 400;
  letter-spacing: -0.02em;
}
.mf-process__step-icon {
  width: 56px; height: 56px;
  background: var(--ink); color: var(--gold-light);
  display: grid; place-items: center;
  flex-shrink: 0;
}
.mf-process__step h3 {
  font-family: var(--serif); font-size: 22px;
  color: var(--ink); font-weight: 500;
  margin: 4px 0 0; letter-spacing: -0.01em;
  line-height: 1.25;
}
.mf-process__step p {
  font-size: 14.5px; line-height: 1.65;
  color: var(--ink-dim); margin: 0; flex: 1;
}
.mf-process__step p strong { color: var(--ink); font-weight: 600; }
.mf-process__step-meta {
  font-family: var(--mono); font-size: 10.5px;
  letter-spacing: 0.15em; text-transform: uppercase;
  color: var(--gold); font-weight: 600;
  padding-top: 12px;
  border-top: 1px solid var(--line);
  margin-top: auto;
}


/* PROOF — split z back/glatt photo */
.mf-proof { padding: 120px 0; background: var(--bg-2); }
.mf-proof__grid {
  display: grid; grid-template-columns: 1fr 1.05fr; gap: 64px;
  align-items: center;
}
.mf-proof__media {
  position: relative; aspect-ratio: 4/5;
  overflow: hidden; background: var(--bg-2);
  box-shadow: 0 24px 64px -16px rgba(20,17,11,.18);
}
.mf-proof__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.mf-proof__caption {
  position: absolute; bottom: 20px; left: 20px;
  background: var(--ink); color: var(--bg);
  padding: 14px 20px;
  display: flex; flex-direction: column; gap: 4px;
}
.mf-proof__caption span {
  font-family: var(--mono); font-size: 10.5px;
  letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--gold-light);
}
.mf-proof__caption strong {
  font-family: var(--serif); font-size: 17px;
  color: #f5efe0; font-weight: 500;
}
.mf-proof__body h2 em { color: var(--gold); font-style: italic; }
.mf-proof__lead {
  font-family: var(--serif); font-size: 18px;
  line-height: 1.65; color: var(--ink-dim);
  margin: 24px 0 28px;
}
.mf-proof__lead strong { color: var(--ink); font-weight: 600; }
.mf-proof__bullets {
  list-style: none; padding: 0; margin: 0 0 32px;
  display: flex; flex-direction: column; gap: 14px;
}
.mf-proof__bullets li {
  position: relative; padding-left: 24px;
  font-size: 15px; line-height: 1.6;
  color: var(--ink-dim);
}
.mf-proof__bullets li::before {
  content: "✓"; position: absolute; left: 0; top: 0;
  color: var(--gold); font-weight: 700; font-size: 16px;
}
.mf-proof__bullets li strong { color: var(--ink); font-weight: 600; }
.mf-proof__alt-photos {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px;
  margin-top: 24px;
}
.mf-proof__alt-photos figure { margin: 0; }
.mf-proof__alt-photos img {
  width: 100%; aspect-ratio: 1/1; object-fit: cover; display: block;
  border: 1px solid var(--line);
}
.mf-proof__alt-photos figcaption {
  font-family: var(--mono); font-size: 10px;
  letter-spacing: 0.15em; text-transform: uppercase;
  color: var(--ink-mute); margin-top: 6px; text-align: center;
}


/* GALLERY — Werkstatt masonry */
.mf-gallery { padding: 120px 0; background: #fff; }
.mf-gallery__head { max-width: 800px; margin-bottom: 56px; }
.mf-gallery__head h2 em { color: var(--gold); font-style: italic; }
.mf-gallery__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-auto-rows: 220px;
  gap: 8px;
  grid-auto-flow: dense;
}
.mf-gallery__tile {
  position: relative; overflow: hidden;
  background: var(--bg-2); cursor: zoom-in;
  display: block; text-decoration: none;
}
.mf-gallery__tile--big { grid-column: span 2; grid-row: span 2; }
.mf-gallery__tile--wide { grid-column: span 2; }
.mf-gallery__tile img {
  width: 100%; height: 100%; object-fit: cover; display: block;
  transition: transform .55s cubic-bezier(.4,0,.2,1);
}
.mf-gallery__tile:hover img { transform: scale(1.06); }
.mf-gallery__tile-overlay {
  position: absolute; inset: 0;
  display: flex; flex-direction: column; justify-content: flex-end;
  padding: 16px 18px;
  background: linear-gradient(180deg, transparent 0%, transparent 50%, rgba(0,0,0,.85) 100%);
  opacity: 0; transition: opacity .25s ease; pointer-events: none;
}
.mf-gallery__tile:hover .mf-gallery__tile-overlay { opacity: 1; }
.mf-gallery__tile-overlay span {
  font-family: var(--mono); font-size: 10px;
  letter-spacing: 0.2em; color: var(--gold-light);
  font-weight: 700;
}
.mf-gallery__tile-overlay strong {
  font-family: var(--serif); font-size: 17px;
  color: #f5efe0; font-weight: 500;
  margin-top: 4px;
}


/* QC — 4 cards z testami */
.mf-qc { padding: 120px 0; background: var(--bg-2); }
.mf-qc__head { max-width: 720px; margin-bottom: 56px; }
.mf-qc__head h2 em { color: var(--gold); font-style: italic; }
.mf-qc__grid {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px;
  margin-bottom: 48px;
}
.mf-qc__card {
  background: #fff; border: 1px solid var(--line);
  padding: 32px 28px;
  display: flex; flex-direction: column; gap: 12px;
  transition: all .25s ease;
}
.mf-qc__card:hover {
  border-color: var(--gold);
  transform: translateY(-3px);
  box-shadow: 0 12px 32px rgba(20,17,11,.06);
}
.mf-qc__icon {
  width: 56px; height: 56px;
  background: var(--ink); color: var(--gold-light);
  display: grid; place-items: center;
  flex-shrink: 0;
}
.mf-qc__card h3 {
  font-family: var(--serif); font-size: 21px;
  color: var(--ink); font-weight: 500;
  margin: 0; letter-spacing: -0.01em;
  line-height: 1.25;
}
.mf-qc__card p {
  font-size: 14px; line-height: 1.6;
  color: var(--ink-dim); margin: 0; flex: 1;
}
.mf-qc__card p strong { color: var(--ink); font-weight: 600; }
.mf-qc__norm {
  font-family: var(--mono); font-size: 10.5px;
  letter-spacing: 0.15em; color: var(--ink-mute);
  padding-top: 12px; border-top: 1px solid var(--line);
  margin-top: auto;
}
.mf-qc__cert-strip {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px;
  background: var(--ink); border: 1px solid var(--ink);
}
.mf-qc__cert-strip > div {
  background: var(--ink); padding: 22px 24px;
  display: flex; flex-direction: column; gap: 4px;
}
.mf-qc__cert-strip strong {
  font-family: var(--serif); font-size: 22px;
  color: var(--gold-light); font-weight: 500;
}
.mf-qc__cert-strip span {
  font-family: var(--mono); font-size: 11px;
  color: rgba(245,239,224,.55); letter-spacing: 0.06em;
}


/* WERKS-BESICHTIGUNG */
.mf-visit__grid {
  display: grid; grid-template-columns: 1.3fr 1fr; gap: 64px;
  align-items: start;
}
.mf-visit__contacts {
  margin-top: 32px; display: grid; grid-template-columns: 1fr 1fr; gap: 16px;
}
.mf-visit__contact {
  display: flex; flex-direction: column; gap: 4px;
  padding: 18px 20px;
  background: rgba(245,239,224,.04);
  border: 1px solid rgba(212,175,55,.2);
  text-decoration: none;
  transition: all .15s;
}
.mf-visit__contact:hover {
  background: rgba(212,175,55,.08);
  border-color: var(--gold);
}
.mf-visit__contact span {
  font-family: var(--mono); font-size: 10px;
  letter-spacing: 0.18em; color: rgba(245,239,224,.55);
  text-transform: uppercase;
}
.mf-visit__contact strong {
  font-family: var(--serif); font-size: 19px;
  color: #f5efe0; font-weight: 500;
}
.mf-visit__contact em {
  font-family: var(--mono); font-size: 10.5px;
  color: rgba(245,239,224,.55); font-style: normal;
  letter-spacing: 0.05em;
}
.mf-visit__address {
  background: rgba(0,0,0,.4);
  padding: 32px 28px;
  border-left: 4px solid var(--gold);
}
.mf-visit__addr {
  font-family: var(--serif); font-size: 17px;
  color: #f5efe0; line-height: 1.5;
  margin-top: 12px;
}
.mf-visit__addr strong { display: block; font-weight: 600; margin-bottom: 4px; }
.mf-visit__hours {
  margin-top: 24px; padding-top: 20px;
  border-top: 1px solid rgba(212,175,55,.2);
  display: grid; gap: 8px;
}
.mf-visit__hours > div {
  display: flex; justify-content: space-between;
  font-family: var(--mono); font-size: 12px;
  letter-spacing: 0.1em;
}
.mf-visit__hours span { color: rgba(245,239,224,.55); text-transform: uppercase; }
.mf-visit__hours strong { color: var(--gold-light); font-weight: 500; }
.mf-visit__legal {
  margin-top: 20px; padding-top: 16px;
  border-top: 1px solid rgba(212,175,55,.15);
  font-family: var(--mono); font-size: 10.5px;
  color: rgba(245,239,224,.45); letter-spacing: 0.08em;
}


/* ============================================================
   .fb-* — FARBEN page (RAL palette + praxis)
   ============================================================ */

.fb-hero {
  padding: 80px 0 64px;
  background: linear-gradient(180deg, #fff 0%, #fdfaf3 100%);
  border-bottom: 1px solid var(--line);
}
.fb-hero__inner { max-width: 1080px; }
.fb-hero__crumbs {
  display: flex; gap: 10px; align-items: center;
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.18em;
  color: var(--ink-mute); text-transform: uppercase; margin-bottom: 24px;
}
.fb-hero__crumbs a { color: var(--ink-mute); text-decoration: none; }
.fb-hero__crumbs strong { color: var(--ink); }
.fb-hero__chip {
  display: inline-block; padding: 7px 14px;
  background: var(--gold); color: var(--bg-dark);
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.22em; text-transform: uppercase;
  font-weight: 700; margin-bottom: 24px;
}
.fb-hero__title {
  font-family: var(--serif); font-size: clamp(40px, 5vw, 64px);
  font-weight: 500; line-height: 1.05;
  letter-spacing: -0.02em; color: var(--ink);
  margin: 0 0 24px;
}
.fb-hero__title em { color: var(--gold); font-style: italic; font-weight: 400; }
.fb-hero__lede {
  font-family: var(--serif); font-size: 18px;
  line-height: 1.65; color: var(--ink-dim);
  margin: 0 0 32px; max-width: 720px;
}
.fb-hero__lede strong { color: var(--ink); font-weight: 600; }
.fb-hero__facts {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px;
  background: var(--line-2); border: 1px solid var(--line-2);
}
.fb-hero__facts > div {
  background: #fff; padding: 18px 16px;
  display: flex; flex-direction: column; gap: 4px;
}
.fb-hero__facts strong {
  font-family: var(--serif); font-size: 24px;
  color: var(--gold); font-weight: 500;
  line-height: 1; letter-spacing: -0.01em;
}
.fb-hero__facts span {
  font-family: var(--mono); font-size: 10px;
  color: var(--ink-mute); letter-spacing: 0.1em;
  text-transform: uppercase; line-height: 1.4;
}

.fb-filter { padding: 64px 0 32px; background: #fff; }
.fb-filter__head { margin-bottom: 28px; max-width: 720px; }
.fb-filter__head h2 em { color: var(--gold); font-style: italic; }
.fb-filter__chips { display: flex; flex-wrap: wrap; gap: 8px; }

.fb-grid-sec { padding: 32px 0 96px; background: #fff; }
.fb-grid {
  display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px;
}
.fb-swatch {
  background: #fff; border: 1px solid var(--line);
  overflow: hidden; transition: all .25s ease;
}
.fb-swatch:hover {
  border-color: var(--gold);
  transform: translateY(-3px);
  box-shadow: 0 12px 32px rgba(20,17,11,.08);
}
.fb-swatch__color {
  aspect-ratio: 4/3;
  position: relative;
}
.fb-swatch__top {
  position: absolute; top: 10px; left: 10px;
  background: var(--gold); color: var(--bg-dark);
  font-family: var(--mono); font-size: 9px;
  letter-spacing: 0.2em; text-transform: uppercase;
  font-weight: 700; padding: 4px 10px;
}
.fb-swatch--top { border-color: var(--gold); }
.fb-swatch__body { padding: 14px 16px; }
.fb-swatch__ral {
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.15em; color: var(--gold);
  font-weight: 700; text-transform: uppercase;
}
.fb-swatch__name {
  font-family: var(--serif); font-size: 17px;
  color: var(--ink); font-weight: 500;
  margin: 4px 0 6px; letter-spacing: -0.005em;
}
.fb-swatch__hex {
  font-family: var(--mono); font-size: 10.5px;
  color: var(--ink-mute); letter-spacing: 0.05em;
  text-transform: uppercase;
}

.fb-praxis { padding: 96px 0; background: var(--bg-2); }
.fb-praxis__head { margin-bottom: 56px; max-width: 720px; }
.fb-praxis__head h2 em { color: var(--gold); font-style: italic; }
.fb-praxis__grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px;
}
.fb-praxis__tile {
  position: relative; aspect-ratio: 4/3;
  overflow: hidden; cursor: zoom-in;
  background: var(--bg-2); display: block; text-decoration: none;
}
.fb-praxis__tile img {
  width: 100%; height: 100%; object-fit: cover; display: block;
  transition: transform .55s cubic-bezier(.4,0,.2,1);
}
.fb-praxis__tile:hover img { transform: scale(1.06); }
.fb-praxis__tile-overlay {
  position: absolute; bottom: 0; left: 0; right: 0;
  padding: 16px 18px;
  background: linear-gradient(180deg, transparent 0%, rgba(0,0,0,.85) 100%);
  display: flex; gap: 12px; align-items: center;
  color: #f5efe0;
}
.fb-praxis__tile-swatch {
  width: 36px; height: 36px;
  border: 2px solid #f5efe0;
  flex-shrink: 0;
}
.fb-praxis__tile-overlay strong {
  font-family: var(--serif); font-size: 16px;
  color: #f5efe0; font-weight: 500;
  display: block; line-height: 1.2;
}
.fb-praxis__tile-overlay span {
  font-family: var(--mono); font-size: 10.5px;
  color: var(--gold-light); letter-spacing: 0.08em;
  text-transform: uppercase;
}

.fb-process { padding: 96px 0; background: #fff; }
.fb-process__head { margin-bottom: 56px; max-width: 720px; }
.fb-process__head h2 em { color: var(--gold); font-style: italic; }
.fb-process__list {
  list-style: none; padding: 0; margin: 0;
  display: flex; flex-direction: column; gap: 0;
}
.fb-process__list li {
  display: grid; grid-template-columns: 80px 1fr; gap: 32px;
  padding: 32px 0;
  border-top: 1px solid var(--line);
  align-items: start;
}
.fb-process__list li:last-child { border-bottom: 1px solid var(--line); }
.fb-process__num {
  width: 60px; height: 60px;
  background: var(--gold); color: var(--bg-dark);
  display: grid; place-items: center;
  font-family: var(--serif); font-size: 28px;
  font-weight: 600; line-height: 1;
}
.fb-process__list h3 {
  font-family: var(--serif); font-size: 24px;
  color: var(--ink); font-weight: 500;
  margin: 0 0 8px; letter-spacing: -0.01em;
}
.fb-process__list p {
  font-size: 15px; line-height: 1.65;
  color: var(--ink-dim); margin: 0;
}
.fb-process__list p strong { color: var(--ink); font-weight: 600; }
.fb-process__stats {
  margin-top: 56px;
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px;
  background: var(--ink); border: 1px solid var(--ink);
}
.fb-process__stats > div {
  background: var(--ink); padding: 22px 20px;
  display: flex; flex-direction: column; gap: 4px;
}
.fb-process__stats strong {
  font-family: var(--serif); font-size: 22px;
  color: var(--gold-light); font-weight: 500;
}
.fb-process__stats span {
  font-family: var(--mono); font-size: 10.5px;
  color: rgba(245,239,224,.55); letter-spacing: 0.08em;
  text-transform: uppercase;
}


/* ============================================================
   .gt-* — GARANTIEN page
   ============================================================ */

.gt-hero {
  padding: 80px 0 96px;
  background: linear-gradient(180deg, var(--bg-2) 0%, #fdfaf3 100%);
}
.gt-hero__inner { max-width: 1240px; }
.gt-hero__crumbs {
  display: flex; gap: 10px; align-items: center;
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.18em;
  color: var(--ink-mute); text-transform: uppercase; margin-bottom: 24px;
}
.gt-hero__crumbs a { color: var(--ink-mute); text-decoration: none; }
.gt-hero__crumbs strong { color: var(--ink); }
.gt-hero__chip {
  display: inline-block; padding: 8px 16px;
  background: var(--ink); color: var(--gold-light);
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.22em; text-transform: uppercase;
  border-left: 3px solid var(--gold);
  margin-bottom: 28px;
}
.gt-hero__title {
  font-family: var(--serif); font-size: clamp(40px, 5.5vw, 72px);
  font-weight: 500; line-height: 1.05;
  letter-spacing: -0.02em; color: var(--ink);
  margin: 0 0 28px;
}
.gt-hero__title em { color: var(--gold); font-style: italic; font-weight: 400; }
.gt-hero__lede {
  font-family: var(--serif); font-size: 18px;
  line-height: 1.65; color: var(--ink-dim);
  margin: 0 0 48px; max-width: 880px;
}
.gt-hero__lede strong { color: var(--ink); font-weight: 600; }

/* Plate — 4 wielkie liczby */
.gt-plate {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px;
  background: var(--gold); border: 1px solid var(--gold);
  box-shadow: 0 16px 48px -12px rgba(212,175,55,0.25);
}
.gt-plate__item {
  background: linear-gradient(180deg, #fff 0%, var(--bg-2) 100%);
  padding: 40px 28px;
  text-align: center;
  display: flex; flex-direction: column; gap: 4px;
}
.gt-plate__item--bgb {
  background: linear-gradient(180deg, var(--ink) 0%, #2a241a 100%);
  color: #f5efe0;
}
.gt-plate__num {
  font-family: var(--serif); font-size: 96px;
  color: var(--ink); font-weight: 500;
  line-height: 1; letter-spacing: -0.04em;
  text-shadow: 0 2px 24px rgba(212,175,55,0.18);
}
.gt-plate__item--bgb .gt-plate__num { color: var(--gold-light); }
.gt-plate__unit {
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--gold); margin-top: 12px; font-weight: 600;
}
.gt-plate__item--bgb .gt-plate__unit { color: var(--gold-light); }
.gt-plate__label {
  font-family: var(--serif); font-size: 18px;
  color: var(--ink); font-weight: 500; font-style: italic;
  margin-top: 8px;
}
.gt-plate__item--bgb .gt-plate__label { color: #f5efe0; }
.gt-plate__sub {
  font-family: var(--mono); font-size: 10.5px;
  color: var(--ink-mute); letter-spacing: 0.06em;
  margin-top: 4px;
}
.gt-plate__item--bgb .gt-plate__sub { color: rgba(245,239,224,.55); }


/* Detail cards 30/10/5/BGB */
.gt-detail { padding: 120px 0; background: #fff; }
.gt-detail__head { margin-bottom: 64px; max-width: 720px; }
.gt-detail__head h2 em { color: var(--gold); font-style: italic; }
.gt-detail__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.gt-card {
  background: #fff; border: 1px solid var(--line);
  display: flex; flex-direction: column;
  transition: all .25s ease;
}
.gt-card:hover { border-color: var(--gold); transform: translateY(-3px); box-shadow: 0 12px 32px rgba(20,17,11,.06); }
.gt-card__head {
  display: flex; gap: 24px; align-items: center;
  padding: 28px 32px;
  border-bottom: 1px solid var(--line);
  background: var(--bg-2);
}
.gt-card--bgb .gt-card__head {
  background: var(--ink); color: #f5efe0;
}
.gt-card__num {
  font-family: var(--serif); font-size: 56px;
  color: var(--gold); font-weight: 500;
  line-height: 1; letter-spacing: -0.02em;
  min-width: 100px;
}
.gt-card__label {
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--gold); font-weight: 600;
}
.gt-card--bgb .gt-card__label { color: var(--gold-light); }
.gt-card__head h3 {
  font-family: var(--serif); font-size: 28px;
  color: var(--ink); font-weight: 500;
  margin: 4px 0 0; letter-spacing: -0.01em;
}
.gt-card--bgb .gt-card__head h3 { color: #f5efe0; }
.gt-card__body { padding: 28px 32px; }
.gt-card__body p {
  font-family: var(--serif); font-size: 15.5px;
  line-height: 1.7; color: var(--ink-dim); margin: 0 0 16px;
}
.gt-card__body p strong { color: var(--ink); font-weight: 600; }
.gt-card__list {
  list-style: none; padding: 0; margin: 0 0 20px;
  display: flex; flex-direction: column; gap: 8px;
}
.gt-card__list li {
  font-size: 14px; color: var(--ink-dim);
  font-family: var(--serif); line-height: 1.5;
}
.gt-card__exception {
  padding: 14px 18px;
  background: var(--bg-2);
  border-left: 3px solid var(--gold);
  font-size: 13.5px; line-height: 1.55;
  color: var(--ink-dim);
}
.gt-card__exception strong { color: var(--ink); font-weight: 600; }


/* FLOW — 3 steps */
.gt-flow { padding: 120px 0; background: var(--bg-2); }
.gt-flow__head { margin-bottom: 56px; max-width: 720px; }
.gt-flow__head h2 em { color: var(--gold); font-style: italic; }
.gt-flow__list {
  list-style: none; padding: 0; margin: 0;
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px;
}
.gt-flow__list li {
  background: #fff; border: 1px solid var(--line);
  padding: 32px 28px;
  position: relative;
  transition: all .25s;
}
.gt-flow__list li:hover { border-color: var(--gold); transform: translateY(-3px); }
.gt-flow__num {
  font-family: var(--serif); font-size: 48px;
  color: var(--gold); font-weight: 500;
  line-height: 1; letter-spacing: -0.02em;
  margin-bottom: 16px;
}
.gt-flow__list h3 {
  font-family: var(--serif); font-size: 22px;
  color: var(--ink); font-weight: 500;
  margin: 0 0 12px; letter-spacing: -0.01em;
}
.gt-flow__list p {
  font-size: 14px; line-height: 1.65;
  color: var(--ink-dim); margin: 0 0 16px;
}
.gt-flow__list p a { color: var(--gold); text-decoration: none; border-bottom: 1px solid var(--gold); }
.gt-flow__list p strong { color: var(--ink); font-weight: 600; }
.gt-flow__time {
  display: inline-block;
  padding: 6px 12px;
  background: var(--bg-2);
  border-left: 3px solid var(--gold);
  font-family: var(--mono); font-size: 10.5px;
  letter-spacing: 0.15em; text-transform: uppercase;
  color: var(--gold); font-weight: 600;
}


/* CERTS strip */
.gt-certs { padding: 96px 0; background: #fff; }
.gt-certs__head { margin-bottom: 48px; max-width: 800px; }
.gt-certs__head h2 em { color: var(--gold); font-style: italic; }
.gt-certs__grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px;
}
.gt-certs__card {
  padding: 22px 24px;
  background: var(--bg-2);
  border-left: 3px solid var(--gold);
  display: flex; flex-direction: column; gap: 6px;
}
.gt-certs__card strong {
  font-family: var(--serif); font-size: 19px;
  color: var(--ink); font-weight: 500;
  letter-spacing: -0.005em;
}
.gt-certs__card span {
  font-size: 13px; color: var(--ink-dim); line-height: 1.5;
}


/* RESPONSIVE — wszystkie nowe sekcje */
@media (max-width: 1100px) {
  .mf-hero__facts { grid-template-columns: repeat(2, 1fr); }
  .mf-process__grid { grid-template-columns: repeat(2, 1fr); }
  .mf-proof__grid { grid-template-columns: 1fr; gap: 40px; }
  .mf-proof__media { max-width: 480px; margin: 0 auto; }
  .mf-gallery__grid { grid-template-columns: repeat(3, 1fr); }
  .mf-qc__grid { grid-template-columns: repeat(2, 1fr); }
  .mf-qc__cert-strip { grid-template-columns: 1fr; }
  .mf-visit__grid { grid-template-columns: 1fr; gap: 40px; }
  .mf-visit__contacts { grid-template-columns: 1fr; }
  .fb-grid { grid-template-columns: repeat(4, 1fr); }
  .fb-praxis__grid { grid-template-columns: repeat(2, 1fr); }
  .fb-process__stats { grid-template-columns: repeat(2, 1fr); }
  .gt-detail__grid { grid-template-columns: 1fr; }
  .gt-flow__list { grid-template-columns: 1fr; }
  .gt-certs__grid { grid-template-columns: repeat(2, 1fr); }
  .gt-plate { grid-template-columns: repeat(2, 1fr); }
  .gt-plate__num { font-size: 72px; }
}
@media (max-width: 720px) {
  .mf-hero { min-height: 560px; padding: 40px 0 64px; }
  .mf-hero__title { font-size: clamp(32px, 7vw, 44px); }
  .mf-hero__lede { font-size: 16px; }
  .mf-hero__facts { grid-template-columns: 1fr; }
  .mf-process, .mf-proof, .mf-gallery, .mf-qc { padding: 64px 0; }
  .mf-process__grid, .mf-qc__grid { grid-template-columns: 1fr; }
  .mf-gallery__grid { grid-template-columns: 1fr 1fr; grid-auto-rows: 160px; }
  .mf-gallery__tile-overlay { opacity: 1; }
  .fb-grid { grid-template-columns: repeat(2, 1fr); }
  .fb-praxis__grid { grid-template-columns: 1fr; }
  .fb-process__list li { grid-template-columns: 60px 1fr; gap: 18px; }
  .fb-process__num { width: 48px; height: 48px; font-size: 22px; }
  .fb-process__stats { grid-template-columns: 1fr; }
  .gt-plate__num { font-size: 56px; }
  .gt-plate__item { padding: 28px 18px; }
  .gt-card__head { padding: 22px 24px; gap: 18px; }
  .gt-card__num { font-size: 42px; min-width: 70px; }
  .gt-card__head h3 { font-size: 22px; }
  .gt-certs__grid { grid-template-columns: 1fr; }
}

/* ============================================================
   .ub-werkstatt — eigene Produktion proof section (2026-05-04 v7)
   2-col split: glatte Rückseite photo + 3 numbered points + CTA
   ============================================================ */

.ub-werkstatt {
  padding: 120px 0;
  background: linear-gradient(180deg, #fff 0%, #fdfaf3 100%);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.ub-werkstatt__grid {
  display: grid;
  grid-template-columns: 1fr 1.05fr;
  gap: 64px;
  align-items: center;
}
.ub-werkstatt__media {
  position: relative;
  aspect-ratio: 4/5;
  overflow: hidden;
  background: var(--bg-2);
  box-shadow: 0 24px 64px -16px rgba(20,17,11,.18);
}
.ub-werkstatt__media img {
  width: 100%; height: 100%; object-fit: cover; display: block;
}
.ub-werkstatt__caption {
  position: absolute; bottom: 20px; left: 20px;
  background: var(--ink); color: var(--bg);
  padding: 14px 20px;
  display: flex; flex-direction: column; gap: 4px;
}
.ub-werkstatt__caption span {
  font-family: var(--mono); font-size: 10.5px;
  letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--gold-light);
}
.ub-werkstatt__caption strong {
  font-family: var(--serif); font-size: 17px;
  color: #f5efe0; font-weight: 500;
}

.ub-werkstatt__body h2 em { color: var(--gold); font-style: italic; }
.ub-werkstatt__lead {
  font-family: var(--serif); font-size: 18px;
  line-height: 1.65; color: var(--ink-dim);
  margin: 24px 0 32px;
}

.ub-werkstatt__points {
  display: flex; flex-direction: column; gap: 24px;
}
.ub-werkstatt__point {
  display: grid; grid-template-columns: auto 1fr; gap: 22px;
  padding-left: 0; padding-bottom: 24px;
  border-bottom: 1px solid var(--line);
}
.ub-werkstatt__point:last-child { border-bottom: 0; padding-bottom: 0; }
.ub-werkstatt__point-num {
  font-family: var(--serif); font-size: 36px;
  color: var(--gold); font-weight: 500;
  line-height: 1; letter-spacing: -0.02em;
  min-width: 50px;
}
.ub-werkstatt__point strong {
  font-family: var(--serif); font-size: 19px;
  color: var(--ink); font-weight: 500;
  display: block; margin-bottom: 6px;
  letter-spacing: -0.005em;
}
.ub-werkstatt__point p {
  font-size: 14.5px; line-height: 1.6;
  color: var(--ink-dim); margin: 0;
}


/* ============================================================
   .sp-realisiert — single-product "realised in this style" gallery
   6 photos per styl (2026-05-04 v7) — proof zamiast pustego whitespace
   ============================================================ */

.sp-realisiert__head { max-width: 800px; margin-bottom: 56px; }
.sp-realisiert__head h2 em { color: var(--gold); font-style: italic; }

.sp-realisiert__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-auto-rows: 220px;
  gap: 8px;
}
.sp-realisiert__tile {
  position: relative;
  overflow: hidden;
  background: var(--bg-2);
  text-decoration: none;
  display: block;
  cursor: zoom-in;
}
.sp-realisiert__tile--big {
  grid-column: span 2;
  grid-row: span 2;
}
.sp-realisiert__tile img {
  width: 100%; height: 100%; object-fit: cover; display: block;
  transition: transform .55s cubic-bezier(.4,0,.2,1);
}
.sp-realisiert__tile:hover img { transform: scale(1.06); }
.sp-realisiert__tile-overlay {
  position: absolute; inset: 0;
  display: flex; flex-direction: column; justify-content: flex-end;
  padding: 16px 18px;
  color: #f5efe0;
  background: linear-gradient(180deg, transparent 0%, transparent 50%, rgba(0,0,0,.85) 100%);
  opacity: 0;
  transition: opacity .25s ease;
  pointer-events: none;
}
.sp-realisiert__tile:hover .sp-realisiert__tile-overlay { opacity: 1; }
.sp-realisiert__tile-overlay strong {
  font-family: var(--serif); font-size: 19px;
  font-weight: 500; letter-spacing: -0.01em;
}
.sp-realisiert__tile-overlay span {
  font-family: var(--mono); font-size: 11px;
  color: var(--gold-light); letter-spacing: 0.1em;
  text-transform: uppercase;
  margin-top: 2px;
}

.sp-realisiert__cta { text-align: center; margin-top: 40px; }


/* Tablet/mobile responsive for new sections */
@media (max-width: 980px) {
  .ub-werkstatt__grid { grid-template-columns: 1fr; gap: 40px; }
  .ub-werkstatt__media { max-width: 540px; margin: 0 auto; }
  .sp-realisiert__grid { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 180px; }
  .sp-realisiert__tile--big { grid-column: span 2; grid-row: span 1; }
}
@media (max-width: 640px) {
  .ub-werkstatt { padding: 64px 0; }
  .ub-werkstatt__lead { font-size: 16px; }
  .ub-werkstatt__point-num { font-size: 28px; min-width: 38px; }
  .sp-realisiert__grid { grid-template-columns: 1fr; grid-auto-rows: 200px; }
  .sp-realisiert__tile--big { grid-column: span 1; }
  .sp-realisiert__tile-overlay { opacity: 1; } /* always visible on touch */
}

/* ============================================================
   .rf-* — REFERENZEN page (refresh 2026-05-04 v6)
   Adam: „Ta strona ma eksplodować pod kątem tego żeby sprzedawała"
   Hero + filter chips + masonry 36 photos + 3 case studies + reviews
   ============================================================ */

/* HERO */
.rf-hero {
  position: relative;
  min-height: 720px;
  padding: 80px 0 96px;
  color: #f5efe0;
  overflow: hidden;
  background: var(--bg-dark);
}
.rf-hero__bg {
  position: absolute; inset: 0; z-index: 0;
}
.rf-hero__bg img {
  width: 100%; height: 100%; object-fit: cover; display: block;
  opacity: .42; filter: blur(2px) grayscale(.3);
}
.rf-hero__overlay {
  position: absolute; inset: 0; z-index: 1;
  background: linear-gradient(135deg, rgba(14,11,7,.92) 0%, rgba(28,24,18,.78) 50%, rgba(14,11,7,.96) 100%);
}
.rf-hero__inner {
  position: relative; z-index: 2;
  max-width: 1180px;
}
.rf-hero__crumbs {
  display: flex; gap: 10px; align-items: center;
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.18em; text-transform: uppercase;
  color: rgba(245,239,224,.6); margin-bottom: 24px;
}
.rf-hero__crumbs a { color: rgba(245,239,224,.6); text-decoration: none; }
.rf-hero__crumbs a:hover { color: var(--gold-light); }
.rf-hero__crumbs strong { color: var(--gold-light); font-weight: 500; }
.rf-hero__chip {
  display: inline-block;
  padding: 8px 16px;
  background: rgba(212,175,55,.15);
  color: var(--gold-light);
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.22em; text-transform: uppercase;
  border-left: 3px solid var(--gold);
  margin-bottom: 28px;
}
.rf-hero__title {
  font-family: var(--serif);
  font-size: clamp(40px, 5.5vw, 72px);
  font-weight: 500;
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: #f5efe0;
  margin: 0 0 28px;
  max-width: 1080px;
}
.rf-hero__title em { color: var(--gold-light); font-style: italic; font-weight: 400; }
.rf-hero__lede {
  font-family: var(--serif); font-size: 18px;
  line-height: 1.65; color: #c4bba7;
  margin: 0 0 40px; max-width: 720px;
}
.rf-hero__facts {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  background: rgba(212,175,55,.18);
  border: 1px solid rgba(212,175,55,.18);
  margin-bottom: 40px;
}
.rf-hero__facts > div {
  background: rgba(0,0,0,.45);
  padding: 24px 22px;
  display: flex; flex-direction: column; gap: 6px;
}
.rf-hero__facts strong {
  font-family: var(--serif); font-size: 36px;
  color: var(--gold-light); font-weight: 500;
  line-height: 1; letter-spacing: -0.02em;
}
.rf-hero__facts span {
  font-family: var(--mono); font-size: 11px;
  color: rgba(245,239,224,.6); letter-spacing: 0.1em;
  text-transform: uppercase; line-height: 1.4;
}
.rf-hero__cta { display: flex; gap: 14px; flex-wrap: wrap; }


/* FILTER chips */
.rf-filter {
  padding: 80px 0 32px;
  background: #fff;
}
.rf-filter__head { margin-bottom: 32px; max-width: 720px; }
.rf-filter__head h2 em { color: var(--gold); font-style: italic; }
.rf-filter__chips {
  display: flex; flex-wrap: wrap; gap: 8px;
}
.rf-chip {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 10px 18px;
  background: var(--bg-2);
  border: 1px solid var(--line-2);
  font-family: var(--mono); font-size: 12px;
  letter-spacing: 0.1em; color: var(--ink-dim);
  cursor: pointer; transition: all .15s ease;
  text-transform: uppercase;
}
.rf-chip:hover { background: var(--ink); color: #f5efe0; border-color: var(--ink); }
.rf-chip.is-active {
  background: var(--gold); color: var(--bg-dark);
  border-color: var(--gold); font-weight: 700;
}
.rf-chip em {
  font-family: var(--mono); font-style: normal;
  font-size: 11px; opacity: .7;
  padding: 2px 6px; background: rgba(0,0,0,.06); border-radius: 9px;
  min-width: 24px; text-align: center;
}
.rf-chip.is-active em { background: rgba(20,17,11,.18); opacity: 1; }


/* MASONRY */
.rf-masonry {
  padding: 32px 0 96px;
  background: #fff;
}
.rf-masonry__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-auto-rows: 240px;
  gap: 8px;
  grid-auto-flow: dense;
}
.rf-tile {
  position: relative;
  overflow: hidden;
  background: var(--bg-2);
  text-decoration: none;
  display: block;
  cursor: zoom-in;
}
.rf-tile--tall { grid-row: span 2; }
.rf-tile--wide { grid-column: span 2; }
.rf-tile img {
  width: 100%; height: 100%; object-fit: cover; display: block;
  transition: transform .55s cubic-bezier(.4,0,.2,1);
}
.rf-tile:hover img { transform: scale(1.06); }
.rf-tile__overlay {
  position: absolute; inset: 0;
  display: flex; flex-direction: column; justify-content: space-between;
  padding: 16px 18px;
  background: linear-gradient(180deg, rgba(0,0,0,.5) 0%, rgba(0,0,0,0) 30%, rgba(0,0,0,0) 60%, rgba(0,0,0,.85) 100%);
  opacity: 0; transition: opacity .25s ease;
  pointer-events: none;
}
.rf-tile:hover .rf-tile__overlay { opacity: 1; }
.rf-tile__top {
  display: flex; justify-content: space-between; align-items: flex-start;
  color: #f5efe0;
}
.rf-tile__style {
  font-family: var(--mono); font-size: 10px;
  letter-spacing: 0.2em; color: var(--gold-light);
  font-weight: 700;
  background: rgba(0,0,0,.45);
  padding: 4px 10px;
}
.rf-tile__zoom {
  font-size: 24px; color: var(--gold-light);
  width: 36px; height: 36px;
  display: grid; place-items: center;
  background: rgba(0,0,0,.45); line-height: 1;
}
.rf-tile__bottom {
  color: #f5efe0;
  display: flex; flex-direction: column; gap: 2px;
}
.rf-tile__bottom strong {
  font-family: var(--serif); font-size: 19px;
  font-weight: 500; letter-spacing: -0.01em;
}
.rf-tile__bottom span {
  font-family: var(--mono); font-size: 11px;
  color: var(--gold-light); letter-spacing: 0.05em;
}

.rf-masonry__empty {
  grid-column: 1 / -1;
  text-align: center; padding: 80px 20px;
  background: var(--bg-2);
}
.rf-masonry__empty p {
  font-family: var(--serif); font-size: 18px;
  color: var(--ink-dim); margin: 0 auto 24px; max-width: 560px;
}
.rf-masonry__meta {
  margin-top: 40px; padding: 20px 0; border-top: 1px solid var(--line);
  display: flex; justify-content: space-between; flex-wrap: wrap; gap: 12px;
  font-family: var(--mono); font-size: 11.5px;
  color: var(--ink-mute); letter-spacing: 0.1em;
}
.rf-masonry__meta strong { color: var(--ink); font-weight: 600; }


/* CASE STUDIES */
.rf-cases {
  padding: 120px 0;
  background: var(--bg-2);
}
.rf-cases__head { margin-bottom: 64px; max-width: 760px; }
.rf-cases__head h2 em { color: var(--gold); font-style: italic; }
.rf-cases__grid { display: flex; flex-direction: column; gap: 56px; }
.rf-case {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 56px;
  align-items: center;
  background: #fff;
  border: 1px solid var(--line);
  overflow: hidden;
}
.rf-case--reverse { direction: rtl; }
.rf-case--reverse > * { direction: ltr; }
.rf-case__media {
  position: relative;
  aspect-ratio: 4/3;
  overflow: hidden;
}
.rf-case__media img {
  width: 100%; height: 100%; object-fit: cover;
}
.rf-case__badge {
  position: absolute; top: 18px; left: 18px;
  padding: 8px 14px;
  background: var(--ink); color: #f5efe0;
  font-family: var(--mono); font-size: 10.5px;
  letter-spacing: 0.18em; text-transform: uppercase;
  font-weight: 700;
}
.rf-case__badge--gold { background: var(--gold); color: var(--bg-dark); }
.rf-case__body { padding: 40px 44px; }
.rf-case__loc {
  font-family: var(--mono); font-size: 11.5px;
  letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--gold); font-weight: 600;
  margin-bottom: 14px;
}
.rf-case__body h3 {
  font-family: var(--serif); font-size: 32px;
  font-weight: 500; color: var(--ink);
  margin: 0 0 24px; line-height: 1.2;
  letter-spacing: -0.01em;
}
.rf-case__body h3 em { color: var(--gold); font-style: italic; }
.rf-case__facts {
  list-style: none; padding: 0; margin: 0 0 24px;
  display: flex; flex-direction: column; gap: 8px;
  border-left: 3px solid var(--gold);
  padding-left: 18px;
}
.rf-case__facts li {
  font-size: 14px; color: var(--ink-dim);
  font-family: var(--serif);
}
.rf-case__facts strong {
  color: var(--ink); font-weight: 600;
  display: inline-block; min-width: 130px;
}
.rf-case__story {
  font-family: var(--serif); font-size: 15px;
  line-height: 1.7; color: var(--ink-dim);
  margin: 0;
}
.rf-case__story strong { color: var(--ink); font-weight: 600; }


/* LIGHTBOX */
.rf-lightbox {
  position: fixed; inset: 0; z-index: 9999;
  background: rgba(14,11,7,.94);
  backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
  display: none; align-items: center; justify-content: center;
  padding: 40px;
  opacity: 0; transition: opacity .25s ease;
}
.rf-lightbox.is-open { display: flex; opacity: 1; }
.rf-lightbox__img {
  max-width: min(90vw, 1400px); max-height: 88vh;
  object-fit: contain;
  display: block;
  box-shadow: 0 24px 80px rgba(0,0,0,.5);
}
.rf-lightbox__close {
  position: absolute; top: 24px; right: 24px;
  width: 56px; height: 56px;
  background: rgba(245,239,224,.08);
  border: 1px solid rgba(245,239,224,.2);
  color: #f5efe0;
  font-size: 28px; line-height: 1;
  cursor: pointer; display: grid; place-items: center;
  transition: all .15s;
}
.rf-lightbox__close:hover { background: var(--gold); color: var(--bg-dark); border-color: var(--gold); }


/* Tablet/mobile */
@media (max-width: 1100px) {
  .rf-hero__facts { grid-template-columns: repeat(2, 1fr); }
  .rf-masonry__grid { grid-template-columns: repeat(3, 1fr); }
  .rf-case { grid-template-columns: 1fr; }
  .rf-case__body { padding: 32px 28px; }
}
@media (max-width: 720px) {
  .rf-hero { min-height: 560px; padding: 40px 0 64px; }
  .rf-hero__title { font-size: clamp(32px, 7vw, 44px); }
  .rf-hero__lede { font-size: 16px; }
  .rf-hero__facts { grid-template-columns: 1fr; }
  .rf-hero__facts strong { font-size: 28px; }
  .rf-masonry__grid { grid-template-columns: 1fr 1fr; grid-auto-rows: 160px; gap: 6px; }
  .rf-tile--wide { grid-column: span 2; }
  .rf-tile__overlay { opacity: 1; padding: 12px 14px; } /* always visible on touch */
  .rf-tile__bottom strong { font-size: 16px; }
  .rf-cases { padding: 64px 0; }
  .rf-case__body h3 { font-size: 24px; }
  .rf-case__facts strong { min-width: 100px; }
}

/* ============================================================
   .ub-* — Über uns page (refresh 2026-05-04 v5)
   Hero z LKW · stats · manifest · timeline · team · refs · values · certs · contact
   Adam: „chyba żartujesz że tak będzie wyglądała strona o mnie. To jest Katastrofa"
   ============================================================ */

/* HERO */
.ub-hero {
  padding: 56px 0 96px;
  background: linear-gradient(180deg, #fff 0%, #fdfaf3 100%);
  border-bottom: 1px solid var(--line);
}
.ub-hero__inner {
  display: grid;
  grid-template-columns: 1.05fr 1fr;
  gap: 64px;
  align-items: center;
  max-width: 1280px;
}
.ub-hero__copy { padding-right: 12px; }
.ub-hero__crumbs {
  display: flex; gap: 10px; align-items: center;
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.18em;
  color: var(--ink-mute); text-transform: uppercase; margin-bottom: 24px;
}
.ub-hero__crumbs a { color: var(--ink-mute); text-decoration: none; }
.ub-hero__crumbs a:hover { color: var(--gold); }
.ub-hero__crumbs strong { color: var(--ink); font-weight: 500; }
.ub-hero__chip {
  display: inline-block;
  padding: 7px 14px;
  background: var(--gold);
  color: var(--bg-dark);
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.22em; text-transform: uppercase;
  font-weight: 700; margin-bottom: 28px;
}
.ub-hero__title {
  font-family: var(--serif);
  font-size: clamp(40px, 5vw, 68px);
  font-weight: 500;
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: var(--ink);
  margin: 0 0 28px;
}
.ub-hero__title em { color: var(--gold); font-style: italic; font-weight: 400; }
.ub-hero__lede {
  font-family: var(--serif);
  font-size: 18px;
  line-height: 1.65;
  color: var(--ink-dim);
  margin: 0 0 36px;
  max-width: 640px;
}
.ub-hero__lede strong { color: var(--ink); font-weight: 600; }
.ub-hero__cta {
  display: flex; gap: 14px; flex-wrap: wrap;
  margin-bottom: 40px;
}
.ub-hero__trust {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  background: var(--line-2);
  border: 1px solid var(--line-2);
  background-color: #fff;
}
.ub-hero__trust > div {
  background: #fff;
  padding: 18px 16px;
  display: flex; flex-direction: column; gap: 4px;
}
.ub-hero__trust strong {
  font-family: var(--serif); font-size: 24px;
  color: var(--gold); font-weight: 500;
  line-height: 1; letter-spacing: -0.02em;
}
.ub-hero__trust span {
  font-family: var(--mono); font-size: 10px;
  color: var(--ink-mute); letter-spacing: 0.1em;
  text-transform: uppercase; line-height: 1.3;
}

.ub-hero__media {
  display: grid;
  grid-template-rows: 1fr auto;
  gap: 12px;
}
.ub-hero__photo-main {
  position: relative;
  aspect-ratio: 4/3;
  overflow: hidden;
  background: var(--bg-2);
  box-shadow: 0 24px 48px -16px rgba(20,17,11,.18);
}
.ub-hero__photo-main img {
  width: 100%; height: 100%; object-fit: cover; display: block;
}
.ub-hero__photo-tag {
  position: absolute;
  bottom: 16px; left: 16px;
  background: var(--ink); color: var(--bg);
  padding: 12px 18px;
  display: flex; flex-direction: column; gap: 2px;
}
.ub-hero__photo-tag span {
  font-family: var(--mono); font-size: 10px;
  letter-spacing: 0.18em; color: var(--gold-light);
  text-transform: uppercase;
}
.ub-hero__photo-tag strong {
  font-family: var(--serif); font-size: 17px;
  color: #f5efe0; font-weight: 500;
  letter-spacing: -0.005em;
}
.ub-hero__photo-strip {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
}
.ub-hero__photo-strip img {
  width: 100%; aspect-ratio: 4/3; object-fit: cover; display: block;
  transition: transform .25s ease;
}
.ub-hero__photo-strip img:hover { transform: scale(1.04); }


/* STATS — large dark strip */
.ub-stats {
  background: var(--ink); color: #f5efe0;
  padding: 64px 0;
}
.ub-stats__grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 1px;
  background: rgba(212,175,55,.18);
  border: 1px solid rgba(212,175,55,.18);
}
.ub-stats__item {
  background: var(--ink);
  padding: 32px 26px;
  display: flex; flex-direction: column; gap: 8px;
}
.ub-stats__item--gold {
  background: linear-gradient(135deg, var(--gold) 0%, #b8891f 100%);
  color: var(--bg-dark);
}
.ub-stats__num {
  font-family: var(--serif);
  font-size: 56px; font-weight: 500;
  color: var(--gold-light);
  line-height: 1; letter-spacing: -0.02em;
}
.ub-stats__num span {
  font-size: 28px; color: inherit; opacity: .85;
}
.ub-stats__item--gold .ub-stats__num { color: var(--bg-dark); }
.ub-stats__lbl {
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--gold); font-weight: 600;
  margin-top: 6px;
}
.ub-stats__item--gold .ub-stats__lbl { color: var(--ink); }
.ub-stats__sub {
  font-size: 12px; color: rgba(245,239,224,.55);
  line-height: 1.45;
}
.ub-stats__item--gold .ub-stats__sub { color: rgba(20,17,11,.7); }


/* MANIFEST */
.ub-manifest {
  background: var(--bg-2);
  padding: 120px 0;
}
.ub-manifest__head { max-width: 880px; margin-bottom: 64px; }
.ub-manifest__head h2 em { color: var(--gold); font-style: italic; }
.ub-manifest__grid {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 80px;
  align-items: start;
}
.ub-manifest__lead {
  font-family: var(--serif); font-size: 22px;
  line-height: 1.55; color: var(--ink);
  margin: 0 0 24px;
  padding: 0 0 24px;
  border-bottom: 2px solid var(--gold);
  letter-spacing: -0.005em;
}
.ub-manifest__lead strong { font-weight: 600; }
.ub-manifest__body {
  font-family: var(--serif); font-size: 17px;
  line-height: 1.7; color: var(--ink-dim);
  margin: 0 0 18px;
}
.ub-manifest__body strong { color: var(--ink); font-weight: 600; }
.ub-manifest__badges {
  display: flex; gap: 18px; flex-wrap: wrap;
  margin-top: 32px;
  padding-top: 28px;
  border-top: 1px solid var(--line);
}
.ub-manifest__badges img {
  width: 76px; height: 76px;
  object-fit: contain;
  filter: drop-shadow(0 4px 12px rgba(20,17,11,.08));
  transition: transform .2s ease;
}
.ub-manifest__badges img:hover { transform: scale(1.08); }

.ub-manifest__aside {
  display: flex; flex-direction: column; gap: 28px;
  position: sticky; top: 100px;
}
.ub-manifest__quote {
  background: var(--ink); color: #f5efe0;
  padding: 32px 32px 28px;
  margin: 0;
  position: relative;
  border-left: 4px solid var(--gold);
}
.ub-manifest__quote-mark {
  position: absolute; top: 8px; right: 22px;
  font-family: var(--serif); font-size: 96px;
  color: var(--gold); opacity: .25;
  line-height: 1;
}
.ub-manifest__quote p {
  font-family: var(--serif); font-size: 21px;
  line-height: 1.5; font-style: italic;
  margin: 0 0 24px;
  color: #f5efe0; font-weight: 400;
}
.ub-manifest__quote footer {
  display: flex; gap: 14px; align-items: center;
  padding-top: 18px;
  border-top: 1px solid rgba(212,175,55,.2);
}
.ub-manifest__quote-avatar {
  width: 48px; height: 48px;
  background: linear-gradient(135deg, var(--gold) 0%, #c79f30 100%);
  color: var(--bg-dark);
  display: grid; place-items: center;
  font-family: var(--serif); font-size: 16px; font-weight: 600;
  border-radius: 50%;
  letter-spacing: -0.02em;
  box-shadow: 0 4px 12px rgba(212,175,55,.3);
}
.ub-manifest__quote-name {
  font-family: var(--serif); font-size: 17px;
  color: #f5efe0; font-weight: 500;
}
.ub-manifest__quote-role {
  font-family: var(--mono); font-size: 11px;
  color: rgba(245,239,224,.55);
  letter-spacing: 0.06em; margin-top: 2px;
}

.ub-manifest__promise {
  background: #fff;
  border: 1px solid var(--line);
  padding: 24px 28px;
  display: flex; flex-direction: column; gap: 18px;
}
.ub-manifest__promise-row {
  display: grid; grid-template-columns: auto 1fr;
  gap: 18px; align-items: center;
}
.ub-manifest__promise-num {
  font-family: var(--serif); font-size: 44px;
  color: var(--gold); font-weight: 500;
  line-height: 1; letter-spacing: -0.02em;
  min-width: 70px;
}
.ub-manifest__promise-row strong {
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--gold); font-weight: 700;
  display: block;
}
.ub-manifest__promise-row span {
  display: block;
  font-size: 13px; color: var(--ink-dim);
  line-height: 1.5; margin-top: 4px;
}


/* TIMELINE */
.ub-timeline {
  padding: 120px 0;
  background: #fff;
}
.ub-timeline__head { margin-bottom: 80px; max-width: 720px; }
.ub-timeline__head h2 em { color: var(--gold); font-style: italic; }

.ub-timeline__list {
  list-style: none; padding: 0; margin: 0;
  position: relative;
}
.ub-timeline__list::before {
  content: '';
  position: absolute;
  left: 90px; top: 0; bottom: 0;
  width: 1px;
  background: linear-gradient(180deg, transparent 0%, var(--line-2) 8%, var(--line-2) 92%, transparent 100%);
}
.ub-timeline__item {
  display: grid;
  grid-template-columns: 90px 1fr;
  gap: 48px;
  padding: 40px 0;
  position: relative;
  align-items: start;
}
.ub-timeline__year {
  font-family: var(--serif); font-size: 38px;
  color: var(--ink); font-weight: 500;
  line-height: 1; letter-spacing: -0.02em;
  text-align: right;
  padding-right: 14px;
}
.ub-timeline__item--accent .ub-timeline__year { color: var(--gold); }
.ub-timeline__dot {
  position: absolute;
  left: 86px; top: 48px;
  width: 12px; height: 12px;
  background: #fff;
  border: 2px solid var(--line-2);
  border-radius: 50%;
  z-index: 1;
}
.ub-timeline__dot--accent {
  background: var(--gold);
  border-color: var(--gold);
  box-shadow: 0 0 0 6px rgba(212,175,55,.15);
}
.ub-timeline__body {
  padding-left: 32px;
  max-width: 760px;
}
.ub-timeline__body .kicker {
  color: var(--gold); margin-bottom: 6px;
}
.ub-timeline__body h3 {
  font-family: var(--serif); font-size: 26px;
  color: var(--ink); font-weight: 500;
  margin: 0 0 12px;
  letter-spacing: -0.01em;
}
.ub-timeline__body p {
  font-family: var(--serif); font-size: 16px;
  line-height: 1.65; color: var(--ink-dim);
  margin: 0;
}
.ub-timeline__body p strong { color: var(--ink); font-weight: 600; }


/* TEAM */
.ub-team {
  padding: 120px 0;
  background: var(--bg-2);
}
.ub-team__head { margin-bottom: 64px; max-width: 720px; }
.ub-team__head h2 em { color: var(--gold); font-style: italic; }

.ub-team__grid {
  display: grid;
  grid-template-columns: 1.2fr 1fr 1.2fr;
  gap: 24px;
  margin-bottom: 56px;
}
.ub-team__card {
  background: #fff;
  border: 1px solid var(--line);
  padding: 36px 32px;
  display: flex; flex-direction: column; gap: 16px;
  transition: all .25s ease;
}
.ub-team__card:hover {
  border-color: var(--gold);
  transform: translateY(-3px);
  box-shadow: 0 12px 32px rgba(20,17,11,.06);
}
.ub-team__card--lead {
  background: linear-gradient(135deg, #fffbf0 0%, #fff 100%);
  border-color: var(--gold);
  border-width: 2px;
  box-shadow: 0 8px 32px rgba(212,175,55,.08);
}
.ub-team__card--teams {
  background: var(--ink);
  color: #f5efe0;
  border-color: var(--ink);
}
.ub-team__card--teams .ub-team__name { color: #f5efe0; }
.ub-team__card--teams .ub-team__bio { color: rgba(245,239,224,.75); }
.ub-team__card--teams .ub-team__bio strong { color: var(--gold-light); }

.ub-team__avatar {
  width: 96px; height: 96px;
  background: linear-gradient(135deg, var(--gold) 0%, #c79f30 100%);
  color: var(--bg-dark);
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  border-radius: 50%;
  position: relative;
  margin-bottom: 4px;
  box-shadow: 0 8px 24px rgba(212,175,55,.25);
}
.ub-team__avatar--alt {
  background: linear-gradient(135deg, var(--ink) 0%, #2a241a 100%);
  color: var(--gold-light);
}
.ub-team__avatar-init {
  font-family: var(--serif); font-size: 28px;
  font-weight: 500; line-height: 1;
  letter-spacing: -0.02em;
}
.ub-team__avatar-flag {
  font-size: 12px;
  margin-top: 2px;
  letter-spacing: 1px;
}
.ub-team__role {
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--gold); font-weight: 600;
}
.ub-team__name {
  font-family: var(--serif); font-size: 26px;
  color: var(--ink); font-weight: 500;
  margin: 0; letter-spacing: -0.01em;
  line-height: 1.2;
}
.ub-team__bio {
  font-family: var(--serif); font-size: 15px;
  line-height: 1.65; color: var(--ink-dim);
  margin: 0; flex: 1;
}
.ub-team__bio strong { color: var(--ink); font-weight: 600; }
.ub-team__contact {
  display: flex; flex-direction: column; gap: 6px;
  padding-top: 16px; border-top: 1px solid var(--line);
}
.ub-team__contact a {
  font-family: var(--mono); font-size: 12.5px;
  color: var(--ink); text-decoration: none;
  letter-spacing: 0.04em; font-weight: 500;
  transition: color .15s;
}
.ub-team__contact a:hover { color: var(--gold); }
.ub-team__card--teams .ub-team__contact { border-top-color: rgba(212,175,55,.2); }
.ub-team__card--teams .ub-team__contact a { color: var(--gold-light); }

.ub-team__teams-label {
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--gold-light); font-weight: 700;
  margin-bottom: 4px;
}
.ub-team__teams-stats {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  padding-top: 16px;
  border-top: 1px solid rgba(212,175,55,.2);
}
.ub-team__teams-stats > div {
  display: flex; flex-direction: column; gap: 4px;
}
.ub-team__teams-stats strong {
  font-family: var(--serif); font-size: 22px;
  color: var(--gold-light); font-weight: 500;
  line-height: 1; letter-spacing: -0.01em;
}
.ub-team__teams-stats > div { font-family: var(--mono); font-size: 10px; color: rgba(245,239,224,.55); letter-spacing: 0.08em; text-transform: uppercase; }

.ub-team__strip {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 48px; align-items: center;
  padding: 32px 36px;
  background: #fff;
  border: 1px solid var(--line);
}
.ub-team__strip-title {
  font-family: var(--serif); font-size: 32px;
  font-weight: 500; color: var(--ink);
  margin-top: 4px; letter-spacing: -0.01em;
}
.ub-team__strip p {
  color: var(--ink-dim); font-size: 14px;
  margin: 12px 0 0; max-width: 680px;
}


/* REFS — masonry-like gallery (8 photos, 2 wide/tall accents) */
.ub-refs {
  padding: 120px 0;
  background: #fff;
}
.ub-refs__head { margin-bottom: 64px; max-width: 800px; }
.ub-refs__head h2 em { color: var(--gold); font-style: italic; }

.ub-refs__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-auto-rows: 220px;
  gap: 8px;
  grid-auto-flow: dense;
}
.ub-refs__grid--12 {
  /* 12 photos: keeps 4-col layout, dense flow autoplaces tall/wide spans */
  grid-auto-rows: 200px;
}
.ub-ref {
  position: relative;
  overflow: hidden;
  background: var(--bg-2);
  text-decoration: none;
  color: #f5efe0;
}
.ub-ref img {
  width: 100%; height: 100%; object-fit: cover; display: block;
  transition: transform .55s cubic-bezier(.4,0,.2,1);
}
.ub-ref:hover img { transform: scale(1.06); }
.ub-ref--tall { grid-row: span 2; }
.ub-ref--wide { grid-column: span 2; }
.ub-ref__overlay {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  padding: 18px 20px 16px;
  background: linear-gradient(180deg, transparent 0%, rgba(0,0,0,.78) 100%);
  display: flex; flex-direction: column; gap: 2px;
}
.ub-ref__overlay span {
  font-family: var(--mono); font-size: 10px;
  letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--gold-light);
}
.ub-ref__overlay strong {
  font-family: var(--serif); font-size: 17px;
  color: #f5efe0; font-weight: 500;
  letter-spacing: -0.005em;
}
.ub-refs__cta { text-align: center; margin-top: 48px; }


/* VALUES (4 cards) */
.ub-values {
  padding: 120px 0;
  background: var(--bg-2);
}
.ub-values__head { margin-bottom: 56px; max-width: 800px; }
.ub-values__head h2 em { color: var(--gold); font-style: italic; }

.ub-values__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
}
.ub-values__card {
  background: #fff;
  border: 1px solid var(--line);
  padding: 36px 36px 32px;
  position: relative;
  transition: all .25s ease;
}
.ub-values__card:hover {
  border-color: var(--gold);
  transform: translateY(-3px);
  box-shadow: 0 12px 32px rgba(20,17,11,.06);
}
.ub-values__num {
  font-family: var(--serif); font-size: 64px;
  color: var(--gold); font-weight: 500;
  font-style: italic; line-height: 1;
  letter-spacing: -0.04em;
  margin-bottom: 12px;
}
.ub-values__card h3 {
  font-family: var(--serif); font-size: 26px;
  color: var(--ink); font-weight: 500;
  margin: 0 0 12px; letter-spacing: -0.01em;
}
.ub-values__card p {
  font-family: var(--serif); font-size: 16px;
  line-height: 1.65; color: var(--ink-dim);
  margin: 0;
}
.ub-values__card p strong { color: var(--ink); font-weight: 600; }


/* CERTS */
.ub-certs {
  padding: 120px 0;
  background: #fff;
}
.ub-certs__head { margin-bottom: 56px; max-width: 720px; }
.ub-certs__head h2 em { color: var(--gold); font-style: italic; }

.ub-certs__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}
.ub-certs__card {
  background: var(--bg-2);
  border: 1px solid var(--line);
  padding: 32px 28px;
  display: flex; flex-direction: column; gap: 12px;
  transition: all .25s ease;
}
.ub-certs__card:hover {
  background: #fff;
  border-color: var(--gold);
  transform: translateY(-3px);
}
.ub-certs__icon {
  width: 56px; height: 56px;
  background: var(--ink); color: var(--gold-light);
  display: grid; place-items: center;
  flex-shrink: 0;
}
.ub-certs__label {
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--gold); font-weight: 600;
  margin-top: 4px;
}
.ub-certs__card h3 {
  font-family: var(--serif); font-size: 22px;
  color: var(--ink); font-weight: 500;
  margin: 0; letter-spacing: -0.01em;
  line-height: 1.25;
}
.ub-certs__card p {
  font-size: 13.5px; color: var(--ink-dim);
  line-height: 1.6; margin: 0;
}


/* CONTACT (dark) */
.ub-contact h2 em { color: var(--gold-light); font-style: italic; }
.ub-contact__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 96px; align-items: start;
}
.ub-contact__cards {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 1px;
  background: rgba(212,175,55,.18);
  border: 1px solid rgba(212,175,55,.18);
}
.ub-contact__card {
  background: #0e0b07;
  padding: 28px 26px;
}
.ub-contact__card--gold {
  background: linear-gradient(135deg, #1a1610 0%, var(--bg-dark) 100%);
  border-left: 3px solid var(--gold);
}
.ub-contact__val {
  font-family: var(--serif); font-size: 18px;
  color: var(--bg); line-height: 1.4;
  margin-top: 8px;
}
.ub-contact__val a { color: var(--gold-light); text-decoration: none; }
.ub-contact__val a:hover { color: #f5efe0; }


/* Tablet/mobile responsive */
@media (max-width: 1100px) {
  .ub-hero__inner { grid-template-columns: 1fr; gap: 40px; }
  .ub-hero__trust { grid-template-columns: repeat(2, 1fr); }
  .ub-stats__grid { grid-template-columns: repeat(2, 1fr); }
  .ub-stats__item:last-child { grid-column: 1 / -1; }
  .ub-manifest__grid { grid-template-columns: 1fr; gap: 56px; }
  .ub-manifest__aside { position: static; }
  .ub-team__grid { grid-template-columns: 1fr; }
  .ub-team__strip { grid-template-columns: 1fr; gap: 24px; }
  .ub-refs__grid { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 200px; }
  .ub-values__grid { grid-template-columns: 1fr; }
  .ub-certs__grid { grid-template-columns: repeat(2, 1fr); }
  .ub-contact__grid { grid-template-columns: 1fr; gap: 48px; }
  .ub-contact__cards { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  .ub-hero { padding: 32px 0 56px; }
  .ub-hero__title { font-size: clamp(32px, 7vw, 44px); }
  .ub-hero__lede { font-size: 16px; }
  .ub-hero__photo-strip { grid-template-columns: repeat(3, 1fr); gap: 4px; }
  .ub-stats__grid { grid-template-columns: 1fr; }
  .ub-stats__item:last-child { grid-column: 1; }
  .ub-stats__num { font-size: 42px; }
  .ub-manifest, .ub-timeline, .ub-team, .ub-refs, .ub-values, .ub-certs { padding: 64px 0; }
  .ub-manifest__lead { font-size: 19px; }
  .ub-timeline__item { grid-template-columns: 64px 1fr; gap: 24px; padding: 24px 0; }
  .ub-timeline__year { font-size: 26px; }
  .ub-timeline__list::before { left: 64px; }
  .ub-timeline__dot { left: 60px; top: 32px; }
  .ub-timeline__body { padding-left: 18px; }
  .ub-timeline__body h3 { font-size: 21px; }
  .ub-refs__grid { grid-template-columns: 1fr; grid-auto-rows: 220px; }
  .ub-ref--tall, .ub-ref--wide { grid-row: span 1; grid-column: span 1; }
  .ub-certs__grid { grid-template-columns: 1fr; }
  .ub-team__strip-title { font-size: 22px; }
  .ub-manifest__quote p { font-size: 18px; }
}

/* ============================================================
   .sp-desc-sec — restructured § I "Über dieses Modell"
   2026-05-04 v3 — Adam: „nieczytelne, mnostwo miejsca, nikt tego nie będzie czytał"
   Lead + features pills + body + inspiration + sticky aside (rating + stats + CTA)
   ============================================================ */

.sp-desc__head { max-width: 880px; margin-bottom: 56px; }
.sp-desc__head h2 em { color: var(--gold); font-style: italic; }

.sp-desc__layout {
  display: grid;
  grid-template-columns: 1fr 320px;
  gap: 56px;
  align-items: start;
}

.sp-desc__main {
  display: flex; flex-direction: column; gap: 28px;
}

/* Lead — first paragraph as hero pitch */
.sp-desc__lead {
  font-family: var(--serif);
  font-size: 22px;
  line-height: 1.55;
  color: var(--ink);
  margin: 0;
  font-weight: 400;
  letter-spacing: -0.005em;
  padding: 0 0 24px;
  border-bottom: 2px solid var(--gold);
}
.sp-desc__lead strong { font-weight: 600; }

/* Features pills "Auf einen Blick" */
.sp-desc__features {
  background: linear-gradient(135deg, #fffbf0 0%, #fff 100%);
  border: 1px solid var(--gold);
  padding: 22px 24px;
}
.sp-desc__features-label {
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--gold); font-weight: 700;
  margin-bottom: 14px;
}
.sp-desc__features-grid {
  display: flex; flex-wrap: wrap; gap: 8px;
}
.sp-desc__feat {
  display: inline-flex; align-items: center;
  padding: 7px 14px;
  background: #fff;
  border: 1px solid var(--line-2);
  font-family: var(--mono); font-size: 12px;
  letter-spacing: 0.04em;
  color: var(--ink); font-weight: 500;
  transition: all .15s;
}
.sp-desc__feat:hover {
  background: var(--ink); color: var(--bg);
  border-color: var(--ink);
}

/* Body paragraphs */
.sp-desc__body {
  display: flex; flex-direction: column; gap: 16px;
}
.sp-desc__body p {
  font-family: var(--serif); font-size: 16.5px;
  line-height: 1.7; color: var(--ink-dim);
  margin: 0;
}
.sp-desc__body p strong { color: var(--ink); font-weight: 600; }

/* Inspiration block — separate styling */
.sp-desc__inspo {
  margin-top: 12px;
  padding: 24px 28px;
  background: var(--bg-2);
  border-left: 4px solid var(--gold);
}
.sp-desc__inspo-label {
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--gold); font-weight: 700;
  margin-bottom: 10px;
}
.sp-desc__inspo p {
  font-family: var(--serif); font-size: 16px;
  line-height: 1.65; color: var(--ink);
  margin: 0; font-style: italic;
}

/* Aside — rating + stats + CTA (sticky) */
.sp-desc__aside {
  position: sticky; top: 100px;
  display: flex; flex-direction: column; gap: 20px;
}
.sp-desc__rating {
  padding: 22px 24px;
  background: #fff;
  border: 1px solid var(--line);
  border-left: 4px solid #4285F4;
  text-align: center;
}
.sp-desc__rating-stars {
  color: #f4b400; font-size: 22px; letter-spacing: 3px;
}
.sp-desc__rating-num {
  font-family: var(--serif); font-size: 36px;
  font-weight: 500; color: var(--ink);
  line-height: 1; margin-top: 8px;
  letter-spacing: -0.02em;
}
.sp-desc__rating-num small {
  font-size: 18px; color: var(--ink-mute); font-weight: 400;
}
.sp-desc__rating-meta {
  margin-top: 6px;
  font-family: var(--mono); font-size: 11px;
  color: var(--ink-mute); letter-spacing: 0.05em;
}
.sp-desc__rating-meta strong { color: var(--ink); font-weight: 600; }

.sp-desc__stats {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 1px;
  background: var(--line-2);
  border: 1px solid var(--line-2);
}
.sp-desc__stat {
  background: #fff;
  padding: 18px 16px;
  text-align: center;
  display: flex; flex-direction: column; gap: 4px;
}
.sp-desc__stat strong {
  font-family: var(--serif); font-size: 22px;
  color: var(--gold); font-weight: 500;
  line-height: 1; letter-spacing: -0.01em;
}
.sp-desc__stat span {
  font-family: var(--mono); font-size: 10px;
  color: var(--ink-mute); letter-spacing: 0.12em;
  text-transform: uppercase;
}

.sp-desc__cta {
  display: block; text-align: center;
  padding: 14px 20px;
  background: var(--ink); color: var(--bg);
  font-family: var(--mono); font-size: 12px;
  letter-spacing: 0.16em; text-transform: uppercase;
  font-weight: 600; text-decoration: none;
  transition: background .15s;
}
.sp-desc__cta:hover { background: var(--gold); color: var(--ink); }

/* Tablet/mobile responsive for sp-desc-sec */
@media (max-width: 980px) {
  .sp-desc__layout { grid-template-columns: 1fr; gap: 40px; }
  .sp-desc__aside { position: static; }
  .sp-desc__lead { font-size: 19px; }
}
@media (max-width: 640px) {
  .sp-desc__features { padding: 18px 20px; }
  .sp-desc__body p { font-size: 15.5px; }
  .sp-desc__inspo { padding: 20px 22px; }
  .sp-desc__stats { grid-template-columns: 1fr 1fr; }
  .sp-desc__rating-num { font-size: 30px; }
}

/* ============================================================
   .nl-feat — modern-line "Was ist Neue Linie" (rich SVG-icon cards)
   2026-05-04 — Adam: „suche teksty, sekcje martwe, brzydkie. Ma być ciepłe sprzedażowe."
   ============================================================ */

.nl-feat__head { max-width: 880px; margin: 0 auto 64px; text-align: center; }
.nl-feat__head h2 em { color: var(--gold); font-style: italic; }
.nl-feat__head .lede { margin-left: auto; margin-right: auto; }
.nl-feat__head .lede strong { color: var(--ink); font-weight: 600; }

.nl-feat__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
  max-width: 1180px; margin: 0 auto;
}
.nl-feat__card {
  position: relative;
  padding: 36px 30px 28px;
  background: #fff;
  border: 1px solid var(--line);
  display: flex; flex-direction: column;
  gap: 14px;
  transition: all .3s cubic-bezier(.4,0,.2,1);
  overflow: hidden;
  box-shadow: 0 2px 12px rgba(20,17,11,0.03);
}
.nl-feat__card::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--gold) 0%, var(--gold-light) 100%);
  transform: scaleX(0); transform-origin: left;
  transition: transform .35s cubic-bezier(.4,0,.2,1);
}
.nl-feat__card:hover {
  transform: translateY(-6px);
  border-color: var(--gold);
  box-shadow: 0 16px 40px rgba(212,175,55,0.12);
}
.nl-feat__card:hover::before { transform: scaleX(1); }
.nl-feat__card--gold {
  background: linear-gradient(135deg, #fffbf0 0%, #fff 60%);
  border-color: var(--gold);
}
.nl-feat__card--gold::before { transform: scaleX(1); }

.nl-feat__icon {
  width: 64px; height: 64px;
  display: grid; place-items: center;
  background: linear-gradient(135deg, var(--gold) 0%, #c79f30 100%);
  color: var(--bg-dark);
  border-radius: 50%;
  flex-shrink: 0;
  box-shadow: 0 4px 16px rgba(212,175,55,0.3);
}
.nl-feat__num {
  position: absolute; top: 24px; right: 26px;
  font-family: var(--serif); font-size: 32px;
  color: var(--ink-mute); opacity: .25;
  line-height: 1; font-weight: 400;
  letter-spacing: -0.02em;
}
.nl-feat__title {
  font-family: var(--serif); font-size: 22px;
  font-weight: 500; color: var(--ink);
  margin: 4px 0 0; line-height: 1.25;
  letter-spacing: -0.01em;
}
.nl-feat__body {
  font-size: 14.5px; line-height: 1.65;
  color: var(--ink-dim); margin: 0; flex: 1;
}
.nl-feat__body strong { color: var(--ink); font-weight: 600; }
.nl-feat__tag {
  display: inline-flex; align-items: center;
  margin-top: auto;
  padding: 7px 14px;
  background: var(--bg-2);
  border-left: 3px solid var(--gold);
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--ink); font-weight: 600;
  align-self: flex-start;
}

.nl-feat__strip {
  margin-top: 56px;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr auto;
  gap: 32px;
  align-items: center;
  padding: 28px 36px;
  background: var(--ink); color: #f5efe0;
}
.nl-feat__strip-stat {
  display: flex; flex-direction: column; gap: 4px;
}
.nl-feat__strip-stat strong {
  font-family: var(--serif); font-size: 32px;
  color: var(--gold-light); line-height: 1;
  letter-spacing: -0.02em;
}
.nl-feat__strip-stat span {
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.18em; text-transform: uppercase;
  color: rgba(245,239,224,0.65);
}
.nl-feat__strip-cta {
  padding: 14px 24px;
  background: var(--gold); color: var(--bg-dark);
  font-family: var(--mono); font-size: 12px;
  letter-spacing: 0.18em; text-transform: uppercase;
  font-weight: 700; text-decoration: none;
  transition: background .2s;
}
.nl-feat__strip-cta:hover { background: var(--gold-light); }

/* ============================================================
   .nl-vs — Standard vs Neue Linie split-card comparison
   ============================================================ */

.nl-vs__head { max-width: 800px; margin: 0 auto 56px; text-align: center; }
.nl-vs__head h2 em { color: var(--gold); font-style: italic; }
.nl-vs__head .lede { margin-left: auto; margin-right: auto; }

.nl-vs__grid {
  display: grid;
  grid-template-columns: 1fr 80px 1fr;
  gap: 0;
  align-items: stretch;
  max-width: 1100px; margin: 0 auto;
}

.nl-vs__col {
  background: #fff;
  border: 1px solid var(--line);
  padding: 36px 32px;
  display: flex; flex-direction: column;
  position: relative;
  transition: transform .25s ease, box-shadow .25s ease;
}
.nl-vs__col:hover { transform: translateY(-4px); box-shadow: 0 12px 32px rgba(20,17,11,0.06); }
.nl-vs__col--standard {}
.nl-vs__col--neue {
  background: linear-gradient(135deg, #1a1610 0%, var(--bg-dark) 100%);
  color: #f5efe0;
  border-color: var(--gold);
  border-width: 2px;
  box-shadow: 0 12px 40px rgba(212,175,55,0.15);
}
.nl-vs__col--neue:hover { box-shadow: 0 16px 48px rgba(212,175,55,0.22); }
.nl-vs__col-badge {
  position: absolute; top: -14px; left: 32px;
  padding: 6px 14px;
  background: var(--gold); color: var(--bg-dark);
  font-family: var(--mono); font-size: 10.5px;
  letter-spacing: 0.18em; text-transform: uppercase;
  font-weight: 700;
}
.nl-vs__col-head {
  padding-bottom: 24px;
  border-bottom: 1px solid var(--line);
  margin-bottom: 20px;
}
.nl-vs__col--neue .nl-vs__col-head { border-bottom-color: rgba(212,175,55,0.25); }
.nl-vs__col-eyebrow {
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--ink-mute); font-weight: 500;
}
.nl-vs__col--neue .nl-vs__col-eyebrow { color: var(--gold-light); }
.nl-vs__col-title {
  font-family: var(--serif); font-size: 28px;
  font-weight: 500; color: var(--ink);
  margin: 6px 0 12px;
  letter-spacing: -0.01em;
}
.nl-vs__col--neue .nl-vs__col-title { color: #f5efe0; }
.nl-vs__col-price {
  font-family: var(--serif); font-size: 14px;
  color: var(--ink-dim);
  display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap;
}
.nl-vs__col--neue .nl-vs__col-price { color: rgba(245,239,224,0.7); }
.nl-vs__col-price strong {
  font-size: 36px; color: var(--ink); font-weight: 500;
  letter-spacing: -0.02em; line-height: 1;
}
.nl-vs__col--neue .nl-vs__col-price strong { color: var(--gold-light); }
.nl-vs__col-price small {
  display: block; width: 100%;
  font-size: 11px; color: var(--ink-mute);
  margin-top: 6px; font-family: var(--mono); letter-spacing: 0.05em;
}
.nl-vs__col--neue .nl-vs__col-price small { color: rgba(245,239,224,0.5); }

.nl-vs__list {
  list-style: none; padding: 0; margin: 0 0 24px;
  flex: 1;
}
.nl-vs__list li {
  display: flex; justify-content: space-between; align-items: baseline;
  gap: 12px;
  padding: 12px 0;
  border-bottom: 1px solid var(--line);
  font-size: 14px;
}
.nl-vs__col--neue .nl-vs__list li { border-bottom-color: rgba(212,175,55,0.15); }
.nl-vs__list li:last-child { border-bottom: 0; }
.nl-vs__k {
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--ink-mute); flex-shrink: 0;
}
.nl-vs__col--neue .nl-vs__k { color: rgba(245,239,224,0.55); }
.nl-vs__v {
  font-family: var(--serif); font-size: 14.5px;
  color: var(--ink); text-align: right;
  line-height: 1.4;
}
.nl-vs__col--neue .nl-vs__v { color: #f5efe0; }
.nl-vs__list li.is-better .nl-vs__v {
  color: var(--gold);
  position: relative;
  padding-right: 22px;
}
.nl-vs__list li.is-better .nl-vs__v::after {
  content: '✓';
  position: absolute; right: 0; top: 50%;
  transform: translateY(-50%);
  font-size: 16px; color: var(--gold); font-weight: 700;
}
.nl-vs__col--neue .nl-vs__list li.is-better .nl-vs__v { color: var(--gold-light); }
.nl-vs__col--neue .nl-vs__list li.is-better .nl-vs__v::after { color: var(--gold-light); }
.nl-vs__col--neue .nl-vs__list li.is-equal .nl-vs__v { color: rgba(245,239,224,0.85); }
.nl-vs__list li.is-better strong,
.nl-vs__col--neue .nl-vs__list li.is-better strong { color: inherit; font-weight: 600; }

.nl-vs__cta {
  display: block; text-align: center;
  padding: 14px 20px;
  background: var(--bg-2); color: var(--ink);
  font-family: var(--mono); font-size: 11.5px;
  letter-spacing: 0.16em; text-transform: uppercase;
  font-weight: 600; text-decoration: none;
  transition: all .2s;
}
.nl-vs__cta:hover { background: var(--ink); color: var(--bg); }
.nl-vs__cta--gold {
  background: var(--gold); color: var(--bg-dark);
}
.nl-vs__cta--gold:hover { background: var(--gold-light); color: var(--bg-dark); }

.nl-vs__divider {
  display: flex; flex-direction: column; align-items: center;
  justify-content: center; gap: 14px;
  padding: 0 8px;
}
.nl-vs__divider-line {
  width: 1px; flex: 1;
  background: linear-gradient(180deg, transparent 0%, var(--line-2) 50%, transparent 100%);
}
.nl-vs__divider-badge {
  width: 50px; height: 50px;
  background: var(--gold); color: var(--bg-dark);
  display: grid; place-items: center;
  font-family: var(--serif); font-size: 16px;
  font-weight: 700; letter-spacing: 0.05em;
  border-radius: 50%;
  box-shadow: 0 4px 16px rgba(212,175,55,0.3);
}

.nl-vs__footnote {
  margin-top: 32px;
  padding: 16px 20px;
  background: var(--bg-2);
  border-left: 3px solid var(--gold);
  display: flex; gap: 10px; align-items: flex-start;
  font-size: 13px; color: var(--ink-dim);
  line-height: 1.55; max-width: 1100px; margin-left: auto; margin-right: auto;
}
.nl-vs__footnote svg {
  color: var(--gold); flex-shrink: 0; margin-top: 2px;
}
.nl-vs__footnote strong { color: var(--ink); font-weight: 600; }

/* ============================================================
   .mt-hero--v2 — refreshed metall hero (warmer, sales-driven)
   ============================================================ */

.mt-hero--v2 {
  position: relative;
  min-height: 640px;
  padding: 80px 0 64px;
  background: var(--bg-dark);
  color: #f5efe0;
  overflow: hidden;
}
.mt-hero--v2 .mt-hero__bg {
  position: absolute; inset: 0;
  background-image: url('../img/metal/dsm-1.jpg'),
                    url('../img/hero-main.jpg');
  background-size: cover; background-position: center;
  opacity: .35;
  filter: blur(1px);
  z-index: 0;
}
.mt-hero--v2 .mt-hero__overlay {
  position: absolute; inset: 0;
  background: linear-gradient(135deg, rgba(14,11,7,.92) 0%, rgba(28,24,18,.78) 50%, rgba(14,11,7,.85) 100%);
  z-index: 1;
}
.mt-hero--v2 .mt-hero__inner {
  position: relative; z-index: 2;
  display: grid;
  grid-template-columns: 1.3fr 1fr;
  gap: 64px;
  align-items: center;
}
.mt-hero--v2 .mt-hero__copy { max-width: 100%; }
.mt-hero--v2 .mt-hero__eyebrow {
  display: inline-block;
  padding: 6px 14px;
  background: rgba(212,175,55,0.15);
  color: var(--gold-light);
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.22em; text-transform: uppercase;
  border-left: 3px solid var(--gold);
  margin-bottom: 24px;
}
.mt-hero--v2 .mt-hero__title {
  font-size: clamp(42px, 5.5vw, 72px);
  color: #f5efe0;
  letter-spacing: -0.02em;
  line-height: 1.05;
  margin: 0 0 28px;
}
.mt-hero--v2 .mt-hero__title em {
  color: var(--gold-light);
  font-style: italic;
  font-weight: 400;
}
.mt-hero--v2 .mt-hero__lede {
  font-family: var(--serif); font-size: 18px;
  line-height: 1.65; color: #c4bba7;
  margin: 0 0 36px; max-width: 580px;
}
.mt-hero--v2 .mt-hero__lede strong { color: #f5efe0; font-weight: 500; }
.mt-hero--v2 .mt-hero__cta {
  display: flex; gap: 14px; flex-wrap: wrap;
  margin-bottom: 48px;
}
.btn--ghost-light {
  background: transparent !important;
  color: #f5efe0 !important;
  border: 1px solid rgba(245,239,224,0.35) !important;
}
.btn--ghost-light:hover {
  background: #f5efe0 !important;
  color: var(--bg-dark) !important;
  border-color: #f5efe0 !important;
}

.mt-hero--v2 .mt-hero__price-strip {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  background: rgba(212,175,55,0.2);
  border: 1px solid rgba(212,175,55,0.2);
}
.mt-hero--v2 .mt-hero__price-strip > div {
  background: rgba(0,0,0,0.4);
  padding: 18px 20px;
  display: flex; flex-direction: column; gap: 4px;
}
.mt-hero__price-num {
  font-family: var(--serif); font-size: 32px;
  color: var(--gold-light); font-weight: 500;
  line-height: 1; letter-spacing: -0.02em;
  display: inline; margin-right: 4px;
}
.mt-hero__price-unit {
  font-family: var(--serif); font-size: 18px;
  color: var(--gold); display: inline;
}
.mt-hero__price-meta {
  font-family: var(--mono); font-size: 10.5px;
  color: rgba(245,239,224,0.55);
  letter-spacing: 0.1em; text-transform: uppercase;
  margin-top: 6px; line-height: 1.4;
}

.mt-hero--v2 .mt-hero__facts-grid {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 16px;
}
.mt-fact {
  display: flex; gap: 14px; align-items: flex-start;
  padding: 22px 20px;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(212,175,55,0.18);
  transition: all .2s ease;
}
.mt-fact:hover {
  background: rgba(212,175,55,0.08);
  border-color: var(--gold);
  transform: translateY(-2px);
}
.mt-fact svg {
  color: var(--gold-light);
  flex-shrink: 0;
}
.mt-fact strong {
  font-family: var(--serif); font-size: 22px;
  color: #f5efe0; font-weight: 500;
  display: block; line-height: 1.1;
  letter-spacing: -0.01em;
}
.mt-fact small {
  font-family: var(--mono); font-size: 10.5px;
  color: rgba(245,239,224,0.55);
  letter-spacing: 0.1em; text-transform: uppercase;
  display: block; margin-top: 4px;
}

/* Tablet/mobile responsive */
@media (max-width: 1100px) {
  .nl-feat__grid { grid-template-columns: repeat(2, 1fr); max-width: 720px; }
  .nl-vs__grid { grid-template-columns: 1fr; gap: 24px; }
  .nl-vs__divider { flex-direction: row; padding: 8px 0; }
  .nl-vs__divider-line { width: 100%; height: 1px; background: linear-gradient(90deg, transparent 0%, var(--line-2) 50%, transparent 100%); }
  .mt-hero--v2 .mt-hero__inner { grid-template-columns: 1fr; gap: 40px; }
}
@media (max-width: 720px) {
  .nl-feat__grid { grid-template-columns: 1fr; max-width: 480px; }
  .nl-feat__strip { grid-template-columns: 1fr 1fr; gap: 20px; padding: 24px 20px; }
  .nl-feat__strip-cta { grid-column: 1 / -1; text-align: center; }
  .nl-vs__col { padding: 28px 22px; }
  .nl-vs__col-title { font-size: 22px; }
  .nl-vs__col-price strong { font-size: 28px; }
  .mt-hero--v2 .mt-hero__price-strip { grid-template-columns: 1fr; gap: 1px; }
  .mt-hero--v2 .mt-hero__facts-grid { grid-template-columns: 1fr; }
  .mt-hero__price-num { font-size: 26px; }
}

/* Tablet/mobile responsive */
@media (max-width: 980px) {
  .sp-why__grid { grid-template-columns: 1fr; gap: 16px; max-width: 540px; }
  .sp-why__pt { flex-direction: row; align-items: flex-start; gap: 18px; padding: 24px; }
  .sp-why__num { font-size: 36px; flex-shrink: 0; }
  .sp-reviews__head { grid-template-columns: 1fr; gap: 32px; }
  .sp-related__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
  .sp-len-input { width: 90px; font-size: 19px; }
  .sp-len-quick__btn { font-size: 11px; padding: 8px 4px; min-width: 32px; }
  .sp-calc-result { padding: 20px 22px; }
  .sp-calc-result__total { font-size: 44px; }
  .sp-calc-result__cur { font-size: 30px; }
  .sp-why { padding: 56px 0 !important; }
  .sp-related__grid { grid-template-columns: 1fr; }
  .sp-reviews__badge { padding: 22px; }
  .sp-reviews__rating { font-size: 32px; }
  .sp-review__body { font-size: 15.5px; }
  .sp-review__name { font-size: 16px; }
}


/* =============================================================
   v15.11 TECH-VIZ · single-product Spezifikation infografiki
   Adam: „czy mógłbyś przygotować infografiki, żeby to wizualnie ładnie przedstawić"
   ============================================================= */
.sp-techviz {
  background: #fff;
  padding: 96px 0;
  border-top: 1px solid var(--line);
}
.sp-techviz h2 em { color: var(--gold); font-style: italic; }
.sp-techviz .lede { color: #4a4335; font-size: 17px; line-height: 1.65; }

.sp-techviz__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  margin-top: 56px;
}
.sp-techviz__card {
  background: linear-gradient(180deg, #fdfaf3 0%, #fff 100%);
  border: 1px solid var(--line);
  border-left: 4px solid var(--gold);
  padding: 28px 32px 32px;
  display: flex; flex-direction: column;
  margin: 0;
  box-shadow: 0 8px 24px rgba(20,17,11,.04);
  transition: transform .25s ease, box-shadow .25s ease;
}
.sp-techviz__card:hover {
  transform: translateY(-3px);
  box-shadow: 0 16px 40px rgba(20,17,11,.08);
}
.sp-techviz__head {
  display: flex; align-items: center; gap: 16px;
  margin-bottom: 24px;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--line);
}
.sp-techviz__num {
  font-family: var(--serif);
  font-size: 44px; color: var(--gold);
  font-weight: 500; line-height: 1;
  letter-spacing: -0.02em;
  width: 48px; text-align: center;
}
.sp-techviz__label {
  font-family: var(--mono); font-size: 11.5px;
  letter-spacing: 0.18em; text-transform: uppercase;
  color: #5a5142; font-weight: 700;
}
.sp-techviz__title {
  font-family: var(--serif); font-size: 22px;
  color: var(--ink); font-weight: 500;
  margin: 4px 0 0; line-height: 1.2;
  letter-spacing: -0.01em;
}
.sp-techviz__body {
  display: flex; flex-direction: column; gap: 20px;
  flex: 1;
}
.sp-techviz__svg {
  width: 100%;
  height: auto;
  display: block;
  background: #fff;
  border: 1px solid var(--line);
  padding: 8px;
  border-radius: 4px;
}
.sp-techviz__legend {
  list-style: none; padding: 0; margin: 0;
  display: flex; flex-direction: column; gap: 8px;
}
.sp-techviz__legend li {
  display: flex; align-items: center; gap: 10px;
  font-family: var(--serif); font-size: 14px;
  line-height: 1.5; color: #4a4335;
}
.sp-techviz__legend li strong {
  color: var(--ink); font-weight: 600;
  font-family: var(--serif);
}
.sp-techviz__sw {
  display: inline-block;
  width: 18px; height: 12px;
  border: 1px solid var(--ink);
  flex-shrink: 0;
}
.sp-techviz__sw--dash {
  background: repeating-linear-gradient(90deg, #9d6e1f 0 4px, transparent 4px 7px);
  border-color: transparent;
  height: 4px; margin: 4px 0;
}

@media (max-width: 980px) {
  .sp-techviz__grid { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  .sp-techviz { padding: 56px 0; }
  .sp-techviz__card { padding: 22px 22px 24px; }
  .sp-techviz__num { font-size: 36px; width: 40px; }
  .sp-techviz__title { font-size: 18px; }
}


/* =============================================================
   v15.19 KONFIGURATOR krok 6 — INLINE SUBMIT BUTTONS przy formularzu
   Adam: „przyciski są na dole strony, można nie znaleźć — powinny być przy formularzu"
   ============================================================= */
.k3-form-actions {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 14px;
  margin-top: 32px;
  padding: 24px;
  background: linear-gradient(135deg, #fef0c4 0%, #fffbf0 100%);
  border: 2px solid var(--gold);
  border-radius: 4px;
  box-shadow: 0 12px 32px rgba(212,175,55,.2), 0 2px 8px rgba(20,17,11,.06);
}
.k3-form-actions__back {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 14px 20px;
  background: #fff; border: 1px solid var(--line);
  font-family: var(--mono); font-size: 12px;
  letter-spacing: 0.16em; text-transform: uppercase; font-weight: 700;
  color: var(--ink);
  cursor: pointer;
  transition: all .2s ease;
}
.k3-form-actions__back:hover {
  background: var(--ink); color: #fff; border-color: var(--ink);
}
.k3-form-actions__submit {
  display: flex; align-items: center; gap: 16px;
  padding: 14px 20px;
  background: linear-gradient(135deg, var(--ink) 0%, #1a160e 100%);
  color: #f5efe0;
  border: 0;
  cursor: pointer;
  text-align: left;
  transition: transform .25s ease, box-shadow .25s ease, background .25s ease;
  box-shadow: 0 4px 14px rgba(20,17,11,.25), inset 0 0 0 1px rgba(212,175,55,.4);
  position: relative;
  overflow: hidden;
}
.k3-form-actions__submit::before {
  content: '';
  position: absolute; top: 0; right: 0;
  width: 100px; height: 100%;
  background: radial-gradient(circle at top right, rgba(212,175,55,.18) 0%, transparent 70%);
  pointer-events: none;
}
.k3-form-actions__submit:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgba(20,17,11,.35), inset 0 0 0 2px var(--gold);
  background: linear-gradient(135deg, #1a160e 0%, var(--ink) 100%);
}
.k3-form-actions__submit-icon {
  width: 44px; height: 44px;
  display: grid; place-items: center;
  background: var(--gold);
  color: var(--ink);
  border-radius: 50%;
  flex-shrink: 0;
  box-shadow: 0 3px 10px rgba(212,175,55,.4);
}
.k3-form-actions__submit-body {
  display: flex; flex-direction: column; gap: 3px;
  flex: 1; min-width: 0;
}
.k3-form-actions__submit-body strong {
  font-family: var(--serif); font-size: 18px;
  color: #fff; font-weight: 600;
  letter-spacing: -0.005em;
  line-height: 1.2;
}
.k3-form-actions__submit-body span {
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--gold-light); font-weight: 600;
  line-height: 1.4;
}
.k3-form-actions__submit-arrow {
  font-family: var(--serif); font-size: 32px;
  color: var(--gold-light); font-weight: 300;
  line-height: 1; flex-shrink: 0;
  transition: transform .2s ease;
}
.k3-form-actions__submit:hover .k3-form-actions__submit-arrow {
  transform: translateX(4px);
}
.k3-form-actions__hint {
  margin: 12px 0 0;
  font-family: var(--mono); font-size: 10.5px;
  letter-spacing: 0.12em; text-transform: uppercase;
  color: #6b5a3a; font-weight: 600;
  text-align: center;
  line-height: 1.5;
}
@media (max-width: 720px) {
  .k3-form-actions {
    grid-template-columns: 1fr;
    padding: 18px;
  }
  .k3-form-actions__back { justify-content: center; order: 2; }
  .k3-form-actions__submit { order: 1; padding: 14px 16px; gap: 12px; }
  .k3-form-actions__submit-icon { width: 40px; height: 40px; }
  .k3-form-actions__submit-body strong { font-size: 16px; }
  .k3-form-actions__submit-body span { font-size: 10px; letter-spacing: 0.1em; }
  .k3-form-actions__submit-arrow { font-size: 26px; }
}


/* =============================================================
   v15.18 SINGLE-PRODUCT Vorkalkulation override — light premium (zamiast deep-ink)
   Adam: „cena tło itd trochę odstrasza, takie ciemne"
   ============================================================= */
.sp-calc-result {
  background: linear-gradient(135deg, #fef0c4 0%, #fef8e3 50%, #fffbf0 100%) !important;
  color: var(--ink) !important;
  border-left: 5px solid var(--gold) !important;
  border: 1px solid rgba(212,175,55,.4);
  border-left-width: 5px;
  box-shadow: 0 12px 32px rgba(212,175,55,.18), 0 2px 8px rgba(20,17,11,.06);
  padding: 26px 30px !important;
}
.sp-calc-result__label { color: #6b5a3a !important; }
.sp-calc-result__sub   { color: #5a5142 !important; }
.sp-calc-result__total { color: var(--gold) !important; text-shadow: 0 2px 8px rgba(212,175,55,.2) !important; font-size: 60px !important; }
.sp-calc-result__cur   { color: var(--gold) !important; }
.sp-calc-result__foot  { color: #4a4335 !important; border-top-color: rgba(212,175,55,.3) !important; font-size: 12.5px !important; }
.sp-calc-result__foot strong { color: var(--ink) !important; }

/* "ODER" separator między Vorkalkulation a CTA Konfigurator */
.sp-or-divider {
  display: flex; align-items: center; gap: 12px;
  margin: 22px 0 4px;
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.2em; text-transform: uppercase;
  color: #6b5a3a; font-weight: 700;
}
.sp-or-divider::before,
.sp-or-divider::after {
  content: ''; flex: 1; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(212,175,55,.4), transparent);
}
.sp-or-divider span {
  padding: 6px 14px;
  background: var(--bg-2);
  border: 1px solid rgba(212,175,55,.35);
  border-radius: 100px;
}


/* =============================================================
   v15.18 SINGLE-PRODUCT konfig-CTA — JASNA wersja (kontrast vs Vorkalkulation)
   Adam: „dwa ciemne bloki zlewają się... CTA przysłania, nie czuję zachęty wejść w konfigurator"
   Strategia: Vorkalkulation zostaje ciemna (hero element ceny),
              CTA Konfigurator → JASNA cream/gold żeby wizualnie KONTRASTOWAŁA + przyciągała.
   ============================================================= */
.sp-konfig-cta {
  display: flex;
  align-items: center;
  gap: 18px;
  margin-top: 18px;
  padding: 22px 24px;
  background: linear-gradient(135deg, #fef8e3 0%, #fffbf0 60%, #fff 100%);
  color: var(--ink);
  text-decoration: none;
  border: 2px solid var(--gold);
  border-radius: 4px;
  box-shadow: 0 8px 28px rgba(212,175,55,.2), 0 2px 8px rgba(20,17,11,.06);
  transition: transform .25s ease, box-shadow .25s ease, background .25s ease;
  position: relative;
  overflow: hidden;
}
/* Sub-label „MEHR OPTIONEN" jako ribbon w prawym górnym rogu */
.sp-konfig-cta::before {
  content: 'OPTION 2';
  position: absolute; top: 0; right: 0;
  padding: 4px 10px;
  background: var(--gold); color: var(--ink);
  font-family: var(--mono); font-size: 9.5px;
  letter-spacing: 0.18em; font-weight: 700;
  border-bottom-left-radius: 4px;
  pointer-events: none;
}
.sp-konfig-cta:hover {
  transform: translateY(-3px);
  box-shadow: 0 16px 40px rgba(212,175,55,.32), 0 4px 12px rgba(20,17,11,.1);
  background: linear-gradient(135deg, #fef0c4 0%, #fef8e3 60%, #fffbf0 100%);
}
.sp-konfig-cta__icon {
  width: 56px; height: 56px;
  display: grid; place-items: center;
  background: linear-gradient(135deg, var(--ink) 0%, #1a160e 100%);
  color: var(--gold-light);
  border-radius: 50%;
  flex-shrink: 0;
  box-shadow: 0 4px 14px rgba(20,17,11,.25), inset 0 0 0 2px rgba(212,175,55,.4);
}
.sp-konfig-cta__icon svg { width: 24px; height: 24px; }
.sp-konfig-cta__body {
  flex: 1;
  display: flex; flex-direction: column; gap: 6px;
  min-width: 0;
}
.sp-konfig-cta__title {
  font-family: var(--serif); font-size: 19px;
  font-weight: 600; color: var(--ink);
  letter-spacing: -0.005em; line-height: 1.25;
}
.sp-konfig-cta__sub {
  font-family: var(--mono); font-size: 11.5px;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: #6b5a3a; font-weight: 700;
  line-height: 1.5;
}
.sp-konfig-cta__arrow {
  width: 44px; height: 44px;
  display: grid; place-items: center;
  background: var(--gold);
  color: var(--ink);
  border-radius: 50%;
  flex-shrink: 0;
  transition: transform .2s ease, background .2s ease, box-shadow .2s ease;
  box-shadow: 0 4px 12px rgba(212,175,55,.35);
}
.sp-konfig-cta__arrow svg { width: 20px; height: 20px; }
.sp-konfig-cta:hover .sp-konfig-cta__arrow {
  background: var(--ink);
  color: var(--gold-light);
  transform: translateX(4px) scale(1.05);
  box-shadow: 0 6px 16px rgba(20,17,11,.3);
}
@media (max-width: 720px) {
  .sp-konfig-cta { padding: 18px 18px; gap: 14px; }
  .sp-konfig-cta__icon { width: 48px; height: 48px; }
  .sp-konfig-cta__title { font-size: 17px; }
  .sp-konfig-cta__sub { font-size: 10.5px; letter-spacing: 0.12em; }
  .sp-konfig-cta__arrow { width: 40px; height: 40px; }
  .sp-konfig-cta::before { font-size: 9px; padding: 3px 8px; }
}


/* =============================================================
   v15.16 STRIP statystyk + nl-rueck bullets — bump wizualny
   Adam: „ulepsz to" (sekcja Was der Nachbar + strip nad nią)
   ============================================================= */
.nl-atmo__strip-inner { gap: 20px; align-items: stretch; }
.nl-atmo__strip-num { font-size: 44px !important; }
.nl-atmo__strip-num span { font-size: 22px !important; }
.nl-atmo__strip-lbl { font-size: 11.5px !important; letter-spacing: 0.16em !important; line-height: 1.5 !important; color: #d8d0bb !important; }
.nl-atmo__strip-stat { padding: 10px 24px 10px 0; border-right: 1px solid rgba(212,175,55,.2); }
.nl-atmo__strip-stat:last-of-type { border-right: 0; }
.nl-atmo__strip-cta { padding: 16px 26px !important; font-size: 12px !important; letter-spacing: 0.16em !important; }

/* nl-rueck bullets — większe + ikony check */
.nl-rueck__bullets li {
  font-size: 16px !important;
  line-height: 1.6 !important;
  color: #4a4335 !important;
  padding: 18px 0 18px 36px !important;
  position: relative;
}
.nl-rueck__bullets li::before {
  content: '✓';
  position: absolute;
  left: 0; top: 18px;
  width: 24px; height: 24px;
  display: grid; place-items: center;
  background: var(--gold); color: var(--ink);
  border-radius: 50%;
  font-size: 13px; font-weight: 700;
  box-shadow: 0 2px 6px rgba(212,175,55,.3);
}
.nl-rueck__bullets li strong {
  font-size: 18px !important;
  color: var(--ink) !important;
  font-weight: 600 !important;
  margin-bottom: 6px !important;
}
.nl-rueck__note {
  font-size: 14.5px !important;
  line-height: 1.6 !important;
  color: #4a4335 !important;
  padding: 20px 24px !important;
}
.nl-rueck__note a { font-weight: 600; }


/* =============================================================
   v15.14 KONFIGURATOR deep-link banner — Adam: „jak idę z karty produktu na konfigurator, ma być od razu wybrany"
   ============================================================= */
.k3-preselect {
  background: linear-gradient(135deg, #fffbf0 0%, #fff 100%);
  border-top: 3px solid var(--gold);
  border-bottom: 1px solid var(--line);
  padding: 18px 0;
}
.k3-preselect__inner {
  display: flex; align-items: center; gap: 18px;
  flex-wrap: wrap;
}
.k3-preselect__icon {
  width: 44px; height: 44px;
  display: grid; place-items: center;
  background: #2faa53;
  color: #fff;
  border-radius: 50%;
  flex-shrink: 0;
  box-shadow: 0 4px 12px rgba(47,170,83,.3);
}
.k3-preselect__body {
  display: flex; flex-direction: column; gap: 3px;
  flex: 1; min-width: 220px;
}
.k3-preselect__label {
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.18em; text-transform: uppercase;
  color: #2a6b3a; font-weight: 700;
}
.k3-preselect__name {
  font-family: var(--serif); font-size: 19px;
  color: var(--ink); font-weight: 600;
  letter-spacing: -0.01em; line-height: 1.25;
}
.k3-preselect__sub {
  font-family: var(--serif); font-size: 13.5px;
  color: #5a5142; line-height: 1.45;
}
.k3-preselect__reset {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 9px 14px;
  background: #fff; border: 1px solid var(--line);
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.14em; text-transform: uppercase; font-weight: 700;
  color: var(--ink-mute);
  text-decoration: none;
  transition: all .2s ease;
  flex-shrink: 0;
}
.k3-preselect__reset:hover {
  background: var(--ink); color: #fff; border-color: var(--ink);
}
@media (max-width: 720px) {
  .k3-preselect__name { font-size: 17px; }
  .k3-preselect__reset { width: 100%; justify-content: center; }
}


/* =============================================================
   v15.13 KONTAKT fixes — Adam: „dziwne krzyzyki, FAQ pkt2 wygląda otwarty, activity oddalone, stopka nieczytelna"
   ============================================================= */

/* 1. FAQ — naprawione „rozciąganie" prawej kolumny gdy lewa otwarta */
.kt-faq__grid {
  align-items: start !important;  /* karty NIE wyrównują wysokości — każda zachowuje natural height */
}

/* 2. FAQ plus button — prosty, czytelny krzyż (bez gradientów, bez okręgu) */
.kt-faq__plus {
  width: auto !important;
  height: auto !important;
  background: transparent !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  font-family: var(--serif) !important;
  font-size: 32px !important;
  font-weight: 300 !important;
  color: var(--gold) !important;
  line-height: 1 !important;
  display: inline-block !important;
  padding: 0 !important;
  flex-shrink: 0;
  transition: transform .25s ease, color .25s ease;
}
.kt-faq__item[open] .kt-faq__plus {
  background: transparent !important;
  color: var(--ink) !important;
  transform: rotate(45deg);
}

/* 3. Activity bar — zlikwidowane „oddalenie", wszystko obok siebie z gap */
.kt-activity__inner {
  display: flex !important;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start !important;
  gap: 24px !important;
}
.kt-activity__text { flex: 1 1 auto; min-width: 0; }
.kt-activity__avg {
  margin-left: auto;
  padding-left: 28px;
  border-left: 1px solid var(--line);
  flex-direction: row !important;
  align-items: center !important;
  gap: 14px;
}
.kt-activity__avg-label {
  text-align: right;
  max-width: 110px;
  line-height: 1.35 !important;
}
.kt-activity__avg-val {
  font-size: 30px !important;
  white-space: nowrap;
}
@media (max-width: 720px) {
  .kt-activity__avg { margin-left: 0; padding-left: 0; border-left: 0; padding-top: 14px; border-top: 1px solid var(--line); flex-direction: row !important; }
}

/* 4. STOPKA (.seo-footer) — czytelność: większe fonty + lepszy kontrast */
.seo-footer { padding: 80px 0 32px !important; }
.seo-footer h4 {
  font-size: 12px !important;       /* z 10.5 → 12px */
  letter-spacing: 0.22em !important;
  margin-bottom: 22px !important;
  color: var(--gold-light) !important;
}
.seo-footer li { font-size: 15px !important; margin-bottom: 12px !important; line-height: 1.4; }
.seo-footer a { color: #d8d0bb !important; }   /* z #c4bba7 → #d8d0bb (lepszy kontrast 7.5:1 vs 6:1) */
.seo-footer a:hover { color: var(--gold-light) !important; text-decoration: underline; }
.seo-footer__brand p { font-size: 15px !important; line-height: 1.7 !important; color: #c4bba7; max-width: 360px; }
.seo-footer__brand-meta {
  font-size: 11px !important;       /* z 10 → 11px */
  letter-spacing: 0.16em !important;
  gap: 18px !important;
  color: #9c9280 !important;
  margin-top: 24px !important;
  padding-top: 20px !important;
}
.seo-footer__brand-meta b {
  font-size: 22px !important;       /* z 20 → 22px */
  font-style: normal !important;
  margin-bottom: 4px !important;
}
.seo-footer__seo-strip h5 {
  font-size: 11.5px !important;
  letter-spacing: 0.18em !important;
  color: #c4bba7 !important;
  margin-bottom: 16px !important;
}
.seo-footer__seo-strip .tags a {
  font-size: 13.5px !important;
  color: #d8d0bb !important;
  padding: 4px 0;
}
.seo-footer__seo-strip .tags span { color: #6f6552 !important; }
.seo-footer__bottom {
  font-size: 12px !important;
  letter-spacing: 0.12em !important;
  color: #9c9280 !important;
  padding-top: 24px !important;
}
.seo-footer__bottom a { color: #c4bba7 !important; }
.seo-footer__bottom a:hover { color: var(--gold-light) !important; }


/* =============================================================
   v15.12 KONTAKT info-panel REBUILD + FAQ visual upgrade
   Adam: „malutkie nadal... ramka kontaktu powinna być bogatsza ciekawsza... a tu tekst tekst tekst"
   ============================================================= */

/* INFO PANEL — większy padding, gradient bg */
.kt-info {
  padding: 28px;
  background: linear-gradient(180deg, #fff 0%, #fdfaf3 100%);
  border-left: 4px solid var(--gold);
  border-radius: 4px;
}

/* LIVE STATUS pill — z zegarem */
.kt-info__live {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 14px; align-items: center;
  padding: 16px 20px;
  background: #fff;
  border: 1px solid var(--line);
  box-shadow: 0 4px 14px rgba(20,17,11,.05);
  margin-bottom: 28px;
}
.kt-info__live-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.kt-info__live-time {
  font-family: var(--serif); font-size: 26px;
  font-weight: 600; color: var(--ink);
  line-height: 1; letter-spacing: -0.02em;
  text-align: right;
}
.kt-info__live-time span {
  display: block;
  font-family: var(--mono); font-size: 9.5px;
  letter-spacing: 0.16em; color: #5a5142; font-weight: 600;
  margin-top: 3px;
}

/* BRAND HEAD — z ikoną */
.kt-info__brand-head {
  display: flex; align-items: flex-start; gap: 14px;
  padding-bottom: 24px; margin-bottom: 24px;
  border-bottom: 2px solid var(--gold);
}
.kt-info__brand-icon {
  width: 44px; height: 44px;
  display: grid; place-items: center;
  background: var(--ink); color: var(--gold);
  border-radius: 50%;
  flex-shrink: 0;
  box-shadow: 0 4px 12px rgba(20,17,11,.18);
}
.kt-info__eye {
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--gold); font-weight: 700;
}
.kt-info__brand {
  font-family: var(--serif); font-size: 28px;
  color: var(--ink); font-weight: 500;
  margin: 4px 0 0;
  letter-spacing: -0.015em; line-height: 1.1;
}
.kt-info__brand-sub {
  display: block; margin-top: 4px;
  font-family: var(--serif); font-size: 13.5px;
  color: #5a5142; font-style: italic;
}

/* PEOPLE — premium karty z gradient avatarami */
.kt-info__people {
  display: flex; flex-direction: column; gap: 14px;
  padding: 0 0 24px;
  margin-bottom: 24px;
  border-bottom: 1px solid var(--line);
}
.kt-info__person {
  display: flex; align-items: center; gap: 14px;
  padding: 14px;
  background: #fff;
  border: 1px solid var(--line);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.kt-info__person:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(20,17,11,.06);
  border-color: rgba(212,175,55,.4);
}
.kt-info__avatar {
  position: relative;
  width: 52px; height: 52px;
  display: grid; place-items: center;
  font-family: var(--serif); font-size: 22px; font-weight: 600;
  border-radius: 50%;
  flex-shrink: 0;
  box-shadow: 0 3px 8px rgba(20,17,11,.18), inset 0 0 0 2px rgba(255,255,255,.15);
}
.kt-info__avatar--ink {
  background: linear-gradient(135deg, #2a241a 0%, #14110b 100%);
  color: var(--gold);
}
.kt-info__avatar--gold {
  background: linear-gradient(135deg, #e6c557 0%, #c79f30 100%);
  color: var(--ink);
}
.kt-info__avatar-status {
  position: absolute; bottom: 1px; right: 1px;
  width: 12px; height: 12px;
  background: #2faa53;
  border: 2px solid #fff;
  border-radius: 50%;
  box-shadow: 0 0 0 1px rgba(47,170,83,.3);
}
.kt-info__person-meta { flex: 1; min-width: 0; }
.kt-info__person-role {
  display: inline-flex; align-items: center; gap: 5px;
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--gold); font-weight: 700;
}
.kt-info__person-role svg { color: var(--gold); }
.kt-info__person strong {
  display: block;
  font-family: var(--serif); font-size: 17px;
  color: var(--ink); font-weight: 600;
  line-height: 1.2;
  margin: 4px 0 2px;
}
.kt-info__person-spec {
  display: block;
  font-family: var(--serif); font-size: 13px;
  color: #5a5142;
  line-height: 1.4;
}

/* KONTAKT TILES — premium karty z ikonami */
.kt-tiles {
  display: flex; flex-direction: column; gap: 10px;
  margin-bottom: 24px;
}
.kt-tile {
  display: flex; align-items: center; gap: 16px;
  padding: 16px 18px;
  background: #fff;
  border: 1px solid var(--line);
  border-left: 4px solid var(--gold);
  text-decoration: none;
  position: relative;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}
.kt-tile:hover {
  transform: translateX(3px);
  box-shadow: 0 8px 20px rgba(20,17,11,.07);
  background: linear-gradient(135deg, #fffbf0 0%, #fff 100%);
}
.kt-tile--main {
  background: linear-gradient(135deg, #fffbf0 0%, #fff 100%);
  border-color: var(--gold);
  border-left-width: 4px;
}
.kt-tile--whatsapp { border-left-color: #25d366; }
.kt-tile--whatsapp:hover { background: #f5fff8; }
.kt-tile--whatsapp .kt-tile__icon { color: #25d366; }
.kt-tile--mail { border-left-color: #4285F4; }
.kt-tile--mail:hover { background: #f5f9ff; }
.kt-tile--mail .kt-tile__icon { color: #4285F4; }
.kt-tile__icon {
  width: 44px; height: 44px;
  display: grid; place-items: center;
  background: var(--bg-2);
  color: var(--ink);
  border-radius: 50%;
  flex-shrink: 0;
}
.kt-tile--main .kt-tile__icon {
  background: var(--ink); color: var(--gold);
}
.kt-tile__body { flex: 1; min-width: 0; }
.kt-tile__label {
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--gold); font-weight: 700;
}
.kt-tile__val {
  font-family: var(--serif); font-size: 22px;
  color: var(--ink); font-weight: 600;
  line-height: 1.2; margin: 4px 0 4px;
  letter-spacing: -0.005em;
}
.kt-tile__val--sm { font-size: 19px; }
.kt-tile__sub {
  display: inline-flex; align-items: center; gap: 6px;
  font-family: var(--serif); font-size: 13px;
  color: #4a4335;
}
.kt-tile__sub svg { color: var(--gold); flex-shrink: 0; }
.kt-tile__badge {
  position: absolute; top: 12px; right: 14px;
  padding: 3px 8px;
  background: #2faa53; color: #fff;
  font-family: var(--mono); font-size: 9.5px;
  letter-spacing: 0.14em; font-weight: 700;
  border-radius: 2px;
}
.kt-tile__chevron {
  font-family: var(--serif); font-size: 24px;
  color: #25d366; font-weight: 400;
  transition: transform .2s ease;
  flex-shrink: 0;
}
.kt-tile:hover .kt-tile__chevron { transform: translateX(4px); }

/* TRUST MINI — wizualne badges */
.kt-trust-mini {
  padding: 18px;
  background: var(--ink); color: #f5efe0;
  margin-bottom: 24px;
  border-radius: 3px;
  position: relative;
  overflow: hidden;
}
.kt-trust-mini::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px;
  background: var(--gold);
}
.kt-trust-mini__head {
  display: flex; align-items: center; gap: 8px;
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--gold); font-weight: 700;
  margin-bottom: 14px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(212,175,55,.18);
}
.kt-trust-mini__grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 12px;
}
.kt-trust-mini__item {
  padding: 10px 12px;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(212,175,55,.12);
}
.kt-trust-mini__item strong {
  display: block;
  font-family: var(--serif); font-size: 16px;
  color: var(--gold); font-weight: 600;
  letter-spacing: -0.005em;
  line-height: 1.1;
}
.kt-trust-mini__item span {
  display: block;
  font-family: var(--mono); font-size: 10px;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: #c4bba7; font-weight: 600;
  margin-top: 4px;
}

/* ADDRESS — kafla z PIN-icon */
.kt-info__address {
  display: flex; gap: 14px;
  padding: 18px;
  background: linear-gradient(135deg, #fffbf0 0%, #fff 100%);
  border: 1px solid var(--gold);
  border-left: 4px solid var(--gold);
  margin-bottom: 0;
  margin-top: 0;
  border-top: 1px solid var(--gold);
}
.kt-info__address-icon {
  width: 44px; height: 44px;
  display: grid; place-items: center;
  background: var(--ink); color: var(--gold);
  border-radius: 50%;
  flex-shrink: 0;
}
.kt-info__address-body { flex: 1; min-width: 0; }
.kt-info__address-text {
  display: block;
  font-family: var(--serif); font-size: 16px;
  font-weight: 600;
  color: var(--ink); line-height: 1.55;
  margin: 4px 0 6px;
}
.kt-info__address-sub {
  display: block;
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.08em;
  color: #5a5142; line-height: 1.5;
}

/* MAP — większy, z lepszym overlayem */
.kt-info__map {
  margin: 16px 0 0;
  position: relative; aspect-ratio: 4/3;
  overflow: hidden;
  border: 1px solid var(--line);
}
.kt-info__map iframe { width: 100%; height: 100%; border: 0; display: block; filter: saturate(0.85); }
.kt-info__map figcaption {
  position: absolute; bottom: 0; left: 0; right: 0;
  display: flex; justify-content: space-between; align-items: center;
  gap: 10px; padding: 12px 16px;
  background: rgba(20,17,11,.92); color: #f0ead9;
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.12em; text-transform: uppercase;
  font-weight: 600;
}
.kt-info__map figcaption a { color: var(--gold-light); text-decoration: none; border-bottom: 1px solid var(--gold-light); }

.kt-info__map-note {
  margin-top: 10px;
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.06em;
  color: #5a5142;
}


/* FAQ — numerowane karty z mocniejszym plus-button */
.kt-faq__item summary { padding: 22px 26px; gap: 18px; }
.kt-faq__num {
  font-family: var(--serif); font-size: 22px;
  color: var(--gold); font-weight: 600;
  letter-spacing: -0.02em;
  width: 38px; flex-shrink: 0;
  line-height: 1;
}
.kt-faq__item[open] .kt-faq__num { color: var(--ink); }
.kt-faq__q {
  font-size: 18px !important;
  line-height: 1.35;
  font-weight: 600;
  flex: 1;
}
.kt-faq__plus {
  width: 34px; height: 34px;
  display: grid; place-items: center;
  background: linear-gradient(135deg, var(--gold) 0%, #c79f30 100%);
  color: var(--ink);
  font-size: 24px !important;
  font-family: var(--sans);
  font-weight: 400;
  border-radius: 50%;
  flex-shrink: 0;
  transition: transform .25s ease, background .25s ease;
  line-height: 1;
  box-shadow: 0 2px 6px rgba(212,175,55,.3);
}
.kt-faq__item[open] .kt-faq__plus {
  background: var(--ink); color: var(--gold);
  transform: rotate(45deg);
}
.kt-faq__a { padding: 18px 26px 26px 86px; }
.kt-faq__a p { font-size: 15.5px; line-height: 1.7; color: #3a3528; }


/* =============================================================
   v15.11 KONTAKT a11y bump — Adam: „za małe litery, nieczytelne"
   ============================================================= */
.kt-form-meta { padding: 22px 26px; gap: 22px; background: linear-gradient(135deg, #fffbf0 0%, #fff 100%); border: 1px solid var(--line); border-left: 4px solid var(--gold); }
.kt-form-meta__item { font-size: 15px; line-height: 1.5; gap: 10px; }
.kt-form-meta__item svg { width: 18px; height: 18px; }
.kt-form-meta__item strong { font-weight: 700; }

.kt-info__live { padding: 16px 18px; gap: 14px; }
.kt-info__live strong { font-size: 12.5px; letter-spacing: 0.16em; }
.kt-info__live span { font-size: 14px; margin-top: 3px; }

.kt-info__person-role { font-size: 11.5px !important; font-weight: 700 !important; letter-spacing: 0.16em !important; color: #5a5142 !important; }
.kt-info__person strong { font-size: 17px !important; }
.kt-info__avatar { width: 46px; height: 46px; font-size: 19px; }

.kt-info__contacts { gap: 22px; }
.kt-info__contact .kicker { font-size: 12px !important; letter-spacing: 0.16em !important; font-weight: 700 !important; }
.kt-info__phone { font-size: 26px; margin-top: 6px; }
.kt-info__phone--sm { font-size: 20px; }
.kt-info__address-text { font-size: 16px; line-height: 1.6; }

.kt-activity { padding: 24px 0; }
.kt-activity__text { font-size: 16px; line-height: 1.5; }
.kt-activity__text strong { font-size: 17px; }
.kt-activity__avg-label { font-size: 11px; }
.kt-activity__avg-val { font-size: 26px; }

.kt-faq__q { font-size: 17.5px; line-height: 1.35; }
.kt-faq__plus { font-size: 32px; width: 32px; color: var(--gold); font-weight: 600; }
.kt-faq__item summary { padding: 22px 26px; }
.kt-faq__a { padding: 18px 26px 24px; }
.kt-faq__a p { font-size: 15.5px; line-height: 1.7; }

.kt-status { padding: 16px 24px; gap: 16px; }
.kt-status__text strong { font-size: 12.5px; }
.kt-status__text span { font-size: 14.5px; margin-top: 3px; }

.kt-trust { padding: 32px 0; }
.kt-trust__item strong { font-size: 12.5px; }
.kt-trust__item span { font-size: 13.5px; margin-top: 3px; }

.kt-weg__title { font-size: 30px; }
.kt-weg__lede { font-size: 15.5px; line-height: 1.6; color: #4a4335; }
.kt-weg__stat strong { font-size: 19px; }
.kt-weg__stat span { font-size: 10.5px; }
.kt-weg__bullets li { font-size: 14.5px; line-height: 1.55; }

.kt-quick { padding: 36px 0; }
.kt-quick__label .eyebrow { font-size: 12px; letter-spacing: 0.22em; }
.kt-quick__label strong { font-size: 24px; margin-top: 8px; }
.kt-qa { padding: 16px 22px; min-width: 220px; }
.kt-qa strong { font-size: 12.5px; letter-spacing: 0.16em; }
.kt-qa span { font-size: 15px; margin-top: 4px; }

/* Form labels (adb-form) bump */
.adb-form__field > span,
.adb-form__field span:first-child {
  font-size: 14.5px !important;
  font-weight: 600 !important;
  color: #3a3528 !important;
  letter-spacing: 0.01em !important;
}


/* =============================================================
   v15.10 KONTAKT (page-kontakt.php) — przyjazna dla niemieckiego klienta
   Live-status · Trust strip · Quick-actions · FAQ · Social proof
   ============================================================= */

/* HERO */
.kt-hero { padding: 80px 0 0; background: linear-gradient(180deg, #fff 0%, #fdfaf3 100%); }
.kt-hero__top {
  display: grid; grid-template-columns: 1.1fr 1fr; gap: 80px;
  align-items: end; padding-bottom: 56px;
}
.kt-hero__right { display: flex; flex-direction: column; gap: 24px; }

/* LIVE STATUS pill */
.kt-status {
  display: inline-flex; align-items: center; gap: 14px;
  padding: 14px 22px;
  background: #fff; border: 1px solid var(--line);
  box-shadow: 0 4px 16px rgba(20,17,11,.04);
  border-radius: 4px;
  align-self: flex-start;
}
.kt-status__dot {
  display: inline-block; width: 12px; height: 12px;
  border-radius: 50%;
  position: relative; flex-shrink: 0;
}
.kt-status__dot--open {
  background: #2faa53;
  box-shadow: 0 0 0 4px rgba(47,170,83,.18);
}
.kt-status__dot--open::after {
  content: ''; position: absolute; inset: -2px;
  border-radius: 50%;
  border: 2px solid #2faa53;
  animation: ktpulse 2s ease-out infinite;
}
@keyframes ktpulse { 0% { transform: scale(1); opacity: .8; } 100% { transform: scale(2.2); opacity: 0; } }
.kt-status__dot--closed { background: #c8b8a0; box-shadow: 0 0 0 3px rgba(200,184,160,.25); }
.kt-status__text { display: flex; flex-direction: column; line-height: 1.3; }
.kt-status__text strong {
  font-family: var(--mono); font-size: 11.5px;
  letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--ink); font-weight: 700;
}
.kt-status__text span {
  font-family: var(--serif); font-size: 14px;
  color: #4a4335; margin-top: 2px;
}

/* TRUST STRIP — v15.25 powiększone (Adam: „powiększ to") */
.kt-trust {
  background: var(--ink); color: #f5efe0;
  border-top: 1px solid rgba(212,175,55,.25);
  border-bottom: 1px solid rgba(212,175,55,.25);
  padding: 40px 0;
}
.kt-trust__row {
  display: grid; grid-template-columns: repeat(5, 1fr); gap: 36px;
  align-items: center;
}
.kt-trust__item {
  display: flex; align-items: center; gap: 16px;
  color: #c4bba7;
  padding-right: 28px;
  border-right: 1px solid rgba(212,175,55,.15);
}
.kt-trust__item:last-child { border-right: 0; padding-right: 0; }
.kt-trust__item svg {
  color: var(--gold-light);
  flex-shrink: 0;
  width: 32px !important; height: 32px !important;
}
.kt-trust__item > div { line-height: 1.35; }
.kt-trust__item strong {
  display: block;
  font-family: var(--mono); font-size: 14px;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: #fff; font-weight: 700;
  line-height: 1.3;
}
.kt-trust__item span {
  display: block;
  font-family: var(--serif); font-size: 15px;
  color: #d8d0bb; margin-top: 4px;
  line-height: 1.45;
}

/* DREI WEGE */
.kt-wege { padding: 80px 0; background: var(--bg-2); }
.kt-wege__container { max-width: 1280px; }
.kt-wege__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.kt-weg {
  display: flex; flex-direction: column;
  background: #fff;
  padding: 36px 32px 32px;
  border: 1px solid var(--line);
  box-shadow: 0 8px 24px rgba(20,17,11,.04);
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
  position: relative;
  margin: 0;
}
.kt-weg:hover {
  transform: translateY(-3px);
  box-shadow: 0 18px 44px rgba(20,17,11,.1);
  border-color: rgba(212,175,55,.4);
}
.kt-weg--gold {
  background: linear-gradient(180deg, #fffbf0 0%, #fff 100%);
  border-color: var(--gold);
}
.kt-weg--gold::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: var(--gold);
}
.kt-weg__head {
  display: flex; align-items: center; gap: 16px; margin-bottom: 20px;
  position: relative;
}
.kt-weg__num {
  font-family: var(--serif);
  font-size: 56px; color: var(--gold);
  font-weight: 500; line-height: 1;
  letter-spacing: -0.02em;
}
.kt-weg__icon {
  width: 48px; height: 48px;
  display: grid; place-items: center;
  background: var(--ink); color: var(--gold);
  border-radius: 50%;
  box-shadow: 0 4px 12px rgba(20,17,11,.18), inset 0 0 0 1px rgba(212,175,55,.25);
}
.kt-weg__badge {
  position: absolute; top: -2px; right: -8px;
  padding: 4px 10px;
  background: var(--gold); color: var(--ink);
  font-family: var(--mono); font-size: 10px;
  letter-spacing: 0.12em; text-transform: uppercase; font-weight: 700;
  border-radius: 2px;
}
.kt-weg__title {
  font-family: var(--serif);
  font-size: 28px; line-height: 1.15;
  color: var(--ink); font-weight: 500;
  letter-spacing: -0.015em;
  margin: 0 0 16px;
}
.kt-weg__lede {
  font-family: var(--serif); font-size: 15px;
  line-height: 1.55; color: #4a4335;
  margin: 0 0 24px;
}
.kt-weg__stats {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px;
  padding: 16px 0;
  border-top: 1px solid var(--line); border-bottom: 1px solid var(--line);
  margin-bottom: 20px;
}
.kt-weg__stat { text-align: center; }
.kt-weg__stat strong {
  display: block;
  font-family: var(--serif); font-size: 18px;
  color: var(--gold); font-weight: 600;
  letter-spacing: -0.01em;
  line-height: 1.2;
}
.kt-weg__stat span {
  display: block;
  font-family: var(--mono); font-size: 10px;
  letter-spacing: 0.1em; text-transform: uppercase;
  color: #5a5142;
  margin-top: 4px;
}
.kt-weg__bullets {
  list-style: none; padding: 0; margin: 0 0 24px;
  display: flex; flex-direction: column; gap: 8px;
  flex: 1;
}
.kt-weg__bullets li {
  font-family: var(--serif); font-size: 14px;
  line-height: 1.5; color: #4a4335;
  padding-left: 22px; position: relative;
}
.kt-weg__bullets li::before {
  content: '✓'; position: absolute; left: 0; top: 0;
  color: var(--gold); font-weight: 700; font-size: 14px;
}
.kt-weg__cta { width: 100%; justify-content: center; }

/* QUICK-ACTIONS BAR */
.kt-quick {
  padding: 32px 0;
  background: linear-gradient(180deg, var(--bg-2) 0%, #fdfaf3 100%);
  border-top: 1px solid var(--line);
}
.kt-quick__inner {
  display: grid; grid-template-columns: 1fr auto;
  gap: 32px; align-items: center;
}
.kt-quick__label .eyebrow { color: var(--gold); }
.kt-quick__label strong {
  display: block; margin-top: 6px;
  font-family: var(--serif); font-size: 22px;
  color: var(--ink); font-weight: 500;
  letter-spacing: -0.01em;
}
.kt-quick__actions { display: flex; gap: 12px; flex-wrap: wrap; }
.kt-qa {
  display: inline-flex; align-items: center; gap: 12px;
  padding: 14px 20px;
  background: #fff; border: 1px solid var(--line);
  text-decoration: none;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
  min-width: 200px;
}
.kt-qa:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(20,17,11,.08);
}
.kt-qa div { display: flex; flex-direction: column; line-height: 1.2; }
.kt-qa strong {
  font-family: var(--mono); font-size: 11.5px;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--ink); font-weight: 700;
}
.kt-qa span {
  font-family: var(--serif); font-size: 14px;
  color: #4a4335; margin-top: 3px;
}
.kt-qa--whatsapp { color: #25d366; border-color: rgba(37,211,102,.4); }
.kt-qa--whatsapp:hover { border-color: #25d366; background: #f5fff8; }
.kt-qa--phone svg { color: var(--gold); }
.kt-qa--phone:hover { border-color: var(--gold); background: #fffbf0; }
.kt-qa--mail svg { color: #4285F4; }
.kt-qa--mail:hover { border-color: #4285F4; background: #f5f9ff; }

/* FORM SECTION */
.kt-form-sec { padding: 96px 0; }
.kt-form-grid {
  display: grid; grid-template-columns: 1.3fr 1fr; gap: 80px;
  align-items: start;
}
.kt-form-meta {
  display: flex; flex-wrap: wrap; gap: 18px;
  margin-top: 32px;
  padding: 18px 22px;
  background: var(--bg-2);
  border-left: 3px solid var(--gold);
}
.kt-form-meta__item {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: var(--serif); font-size: 13.5px;
  color: #4a4335; line-height: 1.4;
}
.kt-form-meta__item svg { color: var(--gold); flex-shrink: 0; }
.kt-form-meta__item strong { color: var(--ink); font-weight: 600; }

/* INFO PANEL */
.kt-info {
  padding: 32px;
  background: #fff;
  border: 1px solid var(--line);
  border-left: 3px solid var(--gold);
  position: sticky; top: 100px;
  box-shadow: 0 8px 32px rgba(20,17,11,.06);
}
.kt-info__live {
  display: flex; align-items: center; gap: 14px;
  padding: 14px 16px;
  background: var(--bg-2);
  border: 1px solid var(--line);
  margin-bottom: 24px;
}
.kt-info__live strong {
  display: block;
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--ink); font-weight: 700;
}
.kt-info__live span {
  display: block;
  font-family: var(--serif); font-size: 13px;
  color: #4a4335; margin-top: 2px;
}
.kt-info__brand {
  font-family: var(--serif); font-size: 28px;
  color: var(--ink); font-weight: 500;
  margin: 10px 0 24px;
  letter-spacing: -0.01em; line-height: 1.2;
}
.kt-info__brand-sub {
  display: block;
  font-size: 13px; font-weight: 400;
  color: #5a5142; letter-spacing: 0.05em;
  margin-top: 4px;
}

/* People (Geschäftsführer) */
.kt-info__people {
  display: flex; flex-direction: column; gap: 12px;
  padding: 18px 0;
  border-top: 1px solid var(--line); border-bottom: 1px solid var(--line);
  margin-bottom: 24px;
}
.kt-info__person {
  display: flex; align-items: center; gap: 12px;
}
.kt-info__avatar {
  width: 42px; height: 42px;
  display: grid; place-items: center;
  background: var(--ink); color: var(--gold);
  font-family: var(--serif); font-size: 18px;
  font-weight: 600;
  border-radius: 50%;
  flex-shrink: 0;
  box-shadow: 0 2px 6px rgba(20,17,11,.18);
}
.kt-info__avatar--gold {
  background: linear-gradient(135deg, var(--gold) 0%, #c79f30 100%);
  color: var(--ink);
}
.kt-info__person-role {
  font-family: var(--mono); font-size: 10.5px;
  letter-spacing: 0.16em; text-transform: uppercase;
  color: #5a5142; font-weight: 600;
}
.kt-info__person strong {
  font-family: var(--serif); font-size: 16px;
  color: var(--ink); font-weight: 600;
  display: block; margin-top: 1px;
  line-height: 1.2;
}

.kt-info__contacts { display: flex; flex-direction: column; gap: 20px; }
.kt-info__contact {}
.kt-info__phone {
  font-family: var(--serif); font-size: 24px;
  margin-top: 4px; font-weight: 500;
  letter-spacing: -0.01em;
}
.kt-info__phone--sm { font-size: 19px; }
.kt-info__phone a { color: var(--ink); text-decoration: none; }
.kt-info__phone a:hover { color: var(--gold); }

.kt-info__address {
  margin-top: 24px; padding-top: 20px;
  border-top: 1px solid var(--line);
}
.kt-info__address-text {
  font-family: var(--serif); font-size: 15px;
  margin-top: 8px; line-height: 1.55;
  color: var(--ink);
}

.kt-info__map {
  margin: 24px 0 0;
  position: relative; aspect-ratio: 4/3;
  overflow: hidden; border: 1px solid var(--line);
  background: #dfd8c8;
}
.kt-info__map iframe {
  width: 100%; height: 100%; border: 0; display: block;
  filter: saturate(0.85);
}
.kt-info__map figcaption {
  position: absolute; bottom: 0; left: 0; right: 0;
  display: flex; justify-content: space-between; align-items: center;
  gap: 10px; padding: 10px 14px;
  background: rgba(20,17,11,.88); color: #f0ead9;
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.12em; text-transform: uppercase;
}
.kt-info__map figcaption a {
  color: var(--gold-light); text-decoration: none;
  border-bottom: 1px solid var(--gold-light); padding-bottom: 1px;
}
.kt-info__map-note {
  margin-top: 8px;
  font-size: 12px; color: #5a5142;
  font-family: var(--mono); letter-spacing: 0.04em;
}

/* RECENT ACTIVITY (social proof bar) */
.kt-activity {
  background: linear-gradient(135deg, #fffbf0 0%, #fff 100%);
  border-top: 1px solid var(--gold);
  border-bottom: 1px solid var(--line);
  padding: 20px 0;
}
.kt-activity__inner {
  display: flex; align-items: center; gap: 24px;
  flex-wrap: wrap;
}
.kt-activity__pulse {
  width: 10px; height: 10px; border-radius: 50%;
  background: #2faa53;
  position: relative; flex-shrink: 0;
}
.kt-activity__pulse::after {
  content: ''; position: absolute; inset: -2px;
  border-radius: 50%; border: 2px solid #2faa53;
  animation: ktpulse 2s ease-out infinite;
}
.kt-activity__text {
  flex: 1; font-family: var(--serif); font-size: 15px;
  color: #4a4335; line-height: 1.5;
}
.kt-activity__text strong { color: var(--ink); font-weight: 600; }
.kt-activity__avg {
  display: flex; flex-direction: column; align-items: flex-end;
  padding-left: 24px; border-left: 1px solid var(--line);
  flex-shrink: 0;
}
.kt-activity__avg-label {
  font-family: var(--mono); font-size: 10px;
  letter-spacing: 0.16em; text-transform: uppercase;
  color: #5a5142; font-weight: 600;
}
.kt-activity__avg-val {
  font-family: var(--serif); font-size: 22px;
  color: var(--gold); font-weight: 600;
  letter-spacing: -0.01em; margin-top: 2px;
}

/* FAQ */
.kt-faq { padding: 96px 0; background: var(--bg-2); }
.kt-faq__head { max-width: 800px; margin-bottom: 48px; }
.kt-faq__head h2 em { color: var(--gold); font-style: italic; }
.kt-faq__head .lede { color: #4a4335; }

.kt-faq__grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 12px;
}
.kt-faq__item {
  background: #fff;
  border: 1px solid var(--line);
  border-left: 3px solid transparent;
  transition: border-color .2s ease, box-shadow .2s ease;
}
.kt-faq__item[open] {
  border-left-color: var(--gold);
  box-shadow: 0 8px 24px rgba(20,17,11,.06);
}
.kt-faq__item summary {
  display: flex; justify-content: space-between; align-items: flex-start;
  gap: 16px;
  padding: 18px 22px;
  cursor: pointer;
  list-style: none;
  user-select: none;
}
.kt-faq__item summary::-webkit-details-marker { display: none; }
.kt-faq__q {
  font-family: var(--serif); font-size: 16.5px;
  color: var(--ink); font-weight: 600;
  line-height: 1.3;
  letter-spacing: -0.005em;
}
.kt-faq__plus {
  font-family: var(--serif); font-size: 24px;
  color: var(--gold); font-weight: 400;
  line-height: 1; flex-shrink: 0;
  width: 24px; text-align: center;
  transition: transform .25s ease;
}
.kt-faq__item[open] .kt-faq__plus { transform: rotate(45deg); }
.kt-faq__a {
  padding: 0 22px 22px;
  border-top: 1px dashed var(--line);
  margin-top: -2px;
  padding-top: 16px;
}
.kt-faq__a p {
  font-family: var(--serif); font-size: 14.5px;
  line-height: 1.65; color: #4a4335;
  margin: 0;
}
.kt-faq__a strong { color: var(--ink); font-weight: 600; }
.kt-faq__a a { color: var(--gold); border-bottom: 1px solid currentColor; text-decoration: none; }

/* QUOTE BOTTOM */
.kt-quote-text {
  font-family: var(--serif);
  font-size: clamp(28px, 3.5vw, 44px);
  line-height: 1.3; color: #f0ead9;
  margin: 32px 0;
  font-weight: 400; font-style: italic;
}
.kt-quote-text em { color: var(--gold-light); font-style: italic; }
.kt-quote-sec .eyebrow { font-size: 12px; }

/* RESPONSIVE */
@media (max-width: 1180px) {
  .kt-hero__top { gap: 48px; }
  .kt-trust__row { grid-template-columns: repeat(3, 1fr); gap: 24px; }
  .kt-wege__grid { grid-template-columns: 1fr; max-width: 640px; margin: 0 auto; }
  .kt-quick__inner { grid-template-columns: 1fr; }
  .kt-form-grid { grid-template-columns: 1fr; gap: 56px; }
  .kt-info { position: static; }
  .kt-faq__grid { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  .kt-hero { padding: 56px 0 0; }
  .kt-hero__top { grid-template-columns: 1fr; gap: 32px; }
  .kt-trust { padding: 22px 0; }
  .kt-trust__row { grid-template-columns: 1fr 1fr; gap: 18px; }
  .kt-trust__item strong { font-size: 11px; }
  .kt-trust__item span { font-size: 12px; }
  .kt-wege { padding: 56px 0; }
  .kt-weg { padding: 28px 22px; }
  .kt-weg__title { font-size: 24px; }
  .kt-weg__num { font-size: 44px; }
  .kt-quick__actions { flex-direction: column; }
  .kt-qa { width: 100%; }
  .kt-form-sec { padding: 56px 0; }
  .kt-info { padding: 24px 22px; }
  .kt-activity__inner { flex-direction: column; align-items: flex-start; gap: 14px; }
  .kt-activity__avg { padding-left: 0; border-left: 0; padding-top: 14px; border-top: 1px solid var(--line); width: 100%; align-items: flex-start; }
  .kt-faq { padding: 56px 0; }
  .kt-faq__q { font-size: 15px; }
}


/* =============================================================
   v15.8 ACCESSIBILITY PATCH — czytelność dla 35-60+ (WCAG AA)
   Adam: „czy czcionki wielkości i kolory tego typu będą widoczne dla każdego"
   Cel: minimum 4.5:1 contrast, minimum 12px mono / 14.5px serif body
   ============================================================= */

/* GREVS · mono labels — bump z 10.5/11.5 → 12/13 + ciemniejsze kolory */
.ub-grevs__source { font-size: 13px; color: #4a4335; }
.ub-grevs__count  { font-size: 13px; color: #5a5142; }
.ub-grev__loc     { font-size: 12px; color: #5a5142; }
.ub-grev__date    { font-size: 12px; color: #5a5142; }
.ub-grev__name    { font-size: 16px; }
.ub-grev__text    { font-size: 15px; line-height: 1.6; color: #3a3528; }
.ub-grev__photo-badge { font-size: 11px; padding: 5px 10px; }

/* MAP · cities + foot-rows + svg-bar */
.ub-map__cities-eyebrow   { font-size: 12px; color: var(--gold); }
.ub-map__cities-title     { font-size: 24px; }
.ub-map__cities-sub       { font-size: 15px; color: #4a4335; line-height: 1.55; }
.ub-map__city             { font-size: 14px; padding: 8px 12px 8px 10px; }
.ub-map__city-land        { font-size: 11px; padding: 2px 6px; color: #5a5142; }
.ub-map__cities-foot-row  { font-size: 14px; color: #4a4335; line-height: 1.55; gap: 12px; }
.ub-map__cities-foot-row strong { color: var(--ink); }
.ub-map__svg-bar          { padding: 16px 22px; }
.ub-map__svg-bar-legend   { font-size: 12.5px; gap: 22px; }
.ub-map__svg-bar-link     { font-size: 12px; padding: 10px 18px; }

/* MAP · storytelling banner */
.ub-map__story-label      { font-size: 12px; }
.ub-map__story-meta       { font-size: 15px; color: #d8d0bb; line-height: 1.6; }
.ub-map__story-arrow-label { font-size: 12.5px; line-height: 1.4; }
.ub-map__story-arrow-label small { font-size: 11px; }

/* VS · ostateczne wzmocnienie (już zmienione wyżej, tu tylko fallback strong wartości) */
.ub-vs__chip-mark    { width: 18px; height: 18px; }
.ub-vs__head .lede   { font-size: 17px; color: #4a4335; line-height: 1.65; }

/* ATMOSPHERE GALLERY · captions */
.nl-atmo__cap-name        { font-size: 17px; }
.nl-atmo__cap-land        { font-size: 11px; color: var(--gold-light); letter-spacing: 0.16em; }
.nl-atmo__strip-lbl       { font-size: 11px; color: #d8d0bb; letter-spacing: 0.12em; }

/* HERO/EYEBROWS GLOBAL — wszystkie .eyebrow w light-bg sekcjach */
.ub-map__head .eyebrow,
.ub-vs__head .eyebrow,
.ub-grevs__headline .eyebrow,
.nl-atmo__head .eyebrow {
  font-size: 12px;
  letter-spacing: 0.22em;
  font-weight: 700;
}

/* LEDE wsparcie — wszystkie .lede w newer ub-* sekcjach minimum 16.5px */
.ub-map__head .lede,
.ub-grevs__headline .lede,
.nl-atmo__head .lede {
  font-size: 17px;
  line-height: 1.65;
}

/* Kolor "ink-mute" globalnie wzmocniony tam gdzie używany w newer ub-* */
.ub-grev__loc,
.ub-grev__date,
.ub-map__city-land,
.ub-map__embed-legend {
  color: #4a4335 !important; /* z poprzedniego var(--ink-mute) #7a7160 → ciemniejsze, 9.4:1 contrast */
}

/* Footnote VS — czytelne (z 13.5 → 14.5 + ciemniejszy) */
.ub-vs__footnote { font-size: 14.5px; color: #3a3528; }

/* RESPONSIVE — na mobile dodatkowo pogrubienie ciężkich tekstów */
@media (max-width: 720px) {
  .ub-vs__merkmal       { font-size: 12.5px; }
  .ub-vs__side-label    { font-size: 11px; }
  .ub-vs__value         { font-size: 18px; }
  .ub-vs__detail        { font-size: 14px; line-height: 1.55; }
  .ub-grev__text        { font-size: 14.5px; }
  .ub-map__cities-title { font-size: 20px; }
  .ub-map__cities-sub   { font-size: 14.5px; }
}

/* =============================================================
   v15.42b — KONFIGURATOR Restore Prompt (Adam: „prompt fortsetzen czy neu starten")
   ============================================================= */
#k3-restore-prompt {
  position: fixed; inset: 0; z-index: 9999;
  display: flex; align-items: center; justify-content: center;
  padding: 20px;
  opacity: 0; pointer-events: none;
  transition: opacity .25s ease;
}
#k3-restore-prompt.is-open { opacity: 1; pointer-events: auto; }
.k3-restore-overlay {
  position: absolute; inset: 0;
  background: rgba(20, 17, 11, .65);
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
}
.k3-restore-card {
  position: relative;
  max-width: 540px; width: 100%;
  background: var(--bg, #f7f3ea);
  border: 1px solid var(--gold-light, #d4af37);
  border-radius: 12px;
  padding: 36px 32px 32px;
  box-shadow: 0 30px 80px -20px rgba(0,0,0,.6);
  transform: translateY(16px);
  transition: transform .3s cubic-bezier(.19,1,.22,1);
}
#k3-restore-prompt.is-open .k3-restore-card { transform: translateY(0); }
.k3-restore-eyebrow {
  font-family: var(--mono); font-size: 11px; letter-spacing: .25em;
  text-transform: uppercase; color: var(--gold, #9d6e1f); font-weight: 700;
  margin-bottom: 12px;
}
.k3-restore-h {
  font-family: var(--serif, Georgia); font-size: clamp(24px, 3.5vw, 32px);
  font-weight: 500; line-height: 1.15; letter-spacing: -0.01em;
  color: var(--ink, #14110b); margin: 0 0 14px;
}
.k3-restore-h em { color: var(--gold, #9d6e1f); font-style: italic; }
.k3-restore-sub {
  font-size: 15px; line-height: 1.6; color: var(--ink-dim, #4a4335);
  margin: 0 0 24px;
}
.k3-restore-actions {
  display: flex; gap: 10px; flex-wrap: wrap;
}
.k3-restore-btn {
  flex: 1; min-width: 180px;
  padding: 14px 20px;
  font-family: var(--sans, Inter, sans-serif);
  font-size: 13px; letter-spacing: .12em; text-transform: uppercase; font-weight: 600;
  border: 1px solid var(--ink, #14110b);
  cursor: pointer;
  transition: background .2s, color .2s, transform .15s;
  border-radius: 6px;
}
.k3-restore-btn--continue {
  background: var(--ink, #14110b); color: var(--bg, #f7f3ea);
}
.k3-restore-btn--continue:hover { background: var(--gold-2, #a07617); border-color: var(--gold-2, #a07617); transform: translateY(-1px); }
.k3-restore-btn--reset {
  background: transparent; color: var(--ink, #14110b);
  border: 1px solid var(--line-2, #c2b89e);
}
.k3-restore-btn--reset:hover { background: var(--bg-2, #efe9dc); border-color: var(--ink-mute, #7a7160); }

/* =============================================================
   v15.42b — KONFIGURATOR Reset button (always-visible)
   ============================================================= */
.k3-reset-btn {
  position: fixed; bottom: 96px; right: 18px; /* 2026-06-04: über der Sticky-CTA */
  z-index: 100;
  padding: 10px 16px;
  background: rgba(20, 17, 11, .9); color: var(--gold-light, #d4af37);
  border: 1px solid rgba(212, 175, 55, .3); border-radius: 100px;
  font-family: var(--mono, monospace); font-size: 11px; letter-spacing: .12em;
  text-transform: uppercase; font-weight: 600;
  cursor: pointer;
  display: inline-flex; align-items: center; gap: 6px;
  backdrop-filter: blur(8px);
  transition: background .2s, transform .15s;
  box-shadow: 0 4px 14px rgba(0, 0, 0, .25);
}
.k3-reset-btn:hover { background: var(--ink, #14110b); transform: translateY(-2px); }
.k3-reset-btn::before {
  content: '↻'; font-size: 14px; line-height: 1; font-family: var(--serif);
}

@media (max-width: 540px) {
  .k3-reset-btn { bottom: 112px; right: 12px; padding: 8px 12px; font-size: 10px; } /* nie nachodzi na mobile sticky CTA */
  .k3-restore-card { padding: 28px 22px 24px; }
  .k3-restore-actions { flex-direction: column; }
  .k3-restore-btn { width: 100%; }
}
body:has(#k3-cta) .adb-cc__reopen, body:has(#k3-cta) #adbCcReopen { bottom: 104px; }

/* =============================================================
   v15.42c — HERO responsive fix (Adam: „zdjęcie za małe, źle skaluje")
   ============================================================= */
@media (max-width: 1100px) {
  .fp-hero-grid {
    grid-template-columns: 1fr 1fr !important;
    gap: 40px !important;
  }
  .fp-hero-photo { min-height: 480px !important; }
}
@media (max-width: 900px) {
  .fp-hero-grid {
    grid-template-columns: 1fr !important;
    gap: 40px !important;
  }
  .fp-hero-photo { min-height: 400px !important; aspect-ratio: 4 / 3; }
  .fp-hero-section { padding: 32px 0 56px !important; }
}
@media (max-width: 540px) {
  .fp-hero-photo { min-height: 280px !important; }
  /* Trust row 4-col → 2x2 */
  .fp-hero-grid > div:first-child > div[style*="grid-template-columns:repeat(4,1fr)"],
  .fp-hero-grid > div:first-child > div[style*="grid-template-columns:repeat(4, 1fr)"] {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 20px !important;
  }
}

/* =============================================================
   v15.44 — MANIFEST CINEMATIC (Adam: photo sprzedaje, sztywno trzymasz się ram)
   RESTRUKTURA: full-bleed photo 21:9 + cytat overlay + editorial spread pod
   ============================================================= */
.manifest--cinematic { padding-top: 32px; padding-bottom: 96px; }

/* FULL-BLEED HERO PHOTO — wychodzi do krawędzi screen */
.manifest__hero {
  position: relative;
  margin: 0;
  width: 100%;
  aspect-ratio: 21/9;
  max-height: 720px;
  overflow: hidden;
  background: #14110b;
}
.manifest__hero img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: center;
  filter: contrast(1.08) saturate(1.05) brightness(1.02);
  transition: transform 1.4s cubic-bezier(.2,.7,.2,1);
}
.manifest__hero:hover img { transform: scale(1.04); }

.manifest__hero-shade {
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(20,17,11,.55) 0%, rgba(20,17,11,0) 25%, rgba(20,17,11,0) 45%, rgba(20,17,11,.85) 100%);
  pointer-events: none; z-index: 1;
}

.manifest__hero-badge {
  position: absolute;
  top: 32px; left: 32px;
  z-index: 3;
  padding: 12px 18px;
  background: rgba(20,17,11,.55);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  border-left: 2px solid var(--gold-light);
}
.manifest__hero-eyebrow {
  display: block;
  font-family: var(--mono);
  font-size: 11px; letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--gold-light); font-weight: 600;
}
.manifest__hero-loc {
  display: block; margin-top: 4px;
  font-family: var(--mono);
  font-size: 10px; letter-spacing: .15em;
  color: rgba(240,234,217,.85);
}

.manifest__hero-corner {
  position: absolute;
  width: 56px; height: 56px;
  z-index: 3; pointer-events: none;
}
.manifest__hero-corner--tl {
  top: 24px; right: 24px;
  border-top: 3px solid var(--gold-light);
  border-right: 3px solid var(--gold-light);
}
.manifest__hero-corner--br {
  bottom: 24px; left: 24px;
  border-bottom: 3px solid var(--gold-light);
  border-left: 3px solid var(--gold-light);
}

.manifest__hero-quote {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  z-index: 4;
  padding: 56px clamp(32px, 6vw, 96px) 48px clamp(32px, 6vw, 96px);
  max-width: 1400px; margin: 0 auto;
  color: #f0ead9;
}
.manifest__hero-quote-mark {
  display: block;
  font-family: var(--serif);
  font-size: clamp(64px, 8vw, 120px);
  line-height: .5;
  color: var(--gold-light);
  font-style: italic; font-weight: 500;
  margin-bottom: -8px;
  text-shadow: 0 2px 12px rgba(0,0,0,.4);
}
.manifest__hero-quote-text {
  font-family: var(--serif);
  font-size: clamp(28px, 4vw, 56px);
  line-height: 1.15; font-weight: 400;
  letter-spacing: -.015em;
  color: #f0ead9; margin: 0;
  max-width: 1100px;
  text-shadow: 0 2px 16px rgba(0,0,0,.55), 0 1px 4px rgba(0,0,0,.5);
}
.manifest__hero-quote-text em { color: var(--gold-light); font-style: italic; }
.manifest__hero-quote-author {
  margin-top: 28px; padding-top: 18px;
  border-top: 1px solid rgba(240,234,217,.25);
  display: flex; align-items: baseline;
  gap: 18px; flex-wrap: wrap;
}
.manifest__hero-quote-author strong {
  font-family: var(--serif); font-size: 20px;
  font-weight: 500; color: #f0ead9;
  letter-spacing: -.005em;
}
.manifest__hero-quote-author span {
  font-family: var(--mono); font-size: 11px;
  letter-spacing: .18em; text-transform: uppercase;
  color: var(--gold-light); font-weight: 600;
}

/* BOTTOM SPREAD — pod photo, w container, 2-col */
.manifest__bottom-wrap { padding-top: 64px; padding-bottom: 16px; max-width: 1280px; }
.manifest__bottom {
  display: grid;
  grid-template-columns: 1fr 1.1fr;
  gap: 80px; align-items: start;
}

.manifest__bottom-quote { position: relative; }
.manifest__bottom-quote .manifest__monogram {
  position: absolute;
  top: -20px; right: -10px;
  font-family: var(--serif);
  font-size: clamp(120px, 15vw, 200px);
  color: rgba(212,175,55,.05);
  font-style: italic; font-weight: 500;
  letter-spacing: -.04em; line-height: 1;
  pointer-events: none; z-index: 0;
}
.manifest__bottom-text {
  font-family: var(--serif);
  font-size: clamp(20px, 1.8vw, 26px);
  line-height: 1.45; color: var(--ink);
  font-weight: 400; letter-spacing: -.005em;
  margin: 0; position: relative; z-index: 1;
  text-wrap: balance;
}
.manifest__bottom-text em { color: var(--gold); font-style: italic; }

.manifest__bottom-stamp {
  margin-top: 32px; padding-top: 24px;
  border-top: 1px solid var(--line-2);
  display: flex; align-items: center;
  gap: 18px; position: relative; z-index: 1;
  color: var(--gold);
}
.manifest__bottom-stamp-line { color: var(--ink-faint); font-size: 18px; }
.manifest__bottom-stamp-meta {
  font-family: var(--mono);
  font-size: 11px; letter-spacing: .15em;
  text-transform: uppercase;
  color: var(--ink-mute); line-height: 1.6;
}
.manifest__bottom-stamp-meta span { display: block; }

.manifest__bottom-proofs { display: flex; flex-direction: column; gap: 0; }
.manifest__bottom-proof-eyebrow {
  font-family: var(--mono);
  font-size: 11px; letter-spacing: .25em;
  text-transform: uppercase;
  color: var(--gold); font-weight: 700;
  margin-bottom: 24px; padding-bottom: 12px;
  border-bottom: 1px solid var(--line-2);
}
.manifest__bottom-proof {
  display: grid;
  grid-template-columns: 140px 1fr;
  gap: 24px; align-items: baseline;
  padding: 22px 0;
  border-bottom: 1px solid var(--line);
}
.manifest__bottom-proof:last-child { border-bottom: 0; }
.manifest__bottom-proof-num {
  font-family: var(--serif);
  font-size: clamp(36px, 4vw, 52px);
  font-weight: 500; color: var(--ink);
  line-height: 1; letter-spacing: -.02em;
}
.manifest__bottom-proof-num sup {
  color: var(--gold);
  font-size: 0.45em; font-weight: 500;
  vertical-align: super; margin-left: 2px;
}
.manifest__bottom-proof-info strong {
  display: block;
  font-family: var(--serif); font-size: 18px;
  font-weight: 500; color: var(--ink);
  letter-spacing: -.005em;
}
.manifest__bottom-proof-info span {
  display: block; margin-top: 4px;
  font-family: var(--mono);
  font-size: 10.5px; letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--ink-mute); font-weight: 600;
  line-height: 1.5;
}

/* Responsive — manifest cinematic */
@media (max-width: 1100px) {
  .manifest__hero { aspect-ratio: 16/9; max-height: 540px; }
  .manifest__hero-quote { padding: 32px 32px 28px; }
  .manifest__hero-corner { width: 40px; height: 40px; }
  .manifest__bottom { grid-template-columns: 1fr; gap: 48px; }
}
@media (max-width: 640px) {
  .manifest--cinematic { padding-bottom: 64px; }
  .manifest__hero { aspect-ratio: 4/5; max-height: 600px; }
  .manifest__hero-badge { top: 16px; left: 16px; padding: 10px 14px; }
  .manifest__hero-eyebrow { font-size: 9.5px; }
  .manifest__hero-corner { width: 28px; height: 28px; }
  .manifest__hero-corner--tl { top: 14px; right: 14px; }
  .manifest__hero-corner--br { bottom: 14px; left: 14px; }
  .manifest__hero-quote { padding: 24px 20px 20px; }
  .manifest__hero-quote-mark { font-size: 56px; }
  .manifest__hero-quote-text { font-size: 22px; line-height: 1.2; }
  .manifest__hero-quote-author { gap: 6px; flex-direction: column; padding-top: 14px; margin-top: 18px; }
  .manifest__hero-quote-author strong { font-size: 16px; }
  .manifest__hero-quote-author span { font-size: 9.5px; }
  .manifest__bottom-wrap { padding-top: 40px; }
  .manifest__bottom { gap: 32px; }
  .manifest__bottom-text { font-size: 17px; }
  .manifest__bottom-stamp { flex-wrap: wrap; gap: 12px; }
  .manifest__bottom-proof { grid-template-columns: 1fr; gap: 8px; padding: 16px 0; }
  .manifest__bottom-proof-num { font-size: 36px; }
  .manifest__bottom-proof-info strong { font-size: 16px; }
}

/* ============== v15.56 — KOLLEKTION SEO CONTENT BLOCKS ============== */

/* SEO knowledge cards */
.koll-seo { padding: 72px 0; background: linear-gradient(180deg, var(--bg, #faf6ec) 0%, #fff 100%); border-top: 1px solid var(--line); }
.koll-seo__head { text-align: center; max-width: 760px; margin: 0 auto 48px; }
.koll-seo__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(330px, 1fr)); gap: 24px; }
.koll-seo__card { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 32px 28px; position: relative; transition: border-color .25s, box-shadow .25s, transform .25s; }
.koll-seo__card:hover { border-color: rgba(212,175,55,.35); box-shadow: 0 18px 40px -16px rgba(20,17,11,.1); transform: translateY(-2px); }
.koll-seo__no { position: absolute; top: 24px; right: 28px; font-family: var(--serif); font-size: 32px; font-weight: 400; color: var(--gold-light, #f5e0a3); line-height: 1; }
.koll-seo__h { font-family: var(--serif); font-size: 22px; font-weight: 500; color: var(--ink); margin: 0 0 14px; line-height: 1.25; padding-right: 50px; }
.koll-seo__card p { font-size: 14.5px; line-height: 1.65; color: var(--ink); margin: 0 0 14px; }
.koll-seo__bullets { list-style: none; padding: 0; margin: 12px 0; display: flex; flex-direction: column; gap: 6px; }
.koll-seo__bullets li { padding-left: 22px; position: relative; font-size: 13.5px; line-height: 1.55; color: var(--ink); }
.koll-seo__bullets li::before { content: ''; position: absolute; left: 6px; top: 8px; width: 6px; height: 6px; background: var(--gold); border-radius: 50%; }
.koll-seo__link { display: inline-block; margin-top: 8px; font-family: var(--mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; font-weight: 700; color: var(--gold-dark, #9d6e1f); text-decoration: none; border-bottom: 1px solid var(--gold); padding-bottom: 2px; transition: all .2s; }
.koll-seo__link:hover { color: var(--ink); border-bottom-color: var(--ink); }

/* FAQ section */
.koll-faq { padding: 80px 0; background: var(--ink, #14110b); color: #fff5e1; }
.koll-faq__head { text-align: center; max-width: 720px; margin: 0 auto 56px; }
.koll-faq__head .eyebrow { color: var(--gold); }
.koll-faq__head h2 { color: #fff5e1; }
.koll-faq__head h2 em { color: var(--gold-light, #f5e0a3); font-style: italic; }
.koll-faq__head .lede { color: #c4bba7; }
.koll-faq__list { max-width: 880px; margin: 0 auto; display: flex; flex-direction: column; gap: 12px; }
.koll-faq__item { background: rgba(255,245,225,.04); border: 1px solid rgba(212,175,55,.18); border-radius: 10px; overflow: hidden; transition: border-color .25s; }
.koll-faq__item[open], .koll-faq__item:hover { border-color: rgba(212,175,55,.4); }
.koll-faq__item summary { list-style: none; cursor: pointer; padding: 22px 28px; font-family: var(--serif); font-size: 17px; font-weight: 500; color: #fff5e1; display: flex; align-items: center; gap: 16px; transition: background .2s; }
.koll-faq__item summary::-webkit-details-marker { display: none; }
.koll-faq__item summary::after { content: '+'; margin-left: auto; font-family: var(--serif); font-size: 24px; color: var(--gold); transition: transform .25s; line-height: 1; }
.koll-faq__item[open] summary::after { content: '−'; transform: rotate(180deg); }
.koll-faq__item summary:hover { background: rgba(212,175,55,.05); }
.koll-faq__item > div { padding: 0 28px 24px; }
.koll-faq__item > div > div { padding: 0 0 4px; border-top: 1px solid rgba(212,175,55,.18); padding-top: 18px; }
.koll-faq__item p { font-size: 14.5px; line-height: 1.7; color: #c4bba7; margin: 0 0 10px; }
.koll-faq__item p strong { color: var(--gold-light, #f5e0a3); font-weight: 600; }
.koll-faq__item p em { color: #fff5e1; font-style: normal; }

/* Trust strip */
.koll-trust-strip { padding: 60px 0; background: var(--bg-2, #faf6ec); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.koll-trust-strip__grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 24px; max-width: 1200px; margin: 0 auto; }
.koll-trust-strip__item { text-align: center; padding: 12px 8px; }
.koll-trust-strip__num { font-family: var(--serif); font-size: 38px; font-weight: 500; color: var(--gold-dark, #9d6e1f); line-height: 1; margin-bottom: 8px; letter-spacing: -.01em; }
.koll-trust-strip__label { font-family: var(--mono); font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-mute); font-weight: 600; line-height: 1.4; }

@media (max-width: 1024px) {
	.koll-trust-strip__grid { grid-template-columns: repeat(3, 1fr); gap: 28px 16px; }
}
@media (max-width: 600px) {
	.koll-trust-strip__grid { grid-template-columns: repeat(2, 1fr); gap: 24px 12px; }
	.koll-trust-strip__num { font-size: 28px; }
}

/* Final CTA */
.koll-final-cta { padding: 80px 0 100px; background: linear-gradient(180deg, #fff 0%, var(--bg, #faf6ec) 100%); }


/* ============================================================
   FAMILY TAXONOMY PAGES (/stil/{slug}/) — SEO mega edition
   ============================================================ */

/* Hero */
.koll-hero--family { padding: 56px 0 64px; border-bottom: 1px solid var(--line); }
.koll-hero__title { margin: 8px 0 18px; line-height: 1.05; }
.koll-hero__sub-title { display: inline-block; margin-top: 10px; font-family: var(--serif); font-style: italic; font-weight: 400; font-size: .68em; color: var(--ink-mute); }
.koll-hero__lede { max-width: 720px; margin: 0 0 24px; }
.koll-hero__stats { display: flex; flex-wrap: wrap; gap: 14px 28px; margin-top: 28px; padding-top: 24px; border-top: 1px solid var(--line); }
.koll-hero__stat { font-family: var(--mono, ui-monospace, monospace); font-size: 12.5px; letter-spacing: .03em; color: var(--ink-mute); }
.koll-hero__stat strong { display: inline-block; color: var(--ink); font-family: var(--serif); font-size: 17px; font-weight: 500; letter-spacing: 0; margin-right: 6px; }

/* Trust strip (compact, single line) */
.koll-trust-strip { padding: 18px 0; background: var(--ink, #1a1a1a); color: rgba(255,255,255,.78); font-size: 12.5px; }
.koll-trust-strip .container { padding: 0 24px; }
.koll-trust-list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 28px; justify-content: center; }
.koll-trust-list li { display: inline-flex; align-items: center; gap: 8px; }
.koll-trust-list li span { color: var(--gold, #d4af37); font-size: 8px; }

/* Generic section spacing */
.koll-section { padding: 72px 0; border-bottom: 1px solid rgba(0,0,0,.05); }
.koll-section__head { max-width: 760px; margin: 0 0 48px; }
.koll-section__head .display-2 { margin: 12px 0 14px; line-height: 1.12; }
.koll-section__sub { font-size: 16px; color: var(--ink-mute); max-width: 640px; margin: 0; }
.koll-section--grid { padding-top: 64px; padding-bottom: 80px; }

/* Characteristics 4-card grid */
.koll-characteristics { background: var(--bg-2, #faf6ec); }
.koll-char-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 32px; }
.koll-char-card { padding: 28px 4px 0; border-top: 2px solid var(--ink); }
.koll-char-card__h { font-family: var(--serif); font-size: 24px; font-weight: 500; line-height: 1.2; margin: 0 0 14px; color: var(--ink); }
.koll-char-card__t { font-size: 15.5px; line-height: 1.7; color: var(--ink-soft, #444); margin: 0; }

/* Use-cases 4-card grid */
.koll-uc-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 32px; }
.koll-uc-card { padding: 28px; border: 1px solid var(--line); border-radius: 4px; background: #fff; transition: border-color .2s, box-shadow .2s; }
.koll-uc-card:hover { border-color: var(--ink); box-shadow: 0 6px 20px rgba(0,0,0,.04); }
.koll-uc-card__icon { font-size: 36px; line-height: 1; margin-bottom: 14px; }
.koll-uc-card__h { font-family: var(--serif); font-size: 22px; font-weight: 500; line-height: 1.2; margin: 0 0 12px; }
.koll-uc-card__t { font-size: 15px; line-height: 1.65; color: var(--ink-soft, #444); margin: 0; }

/* Process numbered list (dark theme) */
.koll-process { background: var(--ink, #1a1a1a); color: #f5f0e1; }
.koll-process .display-2 { color: #f5f0e1; }
.koll-process .eyebrow { color: var(--gold, #d4af37); }
.koll-process-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 32px; max-width: 880px; }
.koll-process-step { display: grid; grid-template-columns: 84px 1fr; gap: 24px; align-items: start; padding: 24px 0; border-top: 1px solid rgba(255,255,255,.12); }
.koll-process-step:first-child { border-top: 0; padding-top: 0; }
.koll-process-step__no { font-family: var(--serif); font-size: 56px; font-weight: 300; line-height: 1; color: var(--gold, #d4af37); }
.koll-process-step__h { font-family: var(--serif); font-size: 22px; font-weight: 500; line-height: 1.2; margin: 0 0 10px; color: #fff; }
.koll-process-step__t { font-size: 15.5px; line-height: 1.7; color: rgba(255,255,255,.75); margin: 0; }

/* FAQ */
.koll-faq-list { display: grid; gap: 14px; max-width: 880px; }
.koll-faq-item { background: #fff; border: 1px solid var(--line); border-radius: 4px; overflow: hidden; transition: border-color .2s; }
.koll-faq-item[open] { border-color: var(--ink); }
.koll-faq-item__q { padding: 20px 56px 20px 24px; cursor: pointer; font-family: var(--serif); font-size: 18px; font-weight: 500; line-height: 1.35; color: var(--ink); list-style: none; position: relative; outline: none; }
.koll-faq-item__q::-webkit-details-marker { display: none; }
.koll-faq-item__q::after { content: "+"; position: absolute; right: 20px; top: 50%; transform: translateY(-50%); font-size: 28px; font-weight: 300; color: var(--ink-mute); transition: transform .2s; }
.koll-faq-item[open] .koll-faq-item__q::after { content: "\2212"; }
.koll-faq-item__a { padding: 0 24px 22px; }
.koll-faq-item__a > div { font-size: 15.5px; line-height: 1.75; color: var(--ink-soft, #444); }

/* Cross-link grid */
.koll-cross { background: var(--bg-2, #faf6ec); }
.koll-cross-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 18px; }
.koll-cross-card { display: flex; flex-direction: column; padding: 24px 18px; background: #fff; border: 1px solid var(--line); border-radius: 4px; text-decoration: none; transition: transform .15s, border-color .15s, box-shadow .15s; }
.koll-cross-card:hover { transform: translateY(-2px); border-color: var(--ink); box-shadow: 0 6px 20px rgba(0,0,0,.06); }
.koll-cross-label { font-family: var(--serif); font-size: 22px; font-weight: 500; color: var(--ink); margin-bottom: 4px; }
.koll-cross-sub { font-size: 13px; color: var(--ink-mute); margin-bottom: 12px; }
.koll-cross-count { margin-top: auto; font-family: var(--mono, ui-monospace, monospace); font-size: 11.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--gold-dark, #9d6e1f); }

/* CTA */
.koll-cta-section { padding: 80px 0 96px; background: linear-gradient(180deg, var(--bg, #fff) 0%, var(--bg-2, #faf6ec) 100%); border-bottom: 0; }
.koll-cta-buttons { display: flex; gap: 16px; justify-content: center; margin-top: 32px; flex-wrap: wrap; }

/* ============================================================
   RESPONSIVE 320 -> 1920+
   ============================================================ */

@media (max-width: 1100px) {
	.koll-cross-grid { grid-template-columns: repeat(3, 1fr); }
	.koll-process-step { grid-template-columns: 64px 1fr; gap: 20px; }
	.koll-process-step__no { font-size: 44px; }
}

@media (max-width: 880px) {
	.koll-section { padding: 56px 0; }
	.koll-section__head { margin-bottom: 36px; }
	.koll-hero--family { padding: 40px 0 48px; }
	.koll-hero__stats { gap: 10px 20px; padding-top: 20px; }
	.koll-hero__stat { font-size: 12px; }
	.koll-hero__stat strong { font-size: 15px; }
	.koll-char-grid, .koll-uc-grid { grid-template-columns: 1fr; gap: 24px; }
	.koll-char-card { padding-top: 22px; }
	.koll-char-card__h, .koll-uc-card__h { font-size: 20px; }
	.koll-trust-list { gap: 6px 18px; font-size: 11.5px; }
	.koll-cross-grid { grid-template-columns: repeat(2, 1fr); }
	.koll-process-step { grid-template-columns: 1fr; gap: 8px; }
	.koll-process-step__no { font-size: 36px; }
	.koll-process-step__h { font-size: 19px; }
	.koll-faq-item__q { font-size: 16px; padding: 18px 48px 18px 18px; }
	.koll-faq-item__a { padding: 0 18px 18px; }
	.koll-faq-item__a > div { font-size: 14.5px; }
	.koll-cta-buttons { flex-direction: column; align-items: stretch; max-width: 320px; margin-left: auto; margin-right: auto; }
}

@media (max-width: 540px) {
	.koll-section { padding: 44px 0; }
	.koll-hero__title { font-size: clamp(32px, 8vw, 44px); }
	.koll-section__head .display-2 { font-size: clamp(26px, 6.5vw, 36px); }
	.koll-trust-strip { padding: 14px 0; }
	.koll-trust-list { flex-direction: column; align-items: flex-start; gap: 6px; }
	.koll-uc-card { padding: 22px 18px; }
	.koll-uc-card__icon { font-size: 30px; }
	.koll-cross-grid { grid-template-columns: 1fr 1fr; gap: 12px; }
	.koll-cross-card { padding: 18px 14px; }
	.koll-cross-label { font-size: 18px; }
	.koll-cta-section { padding: 56px 0 64px; }
}

@media (max-width: 380px) {
	.koll-hero--family { padding: 32px 0 36px; }
	.koll-hero__stats { flex-direction: column; gap: 6px; }
	.koll-cross-grid { grid-template-columns: 1fr; }
	.koll-faq-item__q { font-size: 15px; padding: 16px 40px 16px 14px; }
	.koll-faq-item__q::after { right: 14px; font-size: 24px; }
}