/* ===================================================
   BLUNI.PL – Design System v2  |  ciemny motyw
   =================================================== */

/* Font Awesome – font-display:swap override (zanim FA CSS async się załaduje) */
@font-face {
  font-family: "Font Awesome 6 Free";
  font-style: normal; font-weight: 900; font-display: swap;
  src: url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/webfonts/fa-solid-900.woff2') format('woff2');
}
@font-face {
  font-family: "Font Awesome 6 Free";
  font-style: normal; font-weight: 400; font-display: swap;
  src: url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/webfonts/fa-regular-400.woff2') format('woff2');
}
@font-face {
  font-family: "Font Awesome 6 Brands";
  font-style: normal; font-weight: 400; font-display: swap;
  src: url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/webfonts/fa-brands-400.woff2') format('woff2');
}

/* ─── Zmienne ─── */
:root {
  --brand:        #BE0E2C;
  --brand-light:  #e0102e;
  --brand-glow:   rgba(190,14,44,.22);
  --bg:           #0d0f12;
  --bg-2:         #111418;
  --card:         #161920;
  --card-2:       #1c2028;
  --border:       rgba(255,255,255,.08);
  --border-red:   rgba(190,14,44,.35);
  --text:         #f0f2f5;
  --text-2:       #c8cdd5;
  --muted:        #7a8290;
  --radius:       16px;
  --radius-sm:    10px;
  --shadow:       0 8px 32px rgba(0,0,0,.45);
  --shadow-brand: 0 6px 24px rgba(190,14,44,.35);
  --trans:        .3s cubic-bezier(.4,0,.2,1);
  --nav-h:        68px;
  --max-w:        1200px;
  --font:         'Montserrat', system-ui, -apple-system, sans-serif;
}

/* ─── Reset ─── */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0 }
html { scroll-behavior:smooth; scroll-padding-top:var(--nav-h) }
body {
  font-family: var(--font);
  background: var(--bg);
  color: var(--text);
  line-height: 1.65;
  min-height: 100vh;
  overflow-x: hidden;
}
img { max-width:100%; display:block }
a   { color:inherit; text-decoration:none }
ul,ol { list-style:none }

/* ─── Utilities ─── */
.container { width:min(var(--max-w),92%); margin-inline:auto }
.text-brand          { color:var(--brand) }
.text-muted          { color:var(--muted) }
.text-gradient-brand {
  background: linear-gradient(135deg, var(--brand-light), #ff4d6d);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}

.section      { padding:80px 0 }
.section-alt  { background:var(--bg-2); border-block:1px solid var(--border) }
.section-tight{ padding:48px 0 }

.section-label {
  display:inline-flex; align-items:center; gap:8px;
  font-size:11px; font-weight:700; letter-spacing:2px; text-transform:uppercase;
  color:var(--brand); margin-bottom:12px;
}
.section-label::before {
  content:''; display:block; width:24px; height:2px;
  background:var(--brand); border-radius:2px;
}

.section-head          { margin-bottom:40px }
.section-head h2       { font-size:clamp(1.8rem,3.5vw,2.6rem); font-weight:800; line-height:1.1; margin-bottom:10px }
.section-head p        { color:var(--muted); max-width:620px; font-size:15px }

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

/* ─── Buttons ─── */
.btn {
  display:inline-flex; align-items:center; gap:9px;
  padding:13px 22px; border-radius:var(--radius-sm);
  font-family:var(--font); font-size:14px; font-weight:700;
  border:1px solid transparent; cursor:pointer; transition:var(--trans);
  white-space:nowrap;
}
.btn-primary  { background:var(--brand); color:#fff; border-color:var(--brand); box-shadow:var(--shadow-brand) }
.btn-primary:hover  { background:var(--brand-light); box-shadow:0 8px 32px rgba(190,14,44,.5); transform:translateY(-1px) }
.btn-outline  { border-color:var(--border); color:var(--text); background:rgba(255,255,255,.04) }
.btn-outline:hover  { border-color:rgba(255,255,255,.2); background:rgba(255,255,255,.08) }
.btn-white    { background:#fff; color:var(--brand); border-color:transparent; font-weight:800 }
.btn-white:hover    { background:rgba(255,255,255,.9); transform:translateY(-1px) }
.btn-lg { padding:15px 28px; font-size:15px }

/* ─── Card ─── */
.card {
  background:var(--card); border:1px solid var(--border);
  border-radius:var(--radius); padding:24px;
  transition:border-color var(--trans), box-shadow var(--trans), transform var(--trans);
}
.card:hover { border-color:var(--border-red); box-shadow:0 12px 40px rgba(190,14,44,.12); transform:translateY(-2px) }
.card-icon {
  width:52px; height:52px; display:flex; align-items:center; justify-content:center;
  border-radius:12px; background:rgba(190,14,44,.12); color:var(--brand);
  font-size:22px; margin-bottom:16px;
}

/* ─── Badge ─── */
.badge {
  display:inline-flex; align-items:center; gap:6px;
  padding:5px 12px; border-radius:999px; font-size:11px; font-weight:700;
  background:rgba(190,14,44,.1); color:var(--brand); border:1px solid rgba(190,14,44,.2);
}

/* ─── Form inputs ─── */
.input {
  width:100%; padding:12px 14px;
  background:var(--card-2); border:1px solid var(--border);
  border-radius:var(--radius-sm); color:var(--text);
  font-family:var(--font); font-size:14px;
  transition:border-color var(--trans); outline:none;
}
.input:focus { border-color:var(--brand); box-shadow:0 0 0 3px rgba(190,14,44,.12) }
.input::placeholder { color:var(--muted) }
label { font-size:13px; font-weight:600; color:var(--text-2); display:grid; gap:6px }
textarea.input { resize:vertical; min-height:120px }
select.input { cursor:pointer }

/* ══════════════════════════════════════════════
   NAVBAR
══════════════════════════════════════════════ */
/* Rezerwacja miejsca pod navbar wstrzykiwany async z partiala – zapobiega CLS */
#site-header { display:block; min-height:var(--nav-h) }

.navbar {
  position:sticky; top:0; z-index:100; height:var(--nav-h);
  background:rgba(13,15,18,.82);
  backdrop-filter:blur(18px) saturate(200%);
  -webkit-backdrop-filter:blur(18px) saturate(200%);
  border-bottom:1px solid var(--border);
  transition:background var(--trans), box-shadow var(--trans);
}
.navbar.scrolled { background:rgba(13,15,18,.97); box-shadow:0 2px 32px rgba(0,0,0,.55) }
.navbar-inner {
  display:flex; align-items:center; justify-content:space-between; height:100%; gap:16px;
}
.nav-brand { display:flex; align-items:center; gap:12px; flex-shrink:0 }
.nav-logo   { height:38px; width:auto }
.nav-ew     { height:26px; width:auto; opacity:.85 }
.nav-sep    { width:1px; height:26px; background:var(--border); flex-shrink:0 }
.nav-links  { display:flex; align-items:center; gap:4px }
.nav-links a {
  padding:8px 12px; border-radius:var(--radius-sm);
  font-size:14px; font-weight:600; color:var(--muted);
  transition:color var(--trans), background var(--trans);
}
.nav-links a:hover, .nav-links a.active { color:var(--text); background:rgba(255,255,255,.06) }
.nav-cta {
  margin-left:8px !important;
  padding:8px 16px !important;
  background:var(--brand) !important;
  color:#fff !important;
  border-radius:var(--radius-sm) !important;
  font-weight:700 !important;
}
.nav-cta:hover { background:var(--brand-light) !important; color:#fff !important }

.nav-toggle {
  display:none; background:none; border:1px solid var(--border);
  color:var(--text); width:40px; height:40px; border-radius:var(--radius-sm);
  font-size:17px; align-items:center; justify-content:center; cursor:pointer;
  transition:border-color var(--trans), background var(--trans);
}
.nav-toggle:hover { background:rgba(255,255,255,.06); border-color:rgba(255,255,255,.15) }

/* ══════════════════════════════════════════════
   HERO
══════════════════════════════════════════════ */
.hero {
  position:relative; min-height:calc(100vh - var(--nav-h));
  display:flex; flex-direction:column;
  align-items:center; justify-content:center;
  text-align:center; padding:80px 0 60px; overflow:hidden;
}
#hero-canvas {
  position:absolute; inset:0; z-index:0; width:100%; height:100%;
  pointer-events:none;
}
.hero-content { position:relative; z-index:1; width:100% }

.hero-logos {
  display:flex; align-items:center; justify-content:center; gap:20px; margin-bottom:32px;
}
.hero-logos .logo-sep { width:1px; height:36px; background:var(--border) }
.hero-logo-main { height:52px; width:auto }
.hero-logo-ew   { height:36px; width:auto; opacity:.85 }

.hero-eyebrow {
  display:inline-flex; align-items:center; gap:10px;
  font-size:11px; font-weight:700; letter-spacing:2.5px; text-transform:uppercase;
  color:var(--brand); margin-bottom:18px;
}
.hero-eyebrow::before, .hero-eyebrow::after {
  content:''; display:block; height:1px; width:28px; background:var(--brand);
}

h1.hero-title {
  font-size:clamp(2.4rem,6vw,5rem); font-weight:900;
  line-height:1.05; margin-bottom:18px; letter-spacing:-1px;
}

.hero-subtitle {
  font-size:clamp(1rem,2.5vw,1.4rem);
  color:var(--muted); margin-bottom:36px; min-height:2.2em;
}
.hero-subtitle .typed-text { color:var(--text-2) }
.cursor {
  display:inline-block; width:2px; height:1em;
  background:var(--brand); margin-left:2px;
  vertical-align:text-bottom; animation:blink .75s step-end infinite;
}
@keyframes blink { 0%,100%{opacity:1} 50%{opacity:0} }

.hero-actions {
  display:flex; gap:12px; justify-content:center; flex-wrap:wrap; margin-bottom:52px;
}

.hero-stats {
  display:inline-flex; gap:48px; justify-content:center; flex-wrap:wrap;
  padding:26px 48px;
  background:var(--card);
  border:1px solid var(--border);
  border-radius:var(--radius);
  backdrop-filter:blur(8px);
}
.stat-item  { text-align:center }
.stat-num   { font-size:2.4rem; font-weight:900; color:var(--brand); line-height:1; margin-bottom:4px }
.stat-label { font-size:11px; color:var(--muted); font-weight:600; text-transform:uppercase; letter-spacing:.5px }

/* ══════════════════════════════════════════════
   DIVISIONS (sklep + serwis)
══════════════════════════════════════════════ */
.divisions { display:grid; grid-template-columns:1fr 1fr; gap:20px }

.division-card {
  background:var(--card); border:1px solid var(--border);
  border-radius:var(--radius); padding:36px 32px;
  transition:var(--trans); position:relative; overflow:hidden;
}
.division-card::before {
  content:''; position:absolute; top:0; left:0;
  width:100%; height:3px; background:var(--brand);
  transform:scaleX(0); transform-origin:left; transition:transform .4s ease;
}
.division-card:hover::before { transform:scaleX(1) }
.division-card:hover { border-color:rgba(190,14,44,.3); box-shadow:0 16px 48px rgba(190,14,44,.1); transform:translateY(-3px) }

.division-num  { font-size:72px; font-weight:900; color:rgba(255,255,255,.03); line-height:1; margin-bottom:4px }
.division-icon { font-size:32px; color:var(--brand); margin-bottom:16px }
.division-card h3 { font-size:1.4rem; font-weight:800; margin-bottom:10px }
.division-card > p { color:var(--muted); font-size:14px; margin-bottom:20px }
.division-card ul  { display:grid; gap:7px; margin-bottom:24px }
.division-card ul li {
  display:flex; align-items:center; gap:10px;
  font-size:14px; color:var(--text-2);
}
.division-card ul li::before {
  content:''; flex-shrink:0; width:6px; height:6px;
  border-radius:50%; background:var(--brand);
}
.division-address {
  display:flex; align-items:flex-start; gap:8px;
  font-size:13px; color:var(--muted); margin-top:8px;
}
.division-address i { color:var(--brand); margin-top:2px; flex-shrink:0 }

/* ══════════════════════════════════════════════
   SERVICES GRID
══════════════════════════════════════════════ */
.services-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px }

.service-card {
  background:var(--card); border:1px solid var(--border);
  border-radius:var(--radius); padding:24px;
  transition:var(--trans); position:relative; overflow:hidden;
}
.service-card::after {
  content:''; position:absolute; inset:0;
  background:radial-gradient(380px circle at var(--mx,50%) var(--my,50%), rgba(190,14,44,.07), transparent 65%);
  opacity:0; transition:opacity .3s;
}
.service-card:hover::after  { opacity:1 }
.service-card:hover { border-color:rgba(190,14,44,.35); transform:translateY(-3px); box-shadow:0 12px 36px rgba(0,0,0,.4) }
.service-card h3   { font-size:.95rem; font-weight:700; margin-bottom:8px }
.service-card p    { font-size:13px; color:var(--muted); line-height:1.65 }

/* ══════════════════════════════════════════════
   EUROWARSZTAT SECTION
══════════════════════════════════════════════ */
.ew-section {
  padding:80px 0;
  background:linear-gradient(135deg,rgba(190,14,44,.07) 0%,transparent 60%);
  border-block:1px solid rgba(190,14,44,.12);
}
.ew-inner { display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:center }

.ew-logo-wrap { display:flex; align-items:center; gap:16px; margin-bottom:20px }
.ew-logo      { height:50px; width:auto }
.ew-inner h2  { font-size:clamp(1.6rem,3vw,2.4rem); font-weight:800; margin-bottom:14px }
.ew-inner > div > p { color:var(--muted); font-size:15px; margin-bottom:28px }

.ew-features      { display:grid; gap:14px }
.ew-feature       { display:flex; align-items:flex-start; gap:14px }
.ew-feature-icon  {
  flex-shrink:0; width:40px; height:40px;
  display:flex; align-items:center; justify-content:center;
  border-radius:10px; background:rgba(190,14,44,.12);
  color:var(--brand); font-size:16px;
}
.ew-feature-text h3 { font-size:14px; font-weight:700; margin-bottom:3px }
.ew-feature-text p  { font-size:13px; color:var(--muted) }

.ew-right { display:grid; grid-template-columns:1fr 1fr; gap:14px }
.ew-stat-card {
  background:var(--card); border:1px solid var(--border);
  border-radius:var(--radius); padding:28px 20px; text-align:center;
  transition:var(--trans);
}
.ew-stat-card:hover { border-color:var(--border-red) }
.ew-stat-num   { font-size:2.2rem; font-weight:900; color:var(--brand); margin-bottom:6px }
.ew-stat-label { font-size:12px; color:var(--muted); font-weight:600 }

/* ══════════════════════════════════════════════
   BRAND MARQUEE
══════════════════════════════════════════════ */
.marquee-section { padding:48px 0; border-block:1px solid var(--border); overflow:hidden }
.marquee-label {
  text-align:center; font-size:11px; font-weight:700;
  letter-spacing:2px; text-transform:uppercase; color:var(--muted); margin-bottom:28px;
}
.marquee-track-wrap { overflow:hidden; position:relative }
.marquee-track-wrap::before, .marquee-track-wrap::after {
  content:''; position:absolute; top:0; bottom:0; width:100px; z-index:2;
}
.marquee-track-wrap::before { left:0;  background:linear-gradient(to right,var(--bg),transparent) }
.marquee-track-wrap::after  { right:0; background:linear-gradient(to left,var(--bg),transparent) }

.marquee-track {
  display:flex; gap:56px; align-items:center;
  animation:marquee 28s linear infinite;
  width:max-content;
}
.marquee-track:hover { animation-play-state:paused }
.marquee-track img {
  height:34px; width:auto;
  transition:transform .3s;
}
.marquee-track img:hover { transform:scale(1.08) }

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

/* ══════════════════════════════════════════════
   STEPS
══════════════════════════════════════════════ */
.steps-grid { display:grid; gap:12px }
.step-item {
  display:flex; gap:18px; align-items:flex-start;
  background:var(--card); border:1px solid var(--border);
  border-radius:var(--radius); padding:18px 22px; transition:var(--trans);
}
.step-item:hover { border-color:var(--border-red) }
.step-num {
  flex-shrink:0; width:38px; height:38px;
  display:flex; align-items:center; justify-content:center;
  border-radius:50%; background:var(--brand); color:#fff; font-weight:900; font-size:14px;
}
.step-item h3 { font-size:14px; font-weight:700; margin-bottom:3px }
.step-item p  { font-size:13px; color:var(--muted) }

/* ══════════════════════════════════════════════
   HISTORIA CTA CARD
══════════════════════════════════════════════ */
.historia-cta {
  background:linear-gradient(135deg,var(--card),var(--card-2));
  border:1px solid var(--border); border-radius:var(--radius); padding:36px 40px;
  display:flex; align-items:center; justify-content:space-between; gap:24px;
}
.historia-cta-icon { font-size:48px; color:var(--brand); flex-shrink:0 }
.historia-cta h2   { font-size:1.3rem; font-weight:800; margin-bottom:8px }
.historia-cta p    { color:var(--muted); font-size:13px }

/* ══════════════════════════════════════════════
   TESTIMONIALS
══════════════════════════════════════════════ */
.testimonials-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px }
.t-card {
  background:var(--card); border:1px solid var(--border);
  border-radius:var(--radius); padding:24px; transition:var(--trans);
  position:relative;
}
.t-card::before {
  content:'\201C'; position:absolute; top:10px; right:18px;
  font-size:80px; color:var(--brand); opacity:.1; font-family:Georgia,serif; line-height:1;
}
.t-card:hover  { border-color:var(--border-red) }
.t-stars       { color:var(--brand); font-size:14px; margin-bottom:10px; letter-spacing:2px }
.t-text        { font-size:14px; color:var(--text-2); line-height:1.7; margin-bottom:16px; font-style:italic }
.t-author      { display:flex; align-items:center; gap:10px }
.t-avatar {
  width:36px; height:36px; border-radius:50%; background:var(--brand);
  display:flex; align-items:center; justify-content:center;
  font-weight:800; font-size:14px; color:#fff; flex-shrink:0;
}
.t-name   { font-weight:700; font-size:13px }
.t-source { font-size:12px; color:var(--muted) }

/* ══════════════════════════════════════════════
   CONTACT STRIP
══════════════════════════════════════════════ */
/* ── services garantees strip ── */
.services-guarantees {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: 12px;
  margin-top: 32px;
}
.services-guarantees > div {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 14px 18px;
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 13px;
  line-height: 1.4;
}
.services-guarantees i { font-size: 18px; flex-shrink: 0; }

/* ── VIN highlight ── */
.vin-highlight {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 24px;
  background: var(--card);
  border: 1px solid var(--border);
  border-left: 4px solid var(--brand);
  border-radius: var(--radius);
  padding: 24px 28px;
  margin-top: 32px;
}
.vin-highlight-icon { font-size: 2.2rem; color: var(--brand); }
.vin-highlight h3   { font-size: 1rem; font-weight: 700; margin: 0 0 6px; }
.vin-highlight p    { color: var(--muted); font-size: 13px; margin: 0; }

@media (max-width: 900px) {
  .services-guarantees { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
  .services-guarantees { grid-template-columns: 1fr; }
  .vin-highlight { grid-template-columns: 1fr; }
  .vin-highlight-icon { display: none; }
}

.contact-strip { background:var(--brand); padding:48px 0; color:#fff }
.contact-strip-inner {
  display:flex; align-items:center; justify-content:space-between;
  flex-wrap:wrap; gap:24px;
}
.contact-info     { display:flex; gap:40px; flex-wrap:wrap }
.contact-item     { display:flex; align-items:center; gap:14px }
.contact-item i   { font-size:22px; opacity:.85 }
.ci-label         { font-size:11px; font-weight:600; opacity:.9; text-transform:uppercase; letter-spacing:.5px }
.ci-value         { font-size:15px; font-weight:700 }
.ci-value a       { color:inherit }

/* ══════════════════════════════════════════════
   FOOTER
══════════════════════════════════════════════ */
.footer { background:var(--bg-2); border-top:1px solid var(--border); padding:52px 0 28px }
.footer-grid {
  display:grid; grid-template-columns:2fr 1fr 1fr; gap:48px; margin-bottom:40px;
}
.footer-logo  { height:34px; width:auto; margin-bottom:14px }
.footer-desc  { font-size:13px; color:var(--muted); line-height:1.75; max-width:290px }
.footer-ew    { height:22px; width:auto; margin-top:18px; opacity:.55 }

.footer-col h3 {
  font-size:11px; font-weight:700; text-transform:uppercase;
  letter-spacing:1.5px; color:var(--muted); margin-bottom:16px;
}
.footer-col ul     { display:grid; gap:9px }
.footer-col ul a   { font-size:13px; color:var(--text-2); transition:color .2s }
.footer-col ul a:hover { color:var(--brand) }
.footer-col address {
  font-style:normal; font-size:13px; color:var(--text-2); line-height:1.85;
}
.footer-col address a         { transition:color .2s }
.footer-col address a:hover   { color:var(--brand) }

.footer-bottom {
  border-top:1px solid var(--border); padding-top:20px;
  display:flex; align-items:center; justify-content:space-between;
  flex-wrap:wrap; gap:10px;
}
.footer-bottom p   { font-size:12px; color:var(--muted) }
.footer-bottom a   { color:var(--muted); text-decoration:underline; transition:color .2s }
.footer-bottom a:hover { color:var(--text) }
.footer-seo {
  font-size:11px; color:rgba(255,255,255,.07); line-height:1.6; margin-top:12px;
}

/* ══════════════════════════════════════════════
   COOKIE BANNER
══════════════════════════════════════════════ */
.cookies-banner {
  position:fixed; bottom:0; left:0; right:0; z-index:999;
  background:var(--card-2); border-top:1px solid var(--border);
  padding:14px; display:none;
}
.cookies-inner {
  max-width:var(--max-w); margin:0 auto;
  display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;
}
.cookies-inner p { font-size:13px; color:var(--muted); flex:1 }
.cookies-inner a { color:var(--brand); text-decoration:underline }
.cookies-btn {
  padding:9px 18px; background:var(--brand); color:#fff; border:none;
  border-radius:var(--radius-sm); font-size:13px; font-weight:700;
  cursor:pointer; font-family:var(--font);
}

/* ══════════════════════════════════════════════
   REVEAL ANIMATIONS
══════════════════════════════════════════════ */
.reveal {
  opacity:0; transform:translateY(22px);
  transition:opacity .65s ease, transform .65s ease;
}
.reveal.visible { opacity:1; transform:none }

.reveal-left {
  opacity:0; transform:translateX(-22px);
  transition:opacity .65s ease, transform .65s ease;
}
.reveal-left.visible { opacity:1; transform:none }

.delay-1  { transition-delay:.08s }
.delay-2  { transition-delay:.16s }
.delay-3  { transition-delay:.24s }
.delay-4  { transition-delay:.32s }
.delay-5  { transition-delay:.40s }

/* ══════════════════════════════════════════════
   PAGE HERO (podstrony)
══════════════════════════════════════════════ */
.page-hero {
  padding:56px 0 40px;
  background:var(--bg-2); border-bottom:1px solid var(--border);
}
.page-hero h1   { font-size:clamp(2rem,4vw,3rem); font-weight:900; margin-bottom:8px }
.page-hero p    { color:var(--muted); font-size:15px; max-width:580px }
.breadcrumb     { display:flex; align-items:center; gap:8px; font-size:13px; color:var(--muted); margin-bottom:14px }
.breadcrumb a   { color:var(--muted); transition:color .2s }
.breadcrumb a:hover { color:var(--text) }
.breadcrumb i   { font-size:10px }

/* ══════════════════════════════════════════════
   HISTORIA POJAZDU
══════════════════════════════════════════════ */
.historia-input-row { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:16px }
#historia-error {
  background:rgba(190,14,44,.1); border:1px solid rgba(190,14,44,.3);
  border-radius:var(--radius-sm); color:#ff6b6b; padding:12px 16px; font-size:14px;
  margin-top:12px; display:none;
}
.historia-list { display:flex; flex-direction:column; gap:12px; margin-top:20px }
.historia-item {
  background:var(--card-2); border:1px solid var(--border);
  border-radius:var(--radius-sm); padding:16px 18px;
}
.historia-top {
  display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:10px;
}
.historia-number { font-weight:700; font-size:15px }
.historia-date   { font-size:13px; color:var(--muted); margin-top:2px }
.badge-status {
  display:inline-flex; align-items:center; padding:3px 10px;
  border-radius:999px; font-size:11px; font-weight:700; border:1px solid;
}
.badge-wydane      { background:rgba(56,217,169,.1);  border-color:rgba(56,217,169,.3);  color:#38d9a9 }
.badge-nowe,
.badge-w_trakcie   { background:rgba(51,154,240,.1);  border-color:rgba(51,154,240,.3);  color:#339af0 }
.badge-anulowane   { background:rgba(255,135,135,.1); border-color:rgba(255,135,135,.3); color:#ff8787 }
.historia-details  { font-size:13px; color:var(--muted); line-height:1.75 }
.historia-details strong { color:var(--text-2) }
.historia-desc     { margin-top:6px }

/* MAP */
.map-wrap { border-radius:var(--radius); overflow:hidden; border:1px solid var(--border) }
.map-wrap iframe { width:100%; height:340px; border:0; display:block }

/* KONTAKT strona */
.contact-grid { display:grid; grid-template-columns:1.1fr .9fr; gap:20px }
.contact-card-item { display:flex; align-items:center; gap:14px; padding:12px 0; border-bottom:1px solid var(--border) }
.contact-card-item:last-child { border:none }
.contact-card-item i { font-size:18px; color:var(--brand); width:20px; text-align:center }
.contact-card-item .cci-label { font-size:12px; color:var(--muted); font-weight:600 }
.contact-card-item .cci-val   { font-size:14px; font-weight:700 }
.contact-card-item .cci-val a { transition:color .2s }
.contact-card-item .cci-val a:hover { color:var(--brand) }

/* ══════════════════════════════════════════════
   RESPONSIVE
══════════════════════════════════════════════ */
@media (max-width:1024px) {
  .services-grid { grid-template-columns:repeat(2,1fr) }
  .ew-inner      { grid-template-columns:1fr; gap:40px }
  .ew-right      { grid-template-columns:repeat(4,1fr) }
  .footer-grid   { grid-template-columns:1fr 1fr }
}

@media (max-width:768px) {
  /* mobile nav */
  .nav-links {
    display:none; position:absolute; inset:var(--nav-h) 0 auto 0;
    flex-direction:column; background:rgba(13,15,18,.98);
    border-bottom:1px solid var(--border);
    padding:12px; gap:4px; backdrop-filter:blur(12px);
  }
  .nav-links.open { display:flex }
  .nav-links a    { padding:12px 16px; width:100%; border-radius:var(--radius-sm) }
  .nav-cta        { margin-left:0 !important }
  .nav-toggle     { display:flex }

  .hero-stats       { gap:24px; padding:20px 24px }
  .stat-num         { font-size:1.8rem }

  .divisions        { grid-template-columns:1fr }
  .services-grid    { grid-template-columns:1fr }
  .testimonials-grid{ grid-template-columns:1fr }
  .ew-right         { grid-template-columns:1fr 1fr }

  .historia-cta     { flex-direction:column; text-align:center; padding:28px 20px }
  .historia-cta-icon{ font-size:36px }
  .historia-input-row { grid-template-columns:1fr }

  .contact-strip-inner { flex-direction:column; text-align:center }
  .contact-info     { justify-content:center }

  .footer-grid      { grid-template-columns:1fr }
  .contact-grid     { grid-template-columns:1fr }
  .section          { padding:56px 0 }
  .grid-2,.grid-3   { grid-template-columns:1fr }
}

@media (max-width:480px) {
  .hero-logo-main   { height:40px }
  .hero-logo-ew     { height:28px }
  h1.hero-title     { font-size:2rem; letter-spacing:-.5px }
  .hero-stats       { flex-direction:column; gap:14px }
  .contact-info     { flex-direction:column; align-items:center }
  .ew-right         { grid-template-columns:1fr 1fr }
  .historia-cta     { padding:20px 16px }
}

/* ══════════════════════════════════════════════
   CUSTOM CURSOR
══════════════════════════════════════════════ */
body.has-custom-cursor,
body.has-custom-cursor * { cursor: none }

#cur-dot {
  position: fixed; top: 0; left: 0; z-index: 99999;
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--brand); pointer-events: none;
  will-change: transform; transition: opacity .3s;
  margin: -4px 0 0 -4px;
}

#cur-ring {
  position: fixed; top: 0; left: 0; z-index: 99998;
  width: 40px; height: 40px; border-radius: 50%;
  border: 2px solid rgba(190,14,44,.45); pointer-events: none;
  will-change: transform;
  transition: width .2s ease, height .2s ease, margin .2s ease,
              border-color .2s ease, background .2s ease, opacity .3s;
  margin: -20px 0 0 -20px;
}

#cur-ring.hovered {
  width: 64px; height: 64px; margin: -32px 0 0 -32px;
  border-color: rgba(190,14,44,.7);
  background: rgba(190,14,44,.06);
}

/* ══════════════════════════════════════════════
   SVG GAUGE
══════════════════════════════════════════════ */
.gauge-wrap { display: flex; justify-content: center; margin-bottom: 4px; }
.gauge-wrap svg { overflow: visible; }
.g-track { stroke: var(--border); }
.g-arc   { stroke: var(--brand);  }

/* ══════════════════════════════════════════════
   THEME TOGGLE BUTTON
══════════════════════════════════════════════ */
.theme-toggle {
  display:flex; align-items:center; justify-content:center;
  width:36px; height:36px; border-radius:var(--radius-sm);
  background:rgba(255,255,255,.06); border:1px solid var(--border);
  color:var(--muted); cursor:pointer; transition:var(--trans);
  font-size:15px; flex-shrink:0;
}
.theme-toggle:hover { background:rgba(255,255,255,.12); color:var(--text); border-color:rgba(255,255,255,.15) }

/* ══════════════════════════════════════════════
   LIGHT MODE
   Aktywowany przez: data-theme="light" na <html>
══════════════════════════════════════════════ */
[data-theme="light"] {
  --bg:           #f5f7fa;
  --bg-2:         #edf0f4;
  --card:         #ffffff;
  --card-2:       #f0f2f6;
  --border:       rgba(0,0,0,.10);
  --border-red:   rgba(190,14,44,.3);
  --text:         #111418;
  --text-2:       #374151;
  --muted:        #5a6270;
  --shadow:       0 4px 16px rgba(0,0,0,.10);
  --shadow-brand: 0 4px 16px rgba(190,14,44,.28);
}

/* Navbar light */
[data-theme="light"] .navbar {
  background: rgba(245,247,250,.88);
  border-bottom-color: rgba(0,0,0,.1);
}
[data-theme="light"] .navbar.scrolled {
  background: rgba(245,247,250,.98);
  box-shadow: 0 2px 24px rgba(0,0,0,.1);
}
[data-theme="light"] .nav-links a     { color:#6b7280 }
[data-theme="light"] .nav-links a:hover,
[data-theme="light"] .nav-links a.active { color:#111418; background:rgba(0,0,0,.05) }
[data-theme="light"] .nav-toggle      { border-color:rgba(0,0,0,.12); color:#374151 }
[data-theme="light"] .nav-toggle:hover{ background:rgba(0,0,0,.05) }

/* Mobile nav light */
@media (max-width:768px) {
  [data-theme="light"] .nav-links {
    background: rgba(245,247,250,.99);
    border-bottom-color: rgba(0,0,0,.1);
  }
}

/* Theme toggle light */
[data-theme="light"] .theme-toggle {
  background: rgba(0,0,0,.05);
  border-color: rgba(0,0,0,.12);
  color: #6b7280;
}
[data-theme="light"] .theme-toggle:hover { background:rgba(0,0,0,.1); color:#111418 }

/* Hero w light mode – tekst i stats adaptują się automatycznie */

/* Marquee gradient – używa var(--bg) automatycznie */

/* Cookies light */
[data-theme="light"] .cookies-banner { background:#fff; border-top-color:rgba(0,0,0,.1) }
[data-theme="light"] .cookies-inner p { color:#5a6270 }

/* Page hero light */
[data-theme="light"] .page-hero { background:var(--bg-2) }

/* Historia light */
[data-theme="light"] #historia-error { background:rgba(190,14,44,.07); color:#c92a2a }

/* Input light */
[data-theme="light"] .input {
  background:#f0f2f6; border-color:rgba(0,0,0,.12); color:#111418;
}
[data-theme="light"] .input::placeholder { color:#9ca3af }
[data-theme="light"] .input:focus { border-color:var(--brand) }
[data-theme="light"] label { color:#374151 }

/* Step items light */
[data-theme="light"] .step-item:hover { border-color:rgba(190,14,44,.2) }

/* Testimonials light */
[data-theme="light"] .t-text { color:#374151 }

/* Contact strip – zawsze czerwony, bez zmian */

/* Footer light */
[data-theme="light"] .footer { background:var(--bg-2); border-top-color:rgba(0,0,0,.1) }
[data-theme="light"] .footer-seo { color:rgba(0,0,0,.07) }

/* Historia pojazdu: wykonane prace jako lista */
.historia-work{list-style:none;margin:4px 0 0;padding:0}
.historia-work li{position:relative;padding:2px 0 2px 20px}
.historia-work li::before{content:"\2713";position:absolute;left:0;top:2px;color:#16a34a;font-weight:700}

/* ══════════════════════════════════════════════
   SOCIAL W STOPCE (linki z Ustawienia → Strony publiczne)
══════════════════════════════════════════════ */
.social-links { display:flex; gap:9px; flex-wrap:wrap }
.social-links a {
  width:38px; height:38px; border-radius:10px;
  display:grid; place-items:center;
  border:1px solid var(--border); background:var(--card-2);
  color:var(--text-2); font-size:15px;
  transition:background var(--trans), border-color var(--trans), color var(--trans);
}
.social-links a:hover { background:var(--brand); border-color:var(--brand); color:#fff }
/* Atrybut hidden przegrywa z regula klasy (UA stylesheet ma nizszy priorytet), stad jawnie: */
.social-links[hidden], .social-links a[hidden] { display:none }
[data-theme="light"] .social-links a { background:#f1f4f8 }

/* Dane rejestrowe spolki w stopce (art. 206 par. 1 KSH). */
.footer-rejestr {
  margin-top: 6px;
  font-size: 11.5px;
  line-height: 1.6;
  color: var(--muted);
}