/* ===== Base ===== */
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color: #0b1d23;
  background: #f8fbfc;
  line-height: 1.6;
}

/* ===== Header (Eski renk/stil) ===== */
header { background: #0e7a86; color: #fff; }
.container { max-width: 1100px; margin: 0 auto; padding: 0 16px; }

nav {
  display: flex; align-items: center; gap: 16px;
  padding: 12px 0;
}
.logo { height: 48px; width: auto; border-radius: 6px; background: #fff; }

nav a {
  color: #fff; text-decoration: none; font-weight: 600;
}
nav a:hover { text-decoration: underline; }

main { padding: 24px 0; }
footer { background: #0e7a86; color: #fff; padding: 16px 0; margin-top: 40px; }
footer small { opacity: .9; }

/* ===== Hero image (tam görünsün, küçük kalsın) ===== */
.hero { margin: 0 auto 20px; max-width: 1100px; padding: 0 0; }
.hero-img{
  width: 100%;
  height: auto;              /* oranı koru */
  max-height: 360px;         /* KÜÇÜK tut */
  object-fit: contain;       /* kırpma yok, tamamı görünür */
  object-position: center;
  display: block;
  border-radius: 12px;
  background: #eef3f5;       /* üst-alt boşluk oluşursa hoş bir zemin */
}

/* ===== Sections ===== */
.section { max-width: 1100px; margin: 24px auto; padding: 0 16px; }
.section h1, .section h2 { margin: 0 0 12px; line-height: 1.25; }

/* ===== About watermark ===== */
.about.watermark { position: relative; overflow: hidden; background:#fff; border-radius:12px; padding:20px; }
.about.watermark::after{
  content:""; position:absolute; inset:0;
  background:url('logo.png.jpg') no-repeat center;
  background-size: 240px auto;
  opacity:.06; pointer-events:none;
}

/* ===== Responsive ===== */
@media (max-width: 768px){
  nav { flex-wrap: wrap; }
  .hero-img { max-height: 45vh; } /* mobilde ekrana göre ayarla */
}
/* --- Long menu items: break into two lines --- */
nav a.break{
  white-space: normal;          /* tek satır zorlaması yok */
  display: inline-block;
  text-align: center;
  line-height: 1.15;
  width: 92px;                  /* dar alan -> 2 satıra kır */
}

/* dar ekranlarda genişlik kısıtını kaldır (menü sarmalansın) */
@media (max-width: 900px){
  nav a.break{ width: auto; }
}
/* --- Long menu items: break into two lines --- */
nav a.break{
  white-space: normal !important;     /* tek satır zorlaması varsa ez */
  display: inline-block;
  text-align: center;
  line-height: 1.15;
  width: 92px;                        /* dar alan -> 2 satıra kır */
}

/* dar ekranlarda genişlik kısıtını kaldır (menü sarmalansın) */
@media (max-width: 900px){
  nav a.break{ width: auto; }
}