@font-face {
  font-family: 'Chivo';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/va9I4kzIxd1KFrBnQeNVkqDOeTY.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

@font-face {
  font-family: 'Chivo';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/va9I4kzIxd1KFrBmQeNVkqDOeTY.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Chivo';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/va9I4kzIxd1KFrBoQeNVkqDO.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Chivo';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/assets/fonts/va9I4kzIxd1KFrBnQeNVkqDOeTY.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

@font-face {
  font-family: 'Chivo';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/assets/fonts/va9I4kzIxd1KFrBmQeNVkqDOeTY.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Chivo';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/assets/fonts/va9I4kzIxd1KFrBoQeNVkqDO.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Chivo';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url(/assets/fonts/va9I4kzIxd1KFrBnQeNVkqDOeTY.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

@font-face {
  font-family: 'Chivo';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url(/assets/fonts/va9I4kzIxd1KFrBmQeNVkqDOeTY.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Chivo';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url(/assets/fonts/va9I4kzIxd1KFrBoQeNVkqDO.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa2JL7W0Q5n-wU.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa0ZL7W0Q5n-wU.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa2ZL7W0Q5n-wU.woff2) format('woff2');
  unicode-range: U+1F00-1FFF;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa1pL7W0Q5n-wU.woff2) format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa2pL7W0Q5n-wU.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa25L7W0Q5n-wU.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa1ZL7W0Q5nw.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa2JL7W0Q5n-wU.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa0ZL7W0Q5n-wU.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa2ZL7W0Q5n-wU.woff2) format('woff2');
  unicode-range: U+1F00-1FFF;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa1pL7W0Q5n-wU.woff2) format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa2pL7W0Q5n-wU.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa25L7W0Q5n-wU.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa1ZL7W0Q5nw.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/assets/fonts/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa2JL7W0Q5n-wU.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/assets/fonts/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa0ZL7W0Q5n-wU.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/assets/fonts/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa2ZL7W0Q5n-wU.woff2) format('woff2');
  unicode-range: U+1F00-1FFF;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/assets/fonts/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa1pL7W0Q5n-wU.woff2) format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/assets/fonts/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa2pL7W0Q5n-wU.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/assets/fonts/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa25L7W0Q5n-wU.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/assets/fonts/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa1ZL7W0Q5nw.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/assets/fonts/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa2JL7W0Q5n-wU.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/assets/fonts/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa0ZL7W0Q5n-wU.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/assets/fonts/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa2ZL7W0Q5n-wU.woff2) format('woff2');
  unicode-range: U+1F00-1FFF;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/assets/fonts/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa1pL7W0Q5n-wU.woff2) format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/assets/fonts/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa2pL7W0Q5n-wU.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/assets/fonts/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa25L7W0Q5n-wU.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/assets/fonts/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa1ZL7W0Q5nw.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Okul Rehberlik · DERS DEFTERI
   Duzen: defter cizgili zemin, sol yesil marj kurali, solda dev baslik +
   sagda ders plani. Ritim vurgulu kutu: onemli tanim fosforlu blokta durur.
   Kart izgarasi YOK. Resmi kilavuz yonlendirmeleri lacivert kurali blokta,
   defter estetiginden bilincli olarak ayrisir.
   Palet: Pantone 15-0343 Greenery. Aydinlik, koyu tema yok. */

:root{
  --font-display:"Chivo","Helvetica Neue",Helvetica,Arial,sans-serif;
  --font-body:"Inter","Helvetica Neue",Helvetica,Arial,sans-serif;

  --brand:#4E8A3C;           /* Greenery */
  --brand-koyu:#37662A;
  --brand-acik:#A8CE97;
  --ikincil:#26547C;         /* lacivert: resmi kilavuz bloklari */
  --ikincil-acik:#DCE6EF;

  --bg:#F6FAF4; --kagit:#FFFFFF;
  --ink:#131C10; --ink-2:#3F4E3A; --ink-3:#6F7E69;
  --cizgi:#DDE8D6; --link:#37662A; --focus:#4E8A3C;

  --fosfor:#FBF4C6;          /* fosforlu kalem vurgusu */
  --fosfor-kenar:#E9D976;

  --defter:rgba(78,138,60,.10);   /* yatay defter cizgisi, cok soluk */
  --marj-c:rgba(78,138,60,.42);   /* sol dikey marj kurali */

  --satir:1.75rem;           /* defter satir yuksekligi, metin buna oturur */
  --wrap:70rem; --dar:44rem;
  --h1:clamp(2.3rem,1.25rem + 3.6vw,4.1rem);
  --h1-w:900;
}

/* --- Defter zemini -------------------------------------------------------
   Yatay cizgiler yalnizca main icinde; baslik ve alt bilgi temiz kagit.
   Cizgi rengi %10 alfa: fark edilir ama metnin onune gecmez. */
main{
  background-image:linear-gradient(to bottom,transparent calc(var(--satir) - 1px),var(--defter) calc(var(--satir) - 1px));
  background-size:100% var(--satir);
  background-position:left top;
}
main p,main li,main dd,main figcaption{line-height:var(--satir)}

.wrap,.dar{padding-left:0}

/* --- Baslik seridi -------------------------------------------------------- */
.chrome{position:sticky;top:0;z-index:60;background:var(--kagit);border-bottom:1px solid var(--cizgi)}
.chrome .bar{display:flex;align-items:center;gap:var(--space-5);padding:var(--space-4) 0}
.brand{display:inline-flex;align-items:center;gap:.5rem;font-family:var(--font-display);
  font-weight:900;font-size:1.06rem;letter-spacing:-.02em;color:var(--brand-koyu);text-decoration:none}
.brand .mark{color:var(--brand)}
.nav{display:flex;gap:var(--space-5);margin-left:auto;flex-wrap:wrap}
.nav a{color:var(--ink-2);text-decoration:none;font-size:.9rem;font-weight:500}
.nav a:hover{color:var(--brand-koyu)}
.nav a[aria-current="page"]{color:var(--brand-koyu);box-shadow:inset 0 -2px 0 var(--brand)}
.navtoggle{display:none;margin-left:auto;background:none;border:0;color:var(--ink);padding:var(--space-2);cursor:pointer;line-height:0}

.crumbs{padding:var(--space-5) 0 0;font-size:.85rem;color:var(--ink-3)}
.crumbs a{color:var(--ink-3)}

/* --- Hero: solda dev baslik, sagda ders plani ----------------------------- */
.hero{padding:var(--space-8) 0 var(--space-7);border-bottom:1px solid var(--cizgi)}
.hero-ic{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:var(--space-7) var(--space-8);align-items:start}
.ust-etiket{font-family:var(--font-display);font-weight:700;font-size:.76rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--brand-koyu);margin:0 0 var(--space-4)}
.hero h1{margin-bottom:var(--space-5);max-width:17ch}
.hero .lede{color:var(--ink-2);max-width:48ch}

/* Ders plani: kart degil, numarali defter listesi */
.plan{border-top:3px double var(--brand);padding-top:var(--space-4)}
.plan-ust{font-family:var(--font-display);font-weight:700;font-size:.76rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--brand-koyu);margin:0 0 var(--space-3)}
.plan-liste{list-style:none;margin:0;padding:0;counter-reset:pl}
.plan-liste li{counter-increment:pl;display:flex;gap:var(--space-3);align-items:baseline;
  padding:.42rem 0;border-bottom:1px solid var(--cizgi)}
.plan-liste li::before{content:counter(pl,decimal-leading-zero);font-family:var(--font-display);
  font-weight:700;font-size:.74rem;color:var(--brand);flex:0 0 1.6rem;letter-spacing:.04em}
.plan-liste a{color:var(--ink);text-decoration:none;font-size:.95rem;font-weight:500}
.plan-liste a:hover{color:var(--brand-koyu);text-decoration:underline;text-underline-offset:.2em}
.kunye{margin:var(--space-4) 0 0;font-size:.86rem;color:var(--ink-3);max-width:34ch}
.kunye b{font-family:var(--font-display);font-weight:900;color:var(--brand-koyu);font-size:1.05rem}

/* --- Genis fotograf bandi ------------------------------------------------- */
.bant{padding:var(--space-7) 0 0}
.bant figure img{width:100%;aspect-ratio:21/8;object-fit:cover}
.bant figcaption{color:var(--ink-3)}

/* --- Defter govdesi ------------------------------------------------------- */
.defter{padding:var(--space-7) 0 var(--space-8)}
.defter h2{margin:var(--space-8) 0 var(--space-4);padding-bottom:.55rem;
  border-bottom:3px double var(--brand-acik);max-width:34ch;font-size:clamp(1.4rem,1.15rem + 1.1vw,2rem)}
.defter h2:first-child{margin-top:0}
.defter h3{margin-bottom:var(--space-2)}
.defter p{color:var(--ink-2)}
.defter>p:first-child{margin-top:0}
.defter ul{max-width:var(--measure);color:var(--ink-2);padding-left:1.15rem}
.defter li{margin-bottom:var(--space-2)}
.defter figure{margin:var(--space-7) 0}
.defter figure img{width:100%;aspect-ratio:16/9;object-fit:cover}

/* --- Vurgulu kutu: fosforlu kalem hissi, duz kenar ------------------------ */
.vurgu{background:var(--fosfor);border-left:5px solid var(--fosfor-kenar);
  padding:var(--space-4) var(--space-5);margin:var(--space-5) 0;max-width:var(--measure)}
.vurgu p{color:var(--ink);margin:0}

/* --- Lacivert kural blogu: resmi kilavuz, defterden ayrisir --------------- */
.kural{border:2px solid var(--ikincil);border-left-width:8px;background:var(--kagit);
  padding:var(--space-5);margin:var(--space-7) 0;max-width:52rem}
.kural-ust{font-family:var(--font-display);font-weight:700;font-size:.74rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--ikincil);margin:0 0 var(--space-2)}
.kural p:last-child{margin-bottom:0;color:var(--ink);max-width:60ch}

/* --- Numarali adimlar: defter maddesi ------------------------------------- */
.steps{list-style:none;counter-reset:ad;margin:var(--space-6) 0;padding:0;max-width:52rem}
.steps li{counter-increment:ad;position:relative;padding:0 0 var(--space-4) 3rem;
  border-bottom:1px solid var(--cizgi);margin-bottom:var(--space-4)}
.steps li:last-child{border-bottom:0}
.steps li::before{content:counter(ad);position:absolute;left:0;top:0;
  font-family:var(--font-display);font-weight:900;font-size:1.25rem;color:var(--brand)}
.steps h3{margin:0 0 var(--space-2);font-size:1.05rem}
.steps p{margin:0;color:var(--ink-2)}

/* --- Dizin: ana sayfa icindekiler, kart degil ----------------------------- */
.dizin{list-style:none;counter-reset:dz;margin:0;padding:0}
.dizin li{counter-increment:dz;display:grid;grid-template-columns:2.6rem minmax(0,15rem) minmax(0,1fr);
  gap:var(--space-2) var(--space-4);align-items:baseline;
  padding:var(--space-4) 0;border-bottom:1px solid var(--cizgi)}
.dizin li:first-child{border-top:1px solid var(--cizgi)}
.dizin li::before{content:counter(dz,decimal-leading-zero);font-family:var(--font-display);
  font-weight:700;font-size:.8rem;color:var(--brand);letter-spacing:.04em}
.dizin a{font-family:var(--font-display);font-weight:700;font-size:1.05rem;color:var(--ink);
  text-decoration:none;letter-spacing:-.012em}
.dizin a:hover{color:var(--brand-koyu);text-decoration:underline;text-underline-offset:.2em}
.dizin span{color:var(--ink-2);font-size:.94rem}

/* --- Ilgili sayfalar seridi ------------------------------------------------ */
.callout{border-top:1px solid var(--cizgi);margin:var(--space-7) 0 0;padding:var(--space-4) 0 0}
.callout p{margin:0;font-size:.92rem;color:var(--ink-3);max-width:none}
.callout a{color:var(--link)}

/* --- Alt bilgi: acik yesil kagit, koyu bant yok --------------------------- */
footer{background:#EEF4EA;border-top:3px double var(--brand-acik);margin-top:var(--space-8);
  padding:var(--space-7) 0 var(--space-8)}
.footlinks{display:flex;flex-wrap:wrap;gap:var(--space-2) var(--space-5);margin-bottom:var(--space-5);
  padding-bottom:var(--space-5);border-bottom:1px solid var(--cizgi)}
.footlinks a{color:var(--link);text-decoration:none;font-size:.92rem}
.footlinks a:hover{text-decoration:underline}
footer p{max-width:64ch;font-size:.87rem;color:var(--ink-3)}

/* --- Sol marj kurali: yalnizca genis ekranda ------------------------------ */
@media (min-width:64rem){
  .wrap,.dar{padding-left:3.4rem}
  main{
    --marj-x:calc(50% - min(100% - var(--space-5)*2,var(--wrap))/2 + 1.7rem);
    background-image:
      linear-gradient(to right,transparent 0,transparent var(--marj-x),
        var(--marj-c) var(--marj-x),var(--marj-c) calc(var(--marj-x) + 2px),
        transparent calc(var(--marj-x) + 2px)),
      linear-gradient(to bottom,transparent calc(var(--satir) - 1px),var(--defter) calc(var(--satir) - 1px));
    background-size:100% 100%,100% var(--satir);
    background-repeat:no-repeat,repeat;
  }
}

@media (max-width:64rem){
  .hero-ic{grid-template-columns:1fr;gap:var(--space-6)}
  .plan{max-width:40rem}
  .dizin li{grid-template-columns:2.2rem 1fr}
  .dizin span{grid-column:2}
}

@media (max-width:46rem){
  /* Dar ekranda defter cizgisi okunurlugu bozmasin: daha da soluk */
  :root{--defter:rgba(78,138,60,.055)}
  .chrome .bar{flex-wrap:wrap;row-gap:0}
  .navtoggle{display:inline-flex}
  .nav{flex-basis:100%;margin-left:0;flex-direction:column;gap:0;overflow:hidden;height:0}
  .nav a{padding:var(--space-3) 0;border-top:1px solid var(--cizgi);font-size:1.02rem}
  .nav a[aria-current="page"]{box-shadow:none;font-weight:700}
  html.no-js .nav{height:auto}
  .hero{padding:var(--space-6) 0}
  .bant figure img{aspect-ratio:4/3}
  .kural{padding:var(--space-4);border-left-width:6px}
  .vurgu{padding:var(--space-4)}
}