/* Frontida Komotini — Minimal, modern, accessible, mobile-first */

:root{
  --brand:#1565c0;
  --brand-2:#1e88e5;
  --bg:#ffffff;
  --fg:#0f172a;
  --muted:#475569;
  --card:#f8fafc;
  --shadow:0 10px 25px rgba(0,0,0,.06);
  --radius:16px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Noto Sans, Ubuntu, Cantarell, Arial, sans-serif;
  color:var(--fg);
  background:var(--bg);
  line-height:1.6;
}

/* Container */
.container{max-width:1100px;margin-inline:auto;padding:0 16px}

/* ==========================
   HEADER — CLEAN & RESPONSIVE
   ========================== */

.site-header {
  position: sticky;
  top: 0;
  background: #fff;
  border-bottom: 1px solid #e2e8f0;
  box-shadow: 0 2px 6px rgba(0,0,0,.05);
  z-index: 100;
  transition: transform .35s ease-in-out, box-shadow .2s ease, border-color .2s ease;
}
.site-header.hide {
  transform: translateY(-100%);
  box-shadow: none;
  border-color: transparent;
}

/* 3 kolon: logo - nav - call button */
.header-inner {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 24px;
  padding: 10px 24px;
  max-width: 1100px;
  margin: 0 auto;
}

/* LOGO */
.brand {
  display: flex;
  align-items: center;
  text-decoration: none;
}

.brand img {
  width: 350px;
  height: auto;
}

/* MENU */
.nav {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 28px;
}

.nav a {
  text-decoration: none;
  color: #334155;
  font-weight: 600;
  font-size: 1rem;
  transition: color 0.2s ease;
}

.nav a:hover { color: var(--brand); }

/* CALL BUTTON */
.cta {
  display: inline-block;
  padding: 9px 20px;
  border-radius: 999px;
  border: 2px solid var(--brand);
  color: var(--brand);
  text-decoration: none;
  font-weight: 700;
  white-space: nowrap;
  transition: all 0.2s ease;
}
.cta:hover { background: var(--brand); color: #fff; }

/* ==========================
   MOBİL DÜZEN
   ========================== */
@media (max-width: 768px) {
  .header-inner{
    display:flex;flex-direction:column;align-items:center;gap:10px;padding:16px 0
  }
  .brand img{width:280px;height:auto;margin-bottom:4px}
  .nav{flex-direction:column;gap:8px}
  .nav a{font-size:1.05rem}
  .cta{display:block;width:90%;max-width:340px;text-align:center;font-size:1.1rem;padding:12px 0}
}

.brand{font-weight:800;font-size:1.2rem;color:var(--brand);text-decoration:none}
.nav a{margin:0 8px;text-decoration:none;color:#334155}
.nav a:hover{color:var(--brand)}
.cta{display:inline-block;padding:10px 16px;border-radius:999px;border:2px solid var(--brand);color:var(--brand);text-decoration:none;font-weight:700}
.cta-solid{background:var(--brand);color:#fff;border-color:var(--brand)}
.cta:hover{transform:translateY(-1px)}
.cta:active{transform:translateY(0)}

/* Hero slider */
.hero{position:relative}
/* --- Slider genel ayar --- */
.slider {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 100vh;
  max-height: 720px;
}

/* --- Her slide --- */
.slide {
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  display: grid; place-items: center;
  text-align: center; color: #fff;
}

.slide img {
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: center 35%;
  display: block;
  filter: brightness(0.85);
}

/* --- Slide metinleri --- */
.slide-caption {
  position: absolute;
  bottom: 12%; left: 50%;
  transform: translateX(-50%);
  z-index: 2; width: 90%; max-width: 900px;
  text-shadow: 0 3px 18px rgba(0,0,0,0.6);
}
.slide-caption h1,
.slide-caption h2{font-size:clamp(1.6rem,2.5vw,2.8rem);margin-bottom:.5em}
.slide-caption p{font-size:clamp(1rem,1.5vw,1.2rem);font-weight:400}

/* --- Butonlar --- */
.slider-btn{
  position:absolute;top:50%;transform:translateY(-50%);
  background:rgba(0,0,0,.35);border:none;color:#fff;
  font-size:2rem;width:44px;height:44px;border-radius:50%;
  cursor:pointer;z-index:3;transition:background .2s
}
.slider-btn:hover{background:rgba(0,0,0,.6)}
.slider-btn.prev{left:16px}
.slider-btn.next{right:16px}

/* --- Mobil ayar --- */
@media (max-width: 768px){
  .slider{height:70vh}
  .slide-caption h1,
  .slide-caption h2{font-size:1.6rem}
  .slide-caption p{font-size:1rem}
}

/* Sections */
.section{padding:48px 0}
.section-alt{background:var(--card)}
.lead{color:var(--muted)}

/* Cards grid */
.grid{display:grid;gap:20px;grid-template-columns:repeat(1,minmax(0,1fr))}
@media (min-width:700px){.grid{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1000px){.grid{grid-template-columns:repeat(3,1fr)}}

/* Cards */
.card{
  background:#fff;
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  overflow:hidden;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  transition:transform .25s ease, box-shadow .25s ease;
}
.card:hover{
  transform:translateY(-3px);
  box-shadow:0 6px 18px rgba(0,0,0,.08);
}

/* --- Görseller --- */
.card img{
  width:100%;
  height:220px;
  object-fit:cover;
  object-position:center top;
  border-bottom:1px solid #f1f5f9;
  display:block;
  transition:transform 0.3s ease;
}
.card:hover img{
  transform:scale(1.02);
}

@media (max-width:768px){
  .card img{height:300px;}
}

.card h3{margin:16px 16px 8px}
.card p{margin:0 16px 16px;color:var(--muted)}
.card .more{
  margin:0 16px 20px;
  align-self:flex-start;
  text-decoration:none;
  color:var(--brand);
  font-weight:700;
}

/* Content */
.page-hero{padding:40px 0;background:linear-gradient(180deg,#eef2ff,transparent)}
.content img{border-radius:var(--radius);box-shadow:var(--shadow);margin:8px 0 16px}
.content ul {
  list-style: none;
  padding-left: 0;
  margin-left: 0;
}
.content ul li::before {
  content: none;
}
.cta-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}

/* Contact + Map */
.contact{display:grid;gap:20px}
@media (min-width:900px){.contact{grid-template-columns:1fr 1fr}}
.contact-card{background:#fff;border-radius:var(--radius);box-shadow:var(--shadow);padding:20px}
.contact-list{list-style:none;margin:0;padding:0}
.contact-list li{margin:8px 0}
.map-embed iframe{width:100%;min-height:360px;border:0;border-radius:var(--radius);box-shadow:var(--shadow)}

/* Footer */
.site-footer{border-top:1px solid #e2e8f0;padding:18px 0;margin-top:24px;background:#fff}
.footer-inner{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.footer-nav a{margin:0 8px;text-decoration:none;color:#334155}

/* A11y focus */
a:focus,button:focus{outline:3px solid #94a3b8;outline-offset:2px}

/* Small helpers */
img{max-width:100%;height:auto}

/* Motion preference */
@media (prefers-reduced-motion: reduce){
  *{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important}
}