:root{--blue:#28378c;--red:#d32f2f;--bg:#ffffff;--text:#28378c}
*{box-sizing:border-box}
html{color-scheme:light;background:#fff}
body{margin:0;font-family:'Segoe UI',system-ui,Arial,sans-serif;background:#fff;color:var(--text)}
.container{max-width:1100px;margin:0 auto;padding:0 16px}

/* Header & Logo */
.site-header{position:sticky;top:0;background:#fff;border-bottom:1px solid #28378c22;z-index:1000}
.head{display:flex;align-items:center;justify-content:space-between;padding:10px 0;gap:10px}
.brand{display:block;line-height:0}
.logo{height:64px;width:auto;display:block;object-fit:contain;image-rendering:auto}
.nav{display:flex;gap:14px;flex-wrap:wrap}
.nav a{color:var(--text);text-decoration:none;font-weight:700;opacity:.9;border-bottom:2px solid transparent;padding-bottom:4px}
.nav a:hover{opacity:1;border-color:var(--blue)}

/* Ticker */
.ticker{border-top:1px solid #28378c22;border-bottom:1px solid #28378c22;background:#fff}
.ticker .container{display:flex;align-items:center;gap:10px;padding:8px 0;overflow:hidden}
.badge{background:var(--red);color:#fff;font-weight:700;font-size:12px;padding:4px 8px;border-radius:999px}
.track{display:flex;gap:28px;white-space:nowrap;animation:scroll 40s linear infinite}
.track a{color:var(--text);text-decoration:none;opacity:.95}
@keyframes scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* Hero */
.hero{padding:56px 0 24px;text-align:center}
.hero h1{margin:0 0 10px 0;font-size:28px}
.hero h1 span{color:var(--blue)}
.hero p{max-width:760px;margin:0 auto 10px;opacity:.95}
.btn{display:inline-block;background:var(--blue);color:#fff;text-decoration:none;border-radius:10px;padding:12px 20px;font-weight:800;border:1px solid var(--blue)}
.btn:hover{filter:brightness(1.03)}
.btn.outline{background:transparent;color:var(--blue)}
.btn.red{background:var(--red);border-color:var(--red)}

/* Promo board */
.promo{padding:18px 0;border-top:1px solid #28378c22;border-bottom:1px solid #28378c22;background:#fff;position:relative}
.p-viewport{overflow:hidden}
.p-track{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;padding-bottom:10px}
.p-card{scroll-snap-align:start;border:1px solid var(--blue);border-radius:12px;background:#fff;width:320px;flex:0 0 320px}
.p-media{position:relative;width:100%;aspect-ratio:16/9;background:#fff;overflow:hidden;border-bottom:1px solid var(--blue)}
.p-media img,.p-media video{width:100%;height:100%;object-fit:cover;display:block}
.p-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);background:rgba(0,0,0,.55);color:#fff;width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:18px}
.p-meta{padding:10px}
.p-nav{position:absolute;top:50%;transform:translateY(-50%);background:var(--blue);color:#fff;border:0;width:36px;height:36px;border-radius:50%;cursor:pointer}
.p-nav.prev{left:6px}.p-nav.next{right:6px}

/* Services */
.services{padding:32px 0}
.title{margin:0 0 16px;font-size:22px}
.grid{display:grid;grid-template-columns:repeat(5,minmax(140px,1fr));gap:10px}
.card{border:1px solid var(--blue);border-radius:12px;padding:14px;text-align:center;background:#fff}
.card i{font-size:24px;color:var(--blue)}.card h3{margin:8px 0 4px;font-size:15px}.card p{margin:0;opacity:.95;font-size:.9rem}

/* News */
.news{padding:26px 0 28px}
.list{display:grid;grid-template-columns:1fr;gap:10px}
.item{display:flex;gap:12px;border:1px solid var(--blue);border-radius:12px;padding:12px;background:#fff}
.item h3{margin:0 0 6px}.item p{margin:0;opacity:.95}

/* Contact */
.contact{padding:32px 0}
.cols{display:flex;gap:16px;flex-wrap:wrap}
.form{flex:1;display:flex;flex-direction:column;gap:10px}
.form input,.form textarea{border:1px solid var(--blue);border-radius:10px;padding:12px;background:#fff;color:var(--text)}
.form textarea{min-height:110px}
.info{flex:1;align-self:start}

/* Footer */
.site-footer{background:var(--blue);color:#fff;text-align:center;padding:14px}

/* WhatsApp */
.wa{position:fixed;right:16px;bottom:16px;width:52px;height:52px;border-radius:50%;border:0;background:var(--blue);color:#fff;font-size:22px;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 18px rgba(0,0,0,.18);cursor:pointer}

/* Mobile */
@media (max-width:640px){
  .logo{height:58px}
  .grid{grid-template-columns:repeat(2,minmax(130px,1fr))}
  .p-card{width:86vw;flex-basis:86vw}.p-nav{display:none}
}
/* ---- LOGO FIX ---- */
.site-header, .head, .brand, .brand picture, .brand img { background:#fff !important; }
.brand img { box-shadow:none !important; filter:none !important; outline:0; }
.logo{ height:64px; width:auto; object-fit:contain; }
@media (max-width:480px){ .logo{ height:58px } }

/* ---- TICKER OVERLAP FIX ---- */
.ticker .container{ position:relative; display:flex; align-items:center; gap:10px; overflow:hidden; }
.badge{ flex:0 0 auto; z-index:2; }
#ticker-track{ 
  flex:1; min-width:0; display:flex; gap:28px; white-space:nowrap;
  animation:scroll var(--t,40s) linear infinite; 
  padding-left:12px;           /* etiketten güvenli mesafe */
}
.ticker:hover #ticker-track{ animation-play-state:paused; }

/* Sol–sağta soldurma maskesi (yazı etiketin üstüne çıkmasın) */
.ticker .container::before,
.ticker .container::after{
  content:""; position:absolute; top:0; bottom:0; width:28px; pointer-events:none; z-index:1;
}
.ticker .container::before{ left:0;  background:linear-gradient(to right,#fff,transparent); }
.ticker .container::after { right:0; background:linear-gradient(to left,#fff,transparent); }

/* --- Menü ortada --- */
.site-header .head{
  display:flex;
  justify-content:center;   /* nav'ı tam ortaya al */
  align-items:center;
}
.nav{ display:flex; gap:16px; flex-wrap:wrap; }
.nav.nav-center{ justify-content:center; }

/* --- Hero + Logo --- */
.hero .container{ text-align:center; }
.brand-logo{ height:64px; width:auto; display:inline-block; margin:0 auto 10px; }
@media (max-width:480px){
  .brand-logo{ height:58px; }
}

/* Güvenli beyaz zemin (karanlık moda zorlamayı kapat) */
html,body{ background:#fff; }
/* === REKLAM PANOSU: ORTADA + KAYDIRILABİLİR === */

/* Viewport'u sayfa ortasına yerleştir */
.promo .container{
  display: grid;
  justify-items: center;   /* içeriği ortala */
}

.p-viewport{
  width: 100%;
  max-width: 1000px;       /* istersen 900-1100 arası ayarla */
  margin: 0 auto;
  overflow: hidden;         /* oklar taşmasın */
}

/* SCROLL TAŞIYICI: mutlaka flex + overflow-x:auto olmalı */
.p-track{
  display: flex !important;
  gap: 12px;
  overflow-x: auto !important;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  padding: 0 6px 10px;
  /* Ortalamayı track'te değil viewport'ta yapıyoruz */
}

/* Kart ölçüsü ve snap */
.p-card{
  flex: 0 0 320px;         /* kart genişliği */
  scroll-snap-align: start;
}

/* Oklar aynı kalsın; istersen mobilde gizle */
@media (max-width: 640px){
  .p-nav{ display:none; }
}
/* === LIGHTBOX: YOUTUBE'U BUYUT === */
.lb{ align-items: center; justify-content: center; }

.lb-content{
  background:#000;
  border-radius:12px;
  overflow:hidden;
  width: min(1100px, 96vw);      /* masaüstünde geniş */
}

.lb-body{
  width:100%;
  aspect-ratio: 16 / 9;          /* 16:9 çerçeve */
}

/* Player alanını tamamen doldur */
.lb iframe,
.lb video{
  width:100% !important;
  height:100% !important;
  display:block;
}

/* Küçük ekran: tam genişlik, kenarsız */
@media (max-width:640px){
  .lb-content{ width:100vw; border-radius:0; }
  .lb-body{ aspect-ratio:16 / 9; }
}

/* Yatay/düşük yükseklik ekranlar için yükseklik öncelikli */
@media (max-height:520px){
  .lb-content{ width:100vw; }
  .lb-body{ height:92vh; aspect-ratio:auto; }
  .lb iframe, .lb video{ height:92vh !important; }
}
