:root{
  --bg:#f7f8fb;
  --txt:#111;
  --mut:#555;
  --line:#eaeaea;
  --pri:#0b5fff;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}

body{
  font-family:system-ui,-apple-system,Segoe UI,Arial,sans-serif;
  margin:0; 
  line-height:1.4; 
  color:var(--txt);
  
  /* TŁO PARALLAX (ZDJĘCIE) */
  background-image: url('https://images.pexels.com/photos/8297225/pexels-photo-8297225.jpeg?auto=compress&cs=tinysrgb&w=1920');
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-color: #f7f8fb;
}

/* KARTY DLA TREŚCI (BIAŁE) */
.section-card {
  background: #fff;
  margin-bottom: 40px; 
  padding: 60px 0;
  box-shadow: 0 4px 20px rgba(0,0,0,0.08);
  position: relative;
  z-index: 2;
}
.section-card:last-of-type { margin-bottom: 0; }

.wrap{max-width:1100px;margin:0 auto;padding:0 24px}

/* NAGŁÓWEK (Biały) */
.topbar{position:sticky;top:0;background:#fff;border-bottom:1px solid var(--line);z-index:100; box-shadow: 0 2px 10px rgba(0,0,0,0.05);}
.nav{display:flex;align-items:center;justify-content:space-between;padding:12px 24px; max-width:1100px; margin:0 auto;}

.brand-logo { display: flex; align-items: center; text-decoration: none; }
.brand-logo img { height: 50px; width: auto; display: block; }

nav a{margin-left:14px;text-decoration:none;color:var(--txt);font-weight:600; font-size: 0.95em; text-transform: uppercase; letter-spacing: 0.5px;}
nav a:hover{text-decoration:underline;color:var(--pri)}

/* HERO - PRZEZROCZYSTE (ZMIANA!) */
.hero{
  /* Usunięte białe tło i box-shadow */
  background: transparent; 
  /* Lekki gradient, żeby tekst był czytelniejszy, jeśli zdjęcie jest jasne */
  background: linear-gradient(to bottom, rgba(0,0,0,0.3), rgba(0,0,0,0.1));
  
  padding: 100px 0 120px; /* Większy padding, żeby hero "oddychał" */
  margin-bottom: 40px;
  position: relative;
  z-index: 2;
}
.hero-center { text-align: center; }
.hero-inner { max-width: 800px; margin: 0 auto; padding: 0 24px; }

/* Tekst w Hero - Biały z cieniem dla czytelności */
.hero h1{
  margin:0 0 20px;
  font-size:clamp(32px, 5vw, 48px); /* Nieco większy font */
  line-height:1.1;
  font-weight:800;
  color: #fff; /* Biały tekst */
  text-shadow: 0 2px 10px rgba(0,0,0,0.5); /* Mocny cień pod tekstem */
}
.hero p{
  margin:0 0 32px;
  color: #f0f0f0; /* Jasny szary tekst */
  font-size:1.25em; /* Nieco większy opis */
  font-weight: 500;
  text-shadow: 0 1px 4px rgba(0,0,0,0.6);
}

.cta{display:flex;flex-wrap:wrap;gap:16px}
.cta-center{justify-content:center;align-items:center}

/* Przyciski w Hero (muszą być wyraźne) */
.hero .btn {
  box-shadow: 0 4px 15px rgba(0,0,0,0.3); /* Cień pod przyciskiem */
  border: 1px solid rgba(255,255,255,0.2); /* Delikatna ramka */
}
/* Przycisk secondary w hero (przezroczysty z obwódką) */
.hero .btn.secondary {
  background: rgba(0,0,0,0.5); /* Półprzezroczysty czarny */
  color: #fff;
  backdrop-filter: blur(5px); /* Efekt szkła (rozmycie tła) */
}
.hero .btn.secondary:hover {
  background: rgba(0,0,0,0.7);
}

/* RESZTA STYLI (BEZ ZMIAN) */
h2{margin:0 0 24px; font-size:1.8em; color:var(--pri); line-height:1.2; text-align:center;}
h3{margin:24px 0 12px; font-size:1.2em; line-height:1.3}

.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:24px}
.card{border:1px solid var(--line);border-radius:12px;padding:24px;background:#fbfbfb;transition:transform .2s}
.card:hover{transform:translateY(-4px);border-color:#ccc; background:#fff; box-shadow: 0 4px 12px rgba(0,0,0,0.05);}
.card h3{margin:0 0 8px; color:var(--pri); font-size:1.15em}
.card p{margin:0;color:var(--mut);font-size:0.95em;line-height:1.5}

.about-layout { display: grid; grid-template-columns: 1fr; gap: 40px; align-items: center; }
.about-text { display: flex; flex-direction: column; }
.about-image { overflow: hidden; border-radius: 12px; box-shadow: 0 12px 32px rgba(0,0,0,0.1); }
.about-image img { width: 100%; height: auto; display: block; }
@media (min-width: 900px) { .about-layout { grid-template-columns: 1fr 1fr; } }
.intro { font-size: 1.1em; margin-bottom: 24px; color: #222; line-height: 1.6; }

.check-list, .simple-list { padding-left: 18px; margin-bottom: 20px; }
.check-list li, .simple-list li { margin-bottom: 6px; line-height: 1.5; }
.check-list li { list-style-type: disc; }
.simple-list li { color: var(--mut); }

/* Przyciski ogólne */
.btn{
  display:inline-block; padding:12px 24px; border-radius:50px;
  background:var(--pri); color:#fff; text-decoration:none;
  font-weight:600; transition:all .2s; font-size:0.95em; border:0; font-family:inherit; cursor:pointer;
  box-shadow: 0 4px 12px rgba(11, 95, 255, 0.2);
}
.btn:hover{transform: translateY(-2px); box-shadow: 0 6px 16px rgba(11, 95, 255, 0.3);}
.btn.secondary{background:#111; box-shadow: 0 4px 12px rgba(0,0,0,0.2);}

.contact{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:30px}
.contact-box{border:0; border-radius:12px;padding:0;background:transparent}

.map-full { width: 100%; display: block; line-height: 0; margin-bottom: 0; box-shadow: 0 -4px 20px rgba(0,0,0,0.05); position: relative; z-index: 2; }
.map-full iframe { width: 100%; height: 450px; border: 0; }
.footer{ padding:30px 0; color:#fff; text-align:center; font-size:0.9em; background:#111; position: relative; z-index: 2; }
.footer a { color: #aaa; text-decoration: none; }
.footer a:hover { color: #fff; text-decoration: underline; }