/* ---------- RESET & BASE ---------- */
* { box-sizing: border-box; }
html,body { height: 100%; }
body {
  margin: 0;
  font-family: "Inter", UI-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
  background: linear-gradient(180deg,#f6f8fb 0%, #ffffff 100%);
  color: #0f1724;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  line-height:1.5;
  -webkit-text-size-adjust:100%;
}

/* ---------- CONTAINER ---------- */
.container {
  width: 100%;
  max-width: 1180px;
  margin: 0 auto;
  padding: 0 20px;
}

/* ---------- HEADER (sticky + dynamic) ---------- */
.main-header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1200;
  background: linear-gradient(180deg, rgba(255,255,255,0.8), rgba(255,255,255,0.6));
  backdrop-filter: blur(6px);
  transition: background 360ms ease, box-shadow 360ms ease, transform 200ms ease;
  border-bottom: 1px solid rgba(15,23,36,0.04);
}

.main-header.scrolled {
  background: #003366; /* koyu mavi arkaplan scroll olunca */
  color: #fff;
  box-shadow: 0 8px 24px rgba(3,7,18,0.12);
  transform: translateY(0);
}

.header-inner {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 20px;
  padding: 14px 0;
}

/* Logo */
.logo {
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-weight:700;
  font-size:1.15rem;
  color: #003366;
  text-decoration:none;
}
/* Menü yüksekliği ayarı */
header, nav, .menu {
    height: 77px; /* İstediğiniz yükseklik */
}


.main-header.scrolled .logo { color: #fff; }

/* NAV */
.nav { display:flex; align-items:center; gap: 20px; }
.nav-links { list-style:none; margin:0; padding:0; display:flex; gap: 22px; align-items:center; }
.nav-link {
  color: #0f1724;
  text-decoration:none;
  padding: 8px 6px;
  position:relative;
  font-weight:600;
  border-radius:6px;
  transition: color 220ms ease;
}
.main-header.scrolled .nav-link { color: rgba(255,255,255,0.95); }

.nav-link::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -6px;
  height: 3px;
  width: 0%;
  background: #00a3ff;
  border-radius: 3px;
  transition: width 260ms cubic-bezier(.2,.9,.25,1);
}
.nav-link:hover { color: #006699; }
.nav-link:hover::after { width: 100%; }

/* active menu */
.nav-link.active {
  color: #006699;
  background: linear-gradient(90deg, rgba(0,102,153,0.08), rgba(0,102,153,0.04));
}
.main-header.scrolled .nav-link.active {
  color: #ffd966; /* seçili menü için kontrast renk */
}
.nav-link.active::after { width: 100%; background:#006699; }

/* LANG SELECT */
.lang-menu select {
  border:0;
  background: rgba(240,245,250,0.9);
  padding:8px 10px;
  border-radius:8px;
  font-weight:600;
  cursor:pointer;
  color:#003366;
  transition: transform 180ms ease, background 180ms ease;
}
.main-header.scrolled .lang-menu select { background: rgba(255,255,255,0.08); color:#33002f; }

/* HAMBURGER (mobile) */
.nav-toggle {
  display:none;
  background:transparent;
  border:0;
  width:44px;
  height:44px;
  align-items:center;
  justify-content:center;
  border-radius:8px;
  cursor:pointer;
}
.hamburger, .hamburger::before, .hamburger::after {
  display:block;
  width:22px;
  height:2px;
  background:#0f1724;
  border-radius:2px;
  transition: transform 220ms ease, opacity 220ms ease, background 220ms ease;
}
.main-header.scrolled .hamburger, .main-header.scrolled .hamburger::before, .main-header.scrolled .hamburger::after {
  background: #fff;
}
.hamburger::before, .hamburger::after {
  content: "";
  display:block;
  margin-top:6px;
}
.nav-toggle[aria-expanded="true"] .hamburger {
  transform: rotate(45deg);
}
.nav-toggle[aria-expanded="true"] .hamburger::before {
  transform: rotate(-90deg) translateX(-6px);
  opacity: 0;
}
.nav-toggle[aria-expanded="true"] .hamburger::after {
  transform: rotate(-45deg);
}

/* ---------- PAGE LAYOUT ---------- */
body { padding-top: 80px; /* header yüksekliği */ }

/* HERO */
.hero { padding: 100px 20px 50px; text-align:center; }
.hero h1 { font-size:2.2rem; margin:0 0 10px; color:#003366; }
.main-header.scrolled ~ .hero h1 { color: #fff; }

/* AILE TANITIM */
.aile-tanitim { margin-top:26px; max-width:900px; margin-left:auto; margin-right:auto; text-align:left; background:rgba(255,255,255,0.9); padding: 28px; border-radius:12px; box-shadow: 0 8px 30px rgba(3,7,18,0.04); }
.aile-tanitim h2 { color:#003366; margin-top:0; }

/* PAGE CONTENT */
.page-content { max-width:1000px; margin:40px auto; padding:0 20px; }

/* GALLERY */
.gallery-grid { display:grid; gap:18px; grid-template-columns: repeat(auto-fit, minmax(220px,1fr)); }
.gallery-grid img { width:100%; height:220px; object-fit:cover; border-radius:12px; box-shadow:0 6px 18px rgba(3,7,18,0.06); transition: transform 240ms ease; }
.gallery-grid img:hover { transform: translateY(-6px) scale(1.02); }

/* CONTACT */
.contact-page { max-width:1100px; margin:40px auto; padding:0 20px; }
.contact-container { display:grid; grid-template-columns: 1fr 1fr; gap:28px; align-items:start; }
.contact-card { background:#fff; padding:22px; border-radius:12px; box-shadow:0 8px 28px rgba(3,7,18,0.05); }
.contact-card h2 { margin-top:0; color:#003366; }

.contact-form input, .contact-form textarea {
  width:100%; padding:12px; border-radius:8px; border:1px solid #e3e8ef; font-size:1rem;
  transition: box-shadow 160ms ease, border-color 160ms ease;
}
.contact-form input:focus, .contact-form textarea:focus { outline:none; border-color:#00a3ff; box-shadow:0 6px 20px rgba(0,163,255,0.08); }

.btn {
  display:inline-block; background: linear-gradient(90deg,#003366,#006699); color:#fff; border:0; padding:12px 18px; border-radius:10px; cursor:pointer; font-weight:700;
  transition: transform 160ms ease, box-shadow 160ms ease;
}
.btn:hover { transform: translateY(-3px); box-shadow:0 8px 20px rgba(0,98,153,0.18); }

/* MAP */
.map iframe { width:100%; height:360px; border:0; border-radius:12px; }

/* FOOTER */
.main-footer { background:#003366; color:#fff; padding:28px 0; margin-top:60px; }
.footer-inner { display:flex; justify-content:space-between; gap:20px; align-items:center; flex-wrap:wrap; }
.muted { color: rgba(255,255,255,0.8); margin:4px 0; }
.small { font-size:0.9rem; }

/* RESPONSIVE */
@media (max-width:900px) {
  .contact-container { grid-template-columns: 1fr; }
  .nav-links { gap: 14px; }
}
@media (max-width:780px) {
  .nav { order: 3; width:100%; }
  .nav-links { flex-direction:column; padding:12px 4px 18px; background:transparent; }
  .nav-toggle { display:flex; }
  .lang-menu { order:2; margin-left:auto; }
  .header-inner { align-items:center; }
}