:root{
  --bg:#0d1a40;
  --bg-deep:#0b1637;
  --text:#eaf0ff;
  --muted:#a9b6dc;
  --accent:#ffc93c;
  --card:rgba(255,255,255,.06);
  --line:rgba(255,255,255,.12);
  --radius:20px;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;min-height:100vh;display:flex;flex-direction:column;
  background:var(--bg-deep) linear-gradient(180deg,var(--bg) 0,var(--bg-deep) 100%) fixed;
  color:var(--text);
  font:16px/1.6 system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}
main{flex:1}
a{color:var(--accent)}
.wrap{width:100%;max-width:960px;margin:0 auto;padding:0 20px}

/* Dil gösterimi: yalnızca html[data-lang] ile eşleşen .l öğesi görünür */
.l{display:none}
:root[data-lang="tr"] .l[lang="tr"],
:root[data-lang="en"] .l[lang="en"],
:root[data-lang="de"] .l[lang="de"],
:root[data-lang="es"] .l[lang="es"]{display:inline}

/* Üst çubuk */
.top{padding:14px 0}
.top-in{display:flex;align-items:center;justify-content:space-between;gap:12px}
.logo{font-size:22px;font-weight:800;letter-spacing:.2px;color:var(--text);text-decoration:none}
.logo span,.hero h1 span{color:var(--accent)}
.langs{display:flex;gap:4px}
.langs button{
  font:inherit;font-size:13px;font-weight:700;letter-spacing:.5px;
  min-width:40px;min-height:36px;padding:0 10px;cursor:pointer;
  color:var(--muted);background:transparent;border:1px solid var(--line);border-radius:999px;
}
.langs button:hover{color:var(--text)}
.langs button[aria-pressed="true"]{color:var(--bg-deep);background:var(--accent);border-color:var(--accent)}
.langs button:focus-visible,.btn:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

/* Tanıtım */
.hero{padding:48px 0 36px;text-align:center}
.hero h1{margin:0;font-size:clamp(40px,12vw,64px);line-height:1.1;font-weight:800;letter-spacing:-1px}
.tagline{margin:14px auto 0;max-width:34em;color:var(--muted);font-size:clamp(16px,4.2vw,19px)}

h2{margin:36px 0 16px;font-size:22px}

/* Uygulama kartları */
.grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr))}
.card{
  display:flex;gap:16px;align-items:flex-start;
  padding:18px;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
}
.card-icon{flex:none;width:84px;height:84px;border-radius:20px;background:var(--bg-deep)}
.card-body{min-width:0}
.card h3{margin:0;font-size:22px;line-height:1.2}
.store-title{margin:4px 0 0;color:var(--muted);font-size:14px}
.desc{margin:12px 0 16px;font-size:15px}
.btn{
  display:inline-block;padding:11px 20px;border-radius:999px;
  background:var(--accent);color:var(--bg-deep);font-weight:700;text-decoration:none;
}
.btn:hover{filter:brightness(1.08)}

.contact{margin:0;color:var(--muted)}
.contact a{font-weight:700;white-space:nowrap}

/* Metin sayfaları (web-gizlilik.html) */
.prose{padding-top:24px;max-width:760px}
.prose h1{margin:0 0 4px;font-size:clamp(26px,7vw,34px);line-height:1.2}
.prose h2{margin:30px 0 8px;font-size:19px}
.prose p{margin:0 0 12px}
.prose .date{color:var(--muted);font-size:14px}
.prose .note{margin:20px 0;padding:14px 16px;background:var(--card);border-left:4px solid var(--accent);border-radius:8px}

/* Alt bilgi */
.foot{margin-top:56px;padding:20px 0 28px;border-top:1px solid var(--line);font-size:14px;color:var(--muted)}
.foot-in{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 16px}
.foot-links{display:flex;flex-wrap:wrap;gap:6px 18px}
.foot a{color:var(--muted)}
.foot a:hover{color:var(--accent)}

/* Dar telefonlar: kart dikey dizilir */
@media (max-width:420px){
  .card{flex-direction:column;align-items:stretch}
  .card-icon{width:72px;height:72px;border-radius:17px}
  .btn{display:block;text-align:center}
}
