/* fmjapps — gizlilik politikası sayfalarının ortak stili.
   Her uygulama klasöründeki index.html bunu ../policy.css olarak bağlar. */

:root{
  --bg:#0A0D18;
  --surface:#12162B;
  --rule:#232A47;
  --text:#EDEFF7;
  --text-dim:#9AA2C4;
  --gold:#FFC94B;
  --blue:#6FA8FF;
  --green:#5FE0A6;
  --red:#FF6E6E;
  color-scheme:dark;
}
*{box-sizing:border-box;}
body{
  background:var(--bg);
  color:var(--text);
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  margin:0;
  padding:0 20px;
  padding-block:56px 80px;
}
.page{max-width:640px;margin:0 auto;display:flex;flex-direction:column;gap:8px;}
.spectrum{
  height:4px;width:96px;border-radius:2px;margin-bottom:20px;
  background:linear-gradient(90deg, var(--red), var(--gold), var(--green), var(--blue));
}
.eyebrow{
  display:flex;align-items:center;gap:10px;font-size:12px;letter-spacing:0.08em;
  text-transform:uppercase;color:var(--text-dim);margin-bottom:14px;
}
.eyebrow .dot{width:6px;height:6px;border-radius:50%;background:var(--gold);flex:none;}
h1{
  font-family:'Sora',sans-serif;font-weight:700;font-size:clamp(28px,5vw,36px);
  line-height:1.15;letter-spacing:-0.01em;margin:0 0 6px;text-wrap:balance;
}
.updated{color:var(--text-dim);font-size:14px;margin-bottom:8px;font-variant-numeric:tabular-nums;}
.lede{color:var(--text-dim);font-size:16px;line-height:1.7;max-width:60ch;margin:18px 0 8px;}
section{padding-top:34px;border-top:1px solid var(--rule);margin-top:34px;}
section:first-of-type{margin-top:38px;}
h2{
  font-family:'Sora',sans-serif;font-weight:600;font-size:19px;color:var(--gold);
  margin:0 0 12px;display:flex;align-items:baseline;gap:10px;text-wrap:balance;
}
h2 .num{font-family:'Inter',sans-serif;font-weight:600;font-size:13px;color:var(--text-dim);font-variant-numeric:tabular-nums;}
p{color:#C7CADB;font-size:15.5px;line-height:1.75;max-width:64ch;margin:0 0 14px;}
p:last-child{margin-bottom:0;}
ul{color:#C7CADB;font-size:15.5px;line-height:1.75;max-width:64ch;margin:0 0 14px;padding-left:20px;}
li{margin-bottom:8px;}
a{color:var(--blue);text-decoration-color:rgba(111,168,255,0.4);text-underline-offset:3px;}
a:hover{text-decoration-color:var(--blue);}
a:focus-visible{outline:2px solid var(--blue);outline-offset:3px;border-radius:2px;}

/* özet rozetleri — sayfanın en üstündeki dört maddelik özet */
.chip-row{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 4px;}
.chip{
  display:inline-flex;align-items:center;gap:6px;background:var(--surface);
  border:1px solid var(--rule);color:var(--text-dim);font-size:13px;padding:6px 12px;border-radius:999px;
}
.chip b{color:var(--text);font-weight:600;}

/* izin listesi — sol sütunda izin adı, sağında ne işe yaradığı */
.perms{list-style:none;padding:0;margin:0 0 14px;display:flex;flex-direction:column;gap:12px;}
.perms li{
  display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:start;
  max-width:64ch;margin:0;
}
.perm{
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12px;
  color:var(--gold);background:var(--surface);border:1px solid var(--rule);
  border-radius:8px;padding:4px 9px;white-space:nowrap;margin-top:3px;
}

.callout{
  margin-top:16px;padding:15px 17px;border-radius:12px;background:var(--surface);
  border:1px solid var(--rule);color:var(--text-dim);font-size:14.5px;line-height:1.7;max-width:64ch;
}
.callout b{color:var(--text);font-weight:600;}

/* TR bölümünün bittiği, EN bölümünün başladığı ayraç */
.lang-divider{
  margin:64px 0 8px;display:flex;align-items:center;gap:16px;color:var(--text-dim);
  font-size:12px;letter-spacing:0.08em;text-transform:uppercase;
}
.lang-divider::before,.lang-divider::after{content:"";height:1px;background:var(--rule);flex:1;}
.lang-divider + h1{margin-top:24px;font-size:clamp(24px,4.4vw,30px);}

footer{
  margin-top:44px;padding-top:22px;border-top:1px solid var(--rule);color:var(--text-dim);
  font-size:13px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;
}

@media (max-width:520px){
  .perms li{grid-template-columns:1fr;gap:6px;}
  .perm{justify-self:start;}
}
@media (max-width:480px){
  body{padding-block:40px 64px;}
  section{padding-top:26px;margin-top:26px;}
}