/* Reset & base */
* { margin:0; padding:0; box-sizing:border-box; }
html, body { height:100%; }
body {
  font-family: system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  line-height:1.5;
  color:#333;
  background:#fff;
}
a { color: inherit; }

/* Container */
.container { width:90%; max-width:960px; margin:0 auto; }

/* ===== Header & Nav (NEW) ===== */
.site-header {
  background:#ffffff;
  border-bottom:1px solid #e5e7eb;
  position:sticky;
  top:0;
  z-index:10;
}

.header-row {
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:10px 0;
}

.brand {
  font-weight:700;
  font-size:1rem;
  text-decoration:none;
}

.nav {
  display:flex;
  gap:16px;
}

.nav a {
  font-size:0.95rem;
  text-decoration:none;
  padding:4px 0;
  position:relative;
}

.nav a::after {
  content:'';
  position:absolute;
  left:0;
  bottom:-2px;
  width:0;
  height:2px;
  background:#28a745;
  transition:width .15s ease-out;
}

.nav a:hover::after {
  width:100%;
}

/* Küçük ekran için header */
@media (max-width:600px){
  .header-row {
    flex-direction:column;
    align-items:flex-start;
    gap:6px;
  }
}

/* Buttons */
.btn {
  display:inline-block;
  padding:12px 24px;
  margin:8px 4px;
  background:#28a745;
  color:#fff;
  text-decoration:none;
  border-radius:8px;
  font-weight:700;
  transition: transform .06s ease, opacity .2s;
}
.btn:hover { transform: translateY(-1px); opacity:.95; }
.btn.outline {
  background:transparent;
  color:#28a745;
  border:2px solid #28a745;
}

/* Hero */
.hero {
  background:#2c3e50 url('/assets/hero-bg.jpg') center/cover no-repeat;
  color:#fff;
  text-align:center;
  padding:100px 0 60px;
}
.hero h1 { font-size: clamp(2rem, 4vw, 2.75rem); margin-bottom:16px; }
.hero p  { font-size:1.125rem; opacity:.95; }

/* Features */
.features { padding:60px 0; }
.features h2 { text-align:center; margin-bottom:32px; font-size:1.75rem; }
.features .grid {
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(240px,1fr));
  gap:24px;
}
.feature {
  background:#f9f9f9;
  padding:20px;
  border-radius:12px;
  text-align:center;
  border:1px solid #eee;
}
.feature h3 { margin-bottom:8px; font-size:1.125rem; }

/* Screenshots */
.screenshots { padding:60px 0; }
.screenshots h2 { text-align:center; margin-bottom:32px; font-size:1.75rem; }
.carousel {
  display:flex;
  overflow-x:auto;
  gap:16px;
  scroll-snap-type:x mandatory;
  padding-bottom:6px;
}
.carousel img {
  height:400px;
  border-radius:12px;
  scroll-snap-align:start;
  flex:0 0 auto;
}
@media (max-width:600px){ .carousel img { height:300px; } }

/* CTA */
.cta { background:#28a745; color:#fff; text-align:center; padding:60px 0; }
.cta h2 { font-size: clamp(1.5rem, 3vw, 2rem); margin-bottom:16px; }
.cta p  { margin-bottom:24px; opacity:.95; }

/* Footer */
footer,
.site-footer {
  text-align:center;
  padding:20px 0;
  background:#f1f1f1;
  color:#444;
}

/* Legal pages (privacy / terms / support) */
.legal { max-width:800px; margin:0 auto; padding:24px; }
.legal h1 { font-size:1.75rem; margin:8px 0 16px; }
.legal h2 { font-size:1.25rem; margin:20px 0 10px; }
.legal h3 { font-size:1.05rem; margin:16px 0 8px; }
.legal p { margin:10px 0; }
.legal ul { list-style:disc; margin:8px 0 8px 20px; }
.legal li { margin:6px 0; }

/* Cards (optional helpers) */
.card { background:#fff; border:1px solid #eee; border-radius:12px; padding:16px; }

/* Utility */
.center { text-align:center; }
.mt-16 { margin-top:16px; }
.mt-24 { margin-top:24px; }

/* Prefers-reduced-motion */
@media (prefers-reduced-motion: reduce){
  .btn { transition:none; }
}