/* ================== FONTLAR ================== */
/* Google Fonts - Baloo 2 (400–800) */
@import url('https://fonts.googleapis.com/css2?family=Baloo+2:wght@400;500;600;700;800&display=swap');

/* ================== DEĞİŞKENLER ================== */
:root{
  --font-body: "Baloo 2", system-ui,-apple-system,Segoe UI,Roboto,Arial;
  --font-head: "Baloo 2", system-ui,-apple-system,Segoe UI,Roboto,Arial;

  --page-max: 100vw;         /* container üst sınırı */
  --content-max: 100vw;      /* bantların üst sınırı */
  --grid-gap: 20px;

  /* Üst sıra yükseklikleri (Banner + Hakkımızda) */
  --carousel-height: 380px;
  --carousel-radius: 14px;
}

/* ================== GENEL ================== */
*{ box-sizing:border-box }
html,body{ margin:0; padding:0; font:16px/1.55 var(--font-body); color:#0a1e44 }
a{ color:inherit }

.container{
  max-width:var(--page-max);
  margin:0 auto;
  padding:0 24px;   /* sağ/sol az boşluk */
}

/* Başlık ve vurgu metinlerinde Baloo 2 */
h1,h2,h3,h4,h5,h6,
.nav-link,
.btn,.btn-outline,
.hero h1,.hero h2,
.panel > h2,
.kpi-top,
.cta-info h2,
.distributors h2,
.about-copy h2{
  font-family:var(--font-head);
  letter-spacing:-0.2px;
}

/* ================== HEADER (TEK ve MOBİL DOSTU) ================== */
.site-header{
  background:#fff;
  color:#0a1e44;
  border-bottom:1px solid #e9eef5;
  padding:10px 0;
  position:relative;
  z-index:20;
}
.header-inner{
  max-width:calc(var(--content-max) - 48px);
  margin:0 auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 24px;
  flex-wrap:wrap;           /* dar ekranda satır atlayabilsin */
}
.logo-link{ display:inline-flex; align-items:center; text-decoration:none }
.logo-img{ height:70px; width:auto; transition:height .3s ease }
.site-nav{
  display:flex;
  gap:22px;
  flex-wrap:wrap;
  justify-content:flex-end;
  align-items:center;
  transition:all .3s ease;
}
.nav-link{
  text-decoration:none;
  color:#0a1e44;
  font-weight:700;
  font-size:20px;
  padding:6px 4px;
  border-bottom:2px solid transparent;
  transition:border-color .3s ease, opacity .3s ease;
}
.nav-link:hover,.nav-link.active{ border-color:#0a1e44; opacity:.9 }

/* Mobil header */
@media (max-width:768px){
  .header-inner{ flex-direction:column; align-items:center; justify-content:center; padding:6px 16px }
  .logo-img{ height:56px; margin-bottom:8px }
  .site-nav{ gap:14px; justify-content:center }
  .nav-link{ font-size:16px; padding:4px 6px; border-bottom:none }
  .nav-link:hover,.nav-link.active{ border-color:transparent; opacity:.8 }
  .site-header{ padding:8px 0; box-shadow:0 2px 6px rgba(10,30,68,.05) }
}

/* Tablet */
@media (min-width:769px) and (max-width:1024px){
  .logo-img{ height:64px }
  .nav-link{ font-size:18px }
  .header-inner{ gap:10px; padding:0 20px }
}

/* ================== HERO ================== */
.hero{
  width:100%;
  border-radius:14px;
  overflow:hidden;
  background:#0a1e44;
  color:#fff;
  padding:36px 28px;
  text-align:center;
  margin:16px 0;
}
.hero h1{ margin:0 0 6px; font-size:30px; font-weight:800 }
.hero p{ margin:0; opacity:.9 }

/* ================== PANELLER ================== */
.panel{
  background:#fff;
  border:1px solid #e9eef5;
  border-radius:14px;
  padding:18px;
  margin:16px 0;
}
.panel > h2{ margin:0 0 10px; font-size:22px; font-weight:800 }
.lead{ font-size:18px; opacity:.95; font-family:var(--font-body) }
.actions{ display:flex; gap:10px; flex-wrap:wrap }
.btn,.btn-outline{
  padding:10px 14px;
  border-radius:12px;
  text-decoration:none;
  display:inline-block;
  font-family:var(--font-head);
  font-weight:700;
}
.btn{ background:#0a1e44; color:#fff }
.btn:hover{ opacity:.92 }
.btn-outline{ border:1px solid #0a1e44; color:#0a1e44; background:#fff }

/* ================== FORM ================== */
.form{ display:grid; gap:10px }
.input,textarea{ width:100%; padding:10px; border:1px solid #cfd7e3; border-radius:10px; font-family:var(--font-body) }
label{ font-weight:600; font-family:var(--font-body) }
.note{ font-size:14px; opacity:.8; font-family:var(--font-body) }

/* ================== FOOTER ================== */
.site-footer{
  padding:18px;
  text-align:center;
  border-top:1px solid #e9eef5;
  margin-top:8px;
  background:#fff;
  color:#0a1e44;
  font-family:var(--font-body);
}

/* ================== İLETİŞİM SAYFASI ================== */
.contact-grid{ display:grid; grid-template-columns:1fr; gap:16px }
.contact-card{ background:#fff; border:1px solid #e9eef5; border-radius:14px; padding:16px }
.contact-list{ list-style:none; padding:0; margin:0; display:grid; gap:8px }
.contact-list li{ display:flex; gap:10px; align-items:flex-start }
.contact-list a{ text-decoration:none; color:#0a1e44; word-break:break-word }
.contact-list .label{ min-width:92px; font-weight:600 }
.map-embed{ border:0; width:100%; height:360px; border-radius:14px }

/* ================== ANA SAYFA: ÜST SIRA (BANNER + HAKKIMIZDA) ================== */
.home-split-2{
  display:grid;
  grid-template-columns:1fr;
  column-gap: 5px;
  gap:var(--grid-gap);
  margin:16px auto 0;
  max-width:var(--content-max);
  align-items:start;
  justify-items:start;
}
@media (min-width:1200px){
  .home-split-2{ grid-template-columns:1fr 1fr }  /* %50 / %50 */
}

/* Sol: Carousel */
.carousel{
  position:relative;
  background:#0a1e44;
  border-radius:var(--carousel-radius);
  overflow:hidden;
  height:var(--carousel-height);
  min-height:var(--carousel-height);
  width:105%;
  margin-left:0;
  margin-right:auto;
  justify-self:start;
}
.carousel-track{ display:flex; width:100%; height:100%; transform:translateX(0%); transition:transform .5s ease }
.carousel .slide{ flex:0 0 100%; display:block; height:100%; background:#0a1e44 }
.carousel .slide img{ width:100%; height:100%; object-fit:cover; display:block }

/* Oklar */
.carousel .nav{
  position:absolute; top:50%; transform:translateY(-50%);
  background:rgba(10,30,68,.6); color:#fff; border:0;
  width:42px; height:42px; border-radius:50%;
  cursor:pointer; display:flex; align-items:center; justify-content:center; line-height:1;
}
.carousel .nav:hover{ background:rgba(10,30,68,.85) }
.carousel .prev{ left:12px }
.carousel .next{ right:12px }

/* Noktalar */
.carousel .dots{
  position:absolute; left:0; right:0; bottom:10px;
  display:flex; gap:8px; justify-content:center;
}
.carousel .dot{ width:10px; height:10px; border-radius:50%; background:rgba(255,255,255,.55); border:0; cursor:pointer }
.carousel .dot[aria-selected="true"]{ background:#fff }

/* Caption (varsa) */
.carousel .cap{
  position:absolute; left:36px; right:36px; bottom:16px; color:#fff;
  display:flex; flex-direction:column; gap:6px; max-width:720px;
  font-family:var(--font-body);
}
.carousel .cap::before{
  content:""; position:absolute; inset:-18px; z-index:-1;
  background:linear-gradient(90deg, rgba(0,0,0,.38), rgba(0,0,0,0));
  border-radius:12px;
}
.carousel .cap h3{ margin:0; font-size:28px; line-height:1.1; font-family:var(--font-head); font-weight:800 }
.carousel .cap p{ margin:0; font-size:14px; opacity:.95 }

/* Sağ: Hakkımızda paneli (kenarlık/gölge yok) */
.about-side{
  width: 95%;
  margin-left: 40px;
  height:var(--carousel-height);
  display:flex; flex-direction:column; justify-content:space-between;
  overflow:none; background:#fff; border:none; box-shadow:none;
  font-family:var(--font-body);
}
.about-grid, .about-copy, .value-card{ border:none !important; box-shadow:none !important }

/* ================== ALT SIRA: İŞ ORTAKLARIMIZ ================== */
.distributors{
  width:100vw;
  margin-left:calc(50% - 50vw);
  margin-right:calc(50% - 50vw);
  padding:20px clamp(24px, 4vw, 48px);
  text-align:center;
  background:#fff;
  border:none; border-radius:0;
}
.distributors h2{
  font-size:20px; margin-bottom:18px;
  color:#0a1e44; font-weight:800; font-family:var(--font-head);
}
.brand-logos{
  display:flex; justify-content:center; align-items:center; flex-wrap:wrap;
  gap:clamp(28px, 6vw, 96px);
}
.brand-item{ display:flex; align-items:center; justify-content:center }
.brand-item img{
  width:auto;
  max-width:clamp(140px, 12vw, 240px);
  max-height:clamp(50px, 8vh, 96px);
  object-fit:contain; display:block;
  transition:transform .2s ease;
}
.brand-item:hover img{ transform:scale(1.05) }

/* Ortada tek açıklama (opsiyonel) */
.brand-center-desc{
  margin-top:18px; font-size:15px; color:#0a1e44; text-align:center;
  max-width:700px; margin-left:auto; margin-right:auto; line-height:1.5; opacity:.85;
  font-family:var(--font-body);
}

/* ================== HAKKIMIZDA (GENEL SAYFA) ================== */
.about-hero{text-align:center}
.about-hero h1{margin-bottom:6px; font-family:var(--font-head); font-weight:800}
.about-hero .lead{opacity:.95}
.about-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:12px}
.kpi{background:#f7f9fc;border:1px solid #e9eef5;border-radius:12px;padding:14px;text-align:center}
.kpi-top{display:block;font-weight:800;font-size:20px;color:#0a1e44}
.kpi-label{display:block;font-size:13px;opacity:.8;font-family:var(--font-body)}
.about-grid{display:grid;grid-template-columns:1fr;gap:18px}
@media (min-width:1100px){ .about-grid{grid-template-columns:minmax(0,1fr) 520px;align-items:start} }
.about-copy h2{margin:4px 0 10px;font-size:22px}
.about-values{display:grid;grid-template-columns:1fr;gap:10px;margin:14px 0 6px}
@media (min-width:900px){ .about-values{grid-template-columns:repeat(3,minmax(0,1fr))} }
.value-card{background:#fff;border:1px solid #e9eef5;border-radius:12px;padding:14px}
.value-card h3{margin:0 0 6px;font-size:16px;color:#0a1e44;font-family:var(--font-head);font-weight:700}
.value-card p{margin:0;font-size:14px;opacity:.9;font-family:var(--font-body)}
.about-photo{position:relative}
.photo-card{margin:0;background:#fff;border:1px solid #e9eef5;border-radius:14px;overflow:hidden;box-shadow:0 6px 18px rgba(10,30,68,.06)}
.photo-card img{display:block;width:100%;height:360px;object-fit:cover}
.photo-card figcaption{padding:10px 12px;font-size:13px;color:#3a4a65;border-top:1px solid #eef3fa;background:#fafcff}

/* ================== BİZE ULAŞIN (FOOTER ÜSTÜ) ================== */
.site-cta-wide{
  background:#f3f6ff;
  border-top:1px solid #dbe5ff;
  border-bottom:1px solid #dbe5ff;
  margin:0; padding:0;
}
.site-cta-wide .cta-container{
  max-width:var(--content-max);
  padding:16px 24px;
  display:grid; grid-template-columns:1fr; gap:14px;
}
@media (min-width:900px){
  .site-cta-wide .cta-container{ grid-template-columns:2fr 1fr }
}
.cta-info h2{ font-size:18px; margin:0 0 6px; font-family:var(--font-head); font-weight:800 }
.cta-info .note{ font-size:14px; margin:0 0 6px; font-family:var(--font-body) }
.contact-inline{ gap:4px }
.contact-inline li{ font-size:14px }

/* Navigasyon + Telif solda; sosyal ikonlar sağda */
.cta-links-row{
  display:flex; align-items:flex-start; justify-content:space-between;
  gap:24px; flex-wrap:wrap; margin-top:20px;
}
.cta-links-left{ display:flex; flex-direction:column; align-items:flex-start; gap:6px }
.cta-links-column{ display:flex; flex-direction:column; gap:4px; font-weight:700; font-size:15px; font-family:var(--font-head) }
.cta-links-column a{ text-decoration:none; color:#0a1e44; transition:opacity .2s ease }
.cta-links-column a:hover{ opacity:.7 }

.footer-copy{ font-size:14px; color:#0a1e44; opacity:.8; margin-top:4px; font-family:var(--font-body) }

.social-links{ display:flex; gap:12px; align-items:center }
.social-links a{
  display:inline-flex; align-items:center; justify-content:center;
  width:36px; height:36px; border-radius:50%;
  background:#0a1e44; transition:transform .2s ease, opacity .2s ease;
}
.social-links a:hover{ transform:scale(1.08); opacity:.9 }
.social-links img{ width:20px; height:20px; object-fit:contain; filter:invert(1) }

/* ================== RESPONSIVE ================== */
@media (max-width:1199px){
  .home-split-2{ grid-template-columns:1fr }
  .about-side{ height:auto }
  .carousel{ height:320px; min-height:320px; width:100% }
  .distributors{
    width:100%;
    margin-left:0; margin-right:0;
    padding-left:24px; padding-right:24px;
  }
  .brand-item img{ max-width:140px; max-height:60px }
}
@media (max-width:900px){
  .contact-grid{ grid-template-columns:1fr }
  .map-embed{ height:420px }
}
@media (max-width:768px){
  .about-stats{ grid-template-columns:1fr }
  .photo-card img{ height:300px }
  .cta-links-row{ flex-direction:column; align-items:center; text-align:center }
  .cta-links-left{ align-items:center }
  .social-links{ justify-content:center }
}