:root{--zemin:#17120e;--yuzey:#241b14;--yuzey2:#32261c;--cizgi:#4a3a2b;--metin:#f3e6d3;--soluk:#b9a58c;--vurgu:#ffd54f;--k0:#ffd54f;--k1:#ff8a3d;--k2:#e53935;--m2w:#9b1c2e;--su:#4fc3f7}
*{box-sizing:border-box;margin:0;padding:0}
html{background:var(--zemin)}
body{font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:var(--metin);background:var(--zemin);line-height:1.55;-webkit-font-smoothing:antialiased}
a{color:inherit}
.kap{max-width:1040px;margin:0 auto;padding:0 20px}
header{padding:22px 0;display:flex;align-items:center;justify-content:space-between;gap:16px}
header img.logo{height:40px;width:auto}
nav{display:flex;gap:6px;flex-wrap:wrap}
nav a{padding:6px 12px;border-radius:999px;text-decoration:none;font-size:14px;color:var(--soluk);border:1px solid transparent}
nav a.aktif{color:var(--metin);border-color:var(--cizgi);background:var(--yuzey)}
.kahraman{padding:56px 0 40px;display:grid;grid-template-columns:1.2fr .8fr;gap:40px;align-items:center}
.etiket{display:inline-block;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--vurgu);border:1px solid var(--cizgi);padding:4px 10px;border-radius:999px;margin-bottom:16px}
h1{font-size:clamp(34px,5.6vw,58px);line-height:1.08;letter-spacing:-.02em;margin-bottom:18px}
h1 em{font-style:normal;color:var(--vurgu)}
.alt{font-size:18px;color:var(--soluk);max-width:560px;margin-bottom:28px}
.dugmeler{display:flex;gap:12px;flex-wrap:wrap}
.dugme{display:inline-flex;align-items:center;gap:8px;padding:14px 22px;border-radius:14px;font-weight:700;text-decoration:none;border:0;cursor:pointer;font-size:16px}
.dugme.ana{background:var(--vurgu);color:var(--zemin)}
.dugme.ikincil{background:transparent;color:var(--metin);border:1px solid var(--cizgi)}
.dugme[aria-disabled=true]{opacity:.5;pointer-events:none}
.sahne{aspect-ratio:1;max-width:380px;justify-self:center;width:100%}
.bolum{padding:44px 0;border-top:1px solid var(--cizgi)}
.bolum h2{font-size:28px;margin-bottom:8px}
.bolum p.giris{color:var(--soluk);margin-bottom:24px;max-width:680px}
.yol{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.adim{background:var(--yuzey);border:1px solid var(--cizgi);border-radius:16px;padding:18px;position:relative}
.adim .gun{font-size:12px;color:var(--soluk);text-transform:uppercase;letter-spacing:.08em}
.adim h3{font-size:19px;margin:6px 0}
.adim p{font-size:14px;color:var(--soluk)}
.adim .renk{width:28px;height:6px;border-radius:3px;margin-bottom:12px}
.adim.burada{outline:2px solid var(--vurgu);outline-offset:-2px}
.izgara{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.kart{background:var(--yuzey);border:1px solid var(--cizgi);border-radius:16px;padding:20px}
.kart h3{font-size:18px;margin-bottom:6px;display:flex;align-items:center;gap:10px}
.kart p{color:var(--soluk);font-size:15px}
.kart .beceri{display:inline-block;margin-top:10px;font-size:12px;padding:3px 9px;border-radius:999px;background:var(--yuzey2);color:var(--metin)}
.soz{background:var(--yuzey);border:1px solid var(--cizgi);border-radius:16px;padding:22px;display:flex;gap:18px;align-items:flex-start}
.soz blockquote{font-style:italic;font-size:18px}
.soz cite{display:block;margin-top:8px;color:var(--soluk);font-style:normal;font-size:14px}
.kural{list-style:none;display:grid;gap:10px}
.kural li{background:var(--yuzey);border:1px solid var(--cizgi);border-radius:12px;padding:12px 14px}
footer{padding:36px 0 48px;color:var(--soluk);font-size:14px;border-top:1px solid var(--cizgi);display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
footer a{color:var(--soluk)}
@media (max-width:820px){.kahraman{grid-template-columns:1fr;padding-top:28px}.sahne{max-width:260px;order:-1}.yol{grid-template-columns:repeat(2,1fr)}.izgara{grid-template-columns:1fr}nav{display:none}}