* {margin:0;padding:0;box-sizing:border-box;}
body {font-family:'Poppins',sans-serif;background:#0b0f14;color:#fff;line-height:1.8;scroll-behavior:smooth;}
.container {max-width:1200px;margin:auto;padding:0 20px;}
nav {position:sticky;top:0;background:#0b0f14;padding:20px 0;z-index:1000;border-bottom:1px solid #1f2937;}
nav .container {display:flex;justify-content:space-between;align-items:center;}
nav a {color:#9ca3af;text-decoration:none;margin-left:25px;font-weight:500;transition:0.3s;}
nav a:hover {color:#22c55e;}
.hero {min-height:100vh;display:flex;align-items:center;justify-content:center;text-align:center;background-size:cover;background-position:center;position:relative;}
.hero::after {content:"";position:absolute;inset:0;background:rgba(0,0,0,0.6);}
.hero-content {position:relative;z-index:2;max-width:800px;}
h1 {font-size:52px;margin-bottom:20px;}
h2 {font-size:36px;margin-bottom:25px;color:#22c55e;}
section {padding:120px 0;}
.btn {display:inline-block;padding:16px 40px;background:#22c55e;color:#000;border-radius:50px;font-weight:600;text-decoration:none;transition:0.3s;}
.btn:hover {transform:translateY(-3px);}
.grid-3 {display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:40px;}
.card {background:#111827;padding:40px;border-radius:20px;transition:0.4s;opacity:0;transform:translateY(40px);}
.card.visible {opacity:1;transform:translateY(0);}
.gallery {display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:25px;}
.gallery img {width:100%;border-radius:20px;transition:0.4s;}
.gallery img:hover {transform:scale(1.05);}
form input, form textarea, form select {width:100%;padding:15px;margin-bottom:15px;border-radius:10px;border:none;}
button {width:100%;padding:15px;border:none;border-radius:40px;background:#22c55e;font-weight:600;}
footer {text-align:center;padding:50px;background:#000;color:#6b7280;}
.gallery {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 40px;
}

.portfolio-item {
    background: #111827;
    padding: 20px;
    border-radius: 20px;
    transition: 0.4s;
}

.portfolio-item:hover {
    transform: translateY(-8px);
}

.portfolio-item img {
    width: 100%;
    height: 350px;
    object-fit: cover;
    border-radius: 15px;
    margin-bottom: 15px;
}

.portfolio-item h3 {
    margin-bottom: 8px;
    color: #22c55e;
}