:root{
  --brand:#0b2c5f;
  --brand-2:#f59e0b;
  --text:#0f172a;
  --muted:#64748b;
  --bg:#f8fafc;
}

html,body{scroll-behavior:smooth;}
body{color:var(--text); background:#fff;}

.section{padding:64px 0;}
.section-sm{padding:40px 0;}
.container-narrow{max-width:960px;}

.hero{
  background: radial-gradient(1200px 600px at 80% 20%, rgba(245,158,11,.15), transparent 60%),
              linear-gradient(135deg,#0e2d5b 0%, #1c4e97 45%, #f59e0b 120%);
  color:#fff;
  border-radius:0 0 24px 24px;
  padding:88px 0 72px;
}
.hero h1{font-weight:800; letter-spacing:.4px;}
.hero .lead{color:#e5e7eb; font-size:1.2rem;}

.btn-brand{background:#fff; color:#0e2d5b; border:0; font-weight:700;}
.btn-brand:hover{opacity:.9;}
.btn-ghost{background:rgba(255,255,255,.15); color:#fff; border:1px solid rgba(255,255,255,.25);}
.btn-ghost:hover{background:rgba(255,255,255,.25); color:#fff;}

.badges{
  display:flex; gap:18px; flex-wrap:wrap; margin-top:18px;
  justify-content:center;               /* WYŚRODKOWANIE */
}
.badge-pill{
  background: rgba(255,255,255,.18);
  color:#fff; padding:8px 12px; border-radius:999px; font-size:.92rem;
  display:inline-flex; align-items:center; gap:8px;
}

.card-elevated{
  border:0; border-radius:16px; box-shadow:0 6px 24px rgba(2,6,23,.06);
}
.card-elevated .card-header{
  background:#fff; border-bottom:0; padding:28px 28px 0 28px;
}
.card-elevated .card-body{padding:24px 28px 28px;}
.card-elevated .price-from{
  display:inline-block; background:#eef2ff; color:#1e3a8a; font-weight:700;
  padding:6px 10px; border-radius:999px; font-size:.9rem;
}

.bullet{display:flex; gap:10px; margin-bottom:8px; color:var(--muted);}
.bullet i{color:#16a34a; margin-top:3px;}

.grid-regions .btn{
  background:#fff; border:1px solid #e5e7eb; border-radius:12px; padding:14px 18px;
  text-align:left; width:100%; color:var(--text); font-weight:700;
}
.grid-regions .btn:hover{border-color:#cbd5e1; background:#f8fafc;}

.cta{
  background:linear-gradient(135deg,#0e2d5b 0%, #1c4e97 60%, #f59e0b 140%);
  color:#fff; border-radius:18px; padding:42px 28px;
}
.cta .btn{font-weight:700;}

.product-type .ratio{
  background:#f8fafc; border:1px solid #eef2f7; border-radius:12px;
}
.product-type img{
  object-fit:cover; width:100%; height:100%;
  border-radius:12px;
}
.product-type .title{font-weight:700;}
.product-type .range{display:inline-block; background:#eef2ff; color:#1e3a8a; font-weight:700; padding:6px 10px; border-radius:999px; font-size:.9rem;}

.navbar-brand{font-weight:800;}
footer{color:var(--muted);}


/* Feature blocks (naprzemienne zdjęcie/tekst) */
.feature-img img{object-fit:cover; width:100%; height:100%; border-radius:12px; border:1px solid #eef2f7;}
.feature .h3{font-weight:800;}
.feature p{color:var(--muted);}


.nav-pills .nav-link{
  border-radius:999px;font-weight:600
}
.nav-pills .nav-link.active{
  background:var(--brand); border-color:var(--brand)
}
/* center badges w hero (również tu) */
.hero .badges{justify-content:center}

/* CTA gradient – wymuś kolory */
.cta-gradient{
  background: linear-gradient(135deg,#103a72 0%, #2f5f97 45%, #c28933 100%) !important;
  color:#fff !important;
  box-shadow: 0 10px 30px rgba(16,58,114,.15);
  border: 0;
}
.cta-gradient .btn{
  border:0;
}
.cta-gradient .btn.btn-light{
  color:#0d2b57 !important;
}

/* chip w hero */
.hero-chip{
  display:inline-flex;align-items:center;gap:.5rem;
  background:rgba(255,255,255,.12);color:#fff;border:1px solid rgba(255,255,255,.35);
  padding:.45rem .9rem;border-radius:999px;backdrop-filter:saturate(140%) blur(2px)
}
.hero-chip .dot{width:.5rem;height:.5rem;border-radius:50%;background:#7df18a;display:inline-block}
.hero-pill{background:rgba(255,255,255,.12);color:#fff;border:1px solid rgba(255,255,255,.2)}
/* karty typów (miły cień) */
.type-card{border:0;border-radius:1rem;overflow:hidden}


/* Availability pill – wspólny wygląd (miasto + województwo) */
.badge.availability{
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  padding:.55rem 1rem;
  border-radius:9999px;

  /* docelowa kolorystyka */
  background:rgba(255,255,255,.12);
  color:#fff;
  border:1px solid rgba(255,255,255,.28);
  backdrop-filter:saturate(120%) blur(2px);
}

/* W hero możemy delikatnie przyciemnić */
.hero .badge.availability{
  background:rgba(255,255,255,.10);
  border-color:rgba(255,255,255,.28);
}

.hero .badge.availability i{
  font-size:1.05rem;
  line-height:1;
}
/* Kontakt */
.contact-card{
  border:0;
  border-radius:16px;
  box-shadow:0 10px 30px rgba(2,6,23,.06);
}
.contact-card .form-control{
  border-radius:12px;
  padding:.9rem 1rem;
}
#kontakt .btn-dark{
  background:#0d2b57; /* pod brand */
  border:0;
}
#kontakt .btn-dark:hover{
  background:#0b2448;
}