/* @fonts exo-2:400,500,600,700 */
/*
 * Motyw „Petrol” — energetyka, instalacje, fotowoltaika, biura inżynierskie.
 * Jasna szarość tła, białe karty, ciemny niebieskozielony petrol w nagłówku, przyciskach i stopce,
 * dyskretna żółć tylko w cienkich liniach i wyróżnieniach. Jeden techniczny krój: Exo 2.
 */
:root {
  --font-body: "Exo 2", "Segoe UI", system-ui, sans-serif;
  --font-display: "Exo 2", "Segoe UI", system-ui, sans-serif;
  --display-weight: 700;
  --display-tracking: -0.01em;

  --bg: #eef0f1;
  --surface: #ffffff;
  --surface-2: #e0e4e6;
  --border: #cbd2d5;
  --border-strong: #84929a;
  --text: #0f2227;
  --text-2: #2c4249;
  --muted: #44595f;

  --primary: #0e4a55;
  --primary-ink: #ffffff;
  --primary-soft: #d3e6ea;
  --link: #0e4a55;

  --accent: #f2c230;
  --accent-ink: #3d2f00;
  --accent-soft: #fbf0c4;
  --accent-on: #1f1800;

  --ok: #14633f;
  --danger: #a3261c;

  --header-bg: #0e3f49;
  --header-text: #f0f5f6;
  --header-border: #23606c;

  --hero-bg: #e0e4e6;
  --hero-text: #0f2227;
  --hero-muted: #2c4249;

  --footer-bg: #0a2a31;
  --footer-text: #d3e2e5;
  --footer-muted: #8fadb3;
  --footer-border: rgba(255, 255, 255, .14);
  --footer-heading: #f2c230;

  --radius: 3px;
  --radius-lg: 6px;
  --shadow: 0 1px 2px rgba(10, 42, 49, .06), 0 12px 26px -18px rgba(10, 42, 49, .4);
}

/* żółta kreska pod petrolowym nagłówkiem — jak oznaczenie przewodu */
.site-header { border-bottom: 3px solid var(--accent); }
.site-header :focus-visible, .site-header .input:focus { outline-color: var(--accent); }
/* przycisk szukania w nagłówku w kolorze akcentu — kolor marki zlewa się z tłem nagłówka */
.site-header .btn--primary { background: var(--accent); border-color: var(--accent); color: var(--accent-on); }
.btn { font-weight: 600; }
.chip, .badge { border-radius: var(--radius); }
.hero { border-bottom: 1px solid var(--border-strong); }
.entry-table th { border-bottom-color: var(--primary); }
.site-footer :focus-visible, .site-footer .input:focus { outline-color: var(--footer-text); }
