/* ========== Katalog sayfası ========== */
.ktl-ic{ max-width:1300px; margin:0 auto; padding:0 44px; }

/* --- ÜST --- */
.ktl-hero{ position:relative; overflow:hidden; padding:64px 0 72px; color:#fff;
  background:linear-gradient(160deg,#08192b 0%,#0b2338 46%,#07293a 100%); }
.ktl-hero .ktl-fon{ position:absolute; inset:0; z-index:0; }
.ktl-hero .ktl-fon .o{ position:absolute; border-radius:50%; filter:blur(105px); display:block; }
.ktl-hero .ktl-fon .o1{ width:520px; height:520px; left:-150px; top:-190px; background:#1f7d6a; opacity:.42; }
.ktl-hero .ktl-fon .o2{ width:600px; height:430px; right:-130px; bottom:-230px; background:#1c5c8a; opacity:.34; }
.ktl-hero .ktl-ic{ position:relative; z-index:1; }
.ktl-hero-grid{ display:grid; grid-template-columns:1.15fr .85fr; gap:56px; align-items:center; }

.ktl-yol{ font-size:13px; color:rgba(200,220,235,.72); margin-bottom:20px; display:flex; gap:8px; align-items:center; }
.ktl-yol a{ color:inherit; text-decoration:none; } .ktl-yol a:hover{ color:#7ff0c0; }
.ktl-yol b{ color:#fff; }

.ktl-etiket{ display:inline-flex; align-items:center; gap:9px; font-size:11.5px; font-weight:800;
  letter-spacing:.20em; text-transform:uppercase; color:#7ef0ae; background:rgba(47,190,110,.12);
  border:1px solid rgba(47,190,110,.30); padding:7px 16px; border-radius:999px; margin-bottom:18px; }
.ktl-etiket .nokta{ width:7px; height:7px; border-radius:50%; background:#2fbe6e; box-shadow:0 0 0 4px rgba(47,190,110,.20); }

.ktl-hero h1{ margin:0 0 14px; font-family:'Poppins',system-ui,sans-serif; font-weight:800;
  font-size:clamp(28px,3.4vw,44px); line-height:1.14; letter-spacing:-.02em; }
.ktl-hero h1 em{ font-style:normal; background:linear-gradient(100deg,#8fe3b0,#4fd8d0 50%,#7cc4ff);
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent; }
.ktl-hero-metin > p{ margin:0; font-size:15.5px; line-height:1.75; color:rgba(206,224,238,.82); max-width:560px; }

.ktl-ozet{ display:flex; flex-wrap:wrap; gap:10px; margin-top:26px; }
.ktl-ozet span{ display:flex; flex-direction:column; gap:2px; padding:11px 18px; border-radius:13px;
  background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12); }
.ktl-ozet b{ font-size:19px; font-weight:800; color:#fff; line-height:1; }
.ktl-ozet small{ font-size:11px; color:rgba(190,214,230,.78); letter-spacing:.06em; text-transform:uppercase; }

.ktl-cta{ display:flex; gap:12px; margin-top:30px; flex-wrap:wrap; }
.ktl-btn-dolu,.ktl-btn-bos{ display:inline-flex; align-items:center; gap:9px; padding:14px 24px;
  border-radius:12px; font-weight:800; font-size:14.5px; text-decoration:none; transition:.25s; }
.ktl-btn-dolu svg,.ktl-btn-bos svg{ width:17px; height:17px; }
.ktl-btn-dolu{ color:#06202c; background:linear-gradient(115deg,#7ff0c0,#62dced 48%,#8ec9ff);
  background-size:200% 100%; box-shadow:0 12px 28px rgba(89,213,224,.34); }
.ktl-btn-dolu:hover{ background-position:100% 0; transform:translateY(-2px); color:#06202c;
  box-shadow:0 18px 36px rgba(89,213,224,.46); }
.ktl-btn-bos{ color:#fff; border:1.5px solid rgba(255,255,255,.5); }
.ktl-btn-bos:hover{ background:rgba(255,255,255,.12); border-color:#fff; color:#fff; }

/* kitap kapağı */
.ktl-hero-kapak{ display:flex; justify-content:center; }
.ktl-kitap{ position:relative; display:block; width:min(330px,86%); border-radius:6px 12px 12px 6px;
  overflow:hidden; transform:perspective(1400px) rotateY(-13deg) rotateX(3deg);
  box-shadow:-16px 26px 54px rgba(0,0,0,.55), 0 4px 12px rgba(0,0,0,.35);
  transition:transform .6s cubic-bezier(.2,.8,.25,1), box-shadow .6s; }
.ktl-kitap:hover{ transform:perspective(1400px) rotateY(-5deg) rotateX(1deg) translateY(-8px) scale(1.02);
  box-shadow:-10px 34px 66px rgba(0,0,0,.6), 0 6px 16px rgba(0,0,0,.4); }
.ktl-kitap img{ display:block; width:100%; height:auto; }
.ktl-kitap .sirt{ position:absolute; left:0; top:0; bottom:0; width:16px; z-index:2;
  background:linear-gradient(90deg, rgba(0,0,0,.42), rgba(255,255,255,.16) 46%, rgba(0,0,0,.20)); }
.ktl-kitap .parlama{ position:absolute; inset:0; z-index:3; pointer-events:none;
  background:linear-gradient(112deg, transparent 38%, rgba(255,255,255,.30) 52%, transparent 66%);
  transform:translateX(-130%); transition:transform .9s cubic-bezier(.25,.7,.3,1); }
.ktl-kitap:hover .parlama{ transform:translateX(130%); }

/* --- OKUYUCU --- */
.ktl-okuyucu-bolum{ padding:66px 0 60px; background:linear-gradient(180deg,#f4f8fa,#eef4f7); }
.ktl-bolum-baslik{ text-align:center; max-width:740px; margin:0 auto 34px; }
.ktl-bolum-baslik .ust-etiket{ display:inline-block; font-size:11.5px; font-weight:800;
  letter-spacing:.22em; text-transform:uppercase; color:#2AA15C; margin-bottom:12px; }
.ktl-bolum-baslik h2{ margin:0 0 12px; font-family:'Poppins',system-ui,sans-serif; font-weight:800;
  font-size:clamp(24px,2.7vw,33px); color:#0b1e34; letter-spacing:-.015em; }
.ktl-bolum-baslik p{ margin:0; font-size:15px; line-height:1.7; color:#5a6b7c; }

.ktl-okuyucu{ border-radius:20px; overflow:hidden; background:#0b1e34;
  box-shadow:0 26px 56px rgba(11,30,52,.24); }
.ktl-cubuk{ display:flex; align-items:center; justify-content:space-between; gap:14px;
  padding:14px 18px; background:linear-gradient(180deg,#12304e,#0e2841); flex-wrap:wrap; }
.ktl-dosya{ display:inline-flex; align-items:center; gap:10px; color:#dbe8f2; min-width:0; }
.ktl-dosya svg{ width:19px; height:19px; color:#7ff0c0; flex:none; }
.ktl-dosya b{ font-size:14px; font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ktl-dosya i{ font-style:normal; font-size:11.5px; color:rgba(190,214,230,.72); letter-spacing:.06em;
  border-left:1px solid rgba(255,255,255,.16); padding-left:10px; white-space:nowrap; }
.ktl-arac{ display:inline-flex; gap:8px; flex:none; }
.ktl-tam,.ktl-indir{ display:inline-flex; align-items:center; gap:7px; padding:9px 14px; border-radius:10px;
  font-size:13px; font-weight:700; cursor:pointer; text-decoration:none;
  background:rgba(255,255,255,.09); border:1px solid rgba(255,255,255,.16); color:#fff; transition:.22s; }
.ktl-tam svg,.ktl-indir svg{ width:15px; height:15px; }
.ktl-tam:hover,.ktl-indir:hover{ background:linear-gradient(135deg,#2aa15c,#2fbe6e); border-color:transparent; color:#fff; }

.ktl-cerceve{ position:relative; background:#233a52; }
.ktl-cerceve iframe{ display:block; width:100%; height:min(84vh,900px); border:0; background:#233a52; }
.ktl-yedek{ padding:40px; text-align:center; color:#dbe8f2; }
.ktl-not{ margin:16px auto 0; max-width:760px; text-align:center; font-size:13px; color:#6b7c8c; }

/* tam ekran */
.ktl-okuyucu.tam-ekran{ position:fixed; inset:0; z-index:9999; border-radius:0; }
.ktl-okuyucu.tam-ekran .ktl-cerceve iframe{ height:calc(100vh - 62px); }

/* --- ALT --- */
.ktl-alt{ padding:64px 0 84px; background:#fff; }
.ktl-alt-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.ktl-kutu{ padding:28px 24px; border-radius:18px; background:linear-gradient(180deg,#f7fafb,#f1f6f8);
  border:1px solid #e5edf1; transition:transform .3s, box-shadow .3s, border-color .3s; }
.ktl-kutu:hover{ transform:translateY(-5px); box-shadow:0 20px 38px rgba(11,30,52,.10); border-color:#cfe3d9; }
.ktl-kutu .ikon{ width:46px; height:46px; border-radius:13px; display:grid; place-items:center;
  background:linear-gradient(140deg,#0f4c5c,#1f7d6a); color:#fff; margin-bottom:15px;
  box-shadow:0 10px 20px rgba(15,76,92,.24); }
.ktl-kutu .ikon svg{ width:23px; height:23px; }
.ktl-kutu h3{ margin:0 0 8px; font-size:16.5px; font-weight:800; color:#0b1e34; font-family:'Poppins',system-ui,sans-serif; }
.ktl-kutu p{ margin:0 0 12px; font-size:13.8px; line-height:1.65; color:#5a6b7c; }
.ktl-kutu a{ font-size:13.5px; font-weight:800; color:#2AA15C; text-decoration:none; }
.ktl-kutu a:hover{ color:#1f6f7d; }

/* --- duyarlı --- */
@media (max-width:1080px){
  .ktl-ic{ padding:0 24px; }
  .ktl-hero-grid{ grid-template-columns:1fr; gap:38px; }
  .ktl-hero-kapak{ order:-1; }
  .ktl-kitap{ width:min(280px,70%); transform:perspective(1200px) rotateY(-8deg); }
  .ktl-alt-grid{ grid-template-columns:1fr; }
}
@media (max-width:640px){
  .ktl-hero{ padding:48px 0 54px; }
  .ktl-cerceve iframe{ height:70vh; }
  .ktl-dosya i{ display:none; }
  .ktl-tam span,.ktl-indir span{ display:none; }
  .ktl-ozet span{ padding:9px 14px; }
}


/* ==========================================================================
   ===== MOBIL-PRO BASLANGIC (katalog okuyucu) ==============================
   Geri almak icin BASLANGIC - BITIS arasini silin.
   ========================================================================== */

/* Cerceve yuksekligi: pencere kisa olsa bile en az 600px, buyuk ekranda 1150px */
.ktl-cerceve iframe{ height:clamp(600px, 88vh, 1150px); }

/* Telefon karti varsayilan olarak gizli */
.ktl-mobil-kart{ display:none; }

@media (max-width:640px){

  /* Cift kenar boslugu: bolum 18px + .ktl-ic 24px idi */
  .ktl-ic{ padding-left:0; padding-right:0; }

  /* Telefonda gomulu PDF ~290px genislikte kaliyor ve okunmuyor;
     bunun yerine tam ekran acan buyuk bir kart gosteriliyor. */
  .ktl-cerceve{ display:none; }
  .ktl-cubuk .ktl-arac{ display:none; }

  .ktl-mobil-kart{ display:block; padding:16px 14px 18px; }

  /* Gomulu cerceve olmadigi icin uyari notu telefonda gereksiz */
  .ktl-not{ display:none; }

  .ktl-mobil-ac{
    display:flex; align-items:center; gap:14px;
    padding:18px 16px; border-radius:16px; text-decoration:none;
    background:linear-gradient(135deg,#2aa15c,#2fbe6e); color:#fff;
    box-shadow:0 14px 30px rgba(42,161,92,.35);
  }
  .ktl-mobil-ikon{
    flex:0 0 auto; width:42px; height:42px;
    display:grid; place-items:center; border-radius:12px;
    background:rgba(255,255,255,.18);
  }
  .ktl-mobil-ikon svg{ width:22px; height:22px; }

  .ktl-mobil-yazi{ display:block; line-height:1.35; }
  .ktl-mobil-yazi strong{ display:block; font-size:16.5px; font-weight:700; }
  .ktl-mobil-yazi small{ display:block; font-size:12.5px; opacity:.85; margin-top:3px; }

  .ktl-mobil-indir{
    display:block; margin-top:10px; text-align:center;
    padding:13px 16px; border-radius:14px;
    border:1px solid rgba(255,255,255,.28);
    color:#dfeaf3; text-decoration:none;
    font-size:14.5px; font-weight:600;
  }
}

/* ===== MOBIL-PRO BITIS (katalog okuyucu) ================================= */
