/*
 * FaturaTek tanıtım sayfası stili.
 * Tasarım dili uygulamayla ORTAK (kağıt zemin, beyaz kart, marka kırmızısı,
 * lacivert koyu bölüm, Mona Sans); kod ortak değil — bu sayfa React
 * çalıştırmıyor, sunucudan düz HTML gidiyor.
 */
:root{
  --kagit:#F7F5F4; --yuzey:#FFFFFF; --kenar:#E4DFDD;
  --metin:#1F1B19; --ikincil:#57504D; --soluk:#8A817C;
  --marka:#A3211F; --marka-parlak:#DC2626; --marka-acik:#F0625E;
  --koyu:#131A2B; --koyu-2:#1B2438;
  --golge:0 1px 2px rgba(24,20,18,.04), 0 10px 28px rgba(24,20,18,.05);
  --kap:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--kagit);color:var(--metin);
  font-family:'Mona Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,sans-serif;
  font-optical-sizing:auto;-webkit-font-smoothing:antialiased;line-height:1.6;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4{margin:0;letter-spacing:-.02em;line-height:1.2}
p{margin:0}
.kap{width:100%;max-width:var(--kap);margin:0 auto;padding:0 24px}

/* ── Düğmeler ─────────────────────────────────────────── */
.dugme{
  display:inline-flex;align-items:center;gap:8px;justify-content:center;
  height:48px;padding:0 22px;border-radius:10px;font-size:15.5px;font-weight:600;
  transition:background-color .15s ease,color .15s ease,border-color .15s ease;
  white-space:nowrap;
}
.dugme-dolu{background:var(--marka);color:#fff}
.dugme-dolu:hover{background:#8E1C1A}
.dugme-cerceve{border:1px solid var(--kenar);background:var(--yuzey);color:var(--metin)}
.dugme-cerceve:hover{background:#FBF7F6}
.dugme-beyaz{background:#fff;color:var(--marka)}
.dugme-beyaz:hover{background:#FBEDEC}
.dugme.buyuk{height:54px;padding:0 30px;font-size:16.5px}

/* ── Üst bar ──────────────────────────────────────────── */
/* 🔴 Üst çubuk MARKA KIRMIZISI (e-imzatek.com ile aynı dil): sayfa başında
   #DC2626, kaydırınca koyu laciverte döner — iki kardeş site aynı hissi
   versin diye. Kaydırma sınıfını alt.php'deki betik ekliyor. */
.ust{background:var(--marka-parlak);position:sticky;top:0;z-index:50;
  border-bottom:1px solid rgba(255,255,255,.12);transition:background .25s ease, box-shadow .25s ease}
.ust.kayd{background:var(--koyu);box-shadow:0 10px 30px rgba(0,0,0,.22)}
.ust-ic{display:flex;align-items:center;gap:28px;height:72px}
.marka img{height:34px;width:auto}
.menu{display:flex;gap:24px;margin-left:8px;flex:1}
.menu a{font-size:14.5px;color:rgba(255,255,255,.88)}
.menu a:hover{color:#fff}
.ust-eylem{display:flex;align-items:center;gap:14px}
.bag-giris{display:inline-flex;align-items:center;white-space:nowrap;height:42px;padding:0 18px;font-size:14.5px;font-weight:600;color:#fff;
  border:1px solid rgba(255,255,255,.34);border-radius:10px;transition:background .2s,border-color .2s}
.bag-giris:hover{background:rgba(255,255,255,.1);border-color:#fff}
.ayrac{width:1px;height:24px;background:rgba(255,255,255,.28)}
.ust .dugme{height:42px;font-size:14.5px;padding:0 18px;white-space:nowrap}

/* ── Kahraman ─────────────────────────────────────────── */
.kahraman{background:var(--koyu);color:#fff;overflow:hidden}
.kahraman-ic{display:grid;grid-template-columns:1.05fr .95fr;gap:40px;align-items:center;padding-top:64px;padding-bottom:64px}
.rozet{display:inline-flex;align-items:center;gap:9px;font-size:13px;color:#C9CDD8;
  border:1px solid rgba(255,255,255,.14);border-radius:999px;padding:7px 14px;margin-bottom:22px}
.nokta{width:7px;height:7px;border-radius:50%;background:var(--marka-acik);box-shadow:0 0 0 4px rgba(240,98,94,.18)}
.kahraman h1{font-size:clamp(34px,4.4vw,54px);font-weight:700}
.kahraman h1 .vurgu{color:var(--marka-acik)}
.alt-metin{margin-top:18px;font-size:17px;color:#B9BFCC;max-width:46ch}
.kahraman-dugmeler{display:flex;gap:12px;margin-top:30px;flex-wrap:wrap}
.kahraman-liste{display:flex;gap:22px;list-style:none;padding:0;margin:26px 0 0;flex-wrap:wrap}
.kahraman-liste li{font-size:13.5px;color:#B9BFCC;display:flex;align-items:center;gap:8px}
.kahraman-liste li::before{content:"";flex:none;width:16px;height:16px;border-radius:50%;
  background:rgba(16,185,129,.16) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.2 8.3l2.5 2.5 5.1-5.3' fill='none' stroke='%2334D399' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/16px no-repeat;
  border:1px solid rgba(16,185,129,.55)}

/* Sahne: kalp (screen karışımı) + robot */
.sahne{position:relative;aspect-ratio:1/1;max-width:520px;margin-left:auto}
.kalp{position:absolute;left:5%;top:0;width:90%;aspect-ratio:1200/942;
  background:url(/varlik/auth-kalp.jpg) center/contain no-repeat;mix-blend-mode:screen}
.robot{position:absolute;left:26%;bottom:0;height:42%;width:auto}
/*
 * Belge + logo yapbozu — uygulamadaki geometrinin aynısı:
 *   logo genişliği = belgenin %295'i (şerit belgenin TÜM dişlerine oturur),
 *   sağ kenar -%5,3 (şeridin sağ ucu belgenin sağ kenarına),
 *   translateY %4,2 (tam geçme %6,2 olurdu; küçük boşluk kalsın, belge
 *   logodan koparılmış parça gibi dursun), çentik "tek"in t'sini işaret eder.
 * 🔴 `.belge img{width:100%}` seçicisi (0,1,1) `.belge-logo` (0,1,0) kuralını
 *    EZİYORDU → logo belge genişliğine sıkışıp geometri bozuluyordu. Logo
 *    kuralı aynı özgüllükte ve daha spesifik yazıldı.
 */
.belge{position:absolute;top:32.36%;left:49.82%;width:11.07%}
.belge img{width:100%;height:auto}
.belge img.belge-logo{position:absolute;right:-5.3%;bottom:100%;width:295%;max-width:none;transform:translateY(4.2%)}

/* Oynat butonu — kalp atışı (uygulamadakiyle aynı ritim) */

/* ── Ortak şeridi ─────────────────────────────────────── */
.serit-ortak{background:var(--yuzey);border-bottom:1px solid var(--kenar)}
.serit-ic{display:flex;align-items:center;gap:28px;padding-top:22px;padding-bottom:22px;flex-wrap:wrap}
.ortak{display:flex;flex-direction:column;align-items:center;gap:6px;flex-shrink:0}
.ortak img{width:124px}
.ortak span{font-size:10px;font-weight:600;letter-spacing:.26em;color:rgba(0,15,51,.7)}
.serit-ic p{font-size:14.5px;color:var(--ikincil);max-width:60ch}
/* ── Üç kanıt kartı (güven bölümü) ─────────────────────────────────
 * Tescil belgesi + entegratör + iştirak tek satırda. Kart anatomisi
 * sayfadaki .kart ile aynı (kenar, yarıçap, gölge); kanıt olduğu için
 * numarası yok, ikonu var.
 */
.serit-kanit{background:var(--yuzey);border-top:1px solid var(--kenar);border-bottom:1px solid var(--kenar);padding:56px 0}
.kanit-ust{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap}
.kanit-ustlik{font-size:11.5px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--marka)}
.kanit-ust h2{margin-top:10px;font-size:clamp(24px,2.6vw,30px);font-weight:700}
.kanit-ust > p{font-size:14.5px;color:var(--soluk);max-width:34ch;text-align:right}
.kanit-kartlar{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:30px}
.kanit-kart{display:flex;flex-direction:column;gap:14px;background:var(--yuzey);border:1px solid var(--kenar);border-radius:16px;padding:24px;box-shadow:var(--golge)}
.kanit-kart h3{font-size:17px;font-weight:600}
.kanit-kart h3 a{text-decoration:underline;text-decoration-color:rgba(163,33,31,.4);text-underline-offset:3px}
.kanit-kart h3 a:hover{text-decoration-color:var(--marka)}
.kanit-kart p{font-size:14.5px;color:var(--ikincil)}
.kanit-kart p a{color:var(--marka);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.kanit-logo{width:118px}
.kanit-belge-satir{display:flex;align-items:center;gap:14px}
.kanit-belge{display:block;flex:none;width:56px;background:#fff;border:3px solid #fff;border-radius:8px;overflow:hidden;
  box-shadow:0 6px 16px rgba(20,35,60,.18);transition:transform .18s ease,box-shadow .18s ease}
.kanit-belge img{width:100%;height:auto;border-radius:5px}
.kanit-belge:hover{transform:translateY(-2px);box-shadow:0 10px 22px rgba(20,35,60,.24)}
.kanit-rozet{display:inline-flex;align-items:center;gap:7px;padding:6px 13px 6px 10px;border-radius:999px;
  background:#E9F8F0;border:1px solid #BBE7D1;color:#047857;font-size:12px;font-weight:700}
.kanit-rozet svg{width:15px;height:15px;flex:none}
.kanit-ikon{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:12px;background:rgba(163,33,31,.08);color:var(--marka)}
.kanit-ikon svg{width:22px;height:22px}
@media (max-width:900px){
  .kanit-kartlar{grid-template-columns:1fr}
  .kanit-ust > p{text-align:left}
  .serit-kanit{padding:40px 0}
}
.serit-ic a{color:var(--marka);text-decoration:underline;text-underline-offset:2px}

/* ── Bölümler ─────────────────────────────────────────── */
.bolum{padding:76px 0}
.bolum h2{font-size:clamp(26px,3vw,36px);font-weight:700}
.bolum-alt{margin-top:12px;font-size:16.5px;color:var(--ikincil);max-width:62ch}
.bolum-acik{background:var(--yuzey);border-top:1px solid var(--kenar);border-bottom:1px solid var(--kenar)}
.bolum-koyu{background:var(--koyu);color:#fff}
.bolum-koyu .bolum-alt{color:#B9BFCC}

.kartlar{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:38px}
.kart{background:var(--yuzey);border:1px solid var(--kenar);border-radius:16px;padding:22px;box-shadow:var(--golge)}
.kart-no{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:10px;
  background:rgba(163,33,31,.08);color:var(--marka);font-weight:700;font-size:12.5px;font-variant-numeric:tabular-nums}
.kart h3{margin-top:16px;font-size:17px;font-weight:600}
.kart p{margin-top:8px;font-size:14.5px;color:var(--ikincil)}

.adimlar{list-style:none;padding:0;margin:38px 0 0;display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.adimlar li{display:flex;gap:16px}
.adim-no{flex-shrink:0;width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  border:1px solid rgba(255,255,255,.16);background:var(--koyu-2);color:var(--marka-acik);font-weight:700;font-size:13px;font-variant-numeric:tabular-nums}
.adimlar h3{font-size:17px;font-weight:600}
.adimlar p{margin-top:7px;font-size:14.5px;color:#B9BFCC}

.fiyat-ic{display:grid;grid-template-columns:1.15fr .85fr;gap:40px;align-items:start}
.onay-liste{list-style:none;padding:0;margin:24px 0 30px;display:grid;gap:11px}
.onay-liste li{position:relative;padding-left:28px;font-size:15px;color:var(--metin)}
.onay-liste li::before{content:"";position:absolute;left:0;top:7px;width:16px;height:16px;border-radius:50%;
  background:rgba(16,185,129,.14);border:1px solid rgba(16,185,129,.55)}
.fiyat-kart{background:var(--yuzey);border:1px solid var(--kenar);border-radius:18px;padding:26px;box-shadow:var(--golge)}
.fiyat-baslik{font-size:17px;font-weight:600}
.fiyat-metin{margin-top:10px;font-size:14.5px;color:var(--ikincil)}
.fiyat-tel{display:inline-block;margin-top:14px;font-size:20px;font-weight:700;color:var(--marka)}
.fiyat-etiket{font-size:12.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--marka)}
.fiyat-buyuk{margin-top:8px;display:flex;align-items:baseline;gap:6px}
.fiyat-para{font-size:44px;font-weight:800;letter-spacing:-.02em;line-height:1}
.fiyat-birim{font-size:16px;color:var(--ikincil);font-weight:600}
/* Paket listesi: fiyat kartında hediye seçenekleri — rakam değil KARAR sunar. */
.fiyat-paketler{margin-top:12px;display:grid;gap:8px;list-style:none;padding:0}
.fiyat-paketler li{font-size:14px;line-height:1.5;color:var(--ikincil);background:#fff;border:1px solid var(--kenar);border-radius:10px;padding:9px 11px}
.fiyat-paketler strong{color:var(--metin)}
.fiyat-paketler span{color:var(--soluk)}
.fiyat-hediye{display:inline-block;margin-top:3px;font-size:13px;color:var(--marka);font-weight:600}
.fiyat-dugme{margin-top:18px;width:100%;justify-content:center}
.fiyat-dipnot{margin-top:14px;font-size:13.5px;color:var(--ikincil)}
.fiyat-not{margin-top:4px;font-size:13px;color:var(--soluk)}

.sss{margin-top:34px;display:grid;gap:10px;max-width:860px}
.sss details{background:var(--kagit);border:1px solid var(--kenar);border-radius:12px;padding:16px 18px}
.sss summary{cursor:pointer;font-size:16px;font-weight:600;list-style:none}
.sss summary::-webkit-details-marker{display:none}
.sss summary::after{content:"+";float:right;color:var(--marka);font-weight:700}
.sss details[open] summary::after{content:"–"}
.sss p{margin-top:12px;font-size:15px;color:var(--ikincil)}

.kapanis{background:var(--marka);color:#fff;padding:66px 0}
.kapanis-ic{text-align:center}
.kapanis h2{font-size:clamp(26px,3.2vw,38px);font-weight:700}
.kapanis p{margin-top:12px;font-size:17px;color:rgba(255,255,255,.85)}
.kapanis .dugme{margin-top:28px}

/* ── Alt bilgi ────────────────────────────────────────── */
.alt{background:var(--koyu);color:#B9BFCC;padding:56px 0 26px}
.alt-ic{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:32px}
.alt-logo{height:24px;width:auto;margin-bottom:14px}
.alt p{font-size:14px;max-width:38ch}
.alt h4{color:#fff;font-size:14.5px;margin-bottom:12px}
.alt-ic a{display:block;font-size:14px;padding:4px 0}
.alt-ic a:hover{color:#fff}
.alt-telif{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;
  margin-top:36px;padding-top:20px;border-top:1px solid rgba(255,255,255,.1);font-size:13px}
.alt-telif a{color:#D6DAE4;text-decoration:underline;text-underline-offset:2px}

/* ── Duyarlı ──────────────────────────────────────────── */
@media (max-width:1024px){
  .kartlar{grid-template-columns:repeat(2,1fr)}
  .adimlar{grid-template-columns:1fr}
  .alt-ic{grid-template-columns:1fr 1fr}
}
@media (max-width:860px){
  .menu{display:none}
  .kahraman-ic{grid-template-columns:1fr;padding-top:44px;padding-bottom:44px}
  .sahne{margin:0 auto;max-width:400px}
  .fiyat-ic{grid-template-columns:1fr}
  .bolum{padding:56px 0}
}
@media (max-width:560px){
  .kartlar{grid-template-columns:1fr}
  .alt-ic{grid-template-columns:1fr}
  .ust-ic{gap:10px}
  .marka img{height:28px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
}

/* İletişim — e-imzatek.com/iletisim düzeninden: 4 bilgi kartı + harita + hızlı iletişim paneli */
.iletisim-kartlar{margin-top:34px;display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.iletisim-kart{background:var(--kagit);border:1px solid var(--kenar);border-radius:14px;padding:24px 22px}
.iletisim-ikon{display:inline-flex;width:46px;height:46px;border-radius:50%;background:rgba(220,38,38,.09);color:var(--marka);align-items:center;justify-content:center}
.iletisim-ikon svg{width:22px;height:22px}
.iletisim-kart h3{margin-top:18px;font-size:16px;font-weight:700;color:var(--marka)}
.iletisim-kart p{margin-top:8px;font-size:15px;line-height:1.65;color:var(--ikincil)}
.iletisim-kart p a{display:block;color:inherit}
.iletisim-kart p a:hover{color:var(--marka)}
.iletisim-alt{margin-top:18px;display:grid;grid-template-columns:1.6fr 1fr;gap:18px}
.iletisim-harita{width:100%;height:100%;min-height:340px;border:1px solid var(--kenar);border-radius:14px;display:block;background:var(--yuzey)}
.iletisim-panel{background:var(--koyu);color:#fff;border-radius:14px;padding:30px 28px;display:flex;flex-direction:column}
.iletisim-panel h3{font-size:22px;font-weight:700}
.iletisim-panel p{margin-top:10px;font-size:15px;line-height:1.6;color:#B9BFCC;flex:1}
.iletisim-panel .dugme{margin-top:12px;width:100%}
.iletisim-panel .dugme-beyaz{margin-top:22px}
.dugme-hayalet{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.35)}
.dugme-hayalet:hover{border-color:#fff;background:rgba(255,255,255,.06)}
@media (max-width:1024px){.iletisim-kartlar{grid-template-columns:repeat(2,1fr)}}
@media (max-width:860px){.iletisim-alt{grid-template-columns:1fr}.iletisim-harita{min-height:280px}}
@media (max-width:560px){.iletisim-kartlar{grid-template-columns:1fr}}

/* Yapışkan üst çubuk çapa hedefinin başlığını örtmesin */
section[id]{scroll-margin-top:84px}

/* Kahraman giriş animasyonları (e-imzatek.com: text-anime-style-3 + wow fadeInUp) */
.harf-anim.hazir{perspective:400px}
.harf-anim .kelime{display:inline-block;white-space:nowrap}
.harf-anim.hazir .harf{display:inline-block;opacity:0;transform:translateX(50px);animation:harf-gir 1s cubic-bezier(.34,1.56,.64,1) forwards}
@keyframes harf-gir{to{opacity:1;transform:none}}
/* 🔴 2026-09-15: animasyon artık SAYFA YÜKLENİNCE DEĞİL, öğe ekrana girince
   oynar (.gorundu — alt-eski.php'deki betik ekler). Hero ilk ekranda olduğu
   için davranışı değişmez; aşağıdaki bölümler kaydırınca canlanır. */
.gir-yukari{opacity:0;transform:translateY(26px)}
.gir-yukari.gorundu{animation:gir-yukari .9s cubic-bezier(.22,1,.36,1) forwards;animation-delay:var(--g,.15s)}
@keyframes gir-yukari{to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.gir-yukari,.gir-yukari.gorundu{opacity:1;transform:none;animation:none}.harf-anim .harf{opacity:1;transform:none;animation:none}}

/* Rozet: "çevrimiçi" yeşil nokta (nabız) + bağlantı */
a.rozet{text-decoration:none;color:#D6DAE4;transition:border-color .2s,color .2s}
a.rozet:hover{color:#fff;border-color:rgba(255,255,255,.35)}
.nokta-online{background:#22C55E;box-shadow:0 0 0 4px rgba(34,197,94,.22);animation:nokta-nabiz 2s ease-out infinite}
@keyframes nokta-nabiz{0%{box-shadow:0 0 0 3px rgba(34,197,94,.35)}70%{box-shadow:0 0 0 8px rgba(34,197,94,0)}100%{box-shadow:0 0 0 8px rgba(34,197,94,0)}}
@media (prefers-reduced-motion:reduce){.nokta-online{animation:none}}

@media (max-width:560px){.ust-ic{gap:8px}.ust-eylem{gap:7px}.ayrac{height:20px}.bag-giris{padding:0 10px;font-size:13px;height:38px}.ust .dugme{padding:0 11px;font-size:13px;height:38px}.marka img{height:24px}}

/* ── Rehber kartları (ana sayfa) ─────────────────────── */
.rehber-kartlar{margin-top:34px;display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.rehber-kart{display:flex;flex-direction:column;background:var(--kagit);border:1px solid var(--kenar);border-radius:14px;padding:22px;transition:border-color .15s,box-shadow .15s}
.rehber-kart:hover{border-color:rgba(163,33,31,.35);box-shadow:var(--golge)}
.rehber-kart h3{font-size:17px;font-weight:600}
.rehber-kart p{margin-top:8px;font-size:14.5px;color:var(--ikincil);flex:1}
.rehber-ok{margin-top:16px;font-size:14px;font-weight:600;color:var(--marka)}
@media (max-width:1024px){.rehber-kartlar{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.rehber-kartlar{grid-template-columns:1fr}}

/* ── Alt bilgi: 5 sütun + küçük not ───────────────────── */
.alt-ic-5{grid-template-columns:1.5fr 1fr 1.3fr 1.3fr 1fr}
.alt-kucuk{margin-top:14px;font-size:12.5px;color:#8A92A3}
@media (max-width:1024px){.alt-ic-5{grid-template-columns:1fr 1fr 1fr}}
@media (max-width:560px){.alt-ic-5{grid-template-columns:1fr}}

/* ── Makale (rehber ve yasal sayfalar) ─────────────────── */
.makale-bas{background:var(--koyu);color:#fff;padding:48px 0 40px}
.kirinti{display:flex;flex-wrap:wrap;gap:6px;font-size:13.5px;color:#B9BFCC;list-style:none;padding:0;margin:0 0 18px}
.kirinti li+li::before{content:"/";margin-right:6px;color:#6B7385}
.kirinti a:hover{color:#fff}
.makale-bas h1{font-size:clamp(28px,3.6vw,42px);font-weight:700;max-width:22ch}
.makale-bas .ozet{margin-top:14px;font-size:17px;color:#B9BFCC;max-width:62ch}
.makale-bas .tarih{margin-top:16px;font-size:13px;color:#8A92A3}
.makale-ic{display:grid;grid-template-columns:minmax(0,760px) 300px;gap:48px;align-items:start;padding:52px 24px 72px}
.makale{font-size:16.5px;line-height:1.75;color:var(--metin)}
.makale h2{font-size:24px;font-weight:700;margin:40px 0 12px;scroll-margin-top:90px}
.makale h2:first-child{margin-top:0}
.makale h3{font-size:18.5px;font-weight:600;margin:26px 0 8px}
.makale p{margin:0 0 16px}
.makale ul,.makale ol{margin:0 0 18px;padding-left:22px}
.makale li{margin:6px 0}
.makale li::marker{color:var(--marka)}
.makale a{color:var(--marka);text-decoration:underline;text-underline-offset:2px}
.makale strong{font-weight:600}
.makale table{width:100%;border-collapse:collapse;margin:8px 0 22px;font-size:15px;background:var(--yuzey);border:1px solid var(--kenar);border-radius:12px;overflow:hidden}
.makale th,.makale td{padding:11px 14px;text-align:left;border-bottom:1px solid var(--kenar);vertical-align:top}
.makale th{background:#FBF9F8;font-weight:600;font-size:14px;color:var(--ikincil)}
.makale tr:last-child td{border-bottom:0}
.tablo-sar{overflow-x:auto;margin:0 0 22px}
.tablo-sar table{margin:0}
.kutu-not{background:var(--yuzey);border:1px solid var(--kenar);border-left:4px solid var(--marka);border-radius:12px;padding:16px 18px;margin:0 0 22px;font-size:15.5px}
.kutu-not p:last-child{margin:0}
.makale-cta{background:var(--koyu);color:#fff;border-radius:16px;padding:28px;margin-top:36px}
.makale-cta h2{margin:0;font-size:22px;color:#fff}
.makale-cta p{margin:10px 0 0;color:#B9BFCC;font-size:15.5px}
.makale-cta .dugme{margin-top:18px}
.yan{position:sticky;top:96px;display:grid;gap:16px}
.yan-kart{background:var(--yuzey);border:1px solid var(--kenar);border-radius:14px;padding:20px;box-shadow:var(--golge)}
.yan-kart h3{font-size:15px;font-weight:600;margin-bottom:10px}
.yan-kart a{display:block;font-size:14.5px;color:var(--ikincil);padding:5px 0;border-top:1px solid var(--kenar)}
.yan-kart a:first-of-type{border-top:0}
.yan-kart a:hover{color:var(--marka)}
.yan-kart a.dugme{display:inline-flex;width:100%;margin-top:8px;padding:0 16px;border-top:0}
.yan-kart a.dugme-dolu{color:#fff}
.yan-kart a.dugme-cerceve{color:var(--metin)}
.yan-kart p{font-size:14px;color:var(--ikincil)}
.makale-sss{margin-top:40px}
.makale-sss h2{margin-bottom:14px}
.makale-sss details{background:var(--yuzey);border:1px solid var(--kenar);border-radius:12px;padding:14px 18px;margin-bottom:10px}
.makale-sss summary{cursor:pointer;font-weight:600;list-style:none;font-size:16px}
.makale-sss summary::-webkit-details-marker{display:none}
.makale-sss summary::after{content:"+";float:right;color:var(--marka);font-weight:700}
.makale-sss details[open] summary::after{content:"–"}
.makale-sss details p{margin:10px 0 0;font-size:15px;color:var(--ikincil)}
.yasal .makale{font-size:15.5px}
.yasal .makale h2{font-size:20px;margin-top:32px}
@media (max-width:960px){.makale-ic{grid-template-columns:1fr;gap:32px}.yan{position:static}}

/* ── Reklam açılış sayfaları (.acilis) ─────────────────────────────
 * Ana sayfayla aynı dil; fark odak: tek vaat, tek çağrı, teklif kartı.
 * 🔴 JS yok, dış kütüphane yok: açılış hızı Google'ın "açılış sayfası
 *    deneyimi" puanının doğrudan parçası. */
.ust-acilis .ust-tel{font-variant-numeric:tabular-nums;white-space:nowrap}
.acilis .kahraman-ic{grid-template-columns:1.1fr .9fr;padding-top:56px;padding-bottom:56px}
.acilis .kahraman h1{font-size:clamp(30px,3.9vw,46px);line-height:1.12}
.acilis .alt-metin{max-width:52ch}
.acilis-teklif{background:#fff;color:var(--metin);border-radius:18px;padding:26px 26px 22px;box-shadow:0 24px 60px rgba(0,0,0,.28);max-width:440px;margin-left:auto}
.acilis-teklif .etiket{font-size:11.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--ikincil)}
.acilis-teklif .fiyat{margin-top:8px;display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.acilis-teklif .fiyat strong{font-size:38px;font-weight:700;color:var(--marka);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.acilis-teklif .fiyat span{font-size:14px;color:var(--ikincil)}
.acilis-teklif .fiyat-alt{margin-top:2px;font-size:13.5px;color:var(--ikincil)}
.acilis-teklif ul{list-style:none;padding:0;margin:18px 0 0;display:grid;gap:9px}
.acilis-teklif li{font-size:14.5px;display:flex;gap:9px;align-items:flex-start}
.acilis-teklif li::before{content:"";flex:none;margin-top:3px;width:16px;height:16px;border-radius:50%;
  background:rgba(16,185,129,.14) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.2 8.3l2.5 2.5 5.1-5.3' fill='none' stroke='%23059669' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/16px no-repeat;
  border:1px solid rgba(5,150,105,.45)}
.acilis-teklif .dugme{width:100%;margin-top:20px}
.acilis-teklif .kucuk{margin-top:10px;font-size:12.5px;color:var(--ikincil);text-align:center}
.acilis-guven{background:var(--yuzey);border-bottom:1px solid var(--kenar)}
.acilis-guven .kap{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;padding-top:18px;padding-bottom:18px}
.acilis-guven div{display:flex;gap:12px;align-items:center;font-size:14px;color:var(--ikincil)}
.acilis-guven strong{display:block;color:var(--metin);font-size:14.5px}
.acilis-guven img{width:44px;height:44px;flex:none;object-fit:contain}
.acilis-tescil{flex:none;display:block;width:38px;padding:2px;background:#fff;border:1px solid var(--kenar);border-radius:5px;box-shadow:0 3px 10px rgba(0,15,51,.10)}
.acilis-tescil img{width:100%;height:auto;display:block;border-radius:2px}
.acilis-guven a{color:var(--marka);font-weight:600;white-space:nowrap}
.acilis .kartlar{grid-template-columns:repeat(4,1fr)}
@media (max-width:1100px){.acilis .kartlar{grid-template-columns:repeat(2,1fr)}}
.acilis-icerik{padding:56px 0}
.acilis .kart h3{font-size:16.5px}
.acilis .kart p{font-size:14.5px}
.acilis-icerik .makale{max-width:800px}
.acilis-icerik h2{font-size:clamp(22px,2.6vw,30px);font-weight:700;margin-bottom:12px}
.acilis-icerik h3{font-size:19px;font-weight:600;margin:26px 0 8px}
.acilis-icerik p,.acilis-icerik li{font-size:16px;color:var(--ikincil);line-height:1.65}
.acilis-icerik p+p{margin-top:12px}
.acilis-icerik ul,.acilis-icerik ol{margin:12px 0 0 22px;display:grid;gap:8px}
.acilis-icerik table{width:100%;border-collapse:collapse;margin-top:18px;font-size:15px}
.acilis-icerik th,.acilis-icerik td{padding:10px 12px;border-bottom:1px solid var(--kenar);text-align:left;vertical-align:top}
.acilis-icerik th{font-size:12.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--ikincil);background:var(--kagit)}
.acilis-icerik td.evet{color:#047857;font-weight:600}
.acilis-icerik td.hayir{color:var(--ikincil)}
.acilis-fiyat{background:var(--kagit);border-top:1px solid var(--kenar);border-bottom:1px solid var(--kenar)}
.acilis-fiyat .kap{padding-top:44px;padding-bottom:44px}
.acilis-fiyat h2{font-size:clamp(22px,2.6vw,30px);font-weight:700}
.acilis-fiyat p{margin-top:10px;font-size:15.5px;color:var(--ikincil);max-width:56ch}
.acilis-fiyat .fiyat-satir{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:20px}
.acilis-fiyat .fiyat-satir div{background:var(--yuzey);border:1px solid var(--kenar);border-radius:12px;padding:14px 16px}
.acilis-fiyat .fiyat-satir strong{display:block;font-size:22px;color:var(--marka);font-variant-numeric:tabular-nums}
.acilis-fiyat .fiyat-satir span{font-size:12.5px;color:var(--ikincil)}
.acilis-fiyat .dugmeler{display:flex;align-items:center;gap:18px;margin-top:22px;flex-wrap:wrap}
.acilis-fiyat .dugmeler a.bag{font-size:14px;color:var(--marka);text-decoration:underline;text-underline-offset:3px}
.acilis-iletisim{padding:40px 0;border-top:1px solid var(--kenar)}
.acilis-iletisim .kap{display:flex;gap:26px;flex-wrap:wrap;justify-content:space-between;align-items:center;font-size:14px;color:var(--ikincil)}
.acilis-iletisim strong{color:var(--metin)}
.acilis-iletisim a{color:var(--marka);font-weight:600}
/* Telefonda yapışkan çağrı çubuğu: sayfa uzun, düğme hep elin altında. */
.mobil-cta{display:none}
@media (max-width:900px){
  .acilis .kahraman-ic{grid-template-columns:1fr}
  .acilis-teklif{margin-left:0;max-width:none}
  .acilis-guven .kap{grid-template-columns:1fr}
  .acilis .kartlar{grid-template-columns:1fr}
  .acilis-fiyat .fiyat-satir{grid-template-columns:repeat(2,1fr)}
  .ust-acilis .ust-tel{display:none}
  .mobil-cta{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:60;gap:10px;padding:10px 14px calc(10px + env(safe-area-inset-bottom));
    background:rgba(255,255,255,.96);border-top:1px solid var(--kenar);backdrop-filter:saturate(1.2) blur(6px)}
  .mobil-cta .dugme{flex:1;height:46px}
  body.acilis-govde{padding-bottom:74px}
}

/* ── Robotun göğsündeki oynat düğmesi + sayfa içi pencere ─────────── */
.kahraman-gorsel{position:relative}
.robot-oynat{position:absolute;left:41.75%;top:78.3%;width:9%;aspect-ratio:1/1;transform:translate(-50%,-50%);
  border:0;border-radius:50%;background:transparent;cursor:pointer;padding:0;z-index:3}
.robot-oynat:hover,.robot-oynat:focus-visible{outline:0;box-shadow:0 0 0 3px rgba(255,255,255,.55)}
.robot-oynat-etiket{position:absolute;left:50%;top:calc(100% + 10px);transform:translateX(-50%);
  white-space:nowrap;font-size:12.5px;font-weight:600;color:#fff;background:rgba(0,15,51,.72);
  border:1px solid rgba(255,255,255,.18);border-radius:999px;padding:5px 12px;opacity:0;transition:opacity .18s ease;pointer-events:none}
.robot-oynat:hover .robot-oynat-etiket,.robot-oynat:focus-visible .robot-oynat-etiket{opacity:1}
.pencere{position:fixed;inset:0;z-index:200;background:rgba(6,12,28,.88);display:flex;align-items:center;justify-content:center;padding:28px}
.pencere[hidden]{display:none}
.pencere-ic{display:flex;flex-direction:column;align-items:center;gap:16px;max-width:min(1000px,94vw)}
/* 🔴 Gövde de flex+ortalı olmalı: düz div'de görsel sola yaslanıp
   altındaki geniş açıklama metniyle hizasız kalıyordu. */
.pencere-govde{display:flex;flex-direction:column;align-items:center;gap:18px;width:100%}
.pencere-cerceve{display:block;background:#fff;padding:6px;border-radius:14px;box-shadow:0 26px 60px rgba(0,0,0,.5)}
.pencere-video{display:block;max-width:min(920px,94vw);max-height:78vh;width:auto;height:auto;border-radius:12px;
  background:#000;box-shadow:0 30px 70px rgba(0,0,0,.55)}
.pencere-gorsel{display:block;max-width:min(620px,88vw);max-height:72vh;width:auto;height:auto;border-radius:9px}
p.pencere-aciklama{max-width:680px;margin:0;text-align:center;color:#E8EDF3;font-size:14.5px;line-height:1.6}
.pencere-aciklama strong{color:#fff}
.pencere-ipucu{font-size:12.5px;color:rgba(255,255,255,.62)}
.pencere-kapat{position:absolute;top:18px;right:20px;width:44px;height:44px;border:0;border-radius:50%;background:#fff;color:#111;
  font-size:26px;line-height:1;cursor:pointer;box-shadow:0 6px 18px rgba(0,0,0,.32)}
.pencere-kapat:hover{background:#F1F1F1}
@media (max-width:700px){
  .pencere{padding:16px}
  .robot-oynat{width:13%}
  .robot-oynat-etiket{display:none}
}

/* ── Kayan avantaj şeridi ─────────────────────────────────────────────
 * Tasarım e-imzatek.com'un `our-scrolling-ticker` bölümünden birebir
 * alındı (ölçüler, renk geçişi, yıldız ikonu, 20 sn akış): iki kardeş
 * sitede aynı öğe aynı görünsün. İkon dosyası da oradan kopyalandı.
 *
 * 🔴 `text-transform:capitalize` ALINMADI: Türkçede "ile" → "İle" olup
 *    cümleyi bozuyor; metinler zaten istenen büyük/küçük harfte yazılı.
 * 🔴 Saf CSS: iki özdeş kopya, ilki -%100 kayınca ikincisi yerine geçer.
 *    İkinci kopya aria-hidden (aynı cümleler iki kez okunmasın).
 */
.serit-kayan{background:linear-gradient(135deg,#1F2937 0%,#374151 100%);padding:25px 0;box-shadow:0 4px 15px rgba(0,0,0,.1);overflow:hidden}
.kayan-kutu{--ara:30px;position:relative;display:flex;overflow:hidden;user-select:none;gap:0;align-items:center}
/* 🔴 SÜRE DEĞİL HIZ KOPYALANIR: e-imzatek'te şerit ~94 px/sn akıyor.
   Bizim maddeler daha uzun (içerik 2,6 k px), aynı 20 sn'de 131 px/sn
   olup göz yoruyordu. Süre içerik genişliğine göre uzatıldı. */
.kayan-icerik{flex-shrink:0;display:flex;align-items:center;gap:var(--ara);min-width:100%;animation:kay 27s linear infinite}
.kayan-kutu:hover .kayan-icerik{animation-play-state:paused}
.kayan-icerik span{display:inline-flex;align-items:center;white-space:nowrap;font-size:26px;font-weight:600;line-height:1.2em;color:#fff;padding-right:30px}
.kayan-icerik span img{width:26px;height:auto;margin-right:30px}
/* 🔴 line-height:1 ŞART: hapın içindeki satır kutusu 26px yazıdan
   miras alınca (1,2em = 31px) bant e-imzatek'tekinden 10 px uzuyordu. */
.kayan-ortak{background:#fff;border-radius:999px;padding:4px 17px 4px 15px;margin-right:6px;line-height:1;box-shadow:0 4px 14px rgba(0,0,0,.18)}
.kayan-ortak img{width:76px!important;margin-right:13px!important}
.kayan-ortak em{font-style:normal;line-height:1;font-size:10px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#0A2540;
  border-left:1px solid #D8DEE7;padding-left:14px}
@keyframes kay{from{transform:translateX(0)}to{transform:translateX(-100%)}}
@media (prefers-reduced-motion:reduce){.kayan-icerik{animation:none}}
@media (max-width:991px){
  .serit-kayan{padding:15px 0}
  .kayan-kutu{--ara:20px}
  .kayan-icerik span{font-size:24px;padding-right:22px}
  .kayan-icerik span img{width:24px;margin-right:22px}
  .kayan-ortak img{width:72px!important;margin-right:11px!important}
}
@media (max-width:767px){
  .kayan-icerik span{font-size:22px}
  .kayan-icerik span img{width:22px}
  .kayan-ortak img{width:66px!important}
  .kayan-ortak em{font-size:10px;padding-left:11px}
}