:root{--zemin:#0b1424;--yuzey:#111d33;--cizgi:#22314f;--metin:#eef2f7;--soluk:#a9b4c7;--yesil:#2fbf71;--yesil-koyu:#1f8f53}
*{box-sizing:border-box;margin:0}
html{-webkit-text-size-adjust:100%}
body{min-height:100vh;display:flex;flex-direction:column;background:var(--zemin);color:var(--metin);
  font:16px/1.6 system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif}
.kap{width:100%;max-width:720px;margin:0 auto;padding:0 16px}
header{border-bottom:1px solid var(--cizgi)}
header .kap{display:flex;align-items:center;gap:10px;min-height:64px}
.isaret{width:28px;height:28px;flex:none}
.marka{font-weight:700;font-size:1.125rem;letter-spacing:-.01em}
main{flex:1;padding:48px 0 56px}
.rozet{display:inline-block;font-size:.8125rem;font-weight:600;color:var(--yesil);border:1px solid var(--yesil-koyu);
  border-radius:999px;padding:2px 12px;margin-bottom:20px}
h1{font-size:clamp(1.75rem,5vw,2.5rem);line-height:1.2;letter-spacing:-.02em;margin-bottom:16px}
.giris{color:var(--soluk);font-size:1.0625rem;max-width:60ch}
ul{list-style:none;padding:0;margin:32px 0;display:grid;gap:12px}
li{background:var(--yuzey);border:1px solid var(--cizgi);border-radius:10px;padding:14px 16px}
li strong{display:block}
li span{color:var(--soluk);font-size:.9375rem}
.not{border-left:3px solid var(--yesil);padding:4px 0 4px 14px;color:var(--soluk);font-size:.9375rem}
footer{border-top:1px solid var(--cizgi);color:var(--soluk);font-size:.875rem}
footer .kap{padding-top:20px;padding-bottom:24px}
a{color:var(--metin);text-underline-offset:3px}
a:focus-visible{outline:2px solid var(--yesil);outline-offset:2px;border-radius:2px}
@media (min-width:640px){ul{grid-template-columns:1fr 1fr}}