/* TekChat — paylaşılan site kabuğu (header, footer, tema) — index.html ile BİREBİR aynı
   tasarım dilini kullanır. Bu dosya privacy.html, terms.html, child-safety.html,
   delete-account.html ve 404.html arasında paylaşılır; header/footer değişirse tek
   yerden güncellenir. index.html kendi (daha zengin) stilini ayrıca kendi içinde tutar. */

:root{
  --bg-1:#0b1712; --bg-2:#0d1a17; --bg-3:#0a1620;
  --green:#2E9E6B; --green-dark:#1F7A52; --green-soft:#BEE8CC;
  --blue:#5AB9E8; --blue-dark:#2E86AB;
  --gold:#C9A227; --gold-light:#E8C766;
  --pink:#D6537D;
  --text:#F3F4F6; --text-dim:#A9B4BE; --text-faint:#77828C;
  --surface:rgba(255,255,255,0.045); --surface-strong:rgba(255,255,255,0.08);
  --border:rgba(255,255,255,0.09);
  --shadow:0 20px 60px -20px rgba(0,0,0,0.6);
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:'Inter',-apple-system,Roboto,Segoe UI,Arial,sans-serif;
  background:linear-gradient(180deg,var(--bg-1) 0%, var(--bg-2) 45%, var(--bg-3) 100%);
  color:var(--text); line-height:1.6; overflow-x:hidden; position:relative; min-height:100vh;
}
a{color:inherit; text-decoration:none;}
ul{list-style:none;}
img,svg{display:block;}
.wrap{max-width:1160px; margin:0 auto; position:relative; z-index:2;}
.eyebrow{
  display:inline-flex; align-items:center; gap:8px; font-size:12.5px; font-weight:700;
  letter-spacing:.06em; text-transform:uppercase; color:var(--green-soft);
  background:rgba(46,158,107,0.12); border:1px solid rgba(46,158,107,0.35);
  padding:7px 14px; border-radius:999px; margin-bottom:18px;
}
h1,h2,h3{font-weight:800; letter-spacing:-0.02em;}
.grad-text{background:linear-gradient(90deg,var(--green) 0%, var(--blue) 100%); -webkit-background-clip:text; background-clip:text; color:transparent;}
.grad-text-gold{background:linear-gradient(90deg,var(--gold) 0%, var(--gold-light) 100%); -webkit-background-clip:text; background-clip:text; color:transparent;}
.eyebrow.gold{color:var(--gold-light); background:rgba(201,162,39,0.12); border-color:rgba(201,162,39,0.4);}

/* ---------- Ambient background blobs ---------- */
.blob{position:fixed; border-radius:50%; filter:blur(90px); z-index:0; pointer-events:none; opacity:.35;}
.blob-1{width:520px; height:520px; background:var(--green); top:-140px; left:-160px;}
.blob-2{width:460px; height:460px; background:var(--blue); top:280px; right:-180px; opacity:.28;}
.blob-3{width:420px; height:420px; background:var(--gold); bottom:-160px; left:20%; opacity:.16;}
.blob-4{width:380px; height:380px; background:var(--pink); bottom:10%; right:6%; opacity:.14;}

/* ---------- Header ---------- */
header{
  position:sticky; top:0; z-index:50; backdrop-filter:blur(16px) saturate(140%);
  background:rgba(11,23,18,0.55); border-bottom:1px solid var(--border);
}
.nav{max-width:1160px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; padding:16px 24px;}
.logo{display:flex; align-items:center; gap:10px; font-size:20px; font-weight:800;}
.logo-mark{
  width:36px; height:36px; flex-shrink:0; display:flex; align-items:center; justify-content:center;
  filter:drop-shadow(0 6px 14px rgba(46,158,107,.45));
}
.logo-mark img{width:100%; height:100%; object-fit:contain;}
.nav-links{display:flex; align-items:center; gap:34px; font-size:14.5px; font-weight:600; color:var(--text-dim);}
.nav-links a:hover{color:var(--text);}
.nav-cta{display:flex; align-items:center; gap:14px;}
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px; font-weight:700; font-size:14.5px;
  padding:12px 22px; border-radius:12px; border:1px solid transparent; cursor:pointer;
  transition:transform .18s ease, box-shadow .18s ease, opacity .18s ease; white-space:nowrap;
}
.btn:hover{transform:translateY(-2px);}
.btn-primary{background:linear-gradient(90deg,var(--green) 0%, var(--blue-dark) 100%); color:#fff; box-shadow:0 10px 26px -8px rgba(46,158,107,.55);}
.btn-primary:hover{box-shadow:0 14px 32px -8px rgba(46,158,107,.7);}
.btn-ghost{background:var(--surface); border-color:var(--border); color:var(--text);}
.btn-ghost:hover{background:var(--surface-strong);}
.btn-gold{background:linear-gradient(90deg,var(--gold) 0%, var(--gold-light) 100%); color:#241a00; box-shadow:0 10px 26px -8px rgba(201,162,39,.55);}
.btn-gold:hover{box-shadow:0 14px 32px -8px rgba(201,162,39,.7);}
.btn-sm{padding:9px 16px; font-size:13px; border-radius:10px;}
.nav-toggle-checkbox{display:none;}
.nav-toggle-label{display:none; width:38px; height:38px; border-radius:10px; background:var(--surface); border:1px solid var(--border); align-items:center; justify-content:center; cursor:pointer;}

/* ---------- Sosyal medya ikonu (Instagram) — header + footer'da paylaşılan ---------- */
.social-icon{
  width:38px; height:38px; border-radius:10px; flex-shrink:0; display:flex; align-items:center; justify-content:center;
  background:var(--surface); border:1px solid var(--border); color:var(--text-dim);
  transition:background .18s ease, color .18s ease, transform .18s ease;
}
.social-icon:hover{background:var(--surface-strong); color:var(--text); transform:translateY(-2px);}
.social-icon img{width:20px; height:20px; object-fit:contain;}
.footer-social{display:flex; align-items:center; gap:9px;}
.footer-social .social-icon-sm{width:20px; height:20px; flex-shrink:0; display:flex; align-items:center; justify-content:center;}
.footer-social .social-icon-sm img{width:100%; height:100%; object-fit:contain;}

/* Instagram ikonunu işaret eden, kısa süreliğine beliren cam (glassmorphism) konuşma balonu. */
.social-icon-wrap{position:relative; display:flex;}
.insta-bubble{
  position:absolute; top:calc(100% + 12px); right:-8px; white-space:nowrap;
  padding:9px 14px; border-radius:12px; font-size:12.5px; font-weight:600; color:#fff;
  background:rgba(255,255,255,0.14); border:1px solid rgba(255,255,255,0.28);
  backdrop-filter:blur(14px) saturate(160%); -webkit-backdrop-filter:blur(14px) saturate(160%);
  box-shadow:0 14px 32px -10px rgba(0,0,0,.55);
  opacity:0; pointer-events:none; z-index:60;
  animation:instaBubbleShow 6s ease forwards; animation-delay:.6s;
}
.insta-bubble::before{
  content:""; position:absolute; top:-6px; right:16px; width:12px; height:12px;
  background:rgba(255,255,255,0.14); border-left:1px solid rgba(255,255,255,0.28);
  border-top:1px solid rgba(255,255,255,0.28); transform:rotate(45deg);
}
@keyframes instaBubbleShow{
  0%{opacity:0; transform:translateY(-6px);}
  6%{opacity:1; transform:translateY(0);}
  85%{opacity:1; transform:translateY(0);}
  100%{opacity:0; transform:translateY(-6px);}
}
@media (max-width:480px){
  .insta-bubble{font-size:11.5px; padding:8px 12px; right:-40px;}
}

/* ---------- Legal / content pages ---------- */
.legal-hero{padding:64px 24px 20px; text-align:center;}
.legal-hero h1{font-size:clamp(28px,4.4vw,42px); margin-bottom:12px;}
.legal-hero .updated{color:var(--text-faint); font-size:13px; margin-bottom:18px;}
.legal-hero .lead{max-width:640px; margin:0 auto; color:var(--text-dim); font-size:15.5px;}

.legal-content{max-width:760px; margin:0 auto; padding:20px 24px 100px; position:relative; z-index:2;}
.legal-card{
  background:var(--surface); border:1px solid var(--border); border-radius:24px;
  padding:36px 34px; box-shadow:var(--shadow);
}
.legal-card h2{color:var(--green-soft); font-size:18px; margin-top:32px; margin-bottom:10px;}
.legal-card h2:first-child{margin-top:0;}
/* Rehber/SEO sayfalarında h2 altındaki ara başlıklar (bkz. rastgele-sesli-sohbet.html vb.) */
.legal-card h3{color:var(--text); font-size:15.5px; font-weight:700; margin-top:20px; margin-bottom:6px;}
.legal-card p, .legal-card li{font-size:15px; color:var(--text-dim); line-height:1.72;}
.legal-card em{color:var(--green-soft); font-style:italic;}
.legal-card p{margin-bottom:10px;}
.legal-card ul{padding-left:4px; margin-top:8px; display:flex; flex-direction:column; gap:10px;}
.legal-card li{list-style:none; padding-left:22px; position:relative;}
.legal-card li::before{
  content:""; position:absolute; left:0; top:9px; width:6px; height:6px; border-radius:50%;
  background:var(--green);
}
.legal-card strong{color:var(--text); font-weight:700;}
.legal-card a{color:var(--green-soft); text-decoration:underline; text-underline-offset:2px;}
.legal-card a:hover{color:var(--text);}
.legal-card .contact, .legal-card .box{
  background:var(--surface-strong); border:1px solid var(--border); padding:16px 18px;
  border-radius:14px; margin-top:10px;
}
.legal-card a.button{
  display:inline-flex; align-items:center; gap:8px; background:linear-gradient(90deg,var(--green) 0%, var(--blue-dark) 100%);
  color:#fff; text-decoration:none; padding:12px 20px; border-radius:12px; font-weight:700; margin-top:10px;
}

/* Basit "404" tipi merkezi hero sayfaları için. */
.center-hero{min-height:calc(100vh - 140px); display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:60px 24px;}
.center-hero .code{font-size:clamp(56px,10vw,96px); font-weight:900; letter-spacing:-0.03em; margin-bottom:8px;}
.center-hero h1{font-size:clamp(22px,3.4vw,30px); font-weight:800; letter-spacing:-0.02em; margin-bottom:10px;}
.center-hero p{color:var(--text-dim); font-size:16px; margin-bottom:28px;}

/* ---------- Footer ---------- */
footer{border-top:1px solid var(--border); padding:64px 24px 28px; position:relative; z-index:2;}
.footer-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:36px; max-width:1160px; margin:0 auto 40px;}
.footer-brand p{color:var(--text-dim); font-size:13.8px; margin-top:14px; max-width:280px;}
.footer-col h4{font-size:13px; text-transform:uppercase; letter-spacing:.05em; color:var(--text-faint); margin-bottom:16px;}
.footer-col ul{display:flex; flex-direction:column; gap:11px;}
.footer-col a{font-size:14px; color:var(--text-dim);}
.footer-col a:hover{color:var(--text);}
.footer-bottom{
  max-width:1160px; margin:0 auto; padding-top:26px; border-top:1px solid var(--border);
  display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px;
  font-size:12.5px; color:var(--text-faint);
}

/* ---------- Reveal animation ---------- */
.reveal{opacity:1; transform:none;}
html.js .reveal{opacity:0; transform:translateY(24px); transition:opacity .6s ease, transform .6s ease;}
html.js .reveal.visible{opacity:1; transform:none;}

/* ---------- Responsive ---------- */
@media (max-width:980px){
  .footer-grid{grid-template-columns:1fr 1fr;}
}
@media (max-width:720px){
  .nav-links{
    position:absolute; top:100%; left:0; right:0; flex-direction:column; align-items:flex-start; gap:4px;
    background:rgba(10,20,17,0.97); border-bottom:1px solid var(--border); padding:14px 24px 20px; display:none;
  }
  .nav-toggle-checkbox:checked ~ .nav-links{display:flex;}
  .nav-links a{width:100%; padding:10px 0;}
  .nav-toggle-label{display:flex;}
  .nav-cta .btn-ghost{display:none;}
  .footer-grid{grid-template-columns:1fr; gap:28px;}
  .legal-card{padding:26px 20px;}
  .legal-content{padding:16px 16px 80px;}
}
