:root{
  --text:#ffffff;
  --muted:#e5e7ebcc;
  --dot:#2563eb;
  --dot-dim:#93c5fd;
  --ctrl-bg:rgba(0,0,0,.45);
  --ctrl-bg-hover:rgba(0,0,0,.65);
  --shadow:0 10px 20px rgba(0,0,0,.35), 0 2px 6px rgba(0,0,0,.25);

  /* Yüzen buton renkleri */
  --promo-bg:#16a34a;    /* yeşil */
  --promo-bg-dark:#0f8a3d;
  --promo-glow:#34d399;  /* yumuşak yeşil parlama */
}

*{box-sizing:border-box}
html,body{height:100%}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,Helvetica,sans-serif;
  color:var(--text);
  background:#1e293b;
  line-height:1.55;
}

.container{width:min(1160px, 92%); margin-inline:auto}

h1{font-size: clamp(40px, 6vw, 84px); line-height:1.02; margin:0 0 14px}
h2{font-size: clamp(26px, 3.4vw, 36px); margin:0 0 10px}
h3{font-size: clamp(22px, 3vw, 30px); margin:0 0 10px}
p{margin:0 0 18px; color:var(--muted)}

/* HEADER */
.site-header{
  position:sticky; top:0; z-index:20;
  background:rgba(17, 20, 26, .65);
  backdrop-filter:saturate(140%) blur(8px);
  border-bottom:1px solid rgba(255,255,255,.06);
}
.nav{display:flex; align-items:center; gap:20px; padding:12px 0}
.logo{font-weight:800; text-decoration:none; color:#fff}
.menu{margin-left:auto; display:flex; gap:min(4vw,28px)}
.menu a{text-decoration:none; color:#fff; font-weight:600; opacity:.9; white-space:nowrap}
.menu a:hover{opacity:1}
.btn{
  display:inline-block; padding:12px 18px; border-radius:12px;
  text-decoration:none; font-weight:800;
  color:#111; background:#ffb300; box-shadow:var(--shadow);
}
.btn:hover{filter:brightness(.95)}

/* SLIDER */
.hero{padding:0}
.slider{position:relative; overflow:hidden}
.slides{position:relative}
.slide{
  display:none; position:relative;
  height:100vh; width:100%;
  background-size:cover; background-position:center; background-repeat:no-repeat;
}
/* net görünüm: hafif karartma, blur yok */
.slide::before{
  content:""; position:absolute; inset:0;
  background:rgba(0,0,0,.40);
}
@media (max-width:640px){
  .slide::before{background:rgba(0,0,0,.55);}
}
.slide.is-active{display:block}

.hero-grid{position:relative; z-index:1; height:100%; display:flex; align-items:center}
.hero-text{
  max-width:min(760px, 92%);
  padding: clamp(20px, 3vw, 36px);
  border-radius:16px;
  background:transparent;
}

/* Yazı animasyonu */
@keyframes riseIn {from{opacity:0; transform:translateY(22px);} to{opacity:1; transform:translateY(0);} }
.slide.is-active .hero-text > *{
  animation: riseIn 1.05s ease both; /* hız: 0.7s hızlı, 1.4s yavaş */
}
.slide.is-active .hero-text > *:nth-child(2){ animation-delay:.08s }
.slide.is-active .hero-text > *:nth-child(3){ animation-delay:.16s }

/* Oklar */
.ctrl{
  position:absolute; top:50%; transform:translateY(-50%);
  width:48px; height:48px; border-radius:50%;
  background:var(--ctrl-bg); color:#fff; border:none; cursor:pointer;
  font-size:28px; line-height:48px; text-align:center;
  box-shadow:var(--shadow); z-index:2;
}
.ctrl:hover{background:var(--ctrl-bg-hover)}
.prev{left:14px}
.next{right:14px}
@media (max-width:560px){.ctrl{width:44px; height:44px; line-height:44px}}

/* Noktalar */
.dots{position:absolute; inset:auto 0 18px 0; display:flex; justify-content:center; gap:12px; z-index:2}
.dot{
  width:12px; height:12px; border-radius:50%;
  background:var(--dot-dim);
  border:2px solid var(--dot);
  box-shadow:0 0 0 2px rgba(0,0,0,.25);
  cursor:pointer;
}
.dot.is-active{background:var(--dot)}

/* ÖRNEK VİDEOLAR */
.samples{padding:50px 0; background:#1f2937}
.samples h2{
  margin:0 0 18px;
  text-align:center;
  font-size: clamp(22px, 3vw, 28px);
  color:#f5f5f5;
}
.video-grid{
  display:grid; gap:16px;
  grid-template-columns: repeat(3, 1fr);
}
.video-grid video{
  width:100%; height: clamp(180px, 26vw, 260px);
  border-radius:12px; outline:none; background:#000;
  box-shadow:0 10px 20px rgba(0,0,0,.35);
}
@media (max-width:900px){
  .video-grid{grid-template-columns: repeat(2, 1fr);}
}
@media (max-width:560px){
  .video-grid{grid-template-columns: 1fr;}
}

/* İletişim */
.contact{
  padding:60px 0;
  background:#111;
  text-align:center;
}
.contact h2{
  margin-bottom:22px;
  font-size: clamp(20px, 2.2vw, 26px);
}
.contact-row{
  width:fit-content;
  margin:0 auto;
  display:flex;
  gap:16px;
  flex-wrap:wrap;
  justify-content:center;
}
/* eşit genişlik + daha belirgin yazı */
.contact-card{
  display:flex; align-items:center; justify-content:center;
  gap:8px;
  padding:12px 18px;
  border-radius:10px;
  background:rgba(243,246,247,0.04);
  backdrop-filter: blur(4px);
  color:#fff; font-weight:700; font-size:15px;
  text-decoration:none;
  border:1px solid rgba(255,255,255,.08);
  min-width:140px; text-align:center;
  transition:transform .2s ease, box-shadow .2s ease, background .2s ease;
}
.contact-card:hover{
  transform:translateY(-3px);
  background:rgba(255,255,255,.2);
  box-shadow:0 4px 14px rgba(255,255,255,.2);
}
.icon-img{display:block; width:20px; height:20px; object-fit:contain}
@media (max-width:520px){
  .contact-row{gap:12px}
  .contact-card{padding:10px 14px; min-width:120px;}
  .icon-img{width:18px; height:18px}
}

/* Footer */
.site-footer{border-top:1px solid rgba(255,255,255,.08); padding:24px 0; color:#d1d5db; text-align:center}

/* === SAĞ ALTA SABİT ÇAĞRI LOGOSU (parlama + nabız + halka) === */
.call-float{
  position:fixed; right:18px; bottom:18px;
  width:88px; height:88px;
  background:url("../foto/calllogo.png") center/contain no-repeat;
  border-radius:50%; z-index:60;
  box-shadow:0 10px 20px rgba(0,0,0,.35), 0 2px 6px rgba(0,0,0,.25);
  animation: call-pulse 2.2s ease-in-out infinite, call-glow 3.6s ease-in-out infinite;
}
.call-float::after{
  content:""; position:absolute; inset:0; border-radius:50%;
  box-shadow:0 0 0 0 rgba(52,211,153,.40);
  animation: call-ring 2.2s ease-out infinite;
}
.call-float:hover{transform:scale(1.06); filter:brightness(1.06)}
@keyframes call-pulse{0%,100%{transform:translateZ(0) scale(1)} 50%{transform:translateZ(0) scale(1.04)}}
@keyframes call-glow{0%,100%{box-shadow:0 12px 24px rgba(0,0,0,.35), 0 0 24px rgba(52,211,153,.35)} 50%{box-shadow:0 12px 24px rgba(0,0,0,.35), 0 0 40px rgba(52,211,153,.55)}}
@keyframes call-ring{0%{box-shadow:0 0 0 0 rgba(52,211,153,.45);opacity:1}70%{box-shadow:0 0 0 16px rgba(52,211,153,0);opacity:0}100%{box-shadow:0 0 0 0 rgba(52,211,153,0);opacity:0}}

/* === "İlk Ders Ücretsiz" yüzen buton === */
.promo-float{
  position:fixed; right:114px; bottom:98px;  /* çağrı butonunun üst/soluna */
  z-index:61;
  background:var(--promo-bg);
  color:#fff; text-decoration:none; font-weight:800;
  padding:10px 14px;
  border-radius:12px;
  box-shadow:0 10px 20px rgba(0,0,0,.25), 0 0 18px var(--promo-glow);
  animation: promo-bob 2.8s ease-in-out infinite, promo-glow 3.2s ease-in-out infinite;
  white-space:nowrap;
}
.promo-float:hover{background:var(--promo-bg-dark)}
@keyframes promo-bob{0%,100%{ transform:translateY(0)}50%{ transform:translateY(-4px)}}
@keyframes promo-glow{0%,100%{ box-shadow:0 10px 20px rgba(0,0,0,.25), 0 0 14px var(--promo-glow)}50%{ box-shadow:0 10px 24px rgba(0,0,0,.3), 0 0 22px var(--promo-glow)}}

/* Küçük ekranda konumları sıkıştır */
@media (max-width:560px){
  .call-float{width:56px; height:56px; right:14px; bottom:14px}
  .promo-float{right:84px; bottom:72px; padding:8px 10px; font-size:14px}
}

/* Hareket azaltma tercihine saygı */
@media (prefers-reduced-motion: reduce){
  .call-float, .promo-float{ animation: none !important }
  .call-float::after{ display:none }
}

/* ---------- HAKKIMIZDA ÖZEL ---------- */

/* Üst başlık şeridi */
.subhero{
  background: linear-gradient(135deg, #0f1115 0%, #12151c 100%);
  border-bottom:1px solid rgba(255,255,255,.06);
}
.subhero-inner{
  padding: clamp(36px, 8vw, 80px) 0 clamp(22px, 4vw, 36px);
  text-align:center;
}
.subhero h1{
  margin:0 0 8px;
  font-size: clamp(28px, 4vw, 46px);
  font-weight:800;
}
.crumbs{
  margin-top:10px;
  display:flex;
  gap:10px;
  justify-content:center;
  font-size:14px;
  color:#d1d5db;
}
.crumbs a{color:#c7d2fe; text-decoration:none}
.crumbs span{opacity:.75}

/* Samimi anlatım bloğu */
.about{
  padding:48px 0;
  background:#0f1622;
  text-align:center;
}
.about h2{
  font-size: clamp(22px, 3vw, 32px);
  margin-bottom:16px;
}
.about p{
  max-width:860px;
  margin:0 auto;
  font-size:17px;
  line-height:1.7;
  color:#e5e7eb;
}

/* Kurumsal tablo */
.about-table{
  padding:24px 0 56px;
  background:#0f1622;
}
.table-title{
  margin-bottom:16px;
  color:#e5e7eb;
  text-align:center;
  font-size: clamp(20px, 2.5vw, 28px);
}
.table-grid{
  display:grid;
  gap:10px;
  border-radius:12px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.03);
  backdrop-filter:blur(4px);
  max-width:900px;
  margin:0 auto;
}
.row{
  display:grid;
  grid-template-columns: 220px 1fr;
}
.cell{
  padding:14px 16px;
}
.cell.key{
  background:rgba(255,255,255,.04);
  font-weight:700;
  color:#e6e9f2;
}
.cell.val{
  color:#e8ebf6;
}
.row + .row .cell{
  border-top:1px solid rgba(255,255,255,.06);
}

@media (max-width:720px){
  .row{grid-template-columns:1fr}
  .cell.key{border-bottom:1px solid rgba(255,255,255,.06)}
}

/* ====== PAKETLER SAYFASI ====== */
.packages{
  background:#0b0b0b;
  padding:30px 0 60px; /* üst boşluk makul */
}
.pkg-grid{
  display:grid; gap:24px;
  grid-template-columns: repeat(3, 1fr);
}
@media (max-width:980px){ .pkg-grid{grid-template-columns:1fr 1fr} }
@media (max-width:560px){ .pkg-grid{grid-template-columns:1fr} }

/* Kart */
.pkg-card{
  position:relative; overflow:hidden;
  border-radius:16px;
  background:#fff; color:#111;
  box-shadow: 0 18px 34px rgba(0,0,0,.28);
  transition: transform .25s ease, box-shadow .25s ease;

  /* hizalama için */
  display:flex; flex-direction:column;
  min-height: 520px;
}
.pkg-card:hover{
  transform: translateY(-6px);
  box-shadow: 0 26px 46px rgba(0,0,0,.34);
}
@media (max-width:980px){
  .pkg-card{ min-height: 500px; }
}
@media (max-width:560px){
  .pkg-card{ min-height: 460px; }
}

/* Üst görsel bant (kart fotoğrafı) */
.pkg-media{
  height:72px;
  background-size:cover; background-position:center;
  flex:0 0 72px;
}
.pkg-card.k1 .pkg-media{ background-image:url("../foto/paket1.jpg"); }
.pkg-card.k2 .pkg-media{ background-image:url("../foto/paket2.jpg"); }
.pkg-card.k3 .pkg-media{ background-image:url("../foto/paket3.jpg"); }

/* Başlık alanı */
.pkg-head{ padding:0 18px 8px }
.pkg-head h2{
  margin:0 0 4px;
  font-size: clamp(18px, 2.8vw, 26px);
  color:#0f172a;
}

/* Başlık üstü chipler */
.chip{
  display:inline-block;
  font-weight:800;
  border-radius:12px;
  padding:6px 10px;
  font-size:14px;
  letter-spacing:.2px;
  color:#0f172a;
  background:#e5e7eb;
  line-height:1;
}
.chip-blue{ background:#dbe6ff; color:#1e3a8a }
.chip-green{ background:#dcfce7; color:#166534 }
.chip-purple{ background:#efe6ff; color:#5b21b6 }
.chip-sub{
  margin-left:8px;
  color:#475569;
  font-weight:700;
  line-height:1;
}

/* Liste */
.pkg-list{
  list-style:none; margin:8px 0 16px; padding:0 18px 0 18px;
}
.pkg-list li{
  display:flex; align-items:flex-start; gap:10px;
  padding:10px 0; border-bottom:1px dashed rgba(2,6,23,.08);
  font-size: clamp(15px, 2.2vw, 18px);
  color:#111827;
}
.pkg-list li:last-child{ border-bottom:0 }

/* Onay ikonu (SVG) */
.pkg-list svg{
  flex:0 0 20px; width:20px; height:20px;
  fill:#16a34a;
  margin-top:2px;
}

/* CTA */
.pkg-cta{
  display:block;
  margin:8px 18px 18px;
  text-align:center; text-decoration:none; font-weight:800;
  padding:14px 18px; border-radius:12px; color:#fff;
  background: linear-gradient(135deg, #ff6a00 0%, #ff2d55 100%);
  box-shadow: 0 8px 18px rgba(255, 90, 64, .35);
  margin-top:auto; /* butonu alta sabitle */
}
.pkg-cta:hover{ filter:brightness(.96) }

/* ================== NAV – MOBİL UYUMLU AÇ/KAPA ================== */

/* Desktop: hamburger görünmesin */
.nav-toggle{
  display:none;
  background:transparent; border:0; color:#fff; cursor:pointer;
}
.nav-toggle .icon-burger{ display:block }
.nav-toggle .icon-close{ display:none }

/* Backdrop varsayılan */
.nav-backdrop{ display:none }

/* ── Mobil görünüm ─────────────────────────────────────────────── */
@media (max-width: 768px){

  .nav{ gap:12px; padding:10px 0 }

  /* Hamburger mobilde görünsün */
  .nav-toggle{
    display:inline-flex;
    width:40px; height:40px;
    align-items:center; justify-content:center;
  }

  /* Menü: mobilde kapalı (varsayılan) */
  .menu{
    position:fixed;
    top:64px; right:0; left:0;
    display:none;
    flex-direction:column;
    gap:14px;
    padding:16px 20px;
    background:#0f1622;
    border-bottom:1px solid rgba(255,255,255,.08);
    z-index:50;
    box-shadow:0 18px 30px rgba(0,0,0,.35);
  }

  /* Açıkken göster */
  body.menu-open .menu{ display:flex }

  /* Backdrop */
  .nav-backdrop{
    position:fixed; inset:0;
    background:rgba(0,0,0,.45);
    backdrop-filter:saturate(120%) blur(2px);
    z-index:40;
  }
  body.menu-open .nav-backdrop{ display:block }

  /* Açık/kapalı ikon değişimi */
  body.menu-open .nav-toggle .icon-burger{ display:none }
  body.menu-open .nav-toggle .icon-close{ display:block }

  /* İstersen üstteki “Başlayın” butonunu mobilde gizleyebilirsin: */
  /* .btn{ display:none } */
}

/* Daha dar telefonlarda menü iç boşluklarını küçült */
@media (max-width: 420px){
  .menu{ padding:12px 14px; gap:12px }
}
