
:root{--forest:#16332A;--forest-deep:#102520;--moss:#245040;--sage:#5C7D6F;
--brass:#C9A84C;--brass-lt:#F0D999;--brass-pale:#F5E3B0;
--paper:#FCFBF7;--warm:#F5F2E9;--ink:#16211D;--soft:#4E5B55;--rule:#D9D3C4;
--f:'Karla',system-ui,sans-serif;--h:'Fraunces',Georgia,serif;--n:'IBM Plex Mono',ui-monospace,monospace}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
html{scroll-behavior:smooth}
body{font-family:var(--f);background:var(--paper);color:var(--ink);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
:focus-visible{outline:2px solid var(--brass);outline-offset:3px}
.shell{max-width:1120px;margin:0 auto;padding:0 clamp(1.1rem,4vw,2rem)}
.skip{position:absolute;left:-9999px;background:var(--brass);color:var(--forest-deep);padding:.8rem 1.3rem;font-weight:700}
.skip:focus{left:0;top:0;z-index:99}

.mast{background:var(--forest);border-bottom:1px solid rgba(252,251,247,.16)}
.mast-in{max-width:1120px;margin:0 auto;padding:0 clamp(1.1rem,4vw,2rem);min-height:74px;display:flex;align-items:center;justify-content:space-between;gap:1.2rem}
.mark{font-family:var(--h);font-size:1.25rem;font-weight:600;color:var(--paper);letter-spacing:-.015em}
.mark em{font-style:normal;font-weight:400;color:var(--brass-lt)}
.mnav{display:flex;gap:1.3rem;list-style:none;font-size:.9rem;font-weight:500}
.mnav a{color:rgba(252,251,247,.88);padding-bottom:3px;border-bottom:1.5px solid transparent}
.mnav a:hover{color:var(--paper);border-bottom-color:var(--brass)}
@media(max-width:840px){.mnav{display:none}}

/* hero */
.hero{background:var(--forest);color:var(--paper);padding:clamp(3.4rem,8vw,6rem) 0 clamp(3rem,6vw,4.6rem);position:relative;overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(to bottom,transparent 0 46px,rgba(252,251,247,.075) 46px 47px);mask-image:linear-gradient(to bottom,transparent,#000 48%,transparent);-webkit-mask-image:linear-gradient(to bottom,transparent,#000 48%,transparent)}
.hero::after{content:"";position:absolute;right:-10%;top:-20%;width:min(620px,58vw);aspect-ratio:1;background:radial-gradient(circle,rgba(201,168,76,.13) 0%,transparent 66%)}
.hero-in{position:relative;z-index:2;max-width:46ch}
.kick{display:inline-flex;align-items:center;gap:.55rem;font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--brass-pale);margin-bottom:1.5rem}
.kick::before{content:"";width:2.2rem;height:1.5px;background:var(--brass)}
h1{font-family:var(--h);font-weight:500;font-size:clamp(2.1rem,5.6vw,3.5rem);line-height:1.08;letter-spacing:-.03em;margin-bottom:1.2rem}
h1 em{font-style:italic;font-weight:400;color:var(--brass-pale)}
.hero p{font-size:1.07rem;line-height:1.72;color:rgba(252,251,247,.92);max-width:44ch}
.hero .mini{margin-top:1.7rem;padding-top:1.3rem;border-top:1px solid rgba(252,251,247,.22);display:flex;flex-wrap:wrap;gap:.5rem 1.8rem;font-size:.88rem;color:rgba(252,251,247,.86)}
.hero .mini span{display:flex;align-items:center;gap:.45rem}
.hero .mini svg{width:1rem;height:1rem;color:var(--brass)}

/* araçlar */
.tools{padding:clamp(3rem,6vw,4.6rem) 0}
.sh{max-width:50ch;margin-bottom:2.6rem}
.sh .k{display:inline-flex;align-items:center;gap:.55rem;font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--moss);margin-bottom:1rem}
.sh .k::before{content:"";width:2.2rem;height:1.5px;background:var(--brass)}
.sh h2{font-family:var(--h);font-weight:500;font-size:clamp(1.7rem,3.6vw,2.5rem);line-height:1.16;letter-spacing:-.025em;color:var(--forest);margin-bottom:.9rem}
.sh p{color:var(--soft);line-height:1.72}

.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.3rem}
@media(max-width:820px){.grid{grid-template-columns:1fr}}
.card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--rule);border-top:3px solid var(--brass);padding:1.9rem;transition:.2s}
.card:hover{transform:translateY(-3px);box-shadow:0 12px 34px rgba(20,37,31,.1);border-color:var(--sage);border-top-color:var(--brass)}
.card .no{font-family:var(--n);font-size:.74rem;font-weight:600;letter-spacing:.12em;color:var(--sage);margin-bottom:1rem}
.card .ic{width:2.6rem;height:2.6rem;color:var(--brass);margin-bottom:1.1rem}
.card h3{font-family:var(--h);font-size:1.3rem;font-weight:600;color:var(--forest);line-height:1.26;margin-bottom:.6rem;letter-spacing:-.015em}
.card .q{font-size:1rem;line-height:1.6;color:var(--ink);font-weight:500;margin-bottom:.7rem}
.card p{font-size:.94rem;line-height:1.66;color:var(--soft);flex:1;margin-bottom:1.3rem}
.card .go{display:inline-flex;align-items:center;gap:.5rem;font-weight:700;font-size:.93rem;color:var(--moss);border-bottom:2px solid var(--brass);padding-bottom:2px;align-self:flex-start}
.card:hover .go{color:var(--forest)}
.card .meta{font-family:var(--n);font-size:.75rem;color:var(--sage);margin-top:.9rem;padding-top:.9rem;border-top:1px solid var(--rule)}

/* kim için */
.who{background:var(--warm);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);padding:clamp(2.8rem,6vw,4.2rem) 0}
.wg{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));border-top:1.5px solid var(--forest)}
.wg>div{padding:1.6rem 1.5rem 1.6rem 0;border-bottom:1px solid var(--rule)}
.wg>div+div{padding-left:1.5rem;border-left:1px solid var(--rule)}
.wg h3{font-family:var(--h);font-size:1.08rem;font-weight:600;color:var(--forest);margin-bottom:.5rem}
.wg p{font-size:.94rem;color:var(--soft);line-height:1.66}
@media(max-width:760px){.wg>div+div{padding-left:0;border-left:none}}

/* kim yazdı */
.by{padding:clamp(2.8rem,6vw,4.2rem) 0}
.by-g{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:clamp(1.6rem,4vw,3.2rem);align-items:start}
@media(max-width:860px){.by-g{grid-template-columns:1fr}}
.by h2{font-family:var(--h);font-weight:500;font-size:clamp(1.6rem,3.4vw,2.2rem);line-height:1.18;letter-spacing:-.022em;color:var(--forest);margin-bottom:1rem}
.by p{color:var(--soft);line-height:1.74;margin-bottom:1rem;max-width:58ch}
.by p b{color:var(--ink);font-weight:700}
.cbox{border:1px solid var(--rule);border-top:3px solid var(--forest);background:#fff;padding:1.6rem}
.cbox .nm{font-family:var(--h);font-size:1.1rem;font-weight:600;color:var(--forest);margin-bottom:.3rem}
.cbox .ro{font-size:.88rem;color:var(--sage);margin-bottom:1.1rem}
.cbox ul{list-style:none;display:grid;gap:.55rem;font-size:.9rem;color:var(--soft);margin-bottom:1.3rem}
.cbox li{display:grid;grid-template-columns:1rem 1fr;gap:.7rem;line-height:1.55}
.cbox li svg{width:1rem;height:1rem;color:var(--brass);margin-top:.22rem}
.btn{display:block;text-align:center;font-weight:700;font-size:.95rem;padding:.82rem 1.2rem;background:var(--brass);color:var(--forest-deep);border:1.5px solid var(--brass);border-radius:2px}
.btn:hover{background:var(--brass-pale);border-color:var(--brass-pale)}
.btn2{display:block;text-align:center;margin-top:.6rem;font-size:.88rem;color:var(--moss);border-bottom:1px solid var(--rule);padding-bottom:.5rem}

.cta{background:var(--forest-deep);color:var(--paper);padding:clamp(2.8rem,6vw,4.2rem) 0}
.cta-in{display:flex;justify-content:space-between;align-items:center;gap:2rem;flex-wrap:wrap}
.cta h2{font-family:var(--h);font-size:clamp(1.5rem,3.2vw,2.2rem);font-weight:500;line-height:1.2;max-width:24ch;letter-spacing:-.02em}
.cta p{color:rgba(252,251,247,.88);margin-top:.7rem;max-width:44ch;font-size:1rem}
.cta .btn{display:inline-block;padding:.95rem 2rem;font-size:1rem}

footer{background:var(--forest-deep);color:rgba(252,251,247,.78);padding:2.6rem 0 1.4rem;font-size:.9rem;border-top:1px solid rgba(252,251,247,.14)}
.fg{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:2rem;padding-bottom:1.8rem}
@media(max-width:700px){.fg{grid-template-columns:1fr 1fr}}
@media(max-width:480px){.fg{grid-template-columns:1fr}}
.fg .fl{font-family:var(--h);font-size:1.08rem;color:var(--paper);margin-bottom:.6rem}
.fg .fl em{font-style:normal;color:var(--brass-lt)}
.fg p{color:rgba(252,251,247,.76);line-height:1.7;max-width:34ch}
.fg h4{font-size:.74rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--brass-pale);margin-bottom:.9rem}
.fg ul{list-style:none;display:grid;gap:.45rem}
.fg a{color:rgba(252,251,247,.82)}
.fg a:hover{color:var(--brass-pale)}
.fb{border-top:1px solid rgba(252,251,247,.18);padding-top:1.2rem;font-size:.82rem;color:rgba(252,251,247,.64);display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap}

/* ═══ öğretici bileşenler ═══ */
.lead{max-width:62ch}
.prose{max-width:66ch}
.prose h2{font-family:var(--h);font-weight:500;font-size:clamp(1.45rem,3vw,1.95rem);line-height:1.2;letter-spacing:-.022em;color:var(--forest);margin:2.6rem 0 .9rem}
.prose h2:first-child{margin-top:0}
.prose h3{font-family:var(--h);font-size:1.1rem;font-weight:600;color:var(--moss);margin:1.9rem 0 .5rem}
.prose p{margin-bottom:1.05rem;line-height:1.75}
.prose ul,.prose ol{margin:1rem 0 1.5rem;padding-left:0;list-style:none;display:grid;gap:.7rem}
.prose li{display:grid;grid-template-columns:.5rem 1fr;gap:.9rem;line-height:1.68}
.prose li::before{content:"";width:.45rem;height:.45rem;margin-top:.62rem;background:var(--brass);border-radius:50%}
.prose b{color:var(--forest);font-weight:700}
.prose a{color:var(--moss);border-bottom:1px solid rgba(201,168,76,.65)}
.prose a:hover{color:var(--forest)}

.ozet{background:var(--forest);color:var(--paper);padding:1.7rem 1.9rem;margin:2.4rem 0;border-bottom:3px solid var(--brass)}
.ozet .t{font-size:.74rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--brass-pale);margin-bottom:.9rem}
.ozet ol{list-style:none;display:grid;gap:.75rem;counter-reset:o}
.ozet li{display:grid;grid-template-columns:1.6rem 1fr;gap:.9rem;font-size:1rem;line-height:1.6;color:rgba(252,251,247,.95);counter-increment:o}
.ozet li::before{content:counter(o);font-family:var(--n);font-size:.85rem;font-weight:600;color:var(--brass);padding-top:.1rem}

.yanlis{background:#FBF0EE;border:1px solid rgba(138,46,46,.22);border-left:3px solid #8A2E2E;padding:1.3rem 1.5rem;margin:1.9rem 0}
.yanlis .t{font-family:var(--n);font-size:.72rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#8A2E2E;margin-bottom:.5rem}
.yanlis q{display:block;font-family:var(--h);font-size:1.08rem;font-style:italic;color:#6B2222;margin-bottom:.7rem;line-height:1.45}
.yanlis p{margin:0;font-size:.95rem;color:#5E2424;line-height:1.68}
.dogru{background:#E6F0EA;border:1px solid rgba(36,80,64,.22);border-left:3px solid var(--moss);padding:1.3rem 1.5rem;margin:1.9rem 0}
.dogru .t{font-family:var(--n);font-size:.72rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--moss);margin-bottom:.5rem}
.dogru p{margin:0;font-size:.95rem;color:#1F4335;line-height:1.68}

.ornek{background:#fff;border:1px solid var(--rule);border-top:3px solid var(--brass);padding:1.6rem 1.8rem;margin:2rem 0}
.ornek .t{font-family:var(--h);font-size:1.08rem;font-weight:600;color:var(--forest);margin-bottom:1rem}
.orow{display:flex;justify-content:space-between;gap:1rem;padding:.55rem 0;border-bottom:1px solid #EDEAE1;font-size:.96rem}
.orow:last-child{border-bottom:none}
.orow span{color:var(--soft)}
.orow b{font-family:var(--n);font-variant-numeric:tabular-nums;color:var(--ink)}
.orow.tot{border-top:1.5px solid var(--forest);margin-top:.4rem;padding-top:.7rem;font-weight:700}
.orow.tot b{color:var(--forest)}
.orow.good b{color:var(--moss)}

.terim{border-bottom:1px dotted var(--sage);cursor:help;color:var(--moss)}
.terim:hover{border-bottom-style:solid;color:var(--forest)}

.yazdir{display:inline-flex;align-items:center;gap:.5rem;font-size:.9rem;font-weight:700;color:var(--moss);border:1.5px solid var(--rule);background:#fff;padding:.6rem 1.1rem;border-radius:2px;cursor:pointer;font-family:inherit}
.yazdir:hover{border-color:var(--moss)}
.yazdir svg{width:1rem;height:1rem}
@media print{
  .mast,.cta,footer,.yazdir,.skip,.tools,.who{display:none!important}
  body{background:#fff;font-size:12pt}
  .phead,.hero{background:#fff!important;color:#000!important;padding:0 0 1rem!important}
  .phead h1,.hero h1{color:#000!important}
  .phead p,.hero p{color:#333!important}
  .phead::before,.hero::before,.hero::after{display:none!important}
  .ozet{background:#f4f4f4!important;color:#000!important;border:1px solid #999}
  .ozet li,.ozet .t{color:#000!important}
  a{text-decoration:none;color:#000}
}

.sonraki{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1rem;margin:2.6rem 0 0;padding-top:2rem;border-top:1px solid var(--rule)}
.sonraki a{background:#fff;border:1px solid var(--rule);border-left:3px solid var(--brass);padding:1.1rem 1.3rem}
.sonraki a:hover{border-color:var(--sage);border-left-color:var(--brass)}
.sonraki b{display:block;font-family:var(--h);font-size:1rem;color:var(--forest);margin-bottom:.3rem}
.sonraki span{font-size:.88rem;color:var(--soft);line-height:1.55}

.oku{background:var(--warm);border-top:1.5px solid var(--forest);padding:1.8rem 0 2.2rem;margin-top:2.6rem}
.oku-h{display:flex;align-items:baseline;gap:.8rem;flex-wrap:wrap;margin-bottom:1.2rem}
.oku-h b{font-family:var(--h);font-size:1.12rem;font-weight:600;color:var(--forest)}
.oku-h span{font-size:.86rem;color:var(--sage)}
.oku-g{display:grid;grid-template-columns:repeat(auto-fit,minmax(255px,1fr));gap:1rem}
.oku-g a{background:#fff;border:1px solid var(--rule);border-left:3px solid var(--brass);padding:1.1rem 1.3rem;display:block}
.oku-g a:hover{border-color:var(--sage);border-left-color:var(--brass);transform:translateY(-2px)}
.oku-g b{display:block;font-family:var(--h);font-size:1rem;color:var(--forest);line-height:1.35;margin-bottom:.35rem}
.oku-g span{display:block;font-size:.88rem;color:var(--soft);line-height:1.55;margin-bottom:.7rem}
.oku-g em{font-style:normal;font-family:var(--n);font-size:.75rem;color:var(--sage)}
