/* nieruchomek — brand design system (self-hosted fonts + tokens).
   Direction "Ciepły ekspert": warm expert, honest about data gaps. */

/* ── Fonts (self-hosted woff2, latin + latin-ext) ─────────────────── */
@font-face { font-family: 'Bricolage Grotesque'; font-weight: 400; font-style: normal; font-display: swap;
  src: url('../fonts/bricolage-400-ext.woff2') format('woff2'); unicode-range: U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: 'Bricolage Grotesque'; font-weight: 400; font-style: normal; font-display: swap;
  src: url('../fonts/bricolage-400-latin.woff2') format('woff2'); }
@font-face { font-family: 'Bricolage Grotesque'; font-weight: 600; font-style: normal; font-display: swap;
  src: url('../fonts/bricolage-600-ext.woff2') format('woff2'); unicode-range: U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: 'Bricolage Grotesque'; font-weight: 600; font-style: normal; font-display: swap;
  src: url('../fonts/bricolage-600-latin.woff2') format('woff2'); }
@font-face { font-family: 'Bricolage Grotesque'; font-weight: 700; font-style: normal; font-display: swap;
  src: url('../fonts/bricolage-700-ext.woff2') format('woff2'); unicode-range: U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: 'Bricolage Grotesque'; font-weight: 700; font-style: normal; font-display: swap;
  src: url('../fonts/bricolage-700-latin.woff2') format('woff2'); }
@font-face { font-family: 'Bricolage Grotesque'; font-weight: 800; font-style: normal; font-display: swap;
  src: url('../fonts/bricolage-800-ext.woff2') format('woff2'); unicode-range: U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: 'Bricolage Grotesque'; font-weight: 800; font-style: normal; font-display: swap;
  src: url('../fonts/bricolage-800-latin.woff2') format('woff2'); }

@font-face { font-family: 'Manrope'; font-weight: 400; font-style: normal; font-display: swap;
  src: url('../fonts/manrope-400-ext.woff2') format('woff2'); unicode-range: U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: 'Manrope'; font-weight: 400; font-style: normal; font-display: swap;
  src: url('../fonts/manrope-400-latin.woff2') format('woff2'); }
@font-face { font-family: 'Manrope'; font-weight: 500; font-style: normal; font-display: swap;
  src: url('../fonts/manrope-500-ext.woff2') format('woff2'); unicode-range: U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: 'Manrope'; font-weight: 500; font-style: normal; font-display: swap;
  src: url('../fonts/manrope-500-latin.woff2') format('woff2'); }
@font-face { font-family: 'Manrope'; font-weight: 600; font-style: normal; font-display: swap;
  src: url('../fonts/manrope-600-ext.woff2') format('woff2'); unicode-range: U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: 'Manrope'; font-weight: 600; font-style: normal; font-display: swap;
  src: url('../fonts/manrope-600-latin.woff2') format('woff2'); }
@font-face { font-family: 'Manrope'; font-weight: 700; font-style: normal; font-display: swap;
  src: url('../fonts/manrope-700-ext.woff2') format('woff2'); unicode-range: U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: 'Manrope'; font-weight: 700; font-style: normal; font-display: swap;
  src: url('../fonts/manrope-700-latin.woff2') format('woff2'); }
@font-face { font-family: 'Manrope'; font-weight: 800; font-style: normal; font-display: swap;
  src: url('../fonts/manrope-800-ext.woff2') format('woff2'); unicode-range: U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: 'Manrope'; font-weight: 800; font-style: normal; font-display: swap;
  src: url('../fonts/manrope-800-latin.woff2') format('woff2'); }

@font-face { font-family: 'IBM Plex Mono'; font-weight: 400; font-style: normal; font-display: swap;
  src: url('../fonts/plexmono-400-ext.woff2') format('woff2'); unicode-range: U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: 'IBM Plex Mono'; font-weight: 400; font-style: normal; font-display: swap;
  src: url('../fonts/plexmono-400-latin.woff2') format('woff2'); }
@font-face { font-family: 'IBM Plex Mono'; font-weight: 500; font-style: normal; font-display: swap;
  src: url('../fonts/plexmono-500-ext.woff2') format('woff2'); unicode-range: U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: 'IBM Plex Mono'; font-weight: 500; font-style: normal; font-display: swap;
  src: url('../fonts/plexmono-500-latin.woff2') format('woff2'); }

/* ── Design tokens ────────────────────────────────────────────────── */
:root {
  --zielen:   #2F6B4F;  /* primary — buttons, accents, OK scores */
  --atrament: #1E2A22;  /* text, dark panels, primary hover */
  --krem:     #F7F4EC;  /* page background, text on dark */
  --szalwia:  #E7ECDD;  /* tints: tags, badges, score tracks, "did you know" */
  --miod:     #C98A2E;  /* promo accent ("0 zł"), in-progress state */
  --terakota: #B4552D;  /* risks, low scores, warnings */
  --tekst-2:  #5B6A60;  /* secondary text */
  --tekst-3:  #6B7A6F;
  --mono-lbl: #8A9388;  /* mono labels */
  --linia:    rgba(30,42,34,.12);
}

/* ── Base ─────────────────────────────────────────────────────────── */
html, body {
  font-family: 'Manrope', ui-sans-serif, system-ui, "Segoe UI", Roboto, sans-serif;
  background: var(--krem);
  color: var(--atrament);
}
.font-display { font-family: 'Bricolage Grotesque', 'Manrope', sans-serif; letter-spacing: -0.02em; }
.font-mono-label {
  font-family: 'IBM Plex Mono', ui-monospace, monospace;
  letter-spacing: .1em; text-transform: uppercase; color: var(--mono-lbl);
}

/* ── Components ────────────────────────────────────────────────────── */
.btn-primary {
  display: inline-flex; align-items: center; gap: .4em; justify-content: center;
  background: var(--zielen); color: var(--krem); font-weight: 800;
  border-radius: 99px; padding: 13px 24px; transition: background .15s ease;
  border: none; cursor: pointer; text-decoration: none; line-height: 1;
}
.btn-primary:hover { background: var(--atrament); color: var(--krem); }
.btn-primary:disabled { opacity: .5; cursor: not-allowed; }
.btn-secondary {
  display: inline-flex; align-items: center; gap: .4em; justify-content: center;
  background: #fff; color: var(--atrament); font-weight: 800;
  border-radius: 99px; padding: 12px 22px; border: 1.5px solid rgba(30,42,34,.25);
  transition: border-color .15s ease; cursor: pointer; text-decoration: none; line-height: 1;
}
.btn-secondary:hover { border-color: var(--zielen); color: var(--atrament); }
.chip {
  display: inline-flex; align-items: center; gap: .4em;
  border-radius: 99px; padding: 8px 16px; font-size: 13px; font-weight: 800;
  border: 1.5px solid rgba(30,42,34,.2); background: #fff; cursor: pointer;
}
.chip--active { border-color: var(--zielen); color: var(--zielen); background: var(--szalwia); }
.tag {
  display: inline-flex; align-items: center; gap: .35em;
  background: var(--szalwia); color: var(--zielen);
  font-size: 12px; font-weight: 800; padding: 6px 12px; border-radius: 99px;
}
.card {
  background: #fff; border: 1px solid rgba(30,42,34,.1); border-radius: 16px;
}
.brand-logo-mark {
  display: grid; place-items: center; background: var(--zielen); border-radius: 8px;
}
.brand-logo-mark > i {
  display: block; background: var(--krem); transform: rotate(45deg); border-radius: 2px;
}

.maplibregl-popup-content { font-size: 13px; }
