/* GLOBAL */
* { margin:0; padding:0; box-sizing:border-box; font-family:'Inter', sans-serif; }
body { background:#0f0f0f; color:#f5f5f5; line-height:1.6; font-size:16px; }
a { text-decoration:none; color:inherit; }

/* CONTAINER */
.container { display:flex; justify-content:space-between; align-items:center; max-width:1200px; margin:auto; }

/* HEADER */
header { background:#111; padding:18px 30px; position:sticky; top:0; z-index:1000; border-bottom:1px solid #1f1f1f; box-shadow:0 4px 12px rgba(0,0,0,0.3); }
header h1 { font-size:24px; font-weight:700; color:#8edb72; }
nav { display:flex; gap:25px; }
nav a { color:#cfcfcf; font-weight:500; transition:0.2s; }
nav a:hover { color:#9eee83; }

/* MOBILE MENU */
.menu-toggle { display:none; font-size:28px; cursor:pointer; color:#8edb72; user-select:none; }
@media(max-width:768px){
  nav { position:absolute; top:70px; right:0; background:#111; flex-direction:column; width:220px; display:none; padding:20px; border-left:1px solid #222; border-bottom:1px solid #222; }
  nav.active { display:flex; }
  .menu-toggle { display:block; }
}

/* HERO */
.hero {
  background: linear-gradient(135deg, #0e0e0e, #1a1a1a); /* gradient lub zdjęcie tła */
  padding: 140px 30px;
  text-align: center;
  border-bottom: 4px solid #8edb72;
}

.hero-content h2 {
  font-size: 48px;
  margin-bottom: 15px;
  line-height: 1.2;
}

.hero-content p {
  font-size: 18px;
  margin-bottom: 30px;
  opacity: 0.9;
}

.hero-content button {
  padding: 16px 40px;
  font-size: 18px;
  background: #8edb72;
  border: none;
  border-radius: 12px;
  font-weight: 700;
  cursor: pointer;
  color: #0e0e0e;
  box-shadow: 0 4px 15px rgba(0,255,128,0.3);
  transition: 0.25s;
}

.hero-content button:hover {
  background: #9eee83;
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(0,255,128,0.5);
}

.hero-image { width:260px; height:260px; border-radius:50%; background:#333; }
@media(max-width:768px){ .hero-content h2{font-size:36px;} .hero-overlay{padding:90px 25px;} .hero-image{width:180px; height:180px;} }

/* SECTIONS */
.section { padding:70px 30px; max-width:1200px; margin:auto; }
.section h3 { font-size:36px; color:#8edb72; text-align:center; margin-bottom:40px; }

/* PROJECTS */
.projects-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:40px; }
.project { background:#1a1a1a; padding:25px; border-radius:14px; border:1px solid #2a2a2a; display:flex; flex-direction:column; gap:12px; transition:all 0.3s; }
.project img{width:100%; border-radius:10px;}
.project h4{font-size:24px; color:#cfcfcf;}
.project:hover{transform:translateY(-6px); border-color:#8edb72; box-shadow:0 10px 25px rgba(0,255,128,0.15);}

/* SERVICES */
.services-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:25px; }
.service { background:#1a1a1a; padding:20px; border-radius:12px; border:1px solid #2a2a2a; text-align:center; font-weight:500; transition:all 0.3s; }
.service:hover { transform:translateY(-5px); border-color:#8edb72; }

/* EXPERIENCE & SKILLS */
.experience, .skills { display:flex; flex-direction:column; gap:20px; }
.experience-item, .skill-item { background:#1a1a1a; padding:20px; border-radius:10px; border:1px solid #2a2a2a; font-weight:500; }

/* CONTACT FORM */
form { max-width:500px; margin:auto; display:flex; flex-direction:column; gap:20px; }
form input, form textarea { padding:14px; border-radius:8px; border:none; background:#1c1c1c; color:white; font-size:16px; }
form button { padding:14px; border:none; border-radius:8px; font-size:18px; font-weight:600; cursor:pointer; background:#8edb72; color:#0f0f0f; transition:0.25s; }
form button:hover { background:#9eee83; }

/* FOOTER */
footer { text-align:center; padding:40px; opacity:0.65; font-size:14px; margin-top:50px; border-top:1px solid #2a2a2a; }
footer a { color:inherit; }

/* UTILITY */
.text-center { text-align:center; }