/* =====================================================================
   cro.css — takipsaati.com modern CTA / trust / conversion design system
   Tur 4 (frontend/CRO). Lightweight, local, no dependencies.
   Tek bir renk + buton sistemi: tüm CTA'lar, trust rozetleri, yorumlar,
   mobil sabit çubuk ve "nasıl çalışır" blokları bu tokenleri kullanır.
   ===================================================================== */
:root{
  --ts-primary:#C50C83;          /* marka — tek aksiyon rengi (magenta) */
  --ts-primary-d:#A50A6E;        /* hover */
  --ts-primary-soft:#FBEAF3;     /* açık marka zemini (premium, neon değil) */
  --ts-primary-ink:#7A1259;      /* koyu marka metni (açık zemin üstünde) */
  --ts-hero:#7A1259;             /* hero / intro arkaplanı */
  --ts-wa:#25D366;               /* WhatsApp — yalnız WhatsApp butonlarında */
  --ts-wa-d:#1eb558;
  --ts-ink:#2B2A33;              /* ana metin */
  --ts-muted:#6E6A75;            /* ikincil metin */
  --ts-line:#E7E1E4;             /* ince çizgi (nötr/sıcak) */
  --ts-surface:#ffffff;
  --ts-gold:#f59e0b;             /* yıldız */
  --ts-radius:12px;
  --ts-radius-lg:16px;
  --ts-shadow:0 6px 22px rgba(43,42,51,.08);
  --ts-shadow-hover:0 10px 26px rgba(197,12,131,.16);
}
body.dark{
  --ts-primary-soft:#2a1020;
  --ts-ink:#ececf1;
  --ts-muted:#a9a9b6;
  --ts-line:#3a3a48;
  --ts-surface:#2c2d35;
}

/* ---------- Buton sistemi ---------- */
.ts-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:48px;padding:13px 24px;border-radius:var(--ts-radius);
  font-weight:700;font-size:15px;line-height:1;text-decoration:none;
  border:1.5px solid transparent;cursor:pointer;
  transition:transform .15s ease, box-shadow .15s ease, background .15s ease;
  -webkit-tap-highlight-color:transparent;
}
.ts-btn:active{transform:translateY(1px);}
.ts-btn:focus-visible{outline:3px solid rgba(197,12,131,.30);outline-offset:2px;}
.ts-btn--buy{background:var(--ts-primary);color:#fff;box-shadow:0 4px 14px rgba(197,12,131,.22);}
.ts-btn--buy:hover{background:var(--ts-primary-d);box-shadow:var(--ts-shadow-hover);color:#fff;}
.ts-btn--wa{background:#fff;color:var(--ts-wa-d);border-color:var(--ts-wa);}
.ts-btn--wa:hover{background:var(--ts-wa);color:#fff;}
.ts-btn--ghost{background:transparent;color:var(--ts-primary);border-color:var(--ts-primary);}
.ts-btn--ghost:hover{background:var(--ts-primary-soft);color:var(--ts-primary-d);}
.ts-btn--lg{min-height:54px;font-size:16px;padding:16px 28px;}

/* ---------- Trust rozetleri (landing + homepage ortak) ---------- */
.ts-trust{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin:18px auto 4px;}
.ts-trust .t{display:inline-flex;align-items:center;gap:7px;font-size:13.5px;font-weight:600;
  background:var(--ts-primary-soft);color:var(--ts-primary-ink);padding:9px 14px;border-radius:30px;}
.ts-trust .t i{color:var(--ts-primary);}

/* ---------- "Nasıl çalışır" 3 adım ---------- */
.ts-steps{max-width:980px;margin:30px auto 0;display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
.ts-step{background:var(--ts-surface);border:1px solid var(--ts-line);border-radius:var(--ts-radius-lg);
  padding:20px 18px;text-align:center;}
.ts-step .n{width:38px;height:38px;margin:0 auto 10px;border-radius:50%;display:flex;align-items:center;
  justify-content:center;font-weight:800;color:#fff;background:var(--ts-primary);}
.ts-step b{display:block;color:var(--ts-ink);font-size:15.5px;margin-bottom:4px;}
.ts-step p{margin:0;color:var(--ts-muted);font-size:13.5px;line-height:1.55;}
.ts-secTitle{text-align:center;font-size:22px;font-weight:800;color:var(--ts-ink);margin:6px 0 2px;}
.ts-secSub{text-align:center;color:var(--ts-muted);font-size:14px;margin:0 auto 6px;max-width:620px;}

/* ---------- Yorumlar (doğal görünüm) ---------- */
.ts-revHead{text-align:center;font-size:14.5px;color:var(--ts-muted);margin-bottom:18px;}
.ts-revHead .stars{color:var(--ts-gold);font-size:18px;letter-spacing:1px;}
.ts-revHead strong{color:var(--ts-ink);}
.ts-revGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;max-width:980px;margin:0 auto;}
.ts-rev{background:var(--ts-surface);border:1px solid var(--ts-line);border-radius:var(--ts-radius);
  padding:16px;box-shadow:0 3px 12px rgba(0,0,0,.04);}
.ts-rev .top{display:flex;align-items:center;gap:10px;margin-bottom:9px;}
.ts-rev .av{width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-weight:700;color:#fff;font-size:15px;}
.ts-rev .meta b{display:block;font-size:13.5px;color:var(--ts-ink);}
.ts-rev .meta small{color:var(--ts-muted);font-size:11.5px;}
.ts-rev .meta small i{color:var(--ts-primary);font-style:normal;}
.ts-rev .rstars{color:var(--ts-gold);font-size:12px;margin-left:auto;}
.ts-rev p{margin:0;color:#444;font-size:13.5px;line-height:1.6;}
body.dark .ts-rev p{color:var(--ts-muted);}

/* ---------- Mobil: küçük floating WhatsApp (Tur 6: büyük sabit bar KALDIRILDI) ----------
   Satın alma paket kartlarındaki "Satın Al" ile yapılır; sağ altta sadece sakin bir
   WhatsApp erişimi kalır -> tarayıcı alt barıyla çakışma ortadan kalkar. ---------- */
.tsbar{display:none;}
@media (max-width:768px){
  .tsbar{
    display:block;position:fixed;left:auto;right:14px;
    bottom:calc(18px + env(safe-area-inset-bottom,0px));
    z-index:9998;padding:0;background:none;border:none;box-shadow:none;transform:none;
  }
  .tsbar .ts-btn--buy{display:none;}                 /* büyük "Satın Al" bar kaldırıldı */
  .tsbar .ts-btn--wa{
    width:54px;height:54px;min-height:0;padding:0;border-radius:50%;
    background:var(--ts-wa);color:#fff;border:none;
    box-shadow:0 6px 18px rgba(37,211,102,.40);
  }
  .tsbar .ts-btn--wa span{display:none;}
  .tsbar .ts-btn--wa i{font-size:24px;}
  body,body.tsbar-on{padding-bottom:0;}              /* tam genişlik bar yok -> içerik örtülmez */
}

/* ---------- Responsive ---------- */
@media (max-width:768px){
  .ts-steps{grid-template-columns:1fr;gap:10px;}
  .ts-revGrid{grid-template-columns:1fr;}
  .ts-secTitle{font-size:19px;}
  .ts-trust .t{font-size:12.5px;padding:8px 11px;}
}
@media (min-width:481px) and (max-width:768px){
  .ts-steps{grid-template-columns:repeat(3,1fr);}  /* küçük tablette 3'lü kalsın */
}

/* Masaüstü floating aksiyon barından rahatsız edici pulse'ı kaldır */
.fixActions .item.wp .icon{animation:none !important;}

/* ============ Tur 6: Layout stabilizasyonu (desktop & mobil AYRI media query) ============ */

/* Hero mikro-güven satırı magenta hero üstünde her zaman okunur (Tur 5 magenta-on-magenta hatası giderildi) */
#intall .lpMicro{color:rgba(255,255,255,.92);}
#intall .lpMicro i{color:#fff !important;}

/* ================= DESKTOP (>=769px) ================= */
@media (min-width:769px){
  /* Sol floating aksiyon ikonları: minimal, sakin, az gölge (WhatsApp/arama korunur) */
  .fixActions .items .item .icon{width:40px !important;height:40px !important;font-size:15px !important;
    border-radius:12px !important;box-shadow:0 3px 10px rgba(43,42,51,.10) !important;transition:transform .15s ease;}
  .fixActions .items .item:hover .icon{transform:translateY(-2px);}
  .fixActions .items .item span{font-size:11px !important;}

  /* Landing/category hero: nefes alan padding, içerik kesilmez, dengeli oran */
  #intall{margin-bottom:40px !important;}
  #intall .conts{padding:46px 70px !important;align-items:center !important;}
  #intall .detabox{margin-left:48px !important;}
  #intall .detabox h1{font-size:40px !important;line-height:1.18 !important;margin-bottom:10px !important;}
  #intall .detabox p{font-size:16px !important;line-height:1.55 !important;opacity:.9 !important;}
  #intall .conts .icobox{min-width:108px !important;height:108px !important;}   /* büyük yuvarlak ikon küçültüldü */
  #intall .conts .icobox i{font-size:46px !important;}
  /* Hero içi öğeler içerikle aynı hizada (sola) */
  #intall .lpTrust,#intall .lpCtaRow,#intall .lpMicro{justify-content:flex-start !important;}
  /* "3 Adımda" ile hero/paketler arası dengeli boşluk (ne sıkışık ne boş) */
  .ts-steps{margin-top:22px;}
  #packlist{padding-top:6px;}
}

/* ================= MOBİL (<=768px) ================= */
@media (max-width:768px){
  /* 1) Üst platform ikon şeridi ilk ekranı yemesin */
  #introHome .serviceList{gap:8px !important;}
  #introHome .serviceList .item .box,
  #introHome .serviceList .box{width:48px !important;height:48px !important;border-radius:13px !important;}
  #introHome .serviceList .box i{font-size:19px !important;}
  #introHome .serviceList .serviceName{font-size:11px !important;line-height:1.2 !important;margin-top:5px !important;}

  /* 2) Ana sayfa intro hero kompakt */
  #introHome{padding-top:6px !important;}
  #introHome .content h1{font-size:23px !important;line-height:1.22 !important;margin-bottom:8px !important;}
  #introHome .content p{font-size:14px !important;line-height:1.45 !important;
    display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}

  /* 3) Landing hero KISALTILDI: dekoratif yuvarlak ikon gizli, tek sütun, kompakt */
  #intall{margin-bottom:24px !important;}
  #intall .conts{flex-direction:column !important;padding:20px 16px 22px !important;text-align:center !important;}
  #intall .conts .icobox{display:none !important;}
  #intall .detabox{margin:0 !important;text-align:center !important;max-width:100% !important;}
  #intall .detabox h1{font-size:23px !important;line-height:1.22 !important;margin-bottom:6px !important;}
  #intall .detabox p{font-size:14.5px !important;line-height:1.45 !important;}
  #intall .lpTrust,#intall .lpCtaRow,#intall .lpMicro{justify-content:center !important;}
  #intall .lpMicro{font-size:12.5px !important;}

  /* 4) Fast order kartı erken görünsün, satın alma yolu kısa */
  .fastOrder .fastselect .cont{padding:11px 13px !important;}
  .fastOrder .fastHead{font-size:11.5px !important;}
  .fastOrder .fastitems{gap:8px !important;}
  .fastAction{margin-top:10px !important;}
  .fastAction .butto-fast{min-height:50px !important;font-size:15.5px !important;}

  /* 5) Paket kartları KOMPAKT: Satın Al butonu yukarı gelir, kart hızlı taranır */
  .packInside{padding:14px 14px !important;}
  .packTop{margin-top:18px !important;}
  .packTop .icon i{font-size:38px !important;}
  .packTop .icon{margin-bottom:2px !important;}
  .packTop .title span{font-size:16px !important;}
  .packDetail{margin:12px 0 !important;}
  .packDetail ul li{padding:6px 0 !important;font-size:13px !important;}
  .packPrice{font-size:22px !important;height:auto !important;margin-top:4px !important;}
  .packPrice span{font-size:13px !important;}
  .packBottom{margin:12px 8px !important;}
  .packBuyBTN{font-size:15px !important;padding:11px 18px !important;}
  .packHead.have{font-size:12.5px !important;min-width:120px !important;}

  /* "Nasıl çalışır" sıkı; sayfa sonu Safari güvenli boşluğu */
  .ts-secSub{font-size:13px;}
  main{padding-bottom:env(safe-area-inset-bottom,0px);}
}

/* ============ Tur 6 sonu ============ */