/* santiye3d — koyu kraliyet moru. Başlık: Clash Display, metin: Geist. */
:root{
  --zemin:#22103A;
  --yuzey:#2F1950;
  --yuzey-2:#1B0C2F;
  --cizgi:#4A2E73;
  --yazi:#FFFFFF;
  --soluk:#CDBDE6;
  --sonuk:#9C88BE;
  --mor:#9B6BE0;
  --b:"Clash Display", "Geist", system-ui, sans-serif;
  --f:"Geist", system-ui, sans-serif;
  --gen:min(1120px, 100% - 40px);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;color-scheme:dark}
body{margin:0;background:var(--zemin);color:var(--yazi);font-family:var(--f);font-size:17px;line-height:1.6}
a{color:var(--soluk);text-underline-offset:3px}
a:hover{color:#fff}
:focus-visible{outline:2px solid var(--mor);outline-offset:3px;border-radius:4px}
.kap{width:var(--gen);margin-inline:auto}
.gizli{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Üst */
.ust{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:24px 0}
.logo{display:inline-flex;align-items:baseline;gap:0;color:#fff;text-decoration:none;font-family:var(--b);font-weight:600;font-size:26px;letter-spacing:-.01em}
.logo svg{width:32px;height:32px;flex:none}
.ust nav{display:flex;gap:24px;font-size:16px}
.ust nav a{color:var(--soluk);text-decoration:none}
.ust nav a:hover,.ust nav a[aria-current]{color:#fff}

/* Giriş */
.giris{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:56px;align-items:center;padding:64px 0 40px}
.giris h1{margin:0;font-family:var(--b);font-weight:600;font-size:clamp(42px,5.4vw,72px);line-height:1.02;letter-spacing:-.01em;text-wrap:balance}
.giris p{margin:22px 0 0;color:var(--soluk);font-size:19px;max-width:44ch}
.btn{display:inline-flex;align-items:center;min-height:50px;padding:0 22px;border-radius:10px;font:inherit;font-weight:600;font-size:16px;text-decoration:none;cursor:pointer;border:1px solid transparent}
.btn-ak{background:#fff;color:var(--zemin)}
.btn-ak:hover{background:#EDE4F8;color:var(--zemin)}
.btn-cer{background:transparent;color:#fff;border-color:var(--cizgi)}
.btn-cer:hover{border-color:var(--soluk);color:#fff}
.eylem{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}

/* Hesap kartı */
.kart{background:var(--yuzey);border:1px solid var(--cizgi);border-radius:18px;padding:26px}
.kart h2{margin:0;font-size:16px;font-weight:500;color:#fff}
.kart .sonuc{color:#fff;max-width:none;margin:10px 0 2px;font-family:var(--b);font-weight:600;font-size:40px;line-height:1.1;letter-spacing:-.01em}
.kart .sonuc small{font-size:24px;margin-left:4px}
.kart .ozet{max-width:none;margin:0 0 18px;color:var(--soluk);font-size:15px}
.alanlar{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.alan{display:grid;gap:6px;background:var(--yuzey-2);border-radius:10px;padding:10px 12px;font-size:13px;color:var(--sonuk)}
.alan input,.alan select{font:inherit;font-size:18px;font-weight:500;color:#fff;background:transparent;border:0;padding:0;width:100%;appearance:none;-webkit-appearance:none;-moz-appearance:textfield}
.alan input::-webkit-outer-spin-button,.alan input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.alan select option{background:var(--yuzey-2)}
.alan:focus-within{outline:1px solid var(--mor)}
.kart .eylem{margin-top:16px}
.kart .btn{min-height:42px;font-size:15px;padding:0 16px}
.durum{align-self:center;font-size:14px;color:var(--soluk)}

/* Bölümler */
.bolum{padding-top:104px}
.bolum h2{margin:0 0 8px;font-family:var(--b);font-weight:600;font-size:clamp(30px,3.4vw,42px);line-height:1.1;letter-spacing:-.005em}
.bolum .alt-bas{margin:0 0 26px;color:var(--soluk);max-width:58ch}
.liste{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.liste a{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 24px;align-items:center;padding:22px 24px;background:var(--yuzey);border:1px solid var(--cizgi);border-radius:14px;color:#fff;text-decoration:none}
.liste a:hover{border-color:var(--sonuk)}
.liste b{font-family:var(--b);font-weight:500;font-size:22px}
.liste span{grid-column:1;color:var(--soluk);font-size:15px}
.liste em{grid-column:2;grid-row:1/3;font-style:normal;font-weight:600;font-size:15px;color:var(--soluk)}

.iki{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:64px;align-items:start}
.iki p{color:var(--soluk);max-width:52ch}
.iki .denklem{color:#fff;font-family:var(--b);font-weight:500;font-size:24px}
.tablo{width:100%;border-collapse:collapse;font-size:16px}
.tablo th,.tablo td{padding:11px 6px;text-align:right;border-bottom:1px solid var(--cizgi)}
.tablo th:first-child,.tablo td:first-child{text-align:left}
.tablo thead th{color:var(--sonuk);font-weight:500;font-size:14px;border-bottom-color:var(--soluk)}
.tablo td{color:var(--soluk)}
.tablo tr.secili td{color:#fff;font-weight:600}
.not{font-size:14px;color:var(--sonuk)}

.alt{margin-top:128px;border-top:1px solid var(--cizgi);padding:28px 0 40px;font-size:14px;color:var(--sonuk)}
.alt .kap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px 24px}
.alt p{margin:0}
.alt a{color:var(--sonuk)}
.alt nav{display:flex;gap:20px}

@media (max-width:860px){
  .giris{grid-template-columns:1fr;gap:36px;padding-top:36px}
  .iki{grid-template-columns:1fr;gap:40px}
  .bolum{padding-top:80px}
}
@media (max-width:520px){
  .ust nav{gap:16px;font-size:15px}
  .ust nav .opsiyon{display:none}
  .alanlar{grid-template-columns:1fr 1fr}
  .alanlar .alan:first-child{grid-column:1/-1}
  .liste a{padding:18px}
}

/* Alt sayfalar */
.logo .nokta{display:inline-block;width:.2em;height:.2em;background:var(--mor);margin-left:.06em}
.sayfa-bas{padding:56px 0 8px;max-width:760px}
.yol{margin:0 0 14px;font-size:14px;color:var(--sonuk)}
.yol a{color:var(--sonuk)}
.sayfa-bas h1{margin:0;font-family:var(--b);font-weight:600;font-size:clamp(38px,4.8vw,60px);line-height:1.04;text-wrap:balance}
.sayfa-bas p{margin:18px 0 0;color:var(--soluk);font-size:19px;max-width:58ch}
.icerik{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:64px;align-items:start;margin-top:48px}
.icerik h2{margin:0 0 12px;font-family:var(--b);font-weight:600;font-size:28px;line-height:1.15}
.icerik h2:not(:first-child){margin-top:44px}
.icerik p,.icerik li{color:var(--soluk);max-width:60ch}
.icerik b{color:#fff;font-weight:600}
.icerik ul,.icerik ol{margin:0;padding-left:1.2em;display:grid;gap:10px}
.icerik li::marker{color:var(--sonuk)}
.icerik small{color:var(--sonuk)}
.denklem{color:#fff!important;font-family:var(--b);font-weight:500;font-size:22px;background:var(--yuzey);border:1px solid var(--cizgi);border-radius:12px;padding:16px 18px}
.tablo caption{text-align:left;color:var(--soluk);font-size:15px;margin-bottom:8px}
.sss{display:grid;border-top:1px solid var(--cizgi)}
.sss details{border-bottom:1px solid var(--cizgi);padding:16px 0}
.sss summary{cursor:pointer;font-weight:600;color:#fff;list-style:none;display:flex;justify-content:space-between;gap:16px}
.sss summary::-webkit-details-marker{display:none}
.sss summary::after{content:"+";color:var(--sonuk)}
.sss details[open] summary::after{content:"−"}
.sss details p{margin:10px 0 0}
.kart.genis .alanlar{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:860px){.icerik{grid-template-columns:1fr;gap:40px}.kart.genis .alanlar{grid-template-columns:1fr 1fr}}
.kart .sonuc small{color:#fff}.icerik .kart h2{font-size:20px;margin-top:0}
